@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&family=Special+Elite&display=swap');
*, ::before, ::after{
    box-sizing: border-box;
}

body{
    margin: 0;
    padding: 0;
   
}
body, html{
    height: 100%;
}
ul {
	margin: 0;
	padding: 0;
}
li {
	list-style-type: none;
}
img{display: block;width: 100%;}
h1, h2{font-family: 'Teko', sans-serif;}
h1,h2,h3{
    margin: 0;
}
.__olympic__wrapper{width: 480px;
    max-width: 480px;
    margin: 0 auto;
    position: relative;
    height: 100%;
}
@keyframes zoom-animation {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

@-webkit-keyframes zoom-animation {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

@keyframes zoom-animation2 {
    from{
        transform: scale(0);
    }
    to{
        transform: scale(1);
    }
}

@-webkit-keyframes zoom-animation2 {
    from{
        -webkit-transform:scale(0) ;
        
    }
    to{
        -webkit-transform:scale(1)
    }
}

@-webkit-keyframes fadeIn {
    from {opacity: 0;} 
    to {opacity: 1;}
  }
  
  @keyframes fadeIn {
    from {opacity: 0;}
    to {opacity:1 ;}
  }
.__mapping_container{height: 100%;
    position: relative;
    background-color: #16122d;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;}
.__mapping_container img{height:auto;}
.__mapping_container h2{color: #fff;
    font-family: 'Noto Sans', sans-serif;
    font-size: 22px;
    text-align: center;
    margin-top: 7vh;
    font-weight: 500;
    animation: zoom-animation 2s;
    -webkit-animation: zoom-animation 2s;
    
}

#data_svg{width: 90px;}




.__overlay__container{
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    right: 0;
    display: none;background-color: rgb(5,5,5,0.8);
    z-index: 9999;
}

.__mapping_container ._headin__winners {
    position: absolute;
    bottom: 14%;
    left: 0;
    right: 0;
    width: 100%;
}

.__mapping_container ._headin__winners h1{color: #312B69;
    text-align: center;
    font-weight: 500;
    line-height: 33px;
    font-size: 26px;
    animation: zoom-animation2 2s;
    -webkit-animation: zoom-animation2 2s;
}
.__mapping_container ._headin__winners h1 span{font-weight: 700;
    font-size: 44px;
    line-height: 48px;}

.__overlay__container.active{display: block;}
.__overlay__container .__model__container{
    margin: 30px 20px;
    background-color: #292929;
    padding: 20px 20px 30px 30px;
    border: 1px solid #000;
    position: relative;
    max-height: calc(100% - 60px);
    display: none;
    height: 100%;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
}
.__overlay__container .__model__container.active{
    display: block;
}
.__overlay__container .__model__content__area li {
    color: #fff;
    font-size: 16px;
    line-height: 28px;
}
.__overlay__container .__close__area{background-color: transparent;
   
    border: 0;
    color: #000;
    position: absolute;
    top: 38px;
    right: 28px;
    font-size: 36px;
    font-weight: 300;
    z-index: 999;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 32px;
    height: 32px;
    max-width: 32px;
    max-height: 32px;
    cursor: pointer;
}
.__overlay__container .__close__area img{
    width: 20px;
    height: 20px;
}
.__overlay__container .model__header__right svg {
    width: 60px;
    transform: rotate(20deg);
}
.__overlay__container .__model__main__area{}
.__overlay__container .__model__header{}
.__overlay__container .__row__model{display: flex;
    justify-content: space-between;}
.__overlay__container .model__header__left{}
.__overlay__container .model__header__right{padding-right: 10%;}
.__overlay__container h1{
    color: #f6ce30;
    font-size: 25px;
    font-weight: 700;
    font-family: 'Lato', sans-serif;
    line-height: 31px;}
.__overlay__container h3{color: #f6ce30;
    font-family: 'Lato', sans-serif;
    font-size: 20px;
    font-weight: 400;}
.__overlay__container p{color: #fff;
    font-size: 16px;
    line-height: 28px;
    font-family: 'Lato', sans-serif;
    font-weight: 300;}
.__overlay__container .__model__content__area{}
.__overlay__container .__image__area{margin: 16px 0px 25px 0px;}
.__overlay__container .__image__area img{width: 90%;}
.__overlay__container .__heading__{color: #fff;
    font-size: 22px;
    margin: 20px 0px 10px 0px;}
    .__overlay__container .__close__area svg{width: 30px;
        height: 30px;
        cursor: pointer;
    }

    area{cursor: pointer;}
    .sharel-lg-panel.ispage {
        position: fixed;
        top: calc(50% - 78px);
    }
    .sharel-lg-panel li:nth-of-type(3) img {
        background-color: #25d366;
        border-radius: 100%;
    }
    .sharel-lg-panel {
        width: 60px;
        height: 190px;
        display: none;
        position: absolute;
        z-index: 999;
        background-color: #fff;
        right: 60px;
        border-radius: 4px;
        top: 20px;
    }
    .sharel-lg-panel.active {
        display: block;
    }
    .sharel-lg-panel::after {
        content: '';
        border-left: 10px solid #fff;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        position: absolute;
        right: -10px;
        top: 20px;
    }
    .copyText{position: absolute;
        z-index: 9999;
        top: 20px;
        right: 58px;
        background-color: #9cf19cfa;
        color: #0e3807;
        padding: 10px;
        font-size: 14px;
        border: 1px solid #7ad35d;
        border-radius: 4px;
        display: none;}
    .sharel-lg-panel img {
        width: 40px;cursor: pointer;
    }
    .sharel-lg-panel ul {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: 100%;
    }
    .home_share ._share{position: relative;}
      .home_share ._share span{
        background-color: #fff;
        color: #000;
        font-size: 12px;
        padding: 5px;
        position: absolute;
        right: 116%;
        width: 100px;
        text-align: center;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        display: none;
      }
      .home_share ._share span::after{
        content: '';
        border-left: 5px solid #fff;
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
        position: absolute;
        right: -5px;
        top: calc(50% - 5px);
    }
    .home_share ._share:hover span{
        display: block;
    }
    .home_share {
        position: absolute;
        z-index: 999;
        right: 0px;
        top: 20px;
    }
   .home_share img {
    width: 35px;
    margin: 0px 0px 10px 0px;
    cursor: pointer;
    }
    .sharel-lg-panel ul li{margin-bottom: 3px;}
    .sharel-lg-panel ul li:last-child{margin-bottom: 0;}
    .rotation-msg{
        display: none;
        background-color: #333399;
        position: fixed;
        z-index: 9999999999;
        width: 100%;
        height: 100%;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
    .rm-center{
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        width: 100%;
        max-width: 470px;
    }
    .rotation-img{
        text-align: center;
        margin-bottom: 10px;
        display: flex;
        justify-content: center;
    }
    .rotation-img img{
        width: 200px;
    }
    .rm-txt{
        text-align: center;
    }
    .rm-txt h5{
        font: bold 36px/28px 'Open Sans', sans-serif;
        color: #fff;
        margin-bottom: 10px;
        width: 100%;
        text-align: center;
        margin-top: 20px;
        font-family: 'Teko', sans-serif;
        font-weight: 400;
    }
    .rm-txt p{
        font:400 16px/22px 'Open Sans', sans-serif; 
        color: #fff;
    }


    .__olp__faces{margin: 20px 30px 0px 50px;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;}
.__olp__row{display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin: 10px 0px;}
    .__olp__row a{height: 100%;}
.__olp__faces .face{margin: 0px 0px 10px 0px;
    display: flex;
    align-items: flex-end;
    height: 100%;
   }
.__olp__faces .face img{width: 110px;}
.__main_heading__mapping h1{color: #fff;
    font-weight: 300;
    font-size: 5.2vh;
    line-height: 7.7vh;}
.__main_heading__mapping h1 span{color: #EDB844;
    font-size: 7.4vh;
    font-weight: 400;}
.__main_heading__mapping {
    text-align: center;
    padding-top: 7.5vh;
}

.__logo{position: absolute;
    z-index: 999;
    top: 20px;
    left: 10px;}
.__logo img{width: 65px;}

.auto_navigation{position: absolute;
    z-index: 9999;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;}
.auto_navigation img{width: 100%;height: 100%;}
.bg_color_fixed{background-color: #111;}
.bg_color_temp{background-color: #000;}
.__video{max-width: 100%;
    height: auto;}
.__video iframe{
    width: 100%;
    height: 250px;
}
.model15 .__sub_heaading{color: #F1CF13;
    font-size: 1.8vw;font-family: 'Teko', sans-serif;}
    .__creadit__wrapper {
        position: absolute;
        width: 100%;
        z-index: 9999;
        bottom: 0;
        background-color: #111;
        display: none;
    }
    .__creadit__container {
        position: relative;    padding: 25px;
    }
    .__close__creadit {
        position: absolute;
        right: 10px;
        top: 10px;
        z-index: 999;
        background-color: #e6c648;
        border-radius: 100%;
        width: 25px;
        height: 25px;
        display: flex;
        justify-content: center;
        align-items: CENTER;
        cursor: pointer;
    }
    .__close__creadit svg {
        width: 20px;
        height: 20px;
       
    }
    .__creadit__container p{color: #fff;
        margin: 0px 0px 10px 0px;font-family: 'Lato', sans-serif;}
        .__creadit__container p a{color: #fff;text-decoration: none}
        .__creadit__container p a:hover{text-decoration: underline;}
    .__creadit__container p span{color: #e6c648;}
    .creadit_button {
        position: absolute;
    bottom: 20px;
    left: 10px;
    color: #6972ba;
    text-decoration: underline;
    text-underline-offset: 3px;
    font-size: 12px;
    cursor: pointer;
    }

    .__creadit__container h4 {
        color: #e6c648;
        font-size: 28px;
        font-weight: 500;
        margin: 0px 0px 16px 0px;
        border-bottom: 1px solid #e6c648;
        padding: 0px 0px 10px 0px;
    }

    .__overlay__container .model15 h2{
        font-size: 3vw;
    line-height: 3.5vw;
    }
    .__row__top{display: flex;
        flex-wrap: wrap;
        padding: 100px 30px 0px 50px}
    .__left__tp_column{width: 220px;}
    .__right__tp_column{width: calc(100% - 220px);}
    .__right__tp_column img{max-width: 390px;width: 100%;}
    .__right__tp_column a{display: flex;
    justify-content: flex-end;
    align-items: center;}
    .__left__tp_column h1 {
        font-family: 'Special Elite', cursive;
        color: #e6c648;
        font-weight: 400;
        text-transform: uppercase;
        font-size: 40.1px;
        line-height: 43.3px;
    }

    h2.__sub__tp__heading {
        color: #e4e0e0;
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        font-size: 16px;
        margin: 5px 0px 0px 0px;
        line-height: 21px;
        text-align: left;
    }




    @media screen and (max-width:1024px) and (orientation:landscape) {
        
        .rotation-msg{
            display: block;
        }
        body, html {
            overflow: hidden;
            background-color: #333399;
        }
        
    }

    @media screen and (min-width:1200px) and (max-width:1400px) {
        .__mapping_container img {
            height: 100%;
        }
        .__mapping_container ._headin__winners h1{line-height: 18px;}
        .__mapping_container ._headin__winners h1 span{line-height: 51px;}
        .__mapping_container ._headin__winners{bottom: 15%;}
    }

    @media screen and (min-height:1025px){
        .__olympic__wrapper{width: 100%;
            max-width: 100%;}
       
        .__olp__faces .face{width: auto;
            margin: 20px 30px;}
        .__olp__faces .face img{width: 140px;}
        .__logo img{width: 120px;}
        .home_share img{width: 80px;}
        .sharel-lg-panel{width: 90px;
            height: auto;
            padding: 10px 0px;
            right: 100px;}
            .sharel-lg-panel img{width: 65px;}
            .__overlay__container h1{font-size: 7vw;}
            .__overlay__container .model__header__right svg{width: 100px;}
            .model15 .__sub_heaading{font-size: 4.7vw;}
            .__video iframe{width: 480px;
                margin: 0 auto;}
                .__video{text-align: center;}
    }

    @media screen and (min-height:800px) and (max-height:900px){
        .__mapping_container ._headin__winners{bottom: 25% !important;}
    }

  

    @media screen and (min-width:768px) and (max-width:1023px){
        .__olympic__wrapper{    width: 100%;
            max-width: 100%;}
           
            .__mapping_container ._headin__winners{bottom: 27%;}
            
            .home_share img {
                width: 65px;
            }
            .home_share {
                top: 10px;
            }
            .sharel-lg-panel {
                right: 80px;
                top: 10px;
            }
            
                .__olp__faces .face img{width: 110px;}
                .__olp__faces .face{width: auto;
                    margin: 13px 16px;}
                    .__olp__faces {
                        margin: 20px auto 0px auto;
                        max-width: 557px;
                        display: block;
                    }
                    .__olp__row{padding: 0px 30px 0px 30px;}
                    .__logo img{width: 85px;}
                    .__overlay__container h1, .__overlay__container .model4 h2{    font-size: 5vw;
                        line-height: 7vw;}
                    .__overlay__container h1{font-size: 6vw;
                        line-height: 6.5vw;}
                   
                    .model15 .__sub_heaading{font-size: 4.7vw;}
                    .__left__tp_column {
                        width: 60%;
                    }
                    .__overlay__container .__image__area {
                        margin: 25px 0px 25px 0px;
                    }
                    .__right__tp_column {
                        width: 40%;
                    }
                    .__row__top{
                        max-width: 557px;
                        margin: 0 auto;
                        padding: 10vh 30px 0px 50px;
                    }
                    .__left__tp_column h1 {
                        font-size: 6vw;
                        line-height: 7vw;
                    }
    }

    

    @media screen and (max-width:767px){
        .__olympic__wrapper{width: 100%;}
        .__mapping_container ._headin__winners h1{font-size: 5.5vw;
            line-height: 5vw;}
        .__mapping_container ._headin__winners h1 span{font-size: 9vw;
            line-height: 10vw;}
        .__mapping_container ._headin__winners{bottom: 19%;}
        .__overlay__container h1{font-size: 4.8vw;
            line-height: 6vw;}
        .__overlay__container .model4 h2{font-size: 4.2vw;
            line-height: 6vw;}
        .__overlay__container .__heading__{font-size: 5.5vw;}
        .__overlay__container h3{font-size: 4.5vw;}
        .__overlay__container .__close__area svg{width: 25px;
            height: 25px;}
        .home_share img {
            width: 30px;
        }
        .home_share {
            top: 16px;
        }
        .sharel-lg-panel img {
            width: 100%;
        }
        .sharel-lg-panel li {width: 28px;} 
        ._mov_icon .mv-panel {
            height: auto;
        }
        .sharel-lg-panel::after {
            content: '';
            border-left: 5px solid #fff;
            border-top: 5px solid transparent;
            border-bottom: 5px solid transparent;
            position: absolute;
            right: -5px;
            top: 10px;
        }
        .sharel-lg-panel {
            width: 40px;
            height: auto;
            right: 38px;
            top: 10px;
            padding: 6px 6px 4px 6px;
        }
        .__overlay__container .model__header__right svg{width: 13vw;
            height: 6vh;}


            .__logo img{width: 55px;}
            .__olp__faces .face{width: auto;margin: 0px;}
            .__olp__faces .face img {
                width: 90px;
            }
            .__main_heading__mapping h1{font-size: 4.5vh;line-height: 6.5vh;}
            .__main_heading__mapping h1 span{font-size: 6.6vh;}
            .__olp__faces {
                margin: 10px 20px 0px 30px;
            }
            .__logo{top: 16px;
                left: 16px;}
            .model15 .__sub_heaading{font-size: 5vw;}
           .__creadit__container h4{font-size: 24px;}
           .__overlay__container .model15 h2{ font-size: 6.5vw;
            line-height: 7.5vw;}
            .__overlay__container .__close__area{font-size: 16px;}
            .__overlay__container .__image__area {
                padding: 5px 0px 0px 0px;
            }
            .__left__tp_column{width: 60%;}
            .__right__tp_column{width: 40%;}
            .__left__tp_column h1{font-size: 9vw;
                line-height: 10vw;}
            .__row__top{    padding: 11vh 20px 0px 30px;}
            h2.__sub__tp__heading{font-size: 3.8vw;
                line-height: 5.7vw;}
    }

    @media screen and (min-width:410px) and (max-width:767px){
        .__olp__faces .face img{width: 95px;}
    }

    @media screen and (max-width:320px){
        .__olp__faces .face img{width: 70px;}
        .__logo img{width: 45px;}
        .home_share img{width: 25px;}
        .__overlay__container h1 {
            font-size: 4.3vw;
            line-height: 4.8vw;
        }
    }