/*
Theme Name:   treehouse
Description:  Official theme for treehouse
Author:       hiremycode
Author URL:   https://www.hiremycode.com
Template:     technico
Version:      0.0000313
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  treehouse
*/



:root {	
	--dark-color: #333333;
	--grey-color: #888888;
}

/******************* GENERAL */
html, body {overflow-x: hidden !important}
body, .entry-content {font-family: "Geologica", sans-serif !important; font-size: 16px !important; font-weight: 300 !important; line-height: 22px !important; letter-spacing: 0px; color: var(--grey-color)}
h1,h2,h3,h4,h5,h6 {font-family: "Geologica", sans-serif; font-weight: 700 !important; letter-spacing: 0px; color: var(--dark-color)}
strong {font-weight: 600 !important}

.entry-content p > a {font-weight: 300; border-bottom: 1px solid var(--dark-color) !important;}
.entry-content p > a:hover {border-bottom: 1px solid var(--grey-color)}
.entry-content ul li {margin-bottom: 10px; font-size: 16px}
.entry-content ol li {margin-bottom: 10px; font-size: 16px}

.centered {text-align: center !important}

.svg-image .vc_figure {width: 100%}
.svg-image .vc_single_image-wrapper {width: 100%}

.bottom-section {padding-top: 0px !important}
.top-section {padding-bottom: 0px !important}


.main {padding-top: 180px !important; padding-bottom: 0px !important}
.home .main {padding-top: 0px !important;}


.scroll-image {filter: grayscale(100%); transition: filter 0.6s ease;}
.scroll-image.active {filter: grayscale(0%);}

.lb-details {display: none !important}

select {border: 1px solid var(--grey-color) !important}


/******************* LOGO */
.site-logo {position: relative; top: 3px}


/******************* HEADER */
.header {position: absolute; width: 100%; left: 0px; top: 0px; background: #ffffff; z-index: 800; border-bottom: 1px solid var(--grey-color);}
.home .header {background: transparent;}
.mast-head-wrap {padding: 20px 0px;}

.scrollActive .header {position: fixed; background: #ffffff; }
.scrollActive .mast-head-wrap {padding: 15px 0px;}


/******************* MENU */
.nav {margin-top: 0px !important}
.nav ul {text-align: right}
.nav ul li a {font-family: "Geologica", sans-serif; font-weight: 600 !important; font-size: 15px !important; line-height: 23px !important; color: var(--grey-color) !important; letter-spacing: 0.5px; border: 0px !important; margin-left: 20px !important; margin-right: 20px !important;}

.nav ul li a:hover {color: var(--dark-color) !important;}

.nav ul li.current-menu-item a {color: var(--dark-color) !important}


/*LANGUAGES*/
.lang-switcher {margin-left: 60px; }
.navigation > li.lang-switcher > a {color: var(--dark-color) !important; margin-right: 0px !important}


/********************* BUTTONS ***/
.vc_btn3 {background-image: none !important; font-weight: 600; font-size: 15px !important; text-transform: uppercase !important; font-family: "Geologica", sans-serif; letter-spacing: 0.5px; padding: 12px 40px 12px 0px !important; height: auto !important; position: relative}
.vc_btn3:hover {background: transparent !important; color: var(--dark-color) !important}
.vc_btn3:after {content: "\f178" !important; font-family: fontawesome; position: absolute !important; display: block !important; width: 30px; height: 30px; background: transparent; color: var(--dark-color); top: 6px; right: 7px; line-height: 31px; font-size: 18px; transition: all 0.2s ease-in-out !important; transform: rotate(0deg);}
.vc_btn3:hover:after {color: var(--dark-color) !important; background: transparent !important; transition: all 0.2s ease-in-out !important; transform: rotate(-45deg);}




/********************* HERO ***/
.hero {height: 100vh; background-color: var(--grey-color); background-size: cover; background-position: center bottom}
.hero-title {font-size: 160px; color: var(--dark-color) !important; line-height: 180px; letter-spacing: 0px; margin-top: 0px !important}
.hero-bottom {position: absolute !important; bottom: 20px; color: #ffffff; width: 100%;}
.hero-bottom .big-text {color: #ffffff}



/********************* SECTIONS ***/

.section {padding-top: 100px; padding-bottom: 100px;}
.section-title {font-size: 21px !important; line-height: 24px; color: var(--dark-color); letter-spacing: 2px; margin-top: 0px !important; margin-bottom: 30px !important; font-weight: 600 !important}

.big-text {font-size: 21px; line-height: 30px; color: var(--dark-color)}


.divider {height: 600px; position: relative; background-position: center center; background-size: cover !important}
.divider:before {content: "" !important; position: absolute !important; inset: 0; background: inherit; filter: grayscale(100%); transition: filter 0.8s ease; z-index: 0; width: 100%; height: 100%; left: 0px; top: 0px}
.divider.active::before {filter: grayscale(0%);}




/********************* SERVICES ***/

.services-section {counter-reset: service-counter;}

.service-row .vc_column-inner  {padding-top: 25px !important; padding-bottom: 25px !important}

.service-column.left:before  {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 30px; top: 0px}
.service-column.right:before  {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 0px; top: 0px}

.service-title {margin-top: 0px !important; margin-bottom: 5px !important; font-weight: 300 !important; font-size: 36px; line-height: 42px; padding-left: 55px; position: relative}
.services-section .service-title::before {counter-increment: service-counter; content: counter(service-counter, decimal-leading-zero) ". "; color: var(--grey-color); font-size: 24px; position: absolute; left: 0px; top: 3px;}



/********************* CTA ***/

.cta-section {padding-bottom: 0px !important}
.cta-section .vc_btn3-container {position: relative}
.cta-section .vc_btn3-container:before {content: "" !important; position: absolute !important; display: block; width: 100%; height: 1px; background: var(--dark-color); left: 0px; top: 23px }
.cta-section .vc_btn3 {background: #ffffff !important; padding-left: 30px !important}
.cta-title {font-size: 82px; line-height: 96px; text-transform: uppercase; margin-top: 0px !important}




/********************* PROJECTS ***/

.projects-grid .vc_gitem-zone:before {content: "" !important; position: absolute !important; display: block !important; width: 100%; height: 100%; left: 0px; top: 0px; background: linear-gradient(180deg,rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.2) 50%, rgba(0, 0, 0, 0.6) 70%);} 

.projects-grid .vc_gitem-animated-block {filter: grayscale(100%); transition: filter 0.6s ease;}
.projects-grid .vc_gitem-animated-block.active {filter: grayscale(0%);}

.projects-grid .vc_gitem_row {padding: 40px}
.project-hypertitle {color: #ffffff; font-weight: 700; font-size: 22px; letter-spacing: 0.5px; margin-bottom: 15px}
.project-title a {color: #ffffff !important; text-transform: uppercase; font-size: 82px}
.project-excerpt {color: #ffffff !important;  width: 80%; column-count: 2; column-gap: 30px;}


.projects-grid .vc_gitem_row .vc_btn3-container {position: absolute; right: 0px; bottom: -10px; z-index: 10}
.projects-grid .vc_gitem_row .vc_btn3:after {color: #ffffff;}
.projects-grid .vc_gitem_row .vc_btn3:hover {color: #ffffff !important}
.projects-grid .vc_gitem_row .vc_btn3:hover:after {color: #ffffff !important;}

.projects-grid .vc_grid-item {margin-bottom: 30px !important}
.home .projects-grid .vc_grid-item {margin-bottom: 0px !important}




/********************* SINGLE PROJECT ***/

.single-project-title {font-size: 82px; line-height: 96px; text-transform: uppercase; margin-top: -15px !important; margin-bottom: 80px !important}


.project-info-row .vc_column-inner {padding-top: 15px !important; padding-bottom: 15px !important}
.project-info-column.left:before {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 30px; top: 0px}
.project-info-column.right:before {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 0px; top: 0px}

.project-info-column.last.left:after {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 30px; bottom: 0px}
.project-info-column.last.right:after {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 0px; bottom: 0px}



.project-info-head {margin-bottom: 0px !important; color: var(--dark-color); font-size: 22px; letter-spacing: 0.5px}
.project-info-value {text-align: right}

.media-grid .vc_gitem-animated-block {filter: grayscale(100%); transition: filter 0.6s ease;}
.media-grid .vc_gitem-animated-block.active {filter: grayscale(0%);}






/********************* MEMBERS ***/

.member-row {padding-bottom: 50px !important}
.member-row.last {padding-bottom: 100px !important}

.member-column  {position: relative}
.member-column.left:before  {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 30px; top: -10px}
.member-column.right:before  {content: "" !important; display: block !important; position: absolute !important; width: calc(100% - 30px); height: 1px; background: var(--grey-color); left: 0px; top: -10px}

.member-title {margin-top: 0px !important; font-weight: 300 !important; font-size: 32px; line-height: 36px;}
.member-subtitle {font-size: 15px; font-weight: 600; color: var(--grey-color); letter-spacing: 0.5px; margin-bottom: 25px !important}



/********************* BLOG ***/

.blog-section .vc_grid-item {margin-top: 25px !important; border-top: 1px solid var(--grey-color); padding-top: 25px !important}
.blog-section .vc_grid-item:first-child {border-top: 0px !important}
.blog-section .vc_grid-filter {margin-top: 0px; margin-bottom: 0px; text-transform: uppercase; font-weight: 600; letter-spacing: 0.5px; font-size: 15px}
.blog-section .vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item { padding-left: 0px !important; padding-right: 25px !important}
.blog-section .vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item.vc_active, .blog-section .vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item:hover {background: transparent !important;}

.blog-section .vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item.vc_active > span, .blog-section .vc_grid-filter.vc_grid-filter-color-grey > .vc_grid-filter-item:hover > span {color: var(--dark-color) !important}


.blog-section .post-column {padding-left: 40px !important}

.blog-section .wpb_single_image {filter: grayscale(100%); transition: filter 0.6s ease;}
.blog-section .wpb_single_image.active {filter: grayscale(0%);}


.postdate {display: inline-block; position: relative; color: var(--grey-color) !important; background: transparent !important; letter-spacing: 0.5px; font-size: 15px; text-transform: uppercase; margin-bottom: 15px !important; font-weight: 600;margin-right: 8px}

.posttitle h3, h2.posttitle, h1.posttitle {font-weight: 300 !important; font-size: 36px; line-height: 42px; margin-top: 0px !important}
.posttitle a {color: var(--dark-color) !important; font-weight: 300 !important;}

.postcategory:before {position: absolute !important; content: "-" !important; display: block !important; left: 0px; top: 0px; color: var(--grey-color);}
.postcategory {display: inline-block; position: relative; padding-left: 15px !important; color: var(--grey-color) !important; background: transparent !important; letter-spacing: 0.5px; pointer-events: none; font-size: 15px; text-transform: uppercase; margin-bottom: 15px !important; font-weight: 600}
.postcategory a {color: var(--grey-color)}
.postcategory:hover a {color: var(--grey-color)}

.vc_gitem-post-category-name:hover {background: transparent !important; color: var(--grey-color) !important}

.postexcerpt {color: var(--grey-color);}




/********************* SINGLE POST ***/

.backtoblog {position: relative; padding-left: 35px; color: var(--dark-color); font-weight: 600; letter-spacing: 0.5px; display: block; margin-top: 8px}
.backtoblog:hover {color: var(--dark-color);}
.backtoblog:before {content: "\f177" !important; font-family: fontawesome; position: absolute !important; display: block !important; width: 30px; height: 30px; background: transparent; color: var(--dark-color); top: -4px; left: 0px; line-height: 31px; font-size: 18px; transition: all 0.2s ease-in-out !important; transform: rotate(0deg);}

/*.backtoblog:hover:before {color: var(--dark-color) !important; background: transparent !important; transition: all 0.2s ease-in-out !important; transform: rotate(45deg);}*/

.post-meta {margin-bottom: 15px}





/********************* CONTACT ***/
.wpcf7-form {margin-top: 3px}
.wpcf7-form label {color: var(--dark-color); font-weight: 600 !important; text-transform: none; font-size: 15px; letter-spacing: 0.5px; }
.wpcf7-form p {margin-bottom: 25px}

.wpcf7-text {border:0px; border-bottom: 1px solid var(--grey-color); padding: 0px 0px 0px 0px; background: transparent; color: var(--dark-color); margin-top: 5px; height: 50px; font-size: 16px !important;}

.wpcf7-textarea {border:0px; border-bottom: 1px solid var(--grey-color); padding: 15px 0px 0px 0px; background: transparent; color: var(--dark-color); resize: vertical; height: 100px; margin-top: 5px; font-size: 16px !important;}
.wpcf7-text:hover,.wpcf7-text:focus, .wpcf7-textarea:hover, .wpcf7-textarea:focus, .wpcf7-select:hover,.wpcf7-select:focus {border-color: var(--dark-color)}


.submitbtn p {margin-bottom: 0px !important}
.wpcf7-submit {background: transparent !important; letter-spacing: 0.5px !important; font-weight: 600 !important; font-size: 15px !important; text-transform: none !important; padding: 0px !important; height: auto !important; color: var(--dark-color) !important; border: 0px !important; transition: all 0.5s ease !important;}
.wpcf7-submit:hover {background: transparent !important; transition: all 0.5s ease !important}

.wpcf7-list-item {margin-left: 0px !important; margin-top: 10px !important; width: 100%}
.wpcf7-list-item a {color: var(--dark-color) !important}
.wpcf7-list-item label {margin-top: 10px; color: var(--dark-color);}
.wpcf7-list-item-label {margin-left: 5px !important}

.forconsent label {font-size: 16px; font-weight: 300 !important; color: var(--dark-color); display: inline-block; letter-spacing: 0px; width: calc(100% - 40px)}
.forconsent a {color: var(--dark-color) !important; border-bottom: 1px solid var(--dark-color);}
.forconsent a:hover {border-bottom: 1px solid var(--grey-color);}
.forconsent .wpcf7-form-control-wrap {display: inline-block; margin-right: 15px}

.wpcf7-response-output {text-align: center; font-size: 16px !important; font-weight: 400 !important; margin-left: 0px !important; margin-right: 0px !important; padding: 10px !important}
.wpcf7 form.sent .wpcf7-response-output {background: #46b450 !important; border: 1px solid #46b450 !important; color: #ffffff !important; font-weight: 400 !important}
.wpcf7 form.invalid .wpcf7-response-output {background: #dc3232 !important; border: 1px solid #dc3232 !important; color: #ffffff !important; font-weight: 400 !important}

.wpcf7-list-item input[type="checkbox"] {-webkit-appearance: none; appearance: none; background-color: transparent; margin: 0; font: inherit; color: var(--dark-color); width: 18px; height: 18px; border: 1px solid var(--dark-color); transform: translateY(-0.075em); display: inline-grid; place-content: center;}
.wpcf7-list-item input[type="checkbox"]::before {content: ""; width: 0.65em; height: 0.65em; clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); transform: scale(0); transform-origin: bottom left; transition: 120ms transform ease-in-out; background-color: var(--dark-color);}
.wpcf7-list-item input[type="checkbox"]:checked::before {transform: scale(1);}


#map {height: 600px; background: var(--grey-color)}
.info_content {max-width: 300px !important;}
.info_content h2 {margin-top: 3px; color: var(--dark-color); font-size: 18px; text-align: center; text-transform: uppercase; letter-spacing: 0.5px}
.info_content p {margin-bottom: 5px; font-size: 14px; font-weight: 400; text-align: center}
.gm-style .gm-style-iw button {top: 0px !important; right: 0px !important}
.gm-style .gm-style-iw-c {border-radius: 0px !important; padding: 20px !important; box-shadow: none !important;}
.gm-style .gm-style-iw-tc {display: none !important}
.gm-style .gm-style-iw-d {overflow: hidden !important}
.gm-style-iw-chr {display: none !important}


/********************* PRIVACY POLICY ***/
.privacy-policy h2, .privacy-policy h3 {font-weight: 300 !important}



/********************* FOOTER ***/
.footer {position: relative !important; color: var(--dark-color) !important; background: #ffffff !important; font-family: "Geologica", sans-serif; font-weight: 300 !important; font-size: 16px; padding-top: 120px; display: none !important}

.footer-copy {border-top: 0px; padding-top: 20px; padding-bottom: 20px; font-family: "Geologica", sans-serif; font-weight: 400 !important; font-size: 13px !important; letter-spacing: 0.5px; background: transparent; color: var(--dark-color); line-height: 32px}
.footer-copy a {color: var(--dark-color) !important;}
.footer-copy a:hover {color: var(--dark-color) !important; border-bottom: 1px solid var(--grey-color)}








/****************** MIN QUERIES ***/

@media screen and (min-width: 360px) {
	
.container {max-width: calc(100% - 30px);}
}

@media screen and (min-width: 544px) {
	
.container {max-width: calc(100% - 30px);}
}

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

.container {max-width: calc(100% - 40px);}
}

@media screen and (min-width: 850px) {

.container {max-width: 800px;}
}

@media screen and (min-width: 992px) {

.container {max-width: calc(100% - 40px);}

}

@media screen and (min-width: 1200px) {

.container {max-width: 1150px;}
}

@media screen and (min-width: 1300px) {

.container {max-width: 1200px;}
}

@media screen and (min-width: 1400px) {

.container {max-width: 1300px;}
}

@media screen and (min-width: 1600px) {

.container {max-width: 1500px;}
}

@media screen and (min-width: 1800px) {

.container {max-width: 1700px;}

}

@media screen and (min-width: 2000px) {

.container {max-width: 1900px;}
body, .entry-content {font-size: 17px !important; line-height: 23px !important; }

}



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


.hero-title {font-size: 150px; line-height: 170px;}
}



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


.hero-title {font-size: 120px; line-height: 135px;}

.service-title {font-size: 34px; line-height: 40px}
.posttitle h3, h2.posttitle, h1.posttitle {font-size: 34px; line-height: 40px}

.project-title a {font-size: 74px}
.single-project-title {font-size: 74px; line-height: 86px}
.cta-title {font-size: 74px; line-height: 86px}

.member-title {font-size: 30px; line-height: 36px}
}


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

.hero-title {font-size: 105px; line-height: 120px;}

.big-text {font-size: 19px; line-height: 28px}

.service-title {font-size: 29px; line-height: 36px}
.services-section .service-title::before {top: 2px}
.posttitle h3, h2.posttitle, h1.posttitle {font-size: 29px; line-height: 36px}

.project-title a {font-size: 68px}
.single-project-title {font-size: 68px; line-height: 80px}
.cta-title {font-size: 68px; line-height: 80px}

.member-title {font-size: 29px; line-height: 34px}

.divider {height: 500px}
#map {height: 500px}

}



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

.columns-section .vc_col-sm-4:first-child {width: 100% !important}
.columns-section .vc_col-sm-4:nth-child(2) {width: 50% !important;}
.columns-section .vc_col-sm-4:nth-child(3) {width: 50% !important}

.columns-section .vc_col-sm-8 {width: 100% !important}
.hero-bottom.columns-section .vc_col-sm-8 {width: 50% !important}

.nav ul li a {margin-left: 15px !important; margin-right: 15px !important;}


.hero-title {font-size: 96px; line-height: 110px;}
.section-title {margin-bottom: 15px !important}
.service-title {font-size: 26px; line-height: 34px}
.services-section .service-title::before {top: 1px}
.posttitle h3, h2.posttitle, h1.posttitle {font-size: 26px; line-height: 34px}

.project-title a {font-size: 60px}
.single-project-title {font-size: 60px; line-height: 72px; margin-bottom: 35px !important}
.project-info-head {font-size: 20px}
.cta-title {font-size: 60px; line-height: 72px}

.member-title {font-size: 26px; line-height: 34px}


.single-post .navigation-column {width: 25% !important}
.single-post .content-column {width: 75% !important}
.backtoblog {margin-top: 6px}


.project-excerpt {width: 100%}
.projects-grid .vc_gitem_row .vc_btn3-container {display: none !important}

.divider {height: 450px}
#map {height: 450px}
.footer-copy {font-size: 11px !important}
}



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

.firstcol {width: 180px !important}
.secondcol {width: 35px !important; position: absolute; right: 15px}

/*MENU*/
.mobile-menu-trigger {font-weight: 600; font-size: 15px; letter-spacing: 0px; display: block; color: var(--dark-color); margin-top: 4px; display: none !important}
.mobile-menu-trigger .fa-navicon:before {content: "" !important; display: block; width: 32px; height: 20px; margin-top: 0px; background: url(img/open-menu.png); background-size: cover}

.mm-menu {max-width: 350px !important}

#mobilemenu {display: block; text-align: left; color: var(--dark-color); font-weight: 600 !important; z-index: 600; height: 100% !important; background: transparent;}
.mm-opened #mobilemenu {background: #ffffff; border-right: 1px solid var(--grey-color)}
.mm-menu.mm-top {max-height: 100%}
.mm-navbar {background: transparent !important; border-bottom: 0px !important; }
.mm-navbar .mm-title {display: none}
.mm-close {top: 15px !important; right: 0px !important; width: 65px !important; color: var(--dark-color) !important; font-size: 0px}
.mm-close::after {content: ""; width: 32px; height: 32px; background: url(img/close.png); background-size: cover; background-position: center center; display: block; margin-left: 5px; margin-top: 5px}
.mm-panels {background: transparent}

.mm-listview {height: 90%; display: flex; flex-direction: column; justify-content: center; align-items: left; padding-left: 40px}
.mm-listview > li > a, .mm-listview > li > span {white-space: initial}
.mm-listview li a {font-size: 21px !important; line-height: 28px; font-weight: 600 !important; padding: 0px; color: var(--grey-color) !important; letter-spacing: 1px; margin-bottom: 10px; border-bottom: 0px }
.mm-listview li.current-menu-item a {color: var(--dark-color) !important; border-bottom: 0px}
.mm-listview li a:hover {color: var(--dark-color) !important;}
.mm-listview li a:active {background: transparent !important}
.mm-listview li a:focus {background: transparent !important}
.mm-listview > li:not(.mm-divider)::after {content: none}
.mm-menu .mm-listview > li a:not(.mm-next) {-webkit-tap-highlight-color: transparent; tap-highlight-color: transparent;}
.mm-menu .mm-listview > li.mm-selected > a:not(.mm-next), .mm-menu .mm-listview > li.mm-selected > span {background: transparent;}
.mm-opened .fa-navicon {display: none}

.mm-panel.mm-subopened {opacity: 0 !important}

.mm-prev {top: 20px !important; left: 10px !important}
.mm-prev::after {content:""; width: 32px; height: 32px; background: url(img/back.png); background-size: cover; background-position: center center; display: block }
.mm-prev::before {display: none}

.mm-next {right: -70px !important; width: 350px !important;}
.mm-next:before {border: 0px !important}
.mm-next:after {content: ""; border: 0px !important; transform: none !important; width: 32px !important; height: 32px !important; top: -1px !important; background: url(img/right.png); background-size: cover !important; background-position: center center; display: block}
.mm-next:hover + a {color: var(--dark-color) !important}

.menu-item-has-children a {margin-right: 0px !important; border: 0px !important; }
.menu-item-has-children a:hover {border: 0px !important}

.hero-bottom .smoothscrolling svg {width: 45px !important}
.hero-title {font-size: 86px; line-height: 100px;}

.projects-grid .vc_gitem_row {padding: 20px}
.project-title a {font-size: 50px}
.single-project-title {font-size: 50px; line-height: 62px; margin-bottom: 20px !important}
.cta-title {font-size: 50px; line-height: 62px}
.big-text {font-size: 18px; line-height: 26px}

.single-project-header .vc_col-sm-push-6 {width: 100%; left: 0px !important}
.single-project-header .vc_col-sm-pull-6 {width: 100%; right: 0px !important}

.wpcf7-form {margin-left: 15px !important; margin-right: 15px !important}


.footer-copy {line-height: 20px;}
.footer-copy .col-md-4 {width: 100% !important; text-align: left !important}
}



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


.columns-section .vc_col-sm-4:first-child {width: 100% !important}
.columns-section .vc_col-sm-4:nth-child(2) {width: 100% !important;}
.columns-section .vc_col-sm-4:nth-child(3) {width: 100% !important}

.columns-section .vc_col-sm-8 {width: 100% !important}
.hero-bottom.columns-section .vc_col-sm-8 {width: 100% !important}

.hero {height: 100vh !important}
.hero-bottom .smoothscrolling {display: none !important}

.section {padding-top: 80px; padding-bottom: 80px}

.hero-title {font-size: 68px; line-height: 82px;}
.section-title {margin-bottom: 10px !important}
.service-title {font-size: 26px; line-height: 34px}
.services-section .service-title::before {top: 1px}
.posttitle h3, h2.posttitle, h1.posttitle {font-size: 26px; line-height: 34px}

.project-hypertitle {font-size: 18px;}
.project-title {margin-bottom: 0px !important}
.project-title a {font-size: 44px}
.project-excerpt {display: none}
.single-project-title {font-size: 44px; line-height: 56px;}
.project-info-head {font-size: 20px}
.cta-title {font-size: 44px; line-height: 56px}

.member-title {font-size: 26px; line-height: 34px}

.divider {height: 400px}
#map {height: 400px}



.service-column.right::before {display: none !important}
.service-row .service-column.left .vc_column-inner {padding-bottom: 0px !important; padding-top: 15px !important}
.service-row .service-column.right {padding-top: 0px !important; padding-left: 70px !important}
.service-row .service-column.right .vc_column-inner {padding-top: 0px !important; padding-bottom: 15px !important}

.service-column.left::before {width: calc(100% - 60px)}


.member-column.left::before {width: calc(100% - 60px)}
.member-column.right::before {display: none !important}
.member-column.right {padding-top: 30px !important}

.project-info-column.left {padding-bottom: 0px !important}
.project-info-column.left::before {width: calc(100% - 60px)}
.project-info-column.right {padding-top: 0px !important}
.project-info-column.right::before {display: none !important}
.project-info-column.right .vc_column-inner {padding-top: 0px !important}
.project-info-value {text-align: left !important}

.project-info-column.last.left:after {display: none !important;}
.project-info-column.last.right:after {width: calc(100% - 60px); left: 30px}


.blog-section .post-column {padding-left: 0px !important; padding-top: 30px !important}
.single-post .navigation-column {display: none !important}
.single-post .content-column {width: 100% !important}

.footer {padding-top: 80px}
}


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

.main {padding-top: 140px !important;}

.section {padding-top: 60px; padding-bottom: 60px}

.hero-title {font-size: 58px; line-height: 70px;}
.service-title {font-size: 24px; line-height: 32px; padding-left: 45px}
.services-section .service-title::before {top: 0px; font-size: 21px}
.service-row .service-column.right {padding-left: 60px !important}

.posttitle h3, h2.posttitle, h1.posttitle {font-size: 24px; line-height: 32px}

.project-hypertitle {font-size: 18px;}
.project-title {margin-bottom: 0px !important}
.project-title a {font-size: 38px}
.project-excerpt {display: none}
.single-project-title {font-size: 38px; line-height: 48px;}
.project-info-head {font-size: 20px}
.cta-title {font-size: 38px; line-height: 48px}

.member-title {font-size: 24px; line-height: 32px}


.divider {height: 350px}
#map {height: 350px}


}


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



.hero-title {font-size: 46px; line-height: 58px;}
.section-title {margin-bottom: 0px !important}

.service-title {font-size: 24px; line-height: 32px; padding-left: 45px;}
.services-section .service-title::before {top: 0px; font-size: 21px}
.service-row .service-column.right {padding-left: 60px !important}

.posttitle h3, h2.posttitle, h1.posttitle {font-size: 24px; line-height: 32px}

.project-hypertitle {font-size: 16px;}
.project-title a {font-size: 28px}
.project-excerpt {display: none}
.single-project-title {font-size: 28px; line-height: 40px;}
.project-info-head {font-size: 20px}
.cta-title {font-size: 28px; line-height: 40px}

.member-title {font-size: 24px; line-height: 32px}


.divider {height: 300px}
#map {height: 300px}


}