/*



Theme Name: Twenty Twelve



Theme URI: http://wordpress.org/themes/twentytwelve



Author: the WordPress team



Author URI: http://wordpress.org/



Description: The 2012 theme for WordPress is a fully responsive theme that looks great on any device. Features include a front page template with its own widgets, an optional display font, styling for post formats on both index and single views, and an optional no-sidebar page template. Make it yours with a custom menu, header image, and background.



Version: 1.3



License: GNU General Public License v2 or later



License URI: http://www.gnu.org/licenses/gpl-2.0.html



Tags: light, gray, white, one-column, two-columns, right-sidebar, flexible-width, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-templvate, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready



Text Domain: twentytwelve



This theme, like WordPress, is licensed under the GPL.



Use it to make something cool, have fun, and share what you've learned with others.



*/







/* =Notes



--------------------------------------------------------------



This stylesheet uses rem values with a pixel fallback. The rem



values (and line heights) are calculated using two variables:







$rembase:     14;



$line-height: 24;







---------- Examples







* Use a pixel value with a rem fallback for font-size, padding, margins, etc.



	padding: 5px 0;



	padding: 0.357142857rem 0; (5 / $rembase)







* Set a font-size and then set a line-height based on the font-size



	font-size: 16px



	font-size: 1.142857143rem; (16 / $rembase)



	line-height: 1.5; ($line-height / 16)







---------- Vertical spacing







Vertical spacing between most elements should use 24px or 48px



to maintain vertical rhythm:







.my-new-div {



	margin: 24px 0;



	margin: 1.714285714rem 0; ( 24 / $rembase )



}







---------- Further reading







http://snook.ca/archives/html_and_css/font-size-with-rem



http://blog.typekit.com/2011/11/09/type-study-sizing-the-legible-letter/











/* =Reset



-------------------------------------------------------------- */



@charset "utf-8";



/* CSS Document */







/* Png Images for IE */



img, div{behavior: url(iepngfix.htc);}



/* Png Images for IE */



/* Getting the new tags to behave */



article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {



}



mark, rp, rt, ruby, summary, time {



	display:inline



}



/* =================================================================== */



/* ========== Default ========== */



/* =================================================================== */







body{font-family: Helvetica, Verdana; color:#5c5c5c ;background-color:#fff; font-size:14px;color:#5c5c5c;}



html, body {

	height:100%;margin:0px!important;padding:0;

}



html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input, hr ,figure { margin:0; padding:0;  }

fieldset {border:0}

a {text-decoration:none;}

a:hover {text-decoration:none;}

p{ line-height:20px;}



h1{font-size:20px;font-weight:normal; font-family: 'HelveticaNeueRegular';color:#f47621;}



h3{font-family: 'HelveticaNeueRegular';font-size:14px;}

li{ list-style:none;}

.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}

.clearfix {display: inline-block;}

html[xmlns] .clearfix {display: block;}

* html .clearfix {height: 1%;}



@font-face {



    font-family: 'droid_sansregular';



    src: url('css/fonts/droidsans-webfont.eot');



    src: url('css/fonts/droidsans-webfont.eot?#iefix') format('embedded-opentype'),



         url('css/fonts/droidsans-webfont.woff') format('woff'),



         url('css/fonts/droidsans-webfont.ttf') format('truetype'),



         url('css/fonts/droidsans-webfont.svg#droid_sansregular') format('svg');



    font-weight: normal;



    font-style: normal;



}



@font-face {



    font-family: 'HelveticaNeueRegular';



    src: url('css/fonts/helveticaneue-light-webfont.eot');



    src: url('css/fonts/helveticaneue-light-webfont.eot?#iefix') format('embedded-opentype'),



         url('css/fonts/helveticaneue-light-webfont.woff') format('woff'),



         url('css/fonts/helveticaneue-light-webfont.ttf') format('truetype'),



         url('css/fonts/helveticaneue-light-webfont.svg#HelveticaNeueRegular') format('svg');



    font-weight: normal;

    font-style: normal;



}





.wrapper{ width:100%;min-height:100%; margin-bottom: -142px;}

.wrapper:after {

  content: "";

  display: block;

}

.ft_wrapper, .wrapper:after {

  height: 142px; 

}

#container {   margin: 0 auto;



    max-width:1150px; text-align: center;



}



.container:after {

	content: ".";

	display: block;

	height: 0;

	clear: both;

	visibility: hidden;



}





#main_wrapper{width:100%; padding-top:50px;}



/*#top_header{ width:auto; background:url(images/header_bg.jpg) repeat-x bottom #fff; padding:0px 0px; border-bottom:solid 1px #fff;min-height:110px;}*/



#top_header{ width:auto; background:#fff; padding:0px 0px; border-bottom:solid 1px #fff;min-height:110px;}

#main_content_wrapper{ width:100%; background:#fff;overflow:hidden;padding-bottom:40px;}





/* =================================================================== */



/* ========== Home ========== */



/* =================================================================== */



.logo{ float:left; padding-top:15px;padding-left:10px;width:43%;position:relative;}

.logo img {width:100%; height:auto ;max-width: 420px;}

.menu-tag-container{float:right;width: 47%; margin-top:24px;position:relative;z-index:12;}

.tagline {color: #f47621;  padding: 20px 10px 8px;  font-size: 15px;  font-family: Helvetica, Arial; position: absolute;

  top: 53%;

  left: 25%;

  font-style: italic;}

.header_nav {float:right;margin-right:5px;}

.header_nav li{ list-style:none; float:left; padding:12px 10px 10px;position:relative}



.header_nav li a{ text-decoration:none; font-size:16px; color:#3c3c3c;}



.header_nav li.current-menu-item a {color:#f47621;} 



.header_nav li.current-menu-item .sub-menu a, 
.header_nav li.current-menu-item .sub-menu a:visited {color:#3c3c3c;}
.header_nav li.current-menu-item .sub-menu a:hover {color: #f47621; }
.header_nav li span{ font-size:12px; color:#7c7c7c;}



.header_nav li ul .last{ padding-left:0px!important;}



#menu-primary-menu {margin-top: 0;}



#menu-primary-menu li:last-child span {display:none;}



.header_nav ul li.current-menu-item a:link, .header_nav ul li.current-menu-item a:vistied {color: #f47621;}



.main_content{max-width:925px;  text-align:left; margin: 0 auto;}

.main_content.contact {max-width: 1150px;}

.content_cols{ padding:0px 10px 13px ; text-align:left;



max-width: 969px;}



.center_title{text-align:center!important;}



.content_left_col{width:635px;  float:left;}



.content_cols p span{ font-weight:bold;}



.home_content_img{position:relative;top:0px;margin: 0 10px;float:left;}



.content_right_box{ width:296px; float:right; padding:20px 0px 0px 0px;}



.content_right_box  h1{border-bottom: solid 1px #a7a7a7;padding-bottom:5px;}



.content_right_box  h1 span{color:#5c5c5c;}



.contact_form{float:left;width:100%;position:relative;}



.contact_form  li{margin-top:11px;}



.contact_form  li span{width:109px;float:left;}



.contact_form  li input[type="text"]{width:185px;height:19px;border:solid 1px #a0a0a0;}



.contact_form  li select{width:185px;height:19px;border:solid 1px #a0a0a0;padding:0px 2px;color:#126aa4;font-style:italic;}



.contact_form  li input[type="submit"]{width:130px;height:36px;background:#f47621;

color:#fff;text-transform:uppercase;text-align:center;font-size:14px;border:none;cursor:pointer;float:right;

-webkit-appearance: none;

}







/* =================================================================== */



/* ========== Footer/css ========== */



/* =================================================================== */



#ft_wrapper{width:100%;background:url(images/ft_bg.jpg) repeat-x #40403f;font-size:11px;height:142px;}

#ft_wrapper #container{text-align:center;color:#a9a9a9;padding:45px 0px 36px;}

.ft_nav li{display:inline;border-right:solid 1px #000;padding:0px 23px;}

.ft_nav li a{color:#a9a9a9;}

.ft_nav .last{border:none;}

#ft_wrapper #container p{padding-top:10px;}

#ft_wrapper #container p span{color:#fff;}



/* =================================================================== */



/* ========== banner/css ========== */



/* =================================================================== */



#banner{float:left;}

#banner_wrapper{ width:auto; background:url(images/banner_wrapper_bg.jpg) repeat-x;}

li.image_1{background:url(images/roofing_slide_1.jpg) no-repeat center top; width:100%; height:482px; }

li.image_2{background:url(images/roofing_slide_2.jpg) no-repeat center top; width:100%; height:482px; }

li.image_3{background:url(images/roofing_slide_3.jpg) no-repeat center top; width:100%; height:482px; }

li.image_4{background:url(images/roofing_slide_4.jpg) no-repeat center top; width:100%; height:482px; }



/*** set the width and height to match your images **/



#slideshow {position:relative;z-index:1; height:482px; top:0px; left:0px; right:0px;}

#slideshow li { position:absolute; top:0; left:0; z-index:8; opacity:0.0;}

#slideshow li.active {z-index:10;opacity:1.0;}

#slideshow li.last-active {z-index:9;}



/* =================================================================== */



/* ========== inner_pages/css ========== */



/* =================================================================== */
p.pad-top {padding-top:30px;}
#services-list-container {padding-left:15%;height:100px;}

#services-list-container .services-list {float: left; width: 315px; margin-top: 20px; line-height:20px;}

#services-list-container .services-list li{list-style-image: url('images/bullet_square.png');}



.inner_banner{position:relative;max-width:1207px;}

.inner_banner img {width:100%;max-width:1207px;}

.inner_banner h2{position:relative;font-family:Arial;font-size:36px;color:#88dbff;font-weight:normal;



 left: 126px;position: absolute;text-align: left;top: 105px;}



#inner_content{padding-bottom:54px;}

.services_product{float:left;margin-top:30px;width:683px;}

.services_product .product_box{margin-right:10px;margin-bottom:20px;}

.services_product .last_servic{margin-right:0px!important;}

.left_align{float:left!important;margin-right:14px;}

.list_item{float:left;padding-top:23px;padding-bottom:20px;}

.list_item li{line-height:26px;background:url(images/check_bullet.png) no-repeat left;padding-left:34px;}

.list_item li a{font-weight:bold;color:#616161;}

.inner_cotent_right{width:296px!important;}

.inner_cotent_right li input[type="text"]{width:170px!important;}

.inner_cotent_right li select{width:155px!important;}

.contact_left{width: 624px; float: left; background: url("images/speechbubble.png") no-repeat 0px 85px;

 padding-left: 270px;}

.inner_left_content ul li {list-style:disc;margin-bottom:10px;}

.contact_right{width:236px;float:right;padding-top:26px;}

.contact_right h1{padding-bottom:9px;border-bottom :solid 1px #a8a8a8;}

.google_map{float:left:border:solid 1 px #a6a6a6;width:354px;margin-top:14px;}

.contact_right h1 span{color:#5c5c5c;}

.contact_left .contact_form li{line-height:47px;padding-right:20px;}

.contact_left .contact_form input[type="text"]{border:solid 1px #a0a0a0;width:390px;height:25px;-webkit-appearance: none;border-radius: 0;}

.contact_form li span{width:200px;text-align:right;margin-right:2px;padding-right:10px;}

.contact_left .contact_form input[type="submit"]{float: right;margin-left:71px;margin-top:15px;font-weight:bold;}

.address{float:left;padding-top:12px;}

.address li{padding-bottom:24px;}

.address li a{color:#616161;}

.address li a:hover, .address li a:visited {color:#f47621;}

.address li span{color:#5c5c5c;width:65px;float:left; text-align: right; padding-right: 5px;}

.address.company li {padding-bottom:5px;}

.footer_menu{float:none;}

.footer_menu li{ float:none; background:none;padding-left:0px;}



.copy_right{text-align:center;}

.grid .column{width:93%;}



#dropdown-menu { width: 100%; padding: 0px; text-align: center; float: none; }



#responsive-nav { width: 100%; text-align: left; }



}



.wpcf7-text{border: 1px solid #A0A0A0; height: 25px; width: 246px;padding-left:3px; background-color: #EEEEEE;margin-top:10px;line-height:23px;}



.wpcf7-textarea{border: 1px solid #A0A0A0; height: 200px; margin-left: 2px; width: 385px;

	overflow:auto;

	margin-top:19px!important;

-webkit-appearance: none;

border-radius: 0;

}



#wpcf7-f37-p38-o1 .wpcf7-textarea{



    border: 1px solid #A0A0A0;

    height: 117px;

    margin-left: 2px;

    width: 200px;

	margin-left:14px;

	overflow:auto;

	margin-top:19px!important;}



.wpcf7-form .message-lbls {text-align: right; float: left;}

.wpcf7-form  .msg {float:left;}

.wpcf7-email{border: 1px solid #A0A0A0;

	height: 25px;

	width: 390px;

	line-height:24px;

-webkit-appearance: none;

border-radius: 0;

}

.content_right_box  .wpcf7-text	 {width:170px;height:19px;border:solid 1px #a0a0a0; margin-left: 14px;}

.content_right_box .wpcf7-select {width:173px!important;height:19px; margin-top: 10px; margin-left: 13px;}



.wpcf7-submit.Contact{width:94px;height:28px;background:#f47621;



color:#fff;text-transform:uppercase;text-align:center;font-size:12px;border:none;cursor:pointer;float:right;

margin-right:81px;}



.wpcf7-text .name{width:151px;height:19px;border:solid 1px #a0a0a0; margin-left: 14px;}



.content_right_box form span {display:block;width:72px;float:left;}



.inner_cotent_right li span.wpcf7-not-valid-tip {width:183px!important;left:8%;}



.contact_left .contact_form li span.wpcf7-not-valid-tip {width:378px!important;line-height:23px;left:0;text-align:left;}



.content_right_box form li span.label {margin-top:10px;}



.content_right_box form span.wpcf7-form-control-wrap {width:160px;}



.maincontent {padding-left:20px;}



.maincontent ol li {list-style:decimal;}



.maincontent ol  {margin:20px;}



.nav-seprator {padding-left:20px;}



.header_nav span.nav-separator {padding-left:20px;}



.header_nav .last-child span.nav-separator {display:none;}



.header_nav ul ul { /* this targets all sub menus */



	display: none; /* hide all sub menus from view */

	position: absolute;

	top: 34px; /* this should be the same height as the top level menu -- height + padding + borders */

	left: -10px;

	z-index: 11;

	/*background: url(images/header_bg.jpg) repeat-x bottom #fff;*/

	background: #fefefe;

	border: solid 1px #000;

	line-height: 26px;

 	padding: 0;

	text-align: left;



}



.header_nav ul ul li { /* this targets all submenu items */

	float: none; /* overwriting our float up above */

	width: 175px; /* set to the width you want your sub menus to be. This needs to match the value we set below */



	margin: 0;

	padding: 0;

	border: 1px solid #eee;



}



.header_nav ul ul li.last-child {border:none;}

.header_nav ul ul li.first-child {border-top:none;background:}

.header_nav ul ul li a { /* target all sub menu item links */

padding: 5px 20px; /* give our sub menu links a nice button feel */



}



.header_nav ul li:hover > ul {

	display: block; /* show sub menus when hovering over a parent */	



}



.header_nav ul ul li:hover {

	background: #eee; /* show sub menus when hovering over a parent */	



}



.header_nav  ul ul li ul {



	/* target all second, third, and deeper level sub menus */

	left: 150px; /* this needs to match the sub menu width set above -- width + padding + borders */

	top: 0; /* this ensures the sub menu starts in line with its parent item */



}



.header_nav ul ul.sub-menu span.nav-separator {display:none;}

.header_nav ul li a {font-size:13px;}

.header_nav ul li:hover > a {color: #f47621;}



/*.header_nav li.menu-item-has-children:hover {background: url(images/menu-arrow.png) no-repeat 72px 20px;}*/



.header_nav ul li ul li:hover {background-image: none;}

h2.phone {float: right;font-weight:bold; padding: 7px 0 0; font-style: italic; font-size: 22px;}



/*Blog*/



h2 a,h2  {font-size:20px;font-weight:normal; font-family: 'HelveticaNeueRegular';color:#f47621;}



.content_left {width:100%;float:left;padding-top:20px;}



.content_right {width:37%;float:right;}



#headline {margin-top:20px;}



#headline li a {color:#007cb2;}



h2.main_title {padding-top:20px;}



#post {margin-top:20px;}







/*Icons*/



.home-icons {display:table;  width: 100%;  text-align: center;  margin: 40px 0 22px;}



.home-icons .icons {display: table-cell;}

.home-icons .icons img {width:100%;max-width:85px;height:auto;}

.home-icons .icons h3 a:link, .home-icons .icons h3 a:visited {color:#9e9e9e;margin-top:40px;}







/*Titles*/



#title {background: url(images/title-gray-line.png) 0 50%;width:100%;text-align:center;   margin: 40px 0;}



#title h2 {font-size: 26px;  font-weight: bold;  background: #fff;  display: inline;  padding: 0 40px;



  letter-spacing: 1px;}



#title .morewhite {padding: 0 70px;}



/*Social*/

#social {width:125px;float:right;clear:both;}

#social .icon {width:32px;height:40px;display: inline-block;}

#social .icon.facebook {background:url(images/facebook.png);}

#social .icon.twitter {background:url(images/twitter.png);}

#social .icon.instagram{background:url(images/instagram.png);}





/*Contact*/

div.wpcf7-response-output {display:none!important;}

div.wpcf7 img.ajax-loader {position:relative; margin: 100px 0 0 -22px;}

#map-canvas {width: 206px;height: 200px;

      }


/*Markets*/

.market-images {width:100%; margin-top: 40px;}
.market-images img {border: solid 1px #f47621; width: 100%;}
.market-image-left, .market-image-right1, .market-image-right2 {width:47.5%;}
.market-image-left, .market-image-right1,.market-image-right2 {float:left;}
.market-image-left {margin-right: 5%;}
.market-image-right1 {margin-bottom: 3.5%;}
.icons.heading {text-align: center; margin-top: 30px;}
#title.markets {margin-top: 20px;}
/* =================================================================== */



/* ========== other_screen_resolution/css ========== */



/* =================================================================== */









@media screen and (max-width: 1140px) {

.menu-tag-container {width: 53%;}

.contact_right {width:100%;}

.address li span, .address {float:none;}

.contact_right {text-align: center;}

#map-canvas {margin:0 auto;width: 400px; height: 250px;}



}



@media screen and (max-width: 1024px) {

.logo {width:46%;}

.header_nav {display: none;}

.tagline {text-align: center;}

.menu-tag-container {float:left;width:340px;}

.contact_left {padding:0;background:none;float:none;margin: 0 auto; max-width:532px;}

.contact_right {width:100%;}

.contact_left .contact_form li {float:left;}

.contact_left .contact_form li span {width:100%; text-align: left;}

.address li span, .address {float:none;}

.contact_right {text-align: center;}

#map-canvas {margin:0 auto;}

.contact_left {width:100%;}

.contact_left .contact_form li {line-height: inherit;}

}



@media screen and (max-width: 970px) {



.tagline {width: 293px; text-align: center; font-size: 13px;}



}



/*(iPad - Portrait)*/



@media screen and (max-width: 768px) {



.menu-tag-container {float:left;width:300px;}

#logo{float:none;margin:0 auto;}



#main_nav{float:none;}

.container{width:420px;}

#main_nav ul{display:none;}

}





/* 480 x 640 (small tablet) */



@media screen and (max-width: 700px) {



#slideshow,.content_heading.center_title {display:none;}

#banner_wrapper {clear:both;}

.menu-tag-container {width:100%}

.product_box {margin: 0 auto;}

.product_home {text-align:center;padding: 0;margin-left:0;}

.product_home  .product_box {margin: 0 auto;background:none;float: none;  width: 100%;padding:0;}

#right_content {margin-left:0px;}

#services-list-container {padding-left:10px}

}





@media screen and (max-width: 580px) {

#title {background:none;}

.home-icons .icons  {display: inline;width:33.33%;}

.home-icons .icons {float:left;}

#title h2 {padding:0;}

#map-canvas {display:none;}

.contact_left {padding-left:10px;}

}



/* 320 x 480 (iPhone) */



@media screen and (max-width: 480px) {
.market-image-left, .market-image-right1, .market-image-right2 {float:none;width:100%;}
.logo { width: 76%;}
#title {margin:20px 0;}
.content_cols p {padding-top:0;}
#slideshow,.home_content_img,.header_nav,.inner_banner {display:none;}
.tagline {padding: 36px 10px 8px;width:100%;left:10%;}
.product_box {margin: 0 auto;}
#social, h2.phone {float:none;width:100%;}
.home-icons .icons  {display: inline;}
.product_home {text-align:center;padding: 0;margin-left:0;}
.menu-tag-container {width: 100%;  float: left;  padding-left: 0;}
.content_heading.center_title {display:none;}
.contact_right {float:none;padding: 0 0 20px;}
#services-list-container .services-list {width:100%;}
.wpcf7-form .msg {float:none;}
.wpcf7-textarea, .contact_left .contact_form input[type="text"], .wpcf7-email {width:100%;max-width:370px;}
.ft_nav li {padding: 0 10px;}

}

@media screen and (max-width: 320px) {
.logo {height:85px; padding-top: 20px}
}