
@media (max-width: 1500px) {
    .hub .hub-item {width: 360px; margin: 0 20px;}
    .hub .hub-item .image-holder {height: 360px;}
    .hub .hub-item .section-label {height: 60px; line-height: 60px;}
    .hub .hub-item .item-nav a {padding: 20px 0 20px 30px;}
}

@media (max-width: 1400px) {
    .hub .hub-item {width: 300px;}
    .hub .hub-item .image-holder {height: 300px;}
    .hub .hub-item .item-nav a {padding: 15px 0 15px 30px;}
}

/* md */
@media (max-width: 1200px) {
    
    .page-content {padding-top: 35px;}
    
    .section {padding: 35px 0;}
    .section.text-cols {padding: 35px 0;}
    
    .hub .hub-item {margin: 0 10px;}
    
    .section.text-image h2, 
    .section.image-text h2 {margin: 25px 0;}
    
    .section.text-image .section-label, 
    .section.image-text .section-label {margin-top: 0;}
    
    .section.text-image .btn-holder, 
    .section.image-text .btn-holder {text-align: center; margin-bottom: 30px;}
    
    .section.full-image h2 {height: 100px; line-height: 100px; min-width: 250px; width: auto; padding: 0 50px;}
    
    .text-image .sqr-btn, .image-text .sqr-btn {width: 100%;}
    .text-image .sqr-btn.text:hover, .image-text .sqr-btn.text:hover {width: 100%;}
    .text-image .sqr-btn.text:not(.open):hover > span, .image-text .sqr-btn.text:not(.open):hover > span {padding: 0 100px 0 0;}
    
    .contact-form-cta-holder {padding: 75px 0 100px;;}
    
    .sqr-btn {width: auto;}
    .sqr-btn:not(.dark), .sqr-btn:not(.dark):hover, .sqr-btn:not(.dark):focus {color: #1e1e1e;}
    .sqr-btn > span > span {padding-left: 30px;}
    .sqr-btn.text:not(.open):hover > span {padding: 0 100px 0 0;}
    
    footer .footer-info {padding: 25px 0 50px;}
}

/* sm */
@media (max-width: 992px) {
    
    header .mainLogo {margin-top: 10px;}
    header .mainLogo img {width: 140px;}
    header nav {height: 75px;}
    header nav a {margin: 0 25px; line-height: 75px;}
    header nav .lang-btn {width: 75px; height: 75px; line-height: 75px;}
    header nav a:not(.lang-btn)::after {bottom: 20px;}
    
    .home h1, .subheader h1 {
        font-size: 36px;
        margin-bottom: 30px;
    }
    
    .home {height: 600px;}
    .home .animation {display: none;}
    
/*    .section.text-image .img-holder, 
    .section.image-text .img-holder,
    .section.full-image .img-holder {padding: 0;}*/
    
    .hub {height: auto; padding: 150px 0 50px;}
    .hub .hub-item {margin: 0 60px 40px; width: 300px;}
    .hub .hub-item .image-holder {height: 300px;}
    
    .contact-form-cta {width: 100%; padding: 0;}
    .contact-form-cta .sqr-btn {right: 0;}
    .checkbox .checkmark {top: 0;}
    
    footer .logo img {margin-bottom: 50px;}
    footer nav.desktop {display: none;}
    footer .separator {padding-top: 20px; padding-bottom: 20px;}
    footer .credits {text-align: left;}
    
    .cookies-message {height: auto;}
    .cookies-message p {font-size: 18px; line-height: normal; padding-top: 20px;}
    .cookies-message .buttons-area {text-align: center;}
    .cookies-message .cm-btn {width: 100px; height: 40px; line-height: 40px;}
}

/* xs */
@media (max-width: 768px) {
    
    .home {height: 100%;}

    .section.text-image p,
    .section.image-text p {
        margin-bottom: 25px;
    }
    
    .section.text-image p:last-of-type,
    .section.image-text p:last-of-type {
        margin-bottom: 25px;
    }
    
    .section {padding: 50px 0;}
    .section.full-image h2 {padding: 10px 40px; line-height: normal; width: auto; height: auto; font-size: 34px;}
    
    /*.checkbox .checkmark {top: 15px;}*/
    
    footer .separator a {margin-top: 10px; display: inline-block;}
    
}

@media (max-width: 700px) {
    
    header {padding: 15px 0; height: 75px;}
    header .mainLogo img {width: 125px;}
    header .mobileMenu {display: block;}
    header .mainLogo {margin-top: 0;}
    header nav {display: none; position: fixed; top: 75px; left: 0; width: 100%; height: 100%; top: 75px; background-color: #f9f9f9; border-top: 1px solid #8e8e8e;padding: 40px 25px 0;}
    header nav a {display: block; line-height: normal; margin: 0; padding: 20px 0; font-weight: 900; transform: none !important; -webkit-transform: none !important; opacity: 1 !important;}
    header nav a:first-child {padding-top: 0;}
    header nav a.active:after {display: none;}
    header nav a:not(.lang-btn):after {bottom: 8px;}
    header nav a, header nav a:hover, header nav a:focus {color: #1e1e1e !important;}
    header nav .subnav {display: block; padding-left: 55px;}
    header nav .subnav a {display: block; font-weight: 300; padding: 15px 0;}
    header nav .subnav a:after {bottom: auto; top: calc(50% - 1px); left: -35px; width: 25px;}
    header nav .subnav a, header nav .subnav a:hover, header nav .subnav a:focus {color: #8e8e8e !important;}
    header nav .lang-btn {display: none;}
    header nav .lang-btn-mobile {display: block;}
    
    .hub .hub-item {margin-left: 0; margin-right: 0; width: 260px;}
    .hub .hub-item .image-holder {height: 260px;}
    
    footer .nav .vp-link {display: inline-block;}
    
}

@media only screen 
    and (max-device-width: 667px) 
    and (-webkit-min-device-pixel-ratio: 2)
    and (orientation: landscape) {
    
    .text-image .sqr-btn, .image-text .sqr-btn {width: auto;}
    .text-image .sqr-btn.text:hover, .image-text .sqr-btn.text:hover {width: auto;}
    .text-image .sqr-btn.text:not(.open):hover > span, .image-text .sqr-btn.text:not(.open):hover > span {padding: 0 100px 0 0;}

}

@media (max-width: 460px) {
    
    
    
}