.box_cat{
	width: 100%;
	position: sticky;
	top:0;
	background: white;
}

.categorie{
	width: 90%;
	height: 100%;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin:1% auto;
	text-decoration: none;
	padding: 0;
	background: white;
	border-radius: 5px; 
}

.categorie_button{
	width: 20%;
	height: 8vw;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100%;
	transition-duration: 0.5s;
	overflow: hidden;
}
.categorie_button:hover{
	width: 21%;
	height: 9vw;
	border-radius: 5px;
}
.categorie_button:hover .clic{
	font-size: 1.5em;
}
.left{
	border-radius: 5px 0 0 5px;
}
.right{
	border-radius: 0 5px 5px 0;
}
.clic{
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	text-decoration: none;
	color: white;
	transition-duration: 0.5s;
	text-shadow:  0px 0px 5px black;
	font-size: 1.1em;
}
.img1{
	background-image: url(../img/creations/categorie/img1.png);
}
.img2{
	background-image: url(../img/creations/categorie/img2.png);
}
.img3{
	background-image: url(../img/creations/categorie/img3.png);	
}
.img4{
	background-image: url(../img/creations/categorie/img4.png);	
}
.img5{
	background-image: url(../img/creations/categorie/img5.png);	
}

.img6{
	background-image: url(../img/creations/categorie/img6.png);	
}

.clic:hover{
	cursor: pointer;
}

.actif{
	width: 21%;
	border-radius: 5px;
}
.actif .clic{
	font-size: 1.5em;
}

.contenu{
	display: none;
	width: 100%;
}
.contenu.actif{
	display: block;
}
.box_contenu{
	display: flex;
	flex-direction: column;
	width: 100%;
	margin: auto;
	padding-top:2%; 
}

.filtre{
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.3);
	display: flex;
}

.box_objet{
	margin: auto;
	width: 90%;
	list-style: none;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.objet{
	width: 100%;
	display: flex;
	align-items: center;
	margin-bottom: 2%;
	background-color: rgb(197,172,72);
	box-shadow: 3px 3px 15px rgba(0,0,0,0.5);
}

.side{
	width: 50%;
}


.inside{
	width: 90%;
	margin: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.img_objet{
	width: 50%;
	
}

.trait{
	width: 100%;
	height: 1px;
	background-color: black;
	margin: auto;
}

.description{
	width: 90%;
	margin: auto;
}

.dispo{
	width: 90%;
	margin: auto;
	padding-top: 2%;
	font-style: italic;
}

.oui{
	display: block;
}

.non{
	display: none;
}

h2{
	font-style: italic;
}
@media all and (max-width: 1024px){
	.box_cat{
		top:14vw;
		padding: 10px;
	}
	.categorie{
		width: 100%;
		flex-direction: column;
		justify-content: space-around;
	}
	.categorie li{
		width: 100%;
		transition-duration: 0.5s;
	}
	.categorie li.actif{
		font-weight: bold;
	}
	.deroul{
		display: none;
	}
	.choix{
		width: 50px;
		height: 50px;
		border-bottom: 5px solid rgb(196,38,2);
		border-right: 5px solid rgb(196,38,2);
		transform: rotate(45deg);
	}
	.clic{
		color: rgb(196,38,2);
		text-shadow: none;
		font-size: 3em;
		padding: 2%;
	}
	.actif .clic{
		font-size: 3em;
	}
	.img1{
		background: unset;
	}
	.img2{
		background: unset;
	}
	.img3{
		background: unset;
	}
	.img4{
		background: unset;
	}
	.img5{
		background: unset;
	}
	.left,
	.right{
		border-radius: 0;
	}
	.objet{
		flex-direction: column;
	}
	.img_objet{
		width: 100%;
	}
	h2{
		width: 100%;
		font-size: 2.8em;
		text-align: center;
	}
	.description{
		font-size: 2.4em;
		text-align: justify;
	}
	.side{
		width: 100%;
	}
	.dispo{
		text-align: center;
	}
}