@charset "utf-8"; /* CSS Document */ * { margin:0; padding:0; -webkit-text-size-adjust: none; box-sizing:border-box;-moz-box-sizing:border-box;} a { text-decoration:none; color:#e92e71;} ul { list-style:none;} img { border:0; height:auto; max-width:100%; vertical-align: bottom;} body { font:400 16px/19px 'Hind', sans-serif; color:#303030; background:#15263c;} .wrap { margin: 0 auto; width:1360px; padding : 0 80px;} .wrap::after { display:block; clear:both; content:" ";} .fiche-resa #bt-reserver, .fiche-resa #bt-reserver:hover, a, a:hover , .bouton, .bouton:hover, #diaporama-accueil .diaporama-bottom .social ul li img, #diaporama-accueil .diaporama-bottom .social ul li:hover img, footer .homesocial-footer ul li img, footer .homesocial-footer ul li:hover img, #evenements-display-more, #evenements-display-more:hover,#evenements-display-more::before, #evenements-display-more:hover::before, .bloc.social ul li img, .bloc.social ul li:hover img, footer .bottom .logo-partenaires ul li img, footer .bottom .logo-partenaires ul li:hover img, button[type=submit], button[type=submit]:hover, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1:hover > a, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1 > a , nav div#maximenuck90 ul.maximenuck li.maximenuck.level1:hover > a span.titreck, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1 > a span.titreck, a.jcepopup:hover span.jcemediabox-zoom-image, a.jcepopup span.jcemediabox-zoom-image, ul.share-buttons li a img, ul.share-buttons li a:hover img, main.main article .btn-violet:hover, main.main article .btn-violet, main.main article .btn-violet a, main.main article .btn-violet:hover a { -webkit-transition: all 0.5s ease-in-out ; -moz-transition: all 0.5s ease-in-out ; -ms-transition: all 0.5s ease-in-out ; -o-transition: all 0.5s ease-in-out ; transition: all 0.5s ease-in-out ;} /* { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; display:table\9;} */ @media all{ /** IC Produit Julien **/ .month-details.ajax_month{display:none;} .event-details.ajax_event{display:none;} /*************************************** HEADER ****************************************************/ header { background-color : #0d1b2e; position: fixed; width: 100%; top: -1px; z-index: 999;} header .wrap {position: relative ; padding: 40px 0 25px; } header #logo {text-align :center ;} header .logocreditmutuel {position: absolute; top: 0px; left: 270px; color: #fff;} header .logocreditmutuel img {max-width: 225px;} /*** MENU ***/ nav #maximenuck90 {margin-top: 35px;} nav div#maximenuck90 ul.maximenuck {background: none;border: none; box-shadow: none; position : inherit ; padding : 0 ;text-align :center ;} nav div#maximenuck90 ul.maximenuck li.maximenuck.level1:hover, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1.active {border: none;background: none ; border-radius: 0; } nav li { display: inline; } nav li + li {margin-left : 40px; } nav div#maximenuck90 ul.maximenuck li.maximenuck.level1 > a, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1 > span.separator {color: #cdcdcd; text-transform: uppercase; font: 500 15px 'Hind', sans-serif; text-shadow: none ; min-height: initial;} nav div#maximenuck90 ul.maximenuck li.maximenuck.level1:hover > a span.titreck, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1.active > a span.titreck, nav div#maximenuck90 ul.maximenuck li.maximenuck.level1:hover > span.separator,nav div#maximenuck90 ul.maximenuck li.maximenuck.level1.active > span.separator { text-shadow: none; color :#e92e71;} nav div#maximenuck90 ul.maximenuck li.maximenuck.level1 {border:none ; } nav div#maximenuck90 div.floatck { background: #fff; margin-top: 27px; padding: 10px;border-radius: 0; border: none ; } nav div#maximenuck90 ul.maximenuck li ul.maximenuck2 li.maximenuck, nav div#maximenuck90 ul.maximenuck2 li.maximenuck {font-size: 13px; text-shadow:none; padding: 5px 0px;margin: 0px; } nav div#maximenuck90 ul.maximenuck li.maximenuck ul.maximenuck2 li a, nav div#maximenuck90 ul.maximenuck2 li a { color: #000000; text-shadow: none; font: 500 13px/15px 'Hind', sans-serif;} nav div#maximenuck90 ul.maximenuck li.maximenuck ul.maximenuck2 li + li, nav div#maximenuck90 ul.maximenuck2 li + li { border-top: 1px solid #f0f0f0; padding-top: 10px; margin-top: 5px;} nav div#maximenuck90 ul.maximenuck2 li:hover > a, nav div#maximenuck90 ul.maximenuck li.maximenuck ul.maximenuck2 li:hover > a, nav div#maximenuck90 ul.maximenuck li.maximenuck ul.maximenuck2 li.active > a {color: #e92e71;} nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent > a:after, nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent > span.separator:after { border-width: 4px 3px 0 3px;top: 8px;right: 0px;} nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent:hover > a:after, nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent:hover > span.separator:after, nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent.active > a:after, nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent.active > span.separator:after { border-top-color: #e92e71;} nav div#maximenuck90.maximenuckh .maximenucklogo, nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent > a:after, nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent > span.separator:after {display : none ;} nav div#maximenuck90.maximenuckh ul.maximenuck li.level1.parent > span.separator {padding-right : 0 ; }/* nav li.item101 { display:none !important;}*/ /*** MENU MOBILE ***/ .mobilebarmaximenuck {background-color:#0d1b2e; height: auto; padding: 5px 0; z-index: 99999; width: auto; right: 0; left: inherit;} .mobilemaximenuck .maximenucklogo { background-color: #0d1b2e; padding: 0 0 30px; text-align: center; display: inline-block; width: 100%; margin-bottom: 10px;} .mobilemaximenuck .maximenucklogo img {float : none !important ;} .mobilebarmenutitleck, .mobilemaximenuck .mobilemaximenucktitle{color: #fff; font-size: 16px; text-transform: uppercase;} .mobilemaximenuck .mobilemaximenucktitle {color: #fff ; padding: 15px 0 0 20px;} .mobilebuttonmaximenuck{background:url(../images/pictos/icon_launch.png) no-repeat;} .mobilemaximenuck .mobilemaximenucktopbar {background-image : none ; background-color: #0d1b2e; height: 55px;} .mobilemaximenuck {background-color: #0d1b2e; font: 400 14px 'Hind', sans-serif ;text-shadow :none ;width: 100% !important;} .mobilemaximenuck div.level1.maximenuck > a {background: none ; text-shadow: none; height: auto; padding:10px 15px; font: 400 16px 'Hind', sans-serif ; text-transform: uppercase; text-align :center ;} .mobilemaximenuck div.maximenuck{background: none ; padding-bottom: 0; min-height: 25px; line-height: 25px;} .mobilemaximenuck .mobilemaximenuckitem{border-bottom:none; } .mobilemaximenuck div.maximenuck > a{color: #fff !important; } .mobilemaximenuck div.maximenuck:hover, .mobilemaximenuck div.maximenuck:focus, .mobilemaximenuck div.maximenuck.active{color: #8783bc; background: transparent ;} .mobilemaximenuck div.maximenuck:hover a, .mobilemaximenuck div.maximenuck:focus a, .mobilemaximenuck div.current > a, .mobilemaximenuck div.maximenuck.active > a {color: #e92e71 !important; } .mobilemaximenuck div.current > a:after {background: none ; display : none ;} .mobilemaximenucktogglericon { margin-right: 5px; top: 0px; background: url(../images/pictos/plus.png) center center no-repeat;} .open .mobilemaximenucktogglericon { background-image : url(../images/pictos/moins.png) ;} .mobilemaximenuck div.level2.maximenuck > a { background: none ; padding-left : 0; text-align: center;} .mobilemaximenuck div.level2.maximenuck > a::before {display : none ; } .mobilemaximenuck .mobilemaximenuckclose{background: url(../images/pictos/close.png) no-repeat center center ;height: 40px;} /*************************************** ACCUEIL ****************************************************/ h1.accueil {color : transparent ; float : right ;height: 0; } #diaporama-accueil { position :relative; background-color :#000; margin-bottom: 55px; } #diaporama-accueil .rev_slider_wrapper .tp-caption {position : absolute; color :#fff; top: 10%; left: 10%;} #diaporama-accueil .rev_slider_wrapper .tp-caption.titre_diaporama {font : 600 65px 'Hind', sans-serif;text-transform : uppercase ; margin-bottom: 10px; } #diaporama-accueil .rev_slider_wrapper .tp-caption.texte_diaporama {font :300 30px 'Hind', sans-serif;text-transform : uppercase ; margin-bottom: 30px; } #diaporama-accueil .rev_slider_wrapper .tp-caption.bouton {font: 400 20px 'Hind', sans-serif; text-transform: uppercase;background: -webkit-linear-gradient(to bottom , #df016b, #e7671f); background: -o-linear-gradient(to bottom , #df016b, #e7671f); background: -moz-linear-gradient(to bottom , #df016b, #e7671f); background: linear-gradient(to bottom , #df016b, #e7671f);color: #fff; border-radius: 5px; padding: 10px 15px; cursor: pointer;display: inline-block; -webkit-transition: background-color 0.3s, color 0.3s;transition: background-color 0.3s, color 0.3s; padding: 12px 17px;} #diaporama-accueil .rev_slider_wrapper .active-revslide:hover {cursor: pointer; } #diaporama-accueil .rev_slider_wrapper .active-revslide:hover .tp-caption.bouton {background: #fff; color: #e92e71; border-radius: 0; } #diaporama-accueil .rev_slider_wrapper .tp-caption:hover .bouton {background: #fff !important; color: #e92e71 !important;border-radius: 0 !important;} #diaporama-accueil .rev_slider_wrapper .tp-leftarrow.default {background: url(../images/diaporama-prev.png) no-repeat center center ; height : 70px; width : 70px;} #diaporama-accueil .rev_slider_wrapper .tp-rightarrow.default { background: url(../images/diaporama-next.png) no-repeat center center; height : 70px; width : 70px;} #diaporama-accueil .rev_slider_wrapper .tp-caption.fond_noir {height : 101%;} #bandeau {height: 320px; overflow: hidden ; position :relative; } #bandeau img {width : 100%; } #diaporama-accueil .diaporama-bottom {background-color : #0d1b2e ; padding-bottom: 60px;padding-top: 30px; } #diaporama-accueil .diaporama-bottom .wrap {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; } #diaporama-accueil .diaporama-bottom .wrap > p.title, #diaporama-accueil .diaporama-bottom .social p {width: 100%; color: #fff; text-transform: uppercase; font : 600 22px/25px 'Hind', sans-serif ;padding: 20px 0; position : relative ; display: block;} #diaporama-accueil .diaporama-bottom .social p {font-size : 18px; width : auto ;} #diaporama-accueil .diaporama-bottom .social p , #diaporama-accueil .diaporama-bottom .social ul {display : inline ;} #diaporama-accueil .diaporama-bottom .flex {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap;float :left ; width : 100%; } #diaporama-accueil .diaporama-bottom .nouveautes { width: calc(100% - 265px); margin: auto;} #diaporama-accueil .diaporama-bottom .nouveautes ul {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; float : left ;width : 100%; } #diaporama-accueil .diaporama-bottom .nouveautes ul li {width : 24%;margin : 0 0.5%; float : left ;} #diaporama-accueil .diaporama-bottom .nouveautes ul li img {width : 100%; } #diaporama-accueil .diaporama-bottom .rightbottomdiaporama { width: 250px; margin-left: auto;} #diaporama-accueil .diaporama-bottom .attention { background: url(../images/background-attention.jpg) repeat-y top left #e7671f ;background-size: contain;padding: 20px;} #diaporama-accueil .diaporama-bottom .attention h2 { background: url(../images/attention.png) no-repeat left top; padding-top: 55px; font-size: 16px; text-transform: uppercase; color: #fff; font-weight: 500; margin-bottom :20px;} #diaporama-accueil .diaporama-bottom .attention p, #diaporama-accueil .diaporama-bottom .attention p a { font-size: 16px; color: #fff;} #diaporama-accueil .diaporama-bottom .attention p a { text-decoration: underline;} #diaporama-accueil .diaporama-bottom .attention p a:hover {text-decoration : none ;} #diaporama-accueil .diaporama-bottom .social {width : 100%; text-align: right; margin-top: 20px; } #diaporama-accueil .diaporama-bottom .social ul {margin-left: 10px; } #diaporama-accueil .diaporama-bottom .social ul li {display : inline ; padding : 0 2px; } #diaporama-accueil .diaporama-bottom .social ul li img { vertical-align: bottom; margin-top: 8px; width: 25px;} #diaporama-accueil .diaporama-bottom .social ul li:hover img, footer .homesocial-footer ul li:hover img{ filter :opacity(60%);} #programmation-accueil .moteur-recherche.filters{ margin-bottom: 30px; display: inline-block; width: 100%;padding: 0 100px;} #programmation-accueil .moteur-recherche.filters form { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; justify-content: space-between; align-items: center ; width : 100%; padding: 0px 75px;} #programmation-accueil .moteur-recherche.filters .SumoSelect > .CaptionCont, #programmation-accueil .moteur-recherche.filters input[type=text] { border: none; background-color: #fff; padding: 10px; font: 500 18px 'Hind', sans-serif; color :#292929; border-radius : 0 ; } #programmation-accueil .moteur-recherche.filters input[type=text] {background: url(../images/search.png) no-repeat 20px center #fff; padding-left : 50px; width : 65%; flex: 1 1 0%; float : left; outline : none ;} #programmation-accueil .moteur-recherche.filters input[placeholder], [placeholder], *[placeholder] { color: #292929 !important;} #programmation-accueil .moteur-recherche.filters .SumoSelect {width : initial; min-width : 280px;} #programmation-accueil .moteur-recherche.filters .SumoSelect > .CaptionCont > label > i { cursor: pointer;height: 100%;background: url(../images/flecheselect.png) no-repeat center center ; border-left : 1px solid #292929;width: 50px; } #programmation-accueil .moteur-recherche.filters .SumoSelect > .CaptionCont > label { width: 50px;} #programmation-accueil .moteur-recherche.filters .SumoSelect.open > .optWrapper { top: 49px;} #programmation-accueil .moteur-recherche.filters .SumoSelect > .CaptionCont > span { padding-right: 50px;} #programmation-accueil .moteur-recherche.filters span.transition{ margin: 0 10px; font-weight: 600; color :#fff; } #programmation-accueil {padding-top: 30px;} #programmation-accueil .wrap{padding : 0 ;} #diaporama-accueil .diaporama-bottom .wrap {padding : 0 175px; } #programmation-accueil h2.title { font: 600 45px/45px 'Hind', sans-serif; color: #fff; margin: 25px 0 20px; text-transform: uppercase; padding: 0 175px;} #programmation-accueil .contenu.listing {padding:0 175px 130px; } #programmation-accueil .contenu.listing .month-events{ display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items:strech; } #programmation-accueil .contenu.listing .month-events .event-details {background-color :#fff; margin: 0 0 40px 2%; width: 23.5%;padding-bottom: 80px; position :relative; float : left ; } #programmation-accueil .contenu.listing .month-events .event-details:nth-child(4n+1) {margin-left: 0; clear : left ;} #programmation-accueil .contenu.listing .month-lib{ font: 600 30px/30px 'Hind', sans-serif; color: #e92e71; margin: 30px 0; text-transform : uppercase;clear: both; } #programmation-accueil .contenu.listing .event-details .event-img { position: relative; } #programmation-accueil .contenu.listing .event-details .event-img a {display : block ;} #programmation-accueil .contenu.listing .event-details .event-img img {width : 100%; vertical-align: middle;} #programmation-accueil .contenu.listing .event-details .event-img img.cesoir {position: absolute; top: 0; left: 0; width: auto; height : auto ;} #programmation-accueil .contenu.listing .event-details .event-infos { background-color: #fff; padding: 15px 5px; text-align: center; color :#858585; font-weight : 600; } #programmation-accueil .contenu.listing .event-details .event-infos h2{ font-size: 18px; margin-bottom: 15px;color :#171717;margin-top: 10px;text-transform: uppercase; } #programmation-accueil .contenu.listing .event-details .event-infos span.date-annulee, .event-details .event-infos span.date-reportee , .event-details .event-infos span.date-complete {color :#ff0000;} #programmation-accueil .contenu.listing .event-details .event-infos p.readmore a{ cursor: pointer;color :#fff; background-color :#e92e71; text-transform : uppercase ; margin-top: 15px; position: absolute; bottom: 20px; width: calc(100% - 40px); font-size: 15px; left: 20px; padding: 15px 5px;border: 1px solid #e92e71;} #programmation-accueil .contenu.listing .event-details .event-infos p.readmore a:hover { background-color: #fff; border: 1px solid #e92e71; color: #e92e71;} #programmation-accueil .contenu.listing .event-details.effect { opacity:0; -moz-transition: all 700ms ease; -webkit-transition: all 700ms ease; -o-transition: all 700ms ease; transition: all 700ms ease; -moz-transform: translate3d(0px, 100px, 0px); -webkit-transform: translate3d(0px, 100px, 0px); -o-transform: translate(0px, 100px); -ms-transform: translate(0px, 100px); transform: translate3d(0px, 100, 0px); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden;} #programmation-accueil .contenu.listing .event-details.effect.visible { opacity:1; -moz-transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); -o-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate3d(0px, 0px, 0px);} #programmation-accueil #evenements-display-more { clear: both ; cursor: pointer;text-transform: uppercase; color: #fff; font: 600 20px 'Hind', sans-serif; border-bottom: 1px solid #fff; display: table; margin: 30px auto 0px; position :relative; } #programmation-accueil #evenements-display-more::before{ content: ' + '; color: #fff; background-color: #e92e71; font-size: 30px; width: 50px; text-align: center; font-weight: 300;border : 1px solid #e92e71; position: absolute; height: 45px; left: -60px; top: -5px;} #programmation-accueil #evenements-display-more:hover { color: #e92e71; border-bottom: 1px solid #e92e71;} #programmation-accueil #evenements-display-more:hover::before {background-color: #fff; border : 1px solid #e92e71; color :#e92e71; } footer.home {background: url(../images/zenith-footer-social.jpg) no-repeat top center #0d1b2e; background-size : contain; } footer .homesocial-footer { padding:140px 0 80px; text-align: right; color: #fff; display: inline-block; width: 100%; text-align : center; } footer .homesocial-footer p strong{ font: 600 35px/40px 'Hind';text-transform: uppercase;} footer .homesocial-footer ul{margin-bottom : 15px ;} footer .homesocial-footer ul li{ display: inline ; padding : 0 7px;} #icfacebook-container.ajax-processing{height: 440px; background: url("../images/ajax-loader.gif") no-repeat center center ; } #icfacebook-container.ajax-processing .facebook-item{ display: none; } footer .facebook-items { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; justify-content: space-between; padding : 0 150px; } footer .facebook-items > div { width: 31%;background-color :#fff; float :left; margin-bottom: 115px; } footer .facebook-items > div + div {margin-left : 2%;} footer .facebook-items > div .facebook-item-intro, footer .facebook-items > div .facebook-desc, footer .facebook-items > div .facebook-item-footer {margin : 15px 25px;} footer .facebook-items > div .facebook-desc {margin-top: 0 ; overflow: hidden; text-overflow: ellipsis; display: inline-block;line-height: 20px; max-height: 60px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; min-height: 60px;font-size: 14px; width: calc(100% - 50px);} footer .facebook-items > div .facebook-item-intro {color: #969aa1; font-weight: 600; font-size: 14px; display: inline-block;width: calc(100% - 50px);} footer .facebook-items > div .facebook-item-intro .nom-page a {color :#001b75; margin-top: 5px; display: block;} footer .facebook-items > div .facebook-item-intro .img-page{ float: left; border: 1px solid #ebebeb; margin-right: 20px;} footer .facebook-items > div .facebook-item-intro .date-publication { font-weight: 600; font-size: 12px;} footer .facebook-items > div .facebook-image {background-size : cover ; height: 185px; overflow: hidden; background-position: 50% 50%;} footer .facebook-items > div .facebook-image img {display : none ;} footer .facebook-items > div .facebook-item-footer { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap;font-weight: 600; font-size: 14px; font-weight: 300; float: left; width: calc(100% - 50px); } footer .facebook-items > div .facebook-item-footer > div {color :#b9b9b9;background: url(../images/pictos/picto-like.png) no-repeat left 2px ; padding-left: 20px; float : left; } footer .facebook-items > div .facebook-item-footer > div a {color :#b9b9b9;} footer .facebook-items > div .facebook-item-footer > div:hover a{color: #919191; } footer .facebook-items > div .facebook-item-footer .partager {margin-left : auto; color :#919191;background-image : url(../images/pictos/picto-partage.png); float :right; } footer .facebook-items > div .facebook-item-footer .partager a {color :#919191;} footer .facebook-items > div .facebook-item-footer .partager:hover a {color :#b9b9b9; } footer .facebook-items > div .facebook-item-footer .nbcomment { background : url(../images/pictos/picto-commentaire.png) no-repeat left 3px ; margin-left: 15px; } /*************************************** CONTENU ****************************************************/ main.main, #diaporama-accueil {position : relative ; margin-top: 195px;} main.main {background-color :#fff; } /***** fil d'ariane ****/ #breadcrumbs { padding:20px 0; font-size:12px; font-weight : 300; position : absolute ; top: 0; display : inline-block; width : 100%; z-index: 99; } #breadcrumbs div { float:left; padding:0 2px;color:#a7a7a7;} #breadcrumbs div a , #breadcrumbs div span{ color:#a7a7a7;} #breadcrumbs div a:hover {text-decoration : underline; } /******************* CONTENU **************************/ main.main article, main.main .blog, main.main #osmap{ background-color: #fff ; padding: 90px 190px 100px; min-height: 540px; display: inline-block; width: 100%;} main.main #bandeau + .wrap { min-height: 500px;} article h1, .fiche-event .fiche-col-right .fiche-info h1, main.main h1 { font :600 45px/45px 'Hind'; color:#000000; margin-bottom: 40px;text-transform : uppercase; } article h1, main.main h1 {margin-bottom: 45px; } .fiche-event .fiche-col-right .fiche-info h1{ width: calc(100% - 150px); color : #fff ;} article .introduction, .fiche-event .fiche-col-right .fiche-info .sous-titre {font-size : 15px; background: url(../images/border-introduction.jpg) no-repeat left bottom transparent ; padding-bottom : 15px; margin-bottom: 50px; display: inline-block; } article h2, main.main #osmap h2 { font:600 24px/29px 'Hind', sans-serif; color:#e92e71; margin-bottom: 15px;} article h2 strong{ font-size: 29px; font-weight: 600;} article h3 {font:600 20px 'Hind', sans-serif; color:#303030; margin-bottom: 10px;} article p { line-height:20px;text-align:justify;} article li { line-height:22px; padding-left: 1em; text-indent: -1em; position :relative; list-style-type: none; } main.main #bandeau + .wrap ul { margin : 10px 0;} main.main #bandeau + .wrap article ul { margin : 0;} main.main #bandeau + .wrap article ul > li + li, article ul > li + li {margin-top : 10px ;} main.main #bandeau + .wrap article ul ul > li + li, article ul ul > li + li { margin-top: 0;} article li li { margin-left:40px;} article li li li{ margin-left:10px;} article li::before { content:"\2022\ ";color:#; padding-right:5px;} article li ul li::before { content:"\00BA\ "; position :absolute ; top: 5px;} article li ul ul li::before { content:"\00BB\ ";position :relative ; top: 0px;} main.main article table.blocviolet {background-color : #e92e71 ; padding : 35px; color :#fff; width : 100%; display : inline-block ; margin : 10px 0 ;} main.main article table.fondgris {background-color : #f4f4f4 ; padding : 15px; width : 100%; } main.main article table.blocviolet, main.main article table.fondgris {font: 400 16px/19px 'Hind', sans-serif; } main.main article table.blocviolet p,main.main article table.blocviolet a,main.main article table.blocviolet h2 {color :#fff; } main.main article ul.listing{width : 100%; display : inline-block ; } main.main article ul.listing li{width : 20%; float : left; } main.main article ul.listing li + li{margin-top: 0 !important ; } main.main article ul.listing li:nth-child(4n+1) {clear :right ;} main.main article a.jcepopup span.jcemediabox-zoom-image {background:url(../images/pictos/zoom-img.png) no-repeat center center rgba(0,0,0,0.05); background-size: 28px;} main.main article a.jcepopup:hover span.jcemediabox-zoom-image {background-color : rgba(0,0,0,0.2); } main.main article #jcemediabox-popup-page.android span#jcemediabox-popup-numbers { margin-top: 5px;} main.main article .bx-wrapper .bx-controls-direction a { background: url(../images/pictos/fleche-left.png) no-repeat center center transparent; background-size: 9px; opacity: 0; left: -30px; } main.main article .bx-wrapper .bx-controls-direction a.bx-next {background-image : url(../images/pictos/fleche-right.png) ; right : -30px ; left : initial ;} main.main article .bx-wrapper:hover .bx-controls-direction a {opacity : 0.7; } main.main article .btn-violet { text-transform: uppercase; color: #fff; margin: auto; background: #e92e71; font: 600 20px 'Hind', sans-serif; border: 1px solid #e92e71; text-shadow: none; padding: 7px; display: inline-block; } main.main article .btn-violet a, main.main article a span.btn-violet {color :#fff; } main.main article .btn-violet:hover, main.main article a span.btn-violet:hover {background-color :#fff; color :#e92e71 ;} main.main article .btn-violet:hover a, main.main article a span.btn-violet:hover { color :#e92e71 ;} main.main article table.galerie {width : 100% !important ; } main.main article table.galerie td p {text-align :center ; font-size : 15px; } /** Plan du site **/ main.main #osmap h2{ text-transform: uppercase; margin: 20px 0 10px;} main.main #osmap ul ul li::before { content:"\2022\ ";color:#; padding-right:5px;} main.main #osmap ul.level_1{margin : 0 20px; } main.main #osmap ul li {line-height : 25px;} main.main #osmap ul li a{color :#303030; } main.main #osmap ul li a:hover {color :#8783bc ;} /** Connexion **/ main.main .login form fieldset { padding: 60px 40px; background: #f6f6f6; border : none ;margin-top: 20px;} main.main .ficheprogrammezenith {background-color: #0d1b2e ;} main.main .ficheprogrammezenith .wrap { position :relative;} main.main .login form fieldset input[type="text"], main.main .login form fieldset input[type="password"] { outline : none ; border: 1px solid #c4c4c4;padding: 5px;background-color: #fff; height: 35px; border-radius: 0; width: 100%; font: 400 16px/19px 'Hind', sans-serif;} main.main .login form fieldset div + div {margin-top: 15px;} main.main .login form fieldset .rememberme .control-label { float : left ; margin-right : 10px;} main.main .login form fieldset button {cursor: pointer ;width: 150px; text-transform: uppercase; color: #fff; margin: 20px auto 0; background: #e92e71; font: 600 20px 'Hind', sans-serif; border: 1px solid #e92e71; text-shadow: none;padding: 7px; box-shadow: none;} main.main .login form fieldset button:hover {color: #e92e71;background: #fff; } /*iframe {width : 100%; } */ /** Fiche Spectacle **/ .fiche-event {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap;} .fiche-event .fiche-col-left { float: left; width: 365px;margin-top: 90px; } .fiche-event .fiche-col-right { float: right; background-color: #15263c; width: calc(100% - 365px); padding: 90px 90px 160px;min-height: 1100px; color: #fff; } .fiche-event .fiche-col-left > div {width: calc(90% - 80px);margin-left : 80px; } .fiche-event .fiche-col-left > .image-spectacle {margin-left : 0; width : 100%; } .navigation{ position: absolute; top: 30px;} .navigation .retour-prog {margin-bottom: 35px;} .navigation .retour-prog a{ font : 500 18px 'Hind', sans-serif; color:#fff; margin-bottom: 15px;text-transform : uppercase; background: url(../images/fleche-retour.png) no-repeat left top 8px ; padding-left: 25px;} .navigation .retour-prog a:hover { padding-left : 20px; } .fiche-event .fiche-col-right .fiche-first-part, .fiche-event .fiche-col-right .fiche-horaire, .fiche-event .fiche-col-left .fiche-stationnement {background-color: #fff; text-align: center ; padding-bottom: 20px; margin-top: 20px;} .fiche-event .fiche-col-right .fiche-horaire {margin-top: 0 ;} .fiche-event .fiche-col-right .fiche-first-part span.first-part {font-weight : 600;} .fiche-event .fiche-col-right .titre, .fiche-event .fiche-col-right .titre-horaire, .fiche-event .fiche-col-left .titre-stationnement, .fiche-event .fiche-col-right .titre {text-align:center ; background-color :#736fac; color :#fff; text-transform: uppercase; font: 500 14px 'Hind', sans-serif; padding: 10px; margin-bottom: 20px; } .fiche-event .fiche-col-left .titre-stationnement::before { content: ''; background: url(../images/pictos/picto-stationnement.png) no-repeat left 15% center; width: 15px; height: 15px; padding-right: 30px; padding-top: 5px;} .fiche-event .fiche-col-right .titre-horaire {background: url(../images/pictos/picto-horaires.png) no-repeat left 17% center #736fac;} .fiche-event .fiche-col-right .titre, .fiche-event .fiche-col-left .titre {background-color :#736fac;} .fiche-event .fiche-col-left .titre, .fiche-event .fiche-col-left .titre-stationnement {;background: -webkit-linear-gradient(to right , #df016b, #e7671f); background: -o-linear-gradient(to right , #df016b, #e7671f); background: -moz-linear-gradient(to right , #df016b, #e7671f); background: linear-gradient(to right , #df016b, #e7671f);} .fiche-event .fiche-col-right .rightfiche .data, .fiche-event .fiche-col-left .fiche-stationnement .data { font: 600 28px/28px 'Hind', sans-serif; color: #e92e71;text-transform: uppercase} .fiche-event .fiche-col-right .fiche-horaire-ouverture, .fiche-event .fiche-col-right .fiche-horaire-debut-show, .fiche-event .fiche-col-right .fiche-horaire-fin-show {padding : 7px 0 ;} .fiche-event .fiche-col-left .reseaux_sociaux { font: 400 18px 'Oswald', sans-serif; text-transform: uppercase; color: #fff; margin-top: 30px; } .fiche-event .fiche-col-left .reseaux_sociaux p { float: left; padding-top: 3px; margin-right: 15px;} .fiche-event .fiche-col-left .reseaux_sociaux ul.share-buttons li {display : inline; margin: 0 5px; } .fiche-event .fiche-col-left .reseaux_sociaux ul.share-buttons li img {vertical-align: middle; width: 22px;} .fiche-event .fiche-col-left .reseaux_sociaux ul.share-buttons li a:hover img {filter : grayscale(100%); opacity : 0.7; } .fiche-event .fiche-col-right .fiche-info {position : relative ;} .fiche-event .fiche-col-right .fiche-info .sous-titre {font-size : 22px; padding-bottom: 10px; margin-bottom: 35px; width: 100%;} .fiche-event .fiche-col-right .fiche-info .fiche-resa { position: absolute; right: 0; top: 0 ;} .fiche-event .fiche-col-right .fiche-info .fiche-resa #bt-reserver {font : 600 23px 'Hind', sans-serif; text-transform : uppercase ;border: none ; background: -webkit-linear-gradient(to right , #df016b, #e7671f); background: -o-linear-gradient(to right , #df016b, #e7671f); background: -moz-linear-gradient(to right , #df016b, #e7671f);background: linear-gradient(to right , #df016b, #e7671f); color :#fff; border-radius : 5px ; padding : 7px 25px 2px;cursor: pointer;} .fiche-event .fiche-col-right .fiche-info .fiche-resa #bt-reserver:hover { background: #fff; color: #e92d71;border-radius : 0; } .fiche-event .fiche-col-right .fiche-dates .dates{ float: left; width: 100%;} .fiche-event .fiche-col-right .fiche-dates .rightfiche {float: right; width: 35%;} .fiche-event .fiche-col-right .fiche-dates .info-date { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items: flex-start ;float :left; width: 100%; } .fiche-event .fiche-col-right .fiche-dates .info-date + .info-date { margin-top: 15px;align-items: flex-start;} .fiche-event .fiche-col-right .fiche-dates .info-date > div {padding : 15px 20px; width: calc(100% - 70px); float : left;} .fiche-event .fiche-col-right .fiche-dates .info-date .date {color :#fff; ;background: -webkit-linear-gradient(to bottom , #df016b, #e7671f); background: -o-linear-gradient(to bottom , #df016b, #e7671f); background: -moz-linear-gradient(to bottom , #df016b, #e7671f); background: linear-gradient(to bottom , #df016b, #e7671f);text-transform : uppercase; line-height: 25px; width: 70px; } .fiche-event .fiche-col-right .fiche-dates .info-date .date span {display : block ;text-align: center ;} .fiche-event .fiche-col-right .fiche-dates .info-date .date span.day { font-size: 30px; font-weight: 600;} .fiche-event .fiche-col-right .fiche-dates .info-date span.statut {text-transform : uppercase ; font-weight : 600; color :#e92e71; display: block; text-align: right;} .fiche-event .fiche-col-right .fiche-dates .info-date span.statut-reporte, .fiche-event .fiche-col-right .fiche-dates .info-date span.statut-annule, .fiche-event .fiche-col-right .fiche-dates .info-date span.statut-indisponible, .fiche-event .fiche-col-right .fiche-dates .info-date span.statut-complet {color :#ff0000; } .fiche-event .fiche-col-right .fiche-dates .info-date span.desc, .fiche-event .fiche-col-right .fiche-dates .info-date span.infos_comp_statut { font-size: 13px; display: block;} .fiche-event .fiche-col-right .fiche-dates .info-date span.statut + span {margin-top: 7px; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle { background-color :#fff; min-height: 105px;padding: 0;} .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .statutdate {background-color: #f2f2f2; padding: 20px; color :#303030 ;} .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle { padding: 10px 20px; display: inline-block; width: 100%;} main.main #bandeau .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul, main.main .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap;align-items: center; -webkit-flex-wrap: wrap; float : left ;width :100%; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li {flex : 1 0 0% ; float :left; width : 25%;color: #474747; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li + li { padding-left : 20px; margin-left : 20px;font-size : 14px; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-horaire + li.seance-horaire {border-left: 1px solid #a7a7a7 ; padding-left : 20px; margin-left : 20px;font-size : 14px; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-lib{ font: 400 20px 'Oswald', sans-serif; text-transform: uppercase; color: #e92e71; flex: inherit; width: auto; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li span.data-horaire {font-weight : 600 ; font-size :20px; color : #e92e71 ;display: block;} .fiche-event .fiche-col-right .fiche-desc { padding-top: 40px; margin-top: 50px; border-top: 2px solid #e6e6e6;display: inline-block; width: 100%;} .fiche-event .fiche-col-right .fiche-infoscomp, .fiche-event .fiche-col-right .fiche-video { margin-top: 50px; display: inline-block; width: 100%; } .fiche-event .fiche-col-right .fiche-infoscomp .sous-titre{ font-weight: 600; } .fiche-event .fiche-col-left .fiche-info-globales { background-color :#fff; padding-bottom: 30px; text-transform: uppercase; font-size: 15px; margin-top: 40px; } .fiche-event .fiche-col-left .fiche-info-globales .titre { color: #fff; text-align: center; padding: 12px; font-weight: 500; font-size: 14px;} .fiche-event .fiche-col-left .fiche-info-globales .detail, .fiche-event .fiche-col-right .fiche-horaire .autres-seances { margin: 20px 30px 0 30px; } .fiche-event .fiche-col-left .fiche-info-globales .detail + .detail, .fiche-event .fiche-col-right .fiche-horaire .autres-seances { border-top: 2px solid #e6e6e6; padding-top: 15px; } .fiche-event .fiche-col-left .fiche-info-globales .data {font-weight : 600 ; color :#e92e71;} .fiche-event .fiche-col-right .rightfiche .autres-seances .sous-titre{text-transform : uppercase ;} .fiche-event .fiche-col-right .rightfiche .autres-seances .data {font: 400 17px/19px 'Hind', sans-serif; text-transform: inherit;} .fiche-event .fiche-col-right .rightfiche .autres-seances .data ul {text-align :left ;} .fiche-event .fiche-col-right .fiche-dates .info-date span.lib_horaires + span.desc {border-top:1px solid #fff; padding-top: 10px; margin-top: 10px; display : inline-block; width : 100%; } /** Popup **/ .white-popup{ position: relative; background: url(../images/bg-popup.jpg) no-repeat center center ; background-size : cover ; padding: 60px 130px 90px; width: auto; max-width: 830px; margin: 20px auto; text-align: center; font-size : 20px; color :#fff; } .white-popup h3 {text-transform : uppercase; font: 400 29px 'Oswald', sans-serif; color :#fff; margin-bottom: 20px;} .white-popup ul { position : relative ; display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; display : inline-block\9; padding: 0 ; justify-content: center;} .white-popup ul.ligne1 {margin-top: 30px; } .white-popup ul li {background-color: #fff; text-transform: uppercase;width: 32%; text-align: center;float: left; margin-right: 2%; margin-bottom: 2%; } .white-popup ul li a{color:#000000; font: 400 16px 'Oswald', sans-serif; display: block; height: 100%;padding: 20px 10px; width: 100%;} .white-popup ul.ligne1 li:nth-child(4n-1), .white-popup ul.ligne2 li:nth-child(4n-1) { margin-right: 0;} .white-popup ul li.pmr a{background: url(../images/pictos/picto-pmr.png) no-repeat left 30% top 23px #0d1b2e;color :#fff; } .white-popup ul li.covoiturage a{border: 1px solid #e7671f; background-color: #e7671f; color: #fff;} .white-popup ul li a:hover {color :#fff; background-color :#0d1b2e; } .white-popup ul li.pmr a:hover { background-color :#0d1b2e; } .white-popup ul li.covoiturage a:hover {background-color :#fff; color :#e7671f ;} .mfp-wrap.mfp-close-btn-in .mfp-close { color: #fff; top: -60px; font: 300 42px 'Oswald', sans-serif; right: -10px;} /* .white-popup ul li.pmr, .white-popup ul li.pmr:hover{background: url(../images/pictos/picto-pmr.png) no-repeat 30% center #3d3d3d; } .white-popup ul li a{color:#000000; font: 400 16px 'Oswald', sans-serif; display: block; height: 100%;padding: 20px; width: 100%;} .white-popup ul li.pmr a{color: #fff; } .white-popup ul li:hover {color :#fff; } .white-popup ul li a:hover {color :#fff; background-color :#303030; } .white-popup ul li.pmr:hover{background-color: #000; } */ #jcemediabox-popup-container {background-color: #fff; width : auto !important ;} #jcemediabox-popup-container .page-header h1, h1{ font: 400 16px 'Oswald', sans-serif; } /***************** Contact (formulaire) *******************************/ article #userForm { clear:both; float:left; } article form { width:100%} article .formResponsive input[type=text], article .formResponsive input[type=email], article .formResponsive textarea, article .formResponsive input[type=file], article .formResponsive .rsform-select-box {outline :none ;background-color: #f1f1f1; height:42px; border-radius:0; width: 100% ; font:400 16px/19px 'Hind', sans-serif; box-sizing: border-box;} article .formResponsive input[type=text], article .formResponsive input[type=email]{ padding:5px 10px;} article .formResponsive textarea {height : 200px;padding:10px;} article .formResponsive label { margin:0 15px 0 5px} article .formResponsive input[type="radio"] { margin:10px 0} article .formResponsive .formHorizontal .rsform-block { margin-bottom: 0px; } article .formResponsive .formHorizontal .formControlLabel { padding-top: 15px; } article .formResponsive button[type=submit] { width: 150px; text-transform: uppercase; color: #fff; margin: auto; background: #e92e71; font: 400 20px 'Oswald', sans-serif; border: 1px solid #e92e71; text-shadow: none; padding: 7px; box-shadow: none;} article .formResponsive button[type=submit], .ba-gallery .category-filter input.ba-filter-active { -webkit-appearance: none; -moz-appearance: none; appearance: none;} article .formResponsive button[type=submit]:hover {background: #fff; color :#e92e71; border-radius : 0 ; } article .formResponsive .formRed { color: #b94a48; margin-bottom: 20px; font-weight: normal;} main.main article .logout button[type="submit"] { cursor : pointer ; text-transform: uppercase; color: #fff; border-radius : 7px ; margin: auto; background: #e92e71; font: 600 20px 'Hind', sans-serif; border: 1px solid #e92e71; text-shadow: none; padding: 7px 15px ; display: inherit;margin: 10% auto 0; text-align: center;} main.main article .logout button[type="submit"]:hover {background: #fff; color :#e92e71; border-radius : 0 ; } /********************************* Blog ********************************/ .blog .item {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; display:table\9; align-items: center; } .blog .items-row{padding: 50px 0; display: inline-block; width: 100%;} .blog .items-row + .items-row {border-top: 1px solid #8783bc;} .blog .item .img-intro-left{float:left;width:35%; height: 250px; overflow: hidden;} .blog .item .img-intro-left img { width: 100%; height: 100%; object-fit: cover;} .blog .item .text-intro{ width: 65%; padding: 25px; margin-left: auto;} .blog .item .text-intro h2{ font: 400 25px 'Oswald', sans-serif; margin-bottom: 20px; color: #8783bc;text-transform: uppercase;} .blog .items-row p.readmore { margin-top:20px; } .blog .items-row p.readmore a:hover { color: #000; } /* Pagination */ .pagination{ clear:both; display:inline-block; margin:auto; width:100%; margin-top: 40px;} .pagination ul {display:table; margin:auto; border-collapse: separate; } .pagination li {display:table-cell; padding-right: 15px; padding-left:inherit; text-indent:inherit;} article .pagination li::before{content:none; } .pagination li span, .pagination li span.current, .pagination li a{ border: 1px solid #736fac; width: 45px; height: 45px; display:block;font-weight: 600; font-size: 17px; line-height:50px; text-align: center; box-shadow: none; background-image:none;} .pagination li a{ border: 1px solid #736fac; background:#fff; text-align:center; color:#736fac;-webkit-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out;} .pagination li a:hover{background:#736fac; color:#fff;} .pagination li span, .pagination li span.current{background: #736fac; color:#fff;} .pagination li:first-child, .pagination li:last-child{display:none; border:none;} .pagination .pagination-prev, .pagination .pagination-next , .pagination .counter, article ol.nav-tabs { display:none;} /*************************************** PIED DE PAGE ****************************************************/ footer { background:#0d1b2e; padding: 50px 0; position :relative; } footer.home {padding-top: 0;} footer .wrap {padding : 0 120px;} footer .bottom {padding-bottom: 30px; margin-bottom: 15px; border-bottom: 1px solid #6e7682; display: inline-block; width: 100%;display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap;align-items: flex-end; justify-content: space-between; } footer .bottom > div {flex : 1 0 0 ;} footer .bottom #social p {float : left ; } footer .bottom #social p strong {text-transform : uppercase;font-weight : normal ; color :#fff;float : left ; margin-right : 7px; margin-top: 1px ;letter-spacing: 2px; font-size : 12px; } footer .bottom #social ul {float : left ; } footer .bottom #social ul li, footer .bottom #partenaires ul li {display : inline-block ; } footer .bottom #social ul li + li{margin-left : 5px; } footer .bottom #social ul li img {width : 20px; height : 20px; } footer .bottom #partenaires ul li img {width : auto ; height : 25px ;} footer .bottom #partenaires ul li + li{margin-left : 15px;} #menu-footer { float:left; margin-right : 35px; } #menu-footer li {display : inline ;} #menu-footer li + li {margin-left : 40px; } #menu-footer a, #menu-footer span{ text-transform : uppercase; color:#ffffff; letter-spacing: 2px; font-size : 12px;} #menu-footer a:hover {color :#cecece; } #IC { float:right;} #IC a { color :#fff; font-size : 10px;} #IC img {vertical-align: middle ; margin-left : 5px; } } @media all and (max-width: 1435px){ .wrap { width:96%;} footer .facebook-items { padding: 0 50px;} #programmation-accueil .contenu.listing { padding: 0 100px 280px;} #programmation-accueil h2.title {padding : 0 100px; } #diaporama-accueil::after { bottom: -190px; height: 190px; } footer .bottom .logo-footer { flex: 1 0 auto; width: 100%; text-align: center; margin-bottom: 30px;} } @media all and (max-width: 1350px){ #diaporama-accueil .diaporama-bottom .attention h2 { padding-top: 40px;margin-bottom: 5px;} #diaporama-accueil .revolutionslider .caption .description {font: 300 20px 'Hind', sans-serif; margin-bottom: 20px;} #diaporama-accueil .revolutionslider .caption .title { font: 400 45px 'Oswald', sans-serif;} #programmation-accueil .wrap, #diaporama-accueil .diaporama-bottom .wrap { padding: 0 50px;} .fiche-event .fiche-col-right .fiche-info h1 { font: 400 40px 'Oswald', sans-serif;} .fiche-event .fiche-col-right .fiche-dates .dates, .fiche-event .fiche-col-right .fiche-dates .rightfiche { width: 100%;} .fiche-event .fiche-col-right .fiche-dates .rightfiche { margin-top: 30px;} nav li + li { margin-left: 20px;} main.main article, main.main .blog, main.main #osmap, main.main .login {padding: 100px 50px;} .fiche-event .wrap { padding : 0 10px;} .fiche-event .fiche-col-right { padding: 90px 30px 100px; } } @media all and (max-width: 1200px){ header .logocreditmutuel {left: 90px;} #diaporama-accueil .rev_slider_wrapper .tp-caption.titre_diaporama {font-size : 40px !important ;} nav {width : 100% ;} nav #maximenuck90 {margin: 30px auto 0;} #bandeau { height: 260px;} nav div#maximenuck90 ul.maximenuck { text-align: center;} .fiche-event .fiche-col-right .fiche-dates .info-date > div { padding: 15px ;} main.main #bandeau + .wrap .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul + ul {margin-top: 20px; display : inline-block ; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-lib { flex: 1 1 auto; width: 100%; text-align: center;margin-bottom: 10px;} .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-lib + li {margin-left : 0 ; padding-left : 0 ;} .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-horaire {width : 28%; flex: inherit ;} footer.home::before { top: -150px; height: 150px;} #programmation-accueil .contenu.listing { padding: 0 0 170px;} #programmation-accueil .moteur-recherche.filters, #programmation-accueil h2.title {padding : 0 ;} footer .facebook-items {margin-bottom: 40px;} footer .bottom #social { flex: inherit;} footer .bottom #partenaires { flex: 1 0 auto; width: 100%; text-align: center; margin-top: 30px;} } @media all and (max-width: 1050px){ nav #maximenuck90 { width: 100%; justify-content: center;} nav div#maximenuck90 ul.maximenuck {padding : 0px; } nav div#maximenuck90 ul.maximenuck li.maximenuck.level1 { margin: 2px 0px 0 0;} #diaporama-accueil .revolutionslider .caption .description {display: none;} #diaporama-accueil .diaporama-bottom { padding-bottom: 50px;} #programmation-accueil .wrap, #diaporama-accueil .diaporama-bottom .wrap { padding: 0 ;} .fiche-event .fiche-col-left { width: 265px;} .fiche-event .fiche-col-right { width: calc(100% - 265px);} .fiche-event .fiche-col-left > div { width: 90%; margin-left: 0;} .navigation .retour-prog a { margin-left: 0;} footer .facebook-items { padding: 0;} footer .wrap , .wrap { padding: 0 10px;} #jcemediabox-popup-body , #jcemediabox-popup-content{ width: auto !important ;} #jcemediabox-popup-body{ height: auto !important;} } @media all and (max-width: 990px){ #menu-header { top: -40px; right: 0; z-index: 999999; left: 0;} } @media all and (max-width: 900px){ header .wrap {padding: 30px 0 15px;} .wrap {padding: 0; } header .logocreditmutuel { left: 5px;} main.main, #diaporama-accueil { margin-top: 85px;} body {padding-top: 0 !important; } #logo { margin: 30px auto 10px;} main.main article, main.main .blog, main.main #osmap, main.main .login { padding-bottom: 100px;} main.main .login {padding-right : 0 ; padding-left : 0 ;} #diaporama-accueil::after { bottom: -120px; height: 120px; } #breadcrumbs {display : none ;} #diaporama-accueil .diaporama-bottom .nouveautes, #diaporama-accueil .diaporama-bottom .rightbottomdiaporama { width: 100%;} #diaporama-accueil .diaporama-bottom .attention h2 { padding-top: 7px; padding-left: 50px;} #diaporama-accueil .diaporama-bottom .attention { margin-top: 20px;} #programmation-accueil .contenu.listing .month-events .event-details { width: 32%;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(4n+1) { margin-left: 2%;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(3n+1) { margin-left: 0;} .fiche-event {display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap-reverse; } .navigation .retour-prog a {margin-left : 30px;} .fiche-event .fiche-col-right { width:100% ;min-height: inherit;} .fiche-event .fiche-col-left { width: 100% ;} .fiche-event .fiche-col-left > .image-spectacle {display : none ;} .fiche-event .fiche-col-left > div { width: 100%; margin-left: 0;} .white-popup { padding: 50px; font-size: 15px;} .white-popup h3 { font: 400 24px 'Oswald', sans-serif; margin-bottom: 5px;} .white-popup ul li.pmr a {background-position : left 30% top 16px ;} .mfp-wrap.mfp-close-btn-in .mfp-close { color: #333; top: -20px;} footer .bottom .menu-bottom { justify-content: space-around;} footer .bottom .menu-bottom .bloc + .bloc { margin-left: 30px;} #menu-footer li { display: block;} #menu-footer li + li {margin-left : 0;} footer::before { top: -100px; height: 100px;} } @media all and (max-width: 700px){ #bandeau img { height: 100%; object-fit: cover;} #programmation-accueil .moteur-recherche.filters form { padding: 30px 35px;} #programmation-accueil h2.title {font: 600 35px 'Hind', sans-serif;} #programmation-accueil .contenu.listing .month-lib { font: 600 20px 'Hind', sans-serif; margin: 25px 0 ;} #programmation-accueil .contenu.listing .month-events .event-details { width: 49%; margin-left : 0;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(3n-1), #programmation-accueil .contenu.listing .month-events .event-details:nth-child(4n+1) { margin-left: 0;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(even) { margin-left: 2%;} #programmation-accueil .moteur-recherche.filters .SumoSelect, #programmation-accueil .moteur-recherche.filters input[type="text"] {width : 100%; flex: 1 1 auto; min-width: 100%; } #programmation-accueil .moteur-recherche.filters span.transition { margin: 10px auto; text-align: center;} .fiche-event .fiche-col-left > .image-spectacle { text-align: center;} #diaporama-accueil .forcefullwidth_wrapper_tp_banner {display : none ;} #diaporama-accueil .diaporama-bottom { padding-bottom: 0px;} .blog .item .img-intro-left, .blog .item .text-intro { width: 100%;} .fiche-event .fiche-col-left, .fiche-event .fiche-col-right, .fiche-event .fiche-col-left > div {width: 100%;} .fiche-event .fiche-col-left { margin-top: 0px;} .fiche-event .fiche-col-right { margin-bottom : 20px;} .fiche-event .fiche-col-right .fiche-video iframe {width : 100% ; } footer .bottom { justify-content: center;} footer .bottom .logo-footer { display: block; width: 100%; text-align: center; margin: 30px 0;} footer .homesocial-footer ul, footer .homesocial-footer p strong {width: 100%;} footer .facebook-items > div { width: 100%; width: 90%; margin: 0 auto;} footer .facebook-items > div + div { margin: 20px auto 0;} footer .facebook-items > div .facebook-item-footer .nbcomment a { margin-left: 0;} footer .facebook-items > div .facebook-item-intro, footer .facebook-items > div .facebook-desc, footer .facebook-items > div .facebook-item-intro .img-page {font-size: 13px;min-height: inherit;} footer .bottom .menu-bottom .bloc + .bloc, footer .bottom .logo-partenaires ul li + li {margin-left : 0; } } @media all and (max-width: 550px){ .white-popup ul li a { font: 400 16px 'Oswald', sans-serif;} #diaporama-accueil::after { position: fixed; width: 100%; top: 104px;} body {font-size: 14px; } .navigation .retour-prog a { font-size: 20px;} #diaporama-accueil {padding-bottom : 0 ; margin-top: 0 ; margin-bottom: 0 ; } #bandeau { height: 210px;} .navigation .retour-prog { margin-bottom: 0;} #menu-header {display : none ;} #programmation-accueil { padding-top: 100px;} #programmation-accueil .contenu.listing { padding-bottom: 30px;} #diaporama-accueil .diaporama-bottom .nouveautes ul li { width: 49%;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(3n-1), #programmation-accueil .contenu.listing .month-events .event-details:nth-child(4n+1) { display: flex; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap;justify-content: space-between; } #programmation-accueil .contenu.listing .month-events .event-details > div { width: 65%; float: left; height: 100%;} #programmation-accueil .contenu.listing .event-details .event-infos p.readmore a {width: 55%; left: initial; right: 5%; bottom: 20px;padding: 10px 5px;} #programmation-accueil .contenu.listing .month-events .event-details .event-img { width : 35%;} #programmation-accueil .contenu.listing .event-details .event-img img { height: 100%; object-fit: cover;} #programmation-accueil .contenu.listing .event-details .event-infos h2 { font-size: 15px; margin-bottom: 5px; margin-top: 0;} #programmation-accueil h2.title { font: 600 30px 'Hind', sans-serif;} .img-intro-left img, #programmation-accueil .contenu.listing .month-events .event-details{ width: 100%; padding-bottom: 0; } #programmation-accueil .contenu.listing .month-events .event-details:nth-child(even) { margin-left: 0;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(3n-1), #programmation-accueil .contenu.listing .month-events .event-details:nth-child(4n+1), #programmation-accueil .contenu.listing .month-events .event-details:nth-child(even) {display :table ;} #programmation-accueil .contenu.listing .month-events .event-details .event-img , #programmation-accueil .contenu.listing .month-events .event-details > div {float : none ; vertical-align: middle ; display : table-cell; } .fiche-event .fiche-col-right .fiche-info .fiche-resa {position: relative;display: table; margin: 10px auto 30px;top: 0;} .fiche-event .fiche-col-right .fiche-info .fiche-resa #bt-reserver {font-size : 21px ; padding: 5px 25px; } .fiche-event .fiche-col-right .fiche-info .sous-titre { background-position : center bottom; text-align: center; margin-bottom: 10px;} #programmation-accueil #evenements-display-more { margin: 30px auto 90px; padding: 14px 0 6px 60px ;font-size: 16px;} #programmation-accueil #evenements-display-more::before { left : 0; top: 5px; font-size: 28px; width: 45px; height: 40px;} .fiche-event .fiche-col-left .reseaux_sociaux { text-align: center;} .fiche-event .fiche-col-left .reseaux_sociaux p { margin-right: 0; float : none ;} #logo, nav { margin-bottom: 0;} main.main article, main.main .blog, main.main #osmap, main.main .login{padding: 80px 10px;} .fiche-event .fiche-col-right { padding: 100px 10px 20px;} .white-popup { padding: 30px; } .mfp-content { vertical-align: top; margin: 60px auto;z-index: 999999;} .fiche-event .fiche-col-right .fiche-info h1{ margin-bottom: 8px;width : 100%; text-align: center;} article h2, main.main #osmap h2 { font-size: 21px; margin-bottom: 10px;} main.main article ul.listing li { width: 30%;} .img-intro-left { float: none; margin: 0 0 15px 0; width: 100%;} footer.home::before { top: -70px; height: 70px;} footer .facebook-items { margin-bottom: 20px;} footer .homesocial-footer p strong { font-size: 30px;} footer .homesocial-footer {background-position :center center;} footer .bottom { padding-bottom: 10px; margin-bottom: 20px;} footer .bottom .menu-bottom .bloc, footer .bottom .logo-partenaires ul li {width : 100%; } #menu-footer { float: none; text-align: center; display: block; width: 100%; margin: 10px 0;} #IC {margin-top: 10px;} footer .wrap, .wrap { padding: 0;} #diaporama-accueil .diaporama-bottom .wrap {display : none ;} main.main article a.jcepopup span.jcemediabox-zoom-image { background-size: 18px;} table.galerie {margin : auto ; width: initial !important;} table.galerie tr, table.galerie td {display : block ;} #programmation-accueil .contenu.listing .month-events .event-details {padding-bottom: 40px; margin-bottom: 20px; min-height: 170px;} #programmation-accueil .contenu.listing .month-events .event-details:nth-child(even) { margin-left: 0;} #programmation-accueil .contenu.listing .event-details .event-infos p.readmore a { width: 100%;left: initial; right: 0; bottom: 0; padding: 10px 5px;} #programmation-accueil .moteur-recherche.filters form { padding: 30px 15px;} .white-popup {padding : 20px; padding: 50px 20px; top: 0; margin: 0;} .white-popup ul { margin-top: 20px;} .white-popup ul li { width: 70%;} .white-popup ul.ligne1 li + li, .white-popup ul.ligne2 li + li{ margin-left: 0;margin-top: 5px;} footer .bottom > div {flex : 1 0 auto ; text-align :center ; } } @media all and (max-width: 450px){ main.main .login, main.main article { padding: 40px 0;} .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .statutdate { padding: 13px 15px;} #programmation-accueil .contenu.listing .month-events .event-details > div { font-size : 14px; } main.main .login form fieldset { padding: 40px 10px;} main.main article table.blocviolet { padding: 15px;} main.main article ul.listing li { width: 50%;} .fiche-event .fiche-col-right .fiche-dates .info-date .date{text-align: center; } .fiche-event .fiche-col-right .fiche-dates .info-date .date span { display: inline-block;} .fiche-event .fiche-col-right .fiche-dates .info-date .date, .fiche-event .fiche-col-right .fiche-dates .info-date > div { width : 100%; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-lib{text-align :left ; } .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-horaire, .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-horaire + li.seance-horaire {flex: 1 1 auto ; width : 100%; padding-left : 0; margin-left : 0 ;} .fiche-event .fiche-col-right .fiche-dates .info-date .informationsdatespectacle .seancespectacle ul li.seance-horaire + li.seance-horaire{border-left : 0 ; margin-top: 10px ;} .blog .item .text-intro { padding: 0;} .navigation .retour-prog a { font-size: 15px; padding-left: 15px; margin-left: 10px;} #diaporama-accueil .diaporama-bottom .social p strong, #diaporama-accueil .diaporama-bottom .social ul { display: block; text-align: center;} #diaporama-accueil .diaporama-bottom .social ul { margin-left: 0;} }