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

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

h1, h2, h3, h4, h5, h6 {
	color: #06305f;
	transition: .5s;
	margin: 0;
	line-height: 1.2;
	font-weight: 700;
	font-style: normal;
	font-family: 'Fira 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 { font-family: 'Open Sans', sans-serif; font-size: 18px; font-weight: 400; line-height: 1.7; }
small { font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight: 400; }

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

	-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 { text-decoration: underline; color: #1100bb; outline: none; }



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



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

header { position: relative; z-index: 20; }
header p { color: #FFF; }

header .row-top { background-color: #22459c; padding-top: 30px; padding-bottom: 50px; }
header .row-btm { margin-top: -30px; }
@media only screen and (max-width: 584.50px) {
	header .row-top { display: none; }
	header .row-btm { margin-top: 0; }
}

.wrap-logo { width: 150px; margin-left: 50px; margin-right: 50px; background-color: #FFF; padding: 10px 20px 10px 20px; }
@media only screen and (max-width: 1399.50px) { .wrap-logo { margin-left: 10px; margin-right: 10px; } }
@media only screen and (max-width: 1199.50px) { .wrap-logo { width: 130px; margin-left: 0; margin-right: 0; } }
@media only screen and (max-width: 991.50px) { .wrap-logo { width: 130px; margin-left: 50px; margin-right: 50px; } }
@media only screen and (max-width: 377.50px) { .wrap-logo { width: 130px; margin-left: 10px; margin-right: 10px; } }
@media only screen and (max-width: 277.50px) { .wrap-logo { width: 130px; margin: 0 auto; } }

.header-pages {
	z-index: 10;
	margin-top: -30px;
	position: relative;
	padding: 150px 0 150px 0;
	background-color: #002a3c;
	text-align: center;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../imgs/BGs/BG_5.jpg') no-repeat top center/auto;
}
.header-pages h1 { color: #FFF; }
.main-breadcrumb p { color: #FFF; font-size: 15px; }
.main-breadcrumb a { color: #FFF; transition: color 0.3s linear; text-decoration: none; }
.main-breadcrumb a:hover { color: #f4a501; text-decoration: underline; }



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

.nav-main {
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
		 transform: translateY(-50%);
}

.nav-main .navbar-nav .nav-link {
	background-color: #ffc107;
	padding-left: 15px;
	padding-right: 15px;
	font-family: 'Fira Sans', sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: #000;

	-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: 1399.50px) { .nav-main .navbar-nav .nav-link { padding-left: 10px; padding-right: 10px; font-size: 17px; } }
@media only screen and (max-width: 1199.50px) { .nav-main .navbar-nav .nav-link { padding-left: 8px; padding-right: 8px; font-size: 14px; } }

.nav-main .navbar-nav .nav-link:focus, .nav-main .navbar-nav .nav-link:hover { transform: scale(1.1); text-decoration: none; }
.nav-main .dropdown-menu { background-color: #ffc107; padding: 0; border: 1px solid #000; }
.nav-main .dropdown-item { padding-top: 10px; padding-bottom: 10px; color: #000; }
.nav-main .dropdown-item:focus, .dropdown-item:hover { background-color: #22459c; text-decoration: none; color: #FFF; font-weight: 700; }

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

@media only screen and (max-width: 991.50px) {
	.nav-main { position: relative; top: 25%; -webkit-transform: none; transform: none; }
	.nav-main .navbar-nav .nav-link { background-color: #FFF; }
	.nav-main .navbar-nav .nav-link:focus, .nav-main .navbar-nav .nav-link:hover { transform: scale(1.0); color: #22459c; }
	.nav-main .offcanvas-body { padding-left: 100px; padding-right: 50px; }
	.nav-main .navbar-nav .nav-item:first-child { border-top: 3px solid #efefef; border-bottom: 3px solid #efefef; padding-top: 5px; padding-bottom: 5px; }
	.nav-main .navbar-nav .nav-item { border-bottom: 3px solid #efefef; padding-top: 5px; padding-bottom: 5px; }

	.nav-main .dropdown-menu { background-color: #FFF; border: 0; }
	.nav-main .dropdown-item { padding-top: 10px; padding-bottom: 10px; color: #000; }
	.nav-main .dropdown-item:focus, .dropdown-item:hover { background-color: #22459c; text-decoration: none; color: #FFF; }
}
@media only screen and (max-width: 277.50px) { .nav-main { top: 0; } }



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

.carousel_main { position: relative; z-index: 10; margin-top: -30px; }
@media only screen and (max-width: 584.50px) { .carousel_main { margin-top: 0; } }



/* 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;

	-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; }

.form-control-lg {
	font-size: 18px;
	border: 1px solid #3f88a8;
}

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



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

.btn-main {
	display: inline-block;
	padding: 18px 32px;
	text-align: center;
	color: #FFF;
	font-size: 20px;
	background: #f4462f;
	border: none;
	font-weight: 600;
	border-radius: 0;
	font-family: 'Fira Sans', sans-serif;
	position: relative;
	z-index: 1;
	overflow: hidden;
	-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::after {
	background-color: #FFF;
	content: "";
	height: 150px;
	left: -75px;
	position: absolute;
	top: -35px;
	transform: rotate(35deg);
	transition: all 1600ms cubic-bezier(0.19, 1, 0.22, 1);
	width: 40px;
	opacity: 0;
}
.btn-main.btn-sml { padding: 10px 20px; font-size: 14px; }
.btn-main.btn-curved { border-radius: 20px; }
.btn-main.unfill { background: transparent; border: 2px solid #fff; color: #fff; }
.btn-main.unfill:hover { border: 2px solid #f4462f; background: #f4462f; }
.btn-main.full { width: 100%; }
.btn-main:hover::after { left: 120%; transition: all 1300ms cubic-bezier(0.19, 1, 0.22, 1); opacity: 0.3; }

.btn-OR {
	width: 85px;
	height: 85px;
	border-radius:50%;
	margin-left: -35px;
	margin-right: -35px;
	position: relative;
	z-index: 10;
}



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

footer h1, footer h2, footer h3, footer h4, footer h5, footer h6, footer p { color: #FFF; }
footer .footer-top {
	padding-top: 70px;
	padding-bottom: 50px;
	background: url('../imgs/BGs/BG_4.png') no-repeat center center/auto;
	background-color: #002a3c;
}
footer .footer-top .wrap-img { width: 180px; margin: 0 auto; }

footer .footer-bottom {
	background: #011e2a;
	padding: 20px 0;
	overflow: hidden;
}

footer .footer-bottom p { font-size: 12px; }
footer a { color: #FFF; transition: color 0.3s linear; text-decoration: underline; }
footer a:hover { color: #fffd42; text-decoration: none; }



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

.wrap-intro {
	padding-top: 50px;
	padding-bottom: 100px;
	background: url('../imgs/BGs/BG_1.png') no-repeat left top/contain;
}
.wrap-supported { padding-top: 20px; padding-bottom: 30px; }
.wrap-supported .wrap-img { width: 80px; margin: 0 auto; }
.wrap-supported p { font-size: 14px;line-height: 1.4; }


.intro .numbers h2 { font-size: 70px; color: #f4462f; }
@media only screen and (min-width: 991.50px) and (max-width: 1199.50px){
	.intro h1 { font-size: 35px; }
	.intro .numbers h2 { font-size: 50px; }
}
.numbers .border-right { border-right: 1px solid #f4462f; }

/* - - - - */

.wrap-highlights {
	padding-top: 60px;
	background: url('../imgs/BGs/BG_2.png') no-repeat left top/contain;
	background-color: #22459c;
}
#carousel-highlights > button {
	position: absolute;
	left: -22px;
	opacity: 1;
	color: #00415D;
}
#carousel-highlights > button.carousel-control-next { right: -22px; left: auto; }
#carousel-highlights > button.carousel-control-next i { left: auto; right: -24px; }
#carousel-highlights > button i {
	color: #002846;
	font-size: 50px;
	position: relative;
	top: 0px;
	left: -24px;
}
@media only screen and (min-width: 767.50px) and (max-width: 991px) {
	#carousel-highlights > button i { left: -10px; }
	#carousel-highlights > button.carousel-control-next i { right: -10px; }
}
@media only screen and (max-width: 767.50px) {
	#carousel-highlights > button i { left: 10px; font-size: 45px; }
	#carousel-highlights > button.carousel-control-next i { right: 10px; }
}
#carousel-highlights .wrap-text {
	padding: 60px 100px 80px;
	text-align: center;
	min-height: 350px;
}
#carousel-highlights .wrap-text h5 {
	font-family: 'Fira Sans', sans-serif;
	margin-bottom: 5px;
	line-height: 1.3;
	font-weight: 700;
	color: #FFF;
}
#carousel-highlights .wrap-text .badge {
	font-family: 'Fira Sans', sans-serif;
	font-weight: 800;
	font-size: 16px;
	color: #000;
}
@media only screen and (max-width: 767.50px) { #carousel-highlights .wrap-text { padding: 60px 30px 30px; } }

/* - - - - */

.card-articles {
	background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.8)), url('../imgs/BGs/BG_3.jpg') no-repeat center center/cover;
	border-radius: 20px;
}
.card-articles .card-body { border: 0; padding: 30px 40px 30px 40px; }
.card-articles .card-footer { border: 0; padding: 30px 40px 30px 40px; }
.card-articles .card-footer h4 { color: #FFF; }
.card-articles .card-footer p { color: #FFF; font-size: 16px; }
.card-articles .card-footer .badge { color: #000; font-size: 14px; }

.card-articles-2 {
	border: 0;
	border-radius: 20px;
	transform: scale(0.95);

	-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;
}
.card-articles-2:hover { transform: scale(1); }
.card-articles-2 img {
	filter: grayscale(60%);
	border-radius: 20px;

	-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;
}
.card-articles-2:hover img { filter: grayscale(0); }
.card-articles-2 .card-body {
	margin-bottom: 0;
	text-align: center;
	padding: 20px 30px 0 30px;
}
.card-articles-2 .card-footer {
	padding: 10px 30px 30px 30px;
	background-color: transparent;
	border: 0;
	border-radius: 20px;
	text-align: center;
}


/* - - - - */

.wrap-event {
	margin: 5px;
	border-radius: 20px;
	background-color: #FFF;
	border: 3px solid #dedede;

	-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;
}
.wrap-event:hover { border: 3px solid #22459c; }
.wrap-event .div-img { height: 250px; }
.wrap-event .div-img img { border-radius: 20px; padding: 10px; }
.wrap-event .card { height: 200px; border: 0; border-radius: 0 0 20px 20px; }
.wrap-event a, .wrap-event a:hover { text-decoration: none; }

@media only screen and (max-width: 1399.50px) { .wrap-event .div-img { height: 180px; } }
@media only screen and (max-width: 991.50px)  { .wrap-event .div-img { height: 220px; } }
@media only screen and (max-width: 767.50px)  { .wrap-event .div-img, .wrap-event .card { height: auto; } }

.wrap-past-events { background-color: #ffe8e8; }

/* - - - - */

.wrap-history {
	padding-top: 50px;
	padding-bottom: 50px;
	margin-top: 350px;
	background-color: #fffbbf;
}

.content-history {
	position: relative;
	margin-top: -300px;
	padding: 50px;
	background: url('../imgs/BGs/BG_2.png') no-repeat left top/contain;
	background-color: #22459c;
}
.content-history h2 { color: #FFF; }
.content-history p { color: #FFF; margin-top: 15px; }

/* - - - - */

.img-president {
	border-radius: 50%;
	border: 5px solid #002a3c;
}

/* - - - - */

.card-councils { border: 0; top: 0; transition: top ease 0.5s; }
.card-councils:hover { top: -10px; }
.card-councils .card-body { border-top: 0; border-bottom: 4px solid #fd9500; }

.overlay-blue {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: .5s ease;
	background-color: #1d3159;
}
.card-councils:hover .overlay-blue { opacity: 0.8; }

.overlay-content {
	position: absolute;
	opacity: 0;
	top: 20%;
	right: 0;
}
.overlay-content i { font-size: 25px; }
.card-councils:hover .overlay-content { opacity: 1.0; }

.card-past-council {
	width: 300px;
	margin: 0 auto;
	border-radius: 0;
	border: 1px solid #000;
	transform: scale(0.95);

	-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;
}
.card-past-council:hover { transform: scale(1.0); border: 4px solid #2a458c; }
.arrow-up { font-size: 70px; color: #e3e005; }

.card-past-council .card-footer {
	border-radius: 0;
	background-color: #747474;

	-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;
}
.card-past-council:hover .card-footer { background-color: #2a458c; }

/* - - - - */

.card-conf {
	border-radius: 20px;
	border: 3px solid #dedede;

	-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;
}
.card-conf:hover { border: 3px solid #22459c; }
.card-conf img { border-radius: 20px 20px 0 0; }
.card-conf .card-body { text-align: center; padding-top: 30px; padding-bottom: 30px; }
.card-conf .btn-main { border-radius: 0 0 20px 20px; }

/* - - - - */

.cust ol { list-style: none; padding-top: 10px; }
.cust ol > li { padding-bottom: 10px; }

/* - - - - */

.card-thumb {
	border: 1px solid #FFF;
	transform: scale(0.95);

	-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;

}
.card-thumb:hover { transform: scale(1.0); border-radius: 20px; border: 3px solid #000; }

.card-thumb img {
	filter: grayscale(70%);

	-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;
}
.card-thumb:hover img { filter: grayscale(0); border-radius: 20px 20px 0 0; }

.card-thumb .card-footer { padding: 0; border: 0; margin: 0; }
.card-thumb .btn-main { border-radius: 0; }
.card-thumb:hover .btn-main { border-radius: 0 0 20px 20px; }

/* - - - - */

.google-map {
	width: 650px;
	height: 550px;
	position: relative;
	margin: 0 auto;
	border: 10px solid #000;
	border-radius: 0 80px 30px 80px;
}
@media only screen and (max-width: 1199.50px) { .google-map { width: 450px; height: 450px; } }
@media only screen and (max-width: 991.50px) { .google-map { width: 100%; height: 500px; } }
@media only screen and (max-width: 575.50px) { .google-map { width: 100%; height: 450px; border: 0; border-radius: 0; margin-bottom: -105px; } }

email::after { content: attr(data-domain); }
email::before { content: attr(data-user); }

.wrap-nomBtns { margin-left: -100px; }
@media only screen and (max-width: 767.50px)  { .wrap-nomBtns { margin-left: 0; text-align: center; margin-top: 20px } }