@charset "UTF-8";
/* @import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css"); */

* { 
  padding: 0px; margin: 0px; outline: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased;
}

#zmmtg-root {
  display: none;
}
img{
  max-width:100%; height: auto; position: relative;
}
body {
  min-width:0px !important; margin: 0 !important; font-size: 16px !important; font-weight: 400; line-height: 1.5; color: #1D1D1D !important; font-family: 'Roboto', sans-serif !important; overflow-x: auto !important; overflow: auto !important; background: #E5E5E5;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0; padding: 0; font-family: 'Roboto', sans-serif;
}

p:not(.MuiTypography-noWrap) {
  margin: 0; padding: 0; font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 400; color: #1D1D1D;
}
ol, ul, dl {
  margin: 0; padding: 0;
}
svg.iconcolor_ch:hover{ fill:#8d0812 !important}
svg.iconcolor_ch1{ stroke:#1D1D1D}
svg.iconcolor_ch1:hover{  fill:none !important; stroke: #8d0812 !important;}


title { border:1px solid red;}
ol ol,
ul ul,
ol ul,
ul ol {
  margin: 0; padding: 0;
}
a {
  color: #B80A17;
  text-decoration: none;
  background-color: transparent;
  transition: all 0.5s ease;
}
a:hover {
  color: #8d0812 !important;
  text-decoration: none;
}
button:focus{
  outline: none;
}

/* common css Start ------ */

.button_appearance_none {
  background: none;
  border: none;
  box-shadow: none;
  cursor: pointer;

  -webkit-appearance: none; /* remove default appearance on Webkit-based browsers */
  -moz-appearance: none; /* remove default appearance on Mozilla-based browsers */
  appearance: none; /* remove default appearance on all other browsers */
}
.input_appearance_none {
  background: none;
  border: none;
  box-shadow: none;

  -webkit-appearance: none; /* remove default appearance on Webkit-based browsers */
  -moz-appearance: none; /* remove default appearance on Mozilla-based browsers */
  appearance: none; /* remove default appearance on all other browsers */
}
.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.pointer_event_none {
  pointer-events: none;
}
.input_pointer_event_none {
  pointer-events: none;
  background: none !important;
  background-image: none !important;
}
.flex_center {
  align-items: center !important;
  justify-content: center !important;
}
.flex_start {
  align-items: center !important;
  justify-content: flex-start !important;
}
.flex_space_between {
  align-items: center !important;
  justify-content: space-between !important;
}
.flex_dir_col {
  flex-direction: column;
}
.flex_dir_row {
  flex-direction: row;
}
.textCenter {
  text-align: center !important;
}
.textRight {
  text-align: right !important;
}
.textLeft {
  text-align: left !important;
}
.textJustify {
  text-align: justify !important;
}
.text_align_right {
  text-align: right;
}
ul.default_ul {
  padding: 0 0 0 15px;
  margin: 0 0 0 15px;
}
ul.default_ul li {
  list-style: disc;
  padding: 0 0 0 6px;
  margin: 5px 0 5px;
}

.mt_05 { margin-top: 5px; }
.mt_10 { margin-top: 10px; }
.mt_20 { margin-top: 20px; }
.mt_30 { margin-top: 30px; }

.mb_0 { margin-bottom: 0px !important; }
.mb_10 { margin-bottom: 10px; }
.mb_20 { margin-bottom: 20px; }
.mb_30 { margin-bottom: 30px; }
.mb_40 { margin-bottom: 40px; }
.mb_50 { margin-bottom: 50px; }

.mr_10 { margin-right: 10px; }
.mr_20 { margin-right: 20px; }
.mr_30 { margin-right: 30px; }
.mr_40 { margin-right: 40px; }
.mr_50 { margin-right: 50px; }

.ml_05 { margin-left: 5px; }
.ml_10 { margin-left: 10px; }
.ml_20 { margin-left: 20px; }
.ml_30 { margin-left: 30px; }

.m_auto {
  margin: 0px auto;
}
.m_auto_30 {
  margin: 0px auto 30px !important;
}

.width_100 {
  width: 100% !important;
  max-width: 100% !important;
}
.width_75 {
  width: 75%;
}
.width_70 {
  width: 70%;
}
.width_50 {
  width: 50%;
}
.width_33 {
  width: 33.33%;
}
.width_25 {
  width: 25%;
}
.flex_wrap_row {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.gap_5,.gpa_5 {
  gap: 5px;
}
.gap_10,.gpa_10 {
  gap: 10px;
}
.gap_20,.gpa_20 {
  gap: 20px;
}
.gap_30,.gpa_30 {
  gap: 30px;
}

.pad_t_10 {
  padding: 10px 0px 0px;
}
.pad_t_20 {
  padding: 20px 0px 0px;
}
.pad_t_30 {
  padding: 30px 0px 0px;
}
.pad_tb_10 {
  padding: 10px 0px;
}
.pad_tb_20 {
  padding: 20px 0px;
}
.pad_tb_30 {
  padding: 30px 0px;
}

.pr_5 {
  padding-right: 5px;
}
.pr_10 {
  padding-right: 10px;
}
.pr_15 {
  padding-right: 15px;
}
.pr_20 {
  padding-right: 20px;
}
.pr_25 {
  padding-right: 25px;
}
.pr_30 {
  padding-right: 30px;
}

.border_b_none {
  border-bottom: 0px transparent none !important;
}
.border_t_none {
  border-top: 0px transparent none !important;
}
.border_r_none {
  border-right: 0px transparent none !important;
}
.border_l_none {
  border-left: 0px transparent none !important;
}

.d_flex {
  display: flex;
}
.flex_col {
  flex-direction: column;
}
.flex_row {
  flex-direction: row;
}
.dflex_justify_center {
  justify-content: center;
}
.dflex_justify_end {
  justify-content: flex-end;
}
.dflex_justify_strat {
  justify-content: flex-start;
}

.btn-danger:hover {
  color: #fff !important;
  background-color: #85000d !important;
  border-color: #85000d !important;
}

/* common css end */

/* login page common css start */
.block-padding{
  padding: 0 130px;
}
.section_common-padding{
  padding: 50px 0;
}
.mu_title-sm{
font-weight: 400;
font-size: 36px;
line-height: 1.3;
letter-spacing: 0.374px;
color: #333333;
/*text-shadow: 0px 4px 8px rgb(0 0 0 / 25%);*/
}
.mu_title-lg{
  font-weight: normal;
  font-size: 36px;
  letter-spacing: 0.374px;
  color: #000000;
  margin-bottom: 30px;
}

.navbar-light .navbar-toggler {
  color: rgba(0,0,0,.55);
  border:0 !important;
  
}
.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: none !important;
}
@font-face {
  font-family: 'Times New Roman';
  src: url('../fonts/times-new-roman-bold.ttf') format('ttf');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Times New Roman';
  src: url('../fonts/times-new-roman-bold.ttf-italic.ttf') format('ttf');
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: 'Times New Roman';
  src: url('../fonts/times-new-roman') format('ttf');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Times New Roman';
  src: url('../fonts/times-new-roman-italic.ttf') format('ttf');
  font-weight: normal;
  font-style: italic;
}


/* old Twitter icon change into new  for the Twitter "X" icon */
.fa.fa-twitter{
	font-family:sans-serif;
}
.fa.fa-twitter::before{
	content:"𝕏";
	/* font-size:1.2em; */
}

/* --------------  */

/* navbar css start */
.mc-header_block {
  background: #FFFFFF;
  box-shadow: 0px 6px 8px rgb(0 0 0 / 19%);
  z-index: 999;
  position: relative;
}
.mc-header_navbar{
  padding: 0px 119px 0px;
}
.mc-header_navbar .nav-item .nav-link, .mc-header_navbar .nav-item .nav-link.active{
  color: #1D1D1D;
}
.mc-header_navbar .nav-item .nav-link{
  padding: 7px 20px;
}
.mc-header_navbar .navbar-brand{
  margin-right: 7px;
  padding: 8px 0 5px;
}
.mc-header_navbar .navbar-brand + .navbar-brand{
  margin-right: 0;
}

.mc-header_navbar .btn.account-btn {
  background: #B80A17;
  box-shadow: -4px -4px 8px rgba(0, 0, 0, 0.1), 4px 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  line-height: 33px;
  height: 33px;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  width: auto;
  margin: 0;
  display: inline-block;
  text-align: center;
  border: 0;
  padding: 0 15px;
}
.mc-header_navbar .nav-item .nav-link.ar{
  font-family: 'Times New Roman';
  font-weight: normal;
  /*font-family: 'Amiri', serif;*/
  /*font-family: 'Tajawal', sans-serif;*/
  direction: rtl;
}
.fixed#header{
	width:100%;
	position:fixed;
	top:0;
	left:0;
	background:#FFF;
	/* line-height:60px; */
	border-top:4px solid #B80A17;
  transition:all 0.7s ease 0s;
  -webkit-transition:all 0.7s ease 0s;
	z-index:100;
}
/* navbar css end */


/* category image hover effect css start */
/*.mu-subjects_box.hover:hover .mu-subject_img{
  position: relative;
  right: -10px;
  transform: scaleX(1.1);
  -webkit-transform: scaleX(1.1);
}
.mu-subjects_box.hover-top:hover .mu-subject_img{
  position: relative;
  top: -10px;
  transform: scaleY(1.1);
  -webkit-transform: scaleY(1.1);
}*/

/* category image hover effect css end */

/*css header my account*/
.myaccnt_textheaderr{color: #1D1D1D; font-size: 16px; font-weight: 400; text-decoration: none; }
.myaccnt_textheaderr:hover{color: #000;}
.myaccnt_icnheader a img{ margin:-7px 0 0 0;; display: inline-block; height: 19px;}
.myaccnt_icnheader a img:hover{ opacity: 0.7;}
.myaccnt_textheaderr{color: #1D1D1D; font-size: 16px; font-weight: 400; text-decoration: none; position: relative; }
.myaccnt_textheaderr:hover{color: #B80A17;}
/*css header my account*/
/* #################### Start my account student popup ########################### */
.studentpopup_inerboxbl{ background: #FFFFFF; border: 1px solid #F0F0F0; box-sizing: border-box; border-radius: 20px; padding: 20px 20px;} 
.myaccount_popupcont h2{ font-size:18px; line-height: 19px; color:#1D1D1D; font-weight: 500; padding: 0 0 10px 0; margin: 0; }
.myaccount_popupcont h2 span{ color:#B80A17; font-size: 16px; font-weight: 400; display: block; padding: 8px 0 0 0;}
.studentpopup_inerboxbl p{ padding: 0; margin: 0; line-height: 18px; color: #1D1D1D;}
.prevbox_rightbtn{ text-align: right;}
.prevbox_rightbtn p{ font-size: 10px; line-height: 12px; color: #1D1D1D; margin: 0; padding: 0;}
.divider{border: 1px solid rgba(255, 255, 255, 0.5); box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15); margin: 20px 0 10px 0; }
/* #################### ENDS my account student popup ########################### */

/* Footer css start */

footer{
  background: #FFFFFF;
  padding: 50px 0 20px 0;
  z-index: 99;
  position: relative;
}
footer#wc-footer {
  padding:0px !important;;
}
.mu_app-link .app-store_img img{ width:102px; height:30px;}
.mu_app-link{
  margin: 0;
  padding: 0 0 68px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #CDD1D4;
}
.mu_app-link li{
  list-style-type: none;
}
.mu_app-link li:first-child{
  margin-right: 18px;
}
.mu_app-link li a.app-store_img {
  margin: 0 3px;
}
.mu_footer-menu, .mu_footer-socialMedia{
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.mu_footer-menu li, .mu_footer-socialMedia li{
  list-style-type: none;
}
.mu_footer-menu li .footer-menu_link{
  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 16px;
  color: #1D1D1D;
  padding: 20px;
  display: block;
}
.mu_footer-socialMedia .footer-social_link{
  color: #1D1D1D;
  font-size: 18px;
  margin: 0 15px;
}

.copyrighttext{ color:#939EA4; font-size:14px; font-weight: 500; display: block; text-align: center; padding: 10px 0 0 0; margin: 0;}
/* Footer css end */
/* Start style added 18-8-21*/
.mc-header_navbar .top_headerleft .nav-item .nav-link { padding: 2px 0 2px 26px; }
/* End style added 18-8-21*/

/* Start style added 3-09-21*/
.mc-header_navbar .top_headerright .nav-item .nav-link { padding: 2px 24px 2px 0; position: relative; }
.mc-header_navbar .top_headerright .nav-item{position: relative;}
.notiheader_hover:hover .notification_mainwrp{ display: block;}
.header_myacnt_wrp{ position: relative;
  display: flex;
  align-items: center;
}
/* --- on hover, user window close */
/* .header_myacnt_wrp:hover .myaccount_popupcont{ display: block;} */
/* --- on hover, user window close */
.header_myacnt_wrp .myaccount_popupcont > a {
  padding: 2px 5px;
}
.blogShare_social_media {
  /* padding: 0 5px; */
  margin: 0 5px;
}
/* End style added 3-09-21*/

/* ----   Blog section --- */
.blog_meta_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.blog_meta_right {
  display: flex;
  align-items: center;
  gap: 15px;
}
/* ----   Blog section --- */

/* #################### Starts my account maestro popup ########################### */
.myaccount_popupcont{ position:absolute; 
  /* top: 50px ;  */
  top: 35px ; 
  /* width:300px;  */
  width:310px; 
  right:-18px; background: #FFFFFF; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.25); border-radius: 0px 0px 20px 20px; 
  padding:20px 14px; 
  display: none; z-index: 999; }
.myaccount_popupcont_topcont{ display: flex; flex-wrap: wrap; }
.myaccount_popupcont_topcont:after{ border: 1px solid #FFFFFF; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15); content: ""; margin: 10px 0 10px 0; width: 100%;}
.myaccount_popupcont_topcontimg{ width: 60px; height:60px; border-radius:100%; margin-right: 10px; }
.myaccount_popupcont_rightcont{ width:calc(100% - 70px); }
.myaccount_popupcont_rightcont h3{ font-size:18px; line-height: 19px; color:#1D1D1D; font-weight: 400; padding: 0 0 0 0; margin: 0; }
.startRating_cont_account i.grey{ color: #BDBDBD;}
.startRating_cont_account{ padding: 0 0 0 0; }
.startRating_cont_account i { color: #B80A17; }
.referal_contaccount { font-size: 14px; color: #000000; padding: 0 0 0 0; text-align: left; }
.referal_contaccount span { font-weight: 400; font-size: 14px; line-height: 15px; color: #000; display: inline-block; padding-right: 0; vertical-align: top; }
.referal_contaccount a{ display: inline-block !important; vertical-align: top !important;}
.referal_contaccount  a svg{ width:12px !important; 
  /* margin: -7px 0 0 0; */
  margin: -7px 5px 0 5px;
}

.myaccount_popupcont .myaccount_popupcont_inner {
  height: 0;
  overflow: hidden;


  -webkit-transition: height 1s; 
  -moz-transition: height 1s; 
  -ms-transition: height 1s; 
  -o-transition: height 1s; 
  transition: height 1s;  

  animation: fadeInAnimation ease 2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;

}

.myaccount_popupcont.d-block .myaccount_popupcont_inner {
  height: auto;

  -webkit-transition: height 1s; 
  -moz-transition: height 1s; 
  -ms-transition: height 1s; 
  -o-transition: height 1s; 
  transition: height 1s; 

  animation: fadeInAnimation ease 2s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;

}


@keyframes fadeInAnimation {
  0% {
      opacity: 0;
  }

  100% {
      opacity: 1;
  }
}


/* ====================   text fadein css -- start ===========     */


/*=== Basic box styling  ===*/

/*=== Trigger  ===*/
.animate {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

  
/*=== Optional Delays, change values here  ===*/
.one {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
animation-delay: 0.5s;
}

.two {
-webkit-animation-delay: 1.5s;
-moz-animation-delay: 1.5s;
animation-delay: 1.5s;
}

.three {
-webkit-animation-delay: 2.5s;
-moz-animation-delay: 2.5s;
animation-delay: 2.5s;
}

.four {
-webkit-animation-delay: 3.5s;
-moz-animation-delay: 3.5s;
animation-delay: 3.5s;
}

.five {
-webkit-animation-delay: 4.5s;
-moz-animation-delay: 4.5s;
animation-delay: 4.5s;
}

.six {
-webkit-animation-delay: 5.5s;
-moz-animation-delay: 5.5s;
animation-delay: 5.5s;
}

.seven {
-webkit-animation-delay: 6.5s;
-moz-animation-delay: 6.5s;
animation-delay: 6.5s;
}

.eight {
-webkit-animation-delay: 7.5s;
-moz-animation-delay: 7.5s;
animation-delay: 7.5s;
}



/*=== Animations start here  ===*/

/*==== FADE IN UP ===*/
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}


/*=== FADE IN DOWN ===*/
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
 }
@-webkit-keyframes fadeInDown {
0% {
	opacity: 0;
	-webkit-transform: translate3d(0, -100%, 0);
	transform: translate3d(0, -100%, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
}
@keyframes fadeInDown {
0% {
	opacity: 0;
	-webkit-transform: translate3d(0, -100%, 0);
	transform: translate3d(0, -100%, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
} 

/*=== FADE IN LEFT ===*/
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}


/*==== FADE IN RIGHT ===*/
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

/*=== FADE IN  ===*/
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
.fadeIn {
    -webkit-animation-name: fadeIn;
	animation-name: fadeIn;
}

/*=== FADE IN UP Big ===*/
.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
  }
@-webkit-keyframes fadeInUpBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(0, 2000px, 0);
	transform: translate3d(0, 2000px, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
	}
}
@keyframes fadeInUpBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(0, 2000px, 0);
	transform: translate3d(0, 2000px, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
	}
} 

/*=== FADE IN DOWN Big ===*/
.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInDownBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(0, -2000px, 0);
	transform: translate3d(0, -2000px, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
}
@keyframes fadeInDownBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(0, -2000px, 0);
	transform: translate3d(0, -2000px, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
} 

/*=== FADE IN LEFT Big ===*/
.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInLeftBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(-2000px, 0, 0);
	transform: translate3d(-2000px, 0, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
}
@keyframes fadeInLeftBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(-2000px, 0, 0);
	transform: translate3d(-2000px, 0, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
} 

/*=== FADE IN RIGHT Big ===*/
.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
  }
@-webkit-keyframes fadeInRightBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(2000px, 0, 0);
	transform: translate3d(2000px, 0, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
}
@keyframes fadeInRightBig {
0% {
	opacity: 0;
	-webkit-transform: translate3d(2000px, 0, 0);
	transform: translate3d(2000px, 0, 0);
}
100% {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}
}

/* Demo Purpose Only*/
/* Demo Purpose Only*/
.demo {
  font-family: 'Raleway', sans-serif;
	color:#fff;
    display: block;
    margin: 0 auto;
    padding: 15px 0;
    text-align: center;
}
.demo a{
  font-family: 'Raleway', sans-serif;
color: #2ecc71;		
}

/* ====================   text fadein css -- end ===========     */


.myaccount_popupcont a{ color:  #1D1D1D; display: block; padding-bottom: 10px; text-align: left;}
.logoutbtn_myaccnt { background: #FFFFFF; 
  width: 100%; 
  border: 1px solid #B80A17; box-sizing: border-box; border-radius: 4px; margin: 0 0 0; display: block; font-size: 16px; font-weight: 400; color: #B80A17; line-height: 40px; }
.logoutbtn_myaccnt:hover { 
  color: #ffffff; 
  background: #B80A17; 
  /* background: #8d0812; */
  /* border: 1px solid #8d0812; */
}
/* #################### ENDS my account maestro popup ########################### */  
/* #################### Starts notifications student website  ######################### */
.notification_mainwrp{ background: #F0F0F0; box-shadow: -4px -4px 8px rgba(0, 0, 0, 0.1), 4px 4px 8px rgba(0, 0, 0, 0.1); border-radius: 20px; padding: 20px 10px 2px; width:350px;  left:auto !important;right:-18px !important ; top:52px !important; transform: none !important; overflow-y:auto; -webkit-overflow-scrollbar :touch; height:300px; scrollbar-width: thin; }
.notification_mainwrp::-webkit-scrollbar-track { background-color:#f0f0f0; }

.notification_mainwrp::-webkit-scrollbar-thumb { background-color: #cdcdcd; border-radius:6px; }
.notification_mainwrp::-webkit-scrollbar { width: 10px; }
.notification_innerbox{background: #FFFFFF; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); border-radius: 20px; margin-bottom: 15px; position: relative; padding: 15px 12px;}  
.notification_innerbox h4{ color:#B80A17; font-size: 16px; font-weight: 500; padding: 0 50px 3px 0;
  word-wrap: break-word;
}
.notification_innerbox p{ margin: 0; padding: 0 20px 10px 0; line-height: 1.5;
  word-wrap: break-word;
}
.notification_rightsmalltext{ font-size: 10px; text-align: right; line-height: 14px;  }
.notification_del{ position: absolute; right:8px; top:10px;}
.notification_del button{ border: none; background: transparent;}
.notification_del button:focus, .notification_del button:hover{border: none; box-shadow: none;}
/* #################### ENDS notifications student website  ######################### */

/* #################### Starts booking section for maestro and student  ######################### */


/*booking section slot*/
.bookingslot_mainwrp{ display: flex; flex-wrap: wrap; width: 100%; }
.bookingslot_mainwrp .left_bookingslot_wrap{ width:63px;}
.left_bookingslot_wrap .dayTimeBadge_dayBadge{ 
  height: 48px;
  display: flex;
  align-items: baseline;
}

.bookingslot_mainwrp .right_bookingslot_wrap{ width:calc(100% - 63px); }
.rightbooking_inerwrap{  height: 47px !important; white-space: nowrap;}
.rightbooking_inerwrap ul{ /*width: 1000px;*/}
.right_booking_wrpslide{ overflow:hidden; position: relative; z-index: 0;
  padding: 2px 2px 2px 5px;
}
.rightbooking_inerwrap .ulTabTag_sec{ white-space: normal;}
.rightbooking_inerwrap .ulTabTag_sec > li {
  list-style: none;
  display: inline-block;
  width: auto;
}
.rightbooking_inerwrap .ulBadgeTime li:last-child .badgeTime_popUi_bg{ right:0; left:auto;}
/*For handling incase there is one child in the container*/
.rightbooking_inerwrap .ulBadgeTime li:first-child .badgeTime_popUi_bg{ right:0; left:0 !important;}
.rightbooking_inerwrap:nth-child(7) .ulBadgeTime li .badgeTime_popUi_bg{ top:-43px}
/*booking section slot*/
/* session day time badge section start */
.dayTimeBadge_row {
  display: flex;
  margin: 0 0 2px 0;
  /* padding: 7px 10px 0; */
  padding: 0 0;
  display: 47px !important;
}/*added 18-8-21*/
.dayTimeBadge_row_active{background: radial-gradient(64.97% 5442.37% at 42.06% 100%, #F0F0F0 0%, rgba(255, 255, 255, 0) 100%);}/*added 18-8-21*/
.dayTimeBadge_left {
  display: inline-block;
  width: 60px;
}
.dayTimeBadge_right {
  display: inline-block;
  width: calc(100% - 65px); overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: thin;
  border-radius:6px
}
.dayTimeBadge_right::-webkit-scrollbar-track { background-color:#f0f0f0; }
.dayTimeBadge_right::-webkit-scrollbar-thumb { background-color: #cdcdcd; border-radius:6px; }
.dayTimeBadge_right::-webkit-scrollbar { width: 5px; height: 5px; }
.dayTimeBadge_dayBadge > span,
.dayTimeBadge_dayBadge > sup {
  color: #000000; 
}

.dayTimeBadge_dayBadge.dayActive > span,
 .dayTimeBadge_dayBadge.dayActive > span.badgeDay {
  color: #B80A17;
  font-weight:700;
  font-size:18px;
  text-align: left;
}
.dayTimeBadge_dayBadge.dayActive > sup, .dayTimeBadge_dayBadge.dayActive > sup.badgeDate {
  color: #B80A17;
  font-weight:500;
  font-size:10px;
}
.dayTimeBadge_dayBadge span.badgeDay {
  font-weight: normal;
  font-size: 16px;
  line-height: 1.5;
  padding: 5px 0 5px 0px;
  text-align: left;
  /* color: #000000; */
}
.dayTimeBadge_dayBadge sup.badgeDate {
  font-weight: normal;
  font-size: 10px;
  line-height: 10px; vertical-align: super;
  /* color: #000000; */

}
ul.ulBadgeTime {
  /* overflow: hidden; */
}
ul.ulBadgeTime > li {
  list-style: none;
  display: inline-block;
  width: auto;
  margin: 0 8px 8px 0;
}
.liBadgeTime_boxBg {
  position: relative;
  /*box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 4px;*/
  background: #fff;
}
.badge.badgeTime {
  border: 2px solid #FFFFFF;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  background: #fff;
  width:62px;
  height:32px;
  line-height: 29px;
  flex: none;
  order: 0;
  flex-grow: 0;
  /* margin: 0px 8px; */

  font-weight: normal;
  font-size: 16px;
  line-height: 19px;
  color: #000000;
}
.liBadgeTime_boxBg.active .badge.badgeTime, .liBadgeTime_boxBg:hover .badge.badgeTime {
  border: 2px solid #B80A17;
  color: #B80A17; cursor: pointer;
}
/* Added for disabling hover effect when inactive */
.liBadgeTime_boxBg.in_active:hover .badge.badgeTime {
  border: 2px solid #FFFFFF;
  color: #000000;
}
.liBadgeTime_boxBg.in_active .badge.badgeTime {
  opacity: 0.3;
  pointer-events: none;
}
.liBadgeTime_boxBg:hover .badgeTime_popUi_bg.badgeTime_dropdown.maestroCard_smallTagTAb {
  display: block;
  opacity: 1;
   z-index: 1;
}
.liBadgeTime_boxBg.in_active:hover .badgeTime_popUi_bg.badgeTime_dropdown.maestroCard_smallTagTAb {
  display: none;
  opacity: 1;
   z-index: 1;
}/* added 18-8-21*/
.badgeTime_popUi_bg.badgeTime_dropdown.maestroCard_smallTagTAb { 
  position: absolute;
  display: none;
  /* min-width: 180px; */
  width: 160px;
  min-height: auto;
  overflow: visible;
  background: #F0F0F0;
  box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  max-width: 140px;
  padding: 10px 10px;
  z-index: 999;
  overflow: visible; visibility: visible; clear:both;
  left:0;
  top:33px;
}

.badgeTime_popUi_bg.badgeTime_dropdown.maestroCard_smallTagTAb.show {
  z-index: 1;
  display: block;
  top: 100%;
  margin: 5px 0 0 10px;
}

.badgeTime_popUi_bg.maestroCard_smallTagTAb.dropdown-menu.show {
    /* background: #F0F0F0; */
    /* background: #dddddd;
    box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    max-width: 140px;
    padding: 10px 10px; */
}

.badgeTime_popUi_bg > ul {
  
}
/* session day time badge section end */
.dayTimeBadge_secBg_bottomText {
  text-align: right;
}
.dayTimeBadge_secBg_bottomText span {
  font-style: normal;
  font-weight: normal;
  font-size: 10px;
  line-height: 12px;
  color: #1D1D1D;
}
.dayTimeBadge_secBg_bottomBookBtn {
  text-align: center;
}
.dayTimeBadge_secBg_bottomBookBtn button.sessionBookBtn {
  width: 248px;
  height: 48px;
  padding: 10px 20px;
  box-shadow: -4px -4px 8px rgba(0, 0, 0, 0.1), 4px 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  color: #F7F8F9;
  background: #B80A17;

  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.dayTimeBadge_secBg_bottomBookBtn button.sessionBookBtn:hover,
.dayTimeBadge_secBg_bottomBookBtn button.sessionBookBtn:focus,
.dayTimeBadge_secBg_bottomBookBtn button.sessionBookBtn:active {
  background: #8d0812;

  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}/* changed 18-8-21*/
.maestro_gaparrowwrap{ margin: 7px 0 10px;}/*changed 20-8-21 */
.maestroscbooking_arrowc{ display: flex;
  justify-content: center;}

/* #################### ENDS booking section for maestro and student  ######################### */

@media (min-width:992px){
.mc-header_navbar .btn.account-btn{ display: inline-block !important;}

.mc-header_navbar .navbar-collapse.collapse {
  display: flex !important;
}

.myaccnt_textheaderr{
  /* display: inline-block !important;  */
  display: flex !important; 
  padding: 0px 0; line-height: 52px;
  margin-top: 4px;
  padding: 2px 24px 2px 0;
 }

 body.ar  .myaccnt_textheaderr{
  padding: 0px 0px 0px 0px;
 }

header .d-lg-flex{ align-items: center;}
header .navbar-nav{align-items: center;}
header .navbar-expand-lg{ align-content: center; align-items: center;}
.mc-header_block .top_headerright{ line-height: 52px;}

}
@media (max-width:991px){
.mc-header_navbar .myaccnt_icnheader .nav-item .nav-link{ padding:0 12px}
}
@media (max-width:767px){
/*header my account css*/
.myaccnt_icnheader a{ padding:0 2px !important;}

/*header my account css*/
/*homepage header*/
.mc-header_navbar .btn.account-btn { line-height: 30px; height: 30px; font-size: 14px; padding: 0 12px;}
.mc-header_navbar .nav-item .nav-link, .mc-header_navbar .mc-header_navbar-nav_right .nav-item .nav-link { padding: 6px 12px;}

}
/*FOR ZOOM*/
#zmmtg-root {
  display: none;
}
.mu_subscription-link .subscription_buy-btn {
  background: #FFFFFF;
  border: 2px solid #B80A17;
  color: #B80A17;
  font-size: 16px;
  font-weight: 500;
  box-sizing: border-box;
  box-shadow: 4px 4px 8px rgb(0 0 0 / 10%);
  border-radius: 6px;
  height: 38px;
  line-height: 35px;
  padding: 0 15px;
  /* position: absolute; */
  bottom: 20px;
  right: 20px;
  transition: all 0.2s ease-in-out 0s;
}
.mu_subscription-link .subscription_buy-btn:hover, .mu_subscription-link .subscription_buy-btn:focus{ transform: none; background: #8d0812; color: #ffffff;  border:2px solid #8d0812;}
.open ul.security-option-menu__pop-menu {
  display:block;
}
.open ul.more-button__pop-menu {
  display: block;
}
.open ul.dropdown-menu {
  display: block;
}

.remove_btn {
  margin: 5px 0 8px;
}

/* #################### For Arabic website (common CSS) -- start  ######################### */

body.ar .mc-header_navbar .top_headerright .nav-item .nav-link {
  padding: 2px 0px 2px 24px;
}


/* #################### For Arabic website (common CSS) -- end  ######################### */