@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');
/*
font-family: 'Open Sans', sans-serif;
*/

html, body {
	width: 100%; height: 100%; margin:0;
	/* overflow-x: hidden; */
}

h1, h2, h3, h4, h5, h6 {
	transition: .5s;
	margin: 0;
	line-height: 1.2;
	font-weight: 700;
	font-style: normal;
	font-family: 'Open Sans', sans-serif;
}
h1 { font-size: 50px; }
h2 { font-size: 40px; }
h3 { font-size: 30px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 18px; }

p {
	margin: 0;
	/* color: #3d3d3d; */
	font-size: 18px;
	font-weight: 400;
	line-height: 1.7;
	font-style: normal;
	font-family: 'Open Sans', sans-serif;
	-webkit-font-smoothing: antialiased;
		-moz-font-smoothing: antialiased;
}

ol, li, ul { color: #3d3d3d; font-family: 'Open Sans', sans-serif; font-size: 18px; font-weight: 400; line-height: 1.7; font-style: normal; }
small { font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 500; line-height: 1.0; }

a, a:visited {
	font-family: 'Open Sans', sans-serif;
	text-decoration: none;
	cursor: pointer;
	color: #e51313;

	-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		 -ms-transition: all 0.2s;
		  -o-transition: all 0.2s;
			  transition: all 0.2s;
}
a:hover, a:focus, a:active { text-decoration: underline; color: #000; outline: none; }



/* CUST_AMINATION
============================================================================================================================== */



/* HEADER
============================================================================================================================== */

header {
	background:linear-gradient(0deg, rgba(4, 32, 57, 0.8), rgba(4, 32, 57, 0.8)), url('../imgs/BGs/BG-2.jpg');
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 50px;
	padding-top: 50px;
	/* text-align: center; */
	color: #FFF;
}
header p { font-size: 16px; }
header a, header a:visited {
	text-decoration: none;
	color: #88c7ff;
}
header a:hover, header a:focus, header a:active { text-decoration: underline; color: #000; outline: none; }
header .wrap-logo { max-width: 200px; background-color: #FFF; padding: 20px; border-radius: 20px; margin: 0 auto; }



/* NAVBAR
============================================================================================================================== */

.nav-main { position: relative; z-index: 50; background-color: #FFF; padding-top: 15px; padding-bottom: 15px; }
.wrap-logo { width: 200px; margin-left: 60px; margin-right: 50px; padding: 10px 20px 10px 20px; }

.nav-main .navbar-nav .nav-link {
	padding-right: 20px;
	padding-left: 20px;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-weight: 600;
	color: #151241;
	-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		 -ms-transition: all 0.2s;
		  -o-transition: all 0.2s;
			  transition: all 0.2s;
}
@media only screen and (max-width: 1264.50px) { .nav-main .navbar-nav .nav-link { font-size: 16px; padding-right: 10px; padding-left: 10px; } }
@media only screen and (max-width: 1060.50px) { .nav-main .navbar-nav .nav-link { font-size: 14px; padding-right: 10px; padding-left: 10px; } }
@media only screen and (max-width: 960.50px) { .nav-main .navbar-nav .nav-link { font-size: 12px; font-weight: 400; padding-right: 6px; padding-left: 6px; } }

.nav-main .navbar-nav .nav-link:focus, .nav-main .navbar-nav .nav-link:hover { text-decoration: none; color: #FFF; background-color: #0e3e68; padding-top: 15px; padding-bottom: 0; }
.nav-main .dropdown-menu { background-color: #FFF; padding: 0; border: 0; }
.nav-main .dropdown-item { padding-top: 10px; padding-bottom: 10px; font-weight: 700; color: #000; }
.nav-main .dropdown-item:focus, .dropdown-item:hover { background-color: #0e3e68; text-decoration: none; color: #FFF; }

.nav-main .offcanvas-header { padding-right: 60px; }
.nav-main .offcanvas-top { height: 100%; background-color: #FFF; }

@media only screen and (max-width: 767.50px) {
	.nav-main .navbar-nav .nav-link { font-size: 16px; font-weight: 600; background-color: #FFF; }
	.nav-main .navbar-nav .nav-link:focus, .nav-main .navbar-nav .nav-link:hover { text-decoration: none; color: #FFF; background-color: #0e3e68; padding-top: 10px; padding-bottom: 10px; padding-left: 20px; }
	.nav-main .offcanvas-body { padding-left: 100px; padding-right: 50px; }
	.nav-main .navbar-nav .nav-item:first-child { border-top: 1px solid #0e3e68; border-bottom: 1px solid #0e3e68; padding-top: 5px; padding-bottom: 5px; }
	.nav-main .navbar-nav .nav-item { border-bottom: 1px solid #0e3e68; padding-top: 5px; padding-bottom: 5px; }
	.nav-main .navbar-nav .nav-item:last-child { border-bottom: 1px solid #0e3e68; padding-top: 5px; margin-bottom: 15px; }

	.nav-main .dropdown-item { font-size: 15px;; padding-top: 10px; padding-bottom: 10px; color: #000; }
	.nav-main .dropdown-item:focus, .dropdown-item:hover { background-color: #0e3e68; text-decoration: none; color: #FFF; }
}



/* SLIDER
============================================================================================================================== */

.slider-main { position: relative; z-index: 20; }

.slider-main .carousel-caption { bottom: 10%; left: 45%; text-align: left; width: 50%; }
.slider-main .carousel-caption h2 { font-size: 72px; color: #FFF; }
.slider-main .carousel-caption p { font-size: 48px; line-height: 1.2; color: #FFF; }

@media only screen and (max-width: 1389.50px) {
	.slider-main .carousel-caption { bottom: 5%; }
	.slider-main .carousel-caption h2 { font-size: 60px; }
	.slider-main .carousel-caption p { font-size: 40px; }
}
@media only screen and (max-width: 1199.50px) {
	.slider-main .carousel-caption h2 { font-size: 50px; }
	.slider-main .carousel-caption p { font-size: 30px; }
}
@media only screen and (max-width: 1079.50px) {
	.slider-main .carousel-caption h2 { font-size: 40px; }
	.slider-main .carousel-caption p { font-size: 20px; }
	.slider-main .carousel-caption button { font-size: 14px; padding: 8px 20px 8px 20px; }
}
@media only screen and (max-width: 859.50px) {
	.slider-main .carousel-caption h2 { font-size: 30px; }
	.slider-main .carousel-caption p { font-size: 18px; }
}
@media only screen and (max-width: 769.50px) {
	.slider-main .carousel-caption { bottom: 10%; }
	.slider-main .carousel-caption button { display: none; }
}
@media only screen and (max-width: 639.50px) {
	.slider-main .carousel-caption { display: none; }
}

.card-logo {
	border: 0;
	z-index: 40;
	float: right;
	max-width: 200px;
	position: relative;
	margin-bottom: -170px;
	border-radius: 0 0 20px 20px;
	margin-right: 100px;
}
@media only screen and (max-width: 991.50px) { .card-logo { max-width: 150px; } }



/* FORMS
============================================================================================================================== */

label {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
}
.form-control, .form-select {
	font-family: 'Open Sans', sans-serif;
	color: #000;
	font-size: 14px;
	font-weight: 400;
	border: 3px solid #000;
	background-color: #FFF;
	border-radius: 10px;
	padding: 10px 15px 10px 15px;

	-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		  -o-transition: all 0.2s;
		 -ms-transition: all 0.2s;
			  transition: all 0.2s;
}
.form-control:active, .form-control:hover, .form-select:active, .form-select:hover { border-color: #fd9500; color: #004ead; }
.form-control:focus, .form-select:focus { border-color: #fd9500; color: #004ead; -webkit-box-shadow: none; box-shadow: none; }

.table { font-family: 'Open Sans', sans-serif; }



/* BUTTONS
============================================================================================================================== */

.btn-main {

	font-size: 16px;
	font-weight: 700;
	font-style: normal;
	padding: 15px 35px 15px 35px;
	font-family: 'Open Sans', sans-serif;
	border-radius: 30px;
	-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		 -ms-transition: all 0.4s ease-in-out;
		  -o-transition: all 0.4s ease-in-out;
			  transition: all 0.4s ease-in-out;
}

.btn-main.sml { font-size: 14px; padding: 8px 20px 8px 20px; }
.btn-main.unfill { background-color: #FFF; color: #e51313; border: 3px solid #e51313; }
.btn-main.unfill:hover { background-color: #e51313; color: #FFF; }
.btn-main.full { width: 100%; }

.btn-main.red { background-color: #e51313; color: #FFF; border: 3px solid #e51313; }
.btn-main.red:hover { background-color: #FFF; color: #e51313; }

.btn-main.white { background-color: #FFF; color: #000; border: 3px solid #000; }
.btn-main.white:hover { background-color: #000; color: #FFF; border: 3px solid #FFF; }

.btn-OR {
	width: 85px;
	height: 85px;
	border-radius:50%;
	margin-left: -50px;
	margin-right: -50px;
	position: relative;
	z-index: 10;
	background-color: #d8ffe5; color: #000; border: 3px solid #000;
}
.btn-OR:hover, .btn-OR:active, .btn-OR:focus { background-color: #FFF; color: #e51313; }
@media only screen and (max-width: 419.50px) { .btn-OR { display: none; } }



/* FOOTER
============================================================================================================================== */

footer {
	background-color: #232323;
	color: #FFF;
	padding-top: 80px;
}

footer p { font-size: 16px; }
footer .fa-ul { margin: 0 0 0 25px; padding: 0; }
footer .fa-ul li { font-size: 16px; color: #FFF; }

footer a, footer a:visited { text-decoration: none; color: #FFF; }
footer a:hover, footer a:focus, footer a:active { text-decoration: none; color: #0088ff; }
@media only screen and (max-width: 575.50px) {
	footer .fa-li { display: none; }
	footer .fa-ul { margin: 0; padding: 0; }
}



/* OTHERS
============================================================================================================================== */

.title h1, .title h2 { color: #002c5c; font-size: 35px; font-weight: 600; }
.title h3 { color: #002c5c; font-weight: 600; }
.title p { font-weight: 400; }

.BG-red-l { background-color: #fff3f3; }
.BG-blue-l { background-color: #eef7ff; }
.BG-blue-d { background-color: #0c375d; }
.bg-black { background-color: #000; }

.text-blue-l { color: #bde0ff; }
.text-blue-d { color: #1e3050; }


.wrap-intro {
	position: relative;
	/* background-color: #0c375d; */
	background:linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('../imgs/BGs/BG-1.jpg');
	background-size:cover;
	background-position: center center;
	background-repeat: no-repeat;

	margin-top: -40px;
	margin-bottom: -40px;
	padding-top: 120px;
	padding-bottom: 120px;
}


.card-events {
	border: 0;
	background-color: #f5f5f5;
}
.card-events .date h2 { font-weight: 800; transform: scale(1.0, 1.2); }
.card-events .date h3 { font-weight: 600; font-size: 38px; transform: scale(1.1, 1.2); }
.card-events .desc p { font-weight: 300; font-size: 14px; }

.social-media { margin-top: 40px; }
.social-media i {
	color: #1e3050;
	font-size: 80px;
}
@media only screen and (max-width: 424.50px) {
	.social-media i { font-size: 50px; }
	.social-media { margin-top: 0; }
}


.card-years {
	position: absolute;
	background-color: #ffde00;
	border-radius: 0;
	border: 10px solid #FFF;
	padding: 20px 40px 20px 10px;
	top: 50%;
	left: -10%;
}
@media only screen and (max-width: 859.50px) {
	.card-years { position: relative; left: 0; border: 0; }
}


.card-name {
	max-width: 650px;
	margin-left: -200px;
	margin-bottom: 20px;
	background-color: #ffde00;
	border-radius: 0;
	border: 10px solid #FFF;
	padding: 10px;
}
@media only screen and (max-width: 991.50px) {
	.card-name { margin: 0 auto; }
}


.img-commitee {
	border: 10px solid #000;
	transform: scale(0.95);
	filter: grayscale(40%);

	-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		  -o-transition: all 0.2s;
		 -ms-transition: all 0.2s;
			  transition: all 0.2s;
}
.img-commitee:hover {
	border: 5px solid #FFF;
	transform: scale(1.0);
	filter: grayscale(0);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}


.card-resource {
	border: 2px dashed #000;
	transform: scale(0.95);

	-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		  -o-transition: all 0.2s;
		 -ms-transition: all 0.2s;
			  transition: all 0.2s;
}
.card-resource:hover {
	border: 5px solid #FFF;
	transform: scale(1.0);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}
.card-resource button { margin-top: -60px; }


.card-event {
	border: 0;
	transform: scale(0.90);

	-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		  -o-transition: all 0.2s;
		 -ms-transition: all 0.2s;
			  transition: all 0.2s;
}
.card-event:hover {
	transform: scale(1.0);
}
.card-event .card-img-top { border-radius: 50%; }
.card-event button { margin-top: -70px; }


.google-map { width: 100%; height: 350px; border: 2px dashed #282561; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); }
.loginToken, .knowFrm, .office_faxNo { display:none; }