/* dancing-script-regular - latin */
@font-face {
	font-family: 'Dancing Script';
	font-style: normal;
	font-weight: 400;
	src: url('/static/fonts/dancing-script-v19-latin-regular.eot');
		/* IE9 Compat Modes */
	src: local(''),
		url('/static/fonts/dancing-script-v19-latin-regular.eot?#iefix')
		format('embedded-opentype'), /* IE6-IE8 */
      url('/static/fonts/dancing-script-v19-latin-regular.woff2')
		format('woff2'), /* Super Modern Browsers */
		url('/static/fonts/dancing-script-v19-latin-regular.woff')
		format('woff'), /* Modern Browsers */
      url('/static/fonts/dancing-script-v19-latin-regular.ttf')
		format('truetype'), /* Safari, Android, iOS */
      url('/static/fonts/dancing-script-v19-latin-regular.svg#DancingScript')
		format('svg'); /* Legacy iOS */
}

/* Pacifico-regular */
@font-face {
	font-family: 'Pacifico';
	font-style: normal;
	font-weight: 400;
	src: local(''),
		url('/static/fonts/Pacifico-Regular.ttf')
		format('truetype');
}

/* Karla */
@font-face {
	font-family: 'Karla';
	font-weight: 700;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-BoldItalic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 700;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-Bold.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 800;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-ExtraBoldItalic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 800;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-ExtraBold.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 200;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-ExtraLightItalic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 200;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-ExtraLight.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 400;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-Italic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 300;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-LightItalic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 300;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-Light.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 500;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-MediumItalic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 500;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-Medium.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 400;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-Regular.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 600;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-SemiBoldItalic.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 600;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-SemiBold.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Karla';
	font-weight: 200 800;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Karla-VariableFont_wght.ttf')
		format('truetype-variations');
}
@font-face {
	font-family: 'Karla';
	font-weight: 200 800;
	font-style: italic;
	src: local(''),
		url('/static/fonts/Karla-Italic-VariableFont_wght.ttf')
		format('truetype-variations');
}

/* Sylkscreen */
@font-face {
	font-family: 'Sylkscreen';
	font-weight: 700;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Silkscreen-Bold.ttf')
		format('truetype');
}
@font-face {
	font-family: 'Sylkscreen';
	font-weight: 400;
	font-style: normal;
	src: local('')
		url('/static/fonts/Silkscreen-Regular.ttf')
		format('truetype');
}

/* Bungee Shade */
@font-face {
	font-family: 'BungeeShade';
	font-weight: 400;
	font-style: normal;
	src: local(''),
		url('/static/fonts/BungeeShade-Regular.ttf')
		format('truetype');
}

/* Cookie */
@font-face {
	font-family: 'Cookie';
	font-weight: 400;
	font-style: normal;
	src: local(''),
		url('/static/fonts/Cookie-Regular.ttf')
		format('truetype')
}

* {
	font-family 		: 'Karla';
	font-weight 		: normal;
	font-size 			: 16px;
}

body {
	background-color 	: #228B22;
	display 				: flex;
	flex-direction 	: column;
	justify-content 	: center;
	margin-left 		: auto;
	margin-right 		: auto;
	margin-top 			: 0px;
	margin-bottom 		: 0px;
	max-width 			: 1024px;
}

:root {
	--form-control-color 	: orange;
}

b {
	font-weight 		: bold;
	font-style 			: inherit;
}

i {
	font-style 			: italic;
	font-weight 		: inherit;
}

input[type="button"] {
	border-radius 		: 10px;
	background-color 	: orange;
	border-color 		: #006400;
}

/* --   Top menu   --
   ------------------ */

#topMenu {
	display				: flex;
	flex-direction		: row-reverse;
	flex-wrap			: wrap;
	justify-content	: flex-start;
	width					: 50%;
	margin-left			: auto;
	margin-right		: 0px;
	position 			: relative;
	top 					: 10px;
	right 				: 10px;
	height 				: 0px;
}

#topMenu button {
	padding-left		: 5px;
	padding-right		: 5px;
	padding-top			: 5px;
	padding-bottom		: 5px;
	border-width		: 0px;
	background-color	: transparent;
	cursor				: pointer;
}

#topMenu button img {
	width					: 36px;
}


/* --   Main title   --
   -------------------- */

#topHighPage {
	display 				: flex;
	flex-direction 	: column;
	justify-content 	: center;
	padding-left 		: 5px;
	padding-right 		: 5px;
}

#bigTitre {
	display				: flex;
	flex-direction		: column;
	align-items			: center;
	justify-content	: center;
}

#bigTitre img {
	max-width			: 200px;
	width					: 80%;
}

#bigTitre h1 {
	font-family			: 'Dancing Script', cursive;
	font-size 			: 64px;
	margin-bottom 		: 0px;
}

#bigTitre h2 {
	font-family			: 'Dancing Script', cursive;
	font-size 			: 24px;
	margin-top 			: 15px;
	margin-bottom 		: 20px;
}

#redTitre {
	display				: flex;
	flex-direction		: row;
	align-items			: center;
	justify-content	: left;
	width					: 50%;
}

#redTitre img {
	width					: 80px;
	padding-left		: 20px;
	padding-right		: 20px;
	padding-top			: 5px;
	padding-bottom		: 5px;
}

#redTitre h2 {
	font-family			: 'Dancing Script', cursive;
	font-size			: 32px;
	padding-left		: 20px;
	padding-right		: 20px;
	padding-top			: 5px;
	padding-bottom		: 5px;
}


/* --   Scroller   --
   ------------------ */

#cntPublicSlides {
	width 				: 100%;
	height 				: 70vh;
	margin-left 		: 0px;
	margin-right 		: 0px;
	margin-top 			: 5px;
	margin-bottom 		: 5px;
	padding-left 		: 0px;
	padding-right 		: 0px;
	padding-top 		: 0px;
	padding-bottom 	: 0px;
	background-color 	: black;
	display 				: flex;
	flex-direction 	: column;
	justify-content 	: center;
	align-items 		: center;
}

#publicSlides {
	display 				: flex;
	flex-direction 	: column;
	justify-content	: center;
	height 				: 95%;
	width 				: 95%;
	background-size 	: contain;
	background-repeat : no-repeat;
	background-position: center;
}

#imgSelector {
	display 				: flex;
	flex-direction 	: row;
	justify-content 	: center;
	align-items 		: end;
}

#imgSelector > input[type="radio"] {
	cursor 				: pointer;
	appearance 			: none;
	background-color 	: black;
	margin-top 			: 0.5em;
	margin-bottom 		: 0.5em;
	margin-left 		: 0.2em;
	margin-right 		: 0.2em;
	width 				: 1.15em;
	height 				: 1.15em;
	border-color		: white;
	border-style 		: solid;
	border-width 		: 0.15em;
	border-radius 		: 50%;
	font-size 			: 9px;
	display 				: grid;
	place-content 		: center;
}

#imgSelector > input[type="radio"]::before {
	content 				: "";
	width 				: 0.65em;
	height 				: 0.65em;
	border-radius 		: 50%;
	box-shadow 			: inset 1em 1em var(--form-control-color);
	transform 			: scale(0);
}

#imgSelector > input[type="radio"]:checked::before {
	transform 			: scale(1) translate( 0.01em, 0.03em );
}

#slidePlayers {
	position 			: relative;
	width 				: 100%;
	height 				: 0px;
}

#slidePlayers img {
	opacity 				: 30%;
	width  				: 96px;
	height 				: 96px;
	position 			: absolute;
	top 					: 5px;
	right 				: 15px;
	cursor 				: pointer;
}


/* --   Page Footer   --
   --------------------- */

footer {
	display  			: flex;
	flex-direction 	: row;
	font-family 		: 'Karla';
	font-weight 		: normal;
	font-size 			: 14px;
	background-color 	: #006400;
	margin-top 			: 20px;
}

footer a:link {
	color 				: orange;
	text-decoration 	: none;
}

footer a:visited {
	color 				: orange;
	text-decoration 	: none;
}

footer ul {
	list-style 			: none;
}

footer ul li::before {
	content 				: "\2022";
	color 				: orange;
	font-weight 		: bold;
	display 				: inline-block;
	width 				: 1em;
	margin-left 		: -1em;
}

.footCol {
	width 				: 30%;
	padding-top 		: 15px;
	padding-left 		: 30px;
	padding-bottom 	: 15px;
}

.footCol li {
	padding-top 		: 5px;
	padding-bottom 	: 5px;
	cursor 				: pointer;
}

#revision {
	display 				: flex;
	flex-grow 			: 1;
	flex-direction 	: column;
	justify-content 	: end;
}

#revision p {
	margin-top 			: 0px;
	margin-bottom 		: 0px;
	text-align 			: right;
	font-size 			: 8px;
}

.colSpace {
	flex-grow 			: 2;
}

#footLastCol {
	display 				: flex;
	flex-direction 	: column;
}

/* --   Menu with images  --
   ------------------------- */

.menuTbl {
	display 				: grid;
	grid-template-columns: auto auto;
	row-gap 				: 20px;
	margin-top 			: 5vh;
	margin-bottom 		: 20px;
	align-items 		: center;
}

.menuTbl > div {
	display 				: flex;
	flex-direction 	: column;
	align-items 		: center;
	margin-top 			: 2vh;
	margin-bottom 		: 2vh;
}

.menuTbl > div > h3 {
	font-family 		: 'Dancing Script', cursive;
	font-size 			: 36px;
	margin-top 			: 10px;
	margin-bottom 		: 10px;
}

.menuTbl > div > img {
	width 				: 20vw;
	height 				: auto;
	cursor 				: pointer;
}


/* --  Articles  --
   ---------------- */

.article {
	display 				: flex;
	flex-direction 	: row;
	padding-left 		: 5vw;
	padding-right 		: 5vw;
	padding-top 		: 5vh;
}

.article div {
	width 				: 50%;
}

.lIconArt {
	text-align 			: left;
}

.rIconArt {
	text-align 			: right;
}

.article img {
	width 				: 64px;
	height 				: auto;
}

.lIconArt img {
	cursor 				: pointer;
}

.articleBody {
	padding-left 		: 5vw;
	padding-right 		: 5vw;
	padding-top 		: 2vh;
	padding-bottom		: 5vh;
}

.articleBody h1 {
	font-family 		: 'Karla';
	font-weight 		: bold;
	font-size 			: 32px;
	text-align 			: center;
}

.articleBody h2 {
	font-family 		: 'Karla';
	font-weight 		: bold;
	font-size 			: 24px;
	text-align 			: left;
	padding-top 		: 20px;
}

.articleBody h3 {
	font-family 		: 'Karla';
	font-weight 		: normal;
	font-style 			: italic;
	font-size 			: 16px;
	text-align 			: center;
}

.articleBody p {
	font-family 		: 'Karla';
	font-weight 		: normal;
	font-size 			: 16px;
	text-align 			: justify;
	margin-top 			: 8px;
	margin-bottom 		: 8px;
	text-indent 		: 1.25cm;
}

.articleBody dl.listArticles {
	margin-top 			: 20px;
	margin-bottom 		: 20px;
}

.articleBody dt.listArticles {
	font-family 		: 'Karla';
	font-weight 		: bold;
	font-size 			: 20px;
	padding-top 		: 16px;
	padding-bottom 	: 16px;
}

.articleBody ul.sousListArticles {
	margin-top 			: 10px;
	margin-bottom 		: 10px;
}

.articleBody li.sousListArticles {
	padding-top 		: 15px;
	padding-bottom 	: 15px;
}

.articleBody ol.TOC {
	counter-reset 		: cTOC;
	counter-reset 		: qssTOC;
}

.articleBody li.elTOC {
	padding-top 		: 5px;
	padding-bottom 	: 5px;
	counter-increment : cTOC;
	counter-reset 		: csTOC;
	list-style-type 	: none;
}

.articleBody li.elTOC::before {
	content 				: counter(cTOC) ". ";
}

.articleBody li.elSubTOC {
	padding-top 		: 5px;
	padding-bottom 	: 5px;
	counter-increment : csTOC;
	counter-reset 		: cssTOC;
	list-style-type 	: none;
}

.articleBody li.elSubTOC::before {
	content 				: counter(cTOC) "." counter(csTOC) ". ";
}

.articleBody li.elSubSubTOC {
	padding-top 		: 5px;
	padding-bottom 	: 5px;
	counter-increment : cssTOC;
	list-style-type 	: none;
}

.articleBody li.elSubSubTOC::before {
	content 				: counter(cTOC) "." counter(csTOC) "." counter(cssTOC) ". ";
}

.articleBody li.elSsqTOC {
	padding-top 		: 5px;
	padding-bottom 	: 5px;
	counter-increment : qssTOC;
	list-style-type 	: none;
}

.articleBody li.elSsqTOC::before {
	content 				: counter(qssTOC) ". ";
}

.articleBody a:link {
	color 				: blue;
}

.articleBody a:visited {
	color 				: blue;
}

.articleBody .evMain {
	font-family 		: 'Karla';
	font-size 			: 24px;
	font-weight 		: bold;
	margin-bottom 		: 20px;
	margin-top 			: 40px;
}

.articleBody table.evInfo {
	margin-left 		: 30px;
	margin-bottom 		: 20px;
}

.articleBody table.evInfo > tbody > tr > td:first-child {
	font-family 		: 'Karla';
	font-size 			: 20px;
	font-weight 		: bold;
	padding-left 		: 5px;
	padding-right 		: 15px;
	padding-top 		: 7px;
	padding-bottom 	: 3px;
}

.articleBody table.evInfo > tbody > tr > td:nth-child(2) {
	font-family 		: 'Karla';
	font-size 			: 20px;
	padding-left 		: 5px;
	padding-right 		: 5px;
	padding-top 		: 7px;
	padding-bottom 	: 3px;
}

.articleBody p.evDescr {
	font-family 		: 'Karla';
	font-size 			: 16px;
	margin-left 		: 20px;
	margin-right 		: 30px;
	text-align 			: justify;
	text-indent 		: 0px;
}

.tblBorder {
	border-width 		: 1px;
	border-color 		: black;
	border-style 		: solid;
	border-collapse 	: collapse;
	margin-top 			: 3px;
	margin-bottom 		: 3px;
	margin-left 		: 5px;
	margin-right 		: 5px;
}


/* --  Controls  --
   ---------------- */

#controls {
	width 				: 100%;
	margin-top 			: 30px;
	margin-bottom 		: 20px;
	display 				: flex;
	flex-direction 	: row;
	width 				: 60%;
	margin-left 		: 20%;
	margin-right 		: 20%;
}

#controls > div {
	flex-grow 			: 1;
	text-align 			: center;
}

.defCtrlButton {
	font-size 			: 24px;
	padding-top 		: 5px;
	padding-bottom 	: 5px;
	padding-left 		: 10px;
	padding-right 		: 10px;
	width 				: 12ex;
	background-color 	: orange;
	border-color 		: darkgreen;
	border-width 		: 3px;
	border-radius 		: 10px;
}


/* --   Contact  --
   ---------------- */

#contact {
	display 						: grid;
	grid-template-columns 	: min-content min-content;
	margin-left 				: 5vw;
	margin-right 				: 5vw;
	padding-top 				: 5vh;
}

#contact label {
	font-size 			: 18px;
	margin-top 			: 1vh;
	min-width 			: 22ex;
}

#contact input {
	font-size 			: 18px;
	margin-left 		: 3vw;
	margin-top 			: 1vh;
	margin-bottom 		: 1vh;
	min-width 			: 25em;
}

#contact textarea {
	margin-left 		: 3vw;
	margin-top 			: 1vh;
}


/* --  Services  --
   ---------------- */

#services {
	display 				: flex;
	flex-direction 	: column;
}

#services hr {
	margin-top 			: 10px;
	margin-bottom 		: 10px;
	width 				: 100%;
}

#services div {
	margin-top 			: 10px;
	margin-bottom 		: 10px;
}

#services button {
	padding-left 		: 20px;
	padding-right 		: 20px;
	background-color 	: transparent;
	border-width 		: 0px;
	cursor 				: pointer;
}

#services img {
	width 				: 128px;
}


/* --  Sponsors  --
   ---------------- */

.sponsors {
	display 				: grid;
	grid-template-columns: 20vw auto;
	grid-column-gap 	: 50px;
	grid-row-gap 		: 40px;
	margin-top 			: 30px;
	margin-bottom 		: 30px;
	align-content 		: center;
	align-items 		: center;
}

.sponsors img {
	width 				: 100%;
}

.sponsors h2 {
	margin-top 			: 0px;
	margin-bottom 		: 15px;
	padding-top 		: 0px;
}

.sponsors p {
	text-indent 		: 0px;
}

/* --  Login  --
   ------------- */

.reqArea {
	background-color 	: #808080;
	position 			: fixed;
	top 					: 0px;
	left 					: 0px;
	height 				: 100%;
	width 				: 100%;
	visibility 			: hidden;
	opacity 				: 0.95;
	z-index 				: 10;
	text-align 			: center;
}

#loginArea table {
	position 			: absolute;
	left 					: 30%;
	top 					: 30%;
	font-size 			: 24px;
}

#authArea table {
	position 			: absolute;
	left 					: 25%;
	width 				: 50%;
	top 					: 25%;
	font-size 			: 24px;
}

#changePassword table {
	position 			: absolute;
	left 					: 25%;
	top 					: 25%;
	font-size 			: 24px;
}

.reqArea input {
	font-size			: 24px;
}

.reqArea td {
	padding-top			: 10px;
	padding-bottom		: 10px;
	font-size			: 24px;
}

.reqArea td:last-child {
	padding-left		: 5px;
}

.reqArea td:first-child {
	padding-right		: 5px;
}

.reqArea button {
	width					: 200px;
	margin-top			: 30px;
	margin-left			: 10px;
	margin-right		: 10px;
	padding-top			: 7px;
	padding-bottom		: 7px;

	font-size			: 24px;
	border-width		: 2px;
	border-radius		: 10px;
}

.reqArea tr:last-child td {
	text-align			: center;
}

.btnBlue {
	background-color	: #009AD2;
	border-color		: #03749E;
}

.btnRed {
	background-color	: #ED475F;
	border-color		: #AA3142;
}

.reqArea td.titReq {
	text-align 			: left;
	font-size 			: 28px;
	font-weight 		: bold;
}

.reqArea input[type="radio"] {
	margin-left 		: 20px;
	margin-right 		: 15px;
	margin-top 			: 3px;
}

.reqArea td.selReq {
	text-align 			: left;
	font-size 			: 22px;
	padding-bottom 	: 0px;
}

.reqArea td.descrReq {
	padding-top 		: 0px;
	text-align 			: justify;
	font-family 		: 'Cookie';
	font-size 			: 22px;
}