.btn-primary {
	color: #fff;
	background-color: #418cdd;
	border-color: #418cdd;
}

.slogan{
	padding: 15px 0px;
}
.slogan h3{
	display: inline-block;
	font-size: 20px;
	line-height: 24px;
	color: #333333;
	margin-bottom: 0px;
}

.slogan h3 span{
	color: #ffa200;
}



.view-all{
	color: #ef7804;
	font-weight: 400;
}




#intro-section{
	background: #eaf8fe;
	padding-bottom: 50px;
}







#intro-section .director{
	text-align: center;
	position: relative;
	margin-bottom: 30px;
}




#intro-section .director:before{
	content: '';
	position: absolute;
	left: -15px;
	right: -15px;
	top: -15px;
	bottom: -15px;
	background: #ffffff;
	z-index: 0;
}


#intro-section .director .director-head{
	font-size: 20px;
	line-height: 24px;
	margin-top: 15px;
	position: relative;
	z-index: 1;
}


#intro-section .director img{
	position: relative;
	z-index: 1;
}






#intro-section .director .director-name{
	font-size: 20px;
	line-height: 24px;
	margin-top: 15px;
	position: relative;
	z-index: 1;
}




#intro-section .director-contact h4{
	font-size: 20px;
	line-height: 24px;
	margin-top: 15px;
	position: relative;
	z-index: 1;
}





.menu-index .item-menu-index{
	background: #ffffff;
	padding: 15px;
	display: block;
	text-align: center;

	min-height: 140px;
}


.menu-index .item-menu-index h4{
	font-size: 16px;
	line-height: 24px;
	margin-bottom: 0px;
	color: #000000;
}

.menu-index .item-menu-index .demo-icon{
	font-size: 40px;
	color: #000000;
	margin-bottom: 15px;
	display: inline-block;
}






.menu-index .item-menu-index:hover{
	background: #ffa200;
	
}


.menu-index .item-menu-index:hover h4{
	color: #ffffff;
}

.menu-index .item-menu-index:hover .demo-icon{
	color: #ffffff;
}














.box-header{
	text-align: center;
	background: #233678;
	padding: 50px 0px;
	border-radius: 10px;
}





.box-header h2{
	margin-bottom: 0px;
	color: #ffffff;
	text-shadow: 2px 2px 4px #000000;
}




.box-header h2 span{
	color: #fcbf01;
}










.box-tel {
	display: block;
	white-space: 100%;
	background: #418cdd;
	border-radius: .25rem;
	padding: 5px;
	color: #ffffff;
	text-align: left;
}


.box-tel .material-icons{
	background: #ffffff;
	color: #418cdd;
	border-radius: .25rem;
	font-size: 50px;
	float: left;
	margin-right: 10px;
}


.box-tel .tel{
	
	font-size: 25px;
}





.director-contact ul {
	padding-inline-start: 25px;
	list-style: none;
	margin-bottom: 0px;
}


.director-contact ul li:before {
	font-family: 'Material Icons Round';
	font-weight: normal;
	font-style: normal;
	content: "\ef4a";
	margin-left: -25px;
	padding-right: 10px;
	color: #cfcfcf;
}

.director-contact ul li{
	position: relative;
	padding: 5px 0px;
}

.director-contact ul li a {
	color: #000000;
}

.director-contact ul li a:before {
	content: '';
	position: absolute;
	bottom: 0px;
	right: 0px;
	left: 0px;
	height: 1px;
	background: #dee2e6;
}


.director-contact ul li a:hover {
	color: #56a9f7;
}








.item-coures img{
	filter: brightness(100%);
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;

}


.item-coures:hover img{
	filter: brightness(150%);
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;

}



.bg-navigator{
	text-align: left;
	/*background: url(../images/pattern.png)repeat 0px 0px;*/
	/*background-color: rgb(134, 0, 23);*/
	/*background:#083049;*/
	background: #eeeeee;
	color: #ffffff;
	display: block;
	margin: 0 auto;
	
}

.bg-navigator a:nth-child(1){
	padding: 15px 15px;
	display: inline-block;
	text-decoration: none;
	border-right: solid 1px #dddddd;
	color: #418cdd;
	font-weight: 400;
}

.bg-navigator a{
	padding: 15px 15px;
	display: inline-block;
	text-decoration: none;
	color: #6f6f6f
}
































#activity-section{
	padding: 50px 0px;
}










.item-activity h4{
	color: #555555;
	font-weight: 300;
	font-size: 16px;
	line-height: 24px;
	margin: 5px 0px;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	margin-bottom: 0px;
}
.item-activity:hover h4{
	color: #faa002;
}

.item-activity b{
	position: relative;
	font-weight: 500;
}
.item-activity b:before{
	content: '';
	position: absolute;
	right: -10px;
	height: 30px;
	width: 1px;
	background: #555555;
}

.item-activity b:after{
	content: '';
	position: absolute;
	top: 8px;
	right: -13px;
	height: 8px;
	width: 8px;
	border-radius: 100%;
	background: #ffffff;
	border: solid 1px #555555;

}


#activity-section .view-all{
	position: absolute;
	right: 15px;
	bottom: 15px;
}






.box-link{
	min-height: 100px;
	text-align: center;
	background: #418cdd;
	display: flex;
	padding: 20px 15px;
	border-radius: 10px;
	margin-bottom: 20px;
	flex-wrap: nowrap;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	align-content: stretch;
}

.box-link h4{
	color: #ffffff;
	margin-bottom: 0px;
	font-size: 20px;
	line-height: 24px;
	font-weight: 400;
}

.box-link:hover{
	background: #faa002;

}




.in-box-link{
	min-height: 80px;
	text-align: center;
	background: #faa002;
	display: flex;
	padding: 20px 15px;
	border-radius: 10px;
	margin-bottom: 20px;
	flex-wrap: nowrap;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	align-content: stretch;
}

.in-box-link h4{
	color: #ffffff;
	margin-bottom: 0px;
	font-size: 20px;
	line-height: 24px;
	font-weight: 400;
}

.in-box-link:hover{
	background: #418cdd;

}




#page-section .qa-title{
	background: #418cdd;
	color: #fff;
	text-decoration: none;
	display: block;
	border-bottom: 1px solid #ffffff;
	padding: 10px 15px;
	padding-right: 50px;
	text-align: left;
	position: relative;
}


#page-section.qa-title{
	color: #ffffff; 
	font-size: 18px;
}

#page-section .qa-title:hover, .qa-title:focus{
	color: #ffffff; 
}

#page-section .box-icon span{
	position: absolute;
	top: 50%;
	right: 22px;
	width: 15px;
	height: 3px;
	background-color: #ffffff;
	transition: all .3s;
}

#page-section .box-icon span:nth-child(2){
	transform: rotate(90deg);

}
#page-section .opened span{
	transform: rotate(360deg);
	opacity: 0;
}
#page-section .opened span:nth-child(2){
	transform: rotate(360deg);
	opacity: 1;
}

#page-section .qa-content{
	display: none;
	padding: 15px;
	color: #6f6f6f;
	background-color: #fff;
}


















#info-section{
	padding: 50px 0px;
	background-image: url(../images/info-section.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}



.item-webboard {
	display: block;
	color: #555555;
	padding: 5px 0px;
}
.item-webboard p{
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	margin-bottom: 0px;
}

.item-webboard:hover{
	color: #418cdd;
}



.item-webboard .material-icons{
	font-size: 12px;
	vertical-align: unset;
	margin-right: 5px;
	color: #cfcfcf;

}


#info-section  .box-webboard{
	border: 1px solid rgba(0,0,0,.125);

}











.item-new{
	background: #f5f5f5;
	display: block;
	margin-bottom: 30px;
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.item-new h4{

	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	margin-bottom: 0px; 
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;

}

.item-new img{
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}




.item-new:hover{
	background: #ff9900;
}




.item-new:hover h4{
	color: #ffffff;
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}



.item-new:hover img{
	opacity: 0.5;
	-webkit-transition: all 0.3s ease-in-out;
	-khtml-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}










#e-learning-section{
	padding: 50px 0px;
	background: #f1fbff;
}










.row-gallery {
	margin-right: -15px;
	margin-left: -15px;
}


.item-gallery {
	display: block;
	width: 100%;
	height: 300px!important;
	padding: 0px 15px;
	margin-bottom: 30px;
}



.box-gallery {
	position: relative;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	height: 100%;
	width: 100%;
	overflow: hidden;
	-webkit-transition: all 1s ease-in-out;
	-khtml-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}



.box-gallery .text-gallery{
	position: absolute;
	
	left: 0;
	right: 0;
	bottom: 0;
	padding: 15px;
	background: rgb(255 255 255 / 80%);
	-webkit-transition: all 0.5s ease-in-out;
	-khtml-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.box-gallery .text-gallery h4 {
	font-size: 20px;
	margin-bottom: 0px;
	color:#000000;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 1;
}



.box-gallery .text-gallery p {
	color: #ffffff;
	margin-bottom: 0px;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	-webkit-line-clamp: 3;
}



@media (min-width: 748px) {
	.item-gallery {
		display: block;
		float: left;
		width: 50%;
		height: 300px!important;
		padding: 0px 15px;
	}
}



@media (min-width: 1024px) {
	.item-gallery:nth-child(6n+1) {

		float: left;
		height: 60vh!important;
		padding: 0px 15px;
		padding-bottom: 30px;
		/* display: inline-block; */
		width: 65%;
		margin-bottom: 0px;
	}


	.item-gallery:nth-child(6n+2) {

		float: left;
		height: 30vh!important;
		padding: 0px 15px;
		padding-bottom: 30px;
		/* display: inline-block; */
		width: 35%;
		margin-bottom: 0px;

	}


	.item-gallery:nth-child(6n+3) {

		float: left;
		height: 30vh!important;
		padding: 0px 15px;
		padding-bottom: 30px;
		/* display: inline-block; */
		width: 35%;
		margin-bottom: 0px;
	}

	.item-gallery:nth-child(6n+4) {

		float: right;
		height: 60vh!important;
		padding: 0px 15px;
		padding-bottom: 30px;
		/* display: inline-block; */
		width: 65%;
		margin-bottom: 0px;
	}


	.item-gallery:nth-child(6n+5) {

		float: right;
		height: 30vh!important;
		padding: 0px 15px;
		padding-bottom: 30px;
		/* display: inline-block; */
		width: 35%;
		margin-bottom: 0px;

	}


	.item-gallery:nth-child(6n+6) {

		float: right;
		height: 30vh!important;
		padding: 0px 15px;
		padding-bottom: 30px;
		/* display: inline-block; */
		width: 35%;
		margin-bottom: 0px;
	}

	

	
	.box-gallery .text-gallery{
		position: absolute;

		left: 0;
		right: 0;
		bottom: -50%;
		padding: 15px;
		opacity: 0;
		background: rgb(255 255 255 / 80%);
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}

	.box-gallery .text-gallery h4 {
		font-size: 20px;
		margin-bottom: 0px;
		color:#000000;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-box-orient: vertical;
		display: -webkit-box;
		-webkit-line-clamp: 1;
	}





	.box-gallery:hover .text-gallery{
		bottom: 0;
		opacity: 1;
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}



	.box-gallery:hover{
		background-position: top center;
		-webkit-transition: all 0.5s ease-in-out;
		-khtml-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
}












#page-section{
	padding: 50px 0px;
} 






.page-header{
	position: relative;
	font-size: 45px;
	color: #333333;
	display: inline-block;
}

.page-header:before{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -15px;
	background: #56a9f7;
	height: 1px;
}








@media (min-width: 992px) {
	#activity-section .card-body{
		min-height: 590px;
	}


}










@media (min-width: 1600px) {
	.col-lg-menu{
		width: 14.2857%;
	}
}







@media (min-width: 1200px) {
	#intro-section .director .director-head {
		font-size: 1.25vw;
		line-height: 24px;
	}

	#intro-section .director-contact h4{
		font-size: 0.90vw;
		line-height: 24px;
	}

	#intro-section .director .director-name{
		font-size: 1.25vw;
		line-height: 24px;
	}


}



@media (min-width: 1800px) {
	#intro-section .director .director-head {
		font-size: 0.75vw;
		line-height: 24px;
	}

	#intro-section .director-contact h4{
		font-size: 0.70vw;
		line-height: 24px;
	}

	#intro-section .director .director-name{
		font-size: 0.75vw;
		line-height: 24px;
	}


}






@media (max-width: 1200px) {
	#intro-section .director img{
		width: 40%;
	}
}
@media (max-width: 992px) {
	#intro-section .director img{
		width: 50%;
	}
	h2 ,.page-header {
		font-size: 27px;
		line-height: 34px;
	}
}