/* Global */
*{box-sizing: border-box;}
html, body { margin: 0;padding: 0;width: 100%;height: 100%;}
body {font-family: 'Raleway',Arial, Helvetica, sans-serif;line-height: 1.6em !important;font-size: 14px;color: #333;}
section {max-width: 1920px;}
.content {max-width: 1150px;margin: 0 auto;text-align: center !important;}
.ancre {height: 105px;}
a  {color: #ae436e;}


/* Les boutons */
.btn {text-decoration: none;font-weight: 500;padding: 10px 35px;display: inline-block;font-size: 12px;margin: 0 1px;border-radius: 25px;-webkit-border-radius: 25px;letter-spacing: 3px;text-transform: uppercase;-webkit-transition: 0.2s;-o-transition: 0.2s;transition: 0.2s;transition: all 0.2s linear 0s;cursor: pointer;vertical-align: middle;word-wrap: break-word;margin-bottom: 30px;}
.btnwhite { border: 3px solid #000;background: #ffffff !important;color: #000 !important;}
.btnwhite:hover {color: #FFFFFF !important;background: #000 !important;}
.btnwhiteaccroche {border: 3px solid #FFFFFF;background: transparent !important; color: #FFFFFF !important;}
.btnwhiteaccroche:hover{background: white !important;color: black !important;}
.btnpinksoiree{background: #db6b98 !important;color: #ffffff !important;border: 3px solid #db6b98;}
.btnpinksoiree:hover{background: transparent !important;color: ddd !important;}
.btnpinkcongres{background: #db6b98 !important;color: #ffffff !important;border: 3px solid #db6b98;font-weight: 700;}
.btnpinkcongres:hover{background: transparent !important;color: #db6b98 !important;}
.btnpinkpartenaire{background: #db6b98 !important;color: #ffffff !important;border: 3px solid #db6b98;}
.btnpinkpartenaire:hover{background: transparent !important;color: black !important;}
#btn-inscriptions-ouvertes{font-weight: 700;}


/* Barre de séparation */
hr {border-top: 1px solid #db6b98;width: 30%}


/*Header*/
header {position: fixed; top:0;}
.fondTransparent{ width: 100%; height: 100%;background: rgb(55, 55, 55, 0.50);}
#bandeau {position: relative;max-width: 201px;margin: 0 auto;background: none;z-index: 1;background: none;}
#bandeau img {margin: 0 auto; max-width: 201px;}
#bouton-menu{cursor:pointer;width:100%;height:40px;text-align: center;}
#menu{background-color:  rgb(55, 55, 55, 0.50); position: fixed; width: 100%;z-index: 100;top:0;}
#menu ul {margin:auto;text-align: center;padding:0;display:none;}
#menu li{margin:0;list-style-type: none;}
#menu li a{color: white;font-size: 13px;padding: 8px;display: inline-block; text-decoration: none;text-transform: uppercase; font-weight: 500;}
#menu li a:hover{background-color: #ae436e;}


/*section accueil*/
section#accueil{background: url("../images/background/conference-congres.jpg") no-repeat 50% 50%;background-size: cover;}
#accroche {margin: 0 auto;z-index: 200;background: none;max-width: 780px;text-align: center; padding:185px 0;}
p#facebook{color: #e69dba !important;font-weight: 400;letter-spacing: 1px;}
#facebook a{color: #db6b98; text-decoration: none}
p.date{color: #ffffff;font-size: 24px;margin-bottom:12px;font-family: 'Roboto', sans-serif, Arial, sans-serif;font-weight: 400;line-height: 0.6em !important;}
#accroche h1{font-weight: 700;color: #ffffff;font-size: 60px;padding-top: 15px;}


/*le congrès*/
.containerflex {display: inline-flex;flex-direction: row;flex-wrap: wrap;justify-content: space-between;margin: 0 -10px;width: 100%; margin-bottom: 35px;}
h2 { font-size: 26px; margin: 0 0 12px; text-transform: uppercase; font-weight: 700; margin: 70px 0 35px 0; line-height: 1.4em; font-family:'Roboto', sans-serif, Arial;}
.cong-main-container{display: inline-block;vertical-align: top;text-align: center}
div.cong-container{ max-width: 365px !important; height: 690px; vertical-align: top; margin-bottom:50px; box-sizing: border-box;}
div.cong-container-2{max-width: 365px !important;height: auto;box-sizing: border-box;border: none} 
.icon{margin: 0 auto;}
#mot{font-size: 26px; margin: 60px 0 0 40px;font-weight: 400;}
.cong-container img{ max-width: 100%; border: none; border-radius: 5px !important; height: auto;} 
.cong-container-2 img{ max-width: 100%; border: none; border-radius: 5px !important; height: auto; } 
.cong-container h3{ text-align: left; font-size: 16px; font-weight: 600; letter-spacing: 1px; color: #ae436e }
.cong-container, .cong-container-spe, .cong-container-2, .cong-container-2-right p{ padding: 0px 0px; text-align: justify !important;}
.background-flex { background: #22252e none repeat scroll 0 0;}
#sentence p { color: #ddd; font-size: 2em !important; padding: 50px; font-weight: 700; letter-spacing: 3px; line-height: 1.4em;margin-bottom: 0;}
.cong-affiche {max-width: 575px;}
.cong-affiche img {max-width: 100%;margin-top:35px;  margin-left: auto;margin-right: auto;margin-top: 45px;margin-bottom:30px;}
.cong-president { max-width: 575px; text-align: left; padding: 10px 30px; color: #ddd; box-sizing: border-box; margin: 30px 0 30px 0;}
.cong-president p{ margin-bottom: 5px; font-size: 16px;}
p.title{ font-size: 16px; font-weight: 600; letter-spacing: 2px; margin: 25px 0 18px;color: #ae436e !important }
p.title a{text-decoration: none !important;}



/*le programme*/
#dlprogramme {font-size: 20px; font-weight: 800;}
#dlprogramme a{ color: #ae436e; text-decoration: none;}
.bouton-programme{display: inline-block;background: #db6b98 none repeat scroll 0 0;border-color: #db6b98;border-radius: 25px;color: #fff;font-size: 13px;font-weight: 500;padding: 4px 8px;text-decoration: none !important;}
/*.conf_pres{padding: 10px;min-height: 150px; max-width: 750px; margin: 25px auto;background: #f8f8f8 none repeat scroll 0 0;border-radius: 10px;}*/
.conf_pres{padding: 10px; max-width: 750px; margin: 25px auto;background: #f8f8f8 none repeat scroll 0 0;border-radius: 10px;}
.conf_texte{margin-bottom: 20px !important;}
.conf_texte_td{margin-top: 20px !important;text-align: center !important;font-weight: bold !important;}
.conf_texte li {text-align: left;}
.prog h3 {font-size: 20px !important;}
.prog{text-align: left;max-width: 750px;display: block; margin: 35px auto;}
.salle{text-align: left;font-size: 11px;padding-bottom: 15px;font-family: roboto;}
.titre {text-transform: uppercase;color: #595c6a;font-size: 15px;font-weight: 700;text-align: center; }
.heure {color :#db6b98;font-family: "Roboto", sans-serif, Arial, sans-serif}
.intervenant{text-align: right;display: none;}
/*#jour2{display: none;}*/
#sentenceprog { width: 80%;}
#inscription {margin-top: 10px}
#sentenceprog p {color: #242732;font-size: 28px !important;font-weight: 700;line-height: 1.4em;text-align: left;margin-bottom: 0;}
.prog-container{ width: auto; height: auto; box-sizing: border-box; margin-top: 30px;}
.prog-container p{ text-align: center;}.fa { color : #ae436e; margin: 0 auto; transition: transform .3s; /* Animation */ }
.fa:hover { transform: scale(1.2)}
.number { color: #242732; font-size: 60px; font-family: 'Roboto', sans-serif, Arial, sans-serif; margin: 20px 0 30px 0px; font-weight: 100;}
.name { font-weight: 800; color: #db6b98; font-family: 'Roboto', sans-serif, Arial, sans-serif;}


/*ASV la Soirée*/
#soireeasv-background{ background: url("../images/background/2020/pont-de-pierre-bordeaux-1280px.jpg") no-repeat 25% 25%; background-size: cover;}
#soireeasv-background-opacity{ width: 100%; height: 100%; background: rgba(24, 22, 22,0.3
      );}
#textesoiree { margin: 50px 0 0px 0; padding: 250px 0 380px 0;}
.soireeasv h2{ color: rgb(221, 221, 221);}
.soireeasv p { text-align: justify !important; color: rgb(221, 221, 221); padding: 0px 30px; font-size: 16px; font-weight: 500px}
#photosoiree { max-width: 100%; margin: 0 0; padding: 0 0;}


/*Partenaires*/
.partenaires {font-size: 26px;}


/*Infos pratiques*/
.containerflexinfos {display: flex; justify-content: space-around;}
h2.infospratiques {font-size: 26px; margin: 0 0 12px; text-transform: uppercase; font-weight: 700; margin: 35px 0 35px 0; line-height: 1.1em; font-family:'Roboto', sans-serif, Arial;}
h3.titretransports {font-size: 26px !important; font-weight: 700 !important;line-height: 1.1em; font-family:'Roboto', sans-serif, Arial;text-align:center !important;}
.pied {padding-top: 20px;}
#blochebergement{ height: 60px;}
.infospratiques ul{margin: 0px !important;padding: 0px !important}
.infospratiques li{ margin:0px !important;padding: 0px !important; list-style-type: none; font-weight: 500;}
.infospratiques p{ font-weight: 500;font-size: 16px !important;text-align: center !important; }
.infospratiques p a {color:#ae436e;}
.infospratiques a {color:#ae436e;}
.infos-container{ display: inline-block; max-width: 365px !important; margin-right: 10px !important;margin-left: 10px !important;}
.infos-container p { font-weight: 500;font-size: 16px;text-align: left !important; }
#infospratiques-background{ background: url("../images/background/centre-de-congres-de-lyon-1280-px.jpg") no-repeat 50% 50%; background-size: cover;}
#infospratiques-background-opacity{ width: 100%; height: 100%; background: rgba(255 , 255, 255, 0.7);}


/*Inscriptions*/
#inscriptions-background{ background: url("../images/background/background-inscriptions.jpg") no-repeat 70% 90%; background-size: cover;}#inscriptions-background-opacity{ width: 100%; height: 100%; background: rgba(24, 22, 22, 0.7);}#titreinscription{ font-size: 26px; margin: 0 0 12px; text-transform: uppercase; font-weight: 700; margin: 70px 0 35px 0; line-height: 1.4em; font-family:'Roboto', sans-serif, Arial; color: #FFFFFF;}
#contactinscription{ color: #FFFFFF; font-size: 16px;}
.inscriptions-containerflex { display: inline-flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; margin: 0 -10px; width: 100%; padding-top: 25px;}
.inscriptions-container{ max-width: 414px !important; height: 197px !important; box-sizing: border-box; border-radius: 20px; margin-bottom: 40px; }
.produit-containerflex { display: inline-flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; margin: 0 -10px; width: 100%; height: 197px !important;}
.produit { width: 65%; background-color: #ffffff !important; border-top-left-radius: 20px; border-bottom-left-radius: 20px;}
.prix { width: 35%; background-color: #e8e0e0 !important; border-top-right-radius: 20px; border-bottom-right-radius: 20px; height: 200px !important; line-height:200px; cursor: default !important; }
.prix p { text-align: center;}
.prix a { text-decoration: none; color: #242732 !important; font-size: 40px;} 
.prix:hover { background-color: #db6b98 !important;}
.titreproduit { font-size: 1.2em; text-align: left; margin-left: 15px;}.texteproduit{ font-size: 0.90em; line-height: 1.4em !important; text-align: justify; margin-left: 15px; margin-right: 10px;}
.prix p { margin-top: auto; margin-bottom: auto; font-size: 2.2em !important; font-family: Helvetica, sans-serif; }
#dispo{ width: 32%; background-color: #aaa; border-top-right-radius: 20px; border-bottom-right-radius: 20px; height: 197px; cursor: default !important;}
#dispo p{ margin-top: auto; margin-bottom: auto; font-size: 1.3em; font-family: Helvetica, sans-serif; margin-top: 70px; }
.ttc{ font-size: 0.30em;}


/*Contact*/
.ancre-contact {height: 170px;}
#coordonnees{background-color: #d2d6e0 none repeat scroll 0 0 !important;padding-bottom: 30px;}
#coordonnees h3{font-family: 'Roboto', sans-serif, Arial;line-height: 1.2em !important;font-size:20px;}
#coordonnees h4{font-family: 'Roboto', sans-serif, Arial;line-height: 1.2em !important;margin: 10px 0 -5px 0px !important;font-size:18px;}
#coordonnees p{line-height: 1.4em !important; font-size:16px;}
#coordonnees a{color: #ae436e;}
#map {width: 100%;min-height: 500px;}
#map iframe{width:100%;min-height: 500px;}
/*#gmap_canvas img {max-width: none !important;background: none !important;}*/


/*Footer*/
#footer { background: #22252e none repeat scroll 0 0; width: 100%; bottom: 0; margin: 0px; position: relative;height:140px;}
#containerflexfooter {display: flex; justify-content:space-around;align-items:center;height:140px;margin-left: 75px;margin-right: 75px;}
.gauche{display: flex;justify-content: space-between;}
.droite{width: 550px;display: flex;justify-content: space-between;}
#footer p{ text-align: center; color: rgb(221, 221, 221);}
#footer a{ color: rgb(221, 221, 221); text-decoration: none;}
#footer a:hover{ text-decoration: underline;}


/*Mentions légales*/
#mentionslegales {text-align: left !important;} 
#mentionslegales h1 {text-decoration: underline;}
#mentionslegales h2 {text-transform: inherit;} 


/*Media queries*/
@media only screen and (min-width: 580px) {
      #bouton-menu{display:none;}
      #menu ul{display:block !important;}
      #menu li{display:inline-block;margin:0;}
      #bandeau{position: relative;max-width: 201px;margin: 0 auto;background: none;z-index: 1;} 
     /* #titreinscription{display: none;} */}


@media only screen and  (max-width: 580px) {
      #accroche{top: 350px;}
      #accroche h1{line-height: 80px;}
      #menu{background-color:rgb(55, 55, 55, 0.80);}
      #titreinscription{display: none;}
      p.date{line-height: 1.4em !important;}
      .infospratiques p{font-size: 14px !important;text-align: center !important;}}

@media only screen and (max-width: 724px) {
      #accroche { padding:200px 0;}}

@media only screen and (min-width: 780px) {
      #bandeau{position: relative;max-width: 201px;margin: 0 auto;background: none;z-index: 1;}
      .logo{display: inline-block;}
      .logo .texte {display:none; position: absolute;background: white;padding: 15px;border-radius: 12px;box-shadow: 2px 2px 4px #aaa;} }


/*@media(max-width: 786px) {
      /*.logo {position: fixed; top: 0;}
      nav ul { max-height: 0px; } 
      nav.black{ background-color:rgb(55, 55, 55, 0.45); } 
      nav.black ul { background-color:rgb(55, 55, 55, 0.45); }
      .showing { max-height: 34em; }
      nav ul li { box-sizing: border-box; width: 100%; padding: 24px; text-align: center; }
      .menu-icon { display: block; background-color:rgb(55, 55, 55); }} */


/* Gestion des images en background */
@media only screen and (max-width: 480px){#soireeasv-background{ background: url("../images/background/2020/pont-de-pierre-bordeaux-480px.jpg") no-repeat 50% 50%; background-size: cover;}}

@media only screen and (max-width: 736px) {  
      #infospratiques-background{background-color: black;background-size: 100%;}
       #soireeasv-background{ background: url("../images/background/2020/pont-de-pierre-bordeaux-736px.jpg") no-repeat 50% 50%; background-size: cover;}}

@media only screen and (max-width: 980px) {
      #infospratiques-background{background: url("../images/background/centre-de-congres-de-lyon-980-px.jpg") no-repeat 50% 50%;background-size: cover;}
      #soireeasv-background{ background: url("../images/background/2020/pont-de-pierre-bordeaux-980px.jpg") no-repeat 50% 50%; background-size: cover;}}

 @media only screen and (max-width: 1280px) {
      #infospratiques-background{background: url("../images/background/centre-de-congres-de-lyon-1280-px.jpg") no-repeat 50% 50%;background-size: cover;}}


/* Gestion FLEXBOX */

@media only screen and (max-width: 1106px) {
      .containerflex {display: inline-flex;flex-direction: row;flex-wrap: wrap;justify-content: space-around !important;margin: 0 -10px;width: 100%; margin-bottom: 35px;}}

@media only screen and (max-width: 731px) {
      .bouton-programme {margin-bottom: 10px !important;}
      .ancre {height: 5px;}
      .inscriptions-containerflex {justify-content: center !important;padding-top: 0 !important;}
      .inscriptions-container {margin-bottom: 15px;}
      .containerflex {display: inline-flex;flex-direction: row;flex-wrap: wrap;justify-content: center !important;margin: 0 -10px;width: 100%; margin-bottom: 35px;}}

 /* @media  only screen and (max-width: 732px) {
     
    .inscriptions-containerflex {justify-content: center !important;} } */
