/* CSS Document */
html
{ 
 background-position:top center;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
margin : 0;
padding : 0;
border : none;
}
li, ol, ul {
list-style : none;
}
img {
border : none;
}
:focus {
outline : 0;
}
* {
margin : 0;
padding : 0;
}
img {
border : none;
}
.clr {
clear : both;
}
.clear{ clear:both;	}
* {
    margin: 0;
    padding: 0;
}
a {
outline: medium none;
text-decoration: none;
}

img {
    border: 0 none;
}
.spacer {
    clear: both;
    font-size: 0;
    line-height: 0;
}


.fr{ float:right;}
.fl{ float:left;}
.clr{ clear:both;}
body{ margin: 0px; background-color:#330000;   /*background-image:url(../images/top_bg.png); background-repeat:no-repeat; background-repeat:no-repeat;
 background-position:top center;*/}
#contener{margin:auto; padding:0px; text-align:center;}
.wraaper1{ background-image:url(../images/bg.png); background-repeat: repeat; margin:auto; padding:0px;}
.wrapper{ margin:auto; padding:0px; width:960px; }




/****************************************top part******************************************/

#topaprt{ margin:0px; width:100%; padding:0px;}
#topaprt .logopart{ clear:both; margin:0px; height:155px; }
#topaprt .logopart .logo{ float:left; margin:30px 0px 0px 10px; width:250px;}

#topaprt .logopart .navigationpart{ float:right; margin:0px; width:685px;}
#topaprt .logopart .navigationpart .callus{ float:right; margin:0px; width:380px; height:32px;}
#topaprt .logopart .navigationpart .callus p{ font-family:Arial; font-size:13px; color:#FFFFFF; text-align:left; margin: 0px 20px 0px 20px; line-height:32px; float:left;}
#topaprt .logopart .navigationpart .callus p span{ font-weight:bold; color:#FFFFFF;}
#topaprt .logopart .navigationpart .callus .facebook { float:right; width:185px; margin-right:10px;}
#topaprt .logopart .navigationpart .callus .facebook p{ font-family:Arial; font-size:13px; color:#FFFFFF; text-align:left; margin: 0px 20px 0px 20px; line-height:32px; float:left;}
#topaprt .logopart .navigationpart .callus .facebook img{ float:left; margin:8px 5px 0px 00px; width:16px; height:16px;}
#topaprt .logopart .navigationpart .navigation{ clear:both; margin:0px 10px 0px 0px; width:680px;}

#nav,#nav ul {
    list-style: none outside none;
    margin: 0;
    padding: 0;
}
#nav {
    background: none;
    clear: both;
    font-size: 12px;
    height: 58px;
    padding: 0 0 0 9px;
    position: relative;
    width: 666px;
}
#nav ul {
    background-color: #222;
    border:1px solid #222;
    border-radius: 0 5px 5px 5px;
    border-width: 0 1px 1px;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.5);
    left: -9999px;
    overflow: hidden;
    position: absolute;
    top: -9999px;
    z-index: 2;

    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    -webkit-transform: scaleY(0);
    transform: scaleY(0);

    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;

    -moz-transition: -moz-transform 0.1s linear;
    -ms-transition: -ms-transform 0.1s linear;
    -o-transition: -o-transform 0.1s linear;
    -webkit-transition: -webkit-transform 0.1s linear;
    transition: transform 0.1s linear;
}
#nav li {
    background: #1A1A1C; height:93px; width:130px;
    float: left; font-family:Arial; font-size:14px; color:#FFFFFF; text-align:center; margin: 0px 0px 0px 1px; line-height:92px; text-transform:uppercase; float:left; display:block;
    position: relative;
}
#nav li a {
    color: #FFFFFF;
    display: block;
  
    font-weight: normal;
    height:93px;
   
    position: relative;
    text-decoration: none;
    text-shadow: 1px 1px 1px #000000;
	text-align:center; line-height:93px;
	
}
#nav li span { height:40px;}
#nav li:hover > a {
    color: #ffffff;
}
#nav li:hover, #nav a:focus, #nav a:hover, #nav a:active {
    background: none repeat scroll 0 0 #BA2626;
    outline: 0 none;
}
#nav li:hover ul.subs {
    left: 0;
    top: 80px;
    width:300px; position:absolute; z-index:50; 
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform: scaleY(1);

}
#nav ul li {
    background: none;
    width: 100%; height:40px;  line-height:40px; width:300px;
}
#nav li ul li:hover ul.cata{
  left: 100px;
    top: 40px;
    width:300px; padding:0px; position:absolute; z-index:1000; 
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform: scaleY(1);      
}

#nav ul li a {
    float: none; height:40px; line-height:40px;
}
#nav ul li:hover > a {
    background-color: #121212;
    color: #00B4FF; height:40px;
}

#nav li:hover, #nav a:focus, #nav a:hover, #nav a:active {
    background: none repeat scroll 0 0 #BA2626;
    outline: 0 none;
}
#nav li:hover ul.submenu {
    left: 100px;
    top: 80px;
    width:300px; 
  position:absolute; z-index:93; 
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
}
#nav ul li {
    background: none;
    width: 100%; height:40px;  line-height:40px; width:300px;
}
#nav ul li a {
    float: none; height:40px; line-height:40px;
}
#nav ul li:hover > a {
    background-color: #fffffff;
    color: #00B4FF; height:40px;
}



/********************************************header part start from here *****************************************/
#header{ clear:both; margin:0px; width:100%;}
#header img{ margin:0px 0px 0px 0px; clear:both;-webkit-box-shadow: 0px 0px 010px 0px rgba(21, 7, 6, 1);
 box-shadow: 0px 0px 010px 0px rgba(21, 7, 6, 1);}




/******************************************body part*********************************************/


#bodycontent{ clear:both; margin:0px 0px 0px 0px; width:100%; height:720px;}
#bodycontent .welcome{ clear:both; margin:20px 0px 0px 0px; float:left;}
#bodycontent .welcome h1{ font-family:Times New Roman...; font-size:21px; color:#FFFFFF; text-align:left; text-transform:uppercase; margin:20px 0px 0px 20px; float:left; clear:both;}
#bodycontent .welcome P {font-family:verdana; font-size:13px; color:#B3B3B3; text-align:left; margin: 10px 20px 0px 20px; line-height:18px; float:left; width:940px;}
#bodycontent .welcome .featured{ float:left; width:940px; height:285px; background-color:#1A1A1C; margin:10px 0px 0px 10px;-webkit-box-shadow: 0px 5px 05px 0px rgba(21, 7, 6, 1);
 box-shadow: 0px 5px 05px 0px rgba(21, 7, 6, 1); }
#bodycontent .welcome .featured .projct{ float:left; margin:20px; width:270px;}
#bodycontent .welcome .featured .projct h2{font-family:verdana; font-size:15px; color:#FFFFFF; text-align:left; margin: 10px 20px 0px 0px; line-height:18px; float:left; text-transform:uppercase;}
#bodycontent .welcome .featured .projct img{ clear:both; margin:5px 0px 0px 0px;}
#bodycontent .welcome .featured .projct p{font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; margin: 10px 0px 0px 0px; line-height:18px; float:left; width:270px;}
#bodycontent .welcome .featured .projct p a{ clear:both; font-weight:normal; color:#BA2626; float:right; background:url(../images/arrow.png) right center no-repeat; padding-right:10px; line-height:18px; font-weight:bold; height:22px;}


#bodycontent .welcome .partner{ float:left; width:940px; height:135px; background-color:#1A1A1C; margin:10px 0px 0px 0px;-webkit-box-shadow: 0px 5px 05px 0px rgba(21, 7, 6, 1);
 box-shadow: 0px 5px 05px 0px rgba(21, 7, 6, 1); }
#bodycontent .welcome .partner img{ float:left; margin:26px 10px 0px 10px; }




/******************************************footer part***************************/
#footer{ clear:both; margin:0px; padding:0px; width:100%; height:48px; background-color:#000000;}
#footer .footerlogo{ float:left; margin:10px 0px 0px 20px; }
#footer .copyright{ float:right; width:610px;}
#footer .copyright p{ font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; margin: 0px 0px 0px 0px; line-height:48px; float:left;}
#footer .copyright p span{ float:right; margin:0px; font-weight:normal;}
#footer .copyright p a{color:#FFFFFF; margin:0px; font-weight:normal; text-decoration:none;}
#footer .copyright p a:hover{color:#FFFFFF; margin:0px; font-weight:normal; text-decoration:underline;} 





/************************************
      *****************************************  SERVICE PART*******************************
	                                               ********************************************/
												   
												   
												   
#service{ clear:both; margin:0px; width:100%;  height:860px; }
#service h1{ font-family:Times New Roman...; font-size:21px; color:#FFFFFF; text-align:left; text-transform:uppercase; margin:20px 0px 0px 20px; float:left; clear:both;}
#service .servicepart{ clear:both; margin:20px 0px 0px 0px; float:left; background-color:#1A1A1C; height:638px; width:940px;}
#service .servicepart h1{ font-family:Times New Roman...; font-size:21px; color:#FFFFFF; text-align:left; text-transform:uppercase; margin:20px 0px 0px 20px; float:left; }
#service .servicepart .request{ float:left; margin:20px 0px 0px 20px; width:264px;}
#service .servicepart .request h3{font-family:verdana; font-size:16px; color:#F5F5F5; text-align:left; margin: 10px 20px 0px 0px; line-height:18px; float:left; text-transform:uppercase; font-weight:normal;}
#service .servicepart .request .form{ clear:both; margin:10px 0px 0px 0px;}
#service .servicepart .request .form p{font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; margin:16px 0px 0px 0px; line-height:18px; float:left; clear:both;}
#service .servicepart .request .form input{ height:28px; background-color:#666666; width:254px;font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; margin: 0px 0px 0px 0px; line-height:28px; float:left; clear:both; padding-left:10px;}
#service .servicepart .request .form textarea{ height:140px; background-color:#666666; width:254px;font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; margin: 0px 0px 0px 0px; line-height:18px; float:left; clear:both; padding-left:10px;}

#service .servicepart .request .follow{ clear:both; margin:20px 0px 0px 0px;}
#service .servicepart .request .follow h3{font-family:verdana; font-size:16px; color:#F5F5F5; text-align:left; margin: 10px 20px 0px 0px; line-height:18px; float:left; text-transform:uppercase; font-weight:normal; background:url(../images/follow-bg.png) bottom center no-repeat; padding-bottom:10px; width:264px;} 
#service .servicepart .request .follow .sign{ float:left; margin:0px; width:60px;}

#service .servicepart .request .follow img{ float:left; margin:20px 0px 0px 0px; width:60px; clear:both;}

#service .servicepart .request .follow .creatan{ float:right; margin:0px; width:190px;}
#service .servicepart .request .follow .creatan p{font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; margin:20px 0px 15px 0px; line-height:18px; float:right;  width:190px;}
#service .servicepart .request .follow .creatan p a{font-size:12px; color:#3B5998; font-weight:bold; text-decoration:none;}
#service .servicepart .request .follow .creatan h4{font-family:verdana; font-size:12px; color:#3B5998; text-align:left; margin:10px 0px 0px 0px; line-height:18px; clear:both; font-weight:bold; }
#service .servicepart .request .follow .creatan img{ float:left; margin:10px 0px 0px 0px; clear:both;}

#service .servicepart .weoffer{ float:right; margin:0px; width:590px;}
#service .servicepart .weoffer h1{ font-family:Times New Roman...; font-size:21px; color:#FFFFFF; text-align:left; text-transform:uppercase; margin:20px 0px 20px 20px; float:left; clear:both;}
#service .servicepart .weoffer .commercial{ clear:both; margin:20px 30px 0px 0px; background:url(../images/commercial-bg.png) bottom center no-repeat; height:170px;}
#service .servicepart .weoffer .commercial img{ float:left; width:270px; margin-bottom:20px; }
#service .servicepart .weoffer .commercial .commrecialright{ float:right; width:270px;}
#service .servicepart .weoffer .commercial .commrecialright h3{font-family:verdana; font-size:16px; color:#F5F5F5; text-align:left; margin:0px 20px 0px 0px; line-height:18px; float:left; text-transform:uppercase; font-weight:normal;  width:270px;}

#service .servicepart .weoffer .commercial .commrecialright ul{ clear:both; margin:20px 0px 0px 0px; width:270px;}
#service .servicepart .weoffer .commercial .commrecialright ul li{ float:left; margin:10px 0px 0px 0px; line-height:14px; background:url(../images/brown-arrow.png) left center no-repeat;font-family:verdana; font-size:12px; color:#B3B3B3; text-align:left; padding-left:10px;  }
#service .servicepart .weoffer .commercial .commrecialright ul li a{ color:#B3B3B3; text-decoration:none; }
#service .servicepart .weoffer .commercial .commrecialright ul li a:hover{ line-height:14px;font-family:verdana; font-size:12px; color:#BA2626; text-align:left; text-decoration:underline; }
#service .servicepart .weoffer .commercial .commrecialright ul li a.active{ float:left;;font-family:verdana; font-size:12px; color:#BA2626; text-align:left; text-decoration:underline; }



#service .partner{ float:left; width:940px; height:135px; background-color:#1A1A1C; margin:10px 0px 0px 0px;-webkit-box-shadow: 0px 5px 05px 0px rgba(21, 7, 6, 1);
 box-shadow: 0px 5px 05px 0px rgba(21, 7, 6, 1); clear:both; }
#service .partner img{ float:left; margin:26px 10px 0px 10px; }


.contactus{ margin:20px 20px 20px 20px;}
.contactus h1{ padding:0px; float:none !important; margin:0px !important; display:block; font:24px/30px Arial, Helvetica, sans-serif!important; color:#fff ;}
.contact_left{ float:left; margin-top:20px;}
.contact_left label{ display:block; font:14px/18px Arial, Helvetica, sans-serif; color:#FFF; margin:10px 0px; text-align:left;}
.contact_left input{ width:400px; border:none; margin-left:0px; background:#666666; height:32px; margin-bottom:10px;}
.contact_left textarea{width:400px; border:none; background:#666666; height:200px;}
.contact_left a{width:100px; border:none; display:block; background:#666666; font:12px/40px Arial, Helvetica, sans-serif; color:#FFF; height:40px; margin-top:20px;}

.contact_right{ float:right; width:450px; text-align:left;}
.contact_right h1{ padding-bottom:30px; float:none !important; margin:0px !important; display:block; font:20x/30px Arial, Helvetica, sans-serif!important; color:#fff ;}
.contact_right img{ margin-top:20px;	}
.aboutus{ margin:20px 20px 50px 20px;}
.aboutus h1{ padding:0px; float:none !important; margin:0px !important; display:block; font:30px/36px Arial, Helvetica, sans-serif!important; color:#fff ;}
.contact_right span{ font:14px/16px Arial, Helvetica, sans-serif; color:#FFF;}
.aboutus img{ border:5px solid #CCC; float:left; margin-right:15px;}
.aboutus span{ text-align:justify;font:14px/20px Arial, Helvetica, sans-serif; color:#FFF; display:block;}

/*======roofing css start-======== */
.service_left{float:left; width:305px;  text-align:justify; margin:20px 0px 0px 20px;}
.service_left h1{ padding:0px; float:none !important; margin:0px !important; display:block; font:24px/30px Arial, Helvetica, sans-serif!important; color:#fff ;}
.service_right{ float:right; width:590px; text-align:justify; margin:20px 20px 0px 0px;}
.service_right h1{ padding:0px; float:none !important; margin:0px !important; display:block; font:30px/36px Arial, Helvetica, sans-serif!important; color:#fff ;}
.service_right img{ border:5px solid #CCC; float:left; margin-right:15px;}
.roofing{ margin-top:12px; font:14px/20px Arial, Helvetica, sans-serif; color:#fff;}
.roofing ul{ list-style:none;}
.roofing ul li{ display:block; margin-bottom:30px; }
.roofing ul a{ font:14px/16px Arial, Helvetica, sans-serif; color:#FFF; text-decoration:underline; display:block; float:right; margin:50px 0px;	}
#v-nav {
	margin-top:18px;
	}
#v-nav, #v-nav ul {
    list-style:none;
    padding:0;
    width:270px;
}
#v-nav ul {
    position:relative;
    z-index:-1;
}
#v-nav li {
    position:relative;
    z-index:100;
}
#v-nav ul li {
    margin-top:-23px;

    -moz-transition:  0.4s linear 0.4s;
    -ms-transition: 0.4s linear 0.4s;
    -o-transition: 0.4s linear 0.4s;
    -webkit-transition: 0.4s linear 0.4s;
    transition: 0.4s linear 0.4s;
}
#v-nav li a {
    background-color:#d4d5d8;
    color:#000;
    display:block;
    font-size:12px;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    line-height:40px;
    outline:0;
    padding-left:25px;
    text-decoration:none;
    border-bottom:1px solid #000;
}
#v-nav li a.sub {
    background:#d4d5d8 url("../images/dxown.gif") no-repeat;
}
#v-nav li a + img {
    cursor:pointer;
    display:none;
    height:28px;
    left:0;
    position:absolute;
    top:0;
    width:200px;
}
#v-nav li a img {
    border-width:0px;
    height:24px;
    line-height:28px;
    margin-right:8px;
    vertical-align:middle;
    width:24px;
}
#v-nav li a:hover {
    background-color:#bcbdc1;
}
#v-nav ul li a {
    background-color:#eee;
    border-bottom:1px solid #ccc;
    color:#000;
    padding-left:30px;
    font-size:11px;
    line-height:22px;
}
#v-nav ul li ul li a{
    background-color:#fff;
    border-bottom:1px solid #ccc;
    color:#000;
    padding-left:40px;
    font-size:11px;
    line-height:22px;
}
#v-nav ul li a:hover {
    background-color:#ddd;
    color:#444;
}
#v-nav ul li a img {
    background: url("../images/bulb.png") no-repeat;
    border-width:0px;
    height:16px;
    line-height:22px;
    margin-right:5px;
    vertical-align:middle;
    width:16px;
}
#v-nav ul li:nth-child(odd) a img {
    background:url("../images/bulb2.png") no-repeat;
}
#v-nav a.sub:focus {
    background:#bcbdc1;
    outline:0;
}
#v-nav a:focus ~ ul li {
    margin-top:0;

    -moz-transition:  0.4s linear;
    -ms-transition: 0.4s linear;
    -o-transition: 0.4s linears;
    -webkit-transition: 0.4s linears;
    transition: 0.4s linear;
}
#v-nav a:focus + img, #v-nav a:active + img {
    display:block;
}
#v-nav a.sub:active {
    background:#bcbdc1;
    outline:0;
}
#v-nav a:active ~ ul li {
    margin-top:0;
}
#v-nav ul:hover li {
    margin-top:0;
}


/*==========roofing css end========*/