@charset "utf-8"; 
/*__________________________________________________________________________________________________*/
/*
/*
/* FEUILLE DE STYLE FreeRiderCorsica
/*
/*__________________________________________________________________________________________________*/

/* Conteneur général des pages ------------------*/
#container {
	width: 100%;  	
    max-width: 968px;  	  
	margin: 0 auto;   /* les marges automatiques (et dotées d'une largeur positive) centrent la page */
	text-align: left;  /* ce paramétrage annule le paramètre text-align: center de l'élément body. */
	background-color:#fff;
}


#container UL {POSITION: relative; width:auto; margin-top: -3px; z-index:1;}
/*couleur gris foncé dfdfdf*/
/* #container UL#menu LI {DISPLAY: inline; FLOAT: left; width:auto; }  */

#container UL#menu {POSITION: relative; width:968px;  FONT-WEIGHT: bold; background-color:#dfdfdf; z-index:1; flex-wrap: wrap;
}/*couleur gris foncé dfdfdf*/
#container UL#menu LI {DISPLAY: inline; FLOAT: left; width:auto; flex: 1; font-size: calc(2vm + 10px) ;}
#container UL#menu LI A {TEXT-ALIGN: center; LINE-HEIGHT: 25px; WIDTH:auto;  DISPLAY: block; HEIGHT: 25px; TEXT-DECORATION: none; font-size:13px;}
#container UL#menu LI A:hover {TEXT-ALIGN: center;   MARGIN: 0px 0px 0px; /*COLOR: bleu pale BACKGROUND-COLOR: #6891af;border: 1px solid #e8e8e8;*/
	                           font-weight:normal; color:#314d74; font-size:12px;  text-decoration:underline;							   
}
/*
#container UL#menu li a {
	width: 178px;    
}
*/
/* Gestion des onglets utilisés */
#container UL#menu A.realise { background-image:url(../images/open.gif);  background-position:right; font-weight:normal;COLOR: #000; 
                               background-repeat:no-repeat; TEXT-ALIGN: center; LINE-HEIGHT: 25px;  padding-right: 15px; 
							   DISPLAY: block; HEIGHT: 25px; TEXT-DECORATION: none; BACKGROUND-COLOR: #f6f5f3; 
							   font-size:12px;BORDER-RIGHT: #a5a5bd 1px solid;  } 

#container UL#menu A.realise:hover { background-image:url(../images/open.gif);background-position:right; font-weight:normal; COLOR: #000; 
                                     background-repeat:no-repeat; TEXT-ALIGN: center; LINE-HEIGHT: 25px; padding-right: 15px;  
									 DISPLAY: block; HEIGHT: 25px; TEXT-DECORATION: none; BACKGROUND-COLOR: #f6f5f3; 
									 font-size:12px;BORDER-RIGHT: #a5a5bd 1px solid;  } 

/* Gestion des onglets en cours */
#container UL#menu LI A.encours {TEXT-ALIGN: center; LINE-HEIGHT: 25px; BACKGROUND-COLOR: #dfdfdf; DISPLAY: block; HEIGHT: 25px; TEXT-DECORATION: none; font-size:12px; color:#000; BORDER-RIGHT: #a5a5bd 1px solid;font-weight:bold;}
#container UL#menu LI A.encours:hover {TEXT-ALIGN: center;   MARGIN: 0px 0px 0px; 
	                           font-weight:normal; font-size:12px;  text-decoration:none;
							   color:#000; BACKGROUND-COLOR: #f6f5f3;BORDER-RIGHT: #a5a5bd 1px solid; 							   
}
/*************************************************************/
/*               Onglets - gestion des couleurs              */
/*************************************************************/
#container A.ghost  {/* couleur bleu clair BORDER-TOP: #a5a5bd 1px solid; BORDER-RIGHT: #a5a5bd 1px solid */
	TEXT-ALIGN: center; BACKGROUND-COLOR: #2F78D7; MARGIN: -1px 0px 0px; COLOR: #000; 
}


#container A.current {/* couleur bleu foncé - active BORDER-TOP: #a5a5bd 1px solid;*/
	TEXT-ALIGN: center; BACKGROUND-COLOR: #8DC3FD; font-size:12px;  COLOR: #000; font-weight:normal; 
	 BORDER-RIGHT: #a5a5bd 1px solid;
}
#container .on {DISPLAY: block}
#container .off {DISPLAY: none}


#entete { 
	width: 100%; height: 80vh;padding-top:2px; margin:0px; background-image:url(../images/bandeau.jpg); background-size: cover; background-position: center; background-repeat:no-repeat; background-color: transparent; border-bottom-color:#c1c4e1;
}

#enteteAdm { 
	height: 505px;padding-top:2px; margin:0px; background-image:url(../images/bandeauAdm.jpg); background-repeat:no-repeat; background-color: transparent; border-bottom-color:#c1c4e1;
}

nav {
	margin-top: 2em;
    //display: flex;
}

.menutd{
	background-color: #8DC3FD ; //#E6E6E6;
}

#entetePopUp { 
	height: 400px;padding-top:2px; margin:0px; background-image:url(../images/bandeauPopUp.jpg); background-repeat:no-repeat; background-color: transparent; border-bottom-color:#c1c4e1;
}

.padding-top40{
	padding-top:40px;
}

.padding-top30{
	padding-top:30px;
}

.droite {float:right; padding-left: 3em; padding-right: 2em;}
.gauche {float: left; padding-left: 2em; padding-right: 3em;}
.left{ text-align: left; }
.right { text-align:right; }
.center { text-align:center;}
.align-middle { vertical-align: middle; }
.cleaner {clear:both; }
.bold {font-weight: bold;}

.red { color:#910000;}
.texteRed { color:#910000;}
.bleu-actif{ BACKGROUND-COLOR: #8DC3FD; }
.italic{ font-style: italic; }


.tab100 { float:left; width:100%;}
.tab90 { float:left; width:90%;}
.tab80 { float:left; width:80%;}
.tab60 { float:left; width:60%;}
.tab60C { width:60%;}
.tab70C { width:70%;}
.tab50 { width:50%; }
.tab45 { width:45%; }
.tab35 { width:35%; }
.tab30 { width:30%;}
.tab25 { width:25%;}
.tab20 { width:20%;}
.tab10 { width:10%;} 
.tab5 { width:5%;}

.width20{ width:20%; }
.width60{ width:60%; }


.texteFRC{
    //font-size: 1.50rem;
    font-size: 14px;
    color: black;
    width:initial;
}    
.infotd{
	background-color: #FFFFFF;
}    

#bouton { text-align:center; }
	
.bouton
{
       font-weight: bold;
	color:#000; padding:1px;margin-top:10px;
}
.bouton:hover
{
        text-decoration:underline;
}
.boutonR
{
       font-weight: bold;
	color:#FF0000; padding:1px;margin-top:10px;
}

.margin-bt1{ margin-bottom: 1em; }

fieldset {border: 1px solid #cccccc; margin:20px; padding:10px;}
.legende { color:#01447b; margin-left:40px; padding-left:10px; padding-right:10px; margin-bottom:10px; font-weight:bold; }

.tableSansBord { border:hidden;}
.tableSansBord tr td{ border:hidden;}
.tableSansBord td:hover {background-color: #F0F0F0;}/* au passage de la souris une couleur s'affiche */


/*infobulle */
div.infobulle {
  position: relative;
  float: right;
}
div.infobulle span {
  display: none; /* ceci masque l'infobulle */
}
div.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
}
div.infobulle:hover span {
display: inline;
position: absolute;
top: 15px ; // -150px;
left: 2px ; //-250px;
background-color: #FABE1A;
color: #000;
padding: 2px;
border: 1px solid #707070;
  -webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
min-width:140px;
}
/*fin*/


*__________________________________________________________________________________________________*/
/*
/* GENERALITES : balises HTML et structure générale des pages  FRC
/*__________________________________________________________________________________________________*/

/* min-width pour moyennes résolutions */
@media screen and (min-width: 800px) {
	#main {
		width:80%;
		clear:none;
		height: auto;
        min-height: auto;
	}
	
}

@media screen and (max-width: 1024px) {
   #main {
      width: 95%;
	  height: auto;
      min-height: auto; 
   }
}


/*max-width pour faibles résolutions */
@media screen and (max-width: 1280px) {
	
	#main,  {
		/*clear:both;*/
		width:100%;
		height: auto;
        min-height: auto;
	}
	
}

* {	/* Initialisation pour toutes les balises et tous les navigateurs */
    -moz-box-sizing: border-box; /* pour firefox*/
      -webkit-box-sizing: border-box; /* pour chrome*/
       box-sizing: border-box;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	padding:0;
	margin:0;
}	

html {font-size: 100%;
      height: 100%;
	  }
      
main {
    margin-left: auto;
    margin-right: auto; 	 
	overflow:auto;
	width:100%; 
	background-color:#FBFBFB;	
}

body {
    width:100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center; padding:0; margin:0;
	color: #000000; background-color:#dfdfdf;  	
    min-height: auto;
	margin-right:auto;        
	margin-left: auto;
}

img { 
    border:none;
    //width: 80%
   // max-width: 600px;
}
form {  background-color:#F9F9F9; width:96%; margin-left:2%; margin-right:2%;} 

h1 {color: #01447b;
	font-size: 16px;
    //font-size: calc(2.5vm + 30px);
	font-family:Arial, Helvetica, sans-serif; 
	font-weight: gold; text-align:center;
	padding: 5px;}

h2{	
	color: #000000;background-color:#ebe8e7;
	font-size: 13px;
    //font-size: calc(2.5vm + 30px);
	font-family:Arial, Helvetica, sans-serif;
	padding: 5px;
}
h3 { text-align:center;}

H4 {font-size: 12px;
    text-align:left; 
	color: #01447b;}
    
p {
	line-height: 18px;
	text-align:left;
}

input { padding:3px; vertical-align:middle; }

table {
	border:1px solid #898989;/* dashed - en pointille */
	border-collapse:collapse;
	border-spacing: 0;
	width: 100%;
}

td {padding: 6px; line-height: 18px; border:1px solid  #898989;
}

th {
	padding: 3px;
	font-weight: normal; background-color: #f6f5f3  ;
	white-space: nowrap;
	text-align:right; border:1px solid  #898989;
}
tr {border:1px  #cccccc;}
tr:hover {background-color: #dfdfdf;}/* au passage de la souris une couleur s'affiche - couleur jaune */
    
footer {
	position: relative;
	margin: auto;
	bottom: 0;
	clear: both;
	/* avec both le footer est affiché en dessous du MAIN*/
	/*background-color:#9e1869;*/
	/*color:#FFFFFF;*/
	width: 100%;
	text-align: center;
	font-size: 1em;
	height: 4.5em;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

footer div a {
    color: initial ;
	text-decoration: none;
}

footer div a:hover {
	color: #314d74;
	text-decoration: underline;
}


//----------------------------------Fin FRC ------------------------------


/*__________________________________________________________________________________________________*/
/*
/* GENERALITES : balises HTML et structure générale des pages
/*__________________________________________________________________________________________________*/

.flex {
	display: flex;
}

.flex ul {
    flex-wrap: wrap;
}

.flex li {
    flex: 1;
}