/* @import url("../fonts/BRHendrix/stylesheet.css"); */

@import url("../fonts/Poppins/stylesheet.css");
@import url("../css/reset.css");
@import url("../css/columns.css");

/* @import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,800&display=swap'); */


/* =====================
    HEADER Section
========================*/

header {
    padding: 1rem 2% 1.5rem 2%;
    display: flex;
    align-items: center;
    background-color: transparent;
    justify-content: space-between;
    z-index: 1000;
    width: 100%;
}

header.fixed {
    position: fixed !important;
    width: 100%;
    background-color: #fff;
    box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.13);
}

header.fixed .navbar a {
    color: #525252;
}

header.fixed .navbar a {
    text-shadow: none !important;
}

header .logo img {
    max-height: 60px;
    position: relative;
    top: 5px;
}

header.p-r {
    background: #fff;
    box-shadow: 0px 4px 50px rgba(0, 0, 0, 0.13);
}

header .navbar a {
    font-size: 15px;
    padding: .8rem .5rem;
    color: #fff;
    margin: 0px 1rem;
    text-shadow: 1px 1px 4px rgb(0 0 0 / 54%);
}

header.p-r .navbar a {
    text-shadow: none;
    color: #525252;
}

header .navbar a.active {
    text-shadow: none;
    color: #fff;
    color: var(--orange);
    font-weight: 500;
    border-bottom: 4px solid var(--orange);
}

header .icons i {
    cursor: pointer;
    margin-left: .5rem;
    height: 3.2rem;
    line-height: 3rem;
    width: 3.2rem;
    text-align: center;
    font-size: 1.7rem;
    color: #fff;
    border-radius: 50%;
    background-color: var(--orange);
    border: 2px solid var(--orange);
}

#menu-bars {
    /* background-repeat: no-repeat; */
    /* background-position: center; */
    /* background-image: url(../images/components/globals/menu3.svg); */
    /* color: transparent; */
    /* background-size: 50%; */
    /* padding: 0.5em 0em; */
    /* border-color: transparent; */
    /* border-radius: 50%; */
    /* background-color: var(--orange); */
}

header .icons i:hover {
    color: #fff;
    background-color: #fff;
    color: var(--orange);
}

header .icons a {
    margin-left: .5rem;
}

header .icons #menu-bars {
    display: none;
}

/* =====================
    HOME SLIDER
========================*/


/*home*/
.slider-home-1 {
    background: linear-gradient(247.06deg, rgba(255, 255, 255, 0) 31.34%, #FFFFFF 87.54%), linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), image-set("../images/content/home/slider/1-600.webp" 1x, "../images/content/home/slider/1.webp" 2x);
}
.slider-home-2 {
    background: linear-gradient(247.06deg, rgba(255, 255, 255, 0) 31.34%, #FFFFFF 87.54%), linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), image-set("../images/content/home/slider/2-600.webp" 1x, "../images/content/home/slider/2.webp" 2x);
}
.slider-home-3 {
    background: linear-gradient(247.06deg, rgba(255, 255, 255, 0) 31.34%, #FFFFFF 87.54%), linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), image-set("../images/content/home/slider/3-600.webp" 1x, "../images/content/home/slider/3.webp" 2x);
}
.slider-home-4 {
    background: linear-gradient(247.06deg, rgba(255, 255, 255, 0) 31.34%, #FFFFFF 87.54%), linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), image-set("../images/content/home/slider/4-600.webp" 1x, "../images/content/home/slider/4.webp" 2x);
}
/*service*/
.slider-service-1 {
    background: linear-gradient(193.02deg, rgba(0, 0, 0, 0) 104.27%, #FFFFFF 131.06%), linear-gradient(247.45deg, rgba(255, 255, 255, 0) 42.96%, rgba(255, 255, 255, 0.68) 129.18%), linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/content/service/1.jpg);
}
.slider-service-2 {
    background: linear-gradient(193.02deg, rgba(0, 0, 0, 0) 104.27%, #FFFFFF 131.06%), linear-gradient(247.45deg, rgba(255, 255, 255, 0) 42.96%, rgba(255, 255, 255, 0.68) 129.18%), linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/content/service/2.jpg);
}
.slider-service-3 {
    background: linear-gradient(193.02deg, rgba(0, 0, 0, 0) 104.27%, #FFFFFF 131.06%), linear-gradient(247.45deg, rgba(255, 255, 255, 0) 42.96%, rgba(255, 255, 255, 0.68) 129.18%), linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/content/service/3.jpg);
}
.slider-service-4 {
    background: linear-gradient(193.02deg, rgba(0, 0, 0, 0) 104.27%, #FFFFFF 131.06%), linear-gradient(247.45deg, rgba(255, 255, 255, 0) 42.96%, rgba(255, 255, 255, 0.68) 129.18%), linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../images/content/service/4.jpg);
}

.home-slider.after-none:after {
    content: none;
}

.slider-3 {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.62)), url(../images/content/boostervotreentreprise/1.jpg);
}

.slider-4 {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.62)), url(../images/components/banners/slider-4.jpg);
}

.home-slider {
    position: relative;
    padding: 10rem 7%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.home-slider.large {
    padding: 13rem 7%;
}

.home-slider:after {
    content: '';
    position: absolute;
    left: -32px;
    right: 0px;
    height: 90px;
    bottom: -50px;
    background: #FFFFFF;
    filter: blur(12px);
    width: 114%;
}

.home-slider h1 {
    color: var(--blue);
    font-weight: 700;
    font-size: 57px;
    line-height: normal;
}

.home-slider h2 {
    max-width: 46%;
    color: var(--black);
    font-size: 20px;
    font-weight: 400;
    line-height: 31px;
}


/* =====================
    SEARCH FORM
========================*/

#search-home-form {
    /* border: 3px solid #FBE9E3; */
    box-shadow: 0px 4px 35px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(25px);
    border-radius: 18px;
    position: relative;
}

#search-home-form input[type='text'],
#search-home-form input[type='email'],
#search-home-form select {
    background: #F4F4F4;
    border-radius: 10px;
    color: #8E8E8E;
}

#search-home-form label {
    font-size: 16px;
    margin: 8px 0px;
    font-weight: 600;
}

#search-home-form .submit {
    display: flex;
    align-items: center;
    justify-content: end;
    flex-wrap: wrap;
}


/* =====================
    ANNUAIRE
========================*/

#annuaire-section .box {
    position: relative;
    width: 90%;
    margin: 0 auto;
    border-radius: 25px;
    padding: 25px 15px;
}

#annuaire-section .box:after {
    content: '';
    position: absolute;
    top: -10px;
    left: -10px;
    background: #e2e2e2;
    border-radius: 25px;
    width: 100%;
    height: 100%;
    z-index: -1;
}

#annuaire-section .box::before {
    /* content: ''; */
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url();
    border-radius: 25px;
}

#annuaire-section .box .title {
    font-weight: 600;
    font-size: 25px;
}

#annuaire-section .box .btn-small {
    margin: 0px 0px;
}


/* =====================
    HEADING
========================*/

.head-section {
    text-align: center;
}

.heading {
    position: relative;
    text-align: center;
    color: var(--orange);
    font-style: normal;
    font-weight: 600;
    font-size: 40px;
    background-image: url(../images/components/headers/header-bg.svg);
    background-repeat: no-repeat;
    background-position-y: bottom;
    display: inline-block;
    background-size: contain;
    padding-bottom: 13px;
    margin-bottom: 10px;
}

.heading.long {
    background-image: url(../images/components/headers/header-long.svg);
}

#company-section .heading:after {
    background-image: url(../images/components/headers/office-building.svg);
}

#product-section .heading:after {
    background-image: url(../images/components/headers/delivery-box.svg);
}

#annuaire-section .heading:after {
    background-image: url(../images/components/headers/delivery-truck.svg);
}

#advantage-section .heading:after,
#service-section .heading:after {
    background-image: url(../images/components/headers/delivery-box.svg);
}

#testimonial-section .heading:after {
    background-image: url(../images/components/headers/quotes.svg);
}

#reference-section .heading:after {
    background-image: url(../images/components/headers/cooperation.svg);
}

#packs-section .heading:after {
    background-image: url(../images/components/headers/pack.svg);
}

#annuaireresa--section .heading:after {
    background-image: url(../images/components/headers/annuaire-resa.svg);
}

#blogs-section .heading:after {
    background-image: url(../images/components/headers/blogs.svg);
}

#annuaireresa--section h3 {
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 130%;
    color: var(--orange);
}

#annuaireresa--section p {
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 0.1px;
    color: #555555;
    opacity: 0.8;
}

#annuaireresa--section .img-contain-resa {
    padding-left: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #ff8051;
    border-radius: 40px 50% 50% 40px;
    display: inline-block;
    padding-right: 30px;
}

#annuaireresa--section .img-contain-resa img {
    border-radius: 15px;
    top: 30px;
    position: relative;
}

#annuaireresa--section .bg {
    text-align: right;
}

#blog--section .heading:after {
    background-image: url(../images/components/headers/blogs.svg);
}

.heading:after {
    content: '';
    width: 42px;
    height: 42px;
    display: inline-block;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: 10px;
    right: -63px;
}

.sub-heading {
    text-align: center;
    color: var(--gray);
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
}


/* =====================
    swiper
========================*/

.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    justify-content: center;
    align-items: center;
}

.swiper {
    padding-bottom: 37px;
}

.swiper-pagination-bullet {
    background: #fcd1c1;
    opacity: 1;
    height: 10px;
    width: 10px;
}

.swiper-pagination-bullet-active {
    background: var(--orange);
    width: 36px;
    border-radius: 5px;
    height: 7px;
    position: relative;
    top: -2px;
    margin: 0px 12px !important;
}

.swiper-slide {
    padding: 10px;
}

.swiper-slide.only-image {
    padding: 20px;
}


/* .swiper-wrapper {
    justify-content: center;
} */

.wrapper {
    box-shadow: 0px 3px 14px rgb(0 0 0 / 15%);
    border-radius: .7em;
    padding: 25px 15px;
    position: relative;
    margin: 0px 15px;
    background-color: white;
}

.wrapper img.normal {
    height: 60px;
}

.swiper-slide img.logo {
    max-height: 77px;
    padding: 3px;
    margin: 0px 0px 5px 0px;
    box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.13);
}

.swiper-slide img.top {
    box-shadow: 0px 4px 30px rgb(0 0 0 / 11%);
    border-radius: 4px;
    height: 200px;
    z-index: 6;
    background: #fff;
    margin-bottom: 15px;
}

.swiper-slide.special img.top {
    background-color: var(--orange);
}

.swiper.img-top .swiper-slide {
    padding-top: 50px;
}

.swiper.img-top .swiper-slide .wrapper {
    /* padding-top: 80px; */
}

.swiper-slide span.rate {
    display: block;
}

.swiper-slide span.rate i {
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0px 4px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    color: #e5d52a;
}

span.rate.yellow i.full {
    background-image: url(../images/components/globals/star-solid-yellow.svg);
}

span.rate.yellow i {
    /* background-image: url(../images/components/globals/star-regular-yellow.svg); */
}

span.rate.white i.full {
    /* background-image: url(../images/components/globals/star-solid-white.svg); */
}

span.rate.white i {
    /* background-image: url(../images/components/globals/star-regular-white.svg); */
    color: #fbe601;
}

.swiper-slide span.rate i.full {}


/* =====================
    REFERENCES
========================*/

#testimonial-section p.text-gray:after {
    content: '';
    background-image: url(../images/testimonial/quote.svg);
    width: 37px;
    height: 33px;
    position: absolute;
    right: 35px;
    bottom: 32px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

#testimonial-section .wrapper .bg-orange {
    padding-top: 50px;
    border-radius: 0.7em;
}

#testimonial-section p.text-gray {
    padding: 40px 20px 90px 20px;
}

#testimonial-section img.user {
    width: 80px;
    border: 2px solid white;
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
}


/* =====================
    NOS SERVICES
========================*/

#service-section.pic .wrapper:after {
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    left: 50%;
    top: 21px;
    background: linear-gradient(217deg, #FF5C00 0%, rgba(222, 222, 222, 0) 100%);
    border-radius: 4.5px;
    transform: translateX(-50%) rotate(-45deg);
}

#service-section span.title {
    font-weight: 600;
    font-size: 19px;
    line-height: 140%;
    color: #1E1E1E;
    height: 57px;
    line-height: 57px;
}

#service-section p {
    font-weight: 400;
    font-size: 17px;
    color: rgba(18, 17, 39, 0.56);
    padding: 0px 15px;
}
#service-section p.fix-height {
    height: 192px;
}

#service-section .overlay-1 {
    border-radius: 20px 20px 0 0;
}

#service-section .top-title {
    background: #F4F6F8;
    box-shadow: 0px 6px 45px rgba(0, 0, 0, 0.11);
    border-radius: 15px;
    font-weight: 600;
    font-size: 12px;
    line-height: 17px;
    color: var(--orange);
    padding: 9px 25px;
    left: 50%;
    top: -17px;
    transform: translateX(-50%);
    width: 90%;
}

#service-section.service-2 .wrapper {
    border: 3px solid var(--orange);
    filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.15));
    border-radius: 23px;
}

#service-section .wrapper .overlay-1 {
    height: 200px;
}

#service-section .wrapper .overlay-1:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    border-radius: 20px 20px 0px 0px;
    left: 0px;
    top: 0px;
}

#sub-service {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    padding-top: 40px;
    padding-bottom: 40px;
    background: rgba(0, 0, 0, 0.59);
    z-index: 9999;
    overflow-y: scroll;
}

#sub-service:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    cursor: pointer;
    left: 0px;
    top: 0px;
    z-index: -1;
}

#packs-section {
    max-width: 90%;
    margin: 0 auto;
}


/* =====================
    PACKS
========================*/

#packs-section .img-block {
    padding-left: 70px;
    padding-top: 7px;
}

#packs-section .img-block img {
    background: #EBF2FF;
    width: 63px;
    padding: 17px;
    border-radius: 7px;
    left: 0px;
    top: 0px;
}

.img-100 {
    width: 100%;
}

#packs-section .img-block span.label {
    font-weight: 500;
    font-size: 14px;
}

#packs-section .img-block span.t1 {
    font-weight: 600;
    font-size: 17px;
}

#packs-section ul li i {
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    font-size: 10px;
}


/* =====================
    SOCIAL NETWORK
========================*/

.social-f {
    right: 0px;
    top: 300px;
    background: var(--orange);
    border: 3px solid var(--orange);
    backdrop-filter: blur(30px);
    border-radius: 10px 0 0 10px;
    z-index: 3;
    box-shadow: 0px 3px 14px rgb(0 0 0 / 45%);
}

.social-f a {
    padding-left: 6px;
    padding-right: 6px;
    margin: 9px;
    font-size: 20px;
}


/* =====================
    BANNER WRAPPER
========================*/

.banner-wrapper {
    background-image: url(../images/components/boost-your-company/CTA.jpg);
    padding: 70px 40px;
    text-align: center;
    border-radius: 20px;
}

.banner-wrapper .banner-title {
    font-size: 35px;
    max-width: 50%;
    margin-left: auto;
    margin-right: auto;
}


/* =====================
    BLOGS
========================*/

#blogs-section .title-blog {
    font-style: normal;
    font-weight: 600;
    font-size: 19px;
    text-transform: capitalize;
    color: #222222;
    display: block;
    width: 305px;
    overflow: hidden;
    /* word-break: break-all; */
    /* height: 29px; */
}

#blogs-section .title-blog strong {
    color: var(--orange);
}

#blogs-section .wrapper {
    box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.16);
    border-radius: 20px;
    margin: 0px 0px 20px 0px !important;
}

#blogs-section .img-blog {
    border-radius: 15px;
}

#blogs-section .desc-blog {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    color: #555555;
}

ul.blog-info {
    margin-bottom: 15px;
}

ul.blog-info li {
    display: inline-block;
    border-right: 1px solid #999999;
    padding-right: 8px;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    text-transform: capitalize;
    color: #777777;
}

ul.blog-info li>i {
    color: #555555;
}

ul.blog-info li:last-child {
    border-right: none;
    padding-right: 0px;
}

ul.blog-info li img {
    width: 20px;
    margin-right: 3px;
}

.image-content-blog {
    border-radius: 15px;
    height: 200px;
    width: 100%;
}


/* blog-post */

#blog-post-section h1 {
    font-style: normal;
    font-weight: 500;
    font-size: 34px;
    line-height: 46px;
    color: #0B3B5F;
    max-width: 70%;
    text-transform: uppercase;
}

#blog-post-section h1 strong {
    color: var(--orange);
}

#blog-post-section h4 {
    font-size: 22px;
    line-height: 46px;
    color: #0B3B5F;
}

#blog-post-section p,
.blog-description {
    font-weight: 500;
    font-size: 18px;
    color: #86849B;
}

.blog-description ul {
    list-style: none !important;
}

.blog-description strong {
    font-size: 22px;
    line-height: 46px;
    color: #0B3B5F;
}


/* =====================
    PERSONAL SECTION
========================*/

.update-company {
    bottom: 60px;
    right: 4%;
}

#personal-section {
    z-index: 3;
    position: relative;
    margin-top: -63px;
}


/* #personal-section img.user {
    position: relative;
    margin-top: -41px;
    max-width: 150px;
    background-color: #fff;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 17%);
} */

#personal-section .logo-profile {
    position: relative;
    background-color: #fff;
    /* box-shadow: 0px 0px 8px rgb(0 0 0 / 17%); */
    box-shadow: 0px 0px 20px rgb(0 0 0 / 35%);
    height: 150px;
    width: 150px;
    margin-top: -41px;
    background-size: contain;
}

#personal-section .label-title {
    width: 155px;
    display: inline-block;
}

#personal-section .label-title>i {
    font-size: 17px;
    vertical-align: -1px;
}

.info-wrapper-company {
    font-size: 14px;
}

#personal-section span.rc {
    font-style: normal;
    font-weight: 500;
    font-size: 19px;
    line-height: 28px;
    color: #575757;
}

#personal-section span.name-company {
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    text-align: center;
    color: #7B798B;
}

#personal-section p.detail-company {
    font-weight: 500;
    font-size: 13px;
    line-height: 25px;
    text-align: center;
    color: #6F6C90;
    max-width: 229px;
}

#personal-section ul.menu {
    background: #FFFFFF;
    box-shadow: 0px 26px 50px rgb(0 0 0 / 27%);
    border-radius: 8px;
    display: inline-block;
}

#personal-section ul.menu li {
    display: inline-block;
    font-weight: 600;
    font-size: 14px;
    color: #757575;
    padding: 18px 15px;
    cursor: pointer;
    border-bottom: 3px solid #ffffff;
}

#personal-section ul.menu li.active {
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    text-align: center;
    color: var(--orange);
    border-color: var(--orange);
}

#personal-section .clearfix {
    max-width: 795px;
    margin: 0px 0px 25px 0px;
}

#personal-section .block-info .text-orange {
    margin-right: 30px;
}

#personal-section .block-info .separator {
    height: 3px;
    margin: 8px 0px;
}


/* =====================
    CONTACT SECTION
========================*/

#contact-section #left {
    border-radius: 0px 15px 15px 0px;
    background-size: cover;
    background-position: initial;
}

#contact-section #left h1 {
    font-weight: 600;
    font-size: 25px;
}

#contact-section #left p {
    font-weight: 500;
    font-size: 18px;
    margin-bottom: 30px;
}

#contact-section #left ul.list-style-none>li>i {
    top: 3px;
    left: 12px;
}

#contact-section #left ul.list-style-none .description {
    padding-left: 40px;
}

#contact-section #left .social-media {
    font-size: 22px;
    margin: 30px auto;
}

#contact-section #right {
    box-shadow: 0px 4px 43px rgba(0, 0, 0, 0.12);
    border-radius: 25px;
}

#contact-section #right h1 {
    font-weight: 600;
    font-size: 35px;
    line-height: 34px;
}

#contact-section #right p {
    font-weight: 500;
    font-size: 17px;
    color: #525252;
}

#contact-section .image-login {
    border-radius: 40px;
    max-height: 90vh;
}

#contact-section .rememberme label {
    font-weight: 400;
    font-size: 16px;
    color: #2B2B2B;
}

#contact-section .rememberme a {
    font-weight: 600;
    font-size: 16px;
    color: #2B2B2B;
    line-height: 17px;
}

#contact-section .rememberme a:hover {
    text-decoration: underline;
}

.soumettre {
    max-width: 560px;
    margin: 0px auto;
}

.soumettre img {}

.soumettre h1 {
    font-size: 27px !important;
    line-height: 46px;
}

.soumettre h2 {
    text-align: center !important;
    line-height: 30px;
}


/* =====================
    FOOTER
========================*/

footer .scrollToTop {
    width: 65px;
    height: 65px;
    line-height: 85px;
    cursor: pointer;
    right: 40px;
    top: -27.5px;
    text-align: center;
    background: var(--orange);
    box-shadow: 0px 4px 19px rgb(0 0 0 / 13%);
}

footer .scrollToTop img {
    height: 29px;
}

footer .block {
    border-right: 4px solid rgba(212, 212, 212, 0.17);
    padding-left: 15px;
}

footer .block.none {
    border-right: none;
    padding-left: 0px;
}

footer span.title {
    font-weight: 700;
}

footer span.social a {
    font-size: 27px;
}

footer .block:after {
    content: '';
}

footer .block ul li,
footer .block .details {
    font-size: 17px;
    font-weight: 400;
}

footer .block ul li a:hover {
    text-decoration: underline;
}

footer .block ul li img {
    vertical-align: -webkit-baseline-middle;
    margin-right: 8px;
}

footer .footer-conditions a {
    font-size: 12px;
    border-right: 2px solid #D4D4D4;
    padding: 0px 6px 0px 2px;
}

footer .footer-conditions a:last-child {
    border-right: none;
    padding: 0px 0px 0px 2px;
}


/* pack-description */

.pack-description {
    margin-top: 20px;
}

.pack-description>div {
    color: var(--gray);
    margin-bottom: 20px;
}

.pack-description.white>div {
    color: #fff;
}

.pack-description strong {
    color: #000;
    display: inline-block;
}

.pack-description.white strong {
    color: #fff;
}

.pack-description ul {
    margin-bottom: 40px;
    list-style: none;
}

.pack-description ul li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 10px;
}

.pack-description ul li:before {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro";
    font-family: var(--fa-style-family, "Font Awesome 6 Pro");
    font-weight: 900;
    font-weight: var(--fa-style, 900);
    color: #fff;
    background-color: var(--orange) !important;
    border-radius: 50%;
    position: absolute;
    width: 20px;
    height: 20px;
    left: 0px;
    top: 3px;
    line-height: 20px;
    text-align: center;
    font-size: 10px;
}

.pack-description.white ul li:before {
    background-color: #fff !important;
    color: var(--orange);
}


/* leader-css */

.leader label {
    display: block;
}

.space-down {
    position: relative;
}

.add_item_link {
    position: absolute;
    bottom: 32px;
    right: 20px;
    width: 20px;
    height: 20px;
    border: 2px solid #a0a3bd;
    background: transparent;
    border-radius: 6px;
    padding: 0px;
    color: #a0a3bd;
    line-height: 17px;
    cursor: pointer;
}

.add_item_link.mono {
    bottom: 17px;
}

.add_item_link:hover {
    border: 2px solid var(--orange);
    color: var(--orange);
}

.space-down input {
    margin-bottom: 15px;
}

.leader>div>div {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--bs-gutter-y) * -1);
    margin-right: calc(var(--bs-gutter-x) * -.5);
    margin-left: calc(var(--bs-gutter-x) * -.5);
}

.leader>div>div>div {
    padding: 0px 15px 0px 15px;
    flex: 0 0 auto;
    width: 50%;
}

@media (max-width: 768px) {
    .leader>div>div>div {
        padding: 0px 15px 0px 15px;
        flex: 0 0 auto;
        width: 100%;
    }
}

.message-ul ul {
    list-style: none;
    display: inline-block;
}


/* Basic Dropdown */

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    opacity: 0;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    padding: 15px 20px;
    z-index: 1;
    transition: all 1s;
}

.dropdown:hover .dropdown-content {
    display: block;
    opacity: 1;
}


/* Boost Dropdown */

.boost-dropdown {
    background: #FFFFFF;
    box-shadow: 0px 4px 17px rgba(0, 0, 0, 0.25);
    border-radius: 7px;
    min-width: 268px;
    top: 35px;
    left: 14px;
}

.boost-dropdown ul {
    margin: 3px auto;
}

.boost-dropdown ul a {
    font-size: 14px;
    padding: .3rem 0.5rem;
    color: var(--blue);
    margin: 0px;
    text-shadow: none;
    font-weight: 500;
    display: inline-block;
}

.boost-dropdown ul a:hover {
    color: var(--orange);
}

#service-dropdown {
    min-width: 500px;
}

#service-dropdown.displayed {
    min-width: 500px;
}

#service-dropdown .first:after {
    content: none !important;
}

#service-dropdown.display-items {
    min-width: 501px;
}

#service-dropdown.display-items .image-item {
    display: block;
}

#service-dropdown.displayed .first:after {
    content: '' !important;
}

#service-dropdown.display-items .last {
    display: block;
}

#service-dropdown img {
    width: 164px;
    border-radius: 5px;
}

#service-dropdown a {
    color: #848484;
    font-weight: 500;
    padding: 0.3rem 0.5rem;
}

#service-dropdown .active {
    border-bottom: none;
    color: var(--orange);
    text-decoration: underline;
}

#service-dropdown a:hover {
    border-bottom: none;
    color: var(--orange);
    text-decoration: underline;
}

#service-dropdown .first {
    position: relative;
}
#service-dropdown.displayed .first {
    position: relative;
    max-width: 200px;
}
#service-dropdown.displayed .last {
    max-width: 200px;
}
#service-dropdown .first:after {
    content: '';
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0px;
    right: -21px;
    background-color: #EEEEEE;
}

.image-sector {
    width: 170px;
    height: 109px;
    border-radius: 5px;
    margin: 10px auto;
}

.delete-service {
    position: absolute;
    top: 0px;
    right: 10px;
}

.tags-items li {
    display: inline-block !important;
    color: #333;
    margin: 4px 3px;
    list-style: none;
    padding: 10px 15px;
    background: #FFEBE0;
    border-radius: 100px;
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    color: var(--orange);
}
/* loading*/

#loading{
    display: flex;
    align-items: center;
    justify-content: center;
}
svg{
  width: 100px;
  height: 100px;
  margin: 20px;
  display:inline-block;
}
.whatsapp-button{
    background: var(--orange);
    border: 1px solid white;
    color: white;
    position: fixed;
    bottom: 50px;
    right: 10px;
    z-index: 2;
    width: 60px;
    overflow: hidden;
    height: 60px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    box-shadow: -5px 5px 5px rgba(0,0,0,.3);
}
.whatsapp-button span{
    background-color: white;
}

.whatsapp-button span {
    --n: 1;
    position: absolute;
    width: 20%;
    height: 100%;
    transform: translateY(150%);
    border-radius: 50%;
    left: calc((var(--n) - 1)*25%);
    transition: .5s;
    transition-delay: calc((var(--n) - 1)*.1s);
    z-index: -1;
}
.whatsapp-button:hover{
    color: var(--orange);
}
.whatsapp-button i {
    font-size: 32px;
}
.whatsapp-button:hover span {
    transform: translateY(0) scale(2);
}
.whatsapp-button span:nth-child(1) {
    --n: 1;
}
.whatsapp-button span:nth-child(2) {
    --n: 2;
}
.whatsapp-button span:nth-child(3) {
    --n: 3;
}
.whatsapp-button span:nth-child(4) {
    --n: 4;
}
.whatsapp-button span:nth-child(5) {
    --n: 5;
}