/*POPUP TNC PP*/
.modal-shadow           {width:0;height:0;position:fixed;top:0;left:0;z-index:90;background-color:#000;opacity:0;cursor:pointer;display:none;}
.modal-box              {background-color:transparent;width:0vw;height:0vh;position:fixed;left:0%; top:0%; 
                         transform:translate(-50%, -50%);z-index:100;padding:30px 30px; display:none;}  
    #modal-box-content  {background-color:white;padding:20px 20%;}
    .popup-header { position:absolute; margin: 0px auto;height: 25px;left:50%; transform:translateX(-50%);text-align:center}

    .switch         {position:relative;display:flex;flex-direction:row;gap:10px;font-size:20px;width:60%;left:50%; transform:translateX(-50%);padding:0px 0px 15px 0px;}
    .on             {position:relative;width:50%;color:white;background-color:#E3091D;text-align:center;padding:5px 0px 5px;cursor:pointer;}
    .off            {position:relative;width:50%;color:black;background-color:white;text-align:center;padding:5px 0px 5px;cursor:pointer;}

    .tnc-scroll           { width:100%;margin:50px auto 0px; font-size:12px; height:45vh; overflow-y:scroll; }
    .tnc-scroll::-webkit-scrollbar {width: 3px;height:3px;}
    .tnc-scroll::-webkit-scrollbar-track {background: var(--gold);}
    .tnc-scroll::-webkit-scrollbar-thumb {background: var(--brown);}
    .tnc-scroll::-webkit-scrollbar-thumb:hover {background: #555;}
    .tnc-content          { font-size:12px; }

.modal-shadow-show      {width:100vw;height:100vh;position:fixed;left:0;z-index:90;background-color:#000;opacity:0.6;cursor:pointer;display:initial;top:0;}
.modal-box-show         {background-color:transparent;width:100vw;height:100vh;position:fixed;left:50%; top:50%; 
                         transform:translate(-50%, -50%);z-index:100;padding:30px 30px; display:initial;}
  .modal-box-show > .header {width:100%;height:20%;overflow:hidden}
    .modal-box-show > .header > .logo {width:160px;margin:0px auto;}
    .modal-box-show > .header > .close {height: 40px; width:40px; overflow:hidden;cursor:pointer;top:25%;right:22%;position:absolute;opacity:1!important}

     
@media print, screen and (max-width:40em) {
    
.modal-shadow-show      {width:100vw;height:100vh;position:fixed;left:0;z-index:90;background-color:#000;opacity:0.6;cursor:pointer;display:initial;top:0;}
.modal-box-show         {background-color:transparent;width:92vw;height:60vh;position:fixed;left:50%; top:50%; 
                         transform:translate(-50%, -55%);z-index:100;padding:10px 10px; display:initial;}
.popup-header { position:absolute; margin: 0px auto;height: unset; width:60%; left:50%; transform:translateX(-50%);}
      .switch         {position:relative;display:flex;flex-direction:row;gap:10px;font-size:20px;width:90%;left:50%; transform:translateX(-50%);padding:0px 0px 15px 0px;}
    .on             {position:relative;width:50%;color:white;background-color:#E3091D;text-align:center;padding:5px 0px 7px;cursor:pointer;}
    .off            {position:relative;width:50%;color:black;background-color:white;text-align:center;padding:5px 0px 7px;cursor:pointer;}

.modal-box-show > .header {width:100%;height:0px;overflow:hidden}
    .modal-box-show > .header > .logo {width:160px;margin:0px auto;}
    .modal-box-show > .header > .close {height: 50px; width:50px; overflow:hidden;cursor:pointer;top:0px;right:0px;position:absolute;opacity:1!important}
    
    .tnc-scroll           { width:100%;margin:50px auto 20px; font-size:12px; height:60vh; overflow-y:scroll; } 

}