/*********************************/
/************* Font **************/
/*********************************/

/* Tablet Gothic Regular */
.tablet-regular {
    font-family: tablet-gothic, sans-serif !important;
    font-weight: 400 !important;;
    font-style: normal !important;;
}

/* Tablet Gothic Bold */
.tablet-bold {
    /* Tablet gothic bold */
    font-family: tablet-gothic, sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
}

/* Sofia Pro Regular */
.sofia-regular, footer ul li {
    font-family: sofia-pro, sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
}

/* Sofia Pro Medium */
.sofia-medium {
    font-family: sofia-pro, sans-serif !important;
    font-weight: 500 !important;
    font-style: normal !important;
}

/* Sofia Pro Bold */
.sofia-bold, .menu_mm li a, .main_nav li a {
    font-family: sofia-pro, sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
}

/*********************************/
/********* Common style **********/
/*********************************/

.card-body h3 {
    margin-bottom: 0 !important;
    color: #000650 !important;
}

p {
    line-height: 1.56 !important;
}

/* Center dot for mobile menu */
.menu ul li::after {
    top: calc(50% + 2.5px);
}

/* Titre h1 page d'accueil */
.main-title {
    font-size: 64px;
}

.main-title-span {
    color: white;
    font-size: 28px
}

p {
    font-size: 18px !important;
}

/* Offsetting html anchor */
.anchor, .anchor-map {
    display: block;
    position: relative;
    visibility: hidden;
}

.anchor {
    top: -150px;
}

/* Vertically center menu */
.main_nav ul {
    margin-top: 5px;
}

.main_nav ul li a {
    font-size: 18px !important;
}

.main_nav ul li.active a {
    color: #135EAB !important;
}

.clients_slider_container {
    /*touch-action: auto;*/
}

ul.menu_mm li.menu_mm a {
    font-size: 20px !important;
}

.home_background {
    background-position-y: top !important;
}

.footer_col_title {
    margin-bottom: 8px !important;
    margin-top: 10px !important;
}

.footer_col_title a {
    color: #000650;
}

.footer_col_title a:hover {
    color: #135EAB;
}

.button, .button a {
    transition: 0.3s !important;
}

.owl-company .owl-stage, .owl-company.owl-carousel {
    display: flex;
    align-items: center;
}


ul.menu_mm li.menu_mm a {
    color: #000650 !important;
}

ul.menu_mm li.menu_mm.active a, ul.menu_mm li.menu_mm:hover a {
    color: #135EAB !important;
}

/*********************************/
/************* Team **************/
/*********************************/

.team_container {
    height: auto;
    padding-bottom: 15px;
}

.team_title {
    margin-bottom: 115px;
}

.team_member_image {
    width: 100%;
    height: 263px;
}

.team_member_image img {
    position: relative;
    top: auto;
    left: auto;
}

.team_member_content {
    margin-top: 20px;
    padding-bottom: 15px;
}

/*************************************************/
/************* Device image reverse **************/
/*************************************************/

.device_image_background_reverse {
    right: 21px;
}

.device_image_container_reverse {
    position: absolute;
    right: 30px;
}

/*******************************************/
/******* Responsive Background-image *******/
/*******************************************/

@media only screen and (max-width: 9999px) {
    .home_background {
        background-position-y: center !important;
    }
}

@media only screen and (max-width: 2000px) {
    .home_background {
        background-position-y: calc(0% - 200px) !important;
    }
}

@media only screen and (max-width: 1600px) {
    .home_background {
        background-position-y: calc(0% - 100px) !important;
    }
}

@media only screen and (max-width: 1200px) {
    .home_background {
        background-position: top !important;
    }
    .device_image_container_reverse {
        height: 80% !important;
    }
}

/*********************************/
/******* Common Responsive *******/
/*********************************/

@media only screen and (max-width: 991px) {
    .footer_intro {
        margin-left: -5px;
    }

    .footer_col ul li {
        margin-bottom: 1px;
    }

    .team_container {
        min-height: auto !important;
    }

    .contact_row {
        margin-top: 80px;
    }

    .form {
        padding-bottom: 50px;
    }

    .footer {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .footer_logo {
        margin-bottom: 15px;
    }

    .main-title {
        font-size: 48px;
    }

    .main-title-span {
        font-size: 22px;
    }

    .logo #logo {
        height: 120px !important;
    }

    #map_svg_computer {
        display: none !important;
    }

    #map_svg_mobile {
        display: block !important;
    }
    .device_image_reverse {
        margin-top: 50px;
        height: auto;
    }
    .device_image_container_reverse {
        position: relative;
        right: 0;
    }
    .custom-device-order {
        order: 2;
    }
}

@media only screen and (max-width: 767px) {
    h2 {
        font-size: 38px !important;
    }

    .footer_logo {
        padding-left: 0 !important;
    }

    .main-home {
        height: 272px;
    }

    .home-main-title {
        margin-top: 100px;
    }
}

@media only screen and (max-width: 575px) {
    .container {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }

    .services_item_inner {
        box-shadow: none;
        padding-left: 30px;
        padding-right: 30px;
        width: 100%;
    }

    .owl-stage-outer {
        padding-bottom: 20px !important;
    }

    .logo {
        padding-left: 30px;
    }

    .services_item_inner {
        align-items: start;
    }

    .service_item_content {
        margin-top: 30px;
    }

    .services_slider_container {
        margin-top: 30px;
    }
    .device_image_reverse {
        margin-top: 0;
    }
}

/* Add padding for mobile view */
@media only screen and (max-width: 539px) {
    .main-title-span {
        font-size: 16px !important;
    }

    .clients_slider {
        height: 120px !important;
    }

    .footer_logo {
        padding-left: 0 !important;
    }

    .v_slider .slick-dots {
        flex-direction: row !important;
        top: 75% !important;
        left: 0 !important;
        width: 130px;
    }

    .v_slider_item {
        min-height: 220px !important;
    }
}

@media only screen and (max-width: 480px) {
    h2 {
        font-size: 24px !important;
    }

    .team_member_content {
        padding-left: 30px;
        padding-right: 30px;
    }
}
