body
/*fond du site*/
 {
   background-color     :#91BFE2; /* couleurs d'arrière plan du site */
   background-image     :url(BG.png);
   color                :black; /* couleurs des textes s'ils ne sont pas définies */
   font                 :1em "Trebuchet MS",Arial,sans-serif ; /* police d'écriture */
}

/*Taille + Couleur du titre.*/
#Titre {
  color                 :#171717; /* couleur du titre */
  font-size             :10pt; /* taille de la police */
  text-align:           :center;
}

/*couleur + police du paragraphe 1 qui explique le principe du texte en codage césar*/
#Def_Cesar {
  color               :#171717; /* couleur du texte */
  font-size           :13pt; /* taille de la police */
}

/*changement de la police de la ligne introduisant les onglets de codage / décodage */
#ligne {
  font                :1em "Trebuchet MS",Arial,sans-serif ;
  color               :#171717; /* couleur du texte */
  font-size           :8pt; /* taille de la police */
}

/* mise en page des onglets + mise en forme ( graphiquement ) */
/* onglets maintenant horizontaux */
#onglets {
   list-style           :none; /* aucun styles ( soulignement ...) */
   margin               :0;
   text-align           :center; /* alignement des textes au centre des onglets */
}

/* on annonce que chaques hyperliens (li) seront écartés comme ici par 2 pixels */
#onglets li {
  display               :inline; /* mise au centre des onglets */
  margin-right          :0.5em; /* décalages entres chaques onglets */
}

/* modification du "comportement" (li a) des liens */
#onglets li a {
       background-color :#c00; /* couleur*/
       display          :inline-block; /* fixe les valeurs pour tous les onglets (ici, les largeurs) */
       width            :10em; /* taille */
       color            :white; /* couleur texte */
       text-decoration  :none; /* aucune décorations (soulignement du texte ...) */
       text-align       :center; /* alignement du texte au centre du bouton */
       padding          :0.5em 0; /* positionnement */
       border           :1px solid; /* taille des bordures */
     }

/* on déclare ce qui se passe si la souris passe sur le bouton (grâce au a:hover) */
#onglets li a:hover {
 background-color      :#900; /* couleur du fond quand la souris passe */
 text-decoration       :underline; /* le texte obtient un soulignement quand la souris passe */
}