section 
{
  background-color: white;
  padding-top: 5em;
  min-height: 550px;
}
.accueil 
{
  background: url('../img/background_img_sm.jpg') right bottom fixed;
   background-repeat: no-repeat ;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  color:#fff;
  background-position: 100% center;
  font-family: 'Open Sans',Arial,Helvetica,Sans-Serif;
}

/* For width 400px and larger: */
@media only screen and (min-device-width: 500px) {
    .accueil { 
       background-image: url('../img/background_img_lg.jpg'); 
    }
}

.form_avis{
  width: 100%;
  margin: 10px auto;
  padding: 10px;
  border: 1px solid #d9d9d9;

}

form p,
form input[type="submit"] {
  text-align: center;
  font-size: 20px;
}

#wrapper form input[type="submit"] {
  border: 1px solid #d9d9d9;
  background-color: #efefef;
}

input[type="radio"] {
  display: none;
}

label {
  color: grey;
}

.classification {
  direction: rtl;
  unicode-bidi: bidi-override;
}



.rating {
      width: 226px;
      margin-left: 0vh;
      font-size: 30px;
      overflow:hidden;
    }
.rating input {
  float: auto;
  opacity: 0;
  position: absolute;
}
.rating a,
.rating label {
      float:right;
      color: #aaa;
      text-decoration: none;
      -webkit-transition: color .4s;
      -moz-transition: color .4s;
      -o-transition: color .4s;
      transition: color .4s;
      margin-left: 4px;
    }
.rating label:hover ~ label,
.rating input:focus ~ label,
.rating label:hover,
    .rating a:hover,
    .rating a:hover ~ a,
    .rating a:focus,
    .rating a:focus ~ a   {
      color: orange;
      cursor: pointer;
    }
    .rating2 {
      direction: rtl;
    }
    .rating2 a {
      float:none
    }

label.note
{
  color: orange;
}
label.note_gris
{
  color: grey;
}
label.etoile:hover ~ label {
  color: orange;
}

input[type="radio"]:checked ~ label {
  color: orange;
}
.message
{
    padding-bottom: 2%;
    font-size: 1.5em;
    color: white;
}
.confirmation
{
  background-color: #357AB7;

}
.alerte
{
  background-color:   #F7230C;
}
h2
{
  text-align: center;
}
/* bouton FB de la fiche voyage*/
.connexion_fb_com
{
  background-color: #3b5998;
  color: white;
  padding: 10px 15px 10px 15px; 
  font-size: 1.5em;
  border-radius: 10px;

}
a.sans_style:link 
{
    text-decoration: none;
    color: white;
}
a.connexion_fb_com:link 
{
    text-decoration: none;
    color: white;
}
a.connexion_fb_com:hover
{
  color: white;
  background-color: #29487d;
}
/* fb du menu*/
.connexion_fb_nav
{
  background-color: #3b5998;
}
.deconnexion
{
background-color: #ED0000;

}
p
{
  white-space: pre-line;
}
.menu_root
{
  padding: 10px 15px 10px 15px; 
  font-size: 1em;
  border-radius: 10px;
  color: white;
  background-color: black; 
}
.menu_root:hover
{
  background-color: grey;
}
li
{
  list-style-type:none;
  display: inline;
}
a.a_menu_root:link
{
  text-decoration: none;
}
.retour_a_la_ligne
{
  white-space: pre-wrap;
  word-wrap:break-word;
}
.image_liste_voyage
{
  width: 9em;
  height: 7em;

}

p.msg_info
{
  color:orange;
  font-weight: bold;
}

.avis_accueil:hover
{
  background-color:#e6f6ff;
}

.tris_accueil:hover
{
  background-color:#e6f6ff;
}
.image_liste_periodes
{
  width: 12em;
  height: 9em;
}

.navbar-collapse
{
  font-size: 1.3em;
}

.logo_surveillance
{
  max-width: 4em;
  max-height:4em;
  min-width: 4em;
  min-height: 4em;
   
  margin-left: 40%; 

}

.drapeau
{
  max-width: 3.5em;
  max-height:2.2em;
  min-width: 3.5em;
  min-height: 2.2em;

}
.drapeau_petit
{
  max-width: 2em;
  max-height:1.2em;
  min-width: 2em;
  min-height: 1.2em;

}
.tri
{
  font-size: 1.5em;
  font-weight: bold;
}

/* cookies style  (from primFx.com)*/
.cookie-alert {
  position: fixed;
  width: 100%;
  bottom:0%;
  background:#2f2f2f;
  color:#fff;
  padding:10px 15px;
  z-index:100;
}
.cookie-alert a { 
  text-align: center;
  padding:5px 10px;
  text-decoration: none;
  margin-left: 5%;
  background:#46A2D9;
  border: 2px solid #46A2D9;
  color:white;
  transition: all .3s ease;
}
  .cookie-alert a:hover {
     background: #46A2D9;
     color:#2f2f2f;
  }
@media only screen and (max-width:480px) {
  .cookie-alert {
     text-align: center;
     left: 0; right: 0;;
       margin: 0 auto;
     max-width:700px;
     padding:10px 30px;
  }
  .cookie-alert a { 
    display:block;
    width: 80%;
    text-align: center;
    padding:0.5em 2em;
    margin:0 10% 0 10%;
    border-radius: 10px;
    background:transparent;
    border: 2px solid #46A2D9;
    color:#46A2D9;
    transition: all .3s ease;
  }
}

.logo_nav_bar{
  width: 7.8em;
  height:2.7em;
  margin-top: -10%;
  margin-left: -10%;
}

@media screen and (min-width: 800px) {
  .margin_lg_screen {
    margin-left: 7em;
  }
}



.aide-alert {
  position: fixed;
  bottom: 10%;
  right: 24%;
  border-radius: 10px;
  background:white;
  color:black;
  padding:1em 3em 0em;
  width:52%;
  border: 2px solid #46A2D9;
  z-index:100;
}
.aide-alert a { 
  display:block;
  text-align: center;
  padding:0.5em ;
  margin:1% 30% -3% 30%;
  border-radius: 10px;
  background:#46A2D9;
  border: 2px solid #46A2D9;
  color:white;
  transition: all .3s ease;
  text-decoration: none;
}
  .aide-alert a:hover {
     background: transparent;
     color:#2f2f2f;
  }
@media only screen and (max-width:480px) {
  .aide-alert {
     text-align: center;
     left: 0; right: 0;;
       margin: 0 auto;
     
     padding:2% 2.5%  ;
     width: 98%;
     
     bottom: 1%;
  }
  .btn_aide{
  
    margin-bottom: -8%;
    margin-top: -20%;
  }
}


