/* This is the main CSS file for Brick and Lime theme. This will hold all major styling */
/* Author: Adam Quigley; */

/*----------------------------------------------- GLOBAL CSS
*/

.hide-for-small-up { display: none;}

/*fonts declarations */
.head .header-inner a.email, .head .header-inner a.tel,
.navi .top-bar, h2.about-us-title, .container p, .button, button, .what-we-do.container .nav-block h1, .what-we-do.container .nav-block h3, .what-we-do.container .nav-block-row-3 .nav-block h2,
.surveys-desc p, .above-footer h2, .above-footer p, .frm_pro_form input, .frm_pro_form textarea, #menu-footer-links.menu>li>a, .footer-three p, .copyright, .off-canvas .menu>li>a,
h1.page-title, .main-content p, .main-content ul, #content #inner-content .entry-content h2 {
	font-family: 'Bitter', serif!important;
}

/*Font Styles */
h3.top_title {
  font-family: 'langdonregular';
}

h2.middle_title, .what-we-do.container h1, .surveys.container h1 {
	font-family: 'hagin_caps_mediumregular';
}

h3.bottom_title, .what-we-do.container h2, .surveys.container h2 {
	font-family: 'simplificasimplifica';
}

h3.tagline, .what-we-do.container .nav-block h1 span:last-of-type {
  font-family: 'nautilus_pompiliusregular';
}

/*Transitions*/
.nav-block, .button, button, #menu-footer-links.menu>li>a:after {
	-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;
}

/* Buttons */

.button, button{
	margin: 0!important;
	background-color: #64c293!important;
	border-radius: 25px!important;
	text-align: center!important;
	line-height: 44px!important;
	padding: 0!important;
	width: 100%;
	text-transform: uppercase;
	font-weight: bold;
	border: 1px solid #64c293!important;
}

a.button:hover, button:hover{ background-color: #fff!important; color: #64c293!important;}

/*----------------------------------------------- HEADER
*/

/*these different header saection are
for both ineer and frontpage styles */

.head {
	background-color: #2f2f2f;
}

.header-inner {
    padding: 20px 0;
    display: block;
    height: 185px;
}

/* FrontPage only */
body.home .header-inner {
    padding: 0;
    display: block;
    height: 155px;
}

/* FrontPage only */
body.home .head {
  position: absolute;
  z-index: 500;
  width: 100%;
	top: 50px;
	background-color: transparent;
}

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

.head .header-inner a.email, .head .header-inner a.tel  {
	display: block;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	font-size: 14px;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	padding: 50px 0 0 0;
	word-break: break-all;
}

.head .header-inner a.email:before, .head .header-inner a.tel:before {
	display: block;
	width: 22px; height: 23px;
	margin: 0 auto 5px;
	transition-timing-function: ease;
}

.head .header-inner a.email:hover, .head .header-inner a.tel:hover {   transition: opacity .25s ease-in-out; text-decoration: underline;}

/*icons for the top contact information. These icons reside in assetss/images */
.head .header-inner a.email:before { 	content: url('../images/email-icon.png'); }
.head .header-inner a.tel:before   { 	content: url('../images/tel-icon.png'); }

/*----------------------------------------------- HERO CAROUSEL
*/

.hero-image {
	position: relative;
}

.hero-overlay {
  position: absolute; top: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-inner {
	padding-top:100px;
	text-align: center;
}

h3.top_title, h2.middle_title, h3.bottom_title, h3.tagline {
	text-transform: uppercase;
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	line-height: 65px;
	margin: 0; padding:0;
}

h3.top_title { font-size: 32px; }
h2.middle_title { font-size: 63px; font-weight: 600; }
h3.bottom_title { font-size: 48px; }

h3.tagline {font-size: 32px; text-transform: none; }

h3.tagline:before, h3.tagline:after {
	display: block;
	content: '.';
	text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
	font-size: 85px;
  line-height: 23px;
}

h3.tagline:before { float: left; }
h3.tagline:after { float: right; }

/*----------------------------------------------- Navigation Desktop
*/

.navi .top-bar {
	background-color: #2f2f2f;
	height: 78px;
	padding: 0;
}

.main-desktop-menu { height: 75px; padding: 20px 0; }

.navi .top-bar a {
	font-size: 14px;
	text-transform: uppercase;
	color: #fff;
	font-weight: 600;
	margin: 0 10px 0 0;
	border: 2px solid transparent;
}

.menu .active>a, .navi .top-bar a:hover {
	background: none!important;
	border: 2px solid #fff;
	border-radius: 8px;
}

.is-accordion-submenu-parent>a:after, .dropdown.menu.vertical>li.opens-right>a:after {
	border-color: #fff transparent transparent!important;
}

.top-bar ul {
	background-color: #2f2f2f!important;
}

.is-dropdown-submenu {
	border: none!important;
	padding-top: 22px!important;
	padding-bottom: 10px!important;
}

.is-dropdown-submenu li a {
	border: none!important;
}

.is-dropdown-submenu li:hover a {
	text-decoration: underline;
}

/*----------------------------------------------- Navigation Tablet/Mobile
*/

.menu.vertical>li {
	border: none!important;
}

@media screen and (min-width: 1025px) {
	a[data-toggle="off-canvas"] {
		display: none;
	}
}

a[data-toggle="off-canvas"] {
	float: right;
}

.hamburger-icon {
	width: 2.8125rem;
	height: 3.75rem;
}

svg .hamburger-icon__container {
  fill: #fff;
}

.off-canvas {
	background: #2f2f2f!important;
	z-index: 999!important;
}

.off-canvas .menu>li>a, .off-canvas .menu>li>a:focus {
	border: none!important;
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	outline: none;
}

.off-canvas .menu>li.is-accordion-submenu-item>a {
	padding-left: 1.5rem;
}

.hamburger-icon.active .hamburger-icon__top {
  -ms-transform: rotate(-45deg) translate(0, 8px);
  transform: rotate(-45deg) translate(0, 8px);
}

.hamburger-icon.active .hamburger-icon__middle {
  -ms-transform: scale(0);
  transform: scale(0);
}

.hamburger-icon.active .hamburger-icon__bottom {
  -ms-transform: rotate(45deg) translate(0, -8px);
  transform: rotate(45deg) translate(0, -8px);
}

svg .hamburger-icon__container .hamburger-icon__line {
  transition: transform 400ms ease-out;
  -ms-transform-origin: 16px 16px;
  transform-origin: 16px 16px;
}

/* -------------------------------------------------------------------------------------------------------- Main Content Area */

.container { position: relative; width: 100%; overflow: hidden; }
#content #inner-content { padding: 100px 0!important;}

h1.page-title {
	font-weight: bold;
	font-size: 28px;
	text-transform: uppercase;
}

#content #inner-content .entry-content h2 {
	color: #64c293;
	font-size: 16px;
	line-height: 26px;
	text-transform: uppercase;
	font-weight: bold;
}

/*----------------------------------------------- First About Us Section
*/

h2.about-us-title {
	font-size: 29px;
	color: #2f2f2f;
	text-transform: uppercase;
	line-height: 32px;
	font-weight: 700;
	text-align: left;
	margin: 0 0 35px 0;
	max-width: 470px;
}

h2.about-us-title span.word4 { word-wrap: break-word; }

.about-us.container .button{ max-width: 241px; margin-top: 15px!important;}
.about-us.container .columns{
	background: #fff;
	padding-left: 107px;
	padding-top: 135px;
	padding-bottom: 135px;
}

.about-us.second-about-us.container .columns{
	padding-left: 0.9375rem;
	padding-right: 107px;
}

/* -------------------------------------------------------------------------------------------------------- Gallery Template  */

.gallery {
	margin: 50px 0;
}

.gallery .columns:last-child:not(:first-child) {
	float: left;
}

.gallery img {
	margin: 0 0 30px;
}

/*----------------------------------------------- What We Do Section
*/

.what-we-do.container{ padding: 55px 0 120px;}

.what-we-do.container h1, .surveys.container h1{
	text-transform: uppercase;
	color: #fff;
	text-shadow: -1px 2px 2px rgba(35, 31, 32, 0.75);
	font-size: 56px;
	line-height: 50px;
}

.what-we-do.container h2, .surveys.container h2{
	color: #fff;
	text-transform: uppercase;
	text-shadow: -1px 2px 2px rgba(35, 31, 32, 0.75);
	line-height: 40px;
	margin: 0 0 35px;
	font-size: 30px;
}

.what-we-do.container .nav-block {
	border: 2px solid rgba(255, 255, 255, 0.6);
	border-radius: 15px;
	padding-top: 30px;
	padding-bottom: 58px!important;
	overflow: hidden;
	margin-bottom: 20px;
	position: relative;
}

/* Nav Blocks Row 1 */

.what-we-do.container .columns:nth-of-type(1) .nav-block.large h1 {
	padding: 0 31px;
}

.what-we-do.container .columns:nth-of-type(2) .nav-block.large h1 {
	padding: 0 15px;
}

.what-we-do.container .nav-block:hover {
	background: #64c293;
}

.what-we-do.container .nav-block.large h1 {
	text-align: center;
	font-weight: bold;
	font-size: 51px;
	line-height: 1;
	margin: 0 0 20px;
}

.what-we-do.container .nav-block.large h1 span:last-of-type {
	font-weight: normal;
	font-size: 43px;
	text-transform: none;
}

.what-we-do.container .nav-block .button{
	border-radius: 0!important;
	text-align: left!important;
	background: rgba(100, 194, 147, 0.8)!important;
	border-top: 2px solid rgba(255,255,255,0.6);
	line-height: 56px!important;
	padding: 0 18px!important;
	position: absolute;
	bottom: 0;
	width: 100%;
	border-bottom-left-radius: 13px!important;
	border-bottom-right-radius: 13px!important;
	display: block!important;
}

.what-we-do.container .nav-block .button:after{
	content: url(../images/what-we-do-arrow.png);
	display: inline-block;
	float: right;
	max-height: 24px;
	padding-top: 6px;
}

/* Nav Blocks Row 2 */

.what-we-do.container .nav-block-row-2 .nav-block{
	padding-top: 15px;
}

.what-we-do.container .nav-block h3{
	color: #fff;
	font-weight: bold;
	font-size: 20px;
	line-height: 24px;
	text-transform: uppercase;
	text-shadow: -1px 2px 2px rgba(35, 31, 32, 0.75);
	padding: 0 18px 16px;
	min-height: 64px;
}

.what-we-do.container .nav-block-row-2 .columns:nth-of-type(1) .nav-block h3 span.word2,
.what-we-do.container .nav-block-row-2 .columns:nth-of-type(3) .nav-block h3 span.word2{
	display: block;
}

/* Nav Blocks Row 3 */

.what-we-do.container .nav-block-row-3 .nav-block {
	padding-top: 19px;
}

.what-we-do.container .nav-block-row-3 .nav-block h2 {
	font-weight: bold;
	font-size: 26px;
	line-height: 1;
	margin: 0 18px 19px;
}

/*----------------------------------------------- Surveys Section
*/

.surveys.container { padding: 110px 0 110px;}

.surveys-desc p {
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	line-height: 26px;
	text-shadow: -1px 2px 2px rgba(35, 31, 32, 0.5);
	margin: 0 0 45px;
}

.surveys.container .button {
	max-width: 348px;
	background-color: #2f2f2f!important;
	border: 1px solid #2f2f2f!important;
}

.surveys.container .button:hover {
	background-color: #fff!important;
	color: #2f2f2f!important;
}

/* -------------------------------------------------------------------------------------------------------- Google Map Region */

.acf-map {
  width: 100%;
  height: 600px;
}

/* fixes potential theme css conflict */
.acf-map img {
  max-width: inherit !important;
}

.contact-map {
  height: 300px;
  overflow: hidden;
}

body.page-template-contact .acf-map {
  width: 100%;
  height: 300px;
}

/* -------------------------------------------------------------------------------------------------------- Above Footer Section */

.above-footer {
	padding: 60px 0;
}

.above-footer h2 {
	margin-bottom: 1rem;
}

/* Footer Contact Section */

.above-footer p a {
	color: #000000;
}

.above-footer p a:not(.button):hover {
	text-decoration: underline;
}

@media screen and (min-width: 1025px) {
	.above-footer .contact-details h2 {
		margin-bottom: 53px;
	}
	.above-footer .contact-details .button {
		margin-top: 53px!important;
	}
}


/* Form Footer Section */

.above-footer .frm_form_title { display: none;}
.above-footer h2 {
	font-weight: bold;
	font-size: 28px;
	line-height: 1;
	color: #2f2f2f;
	text-transform: uppercase;
}

.frm_style_formidable-style.with_frm_style fieldset {
	padding: 0;
}

@media screen and (min-width: 1025px){
	.above-footer .frm_pro_form #frm_field_64_container,
	.above-footer .frm_pro_form #frm_field_65_container {
		display: inline-block;
		float: left;
		max-width: 50%;
		width: 100%;
		clear: none;
	}

	.above-footer .frm_pro_form #frm_field_64_container { padding-right: 10px;}
	.above-footer .frm_pro_form #frm_field_65_container { padding-left: 10px;}
}

.frm_pro_form input, .frm_pro_form textarea {
	box-shadow: none!important;
	border: 1px solid #cccccc!important;
	color: #2f2f2f!important;
	text-transform: uppercase;
	font-weight: bold!important;
	font-size: 14px!important;
	min-height: 48px;
	border-radius: 25px!important;
	padding-left: 25px!important;
}

input::placeholder, textarea::placeholder {
	color: #cccccc!important;
}

.frm_pro_form textarea {
	padding-top: 15px!important;
}

.frm_pro_form input[type="tel"] { width: 100%!important;}

.frm_pro_form button {
	display: block;
	width: 100%!important;
	color: #fff!important;
	font-weight: bold!important;
	text-transform: uppercase!important;
}

.frm_pro_form button:hover {
	color: #64c293!important;
}

/* -------------------------------------------------------------------------------------------------------- Footer */

.footer {
	margin: 0!important;
	background: #2f2f2f;
	padding-top: 50px;
}

/* Footer Two */

#menu-footer-links.menu li {
	display: block;
}

#menu-footer-links.menu .active > a, #menu-footer-links.menu>li>a {
	width: 100%;
	border: none!important;
	font-size: 14px!important;
	line-height: 24px!important;
	padding: 0!important;
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
}

#menu-footer-links.menu>li>a:after {
	content: '>';
	display: inline-block;
	margin-left: 10px;
}

#menu-footer-links.menu>li>a:hover:after {
	margin-left: 20px;
}

/* Footer Three */

.footer-three p, .footer-three p a {
	color: #fff;
	margin: 0;
	font-size: 14px;
	line-height: 24px;
	font-weight: bold;
	text-transform: uppercase;
}

.footer-three p a:hover {
	text-decoration: underline;
}

/* Footer Four */

.copyright {
	font-size: 14px;
	color: #fff;
	text-align: center;
	margin-top: 2rem;
	padding-top: 1rem;
	border-top: 1px solid #fff;
}

/* -------------------------------------------------------------------------------------------------------- Gallery Page Only */

button.mfp-close{
	text-align: right!important;
	background: none!important;
	border: none!important;
	padding-right: 1rem!important;
}

/* -------------------------------------------------------------------------------------------------------- Media Queries */

@media screen and (max-width: 1025px) {
	.navi { display: none;}
	/* Header */
	body.home .head { top: 0px; position: relative; background: #2f2f2f;}
	.head .header-inner a.email, .head .header-inner a.tel{ padding: 20px 0;}
	/* Banner */
	.hero-inner{ padding: 0;}
	h3.top_title, h3.tagline { line-height: 1;}
	h3.tagline:before, h3.tagline:after { line-height: 0;}
	/* About Us Section */
	.about-us.container .columns { padding: 40px .9375rem 40px 50px;}
	.about-us.second-about-us.container .columns { padding: 40px 50px 40px .9375rem;}
	/* What We Do Section */
	.what-we-do.container { padding: 55px 0;}
	.nav-block { text-align: center;}
	.what-we-do.container .nav-block h3 { font-size: 26px;}
	.what-we-do.container .nav-block.large h1 span:last-of-type { display: block;}
	/* Above Footer */
	.above-footer { text-align: center;}
	.contact-details { padding-bottom: 2rem;}
	/* Footer */
	.footer{ text-align: center; padding-top: 20px;}
	.footer-one img{ display: block; margin: 0 auto;}
}

@media screen and (max-width: 800px) {
	/* About Us Section */
	.about-us.container .columns {
		padding: 40px 0.9375rem!important;
		width: 100%!important;
		left: auto!important;
		right: auto!important;
		text-align: center;
	}
	h2.about-us-title { max-width: 100%; text-align: center;}
}

@media screen and (max-width: 640px) {
	.hero-overlay, .head .header-inner a.tel:before, .head .header-inner a.email:before { display: none;}
	/* Header */
	.head .header-inner a.tel { padding: 20px 0 0;}
	.head .header-inner a.email { padding: 0 0 20px;}
	/* Main Content */
	#content #inner-content { padding: 40px 0!important;}
	h1.page-title, #content #inner-content .entry-content { text-align: center;}
	.sidebar-images img{ display: block; margin: 1rem auto 0;}
}

/*----------------------------------------------------- Gallery
*/

.gallery-container {
    margin: 50px 0;

}

	/* fluid 5 columns */
	.grid-sizer,
	.grid-item { width: 100%; margin: 0 0 15px 0; }


@media only screen and (min-width: 64.063em) {
	/* fluid 5 columns */
	.grid-sizer,
	.grid-item { width: 20.5%; margin: 0  2px 15px 2px; }
} /* min-width 1025px, large screens */