/* CSS Document  GRAVITY STYLE*/

/**********************************STYLE CSS GRAVITY********************************************/

/* --- CODAGE DE BASE PERMETTANT DE METTRE LES MARGES À ZÉRO --- */ 
* 
{
 padding:0;
 margin:0;
 outline:none;
}

/* --- STYLES DE BASE --- */ 
 
/* Page */ 
html { 
  font-size: 100%; /* Évite un bug d'IE 6-7*/ 
}

/* Titres */ 
h1, h2, h3, h4, h5, h6 { 
  line-height: 1.2; 
  font-weight: normal; /* Valeur par défaut. */ 
  font-style: normal; 
} 
h1 { 
  font-size: 1.75em; 
} 
h2 { 
  font-size: 1.5em; 
} 
h3 { 
  font-size: 1.25em; 
} 
h4 { 
  font-size: 1em; 
}  

/* Divers éléments de type en-ligne */ 
em { 
  font-style: italic; 
} 
strong { 
  font-weight: bold; 
}

/* --- STYLES DE BASE SUPPLÉMENTAIRES --- */ 
 
/* Met en évidence les abréviations (ayant un attribut title) */ 
abbr[title] { 
  border-bottom: 1px dotted; 
  cursor: help; 
} 
 
/* Met en évidence les citations */ 
blockquote { 
  margin: .75em 0 .75em 20px; 
  padding: 0 0 0 10px; 
  border-left: solid 2px #ddd; 
} 
q, cite { 
  font-style: italic; 
} 
q cite, q q { 
  font-style: normal 
} 
 
/* Supprime les guillemets automatiques (citations courtes) */ 
q { 
  quotes: none; 
} 
q:before, q:after { 
  content: ""; /* Nécessaire pour Safari/Chrome */ 
} 
 
/* Rapproche les paragraphes dans les listes et citations */ 
blockquote p, li p { 
  margin: .5em 0; 
} 
 
/* Styles de base pour les listes de définition */ 
dl { 
  margin: .75em 0; 
} 
dt { 
  margin: .75em 0 0 0; 
  font-weight: bold; 
} 
dd { 
  margin: .25em 0 .25em 32px; 
} 
 
/* Mise en forme simple pour les tableaux */ 
table { 
  margin: 0; 
  border: none; /* Pas de bordure = "none". */ 
  border-collapse: collapse; /* Valeur par défaut: "separate". */ 
  border-spacing: 0; 
} 
table td, table th { 
  padding: 0; /* Pas de retrait autour du texte = "0". */ 
  border: none; /* Pas de bordure = "none". */ 
  vertical-align: top; /* Valeur par défaut: "middle" */ 
} 
 
/* Conteneurs sémantiques de HTML 5 */ 
article, aside, dialog, figure, footer, header, 
hgroup, menu, nav, section { 
  display: block; 
}

img
{
border:0px;
border:0px!important;
} 


/* --------- STYLE GÉNÉRAL DU BODY DE LA PAGE GRAVITY --------- */ 

html body 
{
background:url(../img/bg_body.jpg) no-repeat top center #000000;
color: #fff;
font-size: 0.80em;
font-family: Arial, Helvetica, sans-serif;
background-color:#000000;
}

a
{
text-decoration:none;
}

a:link
{
color:#FFFFFF;
text-decoration: none;
font-weight:bold;
}

a:visited
{
color:#FFFFFF;
text-decoration: underline;
font-weight:bold;
}

a:hover
{
color:#FFFFFF;
text-decoration: underline;
font-weight:bold;
}

a:active
{
color:#FFFFFF;
text-decoration: underline;
font-weight:bold;
}




/*------------- STYLES GENERAUX DES PAGES GRAVITY -------*/

#global
{
width: 990px;
height:600px;
margin: 0 auto;
padding: 0;
position:relative;
top:30px;
}


#conteneur
{
width:990px;
position:absolute;
top:0px;
left:0px;
/*border:1px solid red;*/
} 

#header
{
width:990px;
height:280px;
/*border:1px solid red;*/
position:relative;
}


#menu
{
width:990px;
padding:0;
position:absolute;
bottom:0px;
left:0;
}

#menu li a span
{
display:none;
}

#menu ul
{
width:990px;
height:51px;
display:block;
list-style-type:none;
text-decoration:none;
margin:0;
padding:0;
clear:both;
}

#menu ul li
{
display:inline;
}

#menu ul li a
{
float:left;
text-decoration:none;
}


#content
{
width:990px;
/*border:1px solid red;*/
background-color:#181818;
padding:0 0 20px 0;
}

#clear
{
clear:both;
visibility:hidden;
}

#col_left
{
width:258px;
float:left;

}

#col_right
{
width:725px;
/*height:400px;*/
float:left;
/*border:1px solid red;*/
}

.content_text
{
width:650px;
padding:28px 0 10px 40px;
text-align:left;
margin:0;
}

h1 span
{
display:none;
}

#footer
{
width:990px;
height:30px;
text-align:left;
margin:0;
padding:0;
/*border:1px solid red;*/
}

#footer ul 
{
width:990px;
height:26px;
display:block;
font-size:0.90em;
color:#CCCCCC;
text-decoration:none;
float:left;
}

#footer  ul li 
{
display:inline;
float:left;
}

#footer  span.display_none
{
display:none;
}

span.jaune
{
font-weight:bold;
color:#e9b230;
}

span.rouge
{
font-weight:bold;
color:#881f20;
}

span.bleu
{
font-weight:bold;
color:#349ffc;
}


/*------------- FIN DES STYLES GENERAUX DES PAGES GRAVITY -------*/


/*--- STYLE HEADER CSS ---*/

#header.header_art
{
background:url(../img/header/header_gravity_art.png) no-repeat top left;
}

#header.header_club
{
background:url(../img/header/header_gravity_club.png) no-repeat top left;
}

#header.header_style
{
background:url(../img/header/header_gravity_style.png) no-repeat top left;
}

#header.header_media
{
background:url(../img/header/header_gravity_media.png) no-repeat top left;
}

#header.header_goodies
{
background:url(../img/header/header_gravity_goodies.png) no-repeat top left;
}


/*--- STYLE MENU CSS ---*/

.sidebar_menu
{
width:258px;
margin:25px 0 0 0;
padding:0;
display:block;
}

.sidebar_menu ul.menu li 
{
display:block;
text-decoration:none;
list-style-type:none;
margin:0;
padding:0;
}

.sidebar_menu ul.menu li a span
{
display:none;
}

.sidebar_menu ul.push 
{
width:258px;
margin:30px 0 0 0;
}

.sidebar_menu ul.push li 
{
display:block;
text-decoration:none;
list-style-type:none;
margin:0;
padding:0;
}

.sidebar_menu ul.push li a 
{
display:block;
text-decoration:none;
list-style-type:none;
margin:-1;
padding:0;
}

.sidebar_menu ul.push li a img 
{
margin:0;
padding:0;
border:0;
}

.sidebar_menu ul.push li a span
{
display:none;
}

/*----- STYLE CSS DE LA COLONNE DE DROITE CONTENANT LES TEXTES -----*/

p.paragraphe_big
{
width:636px;
text-align:justify;
font-size:1em;
padding:20px 0 15px 0;
}

p.paragraphe_small
{
width:636px;
text-align:justify;
font-size:1em;
padding:0 6px 15px 0;
}

/*----- STYLE CSS DES PAGES CONTACT / FORMULAIRE -----*/

.formulaire
{
width:685px;
height:451px;
background:url(../img/content/bg_formulaire_art_contact.png) no-repeat top left;
margin:0;
padding:50px 0 0 0;
}

.formulaire_club
{
width:685px;
height:451px;
background:url(../img/content/bg_formulaire_club_contact.png) no-repeat top left;
margin:0;
padding:50px 0 0 0;
}

.table_formulaire
{
background-color:transparent;
border-color:none;
}

td.info_formulaire
{
width:123px;
height:25px;
padding:0 0 0 10px;
font-size:16px;
color:#e8b12f;
font-family:Arial, Helvetica, sans-serif;
}

td.info_formulaire_club
{
width:123px;
height:25px;
padding:0 0 0 10px;
font-size:16px;
color:#881f20;
font-family:Arial, Helvetica, sans-serif;
}

input.champ_texte
{
float:right;
border:none;
height:27px;
width:302px;
background:url(../img/content/ombre_porte_champ.gif) repeat-x top left;
}

textarea#message
{
float:right;
border:none;
width:302px;
background:url(../img/content/ombre_porte_textearea.gif) repeat-x top left;
}

input.btn_envoyer
{
float:right;
margin:0;
padding:0;
}

/*----- STYLE CSS DES PAGES CONTACT / MAILTO.PHP -----*/

.reponse_formulaire
{
width:685px;
height:451px;
background:url(../img/content/bg_formulaire_mailto.png) no-repeat top left;
background-color:#000000;
margin:0;
padding:0 0 0 0;
color:#ebb134;
font-size:14px;
}


.reponse_formulaire_club
{
width:685px;
height:451px;
background:url(../img/content/bg_formulaire_club_mailto.png) no-repeat top left;
background-color:#000000;
margin:0;
padding:0 0 0 0;
color:#ebb134;
font-size:14px;
}


/*----- STYLE CSS DES PAGES MEDIA PHOTO, VIDEO, TUTOS / CARROUSEL JQUERY  -----*/

#carrousel_photos
{
width:636px;
/*border:1px solid red;*/
margin:50px 0 0 0;
padding:0;
}

/*----- STYLE CSS DES PAGES WALLPAPERS, SCREENSAVERS, MSN ICONS / SLIDERS JQUERY  -----*/

#goodies
{
width:636px;
/*border:1px solid red;*/
margin:50px 0 0 0;
padding:0;
}

/*----- STYLE CSS DES PAGES BIO / Charles et Malik  -----*/

#bio
{
width:636px;
height:212px;
/*border:1px solid red;*/
margin:0;
padding:0;
}

.display_none
{
display:none;
}


#btn_charles 
{
width:318px;
height:212px;
float:left;
text-decoration:none;
margin:0;
padding:0;
}

#btn_malik 
{
width:318px;
height:212px;
float:left;
text-decoration:none;
margin:0;
padding:0;
}

#btn_link_malik
{
float:right;
padding:0;
margin:10px 11px 0 0;
text-decoration:none;
}

#btn_link_charles
{
float:right;
padding:0;
margin:10px 11px 0 0;
text-decoration:none;
}

/*Pages bio*/

#bio_charles
{
background:url(../img/content/bg_bio_charles.png) no-repeat top left;
background-color:#181818;
width:636px;
/*height:600px;*/
padding:150px 0 0 10px;
}

#bio_malik
{
background:url(../img/content/bg_bio_malik.png) no-repeat top left;
background-color:#181818;
width:636px;
/*height:600px;*/
padding:150px 0 0 10px;
}

#content_bio
{
width:400px;
background-color:#000000;
padding:8px;
margin:0;
opacity: .8; 
	/* For IE 5-7 */
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}

#content_bio p
{
color:#FFFFFF;
font-size:11px;
font-family:Arial, Helvetica, sans-serif;
}
#content_bio h3
{
color:#349FFC;
font-size:14px;
font-family:Arial, Helvetica, sans-serif;
padding:0 0 10px 0;
font-weight:bold;
}