/* MOBILE */
@media only screen and (max-width: 768px) {
    body {
        overflow-x: hidden;
    }
    .video-home video {
        height: 560px;
        object-fit: fill;
        margin-top: 0px;
    }
    .item-service img {
        width: auto;
    }
    .row-two-column {
        flex-direction: column;
        padding: 0 10px;
    }
    .row-four-column,
    .row-five-column {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .bg-footer .row-four-column {
        align-items: start;
    }
    .row-nos-valeurs .min-h-345:nth-child(2),
    .row-nos-valeurs .min-h-345:nth-child(3),
    .row-nos-valeurs .min-h-345:nth-child(4) {
        margin-top: 0;
    }
    .bg-banner-blue {
        height: 900px;
        background-size: cover;
    }
    .min-h-345 {
        height: auto;
        width: 100%;
    }
    .min-h-345 img {
        width: auto;
    }
    header .toggle-canvas {
        right: 5px;
    }
    .slick-next {
        right: 0;
    }
    .slogan {
        font-size: 28px;
    }
    .slick-next:before {
        display: none;
    }
    .menu-off-canvas {
        width: 100%;
    }
    .row-left {
        padding: 10px !important;
    }

    .listing-job {
        display: flex;
        flex-direction: column;
    }
    .ifac-bg {
        height: auto;
        background-position: center;
        background-size: cover;
    }
    .ifac-curtain {
        height: 100vh;
        row-gap: 0;
        padding-bottom: 80px;
    }
    .ifac-title h2 {
        font-size: 42px;
    }
    .ifac-hd {
        margin-left: 0;
    }
    .ifac-logo img {
        width: 50%;
    }
    header .logo {
        height: 35px;
    }
    .blue-square {
        display: flex;
        flex-direction: column;
        row-gap: 30px;
    }
    .line-title {
        display: none;
    }
    .row-title {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .row-title h2 {
        font-size: 24px;
    }
    .tab2 {
        flex-direction: column;
    }
    .iot-plateform-desc {
        width: 100%;
        padding-left: 20px;
    }
    .iot-plateform-desc p,
    .iot-plateform-desc span {
        font-size: 24px;
    }
    .iot-plateform {
        width: 100%;
        background-size: cover;
        height: 50vw;
    }
    .outer-img {
        display: none;
    }
    .ifac-plateform p {
        font-size: 28px;
    }
    .ifac-plateform span {
        font-size: 24px;
    }
    .plateform-img {
        display: none;
    }
    .title-desc p {
        font-size: 15px;
        text-align: center;
        line-height: 25px;
        font-weight: 300;
    }
    .pc-tab {
        display: none;
    }
    .mb-tab {
        display: block;
    }
    .mobile-tablinks {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-radius: 100px;
        border: 2px solid #fe431b;
        padding: 5px 10px 5px 15px;
        color: #0251ab;
        margin: 5px 0px;
        font-weight: 700;
    }
    .mobile-tabcontent,
    .mobile-tabcontent2 {
        margin: 30px 0px;
        display: none;
    }
    .content-column,
    .img-column {
        width: 100%;
    }
    .img-grid {
        display: flex;
        flex-direction: column;
        padding: 0px;
    }
    .mobile-tablinks2 {
        margin: 20px 0px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 5px 10px 5px 15px;
        border-radius: 100px;
        border: 2px solid #0251ab;
        color: #0251ab;
        font-weight: 700;
        margin: 5px 0px;
    }
    .bg-footer .row-three-column {
        flex-direction: column;
        display: flex;
        align-items: center;
        row-gap: 10px;
    }
    .bg-footer .logo-footer {
        max-width: 100%;
    }
    .lp-title h2 {
        font-size: 48px;
    }
    .lp-title p {
        font-size: 24px;
    }
    .row-img,
    .row-content {
        width: 100%;
        padding: 10px;
    }
    .lp-row {
        flex-direction: column;
    }
    .lp-row-rv {
        flex-direction: column-reverse;
        margin-top: 0;
    }
    .hd-title,
    .logo {
        position: unset;
        margin-top: 0px;
    }
    .hd-title img {
        max-width: 150px;
        width: 100%;
    }
    .landingpage-img {
        display: none;
    }
    .landingpage-img img {
        height: 150px;
    }
    .landingpage-logo {
        justify-content: space-between;
    }
    .big-img {
        margin: 30px 0px;
    }
    .landingpage {
        padding: 0;
    }
    .safir-content .lp-row {
        flex-direction: column-reverse;
        margin: 0;
    }
    .safir-hd-title p {
        position: unset;
        font-size: 28px;
        text-align: center;
        line-height: 1.5em;
    }
    .safir-hd-title b {
        font-size: 38px;
    }
    .safir-hd-title p span {
        margin: auto;
        max-width: 325px;
        display: block;
    }
    .safir-hd-title p span b {
        font-size: 50px;
    }
    .safir-hd .hd-title {
        position: absolute;
        top: 0;
    }
    .safir-hd .hd-title,
    .safir-hd .logo {
        margin-top: 0;
    }
    .safir-hd-title {
        margin-top: 50px;
        position: unset;
    }
    .safir-hd {
        display: unset;
    }
    .slick-carousel-3 .slick-dots {
        width: 90%;
    }
    .bg-footer {
        padding-left: 10px;
        padding-right: 10px;
    }
    .contact-form {
        padding: 10px;
    }
    .contact {
        flex-direction: column;
    }
    .captcha-area {
        width: 100%;
    }
    .btn-area button {
        width: 100%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1170px) {
    h2 {
        font-size: 36px;
    }
    body {
        overflow-x: hidden;
    }
    .video-home video {
        height: auto;
    }
    header .toggle-canvas {
        right: 30px;
    }

    .bg-banner-blue .row-four-column {
        display: grid;
    }
    .row-four-column.gap-40 {
        gap: 0;
    }
    .row-nos-valeurs .min-h-345:nth-child(2),
    .row-nos-valeurs .min-h-345:nth-child(3),
    .row-nos-valeurs .min-h-345:nth-child(4) {
        margin-top: 0;
    }
    .bg-blue-gradient img {
        width: auto;
    }
    .row-nos-valeurs {
        grid-template-columns: auto auto;
    }
    .slick-next {
        right: 12px;
    }
    .bg-footer .row-four-column {
        flex-direction: row;
        justify-content: space-between;
    }
    .slick-next:before,
    .slick-prev:before {
        display: none;
    }
    .bg-service.ia {
        right: 10vw;
    }
    .bg-service.it {
        left: 10vw;
    }
    .listing-job {
        grid-template-columns: 1fr 1fr;
    }

    .ifac-logo img {
        margin-right: 80px;
    }
    .ifac-curtain {
        row-gap: 50px;
    }
    .ifac-open {
        margin-top: 100px;
    }
    .ifac-bg {
        background-size: cover;
        background-position: center;
    }
    .blue-square {
        column-gap: 10px;
        /* grid-template-columns: auto auto auto; */
        justify-content: space-between;
    }
    .blue-item img {
        width: auto;
    }
    .plateform-img {
        display: none;
    }
    .ifac-plateform span {
        display: block;
        max-width: 500px;
        margin: auto;
    }
    .iot-plateform {
        height: auto;
        background-size: cover;
        background-position: center;
        padding: 30px 50px 20px 20px;
    }
    .iot-plateform-desc p {
        line-height: 1.5em;
        font-size: 30px;
    }
    .iot-plateform-desc span {
        font-size: 24px;
    }
    .pc-tab {
        display: none;
    }
    .mb-tab {
        display: block;
    }
    .img-grid {
        grid-template-columns: 32% 32% 32%;
        column-gap: 10px;
    }
    .m-180 {
        margin: 80px 0px !important;
    }
    .content-column,
    .img-column {
        width: 100%;
    }
    .mobile-tablinks {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-radius: 100px;
        border: 2px solid #fe431b;
        padding: 5px 10px 5px 15px;
        color: #0251ab;
        margin: 5px 0px;
        font-weight: 700;
    }
    .mobile-tablinks2 {
        margin: 20px 0px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 5px 10px 5px 15px;
        border-radius: 100px;
        border: 2px solid #0251ab;
        color: #0251ab;
        font-weight: 700;
        margin: 5px 0px;
    }
    .mobile-tabcontent,
    .mobile-tabcontent2 {
        margin: 30px 0px;
        display: none;
    }
    .lp-row,
    .lp-row-rv {
        align-items: start;
    }
    .safir-hd-title p {
        left: 5%;
        top: 30%;
    }

    .form-input,
    .btn-area button {
        width: 433px;
    }
    .captcha-area {
        width: 304px;
    }
    .min-h-345 {
        height: auto;
    }
    .row-it {
        grid-template-columns: auto auto;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1439px) {
    .bg-service.it {
        left: 180px;
    }
    .bg-service.ia {
        right: 180px;
    }
    .ifac-curtain {
        row-gap: 110px;
    }
    .ifac-open {
        margin-top: 100px;
    }
    .ifac-bg {
        background-size: cover;
        background-position: center;
    }
    .ifac-plateform span {
        max-width: 500px;
        display: block;
        margin: auto;
    }
    .plateform-img {
        top: 105px;
    }
    .iot-plateform {
        height: 645px;
        background-size: cover;
    }
    .img-grid {
        column-gap: 10px;
    }
    .img-grid-item img {
        width: 100%;
    }
    .tab {
        justify-content: center;
    }
}
@media only screen and (max-width: 1440px) {
    #lottie-container {
        transform: scale(1);
        margin-top: 90px;
        text-align: center;
    }
    .download-link {
        font-size: 14px;
    }
}

@media only screen and (max-width: 1280px) {
    .toggle-chabot {
        bottom: 90px;
    }
}
@media only screen and (max-width: 768px) {
    #lottie-container {
        display: none;
    }
    .slogan {
        line-height: normal;
    }
    .video-home video {
        height: 75vw;
    }
    .row-two-column {
        flex-direction: column;
    }
    .p-50 {
        padding: 10px;
    }
    h2 {
        font-size: 24px;
        text-align: center;
    }
    .text-grey {
        font-size: 24px;
    }
    .nous-marques {
        width: 100%;
    }
    .bg-service {
        width: 50vw;
        height: 50vw;
    }
    .bg-service h2 {
        font-size: 24px;
    }
    .bg-service.ia,
    .bg-service.it,
    .bg-service.be {
        position: unset;
    }
    .bg-service.be {
        margin-top: 0;
    }
    .content-service {
        gap: 22vw;
    }
    .bg-service img {
        width: 25vw;
    }
    .translate-pc {
        display: none;
    }
    .area-mobile {
        display: block;
    }
    .area-pc {
        display: none;
    }
    .chatbot-html {
        bottom: 80px;
        right: 0;
        width: 100%;
    }
    .chatbot-html iframe {
        width: 100%;
    }
    .counter-number,
    .counter-suffix {
        margin-bottom: 10px;
        margin-top: 20px;
        line-height: 1.4;
    }
    .list-be {
        flex-direction: column;
    }
    .list-be .img-carousel img {
        height: 300px;
        object-fit: cover;
    }
    .img-carousel .title-carousel {
        font-size: 24px;
    }
    .contact-info {
        max-width: unset;
        height: auto;
    }
    .row-left,
    .row-right {
        width: 100%;
    }
    .logo-flag {
        width: 35px !important;
        height: auto;
    }
    .safir-hd-title {
        display: block;
    }
    .listing-job img {
        height: auto;
    }
    .listing-job div.content-new {
        padding: 15px;
    }
    .img-be-title {
        display: none;
    }
    .img-carousel .back-content {
        display: grid;
        align-content: center;
        background-color: #22252b6e !important;
    }
    .img-carousel .img-bg {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
        object-fit: contain;
    }
    .mw-50 {
        width: unset;
        max-width: 100%;
    }
    .lang-hoop img {
        width: 30px !important;
    }
    .lang-hoop {
        position: unset;
    }
}
