/*
Theme Name: Tree Doctor
Template: astra
Author: Luke Balbirnie
Version: 1.0.0.1654561452
Updated: 2022-06-07 00:24:12

*/


/* ----- Colors ----- */
:root {
	
	/* Contact form BG + title text */
	--title-dark-green:#0f4b39;
	
	/* Footer BG + Body Text*/
	--body-dark-green:#003a2d;
	
	/* Buttons */
	--interactive-green:#177b4a;
	
	/* Social Icons + Underline */
	--highlight-green:#4ba452;
	
	/* Testimonials background */
	--pale-green:#eef7eb;
}

.white {
	color:white;
}

/* ----- General ----- */

* {
	-webkit-tap-highlight-color:rgba(75, 164, 82, 0.2)
}
html #wpadminbar {
	display:none !important;
}

html {
	margin-top:0 !important;
}

html, body {
  scroll-behavior: smooth;
 	scroll-snap-type: y; 
}

#page {
	max-width:100%;
	overflow-x:hidden;
}

.ast-separate-container {
	background-color:white !important;
}

/* ----- Fonts ----- */

/* Page Titles */
h1 {
	font-family: 'Montserrat', sans-serif; 
	font-size:36px;
	font-weight:700;
	line-height:1.2;
	margin-bottom:20px;
	color:var(--title-dark-green);
}

/* Section titles */
h2 {
	font-family: 'Montserrat', sans-serif; 
	font-size:34px;
	font-weight:700;
	line-height:1.4;
	margin-bottom:20px;
	color:var(--title-dark-green);
}

.h2-small {
    font-size:32px;
}

/* Post Grid Titles */
h3 {
	font-family: 'Montserrat', sans-serif; 
	font-size:20px;
	font-weight:700;
	line-height:1.4;
	margin-bottom:10px;
	color:var(--title-dark-green);
}

/* Body Text */
p {
	font-family: 'Montserrat', sans-serif; 
	font-size:15px;
	font-weight:500;
	line-height:2;
	margin-bottom:15px;
	color:var(--body-dark-green);
}

a {
	font-family: 'Montserrat', sans-serif; 
	transition: all .5s ease;
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	h1 {
		font-size:36px;
	}
	h2 {
		font-size:32px;
	}
}

@media(max-width:768px) {
	
}

@media(max-width:767px) {
	h1 {
		font-size:28px;
	}
    
	h2 {
		font-size:24px;
		margin-bottom:15px;
	}
    
    .h2-small {
        font-size:22px;
    }
    
    h3 {
        font-size:20px;
    }
}



/* Text Effects */
.no-margin {
	margin-bottom:0 !important;
	margin-top:0 !important;
}

.text-left {
	text-align:left;
}

.text-right {
	text-align:right;
}

.text-center {
	text-align:center;
}

.subheading {
	width:1000px;
    max-width:100%;
    font-size:17px;
}

.text-left .subheading {
	float:left;
	margin-right:auto;
}

.text-center .subheading {
	float:none;
	margin-left:auto;
	margin-right:auto;
}

.underline {
	position:relative;
    padding-bottom:9px;
}

.underline::after {
	content: '';
	display:inline-block;
	width:100%;
	position:absolute;
	left:0;
	bottom:0;
	height:2px;
	background-color:var(--highlight-green);
}

@media(max-width:767px) {
    .subheading {
        font-size:16px;
    }
}



/* ----- Containers ----- */

.ast-container {
	padding:0 !important;
	margin:0 !important;
	max-width:100% !important;
	display:inline-block !important;
	width:100%;
}
.container-outer {
	display:inline-block;
	float:left;
	position:relative;
	text-align:center;
	width:100%;
}
.container-inner {
	display:inline-block;
	width:90%; 
	max-width:1300px;
	float:none;
	margin-left:auto;
	margin-right:auto;
}

.margin-regular {
    margin:110px auto;
}

.margin-top-regular {
    margin-top:110px;
}

.margin-bottom-regular {
    margin-bottom:110px;
}

.margin-small {
    margin:85px auto;
}

.margin-top-small {
    margin-top:85px;
}

.margin-bottom-small {
    margin-bottom:85px;
}

.margin-tiny {
    margin:60px auto;
}

.margin-top-tiny {
    margin-top:60px;
}

.margin-bottom-tiny {
    margin-bottom:60px;
}

@media(max-width:1024px) {
    .margin-regular {
        margin:100px auto;
    }

    .margin-small {
        margin:85px auto;
    }

    .margin-top-regular {
        margin-top:100px;
    }

    .margin-top-small {
        margin-top:85px;
    }

    .margin-top-tiny {
        margin-top:35px;
    }

    .margin-bottom-regular {
        margin-bottom:100px;
    }

    .margin-bottom-small {
        margin-bottom:85px;
    }

    .margin-bottom-tiny {
        margin-bottom:35px;
    }
}

@media(max-width:1024px) and (orientation:portrait) {
    .margin-regular {
        margin:75px auto;
    }

    .margin-small {
        margin:75px auto;
    }

    .margin-top-regular {
        margin-top:75px;
    }

    .margin-top-small {
        margin-top:75px;
    }

    .margin-top-tiny {
        margin-top:50px;
    }

    .margin-bottom-regular {
        margin-bottom:75px;
    }

    .margin-bottom-small {
        margin-bottom:75px;
    }

    .margin-bottom-tiny {
        margin-bottom:50px;
    }
    
}

@media(max-width:767px) {
    .margin-regular {
        margin:60px 0;
    }

    .margin-small {
        margin:50px 0;
    }

    .margin-top-regular {
        margin-top:60px;
    }

    .margin-top-small {
        margin-top:50px;
    }

    .margin-top-tiny {
        margin-top:35px;
    }

    .margin-bottom-regular {
        margin-bottom:60px;
    }

    .margin-bottom-small {
        margin-bottom:50px;
    }

    .margin-bottom-tiny {
        margin-bottom:35px;
    }
}


/* ----- Columns ----- */

.col {
	display:inline-block;
	float:left;
}

.col-1-3 {
	width:calc(33.333% - 23.333px);
	margin-right:35px;
}
.col-2-3 {
	width:calc(66.666% - 50px);
	margin-right:35px;
}
.col-1-2 {
	width:calc(50% - 50px);
	margin-right:100px;
}

.col:last-child {
	margin-right:0;
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.col-1-2 {
		width:calc(50% - 30px);
		margin-right:60px;
	}
}

@media(max-width:768px) {
	.col-1-3 {
		width:100%;
		margin-right:0;
		margin-bottom:50px;
	}
	.col-2-3 {
		width:100%;
		margin-right:0;
		margin-bottom:50px;
	}
	.col-1-2 {
		width:100%;
		margin-right:0;
		margin-bottom:50px;
	}

	.col:last-child {
		margin-right:0;
		margin-bottom:0;
	}
	
}


/* ----- Banners ----- */

.page-banner {
	background-color:var(--pale-green);
}

.page-banner .container-inner {
	margin-top:0px;
	margin-bottom:100px;
	display:inline-flex;
	align-items:stretch;
	justify-content:space-between;
}

.banner-image img {
	width:100%;
	height:100%;
	object-fit:cover;
}

.single .banner-image img {
    min-height:100%;
    height:500px;
}

.banner-text {
	padding:50px 0;
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.banner-text {
		padding:35px 0;
	}
	
	.single .banner-image {
		width:calc(42.5% - 25px)
	}
    
    .single .banner-image img {
        max-height:500px;
    }
	
	.single .banner-text {
		width:calc(57.5% - 25px);
	}
	
}

@media(max-width:768px) {
	.banner-image img {
		max-height:400px;
	}
    
    .single .banner-image img {
        max-height:400px;
    }
	
	.banner-text {
		padding:0 !important;
	}
	.page-banner .container-inner {
		margin-bottom:50px;
		display:inline-block;
	}
}
	
@media(max-width:767px) {
	
	.banner-image {
		margin-bottom:40px;
	}
	
	.banner-image img {
		height:70vw;
	}
    
    .single .banner-image img {
        height:70vw;
    }
	
	.banner-text {
		padding:0 !important;
	}
}



/* ----- Buttons ----- */

.button {
	font-family: 'Montserrat', sans-serif; 
	font-size:16px;
	font-weight:700;
	line-height:16px;
	color:white;
	background-color:var(--interactive-green);
	display:inline-flex;
	align-items:center;
	justify-content:flex-start;
	padding:15px 25px;
	cursor:pointer;
	transition: all .5s ease;
	margin-top:10px;
}

.button:hover {
	background-color:var(--highlight-green);
}

.button-arrow {
	display:inline-block;
	float:left;
	height:auto;
	width:22px;
	margin-left:10px;
}

@media(max-width:767px) {
    .button {
        font-size:15px;
        padding:15px 20px;
    }
    .button-arrow {
        width:18px;
    }
}



/* ----- Header Menu ----- */

.header-menu {
	background-color:var(--pale-green);
	position:relative;
	z-index:4;
}

.header-menu .container-inner {
	display:inline-flex;
	justify-content:space-between;
	align-items:center;
	margin-top:50px;
	margin-bottom:85px;
}

.header-logo {
	display:inline-block;
	float:left;
	margin-right:80px;
}

.header-logo img {
	display:inline-block;
	float:left;
	width:280px;
	height:auto;
}

.desktop-header-nav {
	display:inline-block;
	float:left;
	width:auto;
	margin-top:2px;
}

.desktop-header-nav a {
	font-family: 'Montserrat', sans-serif; 
	font-size:16px;
	font-weight:700;
	line-height:16px;
	color:var(--title-dark-green);
	margin-right:40px;
	padding-top:1px;
	cursor:pointer;
	transition: all .5s ease;
}

.desktop-header-nav a:hover {
	color:var(--highlight-green);
}

.desktop-header-nav a:last-child {
	margin-right:0;
}

.desktop-header-cta {
	display:inline-block;
	width:auto;
	margin-top:2px;
}

.desktop-header-cta .underline {
	font-family: 'Montserrat', sans-serif; 
	font-size:16px;
	font-weight:700;
	line-height:16px;
	color:var(--title-dark-green);
	margin-right:40px;
	padding-top:1px;
	cursor:pointer;
	transition: all .5s ease;
}

.desktop-header-cta .underline:hover {
	color:var(--highlight-green);
}

.mobile-menu,
.menu-open {
	display:none;
}

@media(max-width:1260px) {
	.desktop-header-cta,
	.desktop-header-nav {
		display:none;
	}
	
	.menu-open {
		display:inline-block;
		width:36px;
		height:auto;
		cursor:pointer;
	}
	
	.menu-close {
		position:absolute;
		top:50px;
		right:50px;
		display:inline-block;
		width:24px;
		height:auto;
		cursor:pointer;
	}
	
	.mobile-menu {
		display:inline-flex;
		flex-direction:column;
		justify-content:space-between;
		padding:100px 75px;
		width:450px;
		max-width:100%;
		position:fixed;
		top:0;
		right:-450px;
		background-color:var(--title-dark-green);
		transition:all .5s ease;
		height: 100vh;  
		max-height: -webkit-fill-available;
	}
	
	.mobile-menu.active {
		right:0;
	}
	
	.mobile-menu a {
		font-family: 'Montserrat', sans-serif; 
		font-size:18px;
		font-weight:700;
		line-height:18px;
		color:white;
		width:auto;
		float:left;
		clear:both;
		margin-bottom:40px;
		cursor:pointer;
		display:inline-block;
	}
	.mobile-menu underline {
		margin-bottom:50px;
	}
	.mobile-menu .button {
		margin-bottom:0;
	}
	
}

@media(max-width:768px) {
	.lock-scroll {
		overflow-y:hidden;
	}
	.header-menu .container-inner {
		margin-bottom:60px;
	}
}

@media(max-width:767px) {
	
	.menu-open {
		width:32px;
	}
	
	.menu-close {
		top:30px;
		right:25px;
		width:21px;
	}
	
	.mobile-menu {
		padding:60px 50px;
	}
	
	.header-menu .container-inner {
		margin-top:25px;
		margin-bottom:50px;
	}
}




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

.footer {
	background-color:var(--body-dark-green);
	padding-top:60px;
}

.footer h2 {
	color:white;
	font-size:20px;
	margin-bottom:25px;
}

.footer p {
	color:white;
	font-size:14px;
	font-weight:400;
}

.footer-nav {
	column-count:2;
	margin-top:6px;
	display:inline-block;
	width:100%;
}

.footer-nav a:hover {
	color:var(--highlight-green);
}

.footer .underline {
	font-family: 'Montserrat', sans-serif; 
	font-size:14px;
	font-weight:700;
	line-height:16px;
	color:white;
	width:auto;
	float:left;
	clear:both;
	margin-bottom:28px;
	cursor:pointer;
	display:inline-block;
    padding-bottom:9px;
}

.contact-info {
	display:inline-flex;
	width:100%;
	align-items:flex-start;
	justify-content:space-between;
	margin-bottom:20px;
	margin-top:3px;
}

.contact .subheading.white {
    margin-bottom:20px;
}

.contact-info img {
	height:14px;
	width:auto;
	display:inline-block;
	float:left;
	margin-top:4px;
}

.contact-info p {
	width:calc(100% - 30px);
	font-size:14px;
	font-weight:600;
	line-height:1.6;
	color:white;
}

.contact-info p a {
	color:white;
	font-size:14px;
	font-weight:600;
	line-height:1.3;
}

.contact-info p a:hover {
	color:var(--highlight-green);
}

.footer-about {
	margin-bottom:20px;
}

.social-icons a {
	display:inline-block;
	float:left;
	width:auto;
	margin-right:25px;
}

.social-icons img {
	width:auto;
	height:18px;
	display:inline-block;
}


.bottom-footer {
	background-color:var(--body-dark-green);
}

.bottom-footer.container-inner {
	margin:0 0 35px 0;
}

.copyright {
	color:white;
	font-size:14px;
}

.policies,
.policies a,
.policies span {
	font-family: 'Montserrat', sans-serif; 
	font-size:14px;
	font-weight:500;
	line-height:14px;
	color:white;
}

.policies a:hover {
	color:var(--highlight-green);
}

.policies span {
	color:var(--highlight-green);
	margin:0 5px;
}





@media(max-width:1024px) {
	
	.footer .container-inner {
		margin-bottom:75px;
	}
	
	.footer .col:first-child {
		width:100%;
		margin-right:0;
		margin-bottom:50px;
	}
	
	.footer .col:nth-child(2) {
		width:calc(50% - 17.5px);
		margin-right:35px;
		margin-bottom:50px;
	}
	
	.footer .col:last-child {
		width:calc(50% - 17.5px);
		margin-right:0;
		margin-bottom:0;
	}
	
	.footer-nav {
		column-count:4;
	}
	
	.bottom-footer .col.col-1-2 {
		width:calc(50% - 50px)
	}
	.bottom-footer .col.col-1-2:first-child {
		margin-right:100px;
		margin-bottom:0;
	}
}

@media(max-width:768px) {
	.footer .col:nth-child(2) {
		margin-bottom:0;
	}
}

@media(max-width:767px) {
	
	.footer .container-inner {
		margin-bottom:25px;
	}
	
	.footer .bottom-footer {
		margin-bottom:0;
	}
	
	
	.footer .col:nth-child(n) {
		width:100%;
		margin-right:0;
		margin-bottom:40px;
	}
	
	.footer-nav {
		column-count:2;
	}
	
	.bottom-footer .col {
		width:100%;
		margin-right:0;
	}
	
	.bottom-footer .col.col-1-2:first-child {
		margin-bottom:20px;
	}
	
	.bottom-footer .col:last-child {
		text-align:left;
	}
	
}




/* ----- Service Grid ----- */

.service-grid {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    column-gap: 50px;
    margin-top:15px;
}

.service {
	margin-top:45px;
	display:inline-block;
	width:100%;
	float:left;
}
.service:last-child {
	margin-bottom:0;
}

.service h3 {
	font-size:20px;
}

.service-icon {
	width:auto;
	height:40px;
	display:inline-block;
	float:left;
	clear:both;
	margin-bottom:20px;
}

@media (max-width:1180px) and (orientation:landscape) {

    .service-grid {
        grid-template-columns: 1fr 1fr;
    }
    
	.services .service {
		margin-top:35px;
	}
	
}

@media (max-width:1180px) and (orientation:portrait) {
    
    .service-grid {
        grid-template-columns: 1fr 1fr;
    }
	
	.services .service {
		margin-top:35px;
	}
	
}

@media(max-width:767px) {
	.services .container-inner {
		text-align:left;
	}

     .service-grid {
        grid-template-columns: 1fr;
    }
	
	.service h3 {
		font-size:18px;
	}
    
    .services .service {
		margin-top:35px;
	}
	
}




/* ----- Testimonials ----- */

.testimonials {
	background-color:white;
}

.testimonials .container-inner {
	height:750px;
	overflow:hidden;
	position:relative;
	width: calc(90% + 40px);
	max-width:1340px;
}

.testimonials.view-all .container-inner {
	height:auto;
}

.testimonials .subheading {
	margin-bottom:0;
}

.testimonials-container {
	width: 100%;
	display: inline-block;
	padding:0 20px 100px 20px;
	column-count:3;
	column-gap:35px;
	position:relative;
	height:auto;
}

.testimonial-box {
	width:100%;
	background-color: #fff;
	border-radius: 5px;
	padding: 35px;
	box-shadow: 0px 0px 10px rgb(15 75 57 / 10%);
	text-align: left;
	margin-top: 35px;
	break-inside: avoid;
	float: left;
	will-change: transform;
	display: grid;
	grid-template-rows: 1fr auto;
	break-inside: avoid;
}

.testimonial-content {
	margin-bottom:15px;
}

.testimonial-author {
	color:var(--title-dark-green);
	font-weight:700;
	line-height:1.5;
}

.testimonial-location {
	color:var(--highlight-green);
	font-weight:600;
	line-height:1.5;
}

.testimonials-gradient {
	display: inline-block;
	width: calc(100% + 50px);
	margin-left: -25px;
	background: linear-gradient(0deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
	height: 300px;
	z-index: 2;
	position:absolute;
	bottom:0;
	margin-top:0;
	left:0;
}

.view-all-testimonials {
	z-index: 3;
	width: 100%;
	float: left;
	position:absolute;
	bottom:75px;
}

.view-all .testimonials-gradient,
.view-all .view-all-testimonials {
	display: none;
}

.view-all .testimonials-container {
	height: auto !important;
	overflow-y: visible;
}

/* ---------- Mobile & Tablet Query ---------- */
@media (max-width:768px) {
	
	.testimonials .container-inner {
		width: calc(90% + 40px)
	}

	.testimonials .testimonials-container {
		width:100%;
		margin-left:0;
		padding-bottom:75px;
		column-count:2;
	}

	.testimonials .col-1-3 {
		width:100%;
		margin-right:0;
		margin-bottom:0;
	}

}

/* ---------- Mobile Query ---------- */
@media (max-width:767px) {

	.testimonials .testimonials-container {
		width:100%;
		margin-left:0;
		padding-bottom:50px;
		column-count:1;
	}
	
	.testimonials .container-inner {
		height:1000px;
	}
	
	.testimonials .subheading {
		padding: 0 5vw;
	}

	.testimonial-box:nth-child(n) {
		padding: 25px;
		margin-top:25px;
	}
	
	.testimonial-box:first-child {
		margin-top:35px;
	}
}






/* ----- Post Grid ----- */

.post-grid {
	display:inline-block;
	width:100%;
}
.post-card {
	width:calc(33.333% - 23.333px);
	margin-right:35px;
	display:inline-block;
	float:left;
	box-shadow: 0px 0px 10px rgb(15 75 57 / 20%);
	border-radius: 5px;
	background-color:white;
	overflow:hidden;
}

.post-card:nth-child(3n) {
	margin-right:0;
}

.post-card:nth-child(3n+1) {
    clear:both;
}

.post-card:nth-child(n+4) {
	display:none;
}


.post-card .thumbnail {
	height:270px;
	object-fit:cover;
	width:100%;
	max-width:100%;
}
.post-card .thumbnail.placeholder {
    background-color:var(--pale-green);
}

.post-card p {
	margin-bottom:10px;
}
.post-card .underline {
	font-size:16px;
	font-weight:700;
	color:var(--title-dark-green);
	cursor:pointer;
}
.post-card .underline:hover {
	color:var(--interactive-green);
}
.post-card .info {
	padding: 35px;
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.post-card .thumbnail {
		height:220px;
	}
	
	.post-card .info {
		padding: 25px;
	}

}

@media(min-width:768px) and (max-width:1180px) and (orientation:portrait) {
    .post-card:nth-child(n) {
        clear:none;
    }
    .post-card:nth-child(2n+1) {
        clear:both;
    }
}

@media(max-width:767px) {
    .post-card:nth-child(n) {
        clear:none;
    }
}









/* ----- Common Issues ----- */

.common-issues .title-section {
	display:inline-flex;
	width:100%;
	margin-bottom:50px;
	align-items:flex-end;
	justify-content:space-between;
}

.nav-button-square {
	width:50px;
	height:auto;
	cursor:pointer;
	display:inline-block;
	float:left;
}

.nav-left {
	transform: rotate(180deg);
}

.nav-right {
	margin-left:15px;
}

.grid-nav {
    min-width:115px;
}

@media(max-width:768px) {
	.common-issues .title-section {
		display:inline-flex;
		width:100%;
		margin-bottom:20px;
	}
	.common-issues .grid-nav {
		display:none;
	}
	.common-issues .post-card:first-child {
		margin-left:5vw;
	}
	.common-issues .post-card:last-child {
		margin-right:5vw;
	}
	.common-issues .post-card:nth-child(n) {
		display:inline-block;
        vertical-align:top;
	}
	.common-issues .post-card {
		width:340px;
		white-space:normal;
		float:none;
		margin-right:5vw;
	}
	.post-card .info {
		padding: 25px;
	}
	.common-issues .post-grid {
		width: 100vw;
		margin-left:-5vw;
		display: inline-block;
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: none;
		float: left;
		padding-bottom:25px;
		padding-top:10px;
	}
	.common-issues .post-grid::-webkit-scrollbar {
		height:0;
		width:0;
		display:none;
	}
}

@media(max-width:767px) {
	.common-issues .post-card {
		width:80vw;
	}
	.post-card .thumbnail {
		height:230px;
	}
}






/* ----- Areas Served ----- */

.areas-served .container-inner {
	display:inline-flex;
	align-items:center;
}
.areas-served .underline {
	font-size:16px;
	font-weight:700;
	color:var(--title-dark-green);
	cursor:pointer;
}
.areas-served .underline:hover {
	color:var(--interactive-green);
}

.areas-served .locations-grid {
	display:inline-block;
	width:100%;
	column-count:3;
	margin:5px 0 10px 0;
}

.areas-served .locations-grid .location {
	font-size:16px;
	font-weight:700;
	color:var(--title-dark-green);
	cursor:pointer;
	display:inline-flex;
	align-items:center;
	margin-top:5px;
	margin-bottom:10px;
	width:100%;
}

.areas-served .locations-grid .location:hover {
	color:var(--interactive-green);
}

.areas-served .locations-grid .location img {
    height: 16px;
    width: auto;
    display: inline-block;
    float: left;
	margin-right:10px;
}

.areas-served-map {
	background-image:url(/assets/areas-served-map.jpg);
	background-size:cover;
	background-position: 50% 50%;
	height:500px;
}

@media(max-width:768px) {
	.areas-served .container-inner {
		display:inline-block;
	}
}

@media(max-width:767px) {
	.areas-served .locations-grid {
		column-count:2;
	}
	
	.areas-served-map {
		height:300px;
	}
}




/* Contact Section */
.contact {
	background-color:var(--title-dark-green);
}

.contact h2 {
	width:auto;
	display:inline-block;
	clear:both;
	float:left;
	margin-bottom:30px;
    font-size:32px;
}

.contact .subheading {
	display:inline-block;
	clear:both;
	float:left;
}

.contact .container-inner {
	display:inline-flex;
	align-items:center;
}

.contact .social-icons {
	margin-top:10px;
}

.contact-form {
	width:100%;
	background-color:white;
	border-radius:5px;
	padding:40px;
	display:inline-block;
}

.contact span {
	color: var(--highlight-green);
	margin: 0 5px;
}

.contact .contact-info p,
.contact .contact-info p a {
	font-size:15px;
}

.contact .contact-info img {
	height:16px
}

@media(max-width:1180px) {
    .contact h2 {
        font-size:26px;
    }
}

@media(max-width:767px) {
    .contact h2 {
        font-size:22px;
    }
}


/* Contact Form */

.contact .field.half-width {
	display:inline-block;
	float:left;
	width:calc(50% - 15px);
}
.contact .field.half-width.first {
	margin-right:30px;
}

.contact label {
	font-family: 'Montserrat', sans-serif; 
	font-size:14px;
	font-weight:600;
	color:var(--body-dark-green);
	margin-bottom:5px;
}

.contact .wpcf7-form-control-wrap {
	margin:0;
}

.contact input[type=text],
.contact input[type=tel],
.contact input[type=email] {
	background-color:white;
	font-family: 'Montserrat', sans-serif; 
	font-size:15px;
	font-weight:400;
	color:var(--body-dark-green);
	border:1.5px solid #E6E6E6;
	border-radius:5px;
}

.contact textarea {
	background-color:white;
	font-family: 'Montserrat', sans-serif; 
	font-size:15px;
	font-weight:400;
	color:var(--body-dark-green);
	border:1.5px solid #E6E6E6;
	border-radius:5px;
	height:120px;
	min-height:120px;
	max-height:250px;
	min-width:100%;
	max-width:100%;
	margin-top:3px;
}

.contact input[type=submit] {
	background-color:var(--interactive-green);
	font-family: 'Montserrat', sans-serif; 
	font-size:15px;
	font-weight:700;
	color:white;
	transition: all .5s ease;
}

.contact input[type=submit]:hover {
	background-color:var(--highlight-green);
}

.contact form > p {
	display:inline-flex;
	align-items:center;
}

.contact .wpcf7-not-valid-tip {
	margin:5px 0 0 0;
	font-family: 'Montserrat', sans-serif; 
	font-size:13px;
	font-weight:600;
	line-height:1.4;
}

.contact .wpcf7 form .wpcf7-response-output {
	margin:20px 0 0 0;
	padding:20px;
	border:none;
	background-color:var(--body-dark-green);
	border-radius:5px;
	color:white;
	float:left;
	width:100%;
	line-height:1.5;
	font-family: 'Montserrat', sans-serif; 
	font-size:15px;
	font-weight:500;
}

@media(max-width:768px) {
	.contact .container-inner {
		display:inline-block;
	}
	.contact .col {
		width:100%;
		margin-right:0;
		margin-bottom:75px;
	}
	.contact .col:last-child {
		margin-bottom:0;
	}
	.contact br {
		display:none;
	}
}

@media(max-width:767px) {
	.contact-form {
		padding:25px;
	}
	
	.contact .col {
		margin-bottom:50px;
	}
	
	.contact .field.half-width {
		width:100%;
	}
	
	.contact .field.half-width.first {
		margin-right:0;
	}
}








/* CTA Section */
.cta {
	background-color:var(--title-dark-green);
}

.cta .container-inner {
	margin:100px 0;
}

.cta .col:first-child {
    width:calc(50% - 30px);
    margin-right:60px;
}

.cta .col:last-child {
    width:calc(50% - 30px);
}

.cta .mobile {
	display:none;
}

.cta h2 {
	font-size:28px;
	color:white;
}
.cta p,
.cta-fixed h2,
.cta-fixed p {
	color:white;
}


.cta-fixed {
	background-color:var(--title-dark-green);
	position:fixed;
	top:0;
	left:0;
	opacity:0;
	pointer-events:none;
	z-index:5;
	transition:opacity 0.3s ease;
}

.cta-fixed.active {
	opacity:1;
	pointer-events:all;
}

.cta-fixed .container-inner {
	margin:20px 0;
	display:inline-flex;
	justify-content:space-between;
	align-items:center;
}

.cta-fixed h2 {
	font-size:24px;
	margin-bottom:0;
}

.cta-fixed .button {
    min-width:320px;
    margin-left:35px;
}

.cta.active p {
	display:none;
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.cta .container-inner {
		margin:75px 0;
	}
	
	.cta h2 {
		font-size:26px;
	}
	
	.cta-fixed h2 {
		font-size:20px;
	}
}

@media(max-width:768px) {
    
    .cta .container-inner {
		margin:75px 0;
	}
    
    .cta .col:first-child {
        width:100%;
        margin-right:0;
    }
	
	.cta-fixed h2 {
		font-size:19px;
	}
	
	.cta-fixed .button {
		min-width:290px;
		margin-left:35px;
        font-size:15px;
        padding:15px;
	}
	
	.cta .desktop {
		display:none;
	}
	
	.cta .mobile {
		display:inline-block;
	}
	
	.cta-text {
		margin-bottom:25px;
	}
	
	.cta .col {
		margin-bottom:0;
	}
}

@media(max-width:767px) {
	.cta .container-inner {
		margin:60px 0;
	}
	
	.cta h2 {
		font-size:21px;
	}
	
	.cta-fixed .container-inner {
		display:inline-block;
	}
	
	.cta-fixed h2 {
		font-size:18px;
	}
	
	.cta-fixed .button {
		min-width:0;
		margin-left:0;
		margin-top:10px !important;
        font-size:15px;
        padding:15px;
	}

}




/* Treatments section */

.treatments .container-inner {
	background-color:var(--pale-green);
	border-radius:5px;
	padding:100px;
}
.treatments-grid {
	width:100%;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto;
	column-gap: 25px;
	margin-top:25px;
}

.treatment {
	margin-top:25px;
	padding:35px;
	background-color:white;
	box-shadow: 0px 0px 10px rgb(15 75 57 / 10%);
	text-align:left;
	border-radius:5px;
}

.treatment .underline {
	width:auto;
	clear:both;
	display:inline;
	line-height:24px;
}

.treatment p {
    margin-top:20px;
    margin-bottom:0 !important
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.treatments .container-inner {
		padding:100px 50px;
        margin-top:100px;
	}
	
	.treatment {
		padding:30px;
	}
}

@media(max-width:768px) {
	
	.treatments .container-inner {
		width:100%;
		margin-bottom:0;
		padding:75px 5%;
	}
}

@media(max-width:767px) {
	.treatments-grid {
		grid-template-columns: 1fr;
        margin-top:15px;
	}
    
    .treatment {
        padding:25px;
    }

}


/* About section */

.about-image {
	background-color:var(--pale-green);
	height:560px;
}

.about .container-inner {
	display:inline-flex;
    align-items:center;
}

@media(max-width:768px) {
	.about .container-inner {
		display:inline-block;
	}
	.about-image {
		height:450px;
	}
}

@media(max-width:767px) {
	.about-image {
		height:90vw;
	}
}



/* ---------- Projects Section ---------- */
	
.our-projects .container-inner {
	display:inline-flex;
	align-items:center;
	justify-content:space-between;
}

@media(max-width:768px){

	.our-projects .container-inner {
		flex-direction:column;
	}

	.our-projects .col-1-3 {
		margin-bottom:25px;
		margin-top:0;
	}

}


/* ---------- Types of Plants Carousel Section ---------- */

.types-of-plants .title-section {
	display:inline-flex;
	justify-content:space-between;
	align-items:flex-end;
	width:100%;
	margin-bottom:50px;
}

.title-section div {
    max-width:100%;
}

.types-of-plants .post-card {
	width:calc(25% - 26.25px)
}

.types-of-plants .post-card .thumbnail {
	height:200px;
}

.types-of-plants .post-card .info {
	padding:25px;
	text-align:left;
}

.types-of-plants .post-card h3 {
	font-size:20px;
}

.types-of-plants .post-grid {
	text-align:left;
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.types-of-plants .post-card h3 {
		font-size:18px;
	}
}


@media(max-width:768px) {
	
	.types-of-plants .title-section {
		margin-bottom:25px;
	}
	
	.types-of-plants .nav-button-square {
		display:none;
	}
	.types-of-plants .post-card:nth-child(n) {
		display:inline-block;
	}

	.types-of-plants .post-card .thumbnail {
		height:170px;
	}
	.types-of-plants .post-card h3 {
		font-size:18px;
	}
	.post-card .info {
		padding: 25px;
	}

}

@media(max-width:767px) {

	.types-of-plants .thumbnail {
		height:130px;
	}
}



/* ---------- Common Symptoms Section ---------- */
	
.common-symptoms-grid {
	width:100%;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	column-gap: 50px;
    margin-top:15px;
}
.symptom {
	margin-top:45px;
}
.symptom .underline {
	width:auto;
	clear:both;
	display:inline;
	line-height:24px;
}

.symptom p {
    margin-top:20px;
    margin-bottom:0 !important
}

@media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
	.common-symptoms-grid {
		grid-template-columns: 1fr 1fr;
	}
}


@media(min-width:768px) and (max-width:1180px) and (orientation:portrait) {
	.common-symptoms-grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media(max-width:767px) {
	.common-symptoms-grid {
		grid-template-columns: 1fr !important;
	}
	.symptom {
		margin-top:35px;
	}
}








/* ---------- Before & After Section ---------- */


.before-after {
        display:inline-flex;
        width:100%;
        height:560px;
        position:relative;
        float:left;
        justify-content:space-between;
        align-items:center;
    }

    
    
    .before-after-label {
        font-family:'Montserrat', sans-serif;
        font-weight:700;
        position:absolute;
        padding:10px 15px;
        line-height:16px;
        background-color:white;
        font-size:15px;
        color:var(--body-dark-green);
        border-radius:2px;
        top:20px;
    }
    
    .before.before-after-label {
        left:20px;
        z-index:4;
    }
    
    .after.before-after-label {
        right:20px;
        z-index:2;
    }

    
    .before-after-info {
        display:inline-flex;
        align-items:flex-start;
        justify-content:space-between;
        width:100%;
        margin-top:15px;
    }
    
    .before-after-info h3 {
        margin:0;
    }
    
    .before-after-info p {
        margin-bottom:0;
    }
    
    
    .before-image {
        display:inline-block;
        height:560px;
        width:calc(50% - 3px);
    }
    
    .after-image {
        display:inline-block;
        height:560px;
        width:calc(50% - 3px);
        z-index:1;
    }
    
    .before-after-image {
        height:560px;
        width:100%;
        object-fit:cover;
    }
    
    @media(min-width:768px) and (max-width:1180px) and (orientation:landscape) {
        .before-after,
        .before-image,
        .after-image,
        .before-after-image {
            height:460px;
        }
    }
 
    @media(max-width:767px) {
        .before-after {
            height:280px;
        }

        .before-after-image {
            width:100%;
            height:280px;
        }
        
        .before-after-label {
            padding:5px 9px;
            line-height:15px;
            font-size:12px;
            top:10px;
        }

        .before.before-after-label {
            left:10px;
        }

        .after.before-after-label {
            right:10px;
        }
        
        .before-image {
            height:280px;
            width:calc(50% + -2px);
        }
        
        .after-image {
            height:280px;
            width:calc(50% + -2px);
        }

        
        .before-after-info h3 {
            font-size:16px;
        }
        
        .before-after-info p {
            font-size:13px;
            line-height:23px;
        }

        
    }

