/* CSS du site de Pépite */

/******** SOMMAIRE ************/
/*
/* 00 = FONTS
/* 01 = RESET
/* 02 = STYLES GLOBAUX = client.css
/* 03 = STRUCTURE
/* 04 = HEADER
/* 05 = FOOTER
/* ==== PAGES ====
/* 06 = ACCUEIL
/* 07 = PAGE INTERNE
/* 08 = ACTUALITÉS
/* 09 = AGENDA
/* 10 = ANNUAIRE
/* 11 = RECHERCHE
/* 12 = MÉDIATHÈQUE
/* 13 = VIDÉOTHÈQUE
/* 14 = SOMMAIRE
/* 15 = PUBLICATIONS
/* ==== MODULES ====
/* 16 = BREADCRUMBS
/* 17 = OUTILS ET PARTAGE
/* 18 = FORMULAIRE
/* 19 = PAGINATION
/* 20 = DIAPORAMA & GABARITS DE FICHIERS
/* 21 = MODALES
/* 22 = LOGIN
/* 23 = PROFILS
/* 24 = MÉTÉO
/* 25 = LEAFLET
/* 26 = MENUS
/* 27 = FAQ
/* 28 = COOKIE CONSENT
/* 29 = PRINT
/*
/* RESPONSIVE
/*
/******************************/

/* 00 = FONTS */
@font-face {
  font-family:"black";
  src:url('../Fonts/AlegreyaSans-Black.otf') format('truetype')
}
@font-face {
  font-family:"black_italic";
  src:url('../Fonts/AlegreyaSans-BlackItalic.otf') format('truetype')
}
@font-face {
  font-family:"bold_italic";
  src:url('../Fonts/AlegreyaSans-BoldItalic.otf') format('opentype')
}
@font-face {
  font-family:"extraBold";
  src:url('../Fonts/AlegreyaSans-ExtraBold.otf') format('truetype')
}
@font-face {
  font-family:"light_italic";
  src:url('../Fonts/AlegreyaSans-LightItalic.otf') format('truetype')
}
@font-face {
  font-family:"medium";
  src:url('../Fonts/AlegreyaSans-Medium.otf') format('truetype')
}
@font-face {
  font-family:"medium_italic";
  src:url('../Fonts/AlegreyaSans-MediumItalic.otf') format('truetype')
}
@font-face {
  font-family:"regular";
  src:url('../Fonts/AlegreyaSans-Regular.otf') format('truetype')
}
@font-face {
  font-family:"thin";
  src:url('../Fonts/AlegreyaSans-Thin.otf') format('truetype')
}
@font-face {
  font-family:"light";
  src:url('../Fonts/AlegreyaSans-Light.otf') format('truetype')
}


/* 01 = RESET */
img, svg {
    vertical-align: unset;
}
figure .caption {
    padding-top: unset;
    font-size: 0.9rem;
    opacity: 1;
}
.frame {
    padding-top: unset;
    padding-bottom: unset;
}
.frame-container {
    padding-right: unset;
    padding-left: unset;
}
.frame-layout-4 {
    padding: 25px;
}
.frame-size-default.frame-background-none.frame-space-after-none:not(.frame-ruler-after):not(.frame-has-backgroundimage):not(.frame-layout-embedded)+.frame-size-default.frame-background-none.frame-space-before-none:not(.frame-ruler-before):not(.frame-has-backgroundimage):not(.frame-layout-embedded) {
    --frame-outer-spacing-before: unset;
}
    .frame-layout-4 .bloc-highlight-yellow .textmedia-gallery {
        /*margin: 15px 0 30px 0;*/
    }
        .frame-layout-4 .bloc-highlight-yellow .image .caption {
            max-width: 200px;
        }
.textmedia-text>*:last-child {
    margin-bottom: 20px;
}
.textmedia .gallery-row {
    justify-content: center;
    margin-bottom: 1.5em;
}
.textmedia-above .gallery-row {
    justify-content: center;
}
.textmedia-left .gallery-row {
    justify-content: flex-start;
}
.textmedia-right .gallery-row {
    justify-content: flex-end;
}

/* 02 = STYLES GLOBAUX */
#main-content .link-button {
    display: inline-block;
    background: none;
    text-transform: uppercase;
    padding: 10px 20px;
    border: 1px solid #e61d49;
    color: #e61d49;
    border-radius: 30px;
    cursor: pointer;
    letter-spacing: 2px;
    font-size: 1rem;
}
#main-content .link-button:is(:focus, :hover, :active) {
    background: #e61d49;
    color: #fff;
}
.frame a[class=""], .frame a:not([class]) {
    color: #002b40;
}
.link-mail:after,
.link-page:after,
.link-external:after {
    content: unset;
}
ul.list-normal,
ul:not(.list-unstyled),
ol {
    padding-left: 40px;
}
strong {
    font-family: "medium",arial;
}
p {
    padding: 0;
}


/* 03 = STRUCTURE */
body {
    line-height: 1.2;
}


/* 04 = HEADER */
#header {
    height: 97px;
}
    #header .wrap-header {
        padding-bottom: 5px;
        background-color: #fff;
    }
:not(.home) #banner .ce-gallery {
    margin-left: 10px;
}


/* 05 = FOOTER */
footer {
    display: block;
}
    footer .inner .frame-header {
        margin-bottom: 5px;
    }
        footer .inner .element-header {
            padding-top: 0;
            color: #002b40;
            font-size: 1.3rem;
            font-family: "extraBold",arial;
            text-transform: unset;
        }
        footer .inner a {
            text-decoration: underline;
        }
        footer .inner a:is(:focus, :hover, :active) {
            color: #002b40;
        }
            .ce-gallery .ce-media img {
                width: 30px;
            }


/* 06 = ACCUEIL */
.home #content article > div .element-header {
    text-align: center;
    letter-spacing: 3px;
}
.home #content .wrap-background-yellow .background-yellow .content .element-header {
    padding: 0;
    text-align: left;
}
.home #content .wrap-background-yellow .gallery-row {
    display: block;
}
    .home #content .wrap-background-yellow .gallery-item {
        width: unset;
    }
        .home #content .wrap-background-yellow .image {
            padding: 0;
            max-width: 100%;
        }


/* 07 = PAGE INTERNE */
/* Tableaux */
.table thead th,
.table th,
.table-bordered th, .table-bordered td,
.table-bordered th, .table-bordered td {
    border-color: #f5f5f5;
}
.table td {
    border-top: none;
    border-bottom: 1px solid #f5f5f5;;
}

li {
    list-style: inherit;/* Les puces sont enlevées par défaut ! */
}

/* Accordions */
.accordion-item,
.accordion-item:first-of-type,
.accordion-item:last-of-type {
    border: none;
    border-radius: 0;
    margin-bottom: 20px;
}
    .accordion-header {
        font-family: "extraBold",arial;
        font-size: 1.7rem;
        font-weight: 400;
        color: #e61d49;
        margin: 0;
        padding: 20px 0 0 0;
    }
        .accordion-button {
            position: relative;
            display: block;
            width: 100%;
            text-align: left;
            border: none;
            background: #f5f5f5;
            padding: 15px 62px 15px 20px;
            margin: 0;
            font-size: 1.5rem;
            font-family: "extraBold",arial;
            cursor: pointer;
            transition: all .25s;
        }
        .accordion-button:not(.collapsed) {
            border-color: unset;
            box-shadow: unset;
            background: #f5f5f5;
            color: #002b40;
        }
        .accordion-button:is(:focus, :hover, :active) {
            border-color: unset;
            box-shadow: unset;
            background: #e61d49;
            color: #fff;
        }
        button:focus:not(:focus-visible) {
            outline: unset;
        }
            .accordion-button::after {
                content: "";
                position: absolute;
                top: 50%;
                right: 20px;
                display: block;
                width: 30px;
                height: 30px;
                background-image: url(../Img/toggle-off.svg);
                background-repeat: no-repeat;
                background-position: center;
                background-size: auto;
                transform: translate(0, -50%);
            }
            .accordion-button:is(:focus, :hover, :active)::after {
                background-image: url(../Img/toggle-off-hover.svg);
                transform: translate(0, -50%);
            }
            .accordion-button:not(.collapsed)::after {
                background-image: url(../Img/toggle-on.svg);
                transform: translate(0, -50%);
            }
            .accordion-button:not(.collapsed):is(:focus, :hover, :active)::after {
                background-image: url(../Img/toggle-on-hover.svg);
            }
        .accordion-collapse {
            padding: 20px 20px 0 20px;
            border: 1px solid #f5f5f5;
        }

/* Menu - Plan du site */
.page-729 #content article a {
    background: none;
}
.page-729 #content article a:is(:focus, :hover, :active) {
    color: #e61d49;
}


/* 08 = ACTUALITÉS */
/* Liste */

/* Single */
.page-737 .gallery-item {
    width: unset;
}

/* Reportages - Liste */

/* Reportages - Single */
.page-713 .gallery-item {
    width: unset;
}


/* 09 = AGENDA */
/* Single */
.detail-single .header .category {
    display: block;
    margin: -15px 0 10px;
    font-size: 1.25em;
    font-weight: 600;
}
.detail-single .date-container {
    max-height: 190px;
    margin-bottom: 1em;
    width: 100%;
    overflow: hidden scroll;
}
    .date-container .date-passed-title {
        color: grey;
    }
    .date-container .date-passed {
        /*display: none;*/
        color: grey;
        text-decoration: line-through;
    }
.detail-single .row-events {
    flex-direction: column;
    margin-top: 40px;
}
    .row-events .col {
        width: 100%;
    }
        .row-events h6 {
            padding-top: 0;
        }
        .row-events .location {
            margin-bottom: 1em;
        }
            .location .location-title {
                color: #e61d49;
                font-weight: 600;
            }
            .row-events .practical-info-item {
                display: flex;
            }
                .practical-info-item .fa-light {
                    display: block;
                    min-width: 35px;
                    color: #e61d49;
                    font-size: 24px;
                }
                .location .location-text {
                    margin: 20px 0;
                }
                    .location .location-text p {
                        margin-bottom: 10px;
                    }
                        .location .location-text p > br {
                            display: none;
                        }
            #main-content .geoMap a {/* Surcharge styles site */
                background: #fff;
                color: #000;
            }

/* 11 = RECHERCHE */
progress::-webkit-progress-bar {
    border-radius: 5px;
    background-color: #e1e1e1;
}
progress::-webkit-progress-value {
    border-radius: 5px;
    background-color: #e8244b;
}
.page-735 #main-content nav.page-navigation {
    margin-top: 20px;
}
.page-735 #main-content .link {
    background-image: unset;
}
.page-735 #main-content a:hover {
    color: #e8244b;
}
.search-filters-list .icon,
.search-type .icon {
    border: 1px solid #e8244b;
}
.search-filters-list .link:hover .icon,
.search-filters-list .link:focus .icon,
.search-filters-list .link:active .icon {
    background-color: #e8244b;
}


/* 18 = FORMULAIRE */
.news-search-form .form-group {
    margin-bottom: 0;
}
    .powermail_form .powermail_fieldwrap input,
    .powermail_form .powermail_fieldwrap textarea,
    .powermail_form .powermail_fieldwrap select {
        font-size: .667em;
    }
/* Sondages */
.frame-poll-frame .frame-container {
    margin: 0;
    max-width: inherit;
    background-color: #e61d49;
    box-shadow: -6px 6px 10px #e7decf;
}
    .frame-inner .frame-poll-frame {
        padding: 30px 0;
    }
        .frame-poll-frame .form-horizontal {
            margin: 0 auto;
            padding: 0 20px;
            max-width: 500px;            
            color: #f5f5f5;            
        }
            .frame-poll-frame .form-horizontal .obligatoires,
            .frame-poll-frame .form-horizontal abbr[title] {
                display: none;
            }
            .frame-poll-frame .form-horizontal .form-group,
            .frame-poll-frame .form-horizontal .text-center {
                margin-bottom: 0;
            }
            .frame-poll-frame .form-horizontal .form-group {
                margin: 0 auto;
                max-width: 320px;
            }
                .frame-poll-frame .form-horizontal .submit {
                    display: inline-block;
                    border: 0px;
                    border-radius: 20px;
                    height: auto;
                    min-height: 40px;
                    margin: 20px auto 0;
                    padding: 10px 20px;
                    width: 120px;
                    background: rgb(0, 43, 64);
                    color: rgb(255, 255, 255);
                    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
                    font-size: 1.125rem;
                    line-height: 150%;
                    cursor: pointer;
                    vertical-align: top;
                    white-space: nowrap;
                }



/* 19 = PAGINATION */
#main-content nav.page-navigation ul li a,
#main-content nav.page-navigation ul li a:is(:focus, :hover, :active) {
    border-radius: 0;
    box-shadow: none;
}
#main-content nav.page-navigation ul li:is(:first-child, :last-child) a {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
#main-content nav.page-navigation ul li a.current {
    z-index: 1;
    color: #fff;
    background-color: #002b40;
    border-color: #002b40;
}


/* 28 = COOKIE CONSENT */
.modal-cookie-consent-footer :is(.modal-cookie-consent-btn-accept, .modal-cookie-consent-btn-reject) {
    background-color: #e8244b;
    color: #fff;
}


/* ADD CSS callage v13 */
.accordion-content-left .accordion-content-media {
    order: 2;
}
.accordion-content-left .accordion-content-text {
    order: 1;
}



/* RESPONSIVE ********************************************************************************************* */

@media screen and (min-width: 48rem) {

/* 01 = RESET */
    .frame-layout-4 {
        padding: 50px;
    }
        .frame-layout-4 .bloc-highlight-yellow .textmedia-gallery {
            /*float: left;
            margin: 0;
            margin-left: -60px;
            padding-right: 45px;*/
        }
        .frame-layout-4 .bloc-highlight-yellow .textmedia-text {
            overflow: hidden;
        }

}


@media screen and (min-width: 992px) {/* TABLETTES  ************************************************ */

/* 09 = AGENDA */
    /* Single */
    .detail-single .row-events {
        flex-direction: row;
    }
        .row-events .col {
            width: 50%;
        }

}


@media screen and (min-width: 64rem) {

/* 04 = HEADER */
    #header {
        height: 110px;
    }
        #header .wrap-header {
            height: 110px;
        }

/* 06 = ACCUEIL */
    .home #content article > div .element-header {
        margin-bottom: 50px;
    }
    .home #content .wrap-background-yellow .background-yellow .content .element-header {
        font-size: 3.125rem;
        max-width: 33.3%;
        line-height: 3.3rem;
    }

}


@media screen and (min-width: 75rem) {

/* 01 = RESET */
    .frame-layout-4 .bloc-highlight-yellow .textmedia-gallery {
        /*margin-left: -100px;*/
    }
        .frame-layout-4 .bloc-highlight-yellow .image .caption {
            max-width: 300px;
        }

}
