/* page style sheet */

@font-face {

    font-family: 'SourceSansProRegular';

    src: url('fonts/sourcesanspro-regular.eot');

    src: url('fonts/sourcesanspro-regular.eot') format('embedded-opentype'),

         url('fonts/sourcesanspro-regular.woff') format('woff'),

         url('fonts/sourcesanspro-regular.ttf') format('truetype'),

         url('fonts/sourcesanspro-regular.svg#SourceSansProRegular') format('svg');

}

@font-face {

    font-family: 'SourceSansProSemibold';

    src: url('fonts/sourcesanspro-semibold.eot');

    src: url('fonts/sourcesanspro-semibold.eot') format('embedded-opentype'),

         url('fonts/sourcesanspro-semibold.woff') format('woff'),

         url('fonts/sourcesanspro-semibold.ttf') format('truetype'),

         url('fonts/sourcesanspro-semibold.svg#SourceSansProSemibold') format('svg');

}

@font-face {

    font-family: 'ProximaNovaBold';

    src: url('fonts/proximanova-bold.eot');

    src: url('fonts/proximanova-bold.eot') format('embedded-opentype'),

         url('fonts/proximanova-bold.woff') format('woff'),

         url('fonts/proximanova-bold.ttf') format('truetype'),

         url('fonts/proximanova-bold.svg#ProximaNovaBold') format('svg');

}

@font-face {

    font-family: 'ProximaNovaRegular';

    src: url('fonts/proximanova-regular.eot');

    src: url('fonts/proximanova-regular.eot') format('embedded-opentype'),

         url('fonts/proximanova-regular.woff') format('woff'),

         url('fonts/proximanova-regular.ttf') format('truetype'),

		 url('fonts/proximanova-regular.svg#ProximaNovaRegular') format('svg');

}

@media screen and (-webkit-min-device-pixel-ratio:0) {

  @font-face {

      font-family: 'ProximaNovaRegular';

      src: url('fonts/proximanova-regular.svg#ProximaNovaRegular') format('svg');

  }

}

@font-face {

    font-family: 'ProximaNovaSemibold';

    src: url('fonts/proximanova-semibold.eot');

    src:url('fonts/proximanova-semibold.svg#ProximaNovaSemibold') format('svg'), 

	url('fonts/proximanova-semibold.eot') format('embedded-opentype'),

         url('fonts/proximanova-semibold.woff') format('woff'),

         url('fonts/proximanova-semibold.ttf') format('truetype');

         

}

body{

 background:#eeeeee;

 margin:0px;

 padding:px;

}

h1,h2,h3,h4,h5,h6,p,nav,ul,li,header,footer,section{

	padding:0px;

	margin:0px;

}

.page-wrapper{

width: 1200px;

margin: 0px auto;

height: auto;

-webkit-box-shadow: 0px 1px 2px 0px #323232;

-moz-box-shadow: 0px 1px 2px 0px #323232;

box-shadow: 0px 1px 2px 0px #323232;

background: #f8f8f8;

padding-bottom: 1px;

}

header{

	width:100%;

	height:124px;

	background-color:white;

	padding-left:0px;

	padding-top:12px;

	position:relative;

	background: rgb(255, 255, 255);

	background: -moz-linear-gradient(96deg, rgb(255, 255, 255) 54%, rgb(229, 229, 229) 88%);

	background: -webkit-linear-gradient(96deg, rgb(255, 255, 255) 54%, rgb(229, 229, 229) 88%);

	background: -o-linear-gradient(96deg, rgb(255, 255, 255) 54%, rgb(229, 229, 229) 88%);

	background: -ms-linear-gradient(96deg, rgb(255, 255, 255) 54%, rgb(229, 229, 229) 88%);

	background: linear-gradient(181deg, #FFF 54%, #E5E5E5 88%);

}

.logo{

	background:url('img/logo.png') no-repeat;

	width:224px;

	height:103px;

	display:block;

	text-indent:-1999px;

	position: absolute;

	top: 15px;

	left: 15px;

}

.header-right{

	position: absolute;

	top: 25px;

	right: 10px;

}

.social-media{

	padding-left:158px;

}

.facebook{

	background:url('img/f.png') no-repeat;

	width:36px;

	height:36px;

	display:inline-block;

}



.twitter{

	background:url('img/t.png') no-repeat;

	width:36px;

	height:36px;

	display:inline-block;

}

.youtube{

	background:url('img/y.png') no-repeat;

	width:36px;

	height:36px;

	display:inline-block;

}

.pinterest{

	background:url('img/p.png') no-repeat;

	width:36px;

	height:36px;

	display:inline-block;

}

.facebook,.twitter,.youtube{

	margin-right:5px;

}

.pinterest{

	margin:0px;

}

.contact-us{

	font-family: 'SourceSansProRegular';

	color:black;

	font-size:35px;

	color:#333333;

}

.contact-us span{

	color:#8a3345;

	padding-left:25px;

}

#menu,

#menu ul,

#menu li,

#menu a {

  border: none;

  line-height: 1;

  margin: 0;

  padding: 0;

}

#menu {

  height: 57px;

  display: block;

  width: 1200px;

  border-color: #080808;

  margin: 0;

  padding: 0;

}

#menu > ul {

  list-style: inside none;

  margin: 0;

  padding: 0;

}

#menu > ul > li {

  list-style: inside none;

  float: left;

  display: inline-block;

  position: relative;

  margin: 0;

  padding: 0;

}

#menu.align-center > ul {

  text-align: center;

}

#menu.align-center > ul > li {

  float: none;

  margin-left: -3px;

}

#menu.align-center ul ul {

  text-align: left;

}

#menu.align-center > ul > li:first-child > a {

  border-radius: 0;

}

#menu > ul > li > a {

  outline: none;

  display: block;

  position: relative;

  text-align: center;

  text-decoration: none;

  font-size: 16px;

  border-right: 1px solid #9b5361;

  color: #ffffff;

  padding: 20px 25px;

  font-family: 'SourceSansProSemibold';

  text-transform:uppercase;

}

#menu > ul > li:first-child > a {

  border-radius: 5px 0 0 5px;

}

#menu > ul > li > a:after {

  content: "";

  position: absolute;

  top: -1px;

  bottom: -1px;

  right: -2px;

  z-index: 99;

  border-color: #3c3c3c;

}

#menu ul li.has-sub:hover > a:after {

  top: 0;

  bottom: 0;

}

#menu > ul > li.has-sub > a:before {

  content: "";

  position: absolute;

  top: 26px;

  right: 6px;

  border: 5px solid transparent;

  border-top: 5px solid #ffffff;

}

#menu > ul > li.has-sub:hover > a:before {

}

#menu > ul > li.has-sub:hover > a {

  padding-bottom: 14px;

  z-index: 999;

  border-color: #3f3f3f;

}

#menu ul li.has-sub:hover > ul,

#menu ul li.has-sub:hover > div {

  display: block;

}

#menu > ul > li.has-sub > a:hover,

#menu > ul > li.has-sub:hover > a {

  background: #5e2430;

  border-color: #5e2430;

  height:30px;

}

#menu ul li > ul,

#menu ul li > div {

  display: none;

 position: absolute;

top: 56px;

background: #5e2430;

z-index: 999;

padding: 15px 15px;

}

#menu ul li > ul {

  width: 200px;

}

#menu ul ul ul {

  position: absolute;

}

#menu ul ul li:hover > ul {

  left: 100%;

  top: -10px;

  border-radius: 5px;

}

#menu ul li > ul li {

  display: block;

  list-style: inside none;

  position: relative;

  margin: 0;

  padding: 0;

}

#menu ul li > ul li a {

outline: none;

display: block;

position: relative;

font-family: 'SourceSansProSemibold';

color: black;

text-decoration: none;

margin: 0;

padding: 8px 20px;

background: white;

border-bottom: 1px dotted black;

}

#menu,

#menu ul ul > li:hover > a,

#menu ul ul li a:hover {

  background: #8a3545;

}

#menu > ul > li > a:hover {

  background: #5e2430;

  color: #ffffff;

}

#menu ul ul a:hover {

  color: #ffffff;

}

#menu > ul > li.has-sub > a:hover:before {

  border-top: 5px solid #ffffff;

}

#menu > ul > li > a.last-a{

	border:none;

}

/* end of navigation css */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



/* Home page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.slider{

	background: url('img/sliderimg.png') no-repeat;

	width:890px;

	height:471px;

	float:left;

}

.home-product-content{

	background:white;

}

.home-product{

	float: left;

	width: 290px;

	text-align: center;

	margin: 35px 0px;

}

.home-product h5 {

	font-size: 24px;

	margin-top: 15px;

	font-family: 'ProximaNovaSemibold';

}

.home-product a {

	background: #8a3545;

	color: white;

	font-size: 16px;

	text-decoration: none;

	padding: 12px 20px;

	font-family: 'ProximaNovaSemibold';

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.home-product p{

	font-family: 'ProximaNovaRegular';

	font-size: 16px;

	margin: 20px 0px;

	line-height: 25px;

}

.home-content {

	margin: 30px 25px;

}

.welcome-commitment-content {

	margin-bottom: 15px;

}

.welcome {

	padding: 20px;

	background: white;

	-webkit-box-shadow: 0px 1px 2px 0px #323232;

	-moz-box-shadow: 0px 1px 2px 0px #323232;

	box-shadow: 0px 1px 2px 0px #323232;

	line-height:25px;

	font-family: 'ProximaNovaRegular';

	font-size:16px;

	width:760px;

	float:left;

	padding-bottom: 0px;

}

.welcome h2{

	font-family: 'ProximaNovaRegular';

	font-size:36px;

	border-bottom: 2px solid #eeeeee;

	line-height: 35px;

}

.welcome h2 span{

	font-family: 'ProximaNovaSemibold';

	color:#8a3445;

	font-size:36px;

}

.welcome img{

	float: left;

	margin-top: 5px;

}

.welcome-first-p{

	font-family: 'ProximaNovaSemibold';

	font-size:16px;

	margin-top:20px;

	

}

.points {

	padding-left: 300px;

}

.points p{

	margin: 15px 0px;

	line-height: 25px;

}

.points p span{

	display: inline-block;

	margin-left: -20px;

	padding-right: 5px;

}

.commitment{

	float: right;

	background: url('img/commitmentbg.png') no-repeat;

	width: 270px;

	height: 254px;

	text-align: center;

	padding: 80px 35px;

	color: white;

	font-family: 'ProximaNovaRegular';

	font-size: 16px;

	line-height: 25px;

}

.commitment h5{

	font-family: 'ProximaNovaSemibold';

	font-size:22px;

	margin-bottom: 10px;

}

.stories{

	line-height: 25px;

	font-family: 'ProximaNovaRegular';

	font-size: 16px;

	float: left;

	padding-bottom: 0px;

	width: 760px;

	height: 347px;

}

.choose-us {

	float: right;

	background: white;

	font-family: 'ProximaNovaRegular';

	font-size:16px;

	width: 340px;

	-webkit-box-shadow: 0px 1px 2px 0px #323232;

	-moz-box-shadow: 0px 1px 2px 0px #323232;

	box-shadow: 0px 1px 2px 0px #323232;

}

.choose-us h3{

	color: white;

	background: none repeat scroll 0% 0% #333;

	padding: 15px 0px;

	font-family: 'ProximaNovaRegular';

	padding-left: 15px;

}

.choose-us-content {

	padding: 19px 25px;

	line-height: 35px;

}

.choose-us-p{

	font-family: 'ProximaNovaSemibold';

	font-size:16px;

}

.choose-us-points p span {

	padding-right: 5px;

}

.choose-us-points {

	padding-left: 28px;

	font-size: 15px;

}

/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



/* About Us page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */

.about-featured-image{

	background:url('img/aboutbanner.png') no-repeat;

	width:auto;

	height:190px;

}

.company-profile{

	font-family: 'ProximaNovaSemibold';

}

.about-section-box{

	-webkit-box-shadow: 0px 1px 2px 0px #323232;

	-moz-box-shadow: 0px 1px 2px 0px #323232;

	box-shadow: 0px 1px 2px 0px #323232;

	background:#f9f9f9;

	font-family: 'ProximaNovaRegular';

	font-size: 16px;

	width:260px;

	margin-right:15px;

	float:left;

	margin-bottom:40px;

	height:530px;

}

.about-content{

	text-align:center;

	padding:30px 20px 85px 20px;

}

.about-content-last{

	text-align:center;

	padding:30px 20px 85px 20px;

	margin:0px;

}



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



/* Asphalt Roofing page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.main-content{

	padding:15px;

}

.featured-image{

	background:url('img/asphaltbanner.png') no-repeat;

	width:auto;

	height:190px;

}

.page-content{

	margin:12px 0px;

}

.section-left{

	background:white;

	padding:30px;

	width:830px;

	float:left;

}

.section-left p{

    font-family: 'ProximaNovaRegular';

	font-size: 16px;

	margin: 20px 0px;

	line-height: 25px;

}

.section-left p span{

	padding-right:100px;

}

.page-heading{

	height:35px;

	border-bottom: 2px solid #eeeeee;

}

.page-title{

	float:left;

    font-family: 'ProximaNovaRegular';

	font-size:34px;

	font-weight:normal;

	color:#8a3445;

}

#page-img{

	float:right;

	padding:0px 20px;

}

.page-title span{

	font-family: 'ProximaNovaBold';

	font-size:34px;



}

p.breadcrumbs{

	float:right;

	font-family: 'ProximaNovaSemibold';

	margin:0px;

}

.breadcrumbs a{

	color:#8a3445;

	padding:0px 10px;

	text-decoration: none;

}

.clear{

	clear:both;

}

p.top-p{

	clear:both;

	font-size: 16px;

	font-family: 'ProximaNovaSemibold';

	margin: 20px 0px;

}

.description{

	padding-left:20px;

}

.description p span{

	font-family: 'ProximaNovaSemibold';

}

.services{

	background: #eeeeee;

	-webkit-box-shadow: 0px 1px 2px 0px #323232;

	-moz-box-shadow: 0px 1px 2px 0px #323232;

	box-shadow: 0px 1px 2px 0px #323232;

	display: none; // #DB

}

.services h3{

	color: white;

	background: none repeat scroll 0% 0% #333;

	padding: 15px;

	font-family: 'ProximaNovaRegular';

}

.other-services{

	padding: 25px 50px;

}

.other-services p a{

	text-decoration:none;

	color:black;

}

/* ------------------------------------ */

/* ------------------------------------ */

/* ------------------------------------ */



/* start of Aside bar */



/* ------------------------------------ */

/* ------------------------------------ */

/* ------------------------------------ */



aside{

	float:right;

	width: 270px;

}

.estimate{

	padding: 15px;

	background-color: rgb(138, 53, 69);

}

.estimate h1{

	color: white;

	font-family: 'ProximaNovaBold';

	font-size: 30px;

	border-bottom: 5px solid #9A5260;

	margin-bottom: 15px;

	padding-bottom: 10px;

}

.estimate h1 span{

	font-family: "ProximaNovaRegular";

}

.estimate input,.estimate textarea{

	padding: 13px;

	width: 210px;

	height: 10px;

	font-family: "ProximaNovaRegular";

	border:none;

	margin-bottom:10px;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

.estimate textarea{

	width:210px;

	height:76px;

}

input.submit{

	padding: 9px;

	width: 240px;

	height: 40px;

	color:white;

	background:#f3593b;

	font-family: 'ProximaNovaSemibold';

	font-size:20px;

}

.repairs{

	margin:10px 0px;

	background:white;

}

.repairs h3{

	color: white;

	background: none repeat scroll 0% 0% #333;

	padding: 15px 0px;

	font-family: 'ProximaNovaRegular';

	padding-left:15px;

}

.repairs-content{

	padding:15px;

	

}

.repairs-content img{

	margin: 5px auto;

	display: block;

}

.repairs-content p{

	font-family: 'ProximaNovaSemibold';

}

.success-stories{

	background: none repeat scroll 0% 0% #8A3545;

	text-align: center;

	padding: 15px;

	color:white;

	font-family: 'ProximaNovaRegular';

	line-height:25px;

	display: none;

}

.success-stories img{

	display: block;
	margin: 5px auto;

}

.success-stories a{

	font-size:20px;

	text-decoration:none;

	color:white;

}

/* -----------end of aside-----------------------*/

/* footer style start */









/* ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ */

/* ------------------------------------------------------------------ */



/* Roofing page style */



/* ------------------------------------------------------------------*/

/* ------------------------------------------------------------------*/

/* ------------------------------------------------------------------*/

.roofing-featured-image{

	background:url('img/roofingbanner.png') no-repeat;

	width:auto;

	height:190px;

}

.product-content{

}

.product {

	float: left;

	width: 275px;

	text-align: center;

	margin:50px 0px;

}

.product h5 {

	font-size: 24px;

	margin-top: 15px;

	font-family: 'ProximaNovaSemibold';

}

.product a {

	background: #8a3545;

	color: white;

	font-size: 16px;

	text-decoration: none;

	padding: 12px 20px;

	font-family: 'ProximaNovaSemibold';

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}

/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



/* Metal Roofing page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.metal-featured-image{

	background:url('img/metalbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



/* Rubber Roofing page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.rubber-featured-image{

	background:url('img/rubberbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



/* Taered Systems page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.tapered-featured-image{

	background:url('img/taperedbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* Rolled Roofing page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.rolled-featured-image{

	background:url('img/rolledbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* Attic  Roofing page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.attic-featured-image{

	background:url('img/atticbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* Siding  page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.siding-featured-image{

	background:url('img/sidingbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* gutters page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.gutters-featured-image{

	background:url('img/guttersbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* Repairs  page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.repair-featured-image{

	background:url('img/repairbanner.png') no-repeat;

	width:auto;

	height:190px;

}

/* window and door page */



/* ---------------------------------------------- */

/* ---------------------------------------------- */

/* ---------------------------------------------- */



.window-and-door-featured-image{

	background:url('img/window-and-door-banner.png') no-repeat;

	width:auto;

	height:190px;

}

footer{

	width: 1200px;

	margin: 0 auto;

	text-align: center;

	padding: 50px 0px;

	line-height: 30px;

	font-family: 'ProximaNovaRegular';

	color:#555555;

}

.footer-top{

	padding-bottom: 25px;

	border-bottom: 2px solid #cccccc;

}

footer nav ul{

	list-style:none;



}

footer nav ul li{

	display:inline-block;

}

footer nav ul li a{

	text-decoration: none;

	color:#555555;

}

footer nav ul li a span{

	padding: 0px 10px;

	border-right: 2px solid #cccccc;

}

span.last-a{

	border-right:none;

}

.footer-bottom p{

	margin:30px 0px;

	font-family: 'ProximaNovaSemibold';

}

/* ---------------- end of footer -------------/*



