@import url("https://fonts.googleapis.com/css2?family=Neonderthaw&display=swap");

body::-webkit-scrollbar {
    width: 6px;
}
body::-webkit-scrollbar-track {
    background: #d6d5d5;
}
body::-webkit-scrollbar-thumb {
    background-color: #f48238;
    border-radius: 20px;
    border: 3px solid transparent;
}
.content-title-about-us {
    border-top: 1px solid #e0e0e0;
    border-bottom: 1px solid #e0e0e0;
}
.container-page-app {
    padding-left: 120px;
    padding-right: 120px;
}
.media-body {
    width: 100%;
}
iframe {
    border-radius: 20px;
}
.title-page-app::after {
    content: "";
    position: absolute;
    background: #f48238;
    border-radius: 100px;
    height: 7px;
    width: 10%;
    bottom: 30%;
    margin-left: auto;
    margin-right: auto;
    left: 30%;
    right: 30%;
}
.text-about-us-page {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 167%;
    letter-spacing: 0.04em;
    color: #000000;
    text-align: justify;
}
.img-about-us-page {
    width: 100%;
}
.title-entreprise-about-us {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 46px;
    line-height: 121%;
    text-align: center;
    color: #ffffff;
}
.title-entreprise-about-us::after {
    content: "";
    position: absolute;
    background: #fff;
    border-radius: 100px;
    height: 7px;
    width: 10%;
    bottom: 30%;
    margin-left: auto;
    margin-right: auto;
    left: 30%;
    right: 30%;
}
.container-section-entreprise-about-us {
    background: #7a2d05;
    padding-top: 30px;
    padding-bottom: 210px;
}
.entreprise-card-item {
    background: #ffffff;
    box-shadow: 0px 4px 23px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 15px;
}
.title-card-entreprise {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 121%;
    text-align: center;
    color: #000000;
}
.text-card-entreprise {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 121%;
    color: #000000;
}
.btn-card-entreprise {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 121%;
    color: #f48238;
    border: 0;
    border-radius: 0;
    text-align: center;
}
.btn-card-entreprise:hover {
    color: #f48238;
    font-weight: bold;
}
.container-list-entreprise {
    margin-top: -15%;
    margin-bottom: 10%;
}
.card-img-team {
    border-radius: 18px 18px 0px 0px;
}
.card-team-item {
    background: #ffffff;
    border: 1px solid rgba(196, 196, 196, 0.5);
    border-radius: 18px;
    height: 420px;
}
.card-title-team {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 150%;
    color: #000000;
}
.card-text-team {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 150%;
    color: #333333;
}
.card-body-team {
    display: flex;
    justify-content: space-between;
}
.wrapper {
    background: #ffffff;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    padding: 7px;
}
.wrapper ul {
    list-style: none;
    padding-left: 0;
}

.wrapper ul li {
    width: 30px;
    height: 30px;
    position: relative;
    background: #f2f2f2;
    margin: 10px 0;
    cursor: pointer;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.wrapper ul li.facebook div.slider {
    background: #3b5998;
}

.wrapper ul li.twitter div.slider {
    background: #1da1f2;
}

.wrapper ul li.likedin div.slider {
    background: #0077b5;
}

.slider {
    content: "";
    position: absolute;
    top: 0;
    left: 51px;
    width: 0px;
    height: 30px;
    border-radius: 3px;
    transition: all 0.5s 0.3s ease;
    z-index: 999;
}

.slider p {
    font-family: arial;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    line-height: 30px;
    opacity: 0;
    transition: all 0.6s ease;
}

.wrapper ul li:hover .slider {
    width: 100px;
    transition: all 0.5s ease;
}

.wrapper ul li:hover .slider p {
    opacity: 1;
    transition: all 1s 0.2s ease;
}

.testimonial-list-content .card {
    margin: 0 0.5em;
    border: none;
    height: 100%;
    background: #ffffff;
    box-shadow: 0px 0px 43px rgba(255, 102, 34, 0.2);
    border-radius: 5px;
    padding: 15px;
}
.img-profil-testimonial {
    width: 181px;
    height: 181px;
    border-radius: 50%;
}
.title-testimonial {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 800;
    font-size: 26.8211px;
    line-height: 40px;
    color: #ffffff;
}
.subtitle-testimonial {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 22.9895px;
    line-height: 40px;
    color: #ffffff;
}
.icon-testimonial {
    font-size: 50px;
    color: #fff;
}
.card-text-testimonial {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 400;
    font-size: 22.9895px;
    line-height: 40px;
    color: rgba(255, 255, 255, 0.7);
}
.row-testimonial-app-home {
    align-items: center;
}
.card-body-testimonial {
    padding-top: 15px;
}
#carouselTestimonial .carousel-control-prev,
#carouselTestimonial .carousel-control-next {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    top: 90%;
    transform: translateY(-50%);
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
    width: 20px;
    height: 20px;
}
.carousel-control-next,
.carousel-control-prev {
    opacity: 1;
    position: inherit;
    width: inherit;
}
.carousel-indicators [data-bs-target] #carouselTestimonial .carousel-inner {
    padding: 40px 20px;
}
.content-control-btn-carousel {
    display: flex;
    gap: 20px;
    position: absolute;
    bottom: 0;
}
.carousel-inner-testimonial {
    padding-bottom: 60px;
}
@media (min-width: 576px) {
    #carouselTestimonial .carousel-item {
        margin-right: 0;
        flex: 0 0 50%;
        display: block;
    }
}
.text-date-actu {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0.05em;
    color: #1c4192;
}
.card-actu-item {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 10px;
}
.card-img-top-actu {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
}
.organigram-item {
    display: flex;
    align-items: center;
}
.img-profil-organigram {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    position: absolute;
    left: 5px;
    top: 15px;
}
.content-img-organigram {
    position: relative;
}
.content-text-organigram {
    border-left: 0;
    border-top: 3px solid #f48238;
    border-right: 3px solid #f48238;
    border-bottom: 3px solid #f48238;
    padding: 10px 40px;
    margin-left: -11px;
    margin-top: 10px;
    width: 100%;
}
.title-organigram {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0.02em;
    text-align: center;
    color: #000000;
}
.text-organigram {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    letter-spacing: 0.02em;
    color: #000000;
}
.row-organigramme {
    margin-bottom: 30px;
}
.join-us-container {
    margin-top: 100px;
}
.form-control-join-us {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: 0.5px;
    color: #8e8e8e;
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-bottom: 1px solid #737b7d;
    padding: 15px 15px 15px 0;
    border-radius: 0;
}
.message-mail {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 160%;
    letter-spacing: 0.5px;
    color: #d50d0d;
}
.message-piece-jointe {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 160%;
    letter-spacing: 0.5px;
    color: #8e8e8e;
}
.btn-submit-form {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    color: #ffffff;
    background: #f48238;
    border-radius: 5px;
    padding: 15px;
    width: 100%;
}
.info-contact-join-us {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: 0.5px;
    color: #383c3e;
}
.title-info-contact-join-us {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: 0.5px;
    color: #383c3e;
}
.btn-submit-newsletter {
    background: #7a2d05;
    padding: 15px;
}
.partner-container-page {
    padding-top: 110px;
}
.content-section1 {
    padding-left: 120px;
}
.img-company-page {
    filter: drop-shadow(0px 4px 20px rgba(0, 0, 0, 0.1));
    border-radius: 57px 0px 0px 0px;
}
.title-company-page::after {
    content: "";
    position: absolute;
    background: #f48238;
    border-radius: 2px;
    width: 170px;
    height: 2px;
    left: 0;
    top: 0;
}
.service-company-item {
    background: #ffffff;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    padding: 20px;
}
.text-name-service {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    color: #64748b;
}
.text-value-name-service {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    color: #191d23;
}
.text-service-company {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 300;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #191d23;
}
.content-row-company-service {
    padding-left: 30px;
    padding-right: 30px;
}
.form-label-contact-company {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 175.4%;
    letter-spacing: -0.3px;
    color: #4f4f4f;
}
.form-control-contact-company {
    background: #ffffff;
    border-radius: 9px;
    padding: 15px;
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 175.4%;
    letter-spacing: -0.3px;
    color: #4f4f4f;
    border: 0;
    border-radius: 0;
}
.container-section-contact-company {
    padding: 70px 120px;
    background: #fff0e9;
}
.title-form-contact-company {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 30px;
    line-height: 189.5%;
    color: #000000;
    text-align: center;
}
.text-describe-form-contact-company {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
    line-height: 189.5%;
    text-align: center;
    color: #777777;
}
.popup-content-deco {
    background: #7a2d05;
    padding-bottom: 20px;
}
.container-popup {
    width: 60%;
}
.bg-deco-popup {
    width: 100%;
    height: 265px;
}
.img-year-popup {
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
    z-index: 9;
    left: 20%;
    right: 20%;
    margin-left: auto;
    margin-right: auto;
}
.img-object-popup {
    position: absolute;
    z-index: 1;
    left: 27%;
    top: 30%;
}
.text-title-deco-popup {
    font-family: "Neonderthaw";
    font-style: normal;
    font-weight: 400;
    font-size: 40px;
    line-height: 54px;
    text-align: center;
    color: #feffaa;
    background: linear-gradient(
        180deg,
        #f5ee11 17.74%,
        #ffc16f 39.47%,
        #ffb53e 61.21%,
        #f69617 81.94%
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: 1px 1px 1px #000000;
}
.title-poputext {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 0.2em;
    color: #ffffff;
}
.name-site-redirect {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    letter-spacing: 0.2em;
    text-decoration-line: underline;
    color: #ffffff;
}
.name-site-redirect:hover {
    color: #f69617;
}
.hide {
    display: none;

    /* transform: none; */
}
/* .slide {
    animation: fade 12s linear infinite;
} */
@keyframes fade {
    0% {
        visibility: hidden;
    }

    25% {
        visibility: hidden;
    }

    50% {
        visibility: visible;
    }

    75% {
        visibility: visible;
    }

    100% {
        visibility: visible;
    }
}

@keyframes slideLeftIn {
    from {
        opacity: 0;
        transform: translateX(-50%);
    }
}
@-webkit-keyframes slideLeftIn {
    from {
        opacity: 0;
        -webkit-transform: translateX(-50%);
    }
}

/* Popup */
/* popup styles */
.popup {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 999;
}
.popup-overlay {
    /* background: rgba(0,0,0,0.9); */
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
.popup-content {
    position: fixed;
    background: #fff;
    width: fit-content;
    top: 25%;
    z-index: 999;
    padding: 14px;
    left: 0;
    right: 0;
    margin: auto;
}
.close-popup {
    /* display: inline-block;
    position: absolute;
    top: -8px;
    right: -30px;
    font-size: 42px; */
    position: absolute;
    top: 2%;
    right: 2%;
    font-size: 16px;
    z-index: 9999;
    width: 30px;
    height: 30px;
    color: red;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-weight: 800;
}

/* Animations */
.fadeIn {
    animation: fadeIn 0.5s ease-in both;
    -webkit-animation: fadeIn 0.5s ease-in both;
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
}
@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
}

.fadeOut {
    animation: fadeOut 0.5s ease-out both;
    -webkit-animation: fadeOut 0.5s ease-out both;
}
@keyframes fadeOut {
    to {
        opacity: 0;
    }
}
@-webkit-keyframes fadeOut {
    to {
        opacity: 0;
    }
}

.scaleIn {
    animation: scaleIn 0.5s ease-in both;
    -webkit-animation: scaleIn 0.5s ease-in both;
}
@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.5);
    }
}
@-webkit-keyframes scaleIn {
    from {
        opacity: 0;
        -webkit-transform: scale(0.5);
    }
}

.scaleOut {
    animation: scaleOut 0.5s ease-out both;
    -webkit-animation: scaleOut 0.5s ease-out both;
}
@keyframes scaleOut {
    to {
        opacity: 0;
        transform: scale(0.5);
    }
}
@-webkit-keyframes scaleOut {
    to {
        opacity: 0;
        -webkit-transform: scale(0.5);
    }
}

.scaleUpIn {
    animation: scaleIn 0.5s ease-in both;
    -webkit-animation: scaleIn 0.5s ease-in both;
}
.scaleUpOut {
    animation: scaleUpOut 0.5s ease-in both;
    -webkit-animation: scaleUpOut 0.5s ease-in both;
}
@keyframes scaleUpOut {
    to {
        opacity: 0;
        transform: scale(1.2);
    }
}
@-webkit-keyframes scaleUpOut {
    to {
        opacity: 0;
        -webkit-transform: scale(1.2);
    }
}

.scaleDownIn {
    animation: scaleDownIn 0.5s ease-in both;
    -webkit-animation: scaleDownIn 0.5s ease-in both;
}
.scaleDownOut {
    animation: scaleOut 0.5s ease-in both;
    -webkit-animation: scaleOut 0.5s ease-in both;
}
@keyframes scaleDownIn {
    from {
        opacity: 0;
        transform: scale(1.2);
    }
}
@-webkit-keyframes scaleDownIn {
    from {
        opacity: 0;
        -webkit-transform: scale(1.2);
    }
}

.slideIn {
    animation: slideIn 0.5s ease-in both;
    -webkit-animation: slideIn 0.5s ease-in both;
}
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-50%);
    }
}
@-webkit-keyframes slideIn {
    from {
        opacity: 0;
        -webkit-transform: translateY(-50%);
    }
}

.slideOut {
    animation: slideOut 0.5s ease-out both;
    -webkit-animation: slideOut 0.5s ease-out both;
}
@keyframes slideOut {
    to {
        opacity: 0;
        transform: translateY(50%);
    }
}
@-webkit-keyframes slideOut {
    to {
        opacity: 0;
        -webkit-transform: translateY(50%);
    }
}

.slideLeftIn {
    animation: slideLeftIn 0.5s ease-in both;
    -webkit-animation: slideLeftIn 0.5s ease-in both;
}
@keyframes slideLeftIn {
    from {
        opacity: 0;
        transform: translateX(-50%);
    }
}
@-webkit-keyframes slideLeftIn {
    from {
        opacity: 0;
        -webkit-transform: translateX(-50%);
    }
}

.slideLeftOut {
    animation: slideLeftOut 0.5s ease-out both;
    -webkit-animation: slideLeftOut 0.5s ease-out both;
}
@keyframes slideLeftOut {
    to {
        opacity: 0;
        transform: translateX(50%);
    }
}
@-webkit-keyframes slideLeftOut {
    to {
        opacity: 0;
        -webkit-transform: translateX(50%);
    }
}

.flipLeftIn {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: flipLeftIn 0.5s both ease-out;
    -moz-animation: flipLeftIn 0.5s both ease-out;
    animation: flipLeftIn 0.5s both ease-out;
}
@-webkit-keyframes flipLeftIn {
    from {
        -webkit-transform: translateZ(-1000px) rotateY(90deg);
        opacity: 0.2;
    }
}
@keyframes flipLeftIn {
    from {
        transform: translateZ(-1000px) rotateY(90deg);
        opacity: 0.2;
    }
}

.flipLeftOut {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: flipLeftOut 0.5s both ease-in;
    -moz-animation: flipLeftOut 0.5s both ease-in;
    animation: flipLeftOut 0.5s both ease-in;
}

@-webkit-keyframes flipLeftOut {
    to {
        -webkit-transform: translateZ(1000px) rotateY(-90deg);
        opacity: 0;
    }
}
@keyframes flipLeftOut {
    to {
        transform: translateZ(1000px) rotateY(-90deg);
        opacity: 0;
    }
}

.flipRightIn {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: flipRightIn 0.5s both ease-out;
    -moz-animation: flipRightIn 0.5s both ease-out;
    animation: flipRightIn 0.5s both ease-out;
}
@-webkit-keyframes flipRightIn {
    from {
        -webkit-transform: translateZ(-1000px) rotateY(-90deg);
        opacity: 0.2;
    }
}
@keyframes flipRightIn {
    from {
        transform: translateZ(-1000px) rotateY(-90deg);
        opacity: 0.2;
    }
}

.flipRightOut {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: flipRightOut 0.5s both ease-in;
    -moz-animation: flipRightOut 0.5s both ease-in;
    animation: flipRightOut 0.5s both ease-in;
}

@-webkit-keyframes flipRightOut {
    to {
        -webkit-transform: translateZ(1000px) rotateY(90deg);
        opacity: 0;
    }
}
@keyframes flipRightOut {
    to {
        transform: translateZ(1000px) rotateY(90deg);
        opacity: 0;
    }
}

.rotateIn {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: rotateIn 0.5s both ease-out;
    -moz-animation: rotateIn 0.5s both ease-out;
    animation: rotateIn 0.5s both ease-out;
}
@-webkit-keyframes rotateIn {
    from {
        -webkit-transform: translateZ(-3000px) rotateZ(-360deg);
        opacity: 0;
    }
}
@-moz-keyframes rotateIn {
    from {
        -moz-transform: translateZ(-3000px) rotateZ(-360deg);
        opacity: 0;
    }
}
@keyframes rotateIn {
    from {
        transform: translateZ(-3000px) rotateZ(-360deg);
        opacity: 0;
    }
}

.rotateOut {
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-animation: rotateOut 0.5s both ease-in;
    -moz-animation: rotateOut 0.5s both ease-in;
    animation: rotateOut 0.5s both ease-in;
}
@-webkit-keyframes rotateOut {
    to {
        -webkit-transform: translateZ(-3000px) rotateZ(360deg);
        opacity: 0;
    }
}
@-moz-keyframes rotateOut {
    to {
        -moz-transform: translateZ(-3000px) rotateZ(360deg);
        opacity: 0;
    }
}
@keyframes rotateOut {
    to {
        transform: translateZ(-3000px) rotateZ(360deg);
        opacity: 0;
    }
}

.rotateCubeIn {
    -webkit-transform-origin: 50% 100%;
    -webkit-animation: rotateCubeIn 0.8s both ease-in;
    -moz-transform-origin: 50% 100%;
    -moz-animation: rotateCubeIn 0.8s both ease-in;
    transform-origin: 50% 100%;
    animation: rotateCubeIn 0.8s both ease-in;
}
@-webkit-keyframes rotateCubeIn {
    0% {
        opacity: 0.3;
        -webkit-transform: translateY(-100%) rotateX(90deg);
    }
    50% {
        -webkit-animation-timing-function: ease-out;
        -webkit-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
    }
}
@-moz-keyframes rotateCubeIn {
    0% {
        opacity: 0.3;
        -moz-transform: translateY(-100%) rotateX(90deg);
    }
    50% {
        -moz-animation-timing-function: ease-out;
        -moz-transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
    }
}
@keyframes rotateCubeIn {
    0% {
        opacity: 0.3;
        transform: translateY(-100%) rotateX(90deg);
    }
    50% {
        animation-timing-function: ease-out;
        transform: translateY(-50%) translateZ(-200px) rotateX(45deg);
    }
}

.rotateCubeOut {
    -webkit-transform-origin: 50% 0;
    -webkit-animation: rotateCubeOut 0.6s both ease-in;
    -moz-transform-origin: 50% 0;
    -moz-animation: rotateCubeOut 0.6s both ease-in;
    transform-origin: 50% 0;
    animation: rotateCubeOut 0.6s both ease-in;
}
@-webkit-keyframes rotateCubeOut {
    50% {
        -webkit-animation-timing-function: ease-out;
        -webkit-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
    }
    100% {
        opacity: 0.3;
        -webkit-transform: translateY(100%) rotateX(-90deg);
    }
}
@-moz-keyframes rotateCubeOut {
    50% {
        -moz-animation-timing-function: ease-out;
        -moz-transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
    }
    100% {
        opacity: 0.3;
        -moz-transform: translateY(100%) rotateX(-90deg);
    }
}
@keyframes rotateCubeOut {
    50% {
        animation-timing-function: ease-out;
        transform: translateY(50%) translateZ(-200px) rotateX(-45deg);
    }
    100% {
        opacity: 0.3;
        transform: translateY(100%) rotateX(-90deg);
    }
}

/* Demo Styles */
.popup {
    -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    perspective: 1200px;
}
.popup-content {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    background: #f48238 !important;
}
/* End Popup */

.content-chiffre-isc-info-item {
    display: flex;
    align-items: center;
    gap: 20px;
}
.content-chiffre-buton {
    border-radius: 20px;
    padding: 15px;
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 25px;
    line-height: 177.9%;
    letter-spacing: 0.01em;
    width: 90px;
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.color1-chiffre {
    background: #fff2f2;
    color: #ff4e4e;
}
.text-chiffre-info {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 500;
    font-size: 25px;
    line-height: 177.9%;
    letter-spacing: 0.01em;
    color: #2e0d64;
}

.content-col-left-chiffre-isc {
    background: #ffffff;
    box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.1);
    padding: 30px 20px;
}
.color2-chiffre {
    color: #2e0d64;
    background: #e2f3ff;
}
.color3-chiffre {
    color: #6e00fa;
    background: #f1e8ff;
}
.color4-chiffre {
    color: #900078;
    background: #ffe7fb;
}
.content-col-service-isc-company {
    background: #ffffff;
    box-shadow: 0px 13px 19px rgba(0, 0, 0, 0.07);
    border-radius: 5px;
    padding: 15px;
}
.content-col-service-isc-company:hover {
    background: #f48238;
}
.content-col-service-isc-company:hover .content-icon-isc-company iconify-icon {
    color: #fff;
}
.content-col-service-isc-company:hover .title-card-service-isc-company,
.content-col-service-isc-company:hover .text-service-isc-company {
    color: #fff;
}
.content-icon-isc-company iconify-icon {
    color: #f48238;
    font-size: 50px;
}
.title-card-service-isc-company {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 36px;
    line-height: 24px;
    text-align: center;
    letter-spacing: 0.1px;
    color: #f48238;
}
.text-service-isc-company {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    color: rgba(0, 0, 0, 0.6);
}
.title-col-right-pmo {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 140%;
    color: #0f111d;
}
.content-service-pmo-col-right-item {
    background: #ffffff;
    box-shadow: 0px 4px 43px rgba(0, 0, 0, 0.08);
    padding: 15px;
}
.list-item-service-pmo {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 140%;
    color: #f48238;
}
.text-service-pmo-service {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 140%;
    color: rgba(0, 0, 0, 0.5);
}
.img-pmo-company-page {
    width: 100%;
}
.btn-theme-outline {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 28px;
    letter-spacing: 0.2px;
    color: #f48238;
    background: #ffffff;
    border: 1px solid #f48238;
    border-radius: 5px;
    padding: 10px;
}
.btn-theme-outline:hover {
    background: #fff;
    border: 0;
    color: #f48238;
    box-shadow: 0px 4px 43px rgba(0, 0, 0, 0.08);
    font-weight: 700;
}
.container-portage-salarial {
    background: #7a2d05;
    padding: 30px 0;
}
.color-white-h2-theme {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 50px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #ffffff;
}
.title-col-right-portage-salarial {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 50px;
    letter-spacing: 0.2px;
    color: #ffffff;
}
.text-describe-portage-salarial {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.2px;
    color: #ffffff;
}
.btn-theme-outline-noborder {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 28px;
    letter-spacing: 0.2px;
    color: #f48238;
    background: #ffffff;
    border: 1px solid #f48238;
    border-radius: 5px;
    padding: 10px;
}
.btn-theme-outline-noborder:hover {
    background: transparent;
    font-weight: 700;
    color: #f48238;
}

/* carousel list entreprise */
.slick-carousel {
    margin: 0 auto;
    width: 1000px;
    background: #fff;
    box-shadow: 0px 13px 19px rgba(0, 0, 0, 0.07);
}
.container-carousel-service-pmo {
    margin-top: -40px;
}
.slick-slide {
    width: auto;
}
.slick-prev,
.slick-next {
    top: 10%;
}
.slick-next::before,
.slick-prev::before {
    color: #f48238;
    font-size: 35px;
}
.slick-track {
    display: flex;
    align-items: center;
}
.slick-slide {
    display: flex;
    justify-content: center;
}
/* .carousel .carousel-control-prev-icon {
    background-image: url('data:image/svg+xml,<svg class="bi bi-camera" width="1em" height="1em" viewBox="0 0 20 20" fill="%23fff " xmlns="http://www.w3.org/2000/svg"><path d="M11 7c-1.657 0-4 1.343-4 3a4 4 0 014-4v1z"/><path fill-rule="evenodd" d="M16.333 5h-2.015A5.97 5.97 0 0011 4a5.972 5.972 0 00-3.318 1H3.667C2.747 5 2 5.746 2 6.667v6.666C2 14.253 2.746 15 3.667 15h4.015c.95.632 2.091 1 3.318 1a5.973 5.973 0 003.318-1h2.015c.92 0 1.667-.746 1.667-1.667V6.667C18 5.747 17.254 5 16.333 5zM3.5 7a.5.5 0 100-1 .5.5 0 000 1zm7.5 8a5 5 0 100-10 5 5 0 000 10z" clip-rule="evenodd"/><path d="M4 5a1 1 0 011-1h1a1 1 0 010 2H5a1 1 0 01-1-1z"/></svg>');
}

.carousel .carousel-control-next-icon {
    background-image: url('data:image/svg+xml,<svg class="bi bi-bootstrap-fill" viewBox="0 0 20 20" fill="%23fff" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M6.002 2a4 4 0 00-4 4v8a4 4 0 004 4h8a4 4 0 004-4V6a4 4 0 00-4-4h-8zm1.06 12h3.475c1.804 0 2.888-.908 2.888-2.396 0-1.102-.761-1.916-1.904-2.034v-.1c.832-.14 1.482-.93 1.482-1.816 0-1.3-.955-2.11-2.543-2.11H7.063V14zm1.313-4.875V6.658h1.78c.974 0 1.542.457 1.542 1.237 0 .802-.604 1.23-1.764 1.23H8.375zm0 3.762h1.898c1.184 0 1.81-.48 1.81-1.377 0-.885-.65-1.348-1.886-1.348H8.375v2.725z" clip-rule="evenodd"/></svg>');
} */
.slick-prev {
    left: -40px;
}
.slick-dots {
    display: none !important;
}
/* carousel list entreprise */
.content-icon-service-ipm iconify-icon {
    color: #7a2d05;
    font-size: 60px;
}
.content-col-service-ipm {
    background: #ffffff;
    box-shadow: 0px 4px 23px rgba(0, 0, 0, 0.1);
    padding: 15px;
}
.title-card-service-item-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 121%;
    text-align: center;
    color: #000000;
}
.text-card-service-item-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 121%;
    color: rgba(0, 0, 0, 0.6);
}
.title-col-left-service-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 600;
    font-size: 30px;
    line-height: 36px;
    color: #000000;
}
.img-ipm-company-page {
    border: 1px solid #f8f5f3;
    border-radius: 20px;
    width: 100%;
}
.content-text-describe-info-service-ipm {
    width: 40%;
    margin-left: auto;
    margin-right: auto;
}
.text-describe-info-service-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #737373;
}
.title-info-service-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 50px;
    text-align: center;
    letter-spacing: 0.2px;
    color: #252b42;
}
.head-card-mutuelle-particulier-ipm {
    display: flex;
    align-items: center;
    gap: 20px;
}
.head-card-mutuelle-particulier-ipm iconify-icon {
    color: #7a2d05;
    font-size: 40px;
}
.title-head-card-mutuelle-particulier-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 700;
    font-size: 22px;
    line-height: 121%;
    color: #7a2d05;
}
.text-card-mutuelle-particulier-ipm {
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 121%;
    color: rgba(0, 0, 0, 0.6);
}
.content-col-mutuelle-particulier-ipm {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    background: #fff;
    padding: 20px;
    width: 100%;
}
.content-btn-bg-card-service {
    display: flex;
    justify-content: flex-end;
}
.container-bg-card-service-ipm {
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    height: 250px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.content-text-card-entreprise {
    height: 200px;
    overflow-y: scroll;
    margin-bottom: 15px;
}
.col-team-section {
    width: 250px;
    transition: transform 500ms;
    transition-timing-function: cubic-bezier(0.22, 0.11, 0.67, 0.55);
}
.content-list-team {
    display: flex;
    width: 100%;
    height: 600px;
    overflow: hidden;
    justify-content: center;
    align-items: center;
    font-family: monospace;
    position: relative;
    gap: 50px;
}
.content-list-team::before {
    content: "<";
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 55px;
    z-index: 1;
    left: 0;
    top: 0;
    display: flex;
    color: #f48238;
    font-weight: 700;
}

.content-list-team::after {
    content: ">";
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 55px;
    right: 0;
    top: 0;
    display: flex;
    color: #f48238;
    font-weight: 700;
}

.row-team {
    position: relative;
    display: flex;
    gap: 50px;
    transition: transform 500ms;
}
.left-team {
    position: absolute;
    left: 0;
    width: 35px;
    height: 50px;
    z-index: 2;
    cursor: pointer;
}

.right-team {
    position: absolute;
    right: 0;
    width: 35px;
    height: 50px;
    z-index: 2;
    cursor: pointer;
}

.current {
    transform: scale(1.3);
}
.media-body iframe {
    width: 100%;
    height: 500px;
}
.other-article-item-image {
    width: 100%;
    border-radius: 10px;
}
.img-detail-blog {
    width: 100%;
}
.publish-by-container {
    display: flex;
    justify-content: space-between;
    color: #1c4192;
    font-weight: 800;
}
.show-article-infos {
    padding: 15px 0;
}
.text-title-description-blog-detail {
    text-align: justify;
}
.other-article-item-title {
    font-size: 15px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.other-articles-item-container {
    background: #00000010;
    display: block;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 15px;
}
.title-detail-blog {
    font-size: 19px;
    color: #1c4192;
    font-weight: 700;
}
.card-actu-item img {
    object-fit: cover;
    height: 250px;
    max-height: 300px;
    min-height: 200px;
}
.card-body-actu h5 {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 16px;
}
.card-body-actu p {
    text-align: justify;
}
.other-articles-title {
    font-size: 20px;
    color: #1c4192;
    font-weight: 800;
}
.submit-btn {
    width: 100%;
    background: #1c4192 !important;
    border-color: #1c4192 !important;
    color: #ffffff !important;
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
}
.submit-btn:hover {
    background: transparent !important;
    color: #1c4192 !important;
}
.app-success-message,
.app-alert-danger {
    position: absolute;
    top: 15%;
    width: 100%;
    z-index: 99;
    text-align: center;
}
.app-success-message .close,
.app-alert-danger .close {
    position: absolute;
    right: 4%;
    background: red;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    color: #ffffff !important;
}
.app-form-errors-ul {
    list-style: none;
}
.app-alert-warning {
    background: #f97f4680;
    border-color: #1c4192;
    width: 100%;
}
.empty-data-alert-container {
    width: 100%;
}
.alert-empty-content p {
    margin-bottom: 0 !important;
    text-align: center;
    color: #1c4192;
    font-weight: 700;
    font-size: 20px;
}
.article-paginator-content {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5%;
}
.page-item.active span {
    background: #1c4192 !important;
    border-color: #1c4192 !important;
    font-weight: 600;
}
.page-item a {
    color: #1c4192 !important;
}
.footer-component {
    background: #fff;
    padding-top: 30px;
}

.body-footer {
    padding-top: 3rem;
}
.end-footer {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    display: flex;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}
.footer-grid .link-footer {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 150.6%;
    text-transform: uppercase;
    color: #000000;
    text-decoration: none;
}
.footer-grid .link-footer:hover {
    text-decoration: none;
    color: #004aad !important;
    font-weight: 700;
}
.icon-contact-footer {
    font-size: 20px;
    color: #004aad;
}
.title-footer-link {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 600;
    font-size: 27px;
    line-height: 123.6%;
    color: #000000;
}
footer .copyright {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 150.6%;
    color: #f8f8f8;
    display: flex;
    align-items: center;
    gap: 15px;
}

.footer-reseaux-sociaux-container {
    display: flex;
    justify-content: space-around;
}

.title-media-sociaux {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: #000000;
    margin: 0;
}
.container-image-sociaux {
    display: flex;
    width: 100%;
    justify-content: flex-end;
    align-items: center;
}
.social-icons-container {
    display: flex;
    gap: 25px;
}
.social-icon-item-container {
    width: 40px;
    height: 40px;
    background: #ffffff;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: center;
    align-items: center;
}
.facebbok {
    background: #1c4192;
}
.facebbok .social-link-item {
    color: #fff !important;
}
.social-link-item {
    font-size: 25px;
    color: #1c4192;
    line-height: 0;
}

.container-banner-app-page {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    margin-top: 165px;
}
.text-describe-app-footer {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 150.6%;
    color: #000000;
}
.title-app-page-banner {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 54px;
    line-height: 78px;
    text-align: center;
    color: #ffffff;
}
.content-text-banner-app-page {
    position: absolute;
}
.content-breadcrumb-app {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: center;
}
.link-redirect-breadcrumb,
.link-redirect-breadcrumb:hover {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #ffffff;
}
.section-activite-page {
    background: #fff;
    padding: 80px 0;
    position: relative;
}
.content-img-dots-1 {
    position: absolute;
    right: 0;
    top: 0;
}
.img1-activite1,
.img1-activite2 {
    width: 100%;
    border-radius: 8px;
}
.img2-activite1 {
    width: 291px;
    height: 311px;
    border: 17px solid #ffffff;
    position: absolute;
    left: 0;
    top: 0;
}
.list-item-aactivite {
    list-style-type: "\00002D";
    font-family: "Nunito";
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 37px;
    color: #000000;
    padding-left: 10px;
    margin-bottom: 25px;
}
.img2-activite2 {
    width: 291px;
    height: 311px;
    border: 17px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
}
.content-img-dots-2 {
    position: absolute;
    left: 0;
    bottom: 20%;
}
.content-img-qsn-dots-1 {
    position: absolute;
    left: 0;
    top: 0;
}
.img-content-qsn {
    width: 100%;
}
.content-img-qsn-dots-2 {
    position: absolute;
    right: 0;
    top: -55px;
}
.content-col-founder-qsn {
    background: #ffffff;
    border-radius: 7px;
    padding: 25px;
}
.img-founder-item {
    width: 191px;
    height: 191px;
    border-radius: 50%;
}
.titile-card-founder-qsn {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 56px;
    text-align: center;
    color: #2c3136;
}
.content-img-qsn-dots-team {
    position: absolute;
    left: 0;
    top: 6%;
}
.carousel-inner-team {
    gap: 20px;
}
.carousel-item-team {
    background: linear-gradient(
        0deg,
        #f1f6fa 2.53%,
        rgba(255, 255, 255, 0) 97.47%
    );
    filter: drop-shadow(0px 2.85393px 24.2584px rgba(0, 0, 0, 0.08));
    border-radius: 7.13483px;
    text-align: center;
    padding-bottom: 15px;
}
.img-profil-team {
    width: 145.55px;
    height: 145.55px;
    border-radius: 50%;
}
.card-name-team {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 800;
    font-size: 18px;
    line-height: 23px;
    text-align: center;
    color: #2c3136;
}
.poste-team-item {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 300;
    font-size: 12px;
    line-height: 23px;
    text-align: center;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: #2c3136;
}
.content-social-media-team {
    display: flex;
    gap: 10px;
    justify-content: center;
}
.title-service-page {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 800;
    font-size: 49px;
    line-height: 60px;
    color: #000000;
    text-align: center;
}
.col-service-item {
    background: #ffffff;
    border: 1px solid #004aad;
    border-radius: 24px;
    padding: 20px;
    text-align: center;
    filter: drop-shadow(0px 4px 50px rgba(0, 74, 173, 0.1));
}
.number-title-item {
    background: #004aad;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 30px;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.content-number-title {
    display: flex;
    justify-content: center;
}
.text-conseil-strategique {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 195.4%;
    color: #000000;
}
.section-footer-page {
    padding-top: 160px;
}
.content-text-describe-faq {
    width: 50%;
    margin: auto;
}
.text-describe-faq {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 33px;
    text-align: center;
    letter-spacing: -0.015em;
    color: #9497a1;
}
/* .feedbacks {
    position: relative;
    display: flex;
    width: 100%;
} */

.feedbacks button {
    font-weight: bolder;
    border-color: none;
}
/* #firstchild {
    background: #203f91 !important;
} */
/* #firstchild .accordion-button {
    color: #fff !important;
    background: transparent !important;
}
#firstchild .accordion-body {
    color: #fff !important;
} */

.feedbacks .accordion-button:not(.collapsed) {
    color: #ffffff !important;
    background-color: #203f91;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}

.accordion-item {
    background: #f3f7fc;
    box-shadow: 0px 3.04663px 15.2332px rgb(0 0 0 / 5%);
    border: 0;
}
.accordion-button {
    background: transparent;
}
.accordion-button:focus {
    border-color: none;
    box-shadow: none;
}
.section-faq {
    background: #f1f6fa;
    padding: 50px 0;
}
.content-info-qsn-bloc {
    background: #004aad;
    border: 11px solid #ffffff;
    padding: 20px 25px;
    position: absolute;
    right: -34px;
    bottom: 20%;
}
.title-text-info-qsn-bloc {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 800;
    font-size: 45px;
    line-height: 26px;
    color: #ffffff;
}
.text-info-qsn-bloc {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 800;
    font-size: 22px;
    line-height: 26px;
    color: #ffffff;
}
.form-control-input-search {
    background: #fff;
    border-radius: 2px;
    padding: 15px;
    font-family: "Nunito";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    color: #13335e;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 2px;
}
.container-blog-page {
    padding: 80px 0;
}
.btn-search-article-blog {
    font-size: 20px;
    position: absolute;
    right: 2%;
    top: 8px;
    color: #13335e;
}
.content-top-article-blog {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 20px;
}
.title-top-article-blog {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 900;
    font-size: 20px;
    line-height: 27px;
    color: #032656;
}
.title-content-text-article-item {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 22px;
    color: #032656;
}
.top-article-blog-item {
    display: flex;
    align-items: center;
    gap: 15px;
    border-bottom: 1px solid rgba(217, 217, 217, 0.2);
}
.top-article-blog-item:last-child {
    border-bottom: none;
}
.date-pub-article-content {
    display: flex;
    align-items: center;
    gap: 10px;
}
.text-date-pub-article {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 600;
    font-size: 10px;
    line-height: 150.6%;
    color: #6d7d8b;
}
.line-sepator-date-pub {
    background: #bbc8d4;
    width: 2px;
    height: 17px;
}
.title-top-article-blog-item {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 30px;
    line-height: 41px;
    color: #032656;
}
.img-pp-user-article {
    width: 45px;
    height: 45px;
    border-radius: 50%;
}
.content-article-blog-item {
    border: 0;
}
.card-title-article {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 33px;
    color: #25313c;
}
.card-text-article {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 150.6%;
    color: #25313c;
}
.content-breadcrumb-blog {
    display: flex;
    align-items: center;
    gap: 10px;
}
.crumb-blog-item,
.crumb-blog-item:hover {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 33px;
    letter-spacing: 0.1375px;
    color: #000000;
}
.title-detail-article {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 500;
    font-size: 27px;
    line-height: 33px;
    color: #25313c;
}
.container-text-detail-article,
.container-text-detail-article p {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 21px;
    color: rgba(0, 0, 0, 0.6);
    text-align: justify;
}
.container-blog-article {
    padding: 200px 0;
}
.img-detail-article-blog {
    width: 100%;
}
.content-newsletter-footer {
    display: flex;
}
.form-control-newsletter {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 150.6%;
    color: #c8c4c4;
    border: 1px solid #1c4192;
    padding: 20px;
    border-radius: 0;
}
.btn-subscribe-newsletter {
    background: #1c4192;
    color: #fff;
    border-radius: 0;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 15px;
}
.content-contact-register {
    background: #ffffff;
    box-shadow: 0px 4px 20px rgba(28, 65, 146, 0.05);
    border-radius: 5px;
    padding: 30px;
}
.title-page-contact-register {
    font-family: "Nunito";
    font-style: normal;
    font-weight: 400;
    font-size: 36px;
    line-height: 51px;
    letter-spacing: -1px;
    color: #333333;
}
.content-contact-register-item {
    display: flex;
    gap: 20px;
    align-items: center;
}
.content-icon-contact-register .icon-contact-apge {
    font-size: 30px;
    color: #333333;
}
.sub-title-contact-register {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    color: #333333;
}
.text-contact-register {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #333333;
    text-decoration: none;
}
.content-text-contact-register a:hover {
    color: #1c4192;
    font-weight: 700;
    text-decoration: none;
}
.form-label-contact-register {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: #0c0b0b;
}
.form-control-contact-register {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 300;
    font-size: 13px;
    line-height: 20px;
    color: #8b8b8b;
    border: 0.5px solid #1c4192;
    border-radius: 0;
    background: #fff;
    padding: 20px;
}
.text-section-left-about-us-page {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #333333;
}
.text-about-us-page {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 15.4701px;
    line-height: 23px;
    color: #ffffff;
}
.content-info-about-depannage-page {
    display: flex;
    gap: 10px;
}
.title-text-info-about-depannage {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    font-size: 17.189px;
    line-height: 26px;
    color: #ffffff;
}
.text-info-about-depannage {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 15.4701px;
    line-height: 23px;
    color: #ffffff;
}
.icon-info-about {
    color: #ffb342;
    font-size: 20px;
}
.content-list-year-about-item {
    position: relative;
    z-index: 9;
}
.list-year-about-item {
    background: #ffffff;
    padding: 30px 20px;
}
.beffore-card-about-list {
    content: "";
    width: 16px;
    height: 16px;
    position: absolute;
    top: 65px;
    left: -8px;
    z-index: -1;
    background: #fff;
    transform: rotate(45deg);
    box-shadow: 4px 4px 20px 6px rgba(0, 0, 0, 20%);
}
.text-describe-year-info-about {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 15.4701px;
    line-height: 23px;
    color: #7e7e7e;
}
/* .content-year-text-item {
    background: #1c2752;
    padding: 10px 30px;
} */
.year-text-item {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 800;
    font-size: 17.189px;
    line-height: 26px;
    text-align: center;
    color: #ffb342;
    background: #1c2752;
    padding: 10px 50px;
    position: relative;
    top: 9px;
    z-index: 99;
    left: 19px;
}
.content-col-how-it-work {
    background: #ffffff;
    box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.05);
    padding: 35px 20px;
    text-align: center;
}
.content-icon-how-it-work {
    background: #f3f7fc;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 45px;
    color: #1c4192;
}
.title-how-it-work {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 31px;
    text-align: center;
    color: #333333;
}
.text-how-it-work {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 31px;
    text-align: center;
    color: #333333;
}
.content-col-team-qsn {
    border: 1px solid rgba(28, 39, 82, 0.2);
    background: #fff;
    padding: 15px;
}
.img-pp-team {
    width: 100%;
    height: 260px;
}
.title-pp-team-qsn {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    font-size: 19.796px;
    line-height: 25px;
    text-align: center;
    color: #1c2752;
}
.text-pp-team-qsn {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-size: 14.2531px;
    line-height: 17px;
    text-align: center;
    color: #7e7e7e;
}
.footer-navigation-link {
    display: flex;
    justify-content: center;
}
.media-body .laravel-embed__responsive-wrapper {
    padding-bottom: 0 !important;
}
#carouselTestimonialCard .carousel-indicators .active {
    background: #FFFFFF !important;
}
.form-errors-container,
.frontend-success-message,
.frontend-danger-message {
    position: absolute;
    z-index: 999;
    top: 25%;
    width: 100%;
}
.frontend-alert-danger{
    position: relative;
    border-radius: 0 !important;
    margin-bottom: 0;
}
.btn-close {
    position: absolute;
    right: 2%;
    opacity: 1;
}
.frontend-form-errors-ul {
    margin-bottom: 0 !important;
    text-align: center;
    list-style: none;
    font-weight: 600;
}
.frontend-success-message,
.frontend-danger-message{
    text-align: center;
    font-weight: 600;
}
.close {
    position: absolute;
    right: 25px;
    background: red;
    border-radius: 50%;
    color: #ffffff;
    font-weight: 800;
    height: 25px;
    width: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.img-banner-app-page {
    width: 100%;
}
.content-list-year-about-item:before {
    content: "";
    width: 5px;
    height: 120%;
    position: absolute;
    background: #FFFFFF;
    left: -3.5%;
}
.content-list-year-about-item {
    position: relative;
}
.content-list-year-about-item:after {
    content: "";
    width: 10px;
    height: 10px;
    background: #1c4192;
    position: absolute;
    border-radius: 50%;
    left: -4%;
    top: 44%;
}
.article-meta-infos-container {
    display: flex;
    justify-content: space-between;
    margin-top: 2%;
    background: #ececec;
    padding: 15px;
}
.article-author-container span {
    font-weight: 600;
}
.view-count-container {
    font-weight: 700;
}
.logo-header {
    width: 100%;
}
.logo-app-footer {
    width: 50%;
}
.others-items-header {
    width: 100%;
}
.navbar-brand {
    width: 20%;
}
.app-navbar {
    gap: 15px;
}