/* v65 : ISOLATION - la totalite de css.css vit sous .contenu_site (classe posee sur le
   body du SITE et sur les seules zones de contenu de l'ADMIN : canvas am_page, apercus).
   Regles volontairement laissees GLOBALES : html, :root (variables), @import, @keyframes. */
@import url("../Font/polices_locales.css"); /* v50 : polices auto-hebergees (media.datao.fr) */

html{
	color: #373737;
	font-size: calc(15px * var(--echelle-texte, 1));
	overflow-x: hidden !important;
	height: 100% !important;
	--police-site-datao: Verdana, 'DejaVu Sans', 'Bitstream Vera Sans', Geneva, sans-serif;
	font-family: var(--police-site-datao);
}

body.contenu_site{
	font-size: 1rem;
	color: #373737;
	top: 0 !important;
	font-family: var(--police-site-datao);
}

.contenu_site #back-top{
    -webkit-transform: translateZ(0);
    bottom: 80px;
    position: fixed;
    right: 15px;
    z-index : 500;
    display: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
}

.contenu_site .btn{
	width: auto;
}

.contenu_site .btn a:hover{
	text-decoration: none;
}

.contenu_site .btn-info-supp{
    font-size: 16px !important;
    font-weight: 600 !important;
    width: 200px;
	height: 45px;
    border: 5px solid #FFFFFF !important;
}
.contenu_site .css-text-shadow-null{
	text-shadow: 1px 1px 1px #000000 !important;
}

.contenu_site .zone_prec_recouvrable{
	height: 425px;
}
.contenu_site .zone_recouvrable{
	position:fixed;
	top: 80px;
	left:0px;
	height: 300px;
}

.contenu_site .curseur_pointer{
	cursor:pointer;
}
.contenu_site a{
	-webkit-transition: all ease .2s;
	-moz-transition: all ease .2s;
	-o-transition: all ease .2s;
	transition: all ease .2s;
}
.contenu_site input,.contenu_site button{
	-webkit-transition: all ease .2s;
	-moz-transition: all ease .2s;
	-o-transition: all ease .2s;
	transition: all ease .2s;
}
.contenu_site a:hover{
	text-decoration: underline;
}
.contenu_site .separation{
    border: 5px solid #EEE !important;
}
.contenu_site hr{
	border-color: #e5e5e5;
	margin: 10px 0 10px 0;
}
.contenu_site p.big-paragraph,.contenu_site .navbar-default .navbar-brand,.contenu_site .orange{
	font-weight: bold;
}
.contenu_site h2 small{
	color: #c7c7c7;
	font-size: 0.75rem;
}
.contenu_site h2.page__title2{
	font-size: 3.75rem;
	font-weight: 500;
	padding: 20px 0 10px 0;
	background: url('../Img/heading_sep.png') repeat-x left center, url('../Img/heading_sep.png') repeat-x right center;
	color: #333;
}
.contenu_site h2.page__title2 span{
	padding: 0 30px;
}

.contenu_site .page__title_sep{
	background: url('../Img/heading_sep.png') repeat-x left center, url('../Img/heading_sep.png') repeat-x right center;
}
.contenu_site h2.page__title_3{
	font-size: 3.125rem;
	font-weight: 500;
	color: #333;
}

.contenu_site h2.page__title{
	font-size: 3.125rem;
	font-weight: 500;
	padding: 20px 0 10px 0;
	background: url('../Img/heading_sep.png') repeat-x left center, url('../Img/heading_sep.png') repeat-x right center;
	color: #FFFFFF;
}
.contenu_site h2.page__title span{
	background: #fff;
	padding: 0 30px;
}
.contenu_site h3 small{
	font-size: 0.875rem;
	font-weight: 500;
}
.contenu_site h3 a{
	color: #333;
	line-height: 110%;
}
.contenu_site h3 a:hover{
	text-decoration: none;
}
.contenu_site .typo{
	margin-top: 80px;
}
.contenu_site h4 a{
	color: #333;
}
.contenu_site h4 a:hover{
	text-decoration: none;
}
.contenu_site h5 u{
	font-size: 1.25rem;
}
.contenu_site h2.with__margin{
	margin-top: 70px;
	margin-bottom: 0px;
}
.contenu_site h2.with__margin2{
	margin: 50px 0;
}
.contenu_site p.small-paragraph{
	margin-top: 10px;
	margin-bottom: 50px;
	font-size: 14px;
	font-weight: normal;
}
.contenu_site p.smaller{
	font-size: 16px;
	text-transform: none;
}
.contenu_site .relative_btn{
	position: absolute;
	left: 50%;
	margin-left: -90px;
	bottom: -35px;
}
.contenu_site .headings{
	color: #eeeeee;
}
.contenu_site .headings h1{
	color: #fffefe;
}
.contenu_site .headings p.small-paragraph{
	margin: 15px 0 35px 0;
}
.contenu_site .headings p{
	font-size: 14px;
	margin: 35px 0;
}
.contenu_site .row.title__block{
	padding: 40px 0;
}
.contenu_site .form-control,.contenu_site .form-control:focus{
	-webkit-box-shadow: none;
	box-shadow: none;
}
.contenu_site .form-control:focus{
	border-color: #ffdd3c;
}
.contenu_site .absolute__img{
	position: absolute;
	bottom: -10px;
	left: 50%;
	margin-left: -49px;
	z-index: 99;
}
.contenu_site .row.nice__title{
	background: url('../Img/line_bg.jpg') no-repeat;
	background-origin: initial;
	background-clip: initial;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 0 100%;
	padding: 60px 0 80px 0;
	font-size: 18px;
	color: #fff;
}
.contenu_site .nice__title h2{
	color: #fff;
	font-size: 3.75rem;
	line-height: 60px;
	font-weight: 500;
}
.contenu_site .row.nice__title img{
	margin: 35px auto;
}
.contenu_site .row.nice__title p{
	margin-top: 45px;
}
.contenu_site .main__middle__container .row ul,.contenu_site .main__middle__container .row ol{
	padding-left: 20px;
}
.contenu_site .main__middle__container{
	width: 100%;
}
.contenu_site .homepage{
	position: relative;
	z-index: 111;
	background: #fff;
	transition: z-index 0s .25s;
}
.contenu_site .page_de_base{
	position: relative;
	/*background: #fff;*/
}
.contenu_site .row.with__sep{
	background: url('../Img/lines.png') repeat-x left bottom;
}
.contenu_site p.big-paragraph{
	font-size: 14px;
	padding-top: 15px;
	color: #e8bd10;
}
.contenu_site .orange{
	font-size: 14px;
	text-transform: none;
	padding: 0 0 10px 0;
}
.contenu_site .black-text{
	color: #1e1e1e;
}
.contenu_site .to_top{
	margin-top: -80px !important;
}
.contenu_site .line__bg{
	width: 100%;
	margin: 0;
	padding: 75px 0;
	background: url('../Img/big_line_bg.jpg') no-repeat;
	background-origin: initial;
	background-clip: initial;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 0 100%;
}
.contenu_site .line__bg h3{
	color: #fff;
}
.contenu_site .line__bg p{
	color: #fff;
}
.contenu_site img.full-width{
	width: 100%;
}
.contenu_site .grey-info-block{
	width: 100%;
	margin: 0;
	z-index: 9;
	padding: 45px 0 40px 0;
}
.contenu_site .grey-info-block h2{
	margin: 45px 0 0 0;
	padding: 0;
}
.contenu_site .grey-info-block>.container{
	position: relative;
}
.contenu_site .grey-info-block h3{
	padding-bottom: 10px;
}
.contenu_site .grey-info-block .col-md-6 img{
	width: 100%;
	margin: 0;
	height: auto;
}
.contenu_site .grey-info-block p.small-paragraph{
	padding: 20px 0 0px 0;
}
.contenu_site .grey-info-block img{
	margin-bottom: 20px;
}
.contenu_site .icon-item{
	border-bottom: 1px solid #e7e9ea;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.contenu_site .icon-item:last-child{
	border-bottom: none;
}
.contenu_site .socialicon{
	position: relative;
	display: inline-block;
	width: 40px;
	margin-right: 5px;
	height: 40px;
}
.contenu_site .socialicon-twitter{
	background: url('../Img/social/twitter.png') no-repeat;
}
.contenu_site .socialicon-twitter:hover{
	background: url('../Img/social/twitter_a.png') no-repeat;
}
.contenu_site .socialicon-facebook{
	background: url('../Img/social/facebook.png') no-repeat;
}
.contenu_site .socialicon-facebook:hover{
	background: url('../Img/social/facebook_a.png') no-repeat;
}
.contenu_site .socialicon-instagram{
	background: url('../Img/social/instagram.png') no-repeat;
}
.contenu_site .socialicon-instagram:hover{
	background: url('../Img/social/instagram_a.png') no-repeat;
}
.contenu_site .contact-form .col-md-6{
	padding: 0 20px 0 0;
}
.contenu_site .contact-form .col-md-6:nth-child(2){
	padding: 0 0px 0 0;
}
.contenu_site .main-content h2{
	line-height: 11px;
	margin-bottom: 40px;
}
.contenu_site .copyright{
	background-color: #333;
	color: #999999;
	padding: 35px 0;
	margin: 0;
	position: relative;
	z-index: 200;
}
.contenu_site .img-fluid{
	margin: 0 auto;
}
.contenu_site .no-margin{
	position: relative;
	margin: 0;
}
.contenu_site .no_padding{
	padding: 0px 0 80px 0;
}
.contenu_site .row.nothing{
	padding-left: 0px !important;
	padding-right: 0px !important;
}

/* responsive */

@media(max-width:440px){
	.contenu_site h1 span{
		font-size: 1.25rem;
	}
    .contenu_site h2.page__title{
        font-size: 1.875rem;
    }
	.contenu_site h2.page__title_3{
		font-size: 1.875rem;
	}
    .contenu_site .nice__title h2{
        font-size: 1.875rem;
    }
}

@media(max-width:600px) {
    .contenu_site h2.page__title{
        font-size: 1.875rem;
    }
	.contenu_site h2.page__title_3{
		font-size: 1.875rem;
	}
    .contenu_site .nice__title h2{
        font-size: 1.875rem;
    }
}

@media(max-width:767px) {
	.contenu_site .page__title_sep{
		display: none;
	}
	.contenu_site .page__title_3{
		text-align: center;
	}
    .contenu_site h1.page_title{
        padding: 20px 30px;
    }
    .contenu_site h2.page__title{
        font-size: 1.875rem;
    }
	.contenu_site h2.page__title_3{
		font-size: 1.875rem;
	}
}

@media(max-width:990px) {
	.contenu_site .main__middle__container .container{
		/*padding-top: 100px !important;*/
	}
    .contenu_site h2.page__title{
        font-size: 1.875rem;
    }
	.contenu_site h2.page__title_3{
		font-size: 1.875rem;
	}
    .contenu_site .main__middle__container h3.heading.white{
        background: none;
    }
    .contenu_site .carousel-caption{
        font-size: 14px;
    }
    .contenu_site .carousel-caption h1{
        font-size: 1.25rem;
    }
}

@media(max-width:1310px) {
    .contenu_site h2.page__title{
        font-size: 2.5rem;
    }
	.contenu_site h2.page__title_3{
		font-size: 2.5rem;
	}
    .contenu_site .carousel-caption{
        font-size: 14px;
    }
    .contenu_site .carousel-caption h1{
        font-size: 1.875rem;
    }
}

@media(max-width:1600px){
    .contenu_site .carousel-caption h1{
        font-size: 2.5rem;
    }
}

.contenu_site .active{
 opacity: 1;
}

.contenu_site .carousel-inner > .carousel-item > img,.contenu_site .carousel-inner > .carousel-item > a > img{
	min-width: 100%;
	height: auto;
}
.contenu_site .one_half_pad{
	width: 44%
}
.contenu_site .one_third_pad{
	width: 27%
}
.contenu_site .one_fourth_pad{
	width: 19%
}
.contenu_site .one_fifth_pad{
	width: 14%
}
.contenu_site .one_sixth_pad{
	width: 10.5%
}
.contenu_site .two_fifth_pad{
	width: 37%
}
.contenu_site .two_third_pad{
	width: 60%
}
.contenu_site .two_fourth_pad{
	width: 43%
}
.contenu_site .two_fifth_pad{
	width: 33%
}
.contenu_site .three_fifth_pad{
	width: 58.4%
}
.contenu_site .three_fourth_pad{
	width: 74%
}
.contenu_site .four_fifth_pad{
	width: 67.2%
}
.contenu_site .five_sixth_pad{
	width: 82.67%
}
.contenu_site .one_half_pad,.contenu_site .one_third_pad,.contenu_site .two_third_pad,.contenu_site .three_fourth_pad,.contenu_site .one_fourth_pad,.contenu_site .one_fifth_pad,.contenu_site .two_fifth_pad,.contenu_site .two_fourth_pad,.contenu_site .two_fifth_pad,.contenu_site .three_fifth_pad,.contenu_site .four_fifth_pad,.contenu_site .one_sixth_pad,.contenu_site .five_sixth_pad{
	float: left;
	margin-bottom: 20px;
	margin-left: 3%;
	margin-right: 3%;
	position: relative
}
.contenu_site .one_half{
	width: 48%
}
.contenu_site .one_third{
	width: 30.5%
}
.contenu_site .one_fourth{
	width: 22%
}
.contenu_site .one_fifth{
	width: 16.8%
}
.contenu_site .one_sixth{
	width: 13.33%
}
.contenu_site .two_fifth{
	width: 37.6%
}
.contenu_site .two_third{
	width: 65.33%
}
.contenu_site .two_fourth{
	width: 48%
}
.contenu_site .three_fifth{
	width: 58.4%
}
.contenu_site .three_fourth{
	width: 74%
}
.contenu_site .four_fifth{
	width: 67.2%
}
.contenu_site .five_sixth{
	width: 82.67%
}
.contenu_site .one_half,.contenu_site .one_third,.contenu_site .two_third,.contenu_site .two_fourth,.contenu_site .three_fourth,.contenu_site .one_fourth,.contenu_site .one_fifth,.contenu_site .two_fifth,.contenu_site .three_fifth,.contenu_site .four_fifth,.contenu_site .one_sixth,.contenu_site .five_sixth{
	float: left;
	margin-bottom: 10px;
	margin-right: 4%;
	position: relative
}
.contenu_site .column-last{
	clear: right;
	margin-right: 0!important
}
.contenu_site .dc_tabs_type_2 .one_third{
	width: 29%
}
.contenu_site .clr{
	clear: both;
	margin: 0;
	padding: 0;
	width: 100%
}
.contenu_site .dc_clear{
	clear: both;
	font-size: 0px;
	line-height: 0px;
	margin: 0;
	padding: 0;
	width: 100%
}

.contenu_site .lien_noir_gris{
	color: #000000;
}

.contenu_site .lien_noir_gris:hover{
	color: #8B8B8B;
	text-decoration: underline; 
	cursor: pointer;
}

.contenu_site .lien_gris_gris{
	color: #333333;
}

.contenu_site .lien_gris_gris:hover{
	color: #8B8B8B;
	text-decoration: underline; 
	cursor: pointer;
}

.contenu_site .lien_blanc_gris{
	color: #FFFFFF;
}

.contenu_site .lien_blanc_gris:hover{
	color: #EEEEEE;
	text-decoration: underline; 
	cursor: pointer;
}

.contenu_site .fade_img{
	box-shadow: 0 2px 10px #000;
}

.contenu_site .hr_5_border{
    border: 5px solid #CCCCCC;
}

/* The old, slow way. */
.contenu_site .slow-transition{
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
  transition: box-shadow 500ms;
}

.contenu_site .slow-transition:hover{
  box-shadow: 0 0px 10px 0 #FFFFFF;
}

.contenu_site .slow-transition_inverse{
  box-shadow: 0 0px 10px 0 #FFFFFF;
  transition: box-shadow 500ms;
}

.contenu_site .slow-transition_inverse:hover{
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
}

.contenu_site .slow-transition_inverse_2{
  transition: box-shadow 500ms;
}

.contenu_site .slow-transition_inverse_2:hover{
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
}

.contenu_site .grey-info-block_sans_image{
	width: 100%;
	margin: 0;
	z-index: 9;
	padding: 45px 0 0px 0;
}
.contenu_site .grey-info-block_sans_image h2{
	color: #fff;
	margin: 45px 0 0 0;
	padding: 0;
}
.contenu_site .grey-info-block_sans_image>.container{
	position: relative;
}
.contenu_site .grey-info-block_sans_image .col-md-6 img{
	width: 100%;
	margin: 0;
	height: auto;
}
.contenu_site .grey-info-block_sans_image p.small-paragraph{
	padding: 20px 0 0px 0;
}
.contenu_site .grey-info-block_sans_image img{
	margin-bottom: 0px;
}

.contenu_site .en_savoir_plus_lien{
	background-color: #000000;
	padding-top: 10px;
	padding-bottom: 5px;
}

.contenu_site .zindex-120{
	z-index: 125 !important;
}

.contenu_site .css-text-shadow-blanc{
	text-shadow: 1px 1px 1px #FFFFFF !important;
}

.contenu_site .flip-card{
	background-color: transparent;
	width: 100%;
	height: 100%;
	border: 1px solid #f1f1f1;
	perspective: 1000px;
	color: rgb(55, 55, 55);
}

.contenu_site .flip-card-inner{
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	transition: transform 0.8s;
	transform-style: preserve-3d;
}

.contenu_site .flip-card:hover .flip-card-inner{
	transform: rotateY(180deg);
}

.contenu_site .flip-card-front{
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
	background-color: #bbb;
	color: black;
}

.contenu_site .flip-card-back{
	position: absolute;
	padding:20px; 
	top: 0px;
	width: 100%;
	height: 100%;
	overflow-y: scroll;
	-webkit-backface-visibility: hidden; /* Safari */
	backface-visibility: hidden;
	background-color: dodgerblue;
	color: white;
	transform: rotateY(180deg);
}

.contenu_site p{
	margin: 0px;
}

.contenu_site span{word-break: break-word;}

/* entire container, keeps perspective */
.contenu_site .card-container{
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	perspective: 800px;
	margin-bottom: 30px;
}
/* flip the pane when hovered */
.contenu_site .card-container:not(.manual-flip):hover div#id_div_flip_card.card,.contenu_site .card-container.hover.manual-flip div#id_div_flip_card.card{
	-webkit-transform: rotateY( 180deg );
	-moz-transform: rotateY( 180deg );
	-o-transform: rotateY( 180deg );
	transform: rotateY( 180deg );
}

.contenu_site .card-container.static:hover div#id_div_flip_card.card,.contenu_site .card-container.static.hover div#id_div_flip_card.card{
	-webkit-transform: none;
	-moz-transform: none;
	-o-transform: none;
	transform: none;
}
/* flip speed goes here */
.contenu_site div#id_div_flip_card.card{
	-webkit-transition: -webkit-transform .5s;
	-moz-transition: -moz-transform .5s;
	-o-transition: -o-transform .5s;
	transition: transform .5s;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
	position: relative;
}

/* hide back of pane during swap */
.contenu_site .front,.contenu_site .back{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	backface-visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #FFF;
	box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.14);
}

/* front pane, placed above back */
.contenu_site .front{
	z-index: 2;
}

/* back, initially hidden pane */
.contenu_site .back{
	-webkit-transform: rotateY( 180deg );
	-moz-transform: rotateY( 180deg );
	-o-transform: rotateY( 180deg );
	transform: rotateY( 180deg );
	z-index: 3;
	overflow-y: scroll;
}

.contenu_site div#id_div_flip_card.card{
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 4px;
    color: #444444;
}
.contenu_site .card-container,.contenu_site .front,.contenu_site .back{
	width: 22rem;
	height: 450px;
	border-radius: 4px;
}
.contenu_site .card .cover{
    height: 105px;
    overflow: hidden;
    border-radius: 4px 4px 0 0;
}
.contenu_site .card .cover img{
    width: 100%;
}
.contenu_site .card .user{
    border-radius: 50%;
    display: block;
    height: 200px;
    margin: -55px auto 0;
    overflow: hidden;
    width: 200px;
}
.contenu_site .card .user img{
    background: none repeat scroll 0 0 #FFFFFF;
    border: 4px solid #FFFFFF;
    width: 100%;
}

.contenu_site .card .content{
    background-color: rgba(0, 0, 0, 0);
    box-shadow: none;
    padding: 10px 20px 20px;
}
.contenu_site .card .content .main{
    min-height: 70px;
}
.contenu_site .card .back .content .main{
    height: 215px;
	text-align: left;
}
.contenu_site .card .name{
    font-size: 22px;
    line-height: 28px;
    margin: 10px 0 0;
    text-align: center;
    text-transform: capitalize;
	color: #444444;
}
.contenu_site .card .profession{
    color: #999999;
    text-align: center;
    margin-bottom: 20px;
}
.contenu_site .card .footer{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
    border-top: 1px solid #EEEEEE;
    color: #444444;
    margin: 0px 0 0;
    padding: 0px 0 0;
    text-align: center;
}
.contenu_site .card .social-links{
    font-size: 30px;
}
.contenu_site .card .social-links a{
    margin: 0 7px;
	filter: grayscale(100%);
}
.contenu_site .card .social-links a:hover{
	filter: grayscale(0%);
}
.contenu_site .card .header{
    padding: 15px 20px;
    max-height: 90px;
}

.contenu_site .btn_flip_card{
	border-radius: 0px;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .contenu_site .front,.contenu_site .back{
        -ms-backface-visibility: visible;
        backface-visibility: visible;
    }

    .contenu_site .back{
        visibility: hidden;
        -ms-transition: all 0.2s cubic-bezier(.92,.01,.83,.67);
    }
    .contenu_site .front{
        z-index: 4;
    }
    .contenu_site .card-container:not(.manual-flip):hover .back,.contenu_site .card-container.manual-flip.hover .back{
        z-index: 5;
        visibility: visible;
    }
}

.contenu_site .footer_publication{
	position: relative;
	bottom: 0px;
}

/* Shared styles */
.contenu_site .drop-shadow{
	position:relative;
	float:left;
	width:40%;
	padding:1em;
	margin:2em 10px 4em;
	background:#fff;
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.contenu_site .drop-shadow:before,.contenu_site .drop-shadow:after{
	content:"";
	position:absolute;
	z-index:-2;
}

.contenu_site .drop-shadow p{
	font-size:16px;
	font-weight:bold;
}

/* Lifted corners */

.contenu_site .lifted{
	-moz-border-radius:4px;
	border-radius:4px;
}

.contenu_site .lifted:before,.contenu_site .lifted:after{
	bottom:15px;
	left:10px;
	width:50%;
	height:20%;
	max-width:300px;
	max-height:100px;
	-webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	-moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
	-webkit-transform:rotate(-3deg);
	-moz-transform:rotate(-3deg);
	-ms-transform:rotate(-3deg);
	-o-transform:rotate(-3deg);
	transform:rotate(-3deg);
}

.contenu_site .lifted:after{
	right:10px;
	left:auto;
	-webkit-transform:rotate(3deg);
	-moz-transform:rotate(3deg);
	-ms-transform:rotate(3deg);
	-o-transform:rotate(3deg);
	transform:rotate(3deg);
}

/* Curled corners */

.contenu_site .curled{
	border:1px solid #efefef;
	-moz-border-radius:0 0 120px 120px / 0 0 6px 6px;
	border-radius:0 0 120px 120px / 0 0 6px 6px;
}

.contenu_site .curled:before,.contenu_site .curled:after{
	bottom:12px;
	left:10px;
	width:50%;
	height:55%;
	max-width:200px;
	max-height:100px;
	-webkit-box-shadow:0 8px 12px rgba(0, 0, 0, 0.5);
	-moz-box-shadow:0 8px 12px rgba(0, 0, 0, 0.5);
	box-shadow:0 8px 12px rgba(0, 0, 0, 0.5);
	-webkit-transform:skew(-8deg) rotate(-3deg);
	-moz-transform:skew(-8deg) rotate(-3deg);
	-ms-transform:skew(-8deg) rotate(-3deg);
	-o-transform:skew(-8deg) rotate(-3deg);
	transform:skew(-8deg) rotate(-3deg);
}

.contenu_site .curled:after{
	right:10px;
	left:auto;
	-webkit-transform:skew(8deg) rotate(3deg);
	-moz-transform:skew(8deg) rotate(3deg);
	-ms-transform:skew(8deg) rotate(3deg);
	-o-transform:skew(8deg) rotate(3deg);
	transform:skew(8deg) rotate(3deg);
}

/* Perspective */

.contenu_site .perspective:before{
	left:80px;
	bottom:5px;
	width:50%;
	height:35%;
	max-width:200px;
	max-height:50px;
	-webkit-box-shadow:-80px 0 8px rgba(0, 0, 0, 0.4);
	-moz-box-shadow:-80px 0 8px rgba(0, 0, 0, 0.4);
	box-shadow:-80px 0 8px rgba(0, 0, 0, 0.4);
	-webkit-transform:skew(50deg);
	-moz-transform:skew(50deg);
	-ms-transform:skew(50deg);
	-o-transform:skew(50deg);
	transform:skew(50deg);
	-webkit-transform-origin:0 100%;
	-moz-transform-origin:0 100%;
	-ms-transform-origin:0 100%;
	-o-transform-origin:0 100%;
	transform-origin:0 100%;
}

.contenu_site .perspective:after{
	display:none;
}

/* Raised shadow - no pseudo-elements needed */

.contenu_site .raised{
	-webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

/* Curved shadows */

.contenu_site .curved:before{
	top:10px;
	bottom:10px;
	left:0;
	right:50%;
	-webkit-box-shadow:0 0 15px rgba(0,0,0,0.6);
	-moz-box-shadow:0 0 15px rgba(0,0,0,0.6);
	box-shadow:0 0 15px rgba(0,0,0,0.6);
	-moz-border-radius:10px / 100px;
	border-radius:10px / 100px;
}

.contenu_site .curved-vt-2:before{
	right:0;
}

.contenu_site .curved-hz-1:before{
	top:50%;
	bottom:0;
	left:10px;
	right:10px;
	-moz-border-radius:100px / 10px;
	border-radius:100px / 10px;
}

.contenu_site .curved-hz-2:before{
	top:0;
	bottom:0;
	left:10px;
	right:10px;
	-moz-border-radius:100px / 10px;
	border-radius:100px / 10px;
}

/* Rotated box */

.contenu_site .rotated{
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	-webkit-transform:rotate(-3deg);
	-moz-transform:rotate(-3deg);
	-ms-transform:rotate(-3deg);
	-o-transform:rotate(-3deg);
	transform:rotate(-3deg);
}

.contenu_site .rotated > :first-child:before{
	content:"";
	position:absolute;
	z-index:-1;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:#fff;
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.contenu_site .rotated_null{
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	-webkit-transform:rotate(-0deg);
	-moz-transform:rotate(-0deg);
	-ms-transform:rotate(-0deg);
	-o-transform:rotate(-0deg);
	transform:rotate(-0deg);
}

.contenu_site .rotated_null > :first-child:before{
	content:"";
	position:absolute;
	z-index:-1;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:#fff;
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.contenu_site .effect4{
	position: relative;
}
.contenu_site .effect4:after{
	z-index: 10;
	position: absolute;
	content: "";
	bottom: 30px;
	right: 5px;
	left: auto;
	width: 50%;
	top: 80%;
	max-width:300px;
	background: #777;
	opacity: 0;
	-webkit-box-shadow: 0 15px 10px #777;
	-moz-box-shadow: 0 15px 10px #777;
	box-shadow: 0 15px 10px #777;
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	transform: rotate(3deg);
	-webkit-transition: all ease .5s;
	-moz-transition: all ease .5s;
	-o-transition: all ease .5s;
	transition: all ease .5s;
}
.contenu_site .effect4:hover:after{
	opacity: 1;
}

.contenu_site .grecaptcha-badge{
	z-index: 99999;
}

.contenu_site .ico-label{
    position: absolute;
    top: 38px;
    left: 25px;
    color: #bebebe;
}

.contenu_site .ico-label-password{
    position: absolute;
    top: 38px;
    left: 25px;
    color: #bebebe;
}

.contenu_site .ico-label-eye{
    position: absolute;
    top: 38px;
    right: 25px;
    color: #bebebe;
}

.contenu_site .ico-label-eye:hover{
    position: absolute;
    top: 38px;
    right: 25px;
    color: #000000;
	cursor: pointer;
}

/* Bootstrap Toggle v2.2.2 corrections for Bootsrtap 4*/
.contenu_site .toggle-off{
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
}
.contenu_site .toggle.off{
    border-color: rgba(0, 0, 0, .25);
}

.contenu_site .toggle-handle{
    background-color: white;
    border: thin rgba(0, 0, 0, .25) solid;
}

.contenu_site .ui-autocomplete{
	max-height: 300px;
	overflow-y: auto;
	overflow-x: hidden;
	max-width: 600px;
}
html .ui-autocomplete{
	height: 300px;
}

.contenu_site .fs-250{
	font-size: 250px;
}

.contenu_site .post-grid.post-grid-2{
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
}
.contenu_site .post-grid.post-grid-3{
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
}
.contenu_site .post-grid.post-grid-4{
	-webkit-column-count: 4;
	-moz-column-count: 4;
	column-count: 4;
}
.contenu_site .post-list{
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.contenu_site .post-grid{
	orphans: 1;
	widows: 1;
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	-webkit-column-gap: 1.25rem;
	-moz-column-gap: 1.25rem;
	column-gap: 1.25rem;
}
.contenu_site .post-grid .post-li{
	display: inline-block;
	margin-bottom: 1.25rem;
}

@media screen and (min-width: 200px) and (max-width: 640px){
	.contenu_site .post-grid.post-grid-2{
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
	.contenu_site .post-grid.post-grid-3{
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
	.contenu_site .post-grid.post-grid-4{
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
	}
	.contenu_site .post-grid{
		orphans: 1;
		widows: 1;
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1;
		-webkit-column-gap: 1.25rem;
		-moz-column-gap: 1.25rem;
		column-gap: 1.25rem;
	}
}

@media screen and (min-width: 641px) and (max-width: 1024px){
	.contenu_site .post-grid.post-grid-2{
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
	.contenu_site .post-grid.post-grid-3{
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
	}
	.contenu_site .post-grid.post-grid-4{
		-webkit-column-count: 3;
		-moz-column-count: 3;
		column-count: 3;
	}
	.contenu_site .post-grid{
		orphans: 1;
		widows: 1;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 1.25rem;
		-moz-column-gap: 1.25rem;
		column-gap: 1.25rem;
	}
}

.contenu_site .section-title{
    font-size: .875rem;
    line-height: 1.5;
    text-align: center;
    margin: 0 0 .9375rem;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: .5px;
    color: #2d353c;
    position: relative;
}

.contenu_site .section-title span{
    padding: 0 .625rem;
    background: #EFEFEF;
    position: relative;
}
.contenu_site .section-title span ::after,.contenu_site ::before{
    box-sizing: border-box;
}
.contenu_site .section-title:before{
	content:'';
	position:absolute;
	top:50%;
	left:0;
	right:0;
	height:2px;
	background:#2d353c;
	margin-top:-1px;
}
.contenu_site .sidebar-recent-post{
	list-style-type:none;
	margin:0;
	padding:0
}
.contenu_site .sidebar-recent-post>li{padding:.625rem 0;border-bottom:1px solid #dee2e6}.contenu_site .sidebar-recent-post>li:after,.contenu_site .sidebar-recent-post>li:before{content:'';display:table;clear:both}.contenu_site .sidebar-recent-post>li .title{margin:0;font-size:.99rem;line-height:1.5}
.contenu_site .sidebar-recent-post>li .title a{
	color:#2d353c;
}
.contenu_site .sidebar-recent-post>li .title a:hover{
	text-decoration: underline;
}
.contenu_site .sidebar-recent-post>li .date{font-size:.8125rem;line-height:1.5;color:#6c757d}

.contenu_site .grey-info-block_2{
	width: 100%;
	color: #373737;
    background-color: #EFEFEF;
}

.contenu_site .grey-info-block_3{
	width: 100%;
	color: #373737;
    background-color: #ffc107;
}

.contenu_site .class_valider{
	background-color:#28a745;
	color:#FFFFFF;
}

.contenu_site .lien_bleu{
	color: #1E8AFF;
}

.contenu_site .lien_bleu:hover{
	color: #276FBE;
	text-decoration: underline; 
	cursor: pointer;
}

.contenu_site .lien_bleu_normal{
	color: #1E8AFF;
}

.contenu_site .lien_bleu_normal:hover{
	color: #276FBE;
	cursor: pointer;
}

.contenu_site .galerie,.contenu_site .galerie div{position:relative;}.contenu_site .galerie div.item{position:relative;overflow:hidden}.contenu_site .galerie div.item div{position:relative;overflow:hidden;}.contenu_site .galerie div.item .template{outline:none;border:none;width:100%;max-width:100%}.contenu_site .galerie div.item div div{outline:none;border:none;width:100%;max-width:100%;}.contenu_site .galerie div.item p.nom{float:left;margin:0}.contenu_site .galerie div.item{float:right;margin-top:0.35em}.contenu_site .galerie div.item i{margin-right:0.3em}.contenu_site .galerie div.item div,.contenu_site .galerie div.item .card{-webkit-transition:-webkit-transform 0.4s;-moz-transition:-moz-transform 0.4s;transition:transform 0.4s}.contenu_site .galerie div.item:hover div.template,.contenu_site .galerie div.item.cs-hover div.template{-webkit-transform:translateY(-50px);-moz-transform:translateY(-50px);-ms-transform:translateY(-50px);transform:translateY(-50px)}.contenu_site .galerie div.item figcaption{position:absolute;top:0;left:0;padding:20px;background:#F3F3F3;height:75px;width:100%;top:auto;bottom:0;box-sizing:border-box;-webkit-transform:translateY(100%);-moz-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);-webkit-transition:-webkit-transform 0.4s, opacity 0.1s 0.3s;-moz-transition:-moz-transform 0.4s, opacity 0.1s 0.3s;transition:transform 0.4s, opacity 0.1s 0.3s}.contenu_site .galerie div.item:hover figcaption,.contenu_site .galerie div.item.cs-hover figcaption{opacity:1;-webkit-transform:translateY(0px);-moz-transform:translateY(0px);-ms-transform:translateY(0px);transform:translateY(0px);-webkit-transition:-webkit-transform 0.4s, opacity 0.1s;-moz-transition:-moz-transform 0.4s, opacity 0.1s;transition:transform 0.4s, opacity 0.1s}

.contenu_site .circle{
	border-radius: 50%;
	background-color: #FFFFFF;
	min-width:50px;
	width:100px;
	height:100px;
	z-index: 2;
	overflow: hidden;
}

.contenu_site .how-it-works.row .col-2{
	align-self: stretch;
}
.contenu_site .how-it-works.row .col-2::after{
	content: "";
	position: absolute;
	border-left: 3px solid #ED8D8D;
	z-index: 1;
}
.contenu_site .how-it-works.row .col-2.bottom::after{
	height: 100%;
	left: 50%;
	top: 0%;
}
.contenu_site .how-it-works.row .col-2.full::after{
	height: 100%;
	left: calc(50% - 3px);
}
.contenu_site .how-it-works.row .col-2.top::after{
	height: 50%;
	left: 50%;
	top: 0;
}

.contenu_site .timeline div{
	padding: 0;
	height: 40px;
}
.contenu_site .timeline hr{
	border-top: 3px solid #ED8D8D;
	margin: 0;
	top: 17px;
	position: relative;
}
.contenu_site .timeline .col-2{
	display: flex;
	overflow: hidden;
}
.contenu_site .timeline .corner{
	border: 3px solid #ED8D8D;
	width: 100%;
	position: relative;
	border-radius: 15px;
}
.contenu_site .timeline .top-right{
	left: 50%;
	top: -50%;
}
.contenu_site .timeline .left-bottom{
	left: -50%;
	top: calc(50% - 3px);
}
.contenu_site .timeline .top-left{
	left: -50%;
	top: -50%;
}
.contenu_site .timeline .right-bottom{
	left: 50%;
	top: calc(50% - 3px);
}

.contenu_site .eventTime{
	display: flex;
}

.contenu_site .DayDigit{
	font-size: 27px;
	font-family: "Arial Black", Gadget, sans-serif;
	color: #4C4A4A;
}

.contenu_site .Day{
	font-size: 11px;
	margin-left: 5px;
	font-weight: bold;
	margin-top: 10px;
	font-family: Arial, Helvetica, sans-serif;
	color: #4C4A4A;
}

.contenu_site .MonthYear{
	font-weight: 600;
	line-height: 10px;
	color: #9E9E9E;
	font-size: 9px;
}

/*  bhoechie tab */
.contenu_site div.bhoechie-tab-container{
  z-index: 0;
}
.contenu_site div.bhoechie-tab-menu div.list-group>a{
	text-decoration: none;
	color: #555555;
	padding:10px;
	margin:0px !important;
}
.contenu_site div.bhoechie-tab-menu div.list-group>a:first-child{
	border-top-right-radius: 0;
	-moz-border-top-right-radius: 0;
	border-top: 1px solid #DFDFDF;
}
.contenu_site div.bhoechie-tab-menu div.list-group>a:last-child{
  border-bottom-right-radius: 0;
  -moz-border-bottom-right-radius: 0;
}
.contenu_site div.bhoechie-tab-menu div.list-group>a.active{
	background-color: #D9EEF4;
	color: #0297C8;
	margin:0px !important;
	border: 1px solid transparent;
	border-top: 0px solid transparent;
}
.contenu_site div.bhoechie-tab-menu div.list-group>a.active:first-child{
	border-top: 1px solid #DFDFDF;
}
.contenu_site div.bhoechie-tab-menu div.list-group>a.active:after{
	content: '';
	position: absolute;
	left: 90%;
	top: 50%;
	margin-top: -13px;
	border-bottom: 13px solid transparent;
	border-top: 13px solid transparent;
	border-left: 10px solid #0297C8;
}

.contenu_site div.bhoechie-tab-content{
	background-color: #D9EEF4;
}

.contenu_site div.bhoechie-tab div.bhoechie-tab-content:not(.active){
  display: none;
}

.contenu_site .container_mega_menu{
	columns: 3;
	column-rule: 2px solid #FFFFFF;
	column-gap : 3rem;
}

@media screen and (max-width: 500px){
	.contenu_site .container_mega_menu{
		columns: 1;
	}
}

@media screen and (min-width: 641px) and (max-width: 1024px){
	.contenu_site .container_mega_menu{
		columns: 2;
	}
}

.contenu_site .container_mega_menu > *{
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid-column;
}

.contenu_site .container_mega_menu div.seconde_categorie>a{
	display: block;
	font-size: 13px;
	color: #555555;
	margin-top:5px;
	margin-bottom:5px;
}

.contenu_site .container_mega_menu div.seconde_categorie>a:first-child{
	display: block;
	font-weight: 600;
	font-size: 14px;
	color: #001e69;
	margin-top:0px;
	margin-bottom:5px;
}

.contenu_site .container_mega_menu div.seconde_categorie>a:last-child{
	padding-bottom:20px;
}

.contenu_site .toggle.ios,.contenu_site .toggle-on.ios,.contenu_site .toggle-off.ios{ border-radius: 20px; }
.contenu_site .toggle.ios .toggle-handle{ border-radius: 20px; }

.contenu_site .loader-wrapper{
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgb(36, 47, 63,0.7);
	display:none;
	justify-content: center;
	align-items: center;
	z-index: 15000;
}
.contenu_site .loader{
	display: inline-block;
	width: 30px;
	height: 30px;
	position: relative;
	border: 4px solid #Fff;
	animation: loader 2s infinite ease;
}
.contenu_site .loader-inner{
	vertical-align: top;
	display: inline-block;
	width: 100%;
	background-color: #fff;
	animation: loader-inner 2s infinite ease-in;
}
@keyframes loader {
	0% { transform: rotate(0deg);}
	25% { transform: rotate(180deg);}
	50% { transform: rotate(180deg);}
	75% { transform: rotate(360deg);}
	100% { transform: rotate(360deg);}
}
@keyframes loader-inner {
	0% { height: 0%;}
	25% { height: 0%;}
	50% { height: 100%;}
	75% { height: 100%;}
	100% { height: 0%;}
}

.contenu_site .ahg_1{
	border-top-left-radius: 10px;
}
.contenu_site .ahg_2{
	border-top-left-radius: 20px;
}
.contenu_site .ahg_3{
	border-top-left-radius: 30px;
}
.contenu_site .ahg_4{
	border-top-left-radius: 40px;
}
.contenu_site .ahg_5{
	border-top-left-radius: 50px;
}
.contenu_site .ahg_6{
	border-top-left-radius: 60px;
}
.contenu_site .ahd_1{
	border-top-right-radius: 10px;
}
.contenu_site .ahd_2{
	border-top-right-radius: 20px;
}
.contenu_site .ahd_3{
	border-top-right-radius: 30px;
}
.contenu_site .ahd_4{
	border-top-right-radius: 40px;
}
.contenu_site .ahd_5{
	border-top-right-radius: 50px;
}
.contenu_site .ahd_6{
	border-top-right-radius: 60px;
}
.contenu_site .abg_1{
	border-bottom-left-radius: 10px;
}
.contenu_site .abg_2{
	border-bottom-left-radius: 20px;
}
.contenu_site .abg_3{
	border-bottom-left-radius: 30px;
}
.contenu_site .abg_4{
	border-bottom-left-radius: 40px;
}
.contenu_site .abg_5{
	border-bottom-left-radius: 50px;
}
.contenu_site .abg_6{
	border-bottom-left-radius: 60px;
}
.contenu_site .abd_1{
	border-bottom-right-radius: 10px;
}
.contenu_site .abd_2{
	border-bottom-right-radius: 20px;
}
.contenu_site .abd_3{
	border-bottom-right-radius: 30px;
}
.contenu_site .abd_4{
	border-bottom-right-radius: 40px;
}
.contenu_site .abd_5{
	border-bottom-right-radius: 50px;
}
.contenu_site .abd_6{
	border-bottom-right-radius: 60px;
}

@media screen and (max-width: 767px){
	.contenu_site .ahg_1{
		border-top-left-radius: 0px;
	}
	.contenu_site .ahg_2{
		border-top-left-radius: 0px;
	}
	.contenu_site .ahg_3{
		border-top-left-radius: 0px;
	}
	.contenu_site .ahg_4{
		border-top-left-radius: 0px;
	}
	.contenu_site .ahg_5{
		border-top-left-radius: 0px;
	}
	.contenu_site .ahg_6{
		border-top-left-radius: 0px;
	}
	.contenu_site .ahd_1{
		border-top-right-radius: 0px;
	}
	.contenu_site .ahd_2{
		border-top-right-radius: 0px;
	}
	.contenu_site .ahd_3{
		border-top-right-radius: 0px;
	}
	.contenu_site .ahd_4{
		border-top-right-radius: 0px;
	}
	.contenu_site .ahd_5{
		border-top-right-radius: 0px;
	}
	.contenu_site .ahd_6{
		border-top-right-radius: 0px;
	}
	.contenu_site .abg_1{
		border-bottom-left-radius: 0px;
	}
	.contenu_site .abg_2{
		border-bottom-left-radius: 0px;
	}
	.contenu_site .abg_3{
		border-bottom-left-radius: 0px;
	}
	.contenu_site .abg_4{
		border-bottom-left-radius: 0px;
	}
	.contenu_site .abg_5{
		border-bottom-left-radius: 0px;
	}
	.contenu_site .abg_6{
		border-bottom-left-radius: 0px;
	}
	.contenu_site .abd_1{
		border-bottom-right-radius: 0px;
	}
	.contenu_site .abd_2{
		border-bottom-right-radius: 0px;
	}
	.contenu_site .abd_3{
		border-bottom-right-radius: 0px;
	}
	.contenu_site .abd_4{
		border-bottom-right-radius: 0px;
	}
	.contenu_site .abd_5{
		border-bottom-right-radius: 0px;
	}
	.contenu_site .abd_6{
		border-bottom-right-radius: 0px;
	}
	
	.contenu_site .card{
		width: 100%!important;
	}
}

.contenu_site .div_bouton_partage_facebook_like{
	transition: all 0.5s ease-out;
    bottom: 165px;
    position: fixed;
    right: -96px;
    z-index : 500;
	opacity: 0.7;
	filter: alpha(opacity=70);
}

.contenu_site .div_bouton_partage_facebook_like:hover{
	transition: all 0.5s ease-out;
	right: -51px;
	opacity: 1;
	filter: alpha(opacity=1);
}

.contenu_site .div_bouton_partage_facebook_partage{
 	transition: all 0.5s ease-out;
	bottom: 130px;
    position: fixed;
    right: -76px;
    z-index : 500;
	opacity: 0.7;
	filter: alpha(opacity=70);
}

.contenu_site .div_bouton_partage_facebook_partage:hover{
	transition: all 0.5s ease-out;
	right: -20px;
	opacity: 1;
	filter: alpha(opacity=1);
}

.contenu_site .text_souligner:hover{
	text-decoration: underline; 
}

.contenu_site .btn-file{
  position: relative;
  overflow: hidden;
}
.contenu_site .btn-file input[type=file]{
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  background: red;
  cursor: inherit;
  display: block;
}
.contenu_site input[readonly]{
  background-color: white !important;
  cursor: text !important;
}

.contenu_site .carte_affichage_4{
	position: relative;
	transition:0.5s;
}

.contenu_site .carte_affichage_4 .carte_affichage_4_titre{
	position: absolute;
	bottom:25px;
	right: 25px;
	left: 0px;
	padding:14px 29px;
	background:#fff;
	font-size: 13px;
	color:#930C15;
	text-transform: uppercase;
	z-index: 9;
	transition:0.5s;
}

.contenu_site .carte_affichage_4 .carte_affichage_4_decouvre{
	position: absolute;
	bottom:25px;
	left: 0px;
	padding:14px 29px;
	background:#141414;
	font-size: 13px;
	color:#fff;
	text-transform: uppercase;
	opacity: 0;
	z-index: 9;
	transition:0.5s;
}

.contenu_site .carte_affichage_4:hover .carte_affichage_4_decouvre{
	opacity: 1;
}

.contenu_site .carte_affichage_4:hover .carte_affichage_4_titre{
	opacity: 0;
}

.contenu_site .carte_affichage_4:hover{
	transform:translateY(-10px);
}

.contenu_site .carte_affichage_4 a{
	position: absolute;
	width:100%;
	height: 100%;
	top:0;
	left:0;
	right:0;
	z-index: 99;
}

.contenu_site .carte_affichage_4:after{
	position: absolute;
	content:' ';
	width:100%;
	height: 100%;
	left:0;
	top:0;
	display: block;
	background-image:linear-gradient(to top right, rgba(255,255,255,0),rgba(147, 12, 21, 0.7));
	background-size: cover;
	background-position: center;
	z-index: 0;
	opacity: 0;
}

.contenu_site .carte_affichage_4:hover:after{
	opacity: 1;
	transition:0.5s;
}

.contenu_site .carte_affichage_5{
	position: relative;
	transition:0.5s;
}

.contenu_site .carte_affichage_5 .carte_affichage_5_titre{
	position: absolute;
	bottom:25px;
	right: 25px;
	left: 0px;
	padding:14px 29px;
	background:#fff;
	font-size: 13px;
	color:#930C15;
	text-transform: uppercase;
	z-index: 9;
	transition:0.5s;
}

.contenu_site .carte_affichage_5 .carte_affichage_5_decouvre{
	position: absolute;
	bottom:25px;
	left: 0px;
	padding:14px 29px;
	background:#141414;
	font-size: 13px;
	color:#fff;
	text-transform: uppercase;
	opacity: 0;
	z-index: 9;
	transition:0.5s;
}

.contenu_site .carte_affichage_5:hover .carte_affichage_5_decouvre{
	opacity: 1;
}

.contenu_site .carte_affichage_5:hover .carte_affichage_5_titre{
	opacity: 0;
}

.contenu_site .carte_affichage_5:hover{
	transform:translateY(-10px);
}

.contenu_site .carte_affichage_5:after{
	position: absolute;
	content:' ';
	width:100%;
	height: 100%;
	left:0;
	top:0;
	display: block;
	/*background-image:linear-gradient(to top right, rgba(255,255,255,0),rgba(147, 12, 21, 0.7));*/
	background-size: cover;
	background-position: center;
	z-index: 0;
	opacity: 0;
}

.contenu_site .carte_affichage_5:hover:after{
	opacity: 1;
	transition:0.5s;
}

.contenu_site .carte_affichage_6{
	position: relative;
	transition:0.5s;
}

.contenu_site .carte_affichage_6:hover{
	transform:translateY(-10px);
}

.contenu_site #slider-no-overlap .noUi-handle-lower{
    right: 0;
}
.contenu_site #slider-no-overlap .noUi-handle-upper{
    right: -34px;
}

.contenu_site .opacity1{
	background-color: #000;
}
.contenu_site .opacity1 img{
	opacity: 1;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.contenu_site .opacity1:hover img{
	opacity: .5;
}

/* CONTENEUR 16:9 */

.contenu_site .youtube-cookies-consent{
    position:relative;
    overflow:hidden;
    background:#e9ecef;
}

/* FOND FLOU */

.contenu_site .youtube-cookies-bg{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;

    background:
        url('https://media.datao.fr/Img/Fond_bloquage_youtube_1.jpg')
        center center / cover no-repeat;

    filter:blur(12px);
    transform:scale(1.08);
}

.contenu_site .youtube-cookies-overlay{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;

    background:rgba(255,255,255,.15);
}

/* CARTE */

.contenu_site .youtube-cookies-card{
    position:absolute;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    width:85%;
    max-width:950px;

    padding:20px;

    border-radius:40px;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.78),
            rgba(255,255,255,.50)
        );

    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.65);

    box-shadow:
        0 25px 60px rgba(0,0,0,.12),
        0 5px 15px rgba(0,0,0,.05);

    z-index:10;
}

/* ICONE */

.contenu_site .youtube-cookies-icon{
    text-align:center;
    margin-bottom:20px;
}

.contenu_site .youtube-cookies-icon svg{
    width:120px;
    height:auto;
}

/* TITRE */

.contenu_site .youtube-cookies-title{
    margin:0;

    text-align:center;

    color:#11294b;

    font-size:3rem;
    font-weight:800;
    line-height:1.1;
}

/* TRAIT */

.contenu_site .youtube-cookies-separator{
    width:120px;
    height:5px;

    margin:25px auto;

    background:#ff4d4d;
    border-radius:50px;
}

/* TEXTE */

.contenu_site .youtube-cookies-description{
    margin-bottom:30px;

    text-align:center;

    color:#223654;

    font-size:1.4rem;
    line-height:1.5;
}

/* INFO */

.contenu_site .youtube-cookies-info-box{
    display:flex;
    align-items:center;

    padding:20px;

    border-radius:20px;

    background:rgba(255,255,255,.85);

    box-shadow:0 5px 15px rgba(0,0,0,.05);
}

.contenu_site .youtube-cookies-info-icon{
    width:55px;
    height:55px;

    min-width:55px;

    margin-right:20px;

    border-radius:50%;

    background:#2f80ff;
    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:26px;
    font-weight:700;
}

.contenu_site .youtube-cookies-info-content{
    color:#223654;
    font-size:1.1rem;
    line-height:1.6;
}

/* TABLETTE */

@media (max-width:991.98px){

    .contenu_site .youtube-cookies-card{
        width:92%;
        padding: 10px;
    }

    .contenu_site .youtube-cookies-title{
        font-size:2rem;
    }

    .contenu_site .youtube-cookies-description{
        font-size:1.1rem;
    }

    .contenu_site .youtube-cookies-info-content{
        font-size:.95rem;
    }
	.contenu_site .youtube-cookies-separator{
    margin: 10px auto;
	}
	.contenu_site .youtube-cookies-info-box{
		padding: 10px;
	}
	.contenu_site .youtube-cookies-icon{
    margin-bottom: 10px;
}	
}

/* MOBILE */

@media (max-width:767.98px){

    .contenu_site .youtube-cookies-card{
        width:95%;
        padding:1.25rem;
        border-radius:20px;
		padding: 10px;
    }

    .contenu_site .youtube-cookies-icon svg{
        width:70px;
    }

    .contenu_site .youtube-cookies-title{
        font-size:1.3rem;
    }

    .contenu_site .youtube-cookies-separator{
        width:80px;
        margin:10px auto;
    }

    .contenu_site .youtube-cookies-description{
        font-size:.85rem;
        margin-bottom:15px;
    }

    .contenu_site .youtube-cookies-info-box{
        flex-direction:column;
        text-align:center;
		padding: 5px;
    }

    .contenu_site .youtube-cookies-info-icon{
        margin-right:0;
        margin-bottom:10px;
        width:45px;
        height:45px;
        min-width:45px;
        font-size:20px;
		display: none;
    }

    .contenu_site .youtube-cookies-info-content{
        font-size:.8rem;
    }
}
/* =========================
   Coloris : le selecteur (#clr-picker) est ajoute a <body> avec z-index 1000,
   donc il passait SOUS le panneau d'options (.panel-left_option_panel, z-index 1060).
   On le remonte au-dessus des overlays/panneaux de l'admin.
   (Selecteur double pour battre coloris.css quel que soit l'ordre de chargement.)
========================= */
.contenu_site .clr-picker.clr-picker{ z-index:10000; }

/* =========================
   Champs couleur Coloris : afficher uniquement une pastille cliquable, comme dans le
   generateur de carte. Coloris enveloppe chaque input dans un .clr-field dont le bouton
   affiche la couleur courante (background:currentColor). On fait de ce wrapper une tuile,
   le bouton la remplit, et l'input texte la recouvre en opacity:0 : il reste l'element
   clique (delegation Coloris) et focusable, mais n'est plus visible.
   (Selecteurs doubles .clr-field.clr-field pour battre coloris.css, charge apres ce fichier.)
========================= */
.contenu_site .clr-field.clr-field{
	display:inline-block;
	position:relative;
	width:46px;
	height:33px;
	border:0px;
	border-radius:0px;
	overflow:hidden;
	cursor:pointer;
	vertical-align:middle;
}
.contenu_site .clr-field.clr-field button{
	position:absolute;
	left:0;
	top:0;
	right:auto;
	width:100%;
	height:100%;
	margin:0;
	border:0;
	padding:0;
	transform:none;
	border-radius:0;
}
.contenu_site .clr-field.clr-field input{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	min-width:0;
	border:0;
	padding:0;
	margin:0;
	background:none;
	cursor:pointer;
	opacity:0;
}

/* Dans un input-group (normal ou -sm), la tuile Coloris s'etire a la hauteur du groupe
   (align-self:stretch = meme hauteur que les selects/boutons voisins) au lieu de sa
   hauteur fixe ; min-height en secours quand elle est seule dans le groupe. */
.contenu_site .input-group .clr-field.clr-field{
	height:auto;
	min-height:33px;
	align-self:stretch;
}

/* =========================
   Carrousel d'articles sans jQuery (remplace Owl Carousel).
   Le conteneur defile horizontalement (scroll-snap) ; chaque enfant direct est un item
   dont la largeur est posee par la variable --largeur_item_carrousel (calculee en JS
   selon les paliers responsive : <600px:1, <1000px:3, <1200px:5, sinon N configurable).
   gap:30px = l'ancien margin:30 d'Owl. La barre de defilement est masquee.
========================= */
.contenu_site .carrousel_article_vanilla{
	display:flex;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	gap:30px;
	scrollbar-width:none;
}
.contenu_site .carrousel_article_vanilla::-webkit-scrollbar{
	display:none;
}
.contenu_site .carrousel_article_vanilla > *{
	flex:0 0 var(--largeur_item_carrousel, 100%);
	max-width:var(--largeur_item_carrousel, 100%);
	scroll-snap-align:start;
}

/* =========================
   Comparateur d'images avant/apres sans jQuery (remplace TwentyTwenty).
   L'image "apres" recouvre l'image "avant" et est rognee par clip-path selon la variable
   --pos_comparateur (posee a l'init, mise a jour au glisser de la poignee). Le glisser ne se
   fait QUE par la poignee (equivalent move_with_handle_only:true) ; les labels apparaissent
   au survol (equivalent no_overlay:false). Variante verticale : classe comparateur_vertical.
========================= */
.contenu_site .comparateur_avant_apres{
	position:relative;
	overflow:hidden;
}
.contenu_site .comparateur_avant_apres img{
	display:block;
	width:100%;
	-webkit-user-select:none;
	user-select:none;
	pointer-events:none;
}
.contenu_site .comparateur_avant_apres .comparateur_image_apres{
	position:absolute;
	top:0;
	left:0;
	clip-path:inset(0 0 0 var(--pos_comparateur,50%));
}
.contenu_site .comparateur_avant_apres.comparateur_vertical .comparateur_image_apres{
	clip-path:inset(var(--pos_comparateur,50%) 0 0 0);
}
.contenu_site .comparateur_poignee{
	position:absolute;
	top:0;
	bottom:0;
	left:var(--pos_comparateur,50%);
	width:4px;
	margin-left:-2px;
	background:#ffffff;
	box-shadow:0 0 5px rgba(0,0,0,.5);
	cursor:ew-resize;
	touch-action:none;
}
.contenu_site .comparateur_avant_apres.comparateur_vertical .comparateur_poignee{
	top:var(--pos_comparateur,50%);
	left:0;
	right:0;
	bottom:auto;
	width:auto;
	height:4px;
	margin-left:0;
	margin-top:-2px;
	cursor:ns-resize;
}
.contenu_site .comparateur_poignee:after{
	content:"\2194";
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:38px;
	height:38px;
	line-height:38px;
	text-align:center;
	border-radius:50%;
	background:#ffffff;
	color:#555555;
	font-size:17px;
	box-shadow:0 0 5px rgba(0,0,0,.4);
}
.contenu_site .comparateur_avant_apres.comparateur_vertical .comparateur_poignee:after{
	content:"\2195";
}
.contenu_site .comparateur_label{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	padding:4px 10px;
	background:rgba(0,0,0,.55);
	color:#ffffff;
	border-radius:3px;
	font-size:13px;
	opacity:0;
	transition:opacity .3s;
	pointer-events:none;
}
.contenu_site .comparateur_label_avant{ left:10px; }
.contenu_site .comparateur_label_apres{ right:10px; }
.contenu_site .comparateur_avant_apres:hover .comparateur_label{ opacity:1; }
.contenu_site .comparateur_avant_apres.comparateur_vertical .comparateur_label{
	left:50%;
	right:auto;
	transform:translateX(-50%);
	top:auto;
}
.contenu_site .comparateur_avant_apres.comparateur_vertical .comparateur_label_avant{ top:10px; }
.contenu_site .comparateur_avant_apres.comparateur_vertical .comparateur_label_apres{ bottom:10px; }

/* =========================
   Page de connexion de l'administration (index.php) : ecran scinde.
   Panneau de marque a gauche (degrade de la charte), formulaire a droite.
   Prefixe connexion_ ; aucun impact hors de la page d'identification.
========================= */
.contenu_site .connexion_scinde{
	display:flex;
	width:100%;
	height:100vh;
	min-height:560px;
	text-align:left;
}
.contenu_site .connexion_panneau{
	flex:1.15;
	position:relative;
	overflow:hidden;
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding:0 6%;
	color:#FFFFFF;
	background:linear-gradient(140deg,#023e8a 0%,#0077b6 55%,#00b4d8 100%);
}
.contenu_site .connexion_panneau:before{
	content:'';
	position:absolute;
	width:420px;
	height:420px;
	border-radius:50%;
	background:rgba(255,255,255,.07);
	top:-140px;
	right:-120px;
}
.contenu_site .connexion_panneau:after{
	content:'';
	position:absolute;
	width:300px;
	height:300px;
	border-radius:50%;
	background:rgba(255,255,255,.06);
	bottom:-100px;
	left:-80px;
}
.contenu_site .connexion_lien_site{
	position:absolute;
	top:18px;
	left:6%;
	color:#FFFFFF;
	font-size:14px;
	z-index:2;
}
.contenu_site .connexion_lien_site:hover{
	color:#FFFFFF;
	text-decoration:underline;
}
.contenu_site .connexion_panneau_contenu{
	position:relative;
	z-index:2;
}
.contenu_site .connexion_logo{
	width:58px;
	height:58px;
	border-radius:16px;
	background:rgba(255,255,255,.15);
	display:flex;
	align-items:center;
	justify-content:center;
	font-weight:800;
	font-size:26px;
	margin-bottom:22px;
}
.contenu_site .connexion_panneau_contenu h1{
	font-size: 1.75rem;
	line-height:1.25;
	margin-bottom:12px;
	font-weight:800;
	color:#FFFFFF;
}
.contenu_site .connexion_panneau_contenu p{
	font-size:14px;
	opacity:.85;
	max-width:380px;
	line-height:1.55;
}
.contenu_site .connexion_copyright{
	position:absolute;
	bottom:16px;
	left:6%;
	font-size:12px;
	color:rgba(255,255,255,.65);
	z-index:2;
}
.contenu_site .connexion_formulaire{
	flex:1;
	background:#FFFFFF;
	display:flex;
	align-items:center;
	justify-content:center;
}
.contenu_site .connexion_boite{
	width:78%;
	max-width:380px;
}
.contenu_site .connexion_boite h2{
	font-size: 1.375rem;
	margin-bottom:4px;
}
.contenu_site .connexion_sous_titre{
	color:#8a92a3;
	font-size:14px;
	margin-bottom:24px;
}
.contenu_site .connexion_champ{
	position:relative;
	margin-bottom:14px;
}
.contenu_site .connexion_icone{
	position:absolute;
	left:14px;
	top:20px; /* v186 : ancre FIXE au centre du CHAMP (portage de la correction v129 de l administration) - le 50% du conteneur descendait des que invalid-feedback l agrandissait */
	transform:translateY(-50%);
	color:#9aa2b1;
	font-size:14px;
}
.contenu_site .connexion_champ input.form-control{
	height:auto;
	padding:11px 42px 11px 40px;
	border:1.5px solid #e3e7ee;
	border-radius:10px;
	background-color:#fafbfd;
}
/* v186 : le rond d erreur de Bootstrap chevauchait l oeil du mot de passe (constat DATAO) -
   portage de la correction v129 de l administration : lisere rouge + message sous le champ
   suffisent, l icone integree est retiree. */
.contenu_site .connexion_champ input.form-control.is-invalid{
	background-image: none;
}
/* v186 : le select (civilite) partage le gabarit des champs de connexion - pas d icone a
   gauche, donc padding normal de ce cote ; la fleche du select reste geree par Bootstrap. */
.contenu_site .connexion_champ select.form-select{
	height: auto;
	padding: 11px 40px 11px 14px;
	border: 1.5px solid #e3e7ee;
	border-radius: 10px;
	background-color: #fafbfd;
}
.contenu_site .connexion_champ select.form-select:focus{
	border-color: #0077b6;
	box-shadow: 0 0 0 3px rgba(0,119,182,.12);
	background-color: #FFFFFF;
}
/* v186 : champ groupe (civilite + nom) - l input n a pas d icone a sa gauche, le retrait
   prevu pour l icone est donc annule ; le rond d erreur de Bootstrap est aussi retire du
   select (meme raison que pour les champs : lisere rouge + message suffisent). */
.contenu_site .connexion_champ .input-group input.form-control{
	padding-left: 14px;
}
.contenu_site .connexion_champ select.form-select.is-invalid{
	background-image: none;
}
.contenu_site .connexion_champ input.form-control:focus{
	border-color:#0077b6;
	box-shadow:0 0 0 3px rgba(0,119,182,.12);
	background-color:#FFFFFF;
}
.contenu_site .connexion_oeil{
	position:absolute;
	right:14px;
	top:20px; /* v186 : ancre FIXE au centre du CHAMP (portage de la correction v129 de l administration) - le 50% du conteneur descendait des que invalid-feedback l agrandissait */
	transform:translateY(-50%);
	color:#9aa2b1;
	cursor:pointer;
	font-size:14px;
}
.contenu_site .connexion_souvenir{
	margin:4px 0 18px;
	font-size:13.5px;
}
.contenu_site .connexion_bouton{
	padding:12px;
	border:none;
	border-radius:10px;
	background:linear-gradient(120deg,#0077b6,#00a5cf);
	color:#FFFFFF;
	font-weight:700;
	box-shadow:0 6px 18px rgba(0,119,182,.35);
}
.contenu_site .connexion_bouton:hover,.contenu_site .connexion_bouton:focus{
	background:linear-gradient(120deg,#02689e,#0091b8);
	color:#FFFFFF;
}
.contenu_site .connexion_liens{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	gap:6px;
	margin-top:16px;
	font-size:13px;
}
.contenu_site .connexion_liens a{
	color:#0077b6;
	cursor:pointer;
}
.contenu_site .connexion_resultat{
	min-height:67px;
	margin-top:12px;
}
@media (max-width: 850px){
	.contenu_site .connexion_scinde{
		flex-direction:column;
		height:auto;
		min-height:100vh;
	}
	.contenu_site .connexion_panneau{
		flex:none;
		padding:70px 8% 60px;
	}
	.contenu_site .connexion_formulaire{
		flex:none;
		padding:34px 0 60px;
	}
}
/* div_principale porte un padding-top:80px pour degager la navbar fixe APRES connexion ;
   l'ecran de connexion (plein ecran) le neutralise pour rester colle en haut. */
.contenu_site .connexion_scinde{
	margin-top:-80px;
}

/* Effet du panneau de connexion : le degrade "respire" lentement (deplacement du fond
   agrandi) et les deux halos flottent en douceur, a des rythmes legerement differents
   pour eviter tout effet mecanique. Purement decoratif, 100% CSS. Desactive pour les
   utilisateurs qui preferent reduire les animations (prefers-reduced-motion). */
.contenu_site .connexion_panneau{
	background-size:160% 160%;
	animation:connexion_degrade_respiration 16s ease-in-out infinite alternate;
}
.contenu_site .connexion_panneau:before{
	animation:connexion_halo_flottant 11s ease-in-out infinite alternate;
}
.contenu_site .connexion_panneau:after{
	animation:connexion_halo_flottant 14s ease-in-out infinite alternate-reverse;
}
@keyframes connexion_degrade_respiration{
	0%{background-position:0% 0%;}
	100%{background-position:100% 100%;}
}
@keyframes connexion_halo_flottant{
	0%{transform:translate(0,0) scale(1);}
	100%{transform:translate(26px,18px) scale(1.12);}
}
@media (prefers-reduced-motion: reduce){
	.contenu_site .connexion_panneau,.contenu_site .connexion_panneau:before,.contenu_site .connexion_panneau:after{
		animation:none;
	}
}

/* =========================
   Listes triables (SortableJS) : indication visuelle du glisser-deposer.
   La classe liste_triable (ou liste_triable_avec_poignee quand seule une poignee
   permet le glisser) est posee par le script d initialisation de chaque ecran.
   Curseur grab sur les elements deplacables, grabbing pendant le deplacement,
   element fantome attenue a l emplacement de depot.
========================= */
.contenu_site .liste_triable > *{
	cursor:grab;
}
.contenu_site .liste_triable_avec_poignee .header-liste-visuel{
	cursor:grab;
}
.contenu_site .sortable-chosen,.contenu_site .sortable-fallback,body.contenu_site.dragging_en_cours{
	cursor:grabbing !important;
}
.contenu_site .sortable-ghost{
	opacity:.45;
	background-color:#e8f4fb;
}
/* Equivalent du disableSelection() de jQuery UI : en mode forceFallback (evenements souris),
   le navigateur selectionnerait le texte pendant le glisser. On neutralise la selection sur
   les listes triables (comportement identique a l ancien systeme). */
.contenu_site .liste_triable,.contenu_site .liste_triable_avec_poignee{
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

/* Generateur de page : pendant un glisser SortableJS (classe posee sur body par
   initialiser_tri_generateur_page, retiree a la fin), la selection de texte est
   neutralisee partout — en mode forceFallback le navigateur etendrait sinon la
   selection sous le curseur. Hors glisser, la selection reste possible. */
body.contenu_site.tri_en_cours,body.contenu_site.tri_en_cours *{
	-webkit-user-select:none !important;
	-moz-user-select:none !important;
	-ms-user-select:none !important;
	user-select:none !important;
}

/* =========================
   Tableaux vanilla (remplace DataTables) : barre haute (taille + recherche),
   indicateurs de tri sur les en-tetes, barre basse (info + pagination),
   variante calendrier a corps defilant et en-tete colle.
========================= */
.contenu_site .tableau_vanilla_haut{
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	margin-bottom:8px;
}
.contenu_site .tableau_vanilla_haut label{
	margin-bottom:0;
	font-weight:normal;
}
.contenu_site .tableau_vanilla_bas{
	display:flex;
	justify-content:space-between;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	margin-top:8px;
}
.contenu_site .tableau_vanilla_info{
	color:#6c757d;
	font-size:13px;
}
.contenu_site .tableau_vanilla_page{
	border:1px solid #dee2e6;
	background:#FFFFFF;
	color:#373737;
	padding:4px 10px;
	margin-left:-1px;
	cursor:pointer;
	font-size:13px;
}
.contenu_site .tableau_vanilla_page:hover:not(:disabled){
	background:#e9ecef;
}
.contenu_site .tableau_vanilla_page.actif{
	background:#0077b6;
	border-color:#0077b6;
	color:#FFFFFF;
	font-weight:600;
}
.contenu_site .tableau_vanilla_page:disabled{
	color:#adb5bd;
	cursor:default;
}
.contenu_site th.tri_possible{
	cursor:pointer;
	position:relative;
	padding-right:20px !important;
	-webkit-user-select:none;
	user-select:none;
}
.contenu_site th.tri_possible:after{
	content:"\21C5";
	position:absolute;
	right:6px;
	opacity:.35;
}
.contenu_site th.tri_actif_asc:after{
	content:"\25B2";
	opacity:.9;
}
.contenu_site th.tri_actif_desc:after{
	content:"\25BC";
	opacity:.9;
}
.contenu_site .tableau_vanilla_defilant{
	max-height:65vh;
	overflow:auto;
}
.contenu_site .tableau_vanilla_defilant thead th{
	position:sticky;
	top:0;
	background:#FFFFFF;
	z-index:2;
	box-shadow:0 1px 0 #dee2e6;
}

/* =========================
   Selecteur multiple a cases a cocher (remplace bootstrap-multiselect).
   Le bouton reflete la selection ; le menu deroulant liste les options avec
   cases a cocher (+ lignes optionnelles tout selectionner / tout deselectionner).
========================= */
.contenu_site .ms_vanilla{
	position:relative;
	display:inline-block;
	text-align:left;
}
.contenu_site .ms_vanilla_bouton{
	color:#212529;
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:8px;
	width:100%;
	border:1px solid #ced4da;
	background-color:#FFFFFF;
	text-align:left;
}
.contenu_site .ms_vanilla_libelle{
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.contenu_site .ms_vanilla_bouton:hover,
.contenu_site .ms_vanilla_bouton:focus,
.contenu_site .ms_vanilla_bouton:active{
	background-color:#FFFFFF;
	color:#212529;
}
.contenu_site .ms_vanilla_caret{
	flex:none;
	opacity:.6;
}
.contenu_site .ms_vanilla_menu{
	color:#212529;
	position:absolute;
	top:100%;
	left:0;
	min-width:100%;
	z-index:1050;
	background:#FFFFFF;
	border:1px solid rgba(0,0,0,.15);
	border-radius:4px;
	box-shadow:0 6px 12px rgba(0,0,0,.175);
	overflow-y:auto;
	padding:4px 0;
	margin-top:2px;
}
.contenu_site .ms_vanilla_ligne{
	display:flex;
	align-items:center;
	gap:8px;
	padding:4px 12px;
	margin:0;
	cursor:pointer;
	font-weight:normal;
	white-space:nowrap;
}
.contenu_site .ms_vanilla_ligne:hover{
	background:#f0f4f8;
}
.contenu_site .ms_vanilla_ligne.active{
	background:#e8f4fb;
}
.contenu_site .ms_vanilla_ligne input{
	flex:none;
	margin:0;
}
.contenu_site .ms_vanilla_tout{
	font-weight:600;
}
.contenu_site .ms_vanilla_reinit{
	display:block;
	width:100%;
	border:0;
	background:none;
	text-align:left;
	padding:4px 12px;
	cursor:pointer;
	color:#0077b6;
}
.contenu_site .ms_vanilla_reinit:hover{
	background:#f0f4f8;
}
.contenu_site .ms_vanilla_separateur{
	border-top:1px solid #e9ecef;
	margin:4px 0;
}

/* =========================
   Interactions vanilla (remplace jQuery UI) : menu d autocompletion, poignee de
   redimensionnement a grille (planning), redimensionnement natif des modales,
   curseur de deplacement des modales.
========================= */
.contenu_site .autocompletion_menu{
	position:absolute;
	z-index:11000;
	background:#FFFFFF;
	border:1px solid rgba(0,0,0,.15);
	border-radius:4px;
	box-shadow:0 6px 12px rgba(0,0,0,.175);
	max-height:280px;
	overflow-y:auto;
	padding:4px 0;
}
.contenu_site .autocompletion_element{
	padding:5px 12px;
	cursor:pointer;
	white-space:nowrap;
}
.contenu_site .autocompletion_element:hover,.contenu_site .autocompletion_element.actif{
	background:#e8f4fb;
}
.contenu_site .redimensionnable_natif{
	resize:both;
	overflow:auto;
}
.contenu_site .redimensionnable_poignee{
	position:absolute;
	right:0;
	bottom:0;
	width:14px;
	height:14px;
	cursor:nwse-resize;
	background:linear-gradient(135deg, transparent 50%, rgba(0,0,0,.35) 50%);
	border-bottom-right-radius:3px;
	touch-action:none;
	z-index:5;
}
.contenu_site .deplacable_poignee{
	cursor:move;
	touch-action:none;
}

/* =========================
   Selecteur d indicatifs telephoniques a drapeaux (remplace ms-Dropdown).
========================= */
.contenu_site .indicatif_vanilla{
	position:relative;
	display:inline-block;
	vertical-align:middle;
}
.contenu_site .indicatif_vanilla_bouton{
	display:flex;
	align-items:center;
	gap:6px;
	border:1px solid #ced4da;
	border-radius:4px;
	background:#FFFFFF;
	padding:5px 8px;
	cursor:pointer;
	min-width:64px;
}
.contenu_site .indicatif_vanilla_bouton img{
	width:22px;
	height:auto;
	display:block;
}
.contenu_site .indicatif_vanilla_caret{
	opacity:.6;
	margin-left:auto;
}
.contenu_site .indicatif_vanilla_menu{
	position:absolute;
	top:100%;
	left:0;
	z-index:1050;
	background:#FFFFFF;
	border:1px solid rgba(0,0,0,.15);
	border-radius:4px;
	box-shadow:0 6px 12px rgba(0,0,0,.175);
	max-height:260px;
	overflow-y:auto;
	min-width:100%;
	padding:4px 0;
	margin-top:2px;
}
.contenu_site .indicatif_vanilla_ligne{
	display:flex;
	align-items:center;
	gap:8px;
	padding:4px 10px;
	cursor:pointer;
	white-space:nowrap;
}
.contenu_site .indicatif_vanilla_ligne:hover{
	background:#e8f4fb;
}
.contenu_site .indicatif_vanilla_ligne img{
	width:22px;
	height:auto;
}

/* ============================================================================
   v19 - Interrupteurs Oui/Non vanilla (remplace bootstrap-toggle v2.2.0).
   CSS porte du plugin (classes conservees : .toggle, .toggle-group, .toggle-on,
   .toggle-off, .toggle-handle) — les styles custom .toggle.ios / .content_overlaid
   existants continuent de s'appliquer.
   ============================================================================ */
.contenu_site .checkbox label .toggle,.contenu_site .checkbox-inline .toggle{
	margin-left:-20px;
	margin-right:5px;
}
.contenu_site .toggle{
	position:relative;
	overflow:hidden;
}
.contenu_site .toggle input[type="checkbox"]{
	display:none;
}
.contenu_site .toggle-group{
	position:absolute;
	width:200%;
	top:0;
	bottom:0;
	left:0;
	transition:left 0.35s;
	-webkit-transition:left 0.35s;
	-moz-user-select:none;
	-webkit-user-select:none;
}
.contenu_site .toggle.off .toggle-group{
	left:-100%;
}
.contenu_site .toggle-on{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:50%;
	margin:0;
	border:0;
	border-radius:0;
}
.contenu_site .toggle-off{
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	right:0;
	margin:0;
	border:0;
	border-radius:0;
}
.contenu_site .toggle-handle{
	position:relative;
	margin:0 auto;
	padding-top:0px;
	padding-bottom:0px;
	height:100%;
	width:0px;
	border-width:0 1px;
}
.contenu_site .toggle.btn{ min-width:59px; min-height:36px; }
.contenu_site .toggle-on.btn{ padding-right:24px; }
.contenu_site .toggle-off.btn{ padding-left:24px; }
.contenu_site .toggle.btn-lg{ min-width:79px; min-height:45px; }
.contenu_site .toggle-on.btn-lg{ padding-right:31px; }
.contenu_site .toggle-off.btn-lg{ padding-left:31px; }
.contenu_site .toggle-handle.btn-lg{ width:40px; }
.contenu_site .toggle.btn-sm{ min-width:50px; min-height:30px; }
.contenu_site .toggle-on.btn-sm{ padding-right:20px; }
.contenu_site .toggle-off.btn-sm{ padding-left:20px; }
.contenu_site .toggle.btn-xs{ min-width:35px; min-height:22px; }
.contenu_site .toggle-on.btn-xs{ padding-right:12px; }
.contenu_site .toggle-off.btn-xs{ padding-left:12px; }

/* ============================================================================
   v22 - Compatibilite Bootstrap 4 -> 5 : regles portees telles quelles depuis
   bootstrap.css 4.6.0 pour les composants RETIRES de BS5 que le CMS continue
   d'utiliser sans changement de markup : input-group-prepend/append,
   form-group / form-row / form-inline, bouton .close des modales.
   (embed-responsive RETIRE en v153 : contenu BDD, generateurs et markup
   convertis en .ratio natif BS5.) Extraction mecanique (media queries comprises).
   ============================================================================ */
/* BS4 donnait position:relative aux colonnes ; BS5 l'a retire. Les elements
   positionnes en absolu dans les colonnes (barres d'outils du generateur de
   page id_div_outils_insertion_*, ancres...) en dependent. Parite restauree. */
.contenu_site .col, .contenu_site [class*="col-"]{
	position: relative;
}
.contenu_site .form-group{
  margin-bottom: 1rem;
}
.contenu_site .form-inline{
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  -ms-flex-align: center;
  align-items: center;
}
.contenu_site .form-inline .form-check{
  width: 100%;
}
@media (min-width: 576px) {
.contenu_site .form-inline label{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 0;
  }
.contenu_site .form-inline .form-group{
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 0;
  }
.contenu_site .form-inline .form-control{
    display: inline-block;
    width: auto;
    vertical-align: middle;
  }
.contenu_site .form-inline .form-control-plaintext{
    display: inline-block;
  }
.contenu_site .form-inline .input-group{
    width: auto;
  }
.contenu_site .form-inline .form-check{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: auto;
    padding-left: 0;
  }
.contenu_site .form-inline .form-check-input{
    position: relative;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-top: 0;
    margin-right: 0.25rem;
    margin-left: 0;
  }
}
.contenu_site .input-group-lg > .form-control{
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: 0.3rem;
}
.contenu_site .input-group-sm > .form-control{
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0.2rem;
}
.contenu_site .alert-dismissible .close{
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  padding: 0.75rem 1.25rem;
  color: inherit;
}
.contenu_site .close{
  float: right;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
}
.contenu_site .close:hover{
  color: #000;
  text-decoration: none;
}
.contenu_site .close:not(:disabled):not(.disabled):hover,.contenu_site .close:not(:disabled):not(.disabled):focus{
  opacity: .75;
}
.contenu_site button.close{
  padding: 0;
  background-color: transparent;
  border: 0;
}
.contenu_site a.close.disabled{
  pointer-events: none;
}

/* v22 - Ajustement : le selecteur de largeur de colonne du generateur de page
   (select[id^=id_select_], ~240 exemplaires aussi dans le contenu stocke) etait
   en custom-select (BS4, padding-right 1.75rem) ; le .form-select de BS5 passe a
   2.25rem pour sa fleche, ce qui masquait le chiffre sous max-width:60px. */
.contenu_site select[id^="id_select_"].form-select{
	padding-right: 1.5rem;
	padding-left: 0.5rem;
	background-position: right 0.25rem center;
}

/* v22 - Empilements sous Bootstrap 5 (correctifs apres tests am_page/calendrier) :
   1) Les modales passent AU-DESSUS des panneaux d'options de l'admin
      (.panel-left_option_panel est a 1060 ; BS5 : modale 1055, fond 1050).
   2) Quand un menu deroulant d'une barre d'outils du generateur est ouvert, la
      ligne/colonne hote est remontee au-dessus des lignes suivantes (l'editeur
      pose des z-index inline 100-120 sur id_row_sN et id_col_N, d'ou !important). */
.contenu_site .modal{ --bs-modal-zindex: 1070; z-index: 1070 !important; }
.contenu_site .modal-backdrop{ --bs-backdrop-zindex: 1065; z-index: 1065 !important; }
.contenu_site [id^="id_row_s"]:has(.dropdown-menu.show),.contenu_site [id^="id_div_col_"]:has(.dropdown-menu.show){
	z-index: 125 !important;
}

/* v22 - Parite BS4 du reboot BS5 (correctifs cote site) :
   1) BS5 souligne les liens par defaut ; BS4 ne le faisait qu'au survol.
   2) BS5 impose scroll-behavior:smooth au :root -> les defilements animes en jQuery
      (back-top, ancres du mini menu) devenaient poussifs ; retour a l'instantane. */
.contenu_site a{ text-decoration: none; }
.contenu_site a:hover{ text-decoration: underline; }
/* ... mais BS4 exemptait les liens SANS href (navigation onclick, menus de l admin) :
   jamais soulignes, meme au survol. Parite restauree. */
.contenu_site a:not([href]):not([tabindex]),.contenu_site a:not([href]):not([tabindex]):hover{ text-decoration: none; }
:root{ scroll-behavior: auto; }

/* v22 puis v159 - Hauteur des champs de saisie : le gabarit impose de 47px (restaure a
   l epoque de la bascule BS4 -> BS5) est RETIRE sur demande DATAO. Les champs reprennent
   la hauteur naturelle de Bootstrap 5. La regle couvrait aussi .form-select, qui suit. */
/* ... sauf les variantes compactes (-sm : moteur de tableaux, barres d'outils) et le
   selecteur de largeur du generateur, qui gardent leur hauteur Bootstrap. */
.contenu_site .form-control-sm,.contenu_site .form-select-sm,.contenu_site select[id^="id_select_"].form-select{
	min-height: calc(1.5em + 0.5rem + 2px);
}

/* v24 - Logo Datao (medaillon rond) sur la page de connexion de l'administration :
   remplace la tuile lettre "D" (maquette A validee). L'ancienne classe
   .connexion_logo est conservee (aucune regle supprimee). */
.contenu_site .connexion_logo_image{
	width: 132px;
	height: 132px;
	border-radius: 50%;
	margin-bottom: 22px;
	box-shadow: 0 0 0 8px rgba(255,255,255,.14), 0 18px 40px rgba(2,30,60,.45);
}

/* v27 - Fleche des <select class="form-control"> : BS5 pose appearance:none sur
   .form-control (BS4 ne le faisait pas) et reserve sa fleche SVG a .form-select ;
   les ~640 selects historiques en form-control perdaient donc leur fleche native.
   Parite BS4 restauree : apparence native pour les select en form-control. */
.contenu_site select.form-control{
	-webkit-appearance: auto;
	-moz-appearance: auto;
	appearance: auto;
}

/* v28 - Graisse des <small> : BS4 posait font-weight:400 sur small/.small, BS5 ne
   definit plus que la taille -> dans un contexte gras (th, h6>b...), le small
   heritait du gras. Parite BS4 sur la GRAISSE uniquement (la taille garde le
   comportement BS5, decision utilisateur). */
.contenu_site small,.contenu_site .small{
	font-weight: 400;
}

/* v31 - Selects de civilite (id commencant par "civilite", 17 ids / 36 selects) :
   largeur FIXE de 100px. Depuis le de-wrapping v30 ils sont enfants directs de
   .input-group, ou la regle BS5 .input-group>.form-control{flex:1 1 auto} les
   faisait grandir — le flex-grow prime sur les width inline, d'ou l'echec des
   tentatives manuelles. flex:0 0 100px (plus specifique) reprend la main. */
.contenu_site select[id^="civilite"]{
	width: 100px;
}
.contenu_site .input-group > select[id^="civilite"]{
	flex: 0 0 100px;
	max-width: 100px;
}

/* v31 (suite) - Meme traitement pour les selects de forme juridique (2 ids / 6
   selects), et hauteur alignee sur le standard 47px pour le bouton du selecteur
   d'indicatifs a drapeaux (v13). */
.contenu_site select[id^="forme_juridique"]{
	width: 100px;
}
.contenu_site .input-group > select[id^="forme_juridique"]{
	flex: 0 0 100px;
	max-width: 100px;
}
.contenu_site .indicatif_vanilla_bouton{
	height: 47px;
}

/* ============================================================================
   v32 - Styles d'impression : BS5 a SUPPRIME le bloc @media print que BS4
   embarquait (mise en page bureau forcee via @page a3 + min-width 992px,
   navbar masquee, bordures de tableaux, sauts de page...). Bloc BS4 4.6.0
   restaure tel quel — le rendu papier redevient celui d'avant migration.
   ============================================================================ */
@media print {
  .contenu_site *,.contenu_site *::before,.contenu_site *::after{
    text-shadow: none !important;
    box-shadow: none !important;
  }
  .contenu_site a:not(.btn){
    text-decoration: underline;
  }
  .contenu_site abbr[title]::after{
    content: " (" attr(title) ")";
  }
  .contenu_site pre{
    white-space: pre-wrap !important;
  }
  .contenu_site pre,.contenu_site blockquote{
    border: 1px solid #adb5bd;
    page-break-inside: avoid;
  }
  .contenu_site thead{
    display: table-header-group;
  }
  .contenu_site tr,.contenu_site img{
    page-break-inside: avoid;
  }
  .contenu_site p,.contenu_site h2,.contenu_site h3{
    orphans: 3;
    widows: 3;
  }
  .contenu_site h2,.contenu_site h3{
    page-break-after: avoid;
  }
  @page {
    size: a3;
  }
  body.contenu_site{
    min-width: 992px !important;
  }
  .contenu_site .container{
    min-width: 992px !important;
  }
  .contenu_site .navbar{
    display: none;
  }
  .contenu_site .badge{
    border: 1px solid #000;
  }
  .contenu_site .table{
    border-collapse: collapse !important;
  }
  .contenu_site .table td,.contenu_site .table th{
    background-color: #fff !important;
  }
  .contenu_site .table-bordered th,.contenu_site .table-bordered td{
    border: 1px solid #dee2e6 !important;
  }
  .contenu_site .table-dark{
    color: inherit;
  }
  .contenu_site .table-dark th,.contenu_site .table-dark td,.contenu_site .table-dark thead th,.contenu_site .table-dark tbody + tbody{
    border-color: #dee2e6;
  }
  .contenu_site .table .thead-dark th{
    color: inherit;
    border-color: #dee2e6;
  }
}

/* v54 - Diaporamas (moteur bootstrap) : BS4 posait list-style:none sur
   .carousel-indicators, BS5 l'a retire (ses indicateurs sont des <button>
   dans un <div>). Nos indicateurs <ol>/<li> (apercu admin, generateur du
   site, HTML stocke en BDD) affichaient donc leurs numeros de liste. */
.contenu_site .carousel-indicators{
	list-style: none;
}

/* v54 - Back-top du SITE aligne sur celui de l'administration (anneau v35 de
   css_admin, valeurs identiques) : bloc scope sur la classe back_top_anneau
   portee par le markup de header.php (site). INERTE cote admin : son markup
   (index.php) n'a pas la classe et reste style par css_admin. Les pages a
   l'ancien markup (inscription*) ne sont pas touchees non plus. */
.contenu_site #back-top.back_top_anneau{
	bottom: 24px;
	right: 20px;
	display: block;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .25s ease, transform .25s ease;
	pointer-events: none;
}
.contenu_site #back-top.back_top_anneau.visible{
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.contenu_site #back-top.back_top_anneau a{
	position: relative;
	width: 52px;
	height: 52px;
	background: linear-gradient(140deg,#023e8a 0%,#0077b6 55%,#00b4d8 100%);
	color: #FFFFFF;
	font-size: 16px;
	box-shadow: 0 6px 18px rgba(0,119,182,.45);
	transition: transform .15s ease, box-shadow .15s ease;
}
.contenu_site #back-top.back_top_anneau a:hover{
	transform: translateY(-3px);
	box-shadow: 0 10px 24px rgba(0,119,182,.55);
	color: #FFFFFF;
}
.contenu_site #back-top.back_top_anneau svg{
	position: absolute;
	top: -4px;
	left: -4px;
	width: 60px;
	height: 60px;
	transform: rotate(-90deg);
	pointer-events: none;
}
.contenu_site #back-top.back_top_anneau circle{
	fill: none;
	stroke: #FFCC33;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-dasharray: 163.4;
	stroke-dashoffset: 163.4;
}

/* v56 - RANGEE ENCADREE (maquette validee 14/07) : dans une section PLEINE
   LARGEUR, une rangee portant cette classe reste a la largeur d'un .container
   (memes breakpoints Bootstrap), centree - effet bandeau plein ecran / contenu
   boxe. Sans effet dans une section normale (largeurs identiques au conteneur).
   Classe STOCKEE avec la rangee ; bascule par le bouton Largeur de l'editeur.
   MIROIR : bloc identique cote site SANS ces commentaires. */
.contenu_site .row.ap_rangee_encadree{ margin-left:auto !important; margin-right:auto !important; width:100% !important; justify-content:center; } /* v56 (14/07) : !important - une couche encore inconnue ecrasait les marges auto chez David (2e constat) ; classe opt-in, verrou assume */
@media (min-width:576px){ .contenu_site .ap_rangee_encadree{ max-width:540px; } }
@media (min-width:768px){ .contenu_site .ap_rangee_encadree{ max-width:720px; } }
@media (min-width:992px){ .contenu_site .ap_rangee_encadree{ max-width:960px; } }
@media (min-width:1200px){ .contenu_site .ap_rangee_encadree{ max-width:1140px; } }
@media (min-width:1400px){ .contenu_site .ap_rangee_encadree{ max-width:1320px; } }

.contenu_site .ap_ho_statut{ display:inline-flex; align-items:center; gap:.4rem; line-height:1.2; }
.contenu_site .ap_ho_point{ width:.55rem; height:.55rem; border-radius:50%; display:inline-block; flex:0 0 auto; }
.contenu_site .ap_ho_point_ok{ background:#1a9e57; box-shadow:0 0 0 3px rgba(26,158,87,.18); }
.contenu_site .ap_ho_point_ko{ background:#d64550; box-shadow:0 0 0 3px rgba(214,69,80,.18); }
.contenu_site .ap_ho_v1{ padding:.35rem .8rem; border-radius:999px; font-size:.85rem; }
.contenu_site .ap_ho_v1.ap_ho_ouvert{ background:#e5f5ec; color:#0f6d3d; }
.contenu_site .ap_ho_v1.ap_ho_ferme{ background:#fdeaec; color:#a11722; }
.contenu_site .ap_ho_v2{ font-size:.72rem; padding:.15rem .55rem; border-radius:999px; font-weight:700; vertical-align:middle; }
.contenu_site .ap_ho_v2.ap_ho_ouvert{ background:#1a9e57; color:#fff; }
.contenu_site .ap_ho_v2.ap_ho_ferme{ background:#d64550; color:#fff; }
.contenu_site .ap_ho_v3{ font-size:.9rem; }
.contenu_site .ap_ho_v3.ap_ho_ouvert{ color:#0f6d3d; }
.contenu_site .ap_ho_v3.ap_ho_ferme{ color:#a11722; }
.contenu_site .ap_ho_v4{ display:flex; width:100%; justify-content:center; padding:.5rem; border-radius:10px; color:#fff; margin-bottom:.5rem; }
.contenu_site .ap_ho_v4.ap_ho_ouvert{ background:#1a9e57; }
.contenu_site .ap_ho_v4.ap_ho_ferme{ background:#d64550; }
.contenu_site .ap_ho_v5{ padding:.3rem .7rem; border-radius:8px; font-size:.82rem; background:#fff; }
.contenu_site .ap_ho_v5.ap_ho_ouvert{ border:1.5px solid #1a9e57; color:#0f6d3d; }
.contenu_site .ap_ho_v5.ap_ho_ferme{ border:1.5px solid #d64550; color:#a11722; }
.contenu_site .ap_ho_v6{ padding:.35rem .8rem; border-radius:999px; font-size:.85rem; }
.contenu_site .ap_ho_v6.ap_ho_ouvert{ background:#e5f5ec; color:#0f6d3d; }
.contenu_site .ap_ho_v6.ap_ho_ferme{ background:#fdeaec; color:#a11722; }
.contenu_site .ap_ho_v2 .ap_ho_point,.contenu_site .ap_ho_v4 .ap_ho_point,.contenu_site .ap_ho_v5 .ap_ho_point{ background:currentColor; box-shadow:none; }
.contenu_site .ap_ho_icone{ font-size:.9rem; line-height:1; flex:0 0 auto; }
.contenu_site .ap_ho_jour{ display:inline-block; min-width:7.5em; font-weight:600; }
.contenu_site .ap_ho_jour_courant{ background:#fff7d6; border-radius:4px; padding:0 4px; }
.contenu_site .ap_ho_survol{ position:relative; cursor:help; display:inline-block; }
.contenu_site .ap_ho_bulle{ position:absolute; top:calc(100% + 10px); left:0; z-index:1080; width:max-content; min-width:300px; max-width:min(460px, 82vw); opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .25s ease .25s, transform .25s ease .25s, visibility 0s linear .5s; text-align:left; font-weight:400; }
.contenu_site .ap_ho_bulle::before{ content:""; position:absolute; left:0; right:0; top:-12px; height:12px; }
.contenu_site .ap_ho_survol:hover .ap_ho_bulle{ opacity:1; visibility:visible; transform:translateY(0); transition:opacity .25s ease, transform .25s ease, visibility 0s; }
.contenu_site .ap_ho_bulle_sombre{ background:#22313f; color:#eaf1f7; border-radius:10px; padding:12px 14px; font-size:.8rem; box-shadow:0 8px 24px rgba(2,20,45,.28); display:block; }
.contenu_site .ap_ho_bulle_sombre strong{ color:#fff; }
.contenu_site .ap_ho_bulle_claire{ background:#fff; color:#2c3e50; border:1px solid #dfe6ee; border-radius:12px; padding:14px 16px; font-size:.82rem; box-shadow:0 10px 30px rgba(2,20,45,.18); display:block; }
.contenu_site .ap_ho_bulle_titre{ display:block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#54687b; border-bottom:2px solid #e3ebf3; padding-bottom:5px; margin-bottom:8px; }
.contenu_site .ap_ho_depli{ display:inline-block; cursor:help; }
.contenu_site .ap_ho_depli .ap_ho_contenu_depli{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .22s ease; }
.contenu_site .ap_ho_depli:hover .ap_ho_contenu_depli{ grid-template-rows:1fr; }
.contenu_site .ap_ho_contenu_depli > div{ overflow:hidden; }
.contenu_site .homepage:has(.ap_ho_survol:hover),
.contenu_site .homepage:has(.ap_ho_survol:focus),
.contenu_site .homepage:has(.ap_ho_depli:hover),
.contenu_site .homepage:has(.ap_ho_depli:focus){ z-index:1080;  transition: z-index 0s 0s;}
.contenu_site .ap_ho_indice,
.contenu_site .ap_ho_chevron{ font-size:.9rem; line-height:1; flex:0 0 auto; opacity:.75; transition:opacity .18s ease, transform .18s ease; }
.contenu_site .ap_ho_chevron{ margin-left:-.15rem; }
.contenu_site .ap_ho_survol:hover .ap_ho_indice,
.contenu_site .ap_ho_survol:focus .ap_ho_indice,
.contenu_site .ap_ho_depli:hover .ap_ho_indice,
.contenu_site .ap_ho_depli:focus .ap_ho_indice{ opacity:1; }
.contenu_site .ap_ho_survol:hover .ap_ho_chevron,
.contenu_site .ap_ho_survol:focus .ap_ho_chevron,
.contenu_site .ap_ho_depli:hover .ap_ho_chevron,
.contenu_site .ap_ho_depli:focus .ap_ho_chevron{ opacity:1; transform:rotate(180deg); }
.contenu_site .ap_ho_survol:focus,
.contenu_site .ap_ho_depli:focus{ outline:none; }
.contenu_site .ap_ho_survol:focus .ap_ho_bulle{ opacity:1; visibility:visible; transform:translateY(0); transition:opacity .25s ease, transform .25s ease, visibility 0s; }
.contenu_site .ap_ho_depli:focus .ap_ho_contenu_depli{ grid-template-rows:1fr; }
.contenu_site .ap_ho_survol:focus-visible .ap_ho_statut,
.contenu_site .ap_ho_depli:focus-visible .ap_ho_statut{ outline:2px solid currentColor; outline-offset:3px; border-radius:4px; }

.contenu_site .lr_groupe{ display:flex; flex-wrap:wrap; gap:10px; }
.contenu_site .lr_bouton{ display:inline-flex; align-items:center; gap:.5rem; text-decoration:none; padding:.55rem 1.1rem; border-radius:8px; font-weight:600; }
.contenu_site .lr_bouton:hover{ filter:brightness(1.12); }
.contenu_site .lr_pilule{ display:inline-flex; align-items:center; gap:.5rem; border:1.5px solid; text-decoration:none; padding:.35rem .9rem; border-radius:999px; font-weight:600; }
.contenu_site .lr_pilule:hover{ filter:brightness(1.12); }
.contenu_site .lr_grille{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.contenu_site .lr_card{ display:flex; flex-direction:column; align-items:center; gap:8px; border:1px solid rgba(0,0,0,.12); border-radius:12px; padding:16px 10px; text-decoration:none; font-weight:600; text-align:center; transition:all .15s ease; box-shadow:0 2px 6px rgba(2,20,45,.05); }
.contenu_site .lr_card:hover{ box-shadow:0 6px 16px rgba(2,20,45,.12); transform:translateY(-2px); }
.contenu_site .lr_card .lr_icone{ font-size:1.5rem; }
.contenu_site .lr_fleche{ display:flex; align-items:center; gap:.5rem; text-decoration:none; padding:.5rem .2rem; border-bottom:1px solid rgba(0,0,0,.08); }
.contenu_site .lr_fleche .lr_icone_chevron{ font-size:.75rem; transition:transform .15s ease; }
.contenu_site .lr_fleche:hover .lr_icone_chevron{ transform:translateX(4px); }
.contenu_site .lr_icone{ flex:0 0 auto; }
/* v164 : l espacement entre l icone et le libelle etait de 0 a 10px selon le composant. Il est
   harmonise a .5rem. Le titre des vignettes n est pas un conteneur flex (le libelle doit pouvoir
   revenir a la ligne) : l ecart y passe par une marge, et non par un gap. */
.contenu_site .acces_rapide_titre .lr_icone{ margin-right:.5rem; }

.contenu_site .lr_ligne{ display:flex; flex-wrap:nowrap; overflow-x:auto; white-space:nowrap; align-items:center; }
.contenu_site .lr_ligne a{ display:inline-flex; align-items:center; gap:.5rem; padding:.25rem .2rem; text-decoration:none; }
/* v62 : alignement de l'objet liens rapides du menu (option [15]) */
.contenu_site .lr_align_centre{ justify-content:center; text-align:center; }
.contenu_site .lr_align_droite{ justify-content:flex-end; text-align:right; }
.contenu_site .lr_separateur{ margin:0 .65rem; opacity:.45; font-weight:400; }
.contenu_site .acces_rapide_grille{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:20px; max-width:1200px; margin:auto; justify-items:center; }
.contenu_site .acces_rapide_grille.acces_rapide_petite{ grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); }
.contenu_site .acces_rapide_grille.acces_rapide_grande{ grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); }
.contenu_site .acces_rapide_item{ display:block; width:100%; text-decoration:none; text-align:center; color:inherit; }
.contenu_site .acces_rapide_item:hover{ text-decoration:none; color:inherit; }
.contenu_site .acces_rapide_contenu{ transition:transform .3s ease; }
.contenu_site .acces_rapide_vignette{ width:150px; height:150px; margin:0 auto 15px; border-radius:50%; overflow:hidden; border:4px solid #fff; box-shadow:0 10px 30px rgba(0,0,0,.08),0 2px 6px rgba(0,0,0,.05); transition:transform .3s ease,box-shadow .3s ease; display:flex; align-items:center; justify-content:center; }
.contenu_site .acces_rapide_petite .acces_rapide_vignette{ width:110px; height:110px; }
.contenu_site .acces_rapide_grande .acces_rapide_vignette{ width:190px; height:190px; }
.contenu_site .acces_rapide_vignette img{ width:100%; height:100%; object-fit:cover; display:block; }
.contenu_site .acces_rapide_initiales{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:2.2rem; }
.contenu_site .acces_rapide_petite .acces_rapide_initiales{ font-size:1.7rem; }
.contenu_site .acces_rapide_grande .acces_rapide_initiales{ font-size:2.8rem; }
.contenu_site .acces_rapide_titre{ font-size:15px; font-weight:600; line-height:1.4; max-width:170px; margin:auto; transition:color .3s ease; }
.contenu_site .acces_rapide_item:hover .acces_rapide_titre{ color:var(--acces_rapide_accent,inherit); }
.contenu_site .acces_rapide_souleve:hover .acces_rapide_contenu{ transform:translateY(-6px); }
.contenu_site .acces_rapide_zoom:hover .acces_rapide_vignette{ transform:scale(1.05); }
.contenu_site .acces_rapide_souleve_zoom_ombre:hover .acces_rapide_contenu{ transform:translateY(-6px); }
.contenu_site .acces_rapide_souleve_zoom_ombre:hover .acces_rapide_vignette{ transform:scale(1.05); box-shadow:0 15px 35px rgba(15,76,129,.25),0 5px 15px rgba(15,76,129,.15); }
.contenu_site .acces_rapide_ombre:hover .acces_rapide_vignette{ box-shadow:0 15px 35px rgba(15,76,129,.25),0 5px 15px rgba(15,76,129,.15); }
.contenu_site .acces_rapide_bascule:hover .acces_rapide_vignette{ transform:rotate(-3deg); }

.toggle > input.interrupteur_datao[type="checkbox"]{ display: block !important; position: absolute; inset: 0; width: 100% !important; height: 100% !important; margin: 0; opacity: 0; cursor: pointer; z-index: 2; }
.toggle:has(> input.interrupteur_datao:focus-visible){ outline: 2px solid #0a4d6e; outline-offset: 2px; box-shadow: 0 0 0 3px rgba(10,77,110,.12) !important; }
.toggle[disabled]:has(> input.interrupteur_datao){ opacity: .45; }
.toggle[disabled] > input.interrupteur_datao{ cursor: default; }
.toggle:has(> input.interrupteur_datao[data-on]){ position: relative; height: 28px !important; min-height: 0 !important; min-width: 100px !important; width: auto !important; display: inline-grid !important; align-items: center; border: 0 !important; border-radius: 50rem !important; padding: 0 !important; box-shadow: none !important; background: #922b21; transition: background .22s; }
.toggle:has(> input.interrupteur_datao[data-on]):not(.off){ background: #14532d; }
.toggle:has(> input.interrupteur_datao[data-on]) .toggle-group{ position: static !important; width: auto !important; left: auto !important; top: auto !important; display: inline-grid !important; }
.toggle:has(> input.interrupteur_datao[data-on]) :is(.toggle-on, .toggle-off){ grid-area: 1 / 1; position: static !important; width: auto !important; height: 28px !important; background: transparent !important; color: #fff !important; font-size: 0.75rem !important; font-weight: 700 !important; line-height: 28px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
.toggle:has(> input.interrupteur_datao[data-on]) .toggle-on{ text-align: left; padding: 0 30px 0 14px !important; }
.toggle:has(> input.interrupteur_datao[data-on]) .toggle-off{ text-align: right; padding: 0 14px 0 30px !important; }
.toggle:has(> input.interrupteur_datao[data-on]) .toggle-handle{ display: none !important; }
.toggle:has(> input.interrupteur_datao[data-on]).off .toggle-on{ visibility: hidden; }
.toggle:has(> input.interrupteur_datao[data-on]):not(.off) .toggle-off{ visibility: hidden; }
.toggle:has(> input.interrupteur_datao[data-on])::after{ content: ''; position: absolute; top: 4px; left: 4px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: left .22s cubic-bezier(.4,.1,.3,1.25); z-index: 1; }
.toggle:has(> input.interrupteur_datao[data-on]):not(.off)::after{ left: calc(100% - 24px); }

.contenu_site .input-group-prepend,
.contenu_site .input-group-prepend .btn,
.contenu_site .input-group-prepend .btn:focus,
.contenu_site .input-group-prepend .btn + .btn,
.contenu_site .input-group-prepend .btn + .input-group-text,
.contenu_site .input-group-prepend .input-group-text + .input-group-text,
.contenu_site .input-group-prepend .input-group-text + .btn,
.contenu_site .input-group-append .btn + .btn,
.contenu_site .input-group-append .btn + .input-group-text,
.contenu_site .input-group-append .input-group-text + .input-group-text,
.contenu_site .input-group-lg > .input-group-prepend > .input-group-text,
.contenu_site .input-group-lg > .input-group-append > .input-group-text,
.contenu_site .input-group-lg > .input-group-prepend > .btn,
.contenu_site .input-group-sm > .input-group-prepend > .input-group-text,
.contenu_site .input-group-sm > .input-group-append > .input-group-text,
.contenu_site .input-group-sm > .input-group-prepend > .btn,
.contenu_site .input-group > .input-group-prepend > .btn,
.contenu_site .input-group > .input-group-prepend > .input-group-text,
.contenu_site .input-group:not(.has-validation) > .input-group-append:not(:last-child) > .btn,
.contenu_site .input-group:not(.has-validation) > .input-group-append:not(:last-child) > .input-group-text,
.contenu_site .input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .btn,
.contenu_site .input-group.has-validation > .input-group-append:nth-last-child(n + 3) > .input-group-text,
.contenu_site .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
.contenu_site .input-group > .input-group-append > .btn,
.contenu_site .input-group > .input-group-append > .input-group-text,
.contenu_site .input-group > .input-group-prepend:not(:first-child) > .btn,
.contenu_site .input-group > .input-group-prepend:not(:first-child) > .input-group-text,
.contenu_site .input-group > .input-group-prepend:first-child > .btn:not(:first-child),

/* v159 : compatibilite input-group-prepend / input-group-append (Bootstrap 4).
   Ces conteneurs ne sont plus produits par le CODE, mais ils figurent 947 fois dans le
   CONTENU STOCKE en base (saisi par les clients au fil des annees).
   `display: contents` fait disparaitre leur BOITE : leurs enfants deviennent enfants directs
   de .input-group — exactement la structure attendue par Bootstrap 5, qui applique alors ses
   propres marges et arrondis. Une seule declaration remplace ainsi dix regles de rattrapage.
   Mesure : arrondis et addons identiques au BS5 natif ; champ a 1 px pres.
   A retirer le jour ou le contenu sera converti (voir Bascule production/). */
.contenu_site .input-group-prepend,
.contenu_site .input-group-append{
	display: contents;
}


.rr_panneau{
	--rr-bouton:#922b21; --rr-fond:#02243f; --rr-texte:#ffffff; --rr-bouton-txt:#ffffff;
	--rr-case:36px; --rr-icone:14px;
	position:fixed; z-index:1020; display:flex; flex-direction:column;
	font-family:inherit; font-size:13px; line-height:1.2;
}
.rr_gauche{ left:calc(var(--rr-marge, 0px) + var(--rr-ecart-bord, 0px)); }
.rr_droite{ right:calc(var(--rr-marge, 0px) + var(--rr-ecart-bord, 0px)); }
.rr_haut{ top:calc(12px + var(--rr-ecart-vertical, 0px)); }
.rr_bas{ bottom:calc(12px + var(--rr-ecart-vertical, 0px)); }
.rr_milieu{ top:50%; transform:translateY(calc(-50% + var(--rr-ecart-vertical, 0px))); }

.rr_poignee{
	display:flex; align-items:center; justify-content:flex-start; gap:0;
	background:var(--rr-bouton); color:var(--rr-bouton-txt); border:0; cursor:pointer;
	min-width:var(--rr-case); min-height:var(--rr-case); padding:0;
	font-size:13px; font-weight:600; transition:filter .15s ease;
}

.rr_poignee > i{ width:var(--rr-case); min-height:var(--rr-case); display:inline-flex;
	align-items:center; justify-content:center; font-size:var(--rr-icone); flex-shrink:0; }

.rr_taille_petite{ --rr-case:28px; --rr-icone:12px; }
.rr_taille_normale{ --rr-case:36px; --rr-icone:14px; }
.rr_taille_grande{ --rr-case:44px; --rr-icone:18px; }
.rr_taille_tres_grande{ --rr-case:54px; --rr-icone:23px; }
.rr_poignee:hover{ filter:brightness(1.15); }
/* v160 : inline-block et non none - max-width n agit pas sur un inline, et un
   element en display:none ne peut pas etre revele par une animation de largeur. */
.rr_poignee_txt{ display:inline-block; }
.rr_liens{ display:flex; flex-direction:column; background:var(--rr-fond); overflow:hidden; }
.rr_liens a{
	display:flex; align-items:center; justify-content:flex-start; gap:0;
	min-width:var(--rr-case); min-height:var(--rr-case); padding:0;
	color:var(--rr-texte); text-decoration:none; white-space:nowrap;
	transition:background .15s ease, transform .15s ease, color .15s ease;
}
.rr_liens a i{ width:var(--rr-case); min-height:var(--rr-case); display:inline-flex;
	align-items:center; justify-content:center; font-size:var(--rr-icone); flex-shrink:0; }

.rr_liens a span{
	max-width:0; opacity:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; /* v169 : libelle long coupe en pleine lettre -> points de suspension */
	transition:max-width .3s cubic-bezier(.22,.9,.3,1), opacity .18s ease;
	transition-delay:calc((9 - var(--rr-rang, 1)) * 22ms);
}
.rr_poignee_txt{ max-width:0; opacity:0; overflow:hidden; white-space:nowrap;
	transition:max-width .3s ease, opacity .18s ease; }
.rr_deplie .rr_liens a span{
	max-width:190px; opacity:1; padding-right:12px;
	transition-delay:calc(var(--rr-rang, 1) * 38ms);
}
.rr_deplie .rr_poignee_txt{ max-width:190px; opacity:1; padding-right:12px; }

.rr_liens{ transition:background .2s ease; }
.rr_liens a{ will-change:transform; }

@media (prefers-reduced-motion: reduce){
	.rr_liens a span, .rr_poignee_txt, .rr_liens a, .rr_poignee{ transition:none !important; }
}

.rr_liens a:hover{ background:rgba(255,255,255,.16); }
.rr_gauche .rr_liens a:hover{ transform:translateX(2px); }
.rr_liens a:nth-child(1){ --rr-rang:1; } .rr_liens a:nth-child(2){ --rr-rang:2; }
.rr_liens a:nth-child(3){ --rr-rang:3; } .rr_liens a:nth-child(4){ --rr-rang:4; }
.rr_liens a:nth-child(5){ --rr-rang:5; } .rr_liens a:nth-child(6){ --rr-rang:6; }
.rr_liens a:nth-child(7){ --rr-rang:7; } .rr_liens a:nth-child(8){ --rr-rang:8; }
.rr_droite .rr_liens a:hover{ transform:translateX(-2px); }

.rr_poignee:focus-visible, .rr_liens a:focus-visible{ outline:2px solid #fff; outline-offset:-3px; }

.rr_style_barre .rr_poignee{ border-radius:0 8px 0 0; }
.rr_style_barre .rr_liens{ border-radius:0 0 8px 0; }

.rr_style_onglet{ flex-direction:row; align-items:stretch; }
.rr_style_onglet .rr_poignee{ writing-mode:vertical-rl; padding:14px 8px; border-radius:0 10px 10px 0; order:2; }
.rr_style_onglet .rr_liens{ border-radius:0 0 0 0; }

.rr_style_pilule:hover{ box-shadow:0 9px 24px rgba(2,36,63,.36); }
.rr_style_pilule{ --rr-marge:14px; border-radius:26px; overflow:hidden; box-shadow:0 6px 18px rgba(2,36,63,.28); }
.rr_style_pilule .rr_poignee{ border-radius:26px 26px 0 0; }
.rr_style_pilule .rr_liens{ border-radius:0 0 26px 26px; padding:4px 0; }

.rr_style_chapelet{ --rr-marge:12px; gap:7px; background:none; }
.rr_style_chapelet .rr_poignee{ border-radius:50%; padding:0; align-self:flex-start; }
.rr_style_chapelet .rr_liens{ background:none; gap:7px; overflow:visible; }
.rr_style_chapelet .rr_liens a{ background:var(--rr-fond); border-radius:50px; align-self:flex-start; }
.rr_style_chapelet .rr_liens a:hover{ background:var(--rr-bouton); }

.rr_style_cartes{ --rr-marge:12px; gap:6px; }
.rr_style_cartes .rr_poignee{ border-radius:8px; box-shadow:0 2px 6px rgba(2,36,63,.25); }
.rr_style_cartes .rr_liens{ background:none; gap:6px; overflow:visible; }
.rr_style_cartes .rr_liens a{ background:var(--rr-fond); border-radius:8px; align-self:flex-start;
	box-shadow:0 2px 6px rgba(2,36,63,.22); }
.rr_style_cartes .rr_liens a:hover{ box-shadow:0 4px 11px rgba(2,36,63,.34); }

.rr_style_rail{ top:0; bottom:0; transform:none; justify-content:center; background:var(--rr-fond); }
.rr_style_rail .rr_poignee{ position:absolute; top:0; left:0; right:0; }
.rr_style_rail .rr_liens{ background:none; }

.rr_style_lisere .rr_poignee{ border-radius:0 8px 0 0; }
.rr_style_lisere .rr_liens{ border-radius:0 0 8px 0; }
.rr_style_lisere .rr_liens a{ border-left:3px solid var(--rr-bouton); }
.rr_style_lisere .rr_liens a + a{ border-top:1px solid rgba(255,255,255,.12); }

.rr_style_biseau{ clip-path:polygon(0 0, 100% 0, calc(100% - 12px) 100%, 0 100%); }
.rr_style_biseau .rr_liens a{ padding-right:18px; }

.rr_style_ruban{ --rr-marge:10px; filter:drop-shadow(0 7px 12px rgba(2,36,63,.35)); transition:filter .2s ease; }
.rr_style_ruban:hover{ filter:drop-shadow(0 10px 18px rgba(2,36,63,.45)); }
.rr_style_ruban .rr_poignee{ border-radius:6px 6px 0 0; }
.rr_style_ruban .rr_liens{ clip-path:polygon(0 0, 100% 0, 100% calc(100% - 10px), 50% 100%, 0 calc(100% - 10px)); padding-bottom:12px; }

.rr_style_contour{ --rr-marge:10px; border:2px solid var(--rr-bouton); border-radius:10px; overflow:hidden; background:#fff; }
.rr_style_contour .rr_liens{ background:#fff; }
.rr_style_contour .rr_liens a{ color:var(--rr-fond); }
.rr_style_contour .rr_liens a + a{ border-top:1px solid #e3eaf1; }
.rr_style_contour .rr_liens a:hover{ background:rgba(2,36,63,.08); color:var(--rr-bouton); }

.rr_style_creux{ border-radius:0 12px 12px 0; overflow:hidden; }
.rr_style_creux .rr_liens a{ box-shadow:inset 0 1px 3px rgba(0,0,0,.45); margin:3px 5px; border-radius:6px; }

.rr_style_compact{ font-size:11px; }
.rr_style_compact .rr_poignee{ font-size:11px; }
.rr_style_compact .rr_deplie .rr_liens a span{ padding-right:8px; }
.rr_style_compact .rr_liens a i{ font-size:calc(var(--rr-icone) - 2px); width:var(--rr-case); }

.rr_style_etiquettes .rr_poignee{ border-radius:0 8px 0 0; }
.rr_style_etiquettes .rr_liens{ border-radius:0 0 8px 0; overflow:visible; }
.rr_style_etiquettes .rr_liens a{ position:relative; }
.rr_style_etiquettes .rr_liens a span{ max-width:190px !important; position:absolute; left:100%;
	background:var(--rr-bouton); color:#fff; padding:6px 10px; border-radius:0 6px 6px 0;
	transform:translateX(-8px); opacity:0; pointer-events:none; transition:all .2s ease; }
.rr_style_etiquettes .rr_liens a:hover span{ transform:translateX(0); opacity:1; }

.rr_droite.rr_style_barre .rr_poignee{ border-radius:8px 0 0 0; }
.rr_droite.rr_style_barre .rr_liens{ border-radius:0 0 0 8px; }

.rr_droite.rr_style_onglet .rr_poignee{ border-radius:10px 0 0 10px; order:0; }

.rr_droite.rr_style_lisere .rr_poignee{ border-radius:8px 0 0 0; }
.rr_droite.rr_style_lisere .rr_liens{ border-radius:0 0 0 8px; }
.rr_droite.rr_style_lisere .rr_liens a{ border-left:0; border-right:3px solid var(--rr-bouton); }

.rr_droite.rr_style_biseau{ clip-path:polygon(0 0, 100% 0, 100% 100%, 12px 100%); }
.rr_droite.rr_style_biseau .rr_liens a{ padding-right:0; padding-left:14px; }

.rr_droite.rr_style_creux{ border-radius:12px 0 0 12px; }

.rr_droite.rr_style_etiquettes .rr_poignee{ border-radius:8px 0 0 0; }
.rr_droite.rr_style_etiquettes .rr_liens{ border-radius:0 0 0 8px; }
.rr_droite.rr_style_etiquettes .rr_liens a span{ left:auto; right:100%;
	border-radius:6px 0 0 6px; transform:translateX(8px); }
.rr_droite.rr_style_etiquettes .rr_liens a:hover span{ transform:translateX(0); }

.rr_panneau{ max-height:calc(100vh - 24px); }
.rr_liens{ overflow-y:auto; }

@media (max-width: 767.98px){ .rr_panneau.rr_sans_telephone{ display: none; } }
@media (min-width: 768px) and (max-width: 991.98px){ .rr_panneau.rr_sans_tablette{ display: none; } }
@media (min-width: 992px){ .rr_panneau.rr_sans_ordinateur{ display: none; } }

.rr_liens a, .rr_liens a:hover, .rr_liens a:focus, .rr_poignee:hover{ text-decoration: none; }

/* ---- v160 : deux classes etroites, une seule propriete chacune ----
   list-style et overflow ont des effets de bord : elles ne sont jamais melangees a du
   cosmetique, pour ne pas detourner une regle existante. ---- */
.sans_puce_datao{ list-style: none; }
.defilement_bloque_datao{ overflow: hidden; }

/* v163 - L'alignement suit jusqu'au CONTENU des liens.
   .lr_fleche et .lr_card sont en display:flex : le text-align du conteneur n'y agit plus, et
   les classes lr_align_* ne portaient que sur la grille. Mesure : conteneur centre, lien en
   justify-content:normal - icone et libelle restaient a gauche.
   Le defaut (gauche) n'est pas touche : seules centre et droite sont declarees. */
.contenu_site .lr_align_centre .lr_fleche{ justify-content: center; }
.contenu_site .lr_align_droite .lr_fleche{ justify-content: flex-end; }
/* En « cards », la grille auto-fill cree plus de colonnes que de cartes et occupe toute
   la largeur : justify-content n'y decale rien de visible. On la passe en flex quand un
   alignement est demande - elle se limite alors aux cartes reelles. Sans alignement, elle
   reste en grid : les rendus existants ne bougent pas. */
.contenu_site .lr_grille.lr_align_centre,
.contenu_site .lr_grille.lr_align_droite{ display: flex; flex-wrap: wrap; }
/* v164 : le style « acces rapide » a son propre conteneur - meme traitement, sinon sa grille
   auto-fill occupe toute la largeur et l alignement ne se voit pas. */
.contenu_site .acces_rapide_grille.lr_align_centre,
.contenu_site .acces_rapide_grille.lr_align_droite{ display: flex; flex-wrap: wrap; }
.contenu_site .acces_rapide_grille.lr_align_centre{ justify-content: center; }
.contenu_site .acces_rapide_grille.lr_align_droite{ justify-content: flex-end; }
/* Les 3 tailles etaient portees par grid-template-columns (110/150/190 px) - le passage en
   flex les annule. On les reproduit en flex-basis, sinon l alignement ecrase le reglage. */
.contenu_site .acces_rapide_grille.lr_align_centre > *,
.contenu_site .acces_rapide_grille.lr_align_droite > *{ flex: 0 0 150px; }
.contenu_site .acces_rapide_grille.acces_rapide_petite.lr_align_centre > *,
.contenu_site .acces_rapide_grille.acces_rapide_petite.lr_align_droite > *{ flex: 0 0 110px; }
.contenu_site .acces_rapide_grille.acces_rapide_grande.lr_align_centre > *,
.contenu_site .acces_rapide_grille.acces_rapide_grande.lr_align_droite > *{ flex: 0 0 190px; }
.contenu_site .lr_grille.lr_align_centre{ justify-content: center; }
.contenu_site .lr_grille.lr_align_droite{ justify-content: flex-end; }
/* En flex, chaque carte prendrait sa largeur naturelle (mesure : 109 a 185 px) alors que la
   grille les egalisait via minmax(150px, 1fr). On reprend cette base de 150 px pour que
   l alignement ne change QUE la position des cartes, jamais leur taille. */
.contenu_site .lr_grille.lr_align_centre > *,
.contenu_site .lr_grille.lr_align_droite > *{ flex: 0 0 150px; }

/* v170 : composant gf_info porte au site - les erreurs emanant d'un script PHP s'affichent dans
   l'encart de la charte (decision DATAO 30/07/2026). Valeurs resolues depuis css_admin (le site
   n'a pas les variables du theme admin) ; contrastes AAA calcules (texte #243044 sur #fbeceb
   12,5:1 ; gras/icone #922b21 7,6:1). Classes dormantes tant qu'aucun script ne les emet. */
.gf_info_datao{ text-align:left; background:#f6f9fc; border-left:4px solid #0a4d6e; border-radius:10px; padding:11px 14px; font-size:0.8125rem; color:#243044; margin-bottom:16px; position:relative; }
.gf_info_datao > i{ color:#0a4d6e; margin-right:7px; font-size:1.25rem; }
.gf_info_datao b{ color:#02243f; }
.gf_info_datao p{ display:inline; margin:0; }
.gf_info_grave_datao{ border-left-color:#922b21; background:#fbeceb; }
.gf_info_grave_datao > i{ color:#922b21; }
.gf_info_grave_datao b{ color:#922b21; }
.gf_info_attention_datao{ border-left-color:#f5b400; background:#fff6e0; }
.gf_info_attention_datao > i{ color:#d4a017; }
.gf_info_attention_datao b{ color:#02243f; }
.gf_info_succes_datao{ border-left-color:#14532d; background:#e7f2ec; }
.gf_info_succes_datao > i{ color:#14532d; }
.gf_info_succes_datao b{ color:#14532d; }

/* v174 : etat des manifestations (Annulee / Passee) - palette NEUTRE multi-clients (aucune
   couleur de charte client imposee) ; remplace l'incrustation img_annuler.png. Contrastes
   AAA calcules : blanc/#9c231b = 7,3:1 ; blanc/#454d57 = 7,9:1 ; #4a525c/#f4f5f7 = 7,2:1. */
.calque_etat_manifestation_datao{ position:absolute; inset:0; overflow:hidden; pointer-events:none; border-radius:inherit; z-index:5; }
.ruban_etat_manifestation_datao{ position:absolute; top:22px; right:-44px; transform:rotate(35deg); width:190px; text-align:center; padding:6px 0; font-weight:700; font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase; color:#fff; box-shadow:0 2px 6px rgba(0,0,0,0.25); }
.vignette_manifestation_datao{ border-radius:inherit; border-bottom-left-radius:0; border-bottom-right-radius:0; overflow:hidden; }
.vignette_manifestation_datao > img{ border-radius:0; }
.ruban_etat_manifestation_annulee_datao{ background:#9c231b; }
.ruban_etat_manifestation_passee_datao{ background:#454d57; }
.conteneur_etat_manifestation_datao{ position:relative; display:block; }
.pastille_etat_manifestation_datao{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) rotate(-12deg); padding:4px 10px; border-radius:999px; font-weight:700; font-size:0.68rem; letter-spacing:0.05em; text-transform:uppercase; color:#fff; box-shadow:0 2px 6px rgba(0,0,0,0.3); white-space:nowrap; z-index:5; }
.pastille_etat_manifestation_annulee_datao{ background:#9c231b; }
.pastille_etat_manifestation_passee_datao{ background:#454d57; }
.fond_date_manifestation_datao{ background:linear-gradient(135deg,#f4f5f7,#e3e6ea); border-radius:inherit; border-bottom-left-radius:0; border-bottom-right-radius:0; }
.fond_date_manifestation_datao .fdm_contenu_datao{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#4a525c; }
.fdm_jour_datao{ font-size:2.6rem; font-weight:700; line-height:1; }
.fdm_mois_datao{ font-size:0.95rem; font-weight:600; text-transform:uppercase; letter-spacing:0.12em; }

/* v186 : interrupteur « Se souvenir de moi » au gabarit de la page de connexion de
   l administration (index.php), mesure faite sur l ecran reel : libelle a GAUCHE,
   interrupteur a DROITE (order), 42x20px, piste #4d5761 au repos et #14532d une fois
   activee, pastille BLANCHE dans les deux etats (Bootstrap la met noire semi-transparente
   au repos : invisible sur une piste foncee - c est le « toggle bizarre » constate).
   Couleurs ecrites en dur : le site internet ne connait pas les tokens Vision. */
.contenu_site .connexion_souvenir{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding-left: 0;
}
.contenu_site .connexion_souvenir .form-check-label{
	order: 1;
}
.contenu_site .connexion_souvenir .form-switch .form-check-input.interrupteur_datao,
.contenu_site .connexion_souvenir .form-check-input.interrupteur_datao{
	order: 2;
	width: 42px;
	height: 20px;
	margin: 0;
	float: none;
	flex: 0 0 auto;
	background-color: #4d5761;
	border: 0;
	box-shadow: none;
	--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
	transition: background-color .2s;
}
.contenu_site .connexion_souvenir .form-check-input.interrupteur_datao:checked{
	background-color: #14532d;
	border: 0;
}
.contenu_site .connexion_souvenir .form-check-input.interrupteur_datao:focus{
	border: 0;
	box-shadow: 0 0 0 3px rgba(10,77,110,.12);
	outline: 2px solid #0a4d6e;
	outline-offset: 2px;
}