@import url("reset.css"); 
@import url("grid.css"); 
@import url("basic.css"); 

@import url('https://fonts.googleapis.com/css?family=Lato:300, 400, 700'); 

body, 
input, 
select, 
textarea{
font-family:'Lato',arial,sans-serif}

body{
font-size:15px; 
line-height:1.733; 
color:#313235; 
font-weight:300; 

-webkit-font-smoothing:antialiased; 
 -moz-osx-font-smoothing:grayscale}

body{

}

#outer{
/*max-width:1800px;*/ 
margin:0 auto}

#top{

}

#header{
position:fixed; 
z-index:11199; 
top:0; 
left:0; 
width:100%; 

background:transparent; 
padding:40px 60px; 

-webkit-transition:padding 500ms ease,background-color 500ms ease; 
   -moz-transition:padding 500ms ease,background-color 500ms ease; 
-ms-transition:padding 500ms ease,background-color 500ms ease; 
 -o-transition:padding 500ms ease,background-color 500ms ease; 
 transition:padding 500ms ease,background-color 500ms ease}

#header.scrolled{
padding:20px 60px; 
background:rgba(53,61,82,0.8)}

#logo{
width:164px; 
height:46px; 
float:left; 
background:url(../images/logo.png) rgba(255, 255, 255, 0.5) no-repeat; 
/*background:url(../images/logo.png) white no-repeat;*/
background-size:contain}

#logo a{
text-indent:-9999px; 
display:block; 
width:300px; 
height:46px}

#nav{
width:560px; 
float:right}

#navicon, 
#mobnav{
display:none}

@media (max-width:992px){
	#intro{
	margin-top:100px;}
}
@media (min-width:992px){
	#intro{
	margin-top:130px;}
}
#intro{
height:30vh; 
min-height:340px; 
background-color:#565d70; 

-webkit-background-size:cover; 
   -moz-background-size:cover; 
     -o-background-size:cover; 
    background-size:cover; 

background-position:center center; 

background-image:url(../images/intro.jpg)}

.home #intro{
height:100vh; 
position:relative;}

#introbox{
width:100%; 
height:100%; 
position:absolute; 
left:0; 
right:0; 
top:0; 
bottom:0}

#intrologo{
height:100%; 
background:url(../images/intrologo.png) left center no-repeat; 
background-size:100% auto; 

display:none !important}

#introtext{
width:100%; 
height:50px; 
position:absolute; 
top:50%; 
margin-top:-25px; 
text-align:center}

#main{
padding-bottom:60px; 
position:relative; 
z-index:1; 
background:#fff}

#cta{
border-top:1px solid #e4e6e8; 
padding:30px 0; 
position:relative; 
z-index:1; 
background:#fff}

#footer{
background:#292e3e; 
position:relative; 
z-index:1; 
padding-top:20px}

.home #footer{
display:none}

a{
text-decoration:none; 
color:#acb3be; 
-webkit-tap-highlight-color:rgba(0,0,0,0)}

a:hover{
color:#292e3e}

strong, b{

}

h2{
line-height:1; 
font-size:18px; 
text-align:center; 
text-transform:uppercase; 
padding:55px 0 45px 0}

h3{
font-size:16px; 
text-align:center; 
text-transform:uppercase; 
margin:45px 0 30px 0}

h4{
text-transform:uppercase; 
margin:30px 0 15px 0}

h5, h6{

}

h2 a, h3 a, h4 a, h5 a, h6 a{
text-decoration:none}

h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover{

}

p, #main ul, #main ol{
margin: 0 0 30px 0}

#main ul li{
list-style-type:disc; 
margin-left:20px}

#main ol li{
list-style-type:decimal; 
margin-left:20px}

#introtext p{
margin:0; 
font-size:40px; 
font-weight:400; 
color:#fff}

#cta p{
font-size:18px; 
color:#333639; 
margin:0; 
line-height:22px; 
padding:19px 0}

#footer p{
margin:0 0 20px 0; 
font-size:14px}

#footer, 
#footer a{
color:#9fa8b5}

#footer a:hover{
color:#fff}

blockquote{
font-style:italic; 
margin:0 20px 20px 20px}

hr{
background:none; 
border:0; 
clear:both; 
display:block; 
float:none; 
font-size:0; 
margin:0; 
padding:0; 
overflow:hidden; 
width:100%; 
height:1px; 
margin:10px 0 20px 0; 
border-bottom:1px solid #bbb}

.textright{
text-align:right}

.textcenter{
text-align:center}

.uppercase{
text-transform:uppercase}

.wide{
letter-spacing:0.1em}

span.cspan{
display:inline-block; 
width:50px}

#nav {

}

#nav ul{
float:right}

#nav ul li{
float:left; 
margin:0 0 0 30px}

#nav ul li a{
color:black; 
font-weight:700; 
text-transform:uppercase}

#nav ul li a:hover, 
#nav ul li.current-menu-item a{
color:#acb3be}

.button{

}

.button a{
width:100%; 
display:block; 
text-align:center; 
text-decoration:none; 
line-height:22px; 
padding:19px 30px; 

font-weight:400; 
text-transform:uppercase; 

-webkit-border-radius:2px; 
 -moz-border-radius:2px; 
 border-radius:2px; 

color:#fff; 
background:#acb3be; 

-webkit-transition:background 500ms ease; 
 -moz-transition:background 500ms ease; 
-ms-transition:background 500ms ease; 
 -o-transition:background 500ms ease; 
 transition:background 500ms ease}

.button a:hover{
background:#292e3e}

.editlink{
clear:both}

.editlink span{
display:inline-block}

.editlink a{
text-align:center; 
text-decoration:none; 
line-height:20px; 
padding:8px 20px; 

font-weight:400; 
text-transform:uppercase; 

-webkit-border-radius:2px; 
 -moz-border-radius:2px; 
 border-radius:2px; 

color:#fff; 
background:#acb3be; 

-webkit-transition:background 500ms ease; 
 -moz-transition:background 500ms ease; 
-ms-transition:background 500ms ease; 
 -o-transition:background 500ms ease; 
 transition:background 500ms ease}

.editlink a:hover{
background:#292e3e}

#totop{
position:fixed; 
right: 10px; 
bottom:25px; 
width:35px; 
height:35px; 
background:#acb3be; 
-webkit-border-radius:2px; 
-moz-border-radius:2px; 
border-radius:2px; 
z-index:999; 
display:none}

#totop a{
text-align:center; 
display:block; 
width:35px; 
height:35px; 
line-height:40px; 
font-size:20px; 
color:#fff; 
text-decoration:none; 

-webkit-tap-highlight-color:rgba(0,0,0,0)}

div.wpcf7{
margin-top:30px !important}

.wpcf7 p{
line-height:1.8; 
margin-bottom:10px}

input, 
input[type="text"], 
input[type="email"], 
textarea, 
select {
width:100%}

input, 
input[type="text"], 
input[type="email"], 
input[type="submit"], 
textarea{
-webkit-appearance:none; 
 -webkit-border-radius:0px; 
-moz-border-radius:0px; 
border-radius:0px;  
 
 color:#313235; 
 font-size:16px; 
background:#f0f0f0; 
padding:6px; 
border:1px solid #acb3be; 

-webkit-border-radius:2px; 
 -moz-border-radius:2px; 
 border-radius:2px; 
 
-webkit-transition:all 500ms ease; 
 -moz-transition:all 500ms ease; 
-ms-transition:all 500ms ease; 
 -o-transition:all 500ms ease; 
 transition:all 500ms ease}

input:focus, 
input[type="text"]:focus, 
input[type="email"]:focus, 
input[type="submit"]:focus, 
textarea:focus{
background:#fff; 
border:1px solid #292e3e}

input[type="submit"]{
display:inline-block; 
margin-bottom:0; 
text-align:center; 
vertical-align:middle; 
cursor:pointer; 
background-image:none; 
white-space:nowrap; 

-webkit-user-select:none; 
-moz-user-select:none; 
-ms-user-select:none; 
user-select:none; 

padding:6px 40px; 
font-size:16px; 
border:1px solid #acb3be; 
background:#acb3be; 
color:#fff; 

width:100%; 
display:block; 
text-align:center; 
text-decoration:none; 
line-height:20px; 
padding:12px 30px; 

font-weight:400; 
text-transform:uppercase; 

color:#fff; 
background:#acb3be}

input[type="submit"]:hover{
text-decoration:none; 
cursor:pointer; 

border:1px solid #292e3e; 
background:#292e3e}

input[type="submit"]:disabled{
color:#fff; 
border:1px solid black; 
cursor:auto; 
background:black}

ul#copy{
float:right; 
margin:0}

ul#copy li{
margin:0}

ul#copy li a{
color:#acb3be}

ul#copy li a:hover{
color:#292e3e}

.gmap{
width:100%; 
height:500px; 
margin:0}

.gmap img{
max-width:none}

@media (max-width:480px){

input[type="text"],
input[type="email"],
textarea,
select {
width:100%}

select, textarea, input, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], select:focus, input:focus{
font-size:16px}}

@media (min-width:374px) and (max-width:413px){

}

@media (min-width:414px) and (max-width:480px){

}

@media (min-width:481px) and (max-width:767px){

}

@media (max-width:767px){
.mobilebutton{
display:block}

.nomobile{
display:none}

.mobblock{
display:block}

#cta p{
line-height:1.6}}

@media (max-width:768px){

}

@media (min-width:768px) and (max-width:991px){

#header,
#header.scrolled{
padding:20px 20px}


}

@media (max-width:991px){

.home #totop{
display:none !important}

#logo, 
#logo a{
 /*width:30px; */
 margin-top: 9px;
 height:43px}

#header{
padding:30px 20px}

#header.scrolled{
padding:15px 20px}

#nav{
display:none}

#navicon{
display:block; 
float:right; 
position:relative; 
width: 30px; 
height:40px; 
margin-top:1px; 

cursor:pointer; 
-webkit-tap-highlight-color:rgba(0,0,0,0)}

#navicon span{
 background-color:black; 
 display:inline-block; 
 height:3px; 
 left: 7px; 
 position:absolute; 
 top: 19px; 
 width:26px; 
 -webkit-transition:all 250ms ease; 
 -moz-transition:all 250ms ease; 
 -o-transition:all 250ms ease; 
 transition:all 250ms ease}

#navicon span:before{
 background-color:black; 
 content:""; 
 display:inline-block; 
 height:3px; 
 left:0; 
 position:absolute; 
 width:26px; 
 -webkit-transition:all 250ms ease; 
 -moz-transition:all 250ms ease; 
 -o-transition:all 250ms ease; 
 transition:all 250ms ease}

#navicon span:after{
 background-color:black; 
 content:""; 
 display:inline-block; 
 height:3px; 
 left:0; 
 top:-8px; 
 position:absolute; 
 width:26px; 
 -webkit-transition:all 250ms ease; 
 -moz-transition:all 250ms ease; 
 -o-transition:all 250ms ease; 
 transition:all 250ms ease}

#navicon span:before{
 top:8px}

#navicon.active span{
background:rgba(0,0,0,0)}

#navicon.active span:before{
position:absolute; 
 left:0; 
 top:0; 
 width:25px; 
 -webkit-transform:rotate(-45deg); 
 -moz-transform:rotate(-45deg); 
 -o-transform:rotate(-45deg); 
 -ms-transform:rotate(-45deg); 
 transform:rotate(-45deg)}

#navicon.active span:after{
 position:absolute; 
 left:0; 
 top:0; 
 width:25px; 
 -webkit-transform:rotate(45deg); 
 -moz-transform:rotate(45deg); 
 -o-transform:rotate(45deg); 
 -ms-transform:rotate(45deg); 
 transform:rotate(45deg)}

#mobnav{
display:block; 
position:fixed; 
left:0; 
top:0; 
width:100%; 
height:100%; 
padding:160px 20px 50px 20px; 
background:#292e3e; 
background:rgba(41,45,62,0.98); 

color:#fff; 
text-align:center; 
font-size:16px; 
line-height:2; 
font-weight:400; 

z-index:-2; 
opacity:0; 

-webkit-transition:opacity 500ms ease,z-index 500ms ease; 
 -moz-transition:opacity 500ms ease,z-index 500ms ease; 
-ms-transition:opacity 500ms ease,z-index 500ms ease; 
 -o-transition:opacity 500ms ease,z-index 500ms ease; 
 transition:opacity 500ms ease,z-index 500ms ease}

#mobnav.active{
z-index:11198; 
opacity:1; 

-webkit-transition:opacity 500ms ease,z-index 500ms ease; 
 -moz-transition:opacity 500ms ease,z-index 500ms ease; 
-ms-transition:opacity 500ms ease,z-index 500ms ease; 
 -o-transition:opacity 500ms ease,z-index 500ms ease; 
 transition:opacity 500ms ease,z-index 500ms ease}
#mobnav a{
color:#fff}

#mobnav .menu a{
text-transform:uppercase; 
font-weight:700}

#mobnav a:hover, 
#mobnav li.current-menu-item a{
color:#acb3be}

#intrologo{
background-size:280px auto; 
background-position:center center}

#introtext p{
padding:0 20px}

}

@media (max-width:370px){

#header,
#header.scrolled{
padding:20px 15px}

#logo, 
#logo a{
 /*width:22px; */
 margin-top: 9px;
 height:34px}

}

@media (min-width:992px){
.home #outer{
max-height:100vh; 
overflow:hidden}}
@media (min-width:992px) and (max-width:1179px){

#header{
padding:30px 30px}

#header.scrolled{
padding:15px 30px}

#logo, 
#logo a{
margin-top: 15px;
 /*width:174px; */
 height:49px}

#intrologo{
width:174px; 
margin-left:30px}

#nav{
line-height:49px}}

@media (min-width:1180px) and (max-width:1299px){

#header{
padding:30px 40px}

#header.scrolled{
padding:20px 40px}

#logo, 
#logo a{
 /*width:206px; */
 height:58px}

#intrologo{
width:206px; 
margin-left:40px}

#nav{
line-height:58px}}

@media (min-width:1300px){

#header{
padding:28px 60px; 
/*max-width:1800px;*/
margin:0 auto; 
left:auto}

#header.scrolled{
padding:20px 60px}

#logo, 
#logo a{
margin-top: 25px;
 /*width:54px; 
 height:77px;*/}

#intrologo{
width:214px; 
margin-left:60px}

#nav{
line-height:77px}}
textarea.invalid, input.invalid {
    border: #ff0000 solid;
}

.image-box-hd {
    float: left;
}

@media (max-width:1023px){
    .image-box-hd {
        width: 100%;
        margin: 10px 0px;
    }
}
@media (min-width:1024px){
    .image-box-hd {
        width: calc(100% - 20px);
        margin: 10px;
    }
}

.project-gallery {
	margin-top: 40px;
}
.project-gallery h2 {
	font-weight: bold;
}