.diaporama {
	height: 50vh;
}

.diaporama .image, .diaporama  .video{
	display: none;
}

.slider_frame {
	position: relative;
	width: 100vw;
	height: 50vh;
	overflow: hidden;
}

.slide{
	position: absolute;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding-inline: 5%;
	height: 100%;
	transform: translateX(100%);
}

.slide .object {
	position: relative;
	display: flex;
	justify-content: center;
}

.slide .object:first-child {
	width: auto;
	max-width: 90vw;
	max-height: 46vh; 
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);
}

.slide .object video {
	width: auto;
	margin: 0;	
}

.slide.picture .object:active {
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
}

.slide .object .img_button {
	position: absolute;
	bottom: 2vb;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-weight: bold;
	background-color: white;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);
	border-radius: 4vmax;
    font-size: 1.4rem;
    border: none;
    padding: 8px;
    color: #ffa700;
    opacity: 0;
}

.slide .object .img_button::after {
	content: "Cliquer pour Agrandir";
}


.slider_modal {
	position: fixed;
	z-index: 1;
	left: 0px;
	top: 0px;
	width: 100vw;
	height: 100vh;
	justify-content: center;
	background-color: rgb(68 71 39 / 62%);
	display: none;
}

.slider_modal .object {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.slider_modal img {
	width: auto;
	max-width: 90vw;
	max-height: 96vh;
	border: 1vmin solid rgb(242, 242, 242);
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
}

.slider_modal .img_button {
	position: static;
	border-radius: 50%;
	width: 5rem;
	height: 5rem;
	font-size: 5rem;
	font-weight: bold;
	background-color: white;
	box-shadow: 6px 6px 4px rgba(0, 0, 0, 0.6); 
	opacity: 0;
	cursor: pointer;
	margin-top: 1vh;
}

.slider_modal .img_button::after {
	content: "close";
}

.material-icons {
	display: block;
}

.slider_modal .img_button:active {
	box-shadow: 2px 2px 4px rgb(0, 0, 0, 0.6);
}

#btn_prev{
    display: none;
}

#btn_next{
    display: none;
}

@keyframes slide_btn_disp {
	from{
		opacity: 0.7;
	}
	to{
		opacity: 0;
	}
}

@media screen and (min-width: 981px), (orientation: landscape){

	.diaporama {
		display: flex;
		justify-content: space-around;
		align-items: center;
		width: 50vw;
		height: auto;
		margin-bottom: 5%;
	}			

	.slider_frame {
		background-color: rgba(160, 160, 150, 0.7);
		position: relative;
		width: 76%;
		height: 25vw;
		overflow: hidden;
		border-radius: 0.5em;
		box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6) inset;
	}

	.slide {
		position: absolute;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 25vw;
		padding-inline: 0%;
		transform: translateX(100%);
	}

	.slider_modal .object {
		flex-direction: row;
		justify-content: normal;
		align-items: normal;
		margin-block: 2vw;
	}

	.slider_modal .img_button {
		position: absolute;
		opacity: 0;
		top: 1.5vw;
		right: 1.5vw;
		margin-top: 0;
		transition: opacity 300ms ease-in-out;
		animation: slider_modal_btn_disp 500ms 500ms ease-in-out backwards;
	}
	
	.slider_modal .img_button:hover {
		opacity: 1;
	}

	.slide .object:first-child {
		height: 23vw;
		width: auto;
		box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);
	}

	.slide .object .grow-up_indic {
		font-size: 1rem;
	}

	.slider_modal img {
		max-width: 96vw;
	}

	.slider_btn {
		position: relative;
		width: 4.5vw;
		margin-inline: auto;
		background-color: rgba(255, 255, 255, 0.8);
		height: 7vw;
		box-shadow: 0.3vw 0.3vw 0.2vw rgba(0, 0, 0, 0.5);
		transition: transform 200ms ease-in-out;
	}

	.slider_btn:hover {
		transform: scale(1.05);
	}

	.slider_btn:active {
		box-shadow: 0.2vh 0.2vh 0.2vh rgba(0, 0, 0, 0.6);
	}

	.material-icons {
		font-size: 6vw;
	}

	.slider_btn.prev {
		border-radius: 0.3em 0 0 0.3em;
	}

	.slider_btn.prev::before, .slider_btn.prev::after, .slider_btn.next::before, .slider_btn.next::after {
		height: 7vw;
    	position: absolute;
    	width: 4vw;
    	left: -15%;
    	top: 8%;
    	transition: opacity 200ms ease-in-out;
	}

	.slider_btn.prev::before, .slider_btn.prev::after {
		content: "arrow_back_ios_new";
	}

	.slider_btn.next::before, .slider_btn.next::after {
		content: "arrow_forward_ios";
	}

	.slider_btn.prev::before, .slider_btn.next::before {
		color: var(--hover-link-color);
		z-index: 1;
		opacity: 0;
	}

	.slider_btn.prev::after, .slider_btn.next::after {
		z-index: 0;
		opacity: 1;
	}

	.slider_btn.prev:hover::before, .slider_btn.next:hover::before {
    	opacity: 1;   
	}

	.slider_btn.prev:hover::after, .slider_btn.next:hover::after {
    	opacity: 0;
	}

	.slider_btn.next {
		border-radius: 0 0.3em 0.3em 0;
	}
	
	@keyframes slider_modal_btn_disp {
	from{
		opacity: 1;
	}
	to{
		opacity: 0;
	}
}
}