/*/////DESKTOP-FIRST\\\\\\_*/
/*/////GENERAL\\\\\\_*/
html{
	font-family: sans-serif;
	line-height: 1.15;
	min-height:100%;
}
body{
	display: flex;
	min-height: 100vh;
	flex-direction: column;
	background-image:url(../images/burgerw1.jpg);
}
h1,h2,h3,h4,h5,label,p{
	color:#0083ff;
	text-align:center;
	margin:1.5rem auto;
}
a{
	text-decoration: none;
	color:black;
}
/*/////HEADER\\\\\\_*/
.navbar{
	background-color:#0083ff;
	display:flex;
	flex-direction:row;
	justify-content: space-between;
	padding:1.5rem;
}
.nav-img{
	width:50px;
	height:50px;
	vertical-align: sub;
}
.nav-home{
	font-size:2.5rem;
}
.nav-link{
	font-size:1.5rem;
	padding-top:1rem;
}
.nav-effect{
	transition: 0.3s ease;
}
.nav-effect:hover {
	color:oldlace; 
}
.burgermenu{
	display:none;
}
nav>input,nav>label{
	display:none;
}
#menu-checkbox{
	display:none;
}
.admin{
	color:red;
}
/*/////MAIN\\\\\\_*/
main{
	flex:1;
}
.img-title{
	width:30px;
	height:30px;
	vertical-align: top;
}
#title-product{
	width: 280px;
    background-color: oldlace;
    padding: 1rem;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;
}
#title-fastfood{
	width: 25%;
    background-color: oldlace;
    padding: 1rem;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;	
}
#title-associate{
	width: 28%;
    background-color: oldlace;
    padding: 1rem;
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;	
}
.groupecard{
	display:flex;
	justify-content: space-around;
	flex-wrap:wrap;
}
.card{
	width:250px;
	border:2px #969696 solid;
	box-shadow:10px 10px 5px 0px #999;
	margin: 0 1rem 2.5rem 1rem;
	border-radius: 17px 17px 17px 17px;
	background-color:oldlace;
}
.img-card{
	padding:5%;
	width:90%;
	height:15rem;
}
.text-card-fast{
	padding:5%;
	height:13rem;
}
.text-card-product{
	padding:5%;
	height:7rem;
}
.link-card{
	display:block;
	padding:6px 2px;
	background:#0083ff;
	color:black;
	border-radius:0.5rem;
	width:12rem;
	margin:1rem auto;
	text-align:center;
	transition: 0.3s ease;
}
.link-card:hover{
	color:oldlace;
}
.detail{
	display:block;
	width:60%;
	margin:5rem auto;
	background-color:oldlace;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;
	padding:1rem;
}
.img-detail{
	display:block;
	margin:0 auto;
}
.title-compare{
	width:50%;
	background-color:oldlace;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;
	padding:1rem;
}
.img-compare{
	width:30px;
	height:30px;
	vertical-align: sub;
}
.para-compare{
	text-align:left;
	margin:0.2rem 0;
}
.div-compare{
	display:flex;
	justify-content: space-between;
	background-color:oldlace;
	box-shadow:10px 10px 5px 0px #999;
}
#liste1{
	display:flex;
	flex-direction: column;
}
#liste2{
	display:flex;
	flex-direction: column;
}
.input-radio{
	display:none;
}
.form-login{
	width:70%;
	margin:4rem auto;
	padding:2%;
	background-color:oldlace;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;
}
.form-login>input{
	display:block;
	margin:20px auto;
}
.form-registration{
	width:70%;
	margin:4rem auto;
	background-color:oldlace;
	padding:2%;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:0.5rem;
	border:grey 1px solid;
}
.form-registration>input{
	margin:20px;
}
.input-long{
	width:89.5%;
}
.error-message{
	background-color: red;
    text-align: center;
    border: red 1px solid;
    width: 50%;
    margin: 0 auto;
}
ul{
	width:15%;
	padding-inline-start:0px;
	margin-left:0 40px;
	background-color:darkgrey;
	border:1px solid #0083ff;
	border-radius:0.5rem;
}
ul>li{
	list-style-type: none;
	box-shadow: 1px -1px 3px 0px rgba(0,0,0,0.52);
}
ul>li:hover{
	box-shadow: inset 1px -1px 3px 0px rgba(0,0,0,0.75);
}
#responceOne{
	width:20%;
}

#responceTwo{
	width:20%;
}
#comparateur{
	width:20%;
}
.img-focus{
	display:block;
	height:10rem;
	margin:0 auto;
	width:10rem;
}
.burgerfocus1{
	background-color:#1500ff;
	box-shadow: inset 1px -1px 3px 0px rgba(0,0,0,0.75);
}
.burgerfocus2{
	background-color:#00e9ff;
	box-shadow: inset 1px -1px 3px 0px rgba(0,0,0,0.75);
}
.progress-compare{
	width:100%;
	height:1rem;
}
.compare1{
	width:0%;
	display:inline-block;
	height:1rem;
	background-color:#1500ff;
	transition: 0.3s ease;
}
.compare2{
	width:0%;
	display:inline-block;
	height:1rem;
	background-color:#00e9ff;
	transition: 0.3s ease;
}
#comparateur>h1{
	margin-bottom: 11.5rem;
}
#comparateur>p{
	margin: 4px auto;
}
.displaynone{
	display:none;
}
#responceOne>p{
	color:blue;
}
#responceTwo>p{
	color:#c541c5;
}
.goal{
	width:40%;
	margin:2rem auto;
	padding:2rem;
	background-color:oldlace;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:3.5rem;
	border:grey 1px solid;
}
#classe-accueil{
	margin:5%;
	display:flex;
	justify-content: space-between;
}
.vignette-accueil{
	text-align:center;
	border:2px solid #0083ff;
	background-color:oldlace;
	width:30%;
	border-radius:1rem;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	margin: 5%;
	padding:3%;
	color:#0083ff;
}
.vignette-accueil:hover{
	background-color:#0083ff;
	color:oldlace;
	box-shadow: inset 10px 10px 5px 0px rgba(0,0,0,0.52);
	transition: 0.5s ease;
}
/* flexslider */
.flex{
	display:flex;
	justify-content: space-around;
	align-items: center;
}
.flexslider{
	border:1rem solid #0083ff;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
	border-radius:2rem;
	margin:2%;
	width:25%;
	height:17rem;
	background-color:oldlace;
}
table{
	text-align:left;
	background-color:oldlace;
	border:2px solid #0083ff;
	border-radius:1rem;
	padding:0 1% 1% 1%;
	margin:2% auto;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.52);
}
tbody>tr:hover{
	background-color:grey;
}
.infoprice{
	font-style:italic;
	font-size:0.5rem;
	margin:0 auto;
}
/*/////FOOTER\\\\\\_*/
footer{
	background-color:#0083ff;
	display:flex;
	justify-content: space-around;
	flex-wrap:wrap;
}
footer>p{
	margin:10px;
	color:black;
	width:30%;
}
/* Disposition pour mettre en place menu burger sur version responsive & non visible sur version desktop*/
#hamburger{
	display:none;
}
/*/////TABLETTE\\\\\\_*/
@media 	 (max-width:1023px){
	/* Modification de la navbar pour tablette*/
		nav>input,nav>label{
		display:block;
		}
		.navbar{
		display:flex;
		justify-content: space-between;
		flex-direction:column;
		padding:1.5rem;
		}
		.nav-link{
			display:none;
		}
		/*page home*/
		.flex{
			flex-direction:column;
		}
		.flexslider{
			width:39%;
		}
		#classe-accueil{
			margin:0 auto;
		}
		#displaynonephone{
			display:none;
		}
		.menu-toggle{
			display:inline-block;
			color:black;
			margin:0;
			text-align:left;
			font-size:3rem;
			float:right;
		}
		#menu-checkbox:checked ~ .nav-link{
			display:block;
		}
		#comparateur>h1{
			margin-bottom:13rem;
		}
		.title-compare-responsive{
			height:3.5rem;
		}
	}
	/*/////PHONE\\\\\\_*/
	@media 	 (max-width:425px){
		#classe-accueil{
			flex-direction:column;
		}
		.vignette-accueil{
			margin:10% auto;
			width:60%;
		}
		li{
			font-size:0.5rem;
		}
		.title-compare-responsive{
			font-size:1rem;
			height:5rem;
		}
		.img-focus{
			height:4rem;
			width:4rem;
		}
		#comparateur>h1{
			margin-bottom:8.5rem;
		}
		.mg{
			margin:2.5rem 0 3rem 0;
		}
	}