/* CSS Document */

body { margin: 0; padding: 0; background: #1A1A1A; font: normal 200 12px "Helvetica Neue", Arial, Helvetica, sans-serif; color: #FFF; letter-spacing: .03em; }

h1, h2, h3, h4, h5, h6, p, ul, li { margin: 0; padding: 0; }

p { margin-bottom: 15px; line-height: 16px; }
h1 { font-size: 24px; font-weight: 200; margin-bottom: 15px; }
h2 { font-size: 24px; font-weight: 100; margin-bottom: 10px; letter-spacing: .07em; }
h3 { font-size: 20px; font-weight: 400; margin-bottom: 10px; color: #007BEB; }
h4 { font-size: 20px; font-weight: 400; margin-bottom: 15px; }
	h4 a { color: #FF7F00; padding-right: 8px; text-decoration: none; }
	h4 a:hover { color: #FFF; }
h5 { font-size: 17px; font-weight: 200; margin-bottom: 10px; }
h6 { font-size: 14px; font-weight: 400; margin-bottom: 5px; }

a { color: #FF7F00; text-decoration: none; }
a:hover { color: #FFF; }

ul { list-style-position: inside; margin-bottom: 15px; }

.clear { clear: both; }

.title { color: #FF7F00; padding-right: 8px; }

.moreinfo { width: 112px; height: 27px; background: url(http://www.prosmartsystems.com/graphics/moreinfo-button.png) no-repeat; float: left; }

.alignleft { float: left; margin: 0 10px 10px 0; }
.alignright { float: right; margin: 0 0 10px 10px; }

/* ---------------------------------------------------------------- */
/* --------------------------- HEADERS ---------------------------- */
/* ---------------------------------------------------------------- */

#hdrWrap { margin: 0; padding: 0; height: 70px; width: 100%; background: url(http://www.prosmartsystems.com/graphics/hdr-bg-repeat.jpg) repeat-x; background-position: center; }
	#hdr { width: 900px; height: 70px; margin: 0 auto; background: url(http://www.prosmartsystems.com/graphics/hdr-bg-logo.jpg) repeat-x; background-position: center; }
	#navTop { float: right; height: 15px; margin-top: 15px; width: 200px; }
	#navTop ul { list-style: none; }
	#navTop li { float: right; display: inline; }
	#navTop a { float: left; display: block; color: #FFF; text-decoration: none; padding: 0px 12px; }
	#navTop a:hover { color: #FFF; text-decoration: underline; }
	.navDivider { border-right: 1px solid #FFF; }
	#navBottom { float: right; height: 40px; }
	
#hdrIndexWrap { margin: 0; padding: 12px 0 0 0; /* height: 270px; */ width: 100%; background: #e5e5e7 url(http://www.prosmartsystems.com/graphics/hdrIndex-bg-repeat.jpg) repeat-x; border-bottom: 2px solid #818181; }
	#hdrIndex { width: 900px; height: 270px; margin: 0 auto; }
	#hdrIndex-slider { width: 881px; height: 467px; margin: 0 auto 12px auto; padding: 7px 0 0 0; background: url(http://www.prosmartsystems.com/graphics/slider-large-bg.png) no-repeat top center; }
	.hdrIndex-slider-images { width: 865px; height: 458px; margin: 0px auto 0 auto; overflow: hidden; }

#hdrIndexWrap2 { margin: 0; padding: 0; /* height: 155px; */ width: 100%; background: #FFF; }
	#hdrIndex2-wrap { width: 900px; margin: 0 auto; }
	#hdrIndex2 { width: 460px; /* height: 155px; */ margin: 0 5px 12px 0; padding: 15px 0; float: right; }
	
.hdrColA { float: left; width: 214px; height: 115px; margin: 0 5px 5px 0; padding: 5px 0 0 10px; border-right: 1px solid #231F20; font-weight: 400; background: #f5f5f5 url(http://www.prosmartsystems.com/graphics/hdrCol-bg.jpg) repeat top center; border: 1px solid #ededed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.hdrColB { float: left; width: 210px; height: 115px; margin: 0 5px 0 0; padding: 5px 0 0 10px; font-weight: 400; background: #f5f5f5 url(http://www.prosmartsystems.com/graphics/hdrCol-bg.jpg) repeat top center; border: 1px solid #ededed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
	.hdrColA ul, .hdrColB ul { list-style-type: circle; list-style-position: inside; color: #000; margin: 0 0 10px 0; padding: 0 10px 0 0; }
	.hdrColA li, .hdrColB li { margin: 0 0 3px 0; }
	.hdrColA a, .hdrColB a { color: #007BEB; text-decoration: none; padding: 0 4px 0 6px; }
	.hdrColA a:hover, .hdrColB a:hover { color: #ff7f00; }
	.blueArrow { float: left; padding-top: 1px; }

#hdr2Wrap { margin: 0; padding: 0; width: 100%; height: 120px; background: url(http://www.prosmartsystems.com/graphics/hdr2-bg-repeat.jpg) repeat-x; }
	#hdr2 { width: 900px; height: 120px; margin: 0 auto; padding: 18px 0 0 0; }
	#hdr2 h1 { font-size: 42px; weight: 300; color: #ff7f00; margin: 0; padding: 0 0 0 13px; }
	#hdr2 h2 { font-size: 28px; weight: 100; color: #000; margin: 0; padding: 0 0 0 25px; }

/* ---------------------------------------------------------------- */
/* --------------------------- CONTENT ---------------------------- */
/* ---------------------------------------------------------------- */

#contentWrap { margin: 0; padding: 0; width: 100%; background: #3F3F3F; border-bottom: 1px solid #1A1A1A; border-top: 1px solid #1A1A1A; }
	#content { width: 900px; margin: 0 auto; padding: 15px 0; }
	#contentIndex { width: 900px; margin: 15px auto; background: url(graphics/index-ftr2-bg.jpg) repeat-y; }
	
.indexColA { float: left; width: 269px; padding: 0 15px; }
.indexColB { float: left; width: 270px; padding: 0 15px; }

.subCategories { width: 900px; line-height: 16px; margin: 10px 0 0 0; }
	.subCategories ul { list-style: none; border-top: 1px solid #FFF; padding: 0; }
	.subCategories li { border-left: 10px solid #FFF; margin: 15px 0; padding: 0 15px 0 25px; }
	.subCategories img { border: 1px solid #222; }

.colA { float: left; width: 269px; padding: 0 15px; margin: 15px 0 0 0; }
.colB { float: left; width: 270px; padding: 0 15px; margin: 15px 0 0 0; }
.colA img, .colB img { border: 1px solid #222; margin: 0 0 15px 0; }

.indexGallery { width: 269px; }
.indexGallery a img { width: 79px; height: 60px; border: 1px solid #FFF; float: left; margin: 0 0 12px 0; }
.indexGallery a:hover img { border: 1px solid #FF7F00; }
.indexGalleryColA { width: 94px; float: left; border: 0px solid #000; }
.indexGalleryColB { width: 80px; float: left; }

/* ---------------------------------------------------------------- */
/* ------------------------- NAVIGATION --------------------------- */
/* ---------------------------------------------------------------- */

/* A modified version of A List Apart - http://alistapart.com/articles/slidingdoors2/ */
#nav { float:left; width:100%; }
    #nav ul { margin:0; padding:16px 10px 0; list-style:none; }
    #nav li { float:right; display:inline; background:url(http://www.prosmartsystems.com/graphics/nav2-right_both.gif) no-repeat right top; margin:0 0 0 9px; padding:0; }
    #nav a { float:left; display:block; position:relative; left:-9px; margin-right:-9px; width:.1em; background:url(http://www.prosmartsystems.com/graphics/nav2-left_both.gif) no-repeat left top; padding:5px 15px; text-decoration:none; font-weight:normal; font-size: 11px; color:#FFF; }
    #nav > ul a {width:auto;} /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #nav a {float:none;} /* End IE5-Mac hack */
    #nav a:hover { color:#333; }
    #entertainment #nav-entertainment, #security #nav-security, #automation #nav-automation, #commercial #nav-commercial, #news #nav-news, #gallery #nav-gallery, #testimonials #nav-testimonials { background-position:100% -150px; }
    #entertainment #nav-entertainment a, #security #nav-security a, #automation #nav-automation a, #commercial #nav-commercial a, #news #nav-news a, #gallery #nav-gallery a, #testimonials #nav-testimonial a { background-position:0 -150px; padding-bottom:6px; color:#333; } /* not for IE5.x or IE6 */
    #nav li:hover, #nav li:hover a { background-position:100% -150px; color:#333; }
    #nav li:hover a { background-position:0 -150px; }

/* ---------------------------------------------------------------- */
/* --------------------------- FOOTER ----------------------------- */
/* ---------------------------------------------------------------- */

#ftrWrap { margin: 0; padding: 0; height: 70px; width: 100%; background: #1A1A1A; border-top: 2px solid #818181; }
	#ftr { width: 900px; margin: 0 auto; color: #FFF; padding: 12px 0; }
	
	#ftr-left { width: 49%; float: left; text-align: left; }
	#ftr-right { width: 49%; float: right; text-align: right; line-height: 18px; }
	
	#fb_logo { margin: 10px 0 15px 13px; }
	
	#ftrNav { }
		#ftrNav ul { list-style: none; padding: 0 0 6px 0; }
		#ftrNav li { display: inline; float: left; }
		#ftrNav a { display: block; color: #ff7f00; padding: 0 15px; text-decoration: none; }
		#ftrNav a:hover { color: #FFF; }
		.ftrNavDivider { border-right: 1px solid #FFF; }
		
/* ---------------------------------------------------------------- */
/* ---------------- WORDPRESS ELEMENTS - MISC. -------------------- */
/* ---------------------------------------------------------------- */
		
#box { float: left; width: 670px; padding: 0 20px 0 0; border-right: 1px solid #FFF; }

.sidebar { float: right; width: 190px; display: inline; list-style: none; }
	.sidebar h2 { font-size: 17px; font-weight: 200; margin-bottom: 3px; }
	.sidebar ul { list-style: none; margin: 0 0 15px 0; padding: 0; }
	.sidebar a { padding: 0 0 0 10px; }
		
.postmetadata { border: 1px solid #111; padding: 5px; background: #1A1A1A; margin: 0 0 20px 0; }
.postmetadata2 { float: right; line-height: 20px; margin: 0 0 10px 20px; border: 1px solid #111; padding: 2px 5px; background: #1A1A1A; }

.testimonial { width: 390px; float: left; padding: 10px 25px 0 25px; }

.galleries { width: 225px; text-align: center; float: left; }
.galleries a img { border: 1px solid #000; }
.galleries a:hover img { border: 1px solid #DDD; }

/* ---------------------------------------------------------------- */
/* --------------- WORDPRESS ELEMENTS - COMMENTS ------------------ */
/* ---------------------------------------------------------------- */
		
.comments-template { margin: 10px 0 0; border-top: 1px solid #ccc; padding: 10px 0 0; }
	.comments-template ol {	margin: 0; padding: 0 0 15px; list-style: none; }
	.comments-template ol li { margin: 10px 0 0; line-height: 18px; padding: 0 0 10px; border-bottom: 1px solid #ccc; }
	.comments-template h2, .comments-template h3 { font-size: 16px; }
	.commentmetadata { font-size: 12px; }
	.comments-template p.nocomments { padding: 0; }
	.comments-template textarea { font-size: 12px; }
