/*Corps page*/

body
{
   width: 980px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 40px;    /* Idem pour le bas du navigateur */
   background-image: url("../images/degrade.jpg");
   background-repeat: repeat-x;
   background-attachment: fixed;
}


/* L'en-tête */

#en_tete
{
   width: 980px;
   height: 162px;
   background-repeat: no-repeat;
   background-image: url("banniere_ukraine.jpg");
   margin-bottom: 0px;
}
td 
{

   border: 1px solid black; /* ... auront une bordure de 1px */
   font-family: "Times New Roman", "Trebuchet MS", "Comic sans MS", Times, serif;
   text-align: center;
   font-size: 14px;
   color: white;
   width: 115px;
   font-weight: bold;
   
 }
 
 td #contact 
{
   background-color: #c7eac2;
   height: 25px;
   padding-top: 5px;
   }
   
td #accueil /* la cellule accueil du tableau... */
{
   background-color: #b4d4af;
   height: 25px;
   padding-top: 5px;
   }

td #association
{
   background-color: #a2c09e;
   height: 25px;
   padding-top: 5px;
  }
td #activites
{
   background-color: #8ea98a;
   height: 25px;
   padding-top: 5px;
 }
  
td #lorraine
{
   background-color: #7a9177;
   height: 25px;
   padding-top: 5px;
 }
td #ukraine
{
   background-color: #667764;
   height: 25px;
   padding-top: 5px;
  }
  
td #adherents
{
   background-color: #515f4d;
   height: 25px;
   padding-top: 5px;
  }
 
table
{
   border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
   margin-left: 0px;
    }
td  a
{ color: white;
  text-decoration: none;
}

td a:hover {
text-decoration: underline;
color: green; }

#liouba {
font-family:"Times New Roman", "Trebuchet MS", "Comic sans MS", Times, serif;
font-size:16px;
font-style:italic;
font-weight:bold;
text-align: center;
position: relative;
width: 150px;
float: right;
}
#menu
{
   float: left;
   width: 200px; /* Très important : donner une taille au menu */
   font-family: "Times New Roman", "Trebuchet MS", "Comic sans MS", Times, serif;
   font-style: italic;
   font-weight: bold;
   border: 0px solid black;
   margin-top: 10px;
   font-size: 15px;
   margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
   margin-left:0px;
   line-height: 13px;
}

ul {
list-style-type: none

}

#menu  a
{
	color: black;
	text-decoration: none;
	}

#menu a:hover
{
text-decoration: underline;
color: #515f4d;
}
	
#corps
{
   margin-left: 200px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 5px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 15px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
   color: black;
   border: 0px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
   background-image: url("fond_ukraine.jpg");
   background-attachment: fixed;
   background-repeat: no-repeat;
   background-position: top center;
text-align: justify;

}

#corps img {
border: 0px;
 }


h4 {
font-style: italic;
font-weight: bold;
margin-top: 0px;
}

.hetman, .orange, .st-sophie, .st-sophie2, .piecebis, .karbovanietz2, .cathedrale, .usine, .tryzub, .blason, .drapeau, .coq, .verbytsky, .doroshenko, .cosaques, .iaroslav
{ float: left; 
margin-right: 15px;
text-align: center;
font-size: 13px;
margin-bottom: 5px;}


.carte, .marche, .bogdan, .karbovanietz, .blasonmena, .blasontcher, .mena_centre, .kalina, .russie_kievienne, .iouchtchenko
{ float:right;
margin-left: 15px;
text-align: center;
font-size: 13px;

margin-bottom:5px;}

.kiev, .kiev2, .piece, .hryvniarecto, .hryvnenrecto, .desna, .tryzubvola
{  
text-align: center;
font-size: 13px;
}

.blasonmena {
margin-top: 80px; }





#skyline {
float:left;
   width: 550px;
   height: 485px;
   background: url("carte2sansville.gif") no-repeat;
   margin: 10px ;
   padding: 0;
   position: relative;
   
}
#skyline li {margin: 0; padding: 0; list-style: none; display: block; position: absolute;}

#skyline a {display: block; border: 0px;}


#panel22b { top: 14px; left: 54px; width: 70px;  height: 75px; z-index: 10; }
#panel22b a {height: 75px;}

#panel25b { top: 34px; left:154px ;width: 72px; height:95px;}
#panel25b a {height: 95px;}

#panel20b { top:95px; left: 80px; width: 50px; height:75px; z-index: 30;}
#panel20b a {height: 75px;}

#panel23b { top: 140px; left: 0px; width: 75px; height:55px;}
#panel23b a { height: 55px;}

#panel2b { top: 0px; left: 250px; width: 80px; height:95px;}
#panel2b a { height: 95px;}

#panel1b { top: 100px; left: 225px; width: 95px; height:75px; z-index: 60;}
#panel1b a { height: 75px;}

#panel16b { top: 190px; left: 180px; width: 95px; height:135px; z-index: 20;}
#panel16b a { height: 135px;}

#panel5b { top: 145px; left: 330px; width: 115px; height:80px;}
#panel5b a { height: 80px;}

#panel13b { top: 92px; left: 465px; width: 73px; height:100px;}
#panel13b a { height: 100px;}

#panel4b { top: 280px; left: 320px; width: 125px; height:80px;}
#panel4b a { height: 80px;}

#panel14b { top: 70px; left: 20px; width: 85px; height:90px;}
#panel14b a { height: 90px;}

#panel10b { top: 85px; left: 100px; width: 85px; height:90px;}
#panel10b a { height: 90px;}

#panel17b { top: 85px; left: 300px; width: 95px; height:70px;}
#panel17b a { height: 70px;}

#panel15b { top: 190px; left: 240px; width: 95px; height:70px;}
#panel15b a { height: 70px;}

#panel6b { top: 135px; left: 415px; width: 95px; height:105px;}
#panel6b a { height: 105px;}

#panel18b { top: 15px; left: 100px; width: 75px; height:85px;}
#panel18b a { height: 85px;}

#panel3b { top: 165px; left: 85px; width: 75px; height:45px;}
#panel3b a { height: 45px;}

#panel11b { top: 150px; left: 230px; width: 120px; height:55px;}
#panel11b a { height: 55px;}

#panel9b { top: 220px; left: 300px; width: 90px; height:65px;}
#panel9b a { height: 65px;}

#panel8b { top: 80px; left: 380px; width: 90px; height:75px;}
#panel8b a { height: 85px;}

#panel12b { top: 40px; left: 220px; width: 75px; height:80px;}
#panel12b a { height: 105px;}

#panel7b { top: 125px; left: 43px; width: 62px; height:75px; z-index: 50;}
#panel7b a { height: 75px;}

#panel21b { top: 120px; left: 160px; width: 75px; height:80px;}
#panel21b a { height: 75px;}

#panel19b { top: 0px; left: 320px; width: 75px; height:90px;}
#panel19b a { height: 100px;}

#panel24b { top: 190px; left: 370px; width: 85px; height:90px;}
#panel24b a { height: 90px;}

#panel22b a:hover {
   background: transparent url(carte2.gif)
               -54px -14px no-repeat;
}
#panel25b a:hover {
   background: transparent url(carte2.gif)
               -154px -34.5px no-repeat;
}
#panel20b a:hover {
   background: transparent url("carte2.gif")
               -80px -96px no-repeat;
}

#panel23b a:hover {
   background: transparent url("carte2.gif")
               0px -140px no-repeat;
}

#panel2b a:hover {
   background: transparent url("carte2.gif")
               -250px -0px no-repeat;
}			
   
#panel1b a:hover {
   background: transparent url("carte2.gif")
               -225px -100px no-repeat;
}

#panel16b a:hover {
   background: transparent url("carte2.gif")
               -180px -190px no-repeat;
}

#panel5b a:hover {
   background: transparent url("carte2.gif")
               -330px -145px no-repeat;
}

#panel13b a:hover {
   background: transparent url("carte2.gif")
               -465px -92px no-repeat;
}

#panel4b a:hover {
   background: transparent url("carte2.gif")
               -320px -280px no-repeat;
}

#panel14b a:hover {
   background: transparent url("carte3.gif")
               -20px -70px no-repeat;

}

#panel10b a:hover {
   background: transparent url("carte3.gif")
               -100px -85px no-repeat;
	
}

#panel17b a:hover {
   background: transparent url("carte3.gif")
               -300px -85px no-repeat;
}

#panel15b a:hover {
   background: transparent url("carte3.gif")
               -240px -190px no-repeat;
}

#panel6b a:hover {
   background: transparent url("carte3.gif")
               -415px -135px no-repeat;
}

#panel18b a:hover {
   background: transparent url("carte4.gif")
               -100px -15px no-repeat;
}

#panel3b a:hover {
   background: transparent url("carte4.gif")
               -85px -165px no-repeat;
}

#panel11b a:hover {
   background: transparent url("carte4.gif")
               -230px -150px no-repeat;
}

#panel9b a:hover {
   background: transparent url("carte4.gif")
               -300px -220px no-repeat;
}

#panel8b a:hover {
   background: transparent url("carte4.gif")
               -380px -80px no-repeat;
}

#panel12b a:hover {
   background: transparent url("carte4.gif")
               -220px -40px no-repeat;
}

#panel7b a:hover {
   background: transparent url("carte5.gif")
               -43px -125px no-repeat;
}

#panel21b a:hover {
   background: transparent url("carte5.gif")
               -160px -120px no-repeat;
}

#panel19b a:hover {
   background: transparent url("carte5.gif")
               -320px 0px no-repeat;
}

#panel24b a:hover {
   background: transparent url("carte5.gif")
               -370px -190px no-repeat;
}

#pied_de_page
{
   font-size: 13px;
   text-align: center;
}