/*----------------------------------------------------------------------------
    style.css
    
    regroupe tout ce qui est police, type, taille et couleur
  ----------------------------------------------------------------------------*/    


/* fabrication d'un bouton sans image */
/* ---------------------------------- */

bouton { 
    font-family: Arial,sans-serif; 
    font-size: 1.6em; 
    width: 200px; 
    height: 43px; 
    padding-top: 7px; /*permet le centrage vertical*/ 
    text-align: center; 
    color: #000; 
    
/*  Ici nous appliquons donc un dégradé partant du haut vers le bas, avec un gris #555 en haut et un gris #2C2C2C en bas.
    Je laisse volontairement la valeur background: #444 pour la dégradation gracieuse dans les navigateurs trop ancien */
    background: #444; 
    background: linear-gradient( #555, #2C2C2C);
    border-radius: 8px;
    
/*  L’ombre du texte tout d’abord. Notre ombre sera blanche et décalée de 1px vers le bas, sans aucun flou. 
    Cela a pour incidence la création d’un texte incrusté */
     text-shadow: 0px 1px 0px rgba( 255, 255, 255, 0.2);
     
/*  Après l’ombre sur le texte, ajoutons les ombres sur la boite avec box-shadow. 
    Pour ce bouton, nous avons besoin de 2 ombres :
    La première derrière le bouton avec un flou de 5px, de couleur noire avec une transparence de 50%.
    La deuxième pour créer le haut du bouton est une ombre blanche avec une transparence de 40%. */
     box-shadow: 0 0 5px rgba( 0, 0, 0, 0.5), 
                 0 -1px 0 rgba( 255, 255, 255, 0.4);
}

bouton:hover{ /* nous allons éclaircir le dégradé. */
    color: #222; 
    background: #555; 
    background: linear-gradient( #777, #333); 
}

/* nous allons créer un effet de bouton enfoncé. Pour cela, nous appliquons le même dégradé qu’à l’état initial 
mais nous modifions également les ombres de la boite pour les appliquer à l’intérieur, avec le mot-clé inset */

bouton:active{ 
    color: #000; 
    background: #444; 
    background: linear-gradient( #555, #2C2C2C); 
    box-shadow: 1px 1px 10px black inset, 
                0 1px 0 rgba( 255, 255, 255, 0.4); 
}

.bouton_submit{
  color: #0000CC;
  background-color: #DDDDFF;
  cursor:pointer;
}
 
.bouton_submit:hover{
  color: #0000CC;
  background-color: #FFDDDD;
}
 
.bouton_submit:active{
  color: #FF00FF;
  background-color: #FFDDDD;
}


h1 {
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: 24px;
    font-style: italic;
    font-weight: bold;
    Line-Height: 26px;
    text-decoration: none;
    margin: 0; 
    color: #C00;
}

h2 {
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: 22px;
    font-style: italic;
    font-weight: bold;
    Line-Height: 22px;
    text-decoration: none;
    margin: 0; 
    color: #C00;
}

h3 {
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: 18px;
    font-style: italic;
    font-weight: bold;
    Line-Height: 18px;
    text-decoration: none;
    margin: 0; 
    color: #C00;
}

t3 {
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: 20px;
    font-style: italic;
    font-weight: bold;
    Line-Height: 18px;
    text-decoration: none;
    margin: 0; 
    color: #C00;
}

p {
  font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
  font-style: normal;
  font-size: 16px;
  font-weight: normal;
  text-decoration: none;
  text-align: justify;
  color: #000;
}


p2 {
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    padding: 0 ;
    margin:-9px; 
    color: #000;
}

/* pour eviter le saut de ligne avant par <form method="post" >'; */
form {
	margin:  0; 
	padding: 0;
	}

em {
   color: #800;
}

mono{
	font-family: Lucida Console, Monaco, monospace ;
	font-style: normal;
}

text {
  font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
  font-style: normal;
  font-size: 16px;
  font-weight: normal;
  text-decoration: none;
  text-align: justify;
  color: #000;
}