.unselectable
*{cursor:default}


@font-face{font-family:'icons';src:url('../need/css/fonts/icons/iconsb31b.eot?64918559');src:url('../need/css/fonts/icons/iconsb31b.eot?64918559#iefix') format('embedded-opentype'), url('../need/css/fonts/icons/iconsb31b.woff?64918559') format('woff'), url('../need/css/fonts/icons/iconsb31b.ttf?64918559') format('truetype'), url('../need/css/fonts/icons/iconsb31b.svg?64918559#icons') format('svg');font-weight:normal;font-style:normal}

@font-face{font-family: 'LeagueGothic-Regular';
    src: url('../need/css/fonts/leaguegothic-regular-webfont.eot');
    src: url('../need/css/fonts/leaguegothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../need/css/fonts/leaguegothic-regular-webfont.woff') format('woff'),
         url('../need/css/fonts/leaguegothic-regular-webfont.ttf') format('truetype'),
         url('../need/css/fonts/leaguegothic-regular-webfont.svg#league_gothic_regular') format('svg');
    font-weight: normal;
    font-style: regular;}

*{margin:0;padding:0;box-sizing:border-box}

html{overflow-y:scroll;font-size:62.5%}.clear{display:block;clear:both}a{text-decoration:none}img{display:block;width:100%}body{background:#e5e5e5;font-family:Lato,Helvetica,Arial,sans-serif}

#bg-left
{width:100%;height:100%;position:fixed;z-index:-100;top:0;left:-50%;padding-right:52rem}

#bg-left .inside-bg
{width:100%;height:100%;overflow:hidden;background-repeat:no-repeat;background-origin:content-box;background-size:auto 100%;background-position:right top}

#bg-right
{width:100%;height:100%;position:fixed;z-index:-100;top:0;left:50%;padding-left:52rem}

#bg-right .inside-bg
{width:100%;height:100%;overflow:hidden;background-repeat:no-repeat;background-origin:content-box;background-size:auto 100%;background-position:left top}

#container
{position:relative;padding:0 2rem}

#inside-container
{max-width:104rem;margin:0 auto;color:white;position:relative}

#menu
{position:absolute;width:100%;left:8rem;top:4rem;z-index:30}

#menu #logo-club
{background:url("../need/css/images/public/logos/banniere.jpg") no-repeat;width:848px;height:110px;position:absolute;z-index:20;left:-8rem;top:-4.5rem}

#menu .menu-rubrique
{float:left;font-family:LeagueGothic-Regular;font-weight:100;font-size:3.8rem;line-height:3.8rem;background:#000000;color:white;padding:2.5rem 2rem 0.2rem 2rem;text-transform:uppercase}

#menu .menu-rubrique a{color:white}
#menu .menu-rubrique a:hover
{opacity:0.8}

#menu .menu-rubrique.menu-rubrique-cinema
{padding-left:9rem;padding-left:9rem;background:#000000}

#menu .menu-rubrique.menu-rubrique-education
{background:#CAC602}

#menu.social
{float:right;overflow:hidden}

#menu .social .t,
#menu .social .f
{display:block;float:left;width:38px;height:38px;margin:0 0 0 0.4rem;opacity:0.5}

#menu .social .t:hover,
#menu .social .f:hover
{opacity:1}

#menu .social .f
{background:url('../need/css/images/public/social/f.png') no-repeat}

#menu .social .t
{background:url('../need/css/images/public/social/t.png') no-repeat}

#menu .menu-sous-rubriques-container
{overflow:hidden;clear:both;width:100%}

#menu .menu-sous-rubriques-container .menu-sous-rubriques
{padding:0.4rem 1rem 0.4rem 6rem;margin-left:-1rem;float:left;display:block}

#menu .menu-sous-rubriques-container .menu-sous-rubriques.cinema
{background:#000000}

#menu .menu-sous-rubriques-container .menu-sous-rubriques.cinema a
{background-color:#000000}

#menu .menu-sous-rubriques-container .menu-sous-rubriques.cinema a.active
{color:#000000}

#menu .menu-sous-rubriques-container .menu-sous-rubriques.education
{background:#CAC602}

#menu .menu-sous-rubriques-container .menu-sous-rubriques.education a
{background-color:#CAC602}

#menu .menu-sous-rubriques-container .menu-sous-rubriques.education a.active
{color:#CAC602}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a
{color:white;float:left;margin:0 1rem;position:relative;font-family:LeagueGothic-Regular;font-weight:100;font-size:2.1rem;line-height:2.1rem;background:#000000;padding:0.5rem 1rem 0.2rem -2rem;text-transform:uppercase;letter-spacing:0.1rem;height:2.8rem}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a:hover
{background-color:rgba(255,255,255,0.5)}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a.active
{background:#fff102; color:black;}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a.active1
{background:#fff102; color:black;}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a.active2
{background:#fff102; color:black;}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a.active3
{background:#fff102; color:black;}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a.active4
{background:#fff102; color:black;}

#menu .menu-sous-rubriques-container .menu-sous-rubriques a.active5
{background:#fff102; color:black;}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block
{float:left;overflow:hidden;position:relative;height:2.8rem}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block input
{width:12rem;float:left;display:none;outline:none;border:0;padding:0.4rem;opacity:0.8;font-family:Lato,Helvetica,Arial,sans-serif;font-size:1.4rem}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block input:focus
{opacity:1}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block.active input
{display:block;margin-left:3rem;height:2.8rem}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block.active .find-arrow
{position:absolute;z-index:10;left:11.5rem;color:#000000;background:transparent}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block.active .find-arrow:hover
{background:transparent}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block div.find-arrow
{float:left;font-family:icons;color:white;font-size:1.8rem;padding:0.5rem 1rem 0.2rem 1rem;margin:0 1rem 0 0;cursor:pointer}

#menu .menu-sous-rubriques-container .menu-sous-rubriques div.find-block div.find-arrow:hover
{background:rgba(255,255,255,0.5)}

body.cinema #menu .menu-sous-rubriques-container .menu-sous-rubriques .find-block
{color:#000000}

body.cinema #menu .menu-sous-rubriques-container .menu-sous-rubriques .find-block input
{color:#000000}

body.education #menu .menu-sous-rubriques-container .menu-sous-rubriques .find input
{color:#CAC602}body.education 

#menu .menu-sous-rubriques-container .menu-sous-rubriques .find-block.active .find-arrow
{color:#CAC602}


#lists
{position:relative;z-index:2;width:30%;float:left;margin-top:18em;padding-bottom:4rem}

#lists h2
{float:left;position:relative;left:0;font-family:LeagueGothic-Regular;font-weight:100;font-size:2.4rem;line-height:2.4rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;margin:2rem 0 1rem 0}

#lists h3
{float:left;position:relative;left:0;font-family:LeagueGothic-Regular;font-weight:100;font-size:2.4rem;line-height:2.4rem;background:#000000;color:#fff102;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;margin:2rem 0 1rem 0}

#lists ul
{display:block;padding-left:1em}

#lists ul li
{cursor:pointer;list-style-type:none;overflow:hidden;padding:0 0 0.4rem 0;margin:0 0 0.4rem 0;width:26rem;font-size:1.4rem}

#lists ul li span.labelX
{width:25rem;display:block;float:left;color:white;border-bottom:solid 0.0rem #b8b8b8;padding:0.2rem 0 0rem 0;}

#lists ul li span.labelX a
{color:inherit;text-decoration:none}

#lists ul li span.labelX a.active
{color:#000000}

#lists ul li span.labelX a span.special
{display:block;color:#000000;font-size:1.3rem}

#lists ul li span.labelX span.more
{display:block;color:#000000}




#lists ul li span.flagPMR
{display:inline;float:left;width:3.5rem;text-align:right;margin-right:1rem;color:white}
#lists ul li span.flagPMR a:link {color:aqua; text-decoration : none;} 
#lists ul li span.flagPMR a:visited {color:aqua; text-decoration : none;}
#lists ul li span.flagPMR  a:hover {color:red; }



#lists ul li span.flagX
{display:inline;float:left;width:3.5rem;text-align:right;color:#000000;margin-right:1rem}

#lists ul li span.flagX a:link {color:teal; text-decoration : none;} 
#lists ul li span.flagX a:visited {color:teal; text-decoration : none;}
#lists ul li span.flagX  a:hover {color:red; }



#lists ul li span.flagJour
{display:inline;float:left;width:2rem;text-align:left;color:grey;margin-right:1rem}







#lists ul li span.flagX
{color:#fff102}

#lists span.flagX
{color:#CAC602}

body.cinema #lists ul li span.flagX
{color:#fff102}

body.cinema #lists ul li:hover span.labelX
{color:red}

body.cinema #lists ul li span.labelX a.active
{color:#000000}

#lists ul li:hover span.label
{color:#000000}

#lists ul li span.flag
{display:block;float:left;width:4rem;text-align:right;color:#000000;margin-right:1rem}

#lists ul li span.label
{width:20rem;display:block;float:left;color:white}

#lists ul li span.label a
{color:inherit;text-decoration:none}

#lists ul li span.label a.active
{color:#000000}

#lists ul li span.label a span.special
{display:block;color:#000000;font-size:1.3rem}

#lists ul li span.label span.more
{display:block;color:#000000}

body.cinema 
#lists h2
{background-color:#000000;border-bottom:solid 0.2rem #fff102}

#lists h3
{background-color:#000000;border-bottom:solid 0.2rem #fff102}

body.cinema #lists ul li:hover span.label{color:red}
body.cinema #lists ul li span.flag{color:#fff102}
body.cinema #lists ul li span.label a.active{color:#000000}
body.cinema #lists ul li span.label a.active span.special{color:#000000}
body.cinema #lists ul li span.label span.more{color:#000000}
body.education #lists h2{background-color:#CAC602}
body.education #lists ul li:hover span.label{color:#CAC602}
body.education #lists span.flag{color:#CAC602}
body.education #lists span.label a.active{color:#CAC602}
body.education #lists span.label a.active span.special{color:#CAC602}
body.education #lists span.label span.more{color:#CAC602}

#lists ul li span.label1{width:25rem;display:block;float:left;color:white;border-bottom:solid 0.2rem #b8b8b8;padding:0.5rem 0 1rem 0;}
#lists ul li span.label1 a{color:inherit;text-decoration:none}
#lists ul li span.label1 a.active{color:#000000}
#lists ul li span.label1 a span.special{display:block;color:#000000;font-size:1.3rem}
#lists ul li span.label1 span.more{display:block;color:#000000}
body.cinema #lists ul li:hover span.label1{color:red}

body.cinema #lists ul li span.label1 a.active{color:#000000}
body.cinema #lists ul li span.label1 a.active span.special{color:#000000}
body.cinema #lists ul li span.label1 span.more{color:#000000}

body.education #lists ul li:hover span.label1{color:#CAC602}

body.education #lists span.label1 a.active{color:#CAC602}
body.education #lists span.label1 a.active span.special{color:#CAC602}
body.education #lists span.label1 span.more{color:#CAC602}



#main{position:relative;z-index:50;margin-top:15rem;padding:2rem;width:70%;float:right;color:#000000}

#page{background:#fff102;min-height:1200px}
#pageE{background:#adaaaa;min-height:1200px}
#pageP{background: red;min-height:1200px}


#grey
{position:absolute;left:0;top:0;width:30%;height:100%;background:#000000;z-index:1}div.identified{position:absolute;top:1rem;left:1rem;overflow:hidden;z-index:1000;font-size:1rem;font-weight:normal}div.identified a{background:#333;color:white;display:block;padding:0.2rem 0.4rem;float:left;border:solid 0.1rem white;-moz-border-radius:0.3rem;-webkit-border-radius:0.3rem;-khtml-border-radius:0.3rem;border-radius:0.3rem;opacity:0.5}div.identified a:hover{opacity:1}


#palmares .photo-container
{position:relative;width:100%;height:0;padding-top:20rem;background-color:#b2a801;overflow:hidden}

#palmares .photo-containerE
{position:relative;width:100%;height:0;padding-top:1rem;background-color:#b2a801;overflow:hidden}

#palmares .photo-container img
{position:absolute;top:0;left:0;width:100%}

#palmares .photo-containerT
{position:relative;width:30%;height:0;padding-top:5rem;background-color:#fff102;overflow:hidden}

#palmares .photo-containerT img
{position:absolute;top:0;left:0;width:100%}

#palmares .film-annonce
{position:absolute;width:100%;height:100%;top:0;left:0;z-index:2;display:none;vertical-align:middle;text-align:center}

#palmares .film-annonce .centered
{position:relative;top:25%;height:10rem;margin:0 4rem 0 4rem;text-align:center;color:white;-moz-border-radius:1rem;-webkit-border-radius:1rem;-khtml-border-radius:1rem;border-radius:1rem;background-color:rgba(236,0,127,0.5);cursor:pointer}

#palmares .film-annonce .centered:hover
{background-color:#000000;color:white}

#palmares .film-annonce .centered .icon
{font-family:icons;font-size:5rem;text-align:center}

#palmares .film-annonce .centered .laius
{font-size:1.4rem}

#palmares .photo-container:hover .film-annonce
{display:block}

#palmares .candidate
{position:relative;margin-bottom:2em}

#palmares .candidate-title
{position:relative}

#palmares .candidate-title-inside
{position:absolute}

#palmares .candidate-title-inside .accroche
{font-size:2rem;right:-1rem;background:#b2a801;color:#333333;float:right;padding:0.4rem 1rem;position:relative;text-align:right;border-right:solid 0.2rem #fff102;border-top:solid 0.2rem #fff102}

#palmares .candidate-title-inside .accrocheE
{font-size:2rem;right:4rem;background:white;color:#000000;float:right;padding:0.2rem 1rem;position:relative;text-align:right}

#palmares .candidate-laius-presentation
{text-align:justify;padding:0rem }

#palmares .candidate-laius-presentation a
{display:inline-block;border-bottom:dotted 0.2rem white;-moz-border-radius:0.4rem;-webkit-border-radius:0.4rem;-khtml-border-radius:0.4rem;border-radius:0.4rem;color:white}

#palmares .candidate-laius-presentation a:hover
{border-bottom:solid 0.2rem white}

#palmares .candidate-laius-link
{overflow:hidden}

#palmares .candidate-laius-link a
{display:block;float:right;padding:0.4rem 1rem;font-size:1.6em;text-decoration:none}

#palmares .candidate-laius-link a:hover
{background:#000000;color:#fff102}

#palmares .candidate-laius-link a .icon
{font-family:icons;padding-right:1rem}

#palmares-first .candidate-title-inside
{float:right;right:-4rem;bottom:0.0rem;max-width:85%}

#palmares-first .candidate-title-inside h1
{font-family:LeagueGothic-Regular;font-weight:100;font-size:3.2rem;line-height:3.2rem;background:#b2a801;color:#000000;padding:0.5rem 0.5rem 0.2rem 0.5rem;text-transform:uppercase;text-align:right;border-right:solid 0.2rem #fff102;border-top:solid 0.2rem #fff102;}

#palmares-first .candidate-laius
{background:#000000}

#palmares-first .candidate-laius-presentation
{color:white;font-size:1.5rem}

#palmares-first .candidate-laius-presentation b
{border:dotted 1px white;padding:0 0.4rem;color:white}

#palmares-first .candidate-laius-link a
{background:white;color:#000000}

#palmares-others #palmares-others-left,
#palmares-others #palmares-others-right
{width:50%;float:left}

#palmares-others #palmares-others-left .photo-container,
#palmares-others #palmares-others-right .photo-container
{border:solid 0.3rem #b2a801;border-width:0 0 0.3rem 0;padding-top:20rem;background-color:#e5e5e5;overflow:hidden}

#palmares-others #palmares-others-left .candidate-title,
#palmares-others #palmares-others-right .candidate-title
{width:100%}

#palmares-others #palmares-others-left .candidate-title-inside,
#palmares-others #palmares-others-right .candidate-title-inside
{width:100%;bottom:-0.5rem;color:#fff102}

#palmares-others #palmares-others-left .candidate-title-inside h1,
#palmares-others #palmares-others-right .candidate-title-inside h1
{font-family:LeagueGothic-Regular;font-weight:100;font-size:3rem;line-height:3rem;background:#b2a801;color:#000000;
padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;text-align:right;border-right:solid 0.2rem #fff102;
border-top:solid 0.2rem #fff102}

#palmares-others #palmares-others-left .candidate-title-inside .accroche,
#palmares-others #palmares-others-right .candidate-title-inside .accroche
{position:relative;clear:both;background:#b2a801;color:black;font-size:1.6rem;padding:0.2rem 0.8rem}

#palmares-others #palmares-others-left .candidate-laius,
#palmares-others #palmares-others-right .candidate-laius
{background:#333;padding:1rem}

#palmares-others #palmares-others-left .candidate-laius-presentation,
#palmares-others #palmares-others-right .candidate-laius-presentation
{color:white;font-size:1.5rem;line-height:1.7rem; margin: 0.5rem 0.5rem 0.5rem 0.5rem}

#palmares-others-rightX
{width:50%;float:right}

#palmares-others #palmares-others-rightX .candidate-laius-presentation
{color:white;font-size:1.5rem;line-height:1.7rem; padding:0rem;margin: 0rem 0.5rem 0.5rem 0.5rem;background:#333;}

#palmares-others #palmares-others-left .candidate-laius-link,
#palmares-others #palmares-others-right .candidate-laius-link
{overflow:hidden}

#palmares-others #palmares-others-left .candidate-laius-link a,
#palmares-others #palmares-others-right .candidate-laius-link a
{display:block;float:right;padding:0.4rem 1rem;background:#b2a801;color:black;font-size:1.5rem}

#palmares-others #palmares-others-left .candidate-laius-link a:hover,
#palmares-others #palmares-others-right .candidate-laius-link a:hover
{background:#000000;color:#fff102;}

#palmares-others #palmares-others-left .candidate-laius-linkG,
#palmares-others #palmares-others-right .candidate-laius-linkG
{overflow:hidden}

#palmares-others #palmares-others-left .candidate-laius-linkG a,
#palmares-others #palmares-others-right .candidate-laius-linkG a
{display:block;float:left;padding:0.4rem 1rem;background:#000000;color:white;font-size:1.5rem;border:1px solid red;margin:0.3rem}

#palmares-others#palmares-others-left .candidate-laius-linkG a:hover,
#palmares-others #palmares-others-right .candidate-laius-linkG a:hover
{background:#555;color:white;border:1px solid #b2a801;margin:0.3rem;}

#palmares-others #palmares-others-left
{padding-right:1rem}

#palmares-others #palmares-others-left .candidate-title-inside h1,
#palmares-others #palmares-others-left .candidate-title-inside .accroche
{float:left}

#palmares-others #palmares-others-left .candidate-title-inside h1
{padding-left:0}

#palmares-others #palmares-others-left .candidate-title-inside .accroche
{left:-1rem}

#palmares-others #palmares-others-right
{padding-left:1rem}

#palmares-others #palmares-others-right .candidate-title-inside h1,
#palmares-others #palmares-others-right .candidate-title-inside .accroche
{float:right}

#palmares-others #palmares-others-right .candidate-title-inside h1
{padding-right:0}

#palmares-others #palmares-others-right .candidate-title-inside .accroche
{right:-1rem}
.film-annonce-iframe-container{display:none;width:100%;height:100%;position:absolute;z-index:1000;top:0;left:0;background:rgba(49,49,49,0.8)}
.film-annonce-iframe-container.visible{display:block}
.film-annonce-iframe-container
iframe{display:block;width:600px;margin:auto;margin-top:200px}

#biscuit
{position:relative}

#biscuit .photo-container
{position:relative;width:100%;height:0;overflow:hidden;padding-top:20rem;background-color:#fff102}

#biscuit .photo-containerH
{position:relative;width:33%;height:24.8rem;overflow:visible;padding-top:0rem;background-color:#fff102}

#biscuit .photo-containerE
{position:relative;width:100%;overflow:visible;padding-top:0rem;background-color:#fff102}

#biscuit .photo-container img
{position:absolute;top:0;left:0;width:100%}

#biscuit .photo-containerH img
{position:absolute;top:-9.0rem;left:0rem;width:100%;}

#biscuit .photo-containerE img
{position:absolute;top:-9.0rem;left:0rem;width:100%;}

#biscuit .photo-containerHaut img
{position:absolute;top:-9.0rem;left:0rem;width:100%;}

#biscuit.garniture
{position:relative;float:right;right:-4rem;top:-3rem;max-width:95%}

#biscuit.garnitureH
{position:relative;float:right;right:-4rem;top:-3rem;max-width:95%;}

#biscuit.garnitureHaut
{position:relative;float:right;right:-14rem;top:-3rem;max-width:65%;}

#biscuit .garniture .title
{background:#000000;text-align:right;padding:0.4rem 2rem;font-family:LeagueGothic-Regular;font-size:3.1rem;line-height:3rem;text-transform:uppercase;font-weight:normal;color:white}

#biscuit .garnitureH .titleH
{background:#000000;text-align:right;margin:0 0 0 0;padding:0.4rem 2rem;font-family:LeagueGothic-Regular;font-size:3.1rem;line-height:3rem;text-transform:uppercase;font-weight:normal;color:#fff102;}

#biscuit .garnitureH .titleE
{background:#000000;text-align:right;margin:0 0 0 0;padding:0.4rem 2rem;font-family:LeagueGothic-Regular;font-size:3.1rem;line-height:3rem;text-transform:uppercase;font-weight:normal;color:#fff102;}

#biscuit .garnitureHaut .titleHaut
{background:#000000;text-align:right;margin:0 0 0 0;padding:0.4rem 2rem;font-family:LeagueGothic-Regular;font-size:3.1rem;line-height:3rem;text-transform:uppercase;font-weight:normal;color:#fff102;}

#biscuit .garniture .DJ
{background:#fff102;text-align:right;margin: 0rem 0.5rem 0 0.5rem;padding:0.4rem 1rem;font-family:Lato,Helvetica,Arial,sans-serif;font-size:1.6rem;line-height:2.0rem;text-transform:uppercase;font-weight:normal;color:red;border-width:1px; border-style:dotted; border-color:red;}

#biscuit .garniture .AC
{background:lightgrey;text-align:right;margin: 1rem 0.5rem 0 0.5rem;padding:0.4rem 1rem;font-family:Lato,Helvetica,Arial,sans-serif;font-size:1.5rem;line-height:2.0rem;font-weight:bold;color:black;border-width:1px; border-style:dotted; border-color:black;}

#biscuit .garniture .RESUME
{background:#d3d3d3;text-align:left;margin: 1rem 0.5rem 0 0.5rem;padding:0.4rem 1rem;font-family:Lato,Helvetica,Arial,sans-serif;font-size:1.8rem;line-height:2.0rem;font-weight:normal;color:black;border-width:1px; border-style:dotted; border-color:black;}

#biscuit .ingredients
{clear:both;background:#000000;position:relative;top:-1rem}

#biscuit .ingredients .introduction
{font-size:1.4rem;text-align:justify;background:#000000; color:#ffffff;line-height:2rem;margin: 1rem 1rem 2rem 1rem}

#biscuit .ingredients .introductionE
{font-size:1.4rem;text-align:justify;background:#fff102; color:#000000;line-height:2rem;margin-bottom:0rem;padding: 0.5rem 0.5rem 0.5rem 0.5rem}

#biscuit .generique
{padding:0.4rem 2rem;font-size:1.5rem;color:white;text-align:right;display:block;background:#6b6666}

#biscuit .generiqueH
{margin:0.8rem 0rem 1rem 23rem;padding:0.4rem 2rem;font-size:1.5rem;color:white;text-align:right;display:block;background:#6b6666;}

#biscuit .generique span.complement-generique
{clear:both;font-weight:bold;font-size:1.4rem;display:block;margin:1rem 0}

#biscuit .generique span.jeune-public
{clear:both;margin:1rem 0;float:right;display:block;background:white;padding:0.2rem 1rem;color:#000000;-moz-border-radius:1rem;-webkit-border-radius:1rem;-khtml-border-radius:1rem;border-radius:1rem;position:relative}

#biscuit .generique span.jeune-public .age-spacer
{display:inline-block;width:4rem}

#biscuit .generique span.jeune-public .age
{position:absolute;top:-0.5rem;z-index:10;font-family:LeagueGothic-Regular;font-size:2rem;font-weight:100;background:white;text-align:center;width:3rem;margin:0
0.5rem;height:3rem;padding-top:0.2rem;-moz-border-radius:3rem;-webkit-border-radius:3rem;-khtml-border-radius:3rem;border-radius:3rem}

#biscuit .generique span.jeune-public .icon
{font-family:icons;padding-right:10px}

#biscuit .seances
{float:right;background:white;position:relative}

#biscuit .seancesH
{float:right;background:#fff102;position:relative; max-width:100%;padding : 0 0 0 23rem;}

#biscuit .seances .borders
{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 0.1rem transparent;border-width:0 0 0.1rem 0.1rem;pointer-events:none}

#biscuit .seancesH .borders
{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 0.1rem transparent;border-width:0 0 0.1rem 0.1rem;pointer-events:none}

#biscuit .seances :hover .borders
{border-color:#ccc}

#biscuit .seancesH :hover .borders
{border-color:#ccc}

#biscuit .seances div.more
{clear:both;position:relative;width:100%}

#biscuit .seancesH div.more
{clear:both;position:relative;width:100%}

#biscuit .seances 
#biscuit.seancesH div.more div.text-more
{width:100%;float:right;position:relative;background:white;text-align:right;color:#000000;font-size:1rem;padding:0.4rem 1rem 0.4rem 1rem;margin-top:0.4rem;border-top:dotted 0.1rem #000000}

#biscuit .seances div.more div.inside-more
{width:100%;display:none;position:absolute;z-index:30;background:white}

#biscuit .seances:hover div.more div.inside-more
{display:block}

#biscuit .seancesH div.more div.inside-more
{width:100%;display:none;position:absolute;z-index:30;background:white}

#biscuit .seances:hover div.more div.inside-more
{display:block}

#biscuit .seances ul
{padding:1rem 0;text-align:right}

#biscuit .seancesH ul
{padding:0 0;text-align:right}

#biscuit .seances ul li
{padding:0.4rem 1.5rem;margin:0 0 1rem 0;border-left:dotted 0.1rem #000000;float:left;display:block;color:#000000;font-size:1.9rem;list-style-type:none;text-align:right}

#biscuit .seancesH ul li
{padding:0.4rem 0.25rem;margin:0 0 1rem 0;border-left:dotted 0.1rem #000000;float:left;display:block;color:#000000;font-size:1.2rem;list-style-type:none;text-align:right}

#biscuit .seances ul li.end
{border:0;clear:both}

#biscuit .seancesH ul li.end
{border:0;clear:both}

#biscuit .seances ul li:hover
{color:#000000}

#biscuit .seancesH ul li:hover
{color:#ff0000}

#biscuit .seances ul li span.jour, 
#biscuit .seances ul li span.date, 
#biscuit .seances  ul li span.mois, 
#biscuit .seances ul li span.heure
{display:block;text-align:center;padding:0;margin:0}

#biscuit .seancesH ul li span.jour, 
#biscuit .seancesH ul li span.date, 
#biscuit .seancesH  ul li span.mois, 
#biscuit .seancesH ul li span.heure
{display:block;text-align:center;padding:0;margin:0}

#biscuit .seances ul li span.date
{font-family:'LeagueGothic-Regular';font-size:2.7rem;font-weight:bold;margin:-0.5rem 0}

#biscuit .seancesH ul li span.date
{font-family:'LeagueGothic-Regular';font-size:2.7rem;font-weight:bold;margin:-0.5rem 0}

#biscuit .seances ul li span.mois
{border-bottom:dotted 1px #999;padding-bottom:0.4rem;margin-bottom:0.4rem}

#biscuit .seancesH ul li span.mois
{border-bottom:dotted 1px #999;padding-bottom:0.4rem;margin-bottom:0.4rem}

#biscuit .seances ul li span.special
{display:block;color:#000000}

#biscuit .seancesH ul li span.special
{display:block;color:#000000}

#biscuit .seances ul li span.heure
{font-size:1.4rem;font-weight:100;padding:0.4rem;line-height:1rem;position:relative}

#biscuit .seancesH ul li span.heure
{font-size:1.4rem;font-weight:100;padding:0.4rem;line-height:1rem;position:relative}

#biscuit .seances ul li span.heure.special
{background:#000000;border:0;color:white;-moz-border-radius:0.2rem;-webkit-border-radius:0.2rem;-khtml-border-radius:0.2rem;border-radius:0.2rem}

#biscuit .seancesH ul li span.heure.special
{background:#000000;border:0;color:white;-moz-border-radius:0.2rem;-webkit-border-radius:0.2rem;-khtml-border-radius:0.2rem;border-radius:0.2rem}

#biscuit .seances ul li span.heure span.vovf
{position:absolute;top:2px;right:-11px;background:#000000;color:white;width:12px;height:12px;overflow:hidden;font-size:7pt;padding-top:1px;-moz-border-radius:1rem;-webkit-border-radius:1rem;-khtml-border-radius:1rem;border-radius:1rem}

#biscuit .seancesH ul li span.heure span.vovf
{position:absolute;top:2px;right:-11px;background:#000000;color:white;width:12px;height:12px;overflow:hidden;font-size:7pt;padding-top:1px;-moz-border-radius:1rem;-webkit-border-radius:1rem;-khtml-border-radius:1rem;border-radius:1rem}

#biscuit .seances ul li span.heure span.dernier-passage
{position:absolute;z-index:10000;top:0.5rem;left:-1rem;opacity:0.8;cursor:pointer}

#biscuit .seances ul li span.heure span.dernier-passage span.icon
{font-family:icons}

#biscuit .seances ul li span.heure span.dernier-passage span.presentation
{display:none;position:absolute;top:2.5rem;left:-0.5rem;background:#1e1e1e;color:white;-moz-border-radius:0.4rem;-webkit-border-radius:0.4rem;-khtml-border-radius:0.4rem;border-radius:0.4rem;font-size:1rem;padding:0.4rem;width:10rem}

#biscuit .seances ul li span.heure span.dernier-passage span.presentation .arrow
{position:absolute;width:0;height:0;border:solid 1rem transparent;border-bottom-color:#1e1e1e;top:-2rem;left:2rem}

#biscuit .seances ul li span.heure span.dernier-passage:hover
{opacity:1}

#biscuit .seances ul li span.heure span.dernier-passage:hover span.presentation
{display:block}

#biscuit .special
{margin:1rem 0 2rem 0;padding:1rem 1rem 2rem 1rem;border-bottom:dashed 1px #999;color:#000000;overflow:hidden;font-size:1.5rem}

#biscuit .special .special-date
{padding:4px;float:left;max-width:20%;border-right:dotted 0.1rem #000000;margin-right:1rem;padding-right:1rem;text-align:right;font-weight:bold}

#biscuit .special .special-presentation
{padding:4px;float:left;max-width:75%}

#biscuit .film-annonce
{position:absolute;width:100%;height:100%;top:0;left:0;z-index:2;display:none;vertical-align:middle;text-align:center}

#biscuit .film-annonce .centered
{position:relative;top:50%;height:10rem;margin:-5rem 20rem 0 20rem;text-align:center;color:white;-moz-border-radius:1rem;-webkit-border-radius:1rem;-khtml-border-radius:1rem;border-radius:1rem;background-color:rgba(255,255,255,0.5);cursor:pointer}

#biscuit .film-annonce .centered:hover
{background-color:#fff;color:#000000}

#biscuit .film-annonce .centered .icon
{font-family:icons;font-size:10rem;text-align:center}

#biscuit .film-annonce .centered .laius
{font-size:1.4rem}

#biscuit .photo-container:hover .film-annonce
{display:block}

#biscuit .critiques div.hr
{margin-top:2rem;border-top:dashed 1px #999;padding-top:2rem;width:100%;height:0;background:#000000;clear:both}

#biscuit .critiques .bulle
{width:50%;background:#000000;padding: 1rem 1rem 1rem 1rem;text-align:justify;margin-bottom:2rem;color:#ffffff;font-size:1.3rem;line-height:2rem}

#biscuit .critiques .bulle.bulle-left
{float:left;clear:both;background:#000000;padding-right:2rem}

#biscuit .critiques .bulle.bulle-right
{padding-left:2rem;background:#000000;float:right;position:relative}

#biscuit .critiques .bulle.bulle-right .bulle-border
{position:absolute;left:0;height:100%;top:0;background:#000000;border-left:dashed 0.1rem #999}

#biscuit .critiques .bulle.bulle-wide
{clear:both;width:100%}

#biscuit .critiques .bulle.bulle-wideA
{clear:both;width:100%;}

#biscuit .critiques .bulle .signature
{position:relative;background:#000000;;margin-top:0.5rem;border-top:dotted 0.1rem #999;float:left;font-weight:bold;color:#ffffff}

#biscuit .critiques .bulle .signature .arrow
{display:none;width:0;height:0;position:absolute;border:solid 0.6rem transparent;border-bottom-color:#999;top:-1.2rem;left:1rem;z-index:100}

#biscuit .notes{clear:both}

#biscuit .notes .note .note-rubrique
{float:right;position:relative;font-family:LeagueGothic-Regular;font-weight:100;font-size:2.4rem;line-height:2.4rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;right:-2rem;margin:1rem 0}

#biscuit .notes .note .note-texte
{clear:both;font-size:1.4rem;line-height:2rem;text-align:right;color:#000000}

#biscuit .notes .note .note-texte a
{color:#000000;border-bottom:dotted 1px #000000}

#biscuit .notes .note .note-texte a:hover
{border-bottom:solid 1px #000000}

#film-annonce
{display:none;width:100%;height:100%;position:absolute;z-index:1000;top:0;left:0;background:rgba(49,49,49,0.8)}

#film-annonce.visible
{display:block}

#film-annonce iframe
{display:block;width:600px;margin:auto;margin-top:200px}

body.evenement #biscuit .ingredients.introduction
{color:#000000;background:#000000;font-weight:bold}

body.evenement #biscuit .ingredients .introduction a
{color:#ffffff;background:#000000;border-bottom:dotted 0.2rem #000000;font-weight:normal}body.evenement 

#biscuit .ingredients .introduction a:hover
{border-bottom:solid 0.2rem #ffffff}

body.evenement #biscuit .ingredients .sous-titre
{font-size:1.4rem;font-weight:bold;color:#555;line-height:2rem;margin:2rem 0 0 0}

body.evenement #biscuit .ingredients .paragraphe
{font-size:1.4rem;line-height:2rem;text-align:justify;margin:1rem 0}

body.evenement #biscuit .ingredients .paragraphe b, 
body.evenement #biscuit .ingredients .paragraphe strong
{color:#000000}

body.evenement #biscuit .ingredients .films
{clear:both;margin-top:0rem; padding-top:2rem;background:#fff102;}

body.evenement #biscuit .ingredients .films .film
{clear:both;position:relative;margin:0rem 0;}

body.evenement #biscuit .ingredients .films .film .film-titre
{border-bottom:solid 0.2rem #000000;overflow:hidden}

body.evenement #biscuit .ingredients .films .film .film-titre .film-titre-inside
{float:left;font-family:LeagueGothic-Regular;font-weight:100;font-size:2rem;line-height:2rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase}

body.evenement #biscuit .ingredients .films .film .film-content
{margin-top:2rem;padding-top:0.4rem;clear:both;overflow:hidden;font-size:1.4rem;line-height:1.8rem;color:#000}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-left
{float:left;width:50%}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-left .film-content-photo
{display:block}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-left .film-content-photo img
{display:block}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-left .film-content-generique
{margin:1rem 1rem 1rem 1rem;font-size:1.2rem;padding:1rem 0}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-right
{float:left;width:50%;padding-left:2rem}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-right .film-content-resume
{font-size:1.2rem}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-right .film-content-resume .resume
{text-align:justify;margin-bottom:1rem;padding: 0rem 0.5rem 0rem 0rem; background:#fff102;}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-right .film-content-resume .link a
{display:inline-block;background:#fff102;color:white;padding:0.5rem 1rem}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-right .film-content-resume .link a .icon
{display:inline-block;margin:0 1rem 0 0;font-family:icons}

body.evenement #biscuit .ingredients .films .film .film-content .film-content-right .film-content-resume .link a:hover
{background:#333;color:white}

body.education #biscuit .photo-container
{padding-top:3rem;background:#000000}

body.education #biscuit .garniture
{float:left;left:0}

body.education #biscuit .garniture .title
{font-family:LeagueGothic-Regular;font-weight:100;font-size:5.1rem;line-height:5.1rem;background:white;color:#CAC602;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;padding-left:0}

body.education #biscuit .ingredients .introduction
{color:#CAC602;font-weight:bold}

body.education#biscuit .ingredients .introduction a
{color:#CAC602;border-bottom:dotted 0.2rem #CAC602;font-weight:normal}

body.education #biscuit .ingredients .introduction a:hover
{border-bottom:solid 0.2rem #CAC602}

body.education#biscuit .ingredients .content div.sous-titre
{font-family:LeagueGothic-Regular;font-weight:100;font-size:3rem;line-height:3rem;background:white;color:#CAC602;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;padding-left:0}

body.education #biscuit .ingredients .content div.paragraphe
{margin:0 0 1rem 0;font-size:1.4rem;line-height:1.8rem;text-align:justify;color:#555}

body.education #biscuit .ingredients .content .films
{clear:both;margin-top:6rem}

body.education #biscuit .ingredients .content .films .film
{clear:both;position:relative;margin:6rem 0}

body.education #biscuit .ingredients .content .films .film .film-titre
{border-bottom:solid 0.2rem #000000;overflow:hidden}

body.education #biscuit .ingredients .content .films .film .film-titre .film-titre-inside
{float:left;font-family:LeagueGothic-Regular;font-weight:100;font-size:2rem;line-height:2rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase}

body.education #biscuit .ingredients .content .films .film .film-content
{margin-top:2rem;padding-top:0.4rem;clear:both;overflow:hidden;font-size:1.4rem;line-height:1.8rem;color:#555}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-left
{float:left;width:50%}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-left .film-content-photo
{display:block}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-left .film-content-photo img
{display:block}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-left .film-content-generique
{margin:1rem 0;font-size:1.2rem;padding:1rem 0}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-right
{float:left;width:50%;padding-left:2rem}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-right .film-content-resume
{font-size:1.2rem}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-right .film-content-resume .resume
{text-align:justify;margin-bottom:1rem}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-right .film-content-resume .link a
{display:inline-block;background:#000000;color:white;padding:0.5rem 1rem}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-right .film-content-resume .link a .icon
{display:inline-block;margin:0 1rem 0 0;font-family:icons}

body.education #biscuit .ingredients .content .films .film .film-content .film-content-right .film-content-resume .link a:hover
{background:#333;color:white}

#rechercher .find,
#rechercher .count
{display:block;font-size:2rem}

#rechercher .find span,
#rechercher .count span
{color:#000000}

#rechercher .count
{border-bottom:dotted 0.1rem #000000;padding-bottom:2rem}

#rechercher ul.results li
{display:block;margin:0 0 1rem 0;padding:1rem 0;border-bottom:dotted 0.1rem #000000;overflow:hidden}

#rechercher ul.results li .result-type
{float:left;font-family:LeagueGothic-Regular;font-weight:100;font-size:1.8rem;line-height:1.8rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;width:20%;color:#000000;text-align:right;background:white;border-right:dotted 0.1rem #000000}

#rechercher ul.results li .result-right
{float:left;width:80%}

#rechercher ul.results li .result-right .result-title
{font-family:LeagueGothic-Regular;font-weight:100;font-size:2rem;line-height:2rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;background:white;color:#555}

#rechercher ul.results li .result-right .result-title a
{color:#555}

#rechercher ul.results li .result-right .result-title a:hover
{color:#000000}

#rechercher ul.results li .result-right .result-details{padding:0 2rem;font-size:1.3rem;color:#555}

#horaires div.semaine-dates
{margin-top:3rem;font-family:LeagueGothic-Regular;font-weight:100;font-size:2.8rem;line-height:2.8rem;background:#000000;color:white;padding:0.5rem 2rem 0.2rem 2rem;text-transform:uppercase;text-align:right;color:#555;background-color:white;border-bottom:dotted 0.1rem #000000}

#horaires div.semaine-dates .date
{color:#000000}

#horaires table.horaires
{border-collapse:collapse;width:100%;margin:20px 0 40px 0}

#horaires table.horaires td,
#horaires table.horaires th
{font-size:10pt;padding:2px 10px;border-left:solid 1px white;border-bottom:solid 4px white}

#horaires table.horaires th
{padding:2px 10px;background:#000000;color:white;position:relative}

#horaires table.horaires th:first-child
{background:white}

#horaires table.horaires tr.film.pair
{background:#ff6dbb}

#horaires table.horaires tr.film.impair
{background:#ffecf6}

#horaires table.horaires tr.film a
{text-decoration:none;color:inherit}

#horaires table.horaires tr.film a:hover
{text-decoration:underline}

#horaires table.horaires td.title
{width:25%;text-align:right;font-size:9pt;font-weight:bold}

#horaires table.horaires td.heure
{width:100px;text-align:center;position:relative}

#horaires table.horaires td.heure span.vovf
{position:absolute;width:12px;right:4px;margin-top:1px;height:12px;-moz-border-radius:10px;-webkit-border-radius:10px;-khtml-border-radius:10px;border-radius:10px;background:#555;color:white;font-size:7pt}

#horaires table.horaires td.heure .special,
#horaires table.horaires td.heure .last
{position:absolute;cursor:pointer}

#horaires table.horaires td.heure .special .icon,
#horaires table.horaires td.heure .last .icon
{font-family:icons;font-size:1.3rem;color:#333}

#horaires table.horaires td.heure .special .presentation,
#horaires table.horaires td.heure .last .presentation
{display:none;position:absolute;z-index:30;background:#333;color:white;padding:1rem}

#horaires table.horaires td.heure .special .presentation .arrow,
#horaires table.horaires td.heure .last .presentation .arrow
{position:absolute;border:solid 1rem transparent;border-bottom-color:#333;top:-2rem;right:3rem}

#horaires table.horaires td.heure .special:hover .icon,
#horaires table.horaires td.heure .last:hover .icon
{color:#555}

#horaires table.horaires td.heure .special:hover .presentation,
#horaires table.horaires td.heure .last:hover .presentation
{display:block}

#horaires table.horaires td.heure .special
{top:2px;right:1px}

#horaires table.horaires td.heure .special .presentation
{top:3.4rem;width:20rem;margin-left:-18rem}

#horaires table.horaires td.heure .last
{left:2px}

#horaires table.horaires td.heure .last .presentation
{top:2.7rem;width:12rem;margin-left:-5rem;background-color:#000000}

#horaires table.horaires td.heure .last .presentation .arrow
{border-bottom-color:#000000}

#bottom
{clear:both;width:100%;padding-top:10rem;padding-left:30%;position:relative}

#bottom .bottom-inside
{margin:0 2rem;padding:4rem 0 2rem 0;border-top:dotted 1px #000000;position:relative;bottom:0;color:#000000}

#bottom .bottom-inside .bottom-col
{font-size:1.4rem;position:relative;width:33%;float:left;padding:0 2rem}

#bottom .bottom-inside .bottom-col .details
{font-size:1.2rem}

#bottom .bottom-inside .bottom-col a
{color:#000000;display:inline-block;border-bottom:dotted 0.1rem #000000}

#bottom .bottom-inside .bottom-col a:hover
{border-bottom:solid 0.1rem #000000}

#bottom .bottom-inside #logo
{position:absolute;z-index:100;top:5rem;left:-26rem;width:18rem;height:16rem;overflow:hidden}

#bottom .bottom-inside #logo img
{width:100%}

/*
#logo1
{position:absolute;z-index:100;top:1rem;left:-26rem;width:18rem;height:3.45rem;overflow:hidden}

#bottom .bottom-inside #logo1 img
{width:100%}

#logo2
{position:absolute;z-index:100;top:-8rem;left:-26rem;width:18rem;height:8.28rem;overflow:hidden}

#bottom .bottom-inside #logo2 img
{width:100%}

#logo3
{position:absolute;z-index:100;top:-14.5rem;left:-26rem;width:18rem;height:5.48rem;overflow:hidden}

#bottom .bottom-inside #logo3 img
{width:100%}

#logo4
{position:absolute;z-index:100;top:-22rem;left:-26rem;width:18rem;height:6.48rem;overflow:hidden}

#bottom .bottom-inside #logo4 img
{width:100%}

#logo5
{position:absolute;z-index:100;top:-39rem;left:-26rem;width:18rem;height:16rem;overflow:hidden}

#bottom .bottom-inside 
#logo4 img{width:100%}
*/

#logo1 {position:relative;display:inline;}
#logo1 img {width:30%;display:inline;padding:1rem 1rem;}


.cf:before,
.cf:after {
  content:"";
  display:table;
}
.cf:after {
  clear:both;
}
.droite {
  float:right;
}
 
.oModal {
  position: fixed;
  z-index: 99999;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  opacity:0;
  -webkit-transition: opacity 400ms ease-in;
  -moz-transition: opacity 400ms ease-in;
  transition: opacity 400ms ease-in;
  pointer-events: none;
}
 
.oModal:target {
  opacity:1;
  pointer-events: auto;
}
 
.oModal:target > div {
  margin: 10% auto;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
}
 
.oModal > div {
  max-width: 800px;
  position: relative;
  margin: 1% auto;
  padding: 8px 8px 8px 8px;
  border-radius: 5px;
  background: #eee;
  transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
}
 
.oModal > div header,.oModal > div footer {
  border-bottom: 1px solid #e7e7e7;
  border-radius: 5px 5px 0 0;
}
.oModal .footer {
  border:none;
  border-top: 1px solid #e7e7e7;
  border-radius: 0 0 5px 5px;
}
 
.oModal > div h1 {
font-family:LeagueGothic-Regular;font-weight:100;font-size:3.4rem;
  margin:0;color:black;
}
 
.oModal > div h2 {
font-family:LeagueGothic-Regular;font-weight:100;font-size:2.4rem;
  margin:0;color:black;
}
 
.oModal > div .btn {
  float:right;
}
 
.oModal > div section,.oModal > div > header, .oModal > div > footer {
  padding:15px;
}

*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}
/***rotation 3D flip***/
img{max-width:100%}
/*pour tous les id*/
#contenu,#contenu1,#contenu2{
color:white;
position:relative;
display:inline-block;
-webkit-perspective:600px;
perspective:600px}

#contenu div,
#contenu1 div,
#contenu2 div{
position:absolute;
left:0;
top:0;
box-shadow:0 8px 5px hsla(0,0%,0%,.2);
transition:.8s ease}

#contenu .derriere,
#contenu1 .derriere,
#contenu2 .derriere {
color:white;
background:#303030;   
overflow:hidden;
backface-visibility:hidden;
transform-style:preserve-3d;
transform:rotateY(-180deg);
-webkit-transform-style:preserve-3d;
-webkit-backface-visibility:hidden;
-webkit-transform:rotateY(-180deg);
border: 5px solid #b2a801;}

#contenu div.devant,
#contenu1 div.devant,
#contenu2 div.devant{
overflow:hidden;
transform-style: preserve-3d;
backface-visibility:hidden;
-webkit-transform-style:preserve-3d;
-webkit-backface-visibility:hidden;
background:#b2a801;}

#contenu:hover .derriere,
#contenu1:hover .derriere,
#contenu2:hover .derriere{
transform:rotatey(0);
-webkit-transform:rotatey(0)}

#contenu:hover div.devant,
#contenu1:hover div.devant,
#contenu2:hover div.devant{
-webkit-transform:rotatey(180deg);
transform:rotatey(180deg)}

.derriere p{
color:white;
word-wrap:break-word;
font-family:LeagueGothic-Regular;
font-weight:100;
font-size:2.1rem;
line-height:2.1rem;
background:#303030;
padding:0.5rem 0.5rem 0.5rem 0.5rem;
text-transform:uppercase;
padding-left:1rem;
padding-right:1rem;
letter-spacing:0.1rem;
height:2.8rem;

}

.derriere pJ
{color:#b2a801;}


/*premier*/
#contenu{width:220px;height:295px;margin:10px 0 0 5px}
#contenu div{width:210px;height:285px;padding:5px 5px}

#contenu mardi
{padding:5px;color:red;font-family:LeagueGothic-Regular;
font-weight:100;text-align:center;font-size:1.1rem;background:#303030}

.mardi a{color:red;text-decoration:none;}
.mardi {padding:5px;color:red;font-family:LeagueGothic-Regular;
font-weight:100;text-align:center;font-size:2.1rem;}

#contenu .derriere h1{font-family:LeagueGothic-Regular;font-weight:100;text-align:left;font-size:2.1rem;color:white;background:#b2a801}
#contenu .derriere h2{font-family:LeagueGothic-Regular;font-weight:100;text-align:left;font-size:2.1rem;color:green;background:#b2a801}
#contenu .derriere h3{font-family:LeagueGothic-Regular;font-weight:100;text-align:left;font-size:2.1rem;color:red;background:#b2a801}
#contenu .devant h3{font-family:LeagueGothic-Regular;font-weight:100;text-align:center;font-size:2.1rem;color:red;background:#303030}
#contenu .derriere p{font-size:16px;line-height:18px;color:white;}
#contenu .derriere a:link {color:red;}
#contenu .derriere a:visited {color:red;}