* {
    box-sizing: border-box;
}
html, body {
    padding: 0;
    margin : 0;
    height : 100dvh;
    overflow:hidden;
}

.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;
    pointer-events: none;
}

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

.hs{
   /*background-color: #ff000090;*/
   pointer-events: all;
   width:100%;
   left:50%;
   transform: translateX(-50%);
}
.hs-bgclick{
   height: 100%;
 }
 .fall{
    /* background-color: #ff000050; */
    aspect-ratio: 342/146;
    width:45%;
    height: auto;
}
 .bg { 
    background: url('images/bg.png') no-repeat center center;
    background-size: contain;
}
.cta { 
    background: url('images/cta.png') no-repeat center center;
    background-size: contain;
}
.dos { 
    background: url('images/dos.png') no-repeat center center;
    background-size: contain;
}
.hand { 
    background: url('images/hand.png') no-repeat center center;
    background-size: contain;
}
.introbg { 
    background: url('images/introbg.png') no-repeat center center;
    background-size: contain;
}
.introcopy1 { 
    background: url('images/introcopy1.png') no-repeat center center;
    background-size: contain;
}
.introcopy2 { 
    background: url('images/introcopy2.png') no-repeat center center;
    background-size: contain;
}
.tres { 
    background: url('images/tres.png') no-repeat center center;
    background-size: contain;
}
.uno { 
    background: url('images/uno.png') no-repeat center center;
    background-size: contain;
}
.bun-bot { 
    background: url('images/bun-bot.png') no-repeat center center;
    background-size: 200%;
    width:50%;
}
/* .dcheese1 { 
    background: url('images/dcheese1.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 1;
}
.dcheese2 { 
    background: url('images/dcheese2.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 3;
}
.dcheese3 { 
    background: url('images/dcheese3.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 6;
}
.dpatty { 
    background: url('images/dpatty.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 2;
}
.dpickle { 
    background: url('images/dpickle.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 5;
}
.dbacon { 
    background: url('images/dbacon.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 4;
}
.dbun { 
    background: url('images/dbun.png') no-repeat center center;
    background-size: 200%;
    width:100%;
    z-index: 7
} */



.cheese { 
    background: url('images/cheese.png') no-repeat center center;
    background-size: contain;
}
.patty { 
    background: url('images/patty.png') no-repeat center center;
    background-size: contain;
}
.bacon { 
    background: url('images/bacon.png') no-repeat center center;
    background-size: contain;
}
.bun { 
    background: url('images/bun.png') no-repeat center center;
    background-size: contain;
}
.pickle { 
    background: url('images/pickle.png') no-repeat center center;
    background-size: contain;
}

/* .bar { 
    background: url('images/barmask.png') no-repeat center center;
    background-size: contain;
}
.barbg { 
    background: url('images/bar.png') no-repeat center center;
    background-size: contain;
} */

.endimg { 
    background: url('images/endimg.png') no-repeat center center;
    background-size: contain;
}
.endcopy3 { 
    background: url('images/endcopy3.png') no-repeat center center;
    background-size: contain;
}
.endcopy2 { 
    background: url('images/endcopy2.png') no-repeat center center;
    background-size: contain;
}
.endcopy1 { 
    background: url('images/endcopy1.png') no-repeat center center;
    background-size: contain;
}

.pickle-c { 
    background: url('images/pickle-c.png') no-repeat center center;
    background-size: contain;
}
.bacon-c { 
    background: url('images/bacon-c.png') no-repeat center center;
    background-size: contain;
}
.cheese-c { 
    background: url('images/cheese-c.png') no-repeat center center;
    background-size: contain;
}
.patty-c { 
    background: url('images/patty-c.png') no-repeat center center;
    background-size: contain;
}
.gamepanel { 
    background: url('images/gamepanel.png') no-repeat center center;
    background-size: contain;
}
.gametxt { 
    background: url('images/gametxt.png') no-repeat center center;
    background-size: contain;
}



/* .barmask{
    -webkit-mask-image: url(images/bar.png);
    mask-image: url(images/bar.png);
    -webkit-mask-size: 100%;
    mask-size: 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat; 
    z-index: 999;   
} */

.txtcount{
    font-family: Arial, Helvetica, sans-serif;
    color: #ffffff;
    font-size: 0.8em;
    top:26.4%;
}
.pattycount{
    left:20%;
 }
.cheesecount{
   left:42%;
}
.baconcount{
    left:61%;
 }
 .picklecount{
    left:80%;
 }