@font-face {
	font-family: 'Switzer-Regular';
	src: url(../fonts/Switzer-Regular.woff);
}

@font-face {
	font-family: 'Switzer-Bold';
	src: url(../fonts/Switzer-Bold.woff);
}

@font-face {
	font-family: 'Cabinet-Regular';
	src: url(../fonts/CabinetGrotesk-Medium.otf);
}

:root {

	--fond: #f8eef7;
	--cadre: #80ffac;
	--typo: #100742;
	--ep: 4px;
	--shadow: 0 0 10px 5px rgba(0, 0, 0, .15);

	--header_h: 100px;
	--marges: 20px;
	--width_img: 50%;
	--width_info: 20%;

	--text-normal: 1.2rem;
}

* {
	font-family: 'Cabinet-Regular';
	/* color: var(--typo); */
	font-size: 2vh;
	font-weight: 400;
	box-sizing: border-box;
	margin: 0;
	padding: 0;

	scrollbar-width: thin;
	/* Firefox */
	scrollbar-color: rgba(73, 73, 73, 0.5) transparent;
	line-height: 120%;
}

/* Hide scrollbar for Chrome, Safari and Opera */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background-color: rgba(73, 73, 73, 0.5);
	border-radius: 10px;
	border: transparent;
}


a {
	all: unset;
}

a:hover {
	cursor: pointer;
	text-decoration: underline;

}

body {
	margin: 0px;
	background: var(--fond);
}

h1 {
	margin: 0px;
	font-size: calc(var(--text-normal) + 0.5rem);
}

#header {
	width: calc(100% - var(--header_h));
	height: var(--header_h);
	position: fixed;
	background: var(--fond);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	z-index: 3;
	box-shadow: var(--shadow);
}

#logo {
	margin: auto var(--marges) auto;
}

.Projet {
	width: 100%;
	display: flex;
	flex-direction: row-reverse;
	z-index: 2;
	top: 0px;
}

#firstProjet {
	padding-top: var(--header_h);
}


.BoxImage {
	width: var(--width_img);
	display: flex;
	flex-direction: column;
	z-index: 4;
}

.BoxTexte {
	width: calc(100% - var(--width_img) - var(--width_info));
	margin-right: 0;
	margin-left: 0;
	display: flex;
	flex-direction: column;
}

.Texte {
	z-index: 2;
	padding: var(--marges) 6% var(--marges);
}

.sites_perso {
	font-weight: 700;
}

.ligne {
	font-size: var(--text-normal);
	padding-bottom: 10px;
}

.info-en {
	display: none;
}


.slide-container {
	width: auto;
	position: relative;
	padding-top: var(--marges);
}

.imgBox {
	height: calc(100vh - var(--header_h) - calc(var(--marges) * 2));
	display: none;
	margin-right: 3%;
	margin-left: 3%;
}


.image {
	max-width: 100%;
	max-height: 100%;
	margin: auto;
	object-position: center;
	display: block;
	user-select: none;
}


.prev,
.next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 45%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15vw;
	background-color: rgba(0, 0, 0, 0);
}

.prev {
	left: 0px;
	cursor: url("../img/cursorL.svg"), auto !important;

}

.next {
	right: 0px;
	cursor: url("../img/cursorR.svg"), auto !important;
}

.prev:hover,
.next:hover {
	color: var(--typo);
}

.active {
	text-decoration: underline;
}

#fr,
#en {
	cursor: pointer;
}

/* BOXES */
.BoxMain {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
	position: fixed;
	background-color: transparent;
	z-index: 3;
	top: 0;
	pointer-events: none;
}


#lang_switch,
#liens {
	padding-bottom: 10px;
}

.BoxInfosBackground {
	padding-top: var(--header_h);
	box-shadow: var(--shadow);
	background-color: transparent;
	padding: calc(var(--header_h) + var(--marges)) 1% var(--marges);
	width: var(--width_info);
	height: 100vh;
	top: 0px;
	z-index: 1;
	position: fixed;
	overflow-y: scroll;
}

p {
	margin: 0;
}

.BoxTexteBackground {
	background-color: transparent;
	flex: calc(100% - var(--width_img));
	height: 100%;
}

.BoxImageBackground {
	box-shadow: var(--shadow);
	background-color: var(--fond);
	width: var(--width_img);
	height: 100vh;
	left: 50%;
	top: 0px;
	z-index: 1;
}

.BoxFooter {
	display: none;
}

footer {
	padding-left: calc(var(--marges) + var(--width_info));
	margin-bottom: 10px;
}

#footerText {
	color: var(--fond) !important;
}

/* //////// */