/* Feuile de style pour le site de John Gillham peintre et sculpteur
 * Création B. Belguise */
/* mac hide \*/
html,body { height:100%;width:100%;}
/* end hide */

body {
       font-family: verdana, arial;
       background-color : rgb(160,160,176);
       margin:0px;
       padding:0px;
    }
/*#container { position: absolute;
             top : 50%;
             left : 50%;
             width : 1024px;
             height : 624px;
             margin-left : -512px;
             margin-top : -312px;
           } */

#centreur {
  height:100%;
  width:100%;
  padding:0px;
  margin:0px;
  display : table;
  vertical-align:middle;
}
#container { 
  text-align:center;
  position: relative;
  display:table-cell;
  vertical-align:middle;
  height : 624px;
  margin:0px;
  padding:0px;
}
#page {
  width:1024px;
  height:624px;
  margin:0px;
  padding:0px;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  position:relative;
}

#menu {
  font-family : cursive;
  font-style:oblique;
  font-size: 14pt;
  color: white;
  width : 140px;
  list-style-type:none;
  margin:0pt;
  padding:0pt;
  position : absolute;
  top:0px;
  left:0px;
  z-index:2;
  /*overflow:hidden;*/
}

#menu ul { list-style-type : none;
  text-align:right;
  text-indent : 0px;
  margin:0px;
  padding:0px;
  padding-left:0px;
} 

#menu dl {margin : 0px; padding: 0px;list-style-type:none;text-indent:0px;}
#menu dt {margin : 0px; padding: 0px;}

#menu .petit {font-size : 8pt;}

#menu li a:link {
  color: white;
  text-decoration:none;
}

#menu li a:visited {
  color: #F0F0F0;
  text-decoration:none;
}

#menu li a:active {
  color: #F0F0Ff;
  text-decoration:none;
}

#menu li dd {
  display:none;
  font-size : 10pt;
  font-family:serif;
  font-style:normal;
  font-weight : bold;
  color:#E0E0E0; 
  margin:0px;
  padding:0px;
  text-indent:0px;
  list-style-type:none;}
#menu li:hover dd {display:block;}

#frame {
  margin : 0px;
  padding : 0px;
  width : 873px;
  height : 623px;
  position:absolute;
  top:0px;
  left:150px;
  background-image : url(../images/fondF1.png);
  background-repeat:no-repeat;
}

#john {
 width : 240px;
 height :623px;
 position:absolute;
 top: 0px;
 left: 0px;
 z-index:1;
}

#johnv{ position :absolute; bottom:3px; left:5px;}

#frame2 {
  margin : 0px;
  width : 620px;
  height : 620px;
  background-image:url(../images/fondF2.png);
  background-repeat:no-repeat;
  z-index:2;
  position:absolute;
  left:250px;
  top : 0px;
}

#texte {
  margin :5px; 
  padding : 10px;
  width : 600px;
  height : 590px; 
/*  background-image:url(../images/fondtxt.bmp);
  background-repeat:no-repeat;
  float : right; */
  font-size:10pt;
  overflow:auto;
  z-index:2;
  text-align:left;
}

#tableau {
  background-image:url(../images/Toile.jpg);
}

#frame_tableau{
  margin : 0px;
  width : 620px;
  height : 620px;
  z-index:2;
  position:absolute;
  left:245px;
  top : -2px;
}

#frame_tableau a img {border:none;}


#centreur_tableau {
  height:100%;
  width:100%;
  padding:0px;
  margin:0px;
  table-layout:auto;
  vertical-align:middle;
}

#centreur_tableau table {margin:auto;}

#vignettes {
 width : 240px;
 height :619px;
 position:absolute;
 top: 0px;
 left: 0px;
 overflow:auto;
}

#vignettes ul { list-style-type : none;
  text-indent : 0px;
  margin-left:0px;
  margin-right:0px;
  padding:0px;
  padding-left:0px;
}

#vignettes a img {border:none;}

#vignettes a {position:relative;}

#vignettes a span {
  border: 1px solid rgb(200,200,200);
  background-image:url(../images/gris.gif);
  padding:0.25em;
  visibility : hidden;
  display:none;
  z-index : 25;
  position:absolute;
  width:150px;
  text-align:left;
  text-decoration:none;
  margin-top:-100px;;
  margin-left:10px;
  font-family:cursive;
  font-size:10pt;
  color:white;
  text-decoration:none;
}

#vignettes a:hover span {
  visibility:visible;
  display:block;
}