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

@font-face {
    font-family: 'Satoshi-Regular';
    src: url('fonts/Satoshi-Regular.eot');
    src: url('fonts/Satoshi-Regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/Satoshi-Regular.woff2') format('woff2'),
         url('fonts/Satoshi-Regular.woff') format('woff'),
         url('fonts/Satoshi-Regular.ttf')  format('truetype'),
         url('fonts/Satoshi-Regular.svg#false') format('svg');
}

@font-face {
    font-family: 'Satoshi-Medium';
    src: url('fonts/Satoshi-Medium.eot');
    src: url('fonts/Satoshi-Medium.eot?#iefix') format('embedded-opentype'),
         url('fonts/Satoshi-Medium.woff2') format('woff2'),
         url('fonts/Satoshi-Medium.woff') format('woff'),
         url('fonts/Satoshi-Medium.ttf')  format('truetype'),
         url('fonts/Satoshi-Medium.svg#Satoshi Medium') format('svg');
}

@font-face {
    font-family: 'Satoshi-Bold';
    src: url('fonts/Satoshi-Bold.eot');
    src: url('fonts/Satoshi-Bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/Satoshi-Bold.woff2') format('woff2'),
         url('fonts/Satoshi-Bold.woff') format('woff'),
         url('fonts/Satoshi-Bold.ttf')  format('truetype'),
         url('fonts/Satoshi-Bold.svg#false') format('svg');
}

@font-face {
    font-family: 'PPGatwickJet-Semibold';
    src: url('fonts/PPGatwick-JetSemibold.eot');
    src: url('fonts/PPGatwick-JetSemibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/PPGatwick-JetSemibold.woff2') format('woff2'),
         url('fonts/PPGatwick-JetSemibold.woff') format('woff'),
         url('fonts/PPGatwick-JetSemibold.ttf')  format('truetype'),
         url('fonts/PPGatwick-JetSemibold.svg#PP Gatwick Jet Semibold') format('svg');
}

@font-face {
    font-family: 'PPGatwickGlider-Semibold';
    src: url('fonts/PPGatwick-GliderSemibold.eot');
    src: url('fonts/PPGatwick-GliderSemibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/PPGatwick-GliderSemibold.woff2') format('woff2'),
         url('fonts/PPGatwick-GliderSemibold.woff') format('woff'),
         url('fonts/PPGatwick-GliderSemibold.ttf')  format('truetype'),
         url('fonts/PPGatwick-GliderSemibold.svg#PP Gatwick Glider Semibold') format('svg');
}

:root {
	--bg-color: #FAFAF6;
	--dark-color: #1A1A1A;
	--brown-color: #EADECA;
	--gold-color: #C7A469;
	--blue-color: #004E64;
	--grey-color: #7B7B7B;
}

/******************* GENERAL */
html, body {overflow-x: hidden !important; background: var(--bg-color);}
body, .entry-content {font-family: 'Satoshi-Regular' !important; font-size: 16px !important; font-weight: 400 !important; line-height: 22px !important; letter-spacing: 0.5px; color: var(--dark-color)}
h1,h2,h3,h4,h5,h6 {font-family: 'PPGatwickJet-Semibold'; font-weight: 400 !important; letter-spacing: 0px; color: var(--dark-color)}
strong {font-family: 'Satoshi-Bold'; font-weight: 400 !important}

.entry-content p > a {font-weight: 400; border-bottom: 0px !important; color: var(--dark-color);}
.entry-content p > a:hover {color: var(--brown-color)}

.entry-content ul {list-style-type: none; padding-left: 0px}
.entry-content ul li {margin-bottom: 10px; color: var(--dark-color); font-size: 16px; padding-left: 15px; position: relative}
.entry-content ul li:before {content: "-"; position: absolute; left: 0px; top: 0px; display: block}

.centered {text-align: center !important}

.nodesktop {display: none}

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

.main {padding-top: 0px !important}
.page-template-template-experience .main {padding-bottom: 0px !important}
.page-template-template-nohero .main {padding-top: 180px !important; padding-bottom: 0px !important}
.single-post .main {padding-top: 260px !important}


/****************** HEADER ***/
.firstcol {width: 380px !important; text-align: left}
.secondcol {width: calc(100% - 760px) !important; text-align: center}
.thirdcol {width: 380px !important;  text-align: right; color: var(--bg-color); font-family: 'Satoshi-Regular'; font-weight: 400 !important; font-size: 16px; letter-spacing: 0px}

.header {position: absolute; width: 100%; top: 0px; z-index: 100; background: transparent !important; }
.scrollActive .header {position: fixed; background: var(--brown-color) !important; width: 100%; left: 0px;}
.mast-head-wrap {padding: 30px 15px !important; align-items: flex-start}
.scrollActive .mast-head-wrap {padding: 15px 15px !important; align-items: center}


/****************** LOGO ***/
.site-logo svg {}
.site-logo a {margin-bottom: 0px}
.alt-logo {display: none; position: relative; margin: 0 auto !important; top: 4px}

.scrollActive .site-logo {display: none}
.scrollActive .alt-logo {display: block}

.page-template-template-nohero .site-logo svg path {fill: var(--dark-color);}
.single-post .site-logo svg path {fill: var(--dark-color);}
.error404 .site-logo svg path {fill: var(--dark-color);}

/****************** MENU ***/
.nav {display: none !important}

.mobile-menu-trigger {position: relative; font-size: 0px !important; float: left; width: 50px; height: 50px; display: flex !important; align-items: center; background: transparent; cursor: pointer}

#mobilemenu {display: block !important; text-align: left; color: var(--bg-color); z-index: 600; height: 100% !important; background: transparent; font-family: 'Satoshi-Regular'; font-weight: 400 !important;}



.fa-navicon {position: absolute; display: block; background-color: var(--bg-color); height: 2px; top: 13px; left: 0px; width: 36px; transition: all 0.2s ease} 
.fa-navicon::before, .fa-navicon::after {content: ""; position: absolute; display: block; background-color: var(--bg-color); height: 2px; width: 36px; transition: all 0.2s ease} 
.fa-navicon::before {top: 10px; left: 10px} 
.fa-navicon::after {top: 20px; left: 0px} 

.mobile-menu-trigger:hover .fa-navicon {left: 10px; transition: all 0.2s ease} 
.mobile-menu-trigger:hover .fa-navicon::before {left: -10px !important; transition: all 0.2s ease} 
.mobile-menu-trigger:hover .fa-navicon::after {left: 0px; transition: all 0.2s ease}

.page-template-template-nohero .fa-navicon {background-color: var(--dark-color);}
.page-template-template-nohero .fa-navicon:before {background-color: var(--dark-color);}
.page-template-template-nohero .fa-navicon:after {background-color: var(--dark-color);}

.single-post .fa-navicon {background-color: var(--dark-color);}
.single-post .fa-navicon:before {background-color: var(--dark-color);}
.single-post .fa-navicon:after {background-color: var(--dark-color);}

.error404 .fa-navicon {background-color: var(--dark-color);}
.error404 .fa-navicon:before {background-color: var(--dark-color);}
.error404 .fa-navicon:after {background-color: var(--dark-color);}

.scrollActive .fa-navicon {background-color: var(--dark-color);}
.scrollActive .fa-navicon:before {background-color: var(--dark-color);}
.scrollActive .fa-navicon:after {background-color: var(--dark-color);}



.mm-menu {max-width: 380px; }
.mm-opened #mobilemenu {background-color: var(--blue-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: 5px !important; right: 2px !important; width: auto !important; color: var(--bg-color) !important; text-transform: uppercase; font-size: 14px; letter-spacing: 0.5px}

.mm-close::after {content: ""; width: 44px; height: 44px; background: url(img/close.png); background-size: cover; background-position: center center; display: block; margin-left: 13px; margin-top: 5px}
.mm-panels {background: transparent}
.mm-listview {height: 90%;display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 120px 30px 30px 30px}

.mm-listview > li > a, .mm-listview > li > span {white-space: initial}
.mm-listview li a {font-family: 'PPGatwickJet-Semibold'; font-weight: 400 !important; font-size: 28px; line-height: 38px; padding: 0px; color: var(--bg-color) !important; letter-spacing: 0px; margin-bottom: 15px;}
.mm-listview li.current-menu-item a {color: var(--gold-color) !important}
.mm-listview li:hover a {color: var(--gold-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: 44px; height: 44px; 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(--bg-color) !important}

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

.mm-listview li.menu-button {position: absolute !important; bottom: 30px;}
.mm-listview li.menu-button a {padding: 11px 30px 12px 30px !important; height: auto !important; border: 1px solid #ffffff !important; border-radius: 24px !important; font-size: 14px !important; font-family: 'Satoshi-Bold' !important; font-weight: 400 !important; letter-spacing: 0.5px !important; margin-bottom: 0px !important; line-height: 24px !important}
.mm-listview li.menu-button:hover a {background: var(--gold-color) !important; border-color: var(--gold-color) !important; color: var(--bg-color) !important;}

/****************** HERO ***/
.hero {height: 100vh; background-color: var(--dark-color); background-size: cover; background-position: center center; background-repeat: no-repeat}
.hero-title {position: absolute; width: 100%; bottom: 120px; left: 50%; transform: translateX(-50%); color: var(--bg-color) !important; opacity: 0.5 !important; letter-spacing: 0px;}
.hero-subtitle {position: absolute; bottom: 50px; font-size: 14px; right: 50px; color: var(--bg-color) !important; font-weight: 400; font-family: 'Satoshi-Medium'; opacity: 1 !important}

.scroll-arrow {position: absolute; bottom: 20px; left: 40px; animation: floatDown 2s ease-in-out 3 forwards;}
.scroll-text {color: var(--bg-color); font-size: 14px; font-weight: 400; font-family: 'Satoshi-Bold'; letter-spacing: 0.5px !important; position: absolute; bottom: 50px; left: 110px}

.page-template-template-experience .hero-title {bottom: -25px; left: 40px; transform: none; opacity: 1 !important; line-height: 1}



@keyframes floatDown {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(8px);
  }
  100% {
    transform: translateY(0);
  }
}


/****************** HERO LOADER ***/

#hero-loader {
    position: absolute;
    top: 36px; right: 215px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    transition: opacity 0.6s ease;
}

/* Spinner animation */
.spinner {
    width: 40px;
    height: 40px;
    border: 3px solid var(--bg-color);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg);}
    100% { transform: rotate(360deg);}
}

/* Hide loader */
#hero-loader.hide {
    opacity: 0;
    pointer-events: none;
}



/*** BUTTONS ***/
.vc_btn3 {background-image: none !important; font-weight: 400; font-size: 14px !important; font-family: 'Satoshi-Bold'; letter-spacing: 0.5px !important; padding: 11px 30px 12px 30px !important; height: auto !important; position: relative; text-transform: none; border-width: 1px !important; border-radius: 24px !important}
.last-btn .vc_btn3 {margin-left: 20px !important}
.vc_btn3:hover {background: var(--gold-color) !important; border-color: var(--gold-color) !important}

.standout.vc_btn3 {background: rgba(255,255,255,0.1); color: var(--bg-color) !important; border: 1px solid var(--bg-color) !important; top: 13px;}
.standout.vc_btn3:hover {border: 1px solid var(--gold-color) !important; color: var(--bg-color) !important}

.page-template-template-nohero .standout.vc_btn3 {background: var(--dark-color); color: var(--bg-color) !important; border: 1px solid var(--dark-color) !important;}
.page-template-template-nohero .standout.vc_btn3:hover {background: var(--gold-color) !important; color: var(--bg-color) !important; border: 1px solid var(--gold-color) !important}

.single-post .standout.vc_btn3 {background: var(--dark-color); color: var(--bg-color) !important; border: 1px solid var(--dark-color) !important;}
.single-post .standout.vc_btn3:hover {background: var(--gold-color) !important; color: var(--bg-color) !important; border: 1px solid var(--gold-color) !important}

.scrollActive .standout.vc_btn3 {background: var(--dark-color) !important; color: var(--bg-color) !important; border: 1px solid var(--dark-color) !important; top: 0px;}
.scrollActive .standout.vc_btn3:hover {background: var(--gold-color) !important; border: 1px solid var(--gold-color) !important; color: var(--bg-color) !important}

.error404 .standout.vc_btn3 {background: var(--dark-color); color: var(--bg-color) !important; border: 1px solid var(--dark-color) !important;}
.error404 .standout.vc_btn3:hover {background: var(--gold-color) !important; color: var(--bg-color) !important; border: 1px solid var(--gold-color) !important}


/*** SECTIONS ***/

.section {padding-top: 100px; padding-bottom: 100px}
.section.with-big-text {padding-top: 0px;}
.bottom-section {padding-top: 0px}
.top-section {padding-bottom: 0px}

.dark-section {background: var(--blue-color); color: var(--bg-color);}

.section-title {font-size: 48px; margin-bottom: 30px !important; margin-top: 0px !important; line-height: 1.3}
.section-subtitle {color: var(--gold-color) !important; font-family: 'Satoshi-Medium'; text-transform: uppercase; font-size: 15px; letter-spacing: 0.5px}

.big-text-section .vc_column_container {padding-bottom: 0px !important}

.big-text-section {position: relative;}
.big-text {font-family: 'PPGatwickGlider-Semibold'; color: var(--brown-color);}




.service {font-family: 'Satoshi-Medium'; font-size: 17px; letter-spacing: 0.5px; margin-top: 20px !important; margin-bottom: 20px !important; padding-top: 20px !important; border-top: 1px solid var(--dark-color);}
.service:first-of-type {margin-top: 60px !important}
.service:last-of-type {border-bottom: 1px solid var(--dark-color); padding-bottom: 20px; margin-bottom: 60px !important}


.experience-text-column {padding: 40px !important}
.experience-text-column h3 {margin-top: 15px !important; font-size: 30px; line-height: 44px}

.experience-description {position: absolute; bottom: 0px; writing-mode: vertical-rl;
    text-orientation: mixed;transform: rotate(180deg); left: 30px; max-height: 320px; white-space: normal;}

.experience-button {position: absolute; right: 40px; bottom: 30px}

/*HOME BLOG GRID*/

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

.featured-grid {margin-bottom: 0px !important}
.featured-grid .vc_grid-item .vc_gitem-zone-c {
    position: absolute;
    top: 50%;
    transform: translateY(-50%); padding-right: 60px;
}


.post-title h3 {margin-top: 15px !important}
.post-title a {color: var(--blue-color) !important; line-height: 34px;}
.featured-grid .post-title a {font-size: 30px; line-height: 44px; margin-bottom: 30px !important}
.post-excerpt {margin-bottom: 40px !important; margin-top: 20px !important}

.post-category{display: inline-block; color: var(--gold-color) !important; font-family: 'Satoshi-Medium'; font-size: 15px; letter-spacing: 0.5px}
.post-date {display: inline-block; margin-right: 10px; padding-right: 10px; border-right: 1px solid var(--dark-color); color: var(--gold-color) !important; font-family: 'Satoshi-Medium'; font-size: 15px; letter-spacing: 0.5px}


/*BLOG*/

.blog-page .vc_grid.vc_row.vc_grid-gutter-30px {margin-right: -30px !important}
.blog-page .vc_grid.vc_row.vc_grid-gutter-30px .vc_grid-item {padding-right: 60px !important;  margin-top: 20px !important}

.posthover {background-color: rgba(199, 164, 105,0.3) !important}

.vc_grid-filter.vc_grid-filter-color-black {position: absolute; top: 50px; right: 30px}

.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item {font-weight: 400; font-size: 14px !important; font-family: 'Satoshi-Bold'; letter-spacing: 0.5px !important; color: var(--dark-color); padding: 5px 15px !important;}
.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item:before {content: none !important}
.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item:hover {background: var(--gold-color) !important;}
.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item:hover > span { color: var(--bg-color) !important}
.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item.vc_active {background: var(--dark-color) !important}
.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item.vc_active > span { color: var(--bg-color) !important}


/*SINGLE POST*/

.single-post .content-main {padding-right: 120px !important}
.single-post .entry-title {font-size: 30px; line-height: 44px; margin-bottom: 30px !important; color: var(--blue-color)}
.single-post .entry-meta:after {display: none}

.backtoblog {position: absolute; width: 60px; height: 150px; top: 0px; right: 33px; font-size: 14px; font-weight: 400; font-family: 'Satoshi-Bold'; letter-spacing: 0.5px !important; }
.backtoblog a {color: var(--dark-color) !important; padding-bottom: 40px}
.backtoblog:before {content: ""; position: absolute; top: 0px; left: 31px; display: block; width: 21px; height: 20px; background: url(/wp-content/uploads/2025/11/arrow-blog.svg); background-size: cover}


/****************** CONTACT ***/
/*.wpcf7-form {margin-bottom: 80px}*/
.wpcf7-form p {margin-bottom: 25px}

.wpcf7-text {border:1px solid var(--grey-color); padding: 0px 20px; background: #ffffff; color: var(--dark-color); margin-top: 5px; height: 55px; font-size: 16px !important; border-radius: 32px}

.wpcf7-date {border:1px solid var(--grey-color); padding: 0px 20px; background-color: #ffffff; color: var(--dark-color); margin-top: 5px; height: 55px; font-size: 16px !important; border-radius: 32px; line-height: 48px; text-transform: uppercase}

.wpcf7-select {border:1px solid var(--grey-color); padding: 0px 20px; background-color: #ffffff; color: var(--dark-color); margin-top: 5px; height: 55px; font-size: 16px !important; border-radius: 32px}


.wpcf7-textarea {border: 1px solid var(--grey-color); padding: 20px; background: #ffffff; color: var(--dark-color); resize: vertical; height: 180px; margin-top: 5px; font-size: 16px !important; border-radius: 32px}
.wpcf7-text:hover,.wpcf7-text:focus, .wpcf7-textarea:hover, .wpcf7-textarea:focus, .wpcf7-select:hover,.wpcf7-select:focus, .wpcf7-date:hover, .wpcf7-date:focus {border-color: var(--gold-color)}

.schedule-message {padding-left: 20px; font-family: 'Satoshi-Bold'; letter-spacing: 0.5px; position: relative; top: 20px }

.submitbtn {position: relative; width: auto}
.submitbtn p {margin-bottom: 0px !important}

.wpcf7-submit {background: transparent !important; letter-spacing: 0.5px !important; font-weight: 400 !important; font-family: 'Satoshi-Bold'; font-size: 14px !important; text-transform: none !important; padding: 10px 30px !important; height: auto; color: var(--dark-color) !important; border: 1px solid var(--dark-color) !important; border-radius: 24px !important; transition: all 0.3s ease !important; }
.wpcf7-submit:hover {background: var(--gold-color) !important; color: var(--bg-color) !important; border-color:var(--gold-color) !important }

.wpcf7-spinner {position: absolute !important; top: 10px; margin-left: 50px !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: 400 !important; color: var(--dark-color); text-transform: none !important; display: inline-block; letter-spacing: 0.5px; width: calc(100% - 40px)}
.forconsent a {color: var(--dark-color) !important; }
.forconsent a:hover {color: var(--gold-color) !important}
.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: var(--bg-color) !important; font-weight: 400 !important}
.wpcf7 form.invalid .wpcf7-response-output {background: #dc3232 !important; border: 1px solid #dc3232 !important; color: var(--bg-color) !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);}


textarea::-webkit-input-placeholder {font-family: 'Satoshi-Medium'; font-weight: 400 !important;  color: var(--grey-color); letter-spacing: 0.5px }
textarea:-ms-input-placeholder {font-family: 'Satoshi-Medium'; font-weight: 400 !important;  color:var(--grey-color); letter-spacing: 0.5px}
textarea::placeholder {font-family: 'Satoshi-Medium'; font-weight: 400 !important;  color: var(--grey-color); letter-spacing: 0.5px}

input::-webkit-input-placeholder {font-family: 'Satoshi-Medium'; font-weight: 400 !important;  color: var(--grey-color); letter-spacing: 0.5px}
input:-ms-input-placeholder {font-family: 'Satoshi-Medium'; font-weight: 400 !important;  color: var(--grey-color); letter-spacing: 0.5px}
input::placeholder {font-family: 'Satoshi-Medium'; font-weight: 400 !important; color: var(--grey-color); letter-spacing: 0.5px}



/*ASSOCIATES SECTION*/
.wpls-logo-showcase .slick-arrow {width: 36px !important}
.wpls-logo-showcase .slick-arrow.slick-prev {background: url(img/carousel-prev.svg) !important; background-size: cover !important; background-repeat: no-repeat !important}
.wpls-logo-showcase .slick-arrow.slick-next {background: url(img/carousel-next.svg) !important; background-size: cover !important; background-repeat: no-repeat !important}
.wpls-logo-showcase .slick-arrow svg {display: none !important}


.wpls-fix-box {filter: grayscale(100%); padding-left: 30px; padding-right: 30px; transition: all 0.5s ease}
.wpls-fix-box:hover {filter: grayscale(0%);transition: all 0.5s ease}




/*SERVICES*/

.service-description {margin-bottom: 50px !important}


/*SIDEBAR*/

.content-main {padding-right: 40px !important}
.content-sidebar > .vc_column-inner {padding-left: 0px !important}
.content-sidebar > .vc_column-inner > .wpb_wrapper {background: var(--blue-color) !important; border-radius: 24px; margin-top: 130px; padding: 30px !important; color: var(--bg-color); font-family: 'Satoshi-Medium';}
.content-sidebar h2 {color: var(--bg-color); margin-bottom: 30px}


.sidebar {background: var(--blue-color) !important; border-radius: 24px; padding: 30px !important; color: var(--bg-color); font-family: 'Satoshi-Medium';}
.sidebar .widget-title {color: var(--bg-color); margin-bottom: 30px}

.sidebar ul li a {color: var(--bg-color) !important}
.sidebar .post-date {border-right: 0px !important; margin-bottom: 20px}


/*PRIVACY POLICY*/

.privacy-policy h2 {color: var(--blue-color);}
.privacy-policy h3 {color: var(--blue-color);}


/****************** 404 ***/
.error404 .error-hero {display: block; height: 100vh; text-align: center;background: var(--bg-color)}
.error404 .error-title {font-family: 'Satoshi-Medium'; font-weight: 400 !important; font-size: 22px;color: var(--dark-color); width: 240px; height: 150px; position: absolute; left: 50%; top: 50vh; margin-left: -120px; margin-top: -75px;}

.error404 .error-title:before {content: "404"; display: block;font-family: 'Satoshi-Bold'; font-weight: 400 !important; font-size: 100px; color: var(--dark-color); margin-bottom: 20px; line-height: 100px}



/****************** FOOTER */
.footer {position: relative !important; background-color: var(--brown-color) !important; color: var(--dark-color) !important; font-family: 'Satoshi-Regular'; font-weight: 400 !important; font-size: 16px }
.footer-main {padding-top: 100px; padding-bottom: 60px}
.footer-main .footer-content {display: flex; flex-wrap: wrap;}

.widget {font-size: 16px !important; line-height: 23px !important; margin-bottom: 20px; font-weight: 400 !important; letter-spacing: 0.5px}
.widget-title {font-family: 'PPGatwickJet-Semibold'; font-weight: 400 !important; font-size: 26px !important; border-bottom: 0px !important; letter-spacing: 0px; position: relative; color: var(--dark-color)}
.widget-title:after {content: none !important}

.footer .widget-title {color: var(--dark-color)}

.contactul {list-style-type: none; padding-left: 0px; margin: 20px 0 0 0; color: var(--dark-color)}
.contactul li {margin-bottom: 4px; font-size: 16px; padding-left: 0px; position: relative; font-weight: 400 !important; letter-spacing: 0.5px}

.footer .contactul {margin: 0px; margin-bottom: 30px}
.footer .contactul li {margin-bottom: 4px}
.footer .contactul li a {color: var(--dark-color) !important;}

.footer .menu-item {margin-bottom: 4px}
.footer .menu-item a {color: var(--dark-color) !important; font-weight: 400 !important; letter-spacing: 0.5px}
.footer .menu-item.current_page_item a {background: transparent !important;}
.footer .menu-item.current-menu-item a {background: transparent !important;}
.footer .menu-item a:hover {}

.footer li.menu-button {display: none !important}

.footer .social-icons {margin-left: 0px}
.footer .social-icon {margin-left: 0px; margin-right: 0px; background: transparent; color: var(--dark-color) !important; font-size: 24px; text-align: left}
.footer .social-icon .fa-facebook {font-size: 21px; top: -2px}

.footer .widget_media_image {margin-top: -2px}
.footer .widget_media_image svg path {fill: var(--dark-color)}


.footer-copy {border-top: 0px; padding-top: 20px; padding-bottom: 20px; font-family: 'Satoshi-Medium'; font-weight: 400 !important; font-size: 14px !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}





/****************** CONTAINER ***/
@media screen and (min-width: 300px) {
	
.container {max-width: calc(100% - 20px);}
.wide-section .text-column {padding-left: 25px !important; padding-right: 25px !important; padding-top: 60px !important; padding-bottom: 60px !important}
.wide-section.right-text .text-column {padding-right: 25px !important; padding-left: 25px !important}

.wide-section .experience-column {border-bottom: 4px solid var(--bg-color); border-left: 2px solid var(--bg-color) }
.wide-section .experience-column.left {border-left: 0px; border-right: 2px solid var(--bg-color) }

.big-text-section {top: 8px}
.big-text {font-size: 36px; line-height: 1.1;}
.hero-title {font-size: 36px;}

.page-template-template-experience .hero {height: 400px;}
.page-template-template-experience .hero-title {font-size: 32px;}


}

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

.container {max-width: calc(100% - 20px);}
.wide-section .text-column {padding-left: 25px !important; padding-right: 25px !important; padding-top: 60px !important; padding-bottom: 60px !important}
.wide-section.right-text .text-column {padding-right: 25px !important; padding-left: 25px !important}

.big-text-section {top: 8px}
.big-text {font-size: 42px; line-height: 1.1;}
.hero-title {font-size: 42px;}

.page-template-template-experience .hero {height: 450px;}
.page-template-template-experience .hero-title {font-size: 36px;}


}


@media screen and (min-width: 543px) {
	
.container {max-width: calc(100% - 40px);}
.wide-section .text-column {padding-left: 35px !important; padding-right: 35px !important; padding-top: 60px !important; padding-bottom: 60px !important}
.wide-section.right-text .text-column {padding-right: 35px !important; padding-left: 35px !important}

.big-text-section {top: 10px}
.big-text {font-size: 48px; line-height: 1.1;}
.hero-title {font-size: 48px;}

.page-template-template-experience .hero {height: 500px;}
.page-template-template-experience .hero-title {font-size: 42px;}

}

@media screen and (min-width: 650px) {
	
.container {max-width: calc(100% - 40px);}
.wide-section .text-column {padding-left: 35px !important; padding-right: 35px !important; padding-top: 60px !important; padding-bottom: 60px !important}
.wide-section.right-text .text-column {padding-right: 35px !important; padding-left: 35px !important}

.big-text-section {top: 15px}
.big-text {font-size: 68px; line-height: 1.1;}
.hero-title {font-size: 68px;}

.page-template-template-experience .hero {height: 600px;}
.page-template-template-experience .hero-title {font-size: 52px;}

}

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

.container {max-width: calc(100% - 40px);}
.wide-section .text-column {padding-left: 35px !important; padding-right: 35px !important; padding-top: 80px !important; padding-bottom: 60px !important}
.wide-section.right-text .text-column {padding-right: 35px !important; padding-left: 35px !important}


.big-text-section {top: 17px}
.big-text {font-size: 78px; line-height: 1.1;}
.hero-title {font-size: 78px;}

.page-template-template-experience .hero {height: 600px;}
.page-template-template-experience .hero-title {font-size: 62px;}
}


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

.container {max-width: calc(100% - 60px);}
.wide-section .text-column {padding-left: 45px !important; padding-right: 45px !important}
.wide-section.right-text .text-column {padding-right: 45px !important; padding-left: 45px !important}

.big-text-section {top: 17px}
.big-text {font-size: 88px; line-height: 1.1;}
.hero-title {font-size: 88px;}

.page-template-template-experience .hero {height: calc(100vh + 52px);}
.page-template-template-experience .hero-title {font-size: 72px;}
}



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

.container {max-width: calc(100% - 60px);}
.wide-section .text-column {padding-left: 45px !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: 45px !important; padding-left: 60px !important}

.big-text-section {top: 22px}
.big-text {font-size: 100px; line-height: 1.1;}
.hero-title {font-size: 100px;}

.page-template-template-experience .hero {height: calc(100vh + 66px);}
.page-template-template-experience .hero-title {font-size: 86px}
}


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

.container {max-width: calc(100% - 60px);}
.wide-section .text-column {padding-left: 45px !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: 45px !important; padding-left: 60px !important}


.big-text-section {top: 22px}
.big-text {font-size: 108px; line-height: 1.1;}
.hero-title {font-size: 108px;}

.page-template-template-experience .hero {height: calc(100vh + 74px);}
.page-template-template-experience .hero-title {font-size: 94px}
}

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

.container {max-width: calc(100% - 60px);}
.wide-section .text-column {padding-left: 45px !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: 45px !important; padding-left: 60px !important}


.big-text-section {top: 22px}
.big-text {font-size: 110px; line-height: 1.1;}
.hero-title {font-size: 110px;}

.page-template-template-experience .hero {height: calc(100vh + 80px);}
.page-template-template-experience .hero-title {font-size: 100px}


}


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

.container {max-width: calc(100% - 60px);}
.wide-section .text-column {padding-left: 45px !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: 45px !important; padding-left: 60px !important}


.big-text-section {top: 25px}
.big-text {font-size: 120px; line-height: 1.1;}
.hero-title {font-size: 120px;}

.page-template-template-experience .hero {height: calc(100vh + 90px);}
.page-template-template-experience .hero-title {font-size: 110px}


}

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

.container {max-width: 1350px;}
.wide-section .text-column {padding-left: calc((100vw - 1320px) / 2) !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: calc((100vw - 1320px) / 2) !important; padding-left: 60px !important}

.big-text-section {top: 26px}
.big-text {font-size: 130px; line-height: 1.1;}
.hero-title {font-size: 130px;}

.page-template-template-experience .hero {height: calc(100vh + 100px);}
.page-template-template-experience .hero-title {font-size: 120px}


}

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

.container {max-width: 1550px;}
.wide-section .text-column {padding-left: calc((100vw - 1520px) / 2) !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: calc((100vw - 1520px) / 2) !important; padding-left: 60px !important}

.big-text-section {top: 29px}
.big-text {font-size: 150px; line-height: 1.1;}
.hero-title {font-size: 150px;}

.page-template-template-experience .hero {height: calc(100vh + 120px);}
.page-template-template-experience .hero-title {font-size: 140px}

}

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

.container {max-width: 1750px;}
.wide-section .text-column {padding-left: calc((100vw - 1720px) / 2) !important; padding-right: 60px !important}
.wide-section.right-text .text-column {padding-right: calc((100vw - 1720px) / 2) !important; padding-left: 60px !important}

.big-text-section {top: 33px}
.big-text {font-size: 170px; line-height: 1.1;}
.hero-title {font-size: 170px;}

.page-template-template-experience .hero {height: calc(100vh + 136px);}
.page-template-template-experience .hero-title {font-size: 156px}


}

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

.container {max-width: 1900px;}
.wide-section {width: 1900px !important; margin: 0 auto; position: relative !important; left: auto !important; right: auto !important}
.wide-section .text-column {padding-left: 15px !important; padding-right: 60px !important}
.wide-section .image-column {padding-right: 15px !important; padding-left: 0px !important}
.wide-section .image-row {padding-left: 15px !important; padding-right: 15px !important;}

.wide-section.right-text .text-column {padding-left: 60px !important; padding-right: 15px !important}
.wide-section.right-text .image-column {padding-left: 15px !important; padding-right: 0px !important}

.wide-section .experience-column {padding-right: 15px !important; padding-left: 0px !important}
.wide-section .experience-column.left {padding-right: 0px !important; padding-left: 15px !important}


.big-text-section {top: 33px}
.big-text {font-size: 180px; line-height: 1.1;}
.hero-title {font-size: 180px;}

.page-template-template-experience .hero {height: calc(100vh + 144px);}
.page-template-template-experience .hero-title {font-size: 164px}
}



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

.section-title {font-size: 46px;}
.experience-text-column h3 {font-size: 26px; line-height: 40px}
.featured-grid .post-title a {font-size: 26px; line-height: 40px}
.single-post .entry-title {font-size: 26px; line-height: 40px}
.service {font-size: 16px;}

.content-sidebar > .vc_column-inner > .wpb_wrapper {margin-top: 125px}
}


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


.section-title {font-size: 42px;}
.experience-text-column h3 {font-size: 24px; line-height: 38px}
.featured-grid .post-title a {font-size: 24px; line-height: 38px}
.single-post .entry-title {font-size: 24px; line-height: 38px}
.widget-title {font-size: 24px !important}

.service {margin-top: 15px !important; margin-bottom: 15px !important; padding-top: 15px !important;}
.service:first-of-type {margin-top: 40px !important}
.service:last-of-type {margin-bottom: 40px !important; padding-bottom: 15px !important}

.vc_grid-filter.vc_grid-filter-color-black {top: 45px}
}


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


.section-title {font-size: 38px;}
.experience-text-column h3 {font-size: 22px; line-height: 34px; margin-top: 0px !important}
.featured-grid .post-title a {font-size: 22px; line-height: 34px}
.single-post .entry-title {font-size: 22px; line-height: 34px}
.widget-title {font-size: 22px !important}


.experience-description {max-height: 240px; left: 35px}
.single-post .experience-description {left: 30px}

.service {margin-top: 12px !important; margin-bottom: 12px !important; padding-top: 12px !important;}
.service:first-of-type {margin-top: 35px !important}
.service:last-of-type {margin-bottom: 35px !important; padding-bottom: 12px !important}

.vc_grid-filter.vc_grid-filter-color-black {top: 40px}


.content-sidebar > .vc_column-inner > .wpb_wrapper {margin-top: 117px}
.content-sidebar > .vc_column-inner > .wpb_wrapper a {display: block}

.privacy-policy h2 {font-size: 22px}
.privacy-policy h3 {font-size: 19px}

}


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

.firstcol {width: 180px !important; }
.secondcol {width: calc(100% - 360px) !important; }
.thirdcol {width: 180px !important; }


.section-title {font-size: 34px;}
.experience-text-column h3 {font-size: 21px; line-height: 32px; margin-top: 0px !important}
.post-title a {font-size: 21px; line-height: 32px}
.featured-grid .post-title a {font-size: 21px; line-height: 32px}
.single-post .entry-title {font-size: 21px; line-height: 32px}
.widget-title {font-size: 21px !important}


.experience-description {max-height: 200px}

.page-template-template-experience .hero-title {bottom: -20px}

.wpls-fix-box {padding-left: 20px; padding-right: 20px}

.vc_grid-filter.vc_grid-filter-color-black {top: 38px}
.blog-page .vc_grid.vc_row.vc_grid-gutter-30px .vc_grid-item {margin-top: 0px !important}

.content-sidebar > .vc_column-inner > .wpb_wrapper {margin-top: 110px !important}

.footer .widget_media_image {margin-top: -8px}
.footer .widget_media_image svg {width: 185px}
}



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

.notablet {display: none !important}





.section-title {font-size: 34px; margin-bottom: 20px !important}


.small-section .vc_col-sm-3 {width: 10% !important}
.small-section .vc_col-sm-6 {width: 80% !important}

.vc_grid-filter.vc_grid-filter-color-black {top: 42px}
.vc_grid-filter.vc_grid-filter-color-black > .vc_grid-filter-item {font-size: 13px !important; padding: 3px 12px !important}

.blog-page .vc_grid.vc_row.vc_grid-gutter-30px .vc_pageable-slide-wrapper {margin-right: -10px}
.blog-page .vc_grid.vc_row.vc_grid-gutter-30px .vc_grid-item {margin-top: 15px !important; padding-right: 40px !important}

.single-post .content-main {padding-right: 80px !important}
.backtoblog {right: 14px}

.content-sidebar {padding-left: 0px !important}
.content-sidebar > .vc_column-inner > .wpb_wrapper {margin-top: 100px !important}
}



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

.page-template-template-experience .hero-title {bottom: -17px}

.home .service {display: none}

.section-title {font-size: 32px;}
.vc_btn3 {font-size: 13px !important; padding: 10px 20px 11px 20px !important}
.last-btn .vc_btn3 {margin-left: 10px !important}
.standout.vc_btn3 {top: 10px}
.scrollActive .standout.vc_btn3 {top: -2px}
.wpcf7-submit {font-size: 13px !important}

.featured-grid .vc_grid-item .vc_grid-item-mini {display: flex; flex-direction: column;}
.featured-grid .vc_grid-item .vc_gitem-zone-c {position: relative !important; top: auto !important; transform: none !important; width: 100% !important; padding-right: 0px !important; padding-top: 40px !important; order: 2}
.featured-grid .vc_grid-item-zone-c-left .vc_gitem-animated-block {width: 100% !important; float: left}
.featured-grid .vc_grid-item .vc_gitem-zone-c .vc_btn3-container {display: none}

.schedule-message {padding-left: 5px}

.vc_grid-filter.vc_grid-filter-color-black {top: 40px}

.single-post .content-main {padding-right: 60px !important}
.backtoblog {right: 3px}

.footer-col:first-of-type {display: none}
.footer-col {width: 33.33% !important}
.footer-copy {font-size: 13px !important}
}



@media screen and (min-width: 851px) and (max-width: 1200px) {
	
	
.experience-text-column {width: 100% !important; order: 2 !important}
.experience-image-column {width: 100% !important}
.experience-section .experience-description {/*max-height: auto !important; position: relative !important; left: 0px; writing-mode: inherit !important; transform: none !important*/; display: none !important}
.experience-section .experience-text-column h3 {margin-bottom: 0px !important}
.experience-section .experience-button {bottom: 48px !important}
	
}


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

.site-logo svg {width: 180px; height: auto}
.alt-logo svg {width: 180px}

.page-template-template-experience .hero-title {bottom: -14px}

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

.section-title {font-size: 23px;}
.service-title {font-size: 23px}
.experience-text-column h3 {font-size: 19px; line-height: 28px;}
.post-title a {font-size: 21px; line-height: 32px}
.featured-grid .post-title a {font-size: 21px; line-height: 32px}
.single-post .entry-title {font-size: 21px; line-height: 32px}
.widget-title {font-size: 21px !important}


.experience-section .experience-button {bottom: 45px !important}
.experience-section .experience-button svg {width: 32px}

.vc_btn3-container.last-btn {display: none !important}

#hero-loader {
    top: 38px; right: 170px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    transition: opacity 0.6s ease;
}

/* Spinner animation */
.spinner {
    width: 32px;
    height: 32px;
    border: 3px solid #fff;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}


/*.wide-section {background: red !important}
.full-mobile-column {width: 100% !important}
.small-section .vc_col-sm-6 {width: 100% !important}
.small-section .vc_col-sm-3 {display: none !important}

.wide-section .vc_col-sm-push-6 {left: 0px !important}
.wide-section .vc_col-sm-pull-6 {right: 0px !important}*/

.vc_grid-filter.vc_grid-filter-color-black {top: 33px}
.blog-page .vc_grid.vc_row.vc_grid-gutter-30px .vc_grid-item {width: 100% !important}

.single-post .content-main {padding-right: 15px !important}
.backtoblog {display: none}


/*.cta-section .vc_col-sm-6 {width: 100% !important}*/
.content-main {width: 100% !important; padding-right: 15px !important}
.content-sidebar {width: 100% !important; padding-left: 15px !important}
.content-sidebar > .vc_column-inner {padding-left: 15px !important}
.content-sidebar > .vc_column-inner > .wpb_wrapper {margin-top: 40px !important}
.content-sidebar > .vc_column-inner > .wpb_wrapper a {display: inline-block}
.wpcf7-form {margin-right: 15px !important; margin-left: 15px !important}

.footer-main {padding-top: 80px; padding-bottom: 20px}

.footer-copy {font-size: 12px !important}
.footer-copy .col-md-6 {width: 100% !important}
.footer-copy .text-left, .footer-copy .text-right {text-align: center !important; line-height: 22px}


}



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

body, .entry-content {font-size: 15px !important; }
.entry-content ul li {font-size: 15px;}
.thirdcol {font-size: 15px;}
.wpcf7-text {font-size: 15px !important;}
.wpcf7-date {font-size: 15px !important;}
.wpcf7-select {font-size: 15px !important;}
.wpcf7-textarea {font-size: 15px !important;}
.forconsent label {font-size: 15px;}
.wpcf7-response-output {font-size: 16px !important;}
.footer {font-size: 15px }
.widget {font-size: 15px !important;}
.contactul li {font-size: 15px;}


.firstcol {width: 150px !important; }
.secondcol {width: calc(100% - 300px) !important; }
.thirdcol {width: 150px !important; }


.nomobile {display: none !important}
.nodesktop {display: block !important}

.home .main {padding-bottom: 40px !important}
.page-template-template-nohero .main {padding-top: 120px !important}
.single-post .main {padding-top: 220px !important}

.hero {height: 600px}
.hero-title {bottom: 95px}

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

.full-mobile-column {width: 100% !important; left: 0px !important; right: 0px !important}
.experience-column {width: 100% !important; border-left: 0px !important; border-right: 0px !important}
.cta-section .vc_col-sm-6 {width: 100% !important}

.page-template-template-experience .hero {margin-bottom: 20px !important}
.page-template-template-experience .hero-title {bottom: -10px}


.wide-section.mobile-section .text-column {padding-top: 0px !important}

.experience-text-column {padding: 35px !important}
.experience-description {left: 30px; max-height: 300px}
.experience-section .experience-button {bottom: 25px !important}
.experience-section .experience-button svg {width: 38px}

.cta-section .text-column {padding-top: 60px !important; padding-bottom: 0px !important}



.scroll-arrow {display: none !important}
.scroll-text {display: none !important}


.vc_grid-filter.vc_grid-filter-color-black {top: 0px; left: 0px; position: relative; margin-bottom: 0px; margin-top: 0px}

.section-title {font-size: 32px;}
.service-title {font-size: 22px}
.experience-text-column h3 {font-size: 22px; line-height: 32px;}
.post-title a {font-size: 22px; line-height: 32px}
.featured-grid .post-title a {font-size: 22px; line-height: 32px}
.single-post .entry-title {font-size: 22px; line-height: 32px}
.widget-title {font-size: 22px !important}


.home .service {display: block !important}


.featured-grid .post-excerpt {margin-bottom: 0px !important}

}




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


.vc_grid-styled-select {width: 100% !important; height: 50px !important; border: 0px !important; padding-right: 0px !important}
.vc_grid-filter-select {margin-bottom: 10px !important}
.vc_grid-filter-select .vc_grid-styled-select select {border: 0px; border: 1px solid var(--grey-color) !important; padding: 0px 20px !important; background-position: 97% center !important; text-transform: uppercase; font-family: 'Satoshi-Medium' !important; font-weight: 400 !important; color: var(--dark-color); height: 48px !important; font-size: 13px !important; letter-spacing: 0.3px !important; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-size: 10px !important; border-radius: 32px !important; background-color: #ffffff !important}

}


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

.firstcol {width: 140px !important; }
.secondcol {width: calc(100% - 280px) !important; }
.thirdcol {width: 140px !important; }


.site-logo svg {width: 170px; height: auto}
.alt-logo svg {width: 170px}
.standout.vc_btn3 {padding-left: 15px !important; padding-right: 15px !important}


.hero-title {bottom: 80px}
.hero-subtitle {bottom: 40px}

#hero-loader {
    top: 37px; right: 155px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    transition: opacity 0.6s ease;
}

/* Spinner animation */
.spinner {
    width: 32px;
    height: 32px;
    border: 3px solid #fff;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}


.experience-text-column {width: 50% !important}
.experience-image-column {width: 50% !important}

.small-section .vc_col-sm-3 {display: none !important}
.small-section .vc_col-sm-6 {width: 100% !important}

.wide-section .text-column {padding-top: 60px !important}
.first-section {padding-top: 20px !important}
.page-template-template-experience .hero {margin-bottom: 0px !important}

.section-title {font-size: 30px}

.experience-description {max-height: 200px}

.footer-main {padding-bottom: 0px !important}
.footer-col:first-of-type {display: block; order: 1}
.footer-col:nth-of-type(2) {order: 3}
.footer-col:nth-of-type(3) {order: 4}
.footer-col:nth-of-type(4) {order: 2}


.footer-col {width: 50% !important}
.footer .widget {margin-bottom: 40px}

}


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

.firstcol {width: 110px !important; }
.secondcol {width: calc(100% - 220px) !important; }
.thirdcol {width: 110px !important; }
.standout.vc_btn3 {display: none}
.scrollActive .standout.vc_btn3 {display: block}

.site-logo svg {width: 160px}
.alt-logo svg {width: 150px}

.mm-listview li a {font-size: 24px; line-height: 30px}

.hero {height: 500px}
.hero-subtitle {left: 50%; transform: translateX(-50%); right: auto !important; font-size: 13px; bottom: 45px; width: 100%; text-align: center !important;}

#hero-loader {
    top: 37px; right: 25px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    transition: opacity 0.6s ease;
}


.page-template-template-experience .hero-title  {left: 50%; transform: translateX(-50%); right: auto !important; width: 100%; text-align: center !important; bottom: 50px; line-height: 1.2;}

.section-title {font-size: 26px}
.section-subtitle {font-size: 13px}
.experience-text-column h3 {font-size: 19px; line-height: 29px}
.post-title a {font-size: 19px; line-height: 29px}
.featured-grid .post-title a {font-size: 19px; line-height: 29px}
.single-post .entry-title {font-size: 19px; line-height: 29px}
.service-title {font-size: 19px}
.widget-title {font-size: 19px !important}
.post-date {font-size: 13px}
.post-category {font-size: 13px}
.single-post .entry-title {margin-bottom: 20px !important}
.single-post .entry-meta {margin-bottom: 20px !important}

.experience-section .experience-button svg {width: 32px}

.schedule-message {top: 10px}
.wpcf7-form p {margin-bottom: 20px}
.wpcf7-text, .wpcf7-date, .wpcf7-select {height: 50px;}
}


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

.mast-head-wrap {padding: 30px 10px !important}
.scrollActive .mast-head-wrap {padding: 15px 10px !important}

.firstcol {width: 105px !important; }
.secondcol {width: calc(100% - 210px) !important; }
.thirdcol {width: 105px !important; }

.site-logo svg {width: 140px}
.alt-logo svg {width: 120px}
.footer .widget_media_image {margin-top: -11px}
.footer .widget_media_image svg {width: 150px}

.hero {height: 450px}

.standout.vc_btn3 {padding-left: 12px !important; padding-right: 12px !important}

.experience-text-column {padding: 25px !important}
.experience-text-column h3 {font-size: 17px; line-height: 26px}
.experience-description {left: 20px; bottom: -5px;}
.experience-section .experience-button {bottom: 15px !important; right: 30px}

.vc_btn3 {padding-top: 8px !important; padding-bottom: 9px !important}
.wpcf7-submit {padding: 8px 20px !important}
.scrollActive .standout.vc_btn3 {top: -1px}

.privacy-policy h2 {font-size: 20px;}
.privacy-policy h3 {font-size: 18px;}

}


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


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


.hero {height: 400px}
.section-title {font-size: 24px}
.experience-text-column h3 {font-size: 15px; line-height: 24px}
.experience-description {max-height: 150px; font-size: 13px}
.experience-section .experience-button svg {width: 26px}

.wpls-fix-box {padding-left: 60px; padding-right: 60px}

.footer-col:first-of-type {display: none;}
.footer-col:nth-of-type(2) {order: 2}
.footer-col:nth-of-type(3) {order: 3}
.footer-col:nth-of-type(4) {order: 4}


.footer-col {width: 100% !important}
.footer .widget {margin-bottom: 40px}

}

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

.experience-text-column h3 {font-size: 14px; line-height: 23px}

.experience-description {display: none}


.site-logo svg {width: 120px}
.alt-logo svg {width: 100px}

}


@media (max-height: 640px) and (orientation: landscape) {
	
.mm-listview li.menu-button {position: relative !important; bottom: 20px !important; margin-top: 30px !important}

}