* {
	margin:0;
	padding:0;
	outline:none;
}

body {
	font-family:Verdana, Tahoma, sans-serif;
	font-size:95%; /* en % sinon sous IE ca plante */
}

/*****************************************************************
GESTION DES LIENS NORMAUX, ACTIFS ET SURVOLES
*****************************************************************/
/*  0071BC  68B8E4 */
a
{
text-decoration:none;
}

a:visited
{
text-decoration:none;
}

a:hover
{
text-decoration:underline;
}

.menuhaut {
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:1em;
text-decoration:none;
}
.menuhaut:visited {
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-weight:bold;
font-size:1em;
text-decoration:none;
}
.menuhaut:hover {
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:1em;
text-decoration:underline;
}
/*
.menuhaut:link {
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:0.8em;
text-decoration:none;
}*/

/*****************************************************************
PRE HEADER
*****************************************************************/
#pre_header
{
	width:100%;
	height:22px;
	padding-bottom:2px;
}

#pre_header_gauche
{
float:left;
width:30%;
height:22px;

}

#pre_header_droite
{
float:right;
width:70%;
height:22px;
text-align:right;
}

#pre_header_gauche input[type=text]
{
background-image:url(../images/icones/haut/barre_recherche_hover.png);
background-repeat:no-repeat;
height:18px;
width:172px;
padding-left:25px;
background-color:#FFF;
}

#pre_header_gauche input[type=text]:focus
{
border: 2px inset #FFF;
background-color:none;
}

/*****************************************************************
BLOCS PRINCIPAUX : all, header, connexion, nav, container, footer
*****************************************************************/

#all {
	width:1000px;
	margin:auto;
}
#header {
	width:100%;
	height:180px;
	background-repeat:repeat-y;
	/*padding-top:40px;
	padding-left:10px;*/
}
#logo
{
width:475px;
height:140px;
float:left;
padding-top:40px;
padding-left:25px;
}

#logo img
{
border:0;
}

#connexion {
	float:right;
	height:100px;
	margin-right:20px;
	padding:5px;
	padding-top:40px;
}
#connexion label {

	width:60px;
	float:left;
	text-align:right;
	padding-right:10px;
	font-size: 0.9em;
}

#connexion .password
{
width:120px;
}

#connexion .text
{
width:120px;
margin-bottom:5px;
}

#connexion a
{
font-size:0.8em;
text-decoration:none;
}

#connexion a:hover
{
text-decoration:underline;
}

#nav {
	/*background-repeat:repeat-y;*/
	/*background-repeat:repeat-x;*/
	height:36px;
	background-repeat:no-repeat;
}
/*police fonctionnelle : sylfaen*/
#nav ul {
	list-style-type:none;
	width:505px; /* 101px par bloc <li> */
	margin:auto;
	font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
}
#nav ul li {
	float:left; /*pour IE*/
	padding-right:20px;
	/*background-repeat:no-repeat;*/
}
#nav ul li a {
	display:block;
	float:left;
	width:81px;
	line-height:36px; /*hauteur de l'image de fond*/
	background-repeat:no-repeat;
	text-decoration:none;
	text-align:center;
	/*font-weight:bold;*/
}
#nav ul li a:hover {
	background-repeat:no-repeat;
}

#nav ul li .active {
	background-repeat:no-repeat;
}

#nav ul li .active:hover {
	background-repeat:no-repeat;
}

#nav .bloc_couleur
{
	height:26px;
	float:right;
	margin-top:10px;
	padding-right:10px;
}

#container {
	width:920px;
	min-height:500px;
	height:auto !important;
 	height:500px;
	padding:20px 40px;
	padding-bottom : 20px;
}

#container h1 {
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
/* text-transform: uppercase; */

margin-bottom:20px;
}

#container h2, h3, h4 {
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
/* text-transform: uppercase; */
margin-bottom:20px;
}


#container ul, ol
{
padding-left:60px;
padding-bottom:20px;
padding-top:10px;
text-align:justify;
}

#container li
{
padding-bottom:10px;
}

#container p {
text-align:justify;
padding-bottom:20px;
}

#container table
{
border-collapse: collapse;
width: 100%;
font-size:12px;
}

#container table th
{
font-family:Georgia, "Times New Roman", Times, serif;
padding: 5px;
}

#container table td
{
font-family: sans-serif;
padding: 5px;
text-align: center;
}

#container img
{
border:0;
/* padding-bottom:20px; */ /* trouver une autre methode pour espacer les images dans les tutos */
}


#footer {
	width:1000px;
	height:22px;
	clear:both;
	margin-top:50px;
	text-align:center;
}

#apres_footer {
	width:1000px;
	height:50px;
	text-align:center;
	margin-top:10px;
}

#apres_footer .bloc
{
width:142px; /* en fct du nbr de blocs */
float:left;
font-size : 0.8em;
}

#accueil2
{
width:100%;
height:60px;
background-repeat:repeat-x;
margin-top:30px;
}

#accueil_centre {
	width:420px;
	margin:auto;
	font-size:0.9em;
	padding-top:10px;
}

#accueil_centre h1 {
	font-size:2em;
	font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-align:center;
}

#accueil_centre h2 {
	font-size:1.4em;
	font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
	text-align:center;
	font-weight:normal;
	padding-top:5px;
}

.barre {
	height:10px;
	margin-top:30px;  /* avant 60px */
	padding:0;
}

/*****************************************************************
BLOCS ACCUEIL
*****************************************************************/
.infobox_sondage {
	height:auto;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	width:500px;
	margin:auto;
	margin-bottom:20px;
}

.infobox {
	height : 270px;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	width:300px;
	margin-top:30px;
	margin-left:100px;
	float:left;
	margin-bottom:20px;
}
.infobox h3, .infobox_sondage h3 {
	font-size:16px;
	text-align:center;
	height:20px;
	margin:0;
	padding:5px 20px;
	border-top-left-radius:7px;
	border-top-right-radius:7px;
	-moz-border-radius-topleft:7px;
	-moz-border-radius-topright:7px;
	-webkit-border-top-left-radius:7px;
	-webkit-border-top-right-radius:7px;/*border:none;*/
}
.infobox .content, .infobox_sondage .content {
	text-align:justify;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:10px;
	padding-right:10px;
	font-size:0.8em;
}
.infobox img, .infobox_sondage img {
	padding-top:10px;
	vertical-align:middle;
	padding-right:5px;
}


/*****************************************************************
BLOC TUTORIEL
*****************************************************************/
#infoboxtutos {
	height:auto;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	width:850px;
	margin:auto;
	padding:10px;
	margin-bottom:20px;
}

#infoboxtutos .allinfoboxtutos
{
height:30px;
}
#infoboxtutos .libelle
{
text-align:right;
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
float:left;
width:130px;
padding-right:10px;
line-height:30px;
font-size:0.8em;
}
#infoboxtutos .contenu
{
float:left;
text-align:justify;
text-decoration:none; 
line-height:30px;
width:690px;
font-size:0.95em;
}

/*****************************************************************
MENU DE NAVIGATION DANS LES TUTORIELS
*****************************************************************/
#nav_tutoriel
{
text-align:center;
width:100%;
height:20px;
line-height:20px;
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:1.0em;
margin-bottom:20px;
}

/*****************************************************************
FORMULAIRE INSCRIPTION
*****************************************************************/
fieldset
{
padding:20px 10px;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
margin:auto;
width:500px;

}

fieldset .all_ligne
{
width:500px;
padding-bottom:10px;
height:20px;

}

fieldset .all_ligne label
{
text-align:right;
float:left;
width:140px;
padding-right:10px;
line-height:20px;
font-size:0.8em;
font-weight:bold;
}

/*, fieldset .all_ligne textarea  */
fieldset .all_ligne input[type=text], fieldset .all_ligne input[type=password], select
{
float:left;
width:160px;
}

fieldset .all_ligne #pseudo_box, #mdp_box, #mdp_confirm_box, #email_box, #rep_box, #nom_box, #categorie_box, #sous_categorie_box, #text_box, #age_box, #siteweb_box, #des_box, #apercu_box, #win_box, #linux_box, #mac_box, #photo_box
{
padding-left:10px;
width:170px;
float:left;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:0.7em;
line-height:20px;
}

.erreur_textarea
{
}

/*****************************************************************
GESTION DES BOUTONS ET CHAMPS FORMULAIRE
*****************************************************************/
input[type=button], input[type=submit] {
	cursor:pointer;
	background-repeat : no-repeat;
	background-position:center;
	width : 75px;
	height : 25px;
	border:0;
	margin-top : 10px;
	margin-bottom: 10px;
}



input[type=button]:hover, input[type=submit]:hover {
	background-repeat : no-repeat;
	width : 75px;
	height : 25px;
	border:0;
	margin-top : 10px;
}

input[type=text]:focus, select:focus, textarea:focus
{
}

input[readonly]
{
}

.password:focus
{
}

/*****************************************************************
CLASSES POUR L'EDITION DE PROFIL
*****************************************************************/

#infosProfil
{
	width:70%;
	margin:auto;
}

/*
#avatar
{
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	width:170px;
	height:170px;
	float : left;
	margin-right:50px;
	margin-left:70px;
	text-align:center;
	padding:10px;
	padding-top : -85px;
	
}*/

#avatar
{
	float : left;
	margin-right:50px;
	margin-left:70px;
}

#avatar img
{
margin:0;
padding:0;
}

#infosProfil ul
{
padding:0;
margin:0;
}

/*****************************************************************
CLASSES GENERALES (Utilisables partout dans le code)
*****************************************************************/

.theoreme
{
font-weight:bold;
text-decoration:underline;
}

.lemme
{
text-decoration:underline;
}

.definition
{
font-style:italic;
text-decoration:underline;
}

.attention_info
{
padding:1.2em 1em 1.2em 3em;
background-image:url(../images/icones/warning.png);
background-position:1em 50%;
background-repeat: no-repeat;
margin-bottom:1em;
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:1em;
}
	
.message_info
{
padding:1.2em 1em 1.2em 3em;
background-image:url(../images/icones/info.png);
background-position:1em 50%;
background-repeat: no-repeat;
margin-bottom:1em;
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:1em;
}

.commande {
padding:1em;
font-weight:bold;
margin-bottom:1em;
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:0.9em;
}

.motcle
{
text-decoration:underline;
}

.keyword
{
}
.left
{
text-align:left;
}
.remarque
{
font-weight:bold;
text-decoration:underline;
}

.instruction
{
font-weight:bold;
font-style:italic;
}

.nb
{
background-position:2em 10px;
background-repeat: no-repeat;
padding:8px;
padding-left:4.5em;
padding-right:2em;
text-align:justify;
background-image:url(images/autre/info.png);
height:30px;
}

.petit
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:0.8em;
}

.error
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:0.9em;
}

.ok
{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:0.9em;
}

.niveau1
{
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:1.0em;
font-weight:bold;
}

.niveau2
{
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
font-size:0.9em;
font-weight:normal;
}

.image
{
text-align:center;
padding:20px 0px;
}

.img_over {
	cursor:pointer;
}
.img_out {
	padding:1px;
}

.img_tuto
{
margin-bottom:20px;
text-align:center;
}

.img_span img
{
vertical-align:middle;
}


.gauche {float:left;}
.droite {float:right;}

.titre_image
{
font-size:0.8em;
font-style:italic;
text-align:center;
margin-top:-20px;
padding-bottom:10px;
}

.video_padding
{
padding-bottom:20px;
}

blockquote
{
	font-family:Georgia,"Times New Roman",Times,serif;
	font-style:italic;
	background:url(../images/icones/right-quote.gif) no-repeat right bottom; /* On applique l'image des guillemets fermants à la balise blockquote */
	text-indent:-25px; /* On indente la première ligne de 25px vers la gauche, pour annuler l'effet du padding-left:25px appliqué à la première lettre */
	padding-right:25px; /* Pour laisser la place au guillemet fermant */
	padding-left:25px; /* Pour équilibrer padding-right:25px; */
	margin-top:20px;
	margin-bottom:20px;
	text-align:justify;
}
    
blockquote:first-letter
{
	background:url(../images/icones/left-quote.gif) no-repeat left top;
	padding-left:25px; /* Pour laisser la place au guillemet ouvrant */
	font-size:1.4em; /* Pour que la première lettre apparaisse plus grande */
}

.bookmark
{
width:50%;
height:70px;
margin:20px;
padding:10px;
}

.bookmark:hover
{
}

.ligne
{
width:100%;
}

.ligne:hover
{
}

legend
{
width:50%;
height:20px;
margin-left:20px;
text-align:center;
font-weight:bold;
font-family:Geneva, Arial, Helvetica, sans-serif;
}

/*****************************************************************
CLASSES POUR LE LIVRE DOR
*****************************************************************/
.message_livredor
{
width:50%;
height:auto;
background-repeat:repeat-x;
margin:auto;
padding:10px;
}

.message_livredor:hover
{
}

.en_tete_livredor
{
height:50px;
line-height:40px;
}

.pied_livredor
{
height:30px;
line-height:30px;
}

.contenu_msg
{
padding:10px 0;
text-align:justify;
}

.zone_gauche
{
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
float:left;
width:70%;
font-weight:bold;
}

.zone_droite
{
font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;
float:right;
}

.separation
{
width:50%;
margin:10px auto;
}

/*****************************************************************
CLASSES POUR LES BLOCS DES TUTOS
*****************************************************************/
.bloc_tuto
{
width:595px;
height:64px;
background-repeat:no-repeat;
padding-left:10px;
padding-right:10px;
padding-top:13px;
padding-bottom:27px;
margin-left:40px;
margin-bottom:10px;
}

.bloc_tuto:hover
{
background-repeat:no-repeat;
}

.bloc_tuto_image
{
width:64px;
height:64px;
float:left;
margin-right:20px;
}

.bloc_tuto_content
{
width:509px;
float:left;
font-size:0.9em;
}

.bloc_tuto_content a
{
font-size:0.95em;
font-weight:bold;
}

.bloc_tuto_content a:hover
{
}

/*****************************************************************
CLASSES POUR LES BLOCS CATEGORIE ET SOUS CATEGORIE
*****************************************************************/
#list
{
margin:0 auto;
width:730px;
}

#list .elem
{
background-repeat:no-repeat;
width:320px;
height:110px;
display:block;
margin-bottom:20px;
padding:10px;	
}

#list .elem:hover
{
background-repeat:no-repeat;
}


#list .elem h2
{
font-size:1em;
font-weight:bold;
background:none;
padding:0;
margin:0 0 10px 0;
border:none;
width:68%;
height:25px;
float:left;
}

#list .elem .image_cat
{
width:64px;
height:64px;
float:left;
clear:both;
}

#list .elem .description_cat
{
float:right;
width:236px;
height:66px;
padding-left:10px;
padding-right:5px;
text-align:justify;
}

#list .elem .nb_tuto
{
width:30%;
height:25px;
float:right;
font-size:0.9em;
line-height:25px;
font-weight:bold;
font-size:0.8em;
font-family:Georgia, "Times New Roman", Times, serif;
text-align:right;
padding-right:2%;
}

#list .elem a:hover
{
}

/*****************************************************************
CLASSES POUR LES BLOCS CATEGORIE ET SOUS CATEGORIE (obsolete)
*****************************************************************/
#listAccueil
{
margin:0 auto;
width:730px;
}

#listAccueil .elem
{
background-repeat:no-repeat;
width:320px;
height:110px;
display:block;
margin-bottom:20px;
padding:10px;	
}

#listAccueil .elem:hover
{
background-repeat:no-repeat;
}


#listAccueil .elem h2
{
font-size:1em;
font-weight:bold;
background:none;
padding:0;
margin:0 0 10px 0;
border:none;
width:70%;
height:25px;
float:left;
}

#listAccueil .elem .image_cat
{
width:64px;
height:64px;
float:left;
clear:both;
}

#listAccueil .elem .description_cat
{
float:right;
width:239px;
height:66px;
padding-left:10px;
padding-right:5px;
text-align:justify;
}

#listAccueil .elem .nb_tuto
{
width:28%;
height:25px;
float:right;
font-size:0.9em;
line-height:25px;
font-weight:bold;
font-family:Georgia, "Times New Roman", Times, serif;
text-align:right;
padding-right:2%;
}

#listAccueil .elem a:hover
{
}

/*****************************************************************
CLASSES POUR LES BLOCS VOIR PROFIL
*****************************************************************/
#zoneGauche
{
	float : left;
	width : 173px;
}

#zoneDroite
{
	float : right;
	width : 173px;
}

.boutonProfilGauche, .boutonProfilDroit
{
	text-align : center;
	margin-bottom : 20px;
}

.boutonProfilGauche a, .boutonProfilDroit a, .boutonProfilGauche a:hover, .boutonProfilDroit a:hover, .boutonProfilGauche a:visited, .boutonProfilDroit a:visited
{
	display : block;
	width : 173px;
	line-height : 64px;
	font-family:Georgia, "Times New Roman", Times, serif;
	color:white;
	text-decoration : none;
}

#all_bloc_profil {
	/*width:100%;*/
	height:auto;
	
}
.bloc_profil {
	width:50%;
	height:auto;
	/*float:left;*/
	margin-bottom:10px;
}
#bloc_profil_bas {
	/*width:100%;*/
	height:auto;
}
.infoProfilbox {
	height:auto;

	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	margin-left:10px;
	margin-right:10px;
	margin-bottom:20px;
	
}
.infoProfilbox h3 {
	font-size:16px;
	text-align:center;
	margin:0;
	padding:5px 20px;
	border-top-left-radius:7px;
	border-top-right-radius:7px;
	-moz-border-radius-topleft:7px;
	-moz-border-radius-topright:7px;
	-webkit-border-top-left-radius:7px;
	-webkit-border-top-right-radius:7px;
}
.infoProfilbox .content {
	text-align:justify;
	padding-top:20px;
	padding-left:10px;
	padding-right:10px;
	font-size:0.8em;
}


/*****************************************************************
CLASSES POUR LES BOUTONS DU PANNEAU D'ADMIN
*****************************************************************/
#bouton ul.text, ol.text {
	padding-left: 40px;
	margin: 10px 0;
}
#bouton ul.text li { list-style-type: square; }
#bouton ul.text ul.text li { list-style-type: disc; }
#bouton ol.text li { list-style-type: decimal; }
#bouton ol.text ol.text li { list-style-type: lower-alpha; }

#bouton ul.button-link-list {
	padding: 0 5px;
	margin: 5px 0;
	list-style: none;
	float: left;
}
#bouton ul.button-link-list li { float: left; }
#bouton ul.button-link-list li a {
	float: left;
	padding-right: 15px;
	margin-right: 10px;
	margin-bottom: 10px;
	line-height: 60px;
	text-decoration: none;
	color: #ddd;
	font: 900 14px "Lucida Grande", "Lucida Sans", Helvetica, Arial, sans-serif;
	text-align: center;
	background: url("/images/button_gray.png") no-repeat top right;
}
#bouton ul.button-link-list li a span, ul.button-link-list li a img {
	display: inline-block;
	line-height: 110%;
	vertical-align: middle;
	cursor: pointer;
}
#bouton ul.button-link-list li a img { border-width: 0; }
#bouton ul.button-link-list li a img.left { margin-right: 5px; }
#bouton ul.button-link-list li a img.right { margin-left: 5px; }
#bouton ul.button-link-list li a span.left {
	padding-right: 15px;
	height: 64px;
	background: url("/images/button_gray.png") no-repeat top left;
	
}
#bouton ul.button-link-list li a span.text {
	min-width: 80px;
	
	width: auto !important;
	width: 80px;
}
#bouton ul.button-link-list li a:hover, ul.button-link-list li a:active {
	color: #fff;
	background-image: url("/images/button_blue.png");
}
#bouton ul.button-link-list li a:hover span.left, ul.button-link-list li a:active span.left {
	background-image: url("/images/button_blue.png");
}


#barre_actuelle
{
background-image:url(../images/barre.png);

width:751px;
height:26px;
margin:auto;
}