/*
Theme Name: Ares
Theme URI: https://niteothemes.com/cmp-coming-soon-maintenance/?theme=ares
Author: NiteoThemes
Author URI: https://niteothemes.com/
Version: 1.4

Ares CMP Theme, Copyright 2018 NiteoThemes
Ares CMP Theme is distributed under the terms of the GNU GPL

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl.html

All used scripts are distributed under the terms of the GNU GPL v2 or later or under MIT license. 
Bundled images are distributed under the terms of the GNU GPL v2 or later or under MIT license or Unsplash license.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normaalize.css/
*/

body {
    margin: 0;
    position: relative;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

canvas {
    height: 100%!important;
}

.cmp-subscribe input::-webkit-input-placeholder {
    color: white;
}

.cmp-subscribe input::-moz-placeholder {
    color: white;
}

.cmp-subscribe input:-ms-input-placeholder {
    color: white;
}

.cmp-subscribe input:-moz-placeholder {
    color: white;
}

.cmp-subscribe input:not([type="checkbox"]), .cmp-subscribe textarea, .cmp-subscribe select {
    outline: none;
    color: white;
    font-size: 1em;
    padding: 10px 0 10px 10px;
    -webkit-appearance: none;
}

.cmp-subscribe input[type="email"], .cmp-subscribe input[type="text"], .cmp-subscribe textarea, .cmp-subscribe select {
    border: 1px solid white;
    line-height: 2;
    min-width: 63%;
    padding-left: 10px;
    background: transparent;
}

textarea {
    line-height: 1;
}

.cmp-subscribe input[type="submit"] {
    border: 1px solid white;
    line-height: 2;
    min-width: 25%;
    background: white;
    margin-left: 10px;
    color: black;
    padding: 10px 2em;
    text-transform: uppercase;
    border-radius: 0;
    -webkit-appearance: none;
    cursor: pointer;
    transition: all 300ms ease-in-out;
}

.cmp-subscribe input[type="submit"]:hover {
    background: black;
    color: white;
}

a {
    transition: color 200ms ease-in-out;
}

label {
    display: block;
    margin-bottom: 1em;
}

::-webkit-scrollbar {
    width: 11px;
}

::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.8);
    border: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

::-webkit-scrollbar-track {
    background: rgba(170, 170, 170, 0.8);
}

.delay-small {
    -webkit-animation-delay: 200ms;
    animation-delay: 200ms;
}

.delay-small-1 {
    -webkit-animation-delay: 400ms;
    animation-delay: 400ms;
}

.delay-big {
    -webkit-animation-delay: 600ms;
    animation-delay: 600ms;
}

.delay-big-1 {
    -webkit-animation-delay: 800ms;
    animation-delay: 800ms;
}

.delay-huge {
    -webkit-animation-delay: 1000ms;
    animation-delay: 1000ms;
}

.delay-huge-1 {
    -webkit-animation-delay: 1200ms;
    animation-delay: 1200ms;
}

.scrollable {
    overflow: auto;
}

.mobile {
    display: none;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
    font-size: 2.5em;
    margin-bottom: .5em;
    margin-top: 0;
}

img {
    max-width: 100%;
    height: auto;
}

body {
    height: 100vh;
}

.content {
    display: flex;
    height: 100%;
}

.frame-1, .frame-3 {
    display: flex;
    flex-direction: column;
    min-width: 25%;
    padding: 2em;
    box-sizing: border-box;
}

.frame-2 {
    position: relative;
    min-width: 50%;
}

.frame-3 {
    padding: 1em;
}

.frame-3-content {
    margin-top: 50%;
    text-align: center;
}

.logo-wrapper {
    padding: 50px 0;
    max-width: 100%;
    margin: 0 auto;
}

.logo-wrapper img {
    max-width: 100%;
    max-height: 200px;
}

.text-logo {
    font-size: 2em;
    margin-bottom: 0.5em;
    display: inline-block;
}

/* COUNTER */

#counter {
    text-align: center;
    margin: 2em 0 3em 0
}

.counter-box {
    display: inline-block;
}

.counter-number {
    font-size: 3rem;
    font-weight: 700;
    display: inline-block;
    min-width: 0.5em;
}

.counter-box:not(:last-child) span:after {
    content: ':';
    padding: 0 3px 0 6px;
}

.counter-text {
    font-weight: 700;
    font-size: 0.7rem;
}

.counter-label {
    display: none;
    ;
}

.footer {
    z-index: 1;
}

/* SUBSCRIBE FORM */

.form-container {
    visibility: hidden;
    opacity: 0;
    position: fixed;
    overflow: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    color: #696969;
    background: rgba(0, 0, 0, 0.65);
    z-index: 10000;
    transition: all 300ms ease-in-out;
}

.form-container.in-focus {
    visibility: visible;
    opacity: 1;
}

.form-wrapper {
    position: absolute;
    width: auto;
    max-width: 610px;
    margin-left: auto;
    margin-right: auto;
    padding: 3em;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    transition: transform .3s ease-out;
    -webkit-transform: translate(0, -75%);
    -ms-transform: translate(0, -75%);
    -o-transform: translate(0, -75%);
    transform: translate(0, -75%);
    color: white;
    background: rgba(0, 0, 0, 0.92)
}

.in-focus .form-wrapper {
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.close {
    cursor: pointer;
    font-size: 1.5em;
    position: absolute;
    right: 20px;
    top: 20px;
}

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

.cmp-subscribe {
    display: flex;
    flex-direction: column;
}

.cmp-form-inputs {
    order: 1;
}

.subscribe {
    display: inline-block;
    padding: 15px 45px;
    cursor: pointer;
    background: black;
    text-align: center;
    color: white;
    border: 2px solid white;
    font-size: 1.2rem;
    margin: 2rem 1rem;
    transition: all 300ms ease-in-out;
}

.subscribe:hover {
    background-color: #fff;
}

#subscribe-response {
    margin-top: .5em;
}

#background-wrapper, #background-image, #background-color, .slide-background, #slider-wrapper, .background-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.background-overlay {
    z-index: 1000;
}

.video-banner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
}

#background-image, .slide-background {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

#background-image, #slider-wrapper {
    opacity: 0;
    transition: opacity 400ms;
    z-index: 0;
}

#background-image.loaded, .loaded #slider-wrapper {
    opacity: 1;
}

.video-banner iframe, .video-banner video {
    transition: opacity 1500ms;
}

#background-image.pattern {
    background-repeat: repeat;
    background-size: initial;
}

#background-image:not(.slide) {
    background-attachment: fixed;
}

.slick-slider .slide {
    position: relative;
    height: 100%;
}

.slick-list, .slick-slider, .slick-track {
    height: 100%;
}

.prev, .next {
    display: block;
    position: absolute;
    bottom: 200px;
    width: 58px;
    height: 58px;
    z-index: 1;
    line-height: 60px;
    text-align: center;
    cursor: pointer;
    z-index: 100;
    background-color: transparent;
    transition: background-color 300ms ease-in-out;
}

.prev {
    right: -70px;
}

.next {
    right: -100px;
}

.prev::before, .next::before {
    content: "";
    display: inline-block;
    position: relative;
    width: 14px;
    height: 14px;
    border-right: 2px solid white;
    border-top: 2px solid white;
}

.prev::before {
    left: 4px;
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
}

.next::before {
    left: -4px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.next:hover, .prev:hover {
    opacity: .8;
}

/* slider transtion effect*/

#slider.effect-mask-transition .slide-background:nth-child(1) {
    z-index: 30;
}

@-webkit-keyframes mask-play {
    from {
        -webkit-mask-position: 0% 0;
        mask-position: 0% 0;
    }
    to {
        -webkit-mask-position: 100% 0;
        mask-position: 100% 0;
    }
}

@keyframes mask-play {
    from {
        -webkit-mask-position: 0% 0;
        mask-position: 0% 0;
    }
    to {
        -webkit-mask-position: 100% 0;
        mask-position: 100% 0;
    }
}

#slider.effect-mask-transition {
    background: url(img/urban-sprite.png) no-repeat -9999px -9999px;
}

#slider .slide-background:nth-child(1) {
    z-index: 30;
}

#slider.effect-mask-transition .slide-background:nth-child(odd).hide {
    -webkit-mask: url(img/urban-sprite.png);
    mask: url(img/urban-sprite.png);
    -webkit-mask-size: 3000% 100%;
    mask-size: 3000% 100%;
    -webkit-animation: mask-play 1.4s steps(29) forwards;
    animation: mask-play 1.4s steps(29) forwards;
}

#slider.effect-mask-transition .slide-background:nth-child(even).hide {
    -webkit-mask: url(img/urban-sprite.png);
    mask: url(img/urban-sprite.png);
    -webkit-mask-size: 7400% 100%;
    mask-size: 7400% 100%;
    -webkit-animation: mask-play 1.4s steps(73) forwards;
    animation: mask-play 1.4s steps(73) forwards;
}

/* Fallback */

.no-cssmask #slider.effect-mask-transition .slide-background.hide {
    opacity: 0;
    -o-transition: opacity 1.4s ease;
    transition: opacity 1.4s ease;
    -webkit-mask: none !important;
    mask: none !important;
}

/* slider thumbnail */

.slider-thumbnails {
    position: absolute;
    width: 200px;
    height: 200px;
    bottom: 0;
    right: -160px;
    border: 10px solid white;
    border-bottom: none;
    z-index: 2;
    background: white;
    opacity: 0;
    transition: opacity 400ms ease-in-out;
}

.slider-nav {
    opacity: 0;
    transition: opacity 400ms ease-in-out;
}

.loaded .slider-thumbnails, .loaded .slider-nav {
    opacity: 1;
}

.slide-thumb {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    transition: opacity 600ms ease-in-out;
    /* z-index: -1; */
}

.slide-thumb.active {
    opacity: 1;
}

.social-container {
    margin-top: auto;
}

.social-list {
    display: inline-block;
    padding: 0;
    margin-bottom: 0;
    margin-top: auto;
    line-height: 2;
}

.social-list li {
    list-style: none;
    display: block;
    text-align: center;
}

.social-list a {
    font-size: 1.3em;
}

.social-list a:hover i {
    -webkit-animation: spin 300ms linear;
    animation: spin 300ms linear;
}

.flex-divider {
    display: inline-block;
    width: 2px;
    background-color: black;
    height: auto;
    margin: 1em;
    margin-left: 0.6em;
    flex-grow: 1;
}

.copyright {
    margin-bottom: 0;
}

.lang-switch-wrapper {
    position: absolute;
    top: 50px;
    right: 50px;
    z-index: 100;
}

/* 
.social-google-plus:hover {background-color:#dd4b39;}
.social-facebook:hover {background-color:#3b5998;}
.social-twitter:hover {background-color:#1da1f2;}
.social-instagram:hover {background-color:#cd486b;}
.social-skype:hover {background-color:#00aff0;}
.social-500px:hover {background-color:#0099e5;}
.social-deviantart:hover {background-color:#05cc47;}
.social-behance:hover {background-color:#1769ff;}
.social-dribbble:hover {background-color:#ea4c89;}
.social-pinterest:hover {background-color:#bd081c;}
.social-linkedin:hover {background-color:#0077b5;}
.social-tumblr:hover {background-color:#35465c;}
.social-youtube:hover {background-color:#cd201f;}
.social-vimeo:hover {background-color:#1ab7ea;}
.social-flickr:hover {background-color:#0063dc;}
.social-vk:hover {background-color:#45668e;}
.social-envelope-o:hover {background-color:#2c2b2b;}
.social-soundcloud:hover {background-color:#ff7700;}
.social-whatsapp:hover {background-color:#075e54;}
.social-phone:hover {background-color:#2c2b2b;}
.social-telegram:hover {background-color:#e0cfb1;}
.social-xing:hover {background-color:#126567;}
.social-github:hover {background-color:#4078c0;}
.social-snapchat:hover {background-color:#FFFC00;} */

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@media only screen and (max-width: 1600px) {
    body {
        font-size: 16px!important;
    }
    .counter-number {
        font-size: 2.5rem;
    }
}

@media only screen and (max-width: 1366px) {
    #counter {
        margin-bottom: 1em;
    }
    .counter-number {
        font-size: 2rem;
    }
}

@media only screen and (max-width: 1024px) {
    body {
        text-align: center;
    }
    .content {
        display: block;
    }
    .logo-wrapper {
        text-align: center;
    }
    .logo-wrapper img {
        max-height: 100px
    }
    .flex-divider {
        display: none;
    }
    .social-list {
        line-height: 1
    }
    .social-list li {
        display: inline-block;
        padding: 1em;
    }
    .frame-2 {
        height: 50%;
    }
    .slider-thumbnails {
        bottom: -120px;
        right: -1px;
    }
    .slider-nav {
        bottom: -90px;
    }
    .prev {
        right: 260px;
    }
    .next {
        right: 220px;
    }
    .frame-3 {
        margin-top: 200px;
    }
    .frame-3-content {
        margin-top: 0;
    }
    .subscribe {
        max-width: 360px;
        margin: 2em auto;
    }
    .mobile {
        display: block;
    }
    .desktop {
        display: none;
    }
    .form-wrapper {
        padding: 3em 2em
    }
}

@media only screen and (max-width: 460px) {
    .cmp-subscribe input[type="email"] {
        min-width: 100%;
        margin-bottom: 1em;
    }
    .cmp-subscribe input[type="submit"] {
        margin: 0
    }
    .lang-switch-wrapper {
        top: 20px;
        right: 20px;
    }
}