@charset "utf-8";
/* CSS Document */

html, body { /*paramètres qui seront appliqués à toutes les pages sauf en cas de personnalisation plus loin*/
	background-color:#000000; /*fond noir*/
	margin:0; /*marge exterieur*/
	padding:0; /*marge interieur*/
	color:#FFFFFF; /*couleur du texte: blanc*/
	font-family:Arial, Helvetica, sans-serif; /*police par défaut*/
	font-size:14px; /*taille police par défaut*/
}

/*DEBUT PAGE INDEX*/
#imgindex { /*div contenant l'image de la page d'index*/
	position:absolute;
	top:50%; /*permet de centrer verticalement*/
	left:50%; /*permet de centrer horizontalement*/
	margin-top:-250px; /* - moitié de la hauteur : permet de centrer verticalement*/
	margin-left:-425px; /* - moitié de la longueur : permet de centrer horizontalement*/
	width:850px; /*longueur*/
	height:500px; /*hauteur*/
}
/*FIN PAGE INDEX*/

#barre_repeat { /*div pour la petite barre de fond qui est répétée tout le long : images/background.gif*/
	position:absolute;
	top:0px; /*position haute : collé à la fenêtre*/
	left:0px; /*position gauche : collé à la fenêtre*/
	background-image:url(images/background.gif); /*image de fond*/
	background-repeat:repeat-x; /*l'image est répétéé dur la longueur jusqu'à remplir le div*/
	width:100%; /*longueur du div : toute la longueur de la fenêtre*/
	height:394px; /*hauteur fixe de la div : celle de background.gif*/
	z-index:1; /*superposition : le div sera en arrière plan*/
}

/*DEBUT BOUTONS MENU*/

#menu_survol { /*div du menu qui va contenir les boutons : il mesure la longueur de tous les boutons et la hauteur d'un bouton. Il est centré*/
	position:absolute;
	top:0px; /*position haute : collé à la fenêtre*/
	height:24px; /*hauteur : celle d'un bouton*/
	width:850px; /*longueur : somme des longueurs des 5 boutons*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
	left:50%; /*permet de centrer horizontalement*/
	margin-left:-425px; /* - moitié de la longueur : permet de centrer horizontalement*/
}


.bt_accueil { /*classe pour le bouton accueil : indique sa position*/
	width:142px; /*longueur*/
	height:24px; /*hauteur*/
	position:absolute;
	left:0px; /*position gauche : collé à la fenêtre*/
	top:0px; /*position haute : collé à la fenêtre*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

.bt_collec { /*classe pour le bouton ma collection : indique sa position*/
	width:142px; /*longueur*/
	height:24px; /*hauteur*/
	position:absolute;
	left:142px; /*position gauche : longueur du bouton précédent (accueil)*/
	top:0px; /*position haute : collé à la fenêtre*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

.bt_search { /*classe pour le bouton recherche : indique sa position*/
	width:142px; /*longueur*/
	height:24px; /*hauteur*/
	position:absolute;
	left:284px; /* position gauche : longueur des boutons précédents (accueil + ma collection)*/
	top:0px; /*position haute : collé à la fenêtre*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

.bt_liens { /*classe pour le bouton liens : indique sa position*/
	width:142px; /*longueur*/
	height:24px; /*hauteur*/
	position:absolute;
	left:426px; /* position gauche : longueur des boutons précédents (accueil + ma collection + recherche) */
	top:0px; /*position haute : collé à la fenêtre*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

.bt_contact { /*classe pour le bouton contact : indique sa position*/
	width:140px; /*longueur*/
	height:24px; /*hauteur*/
	position:absolute; 
	left:568px; /* position gauche : longueur des boutons précédents (accueil + ma collection + recherche + liens) */
	top:0px; /*position haute : collé à la fenêtre*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

.bt_forum { /*classe pour le bouton forum : indique sa position*/
	width:142px; /*longueur*/
	height:24px; /*hauteur*/
	position:absolute; 
	left:708px; /* position gauche : longueur des boutons précédents (accueil + ma collection + recherche + liens + contact) */
	top:0px; /*position haute : collé à la fenêtre*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

a img { /*caractéristique de la balise img utilisée dans une balise a : lorqu'on fait un lien sur une image*/
	border:none; /*elève le contour qui se met par défaut*/
}
/*FIN BOUTONS MENU*/

/*DEBUT BANNIERE : la bannière comprend le morceau central (banniere.gif), le petit morceau à gauche avec le reflet (gauche.gif) et le petit morceau à droite avec reflet (droite.gif)*/
#banniere_complete { /*div centrée regroupant les 3 div : morceau gauche + morceau centre + morceau droite */
	position:absolute;
	top:0px; /*position haute : collé à la fenêtre*/
	left:50%; /*permet de centrer horizontalement*/
	margin-left:-475px; /* - moitié de la longueur : permet de centrer horizontalement*/
	width:950px; /*longueur : somme longueur morceau gauche + morceau centre + morceau droite*/
	height:394px; /*hauteur : hauteur du morceau le plus grand (gauche.gif et droite.gif)*/
	z-index:3; /*superposition : niveau 3. Juste avant les boutons*/
}

#banniere_gauche { /*div du morceau gauche : gauche.gif*/
	position:absolute;
	background-image:url(images/gauche.gif); /*image de fond : gauche.gif*/
	background-position:left; /*position de l'image de fond : à gauche*/
	background-repeat:no-repeat; /*l'image de fond n'est pas répétée*/
	top:0px; /*position haute : collé au coté haut à l'intérieur du div bannière_complete*/
	left:0px; /*position gauche : collé au coté gauche à l'intérieur du div bannière_complete*/
	width:50px; /*longueur : celle de gauche.gif*/
	height:394px; /*hauteur : celle de gauche.gif*/
	z-index:3; /*superposition : niveau 3. Juste avant les boutons*/
}

#banniere_centre { /*div du morceau centre : banniere.gif*/
	position:absolute;
	top:24px; /*position haute par rapport au coté haut à l'intérieur du div bannière_complete*/
	left:50px; /*position gauche par rapport au coté gauche à l'intérieur du div bannière_complete (longueur de gauche.gif qui se trouve juste avant dans banniere_complete)*/
	background-image:url(images/banniere.gif); /*image de fond : banniere.gif*/
	background-position:center; /*position d l'image de fond : centrée*/
	background-repeat:no-repeat; /*l'image de fond n'est pas répétée*/
	width:850px; /*longueur : celle de banniere.gif*/
	height:205px; /*hauteur : celle de banniere.gif */
	z-index:3; /*superposition : niveau 3. Juste avant les boutons*/
}

#banniere_degrade { /*div du morceau degradé en dessous la banniere : degrade-sous-banniere.gif*/
	position:absolute;
	top:229px; /*position haute par rapport au coté haut à l'intérieur du div bannière_complete*/
	left:50px; /*position gauche par rapport au coté gauche à l'intérieur du div bannière_complete (longueur de gauche.gif qui se trouve juste avant dans banniere_complete)*/
	background-image:url(images/degrade-sous-banniere.gif); /*image de fond : degrade-sous-banniere.gif*/
	background-position:center; /*position d l'image de fond : centrée*/
	background-repeat:no-repeat; /*l'image de fond n'est pas répétée*/
	width:850px; /*longueur : celle de degrade-sous-banniere.gif*/
	height:42px; /*hauteur : degrade-sous-banniere.gif*/
	z-index:3; /*superposition : niveau 3. Juste avant les boutons*/
}

#banniere_droite { /*div du morceau droite : droite.gif*/
	position:absolute;
	background-image:url(images/droite.gif); /*image de fond : droite.gif*/
	background-position:right; /* position de l'image de fond : à droite*/
	background-repeat:no-repeat; /*l'image de fond n'est pas répétée*/
	top:0px; /*position haute : collé au coté haut à l'intérieur du div bannière_complete*/
	left:900px; /*position gauche par rapport au coté gauche à l'intérieur du div bannière_complete (longueur de gauche.gif + banniere.gif qui se trouvent juste avant dans banniere_complete)*/
	width:50px; /*longueur : celle droite.gif*/
	height:394px; /* hauteur : celle de droite.gif*/
	z-index:3; /*superposition : niveau 3. Juste avant les boutons*/
}

#conteneur_news { /*div des news en haut à droite de chaque page*/
	position:absolute;
	width:850px; /*longueur du div*/
	height:205px; /*hauteur du div*/
	top:24px; /*position haute par rapport au menu*/
	left:50%; /*permet de centrer horizontalement*/
	margin-left:-425px; /* - moitié de la longueur : permet de centrer horizontalement*/
	font-size:12px; /*taille de la police dans ce div*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#maj { /*div pour la date de mise à jour dans les news*/
	position:absolute;
	width:90px; /*longueur du div*/
	height:15px; /*hauteur du div*/
	top:32px; /*position haute par rapport au menu*/
	right:5px; /*position droite par rapport au cadre des news*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#news_texte { /*div pour le texte du cadre des news*/
	position:absolute;
	width:236px; /*longueur du div*/
	height:62px; /*hauteur du div*/
	top:75px; /*position haute par rapport au menu*/
	right:42px; /*position droite par rapport au cadre des news*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
	
}

.date_news { /*classe utilisée pour les dates du cadre des news*/
	color:#0100FF; /*couleur bleu*/
	font-weight:bold; /*texte en gras*/
}

/*FIN BANNIERE*/

/*DEBUT CENTRE + FOOTER*/
#conteneur { /*div conteneur : contient le div principal, le footer et les liens en bas de page*/
	position:absolute;
	top:271px; /*position haute par rapport à la fenêtre*/
	left:50%; /*permet de centrer horizontalement*/
	margin-left:-425px; /* - moitié de la longueur : permet de centrer horizontalement*/
	width: 850px; /*longueur du div*/
	background-color:#0a0a0a; /*couleur de fond : gris foncé*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#principal_accueil { /*div principal uniquement pour la page d'accueil : taille fixe*/
	width:850px; /*longueur du div*/
	height:500px; /*hauteur du div*/
	background-color:#0a0a0a; /*couleur de fond : gris foncé*/
}

#animation { /*animation flash de la page d'accueil*/
	position:absolute;
	top:110px;/*position haute*/
	width:600px;/*longueur du div*/
	height:171px;/*hauteur du div*/
	left:50%;/*permet de centrer horizontalement*/
	margin-left:-300px;/* - moitié de la longueur : permet de centrer horizontalement*/
}

#bouteille { /*bouteille en image de fond sur la page d'accueil*/
	position:absolute;
	top:10px;/*position haute*/
	width:850px;/*longueur du div*/
	height:400px;/*hauteur du div*/
	background-image:url(images/fond-home.jpg); /*image de fond*/
	background-position:center; /*position de l'image de fond*/
	background-repeat:no-repeat; /*l'image n'est pas répétée dans le div*/
}

#rss_img { /*image pour le flux rss et le logo en bas de la page d'accueil*/
	position:absolute;
	top:420px;/*position haute*/
	left:50%;/*permet de centrer horizontalement*/
	margin-left:-161px;/* - moitié de la longueur : permet de centrer horizontalement*/
	width:321px;/*longueur du div*/
	height:82px;/*hauteur du div*/
}

#rss_lien { /*liens à coté de l'image du flux RSS*/
	position:absolute;
	top:430px;/*position haute*/
	left:316px;/*position gauche*/
	width:145px;/*longueur du div*/
	height:50px;/*hauteur du div*/
	font-size:12px;/*taille du texte*/
}

#principal { /*div principal pour les autres pages : ne possède pas d'image de fond*/
	width:850px; /*longueur du div*/
	background-color:#0a0a0a; /*couleur de fond : gris foncé*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#footer { /*div du footer : pied de page*/
	clear:both;
	width:850px; /*longueur du div*/
	height:110px; /*hauteur du div*/
	background-image:url(images/footer.gif); /*image de fond : footer.gif*/
	background-position:bottom; /*position de l'image de fond : en bas dans le div*/
	background-repeat:no-repeat; /* l'image n'est pas répétéé dans le div*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/

}

#footer_texte { /*div contenant le texte du footer*/
	clear:both;
	position:absolute;
	bottom:40px; /*position par rapport au bas du div footer*/
	width:850px; /*longueur du div*/
	height:55px; /*hauteur du div*/
	text-align:center; /*le contenu du div est centré*/
	font-size:9px; /*taille de la police pour ce div*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/

}

#footer_liens { /*div pour les liens en bas de page*/
	width:850px; /*longueur du div*/
	height:20px; /*hauteur du div*/
	text-align:center; /*le contenu du div est centré*/
	color:#333333; /*couleur des caractères : gris*/
	background-color:#000000; /* couleur de fond : noir*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#footer_creative-c { /*div pour le copyright en bas de page*/
	text-align:center; /*le contenu du div est centré*/
	font-size:10px; /*taille de la police pour ce div*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#footer_creative-c-en { /*div pour le copyright en anglais en bas de page*/
	text-align:center; /*le contenu du div est centré*/
	font-size:10px; /*taille de la police pour ce div*/
	font-style:italic; /*le texte est en italique*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

#footer_creative-abso { /*div pour le copyright en bas de page en dernier*/
	text-align:center; /*le contenu du div est centré*/
	font-size:10px; /*taille de la police pour ce div*/
	z-index:4; /*superposition : niveau 4. Tout au dessus*/
}

p { /*caractéristiques de la balise p (paragraphe)*/
	margin-bottom:0px; /*marge basse : 0 */
	margin-top:0px; /* marge haute : 0 */
	margin-left:14px; /*marge gauche : 15px */
	margin-right:14px; /*marge droite : 15px*/
}

a:link { /*caractéristiques des liens*/
	text-decoration:none; /**/
	color:#0100FF; /*couleur de la police : bleu*/
}

a:visited { /*caractéristiques des liens visités*/
	color:#999999; /*couleur de la police : gris*/
}

.inputperso {/*cases du formulaire*/
	background-color:#2a2a2a; /*couleur de fond des cases gris*/
	border-color:#978f8f; /*couleur de bordure des cases : gris*/
	color:#FFFFFF; /*couleur du texte dans les cases : blanc*/
}

.en { /*classe pour les textes en anglais : tous en italique*/
	font-style:italic;
}

.centrer { /*classe permettant de centrer*/
	text-align:center;
}

/*FIN CENTRE + FOOTER*/

/*DEBUT POPUP*/
#barre { /*div pour la petite barre de fond qui est répétée tout le long :background_popup.gif : utilisé pour le popup mail d'absolut et les popup de ma collection*/
	position:absolute;
	top:0px; /*position haute : collé à la fenêtre*/
	left:0px; /*position gauche : collé à la fenêtre*/
	background-image:url(images/background_popup.gif); /*image de fond*/
	background-repeat:repeat-x; /*l'image est répétéé dur la longueur jusqu'à remplir le div*/
	width:100%; /*longueur du div : toute la longueur de la fenêtre*/
	height:140px; /*hauteur fixe de la div : celle de background_popup.gif*/
	z-index:1; /*superposition : le div sera en arrière plan*/
}

#logo { /*logo positionné sur la barre en haut de la page popup*/
	position:absolute;
	top:0px; /*position haute : collé à la fenêtre*/
	left:0px; /*position gauche : collé à la fenêtre*/
	background-image:url(images/logo-popup.gif); /*image de fond : logo_popup.gif*/
	width:150px; /*longueur du div :celle de logo_popup.gif*/
	height:140px; /*hauteur fixe de la div : celle de logo_popup.gif*/
	z-index:2; /*superposition : niveau 2. Au dessus de la barre*/
}

#img_popup { /*div utilisé pour les popup contenant l'agrandissement des bouteilles (ma collection) : permet de centrer l'image  IMAGE EN 500px DE LARGE*/
	position:absolute;
	width:500px; /*longueur du div*/
	/*height:640px; hauteur du div*/
	top:150px; /*position haute*/
	left:50%; /*permet de centrer*/
	margin-left:-250px; /* - moitié de la longueur : permet de centrer horizontalement*/
}

#text_popup { /*div utilisé pour le popup message (mail d'absolut)*/
	position:absolute;
	width:330px; /*longueur du div*/
	height:330px; /*hauteur du div*/
	top:120px; /*position haute*/
	left:50%; /*permet de centrer*/
	margin-left:-165px; /* - moitié de la longueur : permet de centrer horizontalement*/
	font-size:14px; /*taille de la police du texte*/
	z-index:3; /*superposition : niveau 3. Au premier plan*/
}

#titre_popup {/*div pour le titre dans les popup (sauf music)*/
	position:absolute;
	top:100px;/*position haute*/
	left:10px;/*position gauche*/
	z-index:3;/*superposition : niveau 3. Au premier plan*/
}

#titre_popup_music {/*div pour le titre du popup music*/
	position:absolute;
	top:100px;/*position haute*/
	width:100%;/*longueur du div : toute la fenêtre*/
	height:38px;/*hauteur du div : celle de l'image music.gif*/
	background-image:url(images/titres/music.gif); /*image de fond*/
	background-position:center;/*position de l'image de fond*/
	background-repeat:no-repeat;/*l'image n'est pas répétée*/
	z-index:3;/*superposition : niveau 3. Au premier plan*/
}


/*FIN POPUP*/

/*MESSAGE D'ERREUR*/

.erreur_titre { /*classe des titres des messages d'erreurs*/
	color:#FFFFFF; /*couleur du texte: blanc*/
	font-family:Arial, Helvetica, sans-serif; /*police par défaut*/
	font-size:40px; /*taille police par défaut*/
}