/* style pour l'en-tête *//************************************************************************************************************/
/* style pour l'en-tête */
/* style pour l'en-tête */

header {

  position: relative;
  top: 16px;
  background-color: #9ac9db;
  margin-top:10px;
  margin-bottom:10px;
  text-align: center;
  width: 100%;
  min-width: 680px;
  height: 140px;
  z-index: 2;
}

header h1 {
  text-align: center;
  border-top: 15px solid #9ac9db;
  line-height: 0px;
  color: #814f46;
  display: inline-block;
  height: 25%;
  min-height: 52px;
  min-width: 450px;
  margin: 32px auto 0;
  padding: 0 7px;
  z-index: 3;
}

header h1:after {
  text-align: center;
  background-color:#814f46 ;
  content: '';
  height: 6px;
  left: 0;
  margin-top: -8px;
  position: absolute;
  width: 100%;
  z-index: -1;
}

header h2 {
  text-align: right;
  color: white;
  background-color: #9ac9db;
  max-width: 600px;
  margin: -25px 29% 0px;
  width: 55%;
  font-size: 24px;
  font-style: italic;
  font-weight: 400;
}

header p {
  text-align: center;
 }
 
 /* Menu de navigation */ /************************************************************************************************************/
 
nav {
	position: fixed;
	top: 0px;
	padding-top:0px;
	height: 2em;
	font-size: 2x;
	width:100%;
	background-color: #4d4d4d;
	color: #4d4d4d;
	z-index: 2;
	text-align: center;
}

nav li{
	background-color: #814f46;
	border-bottom: 5% solid #814f46;
	border-left: 7px solid #814f46;
	border-right: 7px solid #814f46;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	border-top: 2px solid #814f46;
	padding: 5px 4px 0px;
	margin: 0px -8px 2px 2px;
	display: inline-block;
	vertical-align: top;
	height:75%;
	z-index: 5;
	overflow: visible;
	-moz-box-shadow: 0px 0px 1px 0px #4d4d4d;
	-webkit-box-shadow: 0px 0px 1px 0px #4d4d4d;
	-o-box-shadow: 0px 0px 1px 0px #4d4d4d;
	box-shadow: 0px 0px 1px 0px #4d4d4d;
	transition-duration: 0s;
}

nav li:hover{
	transition-duration: 0.25s;
	margin: 0px -8px 2px 2px;
	border-top: 10px solid #814f46;
	padding: 3px 4px 0px;

}

nav li.page_active {
	font-weight: bold;
	background-color: #814f46;
	border-top: 6px solid #814f46;
	border-left: 7px solid #814f46;
	border-right: 7px solid #814f46;
	margin: 0px -8px -16px 0px;
	padding: 3px 11px 0px;
	vertical-align: top;
	z-index: 5;
	
}

	/*Le bouton hamburger */
.hamburger {
	font-size:30px; 
	color:white;
	cursor:pointer;
}

 /* When the screen is less than 900 pixels wide, hide all list items.*/
@media screen and (max-width:900px) {
	nav.topnav {
		text-align: left;
		list-style-type: none;
		margin: 0px;
		padding: 5px 5px;
		background-color: #4d4d4d;
		border: 5px solid #4d4d4d;
		border-top: 10px solid #4d4d4d;
		border-radius: 0px;
}
	nav.topnav li {
		display: none;
}
		
	nav.topnav li a {
		display: none;
}

header {

  position: relative;
  top: 28px;
  
}

.hamburger {
	font-size:40px;
}
 
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */


	/* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 5; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #4d4d4d; /* Grey*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  margin: 0px;
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

	/* The navigation menu links */
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #a9a9a9;
  display: block;
  transition: 0.3s;
}

	/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}

	/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

	/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
} 

 /* style pour le corps du site */ /************************************************************************************************************/
 /* style pour le corps du site */
 /* style pour le corps du site */
 
body {
  position: relative;
  top: 5px;
  min-width: 800px;
  margin: 1px 1px;
  color: #4d4d4d;
  font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.25em;
  overflow-y: scroll 
}

section {
  text-align: center;
  background-color:#ffffff;
  margin: 0px;
  min-width: 680px;
  border: 1px ridge grey;
  display: block;
  font-size: 16px;
}

article {
  text-align: center;
  margin: 0;
  min-width: 680px;
  width: 100%;
  display: inline-block;
  background-color:#ffffff;
}

div {
  margin: 20px 20px 20px 20px;
  padding: 0px;
  text-align: center;
}


p {
 margin: 10px;
 padding: 0px;
 font-size: 16px;
}

 /* titres */
h1 {
  font-size: 70px;
  font-weight: 400;
}

h2 {
  color: #4d4d4d;
  font-size: 35px;
  font-weight: 400;
  line-height: 1.2em;
  margin: 0.1em 0 0 0;
}

h3 {
  color: #4d4d4d;
  font-size: 22px;
  font-style: italic;
  font-weight: 400;
  margin: 0.3em 0;
}

h4 {
   margin: 0px;
   padding: 0px;
   color: white;
   font-size: 20px;
   font-weight: 400;
}

.titres_accueil  {
  font-size: 50px;
  margin: 0.8em 0 0.35em 0;
  padding: 0 0 0.15em 0;
}

 /* liens et autres spécificités */

a {
  color: white;
  text-decoration: none;
  border-bottom: 0px solid white;
  margin:0px;
}


strong {
	font-size:17px;
}


 /* page d'accueil */ /************************************************************************************************************/
 /* page d'accueil */ /************************************************************************************************************/
 /* page d'accueil */ /************************************************************************************************************/


#banniere {
	background-image: url("img/calcul2.jpg");
	background-attachment: fixed;
	background-position: 0 0, center;
	min-height:50vh;
	display: flex;
	border: 0px solid #ffffff;
	margin: 0px;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: flex-end;
	color: #ffffff;
	opacity: 0.6;
}

#banniere:hover {
    opacity: 1;
	transition-property: opacity;
    transition-duration: 0.5s;
}

#banniere div {
	margin: 10px 20px 25px 20px;
	min-width: 30%;
	max-width: 400px;
	text-align: center;
	border: 0px solid red;
	display: flex;
	flex-direction: column;
	align-items: center;
}

#banniere h2 {
	font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 45px;
	line-height: 1.1em;
	text-align: center;
	padding: 20px 0px 20px 0px;
	margin: 20px 0px 25px 0px;
	border-bottom: 3px solid #ffffff;
	text-align: center;
	color: #ffffff;
  }

#banniere2 {
	background-image: url("img/fond.jpg");
	background-attachment: fixed;
	min-height:35vh;
	color: #ffffff;
	opacity: 0.7;
}

#banniere2:hover {
	opacity: 1;
    transition-property: opacity;
    transition-duration: 0.5s;
}

#banniere2 h2 {
	font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 45px;
	line-height: 1.1em;
	text-align: center;
	padding: 20px 0px 20px 0px;
	margin: 20px 0px 20px 0px;
	color: #ffffff;
	border-bottom: 3px solid #ffffff;
  }
  
#banniere2 div {
	margin: 10px 50px 10px 50px;
	min-width: 30%;
	max-width: 400px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

@media screen and (max-width: 900px)
	{	

	  #banniere {
	  background-image: url("img/calcul.jpg");
	  background-size: 100% 100%;
	  }	
	  #banniere2 {
	  background-size: auto 250%;
	  }
  }
  
@media screen and (min-width: 901px)
  {
		#banniere {
		background-size: 110% 110%;
		}	
		#banniere2 {
	    background-size: 110% 110%;
		}
	}

.menus {
	background-color: white;
	border: 0px solid blue;
	margin: auto;
	padding: 0px;
	min-width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
	align-content: flex-end;
} 


#lexique {
	background-image: url("img/lexique.jpg");
	background-size: auto;
	background-position: center center;
	margin: 0px 0px;
	padding: 0px;
	height: 100%;
	min-height:200px;
	min-width:25vw;
	border: 0px solid red;
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	opacity:0.6;
}

#lexique:hover {
	opacity:1;
    transition-property: opacity;
    transition-duration: 0.5s;
}

#lexique h2 {
	font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 45px;
	line-height: 1.1em;
	text-align: center;
	padding: 20px 0px 20px 0px;
	margin: 20px 0px 20px 0px;
	color: #4d4d4d;
	border-bottom: 3px solid #4d4d4d;
}


#news:hover {
	opacity:1;
    transition-property: opacity;
    transition-duration: 1s;
}

@media screen and (max-width: 900px)
	{	
	
	#news {
	margin: auto;
	padding: 0px;
	color: #4d4d4d;
	border: 0px solid red;
	width:68vw;
	flex:3;
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	opacity:0.7;
}
	
.newstext {
	background-color:white;
	margin: 10px;
	display: flex;
	flex:1;
	min-width:100%;
	flex-direction:column;
	justify-content:space-around;
	align-items: stretch;
	align-content: space-around;
	}

  }
  
@media screen and (min-width: 901px)
  {
#news {
	margin: auto;
	padding: 0px;
	color: #4d4d4d;
	max-width:72vw;
	border: 0px solid red;
	flex:3;
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
	opacity:0.7;
}

.newstext {
	background-color:white;
	margin: 10px;
	display: flex;
	flex:1;
	min-width: 49%;
	max-width: 700px;
	flex-direction:column;
	justify-content:space-around;
	align-items: stretch;
	align-content: space-around;
	}
	}

	
.newstext div {
	text-align: left;
	}	

.newstext .bouton-rose {
	text-align: center;
	align-self: flex-end;
	}	
	
.newsimg {
	flex:1;
	background-color:white;
	margin: auto;
	margin-top: 10px;
	border: 0px solid white;
	max-width: 70%;
	}
	
#news h2 {
	color: white;
	background-color:#814f46;
	font: small-caps bold 110% sans-serif; 
	font-size: 30px;
	line-height: 1.1em;
	margin-left: 20px;
	padding:5px;
	text-align: left;
	align-self: flex-start;
  }

#news h3 {
	color: #4d4d4d;
	font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 35px;
	line-height: 1.1em;
	margin-left: 20px;
	text-align: left;
	align-self: flex-start;
  }
  




 /* infobulles */  /******************************************************************************************************************/
 
a.infobulle{
	position:relative;
	z-index:1;
	text-decoration:none
}
 
a.infobulle:hover{
	z-index:25;
}
 
a.infobulle span{
	display: none
}
 
a.infobulle:hover span{
	display:block;
	position:absolute;
	top:2em; left:2em; width:15em;
	border:1px solid #eaeaea;
	background-color:#f5f5ff;
	color: #0f2a36;
	text-align: left;
	font-weight:none;
	padding:5px;
}


 /* style par défaut pour les tableaux */ /****************************************************************************************************/
 
table {
	min-width: 350px;
	max-width: 850px;
	margin: 2px;
	width:95%;
	color: #4d4d4d;
	text-align: center;
	border-collapse: collapse;
}

tr {
	padding:1px;
	margin: 1px;
	border: 0px solid blue;	
}
	
th , td {

	border-bottom: 0px;
	padding:1px;
	min-width: 35px;
}

th {
	border: 0px;
	border-bottom: 1px dotted #4d4d4d;
}
	
td {
	overflow:hidden;
	border: 0px solid;	
}

/* Page de news*/ /****************************************************************************************************/
/* Page de news*/
/* Page de news*/

div.news {
	flex-wrap: wrap;	

}

fieldset.news{
	width:100%;
	max-width:100%;
	margin: 0px;
	display: flex;
	flex-wrap: wrap;	
	justify-content: space-around;
	align-items: flex-start;
	align-content: flex-end;
}

fieldset.az{
	width:400px;
	max-width:100%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;	
	justify-content: center;
	align-items: flex-start;
	align-content: flex-end;
}

h3.news{
	text-align: left;
	font-size: 30px;
	font-style: italic;
	font-weight: 400;
	margin: 0.3em 0;
}


/* Formulaires personnalisés*/ /****************************************************************************************************/
/* Formulaires personnalisés*/
/* Formulaires personnalisés*/

select {
	border: 0px;
	border-bottom: 1px solid #9ac9db;
	border-left: 4px solid #9ac9db;
	color:#0f2a36;
}

.select {
	display: inline-block;
	float: left;
	margin: 4px;
	padding: 0px;
	width:228px;
	height:38px;
	overflow:hidden;
}

.select select, .select input {
	width:248px;
	height:38px;
	font-size: 1em;
}

input[type="checkbox"]{
	display: inline-block;
	float: left;
	margin-top: 10px;
	padding: 0px;
	width:30px;
	height:30px;
	}

input[type="text"], input[type="number"], input[type="tel"] {
		
	display: inline-block;
	float: left;
	margin: 4px;
	padding: 0px;
	padding-left: 10px;
	width:210px;
	height:38px;
	font-size: 1em;
	border: 0px;
	border-bottom: 1px solid #9ac9db;
	border-left: 4px solid #9ac9db;
	color:#0f2a36;
}

input[type="submit"], button {
	height:40px;
	width:248px;
	margin: 10px;
	background-color:#814f46;
	transition-duration: 0.1s;
    transition-timing-function: linear;
	color:white;
	font: small-caps bold 110% sans-serif; 
	border: 0px;
}

input[type="submit"]:hover , button:hover {
	background-color: #ae7469;
	transform: translateY(-3px);

}

/*********modification formulaire en fonction de l'écran********/
@media only screen and (max-width: 900px)
	{
		label{
		display: none;
		}
		
		header p{
		display: none;	
		}
		
		fieldset {
		display: inline-block;
		}
	}

@media only screen and (min-width: 901px)
	{
		label{
		display: block;
		}
		
		fieldset {
		display: inline-block;
		}
	}

label{
	text-align:left;
	margin-top: 14px;
	color:#dbd2d2;
	font-size:1em;
	/*les options suivantes servent à créer des labels de taille fixe pour les aligner*/
	float: left;
	width: 70px;
	height: 20px;
}

table label{
	margin-top: 0px;
}

hr{
	height: 1px;
	padding: 0;
	border: 0;
	color:#dcdcdc;
	background-color: #dcdcdc;
	size: 1px;
}

.etiquette_de_case{
	width: 250px;
	color:#0f2a36;
	padding-top:5px;
}

.case_a_cocher{
	width: 30px;
	border: 1px solid black;
}

fieldset {
	float:top;
	background-color: white;
	margin: 14px;
	width: 095%;
	max-width: 330px;
	border: 1px solid #9ac9db;
	border-top: 16px solid #9ac9db ; 
	vertical-align:top;
	text-align: center;
}

fieldset p {
	display: inline-block;
	margin: 0px;
	padding: 0px;
	min-width: 300px;
	text-align: left;
}

fieldset p:last-child { 
	text-align: center;
	}

legend {
  font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 19px;
  font-style: bold;
  line-height: 1.25em;
}

fieldset legend{
  font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 19px;
  font-style: bold;
  line-height: 1.25em;
  background-color: white;
  color: #9ac9db;
  border: 4px solid white;
  border-top-left-radius: 8px;
  border-top-right-radius:8px;
}

fieldset a{
  font-size: 19px;
  font-style: bold;
  line-height: 1.25em;
  background-color: white;
  color: #9ac9db;
}

 /* copie/faux éléments de formulaire */

.case_rose {
	border: 0px;
	border-bottom: 1px solid #814f46;
	border-left: 4px solid #814f46;
	display: inline-block;
	float: left;
	margin: 5px;
	padding: 0px;
	padding-top: 5px;
	width:200px;
	height:30px;
	font-size: 120%;
	overflow:hidden;
	color:#0f2a36;
}

.grande_case_rose {
	border: 0px;
	border-bottom: 1px solid #814f46;
	border-left: 1px solid #814f46;
	display: inline-block;
	float: left;
	margin: 3px;
	margin-bottom: 1px;
	padding: 0px;
	padding-left: 5px;
	padding-top: 5px;
	width:360px;
	height:30px;
	font-size: 120%;
	overflow:hidden;
	color:#0f2a36;
	text-align:left;
}

.grande_case_verte {
	border: 0px;
	border-bottom: 1px solid #9ac9db;
	border-left: 4px solid #9ac9db;
	display: inline-block;
	float: left;
	margin: 3px;
	margin-bottom: 1px;
	padding: 0px;
	padding-left: 5px;
	padding-top: 5px;
	width:360px;
	height:30px;
	font-size: 120%;
	overflow:hidden;
	color:#0f2a36;
	text-align:left;
}

.petite_case_rose {
	border: 0px;
	border-bottom: 1px solid #814f46;
	border-left: 4px solid #814f46;
	display: inline-block;
	float: left;
	width: 100px;
	margin: 3px;
	margin-bottom: 1px;
	padding: 0px;
	padding-top: 5px;
	padding-bottom: 0px;
	width:80px;
	height:30px;
	font-size: 120%;
	overflow:hidden;
	color:#0f2a36;
}

.faux_input_rose
{
	display: inline-block;
	height:40px;
	width:228px;
	margin: 10px;
	background-color:#814f46;
	color:white;
	font: small-caps bold 110% sans-serif; 
	border: 0px;
}

.faux_input_vert
{
	display: inline-block;
	height:40px;
	width:228px;
	margin: 10px;
	background-color:#9ac9db;
	color:white;
	font: small-caps bold 110% sans-serif; 
	border: 0px;
	border-top: 10px solid #9ac9db;
}

 /* les div en cercles */ /**********************************menu avec des cercles****************************************************/

 
.cercle_bleu {
	display: inline-block;
	background-color: #9cd3e9;
	max-width: 184px;
	min-width:184px;
	height: 184px;
	text-align: center;
	vertical-align: middle;
	border-collapse: separate;
	border: 92px;
	margin: 8px;
	padding: 20px;
	border-radius: 120px;
}

.cercle_bleu:hover {
	background-color: #9ac9db;
	transition-duration: 0.5s;
	transition-timing-function: ease-in-out;
	-moz-box-shadow: 0px 0px 5px 0px #329a9d;
	-webkit-box-shadow: 0px 0px 5px 0px #329a9d;
	-o-box-shadow: 0px 0px 5px 0px #329a9d;
	box-shadow: 0px 0px 5px 0px #329a9d;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#34cdf9, Direction=NaN, Strength=3);
}

.cercle_rose {
	display: inline-block;
	background-color:#814f46;
	max-width: 184px;
	min-width:184px;
	height: 184px;
	text-align: center;
	vertical-align: middle;
	border-collapse: separate;
	border: 92px;
	margin: 8px;
	padding: 20px;
	border-radius: 120px;
}

.cercle_rose:hover {
	background-color: #ae7469 ;
	transition-duration: 0.5s;
	transition-timing-function: ease-in-out;
	-moz-box-shadow: 0px 0px 5px 0px #ae7469;
	-webkit-box-shadow: 0px 0px 5px 0px #ae7469;
	-o-box-shadow: 0px 0px 5px 0px #ae7469;
	box-shadow: 0px 0px 5px 0px #ae7469;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#ae7469, Direction=NaN, Strength=10);
	}

 /* style pour le pied de page du site */ /****************************************************************************************************/
 
footer  {
  margin:0;
  padding: 4px;
  width:100%;
  background-color: #9ac9db;
  color: white;
  font-family: 'Open Sans', Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
}

footer p {
	font-size: x-small;	
}

#nav_du_footer {
	background-color:#d8cfcf;
	display: flex;
	border: 0px solid white;
	margin: 0px;
	justify-content: space-around;
	flex-wrap: wrap;
	align-items: space-around ;
	
}

#nav_du_footer p {
	text-align: left;	
}


 /* class personnalisées */

.flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: space-evenly;
	align-items: space-around ;
}

.en-tete {
	min-width: 640px;
	text-align: center;
}

.inline {
	display: inline-block;
	float:center;
	vertical-align: middle;
	padding: 0px;
	margin: auto;
}

.non-inline {
	display: block;
}

.aligne_a_gauche {
	text-align: left;
}

.center {
	text-align: center;
}

.left {
	text-align: left;
}
 
.petit {
	min-width: 140px;
	max-width: 180px;
}

.double_taille {
	max-width: 1800px;
	min-width: 800px;
}

.erreur{
	color:#814f46;
	font-weight: bold;
}

input.erreur {
	transition-duration: 0.2s;
	-moz-box-shadow: 0px 0px 8px 0px red;
	-webkit-box-shadow: 0px 0px 8px 0px red;
	-o-box-shadow: 0px 0px 8px 0px red;
	box-shadow: 0px 0px 8px 0px red;
}
	
.consignes {
	min-width: 700px;
}

.transparent {
	min-height: 100px;
	background-color:transparent ;
}

 /*modifications des couleurs */
 

.bordure_rose {
	border-color:#814f46;
}

.texte_rose {
	color:#814f46;
}

.rose {
	color:#814f46;
	border-color:#814f46;	
}

.fond_vert{
	background-color: #9ac9db;
}

.fond_vert:hover{
	background-color: #00ced1;
}

.vert {
	color:#9ac9db;
	border-color:#9ac9db;
}

.bouton-vert   {
	display: inline-block;
	height:30px;
	width:228px;
	margin: 10px;
	background-color:#9ac9db;
	color:white;
	font: small-caps bold 100% sans-serif; 
	border: 0px;
	border-top: 10px solid #9ac9db;
	transition-duration: 0.1s;
    transition-timing-function: linear;
}


.bouton-vert:hover  {
	background-color: #00ced1;
	border-top: 10px solid #00ced1;
	transform: translateY(-3px);
}

.bouton-rose   {
	display: inline-block;
	height:30px;
	width:228px;
	margin: 10px;
	background-color:#814f46;
	color:white;
	font: small-caps bold 100% sans-serif; 
	border: 0px;
	border-top: 10px solid #814f46;
	text-align: center;
	transition-duration: 0.1s;
    transition-timing-function: linear;
}

.bouton-rose:hover  {
	background-color: #ae7469;
	border-top: 10px solid #ae7469;
	transform: translateY(-3px);
}