@charset "UTF-8";

/**************************/
/**************************/
/********** VARS **********/
/**************************/
/**************************/

/* https://easings.net/fr */

:root {
	/* duration */
	--duration-fast: .25s;
	--duration-normal: .5s;
	--duration-slow: 1s;
	/* easing */
	--ease-fast: cubic-bezier(0,.5,.5,1);
	--elastic: cubic-bezier(1, 0.01, 0, 1.22);
	--ease: ease;
	--easeInQuint: cubic-bezier(0.64, 0, 0.78, 0);
	--easeOutQuint: cubic-bezier(0.22, 1, 0.36, 1);
}

/********************************/
/********************************/
/********** ANIMATIONS **********/
/********************************/
/********************************/

/*******************************/
/********** STRUCTURE **********/
/*******************************/

body {
	transition:
	color var(--duration-fast) var(--ease),
	text-shadow var(--duration-fast) var(--ease), 
	background var(--duration-slow) var(--ease);
}
header {
	transition:
	opacity var(--duration-fast) var(--ease),
	background var(--duration-normal) var(--ease);
}
main,
footer {
	transition:
	opacity var(--duration-fast) var(--ease-fast),
	transform var(--duration-normal) var(--ease);
}

/********************************/
/********** INTRODUCED **********/
/********************************/
/*
body.introduced:not(.off) header:after {
	transition:
	opacity var(--duration-fast) var(--ease) calc(var(--duration-fast) / 1),
	transform var(--duration-fast) var(--ease) calc(var(--duration-fast) / 1),
	background var(--duration-fast) var(--ease) calc(var(--duration-fast) / 1);
}
body.introduced.off header:after {
	transition:
	opacity var(--duration-fast) var(--ease),
	transform var(--duration-fast) var(--ease),
	background var(--duration-fast) var(--ease);
}
*/
/****************************/
/********** STYLES **********/
/****************************/

.event-title {
	transition:
	color var(--duration-fast) var(--ease-fast),
	text-decoration var(--duration-fast) var(--ease-fast),
	width var(--duration-fast) var(--ease-fast),
	transform var(--duration-fast) var(--ease-fast);
}
.event-description span {
	/*transition:
	border var(--duration-normal) var(--elastic);*/
	transition:
	text-decoration var(--duration-normal) var(--elastic);
}

/*************************/
/********** NAV **********/
/*************************/

a,
nav a {
	transition:
	color var(--duration-fast) var(--ease),
	text-shadow var(--duration-fast) var(--ease),
	text-decoration var(--duration-fast) var(--ease),
	opacity var(--duration-fast) var(--ease),
	border var(--duration-fast) var(--ease),
	width var(--duration-fast) var(--elastic),
	transform var(--duration-fast) var(--elastic),
	background var(--duration-fast) var(--ease);
}
a:after,
nav a:after {
	transition:
	width var(--duration-normal) var(--elastic),
	transform var(--duration-normal) var(--elastic);
}

/********************************/
/********** CONTEXTUAL **********/
/********************************/

#contextual {
	transition:
	opacity var(--duration-fast) var(--ease);
}

/*********************************/
/********** COLLAPSIBLE **********/
/*********************************/

a.collapse-toggle > * {
	transition:
	transform var(--duration-normal) var(--elastic);
}
/* out */
.collapsible {
	transition:
	max-height var(--duration-fast) var(--elastic) calc(var(--duration-fast) / 2),
	margin var(--duration-fast) var(--ease) calc(var(--duration-fast) / 2),
	opacity var(--duration-fast) var(--ease);
}
.collapsible > * {
	transition:
	opacity var(--duration-fast) var(--ease);
}
/* in */
.collapsible.collapsed {
	transition:
	max-height var(--duration-fast) var(--elastic),
	margin var(--duration-fast) var(--ease) calc(var(--duration-fast) / 2),
	opacity var(--duration-fast) var(--ease) calc(var(--duration-fast) / 2);
}
.collapsible.collapsed > * {
	transition:
	opacity var(--duration-fast) var(--ease) calc(var(--duration-fast) / 2);
}

/********************************/
/********** NAVIGATION **********/
/********************************/

#navigation {
	transition:
	visibility .01s linear calc(var(--duration-normal) * 1.5),
	height var(--duration-normal) var(--easeInQuint) calc(var(--duration-normal) / 2);
}
body.expanded #navigation {
	transition:
	visibility .01s linear,
	height var(--duration-normal) var(--easeOutQuint);
}
#navigation .navigation-content > * {
	transition:
	opacity var(--duration-normal) var(--easeInQuint),
	transform var(--duration-normal) var(--easeInQuint);
}
body.expanded #navigation .navigation-content > * {
	transition:
	opacity var(--duration-normal) var(--easeOutQuint) calc(var(--duration-normal) / 2),
	transform var(--duration-normal) var(--easeOutQuint) calc(var(--duration-normal) / 2);
}

/*****************************/
/********** PRIMARY **********/
/*****************************/

nav.primary {
	transition:
	visibility .01s linear calc(var(--duration-normal) * 1.5),
	opacity var(--duration-normal) var(--easeInQuint) calc(var(--duration-normal) / 2),
	transform var(--duration-normal) var(--easeInQuint) calc(var(--duration-normal) / 2);
}
body.expanded nav.primary {
	transition:
	visibility .01s linear,
	opacity var(--duration-normal) var(--easeOutQuint),
	transform var(--duration-normal) var(--easeOutQuint);
}
nav.primary a span {
	transition:inherit;
}

/*****************************/
/********** SITEMAP **********/
/*****************************/

#sitemap .menu a {
	transition:
	color var(--duration-normal) var(--ease),
	text-decoration var(--duration-normal) var(--ease),
	opacity var(--duration-normal) var(--ease),
	width var(--duration-normal) var(--elastic),
	transform var(--duration-normal) var(--elastic),
	visibility .01s linear calc(var(--duration-normal) * 1.5);
}
body.expanded #sitemap .menu a {
	transition:
	color var(--duration-normal) var(--ease),
	text-decoration var(--duration-normal) var(--ease),
	opacity var(--duration-normal) var(--ease),
	width var(--duration-normal) var(--elastic),
	transform var(--duration-normal) var(--elastic),
	visibility .01s linear;
}

/****************************/
/********** MEDIAS **********/
/****************************/

/* in */
.mediaplayer-container.is-playing iframe,
.mediaplayer-container.is-playing .v-controlBar:after {
	transition:
	opacity var(--duration-fast) var(--ease) var(--duration-fast) !important;
}
/* out */
.mediaplayer-container.is-paused iframe,
.mediaplayer-container.is-paused .v-controlBar:after {
	transition:
	opacity var(--duration-fast) var(--ease) !important;
}

/***************************/
/********** ICONS **********/
/***************************/

svg > * {
	transition:
	fill var(--duration-fast) var(--ease),
	stroke var(--duration-fast) var(--ease);
}
[class^="icon-"].animated .label,
[class^="icon-"].animated .label:before,
[class^="icon-"].animated .label:after {
	transition:
	transform var(--duration-fast) var(--elastic),
	right var(--duration-fast) var(--elastic),
	margin var(--duration-fast) var(--elastic),
	clip-path var(--duration-fast) var(--elastic),
	height var(--duration-fast) var(--elastic),
	width var(--duration-fast) var(--elastic);
}

/**************************/
/********** GRID **********/
/**************************/

.grid .item {
	transition:
	opacity var(--duration-normal) var(--ease),
	transform var(--duration-normal) var(--ease);
}
.grid .item.off {
	transition:
	opacity var(--duration-fast) var(--ease),
	transform var(--duration-fast) var(--ease);
}

/******************************/
/********** OVERLAYS **********/
/******************************/

.overlay {
	transition:
	opacity var(--duration-normal) var(--easeInQuint),
	transform calc(var(--duration-fast) / 2) var(--easeInQuint),
	visibility .01s linear var(--duration-normal);
}
.overlay-content {
	transition:
	opacity var(--duration-normal) var(--easeInQuint);
}
.clickoutside {
	transition:
	opacity calc(var(--duration-fast) / 2) var(--easeInQuint),
	visibility .01s linear var(--duration-normal);
}
.overlay.active {
	transition:
	visibility .01s linear,
	opacity var(--duration-normal) var(--easeOutQuint) calc(var(--duration-fast) / 2),
	transform calc(var(--duration-fast) / 2) var(--easeOutQuint) calc(var(--duration-fast) / 4);
}
.overlay.active .overlay-content {
	transition:
	opacity var(--duration-normal) var(--easeOutQuint)  calc(var(--duration-fast) / 2);
}
body.overlayed .clickoutside {
	transition:
	opacity  calc(var(--duration-fast) / 2) var(--easeOutQuint),
	visibility .01s linear  calc(var(--duration-fast) / 2);
}
body.onload .overlay {
	transition: none;
}

/***************************/
/********** FORMS **********/
/***************************/

input[type="radio"],
input[type="checkbox"] {
	-webkit-transition:-webkit-box-shadow var(--duration-fast) var(--ease-fast);
	transition:-webkit-box-shadow var(--duration-fast) var(--ease-fast);
	-o-transition:box-shadow var(--duration-fast) var(--ease-fast);
	-moz-transition:box-shadow var(--duration-fast) var(--ease-fast), -moz-box-shadow var(--duration-fast) var(--ease-fast);
	transition:box-shadow var(--duration-fast) var(--ease-fast);
	transition:box-shadow var(--duration-fast) var(--ease-fast), -webkit-box-shadow var(--duration-fast) var(--ease-fast), -moz-box-shadow var(--duration-fast) var(--ease-fast);
}
input[type="submit"],
button {
	-webkit-transition:
	color var(--duration-fast) var(--ease-fast),
	text-shadow var(--duration-fast) var(--ease-fast),
	opacity var(--duration-fast) var(--ease-fast),
	border var(--duration-fast) var(--ease-fast),
	-webkit-transform var(--duration-fast) var(--ease-fast) !important;
	transition:
	color var(--duration-fast) var(--ease-fast),
	text-shadow var(--duration-fast) var(--ease-fast),
	opacity var(--duration-fast) var(--ease-fast),
	border var(--duration-fast) var(--ease-fast),
	-webkit-transform var(--duration-fast) var(--ease-fast) !important;
	-o-transition:
	color var(--duration-fast) var(--ease-fast),
	text-shadow var(--duration-fast) var(--ease-fast),
	opacity var(--duration-fast) var(--ease-fast),
	border var(--duration-fast) var(--ease-fast),
	-o-transform var(--duration-fast) var(--ease-fast) !important;
	-moz-transition:
	color var(--duration-fast) var(--ease-fast),
	text-shadow var(--duration-fast) var(--ease-fast),
	transform var(--duration-fast) var(--ease-fast),
	opacity var(--duration-fast) var(--ease-fast),
	border var(--duration-fast) var(--ease-fast),
	-moz-transform var(--duration-fast) var(--ease-fast) !important;
	transition:
	color var(--duration-fast) var(--ease-fast),
	text-shadow var(--duration-fast) var(--ease-fast),
	transform var(--duration-fast) var(--ease-fast),
	opacity var(--duration-fast) var(--ease-fast),
	border var(--duration-fast) var(--ease-fast) !important;
	transition:
	color var(--duration-fast) var(--ease-fast),
	text-shadow var(--duration-fast) var(--ease-fast),
	transform var(--duration-fast) var(--ease-fast),
	opacity var(--duration-fast) var(--ease-fast),
	border var(--duration-fast) var(--ease-fast),
	-webkit-transform var(--duration-fast) var(--ease-fast),
	-moz-transform var(--duration-fast) var(--ease-fast),
	-o-transform var(--duration-fast) var(--ease-fast) !important;
}

input[type="radio"]:before,
input[type="checkbox"]:before {
	transition:
	opacity var(--duration-fast) var(--ease-fast) !important;
}

/****************************/
/********** SWIPER **********/
/****************************/

.swiper-container .swiper-controls .previous,
.swiper-container .swiper-controls .next {
	transition:
	transform var(--duration-fast) var(--ease),
	margin var(--duration-fast) var(--ease);
}

/*****************************/
/********** INSTANT **********/
/*****************************/

.instant-transition {
	-webkit-transition:none;
	-o-transition:none;
	-moz-transition:none;
	transition:none;
}

/****************************/
/****************************/
/********** LOADER **********/
/****************************/
/****************************/

/** icon only **/

/*
.loader:before {
	content:"" !important;
	display:inline-block;
	height:2rem;
	width:2rem;
	margin:-.5rem;
	-webkit-border-radius:50%;
	   -moz-border-radius:50%;
	        border-radius:50%;
	border-style:solid;
	border-width:var(--logo-line-height);
	border-bottom:solid var(--logo-line-height) transparent;
	-webkit-animation: spinner 1s infinite linear;
	   -moz-animation: spinner 1s infinite linear;
	     -o-animation: spinner 1s infinite linear;
	        animation: spinner 1s infinite linear;
}
*/

/** loading txt **/

.is-loading:before {
	content:"";
	display:inline-block;
	vertical-align:middle;
	height: calc(var(--line-height) * 8);
	width: calc(var(--line-height) * 8);
	border-radius: 50%;
	box-shadow: inset 0 0 0 calc(var(--line-height) * 8);
	color: var(--primary-color);
	animation: pulse .5s infinite linear;
	/*
	height:1.75em;
	width:1.75em;
	margin:-.375em .375em -.375em -.375em;
	-webkit-border-radius:50%;
	   -moz-border-radius:50%;
	        border-radius:50%;
	border-style:solid;
	border-width:var(--logo-line-height);
	border-bottom:solid var(--logo-line-height) transparent;
	color:var(--primary-color);
	text-shadow:0 0 0 var(--primary-color);
	-webkit-animation: spinner .5s infinite linear;
	   -moz-animation: spinner .5s infinite linear;
	     -o-animation: spinner .5s infinite linear;
	        animation: spinner .5s infinite linear;
	*/
}

@keyframes pulse {
	0% { padding:0; }
	50% { padding:calc(var(--line-height) * 4); }
	100% { padding:0; }
}

/** dot pulse animation **/

.loader {
	position: relative;
	display: inline-block;
	left: -1000rem;
	height: calc(var(--line-height) * 4);
	width: calc(var(--line-height) * 4);
	border-radius: 50%;
	color: var(--primary-color);
	box-shadow: 1000rem 0 0 calc(var(--line-height) * -2);
	animation: dot-pulse 1.5s infinite linear;
	animation-delay: 0.25s;
}
.loader:before,
.loader:after {
	content: "";
	display: inline-block;
	position: absolute;
	top: 0;
	height: calc(var(--line-height) * 4);
	width: calc(var(--line-height) * 4);
	border-radius: 50%;
	color: var(--primary-color);
}
.loader:before {
	box-shadow: calc(1000rem - var(--line-height) * 8) 0 0 calc(var(--line-height) * -2);
	animation: dot-pulse-before 1.5s infinite linear;
	animation-delay: 0s;
}
.loader:after {
	box-shadow: calc(1000rem + var(--line-height) * 8) 0 0 calc(var(--line-height) * -2);
	animation: dot-pulse-after 1.5s infinite linear;
	animation-delay: 0.5s;
}
@keyframes dot-pulse-before {
	0% { box-shadow: calc(1000rem - var(--line-height) * 8) 0 0 calc(var(--line-height) * -2); }
	30% { box-shadow: calc(1000rem - var(--line-height) * 8) 0 0  calc(var(--line-height) * 2); }
	60%, 100% { box-shadow: calc(1000rem - var(--line-height) * 8) 0 0  calc(var(--line-height) * -2); }
}
@keyframes dot-pulse {
	0% { box-shadow: 1000rem 0 0 calc(var(--line-height) * -2); }
	30% { box-shadow: 1000rem 0 0 calc(var(--line-height) * 2); }
	60%, 100% { box-shadow: 1000rem 0 0 calc(var(--line-height) * -2); }
}
@keyframes dot-pulse-after {
	0% { box-shadow: calc(1000rem + var(--line-height) * 8) 0 0 calc(var(--line-height) * -2); }
	30% { box-shadow: calc(1000rem + var(--line-height) * 8) 0 0 calc(var(--line-height) * 2); }
	60%, 100% { box-shadow: calc(1000rem + var(--line-height) * 8) 0 0 calc(var(--line-height) * -2); }
 }


/*
.loader {
	position: relative;
	display: inline-flex;
	
	height: calc(var(--line-height) * 4);
	width: calc(var(--line-height) * 4);
	border-radius: 50%;
	color: var(--primary-color);
	box-shadow:inset 0 0 0 calc(var(--line-height) * 4);
	animation: dot-pulse 1.5s infinite linear;
	animation-delay: 0.25s;
}
.loader:before,
.loader:after {
	content: "";
	position:absolute;
	top:0;
	left:0;
	display: inline-block;
	height: calc(var(--line-height) * 4);
	width: calc(var(--line-height) * 4);
	border-radius: 50%;
	color: var(--primary-color);
	box-shadow:inset 0 0 0 calc(var(--line-height) * 4);
}
.loader:before {
	left:calc(-100% - var(--line-height) * 2);
	animation: dot-pulse 1.5s infinite linear;
	animation-delay: 0s;
}
.loader:after {
	left:calc(100% + var(--line-height) * 2);
	animation: dot-pulse 1.5s infinite linear;
	animation-delay: 0.5s;
}
@keyframes dot-pulse {
	0% {
		transform:scale(1);
	}
	30% {
		transform: scale(1.5);
	}
	60%, 100% {
		transform: scale(1);
	}
}
*/

/*
@keyframes dot-pulse {
	0% {
		box-shadow:inset 0 0 0 calc(var(--line-height) * 4);
	}
	30% {
		box-shadow:inset 0 0 0 calc(var(--line-height) * 8);
	}
	60%, 100% {
		box-shadow:inset 0 0 0 calc(var(--line-height) * 4);
	}
}
*/







/********** SPINNER **********/

@-webkit-keyframes spinner {
	0%, 50%, 100% { -webkit-animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); }
	0% { -webkit-transform: rotate(0); }
	50% { -webkit-transform: rotate(180deg); }
	100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes spinner {
	0%, 50%, 100% { -moz-animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); }
	0% { -moz-transform: rotate(0); }
	50% { -moz-transform: rotate(180deg); }
	100% { -moz-transform: rotate(360deg); }
}
@-o-keyframes spinner {
	0%, 50%, 100% { -o-animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); }
	0% { -o-transform: rotate(0); transform: rotate(0); }
	50% { -o-transform: rotate(180deg); transform: rotate(180deg); }
	100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes spinner {
	0%, 50%, 100% { -webkit-animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); -moz-animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); -o-animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); animation-timing-function: cubic-bezier(0.5, 0.5, 0.5, 0.5); }
	0% { -webkit-transform: rotate(0); -moz-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
	50% { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
	100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}


/***************************/
/***************************/
/********** NO JS **********/
/***************************/
/***************************/

/** global **/

body.no-js {
	pointer-events:all;
}