@charset "utf-8";

/* ---------------------- */
/* &  SUMMARY             */
/* ---------------------- */

/*
	1 - Declarations
	2 - Global styles
	3 - Formulaires
	4 - Structure
	5 - Reusable elements
	6 - Elements Spécifiques
	7 - Media queries
	8 - Etats / Animations
*/

/* ------------------------------ */
/* &  1 -  DECLARATIONS           */
/* ------------------------------ */

	@font-face {
		font-family: 'Lucida Handwriting';
		src: url('fonts/lhandw.woff') format('woff');
		font-weight: normal;
		font-style: normal;
		font-display: swap;
	}

	:root {
		--color1: #575496;
		--color2: #C7C4FF;
		--color3: #DDFFC6;
	}

	:target {
		scroll-margin-top: 2rem;
	}

/* ------------------------------ */
/* &  2 -  GLOBAL STYLES          */
/* ------------------------------ */

	html, body, dt, dd, p, form, fieldset, input {margin:0; padding:0;}
	html {font-size:62.5%;}
	body {font-size:1.45rem; line-height: 1.7; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","Trebuchet MS",sans-serif; color:white; background:#201F23;}

	p {margin-bottom:1em;}
	em {color:silver;}
	img, svg {vertical-align:middle; max-width:100%;}
	svg {overflow: visible; fill: currentColor;}
	table {margin:0 auto; width:100%; border:1px solid #1C1B30; border-collapse:separate; border-spacing:1px;}
	table + table {margin-top: 3em;}
	td {padding:8px; background-color:#414073;}
	th {font-weight:600;}
	th[scope="col"] {border-bottom:1px solid #1C1B30; padding:3px; text-align:center; background-color:#34325A;}
	th[scope="row"] {padding:8px; background-color:#414073; text-align:left;}
	strong {color:#FFF1C6;}
	ins {text-decoration: none;}
	ins::before {content: ""; display: inline-block; margin: 0 0.48em 0 0.21em; width: 0; height: 0; border-style: solid; border-width: 0.33em 0 0.33em 0.5em; border-color: transparent transparent transparent #ffffff;}
	blockquote {padding:0.8em 18px 1px; margin:0.4em 0 1em; border-left: 3px solid var(--color2); background-color:rgba(0, 0, 0, 0.12);}
	fieldset {border:0; margin-top:2em;}
	address {display: inline;}
	input, select {width:100%; padding:0.633em 0.9rem;}
	input[type="radio"], input[type="checkbox"] {width:auto;}
	input, button, textarea, select {box-sizing: border-box; font-size: inherit; line-height: inherit; font-family: inherit; overflow:visible; transition: all 0.15s;}
	input[type="button"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, button::-moz-focus-inner {padding:0; border:0 none;}
	input[type="checkbox"] {position:relative; top:2px; margin-right:8px;}
	button[disabled], .btn[aria-disabled] {cursor:not-allowed;}
	input:focus, button:focus, .btn:focus, textarea:focus, keygen:focus, select:focus {outline-offset: 2px;}
	select {background-color:#47457B; border:1px solid #D0CEFF; color:white;}
	textarea {box-sizing:border-box; width:100%; background-color: #47457B; color:white; border:1px solid #D0CEFF; padding:3px;}

	details {padding: 0 16px; border-bottom: 1px solid rgba(0, 0, 0, 0.3); background-color: rgba(0, 0, 0, 0.23);}
	details + details {margin-top: 1em;}
	summary {padding: 0.8em 0; cursor: pointer; font-weight: 600;}
	[open] summary {margin-bottom: 0.5em;}

	/* Titres */
	h1, h2, h3, h4, .heading {font-weight:normal; line-height:130%; font-family:Georgia, serif;}
	h1 {font-size:180%; margin-top:1.2em; margin-bottom:1em;}
	h2 {font-size:150%; margin-top:1.8em; margin-bottom:1.2em;}
	h3 {font-size:180%; margin:0 0 1em;}
	h4 {font-size:120%; text-align:left; font-weight:600; margin:60px 0 20px 0;}

	.heading0 {font-size: 100%;}
	.heading1 {font-size: 202%; text-shadow:0 0 0.15em rgba(0,0,0,0.6), 0 0 0.15em rgba(0,0,0,0.6), 0 0 0.15em rgba(0,0,0,0.6);}
	.heading3 {font-size:180%;}
	.heading4 {text-transform:uppercase; font-weight: 600; font-size: 120%; font-family: inherit; letter-spacing: 0.5px;}

/****
* Helpers
****/
	.floatR {float:right; width:auto;}
	.flexAuto {flex:1 1 auto;}
	.pseudo {text-transform:capitalize; font-weight: 600;}
	.txtC {text-align:center;}
	.visuallyHidden, .miel {position:absolute; width:1px; height:0; left:0; margin:0; padding:0 !important; overflow:hidden !important; background:none !important; border:none !important; color:transparent !important;}
	.clear {clear:both;}

	.small {font-size:90%; font-weight:normal;}
	.txt1 {font-weight:600; color:#55FFFF;}
	.txt2 {font-weight:600; color:#FFF1C6;}
	.txt3 {color:silver; font-weight:normal;}
	.txt4 {color:#F2CF50;}

/****
* Liens
****/
	a img {border:none; vertical-align:bottom;}
	a, .link {color:var(--color2); text-decoration-color:transparent; text-decoration-skip-ink: auto; transition:color 150ms, border-color 150ms, background-color 150ms, text-decoration-color 150ms;}
	.link {border:none; padding: 0; background: transparent; text-decoration-line: underline; cursor: pointer;}
	a:hover, a:active, .link:hover, .link:active {color:var(--color3); text-decoration-color: currentColor;}
	.link-active {color:var(--color3);}

	.link1 {font-weight: 600;}
	.link2 {color:silver; font-weight:normal; text-decoration-color:transparent;}
	.link3 {color:currentColor; font-weight:normal; text-decoration-color:transparent;}

	.thumb {display:block; border-radius:4px; padding:3px; border:1px solid #625FA7; font-weight:normal; text-align:center; color:#aaa;}
	.thumb:hover, .thumb:focus, .thumbPreview {border:2px solid var(--color3); padding:2px; transition:border-color ease 0.25s; color:#aaa;}
	.thumbAdd {display:flex; box-sizing:border-box; width:144px; padding:0 20px; height:113px; justify-content:center; align-items:center; border:1px dashed #9996CF; cursor:pointer;}
	.thumbAdd:hover, .thumbAdd:focus {padding:0 20px;}
	.thumbNew {border:2px solid #55FFFF; padding:2px;}

	.ancretop {float:right; padding:3px;}
/* FIN liens */


/* ------------------------------ */
/* &  3 -  FORMULAIRES   	      */
/* ------------------------------ */

	.formUnit {display:flex; flex-direction: column; margin: 1em calc(15% - 35px) 2em; list-style: none;}
	.formUnit1 {margin-bottom: 1.2em;}
	.formLabel {display:inline-block; margin:0.4em 0; font-weight: 600; color: #FFF1C6;}
	.formLabel1 {display:inline-block; margin:0.4em 0;}
	.formDescription {font-size: 90%; color:silver; margin-top: 0.3rem;}

	.input {transition:all 0.15s;}
	.input1, .input2, .input3, .input4 {color: white; text-align:left; vertical-align: middle; transition: all 0.15s;}
	.input1:hover, .input2:hover, .input3:hover, .input4:hover, .input1:focus, .input2:focus, .input3:focus {border-color:var(--color3);}
	.input1 {max-width:260px; border: 1px solid #9996CF; background: #383660; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset;}
	.input2 {max-width: 190px; align-self:flex-start;}
	.input2, .input3 {border:1px solid #D0CEFF; background-color: #47457B; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset;}
	.input4 {border:1px dashed #9996CF; background: transparent;}
	.input4:hover, .input4:focus {background:rgba(0,0,0,0.4); box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) inset;}
	.input4:focus {border-style: solid; border-color: #9996CF;}
	.input5 {background:#666666; border:1px solid #16171A; box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, 0.2); border-radius:3px; color: white;}
	.input5:hover  {background-color:#777777;}
	.input5:focus  {border-color:#CFCFCF; background:#666666;}

	.select1 {font-family:inherit; border:none;}
	.select1 option {padding:2px 16px 2px 5px;}

	input.error {outline:2px solid red;}

	.meter {display:inline-block; background: rgba(255, 255, 255, 0.1);}

	/* The gray background in Chrome, etc. */
	meter::-webkit-meter-bar {
		background: transparent;
		border: none;
		border-radius: 0;
		height: 10px;
	}

	meter:-moz-meter-optimum::-moz-meter-bar {
		background: linear-gradient(to bottom, #BCE193 5%, #BCE193, #99C663 35%, #77AA33 40%);
	}

	meter::-webkit-meter-optimum-value {
		background: linear-gradient(to bottom, #BCE193 5%, #BCE193, #99C663 35%, #77AA33 40%);
	}

	.meter1 {vertical-align: middle; height:10px; width: 60%; max-width: 120px;}
	.meter2 {vertical-align: top; height:16px;}

	.heading .select1 {width:45%; overflow:hidden; text-overflow:ellipsis;}
	.heading .select1 option {width:450px; text-overflow:ellipsis; font-size:14px;}
	.heading .select1 option[selected], .heading .select1 option:checked {font-size:inherit;}

	.isEditable {position:relative; transition:all 0.15s;}
	.isEditable input {background:transparent; border:none; color:white;}
	.isEditable .label {position:absolute; top:0; bottom:0; left:0; right:0; cursor:text; text-align:left; text-indent:-5000px; overflow:hidden; transition:all 0.15s;}
	.isEditable .label:hover, .isEditable input:hover {background:rgba(0,0,0,0.4); outline:1px dashed #9996CF;}
	.isEditable [contenteditable="true"]:hover:before {content:""; position:absolute; top:-7px; right:-12px; bottom:-9px; left:-12px; z-index:-1; background:rgba(0,0,0,0.4); box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) inset; outline:1px dashed rgba(255,255,255,0.3);}
	.isEditable input:focus + .label, .isEditable [contenteditable="true"]:focus:before, .isEditable input:focus {background:rgba(0,0,0,0.4); outline:1px solid #9996CF;}
	.isEditable.formError .label, .isEditable.formError [contenteditable="true"]:before {outline:1px dashed red;}
	.isEditable .link {display:inline-block; min-width:100px; width:auto;}
	.isEditable .link p {margin:0;}

	.thumbPreview i {display: table; background-size:cover; background-position:50% 50%; background-repeat:no-repeat;}
	.isEditable.imgTitle .label {cursor:pointer;}
	.isEditable.imgTitle.noImage .label {text-indent:0; color:#AAA; display:flex; justify-content:center; text-align: center; align-items:center; padding:8px; outline:1px dashed silver;}
	.isEditable.imgTitle.noImage img {display:none;}
/* FIN Formulaires */


/* ------------------------------ */
/* &  4 -  STRUCTURE    	      */
/* ------------------------------ */

	.page, .topStuffInside, .menuAbout, .footerInside {position: relative; width: 81.379em; max-width: 100%; margin: 0 auto;}
	.page {display:flex; flex-wrap: wrap; margin-bottom: 34px; background-color: var(--color1); border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.7);}
	.headerSite {position: relative; flex-basis:100%; background:#50508F url(images/top.jpg) no-repeat center; background-size: cover;}
	.banner {display: inline-block; min-width: 180px; margin: calc(12px + 1.2%) 5.4% 33px; width: calc(176px + 10%);}
	.navigation {flex:0 0 calc(13% + 6px); min-width: 133px; background-color: rgba(0, 0, 0, 0.36); box-shadow: 1px 0 1px 0 rgba(0, 0, 0, 0.8); border-bottom-left-radius: 3px;}
	.main {position:relative; flex:1; margin:3.5em 1.7% 60px;}
	.main + aside[role=complementary] {flex:0 1 19.5%; min-width:16rem; margin:3.66em 12px 76px 0;}
	.menuAbout {margin-top:30px; margin-bottom: 30px;}
	.footerSite {background:#2A2A2A; font:normal 100% Georgia, serif; color:silver;}

/****
* Barre en haut
****/
	.topStuff {position: relative; background:#2A2A2A; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.7); z-index:2;}
	.topStuffInside {display:flex; box-sizing: border-box; align-items:center; padding:0 5px;}

	.evitement {position:absolute;}
	.evitement ul {list-style:none;}
	.evitement a {position:absolute; top:8px; left:-99999px; white-space:nowrap; text-align:center; background:black; background:rgba(0,0,0,0.8); padding:30px 45px; font-size:2em; font-weight:normal; color:var(--color2);}
	.evitement a:focus, .evitement a:active {left:8px; z-index:9999;}

	.social a {margin-right: 1.2rem; padding: 0.3rem; color: rgba(255, 255, 255, 0.4);}
	.social a:hover {color: rgba(255, 255, 255, 0.8);}

	.notifications, .mp {padding:0.33em;}
	.notifications.empty {opacity:0.4; transition:opacity 0.15s;}
	.notifications:hover, .notifications:focus {opacity:1;}


/****
* Menus
****/
	.topmenu {position:absolute; z-index:1; left:0; right:0;}
	.topmenuInside {display:flex; list-style:none; padding: 0 0 0 12px; margin:-1.4em 2.8% 0; align-items:center; background:rgba(0,0,0,0.47); border-radius:14px;}
	.topmenuListItem {padding:2px 5px; white-space: nowrap;}
	.topmenuSearch {margin-left:auto; flex-basis: 23em;}
	.topmenu a {display: block; padding:0.15em 18px; color: white; font-family: "Lucida Handwriting", Georgia, serif; font-size: 125%; text-decoration: none;}

	.breadcrumbs {margin: -0.85em 0 2em;}

	/* menu about */
	.menuAboutInside {position: relative; margin:0 5px; padding:0 4px; font: normal 140% Georgia, serif; border-radius: 6px; background-color: rgba(255, 255, 255, 0.15); text-align:right;}
	.menuAbout li {display:inline-block; vertical-align: middle; margin:0 1.3%;}
	.menuAbout ul a {padding: 0.6em 0.5em;}
	.btnTop-icon {width:1rem; height:1rem; transition:transform ease 0.15s;}
	.btnTop:hover .btnTop-icon, .btnTop:focus .btnTop-icon {transform: translateY(-0.2rem);}
	.btnTwitter {position:absolute; z-index: 1; bottom:-35px; left:23px; width:165px; height:102px; background: url(images/iconGrosTwitter.png) 0 0 no-repeat;}

	/* menu gauche */
	.leftmenu {padding:15px 0 50px; margin: 0;}
	.leftmenu dt {display:flex; align-items: flex-end; margin:47px 0 1px 0; border-bottom:1px solid #D0CEFF; height:2.6em; background: linear-gradient(to bottom, #7a7ab4 0%, #50508f 48%, #414174 51%, #50508f 100%); font: normal 94%/130% "Lucida Handwriting", Georgia, serif;}
	.leftmenu dt svg {height:auto; position: relative; left: 2px; bottom: 2px; filter: drop-shadow( 1px 1px 1px rgba(0, 0, 0, .5));}
	.leftmenu a {display:flex; align-items: center; padding:3px 0 3px 7px; border-bottom:1px solid var(--color1); hyphens:auto; font-weight: 600; text-decoration: none;}
	.leftmenu a:before, .menuMobile .item:before {content: ""; width:0.621em; height:0.621em; box-shadow: 0 0 0 1px #68668E; border-radius: 0.15em; margin-right:8px;}
	.leftmenu .link-active:before {background: currentColor; box-shadow: inset -1px -1px 2px 2px rgba(0, 0, 0, 0.2);}

	.burger {display:flex; align-items:center; background:none; border:0; padding:6px; line-height:1; cursor:pointer; color:silver;}
	.navigationMobile {display:none; position:absolute; left:0; width:70vw; max-width:240px; background:rgba(42,42,42,0.95);}
	.navigationMobile a {padding: 1.2rem 9px;}
/* FIN MENUS */

/* FOOTER */
	.derniers {display:flex; flex-wrap: wrap; padding:0 10px 9%; gap:0 46px; background:url(images/bas.jpg) no-repeat center bottom; background-size: contain;}
	.blocDerniers {flex:1 0 22rem; margin: 1.6em 0 1.5em;}
	.derniersHeading [class*="icon"] {width:auto; height:1.1em;}
	.derniersHeading {font-size:150%; margin:0 0 0.6em 0; padding:0 0 0.55em 0; border-bottom:1px solid #444444;}
	.derniers ul {list-style:none; margin:0 0 1em; padding: 0;}
	.derniers li {margin-bottom:0.4em;}

	.footerLegal {display:flex; justify-content:flex-end; padding:14px 10px; border-top:1px dashed #D0CEFF; line-height:1.6em;}
	.footerLegal p {margin:0;}
	.footerLegal .legalIcones {flex:0 0 auto; margin-top:5px; margin-left:16px;}
/* FIN footer */

/* Admin */
	.footerAdmin, .footerAdmin1 {margin-top:30px; margin-bottom: 0.5em; padding-top:20px; border-top:1px dashed silver;}
	.footerAdmin [type="submit"] {margin:0 calc(15% - 35px);}
	.footerAdmin1 {text-align: center;}
	ul.espace li {margin-bottom: 1em;}
	ul.espace ul li {margin-bottom:0;}
/* FIN Admin*/


/* ------------------------------ */
/* &  5 -  REUSABLE ELEMENTS      */
/* ------------------------------ */
	.container {display:flex;}
	.container1 {flex-wrap:wrap;}
	.container2 {flex-wrap:wrap; justify-content: space-between; align-items:baseline;}
	.container3 {flex-wrap:wrap; justify-content:center;}
	.containerItem {margin-top:1em; margin-bottom: 1rem;}
	.containerItem1 {margin-left:2%; margin-right:2%;}
	.containerItem2 {margin-left:auto;}

	.block {position:relative; margin-bottom:2em; border-bottom: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.18);}
	table ~ .block {margin-top: 2em;}
	.block .head {display: flex; align-items: center; border-bottom:1px solid var(--color1); background-color: rgba(0, 0, 0, 0.21); text-align:center;}
	.block .head .heading {flex-grow: 1; margin:0; padding: 0.31em 14px; text-align:center;}
	.block .body {position: relative; padding:8px 14px;}
	.block .body1 {padding-top:19px; padding-bottom:19px; text-align:center;}
	.block .body2 {padding: 8px 19px;}
	.block .foot {padding: 1em 14px 1.3em; text-align:center;}
	.block .foot .btn {margin:0 7px;}

	.icon {display:inline-flex; align-items:center; vertical-align:middle;}
	.icon > .label {margin-left: 1.4ch; line-height: 1;}

	.icon-inverted > .label {order: -1; margin-left: inherit; margin-right: 1.4ch;}

	.icon1 > .label {margin-left: 1ch;}
	.icon1-inverted > .label {margin-right: 1ch;}

	.noList {margin:0; padding:0; list-style:none;}
	.list1 {list-style: none; margin-left:0;}

	.article {display:flex; flex-wrap:wrap; position: relative; align-items: flex-start; border-bottom: 1px solid rgba(0, 0, 0, 0.3); background-color: rgba(0, 0, 0, 0.23);}
	.article + .article {margin-top: 1.4em;}
	.article :nth-child(2) {flex:1 1 0;}
	.articleFigure {position: relative; flex:0 0 auto; margin:17px 0 17px 17px;}
	.articleFigure1 {width: 21.8%; padding-top:14.3%;}
	.articleFigure2 {width:29%; padding-top: 19%;}
	.articleFigure3 {width:12.3%; padding-top: 9%;}
	.articleFigureImg {position: absolute; top: 0; width: 100%; height: 100%; object-fit: cover;}
	.articleHeading {margin:0.355em 0 0; padding:0.345em 17px 0.345em; font-size:140%;}
	.articleInfos {margin: 0 17px 0.36em;}
	.articleBody {min-height:95px; margin: 7px 17px 0.3em; word-break: break-word;}
	.articleContent1 {margin-top:1em;}
	.articleFooter {text-align:right; padding:0 16px 14px 16px;}
	.article .menuOptions, .test .menuOptions {position:absolute; right: 7px; top: 7px; font-size: 90%;}

	.sectionHeader {display:flex; flex-wrap:wrap; align-items: center; margin: 2.46em 0 2em;}
	.sectionHeader .heading {flex-grow: 1; margin-top: 0; margin-bottom: 0.5em;}
	.sectionHeader > * {margin-bottom: 8px;}
	.sectionHeader .searchForm {flex-basis: 260px;}
	.sectionHeader > .btn {margin-left: 8px;}
	.sectionHeader-1 {margin-top: 0.2em; margin-bottom: 0.7em;}

	@supports (gap: 8px) {
		.sectionHeader {gap: 8px;}
		.sectionHeader > .btn {margin-left: 0;}
	}

	.listGrid {display:flex; flex-wrap:wrap; list-style:none; padding: 0; margin:-6px -6px 3em -6px;}
	.listGridItem {display:flex; flex:1 1 34rem;}
	.listGridContent {flex-grow:1; display:flex; align-items: flex-start; position:relative; margin:7px; padding:1.8rem 2rem 2rem; border-bottom: 1px solid rgba(0, 0, 0, 0.32); background: rgba(0,0,0,0.25); transition:background 0.3s; color:white;}
	.listGridContent:hover, .listGridContent:focus {background:rgba(0,0,0,0.55); color:white; text-decoration: none;}
	.listGridContent.link-active {border-color: currentColor;}
	.listGridContent > [class*="icon"] {max-width: 11%; width: 2.76em; height: auto; margin: 0.2em 1.5em 0.2em 0; color:#D4E8C6;}
	.listGridContent-1 > [class*="icon"] {width: 3rem; max-width: 9%; max-height: 2.7rem; margin: 0 1.5em 0 0; align-self: center;}
	.listGrid .heading {display:block; margin: 0 0 0.5em;}
	.listGrid .description {color:rgba(255,255,255,0.75);}
	.listGrid .counter {position:absolute; top:-2px; right:9px; padding:7px 9px; background-color:#6F9E4B; color:white; box-shadow:1px 1px 1px rgba(0, 0, 0, 0.4); text-shadow:1px 1px #2F481C; font-weight:normal; animation:shake 6s 2s infinite;}

	.notif {position:absolute; top:0.55em; right: -4px; padding:0 5px; background-color:#6F9E4B; color:white; font-weight:600; line-height:150%; font-size: 90%; box-shadow:0 0 1px black; text-shadow:1px 1px #4D762E;}

	.description {margin: 1.2em 0;}
	.description dt {font-weight:600; color:#FFF1C6;}
	.description dt:after {content:" : ";}

	.description1 {margin:0;}
	.description1 dt, .description1 dd {display:inline-block;}


	/* Menu dépliable */
	.menu {display:none; position:absolute; top:100%; list-style:none; margin:0; padding:0;}
	.menu .item {transition:all 0.15s; cursor: pointer; text-decoration: none;}

	.menu1 {background:#2A2A2A; border:1px solid #252525; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6);}
	.menu1 .menuitem + .menuitem {border-top:1px solid rgba(255,255,255,0.15);}
	.menu1 .item {display:flex; padding:1.3rem; text-decoration: none; color:silver;}
	.menu1 .item:hover, .menu1 .item:focus {background-color:#393939; color:white;}

	.menu2 {right:0; background:#EEF2FD; color:#2B3242; list-style:none; margin:0.2rem 0 0; box-shadow:0 1px 2px 1px rgba(0, 0, 0, 0.6);}
	.menu2 .menuitem + .menuitem {border-top:1px dashed #BAB8D8;}
	.menu2 .item {display:block; color:#2B3242; padding:6px 10px; margin:2px; white-space:nowrap; border:1px solid #EEF2FD; font-weight: 600;}
	.menu2 .item:hover, .menu2 .item:focus {background:var(--color1); color:white; border-color:#1C1B30; text-decoration: none;}

	/* TABLEAUX */
	.cellType1 {text-align:center;}
	.cellType2 {padding:10px 12px 0 14px;}
	.cellType3 {border:1px solid #2D2C49;}
	.cellType4 {padding:3px; background-color:#383660; border:1px solid #1C1B30;}
	.cellType4 h1, .cellHeading {margin:0;}

	.caption {background:#35335B linear-gradient(#4C4983 5%, #313055 65%, #35335B 100%); padding:1px 8px 1px 13px; text-align:left;}
	.captionHeading {margin:3px 0 4px;}

	.tri {display:block;}
	.triColumn {padding: 2px; text-align:center; background:#47457B; font-size:0.8em;}

	/* Boutons */
	.btn {display:inline-flex; justify-content: center; vertical-align: middle; line-height: 1; background:#508423; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.4); border: 1px solid rgba(255,255,255, 0.2); color: white; padding: 0.966em 1.33em 1em; align-items: center; cursor:pointer; transition:background-color 200ms, border-color 200ms, box-shadow 200ms;}
	.btn:hover, .btn:focus {color:white; background:#548a25; border-color: #95dd56; text-decoration: none;}

	.btn01, .btn03 {background:#5F60A3;}
	.btn01:hover, .btn01:focus, .btn03:hover, .btn03:focus {background:#6566AA; border-color:#A4A6FF;}
	.btn01[disabled], .btn03[disabled], .btn01[aria-disabled], .btn03[aria-disabled] {opacity:0.7; background:#5F60A3; box-shadow:none; border:1px solid #414274;}

	.btn02, .btn03 {padding: 0.54em 3.8rem 0.673em; font-size: 134%;}

	.btn06 {justify-content:space-between; padding:1.2em 1.14em; border: none; background:#eeefff; color:#2B3242;}
	.btn06:hover, .btn06:focus, .btn06.isOpen {background:white; color:#2B3242;}

	.btnOptions {padding: 0.8em 0.6em 0.8em 0.87em;}
	.btnOptions-small {padding: 0.63em 0.55em 0.63em 0.82em}
	.btnIconPF {display:inline-block; background:white; color:#444444; text-align:center; padding:0 6px 0.1em; margin-right:9px; min-width:40px; font-size: 90%; vertical-align:middle; border-bottom-left-radius:5px; border-top-right-radius:5px; box-shadow:1px 2px 1px rgba(0, 0, 0, 0.6);}

	/* Avatars */
	.avatar2 {width:2rem; height:2rem; margin-left:0.3rem; margin-right:0.5rem;}


/* -------------------------------- */
/* & 6 -  ELEMENTS SPÉCIFIQUES      */
/* -------------------------------- */

	.derniersComs .body {text-align:left; font-size:90%; line-height:140%; padding:0;}
	.derniersComs p {margin:0;}
	.derniersComs a {font-weight:normal; display:block; padding:8px 11px; border-bottom:1px solid var(--color1); text-decoration: none;}
	.derniersComs a:hover .identiteCom, .derniersComs a:focus .identiteCom {display: inline-block; text-decoration-color: currentColor;}
	.derniersComs .categorie {display:block; font-style:normal; color:#8C8FB3;}

	.menuMobile {width:20rem; max-width:90vw; left:0;}

	.menuOptions {position:relative; text-align: left;}

	.menuLogin {display:flex; margin-left:auto;}
	.menuLogin .menu {width:21rem; max-width:90vw; right: 0;}
	.menuLogin .menuitem + .menuitem {border:none;}
	.menuLoginItem {margin-left: 17px; position:relative;}
	.menuLoginBtn {display:flex; align-items:center; height: 3.6em; border:none; background:none; color:white; cursor:pointer; line-height:120%; padding:0 16px 0 12px; transition:background-color 0.15s;}
	.menuLoginBtn:hover, .menuLogin [data-dropdown="button"].isOpen {background-color:#393939; color:white; text-decoration: none;}
	.menuLoginBtn .iconDropdown {position:relative; top:0.33em; left:4px; color: #949494;}
	.menuLogin .avatar {width: 1.866em; height: 1.866em; margin-right:10px; border:2px solid #ddd; border-radius:3px;}
	.menuLogin .profil {align-items:center;}
	.menuLogin .item [class*="icon"] {width: 1.448em; height: 1.448em;}

	/* Login */
	.loginForm {display: flex; flex-direction: column;}
	.loginForm > .heading {margin-top: 0;}
	.loginForm-creaCompte {border-top: 1px solid rgba(255,255,255,0.15); padding-top: 1.4em; margin-top: 0.5em;}

	/* INFOS */
	.info {position:relative; background-color:#63639C; padding:1.2em 26px; margin:2em 14px;}
	.info .pictoInfo {position:absolute; right:-20px; top:-17px;}
	.info .heading {margin-top:0;}
	.info p:last-child {margin-bottom: 0;}

	/* Pagination */
	.multipage {display: flex; align-items:center; justify-content:flex-end; font-size:1.154em; margin: 0 -0.25em;}
	.multipageItem {padding: 0.5em; margin: 0 0.25em; transition: stroke 200ms, border-color 200ms;}
	.multipageForm {display: flex; align-items:center; margin:0 1rem;}
	.multipageInput {width:4em; height:2.2em; margin-right: 0.5ch;}
	.multipageIcon {display:block; width:2.2rem; height:2.337rem; fill:none; stroke: var(--color2);}
	.multipageItemForward .multipageIcon-line, .multipageItemBackward .multipageIcon-line {display:none;}
	.multipageItemBackward, .multipageItemFullbackward {transform: rotate(180deg);}
	.multipageItem:hover .multipageIcon, .multipageItem:focus .multipageIcon {stroke:#D6D6FF; border-color:#D6D6FF;}
	.multipageItem[aria-disabled] .multipageIcon {stroke:#383660; border-color:#383660;}

	/* Galerie */
	.galerie {overflow:hidden;}
	.galerieItem {float:left; margin:3px;}

	/* Recherche Rapide */
	.search {position:relative;}
	.inputSearch[type="search"] {padding:0.6rem 38px 0.7rem 10px; margin:0.2rem 0; font-size:94%; border-color:transparent; border-width: 0; background:#eeefff; border-radius:0.6rem 1rem 1rem 0.6rem; box-shadow:1px 1px 3px rgba(0, 0, 0, 0.6); box-sizing:border-box; transition:width 0.3s ease;}
	.inputSearch:hover, .inputSearch:focus {background:white;}
	.inputSearch:focus {border-width:1px 0; margin:0.1rem 0;}
	.search [type="submit"] {padding: 0 0.56em 0 0.7em; position:absolute; top:5px; bottom:5px; right:3px; border:none; background-color:transparent; box-shadow: -7px 0 0 -6px #B7B6C3; color: #2E2C4F;}
	.search [type="submit"]:focus {box-shadow: 0 0 0 2px #2E2C4F; outline: none; border-radius: 8px;}

	/* Zone de recherche AVANCEE */
	.advancedSearch {margin-bottom: 1em; padding: 0; background: none; border: none;}
	.advancedSearch:not([open]) {display:inline-block;}
	.advancedSearch .filtres {margin: 1em 0 2em;}

	/* Commentaires */
	.commentaires, .repondre {margin:1.8em 2% 0;}
	.commentaires article {margin-bottom:3em; overflow:hidden;}
	.commentaires .avatar, .repondre .avatar {float:left; width:calc(2.6% + 32px); padding:3px; border:1px solid #4D4882; background:#625FA7; border-radius:4px;}
	.commentaires a.avatar:hover, .commentaires a.avatar:focus, .commentaires .monPost {border:2px solid var(--color3); padding:1px; margin:1px;}
	.commentaires .avatar img {width:100%; display:block; border-radius:3px;}
	.commentaires header, .commentairesContenu, .commentaires footer, .commentaire {margin-left: calc(2.8% + 64px);}
	.commentaires header, .commentaires footer {color:silver; font-size:94%;}
	.commentaires header {margin-bottom:2px;}
	.commentaires footer {text-align:right;}
	.commentaires .commentairesAuteur {font-size:110%; font-weight: 600;}
	.commentairesActions {display: inline-flex; align-items: baseline;}
	.commentairesRepondre {margin: 0 6px 0 18px;}
	.commentairesActions .iconLike {height: 0.95em;}
	.commentairesContenu {background:#625FA7; border:1px solid #454174; border-radius:5px; padding:12px 20px 13px; position:relative; word-break: break-word; hyphens: auto;}
	.commentairesContenu svg {position:absolute; top:13px; left:-21px;}
	.commentairesContenu > p:last-child {margin-bottom: 0;}
	.commentaires .monPost {background:#5E63A6;}

	.text {word-break: break-word;}
	.text a {text-decoration-color: currentColor;}
	.commentaire {margin-right:calc(9% - 2rem); border-radius:4px;}
	.repondre .footer {margin-top:2em; text-align:center;}

	.fiche .menuOptions {margin-right: 5px;}
	.fiche .imgTitle {margin-bottom:0.5em;}
	.fiche .imgTitle img {border:1px solid black;}
	.fiche .imgTitle.noImage {width:160px; height:160px; margin-bottom:8px;}

	.ficheHeading:first-of-type {margin-top: 0.2em;}
	.ficheHeading {margin-bottom: 0.7em;}
	.ficheFigure {flex: 0 0 167px; margin-right:20px;}
	.ficheContent {flex: 1 1 60%;}
	.ficheGalerie {margin-top: 1.5em;}

	.alertIE {display:none;}

	/* Divers */
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		.alertIE {display:block; margin:0 auto; background:white; color:black; font-size:1.1em; padding:1.8em 10%; border-top:6px solid red;}
		.alertIE strong {color:black;}
		.alertIE a {color:blue;}
		.alertIE a:hover, .alertIE a:focus {color:green;}
	}

	/* Filtres */
	.filtres {margin:2em 0 3.4em;}
	.filtresBody {background:rgba(0,0,0,0.18); border-bottom:1px solid rgba(0, 0, 0, 0.25); padding:0 14px 20px;}
	.filtresFooter {flex-basis: 100%; text-align:center; margin:0.9em 0 0;}
	.filtresItem {position:relative; flex:1 1 26rem;}
	.filtresBtn {width:100%;}
	.filtresMenu {left:0;}
	/* FIN Filtres */

	/* Sondage */
	.sondage {font-size:90%; line-height:1.2; list-style:none; margin:2.3rem 0; padding: 0; text-align: left;}
	.sondageItem ~ .sondageItem {margin-top:0.9em;}
	.sondageLabel, .sondageMeter {flex:1 1 0;}
	.sondageLabel {text-align: right;}
	.sondageMeter {margin-left:8px;}
	.sondage .radio {margin-right:5px; vertical-align: middle;}
	.sondageVotes {display:block; margin:2rem 0;}
	/* FIN sondage */

	.herocreatorPresentation {margin-left:4%; margin-right:4%;}
	.listusersItem {flex-basis: calc(15% + 4rem);}

	/* TESTS */
	.introduction {margin: 1.4em 20px; font-weight:600; font-size: 1.5rem;}
	.introduction>p:first-letter {font:normal 30px Georgia, serif; color:#D0CEFF; line-height:1em;}

	.articleScreenshots {width:75%; margin:3em auto; text-align:center;}
	.articleScreenshots .containerItem {flex: 1 1 45%; margin-left: 10px; margin-right: 10px;}
	.articleCaption {margin-top:0.5em; color: silver; font-style: italic;}
	.articleScreenshot {border:1px solid #1C1B30;}
	.articleScreenshots .noImage {display: inline-block; width:200px; height:160px;}
	.articleParagraph {max-width: 71ch; margin:3em auto; padding: 2em calc(2em + 9px) 1em; border:1px dashed #1C1B30; background-color:var(--color1);}
	.articleParagraph p {font-size: 110%;}
	.articleAddPart {margin:3em calc(11% - 24px); padding:37px calc(3% + 9px); border:1px dashed #1C1B30; text-align:center;}
	.articleResume {width:95%;}
	.articleResumeHeading {margin:0.2rem 0;}
	.articleResume h4 {font-family: inherit; margin:0 0 0.4em;}
	.articleResume p {margin:0;}
	.articleResume td {padding: 1em;}
	.ratingPart	{font:230% Georgia, serif; text-align:center; color:#FFF1C6;}
	.articleSignature {width:95%; text-align:right; margin:21px auto 8px;}
	/* FIN TESTS */


	/* ICONES */
	.iconHome {width: 1.2em; height: 1.1em; position: relative; bottom: 0.15em;}
	.iconSearch {width: 1.31em; height: 1.241em;}
	.iconAncretop {width:1.5em; height:1.5em; border: 0.07em solid currentColor; background: #414073; border-radius: 100%; box-shadow: inset 1px 1px 2px rgba(255,255,255,0.5), inset -1px -1px 2px rgba(0,0,0,0.5);}

	.iconMail {width: auto; height: 1.241em;}
	.iconNotifications {width: 1.333em; height: 1.555em;}

	.iconComment {width: 1.103em; height: 1.034em; color:#7BBD41; position: relative; top: 1px;}
	.iconLike {width: 1.7rem; height: 1.5rem; stroke: currentColor; stroke-width: 1.5; position: relative; top: 1px;}
	.is-inactive > .iconLike {fill: transparent;}

	.iconVoirtout {width: 1.034em; height: 1.034em; border-radius: 0.2em; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.3);}

	.iconTri {width:0.8rem; height:0.4rem; shape-rendering:crispedges; fill:#99CCFF; border-top:1px solid #99CCFF;}
	.triDESC .iconTri {transform: rotate(180deg);}
	.iconOptions {width:2.28em; height:1.5em;}

	.iconProgression {position: relative; top: -.1em; width:1.5em; height:1.5em; border-radius:100%; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.3); fill: transparent;}
	.iconCommentairesRepondre {width:0.8rem; height:0.9rem;}

	.iconDrapeau {width: 1.655em; height: 1.241em; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.3);}
	.iconTelecharger {width: auto; height: 1.3em;}
	.iconTelechargerArrow {fill: #BCFF80; transition: transform 150ms}
	.btnDownload:not([disabled]):hover .iconTelechargerArrow, .btnDownload:not([disabled]):focus .iconTelechargerArrow {transform: translateY(3px);}

	.iconTwitter {width: 1.6em; height: 1.3em;}
	.iconFacebook {width: 0.666em; height: 1.666em;}


	.iconArticles {width: 2.935em; margin-right: 7px;}
	.iconEmulation {width: 2.495em; margin-right: 9px;}
	.iconBonus {width: 3.2em; margin-right: 4px;}

	.iconCheck {position: relative; top: -.2em; width: 0.966em; height: auto; color: #6A67A9;}
	.statusOK .iconCheck-tic {stroke: #7BBD41; stroke-width: 2; stroke-linecap: round;}

	.iconInfini {width: 1.25em; height: auto;}
	.iconNew {width: 0.823em; height: auto; position: relative; top: 1px;}
	.iconFerme {width: 0.896em; height: 1.172em; color:#F2CF50; position: relative; bottom: 3px; margin-right: 0.5em;}
	.iconSondage {width: 1.172em; height: 1.172em; color:#F2CF50; position: relative; bottom: 3px; margin-right: 0.5em;}
	.iconForumNotif {display:inline-block; width: 0.4833em; height: 0.4833em; margin: 1px 0.55em; border-radius: 100%; background:#7bbd41; box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.4);}
	.iconLastMessage {width: 0.966em; margin-left: 0.69em; height: 0.644em;}
	.iconEdit {width:1.6rem; height:1.6rem;}
	.iconDelete {width:1.34rem; height:1.6rem;}
	.iconDropdown {width:0.8rem; height:0.5rem;}

	.iconBurger {margin-right:10px; stroke:white; stroke-width:3px; stroke-linecap: round;}
	.iconError {max-width: 18em; width: 50%; height: auto; color: rgba(0, 0, 0, 0.6); display: block; margin: 5em auto;}
/* FIN ICONS */


/* FORUM */
	.forum {border-spacing: 0;}
	.forum + .forum {margin-top:2.1em;}
	.forum th[scope="col"] {padding-left: 15px; padding-right: 15px; font-size:1.1em; text-align:left; border-style:solid; border-color:#6666AA; border-bottom-color: #1C1B30; border-width:1px 0;}
	.forum td, .forum th[scope="row"] {padding:17px 15px; background-color:#47457B; border-style:solid; border-color:#6666AA; border-width:0 0 1px 0;}
	.forum th[scope="row"], .forum th[scope="col"]:first-child {border-left-width:1px;}
	.forum td:last-child, .forum th[scope="col"]:last-child {border-right-width:1px; text-align: right; vertical-align: middle;}
	.forum tr:nth-child(2) td, .forum tr:nth-child(2) th[scope="row"] {border-top-width: 1px;}
	.forum .sticky, .forum th.sticky {background-color:#3D3C6A;}
	.forumTopic {font-size: 110%;}
	.forum .pseudo {vertical-align: middle; margin-left:4px;}

	.forumPagination {display: flex; flex-wrap: wrap; margin:0.8em -4px;}
	.forumPagination .btn {margin: 4px;}

	.post {position:relative; padding: 12px; border-width:1px; border-style:solid;}
	.post ~ .post {margin-top: 1.2em;}
	.post .heading {margin-top: 1em;}
	.postType1 {border-color:#1C1B30; background-color:#3C3C6A;}
	.postType2 {border-color:#2D2C49; background-color:#45447B}
	.post .avatar {float:left; margin:3px 8px 3px 3px;}
	.post .user {flex: 0 0 225px;}
	.userInfos {overflow:hidden; min-height:62px; margin-left:4px; margin-bottom:10px;}
	.userInfos .classe {font-size:90%; line-height:1.4em;}
	.userInfos .alignement {display:block; color:#C0C0C0;}
	.postContent {flex: 1 1 70%; padding-right:5px; padding-left:6px;}
	.postContent .text {margin-top:0.12em; margin-bottom:1em; margin-right: calc(22% - 40px); min-height:3.5em;}
	.postContent .postInfos {position:absolute; right: 18px; top: 8px;}
	.postInfos {text-align:right; font-size:90%; color:#C0C0C0;}
	.postDate {display:block;}
	.postOptions {text-align:right;}
	.postOptionsItem.btn {font-size:90%;}
	.postOptionsItem.icon {padding:1.2rem;}
	.postOptionsItem:last-child {margin-left:8px;}

	.edited {font-size:0.846em; color:#C0C0C0; margin-top:1em;}
	.signature {padding-top:6px; border-top:1px solid #8B8BA8; color:#c0c0c0; margin-top:0.8em; word-break: break-word;}
/* fin FORUM */

/* PLAN DU SITE */
	.plan_site .groupe_rub {font-weight:600;padding-top:10px;list-style-type:square;}
	.plan_site span {font-size:0.917em;color:#CCCCCC;display:block;text-indent:10px;}
/* FIN PLAN DU SITE */

/* ------------------------------ */
/* &  7 -  ANIMATIONS		      */
/* ------------------------------ */

@keyframes shake {
	0% { transform: rotate(0deg); }
	1.2% { transform: rotate(10deg); }
	2.4% { transform: rotate(-10deg); }
	3.6% { transform: rotate(6deg); }
	4.8% { transform: rotate(-6deg); }
	6% { transform: rotate(3deg); }
	6.2% { transform: rotate(0deg); }
}


/* ColorBox Core Style */
.dialog {background: rgba(0, 0, 0, 0.5); border-radius: 1.2rem; padding: 1.4rem; margin: -1.4rem;}
.dialog:focus {outline: none;}

.dialog-1 #cboxContent {background:white; color:#333;}
.dialog-1 #cboxLoadedContent { margin-bottom:28px;}
.dialog-1 #cboxLoadingGraphic{background:url(images/colorbox/loading.gif) center center no-repeat;}

.dialog-2 #cboxContent {background:#2A2A2A;}
.dialog-2 #cboxLoadedContent { padding:22px;}
.dialog-2 #cboxClose {visibility: hidden;}

#colorbox, #cboxOverlay {position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxWrapper {overflow: hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%; background:url(images/colorbox/overlay.png) 0 0 repeat;}
#cboxContent{position:relative; border-radius: 0.6rem;}
#cboxLoadedContent{overflow:auto; padding:16px; -webkit-overflow-scrolling: touch;}
#cboxTitle{position:absolute; bottom:4px; width:100%; left:0; margin:0;  text-align:center; color:#949494;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{border:0; padding:0; margin:0; background-color:transparent; overflow:visible; width:auto; cursor:pointer;}
#cboxCurrent{position:absolute; bottom:10px; left:72px; color:#949494;}
#cboxPrevious{position:absolute; bottom:9px; left:14px; background:url(images/colorbox/controls.png) -75px 0 no-repeat; width:25px; height:25px; text-indent:-9999px; transition: none;}
#cboxPrevious:hover{background-position:-75px -25px;}
#cboxNext{position:absolute; bottom:9px; left:41px; background:url(images/colorbox/controls.png) -50px 0 no-repeat; width:25px; height:25px; text-indent:-9999px; transition: none;}
#cboxNext:hover{background-position:-50px -25px;}
#cboxClose{position:absolute; background:url(images/colorbox/controls.png) -25px 0 no-repeat; width:25px; height:25px; bottom:9px; right:14px; transition: none;}
#cboxClose:hover{background-position:-25px -25px;}

/* Froala */
.fr-emoticon{display:inline-block;font-size:17px;line-height:1;cursor:default;font-weight:400; font-family:"Apple Color Emoji", "Segoe UI Emoji", "NotoColorEmoji", "Segoe UI Symbol", "Android Emoji", "EmojiSymbols", sans-serif;}
.fr-view a {text-decoration-color: currentColor;}
.fr-video {display:block; position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0;}
.fr-video iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%;}


/* ------------------------------ */
/* &  7 -  MEDIA QUERIES	      */
/* ------------------------------ */

@media screen and (max-width: 899px) {
	.onlyDesktop {display:none;}
	.topStuff {position: sticky; top: 0;}
	.main + aside[role="complementary"] {width: inherit; flex-basis:100%; margin:0 12px 3em;}
	.topmenuSearch {flex-grow: 1;}

	@supports (display: grid) {
		.articles {display:grid; grid-template-columns:repeat(auto-fill, minmax(22rem, 1fr)); grid-gap:18px; margin-bottom: 1em;}
		.articles .article {margin:0;}
  	}

	.article {flex-direction: column;}
	.articleFigure1, .articleFigure2 {height: 160px; width:100%; margin:0; padding: 0; border:0; outline:0;}
	.articleHeader1 {border: 0; background: none;}
}

@media screen and (min-width: 900px) {
	.onlyMobile {display:none;}
}


/* ------------------------------ */
/* &  8 -  ETATS / ANIMATIONS     */
/* ------------------------------ */
[data-dropdown="menu"].isOpen {display:block; z-index:9;}