/*
Feuille de styles pour les pages d'exercice de Little Boxes
10_01 présentation sur 2 colonnes avec float
*/

* { padding: 0; margin: 0; }
html {height:101%;}
body {
  color: white;
/* background-color: #8c8c8c;*/
background-color: black;
  font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: small;
}
#wrapper {
  color: black;
  width: 720px;
  background-color: white;

/*  background-image: url(Images/navi_bg_degrade.jpg);*/
/*  background-image: url(Images/navi_bg_solid.jpg);  
  background-repeat: repeat-y;*/
  background-position: top left;
  margin-top: 150px;
  margin-right: auto; 
  margin-bottom: 10px;
  margin-left: auto;
padding:20px; 
}

#wrapper1 {
  color: black;
  width: 950px;/* 720*/
  background-color: white;

/*  background-image: url(Images/navi_bg_degrade.jpg);*/
/*  background-image: url(Images/navi_bg_solid.jpg);  
  background-repeat: repeat-y;*/
  background-position: top left;
  margin-top: 10px;
  margin-right: auto; 
  margin-bottom: 10px;
  margin-left: auto;
padding:20px; 
}
#wrapper2 {
  color: black;
  width: 950px;/* 720*/
  background-color: white;

/*  background-image: url(Images/navi_bg_degrade.jpg);*/
/*  background-image: url(Images/navi_bg_solid.jpg);  
  background-repeat: repeat-y;*/
  background-position: top left;
  margin-top: 10px;
  margin-right: auto; 
  margin-bottom: 10px;
  margin-left: auto;
padding:10px; 
}

/* BANDEAU */
#bandeau {
  position: relative;
	color: black;
	background-color: #f3c600;
 background-image: url(Images/bandeau_bg_degrade.jpg);
  background-repeat: repeat-y;
  background-position: top left; 
  padding-top: 10px;
  padding-right: 20px; 
  padding-bottom: 10px; 
  padding-bottom: 10px; 
  padding-left: 20px; 

}
   #bandeau img {
      background-color: white; 
      padding: 5px;
      border: 5px solid #d9d9d9;
    }
    #bandeau p {
      font-weight: bold;
      position:absolute; 
      top: 10px ;  
      right: 10px;
      padding: 5px 0 5px 0;
      margin-bottom: 0;
    }
    #bandeau p span {
      color: #d90000; 
    }
   
 

/* ZONE DE NAVIGATION */
#zone_de_navigation{ 
  float: left; 
  width: 120px;/* il y avait 130...*/
  padding-left: 10px; 
  padding-top: 20px; 
/*border:1px solid red;*/
} 
	  #zone_de_navigation ul {
      color: black;
      width: 80px; 
      padding-left: 10px;
      margin-left: 0;
/*border:1px solid blue;*/
	  }
    #zone_de_navigation li {
	    list-style: none; 
      border-left: 1px solid #d90000;       
      border-bottom: 1px solid #d90000;       
      margin: 0;
    }
    /* Ligne de cadre au-dessus de page_accueil */ 
    #zone_de_navigation #navi01 { 
      border-top: 1px solid #d90000;      
    }

    #zone_de_navigation a { 
      display: block;
      text-decoration: none;
      color: black; 
      background-color: white; 
      padding: 4px; 
      border-left: 3px solid white; 
    }
    #zone_de_navigation a:hover ,
    #page_accueil #navi01 a ,
    #la_section #navi02 a ,
    #novembre #navi03 a ,
    #mai #navi04 a,
    #culture #navi05 a,
    #anciens #navi06 a,
    #histoire #navi07 a,
    #souvenir #navi08 a 
    {
      color: black;
      background-color: white;
      border-left: 3px solid #d90000;      
	  }
/*    #zone_de_navigation a:active { background-color: white; }  */

/* ZONE DE TEXTE */
#zone_de_texte_speciale{

 padding:0,0,0,0;
 margin : 0, 0, 0 ,0;
 margin-left: 130px;

background-color:#d9d9d9;
}
#zone_de_texte_reduite {
  
padding-top: 10px ;
	  padding-right: 20px; 
	  padding-bottom: 5px;
	  padding-left: 20px; 
        margin-left: 130px;

}
    
#zone_de_texte { 
	  padding-top: 20px ;
	  padding-right: 20px; 
	  padding-bottom: 20px;
	  padding-left: 20px; 
    margin-left: 130px;

/*border:5px solid blue;*/
}


    .image_gauche {
	    float:left; 
	    padding: 3px; 
	    border: 5px solid #ccc; 
	    margin-right: 10px; 
       margin-bottom: 10px; 
	  }
	  .image_droite {
	    float:right; 
	    padding: 3px; 
	    border: 5px solid #ccc; 
      margin-bottom: 10px;
	    margin-left: 10px; 
	  }

/* PIED DE PAGE */

#pied_de_page {
clear: both;
background-color: white;
padding: 15px;
padding-top: 10px;
border-top: 1px solid #8c8c8c;
margin-top: 0px;
font-size: 10px;
color: black;
text-align: center;
}



h1 { font-size: 150%; }
h2 { 
  font-size: 130%;  
  margin-bottom: 1em; 
}
strong {
  color: #4e9b88;
}
address {
  text-align: center; 
  font-size: 80%;
  font-style: normal;
  letter-spacing: 2px;
  line-height: 1.5em; 
}
a { text-decoration: none; }
a:link { color: #d90000; }
a:visited { color: #c66; }
a:hover, a:focus { text-decoration: underline; }
a:active { color: #fff; background-color: #d90000; }
.skiplink { display: none; }

p, ul { 
  margin-top: 0 ;
  margin-right: 0 ;
  margin-bottom: 1em ; 
  margin-left: 0; }  
ul ul { 
  margin: 0; 
} 
li { 
  margin-top: 0 ; 
  margin-right: 0; 
  margin-bottom: 0; 
  margin-left: 1em; 
} 



#legende {
font-family: arial;
font-weight:"";
font-size:12px;
color: blue;
}

#hautpage {
padding:0px;
font-family: arial;
font-size:12px;
text-align:center;
margin-left: 130px;
/* border: 2px solid red;*/
}

#deuxphotos{
	  padding-top: 0px ;
	  padding-right:0px; 
	  padding-bottom: 5px;
	  padding-left: 0px; 
          margin-left: 130px;

border:5px solid white;

}

.boite_gauche{
            float:left; 
	 /*  padding-right: 3px; 
	  border: 5px solid #ccc;*/
margin-right: 10px; 
          /*  margin-bottom: 10px; */ 
            font-family: arial;
            font-weight:"";
            font-size:10px;
            color: blue;
            text-align: center;
}
.boite_droite{
            float:right; 
	 /*  padding: 3px; 
	   border: 5px solid #ccc; 
	    margin-right: 10px; 
            margin-bottom: 10px;*/
margin-left:10px;
            font-family: arial;
            font-weight:"";
            font-size:10px;
            color: blue; 
            text-align:center;
}

.encart{
border:3px solid #ccc; 
padding:3px;

}

.boite_droite_horizontale{
float:right;
padding: 0px;
margin: 0px;
font-family: arial;
            font-weight:"";
            font-size:10px;
            color: blue; 
            text-align:center;
margin-bottom:10px;
/*border:1px solid blue; pour essais */
}

.boite_gauche_horizontale{
float:left;
padding: 0px;
margin: 0px;
font-family: arial;
            font-weight:"";
            font-size:10px;
            color: blue; 
            text-align:center;
/*margin-left: 10px;*/
margin-bottom:10px;
/* border:1px solid blue; pour essai */
}

#grand_dessin{
position:relative
padding: 0px;
margin-left: 130px;
margin-bottom:0px;
margin-top:0px;
 margin-right: 0px;
border:2px solid blue;
}

#grand_dessin p {
align-content:center;
}