header li {display: inline-block;}
header img, .menu-primary-menu-container {display: inline-block;}
header a {text-transform: uppercase; text-decoration: none; color: #333; font-weight: 500;}

.heroCell span {color: #fff; }
.heroOverlay {width: 600px; height: 600px; background-image: url(../img/strata-overlay.png); position: absolute;bottom: 0px;left: 0px; opacity: 0.5}
.heroCell { display: table-cell;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    text-align: center;
    font-family: 'Eurostile LT Std';
	background-color: rgba(0,0,0,0.5);}
.hero {width: 100%; height:70vh; display: table; position: relative;}

.icon { position:relative; background-image: url(../img/strata-hexagon.png); display: block; margin: 0 auto; background-size: contain; width: 110px; height: 110px; background-repeat: no-repeat; background-position: center center}
.icon img {position: absolute; left: 25px; top: 25px;}


.serviceBlock { text-align: center; border-bottom: 1px solid #efefef; padding: 75px 0;}
.serviceBlock > [class^="grid-"] { padding: 0 20px; }


.carousel {padding: 75px 0;}
.carousel img {max-height: 80px; width: auto;}
.carousel h2 {text-align: center; margin-top: 0px; }

.logoCarousel {max-width: 1000px; margin: 0 auto;}
.logoCarousel .slick-slide img {margin: 0 auto;}


.values {padding: 75px 0; }
.values {text-align: center;}
.values span {line-height: 1.25em; max-width: 1000px; margin: 0 auto; }


.testimonials { text-align: center; padding: 75px 0; }
.testimonials span p:before { content: "“"; }
.testimonials span p:after { content: "”"; }
.testimonials img {border: 0px; margin: 20px 0 0 0; max-height: 80px; width: auto;}

.textBlock {padding: 75px 0; border-bottom: 1px solid #efefef; }


.action {text-align: center; padding: 75px 0; border-bottom: 1px solid #efefef; }
.action span {font-size: 30px;}
.action p {margin: 0px 0px 20px 0px;}
.action {background-color: #efefef;}


.footer { padding: 75px 0; background-image: url(../img/strata-seamless.jpg); }
.footerContent > [class^="grid-"] { padding: 0 20px; }
.footer img {padding: 20px;}


input, textarea, select {padding: 13px; border: 1px solid #eceaed; font-size: 18px; margin-right: 5px; font-weight: 300; }
input:focus,
textarea:focus,
select:focus { outline: none; }


.gform_body li, .gform_body {display: inline-block;}
.gform_footer, .gform_footer input {display: inline-block;}

/*get quote page*/
#map {height: 400px;width: 100%;}

/*nav effect*/

nav ul li a,
nav ul li a:after,
nav ul li a:before {
  transition: all .5s;
}

nav.stroke ul li a,
nav.fill ul li a {
  position: relative;
}
nav.stroke ul li a:after,
nav.fill ul li a:after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  content: '.';
  color: transparent;
  background: #aaa;
  height: 1px;
}
nav.stroke ul li a:hover:after {
  width: 100%;
}

nav.fill ul li a {
  transition: all 2s;
}

nav.fill ul li a:after {
  text-align: left;
  content: '.';
  margin: 0;
  opacity: 0;
}
nav.fill ul li a:hover {
  color: #fff;
  z-index: 1;
}
nav.fill ul li a:hover:after {
  z-index: -10;
  animation: fill 1s forwards;
  -webkit-animation: fill 1s forwards;
  -moz-animation: fill 1s forwards;
  opacity: 1;
}



#responsive-menu-title-image img {max-width: 100%;}
#responsive-menu-title img {margin-top: 70px !important;}

/*Responsive content*/


@media (max-width: 700px) {
	header {position: absolute; top: 0px; left: 0; right:0; z-index: 9999; padding: 30px;}
	header .cell img {max-width: 100%; height: auto; margin: 0 auto; display: block;}
	header .nav {display: none;}

  .heroText span {position: relative; top: 30px;}

	.hero {height: 80vh; position: relative;}
	}


@media (max-width: 786px) {



.mobile-only {background: rgba(0, 0, 0, 0.7); color:#fff; width:100%; padding:15px; position:fixed; top:0; z-index:99999 !important; font-size:16px;}
.mobile-only a {color:#fff !important; text-decoration:none !important;}
header {display:none;}
.logo-mobonly {max-width:250px; height:auto; display:block; clear:both; margin: 0 auto 20px auto;}
.footerContent img {max-width:100% !important; height:auto;}

	body {overflow-x: hidden; }
	.heroOverlay {width: 200px; height: 200px; background-size: cover;}
	.heroText {font-size: 24px; padding: 30px;}

	header .cell img {max-width: 220px; height: auto; margin: 0 auto; display: block;}

	header nav li {margin-right: 10px;}
	header nav li:last-child {margin-right: 0px;}

	.grid-container {padding: 30px 30px;}
	.grid-container > [class^="grid-"] {padding: 20px 0px;}
.remove-padding {padding:0; position:relative; top:30px;}


	.values span {font-size: 29px; font-weight: 700;}

	.gform_body li , .gform_body input, .gform_body textarea, .gform_footer input { width: 100%; }
	.gform_body li {padding-bottom: 10px;}

	#responsive-menu-title-image {margin-right: 0px !important;}

	.footer {padding: 20px 0;}

	.getQuote #field_2_4 input {
    margin-bottom: 10px;
	}
	.getQuote #field_2_4 #input_2_4_5 {margin-bottom: 0px;}
	
	.gform_footer input,
	.gform_footer {width: 100%;}

	.action span {line-height: 1.25em;}
	.action p {margin-top: 20px;}

  .footer img {max-width: 300px; height: auto;}

}


@media (min-width:700px) and (max-width: 1024px) {
header .cell img {margin: 20px auto;}
#responsive-menu-container {max-width: 300px !important;}
.hero {height: 40vh; position: relative;}
.noMob {padding: 0px; }
#menu-primary-menu,
.menu-primary-menu-container {width: 100%; text-align: center; padding: 10px 0;}


}

@media (min-width:1024px) {

.mobile-only, .logo-mobonly {display:none;}

}

@media (min-width: 786px) {

.menu-phone:before {
content: "\f095";
font-family: 'FontAwesome';
padding-right:5px;
}


header {position: fixed; width: 100%; background-color: #f7f7f7; z-index: 1000;}
header { height: 80px; display: table; }
header .cell {display: table-cell; height: 80px; vertical-align: middle;}
header img {max-width: 200px; height: auto;}
header .nav {width: 100%; text-align: right;}
header li {margin-left: 15px;}
.push {height: 80px;}

.hero {height:70vh;}


.heroText span {font-size: 50px;}
.heroText span p {font-size: 24px; line-height: 1.35em; font-weight: 300 !important;}
.heroText {max-width: 800px; margin: 0 auto;}

.carousel h2 { font-size: 50px; }
.values span { font-size: 50px; font-weight: 700; }


.testimonials span p {font-size: 50px; line-height: 1.25em; max-width: 1000px; margin: 0 auto ; font-weight: 700; }
.testimonials p { font-size: 18px; margin: 0; }

.contact .grid-6:first-child{padding-right: 10px;}
.contact .grid-6:last-child{padding-left: 10px;}

.getQuote .gform_body li input {width: 100%;}
.getQuote .gform_body li {width: 50%; display: inline-block; padding: 5px;}
.getQuote .gform_body li:last-child {width: 100%;}
.getQuote #field_2_4 {width: 100%;}
.getQuote #field_2_4 input {margin-bottom: 10px;}
.getQuote #field_2_4 #input_2_4_5 {margin-bottom: 0px;}

.contact .gform_body  li {width: 50%; padding: 5px;}
.contact .gform_body li input {width: 100%;}
.contact #field_3_4, .contact #field_3_4 input {width: 100%;}
.contact .gform_footer {margin-left: 5px;}
.contact .contactblock {padding: 5px;}

.textBlock .grid-6:first-child {padding-right: 10px;}
.textBlock .grid-6:last-child {padding-left: 10px;}

.textBlock .grid-4:first-child {padding-right: 10px;} 
.textBlock .grid-8:last-child {padding-left: 10px;}

}