/*
  Feuille de style générique pour POM (navigateurs visuels)
*/


/* Logo POM */

a #pom
{
  position: relative ;
  top: 12px ;
  height: 32px ;
  width: 32px ;    
  background: url(/img/apple-red-small.gif) ;    
}
  
a #pom:hover
{
  height: 32px ;
  width: 32px ;    
  background: url(/img/apple-green-small.gif) ;
}


/*
  Faire apparaître les raccourcis d'accessibilité disponibles (navigateurs modernes)
*/

a[accesskey]:after
{
  content: " [" attr(accesskey) "]" ;
}

/*
  modaccess est un cas particulier dans POM on le prend en charge
*/

#modaccess
{
  position: absolute ;
  left: -9999px ;
  display: inline ;
}


#modaccess a
{
 position: absolute ;
 overflow: hidden ;
 width: 0 ;
 height: 0 ;
}

/* Pour les vrais navigateurs */

html>body #modaccess a
{
  position: fixed ;
  top: 0 ;
  left: 0 ;
}

html>body #modaccess a:active, html>body #modaccess a:focus
{
  font-size: large ;
  overflow: visible ;
  width: auto ;
  height: auto ;
  padding: 8px ;
  -moz-border-radius: 12px ;
  border: 3px solid red ;
  background-color: #ddd ;
  z-index: 1 ;
}

/*
  Suppression des propriétés par défaut
*/

img, a, blockquote, div, p, ul, ol, dl, dt, dd, li, form, legend, input, label, fieldset, 
h1, h2, h3, h4, h5, h6, address, object, strong, em, quote, span, kbd, abbr, acronym, button
{
  padding: 0 ;
  margin: 0 ;
  border: none ;
  text-decoration: none ;
  list-style: none outside ;
}


/* histoire de visualiser les champs de saisie en mode brut [de POM] */

input
{
  border: 1px solid black ;
}

/*
  Hack IE pour l'auto clear sauf pour IE Mac et les autres

  Thanks a lot to Holly Bergevin for tracking down this one!
\*/

* html .holly
{
  height: 1% ;
}

/* fin hack */


/*
  Encadrés en float
  On ajoute une marge légère de l'autre côté pour ne pas coller les autres éléments
*/

.left
{
  float: left ;
  padding-right: 2px ;
}

.right
{
  float: right ;
  padding-left: 2px ;
}

/* on accentue la marge pour les images, c'est moins génant pour la continuité de la lecture */

.left img
{
  padding-right: 8px ;
}

.right img
{
  margin-left: 8px ;
}

/* en float right il faut penser à adapter également la marge gauche de la légende */

.right .caption
{
  margin-left: 8px ;
}


.block
{
  padding-bottom: .1px ;
}

/* auto clear pour les navigateurs normaux */

.block:after
{
  content: "." ;
  display: block ;
  height: 0 ;
  clear: both ;
  visibility: hidden ;
}

/* En cas d'erreur fatale */

#pom-error
{
  background-color: #fff ;
  color: #d00 ;
}

#pom-error h1
{
  color: #d00 ;
  padding-bottom: 1em ;
  padding-top: 0.3em ;
  padding-left: 48px ;
  background: transparent url(/img/apple-green.gif) no-repeat top left ;
}

#pom-error p
{
  display: block ;
  padding-bottom: 6px ;
  padding-left: 52px ;
  padding-right: 52px ;  
}

#pom-error a, #pom-error a:link
{
  text-decoration: underline ;
  color: #d00 ;
  margin-top: 16px ;
}

#pom-error a:hover
{
  text-decoration: none ;
}