/* M_D_R le 2020-06-13 20:04:44 */
@charset "UTF-8";

/* 
https://www.sitepoint.com/understanding-and-using-rem-units-in-css/
La taille par défaut du texte étant de 16px, on diminue dès le départ cette valeur à 10px (16x62.5/100 = 10).

Pas essayé : https://www.creativebloq.com/how-to/design-a-responsive-site-with-em-based-sizing && http://bits.citrusbyte.com/css-pro-tips-responsive-font-sizes-and-when-to-use-which-units/
html { font-size: calc(0.6em + 1vw); }
*/
html {
font-size: 62.5%;
}

html, body, span, img {
border: 0;
margin: 0;
padding: 0;
/*box-sizing: border-box; Provoque une erreur dans RESEAUX SOCIAUX EN BAS. */
}

iframe {
    display:block;
    margin: 0 auto;
}

.nowrap {
white-space: nowrap;
}

#wrapper {
width: 100%;
margin: 0;
}


.FONT_bold {
font-weight: bold;
}

.FONT_italic {
font-style: italic;
}

.FONT_white { color: #fff; }

.green_bg { background-color: #9FD04D; } /* #99BB00 */
.blue_bg { background-color: #29A2E5; }
/* .blue_bg_2 { background-color: #2eadee; } Bleu du logo */
.blue_bg_3 { background-color: #79c8f3; }
.yellow_bg { background-color: #FFE100; }
.orange_bg { background-color: #FF851B; } /* #EA8A16 */
.grey_bg { background-color: #fff; border-radius: 15px; }
.grey_2_bg { background-color: #ecf0f1; }
.purple_bg { background-color: #A159A3; }
.white_bg { background-color: #fff; }

.border_radius_5px {
border-radius: 5px;
}

.text_align_center {
text-align: center;
}


.text_align_right {
text-align: right;
}


.footer_links {
display: inline-block;
position: relative;
margin: 0 50px;
line-height: normal;
/*background-color: brown;*/
vertical-align: middle;
}

.footer_links_2 {
text-decoration: none;
line-height: 2em;
color: #fff;
}
.footer_links_2:hover {
text-decoration: underline;
color: #f0f;
}

.FONT_prenom {
font-family: 'Bubblegum Sans', cursive;
font-size: 2.5rem;
}

/* 0445523 Temp_blog_pres */

/*
.svg_section0 {
    display: none;
}

.svg_section1 {
    position: absolute;
    fill: rgba(0,0,0,.07);
    width: 100px;
    height: 100px;
    overflow: hidden;
}
*/

.IMG_emoticon {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

.FIGURE_audio {
  text-align: center;
  background: #00b6ed;
  padding: 2em 0;
  border-radius: 7px 7px 7px 7px ;
  }

.FIGCAPTION_audio {
    font-weight: bold;
    color: #fff;
  }

.AUDIOc {
  box-shadow: 2px 2px 0px 0px #006773;
  border-radius:7px 7px 7px 7px ;
  transition: all 0.3s ease-in-out;
  }

.AUDIOc:hover, .AUDIOc:focus, .AUDIOc:active {
  box-shadow: 15px 15px 20px rgba(0,0, 0, 0.4);
  transform: scale(1.1);
  }

.BOUTON_pdf {
    display: block;
    font-weight: bold;
    color: #fff;
    padding: 14px;
    max-width: 80%;
    border-radius: 4px;
    background: hsl(200, 100%, 90%);
    text-align: center;
    margin: 0 auto;
    }

.IMG_logoFB {
    vertical-align: middle;
    }

/*** Enigmes ***/

.button_sh {
    cursor: pointer;
}

.button_sh:after {
    display: inline-block;
    position: relative;
    content: url("../images/autres/loupe.svg");
    left: 10px;
    top: 20px;
    background-size: 39px 45px;
    width: 39px;
    height: 45px;
}

.reponse_sh {
    height: 0;
    overflow: hidden;
    border: none;
    transition: all 0.8s ease;
}

.reponse_sh_open {
    overflow: hidden;
    transition: height 0.8s ease;
    border: dotted 1px lightgrey;
    background: #fff3ce;
}

.IMG_level {
vertical-align: text-top;
}

/*********************************/

.ribbon {
position: absolute;
overflow: hidden;
left: -5px;
top: -5px;
width: 75px;
height: 75px;
text-align: right;
z-index: 1;
}
.ribbon span {
display: block;
position: absolute;
top: 19px;
left: -21px;
font-size: 10px;
font-weight: bold;
color: #FFF;
text-align: center;
line-height: 20px;
transform: rotate(-45deg);
width: 100px;
background: #79A70A;
background: linear-gradient(#A9CF37 0%, #79A70A 100%);
box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
}
.ribbon span::before {
content: "";
position: absolute;
left: 0;
top: 100%;
border-top: 3px solid #79A70A;
border-right: 3px solid transparent;
border-left: 3px solid #79A70A;
border-bottom: 3px solid transparent;
z-index: -1;
}
.ribbon span::after {
content: "";
position: absolute;
right: 0;
top: 100%;
z-index: -1;
border-top: 3px solid #79A70A;
border-right: 3px solid #79A70A;
border-left: 3px solid transparent;
border-bottom: 3px solid transparent;
}

/*********************************/

.color_1,.color_1:visited { color:#fff; }
.color_6,.color_6:visited { color:#505050; }
.color_2,.color_2:visited { color:#505050; }
.color_3,.color_3:visited { color:#505050; }
.color_4,.color_4:visited { color:#505050; }
.color_5,.color_5:visited { color:#505050; }
.color_2:hover { color:#f70089; }
.color_3:hover { color:#ed8300; }
.color_4:hover { color:#7cc400; }
.color_5:hover { color:#a6579f; }
.color_6:hover { color:#FF4136; }


#IMG_accueil {
width: 100%;
}

#logoSmall {
top: 0;
left: 0;
z-index: 10;
}

@media screen and (min-width: 768px) {
#logoSmall {
position: fixed;
border-radius: 0 0 30px 0;
width: 116px;
height: auto;
right: auto;
padding: 15px 16px 0;
margin: auto;
transition: all .5s ease-in-out;
z-index: 10;
}
#logoSmall.small {
top: 0;
}
#logoSmall.large {
top: -200px;
}

}/* FIN DE @media screen and (min-width: 768px) */


#menu-toggle {
display: none;
}


.menu_font_2, .menu_font_2:visited {
display: inline-block;
line-height: normal;
white-space: nowrap;
font-family: 'Open Sans', sans-serif;
font-size: 1.2rem;
font-weight: bold;
text-align: center;
text-decoration: none;
margin: 7px 0;
box-sizing: border-box;
padding: 15px 10px;
background: #fff;
cursor: pointer;
}

.border_left {
border-top: solid 1px #505050;
border-bottom: solid 1px #505050;
border-left: solid 1px #505050;
border-radius: 5px 0 0 5px;
}

.border_right {
border-top: solid 1px #505050;
border-bottom: solid 1px #505050;
border-right: solid 1px #505050;
border-radius: 0 5px 5px 0;
}

.border_left:hover {
border-top: solid 1px #FF4136;
border-bottom: solid 1px #FF4136;
border-left: solid 1px #FF4136;
}


.border_right:hover {
border-top: solid 1px #FF4136;
border-bottom: solid 1px #FF4136;
border-right: solid 1px #FF4136;
}


/*******************************/


.caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 20px;
vertical-align: middle;
border-top: 4px solid;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}

.UL_SubMenu:nth-child(1) {
background: url("../images/autres/zigzag-vertical-line.png") top right/7% repeat-y;
}

.UL_SubMenu:nth-child(3) {
background: url("../images/autres/zigzag-vertical-line.png") top right/7% repeat-y, url("../images/autres/zigzag-vertical-line.png") top left/7% repeat-y;
}

/*
#menu_header {
overflow: hidden;
}
*/

@media screen and (min-width: 768px) {

#menu_header {
position: fixed;
width: 100%;
background-color: #fff;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
z-index: 10;
}

#menu_ul_2 {
margin: 0 10px;
padding: 0;
}


/* Transitions */

/* #menu_header, nav, a, li */
#menu_header {
transition: all .5s ease;
}


.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}


@keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
transform: translate3d(0, 0, 0);
}

40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transform: translate3d(0, -30px, 0);
}

70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
transform: translate3d(0, -15px, 0);
}

90% {
transform: translate3d(0, -4px, 0);
}
}

.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
transform-origin: center bottom;
}

} /* FIN DE @media screen and (min-width: 768px) */


@media screen and (min-width: 1024px) {

    #menu_header.large {
    height: 93px;
    }

    #menu_header.small {
    height: 40px;
    }

} /* FIN DE @media screen and (min-width: 1024px) */

/*********************************/


/*
#citation {
text-align: justify;
}
*/

.margin_top {
margin-top:2rem;
}
.justify {
text-align: justify;
}
.center {
text-align: center;
}

.container_100 {
width: 100%;
}

/********************************/

.div_imT {
max-width: 100%;
text-align: center;
margin-bottom: 20px;
margin-top: 6px !important;
margin-right: auto;
margin-left: auto;
padding: 13px 8px 4px;
}
.div_imT_BG { background: #F1EFEF none repeat scroll 0 0; }
.div_imT_600 { max-width: 620px; }
.div_imT_300 { max-width: 320px; }
.div_imT_AlignL { margin-left: 0; }
.div_imT_AlignR { margin-right: 0; }



.figc_imT {
color: #4F4F4F;
font-size: 1.28rem;
line-height: 150%;
}

.credit_photo {
color: #3f3f3f;
font-size: 1rem;
padding: 0;
margin: 0;
}

/*** MENU ****/


/* .a_menu_1_bg_black:before { background-color: #000; }
.a_menu_1_bg_red:before { background-color: #C4067E; }
.a_menu_1_bg_purple:before { background-color: #A2559B; }
.a_menu_1_bg_white:before { background-color: #fff; } */
.a_menu_1_bg_green:before { background-color: #99BB00; }
.a_menu_1_bg_orange:before { background-color: #EA8A16; }
.a_menu_1_bg_blue:before { background-color: #29A2E5; }





.NAV_flex {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
align-items: stretch;
width: 100%;
}

.h2_norm {
font-family: 'Open Sans', sans-serif;
font-size: 1.6rem;
margin: 0;
}

.DIV_soeurs {
flex: 1;
/*max-width: 350px;
flex: 1 1 30%;
min-width: 200px;*/
padding: 10px 5px;
margin: 0 auto;
text-align: center;
max-width: 50%;
}
.DIV_soeurs:hover {
border-radius: 10px;
background: 
radial-gradient(circle at 100% 50%, transparent 20%, rgba(255,255,255,.3) 21%, rgba(255,255,255,.3) 34%, transparent 35%, transparent),
radial-gradient(circle at 0% 50%, transparent 20%, rgba(255,255,255,.3) 21%, rgba(255,255,255,.3) 34%, transparent 35%, transparent) 0 -50px;
background-color: #d9d9d9;
background-size:75px 100px;
}

.IMG_soeurs {
border-radius: 10px;
margin: 10px 0;
width: 250px;
height: 200px;
object-fit: cover;
}



/*** ARTICLES ***/

.container_wrap {
width: 100%;
margin: 0 0 30px 0;
padding: 0;
}


/* https://stackoverflow.com/a/27994580
.container_wrap:last-child {
margin: 0; 
}*/



article {
text-align: justify;
word-spacing:-1px; /* https://stackoverflow.com/a/20842079/4741362 */
/* hyphens: auto; */
}
.marginTop4rem {
margin-top: 4rem;
}


article ul li {
margin:0 0 1.5rem 0;
}

/*************/

.separator {
/*position: relative;*/
width: 100%;
}


/***** Ghost buttons ***********/
/* https://codepen.io/courcelan/pen/xbmqXN/?editors=0100#0 */

.ctrl-standard {
display:block;
margin: 20px auto 10px;
padding: 14px;
width: 70%;
border-radius: 4px;
border: 1px solid #231f20;
cursor: pointer;
background: #fff;
}

.ctrl-standard.fx-bubbleDown {
color: #fab040;
border-color: #fab040;
}
.ctrl-standard.fx-bubbleDown::after {
bottom: auto;
border-radius: 0 0 75% 75%/0 0 50% 50%;
background: #fab040;
}
.ctrl-standard.fx-bubbleDown.is-reversed::after {
height: 300%;
}
.ctrl-standard.fx-bubbleDown.is-reversed:hover {
color: #fab040;
}
.ctrl-standard.fx-bubbleDown.is-reversed:hover::after {
height: 0;
}
.ctrl-standard.fx-bubbleUp {
color: #a9cf37;
border-color: #a9cf37;
}
.ctrl-standard.fx-bubbleUp::after {
top: auto;
border-radius: 50% 50% 0 0/75% 75% 0 0;
background: #a9cf37;
}
.ctrl-standard.fx-bubbleUp.is-reversed::after {
height: 300%;
}
.ctrl-standard.fx-bubbleUp.is-reversed:hover {
color: #a9cf37;
}
.ctrl-standard.fx-bubbleUp.is-reversed:hover::after {
height: 0;
}

[class*="ctrl-"][class*="fx-"]:hover,
[class*="ctrl-"][class*="fx-"].active {
color: #fff;
font-weight: bold;
}
[class*="ctrl-"][class*="fx-"].is-reversed {
color: #fff;
font-weight: bold;
}
[class*="fx-bubble"] {
transition: color 0.5s ease-in-out;
position: relative;
z-index: 1;
transition-delay: 0.2s !important;
overflow: hidden;
}
[class*="fx-bubble"]::before, [class*="fx-bubble"]::after {
content: "";
display: block;
position: absolute;
z-index: -1;
}
[class*="fx-bubble"]::after {
transition: height 0.5s ease-in-out;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 0;
width: 100%;
}
[class*="fx-bubble"]:hover::after,
[class*="fx-bubble"].active::after {
transition: height 0.5s ease-in-out;
height: 300%;
}
[class*="fx-bubble"]:disabled:hover::after {
height: 0;
}

/*** Vidéos : ***/

/* Youtube : */
.DIV_videoWrapper_1 {
max-width: 560px;
margin: 0 auto;
width: 100%;
border: none;
overflow: hidden;
}
.DIV_videoWrapper_2 {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
}
.DIV_videoWrapper_3 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}

/* FaceBook (https://www.ostraining.com/blog/coding/responsive-facebook-videos/) : */
.facebook_responsive {
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}

.facebook_responsive iframe {
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}

/* France Culture : */
.FranceCulture {
min-width: 200px;
max-width: 560px;
width: 100%;
border: none;
overflow: hidden;
}


.facebook_bg {border-color: #3b5998; background-color: #3b5998;}
.facebook:hover {fill: #fff; box-shadow: inset 0 0 0 60px #3b5998;}

.pinterest_bg {border-color: #cb2027; background-color: #cb2027;}
.pinterest:hover {fill: #fff; box-shadow: inset 0 0 0 60px #cb2027;}

.twitter_bg {border-color: #55acee; background-color: #55acee;}
.twitter:hover {fill: #fff; box-shadow: inset 0 0 0 60px #55acee;}

.youtube_bg {border-color: #cd201f; background-color: #cd201f;}
.youtube:hover {fill: #fff; box-shadow: inset 0 0 0 60px #cd201f;}


/****************************/

/*
*, *::before, *::after {
box-sizing: inherit;
}
.tooltip_2_text::after {
border-color: transparent transparent '.#505050.';
border-style: solid;
border-width: 5px;
bottom: 100%;
content: '';
left: 0;
margin-left: -5px;
position: relative;
}
*/

.A_tooltip_2 {
color: #fff;
font-weight: bold;
text-decoration: none;
}

.tooltip_2 {
display: inline-block;
position: relative;
}

.tooltip_2 .tooltip_2_text {
position: absolute;
opacity: 0;
visibility: hidden;
border-radius: 6px;
color: #fff;
padding: 0 5px;
text-align: center;
width: 120px;
z-index: 10;
transition: all 1s ease-in-out;
}

.tooltip_2:hover .tooltip_2_text {
opacity: 1;
visibility: visible;
}
.tooltip_2_text {
left: 40px;
margin-left: -60px;
top: 90%;
}

.tooltip_2 .tooltip_2_text::after {
border-style: solid;
border-width: 5px;
bottom: 100%;
content: '';
left: 50%;
margin-left: -5px;
position: absolute;
}


.LI_links {
list-style-type: none;
margin-left: -4rem;
padding-top: 1rem;
}


.width_50_svg {margin: 0 10px; padding: 10px; width: 50px;}

.width_25_svg {margin: 0; padding: 0; width: 35px;}




/* @-webkit-keyframes flipInY from https://daneden.github.io/animate.css/ */
@-webkit-keyframes flipInY {
 from {
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
 }
 40% {
transform: perspective(400px) rotate3d(0, 1, 0, -10deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
 }
 60% {
transform: perspective(400px) rotate3d(0, 1, 0, 7deg);
opacity: 1;
 }
 80% {
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
 }
 to {
transform: perspective(400px);
 }
}
@keyframes flipInY {
 from {
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
 }
 40% {
transform: perspective(400px) rotate3d(0, 1, 0, -10deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
 }
 60% {
transform: perspective(400px) rotate3d(0, 1, 0, 7deg);
opacity: 1;
 }
 80% {
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
 }
 to {
transform: perspective(400px);
 }
}

/* 75%  {color: brown; text-decoration: none;}*/


.DIV_header_title {
margin: 0 0 1.5rem;
}
.A_header_title {
font-family: 'Bubblegum Sans', cursive !important;
color: #505050 !important;
font-size: 2.5rem;
}

.fontA, .container_wrap a, .container_wrap a:visited {
font-family: 'Open Sans', sans-serif;
color: #0077b3;
text-decoration: none;
transition: all 0.5s ease-out;
}
.fontA { font-weight: bold; }

.container_wrap a:hover {
text-decoration: underline;
// animation-name: BrightUrl;
// animation-duration: 1.5s;
}


/*
@keyframes BrightUrl {
0%   {color: #0077b3;}
50%  {color: brown; background-color: yellow;}
100% {color: #0077b3;}
}
*/

body { 
color: #505050;
font-family: 'Open Sans', sans-serif;
font-size: 1.6rem;
width: 100%;
font-style: normal;
font-weight: 400;
line-height: 3.2rem;
text-rendering: optimizelegibility;
word-spacing: 0.08rem;
letter-spacing: 0.08rem; }
.display_flex_stretch { 
display: flex;
flex-direction: column;
flex-wrap: wrap;
justify-content: space-between;
align-items: stretch; }
.text_align_left { 
text-align: center; }
p { padding: 0 10px; margin-bottom: 2.24em; }
nav { width: auto; flex-basis: auto; /* pour écraser la valeur 0, due au flex: 1 */ }
h1, h2, h3, h4 { font-weight: normal; font-family:'Bubblegum Sans', cursive; letter-spacing: 0.03rem; color: #505050; text-align: left; padding: 0 10px; }
h1 { font-size: 3rem; line-height: 3rem; margin: 0 0 3rem; }
h2 { font-size: 2.5rem; line-height: 3rem; margin: 5.7rem 0 2rem; padding: 0 10px; }
h3, h4 { font-size: 2.2rem; line-height: 3rem; margin: 5.7rem 0 2rem; padding: 0 10px; }
.blazy-error { border: 10px solid red; }
.section_5 { width: 100%; margin: 0; padding: 0; }
#DIV_svg_s_5 { width: 100%; margin: 0; padding: 0; display:block; }
#SVG_s_5 { display:block; stroke-width:0; fill: #222222 }
.background_black { background-color: #222222; }
.clear { clear: both; }
.footer { font-family: 'Open Sans', sans-serif; font-size: 1.44rem; line-height: 50px; letter-spacing: 4px; padding: 40px; }
.font_footer { font-size: 1.92rem; }
#BLOCKqFB { 
margin: 0; }
.BlockQuote { 
display:block;
background: #fff;
padding: 15px 20px 15px 45px;
margin: 0 5% 20px;
position: relative;
font-style: italic;
font-size: 0.9em;
line-height: 1.5;
color: #666;
text-align: justify;
border-left: 15px solid #c76c0c;
border-right: 2px solid #c76c0c;
box-shadow: 2px 2px 15px #ccc; }
.BlockQuote::before { content: "\201C"; /*Unicode for Left Double Quote*/font-family: Georgia, serif;font-size: 3.75em;font-weight: bold;color: #999;position: absolute;left: 10px;top:5px; }
.BlockQuote::after { content: ""; /* Reset to make sure */ }
#MainSection { 
padding: 0;
margin: 0; }
#menu_div_1 { 
display: none;
width: auto;
 }
#menu_ul_1 { display: none; }
.menu_font_1 { 
display: block;
text-decoration: none;
font-size: 2rem;
font-weight: bold;
font-family: 'Open Sans', sans-serif; }
#logoLarge { 
position: absolute;
display: none;
top: 10px;
left: 10px;
z-index: 10;
 }
#menu_nav { 
display: flex;
flex-flow: column;
justify-content: flex-start;
align-items: center;
width: 100%;
height: 100%;
 }
#menu_div_3 { 
display: none;
text-align: right;
width: 90%;
 }
#DIV_link_7 { 
margin: 0;
 }
#label-toggle { 
position: relative;
display: block;
margin: 5px 0 5px auto;
cursor: pointer;
width: 35px;
height: 35px;
right: 15px;
z-index: 10; }
#BigMenu { 
display: none; /* display: none; */
width: 90%;
height: auto;
z-index: 20; }
.UL_SubMenu { 
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
padding: 0;
width:100%; }
.UL_SubMenu:nth-last-child(1) { 
display: none; }
.menu_li_1:hover #BigMenu { 
display: flex;
flex-flow: column wrap;
justify-content: center;
align-items: flex-start; }
.menu_li_1 { 
display: block;
background-color: #eee;
 }
.LI_SubMenu { 
display: block;
width: 100%;
background: #3bb7fb;
 }
.LI_SubMenu:first-child { 
margin-top: 2px;
 }
.A_SubMenu_1 { 
font-size: 2.6rem;
font-family: 'Bubblegum Sans', cursive;
color: #fff;
 }
.A_SubMenu_2 { 
font-size: 1.4rem;
text-decoration: none;
color: #fff;
 }
.A_SubMenu_2:hover { 
text-decoration: underline;
 }
#SVG_flecheB { 
width: 20%;
margin: 0 auto;
display: block;
 }
#mascotte { 
display: none;
top: 0;
left: 2000px;
width: 100px;
transition: all .5s ease;
pointer-events: none;
 }
#mascotte.small { 
top: -31px;
 }
#mascotte.large { 
top: 1px;
 }
#IMG_bouton { 
max-width: 100%;
margin: 0 auto;
display: block;
 }
.encadre { border: 1px solid lightgrey; background: #f8ffeb; margin: 2em 0; padding: 1em; text-align: justify; }
.IMG_100 { max-width: 100%; }
.big_container_gauche { width: 100%; margin: 0; padding: 0; }
.big_container_droit { width: 100%; margin: 0; padding: 0; }
.div_news, .div_citation { width: 95%; margin: 0 auto; line-height: normal; }
.div_news a, .div_citation a { font-size: 1.6rem; line-height: 1.3rem; word-spacing: normal; letter-spacing: normal; }
.padding_80_30 { padding: 0; }
.padding_40_30 { padding: 0; }
.div_photo { 
position: relative;
display:inline-block;
width: 100%;
height: auto;
border-radius: 0;
box-shadow: none;
overflow: visible; }
.div_photo_center { 
margin: 0 auto;
width: 220px;
position: relative;
 }
.photo_article { 
display:block;
width: 100%;
max-width: 220px;
height: auto;
border-radius: 0;
object-fit: cover; }
.div_photo_overlay { 
display: none;
opacity: 0;
visibility: hidden;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
flex-flow: row;
justify-content: center;
align-items: center;
background: rgba(46, 173, 238, 0.5);
text-align: center;
padding: 200px;
transition: all .5s ease; }
.div_photo:hover .div_photo_overlay { 
visibility: hidden;
opacity: 0;
padding: 0; }
.photo_svg { 
visibility: hidden;
opacity: 0;
width: 15%;
height: 15%;
padding: 5%;
border-radius: 50%;
background: rgb(46, 173, 238);
transition: all .5s ease; }
.div_photo:hover .photo_svg { 
visibility: visible;
opacity: 1; }
.DIV_link { 
position: relative;
float: right;
margin: 2rem auto; }
.article70 { 
line-height: normal;
width: 100%; }
.DIV_ligneH { 
background: url("../images/autres/zigzag-horizontal-line.png") top left repeat-x;
height: 2rem;
width: 50%;
margin: 0 auto 2rem; }
#SECTION_en_savoir_plus, #ASIDE_news { 
width: 90%;
margin: 0 auto; }
.photo_news { 
display:block;
width: 70%;
max-width: 300px;
margin: 30px auto;
border-radius: 5px;
box-shadow: 0 0 0 4px #fff, 0 0 0 6px #F1EFEF; }
#social-sidebar { 
position: fixed;
display: none;
left: 0;
top: 30%;
list-style-type: none;
padding: 0;
margin: 0;
z-index: 4; }
#social-sidebar li:first-child a { border-top-right-radius: 5px; }
#social-sidebar li:last-child a { border-bottom-right-radius: 5px; }
#social-sidebar a { background: rgba(0, 0, 0, .2); 
color: #fff;
text-decoration: none;
display: block;
height: 70px;
line-height: 70px;
width: 60px;
font-size: 3.6rem;
position: relative;
text-align: center;
cursor: pointer; }
#social-sidebar a:hover span { left: 120%; opacity: 1; }
#social-sidebar a span { 
font-size: 1.6rem;
white-space: nowrap;
border-radius: 3px;
line-height: 24px;
left: -100%;
margin-top: -16px;
opacity: 0;
padding: 4px 8px;
position: absolute;
transition: opacity .3s, left .4s;
top: 50%;
z-index: -1; }
#social-sidebar a span:before { content: "";
display: block;
height: 8px;
width: 8px;
left: -4px;
margin-top: -4px;
position: absolute;
top: 50%;
transform: rotate(45deg); }
#social-sidebar a[class*='facebook2']:hover, #social-sidebar a[class*='facebook2'] span, #social-sidebar a[class*='facebook2'] span:before { background: #3b5998; }
#social-sidebar a[class*='pinterest2']:hover, #social-sidebar a[class*='pinterest2'] span, #social-sidebar a[class*='pinterest2'] span:before { background: #cb2027; }
#social-sidebar a[class*='twitter2']:hover, #social-sidebar a[class*='twitter2'] span, #social-sidebar a[class*='twitter2'] span:before { background: #55acee; }
#DIV_chanson { text-align: center; background: bisque; border-radius: 20px; display: inline-block; margin-left: 3rem; padding: 3rem 0; width: 80%; }
.DIV_refrain { display: inline-block; background: beige; font-style: italic; border-radius: 20px; margin: 10px; padding: 10px; }
.DIV_couplet { margin: 20px 0; }
.height_70 { height: 20px }
.height_100 { height: 20px }
.svg_social_m_2 { position: relative; border-radius: 50%; stroke: #fff; stroke-width: 0.5; fill: #333; transition: all 1s ease-in-out; }
.svg_social_m_3 { position: relative; stroke: #fff; stroke-width: 0.1; fill: #fff; transition: all .4s ease-in-out; }
.svg_social_m_3:hover { transform: scale(1.3); }
@media screen and (min-width:480px) {
 .div_photo { border-radius: 7px; }
 .height_70 { height: 30px; }
 .height_100 { height: 60px; }
 }
@media screen and (min-width:768px) {
 body { background: url("../images/autres/pattern-1.png") left top repeat-y, url("../images/autres/pattern-2.png") center -20% repeat-y, url("../images/autres/pattern-2.png") right +20% repeat-y, #f1efef;; }
 .text_align_left { text-align: left; }
 h1, h2, h3, h4 { text-align: justify; }
 h1 { font-size: 3.5rem;line-height: 4.6rem;margin: 0 0 5rem; }
 h2 { font-size: 2.9rem;line-height: 3.8rem; }
 h3, h4 { font-size: 2.5rem;line-height: 3.4rem; }
 #read_time { font-size: 1.3rem; }
 .container_80 { margin: 0 auto; }
 #menu_ul_1 { justify-content: space-around;width: 100%; }
 #menu_nav { justify-content: space-around; }
 .menu_li_1 { display: inline-block;background-color: initial; }
 .menu_li_1a { border: initial; }
 .LI_SubMenu { margin: 0;background: initial; }
 .LI_SubMenu:first-child { margin: initial; }
 .A_SubMenu_1 { color: #505050; }
 .A_SubMenu_2 { color: #505050; }
 #SVG_flecheB { color: #505050; }
 .div_news, .div_citation { margin: 20px; }
 .padding_40_30 { padding: 20px 20px 0; }
 .div_imT_AlignNo { margin-right: 0;margin-left: 0; }
 .div_imT_FloatL { float: left;margin-right: 20px; }
 .div_imT_FloatR { float: right;margin-left: 20px; }
 .div_photo { width: 220px;height: 220px;overflow: hidden; }
 .div_photo_center { margin: 0;width: auto; }
 .photo_article { width: 220px;height: 220px;border-radius: 5px; }
 .div_photo_overlay { display: flex; }
 .div_photo:hover .div_photo_overlay { visibility: visible;opacity: 1; }
 .DIV_ligneH { margin: 0 auto; }
 #SECTION_en_savoir_plus, #ASIDE_news { width: 100%; }
 .photo_news { margin: margin: 0 auto 20px;; }
 #social-sidebar { display: inline; }
 .height_100 { height: 70px; }
 }
@media screen and (min-width:1024px) {
 .display_flex_stretch { flex-direction: row; }
 .container_80 { width: 80%; }
 #MainSection { padding-top: 100px; }
 #menu_div_1 { display: block;width: calc((100% - 1200px) / 2);max-width: 350px; }
 #menu_ul_1 { display: flex;flex: 1;width: auto;align-items: center;list-style-type: none;height: auto; }
 .menu_font_1 { display: initial; }
 #menu_nav { flex-flow: row nowrap; }
 #menu_div_2 { display: block;width: calc((1200px * 0.4) + 70px);max-width: 1200px; }
 #menu_div_3 { display: flex;text-align: left;width: auto; }
 #DIV_link_7 { margin-left: 30px; }
 #label-toggle { display: none; }
 #BigMenu { width: auto;border: 1px solid #D3D3D3;border-radius: 10px;background: url("../images/autres/pattern-1.png") left top/30% repeat-y, url("../images/autres/pattern-2.png") center -80%/30% repeat-y, url("../images/autres/pattern-1.png") right +60%/30% repeat-y, #fff;padding: 20px 0;margin: 0 0 0 -150px;position: absolute; }
 .UL_SubMenu { padding: 0 50px; }
 .UL_SubMenu:nth-last-child(1) { display: initial; }
 .menu_li_1:hover #BigMenu { flex-flow: row nowrap; }
 .menu_li_1 { display: absolute;background-color: absolute; }
 .menu_li_1a { height: auto;line-height: auto; }
 .LI_SubMenu { margin: absolute; }
 .LI_SubMenu:first-child { margin: absolute; }
 #mascotte { display: block; }
 #fil_ariane { margin-top: auto; }
 .padding_80_30 { padding: 40px 0; }
 .div_photo { box-shadow: 0 0 0 8px #fff, 0 0 0 10px #F1EFEF; }
 .article70 { width: 65%; }
 .height_70 { height: 0; }
 }
@media screen and (min-width:1320px) {
 #menu_nav { justify-content: flex-start; }
 #menu_div_2 { width: calc((1200px * 0.5) + 70px); }
 .big_container_gauche { width: 65%; }
 .big_container_droit { width: 26%; }
 }
@media screen and (min-width:1600px) {
 p { padding: 0; }
 h1, h2, h3, h4 { padding: 0; }
 #logoLarge { display: block;width: 300px; }
 #menu_div_2 { width: calc((1200px * 0.65) + 70px); }
 #menu_div_3 { margin: 0 2rem 0 auto; }
 .padding_80_30 { padding: 80px 30px; }
 .padding_40_30 { padding: 40px 30px 0; }
 }