@import url("https://use.typekit.net/yaf0jgb.css");

@font-face {
    font-family: 'gothambold';
    src: url('../font/gotham-bold-webfont.eot');
    src: url('../font/gotham-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/gotham-bold-webfont.woff2') format('woff2'),
         url('../font/gotham-bold-webfont.woff') format('woff'),
         url('../font/gotham-bold-webfont.ttf') format('truetype'),
         url('../font/gotham-bold-webfont.svg#gothambold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothambook';
    src: url('../font/gotham-book-webfont.eot');
    src: url('../font/gotham-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/gotham-book-webfont.woff2') format('woff2'),
         url('../font/gotham-book-webfont.woff') format('woff'),
         url('../font/gotham-book-webfont.ttf') format('truetype'),
         url('../font/gotham-book-webfont.svg#gothambook') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothamlight';
    src: url('../font/gotham-light-webfont.eot');
    src: url('../font/gotham-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/gotham-light-webfont.woff2') format('woff2'),
         url('../font/gotham-light-webfont.woff') format('woff'),
         url('../font/gotham-light-webfont.ttf') format('truetype'),
         url('../font/gotham-light-webfont.svg#gothamlight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gothammedium';
    src: url('../font/gotham-medium-webfont.eot');
    src: url('../font/gotham-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/gotham-medium-webfont.woff2') format('woff2'),
         url('../font/gotham-medium-webfont.woff') format('woff'),
         url('../font/gotham-medium-webfont.ttf') format('truetype'),
         url('../font/gotham-medium-webfont.svg#gothammedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

:root {
    --bs-primary-rgb: 88,146,127;
    --bs-secondary-rgb: 229,234,230;
    --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    --header-height: 220px;
    --font-size-h1: 50px;
    --font-size-h1-mobile: 45px;
    --font-size-h2: 40px;
    --font-size-h2-mobile: 35px;
    --patient-zone-color: #A6B1E7;
    --professional-zone-color: #D3E458;
    --cercle-radius: 180px;
    --cercle-adsolute-radius: 170px;
    --cercle-yellow-adsolute-radius: 195px;
    --cercle-radius-mobile: 160px;
    --bs-body-font-family-bold: 'gothambold', sans-serif;
    --bs-body-font-family-medium: 'gothammedium', sans-serif;
    --bs-body-font-family-light: 'gothamlight', sans-serif;
    --bs-body-lettre-spacing: 0.65px;
    --bs-link-color: #161615;
    --bs-link-hover-color: #58927F;
}

body {
	--bs-body-font-family: 'gothambook', sans-serif;
    --bs-body-font-size: 18px;
}

.fw-bold-font {
    font-family: var(--bs-body-font-family-bold);
}

.fw-medium-font {
    font-family: var(--bs-body-font-family-medium);
}

h1, h2, h3, h4, h5, h6 {
    font-family: "fields-display", sans-serif;
}

h1 {
    font-size: var(--font-size-h1);
}

h2 {
    font-size: var(--font-size-h2);
}

a:hover {
    font-family: var(--bs-body-font-family-bold);
}

.btn-primary {
    --bs-btn-font-size: 13px;
    --bs-btn-color: white;
    --bs-btn-bg: #58927F;
    --bs-btn-border-color: #58927F;
    --bs-btn-border-radius: 31px;
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: #82ac9e;
    --bs-btn-hover-border-color: #82ac9e;
    --bs-btn-focus-shadow-rgb: #82ac9e;
    --bs-btn-active-color: white;
    --bs-btn-active-bg: #82ac9e;
    --bs-btn-active-border-color: #32494e;
    font-family: var(--bs-body-font-family-bold);
    display: inline-flex;
    align-items: center;
    padding: 0 29px;
    height: 48px;
    text-transform: uppercase;
    min-width: 168px;
    justify-content: center;
    letter-spacing: var(--bs-body-lettre-spacing);
}

.navbar-nav {
    --bs-nav-link-color: black;
}

.border-primary {
    --bs-border-opacity: 1;
    border-color: rgba(64, 113, 120, var(--bs-border-opacity)) !important;
}

.accordion {
    --bs-accordion-color: #161615;
    --bs-accordion-border-color: #407178;
    --bs-accordion-bg: #E5EAE6;
    --bs-accordion-btn-focus-border-color: transparent;
    --bs-accordion-active-color: #161615;
    --bs-accordion-active-bg: #E5EAE6;
    --bs-accordion-btn-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-lg" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8 2a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 2Z"/></svg>');
    --bs-accordion-btn-active-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-dash-lg" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M2 8a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11A.5.5 0 0 1 2 8Z"/></svg>');
    --bs-accordion-btn-icon-width: 15px;
}

.card {
    --bs-card-border-radius: 0;
    --bs-card-bg: #E5EAE6;
    --bs-card-border-color: #E5EAE6;
}

.accordion-button {
    font-size: var(--bs-body-font-size);
    column-gap: 20px;
}

.accordion-button::before {
    margin-left: 0!important;
    flex-shrink: 0;
    width: var(--bs-accordion-btn-icon-width);
    height: var(--bs-accordion-btn-icon-width);
    margin-left: auto;
    content: "";
    background-image: var(--bs-accordion-btn-icon);
    background-repeat: no-repeat;
    background-size: var(--bs-accordion-btn-icon-width);
    transition: var(--bs-accordion-btn-icon-transition);
}

.accordion-button::after {
    content: none;
}

.accordion-button:focus,
.accordion-button:not(.collapsed) {
    box-shadow: none;
}

.img-logo {
    height: 100%;
    max-height: 60px;
    width: auto;
    object-fit: cover;
}

.img-logo-footer {
    height: 100%;
    max-height: 60px;
    width: auto;
    object-fit: cover;
}

.main-page-nav li {
    flex: 0 0 47%;
}

.main-page-nav .main-page-item {
    font-family: var(--bs-body-font-family-medium);
    padding: 45px 0;
    font-size: 13px;
    color: black;
}

.main-page-nav .main-page-item {
    letter-spacing: var(--bs-body-lettre-spacing);
}

.main-page-nav .main-page-item:hover,
.main-page-nav .main-page-item-active {
    font-family: var(--bs-body-font-family-bold);
    background-color: white;
}

#mainNav .nav-link:hover:not(.nav-link-icon),
#mainNav .nav-link.active,
.fixed-top .nav-link:hover:not(.nav-link-icon),
.fixed-top .nav-link.active {
    font-family: var(--bs-body-font-family-bold);
    background-color: #C0D1C7;
}

.nav-link {
    font-family: var(--bs-body-font-family-medium);
    font-size: 13px; 
    letter-spacing: var(--bs-body-lettre-spacing);
}

.mobile-menu .nav-link {
    font-size: var(--bs-body-font-size);
    padding-top: 10px;
    padding-bottom: 10px;
}

.p-nav-link {
    padding: 14px 18px !important;
}

.nav-main-mobile {
    padding: 35px 0;
    column-gap: 50px;
}

.navbar-toggler-btn div {
    width: 23px;
    height: 3px;
    background-color: #407178;
    margin: 7px 0;
}

.navbar-toggler-btn div:first-child {
    margin-top: 0;
}

.navbar-toggler-btn div:last-child {
    margin-bottom: 0;
}

.mobile-menu-header {
    padding-top: 11px;
    padding-bottom: 30px;
}

.btn-close {
    filter: invert(42%) sepia(11%) saturate(1433%) hue-rotate(139deg) brightness(91%) contrast(87%);
    opacity: 1;
}

.icon-svg:hover {
    opacity: 0.7;
}

.offcanvas.offcanvas-end {
    border-left: none;
}

.navbar-toggler, .navbar-toggler:focus {
    border: none;
    box-shadow: none;
}

.onscroll-menu {
    box-shadow: 0px 3px 3px #00000029;
}

.onscroll-menu .navbar-brand img {
    max-height: 24px;
}

.onscroll-menu .p-nav-link {
    padding: 21.25px 23.5px !important;
}

.onscroll-menu nav {
    min-height: 59px;
}

.object-fit-cover {
    object-fit: cover;
}

.object-position-30 {
    object-position: 30%;
}

.border-top-img {
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    aspect-ratio: 1/1;
    max-height: 600px;
}

.border-right-img {
    border-top-right-radius: 50%;
    border-bottom-right-radius: 50%;
    aspect-ratio: 1/1;
    max-height: 450px;
    max-width: 530px;
}

.border-left-img {
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    aspect-ratio: 1/1;
    max-height: 450px;
    max-width: 530px;
}

.mb-4-5 {
    margin-bottom: 2rem !important;
}

.z-0 {
    z-index: 0;
}

.z-1 {
    z-index: 1;
}

.cercle-after::after {
    content: '';
    display: block;
    width: var(--cercle-radius);
    height: var(--cercle-radius);
    position: absolute;
    border-radius: 50%;
}

.cercle-after-purple::after,
.cercle-before-purple::before {
    background-color: var(--patient-zone-color);
}

.cercle-after-yellow::after,
.cercle-before-yellow::before {
    background-color: var(--professional-zone-color);
}

.img-cercle-after::after {
    bottom: 15%;
    right: calc(var(--cercle-radius) / -2);
}

.img-half-cercle-after::after {
    left: calc(var(--cercle-radius) / -2);
    bottom: calc(var(--cercle-radius) / -2);
}

.cercle-purple-absolute {
    width: var(--cercle-adsolute-radius);
    height: var(--cercle-adsolute-radius);
    position: absolute;
    border-radius: 50%;
    background-color: var(--patient-zone-color);
    left: calc(50% + 3rem);
    bottom: calc(var(--cercle-adsolute-radius) / -2);
}

.cercle-yellow-absolute {
    width: var(--cercle-yellow-adsolute-radius);
    height: var(--cercle-yellow-adsolute-radius);
    position: absolute;
    border-radius: 50%;
    background-color: var(--professional-zone-color);
    left: calc((var(--cercle-yellow-adsolute-radius) * -1) - 82px);
    bottom: calc((var(--cercle-yellow-adsolute-radius) / -4) - 100px);
}

.cercle-yellow-absolute h3 {
    font-size: 26px;
}

.overflow-x-hidden {
    overflow-x: hidden;
}

.flex-gap-fabricant {
    column-gap: 55px;
    row-gap: 42px;
}

.fs-7 {
    font-size: 14px !important;
}

.review-slider .carousel-cell {
    width: 37%;
    margin-right: 80px;
}

.review-slider .carousel-cell::before {
    content: '';
    display: block;
    width: 45px;
    height: 1px;
    background-color: #161615;
}

.review-slider .carousel-cell .review-description::before,
.review-slider .carousel-cell .review-description-yellow::before {
    content: '';
    width: 100%;
    height: 97%;
    display: block;
    background: #FAF8F5;
    position: absolute;
    margin-top: 0;
    margin-left: 0;
    z-index: -1;
}

.review-slider .flickity-page-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: -50px;
    width: 90%;
}

.review-slider .flickity-page-dots .dot.is-selected {
    opacity: 1;
    height: 8px;
    border-radius: 5px !important;
    background: #58927F;
}

.review-slider .flickity-page-dots .dot {
    flex: 1;
    height: 8px;
    margin: 0;
    border-radius: 0;
    background: #E5EAE6;
    opacity: 1;
}

.review-slider .flickity-page-dots .dot:last-child {
    border-radius: 0 5px 5px 0;
}

.review-slider .flickity-page-dots .dot:first-child {
    border-radius: 5px 0 0 5px;
}

/* Default slide */
.center-slider .slick-slide{
    height: 200px; 
    margin: 0 15px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: scale(0.7);
    transition: all 0.4s ease-in-out;
}

.center-slider .slick-slide,
.center-slider .slick-slide[aria-hidden="true"]:not(.slick-cloned) ~ .slick-cloned[aria-hidden="true"] {
    transform: scale(0.7, 0.7);
    transition: all 0.4s ease-in-out;
}

.ul-with-marker li {
    list-style-position: inside;
}

.ul-with-marker li::marker {
    content: '•';
    font-size: 23px;
    color: #A6B1E7;
}

.ul-yellow li::marker {
    color: #58927F;
}

.absolute-bottom {
    bottom: 0;
}

.naissancediv {
    column-gap: 10px;  
}

.form-select {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-caret-down-fill" viewBox="0 0 16 16"><path d="M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z"/></svg>');
    background-size: 16px;
}

.form-control, .form-select {
    line-height: 2;
    border-color: #58927F;
}

form .form-control:focus {
    box-shadow: none;
}

form .form-control.error:focus {
    border-color: red;
}

.error {
    color: red;
    border-color: red;
}

.add-btn {
    background-color: transparent;
    border: none;
    color: #161615;
}

.add-reference-i {
    background-color: #E5EAE6;
    border-radius: 50%;
    width: 21px;
    height: 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.phone-fixed {
    position: fixed;
    bottom: 35px;
    right: 35px;
}

div[data-component="name"] {
    display: none;
}

.planifier-modal {
    height: 670px;
}

.meeting-iframe-div {
    height: 635px;
}

.planifier-modal iframe {
    height: 100%;
}

.myspinner {
    display: none;
}

.myspinner.show {
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0%;
    left: 0;
    right: 0;
    background: rgb(255 255 255 / 48%);
    z-index: 99999999;
}

@media (max-width: 991px) {

    .w-mobile-100 {
        width: 100%;
    }
    
    .navbar-brand {
        flex: 1;
    }

    .img-logo {
        height: auto;
        width: 100%;
        max-width: 300px;
    }
    
    .ps-img {
        padding-left: 0;
    }

    .mt-sm-n2 {
        margin-top: -2rem;
    }

    .pe-sm-5 {
        padding-right: 2.5rem !important;
    }

    .w-sm-100:not(.btn-primary) {
        width: 100%;
    }

    .img-cercle-after::after {
        content: none;
    }

    .img-half-cercle-after::after {
        content: none;
    }

    .offcanvas {
        overflow: auto;
    }

    .offcanvas.half-cercle-after-mobile::after {
        position: fixed;
    }

    .half-cercle-after-mobile::after, .half-cercle-before-mobile::before {
        content: '';
        display: block;
        width: var(--cercle-radius-mobile);
        height: var(--cercle-radius-mobile);
        position: absolute;
        border-radius: 50%;
    }

    .half-cercle-after-mobile-right-bottom::after {
        bottom: calc(var(--cercle-radius-mobile) / -2);
        right: calc(var(--cercle-radius-mobile) / -2);
    }

    .half-cercle-after-mobile-left-bottom::after {
        bottom: calc(var(--cercle-radius-mobile) / -2);
        left: calc(var(--cercle-radius-mobile) / -2);
    }

    .half-cercle-before-mobile-right-top::before {
        top: calc(var(--cercle-radius-mobile) / -2);
        right: calc(var(--cercle-radius-mobile) / -2);
    }

    .half-cercle-before-mobile-left-top::before {
        top: calc(var(--cercle-radius-mobile) / -2);
        left: calc(var(--cercle-radius-mobile) / -2);
    }

    .half-cercle-before-mobile-left-top-review::before {
        top: 36px;
        left: calc(var(--cercle-radius-mobile) / -2);
    }

    .half-cercle-before-mobile-right-top-review::before {
        top: 85px;
        right: calc(var(--cercle-radius-mobile) / -2);
    }

    .half-cercle-before-mobile-top-center::before {
        top: calc(var(--cercle-radius-mobile) / -2);
        left: calc(50% - (var(--cercle-radius-mobile) / 2));
    }

    .cercle-purple-absolute {
        left: calc(50% - (var(--cercle-adsolute-radius) / 2));
        bottom: -140px;
    }

    .cercle-yellow-absolute {
        width: var(--cercle-radius);
        height: var(--cercle-radius);
        left: calc(50% - (var(--cercle-radius) / 2));
        bottom: calc((var(--cercle-radius) / -2) - 121px);
    }

    .cercle-yellow-absolute h3 {
        font-size: 22px;
    }

    .border-bottom-mobile-none {
        border-bottom: none !important;
    }

    .main-page-nav .main-page-item {
        padding: 15px 0;
    }

    .padding-container-right, 
    .padding-container-left {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }

    .pt-sm-62 {
        padding-top: 62px;
    }

    .py-sm-73 {
        padding-top: 73px !important;
        padding-bottom: 73px;
    }

    .pt-sm-73 {
        padding-top: 73px;
    }

    .pb-sm-100 {
        padding-bottom: 100px;
    }

    .review-slider .carousel-cell {
        width: 80%;
    }

    .border-bottom-sm {
        border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    }

    .pt-sm-185 {
        padding-top: 185px;
    }

    .text-center-mobile {
        text-align: center;
    }

    .text-left-mobile {
        text-align: left !important;
    }

    .border-right-img {
        width: 90%;
    }
    
    .border-left-img {
        width: 90%;
    }
        
    .main-page-nav li {
        flex: 1;
    }

}

@media (max-width: 400px) {
    
    .main-page-nav .main-page-item {
        font-size: 10px !important;
    }
    
}

@media (min-width: 600px) {
    
    /* Active center slide (You can change anything here for cenetr slide)*/
    .center-slider .slick-center,
    .center-slider .slick-slide[aria-hidden="true"]:not([tabindex="-1"]) + .slick-cloned[aria-hidden="true"] {
        transform: scale(1.1);
    }

    .center-slider .slick-current.slick-active{
        transform: scale(1.1);
    }
    
}

@media (max-width: 575px) {

    .container {
        max-width: 90%;
    }

    .padding-container-right,
    .padding-container-left {
        max-width: 90%;
        padding-right: calc(var(--bs-gutter-x) * .5) !important;
        padding-left: calc(var(--bs-gutter-x) * .5) !important;
    }

    .container-mobile-left {
        padding-left: 10% !important;
    }

    .main-page-nav .main-page-item {
        font-size: 11px;
    }

    .border-right-img {
        max-height: 355px;
    }
    
    .border-left-img {
        max-height: 355px;
    }

}

@media (min-width: 576px) {

    .padding-container-right {
        padding-right: 0 !important;
        max-width: 540px !important;
    }

    .padding-container-left {
        padding-left: 0 !important;
        max-width: 540px !important;
    }

    .container-mobile-left {
        padding-left: calc((100% - 540px)/2) !important;
    }

}

@media (max-width: 768px) {
    
    .btn-primary.w-sm-100 {
        width: 100%;
    }
    
}


@media (min-width: 768px) {

    .padding-container-right {
        padding-right: 0 !important;
        max-width: 720px !important;
    }

    .padding-container-left {
        padding-left: 0 !important;
        max-width: 720px !important;
    }

    .container-mobile-left {
        padding-left: calc((100% - 720px)/2) !important;
    }

}

@media (min-width: 992px) {
 
    .w-lg-85 {
        width: 85%;
    }

    .w-lg-60 {
        width: 60%;
    }

    .border-top-lg-none {
        border-top: none !important;
    }

    .border-end-lg {
        border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
    }

    .padding-container-right {
        padding-right: calc((100% - 960px)/2) !important;
        max-width: none !important;
    }

    .padding-container-left {
        padding-left: calc((100% - 960px)/2) !important;
        max-width: none !important;
    }

    .container-mobile-left {
        padding-left: 0 !important;
        max-width: none !important;
    }
 
    .py-lg-140 {
        padding-top: 140px;
        padding-bottom: 140px;
    }

    .py-lg-100 {
        padding-top: 100px !important;
        padding-bottom: 100px !important;
    }

    .py-lg-64 {
        padding-top: 64px;
        padding-bottom: 64px;
    }

    .half-cercle-after-lg::after, .half-cercle-before-lg::before {
        content: '';
        display: block;
        width: var(--cercle-radius);
        height: var(--cercle-radius);
        position: absolute;
        border-radius: 50%;
    }

    .half-cercle-after-lg-right-bottom::after {
        bottom: calc(var(--cercle-radius) / -2);
        right: calc(var(--cercle-radius) / -2);
    }

    .half-cercle-after-lg-left-bottom::after {
        bottom: calc(var(--cercle-radius) / -2);
        left: calc(var(--cercle-radius) / -2);
    }

    .half-cercle-before-lg-right-top::before {
        top: calc(var(--cercle-radius) / -2);
        right: calc(var(--cercle-radius) / -2);
    }

    .half-cercle-before-lg-left-top::before {
        top: calc(var(--cercle-radius) / -2);
        left: calc(var(--cercle-radius) / -2);
    }

    .cercle-before-lg-left-bottom::before {
        bottom: 0;
        margin-left: calc((var(--cercle-radius) /2)*-1);
    }

    .review-slider .carousel-cell {
        min-height: 230px;
    }

}

@media (min-width: 1200px) {

    .padding-container-right {
        padding-right: calc((100% - 1140px)/2) !important;
    }

    .padding-container-left{
        padding-left: calc((100% - 1140px)/2) !important;
    }

}

@media (max-width: 1200px) {

    h1 {
        font-size: var(--font-size-h1-mobile);
    }
    
    h2 {
        font-size: var(--font-size-h2-mobile);
    }

    .with-success-msg {
        height: 600px;
    }

}

@media (max-width: 991px) {

    .with-success-msg {
        height: 580px;
    }

}

@media (max-width: 473px) {

    .with-success-msg {
        height: 530px;
    }

}

@media (min-width: 1400px) {
    
    .h-100-header {
        height: calc(100vh - var(--header-height));
    }
    
    .padding-container-right {
        padding-right: calc((100% - 1320px)/2) !important;
    }

    .padding-container-left{
        padding-left: calc((100% - 1320px)/2) !important;
    }

}

@media (max-width: 1400px) {

    .onscroll-menu .nav-link {
        font-size: 11px;
    }

}

@media (max-width: 1300px) {

    .onscroll-menu .p-nav-link {
        padding: 21.25px 10px !important;
    }

}

@media (max-width: 1250px) {

    .review-slider .carousel-cell {
        margin-right: 60px;
    }

}

@media (min-width: 992px) and (max-width: 1200px) {

    #navbar-default .nav-link {
        font-size: 11px;
    }
    
}

@media (min-height: 950px) {

    .h-100-header {
        height: auto;
    }

}