/*
-----------------------------------------------
description : feuille de styles VIDEOSCOP / Université Nancy 2 
structure : entete + pied de page + 2 colonnes
author : Edwige Morin
version : 051215
copyright : Videoscop / Université Nancy 2
-----------------------------------------------*/
html, body {
   width: 99%;
   height: 100%;
}
body {
   background-color:#FFFFFF; 
   margin: 0;
   padding: 0;
   font-family:Arial, Helvetica, sans-serif,Verdana ;
   color:#000000;
   font-size: 0.8em;
   Width:100%;
}

#page { /*le conteneur global du site*/ 
  position:relative;
  background-color:#FFFFFF;
  width: 99%;
  margin:0 auto;
  color:inherit;
}
img {
border:none;
/*vertical-align:middle;*/}
/* =ENT [Entete]*/

.small {
font-size:small;}

----------------------------------------------- */
#header { /*le conteneur de l'entete du site*/
  background-color:#FFFFFF;
  height: 6em;
  color:inherit;
  }

#bienvenue { /* bloc de titre et sous-titre du module */
  background-color:inherit;
  float: left;
  padding:0.2em 0 0 0em; /* raccourcis unités pour : haut droite bas gauche (sens des aiguilles d'une montre)*/
  font-size:small;
  font-weight: bold;
  color: #000000;
  width:68%;
  height: 6em;
}
 
#bienvenue img {
vertical-align:middle; 
border:none;
}
#evit ul{ /*liens d'évitement du site*/
  background-color:inherit;
  float: right;
  margin:2px;
  padding:2px 2px 2px 2px;
  color: #666666;
  clear: right;
  width:30%;
  }
/* =STR [Structure de la page]
----------------------------------------------- */

#gauche { /*contenu colonne gauche*/
   background-color:#FFFFFF;
   position: absolute;
   top:15em;
   left:0;
   width:15em;
   height:auto;
   color:inherit;
   }
#main { /*contenu principal du site*/
   clear:both;
   background-color:#FFFFFF;
   /*overflow: auto;*/
   /**/width: auto;
   height: 75%;
   margin-left:17em;
   margin-top:4em;
   padding-right:20px;
   text-align:justify;
   color:inherit;
   }

#footer { /*conteneur global du pied de page*/
  background-color:inherit;
  clear:both;
  font-size: small;
  color: #999999;
  margin-top:10px;
  margin-left:10em;
  padding:5px 0 0 0;
  text-align:center;
  line-height:1.3em;
  height:3em;

}

/* =NAV [Navigation]
----------------------------------------------- */

.menugauche {
   list-style-type: none;
   margin: 0;
   padding:0 10px;/* raccourcis unités pour : haut+bas droite+gauche (groupé par 2)*/
   }
/* Navigation
----------------------------------------------- */
#nav {
  background-color:#FFFFFF;
  float:left;
  width:100%;
  border:solid #E5E8E9;
  border-width:1px 0;
  color:inherit;
  }
#nav ul {
  background-color:inherit;
  color:inherit;
  margin:0;
  padding:0 20px;
  list-style:none;
  font-size: medium;
  }
#nav li {
  float:left;
  margin:0;
  padding:0;
  background-image:none;
  line-height:10px;
  text-indent:0;
  }
#nav a {
  background-color:inherit;
  display:block;
  padding:5px 10px 6px ;
  color:#000000;
  font-weight:bold;
  text-decoration:none;
  white-space:nowrap;
  border:solid #E5E8E9;
  border-width:0 1px 0 0;
  border-top:1px solid #FFFFFF;
  border-bottom:1px solid #FFFFFF;
  border-left:1px solid #FFFFFF;
  }
  
/* La ligne suivante permet à toute la région décrite par le lien
   d'être clicable dans IE/Win. Ce "Holly Hack" est expliqué ici :
   http://www.positioniseverything.net/explorer/escape-floats.html */
* html #nav a {
  width:1%;
  }
#nav a:hover, #nav .actif {
  background-color:inherit;
  /**/background-image:  url("../img/charte/tuile_nav.png");
  background-repeat:repeat;
  color:  #CC0000;
  text-decoration:none;
  border:1px solid #CC0000;
  }
.bloc {
width:15em;
clear:left;
}
.left1 {
 float:left;
 width :70px;
} 
/**/.left2 {
 float:left;
 width :50%;
 height:3em;
 line-height:1.3em;
 padding-top:1em;
 }
/* =TIT [Titres]
----------------------------------------------- */
h1, h2, h3, h4, h5 {font-family:Arial, Helvetica, sans-serif;font-weight: bold;background-color:inherit;
}
h1 {
	margin:1em 0px 1em 0px;
	color: #CC0000 /*#333366*/;
}
h2{
	margin : 1em 2px 2px 1em;
	/**/border-bottom:dotted 1px #666666;
	color:  #666666 /*#333366*/;
	text-indent:0;
}
h3{margin: 10px 0 5px 2em;border-bottom: 1px dotted #006699; color: #006699;}
h4 {margin: 0 0 5px 0;color: #333366;text-indent:4em;}
h5 {margin:0 0 5px 0;color: #336699;font-size:inherit;text-indent:6em;}

/* =TEX [Textes]
----------------------------------------------- */
.attention {color:red; text-align:center; font-weight:bold;}
p {margin: 0 0 10px 0;   font-size:101%;}
a[accesskey]:after {
  background-color:inherit;
  content: " [" attr(accesskey) "] ";
  font-size:xx-small ;
  font-weight:bold;
  color: #999999;
  letter-spacing:0.05em;
  margin:0px;
   }
#gauche p {
   margin: 0 0 10px 10px;
   }

.encart{
   padding:1em;
   margin:2em;
   border:1px dotted gray;
   background-color: #EFEFEF;
  color:inherit;
}
.vdsp {
font-size: 2em;
line-height:1em;
font-variant:small-caps;
font-style:italic;
font-weight:900;
}
.un2 {
  background-color:inherit;
color: #999999;
}
.rouge{color:#990000;   
}
/* =LIS [Listes]
----------------------------------------------- */
#evit li {
   display:inline;
   padding:0 0 0 0;
   margin:0;
   font-size:x-small;
   }
.menugauche li {
   margin-bottom: 3px;
   }
ul {
list-style-type:none;
}
ul.puce02 ul {
list-style-image:  url("../img/charte/puce01.png");
}
 
ul.puce02 {
list-style-image:  url("../img/charte/puce02.png");
margin-left:3em;
}
/* =TAB [Tableaux]
----------------------------------------------- */
/*table {
   width:80%;
   margin:1em auto;
}
th, td {
   text-align: right; 
   padding: 0 0.5em;
   border-bottom: 1px solid #DDD;}

thead th {
   vertical-align: bottom; 
   border : 1px solid gray;
   border-right-width : thin;
   border-bottom-width : thin;
   white-space: normal;
   }
tbody td {
   vertical-align: bottom; 
   border: 1px solid gray;
   border-width: 0 1px 0 0;
   white-space: normal;
   }
th {
   border-right: 1px solid gray; 
   border-bottom-style: solid;
   white-space: nowrap;
   }
tr.total td {
   font-weight: bold; 
   border-top: 1px solid gray;
   }
tr.total th {
   border-top: 1px solid gray;

   border-bottom-style: none;
   }
tr.gris {
   background: #EEE;
   }
*/

/* =LIE [Liens]
----------------------------------------------- */
#evit a {
   background-color:inherit;
   border:1px solid #FFFFFF;
   padding:1px;
   color:#CCC;
   text-decoration:none;
   }
#evit a:hover, #evit a:active, #evit img a:hover  {
   background-color:inherit;
   border:1px solid #CC0000;
   color: #CC0000;
   }
.menugauche a {
   background-color:inherit;
   margin: 0 2px;
   color: #000000;
   font-weight:bold;
   text-decoration: none;
   }
.menugauche a:hover, .menugauche a.actif {
   background-color:inherit;
   text-decoration: overline underline;
   color: #CC0000;
   }
.menugauche a:active {
   background-color:inherit;
   color: #FF0000;
   }

#footer a {
   background-color:inherit;
   color:#999999;
   border-bottom:1px dotted #999999;
   text-decoration:none;
   }
#footer a:hover{
   border-bottom:1px solid;
   }

/* =AUT [Autres]
----------------------------------------------- */
p img {
border:none;
vertical-align:middle;
}
.erase {
clear:both;
}
#evit img, #footer img {
background-color:#ffffff;
color:#ffffff;
vertical-align:middle;
border:none;
}
#gauche img {
   margin: 0 0 5px 10px;
   }
.menugauche img {
border:none;
vertical-align:middle;
padding:0 5px ;
   }
.illustration {
width:250px;
float:right;
}
.illustre/*illustration div a positonner après le hx*/ {
   float: right;
   vertical-align: middle;
   margin: 0 ;
   text-align: center;
   vertical-align: middle;
   }
.illustre img{
   /*border:1px solid #FF9933;*/
   padding:5px 2px 0px 5px;
   margin:5px 0 0px 10px;
   }
.illustre a {
text-decoration:none;
color:#006699;
}
.illustre a:hover {
color: #CC0000;
}
.ima400 {
   text-align:center;
   margin:1em auto;
}
.zoom img, .zoom a{
background-color:  #F5F5F5 ;
border: 1px solid #999999 ;
padding:5px;
text-align:center;
}
.imazoom{
text-align:center;
margin-top:1em;
}
.imazoom img{
background-color:  #F5F5F5 ;
border: 1px solid #999999 ;
padding:5px;
}
/* Equipe
---------------------------------------------------*/

.ttlargeur {
clear:both;
width:auto;
margin:1em 3em;
}
.centrer {
text-align:center;
}
.personne li{
float:left;
width:20em;
text-align:center;
font-size:85%;
height:17em;
margin-left:0.5em;
}
img .personne {
position:absolute;
}
.mail {
font-size:90%;
}

/* Fiche
---------------------------------------------------*/
.fiche {
width: 100%;
height: auto;

text-align:justify;
}
.illuprod {
width:170px;
float: left;
vertical-align: middle;
margin: 10px;
text-align: center;
vertical-align: middle;
}
.illuprod a {
text-decoration:none;
color:#006699;
}

.descprod {
width:100%;
margin-left: inherit;
float: left;
}
.description {
width:90%;
height:auto;
margin:0 4%;
}
.video {
width:320px; height:280px; margin: 0 auto; padding: 0;}