/*
 Theme Name:   bricks-www-imt
 Theme URI:    https://bricksbuilder.io/
 Author:       Olivier Allain
 Description:  Thème du site www.imt.fr (enfant de bricks)
 Template:     bricks
 Version:      1.0
 Text Domain:  www-imt
 Requires at least: 6.4
 Tested up to: 6.4
 Requires PHP: 8.0
*/

*, :after, :before {
    box-sizing: border-box;
}

/* Textes
------------------------- */

h1, h2, h4, h5, h6, p {
    font-family: Roboto, sans-serif;
    font-weight: 400;
}

h1, h2, h4, h5, h6 {
    margin: 0 0 60px 0;
}

p {
    font-size: 18px;
    line-height: 28px;
    margin: 0 0 40px 0;
}

strong, b {
    font-family: Roboto, sans-serif;
    font-weight: 700;
}

h1 {
    font-size: 55px;
    line-height: 70px;
}

h2 {
    font-size: 40px;
    line-height: 48px;
}

h3 {
    font-family: Archer, sans-serif;
    font-weight: 700;
    font-size: 28px;
    line-height: 38px;
    margin: 0 0 20px 0;
}

h4 {
    font-size: 22px;
    line-height: 35px;
}

h5 {
    font-size: 18px;
    line-height: 28px;
}

h6 {
    font-size: 16px;
    line-height: 14px;
    letter-spacing: 0.5px;
    margin-bottom: 30px;
}

blockquote {
    font-family: Roboto, sans-serif;
    border-color: #00B8DE;
}

@media (max-width: 1024px) {
    h1, h2, h4, h5, h6 {
        margin: 0 0 40px 0;
    }

    p {
        font-size: 17px;
        line-height: 26px;
    }

    h1 {
        font-size: 40px;
        line-height: 50px;
    }

    h2 {
        font-size: 35px;
        line-height: 40px;
    }

    h3 {
        font-size: 25px;
        line-height: 30px;
    }

    h4 {
        font-size: 20px;
        line-height: 35px;
    }

    h5 {
        font-size: 18px;
        line-height: 32px;
    }
}

/* Liens
------------------------- */

#brx-content a {
    color: #052dff;
    text-decoration: underline;
}
#brx-content a:hover {
    font-weight: bold;
    text-decoration-thickness: 2px;
}

#brx-content .brxe-social-icons a {
    color: #14223c;
    text-decoration: none;
}

#brx-content a.bricks-button {
    color: #000;
    text-decoration: none;
}


/* Listes à puces
------------------------- */

ul.bulletlist {
    list-style-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='13' height='13' fill='%2300B8DE'/%3E%3C/svg%3E");
}

ul.bulletlist li {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 30px;
    padding-left: 12px;
}

/* Boutons
------------------------- */

.btn-primary, .wp-block-button.btn-primary {
    font-family: Roboto, sans-serif;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: #00B8DE;
    color: black;
    cursor: pointer;
    padding: 24px 30px;
    text-transform: uppercase;
    border: none;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 1px;
    &:hover {
        background-color: #0C2340;
        color: #00B8DE !important;
        &::after {
            filter: brightness(0) saturate(100%) invert(52%) sepia(25%) saturate(1892%) hue-rotate(146deg) brightness(101%) contrast(108%);
        }
    }
    &:disabled {
        background-color: #B7B8B8;
        color: #3B4142;
        cursor: not-allowed;
        &::after {
            filter: brightness(0) saturate(100%) invert(21%) sepia(4%) saturate(930%) hue-rotate(141deg) brightness(98%) contrast(84%);
        }
    }
    &::after {
        display: block;
        content: '';
        background-image: url('../svg/arrow-right.svg');
        background-size: contain;
        background-repeat: no-repeat;
        height: 13px;
        width: 13px;
    }
}

#brx-content .wp-block-button.btn-primary a.wp-block-button__link {
    padding: 0;
    background-color: transparent;
    text-decoration: none;
    color: inherit;
    font-size: 18px;
}

.btn-secondary, .wp-block-button.btn-secondary {
    font-family: Roboto, sans-serif;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background-color: transparent;
    border: 1px solid black;
    color: black;
    cursor: pointer;
    padding: 24px 30px;
    text-transform: uppercase;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 1px;
    &:hover {
        background-color: #0C2340;
        color: #00B8DE !important;
        border-color: transparent;
        &::after {
            filter: brightness(0) saturate(100%) invert(52%) sepia(25%) saturate(1892%) hue-rotate(146deg) brightness(101%) contrast(108%);
        }
    }
    &:disabled {
        background-color: #B7B8B8;
        color: #3B4142;
        cursor: not-allowed;
        border-color: transparent;
        &::after {
            filter: brightness(0) saturate(100%) invert(21%) sepia(4%) saturate(930%) hue-rotate(141deg) brightness(98%) contrast(84%);
        }
    }
    &::after {
        display: block;
        content: '';
        background-image: url('../svg/arrow-right.svg');
        background-size: contain;
        background-repeat: no-repeat;
        height: 13px;
        width: 13px;
    }
}

#brx-content .wp-block-button.btn-secondary a.wp-block-button__link {
    padding: 0;
    background-color: transparent;
    text-decoration: none;
    color: inherit;
    font-size: 18px;
}

.btn-tertiary {
    font-family: Roboto, sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    color: black;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 1px;
    text-decoration: none;
    padding-bottom: 2px;
    border: none;
    border-bottom: 1px solid black;
    cursor: pointer;
}

@media (max-width: 1024px) {
    .btn-primary, .btn-secondary, .btn-tertiary {
        font-size: 15px;
        line-height: 18px;
    }
}

/* Tags
   ------------------------- */
.light-blue-tag {
    font-family: Archer,sans-serif;
    display: inline-block;
    padding: 12px 30px;
    background-color: rgba(0, 184, 222, 0.2);
    border-radius: 26px;
}

@media (max-width: 1024px) {
    .light-blue-tag {
        font-size: 15px;
        line-height: 24px;
    }
}

/* Header
   ------------------------- */

/* Mettre l'id menu-header dans l'élément menu du modèle header */
#menu-header .bricks-nav-menu > li {
    margin-left: 0;
}
#menu-header .bricks-nav-menu > li:hover {
    background-color: #00b8de;
}
#menu-header .bricks-nav-menu > li > .brx-submenu-toggle > button {
    padding-left: 0;
}
#menu-header .bricks-nav-menu .sub-menu li a:hover {
    color: #00b8de;
}
#menu-header .brx-submenu-toggle.icon-right button {
    margin-left: 0;
}

.wpml-ls-current-language > a > span {
    font-weight: 700;
    border-bottom: 2px solid #00b8de;
}

.wpml-ls-legacy-list-horizontal a span {
    vertical-align:top !important;
}

@media (max-width: 361px) {
    .wpml-ls-legacy-list-horizontal li a {
        padding: 4px 7px 4px;
    }
}

/* Menu mobile */
.brxe-nav-menu .bricks-mobile-menu-wrapper {
    padding-top: 80px;
}

@media (max-width: 478px) {
    .brxe-nav-menu .bricks-mobile-menu-wrapper li {
        padding-bottom: 30px;
    }

    .brxe-nav-menu .bricks-mobile-menu-wrapper li a {
        line-height: 30px;
    }

    #menu-header .bricks-mobile-menu .sub-menu > li {
        padding-bottom: 25px;
    }

    #menu-header .bricks-mobile-menu .sub-menu > li > a {
        line-height: 30px;
    }
}

/* Main
   ------------------------- */

#brx-content {
    margin-bottom: 5rem;
}

/* Footer
------------------------- */

/* Pour coller le footer en bas de page */
.brx-body {
    min-height: 100vh;
}

@media (min-width: 992px) {
    .footer-bg {
        background-image: url('../webp/footer-bg-bl.webp'), url('../webp/footer-bg-tr.webp');
        background-position: bottom left, top right;
        background-repeat: no-repeat;
    }
}

#brx-footer h4 {
    font-family: Roboto,sans-serif;
    font-weight: normal;
    font-size: 1.6rem;
    margin-bottom: 2rem;
    margin-top: 0;
}

#brx-footer .footer-autres-sites p {
    margin: 0 0 1rem;
    line-height: 2rem;
}

#brx-footer .footer-autres-sites a {
    text-decoration: underline;
    font-weight: bold;
}

#brx-footer .footer-imt p {
    font-size: 15px;
    margin: 1rem 0;
}

#brx-footer .socket p {
    font-size: 1.3rem;
    margin: 3rem 0;
}

#brx-footer .socket a {
    text-decoration: underline;
}

/* News
   ------------------------- */

#news ul {
    list-style-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='13' height='13' fill='%2300B8DE'/%3E%3C/svg%3E");
}

#news li {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 30px;
    padding-left: 12px;
}

#news .related-news h3 {
    font-size: 20px;
    line-height: 30px;
}

#news .related-news a {
    color: #000;
    text-decoration: none;
}

#news .bloc-fond-text {
    padding: 50px 0 20px 0;
}

#news .bloc-fond-text__container {
    position: relative;
}

#news .bloc-fond-text__container::before {
    content:"";
    position: absolute;
    top: 0;
    right: 0;
    background-image: url('../webp/triangle-350-tr.webp');
    background-size: contain;
    width: 199px;
    height: 199px;
    z-index: -1;
}

#news .bloc-fond-text__content {
    position: relative;
    max-width: 818px;
    padding-left: 120px;
    box-sizing: content-box;
}

#news .bloc-fond-text__content::before {
    content:"";
    position: absolute;
    top: 0;
    left: 30px;
    background-image: url('../webp/triangle-170-tr.webp');
    background-size: contain;
    width: 35px;
    height: 35px;
    z-index: -1;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    #news li {
        font-size: 17px;
        line-height: 26px;
        margin-bottom: 27px;
        padding-left: 0;
    }

    #news .bloc-fond-text {
        padding: 30px 0 30px 0;
    }

    #news .bloc-fond-text__container::before {
        top: -20px;
        width: 113px;
        height: 113px;
    }

    #news .bloc-fond-text__content {
        padding-left: 40px;
    }

    #news .bloc-fond-text__content::before {
        top: 5px;
        left: 0;
        width: 23px;
        height: 23px;
    }

    #news .bloc-fond-text__btn {
        display: flex;
        justify-content: center;
    }
}


/* All news
   ------------------------- */

#allnews input::placeholder {
    color: #000;
}

/* Archives
   ------------------------- */

.archives {
    padding: 39px 0 120px 0;
}

.archives__title {
    margin-bottom: 150px;
}

.archives__main {
    display: grid;
    justify-content: center;
    justify-items: center;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, calc(33% - 20px));
}

.archives__single {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 378px !important;
    background-color: #ffffff;
    justify-self: stretch;
}

.archives__single:nth-child(3n+2){
    top: -73px;
}

.archives__single:first-of-type::before {
    content:"";
    position: absolute;
    top: -30px;
    left: -30px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 120px;
    height: 120px;
    z-index: -1;
}

.archives__single:last-of-type::before {
    content:"";
    position: absolute;
    bottom: -40px;
    right: -40px;
    background-image: url('../webp/triangle-350-br.webp');
    background-size: contain;
    width: 268px;
    height: 268px;
    z-index: -1;
}

.archives__image {
    width: 378px;
    object-fit: cover;
}

.archives__content {
    padding: 46px 25px;
    text-align: center;
}

.archives__content h3 {
    margin-bottom: 0;
    font-size: 24px;
    line-height: 34px;
}

.archives__content p {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 16px;
    color: #6a6a6a;
    line-height: 26px;
}

.archives__content p img {
    margin-right: 10px;
    margin-bottom: 2px;
    width: 14px;
    vertical-align: sub;
}

.archives__content p.type {
    font-family: Archer, sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 28px;
    padding: 12px 30px;
    border-radius: 26px;
    background-color: rgba(0, 184, 222, 0.2);
    color: #000;
    margin-bottom: 20px;
}

#brx-content .archives__content h3 > a {
    color: #000;
    text-decoration: none;
}

#brx-content .archives__content h3 > a:hover {
    text-decoration: underline;
}

#brx-content .archives__content .btn-primary {
    padding: 14px 20px;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 1px;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .archives {
        padding: 19px 0 80px 0;
    }

    .archives__title {
        margin-bottom: 60px;
    }

    .archives__main {
        grid-template-columns: 1fr;
    }

    .archives__single {
        justify-self: auto;
    }

    .archives__single:first-of-type::before {
        top: -20px;
        left: -20px;
        width: 95px;
        height: 95px;
    }

    .archives__single:last-of-type::before {
        bottom: -20px;
        right: -20px;
        width: 238px;
        height: 238px;
    }

    .archives__single:nth-child(3n+2){
        top: 0;
    }

    .archives__content {
        padding: 30px 5px 65px 5px;
    }

    #brx-content .archives__content .btn-primary {
        font-size: 14px;
        line-height: 17px;
    }
}

/* Evénement
   ------------------------- */
#event li {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 30px;
    padding-left: 12px;
}

/* Date et lieu */
.event_date_location {
    font-size: 20px;
    color: #6a6a6a;
    display: flex;
    align-items: center;
}

.event_date_location img {
    margin-right: 12px;
    width: 16px;
    vertical-align: sub;
}

.event_date_location span.sep {
    margin-right: 24px;
    margin-left: 24px;
}

/* Vous aimerez aussi : Titre */
#event .related-news h3 {
    font-size: 20px;
    line-height: 30px;
}

#event .related-news a {
    color: #000;
    text-decoration: none;
}

/* Vous aimerez aussi : Date et lieu */
#event .related-news p {
    font-size: 15px;
    color: #6a6a6a;
    display: flex;
    align-items: center;
    line-height: 20px;
}

#event .related-news p img {
    margin-right: 10px;
    width: 14px;
    vertical-align: sub;
}

#event .related-news p span.sep {
    margin-right: 18px;
    margin-left: 18px;
}

#event .repeater-item h3[data-field-id="62eb2f"] {
    margin-top:0;
    margin-bottom: 10px;
}

#event .repeater-item p[data-field-id="qhlwzt"] {
    margin-top:0;
}

/* Vous aimerez aussi : Type */
#event .repeater-item p[data-field-id="ktobwe"] {
    font-family: Archer, sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 28px;
    padding: 12px 30px;
    color: #000;
    margin-bottom: 20px;
}

@media (max-width: 478px) {
    .event_date_location {
        font-size: 16px;
    }
}

/* Bloc image
   ------------------------- */

.bloc-image {
    display: flex;
    justify-content: center;
    padding: 103px 130px 63px 130px;
}

.bloc-image__container {
    position: relative;
    &::before {
        content:"";
        position: absolute;
        top: -60px;
        left: -60px;
        background-image: url('../webp/triangle-350-tl.webp');
        background-size: contain;
        display: inline-block;
        width: 350px;
        height: 350px;
        z-index: -1;
    }
    &::after {
        content:"";
        position: absolute;
        bottom: -30px;
        right: -30px;
        background-image: url('../webp/triangle-170-br.webp');
        background-size: contain;
        display: inline-block;
        width: 170px;
        height: 170px;
        z-index: 1;
    }
}

.bloc-image__container img {
    width: 100%;
    height: 540px;
    object-fit: cover;
    object-position: center;
}

/*----- RESPONSIVE -----*/
@media (max-width: 768px) {
    .bloc-image {
        padding: 37px 36px 77px 36px;
    }
    .bloc-image__container {
        &::before {
            top: -20px;
            left: -20px;
            width: 230px;
            height: 230px;
        }
        &::after {
            bottom: -18px;
            right: -12px;
            width: 120px;
            height: 120px;
        }
    }
    .bloc-image__container img {
        height: 440px;
    }
}

/* Bloc image et texte
   ------------------------- */

.text-image {
    padding: 15px 0;
}

.text-image__main {
    display: flex;
    align-items: center;
    gap: 140px;
}

.text-image__title {
    margin-bottom: 100px;
}

.text-image__img {
    position: relative;
    img {
        max-width: 460px;
        width: 100%;
    }
    &::before {
        content:"";
        position: absolute;
        bottom: -40px;
        left: -40px;
        background-image: url('../webp/triangle-350-bl.webp');
        background-size: contain;
        display: inline-block;
        width: 350px;
        height: 350px;
        z-index: -1;
    }
    &::after {
        content:"";
        position: absolute;
        top: -20px;
        right: -20px;
        background-image: url('../webp/triangle-170-tr.webp');
        background-size: contain;
        display: inline-block;
        width: 170px;
        height: 170px;
        z-index: 1;
    }
}

.text-image__content {
    flex: 1;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .text-image__main {
        flex-direction: column;
        gap: 54px;
    }

    .text-image__title {
        margin-bottom: 55px;
    }

    .text-image__img {
        &::before {
            bottom: -20px;
            left: -20px;
            width: 250px;
            height: 250px;
        }
        &::after {
            width: 116px;
            height: 116px;
        }
    }
}

/* Bloc liste à puce
   ------------------------- */

.bloc-txt {
    padding: 50px 0;
}

.bloc-list {
    margin-top: 50px;
}

.bloc-list__content {
    max-width: 700px;
    padding-left: 280px;
    font-size: 22px;
    line-height: 35px;
    list-style-image: url("data:image/svg+xml,%3Csvg width='13' height='13' viewBox='0 0 13 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='13' height='13' fill='%2300B8DE'/%3E%3C/svg%3E");
    box-sizing: content-box;
    li {
        position: relative;
        margin-bottom: 35px;
        padding-left: 18px;
    }
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-txt {
       padding: 20px 0;
    }

    .bloc-list__content {
        font-size: 20px;
        line-height: 35px;
        padding-left: 0;
        list-style-position: inside;
        li {
            margin-bottom: 32px;
            padding-left: 0;
        }
    }
}

/* Bloc texte 2 colonnes
   ------------------------- */

.bloc-double-txt__content {
    display: flex;
    gap: 20px;
}

.bloc-double-txt__content h3 {
    flex: 1;
}

.bloc-double-txt__right {
    flex: 2;
}

.bloc-double-txt__buttons {
    display: flex;
    gap: 25px;
}

/* Bloc vidéo
   ------------------------- */

.bloc-video {
    display: flex;
    justify-content: center;
    padding: 0 0 65px 0;
}

.bloc-video__container {
    padding: 0 120px;
}

.bloc-video__title {
    margin-bottom: 80px;
}

.bloc-video__iframe {
    position: relative;
    &::before {
        content:"";
        position: absolute;
        top: -30px;
        left: -30px;
        background-image: url('../webp/triangle-fonce-170-tl.webp');
        background-size: contain;
        width: 120px;
        height: 120px;
        z-index: -1;
    }
    &::after {
        content:"";
        position: absolute;
        bottom: -40px;
        right: -40px;
        background-image: url('../webp/triangle-350-br.webp');
        background-size: contain;
        display: inline-block;
        width: 268px;
        height: 268px;
        z-index: -1;
    }
}

.bloc-video__iframe iframe {
    width: 100%;
    height: 100%;
}

/*----- RESPONSIVE -----*/
@media (max-width: 768px) {
    .bloc-video {
        padding: 0 0 35px 0;
    }

    .bloc-video__container {
        padding: 0;
    }

    .bloc-video__iframe {
        &::before {
            top: -20px;
            left: -20px;
            width: 70px;
            height: 70px;
        }
        &::after {
            bottom: -20px;
            right: -20px;
            width: 125px;
            height: 125px;
        }
    }
}

/* Bloc interview
   ------------------------- */

.bloc-interview {
    padding: 29px 0 80px 0;
    overflow: hidden;
}

.bloc-interview__title {
    margin-bottom: 145px;
}

.bloc-interview__main {
    display: grid;
    justify-content: center;
    justify-items: center;
    gap: 20px;
    grid-template-columns: 1fr 1fr;
}

.bloc-interview__single {
    position: relative;
    background-color: #ffffff;
    justify-self: stretch;
}

.bloc-interview__single:nth-child(odd){
    top: -60px;
}

.bloc-interview__single:first-of-type::before {
    content:"";
    position: absolute;
    top: -30px;
    left: -30px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 130px;
    height: 130px;
    z-index: -1;
}

.bloc-interview__single:last-of-type {
    margin-bottom: 0;
}

.bloc-interview__single:last-of-type::before {
    content:"";
    position: absolute;
    bottom: -30px;
    right: -40px;
    background-image: url('../webp/triangle-350-br.webp');
    background-size: contain;
    width: 293px;
    height: 293px;
    z-index: -1;
}

.bloc-interview__single a {
    color: inherit;
    text-decoration: inherit;
}

.bloc-interview__content {
    padding: 45px 60px 55px 60px;
    text-align: center;
}

.bloc-interview__tag {
    margin-bottom: 30px;
}

.bloc-interview__extrait {
    margin: 0;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1310px) {
    .bloc-interview__title {
        margin-bottom: 80px;
    }

    .bloc-interview__main {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .bloc-interview__single:nth-child(odd){
        top: 0;
    }

    .bloc-interview__single:first-of-type::before {
        top: -20px;
        left: -20px;
        width: 95px;
        height: 95px;
    }

    .bloc-interview__single:last-of-type::before {
        display: none;
    }

    .bloc-interview__content {
        padding: 30px 5px 65px 5px;
    }
}

/* Bloc citation
   ------------------------- */

.bloc-citation {
    background-color: #ffffff;
    padding: 60px 50px 80px 50px;
    text-align: center;
}

.bloc-citation__content {
    position: relative;
    max-width: 938px;
    margin: auto;
    padding: 60px 175px 0 175px;
    box-sizing: content-box;
    border-left-style: none;
}

.bloc-citation__content::before {
    content: url('../webp/quote-tl.webp');
    position: absolute;
    top: 0;
    left: 0;
}

.bloc-citation__content::after {
    content: url('../webp/quote-br.webp');
    position: absolute;
    bottom: 0;
    right: 0;
}

.bloc-citation__content p {
    font-size: 32px;
    line-height: 50px;
    margin-bottom: 30px;
}

.bloc-citation__content footer {
    font-family: Roboto, sans-serif;
    font-size: 22px;
    line-height: 35px;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-citation {
        padding: 60px 35px;
    }
    .bloc-citation__content {
        padding: 150px 0 175px 0;
    }

    .bloc-citation__content p {
        font-size: 25px;
        line-height: 38px;
    }

    .bloc-citation__content footer {
        font-size: 20px;
        line-height: 35px;
    }
}

/* Bloc infos clés
   ------------------------- */

.bloc-infoscles {
    padding: 35px 130px 115px 130px;
}

.bloc-infoscles__row {
    position: relative;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 25px;
}

.bloc-infoscles__single {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #00B8DE;
    text-align: center;
    width: 255px;
    height: 260px;
}

.bloc-infoscles__single:first-of-type:before {
    content:"";
    position: absolute;
    top: -30px;
    left: -30px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 130px;
    height: 130px;
    z-index: -1;
}

.bloc-infoscles__single:last-of-type:before {
    content:"";
    position: absolute;
    bottom: -40px;
    right: -40px;
    background-image: url('../webp/triangle-350-br.webp');
    background-size: contain;
    width: 195px;
    height: 195px;
    z-index: -1;
}

.bloc-infoscles__number {
    font-family: Roboto,sans-serif;
    font-size: 65px;
    line-height: 75px;
}

.bloc-infoscles__text {
    font-family: Archer,sans-serif;
    font-size: 28px;
    line-height: 38px;
    max-width: 145px;
}


/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-infoscles {
        padding: 35px 0;
    }

    .bloc-infoscles__row {
        gap: 15px;
    }

    .bloc-infoscles__single {
        width: 242px;
        height: 227px;
    }

    .bloc-infoscles__single:first-of-type:before {
        width: 95px;
        height: 95px;
    }

    .bloc-infoscles__single:last-of-type:before {
        bottom: -30px;
        right: -30px;
        width: 160px;
        height: 160px;
    }

    .bloc-infoscles__number {
        font-size: 55px;
        line-height: 60px;
    }

    .bloc-infoscles__text {
        font-size: 25px;
        line-height: 30px;
    }
}

/* Bloc chiffres
   ------------------------- */

.bloc-chiffres {
    padding: 35px 130px 115px 130px;
}

.bloc-chiffres__row {
    position: relative;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 25px;
    margin-top: 110px;
}

.bloc-chiffres__single {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #00B8DE;
    text-align: center;
    width: 255px;
    height: 260px;
}

.bloc-chiffres__single:first-of-type:before {
    content:"";
    position: absolute;
    top: -40px;
    left: -40px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 156px;
    height: 156px;
    z-index: -1;
}

.bloc-chiffres__single:last-of-type:before {
    content:"";
    position: absolute;
    bottom: -40px;
    right: -40px;
    background-image: url('../webp/triangle-350-br.webp');
    background-size: contain;
    width: 195px;
    height: 195px;
    z-index: -1;
}

.bloc-chiffres__number {
    font-family: Roboto,sans-serif;
    font-size: 65px;
    line-height: 75px;
}

.bloc-chiffres__text {
    font-family: Archer,sans-serif;
    font-size: 28px;
    line-height: 38px;
    max-width: 220px;
}


/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-chiffres {
        padding: 35px 0;
    }

    .bloc-chiffres__row {
        gap: 7px;
        margin-top: 82px;
    }

    .bloc-chiffres__single {
        width: 145px;
        height: 137px;
    }

    .bloc-chiffres__single:first-of-type:before {
        top: -20px;
        left: -20px;
        width: 95px;
        height: 95px;
    }

    .bloc-chiffres__single:last-of-type:before {
        bottom: -20px;
        right: -20px;
        width: 130px;
        height: 130px;
    }

    .bloc-chiffres__single.bottom-cropped-blue:after {
        border-bottom: 16px solid #F0F0F4;
        border-left: 16px solid #00B8DE;
    }

    .bloc-chiffres__number {
        font-size: 32px;
        line-height: 14px;
    }

    .bloc-chiffres__text {
        font-size: 18px;
        line-height: 30px;
    }
}

/* Bloc FAQ
   ------------------------- */

.bloc-faq {
    background-color: #0C2340;
    color: white;
    padding: 85px 0 125px 0;
}

.bloc-faq-container {
    max-width: 935px;
    margin: auto;
}

.bloc-faq__main {
    border-bottom: 1px solid white;
}

.bloc-faq__main li.accordion-item {
    border-top: 1px solid white;
    padding: 40px 28px;
}

.bloc-faq__main h3 {
    position: relative;
    padding-right: 20px;
    font-size: 30px;
    line-height: 38px;
    cursor: pointer;
}

.bloc-faq__main h3::marker {
    content: "";
    color: transparent;
    width: 0;
}

.bloc-faq__main h3::before {
    content: "";
    display: inline-block;
    margin-right: 17px;
    border-right: solid 15px transparent;
    border-top: solid 15px #00B8DE;
}

.bloc-faq__main li.accordion-item p {
    margin: 2rem 0;
}

.bloc-faq__main li.accordion-item ul {
    margin-top: 5px;
    padding-inline-start: 20px;
    list-style-type: square;
}

.bloc-faq__main li.accordion-item ul li {
    padding-left: 10px;
}

#brx-content .bloc-faq__main li.accordion-item a {
    color: #00B8DE;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-faq {
        padding: 90px 0;
    }
    .bloc-faq__main h3 {
        font-size: 25px;
        line-height: 35px;
        padding-right: 30px;
    }
    .bloc-faq__main li.accordion-item {
        padding: 25px 0;
    }
}

/* Bloc Fond et texte
   ------------------------- */

.bloc-fond-text {
    padding: 50px 0 20px 0;
}

.bloc-fond-text__container {
    position: relative;
}

.bloc-fond-text__container::before {
    content:"";
    position: absolute;
    top: 0;
    right: 0;
    background-image: url('../webp/triangle-350-tr.webp');
    background-size: contain;
    width: 199px;
    height: 199px;
    z-index: -1;
}

.bloc-fond-text__content {
    position: relative;
    max-width: 818px;
    padding-left: 120px;
    box-sizing: content-box;
}

.bloc-fond-text__content::before {
    content:"";
    position: absolute;
    top: 0;
    left: 30px;
    background-image: url('../webp/triangle-170-tr.webp');
    background-size: contain;
    width: 35px;
    height: 35px;
    z-index: -1;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-fond-text {
        padding: 30px 0 30px 0;
    }

    .bloc-fond-text__container::before {
        width: 113px;
        height: 113px;
    }

    .bloc-fond-text__content {
        padding-left: 40px;
    }

    .bloc-fond-text__content::before {
        top: 5px;
        left: 0;
        width: 23px;
        height: 23px;
    }

    .bloc-fond-text__btn {
        display: flex;
        justify-content: center;
    }
}

/* Bloc Profil
   ------------------------- */

.bloc-profil {
    padding: 39px 0 120px 0;
}

.bloc-profil__title {
    margin-bottom: 150px;
}

.bloc-profil__main {
    display: grid;
    justify-content: center;
    justify-items: center;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, calc(33% - 20px));
}

.bloc-profil__single {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 378px;
    background-color: #ffffff;
    justify-self: stretch;
}

.bloc-profil__single:nth-child(3n+2){
    top: -73px;
}

.bloc-profil__single:first-of-type::before {
    content:"";
    position: absolute;
    top: -30px;
    left: -30px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 120px;
    height: 120px;
    z-index: -1;
}

.bloc-profil__single:last-of-type::before {
    content:"";
    position: absolute;
    bottom: -40px;
    right: -40px;
    background-image: url('../webp/triangle-350-br.webp');
    background-size: contain;
    width: 268px;
    height: 268px;
    z-index: -1;
}

.bloc-profil__image {
    width: 378px;
    height: 295px;
    object-fit: cover;
}

.bloc-profil__content {
    padding: 46px 25px;
    text-align: center;
}

.bloc-profil__content h3 {
    margin-bottom: 0;
}

.bloc-profil__content p {
    margin: 0;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-profil {
        padding: 19px 0 80px 0;
    }

    .bloc-profil__title {
        margin-bottom: 60px;
    }

    .bloc-profil__main {
        grid-template-columns: 1fr;
    }

    .bloc-profil__single {
        justify-self: auto;
    }

    .bloc-profil__single:first-of-type::before {
        top: -20px;
        left: -20px;
        width: 95px;
        height: 95px;
    }

    .bloc-profil__single:last-of-type::before {
        bottom: -20px;
        right: -20px;
        width: 238px;
        height: 238px;
    }

    .bloc-profil__single:nth-child(3n+2){
        top: 0;
    }

    .bloc-profil__content {
        padding: 30px 5px 65px 5px;
    }
}

/* Bloc Redirection
   ------------------------- */

.bloc-redirection {
    padding: 20px 0 70px 0;
}

.bloc-redirection__main {
    display: grid;
    justify-content: center;
    justify-items: center;
    gap: 23px;
    grid-template-columns: 1fr 1fr;
}

.bloc-redirection__single {
    position: relative;
    padding: 40px 35px 70px 35px;
    background-color: #0C2340;
    color: white;
    justify-self: stretch;
}

#brx-content a.bloc-redirection__single {
    color: #ffffff;
    text-decoration: none;
}

.bloc-redirection__single:nth-child(even){
    top: 60px;
}

.bloc-redirection__single::before {
    content: "";
    background-image: url('../webp/white-arrow.webp');
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 39px;
    right: 60px;
    display: inline-block;
    width: 35px;
    height: 35px;
    pointer-events: none;
    z-index: 1;
}

.bloc-redirection__single:after {
    border-bottom-width: 25px;
    border-left-width: 25px;
}

.bloc-redirection__link {
    display: flex;
    flex-direction: column;
    color: inherit;
    text-decoration: inherit;
}

.bloc-redirection__link * {
    position: relative;
    z-index: 1;
}

.bloc-redirection__single h3 {
    font-family: Roboto,sans-serif;
    font-size: 50px;
    font-weight: 400;
    line-height: 70px;
    margin-bottom: 17px;
    padding-top: 27px;
    border-top: 1px solid white;
}

.bloc-redirection__single h4 {
    font-family: Archer,sans-serif;
    font-size: 28px;
    line-height: 38px;
    margin: 0 0 20px 0;
}

.bloc-redirection__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}


/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-redirection {
        padding: 0 0 50px 0;
    }

    .bloc-redirection__main {
        grid-template-columns: 1fr;
    }

    .bloc-redirection__single {
        width: 100%;
        max-width: 325px;
        justify-self: auto;
    }

    .bloc-redirection__single:nth-child(even){
        top: 0;
    }

    .bloc-redirection__single h3 {
        font-size: 38px;
        line-height: 50px;
    }

    .bloc-redirection__single h4 {
        font-size: 25px;
        line-height: 30px;
    }
}

/* Bloc Jauge
   ------------------------- */

.bloc-jauge {
    display: flex;
    justify-content: center;
    padding: 30px 80px 80px 80px;
}

.bloc-jauge__container {
    position: relative;
    background-color: white;
    padding: 65px 105px 55px 105px;
    text-align: center;
}

.bloc-jauge__container:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-bottom: 30px solid transparent;
    border-left: 30px solid #f0f0f4;
    width: 0;
}
.bloc-jauge__container:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    border-bottom: 30px solid #f0f0f4;
    border-left: 30px solid transparent;
    width: 0;
}

.bloc-jauge__title {
    margin-bottom: 30px;
    letter-spacing: 1px;
}

.bloc-jauge__desc {
    margin-bottom: 46px;
}

.bloc-jauge__progress {
    position: relative;
    width: 100%;
}

.bloc-jauge__progress::before {
    content: "";
    position: absolute;
    top: -2px;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
    width: 97%;
    background-image: url('../svg/ligne-jauge.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    z-index: 1;
}

.bloc-jauge__line[value] {
    position: relative;
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 35px;
    border: none;
    background-color: white;
}

.bloc-jauge__line[value]::-webkit-progress-bar {
    background-color: transparent;
}
.bloc-jauge__line[value]::-webkit-progress-value {
    background-color: #00B8DE;
}
.bloc-jauge__line[value]::-moz-progress-bar  {
    background-color: #00B8DE;
}

.bloc-jauge__people span {
    font-family: Roboto, sans-serif;
    font-weight: bold;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-jauge {
        padding: 50px 0;
    }

    .bloc-jauge__container {
        padding: 80px 32px 65px 32px;
    }

    .bloc-jauge__title {
        margin-bottom: 15px;
    }

    .bloc-jauge__desc {
        margin-bottom: 30px;
    }

}

@media (max-width: 600px) {
    .bloc-jauge__progress::before {
        background-image: url('../svg/ligne-jauge-mobile.svg');
    }
}

/* Bloc Carousel
   ------------------------- */

.bloc-carousel {
    padding: 0px 0 150px 35px;
}

.bloc-carousel__main:before {
    content:"";
    position: absolute;
    top: -20px;
    left: -20px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 82px;
    height: 82px;
    z-index: -1;
}

/* Bloc Story
   ------------------------- */

.bloc-story {
    padding: 30px 0 80px 0;
}

.bloc-story .testimonial-content-wrapper {
    margin-top: 40px;
    order: 2;
}

.bloc-story .swiper-slide {
    background-color: transparent!important;
}

.bloc-story .brxe-testimonials:before {
    content:"";
    position: absolute;
    top: 40px;
    left: -20px;
    background-image: url('../webp/triangle-fonce-170-tl.webp');
    background-size: contain;
    width: 170px;
    height: 170px;
    z-index: 1;
}

@media (max-width: 767px) {
    .bloc-story .brxe-testimonials:before {
        background-image: none
    }
}

/* Bloc Frise
   ------------------------- */

.bloc-frise {
  padding: 20px 0 100px 35px;
}

.bloc-frise__main  {
    position: relative;
}

.bloc-frise__title {
    margin-bottom: 27px;
}

.bloc-frise__slider {
    position: relative;
    background-color: white;
    padding: 80px 0 80px 60px;
}

.bloc-frise__slider::after {
    content:"";
    position: absolute;
    top: -30px;
    left: -30px;
    background-image: url('../webp/triangle-350-tl.webp');
    background-size: contain;
    display: inline-block;
    width: 192px;
    height: 192px;
    z-index: -1;
}

.carousel-frise .swiper-slide__header:after {
    content: "";
    width: 100%;
    border-bottom: 2px solid #00B8DE;
    position: absolute;
    left: 0;
    top: 12%;
    z-index: 0;
}

.carousel-frise .swiper-slide__header.swiper-slide__separator {
    padding-top: 30px;
}

.carousel-frise .swiper-slide__header.swiper-slide__separator svg {
    box-sizing: content-box;
    background-color: white;
    border-right: 10px solid white;
}

.carousel-frise .swiper-slide__date {
    position: relative;
    display: inline-block;
    font-family: Roboto,sans-serif;
    font-weight: 700;
    font-size: 48px;
    line-height: 58px;
    letter-spacing: 1px;
    background-color: #00B8DE;
    color: white;
    border-right: 10px solid white;
    padding: 10px 36px;
    margin: 0;
    z-index: 1;
}

.carousel-frise .swiper-slide__date:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-bottom: 18px solid transparent;
    border-left: 18px solid #FFFFFF;
    width: 0;
}

.carousel-frise .swiper-slide__content {
    margin-top: 32px;
    padding-right: 130px;
}

#brx-content .carousel-frise .swiper-slide__content a {
    color: #000000;
    text-decoration: none;
}

.carousel-frise .swiper-slide__content-title {
    margin-bottom: 15px;
}

.carousel-frise .swiper-slide__content-extrait {
    margin-bottom: 15px;
}


/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-frise {
        padding: 10px 0 80px 35px
    }

    .bloc-frise .container {
        padding: 0;
    }

    .bloc-frise__title {
        margin-bottom: 7px;
    }

    .bloc-frise__slider {
        position: relative;
        background-color: white;
        padding: 75px 0 75px 35px;
    }

    .bloc-frise__slider::after {
        top: -20px;
        left: -20px;
        width: 125px;
        height: 125px;
    }

    .carousel-frise .swiper-slide__header:after {
        border-bottom: 1px solid #00B8DE;
    }

    .carousel-frise .swiper-slide__date {
        font-size: 35px;
        line-height: 45px;
        border-right: 20px solid white;
        padding: 8px 33px;
    }

    .carousel-frise .swiper-slide__content {
        padding-right: 0;
    }
}

/* Bloc Newsletter
   ------------------------- */

.bloc-newsletter {
    padding: 20px 0 30px 0;
}

.bloc-newsletter__main {
    padding-left: 335px;
}

.bloc-newsletter__form {
    max-width: 700px;
}

.bloc-newsletter__desc h3 {
    color: #14223c;
    margin-bottom: 11px;
}

.bloc-newsletter__mention {
    font-size: 16px;
    line-height: 26px;
}

.bloc-newsletter .bricks-button {
    padding: .5em 3rem;
}

.bloc-newsletter input::placeholder {
    color: rgb(0 0 0 / 50%);
    font-size: 18px;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-newsletter__main {
        padding-left: 0;
    }
    .bloc-newsletter__form {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .bloc-newsletter__mention {
        font-size: 15px;
    }
}

/* Bloc News
   ------------------------- */

.bloc-news {
    padding: 63px 120px 58px 120px;
    background-color: white;
}

.bloc-news__title {
    margin-bottom: 35px;
}

.bloc-news__list .bricks-layout-item {
    padding: 40px 0;
    border-top: 1px solid black;
}

.bloc-news__list .bricks-layout-wrapper[data-layout="list"] > li.bricks-layout-item {
    margin-bottom: 0;
}

/* Type */
#brx-content .bloc-news__list .bricks-layout-item [data-field-id="ykyrxt"] {
    font-family: Archer, sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 28px;
    padding: 12px 30px;
}

/* Titre */
#brx-content .bloc-news__list .bricks-layout-item [data-field-id="aa2212"] a {
    font-family: Roboto, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 35px;
    color: #000;
    text-decoration: none;
}

#brx-content .bloc-news__list .bricks-layout-item [data-field-id="aa2212"] a:hover {
    text-decoration: underline;
}

/* Date et lieu */
#brx-content .bloc-news__list .bricks-layout-item [data-field-id="bntuwv"] {
    font-size: 16px;
    color: #6a6a6a;
    display: flex;
    align-items: center;
}

#brx-content .bloc-news__list .bricks-layout-item [data-field-id="bntuwv"] img {
    margin-right: 12px;
    width: 12px;
    vertical-align: sub;
}

#brx-content .bloc-news__list .bricks-layout-item [data-field-id="bntuwv"] span.sep {
    margin-right: 24px;
    margin-left: 24px;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .bloc-news {
        padding: 65px 0 80px 0;
    }

    .bloc-news__title {
        margin-bottom: 70px;
    }
}

/* Misc
   ------------------------- */

.space-before {
    padding-left: 114px;
}

.bottom-cropped {
    position: relative;
}

.bottom-cropped:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    border-bottom: 45px solid #F0F0F4;
    border-left: 45px solid transparent;
    width: 0;
}

.bottom-cropped-blue {
    position: relative;
}

.bottom-cropped-blue:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    border-bottom: 25px solid #F0F0F4;
    border-left: 25px solid #00B8DE;
    width: 0;
}

@media (max-width: 1024px) {
    .space-before {
        padding-left: 0;
    }
}

/* Bricks Posts list
------------------------- */

#brx-content .posts-list h3 {
    font-size: 20px;
    line-height: 30px;
}

#brx-content .posts-list a {
    color: #000;
    text-decoration: none;
}

/* Filters
   ------------------------- */

.multi-filters__main {
  cursor: pointer;
  font-size: 18px;
  line-height: 30px;
}

.multi-filters__main > select {
  color: #000;
  border-color: #000;
}

/* Projects
   ------------------------- */

.projects {
    padding: 39px 0 120px 0;
}

.projects__title {
    margin-bottom: 40px;
}

.projects__main {
    display: grid;
    justify-content: center;
    justify-items: center;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, calc(33% - 20px));
}

.projects__single {
    position: relative;
    display: inline-block;
    width: 100%;
    max-width: 378px !important;
    background-color: #ffffff;
    justify-self: stretch;
}

.projects__single:nth-child(3n+2){
    top: -73px;
}

.projects__single:first-of-type::before {
    content:"";
    position: absolute;
    top: -40px;
    left: -40px;
    background-image: url('../webp/triangle-350-tl.webp');
    background-size: contain;
    width: 268px;
    height: 268px;
    z-index: -1;
}

.projects__image {
    width: 378px;
    object-fit: cover;
}

.projects__content {
    padding: 46px 25px;
    text-align: center;
}

.projects__content h3 {
    margin-bottom: 0;
    font-size: 24px;
    line-height: 34px;
}

.projects__content p {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 16px;
    color: #6a6a6a;
    line-height: 26px;
}

.projects__content p img {
    margin-right: 10px;
    margin-bottom: 2px;
    width: 14px;
    vertical-align: sub;
}

#brx-content .projects__content h3 > a {
    color: #000;
    text-decoration: none;
}

#brx-content .projects__content h3 > a:hover {
    text-decoration: underline;
}

#brx-content .projects__content .btn-primary {
    padding: 14px 20px;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 1px;
}

/*----- RESPONSIVE -----*/
@media (max-width: 1024px) {
    .projects {
        padding: 19px 0 80px 0;
    }

    .projects__title {
        margin-bottom: 60px;
    }

    .projects__main {
        grid-template-columns: 1fr;
    }

    .projects__single {
        justify-self: auto;
    }

    .projects__single:first-of-type::before {
        top: -20px;
        left: -20px;
        width: 95px;
        height: 95px;
    }

    .projects__single:nth-child(3n+2){
        top: 0;
    }

    .projects__content {
        padding: 30px 5px 65px 5px;
    }

    #brx-content .projects__content .btn-primary {
        font-size: 13px;
        line-height: 16px;
    }
}

/* Plugin Leaflet Map
------------------------- */
/* Pour éviter que les boutons passent au-dessus du menu */
div.leaflet-top {
    z-index: 400;
}

#brx-content div.leaflet-top > div.leaflet-control-zoom a{
    text-decoration: none;
    color: #000;
}