@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600;1,700&family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url("https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900");

/* Fonts */
:root {
	--font-default: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	--font-primary: "Montserrat", sans-serif;
	--font-secondary: "Roboto", sans-serif;
}
/* Colors */
:root {
	--color-bg: #ffffff;
	--color-default: #2a2a2a;
	--color-primary: #005699;
	--color-primary-dark: #003566;
	--color-secondary: #ffcc00;
	--color-secondary-dark: #cc9900;
	--rgb-default: 42, 42, 42;
	--rgb-primary: 0, 86, 153;
	--rgb-primary-dark: 0, 53, 102;
	--rgb-shadow: 127, 137, 161;
}
/* Smooth scroll behavior */
:root {
	scroll-behavior: smooth;
}
/*--------------------- Animations ----------------------*/
@keyframes slideUp {
  from {transform: translateY(8px); opacity: 0;}
  to {transform: translateY(0); opacity: 1;}
}
/*--------------------- Animations ----------------------*/
/*--------------------- General -----------------------*/
html, body {
	height: 100%;
}
body {
	font-family: var(--font-default);
	color: var(--color-default);
	background: var(--color-bg);
	overflow-x: hidden
}
a {
	color: var(--color-primary-dark);
	text-decoration: none;
}
a:hover {
	color: var(--color-primary);
	text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-primary);
}
.cursor-pointer {cursor: pointer;}
.slim {width: 10px !important;}
/*--------------------- Scroll top button -----------------------*/
.scroll-top {
	position: fixed;
	visibility: hidden;
	opacity: 0;
	right: 15px;
	bottom: -15px;
	z-index: 99999;
	background: var(--color-primary);
	width: 44px;
	height: 44px;
	border-radius: 50px;
	transition: all 0.4s;
}
.scroll-top i {
	font-size: 24px;
	color: #fff;
	line-height: 0;
}
.scroll-top:hover {
	background: var(--color-primary-dark);
	color: #fff;
}
.scroll-top.active {
	visibility: visible;
	opacity: 1;
	bottom: 15px;
}
/*--------------------- Preloader -----------------------*/
#preloader {
	position: fixed;
	inset: 0;
	z-index: 999999;
	overflow: hidden;
	background: #fff;
	transition: all 0.6s ease-out;
}
#preloader:before {
	content: "";
	position: fixed;
	top: calc(50% - 30px);
	left: calc(50% - 30px);
	border: 6px solid #fff;
	border-color: var(--color-primary) transparent var(--color-primary) transparent;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	-webkit-animation: animate-preloader 1.5s linear infinite;
	animation: animate-preloader 1.5s linear infinite;
}
@-webkit-keyframes animate-preloader {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
@keyframes animate-preloader {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
/*---- Disable aos animation delay on mobile devices ----*/
@media screen and (max-width: 768px) {
	[data-aos-delay] {
		transition-delay: 0 !important;
	}
}
/*------------------------ Inputs -----------------------*/ 
input, select, textarea { border: 1px solid rgba(0,0,0,0.2);}
input:focus, select:focus, textarea:focus, .form-control:focus {box-shadow: none; border: 1px solid rgba(var(--rgb-primary),0.7); outline: 4px solid rgba(var(--rgb-primary),0.2);}
input[type="submit"], input[type="button"], .btn-default {border-radius: 50px; padding: 5px 20px; background: var(--color-primary); color: #ffffff; font-size: 18px; cursor: pointer; border: none;}
input[type="submit"]:hover, input[type="button"]:hover, .btn-default:hover {background: var(--color-primary); filter: brightness(85%); color: #ffffff;}
/*------------------------ Inputs -----------------------*/
/*--------------------- Single form ---------------------*/
.single-input-form {margin-top: 30px; background: #fff; padding: 6px 10px; position: relative; border-radius: 50px; box-shadow: 0px 2px 15px rgba(var(--rgb-shadow), .3); text-align: left;}
.single-input-form input[type=email], .single-input-form input[type=text], .single-input-form input[type=password] {border: 0; padding: 4px 8px; width: calc(100% - 100px);}
.single-input-form input[type=submit] {position: absolute; top: 0; right: -2px; bottom: 0; border: 0; box-shadow: 0px 2px 15px rgba(var(--rgb-shadow), .3);}
/*--------------------- Single form ---------------------*/
/*----------------------- Topbar ------------------------*/
.topbar {
	background: var(--color-secondary);
	height: 40px;
	font-size: 14px;
	transition: all 0.5s;
	color: rgba(0, 0, 0, 0.6);
	position: relative;
	z-index: 100;
}
.topbar a {
	color: rgba(0, 0, 0, 0.6);
}
.topbar a:hover {
	color: #000;
}
/*----------------------- Topbar ------------------------*/
/*----------------------- Header ------------------------*/
.header {
	background: rgba(var(--rgb-primary-dark), .8);
	height: 80px;
	transition: all 0.5s;
	position: relative;
	z-index: 997;
}
.header.sticked {
	padding-top: 0;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	height: 60px;
	background: #fff;
	box-shadow: 0px 2px 20px rgba(var(--rgb-shadow), .3);
}
.header .nav-item>.nav-link, .header .navbar-brand, .header .dropdown>.nav-link, .header .navbar-toggler {
	color: #fff;
}
.header.sticked .nav-item>.nav-link, .header.sticked .navbar-brand, .header.sticked .dropdown>.nav-link, .header.sticked .navbar-toggler, .navbar .active {
	color: var(--color-default);
}

.header .logo {
	background: url('/build/images/logo-white.png') 0 0 no-repeat;
	height: 70px;
	width: 70px;
	transition: 0.5s;
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
}
.header.sticked .logo {
	background: url('/build/images/logo.png') 0 0 no-repeat;
	height: 50px;
	width: 50px;
	transition: 0.5s;
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
}
@media (max-width: 768px) {
	.header .collapse .nav-link, .header .navbar-brand {color: #000;}
}
/*----------------------- Header ------------------------*/
/*----------------- Navbar & Dropdown -------------------*/
.dropdown-menu {
	background: #fff;
	border: none;
	box-shadow: 0px 2px 20px rgba(var(--rgb-shadow), .3);
	animation: slideUp 0.3s ease-in-out;
}
.dropdown:hover>.dropdown-menu {
	display: block;
	right: 0;
	left: auto;
}
.header .navbar-toggler {
	border: none;
	box-shadow: none;
	padding: 0 !important;
}

@media (max-width: 768px) {
	.header .navbar-collapse {
		background: #fff;
		border-radius: 5px;
		padding: 0 20px 20px 20px !important;
		box-shadow: 0px 2px 20px rgba(var(--rgb-shadow), .3);
		animation: slideUp 0.3s ease-in-out;
	}
	.loto-title {display: none;}
}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .navbar .active {background: rgba(var(--rgb-primary), .3);}
.dropdown img {border-radius: 50%; height: 21px; width: 21px; -o-object-fit: cover; object-fit: cover; margin: 5px 5px 10px 5px;}
/*----------------- Navbar & Dropdown -------------------*/
/*--------------------- Breadcrumbs ---------------------*/
.breadcrumbs {padding: 10px 0; background: rgba(255,255,255,.2); min-height: 40px;}
.breadcrumbs h2 {font-size: 24px; font-weight: 500; color: var(--color-default);}
.breadcrumbs a {color: var(--color-primary);}
.breadcrumbs a:hover {color: var(--color-secondary);}
.breadcrumbs ol {display: flex; flex-wrap: wrap; list-style: none; padding: 0 0 10px 0; margin: 0; font-size: 14px;}
.breadcrumbs ol li+li {padding-left: 10px; color: var(--color-default);}
.breadcrumbs ol li+li::before {display: inline-block; padding-right: 10px; color: var(--color-primary); content: "/";}
/*--------------------- Breadcrumbs ---------------------*/
/*---------------- Hero & Pages on top -------------------*/
.slider {
	padding: 0;
	position: relative;
	z-index: 0;
	margin: -120px 0 0 0;
	min-height: 250px;
}
/*--------------- Main Pictures Slider -------------------*/
.slider .slider-main .swiper-slide {
	--bs-aspect-ratio: 50% !important;
}
.slider-main-captions {
	background: rgba(0,0,0,.7);
	border-radius: 5px;
	padding: 40px 20px 10px 20px;
	color: #fff;
	min-width: 50%;
	max-width: 80%;
	display: inline-block;
	position: absolute;
	left: 9%;
	bottom: 20px;
}
.slider-main-captions h3 {
	background: var(--color-primary);
	padding: 10px 20px;
	font-size: calc(1rem + 0.5vw);
	font-weight: 500;
	display: inline-block;
	top: -20px;
	left: 30px;
	position: absolute;
}
.slider-main-captions h3:before {
	content: "";
	position: absolute;
	top: 0;
	right: 100%;
	display: inline-block;
	height: 0;
	width: 0;
	border: 20px solid transparent;
	border-right-color: rgba(0,0,0,.7);
	border-bottom: 0;
}
.slider-main-captions p {
	font-size: calc(0.7rem + 0.5vw);
	font-weight: 300;
}
.slider-main-captions .btn {
	border-radius: 5px;
	padding: 0 10px;
	color: #fff;
	border: 1px solid rgba(255,255,255,.7);
}
.slider-main-captions .btn:hover {
	background: var(--color-primary);
}

@media (max-width: 1000px){
	.slider {
		min-height: 210px;
	}
	.slider-main-captions {
		padding: 30px 10px 10px 10px;
		left: 10%;
		bottom: 100px;
	}
	.slider-main-captions h3 {
		font-size: 18px;
		font-weight: 500;
	}
}
@media (min-width: 500px) and (max-width: 800px){
	.slider {
		min-height: 180px;
	}
	.slider-main-captions {
		left: 5%;
		bottom: 70px;
	}
	.slider .slider-main .swiper-slide {
		--bs-aspect-ratio: 70% !important;
	}
}
@media (max-width: 500px){
	.slider {
		min-height: 150px;
	}
	.slider-main-captions {
		left: 5%;
		bottom: 30px;
	}
	.slider-main-captions h3 {
		font-size: calc(0.9rem + 0.4vw);
	}
	.slider .slider-main .swiper-slide {
		--bs-aspect-ratio: 100% !important;
	}
}
/*--------------- Main Pictures Slider -------------------*/
/*------------- Pages on main in the middle --------------*/
.services {
	padding: 60px 0;
}
.services .service-item {
	padding: 40px;
	background: #fff;
	height: 100%;
	border-radius: 10px;
}
.services .service-item .icon {
	width: 48px;
	height: 48px;
	position: relative;
	margin-bottom: 50px;
}
.services .service-item .icon i {
	color: var(--color-default);
	font-size: 56px;
	transition: ease-in-out 0.3s;
	z-index: 2;
	position: relative;
}
.services .service-item .icon:before {
	position: absolute;
	content: "";
	height: 100%;
	width: 100%;
	background: #eeeeee;
	border-radius: 50px;
	z-index: 1;
	top: 10px;
	right: -20px;
	transition: 0.3s;
}
.services .service-item h3 {
	color: var(--color-default);
	font-weight: 700;
	margin: 0 0 20px 0;
	padding-bottom: 8px;
	font-size: 22px;
	position: relative;
	display: inline-block;
	border-bottom: 4px solid #eeeeee;
	transition: 0.3s;
}
.services .service-item p {
	line-height: 24px;
	font-size: 14px;
	margin-bottom: 0;
	height: 5em;
	margin-bottom: 20px;
	/* display 4 lines only */
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	line-clamp: 4;
	-webkit-box-orient: vertical;
}
.services .service-item .readmore {
	display: inline-block;
	color: var(--color-primary);
	position: absolute;
	bottom: 20px;
	right: 20px;
}
.services .service-item:hover .icon:before {
	background: var(--color-primary);
}
.services .service-item:hover h3 {
	border-color: var(--color-primary);
}
/*------------- Pages on main in the middle --------------*/
/*------------------ News Slider on Main -----------------*/
.news-slider .news-slider-wrap {
	padding-left: 10px;
}
.news-slider .news-slider-item {
	box-sizing: content-box;
	padding: 20px;
	margin: 20px 0px;
	box-shadow: 0px 0 10px rgba(var(--rgb-shadow), .3);
	position: relative;
	background: #fff;
	border-radius: 10px;
}
.news-slider .news-slider-item h3 {
	font-size: 18px;
	font-weight: bold;
	margin: 10px 0 5px 0;
	color: #000;
	height: 2.2em;
	overflow: hidden;
	display: -webkit-box;
	/* display 2 lines only */
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
}
.news-slider .news-slider-item p {
	font-style: italic;
	margin: 15px auto 15px auto;
	height: 4.2em;
	/* display 3 lines only */
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
}
.news-slider .swiper-pagination {
	margin-top: 20px;
	position: relative;
}
.news-slider .swiper-pagination .swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	background: rgba(0, 0, 0, 0.2);
	opacity: 1;
}
.news-slider .swiper-pagination .swiper-pagination-bullet-active {
	background: var(--color-primary);
}
@media (max-width: 767px) {
	.news-slider .news-slider-wrap {
		padding-left: 0;
	}
	.news-slider .news-slider-item {
		padding: 30px;
		margin: 15px;
	}
}
/*------------------ News Slider on Main -----------------*/
/*---------------------- News Items ----------------------*/
.news-item {box-shadow: 0px 2px 15px rgba(var(--rgb-shadow), .3); padding: 10px; border-radius: 5px; background: #fff; transition: 0.5s; margin: 10px; width: 100%; box-sizing: border-box;}
/*---------------------- News Items ----------------------*/
/*------------------------- Team -------------------------*/
.team .member {position: relative; box-shadow: 0px 2px 15px rgba(var(--rgb-shadow), .3); padding: 30px; border-radius: 5px; background: #fff; transition: 0.5s; margin: 0 !important; box-sizing: border-box; width: 100%; height: 100%;}
.team .member:hover {transform: translateY(-10px);}
.team .member .member-info {padding-left: 30px; text-align: left !important;}
.team .member h4 {font-weight: 700; margin-bottom: 5px; font-size: 20px; color: var(--color-primary);}
.team .member span {display: block; font-size: 15px; padding-bottom: 10px; position: relative; font-weight: 500;}
.team .member span::after {content: ""; position: absolute; display: block; width: 50px; height: 1px; background: var(--color-primary); opacity: 0.5; bottom: 0; left: 0;}
.team .member p {margin: 10px 0 0 0; font-size: 14px;}
.team .member .bi {display: inline-block; text-align: center; border-radius: 50px; width: 32px; height: 32px; background: rgba(var(--rgb-primary), .1); color: var(--color-primary); font-size: 16px; padding: 3px 0;}
/*------------------------- Team ------------------------*/
/*----------------------- Gallery -----------------------*/
.gallery-item {cursor: pointer;}
.pages-maps .gallery-item-container {aspect-ratio: 16 / 9; overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; box-sizing: border-box;}
.pages-maps .gallery-item-container img {width: 100%;}
.gallery-item-container img {cursor: pointer; transition: all 0.2s;}
.gallery-item-container:hover img {transform: scale(1.15); transition: transform 0.2s;}

.gallery .gallery-wrap {border-radius: 10px; overflow: hidden; aspect-ratio: 16 / 9;}
.gallery .gallery-wrap a {display: inline-block; height: 100%; width: 100%; transition: 0.3s;}
.gallery .gallery-wrap .gallery-info {padding: 25px 20px; background: #fff; position: relative; border-top: 1px solid #f3f3f3; z-index: 2;}
.gallery .gallery-wrap .gallery-info h4 {font-size: 18px; font-weight: 600; padding-right: 50px;}
.gallery .gallery-wrap .gallery-info h4 a {color: var(--color-default); transition: 0.3s;}
.gallery .gallery-wrap .gallery-info h4 a:hover {color: var(--color-primary);}
.gallery .gallery-wrap .gallery-info p {color: #6c757d; font-size: 14px; margin-bottom: 0; padding-right: 50px;}
.gallery .gallery-wrap:hover a {transform: scale(1.1);}
/*----------------------- Gallery -----------------------*/
/*------------------------ Guest ------------------------*/
.faq .faq-list {padding: 0 100px;}
.faq .faq-list ul {padding: 0; list-style: none;}
.faq .faq-list li+li {margin-top: 15px;}
.faq .faq-list li {padding: 20px; background: #fff; border-radius: 4px; position: relative; box-shadow: 0px 0px 10px rgba(var(--rgb-shadow), .3);}
.faq .faq-list a {display: block; position: relative; font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 24px; font-weight: 500; padding: 0 30px; outline: none; cursor: pointer;}
.faq .faq-list a:hover {color: var(--color-primary);}
.faq .faq-list .answer {transition: 0.3s;}
.faq .faq-list .icon-help {font-size: 24px; position: absolute; right: 0; left: 20px; top: 13px; color: var(--color-primary);}
.faq .faq-list .icon-show, .faq .faq-list .icon-close {font-size: 16px; position: absolute; right: 0; top: 0;}
.faq .faq-list p {margin-bottom: 0; padding: 10px 0 0 0;}
.faq .faq-list .icon-show {display: none;}
.faq .faq-list a.collapsed {color: var(--color-primary); transition: 0.3s;}
.faq .faq-list a.collapsed:hover {color: var(--color-primary); opacity: 0.5;}
.faq .faq-list a.collapsed .icon-show {display: inline-block;}
.faq .faq-list a.collapsed .icon-close {display: none;} @media (max-width: 1200px) {.faq .faq-list {padding: 0;}}
/*------------------------ Guest ------------------------*/
/*---------------------- Pagination ---------------------*/
.pagestable a {background: rgba(0,0,0,0.3); border-radius: 5px; color: #ffffff; font-size: 14px; font-weight: normal; display: inline-block; padding: 3px 7px; margin: 0px 1px; transition: 0.3s;}
.pagestable a:hover, .pagestable a.on {background: rgba(0,0,0,0.5); text-decoration: none;}
.pagestable .tens {background: none; border: 2px solid rgba(0,0,0,0.3); color: rgba(0,0,0,0.3);}
.pagestable .tens:hover {border: 2px solid rgba(0,0,0,0.5); color: rgba(0,0,0,0.5);}
/*---------------------- Pagination ---------------------*/
/*------------------------ Contact ----------------------*/
.contact-img {display: inline-block; border: none; width: 40%; margin: 0px 10px 0px 20px; float: right;border-radius: 10px; overflow: hidden;}
@media (max-width: 767px) {.contact-img {width: 100%; display: block; margin: 0px 0px 10px 0px; float: none;}}
/*------------------------ Contact ----------------------*/
/*------------------------- Footer ----------------------*/
.footer-newsletter {
	background: rgba(var(--rgb-default),.6);
	backdrop-filter: blur(3px);
	padding: 20px 0;
	color: rgba(255,255,255,.8);
}
.footer-newsletter a {color: var(--color-secondary);}
.footer-newsletter a:hover {color: var(--color-secondary-dark);}
.footer {
	font-size: 14px;
	background: rgba(var(--rgb-default), .8);
	backdrop-filter: blur(3px);
	padding: 20px 0;
	color: white;
}
.footer .social-links a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, 0.2);
	font-size: 16px;
	color: rgba(255, 255, 255, 0.7);
	margin-right: 10px;
	transition: 0.3s;
}
.footer .social-links a:hover {
	color: #fff;
	border-color: #fff;
}
.footer .footer-links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.footer .footer-links ul i {
	padding-right: 2px;
	color: rgba(255, 255, 255, 0.8);
	font-size: 12px;
	line-height: 0;
}
.footer .footer-links ul li {
	padding: 5px 0;
	display: flex;
	align-items: center;
}
.footer .footer-links ul a {
	color: rgba(255, 255, 255, 0.7);
	transition: 0.3s;
	display: inline-block;
	line-height: 1;
}
.footer .footer-links ul a:hover {
	color: #fff;
}
.footer .footer-contact p {
	line-height: 1;
}
.footer .copyright {
	text-align: center;
}
.footer .credits {
	padding-top: 4px;
	text-align: center;
	font-size: 13px;
}
.footer .credits a {
	color: #fff;
}
@media (max-width: 767px) {
	.footer .footer-links {
		background: rgba(0,0,0,.1);
		padding: 20px;
	}
}
/*------------------------- Footer ----------------------*/