@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
html{-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;}
html{font-size: 10px;}
body{margin:0;padding:0;font-family: 'Poppins', sans-serif;font-size:16px; color: var(--BlackColor); overflow-x: hidden; background: var(--WhiteColor) ;}
ul, ol, p, form, input, textarea, select, pre, em, sub, sup, canvas, section, article, aside, img, a, li, iframe, table, nav, header, footer, body, menu, button{margin:0;padding:0;vertical-align:middle;box-sizing:border-box;-webkit-box-sizing:border-box;list-style:none;text-decoration:none;outline:none;border:0;border-spacing:0;border-collapse:collapse;font-family: 'Poppins', sans-serif;}
*, after, before{box-sizing:border-box;-webkit-box-sizing:border-box; font-family: 'Poppins', sans-serif;}

h1, h2, h3, h4, h5, h6{margin:0;padding:0;}
a{text-decoration: none!important;color: var(--PrimaryColor);display: inline-block;font-family: 'Poppins', sans-serif;}
a:hover{color: #321839;}
label{font-weight: normal!important;}
b, strong{font-family: 'Poppins', sans-serif;font-weight: 700;}
u{text-decoration:underline;}
i, em{font-style:italic;}
img{max-width:100%;}
input[type="button"], 
input[type="submit"], 
input[type="reset"],
input[type="text"],
select,
textarea{appearance:none;-webkit-appearance:none;-moz-:none;}
select::-ms-expand{display:none;}
input[type="button"], input[type="submit"], input[type="reset"]{cursor:pointer;}
p{color:#5d5d5d; font-family: 'Poppins', sans-serif;}
a{transition: 0.2s ease-out; -webkit-transition: 0.2s ease-out;}

body,html{overflow-x: hidden;}

:root{
  --PrimaryColor: #03989e;
  --SecondaryColor: #000F30;
  --WhiteColor: #ffffff;
  --BlackColor: #000000;
  --LightSection: #F1F1F1;
  --HeadingColor: #3A3A3A;
  --SubHeadingColor: #666C7A;
}

@media (min-width: 1300px){
  .container{ max-width: 1270px; }
  .container-fluid{ max-width: 1225px;}
}

.container-fluid{ padding: 0 20px;}
.container{ padding:0 15px;}

.row{margin: 0 -15px;}
.row div[class*="col"]{padding: 0 15px;}


.btn {border-radius: 5rem; letter-spacing: 3px; text-transform: uppercase; font-size: 18px; min-width: 15rem; font-weight: 600; padding: 0.8rem 2rem; border: 4px solid #ffffff; box-shadow: none; transition: 0.3s; text-shadow: none; box-shadow: none; text-align: center;}

.btn-primary{background: var(--PrimaryColor);color: var(--WhiteColor); box-shadow: 0 0 0 5px #03989e;}
.btn-border{border-color: var(--PrimaryColor);color: var(--PrimaryColor);}
.btn-primary:hover ,
.btn-primary:focus { background: #046568; border-color: #ffffff; color:#ffffff; box-shadow: 0 0 0 5px #03989e;}
 .btn-primary:active:focus{box-shadow: 0 0 0 5px #03989e;}

.btn-border:hover ,
.btn-border:focus {background: var(--PrimaryColor);color: var(--WhiteColor);  box-shadow: 0 0 0 5px #1ba87e;}

.social_head{width: 39px; height: 39px; background: #000000; display: inline-block; margin-left: 15px; color: #ffffff; font-size: 18px; border-radius: 100px; text-align: center; line-height: 38px;}
.social_head i{color: #ffffff;line-height: 38px;}
.social_head:hover{background: var(--PrimaryColor);}


.btn-white{ background: var(--WhiteColor); border-color: var(--WhiteColor); color: var(--DarkPrimaryColor);}
.btn-white:hover{ background: transparent; color: var(--WhiteColor);}

.btn-sm{padding: 1.5rem 2rem;}

.btn-black{ background: var(--BlackColor); border-color: var(--BlackColor); color: var(--PrimaryColor);}
.btn-black:hover{ background: transparent; color: var(--BlackColor);}

.repeat-section{ padding: 8rem 0;}
.repeat-heading{margin-bottom: 5rem;}
.repeat-heading h4{ font-size: 14px; font-weight: 600;text-transform: uppercase;color: var(--PrimaryColor);letter-spacing: 3px;margin-bottom: 3rem;}
.repeat-heading h2{ font-size: 4.8rem; font-weight: 400; color: var(--HeadingColor);}
.repeat-heading p{ font-size: 16px; line-height: 1.8; font-weight: 400;  margin-bottom: 3rem; color: var(--SubHeadingColor);}
.repeat-heading .custom-btn{ margin-top: 30px;}
.repeat-heading.black h2{color: var(--BlackColor);}
.repeat-heading.black p{color: var(--BlackColor);}


.site-header{ padding: 0.7rem 0; border-bottom: 15px solid rgb(206,32,38);}
.logo-bx img{max-width: 10.8rem;}
.site-header .container-fluid{display: flex;align-items: center;justify-content: space-between;position: relative;}
.header_nav>ul{display: flex;width: 100%;}
.header_nav>ul>li + li{margin-left: 5rem;}
.header_nav>ul>li{position: relative;align-self: center;}
.header_nav>ul>li>a{font-size: 16px;color: var(--BlackColor);padding: 0;background: transparent;font-weight: 600; text-transform: uppercase;}
.header_nav>ul>li>a.active{color: var(--PrimaryColor);}
.header_nav>ul>li>a::after{background: var(--WhiteColor);}
.header_nav>ul>li:hover>a{color: var(--PrimaryColor);}
.header_nav>ul>li.hasDropdwon::after{content: "";position: absolute;left: 0;top: 100%;width: 100%;height: 10rem;}
.header_nav>ul>li.hasDropdwon::before{content: "";position: absolute; left: 50%; top: calc(100% + 1.5rem); transform: translateX(-50%); width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid var(--PrimaryColor);transition: 0.3s;opacity: 0;}
.dropdown-custom{position: absolute;top: calc(100% + 5.5rem);left: 50%;transform: translateX(-50%);width: 35rem;padding: 5rem 3rem;background: var(--WhiteColor);z-index: 9;box-shadow: 0px 1rem 1.5rem rgba(0, 0, 0, 0.08); text-align: left;transition: 0.3s;pointer-events: none;opacity: 0;transition-delay: 0.1s;}
.dropdown-custom a{display: block;color: var(--SubHeadingColor);font-size: 16px;}
.dropdown-custom a:hover{color: var(--PrimaryColor);}
.dropdown-custom a + a{margin-top: 2rem;}

.header_nav>ul>li:hover .dropdown-custom{opacity: 1;pointer-events: all;top: calc(100% + 4.3rem);}
.header_nav>ul>li:hover::before{top: calc(100% + 1rem);opacity: 1;}

.hamburger,
.dark-laye,
.close-menu{display: none;}
/* header css end here */

.banner-section{ padding: 10rem 0 7rem 0; background-size: 100%;  position: relative;display: flex;align-items: center;}
.banner-text h1{ font-size: 7.5rem; font-weight: 800; line-height: 1.1;  color: var(--WhiteColor); margin-bottom: 4rem;}
.banner-text p{ font-size: 2rem;  color: var(--WhiteColor); font-weight: 400; max-width: 55rem; margin-bottom: 6rem;}







.main-menu{justify-content: flex-end; display: flex;}
.header_btn_MBX{display: flex; padding-left: 40px;}
.header_socials{align-self: center;}
.head_bookbtn{margin-right: 30px;}

.home_services_sec{background: #046568; padding: 30px 0px;}
.hslinks{display: flex; justify-content: center;}
.hslinks a {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
    display: inline-block;
    padding: 4px 20px;
    border-right: 3px solid var(--PrimaryColor);
    background: var(--PrimaryColor);
    border-radius: 100px;
    margin: 0px 10px;
}
.hslinks a:hover{color: #000000; text-decoration: underline !important;}
.hslinks a:last-child{border-right: 0px;}
.offer-bx span{display: inline-block; width: 90px; height: 90px; border-radius: 100px; text-align: center; background: var(--SecondaryColor); }
.offer-bx i{color: #ffffff; font-size: 26px;line-height: 89px;}
.offer-bx p{font-size: 18px; color: #000000; font-weight: 500; padding-top: 15px;}
.best_solution_offres{padding-top: 60px;}
.clients_logos{padding-top: 60px; text-align: center;}
.offer-bx{padding-top: 60px;}
.best_solution_offres h2{font-size: 32px; color: #000000; text-transform: uppercase; text-align: center; font-weight: 600;}
.best_solution_offres .container {max-width: 960px;}




footer {background: #046568; padding: 6rem 0 6rem 0; }


/*== Footer ==*/
.footer_heading{font-size: 20px; font-weight: 500; color: #ffffff; margin-bottom: 30px; }

.footer_links li + li, .footer_workD li + li, .footer_addressL li{margin-top: 10px;}
.footer_links li a{color: rgb(255 255 255 / 58%); font-size: 16px; font-weight: 400;}
.footer_links li a:hover{color: #ffffff;}
.footer_workD li {color: rgb(255 255 255 / 58%); font-size: 16px; font-weight: 400;list-style: circle;}
.footer_addressL li {color: rgb(255 255 255 / 58%); font-size: 16px; font-weight: 400;}
.footer_addressL li strong, .footer_workD li strong{color: #ffffff;}
footer .col-sm-3.col-md-3.col-lg-3:nth-of-type(2) {padding-left: 30px; }
footer .col-sm-3.col-md-3.col-lg-3:nth-of-type(1) {padding-right: 30px; }
.footer_workD {padding-left: 15px; }

.bootombar{background: #024244; padding: 10px 0px;}
.bootombar .container{max-width: 1100px;}
.footer_bb {text-align: center;}
.footer_bb p{color: #ffffff; font-size: 12px;}





.we-build-slider img{width: auto!important;display: inline-block!important;}
.we-build-slider .item{height: 8.2rem;display: flex;align-items: center;justify-content: center;}

.owl-nav button{width: 6rem;height: 6rem;display: flex;align-items: center;justify-content: center;border: 1px solid var(--SecondaryColor)!important;border-radius: 50%;pointer-events: all;transition: 0.3s;}
.owl-nav button span{font-size: 0;width: 20px;height: 9px;background: url("/javax.faces.resource/images/arrow.png.xhtml") no-repeat;background-size: cover;}
.owl-nav button.owl-next span{background-position: bottom;}
.owl-nav button:hover{border-color: var(--PrimaryColor)!important;}
.horizontal-arrow .owl-nav{position: absolute;left: 0;top: 50%;transform: translateY(-50%); right: 0;display: flex;justify-content: space-between;margin: 0 -11rem;pointer-events: none;}

.we-build-solution{position: relative;}
.we-build-solution::after{content: "";width: 100%;max-width: 107rem; margin: 0 auto; height: 1px;background: #ddd;position: absolute;left: 0;right: 0; bottom: 0;}


.service_penal span {display: inline-block; width: 120px; height: 120px; border-radius: 100px; background: rgb(3 152 158 / 50%); text-align: center; box-shadow: 0px 3px 16px rgb(0 0 0 / 9%);    padding-top: 29px;}


.hero-slider.horizontal-arrow .owl-nav { margin: 0 11rem;}
















.aboutp_ms h1{margin-bottom: 40px;}
.aboutp_ms h1 span{background: var(--PrimaryColor); display: inline-block; padding: 10px 20px; color: #ffffff; font-size: 26px; font-weight: 600;}
.aboutus_penal p{font-size: 16px; font-weight: 500;color: #000000;}
.aboutus_penal ul{padding-left: 25px;}
.aboutus_penal ul li{font-size: 16px; font-weight: 500; margin-top: 30px; color: #000000; list-style: disc;}
.aboutp_ms{padding-top: 60px; padding-bottom: 60px;}

.getbtn{background: var(--PrimaryColor); color: #ffffff; font-size: 16px; font-weight: 500; display: inline-block; padding: 8px 30px;}
.getbtn:hover{background: #ce2026; color: #ffffff;}

.getbutton{margin-top: 40px;}
footer .col-md-4:last-child .footer_dc{border-right: 0px;}
.services_ms{padding: 60px 0px;}
.service_penal img {height: 60px; /* filter: brightness(0) invert(100); */ filter: brightness(0);}
.service_penal {margin-top: 40px; background: #ffffff; border-radius: 30px 0px 30px; box-shadow: 0px 3px 16px rgb(0 0 0 / 12%); padding: 30px 15px; height: 240px; border: 1px solid rgb(3 152 158 / 34%);}
.service_penal h3{font-size: 18px; font-weight: 600; color: #000000; margin-top: 10px; margin-top: 15px;}
.services_ms h1 span{color: #000000; font-size: 28px; font-weight: 600;}
.services_ms .container{max-width: 900px;}
.services_ms h1{margin-bottom: 30px;}

.contactus_ms .container{max-width: 1000px;}
.contactus_ms .contactform_fuilds{padding-left: 30px;}
.contactus_ms{padding: 60px 0px;}
.contactus_ms h1{margin-bottom: 60px;}
.contactus_ms h1 span{display: inline-block; font-size: 28px; color: #000000; font-weight: 600; border: 5px solid #ce2026; border-radius: 100px; padding: 10px 30px;}
.contactp_cd h4{color: var(--PrimaryColor); font-weight: 600; font-size: 18px;}
.contactp_cd p{color: #000000; font-weight: 600; font-size: 18px;}
.contactp_cd{margin-top: 30px;}

.fuild_rbx{margin-top: 20px;}
.fuild_rbx label{font-size: 14px; color: #000000; font-weight: 500; display: block;}
.contact_fl{height: 30px; border: 1px solid #000000; font-size: 14px; color: #000000; box-shadow: none; outline: none; appearance: none; width: 100%; padding: 0px 15px;}
.contact_fl:hover{border-color: #ce2026;}
.fuild_rbx p{font-size: 16px; font-weight: 600; color: #ce2026;}
textarea.contact_fl{height: 130px; resize: none;}
.contactp_cd p a{color: #000000; font-weight: 600; font-size: 18px;}
.contactp_cd p a:hover{color: #ce2026; text-decoration: underline !important;}

.contact_maps{padding-top: 30px;border-top: 1px solid rgb(178 179 183 / 33%);}
.mapbox iframe{width: 100%;}
.mapbox{margin-top: 30px;}

 .contact_maps h4 {color: var(--PrimaryColor); font-size: 28px; font-weight: 600;}258
