/*Name:Custer Remodeling CSS
Date:May 2018
Description:CSS for WHOLE SITE
*/

/* ................................... DESKTOP STYLE ................................... */

@font-face{font-family:ptsnr;src:url("ptsnr.eot")}
@font-face{font-family:ptsnr;src:url("ptsnr.ttf")}

@font-face{font-family:ptsnb;src:url("ptsnb.eot")}
@font-face{font-family:ptsnb;src:url("ptsnb.ttf")}

@font-face{font-family:es;src:url("es.eot")}
@font-face{font-family:es;src:url("es.ttf")}

@font-face{font-family:esb;src:url("esb.eot")}
@font-face{font-family:esb;src:url("esb.ttf")}

iframe{border:0;}

p{font-family:ptsnr,sans-serif;margin:0;}

img{max-width:100%;max-height:100%;border:0;}

h1{font-size:40px;}
h2{font-size:28px;}
h3{font-size:30px;}
h4{font-size:24px;}
h5{font-size:22px;}
h6{font-size:20px;font-family:ptsnb,sans-serif;font-weight:normal;}
h1, h2, h3, h4, h5{font-family:es,sans-serif;font-weight:bold;}

.dtkill{display:none;}

div{font-size:20px;}

a:link{color:#fff;text-decoration:none;}
a:visited{color:#fff;text-decoration:none;}
a:focus{color:#fff;text-decoration:none;}
a:hover{color:#fff;text-decoration:none;}
a:active{color:#fff;text-decoration:none;}

.opac:hover{opacity:.5;}

a.anchor{
display:block;
position:relative;
top:-100px;
visibility:hidden;
}

/* ................................... DESKTOP BODY ................................... */

body{
font-family:ptsnr,sans-serif;
background-color:#0f284a;
margin:0;
padding:0;
text-align:center;
line-height:0px;
}

/* ................................... DESKTOP HEADER ................................... */

header{background-color:rgba(0,0,0,0);}
#mobnavcon{display:none;}

#headfix{
position:fixed;
width:100%;
z-index:999999;
text-align:center;
background-color:#0f284a;
float:left;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#hlogo{float:left;padding:0 0 0 2%;min-width:236px;}

#svghlogo{
height:80px;
width:103px;
margin:8px 0 0 0;
float:left;
}

a svg:hover .svghlogo1,a svg:hover .svghlogo1{fill:#ffc946;}
a svg:hover .svghlogo2,a svg:hover .svghlogo2{fill:#fff;}
#hphone{margin:60px 0 0 10px;float:left;transition:all 0.2s ease-in-out;}
#hlogo a:hover,#hlogo a:focus,#rqbut a:hover,#rqbut a:focus{color:#ffc946;}
#rqbut{padding:0 2% 0 0;margin:15px 0 0 0;float:right;display:block;}
#rqbut i,#rqbut a{transition:all 0.2s ease-in-out;}
#rqbut .fa-file-alt{color:#ffc946;margin-top:10px;}
#rqbut:hover .fa-file-alt,#rqbut:focus .fa-file-alt{color:#fff;}

#dtsocicon{
display:block;
width:159px;
height:40px;
box-sizing:border-box;
font-size:20px;
list-style-type:none;
margin:0;
padding:0;
}

#dtsocicon li{
position:relative;
display:inline-block;
margin:-3px 0 0 0;
padding:0;
vertical-align:middle;
}

#dtsocicon li a{
background-color:rgba(0,0,0,0);
box-sizing:border-box;
color:#fff;
cursor:pointer;
display:block;
margin:0;
padding:0 5px;
text-align:center;
text-decoration:none;
transition:all 0.2s ease-in-out;
width:auto;
z-index:2;
}

#toprquote,#toprquotef{cursor:pointer;color:#fff;}
.hsocial i{display:inline-block;font-size:30px;transition:all 0.2s ease-in-out;}
.hsocial:hover i,.hsocial:focus i{color:#ffc946;}

#dtnavbar{
font-family:ptsnb,sans-serif;
height:100px;
width:565px;
margin:auto;
padding:0;
}

#dtnav{
box-sizing:border-box;
font-size:20px;
height:100px;
line-height:100px;
list-style-type:none;
margin:0;
padding:0;
}

#dtnav li{
height:100px;
position:relative;
display:inline-block;
margin:-3px 0 0 0;
padding:0;
vertical-align:middle;
}

#dtnav li a{
background-color:rgba(0,0,0,0);
box-sizing:border-box;
color:#fff;
cursor:pointer;
display:block;
margin:0;
padding:0 8px;
text-align:center;
text-decoration:none;
transition:all 0.2s ease-in-out;
width:auto;
z-index:2;
}

#dtnav li .curpage{color:#ffc946;}
#dtnav li a:focus,#dtnav li a:hover{color:#ffc946;}

a svg:hover .svgabbb1{fill:#ffc946;}
#svgbbb{margin-bottom:-2px;}

a svg .svgabbb1,a svg .svghlogo1,a svg .svghlogo2{
transition:all 0.2s ease-in-out;
}

#dtnav li ul{
background-color:rgba(15,40,74,.8);
box-sizing:border-box;
display:none;
height:auto;
line-height:20px;
margin:0;
padding:0;
top:99px;
position:absolute;
text-align:center;
z-index:99999;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#dtnavroof{width:146px;left:-31.5px;}
#dtnavrem{width:172px;left:-29.5px;}
#dtnavres{width:191px;left:-36px;}
#dtnavabt{width:114px;left:-23px;}

#dtnav li ul li{
height:50px;
width:100%;
margin:0;
padding:0;
border-bottom:1px solid rgba(255,201,70,.8);
}

#dtnav li ul li:last-child{border-bottom:none;}
#dtnav li ul a{padding:15px 22px;}
#dtnav li ul li a:focus,#dtnav li ul li a:hover{background-color:#ffc946;color:#0f284a;}
#dtnav li ul li a{color:#fff;}
#dtnav li:hover ul{display:block;}
#dtnav li:focus ul{display:block;}

/* ................................... DESKTOP FOOTER ................................... */

footer{
width:100%;
color:#fff;
background:#0f284a;
margin:auto;
text-align:center;
line-height:normal;
overflow:hidden;
border-top:5px solid #ffc946;
}

footer a{transition:all 0.2s ease-in-out;}

footer h2{
font-family:es,sans-serif;
font-weight:normal;
font-size:34px;
margin:0 0 20px 0;
}

#footcon{
width:1047px;
padding:30px 0;
margin:auto;
text-align:center;
overflow:hidden;
}

#foot1{
display:inline-block;
width:275px;
height:475px;
margin:0 15px 0 0;
overflow:hidden;
}

#foot2{
display:inline-block;
width:200px;
height:475px;
margin:0 30px 0 55px;
overflow:hidden;
}

#foot3{
display:inline-block;
width:150px;
height:475px;
margin:0 25px 0 15px;
overflow:hidden;
}

#foot4{
display:inline-block;
width:250px;
height:475px;
margin:0 0 0 15px;
overflow:hidden;
}

#foot2 h2,#foot3 h2,#foot4 h2{text-align:left;}
#foot3 h2{margin:0 0 64px 0;}

#svgflogo{
height:80px;
width:103px;
margin:0 0 0 0;
}

#frqbut a:hover,#frqbut a:focus{color:#ffc946;}

#frqbut{
text-align:left;
padding:0 0 0 12px;
margin:0;
display:block;
}

#frqbut i,#frqbut a{transition:all 0.2s ease-in-out;}
#frqbut .fa-file-alt{color:#ffc946;}
#frqbut:hover .fa-file-alt,#frqbut:focus .fa-file-alt{color:#fff;}
#fsvgbbb{margin-bottom:-2px;}
#fcontactul{margin:12px 0;padding:0 0 0 10px;}

#fsocicon{
display:block;
width:159px;
height:40px;
box-sizing:border-box;
font-size:20px;
list-style-type:none;
padding:0;
margin:0;
}

#fsocicon li{
position:relative;
display:inline-block;
margin:-3px 0 15px 0;
padding:0;
vertical-align:middle;
}

#fsocicon li a{
background-color:rgba(0,0,0,0);
box-sizing:border-box;
color:#fff;
cursor:pointer;
display:block;
margin:0 5px;
padding:0;
text-align:left;
text-decoration:none;
transition:all 0.2s ease-in-out;
width:auto;
z-index:2;
}

#foot1 ul{list-style:none;text-align:left;}
#foot2 ul,#foot3 ul,#foot4 ul{list-style:none;text-align:left;padding:0 0 0 10px;}
#foot1 li,#foot2 li,#foot3 li{margin:2px 0;}
#foot1 a:link,#foot2 a:link,#foot3 a:link{color:#fff;}
#foot1 a:visited,#foot2 a:visited,#foot3 a:visited{color:#fff;}
#foot1 a:focus,#foot2 a:focus,#foot3 a:focus{color:#ffc946;}
#foot1 a:hover,#foot2 a:hover,#foot3 a:hover{color:#ffc946;}
#foot1 a:active,#foot2 a:active,#foot3 a:active{color:#ffc946;}

#foot1b{
float:left;
width:280px;
text-align:left;
margin:15px 14px 0 14px;
}

#foot2b{
float:left;
width:328px;
text-align:center;
margin:15px 10px 0 10px;
}

#foot3b{
float:left;
width:320px;
text-align:right;
margin:15px 14px 0 14px;
}

#foot1b,#foot2b,#foot3b{font-size:20px;}
#foot1b a:link,#foot2b a:link,#foot3b a:link{color:#ffc946;}
#foot1b a:visited,#foot2b a:visited,#foot3b a:visited{color:#ffc946;}
#foot1b a:focus,#foot2b a:focus,#foot3b a:focus{color:#fff;}
#foot1b a:hover,#foot2b a:hover,#foot3b a:hover{color:#fff;}
#foot1b a:active,#foot2b a:active,#foot3b a:active{color:#fff;}

#footmap{
height:500px;
width:100%;
background-color:rgba(0,0,0,0);
background-image:url(footer-map.jpg);
background-position:center;
}

.footsmicons,.footarw{
color:#ffc946;
cursor:pointer;
text-align:center;
text-decoration:none;
transition:all 0.2s ease-in-out;
}

.footsmicons:focus,.footsmicons:hover,.footarw:focus,.footarw:hover{color:#fff;}
.footarw{font-size:36px;padding-top:2px;display:block;}

#topbut a{
display:block;
height:40px;
width:40px;
background-color:rgba(15,40,74,.5);
border-radius:50%;
}

#topbut{
display:none;
position:fixed;
bottom:30px;
right:30px;
}

/* ................................... DESKTOP QUOTE BUTTON ................................... */

#quotebutcon{
display:none;
width:100%;
text-align:center;
position:fixed;
bottom:0;
padding:0;
background:rgba(0,0,0,0.0);
z-index:999999999;
}

.quotebut{
background:#ffc946;
width:180px;
margin:auto;
overflow:hidden;
box-shadow:2px 0 18px rgba(0,0,0,0.3);
color:#0f284a;
border-radius:15px 15px 0 0;
}

.quotebut span{
display:block;
width:100%;
line-height:36px;
text-align:center;
color:#0f284a;
position:relative;
border-bottom:1px solid rgba(0,0,0,0.05);
transition:background 0.2s ease-in-out;
cursor:pointer;
}

.quotebut a:active,.quotebut a:visited{background-color:#ffc946;}
.quotebut span:hover,.quotebut span:focus{background-color:#0f284a;color:#ffc946;}
.quotebut:hover,.quotebut:focus{border:1px solid #ffc946;border-bottom:none;}

.qbut-menu{
position:fixed;
top:0;
right:0;
margin:0;
padding:0;
background:rgba(255,201,70,.9);
z-index:9999999999;
overflow-x:hidden;
overflow-y:hidden;
box-shadow:2px 0 18px rgba(0,0,0,0.26);
color:#0f284a;
text-align:left;
width:0;
height:0;
transition:all 0.2s ease-in-out;
}

#qbutform{
width:270px;
margin:50px auto;
background:#fff;
padding:15px;
box-shadow:4px 4px 16px 4px rgba(0,0,0,0.3);
}

#qbutform i{
color:#0f284a;
float:right;
padding:10px 12px;
margin:-10px -10px 0 0;
font-size:30px;
cursor:pointer;
transition:all 0.2s ease-in-out;
}

#qbutform i:hover,#qbutform i:focus{color:#ffc946;}
#qbutform h4{text-align:center;line-height:normal;margin:20px auto;width:182px;}
#qbutform label{line-height:normal;margin-left:10px;}

#qqform input{
font-family:rl,sans-serif;
font-size:20px;
width:94%;
height:26px;
padding:2% 3%;
color:#0f284a;
background:#fff;
border:1px solid #d6d5d9;
margin:5px auto 20px auto;
outline:none;
}

.qqsubmit{width:123px;margin:auto;}

#qqform .qqsubmit input{
font-family:rl,sans-serif;
font-size:20px;
width:123px;
height:36px;
line-height:36px;
padding:0;
color:#0f284a;
background:#fff;
border:1px solid #d6d5d9;
margin:0 auto;
outline:none;
cursor:pointer;
}

.qqsubmit:hover #qqsubhov,.qqsubmit:focus #qqsubhov{
background:#ffc946;
color:#fff;
transition-delay:0s;
transition-duration:0.2s;
transition-property:all;
transition-timing-function:ease-in-out;
}

.open{width:100%;height:100%;}

/* ................................... DESKTOP HOME MENU ................................... */

#fadehead{
position:fixed;
width:100%;
z-index:999999;
text-align:center;
background-color:#0f284a;
display:none;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#hlogof{float:left;padding:0 0 0 2%;min-width:236px;}

#svghlogof{
height:80px;
width:103px;
margin:8px 0 0 0;
float:left;
}

#hphonef{
margin:60px 0 0 10px;
float:left;
transition:all 0.2s ease-in-out;
}

#hlogof a:hover,#hlogof a:focus,#rqbutf a:hover,#rqbutf a:focus{color:#ffc946;}

#rqbutf{
padding:0 2% 0 0;
margin:15px 0 0 0;
float:right;
display:block;
}

#rqbutf i,#rqbutf a{
transition:all 0.2s ease-in-out;
}

#rqbutf .fa-file-alt{color:#ffc946;margin-top:10px;}
#rqbutf:hover .fa-file-alt,#rqbutf:focus .fa-file-alt{color:#fff;}

#dtsociconf{
display:block;
width:159px;
height:40px;
box-sizing:border-box;
font-size:20px;
list-style-type:none;
margin:0;
padding:0;
}

#dtsociconf li{
position:relative;
display:inline-block;
margin:-3px 0 0 0;
padding:0;
vertical-align:middle;
}

#dtsociconf li a{
background-color:rgba(0,0,0,0);
box-sizing:border-box;
color:#fff;
cursor:pointer;
display:block;
margin:0;
padding:0 5px;
text-align:center;
text-decoration:none;
transition:all 0.2s ease-in-out;
width:auto;
z-index:2;
}

#dtnavbarf{
font-family:ptsnb,sans-serif;
height:100px;
width:565px;
margin:auto;
padding:0;
}

#dtnavf{
box-sizing:border-box;
font-size:20px;
height:100px;
line-height:100px;
list-style-type:none;
margin:0;
padding:0;
}

#dtnavf li{
height:100px;
position:relative;
display:inline-block;
margin:-3px 0 0 0;
padding:0;
vertical-align:middle;
}

#dtnavf li a{
background-color:rgba(0,0,0,0);
box-sizing:border-box;
color:#fff;
cursor:pointer;
display:block;
margin:0;
padding:0 8px;
text-align:center;
text-decoration:none;
transition:all 0.2s ease-in-out;
width:auto;
z-index:2;
}

#dtnavf li .curpage{color:#ffc946;}
#dtnavf li a:focus,#dtnavf li a:hover{color:#ffc946;}
#svgbbbf{margin-bottom:-2px;}

#dtnavf li ul{
background-color:rgba(15,40,74,.8);
box-sizing:border-box;
display:none;
height:auto;
line-height:20px;
margin:0;
padding:0;
top:99px;
position:absolute;
text-align:center;
z-index:99999;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#dtnavrooff{width:146px;left:-31.5px;}
#dtnavremf{width:172px;left:-29.5px;}
#dtnavresf{width:191px;left:-36px;}
#dtnavabtf{width:114px;left:-23px;}

#dtnavf li ul li{
height:50px;
width:100%;
margin:0;
padding:0;
border-bottom:1px solid rgba(255,201,70,.8);
}

#dtnavf li ul li:last-child{border-bottom:none;}
#dtnavf li ul li a{padding:15px 22px;}
#dtnavf li ul li a:focus,#dtnavf li ul li a:hover{background-color:#ffc946;color:#0f284a;}
#dtnavf li ul li a{color:#fff;}
#dtnavf li:hover ul{display:block;}
#dtnavf li:focus ul{display:block;}

/* ................................... DESKTOP HOME ................................... */

#homehead{
text-align:center;
height:630px;
z-index:-99999;
margin:auto;
padding:0;
line-height:normal;
}

#hhsscon{
position:relative;
height:630px;
width:100%;
margin:auto;
z-index:-99999;
}

#hhsscon > div{position:absolute;}

.hhssh1{
margin-top:320px;
font-family:esb,sans-serif;
color:#ffc946;
}

#homehead1,#homehead2,#homehead3{
background-color:rgba(0,0,0,0);
background-position:center;
background-repeat:no-repeat;
z-index:-99999;
height:630px;
width:100%;
}

#homehead1{background-image:url(cover-1.jpg);}
#homehead2{background-image:url(cover-2.jpg);}
#homehead3{background-image:url(cover-3.jpg);}

#hrow1wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#ffc946;
text-align:center;
line-height:normal;
}

#hrow1{
background-color:#ffc946;
width:66%;
min-width:1044px;
margin:auto;
padding:50px 0 30px 0;
overflow:hidden;
}

.hrow1item{
display:inline-block;
width:31%;
color:#0f284a;
margin:0 1%;
min-height:433px;
}

.hrow1item,.hrow1item p,.hrow1item h2,.hrow1pics,.partcon{transition:all 0.2s ease-in-out;}
.hrow1item:hover,.hrow1item:focus{background:#0f284a}
.hrow1item:hover h2,.hrow1item:focus h2,.hrow1item:hover p,.hrow1item:focus p{color:#fff;}
.hrow1item h2{text-align:center;margin:26px 0 13px 0;font-size:30px;}
.hrow1item p{text-align:left;margin:6px 16px 26px 16px;font-size:20px;min-height:104px;overflow:hidden;}
.hrow1pics{width:100%;height:auto;margin:0 0 10px 0;}

#hrow2wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#fff;
text-align:center;
line-height:normal;
}

.hdes{
margin:auto;
width:42%;
padding:50px 0;
overflow:hidden;
min-width:800px;
}

.hdes h2{margin:0 0 30px 0;font-size:30px;}
.hdes h6{margin:30px 0;}

.hdestext{

line-height:normal;
color:#0f284a;
width:100%;
text-align:left;
}

.readmore{
display:block;
font-size:20px;
width:123px;
height:35px;
color:#0f284a;
background:#e5e5e5;
padding:10px 10px 3px 10px;
margin:30px auto 0 auto;
outline:none;
transition:all 0.2s ease-in-out;
text-align:center;
border-bottom:2px solid #ffc946;
}

.readmore:link,.readmore:visited{color:#0f284a;text-decoration:none;}
.readmore:focus,.readmore:hover,.readmore:active{
color:#0f284a;
text-decoration:none;
background:#ffc946;
border-bottom:2px solid #0f284a;
}

#hrow3wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#0f284a;
text-align:center;
line-height:normal;
border-top:5px solid #0f284a;
}

.hrow3pics{margin:0;padding:0;width:25%;float:left;}

#hrow4wrap{
text-align:center;
margin:auto;
overflow:hidden;
width:100%;
background-color:#0f284a;
line-height:normal;
padding:50px 0;
}

#hfeed{
display:inline-block;
width:428px;
margin:auto;
overflow:hidden;
color:#fff;
}

#fb-root{display:none;}

#hfbss{
position:relative;
height:360px;
width:100%;
font-size:25px;
margin:40px 4% 0 2%;
text-align:left;
}

#hfbss > div{position:absolute;}

.fbheader{font-size:30px;}
.fbtext{font-size:24px;}
.fbcust{float:right;margin-right:10px;}

#fbplug{
display:inline-block;
position:relative;
width:491px;
height:400px;
margin:0 2% 0 4%;
}

#hrow5wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#e5e5e5;
text-align:center;
line-height:normal;
padding:50px 0;
}

#hrow5wrap h2{
text-align:center;
margin:0 0 20px 0;
font-size:30px;
color:#0f284a;
}

#hpartners{
min-width:1044px;
width:66%;
margin:auto;
overflow:hidden;
}

.partcon{
display:inline-block;
height:150px;
width:19%;
}

.partcon:hover{opacity:.5;}

.partthumb{
background-position:center;
background-repeat:no-repeat;
height:150px;
margin:15px 0;
}

#part1{background-image:url(part1.png);}
#part2{background-image:url(part2.png);}
#part3{background-image:url(part3.png);}
#part4{background-image:url(part4.png);}
#part5{background-image:url(part5.png);}
#part6{background-image:url(part6.png);}
#part7{background-image:url(part7.png);}
#part8{background-image:url(part8.png);}
#part9{background-image:url(part9.png);}
#part10{background-image:url(part10.png);}

/* .................................. DESKTOP ROOFING ................................. */

#roocon{
margin:auto;
padding:175px 0 0 0;
line-height:normal;
background-color:#ffc946;
color:#0f284a;
overflow:auto;
}

#roocon h1{font-family:esb,sans-serif;}

#roorow1{
background-color:#ffc946;
width:66%;
min-width:1044px;
margin:auto;
padding:55px 0 0 0;
overflow:hidden;
}

.roorow1icon{
float:left;
margin:0 20px 5px 0;
border-radius:20px;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#rootxt1,#rootxt2,#rootxt3{
display:inline-block;
width:48%;
color:#0f284a;
text-align:left;
}

#rootxt1{float:left;min-height:297px;margin:0 1% 20px 1%;}
#rootxt2{float:right;min-height:361px;margin:77px 1% 20px 1%;}
#rootxt3{float:left;min-height:334px;margin:77px 1% 50px 1%;}

#roopic1{
display:inline-block;
float:right;
margin:0 8% 77px 8%;
max-height:240px;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#ssa{display:inline-block;float:left;margin:77px 1% 77px 1%;}

#slideshowa{
margin:0px 30px;
position:relative;
width:432px;
height:324px;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#slideshowa > div{position:absolute;}
#ssb{display:inline-block;float:right;margin:77px 1% 107px 1%;}

#slideshowb{
margin:0px 30px;
position:relative;
width:432px;
height:324px;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#slideshowb > div{position:absolute;}
.roobordiv{border-bottom:1px solid rgba(15,40,74,.5);clear:both;}

#roorow2con{background-color:#fff;width:100%;}

#roorow2{
width:66%;
min-width:1044px;
margin:auto;
padding:65px 0 50px 0;
overflow:hidden;
}

.wd{
display:inline-block;
width:17.5%;
margin:40px 1% 0 1%;
text-align:left;
overflow:hidden;
}

.wd h5{margin:5px 0 15px 0;}
.wd p{height:265px;}
.wd img{box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);}
#roomiss{background-color:#0f284a;color:#ffc946;overflow:hidden;}

#roorow3{
width:66%;
min-width:1044px;
margin:auto;
padding:65px 0;
overflow:hidden;
}

#rooshing{
float:left;
width:48%;
text-align:left;
margin:auto 1%;
}

#ccway{
float:right;
width:48%;
text-align:left;
margin:auto 1%;
}

#rooshing a{transition:all 0.2s ease-in-out;}
#rooshing a:hover{opacity:0.7;}
#ccway ul{list-style-image:url('../roofing/custer-remodeling-roofing-hammer.png');}
.hammer{margin:0 0 10px 0;}
.nohammer{list-style:none;margin-bottom:20px;}

/* .................................. DESKTOP SHINGLES ................................. */

#sincon{
margin:auto;
padding:175px 0 50px 0;
line-height:normal;
background-color:#ffc946;
color:#0f284a;
overflow:auto;
}

#sincon h1{font-family:esb,sans-serif;}

#sinrow1,#sinrow2,#sinrow3{
width:66%;
min-width:1044px;
margin:auto;
padding:50px 0 20px 0;
overflow:hidden;
}

#sinrow1 h2,#sinrow2 h2,#sinrow3 h2{margin:0 0 30px 0;}
#sinrow1 p,#sinrow2 p,#sinrow3 p{margin:0 0 30px 0;}
.sinbef{display:inline-block;margin:20px;}
.sinbef	img{box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);}

.sinbef:before{
background-color:rgba(0,0,0,0);
content: '';
position:relative;
margin:auto;
top:26px;
left:0;
display:block;
height:26px;
width:1%;
box-sizing:inherit;
transition:all 0.2s ease-in-out;
overflow:hidden;
}

.sinbef:hover:before,.sinbef:focus:before,.sinbef:active:before{background-color:#0f284a;color:#ffc946;width:100%;}
.t1:hover:before,.t1:focus:before,.t1:active:before{content: 'Ash Brown';}
.t2:hover:before,.t2:focus:before,.t2:active:before{content: 'Autumn Brown';}
.t3:hover:before,.t3:focus:before,.t3:active:before{content: 'Charcoal';}
.t4:hover:before,.t4:focus:before,.t4:active:before{content: 'Golden Cedar';}
.t5:hover:before,.t5:focus:before,.t5:active:before{content: 'Slate';}
.t6:hover:before,.t6:focus:before,.t6:active:before{content: 'Weathered Gray';}
.t7:hover:before,.t7:focus:before,.t7:active:before{content: 'White';}
.a1:hover:before,.a1:focus:before,.a1:active:before{content: 'Barkwood';}
.a2:hover:before,.a2:focus:before,.a2:active:before{content: 'Birchwood';}
.a3:hover:before,.a3:focus:before,.a3:active:before{content: 'Charcoal';}
.a4:hover:before,.a4:focus:before,.a4:active:before{content: 'Hickory';}
.a5:hover:before,.a5:focus:before,.a5:active:before{content: 'Mission Brown';}
.a6:hover:before,.a6:focus:before,.a6:active:before{content: 'Pewter Gray';}
.a7:hover:before,.a7:focus:before,.a7:active:before{content: 'Shakewood';}
.a8:hover:before,.a8:focus:before,.a8:active:before{content: 'Slate';}
.a9:hover:before,.a9:focus:before,.a9:active:before{content: 'Weatherwood';}
.s1:hover:before,.s1:focus:before,.s1:active:before{content: 'Armorshield';}
.s2:hover:before,.s2:focus:before,.s2:active:before{content: 'Presidential Shake';}
.s3:hover:before,.s3:focus:before,.s3:active:before{content: 'Slate Storm Master';}
.s4:hover:before,.s4:focus:before,.s4:active:before{content: 'Trudef Weatherguard';}
.s5:hover:before,.s5:focus:before,.s5:active:before{content: 'Metal';}
.s6:hover:before,.s6:focus:before,.s6:active:before{content: 'Metal';}
.s7:hover:before,.s7:focus:before,.s7:active:before{content: 'Stone Coated Steel';}

/* .................................. DESKTOP REMODELING ................................. */

#remcon{
margin:auto;
padding:0;
line-height:normal;
background-color:#ffc946;
overflow:auto;
}

#remcontent{
padding:250px 0 150px 0;
background-color:transparent;
background-image:url('../remodeling/custer-remodeling.jpg');
background-size:cover;
background-position:center 100px;
background-repeat:no-repeat;
background-attachment:fixed;
z-index:-99999;
}

#remdes{
background-color:#fff;
margin:auto;
min-width:924px;
padding:30px 60px;
width:56%;
overflow:hidden;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#remdestext{
margin:auto;
line-height:normal;
color:#0f284a;
background-color:transparent;
text-align:left;
}

#remdestext h1{margin:40px 0 30px 0;font-family:esb,sans-serif;text-align:center;}
#remdestext h6{margin:20px 0 40px 0;text-align:center;font-family:es,sans-serif;}
#remdestext p{text-align:justify;}

.systtypecon{
background-color:#0f284a;
min-width:1044px;
width:67%;
margin:100px auto;
color:#fff;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

.systtypecon img{float:left;margin:70px 3.1% 25px 4.7%;box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);}
.systtypedes{text-align:left;padding:70px 60px 60px 60px;}
.systtypedes h2{margin:-8px 0 25px 0;font-family:es,sans-serif;font-size:30px;}
.systtypedes h6{margin:0 0 25px 0;color:#ffc946;font-size:24px;font-family:es,sans-serif;}
.systtypedes p{line-height:32px;}
.systtypedes a:link{color:#ffc946;text-decoration:none;}
.systtypedes a:visited{color:#ffc946;text-decoration:none;}
.systtypedes a:focus{color:#e5e5e5;text-decoration:none;}
.systtypedes a:hover{color:#e5e5e5;text-decoration:none;}
.systtypedes a:active{color:#e5e5e5;text-decoration:none;}

.systtypeulcon:before,.systtypeimgcon:before{
background-color:#ffc946;
content: '';
box-sizing:inherit;
display:block;
height:6px;
margin:-2px auto auto auto;
width:50%;
position:relative;
left:-25%;
}

.systtypebotcon{width:100%;overflow:hidden;}

.systtypeulcon{
width:45%;
border-top:2px solid #e5e5e5;
margin:69px 5% 0 0;
float:left;
height:450px;
}

.systtypeulcon h6{font-size:26px;margin:51px 0 29px 18px;color:#fff;}
.systtypeul li{margin-bottom:20px;}

.systtypeimgcon{
width:45%;
border-top:2px solid #e5e5e5;
margin:69px 0 0 5%;
float:left;
height:450px;
background-position:50% 50%;
background-repeat:no-repeat;
background-size:cover;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

.systtypeimgcon:after{
background-color:#ffc946;
content: '';
box-sizing:inherit;
display:block;
height:6px;
margin:auto;
width:50%;
position:relative;
left:25%;
top:440px;
}

#systkitimg{background-image:url(../remodeling/kitchen-remodeling.jpg);}
#systbathimg{background-image:url(../remodeling/bathroom-remodeling.jpg);}
#systoutimg{background-image:url(../remodeling/built-in-grill.jpg);}

/* .................................. DESKTOP RESTORATION ................................. */

#rescon{
margin:auto;
padding:0;
line-height:normal;
background-color:#ffc946;
overflow:auto;
}

#rescontent{
padding:250px 0 150px 0;
background-color:transparent;
background-image:url('../restoration/custer-restoration.jpg');
background-size:cover;
background-position:center;
background-repeat:no-repeat;
background-attachment:fixed;
z-index:-99999;
}

#resdes{
background-color:#fff;
margin:auto;
min-width:924px;
padding:30px 60px;
width:56%;
overflow:hidden;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

#resdestext{
margin:auto;
line-height:normal;
color:#0f284a;
background-color:transparent;
text-align:left;
}

#resdestext h1{margin:40px 0 30px 0;font-family:esb,sans-serif;text-align:center;}
#resdestext h6{margin:20px 0 40px 0;text-align:center;font-family:es,sans-serif;}
#resdestext p{text-align:justify;}
#systwatimg{background-image:url(../restoration/water-backup.jpg);}
#systtupimg{background-image:url(../restoration/home-sold.jpg);}

/* .................................. DESKTOP CONTACT US ................................. */

#cucon{
margin:auto;
padding:175px 0 75px 0;
line-height:normal;
background-color:#ffc946;
color:#0f284a;
overflow:auto;
}

#crow1 h1{font-family:esb,sans-serif;}
#coninfo{margin:50px auto;line-height:30px;}
#cuform{width:50%;margin:auto;text-align:left;}
#cuform p{margin-bottom:50px;}
#cuform label{line-height:normal;margin-left:10px;}

#form input{
font-family:ptsnr,sans-serif;
font-size:24px;
width:96%;
height:26px;
padding:10px 2%;
color:#0f284a;
background:#fff;
border:none;
margin:5px auto 20px auto;
outline:none;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

.submit{width:123px;margin:auto;}

#form .submit input{
font-family:ptsnr,sans-serif;
font-size:24px;
width:123px;
height:58px;
color:#fff;
background-color:#0f284a;
border-bottom:2px solid #fff;
margin:5px auto 0 auto;
outline:none;
cursor:pointer;
transition:all 0.2s ease-in-out;
}

.submit:hover #subhov,.submit:focus #subhov,.submit:active #subhov{
background-color:#fff;
color:#0f284a;
border-bottom:2px solid #0f284a;
}

#form textarea{
font-family:ptsnr,sans-serif;
font-size:24px;
width:96%;
height:126px;
padding:10px 2%;
color:#0f284a;
background:#fff;
border:none;
margin:5px auto 30px auto;
outline:none;
box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);
}

/* .................................. DESKTOP ABOUT US ................................. */

#abtcon{
margin:auto;
padding:0;
line-height:normal;
background-color:#ffc946;
overflow:auto;
}

#abtcontent{
padding:330px 0;
background-color:transparent;
background-image:url('../about-us/custer-remodeling-not-just-a-roofer.jpg');
background-size:cover;
background-position:center 0;
background-repeat:no-repeat;
background-attachment:fixed;
z-index:-99999;
}

#abtdes{
background-color:transparent;
margin:auto;
min-width:1044px;
width:80%;
overflow:hidden;
}

#abtdestext{
margin:auto;
line-height:normal;
color:#ffc946;
background-color:transparent;
text-align:left;
}

#abtdestext h1{margin:40px 0 30px 0;font-family:esb,sans-serif;text-align:center;font-size:50px;}

.areadmore{
display:block;
font-size:20px;
width:123px;
height:35px;
color:#fff;
background:#0f284a;
padding:10px 10px 3px 10px;
margin:30px auto 0 auto;
outline:none;
transition:all 0.2s ease-in-out;
text-align:center;
border-bottom:2px solid #fff;
}

.areadmore:link,.areadmore:visited{color:#fff;text-decoration:none;}

.areadmore:focus,.areadmore:hover,.areadmore:active{
color:#0f284a;
text-decoration:none;
background:#fff;
border-bottom:2px solid #0f284a;
}

#arow2wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#ffc946;
text-align:center;
line-height:normal;
}

.ades{
margin:auto;
width:42%;
padding:75px 0;
overflow:hidden;
min-width:800px;
}

.ades h2{margin:0 0 30px 0;font-size:30px;}
.ades h6{margin:30px 0;}
.adestext{line-height:normal;color:#0f284a;width:100%;text-align:left;}

#abtnum a:link{color:#0f284a;text-decoration:none;font-weight:800;}
#abtnum a:visited{color:#0f284a;text-decoration:none;font-weight:800;}
#abtnum a:focus{color:#0f284a;text-decoration:underline;font-weight:800;}
#abtnum a:hover{color:#0f284a;text-decoration:underline;font-weight:800;}
#abtnum a:active{color:#0f284a;text-decoration:underline;font-weight:800;}

#arow3wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#0f284a;
text-align:center;
line-height:normal;
padding:115px 0;
}

#arow3wrap h2{text-align:center;margin:0 0 50px 0;font-size:30px;color:#fff;}

#apartners{
min-width:1044px;
width:75%;
margin:auto;
overflow:hidden;
}

.apartcon{
display:inline-block;
height:160px;
width:19%;
margin:15px 0;
transition:all 0.2s ease-in-out;
}

.apartcon:hover{opacity:.5;}
.apartthumb{background-position:center;background-repeat:no-repeat;height:160px;}
#apart1{background-image:url(../about-us/custer-remodeling-bbb.png);}
#apart2{background-image:url(../about-us/policyholder-advocates.png);}
#apart3{background-image:url(../about-us/veteran-owned.png);}
#apart4{background-image:url(../about-us/custer-remodeling-roofing-haag-certified.png);}
.awardpic{width:100%;margin:0 0 -6px 0;}

#arow4wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#fff;
text-align:center;
line-height:normal;
}

#arow4{
background-color:#fff;
width:75%;
min-width:1044px;
margin:auto;
padding:75px 0 50px 0;
overflow:hidden;
}

#arow4 h2{color:#0f284a;font-size:30px;}
.arow4pics{display:inline-block;width:27%;margin:5% 3%;transition:all 0.2s ease-in-out;}

/* .................................. DESKTOP PRIVACY ................................. */

#pricon{
margin:auto;
padding:175px 0 50px 0;
line-height:normal;
background-color:#fff;
color:#0f284a;
overflow:auto;
}

#prirow1{
background-color:#fff;
width:66%;
min-width:1044px;
margin:auto;
padding:0;
overflow:hidden;
text-align:left;
}

#pricon h1{font-family:esb,sans-serif;margin-bottom:50px;}
#pricon h2{font-size:34px;}

/* .................................. DESKTOP LANDING ................................. */

#damcon{
margin:auto;
padding:0;
line-height:normal;
background-color:#fff;
color:#0f284a;
}

#damhead{
text-align:center;
height:630px;
z-index:-99999;
background-color:rgba(0,0,0,0);
background-position:center;
background-repeat:no-repeat;
background-image:url(cover-1.jpg);
margin:auto;
padding:0;
line-height:normal;
}

#damheadcon{
height:630px;
width:100%;
margin:auto;
z-index:-99999;
padding-top:150px;
}

#svgdalogo{height:175px;width:225px;}
.damheadh1{font-family:esb,sans-serif;color:#fff;}

#dabutton{
margin:auto;
background:#ffc946;
color:#0f284a;
width:750px;
padding:15px 15px;
transition:all 0.2s ease-in-out;
}

#dabutton:hover,#dabutton:focus{background:#0f284a;color:#ffc946;}
#dabutton h2{margin:auto;font-size:25px;}

#darow1wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#0f284a;
text-align:center;
line-height:normal;
}

#darow1{
background-color:#0f284a;
width:66%;
min-width:1044px;
margin:auto;
padding:4.5% 0;
overflow:hidden;
}

#hailvid{width:75%;}
#damiss{background-color:#ffc946;color:#0f284a;overflow:hidden;}
#damiss h2,#darow3 h3{font-size:35px;}

#darow2wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#0f284a;
text-align:center;
line-height:normal;
padding:4.5% 0;
}

#apart5{background-image:url(../roof-assessment/google-reviews.png);}

#darow3wrap{
margin:auto;
overflow:hidden;
width:100%;
background-color:#ffc946;
text-align:center;
line-height:normal;
}

#darow3{
background-color:#ffc946;
width:66%;
min-width:1044px;
margin:auto;
padding:50px 0 30px 0;
overflow:hidden;
}

.darow3item{
display:inline-block;
width:31%;
color:#0f284a;
margin:0 1%;
min-height:433px;
}

.darow3item h2{text-align:center;margin:26px 0 13px 0;font-size:30px;}
.darow3item i{margin:15px 0;}

.darow3item p{
text-align:left;
margin:6px 16px 26px 16px;
font-size:20px;
min-height:338px;
overflow:hidden;
}

/* .................................. DESKTOP GALLERY ................................. */

.galheadcon{
background-color:#ffc946;
margin:auto;
width:100%;
overflow:hidden;
padding:260px 0 150px 0;
line-height:normal;
color:#0f284a;
}

.galheadcon h1{margin:0 0 0 0;font-size:40px;font-family:esb,sans-serif;}
.galheadcon h2{margin:75px 0 25px 0;}
.photogal{width:1035px;margin:auto;overflow:hidden;color:#0f284a;}
.galthumbcon{display:inline-block;transition:all 0.2s ease-in-out;}
.galthumbcon:hover{opacity:.5;}
.galthumb{height:150px;width:225px;margin:15px;box-shadow:0 4px 16px 0 rgba(0,0,0,0.3);}

#galroo1{background-image:url(../gallery/roof-1.thumb.jpg);}
#galroo2{background-image:url(../gallery/roof-2.thumb.jpg);}
#galroo3{background-image:url(../gallery/roof-3.thumb.jpg);}
#galroo4{background-image:url(../gallery/roof-4.thumb.jpg);}
#galroo5{background-image:url(../gallery/roof-5.thumb.jpg);}
#galroo6{background-image:url(../gallery/roof-6.thumb.jpg);}
#galroo7{background-image:url(../gallery/roof-7.thumb.jpg);}
#galroo8{background-image:url(../gallery/roof-8.thumb.jpg);}
#galroo9{background-image:url(../gallery/roof-9.thumb.jpg);}
#galroo10{background-image:url(../gallery/roof-10.thumb.jpg);}
#galroo11{background-image:url(../gallery/roof-11.thumb.jpg);}
#galroo12{background-image:url(../gallery/roof-12.thumb.jpg);}
#galroo13{background-image:url(../gallery/roof-13.thumb.jpg);}
#galroo14{background-image:url(../gallery/roof-14.thumb.jpg);}
#galroo15{background-image:url(../gallery/roof-15.thumb.jpg);}
#galroo16{background-image:url(../gallery/roof-16.thumb.jpg);}
#galroo17{background-image:url(../gallery/roof-17.thumb.jpg);}
#galroo18{background-image:url(../gallery/roof-18.thumb.jpg);}
#galroo19{background-image:url(../gallery/roof-19.thumb.jpg);}
#galroo20{background-image:url(../gallery/roof-20.thumb.jpg);}
#galroo21{background-image:url(../gallery/roof-21.thumb.jpg);}
#galroo22{background-image:url(../gallery/roof-22.thumb.jpg);}
#galroo23{background-image:url(../gallery/roof-23.thumb.jpg);}
#galroo24{background-image:url(../gallery/roof-24.thumb.jpg);}
#galroo25{background-image:url(../gallery/roof-25.thumb.jpg);}

#galdam1{background-image:url(../gallery/dam-1.thumb.jpg);}
#galdam2{background-image:url(../gallery/dam-2.thumb.jpg);}
#galdam3{background-image:url(../gallery/dam-3.thumb.jpg);}
#galdam4{background-image:url(../gallery/dam-4.thumb.jpg);}
#galdam5{background-image:url(../gallery/dam-5.thumb.jpg);}
#galdam6{background-image:url(../gallery/dam-6.thumb.jpg);}
#galdam7{background-image:url(../gallery/dam-7.thumb.jpg);}
#galdam8{background-image:url(../gallery/dam-8.thumb.jpg);}
#galdam9{background-image:url(../gallery/dam-9.thumb.jpg);}
#galdam10{background-image:url(../gallery/dam-10.thumb.jpg);}
#galdam11{background-image:url(../gallery/dam-11.thumb.jpg);}
#galdam12{background-image:url(../gallery/dam-12.thumb.jpg);}
#galdam13{background-image:url(../gallery/dam-13.thumb.jpg);}
#galdam14{background-image:url(../gallery/dam-14.thumb.jpg);}
#galdam15{background-image:url(../gallery/dam-15.thumb.jpg);}
#galdam16{background-image:url(../gallery/dam-16.thumb.jpg);}
#galdam17{background-image:url(../gallery/dam-17.thumb.jpg);}
#galdam18{background-image:url(../gallery/dam-18.thumb.jpg);}
#galdam19{background-image:url(../gallery/dam-19.thumb.jpg);}
#galdam20{background-image:url(../gallery/dam-20.thumb.jpg);}
#galdam21{background-image:url(../gallery/dam-21.thumb.jpg);}
#galdam22{background-image:url(../gallery/dam-22.thumb.jpg);}
#galdam23{background-image:url(../gallery/dam-23.thumb.jpg);}
#galdam24{background-image:url(../gallery/dam-24.thumb.jpg);}
#galdam25{background-image:url(../gallery/dam-25.thumb.jpg);}

#galrem1{background-image:url(../gallery/rem-1.thumb.jpg);}
#galrem2{background-image:url(../gallery/rem-2.thumb.jpg);}
#galrem3{background-image:url(../gallery/rem-3.thumb.jpg);}
#galrem4{background-image:url(../gallery/rem-4.thumb.jpg);}
#galrem5{background-image:url(../gallery/rem-5.thumb.jpg);}
#galrem6{background-image:url(../gallery/rem-6.thumb.jpg);}
#galrem7{background-image:url(../gallery/rem-7.thumb.jpg);}
#galrem8{background-image:url(../gallery/rem-8.thumb.jpg);}
#galrem9{background-image:url(../gallery/rem-9.thumb.jpg);}
#galrem10{background-image:url(../gallery/rem-10.thumb.jpg);}
#galrem11{background-image:url(../gallery/rem-11.thumb.jpg);}
#galrem12{background-image:url(../gallery/rem-12.thumb.jpg);}
#galrem13{background-image:url(../gallery/rem-13.thumb.jpg);}
#galrem14{background-image:url(../gallery/rem-14.thumb.jpg);}
#galrem15{background-image:url(../gallery/rem-15.thumb.jpg);}
#galrem16{background-image:url(../gallery/rem-16.thumb.jpg);}
#galrem17{background-image:url(../gallery/rem-17.thumb.jpg);}
#galrem18{background-image:url(../gallery/rem-18.thumb.jpg);}
#galrem19{background-image:url(../gallery/rem-19.thumb.jpg);}
#galrem20{background-image:url(../gallery/rem-20.thumb.jpg);}
#galrem21{background-image:url(../gallery/rem-21.thumb.jpg);}
#galrem22{background-image:url(../gallery/rem-22.thumb.jpg);}
#galrem23{background-image:url(../gallery/rem-23.thumb.jpg);}
#galrem24{background-image:url(../gallery/rem-24.thumb.jpg);}
#galrem25{background-image:url(../gallery/rem-25.thumb.jpg);}

/* ................................... Lightbox ................................... */

@media all{

.featherlight{
display:none;
position:fixed;
top:0;
right:0;
bottom:0;
left:0;
z-index:2147483647;
text-align:center;
white-space:nowrap;
cursor:pointer;
background:#333;
background:rgba(0,0,0,0);
}

.featherlight:last-of-type{background:rgba(0,0,0,.8);}

.featherlight:before{
content:'';
display:inline-block;
height:100%;
vertical-align:middle;
margin-right:-.25em;
}

.featherlight .featherlight-content{
position:relative;
text-align:left;
vertical-align:middle;
display:inline-block;
overflow:auto;
padding:25px 25px 0;
border-bottom:25px solid transparent;
margin-left:5%;
margin-right:5%;
max-height:95%;
background:#ffc946;
cursor:auto;
white-space:normal;
}

.featherlight .featherlight-inner{display:block;}

.featherlight .featherlight-close-icon{
position:absolute;
z-index:9999;
top:0;
right:0;
line-height:25px;
width:25px;
cursor:pointer;
text-align:center;
font-family:Arial,sans-serif;
background:#fff;
background:rgba(32,35,42,.3);
color:#fff;
}

.featherlight .featherlight-image{width:100%;}

.featherlight-iframe .featherlight-content{
border-bottom:0;
padding:0;
}

.featherlight iframe{border:0;}

.featherlight-next,.featherlight-previous{
display:block;
position:absolute;
top:25px;
right:25px;
bottom:0;
left:80%;
cursor:pointer;
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
background:rgba(0,0,0,0);
transition:all 0.2s ease-in-out;
}

.featherlight-previous{left:25px;right:80%;}

.featherlight-next:hover,.featherlight-previous:hover{background:rgba(15,40,74,.4);}

.featherlight-next span,.featherlight-previous span{
display:none;
position:absolute;
top:50%;
left:5%;
width:82%;
text-align:center;
font-size:80px;
line-height:80px;
margin-top:-40px;
text-shadow:0 0 5px #20232a;
color:#fff;
font-style:normal;
font-weight:400;
}

.featherlight-next span{right:5%;left:auto;}

.featherlight-next:hover span,.featherlight-previous:hover span{display:inline-block;}

.featherlight-loading .featherlight-next,.featherlight-loading .featherlight-previous{display:none;}

.lightbox{display:none;}

/* customized gallery */

.featherlight-gallery2{background:rgba(100,100,100,0.5);}

.featherlight-gallery2 .featherlight-content{background:#000;}

.featherlight-gallery2 .featherlight-next:hover,.featherlight-gallery2 .featherlight-previous:hover{background:rgba(0,0,0,0.5);}

.featherlight-gallery2 .featherlight-next:hover span,.featherlight-gallery2 .featherlight-previous:hover span{
font-size:25px;
line-height:25px;
margin-top:-12.5px;
color:#fff;
}

.featherlight-gallery2 .featherlight-close{
background:transparent;
color:#fff;
font-size:1.2em;
}

.featherlight-gallery2.featherlight-last-slide .featherlight-next,.featherlight-gallery2.featherlight-first-slide .featherlight-previous{display:none;}

/* text slide */

.thumbnail a{text-decoration:none;}

.blurb{
display:inline-block;
width:150px;
height:150px;
}

.blurb h2{text-align:center;}

.blurb .detail{display:none;}

.blurb .teaser{
font-style:italic;
text-align:center;
}

.featherlight .blurb{
display:inline-block;
width:500px;
height:300px;
color:#99f;
}

.featherlight .blurb .detail{
color:#ddf;
font-size:large;
display:inherit;
}

.featherlight .blurb .teaser{display:none;}

}

@media(max-width:768px){
	
.fl-page h1 span{display:block;}

.fl-page .btn-download{float:none;margin-bottom:1em;}

}

@media only screen and (max-width:1024px){

.featherlight-next:hover,.featherlight-previous:hover{background:0 0;}

.featherlight-next span,.featherlight-previous span{display:block;}

}

@media only screen and (max-width:1024px){

.featherlight .featherlight-content{
margin-left:10px;
margin-right:10px;
max-height:98%;
padding:10px 10px 0;
border-bottom:10px solid transparent;
}

.featherlight-next,.featherlight-previous{
top:10px;
right:10px;
left:85%;
}

.featherlight-previous{left:10px;right:85%;}

.featherlight-next span,.featherlight-previous span{margin-top:-30px;font-size:40px;}

}

/* .................................. MOBILE STYLES ................................. */

@media screen and (max-width:1064px){

a.anchor{top:-56px;}

/* ................................... MOBILE BODY ................................... */

body{

}

/* ................................... MOBILE HEADER ................................... */

#mobnavcon{display:block;}
#headfix{display:none;}
.mobilekill{display:none;}
.dtkill{display:initial;}

header{
background-color:#0f284a;
padding:0;
width:100%;
height:56px;
max-height:56px;
z-index:99999;
position:fixed;
border-bottom:1px solid rgba(255,201,70,.8);
}

#mobtitle{
padding:0;
margin:0;
float:left;
line-height:56px;
color:#fff;
font-size:30px;
margin:0 0 0 15px;
}

#moblogo{margin:5px 0 0 0;height:44px;width:198px;}

#mobnavcon nav{text-align:left;background-color:rgba(15,40,74,.8);}

#mobnavcon nav a{
display:block;
padding:15px 0 15px 20px;
border-bottom:1px solid rgba(255,201,70,.8);
color:#fff;
}

#mobnavcon nav li{padding:0;margin:0;list-style-type:none;line-height:26px;}
#mobnavcon nav ul{padding:0;margin:0;}
#mobnavcon nav ul li:first-child a{border-top:1px solid #707379;}
#mobnavcon nav ul li:last-child a{border:0;}
#mobnavcon nav ul li ul li:first-child a{border-top:0}

#mobnavcon nav ul li ul li{background-color:rgba(255,201,70,.8);line-height:26px;}
#mobnavcon nav ul li ul li a{border-bottom:1px solid rgba(15,40,74,.8);color:#fff;padding:15px 0 15px 40px;}

#mrooful,#mremul,#mresul,#mabuul{display:none;}

.wcbhw{
height:49px;
width:57px;
text-align:center;
vertical-align:middle;
padding:8px 0 0 0;
color:#fff;
}

.webcheckbut{float:right;margin:-59px 0 0 0;width:57px;text-align:right;}

#roofcheck,#remcheck,#rescheck,#abucheck{display:none;}
#roofcheck:checked ~ #mrooful{display:block;}
#remcheck:checked ~ #mremul{display:block;}
#rescheck:checked ~ #mresul{display:block;}
#abucheck:checked ~ #mabuul{display:block;}

#mmainul{height:1941px;}
#scrolldiv{height:1100px;overflow:scroll;}

.mobmenu{
width:320px;
position:absolute;
background-color:transparent;
top:56px;
left:-320px;
transition:all 0.2s ease-in-out;
}

.mobmenubut{
padding:9px 14px 7px 10px;
background:transparent;
color:#fff;
cursor:pointer;
float:right;
margin:0;
font-size:20px;
}

#mobmenucheck{display:none;}
#mobmenucheck:checked ~ .mobmenu{position:absolute;left:0;}
.rotate{-moz-transition:all .3s linear;-webkit-transition:all .3s linear;transition:all .3s linear;}
.rotate.down{-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);transform:rotate(360deg);}
.mobfb a{font-size:40px;margin:0px;display:inline-block;width:52px;float:left;}
.mobfb #mobbbi{padding:14px 0 15px 0;}
#mobhasvg{width:44px;height:35px;}
#mobbbsvg{width:24px;height:38px;}

/* ................................... MOBILE FOOTER ................................... */

footer h1{margin:0 0 20px 0;}
#footcon{width:100%;padding:50px 0 50px 0;text-align:center;}
#frqbut{margin:auto;width:159px;}

#foot1,#foot2,#foot3,#foot4{
float:none;
width:100%;
height:425px;
max-width:320px;
margin:0 auto 30px auto;
text-align:center;
display:inline-block;
}

#foot2 h2,#foot3 h2,#foot4 h2{text-align:center;}
#foot3 h2{margin:0 0 20px 0;}
#foot1{text-align:center;}
#foot1 ul,#foot2 ul,#foot3 ul,#foot4 ul{text-align:center;padding-left:0;}
#foot1b{width:100%;margin:0 0 5px 0;text-align:center;padding:0;}
#foot2b{width:100%;margin:0 0 5px 0;}
#foot3b{width:100%;margin:0;text-align:center;}
#footmap{height:410px;}
#topbut{bottom:20px;right:20px;}

/* ................................... DESKTOP QUOTE BUTTON ................................... */

#quotebutcon{display:block;}
.qbut-menu{overflow-y:scroll;}

/* ................................... MOBILE HOME ................................... */

#homehead{height:500px;}
#hhsscon{height:500px;}
#hhsscon > div{position:absolute;}

.hhssh1{
margin-top:200px;
font-family:esb,sans-serif;
font-size:27px;
color:#ffc946;
}

#homehead1,#homehead2,#homehead3{
background-color:rgba(0,0,0,0);
background-position:center;
background-repeat:no-repeat;
z-index:-99999;
height:500px;
width:100%;
}

#homehead1{background-image:url(cover-1m.jpg);}
#homehead2{background-image:url(cover-2m.jpg);}
#homehead3{background-image:url(cover-3m.jpg);}

#hrow1{width:100%;min-width:320px;padding:50px 0 0 0;}

.hrow1item{
width:100%;
min-width:320px;
max-width:335px;
margin:0;
}

.hdes{
width:90%;
padding:50px 5%;
min-width:288px;
max-width:800px;
}

#hrow4wrap{padding:30px 0;}

#hfeed{
width:92%;
max-width:428px;
height:431px;
padding:0 4%;
}

#hfbss{height:auto;margin:0;}

#fbplug{
width:80%;
max-width:340px;
height:431px;
margin:0 31px;
}

#hrow5wrap{margin:auto;}
#hrow5wrap h2{margin:0 0 20px 0;}
#hpartners{min-width:320px;width:100%;max-width:750px;}
.partcon{height:100px;width:100px;margin:20px;}
.partthumb{height:100px;}

/* .................................. MOBILE ROOFING ................................. */

#roocon{padding:80px 0 0 0;}
#roocon h1{font-size:28px;}
#roorow1{width:100%;min-width:320px;padding:30px 0 0 0;text-align:center;}

.roorow1icon{float:none;margin:auto;text-align:center;}

#rootxt1,#rootxt2,#rootxt3{
width:75%;
min-width:300px;
float:none;
min-height:1px;
margin:50px auto;
padding:0 2%;
text-align:center;
}

#rootxt1 p,#rootxt2 p,#rootxt3 p{text-align:left;}
#roopic1{float:none;margin:auto;}
#ssa{float:none;margin:30px auto;}
#slideshowa{margin:0px auto;}
#slideshowa > div{}
#ssb{float:none;margin:30px auto;}
#slideshowb{margin:0px auto;}
#slideshowb > div{}
.roobordiv{border-bottom:none;}
#roorow2con{}
#roorow2{width:100%;min-width:300px;margin:auto;padding:50px 0 60px 0;}
.wd{width:186px;margin:30px 6px 0 6px;}
.wd h5{}
.wd p{height:255px;}
.wd img{}
#roomiss{padding:0 2%;}
#roorow3{width:100%;min-width:300px;padding:50px 0;}
#rooshing{display:inline-block;float:none;width:85%;max-width:570px;}
#ccway{display:inline-block;float:none;width:85%;}
#rooshing h2,#ccway h2{text-align:center;}
#rooshing a{}
#rooshing a:hover{}
#ccway ul{}
.hammer{}
.nohammer{}

/* .................................. MOBILE SHINGLES ................................. */

#sincon{padding:75px 0 50px 0;}
#sincon h1{font-size:30px;}
#sinrow1,#sinrow2,#sinrow3{width:98%;min-width:313px;padding:50px 1% 20px 1%;}
#sinrow1 h2,#sinrow2 h2,#sinrow3 h2{}
#sinrow1 p,#sinrow2 p,#sinrow3 p{}
.sinbef{}
.sinbef	img{}
.sinbef:before{background-color:#0f284a;color:#ffc946;width:100%;}
.t1:before{content: 'Ash Brown';}
.t2:before{content: 'Autumn Brown';}
.t3:before{content: 'Charcoal';}
.t4:before{content: 'Golden Cedar';}
.t5:before{content: 'Slate';}
.t6:before{content: 'Weathered Gray';}
.t7:before{content: 'White';}
.a1:before{content: 'Barkwood';}
.a2:before{content: 'Birchwood';}
.a3:before{content: 'Charcoal';}
.a4:before{content: 'Hickory';}
.a5:before{content: 'Mission Brown';}
.a6:before{content: 'Pewter Gray';}
.a7:before{content: 'Shakewood';}
.a8:before{content: 'Slate';}
.a9:before{content: 'Weatherwood';}
.s1:before{content: 'Armorshield';}
.s2:before{content: 'Presidential Shake';}
.s3:before{content: 'Slate Storm Master';}
.s4:before{content: 'Trudef Weatherguard';}
.s5:before{content: 'Metal';}
.s6:before{content: 'Metal';}
.s7:before{content: 'Stone Coated Steel';}

/* .................................. MOBILE REMODELING ................................. */

#remcontent{padding:160px 0 100px 0;background-position:center top;background-attachment:scroll;}
#remdes{min-width:320px;width:98%;padding:0;}

#remdestext{
float:none;
width:90%;
margin:0 auto;
max-width:677px;
}

#remdestext h1{font-size:30px;}

#remdespic{
float:none;
margin:50px 0 0 0;
height:50%;
width:50%;
max-height:175px;
max-width:175px;
}

#remdestext h6{margin:20px 0 50px 0;}
#remdestext p{padding:0;text-align:left;}

.systtypecon{min-width:280px;width:100%;margin:50px auto;}
.systtypecon img{float:none;margin:75px 0 0 0;}
.systtypedes{padding:50px 5% 75px 5%;}
.systtypedes h2{}
.systtypedes h6{}
.systtypedes p{}
.systtypeulcon:before,.systtypeimgcon:before{}
.systtypebotcon{text-align:center;}

.systtypeulcon{
width:100%;
max-width:520px;
margin:59px auto 0 auto;
float:none;
height:auto;
text-align:center;
}

.systtypeulcon h6{}
.systtypeul li{}
.systtypeul{text-align:left;}

.systtypeimgcon{
width:100%;
max-width:520px;
margin:59px auto 0 auto;
float:none;
height:450px;
}

.systtypeimgcon:after{}
#systpolimg{}

/* .................................. MOBILE RESTORATION ................................. */

#rescontent{padding:160px 0 100px 0;background-position:center top;background-attachment:scroll;}
#resdes{min-width:320px;width:98%;padding:0;}

#resdestext{
float:none;
width:90%;
margin:0 auto;
max-width:677px;
}

#resdestext h1{font-size:27px;}

#resdespic{
float:none;
margin:50px 0 0 0;
height:50%;
width:50%;
max-height:175px;
max-width:175px;
}

#resdestext h6{margin:20px 0 50px 0;}
#resdestext p{padding:0;text-align:left;}

/* .................................. MOBILE CONTACT US ................................. */

#cucon{padding:75px 0 50px 0;}

#crow1 h1{font-size:30px;}
#cuform{width:90%;}
#cuform p{}
#cuform label{}
#form input{}
.submit{}
#form .submit input{}
.submit:hover #subhov,.submit:focus #subhov{}
#form textarea{}

/* .................................. MOBILE ABOUT US ................................. */

#abtcon{}
#abtcontent{padding:150px 0;background-attachment:scroll;}
#abtdes{min-width:313px;width:98%;}
#abtdestext{}
#abtdestext h1{font-size:30px;}
.areadmore{}
.areadmore:link,.areadmore:visited{}
.areadmore:focus,.areadmore:hover,.areadmore:active{}
#arow2wrap{width:96%;padding:0 2%;}
.ades{width:96%;padding:75px 0;min-width:300px;}
.ades h2{}
.ades h6{}
.adestext{}
#abtnum a:link{}
#abtnum a:visited{}
#abtnum a:focus{}
#abtnum a:hover{}
#abtnum a:active{}
#arow3wrap{padding:75px 0 50px 0;}
#arow3wrap h2{}
#apartners{min-width:320px;width:100%;}
.apartcon{min-width:160px;margin:25px;}
.apartcon:hover{}
.apartthumb{}
#apart1{}
#apart2{}
#apart3{}
#apart4{}
#apart5{}
.awardpic{}
#arow4wrap{}
#arow4{width:100%;min-width:320px;padding:50px 0;}
#arow4 h2{}
.arow4pics{min-width:270px;}

/* .................................. MOBILE PRIVACY ................................. */

#pricon{padding:75px 0 50px 0;}
#pricon h1{font-size:30px;}
#pricon h2{font-size:25px;}
#prirow1{width:95%;min-width:300px;padding:0 2%;}

/* .................................. MOBILE LANDING ................................. */

#damhead{height:auto;}
#damheadcon{height:auto;padding-top:125px;min-height:500px;}
.damheadh1{font-size:28px;}
#damhead{width:100%;}
#svgdalogo{height:120px;width:155px;}
#dabutton{width:60%;padding:15px 15px;}
#dabutton h2{font-size:20px;}
#darow1{width:100%;min-width:320px;}
#damiss h2,#darow3 h3{font-size:28px;}
#darow3{width:100%;min-width:320px;padding:50px 0 0 0;}
.darow3item h2{font-size:26px;}

.darow3item{
width:100%;
min-width:320px;
max-width:335px;
margin:0;
}

/* .................................. MOBILE GALLERY ................................. */

.galheadcon{padding:135px 0 75px 0;}
.galheadcon h1{}
.galheadcon h1:after{}
#galh1:after{}
.galheadcon h2{margin:50px 0 25px 0;}
.photogal{width:100%;}
.galthumbcon{}
.galthumbcon:hover{}
.galthumb{}

}