@import url('reset.css');

body{ background:url(../images/bg_top.png) repeat; color:#444; font:normal 14px/1.5 'news-gothic-std', Arial, Helvetica, sans-serif; }
a{ color:#005f99; text-decoration:none; }
a:hover{ text-decoration:underline; }
.right{ float:right !important; }
.left{ float:left !important; }
.input-text{ background:url(../images/bg_input.jpg) repeat-x #fff; height:31px; font:normal 16px/31px Arial, Helvetica, sans-serif; color:#000; padding:0 8px; outline:none; border:1px solid #cfcfcf; -webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); -moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); font:normal 16px/31px Arial, Helvetica, sans-serif; color:#000; display:block; }
.input-textarea{ background:url(../images/bg_input.jpg) top repeat-x #fff; font:normal 16px/31px Arial, Helvetica, sans-serif; color:#000; padding:4px; outline:none; border:1px solid #cfcfcf; -webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); -moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); font:normal 16px/18px Arial, Helvetica, sans-serif; color:#000; resize:none; }

/*** LAYOUT STYLES ***/

.wrap{ width:960px; margin:0 auto; }
#masthead{ border-bottom:1px solid #dedede; }
#masthead .wrap{ padding:30px 0 60px; }
#content{ background:#f4f4f4; border-bottom:1px solid #fff; border-top:1px solid #fff; padding-bottom:60px; }
#footer{ border-top:1px solid #dedede; }
#footer .wrap{ margin-top:-52px; padding-top:150px; background:url(../images/logo_footer.png) 50% 19px no-repeat; }

/******* Masthead ******/

#logo{ float:left; }

#masthead #contractors{ float:right; background:url(../images/icon_contractor.png) left no-repeat; height:43px; padding:11px 0 0 60px; font-size:12px; font-weight:bold; margin-top:-12px; }
#masthead #contractors strong{ font:bold 19px/1 'news-gothic-std', Arial, Helvetica, sans-serif; text-transform:uppercase; color:#77787b; display:block; }
#masthead #contractors:hover{ text-decoration:none; }

/******* Home  *****/

.hero{ background:url(../images/bg_homeHero.png) repeat-x; height:324px; margin-top:-54px; color:#fff; padding:33px 36px 15px; position:relative; }
.hero h3{ font-size:24px; line-height:1; z-index:5; position:relative; }
.hero h2{ font-size:39px; line-height:1; margin-top:5px; z-index:5; position:relative; }
.hero ul{ margin-top:15px; z-index:5; position:relative; float:left; }
.hero ul li{ background:url(../images/checkmark_white.png) left no-repeat; padding-left:23px; font-size:17px; font-weight:bold; margin-top:3px; z-index:5; }
.post-it{ position:absolute; bottom:46px; right:26px; background:url(../images/yellowSticky_background.png) repeat; padding:15px; font:bold 15px/1.1 Arial, Helvetica, sans-serif; color:#030303; width:230px; -webkit-box-shadow: 0px 2px 4px #000000; -moz-box-shadow: 0px 2px 4px #000000; box-shadow: 0px 2px 4px #000000; z-index:10; }
.hero .try-btn{ background:#00203e; padding:4px; float:left; clear:both; display:block; margin-top:13px; border-bottom:1px solid #00498a; }
.hero .try-btn span{ background:url(../images/btn_greenBg.png) top repeat-x; padding:0 20px; height:55px; font-weight:bold; text-transform:uppercase; color:#f7f7f7; font-size:30px; line-height:55px; text-align:center; display:block; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); text-shadow: -1px -1px 0px #3d6900; filter: dropshadow(color=#3d6900, offx=-1, offy=-1); }
.hero .try-btn:hover,
.hero .try-btn:hover span{ text-decoration:none; background-position:bottom; }

#hero-a h2{ width:465px; }
#hero-a img{ position:absolute; bottom:0; right:35px; z-index:1; }

#hero-b{ overflow:hidden; }
#hero-b ul{ float:left; width:480px; }
#hero-b .post-it{ left:33px; }
#hero-b .try-btn{ clear:none; }
#hero-b #price-bubble{ position:absolute; top:18px; left:84px; z-index:5; width:138px; height:111px; }
#hero-b #price-bubble img{ position:absolute; }
#hero-b #price-bubble #bubble_2,
#hero-b #price-bubble #bubble_3{ top:-300px; }
#hero-b #contractor-image{ position:relative; float:left; margin:-33px 15px 0 -36px; width:416px; height:372px; background:url(../images/slideshow/bg_contractor.jpg) left top no-repeat; }
#hero-b #contractor-image img{ position:absolute; }
#hero-b #contractor-image #contractor_2,
#hero-b #contractor-image #contractor_3{ display:none; }
#hero-b #profile-screen{ position:absolute; bottom:0; right:22px; z-index:4; width:223px; height:210px; }
#hero-b #profile-screen img{ position:absolute; }
#hero-b #profile-screen #screen_2,
#hero-b #profile-screen #screen_3{ bottom:-400px; }

#hero-c h2,
#hero-c h3{ z-index:5; position:relative; width:470px; }
#hero-c .post-it{ right:66px; }
#hero-c #slides{ width:558px; height:345px; background:url(../images/slideshow-c/bg_folder.jpg) right top no-repeat; bottom:0; right:57px; position:absolute; z-index:1; }
#hero-c #slides li{ background:none; padding:0; margin:0; z-index:1; }
#hero-c #slides li.slide{ position:absolute; }
#hero-c #slides li#slide-2,
#hero-c #slides li#slide-3{ display:none; }
#hero-c #slides #tabs{ margin:0; position:absolute; right:-35px; top:0; width:35px; height:345px; }
#hero-c #slides #tabs li{ width:35px; height:103px; overflow:hidden; margin-bottom:3px; position:relative; }
#hero-c #slides #tabs li a{ display:block; background:url(../images/slideshow-c/bg_tabs.png) no-repeat; width:35px; height:103px; text-indent:-9999px; }
#hero-c #slides #tabs li.tab0 a{ background-position:0 0; }
#hero-c #slides #tabs li.tab1 a{ background-position:0 -103px; }
#hero-c #slides #tabs li.tab2 a{ background-position:0 -206px; }
#hero-c #slides #tabs li.tab0.active a{ background-position:-35px 0; }
#hero-c #slides #tabs li.tab1.active a{ background-position:-35px -103px; }
#hero-c #slides #tabs li.tab2.active a{ background-position:-35px -206px; }

#intro{ background:url(../images/bg_intro.jpg) top no-repeat; height:200px; padding:40px 335px 0 0; margin-bottom:17px; }
#intro h2{ font-size:33px; line-height:1; color:#000; margin-bottom:5px; }
#intro p{ font-size:18px; line-height:24px; margin-bottom:24px; color:#444; }
#intro p strong{ color:#000; font-weight:bold; }

#features li h4{ font-size:26px; line-height:1; color:#000; margin-bottom:5px; }
#features li p{ font-size:18px; line-height:24px; color:#444; }
#ratings,
#service-badges,
#pictures,
#license{ border-bottom:6px solid #e0e0e0; }
#ratings{ background:url(../images/bg_ratings.jpg) left no-repeat; height:152px; padding:48px 0 0 335px; }
#service-badges{ background:url(../images/bg_badges.jpg) right no-repeat; height:140px; padding:40px 305px 0 0; }
#pictures{ background:url(../images/bg_pictures.jpg) left no-repeat; height:171px; padding:40px 0 0 335px; }
#license{ background:url(../images/bg_license.jpg) right no-repeat; height:125px; padding:40px 305px 0 0; }
#promos{ background:url(../images/bg_promos.jpg) left no-repeat; height:116px; padding:40px 0 0 335px; }
#tryitout{ background:url(../images/bg_tryitout.jpg) 0 27px no-repeat; height:57px; }
#tryitout a{ background:url(../images/btn_greenBg.png) top repeat-x; padding:0 20px; height:55px; width:170px; margin:0 auto; font-weight:bold; text-transform:uppercase; color:#f7f7f7; font-size:30px; line-height:55px; text-align:center; display:block; border:1px solid #366400; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); text-shadow: -1px -1px 0px #3d6900; filter: dropshadow(color=#3d6900, offx=-1, offy=-1); }
#tryitout a:hover{ text-decoration:none; background-position:bottom; }

/******* Steps *********/

#banner{ background:url(../images/bg_banner.png) repeat; height:106px; padding-left:35px; margin-top:-54px; }
#banner h1{ line-height:106px; font-size:43px; color:#fff; }

/** Progress indicator **/
#progress{ float:right; margin-top:-44px; width:184px; height:44px; }
#progress li{ float:left; margin:0 8px 0 4px; width:34px; height:44px; text-align:center; }
#progress li.current{ background:url(../images/bg_stepActive.jpg) 50% bottom no-repeat; }
#progress li span{ width:34px; height:36px; background:url(../images/bg_steps.jpg) 50% bottom no-repeat; display:block; font:bold 16px/36px Arial, Helvetica, sans-serif; color:#727272; }
#progress li.current span{ background-position:50% -36px; color:#fff; }
#progress li.complete span{ background-position:50% 0; color:#fff; }

#form{ background:url(../images/banner_shadow.jpg) top no-repeat; padding-top:38px; }
#form .fields{ float:left; margin-left:35px; padding-left:20px; width:626px; border-left:23px solid #e0e0e0; }
#form .fields h2{ font-size:33px; line-height:35px; color:#005f99; display:block; clear:both; }
#form .fields h2 strong{ color:#518800; }
#form .fields h3{ font-size:18px; color:#444; font-weight:normal; margin-bottom:8px; }
#form .fields h4{ font-size:18px; line-height:33px; color:#000; }

.fields li{ border-top:5px solid #e0e0e0; padding:15px 0; overflow:hidden; }
.fields li ul{ margin-top:5px; }
.fields li ul li{ border-width:1px 0 0; padding:10px 0; }
.fields li label{ font-size:18px; line-height:33px; color:#000; font-weight:bold; margin-right:8px; }
.fields li ul li label{ font:bold 13px/1.5 Arial, Helvetica, sans-serif; color:#000; float:left; }
.fields label span{ font-weight:normal; color:#7e7e7e; }
.fields span.value{ font-size:18px; color:#444; }
.fields .edit-services{ font:bold 11px/18px Arial, Helvetica, sans-serif; text-decoration:none; text-transform:uppercase; margin-left:15px; }
.fields .example{ display:block; border-top:1px solid #cfcfcf; margin:5px 0; padding-top:10px; font:normal 12px Arial, Helvetica, sans-serif; color:#444; }
.fields .example strong{ color:#000; }

/** Inactive styles **/
.fields li.inactive{ height:33px; }
.fields li.continue.inactive{ height:55px; }
.fields li.inactive label{ color:#b5b5b5; }
.fields li.inactive input,
.fields li.inactive span,
.fields li.inactive ul{ display:none; }

/** Radio button **/
.fields .radio{ background:#fff; border:1px solid #cfcfcf; float:left; padding:5px 6px; margin:0 8px 0 0; }
.fields .radio.valid{ background:#f2fbe3; border-color:#82aa2a; }
.fields .radio label{ font:normal 16px/1 Arial, Helvetica, sans-serif; color:#000; margin:0; cursor:pointer; }
.fields .radio input{ margin:0 2px 0 0; cursor:pointer; }

/** Dropdown **/
.fields .selector{ background:url(../images/select_bg.jpg) repeat-x; height:31px; border:1px solid #cfcfcf; position:relative; float:left; -webkit-box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); -moz-box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); box-shadow: 0px 1px 0px rgba(255, 255, 255, 1); padding-right:10px; clear:left; }
.fields .selector span{ display:block; padding-left:10px; width:130px; height:31px; font:normal 16px/31px Arial, Helvetica, sans-serif; color:#000; background:url(../images/select_arrow.gif) 97% 50% no-repeat; }
.fields .selector select{ position:absolute; top:0; left:0; z-index:5; }

/** Step 4 **/
.fields li .left{ width:260px; }
.fields li .right{ width:364px; }
.fields li .left .input-text,
.fields li .right .input-text{ width:220px; clear:left; }
.fields li #add-alt-phone,
.fields #del-alt-phone{ font:normal 11px/31px Arial, Helvetica, sans-serif; margin-left:15px; color:#005f99; cursor:pointer; float:left; }
#alternate-phone{ display:none; margin-top:10px; }

/** Input custom sizes **/
.fields #address{ width:608px; }
.fields #zip{ width:50px; margin-right:15px; display:inline-block; }
.fields #additional_details{ width:562px; height:87px; }
.fields #build_date{ width:42px; clear:left; }
.fields #project_size,
.fields #project_timeframe{ width:150px; }
.fields #project_property,
.fields #project_ownership{ width:235px; }
.fields #phone,
.fields #phone_alt{ display:inline; float:left; }

.continue-btn{ background:url(../images/btn_greenBg.png) top repeat-x; padding:0 20px; height:55px; font-weight:bold; color:#f7f7f7; font-size:30px; line-height:55px; text-align:center; display:block; -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.8); text-shadow: -1px -1px 0px #3d6900; filter: dropshadow(color=#3d6900, offx=-1, offy=-1); border:1px solid #366400; float:left; cursor:pointer; }
.continue-btn:hover{ text-decoration:none; background-position:bottom; }
.fields .inactive .continue-btn{ background:#e0e0e0; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; text-shadow:none; filter:none; border:none; cursor:default; display:block; }

/** Error styling **/
div.error-message{ background:#ffead3; border:1px solid #f8d7c7; font:bold 12px/30px Arial, Helvetica, sans-serif; color:#a33504; height:30px; display:block; float:left; padding:0 8px; margin-bottom:8px; }
.fields .field-error > label{ color:#a33504; }
.fields .field-error .error-arrow{ display:block; background:url(../images/arrow_errorMsg.gif) no-repeat; width:11px; height:5px; margin:5px 0 0 7px; clear:both; }
.fields .field-error label.error{ font:bold 12px/23px Arial, Helvetica, sans-serif; color:#fff; height:23px; background:#ac0707; padding:0 8px; float:left; clear:both; }
.fields .field-error input.error{ border-color:#e28e6d; }
.fields .field-valid > label{ background:url(../images/checkmark_valid.gif) right no-repeat; padding-right:23px; }
.fields .field-valid input.valid{ border-color:#82aa2a; background:#f2fbe3; }
.fields .field-valid .location{ background:url(../images/checkmark_valid.gif) right no-repeat; padding-right:23px; }
.fields .field-valid label[for=zip]{ background:none; padding-right:0; }

#disclaimer{ margin-top:20px; }
#disclaimer p{ font-size:16px; margin-bottom:18px; color:#444; }
#disclaimer cite{ font:normal 11px Arial, Helvetica, sans-serif; color:#000; }

/******** Popup **************/

.whiteOverlay{ background:#000; }

.popup{
	display:none;
	position:absolute;
	width:600px;
	margin-left:-223px;
	left:50%;
	z-index:10000;
    -moz-box-shadow: 0px 0px 20px #000;
	-webkit-box-shadow: 0px 0px 20px #000;
	box-shadow: 0px 0px 20px #000;
	background:#f7f7f7;
	border:1px solid #000;
	padding:30px 30px 45px;
	width:386px;
}

.jqmClose{
	background:url(../images/btn_popupClose.jpg) no-repeat;
	width:28px;
	height:28px;
	display:block;
	position:absolute;
	top:10px;
	right:10px;
	text-indent:-9999px;
	cursor:pointer;
}

.popup h3{ font-size:33px; line-height:1.2; color:#005f99; }
.popup h4{ font-size:18px; }
.popup .input-text{ width:368px; margin-bottom:15px; }
.popup #search-submit{ background:url(../images/icon_search.gif) no-repeat; width:11px; height:14px; border:none; outline:none; font-size:0; line-height:0; float:right; margin-top:-37px; margin-right:9px; position:relative; z-index:10; cursor:pointer; }

.scroll-pane{ margin:0 auto; width:384px; max-height:240px; overflow:auto; border:1px solid #cfcfcf; }
.scroll-pane input.hidden{ visibility:hidden; }
.scroll-pane li{ line-height:39px; font-size:13px; color:#444; font-family:Arial, Helvetica, sans-serif; padding:0 13px; border-bottom:1px solid #e0e0e0; background:#fff; }
.scroll-pane li .select-btn{ border:1px solid #d5d5d5; background:url(../images/bg_selectBtn.jpg) top repeat-x; width:53px; text-align:center; height:22px; font:normal 13px/22px Arial, Helvetica, sans-serif; color:#444; float:right; margin-top:8px; }
.scroll-pane li.selected{ background:#f2fbe3; }
.scroll-pane li .select-btn:hover, .scroll-pane li.selected .select-btn{ border-color:#366400; color:#fff; background-position:bottom; text-decoration:none; }

.jspContainer{ overflow: hidden; position: relative; }
.jspPane{ position: absolute; width:360px !important; }
.jspVerticalBar{ position: absolute; top: 0; right: 0; width: 23px; height: 100%; background:#e4e4e4; }
.jspHorizontalBar{ position: absolute; bottom: 0; left: 0; width: 100%; height: 23px; }
.jspVerticalBar *,
.jspHorizontalBar *{ margin: 0; padding: 0; }
.jspCap{ display: none; }
.jspHorizontalBar .jspCap{ float: left; }
.jspTrack{ position: relative; padding-left:1px; }
.jspDrag{ background:url(../images/scroll_bg.jpg) repeat-y; width:21px; position: relative; cursor: pointer; }
.jspDragTop{ background:url(../images/scroll_top.jpg) no-repeat; width:21px; height:12px; position:absolute; top:0; }
.jspDragBottom{ background:url(../images/scroll_btm.jpg) no-repeat; width:21px; height:12px; position:absolute; bottom:0; }
.jspHorizontalBar .jspTrack,
.jspHorizontalBar .jspDrag{ float: left; height: 100%; }
.jspCorner{ float: left; height: 100%; }


/******** Right column *******/

#right-col{ float:right; width:232px; }
#right-col .thumb{ border:1px solid #e0e0e0; -webkit-box-shadow: 0px 0px 5px #d6d6d6; -moz-box-shadow: 0px 0px 5px #d6d6d6; box-shadow: 0px 0px 5px #d6d6d6; }
#right-col .thumb #map{ border:3px solid #fff; width:223px; height:100px; }
#right-col .thumb img{ border:3px solid #fff; }
#right-col span{ font-size:15px; line-height:18px; color:#444; margin-top:5px; float:left; }
#right-col span strong{ color:#000; }
#right-col .edit{ font:normal 11px/18px Arial, Helvetica, sans-serif; display:block; float:left; width:100%; }
#right-col h4{ font-size:18px; color:#518800; border-top:5px solid #e0e0e0; padding-top:10px; margin-top:15px; }

#next-steps{ background:url(../images/bg_nextSteps.jpg) no-repeat; width:202px; height:188px; padding:15px; }
#next-steps h5{ font-size:18px; color:#005f99; }
#next-steps p{ font:normal 14px/16px Arial, Helvetica, sans-serif; color:#444; margin-bottom:5px; }
#next-steps li{ font:bold 12px/20px Arial, Helvetica, sans-serif; color:#000; background:url(../images/checkmark_blue.gif) 0 4px no-repeat; padding-left:17px; }

#project-details{ float:left; width:100%; margin-top:10px; }
#project-details dt{ border-top:1px solid #e0e0e0; padding-top:5px; font-weight:bold; line-height:20px; font-size:16px; color:#000; }
#project-details dd{ font-size:16px; color:#444; margin-bottom:5px; }
#project-details dd p{ font-size:13px; line-height:18px; margin-bottom:8px; }
#project-details dd p strong{ color:#000; }

/******* Searching page **********/

body#search{ background:#f4f4f4; }
#search .wrap{ margin-top:145px; width:900px; }
#searching{ float:left; width:412px; padding:0 0 15px 58px; margin-top:75px; border:solid #e0e0e0; border-width:5px 0; background:url(../images/map_icon.gif) 0 15px no-repeat; }
#searching #logo{ margin:-49px 0 0 -58px; }
#searching h1{ font-size:18px; line-height:21px; color:#000; margin:15px 0 5px; }
#searching h1 strong{ color:#005f99; }
#search #image{ float:right; width:373px; border:1px solid #e0e0e0; -webkit-box-shadow: 0px 0px 5px #d6d6d6; -moz-box-shadow: 0px 0px 5px #d6d6d6; box-shadow: 0px 0px 5px #d6d6d6; }
#search #image img{ border:10px solid #fff; }

/******* Footer ********/

#footer .copyright{ text-align:center; width:100%; font:normal 11px/21px Arial, Helvetica, sans-serif; }
#footer .copyright a{ font-weight:bold; text-transform:uppercase; margin:0 5px; }


/******* Self Clearing Floats ********/
.wrap:after{ content: "."; display: block; height: 0; clear: both; visibility: hidden; }