/* MAIN */
/* MAIN */
/* MAIN */
#main {
	width: 100vw;
	background: var(--white);
	overflow-x: hidden;
	}
#main::-webkit-scrollbar {
	display: none;
	}


/* SAFARI */
/* SAFARI */
/* SAFARI */
#safari_tint {
	z-index: 5;
	position: fixed;
	width: 100vw;
	height: 12px;
	top: 0px;
	left: 0px;
	background-color: var(--white);
	pointer-events: none;
	display: none;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#safari_tint {
		display: block;
		}
	}


/* PUSH TO SCROLL */
/* PUSH TO SCROLL */
/* PUSH TO SCROLL */
#push_to_scroll {
	z-index: 5;
	position: fixed;
	width: 24px;
	height: 44px;
	left: calc(50% - 12px);
	bottom: calc(20svh / 2 - 22px);
	background: var(--white);
	box-shadow: inset 0px 0px 0px 2px var(--black);
	pointer-events: none;
	border-radius: 100px;
	}
#push_to_scroll .bullet {
	position: absolute;
	width: 4px;
	height: 7px;
	left: calc(50% - 2px);
	top: 10px;
	background: var(--black);
	border-radius: 100px;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	animation-name: scroll;
	animation-timing-function: ease-in-out;
	}
/* KEYFRAMES */
@keyframes scroll {
	30% {
		opacity: 1;
		}
	40% {
		top: 8px;
		}
	50% {
		opacity: 1;
		}
	70% {
		top: 28px;
		opacity: 0;
		}
	85% {
		top: 8px;
		opacity: 0;
		}
	}
/* MEDIA */
@media screen and (max-width: 1023px) {
	#push_to_scroll {
		bottom: 5svh;
		background: none;
		box-shadow: inset 0px 0px 0px 2px var(--white);
		}
	#push_to_scroll .bullet {
		background: var(--white);
		}
	}


/* HEADER */
/* HEADER */
/* HEADER */
#main #header {
	z-index: 2;
	position: fixed;
	width: 100%;
	height: auto;
	padding: var(--space);
	background: var(--white);
	}
#main #header h1 {
	text-transform: uppercase;
	font: 700 12px/1 "Khand", serif;
	letter-spacing: 3px;
	color: var(--black);
	display: flex;
	align-items: flex-end;
	}
#main #header h1 span {
	width: 20px;
	height: 2px;
	margin: 0px 0px 0px 6px;
	border-radius: 2px;
	}
/* VEHEL */
.vehel #main #header h1 span {
	background: red;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#main #header.onlymobile {
		display: flex;
		}
	}


/* MENU */
/* MENU */
/* MENU */
#main #menu {
	z-index: 2;
	position: fixed;
	width: var(--mainWidth);
	left: var(--mainLeft);
	padding: var(--space);
	display: flex;
	align-items: center;
	justify-content: flex-end;
	}
#main #menu .element {
	margin: 0px 0px 0px calc(var(--gap) / 2);
	text-transform: uppercase;
	font: 700 10px/1 "Khand", serif;
	letter-spacing: 2px;
	color: var(--black);
	}
#main #menu .element.red {
	color: red;
	}
#main #menu .element.gray {
	color: var(--black_25);
	}
#main #menu .element:hover {
	opacity: .5;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#main #menu {
		transform: translate3d(0px, 0px, 0px) !important;
		}
	}
@media screen and (max-width: 1023px) {
	#main #menu {
		padding: var(--panel);
		}
	#main #menu .element.gray {
		display: none;
		}
	}
@media screen and (max-width: 767px) {
	#main #menu {
		display: none;
		}	
	}


/* WHITE */
/* WHITE */
/* WHITE */
#main #white {
	width: var(--mainWidth);
	height: 80svh;
	min-height: 600px;
	left: var(--mainLeft);
	background: var(--white);
	}
#main #white .content {
	height: 100%;
	padding: var(--space);
	display: flex;
	flex-direction: column;
	justify-content: center;
	}
#main #white .content h1 {
	margin: var(--gap) 0px 0px 0px;
	text-transform: uppercase;
	font: 700 clamp(24px, 1.5vw, 48px)/1 "Khand", serif;
	color: var(--black);
	}
#main #white .content h2 {
	margin: 5px 0px 0px 0px;
	text-transform: uppercase;
	font: 300 clamp(20px, .8vw, 26px)/1 "Khand", sans-serif;
	letter-spacing: .35vw;
	color: var(--black_50);
	}
#main #white .content h3 {
	text-transform: uppercase;
	font: 700 14px/1 "Khand", serif;
	letter-spacing: 5px;
	color: var(--black);
	display: flex;
	align-items: flex-end;
	}
#main #white .content h3 span {
	width: 40px;
	height: 2px;
	margin: 0px 0px 0px 12px;
	background: var(--black);
	border-radius: 2px;
	}
/* VEHEL */
.vehel #main #white .content h3 span {
	background: red;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#main #white {
		height: 60svh;
		min-height: auto;
		padding: 190px 0px 0px 0px;
		left: 0px;
		}
	#main #white .content {
		padding: 0px var(--space);
		justify-content: flex-start;
		}
	}
@media screen and (max-width: 1023px) {
	#main #white {
		padding: 130px 0px 0px 0px;
		}
	#main #white .content h1 {
		margin: 0px;
		}
	}
@media screen and (max-width: 767px) {
	#main #white {
		padding: 132px 0px 0px 0px;
		}
	#main #white .content h3 {
		font: 700 12px/1 "Khand", serif;
		letter-spacing: 3px;
		}
	#main #white .content h3 span {
		width: 20px;
		margin: 0px 0px 0px 6px;
		}
	}


/* HERO */
/* HERO */
/* HERO */
#main #hero {
	width: var(--mainWidth);
	left: var(--mainLeft);
	margin: 0px 0px var(--sectionBig) 0px;
	display: flex;
	aspect-ratio: 2/1;
	overflow-y: hidden;
	}
#main #hero .bloc {
	width: 100%;
	height: 100%;
	background: var(--black);
	display: flex;
	flex-direction: column;
	justify-content: center;
	}
/* IMAGE */
#main #hero .bloc.image {
	background: var(--black_25);
	aspect-ratio: 2/3;
	display: none;
	}
#main #hero .bloc.image img {
	width: 100%;
	height: 100%;
	opacity: 0;
	object-fit: cover;
	opacity: 1 !important;
	}
/* CONTENT */
#main #hero .bloc.content {
	padding: var(--space);
	}
#main #hero .bloc.content h4 {
	font: 700 14px/1 "Khand", serif;
	letter-spacing: 3px;
	color: var(--white_25);
	}
#main #hero .bloc.content .home_01 {
	max-width: 90%;
	font: 400 clamp(22px, 1.5vw, 38px)/1.25 "Vidaloka", serif;
	color: var(--white);
	}
#main #hero .bloc.content .home_02 {
	margin: var(--gapSmall) 0px 0px 0px;
	font: 500 16px/1.25 "Khand", serif;
	color: var(--white_50);
	letter-spacing: .5px;
	}
#main #hero .bloc.content a .link {
	width: 180px;
	margin: var(--gap) 0px 0px 0px;
	padding: 20px;
	background: var(--white);
	color: var(--black);
	letter-spacing: 2px;
	text-transform: uppercase;
	font: 700 12px/1 "Khand", serif;
	border-radius: 12px;
	corner-shape: squircle;
	display: flex;
	align-items: center;
	justify-content: center;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#main #hero {
		margin: 0px 0px 1px 0px;
		}
	#main #hero .bloc.content .home_01 {
		font: 400 24px/1.25 "Vidaloka", serif;
		}
	#main #hero .bloc.content a .link {
		width: 120px;
		padding: 15px;
		border-radius: 4px;
		}
	}
@media screen and (max-width: 1023px) {
	#main #hero {
		margin: 0px;
		aspect-ratio: auto;
		flex-direction: column-reverse;
		}
	#main #hero .bloc {
		height: auto;
		background: var(--trueBlack);
		}
	#main #hero .bloc.content {
		filter: invert(1);
		}
	#main #hero .bloc.content .home_01 {
		font: 400 clamp(22px, 3vw, 38px)/1.25 "Vidaloka", serif;
		}
	#main #hero .bloc.image {
		display: flex;
		}
	}
@media screen and (max-width: 767px) {
	#main #hero .bloc.content .home_01 {
		font: 400 clamp(30px, 3vw, 38px)/1.25 "Vidaloka", serif;
		}
	#main #hero .bloc.content .home_01 .jump {
		display: none;
		}
	#main #hero .bloc.content .home_02 {
		width: 70%;
		}
	}


/* FLOW */
/* FLOW */
/* FLOW */
#flow {
	width: var(--mainWidth);
	left: var(--mainLeft);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}
/* PORTFOLIO */
#flow .portfolio {
	width: 100%;
	height: auto;
	margin: 0px 0px var(--sectionBig) 0px;
	}
#flow .portfolio.size_3 {
	width: calc(100% / 3 - 2px / 3);
	}
#flow .portfolio.size_2 {
	width: calc(100% / 2 - 1px / 2);
	}
/* SCREEN x PANEL */
#flow .portfolio .screen {
	width: 100%;
	background: var(--black);
	display: flex;
	overflow-x: scroll;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	aspect-ratio: 2/1;
	}
#flow .portfolio.small.ratio_regular .screen {
	aspect-ratio: 5/7;
	}
#flow .portfolio.small.ratio_big .screen {
	aspect-ratio: 4/6;
	}
#flow .portfolio.small.ratio_small .screen {
	aspect-ratio: 5/6;
	}
#flow .portfolio.small.ratio_horizontal .screen {
	aspect-ratio: 5/3;
	}
#flow .portfolio .screen::-webkit-scrollbar {
	display: none;
	}
#flow .portfolio .screen .panel {
	width: 100%;
	height: 100%;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	scroll-snap-align: start;
	}
/* PANEL HIDDEN */
#flow .portfolio.panels_hidden .screen > .panel:not(:first-child) {
	display: none;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#flow .portfolio.small.ratio_regular .screen {
		aspect-ratio: 4/6;
		}
	#flow .portfolio.small.ratio_small .screen {
		aspect-ratio: 4/6;
		}
	}
@media screen and (max-width: 1023px) {
	#flow .portfolio.size_3,
	#flow .portfolio.size_2 {
		width: 100%;
		}
	#flow .portfolio.size_1 .screen,
	#flow .portfolio.small.ratio_horizontal .screen {
		aspect-ratio: 5/4 !important;
		}
	}


/* PANEL NAV */
/* PANEL NAV */
/* PANEL NAV */
.panel_nav {
	z-index: 1;
	position: absolute;
	width: 100%;
	height: 100px;
	margin: calc(-100px - var(--panel) + var(--button)) 0px 0px 0px;
	padding: 0px var(--panel);
	display: flex;
	filter: invert(1);
	align-items: flex-end;
	justify-content: flex-end;
	pointer-events: none;
	opacity: 0;
	}
.panel_nav .nav {
	display: flex;
	align-items: center;
	pointer-events: auto;
	}
.panel_nav .nav .tick {
	padding: var(--button) 6px;
	}
.panel_nav .nav .tick .tick_el {
	width: 4px;
	height: 4px;
	background: var(--black);
	border-radius: 4px;
	}
.panel_nav .nav .tick.active .tick_el {
	width: calc(4px * 5);
	}
.panel_nav .nav .nav_arrow {
	width: var(--button);
	height: var(--button);
	margin: 0px 0px 0px var(--gapSmall);
	padding: var(--buttonPaddingBig);
	border-radius: 100%;
	box-shadow: 0px 0px 0px 2px var(--black);
	}
/* HOVER */
.portfolio:hover .panel_nav {
	opacity: 1;
	}
/* MEDIA */
@media screen and (max-width: 1479px) {
	.panel_nav .nav .tick {
		padding: var(--button) 3px;
		}
	.panel_nav .nav .tick.active .tick_el {
		width: calc(6px * 3);
		}
	.panel_nav .nav .nav_arrow {
		display: none;
		}
	}
@media screen and (max-width: 767px) {
	.panel_nav {
		margin: calc(-100px - 40px + var(--button)) 0px 0px 0px;
		padding: 0px 40px;
		}
	.panel_nav .nav .tick .tick_el {
		width: 2px;
		height: 2px;
		border-radius: 2px;
		}
	.panel_nav .nav .tick.active .tick_el {
		width: calc(2px * 8);
		}
	}


/* PANEL HEADER */
/* PANEL HEADER */
/* PANEL HEADER */
.panel_header {
	z-index: 1;
	position: absolute;
	width: 100%;
	padding: var(--panel);
	display: flex;
	align-items: center;
	pointer-events: none;
	opacity: 0;
	}
.panel_header .category {
	font: 500 12px/1 "Khand", serif;
	letter-spacing: 5px;
	text-transform: uppercase;
	color: var(--white);
	}
/* PORTFOLIO */
.portfolio:hover .panel_header {
	opacity: 1;
	}
/* MEDIA */
@media screen and (max-width: 1919px) {
	.panel_header .category {
		font: 700 9px/1 "Khand", serif;
		letter-spacing: 3px;
		}
	}
@media screen and (max-width: 767px) {
	.panel_header {
		padding: 40px;
		}	
	}


/* PANEL FOOTER */
/* PANEL FOOTER */
/* PANEL FOOTER */
.panel_footer {
	z-index: 1;
	width: 100%;
	padding: var(--panel) var(--panel) 0px var(--panel);
	pointer-events: none;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	}
.panel_footer .number {
	z-index: 2;
	margin: 0px 0px calc(var(--gapSmall) / 2) 0px;
	font: 700 16px/1 "Khand", serif;
	letter-spacing: 1px;
	color: red;
	display: flex;
	align-items: flex-start;
	}
.panel_footer .number span {
	margin: 0px 0px 0px 5px;
	font: 700 14px/1 "Khand", serif;
	}
.panel_footer .level_01 {
	margin: 0px 0px 3px 0px;
	text-transform: uppercase;
	font: 700 12px/1.25 "Khand", serif;
	letter-spacing: 2px;
	color: var(--black);
	}
.panel_footer .level_02 {
	margin: 0px 0px calc(var(--gapSmall) / 2) 0px;
	text-transform: uppercase;
	font: 700 24px/1 "Khand", serif;
	letter-spacing: 1px;
	color: var(--black);
	}
.panel_footer .level_03 {
	font: 500 16px/1 "Sofia Sans Extra Condensed", serif;
	color: var(--black_50);
	letter-spacing: .5px;
	}
.panel_footer .line {
	width: var(--gap);
	height: 3px;
	margin: 0px 0px var(--gap) 0px;
	background: var(--black);
	border-radius: 3px;
	}
/* MEDIA */
@media screen and (max-width: 1919px) {
	.panel_footer .number {
		margin: 0px 0px calc(var(--gapSmall) / 2) 0px;
		font: 700 14px/1 "Khand", serif;
		}
	.panel_footer .number span {
		display: none;
		}
	.panel_footer .level_01 {
		font: 700 10px/1.25 "Khand", serif;
		letter-spacing: 1px;
		}
	.panel_footer .level_02 {
		font: 700 20px/1 "Khand", serif;
		}
	}
@media screen and (max-width: 1023px) {
	.panel_footer .level_02 {
		font: 700 18px/1 "Khand", serif;
		}
	.panel_footer .line {
		margin: 0px 0px calc(var(--gap) / 2) 0px;
		}
	}


/* PANEL AJAX ONLY */
/* PANEL AJAX ONLY */
/* PANEL AJAX ONLY */
#portfolio_ajax .panel_nav,
#portfolio_ajax .panel_header,
#portfolio_ajax .panel_footer {
	z-index: 2;
	position: fixed;
	opacity: 1 !important;
	}
/* FOOTER */
#portfolio_ajax .panel_footer {
	top: 60px;
	padding: var(--panel);
	}
#portfolio_ajax .panel_footer .number {
	margin: 0px 0px var(--gapSmall) 0px;
	font: 700 34px/1 "Khand", serif;
	letter-spacing: 2px;
	}
#portfolio_ajax .panel_footer .level_01 {
	color: var(--white);
	}
#portfolio_ajax .panel_footer .level_02 {
	margin: 0px 0px calc(var(--gapSmall) / 2) 0px;
	font: 700 32px/1 "Khand", serif;
	letter-spacing: 3px;
	color: var(--white);
	}
#portfolio_ajax .panel_footer .level_03 {
	color: var(--white_50);
	}
#portfolio_ajax .panel_footer .line {
	margin: 0px 0px var(--gap) 0px;
	background: var(--white);
	}
/* EXCEPTION */
#portfolio_ajax.format_r46 .panel_footer,
#portfolio_ajax.format_vertical .panel_footer {
	display: none;
	}
/* MEDIA */
@media screen and (max-width: 1479px) {
	#portfolio_ajax .panel_footer {
		display: none;
		}
	}
@media screen and (max-width: 767px) {
	#portfolio_ajax .panel_nav {
		justify-content: center;
		}
	#portfolio_ajax .panel_header {
		display: none;
		}
	}


/* SWITCH */
/* SWITCH */
/* SWITCH */
#main #switch {
	width: 100%;
	height: 50svh;
	margin: 0px 0px var(--sectionBig) 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	}
#main #switch #go_top {
	z-index: 1;
	position: absolute;
	width: 40px;
	height: 40px;
	background: var(--white);
	box-shadow: inset 0px 0px 0px 2px var(--black_01);
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	}
#main #switch #go_top img {
	width: 20px;
	height: 20px;
	}
#main #switch #go_top:hover img {
	opacity: .25;
	}
#main #switch #line {
	width: 2px;
	background: var(--black_01);
	border-radius: 2px;
	flex: 1;
	}
/* MEDIA */
@media screen and (max-width: 1023px) {
	}
@media screen and (max-width: 767px) {
	#main #switch {
		padding: 0px var(--space);
		align-items: flex-start;
		}
	#main #switch #go_top {
		display: none;
		}
	}


/* EXPERIENCE */
/* EXPERIENCE */
/* EXPERIENCE */
#main #experience {
	width: 100%;
	margin: 0px 0px var(--space) 0px;
	text-align: center;
	display: flex;
	align-items: center;
	}
#main #experience .content {
	width: 100%;
	padding: 0px var(--space);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	}
#main #experience .content .title {
	width: 100%;
	margin: 0px 0px var(--section) 0px;
	font: 400 clamp(22px, 2vw, 44px)/1.25 "Vidaloka", serif;
	color: var(--black);
	}
#main #experience .content .slide {
	width: 80em;
	display: flex;
	}
#main #experience .content .slide .space {
	display: none;
	}
/* ITEM */
#main #experience .content .slide .item {
	width: 100%;
	}
#main #experience .content .slide .item .date {
	margin: 0px 0px 6px 0px;
	text-transform: uppercase;
	font: 700 14px/1 "Sofia Sans Extra Condensed", serif;
	letter-spacing: 1px;
	color: red;
	}
#main #experience .content .slide .item .kaisha {
	margin: 0px 0px calc(var(--gapSmall) / 2) 0px;
	text-transform: uppercase;
	font: 700 24px/1 "Khand", serif;
	letter-spacing: 1px;
	color: var(--black);
	}
#main #experience .content .slide .item .poste {
	margin: 0px 0px 5px 0px;
	text-transform: uppercase;
	font: 500 16px/1 "Khand", serif;
	color: var(--black_50);
	}
/* DOWNLOAD */
#main #experience #download {
	margin: var(--section) 0px 0px 0px;
	display: flex;
	align-items: center;
	justify-content: center;
	}
#main #experience #download a .down {
	width: 180px;
	margin: 0px 12px;
	padding: 15px 0px;
	font: 700 10px/1 "Khand", serif;
	letter-spacing: 2px;
	color: var(--black);
	box-shadow: 0px 0px 300px 0px var(--black_50);
	border-radius: 12px;
	corner-shape: squircle;
	text-transform: uppercase;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: calc(var(--gapSmall) / 2);
	}
#main #experience #download a .down:hover {
	color: var(--black_50);
	}
#main #experience #download a .down img {
	width: 18px;
	height: 18px;
	transform: rotate(90deg);
	}
#main #experience #download a .down:hover img {
	opacity: .5;
	}
/* MEDIA */
@media screen and (max-width: 1023px) {
	#main #experience {
		text-align: left;
		}
	#main #experience .content .title {
		margin: 0px 0px var(--gapSmall) 0px;
		}
	#main #experience .content .slide {
		width: 100%;
		display: flex;
		flex-direction: column;
		}
	#main #experience .content .slide .space {
		display: flex;
		}
	#main #experience .content .slide .item {
		width: 100%;
		}
	#main #experience #download {
		flex-direction: column;
		gap: 12px;
		}
	#main #experience #download a .down {
		margin: 0px;
		}
	#main #experience #download a .down img {
		display: none;
		}
	}


/* FOOTER IMAGE */
/* FOOTER IMAGE */
/* FOOTER IMAGE */
#footer_image {
	width: 100%;
	margin: 0px 0px 1px 0px;
	background: var(--black_25);
	aspect-ratio: 2/1;
	}
#footer_image img {
	height: 100%;
	opacity: 0;
	object-fit: cover;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	#footer_image {
		display: none;
		}
	}


/* FOOTER */
/* FOOTER */
/* FOOTER */
#main footer {
	width: 100%;
	padding: var(--space) calc((100% - var(--mainWidth)) / 2);
	background: var(--black);
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	}
#main footer h3 {
	margin: 0px 0px 3px 0px !important;
	text-transform: uppercase;
	font: 700 clamp(30px, 2vw, 44px)/1 "Khand", serif;
	letter-spacing: 5px;
	color: var(--white);
	}
#main footer h4 {
	text-transform: uppercase;
	font: 300 16px/1 "Khand", serif;
	color: var(--white_50);
	letter-spacing: 4px;
	}
/* SOCIAL */
#main footer .links {
	width: 90px;
	margin: var(--gap) 0px 0px 0px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	filter: invert(1);
	}
#main footer .links .element {
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	}
#main footer .links .element img {
	width: 12px;
	}
/* MEDIA */
@media screen and (max-width: 1919px) {
	#main footer {
		padding: var(--space) calc((100% - var(--mainWidth)) / 2 + var(--panel) * 2);
		}
	}
@media screen and (max-width: 1279px) {
	#main footer {
		width: 100%;
		padding: var(--space);
		}
	}
@media screen and (max-width: 1023px) {
	#main footer h3 {
		letter-spacing: 2px;
		}
	#main footer h4 {
		font: 300 14px/1 "Khand", serif !important;
		letter-spacing: 2px;
		}
	}


/* SKILLS */
/* SKILLS */
/* SKILLS */
#main footer #skills {
	width: 100%;
	margin: 0px 0px var(--space) 0px;
	color: var(--white);
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	}
#main footer #skills .skills_bloc {
	width: 100%;
	margin: 0px calc(var(--gap) * 2) 0px 0px;
	text-align: left;
	}
#main footer #skills .skills_bloc.right {
	margin: 0px 0px 0px calc(var(--gap) * 2);
	text-align: right;
	}
#main footer #skills .skills_bloc h4 {
	margin: 0px 0px var(--gapSmall) 0px;
	font: 700 24px/1 "Khand", serif !important;
	letter-spacing: 2px;
	color: var(--white);
	}
#main footer #skills .skills_bloc h5 {
	font: 700 16px/1.15 'Khand', Arial, sans-serif;
    color: var(--white);
	}
#main footer #skills .skills_bloc .description {
	margin: 3px 0px 12px 0px;
	font: 500 14px/1.15 'Khand', Arial, sans-serif;
	color: var(--white_50);
	}
#main footer #skills .skills_bloc .description.small {
	margin: 3px 0px 0px 0px;
	}
/* MEDIA */
@media screen and (max-width: 1479px) {
	#main footer #skills .skills_bloc h4 {
		margin: 0px 0px calc(var(--gapSmall) / 2) 0px;
		font: 700 18px/1 "Khand", serif !important;
		}
	#main footer #skills .skills_bloc h5 {
		font: 500 14px/1.15 'Khand', Arial, sans-serif;
		}
	#main footer #skills .skills_bloc .description {
		font: 500 12px/1.15 'Khand', Arial, sans-serif;
		}
	}
@media screen and (max-width: 1023px) {
	#main footer #skills {
		flex-direction: column;
		}
	#main footer #skills .skills_bloc {
		max-width: 70%;
		margin: 0px 0px var(--gap) 0px;
		}
	#main footer #skills .skills_bloc.right {
		margin: 0px 0px var(--gap) 30%;
		}
	}


/* CONTROLS */
/* CONTROLS */
/* CONTROLS */
.screen .video_controls {
	z-index: 1;
	position: absolute;
	width: 100%;
	bottom: 0px;
	display: flex;
	align-items: flex-end;
	gap: var(--gapSmall);
	}
.screen .video_controls.hidden {
	opacity: 0;
	pointer-events: none;
	}
/* BUTTONS */
.screen .video_controls .play_pause,
.screen .video_controls .mute_toggle {
	position: absolute;
	width: var(--button);
	height: var(--button);
	margin: 0px 0px calc(var(--panel) - var(--button) / 2) var(--panel);
	padding: var(--buttonPadding);
	box-shadow: 0px 0px 0px 2px var(--black_25);
	border-radius: 100%;
	filter: invert(1);
	}
.screen .video_controls .mute_toggle {
	margin: 0px 0px calc(var(--panel) - var(--button) / 2) calc(var(--panel) + var(--button) + var(--gapSmall));
	}
/* BAR */
.screen .video_controls .bar {
	height: 2px;
	top: -20px;
	background: var(--white_25);
	border-radius: 2px;
	flex: 1;
	touch-action: none;
	}
.screen .video_controls .bar .bar_fill {
	position: absolute;
	width: 0%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: red;
	border-radius: 1px;
	pointer-events: none;
	}
.screen .video_controls .bar .bar_handle {
	position: absolute;
	width: 12px;
	height: 12px;
	top: 50%;
	left: 0%;
	padding: 0px;
	border-radius: 100%;
	background: var(--white);
	transform: translate(-50%, -50%);
	border: none;
	touch-action: none;
	}
/* MEDIA */
@media screen and (max-width: 1279px) {
	.screen .video_controls {
		bottom: calc(var(--panel) - var(--button) / 2);
		}
	.screen .video_controls .play_pause {
		margin: 0px 0px 0px var(--panel);
		}
	.screen .video_controls .mute_toggle {
		margin: 0px 0px 0px calc(var(--panel) + var(--button) + var(--gapSmall));
		}
	.screen .video_controls .bar {
		display: none;
		}
	}
@media screen and (max-width: 767px) {
	.screen .video_controls {
		bottom: calc(40px - var(--button) / 2);
		}
	.screen .video_controls .play_pause {
		margin: 0px 0px 0px 40px;
		}
	.screen .video_controls .mute_toggle {
		margin: 0px 0px 0px calc(100% - var(--button) - 40px);
		}
	}


/* VIDEO */
/* VIDEO */
/* VIDEO */
.screen .video_wrapper {
	width: 100%;
	height: 100%;
	background: var(--white);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	}
.screen .video_wrapper .js_video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	}
/* PORTFOLIO */
#portfolio_ajax .screen .video_wrapper .js_video {
	aspect-ratio: 16/9;
	overflow: hidden;
	opacity: 0;
	}
#portfolio_ajax .screen .video_wrapper .js_video.vertical {
	width: auto;
	aspect-ratio: 9/16;
	}


/* FULL IMAGE */
/* FULL IMAGE */
/* FULL IMAGE */
.screen .panel .cover {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	}
.screen .panel .cover.zoom {
	/* transform: scale(1.025); */
	}


/* AJAX BACKGROUND */
/* AJAX BACKGROUND */
/* AJAX BACKGROUND */
#ajax_background {
	z-index: 4;
	position: fixed;
	width: 100vw;
	height: 100dvh;
	top: 0px;
	left: 0px;
	background: rgba(0,0,0,.85);
	opacity: 0;
	pointer-events: none;
	}
#ajax_background.open {
	opacity: 1;
	pointer-events: auto;
	}


/* PORTFOLIO AJAX */
/* PORTFOLIO AJAX */
/* PORTFOLIO AJAX */
#portfolio_ajax {
	z-index: 5;
	position: fixed;
	width: calc(100vw - var(--panel) - var(--panel));
	height: calc(100svh - var(--panel) - var(--panel));
	top: 50%;
	left: 50%;
	transform: translate(-50%, 100%);
	border-radius: 20px;
	corner-shape: squircle;
	overflow: hidden;
	pointer-events: none;
	}
/* FORMATS */
#portfolio_ajax.format_r46,
#portfolio_ajax.format_vertical {
	width: auto;
	max-width: calc(100vw - var(--panel));
	height: auto;
	max-height: calc(100svh - var(--panel));
	aspect-ratio: 9/16;
	}
#portfolio_ajax.format_r46 {
	aspect-ratio: 4/6;
	}
#portfolio_ajax.video:not(.format_vertical) {
	width: auto;
	max-width: 70vw;
	height: auto;
	max-height: 70svh;
	aspect-ratio: 16/9;
	}
#portfolio_ajax.open {
	transform: translate(-50%, -50%) !important;
	pointer-events: auto;
	}
/* CONTENT */
#portfolio_ajax .section {
	width: 100%;
	height: 100%;
	}
#portfolio_ajax .section .screen {
	width: 100%;
	height: 100%;
	display: flex;
	overflow-x: scroll;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	}
#portfolio_ajax .section .screen::-webkit-scrollbar {
	display: none;
	}
#portfolio_ajax .section .screen .panel {
	width: 100%;
	height: 100%;
	display: flex;
	flex-shrink: 0;
	flex-direction: column;
	align-items: center;
	scroll-snap-align: start;
	}
/* CLOSE */
#portfolio_ajax .ajax_close {
	z-index: 1;
	position: absolute;
	width: var(--button);
	height: var(--button);
	top: calc(var(--panel));
	right: calc(var(--panel));
	background: var(--white);
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	}
#portfolio_ajax .ajax_close:hover {
	transform: rotate(180deg);
	}
#portfolio_ajax .ajax_close img {
	width: 8px;
	height: 8px;
	}
/* LOADER */
#portfolio_ajax .section .screen .panel .loader {
	z-index: 1;
	position: absolute;
	width: 24px;
	height: 24px;
	top: calc(50% - 12px);
	left: calc(50% - 12px);
	border: 2px solid var(--white_25);
	border-top-color: var(--white);
	border-radius: 100%;
	mix-blend-mode: difference;
	pointer-events: none;
	animation: loader 1s linear infinite;
	}
@keyframes loader {
	100% {
		transform: rotate(360deg);
		}
	}
/* MEDIA */
@media screen and (max-width: 1919px) {
	#portfolio_ajax.video:not(.format_vertical) {
		width: 80vw;
		max-width: unset;
		max-height: 80svh;
		}
	}
@media screen and (max-width: 1279px) {
	#portfolio_ajax .ajax_close::before {
		content: '';
		position: absolute;
		inset: -40px;
		}
	}
@media screen and (max-width: 767px) {
	#portfolio_ajax .ajax_close {
		top: 40px;
		right: 40px;
		}
	}


/* MISC */
/* MISC */
/* MISC */
.space {
	height: var(--gapSmall);
	}
#main h4 {
	margin: 0px 0px var(--gapSmall) 0px;
	text-transform: uppercase;
	font: 700 24px/1 "Khand", serif;
	letter-spacing: 2px;
	color: var(--black);
	}


/* DEBUG */
/* DEBUG */
/* DEBUG */
#debug {
	z-index: 6;
	position: fixed;
	width: 400px;
	max-height: 50dvh;
	left: calc(50% - 200px);
	bottom: 40px;
	padding: 40px;
	background: rgba(0,0,0,0.75);
	color: var(--white);
	font: 400 10px/1.25 monospace;
	border-radius: 40px;
	corner-shape: squircle;
	overflow-y: scroll;
	display: none;
	}
#debug::-webkit-scrollbar {
	display: none;
	}
#debug .line {
	margin: 0px 0px 5px 0px;
	}
/* VEHEL */
.vehel #debug {
	/* display: block; */
	}