@font-face {
	font-family: 'kghappysolid';
	src: url('../fonts/kghappysolid.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'kghappy';
	src: url('../fonts/kghappy.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'tangleup';
	src: url('../fonts/tangledup.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
}

:root {
	--bs-body-font-family: "kghappysolid", sans-serif;
	--bs-body-color: #000;
	--bs-primary-rgb: 33, 34, 99;
	--bs-secondary-rgb: 250, 21, 137;
	--bs-info-rgb: 145, 189, 221;
	--bs-danger-rgb: 250, 21, 137;
	--bs-border-color: #d0d0d0;
	--bs-light-rgb: 245, 247, 247;
	--bs-dark-rgb: 8, 9, 44;
	--c1: #212263;
	--c2: #fa1589;
	--c3: #1fa9e0;
	--c4: #91bddd;
}
::placeholder {
	color: #c0c0c0 !important;
	opacity: 1;
}
[data-bs-theme="dark"] {
	color-scheme: dark;
	--bs-body-color: #fff;
}
b, strong {
	font-weight: bold;
}
.tangleup {
	font-family: 'tangleup';
}
.kghappy {
	font-family: 'kghappy';
}
@media (min-width: 1200px) {
	.py-xl-5 {
		padding-top: 5rem !important;
		padding-bottom: 5rem !important;
	}
}
body {
	top: 0 !important;
}


/* ------ header ------ */
#header {
	left: 0;
	position: fixed;
	top: 0;
	transition:all 0.3s ease;
	width: 100dvw;
	z-index: 100;
}
#header.scroll {
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	background-color: rgba(25, 25, 80, .45);
}
#logo {
	position: absolute;
	transition:all 0.3s ease;
	top: 14px;
	width: 110px;
}
#header.scroll #logo {
	width: 92px;
}
@media (max-width:992px) {
	#logo { position: relative; top: initial; width: 92px !important }
	#header { position: absolute; width: 100%; }
}
@media (max-width:768px) {
	#logo { width: 74px !important }
}


/* ------ banner ------ */
#section1 {
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	height: 100dvh;
}
.bannerTxt {
	left: 50%;
	padding: 0 20px;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	z-index: 10;
}
@media (max-width:992px) {
	#section1 { background-attachment: initial !important }
}


/* ------ navBar ------ */
.offcanvas {
	--bs-offcanvas-width: 240px;
}
#navBarMain .nav-link {
	color: #fff;
	font-family: 'tangleup';
	font-size: 1.6rem;
	padding: var(--bs-nav-link-padding-y) 1rem;
	position: relative;
}
#navBarMain .navbar-nav {
	--bs-nav-link-color: var(--bs-body-color);
}
#navBarMain .navbar-nav .nav-link:hover {
	color: #9ee4ff;
}
#navBarMain .navbar-nav .nav-link.active,
#navBarMain .navbar-nav .nav-link.show {
	color: #fff;
	opacity: 1;
}
#navBarMain .navbar-nav .nav-link.active::after,
#navBarMain .navbar-nav .nav-link.show::after {
	border-bottom: 2px solid #fff;
	content: "";
	height: 11px;
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
	bottom: -4px;
	width: 20px;
}
.navbar-toggler {
	border: 1px solid rgba(255,255,255,.8);
}
[data-bs-theme="dark"] .navbar-toggler-icon {
	--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media (max-width:992px) {
	#navBarMain .navbar-nav .nav-link.active::after,
	#navBarMain .navbar-nav .nav-link.show::after {
		left: 0;
		transform: initial;
	}
	#mainNav {
		-webkit-backdrop-filter: blur(8px);
		backdrop-filter: blur(8px);
		background-color: rgba(25, 25, 80, .7);
		border-radius: 1rem;
		padding: .8rem 1.2rem;
		position: absolute;
		top: 92px;
		width: 100%;
	}
	#navBarMain .navbar-nav .nav-link.active::after,
	#navBarMain .navbar-nav .nav-link.show::after {
		bottom: 8px;
	}
}


/* ------ btn ------ */
.btn {
	font-weight: 500;
}
.btn-primary {
	--bs-btn-bg: var(--c1);
	--bs-btn-border-color: var(--c1);
	--bs-btn-hover-bg: #2c2d7d;
	--bs-btn-hover-border-color: #2c2d7d;
	--bs-btn-active-bg: #2c2d7d;
	--bs-btn-active-border-color: #2c2d7d;
}
.btn-info {
	--bs-btn-bg: #91bddd;
	--bs-btn-border-color: #91bddd;
	--bs-btn-hover-bg: #9cc9e9;
	--bs-btn-hover-border-color: #9cc9e9;
	--bs-btn-active-bg: #9cc9e9;
	--bs-btn-active-border-color: #9cc9e9;
}


/* ------ border ------ */
.border-light {
	border-color: #e2e8e8 !important;
}


/* ------ misc ------ */
#wrapSection {
	position: relative;
}
#section1,
#section2,
#section3,
#section4 {
	display: flow-root;
	position: relative;
}
.fs-5b {
	font-size: 1.2em;
}

.editText p:last-of-type {
	margin-bottom: 0;
}

.divisorNew {
	background-image: url(../img/divisorNew.png);
	background-position: center;
	background-repeat: no-repeat;
	bottom: -20px;
	height: 80px;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 10;
}
.divisorNew2 {
	background-image: url(../img/divisorNew2.png);
	background-position: center;
	background-repeat: no-repeat;
	bottom: -20px;
	height: 80px;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 10;
}

.embedContainer {
	height: 0;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	padding-bottom: 56.25%;
}
.embedContainer iframe,
.embedContainer object,
.embedContainer embed {
	height: 100%;
	left: 0;
	top: 0;
	position: absolute;
	width: 100%;
}

.bg-white-a {
	background-color: rgba(255,255,255,.9);
}

#novaq {
	width: 110px;
}

.socialIcon {
	background-color: #fff;
	border-radius: 50%;
	color: var(--c1);
	display: flex;
	height: 50px;
	text-decoration: none;
	width: 50px;
}
.socialIcon:hover {
	background-color: #c1e5ff;
	color: var(--c1);
}
.socialIcon i {
	color: var(--c1);
	font-size: 1.5rem;
	margin: auto;
}
.icon1 {
	width: 140px;
}
.icon2 {
	width: 80px;
}
.mt-5b {
	margin-top: 5rem;
}
.invalid-feedback {
	color: brown !important;
	font-size: .6em !important;
}
@media (max-width:992px) {
	#wrapSection { position: static }
	.mt-5b { margin-top: 2.5rem }
}
@media (max-width:470px) {
	.metSize { font-size: calc(1.5rem + 1.5vw) }
}


/* ------ btTop ------ */
.btTop {
	background-color: rgba(40, 40, 40, .4);
	border: 1px solid #fff;
	border-radius: 6px;
	bottom: 20px;
	color: #fff;
	display: none;
	font-size: 1rem;
	height: 36px;
	line-height: 35px;
	margin: 0;
	outline: none;
	padding: 0;
	position: fixed;
	right: 20px;
	text-align: center;
	transition:all 0.3s ease;
	width: 36px;
	z-index: 1040;
}
.btTop i {
	display: block;
}
.btTop:hover {
	background-color: rgba(100,100,100,.2);
	color: #91bddd;
}


/* ------ form ------ */
.form-control {
	border-color: rgba(255, 255, 255, .8);
	padding: .5rem .75rem;
}
.form-control:focus {
	border-color: var(--c1);
	box-shadow: 0 0 0 .25rem rgba(33,34,99,.15);
}


/* ------ section ------ */
#s2Bg,
#s3Bg,
#s4Bg {
	height: 100%;
	left: 0;
	overflow: clip;
	position: absolute;
	top: 0;
	width: 100%;
}
#s2Bg img,
#s3Bg img,
#s4Bg img {
	height: 100dvh;
	object-fit: cover;
	object-position: center;
	position: sticky;
	top: 0;
	width: 100%;
}


/* ------ boxes ------ */
.boxService {
	background-color: rgba(8, 9, 44, .4);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 0;
	width: 100%;
}
.boxService:hover {
	background-color: rgba(8, 9, 44, .5);
}
.boxService .sTitle {
	color: #fff;
}
.boxPillar {
	background-color: rgba(8, 9, 44, .5);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}


/* ----------- google -----------*/
iframe.skiptranslate {
	display: none !important;
}
#google_translate_element .goog-te-combo {
	background-color: #fff;
	border: 1px solid #c8c8c8;
	border-radius: 4px;
	font-size: 1rem;
	padding: .7rem 1rem;
	text-transform: capitalize;
	width: 100%;
}
.transBt {
	text-decoration: none;
}
.transBt:hover {
	text-decoration: underline;
}


/* ----------- video-thumbnail -----------*/
.video-thumbnail {
	border: 1px solid rgba(31, 169, 224, .6);
	border-radius: 1.4rem;
	cursor: pointer;
	opacity: .75;
	padding: 10px;
}
.video-thumbnail:hover { opacity: 1 }
.video-thumbnail.active {
	border: 1px solid #fff;
	cursor: default;
	opacity: 1;
}
.video-thumbnail img {
	aspect-ratio: 280 / 158;
}
@media (max-width:768px) {
	.video-thumbnail { padding: 7px }
}