body{
font-family: 'Arial', 'Verdana','Helvetica', 'Gulim', sans-serif;
color: #000;
font-size: 0.9em;
margin:0px;
padding:0px;
}

/***** style de la page ****/
h1, h2, h3, h4, h5 {
color:#330099;
/*border-bottom: 1px solid #330099;*/
}

h1 {
        font-size: 1.8em;
}
h2 {
    font-size: 1.4em;
}
h3 {
    font-size: 1.3em;
}
h4, h5, h6 {
    font-size: 1em;
}

table, pre, input, textarea {
    font-size: 1em;
}

pre, tt, textarea {
    font-family: 'Lucida Console', 'Lucida Typewriter', 'GulimChe', monospace;
}

a img {
    border-style: none;
}

a {
    color: #330099;
    text-decoration: none;
}

a:link {
    text-decoration: none;
    color: #330099;
}


/***margin padding du contenu*****/


#text{
        padding-top:22px;
	padding-left:5%;
	width: 94%;
	}

#foot
{
    color: #330099;
    padding-left : 5%;
    width : 100%
   }

#contenu{
        padding-top:0;
	padding-left:0;
	width: 100%;
	}

#contenu #text,#contenu #foot {
    padding-left:22%;
    width: 77%
}



/*** pour le positionnement*****/



#menu, #menu ul /* Liste */
{
        position: fixed;
/*        position: absolute; */
        padding : 0; /* pas de marge intérieure */
        margin : 0; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 20px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
	background : #000;
	width : 100%;
}

#menu /* Ensemble du menu */
{
        font-weight : bold; /* on met le texte en gras */
        font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
        font-size : 12px; /* hauteur du texte : 12 pixels */
}

#menu a /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0; /* aucune marge intérieure */
        background : #000; /* couleur de fond */
        color : #fff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 100%; /* largeur */
}

#menu li /* Elements des listes */
{
        float : left;
        /* pour IE qui ne reconnaît pas "transparent" */
	width : 12%;
        border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
}


#menu li ul /* Sous-listes */
{
        position: absolute; /* Position absolue */
        width: 12%; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
}


#menu li ul li /* Éléments de sous-listes */
{
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top : 1px solid #fff; /* on met une bordure blanche en haut de chaque élément d'une sous liste */
	width : 100%;
}


#menu li ul ul
{
        margin    : -22px 0 0 100% ; /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-left     : 1px solid #fff ; /* Petite bordure à gauche pour ne pas coller ... */
	width : 144px;
}




#menu a:hover, #menu a.sfhover, #menu li:hover, #menu li.sfhover /* Lorsque la souris passe sur un des liens */
{
        color: #339900; /* On passe le texte en noir... */
        background: #000000; /* ... et au contraire, le fond en blanc */
}

#menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}

#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
}


hr
{
    border:none;
    border-top:1px #330099 solid;
    height: 1px;
}

table
{
    color: #330099
}

/* where to place the lateral menu */
div#plan {
  position:fixed; width: 20%; left: 0px;
   height: 100%; margin-top: 0px; padding: 0px;
   /* font: 90% "URW Gothic L", AvantGarde, sans-serif; */
/*   font: 90% verdana, arial, helvetica, sans-serif; */
   background: #ddd url(picts/v-gris.png) 0 0 repeat-x fixed;
   border: outset #9999ff  0px;
/* border: solid black 2px; */
/*   overflow: scroll; */
   overflow: auto;
}

div#plan a {
   display: block;
   padding: 1px .5em 1px .5em;
   border: 1px;
   text-decoration: none;
   color: #000000;
}

div#plan a.hd-link {
   font: bold italic large AvantGarde, sans-serif;
   color: #330099;
}


div#plan a:hover {
   text-decoration: none;
   background: #330099  100% 0 repeat-y;
   color: white;
}

div#plan a:hover.hd-link {
   text-decoration: none;
   background: #330099;
   color: white;
}


div#plan h1 {
   font: bold italic small-caps 200% Wizzer, sans-serif;
   color: #330099;
   letter-spacing: 1pt;
   text-align: center;
}

div#plan h2 {
   color: #330099;
   font: bold italic large "Bookman Old Style", "Bookman", "URW Bookman L",
      serif;
   height: 50px; letter-spacing: .5pt; width: 100%;
   text-align: center;
   line-height: 60px; vertical-align: bottom;
   padding: 0px 2em 0px 0px;
   background: no-repeat 1ex 0pt;
   clear: left;
}

div#plan h3 {
   margin: 1pt;
   font: bold italic large AvantGarde, sans-serif;
   padding: 4px;
   text-align:center;
   color: #330099;
}

.code {
	background-color: #eee;
	font-family: monaco, "Bitstream Vera Sans Mono", "Courier New", courier, monospace;
	font-size: 9pt;
	font-style: oblique;
	white-space: pre-wrap;
	padding: 5pt;
	margin: 5pt 0;
	border: 1pt solid #ccc;
}