html body {max-width:800px; margin:0px auto 0px auto;background-color:#E7E7E7; user-select: none;}

button {outline: none;user-select: none;border:none;padding:none;box-shadow:none;background:none;color:white;font-family:bengali;}

@font-face {font-display: swap;font-family: Mockbix; src:  url(../css/Righteous.woff2) format('woff2');}
@font-face {font-display: block;font-family: Material; src: url(../css/Material.woff2) format('woff2');}
@font-face {font-display: swap;font-family: bengali; src: url(../css/Solaiman.woff2) format('woff2');}
@font-face {font-display: swap;font-family: Roboto; src: url(../css/Roboto.woff2) format('woff2');}
@font-face {font-display: swap;font-family: Ador2;src: url(../css/Ador2.woff2) format('woff2');}

english  {font-style:normal; font-weight:600;font-family:Roboto; }
bengali {font-weight:normal; font-family:bengali;}

.m-i {font-family: 'Material';font-weight: normal;font-style: normal; font-size: 24px; line-height: 1; letter-spacing: normal; text-transform: none;display: inline-block; white-space: nowrap; word-wrap: normal; direction: ltr; font-feature-settings: 'liga'; text-rendering: optimizeLegibility;vertical-align:middle;}


#sticky { position: fixed; margin-bottom:300px; top: 0px; left: 0px; z-index: 10; width:100%;color:black}

.menubar {background-color:white; color: black; text-align:left; width:100%;height:54px;box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);padding-top:2px;}
.menubar img {float:left;margin:6px 0px 0px 6px;}

.menubar abc {background-color:transparent; font-size:17px; color:white; border:0px solid #C8C8C8; margin-top:10px; font-weight: normal;display:inline-block;padding:3px 7px 1px 7px;border-top-left-radius:20px;border-bottom-right-radius:20px;}


.closebtn {background-color:transparent;border:none; border-radius:500px; width:40px;height:45px; float:left; margin:3px 0px 0px 8px;text-align:center;color:#000;transition-duration: 0.2s;}
.closebtn:active {color:grey;}


   .close {background-color:#423a78;height:50px; border:none;position:fixed;z-index:5;bottom:120px;width:150px; right:5%; border-radius:5px}
  .close .m-i {font-size:25px;margin:-2px 2px 0px 0px;}
 



.lockb {pointer-events:none}

.swiper-wrapper {margin-bottom:5px;}

ben {font-family:bengali;line-height:1.1;font-weight:500;}

.popup2 {
background-color: #ffffff;
width:100%;height:100vh;top:0;left:0;position:fixed; z-index:5;text-align:center;color:black;font-size:15px;font-family:roboto; }

.loadshadow {box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.50);padding-top:25px;width:120px;height:95px;margin: 0px auto 0px auto;border-radius:10px;margin-top:40vh;}

.loader {margin-left:auto;margin-right:auto; border: 2px solid transparent;border-radius: 100%;border-left: 2px solid #3498db;border-right: 2px solid #a8044b;width: 30px;height: 30px; animation: spin 0.8s linear infinite;z-index:4;}
  @keyframes spin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}

brtag {margin-top:15px; display:inline-block;width:100%;}

.resetb {font-family: Mockbix; background-color:#bd3066;border-width:0px; font-size: 15px; width:calc(50% - 7.5px);border-radius:5px;border-top-right-radius:5px;float:right;height:45px;margin:5px 5px 5px 0px;transition-duration: 0.2s;}
.resetb:active {background-color:black;}
.resetb .m-i {font-size:25px;margin-top:-3px; color:#eb6397;}

.dashboard {font-family: Mockbix; background-color:#08a173;border-radius: 5px;border-top-left-radius: 5px;  width:calc(50% - 10px);float:left;height:45px;margin: 5px 0px 5px 5px; font-size: 15px;transition-duration: 0.2s;}

.dashboard:active {background-color:black;}
.dashboard .m-i {font-size:25px;margin-top:-2.5px; color:#0bd397}

.timing {font-family: Mockbix; background-color:#ea4c89;text-align:center; border: 0px solid #7A1313;border-radius:5px; color: white; font-weight: normal; font-size: 15px; width: calc(50% - 7.5px);z-index: 1000;float:left;height:45px;margin:5px 0px 5px 5px;transition-duration: 0.2s;}
  .timing .m-i {margin-top:-8px; color:#e49b9b; }
  
next-previous {background-color:#ffffff;width:calc(100% - 10px);display:block;height:55px;margin:5px 0 0 5px; border-radius: 7px;
  font-size:10px;
  }
 
.n-p {background-color:#09b481;width:calc(25% - 5px); border: 0px solid #7A1313;color: white;font-weight: 300; font-size: 12px;max-height:45px;height:45px; text-align: center; border-radius:5px;font-family:roboto; font-weight:bold;transition-duration: 0.2s;}

.n-p .m-i {color:#11db9f; font-size:60px; margin-top:-9px;}

.n-p:active{background-color:#000000;}
.n-l {margin: 5px 0px 5px 5px;float:left;}
.n-r {margin: 5px 5px 5px 0px;float:right;}
  
.mnext {animation-name: mym;animation-duration: 1.5s;animation-iteration-count: infinite;}
@keyframes mymove {0%   {background-color:#2f2956;} 50%  {background-color:#C0392B;} 100% {background-color:#2f2956;}}
@keyframes mym {0%   {padding-right: 25px;background-color:#11db9f} 50%  {padding-right: 0px;background-color:#000000}  100% {padding-left: 25px; background-color:#11db9f} }


  
.choice {background-color:#000;text-align:center; border: 0px solid #f54242; border-radius:5px; color: white; font-weight: normal; font-size: 15px;  width: calc(50% - 10px);font-family:bengali;z-index: 1000;height:50px;margin:0px 0px 5px 0px;box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5); }
.last {background-color:#423a78;}
  
 
.optn {font-family:Ador2; font-weight: normal; background-color:white;color:#5a5a5a; font-size: 15px;  margin-bottom: 7px; width:calc(100% - 40px);text-align: left; border:2px solid #dbdbdb; border-left-width: 0px; border-radius: 0px; border-top-right-radius: 10px;border-bottom-right-radius: 10px; outline : none; height:60px;padding:0 0 0 3px;float:left;}
  
  .half{width:calc(50% - 36px); font-family: Mockbix; font-weight: normal; color: #666666;}
  .full{width:calc(100% - 40px);pointer-events:none;color: #afafaf; font-weight: normal;}
.pen {pointer-events:none;}
.optn hr {border-color:#595E99;}

.optn img {display: inline-block; vertical-align:middle;}

.optn .material-icons {font-size:26px; color:#ff9e00; vertical-align: -7px; margin-top:-3px;margin-left:3px;}
  
  .ca{color:white; background-color:#1CA758;display:block;border-top-left-radius: 10px;border-top-right-radius: 10px;margin-left:32px; }
  .y{background-color:#008BC8;}


.o {font-family: Mockbix; width: 25px;margin-bottom: 7px;background-color:#e6e6e6; color:#666666; border-radius:0px; border:2px solid #dbdbdb; border-right-width: 0px; margin-left:7px; font-size:17px; border-top-left-radius: 10px;border-bottom-left-radius: 10px; height:60px;float:left;padding:0;text-align:center;}

  
.visit {background-color:#d9d9d9;}
.r {background-color:#423a78;color:white;}
.ro {background-color:#F39C12;color:white;}

.red {background-color:#C0392B;color:white;}
  .grn {background-color:#1CA758;color:white;}
.wr{background-color:#C0392B;color:white;border-color:#C0392B}
  .co{background-color:#1CA758;color:white;border-color:#1CA758}
  
.o2 {width:50%;float:left;margin-left:30px;background-color:red;}
ben {font-family:Solaimanlipi;}

.mqbox {background-color:white; margin: 10px 0px 0px 6px; padding-top:0px; padding-bottom: 0px;width:calc(100% - 12px);float:left; border-radius: 15px; border-top-left-radius: 10px;border-top-right-radius: 10px;border-width:0px; border-bottom-width: 0px; border-color:#595E99; border-style: solid; font-family:quicksand;}

.mquestion {font-family:Ador2; font-weight: normal; background-color:white;font-size: 15px; color: #5a5a5a; font-style: normal; text-align:left;  padding-left: 8px; 
padding-right: 2px;   width:calc(100% - 0px); min-height:70px;border-width:0px; border-radius: 0px; border-top-left-radius: 10px;border-top-right-radius: 10px; border-bottom-width: 2px;
border-top-width: 0px; border-color:#595E99; border-style: solid; line-height:23px; margin: 0px 0px 7px 0px;}
.mquestion srl {font-weight: bold; font-family: Roboto; color:white;background-color:#008BC8;border-radius: 4px; padding:0px 2px 0px 2px;}



dbox {position:fixed;bottom:60px;left:3%;z-index:4;width:100%; margin: 0px auto 0px auto;}

submitbox {position:fixed;bottom:60px;left:3%;z-index:5;width:100%}
  

go {background: linear-gradient(to right, #37344d 0%, #2A2B40 100%); max-width:25%;width:25%;height:35px;line-height:35px; border-radius:0px; border-width:0px; color:#ADCDE1; font-weight:normal; font-size: 12px; margin:0 0 1px 0; text-align: center; font-family:oswald;display:block;float:left; }

.act{text-decoration: overline;color:#E07707;}


.qbb {height:10px; background-color:red}

.rchoice {background-color:#2f2956;text-align:center; border: 0px solid #f54242; border-radius:25px; color: white; font-weight: normal; font-size: 15px;  width: calc(50% - 10px);font-family:bengali;z-index: 1000;height:50px;margin:3px 0px 5px 0px;box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5); }
.rchoice .m-i {font-size:25px;margin:-2px 2px 0px 0px;}


  .rdbox {background-color:white;width:90%;height:180px;position:fixed;bottom:120px;left:5%;z-index:2;border-radius:5px;color:black;text-align:center;padding:20px 0px 0px 0px;font-family:roboto;}
.rdbox hr { border:0;border-top: 2px solid #595E99;}
  
  .noti{font-size:16px;display:none;position:fixed;float:left;top:60px;left:0;margin-left:10px;width:150px;text-align:center;background-color:#2E86C1;color:white; height:20px;line-height:20px; border-radius:5px;z-index:2; padding:5px 7px 5px 7px;}
  
  
  
  .sugg {padding:10px;font-family:bengali;background-color:#16A085;font-size:14px; width:calc(100% - 30px);margin:0 0 0 5px;border-radius:5px;}
  .sugg .m-i {color:#73C6B6;font-size:22px}
  

 

.scrloadshadow {box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.50);padding-top:7px;width:200px;height:117px;margin: 50px auto 0px auto;border-radius:10px;text-align:center;  color:#797979 }

.scrloader {margin:11px auto 17px auto; font-family: Mockbix; font-size:40px; background-color: black; color: white; border: 2px solid transparent;border-radius: 5px;border-width: 0px;width: 50px;height: 50px; line-height: 50px; animation: spin 1s linear infinite;z-index:4;}
  @keyframes spin {0% { transform: rotate(0deg); }100% { transform: rotate(360deg); }}
  
  .wll {width:calc(100% - 14px); margin-top:0px; float:left;margin-left:7px; padding-top:10px; height:305px;background-color:white;color:black; display:none; }
  
  .wl {background-color:green; height:30px; padding:0px 2px 0px 2px;border-radius:5px; line-height:30px;margin-bottom:4px;}
    .scrwl {height:340px;overflow:scroll; }

underhead {display:block; padding-bottom:2px;border: 0px solid #BB9B81;border-bottom-width:2px;color: #646464;}
.highpopup {display:none;height:420px;}

.minfo {background-color: #5c66a7;font-family:Ador2;font-size: 15px; text-align: justify; padding: 5px 10px 5px 10px;  width:calc(100% - 10px); min-height:70px;border-width:0px; line-height:20px; margin: -0px 0px 5px 5px; border:0px solid #535353; border-radius: 10px;border-top-left-radius: 0px;color: #dddddd;
}

infoh {font-family: Mockbix; font-size: 15px; height: 22px; line-height:22px; margin: 0 0 0 5px; background-color: #3b447a; padding: 0px 4px 0px 2px; border-top-right-radius: 10px;border-top-left-radius: 10px; color:#cecece; float:left
}
infoh .m-i {color:#5c66a7;margin-top: -1.5px;}

:root {color-scheme: only light;}

infoh {font-size: 13px;}

#sticky { position: fixed; margin-bottom:300px; top: 0px; left: 0px; z-index: 10; width:100%;color:black}

.closebtnr {width:40px;height:45px;float:right; margin:3px 0px 0px 0px; color:#000;transition-duration: 0.2s;}
.mbar {margin-right:8px}

.closebtnr:active {color:black;}

timebar {float:right;min-width:120px;}
.timebar {background-color: #000000; color: #ffffff; font-family: Mockbix; font-size: 16px; min-width:120px;height:30px;float:right; margin:9px 4px 0px 0px;border-radius: 5px;}

.menubar {background-color:white; color: black; text-align:left; width:100%;height:48px;box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);padding-top:0px; }

.tooltitle {height:51.5px;line-height:1.1; font-family: MockBix; margin-top: -2px;}

tool1{font-size:19px; color:#000000; border-radius:5px;padding: 0 0 0 0; float:left;}

tool2 {font-size:13px;background-color:#000000;border-radius:4px;padding: 2px 6px 1px 5px; float:left; }
hlogo { font-family: Mockbix; font-size: 15px}

.popup2 {z-index:6}




dhead{display:block;color:white;background-color:#34495E;border:none; padding:6px 0 6px 0; font-size: 14px; text-align: center;}

.noti{font-family: Mockbix; font-size:18px;position:fixed;float:left;top:48px;left:0;width:100%; margin-left:0px;text-align:center;background-color:#2E86C1;color:white; height:27px;line-height:27px; border-radius:0px;border-bottom-left-radius:0px;border-bottom-right-radius:0px; z-index:5; padding:5px 0 5px 0;}

noti { background-color: #115481; padding:0 5px 0 5px; border-radius: 4px; }

title-back {position:fixed; top:48px; left:0; z-index:5;width: 100%;}

  .timing2 { font-family: Mockbix; background-color:#2E86C1;text-align:center; color: white; font-weight: normal; font-size: 15px; width: 100%;float:left;height:30px;transition-duration: 0.2s; }


  .resumepopup {display:none; height:233px; width:100%; margin-top:15px; margin-left:3%}
  .startpopup {display:none; height:233px;width:100%; margin-top:15px; margin-left:3%}
  

  .dbox {background-color:white;width:94%;border-radius:10px;color:#797979;text-align:center;padding:0; padding-top: 8px;font-family:Mockbix; }

  .dbox hr { border:0;border-top: 2px solid #d3d3d3;}


  .endpopup {display:none; height:233px;}

.dashboardpop {display:none; height:300px;}
.submitpopup{display:none; height:233px;}
.resetpopup {display:none;height:197px;}
.autopopup {display:none;height:173px;box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5); font-family:bengali;}
.scorepopup {display:none;height:395px;}


 
.correct,.wrong {font-family: Mockbix;height: 60px; line-height:20px; font-size:22px;}



.details {font-family: MockBix; color:#696969; font-size:18px; height: 60px; line-height:5px; text-align:center; border-radius:5px; font-weight: normal;width: calc(50% - 10px);z-index: 1000;margin:0px 0px 0px 0px; }

.details2 {text-align:center; color: black; font-weight: normal;  width: calc(50% - 10px);font-family:Mockbix;z-index: 1000;margin:0px 0px 0px 0px;line-height:5px;}

.details hr, .details2 hr {border: 2px solid #d1d1d1; border-radius: 50px; margin-bottom: 4px;}
htxt {font-size: 12px;color:#969696;}
.confirm {background-color:#423a78;color:white;height:50px;margin-top:3px;border:none; border-radius:5px; width: calc(50% - 10px);margin:0px 0px 5px 0px; font-family: MockBix;}


.confirm .m-i {font-size:25px;margin:-2.6px 2px 0px 0px;color:#8179ba}
.mclose {background-color:#423a78;color:white;height:50px; border:none;}
.mclose .m-i {font-size:25px;margin:-2px 2px 0px 0px;}

.scoreboard {background-color:#4e4e4e;color:#dadada;width:calc(100% - 14.33px);line-height:5px; font-size: 16px;padding-left:35px;text-align: left; margin: 5px 0 6px 0;}
.scoreboard hr {border-width: 1px;margin-bottom: 5px;}



 .loader {margin-left:auto;margin-right:auto; font-family: Mockbix; font-size:25px; background-color: black; color: white; border: 2px solid transparent;border-radius: 5px;border-width: 0px;width: 30px;height: 30px; line-height: 30px; animation: spin 1s linear infinite;z-index:4;}
 @keyframes spin {0% { transform: rotateY(0deg); }100% { transform: rotateY(360deg); }}

 loading, scrload, dhead{font-family: Mockbix;}

 



 .cle-wrp {width: 120px;height: 120px;margin:0px auto 0 auto; background: #23cfb8;border-radius: 50%;}

.cle-wrp .cle .mask,.cle-wrp .cle .fill {width: 120px;height: 120px;position: absolute;border-radius: 50%;}

.cle-wrp .cle .mask {clip: rect(0px, 120px, 120px, 60px);}

.cle-wrp .cle .mask .fill {clip: rect(0px, 60px, 120px, 0px);background-color: #188f7f;}

.per {animation: fill ease-in-out 2s;transform: var(--percentage);}
 
@keyframes fill {0% {transform: rotate(0deg);}100% {transform: var(--percentage);}}

.cle-wrp .in-cle {height: 100px;width: 100px;border-radius: 50%;background: #fff;text-align: center;margin-top: 10px;
margin-left: 10px;position: absolute;z-index: 100;}
in-cle-html {margin:30px 0 0 3px; padding:8px 0 0 0; float:left; height:40px; background-color: rgba(0, 128, 0, 0); width: calc(100% - 6px);font-family: Mockbix;font-size: 17px;line-height: 4px;}
in-cle-time {margin:30px 0 0 3px; padding:8px 0 0 0; float:left; height:40px; background-color: rgba(0, 128, 0, 0); width: calc(100% - 6px);font-family: Mockbix;font-size: 17px;line-height: 4px;}
mmss {font-size:13px; color: #777777;}
.scoreboard mmss{color: #9c9c9c;}

#belowpopup {display:none; position:fixed; width:100%;top:0;left:0; height:100vh; background-color:rgba(0, 0, 0, 0.5);z-index:5;}
#whitepopup {display:none; position:fixed; width:100%;top:0;left:0; height:100vh; background-color:rgba(255, 255, 255, 1);z-index:5;}
#belowend {display:none; position:fixed; width:100%;top:0;left:0; height:100vh; background-color:#E7E7E7;z-index:4;}
#below {display:none; position:fixed; width:100%;top:0;left:0; height:100vh; background-color:#E7E7E7;z-index:4;}


