/* CSS Index
-----------------------------------
1. Theme default css
2. Header Area
3. Off Canvas Menu
4. Mobile Menu Area
5. Hero Area
*/

/* Theme Default CSS
==================================================*/
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap");
:root {
	--color-title: #2e2e2e;
	--color-text: #454545;
	--color-gray: #b6a0a0;
	--color-white: #ffffff;
	--color-green: #037388;
	--color-red: #f35b3a;
	--bg-btn: linear-gradient(
		88.28deg,
		#1798b0 5.5%,
		#d96760 48.32%,
		#f35b3a 93.9%
	);
	--main-bg: linear-gradient(180deg, #fffaf9 0%, #ffe0e0 100%);

	--color-border: #e5cdcd;
	--font-awesome: "Font Awesome 5 Free";
	--font-manrope: "Manrope", sans-serif;
}
body {
	font-family: var(--font-manrope);
	font-weight: 400;
	font-style: normal;
	font-size: 16px;
	color: var(--color-text);
	line-height: 24px;
	background: var(--main-bg);
}
* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
}
img {
	max-width: 100%;
	transition: all 0.3s ease-out 0s;
}
a,
.button {
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
	text-decoration: none;
}

a:hover,
.main-menu li a:hover,
.footer-menu li a:hover {
	color: var(--color-green);
	text-decoration: none;
}
a,
button {
	color: var(--color-green);
	outline: medium none;
	cursor: pointer;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-manrope);
	font-weight: 700;
	font-style: normal;
	color: var(--color-title);
	margin: 0 0 15px;
	text-transform: normal;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: inherit;
}
h1 {
	font-size: 45px;
	line-height: 50px;
}
h2 {
	font-size: 32px;
	line-height: 40px;
}
h3 {
	font-size: 28px;
}
h4 {
	font-size: 22px;
}
h5 {
	font-size: 18px;
}
h6 {
	font-size: 16px;
}

ul {
	margin: 0px;
	padding: 0px;
}
li {
	list-style: none;
}
p {
	margin-bottom: 15px;
}

hr {
	border-bottom: 1px solid var(--color-border);
	border-top: 0 none;
	margin: 30px 0;
	padding: 0;
}

label {
	color: var(--color-title);
	cursor: pointer;
	font-size: 14px;
	font-weight: 400;
}

*::-moz-selection {
	background: var(--color-title);
	color: var(--color-white);
	text-shadow: none;
}
::-moz-selection {
	background: var(--color-title);
	color: var(--color-white);
	text-shadow: none;
}
::selection {
	background: var(--color-title);
	color: var(--color-white);
	text-shadow: none;
}
*::-moz-placeholder {
	color: var(--color-border);
	font-size: 14px;
	opacity: 1;
}
*::placeholder {
	color: var(--color-border);
	font-size: 14px;
	opacity: 1;
}

/* button style */
.btn {
	background: var(--bg-btn);
	border-radius: 100px;
	border: none;
	color: var(--color-white);
	display: inline-block;
	font-size: 16px;
	line-height: 20px;
	font-weight: 800;
	margin-bottom: 0;
	padding: 12px 30px;
	text-align: center;
	transition: all 0.3s ease 0s;
}
.btn:hover {
	background: var(--bg-btn);
	color: var(--color-white);
}

input:focus[type="url"],
input:focus[type="text"],
input:focus[type="email"],
input:focus[type="tel"],
input:focus[type="button"],
input:focus[type="submit"],
input:focus[type="search"],
button:focus[type="button"],
button:focus[role="button"],
button:focus,
input:focus,
textarea:focus {
	outline: none;
	text-decoration: none;
}
.btn:focus {
	box-shadow: 0 0 0 0;
}
/* End Default Css */

/* Start Header Area
==================================================*/
.header_wrapper {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	padding: 20px 0;
}
.site_logo > a {
	max-width: 150px;
	display: inline-block;
}
.header_buttons {
	margin-left: auto;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.header_buttons .languages {
	margin-left: 20px;
	cursor: pointer;
	z-index: 10;
}
ul.languages {
	width: 109px;
	border: 1px solid var(--color-green);
	border-radius: 100px;
	padding: 10px 20px 10px 32px;
}
ul.languages:before {
	position: absolute;
	content: "\f107";
	font-family: "Font Awesome 6 Pro";
	font-weight: 900;
	right: 20px;
	top: 50%;
	color: var(--color-green);
	transform: translateY(-50%);
	font-size: 8px;
	transition: all 0.3s ease-in-out 0s;
	width: 24px;
	height: 24px;
	text-align: center;
	line-height: 24px;
}
ul.languages.open:before {
	transform: rotate(180deg) translateY(50%);
}
ul.languages > ul.lang_lists {
	position: absolute;
	width: 56%;
	top: 103%;
	background-color: var(--color-white);
	display: none;
	left: 50%;
	transform: translateX(-50%);
}
ul.languages > li.activated,
ul.languages > ul.lang_lists li > a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 16px;
	line-height: 20px;
	font-family: var(--font-manrope);
	font-weight: 800;
	text-transform: uppercase;
	color: var(--color-green);
	cursor: pointer;
	margin-right: 10px;
}
ul.languages > ul.lang_lists li {
	display: block;
}

ul.languages > ul.lang_lists li > a {
	color: var(--color-green);
	padding: 10px;
}
ul.languages > ul.lang_lists li > a:hover,
ul.languages > ul.lang_lists li.active > a {
	color: var(--color-title);
}
/* End Header Area */

/* Start Hero Section
==================================================*/
.hero-section {
	min-height: 620px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right center;
	margin: 20px 0px;
	position: relative;
	z-index: 9;
	margin-bottom: -500px;
	overflow-x: hidden;
}
.hero_section_wrap {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	position: relative;
	z-index: 1;
}
.hero_content .title {
	margin-bottom: 48px;
}

.hero_content label {
	font-size: 16px;
	line-height: 20px;
	display: block;
	font-weight: 800;
	color: var(--color-title);
	margin-bottom: 10px;
}
.hero_content .nice-select {
	width: 100%;
	display: block;
	background-color: var(--color-white);
	border-radius: 6px;
	border: none;
	margin-bottom: 10px;
	padding: 18px 20px;
	height: auto;
	line-height: 0;
}
.hero_content .nice-select:after {
	border-color: var(--color-title);
	right: 25px;
	width: 8px;
	height: 8px;
}
.hero_content .nice-select .list {
	width: 100%;
}
.hero_content .nice-select .current {
	font-size: 16px;
	line-height: 24px;
	color: var(--color-text);
	font-weight: 400;
}
.hero_content .button .btn {
	margin-top: 20px;
	width: 100%;
	position: relative;
	padding: 23px;
}
.hero_content .button .btn img {
	position: absolute;
	right: 11px;
	top: 11px;
	width: 44px;
	height: 44px;
	border-radius: 100%;
}
.hero_images .image {
	min-height: 620px;
	background-size: cover;
	max-width: 100%;
	width: 158px;
	background-position: center;
	display: inline-block;
	border-radius: 20px;
	margin: 0 12px;
	transition: all 0.4s ease-in-out 0s;
}
.hero_images {
	display: flex;
	align-items: center;
	margin-left: -12px;
	margin-right: -12px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: -53px;
	width: 100%;
	justify-content: right;
	transition: 0.3s;
	z-index: -1;
}
.hero_images.activeImage {
	right: 0px;
}
.hero_images .image.active {
	width: 500px;
}
/* End Hero Section */

/* Start Feature Section
==================================================*/
.features-section {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding-top: 600px;
	padding-bottom: 280px;
}
.features_content {
	display: FLEX;
	align-items: center;
	overflow: hidden;
}
.features_content .feature_item {
	display: flex;
	align-items: center;
}
.feature_item .icon {
	max-width: 50px;
	width: 100%;
	height: 50px;
	border-radius: 50%;
	margin-right: 20px;
}
.feature_item .text p {
	margin-bottom: 0;
}
.features_content .feature_item:not(:last-child) {
	margin-right: 105px;
	padding-right: 105px;
	border-right: 1px solid var(--color-border);
}
/* End Feature Section */

/* Start About Section
==================================================*/
.about-section {
	margin-top: -150px;
	background-size: cover;
	background-position: top;
	background-repeat: no-repeat;
	padding-bottom: 200px;
}
.about_content .title {
	margin-bottom: 30px;
}

.about_content p:not(:last-child) {
	margin-bottom: 20px;
}

.about_img {
	margin-top: 60px;
}

.about_content {
	margin-right: 35px;
}

.about_counter {
	margin-top: 60px;
	text-align: right;
}

.single_counter .title {
	text-transform: uppercase;
	color: var(--color-red);
	margin-bottom: 5px;
}

.single_counter span.text {
	display: block;
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	color: var(--color-text);
}
.about_counter .single_counter:not(:last-child) {
	margin-bottom: 33px;
	padding-bottom: 33px;
	border-bottom: 1px solid var(--color-border);
}
/* End About Section */

/* Start Banner Section
==================================================*/
.banner-section {
	background-image: url(../img/banner/bg.jpg);
	padding: 73px 0 0;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	display: flex;
	align-items: end;
}

.banner_content .title {
	color: var(--color-white);
	margin-bottom: 30px;
}

.banner-section .banner_content {
	width: 100%;
	max-width: 476px;
}

.banner-section .image-box {
	width: 100%;
	max-width: 511px;
	margin-left: auto;
	margin-top: -220px;
}

.banner_content .button .banner_btn {
	background-color: var(--color-white);
	display: inline-block;
	padding: 23px 85px;
	position: relative;
	text-align: center;
	font-size: 16px;
	line-height: 20px;
	font-weight: 800;
	color: var(--color-green);
	border-radius: 100px;
}

.banner_content .button .banner_btn img {
	position: absolute;
	right: 11px;
	top: 11px;
	width: 44px;
	height: 44px;
	border-radius: 50%;
}
/* End Banner Section */

/* Start CTA Section */

.cta-section {
	background-color:var(--color-green);
	padding:60px 0;
	color: var(--color-white);
	display: flex;
}

.cta-section .title {
	font-size: 50px;
	line-height: 55px;
	margin-bottom: 36px;
}

.cta-section p {
	font-size: 20px;
	line-height: 30px;
	letter-spacing: 0.025em;
	margin-bottom: 30px;
}

.cta-section .btn {
	font-size: 20px;
	line-height: 25px;
}

/* End CTA Section */

/* Start Information Section */
.information-section {
	padding: 32px 0;
}

.information-section .title {
	font-size: 30px;
	color: var(--color-green);
}

.information-section ol li {
	list-style: unset;
}

.information-section a {
	transition: all 0.25s ease-in;
	border-bottom: 1px solid transparent;
	white-space: nowrap;
}

.information-section a:hover {
	border-color: var(--color-green);
}
/* End Information Section */

/* Start Carousel Section */
.carousel-section {
	padding: 50px 0;
}

.carousel-section .title {
	font-size: 48px;
	line-height: 1;
	color: var(--color-green);
	margin-bottom: 24px;
}

.carousel-section .descrption {
	font-size: 20px;
	line-height: 28px;
}

.carousel-section .glide__bullets {
	bottom: -2rem;
}

.carousel-section .glide__bullet {
	width: 16px;
	height: 16px;
}

.carousel-section .glide__arrow {
	top: 104%;
	font-size: 32px;
	line-height: 24px;
	font-weight: 800;
	padding: 12px;
}

.carousel-section .glide__arrow--left {
	left: 0;
}

.carousel-section .glide__arrow--right {
	right: 0;
}

.carousel-section a {
	color: inherit;
}

.slide-img {
	overflow: hidden;
	border-radius: 5px;
	margin-bottom: 12px;
}

.slide-title {
	font-size: 24px;
	margin-bottom: 16px;
}

.glide__slide .author {
	font-size: 12px;
	line-height: 14px;
}
/* End Carousel Section */

/* Start Mission Section
==================================================*/
.mission-section {
	position: relative;
	margin-top: 11%;
	margin-bottom: 6%;
}
.mission_desktop_img {
	position: absolute;
	left: 0;
	width: 60%;
	top: 50%;
	transform: translateY(-50%);
}
.mission_content .title {
	margin-bottom: 30px;
}

.mission_content p:not(:last-child) {
	margin-bottom: 20px;
}
/* End Mission Section */

/* Start Footer Area
==================================================*/
.site-footer {
	padding-top: 20px;
	padding-bottom: 60px;
}

.footer_logo a {
	max-width: 65px;
	display: inline-block;
	margin-bottom: 60px;
}

/* .footer_menu li {
	display: inline-block;
	margin: 0 30px;
} */

.footer_menu li {
	display: block;
	margin: 0;
}

.footer_menu li:not(:last-child) {
	margin-bottom: 16px;
}

.footer_menu li > a {
	font-size: 16px;
	line-height: 20px;
	font-weight: 800;
	color: var(--color-title);
}

.footer_menu {
	margin-bottom: 60px;
}

.footer_nav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 20px;
}

.social-links {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 32px;
	margin-bottom: 34px;
}

.social-link {
	font-size: 36px;
	color: var(--color-green);
	transition: opacity 0.25s ease-in;
}

.social-link:hover {
	opacity: 0.75;
}

.copyright_text span {
	display: block;
	font-size: 14px;
	line-height: 20px;
	color: var(--color-gray);
}
/* End Footer Area */

/* Start Border button */
.border-button {
	border: none;
	padding: 23px;
	border-radius: 40px;
	background: linear-gradient(41deg, #1798B0 0%, #D96760 48.44%, #F35B3A 100%);
	position: relative;
}

.border-button:before {
	content: "";
	position: absolute;
	left: 3px;
	right: 3px;
	top: 3px;
	bottom: 3px;
	background-color: var(--color-white);
	border-radius: 40px;
	transition: 0.3s ease opacity;
}

.border-button:hover.border-button:before {
	opacity: 0;
}

.border-button:hover .border-button__text {
	background: var(--color-white);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.border-button .border-button__text {
	font-size: 16px;
	font-weight: 700;
	background: linear-gradient(41deg, #1798B0 0%, #D96760 48.44%, #F35B3A 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: relative;
	z-index: 1;
	transition: 0.3s ease background-color;
}

/* End Border button */

