body{
	background-color: white;
	/* background-image: url(images/accueil.JPG); */
}

html{
	--h1:  #606C5A;
	--h2:  #B0B9A8;
	--menu:  #084A60;
	--btn:  #606C5A;
}


h1{
	background-color:var(--h1);  
	border-right: 2px solid var(--h2);
	border-left: 2px solid var(--h2) ;

	/* test{
	background-color: var(--test1);
	} */
	padding-top: 20px;  
	padding-bottom: 50px;
	margin: auto;
	font-size: 40px;
	text-align: center;
	color: white
}

h2{
	background-color: var(--h2);
	border-right: 2px solid var(--h2);
	border-left: 2px solid var(--h2) ;

	color: white;
	padding: 14px 20px;
	margin: auto;
	border: none;
	cursor: pointer;
	text-align: center;
}


img { 
    margin: 10px; 
	border-radius: 2%;

}

.photo{
	background-color: none;
	display: flex;
    justify-content: center;
	align-items: center;
	border-right: 2px solid var(--h2);
	border-left: 2px solid var(--h2) ;

	/* border: 3px solid;
	border-radius: 30px;
	margin: 30px; */
  }

.explications{
	color:black;
	text-align: center;
}

.ingredients{
	color:black;
	text-align: center;
}

span{
	font-weight: bold;
	color: #111;	
}

a{
	color:white;
	text-decoration:none;
}

a:hover {
	display: block;
	color:white;
	background-color: #111;
	font-weight: bold;
	padding-right: 10px;
	padding-left: 10px;
	text-decoration:none;
	border-radius: 3px;
}

.menu {
	border-right: 2px solid var(--h2);
	border-left: 2px solid var(--h2) ;
    display: flex;             
    justify-content: space-around;
	padding-left: 0px;
	padding-bottom: 15px;
	padding-top: 15px;
	margin: 0px;   
	background-color: var(--menu);  
	font-size: 20px;
	text-align: center;
	text-decoration:none;
}

.menu li {
    list-style-type: none ;       /* Suppression des puces */
}

/* .menu a {
    display:block;                
    min-width: 120px;    
	padding-top: 15px;
	padding-bottom: 15px;
    text-align: center;          
    background-color: #084A62;    
    color: rgb(247, 239, 239);                
    text-decoration: none;       
} */

/* .menu a:hover {
	background-color: #333031;
	color: white;
	border-color: white;
  } */

  .listeDesRecettes {
	display: flex;   
	align-items: center;
	flex-direction: column;
	border-right: 2px solid #084A62;
	border-left: 2px  solid #084A62;
	border-bottom: 2px solid #084A62;
	width: auto;
	color: black;
	text-align: center;
}

.listeDesRecettes a{
	width: auto;
	color: black;
	font-size: 30px; 
}

.listeDesRecettes a:hover {
	display: flex;
	text-align: center;
	color:white;
	font-size: 30px; 
	background-color: #111;
	font-weight: bold;
	border-radius: 3px;
}

.corpsDeRecette{
	background-color: white;
	border-right: 2px solid var(--h2);
	border-left: 2px solid var(--h2) ;
	border-bottom: 2px solid var(--h2);
	font-size: 20px;
	font-style: italic;
}

.login{
	display: flex;   
	align-items: center;
	flex-direction: column;
	border:2px solid rgb(3, 3, 3);
	font-size: 15px;
}

.login a{
	width: auto;
	color: red;
	font-size: 15px; 
}


.arrondie {
-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;
}

input.custom {
	background-color: #084A60;
	color: white;
	padding: 14px 20px;
	margin: 8px 0;
	border: none;
	cursor: pointer;
	width: 100%;
  }

input.custom:hover {
	background-color: red;
	color: black;
	padding: 14px 20px;
	margin: 8px 0;
	border: none;
	cursor: pointer;
	width: 100%;
	}

button {
  background-color: var(--btn);
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
}

.profil{
	margin: 10px 10px 10px 10px;
	padding: 10px 50px 50px 50px;
	border:2px solid black;
	border-radius: 3px;
	font-size: 20px;
	font-style: italic;
}

/* .profil p{
	background-color: rgb(201, 134, 35);
	margin: 10px 10px 10px 10px;
	padding: 10px;
	border:2px solid black;
	border-radius: 3px;
	font-size: 20px;
	font-style: italic;
} */