html{ height: 100%;}
body {background:#fff;
	font-family: 'Arimo', sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: #222;
}
h1, h2, h3{ font-family: 'Playfair Display', serif;}
h1{ font-size: 35px}
h1.xl, h1.xxl{font-size: 40px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	line-height: 1;}

.tm{ position:relative}
.tm::after{
	content: '™';
	font-size: 0.5em;
	font-family: Arial;
	font-weight: 100;
	position: absolute;
	transform: translate(-2px, 10px);
}

h5{ font-size: 18px}
a{color: #114f9a}
a.link-normal{ color: #222; text-decoration: none}

section{ margin: 50px auto; overflow: hidden}
.star-list, .arrow-list{ margin: 0; padding: 0}
.star-list li{ display: block; font-size: 18px; margin: 0; padding: 10px;  background: url("../assets/images/star.png") left 16px no-repeat; padding-left: 30px}
.arrow-list li{display: block; background: url("../assets/images/arrow.png") left 12px  no-repeat; line-height: 1.4; padding: 5px 0 5px 30px}

label, .col-form-label{ font-size: 14px; font-weight: 800}
hr {color: #ddd; opacity: 1;}
th{line-height: 1; vertical-align: middle}



/*
Custom Utilities
*/
.z-index-0{ z-index: 0 !important;}
.h-50px{ height: 50px}
.mt--30px{ margin-top: -30px}
.mt--40px{ margin-top: -40px}
.mt--50px{ margin-top: -50px}
.h-100lvh{ height: 100lvh}
.min-height-50{ min-height: 50px}
.min-height-60{ min-height: 60px}
.max-width-900{ max-width: 900px}
.max-width-500{ max-width: 500px !important;}

.fs-12{ font-size: 12px !important}
.fs-14{ font-size: 14px !important}
.fs-15{ font-size: 15px !important}
.fs-16{ font-size: 16px !important}
.fs-18{ font-size: 18px !important}
.fs-20{ font-size: 20px !important}
.fs-22{ font-size: 22px !important}
.fs-25{ font-size: 25px !important}
.fs-50{ font-size: 50px !important}
.fs-60{ font-size: 60px !important}
.fs-70{ font-size: 70px !important}

.fw-400{ font-weight: 400 !important;}
.fw-500{ font-weight: 500 !important;}
.fw-600{ font-weight: 600 !important;}
.fw-700{ font-weight: 700 !important;}
.fw-800{ font-weight: 800 !important;}


.border-radius-0{ border-radius: 0 !important;}
.text-shadow{text-shadow: 1px 1px 10px rgba(0,0,0,0.2);}
.text-shadow-strong{text-shadow: 1px 1px 10px rgba(0,0,0,1);}
.text-yellow{color: #F4B400}

.stared-danger-centered{ display: block; background: url("../assets/images/3star.png" ) top center no-repeat; padding-top: 25px; display: inline-block}
.stared-primary-left{ display: block; background: url("../assets/images/3star_primary.png" ) top left no-repeat; padding-top: 25px; display: inline-block}
.stared-primary-center{ display: block; background: url("../assets/images/3star_primary.png" ) top center no-repeat; padding-top: 25px; display: inline-block}

.thumb{ object-fit: cover !important; }

.overlay {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background:-webkit-linear-gradient(0deg, rgba(0,0,0,0.9), rgba(0,0,0,0.6) 50%);
	z-index: 1;
}

.dashed-bottom{ border-bottom: 1px dashed #DDD}

.box-shadow{box-shadow: 0px 10px 21.25px 3.75px rgba(0, 0, 0, 0.06)}
.cursor-pointer{ cursor: pointer}

.gutter-margin-top{ margin-top: 50px; overflow: hidden}
.gutter-margin-bottom{ margin-bottom: 50px; overflow: hidden}
.gutter-sm-margin-bottom-0{ margin-bottom: 0px}

/*Bootstrap Overirdes*/
.container-inner{max-width: 1170px}
.btn{ border-radius: 4px; font-size: 16px; background-image: none; --bs-btn-box-shadow: none}
.btn-md{ padding: 16px 40px;  font-weight: 700; font-size: 14px}
.form-control{ border-radius: 0; font-size: 0.87rem; padding: 0.5rem 0.75rem;}

.btn-xs{font-size: 12px;
	padding: 2px 10px;
	font-weight: 600;}

.btn-danger {
	--bs-btn-bg: #E3171D;
	--bs-btn-border-color: #BF1517;
	--bs-btn-hover-bg: #FF1F24;
	--bs-btn-hover-border-color: #E3171D;
	--bs-btn-focus-shadow-rgb: 225,83,97;
	--bs-btn-active-bg: #E3171D;
	--bs-btn-active-border-color: #BF1517;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-bg: #dc3545;
	--bs-btn-disabled-border-color: #dc3545;
}

.btn-outline-primary {
	--bs-btn-color: #0033A0;
	--bs-btn-border-color: #0033A0;
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #0033A0;
	--bs-btn-hover-border-color: #032979;
	--bs-btn-focus-shadow-rgb: 13,110,253;
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #0033A0;
	--bs-btn-active-border-color: #0033A0;
	--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	--bs-btn-disabled-color: #0d6efd;
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: #0d6efd;
	--bs-gradient: none;
}

.alert-dismissible .btn-close {
height: auto;
}

.btn-group-sm>.btn {
	padding: 3px 5px;
    font-size: 0.8rem ;
}

.tooltip-inner {
	font-size: 12px;
}

.form-control-lg {
	padding: 0.8rem 1rem;
	font-size: 0.9rem;
}

.form-check-input:checked {
	background-color: #0033A0;
	border-color: #032E8E;
}

input[type="text"]:read-only {
	background-color: #F0F0F0;
}

.btn-primary {
	--bs-btn-bg: #0033A0;
	--bs-btn-border-color: #032E8E;
}

.text-bg-primary {
	background-color: #0033A0 !important;
}
.text-primary {
	color: #0033A0 !important;
}
.bg-primary {
	background-color: #0033A0!important;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
	--bs-table-bg-type: none;
	background: #F5F5F5;
}
.table>:not(caption)>*>* {
	padding: 0.9rem 0.5rem;

}
.table>thead{
	border-bottom: 5px solid #0033A0;
}


.table tbody.bordered-top { border-top: 5px solid #0033A0;}


.alert{ font-size: 14px; padding: 10px 20px; border-radius: 0}

.modal-content{ border:0; border-radius: 0;}
.modal-title{ font-size: 1.08rem !important;}
.modal-header .btn-close{ width: 12px; height: 12px; background-size: 12px 12px}
.modal-footer button{ font-size: 14px; padding: 8px 20px; font-weight: 500}

#gatekey_modal input{ margin: 5px; text-align: center; font-weight: 700; text-transform: uppercase}


#offcanvass-form{ width: 700px}
#offcanvass-form .btn-close{ position: absolute; top:20px; right: 20px}

#offcanvass-form .referral-meta ul{ margin: 0; padding: 0 30px}
#offcanvass-form .referral-meta ul li{display: flex; justify-content: space-between; padding: 8px 12px; border-bottom: 1px solid #ddd}
#offcanvass-form .referral-meta ul li:last-child{ border:none; padding-bottom: 0}

#offcanvass-form form.coordinator_notes label{ line-height: 1}
#offcanvass-form .list-group li{ display: flex; justify-content: space-between}


.modal-backdrop {z-index: 2;}



.navbar .megamenu{ padding: 1rem; padding-top: 0 }
.navbar .megamenu .col-megamenu{padding: 20px; height: 100%;}
.navbar .megamenu .col-megamenu:last-child{ border:none}
.navbar .megamenu .row-megamenu{ margin-bottom: 20px; overflow: hidden}
.navbar .megamenu .row-megamenu:last-child{ margin-bottom: 0}

.navbar .megamenu h6{ position: relative; line-height: 1; margin-top: 20px; margin-bottom: 20px; font-size: 16px; font-weight: 700}
.navbar .megamenu h6:before{
	content: '';
	width: 60px;
	height: 2px;
	background-color: #0033A0;
	position: absolute;
	bottom: -5px;
	left: 0;
}

.navbar .megamenu h6 a{ font-size: 16px; text-decoration: none; color: #222; font-weight: 700}
.navbar .megamenu h6 a:hover{ color: #0033A0}

.navbar .megamenu ul {
	margin: 0;
	padding: 0;
	margin-left: 20px;
	color: #E3171D;
	font-size: 12px;
}
.navbar .megamenu li{ list-style: disc}
.navbar .megamenu li a{ line-height: 1; margin:10px 0 !important; padding: 0 !important;}
.navbar .megamenu li a{ font-size: 13px; color:#222; text-decoration: none; border-bottom: none !important; line-height: 1; display: block}
.navbar .megamenu li a:hover{ background: none !important; color: #222 !important; text-decoration: underline}
.navbar .megamenu .sidebar_posts h5{ line-height: 1}
.navbar .megamenu .sidebar_posts h5 a{ font-size: 16px; line-height: 1}
.navbar .megamenu .sidebar_posts h5 a:hover{ text-decoration: underline}

.dropdown-menu{
	display: none;
	border: none;
	border-top: 5px solid #0033A0;
	border-radius: 0;
	animation-duration: 0.3s;
	-webkit-animation-duration: 0.3s;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	-webkit-animation-name: slideIn;
	animation-name: slideIn;
	box-shadow: rgba(168, 180, 208, 0.3) 0 4px 25px 0;
}

.dropdown:hover .dropdown-menu {
	margin-top: 0;
}


.user_widget .dropdown-menu{
	border: 1px solid #F5F5F5;
	border-top: 1px solid #F7F7F7;
	animation:none;

}

.user_widget .dropdown-menu li {
	position: relative;
}

.user_widget .dropdown-menu li a.dropdown-item {
	font-size: 14px;
}



.user_widget .dropdown-menu .dropdown-submenu {
	display: none;
	position: absolute;
	left: 40%;
	top: 0px;
}
.user_widget .dropdown-menu .dropdown-submenu-left {
	right: 100%;
	left: auto;
}
.user_widget .dropdown-menu > li:hover > .dropdown-submenu {
	display: block;
}


.has-megamenu a.btn, .btn-launch-gate-key{font-weight: 700; white-space: nowrap}
.dropdown-menu.megamenu{ margin-top: -10px}

/* TODO DAPAT LAGING VISIBLE XA */
#live-banner #live-banner-announcement, #live-banner .ive-banner-msg{display: none}

#live-banner .dropdown-menu{ padding: 0; margin-bottom: 10px}
#live-banner .dropdown-menu a{ font-size: 14px; border-bottom: 1px solid #DDD; padding: 5px 8px}

header .navbar{ background-image: none}


header .header-contents{ padding-top: 50px; height: 100%}
header .navbar ul.navbar-nav{ margin-top: 10px}

header .navbar .navbar-toggler{ margin-top: -10px; box-shadow: none; color: #ddd; border: 1px solid #ddd; border-radius: 5px }
header .navbar .navbar-collapse{ margin-left: -1.5em; margin-right: -1.5em; margin-top: 10px; background: #FFF; box-shadow: 0px 10px 21.25px 3.75px rgba(0, 0, 0, 0.06)}
header .navbar .navbar-collapse li.nav-item a.nav-link{color: #222}
header .navbar .navbar-collapse li.nav-item{ border-bottom: 1px solid #DDD}

header .navbar .dropdown ul{ padding: 0px}
header .navbar .dropdown li a{border-bottom: 1px solid #DDD; padding: 8px 20px}
header .navbar .dropdown li a:last-child{ border: none}

header .navbar .dropdown li a:hover,
#live-banner .dropdown-menu a:hover,
#live-banner .dropdown-menu a.active,
.dropdown-item.active, .dropdown-item:active{background:#0033A0; color:#FFF }

header .navbar .nav-item.has-megamenu{margin-top: 0px}
header .navbar .nav-item.has-megamenu a.btn-exclusive-project{ width: 100%; margin: 0; border-radius: 0}

header .navbar .nav-item a.nav-link{
	padding: 16px 10px;
	font-size: 16px;
	margin: auto 10px;
	position: relative;
	-webkit-transition: all .4s ease;
	transition: all .4s ease;
	display: block;
	white-space: nowrap;
}



header .navbar.navbar-dark .nav-item a.nav-link{
	color:#FFF
}

header .navbar .nav-item a.nav-link:before{
	content: '';
	width: 0%;
	height: 4px;
	background-color: #0033A0;
	position: absolute;
	bottom: 10px;
	left: 0;
	-webkit-transition: all .4s ease;
	transition: all 0.4s ease;
}

header .navbar .nav-item a.nav-link.active:before{
	content: '';
	width: 100%;
	height: 4px;
	background-color: #0033A0;
	position: absolute;
	bottom: 10px;
	left: 0;
}


header .navbar .nav-item a.nav-link:hover::before{
	width: 100%;
}

header .navbar .nav-item.dropdown a.nav-link:hover::before{
	width: 0%;
}

header .navbar.fixed-top{ position: relative}

a.branding{
	font-family: 'Playfair Display', serif;
	line-height: 1;
	background:url('../assets/images/brand1.png');
	font-size: 19px;
	background-position: 110px top;
	width:249px;
	height:auto;
	padding-top: 39px;
	background-repeat: no-repeat ;
	display: block;
	margin-top: -40px;
	color: #FFF;
}
footer a.footer-brand{ margin: 0 auto 20px}

a.branding sup{font-family: Arial;
	font-size: 12px;
	font-weight: normal;
	top: -0.8em;
	display: inline-block;
	padding-left: 2px;
}

a.branding span{
	font-family: Arial;
	font-weight: normal;
	display: block;
	font-size: 12px;
	text-transform: uppercase;
	width: 100%;
	text-align: center;
	line-height: 22px;
	position: relative;
}

a.branding span:before{
	content:'';
	background: url('../assets/images/branding_star.png') left center no-repeat;
	display: block;
	width: 46px;
	height: 8px;
	top:8px;
	left: 5px;
	position: absolute;
}

a.branding span:after{
	content:'';
	background: url('../assets/images/branding_star.png') right center no-repeat;
	display: block;
	width: 46px;
	height: 8px;
	top:8px;
	right:12px;
	position: absolute;
}



.nav-tabs {
	-webkit-box-pack: center;
	border-bottom: 1px solid #dddddd;
	margin: 50px auto 0 auto;

}

.nav-tabs .nav-item {
	margin: 0;
	margin-bottom: 1px;
	width: 100%;
}

.nav-tabs .nav-item .nav-link {
	border: none !important;
	font-size: 20px;
	color: #0033A0;
	font-weight: bold;
	padding: 0 26.75px 15px;
	position: relative;
	text-align: center;
}

.nav-tabs .nav-item .nav-link.active {
	color: #E3171D;
	border: none;
}

.nav-tabs .nav-item .nav-link:hover:before,  .nav-tabs .nav-item .nav-link:hover:after,  .nav-tabs .nav-item .nav-link:active:before,  .nav-tabs .nav-item .nav-link:active:after,  .nav-tabs .nav-item .nav-link:focus:before,  .nav-tabs .nav-item .nav-link:focus:after,  .nav-tabs .nav-item .nav-link.active:before,  .nav-tabs .nav-item .nav-link.active:after {
	opacity: 1;
}

.accordion-item:first-of-type .accordion-button {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.accordion-item{border:none; border-bottom: 1px solid #ddd; border-radius: 0!important;}

.accordion-button{ font-weight: 500; font-size: 18px; border-radius:0; font-family: Arimo}
.accordion-button:focus {
	box-shadow: none;
	border:none;
}



.accordion-button:not(.collapsed) {
	color: #E3171D;
	background-color:#FFF;
	border-top: 1px solid #E3171D;
}

.accordion-button:not(.collapsed)::after {
	background-image: url("../assets/images/faq-minus.png");
}

.accordion-button::after {
	background-image: url("../assets/images/faq-plus.png");
	width: 17px;
	height: 17px;
	background-size: cover;
}

.card-date{ width:80px; font-size: 40px;  text-align: center; position: absolute; top:20px; left: 20px; background: #E3171D; color: #FFF}
.card-date span{ display: block; font-size: 12px; background: #FFF; color:#222; font-weight: 500}
.card-cat{ 	position: absolute; right: 10px; background: #E3171D; color: #FFF;	top: 10px;	display: inline-block;	padding: 5px 10px; font-size: 12px;	text-transform: uppercase;	font-weight: 700;}

.card-meta{display: flex; align-items: center}
.card-meta span{ font-size: 14px; margin-right:8px }
.card-meta i.fa{color:#E3171D; font-size: 12px; margin-right: 5px}
.card-meta span.material-symbols-outlined {color: #E3171D;}


.card-read-more{display: block; width: 100%; padding: 10px 20px; text-decoration: none; background: #F3F4F8; color:#222}

.can-read-more-sm{ display: block; width: 100%; background: #F3F4F8; color:#222; padding: 10px 20px !important; font-size: 12px; text-decoration: none; line-height: 1; font-weight: 700; display: flex; justify-content: space-between}
.card-read-more:hover{ color:#E3171D }

.card.user_widget{
	border-radius: 7px;
	border: 1px solid #F7F7F7;
	background-color: #fff;
	box-shadow: rgba(168, 180, 208, 0.1) 0 4px 25px 0;
	position: relative;
	margin-block-end: .5rem;
	width: 100%;
}

.form-control:focus{box-shadow: none; outline: none; border-color: #DDD}

#search .form-control{padding:20px 0px 20px 20px; font-size: 14px; border-right: none; border-radius: 3px; border-color: #DDD}
#search  button, #search  button:hover{ background: none; border-left: none; border-radius: 3px; border-color: #DDD; padding-right: 20px; color:#0033A0; z-index: 1 }
#sidebar h4{position: relative; font-size: 20px; font-weight: 700; margin: 25px 0; line-height: 40px}
#sidebar h4:before {content: ''; width: 40px; height: 2px; background-color: #0033A0; position: absolute; bottom: 0; left: 0;}

#sidebar-categories ul{ margin: 0; padding: 0}
#sidebar-categories li{ display:block; margin: 0; padding: 0; padding:5px 0}
#sidebar-categories li a{ color: #222; text-decoration: none; display: flex; justify-content: space-between}

#sidebar-categories li a.active{background:#0033A0; color: #FFF; padding:10px}
.page-template-page-account #sidebar-categories li a.active, .page-template-page-coordinators #sidebar-categories li a.active{background:none; color: #0033A0; padding:0px; font-weight: 800}


.sidebar_posts{ border-bottom: 1px solid #DDD; padding-bottom: 10px; margin-bottom: 20px}
.sidebar_posts h5 a{ color:#222; text-decoration: none; font-size: 18px; margin-bottom: 0}

.sidebar_ads{ margin-top: 50px;  min-height: 380px; background-size: cover }

.page-item .page-link{border:none; background:#E3171D; color: #FFF; padding: 10px 20px; z-index: 0}
.page-item .page-link.active{ background: #0033A0}
.page-item:first-child .page-link, .page-item:last-child .page-link {
	border-radius: 0;
}

#message-sidebar ul{ margin-left:0; margin-right: 0; padding: 0}
#message-sidebar li{display:flex; justify-content: space-between; padding: 8px ; font-size: 14px; border-radius: 5px}
#message-sidebar li.active{ background: #E0F0FF;}
#message-sidebar li a{ text-decoration: none; color:#222}
#message-sidebar li a i{ color:#D0D5DD; padding-right: 5px}
#message-sidebar li span{ background:#DAE2FC; color:#1571E5}
#messages-list div a{ color: #222; text-decoration: none; margin: 5px }
#messages-list div a dfn{ display: block; font-size: 12px}
#messages-list div a span{ font-weight: 700}
#messages-list div a span.read{font-weight: normal}
#messages-list div a cite{ display: block; font-size: 14px; font-style: normal}

#messages-list div date{ margin-left: auto; font-size: 13px; color: #BFBFBF; display: block}

#messages-list div ul.message-actions{ position: absolute; top:0; right:0; display: none}
#messages-list div ul.message-actions li{ display: inline-block}
#messages-list td:hover ul{ display: block}
/*
#messages-list td:hover date{ display: none}
 */

#messages-actions{ border:1px solid #F5F5F5;  justify-content: space-between; padding: 25px 10px}

#messages-actions .dropdown a.toggle{ display: block; width: 10px; text-align: center; margin: 1px 0 0 8px}
#messages-actions #paginate_messages{display: flex; align-items: center;}
#messages-actions #paginate_messages a,
#messages-actions #paginate_messages span{ color: #222; font-size: 14px; margin: 0; line-height: 1; margin: 0 0 0 8px}

#messages-actions button{ border: 1px solid #ddd; margin-right: 5px; width: 50px; color: #A2A2A2}

.message_checkbox{ width: 10px; padding-right: 0; margin-right: 0}
.message_checkbox input{ margin: 8px 0 0 5px  }
#message-content{ padding: 30px 20px 10px 20px;  border-top: 1px solid #ddd;}
.message-reply button{ font-size: 14px;	font-weight: 600;	padding: 8px 25px;}

#message-reply-list{ margin: 0; padding: 0; margin-left: 5px}
#message-reply-list li{ display: inline-block; background:#F6F7F7; border: 1px solid #DEE2E6; font-size: 14px; padding:0px 5px; border-radius: 5px}
#message-reply-list li a{ color: #A29999; text-decoration: none; font-size: 12px; font-weight: 700; border-right:1px solid #DEE2E6; display: inline-block; padding: 0px 5px 2px 0px; text-align: center}

.back-to-home-btn{
	position: fixed;
	right: 0;
	top: auto;
	bottom:20px;
	line-height: 1;
	font-size: 30px;
	font-weight: 600;
	padding: 20px 20px;
	z-index: 4000;
	border-radius: 0;
	background: #FFF;
}

.ui-datepicker .ui-datepicker-title select {
	font-size: 0.80em;
	margin: 1px 2px;
	padding: 2px;
	border-color: #ddd;
}
.coordinator-widget{ width: 100%; max-width: 200px; margin-right: auto}

.article p{ line-height: 26px; margin-bottom: 1.8rem}
.article h1, .article h2, .article h3, .article h4, .article h5, .article h6{
	margin-bottom: 1.8rem; padding: 0; line-height:1.5}

h3#reply-title{ font-size: 1.5rem; font-family: Arimo; margin-bottom: 3rem !important; position: relative; line-height: 1.6; display: block; font-weight: 700}
.article h2.post-title{ margin-bottom:10px; position: relative; line-height: 1.6}
.article h2.post-title:before,  h4.section-header:before, h3#reply-title:before{
	content: '';
	width: 80px;
	height: 2px;
	background-color: #0033A0;
	position: absolute;
	bottom: 0;
	left: 0;
}

#legend i{
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 5px;
	background-color: #0033A0;
}
#legend span{ display: block; padding-left: 15px}

h4.section-header{ position: relative; font-weight: 700; line-height: 2}
#comments, #comments_form{ border-top: 1px solid #DDD; padding-top: 30px; margin-top: 60px; margin-bottom: 50px}
#comments ol, #comments ul{
	list-style: none;
	margin-bottom: 0;
	padding-bottom: 0;
}
#comments ol{
	margin: 0;
	padding: 0;
}
#comments footer{ background: none}
#comments .comment-author.vcard{ display: flex}
#comments .comment-author a, #comments .comment-author span{color: #222; text-decoration: none; font-size: 1rem; font-weight: 600}
#comments .comment-author img{ width: 50px; height: 50px; object-fit: cover; margin-right: 15px }
#comments .comment-author .edit-link{ display: none}
#comments .comment-author time{ font-size: 12px; font-weight: 500; color:#c7c7ca; padding-top: 3px; padding-left: 5px }
#comments .comment-content{margin-top: -22px;
	margin-left: 65px;
	font-size: 16px;
	font-weight: 500;}

#comments article.comment{ position: relative}
#comments article.comment .reply{ position: absolute; top:0; right: 5px;}
#comments #respond{padding: 20px; background: #F2F2F2;	margin-bottom: 25px;}
#comments #respond h3#reply-title{ font-size: 1.1rem; margin-bottom: 20px !important;}
#comments #respond small{ float: right}

.comment{
	border-bottom: 1px dashed #f1f1f1;
	margin-bottom: 25px !important;
	padding-bottom: 0px;
}
.comment:last-child{ border:none}
.comment h6{ font-weight: 700}
.comment h6 .text-muted{font-size: 13px; color: #c7c7ca !important; font-weight: normal !important;}
.comment a.btn, #respond small a{font-size: 10px;
	color: #222;
	text-decoration: none;
	background: #fff;
	padding: 5px 8px;
	font-weight: 500;
	border-radius: 8px;
	border: 1px #ddd solid;
	display: inline-block;
	text-transform: uppercase;
	line-height: 1;}
#comments_form textarea, #respond textarea{ height: 150px; border-radius: 0; border:1px solid #DDD}
#comments_form label{color: var(--bs-secondary-color)!important; font-size: 15px; font-weight: 500}
#comments_form label span, .login-content label span, label span, label em{ color: #E3171D}

/* .page-template-login{ background: url('../assets/images/login.jpg') top center no-repeat; background-size: cover; overflow: hidden} */
.page-template-login{ background:#0033A0 url('../assets/images/bg-footer.jpg') left bottom repeat-x;}
.page-template-login h5{position: relative; line-height: 1.5; margin-bottom: 20px}
.page-template-login h5:before{content: ''; width: 40px; height: 2px; background-color: #0033A0; position: absolute; bottom: -5px; left: 0;}

#signup-form .form-control, #checking-account-form .form-control{ border-radius: 0; font-size: 14px; padding: .557rem .75rem}

label.error{color: #E3171D; font-size: 12px !important; font-weight: 400}
#gender-error {position: absolute;left: 0;top: 20px;}
#user_race-error{position: absolute; bottom: -12px; left: 0px}

.form-control.error{border-color: #E3171D;}

/* MAIN CSS */
.thankyou{ max-width: 600px; text-align: center}
.thankyou i.fa-check{ font-size: 60px}
.thankyou h5{ font-size: 50px; font-weight: 700}
.thankyou label{ font-weight: 800}
.price{position: absolute; top: 0; right: 20px;	font-size: 30px; opacity: 0.8;}


.invite-instructions{ background: #D8FFED;
	padding: 20px;
	color: #005500;
	margin: 15px auto;
	border: 1px solid #83FFC6;}

.text-invite {
	background: #E8F7FF;
	padding: 20px;
	color: #004D74;
}

.text-invite .row{
	border-bottom: 1px dashed #AAE3FC;
	margin-bottom: 15px;
	padding-bottom: 15px;
}




.invite-instructions p, .text-invite p{ margin-bottom: 0px}

.group_breadcrumb{}
.mt--20{ margin-top: -20px}
.group_breadcrumb li{ font-size: 14px}
.group_breadcrumb li a{ text-decoration: none}
#invite_to_group{position: relative; min-width: 320px}
#invite_to_group i{ position: absolute;right: 15px; top: 10px; color: #909090;}


#live-banner a{ color:#222; text-decoration: none}
#live-banner .dropdown-toggle::after {
	vertical-align: 0.1em;
}
#live-banner .dropdown-menu.show{ margin-top: 20px !important;}
header{position:relative; background-position: center center; background-repeat: no-repeat}

header .container {
	position: relative;
	z-index: 2;
}

header h1{ font-size:30px}

.home header {
	background-color: white;
	height: 100%;
	min-height: 25rem;
	width: 100%;
}

.home header video {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	object-fit: fill;
}



header .header-content{ padding-bottom: 40px; padding-top: 20px }
header .header-post-meta{ font-weight: 300 !important; opacity: 0.7 }
.home header .header-content{ margin-top: 50px}
/*
.home header .header-content h1{ max-width: 800px}
 */
.home header .header-content h4{ margin-left: auto; margin-right: auto; max-width: 900px; text-align: center; font-size: 16px }

.search-form{ max-width: 650px; margin-top: 30px; z-index: 0}
.search-form input.form-control{font-size: 14px; padding: 20px 24px;border-radius: 0px;}
.search-form .btn{ border-radius: 0; padding-left: 26px; padding-right: 26px; z-index: 0}

.about-cards{padding-bottom: 30px; margin-bottom: 40px}
.about-card{ padding: 30px;}
.about-card i{ font-size: 80px}

.fileinput-preview{ height: 150px; width: 150px; overflow: hidden; line-height: 150px !important; background: url('../assets/images/no-avatar.png') center center no-repeat; background-size: 150px 150px; cursor: pointer }
.fileinput-preview img{max-width: 100%; width: 150px;height: 150px; object-fit: cover; cursor: pointer}
.fileinput-new a.fileinput-exists{ display: none}
.fileinput-exists a.fileinput-exists{ display:inline-block}


	/*home page*/
.hands-bg{background-position:center center; background-size: cover; border-right: 8px solid #FFF; border-left: 8px solid #FFF; display: none}
.graphic_divider{color: #FFF; text-align: center; border-top: 20px solid #407EC9; padding-left: 20px !important; padding-right: 20px !important;}

.mission{background: #D3E3FA; margin-bottom:50px; padding: 50px 10px}
.mission h3{ font-size: 20px}
.mission i{font-size: 50px}
.click-redirect img{ height: 250px; object-fit: cover}
img.post_thumbnail_sm{ width: 80px; height: 80px; object-fit: cover}
img.post_thumbnail_lg{ width: 100%; max-height: 450px; object-fit: cover}
.divider-blue{ width: 100%; height: 2px; background-color: #407EC9}

#content .post-title a{ text-decoration: none; color: #222}


footer{background: #0033A0; color: #FFF}
footer a.footer-brand{color: #FFF; text-decoration: none; margin-top: 0px}

footer .footer-lead{ margin-top: 50px; padding-bottom: 50px; border-bottom: 1px solid #274890}
footer .footer-lead .socials{ justify-content: center}
footer .footer-lead .socials a{ color: #FFF; display: inline-block; text-decoration: none; font-size: 18px; width: 50px; height: 50px; background:#03297E; text-align: center; line-height: 50px; border-radius: 100%; margin: 10px 0 0 8px}
footer .footer-lead .socials a:hover{ background:#E3171D }

footer .footer-body{ background: url("../assets/images/bg-footer.jpg") bottom center no-repeat; padding-top:0; padding-bottom: 70px}
footer .footer-body h5, footer .footer-body h2{ margin-top: 70px}
footer .footer-body ul{ margin: 0; padding: 0; margin-top: 25px}
footer .footer-body ul li{ display: block; padding: 5px 0}
footer .footer-body ul li a, footer .footer-body label{ text-decoration: none; color: #99ADD9; font-size: 16px; font-weight: 400}
footer .footer-body ul li a:hover{ text-decoration: underline; color:#E3171DFF}
footer .footer-body input, footer .footer-body button{ border-radius: 0 !important;}
footer .footer-body .input-group-lg>.form-control{ padding: 1.02rem 1.01rem; font-size: 16px}
footer .footer-body .input-group-lg>.btn{ font-size: 16px; font-weight: bold; padding-left: 1.5rem; padding-right: 1.5rem; z-index: 0}
footer .footer-end{background: #407EC9;}
footer .footer-end p{ margin: 0 auto; font-weight: 400; padding:30px 20px; font-size: 12px; color:#B7CBE5; line-height: 1}

@keyframes slideIn {
	0% {
		transform: translateY(1rem);
		opacity: 0;
		-webkit-transform: transform;
		-webkit-opacity: 0;
	}

	100% {
		transform: translateY(0rem);
		opacity: 1;
		-webkit-transform: translateY(0);
		-webkit-opacity: 1;
	}

	0% {
		transform: translateY(1rem);
		opacity: 0;
		-webkit-transform: translateY(1rem);
		-webkit-opacity: 0;
	}
}

/* RESPONSIVE */