* {
    /* font-family: 'Futura pt'; */
}
*, ::after, ::before {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
body {
    margin: 0;
    background: #131414;
}
[data-aos="show"] {
    opacity: 0;
    -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
            transform: matrix(1, 0, 0, 1, 0, 0);
}
[data-aos="show"].aos-animate {
    opacity: 1;
    -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        -ms-transform: matrix(1, 0, 0, 1, 0, 0);
            transform: matrix(1, 0, 0, 1, 0, 0);
}

@font-face {
    font-family: 'Mark Pro';
    src: url('../fonts/ffmark/FontFont-Mark-Pro-Medium.eot');
    src: url('../fonts/ffmark/FontFont-Mark-Pro-Medium.woff2'),
    url('../fonts/ffmark/FontFont-Mark-Pro-Medium.woff'),
    url('../fonts/ffmark/FontFont-Mark-Pro-Medium.ttf');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Mark Pro';
    src: url('../fonts/ffmark/FontFont-Mark-Pro.eot');
    src: url('../fonts/ffmark/FontFont-Mark-Pro.woff2'),
    url('../fonts/ffmark/FontFont-Mark-Pro.woff'),
    url('../fonts/ffmark/FontFont-Mark-Pro.ttf');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Futura pt';
    src: url('../fonts/FuturaPT/FuturaPTBook.otf'),
    url('../fonts/FuturaPT/FuturaPTBookOblique.otf');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'SFProText';
    src: url('../fonts/Instagram/SF-Pro.ttf');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'pronovias';
    src: url('../fonts/pronovias/pronovias.eot');
    src: url('../fonts/pronovias/pronovias.woff2'),
    url('../fonts/pronovias/pronovias.woff'),
    url('../fonts/pronovias/pronovias.ttf'),
    url('../fonts/pronovias/pronovias.svg');
    font-weight: 400;
    font-style: normal;
}


/*
// Header
//  --------------------------------------------- */
.sw__header {
    position: absolute;
    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;
    background: #131414;
    text-align: center;
    opacity: 0;
    top: 0;
    height: 0;
    -webkit-transition: .5s opacity ease;
    -o-transition: .5s opacity ease;
    transition: .5s opacity ease;
    z-index: -1;
}
.sw__header img {
    max-width: 100%;
    height: 50px;
}
.sw__header.sw__header--show {
    opacity: 1;
    position: fixed;
    width: 100%;
    z-index: 2;
    height: auto;
    -webkit-transition: .5s opacity ease;
    -o-transition: .5s opacity ease;
    transition: .5s opacity ease;
}


/*
//  Hero
//  --------------------------------------------- */
.video_dark_lay{
    width: 100%;
    height: 100vh;;
    position: absolute;
    background-color: rgba(0,0,0, 0.5);
}


.sw__hero__video_source{
    object-fit: cover;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
}

.sw__hero {
  flex-direction: column;
    position: relative;
    /* top: 35px; */
    bottom: 0;
    right: 0;
    left: 0;
    height: 100vh;
    width: 100%;
    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;
    text-align: center;
    background: #131414;
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
    will-change: transform;
    -webkit-transition: .6s all ease-in-out;
    -o-transition: .6s all ease-in-out;
    transition: .6s all ease-in-out;
 }

.sw__hero__background {
    top: 0px;
    -o-top:35px;
    bottom: 0;
    right: 0;
    left: 0;
    position: absolute;
    display: block;
    overflow: hidden;
    min-height: 100%;
    background-position: center right;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-animation-name: changeHero;
            animation-name: changeHero;
    -webkit-animation-duration: 4s;
            animation-duration: 4s;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    -webkit-animation-timing-function: ease;
            animation-timing-function: ease;
}

.sw__hero__content {
    color: #fff;
    animation-name: showHeroText;
    position: relative;
}
.sw__hero__content img {
    max-width: 100%;
    height: 50px;
    -webkit-animation-name: showHeroText;
            animation-name: showHeroText;
    -webkit-animation-duration: 4s;
            animation-duration: 4s;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
}
.sw__hero__title {
    text-transform: uppercase;
    font-family: 'Futura pt';
}
.sw__hero__title,
.sw__hero__date {
    -webkit-animation-name: showHeroText;
            animation-name: showHeroText;
    -webkit-animation-duration: 4s;
            animation-duration: 4s;
    -webkit-animation-iteration-count: 1;
            animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
}

.wrap {
    text-align: center;
    position: relative;
  }
  .links {
    /* display: flex; */
    /* justify-content: space-between; */
    position: relative;
  }
  .wrap:before {

/* content: ''; */

position: absolute;

top: 50%;

left: 0;

border-top: 1px solid black;

background: black;

width: 100%;

transform: translateY(-50%);

}

.sw__hero__countdown__wrapper{
    /* text-align: center; */
    margin: 0px !important;
    /* position: relative; */
    /* animation: showHeroText 0s 1.2s forwards; */
    /* visibility: hidden; */
}


.sw__hero__arrow_container{
    position: absolute;
    top: 88%;
}
  
.link::before{
    content: '';
    position: relative;
    top: 50%;
    left: 0;
    border-top: 1px solid black;
    background: black;
    width: 100%;
    transform: translateY(-50%);
}


.sw__hero__countdown__date_container{
    /* background-color: rgba(38, 38, 38, 0.7); */
    /* border-radius: 9px; */
    /* height: 87px; */
    /* vertical-align: middle; */
    /* text-align: center; */
    /* display: flex; */
    /* align-items: center; */
    /* position: relative; */
    /* justify-content: space-between; */
} 

.sw__hero__countdown__dates{
    /* margin: 11px 4px 0 15px; */
    /* font-family: 'AppleSymbols'; */
    font-size: 34px;
    /* font-weight: normal; */
    /* font-stretch: normal; */
    /* font-style: normal; */
    /* line-height: normal; */
    /* letter-spacing: 10.06px; */
    /* text-align: center; */
    color: #000;
    /* line-height: normal; */
    /* vertical-align: middle; */
    /* display: inline-block; */
    margin: 0px;
}

.sw__hero__date {
    margin: 30px 0px 0px;
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    color: #d8d8d8;
    letter-spacing: 0.8px;    
    text-align: center;
    line-height: 20px;
    font-family: 'Futura pt';
    vertical-align: middle;
}

.sw__hero__countdown__date_label {
  /* font-family: 'Futura pt'; */
  /* font-size: 14px; */
  /* font-weight: normal; */
  /* font-stretch: normal; */
  /* font-style: normal; */
  /* line-height: 1.43; */
  /* letter-spacing: 2.2px; */
  /* text-align: center; */
  /* color: #fff; */
}



.iframe-responsive {
    border: 0px;
    min-height: 580px;
    margin: 0 auto;
    max-width: 1025px;
}



/*
//  Desktop
//  --------------------------------------------- */
@media screen and (min-width: 1024px) {
    .page-header .header.panel {
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        margin-left: auto;
        margin-right: auto;
        width: auto;
        max-width: 1392px;
        padding: 10px 20px;
        background-color: #101820;
    }
    .sw__header {
        padding: 30px;
    }
    .sw__header img {
        height: 50px;
    }
    .sw__vera {
        padding: 110px;
    }
    .sw__vera-container {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

    .sw__vera-container-2 {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    .sw__vera__video img {
        max-width: 505px;
    }
    .sw__hero__title {
        font-size: 25px;
        letter-spacing: 3.57px;
        text-align: center;
        margin: 60px 0 15px;
    }
    .sw__vera__intro {
        padding-left: 100px;
    }
    .sw__vera__title {
        font-size: 30px;
        letter-spacing: 4.29px;
        line-height: 40px;
        margin-bottom: 20px;
        max-width: 383px;
    }
    .sw__vera__desc {
        max-width: 383px;
    }
    .sw__vera__intro-2 {
        padding-left: 100px;
    }
    .sw__vera__title-2 {
        font-size: 30px;
        letter-spacing: 4.29px;
        line-height: 40px;
        margin-bottom: 20px;
        max-width: 383px;
        min-width: max-content;
    }
    
   
    }

}
  
/*
//  Mobile
//  --------------------------------------------- */
@media screen and (max-width: 1024px) {
    .sw__header {
        padding: 15px 25px;
    }
    .sw__header img {
        height: 36px;
    }
    .sw__hero__background {
        -webkit-animation-name: changeHero-mobile;
                animation-name: changeHero-mobile;
    }
    .sw__hero__content img {
        height: 36px;
    }
    .sw__hero__title {
        font-size: 25px;
        letter-spacing: 3.57px;
        margin: 50px 0 30px;
    }
    .sw__vera__video img {
        max-width: 100%;
    }
    .sw__vera__title {
        font-size: 25px;
        color: #131414;
        letter-spacing: 3.57px;
        margin-bottom: 20px;
    }
    .sw__vera__title-2 {
        font-size: 25px;
        color: #131414;
        letter-spacing: 3.57px;
        margin-bottom: 20px;
    }
    
    .sw__hero__countdown__wrapper{
        margin-right: 0px!important;
    }

    .sw__vera__intro {
        padding: 60px 25px;
    }
    .sw__vera__intro-2 {
        padding: 0 25px 60px ;
    }
    .sw__vera__intro_title-2 {
        padding: 60px 25px 0;
    }

}


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

 .sw__hero__background {
        -webkit-animation-name: changeHero-mobile;
                animation-name: changeHero-mobile;
    }
    .sw__hero__content img {
        height: 36px;
    }
    .sw__hero__title {
        font-size: 20px;
        letter-spacing: 2.86px;
        margin: 50px 0 15px;
    }
}

@-webkit-keyframes showHeroText {
    0%   {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes showHeroText {
    to   { visibility: visible; }
}

.count-floating{}
.count-bg{background: url("../images/countdown/FIFA-countdown1.png") no-repeat center top;height: 256px;width: 256px;}
.count-bg2{background: url("../images/countdown/FIFA-countdown2.png") no-repeat center top;height: 256px;width: 256px;}
.count-bg3{ background: url("../images/countdown/FIFA-countdown3.png") no-repeat center top;height: 256px;width: 256px;}
.count1-bg{background: url("../images/countdown/cd-1a.png") no-repeat center top;height: 100px;width: 400px;zoom: 0.6;}
.count2-bg{background: url("../images/countdown/cd-2a.png") no-repeat center top;height: 100px;width: 400px;zoom: 0.6;}
.count3-bg{background: url("../images/countdown/cd-3a.png") no-repeat center top;height: 100px;width: 400px;zoom: 0.6;/* transform: scale(0.6); */}
.count-bg2 .sw__hero__countdown__dates {
    color: #fff;
    font-size: 27px;
}

.count-bg2 .sw__hero__countdown {
    margin-bottom: 60px;
}

.count-bg3 .sw__hero__countdown__dates {
    color: #fff;
    font-size: 27px;
}

.count-bg3 .sw__hero__countdown {
    margin-bottom: 40px;
    gap: 23px;
}
.count-floating {
    position: fixed;
    bottom: 10%;
    left: 2%;
    display: flex;
    justify-content: center;
    align-items: end;
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    z-index: 10000;
}
.count-top {
    position: absolute;
    top: 200%;
    left: 26%;
    display: flex;
    justify-content: center;
    align-items: end;
    /* animation-name: floating; */
    /* animation-duration: 3s; */
    /* animation-iteration-count: infinite; */
    /* animation-timing-function: ease-in-out; */
    z-index: 10000;
}
.sw__hero__countdown {
    display: flex;
    gap: 22px;
    margin-bottom: 31px;
}

.count-in {
    display: flex;
    gap: 21px;
    justify-content: center;
}
 @keyframes floating {
 from {
transform: translate(0, 0px);
}
 65% {
transform: translate(0, 15px);
}
 to {
transform: translate(0, -0px);
}
}




.count-wrap {
    position: relative;
}
.count-top p {
    color: #fff;
    text-align: center;
    margin: 0px;
    font-size: 33px;
    font-weight: bold;
}

.count-top .sw__hero__countdown {
    margin: 0px;
    position: relative;
    left: 58px;
    top: -16px;
    gap: 47px;
}

.count-top .count-in {
    gap: 0px;
}

p.sw__hero__countdown__date_label {
    font-size: 12px;
}