/******************* Styles Refonte PAD 2021 *******************/
    /* Feuille de style de la refonte 2021 du site de la Philharmonie à la demande
/* Réalisée par Christophe Leonardi

Référenciel de classes : 

refonte2021 : classe de propriété
couleur pro : add class pro aux boutons et liens 
multicolonnage : class x-col suivie de _2-col ou _3-col
image taillée à la boite parente : div.crop-image > img

page-sommaire : classe de page avec template sur 2 col, widget droite : sommaire


Référenciel des classes css : 
.refonte2021 : super classe css de la refonte
.page-pro : styles pad pro
.round-item : appliquer border-radius à la boite


.pro : couleur pad pro sur liens
.btn.btn-default : bouton classique
.btn-list : bouton en ligne (classe à appliquer sur boite parente)
.large : Gros bouton

Placement :
.left / .center / .right : placement de la balise

Images :
.crop-image : image rognée sur une taille de boite spécifique
.corpus / crop-thumb : taille du crop-image
.imgH300px : img height 300px
.hero : height 600px, max 50vh

Encarts :
.encart-infos : encart fond gris avec icone info
.wide-link : encart infos avec lien en 100%
.note-page : style des notes de bas de page
.discrete : encart sans fond hierarchie moins importante

Colonnage :
.x-col : style généraux des colonnages
._2-col / ._3-col / ._col-1-3_2-3 / ._col-2-3_1-3 : nombre de colonnes / taille des colonnes
alignements des colonnes : .top-items
.verticaly-centered : alignement centre vertical des éléments

Colonnage Ermes :
.entete sur encart entete
.first-content : style du premier encart de contenu

List : 
.with-puce : mettre la puce framboise

Pictos : 
.cl-ext-link
.cl-download-link

Accordéons : 
Ajouter la classe cl-accordion à l'encart

Défillement : 
.js-scrollTo

Titrage des encarts ermes (in name field) :
.st-ermes

/* SOMMAIRE
/* 1. Styles Généraux */
    /* 2. Fil d'ariane */
    /* 3. Entete des pages */
    /* 4. Corps de page */
    /* 5. Menu secondaire */
    /* 6. Tableaux */
    /* 7. Accordéons */
    /* XX. Responsive */
    /* END OF FILE : Style extrait des feuilles css des autres sites, à fusionner */
    /***********************************************/
    /* 1. Styles Généraux */
    /* Chargement des styles in encart (à supprimer lorsque la stylesheet sera dans le head + supprimer les encarts) >> Penser à modifier l'appel de la premiere zone d'encart */
    
    @font-face {
        font-family: 'philharmoniquebold';
        src: url('../philharmonique-bold-webfont.eot');
        src: url('../philharmonique-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../font/philharmonique-bold.woff2') format('woff2'), url('../font/philharmonique-bold.woff') format('woff'), url('../font/philharmonique-bold.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    
    @font-face {
        font-family: 'Philharmonique Regular';
        src: url('../font/philharmonique-regular-webfont.eot');
        src: url('../font/philharmonique-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../font/philharmonique-regular.woff2') format('woff2'), url('../font/philharmonique-regular.woff') format('woff'), url('../font/philharmonique-regular.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    
    @font-face {
        font-family: 'Philharmonique SemiBold';
        src: url('../philharmonique-semibold-webfont.eot');
        src: url('../philharmonique-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../font/philharmonique-semibold.woff2') format('woff2'), url('../font/philharmonique-semibold.woff') format('woff'), url('../font/philharmonique-semibold.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    
    #page:not() div#zone-2>div.cl-hide {
        display: none;
    }
    
    .refonte2021 .cl-hide {
        display: none;
    }
    
     :root {
        --pad-primary-color: #FDCF77;
        --pad-secondary-color: #FFBD70;
        --pad-light-color: #FDF5E4;
        --pro-primary-color: #267074;
        --pro-secondary-color: #1B464A;
        --philharmonie-primary-color: #001B3B;
        --background-color: #e6e6e6;
        --encart-color: #fff;
        --medium-grey: #ccc;
        --light-grey: #f5f5f5;
        --light-grey-50: #fafafa;
        --pad-gradient: linear-gradient(to bottom, rgba(0, 27, 59, .2) 0%, rgba(0, 27, 59, 0.5) 40%, rgba(0, 27, 59, 0.8) 99%);
        --pro-gradient: linear-gradient(180deg, rgba(36, 112, 116, 0.2) 0%, rgba(36, 112, 116, 0.6) 50%, rgba(36, 112, 116, 0.9) 100%);
        --exergue-pad: #cd2453;
        --pad-primary-fade: rgba(253, 207, 119, 0.3);
        --pro-primary-fade: rgba(38, 112, 116, 0.15);
        --philharmonie-font-regular: 'Philharmonique Regular', sans-serif;
        --philharmonie-font-bold: 'Philharmonique SemiBold', sans-serif;
        --paragraph-font: 'SourceSansPro', 'Source Sans Pro', SourceSansPro, sans-serif;
        --philharmonie-dark-green: #446249;
        --philharmonie-dark-grey: #403E3D;
    }
    
    .refonte2021 h1 {
        font-family: var(--philharmonie-font-regular) !important;
        text-transform: uppercase !important;
    }
    
    .refonte2021 h2 sup {
        font-family: var(--paragraph-font);
        text-transform: lowercase !important;
    }
    
    .refonte2021 h2 span,
    .refonte2021 h2 {
        font-family: var(--philharmonie-font-bold) !important;
        text-transform: uppercase !important;
    }
    
    .refonte2021 .h2Subtitle {
        font-family: var(--philharmonie-font-regular) !important;
        text-transform: uppercase !important;
    }
    
    .refonte2021 #portal .sousTitre,
    .refonte2021 h5,
    .refonte2021 h6 {
        font-family: var(--paragraph-font) !important;
    }
    
    .refonte2021 ol {
        padding-left: 1em;
        margin-bottom: 12px;
    }
    
    .refonte2021 .note-page {
        font-style: italic;
    }
    
    .refonte2021 sup a,
    .refonte2021 .note-page a {
        font-size: 0.9em;
    }
    
    .refonte2021 #zone-2 {
        position: static;
    }
    
    .full-width.content-page.refonte2021 #page div[id^=zone-]:not(#zone-5)>div:not(div:nth-child(2))>.frame.yellow-background {
        background-color: #FDF5E4;
        background-clip: border-box;
        padding: 2vw 5vw !important;
    }
    
    .refonte2021 .encart-infos .title-image {
        align-items: center;
    }
    
    .refonte2021 .title-image {
        display: flex;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        margin-top: 1em;
    }
    
    .refonte2021 .title-image img {
        margin: 0 0 10px;
        max-height: 30px;
        max-width: 40px;
    }
    
    .refonte2021 .title-image h2 {
        text-align: center!important;
        margin-top: 0.5em;
        /* MEDIA/media.css 10977-10997 */
    }
    
    .refonte2021 .title-image .h2Subtitle {
        font-size: 0.5em;
        text-align: center!important;
        /* MEDIA/media.css 10977-10997 */
    }
    
    .refonte2021 .title-image .small-icon {
        height: 30px;
        max-width: 30px;
    }
    
    .refonte2021 .title-image .picto-house,
    .refonte2021 .title-image .small-icon {
        position: relative;
        bottom: 5px;
    }
    
    .refonte2021 .title-image .picto-house {
        bottom: 9px;
    }
    
    .refonte2021 .title-image h3 {
        margin: 0;
    }
    
    .refonte2021 main div:not(.menu-type) a:not(.btn),
    .refonte2021 main div:not(.menu-type) a:not(.btn):hover,
    .refonte2021 div:not(#ariane) p a {
        text-decoration: underline !important;
        /* media.css l.757 */
        color: var(--philharmonie-primary-color);
    }
    
    body.refonte2021 {
        background-color: var(--background-color) !important;
        /* Todo : Remove !important media.css l.1037 */
    }
    
    .refonte2021 li.left,
    .refonte2021 a.left,
    .refonte2021 p.left {
        text-align: left;
    }
    
    .refonte2021 .uppercase {
        text-transform: uppercase;
    }
    
    .refonte2021 .btn {
        white-space: normal;
    }
    
    .refonte2021 .btn::first-letter {
        text-transform: capitalize;
    }
    
    .refonte2021 .btn.left {
        margin-left: 0;
    }
    
    .refonte2021 .btn-list {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
    }
    
    .refonte2021 .btn-list .btn {
        margin: 1em;
    }
    
    .refonte2021 .x-col.btn-list {
        margin: 0;
    }
    
    .refonte2021 .x-col.btn-list .btn {
        margin: 0 0 1.5em 0;
    }
    
    .refonte2021 .round-item {
        border-radius: 16px;
    }
    
    .refonte2021 .btn.btn-default:not(#submit-search) {
        border-radius: 25px;
        margin-top: 1em;
        margin-bottom: 1em;
        display: block;
    }
    
    .refonte2021 .btn.center {
        margin: 1em auto;
    }
    
    .refonte2021 a.pro,
    .refonte2021 input.pro,
    .refonte2021 button.pro {
        background-color: var(--pro-primary-color) !important;
        /* media.css l.770 */
        color: var(--encart-color) !important;
        /* media.css l.770 */
    }
    
    .refonte2021 a.pro:hover,
    .refonte2021 input.pro:hover,
    .refonte2021 button.pro:hover {
        background-color: var(--pro-secondary-color) !important;
        /* media.css l.770 */
    }
    
    .refonte2021 .crop-image {
        position: relative;
        overflow: hidden;
        height: 100%;
        width: 100%;
    }
    
    .refonte2021 .crop-image img:not(.logo-pro) {
        position: absolute;
        min-width: 100%;
        min-height: 100%;
        object-fit: cover;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 0;
    }
    
    .refonte2021 div.overlay {
        width: 100%;
        height: 100%;
        z-index: 1;
        position: relative;
        bottom: 100%;
        left: 0;
    }
    
    .refonte2021 .x-col {
        margin-top: 3.12%;
    }
    
    .refonte2021 .x-col .verticaly-centered {
        align-self: center;
    }
    
    .refonte2021 .apres-titre-seul h4>span,
    .refonte2021 .apres-titre-seul h4,
    .refonte2021 .apres-titre-seul h3>span,
    .refonte2021 .apres-titre-seul h3,
    .refonte2021 h2>span,
    .refonte2021 h2 {
        margin: 0 0 0.5em;
    }
    
    .refonte2021 h3 span,
    .refonte2021 h3 {
        font-family: var(--paragraph-font);
        font-weight: bold;
        margin-top: 1em;
        margin-bottom: 0.5em;
    }
    
    .refonte2021 h4 span,
    .refonte2021 h4 {
        font-family: var(--paragraph-font);
        font-weight: 600;
        margin-top: 1em;
        margin-bottom: 0.5em;
    }
    
    .refonte2021 .important-title,
    .refonte2021 .cl-accordion h4.important-title,
    .refonte2021 h4.important-title span,
    .refonte2021 h4.important-title {
        margin: 2.5em 0 1.5em;
        font-size: 1.2em;
        text-transform: uppercase;
    }
    
    .refonte2021 .entete.encart h3 {
        font-family: var(--philharmonie-font-bold);
        text-transform: uppercase;
        font-weight: bold;
    }
    
    .refonte2021 .x-col>*:not(section) {
        margin-bottom: 31px;
    }
    
    body.refonte2021.full-width {
        background-color: var(--encart-color) !important;
    }
    
    .refonte2021.full-width #page {
        padding-bottom: 2em;
    }
    
    .refonte2021 .backDarkBlue {
        background-color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 .backDarkGreen {
        background-color: var(--philharmonie-dark-green);
        padding-bottom: 2rem;
    }    
    
    .refonte2021 .backDarkGreen:not(.encart-img-text-plain) {
        border-radius: 0 !important;
    }
    
    .refonte2021 .backDarkGrey {
        background-color: var(--philharmonie-dark-grey);
    }
    
    .refonte2021 .backLightYellow {
        background-color: var(--pad-light-color);
        padding-bottom: 2rem;
    }

    /* Ony Brunella - 05/2024 - refonte page d'accueil PAD */

    /* light blue grey : #EDEFF1 */

    .refonte2021 .backLightBlue {
        background-color: #EDEFF1;
    }


      /* Ony Brunella - Fin */
    
    .refonte2021 .backDarkGrey p,
    .refonte2021 .backDarkGreen p,
    .refonte2021 .backDarkBlue p,
    .refonte2021 .backDarkGrey h2,
    .refonte2021 .backDarkGreen h2,
    .refonte2021 .backDarkBlue h2 {
        color: #fff;
    }
    /* List */
    
    .refonte2021 ul.with-puce,
    .refonte2021 ul.site-link,
    .refonte2021 .encart-infos ul {
        margin-left: 1em;
    }
    
    .refonte2021 ul.with-puce li,
    .refonte2021 ul.site-link li,
    .refonte2021 .encart-infos ul li {
        line-height: 1.5;
        margin-bottom: 0.5rem;
        list-style-type: disc;
    }
    
    .refonte2021 .encart-infos ul li:last-child {
        margin-bottom: 0;
    }
    
    .refonte2021 .false-list,
    .refonte2021 ul.with-puce li::marker,
    .refonte2021 ul.site-link li::marker,
    .refonte2021 .encart-infos ul li::marker {
        color: var(--exergue-pad)
    }
    
    .refonte2021 ul.site-link li h3,
    .refonte2021 .encart-infos ul li h3 {
        margin: 1em 0 0;
    }
    
    .refonte2021 ol li::marker {
        color: var(--exergue-pad);
    }
    
    .refonte2021 ol li {
        padding-left: 0.5em;
        line-height: 1.5;
    }
    /* Link text icon */
    
    .refonte2021 .cl-ext-link {
        background: transparent url(/ui/skins/MEDIA/refonte-pad/img/link.svg) center right no-repeat;
        padding-right: 18px;
    }
    
    .refonte2021 a:not(.btn).cl-download-link {
        background: transparent url(/ui/skins/MEDIA/refonte-pad/img/download.svg) center right no-repeat !important;
        /* MEDIA/media.css 	862 */
        padding-right: 18px;
        margin-right: 4px;
        padding-bottom: 2px;
    }
    
    .refonte2021 .btn.cl-download-link::after,
    .refonte2021 .btn.cl-download-link-light::after {
        display: inline-block;
        width: 15px;
        margin-left: 5px;
        position: relative;
        top: 2px;
    }
    
    .refonte2021 .btn.cl-download-link::after {
        content: url(/ui/skins/MEDIA/refonte-pad/img/download.svg);
    }
    
    .refonte2021 .btn.cl-download-link-light::after {
        content: url(/ui/skins/MEDIA/refonte-pad/img/download-w.svg);
    }
    
    .refonte2021 ul.puce-check {
        margin-left: 0;
    }
    
    .refonte2021 ul.large li {
        font-size: 1.5em;
    }
    
    .refonte2021 #portal ul.puce-check li {
        background: url(/ui/skins/MEDIA/refonte-pad/img/check.svg) no-repeat;
        padding-left: 30px;
        list-style-type: none;
        margin: 0.5em 0;
        background-size: 20px;
        background-position: 0px 8px;
    }
    /* Other */
    
    .refonte2021 img+p {
        margin-top: 2em;
    }
    /* 3. Entete des pages */
    
    .refonte2021 #portal .entete.texte-seul h1,
    .refonte2021 #portal .entete.texte-seul .sousTitre,
    .refonte2021 #portal .entete.texte-seul .surTitre {
        color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 #portal h1 {
        text-transform: unset;
        line-height: 1.6em;
        /* To do : media.css 410 */
        font-size: 3.25rem !important;
        /* philharmonie.css 8450 */
    }
    
    .refonte2021 h2 span:not(.center),
    /* To remove for important */
    
    .refonte2021 h2 {
        text-align: left !important;
        /* MEDIA/media.css 10977-10997 */
    }
    
    .refonte2021 #portal .sousTitre {
        font-size: 1.2rem;
        width: 100% !important;
        /* media.css l.1104 */
        max-width: 1100px !important;
        /* media.css l.1104 */
        margin: auto;
    }
    
    .refonte2021 #page div[id^=zone-]>div:nth-child(2) {
        margin: 0;
    }
    
    body:not(.home) #page .panel-collapse .panel-body {
        padding: 5px!important;
    }
    
    body:not(.home) #page .cms-inner-layout .cms-inner-zone .frame-ermes-carousel>.frame-standard>.panel-body,
    body:not(.home) #page .cms-inner-layout .cms-inner-zone .frame-ermes-carousel>.frame-standard>.panel-footer,
    body:not(.home) #page .cms-inner-layout .cms-inner-zone .frame-ermes-carousel>.frame-standard>.panel-heading,
    body:not(.home) #page .panel-body,
    body:not(.home) #page .panel-footer,
    body:not(.home) #page .panel-heading,
    .refonte2021 .container,
    body:not(.home).refonte2021 #page .panel-body {
        padding-left: 0 !important;
        /* Todo : Remove !important in media.css l.3890 */
        padding-right: 0 !important;
        /* Todo : Remove !important in media.css l.3890 */
        padding: 0 !important;
        /* Todo : Remove !important in media.css l.3890 */
    }
    
    .refonte2021 .background {
        min-height: 550px;
        width: 100vw;
        position: absolute;
        top: 0%;
        left: 0;
        z-index: -1;
        height: 70vh;
    }
    .refonte2021 .entete.spe-syracuse{
        position: relative;
    }
    .refonte2021 .entete.spe-syracuse .content{
        position: relative;
        z-index: 1;
    }
    .refonte2021 .entete.spe-syracuse .background{
        min-height: unset;
        max-height: 320px !important;
        width: 100%;
        position: absolute;
        top: 0;
        left: unset;
        z-index: 0;
        height: 70vh;
        overflow: hidden;
    }
    .refonte2021 .entete.spe-syracuse .crop-image {
        position: relative;
        overflow: hidden;
        height: 100%;
        width: 100%;
        z-index: unset;
    }
    .refonte2021 [id^=zone-]>div div.frame:not(.entete):not(.sidebar-sommaire).background-pro {
        background-color: var(--pro-primary-color);
        padding-bottom: 1em;
    }
    
    .refonte2021 [id^=zone-]>div div.frame:not(.entete):not(.sidebar-sommaire).background-pro .btn {
        margin-bottom: 2em;
    }
    
    .refonte2021 a.btn-default.btn.large {
        padding: 1rem 2rem;
        font-size: 1.5em;
    }
    
    .refonte2021 a.btn-default.btn.white {
        background-color: #fff !important;
        color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 a.btn-default.btn.white:hover {
        background-color: rgb(235, 235, 235) !important;
    }
    
    .refonte2021 .background-pro * {
        color: #fff;
    }
    
    .refonte2021 .frame.frame-ermes-carousel.entete {
        min-height: 270px;
    }
    
    .refonte2021 article.entete {
        padding: 1em 0;
        /*         position: relative;
 */
    }
    
    .refonte2021 .entete .content {
        width: fit-content;
        -o-width: fit-content;
        -ms-width: fit-content;
        -moz-width: fit-content;
        -webkit-width: fit-content;
        padding: 0 3em;
        margin: 2.5em auto 1.5em;
        display: flex;
        flex-direction: column;
    }
    
    .refonte2021 #portal .entete h1,
    .refonte2021 .entete p {
        color: var(--encart-color);
    }
    
    .page-pro.refonte2021 .background .overlay.blue,
    .refonte2021 .background .overlay {
        background: var(--pad-gradient);
    }
    
    .page-pro.refonte2021 .background .overlay {
        background: var(--pro-gradient);
    }
    
    .refonte2021 .entete .content h1 {
        order: 2;
    }
    
    .refonte2021 .entete .content .surTitre {
        order: 1;
    }
    
    .refonte2021 .entete .content .sousTitre {
        order: 3;
    }
    /* Variante order entete avec logo */
    
    .refonte2021 img.entete-logo {
        width: 70px;
        margin: auto;
    }
    
    .refonte2021 .entete-logo .entete .content h1 {
        order: 3;
    }
    
    .refonte2021 .entete-logo .entete .content .surTitre {
        order: 1;
    }
    
    .refonte2021 .entete-logo .entete .content .sousTitre {
        order: 4;
    }
    
    .refonte2021 .entete .content a,
    .refonte2021 .entete-logo .entete .content img {
        order: 5;
    }
    
    .refonte2021 .entete .content .surTitre {
        text-align: center;
        margin: 0 auto 1em;
        font-weight: bold;
        font-size: 14px;
    }
    
    .refonte2021 .entete .content .surTitre::after {
        content: "";
        display: block;
        width: 40px;
        height: 1px;
        background-color: #fff;
        margin: 10px auto 0;
    }
    /* 4. Corps de page */
    /* style page pro spe, completion existant pour mise à la charte */
    
    .refonte2021 h2.center {
        text-align: center !important;
        margin-top: 2em;
    }
    
    .refonte2021 .home-pro-container {
        justify-content: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .refonte2021 .encart-infos.home-pro {
        padding: 30px 10px 5px !important;
        max-width: 360px;
        border: 2px solid transparent !important;
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .encart-infos.home-pro.principal {
        background-color: var(--pro-primary-color);
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .encart-infos.home-pro.principal:hover {
        background-color: var(--pro-secondary-color);
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .encart-infos.home-pro.principal * {
        color: #fff;
    }
    
    .refonte2021 main div:not(.menu-type) .encart-infos.home-pro:hover {
        text-decoration: none !important;
        border: 2px solid var(--pro-primary-color) !important;
        /* media.css 820 */
        box-shadow: 10px 15px 39px -3px rgb(0 0 0 / 12%);
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .encart-infos.home-pro img {
        width: 60px;
        display: block;
        margin: auto;
    }
    
    .refonte2021 .first-content a.encart-infos.home-pro {
        text-decoration: none !important;
        text-align: center;
        min-height: 260px;
    }
    /* Begin overide selection théma */
    
    .refonte2021 #portal h1,
    body.refonte2021.select-thema-modele .cms-inner-layout,
    .refonte2021 #page div[id^=zone-]:not(#zone-5)>div:not(div:nth-child(2)) {
        max-width: 1600px;
        margin: 0 auto;
        width: 100%;
    }
    
    .refonte2021 #portal h1 {
        max-width: 1200px;
    }
    
    body.select-thema-modele .cms-inner-layout>.row {
        justify-content: space-between;
    }
    
    body.select-thema-modele .cms-inner-layout>.row::before {
        content: unset;
    }
    
    .page-sommaire.refonte2021 #page .row div[id^=zone-]:not(#zone-2) {
        margin: 0;
    }
    
    .page-sommaire.refonte2021 #page .row div[id^=zone-]:not(#zone-2):first-child {
        width: 100%;
    }
    /*     .refonte2021 #page .row div[id^=zone-]:not(#zone-2) div[id^=frame-] {
        border-bottom: unset;
    } */
    
    .refonte2021 #page .row div .sidebar-sommaire {
        width: calc(100% * 0.33);
        flex-basis: unset;
        position: fixed;
        left: calc(100vw + 100% * 0.33);
        transition: .2s ease-in-out;
        display: none;
        background: var(--encart-color);
    }
    
    .refonte2021 #page .row div[id^=zone-] .sidebar-sommaire.navOpen.frame-ermes-sommaire {
        height: 0;
        box-shadow: unset;
        z-index: 1000;
    }
    
    .refonte2021 #page .row div[id^=zone-] .sidebar-sommaire.navOpen .sidebar-sommaire.navOpen {
        left: calc(100vw - 100% * 0.33);
        transition: .2s ease-in-out;
        box-shadow: 0px 2px 10px 3px rgb(0 0 0 / 20%);
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control {
        font-family: var(--philharmonie-font-bold);
        background-color: #fff;
        padding: 13px 26px;
        text-transform: uppercase;
        position: fixed;
        right: 0;
        top: 174px;
        z-index: 1001;
        display: flex;
        flex-direction: column;
        cursor: pointer;
        border-radius: 16px 0 0 16px;
        align-items: flex-start;
        box-shadow: 0px 2px 10px 3px rgb(0 0 0 / 20%);
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control.navOpen {
        background-color: transparent;
        box-shadow: unset;
        margin-top: 0px;
        border-radius: 16px;
        padding-top: 25px;
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control span:not(span:first-child) {
        background: #000;
        border-radius: 10px;
        height: 3px;
        margin: 5px 0;
        transition: .2s ease-in-out;
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control.navOpen span:nth-of-type(1) {
        display: none;
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control span:nth-of-type(2) {
        width: 20px;
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control span:nth-of-type(3) {
        width: 40px;
    }
    
    .refonte2021 #page .row div[id^=zone-] #sideMenu-control span:nth-of-type(4) {
        width: 20px;
    }
    
    .refonte2021 #page #sideMenu-control.navOpen span:nth-of-type(2) {
        transform-origin: bottom;
        transform: rotatez(45deg) translate(8px, 10px);
        width: 0 !important;
    }
    
    .refonte2021 #page #sideMenu-control.navOpen span:nth-of-type(3) {
        transform-origin: top;
        transform: rotatez(-45deg);
        width: 25px !important;
    }
    
    .refonte2021 #page #sideMenu-control.navOpen span:nth-of-type(4) {
        transform-origin: center;
        transform: translate(1px, -14px) rotatez(45deg);
        width: 25px !important;
    }
    
    .full-width.refonte2021 #page div[id^=zone-]:not(#zone-5)>div:not(div:nth-child(2)) {
        max-width: 100vw;
    }
    
    .full-width.content-page.refonte2021 #page div[id^=zone-]:not(#zone-5)>div:not(div:nth-child(2))>.frame {
        padding-left: 5vw !important;
        padding-right: 5vw !important;
    }
    /*     .full-width.refonte2021 #portal [id^=zone-]>div .frame.first-content {
        border-radius: 0;
    } */
    
    .full-width.refonte2021 .chapo {
        width: 80%;
        max-width: 1200px;
        margin: auto;
    }
    
    body.refonte2021.select-thema-modele .cms-inner-layout>.row .cms-inner-zone:nth-of-type(2),
    /* A enlever lors de la refonte des sélections thématiques */
    
    .refonte2021 [id^=zone-] {
        padding: 0;
        background-color: transparent;
    }
    /* End overide selection théma */
    
    .refonte2021 .apres-titre-seul .apres-titre-seul {
        padding: 1px 31px 1px !important;
        /* Todo : Remove !important in media.css l.3890 */
    }
    
    .refonte2021 [id^=zone-]>div div.frame:not(.entete):not(.sidebar-sommaire):not(.apres-titre-seul) {
        padding: 31px 31px 1px !important;
        /* Todo : Remove !important in media.css l.3890 */
    }
    
    .refonte2021 [id^=zone-]>div div.frame.menu-secondaire {
        padding-top: 0 !important;
        /* Todo : Remove !important in media.css l.3890 */
    }
    
    .refonte2021 [id^=zone-]>div div.frame:not(.entete):not(.sidebar-sommaire):not(.backLightYellow):not(.backDarkBlue):not(.backDarkGreen):not(.backDarkGrey) {
        background-color: var(--encart-color);
    }
    
    .refonte2021 #portal [id^=zone-]>div .frame.first-content {
        border-radius: 16px 16px 0 0;
        padding-top: 2em;
    }
    
    .refonte2021 [id^=zone-]>div:last-child div.frame {
        border-radius: 0 0 16px 16px;
        margin: 0 auto 2em !important;
        /* MEDIA/media.css l.1116  */
    }
    /*     .refonte2021 .l-region.footer-mediaPP {
        margin-top: 3em;
    } */
    /* Widget step inscription */
    
    .refonte2021 .step {
        font-size: 3em;
        text-align: center;
    }
    
    .refonte2021 main div:not(.menu-type) .encart-step a:not(.btn) {
        text-decoration: none !important;
    }
    
    .refonte2021 .encart-step h3 {
        margin-top: 0;
    }
    
    .refonte2021 .encart-step ul {
        margin: 0;
    }
    
    .refonte2021 .encart-step ul li {
        margin: 0;
        list-style-position: inside;
    }
    
    .refonte2021 .step:before,
    .refonte2021 .step:after {
        content: "";
        width: 5vw;
        height: 2px;
        background: var(--pad-secondary-color);
        display: inline-block;
        position: relative;
        margin: 16px;
        min-width: 30px;
        max-width: 60px;
    }
    
    .refonte2021 .step+p {
        text-align: center;
    }
    /* Encart infos */
    
    .refonte2021 .encart-infos {
        border-radius: 16px;
        background-color: var(--light-grey);
        padding: 30px;
        margin: 0 0 30px;
    }
    
    .refonte2021.frise .encart-infos {
        background-color: var(--encart-color);
    }
    
    .refonte2021 .encart-infos h2 {
        text-align: center !important;
        /* MEDIA/media.css 10977-10997 */
    }
    
    .refonte2021 .encart-infos>* {
        margin: 0.5em 0;
    }
    
    .refonte2021 .encart-infos.with-icon>p:first-child {
        padding-left: 25px;
        position: relative;
    }
    
    .refonte2021 .encart-infos.with-icon>.btn {
        margin-left: 25px;
    }
    
    .refonte2021 .encart-infos.with-icon:not(.no-icon)>p:first-child::before {
        content: url(/ui/skins/MEDIA/refonte-pad/img/infos.svg);
        display: block;
        width: 32px;
        margin-right: 0.5em;
        position: absolute;
        left: 0%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    
    .refonte2021 .encart-infos.with-icon>p.center:first-child::before {
        margin: auto;
    }
    
    .refonte2021 .encart-infos.discrete {
        padding: 10px 30px;
        margin-top: 1em;
    }
    
    .refonte2021 .encart-infos.discrete p {
        margin-top: 0;
    }
    /* Encart-infos  */
    
    .refonte2021 .encart-presentation {
        padding: 0;
        overflow: hidden;
        border-radius: 16px;
        /*         height: calc( 100vw / 3);
 */
        /* max-height: 500px; */
        min-height: 310px;
        margin: 0 0 2em 0;
        /*         height: 50vw;
        max-height: 500px; */
    }
    
    .refonte2021 .encart-presentation.horizontal {
        position: relative;
    }
    
    .refonte2021 .encart-presentation:not(.btn-genre) .crop-image {
        height: 300px;
    }
    
    .refonte2021 .encart-presentation.horizontal section {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding: 1rem;
        margin: 0 1.5% 0 0 !important;
        /*         position: absolute;
 */
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(0deg, rgba(0, 27, 59, 1) 0%, rgba(0, 27, 59, .3) 75%, rgba(0, 27, 59, .0) 100%);
    }
    
    .refonte2021 .encart-presentation.horizontal section div {
        display: flex;
        flex-direction: column;
    }
    
    .refonte2021.home #portal h2,
    .refonte2021 #portal .encart-presentation h2 {
        order: 2;
        text-align: left !important;
        padding: 0;
        margin: 0 !important;
        font-size: 2rem;
        line-height: inherit;
    }
    
    .refonte2021.home #portal h1,
    .refonte2021.home #portal h1 span {
        font-size: 2.5rem !important;
        text-transform: uppercase;
        color: #001B3B;
        font-family: 'Philharmonique Semibold', sans-serif !important;
        font-weight: 500;
        line-height: 1;
    }
    
    .refonte2021.home #portal .sousTitre {
        font-family: var(--philharmonie-font-regular) !important;
        text-transform: uppercase;
        font-size: 1rem;
        font-weight: 400;
    }
    
    .refonte2021 #portal .encart-presentation.encart-img-degrade h2 {
        font-size: 1.125rem;
    }
    
    .refonte2021 .encart-presentation .categorie {
        order: 1;
        font-size: 0.825rem;
        font-weight: bold;
    }
    
    .refonte2021 .encart-presentation .categorie::after {
        content: '';
        width: 30px;
        height: 1px;
        background-color: #fff;
        display: block;
        margin: 5px 0;
    }
    
    .refonte2021 .encart-presentation .description {
        order: 3;
        font-size: 1em;
        font-size: 0.825rem;
    }
    
    .refonte2021 .encart-presentation .btn-list,
    .refonte2021 .encart-presentation .btn {
        order: 4;
    }
    
    .refonte2021 .encart-img-degrade.crop-image {
        height: calc( 100vw / 3);
        max-height: 500px;
        min-height: 250px;
        z-index: 0;
    }
    
    .refonte2021 .encart-img-degrade .text {
        position: relative;
        z-index: 1;
        height: 100%;
        padding: 1rem;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
    }
    
    .refonte2021 .encart-img-degrade.backDarkBlue .text {
        background: linear-gradient(0deg, rgba(0, 27, 59, 1) 0%, rgba(0, 27, 59, .3) 75%, rgba(0, 27, 59, .0) 100%);
    }
    
    .refonte2021 .encart-img-degrade.backDarkGreen .text {
        background: linear-gradient(0deg, rgba(40, 59, 43, 1) 0%, rgba(40, 59, 43, .3) 75%, rgba(40, 59, 43, .0) 100%);
    }
    
    .refonte2021 .encart-img-degrade.orchestreParis::before {
        content: url(/ui/skins/MEDIA/refonte-pad/img/home/orchestreParisHW.svg);
        height: auto;
        width: 10%;
        position: absolute;
        display: block;
        top: 1rem;
        left: calc(100% - 5rem);
        z-index: 2;
    }
    
    .refonte2021 .encart-img-degrade.orchestreParis.ocBlanc::before {
        content: url(/ui/skins/MEDIA/refonte-pad/img/home/orchestreParisHW.svg);
    }
    
    .refonte2021 .encart-img-degrade.orchestreParis.ocNoir::before {
        content: url(/ui/skins/MEDIA/refonte-pad/img/home/orchestreParisHB.svg);
    }
    
    .refonte2021 .encart-img-text-plain {
        display: flex;
        flex-direction: column-reverse;
        justify-content: space-between;
    }
    
    .refonte2021 .encart-img-text-plain img {
        flex-grow: 1;
    }
    
    .refonte2021 .encart-img-text-plain .text {
        padding: 1rem;
        z-index: 2;
    }
    
    .refonte2021 .encart-img-text-plain .text .btn-list {
        flex-direction: column;
    }
    
    .refonte2021 .encart-img-text-plain .text .btn-list a {
        margin: 0.5rem 0 !important;
    }
    
    .refonte2021 .encart-img-text-plain .text .btn-list a:last-child {
        background-color: transparent !important;
        border: 2px solid #fff !important;
        color: #fff !important;
    }
    
    .refonte2021 .encart-img-text-plain .text .btn-list a:last-child:hover {
        background-color: transparent !important;
        border: 2px solid var(--pad-primary-color) !important;
        color: var(--pad-primary-color) !important;
    }
    
    .refonte2021 #portal .encart-presentation.encart-img-text-plain .text h2 {
        font-size: 1.125rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    .refonte2021 .encart-presentation .crop-image {
        margin: 0 !important;
    }
    
    .refonte2021 .ccmarche,
    .refonte2021.connecte .lettreinfo {
        display: flex;
    }
    
    .refonte2021.connecte .ccmarche,
    .refonte2021 .lettreinfo {
        display: none;
    }
    
    .refonte2021.home .promo-pro {
        height: calc(25vw);
        min-height: 300px;
        margin-bottom: 2rem;
    }
    
    .refonte2021.home #portal .promo-pro-text h2 {
        padding: 0;
        margin: 0 !important;
        font-size: 1.8rem;
        font-family: 'Philharmonique Semibold';
    }
    
    .refonte2021.home .encart-promo>* {
        margin-bottom: 3.12%;
    }
    
    .refonte2021 .btn-genre a:focus,
    .refonte2021 .btn-genre a:focus .overlay {
        box-shadow: inset 0px 0px 0px 3px #b3d6fd;
        border-radius: 16px;
    }
    
    .refonte2021 .btn-genre {
        min-height: unset;
        height: 90px;
        margin-bottom: 2rem;
    }
    
    .refonte2021 .btn-genre:hover .overlay {
        background: linear-gradient(0deg, rgba(0, 27, 59, 1) 0%, rgba(0, 27, 59, .7) 75%, rgba(0, 27, 59, .3) 100%);
    }
    
    .refonte2021 .btn-genre .overlay {
        position: absolute;
        z-index: 1;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        background: linear-gradient(0deg, rgba(0, 27, 59, 1) 0%, rgba(0, 27, 59, .3) 75%, rgba(0, 27, 59, .0) 100%);
    }
    
    .refonte2021 .btn-genre h3 {
        position: absolute;
        z-index: 2;
        margin: 0;
        text-align: center;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        color: #fff;
    }
    
    .refonte2021 .encart-presentation.vertical {
        display: flex;
        flex-direction: column;
        max-height: unset;
        height: 470px;
        background-color: #fff;
    }
    
    .refonte2021 .encart-presentation.vertical *:not(.btn) {
        color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 .encart-presentation.vertical .text {
        order: 1;
        padding: 1rem;
        /*         height: 70%;
 */
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    
    .refonte2021 .encart-presentation.vertical .categorie::after {
        background-color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 .encart-presentation.vertical .crop-image {
        order: 0;
        height: calc(100% - 270px);
    }
    
    .refonte2021 #portal .encart-presentation.vertical h2 {
        font-size: 1.125rem;
    }
    
    .refonte2021 .encart-presentation .description {
        margin: 0;
    }
    
    .refonte2021.home ._3-col {
        padding-bottom: 3em;
    }
    /* Figcaption */
    
    .refonte2021 figure {
        position: relative;
        margin-bottom: 1em;
    }
    
    .refonte2021 figure img {
        margin-bottom: 0;
    }
    
    .refonte2021 figure:not(.popup-image) figcaption {
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), transparent);
        color: #fff;
        text-align: left;
        padding: 0.5em 1em;
        position: absolute;
        bottom: 0;
        border-radius: 0 0 16px 16px;
        width: 100%;
        margin: 0;
    }
    
    .refonte2021 figure:not(.popup-image) figcaption.white-background {
        background: transparent;
        color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 .pop-outer {
        background-color: rgba(0, 0, 0, 0.6);
        position: fixed;
        width: 100vw;
        height: 100vh;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 12;
        display: none;
    }
    
    .refonte2021 .pop-inner {
        position: fixed;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    .refonte2021 .popup-image .close {
        width: 100vw;
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        content: '';
        color: transparent;
    }
    
    .refonte2021 .popup-image .close::after {
        content: "X";
        position: fixed;
        font-size: 1em;
        color: #fff;
        top: 85px;
        right: 150px;
        border: 2px solid #fff;
        padding: 5px 10px;
        border-radius: 20px;
        background-color: #000;
        opacity: 1;
    }
    
    .refonte2021 .popup-image figcaption {
        color: #fff;
        margin: 0.5em auto;
        text-align: center;
    }
    
    .refonte2021 .popup-image img {
        max-width: 90vw;
        max-height: 70vh;
    }
    
    .refonte2021 .cl-open {
        text-decoration: underline;
        margin-bottom: 1em;
    }
    /* Chapo */
    
    .refonte2021 .chapo a,
    .refonte2021 .chapo {
        font-size: 1.125rem;
    }
    /* Citation */
    
    .refonte2021 blockquote {
        width: 80%;
        margin: 1em auto 0;
        font-style: italic;
        position: relative;
        z-index: 1;
        font-size: 1.3em;
    }
    
    .refonte2021 blockquote::after {
        content: '';
    }
    
    .refonte2021 blockquote::before {
        content: url(/ui/skins/MEDIA/refonte-pad/img/quote.svg);
        display: block;
        position: absolute;
        width: 5em;
        z-index: 0;
        left: -20px;
        top: 10px;
        opacity: 0.2;
    }
    
    .page-pro.refonte2021 blockquote::before {
        content: url(/ui/skins/MEDIA/refonte-pad/img/quotePro.svg);
    }
    /* Encart wide link : extend encart-infos */
    
    .refonte2021 #portal .wide-link {
        margin: 1em 0;
        list-style-type: none !important;
    }
    
    .refonte2021 .wide-link p,
    .refonte2021 .wide-link h3 {
        margin: 0;
    }
    
    .refonte2021 ul a li h3::after,
    .refonte2021 .wide-link h3::after {
        content: url(/ui/skins/MEDIA/refonte-pad/img/link.svg);
        width: 20px;
        height: auto;
        margin-left: 10px;
    }
    
    .refonte2021 .wide-link:hover {
        background-color: var(--pad-light-color);
    }
    
    .refonte2021 main .frame .encart-infos.wide-link a {
        text-decoration: none !important;
    }
    /* Encart promo pad pro : extend encart-infos */
    
    .refonte2021 .promo-pro .overlay {
        background: radial-gradient(circle, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.006039915966386533) 90%, rgba(0, 0, 0, 0) 100%);
    }
    
    .refonte2021 .promo-pro .crop-image>div {
        position: absolute;
        width: 100%;
        height: 100%;
    }
    
    .refonte2021 .promo-pro .logo-promo {
        z-index: 2;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        top: 50%;
        position: absolute;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    
    .refonte2021 .promo-pro .logo-promo>* {
        color: var(--encart-color);
    }
    
    .refonte2021 .promo-pro .logo-promo img.logo-pro {
        width: 70px;
        min-width: unset;
        min-height: unset;
        position: static;
        z-index: 2;
        margin-top: 10px;
    }
    
    .refonte2021 .promo-pro>section:first-child {
        height: 250px;
    }
    
    .refonte2021 .promo-pro .logo-promo>h4 {
        top: 25%;
        z-index: 2;
    }
    
    .refonte2021 .promo-pro .overlay {
        bottom: 0;
        z-index: 0;
    }
    
    .refonte2021 .promo-pro .encart-infos {
        padding: 2em;
    }
    
    .refonte2021 .promo-pro .encart-infos h2 {
        text-align: center;
        color: var(--pro-primary-color);
        margin: 0;
    }
    
    .refonte2021 .crop-image a.btn.btn-default.pro {
        position: absolute;
        z-index: 1;
        left: 50%;
        top: 73%;
        transform: translate(-50%, -50%);
    }
    
    .refonte2021 .encart-infos.promo-pro {
        padding: 0;
    }
    
    .refonte2021 .encart-infos.promo-pro>* {
        margin: 0;
    }
    
    .refonte2021 .encart-infos.promo-pro .crop-image {
        border-radius: 16px 16px 0 0;
    }
    
    .refonte2021 .encart-infos.promo-pro section:last-child {
        padding: 20px;
    }
    
    .refonte2021 .encart-infos.promo-pro h2 {
        line-height: 1.2em;
    }
    
    .refonte2021 .encart-infos.promo-pro .btn {
        margin: 1em auto;
        margin-bottom: 0 !important;
    }
    /* images size*/
    
    .refonte2021 .imgH300px {
        height: 300px;
        width: auto;
        margin: 0 auto;
        margin-bottom: 1em;
    }
    
    .refonte2021 .crop-image.hero {
        height: 600px;
        max-height: 60vh;
        margin-bottom: 1em;
    }
    
    .refonte2021 .crop-image.corpus {
        height: 300px;
    }
    
    .refonte2021 .crop-image.crop-thumb {
        height: 200px;
        margin-bottom: 1em;
    }
    
    .refonte2021 img.thumbnail-size {
        width: 70px;
        height: auto;
    }
    
    .refonte2021 img.center {
        display: block;
        margin: auto;
    }
    /* Encart vignette verticale : extend encart-infos, img up and text down */
    
    .refonte2021 .vignette-vertical {
        padding: 0;
    }
    
    .refonte2021 .vignette-vertical .crop-image {
        margin: 0;
    }
    
    .refonte2021 .vignette-vertical .crop-image.round-item {
        border-radius: 16px 16px 0 0;
    }
    
    .refonte2021 .vignette-vertical .content {
        margin: 0;
        padding: 20px 30px 15px 30px;
    }
    /* 5. Menu secondaire */
    /* 5.1 Menu latéral */
    
    .refonte2021.pad #page #portal .sidebar-sommaire .sidebar-sommaire {
        border-radius: 16px;
        background-color: var(--encart-color);
        color: var(--philharmonie-primary-color);
        padding: 0 0.7em 0;
        max-height: 80vh;
        overflow: scroll;
        overflow-x: hidden;
    }
    
    .refonte2021.pad #page #portal .main-float-menu {
        margin-top: 0;
    }
    
    .refonte2021.pad #page #portal .float-frame-menu {
        width: 100% !important;
        /* overide encart */
        border-radius: 16px;
    }
    
    .refonte2021.pad #page #portal .float-frame-menu .menu-label h2 {
        margin: 0;
        padding: 31px 0 0;
    }
    
    .refonte2021.pad #page #portal .float-frame-menu .is-active {
        background-color: var(--light-grey);
    }
    
    .refonte2021.pad #page #portal .float-frame-menu .frame-head a {
        text-decoration: none !important;
        /* media.css l.757 */
        padding: 5px 5px 0.5em 5px;
        line-height: 1.5em;
    }
    
    .refonte2021.pad #page #portal .float-frame-menu .head-H2 a {
        font-size: 0.9em;
        text-transform: uppercase;
        font-family: var(--philharmonie-font-regular);
    }
    
    .refonte2021.pad #page #portal .float-frame-menu .head-H3 a {
        font-size: 0.9em;
        font-family: var(--paragraph-font);
        /*  margin-left: 0.5em; */
    }
    
    .refonte2021.pad #page #portal .float-frame-menu .head-H4 a {
        font-size: 0.8em;
        margin: 0 0 0 0.5em;
        padding: 0 0 0.5em 5px;
    }
    
    .overlay[data-v-831b4f68] {
        background-color: transparent;
    }
    /* 6. Tableaux */
    
    .refonte2021 table {
        overflow-wrap: break-word;
        word-wrap: break-word;
    }
    
    .refonte2021 table tfoot td,
    .refonte2021 table tfoot {
        border: 2px solid #fff;
    }
    
    .refonte2021 .table-large {
        display: none;
    }
    
    .refonte2021 .table-mobile {
        border-collapse: separate;
        border-spacing: 1em 0;
    }
    
    .refonte2021 .table-large th,
    .refonte2021 .table-large td {
        border-left: 1em solid var(--encart-color);
        border-right: 1em solid var(--encart-color);
        transition: 0.2s ease all;
        padding: 1em 0;
    }
    /* 
.refonte2021  th {
    border-radius: 16px 16px 0 0;
} */
    
    .refonte2021 .table-mobile th:first-child,
    .refonte2021 th:nth-child(2) {
        background-color: var(--pad-primary-color);
    }
    
    .refonte2021 th:last-child {
        background-color: var(--background-color);
    }
    
    .refonte2021 tr:not(tr:last-child) td {
        border-bottom: 1px solid var(--medium-grey);
    }
    
    .refonte2021 table *:not(tfoot) tr td:not(td[scope="row"]) {
        background-color: var(--light-grey);
    }
    
    .refonte2021 table tr td:not(td[scope="row"]),
    .refonte2021 table tr th {
        text-align: center;
        padding: 0.5em;
    }
    
    .refonte2021 .scroll-small-responsive+.table-mobile {
        display: block;
        overflow: scroll;
    }
    
    .refonte2021 .table-mobile th,
    .refonte2021 .table-mobile td {
        width: 50%;
    }
    
    .refonte2021 table td[scope="row"] {
        text-align: right;
    }
    
    .refonte2021 .one-size-table {
        width: 100%;
        margin: 1.5em 0;
        table-layout: fixed;
    }
    
    .refonte2021 #jaquettes a:hover {
        text-decoration: underline !important;
    }
    
    .refonte2021 .one-size-table.table-collapse {
        border-collapse: collapse;
        border-spacing: 0;
    }
    
    .refonte2021 .one-size-table.table-collapse th {
        border-radius: 0;
        padding: 1em;
    }
    
    .refonte2021 .one-size-table th:first-child {
        border-radius: 16px 0 0 0;
    }
    
    .refonte2021 .one-size-table th:last-child {
        border-radius: 0 16px 0 0;
    }
    
    .refonte2021 .one-size-table td[scope="row"] {
        text-align: center;
    }
    
    .refonte2021 .one-size-table th:first-child {
        background-color: var(--pro-primary-color);
        color: #fff;
    }
    
    .refonte2021 .one-size-table.text-content td {
        vertical-align: top;
        padding: 1em;
    }
    
    .refonte2021 .table-collapse.bottom-collapse {
        margin-bottom: 0;
    }
    
    .refonte2021 .table-collapse.bottom-collapse tfoot {
        margin-bottom: 0;
    }
    
    .refonte2021 .table-collapse.bottom-collapse .promo-pro.margin-image {
        margin: 30px;
    }
    
    .refonte2021 .top-collapse {
        border-radius: 0 0 16px 16px;
    }
    
    .refonte2021 .one-size-table tbody td:first-child {
        background-color: var(--pro-primary-fade);
    }
    
    .refonte2021 .one-size-table tbody td:nth-child(2) {
        background-color: var(--pad-primary-fade);
    }
    
    .refonte2021 .one-size-table tbody td:last-child:not(td:nth-child(2)) {
        background-color: var(--light-grey);
    }
    
    .refonte2021 .one-size-table tfoot,
    .refonte2021 .one-size-table tbody .rowspan {
        background-color: var(--light-grey);
        border-bottom: unset;
    }
    
    .refonte2021 .one-size-table td p {
        margin: 0 auto;
    }
    /* 7. Accordéons Page (adapter pour deploiement sur fiches d'oeuvres */
    
    .refonte2021 .cl-accordion details {
        margin-bottom: 1em;
    }
    
    details summary>* {
        display: inline;
    }
    
    details summary {
        cursor: pointer;
    }
    
    summary::-webkit-details-marker {
        display: none;
    }
    
    details summary>* {
        display: inline;
    }
    
    .refonte2021 .cl-accordion details[open] {
        border-bottom: 1px solid black;
        padding-bottom: 1em;
    }
    
    .refonte2021 .cl-accordion .cl-accordion {
        margin-top: 1em;
    }
    
    .refonte2021 .cl-accordion details summary {
        border-bottom: 1px solid var(--philharmonie-primary-color);
        display: flex;
        justify-content: flex-start;
        flex-direction: row;
        align-items: center;
        cursor: pointer;
        padding-left: 5px;
    }
    
    .refonte2021 .cl-accordion h3.uppercase {
        font-weight: bold;
    }
    
    .refonte2021 .cl-accordion summary h3:not(.regular-title) {
        padding: 1.5em 0;
        margin: 1em 0 0;
        width: 100%;
    }
    
    .refonte2021 .cl-accordion summary h3:not(.regular-title):not(.uppercase) {
        text-transform: initial;
        font-weight: normal;
    }
    
    .refonte2021 .cl-accordion.acc2 summary h3:not(.regular-title) {
        margin: 0;
        padding: 0;
    }
    
    .refonte2021 .cl-accordion summary h3:not(.regular-title)::after {
        content: url(/ui/skins/MEDIA/refonte-pad/img/chevron2.svg);
        display: block;
        width: 15px;
        height: 25px;
        float: right;
        transition: 0.2s ease-in-out all;
        margin-right: 10px;
    }
    
    .refonte2021 .cl-accordion details>article::before {
        content: '';
        width: 60%;
        height: 1px;
        background-color: var(--philharmonie-primary-color);
        position: relative;
        display: block;
        margin-bottom: 1em;
    }
    
    .refonte2021 .cl-accordion details[open] summary {
        border-bottom: none;
    }
    
    .refonte2021 .cl-accordion details[open] h3::after {
        transform: rotate(90deg);
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .cl-accordion h4 {
        font-size: 1rem;
    }
    
    .refonte2021 .cl-accordion table {
        width: 100%;
    }
    
    .refonte2021 .cl-accordion table a {
        color: var(--philharmonie-primary-color);
        text-decoration: underline !important;
        /* MEDIA/media.css l.757 */
    }
    
    .refonte2021 .cl-accordion table:not(.one-size-table) th:last-child,
    .refonte2021 .cl-accordion table:not(.one-size-table) *:not(tfoot) tr td:not(td[scope="row"]) {
        background-color: unset;
        border: none;
    }
    
    .refonte2021 .cl-accordion th {
        font-weight: bold;
    }
    
    .refonte2021 .cl-accordion .with-icon summary {
        position: relative;
    }
    
    .refonte2021 .cl-accordion .with-icon h3::after {
        position: absolute;
        right: 0;
        top: 25%;
    }
    
    .refonte2021 .cl-accordion .icon {
        display: block;
        height: 30px;
        width: auto;
        margin: 0.5em 1em 0.5em 0;
        ;
    }
    
    .refonte2021 .cl-accordion.acc2 details {
        background-color: #f5f5f5;
        border-radius: 16px;
        padding: 1em;
    }
    
    .refonte2021 .cl-accordion.acc2 details summary {
        border-bottom: none;
    }
    /* Encart photo en fond texte centré : modification du template entete */
    
    .refonte2021 .entete.encart {
        position: relative;
    }
    
    .refonte2021 .entete.encart .background {
        width: 100%;
        height: 100%;
        z-index: 1;
        top: 0;
        min-height: unset;
    }
    
    .refonte2021 .entete.encart .content {
        z-index: 2;
		position:relative;
    }
    
    .refonte2021 .entete.encart h3 {
        color: var(--encart-color);
        text-align: center;
        font-size: 1.5em;
        text-transform: uppercase;
    }
    
    .refonte2021 .entete.encart #answer-oldest-archive {
        display: none;
    }
    
    .refonte2021 .entete.encart .crop-image img {
        border: 16px;
    }
    /* Regular Slider */
    
    .refonte2021 .cl-slider {
        padding: 0 3em;
    }
    
    .refonte2021 .cl-slider .slick-list {
        box-shadow: 0px 1px 3px 2px rgba(0, 0, 0, 0.5);
        border-radius: 16px;
    }
    
    .refonte2021 .cl-slide .content {
        padding: 1em
    }
    
    .refonte2021 .cl-slide>div {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        height: 80vw;
        min-height: 450px;
        max-height: 500px;
    }
    
    .refonte2021 .cl-slider .crop-image img {
        border-radius: 16px 16px 0 0;
    }
    
    .refonte2021 .cl-slide h3 {
        margin-top: 0;
        color: var(--paragraph-font);
        font-weight: bold;
    }
    
    .refonte2021 .cl-slide h3 .date {
        font-weight: bold;
    }
    
    .refonte2021 .cl-slider .slick-dots {
        display: flex;
        justify-content: center;
        margin: 1em 0 2em;
    }
    
    .refonte2021 .cl-slider .slick-dots li {
        margin: 0 0.5em;
        position: relative;
    }
    
    .refonte2021 .cl-slider .slick-dots li::after {
        content: "○";
        display: block;
        position: absolute;
        left: 50%;
        top: 85%;
        transform: translateX(-50%);
    }
    
    .refonte2021 .cl-slider .slick-dots li.slick-active button {
        font-weight: bold;
        color: var(--philharmonie-primary-color);
    }
    
    .refonte2021 .cl-slider .slick-dots li.slick-active::after {
        content: "●";
    }
    
    .refonte2021 .cl-slider .slick-arrow {
        position: absolute;
        top: 50%;
        width: 50px;
        height: 50px;
        z-index: 1;
    }
    
    .refonte2021 .cl-slider .slick-arrow::before {
        display: inline-block;
        content: url(/ui/skins/MEDIA/refonte-pad/img/chevron2.svg);
        background-color: var(--light-grey);
        border-radius: 25px;
        padding: 9px 15px 16px 16px;
        transition: 0.2s ease-in-out all;
        width: 50px;
        height: 50px;
    }
    
    .refonte2021 .cl-slider .slick-arrow::before {
        box-shadow: 0px 1px 3px 2px rgba(0, 0, 0, 0);
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .cl-slider .slick-arrow:hover::before {
        background-color: var(--medium-grey);
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .cl-slider .slick-next {
        right: -1em;
        transform: translateY(-50%);
    }
    
    .refonte2021 .cl-slider .slick-prev {
        left: -1em;
        transform: rotate(180deg) translateY(50%);
    }
    
    .slick-sr-only {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        /* added line */
        border: 0;
    }
    
    .refonte2021 .cl-slider-rs {
        max-width: 1100px;
        margin: 2em auto 0;
    }
    
    .refonte2021 .cl-slider-rs h3 {
        margin: 1em 0;
    }
    
    .refonte2021 .cl-slider-rs img {
        border-radius: 16px;
    }
    /* 8 Formulaires */
    
    .refonte2021 form h4 {
        text-transform: uppercase;
    }
    
    .refonte2021 form {
        margin-top: 1em;
    }
    
    .refonte2021 .zcwf_title {
        display: none;
    }
    
    .refonte2021 textarea,
    .refonte2021 form select,
    .refonte2021 form input:not(.btn) {
        width: 100%;
        padding: 6px;
        -moz-appearance: none;
        -webkit-appearance: none;
        appearance: none;
        border: 1px solid var(--background-color);
        border-radius: 2px;
        padding: 10px;
    }
    
    .refonte2021 form select {
        background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 99% 50%;
    }
    
    .refonte2021 form h3 {
        font-size: 1.4rem;
        color: var(--pro-primary-color);
        border-bottom: 1px solid var(--medium-grey);
    }
    
    .refonte2021 .zcwf_row {
        margin-bottom: 1em;
    }
    
    .refonte2021 p:not(.step) {
        margin-top: 1em;
    }
    
    .refonte2021 .zcwf_row.wfrm_fld_dpNn {
        display: none;
    }
    
    .refonte2021 textarea {
        min-height: 80px;
    }
    
    .refonte2021 input[type=reset].btn {
        padding: 0.5rem 1.25rem;
        /* MEDIA/media.css l.807 */
    }
    
    .refonte2021 input[type=reset].btn:hover {
        background-color: var(--pro-primary-color) !important;
        /* MEDIA/media.css l.862 */
        color: #fff !important;
        /* MEDIA/media.css l.862 */
    }
    
    .refonte2021 .form-require {
        color: var(--exergue-pad);
    }
    
    .refonte2021 .infoPosition {
        display: inline-flex;
        position: relative;
        align-items: flex-start;
    }
    
    .refonte2021 span.infoBox {
        display: inline-block;
        padding: 0px 5px 0px;
        background-color: var(--pro-primary-color);
        width: fit-content;
        color: #fff;
        border-radius: 16px;
        font-size: 11px;
        font-weight: bold;
        height: 15px;
    }
    
    .refonte2021 .zcwf_tooltip_ctn {
        font-weight: initial;
    }
    /* GRID .thumb-container */
    
    .refonte2021 .thumb-container .crop-image {
        height: 240px;
        border-radius: 16px 16px 0 0;
    }
    
    .refonte2021 .thumb-container li a {
        display: block;
    }
    
    .refonte2021 .thumb-container._2-col>* a>div:not(.pop-outer),
    .refonte2021 .thumb-container._3-col>* a>div:not(.pop-outer),
    .refonte2021 .thumb-container._4-col>* a>div:not(.pop-outer),
    .refonte2021 .thumb-container article {
        background-color: var(--encart-color);
        padding: 0;
        -webkit-box-shadow: 0px 2px 10px 3px rgba(0, 0, 0, 0.5);
        box-shadow: 0px 2px 10px 3px rgba(0, 0, 0, 0.2);
        border-radius: 16px;
        overflow: hidden;
    }
    
    .refonte2021 .thumb-container._4-col>*:not(.pop-outer) {
        margin: 0 1% 5vw 1%;
    }
    
    .refonte2021 .thumb-container .text-content {
        padding: 0.5em 0.5em 1em;
    }
    
    .refonte2021 .thumb-container .lettre-info h2 {
        font-size: 1em;
        padding: 1em 0.5em 0;
        margin: 0;
        text-align: center !important;
        /* MEDIA/media.css 10977-10997 */
    }
    
    .refonte2021 .thumb-container .lettre-info p {
        padding: 0 0.5em;
        margin: 0;
        text-align: center !important;
        /* MEDIA/media.css 10977-10997 */
    }
    
    .refonte2021 .thumb-container h2,
    .refonte2021 .thumb-container p {
        text-align: left !important;
    }
    
    .refonte2021 .thumb-container .btn {
        margin: 1em auto 0;
    }
    
    .refonte2021 main div:not(.menu-type) a.mosaique-item {
        text-decoration: none !important;
    }
    
    .refonte2021 .thumb-container .mosaique-item {
        border: 2px solid transparent !important;
        transition: 0.2s ease-in-out all;
    }
    
    .refonte2021 .thumb-container .crop-image {
        width: calc(100% + 4px);
        transform: translate(-2px, -2px);
    }
    
    .refonte2021 main div:not(.menu-type) a.mosaique-item:hover {
        text-decoration: none !important;
        border: 2px solid var(--pad-primary-color) !important;
        box-shadow: 10px 15px 39px -3px rgb(0 0 0 / 12%);
        transition: 0.2s ease-in-out all;
    }
    /* Filter Grid */
    
    .refonte2021 [id^=zone-]>.filter-container {
        border-bottom: 1px solid var(--medium-grey);
    }
    
    .refonte2021 .filter>* {
        padding-bottom: 2em;
    }
    
    .refonte2021 .filter.x-col>p,
    .refonte2021 .filter label {
        text-transform: uppercase;
    }
    
    .refonte2021 .filter label {
        font-weight: bold;
    }
    
    .refonte2021 .filter select {
        padding: 5px 10px;
        margin: 0;
    }
    
    .refonte2021 .filter.x-col {
        justify-content: flex-start;
        align-items: flex-start;
        margin-left: 1%;
        padding-top: 2em;
    }
    
    .refonte2021 .filter.x-col>* {
        margin: 0 2vw 0 0;
        width: fit-content;
    }
    
    .refonte2021 .filter .custom-select {
        margin: 0;
        position: relative;
        padding: 0 2em 2em 1em;
        cursor: pointer;
    }
    
    .refonte2021 .filter .custom-select:hover {
        border-bottom: 2px solid var(--philharmonie-primary-color);
    }
    
    .refonte2021 .custom-select select {
        display: none;
    }
    /* Hide the items when the select box is closed: */
    
    .refonte2021 .select-hide {
        display: none;
    }
    
    .refonte2021 .select-selected {
        font-family: var(--paragraph-font);
        color: var(--philharmonie-primary-color);
        width: 60px;
        text-align: right;
        font-weight: bold;
    }
    
    .refonte2021 .select-selected::after {
        position: absolute;
        content: url(/ui/skins/MEDIA/refonte-pad/img/chevron-up.svg);
        width: 21px;
        height: 10px;
        top: 0px;
        left: calc(100% - 20px);
        transition: 0.2s ease transform;
    }
    
    .refonte2021 .select-arrow-active::after {
        transform: rotate(180deg);
        transition: 0.2s ease transform;
        transform-origin: bottom;
    }
    
    .refonte2021 .select-items {
        position: absolute;
        z-index: 2;
        text-align: center;
        width: 120px;
        padding: 1em 31px 1em 1em;
        background-color: rgba(255, 255, 255, 1);
        border-radius: 0 0 16px 16px;
        box-shadow: 0px 3px 3px 2px rgb(0 0 0 / 50%);
        right: 0;
        top: 50px;
    }
    
    .refonte2021 .select-items button {
        display: block;
        margin: auto;
        width: 100%;
        text-align: right;
    }
    
    .refonte2021 .select-items button:hover {
        font-weight: bold;
    }
    
    .refonte2021 .select-items button {
        border-bottom: 1px solid var(--light-grey);
        padding: 0.5em 0;
    }
    /* XX. Responsive */
    
    @media screen and (min-width: 425px) {
        .refonte2021 .x-col._4-col {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
        }
        .refonte2021 .x-col._4-col>* {
            width: 48%;
        }
    }
    
    @media screen and (min-width: 768px) {
        .refonte2021 .title-image {
            align-items: flex-start;
            flex-direction: row;
            justify-content: flex-start;
        }
        .refonte2021 .title-image img {
            margin: 2px 10px 5px 0;
        }
        .refonte2021 .title-image h2 {
            text-align: left!important;
            margin: 0;
            /* MEDIA/media.css 10977-10997 */
        }
        .refonte2021 .title-image .h2Subtitle {
            text-align: left!important;
            /* MEDIA/media.css 10977-10997 */
        }
        .refonte2021 .apres-titre-seul .apres-titre-seul {
            padding: 1px 31px 1px !important;
            /* Todo : Remove !important in media.css l.3890 */
            /*         margin: 0 31px !important; /* media.css l.1116 */
        }
        .refonte2021 div[id^=zone-]>div:nth-child(n+3) .frame:not(.menu-secondaire-container):not(.apres-titre-seul) {
            padding: 2em 31px 1px !important;
            /* Todo : Remove !important in media.css l.3890 */
            /*         margin: 0 31px !important; /* media.css l.1116 */
        }
        .refonte2021 div[id^=zone-]>div:nth-child(n+3) .frame:not(.menu-secondaire-container):not(.apres-titre-seul).menu-secondaire {
            padding: 0 31px 1px !important;
            /* Todo : Remove !important in media.css l.3890 */
        }
        .refonte2021 .entete-logo .entete .content {
            margin: 4em auto 0em;
        }
        .refonte2021 .entete .content {
            margin: 2em auto 3em;
        }
        .refonte2021 #portal .sousTitre {
            font-size: 1.625rem;
            padding: 0 62px;
        }
        .refonte2021 .page-2021 #portal .heroTexte h1 {
            font-size: 3.25rem;
        }
        .refonte2021 .menu-secondaire {
            padding-top: 0;
        }
        .refonte2021 .menu-secondaire ul {
            flex-direction: row;
            justify-content: flex-start;
            height: 101%;
        }
        .refonte2021 .menu-secondaire a {
            text-align: center;
            margin: 0 0.5em;
            padding-top: 3.5em !important;
        }
        .refonte2021 .menu-secondaire .with-icon a {
            padding-top: 1em !important;
        }
        .refonte2021 .x-col {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            flex-wrap: wrap;
        }
        .refonte2021 .x-col.no-wrap {
            flex-wrap: nowrap;
        }
        .refonte2021 .x-col.home-pro-container {
            justify-content: center;
        }
        .refonte2021 section.x-col._2-col.top-items {
            align-self: flex-start;
            margin-top: 0;
        }
        .refonte2021 ._2-col._col-1-3_2-3>*:not(.pop-outer):not(.imgH300px):last-child,
        .refonte2021 ._2-col._col-2-3_1-3>*:not(.pop-outer):not(.imgH300px):first-child {
            width: calc(100% * 0.66 - 18px);
        }
        .refonte2021 ._2-col._col-1-3_2-3>*:not(.pop-outer):not(.imgH300px):first-child,
        .refonte2021 ._2-col._col-2-3_1-3>*:not(.pop-outer):not(.imgH300px):last-child {
            width: calc(100% * 0.33 - 18px);
        }
        .refonte2021 ._2-col>*:not(.pop-outer):not(.imgH300px) {
            width: 47%;
        }
        .refonte2021 ._2-col:not(.promo-pro)>*:not(.pop-outer):not(.imgH300px):not(.encart-presentation) {
            margin: 0 1.5% 2em;
        }
        .refonte2021 ._2-col>*:not(.pop-outer):not(.imgH300px):nth-child(odd) {
            margin-left: 0;
        }
        .refonte2021 ._2-col>*:not(.pop-outer):not(.imgH300px):nth-child(even) {
            margin-right: 0;
        }
        .refonte2021 ._3-col>*:not(.pop-outer) {
            width: 30%;
            margin: 0 1.66% 1em;
        }
        .refonte2021 ._3-col>*:not(.pop-outer):nth-child(3n+1) {
            margin-left: 0;
            width: 31.66%;
        }
        .refonte2021 ._3-col>*:not(.pop-outer):nth-child(3n+3) {
            margin-right: 0;
            width: 31.66%;
        }
        .refonte2021 .thumb-container::after,
        .refonte2021 ._3-col:not(.home-pro-container)::after {
            content: "";
            flex: auto;
        }
        .refonte2021 .thumb-container._3-col>*:not(.pop-outer),
        .refonte2021 .thumb-container article {
            width: 30%;
            margin-bottom: 3%;
        }
        .refonte2021 .thumb-container .crop-image {
            height: 240px;
        }
        .refonte2021 ._4-col>*:not(.pop-outer) {
            width: 23%;
        }
        .refonte2021 .table-large {
            display: block;
        }
        .refonte2021 .table-mobile {
            display: none;
        }
        .refonte2021 .promo-pro>section:first-child {
            height: auto;
        }
        .refonte2021 .encart-infos.promo-pro .crop-image {
            border-radius: 16px 0 0 16px;
        }
        body.refonte2021.select-thema-modele .cms-inner-layout>.row .cms-inner-zone:nth-of-type(1) {
            width: calc( 70% - 2em);
            margin: 0 1em;
        }
        body.refonte2021.select-thema-modele .cms-inner-layout>.row .cms-inner-zone:nth-of-type(2) {
            width: calc( 30% - 2em);
            margin: 0 1em;
        }
        /* Home exeption encart lettre infos comment ca marche (en cause des display none) */
        .refonte2021 .ccmarche,
        .refonte2021 .lettreinfo {
            width: 31.66% !important;
            margin: 0 !important;
        }
        .refonte2021 ._2-col._col-2-3_1-3>.encart-presentation.horizontal:not(.pop-outer):not(.imgH300px) {
            width: calc(100% * 0.66 - 1.12%);
        }
        .refonte2021 .encart-img-degrade .text {
            padding: 0 1rem;
            justify-content: flex-end;
        }
        .refonte2021 .encart-presentation .categorie {
            margin-top: 0;
        }
        .refonte2021 .encart-presentation.horizontal section {
            position: relative;
            padding: 15px 0;
            left: -18px;
        }
        .refonte2021 .encart-presentation.horizontal {
            margin-bottom: 0;
        }
        .refonte2021 .encart-presentation.horizontal .crop-image {
            height: 100%;
        }
        .refonte2021 #portal .encart-presentation.horizontal h2 {
            font-size: 1.5rem;
        }
        .refonte2021.home .promo-pro-text {
            align-self: center;
        }
        .refonte2021 .encart-img-degrade.backDarkGreen .text {
            background-color: rgba(40, 59, 43, 0.7);
        }
        .refonte2021 .encart-img-degrade .btn-list {
            display: flex;
            flex-direction: column;
            margin-bottom: 0.5rem;
        }
        .refonte2021 .encart-img-degrade .btn-list .btn {
            margin: 0.2rem 0 0.3rem !important;
        }
    }
    
    @media screen and (min-width: 1024px) {
        .refonte2021 .crop-image:not(.corpus) img:not(.logo-pro) {
            top: 50%;
            transform: translate(-50%, -50%);
        }
        .refonte2021 .encart-img-degrade .text {
            padding: 3rem 1rem 2rem;
        }
        .refonte2021 .encart-presentation.horizontal section {
            position: static;
            padding: 2rem 0;
        }
        .refonte2021 #portal .encart-presentation.horizontal h2 {
            font-size: 2rem;
        }
        .refonte2021 .encart-presentation.vertical .text {
            height: 270px;
        }
        .refonte2021 .encart-presentation.horizontal p {
            font-size: 1rem;
        }
        .refonte2021 .encart-img-degrade.backDarkGreen .text {
            background: linear-gradient(0deg, rgba(40, 59, 43, 1) 0%, rgba(40, 59, 43, .3) 75%, rgba(40, 59, 43, .0) 100%);
        }
        .refonte2021 .encart-img-degrade .btn-list {
            margin-bottom: 0;
            flex-direction: row;
        }
        .refonte2021 .encart-img-degrade .btn-list .btn {
            margin: 1.25rem 0.5em 1.25rem !important;
        }
        .refonte2021 .encart-img-text-plain .text .btn-list {
            flex-direction: row;
        }
        .refonte2021 .encart-img-text-plain .text .btn-list a {
            margin: 0.5rem !important;
        }
        .refonte2021 .encart-img-text-plain .text .btn-list a:first-child {
            margin-left: 0 !important;
            padding-top: 9px;
        }
    }
    
    @media screen and (min-width: 1440px) {
        .refonte2021 div[id^=zone-]>div:nth-child(n+3) .frame:not(.menu-secondaire-container):not(.apres-titre-seul),
        .refonte2021 div[id^=zone-]>div:nth-child(n+3) .frame {
            padding: 2em 5vw 1px 5vw!important;
        }
    }
    /* ACCESSIBILITY DISPLAY */
    
    @media (max-width: 767px) {
        .refonte2021 #sideMenu-control {
            display: none !important;
        }
        .refonte2021 #portal h1 {
            font-size: 2rem !important;
        }
    }
    
    @media screen and (max-width: 380px) {
        .refonte2021 #portal h1 {
            font-size: 1.5rem !important;
        }
        .refonte2021 .entete .content {
            padding: 0 1em;
        }
        /* ACCESSIBILITY DISPLAY */
        .refonte2021 div[id^=zone-]>div:nth-child(n+3) .frame {
            margin: 0 !important;
        }
        .refonte2021 .table-mobile {
            width: 100%;
            border-collapse: collapse;
        }
        .refonte2021 .cl-slide>div {
            height: 600px;
        }
    }
    
    @media screen and (max-width: 300px) {
        .refonte2021 .cl-slide>div {
            height: 750px;
        }
        .refonte2021 .cl-slider {
            padding: 0;
        }
    }
    /* Widgets from CIMU css files folder */
    /* TODO : Ext or merge ? */
    /* Back to top */
    
    #backtotop {
        background: url(/ui/skins/MEDIA/refonte-pad/img/backToTop.svg) no-repeat center center;
        background-size: 50px;
        border: 0;
        bottom: 2vh;
        cursor: pointer;
        height: 6vh;
        position: fixed;
        right: 2vh;
        text-indent: -9999px;
        width: 6vh;
        z-index: 1000;
        background-size: contain;
    }
    /* Menu secondaire */
    /* ************************************************************** */
    /* SLIDER horizontal avec overflows : sommaire de page horizontal */
    /* ************************************************************** */
    
    .refonte2021 #page .menuHorizontal.fix {
        position: fixed;
        top: 0;
        max-width: 100%;
        width: 100%;
        background: #fff;
        height: 115px;
        padding: 0;
    }
    
    .refonte2021 #page .menuHorizontal.fix .menuHorizontal.fix {
        position: static;
        margin: 0 auto;
    }
    
    .refonte2021 #portal .menuHorizontal.fix .panel-body {
        padding: 0;
    }
    
    .refonte2021.page-2021-1colonne #zone-6 .panel-front.sommaire {
        border-bottom: 1px solid #d4d9de;
        padding: 0;
        border-radius: 1rem 1rem 0 0;
    }
    
    .refonte2021 .Slider-wrapper {
        height: 115px;
        position: relative;
    }
    
    .refonte2021 .Slider {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        align-items: center;
        width: 100%;
        height: 100%;
        z-index: 10;
        background-color: white;
        overflow-x: scroll;
        overflow-y: hidden;
        scrollbar-width: none;
        -ms-overflow-style: none;
        padding: 0 40px;
        box-sizing: border-box;
        border-bottom: 1px solid #b5c0ce;
        /* box-shadow: 0 -1px 0 0 #b5c0ce inset; */
    }
    
    .refonte2021 .Slider-wrapper.fixed .Slider {
        box-shadow: 0 -1px 0 0 #b5c0ce inset;
    }
    
    .refonte2021 .Slider::-webkit-scrollbar {
        display: none;
    }
    
    .refonte2021 .Slider-wrapper.fixed,
    .refonte2021 .fixed-elt-scroll.fixed.only-scrollup,
    .refonte2021 .scrollup .fixed-elt-scroll.fixed {
        position: fixed;
        top: 72px;
        left: 0;
        width: 100vw;
        z-index: 10;
        max-width: unset;
    }
    
    .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .Slider-wrapper.fixed,
    .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .fixed-elt-scroll.fixed.only-scrollup,
    .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .scrollup .fixed-elt-scroll.fixed,
    .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .Slider-wrapper.fixed,
    .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .fixed-elt-scroll.fixed.only-scrollup,
    .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .scrollup .fixed-elt-scroll.fixed {
        width: 100%;
        max-width: 100%;
    }
    
    @media(min-width:768px) {
        .refonte2021.page-2021-1colonne #zone-6 .Slider-wrapper.fixed,
        .refonte2021.page-2021-1colonne #zone-6 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-1colonne #zone-6 .scrollup .fixed-elt-scroll.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .scrollup .fixed-elt-scroll.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: 750px;
        }
    }
    
    @media(min-width:992px) {
        .refonte2021.page-2021-1colonne #zone-6 .Slider-wrapper.fixed,
        .refonte2021.page-2021-1colonne #zone-6 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-1colonne #zone-6 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: 970px;
        }
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: calc((3 / 4 * 970px) - 1rem);
        }
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: calc((2 / 3 * 970px) - 1rem);
        }
    }
    
    @media(min-width:1200px) {
        .refonte2021.page-2021-1colonne #zone-6 .Slider-wrapper.fixed,
        .refonte2021.page-2021-1colonne #zone-6 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-1colonne #zone-6 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: 1170px;
        }
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: calc((3 / 4 * 1170px) - 1rem);
        }
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: calc((2 / 3 * 1170px) - 1rem);
        }
    }
    
    @media(min-width:1600px) {
        .refonte2021.page-2021-1colonne #zone-6 .Slider-wrapper.fixed,
        .refonte2021.page-2021-1colonne #zone-6 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-1colonne #zone-6 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: 1600px;
        }
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-9 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: calc((3 / 4 * 1600px) - 1rem);
        }
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .Slider-wrapper.fixed,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .fixed-elt-scroll.fixed.only-scrollup,
        .refonte2021.page-2021-2colonnes #zone-4.col-md-8 .scrollup .fixed-elt-scroll.fixed {
            width: 100%;
            max-width: calc((2 / 3 * 1600px) - 1rem);
        }
    }
    
    .refonte2021 .Slider-wrapper.static,
    .refonte2021 .fixed-elt-scroll.static.only-scrollup,
    .refonte2021 .scrollup .fixed-elt-scroll.static {
        position: relative;
    }
    
    .refonte2021 .Slider-wrapper .Slider .Slider-item {
        padding: 0 3rem 0 0;
        text-transform: uppercase;
        font-size: 14px;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        cursor: default;
    }
    
    body.page-2021.refonte2021 #page h3.Slider-item,
    .refonte2021 .Slider .Slider-item .Slider-link {
        text-transform: uppercase;
        font-size: 14px;
        font-weight: normal;
        text-align: left;
        font-family: 'SourceSansPro', sans-serif;
        padding: 20px 0 0 0;
        height: 100%;
        display: block;
        white-space: nowrap;
        color: #001b3b;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }
    
    body.page-2021.refonte2021 #page h3.Slider-item {
        padding: 0 3rem 0 0;
    }
    
    .refonte2021 .Slider-wrapper .filterContainer .custom-select {
        padding: 0 3rem 0 0;
    }
    
    .refonte2021 .Slider-wrapper .filterContainer .custom-select>button:not(.btn) {
        background: transparent;
        border: 1px solid #001b3b !important;
        border-radius: 2rem;
        padding: 0 1rem;
        position: relative;
        display: flex;
        align-items: center;
        width: 200px;
        justify-content: space-between;
        cursor: pointer;
        text-transform: none;
        line-height: 14px;
        height: 2rem;
    }
    
    .refonte2021 .Slider-wrapper .select-selected::after {
        position: static;
        content: url(/ui/skins/CIMU/images/icon-left.svg);
        height: 17px;
        width: 10px;
        left: calc(100% - 2rem);
        transform: rotate(-90deg);
        transition: 0.2s ease transform;
        transform-origin: center;
        line-height: 14px;
    }
    
    .refonte2021 .Slider-wrapper .select-arrow-active::after {
        transform: rotate(90deg);
        transition: 0.2s ease transform;
    }
    
    .refonte2021 .Slider-wrapper .filterContainer label {
        font-family: var(--paragraph-font);
        color: var(--philharmonie-primary-color);
        text-align: left;
        font-weight: 400;
        font-size: 14px;
        text-transform: none;
        position: absolute;
        top: 1.25rem;
        padding-left: 1rem;
        opacity: .65;
    }
    
    .refonte2021 .Slider-wrapper .select-items {
        border-radius: .5rem;
    }
    
    .refonte2021 .select-items button:not(.btn)::first-letter {
        text-transform: uppercase;
    }
    
    .refonte2021 .Slider-wrapper .select-selected {
        font-family: var(--paragraph-font);
        color: var(--philharmonie-primary-color);
        text-align: left;
        font-weight: 500;
        font-size: 14px;
        text-transform: uppercase;
    }
    
    .refonte2021 .Slider .Slider-item .Slider-link>img {
        transform: rotate(0deg);
        margin-left: 1rem;
        vertical-align: sub;
        height: 35px;
    }
    
    .refonte2021 .Slider .Slider-item .Slider-link.active,
    .refonte2021 .Slider .Slider-item .Slider-link:hover {
        box-shadow: 0 -2px 0 0 #001B3B inset;
        text-decoration: none;
        color: #001B3B;
        font-family: 'SourceSansPro', sans-serif;
    }
    
    .refonte2021 .Slider .Slider-item .Slider-link.active {
        font-weight: 500;
    }
    
    @media all and (max-width: 739px) {
        .refonte2021 .Slider {
            z-index: 0;
        }
    }
    
    .refonte2021 .Slider-controls {
        display: flex;
        /* position: relative; */
    }
    
    .refonte2021 .Slider-controls .scroll-slider-button {
        height: 97%;
        padding: 0 5px;
        position: absolute;
        top: 0;
        background: white;
        z-index: 8;
        border: 0;
    }
    
    .refonte2021 .Slider-controls .scroll-slider-button:focus {
        border: 1px solid white;
    }
    
    .refonte2021 .Slider-controls .scroll-slider-button .icon {
        height: 25px;
        width: 28px;
    }
    
    .refonte2021 .Slider-controls .scroll-slider-button.scroll-right-slider-button {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
        right: 0;
    }
    
    .refonte2021 .Slider-controls .scroll-slider-button.scroll-right-slider-button .icon {
        /* margin-bottom: -6px; */
    }
    
    .refonte2021 .Slider-controls .scroll-slider-button.scroll-left-slider-button {
        left: 0;
    }
    /* Navigation secondaire homepage surcharge */
    
    @media (min-width: 768px) {
        .refonte2021 #main-menu {
            display: flex;
            -ms-flex-pack: justify;
            margin: auto;
            width: 100%;
        }
        .refonte2021 .sm::after {
            display: none;
        }
        body.refonte2021 .sm-clean ul,
        body.refonte2021 .sm-clean ul li,
        body.refonte2021 #main-menu>li {
            border: none;
        }
        body.refonte2021 #main-menu>li {
            display: flex;
            flex-basis: auto;
            flex-grow: inherit;
        }
        .refonte2021 #main-menu>li:first-of-type>a>picture.picto-svg-menu,
        .refonte2021 .picto-svg-menu,
        .refonte2021 #main-menu.sm-clean>li>a .sub-arrow {
            position: relative;
        }
        .refonte2021 .picto-svg-menu {
            top: -2px;
            left: -4px;
        }
        .refonte2021 #main-menu.sm-clean>li>a .sub-arrow {
            top: 2px;
            left: 15px;
        }
        .refonte2021 #main-menu>li:first-of-type>a>picture.picto-svg-menu {
            top: 2px;
        }
        body.refonte2021 .sm-clean ul {
            background-color: #f2f2f2;
            top: 55px !important;
            border-radius: 0 0 16px 16px !important;
        }
        .refonte2021 .sm-clean a,
        .refonte2021 .sm-clean a:hover,
        .refonte2021 .sm-clean a:focus,
        .refonte2021 .sm-clean a:active,
        .refonte2021 .sm-clean a.highlighted {
            overflow: hidden;
        }
        .refonte2021 #main-menu>li>a.highlighted,
        .refonte2021 #main-menu>li>a:hover,
        .refonte2021 #main-menu>li>a:focus,
        .refonte2021 #main-menu>li>a:active {
            background-color: var(--pad-light-color);
            border-radius: 16px !important;
        }
        body.refonte2021 #main-menu>li a {
            text-decoration: none !important;
        }
        .refonte2021 div[id^=zone-]>div:nth-child(n+3) .frame.nav--rubriques:not(.menu-secondaire-container):not(.apres-titre-seul) {
            padding: 0 !important;
        }
        .refonte2021 nav.main-nav {
            margin: 0 auto;
        }
        .refonte2021.home .entete .content {
            margin: 2em auto;
        }
        .refonte2021.home .frame.frame-ermes-carousel.entete {
            min-height: unset;
        }
    }
    
    .filterContainer .Slider-item.custom-select {
        position: static;
    }
    /* modification déportée pour liste filtrée (facilitation migration) */
    /* Christophe Leonardi Migration Syracuse : listes filtrées */
    
    .refonte2021 main div:not(.menu-type):not(.mozaik-wrap) a:hover,
    .refonte2021 .mozaik-liste a:hover,
    .refonte2021 .mozaik-liste a *:hover,
    .refonte2021 main div:not(.menu-type):not(.mozaik-wrap) a,
    .refonte2021 .mozaik-liste a,
    .refonte2021 .mozaik-liste a * {
        text-decoration: none !important;
        /* (refonte.css l.229) */
    }
    
    .refonte2021 #idMozaic {
        max-width: unset;
    }
    /* Plan du site */
    
    .refonte2021.plandusite main div:not(.menu-type):not(.mozaik-wrap) a,
    .refonte2021.plandusite h2 a {
        font-size: inherit;
        text-decoration: underline !important;
    }
    
    .refonte2021.plandusite h2 {
        margin: 1em 0 0.5em;
    }
	
	
	/* Résolution bug d'affichage pprd-pad  */
    .slick-prev .slick-prev-icon:before,
	.slick-next .slick-next-icon:before {
        content: "";
    }
	
/* PHILHARMONIE À LA DEMANDE correctifs migration équipe Archimed */
#portal .frame.entete .panel-heading,
#portal .frame.entete .panel-footer {

    padding: 0;
}


#portal .frame.nav--rubriques .panel-heading,
#portal .frame.nav--rubriques .panel-footer {

    padding: 0;
}

.frame.nav--rubriques .panel-footer,
#portal .frame.entete .panel-footer {

    background-color: transparent;
    border-top: none;

}



@media (min-width: 768px) {
    #main-menu>li>a.has-submenu {
        font-family: 'Philharmonique Semibold';
       
    }
}

.rsDefaultInv, .rsDefaultInv .rsOverflow, .rsDefaultInv .rsSlide, .rsDefaultInv .rsThumbs, .rsDefaultInv .rsVideoFrameHolder {
    background: #fff;
    
}
.panel-footer {
   
    background-color: transparent;
    border-top: none;
   
}





/*# sourceMappingURL=app.css.map*/