@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap');
@import url('../dist/bootstrap/css/bootstrap.min.css');
@import url('../dist/font-awesome/css/font-awesome.min.css');
@import url('../dist/owlcarousel/css/owl.theme.default.min.css');
@import url('../dist/owlcarousel/css/owl.carousel.min.css');
body { color: #000000; font-family: 'Nunito Sans', sans-serif, Arial, Helvetica; font-weight: 400; overflow-x: hidden; }
a { color: #008CFF; }
a, a:hover { text-decoration: none; }
a:focus { outline: none; }
*:focus { outline: none; }
button:active, button:focus, .btn:active, .btn:focus { box-shadow: none !important; outline: none !important; }
.img-responsive, .navbar-brand > img { display: inline-block; }
img { display: inline-block; height: auto; max-width: 100%; }
h1, h2, h3, h4, h5, h6 { color: #000000; font-family: 'Nunito Sans', sans-serif; text-transform: capitalize; }
h1 { font-size: 54px; }
h2 { background: url("../images/hed_bg.svg") no-repeat left top; font-size: 32px; font-weight: 700; margin-bottom: 5%; padding: 10px 30px; }
h3 { font-size: 39px; }
p, li { color: #474747; font: 400 16px/1.5 'Nunito Sans', sans-serif; overflow-wrap: break-word; word-wrap: break-word; }
.clearfix { clear: both; margin: 0px; padding: 0px; }
.center { text-align: center !important; }

@font-face { font-family: 'Kokonor'; src: url('../fonts/Kokonor.woff2') format('woff2'), url('../fonts/Kokonor.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; }

.navbar {  background: rgb(65,64,66); background: linear-gradient(90deg, rgba(65,64,66,1) 0%, rgba(65,64,66,1) 65%, rgba(130,165,191,1) 65%, rgba(130,165,191,1) 100%); }
.navbar .navbar-nav .nav-link { color: #ffffff; font-size: 16px; font-weight: 700; }
.navbar .btn-light { background-color: #ffffff; border-color: #ffffff; border-radius: 0px 45px 0px 45px; color: #82A5BF; font: 700 16px 'Nunito Sans', sans-serif; padding: 1rem .5rem; text-transform: uppercase; width: 195px; }
.navbar .navbar-toggler  { background-color: #FFFFFF; border-color: #FFFFFF; border-radius: 0px 45px 0px 45px; color: #82A5BF; font: 700 13px 'Nunito Sans', sans-serif; padding: .625rem .5rem; text-transform: uppercase; width: 100px; }

.offcanvas { background: rgb(65,64,66); background: linear-gradient(0deg, rgba(65,64,66,1) 0%, rgba(65,64,66,1) 50%, rgba(130,165,191,1) 50%, rgba(130,165,191,1) 100%); }
.offcanvas .btn-close { background: url("../images/close.svg") no-repeat center / 20px; opacity: 1; }
.offcanvas-end { border: none; }
.offcanvas-body { background-image: url("../images/ban_bg.png"); background-repeat: no-repeat; background-position: 145px 115%; background-size: contain; padding: 1rem 0px; }
.offcanvas .menu { background-color: #82A5BF; border-radius: 0px 0px 0px 100px; padding: 15% 1rem 20%; text-align: center; }
.offcanvas ul { list-style: none; margin: 0px; padding: 0px; }
.offcanvas ul li { color: #ffffff; font-size: 25px; font-weight: 700; margin-bottom: 25px; text-transform: capitalize; }
.offcanvas ul li a { color: #ffffff; }
.offcanvas .social { margin-bottom: 35px; width: 100%; }
.offcanvas .social h4 { color: #ffffff; font-size: 20px; font-weight: 700; padding: 5% 0px; text-transform: capitalize; }
.offcanvas .social a { margin: 0px 10px; }
.offcanvas p { color: #ffffff; font-size: 12px; text-align: center;}

.banner { clear: both; margin-top: 105px;  position: relative; width: 100%; }
.banner .col:first-child { background: url("../images/ban_bg.png") no-repeat 120% 130% / 80% #82A5BF; border-radius: 0px 0px 200px 0px; height: 785px; padding-left: 10%; }
.banner article { margin-top: 25%; max-width: 428px; }
.banner h1 { color: #ffffff; font-weight: 700; }
.banner h3 { color: #ffffff; font-family: 'Kokonor'; font-weight: normal; }
.banner h3 strong { font-family: 'Nunito Sans', sans-serif; font-weight: 700; }
.banner hr { background-color: #fff; height: 4px; opacity: 1; width: 70px; }
.banner p { color: #ffffff; margin-bottom: 15%; max-width: 80%; }
.banner .hero { border-radius: 200px 0px 0px 0px; margin: 0px 0px 10% -5%; padding: 0px 0px; position: absolute; right: 0; z-index: 1; }
.banner .hero img { border-radius: 200px 0px 0px 0px; height: 700px; width: 100%; }

.btn-primary { background-color: #414042; border-color: #414042; border-radius: 0px 45px 0px 45px; font: 700 16px 'Nunito Sans', sans-serif; padding: 1rem .5rem; text-transform: uppercase; width: 195px; }

.products { clear: both; position: relative; margin: 5% 0px; width: 100%; }
.products figure { margin-bottom: 1.5rem; }
.products .more { background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%); bottom: 0px; display: grid; align-content: center; justify-items: center; height: 580px; position: absolute; left: 0px; text-align: center; z-index: 1; }

.our { clear: both; margin-bottom: 20px; width: 100%; }
.our .col:last-child { background-color: #F9F9F9; margin-top: 3%; margin-left: -10%; padding: 5% 6% 5% 15%; z-index: -1; }
.our .figure { position: relative; }
.our h4 { color: #3C8EFD; font-size: 20px; font-weight: 700; margin-bottom: 25px; text-transform: capitalize; }
.our h4 span { color: #000000; font-size: 16px; font-weight: 600; }
.our .owl-theme .owl-nav { margin: -6% 7% 0px 0px; position: absolute; top: 20px; right: 0; width: 156px; }
.our .owl-carousel .owl-nav button.owl-next, .our .owl-carousel .owl-nav button.owl-prev { border: 2px solid #2184F6; border-radius: 100%; height: 62px; text-indent: -9999px; width: 62px; }
.our .owl-carousel .owl-nav button.owl-next.disabled, .our .owl-carousel .owl-nav button.owl-prev.disabled { border: none; }
.our .owl-carousel .owl-nav button.owl-prev { background: url(../images/prev.svg) no-repeat center / 14px; }
.our .owl-carousel .owl-nav button.owl-next { background: url(../images/next.svg) no-repeat center / 14px; float: right; }

.products-partner { background: url("../images/prd_ptr_bg.jpg") no-repeat top center / 100% 100%; clear: both;; padding: 5% 0px; position: relative; overflow-x: hidden; width: 100%; }
.products-partner .tex { position: absolute; left: 0px; margin: -15% 0px 0px -15%; top: 0px; width: 40%; }
.products-partner .tex_btm { position: absolute; bottom: 0px; right: 0px; margin: 0px -15% -12% 0px; transform: rotate(-180deg); width: 40%; }
.products-partner .col-12 h2 { display: none; }
.products-partner .col:first-of-type { padding-left: 6%; }
.products-partner h4 { color: #3C8EFD; font-size: 20px; font-weight: 600; margin-bottom: 25px; }
.products-partner p { max-width: 520px; }
.products-partner figure { background: url("../images/fig_bg.png") no-repeat top right; padding: 10% 10% 0px 0px; position: relative; }
.products-partner .owl-carousel .owl-stage-outer { padding-bottom: 12%;}
.products-partner .owl-theme .owl-nav { margin: 0px 0px -5% 0px; position: absolute; bottom: 0px; left: 0; width: 156px; }
.products-partner .owl-carousel .owl-nav button.owl-next, .products-partner .owl-carousel .owl-nav button.owl-prev { border: 2px solid #2184F6; border-radius: 100%; height: 62px; text-indent: -9999px; width: 62px; }
.products-partner .owl-carousel .owl-nav button.owl-next.disabled, .products-partner .owl-carousel .owl-nav button.owl-prev.disabled { border: none; }
.products-partner .owl-carousel .owl-nav button.owl-prev { background: url(../images/prev.svg) no-repeat center / 14px; }
.products-partner .owl-carousel .owl-nav button.owl-next { background: url(../images/next.svg) no-repeat center / 14px; float: right; }
.hologram { position: absolute; bottom: 0px; margin-bottom: -15%; right: 8%; z-index: 1; }

.member { clear: both;; margin-bottom: 5%; width: 100%; }
.member h3 { font-size: 32px; font-weight: 700; text-transform: capitalize; margin-top: 10%; }
.member h4 { color: #3C8EFD; font-size: 20px; font-weight: 600; margin-bottom: 8%; }
.member p { margin-bottom: 5%; }
.member .soon { color: #82A5BF; font-size: 20px; font-weight: 400; }

footer { background: rgb(65,64,66); background: linear-gradient(0deg, rgba(65,64,66,1) 0%, rgba(65,64,66,1) 50%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100%);  clear: both; padding: 0px 0px 0px; width: 100%; }
footer .col:first-child { position: relative; z-index: 1; }
footer .col:last-child { background: url("../images/ban_bg.png") no-repeat 300% 280% / 80% #82A5BF; border-radius: 0px 0px 0px 100px; margin-left: -15%; padding: 0px 12px 10% 23%; }
footer h1 { color: #ffffff; font-size: 52px; margin-top: 7%; text-transform: capitalize; }
footer h4 { color: #ffffff; font-size: 20px; font-weight: 700; margin-bottom: 15px; text-transform: capitalize; }
footer h5 { color: #ffffff; font-size: 20px; font-weight: 400; margin-bottom: 7%; }
footer p, footer p a { color: #ffffff; }
footer p a:hover { color: #3c8efd; }
footer .follow {  margin-top: 7%; }
footer .follow a { margin-right: 15px; }
footer .copy { color: #ffffff; font-size: 16px; }

footer .owl-theme .owl-nav { margin: 0px 0px -75px 0px; position: absolute; bottom: 0px; right: 0; width: 156px; }
footer .owl-carousel .owl-nav button.owl-next, footer .owl-carousel .owl-nav button.owl-prev { border: 2px solid #ffffff; border-radius: 100%; height: 62px; filter: brightness(0) invert(1); text-indent: -9999px; width: 62px; }
footer .owl-carousel .owl-nav button.owl-next.disabled, footer .owl-carousel .owl-nav button.owl-prev.disabled { border: none; }
footer .owl-carousel .owl-nav button.owl-prev { background: url(../images/prev.svg) no-repeat center / 14px; }
footer .owl-carousel .owl-nav button.owl-next { background: url(../images/next.svg) no-repeat center / 14px; float: right; }
footer .owl-theme .owl-nav [class*="owl-"]:hover { background-color: inherit; }


/*-------------------
    Media Query
---------------------------*/

@media only screen and (max-width: 767px) {
	h1 { font-size: 41px; }
	h2 { background-size: contain; font-size: 24px; margin: 0px auto 1rem; padding: 10px 15px; max-width: 200px; }
	h3 { font-size: 36px; }
	p { font-size: 13px; }
	.col { flex-basis: auto;}
	.navbar { background: #414042; }
	.navbar .navbar-brand { filter: brightness(0) invert(1); max-width: 85px; }
	.banner .col:first-child { background-size: 100%; background-position: -110px center;  height: auto; padding: 0px 12px 418px; text-align: center; }
	.banner .hero { bottom: 0px; margin: 0px; padding-left: 40px; }
	.banner .hero img { height: auto; }
	.banner p { margin-bottom: 15px; max-width: 100%; }
	.btn-primary { font-size: 11px; padding: .825rem .5rem; width: 140px; }
	.products { height: 700px; overflow-y: hidden; }
	.products .col { max-width: 50%; }
	.products .more { height: 200px; }
	.our figure { padding: 0px 24px !important; }
	.our .col:last-child { background: none; margin: 0px; padding: 5% 8%; }
	.our .owl-theme .owl-nav { margin-top: 90%; width: 110px; }
	.our .owl-carousel .owl-nav button.owl-next, .our .owl-carousel .owl-nav button.owl-prev { height: 45px; filter: brightness(0) invert(1); width: 45px; }
	.products-partner h2 { max-width: 222px; }
	.products-partner .col-12 h2 { display: block; }
	.products-partner .col h2 { display: none; }
	.products-partner figure { background: inherit; padding: 0px 12px; }
	.products-partner .tex, .products-partner .tex_btm { width: 70%; }
	.products-partner .owl-theme .owl-nav { bottom: 80px; left: 20px; width: 110px; }
	.products-partner .owl-carousel .owl-nav button.owl-next, .products-partner .owl-carousel .owl-nav button.owl-prev { height: 45px; filter: brightness(0) invert(1); width: 45px; }
	.hologram { width: 110px; }
	footer h1, footer h5 { display: none; }
	footer .col:last-child { background-position: 150px 117%; background-size: 100%; margin: 0px 0px 25px; padding: 50px 12px 100px; text-align: center; }
	footer .owl-theme .owl-nav { bottom: 80px; right: 10px; width: 110px; }
	footer .owl-carousel .owl-nav button.owl-next, footer .owl-carousel .owl-nav button.owl-prev { height: 45px; width: 45px; }
	footer .copy { font-size: 12px; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	h1 { font-size: 41px; }
	h2 { background-size: contain; font-size: 24px; padding: 10px 15px; }
	h3 { font-size: 36px; }
	p { font-size: 13px; }
	.navbar {  background: rgb(65,64,66); background: linear-gradient(90deg, rgba(65,64,66,1) 0%, rgba(65,64,66,1) 65%, rgba(130,165,191,1) 65%, rgba(130,165,191,1) 100%); }
	.navbar .navbar-brand { filter: brightness(0) invert(1); max-width: 100px; }
	.offcanvas .menu { padding: 30% 1rem 35%}
	.banner { margin-top: 80px; }
	.banner .col:first-child { padding-left: 12px; }
	.products .more { height: 240px; }
	.products-partner figure { background-size: contain; }
	.our .owl-theme .owl-nav { width: 110px; }
	.our .owl-carousel .owl-nav button.owl-next, .our .owl-carousel .owl-nav button.owl-prev { height: 45px; width: 45px; }
	.products-partner .owl-theme .owl-nav { bottom: 0px; margin-bottom: -10px; width: 110px; }
	.products-partner .owl-carousel .owl-nav button.owl-next, .products-partner .owl-carousel .owl-nav button.owl-prev { height: 45px;  width: 45px; }
	.hologram { width: 110px; }
	.member h3 { font-size: 30px; }
	footer h1 { font-size: 40px; }
	footer h5 { font-size: 15px; }
	footer .owl-theme .owl-nav { bottom: 0px; margin-bottom: -50px; width: 110px; }
	footer .owl-carousel .owl-nav button.owl-next, footer .owl-carousel .owl-nav button.owl-prev { height: 45px;  width: 45px; }
}

@media only screen and (min-width: 992px) and (max-width: 1140px) {
	.banner .col:first-child { padding-left: 8%; }
	.products-partner figure { background-size: contain; }
	.products .more { height: 380px; }
	.hologram { width: 110px; }
	footer h1 { font-size: 40px; }
	footer h5 { margin-bottom: 25px; }
	footer .follow { margin-top: 3%; }
}

@media only screen and (min-width: 1200px) and (max-width: 1366px) {
	.products .more { height: 480px; }
}