body
{
margin:auto;
margin-top:2px;
margin-bottom:2px;
background-color:black;
}

/* ---------------------------------------------------
----mise en page de la page INDEX--------------------*/
.index
{
 margin:auto;
 margin-top:0px;
 width:800px;
 height:571px;
  background-image:url("index15.jpg");
 background-repeat:no-repeat;
}

.index-info
{
 width:336px;
 height:210px;
  overflow: auto;
 padding-left:2px;
    position: relative;
   left: 420px;
   top: 190px;
   color : white;
   
   
}

span.index-text-bienvenue
{
 font-family :Script-C650,times,arial,serif;
 font-size:18px;
 text-decoration : none;
 color : white;
}

 a img /* Toutes les images contenues dans un lien */
{
   border: none; /* Pas de bordure */
}
 
.index-info p
{
color:white;
font-family :times,arial,serif,Script-C650;
font-size:16px;
}

/*les liens des paragraphe pour actu*/
.index-info p a
{
color: #007fff;
}

.index-info p a:hover
{
color:  #e72ace;
}

span.bouton-entrez
{
width:188px;
height:207px;
position:relative;
left:595px;
top:245px;
}
/*---------------------------------------------------------------
----------CADRE POUR CENTRER LE DESIGN BORDURE BLANCHE---------*/

#cadre-fond
 {
 width:930px;
 margin:auto;
 border : 1px solid white;
background-color : #2a2a2a;
 } 




/* --------------------------------------------------------------
------ DIFFERENT HEADER ---------------------------------------*/

#header-general
{
 width:930px;
 height:253px;
 background-image:url("header-general-noir.jpg");
 background-repeat:no-repeat;
}

#header-domino
{
 width:930px;
 height:253px;
 background-image:url("header-domino-noir.jpg");
 background-repeat:no-repeat;
}

#header-ulane
{
 width:930px;
 height:253px;
 background-image:url("header-ulane-noir.jpg");
 background-repeat:no-repeat;
}
/*----------------------------------------------------------------
-----------------MENU HORIZONTAL--------------------------------*/

#menu
{
 
 width:930px;
}

 #menu a
 {
 color:white;
  font-size:18px;
  font-family :times,arial,serif,Script-C650;
 }
 
#menu a:hover
 {
 color:red;
 }

#menu li.sousmenu
{
 
text-align:center;
color:white;
padding-top: 4px; 
margin:0px;

background-repeat:no-repeat;
background-image:url("barre-noir-fleche.png");

 font-family :times,arial,serif,Script-C650;
 font-size:18px;

}

#menu li.sousmenu:hover
{
color:red;
background-image:url("barre-bleu.png");
} 

#menu ul 
{
padding: 0;
 margin:0px; 
 text-align:center
 }
 
#menu li 
{ 
background-image:url("barre-noir.png");
width:155px;
height:25px; 
color:white;
} 

#menu li:hover
 {
 background-image:url("barre-bleu.png");
 color:red;
 }
 
 #menu ul li 
{
position:relative;
 list-style-type: none;
 float:left; 
 }
 
#menu ul ul 
{
position:absolute;
display:none; 
width:100px;
}

#menu ul ul li.sousmenu 
{
 padding:0px;
 margin:0px;
 background-image:url("barre-noir-fleche-cote.png");
 background-repeat:no-repeat;
}

#menu li a 
{
text-decoration: none; 
padding: 4px 0 4px; 
display:block;
width:130px;
}

 #menu ul.niveau1 li.sousmenu:hover ul.niveau2,
#menu ul.niveau2 li.sousmenu:hover ul.niveau3,
#menu ul.niveau3 li.sousmenu:hover ul.niveau4 
{
display:block;
}

#menu ul.niveau2
{
top:24px;
left:0px; 
}

#menu ul.niveau3
 {
 top:-1px; 
 left: 155px;
 }
 
#menu ul.niveau4 
{
top:-1px;
 left:155px;
 }

#menu ul.niveau4 li 
{
width:250px;
}

#menu ul.niveau4 li a
{
width:250px;
} 


/* --------------------------------------------------------------------
------------contenu--------------------------------------------------*/


 #contenu
 {
 
 color:white;
 font-family:"Comic Sans MS",times,Arial,Helvetica,Script-C650,serif;
 font-size:18px;
 padding:10px;
background : #2a2a2a;
 margin:auto;

 margin-top:10px;
 margin-bottom:0px;
 }

#contenu h1
{
 color: #007fff;
 text-align:center;
 font-family:Script-C650, Arial,Helvetica,serif;
}

/*les titres h2   qui sommes nous en marron avec ulane en gif devant*/
#contenu h2
{
 height:60px;
 background-image:url("landseer.gif");
 background-repeat:no-repeat;
 padding-left:70px;
 padding-top:5 px;
 color:#007fff;
 
 }


/* les liens*/
a
{
color : #007fff;

}

a:hover
{
color : #e72ace;

}

#contenu h4
{
 color:white;
 text-align:center;
 font-family:Script-C650, Arial,Helvetica,serif;
 background-color : gray;
}

p.important
{
color :red;
}
/*-------------------------------------------------------------------------------------------
------------------------MISE EN PAGE LIVRE D'OR----------------------------------------------
-------------------------------------------------------------------------------------------*/

.obligatoire
{
color : red
}
table.formulaire
{
border-collapse: collapse;
width : 650px;
margin: auto;
border:1px solid black;
background-color:#bababa;
}
table.formulaire th
{
text-align : center;
color:black;
}
table.formulaire  tr,td
{

border :1px solid black;
}

td.center
{
text-align : center;
border :1px solid black;
}

td.center1
{
text-align : left;
padding-left :60px;
border :1px solid black;
}


.barre
{
width:20px;

height: 15px;
}

.livre_or_fond
{
width : 680px;
margin : auto;
 
color : white;
margin-bottom : 10px;
background-color:#bababa;
padding:5px; 
border:1px solid black;
}

.lien_page
{
color : red;
text-decoration : none;
}

.livre_or_nom
{
width : 670px;

color:black;
}

.livre_or_message
{
width : 670px;

background-color:gray;
color: white;
padding:2px;
}

.livre_or_message1
{
width : 670px;
text-align : center;
background-color:gray;
color: white;
padding:2px;
}

.date_site
{
width : 670px;


text-align : right;
color : white;
}






/*-----------------------------------------------------------------------------------------
--------------------- MISE EN PAGE NEWS----------------------------------------------------
-----------------------------------------------------------------------------------------*/

.news
{
background-color:black;
color : white;
margin : auto;
margin-bottom : 5px;
padding : 10px;
}

p.separation
{
text-align : center;
color : blue;
margin-bottom : 5px;
font-size : 25px;
}

span.date_derniere_news
{
color : #007fff;


}

 span
{
color : #e72ace;

}

p.photo_news
{

text-align : center;

}

/*-------------------------------------------------------------------------------------------
----------- DESIGN PAGE FICHE OK ------------------------------------------------------------
-------------------------------------------------------------------------------------------*/
/* tableau des filles*/

table.femelle
{
   border-collapse: collapse;
   margin:auto;
   margin-top:20px;
   margin-bottom:20px;
   width:350px;
   border:1px solid #e72ace;
   background-color:#ffc1f7;
}

table.femelle th
{
text-align:right;
color:#cf20b8;
border : 1px solid #cf20b8;
}

table.femelle td
{
color : black;
text-align : left;
border : 1px solid #cf20b8;;
}

table.femelle td.photo
{
height:40px;
margin:auto; 
border : 1px solid #cf20b8;
text-align:center;
}
/* commentaire sur les qualite, defaut et son arrivé à la maison FEMELLE*/

p.commentaire_fiche_femelle
{
border:1px solid #e72ace; 
margin:auto;
background-color:#ffc1f7 ;
padding:10px;
margin-bottom:20px;
color:black;

}
strong.mon_commentaire_femelle
{
color:#e72ace;
text-decoration:underline;

}

/*tableau des garcons*/

table.male
{
   border-collapse: collapse;
   margin:auto;
   margin-top:20px;
   margin-bottom:20px;
   width:350px;
   border:1px solid #007fff;
   background-color:#b7d9fd;
}

table.male th
{

text-align:right;
color:#007fff;
border : 1px solid #007fff;
}

table.male td
{
color : black;
text-align : left;
border : 1px solid #007fff;
}

table.male td.photo
{
height:40px;
margin:auto; 
border : 1px solid #007fff;
text-align:center;
}

/* commentaire sur les qualite, defaut et son arrivé à la maison FEMELLE*/

p.commentaire_fiche_male
{
border:1px solid #007fff; 
margin:auto;
background-color:#b7d9fd ;
padding:10px;
margin-bottom:20px;
color:black;

}
strong.mon_commentaire_male
{
color:#007fff;
text-decoration:underline;

}
/*tableau croissance */

table.croissance_femelle
{
   border-collapse: collapse;
   margin:auto;
   margin-top:20px;
   margin-bottom:20px;
   width:500px;
    border:1px solid #e72ace;
   background-color:#ffc1f7;
   }
   
 table.croissance_femelle th
{
text-align:center;
color:#cf20b8;
border : 1px solid #cf20b8;
}
 
 table.croissance_femelle td
{
color : black;
text-align : center;
border : 1px solid #cf20b8;;
}
 table.croissance_male
{
   border-collapse: collapse;
   margin:auto;
   margin-top:20px;
   margin-bottom:20px;
   width:500px;
   border:1px solid #007fff;
   background-color:#b7d9fd;
}

table.croissance_male th
{

text-align:center;
color:#007fff;
border : 1px solid #007fff;
}

table.croissance_male td
{
color : black;
text-align : center;
border : 1px solid #007fff;
}



/*-----------------------------------------------------------------------------------------
---------------------------DESIGN POUR PAGE EXPO-------------------------------------------
-----------------------------------------------------------------------------------------*/
strong.landseer-present
{
 color : yellow;
}

div.classe-presente
{
width: 100px;
float:left;
 margin-right:50px;
 margin-bottom:50px;

}

div.classe-presente div
{
display:none;

}

div.classe-presente:hover  div
{
display: block;
position:absolute;
width:500px;
background-color:black;
color:white;
border:1px solid white;
padding:10px;
padding-bottom : 20px;
overflow : auto;
max-height : 300px;
margin-top : 0px;

}

 div.visible-expo 
{
color:white;
 
}

 
 
div.visible-expo h3
{
background-image: url("../design/landseer.gif");
background-repeat:no-repeat;
color:#007fff;
text-transform : uppercase;
padding-left:57px;
height : 37px; 
}


/*tous les em pour les resultats des chien present*/
div.visible-expo em 
{
font-size : 12px;
color : white;
}

div.visible-expo  strong em
{
font-size : 12px;
color : yellow;
}
 /* pour marque nos chien*/
div.visible-expo strong
{

color : yellow;
}


table.expo
{
   border-collapse: collapse;
   margin:auto;
   width:500px;
 clear :both;
   background-color: gray;   
}

/* couleur du text dans les "th" et couleur des bordures*/
table.expo th
{
color : yellow;
border : 1px solid silver;
width : 150px;
text-align : right;
}



/* design de la photo dans le tableau de resultat d'expo*/
td.photo-tableau-expo
{

vertical-align: middle;
}

table.expo tr
{

text-align:center;
}

table.expo td
{
border:1px solid silver;
text-align : left;
}

/* balise de paragraphe pour centrer le commentaire du juge*/
p.commentaire-juge
{
margin: auto;
margin-top : 20px;
margin-bottom : 20px;
width: 700px;
border:1px solid black;
background-color : gray;
padding : 10px;
color : white;
font-family:"Comic Sans MS",times,Arial,Helvetica,Script-C650,serif;
}
/* commentaire du juge pour les expo souligné et couleur*/
strong.commentaire-juge
{
color:blue;
text-decoration:underline;

}

p.centrer_photo_expo
{
margin: auto;
text-align : center;
}

p.mon_commentaire
{
margin: auto;
margin-top : 20px;
margin-bottom : 20px;
width: 700px;
border:1px solid black;
background-color : gray;
padding : 10px;
color : white;
font-family:"Comic Sans MS",times,Arial,Helvetica,Script-C650,serif;
}

strong.mon_commentaire
{
color:Yellow;
text-decoration:underline;

}




/*-----------------------------------------------------------------------------------
-------------------- DESIGN PAGE PEDIGREE -------------------------------------------
-----------------------------------------------------------------------------------*/




.enfant_male
{
 height:200px;
 width:300px;
    border:1px solid #007fff;
   background-color:#b7d9fd;
   margin:auto;
   text-align:center;
   color : black;
 }
 
 .enfant_femelle
{
height:200px;
 width:300px;
    border:1px solid #e72ace;
   background-color:#ffc1f7;
   margin:auto;
   text-align:center;
   color : black;
 }
 
 
.parent
{
width:920px;
 height:150px;

}

.mere
{
    width:250px;
   height:150px;
   float:left;
   border-collapse: collapse;
   margin-left:170px;
 margin-top:3px;
 
border:1px solid #e72ace;
  color:black;
   background-color:#ffc1f7;
   font-size:14px;
}
   
 .pere
 {
 width:250px;
   height:150px;
   float:left;
   border-collapse: collapse;
   margin-left:70px;
 margin-top:3px;
color : black;
  border:1px solid #007fff;
   background-color:#b7d9fd;
   font-size:12px;
  
}
.grand_parent

{
 width:920px;
 height:150px;
 margin:auto;


}

.grand_pere
 {
 width:186px;
 height:150px;
 float:left;
  margin-left:5px;
 font-size:14px; 
 border:1px solid #007fff;
   background-color:#b7d9fd;
  color : black;
   
}

.grand_mere
{
 width:180px;
 height:150px;
 float:left;
  margin-left:40px;
 font-size:14px; 
  border:1px solid #e72ace;
   background-color:#ffc1f7;
 color : black;
}


.arriere_grand_parent

{
 height:110px;
 width:920px;
 margin:auto;

}

 .arriere_grand_pere
 {
 width:100px;
 height:120px;
 float:left;
  margin-left:3px;
    margin-right:5px;
 font-size:10px; 
 border:1px solid #007fff;
   background-color:#b7d9fd;
  color : black;
}

.arriere_grand_mere
{
 width:100px;
 height:120px;
 float:left;
  margin-left:12px;
 font-size:10px; 
  border:1px solid #e72ace;
   background-color:#ffc1f7;
    border-collapse: collapse;
	color : black;
}


div.detail_pedigree_male
{
width: 50px;
float:left;
 
}

div.detail_pedigree_male div
{
display:none;
}

div.detail_pedigree_male:hover  div
{
display: block;
position:absolute;
width:170px;

overflow : auto;
}

table.pedigree_male
{
width : 170px;
border-collapse: collapse;
 border:1px solid #007fff;
   background-color:#b7d9fd;
 
}

table.pedigree_male th
{
text-align:right;
color:#007fff;
border : 1px solid #007fff;
}

table.pedigree_male td
{
color : black;
text-align : left;
border : 1px solid #007fff;
}

div.detail_pedigree_femelle
{
width: 50px;
float:left;
 margin-right:30px;
}

div.detail_pedigree_femelle div
{
display:none;
}

div.detail_pedigree_femelle:hover  div
{
display: block;
position:absolute;
width:200px;
padding-bottom : 50px;
overflow : auto;
}

table.pedigree_femelle
{
width : 200px;
border-collapse: collapse;
  border:1px solid #e72ace;
   background-color:#ffc1f7;
}

table.pedigree_femelle th
{
text-align:right;
color:#cf20b8;
border : 1px solid #cf20b8;
width : 70px;
}

table.pedigree_femelle td
{
color : black;
text-align : left;
border : 1px solid #cf20b8;
}

/*----------------------------------------------------------------------------
----------------TABLEAU EXPO------------------------------------------------*/
table.tableau-expo
{
border-collapse: collapse;
border:1px solid black;
background-color:black;
}

table.tableau-expo th
{
color : white;
border:1px solid gray;
}

table.tableau-expo td
{
color :white;
border:1px solid gray;
}

/*----------------------------------------------------------------
-----------------TEXTE DEFILANTE--------------------------------*/
p.defilement-news
{
color :#007fff;
width :500px;
margin : auto;
margin-bottom : 20px;
}

p.defilement-news strong
{
color : red;
}



/*----------------------------------------------------------------*/

/* -------------------------------------------------------------------------
------------ PIED DE PAGE-------------------------------------------------*/
#footer
{

 width:930px;
 height:196px;
 text-align:center;
background-repeat:no-repeat; 
background-image:url("footer_noir.png");
color : white;
}

