
* {
    box-sizing: border-box;
}
html, body {
    padding: 0;
    margin : 0;
    height : 100dvh;
}
.nt-wrapper {

width: 100dvw;
height: 100dvh;
background-color: #000000;

display: flex;
justify-content: center;
align-items: center;
}

.nt-progress-bar-cont {
width: 45%;
max-width: 250px;
height : 7px;
/* border : 1px solid red; */
position: relative;
}

.nt-progress-bar {

width: 100%;
height : 100%;
border : 1px solid #333;
border-radius: 3px;
overflow: hidden;
position: absolute;
}

.nt-progress {
width : 1%;
height : 100%;
background-color: white;
position: absolute;
}

.nt-ad-container {

width: auto;
height : auto;
overflow: hidden;
background-color: #ffffff;
position: absolute;
display: none;
}


.nt-ad-container * {
    width: 100%;
    height : 100%;
    position:absolute !important;
    pointer-events: none;
}

.clickthru {
    pointer-events: auto;
}

.border {
    border : 1px solid #000;
    z-index: 999;
    pointer-events: none;
}

.flex {
    width: auto;
    height : auto;
    left : 50%;
    top : 50%;
    transform: translate(-50%, -50%);
    overflow: hidden;
}
.hs{
   /* background-color: #ff000090; */
   pointer-events: all;
   width:100%;
   left:50%;
   transform: translateX(-50%);
}
.hs-bgclick{
    bottom: 0%;
    height: 13%;
 }
 .hs-try{
    bottom: 14%;
    height: 7%;
 }
 .hs-select{
    bottom: 25%;
    height: 5%;
    width:10%;
    /*background-color: #ff000090;*/
 }
 .hs-select1{
    left: 29%;
 }
 .hs-select2{
    left: 40%;
 }
 .hs-select3{
    left: 50%;
 }
 .hs-select4{
    left: 61%;
 }
.hs-select5{
    left: 71%;
 }

.color1 { 
    background: url('images/color1.png') no-repeat center center;
    background-size: contain;
}
.color2 { 
    background: url('images/color2.png') no-repeat center center;
    background-size: contain;
}
.color3 { 
    background: url('images/color3.png') no-repeat center center;
    background-size: contain;
}
.color4 { 
    background: url('images/color4.png') no-repeat center center;
    background-size: contain;
}
.color5 { 
    background: url('images/color5.png') no-repeat center center;
    background-size: contain;
}
.copy { 
    background: url('images/copy.png') no-repeat center center;
    background-size: contain;
}
.cta { 
    background: url('images/cta.png') no-repeat center center;
    background-size: contain;
}
.desc1 { 
    background: url('images/desc1.png') no-repeat center center;
    background-size: contain;
}
.desc2 { 
    background: url('images/desc2.png') no-repeat center center;
    background-size: contain;
}
.desc3 { 
    background: url('images/desc3.png') no-repeat center center;
    background-size: contain;
}
.desc4 { 
    background: url('images/desc4.png') no-repeat center center;
    background-size: contain;
}
.desc5 { 
    background: url('images/desc5.png') no-repeat center center;
    background-size: contain;
}
.img1 { 
    background: url('images/img1.png') no-repeat center center;
    background-size: contain;
}
.img2 { 
    background: url('images/img2.png') no-repeat center center;
    background-size: contain;
}
.img3 { 
    background: url('images/img3.png') no-repeat center center;
    background-size: contain;
}
.img4 { 
    background: url('images/img4.png') no-repeat center center;
    background-size: contain;
}
.img5 { 
    background: url('images/img5.png') no-repeat center center;
    background-size: contain;
}
.line { 
    background: url('images/line.png') no-repeat center center;
    background-size: contain;
}

.logo { 
    background: url('images/logo.png') no-repeat center center;
    background-size: contain;
}
.select1 { 
    background: url('images/select1.png') no-repeat center center;
    background-size: contain;
}
.select2 { 
    background: url('images/select2.png') no-repeat center center;
    background-size: contain;
}
.select3 { 
    background: url('images/select3.png') no-repeat center center;
    background-size: contain;
}
.select4 { 
    background: url('images/select4.png') no-repeat center center;
    background-size: contain;
}
.select5 { 
    background: url('images/select5.png') no-repeat center center;
    background-size: contain;
}
.try { 
    background: url('images/try.png') no-repeat center center;
    background-size: contain;
}
.loading1 { 
    background: url('images/loading1.png') no-repeat center center;
    background-size: contain;
}
.loading2 { 
    background: url('images/loading2.png') no-repeat center center;
    background-size: contain;
    clip-path: polygon(0 57%, 100% 57%, 100% 100%, 0% 100%);
}

.loading{
    opacity:0;
    z-index: 9999999999;
}
#YMK-module-widget{
    top:0%;
}
 #YMK-video-input{
    opacity:0 !important;
} 
.virtual{
    max-width: 360px !important;
    height: 55% !important;
    overflow: hidden;
    transform: translateX(-50%) scale(0.9);
    left:50%;
    top: 14%;
    pointer-events: all;
}
  #YMK-module-iframe{
    
    pointer-events: all;
 } 

 .img2, .img3, .img4,.img5{
    opacity:0;
 }
.select2, .select3,.select4, .select5{
    opacity:0;
 }
.desc2, .desc3,.desc4, .desc5{
    opacity:0;
 } 
 .blocker { 
    background: url('images/blocker.png') no-repeat center center;
    background-size: contain;
    opacity:0;
}
 .loaderbg{
    background: url('images/blocker.png') no-repeat center center;
    background-size: contain;
    opacity:0;
}
.loader {
    top:40%;
    left:50%;
    color: #000;
    font-size: 10px;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    text-indent: -9999em;
    animation: mulShdSpin 1.3s infinite linear;
    transform: translateZ(0)translateX(-50%) translateY(-50%) ;
    opacity:0;
  }
  
  @keyframes mulShdSpin {
    0%,
    100% {
      box-shadow: 0 -3em 0 0.2em, 
      2em -2em 0 0em, 3em 0 0 -1em, 
      2em 2em 0 -1em, 0 3em 0 -1em, 
      -2em 2em 0 -1em, -3em 0 0 -1em, 
      -2em -2em 0 0;
    }
    12.5% {
      box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 
      3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, 
      -2em 2em 0 -1em, -3em 0 0 -1em, 
      -2em -2em 0 -1em;
    }
    25% {
      box-shadow: 0 -3em 0 -0.5em, 
      2em -2em 0 0, 3em 0 0 0.2em, 
      2em 2em 0 0, 0 3em 0 -1em, 
      -2em 2em 0 -1em, -3em 0 0 -1em, 
      -2em -2em 0 -1em;
    }
    37.5% {
      box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
       3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, 
       -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    50% {
      box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
       3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, 
       -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
    }
    62.5% {
      box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
       3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, 
       -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
    }
    75% {
      box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 
      3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, 
      -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
    }
    87.5% {
      box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 
      3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, 
      -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
    }
  }