* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
:root{
  --mainpink: #fb9dab;
  --mainred: #e53935;
  --fonttitle: "Sacramento", cursive;
  --fonttext: "Alice", serif;
}
.imgAccueil {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
  /* changer la height par rapport à la navbar */
	background-size: cover;
}
h2 {
  margin-top : 175px;
  font-family: var(--fonttitle);
  color: var(--mainred);
  font-size: 50px;
}

.nav-link {
  font-family: "Alice", serif;
  color: var(--mainpink);
  font-size: 25px;
  margin-right: 30px;
}

.nav-link:hover{
  color: var(--mainred);
}
.navbar{
  border-bottom: 2px solid #e53935;
}
.navbar-toggler-icon {
  /* background-color: var(--mainpink); */
  /* color: black; */
  font-size: 30px;
}
h4 {
  font-family: "Open Sans", sans-serif;
}
.btn {
  font-family: var(--fonttext);
}
/*FOOTER */
footer{
  margin-top: 100px;
  background-color: #fb9dab;
  font-size: 20px;
  font-family: "Alice", serif;
  color: white;
  padding: 30px;
}

footer .social-media p{
  margin-right: 25px;
  border: 1px solid #fff;
  border-radius: 100%;
  padding: 3%;
  text-align: center;
  width: 15%;
  cursor: pointer;
}
/* END OF FOOTER */

/* Barre de recherches */
#mySearch{
    border-radius:30px;
    border: 2px solid #fb9dab;
}
/* placer l'icon de shopping-card en dehors de navbar */
.fa-shopping-cart{
  position: absolute;
  display: inline-block;
  right: 0px;
  top: 3rem;
  margin-right: 1rem;
}
.shopping-icon{
margin-top: 10px;
}
/*
la div contenant le panier (.cart)
la class attribuée à la div dans le html. Le panier est caché par defaut
*/
.cart {
  position: absolute;
  min-height: 20rem;
	max-height: 35rem;
  background: pink;
  top: 10rem;
  right: 0;
  transition: all 0.3s ease-in-out;
  background: rgba(255, 255, 255, 0.8);
  width: 0;
  overflow: auto;
}
/*
le panier est visible quand on clique sur l'icon de panier
 */
.show-cart {
  width: 18rem;
  padding: 2rem 1.5rem;
  transform: rotateY(-360deg);
	z-index: 1;
}
/* le bouton dans le panier et le span qui calcule la sommen total sont invisible par defaut */
#btn-in-cart,
#total{
  visibility: hidden;
}
.cart-buttons-container a{
  top: 10rem;
}
.card-title{
  font-size: 18px;
}
.filter-list {
list-style-type: none;
}

/* les icons qui permetent d'ajouter un article dans le panier sont cachés */
.small-shopping-icon{
	visibility: hidden;
}
/* la div qui contient un icon shopping-cart */
.div-small-shopping-icon{
	position: absolute;
	float: right;
	top: 15rem;
	right: 1.3rem;
}
/* Media queries */
@media all and (max-width: 600px) {
   h2{
    font-size: 25px;
  }
	.cart{
		background: rgba(255, 255, 255, .7);
	}
	.fa-shopping-cart{
		scale: .7;
	}
	.btn-background{
		background-color: rgba(251,157,171, .7);
	}
  .shopping-icon{
  margin-top: -30px;
  }
}
@media all and (min-width: 996px) {
	ul{
		margin-left: 10rem;
	}
}