@viewport {
   width: device-width; /* largeur du viewport */
   zoom: 1; /* zoom initial à 1.0 (et clin d'oeil aux fans d'IE6/7) */
}

:root{
background: #00002B;

	html{
 		font-family:sans-serif;line-height:1.15;
 		font-size:100%;
		-webkit-text-size-adjust:100%;
		-webkit-tap-highlight-color:transparent;
	}
	article,aside,figcaption,figure,header,hgroup,main,nav,section{
		background-color:#FFFFF;
	}
}

	h1{
		font-size:3.5em;
	}
	h1,
	h2{
		font-family: "Comic Sans MS"; 
		padding:0 0 0 0;
	 	margin:0 0 0 0;
	}
	h2{
		font-size: 2.4em;
	} 	
	h3{
		font-family:"MV Boli";
		font-size:1.4em;
		padding:0 0 0 0;
	 	margin:0 0 0 0;
	}
	h4{
		font-size:1em;
	}
}

/*------- fin root ----------->

/*
@supports ( (display:flex) or (display: -moz-flex) or (display: -webkit-flex) or
            (display: -ms-flexbox) or (display: -o-flex) ) {
     /* CSS ciblé s'appliquant aux boites flexibles */
/* -webkit-    Chrome 21 */
/* -moz-  		Firefox */
 /* -o- 		Opera */
/* -ms- 		IE */

@supports ( display: flex ) {  body{ display: flex; }
}
@supports not ( display: flex ) {  body {display:block; }
}
@supports ( display: flex ) {  #header, #menu, #navigation, #contenue #footer { display: inline-flex; }
}
@supports not ( display: flex ) {  #header, #menu, #navigation, #contenue #footer { display: inline-block; }
}

/* Page */
body {
	margin: auto;
	background-color: white;
/*	border-top-style: solid;*/
	border-right-style: solid;
	border-left-style: solid;
	border-top-width: 5px;
	border-right-width: 16px;
	border-left-width: 16px;
	border-top-color: #00002B;
	border-right-color: #FFFFFF;
	border-left-color: #FFFFFF;
	max-width: 1340px;
}
/* Page */
#bodymodule {
	margin: 0px auto auto 15px;
	background-color: white; /*	border-top-style: solid;*/;
	border-right-style: solid;
	border-left-style: solid; /*	border-top-width: 5px;*/;
	border-right-width: 1px;
	border-left-width: 1px; /*	border-top-color: #00002B;*/;
	border-right-color: #FFFFFF;
	border-left-color: #FFFFFF;
	padding-left: 2px;
}

.bord{
	border: 16px solid #fffff;
	color:#FFFFF;
}

/* Styles pour l'entête */
#header {
	text-align: center;
	background-color: #FFFFFF;
	margin:auto;
	display:flex;
	flex-direction:column;
}
/* Styles pour l'entête formation uniquement */
#headermod {
	text-align: center;
	background-color: #FFFFFF;
	/*margin:auto;*/
	display:flex;
	flex-direction:column;
 position:relative;
 padding-top:110px;
z-index:2;

}
#entetemod{
	width:100%;
	max-height: 14vh;
	overflow:visible;
position:fixed;
z-index:100;
/*width:86%;*/
top:0;left:0; right:0;

}

/* Page en-tête */
#entete{
	width:100%;
	max-height: 18vh;
	overflow:visible;
}

/* Barre de Progression */


/* Sous Titre */
#position {
/*Suppr le 21/01/2022
	border: 16px solid #FFFFFF;   */
	background-color: white;
	background-image: url('../images/Image2.png');
	background-repeat: no-repeat;
	background-size:cover;
	background-position: center;
	text-align: center;
}
#position h2{
 	font-weight: bold;
}

.admin-bar #mobile-menu{
    top: 119px;
  }

/* Styles pour les icones de navigation*/
.icone{
	max-width: 1em;
	margin-right: 3px; 
	margin-left: .2em;
	margin-bottom:5px;
	padding:5px;
	line-height: 1em; 
	text-transform: none; 
	font-family:IcoMoon-Free;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	/*font:normal normal normal;*/
	border: thin solid #A873A8;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: #040524;
	background-color: #FFFFFF;
}
/* Styles pour la barre de navigation */
details{
	display: flex;	
	cursor: pointer;
	text-align:left; 
 margin:10px auto auto 10px;
}
details nav{
	display:none;
}
details:hover nav{
	display:block;
	background-color: #FFFFFF; z-index:100; position:absolute;
}
/* Styles pour les éléments de navigation */
details nav a {
	display:block;
	box-sizing:content-box;
	border: thin solid #A873A8;
	text-decoration: none;
	background-color:white;
/*	margin-top:2px; margin-left:2px; padding-left:2px; padding-right:2px;*/
}
details nav a:hover {
	color:black;
	text-decoration: none;
	background-color: #CCCCCC;
	border: 1px solid #cc9;
}

#naventete{
	display:inline-block; 
	text-align:right;
	vertical-align:bottom;
}
/* adresse en infobulle*/
.tooltip
{
  text-decoration:none;
  position:relative;
}
.tooltip span{
  display:none;
}
.tooltip:hover span{
  display:block;
  position:absolute;
  top:30px;
  left:-165px;
  z-index:1000;
}
#adresse{
	text-align:center;
	font-size:2vh;
 	border:1px solid black;
 	border-radius:6px;
  	color:black;
  	background:white;  	
  	box-sizing:content-box;
}


/* Styles pour le contenue */
#contenue {
    background:#fffff;
    display:flex;
 	/*justify-content: space-between;*/
 	align-content:space-between;
  	flex-flow:row wrap;
}

/* Styles caractère*/

/* a remplacer par <strong></strong>
.style_bold {font-weight: bold;}*/

.style_italic {
	font-style: italic;
}
.style_centre {
	text-align:center;
}
.style_droite {
	text-align:right;
}
.style_gauche {
	text-align:left;
}

/* Style Police */
.boli{
	font-family:"MV Boli";
}
.comic{
	font-family:"Comic Sans MS";
}

/* Style Boite */
.boite {
	color: #000000;
	box-shadow: 
        1px 1px   0 rgba(0,   0,   0,   0.100), 
        2px 2px   0 rgba(255, 255, 255, 1.0), 
        3px 3px   0 rgba(0,   0,   0,   0.125),
      	4px 4px   0 rgba(255, 255, 255, 1.0);
	background-color:azure;
	padding-left:5px;padding-right:5px;
}
.boite2 {
	background-color:azure;
}
.boiteenvoie {
	background-color:#00002B;
	color:white;
	width:5vw;
	height:5vh;
}
.boitemodule {
	background-color:azure;
	margin:0px;
	padding:0px;
	text-align:center;
}

/* Style 0 Padding */
.padnul {
	padding:0;
}
/* Style 0 Marging */
.margenul {
	margin:0 ;
}

/* Style Couleur Texte */
.mauve{
 	color:purple;
}
.bleu{
	color:#00002B;
}
.noir{
	color:black;
}
.blanc{
	color:white;
}
.blancfond{
	background-color:white;
}
/* Style Alignement Gauche */
.gauche{
	float:left;
}
.gaucheal{
 align:left;
}
.droitefl{
	float:right;
}
/* Style Alignement vertical */
.vertical{
	vertical-align:bottom;
}
.verticalmilieu{
	vertical-align:middle;
}

.opac{
	opacity:1;
}
/* --------- PIED DE PAGE ----------- */

#footer {
  display: flex;
  flex-flow:row nowrap;
 /* padding: 5px;*/
 margin-top:5px;
 justify-content: space-between;
  background-color:white;
  max-height:10vh;
}
/* Pied de page incorporé*/
#piedg {
	display:flex;
	width:100%;
/*	flex:0 0 30%;*/
}
#piedd {
	display:flex;
	width:100%;
/*	flex-grow:2;*/
/*	flex:0 0 70%;*/
}

#piednav{
	/*margin:auto;*/
	cursor:pointer;
/*	min-height:inherit;*/
/*	z-index:99;	*/
/*	display:flex;
	flex:0 0 70%;*/
	
}

/* ----------PAGE D'ACCUEIL ----------- */
/* -- Section Slogan --*/
#slogan{
 	display : flex;
 	/*flex-direction: row;*/
 	flex-wrap:wrap;
 	flex: 1 1 100%;
}

/*#slogan >article {
	margin:auto;
	display:flex;
    }*/

 /*#slogan article:nth-child(1) {
   order: 0;
    align-self: auto;
    margin:5 10 5 10;
   flex: 0 0 auto;
    }*/
/* #slogan article:nth-child(2) {
   	order: 0;
    align-self: auto;
    margin:auto;
    flex: 0 0 auto;
    }*/
/* #slogan article:nth-child(3) {
   order: 0;
    align-self: auto;
    flex: 0 0 auto;
	margin:auto;
    }*/
/* #slogan article:nth-child(4) {
	flex-grow: 2;
    align-self: flex-end;
	margin:auto;
    flex: 0 0 auto;
    }*/

#sloganarticle{
	vertical-align:middle;
	font-family:"MV Boli";
	margin-left:auto;
	margin-right:auto;
}

.lettrine{
	font-family:"MV Boli";
	color:purple;
	font-size:200%;
}

.engagementp{
	border: thin groove #FFFFFF;
	border-radius: 100px 100px 100px 100px;
	background-color: #3d3e58;
	padding: 2px 2px 2px 2px;
	vertical-align: middle;
 	width:70%;
 	margin-left:auto;
 	margin-right:auto;
 	color:white;
}


/* -- Section Pub --*/
#pub{
 	display : flex;
 	flex-direction: column;
  	flex: 0 0 100%;
 	/*flex-wrap: wrap;
	writing-mode: sideways-lr;*/
 	/*justify-content: space-between;*/
  /* align-content: space-between;*/
	align-items: center;
 	/*margin:auto;*/
	text-align:center;
}
#pub img{
	max-width:5%;
	
}
#pub p a{
	text-decoration:none;
	cursor: pointer;
	color:white;
}
#pubslogan{
	background-position: right center;
	background: url('../images/trait.gif') no-repeat bottom;
	text-align: center;
}


/* Section Themes */
#themes{
 	display:flex;
 	/*justify-content: space-between;*/
 	/*flex-direction: row;*/
 	/*  flex-direction: column;*/
 /*	flex-wrap:wrap;*/
}

#thbureautique{
 	display:inline-flex;
 	flex-direction: row;
	flex-wrap:wrap;
	justify-content: space-around;
 	/*align-content: space-between;*/
 	/*flex: 0 0 50%;*/
/* flex:auto;*/
}
#thbureautique figure{
	/*padding:0;*/
}


#thsuite{
 	display:inline-flex;
 	flex-wrap:wrap;
 	justify-content: space-around;
 	flex: 0 0 100%;
}

#nomth{
	/*width:60%;*/
	text-align:left;
}

.nomthimage{
	margin-right:30px;
	margin-left:30px;
}

#themes h4{
	margin-top:4px;
}
#thsuite h4{
	margin-top:4px;
	font-weight:normal;
}

#themes mark{
	background-color: lightgreen;
	font-family:"Comic Sans MS";
}
#thsuite mark{
	background-color: lightgreen;
	font-family:"Comic Sans MS";
}

.img_formation{
	box-shadow: 
        1px 1px   0 rgba(0,   0,   0,   0.100), 
        2px 2px   0 rgba(255, 255, 255, 1.0), 
        3px 3px   0 rgba(0,   0,   0,   0.125),
      	4px 4px   0 rgba(255, 255, 255, 1.0);
	background-color:azure;	
}
.img_formation img{
	/*height:8.5vh;*/
	max-height:8vh;
	margin-right:5px;
	/*vertical-align:sub;*/
}

figcaption{
	text-align:right;
}

#themes span{
	width:30vh;
}

#catalogue{
	/*display:inline-flex;
 	justify-content: center;
 	flex-flow:row nowrap;
 		flex-direction: column;*/
	text-align:center;
  	flex: 0 0 100%;
}

#catalogue article h3{
	vertical-align: middle;
}
#catalogue article button a{
	text-decoration:none;
	cursor: pointer;
	color:white;
	font-size:large;
	font-family:"Times New Roman", Times, serif;
}
#catalogue article button{
	border: thin groove #FFFFFF;
	border-radius: 50px 50px 50px 50px;
	background-color: #3d3e58;
	padding:10px;
}
#certif{
 	display:inline-flex;
 	justify-content: space-around;
 	flex: 0 0 100%;
 	flex-wrap: wrap;
}
#certif article{
 	margin:15px 15px 5px 5px;
}
 /* ajout le 21/01/2022 */
#certif article img{
		max-height:15vh;
}

/* --------- PAGE QUI SUIS-JE ----------- */
#contenuequi {
 	background-color:white;
}

#positionqui {
	background: url('../images/fond3.png') no-repeat center center;
	text-align: center;
}
#positionqui h2{
 /*	font-size: 2rem;*/
 	font-weight: bold;
}

/* Photo */
div{
    width: 50%;
    margin: auto; /*Centre les div dans la page*/
}
.moi{
	background-position: center bottom;
	min-width: 75%;
	min-height: 85%;
	box-sizing: border-box;
	background-image: url('../images/lm.png');
	background-repeat: no-repeat;
}
.ovale{
	width: 140px;
 	height: 180px;	
}
.ovale p{
 	/*line-height: 8vh;*/
}
.bordure{
    border: 2px solid black;
}
.arrondi1{
    border-radius : 50%;
   
}
#qui{
	display:flex;
	font-family:"Comic Sans MS";
}
#qui article{
	/*width: 80%;*/
/*	font-size:large;*/
	margin:auto;
}
#qui article:first-child{
/*	width:46vw;*/
}
#qui article p{
/*	color:purple;
	font-weight:bold;*/
}

#qui aside{
	text-align: center;
	font-family:"Times New Roman", Times, serif;
	border: thin groove #FFFFFF;
	border-radius: 2px 2px 2px 2px;
	background-color: azure;
/*	background: #D6D6D6 url('../images/Fond2.png') no-repeat center top;*/
	/*margin:auto;*/
	padding:5px;
}

#quoi{
	display:flex;
	flex-wrap:wrap;
	justify-content: space-around;
 /*	align-content: space-between;*/
 	font-family:"Comic Sans MS";
}
#quoi article{
	vertical-align:top;
	margin:auto;
}
#quoi article span{
	color:purple;
	font-size:1.5rem;
}

#quoi h4{
	font-family:"MV Boli";
	font-size:1.0rem;
	padding:0 0 0 0;
 	margin:0 0 0 0;
}


/* --------- PAGE LISTE MODULES ----------- */
/* -- 1er entete -- */
#positionmodul {
	background: url('../images/fondform.png') no-repeat center center;
	text-align: center;
	margin-bottom:5px;
	opacity:0.9;
}
#positionmodul h2{
 	font-weight: bold;
}
/* -- Liste des formations -- */
/* NAV */
#menumodule{
	padding:0;
	margin:5px auto 5px auto;
/*	list-style-type:none;*/
 	width:180px;
	cursor:pointer;
}
#menumodule ul{
	padding:0;
	margin:0;
	list-style:none;
 	text-align: center;
}
#menumodule li{
	background-color:#3d3e58; 
 /*  background-image:-webkit-linear-gradient(top, #3d3e58 0%, #333A40 100%);
   background-image: linear-gradient(to bottom, #3d3e58 0%, #333A40 100%);*/
   border-radius: 6px;
   margin-bottom:2px;
   box-shadow: 3px 3px 3px #999;
   border:solid 1px #333A40;
}
#menumodule li li {
   max-height:0;
   overflow: hidden;
   transition: all .5s;
   border-radius:0;
   background:#400040;
   box-shadow: none;
   border:none;
   margin:0;
}
/* les a href */
#menumodule a{
	display:block;
	text-decoration:none;
	padding:2px 2px;
	color:#fff;
}
#menumodule ul li a, #menumodule li:hover li a {
  font-size:1em;
}
#menumodule ul li a:hover{
  color: #00002B;
}

#menumodule li:hover {
   background: #CCCC99;
}
#menumodule li li:hover {
   background: #999;
}
#menumodule ul li:last-child {
   border-radius: 0 0 6px 6px;
   border:none;
}
#menumodule li:hover li {
  max-height: 5em;
}

/* -- Liste des formations -- */
/* 2eme partie */
#sectcontinue{
	display:flex;
   	flex-flow: column wrap;
  /*  margin:15px 0 0 0;*/
    flex: 0 0 20%;
}
#details{
	cursor: pointer;
}
#sectcontinue summary{
	background-color:#3d3e58; 
	border-radius: 6px;
	margin-bottom:2px;
	box-shadow: 3px 3px 3px #999;
	border:solid 1px #333A40;
	color:white;
}
#sectcontinue ul li a{
	text-decoration:none;
	color:#00002B;
}


/* Section Main */
#contenuemainmod {
    display:flex;
   	flex-flow: row wrap;
  /*  justify-content: space-between;*/
    background-color:white;
  /*box-sizing: border-box;*/
 /*   padding: 5px;*/
}


/* Section gauche */
#sectgmod{
    flex: 0 0 20%;
}

#sectgbases{
    flex: 0 0 20%;
}
#sectgbases ul li a{
	text-decoration:none;
	/*color:#00002B;*/
}

/* Section Frame */
#moduleiframe {
	display:flex;
	flex-grow: 3;
 	/*flex: 1 1 80%;*/
	/*box-sizing: border-box;*/
	flex-direction:column;
 	height:1025px;
}
#moduleobjet{
	display:flex;
	width: 100%;
	height: 100%;
	border-top-color:white;
	background-color:white;
}

#incorpo{
	width:100%;
	max-height: 14vh;
	overflow:visible;
}

/* Section Menu Modules formation */
/* ---- */
/* Catalogue formation */
#contenuemod {
    display:flex;
  /*  padding: 5px;*/
    justify-content: space-between;
/* ajout le 21/01/2022 */
    flex-direction: column;
 	background-color:white;
}
#secttextemod{
	flex:0 0 100%;
	/*margin:5px auto;*/
	margin:0 0 5px 0;
}
#secttextemod article aside{
	/*flex:0 0 20%;
	flex-wrap:wrap;
	margin:2px auto;*/
/*	float:right;
	vertical-align:top;*/
}

#formation{
	display:flex;
	/*flex-wrap:wrap;*/
	justify-content: space-around;
 	align-content: space-between;
}

#certifmod{
 	display:inline-flex;
 	justify-content: space-around;
 	flex: 0 0 100%;
 	flex-wrap: wrap;
}
#certifmod article{
 	/*display:inline-flex;
	flex-flow: row nowrap;
	flex:0 0 100%;*/
}
 /* ajout le 24/01/2022 */
#certifmod img{
		max-height:15vh;
}
 
#contenuemod aside{
	text-align: center;
	font-family:"Times New Roman", Times, serif;
	border: thin groove #FFFFFF;
	border-radius: 2px 2px 2px 2px;
	background-color: azure;
	padding:5px;
	max-height:30vh; 
}

/* ---- */
/* Catalogue formation spécif LibreOffice*/
#libofftitre{
	/*display:flex;*/
}
#liboffcontenu{
	display:flex;
	justify-content: space-between;
	flex-flow: row wrap;
}
#liboffcontenudetails{
	flex:0 0 45%;
	margin:auto;
}

/* Section Grille Modules formation */
/* ---- */
/* les formations */
#headergrilmod{
	display:flex;
    justify-content: space-between;
 	flex-flow: row wrap;
}
#contenuegrilmod {
    display:flex;
  /*  padding: 5px;*/
    flex-flow: row wrap;
   	justify-content: space-between;
    background-color:white;
}
/*
*, *:before, *:after{
	box-sizing:border-box;
}*/

.h2_img{
	max-height:7vh;
	margin-right:15px;
}

.aside{
	flex: 0 0 10%;
 	text-align:center;
	font-family:"Times New Roman", Times, serif;
	border: thin groove #FFFFFF;
	border-radius: 2px 2px 2px 2px;
	background-color: azure;
	/*padding:5px;*/
	max-height:17vh; 
}
.aside img{
	max-height:3vh;
}
#param{
	flex:30%;
}

.plan ul li:first-child{
	list-style-type: none;
	color:#00002b;
}
.plan ul li{
	list-style-type:square;
	list-style-position:inside;
}

/*.plan ul:last-child li:last-child{
	visibility:hidden;
}*/
#programme{
	/*flex:1 0 60%;*/
	flex-grow:4;
}

.list{
 padding-top:0;
 margin-top:0;
}



/* --------- PAGE CONTACT ----------- */
#positioncontact {
	background: url('../images/fondebook.png') no-repeat center center;
	opacity:0.9;
	text-align: center;
}

#contenuecontact {
    background:white;
    display:flex;
  /*  flex-flow: row nowrap;*/
    justify-content: space-between;
   /* flex:0 0 100%;*/

}

#formulaire{
	display:flex;
 	flex-wrap:wrap;
 	flex: 2 0 0;

}
#formulaire legend{
	color:black;
	background-color: lightgreen;
	border: thin solid #FFFFFF;
	border-radius: 4px;
}
#formulaire article{
	/*margin:auto;*/
}

#monBoutonEnvoi{
 /*font-size: 0;
 width: 135px;
 height: 60px;
 background-image:url('../images/check.png'); */
}

#plan{
	display:flex;
 	flex-wrap:wrap;
 	/*flex: auto;*/
	margin:auto;
	flex:0 0 20%;
	text-align:center;
}
#plan article{
	margin:auto;
}
#plan iframe{
	width:38vmax; height:300px;
}


/* --------- PAGE CONFIDENTIALITE ----------- */
#positionpdc {
	background: url('../images/confidentialite.png') repeat-y right center;
	text-align: center;
	background-color: #FFFFFF;
	background-attachment: scroll;
}

/* --------- PAGE QUALITE ----------- */
#positiondemqu {
	background: url('../images/qualite.png') repeat-y right center;
	text-align: center;
	background-color: #FFFFFF;
	background-attachment: scroll;
}
#demqu{
 	display:inline-flex;
 	flex-direction: row;
	flex-wrap:wrap;
	justify-content: space-around;
}
#demqu img{
	max-width:100%;
	height:auto;
}

#demquarticle{
	vertical-align:middle;
	margin-left:auto;
	margin-right:auto;
}

/* --------- PAGE CERTIFICATION ----------- */
#positioncertif {
	background: url('../images/qualite.png') repeat-y right center;
	/*	opacity:0.8; */
	text-align: center;
	background-color: #FFFFFF;
	background-attachment: scroll;
}
#certifqual{
 	display:flex;
 	flex-direction: row;
	flex-wrap:wrap;
	justify-content: space-around;
}
#certifqualarticle{
	margin-left:auto;
	margin-right:auto;
}


/* ---------  ----------- */

#headergrilmod2{
	display:flex;
    justify-content: space-around;
 flex-flow: row nowrap;
}
.aside2{
	flex: 0 0 10%;
 	text-align:center;
	font-family:"Times New Roman", Times, serif;
	border: thin groove #FFFFFF;
	border-radius: 2px 2px 2px 2px;
	background-color: azure;
	/*padding:5px;*/
	max-height:16vh; 
}