/* thème bleu */
/* Toutes les balises */
*
{
   font-family: "times new   roman"; 
}
/* Balises indiquées */
body
{
 font-size: 16px;
}
a
{
   color: #a65c00;
}
a:hover
{
   text-decoration: none;
   font-weight: bold;
   color: #754316;
} 
a:visited
{
   text-decoration: none; 
   font-style: italic;
}
h1
{
    font-size:24px;
}
h2
{
    font-size: 20px;
}
h3
{
    font-size: 18px;
}
h4
{
   font-size: 16px;
   text-align: center;
}
mark
{
   background-color: #ffc173;
}
ul, ol
{
   /*padding-top: 10px;*/
   padding-bottom: 10px;
   padding-left: 50px;
}
ul li
{
   padding-top: 10px;
   list-style-type: circle; 
   margin-left: 10px;
   margin-right: 10px;
}
table
{
   /* bordures collées */
   border-collapse: collapse; 
   font-size:18px;
   margin: 0 auto;
}
td, th
{
   border: 1px solid black;
   padding-left: 8px;   
   padding-top: 3px;
   padding-bottom: 3px;
   white-space: pre-wrap;
}
th
{
   background-color: #fff0e1;
}
header
{   
   top: 0px;
   padding-left: 6px; 
   background-position: center;
   padding-top: 1px;
   width: 950px;
   height: 98px;
   margin: 0px auto;
   box-shadow: 0px 0px 4px #1c1a19;
   border-radius:  20px ; 
}
footer
{
   position: absolute;
   bottom: 6px; 
   width: 940px;  
   height: 22px; 
   text-align: center;
   left: 6px;  
}
/*---------------------------------------*/
/*                    classes               */
/*---------------------------------------*/
.bord0
{
   border-width: 0px;
}
.bordblanc
{
   border-color: white;
}
.bordbleu
{
   border-color: #65a6d1;
}
.bordcreme
{
   border-color: #ffc173;
}
.bordmarron
{
   border-color: #a65c00;
}
.image1
{
   vertical-align: middle;
   padding-right: 6px;
}
.sbox
{
   position: absolute;
   width: 990px;
   top: 0px;
   background-color: #fffffa;
   box-shadow: 0px 2px 10px #1c1a19; 
   border-radius:  20px; 
   padding: 6px; 
}
.banniere2
{
    background-image:url(Serge1.jpg);
}
.box
{
   display: inline-block;
   box-shadow: 0px 0px 4px #1c1a19;
   border-radius:  10px ; 
   padding: 10px;
   margin-left: 1px;
   margin-right: 1px;
}
.boxi
{
   display: inline-block;   
   padding: 10px;
   margin-left: 3px;
   margin-right: 3px;
   border-radius:  10px ;
}
.centerbox
{
   margin: auto;
   padding: 10px; 
   background-color: white;
   box-shadow: 0px 0px 4px #1c1a19;
   border-radius:  10px ; 
}
.centerboxi
{
   margin: auto;
   padding: 10px; 
}
.cadre
{
   border-style: solid;
   border-width: 1px; 
   padding: 0px 10px 0px 10px; 
}
.picasso
{
   border-color: #a65c00; 
   border-width: 8px; 
   border-style: ridge; 
   padding: 10px;
}
.gauche
{
   text-align: left;
}
.centrer
{
   text-align: center;
}
.droite
{
   text-align: right;
}
.justif
{
   text-align: justify;
}
.gradientbleu
{
 /* navigateurs anciens fond par défaut*/
background-color: #0b6ba6;
/* Navigateurs récents */
  background-image: -webkit-gradient( linear,left top, left bottom, from(#a9d9ff), to(#0467a3) );
  background-image: -webkit-linear-gradient(top, #a9d9ff,#0467a3 );
  background-image: -moz-linear-gradient(top,#a9d9ff, #0467a3 );
  box-shadow: 0px 2px 5px #1c1a19;
  border-radius: 10px;
  padding: 0px 10px 0px 10px; 
}
.bandeaubleu
{
   background-color: #65a6d1;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
   padding: 0px 10px 0px 10px; 
}
.fondbleu
{
   background-color: #65a6d1;
}
.bandeaurouge
{
   background-color: #f1565e;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
   padding: 0px 10px 0px 10px; 
}
.fondrouge
{
   background-color: #f1565e;
}
.fondcreme
{
   background-color: #ffc173;
}
.bandeaucreme
{
   background-color: #ffc173;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
   padding: 0px 10px 0px 10px; 
}
.fondorange
{
   background-color: #ff8e00;
}
.fondsaumon
{
   background-color: #fff0e1;
}
.fondsable
{
   background-color: #ffffec;
}
.fondnoir
{
   background-color: black;
}
.gradientmarron
{
 /* navigateurs anciens fond par défaut*/
background-color: #ffc173;
/* Navigateurs récents */
  background-image: -webkit-gradient( linear,left top, left bottom, from(#ffc173), to(#a65c00) );
  background-image: -webkit-linear-gradient(top, #ffc173,#a65c00 );
  background-image: -moz-linear-gradient(top,#ffc173, #a65c00 );
  box-shadow: 0px 2px 5px #1c1a19;
  border-radius: 10px;
  padding: 0px 10px 0px 10px; 
}
.bandeaumarron
{
   background-color: #a65c00;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
   padding: 0px 10px 0px 10px; 
}
.fondmarron
{
  background-color: #a65c00;
}
.gradientvert
{
 /* navigateurs anciens fond par défaut*/
background-color: #60d6a9;
/* Navigateurs récents */
  background-image: -webkit-gradient( linear,left top, left bottom, from(#60d6a9), to(#20815d) );
  background-image: -webkit-linear-gradient(top, #60d6a9,#20815d );
  background-image: -moz-linear-gradient(top,#60d6a9, #20815d );
  box-shadow: 0px 2px 5px #1c1a19;
  border-radius: 10px;
  padding: 0px 10px 0px 10px; 
}
.bandeauvert
{
   background-color: #60d6a9;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
   padding: 0px 10px 0px 10px; 
}
.fondvert
{
   background-color: #60d6a9;
}
.fondvertpale
{
   background-color: #ccffcc;
}
.fondvert2
{
    background-color: #77ffbb;
}
.fondvert3
{
    background-color: #77ffbb;
}
.fondjaune
{
   background-color: #ffffd2;
}
.fondviolet
{
   background-color: #ceceff;
}
.gradientgris
{
 /* navigateurs anciens fond par défaut*/
background-color: #f5f5f5;
/* Navigateurs récents */
  background-image: -webkit-gradient( linear,left top, left bottom, from(#f5f5f5), to(#545454) );
  background-image: -webkit-linear-gradient(top, #f5f5f5,#545454 );
  background-image: -moz-linear-gradient(top,#f5f5f5, #545454); 
  box-shadow: 0px 2px 5px #1c1a19;
  border-radius: 10px;
  padding: 0px 10px 0px 10px; 
}
.bandeaugris
{
   background-color: #dbdbdb;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
  padding: 0px 10px 0px 10px; 
}
.fondgris
{
   background-color: #dbdbdb;
}
.bandeaublanc
{
   background-color: white;
   box-shadow: 0px 2px 5px #1c1a19;
   border-radius: 10px;
   padding: 0px 10px 0px 10px; 
}
.fondblanc
{
   background-color: white;
}
/*======= attributs blocs ===*/
.h20
{
  height: 20px;
}
.h24
{
  height: 24px;
}
.h28
{
  height: 28px;
}
.h30
{
  height: 30px;
}
.h40
{
  height: 40px;
}
.h50
{
  height: 50px;
}
.h900
{
  height: 900px;
}
.w50
{
   width: 50px;
}
.w80
{
   width: 80px;
}
.w100
{
   width: 100px;
}
.w120
{
   width: 100px;
}
.w130
{
   width: 130px;
}
.w150
{
   width: 150px;
}
.w200
{
   width: 200px;
}
.w250
{
   width: 250px;
}
.w300
{
   width: 300px;
}
.w350
{
   width: 350px;
}
.w400
{
   width: 400px;
}
.w430
{
   width: 430px;
}
.w450
{
   width: 450px;
}
.w500
{
   width: 500px;
}
.w550
{
   width: 550px;
}
.w600
{
   width: 600px;
}
.w650
{
   width: 600px;
}
.w700
{
   width: 700px;
}
.w750
{
   width: 750px;
}
.w800
{
   width: 800px;
}
.w830
{
   width: 830px;
}
.w850
{
   width: 850px;
}
.w900
{
   width: 900px;
}
.w950
{
   width: 950px;
}
/*---------------------------------*/
.pad10
{   
   padding: 10px; 
}
.mtop5
{
   margin-top: 5px;
}
.mtop10
{
   margin-top: 10px;
}
.mtop20
{
   margin-top: 20px;
}
.mtop30
{
   margin-top: 30px;
}
.mtop50
{
   margin-top: 50px;
}
.mtop100
{
   margin-top: 100px;
}
.mtop200
{
   margin-top: 200px;
}
.mtop230
{
   margin-top: 230px;
}
.mtop250
{
   margin-top: 250px;
}
.mtop300
{
   margin-top: 300px;
}
.mtop350
{
   margin-top: 350px;
}
.mtop370
{
   margin-top: 370px;
}
.mtop400
{
   margin-top: 400px;
}
.mright10
{
   margin-right: 10px;
}
.mright20
{
   margin-right: 20px;
}
.mleft10
{
   margin-left: 10px;
}
.mleft20
{
   margin-left: 20px;
}
.mleft30
{
   margin-left: 30px;
}
.mleft40
{
   margin-left: 40px;
}
.mleft50
{
   margin-left: 50px;
}
.mleft60
{
   margin-left: 60px;
}
.mleft80
{
   margin-left: 80px;
}
.mleft90
{
   margin-left: 90px;
}
.mleft100
{
   margin-left: 100px;
}
.mleft100
{
   margin-left: 100px;
}
.mleft200
{
   margin-left: 200px;
}
.mleft250
{
   margin-left: 250px;
}
.mleft300
{
   margin-left: 300px;
}
.mleft350
{
   margin-left: 350px;
}
.mleft400
{
   margin-left: 400px;
}
.mleft500
{
   margin-left: 500px;
}
.mbot5
{
   margin-bottom: 5px;
}
.mbot10
{
   margin-bottom: 10px;
}
.mbot20
{
   margin-bottom: 20px;
}
.mbot50
{
   margin-bottom: 50px;
}
.mbot100
{
   margin-bottom: 100px;
}
.padl10
{   
   padding-left: 10px; 
}
.padl20
{   
   padding-left: 20px; 
}
.padl30
{   
   padding-left: 30px; 
}
.padl35
{   
   padding-left: 35px; 
}
.padl40
{   
   padding-left: 40px; 
}
.padl50
{   
   padding-left: 60px; 
}
.padl60
{   
   padding-left: 60px; 
}
.padl100
{   
   padding-left: 100px; 
}
.padtop5
{   
   padding-top: 5px; 
}
.padtop20
{   
   padding-top: 20px; 
}
.padtop30
{   
   padding-top: 30px; 
}
.padtop40
{   
   padding-top: 40px; 
}
.interligmin
{   
   margin-top: -15px; 
}
.interligmin2
{   
   margin-top: -10px; 
}
/*--------------------------------*/
.aligtop
{
   vertical-align: top;
}
.aligbot
{
   vertical-align: bottom;
}
.aligmid
{
   vertical-align: middle;
}
/*==================*/
/*      couleur du texte      */
/*==================*/
.bleu1
{
   color: #0a67a3;
}
.bleu2
{
   color: #24587a;
}
.bleu3
{
   color: #03426a;
}
.bleu4
{
   color: #3e97d1;
}
.bleu5
{
   color: #65a6d1;
}
.bleu0
{
   color: #00008a;
}
.vert1
{
   color: #00ac6b;
}
.vert2
{
   color: #20815d;
}
.vert3
{
   color: #007046;
}
.vert4
{
   color: #35d699;
}
.vert5
{
   color: #60d6a9;
}
.marron1
{
   color: #ff8e00;
}
.marron2
{
   color: #bf8030;
}
.marron3
{
   color: #a65c00;
}
.marron4
{
   color: #ffaa40;
}
.marron5
{
   color: #ffc173;
}
.blanc
{
   color: white;
}
.gris
{
   color: #dbdbdb;
}
.gris2
{
   color: #5f5f5f;
}
.rouge
{
   color: red;
}
/*==================*/
/*      attributs du texte     */
/*==================*/
.gras
{
   font-weight: bold;
}
.italique
{
   font-style: italic;
}
.normal
{
   font-style: normal;
}
.souligne
{
   text-decoration : underline;
}
.barre
{
   text-decoration: line-through;
}
.size12
{
   font-size:12px;
}
.size14
{
   font-size:14px;
}
.size16
{
   font-size:16px;
}
.size18
{
   font-size:18px;
}
.size20
{
   font-size: 20px;
}
.size22
{
   font-size: 22px;
}
.size24
{
   font-size: 24px;
}
.size30
{
   font-size: 30px;
}
.size50
{
   font-size: 50px;
}
/*------- classes de marquage -----*/
.desinence
{
  font-weight: bold;
  color: #c16100;
}
.bleu
{
  font-weight: bold;
  color: #1197E8;
}
/*==================*/
/*             boutons             */
/*==================*/
.bouton
{
   background-color: transparent;
   box-shadow: 0px 2px 5px #1c1a19;   
   border-radius: 8px;
   padding: 3px;   
}
.bouton:hover
{
   background-color: #a65c00;
}
.bouton a
{
   color: black;
}
bouton a:hover
{
   text-decoration: none;
   font-weight: bold;
}
.bouton2
{
   background-color: #ffc173;
   box-shadow: 0px 2px 5px #1c1a19;   
   border-radius: 8px;
   padding: 3px; 
}
.bouton2:hover
{
   background-color: #a65c00;
}
.bouton2 a
{
   color: black; 
}
bouton2 a:hover
{
   text-decoration: none;
   font-weight: bold;
}
.bouton3
{
   background-color: #dbdbdb;
   box-shadow: 0px 2px 5px #1c1a19;   
   border-radius: 8px;
   padding: 3px; 
}
.bouton4
{
   background-color: #ffc173;
   box-shadow: 0px 2px 3px #1c1a19;   
   border-radius: 3px;
}
.bouton4:hover
{
   background-color: #a65c00;
}
.bouton4 a
{
   color: black; 
}
.bouton5
{
   background-color: 	#87cefa;
   box-shadow: 0px 2px 3px #1c1a19;   
   border-radius: 3px;
}
.bouton5:hover
{
   background-color: #1e90ff;
}
.bouton5 a
{
   color: black; 
}
/*------ clavier --------*/
.clav_maj
{
   width: 85px;
   color: #C16100;
   font-size: 20px;
   margin-right: -5px;
}
.clav
{
   width: 40px;
   color: black;
   font-size: 20px;
   margin-right: -5px;
}
.champ
{
   font-size: 18px;
   /*border: none;*/
   font-weight: bold;
   color: darkblue;
   /*background-color: #d2d2d2;*/
}
.speak
{
   width: 20px;
   height: 22px;
   vertical-align: middle;
   padding-left: 5px;
   padding-right: 10px;
}
.nopuce
{
 list-style-type: none;   
}
.main
{
  cursor: pointer;
}
.aide
{
  cursor: help;
}

/*-------- temp ---------*/
.Etiquette_1
      {
      	font-size: 14px;
      	font-weight: bold;
      	font-family: verdana;
      	background-color : #EAEAAE;
      	border: #bcc2fc double 5px;
      }
      .Etiquette_2
      {
      	font-size: 14px;
      	font-weight: bold;
      	font-family: verdana;
      	background-color : #d8f6ff;
      	visibility: hidden;
      	border: #bcc2fc double 5px;
      }
      .Bouton_1
      {
      	font-size: 14px;
      	font-family: verdana;
      	background-color : #93DB70;
      }
      .Bouton_2
      {
      	font-size: 14px;
      	font-family: verdana;
      	background-color : #93DB70;
      	visibility: hidden;
      }
.fixe_
{
    position : fixed; 
 }
.fixe 
{
      /* Pour positionner le clavier toujours visible en haut de la page */ 
      /* Valable pour les navigateurs récents sauf IE */
      background-color: white;
      position : fixed; 
      top: 0px; 
      left: 10px; 
      padding-left: 10px;
      z-index: 1;
      width: 950px;
      /* valable pour IE */ 
      position : expression("absolute"); 
      top : expression(document.body.scrollTop + this.offsetHeight - this.offsetHeight); 
      left : expression("0px"); 
}	
.fixe2
{
      /* Pour positionner une boîte toujours visible en haut de la page */ 
      position : fixed; 
      top: 130px; 
      left: 670px;
      width: 200px;
      padding: 7px 5px 2px 5px;
      z-index: 1;
      /* valable pour IE */ 
      position : expression("absolute"); 
      top : expression(document.body.scrollTop + this.offsetHeight - this.offsetHeight); 
      left : expression("0px"); 
}
.left10
{
    left: 10px;
}
.top150
{
    top: 150px;
}
.info
{
   visibility:hidden; 
   position:absolute; 
   left:0px; 
   top:0px;
}
/*---- pour cursif ---*/
.garsfille
{
   display:inline-block;  
   vertical-align: bottom;
   background-color: #ffc173; 
   width: 89px;
   height: 69px;
   border-radius: 5px;
   margin-left: 50px;
   margin-right: 50px;
   padding: 10px;
   text-align: center;  
}
.garsfille:hover
{
   text-align: right;
   background-color: #f8e2bf; 
}
.majmin
{
   background-color: #ffc173;
   width: 120px;
   font-size: 20px;
   border-radius: 5px;
}
.majmin:hover
{
   background-color: #a65c00;
}
.alpha
{
   background-color: #ffc173;
   width: 48px;
   font-size: 26px;
   border-radius: 5px;
   margin-bottom:8px;
}
.alpha:hover
{
   background-color: #a65c00;
   text-align: right;
}
/* infobulle */
/*-------------*/
[data-tip] 
{ /* on sélectionne l'attribut data-tip */
    position: relative;
    cursor: default;
    border-bottom: 2px solid #dbdbdb;
}
[data-tip]:hover:after 
{
    content: attr(data-tip); /* on récupère la valeur de l'attribut data-tip */
    position: absolute;
    top: -40px; left: -20px;
    white-space: nowrap; /* no wrapping */
    padding: 5px 10px;
    box-shadow: 0px 2px 4px #1c1a19;
    background: white;
    color: black;
    font-weight: normal;
    border-radius: 5px;
}