@import "fonts.css";


/* GLOBAL */

html{
  font-size:100%;
  font-family: 'berlin','roboto','open_sansregular';
  font-weight: 600;
  letter-spacing : 0.1em;
  color : black;
}

a{color : white;}

body{
  font-size :0.76em;
	display : flex;
  justify-content: center;
}

.page{
  min-width: 100%;
  min-height: 100%;
  position : absolute;
  top : 0;
  left : 0;
  display : flex;
  justify-content: space-between;
  flex-direction: column;
}

.allexceptfooter{
  display: flex;
  flex-direction: column;
  min-height: 100%;
}





/* HEADER */

header{
  background-color : white;
  width : 100%;
  display: flex;
  height: 6em;
}

.headercontent{
  display: flex;
  flex-direction : row;
  align-items: flex-end;
  align-content: center;
  justify-content: space-between;
}

#IMGfred-logo{
  height: 6em;
  width: auto;
  margin-left : 3em;
}

#iconmenu-box{
  display: flex;
  flex-direction: row;
  justify-content: right;
  margin-right : 3em;
  text-align : right;
  align-items: flex-end;
  height: 3em;
  overflow: visible;
}

.iconmenu{
  height: 3em;
  margin-left : 1em;
}





/* MENU */

nav{
  background-color: white;
  display: flex;
  flex-direction: row;
  justify-content: center; 
  font-size : 1.2em;
}

.navcontent{
  display: flex;
  flex-direction: row;
}

nav.fixednav{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: center; 
  box-shadow: 3px 3px 2px var(--grislogo);
  -webkit-box-shadow: 3px 3px 2px var(--grislogo);
  -moz-box-shadow: 3px 3px 2px var(--grislogo);
}

#logomenu{
  display: none;
  height: 3em;
}

#menus-box{
  display: flex;
  flex-direction: column;
  width : 100%;
}

.liste_menu{
  display : flex;
  flex : 5;
  flex-direction : row;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  height: 4em;
  overflow: hidden;
}

#menuhomelogo{
  height: 1.1em;
}

.items{
  color: var(--grislogo);
  font-size : 1.4em;
  text-align: center;
  flex : 1;
  padding-top : 0.3em;
  padding-bottom : 0.3em;
}

.items:hover{
  color : white;
}

.items:hover{
  background-color : var(--bleulogo);
  border-radius: 40px;
}

#menuoffre{
  display: flex;
}

#menuoffre-gauche{
  background-color : var(--bleulogo);
  border-radius: 40px 0 0 40px;
}

#menuoffre-centre{
  background-color : var(--bleulogo);
  border-radius: 0 0 0 0;
}

#menuoffre-droite{
  background-color : var(--bleulogo);
  border-radius: 0 40px 40px 0;
}

#menutotoggle{
  width : 100%;
  height : 4em;
  display: none;
  margin-top : -0.5em;
}

.space{
  display: flex;
  flex: 1;
}






/* DIAPORAMA */ 

.fade {
  animation-name: fade;
  animation-duration: 7s;
}

@-webkit-keyframes fade {
  0%   {opacity: 0;}
  10%  {opacity: 1;}
  90%  {opacity: 1;}
  100% {opacity: 0;}
}

@keyframes fade {
  0%   {opacity: 0;}
  10%  {opacity: 1;}
  90%  {opacity: 1;}
  100% {opacity: 0;}
}


#stop-flexbox{
  display: flex;
  flex : 1;
  position: relative;
}

.slideshow-container{
  display: flex;
  flex : 1;
  position: relative;
  height: 500px;
  overflow: hidden;
}

/*
.mySlides{
  display: flex;
  flex : 1;
}
.img-slides{
  overflow: hidden;
  display: flex;
  min-width : 100%;
  min-height: 100%;
  align-self: flex-end;
}
*/

.mySlides{
  width: 100%;
}

.img-slides{
  width : 100%;
  height: 100%;
  object-fit: cover;
}

/*
object-fit property :
fill: this is the default value which stretches the image to fit the content box, regardless of its aspect-ratio.
contain: increases or decreases the size of the image to fill the box whilst preserving its aspect-ratio.
cover: the image will fill the height and width of its box, once again maintaining its aspect ratio but often cropping the image in the process.
none: image will ignore the height and width of the parent and retain its original size.
scale-down: the image will compare the difference between none and contain in order to find the smallest concrete object size.
*/

.surdiapomontagne{
  position: absolute;  
  left: 28%;                        /* horizontal alignment */
  top: 45%;                         /* vertical alignment */
  transform: translate(-50%, -50%); /* precise centering; see link below */
  z-index: 2; 
  display: flex;
  overflow: visible;
  flex-direction: row;
  justify-content: flex-end;
}

.surdiapoboussole{
  position: absolute;  
  left: 68%;                       /* horizontal alignment */
  top: 45%;                         /* vertical alignment */
  transform: translate(-50%, -50%); /* precise centering; see link below */
  z-index: 2; 
  display: flex;
  overflow: visible;
  flex-direction: row;
  justify-content: flex-end;
}

.surdiapobateau{
  position: absolute;  
  left: 42%;                        /* horizontal alignment */
  top: 45%;                         /* vertical alignment */
  transform: translate(-50%, -50%); /* precise centering; see link below */
  z-index: 2; 
  display: flex;
  overflow: visible;
  flex-direction: row;
  justify-content: flex-end;
}

.citationdiapo{
  font-family : 'lobster';
  color : white;
  text-shadow: 1px 3px var(--grislogo);
  display: flex;
  flex-direction: column;
  overflow: visible;
  min-width : 26em;
}

.citationdiapo-citation{
  text-align: left;
  font-size : 4em;
  word-wrap: break-word;
}

.citationdiapo-auteur{
  font-family: 'lobster-regular','lobster';
  font-size: 2em;
  text-align: right;
}








/* DEBUT DES RUBRIQUES */

.titre-rubrique{
  font-size: 2.5em;
}

/* ICONES */

#background-icons{
  display: flex;
  background-color : var(--bleulogo);
  padding-top : var(--toppaddingrubrique);
  padding-bottom: var(--bottompaddingrubrique);
  color : white;
}

.row{
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

.icon-box{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top : 0.5em;
  padding-bottom : 0.5em;
  font-size: 1.2em;
}

.icon-box:hover{
  box-shadow:inset 0px 0px 0px 3px white;
  border-radius: 10px;
}

.icons{
  width : 130px;
  display: flex;
  flex : 1;
  margin-bottom : 0.4em;
}

.icon-subtitle{
  font-size: 1.7em;
  max-width: 80%;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.icon-subtitle-title{
  text-align: center;
  max-width: 80%;
  font-size: 1.5em;
}













/* CHIFFRES */

#background-chiffres{
  background-color : white;
  padding-top : var(--toppaddingrubrique);
  padding-bottom: var(--bottompaddingrubrique);
}

.chiffres-tousbox{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.chiffre-box{
  width : 20%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  text-align: center;
  font-size: 1.2em;
}

.chiffre{
  font-size: 4em;
}

.chiffre-box:hover{
  color : var(--bleulogo);
}

.chiffre-subtitle{
  font-size : 1.5em;
}





/* PAROLES */

#background-paroles{
  background-color : var(--bleulogo);
  padding-top : var(--toppaddingrubrique);
  padding-bottom: var(--bottompaddingrubrique);
  display: flex;
  color : white;
}

.paroles-toutesbox{
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: space-around;
}

.parole-box{
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  max-width: 70%;
  margin-left : 1.2em;
  text-align : left;
  font-size : 1.6em;
  margin-bottom : 1.3em;
}

.parole-theme{
  font-size : 1.3em;
  margin-bottom : 0.6em;
}

.parole{
  text-align: justify;
}

.parole-auteur{
  margin-left : 1em;
  color : black;
  width: 100%;
  text-align : right;
}



/* BLOG */

#background-blog{
  background-color : white;
  padding-top : var(--toppaddingrubrique) ;
  padding-bottom: var(--bottompaddingrubrique);
  
}

.blogtousliens-box{
  font-size : 1.6em;
}




/* FOOTER */

footer{
  background-color: var(--grislogo);
  padding-top : calc(var(--toppaddingrubrique)/2);
  display: flex;
  z-index : 3;
}

#content-footer{
  display : flex;
  flex-direction:row;
  justify-content: center;
  align-content: center;
  align-items: center;
  height : auto;
  max-height: 10%;
  width: 100%;
  padding-top : 1em;
}

.footer-vertical{
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.iconfooter-box{
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.iconfooter{
  margin : 1em;
  width : var(--smalllogo);
  height: var(--smalllogo);
}

#lacestmondiv{
  font-size : 0.9em;
  color : white; 
  margin-bottom : 3em;
  width: 100%;
  text-align: center;
}

#mentionlink:hover{
  font-size : 1.2em;
  color : var(--bleulogo)
}






a:link 
{ 
  text-decoration:none; 
} 

.background{
  width : 100%;
  display: flex;
  justify-content: center;
}

.column{
  width : 80%;
}

:root {
  --bleulogo: #0BBBEF;
  --grislogo: #595857;
  --bleuclair: #d8e9ec;
  --fonddiapo: #eee;
  --bgclair: white;
  --smalllogo: 3em;
  --toppaddingrubrique: 4em;
  --bottompaddingrubrique : 4em;
}

.debutarticles-box{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  width : 100%;
  padding : 1em;
}


/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */
/* FORMATION */

.pageformation{
  display : flex;
  justify-content: center;
}

#background-formationtitre{
  background-color : var(--bleulogo);
  color : white;
  padding-top : calc(var(--toppaddingrubrique)/2);
  padding-bottom: calc(var(--toppaddingrubrique)/2);
}


.formationtitre-box{
  display: flex;
  flex-direction: row;
  margin-left : 2em;
  align-items: center;
}

.formationtitre-text{
  font-size : 3em;
}

#chapeautitre{
  height: 7em;
  width: 7em;
  margin-right : 1.5em;
}

#background-formation{
  padding-top : calc(var(--toppaddingrubrique)/2);
  padding-bottom: var(--bottompaddingrubrique);
  background-color : white;
}

.deuxcolonnes{
  display: flex;
  flex-direction: row;
  width : 100%;
  padding-top : 2em;
  padding-bottom : 2em;
}

.unecolonne{
  display: flex;
  flex-direction: column;
  flex : 1;
  margin: 1em;
  align-items: center;
  justify-content: flex-start;
}

#colonne1{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

#colonne2{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}


#nuage{
  width : 90%;
  background-color : white;
  border : 5px var(--bleulogo) solid;
  border-radius: 0 40px 40px 40px;
  margin-bottom : 2em;
}

#tableau{
  width: 90%;
  display: flex;
  flex-direction : column;
  color :black;
  justify-content: flex-start;
  border : 5px var(--bleulogo) solid;
  border-radius: 0 40px 40px 40px;
}

#tableautitle{
  text-align: center;
  font-size : 2.5em;
  padding : 1em;
}

.deuxblocs{
  display: flex;
  flex-direction: row;
}

.bloc{
  text-align: left;
  display: flex;
  flex-direction: column;
  flex:1;
  font-size : 1.5em;
  padding : 1em;
}

.bloctitle{
  text-align: center;
  font-size : 1.1em;
}


.argument-box{
  display: flex;
  flex-direction: row;
  width : 100%;
  padding : 1em;
  height: 12em;
  align-items: center;
}

.argument-box:hover{
  background-color: var(--bleulogo);
  color : white;
  border-radius: 20px;
}

#boussole-box:hover{
  background-color: var(--bleulogo);
  color : white;
  border-radius: 20px;
}

.argument-icon{
  height: 7em;
  min-width: 7em;
  width: 7em;
  margin-right : 2.5em;
}

.tropgros{
  height: 6em;
  width: 6em;
  min-width: 6em;
  margin-right : 3em;
  margin-left : 0.5em;
}

.argument-text{
  display : flex;
  font-size : 1.5em;
  text-align: justify;
  flex-direction: column;
  justify-content: flex-start;
}

@media screen and (max-width: 1400px) {
  /*css specific to small screens under 1000px width here*/
  .column {
    width: 100%; 
    min-width: 80%;
    margin : 0 1.5em 0 1.5em;
  }

  .deuxcolonnes{
    display: flex;
    flex-direction: column;
    width : 100%;
    justify-content: flex-start;
}

  #nuage{
    width : 70%;
  }
}

#conseilen{
  font-size : 2.5em;
  margin-top: 3em;
  width : 100%;
  text-align: left;
  overflow: visible;
}

#background-stimuli{
  background-color: var(--bleulogo);
  color : white;
  padding-top : var(--toppaddingrubrique);
}

.point-box{
  display: flex;
  flex-direction: row;
  margin-bottom : 3em;
  width : 100%;
  padding : 1em 0 1em 1em;
  height: 12em;
  align-items: center;
}

.point-icon{
  height: 7em;
  width: 7em;
  min-width: 7em;
  margin-right : 1.5em;
}

.point-titletext{
  /*font-size : 1.2em;*/
  font-size : 1.6em;
}

.point-text{
  display : flex;
  flex-direction: column;
  flex : 1;
  font-size : 1.5em;
}

#stimuli-box:hover{
  box-shadow:inset 0px 0px 0px 3px white;
  border-radius: 20px;
}

.cartepostalemontagne{
  background-image: url("../img/diapo/montagne.jpg");
  background-size : cover;
  border : 5px var(--bleulogo) solid;
  margin-top : 2em;
  border-radius: 0 40px 40px 40px;
  width: 90%;
  height : 35em;
}

.cartepostalemontagne-citation-box{
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex : 1;
  padding : 2em;
}

.cartepostalemontagne-citation{
  font-size : 4em;
  width: 100%;
  text-align: center;
}

.cartepostalemontagne-citation-auteur{
  font-size : 2em;
  width: 100%;
  text-align : right;
}

/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */
/* QUISUISJE */

#background-presentation{
  background-color : white;
  padding-top : calc(var(--toppaddingrubrique)/2);
  padding-bottom : var(--bottompaddingrubrique);
}

.strong-box{
  float : right;
  text-align : center;
  max-width: 50%;
  margin : 1em 0 0 2em;
  font-size : 1.4em;
}

#tete{
  border : 5px var(--bleulogo) solid;
  height : 12em;
  border-radius: 50%;
}

.presentation{
  color : black;
  font-size : 1.6em;
  text-align: justify;
  margin-bottom: 1em;
}

#titrequisuisje{
  font-size : 2.5em;
  color : var(--bleulogo);
  text-align: left;
}


/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */
/* PARTENAIRES */

#background-partenaires{
  background-color : white;
  padding-top: calc(var(--toppaddingrubrique)/2);
}

.partenairestous-box{
  display: flex;
  flex-direction: column;
  width : 100%;
}

.partenaire-box{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding-top: var(--toppaddingrubrique);
  padding: 1em;
  margin-top :1em;
  margin-bottom: 1em;
}

.partenaire-box:hover{
  box-shadow:inset 0px 0px 0px 3px var(--bleulogo);
  border-radius: 20px;
}

.imgpartenaire{
  width: 15em;
}

.partenaire-text{
  padding-left : 1em;
  display: flex;
  flex: 1;
  text-align : justify;
  color : var(--grislogo);
  font-size : 1.4em;
}

/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */
/* CONTACT */

#background-contact{
  width : 100%;
}

.iconcontact{
  width: 6em;
}

.contact-box{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding-top: var(--toppaddingrubrique);
  font-size : 1.2em;
  width : 100%;
}

.contact-box:hover{
  color : bleu;
}

.contact-box:hover{
  color : var(--bleulogo);
}

.photobureau-box{
  display: flex;
  flex : 1;
  align-items: center;
  justify-content: center;
}

#photobureau{
  height: 75%;  
  margin-top: var(--toppaddingrubrique);
  border : 5px var(--bleulogo) solid;
  border-radius: 0 40px 40px 40px;
}

.google-maps {
  display: flex;
  height: 600px;
  overflow: hidden;
}

.google-maps iframe {
  display: flex;
  width: 100%;
  height: 600px;
  margin : 0 2em 2em 2em;
}

.contact-text{
  font-size : 1.7em;
  padding-left : 1em;
  display: flex;
  flex: 1;
  text-align : justify;
  color : var(--grislogo);
}

/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */
/* VISION */

#vision-processus{
  display: flex;
  flex-direction: row;
  width : 100%;
  padding : 1em;
  height: 20em;
  align-items: center;
}

#vision-processus:hover{
  background-color: var(--bleulogo);
  color : white;
  border-radius: 20px;
}

.removetopul{
  margin-top : 0px;
  margin-bottom : 0px;
}

#baisser{
  padding-top : 4em;
}

.cartepostalebateau{
  background-image: url("../img/diapo/bateau.jpg");
  background-size : cover;
  border : 5px var(--bleulogo) solid;
  margin-top : 2em;
  border-radius: 0 40px 40px 40px;
  width: 90%;
  height : 25em;
}

.cartepostalebateau-citation-box{
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex : 1;
  padding : 2em;
}

.cartepostalebateau-citation{
  font-size : 3em;
  width: 100%;
  text-align: center;
}

.cartepostalebateau-citation-auteur{
  font-size : 1.5em;
  width: 100%;
  text-align : right;
}

/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */
/* COACHING */

#boussole-box{
  display : flex;
  flex-direction: row;
  height: 18em;
  width : 100%;
  padding : 1em;
  align-items: center;
  margin-top : 1em;
  padding-top : 2em;
  padding-bottom : 2em;
}

#boussoleilead{
  height: 22em;
  width: auto;
  margin-right : 2.5em;
}

.background-coaching-deux{
  background-color: var(--grislogo);
  padding-bottom: calc(var(--toppaddingrubrique)/2);
  color : white;
}

.titre-colonne-coaching{
  font-size : 2em;
  text-align : left;
  margin-bottom : 1em;
}

.marginbottom{
  margin-bottom : 2em;
}

#exempledethemes{
  margin-top : 2em;
}

.cartepostaleboussole{
  background-image: url("../img/diapo/boussole.jpg");
  background-size : cover;
  border : 5px var(--bleulogo) solid;
  margin-top : 2em;
  border-radius: 0 40px 40px 40px;
  width: 90%;
  height : 25em;
}

.cartepostaleboussole-citation-box{
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex : 1;
  padding : 2em;
}

.cartepostaleboussole-citation{
  font-size : 3em;
  width: 100%;
  text-align: center;
}

.cartepostaleboussole-citation-auteur{
  font-size : 1.5em;
  width: 100%;
  text-align : right;
}

/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */
/* BLOG */

.blog-box{
  width: 100%;
  height: 100%;
  padding-top : var(--toppaddingrubrique);
  padding-bottom : var(--bottompaddingrubrique);
  display : flex;
  flex-wrap : wrap;
  justify-content: space-around;
  font-size : 1.2em;
}

.article-box{
  padding : 1em;
  margin : 1em;
  border : 5px var(--bleulogo) solid;
  border-radius: 0 40px 40px 40px;
  width : 25em;
  height: 29em;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.article-box-index{
  font-size : 1.2em;
  padding : 1em;
  margin : 1em;
  border : 5px var(--bleulogo) solid;
  border-radius: 0 40px 40px 40px;
  width : 29em;
  height: 12em;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

.article-box-index:hover{
  border : 5px var(--grislogo) solid;
  border-radius: 0 40px 40px 40px;
}

.article-box:hover{
  border : 5px var(--grislogo) solid;
  border-radius: 0 40px 40px 40px;
}

.article-date{
  font-size : 1.1em;
  text-align: left;
  margin:0;
  padding-bottom: 0.5em;
  color : var(--grislogo);
  width: 100%;
}


.article-titre-box{
  display: flex;
  flex-direction: row;
  height: 4em;
  font-size : 1.6em;
  color : var(--grislogo);
}

.article-icon{
  height: 100%;
  border-radius: 0 20px 20px 20px;
}

.article-titre{
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.article-box-date{
  font-size : 1.1em;
  color : var(--grislogo);
  width: 100%;
  text-align : left;
}

.article-debut-box{
  color : var(--grislogo);
  margin-top : 1em;
}

.article-debut{
  font-size : 1em;
  text-align: justify;
}

.lirelasuite-box{
  color : var(--grislogo);
}

.lirelasuite-text{
  font-size: 1em;
  color : var(--bleulogo);
  text-align: center;
  padding : 0.5em;
}

.lirelasuite-text:hover{
  color: var(--grislogo);
}

#jevouspresente{
  width : 100%;
  color : var(--grislogo);
  font-size : 1.6em;
  text-align: left;
  margin-bottom: 1em;
  margin-left : 1em;
}

#patrouille-grandephoto{
  border : 5px var(--bleulogo) solid;
  height : 16em;
  border-radius: 0 40px 40px 40px;
}

#lien_patrouille{
  color : black;
}

/*
.surdiapomontagne{
  position: absolute;
  left: 28%;
  top: 45%;
  transform: translate(-50%, -50%);
  z-index: 2; 
  display: flex;
  overflow: visible;
  flex-direction: row;
  justify-content: flex-end;
}
*/

strong{
  color : var(--bleulogo);
}