a {color: #01aef4}
a:hover {color: #e61465}

.loginPage {
  background: url(../images/login-page.jpg) no-repeat top center;
  background-size: cover
}
.loginPage .avatar-xl {
  width: 5rem;
  height: 5rem
}
.loginPage .profile-user-wid {
  margin-top: -43px;
}
.dashIconFont {
  font-size: 22px
}
.dashIconFont a {
  color: #fff
}
.tableList .progress {
  font-size: .8125rem !important
}
.tableList .avatar-sm {
  width: 3.5rem;
  height: 3.5rem
}
table td {
  vertical-align: middle !important
}
.odd .progress {
  background-color: #fff !important
}
.navbar-brand-box {
  background: #2d444e !important
}
#sidebar-menu ul li a i, #sidebar-menu ul li a svg {
  color: #6a7187;
  margin-right: 10px;
  font-size: 18px
}
#sidebar-menu ul li ul.sub-menu li a {
  padding-right: 4rem !important
}
.table-responsive {
  overflow-x: visible !important;
}
.media .avatar-md {
  margin-right: 20px
}
.select2-container {
  width: 100% !important;
  padding: 0;
}
/*************badges Color Codes******************/


.badge-soft-1 {
  color: #556ee6;
  background-color: rgba(85, 110, 230, .18)
}
.badge-soft-1[href]:focus, .badge-soft-1[href]:hover {
  color: #556ee6;
  text-decoration: none;
  background-color: rgba(85, 110, 230, .4)
}

.modal{ z-index: 1051 !important}

.badge-soft-2 {
  color: #34c38f;
  background-color: rgba(52, 195, 143, .18)
}
.badge-soft-2[href]:focus, .badge-soft-2[href]:hover {
  color: #34c38f;
  text-decoration: none;
  background-color: rgba(52, 195, 143, .4)
}

.badge-soft-3 {
  color: #50a5f1;
  background-color: rgba(80, 165, 241, .18)
}
.badge-soft-3[href]:focus, .badge-soft-3[href]:hover {
  color: #50a5f1;
  text-decoration: none;
  background-color: rgba(80, 165, 241, .4)
}

.badge-soft-4 {
  color: #be882c;
  background-color: rgba(241, 180, 76, .18)
}
.badge-soft-4[href]:focus, .badge-soft-4[href]:hover {
  color: #be882c;
  text-decoration: none;
  background-color: rgba(241, 180, 76, .4)
}

.badge-soft-5 {
  color: #f46a6a;
  background-color: rgba(244, 106, 106, .18)
}
.badge-soft-5[href]:focus, .badge-soft-5[href]:hover {
  color: #f46a6a;
  text-decoration: none;
  background-color: rgba(244, 106, 106, .4)
}



.badge-soft-0 {
  color: #343a40;
  background-color: rgba(52, 58, 64, .18)
}
.badge-soft-0[href]:focus, .badge-soft-0[href]:hover {
  color: #343a40;
  text-decoration: none;
  background-color: rgba(52, 58, 64, .4)
}

.white{color: #fff}
/*************badges Color Codes******************/





#materials .form-switch-md { padding-left: 0 !important}

#materials .form-switch-md svg{ margin-right: 15px }
#materials .form-switch-md .collapsed svg{ transform: rotate(180deg); }

.lessonsContainer  svg{ margin-right: 10px }

#materials .form-switch-md a.triggerAcc{ display: block; margin-right: 40px }

.rel{ position: relative}
#materials .editButton {position: absolute; right: 0; }
#materials .editButton svg { margin-right: 0 !important}

#materials .addButton{position: absolute; right: 20px; }

 
.lessonsContainer div{padding-left: 40px; font-weight: 400; padding-top: 10px}
.lessonsContainer div a{ color: #495057;margin-top: 10px;  margin-bottom: 10px; display: block}
.lessonsContainer div a:hover{ color: #4458b8}


.hide{ display: none}

.uppercase{ text-transform: uppercase}
.lowercase{ text-transform: lowercase}
.capitalize{ text-transform:  capitalize}

.active-0{ text-decoration: line-through !important}


.fakeinfo{z-index: 999; position: relative; display: inline-block; font-weight: bold;  border: 1px solid #01aef4; border-radius: 50%; width: 15px;
height: 15px;
line-height: 15px;
text-align: center;
font-size: 10px;}



.txt-wrapper{
	 padding-left: 20px; border-left: 10px solid #01aef4
}
.mb-5 { margin-bottom: 50px}
.mb-6 { margin-bottom: 60px}


.sage-red-speech .tcards_message:before {
    border-color: #f5f5f5 transparent transparent #f5f5f5 !important;
}

.event-list{ border-bottom: 1px solid #eef2f8}

.verti-timeline .event-list {
    padding: 20px 0 20px 30px !important; 
}

.verti-timeline .event-list .event-timeline-dot { top: 21px !important}

.notifcation { font-size: 22px; border-bottom: 1px solid #eef2f8; padding-bottom: 20px; margin-bottom: 20px}
.chevList ul{ text-indent: 0; padding-left: 0; margin-left: 0}
.chevList li{ border-bottom: 1px solid #eff2f7; text-indent: 0; list-style-type: none; font-size: 14px; padding-top: 10px; 
	padding-bottom: 10px;

	padding-left: 30px;
	position: relative
}



.chevList li:before{
		content: "\f00c";
	font-family: "Font Awesome 5 Pro";
	color: #e61465 ;
	position: absolute;
	left: 0px;
}

.chevList li:first-child{
	padding-top: 0
}


.selectAvatar li{ float: left; width: 25%; text-indent: 0; list-style-type: none; padding: 20px; box-sizing: border-box}

.selectAvatar .img-thumbnail:hover{border: 1px solid #495057;}

.selectedAvatar { position: absolute; left: 140px; top: 0 }
.selectedAvatar img { float: left; max-width: 75px}

.avatarIcon {position: relative}
.avatarIcon span.camIcon  { 
	position: absolute;
	font-size: 16px;
	color: #fff; 
	border-radius:  50%;
	width: 30px;
	height: 30px;
	top: 52px;
	left: 52px;
align-items: center;
background-color: #556ee6;
display: flex;
font-weight: 500;
justify-content: center;
	z-index: 500

}



/*************PRINT STYLE******************/
body{
-webkit-print-color-adjust:exact;
}

@media print {
body{
color-adjust: exact;
background: #fff !important;
-webkit-print-color-adjust: exact !important;
/* change the margins as you want them to be. */
} 
}

.printableArea	{width: 780px; margin: 0 auto; padding-bottom: 60px}
.printableArea img, 	.printableArea table{width: 100%}
.printableArea .title{ padding: 20px;  border: 1px solid #1f2332;  background-color: #f7f8f9; border-bottom: 1px solid #dfe6ef}
.avatarHeader{ padding: 20px; border: 1px solid #1f2332; border-top: 0; background-color: #fff }

.lessonTitle{ margin-top: 40px; background-color: #e61465; padding: 20px; }
.lessonTitle h4{color: #fff}

.lessonBody{ border: 1px solid #dfe6ef; border-top: 0; border-bottom: 0}
.lessonItemTitle, .lessonDesc{ padding: 20px; box-sizing: border-box}

.lessonRow { display: table; width: 100%}
.lessonRow:after {
clear: both;
content: "";
display: table;
line-height: 0;
}

.lessonItemTitle { width: 30%; border-right: 1px solid #dfe6ef;  display: table-cell; font-weight: 500;}
.lessonDesc{ width: 70%;  display: table-cell}

.lessonBody .lessonRow:nth-child(even){ background-color:  #f7f8f9 }
.lessonBody .lessonRow:nth-child(odd){ background-color:  #fff }
.lessonRow {border-bottom: 1px solid #dfe6ef;}
/*************PRINT STYLE******************/


.accordion-button{
	font-size: 18px !important
}




ul#number-list-item { border-top: 1px solid #eef2f6; padding-top: 40px }

#number-list-item span {
  height: 50px;
  width: 50px;
	line-height: 50px;
	
  display: block;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  -webkit-transition: all .4s;
  transition: all .4s;
  margin: 0 auto;
	font-weight: bold;
}

#number-list-item span.squareList {
border-radius: 50%;
line-height: 13px;
height: 85px;
width: 85px;
box-sizing: border-box;
padding-top: 28px;
font-size: 20px;
font-weight: 400;
}

#number-list-item span.squareList small {
	font-size: 10px;
	font-weight: 800;
}


#number-list-item li:not(:last-child) {
  margin-right: 1.5rem;
}

.bg-red, .r-0, .r-1, .r-2, .r-3, .r-4, .r-5, .r-6, .r-7, .r-8, .rc-0{ background-color: #ed1164}
.bg-orange, .r-9, .r-10, .r-11, .r-12, .r-13, .r-14, .r-15, .r-16, .rc-1{ background-color: #ed8d10}
.bg-yellow, .r-17, .r-18, .r-19, .r-20, .r-21, .r-22, .r-23, .r-24, .rc-2{ background-color: #ffc60b}
.bg-green, .r-25, .r-26, .r-27, .r-28, .r-29, .r-30, .r-31, .rc-3{ background-color: #b2d235}
.bg-blue, .r-32, .rc-4{ background-color: #00aeef}




.green{ color: #b2d235}
.purble{ color: #602d91}
.pink, .red{ color: #ed1164}
.orange{ color: #f15a22}
.blue{ color: #00aeef}
.yellow{ color: #ffc60b}


.apexcharts-inner{ border-top:5px solid #00aeef !important}


.preloader{ height: 100%; left: -100%; width: 100%;  background-color: #fff; z-index: 99999; position: fixed; top: 0;  text-align: center;  }

.preloader p { display: block; width: 100%  }