@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');

*{
padding:0px;
border:0px;
margin:0px;
}

body{
font-family: 'Poppins', sans-serif;
font-size:15px;
line-height:23px;
color:#495057;
background-color:#f8f8fb;

}


/* *********************** PAGE LOGIN *********************** */

#login{
text-align:center;
}

#login h1{
	margin: 0 0 11px;
}

#login input[type="submit"]{
	background-color: #eb882d;
}

#login .c1{
text-align:left;
display:inline-block;
background-color:white;
padding:35px;
margin-top:120px;
border-radius: 4px;
margin-left:auto;
margin-right:auto;
border:1px solid #e0e0ec;
}


#login .erreur{
color:red;
margin-bottom:12px;
}


/* *********************** COMMON *********************** */

h1{ /* titre des pages */
display:block;
text-transform: uppercase;
font-weight: 600;
font-size: 22px;
color:#495057;
line-height:30px;
margin-bottom: 50px;
}


h2{ /* sous-titre (page produit) */
text-transform: uppercase;
margin-bottom: 47px;
font-size: 15px;
width: 100%;
display: inline-block;
border-bottom: 1px solid #eaeaea;
margin-top:30px;
}

a.button_back{
float:right;
display:block;
margin-top:30px;
}

#wrapper a.button_add{
float:right;
margin-bottom:30px;
}

#wrapper p{
}

#wrapper a{
color:#495057;
text-decoration:none;
}

#wrapper a:hover{
color:#2980b9;
text-decoration:underline;
}


/* *********************** ANIMATION DES FILTRES *********************** */
.is-animated {
  animation: .9s zoom-in;
}

@keyframes zoom-in {
  0% {
   transform: scale(.1);
  } 
  100% {
    transform: none;
  }
}

/* *********************** MENU *********************** */
#menu{
width:100%;
min-height:80px;
background-color:#eb882d;
transition: top 0.8s;
}

#menu .c1{
width:98%;
margin:auto;
}

#menu .c1 .infos{
display:inline-block;
vertical-align:top;
padding-top:14px;
}

#menu .c1 .infos .titre{
line-height:25px;
font-size:21px;
color:white;
text-transform:uppercase;
font-weight:600;
}

#menu .c1 .infos .titre a{
color:white;
text-decoration:none;
transition:all 0.3s;
}

#menu .c1 .infos .titre a:hover{
text-decoration:underline;
}

#menu p.mise_en_ligne{
display:block;
width:100%;
vertical-align:top;
color:white;
font-size:12px;
}

#menu #log{
display:block;
color:white;
}

#menu #log a{
color:white;
font-size:13px;
text-decoration:none;
}

#menu #log a:after{
content: url('images/logout_icon.png');
}

#menu #log a:hover{
text-decoration:underline;
opacity:1;
}

#menu .links{
display:inline-block;
vertical-align:top;
padding-top: 26px;
float: right;
font-size:0px;
}

#menu .links a{
display:inline-block;
padding-left:15px;
padding-right:15px;
line-height:30px;
color:white;
font-size:15px;
text-decoration:none;
transition: all 0.4s;
border-radius: 5px;
}

#menu .links a.menu_admin{
color:#f1c40f;
}

#menu .links a:hover{
background-color:#a16833;
opacity:1;
}

#menu .links a.selected{
background-color:#a16833;
opacity:1;
}



/* *********************** WRAPPER / COMMON *********************** */
#wrapper{
width:95%;
padding-top:90px;
margin:auto;
text-align:center;
position: relative;
}

#wrapper .content{
display:inline-block;
vertical-align:top;
background-color:white;
border-radius:15px;
padding:32px 62px;
border:1px solid #e0e0ec;
text-align:left;
}

#wrapper .content .image_opengraph{
width: 100%;
max-width: 300px;
margin: 0 auto 50px;
text-align: center;
position: relative;
}

#wrapper .content .image_opengraph img{
width: 100%;
height: auto;
}

#wrapper .content .image_opengraph a{
position: absolute;
right: 10px;
top: 10px;
color: white;
background-color: #cc2e31;
font-size: 13px;
padding: 3px 10px;
}

#wrapper .content img{
max-width: 600px;
}


/* *********************** PAGES *********************** */

/* **** PAGES FIXES MODIFIER **** */
#pages_fixes_modifier img.image_opengraph{
	width:178px;
}

/* *** NEWS LISTE **** */

#news_liste p.compteur{
text-align:right;
font-size:14px;
opacity:0.65;
clear:both;
}

#news_liste .recherche p{
display:inline-block;
width:165px;
}

#news_liste select.search_langues{
background-image:url('images/filter.png');
background-repeat:no-repeat;
background-position:8px 10px;
padding-left:35px;
}

/* *** NEWS AJOUTER - MODIFIER **** */

#news_ajouter p.last_update{
text-align:right;
opacity:0.65;
font-size:13px;
}


/* **** DÉTAILS PHOTOS (NEWS + PHOTOS RÉALISATIONS + PHOTOS PRODUITS) **** */


#photos_details .filter{
width:100%;
margin-top:45px;
clear:both;
text-align:center;
margin-bottom:50px;
}


#photos_details .filter a{
display: inline-block;
vertical-align: top;
vertical-align: top;
font-size: 13px;
font-weight: 400;
margin: 10px 15px;
border: 1px solid #150c13;
border-radius: 40px;
padding: 5px 12px 5px 28px;
background-image: url('images/btn_down_black.png');
background-repeat: no-repeat;
background-position: 11px 11px;
transition:all 0.3s;
}

#photos_details .filter a:hover{
background-color:#eae7e7;
color:inherit;
}

#photos_details .filter a.active{
text-decoration:underline;
}

#photos_details .formulaire{
	text-align:center;
	margin-bottom:50px;
	margin-top:50px;
	
}

#photos_details .photos{
width:100%;
display:block;
clear:both;
font-size:0px;
text-align:center;
}

#photos_details .item{
width:300px;
height:220px;
display:inline-block;
vertical-align:top;
overflow:hidden;
position:relative;
margin:10px 20px;
box-shadow: 10px 10px 54px -24px rgba(0,0,0,0.75);
border-radius:3px;
border:1px solid #b7b7b7;
transition:all 0.3s;
}

#photos_details .item:hover{
border:1px solid #404040;
}

#photos_details .item .demo-gallery__img--main{
width:300px;
height:190px;
position:absolute;
z-index:100;
top:0px;
left:0px;
text-align:left;
overflow:hidden;
}

#photos_details .item .demo-gallery__img--main img{
min-height:100%;
}


#photos_details .item .inactif{
width: 300px;
height: 190px;
position: absolute;
top: 0px;
left: 0px;
z-index: 200;
background-color: red;
font-size: 23px;
color: white;
opacity: 0.6;
line-height: 190px;
text-align: center;
}

#photos_details .item .boutons_actions{
width:300px;
height:30px;
position:absolute;
top:190px;
background-color:#64abb4;
}

#photos_details .item .boutons_actions a{
display:inline-block;
vertical-align:top;
width:75px;
height:30px;
color:#fff;
font-size:12px;
text-align:center;
line-height:30px;
transition:all 0.3s;

}

#photos_details .item .boutons_actions a:hover{
text-decoration:none;
color:#f1c40f;
}


/* **** CATEGORIES 1+2 AJOUTER/MODIFIER **** */
#cat_ajouter_modifier img{
	width:300px;
}

/* **** PRODUITS LISTE**** */
#produits_liste .recherche p{
display:inline-block;
width:226px;
padding-left:27px;
}


#produits_liste .recherche p.selected{
background-image:url('images/arrow_right.png');
background-repeat:no-repeat;
background-position:0px 1px;
padding-left:27px;
}


#produits_liste .recherche select.search_cat{
background-image:url('images/filter.png');
background-repeat:no-repeat;
background-position:8px 10px;
padding-left:35px;
}


#produits_liste .recherche input.search{
width:302px;
background-image:url('images/search.png');
background-repeat:no-repeat;
background-position:8px 10px;
padding-left:35px;

}
#produits_liste .navigation p.compteur{
font-size:12px;
}

#produits_liste .navigation{

}

#produits_liste .navigation a{
background:#f1f1f1;
padding: 1px 6px;
margin: 3px;
display: inline-block;
font-size: 12px;
}

#produits_liste .navigation span{
padding: 1px 6px;
margin: 3px;
display: inline-block;
font-size: 12px;
}

#produits_liste .nav_and_pagination{
    display: flex;
    justify-content: space-between;
    margin-top: 2em;
}


#produits_liste .pagination{
    order: -1;
}

#produits_liste .pagination span{
background:#f1f1f1;
padding: 1px 6px;
margin: 3px;
display: inline-block;
font-size: 12px;
}

#produits_liste .pagination span.active{
background:#f1f1f1;
padding: 1px 6px;
margin: 3px;
display: inline-block;
font-size: 12px;
}

#produits_liste .pagination a span{
display:inline-block;
background: #c0c0c0;
padding: 1px 6px;
margin: 3px;
font-size: 12px;
}

.delete_form input[type="submit"]{
background: #64abb4;
color: white;
padding: 0.5rem;
font-size: 13px;
line-height: normal;
text-transform: none;
}

.delete_form input[type="submit"]:hover{
    background: #64abb4;
}


/* **** AJOUTER/MODIFIER PRODUIT **** */
#produits_ajouter .c1{
margin-bottom:30px;
}
#produits_ajouter p.last_update{
text-align:right;
font-size:14px;
opacity:0.65;
}





#produits_ajouter #bouton_langues_fr,
#produits_ajouter #bouton_langues_de,
#produits_ajouter #bouton_langues_nl,
#produits_ajouter #bouton_langues_en{
display: inline-block;
vertical-align: top;
border: 1px solid #e1e1e1;
padding: 5px 16px;
background-color: white;
opacity:0.5;
margin-right:10px;
margin-bottom:10px;
position:relative;
top:0px;
transition: all 0.32s;
}


#produits_ajouter #bouton_langues_fr.selected,
#produits_ajouter #bouton_langues_de.selected,
#produits_ajouter #bouton_langues_nl.selected,
#produits_ajouter #bouton_langues_en.selected{
opacity: 1;
background-color: #f1f1f1;
position: relative;
top: 11px;
}

#produits_ajouter .c1 #div_fr, #produits_ajouter .c1 #div_de, #produits_ajouter .c1 #div_nl, #produits_ajouter .c1 #div_en{
border:1px solid #e1e1e1;
padding:30px;
display:inline-block;
vertical-align:top;
animation: animationFrames ease 1s;
animation-iteration-count: 1;
transform-origin: 50% 50%;
animation-fill-mode:forwards; /*when the spec is finished*/
}
@keyframes animationFrames{ /* animation ci-dessus */
  0% {
    opacity:0;
    transform:  translate(-800px,0px)  ;
  }
  60% {
    opacity:1;
    transform:  translate(30px,0px)  ;
  }
  80% {
    transform:  translate(-10px,0px)  ;
  }
  100% {
    opacity:1;
    transform:  translate(0px,0px)  ;
  }
} /* fin de keyframes */


#produits_ajouter .liste_options_bool{
width:750px;
columns: 3;
margin-bottom:30px;
}

#produits_ajouter .liste_options_texte{
width:750px;
columns: 2;
}

#produits_ajouter .liste_options_texte p{
display:inline-block;
}

#produits_ajouter .liste_options_texte p span{
	font-size:13px;
	line-height:15px;
	opacity:0.65;
}

#produits_ajouter .liste_options_texte input[type="text"]{
font-size:13px;
width:300px;
}


/* **** PRODUITS + NEWS PDF **** */

#gerer_pdf .formulaire{
text-align:center;	
margin-bottom:50px;
}

#gerer_pdf .pdfs{
width:100%;
display:block;
clear:both;
font-size:0px;
text-align:center;
}

#gerer_pdf .pdfs .item{
width:300px;
height:220px;
display:inline-block;
vertical-align:top;
overflow:hidden;
position:relative;
margin:10px 20px;
box-shadow: 10px 10px 54px -24px rgba(0,0,0,0.75);
border-radius:3px;
border:1px solid #b7b7b7;
transition:all 0.3s;
}

#gerer_pdf .pdfs .item img{
	max-width:100%;
}

#gerer_pdf .pdfs .item:hover{
border:1px solid #404040;
}


#gerer_pdf .pdfs .item .inactif{
width: 300px;
height: 190px;
position: absolute;
top: 0px;
left: 0px;
z-index: 200;
background-color: red;
font-size: 23px;
color: white;
opacity: 0.6;
line-height: 190px;
text-align: center;
}

#gerer_pdf .pdfs .item p.description{
width: 280px;
padding:0px 10px;
height: 23px;
position: absolute;
bottom: 30px;
left: 0px;
z-index: 300;
font-size:13px;
line-height:23px;
background-color:#e1e1e1;
overflow:hidden;
}

#gerer_pdf .pdfs .item .boutons_actions{
width:300px;
height:30px;
position:absolute;
top:190px;
background-color:#64abb4;
}

#gerer_pdf .pdfs .item .boutons_actions a{
display:inline-block;
vertical-align:top;
width:75px;
height:30px;
color:#fff;
font-size:12px;
text-align:center;
line-height:30px;
transition:all 0.3s;

}

#gerer_pdf .pdfs .item .boutons_actions a:hover{
text-decoration:none;
color:#f1c40f;
}


/* **** CONTACTS DETAILS **** */
#contacts_details .content{
min-width:800px;
text-align:left;
}

#contacts_details .content p.date{
text-align:right;
opacity:0.65;
font-size:14px;
margin-bottom:20px;
}



/* *********************** FOOTER *********************** */
#footer{
padding:50px 0px;
text-align:center;
}

#footer img{
margin-bottom:10px;
width: 300px;
height: auto;
}

#footer p{
font-size:13px;
line-height:22px;
max-width: 500px;
margin: 0 auto;
}

#footer .small{
margin-top: 20px;
}

#footer .small a{
display: block;
width: 90px;
margin: 5px auto 0;
}

#footer .small a img{
width: 100%;
height: auto;
margin: 0;
}



/* *********************** TABLE *********************** */

table{
clear:both;
border-collapse: collapse;
border-spacing: 0px 0px;
margin-top:30px;
min-width:1000px;
margin-bottom:35px;
}

table tr{
height:50px;
line-height:0px;
}

table tr{
border-bottom:1px solid #ececec;
transition:all 0.15s;
}

table tr:hover{
background-color:#D4DBE3;
}


table tr:first-of-type{ /* index du tableau */
background-color:#516171!important;
color:white;
height:30px;
border-bottom:none;
}

table tr th{
color:white;
font-size:11px;
font-weight:700;
text-transform:uppercase;
padding:0px 13px;
}


table tr:last-of-type{ /* dernière ligne du tableau */
border:none;
}





table td{
padding:0px 13px;
line-height:14px;
}

td.col1{ /*id */
font-size:12px;
}


td.col2 img{ /* images */
width:35px;
height:35px;
}

td.col3{ /* titre principal*/
font-size:13px;
font-weight:bolder;
text-transform:uppercase;
max-width:425px;
}

td.col4{ /* info secondaire */
font-size:13px;
}

td.col5{ /* email ou lien */
font-size:13px;
}

td.col5 a{

}

td.col6 a{ /* actif / inatif */
font-size:12px;
font-weight:700;
opacity:0.90;
transition:all 0.3s;
}

td.col6 a:hover{
text-decoration:none!important;
opacity:1;
}

td.col6 a .actif{
background-color:#27ae60;
border-radius:10px;
padding:3px 10px;
color:white;
}

td.col6 a .inactif{
background-color:#c0392b;
border-radius:10px;
padding:3px 10px;
color:white;
}

td.col7{ /* lien texte (modifier, supprimer, etc...) */
font-size:12px;
}

td.col7 a{
color:#2980b9!important;
}

td.col8{ /* date*/
font-size: 12px;
color: #a2a2a2;
}

td.col9{ /* V/X Icon*/
text-align:center;
}

#wrapper .delete_first_btn{
    background: #64abb4;
    color: white;
    padding: 0.5rem;
    font-size: 13px;
    line-height: normal;
    text-transform: none;
    cursor: pointer;
    opacity: 0.8;
    border-radius: 4px;
    margin-top: 1em;
    display: inline-block;
}

#wrapper .delete_first_btn:hover{
    color: white;
    text-decoration: none;
}

#wrapper .delete_second_btn{
    margin-right: 2em;
    cursor: pointer;
}


/* *********************** FORM ELEMENTS *********************** */

p.label_input{
display:inline-block;
vertical-align:top;
width:230px;
padding:7px;
}

p span.info_input{
display:inline-block;
color:#3498db;
font-size:12px;
margin-bottom:13px;
}

input[type="text"]{
border:1px solid #bdc3c7;
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
background-repeat:no-repeat;
background-position:10px center;
}

input.n_caracteres{
padding: 10px;
font-size: 12px;
color: #25818d;
width: 40px;
display: inline-block;
background-color: white;
text-align:center;
}

input.n_caracteres:hover{
box-shadow:none;	
}

input[type="text"].fr{
padding-left:35px;
background-image:url('images/fr.png');
}

input[type="text"].de{
padding-left:35px;
background-image:url('images/de.png');
}

input[type="text"].nl{
padding-left:35px;
background-image:url('images/nl.png');
}

input[type="text"].en{
padding-left:35px;
background-image:url('images/en.png');
}


input[type="number"]{
border:1px solid #bdc3c7;
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
}

input[type="date"]{
border:1px solid #bdc3c7;
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
}

input[type="file"]{
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
}

input[type="file"]:hover{
box-shadow:none;
}

input[type="email"]{
border:1px solid #bdc3c7;
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
}

input[type="password"]{
border:1px solid #bdc3c7;
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
}

input:hover{
box-shadow: 1px 1px 10px 0px rgba(50, 50, 50, 0.20);
}

textarea{
width: 350px;
min-width: 350px;
max-width: 350px;
min-height: 100px;
height: 250px;
border: 1px solid #bdc3c7;
padding: 10px;
font-size: 16px;
transition: box-shadow 0.2s ease-in-out;
margin-bottom: 20px;
border-radius: 4px;
background-repeat: no-repeat;
background-position: 10px 16px;
}

textarea.fr{
padding-left:35px;
background-image:url('images/fr.png');
}

textarea.de{
padding-left:35px;
background-image:url('images/de.png');
}

textarea.nl{
padding-left:35px;
background-image:url('images/nl.png');
}

textarea.en{
padding-left:35px;
background-image:url('images/en.png');
}

textarea:hover{
box-shadow:         1px 1px 10px 0px rgba(50, 50, 50, 0.20);
}

select{
border:1px solid #bdc3c7;
padding:10px;
font-size:16px;
transition: all 0.2s ease-in-out;
margin-bottom:20px;
width:350px;
border-radius:4px;
box-sizing: content-box;
}

select option{
font-size:14px;
border-bottom:1px dashed #c0c0c0;
padding:10px 3px;
}

select:hover{
-webkit-box-shadow: 1px 1px 10px 0px rgba(50, 50, 50, 0.20);
-moz-box-shadow:    1px 1px 10px 0px rgba(50, 50, 50, 0.20);
box-shadow:         1px 1px 10px 0px rgba(50, 50, 50, 0.20);
}

input[type="submit"]{
height:38px;
display:inline-block;
padding-left:35px;
padding-right:15px;
line-height:38px;
font-size:14px;
text-transform:uppercase;
font-weight:600;
color:white;
background-repeat:no-repeat;
background-position:7px 13px;
text-decoration:none;
border-radius:4px;
opacity:0.8;
transition:all 0.3s;
background-color:#2ecc71;
cursor:pointer;
background-image:url('images/btn_arrow_right.png');
background-repeat:no-repeat;
background-position:10px 15px;
transition:all 0.15s;
}

input[type="submit"]:hover{
background-color:#27ae60;
box-shadow: 1px 1px 10px 0px rgba(50, 50, 50, 0.20);
background-position:15px 15px;
}



label{
font-size: 13px;
line-height: 15px;
display: inline-block;
vertical-align:middle;
overflow: hidden;
opacity:0.65;
padding: 5px 4px;
cursor:pointer;
margin-bottom:2px;
border-radius:4px;
}

input[type="radio"]{
display:inline-block;
vertical-align:middle;
}

input[type="checkbox"]{
display:inline-block;
vertical-align:middle;
}


input[type=checkbox]:hover + label,
input[type=radio]:hover + label {
background-color:#27ae60;
color:white;
}

input[type=checkbox]:checked + label,
input[type=radio]:checked + label {
background-color:#2ecc71;
color:white;
}

/* *********************** BUTTONS *********************** */

#wrapper a.button{
height:38px;
display:inline-block;
padding-left:35px;
padding-right:15px;
line-height:38px;
font-size:14px;
text-transform:uppercase;
font-weight:600;
color:white;
background-repeat:no-repeat;
background-position:7px 13px;
text-decoration:none;
border-radius:5px;
opacity:0.8;
transition:all 0.3s;
cursor:pointer;
}

#wrapper a.button:hover{
box-shadow: 1px 1px 10px 0px rgba(50, 50, 50, 0.20);
opacity:1;
}

#wrapper a.button_back{
background-color:#e67e22;
background-image:url('images/btn_arrow_left.png');
background-position:12px 15px;
position: absolute;
right: 0;
top: 0;
}

#wrapper a.button_add{
background-color:#2980b9;
background-image:url('images/btn_plus.png');
background-position:12px 15px;
}

#wrapper a.button_rotate{
background-color:#2980b9;
background-image:url('images/btn_rotate.png');
background-position:12px 14px;
}

#wrapper a.button_generer_password{
background-color:#2980b9;
padding-left:15px;
}



.afficher_langue{
  width: 16px;
  height: 11px;
  margin: 40px;
  display: inline-block;
}
#afficher_fr{
  background-image:url('images/fr.png');
  background-repeat: no-repeat;

}
#afficher_de{
  background-image:url('images/de.png');
  background-repeat: no-repeat;
}
#afficher_nl{
  background-image:url('images/nl.png');
  background-repeat: no-repeat;
}
#afficher_en{
  background-image:url('images/en.png');
  background-repeat: no-repeat;
}


/* *********************** HOME *********************** */
#home h1{
padding: 0;
}

#home .links a{
display: block;
width: 100%;
max-width: 400px;
margin: 0 auto 30px;
background-color: #eb882d;
color: white;
font-size: 18px;
text-transform: uppercase;
font-weight: 600;
padding: 40px 20px;
box-sizing: border-box;
line-height: 27px;
transition: all 0.4s;
border-radius: 15px;
}

#home .links a .count{
	display: block;
    font-size: 12px;
    line-height: 15px;
    opacity: 0.8;
}

#home .links a:hover{
text-decoration: none;
transform: scale(1.1);
}

/* *********************** DISPONIBILITES *********************** */
#disponibilites a{
	display: block;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    background-color: #a3a3a3;
    color: black;
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto;
	border-radius: 10px;
	opacity: 0.7;
}

#disponibilites a.select{
    background-color: #64abb4;
    color: white;
	opacity: 1;
	background-image: url(../images/icon-selected.svg);
	background-size: 20px;
	background-position: 20px center;
	background-repeat: no-repeat;
}

#disponibilites a:hover{
	text-decoration: none;
	color: black;
}

#disponibilites a.select:hover{
	text-decoration: none;
	color: white;
}

#disponibilites a+a{
    margin-top: 30px;
}

/* *********************** EVENEMENTS *********************** */
#evenements_liste .evenement{
text-align: left;
width: 100%;
max-width: 1000px;
margin: 0 auto 50px;
display: flex;
flex-direction: row;
align-items: flex-start;
border: 2px solid #eb882d;
position: relative;
border-radius: 15px;
overflow: hidden;
}

#evenements_liste .evenement .date{
width: 250px;
text-align: center;
padding-top: 25px;
background-color: #fff;
}

#evenements_liste .evenement .date .finished{
font-size: 16px;
margin-bottom: 10px;
display: block;
background-color: #cc2e31;
color: white;
position: absolute;
top: 0;
left: -1px;
width: 251px;
z-index: -1;
padding: 5px 0;
text-transform: uppercase;
font-weight: 600;
}

#evenements_liste .evenement .date .jour{
display: block;
font-size: 95px;
line-height: 80px;
margin-bottom: 5px;
font-weight: 600;
color: white;
text-shadow: 2px 0 #eb882d, -2px 0 #eb882d, 0 2px #eb882d, 0 -2px #eb882d, 1px 1px #eb882d, -1px -1px #eb882d, 1px -1px #eb882d, -1px 1px #eb882d;
}

#evenements_liste .evenement .date .jour+span{
text-transform: uppercase;
color: #eb882d;
font-weight: 600;
font-size: 24px;
display: block;
}

#evenements_liste .evenement .infos{
flex: 1;
background-color: #eb882d;
color: white;
padding: 20px 40px 20px 30px;
min-height: 115px;
}

#evenements_liste .evenement .infos h2{
margin: 0 0 -5px;
border: none;
font-size: 35px;
line-height: 45px;
margin-left: 10px;
}

#evenements_liste .evenement .infos .infos-small{
	display: inline-block;
	background-color: #fff;
	width: fit-content;
	padding: 1px 8px;
	border-radius: 5px;
	color: #64abb4;
	font-size: 13px;
	line-height: 19px;
	text-transform: uppercase;
	margin-left: 10px;
	margin-top: 10px;
}

#evenements_liste .evenement .infos .infos-small+p{
	margin-top: 20px;
}

#evenements_liste .evenement .infos a.infos-small{
	text-decoration: underline;
}

#evenements_liste .evenement .button{
display: block;
width: fit-content;
text-decoration: none;
background-color: #64abb4;
padding: 9px 50px 9px 13px;
border-top-right-radius: 20px;
border-bottom-right-radius: 20px;
color: white;
position: relative;
background-color: white;
color: #64abb4;
margin-top: 20px;
margin-left: 10px;
cursor: pointer;
font-size: 14px;
line-height: 14px;
}

#evenements_liste .evenement .button:after{
content: "";
position: absolute;
right: 7px;
top: 50%;
transform: translateY(-50%);
width: 27px;
height: 27px;
background-image: url(../images/button-after.svg);
background-size: 100%;
background-position: center;
background-repeat: no-repeat;
transition: all 0.4s;
}

#evenements_liste .evenement .button:hover:after{
transform: translateY(-50%) translateX(-7px);
}

#evenements_liste .evenement .infos p{
word-break: break-all;
margin-left: 10px;
}

#evenements_liste .evenement .infos .images{
width: 100%;
margin-top: 30px;
margin-left: 10px;
}

#evenements_liste .evenement .infos .images a{
display: inline-block;
width: 150px;
height: 100px;
overflow: hidden;
}

#evenements_liste .evenement .infos .images a img{
width: 100%;
height: 100%;
object-fit: cover;
transition: all 0.4s;
}

#evenements_liste .evenement .infos .images a:hover img{
transform: scale(1.1);
}

#evenements_liste .evenement .infos .pdfs{
width: 100%;
margin-top: 30px;
margin-left: 10px;
}

#evenements_liste .evenement .infos .pdfs a {
display: block;
width: fit-content;
color: white;
text-decoration: underline;
padding-left: 35px;
background-image: url(images/icon-pdf.svg);
background-size: 20px;
background-position: 5px center;
background-repeat: no-repeat;
transition: all 0.4s;
}

#evenements_liste .evenement .infos .pdfs a:hover {
background-position: 10px center;
}

#evenements_liste .evenement .infos .pdfs a+a {
margin-top: 9px;
}

#evenements_liste .evenement.popup{
	display: none;
}

#evenements_liste .evenement.popup.active{
	display: flex;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    top: 100px;
    z-index: 1000;
    align-items: stretch;
	width: 100%;
	max-width: 90vw;
}

#evenements_liste .popup-overlay {
    display: none;
    position: fixed;
    top:0; 
	right:0; 
	bottom:0; 
	left:0;
    background: rgba(0,0,0,0.8);
    z-index: 999;
}

#evenements_liste .popup-overlay.active {
    display: block;
}

#evenements_liste .popup .popup-close {
	position: absolute;
    top: 10px;
    right: 10px;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 1001;
    width: 20px;
    height: 20px;
    background-image: url(../images/common/close-white.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* *********************** DISPONIBILITES *********************** */
#fichiers_liste .filtres{
	margin: -30px 0 30px;
    font-size: 13px;
    text-transform: uppercase;
}

#fichiers_liste .filtres a{
	display: inline-block;
    text-transform: none;
    background-color: #dfdfdf;
    margin: 10px 5px 0;
    padding: 2px 9px;
    border-radius: 8px;
}

#fichiers_liste .filtres a.active{
	border: 1px solid #495057;
}

#fichiers_liste .fichiers{
width: 100%;
max-width: 1200px;
text-align: center;
margin: 0 auto;
}

#fichiers_liste .fichiers a{
display: inline-block;
width: 28%;
margin: 0 2% 35px;
background-color: #eb882d;
color: white;
text-align: left;
padding: 20px 20px 20px 60px;
box-sizing: border-box;
transition: all 0.4s;
border-radius: 15px;
vertical-align: top;
background-image: url(images/icon-pdf-partenaire.svg);
background-size: 30px;
background-position: left 17px center;
background-repeat: no-repeat;
}

#fichiers_liste .fichiers a .title{
font-size: 19px;
text-transform: uppercase;
font-weight: 600;
display: block;
}

#fichiers_liste .fichiers a .download{
font-size: 13px;
display: block;
opacity: 0.7;
line-height: 16px;
}

#fichiers_liste .fichiers a:hover{
text-decoration: none;
transform: scale(1.1);
}


/* *********************** PAGE FICHIERS UPLOADES *********************** */

.tocopy{
    display: inline;
}
.js-copy{
    text-decoration: none;
    color: #2980b9;
    background-color: transparent;
    box-shadow: none;
}
.js-copy:hover{
    text-decoration: underline;
    box-shadow: none;
}


/* ******** RESPONSIVE ******** */
@media screen and (max-width: 1100px){
	#menu .links{
		display: block;
		margin: 0 auto;
		float: none;
		text-align: center;
		padding-bottom: 20px;
	}
}

@media screen and (max-width: 550px){
	#evenements_liste .evenement{
		flex-direction: column;
	}
	#evenements_liste .evenement .date{
		width: 100%;
		padding: 30px 0 30px;
	}
	#evenements_liste .evenement .date .finished{
		width: 100%;
	}
	#evenements_liste .evenement .infos{
		width: 100%;
		box-sizing: border-box;
        padding: 20px 20px 20px 10px;
		max-height: 65vh;
		overflow: auto;
	}
	#evenements_liste .popup .popup-close{
		background-image: url(../images/common/close.svg);
	}
	#evenements_liste .evenement.popup.active{
		top: 30px;
	}
}

@media screen and (max-width: 800px){
	#fichiers_liste .fichiers a{
		width: 100%;
		margin: 0 auto 50px;
		max-width: 400px;
	}
	#wrapper .content{
		width: 100%;
		box-sizing: border-box;
		padding: 32px 10px;
	}
	input[type="text"], textarea, select, input[type="email"], input[type="file"], input[type="password"]{
		max-width: 100%;
		min-width: unset;
		box-sizing: border-box;
	}
}

@media screen and (max-width: 900px){
	#login input#password{
		width: 41%;
	}
}

@media screen and (max-width: 715px){
	#login input#password{
		width: calc(100% - 120px);
	}
}




@media screen and (min-width: 800px){
	.communes{
		column-count: 3;
	}

	.specialisations{
		column-count: 2;
	}

	.specialisations div, .communes div{
		margin-bottom: 5px;
	}
}