/*
Webmaster: Hornetovore
Design: Hornetovore
site: www.hornetovore.fr
Version: 1.0

feuille de style des pages à la racine du site
*/


html, body {height:100%;}


body 	{
	background:#fff url("/images/fond_page.png") top repeat-x fixed;
}

/********************************** LOADER ************************************/

#voile {
	background:#000;
	width:100%;
	height:100%;
	position:fixed;
	top:0px;
	left:0px;
	z-index:10;
}

#loader {
	position:absolute;
	left:50%;
	top:100px;
	width:300px;
	height:120px;
	margin-left:-150px;
	text-align:center;
	color:white;
}

.loader {
	width:70px;
	height:70px;
}

/********************************** PAGE ************************************/

#image_fond {
	z-index:0;
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	/*background:transparent url("/images/test.png") repeat top left;/* rocher */
	background:transparent url("/images/test2.png") no-repeat top left;/* mosaïque */
	/*background:transparent url("/images/test3.png") repeat top left;/* damier */
}

#wrapper {
	width:1100px;
	position:absolute;
	left:50%;
	margin-left:-550px;
}

#header {
	background: transparent url("/images/blanc_opacity-50.png") repeat;
	width:100%;
	height:120px;
	border:#037b63 1px solid;
	margin:20px 0;

	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	-moz-border-radius:10px;
}

#content {
	background: #fff;
	position:absolute;
	float:left;
	padding:10px;

	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	-moz-border-radius:10px;
}

.circle_image {
cursor:pointer;
}

#sidebar {
	background: #fff;
	float:right;
	width:300px;
	text-align:center;

	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	-moz-border-radius:10px;
}

.milieu_sidebar {
	border:#037b63 1px solid;
}

#bonhomme {
	background:#fff;
	width:300px;
	padding-top:5px;
	border:none;
	position:absolute;
	z-index:9;
	text-align:center;
}

#bonhomme img {
	width:180px;
	border:none;
}

#cliquez_ici {
position:relative;
width:140px;
height:45px;
margin-top:270px;
}

#partenaires {
	margin-top:340px;
	text-align:center;
}

#partenaires h3 {
	font:22px Georgia,Verdana;
	color:#036
}

#financeurs {
	width:200px;
	height:180px;
	margin:0 50px 0 50px;
	text-align:center;
}

#financeurs img {
	width:200px;
	height:180px;
}

#visionneuse {
	display:block;
	clear:both;
	background:#fff;
	border:#037b63 1px solid;
	margin-top:650px;
	text-align:center;
	padding:10px;

	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	-moz-border-radius:10px;
}

#footer {
	background: transparent url("/images/blanc_opacity-70.png") repeat;
	margin-top:20px;
	float:right;
	width:100%;
	text-align:center;
	border:#037b63 1px solid;

	-webkit-border-radius:10px;
	-khtml-border-radius:10px;
	-moz-border-radius:10px;
}

/********************************** SOUS-AFFICHAGE (MENU) ************************************/


.fenetre {
	position: absolute;
	top: 50%; 
	left: 50%;
	width: 300px;
	height: 180px;
	margin-left:-150px;
	margin-top:-90px;
	z-index: 11;
}

.haut 	{
	height: 28px;
}

.bas 	{
	height: 8px;
}

.haut_gauche {
	width: 8px; 
	height: 100%; 
	background: url("/images/haut_V_gauche.png") no-repeat;
	float: left; 
}

.haut_droite { 
	width: 8px;
	height: 100%; 
	background: url("/images/haut_V_droite.png") no-repeat;
	float: right;
}

.haut_centre {
	height: 100%;
	margin-left: 8px; 
	margin-right: 8px;
	background: url("/images/haut_V_centre.png") repeat-x;
	text-align: center;
}

.milieu_centre {
	background: #fbf4af url("/images/logo2.png") center no-repeat fixed;
	text-align: center;
}

.bas_gauche {
	width: 8px;
	height: 100%; 
	background: url("/images/bas_V_gauche.png") no-repeat;
	float: left;
}

.bas_droite {
	width: 8px;
	height: 100%; 
	background: url("/images/bas_V_droite.png") no-repeat;
	float: right;
}

.bas_centre {
	height: 100%;
	background: url("/images/bas_V_centre.png") repeat-x;
	margin-left: 8px;
	margin-right: 8px;
}

/******************************* INFO BULLE BULLE (categories) *********************************/

#info_bulle_centre {background:url('/images/fond_info_bulle_centre.png') no-repeat;
position:absolute;
top:140px;
left:230px;
width:300px;
height:300px;
padding:30px 5px;
display:none;
font:17px Georgia,Verdana;
}

#info_bulle_centre span.info_bulle_centre {display:none;text-align:center;}

.exclamation {margin-bottom:15px;}

.info_bulle_centre h3 {text-align:center;color:darkred;text-decoration:underline;}


/********************************** INFO BULLE (bas de page) ************************************/

p.info_bulle
{
  font-size       : 1.1em; /* Définition de la taille de la police de nos paragraphes */
}
 
a.info_bulle
{				
  color           : #2F368A;
  
  text-decoration : none; 
  
  padding         : 2px 16px 2px 2px; /*Définition des marges intérieures de notre lien */
  
  /* Définition de l'arrière plan de notre lien */
  background      : transparent url('/images/comment.gif') no-repeat right center;
  
  position        : relative; /* Indispensable pour le bon positionnement de l'info-bulle */ 
}  
 
a.info_bulle:hover 
{
  border          : 0;  /* ligne qui corrige le bug d'IE6 et inférieur */
} 

/* Rend invisible tout notre bloc span */
a.info_bulle span.info_bulle 
{								   
  position   :  absolute;
  top        :  -2000em;
  left       :  -2000em;
  width      :  1px;
  height     :  1px;
  overflow   :  hidden; 
} 

/* Rend visible tout notre bloc span et lui attribue une taille */
a.info_bulle:hover span.info_bulle, a.info_bulle:focus span.info_bulle, a.info_bulle:active span.info_bulle
{
  top        :  -150px; /* auto à la base pour que ça s'affiche au dessus du mot */
  left       :  -90px; /* auto à la base pour que ça s'affiche au dessus du mot */
  width      :  220px;
  height     :  auto;
  overflow   :  visible;
} 

span.header
{
   display         : block; 
   height          : 35px;  /* Hauteur correspondant à celle de notre image */
   line-height     : 220%;  /* Propriété qui centrera le texte verticalement */
   text-align      : center;
   background      : transparent url('/images/top.gif') no-repeat 0 0; 
   font-size       : 15px; 
   font-weight     : bold;
} 

span.content
{
   display     : block; 
   background  : transparent url('/images/centre.gif') repeat-y;
   padding     : 0 8px;
} 

span.footer
{
   display     : block; 
   height      : 5px; 
   background  : url('/images/bot.gif') no-repeat bottom left; 
   font-size   : 0; /* Corrige l'espacement inutile sous IE */
}  

/********************************** MAIL ************************************/

#contact {
	height:470px;
}

span.textChamp {
	position:relative;
	left:50%;
	margin-left:-270px;
}

.champ {
	position:absolute;
	left:50%;
	margin-left:-100px;
}

#submit {
	margin-top:190px;
}

/********************************** DIVERS ************************************/

.both {
	clear:both;
}

a	{
	color:#000;
	font-weight:bolder;
	text-decoration:none;
}

a:hover {
	color:#000;
}

#a_error{
	color:#fff;
}

#a_error:hover{
	color:red;
}

#footer a {
	color:#037b63;
}

.milieu_centre ul a {
	color:#037b63;
}

.white {
	color:#fff;
}

.gras {
	font-weight:bold;
}

.retour_ssmenu {
	margin-top:35px;
	width:283px;
	color:red;
}

.milieu_centre ul {
	list-style:circle;
	font:12px Georgia,Verdana; 
	margin:0 0 0 20px;
	text-align:left;
}