:root {
  --header-bg: #1A269F;
  /* --header-bg: #0a4dc2; */
  --white-c: #ffffff;
  /* --btn-color:#417cfa; */
  --btn-color:#4757ED;
  --border-color:#e9e9e9;
  --black-color:#000000;
  --q:#4a4b50;
  --a:#767676;
}
/* fallback */
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/s/materialicons/v77/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons {
font-family: 'Material Icons';
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;
-webkit-font-feature-settings: 'liga';
-webkit-font-smoothing: antialiased;
}
body{color: var(--black-color);font-family: "Helvetica",sans-serif;}

.p-0{padding:0px}
.mr-ml{margin: 0 6px;}
.mr-10{margin-right: 10px  !important;}
.mt-10{margin-top: 10px;}
.mb-10{margin-bottom: 20px;}
.text-center{text-align: center;}
.float-right{float: right;}

header{background: var(--header-bg);padding: 0 10px;}
.mdl-layout-title {color: var(--white-c);align-items: center;display: flex;font-size: 16px;font-weight: 600;}
.time{font-weight: 600;font-size: 16px;}
.mdl-layout-title.jump .material-icons{color: var(--header-bg);font-size: 16px;background: var(--white-c);border-radius: 20px;padding: 4px !important;cursor: pointer;}
.mdl-navigation span{color: var(--white-c);}
.mdl-button{
height: 30px;line-height: 12px !important;background: var(--btn-color) !important;font-size: 12px !important;text-transform: capitalize;
padding: 0 12px !important;border-radius: 16px;font-family: "Helvetica",sans-serif !important;box-shadow: none;
}
.mdl-button--raised.mdl-button--colored.submit-b {background: var(--white-c) !important;color: var(--btn-color);border: 1px solid #c9ddfe;}

.chip-block{border: 1px solid var(--border-color);border-radius: 10px;margin-bottom: 10px;}
.mdl-chip{background: transparent;height:auto;margin: 10px 20px;}
.mdl-color--teal {background-color: transparent !important;border: 1px solid var(--border-color)}
.mdl-color-text--white{color:var(--a) !important;}
.chip-block.option-textbox .mdl-chip {margin: 6px 20px;}
.option-textbox .mdl-textfield{padding: 10px 0 20px;}
.chip-block.option-textbox .mdl-textfield__label{top: 8px;}
.subject-name{font-size: 16px;font-weight: 600;margin-bottom: 0px;margin-left: 10px;}

.mdl-radio.is-checked .mdl-radio__outer-circle,.mdl-radio.is-checked .mdl-radio__inner-circle,.mdl-radio__outer-circle{opacity: 0;display: none;}
.mdl-chip:focus,.mdl-chip:active{background-color: transparent;}
.mdl-radio{display: inline;}
.mdl-radio.is-upgraded,#show-dialog{padding: 0;cursor: pointer;}
/* .is-checked .chip-block {background: #E6EFFF} */
.is-checked .chip-block {background: rgba(148, 164, 255,30%)}
.is-checked .mdl-color--teal{background: var(--btn-color) !important;color: var(--white-c) !important;border: 1px solid var(--btn-color) !important}

.mdl-cell {margin: 17px 8px;overflow: auto;white-space: nowrap;}
.subject .mdl-chip.active{background: var(--btn-color);color: var(--white-c);font-family: "Helvetica",sans-serif !important;}
.main-body p,.main-body span{font-weight: 600;font-size: 16px;color: var(--q);}
.float-right span{font-size: 20px;}
.subject .mdl-chip {background: transparent;height: auto;margin: 0px;border: 1px solid var(--border-color);border-radius: 10px;color:var(--a);}
.mdl-radio .mdl-chip__text{white-space: normal;margin-right: 24px;}

#loader-dialog{
  position: absolute;
  top: 0;
  right: 0;
  background-color: black;
  z-index: 10000000;
  opacity: 0.5;
  filter: alpha(opacity=40);
  height: 100%;
  width: 100%;
}
#loader-dialog > div{
  top: 50%;
  right: 50%;
  position: absolute;
  color: white;
}
#loader-dialog > p{
  position: absolute;
  width: 100px;
  height: 50px;
  top: 55%;
  left: 49%;
  margin-top: -25px;
  margin-left: -50px;
  color:white;
}
  
.mdl-dialog.submit-popup {border: none;box-shadow: 0 9px 46px 8px rgb(0 0 0 / 14%), 0 11px 15px -7px rgb(0 0 0 / 12%), 0 24px 38px 3px rgb(0 0 0 / 20%);width: 280px;margin: auto;}
.mdl-dialog.submit-popup .mdl-button{color: #ffffff;}
.mdl-dialog{width: auto;border-color: var(--white-c) !important;margin: 0 auto;max-width: calc((100% - 0px) - 2em);max-height: calc((100% - 0px) - 2em);top:0 !important;
/* margin-bottom: 0 !important */
}
dialog:-internal-modal {height: auto !important;}
.close{text-align: right;display: inline-block;width: 100%;margin: 0;cursor: pointer;background: transparent;border: 0;outline: 0;}
.mdl-grid .chip-block{border: 0;margin: 0;}
.mdl-grid .chip-block .mdl-chip{margin: 0;}
.mdl-dialog .justify-center{justify-content: center;}
.mdl-chip__contact{margin-right:8px !important}
.mdl-grid .correct .mdl-color-text--white,.all-qty .correct{
clip-path: polygon(49% 2%, 100% 38%, 100% 100%, 0 100%, 0% 38%);background-color: #29B89A !important;;line-height: 47px;
height: 36px;width: 36px;border-radius: 6px;text-align: center;color: #fff;font-weight: 600;
}
.mdl-grid .in-correct .mdl-color-text--white,.all-qty .in-correct{
clip-path: polygon(0 0, 100% 0, 100% 68%, 52% 96%, 52% 96%, 0 67%);background-color: #EC6061 !important;line-height: 38px;height: 36px;width: 36px;border-radius: 6px;text-align: center;color: #fff;font-weight: 600;
}
.mdl-grid .skipped .mdl-color-text--white,.all-qty .skipped{background-color: #585FB9!important;height: 40px;width: 40px;border-radius: 21px;line-height: 40px;text-align: center;color: #fff;font-weight: 600;}
.mdl-grid .not-answered .mdl-color-text--white,.all-qty .not-answered{background-color: #D2D2D2 !important;height: 40px;width: 40px;border-radius: 21px;line-height: 40px;text-align: center;color: #fff;font-weight: 600;}
.all-qty span{margin-right: 7px;margin-bottom: 14px;margin-left: 6px;}
.position-relative{position: relative;overflow: unset;}
.mdl-grid.all-qty span{width: 40px;height: 40px;}
/* .cricle-right{background-color: #8ECF7C!important;height: 14px;width: 14px;border-radius: 20px;position: absolute;right: -4px;bottom: 0;border: 1px solid #ffffff;} 
.cricle-right .material-icons{font-size: 10px;color: #ffffff;line-height: 14px;font-weight: 600;}*/
.position-relative i{background-color: #8ECF7C!important;height: 14px;width: 14px;border-radius: 20px;position: absolute;right: -4px;bottom: -2px;border: 1px solid #ffffff;margin: 0;font-size: 12px;color: #fff;font-weight: 600;line-height: 14px;}
.re-time{float: right;margin: 0 !important;}
.text-center b{font-size: 14px;margin: 10px 0;display: inline-block;}
.small-text{display: block;}
#dialog-submit .all-qty .correct {height: 10px;width: 10px;border-radius: 21px;clip-path: none;margin: 0;}
#dialog-submit .all-qty .in-correct {height: 10px;width: 10px;border-radius: 21px;clip-path: none;margin: 0;}
#dialog-submit .all-qty .skipped {height: 10px;width: 10px;border-radius: 21px;clip-path: none;margin: 0;}
#dialog-submit .all-qty .in-correct {height: 10px;width: 10px;border-radius: 21px;clip-path: none;margin: 0;}
#dialog-submit .all-qty .not-answered {height: 10px;width: 10px;border-radius: 21px;clip-path: none;margin: 0;}
#dialog-submit .mdl-button {height: 37px;border-radius: 8px;font-size: 14px !important;font-weight: 600;}
#dialog-submit .mdl-button:first-child{margin-right: 10px;}
#dialog-submit table .text-left{font-size: 12px;}
#dialog-submit table .text-right{font-size: 14px;}

.mdl-layout__content{margin: 0 10px !important;}
.mdl-mini-footer{padding: 10px 16px;background: transparent;}
.mdl-mini-footer span{color: var(--white-c)  !important;}
.button-center{-webkit-box-pack: center!important;-ms-flex-pack: center!important;justify-content: center!important;display: -webkit-box!important;display: -ms-flexbox!important;display: flex!important;}
footer .material-icons{background: var(--btn-color);color: var(--white-c);border-radius: 20px;}

.submit-title{background: var(--header-bg);margin: 0px 0 16px;padding: 10px;font-weight: 600;color: #ffffff;}
#submit-exam-no, #submit-exam-yes{background: var(--header-bg) !important;}
h4{font-weight: 600;}
table{border-collapse: collapse;min-width: 98%;margin: 0 auto;}
/* table td,table th{padding: 0 10px;padding: 5px;border-bottom: 2px solid #f7f7f7;} */
table td,table th{padding: 0 10px;padding: 5px;border-bottom: 2px solid #e2dfdf;}
table tr:last-child td{border-bottom: 0;}
table .text-left{text-align: left;}
table .text-center{text-align: center;}
table .text-right{text-align: right;}
.font-weight{font-weight: 600 !important;}
p{font-weight: 400 !important;margin-bottom: 0;}
.div-padding,h4{padding: 0 20px;margin-top: 30px;}
.border-padding{border-bottom: 2px solid #f7f7f7}
ol{padding: 0 20px;}
.instruction.mdl-button {height: 56px;font-size: 20px !important;width: 176px;text-transform: uppercase;border-radius: 10px !important;}

@media screen and (max-width: 380px){
.mdl-mini-footer{padding: 10px 5px;}
}

@media screen and (max-width: 349px){
.mr-10{margin-right: 6px !important}
.mdl-button{font-size: 10px !important;width:min-content}
.mdl-layout-title,.time,.mdl-chip__text{font-size:12px}
.main-body p, .main-body span{font-size: 14px;}
h4 {padding: 0px}
}

i.skipped-answered{
  background-color: #8ECF7C!important;
  height: 6px;
  width: 6px;
  border-radius: 5px;
  position: absolute;
  right: -4px;
  bottom: -3px;
  border: 1px solid #ffffff;
  margin: 0;
  font-size: 6px;
  color: #fff;
  font-weight: 600;
  line-height: 6px;
}

.popup-center{
  top: 50% !important;
  bottom: 50%;
}

.jump-full-height{
  height: 100vh;
  overflow-y: auto;
}
.instructionTitle{color: var(--header-bg) !important;}
.instructionTitle span{background: linear-gradient(var(--header-bg), var(--header-bg)) center bottom / 82px 2px no-repeat;
    padding-bottom: 4px;}
.section.mdl-chip{line-height: 21px;margin-top:4px;}
.section.mdl-chip.active{line-height: 21px;margin-top:4px;background-color: #417cfa;}