#history-slider {
	background: #282727;
	padding: 120px;
	color: white;
	display: flex;
	overflow-x: scroll;
	scroll-snap-type: x proximity;
}

#history-slider > div {
	max-width: 993px;
	margin-right: 60px;
	flex-shrink: 0;
	scroll-snap-align: center;
}
#history-slider > div:last-child {
	margin-right: 184px;
}

#history-slider h2 {
	font-size: 32px;
	line-height: 1.2;
	margin: 0;
}

#history-slider .slider-header {
	padding: 24px 0;
	display: flex;
	justify-content: space-between;
}

#history-slider .slide-number {
	font-size: 28px;
}

#history-slider .slide-frame {
	border: 2px solid #EE7203;
	border-radius: 30px;
	padding: 60px;
	display: flex;
	height: 566px;
}
#history-slider .slide-frame .desc {
	flex-basis: 40%;
	padding: 0 24px;
}
#history-slider .slide-frame .desc a {
	padding: 12px 40px;
	border: 1px solid #A95102;
	background-color: var(--e-global-color-primary);
	color: var(--e-global-color-3678874) !important;
	font-family: "Inter", Sans-serif;
	font-size: 16px;
	font-weight: 600;
	border-radius: 8px;
	margin: .5em 0;
	display: inline-block;
	width: 100%;
}
#history-slider .slide-frame .desc a:hover  {
	box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 4px #EE7203;
}
#history-slider .slide-frame .illustration {
	flex-basis: 60%;
	margin-left: 24px;
}
#history-slider .slide-frame .illustration img {
	border-radius: 30px;
}

#history-slider .surtitre {
	font-size: 18px;
	line-height: 1.2;
	padding-left: 24px;
	border-left: 4px solid #EE7203;
}

#history-slider h3 {
	text-transform: uppercase;
	font-weight: 700;
	font-family: "Futura", Sans-serif;
	font-size: 24px;
}

.history-slider .navigation button {
	position: absolute;
	z-index: 1;
	top: 52%;
	height: 72px;
	width: 72px;
	padding: 15px;
	background: white;
	border-radius: 100%;
	border: solid 2px #EE7203;
	outline-color: #EE7203;
}
.history-slider .navigation button:hover {
	background: #FDF1E6;
	box-shadow: 0px 0px 0px 2px #FFF, 0px 0px 0px 4px #EE7203;
}
.history-slider .navigation button:disabled {
	display: none;
}
.history-slider .navigation button.prev {
	left: 120px;
}
.history-slider .navigation button.next {
	right: 120px;
}

.history-slider {
	position: relative;
}

.history-slider .navigation:before,
.history-slider .navigation:after {	
	content: "";
	position: absolute;
	height: 100%;
	top: 0;
}
.history-slider .navigation:before {
	left: 0;
	width: 200px;
	background: linear-gradient(90deg, #282727 -13.77%, rgba(40, 39, 39, 0.00) 87.71%);
}
.history-slider .navigation:after {
	right: 0;
	width: 400px;
	background: linear-gradient(-90deg, #282727 -13.77%, rgba(40, 39, 39, 0.00) 87.71%);
}

@media (max-width: 800px) {
	.history-slider .navigation {
		display: none;
	}
	#history-slider {
		scroll-snap-type: x mandatory;
	}
	#history-slider h2 {
		font-size: 24px;
	}
	#history-slider {
		padding: 60px 24px;
	}
	#history-slider > div {
		max-width: calc(100vw - 48px);
	}
	#history-slider .slide-frame {
		flex-direction: column-reverse;
		height: auto;
		/*max-height: calc(100vh - 120px);*/
		padding: 24px;
	}
	#history-slider .slide-frame .desc {
		padding: 24px 0;
	}
	#history-slider .slide-frame .illustration {
		margin-left: 0;
	}
	#history-slider > div:last-child {
		margin-right: 0;
	}
	#history-slider .slide-frame .desc a {
		text-align: center;
	}
}
