@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:300,400,500,700,900');
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:300,400,500,700,900');

input[type='checkbox'] {
	cursor: pointer !important;
}



.fs-08 { font-size: 0.8em !important; }
.fs-09 { font-size: 0.9em !important; }
.fs-1em { font-size: 1em !important; }
.fs-11em { font-size: 1.1em !important; }
.fs-12em { font-size: 1.2em !important; }
.fs-13em { font-size: 1.3em !important; }
.fs-14em { font-size: 1.4em !important; }
.fs-15em { font-size: 1.5em !important; }

.fs-10 { font-size: 10px; }
.fs-11 { font-size: 11px; }
.fs-12 { font-size: 12px; }
.fs-14 { font-size: 14px; }
.fs-15 { font-size: 15px; }
.fs-16 { font-size: 16px; }
.lh-15 { line-height: 1.5 !important; }
.lh-20 { line-height: 2 !important; }
label.form-check-label { cursor: pointer; }

/*-----------------*/
/* Text
* -----------------*/
.text-primary { color: #2540A8 !important; }
.text-light2 { color: #ddd !important; }

/*-----------------*/
/* Button
* -----------------*/
.btn {
	padding: 0.5rem 1.2rem;
	border-radius: 60px;
	cursor: pointer;
}
.btn-lg {
	padding: 1rem 3rem;
	border-radius: 60px;
}
.btn-sm {
	padding: 0.3rem 1rem;
	border-radius: 60px;
}
.bg-grey {
	background-color: #F2F4F5 !important;
	color: #333;
}
.bg-grey-2 {
	background-color: #eee !important;
	color: #333;
}
.bg-primary,
.btn-primary {
	background-color: #2541A8 !important;
	border-color: #2541A8 !important;
	color: #fff !important;
}
.btn-primary:hover,
.btn-primary.btn-outline:hover {
	background-color: #19338e !important;
	border-color: #19338e !important;
	color: #fff !important;
}
.btn-primary.btn-outline {
	background-color: #fff !important;
	border: 1px solid #2541A8 !important;
	color: #2541A8 !important;
}
.bg-secondary,
.btn-secondary {
 	background-color: rgba(54,108,243,.1) !important;
 	border-color: rgba(54,108,243,.1) !important;

}
.btn-secondary:hover {

 	color: #fff;
}
.bg-info,
.btn-info {
	background-color: #357FD4 !important;
	border-color: #357FD4 !important;
	color: #fff !important;
}
.btn-info:hover,
.btn-info.btn-outline:hover {
	background-color: #357FD4 !important;
	border-color: #357FD4 !important;
	color: #fff !important;
}
.btn-info.btn-outline {
	background-color: #fff !important;
	border: 1px solid #357FD4 !important;
	color: #357FD4 !important;
}

.bg-success,
.btn-success {
       background-color: var(--bs-blue) !important;
    border-color: var(--bs-blue) !important;

}
.btn-success:hover {
	background-color: #34A898 !important;
	border-color: #34A898 !important;
}


/*-----------------*/
/* Modal
* -----------------*/
.modal-header {
	background-color: #E9F1FE;
}
.modal-title {
	/*font-family: Kanit;
	font-size: 20px;
	font-weight: 300;*/
}


/*-----------------*/
/* Top bar + Tab
* -----------------*/
.courses_button,
.home_search_button,
.top_bar 
{
	background: #2441A8 !important;
}

.tab.active,
.tab:hover
{
	background: #2441A8 !important;
	color: #FFFFFF !important;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #fff;
    background-color: #1CC9B4;
}



/*-----------------*/
/* Breadcrumbs
* -----------------*/
.breadcrumbs_container
{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding-bottom: 7px;
}
.breadcrumbs ul li
{
	display: inline-block;
	position: relative;
}
.breadcrumbs ul li:not(:last-child)::after
{
	display: inline-block;
	font-family: 'FontAwesome';
	content: '\f105';
	margin-left: 7px;
	margin-right: 4px;
	color: #384158;
	font-size: 10px;
}
.breadcrumbs ul li a
{
	font-size: 14px;
	font-weight: 300;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.breadcrumbs ul li a:hover
{
	color: #2541A8;
}


/*-----------------*/
/* Footer
* -----------------*/



/*-----------------*/
/* General
* -----------------*/
.page-link {
	padding: 0.3em 0.7em;
	border:0;
}
.page-item .page-link:not(.page-next):hover,
.page-item .page-link:not(.page-next):focus,
.page-item .page-link:not(.page-next):active {
	border-radius: 50%;
	/*background-color: transparent;
	text-decoration: underline;*/
}
.page-item.active .page-link {
	border-radius: 50%;
	background-color: #2441A8;
}
.input-group > .form-control.form-search {
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
}




@media only screen and (min-width: 991px)
{
	.main_nav li a {
		font-size: 0.9rem !important;
	}
	.main_nav li {
		margin-right: 20px !important;
	}
	.main_nav .input-group {
		max-width: 250px !important;
	}
}

@media only screen and (min-width: 1440px)
{
	.main_nav li > a {
		font-size: 1.2rem !important;
	}
	.main_nav li:not(:last-child) {
		margin-right: 44px !important;
	}
	.main_nav .input-group {
		max-width: 250px !important;
	}
}