/* -------------- GLOBAL & CLASSES GENERALES -------------- */

*{
    -webkit-box-sizing : border-box;
    -moz-box-sizing : border-box;
    box-sizing : border-box;
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
}

a {
    text-decoration: none;
}

body {
    margin:0px;
    padding:0px;
    background-color:#FFF;
}

.spacer {
    clear:both;
}

.conteneur {
    max-width: 1200px;
    margin: 0 auto;
}

.monchamp {
 display:none;
}

.todo {
  margin:5px 0;
  padding:5px;
  background-color:#a00;
  color:#fff;
}

.conteneur_inter {
  max-width: 1200px;
  margin:30px auto 10px auto;
}

.conteneur_inter ul {
  margin:10px 0 10px 30px;
}

.conteneur_inter p {
  margin-bottom:10px;
}

.wrapper {
    background: #eee;
    padding-top: 50px;
}

.reserve_adherent {
  display:inline-block;
  margin:5px 0;
  padding:5px;
  background-color:#444;
  color:#fff; 
  cursor:pointer; 
}
.reserve_adherent_info {
  display:block;
  margin:10px 0;
  
  color:#888;
  font-style:italic;
  cursor:pointer;
}

#alerte_cotisation {
  padding:10px;
  text-align:center;
  background-color:#f90;
  color:#fff;
  display:block;
  margin-bottom:10px;
}


.btn_connectezvous {
  font-size:14px;
  padding:4px;
  color:#fff;
  background-color:#888;
  text-align:center;
  display: inline-block;
}

/*** élements pages interieurs : colonnes, dates, photos, ... ****/

#chemindefer {
  font-size:14px;
  margin-bottom:10px;
  color:#888;
}
  #chemindefer a {
    color:#555;
  }
  #chemindefer a:hover {
    color:#183E5C;
    text-decoration:underline;
  }
#colonnes_inter {
  display:flex;
  justify-content:space-between;
  
}
#colonne_gauche {
  width:70%;
  padding-right:20px;
   position:relative;
}

#colonne_gauche img {
  max-width:100%!important;
  height:auto!important;
}



#colonne_gauche_large {
  width:100%;
  position:relative;
}
#colonne_droite {
  width:30%;
  background-color:rgba(200,200,200,0.2);
}
 #colonne_droite_titre {
    margin: 0px 0px 10px 0;
    color:#C1B06B;
    font-size:20px;
    font-weight:700;
    padding:0 10px;
  
 }
 #colonne_droite_texte {
    margin: 0px 0px 10px 0;
    padding:0 10px;
    
 } 
 #colonne_droite_texte div {
    font-size:14px;
 }
 
 .colonne_droite_item {
  display:flex;
  margin-bottom:10px;
 }
 .colonne_droite_item_k {
  background-color:rgba(193, 176, 107, 1);
  color:#fff;
  padding:4px 10px;
  width:25%;
 }

 .colonne_droite_item_v {
  background-color:rgba(193, 176, 107,0.3);
  color:#444;
  padding:4px 10px; 
 }
 
 .colonne_droite_dates {
    display: block;
    background-color: #183E5C;
    color: #fff;
    padding: 5px 10px!important;
    font-size: 20px;
    text-transform: uppercase;
    text-align:center;
    margin-bottom:5px;
} 
 
 #colonne_droite_btn {
    display:block;
    background: #C1B06B;
    color:#fff;
    margin: 10px;
    padding: 10px; 
 }
 #colonne_droite_btn:hover { 
    background:#183E5C;
    color:#fff;
    transition:0.5s;
 } 
 
 
.inter_photo {
  max-width:100%;
  height:400px;
  background-size:cover;
  background-position:center;
  margin-top:10px;
} 
 
.inter_dates {
  color:#C1B06B;
  text-transform:capitalize;
} 
/* - Classe lien bloc avec flèche - */

.fleche_lien_bloc {
    display: inline-block;
    margin: auto;
    height: 50px;
    width: 50px;
    vertical-align: middle;
    transition: 0.4s ease-out;
    background-image: url(../images/icon_fleche.png);
    background-size: 28px;
    background-repeat: no-repeat;
    background-position: center center;
}

.lien_bloc {
    display: inline-block;
    text-align: center;
    width: 100%;
    transition: 0.4s ease-out;
    text-transform: uppercase;
    color: white;
    font-weight: bold;
    padding-right: 10%;
}

/* - Classe Parallax Scrolling - */

.parallax {

    background-attachment: fixed;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

/* - Classe Bandeau - */

.bandeau {
    padding-top: 2%;
    margin: auto;
    height: 100%;
    text-align: justify;
}
.bandeau>div {
    text-align: center;
    width: 180px;
    margin: auto;
}
.bandeau h2{
    color: white;
    margin-bottom: 10px;
    border: solid white 2px;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    font-size: 30px;
}
.bandeau p {
    color: white;
    font-size:16px;
    line-height: 25px;
    font-weight: 100;
    margin-bottom: 15px;
}

.bandeau>div>p {
    cursor: pointer;
    border-style: none;
    padding-right: 15px;
    margin-bottom: 15px;
    background-color: #C1B06B;
    line-height: 55px;
    font-weight: bold;
}
.bandeau>div>p:hover {
    background-color : #183E5C;
}


/* - - - - - - - STRUCTURE - - - - - - - */

/* -------- HEADER -------- */

header {
    position: fixed;
    top: 0;
    z-index: 2;
    height:80px;
    width: 100%;
    background-color:#fff;
}

header>div{
    padding-top: 20px;
}

/* navigation btns haut header **/

header ul li{
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background-color:#C1B06B;
    list-style: none;
    transition: 0.4s ease-out;
    transition-property: transform, background-color;
    margin-right: 15px;
    cursor:pointer;
    float:left;
    background-size: 40px;
    
    background-repeat: no-repeat;
    background-position: center center;    
}


/* btn menu droite */
header ul li#nav_btn_menu {
    width: auto;
    background:none;
    list-style: none;
    margin-right: 20px;
    float: right;
    cursor: default;   
}

header ul li#nav_btn_menu p {
    color: #183E5C;
    display: inline-block;
    margin-left: 10px;
}

/* btn mini logo scroll */

header ul li#nav_logoScroll {
    float:none;
    display: none;
    margin: auto;
    background: url(../images/favicon.png) no-repeat center center;
    background-size: 50px;
    width: 50px;
    height: 50px;
    list-style: none;
}



header ul li a {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration:none;
}


header li#nav_home {
    background-image: url(../images/header_home.png);
    margin-left: 20px;
    background-size: 24px 24px;
}

header li#nav_calendrier {
    background-image: url(../images/header_item_agenda.png);
}

header li#nav_contact {
    background-image: url(../images/header_item_contact.png);
}

header li#nav_connexion {
    background-image: url(../images/header_item_adherent.png);
    width:auto;
    min-width:40px;
    background-position: left center; 
}

header ul li#nav_connexion a {
    color: #fff;
    display: inline-block;
    padding-left: 40px;
    padding-top:9px;
    padding-right:10px;
}

header li#nav_deconnexion {
    background-image: url(../images/header_exit.png);
    background-size: 24px 24px;
}



#nav_connexion_popin {
  height:100%;
  width:100%;
}

header li:nth-child(5) {

}



header ul li:hover {
    background-color:#183E5C;
    text-decoration:none;
}

/* Lien retour top */

#retour-top {
    display: block;
    position: fixed;
    bottom:3%;
    right: 3%;
    z-index: 2;
    opacity: 0.8;
    filter: brightness(40%);
    transform: rotate(-90deg);
}

/* MenuBurger */

.menuBurger{
    margin-left: 10px;
    border-radius: 20px;
    background-color: #183E5C;
    width: 40px;
    height: 40px;
    position: relative;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    transition: all 0.3s;
}
.menuBurger span{
    background-color:#fff;
    position: absolute;
    border-radius: 5px;
    transition: .3s cubic-bezier(.8, .5, .2, 1.4);
    width: 60%;
    height: 4px;
    transition-duration: 300ms
}
.menuBurger span:nth-child(1){
    top: 12px;
    left: 8px;
}
.menuBurger span:nth-child(2){
    top:19px;
    left: 8px;
}
.menuBurger span:nth-child(3){
    bottom:10px;
    left: 8px;
}
.menuBurger:hover{ 
    background: #C1B06B;
}
.menuBurger:not(.clickMenuBurger):hover span:nth-child(1){
    margin-top: 0px;
    transform: rotate(-45deg) scaleX(0.7);
    -webkit-transform: rotate(-45deg) scaleX(0.7);
    -moz-transform: rotate(-45deg) scaleX(0.7);
    -ms-transform: rotate(-45deg) scaleX(0.7);
    -o-transform: rotate(-45deg) scaleX(0.7);
    top: 20px;
    left: 13px;
}
.menuBurger:not(.clickMenuBurger):hover span:nth-child(2){
    margin-top: 0px;
    transform: rotate(45deg) scaleX(0.7);
    -webkit-transform: rotate(45deg) scaleX(0.7);
    -moz-transform: rotate(45deg) scaleX(0.7);
    -ms-transform: rotate(45deg) scaleX(0.7);
    -o-transform: rotate(45deg) scaleX(0.7);
    top: 20px;
    left: 3px;
}
.menuBurger:not(.clickMenuBurger):hover span:nth-child(3){
    background: transparent;
}
.clickMenuBurger header li:nth-child(4) p {
    display: none;
}
.clickMenuBurger span:nth-child(1){
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    top: 18px;
}
.clickMenuBurger span:nth-child(2){
    background: transparent;
}
.clickMenuBurger span:nth-child(3){
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    top: 18px;
}

/* ------------------- POP IN  ------------------- */
.popin-fond {
    display: none;
    background: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    position: fixed;
    top:0;
    left:0;
    z-index:2;
    
}
.popin-contenu {
    display: none;
    background: #0c2437;
    margin-top: 80px;
    padding: 30px;
    height: 70%;
}

#popin-commun-contenu div {
  color:#fff;
}

#popin-content {
    overflow-y: auto;
    width: 100%;
    height: auto;
    max-height: 90%;
}

/* ------------------- POP IN : MENU (CLICK MENU) ------------------- */

#menu-respfond {
  background: #0c2437;
}
#menu-respliens {
    height: calc(100% - 80px);
    overflow-y:auto;
    padding: 20px 0 20px 0;
}

#menu-respliens .conteneur {
     padding: 0;
}

#menu {
	margin-bottom: 20px;
}

#menu li {
    list-style: none;
}
#menu li a {
    text-transform: uppercase;
    text-align: center;
    color:#fff;
    background-color: #183e5c;
    display: block;
    width: 90%;
    max-width: 400px;
    text-decoration: none;
    margin: 8px auto;
    padding: 10px;
    transition: 0.3s ease-out;
}
#menu li a:hover {
	background: #225883;
}

#menu .ul_sousmenu li a {
  padding:5px;
  background-color: #C1B06B;
}
#menu .ul_sousmenu li a:hover {
  padding:5px;
  background-color: #D0D092;
}
 

/* ------------------- POP IN : CONNEXION ------------------- */

#connexion-fond {

}
#connexion-contenu {

}
#connexion-divs {
  display:flex;
  justify-content:space-around;
}

#connexion-adherer, #connexion-deja {
  background-color:#fff;
  margin:20px 40px;
  padding:20px;
  width:50%;
}

#connexion_message, #perdus_message {
  text-align:center;
  margin:10px 0;
  background-color:#a00!important;
  color:#fff!important;
  padding:5px;
  display:none;
}
#perdus_message {
  text-align:left;
}

#connexion-deja input {
  width:100%;
  margin:10px 0 0 0;
  padding:10px;
}
#connexion-deja input[type=submit] {
  font-size: 20px;
}

#connexion-adherer {
  display:flex;
  justify-content:space-between;
  flex-direction: column;
}
#connexion-deja form {
  display:flex;
  justify-content:space-between;
  flex-direction: column;
  margin:0;
  padding:0;
}

#connexion-adherer a {

    background-color: #C1B06B;
    font-size: 20px;
    text-align: center;
    display: inline-block;
    width: 100%;
    transition: 0.4s ease-out;
    text-transform: uppercase;
    color: white;
    font-weight: bold;
    padding:10px;
}
#connexion-adherer a:hover {
  background-color: #183E5C;
}

#a_perdu_identifiants {
  display:block;
  font-size:11px;
  text-align:center;
  margin:5px auto 0 auto;
  color:#444!important;
  cursor:pointer;
}

#connexion-perdus {
  display:none;
}



/********* item fils (menuItemFils.php) **********/
#item-fils {
  display:flex; 
  margin-top:20px; 
}
#item-fils a {
  text-decoration:none;
  display:block;
  background-color: #183E5C;
  margin: 10px 10px 10px 0;
  padding:10px;
  vertical-align:middle;
  font-size: 26px;
  color:#fff;
  text-align:center;
  width:100%;
  transition:0.5s;
  
  display:flex;
  align-items: center;
  justify-content: space-around;
  min-height:170px;
}
#item-fils a:hover {
 background-color: #C1B06B;
 text-decoration:none;
}

#item-fils a span {
  border:1px solid #fff;
  margin:10px;
  padding:5px;
  width:90%;
  height:80%;
}
#item-fils a span {
  display:flex;
  align-items: center;
  justify-content: space-around;
}

/* -------- FOOTER -------- */




/* -------- CONTENU -------- */

#contenu {
    height: 100%;
    min-height:600px;
    background-color:#FFF;
    padding-bottom:10px;
}


/* -------- @NOTE CONTENU > BANDEAU ACCUEIL LOGO -------- */

#bandeau_accueil_logo {
    margin-top: 80px;
    min-height: 330px;
    box-shadow: 0 10px 10px -10px rgba(0,0,0,0.3);
    position:relative;
}
/* logo site */
#header_logo {
    display:block;
    width: 200px;
    height:200px;
    float: left;
    margin-right: 20px;
    margin-bottom: 10px;
    background-position: center;
    background-image: url(../images/logo_grand.png);
    background-repeat:no-repeat;      
    background-size:200px;
    position:relative;
}
#bandeau_accueil_logo img {
    width: 240px;
    float: left;
    margin-bottom: 10px;
    margin-right: 20px;
    transition: 0.4 ease-out;
}
/* gestion des différentes lignes du titre avec les spans */
#bandeau_accueil_logo .titre_site span{
    font-weight: 100;
    max-width: 350px;
    padding:0px;
    margin:0px;
    padding: 0 5px 0 5px;
    margin-bottom: 10px;
    font-size:24px;
    font-weight:normal;
    display: inline-block;
    background-color: #C1B06B;
    color: white;
    transition: 0.4 ease-out;
    text-transform: uppercase;
}
#bandeau_accueil_logo .titre_site span:nth-child(1){
    padding-right: 10px;
}
#bandeau_accueil_logo .titre_site span:nth-child(4){
    display: inline-block;
    font-weight: bold;
}
#bandeau_accueil_logo_div {
    margin-left: auto;
    margin-right: auto;
    max-width: 700px;
    padding-top: 50px;
}
#bandeau_accueil_logo>div>div {
    margin: auto;
}
#bandeau_accueil_logo>div>div>div {
    padding-top: 60px
}

#conteneur_sousTitrePage {
  position:absolute;
  bottom:20px;
  width:100%;
}
#conteneur_sousTitrePage .conteneur{
  display:flex;
  justify-content:space-between;
}
#sousTitrePage {
  display:flex;
  align-items:flex-end;
}
#sousTitrePage div {

  display:inline-block;
  background-color: #183E5C;
  color:#fff;
  padding:5px 10px!important;
  font-size:24px;
  text-transform:uppercase; 
}

#conteneur_message_extranet {
  display:flex;
  justify-content: space-around;
  margin:5px 10px 5px 0;
}
#conteneur_message_extranet .conteneur{
  position:relative;
  width:100%;
}

@keyframes fade{
    0% { opacity:1; }
    100% { opacity:0;display:none; }
}

@-webkit-keyframes fade{
    0% { opacity:1; }
    100% { opacity:0 ;display:none;}
}

#message_extranet {

  display:inline-block;
  background-color: #ff9600;
  color:#fff;
  padding:5px 10px!important;
  font-size:20px;
  position:absolute;
  right:0;
  top:5px;
    -webkit-animation: 3s ease 2s normal forwards 1 fade;
    animation: 3s ease 2s normal forwards 1 fade;  
  
}

.event_deja_inscrit {
  font-style:italic;
  font-size:14px;
  color:#666;
}

.conteneur_lien_bloc {
    margin: auto;
    margin-top: 25px;
    margin-bottom: 25px;
    width: 325px;
    max-width:100%;
    background: #183E5C;
}

.conteneur_lien_bloc>a:hover {
    background-color: #C1B06B;
}

/* -------- CONTENU > PLAN DU SITE / FACEBOOK & CONTACT -------- */

#footer_wrapper {
    background-color: #C1B06B;
}

#footer {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
    
    padding: 30px 20px;
    width:1200px;
    margin:auto;
}

#footer_plan {
  display:flex;
  justify-content:space-around; 
  width:75%; 
}

#bas_facebook_contact {
  border: solid white 2px;
  padding:20px;
  width:25%;
}  

#bas_facebook_contact div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    margin: auto;
    height: 100%;
    
}

#bas_facebook_contact_titre {
    text-align: left;
    display: block;
    color: white;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 20px;
    margin-bottom:10px;
}

#bas_facebook_contact a span {
    vertical-align: middle;
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    background-size:contain;
    background-repeat: no-repeat;
    background-position:center;
}

#bas_facebook_contact #footer_facebook {
    background-image: url(../images/footer_icon_facebook.png);
}

#bas_facebook_contact #footer_linkedin {
    background-image: url(../images/partage-linkedin.png);
    background-size:70%;
}
#bas_facebook_contact #footer_contact {
    background-image: url(../images/footer_icon_contact.png);
}

#bas_facebook_contact a {
    text-align: left;
    display: block;
    color: white;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 15px;
    transition: 0.3s ease-out;

}

#bas_facebook_contact a:hover { 
    filter: brightness(25%);
    opacity: 0.5;
}

  .footer_plan_colonne {
    
  }

  a.pds_menu {
    color:#fff;
    font-size:16px;
    text-transform:uppercase;
    display:block;
    margin-bottom:6px;
    transition: 0.3s ease-out;   
  }  

   a.pds_sousmenu {
    color:#fff;
    font-size:12px;
    /*text-transform:capitalize;*/
    display:block; 
    margin-bottom:6px;
    margin-left:10px;
    transition: 0.3s ease-out;    
   } 
   
   a.pds_menu:hover, a.pds_sousmenu:hover {
    filter: brightness(25%);
   }

footer .conteneur {
    display: flex;
    justify-content: space-between;
    width:1200px;
    margin:5px auto;
}

footer a {
  color:#888;
  font-size:12px;
  display:block;
}

/************** page intérieure ******************/
#bandeau_inter {
  margin-top: 80px;
}

/******** forms *********/
input, select, textarea {
  padding:4px 6px;
  font-family: 'Open Sans', sans-serif;
  font-size:16px;
  border:1px solid #888;
}

.form_element {
  margin:5px 0 10px 0;
}
.form_element div {
  margin:3px 0;
}

textarea {
  width:auto;
  max-width:100%!important;
}

.input_titre {
  width:500px;
  max-width:100%!important;
}
.textarea_resume {
  width:500px;
  height:100px;
  max-width:100%!important;
}
.textarea_texte {
  width:800px;
  max-width:100%!important;
}
input.dater, input.datermin {
  text-align:center;
  width:100px;
}
input.timer {
  text-align:center;
  width:60px;
}
.obligatoire {
  
}
.obligatoire:after {
  content: " *";
  color:#a00;
}
.form-date-label {
  min-width:20px;
  width:auto;
  text-align:center;
  display:inline-block;
}


input[type=submit], a.a_btn, a.a_btn_annuler {
    display: inline-block;
    text-align: center;
    width: auto;
    transition: 0.4s ease-out;
    text-transform: uppercase;
    color: white;
    font-weight: bold;
    cursor:pointer;
    background-color: #183E5C;
    text-decoration: none;
    border:0;
    padding: 4px 8px;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;    
}

input[type=submit]:hover, a.a_btn:hover {
    background-color: #C1B06B;
}

.a_btn_annuler {
 background-color: #A00!important;
}
.a_btn_annuler:hover {
 background-color: #C00!important;
}


/** agenda **/


.slide_agenda {
    margin:10px;
}

.slide_agenda .slide_agenda_haut {
    min-height:200px;
  width:100%;
  height: 200px;
  position:relative;
  overflow:hidden;
}

.slide_agenda_photo {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    transition: all 1s ease-in-out;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}


.slide_agenda:hover .slide_agenda_photo{
 -webkit-transform: scale(1.2);
 -moz-transform: scale(1.2);
 -o-transform: scale(1.2);
 transform: scale(1.2);
}



#agenda_inter {
  display:flex;
  /*justify-content:space-around; */
  flex-wrap:wrap;
}
#agenda_inter .slide_agenda {
  width:24%;
  margin:0 1% 1% 0;
}
#agenda_inter .slide_agenda:nth-child(4n) {
  margin-right:0;
  align-self: flex-end;
  width:25%;
}



.slide_agenda .slide_agenda_haut p{
    text-align:left;
    display: inline-block;
    padding: 5px 10px;
    text-transform: uppercase;
    font-weight: bold;
    /*background: #C1B06B;*/
    color:#444;
    background-color:rgba(255,255,255,0.8);
    font-size: 14px;
    
    position:absolute;
    bottom:0px;
    left:0px;
    transition:0.5s ease-out;
}

.picto_adh {
    
    height:30px;
    width: 30px;
    background-color: rgba(193, 176, 107,0.8);
    background-position: center;
    background-size:cover;
    background-image: url(../images/header_item_adherent.png);
    position:absolute;
    top:5px;
    left:5px;
}

.slide_agenda .slide_agenda_bas {
    background: #EEE;
    margin: 0;
    padding: 10px;
    text-align:left;
    min-height:200px;
    transition:0.5s ease-out;
}

.slide_agenda .slide_agenda_bas p span{
    font-weight: 100;
    text-transform: lowercase;
}

.inscription_wrapper {
    display: block;
    float: right;
    height: 70px;
    width: 70px;
    background: rgba(0,0,0,0.5);/*url(../images/icon_inscription.png);*/
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 40px;
    border-radius: 0 0 0 70px;
}
.inscription {
    display: block;
    float: right;
    height: 50px;
    width: 50px;
    background: url(../images/icon_inscription.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 40px;

}

.picto_inscription {
    
    height:30px;
    width: 30px;
    background-color: rgba(24, 62, 92,0.8);
    background-position: center;
    background-size:80%;
    background-image: url(../images/icon_inscription.png);
    background-repeat:no-repeat;
    position:absolute;
    top:5px;
    right:5px;
}

.slide_agenda .slide_agenda_bas p:first-of-type{
    color: black;
    line-height: 15px;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px;
    text-transform: capitalize;
}
.slide_agenda .slide_agenda_bas h3 {
    color: #183E5C;
    text-transform: uppercase;
    font-size: 16px;
    margin-bottom: 10px;
}
.slide_agenda .slide_agenda_bas p:last-of-type{
    display: inline;
    color: black;
    line-height: 15px;
    font-size: 14px;
    line-height: 25px;
    font-weight: 100;
}

.slide_agenda:hover .slide_agenda_bas {
  background: #ddd;
  
}
.slide_agenda:hover .slide_agenda_haut p{
  background-color: rgba(255,255,255,1);
}


#slide_agenda_recherche {
  padding:10px;
  background-color:#ddd;
}

#slide_agenda_recherche_titre {
    margin: 0px 0px 10px 0;
    color:#fff;
    font-size:16px;
    font-weight:500;
    background-color: #C1B06B;
    padding:5px;
 }
#slide_agenda_recherche_texte {
    margin: 0px 0px 10px 0;
 } 


 /**** info "proposé par"***/
.propose_par {
  display:flex; 
  margin-bottom:10px;
  background-color:rgba(193, 176, 107,0.5);
  padding:10px;
  transition:0.5s;
} 
.propose_par_photo {
  width:50px;
  height:50px;
  background-repeat:no-repeat;
  background-size:contain;
  background-position:center;
  position:relative; 
  margin-right:10px;
} 
.propose_par_infos {

}
.propose_par_infos span {
  color:#666;
}
.propose_par_infos p {
  font-size:20px;
}

.propose_par:hover {
   background-color: rgba(193, 176, 107,0.9);
}

.propose_par:hover * {
   color: #fff;
   transition:0.5s;
}


/* partage */
#partage_icons {
  

}
#partage_icons .conteneur {
  display:flex;
}
.partage_icon {
  display:block;
  background-color:#183E5C;
  
  background-position:center;
  background-repeat:no-repeat;
  background-size:32px;
  width:50px;
  height:50px;
  margin:0 5px 5px 5px;  
  transition: 0.3s ease-out;   
}
.partage_icon:hover {
  background-color:#C1B06B;
}
  .partage_icon[icon=twitter] {
    background-image:url('../images/partage-twitter.png');
  }
  .partage_icon[icon=facebook] {
    background-image:url('../images/partage-facebook.png');
  }
  .partage_icon[icon=linkedin] {
    background-image:url('../images/partage-linkedin.png');
  }  
  
  
/* ------- @NOTE MEDIA RESPONSIVE ----------------| 950px |-------------------- */

@media (max-width: 950px) {
    
    .conteneur_inter {
      margin:10px;
    } 
    
    #partage_icons {
      position:fixed;
      display:block;
      top:75px;
      right:10px;
      z-index:1;
    }   
    #bandeau_accueil_logo .titre_site {
      display:none;
    }
        
    
    #colonnes_inter {
      display:block;
      
    }
    #colonne_gauche {
      width:auto;
      padding-right:0px;
      position:initial;
    }
    
    #colonnes_inter img {
      max-width:100%!important;
      height:auto!important;
    }    
    
    #colonne_gauche_large {
      width:100%;
      position:initial;
    }
    #colonne_droite {
      width:auto;
      padding:10px;
      margin-top:10px;
    }    
    
    /* MENU RESP */
    #menu-respliens a {
        width: 70%;
    }
    /* Section Bandeau Logo */
    #bandeau_accueil_logo .titre_site span:nth-child(2){
        display: inline-block;
    }
    #bandeau_accueil_logo img {
        width: 200px;
        display: block;
        margin-left: 50px;
    }
    #bandeau_accueil_logo > div > div {
        text-align: center;
        width: 300px;
        margin-top: 0;
    }
    #bandeau_accueil_logo > div {
        padding-top: 15px;
    }
    #bandeau_accueil_logo>div>div>div {
        padding-top: 0;
    }
    
    
    /*** agenda ***/
    #agenda_inter .slide_agenda, #agenda_inter .slide_agenda:nth-child(4n) {
      width:48%;
      margin:1%;
    }    
    
    #footer {
      width:100%;
    }
    
    #bas_facebook_contact {
      width:100%;
    }

    footer .conteneur {
      width:auto;
      display:block;
    }
    footer a {
      margin:5px;
    }
    
}
/* ------- MEDIA RESPONSIVE ----------------| 700px |-------------------- */

@media (max-width: 700px) {
    
    /* MENU RESP */
    #menu-respliens a {
        width: 100%;
    }
    
    #connexion-divs {
      display:block;      
    }
    
    #connexion-adherer, #connexion-deja {
      width:auto;
    }
  
  #message_extranet {
    position:relative;
  }    
    

   /********* item fils (menuItemFils.php) **********/
   #item-fils {
     display:flex;
     flex-wrap: wrap;

       
   }
   #item-fils a {
     width:48%;
     margin:1%;

   }
        
    
    #nav_logoScroll {
        visibility: hidden;
    }
    
    .lien_bloc {
        padding-right: 0;
    }
    
    .bandeau {
        padding: 20px;
    }
    
    #bandeau_accueil_logo {
      height:auto;
      background:none!important;
      min-height: 200px;
      box-shadow: none;
    }
    #header_logo {
      float:none;
      margin:auto;
      background-image: url(../images/logo_notabene_baseline.png);
    }
    
    #chemindefer {
        font-size: 12px;
    }    
    

    #footer, #footer_plan {
      display: block;
    }
    
    /*** agenda ***/
    #agenda_inter {
      display:block;
    }
    #agenda_inter .slide_agenda, #agenda_inter .slide_agenda:nth-child(4n) {
      width:auto;
      margin:1%;
    }  
   #agenda_inter .slide_agenda .slide_agenda_bas {
       min-height: 50px;
   }     
   
   #conteneur_sousTitrePage {
    position:relative;
    margin-top:10px;
   }  
   #sousTitrePage {
    font-size:14px;
   }
   
    /* Disparition du p "MENU" */
    header ul li#nav_btn_menu p {
      display: none;
    }
       
   .form-date-label {
     min-width:50px;
   }       
}
/* ------- MEDIA RESPONSIVE ----------------| 450px |-------------------- */

@media (max-width: 450px) {
    

    
    header li#nav_connexion {
      width: 40px!important;    
    }
    
    header li#nav_home {
      display: none;
    }   
    header li#nav_calendrier {
      margin-left:10px;
    }      
}