/** TYPO & COULEURS -----------------------------------
------------------------------------------------------------*/

footer *,
section * {
    font-family: var(--main-font);
}

header *,
.sub-footer * {
    font-family: var(--main-font-regular);
}

.container p,
.container-fluid p {
    font-family: var(--main-font-regular);
    font-size: 18px;
    line-height: 28px;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.container p:first-child,
.container-fluid p:first-child {
    margin-top: 1.5rem;
}

.container p:last-child,
.container-fluid p:last-child {
    margin-bottom: 1.5rem;
}

.woocommerce-page .container p:first-child,
.woocommerce-page .container-fluid p:first-child {
    margin-top: 0;
}

.container li,
.container-fluid li {
    font-family: var(--main-font-regular);
    font-size: 18px;
    line-height: 28px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

b, strong {
    font-family: var(--main-font);
}

a, a:hover {
    color: var(--main-light);
    text-decoration: none;
}

p.p-intro {
    font-family: var(--main-font-regular);
    font-size: 24px !important;
    line-height: 30px !important;
}

p.p-regular {
    font-family: var(--main-font-regular);
    font-size: 18px !important;
    line-height: 28px !important;
}

p.p-bold {
    font-family: var(--main-font);
    font-size: 24px !important;
    line-height: 30px !important;
}

#contenu_page li::before {
    content: " ";
    position: absolute;
    display: block;
    background: var(--main-color1);
    border-radius: 12px;
    width: 12px;
    height: 12px;
    margin-left: -26px;
    margin-top: 6px;
}

.post-content div {
    font-family: var(--main-font-regular);
}

#contenu_page {
    background-repeat: no-repeat !important;
    background-position: center right;
    background-size: contain !important;
    min-height: 60vh;
}

#contenu_page.test {
    background: linear-gradient(-45deg,
    #E8E8E8 12.5%, #F0F0F0 12.5%, #F0F0F0 25%, #E8E8E8 25%, #E8E8E8 37.5%, #F0F0F0 37.5%,
    #E8E8E8 50%, #F0F0F0 50%, #F0F0F0 62.5%, #E8E8E8 62.5%, #E8E8E8 75%, #F0F0F0 75%, #F0F0F0);
}

#contenu_page.test.background-transparent section {
    background: var(--main-light-test);
}

#contenu_page.test.background-transparent .sub-row {
    background: var(--main-light-test);
}

#contenu_page.test section.citation .sub-row {
    -background: var(--main-dark);
}

#contenu_page.test section.always-light {
    background: var(--main-light-test);
}

#contenu_page.test section.always-light .sub-row {
    background: var(--main-light);
}

#contenu_page.test section.always-dark {
    background: var(--main-dark-test);
}

#contenu_page.test section.always-dark .sub-row {
    background: var(--main-dark);
}

#contenu_page.test section.background-dark {
    background: var(--main-dark-test);
}

#contenu_page.test section.background-dark .sub-row {
    background: var(--main-dark);
}

.contenu_page {
    opacity: 0;
}


/** POUR LES BLOCS --------------------------------------------------
------------------------------------------------------------*/

#contenu_page section.always-light {
    background: var(--main-light);
}

#contenu_page section.always-dark {
    background: var(--main-dark);
}

.background-light,
#contenu_page.background-light,
#contenu_page section.background-light {
    background: var(--main-light)
}

.background-dark,
#contenu_page.background-dark,
#contenu_page section.background-dark {
    background: var(--main-dark);
}

#contenu_page section.contenu.background-dark {
    padding: .75rem;
}

.background-color1,
#contenu_page.background-color1,
#contenu_page section.background-color1 {
    background: var(--main-color1)
}

#contenu_page.citation,
#contenu_page section.citation {
    -background: var(--main-color1);
}

#contenu_page.citation .content-bloc,
#contenu_page section.citation .content-bloc {
    -color: var(--main-dark);
    font-size: 24px;
    line-height: 32px;
}

#contenu_page.test.background-light,
#contenu_page.test.background-light section,
#contenu_page.test.background-light .sub-row {
    background: var(--main-light-test)
}

#contenu_page.test.background-dark,
#contenu_page.test.background-dark section,
#contenu_page.test.background-dark .sub-row {
    background: var(--main-dark-test)
}

.sub-row h1,
.sub-row h2,
.sub-row b,
.sub-row strong,
.sub-row li,
.sub-row span,
.sub-row div,
.sub-row p {
    color: var(--main-light);
}

.background-dark .sub-row h1,
.background-dark .sub-row h2,
.background-dark .sub-row b,
.background-dark .sub-row strong,
.background-dark .sub-row li,
.background-dark .sub-row span,
.background-dark .sub-row div,
.background-dark .sub-row p {
    color: var(--main-light);
}

.always-light .sub-row h1,
.always-light .sub-row h2,
.always-light .sub-row b,
.always-light .sub-row strong,
.always-light .sub-row li,
.always-light .sub-row span,
.always-light .sub-row div,
.always-light .sub-row p {
    color: var(--main-dark);
}

.always-dark .sub-row h1,
.always-dark .sub-row h2,
.always-dark .sub-row b,
.always-dark .sub-row strong,
.always-dark .sub-row li,
.always-dark .sub-row span,
.always-dark .sub-row div,
.always-dark .sub-row p {
    color: var(--main-light);
}

.sub-row.color-light h1,
.sub-row.color-light h2,
.sub-row.color-light b,
.sub-row.color-light strong,
.sub-row.color-light li,
.sub-row.color-light span,
.sub-row.color-light div,
.sub-row.color-light p {
    color: var(--main-light);
}

.sub-row.color-dark h1,
.sub-row.color-dark h2,
.sub-row.color-dark b,
.sub-row.color-dark strong,
.sub-row.color-dark li,
.sub-row.color-dark span,
.sub-row.color-dark div,
.sub-row.color-dark p {
    color: var(--main-dark);
}

.sub-row.color-color1 h1,
.sub-row.color-color1 h2,
.sub-row.color-color1 b,
.sub-row.color-color1 strong,
.sub-row.color-color1 li,
.sub-row.color-color1 span,
.sub-row.color-color1 div,
.sub-row.color-color1 p {
    color: var(--main-color1);
}

.citation .sub-row h1,
.citation .sub-row h2,
.citation .sub-row b,
.citation .sub-row strong,
.citation .sub-row li,
.citation .sub-row span,
.citation .sub-row div,
.citation .sub-row p {
    color: var(--main-light);
}

section a {
    -color: var(--main-color1);
}

.color-color1 {
    color: var(--main-color1) !important;
}

.color-light {
    color: var(--main-light) !important;
}

.color-dark {
    color: var(--main-dark) !important;
}

#axeptio_main_button svg path:first-child {
    fill: var(--main-color1) !important;
}

/** POUR LES BOUTONS ----------------------------------------------
------------------------------------------------------------*/

.btn, .btn-primary, .btn-link, .button {
    border: 2px solid transparent;
    font-size: 18px;
    line-height: 36px;
    text-align: center;
    display: inline-block;
    margin: auto;
    border-radius: 50px;
    padding-left: 50px;
    padding-right: 50px;
    text-decoration: none;
}

.btn, .btn-primary, .btn-link, .button,
.color-dark .btn, .color-dark .btn-primary, .color-dark .btn-link,
.background-light .btn, .background-light .btn-primary, .background-light .btn-link {
    background: var(--main-light);
    color: var(--main-dark);
    border-color: var(--main-dark);
}

.btn:hover, .btn-primary:hover, .btn-link:hover,
.color-dark .btn:hover, .color-dark .btn-primary:hover, .color-dark .btn-link:hover,
.background-light .btn:hover, .background-light .btn-primary:hover, .background-light .btn-link:hover,
.always-light .btn:hover, .always-light .btn-primary:hover, .always-light .btn-link:hover {
    background: var(--main-dark);
    color: var(--main-light);
    border-color: var(--main-light);
}

.color-light .btn, .color-light .btn-primary, .color-light .btn-link,
.background-dark .btn, .background-dark .btn-primary, .background-dark .btn-link {
    background: var(--main-dark);
    color: var(--main-color1) !important;
    border-color: var(--main-color1);
}

.color-light .btn:hover, .color-light .btn-primary:hover, .color-light .btn-link:hover,
.background-dark .btn:hover, .background-dark .btn-primary:hover, .background-dark .btn-link:hover,
.always-dark .btn:hover, .always-dark .btn-primary:hover, .always-dark .btn-link:hover {
    background: var(--main-color1);
    color: var(--main-dark) !important;
    border-color: var(--main-dark);
}

.btn.color-light, .btn-primary.color-light, .btn-link.color-light,
.btn.background-dark, .btn-primary.background-dark, .btn-link.background-dark {
    background: var(--main-dark);
    color: var(--main-color1) !important;
    border-color: var(--main-color1);
}

.color-light .btn:hover, .color-light .btn-primary:hover, .color-light .btn-link:hover,
.background-dark .btn:hover, .background-dark .btn-primary:hover, .background-dark .btn-link:hover,
.always-dark .btn:hover, .always-dark .btn-primary:hover, .always-dark .btn-link:hover {
    background: var(--main-color1);
    color: var(--main-dark) !important;
    border-color: var(--main-dark);
}


.btn.color-color1, .btn-primary.color-color1, .btn-link.color-color1 {
    color: var(--main-color1) !important;
    border-color: var(--main-color1);
}

.btn.background-color1, .btn-primary.background-color1, .btn-link.background-color1 {
    background: var(--main-color1);
}

.btn.color-light, .btn-primary.color-light, .btn-link.color-light,
.btn.color-dark:hover, .btn-primary.color-dark:hover, .btn-link.color-dark:hover {
    color: var(--main-light) !important;
    border-color: var(--main-light);
}

.btn.background-dark, .btn-primary.background-dark, .btn-link.background-dark,
.btn.background-light:hover, .btn-primary.background-light:hover, .btn-link.background-light:hover {
    background: var(--main-dark);
}

.btn.color-dark, .btn-primary.color-dark, .btn-link.color-dark,
.btn.color-light:hover, .btn-primary.color-light:hover, .btn-link.color-light:hover {
    color: var(--main-dark) !important;
    border-color: var(--main-dark);
}

.btn.background-light, .btn-primary.background-light, .btn-link.background-light,
.btn.background-dark:hover, .btn-primary.background-dark:hover, .btn-link.background-dark:hover {
    background: var(--main-light);
}

.btn.color-color1:hover, .btn-primary.color-color1:hover, .btn-link.color-color1:hover {
    background: var(--main-color1);
    color: var(--main-dark) !important;
    border-color: var(--main-dark);
}

.btn.background-color1:hover, .btn-primary.background-color1:hover, .btn-link.background-color1:hover {
    color: var(--main-color1) !important;
    border-color: var(--main-color1);
    background: var(--main-dark);
}

.btn-annuaire {
    padding: 10px;
    display: inline-block;
    border-radius: 40px;
    transition: .3s;
}

.btn-annuaire:hover, .btn-annuaire-selected {
    background: var(--main-color1);
}

.sub-container.background-light {
    background: var(--main-light);
}


/** PLACEHOLDER **
------------------------------------------------------------
------------------------------------------------------------*/
input {
    padding: 6px 12px;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: var(--main-dark);
}

::-moz-placeholder { /* Firefox 19+ */
    color: var(--main-dark);
}

:-ms-input-placeholder { /* IE 10+ */
    color: var(--main-dark);
}

:-moz-placeholder { /* Firefox 18- */
    color: var(--main-dark);
}


/** FONT AWESOME --------------------------------------------------
------------------------------------------------------------*/

.fa {
    font-family: var(--main-font-fa);
    font-weight: 400;
    font-size: 28px;
    font-style: initial;
}

.fal, .fa-light {
    font-family: var(--main-font-fa);
    font-weight: 300;
    font-size: 28px;
    font-style: initial;
}

.far, .fa-regular {
    font-family: var(--main-font-fa);
    font-weight: 400;
    font-size: 28px;
    font-style: initial;
}

.fas, .fa-solid {
    font-family: var(--main-font-fa);
    font-weight: 900;
    font-size: 28px;
    font-style: initial;
}

.contact .fa-light,
.trombinoscope .fa-light,
.fa-light.fa-arrow-right {
    font-weight: 500;
    font-size: 18px;
    margin-right: 10px;
    margin-left: 10px;
}

.fa-regular.fa-arrow-right {
    font-weight: 500;
    font-size: 18px;
}

.content-bloc-line .fa-light {
    font-weight: 500;
    font-size: 18px;
    margin-right: 10px;
    margin-left: 10px;
}

.fa.fa-search {
    font-size: 20px;
    font-weight: 400;
}


/** STYLES TYPO & COULEURS BALISES --------------------------
------------------------------------------------------------*/

.container p a,
.container-fluid p a,
.container p a:hover,
.container-fluid p a:hover,
.container li a,
.container-fluid li a,
.container li a:hover,
.container-fluid li a:hover {
    color: var(--main-color1);
    color: var(--main-dark);
    text-decoration: underline;
}

.post-content p:empty {
    display: none;
}

.container .the-content ul,
.container-fluid .the-content ul,
.container .post-content ul,
.container-fluid .post-content ul {
    font-family: var(--main-font);
    position: relative;
    list-style: none;
    margin: 40px 0;
}

.container .the-content ul li,
.container-fluid .the-content ul li,
.container .post-content ul li,
.container-fluid .post-content ul li {
    position: relative;
    list-style: none;
}

.container .the-content ul li::before,
.container-fluid .the-content ul li::before,
.container .post-content ul li::before,
.container-fluid .post-content ul li::before {

}

.container ol,
.container-fluid ol {
    padding-inline-start: 20px !important;
}

.container ol li,
.container-fluid ol li {
    padding-bottom: 2rem;
}

.container ol li::marker,
.container-fluid ol li::marker {
    content: counter(list-item) " " "— ";
}

h1 {
    font-family: var(--main-font);
    font-size: 46px;
}

.container .post-content h1,
.container-fluid .post-content h1,
.container .post-content h1 a,
.container-fluid .post-content h1 a {
    font-family: var(--main-font);
    font-size: 46px;
    letter-spacing: 0;
    position: relative
}

.container .post-content h1:first-child,
.container-fluid .post-content h1:first-child {
    margin-top: 0px;
    margin-bottom: 0px;
}

h1, h2, h3 {
    position: relative;
}

.container .post-content h1::after,
.container-fluid .post-content h1::after,
.container h1::after,
.container-fluid h1::after {
    position: absolute;
    content: " ";
    background: var(--main-color1);
    border-radius: 24px;
    width: 16px;
    height: 16px;
    bottom: 13px;
    margin-left: 7px;
}

.container .post-content h2,
.container-fluid .post-content h2,
.container .post-content h2 a,
.container-fluid .post-content h2 a {
    font-family: var(--main-font);
    font-size: 30px;
    -line-height: 30px;
    letter-spacing: 0;
    margin-top: 30px;
    margin-bottom: 0px;
    position: relative
}

.container .post-content h2:first-child,
.container-fluid .post-content h2:first-child {
    margin-top: 0px;
}

.sous-titre h2 {
    margin-bottom: 0 !important;
}

.container .post-content h2::after,
.container-fluid .post-content h2::after {
    position: absolute;
    content: " ";
    background: var(--main-color1);
    border-radius: 24px;
    width: 12px;
    height: 12px;
    bottom: 10px;
    margin-left: 7px;
}


.container .post-content .bloc-titre,
.container-fluid .post-content .bloc-titre,
.container .post-content .bloc-titre a,
.container-fluid .post-content .bloc-titre a {
    font-family: var(--main-font);
    font-size: 46px;
    letter-spacing: 0;
    position: relative;
}

.container .post-content .bloc-titre::after,
.container-fluid .post-content .bloc-titre::after {
    position: absolute;
    content: " ";
    background: var(--main-color1);
    border-radius: 24px;
    width: 12px;
    height: 12px;
    margin-top: 32px;
    margin-left: 7px;
}

.container .post-content h3,
.container-fluid .post-content h3,
.container .post-content h3 a,
.container-fluid .post-content h3 a {
    font-family: var(--main-font);
    font-size: 24px;
    line-height: 30px;
    letter-spacing: 0;
    margin-top: 30px;
    margin-bottom: 30px;
    position: relative
}

.container .post-content h3::after,
.container-fluid .post-content h3::after {
    position: absolute;
    content: " ";
    background: var(--main-color1);
    border-radius: 24px;
    width: 12px;
    height: 12px;
    margin-top: 10px;
    margin-left: 7px;
}


.container .post-content h4,
.container-fluid .post-content h4,
.container .post-content h4 a,
.container-fluid .post-content h4 a {
    font-family: var(--main-font);
    font-size: 22px;
    line-height: 24px;
    letter-spacing: 0;
    margin-top: 30px;
    margin-bottom: 30px;
}

.container .post-content h4 {
    line-height: 28px;
}


.container .post-content h5,
.container-fluid .post-content h5,
.container .post-content h5 a,
.container-fluid .post-content h5 a,
.container .the-content h5,
.container-fluid .the-content h5,
.container .the-content h5 a,
.container-fluid .the-content h5 a {
    font-family: var(--main-font);
    font-size: 18px;
    line-height: 20px;
    letter-spacing: 0;
    margin-top: 30px;
    margin-bottom: 30px;
}

.container .post-content h6,
.container-fluid .post-content h6,
.container .post-content h6 a,
.container-fluid .post-content h6 a {
    font-family: var(--main-font);
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0;
    margin-top: 60px;
    margin-bottom: 30px;
}

.container section img,
.container-fluid section img,
.container section svg,
.container-fluid section svg {
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 10px;
}

.single-actualites .container section img,
.single-actualites .container-fluid section img,
.single-actualites .container section svg,
.single-actualites .container-fluid section svg {
    max-height: 280px;
}

table img {
    width: auto !important;
    max-width: initial !important;
}

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