/* ========================================================================== Table of content: 1. Basics 2. Helpers 2.1. Border radius 2.2. Width & height 2.3. Z-index 2.4. Background cover 2.5. Display settings 2.6. Paddings & margins 2.7. Positions 2.8. Borders 2.9. Parallax background 2.10. Video background 3. Container width 4. Flex grid 4.1. Flex column margins 5. Min-height flex center 6. Lines settings 7. Animsition preloader 7.1. Preloader in/out 7.2. Preloader loading logo box 7.3. Preloader pulse animation 8. Custom mouse cursor 9. Header 9.1. Header logo 9.2. Navigation open button 9.3. Navigation close button 9.4. Header social buttons 9.5. Header contact 9.6. Headroom 10. Navigation 10.1. Navigation menu box 10.2. Navigation buttons 10.2.1. Navigation active buttons 10.2.2. Navigation active page out buttons 10.2.3. Navigation buttons style 10.2.4. Navigation buttons hover effect 10.3. Navigation drop down 10.3.1. Navigation drop down close button 10.3.2. Navigation drop down menu 10.4. Navigation slider 10.4.1. Navigation slider background 10.4.2. Navigation slider background overlay 10.4.3. Navigation slider controls 10.4.4. Navigation slider buttons delays 10.5. Navigation information 10.5.1. Navigation information animations 10.6. Landing navigation 11. Footer 11.1. Footer logo 11.2. Footer title & navigation 11.3. Footer information 11.4. Footer social 11.5. Footer copyright 12. Magnific popup 12.1. Popup counter 12.2. Popup close button 13. Swiper & popup arrows 13.1. Popup arrows 13.2. Swiper arrows 13.3. Swiper & popup arrows animations 14. Swiper pagination 14.1. Dynamic pagination 14.2. Counter pagination 14.2.1. Counter pagination vertical 14.3. Dots pagination 14.3.1. Dots pagination vertical 15. Swiper sliders 16. Scroll to buttons 16.1. To top button 16.2. Scroll down button 17. Buttons 17.1. Skew button 17.2. Overlay button 17.3. Background button 17.4. Border button 17.5. Icon overlay button 17.6. Icon shadow button 17.7. Fill button 17.8. Flip button 17.9. Ellipse button 17.10. Play button 18. Typography 18.1. Headline 18.2. Subhead 18.3. Body text 18.4. Copyright 18.5. Quote 18.6. Vertical text 18.7. Description 18.8. Fontawesome icon 19. Animations 19.1. Animation delays 19.2. Image scale animation 19.3. Image reveal animation 19.4. Text reveal animation 19.5. Fade animation 19.6. Slide animation 19.7. Text fill animation 19.8. Overlay animation 19.9. Reveal animation 19.10. Text double fill animation 19.11. Progress bar 19.12. Border animations 19.12.1. Border left animation 19.12.2. Border right animation 19.12.3. Border top animation 19.12.4. Border bottom animation 20. Content hover effects 20.1. Content hover delays 20.2. Fade hover 20.3. Slide hover 20.4. Text fill hover 20.5. Reveal hover 20.6. Move hover 21. Image hover effects 21.1. Image hover opacity 21.2. Image hover scale 21.3. Image hover overlay 22. Forms 22.1. Form placeholder 22.2. Input default 22.3. Input with border 22.4. Search form 23. Post comments 24. List styles 24.1. List item 24.1.1. List item margins 24.1.2. List item icons 24.2. List counter 25. Isotope grid 26. Accordion 26.1. Accordion button 26.2. Accordion button icon 26.3. Accordion underline 26.4. Accordion left/right borders 27. Typewriter 28. Particles 29. Background overlay 30. Avatars & Logos 30.1. Awards logo 30.2. Testimonials author 30.3. Author avatar 30.4. Clients logo 30.4.1. Clients logo animation 30.4.2. Clients logo with lines 30.4.3. Clients logo with borders 31. Contact form 32. Colors 32.1. Background colors 32.2. Text colors 32.3. Text hover colors 32.4. Main colors ========================================================================== */
/* ========================================================================== 1. Basics ========================================================================== */
 @font-face {
     font-family: Font Awesome;
     src: url('../webfonts/fa-brands-400.ttf') format('truetype'), url('../webfonts/fa-brands-400.woff') format('woff'), url('../webfonts/fa-brands-400.woff2') format('woff2'), url('../webfonts/fa-brands-400.svg') format('svg'), url('../webfonts/fa-brands-400.eot');
}
 @font-face {
     font-family: Font Awesome;
     src: url('../webfonts/fa-regular-400.ttf') format('truetype'), url('../webfonts/fa-regular-400.woff') format('woff'), url('../webfonts/fa-regular-400.woff2') format('woff2'), url('../webfonts/fa-regular-400.svg') format('svg'), url('../webfonts/fa-regular-400.eot');
}
 @font-face {
     font-family: Font Awesome;
     src: url('../webfonts/fa-solid-900.ttf') format('truetype'), url('../webfonts/fa-solid-900.woff') format('woff'), url('../webfonts/fa-solid-900.woff2') format('woff2'), url('../webfonts/fa-solid-900.svg') format('svg'), url('../webfonts/fa-solid-900.eot');
}
 html {
     margin: 0;
     padding: 0;
}
 blockquote, ul, ol {
     margin: 0;
     padding: 0;
}
 ul li, ol li {
     margin-bottom: 0;
}
 li {
     margin: 0;
     padding: 0;
     list-style: none;
}
 img {
     width: 100%;
     max-width: 100%;
     vertical-align: middle;
}
 a, i {
     border: none;
}
 button {
     padding: 0;
}
 a {
     color: inherit;
}
 a:hover {
     text-decoration: none;
}
 button, button:focus, button:hover {
     border: none;
     background: none;
}
 a:focus, button:focus {
     outline: none;
}
 table {
     border-spacing: 0;
     border-collapse: collapse;
}
 td, th {
     border: 1px solid rgba(250, 250, 250, .1);
     padding: 10px 15px;
     font-size: 16px;
     line-height: 1.3;
     font-weight: 200;
     text-align: center;
}
 th {
     font-weight: 400;
     font-size: 18px;
}
 code, pre {
     overflow-x: scroll;
     padding: 10px;
     padding-bottom: 0;
     border-left: 3px solid #6FBF71;
     border-bottom: 1px solid transparent;
}
 pre {
     display: block;
     word-break: break-all;
     word-wrap: break-word;
}
 pre code {
     white-space: pre-wrap;
}
/* ========================================================================== 2. Helpers ========================================================================== */
 .hidden-box {
     overflow: hidden;
}
/* 2.1. Border radius ========================================================================== */
 .border-radius-50perc {
     border-radius: 50%;
}
 .border-radius-10px {
     border-radius: 10px;
}
/* 2.2. Width & height ========================================================================== */
 .width-100perc {
     width: 100%;
}
 .height-100perc {
     height: 100%;
}
 .height-100vh {
     height: 100vh;
}
/* 2.3. Z-index ========================================================================== */
 .zindex5 {
     z-index: 5;
}
/* 2.4. Background cover ========================================================================== */
 .bg-img-cover, .bg-img-cover-fixed {
     background-size: cover;
     background-position: center center;
     background-repeat: no-repeat;
}
 .js-no-touch .bg-img-cover-fixed {
     background-attachment: fixed;
}
/* 2.5. Display settings ========================================================================== */
 .d-inline-block {
     display: inline-block;
}
 .d-block {
     display: block;
}
 .d-flex {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
}
 .flex-center-center {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
}
 .flex-align-center {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
}
 .flex-align-end {
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: flex-end;
}
 .flex-justify-center {
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
}
/* 2.6. Paddings & margins ========================================================================== */
/* Paddings */
 .padding-top-bottom-150 {
     padding-top: 150px;
     padding-bottom: 150px;
}
 .padding-top-150 {
     padding-top: 150px;
}
 .padding-bottom-150 {
     padding-bottom: 150px;
}
 .padding-top-bottom-120 {
     padding-top: 120px;
     padding-bottom: 120px;
}
 .padding-top-120 {
     padding-top: 120px;
}
 .padding-bottom-120 {
     padding-bottom: 120px;
}
 .padding-top-bottom-100 {
     padding-top: 100px;
     padding-bottom: 100px;
}
 .padding-top-100 {
     padding-top: 100px;
}
 .padding-bottom-100 {
     padding-bottom: 100px;
}
 .padding-top-bottom-90 {
     padding-top: 90px;
     padding-bottom: 90px;
}
 .padding-top-90 {
     padding-top: 90px;
}
 .padding-bottom-90 {
     padding-bottom: 90px;
}
 .padding-top-bottom-80 {
     padding-top: 80px;
     padding-bottom: 80px;
}
 .padding-top-80 {
     padding-top: 80px;
}
 .padding-bottom-80 {
     padding-bottom: 80px;
}
 .padding-top-bottom-70 {
     padding-top: 70px;
     padding-bottom: 70px;
}
 .padding-top-70 {
     padding-top: 70px;
}
 .padding-bottom-70 {
     padding-bottom: 70px;
}
 .padding-top-bottom-60 {
     padding-top: 60px;
     padding-bottom: 60px;
}
 .padding-top-60 {
     padding-top: 60px;
}
 .padding-bottom-60 {
     padding-bottom: 60px;
}
 .padding-top-bottom-50 {
     padding-top: 50px;
     padding-bottom: 50px;
}
 .padding-top-50 {
     padding-top: 50px;
}
 .padding-bottom-50 {
     padding-bottom: 50px;
}
 .padding-top-bottom-40 {
     padding-top: 40px;
     padding-bottom: 40px;
}
 .padding-top-40 {
     padding-top: 40px;
}
 .padding-bottom-40 {
     padding-bottom: 40px;
}
 .padding-top-bottom-30 {
     padding-top: 30px;
     padding-bottom: 30px;
}
 .padding-top-30 {
     padding-top: 50px;
}
 .padding-bottom-30 {
     padding-bottom: 30px;
}
 .padding-top-bottom-20 {
     padding-top: 20px;
     padding-bottom: 20px;
}
 .padding-top-20 {
     padding-top: 20px;
}
 .padding-bottom-20 {
     padding-bottom: 20px;
}
 .padding-top-bottom-10 {
     padding-top: 10px;
     padding-bottom: 10px;
}
 .padding-top-10 {
     padding-top: 10px;
}
 .padding-bottom-10 {
     padding-bottom: 10px;
}
 .padding-top-bottom-5 {
     padding-top: 5px;
     padding-bottom: 5px;
}
 .padding-top-5 {
     padding-top: 5px;
}
 .padding-bottom-5 {
     padding-bottom: 5px;
}
 .padding-top-bottom-1 {
     padding-top: 1px;
     padding-bottom: 1px;
}
 .padding-top-1 {
     padding-top: 1px;
}
 .padding-bottom-1 {
     padding-bottom: 1px;
}
 .padding-left-right-50 {
     padding-left: 50px;
     padding-right: 50px;
}
 .padding-left-50 {
     padding-left: 50px;
}
 .padding-right-50 {
     padding-right: 50px;
}
 .padding-left-right-40 {
     padding-left: 40px;
     padding-right: 40px;
}
 .padding-left-40 {
     padding-left: 40px;
}
 .padding-right-40 {
     padding-right: 40px;
}
 .padding-left-right-30 {
     padding-left: 30px;
     padding-right: 30px;
}
 .padding-left-30 {
     padding-left: 30px;
}
 .padding-right-30 {
     padding-right: 30px;
}
 .padding-left-right-20 {
     padding-left: 10px;
     padding-right: 10px;
}
 .padding-left-20 {
     padding-left: 20px;
}
 .padding-right-20 {
     padding-right: 20px;
}
 .padding-20 {
     padding: 20px;
}
/* Margins */
 .margin-top-bottom-60 {
     margin-top: 60px;
     margin-bottom: 60px;
}
 .margin-top-60 {
     margin-top: 60px;
}
 .margin-bottom-60 {
     margin-bottom: 60px;
}
 .margin-top-bottom-50 {
     margin-top: 50px;
     margin-bottom: 50px;
}
 .margin-top-50 {
     margin-top: 50px;
}
 .margin-bottom-50 {
     margin-bottom: 50px;
}
 .margin-top-bottom-40 {
     margin-top: 40px;
     margin-bottom: 40px;
}
 .margin-top-40 {
     margin-top: 40px;
}
 .margin-bottom-40 {
     margin-bottom: 40px;
}
 .margin-top-bottom-30 {
     margin-top: 30px;
     margin-bottom: 30px;
}
 .margin-top-30 {
     margin-top: 30px;
}
 .margin-bottom-30 {
     margin-bottom: 30px;
}
 .margin-top-bottom-20 {
     margin-top: 20px;
     margin-bottom: 20px;
}
 .margin-top-20 {
     margin-top: 20px;
}
 .margin-bottom-20 {
     margin-bottom: 20px;
}
 .margin-top-bottom-10 {
     margin-top: 10px;
     margin-bottom: 10px;
}
 .margin-top-10 {
     margin-top: 10px;
}
 .margin-bottom-10 {
     margin-bottom: 10px;
}
 .margin-top-bottom-5 {
     margin-top: 5px;
     margin-bottom: 5px;
}
 .margin-top-5 {
     margin-top: 5px;
}
 .margin-bottom-5 {
     margin-bottom: 5px;
}
 .margin-top-bottom-1 {
     margin-top: 1px;
     margin-bottom: 1px;
}
 .margin-top-1 {
     margin-top: 1px;
}
 .margin-bottom-1 {
     margin-bottom: 1px;
}
 .margin-left-right-50 {
     margin-left: 50px;
     margin-right: 50px;
}
 .margin-left-50 {
     margin-left: 50px;
}
 .margin-right-50 {
     margin-right: 50px;
}
 .margin-left-right-40 {
     margin-left: 40px;
     margin-right: 40px;
}
 .margin-left-40 {
     margin-left: 40px;
}
 .margin-right-40 {
     margin-right: 40px;
}
 .margin-left-right-30 {
     margin-left: 30px;
     margin-right: 30px;
}
 .margin-left-30 {
     margin-left: 30px;
}
 .margin-right-30 {
     margin-right: 30px;
}
 .margin-left-right-20 {
     margin-left: 10px;
     margin-right: 10px;
}
 .margin-left-20 {
     margin-left: 20px;
}
 .margin-right-20 {
     margin-right: 20px;
}
 .margin-left-right-10 {
     margin-left: 10px;
     margin-right: 10px;
}
 .margin-left-10 {
     margin-left: 10px;
}
 .margin-right-10 {
     margin-right: 10px;
}
 .margin-20 {
     margin: 20px;
}
/* price top offset */
 .price-top-offset {
     margin-top: 20px;
}
 .price-btn-offset {
     padding: 50px 0;
}
 @media only screen and (max-width: 767px) {
     .price-top-offset {
         margin-top: 0;
    }
     .price-btn-offset {
         padding: 0 0 50px 0;
    }
}
/* portfolio top offset */
 .portfolio-top-offset {
     margin-top: 120px;
}
 @media only screen and (max-width: 767px) {
     .portfolio-top-offset {
         margin-top: 0;
    }
}
/* 2.7. Positions ========================================================================== */
 .pos-rel {
     position: relative;
}
 .pos-abs {
     position: absolute;
}
 .pos-static {
     position: static !important;
}
 .pos-left-top {
     left: 20px;
     top: 20px;
}
 .pos-left-center {
     left: 20px;
     top: 50%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .pos-left-bottom {
     right: 100px;
     bottom: 30px;
}
 .pos-right-top {
     top: 20px;
     right: 20px;
}
 .pos-right-center {
     top: 50%;
     right: 20px;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .pos-right-bottom {
     right: 20px;
     bottom: 20px;
}
 .pos-top-center {
     left: 50%;
     top: 20px;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
 .pos-bottom-center {
     left: 50%;
     bottom: 20px;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
 .pos-center-center {
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
}
/* Positions 0px */
 .pos-left-top-0px {
     left: 0;
     top: 0;
}
 .pos-left-center-0px {
     left: 0;
     top: 50%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .pos-left-bottom-0px {
     left: 0;
     bottom: 0;
}
 .pos-right-top-0px {
     top: 0;
     right: 0;
}
 .pos-right-center-0px {
     top: 50%;
     right: 0;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .pos-right-bottom-0px {
     right: 0;
     bottom: 0;
}
 .pos-top-center-0px {
     left: 50%;
     top: 0;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
 .pos-bottom-center-0px {
     left: 50%;
     bottom: 0;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
/* 2.8. Borders ========================================================================== */
 .border-box {
     position: relative;
     z-index: 5;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     border: 1px solid rgba(250, 250, 250, .1);
}
 .border-box.black {
     border: 1px solid rgba(0, 0, 0, .1);
}
 .border-box-bottom {
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     border-bottom: 1px solid rgba(250, 250, 250, .1);
}
 .border-box-bottom.black {
     border-bottom: 1px solid rgba(0, 0, 0, .1);
}
 .border-box-l-r {
     z-index: 6;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     border-left: 1px solid #fff;
     border-right: 1px solid #fff;
}
 .border-box-l-r.black {
     border-left: 1px solid #000;
     border-right: 1px solid #000;
}
/* 2.9. Parallax background ========================================================================== */
 .js-parallax-bg {
     background-size: cover;
     background-position: left center;
     background-repeat: no-repeat;
     -webkit-transition: initial;
     -o-transition: initial;
     transition: initial;
}
/* 2.10. Video background ========================================================================== */
 .video-bg {
     min-width: 100%;
     min-height: 100%;
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
}
/* ========================================================================== 3. Container width ========================================================================== */
 .container {
     width: calc(100% - 80px);
     max-width: 1350px;
     margin-left: auto;
     margin-right: auto;
}
 .container.full {
     max-width: 100%;
}
 .container.small {
     max-width: 1100px;
}
 .container-fuild{
     width: 100%;
     max-width: 1680px;
     margin-left: auto;
     margin-right: auto;
}
 @media only screen and (max-width: 999px) {
     .container {
         width: calc(100% - 40px);
    }
}
 @media only screen and (max-width: 549px) {
     .container {
         width: calc(100% - 20px);
    }
}
/* ========================================================================== 4. Flex grid ========================================================================== */
 .flex-container {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-flow: wrap;
     flex-flow: wrap;
}
 .flex-container.reverse {
     -webkit-box-orient: vertical;
     -webkit-box-direction: reverse;
     -ms-flex-flow: wrap-reverse;
     flex-flow: wrap-reverse;
}
 .one-column, .two-columns, .three-columns, .four-columns, .five-columns, .six-columns, .seven-columns, .eight-columns, .nine-columns, .ten-columns, .eleven-columns, .twelve-columns {
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}
 .one-column {
     -ms-flex-preferred-size: 8.33%;
     flex-basis: 8.33%;
}
 .two-columns {
     -ms-flex-preferred-size: 16.66%;
     flex-basis: 16.66%;
}
 .three-columns {
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
}
 .four-columns {
     -ms-flex-preferred-size: 33.33%;
     flex-basis: 33.33%;
}
 .five-columns {
     -ms-flex-preferred-size: 41.66%;
     flex-basis: 41.66%;
}
 .six-columns {
     -ms-flex-preferred-size: 50%;
     flex-basis: 50%;
}
 .seven-columns {
     -ms-flex-preferred-size: 58.33%;
     flex-basis: 58.33%;
}
 .eight-columns {
     -ms-flex-preferred-size: 66.66%;
     flex-basis: 66.66%;
}
 .nine-columns {
     -ms-flex-preferred-size: 75%;
     flex-basis: 75%;
}
 .ten-columns {
     -ms-flex-preferred-size: 83.33%;
     flex-basis: 83.33%;
}
 .eleven-columns {
     -ms-flex-preferred-size: 91.66%;
     flex-basis: 91.66%;
}
 .twelve-columns {
     -ms-flex-preferred-size: 100%;
     flex-basis: 100%;
}
 .one-offset {
     margin-left: 8.33%;
}
 .two-offset {
     margin-left: 16.66%;
}
 .three-offset {
     margin-left: 25%;
}
 .four-offset {
     margin-left: 33.33%;
}
 .five-offset {
     margin-left: 41.66%;
}
 .six-offset {
     margin-left: 50%;
}
 .seven-offset {
     margin-left: 58.33%;
}
 .eight-offset {
     margin-left: 66.66%;
}
 .nine-offset {
     margin-left: 75%;
}
 .ten-offset {
     margin-left: 83.33%;
}
 .eleven-offset {
     margin-left: 91.66%;
}
 @media only screen and (max-width: 999px) {
     .column-100-100 {
         -ms-flex-preferred-size: 100% !important;
         flex-basis: 100% !important;
         margin-left: 0 !important;
    }
     .column-50-100 {
         -ms-flex-preferred-size: 50% !important;
         flex-basis: 50% !important;
         margin-left: 0 !important;
    }
}
 @media only screen and (max-width: 767px) {
     .one-column, .two-columns, .three-columns, .four-columns, .five-columns, .six-columns, .seven-columns, .eight-columns, .nine-columns, .ten-columns, .eleven-columns, .twelve-columns {
         -ms-flex-preferred-size: 100%;
         flex-basis: 100%;
    }
     .one-offset, .two-offset, .three-offset, .four-offset, .five-offset, .six-offset, .seven-offset, .eight-offset, .nine-offset, .ten-offset, .eleven-offset {
         margin-left: 0;
    }
     .column-50-100 {
         -ms-flex-preferred-size: 100% !important;
         flex-basis: 100% !important;
    }
}
/* 4.1. Flex column margins ========================================================================== */
 .column-l-r-margin-40 {
     margin-left: 40px;
     margin-right: 40px;
}
 .column-r-margin-40 {
     margin-right: 40px;
}
 .column-l-margin-40 {
     margin-left: 40px;
}
 .column-l-r-margin-20 {
     margin-left: 20px;
     margin-right: 20px;
}
 .column-r-margin-20 {
     margin-right: 20px;
}
 .column-l-margin-20 {
     margin-left: 20px;
}
 .column-l-r-margin-10 {
     margin-left: 10px;
     margin-right: 10px;
}
 .column-r-margin-10 {
     margin-right: 10px;
}
 .column-l-margin-10 {
     margin-left: 10px;
}
 .column-l-r-margin-5 {
     margin-left: 5px;
     margin-right: 5px;
}
 .column-r-margin-5 {
     margin-right: 5px;
}
 .column-l-margin-5 {
     margin-left: 5px;
}
 .line-col-r-margin-20 {
     margin-right: 20px;
}
 .line-col-l-r-margin-20 {
     margin-left: 20px;
     margin-right: 20px;
}
 .column-l-margin-40-999 {
     margin-left: 40px;
}
 .column-r-margin-40-999 {
     margin-right: 40px;
}
 .column-l-margin-20-999 {
     margin-left: 20px;
}
 .column-r-margin-20-999 {
     margin-right: 20px;
}
 .column-l-r-margin-10-999 {
     margin-left: 10px;
     margin-right: 10px;
}
 @media only screen and (max-width: 999px) {
     .column-l-margin-40-999 {
         margin-left: 0;
    }
     .column-r-margin-40-999 {
         margin-right: 0;
    }
     .column-l-margin-20-999 {
         margin-left: 0;
    }
     .column-r-margin-20-999 {
         margin-right: 0;
    }
     .column-l-r-margin-10-999 {
         margin-left: 10px;
         margin-right: 10px;
    }
}
 @media only screen and (max-width: 767px) {
     .column-l-r-margin-40, .column-l-r-margin-20, .column-l-r-margin-10, .column-l-r-margin-5 {
         margin-left: 0;
         margin-right: 0;
    }
     .column-r-margin-40, .column-r-margin-20, .column-r-margin-10, .column-r-margin-5 {
         margin-right: 0;
    }
     .column-l-margin-40, .column-l-margin-20, .column-l-margin-10, .column-l-margin-5 {
         margin-left: 0;
    }
     .line-col-r-margin-20 {
         margin-right: 0;
    }
     .line-col-l-r-margin-20 {
         margin-left: 0;
         margin-right: 0;
    }
     .lines-section .line-col-r-margin-20 {
         margin-right: 20px;
    }
     .lines-section .line-col-l-r-margin-20 {
         margin-left: 20px;
         margin-right: 20px;
    }
}
 @media only screen and (max-width: 549px) {
     .lines-section .line-col-r-margin-20 {
         margin-right: 0;
    }
     .lines-section .line-col-l-r-margin-20 {
         margin-left: 0;
         margin-right: 0;
    }
}
/* ========================================================================== 5. Min-height flex center ========================================================================== */
 .flex-min-height-100vh {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     width: 100%;
     height: 100%;
     min-height: 100vh;
}
/* ========================================================================== 6. Lines settings ========================================================================== */
 .lines-section {
     width: 100%;
     position: relative;
}
 .lines-container {
     width: 100%;
     height: 100%;
     margin: 0 auto;
     position: relative;
}
 .lines-section .lines-container {
     width: calc(100% - 120px);
}
 .lines-pos-abs.lines-container {
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     z-index: 4;
     pointer-events: none;
}
 .lines-section:before, .lines-section:after, .lines-container:before, .lines-container:after {
     content: '';
     width: 1px;
     height: 100%;
     position: absolute;
     left: 60px;
     top: 0;
     z-index: 4;
     background-color: rgba(250, 250, 250, .1);
}
 .lines-section:after {
     left: auto;
     right: 60px;
}
 .lines-container:before {
     left: 33.33%;
}
 .lines-container:after {
     left: 66.66%;
}
 .black-lines.lines-section:before, .black-lines.lines-section:after, .black-lines.lines-container:before, .black-lines.lines-container:after {
     background-color: rgba(0, 0, 0, .1);
}
 .anim-lines.lines-section:before, .anim-lines.lines-section:after, .anim-lines.lines-container:before, .anim-lines.lines-container:after {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .anim-lines.lines-container:before {
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .anim-lines.lines-container:after {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
 .anim-lines.lines-section:after {
     -webkit-transition-delay: .6s;
     -o-transition-delay: .6s;
     transition-delay: .6s;
}
 .js-page-in-anim-active .anim-lines.lines-section:before, .js-page-in-anim-active .anim-lines.lines-section:after, .js-page-in-anim-active .anim-lines.lines-container:before, .js-page-in-anim-active .anim-lines.lines-container:after {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
 .nav-container.lines-section:before, .nav-container.lines-section:after, .nav-container .lines-container:before, .nav-container .lines-container:after {
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-nav-active.js-page-out .nav-container.lines-section:before, .js-nav-active.js-page-out .nav-container.lines-section:after, .js-nav-active.js-page-out .nav-container .lines-container:before, .js-nav-active.js-page-out .nav-container .lines-container:after {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 .no-lines.lines-container:before, .no-lines.lines-container:after, .internal-lines-disable .lines-container:before, .internal-lines-disable .lines-container:after, .header-lines-disable .lines-section:before, .header-lines-disable .lines-section:after {
     content: normal;
}
 @media only screen and (max-width: 999px) {
     .lines-container:before {
         left: 50%;
    }
     .lines-container:after {
         content: normal;
    }
     .anim-lines.lines-section:after {
         -webkit-transition-delay: .4s;
         -o-transition-delay: .4s;
         transition-delay: .4s;
    }
}
 @media only screen and (max-width: 767px) {
     .lines-container {
         width: calc(100% - 20px);
    }
     .lines-container:before {
         content: normal;
    }
     .anim-lines.lines-section:after {
         -webkit-transition-delay: .2s;
         -o-transition-delay: .2s;
         transition-delay: .2s;
    }
}
 @media only screen and (max-width: 549px) {
     .lines-section .lines-container {
         width: calc(100% - 20px);
    }
     .lines-section:before, .lines-section:after {
         content: normal;
    }
}
/* ========================================================================== 7. Animsition preloader ========================================================================== */
 .preloader {
     overflow: hidden;
}
 .preloader.js-page-in {
     overflow: visible;
     overflow-x: hidden;
}
 .js-animsition-overlay {
     overflow: hidden;
     position: relative;
     z-index: 2;
     opacity: 1;
}
 .js-animsition-overlay-slide {
     background-color: transparent;
}
/* 7.1. Preloader in/out ========================================================================== */
 .preloader:before, .preloader:after {
     content: '';
     width: 100%;
     height: 100%;
     position: fixed;
     left: 0;
     top: 0;
     z-index: 99;
     pointer-events: none;
     background-color: #111517;
}
 .preloader:before {
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
     -webkit-transition: 1s cubic-bezier(.858, .01, .068, .99);
     -o-transition: 1s cubic-bezier(.858, .01, .068, .99);
     transition: 1s cubic-bezier(.858, .01, .068, .99);
}
 .preloader:after {
     opacity: 0;
     -webkit-transition: 1s cubic-bezier(.76, .06, .85, .07);
     -o-transition: 1s cubic-bezier(.76, .06, .85, .07);
     transition: 1s cubic-bezier(.76, .06, .85, .07);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .dark-nav.preloader:after {
     z-index: 8;
}
 .js-nav-active.preloader:after {
     -webkit-transition: .5s cubic-bezier(.76, .06, .85, .07);
     -o-transition: .5s cubic-bezier(.76, .06, .85, .07);
     transition: .5s cubic-bezier(.76, .06, .85, .07);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-page-in.preloader:before {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 .js-page-out.preloader:after {
     opacity: 1;
}
/* 7.2. Preloader loading logo box ========================================================================== */
 .preloader__logoload-box {
     width: 100px;
     height: 100px;
     position: fixed;
     left: calc(50% - 50px);
     top: calc(50% - 50px);
     z-index: 999;
     pointer-events: none;
     -webkit-transition: .5s cubic-bezier(.76, .06, .85, .07);
     -o-transition: .5s cubic-bezier(.76, .06, .85, .07);
     transition: .5s cubic-bezier(.76, .06, .85, .07);
}
 .js-page-in .preloader__logoload-box {
     opacity: 0;
}
 body.js-page-in.js-page-out .preloader__logoload-box {
     opacity: 1;
     -webkit-transition: .3s cubic-bezier(.76, .06, .85, .07);
     -o-transition: .3s cubic-bezier(.76, .06, .85, .07);
     transition: .3s cubic-bezier(.76, .06, .85, .07);
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 body.js-nav-active.js-page-in.js-page-out .preloader__logoload-box {
     -webkit-transition: .25s cubic-bezier(.76, .06, .85, .07);
     -o-transition: .25s cubic-bezier(.76, .06, .85, .07);
     transition: .25s cubic-bezier(.76, .06, .85, .07);
     -webkit-transition-delay: 1.25s;
     -o-transition-delay: 1.25s;
     transition-delay: 1.25s;
}
 .preloader__logo {
     width: 100%;
     max-width: 45%;
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
}
/* Vertical logo */
 .preloader__logo.vertical {
     width: auto;
     height: 100%;
     max-width: none;
     max-height: 65px;
}
/* 7.3. Preloader pulse animation ========================================================================== */
 .preloader__pulse {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     border-radius: 50%;
     border: 1px solid rgb(255 0 0 / 20%);
}
 .preloader__pulse:before, .preloader__pulse:after {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     opacity: 0;
     border-radius: 50%;
     -webkit-box-shadow: 0 0 0 30px rgb(250 250 250 / 30%);
     box-shadow: 0 0 0 30px rgb(250 250 250 / 30%);
     background-color: rgb(250 250 250 / 30%);
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
     -webkit-animation: 1.5s pulse-anim cubic-bezier(.17, .85, .438, .99) infinite;
     animation: 1.5s pulse-anim cubic-bezier(.17, .85, .438, .99) infinite;
}
 .preloader__pulse:after {
     -webkit-animation-duration: 3s;
     animation-duration: 3s;
     -webkit-animation-delay: .15s;
     animation-delay: .15s;
}
 .js-page-out .preloader__pulse:before, .js-page-out .preloader__pulse:after {
     -webkit-animation: none;
     animation: none;
}
 @-webkit-keyframes pulse-anim {
     0% {
         opacity: 1;
         -webkit-transform: scale(.5);
         transform: scale(.5);
    }
     100% {
         opacity: 0;
         -webkit-transform: scale(1);
         transform: scale(1);
    }
}
 @keyframes pulse-anim {
     0% {
         opacity: 1;
         -webkit-transform: scale(.5);
         transform: scale(.5);
    }
     100% {
         opacity: 0;
         -webkit-transform: scale(1);
         transform: scale(1);
    }
}
/* ========================================================================== 8. Custom mouse cursor ========================================================================== */
 .pointer {
     display: none;
}
 .cursor-anim-enable * {
     cursor: none !important;
}
 .cursor-anim-enable .pointer {
     display: block;
}
 .js-touch .cursor-anim-enable .pointer {
     display: none;
}
 .pointer {
     overflow: hidden;
     width: 30px;
     height: 30px;
     position: fixed;
     left: -100px;
     top: 50%;
     z-index: 9999;
     border: 2px solid var(--main-color);
     border-radius: 50%;
     pointer-events: none;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     -webkit-transition-property: border, background, -webkit-transform, -webkit-box-shadow;
     transition-property: border, background, -webkit-transform, -webkit-box-shadow;
     -o-transition-property: border, background, transform, box-shadow;
     transition-property: border, background, transform, box-shadow;
     transition-property: border, background, transform, box-shadow, -webkit-transform, -webkit-box-shadow;
     -webkit-transition-duration: .5s;
     -o-transition-duration: .5s;
     transition-duration: .5s;
     -webkit-transition-timing-function: cubic-bezier(.19, .94, .336, 1);
     -o-transition-timing-function: cubic-bezier(.19, .94, .336, 1);
     transition-timing-function: cubic-bezier(.19, .94, .336, 1);
}
 body.js-page-out .pointer {
     -webkit-transform: translate(-50%, -50%) scale(0);
     -ms-transform: translate(-50%, -50%) scale(0);
     transform: translate(-50%, -50%) scale(0);
}
 .js-pointer.js-black {
     border: 2px solid #000;
}
 .js-pointer.js-large {
     -webkit-box-shadow: 0 0 12px var(--main-color);
     box-shadow: 0 0 12px var(--main-color);
     border: none;
     -webkit-transform: translate(-50%, -50%) scale(2.5);
     -ms-transform: translate(-50%, -50%) scale(2.5);
     transform: translate(-50%, -50%) scale(2.5);
}
 .js-pointer.js-large.js-black {
     -webkit-box-shadow: 0 0 12px #000;
     box-shadow: 0 0 12px #000;
}
 .js-pointer.js-small {
     -webkit-box-shadow: 0 0 30px var(--main-color);
     box-shadow: 0 0 30px var(--main-color);
     -webkit-transform: translate(-50%, -50%) scale(.5);
     -ms-transform: translate(-50%, -50%) scale(.5);
     transform: translate(-50%, -50%) scale(.5);
}
 .js-pointer.js-small.js-black {
     -webkit-box-shadow: 0 0 30px #000;
     box-shadow: 0 0 30px #000;
}
 .js-pointer.js-right, .js-pointer.js-zoom, .js-pointer.js-open {
     -webkit-box-shadow: 0 0 5px var(--main-color);
     box-shadow: 0 0 5px var(--main-color);
     border: none;
     -webkit-transform: translate(-50%, -50%) scale(2.5);
     -ms-transform: translate(-50%, -50%) scale(2.5);
     transform: translate(-50%, -50%) scale(2.5);
}
 .js-pointer.js-right.js-black, .js-pointer.js-zoom.js-black, .js-pointer.js-open.js-black {
     -webkit-box-shadow: 0 0 5px #000;
     box-shadow: 0 0 5px #000;
     background-color: rgba(0, 0, 0, .1);
}
 .pointer__inner {
     position: absolute;
     left: 50%;
     top: 50%;
     opacity: 0;
     font-size: 10px;
     color: var(--main-color);
     -webkit-transform: translate(-100%, -50%);
     -ms-transform: translate(-100%, -50%);
     transform: translate(-100%, -50%);
     -webkit-transition: .4s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .4s cubic-bezier(.17, .85, .438, .99);
     transition: .4s cubic-bezier(.17, .85, .438, .99);
}
 .js-black .pointer__inner {
     color: #000;
}
 .pointer__inner.fa-search, .pointer__inner.fa-link {
     -webkit-transform: translate(-50%, -50%) scale(0);
     -ms-transform: translate(-50%, -50%) scale(0);
     transform: translate(-50%, -50%) scale(0);
}
 .js-right .pointer__inner.fa-long-arrow-alt-right {
     opacity: 1;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .js-zoom .pointer__inner.fa-search, .js-open .pointer__inner.fa-link {
     opacity: 1;
     -webkit-transform: translate(-50%, -50%) scale(1);
     -ms-transform: translate(-50%, -50%) scale(1);
     transform: translate(-50%, -50%) scale(1);
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .js-pointer.js-none {
     -webkit-transform: translate(-50%, -50%) scale(0);
     -ms-transform: translate(-50%, -50%) scale(0);
     transform: translate(-50%, -50%) scale(0);
}
/* ========================================================================== 9. Header ========================================================================== */
 .fixed-header {
     opacity: 0;
}
 .js-page-in .fixed-header {
     opacity: 1;
}
/* 9.1. Header logo ========================================================================== */
 .header-logo {
     width: auto;
     position: fixed;
     left: 20px !important;
     top: 20px !important;
     z-index: 10;
     pointer-events: none;
}
 .header-logo__box {
     display: inline-block;
     position: relative;
     pointer-events: none;
}
 .js-page-in-out .header-logo__box {
     pointer-events: auto;
}
 .header-logo__img {
     width: auto;
    /* height: 40px;
     */
     vertical-align: top;
     -webkit-transform: translateX(-110%);
     -ms-transform: translateX(-110%);
     transform: translateX(-110%);
     -webkit-transition-property: opacity, -webkit-transform;
     transition-property: opacity, -webkit-transform;
     -o-transition-property: transform, opacity;
     transition-property: transform, opacity;
     transition-property: transform, opacity, -webkit-transform;
     -webkit-transition-duration: .5s;
     -o-transition-duration: .5s;
     transition-duration: .5s;
     -webkit-transition-timing-function: cubic-bezier(.767, .01, .18, 1.01), cubic-bezier(.17, .85, .438, .99);
     -o-transition-timing-function: cubic-bezier(.767, .01, .18, 1.01), cubic-bezier(.17, .85, .438, .99);
     transition-timing-function: cubic-bezier(.767, .01, .18, 1.01), cubic-bezier(.17, .85, .438, .99);
}
 .js-nav-active .midnightHeader .header-logo__img {
     -webkit-transition-delay: 0s, .8s;
     -o-transition-delay: 0s, .8s;
     transition-delay: 0s, .8s;
}
 .js-page-in-out .header-logo__img {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-duration: 1s, .5s;
     -o-transition-duration: 1s, .5s;
     transition-duration: 1s, .5s;
     -webkit-transition-delay: 1s, .8s;
     -o-transition-delay: 1s, .8s;
     transition-delay: 1s, .8s;
}
 .js-page-in-out.landing-page .header-logo__img {
     -webkit-transition-delay: 1s, .4s;
     -o-transition-delay: 1s, .4s;
     transition-delay: 1s, .4s;
}
 .header-logo__img.black {
     position: absolute;
     left: 0;
     top: 0;
     z-index: 2;
}
 .midnightHeader.black .header-logo__img.white, .midnightHeader.default .header-logo__img.black, .js-nav-active .midnightHeader.default .header-logo__img.white, .dark-nav.js-nav-active .midnightHeader.black .header-logo__img.black, .dark-nav.js-nav-active .midnightHeader.default .header-logo__img.black {
     opacity: 0;
}
 .midnightHeader.default .header-logo__img.white, .midnightHeader.black .header-logo__img.black, .js-nav-active .midnightHeader.default .header-logo__img.black, .dark-nav.js-nav-active .midnightHeader.black .header-logo__img.white, .dark-nav.js-nav-active .midnightHeader.default .header-logo__img.white {
     opacity: 1;
}
/* Vertical logo */
 .header-logo.vertical {
     width: 20px;
}
 .vertical .header-logo__img {
     width: 20px;
     height: auto;
}
/* 9.2. Navigation open button ========================================================================== */
 .menu-icon {
     width: 40px;
     position: fixed;
     left: auto !important;
     top: 20px !important;
     right: 20px !important;
     z-index: 10;
     pointer-events: none;
     cursor: pointer;
}
 .js-page-in-out .menu-icon {
     pointer-events: auto;
}
 .menu-icon__box {
     overflow: hidden;
     width: 40px;
     height: 20px;
     position: relative;
}
 .menu-icon__box:before, .menu-icon__inner:before, .menu-icon__inner:after {
     content: '';
     width: 40px;
     height: 2px;
     position: absolute;
     left: 0;
     top: 50%;
     -webkit-transform: translateY(-50%) scaleX(0);
     -ms-transform: translateY(-50%) scaleX(0);
     transform: translateY(-50%) scaleX(0);
     -webkit-transform-origin: right;
     -ms-transform-origin: right;
     transform-origin: right;
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: .1s;
     -o-transition-delay: .1s;
     transition-delay: .1s;
}
 .menu-icon__inner:before, .menu-icon__inner:after {
     top: 0;
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .menu-icon__inner:after {
     top: auto;
     bottom: 0;
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .js-page-in-out .menu-icon__box:before {
     -webkit-transform: translateY(-50%) scaleX(1);
     -ms-transform: translateY(-50%) scaleX(1);
     transform: translateY(-50%) scaleX(1);
     -webkit-transition-delay: 1.1s;
     -o-transition-delay: 1.1s;
     transition-delay: 1.1s;
}
 .js-page-in-out .menu-icon__inner:before, .js-page-in-out .menu-icon__inner:after {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-page-in-out .menu-icon__inner:after {
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 .js-nav-active.js-page-in-out .menu-icon__box:before {
     -webkit-transform: translateY(-50%) scaleX(0);
     -ms-transform: translateY(-50%) scaleX(0);
     transform: translateY(-50%) scaleX(0);
     -webkit-transition-delay: .1s;
     -o-transition-delay: .1s;
     transition-delay: .1s;
}
 .js-nav-active.js-page-in-out .menu-icon__inner:before, .js-nav-active.js-page-in-out .menu-icon__inner:after {
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .js-nav-active.js-page-in-out .menu-icon__inner:after {
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .midnightHeader.default .menu-icon__box:before, .midnightHeader.default .menu-icon__inner:before, .midnightHeader.default .menu-icon__inner:after {
     background-color: #fff;
}
 .midnightHeader.black .menu-icon__box:before, .midnightHeader.black .menu-icon__inner:before, .midnightHeader.black .menu-icon__inner:after {
     background-color: #fff;
}
/* Landing header */
 @media only screen and (min-width: 1000px) {
     .landing-page .menu-icon {
         display: none;
    }
}
/* Vertical menu open icon */
 .menu-icon.vertical {
     width: 20px;
}
 .vertical .menu-icon__box {
     width: 20px;
     height: 40px;
}
 .vertical .menu-icon__box:before, .vertical .menu-icon__inner:before, .vertical .menu-icon__inner:after {
     width: 2px;
     height: 40px;
     left: 50%;
     top: 0;
     -webkit-transform: translateX(-50%) scaleY(0);
     -ms-transform: translateX(-50%) scaleY(0);
     transform: translateX(-50%) scaleY(0);
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
}
 .vertical .menu-icon__inner:before, .vertical .menu-icon__inner:after {
     left: 0;
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 .vertical .menu-icon__inner:after {
     left: auto;
     right: 0;
     bottom: auto;
}
 .js-page-in-out .vertical .menu-icon__box:before {
     -webkit-transform: translateX(-50%) scaleY(1);
     -ms-transform: translateX(-50%) scaleY(1);
     transform: translateX(-50%) scaleY(1);
}
 .js-page-in-out .vertical .menu-icon__inner:before, .js-page-in-out .vertical .menu-icon__inner:after {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
 .js-nav-active.js-page-in-out .vertical .menu-icon__box:before {
     -webkit-transform: translateX(-50%) scaleY(0);
     -ms-transform: translateX(-50%) scaleY(0);
     transform: translateX(-50%) scaleY(0);
}
 .js-nav-active.js-page-in-out .vertical .menu-icon__inner:before, .js-nav-active.js-page-in-out .vertical .menu-icon__inner:after {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
/* 9.3. Navigation close button ========================================================================== */
 .menu-icon__close:before, .menu-icon__close:after {
     content: '';
     width: 45px;
     height: 2px;
     position: absolute;
     left: 1px;
     top: -1px;
     background-color: #000;
     -webkit-transform: rotate(26.5deg) scaleX(0);
     -ms-transform: rotate(26.5deg) scaleX(0);
     transform: rotate(26.5deg) scaleX(0);
     -webkit-transform-origin: left;
     -ms-transform-origin: left;
     transform-origin: left;
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .dark-nav .menu-icon__close:before, .dark-nav .menu-icon__close:after {
     background-color: #fff;
}
 .menu-icon__close:after {
     top: 19px;
     -webkit-transform: rotate(-26.5deg) scaleX(0);
     -ms-transform: rotate(-26.5deg) scaleX(0);
     transform: rotate(-26.5deg) scaleX(0);
     -webkit-transition-delay: .15s;
     -o-transition-delay: .15s;
     transition-delay: .15s;
}
 .js-nav-active .menu-icon__close:before {
     -webkit-transform: rotate(26.5deg) scaleX(1);
     -ms-transform: rotate(26.5deg) scaleX(1);
     transform: rotate(26.5deg) scaleX(1);
     -webkit-transition-delay: 1.15s;
     -o-transition-delay: 1.15s;
     transition-delay: 1.15s;
}
 .js-nav-active .menu-icon__close:after {
     -webkit-transform: rotate(-26.5deg) scaleX(1);
     -ms-transform: rotate(-26.5deg) scaleX(1);
     transform: rotate(-26.5deg) scaleX(1);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-nav-active.js-page-out .menu-icon__close:before {
     -webkit-transform: rotate(26.5deg) scaleX(0);
     -ms-transform: rotate(26.5deg) scaleX(0);
     transform: rotate(26.5deg) scaleX(0);
     -webkit-transition-delay: .15s;
     -o-transition-delay: .15s;
     transition-delay: .15s;
}
 .js-nav-active.js-page-out .menu-icon__close:after {
     -webkit-transform: rotate(-26.5deg) scaleX(0);
     -ms-transform: rotate(-26.5deg) scaleX(0);
     transform: rotate(-26.5deg) scaleX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
/* Vertical menu close icon */
 .vertical .menu-icon__close:before, .vertical .menu-icon__close:after {
     left: 0px;
     -webkit-transform: rotate(63.5deg) scaleX(0);
     -ms-transform: rotate(63.5deg) scaleX(0);
     transform: rotate(63.5deg) scaleX(0);
}
 .vertical .menu-icon__close:after {
     top: 39px;
     -webkit-transform: rotate(-63.5deg) scaleX(0);
     -ms-transform: rotate(-63.5deg) scaleX(0);
     transform: rotate(-63.5deg) scaleX(0);
}
 .js-nav-active .vertical .menu-icon__close:before {
     -webkit-transform: rotate(63.5deg) scaleX(1);
     -ms-transform: rotate(63.5deg) scaleX(1);
     transform: rotate(63.5deg) scaleX(1);
}
 .js-nav-active .vertical .menu-icon__close:after {
     -webkit-transform: rotate(-63.5deg) scaleX(1);
     -ms-transform: rotate(-63.5deg) scaleX(1);
     transform: rotate(-63.5deg) scaleX(1);
}
 .js-nav-active.js-page-out .vertical .menu-icon__close:before {
     -webkit-transform: rotate(63.5deg) scaleX(0);
     -ms-transform: rotate(63.5deg) scaleX(0);
     transform: rotate(63.5deg) scaleX(0);
}
 .js-nav-active.js-page-out .vertical .menu-icon__close:after {
     -webkit-transform: rotate(-63.5deg) scaleX(0);
     -ms-transform: rotate(-63.5deg) scaleX(0);
     transform: rotate(-63.5deg) scaleX(0);
}
/* 9.4. Header social buttons ========================================================================== */
 .header-social {
     width: 20px;
     position: fixed;
     left: auto !important;
     top: 50% !important;
     right: 20px !important;
     z-index: 10;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     pointer-events: none;
}
 .js-page-in-out .header-social {
     pointer-events: auto;
}
 .header-social i {
     font-size: 13px;
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: 1.1s;
     -o-transition-delay: 1.1s;
     transition-delay: 1.1s;
}
 .js-nav-active .header-social i {
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-page-in-anim-active.js-page-out .header-social.after-preloader-anim .anim-slide {
     -webkit-transform: translateY(105%);
     -ms-transform: translateY(105%);
     transform: translateY(105%);
     -webkit-transition: 1.3s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.3s cubic-bezier(.17, .85, .438, .99);
     transition: 1.3s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: 0s !important;
     -o-transition-delay: 0s !important;
     transition-delay: 0s !important;
}
 .header-social .midnightHeader.default i, .dark-nav.js-nav-active .header-social .midnightHeader.default i, .dark-nav.js-nav-active .header-social .midnightHeader.black i {
     color: #fff;
}
 .header-social .midnightHeader.black i, .js-nav-active .header-social .midnightHeader.default i {
     color: #000;
}
 @media only screen and (max-width: 767px) and (orientation: landscape) {
     .header-social {
         display: none;
    }
}
 @media only screen and (max-width: 549px) {
     .header-social {
         display: none;
    }
}
/* Landing header */
 .landing-page .fixed-header .header-social i {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
/* 9.5. Header contact ========================================================================== */
 .header-contact {
     width: 20px;
     position: fixed;
     left: 20px !important;
     top: 50% !important;
     z-index: 10;
     pointer-events: none;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .header-contact__flex {
     overflow: hidden;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     width: 20px;
     height: 60vh;
}
 .header-contact__anim {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-page-in-anim-active .header-contact__anim {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .js-page-in-anim-active.js-page-out .header-contact__anim {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
}
 .header-contact__btn {
     white-space: nowrap;
     pointer-events: auto;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 600;
     letter-spacing: 2px;
     line-height: 20px;
     text-transform: uppercase;
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: 1.1s;
     -o-transition-delay: 1.1s;
     transition-delay: 1.1s;
}
 .header-contact__btn i {
     font-size: 16px;
}
 .js-nav-active .header-contact__btn {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
 .midnightHeader.default .header-contact__btn, .dark-nav.js-nav-active .midnightHeader.default .header-contact__btn, .dark-nav.js-nav-active .midnightHeader.black .header-contact__btn {
     color: #fff;
}
 .midnightHeader.black .header-contact__btn, .js-nav-active .midnightHeader.default .header-contact__btn {
     color: #000;
}
 @media only screen and (max-width: 767px) and (orientation: landscape) {
     .header-contact {
         display: none;
    }
}
 @media only screen and (max-width: 549px) {
     .header-contact {
         display: none;
    }
}
/* Landing header */
 .landing-page .header-contact__btn {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
/* 9.6. Headroom ========================================================================== */
 .headroom {
     -webkit-transition-property: -webkit-transform;
     transition-property: -webkit-transform;
     -o-transition-property: transform;
     transition-property: transform;
     transition-property: transform, -webkit-transform;
     -webkit-transition-duration: .7s;
     -o-transition-duration: .7s;
     transition-duration: .7s;
     -webkit-transition-timing-function: cubic-bezier(.767, .01, .18, 1.01);
     -o-transition-timing-function: cubic-bezier(.767, .01, .18, 1.01);
     transition-timing-function: cubic-bezier(.767, .01, .18, 1.01);
     will-change: transform;
}
 .header-social.headroom--unpinned {
     -webkit-transform: translateX(210%) translateY(-50%);
     -ms-transform: translateX(210%) translateY(-50%);
     transform: translateX(210%) translateY(-50%);
}
 .header-contact.headroom--unpinned {
     -webkit-transform: translateX(-210%) translateY(-50%);
     -ms-transform: translateX(-210%) translateY(-50%);
     transform: translateX(-210%) translateY(-50%);
}
 .js-nav-active .header-social.headroom--unpinned, .js-nav-active .header-contact.headroom--unpinned {
     -webkit-transform: translateY(-50%) !important;
     -ms-transform: translateY(-50%) !important;
     transform: translateY(-50%) !important;
}
 @media only screen and (max-width: 549px) {
     .headroom--unpinned {
         -webkit-transform: translateY(-210%);
         -ms-transform: translateY(-210%);
         transform: translateY(-210%);
    }
     .vertical.headroom--unpinned {
         -webkit-transform: translateX(210%);
         -ms-transform: translateX(210%);
         transform: translateX(210%);
    }
     .vertical.header-logo.headroom--unpinned {
         -webkit-transform: translateX(-210%);
         -ms-transform: translateX(-210%);
         transform: translateX(-210%);
    }
     .scroll-to-btn.headroom--unpinned {
         opacity: 0;
         -webkit-transform: translateX(0) translateY(-100%) !important;
         -ms-transform: translateX(0) translateY(-100%) !important;
         transform: translateX(0) translateY(-100%) !important;
    }
     .scroll-to-btn.to-down.headroom--unpinned {
         -webkit-transform: translateX(0) translateY(100%) !important;
         -ms-transform: translateX(0) translateY(100%) !important;
         transform: translateX(0) translateY(100%) !important;
    }
     .js-nav-active .headroom--unpinned {
         -webkit-transform: none !important;
         -ms-transform: none !important;
         transform: none !important;
    }
}
/* ========================================================================== 10. Navigation ========================================================================== */
 .nav-container {
     overflow: hidden;
     width: 100%;
     height: 100vh;
     min-height: 100vh;
     margin: 0;
     padding: 0;
     position: fixed !important;
     left: 0;
     top: 0;
     z-index: 9;
     pointer-events: none;
     background-color: #f5f5f5;
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
     -webkit-transition: 1s cubic-bezier(.858, .01, .068, .99);
     -o-transition: 1s cubic-bezier(.858, .01, .068, .99);
     transition: 1s cubic-bezier(.858, .01, .068, .99);
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .dark-nav .nav-container {
     background-color: #111517;
}
 .js-nav-active .nav-container {
     pointer-events: auto;
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
/* Landing nav open */
 .landing-page .nav-container {
     opacity: 0;
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .js-nav-active.landing-page .nav-container {
     opacity: 1;
}
/* 10.1. Navigation menu box ========================================================================== */
 .menu-box {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-flow: column;
     flex-flow: column;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     width: 66.66%;
     height: 100%;
     padding-left: 33.33%;
}
 @media only screen and (max-width: 999px) {
     .menu-box {
         -webkit-box-align: center;
         -ms-flex-align: center;
         align-items: center;
         width: 100%;
         padding-left: 0;
    }
}
/* 10.2. Navigation buttons ========================================================================== */
 .nav-btn-box {
     overflow: hidden;
}
 .nav-btn {
     display: inline-block;
     margin: 0;
     padding: 0;
     cursor: pointer;
     -webkit-transform: translateY(-105%);
     -ms-transform: translateY(-105%);
     transform: translateY(-105%);
     -webkit-transition: .8s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .8s cubic-bezier(.767, .01, .18, 1.01);
     transition: .8s cubic-bezier(.767, .01, .18, 1.01);
}
 .nav-btn-box:nth-child(1) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(1) .nav-btn {
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .nav-btn-box:nth-child(2) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(2) .nav-btn {
     -webkit-transition-delay: .04s;
     -o-transition-delay: .04s;
     transition-delay: .04s;
}
 .nav-btn-box:nth-child(3) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(3) .nav-btn {
     -webkit-transition-delay: .08s;
     -o-transition-delay: .08s;
     transition-delay: .08s;
}
 .nav-btn-box:nth-child(4) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(4) .nav-btn {
     -webkit-transition-delay: .12s;
     -o-transition-delay: .12s;
     transition-delay: .12s;
}
 .nav-btn-box:nth-child(5) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(5) .nav-btn {
     -webkit-transition-delay: .16s;
     -o-transition-delay: .16s;
     transition-delay: .16s;
}
 .nav-btn-box:nth-child(6) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(6) .nav-btn {
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .nav-btn-box:nth-child(7) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(7) .nav-btn {
     -webkit-transition-delay: .24s;
     -o-transition-delay: .24s;
     transition-delay: .24s;
}
 .nav-btn-box:nth-child(8) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(8) .nav-btn {
     -webkit-transition-delay: .28s;
     -o-transition-delay: .28s;
     transition-delay: .28s;
}
 .nav-btn-box:nth-child(9) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(9) .nav-btn {
     -webkit-transition-delay: .32s;
     -o-transition-delay: .32s;
     transition-delay: .32s;
}
 .nav-btn-box:nth-child(10) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(10) .nav-btn {
     -webkit-transition-delay: .36s;
     -o-transition-delay: .36s;
     transition-delay: .36s;
}
 .nav-btn-box:nth-child(11) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(11) .nav-btn {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
 .nav-btn-box:nth-child(12) .nav-btn, .nav-btn-box .nav-btn-box:nth-child(12) .nav-btn {
     -webkit-transition-delay: .44s;
     -o-transition-delay: .44s;
     transition-delay: .44s;
}
/* 10.2.1. Navigation active buttons ========================================================================== */
 .js-nav-active .nav-btn {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
     -webkit-transition: 1.5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1.5s cubic-bezier(.225, 1, .316, .99);
     transition: 1.5s cubic-bezier(.225, 1, .316, .99);
}
 .js-nav-active .nav-btn-box:nth-child(1) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(1) .nav-btn {
     -webkit-transition-delay: .9s;
     -o-transition-delay: .9s;
     transition-delay: .9s;
}
 .js-nav-active .nav-btn-box:nth-child(2) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(2) .nav-btn {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-nav-active .nav-btn-box:nth-child(3) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(3) .nav-btn {
     -webkit-transition-delay: 1.1s;
     -o-transition-delay: 1.1s;
     transition-delay: 1.1s;
}
 .js-nav-active .nav-btn-box:nth-child(4) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(4) .nav-btn {
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 .js-nav-active .nav-btn-box:nth-child(5) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(5) .nav-btn {
     -webkit-transition-delay: 1.3s;
     -o-transition-delay: 1.3s;
     transition-delay: 1.3s;
}
 .js-nav-active .nav-btn-box:nth-child(6) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(6) .nav-btn {
     -webkit-transition-delay: 1.4s;
     -o-transition-delay: 1.4s;
     transition-delay: 1.4s;
}
 .js-nav-active .nav-btn-box:nth-child(7) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(7) .nav-btn {
     -webkit-transition-delay: 1.5s;
     -o-transition-delay: 1.5s;
     transition-delay: 1.5s;
}
 .js-nav-active .nav-btn-box:nth-child(8) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(8) .nav-btn {
     -webkit-transition-delay: 1.6s;
     -o-transition-delay: 1.6s;
     transition-delay: 1.6s;
}
 .js-nav-active .nav-btn-box:nth-child(9) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(9) .nav-btn {
     -webkit-transition-delay: 1.7s;
     -o-transition-delay: 1.7s;
     transition-delay: 1.7s;
}
 .js-nav-active .nav-btn-box:nth-child(10) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(10) .nav-btn {
     -webkit-transition-delay: 1.8s;
     -o-transition-delay: 1.8s;
     transition-delay: 1.8s;
}
 .js-nav-active .nav-btn-box:nth-child(11) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(11) .nav-btn {
     -webkit-transition-delay: 1.9s;
     -o-transition-delay: 1.9s;
     transition-delay: 1.9s;
}
 .js-nav-active .nav-btn-box:nth-child(12) .nav-btn, .js-nav-active .nav-btn-box .nav-btn-box:nth-child(12) .nav-btn {
     -webkit-transition-delay: 2s;
     -o-transition-delay: 2s;
     transition-delay: 2s;
}
/* 10.2.2. Navigation active page out buttons ========================================================================== */
 .js-nav-active.js-page-out .nav-container .nav-btn {
     -webkit-transform: translateY(-105%);
     -ms-transform: translateY(-105%);
     transform: translateY(-105%);
     -webkit-transition: 1s cubic-bezier(.76, .06, .85, .07);
     -o-transition: 1s cubic-bezier(.76, .06, .85, .07);
     transition: 1s cubic-bezier(.76, .06, .85, .07);
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(1) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(1) .nav-btn {
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(2) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(2) .nav-btn {
     -webkit-transition-delay: .04s;
     -o-transition-delay: .04s;
     transition-delay: .04s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(3) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(3) .nav-btn {
     -webkit-transition-delay: .08s;
     -o-transition-delay: .08s;
     transition-delay: .08s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(4) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(4) .nav-btn {
     -webkit-transition-delay: .12s;
     -o-transition-delay: .12s;
     transition-delay: .12s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(5) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(5) .nav-btn {
     -webkit-transition-delay: .16s;
     -o-transition-delay: .16s;
     transition-delay: .16s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(6) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(6) .nav-btn {
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(7) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(7) .nav-btn {
     -webkit-transition-delay: .24s;
     -o-transition-delay: .24s;
     transition-delay: .24s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(8) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(8) .nav-btn {
     -webkit-transition-delay: .28s;
     -o-transition-delay: .28s;
     transition-delay: .28s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(9) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(9) .nav-btn {
     -webkit-transition-delay: .32s;
     -o-transition-delay: .32s;
     transition-delay: .32s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(10) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(10) .nav-btn {
     -webkit-transition-delay: .36s;
     -o-transition-delay: .36s;
     transition-delay: .36s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(11) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(11) .nav-btn {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
 .js-nav-active.js-page-out .nav-btn-box:nth-child(12) .nav-btn, .js-nav-active.js-page-out .nav-btn-box .nav-btn-box:nth-child(12) .nav-btn {
     -webkit-transition-delay: .44s;
     -o-transition-delay: .44s;
     transition-delay: .44s;
}
/* 10.2.3. Navigation buttons style ========================================================================== */
 .nav-btn__inner {
     margin: 0;
     padding: 0;
     font-family: 'Montserrat', sans-serif;
     font-size: 40px;
     font-weight: 300;
     line-height: 1.2;
}
 .nav-btn.small .nav-btn__inner {
     font-size: 47px;
}
 .nav-btn.large .nav-btn__inner {
     font-size: 40px;
}
 @media only screen and (max-width: 1399px) {
     .nav-btn__inner {
         font-size: 50px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 40px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 67px;
    }
}
 @media only screen and (max-width: 1199px) {
     .nav-btn__inner {
         font-size: 45px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 33px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 55px;
    }
}
 @media only screen and (max-width: 999px) {
     .nav-btn__inner {
         font-size: 40px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 35px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 45px;
    }
}
 @media only screen and (max-width: 999px) and (orientation: landscape) {
     .nav-btn__inner {
         font-size: 33px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 25px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 48px;
    }
}
 @media only screen and (max-width: 767px) {
     .nav-btn__inner {
         font-size: 38px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 32px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 55px;
    }
}
 @media only screen and (max-width: 767px) and (orientation: landscape) {
     .nav-btn__inner {
         font-size: 24px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 17px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 34px;
    }
}
 @media only screen and (max-width: 549px) {
     .nav-btn__inner {
         font-size: 30px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 28px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 34px;
    }
}
 @media only screen and (max-width: 549px) and (orientation: landscape) {
     .nav-btn__inner {
         font-size: 22px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 16px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 32px;
    }
}
 @media only screen and (max-width: 399px) {
     .nav-btn__inner {
         font-size: 30px;
    }
     .nav-btn.small .nav-btn__inner {
         font-size: 24px;
    }
     .nav-btn.large .nav-btn__inner {
         font-size: 40px;
    }
}
/* 10.2.4. Navigation buttons hover effect ========================================================================== */
 .nav-btn__inner {
     position: relative;
     white-space: nowrap;
     color: #000;
}
 .dark-nav .nav-btn__inner {
     color: #fff;
}
 .nav-btn__inner:before {
     content: attr(data-text);
     overflow: hidden;
     width: 0%;
     position: absolute;
     left: 0;
     top: 50%;
     white-space: nowrap;
     color: var(--main-color);
     background-color: #f5f5f5;
     z-index: 2;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: 1s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1s cubic-bezier(.225, 1, .316, .99);
     transition: 1s cubic-bezier(.225, 1, .316, .99);
}
 .dark-nav .nav-btn__inner:before {
     background-color: #111517;
}
 .nav-btn:hover .nav-btn__inner:before {
     width: 100%;
}
 .js-nav-slider .nav-btn__inner {
     color: transparent;
     white-space: normal;
}
 .js-nav-slider .nav-btn__inner:before {
     width: 100%;
     white-space: normal;
     color: #fff;
     background-color: transparent;
}
 .js-nav-slider .nav-btn:hover .nav-btn__inner:before {
     color: var(--main-color);
}
/* 10.3. Navigation drop down ========================================================================== */
 .dropdown {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     z-index: 2;
     pointer-events: none;
}
 .menu-box.dropdown {
     width: 66.66%;
}
 .js-dropdown.js-dropdown-is-active {
     pointer-events: auto;
}
 @media only screen and (max-width: 999px) {
     .menu-box.dropdown {
         width: 100%;
    }
}
/* 10.3.1. Navigation drop down close button ========================================================================== */
 .dropdown-close {
     overflow: hidden;
     width: 60px;
     height: 30px;
     position: absolute;
     top: 20px;
     left: 50%;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
     z-index: 3;
}
 .dropdown-close__inner {
     overflow: hidden;
     width: 100%;
     height: 100%;
     position: relative;
     cursor: pointer;
     pointer-events: none;
     -webkit-transform: translateX(-100%);
     -ms-transform: translateX(-100%);
     transform: translateX(-100%);
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 .js-nav-active .js-dropdown-is-active .dropdown-close__inner {
     pointer-events: auto;
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-nav-active.js-page-out .js-dropdown-is-active .dropdown-close__inner {
     -webkit-transform: translateX(-100%);
     -ms-transform: translateX(-100%);
     transform: translateX(-100%);
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .dropdown-close__arrow {
     display: block;
     width: 100%;
     height: 100%;
     position: relative;
     z-index: 3;
     -webkit-transform: translateX(22px);
     -ms-transform: translateX(22px);
     transform: translateX(22px);
     -webkit-transition: .7s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .7s cubic-bezier(.17, .85, .438, .99);
     transition: .7s cubic-bezier(.17, .85, .438, .99);
}
 .dropdown-close:hover .dropdown-close__arrow {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
 .dropdown-close__arrow:before {
     content: '';
     display: block;
     width: 18px;
     height: 18px;
     position: absolute;
     left: 4px;
     top: 5px;
     border-left: 2px solid var(--main-color);
     border-bottom: 2px solid var(--main-color);
     -webkit-transform: rotate(45deg);
     -ms-transform: rotate(45deg);
     transform: rotate(45deg);
}
 .dropdown-close__arrow:after {
     content: '';
     width: 100%;
     height: 2px;
     position: absolute;
     left: 0;
     top: 50%;
     background-color: var(--main-color);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transform-origin: left;
     -ms-transform-origin: left;
     transform-origin: left;
}
 .dropdown-close__inner:before {
     content: '';
     width: 2px;
     height: 50%;
     position: absolute;
     top: 50%;
     right: 0;
     background-color: var(--main-color);
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 .dropdown-close:hover .dropdown-close__inner:before {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 @media only screen and (max-width: 399px) {
     .dropdown-close {
         left: auto;
         right: 100px;
         -webkit-transform: translateX(0);
         -ms-transform: translateX(0);
         transform: translateX(0);
    }
}
/* 10.3.2. Navigation drop down menu ========================================================================== */
 .js-dropdown .nav-btn__inner {
     display: inline-block;
     -webkit-transform: translateY(-105%);
     -ms-transform: translateY(-105%);
     transform: translateY(-105%);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-dropdown.js-dropdown-is-active .nav-btn__inner {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .dropdown-hidden-btn .nav-btn__inner {
     display: inline-block;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-dropdown-is-active .dropdown-hidden-btn .nav-btn__inner {
     -webkit-transform: translateY(-105%);
     -ms-transform: translateY(-105%);
     transform: translateY(-105%);
}
 .js-dropdown-is-active .dropdown-hidden-btn {
     pointer-events: none;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(1) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(1) .nav-btn__inner {
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(2) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(2) .nav-btn__inner {
     -webkit-transition-delay: .1s;
     -o-transition-delay: .1s;
     transition-delay: .1s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(3) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(3) .nav-btn__inner {
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(4) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(4) .nav-btn__inner {
     -webkit-transition-delay: .3s;
     -o-transition-delay: .3s;
     transition-delay: .3s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(5) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(5) .nav-btn__inner {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(6) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(6) .nav-btn__inner {
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(7) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(7) .nav-btn__inner {
     -webkit-transition-delay: .6s;
     -o-transition-delay: .6s;
     transition-delay: .6s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(8) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(8) .nav-btn__inner {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(9) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(9) .nav-btn__inner {
     -webkit-transition-delay: .8s;
     -o-transition-delay: .8s;
     transition-delay: .8s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(10) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(10) .nav-btn__inner {
     -webkit-transition-delay: .9s;
     -o-transition-delay: .9s;
     transition-delay: .9s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(11) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(11) .nav-btn__inner {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-dropdown-is-active .nav-btn-box:nth-last-child(12) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown .nav-btn-box:nth-last-child(12) .nav-btn__inner {
     -webkit-transition-delay: 1.1s;
     -o-transition-delay: 1.1s;
     transition-delay: 1.1s;
}
 .nav-btn-box:nth-last-child(1) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(1) .nav-btn__inner {
     -webkit-transition-delay: .6s;
     -o-transition-delay: .6s;
     transition-delay: .6s;
}
 .nav-btn-box:nth-last-child(2) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(2) .nav-btn__inner {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .nav-btn-box:nth-last-child(3) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(3) .nav-btn__inner {
     -webkit-transition-delay: .8s;
     -o-transition-delay: .8s;
     transition-delay: .8s;
}
 .nav-btn-box:nth-last-child(4) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(4) .nav-btn__inner {
     -webkit-transition-delay: .9s;
     -o-transition-delay: .9s;
     transition-delay: .9s;
}
 .nav-btn-box:nth-last-child(5) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(5) .nav-btn__inner {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .nav-btn-box:nth-last-child(6) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(6) .nav-btn__inner {
     -webkit-transition-delay: 1.1s;
     -o-transition-delay: 1.1s;
     transition-delay: 1.1s;
}
 .nav-btn-box:nth-last-child(7) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(7) .nav-btn__inner {
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 .nav-btn-box:nth-last-child(8) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(8) .nav-btn__inner {
     -webkit-transition-delay: 1.3s;
     -o-transition-delay: 1.3s;
     transition-delay: 1.3s;
}
 .nav-btn-box:nth-last-child(9) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(9) .nav-btn__inner {
     -webkit-transition-delay: 1.4s;
     -o-transition-delay: 1.4s;
     transition-delay: 1.4s;
}
 .nav-btn-box:nth-last-child(10) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(10) .nav-btn__inner {
     -webkit-transition-delay: 1.5s;
     -o-transition-delay: 1.5s;
     transition-delay: 1.5s;
}
 .nav-btn-box:nth-last-child(11) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(11) .nav-btn__inner {
     -webkit-transition-delay: 1.6s;
     -o-transition-delay: 1.6s;
     transition-delay: 1.6s;
}
 .nav-btn-box:nth-last-child(12) .dropdown-hidden-btn .nav-btn__inner, .js-dropdown.js-dropdown-is-active .nav-btn-box:nth-last-child(12) .nav-btn__inner {
     -webkit-transition-delay: 1.7s;
     -o-transition-delay: 1.7s;
     transition-delay: 1.7s;
}
/* 10.4. Navigation slider ========================================================================== */
 .js-nav-slider {
     width: 33.33%;
     height: 100%;
     margin: 0 auto;
}
 .js-nav-slider .swiper-slide {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     opacity: .2;
     text-align: center;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .js-nav-slider .swiper-slide.swiper-slide-active {
     opacity: 1;
}
 @media only screen and (max-width: 999px) {
     .js-nav-slider {
         width: 50%;
    }
}
 @media only screen and (max-width: 767px) {
     .js-nav-slider {
         width: 100%;
    }
}
/* 10.4.1. Navigation slider background ========================================================================== */
 .js-nav-slider-bg {
     width: calc(100% - 120px);
     height: 100%;
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     z-index: -1;
     pointer-events: none;
}
 .lines-section .js-nav-slider-bg {
     width: 100%;
}
 @media only screen and (max-width: 549px) {
     .lines-section .js-nav-slider-bg {
         width: calc(100% - 120px);
    }
}
 .js-nav-slider-bg .swiper-slide {
     height: calc(100% - 130px);
     margin-top: 65px;
     pointer-events: none;
}
 .nav-slide-bg {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 50%;
     top: 50%;
     border: 2px solid #f5f5f5;
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
}
 .dark-nav .nav-slide-bg {
     border: 2px solid #111517;
}
/* 10.4.2. Navigation slider background overlay ========================================================================== */
 .js-nav-slider-bg:before, .js-nav-slider-bg:after {
     content: '';
     width: 105%;
     height: 100%;
     position: absolute;
     left: 50%;
     top: 50%;
     z-index: 2;
     background-color: #f5f5f5;
     -webkit-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
     -webkit-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .dark-nav .js-nav-slider-bg:before, .dark-nav .js-nav-slider-bg:after {
     background-color: #111517;
}
 .js-nav-slider-bg:after {
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-nav-active .js-nav-slider-bg:before {
     -webkit-transform: translateX(-50%) translateY(-150%);
     -ms-transform: translateX(-50%) translateY(-150%);
     transform: translateX(-50%) translateY(-150%);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: .65s;
     -o-transition-delay: .65s;
     transition-delay: .65s;
}
 .js-nav-active.js-page-out .js-nav-slider-bg:before {
     -webkit-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-nav-slider-bg.js-dropdown-is-active:after {
     -webkit-transform: translateX(-50%) translateY(-150%);
     -ms-transform: translateX(-50%) translateY(-150%);
     transform: translateX(-50%) translateY(-150%);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
/* 10.4.3. Navigation slider controls ========================================================================== */
 .dropdown-slider-controls {
     opacity: 0;
     -webkit-transform: translateY(30px) translateX(0);
     -ms-transform: translateY(30px) translateX(0);
     transform: translateY(30px) translateX(0);
     -webkit-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .swiper-button-next-box .dropdown-slider-controls {
     -webkit-transform: translateY(0) translateX(-30px);
     -ms-transform: translateY(0) translateX(-30px);
     transform: translateY(0) translateX(-30px);
}
 .swiper-button-prev-box .dropdown-slider-controls {
     -webkit-transform: translateY(0) translateX(30px);
     -ms-transform: translateY(0) translateX(30px);
     transform: translateY(0) translateX(30px);
}
 .js-nav-active .js-dropdown.js-dropdown-is-active .dropdown-slider-controls {
     opacity: 1;
     -webkit-transform: translateY(0) translateX(0);
     -ms-transform: translateY(0) translateX(0);
     transform: translateY(0) translateX(0);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-nav-active .js-dropdown.js-dropdown-is-active .swiper-button-next-box .dropdown-slider-controls, .js-nav-active .js-dropdown.js-dropdown-is-active .swiper-button-prev-box .dropdown-slider-controls {
     -webkit-transition-delay: 1.5s;
     -o-transition-delay: 1.5s;
     transition-delay: 1.5s;
}
 .js-nav-active.js-page-out .js-dropdown.js-dropdown-is-active .dropdown-slider-controls {
     opacity: 0;
     -webkit-transform: translateY(30px) translateX(0);
     -ms-transform: translateY(30px) translateX(0);
     transform: translateY(30px) translateX(0);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-nav-active.js-page-out .js-dropdown.js-dropdown-is-active .swiper-button-next-box .dropdown-slider-controls {
     -webkit-transform: translateY(0) translateX(-30px);
     -ms-transform: translateY(0) translateX(-30px);
     transform: translateY(0) translateX(-30px);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-nav-active.js-page-out .js-dropdown.js-dropdown-is-active .swiper-button-prev-box .dropdown-slider-controls {
     -webkit-transform: translateY(0) translateX(30px);
     -ms-transform: translateY(0) translateX(30px);
     transform: translateY(0) translateX(30px);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
/* 10.4.4. Navigation slider buttons delays ========================================================================== */
 .js-nav-slider .swiper-slide-active .nav-btn {
     -webkit-transition-delay: 0s !important;
     -o-transition-delay: 0s !important;
     transition-delay: 0s !important;
}
 .js-nav-slider .nav-btn {
     -webkit-transition-delay: .16s !important;
     -o-transition-delay: .16s !important;
     transition-delay: .16s !important;
}
 .js-nav-active .js-nav-slider .swiper-slide-active .nav-btn {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .js-nav-active .js-nav-slider .nav-btn {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .js-nav-active.js-page-out .js-nav-slider .swiper-slide-active .nav-btn {
     -webkit-transition-delay: 0s !important;
     -o-transition-delay: 0s !important;
     transition-delay: 0s !important;
}
 .js-nav-active.js-page-out .js-nav-slider .nav-btn {
     -webkit-transition-delay: .16s !important;
     -o-transition-delay: .16s !important;
     transition-delay: .16s !important;
}
 .js-dropdown .swiper-slide.swiper-slide-active .nav-btn__inner {
     -webkit-transition-delay: 0s !important;
     -o-transition-delay: 0s !important;
     transition-delay: 0s !important;
}
 .js-dropdown .swiper-slide .nav-btn__inner {
     -webkit-transition-delay: .2s !important;
     -o-transition-delay: .2s !important;
     transition-delay: .2s !important;
}
 .js-dropdown.js-dropdown-is-active .swiper-slide.swiper-slide-active .nav-btn__inner {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .js-dropdown.js-dropdown-is-active .swiper-slide .nav-btn__inner {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
/* 10.5. Navigation information ========================================================================== */
 .nav-information {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-flow: column;
     flex-flow: column;
     -ms-flex-pack: distribute;
     justify-content: space-around;
     width: calc(33.33% - 100px);
     height: calc(100% - 120px);
     position: absolute;
     left: 80px;
     top: 120px;
}
 .lines-section .nav-information {
     width: calc(33.33% - 40px);
     left: 20px;
}
 .nav-title-color {
     color: #000;
}
 .dark-nav .nav-title-color {
     color: #fff;
}
 .nav-text-color {
     color: #9b9b9b;
}
 .dark-nav .nav-text-color {
     color: #8a8a8a;
}
 .nav-copyright {
     position: absolute;
     right: 20px;
     bottom: 20px;
     color: #000;
}
 .dark-nav .nav-copyright {
     color: #fff;
}
 @media only screen and (max-width: 999px) {
     .nav-information, .nav-copyright {
         display: none;
    }
}
/* 10.5.1. Navigation information animations ========================================================================== */
 .nav-reveal-anim {
     display: inline-block;
     position: relative;
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
     -webkit-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-nav-active .nav-reveal-anim {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-nav-active.js-page-out .nav-reveal-anim, .nav-reveal-anim.js-nav-anim.js-dropdown-is-active {
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .nav-reveal-anim:before {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     background-color: var(--main-color);
     -webkit-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .js-nav-active .nav-reveal-anim:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
     -webkit-transition-delay: 1.5s;
     -o-transition-delay: 1.5s;
     transition-delay: 1.5s;
}
 .js-nav-active.js-page-out .nav-reveal-anim:before, .nav-reveal-anim.js-nav-anim.js-dropdown-is-active:before {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .nav-fade-anim {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-nav-active .nav-fade-anim {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
     -webkit-transition-delay: 1.3s;
     -o-transition-delay: 1.3s;
     transition-delay: 1.3s;
}
 .js-nav-active.js-page-out .nav-fade-anim, .nav-fade-anim.js-nav-anim.js-dropdown-is-active {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
/* 10.6. Landing navigation ========================================================================== */
 .landing-nav {
     display: none;
}
 @media only screen and (min-width: 1000px) {
     .landing-nav {
         display: block;
         width: 100%;
         position: fixed;
         left: auto !important;
         top: 20px !important;
         right: 0 !important;
         z-index: 10;
         pointer-events: none;
    }
     .landing-nav__flex {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
         -webkit-box-orient: horizontal;
         -webkit-box-direction: normal;
         -ms-flex-flow: row;
         flex-flow: row;
         -webkit-box-pack: end;
         -ms-flex-pack: end;
         justify-content: flex-end;
         overflow: hidden;
         width: 100%;
         height: auto;
    }
     .landing-nav__btn {
         display: inline-block;
         margin-right: 50px;
         font-family: 'Montserrat', sans-serif;
         font-size: 12px;
         font-weight: 600;
         letter-spacing: 2px;
         line-height: 20px;
         text-transform: uppercase;
         -webkit-transform: translateY(110%);
         -ms-transform: translateY(110%);
         transform: translateY(110%);
         -webkit-transition: 1.5s cubic-bezier(.17, .85, .438, .99);
         -o-transition: 1.5s cubic-bezier(.17, .85, .438, .99);
         transition: 1.5s cubic-bezier(.17, .85, .438, .99);
    }
     .landing-nav__btn:last-child {
         margin-right: 20px;
    }
     .landing-nav__btn:nth-child(2) {
         -webkit-transition-delay: .1s;
         -o-transition-delay: .1s;
         transition-delay: .1s;
    }
     .landing-nav__btn:nth-child(3) {
         -webkit-transition-delay: .2s;
         -o-transition-delay: .2s;
         transition-delay: .2s;
    }
     .landing-nav__btn:nth-child(4) {
         -webkit-transition-delay: .3s;
         -o-transition-delay: .3s;
         transition-delay: .3s;
    }
     .landing-nav__btn:nth-child(5) {
         -webkit-transition-delay: .4s;
         -o-transition-delay: .4s;
         transition-delay: .4s;
    }
     .landing-nav__btn:nth-child(6) {
         -webkit-transition-delay: .5s;
         -o-transition-delay: .5s;
         transition-delay: .5s;
    }
     .landing-nav__btn:nth-child(7) {
         -webkit-transition-delay: .6s;
         -o-transition-delay: .6s;
         transition-delay: .6s;
    }
     .landing-nav__btn:nth-child(8) {
         -webkit-transition-delay: .7s;
         -o-transition-delay: .7s;
         transition-delay: .7s;
    }
     .landing-nav__btn:nth-child(9) {
         -webkit-transition-delay: .8s;
         -o-transition-delay: .8s;
         transition-delay: .8s;
    }
     .landing-nav__btn:nth-child(10) {
         -webkit-transition-delay: .9s;
         -o-transition-delay: .9s;
         transition-delay: .9s;
    }
     .landing-nav__btn:nth-child(11) {
         -webkit-transition-delay: 1s;
         -o-transition-delay: 1s;
         transition-delay: 1s;
    }
     .landing-nav__btn:nth-child(12) {
         -webkit-transition-delay: 1.1s;
         -o-transition-delay: 1.1s;
         transition-delay: 1.1s;
    }
     .js-page-in-anim-active .landing-nav__btn {
         -webkit-transform: none;
         -ms-transform: none;
         transform: none;
    }
     .js-page-in-anim-active.js-page-out .landing-nav__btn {
         -webkit-transform: translateY(110%);
         -ms-transform: translateY(110%);
         transform: translateY(110%);
         -webkit-transition-delay: 0s;
         -o-transition-delay: 0s;
         transition-delay: 0s;
    }
     .landing-nav__inner {
         display: inline-block;
         white-space: nowrap;
         pointer-events: auto;
         -webkit-transition: .7s cubic-bezier(.17, .85, .438, .99);
         -o-transition: .7s cubic-bezier(.17, .85, .438, .99);
         transition: .7s cubic-bezier(.17, .85, .438, .99);
    }
     .midnightHeader.default .landing-nav__inner {
         color: #fff;
    }
     .midnightHeader.black .landing-nav__inner {
         color: #000;
    }
     .mPS2id-highlight.landing-nav__inner {
         color: var(--main-color) !important;
    }
    /* Vertical landing nav */
     .landing-nav.vertical {
         width: 20px;
         right: 20px !important;
    }
     .vertical .landing-nav__flex {
         -webkit-box-orient: vertical;
         -webkit-box-direction: normal;
         -ms-flex-flow: column;
         flex-flow: column;
         -webkit-box-pack: justify;
         -ms-flex-pack: justify;
         justify-content: space-between;
         width: 20px;
         height: calc(100vh - 40px);
    }
     .vertical .landing-nav__btn {
         margin-right: 0;
         -webkit-transform: rotate(90deg) scaleY(-1) translateY(-100%);
         -ms-transform: rotate(90deg) scaleY(-1) translateY(-100%);
         transform: rotate(90deg) scaleY(-1) translateY(-100%);
         -webkit-transform-origin: left top;
         -ms-transform-origin: left top;
         transform-origin: left top;
    }
     .vertical .landing-nav__btn:last-child {
         margin-right: 0;
         -webkit-transform: rotate(-90deg) scaleY(-1) translateY(100%);
         -ms-transform: rotate(-90deg) scaleY(-1) translateY(100%);
         transform: rotate(-90deg) scaleY(-1) translateY(100%);
         -webkit-transform-origin: left bottom;
         -ms-transform-origin: left bottom;
         transform-origin: left bottom;
    }
     .js-page-in-anim-active .vertical .landing-nav__btn {
         -webkit-transform: rotate(90deg) scaleY(-1) translateY(0);
         -ms-transform: rotate(90deg) scaleY(-1) translateY(0);
         transform: rotate(90deg) scaleY(-1) translateY(0);
    }
     .js-page-in-anim-active .vertical .landing-nav__btn:last-child {
         -webkit-transform: rotate(-90deg) scaleY(-1) translateY(0);
         -ms-transform: rotate(-90deg) scaleY(-1) translateY(0);
         transform: rotate(-90deg) scaleY(-1) translateY(0);
    }
     .js-page-in-anim-active.js-page-out .vertical .landing-nav__btn {
         -webkit-transform: rotate(90deg) scaleY(-1) translateY(-100%);
         -ms-transform: rotate(90deg) scaleY(-1) translateY(-100%);
         transform: rotate(90deg) scaleY(-1) translateY(-100%);
    }
     .js-page-in-anim-active.js-page-out .vertical .landing-nav__btn:last-child {
         -webkit-transform: rotate(-90deg) scaleY(-1) translateY(100%);
         -ms-transform: rotate(-90deg) scaleY(-1) translateY(100%);
         transform: rotate(-90deg) scaleY(-1) translateY(100%);
    }
     .vertical .landing-nav__inner {
         -webkit-transform: scaleY(-1) translateX(-50%);
         -ms-transform: scaleY(-1) translateX(-50%);
         transform: scaleY(-1) translateX(-50%);
    }
     .vertical .landing-nav__btn:first-child .landing-nav__inner {
         -webkit-transform: scaleY(-1) translateX(0);
         -ms-transform: scaleY(-1) translateX(0);
         transform: scaleY(-1) translateX(0);
    }
     .vertical .landing-nav__btn:last-child .landing-nav__inner {
         -webkit-transform: scaleY(1) scaleX(-1);
         -ms-transform: scaleY(1) scaleX(-1);
         transform: scaleY(1) scaleX(-1);
    }
}
/* ========================================================================== 11. Footer ========================================================================== */
 .fixed-footer {
     width: 100%;
     min-width: 100%;
     max-width: 100%;
     background-position: 50% 70%;
     background-size: 100%;
     z-index: 0 !important;
}
/* 11.1. Footer logo ========================================================================== */
 .footer-logo {
     text-align: center;
}
 .footer-logo__img {
     width: auto;
     height: 30px;
}
 .footer-logo-desktop-hidden {
     display: none;
}
 @media only screen and (max-width: 549px) {
     .footer-logo-desktop-hidden {
         display: block;
    }
}
/* Horizontal header */
 .vertical .footer-logo__img {
     width: 30px;
     height: auto;
}
/* 11.2. Footer title & navigation ========================================================================== */
 .footer-nav-list {
     text-align: right;
}
 .footer-nav__btn {
     font-family: 'Montserrat', sans-serif;
     font-size: 14px;
     font-weight: 500;
     letter-spacing: 3px;
     line-height: 1.9;
     text-transform: uppercase;
}
 .js-footer-hover-link {
     opacity: 1;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .js-footer-hover-box.js-footer-hover-active .js-footer-hover-link {
     opacity: .2;
}
 .js-footer-hover-box.js-footer-hover-active .js-footer-hover-link:hover {
     opacity: 1;
}
 @media only screen and (max-width: 767px) {
     .footer-title, .footer-nav-list {
         text-align: center;
    }
     .footer-nav-mobile-padding {
         padding-top: 90px;
    }
}
/* 11.3. Footer information ========================================================================== */
 .footer-address {
     text-align: center;
}
 .footer-phone {
     text-align: right;
}
 @media only screen and (max-width: 999px) {
     .footer-email, .footer-phone {
         text-align: center;
    }
}
/* 11.4. Footer social ========================================================================== */
 .footer-social-desktop-hidden {
     display: none;
}
 @media only screen and (max-width: 549px) {
     .footer-social-desktop-hidden {
         display: block;
    }
}
/* 11.5. Footer copyright ========================================================================== */
 .footer-copyright {
     width: calc(100% - 80px);
     max-width: 1350px;
}
 @media only screen and (max-width: 999px) {
     .footer-copyright {
         width: calc(100% - 40px);
    }
}
 @media only screen and (max-width: 549px) {
     .footer-copyright {
         width: calc(100% - 20px);
    }
}
/* ========================================================================== 12. Magnific popup ========================================================================== */
 .mfp-bg {
     background-color: #1b2a2f;
}
 .mfp-with-zoom .mfp-container, .mfp-with-zoom.mfp-bg {
     opacity: 0;
     -webkit-backface-visibility: hidden;
     -webkit-transition: all .8s cubic-bezier(.858, .01, .068, .99);
     -o-transition: all .8s cubic-bezier(.858, .01, .068, .99);
     transition: all .8s cubic-bezier(.858, .01, .068, .99);
}
 .mfp-with-zoom.mfp-ready .mfp-container {
     opacity: 1;
}
 .mfp-with-zoom.mfp-ready.mfp-bg {
     opacity: .9;
}
 .mfp-with-zoom.mfp-removing .mfp-container, .mfp-with-zoom.mfp-removing.mfp-bg {
     opacity: 0;
}
 .mfp-fade.mfp-bg {
     opacity: 0;
     -webkit-transition: all .8s cubic-bezier(.858, .01, .068, .99);
     -o-transition: all .8s cubic-bezier(.858, .01, .068, .99);
     transition: all .8s cubic-bezier(.858, .01, .068, .99);
}
 .mfp-fade.mfp-bg.mfp-ready {
     opacity: .9;
}
 .mfp-fade.mfp-bg.mfp-removing {
     opacity: 0;
}
 .mfp-fade.mfp-wrap .mfp-content {
     opacity: 0;
     -webkit-transition: all .8s cubic-bezier(.858, .01, .068, .99);
     -o-transition: all .8s cubic-bezier(.858, .01, .068, .99);
     transition: all .8s cubic-bezier(.858, .01, .068, .99);
}
 .mfp-fade.mfp-wrap.mfp-ready .mfp-content {
     opacity: 1;
}
 .mfp-fade.mfp-wrap.mfp-removing .mfp-content {
     opacity: 0;
}
 .mfp-figure:after, .mfp-iframe-scaler iframe {
     -webkit-box-shadow: none;
     box-shadow: none;
}
/* 12.1. Popup counter ========================================================================== */
 .mfp-counter {
     right: 50%;
     font-family: 'Montserrat', sans-serif;
     font-size: 12px;
     font-weight: 700;
     color: #fff;
     -webkit-transform: translateX(50%);
     -ms-transform: translateX(50%);
     transform: translateX(50%);
}
/* 12.2. Popup close button ========================================================================== */
 button.mfp-close {
     position: absolute;
     top: 40px;
     right: 0;
     background-color: rgba(27, 42, 47, .5);
}
 .mfp-close:before, .mfp-close:after {
     content: '';
     width: 15px;
     height: 2px;
     position: absolute;
     left: 5px;
     top: 50%;
     background-color: #fff;
     -webkit-transition: .4s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .4s cubic-bezier(.767, .01, .18, 1.01);
     transition: .4s cubic-bezier(.767, .01, .18, 1.01);
}
 .mfp-close:before {
     -webkit-transform: translateY(-50%) rotate(45deg);
     -ms-transform: translateY(-50%) rotate(45deg);
     transform: translateY(-50%) rotate(45deg);
}
 .mfp-close:after {
     -webkit-transform: translateY(-50%) rotate(315deg);
     -ms-transform: translateY(-50%) rotate(315deg);
     transform: translateY(-50%) rotate(315deg);
}
 .mfp-close:hover:before {
     -webkit-transform: translateY(-50%) rotate(-180deg);
     -ms-transform: translateY(-50%) rotate(-180deg);
     transform: translateY(-50%) rotate(-180deg);
}
 .mfp-close:hover:after {
     -webkit-transform: translateY(-50%) rotate(180deg);
     -ms-transform: translateY(-50%) rotate(180deg);
     transform: translateY(-50%) rotate(180deg);
}
 .mfp-close {
     width: 25px;
     height: 25px;
     padding: 0;
     opacity: 1;
     color: rgba(0, 0, 0, 0);
     -webkit-transition: .8s cubic-bezier(.858, .01, .068, .99);
     -o-transition: .8s cubic-bezier(.858, .01, .068, .99);
     transition: .8s cubic-bezier(.858, .01, .068, .99);
}
 .mfp-close:active {
     top: 40px;
}
 .mfp-close-btn-in .mfp-close {
     color: rgba(0, 0, 0, 0);
}
 .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
     width: 25px;
     padding-right: 0;
     right: 0;
     color: rgba(0, 0, 0, 0);
}
 .mfp-iframe-holder .mfp-close {
     top: -30px;
}
/* ========================================================================== 13. Swiper & popup arrows ========================================================================== */
/* 13.1. Popup arrows ========================================================================== */
 .mfp-arrow {
     margin: 0;
     opacity: 1;
}
 .mfp-arrow:active {
     margin-top: 0;
}
 .mfp-arrow:before, .mfp-arrow:after {
     margin-top: 0;
}
 .mfp-arrow:after {
     border-top-width: 0;
     border-bottom-width: 0;
}
 .mfp-arrow:before {
     opacity: 1;
     border-top-width: 0;
     border-bottom-width: 0;
}
 .mfp-arrow-left:after {
     margin-left: 0;
     border-right: none;
}
 .mfp-arrow-left:before {
     margin-left: 0;
     border-right: none;
}
 .mfp-arrow-right {
     right: 40px;
}
 .mfp-arrow-right:after {
     margin-left: 0;
     border-left: none;
}
 .mfp-arrow-right:before {
     border-left: none;
}
 .mfp-arrow-left, .mfp-arrow-right {
     top: 50%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .mfp-arrow-right {
     right: 40px;
}
 .mfp-arrow-left {
     left: 40px;
}
 @media only screen and (max-width: 999px) {
     .mfp-arrow-right {
         right: 20px;
    }
     .mfp-arrow-left {
         left: 20px;
    }
}
 @media only screen and (max-width: 549px) {
     .mfp-arrow-right {
         right: 10px;
    }
     .mfp-arrow-left {
         left: 10px;
    }
}
/* 13.2. Swiper arrows ========================================================================== */
 .swiper-button-prev-box, .swiper-button-next-box {
     position: absolute;
     bottom: 0;
     z-index: 5;
}
 .swiper-button-prev-box {
     right: calc(66.66% + 20px);
}
 .swiper-button-next-box {
     left: calc(66.66% + 20px);
}
 .one-page-slider-arrow.swiper-button-prev-box {
     left: 5px !important;
     right: auto !important;
}
 .one-page-slider-arrow.swiper-button-next-box {
     left: auto !important;
     right: 5px !important;
}
 .swiper-container-vertical .swiper-button-prev-box {
     left: 16px !important;
     right: auto !important;
     -webkit-transform: rotate(-90deg) scaleY(-1) scaleX(-1) translateX(-100%);
     -ms-transform: rotate(-90deg) scaleY(-1) scaleX(-1) translateX(-100%);
     transform: rotate(-90deg) scaleY(-1) scaleX(-1) translateX(-100%);
     -webkit-transform-origin: left bottom;
     -ms-transform-origin: left bottom;
     transform-origin: left bottom;
}
 .swiper-container-vertical .swiper-button-next-box {
     left: auto !important;
     right: 16px !important;
     -webkit-transform: rotate(90deg) scaleY(-1);
     -ms-transform: rotate(90deg) scaleY(-1);
     transform: rotate(90deg) scaleY(-1);
     -webkit-transform-origin: right bottom;
     -ms-transform-origin: right bottom;
     transform-origin: right bottom;
}
 .js-nav-slider .swiper-button-prev-box, .fullscreen-slider-arrow.swiper-button-prev-box, .one-page-slider-arrow.swiper-button-prev-box, .swiper-container-vertical .swiper-button-prev-box, .js-nav-slider .swiper-button-next-box, .fullscreen-slider-arrow.swiper-button-next-box, .one-page-slider-arrow.swiper-button-next-box, .swiper-container-vertical .swiper-button-next-box {
     bottom: 20px;
}
 @media only screen and (max-width: 999px) {
     .swiper-button-prev-box {
         left: 20px;
         right: auto;
    }
     .swiper-button-next-box {
         left: auto;
         right: 20px;
    }
     .fullscreen-slider-arrow.swiper-button-prev-box {
         left: 80px;
         right: auto;
    }
     .fullscreen-slider-arrow.swiper-button-next-box {
         left: auto;
         right: 80px;
    }
}
 @media only screen and (max-width: 549px) {
     .swiper-button-prev-box {
         left: 10px;
    }
     .swiper-button-next-box {
         right: 10px;
    }
     .fullscreen-slider-arrow.swiper-button-prev-box {
         left: 40px;
    }
     .fullscreen-slider-arrow.swiper-button-next-box {
         right: 40px;
    }
}
 .swiper-button-prev, .swiper-button-next {
     margin-top: 0;
     position: relative !important;
     left: auto !important;
     top: auto !important;
     right: auto !important;
     bottom: auto !important;
     -webkit-transform: none !important;
     -ms-transform: none !important;
     transform: none !important;
     background-image: none;
}
 .swiper-button-prev:focus, .swiper-button-next:focus {
     outline: none !important;
}
/* 13.3. Swiper & popup arrows animations ========================================================================== */
 .swiper-button-prev, .swiper-button-next, .mfp-arrow-left, .mfp-arrow-right {
     width: 50px;
     height: 25px;
}
 .mfp-arrow-left:before, .swiper-button-prev:before {
     content: '';
     width: 16px;
     height: 16px;
     position: absolute;
     left: 1px;
     top: 50%;
     border-left: 2px solid #fff;
     border-bottom: 2px solid #fff;
     -webkit-transform: translateY(-50%) translateX(24px) rotate(45deg);
     -ms-transform: translateY(-50%) translateX(24px) rotate(45deg);
     transform: translateY(-50%) translateX(24px) rotate(45deg);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .swiper-button-prev.black:before {
     border-left: 2px solid #000;
     border-bottom: 2px solid #000;
}
 .mfp-arrow-left:hover:before, .swiper-button-prev:hover:before, .swiper-button-prev.black:hover:before {
     border-left: 2px solid var(--main-color);
     border-bottom: 2px solid var(--main-color);
}
 .mfp-arrow-right:before, .swiper-button-next:before {
     content: '';
     width: 16px;
     height: 16px;
     position: absolute;
     left: auto;
     top: 50%;
     right: 1px;
     border-top: 2px solid #fff;
     border-right: 2px solid #fff;
     -webkit-transform: translateY(-50%) translateX(-24px) rotate(45deg);
     -ms-transform: translateY(-50%) translateX(-24px) rotate(45deg);
     transform: translateY(-50%) translateX(-24px) rotate(45deg);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .swiper-button-next.black:before {
     border-top: 2px solid #000;
     border-right: 2px solid #000;
}
 .mfp-arrow-right:hover:before, .swiper-button-next:hover:before, .swiper-button-next.black:hover:before {
     border-top: 2px solid var(--main-color);
     border-right: 2px solid var(--main-color);
}
 .mfp-arrow-left:hover:before, .swiper-button-prev:hover:before {
     -webkit-transform: translateY(-50%) translateX(0) rotate(45deg);
     -ms-transform: translateY(-50%) translateX(0) rotate(45deg);
     transform: translateY(-50%) translateX(0) rotate(45deg);
}
 .mfp-arrow-right:hover:before, .swiper-button-next:hover:before {
     -webkit-transform: translateY(-50%) translateX(0) rotate(45deg);
     -ms-transform: translateY(-50%) translateX(0) rotate(45deg);
     transform: translateY(-50%) translateX(0) rotate(45deg);
}
 .mfp-arrow-left:after, .mfp-arrow-right:after, .swiper-button-prev:after, .swiper-button-next:after {
     content: '';
     width: 100%;
     height: 3px;
     position: absolute;
     left: 50%;
     top: 50%;
     background-color: var(--main-color);
     -webkit-transform: translate(-50%, -50%) scaleX(0);
     -ms-transform: translate(-50%, -50%) scaleX(0);
     transform: translate(-50%, -50%) scaleX(0);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .mfp-arrow-left:hover:after, .mfp-arrow-right:hover:after, .swiper-button-prev:hover:after, .swiper-button-next:hover:after {
     -webkit-transform: translate(-50%, -50%) scaleX(1);
     -ms-transform: translate(-50%, -50%) scaleX(1);
     transform: translate(-50%, -50%) scaleX(1);
}
/* ========================================================================== 14. Swiper pagination ========================================================================== */
 .pagination-box {
     width: 100%;
     position: absolute;
     left: 50%;
     bottom: 0;
     z-index: 4;
     text-align: center;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
 @media only screen and (max-width: 549px) {
     .pagination-box {
         display: none;
    }
}
 .one-page-slider-pagination.pagination-box, .swiper-container-vertical .pagination-box {
     width: auto;
     left: auto;
     top: 50%;
     right: 20px;
     bottom: auto;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 @media only screen and (max-width: 767px) and (orientation: landscape) {
     .one-page-slider-pagination.pagination-box, .swiper-container-vertical .pagination-box {
         display: none;
    }
}
 .one-page-slider-pagination.pagination-box {
     pointer-events: none;
}
 .swiper-container-vertical .pagination-box {
     right: 17px;
}
 .fullscreen-slider-pagination.pagination-box, .js-nav-slider .pagination-box {
     bottom: 20px;
}
 .swiper-pagination {
     overflow: hidden;
     position: relative;
     width: 30% !important;
     height: auto !important;
     left: 50% !important;
     top: auto !important;
     right: auto !important;
     bottom: auto !important;
     -webkit-transform: translateX(-50%) !important;
     -ms-transform: translateX(-50%) !important;
     transform: translateX(-50%) !important;
}
 .one-page-slider-pagination .swiper-pagination {
     pointer-events: auto;
     -webkit-transform: rotate(90deg) translateY(11px) translateX(50%) !important;
     -ms-transform: rotate(90deg) translateY(11px) translateX(50%) !important;
     transform: rotate(90deg) translateY(11px) translateX(50%) !important;
     -webkit-transform-origin: right center;
     -ms-transform-origin: right center;
     transform-origin: right center;
}
 .swiper-pagination-bullets {
     outline: none;
}
 .swiper-pagination-bullet:focus {
     outline: none !important;
}
/* 14.1. Dynamic pagination ========================================================================== */
 .swiper-pagination-bullets-dynamic {
     white-space: nowrap;
}
 .swiper-container-vertical .swiper-pagination-bullets-dynamic {
     white-space: normal;
}
 .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
     position: relative;
     -webkit-transform: scale(.17) !important;
     -ms-transform: scale(.17) !important;
     transform: scale(.17) !important;
}
 .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
     -webkit-transform: scale(1) !important;
     -ms-transform: scale(1) !important;
     transform: scale(1) !important;
}
 .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
     -webkit-transform: scale(.66) !important;
     -ms-transform: scale(.66) !important;
     transform: scale(.66) !important;
}
 .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
     -webkit-transform: scale(.33) !important;
     -ms-transform: scale(.33) !important;
     transform: scale(.33) !important;
}
 .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
     -webkit-transform: scale(.66) !important;
     -ms-transform: scale(.66) !important;
     transform: scale(.66) !important;
}
 .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
     -webkit-transform: scale(.33) !important;
     -ms-transform: scale(.33) !important;
     transform: scale(.33) !important;
}
 .one-page-slider-pagination .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
     -webkit-transform: rotate(-90deg) scale(.17) !important;
     -ms-transform: rotate(-90deg) scale(.17) !important;
     transform: rotate(-90deg) scale(.17) !important;
}
 .one-page-slider-pagination .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
     -webkit-transform: rotate(-90deg) scale(1) !important;
     -ms-transform: rotate(-90deg) scale(1) !important;
     transform: rotate(-90deg) scale(1) !important;
}
 .one-page-slider-pagination .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
     -webkit-transform: rotate(-90deg) scale(.66) !important;
     -ms-transform: rotate(-90deg) scale(.66) !important;
     transform: rotate(-90deg) scale(.66) !important;
}
 .one-page-slider-pagination .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
     -webkit-transform: rotate(-90deg) scale(.33) !important;
     -ms-transform: rotate(-90deg) scale(.33) !important;
     transform: rotate(-90deg) scale(.33) !important;
}
 .one-page-slider-pagination .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
     -webkit-transform: rotate(-90deg) scale(.66) !important;
     -ms-transform: rotate(-90deg) scale(.66) !important;
     transform: rotate(-90deg) scale(.66) !important;
}
 .one-page-slider-pagination .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
     -webkit-transform: rotate(-90deg) scale(.33) !important;
     -ms-transform: rotate(-90deg) scale(.33) !important;
     transform: rotate(-90deg) scale(.33) !important;
}
/* 14.2. Counter pagination ========================================================================== */
 .counter-pagination .swiper-pagination-bullet {
     overflow: hidden;
     width: 26px;
     height: 26px;
     position: relative;
     opacity: 1;
     border-radius: 0;
     background: transparent;
}
 .counter-pagination .swiper-pagination-bullet {
     margin: 0 5px !important;
}
 .counter-pagination .swiper-pagination-bullet:first-child {
     margin-left: 0 !important;
}
 .counter-pagination .swiper-pagination-bullet:last-child {
     margin-right: 0 !important;
}
 .counter-pagination .swiper-pagination-bullet:before, .counter-pagination .swiper-pagination-bullet:after {
     content: '01';
     position: absolute;
     left: 50%;
     top: 50%;
     font-family: 'Montserrat', sans-serif;
     font-size: 13px;
     font-weight: 700;
     line-height: 1;
     color: #fff;
     -webkit-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
     -webkit-transition: .6s cubic-bezier(.19, .94, .336, 1);
     -o-transition: .6s cubic-bezier(.19, .94, .336, 1);
     transition: .6s cubic-bezier(.19, .94, .336, 1);
}
 .counter-pagination .swiper-pagination-bullet:after {
     font-size: 18px;
     color: var(--main-color);
     -webkit-transform: translateX(-50%) translateY(-40px);
     -ms-transform: translateX(-50%) translateY(-40px);
     transform: translateX(-50%) translateY(-40px);
}
 .counter-pagination.black .swiper-pagination-bullet:before {
     color: #000;
}
 .counter-pagination .swiper-pagination-bullet:hover:before, .counter-pagination.black .swiper-pagination-bullet:hover:before {
     color: var(--main-color);
     -webkit-transition: .6s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .6s cubic-bezier(.17, .85, .438, .99);
     transition: .6s cubic-bezier(.17, .85, .438, .99);
}
 .counter-pagination .swiper-pagination-bullet-active:before {
     -webkit-transform: translateX(-50%) translateY(30px);
     -ms-transform: translateX(-50%) translateY(30px);
     transform: translateX(-50%) translateY(30px);
}
 .counter-pagination .swiper-pagination-bullet-active:after {
     -webkit-transform: translateX(-50%) translateY(-50%);
     -ms-transform: translateX(-50%) translateY(-50%);
     transform: translateX(-50%) translateY(-50%);
}
 .counter-pagination .swiper-pagination-bullet:nth-child(2):before, .counter-pagination .swiper-pagination-bullet:nth-child(2):after {
     content: '02';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(3):before, .counter-pagination .swiper-pagination-bullet:nth-child(3):after {
     content: '03';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(4):before, .counter-pagination .swiper-pagination-bullet:nth-child(4):after {
     content: '04';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(5):before, .counter-pagination .swiper-pagination-bullet:nth-child(5):after {
     content: '05';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(6):before, .counter-pagination .swiper-pagination-bullet:nth-child(6):after {
     content: '06';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(7):before, .counter-pagination .swiper-pagination-bullet:nth-child(7):after {
     content: '07';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(8):before, .counter-pagination .swiper-pagination-bullet:nth-child(8):after {
     content: '08';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(9):before, .counter-pagination .swiper-pagination-bullet:nth-child(9):after {
     content: '09';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(10):before, .counter-pagination .swiper-pagination-bullet:nth-child(10):after {
     content: '10';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(11):before, .counter-pagination .swiper-pagination-bullet:nth-child(11):after {
     content: '11';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(12):before, .counter-pagination .swiper-pagination-bullet:nth-child(12):after {
     content: '12';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(13):before, .counter-pagination .swiper-pagination-bullet:nth-child(13):after {
     content: '13';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(14):before, .counter-pagination .swiper-pagination-bullet:nth-child(14):after {
     content: '14';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(15):before, .counter-pagination .swiper-pagination-bullet:nth-child(15):after {
     content: '15';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(16):before, .counter-pagination .swiper-pagination-bullet:nth-child(16):after {
     content: '16';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(17):before, .counter-pagination .swiper-pagination-bullet:nth-child(17):after {
     content: '17';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(18):before, .counter-pagination .swiper-pagination-bullet:nth-child(18):after {
     content: '18';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(19):before, .counter-pagination .swiper-pagination-bullet:nth-child(19):after {
     content: '19';
}
 .counter-pagination .swiper-pagination-bullet:nth-child(20):before, .counter-pagination .swiper-pagination-bullet:nth-child(20):after {
     content: '20';
}
/* 14.2.1. Counter pagination vertical ========================================================================== */
 .swiper-container-vertical .counter-pagination.swiper-pagination-bullets {
     width: 26px !important;
}
 .swiper-container-vertical .counter-pagination .swiper-pagination-bullet {
     margin: 5px 0 !important;
}
 .swiper-container-vertical .counter-pagination .swiper-pagination-bullet:first-child {
     margin-top: 0 !important;
}
 .swiper-container-vertical .counter-pagination .swiper-pagination-bullet:last-child {
     margin-bottom: 0 !important;
}
/* 14.3. Dots pagination ========================================================================== */
 .dots-pagination .swiper-pagination-bullet {
     width: 10px;
     height: 10px;
     margin: 0 10px !important;
     opacity: 1;
     background-color: #fff;
     -webkit-transform: scale(.5);
     -ms-transform: scale(.5);
     transform: scale(.5);
     -webkit-transition: .8s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .8s cubic-bezier(.225, 1, .316, .99);
     transition: .8s cubic-bezier(.225, 1, .316, .99);
}
 .dots-pagination.black .swiper-pagination-bullet {
     background-color: #000;
}
 .dots-pagination .swiper-pagination-bullet-active {
     margin: 0 30px !important;
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .dots-pagination .swiper-pagination-bullet:first-child, .dots-pagination .swiper-pagination-bullet-active:first-child {
     margin-left: 0 !important;
}
 .dots-pagination .swiper-pagination-bullet:last-child, .dots-pagination .swiper-pagination-bullet-active:last-child {
     margin-right: 0 !important;
}
/* 14.3.1. Dots pagination vertical ========================================================================== */
 .swiper-container-vertical .dots-pagination.swiper-pagination-bullets {
     width: 10px !important;
}
 .swiper-container-vertical .dots-pagination .swiper-pagination-bullet {
     margin: 10px 0 !important;
}
 .swiper-container-vertical .dots-pagination .swiper-pagination-bullet-active {
     margin: 30px 0 !important;
}
 .swiper-container-vertical .dots-pagination .swiper-pagination-bullet:first-child, .swiper-container-vertical .dots-pagination .swiper-pagination-bullet-active:first-child {
     margin-top: 0 !important;
}
 .swiper-container-vertical .dots-pagination .swiper-pagination-bullet:last-child, .swiper-container-vertical .dots-pagination .swiper-pagination-bullet-active:last-child {
     margin-bottom: 0 !important;
}
/* ========================================================================== 15. Swiper sliders ========================================================================== */
 .one-page-slider {
     height: 100vh;
}
 .swiper-wrapper {
     -webkit-transition-timing-function: cubic-bezier(.767, .01, .18, 1.01);
     -o-transition-timing-function: cubic-bezier(.767, .01, .18, 1.01);
     transition-timing-function: cubic-bezier(.767, .01, .18, 1.01);
}
 .fullscreen-slider .swiper-wrapper, .one-page-slider .swiper-wrapper, .js-parallax-slider-2 .swiper-wrapper {
     -webkit-transition-timing-function: cubic-bezier(.25, .31, .18, 1);
     -o-transition-timing-function: cubic-bezier(.25, .31, .18, 1);
     transition-timing-function: cubic-bezier(.25, .31, .18, 1);
}
 .js-infinite-slider .swiper-wrapper {
     -webkit-transition-timing-function: linear;
     -o-transition-timing-function: linear;
     transition-timing-function: linear;
}
 .swiper-slide {
     overflow: hidden;
}
/* Slider background parallax container */
 .swiper-parallax-bg-box {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
}
/* Parallax bg */
 .js-parallax-slide-bg {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     z-index: 0;
}
/* Portfolio details */
 .portfolio-details {
     width: 100%;
     position: absolute;
     left: 0;
     top: 60px;
}
/* Slide opacity animation */
 .slide-opacity-anim {
     opacity: .2;
     -webkit-transition: 1.3s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1.3s cubic-bezier(.225, 1, .316, .99);
     transition: 1.3s cubic-bezier(.225, 1, .316, .99);
}
 .slide-opacity-anim.swiper-slide-active {
     opacity: 1;
}
/* Slider after preloader animation */
 .slider-preloader-anim {
     opacity: 0;
     -webkit-transform: translateY(50%);
     -ms-transform: translateY(50%);
     transform: translateY(50%);
     -webkit-transition: 2s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 2s cubic-bezier(.225, 1, .316, .99);
     transition: 2s cubic-bezier(.225, 1, .316, .99);
}
 .js-page-in-anim-active .slider-preloader-anim {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
/* Portfolio follow slider */
 .js-parallax-slider-2, .js-fade-slider {
     width: 100%;
     height: 33.33vh;
     padding: 33.33vh 0;
     position: absolute;
     left: 0;
     top: 0;
}
 @media only screen and (max-width: 549px) {
     .js-parallax-slider-2, .js-fade-slider {
         height: 40vh;
         padding: 30vh 0;
    }
}
/* Portfolio horizontal follow slider */
 .js-fade-horizontal-slider {
     width: 33.33%;
     height: 100%;
     padding: 0 33.33%;
     position: absolute;
     left: 0;
     top: 0;
}
 @media only screen and (max-width: 1399px) {
     .js-fade-horizontal-slider {
         width: 40%;
         padding: 0 30%;
    }
}
 @media only screen and (max-width: 1199px) {
     .js-fade-horizontal-slider {
         width: 50%;
         padding: 0 25%;
    }
}
 @media only screen and (max-width: 999px) {
     .js-fade-horizontal-slider {
         width: 60%;
         padding: 0 20%;
    }
}
 @media only screen and (max-width: 767px) {
     .js-fade-horizontal-slider {
         width: 70%;
         padding: 0 15%;
    }
}
 @media only screen and (max-width: 549px) {
     .js-fade-horizontal-slider {
         width: 100%;
         padding: 0;
    }
}
/* Portfolio follow slider background */
 .follow-slider-bg, .follow-slider-bg .swiper-slide {
     pointer-events: none;
}
/* Portfolio columns slider */
 .js-columns-slider, .js-columns-parallax-slider {
     position: static;
}
 .js-columns-slider .swiper-slide, .js-columns-parallax-slider .swiper-slide {
     width: auto;
}
 .swiper-parallax-img-box {
     overflow: hidden;
     height: 100%;
}
 .portfolio-column-img {
     width: auto;
     height: 100vh;
     -webkit-transition: 2s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 2s cubic-bezier(.225, 1, .316, .99);
     transition: 2s cubic-bezier(.225, 1, .316, .99);
}
 .hover-box:hover .portfolio-column-img {
     opacity: .7;
     -webkit-transform: scale(1.05);
     -ms-transform: scale(1.05);
     transform: scale(1.05);
}
 .js-columns-parallax-slider .portfolio-column-img, .js-columns-parallax-slider .hover-box:hover .portfolio-column-img {
     opacity: 1;
     -webkit-transform: scale(1.25);
     -ms-transform: scale(1.25);
     transform: scale(1.25);
}
/* Slider gradient shadow */
 .slider-gradient-l-r:before {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     z-index: 2;
     background-image: -webkit-gradient(linear, left top, right top, from(#1b2a2f), color-stop(rgba(27, 42, 47, .75)), color-stop(rgba(27, 42, 47, 0)), color-stop(rgba(27, 42, 47, 0)), color-stop(rgba(27, 42, 47, 0)), color-stop(rgba(27, 42, 47, .75)), to(#1b2a2f));
     background-image: -o-linear-gradient(left, #1b2a2f, rgba(27, 42, 47, .75), rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), rgba(27, 42, 47, .75), #1b2a2f);
     background-image: linear-gradient(to right, #1b2a2f, rgba(27, 42, 47, .75), rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), rgba(27, 42, 47, .75), #1b2a2f);
}
 @media only screen and (max-width: 999px) {
     .slider-gradient-l-r:before {
         background-image: -webkit-gradient(linear, left top, right top, from(#1b2a2f), color-stop(rgba(27, 42, 47, 0)), color-stop(rgba(27, 42, 47, 0)), color-stop(rgba(27, 42, 47, 0)), to(#1b2a2f));
         background-image: -o-linear-gradient(left, #1b2a2f, rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), #1b2a2f);
         background-image: linear-gradient(to right, #1b2a2f, rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), rgba(27, 42, 47, 0), #1b2a2f);
    }
}
 @media only screen and (max-width: 767px) {
     .slider-gradient-l-r:before {
         content: normal;
    }
}
/* Slide scale animation */
 .slide-scale-anim {
     -webkit-transform: scale(.85);
     -ms-transform: scale(.85);
     transform: scale(.85);
     -webkit-transition: 5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 5s cubic-bezier(.225, 1, .316, .99);
     transition: 5s cubic-bezier(.225, 1, .316, .99);
}
 .slide-scale-anim.swiper-slide-active {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
/* Slider right gradient shadow */
 .slider-gradient-right {
     padding-right: 50%;
}
 .slider-gradient-right:before {
     content: '';
     width: 33.33%;
     height: calc(100% - 90px);
     position: absolute;
     top: 0;
     right: 0;
     z-index: 2;
     background-image: -o-linear-gradient(left, rgba(17, 21, 23, 0), rgba(17, 21, 23, .75), #111517);
     background-image: -webkit-gradient(linear, left top, right top, from(rgba(17, 21, 23, 0)), color-stop(rgba(17, 21, 23, .75)), to(#111517));
     background-image: linear-gradient(to right, rgba(17, 21, 23, 0), rgba(17, 21, 23, .75), #111517);
}
 @media only screen and (max-width: 999px) {
     .slider-gradient-right {
         position: relative;
    }
     .slider-gradient-right:before {
         width: 50%;
    }
}
 @media only screen and (max-width: 767px) {
     .slider-gradient-right {
         padding-right: 0;
    }
     .slider-gradient-right:before {
         content: normal;
    }
}
/* About slider */
 .about-slider .swiper-wrapper {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: flex-end;
}
/* ========================================================================== 16. Scroll to buttons ========================================================================== */
/* 16.1. To top button ========================================================================== */
 .scroll-to-btn {
     overflow: hidden;
     width: 20px;
     position: fixed;
     left: 20px !important;
     top: calc(100vh - 60px) !important;
     z-index: 10;
     pointer-events: auto;
     -webkit-transition: .8s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .8s cubic-bezier(.225, 1, .316, .99);
     transition: .8s cubic-bezier(.225, 1, .316, .99);
}
 @media only screen and (max-width: 549px) {
     .scroll-to-btn {
         z-index: 5;
    }
}
 .scroll-to-btn.mPS2id-highlight {
     pointer-events: none;
     opacity: 0;
     -webkit-transform: translateY(-100%);
     -ms-transform: translateY(-100%);
     transform: translateY(-100%);
}
 .scroll-to-btn__box {
     display: block;
     overflow: hidden;
     width: 20px;
     height: 40px;
     position: relative;
}
 .scroll-to-btn__arrow {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     -webkit-transform: translateY(27px);
     -ms-transform: translateY(27px);
     transform: translateY(27px);
     -webkit-transition: .8s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .8s cubic-bezier(.225, 1, .316, .99);
     transition: .8s cubic-bezier(.225, 1, .316, .99);
}
 .js-page-in-anim-active.js-page-out .scroll-to-btn__arrow {
     -webkit-transform: translateY(-18px);
     -ms-transform: translateY(-18px);
     transform: translateY(-18px);
}
 .scroll-to-btn:hover .scroll-to-btn__arrow {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .scroll-to-btn__arrow:before {
     content: '';
     width: 15px;
     height: 15px;
     position: absolute;
     left: 50%;
     top: 4px;
     -webkit-transform: translateX(-50%) rotate(-45deg);
     -ms-transform: translateX(-50%) rotate(-45deg);
     transform: translateX(-50%) rotate(-45deg);
     -webkit-transition: .6s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .6s cubic-bezier(.225, 1, .316, .99);
     transition: .6s cubic-bezier(.225, 1, .316, .99);
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 .js-nav-active .scroll-to-btn__arrow:before {
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .scroll-to-btn__arrow:after {
     content: '';
     width: 2px;
     height: 100%;
     position: absolute;
     left: 50%;
     top: 2px;
     -webkit-transform: scaleY(0) translateX(-50%);
     -ms-transform: scaleY(0) translateX(-50%);
     transform: scaleY(0) translateX(-50%);
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
     -webkit-transition: .6s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .6s cubic-bezier(.225, 1, .316, .99);
     transition: .6s cubic-bezier(.225, 1, .316, .99);
}
 .scroll-to-btn:hover .scroll-to-btn__arrow:after {
     -webkit-transform: scaleY(1) translateX(-50%);
     -ms-transform: scaleY(1) translateX(-50%);
     transform: scaleY(1) translateX(-50%);
}
 .midnightHeader.default .scroll-to-btn__arrow:before, .dark-nav.js-nav-active .midnightHeader.default .scroll-to-btn__arrow:before, .dark-nav.js-nav-active .midnightHeader.black .scroll-to-btn__arrow:before {
     border-top: 2px solid #fff;
     border-right: 2px solid #fff;
}
 .midnightHeader.black .scroll-to-btn__arrow:before, .js-nav-active .midnightHeader.default .scroll-to-btn__arrow:before {
     border-top: 2px solid #000;
     border-right: 2px solid #000;
}
 .midnightHeader.default .scroll-to-btn__arrow:after, .dark-nav.js-nav-active .midnightHeader.default .scroll-to-btn__arrow:after, .dark-nav.js-nav-active .midnightHeader.black .scroll-to-btn__arrow:after {
     background-color: #fff;
}
 .midnightHeader.black .scroll-to-btn__arrow:after, .js-nav-active .midnightHeader.default .scroll-to-btn__arrow:after {
     background-color: #000;
}
/* Landing header */
 .landing-page .scroll-to-btn .scroll-to-btn__arrow:before {
     -webkit-transition-delay: .4s;
     -o-transition-delay: .4s;
     transition-delay: .4s;
}
/* 16.2. Scroll down button ========================================================================== */
 .scroll-to-btn.to-down.mPS2id-highlight, .to-down.scroll-to-btn.js-active {
     pointer-events: none;
     opacity: 0;
     -webkit-transform: translateY(100%);
     -ms-transform: translateY(100%);
     transform: translateY(100%);
}
 .to-down .scroll-to-btn__arrow, .js-page-in-anim-active.js-page-out .to-down .scroll-to-btn__arrow {
     -webkit-transform: translateY(18px);
     -ms-transform: translateY(18px);
     transform: translateY(18px);
}
 .js-page-in-anim-active .to-down .scroll-to-btn__arrow {
     -webkit-transform: translateY(-27px);
     -ms-transform: translateY(-27px);
     transform: translateY(-27px);
}
 .js-page-in-anim-active .to-down.scroll-to-btn:hover .scroll-to-btn__arrow {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .to-down .scroll-to-btn__arrow:before {
     top: auto;
     bottom: 4px;
     -webkit-transform: translateX(-50%) rotate(135deg);
     -ms-transform: translateX(-50%) rotate(135deg);
     transform: translateX(-50%) rotate(135deg);
}
 .to-down .scroll-to-btn__arrow:after {
     top: auto;
     bottom: 2px;
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
}
/* ========================================================================== 17. Buttons ========================================================================== */
/* 17.1. Skew button ========================================================================== */
 .skew-btn {
     display: inline-block;
}
 .skew-btn__box {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
}
 .skew-btn_reverse .skew-btn__box {
     -webkit-box-orient: horizontal;
     -webkit-box-direction: reverse;
     -ms-flex-flow: row-reverse;
     flex-flow: row-reverse;
}
 .skew-btn__content {
     margin-right: 10px;
     font-family: 'Montserrat', sans-serif;
     font-size: 13px;
     font-weight: 600;
     letter-spacing: 4px;
     line-height: 1.2;
     text-transform: uppercase;
     color: #fff;
     -webkit-transform-origin: left bottom;
     -ms-transform-origin: left bottom;
     transform-origin: left bottom;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .skew-btn_reverse .skew-btn__content {
     margin-right: 0;
     margin-left: 14px;
}
 .skew-btn:hover .skew-btn__content {
     color: var(--main-color);
     -webkit-transform: skew(-10deg);
     -ms-transform: skew(-10deg);
     transform: skew(-10deg);
}
 .skew-btn.skew-btn_reverse:hover .skew-btn__content {
     -webkit-transform: skew(10deg);
     -ms-transform: skew(10deg);
     transform: skew(10deg);
}
 .skew-btn__arrow {
     display: inline-block;
     width: 40px;
     height: 20px;
     position: relative;
     z-index: 2;
}
 .skew-btn__arrow:before {
     content: '';
     width: 10px;
     height: 10px;
     position: absolute;
     left: 50%;
     top: 50%;
     border-top: 2px solid #fff;
     border-right: 2px solid #fff;
     -webkit-transform: translateY(-50%) translateX(-50%) rotate(45deg);
     -ms-transform: translateY(-50%) translateX(-50%) rotate(45deg);
     transform: translateY(-50%) translateX(-50%) rotate(45deg);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .skew-btn__arrow.black:before {
     border-top: 2px solid #000;
     border-right: 2px solid #000;
}
 .skew-btn:hover .skew-btn__arrow:before {
     border-top: 2px solid var(--main-color);
     border-right: 2px solid var(--main-color);
     -webkit-transform: translateY(-50%) translateX(6px) rotate(45deg);
     -ms-transform: translateY(-50%) translateX(6px) rotate(45deg);
     transform: translateY(-50%) translateX(6px) rotate(45deg);
}
 .skew-btn__arrow:after {
     content: '';
     width: 28px;
     height: 2px;
     position: absolute;
     top: 50%;
     right: 0;
     background-color: var(--main-color);
     -webkit-transform: translateY(-50%) scaleX(0);
     -ms-transform: translateY(-50%) scaleX(0);
     transform: translateY(-50%) scaleX(0);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .skew-btn:hover .skew-btn__arrow:after {
     -webkit-transform: translateY(-50%) scaleX(1);
     -ms-transform: translateY(-50%) scaleX(1);
     transform: translateY(-50%) scaleX(1);
}
 .skew-btn_reverse .skew-btn__arrow:before {
     -webkit-transform: translateY(-50%) translateX(-50%) rotate(-135deg);
     -ms-transform: translateY(-50%) translateX(-50%) rotate(-135deg);
     transform: translateY(-50%) translateX(-50%) rotate(-135deg);
}
 .skew-btn.skew-btn_reverse:hover .skew-btn__arrow:before {
     -webkit-transform: translateY(-50%) translateX(-18px) rotate(-135deg);
     -ms-transform: translateY(-50%) translateX(-18px) rotate(-135deg);
     transform: translateY(-50%) translateX(-18px) rotate(-135deg);
}
 .skew-btn_reverse .skew-btn__arrow:after {
     left: 0;
     right: auto;
}
/* 17.2. Overlay button ========================================================================== */
 .overlay-btn {
     display: inline-block;
     overflow: hidden;
     padding: 15px 34px 15px 40px;
     position: relative;
     z-index: 2;
     font-family: 'Montserrat', sans-serif;
     font-size: 13px;
     font-weight: 400;
     letter-spacing: 6px;
     line-height: 1.2;
     text-transform: uppercase;
     color: #fff;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .overlay-btn.black {
     color: #000;
}
 .overlay-btn:hover {
     color: #000;
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .overlay-btn.black:hover {
     color: #fff;
}
 .overlay-btn:before, .overlay-btn:after {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     bottom: 0;
     z-index: -1;
     background-color: #fff;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .overlay-btn.black:before, .overlay-btn.black:after {
     background-color: #000;
}
 .overlay-btn:before {
     height: 2px;
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .overlay-btn:hover:before {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .overlay-btn:after {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .overlay-btn:hover:after {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
/* 17.3. Background button ========================================================================== */
 .bg-btn {
     display: inline-block;
     padding: 15px 33px 15px 40px;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 700;
     letter-spacing: 7px;
     line-height: 1.2;
     text-transform: uppercase;
     background-color: #fff;
     color: #000;
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 .bg-btn.black {
     background-color: #000;
     color: #fff;
}
 .bg-btn:hover, .bg-btn.black:hover {
     color: var(--main-color);
}
/* 17.4. Border button ========================================================================== */
 .border-btn {
     display: inline-block;
     position: relative;
}
 .border-btn__inner {
     display: inline-block;
     padding: 20px 15px 20px 15px;
     font-family: 'Montserrat', sans-serif;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 4px;
     line-height: 1.2;
     text-transform: uppercase;
     color: #fff;
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 .border-btn.black .border-btn__inner {
     color: #000;
}
 .border-btn:hover .border-btn__inner, .border-btn.black:hover .border-btn__inner {
     color: var(--main-color);
}
 .border-btn:before, .border-btn:after, .border-btn__inner:before, .border-btn__inner:after {
     content: '';
     position: absolute;
     background-color: #fff;
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 .border-btn.black:before, .border-btn.black:after, .border-btn.black .border-btn__inner:before, .border-btn.black .border-btn__inner:after {
     background-color: #000;
}
 .border-btn:before {
     width: 100%;
     height: 1px;
     left: 0;
     top: 0;
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
     -webkit-transform-origin: right;
     -ms-transform-origin: right;
     transform-origin: right;
}
 .border-btn:after {
     width: 1px;
     height: 100%;
     top: 0;
     right: 0;
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
}
 .border-btn__inner:before {
     width: 100%;
     height: 1px;
     left: 0;
     bottom: 0;
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
     -webkit-transform-origin: left;
     -ms-transform-origin: left;
     transform-origin: left;
}
 .border-btn__inner:after {
     width: 1px;
     height: 100%;
     left: 0;
     top: 0;
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
}
 .border-btn:hover:before, .border-btn:hover .border-btn__inner:before {
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
}
 .border-btn:hover:after, .border-btn:hover .border-btn__inner:after {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 .border-btn__lines-1:before, .border-btn__lines-1:after, .border-btn__lines-2:before, .border-btn__lines-2:after {
     content: '';
     position: absolute;
     background-color: var(--main-color);
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 .border-btn__lines-1:before {
     width: 100%;
     height: 1px;
     left: 0;
     top: 0;
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transform-origin: left;
     -ms-transform-origin: left;
     transform-origin: left;
}
 .border-btn__lines-1:after {
     width: 1px;
     height: 100%;
     top: 0;
     right: 0;
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
}
 .border-btn__lines-2:before {
     width: 100%;
     height: 1px;
     left: 0;
     bottom: 0;
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transform-origin: right;
     -ms-transform-origin: right;
     transform-origin: right;
}
 .border-btn__lines-2:after {
     width: 1px;
     height: 100%;
     left: 0;
     top: 0;
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
}
 .border-btn:hover .border-btn__lines-1:before, .border-btn:hover .border-btn__lines-2:before {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
}
 .border-btn:hover .border-btn__lines-1:after, .border-btn:hover .border-btn__lines-2:after {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
/* 17.5. Icon overlay button ========================================================================== */
 .icon-overlay-btn {
     display: inline-block;
     width: 40px;
     height: 40px;
     position: relative;
     z-index: 2;
     text-align: center;
}
 .icon-overlay-btn:before {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     z-index: -1;
     border-radius: 50%;
     background-color: #fff;
     -webkit-transform: scale(0);
     -ms-transform: scale(0);
     transform: scale(0);
     -webkit-transition: .7s cubic-bezier(.19, .94, .336, 1);
     -o-transition: .7s cubic-bezier(.19, .94, .336, 1);
     transition: .7s cubic-bezier(.19, .94, .336, 1);
}
 .icon-overlay-btn.black:before {
     background-color: #000;
}
 .icon-overlay-btn:hover:before {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .icon-overlay-btn__inner {
     font-size: 15px;
     line-height: 40px;
     color: #fff;
     -webkit-transition: .7s cubic-bezier(.19, .94, .336, 1);
     -o-transition: .7s cubic-bezier(.19, .94, .336, 1);
     transition: .7s cubic-bezier(.19, .94, .336, 1);
}
 .icon-overlay-btn:hover .icon-overlay-btn__inner {
     color: #000;
}
 .icon-overlay-btn.black .icon-overlay-btn__inner {
     color: #000;
}
 .icon-overlay-btn.black:hover .icon-overlay-btn__inner {
     color: #fff;
}
/* 17.6. Icon shadow button ========================================================================== */
 .icon-shadow-btn {
     display: inline-block;
     width: 40px;
     height: 40px;
     position: relative;
     text-align: center;
     border-radius: 50%;
     -webkit-box-shadow: 0 0 10px #fff;
     box-shadow: 0 0 10px #fff;
     -webkit-transition: .7s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .7s cubic-bezier(.225, 1, .316, .99);
     transition: .7s cubic-bezier(.225, 1, .316, .99);
}
 .icon-shadow-btn.black-shadow {
     -webkit-box-shadow: 0 0 10px #000;
     box-shadow: 0 0 10px #000;
}
 .icon-shadow-btn:hover, .icon-shadow-btn.black-shadow:hover {
     -webkit-box-shadow: 0 0 15px var(--main-color);
     box-shadow: 0 0 15px var(--main-color);
}
 .icon-shadow-btn__inner {
     font-size: 15px;
     line-height: 40px;
     color: #fff;
     -webkit-transition: .7s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .7s cubic-bezier(.225, 1, .316, .99);
     transition: .7s cubic-bezier(.225, 1, .316, .99);
}
 .icon-shadow-btn:hover .icon-shadow-btn__inner {
     color: var(--main-color);
}
/* 17.7. Fill button ========================================================================== */
 .fill-btn {
     display: inline-block;
     position: relative;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 700;
     letter-spacing: 5px;
     line-height: 1.2;
     text-transform: uppercase;
     white-space: nowrap;
     color: #fff;
}
 .fill-btn:after {
     content: attr(data-text);
     overflow: hidden;
     width: 0%;
     position: absolute;
     left: 0;
     top: 50%;
     white-space: nowrap;
     background-color: #000;
     color: var(--main-color);
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     transition: .7s cubic-bezier(.767, .01, .18, 1.01);
}
 .fill-btn:hover:after {
     width: 100%;
}
 .fill-btn.to-white:after {
     color: #fff;
}
 .fill-btn.to-black:after {
     color: #000;
}
 .section-bg-black .fill-btn:after, body .content-bg-black .fill-btn:after, html body .text-bg-black.fill-btn:after {
     background-color: #000;
}
 .section-bg-white .fill-btn:after, body .content-bg-white .fill-btn:after, html body .text-bg-white.fill-btn:after {
     background-color: #fff;
}
 .section-bg-light-1 .fill-btn:after, body .content-bg-light-1 .fill-btn:after, html body .text-bg-light-1.fill-btn:after {
     background-color: var(--bg-light-1);
}
 .section-bg-light-2 .fill-btn:after, body .content-bg-light-2 .fill-btn:after, html body .text-bg-light-2.fill-btn:after {
     background-color: var(--bg-light-2);
}
 .section-bg-dark-1 .fill-btn:after, body .content-bg-dark-1 .fill-btn:after, html body .text-bg-dark-1.fill-btn:after {
     background-color: var(--bg-dark-1);
}
 .section-bg-dark-2 .fill-btn:after, body .content-bg-dark-2 .fill-btn:after, html body .text-bg-dark-2.fill-btn:after {
     background-color: var(--bg-dark-2);
}
 body .content-bg-red .fill-btn:after, html body .text-bg-red.fill-btn:after {
     background-color: var(--main-color);
}
 .js-filter-button .fill-btn:hover:after, .js-filter-button.fill-btn:hover:after {
     width: 0%;
}
 body .js-filter-button.js-filter-button-active .fill-btn:after, body .js-filter-button.js-filter-button-active.fill-btn:after {
     width: 100%;
}
/* 17.8. Flip button ========================================================================== */
 .flip-btn {
     display: inline-block;
     overflow: hidden;
     position: relative;
     font-family: 'Montserrat', sans-serif;
     font-size: 12px;
     font-weight: 500;
     letter-spacing: 3px;
     line-height: 1;
     text-transform: uppercase;
     color: transparent !important;
}
 .flip-btn:before, .flip-btn:after {
     content: attr(data-text);
     position: absolute;
     left: 0;
     top: 50%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: .5s cubic-bezier(.858, .01, .068, .99);
     -o-transition: .5s cubic-bezier(.858, .01, .068, .99);
     transition: .5s cubic-bezier(.858, .01, .068, .99);
}
 .flip-btn:before {
     color: #fff;
}
 .flip-btn:after {
     color: var(--main-color);
     -webkit-transform: translateY(-170%);
     -ms-transform: translateY(-170%);
     transform: translateY(-170%);
}
 .flip-btn.to-white:after {
     color: #fff;
}
 .flip-btn.to-black:after {
     color: #000;
}
 .flip-btn:hover:before {
     -webkit-transform: translateY(70%);
     -ms-transform: translateY(70%);
     transform: translateY(70%);
}
 .flip-btn:hover:after {
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .js-filter-button .flip-btn:hover:before, .js-filter-button.flip-btn:hover:before {
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 body .js-filter-button.js-filter-button-active .flip-btn:before, body .js-filter-button.js-filter-button-active.flip-btn:before {
     -webkit-transform: translateY(70%);
     -ms-transform: translateY(70%);
     transform: translateY(70%);
}
 .js-filter-button .flip-btn:hover:after, .js-filter-button.flip-btn:hover:after {
     -webkit-transform: translateY(-170%);
     -ms-transform: translateY(-170%);
     transform: translateY(-170%);
}
 body .js-filter-button.js-filter-button-active .flip-btn:after, body .js-filter-button.js-filter-button-active.flip-btn:after {
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
/* 17.9. Ellipse button ========================================================================== */
 .ellipse-btn {
     display: inline-block;
     height: 50px;
     line-height: 50px;
     padding: 0 38px 0 40px;
     border: 1px solid #fff;
     border-radius: 25px;
     font-family: 'Montserrat', sans-serif;
     font-size: 13px;
     font-weight: 500;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: #fff;
     -webkit-transition: .7s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .7s cubic-bezier(.17, .85, .438, .99);
     transition: .7s cubic-bezier(.17, .85, .438, .99);
}
 .ellipse-btn.black-border {
     border: 1px solid #000;
}
 .ellipse-btn:hover, .ellipse-btn.black-border:hover, body .ellipse-btn.ellipse-btn_red {
     border: 1px solid var(--main-color);
     background-color: var(--main-color);
}
/* 17.10. Play button ========================================================================== */
 .play-button {
     display: block;
     width: 32px;
     height: 44px;
     padding: 18px 20px 18px 28px;
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-box-sizing: content-box;
     box-sizing: content-box;
     border: 1px solid rgba(250, 250, 250, .2);
     border-radius: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
}
 .play-button:before, .play-button:after {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     opacity: 0;
     border-radius: 50%;
     -webkit-box-shadow: 0 0 0 30px rgba(250, 250, 250, .3);
     box-shadow: 0 0 0 30px rgba(250, 250, 250, .3);
     background-color: rgba(250, 250, 250, .3);
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
     -webkit-animation: 1.5s pulse-anim cubic-bezier(.17, .85, .438, .99) infinite;
     animation: 1.5s pulse-anim cubic-bezier(.17, .85, .438, .99) infinite;
}
 .play-button:after {
     -webkit-animation-duration: 3s;
     animation-duration: 3s;
     -webkit-animation-delay: .15s;
     animation-delay: .15s;
}
 .play-button__inner {
     display: block;
     width: 0;
     height: 0;
     border-left: 32px solid rgba(250, 250, 250, .5);
     border-top: 22px solid transparent;
     border-bottom: 22px solid transparent;
}
/* ========================================================================== 18. Typography ========================================================================== */
 body {
     font-family: 'Montserrat', sans-serif;
     font-size: 14px;
     font-weight: 400;
     -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
}
 button, input, select, textarea {
     font-family: 'Montserrat', sans-serif;
     font-size: 14px;
     line-height: 1.75;
}
 p {
     margin: 0;
     font-family: 'Montserrat', sans-serif;
}
 a {
     font-family: 'Montserrat', sans-serif;
     text-decoration: none;
}
 h1, h2, h3, h4, h5, h6 {
     margin: 0;
     font-family: 'Montserrat', sans-serif;
     line-height: 1.2;
}
 h1, h2, h3 {
     font-weight: 700;
}
 h4, h5 {
     font-weight: 600;
}
 h6 {
     font-weight: 500;
}
 h1 {
     font-size: 42px;
}
 h2 {
     font-size: 30px;
}
 h3 {
     font-size: 26px;
}
 h4 {
     font-size: 22px;
}
 h5 {
     font-size: 18px;
}
 h6 {
     font-size: 14px;
}
 @media only screen and (max-width: 999px) {
     h1 {
         font-size: 38px;
    }
     h2 {
         font-size: 28px;
    }
     h3 {
         font-size: 24px;
    }
}
 @media only screen and (max-width: 767px) {
     h1 {
         font-size: 36px;
    }
     h2 {
         font-size: 26px;
    }
     h3 {
         font-size: 24px;
    }
}
 @media only screen and (max-width: 549px) {
     h1 {
         font-size: 34px;
    }
}
 .text-italic {
     font-style: italic;
}
 .text-center {
     text-align: center;
}
 .text-right {
     text-align: right;
}
 .text-justify {
     text-align: justify;
}
 .text-up {
     text-transform: uppercase !important;
}
 .text-up-none {
     text-transform: none !important;
}
 .text-weight-900 {
     font-weight: 900 !important;
}
 .text-weight-800 {
     font-weight: 800 !important;
}
 .text-weight-700 {
     font-weight: 700 !important;
}
 .text-weight-600 {
     font-weight: 600 !important;
}
 .text-weight-500 {
     font-weight: 500 !important;
}
 .text-weight-400 {
     font-weight: 400 !important;
}
 .text-weight-300 {
     font-weight: 300 !important;
}
 .text-weight-200 {
     font-weight: 200 !important;
}
 .text-weight-100 {
     font-weight: 100 !important;
}
 .text-spacing1px {
     letter-spacing: 1px !important;
}
 .text-spacing2px {
     letter-spacing: 2px !important;
}
 .text-spacing3px {
     letter-spacing: 3px !important;
}
 .text-spacing4px {
     letter-spacing: 4px !important;
}
 .text-spacing5px {
     letter-spacing: 5px !important;
}
 .text-spacing0px {
     letter-spacing: 0px !important;
}
 .text-spacing-1px {
     letter-spacing: -1px !important;
}
 .text-spacing-2px {
     letter-spacing: -2px !important;
}
 .text-height-05 {
     line-height: .5 !important;
}
 .text-height-06 {
     line-height: .6 !important;
}
 .text-height-07 {
     line-height: .7 !important;
}
 .text-height-08 {
     line-height: .8 !important;
}
 .text-height-09 {
     line-height: .9 !important;
}
 .text-height-10 {
     line-height: 1 !important;
}
 .text-height-11 {
     line-height: 1.1 !important;
}
 .text-height-12 {
     line-height: 1.2 !important;
}
 .text-height-13 {
     line-height: 1.3 !important;
}
 .text-height-14 {
     line-height: 1.4 !important;
}
 .text-height-15 {
     line-height: 1.5 !important;
}
 .text-height-16 {
     line-height: 1.6 !important;
}
 .text-height-17 {
     line-height: 1.7 !important;
}
 .text-height-18 {
     line-height: 1.8 !important;
}
 .text-height-19 {
     line-height: 1.9 !important;
}
 .text-height-20 {
     line-height: 2 !important;
}
/* 18.1. Headline ========================================================================== */
 .headline-xxxxl {
     font-family: 'Montserrat', sans-serif;
     font-size: 94px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xxxl {
     font-family: 'Montserrat', sans-serif;
     font-size: 86px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xxl {
     font-family: 'Montserrat', sans-serif;
     font-size: 78px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xl {
     font-family: 'Montserrat', sans-serif;
     font-size: 70px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-l {
     font-family: 'Montserrat', sans-serif;
     font-size: 62px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-m {
     font-family: 'Montserrat', sans-serif;
     font-size: 54px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-s {
     font-family: 'Montserrat', sans-serif;
     font-size: 46px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xs {
     font-family: 'Montserrat', sans-serif;
     font-size: 38px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xxs {
     font-family: 'Montserrat', sans-serif;
     font-size: 30px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xxxs {
     font-family: 'Montserrat', sans-serif;
     font-size: 20px;
     font-weight: 300;
     line-height: 1.2;
}
 .headline-xxxxs {
     font-family: 'Montserrat', sans-serif;
     font-size: 14px;
     font-weight: 300;
     line-height: 1.2;
}
 @media only screen and (max-width: 1199px) {
     .headline-xxxxl {
         font-size: 86.5px;
    }
     .headline-xxxl {
         font-size: 79.25px;
    }
     .headline-xxl {
         font-size: 72px;
    }
     .headline-xl {
         font-size: 60px;
    }
     .headline-l {
         font-size: 50px;
    }
     .headline-m {
         font-size: 50.25px;
    }
     .headline-s {
         font-size: 50px;
    }
     .headline-xs {
         font-size: 36px;
    }
     .headline-xxs {
         font-size: 28px;
    }
     .headline-xxxs {
         font-size: 22px;
    }
}
 @media only screen and (max-width: 999px) {
     .headline-xxxxl {
         font-size: 79px;
    }
     .headline-xxxl {
         font-size: 72.5px;
    }
     .headline-xxl {
         font-size: 66px;
    }
     .headline-xl {
         font-size: 50px;
    }
     .headline-l {
         font-size: 40px;
    }
     .headline-m {
         font-size: 46.5px;
    }
     .headline-s {
         font-size: 40px;
    }
     .headline-xs {
         font-size: 33.5px;
    }
     .headline-xxs {
         font-size: 27px;
    }
     .headline-xxxs {
         font-size: 20.5px;
    }
}
 @media only screen and (max-width: 767px) {
     .headline-xxxxl {
         font-size: 71.5px;
    }
     .headline-xxxl {
         font-size: 65.75px;
    }
     .headline-xxl {
         font-size: 60px;
    }
     .headline-xl {
         font-size: 54.25px;
    }
     .headline-l {
         font-size: 48.5px;
    }
     .headline-m {
         font-size: 42.75px;
    }
     .headline-s {
         font-size: 37px;
    }
     .headline-xs {
         font-size: 31.25px;
    }
     .headline-xxs {
         font-size: 25.5px;
    }
     .headline-xxxs {
         font-size: 19.75px;
    }
}
 @media only screen and (max-width: 549px) {
     .headline-xxxxl {
         font-size: 36px;
    }
     .headline-xxxl {
         font-size: 46px;
    }
     .headline-xxl {
         font-size: 54px;
    }
     .headline-xl {
         font-size: 49px;
    }
     .headline-l {
         font-size: 44px;
    }
     .headline-m {
         font-size: 39px;
    }
     .headline-s {
         font-size: 34px;
    }
     .headline-xs {
         font-size: 29px;
    }
     .headline-xxs {
         font-size: 18px;
    }
     .headline-xxxs {
         font-size: 19px;
    }
     .about #down .headline-xl {
         font-size: 32px;
    }
}
 @media only screen and (max-width: 399px) {
     .headline-xxxxl {
         font-size: 36.5px;
    }
     .headline-xxxl {
         font-size: 52.25px;
    }
     .headline-xxl {
         font-size: 48px;
    }
     .headline-xl {
         font-size: 43.75px;
    }
     .headline-l {
         font-size: 39.5px;
    }
     .headline-m {
         font-size: 35.25px;
    }
     .headline-s {
         font-size: 31px;
    }
     .headline-xs {
         font-size: 26.75px;
    }
     .headline-xxs {
         font-size: 22.5px;
    }
     .headline-xxxs {
         font-size: 18.25px;
    }
}
/* 18.2. Subhead ========================================================================== */
 .subhead-xxl {
     font-family: 'Montserrat', sans-serif;
     font-size: 33px;
     font-weight: 400;
     line-height: 1.4;
}
 .subhead-xl {
     font-family: 'Montserrat', sans-serif;
     font-size: 30px;
     font-weight: 400;
     line-height: 1.4;
}
 .subhead-l {
     font-family: 'Montserrat', sans-serif;
     font-size: 27px;
     font-weight: 400;
     line-height: 1.4;
}
 .subhead-m {
     font-family: 'Montserrat', sans-serif;
     font-size: 24px;
     font-weight: 400;
     line-height: 1.4;
}
 .subhead-s {
     font-family: 'Montserrat', sans-serif;
     font-size: 21px;
     font-weight: 400;
     line-height: 1.4;
}
 .subhead-xs {
     font-family: 'Montserrat', sans-serif;
     font-size: 18px;
     font-weight: 400;
     line-height: 1.4;
}
 .subhead-xxs {
     font-family: 'Montserrat', sans-serif;
     font-size: 15px;
     font-weight: 400;
     line-height: 1.4;
}
 @media only screen and (max-width: 1199px) {
     .subhead-xxl {
         font-size: 31.5px;
    }
     .subhead-xl {
         font-size: 28.75px;
    }
     .subhead-l {
         font-size: 26px;
    }
     .subhead-m {
         font-size: 23.25px;
    }
     .subhead-s {
         font-size: 20.5px;
    }
     .subhead-xs {
         font-size: 17.75px;
    }
}
 @media only screen and (max-width: 999px) {
     .subhead-xxl {
         font-size: 30px;
    }
     .subhead-xl {
         font-size: 27.5px;
    }
     .subhead-l {
         font-size: 25px;
    }
     .subhead-m {
         font-size: 22.5px;
    }
     .subhead-s {
         font-size: 20px;
    }
     .subhead-xs {
         font-size: 17.5px;
    }
}
 @media only screen and (max-width: 767px) {
     .subhead-xxl {
         font-size: 28.5px;
    }
     .subhead-xl {
         font-size: 26.25px;
    }
     .subhead-l {
         font-size: 24px;
    }
     .subhead-m {
         font-size: 21.75px;
    }
     .subhead-s {
         font-size: 19.5px;
    }
     .subhead-xs {
         font-size: 17.25px;
    }
}
 @media only screen and (max-width: 549px) {
     .subhead-xxl {
         font-size: 27px;
    }
     .subhead-xl {
         font-size: 25px;
    }
     .subhead-l {
         font-size: 23px;
    }
     .subhead-m {
         font-size: 21px;
    }
     .subhead-s {
         font-size: 13px;
    }
     .subhead-xs {
         font-size: 17px;
    }
}
 @media only screen and (max-width: 399px) {
     .subhead-xxl {
         font-size: 25.5px;
    }
     .subhead-xl {
         font-size: 23.75px;
    }
     .subhead-l {
         font-size: 22px;
    }
     .subhead-m {
         font-size: 20.25px;
    }
     .subhead-s {
         font-size: 18.5px;
    }
     .subhead-xs {
         font-size: 16.75px;
    }
}
/* 18.3. Body text ========================================================================== */
 .body-text-xl {
     font-family: 'Montserrat', sans-serif;
     font-size: 21px;
     font-weight: 200;
     line-height: 1.9;
}
 .body-text-l {
     font-family: 'Montserrat', sans-serif;
     font-size: 19px;
     font-weight: 200;
     line-height: 1.9;
}
 .body-text-m {
     font-family: 'Montserrat', sans-serif;
     font-size: 17px;
     font-weight: 200;
     line-height: 1.9;
}
 .body-text-s {
     font-family: 'Montserrat', sans-serif;
     font-size: 15px;
     font-weight: 200;
     line-height: 1.9;
}
 .body-text-xs {
     font-family: 'Montserrat', sans-serif;
     font-size: 13px;
     font-weight: 200;
     line-height: 1.9;
}
 @media only screen and (max-width: 1199px) {
     .body-text-xl {
         font-size: 20.5px;
    }
     .body-text-l {
         font-size: 18.625px;
    }
     .body-text-m {
         font-size: 16.75px;
    }
     .body-text-s {
         font-size: 14.875px;
    }
}
 @media only screen and (max-width: 999px) {
     .body-text-xl {
         font-size: 20px;
    }
     .body-text-l {
         font-size: 18.25px;
    }
     .body-text-m {
         font-size: 16.5px;
    }
     .body-text-s {
         font-size: 14.75px;
    }
}
 @media only screen and (max-width: 767px) {
     .body-text-xl {
         font-size: 19.5px;
    }
     .body-text-l {
         font-size: 17.875px;
    }
     .body-text-m {
         font-size: 16.25px;
    }
     .body-text-s {
         font-size: 14.625px;
    }
}
 @media only screen and (max-width: 549px) {
     .body-text-xl {
         font-size: 19px;
    }
     .body-text-l {
         font-size: 17.5px;
    }
     .body-text-m {
         font-size: 16px;
    }
     .body-text-s {
         font-size: 14.5px;
    }
}
 @media only screen and (max-width: 399px) {
     .body-text-xl {
         font-size: 18.5px;
    }
     .body-text-l {
         font-size: 17.125px;
    }
     .body-text-m {
         font-size: 15.75px;
    }
     .body-text-s {
         font-size: 14.375px;
    }
}
/* 18.4. Copyright ========================================================================== */
 .copyright-style {
     font-family: 'Montserrat', sans-serif;
     font-size: 10px;
     font-weight: 400;
     letter-spacing: 5px;
     line-height: 1;
     text-transform: uppercase;
     display: inline-flex;
     align-items: flex-end;
}
 .copyright-style img {
     width: auto;
     height: 18px;
}
/* 18.5. Quote ========================================================================== */
 .quote {
     padding-left: 50px;
     position: relative;
}
 .quote:after {
     content: '\f10e';
     position: absolute;
     left: 0;
     top: 0;
     z-index: 4;
     font-family: Font Awesome;
     font-size: 25px;
     line-height: 25px;
     color: var(--main-color);
}
 .quote.quote_top {
     padding-left: 0;
     padding-top: 55px;
}
 .quote.quote_top:after {
     left: 50%;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
 .quote.quote_bottom {
     padding-left: 0;
     padding-bottom: 55px;
}
 .quote.quote_bottom:after {
     left: 50%;
     top: auto;
     bottom: 0;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
/* 18.6. Vertical text ========================================================================== */
 .vertical-text {
     display: inline-block;
     -webkit-transform: rotate(90deg) scaleY(-1);
     -ms-transform: rotate(90deg) scaleY(-1);
     transform: rotate(90deg) scaleY(-1);
     -webkit-transform-origin: left top;
     -ms-transform-origin: left top;
     transform-origin: left top;
}
 .vertical-text.right {
     display: inline-block;
     -webkit-transform: rotate(-90deg) scaleY(-1);
     -ms-transform: rotate(-90deg) scaleY(-1);
     transform: rotate(-90deg) scaleY(-1);
     -webkit-transform-origin: right top;
     -ms-transform-origin: right top;
     transform-origin: right top;
}
 .vertical-text.center {
     -webkit-transform: rotate(90deg) scaleY(-1) translateX(-50%) translateY(50%);
     -ms-transform: rotate(90deg) scaleY(-1) translateX(-50%) translateY(50%);
     transform: rotate(90deg) scaleY(-1) translateX(-50%) translateY(50%);
     -webkit-transform-origin: left center;
     -ms-transform-origin: left center;
     transform-origin: left center;
}
 .vertical-text.right.center {
     -webkit-transform: rotate(-90deg) scaleY(-1) translateX(50%) translateY(50%);
     -ms-transform: rotate(-90deg) scaleY(-1) translateX(50%) translateY(50%);
     transform: rotate(-90deg) scaleY(-1) translateX(50%) translateY(50%);
     -webkit-transform-origin: right center;
     -ms-transform-origin: right center;
     transform-origin: right center;
}
 .vertical-text.bottom {
     -webkit-transform: rotate(90deg) scaleY(-1) translateX(-100%) translateY(100%);
     -ms-transform: rotate(90deg) scaleY(-1) translateX(-100%) translateY(100%);
     transform: rotate(90deg) scaleY(-1) translateX(-100%) translateY(100%);
     -webkit-transform-origin: left bottom;
     -ms-transform-origin: left bottom;
     transform-origin: left bottom;
}
 .vertical-text.right.bottom {
     -webkit-transform: rotate(-90deg) scaleY(-1) translateX(100%) translateY(100%);
     -ms-transform: rotate(-90deg) scaleY(-1) translateX(100%) translateY(100%);
     transform: rotate(-90deg) scaleY(-1) translateX(100%) translateY(100%);
     -webkit-transform-origin: right bottom;
     -ms-transform-origin: right bottom;
     transform-origin: right bottom;
}
 .vertical-text__inner {
     display: inline-block;
     -webkit-transform: scaleX(-1);
     -ms-transform: scaleX(-1);
     transform: scaleX(-1);
}
/* 18.7. Description ========================================================================== */
 .description {
     width: 100%;
     position: absolute;
     left: 0;
     bottom: 20px;
}
/* 18.8. Fontawesome icon ========================================================================== */
 .fontawesome-icon {
     font-size: 25px;
     line-height: 25px;
}
/* ========================================================================== 19. Animations ========================================================================== */
 .js-scrollanim {
     pointer-events: none;
}
 .js-scrollanim.js-scrollanim-active {
     pointer-events: auto;
}
/* 19.1. Animation delays ========================================================================== */
 .tr-delay-01, .tr-delay-01:before, .tr-delay-01:after {
     -webkit-transition-delay: .1s !important;
     -o-transition-delay: .1s !important;
     transition-delay: .1s !important;
}
 .tr-delay-02, .tr-delay-02:before, .tr-delay-02:after {
     -webkit-transition-delay: .2s !important;
     -o-transition-delay: .2s !important;
     transition-delay: .2s !important;
}
 .tr-delay-03, .tr-delay-03:before, .tr-delay-03:after {
     -webkit-transition-delay: .3s !important;
     -o-transition-delay: .3s !important;
     transition-delay: .3s !important;
}
 .tr-delay-04, .tr-delay-04:before, .tr-delay-04:after {
     -webkit-transition-delay: .4s !important;
     -o-transition-delay: .4s !important;
     transition-delay: .4s !important;
}
 .tr-delay-05, .tr-delay-05:before, .tr-delay-05:after {
     -webkit-transition-delay: .5s !important;
     -o-transition-delay: .5s !important;
     transition-delay: .5s !important;
}
 .tr-delay-06, .tr-delay-06:before, .tr-delay-06:after {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .tr-delay-07, .tr-delay-07:before, .tr-delay-07:after {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .tr-delay-08, .tr-delay-08:before, .tr-delay-08:after {
     -webkit-transition-delay: .8s !important;
     -o-transition-delay: .8s !important;
     transition-delay: .8s !important;
}
 .tr-delay-09, .tr-delay-09:before, .tr-delay-09:after {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .tr-delay-10, .tr-delay-10:before, .tr-delay-10:after {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
 .swiper-slide .tr-delay-01, .swiper-slide .tr-delay-02, .swiper-slide .tr-delay-03, .swiper-slide .tr-delay-04, .swiper-slide .tr-delay-05, .swiper-slide .tr-delay-06, .swiper-slide .tr-delay-07, .swiper-slide .tr-delay-08, .swiper-slide .tr-delay-09, .swiper-slide .tr-delay-10, .swiper-slide .tr-delay-01:before, .swiper-slide .tr-delay-02:before, .swiper-slide .tr-delay-03:before, .swiper-slide .tr-delay-04:before, .swiper-slide .tr-delay-05:before, .swiper-slide .tr-delay-06:before, .swiper-slide .tr-delay-07:before, .swiper-slide .tr-delay-08:before, .swiper-slide .tr-delay-09:before, .swiper-slide .tr-delay-10:before, .swiper-slide .tr-delay-01:after, .swiper-slide .tr-delay-02:after, .swiper-slide .tr-delay-03:after, .swiper-slide .tr-delay-04:after, .swiper-slide .tr-delay-05:after, .swiper-slide .tr-delay-06:after, .swiper-slide .tr-delay-07:after, .swiper-slide .tr-delay-08:after, .swiper-slide .tr-delay-09:after, .swiper-slide .tr-delay-10:after {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-01, .swiper-slide.swiper-slide-active .tr-delay-01:before, .swiper-slide.swiper-slide-active .tr-delay-01:after {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-02, .swiper-slide.swiper-slide-active .tr-delay-02:before, .swiper-slide.swiper-slide-active .tr-delay-02:after {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-03, .swiper-slide.swiper-slide-active .tr-delay-03:before, .swiper-slide.swiper-slide-active .tr-delay-03:after {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-04, .swiper-slide.swiper-slide-active .tr-delay-04:before, .swiper-slide.swiper-slide-active .tr-delay-04:after {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-05, .swiper-slide.swiper-slide-active .tr-delay-05:before, .swiper-slide.swiper-slide-active .tr-delay-05:after {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-06, .swiper-slide.swiper-slide-active .tr-delay-06:before, .swiper-slide.swiper-slide-active .tr-delay-06:after {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-07, .swiper-slide.swiper-slide-active .tr-delay-07:before, .swiper-slide.swiper-slide-active .tr-delay-07:after {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-08, .swiper-slide.swiper-slide-active .tr-delay-08:before, .swiper-slide.swiper-slide-active .tr-delay-08:after {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-09, .swiper-slide.swiper-slide-active .tr-delay-09:before, .swiper-slide.swiper-slide-active .tr-delay-09:after {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-10, .swiper-slide.swiper-slide-active .tr-delay-10:before, .swiper-slide.swiper-slide-active .tr-delay-10:after {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
/* 19.2. Image scale animation ========================================================================== */
 .anim-img-scale {
     overflow: hidden;
     -webkit-transform: scale(.5);
     -ms-transform: scale(.5);
     transform: scale(.5);
}
 .anim-img-scale__inner {
     -webkit-transform: scale(1.6);
     -ms-transform: scale(1.6);
     transform: scale(1.6);
}
 .js-img-scale.js-img-scale-active.anim-img-scale, .js-img-scale.js-img-scale-active .anim-img-scale__inner, .js-slider-scroll-anim-active .swiper-slide.swiper-slide-active .anim-img-scale, .js-slider-scroll-anim-active .swiper-slide.swiper-slide-active .anim-img-scale__inner, .js-page-in-anim-active .after-preloader-anim.anim-img-scale, .js-page-in-anim-active .after-preloader-anim .anim-img-scale, .js-page-in-anim-active .after-preloader-anim .anim-img-scale__inner {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .js-img-scale-active.anim-img-scale, .after-preloader-anim.anim-img-scale, .after-preloader-anim .anim-img-scale {
     -webkit-transition: 1.8s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.8s cubic-bezier(.17, .85, .438, .99);
     transition: 1.8s cubic-bezier(.17, .85, .438, .99);
}
 .swiper-slide .anim-img-scale {
     -webkit-transform: scale(.8);
     -ms-transform: scale(.8);
     transform: scale(.8);
}
 .js-slider-scroll-anim-active .swiper-slide .anim-img-scale {
     -webkit-transition: 2.2s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 2.2s cubic-bezier(.17, .85, .438, .99);
     transition: 2.2s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-img-scale-active .anim-img-scale__inner, .after-preloader-anim .anim-img-scale__inner {
     -webkit-transition: 1.2s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.2s cubic-bezier(.17, .85, .438, .99);
     transition: 1.2s cubic-bezier(.17, .85, .438, .99);
}
 .swiper-slide .anim-img-scale__inner {
     -webkit-transform: scale(1.5);
     -ms-transform: scale(1.5);
     transform: scale(1.5);
}
 .js-slider-scroll-anim-active .swiper-slide .anim-img-scale__inner {
     -webkit-transition: 1.9s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.9s cubic-bezier(.17, .85, .438, .99);
     transition: 1.9s cubic-bezier(.17, .85, .438, .99);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 body .hover-box:hover .anim-img-scale_hover {
     -webkit-transform: scale(.9);
     -ms-transform: scale(.9);
     transform: scale(.9);
     -webkit-transition: 1.8s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.8s cubic-bezier(.17, .85, .438, .99);
     transition: 1.8s cubic-bezier(.17, .85, .438, .99);
}
 .hover-box:hover .anim-img-scale_hover .anim-img-scale__inner {
     -webkit-transform: scale(1.15);
     -ms-transform: scale(1.15);
     transform: scale(1.15);
     -webkit-transition: 1.2s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.2s cubic-bezier(.17, .85, .438, .99);
     transition: 1.2s cubic-bezier(.17, .85, .438, .99);
}
/* 19.3. Image reveal animation ========================================================================== */
 .anim-img-reveal {
     overflow: hidden;
     position: relative;
}
 .anim-img-reveal:before, .anim-img-reveal:after, .anim-img-reveal__hidden:before, .anim-img-reveal__hidden:after {
     content: '';
     position: absolute;
     z-index: 2;
     background-color: #000;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .section-bg-black .anim-img-reveal:before, .section-bg-black .anim-img-reveal:after, .section-bg-black .anim-img-reveal__hidden:before, .section-bg-black .anim-img-reveal__hidden:after, body .content-bg-black .anim-img-reveal:before, body .content-bg-black .anim-img-reveal:after, body .content-bg-black .anim-img-reveal__hidden:before, body .content-bg-black .anim-img-reveal__hidden:after {
     background-color: #000;
}
 .section-bg-white .anim-img-reveal:before, .section-bg-white .anim-img-reveal:after, .section-bg-white .anim-img-reveal__hidden:before, .section-bg-white .anim-img-reveal__hidden:after, body .content-bg-white .anim-img-reveal:before, body .content-bg-white .anim-img-reveal:after, body .content-bg-white .anim-img-reveal__hidden:before, body .content-bg-white .anim-img-reveal__hidden:after {
     background-color: #fff;
}
 .section-bg-light-1 .anim-img-reveal:before, .section-bg-light-1 .anim-img-reveal:after, .section-bg-light-1 .anim-img-reveal__hidden:before, .section-bg-light-1 .anim-img-reveal__hidden:after, body .content-bg-light-1 .anim-img-reveal:before, body .content-bg-light-1 .anim-img-reveal:after, body .content-bg-light-1 .anim-img-reveal__hidden:before, body .content-bg-light-1 .anim-img-reveal__hidden:after {
     background-color: var(--bg-light-1);
}
 .section-bg-light-2 .anim-img-reveal:before, .section-bg-light-2 .anim-img-reveal:after, .section-bg-light-2 .anim-img-reveal__hidden:before, .section-bg-light-2 .anim-img-reveal__hidden:after, body .content-bg-light-2 .anim-img-reveal:before, body .content-bg-light-2 .anim-img-reveal:after, body .content-bg-light-2 .anim-img-reveal__hidden:before, body .content-bg-light-2 .anim-img-reveal__hidden:after {
     background-color: var(--bg-light-2);
}
 .section-bg-dark-1 .anim-img-reveal:before, .section-bg-dark-1 .anim-img-reveal:after, .section-bg-dark-1 .anim-img-reveal__hidden:before, .section-bg-dark-1 .anim-img-reveal__hidden:after, body .content-bg-dark-1 .anim-img-reveal:before, body .content-bg-dark-1 .anim-img-reveal:after, body .content-bg-dark-1 .anim-img-reveal__hidden:before, body .content-bg-dark-1 .anim-img-reveal__hidden:after {
     background-color: var(--bg-dark-1);
}
 .section-bg-dark-2 .anim-img-reveal:before, .section-bg-dark-2 .anim-img-reveal:after, .section-bg-dark-2 .anim-img-reveal__hidden:before, .section-bg-dark-2 .anim-img-reveal__hidden:after, body .content-bg-dark-2 .anim-img-reveal:before, body .content-bg-dark-2 .anim-img-reveal:after, body .content-bg-dark-2 .anim-img-reveal__hidden:before, body .content-bg-dark-2 .anim-img-reveal__hidden:after {
     background-color: var(--bg-dark-2);
}
 body .content-bg-red .anim-img-reveal:before, body .content-bg-red .anim-img-reveal:after, body .content-bg-red .anim-img-reveal__hidden:before, body .content-bg-red .anim-img-reveal__hidden:after {
     background-color: var(--main-color);
}
 .anim-img-reveal:before {
     left: -1%;
     top: -1%;
     right: -1%;
     bottom: 66%;
}
 .anim-img-reveal:after {
     left: -1%;
     right: -1%;
     bottom: -1%;
     top: 66%;
     -webkit-transition-delay: .2s;
     -o-transition-delay: .2s;
     transition-delay: .2s;
}
 .anim-img-reveal__hidden:before {
     left: -1%;
     top: 33%;
     right: 49%;
     bottom: 33%;
     -webkit-transition-delay: .1s;
     -o-transition-delay: .1s;
     transition-delay: .1s;
}
 .anim-img-reveal__hidden:after {
     left: 49%;
     top: 33%;
     right: -1%;
     bottom: 33%;
     -webkit-transition-delay: .1s;
     -o-transition-delay: .1s;
     transition-delay: .1s;
}
 .js-scrollanim.js-scrollanim-active.anim-img-reveal:before, .js-scrollanim.js-scrollanim-active .anim-img-reveal:before, .js-page-in-anim-active .after-preloader-anim.anim-img-reveal:before, .js-page-in-anim-active .after-preloader-anim .anim-img-reveal:before, .js-scrollanim.js-scrollanim-active .anim-img-reveal__hidden:after, .js-page-in-anim-active .after-preloader-anim .anim-img-reveal__hidden:after {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
}
 .js-scrollanim.js-scrollanim-active.anim-img-reveal:after, .js-scrollanim.js-scrollanim-active .anim-img-reveal:after, .js-page-in-anim-active .after-preloader-anim.anim-img-reveal:after, .js-page-in-anim-active .after-preloader-anim .anim-img-reveal:after, .js-scrollanim.js-scrollanim-active .anim-img-reveal__hidden:before, .js-page-in-anim-active .after-preloader-anim .anim-img-reveal__hidden:before {
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
}
 .anim-img-reveal__hidden {
     overflow: hidden;
     border: 1px solid #000;
}
 .section-bg-black .anim-img-reveal__hidden, body .content-bg-black .anim-img-reveal__hidden {
     border: 1px solid #000;
}
 .section-bg-white .anim-img-reveal__hidden, body .content-bg-white .anim-img-reveal__hidden {
     border: 1px solid #fff;
}
 .section-bg-light-1 .anim-img-reveal__hidden, body .content-bg-light-1 .anim-img-reveal__hidden {
     border: 1px solid var(--bg-light-1);
}
 .section-bg-light-2 .anim-img-reveal__hidden, body .content-bg-light-2 .anim-img-reveal__hidden {
     border: 1px solid var(--bg-light-2);
}
 .section-bg-dark-1 .anim-img-reveal__hidden, body .content-bg-dark-1 .anim-img-reveal__hidden {
     border: 1px solid var(--bg-dark-1);
}
 .section-bg-dark-2 .anim-img-reveal__hidden, body .content-bg-dark-2 .anim-img-reveal__hidden {
     border: 1px solid var(--bg-dark-2);
}
 body .content-bg-red .anim-img-reveal__hidden {
     border: 1px solid var(--main-color);
}
 .anim-img-reveal__scale {
     -webkit-transform: rotate(10deg) scale(1.4);
     -ms-transform: rotate(10deg) scale(1.4);
     transform: rotate(10deg) scale(1.4);
     -webkit-transition: 1.5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1.5s cubic-bezier(.225, 1, .316, .99);
     transition: 1.5s cubic-bezier(.225, 1, .316, .99);
}
 .js-scrollanim.js-scrollanim-active .anim-img-reveal__scale, .js-page-in-anim-active .after-preloader-anim .anim-img-reveal__scale {
     -webkit-transform: rotate(0deg) scale(1);
     -ms-transform: rotate(0deg) scale(1);
     transform: rotate(0deg) scale(1);
}
/* 19.4. Text reveal animation ========================================================================== */
 .anim-text-reveal {
     overflow: hidden;
     position: relative;
}
 .anim-text-reveal:before {
     content: '';
     position: absolute;
     left: 0;
     top: 0;
     right: 0;
     bottom: 0;
     z-index: 3;
     background-color: #000;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
     -webkit-transition: 3s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 3s cubic-bezier(.225, 1, .316, .99);
     transition: 3s cubic-bezier(.225, 1, .316, .99);
}
 .section-bg-black .anim-text-reveal:before, body .content-bg-black .anim-text-reveal:before, html body .text-bg-black.anim-text-reveal:before {
     background-color: #000;
}
 .section-bg-white .anim-text-reveal:before, body .content-bg-white .anim-text-reveal:before, html body .text-bg-white.anim-text-reveal:before {
     background-color: #fff;
}
 .section-bg-light-1 .anim-text-reveal:before, body .content-bg-light-1 .anim-text-reveal:before, html body .text-bg-light-1.anim-text-reveal:before {
     background-color: var(--bg-light-1);
}
 .section-bg-light-2 .anim-text-reveal:before, body .content-bg-light-2 .anim-text-reveal:before, html body .text-bg-light-2.anim-text-reveal:before {
     background-color: var(--bg-light-2);
}
 .section-bg-dark-1 .anim-text-reveal:before, body .content-bg-dark-1 .anim-text-reveal:before, html body .text-bg-dark-1.anim-text-reveal:before {
     background-color: var(--bg-dark-1);
}
 .section-bg-dark-2 .anim-text-reveal:before, body .content-bg-dark-2 .anim-text-reveal:before, html body .text-bg-dark-2.anim-text-reveal:before {
     background-color: var(--bg-dark-2);
}
 body .content-bg-red .anim-text-reveal:before, html body .text-bg-red.anim-text-reveal:before {
     background-color: var(--main-color);
}
 .js-page-in-anim-active .after-preloader-anim.anim-text-reveal:before, .js-page-in-anim-active .after-preloader-anim .anim-text-reveal:before, .js-scrollanim.js-scrollanim-active.anim-text-reveal:before, .js-scrollanim.js-scrollanim-active .anim-text-reveal:before {
     -webkit-transform: translateY(110%);
     -ms-transform: translateY(110%);
     transform: translateY(110%);
}
/* 19.5. Fade animation ========================================================================== */
 .anim-fade {
     display: inline-block;
     opacity: 1;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-page-in-anim-active .after-preloader-anim.anim-fade, .js-page-in-anim-active .after-preloader-anim .anim-fade, .js-scrollanim.js-scrollanim-active.anim-fade, .js-scrollanim.js-scrollanim-active .anim-fade, .swiper-slide.swiper-slide-active .anim-fade {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .swiper-slide .anim-fade {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .anim-fade {
     pointer-events: auto;
}
 .swiper-slide .anim-fade {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .swiper-slide.swiper-slide-active .anim-fade {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
/* 19.6. Slide animation ========================================================================== */
 .anim-slide {
     display: inline-block;
     -webkit-transform: translateY(105%);
     -ms-transform: translateY(105%);
     transform: translateY(105%);
     -webkit-transition: 1.6s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.6s cubic-bezier(.17, .85, .438, .99);
     transition: 1.6s cubic-bezier(.17, .85, .438, .99);
}
 .js-page-in-anim-active .after-preloader-anim.anim-slide, .js-page-in-anim-active .after-preloader-anim .anim-slide, .js-scrollanim.js-scrollanim-active.anim-slide, .js-scrollanim.js-scrollanim-active .anim-slide, .swiper-slide.swiper-slide-active .anim-slide {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .swiper-slide .anim-slide {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .anim-slide {
     pointer-events: auto;
}
 .swiper-slide .anim-slide {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .swiper-slide.swiper-slide-active .anim-slide {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
/* 19.7. Text fill animation ========================================================================== */
 .anim-text-fill {
     display: inline-block;
     position: relative;
     white-space: nowrap;
     color: transparent !important;
}
 .anim-text-fill:before {
     content: attr(data-text);
     overflow: hidden;
     width: 0%;
     position: absolute;
     left: 0;
     top: 50%;
     white-space: nowrap;
     color: #fff;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .js-page-in-anim-active .after-preloader-anim.anim-text-fill:before, .js-page-in-anim-active .after-preloader-anim .anim-text-fill:before, .js-scrollanim.js-scrollanim-active.anim-text-fill:before, .js-scrollanim.js-scrollanim-active .anim-text-fill:before, .swiper-slide.swiper-slide-active .anim-text-fill:before {
     width: 100%;
}
 .swiper-slide .anim-text-fill:before {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .anim-text-fill:before {
     pointer-events: auto;
}
 .swiper-slide .anim-text-fill:before {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .swiper-slide.swiper-slide-active .anim-text-fill:before {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
/* 19.8. Overlay animation ========================================================================== */
 .anim-overlay {
     display: inline-block;
     overflow: hidden;
     position: relative;
}
 .anim-overlay:before {
     content: '';
     position: absolute;
     left: 0;
     top: 0;
     right: 0;
     bottom: 0;
     z-index: 3;
     background-color: #000;
     -webkit-transition: 1s cubic-bezier(.858, .01, .068, .99);
     -o-transition: 1s cubic-bezier(.858, .01, .068, .99);
     transition: 1s cubic-bezier(.858, .01, .068, .99);
}
 .section-bg-black .anim-overlay:before, body .content-bg-black .anim-overlay:before, html body .text-bg-black.anim-overlay:before {
     background-color: #000;
}
 .section-bg-white .anim-overlay:before, body .content-bg-white .anim-overlay:before, html body .text-bg-white.anim-overlay:before {
     background-color: #fff;
}
 .section-bg-light-1 .anim-overlay:before, body .content-bg-light-1 .anim-overlay:before, html body .text-bg-light-1.anim-overlay:before {
     background-color: var(--bg-light-1);
}
 .section-bg-light-2 .anim-overlay:before, body .content-bg-light-2 .anim-overlay:before, html body .text-bg-light-2.anim-overlay:before {
     background-color: var(--bg-light-2);
}
 .section-bg-dark-1 .anim-overlay:before, body .content-bg-dark-1 .anim-overlay:before, html body .text-bg-dark-1.anim-overlay:before {
     background-color: var(--bg-dark-1);
}
 .section-bg-dark-2 .anim-overlay:before, body .content-bg-dark-2 .anim-overlay:before, html body .text-bg-dark-2.anim-overlay:before {
     background-color: var(--bg-dark-2);
}
 body .content-bg-red .anim-overlay:before, html body .text-bg-red.anim-overlay:before {
     background-color: var(--main-color);
}
 .anim-overlay.white:before {
     background-color: #fff !important;
}
 .anim-overlay.black:before {
     background-color: #000 !important;
}
 .anim-overlay.red:before {
     background-color: var(--main-color) !important;
}
 .js-page-in-anim-active .after-preloader-anim.anim-overlay:before, .js-page-in-anim-active .after-preloader-anim .anim-overlay:before, .js-scrollanim.js-scrollanim-active.anim-overlay:before, .js-scrollanim.js-scrollanim-active .anim-overlay:before, .swiper-slide.swiper-slide-active .anim-overlay:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
}
 .swiper-slide .anim-overlay {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .anim-overlay {
     pointer-events: auto;
}
 .swiper-slide .anim-overlay:before {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .swiper-slide.swiper-slide-active .anim-overlay:before {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
/* 19.9. Reveal animation ========================================================================== */
 .anim-reveal {
     display: inline-block;
     position: relative;
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
     -webkit-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-page-in-anim-active .after-preloader-anim.anim-reveal, .js-page-in-anim-active .after-preloader-anim .anim-reveal, .js-scrollanim.js-scrollanim-active.anim-reveal, .js-scrollanim.js-scrollanim-active .anim-reveal, .swiper-slide.swiper-slide-active .anim-reveal {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .swiper-slide .anim-reveal {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .anim-reveal {
     pointer-events: auto;
}
 .swiper-slide .anim-reveal {
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 .swiper-slide.swiper-slide-active .anim-reveal {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .anim-reveal:before {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     z-index: 3;
     background-color: #fff;
     -webkit-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     transition: .5s cubic-bezier(.767, .01, .18, 1.01);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .anim-reveal.black:before {
     background-color: #000;
}
 .anim-reveal.red:before {
     background-color: var(--main-color);
}
 .js-page-in-anim-active .after-preloader-anim.anim-reveal:before, .js-page-in-anim-active .after-preloader-anim .anim-reveal:before, .js-scrollanim.js-scrollanim-active.anim-reveal:before, .js-scrollanim.js-scrollanim-active .anim-reveal:before, .swiper-slide.swiper-slide-active .anim-reveal:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .swiper-slide .anim-reveal:before {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .swiper-slide.swiper-slide-active .anim-reveal:before {
     -webkit-transition-delay: 1.5s;
     -o-transition-delay: 1.5s;
     transition-delay: 1.5s;
}
/* Reveal animation delays */
 .anim-reveal.tr-delay-01:before {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .anim-reveal.tr-delay-02:before {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .anim-reveal.tr-delay-03:before {
     -webkit-transition-delay: .8s !important;
     -o-transition-delay: .8s !important;
     transition-delay: .8s !important;
}
 .anim-reveal.tr-delay-04:before {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .anim-reveal.tr-delay-05:before {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
 .anim-reveal.tr-delay-06:before {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .anim-reveal.tr-delay-07:before {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .anim-reveal.tr-delay-08:before {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .anim-reveal.tr-delay-09:before {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .anim-reveal.tr-delay-10:before {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .swiper-slide .anim-reveal.tr-delay-01, .swiper-slide .anim-reveal.tr-delay-02, .swiper-slide .anim-reveal.tr-delay-03, .swiper-slide .anim-reveal.tr-delay-04, .swiper-slide .anim-reveal.tr-delay-05, .swiper-slide .anim-reveal.tr-delay-06, .swiper-slide .anim-reveal.tr-delay-07, .swiper-slide .anim-reveal.tr-delay-08, .swiper-slide .anim-reveal.tr-delay-09, .swiper-slide .anim-reveal.tr-delay-10 {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-01 {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-02 {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-03 {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-04 {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-05 {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-06 {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-07 {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-08 {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-09 {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-10 {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
 .swiper-slide .anim-reveal.tr-delay-01:before, .swiper-slide .anim-reveal.tr-delay-02:before, .swiper-slide .anim-reveal.tr-delay-03:before, .swiper-slide .anim-reveal.tr-delay-04:before, .swiper-slide .anim-reveal.tr-delay-05:before, .swiper-slide .anim-reveal.tr-delay-06:before, .swiper-slide .anim-reveal.tr-delay-07:before, .swiper-slide .anim-reveal.tr-delay-08:before, .swiper-slide .anim-reveal.tr-delay-09:before, .swiper-slide .anim-reveal.tr-delay-10:before {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-01:before {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-02:before {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-03:before {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-04:before {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-05:before {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-06:before {
     -webkit-transition-delay: 2.1s !important;
     -o-transition-delay: 2.1s !important;
     transition-delay: 2.1s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-07:before {
     -webkit-transition-delay: 2.2s !important;
     -o-transition-delay: 2.2s !important;
     transition-delay: 2.2s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-08:before {
     -webkit-transition-delay: 2.3s !important;
     -o-transition-delay: 2.3s !important;
     transition-delay: 2.3s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-09:before {
     -webkit-transition-delay: 2.4s !important;
     -o-transition-delay: 2.4s !important;
     transition-delay: 2.4s !important;
}
 .swiper-slide.swiper-slide-active .anim-reveal.tr-delay-10:before {
     -webkit-transition-delay: 2.5s !important;
     -o-transition-delay: 2.5s !important;
     transition-delay: 2.5s !important;
}
/* 19.10. Text double fill animation ========================================================================== */
 .anim-text-double-fill {
     display: inline-block;
     position: relative;
     white-space: nowrap;
     color: transparent !important;
}
 .swiper-slide .anim-text-double-fill {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .anim-text-double-fill {
     pointer-events: auto;
}
 .anim-text-double-fill:before, .anim-text-double-fill:after {
     content: attr(data-text);
     overflow: hidden;
     width: 0%;
     position: absolute;
     left: 0;
     top: 50%;
     white-space: nowrap;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .anim-text-double-fill:before {
     z-index: 2;
     background-color: #000;
     -webkit-transition-delay: .3s;
     -o-transition-delay: .3s;
     transition-delay: .3s;
}
 .section-bg-black .anim-text-double-fill:before, body .content-bg-black .anim-text-double-fill:before, html body .text-bg-black.anim-text-double-fill:before {
     background-color: #000;
}
 .section-bg-white .anim-text-double-fill:before, body .content-bg-white .anim-text-double-fill:before, html body .text-bg-white.anim-text-double-fill:before {
     background-color: #fff;
}
 .section-bg-light-1 .anim-text-double-fill:before, body .content-bg-light-1 .anim-text-double-fill:before, html body .text-bg-light-1.anim-text-double-fill:before {
     background-color: var(--bg-light-1);
}
 .section-bg-light-2 .anim-text-double-fill:before, body .content-bg-light-2 .anim-text-double-fill:before, html body .text-bg-light-2.anim-text-double-fill:before {
     background-color: var(--bg-light-2);
}
 .section-bg-dark-1 .anim-text-double-fill:before, body .content-bg-dark-1 .anim-text-double-fill:before, html body .text-bg-dark-1.anim-text-double-fill:before {
     background-color: var(--bg-dark-1);
}
 .section-bg-dark-2 .anim-text-double-fill:before, body .content-bg-dark-2 .anim-text-double-fill:before, html body .text-bg-dark-2.anim-text-double-fill:before {
     background-color: var(--bg-dark-2);
}
 body .content-bg-red .anim-text-double-fill:before, html body .text-bg-red.anim-text-double-fill:before {
     background-color: var(--main-color);
}
 .anim-text-double-fill:after {
     color: #fff;
}
 .anim-text-double-fill:before {
     color: var(--main-color);
}
 .anim-text-double-fill.invert:after {
     color: var(--main-color);
}
 .anim-text-double-fill.invert:before {
     color: #fff;
}
 .anim-text-double-fill.black:after {
     color: #000;
}
 .anim-text-double-fill.black:before {
     color: var(--main-color);
}
 .anim-text-double-fill.black.invert:after {
     color: var(--main-color);
}
 .anim-text-double-fill.black.invert:before {
     color: #000;
}
 .js-page-in-anim-active .after-preloader-anim.anim-text-double-fill:before, .js-page-in-anim-active .after-preloader-anim.anim-text-double-fill:after, .js-page-in-anim-active .after-preloader-anim .anim-text-double-fill:before, .js-page-in-anim-active .after-preloader-anim .anim-text-double-fill:after, .js-scrollanim.js-scrollanim-active.anim-text-double-fill:before, .js-scrollanim.js-scrollanim-active.anim-text-double-fill:after, .js-scrollanim.js-scrollanim-active .anim-text-double-fill:before, .js-scrollanim.js-scrollanim-active .anim-text-double-fill:after, .swiper-slide.swiper-slide-active .anim-text-double-fill:before, .swiper-slide.swiper-slide-active .anim-text-double-fill:after {
     width: 100%;
}
 .swiper-slide .anim-text-double-fill:after, .swiper-slide.swiper-slide-active .anim-text-double-fill:after {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .swiper-slide .anim-text-double-fill:before {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .swiper-slide.swiper-slide-active .anim-text-double-fill:before {
     -webkit-transition-delay: 1.3s;
     -o-transition-delay: 1.3s;
     transition-delay: 1.3s;
}
/* Text double fill delays */
 .tr-delay-01.anim-text-double-fill:before {
     -webkit-transition-delay: .4s !important;
     -o-transition-delay: .4s !important;
     transition-delay: .4s !important;
}
 .tr-delay-02.anim-text-double-fill:before {
     -webkit-transition-delay: .5s !important;
     -o-transition-delay: .5s !important;
     transition-delay: .5s !important;
}
 .tr-delay-03.anim-text-double-fill:before {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .tr-delay-04.anim-text-double-fill:before {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .tr-delay-05.anim-text-double-fill:before {
     -webkit-transition-delay: .8s !important;
     -o-transition-delay: .8s !important;
     transition-delay: .8s !important;
}
 .tr-delay-06.anim-text-double-fill:before {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .tr-delay-07.anim-text-double-fill:before {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
 .tr-delay-08.anim-text-double-fill:before {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .tr-delay-09.anim-text-double-fill:before {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .tr-delay-10.anim-text-double-fill:before {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .swiper-slide .tr-delay-01.anim-text-double-fill:after, .swiper-slide .tr-delay-02.anim-text-double-fill:after, .swiper-slide .tr-delay-03.anim-text-double-fill:after, .swiper-slide .tr-delay-04.anim-text-double-fill:after, .swiper-slide .tr-delay-05.anim-text-double-fill:after, .swiper-slide .tr-delay-06.anim-text-double-fill:after, .swiper-slide .tr-delay-07.anim-text-double-fill:after, .swiper-slide .tr-delay-08.anim-text-double-fill:after, .swiper-slide .tr-delay-09.anim-text-double-fill:after, .swiper-slide .tr-delay-10.anim-text-double-fill:after {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
 .swiper-slide .tr-delay-01.anim-text-double-fill:before, .swiper-slide .tr-delay-02.anim-text-double-fill:before, .swiper-slide .tr-delay-03.anim-text-double-fill:before, .swiper-slide .tr-delay-04.anim-text-double-fill:before, .swiper-slide .tr-delay-05.anim-text-double-fill:before, .swiper-slide .tr-delay-06.anim-text-double-fill:before, .swiper-slide .tr-delay-07.anim-text-double-fill:before, .swiper-slide .tr-delay-08.anim-text-double-fill:before, .swiper-slide .tr-delay-09.anim-text-double-fill:before, .swiper-slide .tr-delay-10.anim-text-double-fill:before {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-01.anim-text-double-fill:after {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-02.anim-text-double-fill:after {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-03.anim-text-double-fill:after {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-04.anim-text-double-fill:after {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-05.anim-text-double-fill:after {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-06.anim-text-double-fill:after {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-07.anim-text-double-fill:after {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-08.anim-text-double-fill:after {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-09.anim-text-double-fill:after {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-10.anim-text-double-fill:after {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-01.anim-text-double-fill:before {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-02.anim-text-double-fill:before {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-03.anim-text-double-fill:before {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-04.anim-text-double-fill:before {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-05.anim-text-double-fill:before {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-06.anim-text-double-fill:before {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-07.anim-text-double-fill:before {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-08.anim-text-double-fill:before {
     -webkit-transition-delay: 2.1s !important;
     -o-transition-delay: 2.1s !important;
     transition-delay: 2.1s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-09.anim-text-double-fill:before {
     -webkit-transition-delay: 2.2s !important;
     -o-transition-delay: 2.2s !important;
     transition-delay: 2.2s !important;
}
 .swiper-slide.swiper-slide-active .tr-delay-10.anim-text-double-fill:before {
     -webkit-transition-delay: 2.3s !important;
     -o-transition-delay: 2.3s !important;
     transition-delay: 2.3s !important;
}
/* 19.11. Progress bar ========================================================================== */
 .progress-bar {
     overflow: hidden;
     position: relative;
}
 .progress-bar__counter {
     position: absolute;
     top: 0;
     right: 0;
}
 .progress-bar__lines-box {
     overflow: hidden;
     height: 1px;
     margin-top: 6px;
     position: relative;
     background-color: rgba(250, 250, 250, .2);
}
 .progress-bar__lines-box.black {
     background-color: rgba(0, 0, 0, .2);
}
 .progress-bar__line {
     width: 0;
     height: 1px;
     position: absolute;
     left: 0px;
     top: 0px;
     background-color: #fff;
     -webkit-transform: translateX(-100%);
     -ms-transform: translateX(-100%);
     transform: translateX(-100%);
     -webkit-transition: 1.7s cubic-bezier(.858, .01, .068, .99);
     -o-transition: 1.7s cubic-bezier(.858, .01, .068, .99);
     transition: 1.7s cubic-bezier(.858, .01, .068, .99);
}
 .progress-bar__line.black {
     background-color: #000;
}
 .progress-bar__line.red {
     background-color: var(--main-color);
}
 .js-scrollanim.js-scrollanim-active .progress-bar__line {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
/* 19.12. Border animations ========================================================================== */
/* 19.12.1. Border left animation ========================================================================== */
 .border-left-anim:before {
     content: '';
     display: inline-block;
     width: 1px;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     background-color: #fff;
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
     -webkit-transition: 1s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1s cubic-bezier(.225, 1, .316, .99);
     transition: 1s cubic-bezier(.225, 1, .316, .99);
}
 .border-left-anim.black:before {
     background-color: #000;
}
 .border-left-anim.red:before {
     background-color: var(--main-color);
}
 .border-left-anim.in-10px:before {
     left: 10px;
     top: 10px;
     height: calc(100% - 20px);
}
 .border-left-anim.reverse:before {
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
}
 .border-left-anim.center:before {
     -webkit-transform-origin: center;
     -ms-transform-origin: center;
     transform-origin: center;
}
 .hover-box:hover .border-left-anim:before {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
 .swiper-slide .hover-box:hover .border-left-anim:before, .swiper-slide.hover-box:hover .border-left-anim:before {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .border-left-anim:before, .swiper-slide.swiper-slide-active.hover-box:hover .border-left-anim:before {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
/* 19.12.2. Border right animation ========================================================================== */
 .border-right-anim:before {
     content: '';
     display: inline-block;
     width: 1px;
     height: 100%;
     position: absolute;
     top: 0;
     right: 0;
     background-color: #fff;
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
     -webkit-transform-origin: top;
     -ms-transform-origin: top;
     transform-origin: top;
     -webkit-transition: 1s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1s cubic-bezier(.225, 1, .316, .99);
     transition: 1s cubic-bezier(.225, 1, .316, .99);
}
 .border-right-anim.black:before {
     background-color: #000;
}
 .border-right-anim.red:before {
     background-color: var(--main-color);
}
 .border-right-anim.in-10px:before {
     height: calc(100% - 20px);
     top: 10px;
     right: 10px;
}
 .border-right-anim.reverse:before {
     -webkit-transform-origin: bottom;
     -ms-transform-origin: bottom;
     transform-origin: bottom;
}
 .border-right-anim.center:before {
     -webkit-transform-origin: center;
     -ms-transform-origin: center;
     transform-origin: center;
}
 .hover-box:hover .border-right-anim:before {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
 .swiper-slide .hover-box:hover .border-right-anim:before, .swiper-slide.hover-box:hover .border-right-anim:before {
     -webkit-transform: scaleY(0);
     -ms-transform: scaleY(0);
     transform: scaleY(0);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .border-right-anim:before, .swiper-slide.swiper-slide-active.hover-box:hover .border-right-anim:before {
     -webkit-transform: scaleY(1);
     -ms-transform: scaleY(1);
     transform: scaleY(1);
}
/* 19.12.3. Border top animation ========================================================================== */
 .border-top-anim:before {
     content: '';
     display: inline-block;
     width: 100%;
     height: 1px;
     position: absolute;
     left: 0;
     top: 0;
     background-color: #fff;
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transform-origin: left;
     -ms-transform-origin: left;
     transform-origin: left;
     -webkit-transition: 1s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1s cubic-bezier(.225, 1, .316, .99);
     transition: 1s cubic-bezier(.225, 1, .316, .99);
}
 .border-top-anim.black:before {
     background-color: #000;
}
 .border-top-anim.red:before {
     background-color: var(--main-color);
}
 .border-top-anim.in-10px:before {
     width: calc(100% - 20px);
     left: 10px;
     top: 10px;
}
 .border-top-anim.reverse:before {
     -webkit-transform-origin: right;
     -ms-transform-origin: right;
     transform-origin: right;
}
 .border-top-anim.center:before {
     -webkit-transform-origin: center;
     -ms-transform-origin: center;
     transform-origin: center;
}
 .hover-box:hover .border-top-anim:before {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
}
 .swiper-slide .hover-box:hover .border-top-anim:before, .swiper-slide.hover-box:hover .border-top-anim:before {
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .border-top-anim:before, .swiper-slide.swiper-slide-active.hover-box:hover .border-top-anim:before {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
}
/* 19.12.4. Border bottom animation ========================================================================== */
 .border-bottom-anim:before {
     content: '';
     display: inline-block;
     width: 100%;
     height: 1px;
     position: absolute;
     right: 0;
     bottom: 0;
     background-color: #fff;
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
     -webkit-transform-origin: right;
     -ms-transform-origin: right;
     transform-origin: right;
     -webkit-transition: 1s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1s cubic-bezier(.225, 1, .316, .99);
     transition: 1s cubic-bezier(.225, 1, .316, .99);
}
 .border-bottom-anim.black:before {
     background-color: #000;
}
 .border-bottom-anim.red:before {
     background-color: var(--main-color);
}
 .border-bottom-anim.in-10px:before {
     width: calc(100% - 20px);
     right: 10px;
     bottom: 10px;
}
 .border-bottom-anim.reverse:before {
     -webkit-transform-origin: left;
     -ms-transform-origin: left;
     transform-origin: left;
}
 .border-bottom-anim.center:before {
     -webkit-transform-origin: center;
     -ms-transform-origin: center;
     transform-origin: center;
}
 .hover-box:hover .border-bottom-anim:before {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
}
 .swiper-slide .hover-box:hover .border-bottom-anim:before, .swiper-slide.hover-box:hover .border-bottom-anim:before {
     -webkit-transform: scaleX(0);
     -ms-transform: scaleX(0);
     transform: scaleX(0);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .border-bottom-anim:before, .swiper-slide.swiper-slide-active.hover-box:hover .border-bottom-anim:before {
     -webkit-transform: scaleX(1);
     -ms-transform: scaleX(1);
     transform: scaleX(1);
}
/* ========================================================================== 20. Content hover effects ========================================================================== */
/* 20.1. Content hover delays ========================================================================== */
 .js-no-touch .hover-box .hover-fade.tr-delay-01, .js-no-touch .hover-box .hover-fade.tr-delay-02, .js-no-touch .hover-box .hover-fade.tr-delay-03, .js-no-touch .hover-box .hover-fade.tr-delay-04, .js-no-touch .hover-box .hover-fade.tr-delay-05, .js-no-touch .hover-box .hover-fade.tr-delay-06, .js-no-touch .hover-box .hover-fade.tr-delay-07, .js-no-touch .hover-box .hover-fade.tr-delay-08, .js-no-touch .hover-box .hover-fade.tr-delay-09, .js-no-touch .hover-box .hover-fade.tr-delay-10, .js-no-touch .hover-box .hover-text-fill.tr-delay-01:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-02:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-03:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-04:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-05:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-06:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-07:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-08:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-09:before, .js-no-touch .hover-box .hover-text-fill.tr-delay-10:before, .js-no-touch .hover-box .hover-reveal.tr-delay-01, .js-no-touch .hover-box .hover-reveal.tr-delay-02, .js-no-touch .hover-box .hover-reveal.tr-delay-03, .js-no-touch .hover-box .hover-reveal.tr-delay-04, .js-no-touch .hover-box .hover-reveal.tr-delay-05, .js-no-touch .hover-box .hover-reveal.tr-delay-06, .js-no-touch .hover-box .hover-reveal.tr-delay-07, .js-no-touch .hover-box .hover-reveal.tr-delay-08, .js-no-touch .hover-box .hover-reveal.tr-delay-09, .js-no-touch .hover-box .hover-reveal.tr-delay-10, .js-no-touch .hover-box .hover-reveal.tr-delay-01:before, .js-no-touch .hover-box .hover-reveal.tr-delay-02:before, .js-no-touch .hover-box .hover-reveal.tr-delay-03:before, .js-no-touch .hover-box .hover-reveal.tr-delay-04:before, .js-no-touch .hover-box .hover-reveal.tr-delay-05:before, .js-no-touch .hover-box .hover-reveal.tr-delay-06:before, .js-no-touch .hover-box .hover-reveal.tr-delay-07:before, .js-no-touch .hover-box .hover-reveal.tr-delay-08:before, .js-no-touch .hover-box .hover-reveal.tr-delay-09:before, .js-no-touch .hover-box .hover-reveal.tr-delay-10:before, .js-no-touch .hover-box .hover-slide.tr-delay-01, .js-no-touch .hover-box .hover-slide.tr-delay-02, .js-no-touch .hover-box .hover-slide.tr-delay-03, .js-no-touch .hover-box .hover-slide.tr-delay-04, .js-no-touch .hover-box .hover-slide.tr-delay-05, .js-no-touch .hover-box .hover-slide.tr-delay-06, .js-no-touch .hover-box .hover-slide.tr-delay-07, .js-no-touch .hover-box .hover-slide.tr-delay-08, .js-no-touch .hover-box .hover-slide.tr-delay-09, .js-no-touch .hover-box .hover-slide.tr-delay-10 {
     -webkit-transition-delay: 0s !important;
     -o-transition-delay: 0s !important;
     transition-delay: 0s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-01, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-01:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-01, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-01:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-01 {
     -webkit-transition-delay: .1s !important;
     -o-transition-delay: .1s !important;
     transition-delay: .1s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-02, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-02:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-02, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-02:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-02 {
     -webkit-transition-delay: .2s !important;
     -o-transition-delay: .2s !important;
     transition-delay: .2s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-03, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-03:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-03, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-03:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-03 {
     -webkit-transition-delay: .3s !important;
     -o-transition-delay: .3s !important;
     transition-delay: .3s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-04, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-04:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-04, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-04:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-04 {
     -webkit-transition-delay: .4s !important;
     -o-transition-delay: .4s !important;
     transition-delay: .4s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-05, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-05:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-05, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-05:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-05 {
     -webkit-transition-delay: .5s !important;
     -o-transition-delay: .5s !important;
     transition-delay: .5s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-06, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-06:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-06, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-06:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-06 {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-07, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-07:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-07, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-07:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-07 {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-08, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-08:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-08, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-08:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-08 {
     -webkit-transition-delay: .8s !important;
     -o-transition-delay: .8s !important;
     transition-delay: .8s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-09, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-09:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-09, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-09:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-09 {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .js-no-touch .hover-box:hover .hover-fade.tr-delay-10, .js-no-touch .hover-box:hover .hover-text-fill.tr-delay-10:before, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-10, .js-no-touch .hover-box:hover .hover-reveal.tr-delay-10:before, .js-no-touch .hover-box:hover .hover-slide.tr-delay-10 {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
/* 20.2. Fade hover ========================================================================== */
 .hover-fade {
     display: inline-block;
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
     -webkit-transition: 1s cubic-bezier(.225, 1, .316, .99);
     -o-transition: 1s cubic-bezier(.225, 1, .316, .99);
     transition: 1s cubic-bezier(.225, 1, .316, .99);
}
 .hover-box:hover .hover-fade {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .swiper-slide .hover-fade {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .hover-fade {
     pointer-events: auto;
}
 .js-no-touch .swiper-slide.hover-box:hover .hover-fade, .js-no-touch .swiper-slide .hover-box:hover .hover-fade {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
}
 .js-no-touch .swiper-slide.swiper-slide-active.hover-box:hover .hover-fade, .js-no-touch .swiper-slide.swiper-slide-active .hover-box:hover .hover-fade {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .js-touch .swiper-slide .hover-fade {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-fade {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-touch body .swiper-slide .hover-fade {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
}
 .js-touch .swiper-slide.swiper-slide-active .hover-fade {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .js-touch .js-touch-hover-scroll.hover-box:hover .hover-fade {
     opacity: 0;
     -webkit-transform: translateY(30px);
     -ms-transform: translateY(30px);
     transform: translateY(30px);
}
 .js-touch body .js-touch-hover-scroll.js-hover-active.hover-box .hover-fade {
     opacity: 1;
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
/* 20.3. Slide hover ========================================================================== */
 .hover-slide {
     display: inline-block;
     -webkit-transform: translateY(105%);
     -ms-transform: translateY(105%);
     transform: translateY(105%);
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .hover-box:hover .hover-slide {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
     -webkit-transition: 1.6s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1.6s cubic-bezier(.17, .85, .438, .99);
     transition: 1.6s cubic-bezier(.17, .85, .438, .99);
}
 .swiper-slide .hover-slide {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .hover-slide {
     pointer-events: auto;
}
 .js-no-touch .swiper-slide.hover-box:hover .hover-slide, .js-no-touch .swiper-slide .hover-box:hover .hover-slide {
     -webkit-transform: translateY(105%);
     -ms-transform: translateY(105%);
     transform: translateY(105%);
}
 .js-no-touch .swiper-slide.swiper-slide-active.hover-box:hover .hover-slide, .js-no-touch .swiper-slide.swiper-slide-active .hover-box:hover .hover-slide {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .js-touch .swiper-slide .hover-slide {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-slide {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-touch body .swiper-slide .hover-slide {
     -webkit-transform: translateY(105%);
     -ms-transform: translateY(105%);
     transform: translateY(105%);
}
 .js-touch .swiper-slide.swiper-slide-active .hover-slide {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
 .js-touch .js-touch-hover-scroll.hover-box:hover .hover-slide {
     -webkit-transform: translateY(105%);
     -ms-transform: translateY(105%);
     transform: translateY(105%);
}
 .js-touch body .js-touch-hover-scroll.js-hover-active.hover-box .hover-slide {
     -webkit-transform: translateY(0);
     -ms-transform: translateY(0);
     transform: translateY(0);
}
/* 20.4. Text fill hover ========================================================================== */
 .hover-text-fill {
     display: inline-block;
     position: relative;
     white-space: nowrap;
     color: transparent !important;
}
 .swiper-slide .hover-text-fill {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .hover-text-fill {
     pointer-events: auto;
}
 .hover-text-fill:before {
     content: attr(data-text);
     overflow: hidden;
     width: 0%;
     position: absolute;
     left: 0;
     top: 50%;
     white-space: nowrap;
     color: #fff;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: 1s cubic-bezier(.767, .01, .18, 1.01);
     transition: 1s cubic-bezier(.767, .01, .18, 1.01);
}
 .hover-box:hover .hover-text-fill:before {
     width: 100%;
}
 .js-no-touch .swiper-slide.hover-box:hover .hover-text-fill:before, .js-no-touch .swiper-slide .hover-box:hover .hover-text-fill:before {
     width: 0%;
}
 .js-no-touch .swiper-slide.swiper-slide-active.hover-box:hover .hover-text-fill:before, .js-no-touch .swiper-slide.swiper-slide-active .hover-box:hover .hover-text-fill:before {
     width: 100%;
}
 .js-touch .swiper-slide .hover-text-fill:before {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-text-fill:before {
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-touch body .swiper-slide .hover-text-fill:before {
     width: 0%;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-text-fill:before {
     width: 100%;
}
 .js-touch .js-touch-hover-scroll.hover-box:hover .hover-text-fill:before {
     width: 0%;
}
 .js-touch body .js-touch-hover-scroll.js-hover-active.hover-box .hover-text-fill:before {
     width: 100%;
}
/* 20.5. Reveal hover ========================================================================== */
 .hover-reveal {
     display: inline-block;
     position: relative;
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .hover-box:hover .hover-reveal {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .swiper-slide .hover-reveal {
     pointer-events: none;
}
 .swiper-slide.swiper-slide-active .hover-reveal {
     pointer-events: auto;
}
 .js-no-touch .swiper-slide.hover-box:hover .hover-reveal, .js-no-touch .swiper-slide .hover-box:hover .hover-reveal {
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
}
 .js-no-touch .swiper-slide.swiper-slide-active.hover-box:hover .hover-reveal, .js-no-touch .swiper-slide.swiper-slide-active .hover-box:hover .hover-reveal {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
 .js-touch .swiper-slide .hover-reveal {
     -webkit-transition-delay: 1.2s;
     -o-transition-delay: 1.2s;
     transition-delay: 1.2s;
}
 .js-touch body .swiper-slide .hover-reveal {
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-delay: 1s;
     -o-transition-delay: 1s;
     transition-delay: 1s;
}
 .js-touch .js-touch-hover-scroll.hover-box:hover .hover-reveal {
     -webkit-transform: translateX(-105%);
     -ms-transform: translateX(-105%);
     transform: translateX(-105%);
}
 .js-touch body .js-touch-hover-scroll.js-hover-active.hover-box .hover-reveal {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .hover-reveal:before {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     z-index: 3;
     background-color: #fff;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
     -webkit-transition-delay: 0s;
     -o-transition-delay: 0s;
     transition-delay: 0s;
}
 .hover-reveal.black:before {
     background-color: #000;
}
 .hover-reveal.red:before {
     background-color: var(--main-color);
}
 .hover-box:hover .hover-reveal:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
 .js-no-touch .swiper-slide.hover-box:hover .hover-reveal:before, .js-no-touch .swiper-slide .hover-box:hover .hover-reveal:before {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
 .js-no-touch .swiper-slide.swiper-slide-active.hover-box:hover .hover-reveal:before, .js-no-touch .swiper-slide.swiper-slide-active .hover-box:hover .hover-reveal:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
}
 .js-touch .swiper-slide .hover-reveal:before {
     -webkit-transition-delay: .7s;
     -o-transition-delay: .7s;
     transition-delay: .7s;
}
 .js-touch body .swiper-slide .hover-reveal:before {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
     -webkit-transition-delay: 1.5s;
     -o-transition-delay: 1.5s;
     transition-delay: 1.5s;
}
 .js-touch .js-touch-hover-scroll.hover-box:hover .hover-reveal:before {
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
 .js-touch body .js-touch-hover-scroll.js-hover-active.hover-box .hover-reveal:before {
     -webkit-transform: translateX(105%);
     -ms-transform: translateX(105%);
     transform: translateX(105%);
     -webkit-transition-delay: .5s;
     -o-transition-delay: .5s;
     transition-delay: .5s;
}
/* Reveal hover delays */
 .js-touch .swiper-slide .hover-reveal.tr-delay-01, .js-touch .swiper-slide .hover-reveal.tr-delay-02, .js-touch .swiper-slide .hover-reveal.tr-delay-03, .js-touch .swiper-slide .hover-reveal.tr-delay-04, .js-touch .swiper-slide .hover-reveal.tr-delay-05, .js-touch .swiper-slide .hover-reveal.tr-delay-06, .js-touch .swiper-slide .hover-reveal.tr-delay-07, .js-touch .swiper-slide .hover-reveal.tr-delay-08, .js-touch .swiper-slide .hover-reveal.tr-delay-09, .js-touch .swiper-slide .hover-reveal.tr-delay-10 {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-01 {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-02 {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-03 {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-04 {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-05 {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-06 {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-07 {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-08 {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-09 {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-10 {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-01:before {
     -webkit-transition-delay: 1.6s !important;
     -o-transition-delay: 1.6s !important;
     transition-delay: 1.6s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-02:before {
     -webkit-transition-delay: 1.7s !important;
     -o-transition-delay: 1.7s !important;
     transition-delay: 1.7s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-03:before {
     -webkit-transition-delay: 1.8s !important;
     -o-transition-delay: 1.8s !important;
     transition-delay: 1.8s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-04:before {
     -webkit-transition-delay: 1.9s !important;
     -o-transition-delay: 1.9s !important;
     transition-delay: 1.9s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-05:before {
     -webkit-transition-delay: 2s !important;
     -o-transition-delay: 2s !important;
     transition-delay: 2s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-06:before {
     -webkit-transition-delay: 2.1s !important;
     -o-transition-delay: 2.1s !important;
     transition-delay: 2.1s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-07:before {
     -webkit-transition-delay: 2.2s !important;
     -o-transition-delay: 2.2s !important;
     transition-delay: 2.2s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-08:before {
     -webkit-transition-delay: 2.3s !important;
     -o-transition-delay: 2.3s !important;
     transition-delay: 2.3s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-09:before {
     -webkit-transition-delay: 2.4s !important;
     -o-transition-delay: 2.4s !important;
     transition-delay: 2.4s !important;
}
 .js-touch .swiper-slide.swiper-slide-active .hover-reveal.tr-delay-10:before {
     -webkit-transition-delay: 2.5s !important;
     -o-transition-delay: 2.5s !important;
     transition-delay: 2.5s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-01:before {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-02:before {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-03:before {
     -webkit-transition-delay: .8s !important;
     -o-transition-delay: .8s !important;
     transition-delay: .8s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-04:before {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-05:before {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-06:before {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-07:before {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-08:before {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-09:before {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .js-touch .js-touch-hover-scroll .hover-reveal.tr-delay-10:before {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
 .js-no-touch body .hover-box .hover-reveal.tr-delay-01, .js-no-touch body .hover-box .hover-reveal.tr-delay-02, .js-no-touch body .hover-box .hover-reveal.tr-delay-03, .js-no-touch body .hover-box .hover-reveal.tr-delay-04, .js-no-touch body .hover-box .hover-reveal.tr-delay-05, .js-no-touch body .hover-box .hover-reveal.tr-delay-06, .js-no-touch body .hover-box .hover-reveal.tr-delay-07, .js-no-touch body .hover-box .hover-reveal.tr-delay-08, .js-no-touch body .hover-box .hover-reveal.tr-delay-09, .js-no-touch body .hover-box .hover-reveal.tr-delay-10 {
     -webkit-transition-delay: .5s !important;
     -o-transition-delay: .5s !important;
     transition-delay: .5s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-01:before {
     -webkit-transition-delay: .6s !important;
     -o-transition-delay: .6s !important;
     transition-delay: .6s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-02:before {
     -webkit-transition-delay: .7s !important;
     -o-transition-delay: .7s !important;
     transition-delay: .7s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-03:before {
     -webkit-transition-delay: .8s !important;
     -o-transition-delay: .8s !important;
     transition-delay: .8s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-04:before {
     -webkit-transition-delay: .9s !important;
     -o-transition-delay: .9s !important;
     transition-delay: .9s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-05:before {
     -webkit-transition-delay: 1s !important;
     -o-transition-delay: 1s !important;
     transition-delay: 1s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-06:before {
     -webkit-transition-delay: 1.1s !important;
     -o-transition-delay: 1.1s !important;
     transition-delay: 1.1s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-07:before {
     -webkit-transition-delay: 1.2s !important;
     -o-transition-delay: 1.2s !important;
     transition-delay: 1.2s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-08:before {
     -webkit-transition-delay: 1.3s !important;
     -o-transition-delay: 1.3s !important;
     transition-delay: 1.3s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-09:before {
     -webkit-transition-delay: 1.4s !important;
     -o-transition-delay: 1.4s !important;
     transition-delay: 1.4s !important;
}
 .js-no-touch body .hover-box:hover .hover-reveal.tr-delay-10:before {
     -webkit-transition-delay: 1.5s !important;
     -o-transition-delay: 1.5s !important;
     transition-delay: 1.5s !important;
}
/* 20.6. Move hover ========================================================================== */
 .hover-move-left, .hover-move-up, .hover-move-right, .hover-move-down {
     display: inline-block;
     -webkit-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     -o-transition: .7s cubic-bezier(.767, .01, .18, 1.01);
     transition: .7s cubic-bezier(.767, .01, .18, 1.01);
}
 .hover-box:hover .hover-move-left {
     -webkit-transform: translateX(-20px);
     -ms-transform: translateX(-20px);
     transform: translateX(-20px);
}
 .hover-box:hover .hover-move-up {
     -webkit-transform: translateY(-20px);
     -ms-transform: translateY(-20px);
     transform: translateY(-20px);
}
 .hover-box:hover .hover-move-right {
     -webkit-transform: translateX(20px);
     -ms-transform: translateX(20px);
     transform: translateX(20px);
}
 .hover-box:hover .hover-move-down {
     -webkit-transform: translateY(20px);
     -ms-transform: translateY(20px);
     transform: translateY(20px);
}
/* ========================================================================== 21. Image hover effects ========================================================================== */
/* 21.1. Image hover opacity ========================================================================== */
 .img-hover-opacity {
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .hover-box:hover .img-hover-opacity {
     opacity: .5;
}
 .swiper-slide .hover-box:hover .img-hover-opacity, .swiper-slide.hover-box:hover .img-hover-opacity {
     opacity: 1;
}
 .swiper-slide.swiper-slide-active .hover-box:hover .img-hover-opacity, .swiper-slide.swiper-slide-active.hover-box:hover .img-hover-opacity {
     opacity: .5;
}
/* 21.2. Image hover scale ========================================================================== */
 .img-hover-scale {
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .hover-box:hover .img-hover-scale {
     -webkit-transform: scale(1.1);
     -ms-transform: scale(1.1);
     transform: scale(1.1);
}
 .swiper-slide .hover-box:hover .img-hover-scale, .swiper-slide.hover-box:hover .img-hover-scale {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .img-hover-scale, .swiper-slide.swiper-slide-active.hover-box:hover .img-hover-scale {
     -webkit-transform: scale(1.1);
     -ms-transform: scale(1.1);
     transform: scale(1.1);
}
 .img-hover-scale.in {
     -webkit-transform: scale(1.1);
     -ms-transform: scale(1.1);
     transform: scale(1.1);
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .hover-box:hover .img-hover-scale.in {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .swiper-slide .hover-box:hover .img-hover-scale.in, .swiper-slide.hover-box:hover .img-hover-scale.in {
     -webkit-transform: scale(1.1);
     -ms-transform: scale(1.1);
     transform: scale(1.1);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .img-hover-scale.in, .swiper-slide.swiper-slide-active.hover-box:hover .img-hover-scale.in {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
/* 21.3. Image hover overlay ========================================================================== */
 .img-hover-overlay {
     width: 100%;
     position: absolute;
     left: 0;
     top: 0;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .hover-box:hover .img-hover-overlay {
     opacity: 0;
}
 .swiper-slide .hover-box:hover .img-hover-overlay, .swiper-slide.hover-box:hover .img-hover-overlay {
     opacity: 1;
}
 .swiper-slide.swiper-slide-active .hover-box:hover .img-hover-overlay, .swiper-slide.swiper-slide-active.hover-box:hover .img-hover-overlay {
     opacity: 0;
}
 .hover-box:hover .img-hover-overlay.out {
     -webkit-transform: scale(1.1);
     -ms-transform: scale(1.1);
     transform: scale(1.1);
}
 .swiper-slide .hover-box:hover .img-hover-overlay.out, .swiper-slide.hover-box:hover .img-hover-overlay.out {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .swiper-slide.swiper-slide-active .hover-box:hover .img-hover-overlay.out, .swiper-slide.swiper-slide-active.hover-box:hover .img-hover-overlay.out {
     -webkit-transform: scale(1.1);
     -ms-transform: scale(1.1);
     transform: scale(1.1);
}
/* ========================================================================== 22. Forms ========================================================================== */
 textarea {
     background: none;
     resize: vertical;
     -webkit-box-sizing: border-box;
     -ms-box-sizing: border-box;
     box-sizing: border-box;
}
 input[type='text'], input[type='password'], input[type='datetime'], input[type='datetime-local'], input[type='date'], input[type='month'], input[type='time'], input[type='week'], input[type='number'], input[type='email'], input[type='url'], input[type='search'], input[type='tel'], input[type='color'] {
     vertical-align: middle;
     outline: none;
     background: none;
}
 textarea:focus, input[type='text']:focus, input[type='password']:focus, input[type='datetime']:focus, input[type='datetime-local']:focus, input[type='date']:focus, input[type='month']:focus, input[type='time']:focus, input[type='week']:focus, input[type='number']:focus, input[type='email']:focus, input[type='url']:focus, input[type='search']:focus, input[type='tel']:focus, input[type='color']:focus {
     outline: none;
}
 input[type='submit'] {
     text-decoration: none;
     border: none;
     outline: none;
     background: none;
}
 input[type='submit']:hover {
     outline: none;
     background: none;
}
/* 22.1. Form placeholder ========================================================================== */
 ::-webkit-input-placeholder {
     opacity: .5;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 400;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: #fff;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .black::-webkit-input-placeholder {
     color: #000;
}
 ::-moz-placeholder {
     opacity: .5;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 400;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: #fff;
     -moz-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .black::-moz-placeholder {
     color: #000;
}
 :-ms-input-placeholder {
     opacity: .5;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 400;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: #fff;
     -ms-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .black:-ms-input-placeholder {
     color: #000;
}
 ::-ms-input-placeholder {
     opacity: .5;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 400;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: #fff;
     -ms-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .black::-ms-input-placeholder {
     color: #000;
}
 ::placeholder {
     opacity: .5;
     font-family: 'Montserrat', sans-serif;
     font-size: 11px;
     font-weight: 400;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: #fff;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .black::placeholder {
     color: #000;
}
 .form-input:focus::-webkit-input-placeholder {
     opacity: 1;
}
 .form-input:focus::-moz-placeholder {
     opacity: 1;
}
 .form-input:focus:-ms-input-placeholder {
     opacity: 1;
}
 .form-input:focus::-ms-input-placeholder {
     opacity: 1;
}
 .form-input:focus::-webkit-input-placeholder:focus {
     opacity: 1;
}
 .form-input:focus::-moz-placeholder:focus {
     opacity: 1;
}
 .form-input:focus:-ms-input-placeholder:focus {
     opacity: 1;
}
 .form-input:focus::-ms-input-placeholder:focus {
     opacity: 1;
}
 .form-input:focus::placeholder:focus {
     opacity: 1;
}
/* 22.2. Input default ========================================================================== */
 .form-input {
     width: 100%;
     margin-bottom: 40px;
     padding: 40px 0px 10px 0px;
     border: none;
     border-bottom: 1px solid #fff;
     -webkit-box-sizing: border-box;
     -ms-box-sizing: border-box;
     box-sizing: border-box;
     font-family: 'Montserrat', sans-serif;
     font-size: 15px;
     font-weight: 600;
     letter-spacing: 1px;
     line-height: normal;
     text-align: center;
     color: #fff;
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
.form-input:focus {
     border-bottom: 1px solid #fff;
}
 .form-input.black {
     border-bottom: 1px solid rgba(0, 0, 0, .2);
     color: #000;
}
 .form-input.black:focus {
     border-bottom: 1px solid #000;
}
 textarea.form-input {
     height: 100px;
     margin-bottom: 0 !important;
}
/* 22.3. Input with border ========================================================================== */
 .form-input.form-input_border {
     margin-bottom: 20px;
     padding: 20px;
     border: 1px solid rgba(250, 250, 250, .2);
     text-align: left;
}
 .form-input.form-input_border:focus {
     border: 1px solid #fff;
}
 .form-input.form-input_border.black {
     border: 1px solid rgba(0, 0, 0, .2);
}
 .form-input.form-input_border.black:focus {
     border: 1px solid #000;
}
/* 22.4. Search form ========================================================================== */
 .form-search {
     position: relative;
}
 .form-search .form-input {
     margin-bottom: 0;
     padding: 10px 30px 10px 10px;
     border: 1px solid rgba(250, 250, 250, .2);
     text-align: left;
}
 .form-search .form-input:focus {
     border: 1px solid #fff;
}
 .form-search .form-input.black {
     border: 1px solid rgba(0, 0, 0, .2);
}
 .form-search .form-input.black:focus {
     border: 1px solid #000;
}
 .search-btn {
     position: absolute;
     top: 50%;
     right: 10px;
     z-index: 2;
     opacity: .5;
     border: none;
     font-size: 13px;
     line-height: 13px;
     text-align: center;
     color: #fff;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     -webkit-transition: .5s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .5s cubic-bezier(.225, 1, .316, .99);
     transition: .5s cubic-bezier(.225, 1, .316, .99);
}
 .search-btn.black {
     color: #000;
}
 .search-btn:hover {
     opacity: 1;
}
/* ========================================================================== 23. Post comments ========================================================================== */
 .comments-list {
     width: 100%;
}
 .comment-content {
     margin-bottom: 30px;
     padding-bottom: 20px;
     border-bottom: 1px solid rgba(250, 250, 250, .1);
}
 .comments-list.black .comment-content {
     border-bottom: 1px solid rgba(0, 0, 0, .1);
}
 .comment-content:last-child, .comments-list.black .comment-content:last-child {
     margin-bottom: 0;
     padding-bottom: 0;
     border-bottom: none;
}
 .comment-children {
     margin: 20px 0 0 90px;
     padding-top: 30px;
     border-top: 1px solid rgba(250, 250, 250, .1);
}
 .comments-list.black .comment-children {
     border-top: 1px solid rgba(0, 0, 0, .1);
}
 .comment-content {
     position: relative;
}
 .comment-avatar {
     width: 70px;
     position: absolute;
     left: 0;
     top: 0;
}
 .comment-post {
     padding-left: 90px;
}
 @media only screen and (max-width: 999px) {
     .comment-children {
         margin: 20px 0 0 0;
    }
}
/* ========================================================================== 24. List styles ========================================================================== */
 .list.list_center {
     text-align: center;
}
 .list.list_right {
     text-align: right;
}
 .list.list_row {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     margin-top: -10px;
}
 .list.list_row.list_center {
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
}
 .list.list_row.list_right {
     -webkit-box-pack: end;
     -ms-flex-pack: end;
     justify-content: flex-end;
}
/* 24.1. List item ========================================================================== */
 .list__item {
     display: block !important;
     position: relative;
     line-height: 1;
}
/* 24.1.1. List item margins ========================================================================== */
/* Defaul margins 10px */
 .list__item, .list .list .list__item {
     margin-bottom: 10px;
}
 .list__item:last-child, .list .list .list__item:last-child {
     margin-bottom: 0;
}
 .list_row .list__item {
     margin-top: 10px;
     margin-right: 10px;
     margin-bottom: 0;
}
 .list_row.list_center .list__item {
     margin-left: 5px;
     margin-right: 5px;
}
 .list_row.list_right .list__item {
     margin-left: 10px;
     margin-right: 0;
}
/* 1px margins */
 .list_margin-1px .list__item, .list .list.list_margin-1px .list__item {
     margin-bottom: 1px;
}
 .list_margin-1px .list__item:last-child, .list .list.list_margin-1px .list__item:last-child {
     margin-bottom: 0;
}
 .list_margin-1px.list_row .list__item {
     margin-right: 1px;
     margin-bottom: 0;
}
 .list_margin-1px.list_row.list_center .list__item {
     margin-left: 1px;
     margin-right: 1px;
}
 .list_margin-1px.list_row.list_right .list__item {
     margin-left: 1px;
     margin-right: 0;
}
/* 20px margins */
 .list_margin-20px .list__item, .list .list.list_margin-20px .list__item {
     margin-bottom: 20px;
}
 .list_margin-20px .list__item:last-child, .list .list.list_margin-20px .list__item:last-child {
     margin-bottom: 0;
}
 .list_margin-20px.list_row .list__item {
     margin-right: 20px;
     margin-bottom: 0;
}
 .list_margin-20px.list_row.list_center .list__item {
     margin-left: 10px;
     margin-right: 10px;
}
 .list_margin-20px.list_row.list_right .list__item {
     margin-left: 20px;
     margin-right: 0;
}
/* 30px margins */
 .list_margin-30px .list__item, .list .list.list_margin-30px .list__item {
     margin-bottom: 30px;
}
 .list_margin-30px .list__item:last-child, .list .list.list_margin-30px .list__item:last-child {
     margin-bottom: 0;
}
 .list_margin-30px.list_row .list__item {
     margin-right: 30px;
     margin-bottom: 0;
}
 .list_margin-30px.list_row.list_center .list__item {
     margin-left: 15px;
     margin-right: 15px;
}
 .list_margin-30px.list_row.list_right .list__item {
     margin-left: 30px;
     margin-right: 0;
}
/* 24.1.2. List item icons ========================================================================== */
 .list__item.dot, .list__item.check, .list__item.x {
     padding-left: 30px;
}
 .list__item:before {
     position: absolute;
     left: 0;
     top: 50%;
     z-index: 4;
     font-family: Font Awesome;
     font-size: 10px;
     color: #fff;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
}
 .list__item.black:before {
     color: #000;
}
 .list__item.red:before {
     color: var(--main-color);
}
 .list__item.opacity-05:before {
     opacity: .5;
}
 .list__item.dot:before {
     content: '\f111';
     font-size: 6px;
}
 .list__item.check:before {
     content: '\f00c';
}
 .list__item.x:before {
     content: '\f00d';
}
/* 24.2. List counter ========================================================================== */
 .list_counter .list__item {
     padding-left: 30px;
}
 .list_counter .list__item:before {
     font-family: 'Montserrat', sans-serif;
     font-weight: 400;
}
 .list_counter .list__item:nth-child(1):before {
     content: '01';
}
 .list_counter .list__item:nth-child(2):before {
     content: '02';
}
 .list_counter .list__item:nth-child(3):before {
     content: '03';
}
 .list_counter .list__item:nth-child(4):before {
     content: '04';
}
 .list_counter .list__item:nth-child(5):before {
     content: '05';
}
 .list_counter .list__item:nth-child(6):before {
     content: '06';
}
 .list_counter .list__item:nth-child(7):before {
     content: '07';
}
 .list_counter .list__item:nth-child(8):before {
     content: '08';
}
 .list_counter .list__item:nth-child(9):before {
     content: '09';
}
 .list_counter .list__item:nth-child(10):before {
     content: '10';
}
 .list_counter .list__item:nth-child(11):before {
     content: '11';
}
 .list_counter .list__item:nth-child(12):before {
     content: '12';
}
 .list_counter .list__item:nth-child(13):before {
     content: '13';
}
 .list_counter .list__item:nth-child(14):before {
     content: '14';
}
 .list_counter .list__item:nth-child(15):before {
     content: '15';
}
 .list_counter .list__item:nth-child(16):before {
     content: '16';
}
 .list_counter .list__item:nth-child(17):before {
     content: '17';
}
 .list_counter .list__item:nth-child(18):before {
     content: '18';
}
 .list_counter .list__item:nth-child(19):before {
     content: '19';
}
 .list_counter .list__item:nth-child(20):before {
     content: '20';
}
/* ========================================================================== 25. Isotope grid ========================================================================== */
 .grid-item-25-50-100 {
     display: block;
     width: 25%;
}
 .grid-item-33-50-100, .empty-grid-200px-33-none, .empty-grid-100px-33-50-none, .empty-grid-1px-33-50-none {
     display: block;
     width: 33.33%;
}
 .grid-item-50-50-100, .empty-grid-100px-50-50-none, .empty-grid-1px-50-50-none {
     display: block;
     width: 50%;
}
 .empty-grid-1px-33-50-none, .empty-grid-1px-50-50-none {
     height: 1px;
}
 .empty-grid-200px-33-none {
     height: 200px;
}
 .empty-grid-100px-33-50-none, .empty-grid-100px-50-50-none {
     height: 100px;
}
 .grid-margin-box {
     display: block;
     margin: 0 20px;
}
 .grid-margin-box_10px {
     display: block;
     margin: 0 10px;
}
 @media only screen and (max-width: 999px) {
     .grid-item-25-50-100, .grid-item-33-50-100, .empty-grid-100px-33-50-none, .empty-grid-1px-33-50-none {
         width: 50%;
    }
     .empty-grid-200px-33-none {
         display: none;
    }
}
 @media only screen and (max-width: 767px) {
     .grid-item-25-50-100, .grid-item-33-50-100, .grid-item-50-50-100 {
         width: 100%;
    }
     .empty-grid-100px-33-50-none, .empty-grid-1px-33-50-none, .empty-grid-100px-50-50-none, .empty-grid-1px-50-50-none {
         display: none;
    }
     .grid-margin-box, .grid-margin-box_10px {
         margin: 0;
    }
     .lines-section .grid-margin-box {
         margin: 0 20px;
    }
     .lines-section .grid-margin-box_10px {
         margin: 0 10px;
    }
}
 @media only screen and (max-width: 549px) {
     .lines-section .grid-margin-box, .lines-section .grid-margin-box_10px {
         margin: 0;
    }
}
/* ========================================================================== 26. Accordion ========================================================================== */
 .accordion {
     overflow: hidden;
     border-bottom: 1px solid var(--main-color);
}
 .accordion__tab {
     position: relative;
}
 .accordion__content {
     display: none;
     padding: 30px 10px;
}
/* 26.1. Accordion button ========================================================================== */
 .accordion__btn {
     overflow: hidden;
     padding: 15px 10px;
     position: relative;
}
 .accordion__btn:before {
     content: '';
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: -100%;
     background-color: var(--main-color);
     -webkit-transform: translateY(1px);
     -ms-transform: translateY(1px);
     transform: translateY(1px);
     -webkit-transition: .5s cubic-bezier(.858, .01, .068, .99);
     -o-transition: .5s cubic-bezier(.858, .01, .068, .99);
     transition: .5s cubic-bezier(.858, .01, .068, .99);
}
 .accordion__tab:first-child .accordion__btn:before {
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
}
 .js-accordion-btn.js-accordion-active:before {
     -webkit-transform: translateY(100%);
     -ms-transform: translateY(100%);
     transform: translateY(100%);
}
/* 26.2. Accordion button icon ========================================================================== */
 .accordion__btn-title {
     position: relative;
     padding-right: 30px;
}
 .accordion__btn-title:before, .accordion__btn-title:after {
     content: '';
     width: 1px;
     height: 15px;
     position: absolute;
     top: 50%;
     right: 7px;
     background-color: #fff;
     -webkit-transform: translateY(-50%) rotate(0);
     -ms-transform: translateY(-50%) rotate(0);
     transform: translateY(-50%) rotate(0);
     -webkit-transition: .5s cubic-bezier(.858, .01, .068, .99);
     -o-transition: .5s cubic-bezier(.858, .01, .068, .99);
     transition: .5s cubic-bezier(.858, .01, .068, .99);
}
 .accordion__btn-title.black-plus-icon:before, .accordion__btn-title.black-plus-icon:after {
     background-color: #000;
}
 .accordion__btn-title:after {
     -webkit-transform: translateY(-50%) rotate(90deg);
     -ms-transform: translateY(-50%) rotate(90deg);
     transform: translateY(-50%) rotate(90deg);
}
 .js-accordion-btn.js-accordion-active .accordion__btn-title:before {
     -webkit-transform: translateY(-50%) rotate(90deg);
     -ms-transform: translateY(-50%) rotate(90deg);
     transform: translateY(-50%) rotate(90deg);
}
 .js-accordion-btn.js-accordion-active .accordion__btn-title:after {
     -webkit-transform: translateY(-50%) rotate(270deg);
     -ms-transform: translateY(-50%) rotate(270deg);
     transform: translateY(-50%) rotate(270deg);
}
/* 26.3. Accordion underline ========================================================================== */
 .accordion.accordion_underline {
     border-bottom: 1px solid rgba(250, 250, 250, .1);
}
 .accordion_underline .accordion__tab {
     border-top: 1px solid rgba(250, 250, 250, .1);
}
 .accordion.accordion_black-underline {
     border-bottom: 1px solid rgba(0, 0, 0, .1);
}
 .accordion_black-underline .accordion__tab {
     border-top: 1px solid rgba(0, 0, 0, .1);
}
 .accordion_underline .accordion__btn:before, .accordion_black-underline .accordion__btn:before {
     content: normal;
}
 .accordion_underline .accordion__content, .accordion_black-underline .accordion__content {
     padding: 0 10px 30px 10px;
}
/* 26.4. Accordion left/right borders ========================================================================== */
 .accordion.accordion_l-r-border {
     border-left: 1px solid rgba(250, 250, 250, .1);
     border-right: 1px solid rgba(250, 250, 250, .1);
}
 .accordion.accordion_black-l-r-border {
     border-left: 1px solid rgba(0, 0, 0, .1);
     border-right: 1px solid rgba(0, 0, 0, .1);
}
/* ========================================================================== 27. Typewriter ========================================================================== */
 .Typewriter__cursor {
     display: inline-block;
     overflow: hidden;
     width: 30px;
     height: 2px;
     background-color: var(--main-color);
}
 @media only screen and (max-width: 999px) {
     .Typewriter__cursor {
         width: 23px;
    }
}
 @media only screen and (max-width: 549px) {
     .Typewriter__cursor {
         width: 15px;
    }
}
/* ========================================================================== 28. Particles ========================================================================== */
 #js-particles {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 0;
     left: 0;
}
/* ========================================================================== 29. Background overlay ========================================================================== */
 .bg-overlay-black, .bg-overlay-white {
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     opacity: .2;
}
 .bg-overlay-black.bg-overlay-black_02, .bg-overlay-white.bg-overlay-white_02 {
     opacity: .2;
}
 .bg-overlay-black.bg-overlay-black_07, .bg-overlay-white.bg-overlay-white_07 {
     opacity: .7;
}
 .bg-overlay-black.bg-overlay-black_47, .bg-overlay-white.bg-overlay-white_47 {
     opacity: .47;
}
 .bg-overlay-black {
     background-color: #00000080;
}
 .bg-overlay-white {
     background-color: #fff;
}
/* ========================================================================== 30. Avatars & Logos ========================================================================== */
/* 30.1. Awards logo ========================================================================== */
 .awards-logo {
     height: 100px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: flex-end;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
}
 .awards-logo__inner {
     width: auto;
     max-width: 100px;
     max-height: 100px;
}
/* 30.2. Testimonials author ========================================================================== */
 .testimonials-author {
     width: 180px;
     margin-left: auto;
     margin-right: auto;
}
/* 30.3. Author avatar ========================================================================== */
 .author-avatar {
     width: 40px;
     height: 40px;
}
/* 30.4. Clients logo ========================================================================== */
 .client-logo {
     width: 100px;
     max-width: 100px;
     max-height: 100px;
}
/* 30.4.1. Clients logo animation ========================================================================== */
 .client-hover-out, .client-hover-in {
     -webkit-transition: .7s cubic-bezier(.225, 1, .316, .99);
     -o-transition: .7s cubic-bezier(.225, 1, .316, .99);
     transition: .7s cubic-bezier(.225, 1, .316, .99);
}
 .client-hover-in {
     opacity: 0;
}
 .hover-box:hover .client-hover-out {
     opacity: 0;
}
 .hover-box:hover .client-hover-in {
     opacity: 1;
}
/* 30.4.2. Clients logo with lines ========================================================================== */
 .clients-lines {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-flow: wrap;
     flex-flow: wrap;
}
 .clients-lines__column {
     -ms-flex-preferred-size: 25%;
     flex-basis: 25%;
}
 .clients-lines__inner {
     min-height: 220px;
     border-right: 1px solid rgba(250, 250, 250, .1);
     border-bottom: 1px solid rgba(250, 250, 250, .1);
}
 .clients-lines__inner.black {
     border-right: 1px solid rgba(0, 0, 0, .1);
     border-bottom: 1px solid rgba(0, 0, 0, .1);
}
 .clients-lines__column:nth-child(4n) .clients-lines__inner {
     border-right: none;
}
 .clients-lines__column:nth-last-child(1) .clients-lines__inner, .clients-lines__column:nth-last-child(2) .clients-lines__inner, .clients-lines__column:nth-last-child(3) .clients-lines__inner, .clients-lines__column:nth-last-child(4) .clients-lines__inner {
     border-bottom: none;
}
 @media only screen and (max-width: 767px) {
     .clients-lines__column {
         -ms-flex-preferred-size: 50%;
         flex-basis: 50%;
    }
     .clients-lines__column:nth-child(2n) .clients-lines__inner {
         border-right: none;
    }
     .clients-lines__column:nth-last-child(3) .clients-lines__inner, .clients-lines__column:nth-last-child(4) .clients-lines__inner {
         border-bottom: 1px solid rgba(250, 250, 250, .1);
    }
     .clients-lines__column:nth-last-child(3) .clients-lines__inner.black, .clients-lines__column:nth-last-child(4) .clients-lines__inner.black {
         border-bottom: 1px solid rgba(0, 0, 0, .1);
    }
}
/* 30.4.3. Clients logo with borders ========================================================================== */
 .client-logo-border__inner {
     height: 100%;
     min-height: 220px;
     border-top: 1px solid rgba(250, 250, 250, .1);
     border-right: 1px solid rgba(250, 250, 250, .1);
}
 .client-logo-border__inner.black {
     border-top: 1px solid rgba(0, 0, 0, .1);
     border-right: 1px solid rgba(0, 0, 0, .1);
}
 .client-logo-border:nth-child(even) .client-logo-border__inner, .client-logo-border:nth-child(even) .client-logo-border__inner.black {
     border-right: none;
}
 .client-logo-border:nth-last-child(1) .client-logo-border__inner, .client-logo-border:nth-last-child(2) .client-logo-border__inner, .client-logo-border:nth-last-child(3) .client-logo-border__inner, .client-logo-border:nth-last-child(4) .client-logo-border__inner {
     border-bottom: 1px solid rgba(250, 250, 250, .1);
}
 .client-logo-border:nth-last-child(1) .client-logo-border__inner.black, .client-logo-border:nth-last-child(2) .client-logo-border__inner.black, .client-logo-border:nth-last-child(3) .client-logo-border__inner.black, .client-logo-border:nth-last-child(4) .client-logo-border__inner.black {
     border-bottom: 1px solid rgba(0, 0, 0, .1);
}
 @media only screen and (max-width: 767px) {
     .client-logo-border__inner, .client-logo-border__inner.black {
         border-right: none;
    }
     .client-logo-border:nth-last-child(2) .client-logo-border__inner, .client-logo-border:nth-last-child(3) .client-logo-border__inner, .client-logo-border:nth-last-child(4) .client-logo-border__inner, .client-logo-border:nth-last-child(2) .client-logo-border__inner.black, .client-logo-border:nth-last-child(3) .client-logo-border__inner.black, .client-logo-border:nth-last-child(4) .client-logo-border__inner.black {
         border-bottom: none;
    }
}
 @media only screen and (max-width: 549px) {
     .client-logo-border .client-logo-border__inner, .client-logo-border:nth-child(even) .client-logo-border__inner {
         border-left: 1px solid rgba(250, 250, 250, .1);
         border-right: 1px solid rgba(250, 250, 250, .1);
    }
     .client-logo-border .client-logo-border__inner.black, .client-logo-border:nth-child(even) .client-logo-border__inner.black {
         border-left: 1px solid rgba(0, 0, 0, .1);
         border-right: 1px solid rgba(0, 0, 0, .1);
    }
}
/* ========================================================================== 31. Contact form ========================================================================== */
 .error {
     color: red;
}
 .js-popup-fade {
     display: flex;
     align-items: center;
     justify-content: center;
     width: 100%;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
     pointer-events: none;
     opacity: 0;
     transition: 1s cubic-bezier(.17, .85, .438, .99);
     -webkit-transform: scale(.5);
     transform: scale(.5);
}
 .js-popup-fade.js-active {
     pointer-events: auto;
     opacity: 1;
     transition-delay: .5s;
     -webkit-transform: scale(1);
     transform: scale(1);
}
 .popup-icon, .popup-alert, .js-popup-close {
     text-align: center;
}
 .popup-icon {
     margin: 0 auto;
     width: 50px;
     height: 50px;
     line-height: 50px;
     font-size: 23px;
     border-radius: 50%;
}
 #m_err .popup-icon {
     color: red;
     border: 1px solid red;
}
 #m_sent .popup-icon {
     color: green;
     border: 1px solid green;
}
 .popup-alert {
     margin: 30px 0;
}
 .form-box {
     transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition-delay: .5s;
}
 .form-box.js-active {
     pointer-events: none;
     opacity: 0;
     transition-delay: 0s;
     -webkit-transform: scale(1.5);
     transform: scale(1.5);
}
 #send.js-active {
     pointer-events: none;
}
 #send.js-active .border-btn__inner {
     color: transparent;
}
 #send .btn-wait {
     display: inline-block;
     position: absolute;
     left: 50%;
     top: 50%;
     font-family: 'Montserrat', sans-serif;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 7px;
     line-height: 1.2;
     text-transform: uppercase;
     color: #fff;
     opacity: 0;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     -webkit-transition: .5s cubic-bezier(.17, .85, .438, .99);
     -o-transition: .5s cubic-bezier(.17, .85, .438, .99);
     transition: .5s cubic-bezier(.17, .85, .438, .99);
}
 #send.js-active .btn-wait {
     opacity: 1;
}
/* ========================================================================== 32. Colors ========================================================================== */
 ::-moz-selection {
     background: none;
     color: rgb(233, 119, 12);
     /* color: var(--main-color); */
}
 ::selection {
     background: none;
     color: rgb(233, 119, 12);
     /* color: var(--main-color); */
}
 body {
     background-color: #000;
     color: #fff;
}
/* 32.1. Background colors ========================================================================== */
 .section-bg-black, .content-bg-black, .text-bg-black {
     background-color: #000;
}
 .section-bg-white, .content-bg-white, .text-bg-white {
     background-color: #fff;
}
 .section-bg-light-1, .content-bg-light-1, .text-bg-light-1 {
     background-color: var(--bg-light-1);
}
 .section-bg-light-2, .content-bg-light-2, .text-bg-light-2 {
     background-color: var(--bg-light-2);
}
 .section-bg-dark-1, .content-bg-dark-1, .text-bg-dark-1 {
     background-color: var(--bg-dark-1);
}
 .section-bg-dark-2, .content-bg-dark-2, .text-bg-dark-2 {
     background-color: var(--bg-dark-2);
}
 .content-bg-red, .text-bg-red {
     background-color: var(--main-color);
}
/* 32.2. Text colors ========================================================================== */
 body .text-color-white {
     color: #fff;
}
 .text-color-white:before {
     color: #fff !important;
}
 body .text-color-dadada {
     color: #dadada;
}
 .text-color-dadada:before {
     color: #dadada !important;
}
 body .text-color-b0b0b0 {
     color: #b0b0b0;
}
 .text-color-b0b0b0:before {
     color: #b0b0b0 !important;
}
 body .text-color-8a8a8a {
     color: #8a8a8a;
}
 .text-color-8a8a8a:before {
     color: #8a8a8a !important;
}
 body .text-color-e4e4e4 {
     color: #e4e4e4;
}
 .text-color-e4e4e4:before {
     color: #e4e4e4 !important;
}
 body .text-color-bbbbbb {
     color: #bbbbbb;
}
 .text-color-bbbbbb:before {
     color: #bbbbbb !important;
}
 body .text-color-979797 {
     color: #979797;
}
 .text-color-979797:before {
     color: #979797 !important;
}
 body .text-color-black {
     color: #000;
}
 .text-color-black:before {
     color: #000 !important;
}
 body .text-color-6d6d6d {
     color: #6d6d6d;
}
 .text-color-6d6d6d:before {
     color: #6d6d6d !important;
}
 body .text-color-888888 {
     color: #888888;
}
 .text-color-888888:before {
     color: #888888 !important;
}
 body .text-color-9b9b9b {
     color: #9b9b9b;
}
 .text-color-9b9b9b:before {
     color: #9b9b9b !important;
}
 body .text-color-6a6a6a {
     color: #6a6a6a;
}
 .text-color-6a6a6a:before {
     color: #6a6a6a !important;
}
 body .text-color-838383 {
     color: #838383;
}
 .text-color-838383:before {
     color: #838383 !important;
}
 body .text-color-969696 {
     color: #969696;
}
 .text-color-969696:before {
     color: #969696 !important;
}
 body .text-color-red {
     color: var(--main-color);
}
 .text-color-red:before {
     color: var(--main-color) !important;
}
/* 32.3. Text hover colors ========================================================================== */
 .text-hover-to-red:hover {
     color: var(--main-color) !important;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .text-hover-to-white:hover {
     color: #fff !important;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
 .text-hover-to-black:hover {
     color: #000 !important;
     -webkit-transition: 1s cubic-bezier(.17, .85, .438, .99);
     -o-transition: 1s cubic-bezier(.17, .85, .438, .99);
     transition: 1s cubic-bezier(.17, .85, .438, .99);
}
/* 32.4. Main colors ========================================================================== */
/* Background colors */
 :root {
     --bg-light-1: #f5f5f5;
}
 :root {
     --bg-light-2: #f0f0f0;
}
 :root {
     --bg-dark-1: #111517;
}
 :root {
     --bg-dark-2: #1b2a2f;
}
/* Red colors */
 :root {
     --main-color: #d0bf7d;
}
 .headline-xl small {
     font-size: 60%;
}
/* .js-3-view-slider .js-slider-scroll-anim-active .swiper-slide .anim-img-scale {
     max-height: 250px;
}
 */
/* .js-2-view-slider .js-slider-scroll-anim-active .swiper-slide .anim-img-scale {
     width: 180px;
     height: 180px;
}
 .js-2-view-slider .js-slider-scroll-anim-active .swiper-slide .anim-img-scale img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     object-position: top;
}
 */
/* .Work-section .anim-img-scale {
     height:383px;
}
 .Work-section .anim-img-scale img{
     width: 100%;
     height: 100%;
     object-fit: cover;
}
 */
/* .Creative-section .anim-img-scale,.event-section .anim-img-scale {
     height:450px;
}
 .Creative-section .anim-img-scale img,.event-section .anim-img-scale img{
     width: 100%;
     height: 100%;
     object-fit: cover;
     object-position: top;
}
 .blog-section .anim-img-scale {
     height:600px;
}
 .blog-section .anim-img-scale img{
     width: 100%;
     height: 100%;
     object-fit: cover;
}
 .Creative-section .js-3-view-slider .js-slider-scroll-anim-active .swiper-slide .anim-img-scale{
     max-height: 450px;
}
 */
 .headline-m strong {
     font-weight: 600;
}
 .event-section .anim-overlay {
     width: 100%;
     height: 270px;
}
 .event-section .anim-overlay img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     object-position: center;
}
 .event-section .headline-xxxs {
     font-size: 20px;
}
 .event-section .padding-top-bottom-30 {
     padding-top: 15px;
     padding-bottom: 20px;
}
 .blogpage-section .pos-left-bottom {
     right: 20px;
}
 .bloginner-section .skew-btn__arrow:before {
     width: 8px;
     height: 8px;
}
 .bloginner-section .skew-btn__arrow:after{
     right:4px;
}
 .menu-box .nav-btn__inner {
     text-transform: uppercase;
}
 .amenities-block .d-flex {
     -webkit-flex-direction: column;
     -moz-flex-direction: column;
     -ms-flex-direction: column;
     -o-flex-direction: column;
     flex-direction: column;
}
 .amenities-block .headline-xxxxs {
     font-size: 16px;
     padding: 0 10px;
     text-align: center;
}
 .amenities-block .client-logo {
     max-width: 70px;
}
 .amenities-block .clients-lines__inner:hover h5 {
     color: #d0bf7d;
}
 .testimonials-section .eqwidth_height {
     width: 100%;
     padding-top: 100%;
}
 .testimonials-section .eqwidth_height iframe {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
}
 @media only screen and (max-width: 767px) {
     table,tbody,tr,td,th {
        /* display: block;
         */
         /* width: 100%; */
    }
     thead {
         display: none;
    }
     td:empty {
         display: none;
    }
     td {
         text-align: right;
    }
     td:before {
         content: attr(data-column);
         text-align: left;
    }
}
 .project-section a.d-block,.project-section img {
     width: 100% 
}
 .project-section span.subhead-xxs {
     font-size: 16px;
    font-weight: 200;
}
 .project-section h4.subhead-xs {
     font-size: 17px;
}
 .contact-banner-bg h1 {
     font-size: 3vw;
     margin-bottom: 50px;
}
 .contact-form-page input[type="text"] {
     width: 80%;
     height: 50px;
     padding: 0;
     float: left;
     background: transparent;
     text-align: center;
     font-size: 18px;
     border-top: none;
     border-left: none;
     border-right: none;
}
 .contact-form-page .input-group {
     align-items: unset;
     -ms-flex-align: unset;
     float: left;
     display: flex;
     width: 100%;
     margin-bottom: 20px;
}
 .contact-form-page .input-group label {
     float: left;
     display: unset;
     margin: 0;
     width: 25%;
     font-size: 20px;
}
 .contact-form-page .input-group textarea {
     background: transparent;
     border-top: none;
     border-left: none;
     border-right: none;
     width: 100%;
     text-align: center;
     font-size: 18px;
     height: 100px;
}
 .contact-form-page input::-webkit-input-placeholder, .contact-form-page textarea::-webkit-input-placeholder {
    /* Edge */
}
 .contact-form-page input:-ms-input-placeholder, .contact-form-page textarea:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
}
 .contact-form-page input::placeholder, .contact-form-page textarea::placeholder {
}
 .contact-banner-bg.page-header .container h1 {
     font-size: 3vw;
     margin-bottom: 50px;
}
 .contact-form-page h2 {
     padding: 20px 0 30px;
    clear: both;
}
 i.fab.fa-facebook-f {
     font-size: 18px;
}
 i.fab.fa-instagram {
     font-size: 18px;
}
 .padding-bottom-200 {
     padding-bottom: 250px;
}
 .padding-bottom-100 {
     padding-bottom: 200px;
}
 .mb-100{
     margin-bottom: 150px;
}
 img.awards-logo__inner:hover {
     filter: invert(1);
}
 .content-bg-blue {
     background-color: #1b2a2f;
}
/* popup form */
 .Click-here {
     cursor: pointer !important;
    /* background-image: linear-gradient(190deg, #f83600 0%, #fee140 100%);
     */
     color: #fff;
     width: 180px;
     text-align: center;
     font-size:16px;
    /* padding: 18px 0;
     */
     margin: 0 auto;
     transition:background-image 3s ease-in-out;
}
 .Click-here:hover{
     transition:background-image 3s ease-in-out;
    /* background-image: linear-gradient(90deg, #fee140 0%, #f83600 100%);
     */
}
 .custom-model-main,
 .custom-model-main-1,
 .custom-model-main-2,
 .custom-model-main-3,
 .custom-model-main-4,
 .custom-model-main-5,
 .custom-model-main-6,
 .custom-model-main-7,
 .custom-model-main-8 {
     text-align: center;
     overflow: hidden;
     position: fixed;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
    /* z-index: 1050;
     */
     -webkit-overflow-scrolling: touch;
     outline: 0;
     opacity: 0;
     -webkit-transition: opacity 0.15s linear, z-index 0.15;
     -o-transition: opacity 0.15s linear, z-index 0.15;
     transition: opacity 0.15s linear, z-index 0.15;
     z-index: -1;
     overflow-x: hidden;
     overflow-y: auto;
}
 .model-open,
 .model-open-1,
 .model-open-2,
 .model-open-3,
 .model-open-4,
 .model-open-5,
 .model-open-6,
 .model-open-7,
 .model-open-8 {
     z-index: 99999;
     opacity: 1;
     overflow: hidden;
}
 .custom-model-inner {
     -webkit-transform: translate(0, -25%);
     -ms-transform: translate(0, -25%);
     transform: translate(0, -25%);
     -webkit-transition: -webkit-transform 0.3s ease-out;
     -o-transition: -o-transform 0.3s ease-out;
     transition: -webkit-transform 0.3s ease-out;
     -o-transition: transform 0.3s ease-out;
     transition: transform 0.3s ease-out;
     transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
     display: inline-block;
     vertical-align: middle;
     width: 600px;
     margin: 30px auto;
     max-width: 97%;
}
 .custom-model-wrap {
     display: block;
     width: 100%;
     position: relative;
     background-color: #fff;
     border: 1px solid #999;
     border: 1px solid rgba(0, 0, 0, 0.2);
     border-radius: 6px;
     -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
     box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
     background-clip: padding-box;
     outline: 0;
     text-align: left;
     padding: 20px;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
     max-height: calc(100vh - 70px);
     overflow-y: auto;
}
 .model-open .custom-model-inner,
 .model-open-1 .custom-model-inner,
 .model-open-2 .custom-model-inner,
 .model-open-3 .custom-model-inner,
 .model-open-4 .custom-model-inner,
 .model-open-5 .custom-model-inner,
 .model-open-6 .custom-model-inner,
 .model-open-7 .custom-model-inner,
 .model-open-8 .custom-model-inner {
     -webkit-transform: translate(0, 0);
     -ms-transform: translate(0, 0);
     transform: translate(0, 0);
     position: relative;
     z-index: 999;
}
 .model-open .bg-overlay,
 .model-open-1 .bg-overlay,
 .model-open-2 .bg-overlay,
 .model-open-3 .bg-overlay,
 .model-open-4 .bg-overlay,
 .model-open-5 .bg-overlay,
 .model-open-6 .bg-overlay,
 .model-open-7 .bg-overlay,
 .model-open-8 .bg-overlay {
     background: rgba(0, 0, 0, 0.6);
     z-index: 99;
}
 .bg-overlay {
     background: rgba(0, 0, 0, 0);
     height: 100vh;
     width: 100%;
     position: fixed;
     left: 0;
     top: 0;
     right: 0;
     bottom: 0;
     z-index: 0;
     -webkit-transition: background 0.15s linear;
     -o-transition: background 0.15s linear;
     transition: background 0.15s linear;
}
 .close-btn {
     position: absolute;
     right: 0;
     top: -30px;
     cursor: pointer;
     z-index: 99;
     font-size: 30px;
     color: #fff;
}
 @media screen and (min-width:800px){
     .custom-model-main:before,
	 .custom-model-main-1:before,
	 .custom-model-main-2:before
	 .custom-model-main-3:before
	 .custom-model-main-4:before
	 .custom-model-main-5:before
	 .custom-model-main-6:before,
     .custom-model-main-7:before,
     .custom-model-main-8:before {
         content: "";
         display: inline-block;
         height: auto;
         vertical-align: middle;
         margin-right: -0px;
         height: 100%;
    }
}
 @media screen and (max-width:799px){
     .custom-model-inner{
        margin-top: 45px;
    }
}
 .custom-model-wrap h2 {
     text-align: center;
     font-size: 40px;
     color: #000;
}
 .custom-model-wrap input, .custom-model-wrap textarea {
        width: 100%;
        margin: 10px 0;
        padding: 10px 0 10px 10px;
        border: 1px solid #ddd;
        cursor: pointer !important;
}
 .custom-model-wrap button {
     background: #1f2021;
     border: none;
     padding: 15px 25px;
     color: #fff;
     font-size: 16px;
}

 .saad-gallery-section li.list__item .border-btn__inner, .terra-teas-section li.list__item .border-btn__inner{
     padding: 0;
     font-weight: 500;
}
 .saad-gallery-section li.list__item a.border-btn, .terra-teas-section li.list__item a.border-btn {
     width: 30px;
     height: 30px;
     padding: 10px;
     margin: 0 auto;
     text-align: center;
}
 .saad-gallery-section li.list__item, .terra-teas-section li.list__item{
     margin: 0;
}
 .saad-gallery-section li.list__item a i, .terra-teas-section li.list__item a i {
     font-size: 20px;
     line-height: 30px;
     margin-left: 5px;
}
 .saad-gallery-section h6, .terra-teas-section h6 {
     color: #d0bf7d;
     font-size: 20px;
     margin-bottom: 10px;
     font-weight: 500;
}
/* placeholder css */
 ::-webkit-input-placeholder {
     color: #c1b9b9;
}
 ::-moz-placeholder {
     color: #c1b9b9;
}
 :-ms-input-placeholder {
     color: #c1b9b9;
}
 :-moz-placeholder {
     color: #c1b9b9;
}
 .padding-bottom-300{
     padding-bottom: 250px;
}
 @media (min-width:1024px) and (max-width: 1440px) {
     .container.padding-bottom-.mb-260 {
         margin-bottom: 260px;
    }
     .padding-60{
         padding-top: 60px;
         padding-bottom: 60px;
    }
}
 @media (min-width:768px) and (max-width: 1024px) {
     .about-section{
         width: 850px;
    }
     .padding-60{
         padding-top: 60px;
         padding-bottom: 60px;
    }
}
 @media (min-width: 425px) and (max-width: 768px){
     .about-section {
         width: 650px;
    }
     .padding-60{
         padding-top: 60px;
         padding-bottom: 60px;
    }
     .dropdown-close {
         overflow: hidden;
         width: 60px;
         height: 30px;
         position: absolute;
         top: 30px;
         left: 70%;
         -webkit-transform: translateX(-50%);
         -ms-transform: translateX(-50%);
         transform: translateX(-50%);
         z-index: 3;
    }
     .container.small.padding-top-bottom-120.padding-60.margin-left {
         margin-left: 40px;
         font-size: 30px;
    }
     .padding-top-bottom-120.container.small.after-preloader-anim.margin-left {
         margin-left: 50px;
    }
     .column-100-100 {
         -ms-flex-preferred-size: 100% !important;
         flex-basis: 49% !important;
         margin-left: 5px !important;
    }
     .four-columns {
         -ms-flex-preferred-size: 33.33%;
         flex-basis: 100%;
    }
}
 @media (min-width: 375px) and (max-width: 425px){
     .about-section {
         width: 380px;
    }
     .padding-60{
         padding-top: 60px;
         padding-bottom: 60px;
    }
     .press-release-section .column-100-100.padding-top-30.column100, .featured-in-section .column-100-100.padding-top-30.column100 {
         -ms-flex-preferred-size: 100% !important;
         flex-basis: 100% !important;
         margin-left: 0 !important;
    }
     .event .width-50 {
         width: 44% !important;
         padding: 20px;
    }
}
 @media screen and (max-width: 375px){
     .about-section {
         width: 350px;
    }
     .padding-60{
         padding-top: 60px;
         padding-bottom: 60px;
    }
}
 .custom-model-wrap .Quick_Inquiry input::-webkit-input-placeholder, .custom-model-wrap .Quick_Inquiry textarea::-webkit-input-placeholder {
    /* Edge */
     color: #000 !important;
}
 .custom-model-wrap .Quick_Inquiry input:-ms-input-placeholder, .custom-model-wrap .Quick_Inquiry textarea:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
     color: #000 !important;
}
 .custom-model-wrap .Quick_Inquiry input::placeholder, .custom-model-wrap .Quick_Inquiry textarea::placeholder {
     color: #000 !important;
}

.custom-model-wrap .Quick_Inquiry input::placeholder, .custom-model-wrap .Quick_Inquiry textarea::placeholder {
    color: #000 !important;
}

 .header-bg {
     position: relative;
}
 .header-bg:before {
     content: '';
     position: fixed;
     width: 100%;
     background: #0f153e;
     display: block;
     top: 0;
     height: 90px;
     left: 0;
     right: 0;
     z-index: 3;
}
 .header-bg .header-logo {
    width: 210px;
    height: 58px;
}
 .header-bg .menu-icon {
     margin-top: 10px;
}
 .home-main .anim-img-scale .anim-img-scale__inner.project-radius {
     border-radius: 20px;
}
 .text-red{
     color: #d0bf7d;
}
 h3.headline-xxxs.pos-abs.pos-left-bottom.hover-move-right.project-btn {
     border: 2px solid #ffffff;
     font-weight: 500;
     padding: 10px 20px 10px 20px;
     line-height: 1.5em;
     background: transparent;
     border-radius: 0px;
     box-shadow: 0px 28px 35px rgb(0 0 0 / 5%);
}
 h3.headline-xxxs.pos-abs.pos-left-bottom.hover-move-right.project-btn:hover {
     background: #1b2a2f;
}
 a.d-block.hover-box.js-pointer-large.btn1 {
     left: -250px;
     position: relative;
     display: flex;
}
 .img-content {
     position: relative;
     top: 120px;
     z-index: 1;
     text-align: right;
     right: 50px;
}
 h3.headline-xxxs-project {
     font-family: 'Montserrat', sans-serif;
     font-size: 34px;
     font-weight: 400;
}
 .img-content p {
     font-size: 23px;
     line-height: 1.5em;
     margin-top: 10px;
}
 .col-md-4 {
     width: 30%;
     padding: 16px;
}
 #landmarks .content-bg-light-2 {
     /* background-color: #cccccc80; */
     background-color: #d0bf7d;
}
 img.img-fluid {
     border-radius: 1%;
}
 .project-section-width{
     max-width: 1750px;
}
 h2.headline-xxxs.text-color-black.text-center.font-40 {
     font-size: 40px;
     font-weight: 400;
}
 h3.headline-xxxxs.text-color-black.hover-move-right.font-weight-500 {
     font-weight: 500;
}
 img.img-fluid-post {
     height: 600px;
     width: 600px;
     margin: 0 auto;
     display: block;
}
 .Stand-apart {
     cursor: pointer;
     background: #fff !important;
     color: #000;
     width: 150px;
     top: -110px;
     left: 0px;
     position: relative;
     text-align: center;
     padding: 18px 0;
     margin: 0 auto;
     opacity: 0;
     transition:background-image 3s ease-in-out;
}
 .Stand-apart:hover{
     transition:background-image 3s ease-in-out;
     background: #fff;
}
 #stand-apart-section:hover .Stand-apart {
     opacity: 1;
     transition: opacity .35s ease;
}
 ::-webkit-input-placeholder {
    /* Edge */
     color: #fff;
}
 :-ms-input-placeholder {
    /* Internet Explorer 10-11 */
     color: #fff;
}
 ::placeholder {
     color: #fff;
}
.project_logo {
    height: 60px;
    width: auto;
}
.desklogo__img{
    height: 70px;
    width: auto;
    padding: 10px;
}
.padding-bottom-0{
    padding-bottom: 0;
}
.w-auto{
    width: auto !important;
}
.margin-10-auto{
    margin: 10px auto;
}
.margin-20-auto{
   margin: 20px auto;
}
.margin-0-auto {
    margin: 0 auto;
} 
.margin-right-20{
    margin-right: 20px;
}
.blog-title {
    color: #333;
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 20px;
    margin-top: 10px;
}
.blog-title-sm{
    color: #333;
    font-weight: 600;
    font-size: 18px;
    margin-bottom: 20px;
}
.h-377{
    height: 377px;
}
.max-height-blog-img{
    max-height: 364px;
}
 @media (min-width: 425px) and (max-width: 768px){
    .blog-pages .column-100-100 {
        -ms-flex-preferred-size: 100% !important;
        flex-basis: 100% !important;
        margin-left: 0 !important;
    }
}
@media only screen and (max-width: 767px){
.banner-section {
    height: 60vh;
}
}
#form_process {
                -webkit-animation-name: spinnerRotate;
                -webkit-animation-duration: 1.1s;
                -webkit-animation-iteration-count: infinite;
                -webkit-animation-timing-function: linear;
                -moz-animation-name: spinnerRotate;
                -moz-animation-duration: 1.1s;
                -moz-animation-iteration-count: infinite;
                -moz-animation-timing-function: linear;
                -ms-animation-name: spinnerRotate;
                -ms-animation-duration: 1.1s;
                -ms-animation-iteration-count: infinite;
                -ms-animation-timing-function: linear;
                display: inline-block;
                margin-left: 10px;
                position: relative;
                visibility: hidden;
            }

            #error_data {
                color: red;
                font-size: 14px;
                margin: 0px 0px 10px;
                line-height: normal;
            }
            .alert.alert-success {
                color: #508e14;
                background: #f0f0f0;
                padding: 10px 15px;
                font-weight: 700;
                letter-spacing: 0.5px;
                line-height: 28px;
            }
            .alert.alert-danger {
                color: #454545;
                background-color: #ffb4b4;
                padding: 10px 15px;
                font-weight: 700;
                letter-spacing: 0.5px;
                line-height: 28px;
            }
            .h-80{
                height: 80px !important;
            }
            .footer-mob-box{
    display: none;
}

img.header-logo__img.white.project_logo.sanidha {
    height: 90px;
}

.assistant-tooltip { height: 65px !important; }


.sarathya_west {
    margin-top: 460px;
}

.model-open-1 .custom-model-wrap input::placeholder, .model-open-1 .custom-model-wrap textarea::placeholder,
.model-open-2 .custom-model-wrap input::placeholder, .model-open-2 .custom-model-wrap textarea::placeholder,
.model-open-3 .custom-model-wrap input::placeholder, .model-open-3 .custom-model-wrap textarea::placeholder,
.model-open-7 .custom-model-wrap input::placeholder, .model-open-7 .custom-model-wrap textarea::placeholder { color: #000; font-weight: 500; }

#ebcaptchatext {
    font-weight: 900;
    color: #000;
}

.custom-model-wrap .input-group.file-wrapper input { color: #000; }

.eventvideo video { width: 100%; height: auto; }

.giftcity { justify-content: center; }

.giftcity .width-50 { width: 30%; }

.eventvideo { text-align: center; }

.eventvideo iframe { width: 100%; height: 600px; max-width: 460px; }

section.sanidhayavideo { background: #fff; }



/* Grid Layout */
.project-showcase {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center;
  background: #ffffffcc;
  backdrop-filter: blur(12px);
  border-radius: 20px;
  padding: 40px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  transition: transform .3s ease;
}
.project-showcase:hover {
  transform: translateY(-6px);
}

/* Image */
.project-image img {
  width: 100%;
  border-radius: 20px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.15);
  transition: transform .4s ease;
}
.project-image img:hover {
  transform: scale(1.05);
}

/* Content */
.project-title {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 20px;
  color: #222;
}
.project-desc {
  font-size: 1rem;
  color: #555;
  line-height: 1.6;
  margin-bottom: 20px;
}
.project-features {
  list-style: none;
  padding: 0;
  margin-bottom: 25px;
}
.project-features li {
  margin-bottom: 8px;
  font-size: 1rem;
  color: #444;
}

/* Button */
.btn-book {
  display: inline-block;
  padding: 12px 24px;
  background: linear-gradient(135deg, #6a11cb, #2575fc);
  color: #fff;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  transition: background .3s ease, transform .3s ease;
}
.btn-book:hover {
  background: linear-gradient(135deg, #2575fc, #6a11cb);
  transform: translateY(-3px);
}

/* Responsive */
@media(max-width: 991px) {
  .project-showcase {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .project-content {
    margin-top: 20px;
  }
}
.project-extra {
  margin-top: 60px;
  color: #1b2a2f; /* match theme */
}

.project-features h2,
.project-gallery h2 {
  font-size: 2rem;
  margin-bottom: 20px;
  color: #0f153e;
  text-align: center;
}

.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 25px;
}

.feature-card {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 6px 14px rgba(0,0,0,0.1);
  transition: transform 0.3s ease;
}

.feature-card:hover {
  transform: translateY(-6px);
}

.feature-card img {
  width: 50px;
  margin-bottom: 12px;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 15px;
}

.gallery-grid img {
  width: 100%;
  border-radius: 12px;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.gallery-grid img:hover {
  transform: scale(1.05);
}