html,body{
    height: 100%;
    position: relative;
   }
   body
   {
    background-image: url(../media/bg.jpeg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
/*        position: fixed !important;*/
   }
    .live-number {
/*        background: black;*/
        text-align: center;
        padding: 20px;
        margin: 5px 0;
        height: 170px;
        border-radius: 16px;
    }
    .live-number h2 {
            color: blue;
    padding-top: 9px;
    font-weight: 700;
    font-size: 33px;
    }
    .live-number p {
        color: white;
    }
    .live-number h1 {
        color: red;
    }
    .number {
    display: contents;
    align-items: center;
    justify-content: center;
    background: #bc1e2d;
    height: 75px;
    width: 75px;
    border-radius: 50%;
}


.number {
    position: relative;
}
img.logo-img {
    height: 75px;
/*    margin-bottom: 14px;*/
}
.time-date {
    background-image: linear-gradient(to bottom,#ab0405 0,#e73b3b 100%);
    padding: 27px 0;
}
.fire {
    color: #f00;
    text-shadow: 0px -2px 4px #fff, 0px -2px 10px #FF3, 0px -10px 20px #F90, 0px -20px 40px #C33;
    font-size: 40px;
    font-weight: bold;
}
.result h2{
    text-align: center;
    padding: 12px 0;
        margin-bottom: 2px;
}
.blink {
/*          animation: blinker 1.5s linear infinite;*/
          color: white;
          font-family: sans-serif;
          background: black;
      }
      @keyframes blinker {
          50% {
              opacity: 0;
          }
      }

.name-acc{
      font-size: 17px;
    font-weight: 900;
}

span.click-btn{
  background: whitesmoke;
    color: black;
    padding: 6px 11px;
    border-radius: 20px;
    position: relative;
    width: 107px;
    left: 47%;
    bottom: 48px;
}




#neonShadow{
  height:50px;
  width:100px;
  border:none;
  border-radius:50px;
  transition:0.3s;
  background-color:red;
  animation: glow 1s infinite ;
  transition:0.5s;
}
span{
    display: block;
    width: 100%;
    height: 100%;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 700;
/*    padding-top: 15%;*/
    padding-right: 2.5%;
    margin-right: 0px;
    font-size: 1.2rem;
    transition: 0.3s;
/*    opacity: 0;*/
    }
span:hover{
    transition: 0.3s;
    opacity: 1;
    font-weight: 700;
    }

#neonShadow:hover{
  transform:translateX(-20px)rotate(30deg);
  border-radius:5px;
  background-color:#c3bacc;
  transition:0.5s;
}


.col-lg-6.bannerimage>img{
    height: 480px;
}

.bannerimage{
    text-align: center;
}
  .ad-banner {
    background: black;
    padding: 19px 5px;
}
.ad-banner>p {
    color: white;
    font-size: 18px;
    font-weight: 600;
} 

@keyframes glow{
  0%{
  box-shadow: 5px 5px 20px rgb(93, 52, 168),-5px -5px 20px rgb(93, 52, 168);}
  
  50%{
  box-shadow: 5px 5px 20px rgb(81, 224, 210),-5px -5px 20px rgb(81, 224, 210)
  }
  100%{
  box-shadow: 5px 5px 20px rgb(93, 52, 168),-5px -5px 20px rgb(93, 52, 168)
  }
}





@media (max-width: 575.98px)
         {
            span.click-btn
               {
                  left: 35%;
               }
         }



.machine_div img {
    width: 100%;
}
.machine_div {
    padding: 0 10% 0 15%;
    margin: 15px 0 10px 0;
}
.logo img {
    width: 100%;
}
.top-bar {
    background: gray;
    padding: 5px 5px !important;
    text-align: center;
    color: white;
    align-items: center;
}

.date-time-bar p {
    display: block;
    width: 100%;
    margin: 0;
    color: white;
    margin-left: 10px;
}
.date-time-bar {
    margin-top: 7px !important;
}
.footer-item {
    background: #196f3e;
    border: 2px solid white;
    border-radius: 5px;
    color: white;
    font-weight: 700;
    text-align: center;
    padding: 5px 0;
}
.footer-item p {
    margin: 0;
}

.result-number, .result-name {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 22px;
    color: white;
    font-weight: 800;
}

.result-number {
    top: 395px;
/*    top: 200px;*/
}
.result-name
{
    top: 294px;
/*    top: 320px;*/
}
.splash {
    position: fixed;
    width: 100%;
    height: 100%;
    background: white;
    z-index: 99999;
    display: grid;
    align-items: center;
    text-align: center;
}
.splash img {
    margin: 0 auto;
    transform: scale(0);
    transition: all 2.5s;
}
.splash img.show {
    transform: scale(1);
}
.footer {
    position: fixed;
    width: 100%;
    bottom: 31px;
/*    bottom: -10px;*/
/*    bottom: -40px;*/
}



a.see-result {
    color: white;
    position: relative;
    bottom: -69px;
/*    bottom: -22px;*/
    padding: 6px;
    background: #196f3e;
    border: 1px solid white;
}


.random-number {
    position: relative;
}

a.random1{
    position: relative;
    top: 124px;
    left: 83px;
    color: white;
    font-weight: 800;
}
a.random2{
    position: relative;
    top: 124px;
    left: 132px;
    font-weight: 800;
    color: white;
}
a.random3{
    position: relative;
    top: 124px;
    left: 180px;
    color: white;
    font-weight: 800;
}


@media(min-width:767px)
{
    .logo img {
        width: 25%;
    }
    .machine_div {
        padding: 0 39.5% 0 40.5%;
        margin: 15px 0 10px 0;
    }
    .reload {
        text-align: right;
    }
    .result-number {
        top: 408px;
/*        top: 190px;*/
        font-size: 35px;
    }
    .result-name {
        font-size: 26px;
        top: 313px;
    }

     .result-name {
            top: 313px;
/*            top: 295px;*/
/*            top: 248px;*/
            /* top: 320px; */
        }
        .result-number {
            top: 410px;
/*            top: 328px;*/
            /* top: 200px; */
        }
        a.random1 {
    position: relative;
    top: 119px;
    left: 86px;
   /* top: 96px;
    left: 66px;*/
    color: white;
    font-weight: 800;
}
a.random2 {
    position: relative;
    top: 118px;
    left: 133px;
    /*top: 96px;
    left: 97px;*/
    font-weight: 800;
    color: white;
}
a.random3 {
    position: relative;
    top: 118px;
    left: 180px;
    /*top: 96px;
    left: 131px;*/
    color: white;
    font-weight: 800;
}
    

}


/* On screens that are 992px wide or less, the background color is blue */
@media screen and (max-width: 320px) {
  a.random1 {
    position: relative;
    top: 93px!important;
    left: 62px!important;}
    a.random2 {
    position: relative;
    top: 94px!important;
    left: 94px!important;}
    a.random3 {
    position: relative;
    top: 94px!important;
    left: 128px!important;}
    .result-name {
    top: 247px;
        }
        .result-number {
    top: 324px!important;}
    a.see-result {
    color: white;
    position: relative;
    bottom: -107px!important;}
}

@media screen and (max-width: 360px) {
  a.random1 {
    position: relative;
    top: 93px;
    left: 62px;}
    a.random2 {
    position: relative;
    top: 94px;
    left: 94px;}
    a.random3 {
    position: relative;
    top: 94px;
    left: 128px;}
    .result-name {
    top: 247px;
        }
        .result-number {
    top: 324px;}
    a.see-result {
    color: white;
    position: relative;
    bottom: -107px;}
}


/* On screens that are 600px wide or less, the background color is olive */
@media screen and (max-width: 600px) {
    a.see-result {
    color: white;
    position: relative;
    bottom: 27px;}
    .result-number {
    top: 353px;
    /* top: 200px; */
}
.result-name {
    top: 266px;
}
a.random1 {
    position: relative;
    top: 104px;
    left: 72px;}
    a.random2 {
    position: relative;
    top: 104px;
    left: 108px;}
    a.random3 {
    position: relative;
    top: 104px;
    left: 147px;}
  
}


@media screen and (max-width: 412px) {
    
  a.random3 {
    position: relative;
    top: 117px;
    left: 174px;
}
a.random2 {
    position: relative;
    top: 117px;
    left: 124px;
}
a.random1 {
    position: relative;
    top: 117px;
    left: 79px;
}
.result-number {
    top: 395px;
}
.result-name {
    top: 293px;
}

a.see-result {
    color: white;
    position: relative;
    bottom: 8px;
}

}

@media screen and (max-width: 414px) {
    a.see-result {
    color: white;
    position: relative;
    bottom: -225px;
}
.result-number {
    top: 395px;
    /* top: 200px; */
}
.result-name {
    top: 295px;
}
a.random1 {
    position: relative;
    top: 117px;
    left: 81px;
}
a.random2 {
    position: relative;
    top: 117px;
    left: 127px;
}
a.random3 {
    position: relative;
    top: 117px;
    left: 177px;
}
  

}

@media screen and (max-width: 390px) {
    a.see-result {
    color: white;
    position: relative;
    bottom: -208px;
}
.result-number {
    top: 378px;
    /* top: 200px; */
}
.result-name {
    top: 283px;
}
a.random1 {
    position: relative;
    top: 114px;
    left: 77px;
}
a.random2 {
    position: relative;
    top: 114px;
    left: 121px;
}
a.random3 {
    position: relative;
    top: 114px;
    left: 165px;
}
  

}


@media screen and (max-width: 360px) {
    .result-number {
    top: 354px;
    /* top: 200px; */
}
.result-name {
    top: 267px;
}
a.random1 {
    position: relative;
    top: 105px;
    left: 70px;
}
a.random2 {
    position: relative;
    top: 105px;
    left: 108px;
}
a.random3 {
    position: relative;
    top: 105px;
    left: 145px;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -141px;
}
  

}


@media screen and (max-width: 414px) {
a.see-result {
    color: white;
    position: relative;
    bottom: -247px;
}
  

}


@media screen and (max-width: 820px) {
.result-number {
    top: 262px;
    font-size: 21px;
}
.result-name {
    top: 212px;
    font-size: 15px;}
    a.random1 {
    position: relative;
    top: 68px;
    left: 42px;}
    a.random2 {
    position: relative;
    top: 68px;
    left: 59px;}
    a.random3 {
    position: relative;
    top: 68px;
    left: 77px;}
    a.see-result {
    color: white;
    position: relative;
    bottom: -751px;} 

}


@media screen and (max-width: 768px) {
a.see-result {
    color: white;
    position: relative;
    bottom: -609px;
}
.result-name {
    top: 209px;
    font-size: 13px;
}
.result-number {
    top: 251px;
    font-size: 21px;
}
a.random1 {
    position: relative;
    top: 65px;
    left: 37px;
}
a.random2 {
    position: relative;
    top: 65px;
    left: 53px;
}
a.random3 {
    position: relative;
    top: 65px;
    left: 72px;
}
  

}



@media screen and (max-width: 912px) {
    a.random3 {
    position: relative;
    top: 72px;
    left: 92px;}    
    a.random2 {
    position: relative;
    top: 72px;
    left: 69px;}
    a.random1 {
    position: relative;
    top: 72px;
    left: 46px;}
    .result-number {
    top: 272px;}
    .result-name {
    top: 225px;
    font-size: 16px;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -906px;}

}

@media screen and (max-width: 540px) {
   .result-name {
    top: 368px;
    font-size: 19px;
}
.result-number {
    top: 501px;
}
a.random1 {
    position: relative;
    top: 150px;
    left: 109px;
}
a.random2 {
    position: relative;
    top: 150px;
    left: 172px;
}
a.random3 {
    position: relative;
    top: 150px;
    left: 240px;
}
a.see-result {
    color: white;
    position: relative;
    bottom: 117px;
}

}



@media screen and (max-width: 280px) {
    .footer {
    position: fixed;
    width: 100%;
    bottom: 34px;}
    a.see-result {
    color: white;
    position: relative;
    bottom: -153px;
}.result-name {
    top: 232px;
    font-size: 19px;
}
.result-number {
    top: 297px;
}
a.random1 {
    position: relative;
    top: 85px;
    left: 54px;
}
a.random2 {
    position: relative;
    top: 85px;
    left: 79px;
}
a.random3 {
    position: relative;
    top: 85px;
    left: 111px;
}  

}



@media screen and (max-width: 412px) {
    .result-name {
    top: 296px;
    font-size: 19px;
}
.result-number {
    top: 393px;
}
a.random1 {
    position: relative;
    top: 118px;
    left: 83px;
}
a.random2 {
    position: relative;
    top: 118px;
    left: 126px;
}
a.random3 {
    position: relative;
    top: 118px;
    left: 177px;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -246px;
}

}


@media screen and (max-width: 1024px) {
 
a.see-result {
    color: white;
    position: relative;
    bottom: -97px;
}
a.random1 {
    position: relative;
    top: 82px;
    left: 50px;}
    a.random2 {
    position: relative;
    top: 82px;
    left: 81px;}
    a.random3 {
    position: relative;
    top: 82px;
    left: 106px;}
    .result-name {
    top: 240px;
    font-size: 17px;
}
.result-number {
    top: 294px;}

}


@media screen and (max-width: 1280px) {
 
a.see-result {
    color: white;
    position: relative;
    bottom: -206px;}
    .result-name {
    top: 280px;
    font-size: 17px;}
    a.random1 {
    position: relative;
    top: 100px;
    left: 66px;}
    a.random2 {
    position: relative;
    top: 100px;
    left: 100px;}
    a.random3 {
    position: relative;
    top: 100px;
    left: 139px;}
    .result-number {
    top: 347px;}

}


@media screen and (max-width: 360px) {
 
.result-name {
    top: 271px;
    font-size: 17px;
}
.result-number {
    top: 353px;
}
a.random2 {
    position: relative;
    top: 104px;
    left: 109px;
}
a.random3 {
    position: relative;
    top: 104px;
    left: 149px;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -42px;
}

}


@media screen and (max-width: 411px) {
 
.result-name {
    top: 299px!important;
    font-size: 17px!important;
}

.result-number {
    top: 394px!important;
}
a.random1 {
    position: relative;
    top: 115px!important;
    left: 80px!important;
}
a.random2 {
    position: relative;
    top: 115px!important;
    left: 126px!important;
}
a.random3 {
    position: relative;
    top: 115px!important;
    left: 174px!important;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -65px!important;
}

}



@media screen and (max-width: 320px) {
 a.see-result {
    color: white;
    position: relative;
    bottom: -19px!important;
}
.result-number {
    top: 322px!important;
}
.result-name {
    top: 251px!important;
    font-size: 17px!important;
}
a.random1 {
    position: relative;
    top: 94px!important;
    left: 63px!important;
}
a.random2 {
    position: relative;
    top: 94px!important;
    left: 95px!important;
}
a.random3 {
    position: relative;
    top: 94px!important;
    left: 127px!important;
}


}


@media screen and (max-width: 375px) {
.result-name {
    top: 279px!important;
    font-size: 17px!important;
}
.result-number {
    top: 364px!important;
}
a.random1 {
    position: relative;
    top: 107px;!important
    left: 73px!important;
}
a.random2 {
    position: relative;
    top: 107px!important;
    left: 115px!important;
}
a.random3 {
    position: relative;
    top: 107px!important;
    left: 156px!important;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -52px!important;
}


}



@media screen and (max-width: 414px) {
a.see-result {
    color: white;
    position: relative;
    bottom: 5px!important;
/*    bottom: -64px!important;*/
}
.result-number {
    top: 398px!important;
}
.result-name {
    top: 299px!important;
    font-size: 17px!important;
}
a.random1 {
    position: relative;
    top: 117px!important;
    left: 81px;!important
}
a.random2 {
    position: relative;
    top: 117px!important;
    left: 128px!important;
}
a.random3 {
    position: relative;
    top: 117px!important;
    left: 175px!important;
}

}

@media screen and (max-width: 375px) {
.result-name {
    top: 278px!important;
    font-size: 17px!important;
}
.result-number {
    top: 363px!important;
}
a.random1 {
    position: relative;
    top: 107px!important;
    left: 73px!important;
}
a.random2 {
    position: relative;
    top: 107px!important;
    left: 114px!important;
}
a.random3 {
    position: relative;
    top: 107px!important;
    left: 156px!important;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -194px!important;
}

}


/*@media screen and (max-width: 768px) {
    .result-number {
    top: 252px;
}
a.random1 {
    position: relative;
    top: 63px;
    left: 38px;
}
a.random2 {
    position: relative;
    top: 63px;
    left: 54px;
}
a.random3 {
    position: relative;
    top: 63px;
    left: 70px;
}
.result-name {
    top: 207px;
    font-size: 13px;
}
a.see-result {
    color: white;
    position: relative;
    bottom: -608px;
}

}*/