@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;700&family=Mukta:wght@400;500;600&family=Noto+Sans+Bengali:wght@200;300;400;500;600;700&family=Poppins:wght@300;400;500;600;700;800&family=Roboto:wght@300;400;500;700;900&display=swap');
h1, h3, h3, h4, h5, strong, span, p, ul li, a, button, input, select, textarea,div{
  html {
    scroll-behavior: smooth;
  }
  font-family: 'Inter', sans-serif;
font-family: 'Mukta', sans-serif ;
font-family: 'Noto Sans Bengali', sans-serif ;
font-family: 'Poppins', sans-serif ;
font-family: 'Roboto', sans-serif ;
}
.filed_bo{margin-bottom: 10px;}
.filed_bo:last-child{margin-bottom: 0px;}
.filed_bo label{font-size: 18px;margin-right: 5px;color: #23282f;width: 30%;}
.filed_bo input, .filed_bo select{
  width: 63%;
  color: #23282f;
  font-size: 17px;
  height: 38px;
  padding: 0 14px;
  background: #f0f0f0;
  border-radius: 5px;
  border: 1px solid #ccc;
}.filed_bo input, .filed_bo select:focus{outline: none;}
.filed_bo button{    height: 40px;
  padding: 0 14px;
  background: #0dcaf0;
  font-size: 17px;
  border-radius: 4px;
  border: none;}
.colorthis{color: #6278df;
  text-shadow: 0px 1px black;
  font-size: 14px;}.imenu{padding: 5px;
    border-radius: 5px;
    margin-right: 8px;
    background: #f7f9ff;}
.pispace{margin-right: 8px;
  background: #f7f9ff;
  padding: 2px;
  border-radius: 5px;}
  .filed{margin-top: 10px;}
  .filed label{font-size: 17px;color: #000000;width: 44%;}
  .filed input{width: 53%;font-size: 16px;}
.picc{color: #0dcaf0}.white {
  color: #3dd6d7 !important;
  font-size: 24px;
  margin-bottom: 8px;
  text-align: center;
}
.list_notes{    list-style-type: number;
  padding-left: 0px;
  text-align: left;
  background: #fff;
  padding: 25px 45px;border: 1px solid #cecdcd;
  border-radius: 5px;}
.list_notes li{
  font-size: 22px;
  font-weight: 500;
  margin-bottom: 10px
}
.svgrotae, .rotateanim{
  color: #0d6efd;
  animation: svground 0.8s ease-in-out infinite;
}.rotateanim{color: #23282f !important;}
@keyframes svground{
  from{
    transform: rotate(0deg);
  }to{
    transform: rotate(360deg);
  }
}
.hvreffect{border-bottom: 1px solid #0077B5;padding-bottom: 10px;
 -webkit-transition: all .5s;
-moz-transition: all .5s;
transition: all .5s;
}.hvreffect:hover{border-bottom: 2px solid #d3a409;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  transition: all .5s;}
.location_list{list-style: none;padding-left: 0px;}
.location_list li{
  background: #fff;
    padding: 8px 14px;
    margin-bottom: 10px;    border-left: 1px solid #00b2ff; 
    border-right: 1px solid #00b2ff;
    box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);
 }.svgr2{font-size: 50px;
  box-shadow: 3px 3px 10px 0 rgba(52,120,224,.4);
  border-radius: 50px;}
.svgrotatea{animation: rotateanim 0.8s ease-in-out infinite}
.scroll a{color: var(--color-body) !important;}
@keyframes rotateanim{
  0%{
    transform: rotate(0deg);
  }25%{transform: rotate(45deg)}
  50%{transform: rotate(-60deg)}
  75%{transform: rotate(-60deg)}
  100%{transform: rotate(45deg)}
}
@media (max-width:3000px){
  .f_field label{font-size: 22px;} 
  .mobmenu_as{display: block;}
  .scroll{height: 100% !important;}
}
@media (max-width:1200px){
  .f_field label{font-size: 19px;} 
}
.scroll{padding-left: 0px;}
.login_f{text-align: center;}
.f_field{
  display: flex;
  flex-direction: column;
  align-items: center;}
  .f_field button{width: calc(100% - 40%);margin: auto;}
  .hide_mobie_nav{display: none !important;}
  .dash_mobile svg{
    font-size: 19px;
  background: #fafafa;
  padding: 6px;
  border-radius: 50px;
  }  
  @media (max-width:600px){
    .f_field{
      display: flex;flex-direction: column;
     width: 100% !important;}
    .mobmenu_as{display: none;
      padding: 10px 12px !important;
      position: absolute;
      top: 0;
      left: 0;
    }.scroll{height: 400px; overflow: scroll}
    .f_field input{width: 100% !important;}
    .f_field button{width: 100% !important;}
    .hide_mobie_nav{display: flex !important;}
  }
.f_field label{font-size: 18px;margin-bottom: 8px;text-align: left;}
.f_field input{border: 1px solid #f1f7ff;width: fit-content}
.btn_field{padding-bottom: 10px}

.list_connect_dashboard li{list-style: none !important;
  padding: 5px 0 !important;
  border-bottom: 1px solid #ccc !important;
  padding-left: 10px !important;
  /*box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);*/}
.scrladdcourse{height: 610px; overflow-y: scroll;}
.scrool_course, .attach_single_preq_data{
    overflow-y: scroll;
}
.scsdi{height: 408px;
overflow: scroll;}
.scrl{height: 210px;
overflow: scroll;}
.listnscrl{height: 510px;
  overflow: scroll;}
.scroll, .scrol_instructor, .scrl, .listnscrl, .scrool_course,.scsdi, .play_backscroll, .attach_single_preq_data, .scrladdcourse, .modal_content{
  -ms-overflow-style: none;  /* Internet Explorer and Edge */
  scrollbar-width: none;  /* Firefox */
}
.scrol_instructor{
  height: 378px;
  overflow-y: scroll;
}
.scroll::-webkit-scrollbar, .scrol_instructor::-webkit-scrollbar, .listnscrl::-webkit-scrollbar, .scrl::-webkit-scrollbar, .scsdi::-webkit-scrollbar, .scrool_course::-webkit-scrollbar, 
.attach_single_preq_data::-webkit-scrollbar,.modal_content::-webkit-scrollbar, 
.scrladdcourse::-webkit-scrollbar, .play_backscroll::-webkit-scrollbar{display: none;}
.summary{color: #000;
  background: radial-gradient(rgba(0,0,0,.2), transparent);
  font-size: 18px;}
.cupload button{
  font-size: 17px;
  background: #333;
  color: #fff;
}.cupload button:hover{outline: none; background: #ff9e07;color: #fff;}
#selectcp{
 font-size:25px !important;
 overflow: visible !important;
}
.crs label{position: relative !important;
  text-align: left !important;
  padding-left: 2px;}
.card_cstm_course{margin-top: 20px;
  padding: 5px;
  background: #fff;
  box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);
  border-radius: 4px;}
.card_cstm_course img{border-radius: 5px; width: 100%; height: 230px; object-fit: cover;object-position: center;}
.card_cstm_course ul{list-style: none; padding-left: 4px;margin-bottom:10px;
text-align: left;
}
.flex_course_btn{margin-top:14px;display: flex;justify-content: space-between;align-items: center;}
.flex_course_btn button{background: none; border: none;}
.card_cstm_course ul li{margin-top: 5px; font-size: 15px;margin-bottom: 0px}
.card_cstm_course ul li strong{margin-bottom: 0px}
.bootstrap-select .dropdown-menu li a span.text {
  display: inline-block;
  font-size: 16px !important;
}
.btn{font-size: 2rem !important}
.bootstrap-select>.dropdown-toggle.bs-placeholder, .bootstrap-select>.dropdown-toggle.bs-placeholder:active, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover {
  color: #212529 !important;
}
/* -- Modal CSS - modal is requred just 2 fle 1. edit course, 2. edit video. --*/
.modala{
  height: 100%;
  width: calc(100% - 50%);
  position: fixed;
  left: 25%;
  top: 10%;
  z-index: 999;
  background: #fef4f4;
  transition: 0.3s ease-in-out;
  margin: auto;
}
.modal_content{background: #dee2e6; border: 1px solid #ccc;padding: 16px;
display: flex;align-items: center;flex-direction: column;    height: 500px;
overflow-y: scroll;
}
.modal_title{    display: flex;
  justify-content: space-between;
  width: 100%;border-bottom:1px solid #ccc;}
  .modal_title p{color: #333 !important;padding-left: 6px;
  font-size: 18px !important;display: flex;align-items: center;justify-content: center;
  }
  .modal_title svg{    background: #fff;
    border-radius: 50px;
    box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);
    padding: 6px;
    margin-bottom: 0px !important;
    cursor: pointer;}
.mr3{margin-right: 5px !important;}
.modal_left_c{}
.modal_ifield{margin-top: 14px;padding: 2px;
text-align: left}
.modal_ifield label{margin-bottom: 10px !important;font-size: 16px !important;
color: #333 !important;}
.modal_ifield input, .modal_ifield textarea, .modal_ifield select {
  box-shadow: none !important;
  font-size: 15px !important;
  height: 40px !important;
  width: 100%;
  background: #fff !important;
  border: 1px solid #ccc !important;
  border-radius: 2px !important;
  padding: 0 14px;
}
.accordion{
  max-width: 100%;
  width: 100%;
  background: #FFF;
  margin: auto;
  padding: 15px;
  border-radius: 8px;
}
.accordion .accordion-content{
  margin: 10px 0;
  border-radius: 4px;
  background: #FFF7F0;
  border: 1px solid #FFD6B3;
  overflow: hidden;
}
.accordion-content:nth-child(2){
  background-color: #F0FAFF;
  border-color: #CCEEFF;
}
.accordion-content:nth-child(3){
  background-color: #FFF0F3;
  border-color: #FFCCD6;
}
.accordion-content:nth-child(4){
  background-color: #F0F0FF;
  border-color: #CCCCFF;
}
.accordion-content.open{
  padding-bottom: 10px;
}
.accordion-content header{
  display: flex;
  min-height: 50px;
  padding: 0 15px;
  cursor: pointer;
  align-items: center;
  justify-content: space-between;
  transition: all 0.2s linear;
}
.accordion-content.open header{
  min-height: 35px;
}
.accordion-content header .title{
  font-size: 14px;
  font-weight: 500;
  color: #333;
}
.accordion-content header i{
  font-size: 15px;
  color: #333;
}
.accordion-content .description{
  height: 0;
  font-size: 12px;
  color: #333;
  font-weight: 400;
  padding: 0 15px;
  transition: all 0.2s linear;
}
  .modal_ifield textarea{height: 90px !important;resize: none;}
  .epselect{height: 43px !important;
    line-height: 1.4 !important;
    border: 1px solid #ccc !important;}
.controls_button{display: flex;
  justify-content: space-between;
  margin-top: 14px;
  background: #eee;
  padding: 15px;
  border-radius: 2px;
  border: 1px solid #ccc;
  box-shadow: 3px 3px 10px 0 rgba(52,120,223,.1);}
.controls_button button{border: none;
  height: 40px;
  padding: 0 20px;
  font-size: 17px;
  background: #ffffff;
}
.notes_flex button{border: none;
  background: #fff;
  padding: 6px;
  box-shadow: 3px 3px 10px 0 rgba(0,0,0,.1);
  border-radius: 50px;}

  /* FORM  CSS */

  .wrapper{width:850px;border:1px solid #ccc;margin:auto;
    padding:15px 45px}
  .form_ttl{text-align:center;margin:40px 0;}
  .form_ttl h4{border-bottom: 2px solid #333;
    width: 238px;
    margin: auto;
    font-size: 29px;}
  /* main list */
  .main_listform{}
  .main_listform li{margin-top: 20px !important;color: #000;}
  .single_list_info{display:flex;align-items:center;
    margin-bottom: 12px !important;}
  .single_list_info p{display: flex;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: -24px !important;}
  .olist li{color: #000000;}
  .single_list_info span{}
    .bmarginlist_item{margin-top: 20px;}
  .orderL_quaL_input{display: inline-block;padding-left: 15px;}
  .orderL_quaL_input li{display: inline-block;}
  .orderL_quaL_input li span input{opacity: 1 !important;position: relative;
    height: 12px; display: inline !important;width: 30px !important;}
    .realagion_litem{}
    .abslt span {
      position: relative;
      top: 14px;
  }
    .realagion_litem input{height: 38px !important;
      border: none !important;
      border-bottom: 1px dashed #333 !important;
      width: 220px !important;
      border-radius: 0px !important;}
.realagion_litem span{position: relative;top: 14px;}
 
    .single_resize{display: flex !important;align-items: center !important;}
    .bootstrap-select>.dropdown-toggle{
      font-size: 18px !important;text-align: center !important;
      background: none !important;border: none !important;}
  .btn_form_bottom{display: flex;
    align-items: center;
    justify-content: space-evenly;}
    .btn_form_bottom button{font-size: 17px; border: none; height: 40px;
    padding: 0 18px;margin: 20px 0;
    }
  .qimitem{padding: 50px 10px;
    border: 1px dashed #3339;
    border-radius: 2px;}
  .wrap_i{display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;}
.wrap_i input{    width: 100%;
  margin-top: 12px;
  text-align: center;
  background: #fafafa;
  padding: 4px;
  box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);
  border: 1px solid #3333;
  border-radius: 5px;}
.wrap_i label{}
.wrap_i svg{
  color: #084298;
  background: #dee2e6;
  padding: 5px;
  border-radius: 5px;}
  /* Mobile Devices */
  @media (max-width:992px){
    .wrapper{width: 100%;padding-left: 5px;padding-right: 0px;}
    .wrapper ul{padding-left: 0px !important;}
    .wrapper ol{padding-left: 0px !important;}
    .wrapper input, .wrapper select{width: 100% !important;}
    .wrapper .arelagion {
      width: 100% !important;
      height: 50px !important;
      margin-top: 10px !important;
      margin-bottom: 21px;
  } .wrapper input, .wrapper select:focus{outline: none}
      .wrapper input, .wrapper .liradio {
        width: calc(100% - 31%)!important;
    }
    .wrapper .liradio {
      width: 18px !important;
  }
    .realagion_litem span {
      position: none !important;
  }
 
    .single_list_info p input{width: 100% !important;}
    .wrapper ul, .wrapper ol{list-style: none;}
    .smaen{font-size: 10px !important;font-weight: 500 !important;}
    .h40{height: 40px !important;}
    .realagion_litem .spnrela{margin-bottom: 10px !important;}
  }
  .loginbtns{font-size: 23px !important;
  height: 50px;
  padding: 0 20px;
  border: 1px solid #ccc;
  border-radius: 6px;transition: 0.3s;
  background: linear-gradient(45deg, #4e00cc,#007bff, #0a58ca);
  color: #fff !important;}
  .loginbtns:hover{
    background: linear-gradient(45deg, #0a58ca,#1a07e9,#16a9c0);
  }
  input:focus{outline: none;}
/* PAGES - STUDENT AREA CSS */
.congmessage {
  display: flex;
  justify-content: center;
  padding: 10px 0;
  padding-top: 20px;
  padding-bottom: 10px;
  border-radius: 10px 10px 0 0;
  background: #f8f9fa;
  padding-left: 15px;
  padding-right: 10px;
  border-bottom: 1px solid #ccc;
  /*box-shadow: 3px 3px 30px 0 rgba(52,120,223,.2);*/
}
.last_congitem{
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  padding-top: 15px;
}
.last_congitem button{height: 42px;
  padding: 0 28px;
  border: 1px solid #ccc;
  background: #00b7db;
  color: #fff;border-radius: 2px;
  font-size: 18px;
}
.congmessage img{width: 100px;margin-right: 10px; animation: wellcome 0.8s ease-in-out;}
@keyframes wellcome{
  from{
    transform:rotate(0deg) ;
  }to{
    transform: rotate(360deg);
  }
}
.congmessage span{color: #ffc107;}
.congcard{padding: 10px;border-radius: 1px solid #ccc; 
  /*box-shadow: 3px 3px 30px 0 rgba(0, 0, 0, 0.2);*/

}
.congcard ul{list-style: none; padding-left: 0px;padding-top: 20px;}
.congcard ul li{}
.congcard ul li p{}
.congcard ul li p svg{}
.main_dasbox{
  text-align: center; padding: 10px; border: 1px solid #ccc;
 border-radius: 10px;padding-bottom:0px; box-shadow: 3px 3px 18px 0 rgba(0,0,0,.1);
}
.main_dasbox img{
  width:50px;
}.main_dasbox h3{font-size: 22px;
  margin-top: 9px;
  padding-bottom: 0px;
  margin-bottom: 8px;}
@media (max-width:992px){
  .congmessage {
    display: block;
    box-shadow: none;
    padding: 10px 0;
    padding-top: 20px;
    padding-bottom: 0;
    border-radius: 5px 5px 0 0;
    background: #e9ecef;
    padding-left: 10px;
    padding-right: 2px;
    text-align: center;
    padding-bottom: 10px;
}

.flre{flex-direction: column;}
.flre img{
  width: 150px;
height: 100%;
margin: auto !important;padding-bottom: 12px !important;
}
.fsabout{font-size: 18px !important;}

.congmessage p{text-align: left;}
.congmessage img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    object-position: top;
  padding-bottom: 10px;
  padding-right: 2px;
  border-radius: 50%;
  margin: auto;
  text-align: center;
}
}
/* Popup Getway */
.main_cpay{display: none;}
.card_paymmt {
  padding: 30px;
  margin-top: 11px;
  width: calc(100% - 60%);
  margin: auto;
  box-shadow: 3px 3px 30px 0 rgba(52,120,223,.2);
  border-radius: 5px;
  position: fixed;
  top: 18px;
  left: 30%;
  z-index: 700 !important;
  background: #fafafa;border: 1px solid #ccc;
}
.cprnticon{position: relative;}
.close_paycard{position: absolute;right: -12px;
  top: -9px;
  cursor: pointer;}
.close_paycard svg {
  font-size: 20px;
  padding: 6px;
  background: #fefefe;
  border-radius: 50%;
  box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);
}
.guidline_para{
  padding: 10px 4px;
  border: 1px solid #e4e4e4;
  margin-top: 10px;
  border-radius: 10px;
  text-align: center;
  margin-bottom: 10px;
}
.scroll_pay{height: 370px;
  overflow-y: auto;}
  .scroll_pay{
    -ms-overflow-style: none;  /* Internet Explorer and Edge */
    scrollbar-width: none;  /* Firefox */
  }
  .scroll_pay::-webkit-scrollbar{display: none;}
  .field_pay{    margin-top: 14px;
    padding: 5px 0;}
.pay_btn{
  margin: 10px 0;
  text-align: center;
  padding-top: 10px;
}
.f_pay{
  margin-bottom: 20px;
}
.f_pay label{margin-bottom: 4px;}
.pay_btn button{
  height: 42px;
  padding: 0 35px;
  background: #0d6efd;
  color: #fff;
  font-size: 20px;
  border-radius: 3px;
  border: none;
}
.title_cp{}
.cp{text-align: center;
  font-size: 36px;text-shadow: 1px 1px #49586f;
  color: #075aff;}
.cp span{color: #ffc107;}
.getway_img{background: #fafafa;
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin-bottom: 0px;
  padding-bottom: 0px;}
.getway_num{padding-left: 0px; list-style: none}
.getway_num li{}
.getway_num li span{background: #fff;
  padding: 2px 4px;
  color: #00b2ff;
  text-align: center;
  padding-right: 1px;
  font-size: 15px;
  border-radius: 5px;}
/* -- PROFILE AREA --*/
.bg_profile{background: url("../images/a2.png");
background-repeat: no-repeat;
background-size: cover;
padding: 250px 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
position:relative;
}
.bg_profile::after{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0,.4);
  position: absolute;
  top:0;left:0;
  z-index: -1;
}
.align_prow {
  display: flex;
  align-items: center;
  justify-content: center;
  background: url(../images/bgmmt.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  border-bottom: 2px solid #ccc;
  padding-top: 60px;
  position: relative;
  z-index: 1;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
}
.mtdesk{margin-top: 50px !important;}
.align_prow::after{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top:0;left:0;
  background: rgba(0, 0, 0,.2);
  z-index: -1;
}
.icon_rbanim span{font-size: 40px;
    position: absolute;
    font-weight: 500;
    text-shadow: 1px 1px #00b2ff;
    color: #fff;
}
.offer {
  padding: 6px;
  text-align: center;
  box-shadow: 3px 3px 30px 0 rgba(0,0,0,.1);
  border: 1px solid #ccc;
  border-radius: 6px;
  cursor: pointer;transition: 0.2s;transition-delay: 0.1;
  background: #16386bde;
}

.offer:hover{background: #0077B5;}
.icon_rbanim img{animation: animla 2.5s ease-in-out infinite;width: 200px;
}
@keyframes animla{
  0%{
    transform: translate(0px);
  }
  25%{
    transform: translate(45px);
  }
  50%{
    transform: translate(-25px);
  }
  100%{
    transform: translate(0px);
  }
}.waf{color: #08c4d9;
  font-weight: bold;
  font-size: 27px;
  text-shadow: 1px 1px black;}.wbe{color:  #084298;}
.rowmt85{margin-top: 85px !important;}.lineh span{line-height: 1.3;}
.round{
  height: 100%;
    text-align: center;
    width: 100%;position: relative;
    padding-top: 20px;
    border-radius: 50%;
   background: transparent;
   background: url(../video/assets/images/earthii.png);
    background-size: cover;
    background-position: center;
    z-index: 1;
}
.sec{position: relative;z-index: 1;}
.sec::after{content: "";display: block;position: absolute;top: 0;left: 0;
  background: rgba(0, 0, 0,.4);z-index: -1;}
.round::after{
  content: "";display: block;width: 100%;
  height: 100%;
  position: absolute;top: 0;left: 0;
  background:  url(../video/assets/images/earthii.png);
  animation: roundaf 0.8s ease-in infinite;
  z-index: 2;
}
@keyframes roundaf{
  from{transform: rotate(0deg);}to{transform: rotate(360deg);}
}
.global{}
.global img{animation: dela 2.1s ease-in-out infinite;}
@keyframes dela{
  0%{
    transform: rotate(0deg);
  }  25%{
    transform: rotate(10deg);
  } 50%{
    transform: rotate(-10deg);
  } 75%{
    transform: rotate(10deg);
  }100%{
    transform: rotate(0deg);
  }
}
.offer img {
  width: 70px;
  margin-bottom: 9px;
  box-shadow: 3px 3px 10px 0 rgba(0,0,0,.6);
  border-radius: 10%;
  background: linear-gradient(45deg, lightblue, transparent);
}
.offe p{    font-weight: 500;
  font-size: 19px;
  text-shadow: 1px 1px #00b2ffa3;}
  .offee img{width: 100%;}
  .bgr {
    /* margin-top: 120px; 
    background: azure;*/
    padding-top: 40px;
    background: url(../images/gress3.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 1;
}
.bgr::after{content: "";display: block;
width: 100%;height: 100%;background: rgba(52,120,223,.0.2);position: absolute;
top: 0;left: 0;z-index: -1;
}
.offer p {
  font-size: 18px !important;
  color: #fff;
  text-align: center;
  font-weight: 500;
  text-shadow: none !important;
  word-wrap: break-word;
}
.oftext{
  width: calc(100% - 70%);
  display: block;
  background: #00b2ff;
  font-weight: 500;
  padding: 3px 0;
  font-size: 11px;
  position: absolute;
  top: -5px;
  left: -19px;
  transform: rotate(-32deg);
  color: #fff;
  border-radius: 50% 50% 10px 10px;
  padding-bottom: 0;
  box-shadow: 3px 3px 10px 0 rgba(52,120,223,.2);
}

.fend{
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.flexdir{display: flex;align-items: center; justify-content: center;}
.left{width: 40%; float: left;position: relative;background: #fefefe;}
.left img {
  width: 100px;
  height: 125px;
  background: #fff;
  object-fit: cover;
  object-position: center;
}
.left svg {
  font-size: 26px;
  color: #0d6efd;
  position: absolute;
  left: 0;
  top: 0;
  animation: infi 1s ease-in-out infinite;
}
.fa-satellite-dish {
  animation: leri 1s ease-in-out infinite;
  color: #0dcaf0;
}
@keyframes infi{
  from{
    transform: rotate(0deg);
  }to{
    transform: rotate(360deg);
  }
}
@keyframes leri{
  0%{
    transform: rotate(0deg);
  }25%{
    transform: rotate(-45deg);
  }50%{
    transform: rotate(0deg);
  }
  75%{
    transform: rotate(15deg);
  }
  100%{
    transform: rotate(0deg);
  }
}
.right{width: 60%;float: left}
.right p{font-size: 15px !important;
  text-shadow: none;
  text-align: left;
  font-weight: 500;
  color: #606060 !important;}

/*****MAIN PROFILE DATA 2 *****/
.main_profile_data{
  background: url("../images/gress3.png" ) no-repeat;
  background-size: cover;
  padding: 130px 10px;
  display: flex;align-items: center;justify-content: center;
  z-index: 1;position: relative;
  flex-direction: column;
}
.single_list_info p input{height: 38px !important;
  border: none !important;
  border-bottom: 1px dashed #333 !important;
  border-radius: 0px !important;}
@media (max-width: 3000px){
  .dashboard{width: 100% !important;}
  .f_field input{width: 100%;}
  .login_f {padding: 20px;}
  .h500{height: 500px !important;}
  .list_notes h2{font-size: 30px;
    font-family: 'Roboto', sans-serif !important;
    padding-top: 26px;}
    .f_field button {
      margin: auto;
      width: 100%;}
  .f24{font-size: 24px !important;
  text-align: left !important;}
  .tl{text-align: left !important;}
  .liradio{opacity: 1 !important;
    position: absolute !important;
    width: 18px !important;margin-top: 6px;}
    .h40{height: 40px !important;}
    .ml26{margin-left: 26px !important;}
}
/* image css */
.wrapper2{
  position: relative;
  height: 190px;
  width: 200px;
  border-radius: 10px;
  background: #fff;
  border: 2px dashed #c2cdda;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.wrapper2.active{
  border: none;
}
.wrapper2 .image{
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wrapper2 img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.wrapper2 .icon{
  font-size: 100px;
  color: #9658fe;
}
.wrapper2 .text{
  font-size: 20px;
  font-weight: 500;
  color: #5B5B7B;
}
.wrapper2 #cancel-btn i{
  position: absolute;
  font-size: 20px;
  right: 15px;
  top: 15px;
  color: #9658fe;
  cursor: pointer;
  display: none;
}
.wrapper2.active:hover #cancel-btn i{
  display: block;
}
.wrapper2 #cancel-btn i:hover{
  color: #e74c3c;
}
.wrapper2 .file-name{
  position: absolute;
  bottom: 0px;
  width: 100%;
  padding: 8px 0;
  font-size: 18px;
  color: #fff;
  display: none;
  background: linear-gradient(135deg,#3a8ffe 0%,#9658fe 100%);
}
.wrapper2.active:hover .file-name{
  display: block;
}#custom-btn {
  margin-top: 10px;
  display: block;
  width: 200px;
  height: 35px;
  border: none;
  outline: none;
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  cursor: pointer;
  background: #084298;
}.qualification{display: flex;flex-direction: row; align-items: center;}
.qualification label{padding-bottom: 7px;
  font-size: 21px;margin-right: 15px;}
  .qualification select {
    height: 40px;
    width: 220px;
    padding: 0 10px;
    border: 1px solid #ccc;
    font-size: 18px;
    border-radius: 5px;
}.file_d{margin-top: 15px;}
.file_d input, .file_d select {border: 1px solid #ccc;
  border-radius: 2px; height: 38px; padding: 0 14px;width: 100%;}
.file_d label {margin-bottom: 5px;font-size: 18px;}
.main_profile_dataa{text-align: center;}
.se_re_iform{height: 38px !important;
  border: none !important;
  border-bottom: 1px dashed #333 !important;
  width: 300px !important;background: none !important;
  box-shadow: 0px !important;
  border-radius: 0px !important;}
@media (max-width:2500px) and (min-width:992px){
  .single_list_info p .input1{width: 600px !important;}
  .single_list_info p .input2{width: 511px !important;}
  .single_list_info p .input3{width: 613px !important;}
  .single_list_info p .input4{width: 524px !important;}
 .realagion_litem .input6{width:200px !important;}
 .realagion_litem .input7{width: 310px !important;}
 .realagion_litem .a1{width: 271px !important;}
 .realagion_litem .a2{width: 271px !important;}
 .realagion_litem .a3{width: 280px !important;}
 .realagion_litem .a4{width: 280px !important;}
  /* occupation */
  .se_re_iform {
    width: 250px !important;
    height: 40px !important;
    text-align: center;
}
    #adateofbirth{width: 258px !important;text-align: center;}
  /* mobile */
  .input5{width: 600px !important;}
  .main_profile_data p {
    font-size: 34px !important;
}/* .card_paymmt{width: calc(100% - 70%);}*/
.realagion_litem{display: flex !important;align-items: center;}
.absolute_moon img {
  width: 100px;}.minib{display: none;}
  .main_profile_data {
    padding: 100px 10px;
    padding-bottom: 95px;
    padding-top: 41px;
    background-position: center;
}.bigon{display: block;}
.getsprt{
  margin-top: 100px;
  width: 100%;
  background: #f8f9fa;
  padding: 30px;
}.getsprt form{padding-bottom: 40px;}
.course{margin-top: 70px;}
.mbdmq{margin-bottom: 50px;}
.purchasebtn{width: 100%;
  padding: 10px;
  margin-top: 10px;
  border: none;
  font-size: 21px;
  background: #0dcaf066;
  color: #fff;}
  .buynotice {
    font-size: 23px;
    margin-top: 30px;
    background: #e9ecef;
    font-weight: normal;
    padding: 6px 0;
    box-shadow: 3px 3px 30px 0 rgba(0,0,0,.3);
    color: #0a58ca;
}.iconplay svg {
  color: #00ffaf;
  font-size: 35px;
  cursor: pointer;
}.iconplay {
  position: absolute;
  width: 100%;
  height: calc(100% - 21%);
  text-align: center;
  left: 0;
  top: 0;
  position: absolute;
  background: rgba(0,0,0,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}.toggle-trigger{font-size: 20px !important;}
.bimg{height: 400px;object-fit: cover;
  object-position: center;}
  .ofb p {
    font-size: 25px !important;
    padding-top: 18px;
    text-shadow: none;
    margin-bottom: 10px !important;
}
.ofb .para{font-size: 20px !important;padding-top: 0px;}
  .play_backscroll{height: 440px !important;}
  .twa{margin: 60px 0;margin-top: 0px;}
  .arelagion{    border: none !important;
    border-bottom: 1px dashed #333 !important;
    position: relative !important;
    top: 12px !important;
    border-radius: 0px;}
    .input5{background: #fff !important;position: relative;}
}
.fa-circle-info{animation: r 0.8s ease-in-out infinite;}
@keyframes r{
  from{transform: rotate(0deg);}to{transform: rotate(360deg);}
}
.bootstrap-select>.dropdown-toggle {
  visibility: hidden !important;
}
.bootstrap-select>.dropdown-toggle.bs-placeholder, .bootstrap-select>.dropdown-toggle.bs-placeholder:active, .bootstrap-select>.dropdown-toggle.bs-placeholder:focus, .bootstrap-select>.dropdown-toggle.bs-placeholder:hover{
  visibility: hidden !important;
}
@media (max-width:922px){
  .single_list_info span {
    font-size: 10px;
    font-weight: bold;
}
.a1{width: 81% !important;}
.postspan{
  margin-left: 9px;
  padding-left: 0px !important;
  position: relative;
  left: -8px;
}
.a2{width: 70% !important;}
  .param .para{text-align:left;padding:2px;line-height:1.3 ;font-size: 16px !important;text-shadow: none !important;margin-bottom: 3px;}
.main_profile_data{padding: 70px 10px;
  background-position: center;
  object-fit: cover;padding-bottom: 30px;
  object-position: center;}
  .mtdesk {margin-top: 0px !important; }
  .pp p{text-align: left !important;
    font-size: 14px !important;}
    .f24 {
      font-size: 18px !important;
      text-align: left !important;
  }.toggle-able p{
  font-size: 14px !important;
  text-align: left;
  font-weight: 400;}
  .fsizem p{font-size: 16px !important;}.minib{display: block;font-size: 16px !important;}
  .play_backscroll{height: 300px;
    overflow-y: scroll;}.bigon{display: none;}
    .icon_rbanim span {
      font-size: 35px;
      left: 0;
      bottom: 154px;
      line-height: 1.2;
      background: radial-gradient(#ffffff, transparent);
      background: radial-gradient(#0dfd75, transparent);
      text-align: center;
  }
  .absolute_moon{position: absolute;
    top: 10px;
    left: 26%;
    width: 60px;
    margin: auto;
    margin-bottom: 18px;}
    .scrol_img{
      position: absolute;
      bottom: 28px;
      left: 44%;
      width: 40px;
      height: 40px;
    }
    .list_notes{width: 100% !important;}
    .iconplay{position: absolute;
      width: 100%;
      height: calc(100% - 27%);
      text-align: center;
      left: 0;
      top: 0;
      position: absolute;
      background: rgba(0,0,0,.2);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 1;
    }.iconplay svg{color: #00ffaf;
      font-size: 25px;
      cursor: pointer;}
    .overleyvideobg{width: calc(100% - 13%);margin: auto;
    background: #fefefe;
    }
    .overleyvideobgwatch{width: calc(100% - 1%);margin: auto;
      background: #fefefe;}
      .card_paymmt {
        padding: 25px;
        margin-top: 11px;
        width:calc(100% - 2%);
        margin: auto;
        position: fixed;
        top: 18px;
        left: 0;
    }
    .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
      width: 100% !important;
  }
  .purchasebtn{padding: 0 20px;
    height: 35px;
    margin-bottom: 0px;
    width: 100%;
    border: none;
    background: #0dcaf066;
    color: #fff;}
  .guidline_para strong{font-size: 14px;}
  .getsprt{
    padding: 30px 0;}
}.getsprt button{margin-top: 15px;
  height: 38px;
  padding: 0 40px;
  font-size: 20px;
  border-radius: 5px;
  margin-right: 2px;
  text-align: center;
  float: right;
  border: 1px solid #ccc;}
.main_profile_data::after{
  content: "";
  display: block;
  position: absolute;top: 0;
  left: 0;
  background: rgba(0, 0, 0,.1);
  width: 100%;height:100%;
  z-index: -1;
}
.main_profile_data p{font-size: 24px;font-size: 21px;
  color: #0df0dd;
  font-weight: 500;
  margin: 16px 0;
  text-shadow: 1px 1px black;}
.main_profile_data span{}
.pbsitem{list-style: none;padding-left:0px;
  padding: 10px;}
  .pbsitem li {
    display: inline-block;
    margin-left: 8px;
    color: #00dbbf;
    font-weight: 500;
    background: #f8f9fa;
    padding: 8px 10px;
    border-radius: 5px;
    box-shadow: 3px 3px 30px 0 rgba(52,120,223,.3);
}
.pbsitem li:first-child{margin-left: 0px !important;}
.pbsitem li span{}
.pbsitem li span img{display: inline;width:20px;height:20px;
margin-right: 3px;
}
/* Toggle */
.play_backscroll{height: 200px;
  overflow-y: scroll;}
.toggle-block {
  border-bottom: 1px solid #ccc;
  color: #999;
}
.toggle-block .toggle-trigger {
  cursor: pointer;
  position: relative;
  padding: 15px 20px 15px 0;
  margin: 0;
}
.toggle-block .toggle-trigger::after {
  content: "\002B";
  font-family: "Font Awesome 5 Free";
  font-weight: bold;
  position: absolute;
  transform: translateY(-50%);
  right: 0;
  top: 50%;
}
.toggle-able {
  display: none;
  padding-bottom: 15px;
}
.active {
  color: #000;
}
.active .toggle-trigger::after {
  content: "\2212";
}
.buy_nowbtn{width: 300px;
  height: 40px;
  border-radius: 50px;
  background: #d78404;
  color: #fff;
  border: none;margin-bottom: 40px;}
.toggle-wrap{width: calc(100% - 10%); margin: auto;}
.classtitle{font-weight: 500;
  text-align: center;
  margin-top: 16px;}
.student_dataview table td{font-size: 14px;text-align: left;}
.student_dataview table th{font-size: 16px;text-align: left;}
.student_dataview table td .editbtn{border: none; background: none;}
.sizesdetails li{margin-top: 15px;font-size: 17px !important;color:#333 !important;}
.glass{font-size: 19px !important;font-weight: 500;text-align: center;
}
.feeform{text-align: left;padding: 15px 30px;border-radius: 5px;}
.feeform label{margin-bottom: 5px;}
.bor{border: 1px solid #3333;}
.textmsg{padding: 11px 4px;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 3px 3px 30px 0 rgba(52,120,223,.1);}
.feeform div{margin-top: 15px;text-align: right;margin-right: 2px;}
.raasia{animation: raasia 1s ease-in infinite;}
@keyframes raasia{
  from{
    transform: rotate(0deg);
  }to{transform: rotate(360deg)}
}
.alert_prgs{position: absolute;
  background: #0f2545;
  bottom: 10%;
  border: 2px solid #0dcaf0;
  padding: 20px 10px;
  opacity: 99;
  border-radius: 10px;}
 .alert_prgs button{
    background-color: white;
    border: 0px;float: right;
    width: 130px;
    padding: 10px 40px;
    border-radius: 3px;
    color: #8C52FF;
    cursor: pointer;
}
.alert_prgs .progress{
    background-color: white;
    margin-top: 15px;
    margin-bottom: 15px;
    height: 7px;
    border-radius: 3px;
    padding: 4px;
}
.alert_prgs .progress-bar{
    width: 0%;
    height: 100%;
    background-color: #8C52FF;
    border-radius: 3px;
}
.alert_prgs span{
    width: 130px;
    line-height: 35px;
    border-radius: 3px;
    position: relative;
    top: 1px;
    text-align: center;
    display: inline-block;
    background-color: white;
    color: #8C52FF;
}