@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: 'Icons';
  src: url('../Fonts/fa-brands.eot');
  src: url('../Fonts/fa-brands.eot') format('embedded-opentype'), url('../Fonts/fa-brands.woff2') format('woff2'), url('../Fonts/fa-brands.woff') format('woff'), url('../Fonts/fa-brands.ttf') format('truetype'), url('../Fonts/fa-brands.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Icons3';
  src: url('../Fonts/fa-solid-900.eot');
  src: url('../Fonts/fa-solid-900.eot') format('embedded-opentype'), url('../Fonts/fa-solid-900.woff2') format('woff2'), url('../Fonts/fa-solid-900.woff') format('woff'), url('../Fonts/fa-solid-900.ttf') format('truetype'), url('../Fonts/fa-solid-900.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Icons2';
  src: url('../Fonts/fa-regular.eot');
  src: url('../Fonts/fa-regular.eot') format('embedded-opentype'), url('../Fonts/fa-regular.woff2') format('woff2'), url('../Fonts/fa-regular.woff') format('woff'), url('../Fonts/fa-regular.ttf') format('truetype'), url('../Fonts/fa-regular.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Icons4';
  src: url('../Fonts/fa-light-300.eot');
  src: url('../Fonts/fa-light-300.eot') format('embedded-opentype'), url('../Fonts/fa-light-300.woff2') format('woff2'), url('../Fonts/fa-light-300.woff') format('woff'), url('../Fonts/fa-light-300.ttf') format('truetype'), url('../Fonts/ffa-light-300.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

*
{
	margin:0px;
	padding:0px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html { font-size:  16px; }

:root {
	--primary-color: #16473a;
	--color2: #feb100;
  	--body-fonts: 'Almarai', sans-serif !important;
	--xs-font: .50rem;
	--s-font: .75rem;
	--m-font: 1rem;
	--l-font:1.25rem;
	--xl-font:1.50rem;
	--yellow:#EAC31D;
	--baby-blue:#4bc0ad;
	--white:#fff;
	--green:#40C16B;
	--black:#000;
	--baby-red:#FBF4F4;
	--baby-blue2:#F5FAFF;
	--baby-yellow:#fffCF1;
	--baby-grey:#f1f1f1;
	--baby-grey2:#f7f7f7;
	--grey3:#707070;
	--grey4:#5B5B5B;
	--grey5:#fafafa;
	--grey6:#f9f9f9;

}

body
{
	left: 0;
	  margin: 0;
	  top:0px;
	  position: relative;
	width:100%;
	font-weight:normal;
	direction:rtl;
	font-family: var(--body-fonts);
	 -webkit-font-feature-settings: 'lnum';
    font-feature-settings: 'lnum';
    font-variant-numeric: lining-nums;
    -webkit-font-smoothing: antialiased;
    box-sizing: inherit;
    text-rendering: optimizelegibility;
	font-size:  16px;
}
img
{
	border:0px;
	display:block;
}
ul
{
	list-style:none;
}
a
{
	text-decoration:none;
	display: block;
}
h1,h2,h3,h4,h5,h6
{
	line-height:normal;
	font-weight:normal;
	font-family: var(--body-fonts);
}
textarea,
input[type="text"],
input[type="password"],
input[type="button"],
select,
input[type="submit"] {
     -webkit-appearance: none;
	 -moz-appearance: none;
    appearance: none;
	 box-shadow: none;
	font-family: var(--body-fonts);
	outline: none;
}
p
{
	font-family: var(--body-fonts);
}
alt
{
	color:#F4F7FC;
	font-size:18px;
}
#toTop
{
    display:none;
	text-decoration:none;
	position:fixed;
	bottom: 17px;
    right: 17px;
    overflow: hidden;
    width: 50px;
	padding: 0px 5px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    border: none;
    background: var(--baby-blue);
    z-index: 9;
    color: var(--white);
    font-weight: 100;
	font-weight: 400;
	font-size: 14px;
	border-radius:100%;
	opacity: 0.7;
}
#toTop:before
{
	content: "\f077";
    font-family: 'Icons2';
    font-size: 12px;

}
.clear
{
	clear:both;
}
.center
{
	width: 1200px;
	margin: 0px auto;
}
.flex
{
	display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
	flex-wrap: wrap;
}
.center-flex
{
	-webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
	align-items: center;
}
.justify-between
{
    justify-content: space-between;
}
.justify-start
{
    justify-content: flex-start;
}
.justify-end
{
    justify-content: flex-end;
}
.justify-center
{
	justify-content: center;

}
.justify-dirction
{
	flex-direction: column;
}
.xs-font
{
	font-size: var(--xs-font);
}
.s-font
{
	font-size: var(--s-font)
}
.m-font
{
	font-size: var(--m-font);
}
.l-font
{
	font-size:var(--l-font);
}
.xl-font
{
	font-size:var(--xl-font);
}
.raduis
{
	border-radius: 50px;
}
.m-pading
{
	padding: 10px 14px;
}
.color-red
{
	color: var(--primary-color);
}
.color-blue
{
	color: var(--primary-color);
}
.color-yellow
{
	color: var(--yellow);
}
.color-green
{
	color: var(--green);
}
.color-white
{
	color: var(--white);
}
.color-black
{
	color: var(--black);
}
.bg-red
{
	background-color: var(--color2);
}
.bg-blue
{
	background-color: var(--primary-color);
}
.bg-yellow
{
	background-color: var(--yellow);;
}
.section-white
{
	padding: 30px 0px;
	background-color: var(--white);;
}
.section-grey
{
	padding: 50px 0px;
	background-color: #f5f5f5;
}
.section-blue
{
	padding: 30px 0px;
	background-color: var(--primary-color);
}
.time
{
	-webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.weight-500
{
	font-weight: 500;
}
.weight-700
{
	font-weight: 700;
}
.weight-800
{
	font-weight: 800;
}
.weight-900
{
	font-weight: 900;
}
.home
{
/*	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;*/
	background-color: transparent;
}
.header {
    /*-webkit-box-shadow: 0px 4px 10px -2px rgb(0 0 0 / 6%);
    -moz-box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.06);
    box-shadow: 0px 4px 10px -2px rgb(0 0 0 / 6%);
    background-color: var(--white);;*/
	padding: 30px 0px;
	z-index: 99999999;
}
.top-header
{
	padding:12px 0px;
}
.header .center
{
	align-items: center;
	align-content: center;
}
.right-header
{
	width: 200px;
}
.left-header
{
	width: calc(100% - 200px);
}
.top-left-header
{
	width: 100%;
	margin-bottom: 15px;
}
.bottom-left-header
{
	width: 100%;
}
.top-search
{
	background-color: #0F3E67;
	padding: 0px 10px;
}
.text-search-top
{
	background-color: transparent;
	border: 0px;
	padding: 15px 0px;
	-webkit-transition: width 0.4s ease-in-out;
	-moz-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
	width: 160px;
	outline: none;
	color: var(--white);;
}
.text-search-top:focus
{
    width: 300px;
}
.search-btn
{
	background-color: transparent;
	border: 0px;
	cursor: pointer;
	text-align: center;
		color: var(--white);;
    font-family: "Icons2";
	font-size: 16px;
}
.search-btn:before
{
	content: "\f002";

}
.center-header {
    padding: 20px 0px;
}
.social
{
/*	flex: 1 33.33%;
    max-width: 33.33%;*/
	margin-left: 30px;
}
.social ul li
{
	margin-left: 10px;
}
.social ul li:last-child
{
	margin-left: 0px;
}
.social ul li a
{
	width: 35px;
	height: 35px;
	line-height: 35px;
	border: 1px solid var(--primary-color);
	border-radius: 100%;
	color: var(--primary-color);
	font-family: "Icons";
	text-align: center;
}.social ul li a:hover
{
	background-color: var(--white);
	color: var(--primary-color);
	border: 1px solid var(--white);
}
.facebook:before
{
	content: "\f39e";
}
.instagram:before
{
	content: "\f16d";
}
.youtube:before
{
	content: "\f167";
}
.linked:before
{
	content: "\f0e1";
}
.twitter:before
{
	content: "\f099";
}
.telegram:before
{
	content: "\f2c6";
}
.whats:hover:before
{
	background: url("../Images/whatsblue.svg") no-repeat center center;
	background-size: 15px 15px;
}
.whats:before
{
	content: "";
	display: block;
	background: url("../Images/whatsblue.svg") no-repeat center center;
	background-size: 15px 15px;
	width: 33px;
    height: 33px;
}
.social-footer ul li .whats:before
{
	content: "";
	display: block;
	background: url("../Images/whats.svg") no-repeat center center;
	background-size: 15px 15px;
	width: 38px;
    height: 38px;
}
.social-footer ul li a.whats:hover:before
{
	content: "";
	display: block;
	background: url("../Images/whatsblue.svg") no-repeat center center;
	background-size: 15px 15px;
	width: 38px;
    height: 38px;
}
.header.inner-header .social ul li .whats:before{
	content: "";
	display: block;
	background: url("../Images/whatsblue.svg") no-repeat center center;
	background-size: 15px 15px;
	width: 33px;
    height: 33px;
}
.header.inner-header .social ul li a.whats:hover:before{
	content: "";
	display: block;
	background: url("../Images/whats.svg") no-repeat center center;
	background-size: 15px 15px;
	width: 33px;
    height: 33px;
}
/*.logo
{
	flex: 1 33.33%;
    max-width: 33.33%;
}*/
.logo a img {
    width: 220px;
    margin: auto;
}
/*.top-buttons
{
	flex: 1 33.33%;
    max-width: 33.33%;
}*/
.log-button
{
	margin-right: 15px;
}
.log-button:hover
{
	color: var(--white);
}
.bottom-header {
    border-top: 1px solid var(--baby-grey);
}
.signup-button:hover
{
	color: var(--white);
}
.signup-button:before
{
	content: "\f234";
	font-family: "Icons3";
	margin-left: 5px;
}
.log-button:before
{
	content: "\f2bd";
	font-family: "Icons2";
	margin-left: 5px;
}
.nav-a
{
	color: var(--black);
	    padding: 22px 10px;
	position: relative;
}
.nav-a:before
{
	content: "";
	position: absolute;
	bottom: 0px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 3px;
	border-radius: 3px;
	background-color: var(--primary-color);
	-webkit-transition: width 0.4s ease-in-out;
	-moz-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
}
.nav-a:hover:before
{
	width: 100%;
}
.active-menu.nav-a:before
{
	width: 100%;
}
.nav-a:hover
{
	color: var(--primary-color);
}
.nav-li
{
	margin-left:0px;
	position: relative;
}
.nav-li:last-child
{
	margin-left: 0px;
}
.drop {
  overflow: hidden;
  list-style: none;
  position: absolute;
  padding: 0;
  min-width: 200px;
  right: 0;
	top: 65px;
	background-color: var(--white);;
	-webkit-transform: translate(0, -100%);
  -moz-transform: translate(0, -100%);
  -ms-transform: translate(0, -100%);
  transform: translate(0, -100%);
  -webkit-transition: all 0.5s 0.1s;
  -moz-transition: all 0.5s 0.1s;
  -ms-transition: all 0.5s 0.1s;
  transition: all 0.5s 0.1s;
	visibility: hidden;
	opacity: 0;
	box-shadow: 0px 0px 23px 0px rgba(0,0,0,0.08);
-webkit-box-shadow: 0px 0px 23px 0px rgba(0,0,0,0.08);
-moz-box-shadow: 0px 0px 23px 0px rgba(0,0,0,0.08);
}

.drop-li {
  display: block;
  background: var(--white) !important;
border-bottom: 1px solid var(--baby-grey);;
}
.drop-li:last-child
{
	border-bottom: 0px;
}
.drop-a
{
	color: var(--black);
	padding:15px;
}
.drop-a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.nav-li:hover .drop {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
	visibility: visible;
	opacity: 1;
	z-index: 9999999999999999999999;
}
.down-arrow
{
	font-style: normal;
	margin-right: 3px;
}
.down-arrow:after
{
	content: "\f107";
	font-family: "Icons2";
}
.btn-close {
  cursor: pointer;
  position: relative;
  left: -5px;
  top: 5px;
	margin-bottom: 20px;
  width: 20px;
  height: 20px;
	float: left;
}
.btn-close::before,
.btn-close::after {
  content: "";
  height: 2px;
  display: block;
  background: #d6d6d6;
}

.btn-close::before {
  margin-top: 10px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.btn-close::after {
  margin-top: -2px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.btn-close:hover:after, .btn-close:hover:before {
  background: #AC070C;
}

.modal-wrapper {
	display: flex !important;
  z-index: 999;
  width: 100%;
  height: 100%;
  position: fixed;
  visibility: hidden;
  top: 0;
  left: 0;
   background: rgba(0,0,0,0.5);
  opacity: 0;
  filter: alpha(opacity=0);
  -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;
}
.modal-wrapper.open {
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=1);
}
.over-layd.open {
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=1);
}
.modal {
	padding: 30px;
	display: inline-block;
	border-radius: 10px;
  height: auto;
  width: 470px;
  position: relative;
  margin: auto;
 background-color: var(--white);;
  box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.2);
  opacity: 0;
  filter: alpha(opacity=0);
  -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;
  -ms-transform: scale(0.7);
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
}

.modal-wrapper.open .modal {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-transform: scale(1);
  /* IE 9 */
  -webkit-transform: scale(1);
  /* Safari */
  transform: scale(1);
}
.btn-log
{
	border: 0px;
	cursor: pointer;
	padding: 15px 40px;
}
.log-form ul li:last-child .btn-log
{
	margin-left: 15px;
}
.log-form ul li:last-child .btn-log:last-of-type
{
	margin-left: 0px;
}
.btn-log:hover
{
	opacity: .8;
}
.log-form ul li
{
	margin-bottom: 30px;
}
.log-form ul li:last-child
{
	margin-bottom: 0px;
}
.text-log
{
	border-radius: 7px;
	border: 1px solid var(--baby-grey);;
	padding: 15px 10px;
	width: 100%;
}

.title-pop
{
	margin-bottom: 20px;
}
.title-pop h2
{
	font-weight: 900;
}
.footer
{
	padding: 30px 0px;
}
.logo-footer {
    width: 220px;
    margin: auto;
}
.logo-footer a img
{
	width: 100%;
	height: auto;
}
.bottom-footer
{
	padding: 50px 0px;
}
.right-footer
{
	    width: 33%;
}

.left-footer
{
	    width: 32%;
}

.about-footer p
{
	line-height: 1.6rem;
	margin-top: 15px;
}
.support
{
	margin-top: 30px;
}
.support a:before
{
	content: "\f590";
	font-family: "Icons2";
	color: var(--yellow);;
	font-size: 3rem;
	margin-left: 15px;
}
.subscribe h2
{
	margin-bottom: 25px;
}
.subscribe form
{
	background-color: var(--white);;
	border-radius: 5px;
	padding: 5px;
}
.text-subscribe
{
	border: 0px;
	padding: 10px 10px;
	width: calc(70% - 5px);
}
.button-subscribe
{
	width: 30%;
	border: 0px;
	cursor: pointer;
	border-radius: 5px;

}
.button-subscribe:hover
{
	opacity: 0.7;
}
.center-footer
{
	   width: 27%;
	margin: 0px 6% 0px 2%;
}
.menu-footer ul
{
	width: 60%;
}
.menu-footer ul:nth-child(2)
{
	width: 40%;
}
.menu-footer ul li
{
	margin-bottom: 20px;
}
.menu-footer ul li:last-child
{
	margin-bottom: 0px;
}
.social-footer ul li
{
	margin-left: 10px;
}
.social-footer ul li:last-child
{
	margin-left: 0px;
}
.social-footer ul li a
{
	width: 40px;
	height: 40px;
	line-height: 40px;
	border: 1px solid var(--white);;
	border-radius: 100%;
	color: var(--white);;
	font-family: "Icons";
	text-align: center;
}
.social-footer ul li a:hover
{
	background-color: var(--white);;
	color: var(--primary-color);
}
.copy
{
	padding-top: 30px;
	border-top: 1px solid var(--white);;
	margin-top: 30px;
	text-align: center;
}
.home-blocks ul li
{
	margin-top: 30px;
	width: 790px;
}
.home-blocks ul li:nth-child(1)
{
	margin-top: 0px;
}
.title-block
{
	margin-bottom: 10px;
}
.date
{
	margin-bottom: 10px;
}
.date span
{
	color: var(--grey3);
}
.desk-block p
{
	line-height: 1.2rem;
}
.image-block
{
	background: url(../Images/Spinner.gif) center center no-repeat #fbfbfb;
    background-size: 100px;
	margin-left: 15px;
}
.image-block a img
{
	width: 100%;
}
.home-blocks ul li .image-block
{
	width: 260px;
	height: 173px;
}
.home-blocks ul li .image-block a img
{
	width: 260px;
	height: 173px;
}
.home-blocks ul li .details-block
{
	width: 515px;
}
.section-details
{
	margin-bottom: 30px;
	position: relative;
}
.section-details:before
{
	background-color: var(--baby-grey);;
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.section-title
{
	padding-left: 20px;
	background-color: var(--white);;
	position: relative;
}
.section-more
{
	padding-right: 20px;
	background-color: var(--white);;
	position: relative;
}
.section-more a
{
	border:1px solid var(--color2);
}
.section-more a:after
{
	font-family: "Icons2";
	content: "\f177";
	margin-right: 5px;
}
.section-more a:hover
{
	background-color: var(--color2);
	color: var(--white);;
}
.top-section
{
	position: relative;
	width: 100%;
min-height: 100vh;
	background: url("../Images/bg3.jpg") no-repeat center;
	background-size: cover;
	    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.top-news
{
	position: absolute;
	bottom: 30px;
	left: 50%;
	width: 100%;
	padding: 50px 0px;
	/*background-color: var(--baby-grey2);*/
	transform: translateX(-50%);
}
.top-news .center
{
	position: relative;
}
.news-text
{
	position: relative;
	/*padding-left: 30px;*/
}
.news-text a:hover
{
	color: var(--yellow) !important;
}
.news-text a
{
	    color: var(--white);
}
/*.news-text:after
{
	content: "";
	height: 50px;
	width: 0.5px;
	background-color: var(--white);;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0px;
}
.swiper-slide:nth-child(4n) .news-text:after
{
	display: none;
	padding-left: 0px
}*/
.news-text a h2
{
	margin-bottom: 10px;
	line-height: 1.4;
}
.button-next-news,.button-prev-news
{
	font-family: "Icons2";
	width: 40px;
	height: 40px;
	border: 1px solid var(--primary-color) !important;
	text-align: center;
	line-height: 40px;
	position: relative;
	margin-bottom: 30px;
	cursor: pointer;
	color: var(--primary-color);
}
.button-prev-news
{
	margin-right: 70px;
}
.button-prev-news:hover
{
	color: var(--color2);
	border-color: var(--color2);
}
.button-prev-news:hover:after
{
	background-color: var(--color2);
}
.button-next-news:before
{
	content: "\f054";
}
.button-next-news:after
{
	content: "";
	position: absolute;
	top: 51%;
	transform: translateY(-50%);
	width: 40px;
	height: 1px;
	right: 18px;
	background-color: var(--primary-color);
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.button-prev-news:before
{
	content: "\f053";
}
.button-prev-news:after
{
	content: "";
	position: absolute;
	top: 51%;
	transform: translateY(-50%);
	width: 40px;
	height: 1px;
	left: 18px;
	background-color: var(--primary-color);
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.button-next-news:hover
{
	color: var(--color2);
	border-color: var(--color2);
}
.button-next-news:hover:after
{
	background-color: var(--color2);
}
.numbers ul li
{
	width: 25%;
	text-align: center;
	flex-direction: column;
}
.numbers ul li h2
{
	font-size: 70px;
	font-weight: 900;
}
.numbers ul li h3:before
{
	font-family: "Icons2";

}
.numbers ul li:nth-child(1) h3:before
{
	content: "\f0c0";
	color: var(--primary-color);
	font-size: 1.8rem;
	margin-left: 5px;
}
.numbers ul li:nth-child(2) h3:before
{
	content: "\f5db";
	color: var(--yellow);;
	font-size: 1.8rem;
	margin-left: 5px;
}
.numbers ul li:nth-child(3) h3:before
{
	content: "\f017";
	color: var(--color2);
	font-size: 1.8rem;
	margin-left: 5px;
}
.numbers ul li:nth-child(4) h3:before
{
	content: "\f024";
	color:var(--green);
	font-size: 1.8rem;
	margin-left: 5px;
}
.section-numbers
{
	background: url("../Images/Mask Group 1.png") center no-repeat;
	background-size: cover;
	padding: 50px 0px;
}
.section-bg-blue
{
	background-color: var(--primary-color);
	background-size: cover;
	padding: 50px 0px;
}
.project-slide
{
	background-color: var(--white);;
	border-radius: 10px;
	padding: 15px;
	min-height: 300px;
}
.project-slide .desk-block
{
	min-height: 100px;
	line-height: 1.2rem;
	font-size: var(--s-font)
}
.project-slide .desk-block p
{
	line-height: 1.2rem;
	font-size: var(--s-font)
}
.right-project-home
{
	width: 280px;
	margin-left: 30px;
}
.left-project-home
{
	width: 890px;
}
.project-logo
{
	margin-bottom: 10px;
}
.project-logo a img
{
	width: auto;
	height: 60px;
}
.project-name h2 a
{
	color: var(--black);
}
.project-name h2 a:hover
{
	color: var(--primary-color);
}
.project-name
{
	margin-bottom: 10px;
}
.more
{
	margin-top: 10px;
}
.more:after
{
	content: "\f177";
	font-family: "Icons2";
	color: var(--color2);
	font-size: 0.8rem;
	border-radius: 100%;
	border: 1px solid var(--color2);
	width: 27px;
	height: 27px;
	line-height: 27px;
	text-align: center;
	display: inline-block;
	transform:rotate(35deg);
	margin-right: 10px;
}
.title
{
	text-align: center;
	margin-bottom: 50px;
}
.title h2
{
	font-size: 3rem;
	line-height: 4rem;
}
.top-p-project
{
	margin-top: 30px;
}
.button-next-project,.button-prev-project
{
	font-family: "Icons4";
	font-size: 3rem;
	cursor: pointer;
}
.button-next-project:hover,.button-prev-project:hover
{
	color: var(--color2);
}
.button-next-project:before
{
	content: "\f178";
}
.button-prev-project
{
	margin-right: 15px;
}
.button-prev-project:before
{
	content: "\f177";
}
.title-lib
{
	text-align: center;
	margin-bottom: 50px;
}
.title-lib h2
{
	font-size: 3rem;
}
.library-section
{
	background: url("../Images/lib.png")center no-repeat;
	background-size: cover;
	padding: 50px 0px;
}
.flib-container
{
	 -webkit-perspective: 1000px;
  perspective: 1000px;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  display: block;
  height: 300px;
  cursor: pointer;
}

.card-library{
  position: relative;
  height: 100%;
  width: 100%;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transition: all 2s;
	transition-property: transform;
  transition: all 2s;
  z-index: 20;
}

.card-library .back-card{
  position: absolute;
  height: 100%;
  width: 100%;
  background: var(--baby-blue2);;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.card-library .front-card{
  position: absolute;
  height: 100%;
  width: 100%;
  background: var(--white);;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.card-library .back-card{
  background-color: var(--white);;
	border-radius: 10px;
	-webkit-box-shadow: 0px 7px 14px 0px rgb(151 160 204 / 12%);
    box-shadow: 0px 7px 14px 0px rgb(151 160 204 / 12%);
	text-align: center;
	padding: 15px;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.card-library:hover
{
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
.card-library:hover .icon-book
{
	visibility: hidden;
}
.library-slider
{
	padding-top: 45px !important;
	padding-bottom: 45px !important;
}
.front-card
{
	background-color: var(--white);;
	border-radius: 10px;
	-webkit-box-shadow: 0px 7px 14px 0px rgb(151 160 204 / 12%);
    box-shadow: 0px 7px 14px 0px rgb(151 160 204 / 12%);
	text-align: center;
	padding: 15px;
}
.icon-book
{
	width: 90px;
	height: 90px;
	background-color: var(--white);;
	border-radius: 100%;
	-webkit-box-shadow: 0px 7px 14px 0px rgb(151 160 204 / 12%);
    box-shadow: 0px 7px 14px 0px rgb(151 160 204 / 12%);
	position: absolute;
	top: -45px;
	left: 50%;
	transform: translateX(-50%);
	transition: all 2s;
}
.icon-book img
{
	width: 50px;
}
.title-book
{
	margin-top: 50px;
	min-height: 60px;
}
.title-book h2 a
{
	color: var(--black);
}
.title-book h2 a:hover{
	color: var(--primary-color);
}

.icons-library
{
	margin-top: 30px;
}
.right-icons-library
{
	margin-left: 30px;
}
.right-icons-library span:before
{
	content: "\f15c";
	font-family: "Icons4";
	margin-left: 5px;
	display: block
}
.left-icons-library span:before
{
	content: "\f51c";
	font-family: "Icons4";
	margin-left: 5px;
	display: block
}
.grey-color
{
	color: var(--grey4);
}
.more-lib
{
	 width: 30px;
    height: 30px;
    line-height: 30px;
	border-radius: 100%;
	text-align: center;
	margin: 30px auto 0px auto;
}
.more-lib:after {
    content: "\f177";
    font-family: "Icons2";
    display: inline-block;
    transform: rotate(35deg);
	font-size: .8rem;
}
.books-back ul li
{
	margin-top: 10px;
}
.books-back ul li a
{
	color: var(--black);
}
.books-back ul li a:hover
{
	color: var(--primary-color)
}
.books-back ul li:nth-child
{
	margin-top: 0px;
}
.library-slider .swiper-pagination
{
	bottom: -40px;
}
.library-slider .swiper-pagination-bullet
{
	width: 40px;
	border-radius: 3px;
	height: 4px;
	background-color:var(--white);
	opacity: 0.8;

}
.library-slider .swiper-pagination-bullet.swiper-pagination-bullet-active
{
	background-color: var(--color2);
	opacity: 1;
}
.partener ul li
{
	margin-left: 30px;
	width: 216px;
	margin-bottom: 30px;
}
.partener ul li:nth-child(5n)
{
	margin-left: 0px;
}
.partener ul li:nth-child(-n+5)
{
	margin-top: 0px;
}
.partener ul li img
{
	width: auto;
	height: 90px;
}
.title-section

{
	text-align: center;
	margin-bottom: 50px;
}
.title-section h2
{
	font-size: 3rem;
}
.testemonial-slider
{
	padding: 60px 0px 0px 0px !important;
}
.testimonial-block
{
	padding: 15px;
	border-radius: 10px;
	position: relative;
	-webkit-box-shadow: 0px 0px 14px 0px rgb(151 160 204 / 12%);
    box-shadow: 0px 0px 14px 0px rgb(151 160 204 / 12%);
	background-color: var(--white);;
}
.testimonial-block .desk-block
{
	padding-top: 60px;
	    font-size: var(--s-font)
}
.testimonial-block .desk-block p
{
	    font-size: var(--s-font)
}
.testimonial-image
{
	position: absolute;
	top: -50px;
	right: 15px;
	border-radius: 100%;
	width: 100px;
	height: 100px;
		-webkit-box-shadow: 0px 0px 14px 0px rgb(151 160 204 / 12%);
    box-shadow: 0px 0px 14px 0px rgb(151 160 204 / 12%);
}
.testimonial-image a img
{
	width: 100px;
	height: 100px;
	border-radius: 100%;
}
.testimonial-down
{
	border-top: 1px solid var(--baby-grey);;
	padding-top: 15px;
	margin-top: 15px;
	width: 100%;
}
.testimonial-name
{
	width: calc(100% - 40px);
}
.testimonial-name h2 a
{
	color: var(--black);
}
.testimonial-name h2 a:hover
{
	color: var(--primary-color);
}
.testimonial-more
{
	width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 100%;
    text-align: center;border: 1px solid var(--color2);
}
.testimonial-more:after {
    content: "\f177";
    font-family: "Icons2";
    display: inline-block;
    transform: rotate(35deg);
}
.testimonial-more:hover{
	background-color:var(--color2);
	color:var(--white); ;
}
.testimonial-pageing
{
	margin-top: 30px
}
.button-next-testimonial, .button-prev-testimonial {
    font-family: "Icons2";
	background-color: var(--baby-grey2);;
	color: var(--black);
    cursor: pointer;
	width: 40px;
	height: 40px;
	border-radius: 100%;
	line-height: 40px;
	text-align: center;
}
.button-next-testimonial
{
	margin-left: 15px;
}
.button-next-testimonial:hover,.button-prev-testimonial:hover
{
	background-color:var(--color2);
	color: var(--white);;
}
.button-next-testimonial:before {
    content: "\f054";
}
.button-prev-testimonial:before {
    content: "\f053";
}
#chartdiv {
  width: 100%;
  height: 500px;
}
.input-hero
{
	    border-radius: 30px;
    border: 0px;
    padding: 15px 10px;
    width: 100%;
	background-color: var(--baby-grey2);
	margin-bottom: 15px;
	color: var(--black) !important;
	border: 1px solid var(--baby-grey);
}
.input-hero::placeholder
{
	color: var(--grey3) !important;
}
.input-hero ::-ms-input-placeholder { /* Edge 12 -18 */
 color: var(--black);
}
.hero-slide
{
	width: 100%;
}
.hero-right
{
	width: 60%;
}
.hero-left
{
	width: 30%;

}
.hero-video
{
	overflow: hidden;
    position: relative;
	width: 100%;
	padding-bottom: 56.5%
}
.hero-video iframe
{
	    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.hero-right h2
{
	font-size: 2.5rem;
	margin-bottom: 30px;
	color: var(--black) !important;
}
.hero-right p
{
	line-height: 1.6rem;
	color: var(--white) !important;
}
.bottom-home-top
{
	position: relative;
}
.top-slider
{
	width: 100%;
	padding-bottom: 20px !important;
}
.top-slider .swiper-pagination
{
	bottom: 20px !important;
	z-index: 9999999999999 !important;
}

.hero-form
{
	text-align: center;
}
.hero-form h2
{
	margin-bottom: 15px;
}
.link-form
{
    background-color: var(--primary-color);
	   color: var(--white);
	border: 1px solid var(--white);
	width: 45%;
	padding: 15px !important;
}
.link-form:hover
{
	background-color: var(--primary-color);
	color: var(--white);
}
.submit-hero
{
	border: 0px;
	cursor: pointer;
	width: 45%;
	padding: 15px !important;
	background-color: var(--white);
	color: var(--primary-color);
}
.submit-hero:hover
{
	opacity: 0.7;
}
.center-slider
{
	/*padding: 80px 0px;*/
/*	    background: url("../Images/islamic.jpg") no-repeat center;
	position: relative;
    background-size: cover;*/
	/*min-height: 400px;*/
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
/*.center-slider:before
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	content: "";
	background: linear-gradient(to top left, var(--primary-color) 5%, var(--color2) 100%);
	mix-blend-mode: multiply;


}*/
.hero-links
{
	margin-top: 30px;
}
.link-right
{
	border: 1px solid var(--white);
	margin-left: 15px;
	color: var(--white);
}
.link-right:hover
{
	background-color: var(--white);
	color: var(--primary-color);
}
.link-right2
{
	background-color: var(--white);
	color: var(--primary-color);
}
.link-right2:hover
{
	opacity: 0.6;
}
.hero-image img
{
	width: 100%;
}
      .top-slider .swiper-slide {

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
		  width: 100%;
      }

     .top-slider .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }

.top-slider .swiper-pagination-bullet-active
{
	background-color: var(--yellow) !important;
}
.swiper-wrapper
{
	align-content: center;
	align-items: center;
}
.hero-form input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--white);;
  opacity: 1; /* Firefox */
}

.hero-form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: var(--white);;
}

.hero-form input::-ms-input-placeholder { /* Microsoft Edge */
  color: var(--white);;
}
.inner-header
{
	-webkit-box-shadow: 0px 4px 10px -2px rgb(0 0 0 / 6%);
    -moz-box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.06);
    box-shadow: 0px 4px 10px -2px rgb(0 0 0 / 6%);
	    background-color: var(--white);;

}
.inner-header .nav-a {
    color: var(--black);
}
.inner-header .social ul li a
{
	 color: var(--primary-color);
	border-color: var(--primary-color);
}
.inner-header .social ul li a:hover
{
	color: var(--white);;
}
.inner-header .top-buttons a
{
	color: var(--black);
}
.inner-header .signup-button:before,.inner-header .log-button:before
{
	color: var(--primary-color);
}
.page-title
{
	text-align: center;
}
.page-title h2
{
	font-size: 2rem;
}


.bread-crumb ul li
{
	margin-left: 10px;
}
.bread-crumb ul li:last-child
{
	margin-left: 0px;
}
.bread-crumb ul li a:after
{
	    content: "\f053";
	font-family: "Icons2";
	margin-right: 10px;
}
.bread-crumb ul li span
{
	display: block;
}
.section-inner
{
	padding: 50px 0px;
}
.steps
{
	background-color: var(--baby-blue2);;
	padding: 30px;
	margin-left: 30px;
	border-radius: 10px;
	width: 230px;
}
.steps ul li
{
	margin-bottom: 30px;
	cursor: pointer;
}
.steps ul li:last-child
{
	margin-bottom: 0px;
}
.steps ul li i
{
	margin-bottom: 10px;
}
.steps ul li i:before
{
	font-family: "Icons4";
	font-style: normal;
	font-size: 2rem;
}
.step-one-icon:before
{
	content: "\f007";
}
.step-two-icon:before
{
	content: "\f19d";
}
.step-three-icon:before
{
	content: "\f05a";
}
.step-four-icon:before
{
	content: "\f090";
}
.step-five-icon:before
{
	content: "\f058";
}
.form-group
{
	border: 1px solid var(--baby-grey);;
	border-radius: 10px;
	padding: 15px 30px;
	position: relative;
}
.label-regist
{
	position: absolute;
	top: -16px;
	padding: 0px 5px;
	background-color: var(--white);;
	right: 25px;
}
.text-regist
{
	padding:10px 0px;
	border: 0px;
	width: 100%;
	    font-family: var(--body-fonts);
	outline: none;
}
.tab-regist
{
	display: none;
}
.current
{
	display: block;
}
.step-regist.active i,.step-regist.active h2
{
	color: var(--primary-color);
}

.step-regist.finish
{
	background-color: #4CAF50;
}
.tab-regist label.error
{
	font-size: 12px;
	position: absolute;
	bottom: -7px;
	padding: 0px 5px;
	background-color: var(--white);;
	right: 20px;
}
.error {color: #f00; }
.form-regist
{
	width: 940px;
}
.page-one ul li
{
	margin-left: 30px;
	margin-top: 50px;
	width: 455px;
}
.page-one ul li:nth-of-type(2n+1)
{
	margin-left: 0px;
}
.page-one ul li:nth-of-type(1),.page-one ul li:nth-of-type(2),.page-one ul li:nth-of-type(3)
{
	width: 293px !important;
}
.page-one ul li:nth-of-type(3)
{
	margin-left: 0px;
}
.page-one ul li:nth-of-type(1)
{
	margin-left: 30px !important;
}
.page-one ul li:last-of-type
{
	width: 100% !important;
	margin-left: 0px;
}
.next-step
{
	border: 0px;
	border-radius: 10px;
	font-family: var(--body-fonts);
	cursor: pointer;
	padding: 15px 20px;
	margin-top: 30px;

}
.next-step:after
{
	content: "\f060";
	font-family: "Icons2";
	margin-right: 5px;
}
.next-step:hover,.submit-step:hover,.previous-step:hover
{
	opacity: 0.5;
}
.submit-step
{
	border: 0px;
	border-radius: 10px;
	font-family: var(--body-fonts);
	cursor: pointer;
	padding: 15px 20px;
	margin-top: 30px;
}
.previous-step
{
	border: 0px;
	border-radius: 10px;
	font-family: var(--body-fonts);
	cursor: pointer;
	background-color: #343434;
	padding: 15px 20px;
	margin-top: 30px;
	margin-left: 30px;
}
.previous-step:before
{
	content: "\f061";
	font-family: "Icons2";
	margin-left: 5px;
}
.down-select
{
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}
.down-select:before
{
	content: "\f063";
	font-family: "Icons2";
	font-style: normal;
}
.page-two ul li
{
	margin-left: 30px;
	margin-top: 50px;
	    width: 455px;
}
.page-two ul li:nth-of-type(-n+2)
{
	margin-top: 0px;
}
.page-two ul li:nth-child(2n)
{
	margin-left: 0px;
}
.answers
{
	padding-bottom: 50px;
	display: none
}
.text-answers
{
	padding: 15px;
	border-bottom: 1px solid var(--baby-grey);;
	border-right: 0px;
	border-left: 0px;
	border-top: 0px;
	width: 29.7%;
	margin-left: 5%;
}
.text-answers:last-child
{
	margin-left: 0px;
}
.page-three ul li
{
	margin-top: 50px;
	    width: 100%;
}
.page-three ul li:nth-of-type(1)
{
	margin-top: 0px;
}
.right-choose-radio
{
	margin-left: 25px;
}
.answers
{
	margin-top: 50px;
}
.radi-no
{
	margin-left: 5px;
}
.radio-yes
{
	margin-left: 5px;
}
.page-four ul li
{
	    margin-left: 30px;
    margin-top: 50px;
    width: 455px;
}
.page-four ul li:nth-of-type(3)
{
	margin-left: 0px;
}
.page-four ul li:nth-of-type(1)
{
	margin-top: 0px;
	width: 100%;
}
.page-four ul li:last-of-type
{
	width: 100%;
	text-align: center;
	margin-left: 0px;
}
.fil-number
{
	text-align: center;
}
.fil-number span
{
	display: inline-block;
	margin-bottom: 10px;
}
.fil-number
{
	margin-bottom: 30px;
}
.inner-registration
{
	align-content: flex-start;
	align-items: flex-start;
}
.mobile-header,.menu-slide
{
	display: none;
}
.about-desk p
{
	    font-size: var(--m-font);
	line-height: 1.8rem;
}

.inner-sta
{
	width: 48%;

}
.inner-sta h2
{
	margin-bottom: 20px;
}
.inner-sta p
{
	line-height: 1.8rem;
}
.statistics-numbers
{
	width: 48%;
	position: relative;
}
.square
{
	width: 175px;
	height: 175px;
	text-align: center;
	border-radius: 10px;
	align-content: center;
	align-items: center;
	    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
	justify-content: center;
	flex-direction: column;
}
.square h4
{
	margin: 10px 0px;
	font-size: 2rem;
	line-height: 1.4rem;
}
.square span
{
	display: block;
}
.square1
{
	position: relative;
	right: 20%;
	transform: translateY(50%);

}
.square2
{
position: relative;
	right: 45%;
	transform: translateY(-39%);
}
.square3
{
	background-color: var(--baby-blue2);;
	position: relative;
	    right: 29%;
    transform: translateY(-56%);

}
.square4
{
	    background-color: var(--primary-color);
	    width: 60px;
    height: 60px;
	    border-radius: 5px;
	top: 50%;
	transform: translateY(-50%);
	right: 0px;
	position: absolute;
}
.square4:before
{
	content: "";
	background-color: var(--yellow);;
	    width: 40px;
    height: 40px;
	    border-radius: 5px;
	bottom:-200%;
	right: 100%;
	position: absolute;
	animation-name: stretch;
  animation-duration: 4s;
  animation-timing-function: ease-out;
  animation-delay: 0;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: none;
  animation-play-state: running;
}
.square4:after
{
	content: "";
	background-color: var(--color2);
	    width: 30px;
    height: 30px;
	    border-radius: 5px;
	top:-200%;
	right: 30%;
	position: absolute;
	animation-name: stretch2;
  animation-duration: 4s;
  animation-timing-function: ease-out;
  animation-delay: 0;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: none;
  animation-play-state: running;
}
.square5
{
	    background-color: var(--yellow);;
	    width: 40px;
    height: 40px;
	    border-radius: 5px;
	top: 30%;
	transform: translateY(-50%);
	left: 0px;
	position: absolute;
}
.square5:after
{
	content: "";
	    background-color: var(--color2);
	    width: 30px;
    height: 30px;
	    border-radius: 5px;
	    bottom: -400%;
	transform: translateY(-50%);
	left: 100%;
	position: absolute;
	animation-name: stretch3;
  animation-duration: 4s;
  animation-timing-function: ease-out;
  animation-delay: 0;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: none;
  animation-play-state: running;
}
.organiz ul li
{
	border: 1px solid var(--baby-grey);;
	text-align: center;
	position: relative;
	padding: 30px;
	width: 380px;
	margin-left: 30px;
	min-height: 100px;
	margin-top: 50px;
	border-radius: 15px;
}
@keyframes stretch {
  0% {
   bottom: -100%;
  }
  100% {
  	bottom: -200%;
  }
}
@keyframes stretch2 {
  0% {
   top: -100%;
  }
  100% {
  	top: -200%;
  }
}
 @keyframes stretch3 {
  0% {
   bottom: -300%;
  }
  100% {
  	bottom: -400%;
  }
}

.organiz ul li:nth-child(3n)
{
	margin-left: 0px;
}
.organiz ul li:nth-child(-n+3)
{
	margin-top: 0px;
}
.organiz ul li h2
{
	line-height: 1.6rem;
}
.organiz ul li span
{
	display: block;
	width: 40px;
	height: 40px;
	text-align: center;
	line-height: 40px;
	border-radius: 100%;
	position: absolute;
	top: -24px;
	left: 50%;
	transform: translateX(-50%);
	background-color: var(--baby-blue2);;
}
.right-side
{
	width: 790px;
	margin-left: 30px;
}
.left-side
{
	width: 380px;
}
.title-aside
{
	margin-bottom: 30px;
}
.trending ul li
{
	margin-top: 20px;
}
.trending ul li:nth-child(1)
{
	margin-top: 0px;
}
.trending ul li .image-block,.trending ul li .image-block a img
{
	    width: 160px;
    height: 106px;
}
.trending ul li .details-block
{
	width: 205px;
}
.trending ul li .details-block .date
{
	margin-bottom: 0px;
}
.twitter-section
{
	width: 100%;
	height: 300px;
	background-color: var(--baby-grey2);;
	margin-top: 30px;
}
.twitter-section iframe
{
	width: 100%;
	height: 300px;
}

.paginationjs-pages
{
	margin-top: 30px;
}
.paginationjs-pages ul
{
	    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
	    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
	justify-content: flex-start;
}
.paginationjs-pages ul li
{
	margin-left: 10px;
}
.paginationjs-pages ul li:last-child
{
	margin-left: 0px;
}
.paginationjs-pages ul li a
{
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 16px;
	color: var(--black);
	background-color: var(--grey6);
	border-radius: 100%;
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.paginationjs-pages ul li.active a
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.paginationjs-pages ul li a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.paginationjs-next a
{
	color: transparent;
}
.article-title
{
	margin-bottom: 15px;
}
.under-title
{
	margin-bottom: 30px;
}
.under-title .date
{
	margin-bottom: 0px;
}
.image-article
{
	width: 100%;
	margin-bottom: 15px;
}
.image-article img
{
	width: 100%
}
.article-desk
{
	font-size: 1rem !important;
	line-height: 1.6rem !important;
	    font-family: var(--body-fonts);
}
.article-desk p
{
	font-size: 1rem !important;
	line-height: 1.6rem !important;
	    font-family: var(--body-fonts);
}
.article-desk p a
{
	display: inline-block;
	margin-left: 5px;
	color: var(--color2);
}
.article-desk h2,.article-desk h1,.article-desk h3,.article-desk h4,.article-desk h5,.article-desk h6
{
	font-size: 0.9rem !important;
	font-weight: 800 !important;
}
.article-desk img
{
	width: 100%;
	margin: 15px 0px;
}
.socialCircle-item {
  width: 40px;
  height: 40px;
  position: absolute;
  background: var(--primary-color);
  text-align: center;
  color: var(--white);
  font-size: var(--m-font);
  cursor: pointer;
	    font-family: "Icons";

}

.socialCircle-container {
  position: relative;
	  width: 40px;
  height: 40px;
}

.socialCircle-center {
  background: var(--primary-color);
  text-align: center;
  color: var(--white);
  font-size: var(--m-font);
  cursor: pointer;
	width: 40px;
	height: 40px;
	position: absolute;
	left: 0px;
		top: 0px;
	    font-family: "Icons";
}
	.inner-social
	{
		left: 0px;
		top: 0px;
		position: absolute;
		    font-family: "Icons";
		    width: 40px;
    height: 40px;
	}
.fa-share-alt:before
{
	content: "\f1e0";
	    font-family: "Icons3";
	font-style: normal;
}
.all-projects ul li
{
	width: 380px;
	margin-top: 30px;
	margin-left: 30px;
	border:1px solid var(--baby-grey);;
	border-radius: 10px;
}

.all-projects ul li .project-slide
{
	min-height: 230px;
}
.project-slide .more
{
	justify-content: flex-end;
	    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
	align-items: center;
	align-content: center;
	margin-top: 30px;
}
.all-projects ul li:nth-child(3n)
{
	margin-left: 0px;
}
.all-projects ul li:nth-child(-n+3)
{
	margin-top: 0px;
}
.project-details-logo
{
	margin-bottom: 15px;
}
.all-testmonial ul li
{
	width: 380px;
	margin-left: 30px;
	margin-top: 80px;
}
.all-testmonial ul li:nth-child(2n)
{
	margin-left: 0px;
}
.all-testmonial ul li:nth-child(-n+2)
{
	margin-top: 50px;
}
.testimonial-image-detils
{
	    width: 100px;
    height: 100px;
    border-radius: 100%;
	margin-bottom: 20px;
}
.testimonial-image-detils img
{
	    width: 100px;
    height: 100px;
    border-radius: 100%;
}
.all-teacher ul li
{
	padding: 15px;
	border-radius: 10px;
	border: 1px solid var(--baby-grey);;
	width: 216px;
	margin-left: 30px;
	margin-top: 30px;
}
.all-teacher ul li:nth-child(5n)
{
	margin-left: 0px;
}
.all-teacher ul li:nth-child(-n+5)
{
	margin-top: 0px;
}
.teacher-image
{
	width: 120px;
	height: 120px;
	border-radius: 100%;
	margin: 0px auto 15px auto;
}
.teacher-image a img
{
	width: 120px;
	height: 120px;
	border-radius: 100%;
}
.teacher-name
{
	text-align: center;
	min-height: 50px;
}
.teacher-name h2 a span
{
	color: var(--primary-color);
	margin-left: 5px;
}
.teacher-name h2 a
{
	color: var(--black);
}
.teacher-name h2 a:hover
{
	color: var(--color2);
}
.teacher-down
{
	padding-top: 15px;
	border-top: 1px solid var(--baby-grey);;
	margin-top: 15px;
}
.teacher-country
{
	background-color: #F5FDF9;
	color: var(--green);
	border-radius: 4px;
	padding: 7px 7px;
}
.teacher-more
{
	font-size: 1.6rem;
}
.teacher-more:before
{
	font-family: "Icons4";
	content: "\f39b";
}
.image-techer-details
{
	width: 380px;
	height: 380px;
	border-radius: 15px;
	margin-left: 30px;
	margin-bottom: 30px;
}
.image-techer-details img
{
		width: 380px;
	height: 380px;
	border-radius: 15px;
}
.left-teacher-details
{
	width: 790px;
}
.teacher-details-title
{
	margin: 15px 0px;
}
.teacher-jop
{
	margin-bottom: 15px;
}
.teacher-birth
{
	margin-bottom: 15px;
}
.right-teacher-info
{
	margin-left: 30px;
}
.right-teacher-info span:before
{
	font-family: "Icons3";
	content: "\f0c0";
	display: block;
	font-size: 2.3rem;
}
.left-teacher-info span img
{
	height: 40px;
}
.info-left
{
	font-size: 2rem;
	margin-right: 10px;
}
.top-numbers ul li
{
	margin-left: 30px;
	border: 1px solid var(--baby-grey);
	background-color: var(--grey5);
	border-radius: 10px;
	padding: 0px;
	width: 277px;
	text-align: center;
}
.top-numbers ul li span
{
	padding-top: 15px;
	display: block;
	margin-bottom: 10px;
}
.top-numbers ul li h2
{
	font-size: 2rem;
	font-weight: 800;
}
.top-numbers ul li:nth-child(4n)
{
	margin-left: 0px;
}

.left-charts
{
	width: 585px;
}
.left-charts h3
{
	    text-align: center;
    margin-bottom: 25px;
    margin-top: 25px;
}
.bottom-chart
{
	margin-top: 30px;
}
.page-one ul li .iti__country
{
	padding: 5px 10px !important;
	margin-top: 0px !important;
	width: 100% !important;
	margin-left: 0px !important;
}
.page-one ul li:nth-of-type(1).iti__country-list .iti__country, .page-one ul li:nth-of-type(2) .iti__country-list .iti__country, .page-one ul li:nth-of-type(3) .iti__country-list .iti__country
{
	padding: 5px 10px !important;
	margin-top: 0px !important;
	width: 100% !important;
}
.iti__divider
{
	padding: 5px 10px !important;
	margin-top: 0px !important;
	width: 100% !important;
	    padding-bottom: 5px !important;
    margin-bottom: 5px !important;
}
.get-data
{
	border-radius: 10px;
    padding: 15px 20px;
	display: inline-block;
	text-align: center;
	margin-top: 20px;
}
.send-pop
{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background-color: var(--white);;
	border-radius: 10px;
	padding: 15px;
	border-radius: 10px;
}
.over-layd
{
	display: flex !important;
  z-index: 999;
  width: 100%;
  height: 100%;
  position: fixed;
  visibility: hidden;
  top: 0;
  left: 0;
   background: rgba(0,0,0,0.5);
  opacity: 0;
  filter: alpha(opacity=0);
  -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;
}
.send-pop a
{
	display: block;
	text-align: center;
	margin-top: 15px;
	border-radius: 7px;
	padding: 15px;
}
.mail
{
	font-size: 2rem;
	margin-bottom: 10px;
	font-style: normal;
	color: var(--primary-color);
	text-align: center;
	display: block;
}
.mail:before
{
	font-family: "Icons3";
	content: "\f0e0";
}
.right-charts
{
	margin-left: 30px;
	width: 585px;
	border: 1px solid var(--baby-grey);;
	border-radius: 10px;
}
.right-charts h2
{
	text-align: center;
	margin-bottom: 25px;
	margin-top: 25px;
}
.view:after
{
	font-family: "Icons3";
	content: "\f06e";
	margin-left: 5px;
}
.stud
{
	margin-right: 10px;
}
.stud:after
{
	font-family: "Icons2";
	content:"\f15c";
	margin-left: 5px;
}
.all-lib ul li
{
	padding: 15px;
	border-radius: 10px;
	border: 1px solid var(--baby-grey);;
	width: 216px;
	margin-left: 30px;
	margin-top: 30px;
}
.all-lib ul li:nth-child(5n)
{
	margin-left: 0px;
}
.all-lib ul li:nth-child(-n+5)
{
	margin-top: 0px;
}
.lib-filter
{
	margin-bottom: 30px;
}
.filter-select
{
	    border: 1px solid var(--baby-grey);;
    border-radius: 10px;
    padding: 15px 30px;
    position: relative;
	width: 350px;
	margin-left: 30px;
}
.filter-select:last-child
{
	margin-left: 0px;
}
.filter-select select
{
	    padding: 10px 0px;
    border: 0px;
    width: 100%;
    font-family: var(--body-fonts);
    outline: none;
}
.inner-image-profile
{
	width: 160px;
	height: 160px;
	border-radius: 100%;
	margin-left: 10px;
	margin-right: 30px;
}
.inner-image-profile img
{
	width: 160px;
	height: 160px;
	border: 5px solid var(--white);;
	border-radius: 100%;
}

.profile-top
{
	width: 100%;
}
.bg-profile
{
	height: 140px;
	background: url("../Images/Group 961.svg") no-repeat;
	background-size: cover;
	width: 100%;
	border-radius: 15px;
	padding: 30px;
}
.profile-top
{
	margin-top: -50px;
	margin-bottom: 50px;
}
.courses ul li
{
	padding: 15px;
	border-radius: 10px;
	border: 1px solid var(--baby-grey);;
	width: 216px;
	margin-left: 30px;
	margin-top: 30px;
}
.courses ul li:nth-child(5n)
{
	margin-left: 0px;
}
.courses ul li:nth-child(-n+5)
{
	margin-top: 0px;
}
.icon-course
{
	font-size: 3rem;
	font-style: normal;
	text-align: center;
	display: block;
}
.courses ul li .icon-course
{
	color: var(--color2)
}
.icon-course:before
{
	font-family: "Icons4";
	content:"\f5da";
}
.course-title
{
	text-align: center;
	margin-top: 15px;
	min-height: 50px;
}
.course-title h2
{
	line-height: 1.5rem;
}
.course-title h2 a
{
	color: var(--black);
}
.course-title h2 a:hover
{
	color: var(--color2);
}
.down-course
{
	    padding-top: 15px;
    border-top: 1px solid var(--baby-grey);;
    margin-top: 15px;
}
.lessons ul li
{
	padding: 15px;
	border-radius: 10px;
	border: 1px solid var(--baby-grey);;
	width: 216px;
	margin-left: 30px;
	margin-top: 30px;
}
.lessons ul li:nth-child(5n)
{
	margin-left: 0px;
}
.lessons ul li:nth-child(-n+5)
{
	margin-top: 0px;
}

.icon-lesson
{
	font-size: 3rem;
	font-style: normal;
	text-align: center;
	display: block;
}
.icon-lesson:before
{
	font-family: "Icons4";
	content:"\f15c";
}
.download
{
	margin-left: 15px;
	display: block;
}
.download:before
{
	font-family: "Icons2";
	content:"\f019";
}
.video
{

	display: block;
}
.video:before
{
	font-family: "Icons2";
	content:"\f03d";
}
.sound
{
	display: block;
	margin-left: 15px;
}
.sound:before
{
	font-family: "Icons2";
	content:"\f58f";
}
.left-course
{
	margin-right: 10px;
}
.left-course span
{
	display: block;
	margin-bottom: 5px;
}
.top-lesson-details
{
	margin-bottom: 30px;
}
.desk-lesson {
    font-size: 1rem !important;
    line-height: 1.6rem !important;
    font-family: var(--body-fonts);
}
.desk-lesson p {
    font-size: 1rem !important;
    line-height: 1.6rem !important;
    font-family: var(--body-fonts);
}
.desk-lesson
{
	margin-top: 30px;
}
.down-desk-lesson
{
	margin-top: 30px;
}
.view-video
{
	margin-left: 15px;
}
.view-video a
{
	padding: 15px;
	border-radius: 10px;
}
.view-video a:before
{
	font-family: "Icons2";
    content: "\f03d";
	margin-left: 10px;
}
.view-audio
{
	margin-left: 15px;
}
.view-audio a
{
	padding: 15px;
	border-radius: 10px;
}
.view-audio a:before
{
	font-family: "Icons2";
    content: "\f58f";
	margin-left: 10px;
}
.down-book a
{
	padding: 15px;
	border-radius: 10px;
	background-color: var(--black);
}
.down-book a:before
{
	font-family: "Icons2";
    content: "\f019";
	margin-left: 10px;
}
.overlay-lesson
{
	display: flex !important;
  z-index: 999;
  width: 100%;
  height: 100%;
  position: fixed;
  visibility: hidden;
  top: 0;
  left: 0;
   background: rgba(0,0,0,0.7);
  opacity: 0;
  filter: alpha(opacity=0);
  -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;
}
.inner-pop-lesson
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 50%;
}
.video-lesson
{
	overflow: hidden;
    position: relative;
    width: 100%;
    padding-bottom: 56.5%;
}
.audio-lesson
{
	width: 100%;
}
.audio-lesson audio
{
	width: 100%
}
.video-lesson iframe
{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.overlay-lesson.open {
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=1);
}
.close-pop
{
	margin-bottom: 10px;
	display: block;
	font-size: 2rem;
	cursor: pointer;
}
.close-pop:before
{
	content: "\f057";
	font-family: "Icons2";
	color: #FE6B6E;
}
.left-charts
{
    width: 585px;
    border: 1px solid var(--baby-grey);;
    border-radius: 10px;
}
.left-charts ul li
{
	padding-bottom: 15px;
	border-bottom: 15px;
	border-bottom: 1px solid var(--baby-grey);;
	padding: 0px 15px 0px 0px;
}
.left-charts ul li:last-child
{
	border-bottom: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;
}
.details-chart h2
{
	margin-bottom: 10px;
}


.treeview{
  line-height: 28px;
  font-weight: 500;
  font-size: 15px;
	margin: auto;
	width: 100%;
}

.treeview .extend .folder > ul > li .folder > ul > li{
	margin-bottom: 10px;
	margin-right: 30px;
	padding-right: 80px;
 /* width: 100%;*/
  /*float: right;*/
}
.treeview ul li a
{
	color: var(--black);
	position: relative;
}
.treeview .folder{
  position: relative;
}

.treeview .folder:before,
.treeview .file:before,
.treeview .external:before{
  font-family:'Icons4';
  /*float: right;*/
}
/*.treeview .folder:before{
	font-family:'Icons4';
  content: "\f07b";
  position: absolute;
  right: 17px;
  font-size: 17px;
}*/
.treeview .file:before{
	font-family:'Icons4';
  font-size: 1.3rem;
  content: "\f1c1";
	margin-left: 15px;
	color: var(--color2);
}
.treeview .external:before{
	font-family:'Icons3';
  font-size: 90%;
  content: "\f07b";
}
.treeview .extend .folder > ul{
  display: none;
}
.folder i
{
	font-style: normal;
	color: var(--primary-color);


}
.main-tree
{
	background-color: var(--baby-blue2);;
	padding: 15px !important;
	border-radius: 15px;
	display: inline-block;
	margin-bottom: 0px;
	margin-left: 50px;
	cursor: pointer;
	position: relative;
}
.main-tree:after
{
	content: "";
	width: 30px;
	height: 1px;
	left: -40px;
	top: 50%;
	transform: translateY(-50%);
	background-color: var(--baby-grey);;
	position: absolute;
}
.ul-main-tree
{
	padding-right: 50px;
}
.treeview .extend input{
  display: none;
}
.treeview .extend input[type=checkbox] + i:before {
	font-family:'Icons3';
  content: "\f07b";
  color: #111;
  font-size: 1.3em;
  cursor: pointer;
	font-style: normal;
	margin-left: 15px;
	color: var(--primary-color);
}
.folder i
{
	font-size: 1.3em;
	padding: 15px 0px;
}
.treeview .extend input[type=checkbox]:checked + i:before{
	font-family:'Icons3';
  content: "\f07c";
	font-style: normal;
	font-size: 1.3em;
}
.treeview .extend input[type=checkbox]:checked ~ ul{
  display: inline-block;
	border-right: 1px solid var(--baby-grey);;
}
.treeview .extend input[type=checkbox]:checked ~ ul li a:before
{
	content: "";
	width: 80px;
	height: 1px;
	right: -130px;
	top: 50%;
	transform: translateY(-50%);
	background-color: var(--baby-grey);;
	position: absolute;
}
.area-message
{
	padding: 10px 0px;
    border: 0px;
    width: 100%;
    font-family: var(--body-fonts);
    outline: none;
	min-height: 200px;
	width: 100%;
	max-width: 100%;
}
.contact-form
{
	width: 100%;
	margin-top: 30px;
}
.contact-form ul li
{
	width: 100%;
	margin-bottom: 50px;
}
.contact-form ul li:last-child
{
	margin-bottom: 0px;
}
.contact-form ul li label.error {
    font-size: 12px;
    position: absolute;
    bottom: -7px;
    padding: 0px 5px;
    background-color: var(--white);;
    right: 20px;
}
.contact-form ul li .form-group:nth-of-type(1)
{
	margin-bottom: 30px;
}
.alert-success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
	position: relative;
    padding: 0.75rem var(--l-font);
    margin-bottom: var(--m-font);
    border: 1px solid transparent;
    border-radius: 0.25rem;
	display: none;
	width: 100%;
	text-align: center;
}
.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
	position: relative;
    padding: 0.75rem var(--l-font);
    margin-bottom: var(--m-font);
    border: 1px solid transparent;
    border-radius: 0.25rem;
	display: none;
	width: 100%;
	text-align: center;
}
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}
@-moz-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}
@-o-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}

@keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}
.show-massage
{
	display:block;
	-webkit-animation: fadeIn 1s;
	-moz-animation: fadeIn 1s;
    animation: fadeIn 1s;
	-o-animation: fadeIn 1s;
}
.student-top
{
	padding:30px 0px;
	margin-bottom: 30px;
}
.right-student img
{
	width: 130px;
	height: 130px;
	border-radius: 100%;
	border:5px solid var(--white);;
}
.right-student .student-name
{
	margin-right: 15px;
}
.student-name h2
{
	margin-bottom: 5px;
}
.profile-link
{
	background-color: var(--white);;
	padding: 10px 15px;
	border-radius: 40px;
	margin-left: 30px;
}
.profile-link:hover
{
	background-color: var(--color2);
	color: var(--white);;
}
.log-out
{
	border:1px solid var(--white);;
	padding: 10px 15px;
	border-radius: 40px;
}
.log-out:before
{
	content: "\f08b";
	font-family:"Icons4";
	margin-left: 5px;
}
.log-out:hover
{
	background-color: var(--white);;
	color: var(--primary-color);
}
.menu-student ul li a
{
	color: var(--black);
	border-radius: 40px;
}
.menu-student ul li a.active-student
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.active-student
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.menu-student ul li a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.student-header
{
	margin-top: 30px;
}
.notification a
{
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: 100%;
	position: relative;
	color: var(--black);
}
.notification a span
{
	position: absolute;
	top: 0px;
	right: 0px;
	background-color: #CF0F0F;
	color: var(--white);;
	width: 18px;
	line-height: 18px;
	text-align: center;
	border-radius: 100%;
	height: 18px;
}
.notification-pill
{
	margin-left: 30px;
	background-color: var(--baby-red);;
	color: var(--black);
}
.notification-pill:before
{
	content: "\f0f3";
	font-family:"Icons4";
}
.notification-mail
{
	background-color: var(--baby-blue2);;
	color: var(--black);
}
.notification-mail:before
{
	content: "\f0e0";
	font-family:"Icons4";
}
.section-inner-student
{
	padding-bottom: 50px;
}
.quick-numbers ul li
{
	border-radius: 15px;
	border: 1px solid var(--baby-grey);;
	width: 277px;
	margin-left: 30px;
	padding: 15px;
	background-color: var(--baby-red);;
	color: var(--black);
	border-radius: 15px;
}
.quick-numbers ul li:last-child
{
	margin-left: 0px;
}
.quick-numbers ul li:nth-child(2)
{
	background-color: var(--baby-blue2);;
}
.quick-numbers ul li:nth-child(3)
{
	background-color: var(--baby-yellow);;
}
.quick-numbers ul li:nth-child(4)
{
	background-color: #fafcff;
}
/*.quick-numbers ul li a
{
	padding: 15px;
	background-color: var(--baby-red);;
	color: var(--black);
	border-radius: 15px;
}*/
.quick-numbers ul li:nth-child(2) a
{
	background-color: var(--baby-blue2);;
}
.quick-numbers ul li:nth-child(3) a
{
	background-color: var(--baby-yellow);;
}
.quick-numbers ul li:nth-child(4) a
{
	background-color: #fafcff;
}
.right-quick span
{
	margin-bottom: 5px;
	display: block;
}
.right-quick span,.right-quick h2
{
	color: var(--black);
}
.right-quick h2
{
	font-size: 2rem;
}
.quick-numbers ul li img
{
	height: 50px;
}
.profile-student ul li
{
	margin-left: 30px;
	margin-top: 30px;
	width: 277px;
	position: relative;

	text-align: center;
}
.profile-student ul li:nth-child(2n)
{
	margin-left: 0px;
}
.profile-student ul li:nth-child(1),.profile-student ul li:nth-child(2)
{
	margin-top: 0px;
}
.profile-student ul li a
{
	min-height: 140px;
	padding: 15px;
	border: 1px solid var(--baby-grey);;
	border-radius: 15px;
}
.profile-student ul li a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.profile-student ul li a:hover i, .profile-student ul li a:hover h2, .profile-student ul li a:hover p
{
	color: var(--white);;
}
.profile-student ul li:last-child
{
	margin-left: 0px;
}
/*.profile-student ul li:nth-child(3)
{
	margin-left: 0px;
	width: 585px;
}*/
.profile-student ul li a i
{
	font-family:"Icons4";
	font-size: 2.5rem;
	font-style: normal;
	margin-bottom: 10px;
	display: block;
	color: var(--primary-color);
}
/*.profile-student ul li:nth-child(3) a i
{
	margin-bottom: 0px;
	margin-left: 10px;
}*/
.profile-student ul li a p
{
	color: var(--black);
	margin-top: 10px;
}
.profile-student ul li a h2
{
	color: var(--black);
}
.icon1:before
{
	content: "\f073";
}
.icon2:before
{
	content: "\f0f2";
}
.icon3:before
{
	content: "\f090";
}
.icon4:before
{
	content: "\f15c";
}
.icon5:before
{
	content: "\f5db";
}
.icon6:before
{
	content: "\f5da";
}
.icon7:before
{
	content: "\f304";
}
.icon8:before
{
	content: "\f02d";
}
.icon9:before
{
	content: "\f0e0";
}
.iconp:before
{
	content:"\f0f3";
}
.student-title i
{
	font-family:"Icons4";
	font-size: 2.5rem;
	font-style: normal;
	margin-left: 10px;
	display: block;
	color: var(--primary-color);
}
.table
{
	margin-top: 30px;
	position: relative;
}
.table .tooltip
{
	    left: 15%;
	width: 200px;
	    top: -14%;
}
.table .tooltip::after
{
	top: calc(80% - 6px);
}
.table table.dataTable
{
	border: 1px solid var(--baby-grey);;
	 -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
	border-spacing: 0;
  border-collapse: separate;
}
.table table.dataTable.no-footer
{
	border-bottom: 1px solid var(--baby-grey);;
}
.table table.dataTable thead th,.table table.dataTable thead td,.table table.dataTable tfoot th,.table table.dataTable tfoot td
{
	text-align: right;
}
.table .dataTable th
{
	background-color: var(--baby-blue2);;
	border-bottom: 0px;
}
.table .dataTable th:nth-child(1)
{
	border-top-right-radius: 10px;
}
.table .dataTable th:last-child
{
	border-top-left-radius: 10px;
}
.table table.dataTable thead th, table.dataTable thead td
{
	padding: 15px;
}

.table table.dataTable.display tbody tr td
{
	padding: 15px;
}
.table table.dataTable.display tbody tr:last-child td:nth-child(1)
{
	border-bottom-right-radius: 10px;
}
.table table.dataTable.display tbody tr:last-child td:last-child
{
	border-bottom-left-radius: 10px;
}
.table .dataTables_wrapper .dataTables_paginate {
    text-align: left;
    padding-top: 30px;
	float:left;
}
.table .dataTables_wrapper .dataTables_paginate .paginate_button {
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 0.5em 1em !important;
    margin-left: 2px !important;
    text-align: center;
	background: var(--baby-grey2); !important;
    text-decoration: none !important;
	background-color: var(--baby-grey2); !important;
	border-radius: 30px !important;
    cursor: pointer !important;
    color: #333 !important;
    border: 0 !important;
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.table .dataTables_wrapper .dataTables_paginate span .paginate_button
{
	border-radius: 100%;
	width: 35px;
	height: 35px;
	text-align: center;
	/*margin: 0px 5px;*/
}
.dataTables_wrapper .dataTables_paginate.paging_simple_numbers .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate.paging_simple_numbers .paginate_button.disabled:active
{
	color: var(--white) !important;
}
.dataTables_wrapper .dataTables_paginate span .paginate_button.current:hover
{
	color: var(--white) !important;
}
.table .dataTable td h4
{
	position: relative;
}
.not-done
{
	border: 1px solid #DC3545;
	padding: 10px 15px;
	color:#DC3545;
	border-radius: 7px;
	display: inline-block;
	width: 60%;
	text-align: center;
}
.done
{
	border: 1px solid var(--green);
	padding: 10px 15px;
	color:var(--green);
	border-radius: 7px;
	display: inline-block;
	width: 60%;
	text-align: center;
}
.link-homework
{
	color: var(--black);
}
.table .dataTables_wrapper .dataTables_paginate .paginate_button:hover
{
	background-color: var(--primary-color) !important;
	color: var(--white) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover
{
	background-color: var(--primary-color) !important;
	color: var(--white) !important;
}
.link-homework i
{
	font-family:"Icons4";
	font-size: var(--m-font);
	font-style: normal;
	margin-left: 10px;
	display: block;
	color: var(--color2);
}
.table.forums-table table.dataTable.display tbody tr td:nth-child(1)
{
	width: 20%;
}
.table.forums-table table.dataTable.display tbody tr td:nth-child(2)
{
	width: 50%;
}
.table.forums-table table.dataTable.display tbody tr td:nth-child(3)
{
	width: 15%;
	text-align: center;
}
.table.forums-table table.dataTable.display tbody tr td:nth-child(4)
{
	width: 15%;
	text-align: center;
}
.table.forums-table table.dataTable.display thead th:nth-child(3)
{
	width: 15%;
	text-align: center;
}
.table.forums-table table.dataTable.display thead th:nth-child(4)
{
	width: 15%;
	text-align: center;
}
.table.forums-table h4
{
	line-height: 1.4rem;
}
.by
{
	margin-right: 5px;
}
.icon-pe
{
	transform: rotate(45deg);
}
.icon-pe:before
{
	content: "\f08d";
}

.table.forums-table2 table.dataTable.display tbody tr td:nth-child(1)
{
	width: 15%;
}
.table.forums-table2 table.dataTable.display tbody tr td:nth-child(2)
{
	width: 40%;
}
.table.forums-table2 table.dataTable.display tbody tr td:nth-child(3)
{
	width: 15%;
	text-align: center;
}
.table.forums-table2 table.dataTable.display tbody tr td:nth-child(4)
{
	width: 15%;
	text-align: center;
}
.table.forums-table2 table.dataTable.display tbody tr td:nth-child(5)
{
	width: 15%;
	text-align: center;
}
.table.forums-table2 table.dataTable.display thead th:nth-child(3)
{
	width: 15%;
	text-align: center;
}
.table.forums-table2 table.dataTable.display thead th:nth-child(4)
{
	width: 15%;
	text-align: center;
}
.table.forums-table2 table.dataTable.display thead th:nth-child(5)
{
	width: 15%;
	text-align: center;
}
.tabs {
  position: relative;
  overflow: hidden;
  margin: 0;
  width: 100%;
}
.tabs li {
	margin-left: 15px;
}
.tabs li:last-child
{
	margin-left: 0px;
}
.tabs a {
  background-color: transparent;
  border: 1px solid var(--baby-grey);;
  color: var(--black);
  font-weight: 500;
	border-radius: 30px;
  outline: none;
  padding: 15px 20px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.tabs_item {
  display: none;
  padding: 30px 0;
}
.current2 a {
  color: var(--white);;
  background: var(--primary-color);
}
.current2{
  display: block !important;
}
.course-name
{
	margin-bottom: 30px;
}
.morelessons ul li
{
	padding: 15px;
	border-radius: 10px;
	border: 1px solid var(--baby-grey);;
	background-color: #F8FBFF;
}
.morelessons ul li .course-title
{
	margin-top: 0px;
	margin-right: 15px;
	width: calc(100% - 70px);
}
.morelessons ul li .down-course
{
	padding-top: 0px;
	margin-top: 0px;
	border-top: 0px;
}
.morelessons ul li
{
	margin-bottom: 15px;
}
.morelessons ul li:last-child
{
	margin-bottom: 0px;
}
.lesson-details
{
	width: 780px;
	margin-left: 50px;
}
.morelessons
{
	overflow-y: scroll;
	height: 575px;
	padding-left: 30px;
	width: 370px;
}

::-webkit-selection {
  background-color: var(--primary-color);
  color: rgba(0, 0, 0, 0.87);
}

::-moz-selection {
  background-color: var(--primary-color);
  color: rgba(0, 0, 0, 0.87);
}

::selection {
  background-color: var(--primary-color);
  color: rgba(0, 0, 0, 0.87);
}


/* Force Simple Scrollbars */

body ::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
  height: 7px;
}

body ::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.1);
	border-radius: 5px;
}

body ::-webkit-scrollbar-thumb {
  cursor: pointer;
  border-radius: 5px;
  background: var(--primary-color);
  -webkit-transition: color 0.2s ease;
  transition: color 0.2s ease;
}

body ::-webkit-scrollbar-thumb:window-inactive {
  background: rgba(0, 0, 0, 0.15);
}

body ::-webkit-scrollbar-thumb:hover {
  background: rgba(128, 135, 139, 0.8);
}

/* Inverted UI */

body .ui.inverted::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
}

body .ui.inverted::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.25);
}

body .ui.inverted::-webkit-scrollbar-thumb:window-inactive {
  background: rgba(255, 255, 255, 0.15);
}

body .ui.inverted::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.35);
}
.icon-lesson5
{
	width: 40px;
}

.morelessons ul li:nth-child(2n) .icon-lesson5
{
	color: #9D9D9D
}

.morelessons-new ul li
{
	padding: 15px;
	border-radius: 10px;
	border: 1px solid var(--baby-grey);;
	background-color: #F8FBFF;

}
.morelessons-new ul li .course-title
{
	margin-top: 0px;
	margin-right: 15px;
	width: calc(100% - 70px);
}
.morelessons-new ul li .down-course
{
	padding-top: 0px;
	margin-top: 0px;
	border-top: 0px;
}
.morelessons-new ul li
{
	width: 380px;
	margin-left: 30px;
	margin-top: 30px;
}
.morelessons-new ul li:nth-child(3n)
{
	margin-left: 0px;
}
.morelessons-new ul li:nth-child(-n+3)
{
	margin-top: 0px;
}
.inter-leb
{
	width: 50px;
}
.all-new
{
	margin-bottom: 30px;
}
.new-d .courses
{
	width: 870px;
	margin-left: 30px;
}
.new-d .courses ul li:nth-child(4n)
{
	margin-left: 0px;
}
.new-d .courses ul li
{
	width: 195px;
}
.new-d .courses ul li:nth-child(5) {
    margin-top: 30px;
}
.left-d
{
	width: 300px;
}
.section-books
{
	padding: 15px;
	border: 1px solid var(--baby-grey);;
	border-radius: 15px;

}
.section-books ul li
{
	margin-bottom: 15px;
	border-bottom: 1px solid var(--baby-grey);;
	padding-bottom: 15px;

}
.section-books ul li:last-child
{
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: 0px;
}
.section-books ul li a h2
{
	color: var(--black);
}
.section-books ul li .inter-leb
{
	width: 30px;
}
.all-new .left-course
{
	width: calc(100% - 60px);
}
.all-new .left-course .more{
	margin-top: 0px;
}
.icon-book2 img
{
	width:50px;
}
.border-t
{
	padding-top: 15px;
    border-top: 1px solid var(--baby-grey);;
    margin-top: 15px;
}
.small-title h2:before
{
	content: "\f161";
	font-family: "Icons3";
	color: var(--color2);
	margin-left: 10px;
}
.mail-section
{
	margin-top: 30px;
}
.mail-section ul li
{
	width: 277px;
	margin-left: 30px;
	position: relative;

}
.mail-section ul li:last-child
{
	margin-left: 0px;
}
.mail-section ul li a
{
	border: 1px solid var(--baby-grey);;
	padding: 25px 15px;
	border-radius: 15px;
}
.mail-section ul li a span
{
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	border-radius: 100%;
	position: absolute;
	top: -12.5px;
	left: -12.5px;
}
.mail-section ul li a h2
{
	color: var(--black);
}
.m1,.m2,.m3,.m4
{
	font-family: "Icons3";
	color: var(--primary-color);
	font-size: 2rem;
	font-style: normal;
}
.m1:before
{
	content: "\f590";
}
.m2:before
{
	content: "\f51c";
}
.m3:before
{
	content: "\f508";
}
.m4:before
{
	content: "\f19d";
}
.mail-section ul li a:hover
{
	background-color: var(--baby-blue2);
}
.left-ma i
{
	margin-left: 10px;
}
.unread
{font-family: "Icons3";
	color: var(--black);
	font-size: 1.5rem;
	font-style: normal;
}
.unread:before
{
	content: "\f0e0";
}
.read{
	font-family: "Icons3";
	color: var(--grey3);;
	font-size: 1.5rem;
	font-style: normal;
}
.read-color
{
	color: var(--grey3);;
}
.read:before
{
	content: "\f2b6";
}
.table.forums-table3 table.dataTable.display tbody tr td:nth-child(1)
{
	width: 50%;
}
.table.forums-table3 table.dataTable.display tbody tr td:nth-child(2)
{
	width: 25%;
}
.table.forums-table3 table.dataTable.display tbody tr td:nth-child(3)
{
	width: 25%;
	text-align: center;
}
.table.forums-table3 table.dataTable.display thead tr th:nth-child(1)
{
	width: 50%;
}
.table.forums-table3 table.dataTable.display thead tr th:nth-child(2)
{
	width: 25%;
}
.table.forums-table3 table.dataTable.display thead tr th:nth-child(3)
{
	width: 25%;
	text-align: center;
}
.name-t
{
	margin-top: 15px;
}
.print
{
	color: var(--white);;
	background-color: #333;
	padding: 13px 15px;
}
.print:before
{
	font-family: "Icons3";
	color: var(--white);;
	content: "\f02f";
	margin-left: 5px;

}

.table.forums-table4 table.dataTable.display tbody tr td:nth-child(1)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display tbody tr td:nth-child(2)
{
	width: 40%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display tbody tr td:nth-child(3)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display tbody tr td:nth-child(4)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display tbody tr td:nth-child(5)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display thead tr th:nth-child(1)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display thead tr th:nth-child(2)
{
	width: 40%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display thead tr th:nth-child(3)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display thead tr th:nth-child(4)
{
	width: 15%;
	text-align: center;
}
.table.forums-table4 table.dataTable.display thead tr th:nth-child(5)
{
	width: 15%;
	text-align: center;
}
.all-calender
{
	border:1px solid var(--baby-grey);;
	border-radius: 15px;
}
.day
{
	border-left: 1px solid var(--baby-grey);;
	width: 171.1px;
}
.day:last-of-type
{
	border-left: 0px;
}
.day:nth-child(1) .top-day
{
	border-top-right-radius: 15px;
}
.day:nth-child(7) .top-day
{
	border-top-left-radius: 15px;
}
.top-day
{
	text-align: center;
	background-color: var(--baby-blue2);;
	padding:20px 15px;
}
.calender-times ul li
{
	margin: 10px;
	padding: 10px;
	background-color: var(--baby-red);;
	border-radius: 5px;
	text-align: center;
}
.calender-times ul li img
{
	width: 50px;
	height: 50px;
	border-radius: 100%;
	margin:0px auto 5px auto;

}
.all-calender
{
	margin-top: 30px;
}
.all-calender .day:nth-child(2) ul li
{
	background-color: var(--baby-blue2);;
}
.all-calender .day:nth-child(3) ul li
{
	background-color: var(--baby-yellow);;
}
.all-calender .day:nth-child(4) ul li
{
	background-color: #F5FDF9;
}

.all-calender .day:nth-child(6) ul li
{
	background-color: var(--baby-blue2);
}

.all-calender .day:nth-child(7) ul li
{
	background-color: var(--baby-yellow);
}
.studen-details ul li
{
	width: 277px;
	margin-left: 30px;
	margin-top: 30px;
	position: relative;
}
.studen-details ul li:nth-child(4n)
{
	margin-left: 0px;
}
.studen-details ul li:nth-child(-n+4)
{
	margin-top: 0px;
}
.studen-details ul li a
{
	border: 1px solid var(--baby-grey);;
	border-radius: 10px;
	padding: 15px;
	align-items: center;
	align-content: center;
}
.studen-details ul li a i
{
	font-family: "Icons4";
    font-size: 2rem;
    font-style: normal;
    margin-left: 10px;
    display: block;
    color: var(--primary-color);
}
.studen-details ul li a h2
{
	color: var(--black);
}
.studen-details ul li a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.studen-details ul li a:hover h2
{
	color: var(--white);;
}
.studen-details ul li a:hover i
{
	color: var(--white);;
}
.icon1s:before
{
	content: "\f03d";
}
.icon2s:before
{
	content: "\f130";
}
.icon3s:before
{
	content: "\f019";
}
.top-d
{
	background-color:var(--baby-blue2);;
	border-radius: 15px;
	border:1px solid var(--baby-grey);;
	margin-bottom: 30px;
}
.top-d ul li
{
	text-align: center;
	width: 299px;
	border-left: 1px solid var(--baby-grey);;
	align-content: center;
	align-items: center;
	padding: 30px;

}
.top-d ul li span
{
	display: block;
	width: 100%;
}
.top-d ul li:last-child
{
	border-left: 0px;
}
.icon-mass
{
	width: 70px;
	height: 70px;
	line-height: 70px;
	font-size: 2rem;
	background-color: #F3F3F3;
	color: #BFBFBF;
	font-family: "Icons4";
	border-radius: 100%;
	text-align: center;
}
.icon-mass:before
{

	content: "\f102";
}
.massage-from
{
	margin-top: 30px;
}
.massage-details
{
	background-color: #F3F3F3;
	border-radius: 10px;
	padding: 15px;
	width: 550px;
	margin-right: 20px;
	position: relative;
	margin-top: 30px;
}
.massage-details:before
{
	content: "\f0da";
	font-family: "Icons3";
	font-size: 2rem;
	right: -11px;
	top: 0px;
	position: absolute;
	color:  #F3F3F3;
}
.p-name
{
	margin-bottom: 5px;
}

.p-name span:before
{
	content: "\f007";
	font-family: "Icons3";
	font-size: .9rem;
	color:  var(--grey4);
	margin-left: 5px;
}
.time-massage span:before
{
	content: "\f017";
	font-family: "Icons4";
	font-size: .9rem;
	color:  var(--grey4);
	margin-left: 5px;
}
.massage-title
{
	margin: 10px 0px;
}
.massage-desk
{
	    font-size: var(--s-font);
	    color: var(--grey4);
	line-height: 1.2rem;
}
.massage-to
{
	margin-top: 30px;
}
.massage-to .massage-details
{
    margin-right: 0px;
	margin-left: 20px;
}
.massage-to .massage-details:before
{
	content: "\f0d9";
	left: -11px;
	right: inherit;
	top: 0px;
	color: var(--baby-blue2);
}
.massage-to .icon-mass:before {
    content: "\f103";
}
.massage-to .icon-mass
{
	background-color: var(--baby-blue2);;
}
.massage-to .massage-details
{
	background-color: var(--baby-blue2);;
}
.right-forums
{
	border: 1px solid var(--baby-grey);;
	border-radius: 15px;
	padding: 30px;
	width: 380px;
	margin-left: 30px;
}
.right-forums ul
{
	overflow-y: scroll;
	height: 795px;
	padding:0px 0px 0px 30px;

}
.right-forums ul li
{
	margin-bottom: 15px;
}
.left-forums
{
	background-color: var(--baby-grey2);;
	width: 790px;
	border-radius: 15px;
	padding: 30px;
}
.inner-left-forums
{
	overflow-y: scroll;
	height: 600px;
	padding:0px 0px 0px 30px;
}
.title-forums
{
	text-align: center;
	margin-bottom: 30px;
}
.icon-reply
{
	    width: 60px;
    height: 60px;
    line-height: 60px;
    font-size: 1.5rem;
    background-color: var(--white);;
    color: #BFBFBF;
    font-family: "Icons3";
    border-radius: 100%;
    text-align: center;
}
.icon-reply:before
{
	content: "\f007";
}
.down-re
{
	width: 618px;
	margin-right: 15px;
}
.down-re .massage-desk
{
	padding: 15px;
	border-radius: 15px;
	background-color: var(--white);;
}
.date-reo
{
	margin-top: 10px;
	display: block;
}
.top-reply-block
{
	align-items: flex-end;
	align-content: flex-end;
	margin-bottom: 30px;
}
.top-reply-block2
{
	align-items: flex-end;
	align-content: flex-end;
	margin-bottom: 30px;
}
.top-reply-block2 .down-re
{
	width: 618px;
	margin-right: 0px;
	margin-left: 15px;
}
.top-reply-block2 .date-reo
{
	text-align: left;
}
.area-text
{
	width: 80%;
	background-color: transparent;
	border: 0px;
	max-width: 80%;
	text-align: right;
	 direction: rtl;
	 margin:0;
    padding:0;
    overflow-x:hidden;
}
.send-button
{
	width: 20%;
    font-size: 1.5rem;
    color: var(--primary-color);
    font-family: "Icons3";
    border-radius: 100%;
    text-align: center;
	border:0px;
	background-color: transparent;
	cursor: pointer;
	text-align: center;
}
.send-button:before
{
	content: "\f1d8";
}
.send-massage
{
	background-color: #FBFBFB;
	padding: 20px;
	border-radius: 15px;
	margin-top: 20px;
}
.forums-details
{
	margin-top: 30px;
}
.edit-data
{
	width: 940px;
}
.send-email ul li
{
	margin-top: 50px;
}
.send-email ul li h3
{
	margin-bottom: 15px;
}
.grid
{
	width: 100%;
	min-height: 150px;
	background-color: var(--baby-grey2);;
	margin-top: 30px;
}
.di
{
	display: inline-block;
}
.new-m
{
	margin-left: 30px;
}
.new-m a
{
	padding: 10px 15px;
	border-radius: 10px;
}
.new-m a:before
{
	content: "\f044";
	font-family: "Icons4";
	margin-left: 10px;
}
.new-m a:hover
{
	opacity: 0.8;
}
.share-with-us
{
	margin-top: 30px;
}
.idea
{
	color: var(--color2) !important;
}
.idea:before
{
	content: "\f672";
	font-family: "Icons4";
	margin-left: 10px;
}
.page-login
{
	width: 455px;
	margin: auto;
}
.page-login ul li {
    width: 100%;
	margin-top: 50px;
	text-align: left;
}
.page-login ul li a
{
	margin-top: 10px;
}
.page-login ul li:nth-child(1)
{
	margin-top: 0px;
}
.page-login ul li label.error
{
	    font-size: 12px;
    position: absolute;
    bottom: -7px;
    padding: 0px 5px;
    background-color: var(--white);;
    right: 20px;
}
.after-change
{
	text-align: center;
}
.after-change h2
{
	margin-bottom: 30px;
	color: #4BB543;
}
.after-change a
{
	padding: 15px 20px;
	border-radius: 7px;
	display: inline-block;
}
.show-v
{
	border: 1px solid var(--baby-grey);;
    border-radius: 10px;
    padding: 15px;
	background-color: var(--baby-blue2);;
	color: var(--black);
	text-align: center;
	width: 60%;
	display: inline-block;

}
.show-v:before
{
	font-family: "Icons4";
    font-size: 1.3rem;
    font-style: normal;
    margin-left: 10px;
    display: block;
    color: var(--primary-color);
	content: "\f03d";
	display: inline-block;
}

.show-s
{
	border: 1px solid var(--baby-grey);;
    border-radius: 10px;
    padding: 15px;
	background-color: var(--baby-blue2);;
	color: var(--black);
	text-align: center;
	width: 60%;
	display: inline-block;

}
.show-s:before
{
	font-family: "Icons4";
    font-size: 1.3rem;
    font-style: normal;
    margin-left: 10px;
    display: block;
    color: var(--primary-color);
	content: "\f130";
	display: inline-block;
}
.all-quiz
{
	padding: 30px;
	border: 1px solid var(--baby-grey);;
	border-radius: 10px;
}
.title-q
{

	position: relative;
}
.title-q h2
{
	display: inline-block;
	background-color: var(--white);;
	padding: 0px 10px;position: absolute;
	top: -45px;
	position: absolute;
	right: 0px;
}
.question
{
	margin: 0px auto 30px auto;
	position: relative;
}
.choose-answer
{
	margin-bottom: 20px;
}
.choose-answer ul li
{
	width: 320px;
	height: 40px;
	border-radius: 10px;
	margin-left: 30px;
}
.choose-answer ul li:last-child
{
	margin-left: 0px;
}
.answer span





{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	padding: 0px 50px 0px 10px;
	text-align: right;
	display: block;
	width: 100%
}
.answer input[type=radio] {
	display: none;
}
.answer input[type=radio] + label {
	border: 1px solid var(--baby-grey);;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
	/*width: 150px;*/
	height: 44px;
	position: relative;
	cursor: pointer;
	color: var(--black);
	display: block;
	border-radius: 3px;
}
.answer input[type=radio] + label:hover:after{
	background: var(--primary-color);
	color: var(--white)!important;
}
.answer input[type=radio] + label:hover {
	background: var(--baby-blue2);;
	color:var(--black) !important;
}

.answer input[type=radio]:checked + label {
	background: var(--baby-blue2);;
}

.answer input[type=radio]:checked ~ label[for=" "] {
	background: var(--primary-color);
}
.answer.check {
	overflow: visible !important;
}

.check .radio label:after {
	background: var(--baby-blue2);;

	border-radius: 3px;
	content: "";
	height: 38px;
	right: 2px;
	opacity: 1;
	position: absolute;
	top: 2px;
	transition: opacity 100ms ease-in;
	width: 40px;
}

.check .radio label:before {
	display: none;
	background: #333;
	font-family: "Icons2";
	content: "";
	height: 14px;
	right: 13px;
	opacity: 1;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	transition: opacity 100ms ease-in;
	background: transparent;
	width: 14px;
	z-index: 9999;
	font-size: 14px;
	color: var(--black);
}

.answer.check .radio input[type="radio"] {
	margin-left: 0 !important;
}



.answer.check .radio input[type="radio"]:checked + label span {
	color: var(--black) !important;
}

.answer.check .radio input[type="radio"]:checked + label:after {
	opacity: 1;
	background-color: var(--primary-color);
}

.answer.check .radio input[type="radio"]:checked + label:before {
	display: block;
	content: "\f00c";
	color: var(--white);
}
.question-alone
{
	margin-bottom: 30px;
	border-bottom: 1px solid var(--baby-grey);;
	padding-bottom: 30px;
}
.question-alone:last-child
{
	/*padding-bottom: 0px;*/
	border-bottom: 0px;
}
.all-quiz
{
	/*width: 600px;*/
	margin:50px  0px 0px 0px;
}
.save
{
		text-align: center;
	margin-top: 50px;
}
.save a
{
	padding: 10px 15px;
	border-radius: 5px;
	display: inline-block;
	text-align: center;
}
.save a:hover
{
	background-color: var(--color2);
}
.question-result
{
	width: 600px;
	margin: 30px auto 0px auto
}
.question-result ul li
{
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid var(--baby-grey);;
	text-align: center;
}
.question-result ul li:last-child
{
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: 0px;
}
.answer input[type=radio]:checked + label.true
{
	border: 1px solid var(--green);
}
.answer input[type=radio] + label.true
{
	border: 1px solid var(--green);
}
.answer.check .radio input[type="radio"] + label.true span {
	color: #40C16B!important;
}
.answer.check .radio input[type="radio"] + label.falsee span {
	color: #DC3545!important;
}
.answer input[type=radio]:checked + label.falsee
{
	border: 1px solid #DC3545
}
.answer input[type=radio] + label.falsee
{
	border: 1px solid #DC3545
}
.answer.check .radio input[type="radio"]:checked + label.true:after
{
	background-color: var(--green);
}
.answer.check .radio input[type="radio"] + label.true:after
{
	background-color: var(--green);
}
.answer.check .radio input[type="radio"] + label.falsee:after
{
	background-color: #DC3545;
}
.answer.check .radio input[type="radio"]:checked + label.falsee:after
{
	background-color: #DC3545;
}
.answer-c
{
	position: absolute;
	left: 0px;
	bottom: 0;
	background-color: #F5FDF9;
	padding: 10px;
	border-radius: 4px;

}
.answer-c span
{
	color: var(--green);
}
.answer-c span:before
{
	content: "\f00c";
	font-family: "Icons2";
	color: var(--green);
	margin-left: 5px;
}

.answer-f
{
	position: absolute;
	left: 0px;
	bottom: 0px;
	background-color: var(--baby-red);;
	padding: 10px;
	border-radius: 4px;

}
.answer-f span
{
	color: #DC3545;

}
.answer-f span:before
{
	content: "\f00d";
	font-family: "Icons2";
	color: #DC3545;
	margin-left: 5px;
}
.question-alone
{
	position: relative;
}
.degree
{
	text-align: center;
	margin-top: 30px;
}
.degree h2
{
	margin-bottom: 10px;
}
.degree span
{
	width: 90px;
	height: 90px;
	line-height: 80px;
	display: block;
	border:5px solid var(--primary-color);
	border-radius: 100%;
	text-align: center;
	margin: auto;
}
.expand
{
	display: inline-block;
	margin-top: 10px;

}
.expand:after
{
	content: "\f0d7";
	font-family: "Icons3";
	margin-right: 5px;
}
.collapse
{
	display: none;
	margin-top: 10px;
}
.collapse:after
{
	content: "\f0d8";
	font-family: "Icons3";
	margin-right: 5px;
}
.expand-div
{
	height: 385px;
	overflow: hidden;
	 transition: height 0.15s ease-out;

}
.back-to a
{
	padding: 15px 15px;
	border-radius: 7px;
	display: inline-block;
}
.back-to a:before
{
	content: "\f109";
	font-family: "Icons3";
	margin-left: 5px;
}
.back-to.all-b a:after
{
	content: "\f30a";
	font-family: "Icons3";
	margin-right: 5px;
}
.back-to.all-b a:before
{
	display: none;
}
.step-web
{
	margin:0px auto 30px auto;
	width: 790px;
	padding: 30px;
		background-color: var(--baby-blue2);;
	border-radius: 10px;
}
.step-web:nth-child(2)
{
	background-color: var(--baby-red);;
}
.step-web:nth-child(3)
{
	background-color: var(--baby-yellow);;
}
.step-web:nth-child(4)
{
	background-color: #F5FDF9;
}
.step-web span
{
	display: block;
	margin-bottom: 10px;
	font-size: var(--s-font)
}
.step-web h2
{
	    color: var(--primary-color);
	    font-size: var(--l-font);
	    font-weight: 800;
}
.step-web img
{
	width: 100%;
	margin: 30px 0px;
}
.forums-links ul li
{
	margin-left: 15px;
	margin-bottom: 25px;
}
.forums-links ul li:last-child
{
	margin-left: 0px;
}
.forums-links ul li a
{
	padding: 10px 15px;
	color: var(--black);
	border-radius: 7px;
	text-align: center;
}
.forums-links ul li a:before
{
	font-family: "Icons3";
	margin-left: 5px;
}
.forums-links ul li:nth-child(1) a
{
	background-color: var(--baby-blue2);;
}
.forums-links ul li:nth-child(1) a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.forums-links ul li:nth-child(1) a:hover:before
{
	color: var(--white);;
}
.forums-links ul li:nth-child(2) a
{
	background-color: var(--baby-red);;
}
.forums-links ul li:nth-child(2) a:hover
{
	background-color: var(--color2);
	color: var(--white);;
}
.forums-links ul li:nth-child(2) a:hover:before
{
	color: var(--white);;
}
.forums-links ul li:nth-child(3) a
{
	background-color: var(--baby-yellow);;
}
.forums-links ul li:nth-child(3) a:hover
{
	background-color: var(--yellow);
	color: var(--white);
}
.forums-links ul li:nth-child(3) a:hover:before
{
	color: var(--white);;
}
.forums-links ul li:nth-child(4) a
{
	background-color: #F5FDF9;
}
.forums-links ul li:nth-child(4) a:hover
{
	background-color: var(--green);
	color: var(--white);;
}
.forums-links ul li:nth-child(4) a:hover:before
{
	color: var(--white);;
}
.forums-links ul li:nth-child(5) a
{
	background-color: var(--baby-red);;
}.forums-links ul li:nth-child(5) a:hover
{
	background-color: var(--color2);
	color: var(--white);;
}
.forums-links ul li:nth-child(5) a:hover:before
{
	color: var(--white);;
}
.edit-p:before
{
	content: "\f044";
	color: var(--primary-color);
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.hide-p:before
{
	content: "\f1f8";
	color: var(--color2);    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;

}
.force-p:before
{
	content: "\f05e";
	color: var(--yellow);;
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;

}
.open-p:before
{
	content: "\f3c1";
	color: var(--green);
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;

}
.close-p:before
{
	content: "\f023";
	color: var(--color2);
	    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;

}
.area-answer
{
	background-color: #fbfbfb;
	border-radius: 10px;
	border-radius: 10px;
	padding: 15px;
	width: 100%;
	max-width: 100%;
	border: 0px;
	min-height: 200px;
	max-height: 200px;

}
.center-connectivety
{
	width: 80px;
}
.center-connectivety ul li input
{
	border: 0px;
	width: 80px;
	background-color: var(--baby-grey2);;
	border-radius: 5px;
}
.right-connectivety
{
	margin-left: 30px;
	min-width: 490px;
}
.right-connectivety ul li
{
	margin-bottom: 30px;
	position: relative;
}
.right-connectivety ul li:last-child
{
	margin-bottom: 0px;
}
.center-connectivety ul li
{
	margin-bottom: 15px;
	position: relative;
}
.center-connectivety ul li:last-child
{
	margin-bottom: 0px;
}
.left-connectivety
{
	margin-right: 30px;
	min-width: 490px;
}
.left-connectivety ul li
{
	margin-bottom: 30px;
	position: relative;
}
.left-connectivety ul li:last-child
{
	margin-bottom: 0px;
}
.area-answer.falsee
{
	border: 1px solid #DC3545;
	color: #DC3545;
}
.area-answer.true
{
	border: 1px solid var(--green);
	color: var(--green);
}
.answer-area-correct
{
	color: var(--black);
	margin-top: 10px;
}
.answer-area-correct span
{
	display: block;
	color: var(--green);
	margin-bottom: 10px;
}
.center-connectivety ul li .falsee
{
	border: 1px solid #DC3545;
	color: #DC3545;
}
.center-connectivety ul li .true
{
	border: 1px solid var(--green);
	color: var(--green);
}
.true-connectivety
{
	    color: var(--green);
	position: absolute;
	top: 50%;
	left: 50%;
	line-height: 30px;
	transform: translate(-50%,-50%);
	background-color: #F5FDF9;
	width: 80%;
	height: 80%;
	text-align: center;
}
.accordion {
  width: 100%;
}
.accordion__panel {
  background-color: var(--white);;
  border: 1px solid rgba(0, 0, 0, 0.125);
  overflow: hidden;
  transition: height 0.5s ease-in-out;
}
.accordion__panel:first-of-type {
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}
.accordion__panel:not(:first-of-type) {
  border-top: 0;
}
.accordion__panel:last-of-type {
  border-bottom-right-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}
.is-active .accordion__heading {
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.13);
}
.accordion__btn {
  display: flex;
  align-items: center;
  padding: 1rem var(--l-font);
  width: 100%;
	border: 0px;
	cursor: pointer;
	position: relative;
}
.is-active .accordion__btn {
  color: var(--white);;
	background-color: var(--primary-color);
}
.accordion__btn::after {
  content: "";
  flex-shrink: 0;
  width: var(--l-font);
  aspect-ratio: 1;
  background-color: var(--black);
  -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
          mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  transition: transform 0.2s ease-in-out;
	position: absolute;
	left: 15px;
}
.is-active .accordion__btn::after {
  transform: rotate(180deg);
	background-color: var(--white);;
}
.accordion__content {
  display: none;
  margin-top: -1px;
  transition: height 0.35s ease-in-out;
  overflow: hidden;
}
.is-active .accordion__content {
  display: block;
}
.accordion__inner {
  padding: 1rem var(--l-font);
}

.src {
  font-size: 0.85rem;
  margin-top: 2rem;
}
.seperate
{
	margin-bottom: 30px;
}
.seperate .course-name
{
	margin-bottom: 0px;
}
table.dt-rowReorder-float{position:absolute !important;opacity:.8;table-layout:fixed;outline:2px solid #888;outline-offset:-2px;z-index:2001}tr.dt-rowReorder-moving{outline:2px solid #555;outline-offset:-2px}body.dt-rowReorder-noOverflow{overflow-x:hidden}table.dataTable td.reorder{text-align:center;cursor:move}
table.dataTable.stripe>tbody>tr.odd>*, table.dataTable.display>tbody>tr.odd>*
{
	box-shadow: none !important;
}
table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td
{
	border-top: 1px solid var(--baby-grey) !important;
}

.step-wrapper {
  margin-bottom: 100px;
  position: relative;
}

.linestep {
  text-align: center;
  max-width: 250px;
  position: absolute;
}
.linestep .num {
  color: var(--white);;
  border-radius: 100px;
  display: inline-block;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  font-weight: bold;
  background: var(--primary-color);
}
.linestep p {
  width: 250px;
  position: absolute;
  margin-top: 7px;
	line-height: 1.4rem;

}
.linestep p.top {
  bottom: 50px;
  left: -110px;
}
.linestep p.bottom {
  left: -110px;
}
.linestep p.left {
  width: 230px;
  right: 50px;
  top: -17px;
}
.linestep p.right {
  width: 230px;
  left: 50px;
  top: -17px;
}

.linestep {
  visibility: hidden;
}

.path {
  visibility: hidden;
}

.move-line .path {
  visibility: visible;
  stroke-dasharray: 3700;
  stroke-dashoffset: 3700;
  animation: moveline 4s linear forwards;
}
.move-line .linestep {
  animation-name: show-step-item;
  animation-duration: 0.2s;
  animation-fill-mode: forwards;
}
.move-line .linestep1 {
  animation-delay: 0.4s;
}
.move-line .linestep2 {
  animation-delay: 0.8s;
}
.move-line .linestep3 {
  animation-delay: 1.2s;
}
.move-line .linestep4 {
  animation-delay: 1.6s;
}
.move-line .linestep5 {
  animation-delay: 2s;
}
.move-line .linestep6 {
  animation-delay: 2.4s;
}
.move-line .linestep7 {
  animation-delay: 2.8s;
}
.move-line .linestep8 {
  animation-delay: 3.2s;
}

@keyframes show-step-item {
  from {
    transform: scale(0.2);
    opacity: 0;
  }
  to {
    visibility: visible;
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes moveline {
  to {
    stroke-dashoffset: 0;
  }
}
.log-mada
{
	/*padding: 20px;
    border: 1px solid var(--baby-grey);;*/

	/*background-color: #fbfbfb;*/
	width: 585px;
}
.log-mada ul li
{
	margin-bottom: 20px;

	margin-left: 20px;
}
.log-mada ul li
{
	width: 272px;
}
.log-mada ul li a
{
	border: 1px solid var(--baby-grey);;
	padding: 15px;
	border-radius: 15px;
	background-color: var(--baby-red);;
}
.log-mada ul li a
{
	flex-direction: column;
	text-align: center;
}
.log-mada ul li a:hover{
	background-color:var(--color2);
	color: var(--white);;
}
.log-mada ul li a:hover i
{
	color: var(--white);;
}
.log-mada ul li a i
{
	margin-left: 0px;
	margin-bottom: 13px;
	font-size: 1.5rem;
}
.log-mada ul li a span
{
	min-height: 46px;
}
/*.log-mada ul li:last-child
{
	margin-bottom: 0px;
	padding-bottom: 0px;
	border-bottom: 0px;
}*/
.log-mada ul li:nth-child(2n)
{
	margin-right: 0px;
}
.log-mada .student-title
{
	margin-bottom: 20px;
}
.log-mada .student-title i
{
	font-size: 2rem;
}
.profile-student
{
	width: 585px;
	margin-left: 30px;
}
.slide-three .hero-right {
    margin: auto;
}
.slide-two .hero-left {
    width: 40%;
}
.slide-two .hero-right {
    width: 50%;
}
.slide-three.swiper-slide
{
	text-align: center;

}
.slide-three .hero-right .hero-links
{
	justify-content: center;
	align-content: center;
}
.noti-massages ul li
{
	padding: 15px;
	background-color: #F5FDF9;
	margin-top: 30px;
	border-radius: 15px;
	-webkit-box-shadow: 0px 0px 18px 0px rgb(151 160 204 / 12%);
    box-shadow: 0px 0px 18px 0px rgb(151 160 204 / 12%);
}
.noti-massages ul li h2
{
	margin-bottom: 10px;
	font-weight: 700;
}
.noti-massages ul li p
{
	margin-bottom: 10px;
}
.noti-massages ul li a
{
	display: inline-block;
	margin-right: 5px;
}
.noti-massages ul li h2:before
{
	font-family: "Icons4";
    font-size: 1.2rem;
    font-style: normal;
    margin-left: 10px;
    color: var(--green);
	    content: "\f0f3";
	font-weight: 600;
}
.team ul li
{
	text-align: center;
	margin-bottom: 30px;
	margin-left: 30px;
	width: 220px;
}
.team ul li:nth-child(2),.team ul li:nth-child(3)
{
	text-align: center;
	width: 41%;

}
.team ul li:nth-child(1)
{
	width: 100%;

}
.team ul li:nth-child(1) img
{
	width: 180px;
	height: 180px;
	border: 2px solid var(--color2);
}
.team ul li:nth-child(2) img,.team ul li:nth-child(3) img
{
	width: 150px;
	height: 150px;
	border: 2px solid var(--primary-color);
}
.team ul li img
{
	width: 120px;
	height: 120px;
	border-radius: 100%;
	margin:0px auto 5px auto;
	padding: 10px;
	border: 2px solid #9E9E9E;

}
.team ul li:nth-child(-n+3)
{
	margin-left: 0px;
}
.team ul li:last-child
{
	margin-left: 0px;
}
.team ul li h2
{
	margin-bottom: 5px;
}
.team ul li span
{
	display: block;
}
.mission ul li
{
	width: 600px;
	height: 350px;
	flex-direction: column;
	padding: 0px 50px;
	text-align: center;
	margin-left: 0px;
	background-color: var(--baby-blue2);;
}
.mission ul li:last-child
{
	margin-left: 0px;
	background-color: var(--baby-red);;
}
.mission ul li img
{
	width: 70px;
	margin: 0px auto 10px auto
}
.mission ul li span
{
	margin-bottom: 10px;
	display: block;
}
.mission ul li h2
{
	line-height: 1.7rem;
}


/*tooltip */
.tooltip {
	padding: 25px;
  visibility: hidden;
  z-index: 1;
  opacity: .40;
  width: 100%;
  padding: 10px 10px;
  background: #333;
  color: var(--white);;
	line-height: 1.4rem;
  position: absolute;
 top:-20%;
	left:-105%;
  border-radius: 9px;
	transform: translateX(-50%);
  transform: translateY(9px);
  transition: all 0.3s ease-in-out;
  box-shadow: 0 0 3px rgba(56, 54, 54, 0.86);
  transform: translateY(-10px);
	transform: translateX(-6px);
    transition: .3s linear;
  animation: odsoky 1s ease-in-out infinite  alternate;
}


/* tooltip  after*/
.tooltip::after {
  content: " ";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 6.5px 0 6.5px;
  border-color: #333 transparent transparent transparent;
  position: absolute;
	top:calc(50% - 6px);
  left:99%;
  transform: rotate(-90deg);

}

/*.profile-student ul li:hover .tooltip{
  visibility: visible;
  transform: translateY(-10px);
	transform: translateX(-6px);
  opacity: 1;
    transition: .3s linear;
  animation: odsoky 1s ease-in-out infinite  alternate;

}*/
.studen-details ul li:hover .tooltip{


}
/*.studen-details ul li .tooltip {

 top:-40%;
}*/
.studen-details ul li:nth-child(4n) .tooltip {

 top:-40%;
	right:-105%;
  border-radius: 9px;
	transform: translateX(-50%);
  transform: translateY(9px);
}
.studen-details ul li:nth-child(4n) .tooltip::after {
  left:-3.5%;
  transform: rotate(90deg);

}
.studen-details ul li .question-mark
{
	font-size: var(--m-font);
}
@keyframes odsoky {
  0%{
    transform: translateY(6px);
  }

  100%{
    transform: translateY(1px);
  }

}
.question-mark
{
	position: absolute;
	top: 10px;
	left: 10px;
	font-size: 1.2rem;
	 font-family: "Icons4";
    color: #E2C9C9;
}

.question-mark:before
{

	    content: "\f06a";
}
.hello
{
	text-align: center;
}
.hello h1
{
	font-size: 3rem
}
.hello a
{
	display: inline-block;
	padding: 10px 15px;
	margin-top: 20px;
	border-radius: 5px;
}
.tour
{
	margin-left: 15px;
}
.tour a:before
{
	    content: "\f52b";
	font-family: "Icons4";
}
.live-podcast
{
	padding: 30px;
	background-color: var(--baby-red);;
	border-radius: 10px;
	margin-bottom: 30px;
}
.podcast-title i {
    font-family: "Icons2";
    font-size: 2rem;
    font-style: normal;
    margin-left: 10px;
    display: block;
    color: #CF0F0F;
	  animation: changeColor .75s infinite alternate;
}
@keyframes changeColor {
    from {
        color: #CF0F0F;
    }
    to {
        color: var(--baby-red);;
    }
}
.podcast-title i:before {
    content: "\f8dd";
}
.podcast-video
{
    overflow: hidden;
    position: relative;
    width: 100%;
    padding-bottom: 56.5%;
	margin-top: 30px;
}
.podcast-video iframe
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.notification-podcast
{
	margin-left: 30px;
	background-color: var(--white);;
	border: 1px solid #CF0F0F;
	color: #CF0F0F;

	font-size: 1.5em;
	width: auto !important;
	border-radius: 5px !important;
	position: relative;
	padding: 5px 10px;
	line-height: inherit !important;
}
.notification-podcast p
{
	font-weight: 600;
	animation:none !important;
	color: #CF0F0F;
/*	opacity: 0;
	visibility: hidden;
	background-color: #CF0F0F;
	padding: 7px;
	line-height: normal;
	border-radius: 5px;
	color: var(--white);;
	position: absolute;
	top: -30px;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;*/
}
.notification-podcast:hover p
{
	opacity: 1;
	visibility: visible;

}
.notification-podcast:before
{
	content: "\f2ce";
	font-family:"Icons4";
	margin-left: 5px;
	animation: changeColor .75s infinite alternate;
}

@media print {
  .header, .footer, .student-top ,.section-crumb, .student-header, .quick-numbers,.print,.dataTables_paginate,.mobile-header,.icon7 {
    display: none !important;
  }
  body {
    font-size: 5pt !important;
  }
	.name-t {
    margin-top: 15px !important;
}
}
.one-colum
{
	width: 100%;
}
.one-colum .group-colum
{
	width: 96%;
	margin:4% 2%;
	height: 500px;
	background-color: var(--black);
}
.two-colum
{
	width: 100%;
}
.two-colum .group-colum
{
	width: 46%;
	margin:4% 2%;
	height: 500px;
	background-color: var(--black);
}
.three-colum
{
	width: 100%;
}
.three-colum .group-colum
{
	width: 29%;
	margin:4% 2%;
	height: 500px;
	background-color: var(--black);
}
.reponsive-image
{
	width: 100%;
	height: auto;
}
.right-prog
{
	width: 690px;
	margin-left: 30px;
}
.left-prog
{
	width: 480px;
}
/*.left-prog .studen-details
{
	position: sticky;
	top: 0px;
}*/
.left-prog .studen-details ul li {
    width: 232px;
    margin-left: 15px;
    margin-top: 15px;
    position: relative;
}
.left-prog .studen-details ul li:nth-child(3),.left-prog .studen-details ul li:nth-child(4) {
    margin-top: 15px;
}
.left-prog .studen-details ul li:nth-child(2n)
{
	margin-left: 0px !important;
}
.left-prog .studen-details ul li:nth-child(2n)
{
	margin-left: 15px;
}
.pdf-book
{
	width: 100%;
	height: 890px !important;
	margin-top: 40px;padding: 30px;
	background-color: var(--baby-grey2);;border-radius: 15px;
	margin-bottom: 40px;
}
.content-pop .pdf-book
{
	margin-top: 0px !important;
	margin-bottom: 0px !important;
	height: 70vh !important;
}
.pdf-book iframe
{
	width: 100%;
	height: 100% !important;
}
.left-prog .audio-lesson
{
	margin-bottom: 30px;
}
.all-prog
{
	margin-top: 30px;
}
.fliter-student ul li
{
	margin-left: 30px;
	padding: 30px;
	border: 1px solid var(--baby-grey);;
	border-radius: 10px;
	width: 300px;
}
.fliter-student ul li:nth-child(3n)
{
	margin-left: 0px;
}
.fliter-student ul li h2
{
	margin-bottom: 30px;
	text-align: center;
}
.fliter-student ul li img
{
	width: auto;
	height: 100px;
	margin:0px auto 30px auto;
}
.downlinks a
{
	border-radius: 10px;
	border: 1px solid var(--primary-color);
	margin-left: 15px;
	display: inline-block;
	min-width: 40%;
	text-align: center;
}
.left-prog .downlinks
{
	margin-top:30px;
}
.left-prog .downlinks a {
	margin-left: 0px;
	padding:15px 0px;
}
.downlinks a:last-child {
	margin-left: 0px;
}
.downlinks a:hover
{
	background-color: var(--primary-color);
	color: var(--white);;
}
.area-div
{
	padding: 20px;
	background-color: var(--white);;
	border-radius: 10px;
	text-align: center;
}
.area-div h2
{
	text-align: center;
	margin: 0px auto 15px auto;
}
.area-problem
{
	border-radius: 10px;
	border: 0px;
	background-color: #f8f8f8;
	width: 100%;
	max-width: 100%;
	height: 250px;
	max-height: 250px;
	text-align: right;
}
.pro-sub
{
	border: 0px;
	border-radius: 10px;
	cursor: pointer;
	margin: 25px auto 0px auto;
	width: 150px;
}
.problem-link
{
	border-radius: 7px;
	display: inline-block;
}
.tf
{
	width: 100%;
}
.tf .problem-link
{
	margin-right: 10px;
}
.marf
{
	margin-top: 0px;
}
.maqadeer .swiper-slide {
	width: 232px;
	/*	margin-left: 15px;
	margin-top: 15px;*/
	position: relative;
}
/*.maqadeer ul li:nth-child(2n)
{
	margin-left: 0px;
}
.maqadeer ul li:nth-child(1),.maqadeer ul li:nth-child(2)
{
	margin-top: 0px;
}*/
.maqadeer {
	margin-top:30px;
}.maqadeer .swiper-slide a {
	border: 1px solid var(--baby-grey);;
	border-radius: 10px;
	padding: 15px;
	align-items: center;
	align-content: center;
	color: var(--black);
}
		.maqadeer .swiper-slide a i {
			font-family: "Icons4";
			font-size: 2rem;
			font-style: normal;
			margin-left: 10px;
			display: block;
			color: var(--primary-color);
		}
.iconsbook:before
{
	    content: "\f02d";
}
.maqadeer .swiper-slide a:hover {
	background-color: var(--primary-color);
	color: var(--white);;
}
	.maqadeer .swiper-slide a:hover i {
		color: var(--white);;
	}
.map-v
{
	margin-bottom: 30px;
	 align-items: center;
}
.map-v h2
{
	 align-items: center;
}
.map-v a
{
	text-align: center;
	border: 1px solid var(--baby-grey);;
    border-radius: 10px;
    padding: 15px;
    align-items: center;
    align-content: center;
	justify-content: center;
}
.map-v a:before
{
	font-family: "Icons4";
    font-size: 1.5rem;
    font-style: normal;
    margin-left: 10px;
    display: block;
    color: var(--white);;
	content: "\f06e";
}
.neb
{
	margin:0px 0px 30px 0px;
}
.neb span
{
	margin-left:5px;
}
.flash
{
	background-color: var(--primary-color) !important;
	color:var(--white) !important;
	padding: 10px 15px;
	border-radius: 10px;
	-webkit-animation: flash linear 2s infinite;
	animation: flash linear 2s infinite;
	margin-right: 15px;
}
@-webkit-keyframes flash {
	0% { opacity: 1; }
	50% { opacity: .8; }
	100% { opacity: 1; }
}
@keyframes flash {
	0% { opacity: 1; }
	50% { opacity: .8; }
	100% { opacity: 1; }
}
.flash:before {
    content: "\f07a";
    font-family: "Icons3";
    margin-left: 5px;
}
.container-checkbox {
 /* display: block;
  position: relative;*/
	margin-left: 40px;
  cursor: pointer;
  font-size: 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  right: 0;
  height: 18px;
  width: 18px;
  background-color: #eee;
	border-radius: 3px;
}

/* On mouse-over, add a grey background color */
.container-checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container-checkbox input:checked ~ .checkmark {
  background-color: #2196F3;
	border-radius: 3px;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container-checkbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container-checkbox .checkmark:after {
      left: 7px;
    top: 2px;
    width: 4px;
    height: 9px;
  border: solid white;
  border-width: 0 1px 1px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.all-choos
{
	padding: 20px;
	border: 10px;
	background-color: #fbfbfb;
	border-radius: 10px;
}
.all-choos table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td
{
	background-color: var(--white) !important
}
.all-choos  .table .dataTable tfoot th:nth-child(1) {
    border-top-right-radius: 0px;
	 border-bottom-right-radius: 10px;
}
.all-choos .table .dataTable tfoot th:last-child {
    border-top-left-radius: 0px;
	border-bottom-left-radius: 10px;
}
.all-choos .table .dataTable tfoot th
{
	background-color: var(--baby-red) !important;
	border-top: 1px solid var(--baby-grey);;
	padding: 15px !important;
}
.all-choos .dataTables_paginate
{
	display: none !important
}
.all-ho
{
	margin-right: 5px;
}
.content
{
	min-width: 1200px;
}
.header
{
	min-width: 1200px;
}
.footer
{
	min-width: 1200px;
}
.darkmode--activated .flash
{

	mix-blend-mode: difference;
}
.darkmode--activated .bg-blue {
    mix-blend-mode: difference;
}
.darkmode--activated .bg-blue,.darkmode--activated .section-bg-blue {
  background: #111;
  mix-blend-mode: difference;
	color: var(--white) !important;
}
.darkmode--activated .color-blue
{

  mix-blend-mode: difference;
}
.darkmode--activated .inner-header .social ul li a,.darkmode--activated .inner-header .signup-button:before,.darkmode--activated .inner-header .log-button:before {


  mix-blend-mode: difference;

}
.darkmode--activated  .mission ul li
{
	background-color: #111;
	 mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .section-grey
{background-color: #111;
	 mix-blend-mode: difference;
	color: var(--white);;

}
.darkmode--activated .inner-header .nav-a, .darkmode--activated .organiz ul li h2
{
	color: var(--black);
}
.darkmode--activated .organiz ul li span
{
	color: var(--black);
}
.darkmode--activated .color-red {
    color: var(--color2);

}
.darkmode-toggle
{
	z-index: 9999999999999999999999999999999999999999999999999999999999999999999999999;
}
.darkmode--activated .after-change h2 {
     mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .courses ul li
{
	background-color: #111;
	border-color: #111;
	mix-blend-mode: difference;
}
.darkmode--activated .course-title h2 a {
    color: var(--white);;
}
.darkmode--activated .text-regist,.darkmode--activated .area-message
{
	 mix-blend-mode: difference;
	background-color: transparent;
	color: var(--white);;
}
.darkmode--activated .label-regist
{
	background-color: var(--black);
	mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .tabs a
{
	color: var(--white);;
}
.darkmode--activated .active-student
{
	mix-blend-mode: difference;
	    background-color: var(--primary-color);
    color: var(--white);;
}
.darkmode--activated .menu-student ul li a.active-student {
    background-color: var(--primary-color);
    color: var(--white);;
}
.darkmode--activated .student-title i
{
	mix-blend-mode: difference;
}
.darkmode--activated .problem-link
{
	mix-blend-mode: difference;
}
.darkmode--activated .forums-links ul li a:before
{
	mix-blend-mode: difference;
}
.darkmode--activated .forums-links ul li  a
{
	background-color: #333333 !important;
	mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .icon-reply
{
	background-color: #333333 !important;
	mix-blend-mode: difference;
}
.darkmode--activated .send-button
{
	mix-blend-mode: difference;
}
.darkmode--activated .treeview ul li a
{
	mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .morelessons ul li {
       background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
}
.darkmode--activated .button-subscribe
{
	    background-color: var(--white) !important;
	color: var(--black);
	  mix-blend-mode: difference;
}
.darkmode--activated .bg-profile
{   mix-blend-mode: difference;

}
.darkmode--activated .morelessons-new ul li {
    background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
}
.darkmode--activated .button-next-testimonial,.darkmode--activated .button-prev-testimonial
{
	 mix-blend-mode: difference;
	background-color: #111;
	color: var(--white);;
}
.darkmode--activated .filter-select select
{
	mix-blend-mode: difference;
	background-color: transparent;
	color: #848484;
}
.darkmode--activated .m1,.darkmode--activated .m2,.darkmode--activated .m3,.darkmode--activated .m4
{
	mix-blend-mode: difference;
}
.darkmode--activated .mail-section ul li a {
    background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .mail-section ul li a h2
{
	color: var(--white);;
}
.darkmode--activated select.text-regist
{
	color: var(--grey4);
}
.darkmode--activated .all-quiz
{
	 background-color: #111;
    border-color: #111;
	 mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .question h2
{
	 mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .all-projects ul li
{
    mix-blend-mode: difference;
}
.darkmode--activated .teacher-name h2 a
{
	mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .noti-massages ul li h2:before
{
	mix-blend-mode: difference;
}
.darkmode--activated .massage-to .icon-mass
{
	mix-blend-mode: difference;
}
.darkmode--activated .icon-mass
{
	mix-blend-mode: difference;
}
.darkmode--activated .linestep p.left,.darkmode--activated .linestep p.right,.darkmode--activated .linestep p
{
	mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .profile-student ul li
{

	 mix-blend-mode: difference;

	color: var(--white);;
}
.darkmode--activated .profile-student ul li a
{
    border-color: #111;
	background-color: #111;
	color: var(--white);;
}
.darkmode--activated .profile-student ul li a h2,.darkmode--activated .profile-student ul li a p
{
	color: var(--white);;
	 mix-blend-mode: difference;
}
.darkmode--activated .link-homework i
{
	mix-blend-mode: difference;
}
.darkmode--activated .studen-details ul li a {
    background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .studen-details ul li a h2
{mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .maqadeer .swiper-slide a {
    background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .top-d {
      background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
		color: var(--white);;
}
.darkmode--activated .teacher-country
{
	mix-blend-mode: difference;
}
.darkmode--activated .all-teacher ul li
{
	background-color: #111;
    border-color: #111;
    mix-blend-mode: difference;
	color: var(--white);;
}
.darkmode--activated .testimonial-more{
	/* mix-blend-mode: difference;*/
	    border: 1px solid var(--color2);
}
.darkmode--activated  .answer span
{
		color: var(--white);;
}
.darkmode--activated .mobile-header.inner-mob .top-buttons a
{

	 mix-blend-mode: difference;
	color: var(--white) !important;
}
.darkmode--activated .mobile-header.inner-mob .top-buttons a:before
{
	mix-blend-mode: difference;
		color: var(--white) !important;
}
.darkmode--activated .bg-red
{
	background-color: var(--color2);
	  /*  mix-blend-mode: difference;*/
}
.darkmode--activated .bg-yellow
{
	background-color: var(--yellow);;
	    mix-blend-mode: difference;
}

.darkmode--activated .section-blue
{
	background-color: var(--primary-color);
	    mix-blend-mode: difference;
}
.darkmode--activated .right-icons-library span
{
	 mix-blend-mode: difference;
	    color: var(--primary-color);
}
.colors
{
	margin-bottom: 30px;
}
.colors button
{
	width: 35px;
    height: 35px;
	border: 0px;
	border-radius: 100%;
	border: 1px solid var(--white);;
	margin-left: 5px;

		cursor: pointer;
}
.colors button:nth-child(1)
{
	background-color: var(--baby-grey2);;
}
.colors button:nth-child(2)
{
	background-color: var(--primary-color);
}
.colors button:nth-child(3)
{
	background-color: var(--color2);
}
.colors button:nth-child(4)
{
	background-color: var(--yellow);;
	margin-left: 0px;
}
.settings
{
	position: fixed;
	bottom: 70px;
	left: -210px;
	width: 210px;
	z-index: 9999999999999999999999999999;
	background-color: var(--white);;
	border-bottom-right-radius: 5px;
	border-top-right-radius: 5px;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.10);
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.10);
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.10);
	padding: 20px;
	-webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.left-to
{
	left: 0px;
}
.setting-icon
{
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	position: absolute;
	top: 50%;
	right: -40px;
	transform: translateY(-50%);
	background-color: #EEEEEE;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	border-bottom-right-radius: 5px;
	border-top-right-radius: 5px;

}
.setting-icon img
{
	height: 20px;
	margin: auto;
	line-height: 40px;
	display: block;
}
.fonn h2
{
	font-size: 16px !important;
	font-weight: 500;
	margin-bottom: 15px;
}
.fonn button
{
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	border: 0px;
	background-color: var(--baby-grey2);
	width: 35px;
	height: 35px;
	border-radius: 5px;
	cursor: pointer;
	float: right;

}
.zoomin
{
	margin-left: 10px;
}
.fonn button img
{
	height: 16px;
}
.all-b
{
    -webkit-box-shadow: 0px 4px 10px -2px rgb(0 0 0 / 6%);
    -moz-box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.06);
    box-shadow: 0px 4px 10px -2px rgb(0 0 0 / 6%);
    background-color: #fff;
	}
.mmm span
{
	padding-top: 0px !important;
	margin-right: 5px !important;
	margin-bottom: 0px !important;
}
.right-new ul li
{

	border: 1px solid var(--baby-grey);
	background-color: var(--grey5);
	border-radius: 10px;
	padding: 0px;
	width: 277px;
	text-align: center;
}
.right-new ul li:nth-child(1)
{
	margin-left: 30px;
}
.right-new ul li span
{
	padding-top: 15px;
	display: block;
	margin-bottom: 10px;
}
.right-new ul li h2
{
	font-size: 2rem;
	font-weight: 800;
}
.left-new
{
	border: 1px solid var(--baby-grey);
	background-color: var(--grey5);
	border-radius: 10px;
	width: 575px;
	padding: 15px 0px;
	text-align: center;
}
.to
{
	margin-top: 30px;
}
.mmm p
{
	margin-bottom: 20px;
}
.usu
{
	margin-bottom: 50px;
	margin-top: 50px;
}
.usu h3
{
	margin-bottom: 20px;
}
.top-numbers3
{

	width: 615px;
}
.top-numbers3 h3
{
	margin-bottom: 30px;
}
.top-numbers3 ul li
{
	border: 1px solid var(--baby-grey);
	background-color: var(--grey5);
	border-radius: 10px;
	padding: 0px;
	width: 265px;
	text-align: center;
	margin-left: 30px;
	padding: 15px 0px;
	margin-top: 30px;
}
.top-numbers3 ul li span
{
	display: block;
	margin-bottom: 10px;
}
.top-numbers3 ul li:nth-child(1),.top-numbers3 ul li:nth-child(2)
{
	margin-top: 0px;
}
.top-numbers3 ul li:nth-child(2n)
{
	margin-left: 00px;
}
.top-numbers3 h4
{
	margin-bottom: 30px;
}
.content-bar
{
	margin-top: 15px;
}
.bar
{
	width: 100px;
	background-color: #f1f1f1;
	border-radius: 5px;
	height: 4px;
	position: relative;
	margin-right: 10px;
}
.inside-one
{
	position: absolute;
	left: 0px;
	top: 0px;
	display: block;
	height: 4px;
	border-radius: 5px;

}
.top-new ul li
{
	width: 23%;
	text-align: center;
	flex-direction: column;
	background-color: #fbfbfb;
	border:1px solid #f1f1f1;
	border-radius: 15px;
	padding: 30px;
}
.top-new ul li h2
{
	font-size: 70px;
	font-weight: 900;
}
.top-new ul li h3:before
{
	font-family: "Icons2";

}
.top-new ul li:nth-child(1) h3:before
{
	content: "\f0c0";
	color: var(--black);
	font-size: 1.8rem;
	margin-left: 5px;
}
.top-new ul li:nth-child(2) h3:before
{
	content: "\f007";
	color: var(--color2);
	font-size: 1.8rem;
	margin-left: 5px;
}
.top-new ul li:nth-child(3) h3:before
{
	content: "\f007";
	color:var(--primary-color);
	font-size: 1.8rem;
	margin-left: 5px;
}
.top-new ul li:nth-child(4) h3:before
{
	content: "\f024";
	color:var(--green);
	font-size: 1.8rem;
	margin-left: 5px;
}
.s-1:before
{
	content: "\f0c0";
color: var(--white);
	font-size: 2rem;
	margin-left: 5px;
	font-family: "Icons3";
}
.s-2:before
{
	content: "\f024";
	color: var(--white);
	font-size: 2rem;
	margin-left: 5px;
	font-family: "Icons3";
}
.s-3:before
{
	content: "\f02d";
	color: var(--white);
	font-size: 2rem;
	margin-left: 5px;
	font-family: "Icons3";
}
.s-4:before
{
	content: "\f518";
color: var(--white);
	font-size: 2rem;
	margin-left: 5px;
	font-family: "Icons3";
}
.s-5:before
{
	content: "\f51c";
	color: var(--white);
	font-size: 2rem;
	margin-left: 5px;
	font-family: "Icons3";
}
.s-6:before
{
	content: "\f0b1";
	color: var(--white);
	font-size: 2rem;
	margin-left: 5px;
	font-family: "Icons3";
}
.left-im h2
{
	    font-size: 40px;
    font-weight: 900;
	color: var(--black);
}

.left-im h3
{
color: var(--white);
}
.right-im
{
	/*width: 40px;*/
	margin-bottom: 15px;
}
/*.left-im
{
	width: 118px;
}*/
.down-new ul li
{
	border:1px solid #f1f1f1;
	border-radius: 15px;
	padding: 15px;
	width: 228px;
	margin-left: 15px;
}
.down-new ul li:nth-child(5n)
{
	margin-left: 0px;
}
.title8
{
	text-align: center;
	margin: 50px 0px;
}
.title8 h2 {
    font-size: 2.5rem;
    line-height: 4rem;
}
.title9
{
	text-align: center;
	margin: 0px 0px 50px 0px;
}
.title9 h2 {
    font-size: 2.5rem;
    line-height: 4rem;
}
.right-all
{
	border:1px solid #f1f1f1;
	border-radius: 15px;
	width: 420px;
	height: 491px;
	background-color: #f7f7f7;
	text-align: center;
	flex-direction: column;
	margin-left: 30px;
}
.right-all h2
{
	font-size: 30px;
	    font-weight: 900;
}
.left-all ul li
{
	border:1px solid #f1f1f1;
	border-radius: 15px;
	width: 230px;
	height: 230px;
	background-color: var(--baby-grey2);
	text-align: center;
	flex-direction: column;
	margin-left: 30px;
	margin-top: 30px;
}
.left-all ul li:nth-child(1)
{
	background-color: var(--primary-color);
}
.left-all ul li:nth-child(2)
{
	background-color: var(--color2);
}
.left-all ul li:nth-child(3)
{
	background-color: var(--yellow);
}
.left-all ul li:nth-child(4)
{
	background-color: var(--green);
}
.left-all ul li:nth-child(5)
{
	background-color: var(--baby-blue);
}
.left-all ul li:nth-child(6)
{
	background-color: var(--grey4);
}
.left-all ul li:nth-child(3n)
{
	margin-left: 0px;
}
.left-all ul li h2
{
	font-size: 40px;
	    font-weight: 900;
	color: var(--white);
}
.left-all ul li h3
{
	color: var(--white);
}
.left-all ul li:nth-child(1),.left-all ul li:nth-child(2),.left-all ul li:nth-child(3)
{
	margin-top: 0px;
}
.left-all
{
	width: 750px;
}
.dd-d
{
	margin-top: 50px;
}
.section-grey .right-all
{
	background-color: #fff;
	margin-right: 30px;
	margin-left: 0px;
}
.right-all img
{
	height: 100px;
	margin-bottom: 15px;
}