html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	text-decoration: none;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

body {
	line-height: 1;
}

ol,
ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

a {
	all: unset;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
}

body {
	font-size: 1.4rem;
}

a,
a:hover,
a:visited {
	color: #131412;
	text-decoration: none;
}

img {
	max-width: 100%;
	height: auto;
}

.break {
	display: block;
	text-align: center;
}

.activeLink {
	color: #fcfbf5;
	text-shadow: 0 0 13px #fcfbf5;
}

.hidden {
	display: none !important;
}

.unclickable {
	pointer-events: none;
	cursor: default;
	opacity: 0;
}

.front {
	z-index: 7;
}

.behind {
	z-index: 6;
}

.red {
	color: #e41313;
	text-shadow: 0px 0 10px #e41313;
}

.black {
	background-color: rgba(20, 18, 19, 0.9);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
	height: 100vh;
	width: 100vw;
	padding: 0 calc((100dvw - (5 * 20px)) / 6) 5vh;
	transition: 1s ease-in-out;
}

.black__close {
	font-family: 'Bricolage Bold', sans-serif;
	position: absolute;
	right: 12%;
	top: calc(calc((100dvh - (5 * 20px)) / 6) / 4);
	font-size: 4rem;
	cursor: pointer;
}

.black .video {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5vh;
	margin-top: calc((100dvh - (5 * 20px)) / 6);
}

.black .video .title {
	font-family: 'Now Black', sans-serif;
	text-align: center;
	text-transform: uppercase;
}

.black .video .iframe__wrapper {
	display: flex;
	align-items: center;
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 2);
}

.black .video iframe {
	width: 100%;
	max-height: 100%;
}

.black .video__description {
	text-align: center;
	height: calc((100dvh - (5 * 20px)) / 6);
	width: 100%;
}

.black .infos {
	display: flex;
	flex-wrap: wrap;
	height: calc((100dvh - 100px) / 6);
	margin-top: 20px;
	font-size: 1.2rem;
	justify-content: space-between;
	align-items: center;
	text-transform: uppercase;
}

.black .infos__wrapper {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}

.black .infos .info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1vh;
}

.black .infos .info__title {
	text-transform: uppercase;
	font-family: 'Bricolage Bold', sans-serif;
}

.black .infos .info--fonction {
	height: 100%;
	text-align: end;
}

.submenu {
	font-family: 'Bricolage Bold', sans-serif;
	color: rgba(255, 255, 255, 0.418);
	text-transform: uppercase;
}

.submenu__active {
	color: #fcfbf5;
	text-shadow: 0px 0 13px #fcfbf5;
	position: relative;
	pointer-events: none;
}

.submenu__active::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 1px;
	background-color: #e41313;
}

.slide {
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 5 + 100px);
	width: 100dvw;
	position: relative;
	transition: 2s ease-in-out;
	background-color: #131412;
}

.slideTitle {
	text-transform: uppercase;
	font-size: 3rem;
	font-family: 'Now Black', sans-serif;
}

.aka {
	position: absolute;
	transition: 2s;
	cursor: pointer;
}

.aka.aka--left {
	transform: translateX(-20vw);
}

.aka.aka--right {
	transform: translateX(20vw);
}

.aka.aka--down {
	transform: translateY(10vh);
}

.aka--wrapper {
	transition: 2s;
}

.aka--wrapper.aka--left {
	transform: translateX(-20vw);
}

.aka--wrapper.aka--right {
	transform: translateX(20vw);
}

.aka--wrapper.aka--down {
	transform: translateY(10vh);
}

.aka--wrapper p {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.left {
	translate: -100dvw;
}

.right {
	translate: 100dvw;
}

.down {
	transform: translateY(100dvh);
}

.noOverflow {
	overflow: hidden;
}

@media screen and (min-width: 700px) {
	.slideTitle {
		font-size: 4rem;
	}
	.submenu {
		font-size: 1.6rem;
	}
	.black .title {
		font-size: 1.6rem;
	}
	.black .video__description {
		font-size: 1.6rem;
	}
	.black .infos {
		font-size: 1.5rem;
	}
}

@media screen and (min-width: 1000px) {
	.slideTitle {
		font-size: 5rem;
	}
	.submenu {
		font-size: 1.8rem;
	}
	.black .title {
		font-size: 2rem;
	}
	.black .video__description {
		font-size: 2rem;
	}
	.black .infos {
		font-size: 1.8rem;
	}
}

@media screen and (min-width: 1440px) {
	.slideTitle {
		font-size: 6rem;
	}
	.slide {
		height: 100dvh;
	}
	.black {
		padding: calc(calc((100dvh - (11 * 20px)) / 12) + 20px) 0 0 calc(calc((100dvw - (11 * 20px)) / 12) * 3 + 60px);
		display: flex;
		gap: calc((100dvw - (11 * 20px)) / 12);
	}
	.black .video {
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 6 + 100px);
		margin-top: 0;
	}
	.black .video .title {
		margin-right: auto;
	}
	.black .video .iframe__wrapper {
		width: 100%;
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 6 + 100px);
	}
	.black .video iframe {
		height: 100%;
		width: 100%;
	}
	.black .video__description {
		text-align: justify;
	}
	.black .infos {
		flex-wrap: nowrap;
		flex-direction: column;
		height: -webkit-fit-content;
		height: -moz-fit-content;
		height: fit-content;
		margin-top: calc(calc((100dvh - (11 * 20px)) / 12) * 2 + 20px);
		font-size: 1.6rem;
		justify-content: inherit;
		align-items: inherit;
	}
	.black .infos .info {
		margin-bottom: 20px;
	}
	.black .infos .info--fonction {
		text-align: inherit;
	}
}

.menu {
	position: absolute;
	height: 100dvh;
	width: 100vw;
	background-color: #e41313;
	color: #131412;
	transition: 1s ease-in;
	text-transform: uppercase;
	font-size: 3rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1px;
	font-family: 'Now Black', sans-serif;
}

.menu__close {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	height: -webkit-fit-content;
	height: -moz-fit-content;
	height: fit-content;
	right: 7vw;
	top: 3vh;
	color: #fcfbf5;
}

.menu__text {
	flex: 1;
	display: flex;
	-webkit-text-orientation: upright;
	text-orientation: upright;
	-webkit-writing-mode: vertical-lr;
	-ms-writing-mode: tb-lr;
	writing-mode: vertical-lr;
	padding-top: 10vh;
	letter-spacing: 25px;
	transform: translateY(110%);
}

.menu__img {
	max-width: 20px;
	transform: translateY(15vh);
}

.menu .menu__border {
	width: 3px;
	height: 100%;
	border: 1px solid #131412;
	position: absolute;
}

.menu .menu__border:nth-child(1) {
	left: calc((100dvw - (5 * 20px)) / 6);
}

.menu .menu__border:nth-child(3) {
	right: calc(calc((100dvw - (5 * 20px)) / 6) * 2 + 20px);
}

.menu .mainColumn {
	width: calc(calc((100dvw - (5 * 20px)) / 6) * 4 + 78px);
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.menu .mainColumn .menu__square {
	width: 100%;
	height: calc(calc((100dvh - (5 * 20px)) / 6) + 20px);
	border-bottom: 3px double #131412;
}

.menu .mainColumn .menu__square:first-child {
	border-top: none;
	height: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
}

.menu .mainColumn .menu__square:last-child {
	flex: 1;
	border-bottom: none;
}

.menu .mainColumn .menu__link {
	display: flex;
	align-items: center;
	transition: 0.5s ease-in;
	overflow: hidden;
}

.menu .mainColumn .menu__link h2 {
	margin-left: calc(calc((100dvw - (5 * 20px)) / 6) + 20px);
	flex: 1;
	transform: translateX(100vw);
}

.menu .thirdcol {
	width: calc(calc((100dvw - (5 * 20px)) / 6) * 2 + 20px);
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-block: 5vh 10vh;
	color: #fcfbf5;
}

.navigation {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: calc(calc((100dvh - (5 * 20px)) / 6) / 3) calc((100dvw - (5 * 20px)) / 6);
	height: calc((100dvh - (5 * 20px)) / 6);
	top: 0;
	left: 0;
	width: 100vw;
	background-color: #131412;
	position: relative;
}

.navigation__logo {
	max-width: 20px;
}

.navigation__burger {
	font-size: 20px;
}

.desktopNavigation {
	display: none;
}

@media screen and (min-width: 1440px) {
	.navigation {
		display: none;
	}
	.desktopNavigation {
		position: relative;
		z-index: 8;
		width: 100%;
		display: flex;
		align-items: center;
		padding-left: calc((100dvw - (11 * 20px)) / 12);
		gap: calc(calc((100dvw - (11 * 20px)) / 12) / 2);
		text-transform: none;
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 2 + 20px);
	}
	.desktopNavigation__img {
		width: calc(calc((100dvw - (11 * 20px)) / 12) + 40px);
		cursor: pointer;
	}
	.desktopNavigation__links {
		display: flex;
		gap: 30px;
		padding-inline: 20px;
		transition: 1s;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
	}
	.desktopNavigation__links .desktopNavigation__link {
		cursor: pointer;
	}
	.underline {
		position: absolute;
		bottom: -5px;
		height: 2px;
		background-color: #e41313;
		transition: left 0.3s, width 0.3s;
		pointer-events: none;
	}
	.reduceNavbar--enter {
		-webkit-animation: reduceNavbar 2s forwards ease-in-out;
		animation: reduceNavbar 2s forwards ease-in-out;
	}
	.reduceNavbar--exit {
		-webkit-animation: reduceNavbar 2s reverse forwards ease-in-out !important;
		animation: reduceNavbar 2s reverse forwards ease-in-out !important;
	}
	.reducedNavbar {
		left: 20%;
		transform: translateX(0);
	}
	@-webkit-keyframes reduceNavbar {
		0% {
			left: 50%;
			transform: translateX(-50%);
		}
		100% {
			left: 20%;
			transform: translateX(0);
		}
	}
	@keyframes reduceNavbar {
		0% {
			left: 50%;
			transform: translateX(-50%);
		}
		100% {
			left: 20%;
			transform: translateX(0);
		}
	}
}

.home {
	position: relative;
}

.home .identity {
	padding: calc(calc((100dvh - (5 * 20px)) / 6) + 20px) 0 0 0;
	display: flex;
	gap: calc(calc((100dvh - (5 * 20px)) / 6) / 3);
	flex-direction: column;
	align-items: center;
}

.home .identity__logo {
	height: calc(calc((100dvh - (5 * 20px)) / 6) + 40px);
	cursor: pointer;
}

.home .identity__logo img {
	height: 100%;
}

.home .identity__title {
	text-transform: uppercase;
	font-size: 1.4rem;
	font-family: 'Stix Regular', sans-serif;
}

.home .opinions {
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	gap: 2vw;
}

.home .opinions i {
	position: absolute;
	z-index: 3;
}

.home .opinions i.fa-chevron-left {
	left: 10%;
}

.home .opinions i.fa-chevron-right {
	right: 10%;
}

.home .opinions .content__wrapper {
	display: flex;
	overflow: hidden;
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 2);
}

.home .opinions .content {
	min-width: 60%;
	margin: 0 20%;
	transition: transform 1s ease-in-out;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	display: flex;
	flex-direction: column;
	padding-bottom: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
	gap: calc(calc((100dvh - (5 * 20px)) / 6) / 3);
}

.home .opinions .content h4 {
	padding-top: 20px;
	font-family: 'Now Black', sans-serif;
	font-size: 1.8rem;
	text-align: center;
}

.home .opinions .content p {
	text-align: center;
	font-size: 1.1rem;
	white-space: normal;
}

.home .aka--wrapper {
	position: absolute;
	top: calc(calc((100dvh - (5 * 20px)) / 6) * 3 + 80px);
	bottom: auto;
	height: calc((100dvh - (5 * 20px)) / 6);
}

.home .aka--wrapper p {
	display: none;
}

.home .aka__cream--wrapper {
	left: 0;
}

.home .aka__cream--wrapper p {
	left: 120%;
	color: #e41313;
}

.home .aka__red--wrapper {
	right: 0;
}

.home .aka__red--wrapper p {
	right: 120%;
}

.home .aka {
	position: static;
	top: auto;
	height: 100%;
}

.home .aka__cream {
	left: 0;
}

.home .aka__red {
	right: 0;
}

@media screen and (min-width: 1440px) {
	.home {
		top: calc(-1 * calc((100dvh - (11 * 20px)) / 12) - calc((100dvh - (11 * 20px)) / 12) - 20px);
	}
	.home .identity {
		padding: 0 0 calc((100dvh - (11 * 20px)) / 12);
		height: 100%;
		gap: 30px;
		justify-content: center;
	}
	.home .identity__logo {
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 40px);
		position: relative;
		/* le triangle de la bulle */
	}
	.home .identity__logo img {
		height: 100%;
	}
	.home .identity__logo::after,
	.home .identity__logo::before {
		opacity: 0;
		transition: 0.5s;
		position: absolute;
	}
	.home .identity__logo::after {
		content: 'ABOUT';
		display: flex;
		align-items: center;
		justify-content: center;
		top: -55px;
		left: 50%;
		transform: translateX(-50%);
		width: calc((100dvw - (11 * 20px)) / 12);
		border-radius: 14px;
		font-size: 22px;
		height: 35px;
		color: rgba(255, 255, 255, 0.58);
		background-color: #343434;
	}
	.home .identity__logo::before {
		content: '';
		top: -20px;
		left: 50%;
		transform: translateX(-50%);
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-top: 8px solid #343434;
	}
	.home .identity__logo:hover::after,
	.home .identity__logo:hover::before {
		opacity: 1;
	}
	.home .identity__title {
		font-size: 1.6rem;
	}
	.home .aka--wrapper {
		position: absolute;
		top: auto;
		bottom: calc(calc((100dvh - (11 * 20px)) / 12) * 4 + 80px);
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3);
	}
	.home .aka--wrapper p {
		position: absolute;
		top: 0;
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3);
		display: flex;
		justify-content: center;
		font-size: 2.2rem;
		-webkit-text-orientation: upright;
		text-orientation: upright;
		-webkit-writing-mode: vertical-lr;
		-ms-writing-mode: tb-lr;
		writing-mode: vertical-lr;
	}
	.home .aka__cream--wrapper {
		left: 0;
	}
	.home .aka__cream--wrapper p {
		left: 120%;
		color: #e41313;
	}
	.home .aka__red--wrapper {
		right: 0;
	}
	.home .aka__red--wrapper p {
		right: 120%;
	}
	.home .aka {
		position: static;
		top: auto;
		bottom: calc(calc((100dvh - (11 * 20px)) / 12) * 4 + 80px);
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3);
	}
	.home .aka__cream {
		left: 0;
	}
	.home .aka__red {
		right: 0;
	}
}

.work {
	top: calc(-100dvh + calc((100dvh - (5 * 20px)) / 6));
	left: 100dvw;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	justify-content: flex-end;
}

.work .presentation {
	align-self: flex-end;
	margin: calc(calc((100dvh - (5 * 20px)) / 6) / 3 + 20px) calc((100dvw - (5 * 20px)) / 6) 0 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 35px;
}

.work .presentation .workMenu {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 12px;
}

.work .presentation .workMenu__link {
	cursor: pointer;
}

.work .projects {
	display: flex;
	border-top: 1px solid #fcfbf5;
	border-bottom: 1px solid #fcfbf5;
	width: 100vw;
	white-space: nowrap;
	overflow: scroll hidden;
	max-height: calc((calc((100dvh - (5 * 20px)) / 6) + 40px) * 2);
}

.work .projects .project {
	min-width: 60vw;
	font-family: 'Bricolage Bold', sans-serif;
}

.work .projects .project__text {
	display: flex;
	justify-content: space-between;
	height: 50%;
	padding: 0 15px 15px;
	align-items: flex-end;
	font-family: 'Now Black', sans-serif;
}

.work .projects .project__text .number {
	font-size: 2.5rem;
	color: rgba(255, 0, 0, 0.5);
}

.work .projects .project__image {
	cursor: pointer;
	height: 50%;
}

.work .projects .project__image img {
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.work .projects .project:nth-child(even) {
	display: flex;
	flex-direction: column-reverse;
}

.work .projects .project:nth-child(even) .project__text {
	align-items: flex-start;
	padding: 15px 15px 0;
	border-top: 1px solid #fcfbf5;
}

.work .projects .project:nth-child(odd) .project__image {
	border-top: 1px solid #fcfbf5;
}

.work .category {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 3rem;
	text-transform: uppercase;
	border-top: 1px solid #fcfbf5;
	min-height: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
	width: 100dvw;
	font-family: 'Now Black', sans-serif;
}

.work .aka {
	opacity: 0;
	left: 0;
}

.work .aka__red {
	height: calc((100dvh - (5 * 20px)) / 6);
	top: calc(calc((100dvh - (5 * 20px)) / 6) * 3 + 80px);
}

.work .aka__cream {
	height: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
	top: calc(calc((100dvh - (5 * 20px)) / 6) * 4 + calc((100dvh - (5 * 20px)) / 6) / 3 + 80px);
}

@media screen and (min-width: 700px) {
	/* .work .projects .project__image img {
		-o-object-position: 0 30%;
		object-position: 0 30%;
	} */
}

@media screen and (min-width: 1000px) {
	.work .projects .project {
		min-width: 40vw;
	}
}

@media screen and (min-width: 1440px) {
	.work {
		top: calc(-100dvh - calc((100dvh - (11 * 20px)) / 12) - calc((100dvh - (11 * 20px)) / 12) - 20px);
		height: 100dvh;
		flex-direction: row;
		align-items: inherit;
	}
	.work .presentation {
		flex: 1;
		margin: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 60px) 0 0 calc(calc((100dvw - (11 * 20px)) / 12) * 2 + 40px);
		-ms-grid-row-align: inherit;
		align-self: inherit;
		align-items: flex-start;
		gap: calc((100dvh - (11 * 20px)) / 12);
	}
	.work .presentation .workMenu {
		align-items: flex-start;
		gap: calc(calc((100dvh - (11 * 20px)) / 12) / 2);
	}
	.work .aka__red {
		top: auto;
		bottom: calc(calc((100dvh - (11 * 20px)) / 12) * 4 + 80px);
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3);
	}
	.work .aka__cream {
		top: auto;
		bottom: calc(calc((100dvh - (11 * 20px)) / 12) + 70px);
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 2);
	}
	.work .projects {
		height: 100dvh;
		max-height: inherit;
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 5 + 80px);
		overflow: hidden scroll;
		flex-direction: row-reverse;
		flex-wrap: wrap;
		scrollbar-width: none;
		border-block: none;
		border-inline: 1px solid #fcfbf5;
	}
	.work .projects .project {
		min-width: 50%;
		width: 50%;
		height: -webkit-fit-content;
		height: -moz-fit-content;
		height: fit-content;
	}
	.work .projects .project:first-of-type .project__text {
		height: calc(calc((100dvh - (11 * 20px)) / 12) + 20px) !important;
	}
	.work .projects .project__text {
		width: 100%;
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 4 + 60px);
	}
	.work .projects .project__image {
		width: 100%;
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 80px);
		border-top: none !important;
	}
	.work .projects .project:nth-child(even) {
		flex-direction: column;
	}
	.work .projects .project:nth-child(even) .project__text {
		border-top: none;
		align-items: flex-end;
		padding: 0 15px 15px;
	}
	.work .projects .project:nth-child(odd):not(:first-child) {
		transform: translateY(calc(-1 * (100dvh - 220px) / 12 * 3 - 80px));
	}
	.work .category {
		width: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		border-top: none;
		font-size: 7rem;
	}
	.work .category span {
		-webkit-text-orientation: upright;
		text-orientation: upright;
		-webkit-writing-mode: vertical-lr;
		-ms-writing-mode: tb-lr;
		writing-mode: vertical-lr;
	}
}

.about {
	top: calc(-300dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
	left: 0;
}

.about .content {
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 3 + 80px);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-evenly;
	margin-inline: calc(calc((100dvw - (5 * 20px)) / 6) + 20px);
	padding: 0 5vw;
	gap: 20px;
}

.about .content--first .content__title {
	display: none;
}

.about .content--second .mainOpinion {
	display: none;
}

.about .content--second .content__wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
}

.about .content--second .content__wrapper .opinions .opinion {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7vh;
}

.about .content--second .content__wrapper .opinions .opinion__text {
	font-size: 1.1rem;
	line-height: 1.5rem;
	text-align: center;
}

.about .content--second .content__wrapper .opinions .opinion__title {
	font-size: 2rem;
	font-family: 'Bricolage Bold', sans-serif;
}

.about .content--second .content__wrapper .opinions .opinion .opinionSlider {
	display: flex;
	height: calc((100dvh - (5 * 20px)) / 6);
	width: calc(calc((100dvw - (5 * 20px)) / 6) * 4 + 60px);
	justify-content: space-between;
	align-items: center;
}

.about .content--second .content__wrapper .opinions .opinion .opinionSlider i {
	font-size: 3rem;
	color: rgba(255, 255, 255, 0.418);
	transition: 1s ease-in-out;
}

.about .content--second .content__wrapper .opinions .opinion .opinionSlider img {
	height: calc((100dvh - (5 * 20px)) / 6);
}

.about .content--second .content__wrapper .desktopOpinions {
	display: none;
}

.about .content .content__img {
	/* padding: calc(calc((100dvh - (5 * 20px)) / 6) / 3) 0; */
	height: calc((100dvh - (5 * 20px)) / 6);
	flex: 1;
}

.about .content__title {
	text-transform: uppercase;
	margin-top: 6px;
	font-family: 'Now Black', sans-serif;
	font-size: 1.2rem;
}

.about .content__text {
	text-align: center;
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 2 + 20px);
	font-size: 1.2rem;
	line-height: 1.4rem;
}

.about .content:nth-child(1) .content__text {
	overflow-y: scroll;
	-webkit-mask-image: linear-gradient(#000 50%, transparent 100%);
	mask-image: linear-gradient(#000 50%, transparent 100%);
	scrollbar-width: none;
}

.about .content:nth-child(1) .content__text p {
	font-size: 1.2rem;
	line-height: 1.6rem;
	text-align: justify;
	padding: 5% 0 35%;
}

.about .content--friends .content__text {
	height: auto;
}

.about .content--friends .slider img {
	height: calc((100dvh - (5 * 20px)) / 6);
}

.about .menus {
	margin: 20px calc(calc((100dvw - (5 * 20px)) / 6) + 20px) 0;
	height: calc((100dvh - (5 * 20px)) / 6);
}

.about .menus--double {
	display: flex;
	flex-wrap: wrap;
}

.about .menus--double .jobs,
.about .menus--double .aboutMenu {
	width: 100%;
	display: flex;
}

.about .menus--double .jobs li,
.about .menus--double .aboutMenu li {
	text-align: center;
	margin-block: auto;
	width: calc(100% / 3);
}

.about .menus--double .aboutMenu {
	transform: translateY(0);
}

.about .menus--single {
	display: flex;
}

.about .menus--single .aboutMenu {
	display: flex;
	align-items: center;
	width: 100%;
	transform: translateY(0);
}

.about .menus--single .aboutMenu li {
	text-align: center;
	margin-block: auto;
	width: calc(100% / 3);
}

.about .aboutMenu__link:nth-child(1) {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4vh;
}

.about .aboutMenu__link::after {
	display: none;
}

.about .aboutMenu__link p {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: 0 auto;
	cursor: pointer;
}

.about .aboutMenu .submenu__active p {
	position: relative;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: 0 auto;
}

.about .aboutMenu .submenu__active p::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: 1px;
	background-color: #e41313;
}

.about .jobs__link,
.about .jobsDesktop__link {
	cursor: pointer;
}

.about .jobs__link::after,
.about .jobsDesktop__link::after {
	display: none;
}

.about .jobs .submenu__active p,
.about .jobsDesktop .submenu__active p {
	position: relative;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: 0 auto;
}

.about .jobs .submenu__active p::after,
.about .jobsDesktop .submenu__active p::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: 1px;
	background-color: #e41313;
}

.about .slideTitle {
	text-align: center;
}

.about .friendlist .friend {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.about .friendlist .friend .slider {
	display: flex;
	height: calc((100dvh - (5 * 20px)) / 6);
	width: calc(calc((100dvw - (5 * 20px)) / 6) * 4 + 60px);
	justify-content: space-between;
	align-items: center;
}

.about .friendlist .friend .slider i {
	font-size: 3rem;
	color: rgba(255, 255, 255, 0.418);
	transition: 1s ease-in-out;
}

.about .friendlist .friend__description {
	height: calc((100dvh - (5 * 20px)) / 6);
	display: flex;
	flex-direction: column;
	align-items: center;
}

.about .friendlist .friend__description .name {
	font-size: 2rem;
	font-family: 'Bricolage Bold', sans-serif;
}

.about .friendlist .friend__description .text {
	text-align: center;
	height: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
	font-size: 1.2rem;
	line-height: 1.4rem;
	flex: 1;
	display: flex;
	align-items: center;
}

.about .friendlistDesktop {
	display: none;
}

.about .aka {
	opacity: 0;
	bottom: 0;
	height: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
}

.about .aka__cream {
	left: 0%;
}

.about .aka__red {
	right: 0;
}

@media screen and (min-width: 700px) {
	.about .content .content__img {
		/* padding: calc(calc((100dvh - (5 * 20px)) / 6) / 4) 0; */
	}
	.about .content:nth-child(1) .content__text p {
		font-size: 1.4rem;
		line-height: 2rem;
	}
}

@media screen and (min-width: 1000px) {
	.about .content:nth-child(1) .content__text p {
		font-size: 1.6rem;
		line-height: 2.3rem;
	}
}

@media screen and (min-width: 1440px) {
	.about {
		top: calc(-300dvh - calc((100dvh - (11 * 20px)) / 12) - calc((100dvh - (11 * 20px)) / 12) - 20px);
	}
	.about .content {
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 8 + 140px);
		padding-top: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 60px);
		flex-wrap: wrap;
		margin-inline: 0;
	}
	.about .content__title {
		display: block;
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 5 + 80px);
		margin-bottom: calc(calc((100dvh - (11 * 20px)) / 12) + 20px);
		font-size: 3.5rem;
	}
	.about .content__text {
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 7 + 120px);
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 60px);
	}
	.about .content__text p {
		padding: 0 0 10% !important;
	}
	.about .content .content__img {
		padding: 0;
		/* height: auto;
		width: calc(calc((100dvh - (11 * 20px)) / 12) * 3); */
	}
	.about .content--first .content__title {
		display: inherit;
	}
	.about .content--second {
		padding-top: calc(calc((100dvh - (11 * 20px)) / 12) * 2 + 60px);
	}
	.about .content--second .content__wrapper {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}
	.about .content--second .content__wrapper .content__title {
		margin-bottom: 0;
		margin-left: calc(calc((100dvw - (11 * 20px)) / 12) * 2 + 20px);
	}
	.about .content--second .content__wrapper .opinions {
		display: none;
	}
	.about .content--second .content__wrapper .desktopOpinions-wrapper {
		width: 100%;
		overflow: hidden;
	}
	.about .content--second .content__wrapper .desktopOpinions {
		display: flex;
		width: 100dvw;
		gap: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		will-change: transform;
		overflow: hidden;
		padding-inline: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		transition: all 1s;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion {
		width: calc((100dvw - (11 * 20px)) / 12);
		margin-top: calc(calc((100dvh - (11 * 20px)) / 12) + 20px);
		display: flex;
		flex-direction: column;
		gap: calc((100dvh - (11 * 20px)) / 12);
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion__infos {
		display: flex;
		flex-direction: column;
		gap: calc((100dvh - (11 * 20px)) / 12);
		align-items: center;
		opacity: 0;
		pointer-events: none;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion__infos .opinion__title {
		font-size: 3.5rem;
		font-family: 'Now Black', sans-serif;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion__infos .opinion__text {
		text-align: center;
		font-size: 1.6rem;
		line-height: 2rem;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion img {
		max-height: calc(calc((100dvh - (11 * 20px)) / 12) * 4 + 100px);
		cursor: pointer;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion img.big {
		min-width: calc((100dvw - 220px) / 12 * 3);
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion.active {
		-webkit-animation: activeIn 1s forwards;
		animation: activeIn 1s forwards;
		min-width: calc(calc((100dvw - (11 * 20px)) / 12) * 3);
		margin-top: 0;
		pointer-events: none;
		transition: all 1s;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion.active .opinion__infos {
		-webkit-animation: opinionInfo 1s 1s forwards;
		animation: opinionInfo 1s 1s forwards;
	}
	.about .content--second .content__wrapper .desktopOpinions .opinion.active img {
		max-height: calc(calc((100dvh - (11 * 20px)) / 12) * 5 + 120px);
	}
	@-webkit-keyframes opinionInfo {
		0% {
			transform: translateY(20px);
			opacity: 0;
		}
		100% {
			transform: translateY(0);
			opacity: 1;
		}
	}
	@keyframes opinionInfo {
		0% {
			transform: translateY(20px);
			opacity: 0;
		}
		100% {
			transform: translateY(0);
			opacity: 1;
		}
	}
	@-webkit-keyframes activeIn {
		0% {
			min-width: calc((100dvw - (11 * 20px)) / 12);
			margin-top: calc(calc((100dvh - (11 * 20px)) / 12) + 20px);
		}
		100% {
			min-width: calc(calc((100dvw - (11 * 20px)) / 12) * 3);
			margin-top: 0;
		}
	}
	@keyframes activeIn {
		0% {
			min-width: calc((100dvw - (11 * 20px)) / 12);
			margin-top: calc(calc((100dvh - (11 * 20px)) / 12) + 20px);
		}
		100% {
			min-width: calc(calc((100dvw - (11 * 20px)) / 12) * 3);
			margin-top: 0;
		}
	}
	.about .content--friends {
		padding-top: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 60px);
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		margin-left: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		/* gap: 0; */
		align-content: space-between;
	}
	.about .content--friends .friendlist {
		display: none;
	}
	.about .content--friends .friendlistDesktop {
		display: flex;
		flex: 100%;
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 6 + 100px);
		justify-content: space-between;
	}
	.about .content--friends .friendlistDesktop .friend {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 2 + 20px);
	}
	.about .content--friends .friendlistDesktop .friend img {
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 2 + 20px);
		width: 100%;
		object-fit: cover;
	}
	.about .content--friends .friendlistDesktop .friend a {
		cursor: pointer;
		width: 100%;
	}
	.about .content--friends .friendlistDesktop .friend__description {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.about .content--friends .friendlistDesktop .friend__description .name {
		margin: 20px 0 40px;
		font-family: 'Now Black', sans-serif;
	}
	.about .content--friends .friendlistDesktop .friend__description .text {
		text-align: center;
	}
	.about .content--friends .content__title {
		/* width: calc(calc((100dvw - (11 * 20px)) / 12) * 3 + 40px); */
		margin: 0 0 calc(calc((100dvh - (11 * 20px)) / 12) + 20px);
		font-size: 4rem;
		width: fit-content;
	}
	.about .content--friends .content__text {
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 3 + 40px);
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 2 + 20px);
		text-align: left;
		font-size: 1.6rem;
		line-height: 2.3rem;
	}
	.about .jobsDesktop {
		position: absolute;
		right: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		top: calc(calc((100dvh - (11 * 20px)) / 12) * 8 + 160px);
		display: flex;
		flex-direction: column;
		gap: 30px;
	}
	.about .jobsDesktop__link {
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
	}
	.about .menus {
		height: calc((100dvh - (11 * 20px)) / 12);
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 4 + 60px);
		margin-top: 20px;
		margin-inline: auto;
	}
	.about .slideTitle {
		margin-top: 40px;
	}
	.about .aka__cream {
		left: calc(calc((100dvw - (11 * 20px)) / 12) * 4 + 80px);
	}
	.about .aka__red {
		right: calc(calc((100dvw - (11 * 20px)) / 12) * 4 + 80px);
	}
}

.contact {
	top: calc(-300dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
	left: -100dvw;
}

.contact .content {
	padding-inline: calc(calc((100dvw - (5 * 20px)) / 6) + 20px);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 3 + 60px);
}

.contact .content .text {
	display: flex;
	align-items: center;
	text-align: center;
	font-size: 1.3rem;
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 2 + 20px);
}

.contact .content--typeform .subtitle {
	cursor: pointer;
	color: #fcfbf5;
	text-transform: uppercase;
	font-size: 3rem;
	min-height: 10vh;
	display: flex;
	align-items: flex-end;
	font-family: 'Now Black', sans-serif;
}

.contact .content--medias .medias {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	min-height: 10vh;
}

.contact .content--medias img {
	cursor: pointer;
	width: calc((100dvw - (5 * 20px)) / 6);
}

.contact .content--form {
	justify-content: flex-start;
}

.contact .content--form form {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	gap: calc(calc((100dvh - (5 * 20px)) / 6) * 0.095);
	width: calc(calc((100dvw - (5 * 20px)) / 6) * 4);
}

.contact .content--form form input,
.contact .content--form form textarea {
	font-family: 'Bricolage Bold', sans-serif;
	color: rgba(255, 255, 255, 0.4);
	background-color: #2c2c2c;
	border: none;
	padding-left: 15px;
	font-size: 1.5rem;
	width: 100%;
	margin-bottom: calc(calc((100dvh - (5 * 20px)) / 6) * 0.095);
}

.contact .content--form form input {
	height: calc(calc((100dvh - (5 * 20px)) / 6) * 0.27);
}

.contact .content--form form textarea {
	margin-top: calc(20px - calc((100dvh - (5 * 20px)) / 6) * 0.095);
	height: calc(100dvh / 6);
	padding-top: 1vh;
	resize: none;
}

.contact .content--form form ::-webkit-input-placeholder {
	color: rgba(255, 255, 255, 0.4);
	position: absolute;
	left: 15px;
}

.contact .content--form form ::-moz-placeholder {
	color: rgba(255, 255, 255, 0.4);
	position: absolute;
	left: 15px;
}

.contact .content--form form :-ms-input-placeholder {
	color: rgba(255, 255, 255, 0.4);
	position: absolute;
	left: 15px;
}

.contact .content--form form ::-ms-input-placeholder {
	color: rgba(255, 255, 255, 0.4);
	position: absolute;
	left: 15px;
}

.contact .content--form form ::placeholder {
	color: rgba(255, 255, 255, 0.4);
	position: absolute;
	left: 15px;
}

.contact .content--form form input[type='submit'] {
	width: 60%;
	cursor: pointer;
}

.contact .slideTitle {
	margin: 0 0 35px calc((100dvw - (5 * 20px)) / 6);
}

.contact .contactMenu {
	font-family: 'Bricolage Bold', sans-serif;
	margin-left: calc((100dvw - (5 * 20px)) / 6);
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.contact .contactMenu__link {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	cursor: pointer;
}

.contact .aka {
	opacity: 0;
	right: 0;
}

.contact .aka__cream {
	height: calc((100dvh - (5 * 20px)) / 6);
	top: calc(calc((100dvh - (5 * 20px)) / 6) * 3 + 80px);
}

.contact .aka__red {
	height: calc(calc((100dvh - (5 * 20px)) / 6) / 2);
	top: calc(calc((100dvh - (5 * 20px)) / 6) * 4 + calc((100dvh - (5 * 20px)) / 6) / 3 + 80px);
}

@media screen and (min-width: 700px) {
	.contact .content.content--typeform .subtitle,
	.contact .content.content--medias .subtitle {
		font-size: 4rem;
	}
	.contact .content.content--typeform .text,
	.contact .content.content--medias .text {
		font-size: 1.6rem;
	}
	.contact .content--medias img {
		width: calc(calc((100dvw - (5 * 20px)) / 6) / 1.3);
	}
}

@media screen and (min-width: 1000px) {
	.contact .content.content--typeform .subtitle,
	.contact .content.content--medias .subtitle {
		font-size: 5rem;
	}
	.contact .content.content--typeform .text,
	.contact .content.content--medias .text {
		font-size: 1.8rem;
	}
	.contact .content--medias img {
		width: calc(calc((100dvw - (5 * 20px)) / 6) / 1.8);
	}
}

@media screen and (min-width: 1440px) {
	.contact {
		top: calc(-300dvh - calc((100dvh - (11 * 20px)) / 12) - calc((100dvh - (11 * 20px)) / 12) - 20px);
		display: flex;
		justify-content: space-between;
	}
	.contact .slideTitle {
		margin: 0 0 calc((100dvh - (11 * 20px)) / 12) auto;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
	}
	.contact .contactMenu__wrapper {
		padding: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 60px) calc(calc((100dvw - (11 * 20px)) / 12) * 2 + 20px) 0 0;
	}
	.contact .contactMenu__wrapper .contactMenu {
		gap: calc(calc((100dvh - (11 * 20px)) / 12) / 2);
		margin-left: inherit;
		align-items: flex-end;
	}
	.contact .aka__cream {
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3);
		top: auto;
		bottom: calc(calc((100dvh - (11 * 20px)) / 12) * 4 + 80px);
	}
	.contact .aka__red {
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 2);
		top: auto;
		bottom: calc(calc((100dvh - (11 * 20px)) / 12) + 70px);
	}
	.contact .content.content--typeform,
	.contact .content.content--medias {
		padding-top: calc(calc((100dvh - (11 * 20px)) / 12) * 5 + 100px);
		padding-inline: inherit;
		margin-left: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		gap: calc(calc((100dvh - (11 * 20px)) / 12) + 40px);
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 4 + 60px);
		height: -webkit-fit-content;
		height: -moz-fit-content;
		height: fit-content;
	}
	.contact .content.content--typeform .subtitle,
	.contact .content.content--medias .subtitle {
		font-size: 5rem;
		min-height: inherit;
	}
	.contact .content.content--typeform .text,
	.contact .content.content--medias .text {
		font-size: 1.8rem;
		height: -webkit-fit-content;
		height: -moz-fit-content;
		height: fit-content;
	}
	.contact .content.content--form {
		padding-inline: inherit;
		height: auto;
	}
	.contact .content.content--form form {
		margin-top: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 60px);
		margin-left: calc(calc((100dvw - (11 * 20px)) / 12) + 20px);
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 4 + 60px);
	}
	.contact .content.content--form form input {
		height: calc(calc((100dvh - (11 * 20px)) / 12));
		padding-left: 30px;
	}
	.contact .content.content--form form textarea {
		height: calc(calc((100dvh - (11 * 20px)) / 12) * 3 + 40px);
		padding-left: 30px;
	}
	.contact .content.content--form form input[type='submit'] {
		width: calc(calc((100dvw - (11 * 20px)) / 12) * 2 + 20px);
		padding-left: inherit;
	}
	.contact .content.content--form form ::-webkit-input-placeholder {
		left: 30px;
	}
	.contact .content.content--form form ::-moz-placeholder {
		left: 30px;
	}
	.contact .content.content--form form :-ms-input-placeholder {
		left: 30px;
	}
	.contact .content.content--form form ::-ms-input-placeholder {
		left: 30px;
	}
	.contact .content.content--form form ::placeholder {
		left: 30px;
	}
	.contact .content--medias img {
		width: calc(calc((100dvw - (11 * 20px)) / 12) / 1.5);
	}
}

.work--enter {
	pointer-events: none;
	-webkit-animation: workSlideEnter 2s forwards;
	animation: workSlideEnter 2s forwards;
}

.work--enter .category span {
	-webkit-animation: slideFromRight 2s;
	animation: slideFromRight 2s;
}

.work--enter .workMenu {
	-webkit-animation: workSlideFromBottom 2s, smallGap 1s 1s;
	animation: workSlideFromBottom 2s, smallGap 1s 1s;
}

.work--enter .red {
	opacity: 0;
}

.work--enter .submenu__active::after {
	-webkit-animation: underline 1s 2s forwards;
	animation: underline 1s 2s forwards;
}

.work--enter .hidden-temp {
	visibility: hidden;
}

@media screen and (max-width: 1440px) {
	.work--enter .project {
		-webkit-animation: slideFromRight 2s forwards;
		animation: slideFromRight 2s forwards;
	}
}

.work--exit .project {
	-webkit-animation: slideToRight 2s;
	animation: slideToRight 2s;
}

.work--exit .category span {
	-webkit-animation: slideToRight 2s;
	animation: slideToRight 2s;
}

.work--exit .workMenu {
	-webkit-animation: slideToBottom 2s;
	animation: slideToBottom 2s;
}

.work--exit .submenu__active::after {
	width: 100%;
}

.work--inside {
	transition: none;
	transform: translateX(-100%);
}

.work--inside .aka {
	opacity: 1;
	-webkit-animation: workAkas 1s;
	animation: workAkas 1s;
}

.work--inside .red {
	opacity: 0;
	-webkit-animation: rec 0.5s forwards;
	animation: rec 0.5s forwards;
}

.work--inside .submenu__active::after {
	width: 100%;
}

.work--inside .category span.category--exit {
	-webkit-animation: fadeOut 1s forwards;
	animation: fadeOut 1s forwards;
}

.work--inside .category span.category--enter {
	-webkit-animation: fadeIn 1.5s forwards;
	animation: fadeIn 1.5s forwards;
}

.work--inside .workMenu__link::after {
	content: '';
	position: absolute;
	bottom: -2px;
	right: 0;
	left: auto;
	transform: translateX(0);
	height: 1px;
	background-color: #e41313;
}

.work--inside .workMenu__link.underline--exit {
	position: relative;
	-webkit-animation: shineOut 1s forwards;
	animation: shineOut 1s forwards;
}

.work--inside .workMenu__link.underline--exit::after {
	width: 100%;
	-webkit-animation: underline 1s forwards reverse;
	animation: underline 1s forwards reverse;
}

.work--inside .workMenu__link.underline--enter {
	position: relative;
	-webkit-animation: shineOut 0.5s forwards reverse;
	animation: shineOut 0.5s forwards reverse;
}

.work--inside .workMenu__link.underline--enter::after {
	width: 0;
	-webkit-animation: underline 1s forwards;
	animation: underline 1s forwards;
}

.anim {
	-webkit-animation: workSliderExit 1s forwards ease-in;
	animation: workSliderExit 1s forwards ease-in;
}

.anim__reverse {
	-webkit-animation: workSliderEnter 1s forwards ease-out;
	animation: workSliderEnter 1s forwards ease-out;
}

.contact .content__title--exit {
	-webkit-animation: slideToTop 1s forwards;
	animation: slideToTop 1s forwards;
}

.contact .content__title--enter {
	-webkit-animation: contactSlideFromBottom 1s forwards, fadeIn 1s forwards;
	animation: contactSlideFromBottom 1s forwards, fadeIn 1s forwards;
}

.contact .content__text--exit {
	-webkit-animation: fadeOut 0.5s forwards;
	animation: fadeOut 0.5s forwards;
}

.contact .content__text--enter {
	-webkit-animation: fadeIn 2.5s forwards;
	animation: fadeIn 2.5s forwards;
}

.contact .content--form .content__title--exit {
	-webkit-animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
	animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
}

.contact--enter {
	-webkit-animation: contactSlideEnter 2s forwards;
	animation: contactSlideEnter 2s forwards;
	pointer-events: none;
	transform: translateX(-100%);
}

.contact--enter .red {
	opacity: 0;
}

.contact--enter .submenu__active::after {
	-webkit-animation: underline 1s 2s forwards;
	animation: underline 1s 2s forwards;
}

.contact--enter .contactMenu {
	-webkit-animation: workSlideFromBottom 2s, mediumGap 1s 1s;
	animation: workSlideFromBottom 2s, mediumGap 1s 1s;
}

.contact--enter .content .subtitle {
	-webkit-animation: slideFromLeft 2s forwards;
	animation: slideFromLeft 2s forwards;
}

.contact--enter .content .text {
	-webkit-animation: slideFromLeft 2s 0.25s forwards;
	animation: slideFromLeft 2s 0.25s forwards;
}

.contact--inside {
	transition: none;
	transform: translateX(100%);
}

.contact--inside .content {
	overflow: hidden;
}

.contact--inside .aka {
	opacity: 1;
	-webkit-animation: contactAkas 1s;
	animation: contactAkas 1s;
}

.contact--inside .red {
	opacity: 0;
	-webkit-animation: rec 0.5s forwards;
	animation: rec 0.5s forwards;
}

.contact--inside .submenu__active::after {
	width: 100%;
}

.contact--inside .contactMenu__link::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	transform: translateX(0);
	height: 1px;
	background-color: #e41313;
}

.contact--inside .contactMenu__link.underline--exit {
	position: relative;
	-webkit-animation: shineOut 1s forwards;
	animation: shineOut 1s forwards;
}

.contact--inside .contactMenu__link.underline--exit::after {
	width: 100%;
	-webkit-animation: underline 1s forwards reverse;
	animation: underline 1s forwards reverse;
}

.contact--inside .contactMenu__link.underline--enter {
	position: relative;
	-webkit-animation: shineOut 0.5s forwards reverse;
	animation: shineOut 0.5s forwards reverse;
}

.contact--inside .contactMenu__link.underline--enter::after {
	width: 0;
	-webkit-animation: underline 1s forwards;
	animation: underline 1s forwards;
}

.contact--exit .content .subtitle {
	-webkit-animation: slideToLeft 2s forwards;
	animation: slideToLeft 2s forwards;
}

.contact--exit .content .text {
	-webkit-animation: slideToLeft 2s 0.25s forwards;
	animation: slideToLeft 2s 0.25s forwards;
}

.contact--exit .contactMenu {
	-webkit-animation: slideToBottom 2s;
	animation: slideToBottom 2s;
}

.contact--exit .submenu__active::after {
	width: 100%;
}

.contact--exit .aka {
	-webkit-animation: contactAkas 1s 0.5s reverse;
	animation: contactAkas 1s 0.5s reverse;
}

.about .content__img--exit--right {
	-webkit-animation: slideToRight 1s forwards;
	animation: slideToRight 1s forwards;
}

.about .content__img--exit--left {
	-webkit-animation: slideToLeft 1s forwards;
	animation: slideToLeft 1s forwards;
}

.about .content__img--enter--right {
	-webkit-animation: aboutSlideFromRight 1s forwards, fadeIn 0.75s forwards;
	animation: aboutSlideFromRight 1s forwards, fadeIn 0.75s forwards;
}

.about .content__img--enter--left {
	-webkit-animation: slideFromLeft 1s forwards, fadeIn 0.75s forwards;
	animation: slideFromLeft 1s forwards, fadeIn 0.75s forwards;
}

.about .content__text--exit {
	-webkit-animation: fadeOut 1s forwards;
	animation: fadeOut 1s forwards;
}

.about .content__text--enter {
	-webkit-animation: fadeIn 2.5s forwards;
	animation: fadeIn 2.5s forwards;
}

.about .content--friends--enter {
	-webkit-animation: aboutSlideFromRight 1s forwards;
	animation: aboutSlideFromRight 1s forwards;
}

.about .content--friends--exit {
	-webkit-animation: slideToRight 1s forwards;
	animation: slideToRight 1s forwards;
}

.about .friendlist--exit {
	-webkit-animation: slideToTop 0.5s forwards, fadeOut 0.5s forwards;
	animation: slideToTop 0.5s forwards, fadeOut 0.5s forwards;
}

.about .friendlist--enter {
	-webkit-animation: slideToTop 0.5s forwards reverse, fadeIn 0.5s forwards;
	animation: slideToTop 0.5s forwards reverse, fadeIn 0.5s forwards;
}

.about .opinions--exit--left {
	-webkit-animation: slideToLeft 1s forwards;
	animation: slideToLeft 1s forwards;
}

.about .opinions--exit--right {
	-webkit-animation: slideToRight 1s forwards;
	animation: slideToRight 1s forwards;
}

.about .opinions--enter--left {
	-webkit-animation: slideFromLeft 1s forwards;
	animation: slideFromLeft 1s forwards;
}

.about .opinions--enter--right {
	-webkit-animation: slideFromRight 1s forwards;
	animation: slideFromRight 1s forwards;
}

.about .slider--exit--right {
	-webkit-animation: slideToRight 1s forwards;
	animation: slideToRight 1s forwards;
}

.about .slider--exit--left {
	-webkit-animation: slideToLeft 1s forwards;
	animation: slideToLeft 1s forwards;
}

.about .slider--enter--right {
	-webkit-animation: slideFromRight 1s forwards;
	animation: slideFromRight 1s forwards;
}

.about .slider--enter--left {
	-webkit-animation: slideFromLeft 1s forwards;
	animation: slideFromLeft 1s forwards;
}

.about .aboutMenu--down {
	-webkit-animation: aboutMenuDown 1s forwards;
	animation: aboutMenuDown 1s forwards;
}

.about .aboutMenu--up {
	animation: aboutMenuDown 1s forwards reverse;
}

.about .jobsMenu--enter {
	-webkit-animation: fadeIn 1s forwards;
	animation: fadeIn 1s forwards;
}

.about .jobsMenu--enter .submenu__active p::after {
	-webkit-animation: underline 0.5s forwards;
	animation: underline 0.5s forwards;
}

.about .jobsMenu--exit {
	-webkit-animation: fadeOut 1s forwards;
	animation: fadeOut 1s forwards;
}

.about .jobsMenuDesktop--enter {
	-webkit-animation: aboutSlideFromRight 1s forwards;
	animation: aboutSlideFromRight 1s forwards;
}

.about .jobsMenuDesktop--enter .submenu__active p::after {
	-webkit-animation: underline 0.5s forwards;
	animation: underline 0.5s forwards;
}

.about .jobsMenuDesktop--exit {
	-webkit-animation: slideToRight 1s forwards;
	animation: slideToRight 1s forwards;
}

@-webkit-keyframes aboutMenuDown {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(calc(calc((100dvh - (5 * 20px)) / 6) / 3.9));
	}
}

@keyframes aboutMenuDown {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(calc(calc((100dvh - (5 * 20px)) / 6) / 3.9));
	}
}

.about--enter {
	pointer-events: none;
	-webkit-animation: aboutSlideEnter 2s forwards;
	animation: aboutSlideEnter 2s forwards;
}

.about--enter .menus {
	-webkit-animation: slideFromLeft 2s forwards;
	animation: slideFromLeft 2s forwards;
}

.about--enter .submenu__active p::after {
	width: 100% !important;
}

.about--enter .red {
	opacity: 0;
}

.about--inside {
	top: calc(-200dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
}

.about--inside .aka {
	opacity: 1;
	-webkit-animation: aboutAkas 1s;
	animation: aboutAkas 1s;
}

.about--inside .red {
	opacity: 0;
	-webkit-animation: rec 0.5s forwards;
	animation: rec 0.5s forwards;
}

.about--inside .submenu__active {
	color: #fcfbf5;
	text-shadow: 0px 0 13px #fcfbf5;
	position: relative;
	pointer-events: none;
}

.about--inside .underline--enter {
	animation: shineOut 0.5s forwards reverse;
}

.about--inside .underline--enter p::after {
	-webkit-animation: underline 0.75s forwards !important;
	animation: underline 0.75s forwards !important;
}

.about--inside .underline--exit {
	-webkit-animation: shineOut 0.75s forwards;
	animation: shineOut 0.75s forwards;
}

.about--inside .underline--exit p {
	position: relative;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: 0 auto;
}

.about--inside .underline--exit p::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: 1px;
	background-color: #e41313;
	animation: underline 0.75s forwards reverse;
}

.about--inside .jobsDesktop .underline--exit p {
	margin: 0;
}

.about--inside .jobsDesktop .underline--exit p::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: 1px;
	background-color: #e41313;
	animation: underline 0.75s forwards reverse;
}

.about--inside .jobs .underline--enter {
	animation: shineOut 0.5s forwards reverse;
}

.about--inside .jobs .underline--enter p::after {
	-webkit-animation: underline 1s forwards !important;
	animation: underline 1s forwards !important;
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: 1px;
}

.about--inside .jobsDesktop .underline--enter {
	animation: shineOut 0.5s forwards reverse;
}

.about--inside .jobsDesktop .underline--enter p::after {
	-webkit-animation: underline 1s forwards !important;
	animation: underline 1s forwards !important;
	content: '';
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: 1px;
}

.menu .mainColumn--enter {
	-webkit-animation: menuEnter 1.25s forwards;
	animation: menuEnter 1.25s forwards;
}

.menu .menu__border--enter {
	-webkit-animation: menuBorderEnter 1.25s forwards;
	animation: menuBorderEnter 1.25s forwards;
}

.menu .link--enter {
	-webkit-animation: menuLinkEnter 1s 1.25s forwards;
	animation: menuLinkEnter 1s 1.25s forwards;
}

.menu .text--enter {
	-webkit-animation: menuTextEnter 1.5s 1.25s forwards;
	animation: menuTextEnter 1.5s 1.25s forwards;
}

.menu .logo--enter {
	-webkit-animation: menuLogoEnter 0.5s 2.25s forwards;
	animation: menuLogoEnter 0.5s 2.25s forwards;
}

.navigation.navigation--enter--right {
	-webkit-animation: navigationEnterRight 2s forwards;
	animation: navigationEnterRight 2s forwards;
	position: relative;
	transform: translateX(100dvw);
}

.navigation.navigation--enter--left {
	-webkit-animation: navigationEnterLeft 2s forwards;
	animation: navigationEnterLeft 2s forwards;
	position: relative;
	transform: translateX(-100dvw);
}

.navigation.navigation--enter--up {
	-webkit-animation: navigationEnterUp 2s forwards;
	animation: navigationEnterUp 2s forwards;
	position: relative;
	transform: translateY(-100dvh);
}

.navigation.navigation--enter--down {
	-webkit-animation: navigationEnterDown 2s 0.05s forwards;
	animation: navigationEnterDown 2s 0.05s forwards;
	position: relative;
	transform: translateY(100dvh);
}

@-webkit-keyframes aboutSlideEnter {
	0% {
		top: calc(-300dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
	}
	100% {
		top: calc(-200dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
	}
}

@keyframes aboutSlideEnter {
	0% {
		top: calc(-300dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
	}
	100% {
		top: calc(-200dvh + calc((100dvh - (5 * 20px)) / 6) + calc((100dvh - (5 * 20px)) / 6));
	}
}

@-webkit-keyframes aboutSlideEnterDesktop {
	0% {
		top: -300vh;
	}
	100% {
		top: -200vh;
	}
}

@keyframes aboutSlideEnterDesktop {
	0% {
		top: -300vh;
	}
	100% {
		top: -200vh;
	}
}

/* @-webkit-keyframes aboutSlideEnterDesktop {
  0% {
    top: calc(-300dvh - calc((100dvh - (5 * 20px)) / 6));
  }
  100% {
    top: calc(-200dvh - calc((100dvh - (5 * 20px)) / 6));
  }
}

@keyframes aboutSlideEnterDesktop {
  0% {
    top: calc(-300dvh - calc((100dvh - (5 * 20px)) / 6));
  }
  100% {
    top: calc(-200dvh - calc((100dvh - (5 * 20px)) / 6));
  }
} */

@-webkit-keyframes aboutAkas {
	0% {
		transform: translateY(5vh);
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes aboutAkas {
	0% {
		transform: translateY(5vh);
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@-webkit-keyframes navigationEnterRight {
	0% {
		transform: translateX(100dvw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes navigationEnterRight {
	0% {
		transform: translateX(100dvw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes navigationEnterLeft {
	0% {
		transform: translateX(-100dvw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes navigationEnterLeft {
	0% {
		transform: translateX(-100dvw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes navigationEnterUp {
	0% {
		transform: translateY(-100dvh);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes navigationEnterUp {
	0% {
		transform: translateY(-100dvh);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes navigationEnterDown {
	0% {
		transform: translateY(100dvh);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes navigationEnterDown {
	0% {
		transform: translateY(100dvh);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes menuEnter {
	0% {
		transform: translateY(-100%);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes menuEnter {
	0% {
		transform: translateY(-100%);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes menuBorderEnter {
	0% {
		transform: translateX(-100dvw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes menuBorderEnter {
	0% {
		transform: translateX(-100dvw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes menuLinkEnter {
	0% {
		transform: translateX(100%);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes menuLinkEnter {
	0% {
		transform: translateX(100%);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes menuTextEnter {
	0% {
		transform: translateY(100%);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes menuTextEnter {
	0% {
		transform: translateY(100%);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes menuLogoEnter {
	0% {
		transform: translateY(10vh);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes menuLogoEnter {
	0% {
		transform: translateY(10vh);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes workSliderExit {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(100vw);
	}
}

@keyframes workSliderExit {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(100vw);
	}
}

@-webkit-keyframes workSliderEnter {
	0% {
		transform: translateX(100vw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes workSliderEnter {
	0% {
		transform: translateX(100vw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes slideToRight {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(100vw);
	}
}

@keyframes slideToRight {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(100vw);
	}
}

@-webkit-keyframes slideFromRight {
	0% {
		transform: translateX(100vw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes slideFromRight {
	0% {
		transform: translateX(100vw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes aboutSlideFromRight {
	0% {
		transform: translateX(85vw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes aboutSlideFromRight {
	0% {
		transform: translateX(85vw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes slideToLeft {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100vw);
	}
}

@keyframes slideToLeft {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100vw);
	}
}

@-webkit-keyframes aboutSlideToLeft {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-85vw);
	}
}

@keyframes aboutSlideToLeft {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-85vw);
	}
}

@-webkit-keyframes slideFromLeft {
	0% {
		transform: translateX(-100vw);
	}
	100% {
		transform: translateX(0);
	}
}

@keyframes slideFromLeft {
	0% {
		transform: translateX(-100vw);
	}
	100% {
		transform: translateX(0);
	}
}

@-webkit-keyframes workSlideEnter {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100%);
	}
}

@keyframes workSlideEnter {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100%);
	}
}

@-webkit-keyframes contactSlideEnter {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(100%);
	}
}

@keyframes contactSlideEnter {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(100%);
	}
}

@-webkit-keyframes workSlideFromBottom {
	0% {
		transform: translateY(100vh);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes workSlideFromBottom {
	0% {
		transform: translateY(100vh);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes contactSlideFromBottom {
	0% {
		transform: translateY(40vh);
	}
	100% {
		transform: translateY(0);
	}
}

@keyframes contactSlideFromBottom {
	0% {
		transform: translateY(40vh);
	}
	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes slideToBottom {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(100vh);
	}
}

@keyframes slideToBottom {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(100vh);
	}
}

@-webkit-keyframes slideToTop {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(-20vh);
	}
}

@keyframes slideToTop {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(-20vh);
	}
}

@-webkit-keyframes smallGap {
	0% {
		gap: 28px;
	}
}

@keyframes smallGap {
	0% {
		gap: 28px;
	}
}

@-webkit-keyframes mediumGap {
	0% {
		gap: 50px;
	}
}

@keyframes mediumGap {
	0% {
		gap: 50px;
	}
}

@-webkit-keyframes underline {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}

@keyframes underline {
	0% {
		width: 0;
	}
	100% {
		width: 100%;
	}
}

@-webkit-keyframes fadeOut {
	0% {
		opacity: 1;
	}
	100% {
		pointer-events: none;
		cursor: default;
		opacity: 0;
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1;
	}
	100% {
		pointer-events: none;
		cursor: default;
		opacity: 0;
	}
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		pointer-events: all;
		opacity: 1;
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		pointer-events: all;
		opacity: 1;
	}
}

@-webkit-keyframes shineOut {
	0% {
		text-shadow: 0px 0 13px #fcfbf5;
		color: #fcfbf5;
	}
	100% {
		text-shadow: none;
		color: rgba(255, 255, 255, 0.418);
	}
}

@keyframes shineOut {
	0% {
		text-shadow: 0px 0 13px #fcfbf5;
		color: #fcfbf5;
	}
	100% {
		text-shadow: none;
		color: rgba(255, 255, 255, 0.418);
	}
}

@-webkit-keyframes rec {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 1;
	}
	40% {
		opacity: 0;
	}
	60% {
		opacity: 1;
	}
	80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes rec {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 1;
	}
	40% {
		opacity: 0;
	}
	60% {
		opacity: 1;
	}
	80% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@-webkit-keyframes workAkas {
	0% {
		transform: translateX(-100%);
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes workAkas {
	0% {
		transform: translateX(-100%);
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

@-webkit-keyframes contactAkas {
	0% {
		transform: translateX(100%);
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes contactAkas {
	0% {
		transform: translateX(100%);
		opacity: 1;
	}
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

@media screen and (min-width: 1440px) {
	.about--enter {
		-webkit-animation: aboutSlideEnterDesktop 2s forwards;
		animation: aboutSlideEnterDesktop 2s forwards;
	}
	.about--inside {
		top: calc(-200dvh - calc((100dvh - (5 * 20px)) / 6));
	}
	.friendlist--enter {
		-webkit-animation: friendlistSlideFromBottom 0.5s forwards, fadeIn 1s forwards !important;
		animation: friendlistSlideFromBottom 0.5s forwards, fadeIn 1s forwards !important;
	}
	.about .content__text--exit,
	.about .content__title--exit {
		-webkit-animation: slideToLeft 1s forwards !important;
		animation: slideToLeft 1s forwards !important;
	}
	.about .content__text--enter,
	.about .content__title--enter {
		-webkit-animation: slideFromLeft 1s forwards !important;
		animation: slideFromLeft 1s forwards !important;
	}
	.contactMenu {
		-webkit-animation: none !important;
		animation: none !important;
	}
	.contact .content {
		overflow: inherit;
	}
	.contact .content__title--exit {
		-webkit-animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
		animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
	}
	.contact .content__title--enter {
		-webkit-animation: contactSlideFromBottom 1s forwards, fadeIn 1s forwards;
		animation: contactSlideFromBottom 1s forwards, fadeIn 1s forwards;
	}
	.contact .content__text--exit {
		-webkit-animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
		animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
	}
	.contact .content__text--enter {
		-webkit-animation: contactSlideFromBottom 1s forwards, fadeIn 1s forwards;
		animation: contactSlideFromBottom 1s forwards, fadeIn 1s forwards;
	}
	.contact .content--form .content__title--exit {
		-webkit-animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
		animation: slideToTop 1s forwards, fadeOut 0.75s forwards;
	}
	.work--enter .project {
		transform: translateY(100vh);
		-webkit-animation: workSliderEnter 1s 1s forwards ease-out !important;
		animation: workSliderEnter 1s 1s forwards ease-out !important;
	}
	.work--enter .project:nth-child(odd):not(:first-child) {
		opacity: 0;
		-webkit-animation: workSliderEnterOdd 1s 1s forwards ease-out !important;
		animation: workSliderEnterOdd 1s 1s forwards ease-out !important;
	}
	.work--exit .project {
		-webkit-animation: none;
		animation: none;
	}
	.work--exit .category span {
		-webkit-animation: none;
		animation: none;
	}
	.work--exit .workMenu {
		-webkit-animation: none;
		animation: none;
	}
	.work--exit .submenu__active::after {
		width: 100%;
	}
	.work .project__text p {
		max-width: 90%;
		text-wrap: wrap;
	}
	.work .projects .project:nth-child(even) {
		border-right: 1px solid #fcfbf5;
	}
	.work .projects > figure.project:nth-of-type(2) {
		padding-top: 40px;
	}
	.category span.category--exit {
		-webkit-animation: categorySlideToRight 1s forwards ease-in-out !important;
		animation: categorySlideToRight 1s forwards ease-in-out !important;
	}
	.category span.category--enter {
		animation: categorySlideToRight 1s forwards reverse ease-in-out !important;
	}
	.anim {
		-webkit-animation: workSliderExit 1s forwards ease-in;
		animation: workSliderExit 1s forwards ease-in;
	}
	.anim:nth-child(odd):not(:first-child) {
		-webkit-animation: workSliderExitOdd 1s forwards ease-in !important;
		animation: workSliderExitOdd 1s forwards ease-in !important;
	}
	.anim__reverse {
		-webkit-animation: workSliderEnter 1s forwards ease-out;
		animation: workSliderEnter 1s forwards ease-out;
	}
	.anim__reverse:nth-child(odd):not(:first-child) {
		-webkit-animation: workSliderEnterOdd 1s forwards ease-out !important;
		animation: workSliderEnterOdd 1s forwards ease-out !important;
	}
	@-webkit-keyframes workSliderExit {
		0% {
			transform: translateY(0);
		}
		100% {
			transform: translateY(-100vh);
		}
	}
	@keyframes workSliderExit {
		0% {
			transform: translateY(0);
		}
		100% {
			transform: translateY(-100vh);
		}
	}
	@-webkit-keyframes workSliderEnter {
		0% {
			transform: translateY(100vh);
		}
		100% {
			transform: translateY(0);
		}
	}
	@keyframes workSliderEnter {
		0% {
			transform: translateY(100vh);
		}
		100% {
			transform: translateY(0);
		}
	}
	@-webkit-keyframes workSliderEnterOdd {
		0% {
			opacity: 1;
			transform: translateY(100vh);
		}
		100% {
			opacity: 1;
			transform: translateY(calc(-1 * (100dvh - 220px) / 12 * 3 - 80px));
		}
	}
	@keyframes workSliderEnterOdd {
		0% {
			opacity: 1;
			transform: translateY(100vh);
		}
		100% {
			opacity: 1;
			transform: translateY(calc(-1 * (100dvh - 220px) / 12 * 3 - 80px));
		}
	}
	@-webkit-keyframes workSliderExitOdd {
		0% {
			transform: translateY(calc(-1 * (100dvh - 220px) / 12 * 3 - 80px));
		}
		100% {
			transform: translateY(-100vh);
		}
	}
	@keyframes workSliderExitOdd {
		0% {
			transform: translateY(calc(-1 * (100dvh - 220px) / 12 * 3 - 80px));
		}
		100% {
			transform: translateY(-100vh);
		}
	}
	@-webkit-keyframes friendlistSlideFromBottom {
		0% {
			transform: translateY(20vh);
		}
		100% {
			transform: translateY(0);
		}
	}
	@keyframes friendlistSlideFromBottom {
		0% {
			transform: translateY(20vh);
		}
		100% {
			transform: translateY(0);
		}
	}
	@-webkit-keyframes aboutMenuDown {
		0% {
			transform: translateY(0);
		}
		100% {
			transform: translateY(calc(calc((100dvh - (5 * 20px)) / 6) / 6.2));
		}
	}
	@keyframes aboutMenuDown {
		0% {
			transform: translateY(0);
		}
		100% {
			transform: translateY(calc(calc((100dvh - (5 * 20px)) / 6) / 6.2));
		}
	}
	@-webkit-keyframes categorySlideToRight {
		0% {
			transform: translateX(0);
		}
		100% {
			transform: translateX(200px);
		}
	}
	@keyframes categorySlideToRight {
		0% {
			transform: translateX(0);
		}
		100% {
			transform: translateX(200px);
		}
	}
}

@font-face {
	font-family: 'Now Black';
	src: url('../fonts/Now-Black.otf');
}

@font-face {
	font-family: 'Bricolage Bold';
	src: url('../fonts/BricolageGrotesque-Bold.woff2');
}

@font-face {
	font-family: 'Bricolage Light';
	src: url('../fonts/BricolageGrotesque-Light.woff2');
}

@font-face {
	font-family: 'Stix Regular';
	src: url('../fonts/STIXTwoText-Regular.ttf');
}

body {
	color: #fcfbf5;
	position: relative;
	font-family: 'Bricolage Light', sans-serif;
}

main {
	height: calc(100dvh - (100dvh - (5 * 20px)) / 6);
	width: 100dvw;
	overflow: hidden !important;
}

html,
body {
	background: #131412; /* ta couleur de fond par défaut */
	min-height: 100%;
	height: auto; /* évite un 100% bloquant dans certains cas */
	overflow: hidden !important;
	padding-bottom: env(safe-area-inset-bottom); /* protège contre la barre iOS */
	transition: 1s ease-in;
}

@media screen and (min-width: 1440px) {
	main {
		height: 100dvh;
	}

	.desktopNavigation {
		position: absolute !important;
	}
	.slide.home {
		top: 0 !important;
	}
	.slide.work {
		top: calc(-85dvh - calc((100dvh - (11 * 20px)) / 12) - calc((100dvh - (11 * 20px)) / 12) - 21px) !important;
	}
	.slide.contact {
		top: calc(-285dvh - calc((100dvh - (11 * 20px)) / 12) - calc((100dvh - (11 * 20px)) / 12) - 21px) !important;
	}
	.slide.about {
		top: -300vh;
	}

	.about--inside {
		top: -200vh !important;
	}
}

/* .slide {
	background-color: rgb(87, 23, 23) !important;
} */

/* .bg-override {
  background: #e41313 !important;
} */