@charset "utf-8";
/* CSS Document */

.btn1
{
 text-decoration: none;
}

.btn2
{
 text-decoration: none;
}
.btn3
{
 text-decoration: none;
}
#conteneur
{
    display: flex;
	flex-direction:column;
	/*justify-content: center; pas besoin si non aligne au centre avec axe principal verticale cest a dire il y aura les marges aux niveaux de la tête et du pied*/
    align-items: center;
	background-color:white;
	/*margin:0px 0px 0px 0px;*/
}

.vert
{
	/*background-color:#090;*/
	/*background: url('images/vietviet.jpg')no-repeat;*/
	width:900px;
	height:198px;
}

.jaune
{
	background-color:#FC3;
	width:900px;
	height:80px;
}

.red
{   
    position:relative; 
	background-color:#900;
	width:900px;
	height:2200px;
	
	
}
.center {
  width:880px;
  /*height::100%;*/
  margin-top: 50px;
  /*margin-left: 10px;
  margin-right: 10px;*/
  position: absolute;
  top: 0px;
  /*left:50%;*/
  /*-ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);*/
  /*background-color:white;*/
  display: flex;
  flex-direction:column;
  align-items: center;
  }


.btn1{
	/*position:absolute;
	top: 20%;
	left: 50%;
	/*transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);*/
	background-color: rgba(255, 180, 9, 0.8);
	color: black;
	font-size: 45px;
	padding: 39px 90px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
	
	margin-bottom:45px;
}	
.btn2{
	
	/*position:absolute;
	top:30%;
	left: 50%;*/

	background-color: rgba(255, 233, 9, 0.8);
	color: black;
	font-size: 45px;
	padding: 39px 90px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
	
	margin-bottom:45px;
	}
.btn3{
	/*position:absolute;
	top: 40%;
	left: 50%;*/

	background-color: rgba(214, 255, 9, 0.8);
	color: black;
	font-size: 40px;
	padding: 39px 90px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
	margin-bottom:45px;
}	
.btn1:hover {
  background-color:black;
  color: white;
}

.btn2:hover {
  background-color:black;
  color: white;
}

.btn3:hover {
  background-color: black;
  color: white;
}
@media screen and (max-width:768px)
{
	.vert
   {
	
	/*background: url('images/vietviet.jpg')no-repeat;*/
	background:#C0C;
	/*margin:0;*/

	width:100%;
	/*--width:100%;
	height:calc (var(--width,30%)/4.5454); marche pas sur IEXPORER mais tres bien sur d'autre navigateur*/
	height:30%;
   }
   .viet
   {
	   object-fit:fill;
	   width:100%;
	   /*height:110;*/
	   
	   }
.jaune
{
	background-color:#FC3;
	width:100%;
	height:15%;
}
.restauration
   {
	   object-fit:fill;
	   width:100%;
	   /*height:110;*/
	   
	   }
.red
{
	position:relative;
	background-color:#900;
	width:100%;
	height:55%;
	/*height:110px;*/
	
	}
.nouille
{
	object-fit:fill;
	width:100%;
	
}
.center
{   margin-top: 20px;
	width:100%;
	}

.btn1{
	font-size: 24px;
	padding: 24px 45px;
    margin-bottom:15px;
}

.btn2{
	font-size: 24px;
	padding: 24px 45px;
    margin-bottom:15px;
}
.btn3{
	font-size: 24px;
	padding: 24px 45px;
    margin-bottom:15px;
}

/*.btn1{
    position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	background-color: #f1f1f1;
	color: black;
	font-size: 16px;
	padding: 16px 30px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
}
.btn2{
	position:absolute;
	top: 50%;
	left: 50%;

	background-color: #f1f1f1;
	color: black;
	font-size: 16px;
	padding: 16px 30px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
	}
.btn3{
	position:absolute;
	top: 50%;
	left: 50%;

	background-color: #f1f1f1;
	color: black;
	font-size: 16px;
	padding: 16px 30px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
}	
.btn1:hover {
  background-color: black;
  color: white;
}

.btn2:hover {
  background-color: black;
  color: white;
}

.btn3:hover {
  background-color: black;
  color: white;
}*/
}