/*
==========================================
  site fonts
==========================================
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

/*------------------------------------------------------------------
[Table of contents]

1.  reset css
2.  common css
3.  main css
4.  blog css
0.  footer css

-------------------------------------------------------------------*/

/*
==========================================
1.  reset css
==========================================
*/

* {
	margin: 0;
	padding: 0;
}

body {
	font-family: 'Montserrat', sans-serif;
	font-size: 15px;
	font-weight: 400;
	position: relative;
	color: #464041;
	/* background-color: #013A56; */
	background-color: #006699;
}

a,
a:active,
a:focus,
a:hover,
button {
	text-decoration: none;
	cursor: pointer;
	display: inline-block;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
hr {
	padding: 0;
	margin: 0;
	font-weight: 400;
}

ul li {
	list-style-type: none;
}

.btn {
	display: -ms-inline-flexbox !important;
	display: inline-flex !important;
	-ms-flex-pack: center !important;
	justify-content: center !important;
	-ms-flex-align: center !important;
	align-items: center !important;
}

/*
==========================================
2.  common css
==========================================
*/

.main-style .fs75 {
	font-size: 75px;
}

.main-style .fs74 {
	font-size: 74px;
}

.main-style .fs61 {
	font-size: 61px;
}

.main-style .fs50 {
	font-size: 50px;
}

.main-style .fs48 {
	font-size: 48px;
}

.main-style .fs46 {
	font-size: 46px;
}

.main-style .fs45 {
	font-size: 45px;
}

.main-style .fs40 {
	font-size: 40px;
}

.main-style .fs41 {
	font-size: 41px;
}

.main-style .fs37 {
	font-size: 37px;
}

.main-style .fs35 {
	font-size: 35px;
}

.main-style .fs30 {
	font-size: 30px;
}

.main-style .fs27 {
	font-size: 27px;
}

.main-style .fs25 {
	font-size: 25px;
}

.main-style .fs20 {
	font-size: 20px;
}

.main-style .fs19 {
	font-size: 19px;
}

.main-style .fs18 {
	font-size: 18px;
}

.main-style .fs15 {
	font-size: 15px;
}

.main-style .fs12 {
	font-size: 12px;
}
.main-style .fs13 {
	font-size: 13px;
}

.main-style .fs10 {
	font-size: 10px;
}

.main-style .text-900 {
	font-weight: 900;
}

.main-style .text-800 {
	font-weight: 800;
}

.main-style .text-700,
.main-style b,
.main-style strong {
	font-weight: 700;
}

.main-style .text-600 {
	font-weight: 600;
}

.main-style .text-500 {
	font-weight: 500;
}

.main-style .text-300 {
	font-weight: 300;
}

.main-style .text-200 {
	font-weight: 200;
}

.main-style .text-100 {
	font-weight: 100;
}

.main-style a:not(.btn) {
	color: #000000;
}

.text-bleu1 {
	/* color: #25A1D6 !important; */
	color: #c3edff !important;
}

.text-bleu2 {
	color: #25A1D6 !important;
}
.text-bleu3{
	color:  #3f4ba4 !important;
}


.bg-bleu1 {
	background-color: #25A1D6;
}

.bg-bleu2 {
	background-color: #4EADD9;
}

.radius12 {
	border-radius: 12px;
}

.radius18 {
	border-radius: 18px;
}
.radius50{
	border-radius: 50%;
}
.w-100{
	width: 100% !important;
}
.h-100{
	height: 100% !important;
}

.left-section {
	min-height: 600px;
}
.more, .more-m{
	display: none;
}
.form-control{
	border: none;
	border-radius: 12px;
	background-color: #4386a4;
	color: #fff;
	font-size: 15px;
	padding: 20px 20px;
}
.form-control::placeholder{
	color: #fff;
	font-size: 13px;
}
.form-control:focus, .form-control:focus-visible {
    color: #fff;
    background-color: #4386a4;
    border-color: #4386a4;
    outline: 0;
    box-shadow: none;
}

.head .form-control{
	border: none;
	border-radius: 12px;
	background-color: #35AEDA;
	color: #fff;
	font-size: 15px;
	padding: 14px 20px;
}
.head .form-control::placeholder{
	color: #fff;
	font-size: 13px;
}
.head .form-control:focus, .form-control:focus-visible {
    color: #fff;
    background-color: #35AEDA;
    border-color: #35AEDA;
    outline: 0;
    box-shadow: none;
}
/* .btn{
	width: auto !important;
} */
.bg-s{
	/* background-color:  #074B6B; */
	background-color:  #0a80bb;
}
.bg-b {
    /* background-color: #01334e; */
    background-color: #1579aa;
}
.bg-g {
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(78,173,217,0.3) 100%);
}
.text-justify{
	text-align: justify;
}

.text-orange{
	color: #e27305!important;
}


body.offcanvas-active {
	overflow: hidden;
}

.offcanvas-header {
	display: none;
}

.screen-darken {
	height: 100%;
	width: 0%;
	z-index: 30;
	position: fixed;
	top: 0;
	right: 0;
	opacity: 0;
	visibility: hidden;
	background-color: rgba(34, 34, 34, 0.6);
	transition: opacity .2s linear, visibility 0.2s, width 2s ease-in;
}

.screen-darken.active {
	z-index: 10;
	transition: opacity .3s ease, width 0s;
	opacity: 1;
	width: 100%;
	visibility: visible;
}


nav img {
	height: 25px;
}

.dropdown-toggle::after {
	display: none;
	margin-left: .255em;
	vertical-align: .255em;
	content: "";
	border-top: .3em solid;
	border-right: .3em solid transparent;
	border-bottom: 0;
	border-left: .3em solid transparent;
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
	position: absolute;
	background-color: #4EADD9;
}

dropdown-item:focus,
.dropdown-item:hover {
	background-color: #013A56;
	color: white !important;
}

.dropdown-menu {
	min-width: auto;
}

.hamburger-icon  {
	height: 30px;
	width: 30px;
	display: inline;
}
.hamburger-icon span {
	height: 3px;
	width: 30px;
	background-color: #fff;
	display: block;
	margin: 5px 0px 5px 0px;
	transition: 0.7s ease-in-out;
	transform: none;
}
.hamburger-checkbox{
	display: none;
}
#openmenu:checked~.menu-pane {
	left: -5vw;
	transform: translateX(-5vw);
}

#openmenu:checked~.body-text {
	display: none;
}

#openmenu:checked~.hamburger-icon span:nth-of-type(1) {
	transform: translate(7%, 280%) rotate(-45deg);
	background-color: white;
}

#openmenu:checked~.hamburger-icon span:nth-of-type(3) {
	transform: translate(7%, -220%) rotate(45deg);
	background-color: white;
}

#openmenu:checked~.hamburger-icon span:nth-of-type(2) {
	opacity: 0;
}


div.menu-pane {
	background-color: #000;
	position: absolute;
	transform: translateX(-105vw);
	transform-origin: (0, 0);
	width: 100vw;
	height: 100%;
	transition: 0.6s ease-in-out;
}

.head .gradient{
	background: rgb(255,255,255);
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(78,173,217,0.3) 100%);
	/* height: 70vh; */
}

.services .service-title{
	position: absolute;
	top: calc(50% - 15px);
	left: 0;
}

.services img{
	height: 250px;
	object-fit: cover;
}
.team img{
	/* height: 360px; */
	height: 250px;
	object-fit: cover;
}
.video .play{
	position: absolute;
	top: calc(50% - 45px);
	left: calc(50% - 45px);
}
.video .play img{
	width: 90px;
	height: 90px;
}
.video .play a{
	width: 90px;
	height: 90px;
}
.testimonial{
	background: url('../img/testimonial.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.slick-dots {
    position: absolute;
    bottom: -70px;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}
.slick-dots li {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 46px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
}
.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 46px;
    height: 46px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    outline: none;
	border-radius: 50%;
	border: 2px solid transparent;
    /* background: transparent; */
	transition: all 0.5s;
}
.slick-dots li button:before {
    font-family: 'slick';
    font-size: 12px;
    line-height: 46px;
    position: absolute;
    top: 0;
    left: 0;
    width: 46px;
    height: 46px;
    content: '•';
    text-align: center;
    opacity: .25;
    color: #25A1D6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button {
    border: 2px solid #1b87b6;
	transition: all 0.5s;
}
.slick-dots li.slick-active button:before {
    opacity: .75;
    color: #25A1D6;
}
.blog-btn{
	position: absolute;
	bottom: -18px;
	left: calc(50% - 77px);
}
.footer {
	background-color: #002e43;
}
.footer .copy {
	background-color: #012234;
}
.footer .social-icon{
	width: 42px;
}
.footer ul li {
    list-style-type: none;
}
.footer ul li::before {
	content: " ";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
	background-color: white; /* Change the color */
	font-weight: bold; /* If you want it to be bold */
	display: inline-block; /* Needed to add space between the bullet and the text */
	width: 8px; /* Also needed for space (tweak if needed) */
	height: 8px;
	border-radius: 50%;
	margin-left: -1em; /* Also needed for space (tweak if needed) */
}
.btn.btn-primary{
    background-color: #25A1D6;
	border: 0;
}
textarea.contact{
	height: 375px;
}
.btn-plus{
	position: absolute;
	bottom: -25px;
	left: calc(50% - 25px);
	height: 50px;
	width: 50px;
	text-align: center;
}
.btn-contact{
	border-radius: 50px;
}
.text-muted {
    color: #49839b!important;
}

.hover06 .hover-img{
	overflow: hidden;
	transition: 0.3s ease-in-out;
}
.hover06 .hover-img img {
	transition: 0.3s ease-in-out;
}
.hover06 .hover-img:hover {
	box-shadow: 0px 0px 21px #012234;
}
.hover06 .hover-img:hover img  {
	-webkit-transform: rotate(0) scale(1);
	transform: rotate(10deg) scale(1.15);
}

.hover07 {
	overflow: hidden;
	transition: 0.3s ease-in-out;
}
.hover07 img {
	transition: 0.3s ease-in-out;
}
.service_hover:hover .hover07 {
	box-shadow: 0px 0px 21px #404040;
}
.service_hover:hover .hover07 img  {
	-webkit-transform: rotate(0) scale(1);
	transform: rotate(5deg) scale(1.12);
}
.service_hover .btn{
	transition: 0.3s ease-in-out;
}
.service_hover:hover .btn {
	/* -webkit-transform: rotate(0) scale(1); */
	transform: rotate(180deg) scale(1.3);
	box-shadow: 0px 0px 21px #404040;
}

.blog .slick-initialized .slick-slide {
    display: block;
    padding-bottom: 40px !important;
}
.sidebar li .submenu{ 
	list-style: none; 
	margin: 0 16px; 
	padding: 0; 
	padding-left: 1rem; 
	padding-right: 1rem;
	background-color: #fff;
	border-radius: 12px;
}
.sidebar li .nav-link{
	color: #fff;
	font-size: 18px;
	font-weight: 500;
}
.sidebar .submenu li .nav-link{
	color: #fff;
	font-size: 15px;
	font-weight: 400;
}


iframe{
	height: 518px;
	max-width: 920px;
	border-radius: 12px;
	margin-bottom: -6.5px;
	/* overflow: hidden; */
}
@media (max-width: 991.98px)
{
	iframe{
		height: 450px;
	}
}
@media (max-width: 767.98px)
{
	iframe{
		height: 450px;
	}
}
.shadows{
	box-shadow: 0px 22px 35px -13px #a5a5a5;
}
.btn-navs{
	height: 50px;
    width: 50px;
}
button:focus:not(:focus-visible){
	box-shadow: unset;
}
:focus-visible {
    outline: unset;
}
.problems{
	z-index: 1;
}
.navs-slide{
	width: calc(100% + 80px);
    right: -40px;
    top: calc(50% - 50px);
    z-index: 0;
}
.text-animate{
	font-family: serif;
	font-style: italic;
}
@font-face {
    font-family: herculanum;
    src: url(../fonts/herculanum-regular.ttf);
}
.text-animate2{
	font-family: herculanum;
}
@font-face {
    font-family: lucidagrande;
    src: url(../fonts/lucidagrande-regular.ttf);
}
.text-animate3{
	font-family: lucidagrande;
}

.act{
    margin-left: 14px;
	position: relative;
	display: block;
}
.act::after{
    content: "";
	display: block;
	width: 12px;
	height: 2px;
	position: absolute;
	left: 0;
	top: 49%;
	background-color: #fff;
}
