/*
Theme Name: Twenty Twenty-Four
Theme URI: https://wordpress.org/themes/twentytwentyfour/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Four is designed to be flexible, versatile and applicable to any website. Its collection of templates and patterns tailor to different needs, such as presenting a business, blogging and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full page designs to help speed up the site building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.
Requires at least: 6.4
Tested up to: 6.4
Requires PHP: 7.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfour
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

:root{
    --couleur--14: rgb(221,126,51);
    --couleur--27: rgb(77,28,154);
    --couleur--50: rgb(111,135,59);
    --couleur--61: rgb(9,148,180);
    --couleur--76: rgb(181,103,188);
    --couleur-bleu--entete: rgb(19,23,77);
    --couleur-bleu--contenu: rgb(17,8,83);/* #110853 */
    --bg-bleu--clair: rgb(233, 253, 254);/* #E9FDFE */
    --couleur--cge: #D22119;
    --couleur--ap: #E5A127;
    --couleur--jp: #DAA7C0;
    --couleur--pr: #9DD2D9;
    --couleur--fa: #291C4F /* film actu */
}

body{
    font-family: 'Lato';
    color: var(--couleur-bleu--contenu);
}

h1, h2, h3 {
    font-family: 'Poppins';
    color: var(--couleur-bleu--contenu);
    font-weight: bold;
}

h1{
    font-size: 2.976em;

}
h2{
    font-size: 2.38em;
}
h3{
    font-size: 1.488em;
}

.titrePage{
    display:flex;
    align-items: center;
    justify-content: center;
}

.titrePage h1{
    margin-bottom: 0;
}

.titrePage img{
    width: 10vw;
}

.texteBanniere{
    color:white;
    position:absolute;
    bottom: 2vh;
    right:2vw;
}

.contentCentered{
    text-align: center;
}

a{
    text-decoration: none;
}

.alignStart{
    align-items: start;
}

.wp-block-navigation-perso {
    text-align: right;
    padding-bottom: 2vh;
}

.wp-block-navigation-perso a{
    color: rgb(19,23,77);
    padding-left: 1vw;
    font-weight: normal;
}


.logoPerso{
    padding: 2vh 0;
}

a.wp-block-navigation-item__content:hover{
    text-decoration: none;
}

.wp-block-navigation.items-justified-right .wp-block-navigation__container .has-child .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container, .wp-block-navigation.items-justified-right .wp-block-page-list > .has-child .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container, .wp-block-navigation.items-justified-space-between .wp-block-page-list > .has-child:last-child .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container, .wp-block-navigation.items-justified-space-between > .wp-block-navigation__container > .has-child:last-child .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container{
    left: 100%;
}

.wp-block-navigation .has-child:not(.open-on-click):hover > .wp-block-navigation__submenu-container{
    min-width: 230px;
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
    background-color: #e9fdff;
}

.enteteAccueil .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container {
    background-color: transparent;
    border: none;
}

.wp-block-group{
    background: none;
    padding-top: 3vh;
    padding-bottom: 3vh;
}
.wp-block-columns{
    margin: 0;
    padding: 0;
}

.wp-block-media-text{
    column-gap: 5vw;
}
.wp-block-media-text p{
    margin: 0;
}
.wp-block-group-accueil2{
    padding: 0;
}
main.wp-block-group {
    margin: 0;
    padding-top: 0;
}

.entete{
    background-color: rgb(233, 253, 254);
    color: rgb(19,23,77);
}

header .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
    font-weight: bold;
    color: rgb(19,23,77);
}

.enteteAccueil a,.enteteAccueil .wp-block-navigation__submenu-icon, .enteteAccueil .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
    color:white;
    font-weight: bold;
}
.enteteAccueil {
    background-color: transparent;
    background-image: url("../../../../../prod/bannieres/banniere_accueil.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    position:relative;
}

header .wp-block-group .wp-block-group{
    margin: 0px;
    padding: 0px;
}

nav  ul.has-small-font-size {
    gap: 5px;
}

.footer_col{
    list-style: none;
    color: white;
    padding: 0px;

}

.footer_col a{
    color: white;
}

.logosPartenairesPied{
    background-color: rgba(239,237,242,0.8);
}

#piedMacao{
    padding-top: 0;
}
#piedPartenaires{
    padding-top: 2.5em;
    padding-bottom: 2.5em;
}

.lienContenu{
    width: 100%;
    border-radius: 1.5em;
}

.lienContenu a{
    border-radius: 1.5em;
    padding: 0.3em 1em;
    font-weight: bold;
    box-shadow: 0 5px 10px rgba(17,8,83,0.5);

}

.lienContenuFondBleu a{
    background-color: rgb(17,8,83);
    color: white !important;
}

.lienContenuFondBleu a:hover{
    background-color: white;
    color: rgb(17,8,83) !important;
}
/*********** slider films (selection de films) ****************/

#filmsSlide h2{
    font-weight: normal;
}
#filmsSlide{
    position: relative;
    text-align: center;
    padding: 2em 5vw;
    background-color: rgba(239,237,242,0.2);
    color: #2E0D8A;
}

#filmsSlide [class^="swiper-button-"]{
    background-color: var(--couleur-bleu--contenu);
    transform: scale(0.5, 0.5);
    border-radius: 100%;
    color: white;
    width: 2.6em;
    margin: 0 0;

}

#filmsSlide .swiper-button-prev{
    padding: 1em 1.4em 1em 1em;
}
#filmsSlide .swiper-button-next{
    padding: 1em 1em 1em 1.4em;
}

#filmsSlide .swiper-wrapper{
    width: 100%;
    text-align: center;
}
#filmsSlide .swiper-slide a{
    color: black;
}
#filmsSlide .swiper-slide a:hover{
    color: #2E0D8A;
}
.imgFilmSlideAccueil img{
    height:30vh;
    border-radius: 3vh;
}
.imgFilmSlideAccueil{
    padding: 0 2vw;
    height:30vh;
    overflow: hidden;
    border-radius: 3vh;
}

.imgFilmSlide img{
    height:50vh;
    border-radius: 3vh;
}

.titreFilmSlide{
    font-weight: bold;
    font-size: 1.2em;
    margin-bottom: 0;
}
.realFilmSlide{
    margin: 0;
}
/*********** accueil ****************/
.wp-image-148{
    min-width: 25vw;
}
figure:has(video){
    margin: 0;
}
.wp-image-447{
    margin-left: -3px;
}
/******* page assoc ******/

#liensAssos{
    position: absolute;
}

/********************************************/
/*****************************/
/* page salles */
/****************************/
#salles{
    color : var(--couleur-bleu--contenu);
}

#map{
    width:100%;
    aspect-ratio: 1.45;
    transform: scale(0.85);
}

#salles .swiper-slide{
    margin-bottom: 2em;
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
    row-gap: 3vh;
}

#salles .swiper-pagination-bullet {
    width: 3vw;
    height: 3vh;
    line-height: 3vh;
    font-size: 3vh;
    color: var(--couleur-bleu--contenu);
    opacity: 1;
    background: none;
}
#salles .swiper-pagination-bullet-active {
    font-weight: bolder;
}
#salles .swiper-pagination{
    bottom: 5.25vh;
}
#salles [class^="swiper-button-"]{
    top: initial;
    transform: scale(0.5, 0.5);
    bottom: 3.6vh;
    color: inherit;
    margin-left: 38%;
    margin-right: 38%;
    z-index: 12;
    background: none;
}

#salles .swiper-pagination{
    display: inline-block;
}
#listeSalles {
    padding-bottom: 15vh;
}
.nomsDep{
    text-align: center;
    margin-top: 0px;
}

.ligneDep{
    display: inline-block;
}

.codeCouleurDep{
    margin-right: 1.25em;
    font-size: 1.25em;
    font-weight: bold;
    color: white;
    border-top-left-radius: 1.5em;
    border-top-right-radius: 1.5em;
    border-bottom-left-radius: 1.5em;
    border-bottom-right-radius: 1.5em;
    padding-left: 1em;
    padding-right: 1em;
    padding-bottom: 0.2em;
    padding-top: 0.1em;
}
.codeCouleurDep:hover{
    cursor: pointer;
}
.bg14{
    background-color: var(--couleur--14);
}
.bg27{
    background-color: var(--couleur--27);
}
.bg50{
    background-color: var(--couleur--50);
}
.bg61{
    background-color: var(--couleur--61);
}
.bg76{
    background-color: var(--couleur--76);
}

.color14{
    color: var(--couleur--14);
}
.color27{
    color: var(--couleur--27);
}
.color50{
    color: var(--couleur--50);
}
.color61{
    color: var(--couleur--61);
}
.color76{
    color: var(--couleur--76);
}

.cellSalle{
    padding-left: 1vw;
}
.dep14{
    border-left: solid 0.5vw var(--couleur--14);
}

.dep50{
    border-left: solid 0.5vw var(--couleur--50);
}

.dep61{
    border-left: solid 0.5vw var(--couleur--61);
}

.dep27{
    border-left: solid 0.5vw var(--couleur--27);
}

.dep76{
    border-left: solid 0.5vw var(--couleur--76);
}
.cellSalle p{
    margin: 0px;
}
.cellSalle > a > p:first-child{
    font-weight:bold;
    font-size: 1.25em;
    margin-bottom: 1em;
}
.cellSalle img{
    border-radius: 1.5em;
}
/***** fiche salle *********************/
#enteteSalle{
    padding: 5em;
}
#photoSalle{
    flex-basis: 50%;
}
.gridSalle{
    flex-basis: 50% !important;
}
.gridSalle, .gridSalle h1, .gridSalle a, .gridSalle p{
    color:inherit;
}

.gridSalle h1{
    margin : 0px;
}
.gridSalle p{
    font-size: 2em;
    line-height: 1em;
    margin: 0 0 5vh;
}

.photoFicheSalle{
    width: 80%;
    box-shadow: 0 5px 10px grey;
    border-radius: 1.5em;
}

#rs a{
    margin-right: 1vw;
}

#photosSalle img{
    margin-bottom: -2vh;
}

#salleDetails{
    color: white;
    padding: 5vh 0;
    font-size: 1.4em;
}
#AEE{
    padding-left: 10vw;
    flex-basis:50%;
}

#structure{
    padding-left: 5vw;
    flex-basis:50%;
}

#structure span{
    font-weight: bold;
}

.salleDetailsIntitule{
    width: 50%;
    font-size: 3vh;
    font-weight: bold;
    padding-left: 1vw;
    background-color: white;
}

.structureDetails{
    list-style: none;
    padding: 0;
    font-weight: normal;
    line-height: 1.3;
}

.labelsSalle{
    list-style: none;
    font-weight: bold;
    padding: 0;
}
/*********** agenda ***************/
#agendaMini .swiper-slide, #agenda .swiper-slide {
    padding-top:1em;
    height: auto;
    background-color: rgb(247,117,117);
}

.swiperAgendaMini{
    background: linear-gradient(to right,rgb(247,117,117) 32%, white 32% 68%, rgb(247,117,117) 68%);
}

#agendaMini [class^="swiper-button-"]{
    background-color: rgb(255,157,156);
    transform: scale(0.5, 0.5);
    border-radius: 100%;
    color: white;
    width: 4vw;
    margin: 0 0;

}

#agendaMini h1 {
    color: inherit;
    margin-left: 4vw;
    margin-right: 4vw;
    margin-bottom: 0;
    padding-bottom: 0.3em;
    border-bottom: solid 5px white;
}

#agendaMini .swiper-wrapper{
    width: 100%;
    text-align: center;
}

#agendaMini .swiper-button-next{
    padding: 0.7em 0.7em 0.7em 1em;

}
#agendaMini .swiper-button-prev{
    padding: 0.7em 1em 0.7em 0.7em;
}

.swiper-button-next{
    right: -1vw;
}
.swiper-button-prev {
    left: -1vw;
}
#agenda .swiper-slide{
    display:grid;
    grid-template-columns: 33% 33% 33%;
}

#agenda .swiper-pagination-bullet{
    width: 3vw;
    height: 3vh;
    line-height: 3vh;
    font-size: 3vh;
    color: #FFF;
    opacity: 1;
    background: none;
}
#agenda .swiper-pagination-bullet-active {
    font-weight: bolder;
}
#agenda .swiper-pagination{
    bottom: 10vh;
}

#agenda [class^="swiper-button-"]{
    top: initial;
    background: none;
    transform: scale(0.5, 0.5);
    border-radius: 100%;
    color: white;
    bottom: 6.8vh;
    margin-left: 38%;
    margin-right: 38%;
    padding: 0.7em;
    width: 2.6em;
    z-index: 12;
}


#agenda .swiper-pagination-bullet-active-main{
    visibility: visible;
}

#agenda .swiper-pagination-bullet:not(.swiper-pagination-bullet-active-main){
    visibility: hidden;
}
#agenda .swiper-wrapper{
    width: 100%;
    text-align: center;
    padding-bottom: 20vh;
}
.bgActionAgenda0{
    background-color: var(--couleur--pr)
}
.bgActionAgenda1,.bgActionAgenda3,.bgActionAgenda4 {
    background-color: var(--couleur--jp)
}
.bgActionAgenda2{
    background-color: var(--couleur--cge);
}
.bgActionAgenda5{
    background-color: var(--couleur--ap);
}
.bgActionAgenda6{
    background-color: var(--couleur--fa);
}

.blockImgAgenda{
    width:80%;
    display: inline-block;
}
.imgAgenda{
    overflow: hidden;
    height: 27vh;
}
.imgAgenda img{
    border-top-left-radius: 1em;
    border-top-right-radius: 1em;
    width:100%;
}
.texteAgenda{
    display: inline-block;
    width: 80%;    
    padding-bottom: 1em;
    background-color: rgb(255,157,156);
}

.texteAgendaMini{
    width: 80%;
    height: 35vh;
}

.salleAgenda{
    border-radius: 3vh;
    background-color: white;
    margin: 0 1vw;
    padding: 0.5em;
    font-size: 1em;
    color:#291C4F;
    font-weight: 400;
}

.titreAnimAgenda{
    color:inherit;
    padding: 0 1vw;
    margin-bottom: 0;
    height: 10vh;
}

.titreFilmAgenda{
    font-weight: bold;
    font-size: 1.2em;
    padding: 0 1vw;
    height: 8vh;
}

.colonneAgenda{
    padding-bottom: 2em;
    border-left: solid 1px white;
    margin-left: -1px;
}

.seanceAgenda{
    padding-bottom: 2em;
}

.agenda{
    padding-top: 1em;
    font-weight: bold;
    color: white;
    width: 100%;
    background-color: rgb(247,117,117);
}

.agendaMini{
    padding-bottom: 5vh;
}
/***** page nos actions *********************/
#actions {
    display: grid;
    justify-items: center;
    align-items: center;
    grid-template-columns: 50% 50%;
    row-gap: 5vh;
    padding: 6vh 0 10vh 0;
}

#actions a{
    display:inline-flex;
    width: 70%;

}

.action{
    display:inline-block;
    padding-left: 0.5vw;
    color: var(--couleur-bleu--contenu);

}
.actionColGauche{
    width: 50%;
}

#actions img{
    width:12vw;
}

#actions p{
    margin: 0;
    font-size: 1.2em;
    line-height: 1.3em;
}
#actions ul{
    font-size: 1.2em;
    line-height: 1.3em;
}

#actions h3 {
    margin-bottom: 0.5em;
}

.descriptionCycle *{
    font-family: 'Lato' !important;
    font-size: 16px !important;
    color: var(--couleur-bleu--contenu) !important;
}
/************** actions **********************/

.boutonTelecharger{
    width: 50%;
    border-radius: 5vh;
    font-size: 1.3em;
    font-weight: bold;
    padding: 1vh 4vh;
    box-shadow: 0 0.2em 1em lightslategrey;
}

.boutonTelechargerAP{
    background-color:var(--couleur--ap);
}
.boutonTelechargerAP a{
    color: white;
}
.boutonTelechargerJP{
    color: var(--couleur--jp);
    background-color: white;
}

.boutonTelechargerCGE{
    color: var(--couleur--cge);
    background-color: white;
}
.boutonTelechargerPR{
    background-color:var(--couleur--pr);
}
.boutonTelechargerPR{
    color:  white;

}

#listeSallesAction {
    padding: 5vh 24vw;
    line-height: 2em;
    background-color: #e9fdff;
}
#listeSallesAction h3{
    margin: 0;
    font-size: 2em;
    text-align: right;
}
#listeSallesAction ul{
    list-style:none;
    margin:0;
    font-weight: bold;
    font-size: 1.1em;
}
#listeSallesAction a {
    color: var(--couleur-bleu--contenu);

}

.actionJP{
    background-color: var(--couleur--jp);
    margin:0;
    padding: 1.5em 0;
    color: white;
}

#actionsJP{
    padding: 2em 10vw;
}

#actionsJP a {
    flex-basis: 33%;
    margin-right: 5vw;
}

.imgJP {
    border-top-left-radius: 2vw;
    border-top-right-radius: 2vw;
    width:100%;
    aspect-ratio: 16/9;
    margin-bottom: -1vh;
}
.imgAction{
    width:20%;
    border-radius: 2em;
    border: solid white 0.4em;
}
.nomActionJP {
    font-size: 3vh;
    border-bottom-left-radius: 2vw;
    border-bottom-right-radius: 2vw;
    font-family: 'poppins';
    font-weight: bold;
    margin:0;
    padding: 1vh;
    background-color: var(--couleur--jp);
    color:white;
    text-align: center;
    box-shadow: 0 0.2em 1em lightslategrey;
}

.imgPartCFO{
    margin-right:2vw;
    height:10vh;
}
/** films */
.swiperFilmsAction{
    padding-bottom: 3em;
}

.imgFilm{
    overflow: hidden;
    height: 32vh;
}

.imgCodeAction{
    width: 15%;
    height:15%;
    position: absolute;
    Ztop:29%;
    left:42.5%;
    bottom: 55%;
    z-index:1;
}

.gridFilms{
    width:100%;
    padding-right: 5vw;
    display: grid;
    grid-template-columns: 33% 33% 33%;
    text-align: center;
    row-gap: 10vh;
    column-gap: 2.5vw;

}

.gridAgenda{
    width:100%;
    padding-right: 5vw;
    display: grid;
    grid-template-columns: 33% 33% 33%;
    text-align: center;
    row-gap: 10vh;
    column-gap: 2.5vw;

}

.cellFilm{
    display: inline-block;
    width:100%;
    border-radius: 0 0 2em 2em;
    box-shadow: 0 1em 1em lightslategray;
    font-size: 1.5vw;
}

.detailsFilm{
    padding-top: 1em;
    font-size: 0.8em;
}

.detailsFilm .titre{
    font-weight: bold;
    margin: 0;
    font-size: 1.4em;
    line-height: 1em;
}
.gridfilm{
    color:white;
    font-weight: bold;
    padding: 4vh 2vw 0 2vw;
    display: grid;
    grid-template-rows: 25vh 25vh;
}

.soutiensFilm{
    margin: 0;
    font-size: 0.7em;
    padding:0 1vw;
}

.bgAction0{
    background-image: radial-gradient(
        2.5vw at center 1vh,
        #6A969C,
        var(--couleur--pr)
        )
        ;
}
.bgAction1,.bgAction3,.bgAction4 {
    background-image:
        radial-gradient(
        2.5vw at center 1vh,
        #AD8096,
        var(--couleur--jp)
        )
        ;
}
.bgAction2{
    background-image:
        radial-gradient(
        2.5vw at center 1vh,
        #A31712,
        var(--couleur--cge)
        )
        ;
}
.bgAction5{
    background-image:
        /* linear-gradient(to bottom, #B0761B 0%,var(--couleur--ap) 4%),*/
        radial-gradient(
        2.5vw at center 1vh,
        #B0761B,
        var(--couleur--ap)
        )
        ;
}
.bgAction6{
    background-color: var(--couleur--fa);
}


.titreJourneesPro{
    margin-top: 0;
    font-weight: 500;
}

/***** film ********/


#ficheFilm{
    padding: 3vh 5vw 0 10vw;
    color:var(--couleur-bleu--contenu);
    font-size: 1.5em;
}

.titreFilm{
    padding-left: 1.5vw;
}

.afficheFilm{
    flex-basis: 30% !important;
    height: 65.1vh;
}
.baFilm{
    flex-basis: 70% !important;
    padding-left: 2vw;
}

.baIframe{
    width:100%;
    height: 65.2vh;
    border: 0;
}

.ficheTechniqueFilm{
    text-align: right;
    flex-basis: 30% !important;
}
.synopsisFilm{
    flex-basis: 70% !important;
    padding:0 10vw 0 5vw;
}
/*****************************/
/**** tablette **/
@media (min-width: 601px) and (max-width: 810px){
    nav :first-of-type {
        font-size:1.8vw;
    }
    #agendaMini [class^="swiper-button-"]{
        width: 3vw;
    }
}


/*******************************************/
/* only screen and (orientation: portrait) */
@media (max-width: 600px){


    h1{
        font-size: 2.4em;

    }
    h2{
        font-size: 2em;
    }
    h3{
        font-size: 1.5em;
    }

    .texteBanniere{
        bottom: 1vh;
        font-size: 0.8em;
    }

    #modal-1{
        background: none;
        width: 100%;
        margin: 0;
        padding: 0;
    }

    #modal-1-content{
        margin-top: 4vh;
        height: 35vh;
        text-align: left;
        background-color:  #e9fdff;
        padding: 1em;
        width:150%
    }

    #modal-1 .wp-block-navigation__responsive-dialog{
        margin: 0;
    }

    #modal-1-content  button{
        transform: rotate(-90deg);
    }

    #modal-1 .wp-block-navigation-perso a:not(a:has(img)){
        display: block;
    }
    .wp-block-navigation-perso {
        text-align: left;
        visibility: hidden;
    }
    .wp-block-navigation ul,.wp-block-navigation ul li{
        display: inline-block;
    }
    #modal-1-content ul > li > ul{
        left: 100%;
        top: 0;
        background-color:  #e9fdff;
    }

    button.wp-block-navigation__responsive-container-close{
        top: -3vh;
        right: 2vw;
    }

    .enteteAccueil, .entete {
        padding: 0;
    }

    .entete > .wp-block-group, .enteteAccueil > .wp-block-group {
        background-color: rgb(233, 253, 254);
        padding: 1vh 3vw !important;
    }
    .enteteAccueil a,.enteteAccueil .wp-block-navigation__submenu-icon, .enteteAccueil .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content {
        color: rgb(19,23,77);
    }

    .logoPerso {
        padding: 0;
    }

    .wp-block-post-content .wp-block-group{
        padding-left: 5vw !important;
        padding-right: 5vw !important;
        font-size: 1.2em !important;
    }

    main .wp-block-group{
        background: none;
        padding: 1vh 0;
    }

    .titrePage{
        display: block;
    }
    .titrePage h1 {
        text-align: center;
    }
    .titrePage img {
        width: 40vw;
    }

    .wp-block-media-text p{
        padding-top: 1em !important;
    }

    .wp-container-core-group-is-layout-5ace398a{
        text-align: center;
        padding: 0 !important;
    }
    .wp-container-core-group-is-layout-5ace398a h2{
        padding: 0 !important;
    }
    .wp-container-core-group-is-layout-5ace398a p{
        width: 100%;
    }


    .accueil2 *{
        text-align: center !important;
    }

    #actions {
        display: block;
        text-align: center;
        padding: 0;
    }

    #actions a {
        display: block;
        width: 100%
    }

    #actions img{
        width:50%;
    }

    .action{
        display: block;
        padding-bottom: 10vh;
    }

    .actionColGauche{
        width: 100%;
    }

    .salleAgenda{
        margin: 0 2vw;
    }

    .salleAgenda a{
        font-size: 2vh;
    }

    .swiperAgendaMini{
        background: inherit;
    }

    #liensAssos{
        position: static;
        max-width: 100%;
        font-size: 0.8em !important;
    }
    #liensAssos p{
        text-align: center !important;
    }

    #salles .swiper-slide{
        margin-bottom: 2em;
        display: grid;
        grid-template-columns: 100%;
        row-gap: 3vh;
    }

    .dep14{
        border-left: solid 1vw var(--couleur--14);
    }

    .dep50{
        border-left: solid 1vw var(--couleur--50);
    }

    .dep61{
        border-left: solid 1vw var(--couleur--50);
    }

    .dep27{
        border-left: solid 1vw var(--couleur--27);
    }

    .dep76{
        border-left: solid 1vw var(--couleur--76);
    }

    #listeSalles {
        padding-bottom: 0;
    }


    .codeCouleurDep{
        margin-right: 1em;
        margin-bottom: 2em;
        font-size: 1em;
    }

    .codeCouleurDeps{
        text-align: center;
    }


    .nomsDep{
        font-size: 0.7em;
        margin-bottom: 0;
    }

    .ligneDep{
        display: block;
        padding-bottom: 1vh;
        font-size: 0.8em;
    }

    .gridSalle p{
        font-size: 1.5em;
        margin: 0 0 0.5em;
    }

    #enteteSalle{
        padding: 2em;
    }
    #photoSalle{
        text-align: center;
        padding-bottom: 1em;
    }

    #photosSalle img{
        height: 35vh !important;
    }

    .photoFicheSalle{
        width: 100%;
    }


    #AEE{
        padding-left: 0;
    }

    #structure{
        padding-left: 0;
    }

    .salleDetailsIntitule{
        width: 100%;
        font-size:3vh;
        font-weight: bold;
        padding-left: 1vw;
        background-color: white;
    }


    #salleDetails{
        padding: 5vh 5vw;
        font-size: 1em;
    }

    .boutonTelecharger{
        text-align: center;
        font-size: 0.9em;
        width: 80%;
    }

    #previsionnages h2{
        text-align: center;
    }


    #actionsJP a {
        margin-bottom: 1em;
    }


    .imgJP {
        border-top-left-radius: 1em;
        border-top-right-radius: 1em;
    }
    .imgAction{
        width: 80%;
    }
    .nomActionJP {
        border-bottom-left-radius: 1em;
        border-bottom-right-radius: 1em;
    }

    .imgPartCFO{
        margin-right:2vw;
        height:4vh;
    }

    #listeSallesAction {
        padding: 1em;
        line-height: 2em;
        background-color: #e9fdff;
    }
    #listeSallesAction h3{
        font-size: 1.7em;
        text-align: left;
    }
    #listeSallesAction ul{
        padding-top: 1em;
        padding-left: 0;
        font-size: 1em;
    }

    #agenda .swiper-slide{
        display:grid;
        grid-template-columns: 100%;
    }

    /*********** films *****************/



    .gridFilms{
        display: grid;
        grid-template-columns: 100%;
        padding-right: 0;

    }

    .gridAgenda{
        display: grid;
        grid-template-columns: 100%;
        padding-right: 0;

    }
    
    
    .imgCodeAction{
        top:31.5%;
    }

    .imgFilm{
        overflow: hidden;
        height: 21.9vh;
    }

    .detailsFilm{
        padding-top: 1em;
        font-size: 0.8em;
    }

    .detailsFilm .titre{
        font-size: 1.4em;
        line-height: 1em;
    }

    .cellFilm{
        font-size: 1em;
    }

    .gridfilm{
        color:white;
        font-weight: bold;
        padding: 4vh 2vw 0 2vw;
        display: grid;
        grid-template-rows: 10.4vh 20vh;
    }

    .bgAction0{
        background-image: radial-gradient(
            7vw at center 1vh,
            #6A969C,
            var(--couleur--pr)
            )
            ;
    }
    .bgAction1,.bgAction3,.bgAction4 {
        background-image:
            radial-gradient(
            7vw at center 1vh,
            #AD8096,
            var(--couleur--jp)
            )
            ;
    }
    .bgAction2{
        background-image:
            radial-gradient(
            7vw at center 1vh,
            #A31712,
            var(--couleur--cge)
            )
            ;
    }
    .bgAction5{
        background-image:
            /* linear-gradient(to bottom, #B0761B 0%,var(--couleur--ap) 4%),*/
            radial-gradient(
            7vw at center 1vh,
            #B0761B,
            var(--couleur--ap)
            )
            ;
    }

    .synopsisFilm{
        padding: 0;
    }

    .baFilm{
        padding-top: 4vh;
        padding-left: 0;
    }


    .baIframe{
        height: auto;
    }

    .ficheTechniqueFilm{
        text-align: left;
    }

    #ficheFilm{
        font-size: 1em;
    }

    #ficheFilm h1{
        font-size: 1.8em;
    }


}