@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
* {  margin: 0;
  padding: 0; border: 0;
box-sizing: border-box;

  }
  html {min-height: 100vh;}
  body {
 font-family: 'Roboto', sans-serif;
font-family: Roboto;
font-style: normal;
font-weight: normal;
font-size: 16px;
min-height: 100vh; 
position: relative;
  }
.content_std {margin: 60px 0 30px 0;}  
.reg_form_out { display: flex; align-items: center; justify-content: center; min-height:  100vh; position: relative;
background: url('images/bg.svg') no-repeat top center; 
background-size: 100% auto; 
padding: 25px 15px;
}
  .reg_form { display: flex;
   flex-direction: column; 
   justify-content: center; 
   padding:  40px 25px; 
   border-radius: 10px; 
   max-width: 400px; width:  100%; background: #fff; box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.1);
 }
 .reg_form .login-username {margin-top: 30px;}
 .reg_form .login-password {margin: 20px 0 15px 0;}

 .login-username label, .login-password label {
  display: block;
 color: #B5B4B4; 
font-size: 14px;
line-height: 16px; margin-bottom:  4px;
}
.login-username input,  .login-password input {}
.login-remember {
color: #B5B4B4; 
font-size: 14px; 
margin-bottom: 15px;
}
.forgot-password {
color: #B5B4B4; 
font-size: 14px; 
margin-top: 15px;
display: inline-block;
}
.errno {
  font-weight: normal;
font-size: 12px;
line-height: 14px;
color: #FF2F2F;
margin:  30px 0 0;
text-align: center;
}
.errno.success {
  color: #23bb3e;
}
.form_h1 {
font-weight: 500;
font-size: 24px;
line-height: 28px;
color: #333333;
text-align: center;
margin: 17px 0 6px 0;
}
.form_h2 {
  font-style: normal;
font-weight: normal;
font-size: 16px;
line-height: 19px;
color: #B5B4B4;
text-align: center;
}
input[type=text], input[type=password] { 
border: 1px solid #B5B4B4;
box-sizing: border-box;
border-radius: 5px;
height: 50px; line-height: 50px;
font-size: 14px;
font-weight: normal;
color: #333333;
width: 100%;
padding: 0 16px;
}
input[type=submit] {
  width: 100%;
  background: #12849D;
border-radius: 5px;
height: 50px; line-height: 50px;
font-size: 16px;
color: #fff;
text-align: center;
cursor:  pointer;
}

/* page */

.header {
  background: url(images/header_bg.svg) no-repeat  top center, linear-gradient(180deg, #5ABBC9 -13.72%, #77C7BD 66.64%); 
  min-height: 364px;
  display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 16px;
  color: #fff;
  position: relative;
}
.logout {
padding-right: 40px; height: 20px; line-height:  20px; display: inline-block; color: #fff;
font-weight: 500;
font-size: 20px;
text-decoration: none;
position: absolute; right: 20px; top: 20px;
  background: url(images/exit_icon.svg) no-repeat  right center;
}
.header h1 {
  font-weight: normal;
  font-size: 54px;
line-height: 63px;
}
.h1_text {
  font-size: 20px;
line-height: 23px;
}
.footer_out {
   background: url(images/footer_bg.svg) no-repeat  top center #fff;
  background-size: cover; 
  min-height: 441px;
    padding:  160px 15px 30px 15px;
    color:  #fff;
}
.footer {
margin:  0 auto;
  /*aspect-ratio: 1440 / 441;*/
   max-width: 1030px;
    display: flex; justify-content: flex-start; align-items: center; flex-direction: row; gap: 70px;
    padding-top:  160px;
    color:  #fff;
}
.footer_info {display: flex; gap: 18px; flex-direction: column;}
.footer_info span { opacity: 0.5; }
.footer_soc {display:  flex; gap: 8px;}
.footer_soc a {display:  inline-block;}
.content_narrow {max-width:  820px; padding: 0 15px; margin: 80px auto 20px auto ;}
.content_wide {max-width:  1270px; padding: 0 15px; margin: 80px auto 250px auto ;}


/* > LK */
.h2 {
text-align: center;
font-weight: 500;
font-size: 54px;
line-height: 63px;
color: #01455B;
margin-bottom: 24px;
}
.h2_text {
  font-weight: normal;
font-size: 20px;
line-height: 23px;
text-align: center;
max-width:  410px;
margin:  0 auto;
}
.test_list { margin: 32px auto 48px auto; display: flex; justify-content: center; flex-wrap:  wrap; gap: 20px; max-width: 1000px;}
.test_one {
  background: #FFFFFF;
box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.1);
border-radius: 10px;
padding:  30px;
width: 390px;
height: 180px;
display: block;
text-decoration: none;
}
.test_one:hover {
  box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.2);
  transition: 0.4s;
}
.test_num {
color: #01455B;
font-weight: normal;
font-size: 16px;
line-height: 19px;
margin-bottom: 16px;
}
.test_name {
font-weight: 500;
font-size: 24px;
line-height: 28px;
color: #333333;
margin-bottom: 8px;
}
.test_desc {
font-weight: normal;
font-size: 14px;
line-height: 16px;
color: #B5B4B4;
}

.std_table {
border-collapse: collapse;

}
.doubleScroll-scroll-wrapper {position: fixed; bottom: 0px; width: 100%;}
.table_list { margin-top: 30px; overflow: hidden ;}

.std_table { width: 2700px;}

.std_table th { padding: 15px 8px; font-weight: 300; font-size: 13px; color: #fff; background: #61bec5; border: 1px solid #61bec5;}
.std_table td { padding: 8px 8px; border: 1px solid #61bec5;  font-size: 13px; }
.td_nowrap {white-space: nowrap;}
th.esse div {width: 400px;}

.esse_text {overflow: hidden;
  position: relative;}

.esse_text.hide {
  height: 40px;
}
.esse_text.hide:after{
  content: "";
  display: block;
  height: 25px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 75%)
}

.content_toggle {color: #61bec5; font-size: 13px; text-decoration: none;}

.all_answers_h2 {
font-weight: 500;
font-size: 28px;
color: #01455B;
display: block;
margin-top: 40px;
}
.user_result_single span {display: block; margin-bottom: 10px;}
.user_result_single .mlw_qmn_question b {display: block; margin: 45px 0 30px 0;}
.user_result_single .qsm-text-correct-option { color: green; }
.user_result_single .qsm-text-simple-option {}


.exportToExcel {background: #61bec5; color: #fff; font-size: 14px; padding:  8px 14px; border: 0px; border-radius: 4px; cursor: pointer;}

.go_lk {
  max-width: 287px;
background: #12849D;
border-radius: 5px;
text-align: center;
font-size: 16px;
color: #FFFFFF;
padding: 0 !important;
text-decoration: none;
margin:  30px auto;
display: block;
}

/* < LK */

/* > edit */
.f_user_edit {max-width:  400px; margin: 20px auto;}
.f_user_edit label {display: block; width: 100%; font-size: 14px; color: #ccc; margin: 20px 0 5px 0;}
 select {display: block; width: 100%; 
  border: 1px solid #B5B4B4;
box-sizing: border-box;
border-radius: 5px;
height: 50px;
line-height: 50px;
font-size: 14px;
font-weight: normal;
color: #333333;
width: 100%;
padding: 0 16px;}
.f_user_edit textarea {display: block; 
  width: 100%; 
  border: 1px solid #B5B4B4;
box-sizing: border-box;
border-radius: 5px;
padding: 16px;}

.f_user_edit input[type=submit] {
  margin-top: 40px;
}
/* < edit */

/* < QSM */
.content_narrow .quiz_section .mlw_qmn_new_question {
  font-weight: 500;
font-size: 24px;
line-height: 28px;
color: #01455B;
margin-bottom: 24px;
display: block;
}
.qmn_mc_answer_wrap { margin: 0px; padding: 8px 0; }
.qmn_mc_answer_wrap label {
color: #333333;
font-weight: normal;
font-size: 16px;
line-height: 19px;
}
.qsm-results-page {
  font-weight: normal;
font-size: 20px;
line-height: 23px;
color: #333333;
text-align: center;
margin-bottom: 150px;
}
.qsm-results-page h2 {
  font-weight: 500;
font-size: 54px;
line-height: 63px;
color: #01455B;
text-align: center;
margin-bottom:  24px;
}

.qsm-btn.qsm-submit-btn {
max-width: 177px;
background: #12849D;
border-radius: 5px;
text-align: center;
font-size: 16px;
color: #FFFFFF;
padding: 0 !important;
}
.qsm-pagination.qmn_pagination {
  justify-content: center !important;
}

.quiz_section.qmn_error:after {display: none !important; }

.quiz_section.qmn_error .qmn_radio_answers, .quiz_section.qmn_error .qmn_check_answers, .quiz_section.qmn_error .qmn_accept_answers {
border: 1px solid rgba(218,79,73,0.2) !important;
background: rgba(218,79,73,0.05) !important;
padding: 5px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;

}

.blue_button {
color: #fff;
height:  49px;
line-height: 49px;
max-width:  280px;
width:  100%;
text-align: center;
background: #12849D;
border-radius: 5px;
font-size: 16px;
display: block;
margin:  24px auto 0 auto;
text-decoration: none;
}

#mlwComment58 {margin-top: 20px;}

/* < QSM */

.edit_col img { opacity: 0.6; }
.edit_col img:hover { opacity: 1; }

.snd_btn_modal { cursor: pointer; }
.snd_btn_modal {background: url(images/send_mail.svg) no-repeat center center; width:  18px; height: 18px; display: block;}
.snd_btn_modal_ok {cursor: pointer; background: url(images/send_mail_ok.svg) no-repeat center center; width:  18px; height: 18px; display: block;}
.snd_block {  position: relative; }
.snd_modal {
  position: absolute;
  bottom: 0px; left: 0px;
  padding: 20px;
  background:  #fff;
  border-radius: 5px;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.7);
  color: #000;
  width: 280px;
  display: flex; gap: 20px; flex-direction: column;
}
.send_go_no { display: flex; gap: 5px; justify-content: center;}
.send_go_no > div { color: #fff; width: 40%; text-align: center; height: 30px; line-height: 30px; border-radius: 4px; cursor: pointer; }
.send_go {background: #1cb926; }
.send_no {background: #bf1111; }
.send_go_no .snd_oksend { color: #1cb926; }


@media (max-width: 600px) {

.header {
  background: url(images/header_mobile.svg) no-repeat top center;
  background-size: cover;
  min-height: 183px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 8px;
  color: #fff;
  position: relative;
  padding:  0 15px;
}
.h1_text {font-size:  16px; font-weight: normal; text-align: center;}
  .header h1 {
    margin-top: 20px;
  font-weight: normal;
  font-size: 26px;
  line-height: 32px;
  text-align: center;
}

.footer_logo {width: 196px; height:  auto;}

.logout {
  padding-right: 40px;
  height: 20px;
  line-height: 20px;
  display: inline-block;
  color: #fff;
  font-weight: 500;
  font-size: 0px;
  text-decoration: none;
  position: absolute;
  right: 15px;
  top: 20px;
  background: url(images/exit_icon.svg) no-repeat right center;
}

.footer_out {
  background: url(images/footer_bg.svg) no-repeat top 0px left -40px #fff;
    background-size: auto;
  background-size: unset;
  min-height: 400px;
  padding: 150px 15px 20px 15px;
  color: #fff;
}


  .footer {
  margin: 0 auto;
  aspect-ratio: unset;
  max-width: 1030px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 30px;
  padding-top: 0px;
  color: #fff;

}

.footer_info {
  font-size:  16px;
  display: flex;
  gap: 18px;
  flex-direction: column;
  align-items: center;
  text-align: center;
}


}