/*
Theme Name: Comcage - Version 1
Theme URI: http://www.comcage.com
Description: The original theme developed for Comcage by Comcage, LLC.
Version: 1.0
Author: Comcage, LLC.
Author URI: http://www.comcage.com
Tags: Comcage
*/

/* Begin Page Styling */
body { font-family: arial, verdana; font-size: 12px; color: #282828; background: #f3f3f3; }

/* Logo */
h1 { float: left; width: 270px; height: 109px; }
h1 a { display: block; width: 100%; height: 100%; overflow: hidden; }

/* Containers and Wraps */
#header { position: relative; z-index: 30; background: url('images/bgLogo.gif') repeat; height: 109px; }
#footerDividerWrap { clear: both; background: #f3f3f3; }
#footerDivider { margin: 0 auto; background: url('images/bgFooterDivider.gif') no-repeat; width: 940px; height: 8px; text-indent: -9999px; }
#footer { background: #f3f3f3; padding: 15px 0 5px 0; color: #6c6c6c; }
.wrapper { margin: 0 auto; width: 940px; position: relative; }
#containerStretch { background: #FFF; overflow: hidden; }
#container { margin: 0 auto; width: 940px; padding: 0 0 20px 0; background: #FFF; overflow: hidden; }

/* Sub Page Columns */
.subCol1 { float: left; width: 642px; } /* Left Column */
.subCol2 { float: left; margin-left: 18px; width: 280px; margin-bottom: 30px; color: #6c6c6c; } /* Right Column */

/* Main Menu */
#mainNav { position: relative; float: right; padding-top: 80px; }
#mainNav > li { float: left; position: relative; }
#mainNav > li > a { 
	float: left; 
	display: block;
	color: #999; 
	text-decoration: none;
	padding: 3px 7px;
	font-size: 14px;
	font-weight: bold;
	border-right: 1px solid #666;
}
#mainNav > li:last-child > a { border: none; }
#mainNav > li > a:hover { color: #FFF; background: #e57910; font-weight: bold; }

/* Drop Downs */
#mainNav > li > ul { position: absolute; left: -5px; top: 0px; z-index: 50; padding-top: 29px; width: 150px; display: none; }
#mainNav > li > ul > li { display: inline; }
#mainNav > li > ul > li > a { display: block; background: #242424; padding: 5px 10px; color: #999; text-decoration: none; border-bottom: 1px solid #555; line-height: 25px; }
#mainNav > li > ul > li > a:hover { color: #FFF; }

/* Footer Menu */
#menuFooter { text-align: center; padding: 0px 0 20px 0; }
#menuFooter li { display: inline-block; font-size: 11px; border-left: 1px solid #6c6c6c; }
*+html #menuFooter li { display: inline; }
#menuFooter li:first-child { border: none; }
#menuFooter a { display: inline-block; color: #6c6c6c; text-decoration: none; padding: 3px 7px; line-height: 18px; height: 18px; margin: 3px; }
#menuFooter a:hover { color: #FFF; background: #e57910; }
#menuFooter li ul { display: none; }

/* Visual Banner Content */
#bannerTall { text-shadow: 1px 1px 1px #333; background: url('images/bgVisualStretchGreenTall.jpg') repeat; height: 241px; color: #FFF; }
#bannerShort { text-shadow: 1px 1px 1px #333; background: url('images/bgVisualStretchGreenTall.jpg') repeat; height: 142px; color: #FFF; }
#bannerShadow { background: url('images/bgVisualDropShadow.gif') repeat; height: 27px; text-indent: -9999px; }
.bannerTallCol1 { position: relative; float: left; width: 580px; height: 241px; }
.bannerTallCol2 { float: left; width: 360px; text-align: right; }
h2 { font-size: 32px; font-weight: bold; padding-top: 20px; padding-bottom: 5px; } /* Page Title */
h2.lines2 { padding-top: 35px; }
h3 { font-size: 17px; font-weight: bold; padding-bottom: 5px; } /* Page Caption */
#bannerSub  { position: relative; height: 142px; width: 600px; }
.bannerText { font-size: 14px; padding: 10px 0; }
.bannerButton { position: absolute; top: 200px; left: 0; z-index: 10; display: inline-block; padding: 5px 7px; background: #7fa334; text-align: center; font-weight: bold; }
.bannerLink { position: absolute; top: 0; left: 0; z-index: 20; display: block; width: 100%; height: 100%; }

/* Right Column Grey Box */
.box1Top { background: url('images/bgRightBoxTop.gif') no-repeat; width: 280px; height: 11px; line-height: 11px; text-indent: -9999px; }
.box1Btm { clear: both; background: url('images/bgRightBoxBtm.gif') no-repeat; width: 280px; height: 12px; text-indent: -9999px; margin: 0 0 20px 0; }
.box1Mid { overflow: hidden; width: 238px; padding: 0 20px; background: #f8f8f8; border-left: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf; }

/* Main Page - Service Boxes */
#serviceBoxes { margin: 0 0 20px 0; }
#serviceBoxes li { display: inline-block; position: relative; }
*+html #serviceBoxes li { display: inline; /* for IE7 */ }
#serviceBoxes li h4 { color: #FFF; font-size: 17px; font-weight: bold; text-align: center; padding-top: 5px; }
#serviceBoxes li p { display: block; color: #9f9f9f; font-size: 14px; padding: 10px 7px 0 7px; text-align: center; }
#serviceBoxes li a { position: absolute; top: 0; left: 0; z-index: 20; width: 202px; height: 212px; text-decoration: none; text-indent: -9999px; }
.serviceBoxGreen { background: url('images/bgServiceBoxGreen.png') no-repeat; width: 202px; height: 212px; }
.serviceBoxOrange { background: url('images/bgServiceBoxOrange.png') no-repeat; width: 202px; height: 212px; margin-right: 18px; }
.serviceBoxBlue { background: url('images/bgServiceBoxBlue.png') no-repeat; width: 202px; height: 212px; margin-right: 18px; }

/* Standard Styling */
.standardP { line-height: 20px; font-size: 12px; padding: 0 0 20px; }
.standardA { color: #3080A6; text-decoration: none; }
.standardA:hover { text-decoration: underline; }

/* Title Styles */
.titleStyle1 { font-size: 24px; margin: 0 0 10px 0; } /* Content Title */
.titleStyle2 { font-size: 16px; font-weight: bold; padding: 0 0 10px 0; color: #6c6c6c; } /* Footer Title */
.titleStyle3 { font-size: 18px; color: #6c6c6c; text-align: center; padding: 4px 0 10px 0; } /* Right Box Header */
.titleStyle4 { font-size: 24px; margin: 0 0 20px 0; padding: 0 0 10px 0; border-bottom: 1px dashed #ddd; }

/* Headings */
h4.style4 { font-size: 14px; font-weight: bold; text-indent: 0; color: #3080a6; }
h4.style5 { font-size: 14px; font-weight: bold; text-indent: 0; padding-top: 7px; color: #3080a6; }
h4.style6 { font-size: 24px; }
h6.siteTitle { color: #6b970c; font-weight: bold; padding-bottom: 10px; }

/* Text Styling */
.textStyle1 { font-size: 11px; text-align: center; padding-bottom: 20px; color: #999; } /* Footer Content */
.blueText { color: #398fb9; font-weight: bold; }
.bold { font-weight: bold; }

/* List Styling */
.listStyle1, .listStyle2, .listStyle3, .listStyle4 { margin: 10px 0 10px 25px; }
.listStyle1 li { list-style: disc; }
.listStyle2 li { list-style: decimal; }
.listStyle3 li { list-style: lower-alpha; }
.listStyle4 li { list-style: lower-roman; }

/* Form Styling */
.form1 { padding: 5px 0 20px 0; }
.form1 label { display: block; line-height: 35px; font-size: 18px; color: #6C6C6C; }
.form1 input[type="text"], .form1 textarea { font-family: arial, verdana; padding: 5px; font-size: 16px; background: #EEE; border: 1px solid #DDD; color: #6C6C6C; width: 500px; }
.form1 input[type="submit"] { display: block; line-height: 0; padding: 0; text-indent: -9999px; margin-top: 10px; border: none; background: url('images/submit.png') no-repeat; cursor: pointer; width: 148px; height: 44px; }

.form2 { padding: 0 0 0 0; }
.form2 label { display: block; line-height: 30px; font-size: 14px; color: #6C6C6C; }
.form2 input[type="text"], .form2 textarea { font-family: arial, verdana; padding: 3px; font-size: 12px; background: #EEE; border: 1px solid #DDD; color: #6C6C6C; width: 220px; }
.form2 textarea { height: 80px; }
.form2 input[type="checkbox"] { width: 20px; }
.form2 input[type="submit"] { display: block; float: left; line-height: 0; padding: 0; text-indent: -9999px; margin-top: 10px; border: none; background: url('images/submit.png') no-repeat; cursor: pointer; width: 148px; height: 44px; }

/* Link Styling */
.linkStyle1 { color: #398FB9; text-decoration: none; font-weight: bold; font-size: 14px; }
.linkStyle1:hover { text-decoration: underline; }

/* Contact Form 7 */
.wpcf7-form-control-wrap { position: relative; }
.wpcf7-not-valid-tip-no-ajax { padding: 5px; color: #A90000; border: 1px solid #A90000; background: #F8E5E5; }
.wpcf7-validation-errors { padding: 5px; color: #A90000; border: 1px solid #A90000; background: #F8E5E5; }
.wpcf7-not-valid-tip { position: absolute; top: 10%; left: 10%; padding: 5px; color: #A90000; border: 1px solid #A90000; background: #F8E5E5; }
.wpcf7-mail-sent-ok { color: #84AA0F; border: 1px solid #84AA0F; background: #F1F8E7; padding: 10px; }

/* Featured Project */
#featuredProjectImgWrap { position: relative; width: 238px; height: 175px; text-align: center; }
#featuredProjectImg { background: url('images/bgFeaturedProject.png') no-repeat center 0; width: 238px; height: 175px; }
#featuredProjectImg img { position: absolute; top: 9px; left: 7px; }
#featuredProjectText { padding: 10px 0; color: #848383; line-height: 16px; font-size: 12px; }
#featuredProjectBtn { background: url('images/btnSeeMoreWork.gif') no-repeat center 0; width: 238px; height: 42px; text-align: center; }
#featuredProjectBtn a { display: block; width: 100%; height: 100%; text-indent: -9999px; overflow: hidden; }

/* Featured Project Tooltip */
.tooltip { display: none; width: 450px; border: 2px solid #cdcdcd; padding: 10px; background: url('images/bgWhiteTransTT.png') repeat; }
.siteImageTT { width: 450px; padding-bottom: 10px; }
.firstImage { padding-right: 10px; }
table { width: 450px; color: #999; }
td { padding: 5px 5px 5px 0; }
.tableTitle { width: 150px; color: #6b970c; font-weight: bold; }
.tableActive { color: #282828; }

/* Portfolio Page Styling */
.gallery { padding-bottom: 10px; margin-bottom: 15px; border-bottom: 1px dashed #DFDFDF; }
.gallery a { text-decoration: none; color: #398fb9; }
.gallery a:hover { font-weight: bold; }
.gallery li { width: 180px; display: inline-block; margin: 10px 24px 0 0; text-align: center; line-height: 25px; }
*+html .gallery li { display: inline; }

/* Contact Page */
.contactBox { padding: 0 0; }
.contactBox dt { float: left; border-top: 1px solid #EEE; font-size: 14px; width: 100px; font-weight: bold; line-height: 20px; padding: 10px 15px 10px 0; color:  }
.contactBox dt.special, .contactBox dd.special { border-top: none; }
.contactBox dd { float: left; border-top: 1px solid #E9E9E9; width: 123px; line-height: 20px; padding: 10px 0; }
.clearFloat { clear: both; }