/* ------------------------------------------------------------------------------------
CSS MEDIA SCREEN : main.css
CLIENT : La Référence musicale
AUTEUR : Aspix Média
DATE : MAI 2009
MODIFICATION : CT
----------------------------------------------------------------------------------- */

* {
	margin:0;
}
body {
	background:#ffffff url(../images/bg_body.jpg) repeat;
	color:#333333;
	font-family:Arial, Helvetica, sans-serif;
}
html, body, form {
	height:100%;
}
img {
    border:none;
}
.clear {
    clear:both;
}
#conteneur {
	margin:0 auto;
    width:980px;
}
#header {
	background:transparent url(../images/bg_header.png) repeat-x;
	height:71px;
}
.bgHeaderFlash {
	background:transparent url(../images/bg_flash-entete.jpg) no-repeat bottom;
	height:71px;
}
.bgHeaderNoFlash {
	height:71px;
}
#header #menu {
	margin:0 auto;
	text-align:right;
	width:980px;
}
#header #menu img {
	margin-top:25px;
}
#header #menu ul {
	margin:0;
    padding:0;
}
#header #menu li {
	display:inline;
	list-style-type:none;
	margin:0 0 0 15px;
}
.print {
    display:none;
}
.wrapper {
	min-height:100%;
	height:auto !important;
	height:100%;
	margin:0 auto -260px; /* valeur négative du footer */
	position:relative;
	width:980px;
}

/* ---------------------------------------------------------------------------| contenu |*/

#conteneur #gauche {
	width:369px;
	float:left;
}
#conteneur #droit {
	width:609px;
	float:left;
}
#conteneur #droit #texte {
	background-color:#e9e7e1;
	padding:30px;
}
#conteneur #droit h1 {
	font:bold 20px "Arial Black", Arial, sans-serif;
	margin-top:30px;
	text-transform:uppercase;
	text-align:right;
	letter-spacing:-1px;
}
#conteneur #droit h1 a {
    color:#a90115;
	text-decoration:none;
}
#conteneur #droit h1 a:hover {
	border-top:1px dashed #a90115;
	border-bottom:1px dashed #a90115;
}
#conteneur #droit h1 img {
    margin-left:2px;
    vertical-align:middle;
}
#conteneur #droit h1 span {
    font-size:26px;
}
#conteneur #droit #texte h2 {
	font:normal 16px "Arial Black", Arial, sans-serif;
	margin-top:20px;
}
#conteneur #droit #texte p, #conteneur #droit #texte ol {
	font-size:12px;
	line-height:18px;
}
*+html #conteneur #droit #texte ol { /* IE7 */
    margin-left:50px;
}
#conteneur #droit #texte ol {
    margin-left:10px;
}
#conteneur #droit #texte p.margin {
	margin-top:15px;
}
#conteneur #droit #texte p.retraitCentre {
	margin:15px 60px;
	color:#6f0900;
	font-weight:bold;
	font-style:italic;
	font-size:16px;
    text-align:center;
}
#conteneur #droit #texte p.adresse span {
	font-size:16px;
	font-weight:bold;
}
.coordonnees {
    float:left;
    width:50%;
}
.produits {
    background-color:#e9e7e1;
    padding:4px;
}

/* ---------------------------------------------------------------------------| accueil: nouvelles/promotions |*/

#conteneur #nouvelles {
  background:transparent url(../images/bg_nouvelles_fr.png) no-repeat;
	float:left;
	height:197px;
	overflow:hidden;
	padding:55px 20px 30px;
	width:435px;
}
#conteneur #nouvelles h3 {
  font-size:18px;
	margin-top:10px;
}
#conteneur #nouvelles p {
	font-size:14px;
}
.intro {
  background:transparent url(../images/bg_intro.png) no-repeat;
  clear:both;
	font-size:12px;
  font-weight:bold;
  height:260px;
  padding:15px;
}
.intro a {
  color:#333333;
  text-decoration:none;
}
.intro a:hover {
  color:#505050;
  border-bottom:1px dotted #505050;
  text-decoration:none;
}
/* ---------------------------------------------------------------------------- */
/* --| BACKGROUND PAGES |------------------------------------------------------ */
/* ---------------------------------------------------------------------------- */

.bgProduits {background:transparent url(../images/bg_page-produits.gif) no-repeat 20px 100px;}
.bgBatterie {background:transparent url(../images/bg_page-batterie.gif) no-repeat 20px 110px;}
.bgGuitareClassique {background:transparent url(../images/bg_page-guitare-classique.gif) no-repeat 10px 120px;}
.bgGuitareAcoustique {background:transparent url(../images/bg_page-guitare-acoustique.gif) no-repeat 10px 100px;}
.bgGuitareElectrique {background:transparent url(../images/bg_page-guitare-electrique.gif) no-repeat 10px 150px;}
.bgBasse {background:transparent url(../images/bg_page-basse.gif) no-repeat 60px 20px;}
.bgAmpli {background:transparent url(../images/bg_page-ampli.gif) no-repeat 10px 100px;}
.bgAccGB {background:transparent url(../images/bg_page-accGB.gif) no-repeat 50px 100px;}
.bgClavier {background:transparent url(../images/bg_page-clavier.gif) no-repeat 30px 120px;}
.bgSonorisation {background:transparent url(../images/bg_page-sonorisation.gif) no-repeat 0 130px;}
.bgPercussion {background:transparent url(../images/bg_page-percussion.gif) no-repeat 20px 130px;}
.bgCours {background:transparent url(../images/bg_page-cours.gif) no-repeat 0 170px;}
.bgServices {background:transparent url(../images/bg_page-services.gif) no-repeat 0 165px;}
.bgProfil {background:transparent url(../images/bg_page-profil.gif) no-repeat 0 150px;}
.bgContact {background:transparent url(../images/bg_page-contact.gif) no-repeat 20px 150px;}

/* ---------------------------------------------------------------------------- */
/* --| FOOTER |---------------------------------------------------------------- */
/* ---------------------------------------------------------------------------- */

#footer {
    background:transparent url(../images/bg_footer.png) repeat-x;
	position: relative;
	margin: 0 auto;
}
#footer, .push {
	height:260px;
}
#footer #footerContenu {
	margin:0 auto;
	width:980px;
}
#footer #footerContenu .liste, #footer #footerContenu .localisation {
	float:left;
	margin:50px 0 0 0;
	width:245px;
}
#footer #footerContenu .referer {
	float:left;
	margin:0;
	width:220px;
}
#footer #footerContenu .liste h1, #footer #footerContenu .localisation h1 {
	color:#bb0018;
	font-size:12px;
	margin-bottom:10px;
}
#footer #footerContenu .liste ul {
	margin:0;
	padding-left:10px;
}
#footer #footerContenu .liste li {
	font-size:11px;
	font-weight:bold;
	list-style-type:none;
}
#footer #footerContenu .localisation p {
	color:#b9b19d;
	font-size:11px;
	font-weight:bold;
	letter-spacing:1px;
	line-height:16px;
	margin-bottom:10px;
}
#footer #footerContenu .localisation img {
	float:left;
	margin:0 5px 20px 0;
}
#footer #footerContenu .copyright {
	clear:both;
	color:#b9b19d;
	font-size:11px;
	font-weight:bold;
	height:40px;
}
#footer #footerContenu .copyright p.droit {
	float:left;
	margin-top:20px;
	text-align:right;
	width:670px;
}
#footer #footerContenu .copyright p.gauche {
	float:left;
	margin-top:20px;
	width:300px;
}
#footer #footerContenu .liste li a, #footer #footerContenu .copyright p.droit a {
	color:#b9b19d;
	text-decoration:none;
}
#footer #footerContenu .liste li a:hover {
	color:#eee9db;
}

/* ---------------------------------------------------------------------------- */
/* --| ACCORDION (AJAX) |------------------------------------------------------ */
/* ---------------------------------------------------------------------------- */

.bgAccordion {
	background-color:#504a3d;
	border-top:#504a3d 5px solid;
	border-bottom:#504a3d 5px solid;
	width:613px;
}
.accordionHeader, .accordionHeaderSelected  {
	cursor:pointer;
	height:33px;
    margin:0 0 0 5px;
    padding-top:10px;
	text-align:right;
	width:600px;
}
.accordionHeader {
	background:#504a3d url(../images/bg_accordionHeader.gif) no-repeat;
}
.accordionHeaderSelected {
	background:#504a3d url(../images/bg_accordionHeaderSelected.gif) no-repeat;
}
#conteneur #droit .bgAccordion .accordionHeader h1, #conteneur #droit .bgAccordion .accordionHeaderSelected h1 {
	color:#4b4636;
	font:normal 16px "Arial Black", Arial, sans-serif;
	margin:0 40px 0;
	padding:0;
	text-transform:uppercase;
}
.accordionContent {
    background-color:#ffffff;
    margin:5px 6px;
    width:600px;
}

/* ---------------------------------------------------------------------------- */

.noAccordion, .noAccordion2 {
    background-color:#504a3d;
    padding:3px 6px;
	width:601px;
}
.noAccordionHeader {
    background:#504a3d url(../images/bg_accordionHeader.gif) no-repeat;
}
.noAccordionHeader {
    color:#4b4636;
    font:normal 16px "Arial Black", Arial, sans-serif;
    height:33px;
    margin:0;
    padding:10px 45px 0 0;
    text-align:right;
    text-transform:uppercase;
}
.noAccordion2 div {
    background:#504a3d url(../images/bg_accordionHeader2.gif) no-repeat;
    color:#4b4636;
    font:normal 16px "Arial Black", Arial, sans-serif;
    height:33px;
    margin:5px 0 0;
    padding:10px 45px 0 0;
    text-align:right;
    text-transform:uppercase;
}
.noAccordion2 div a {
    color:#4b4636;
    text-decoration:none;
}

/* ---------------------------------------------------------------------------- */
/* --| PRODUITS |-------------------------------------------------------------- */
/* ---------------------------------------------------------------------------- */

/* -- colonnes -- */
.bgGC2,  .bgGA4, .bgCL1, .bgGE1 {
    font-size:12px;
    height:290px;
    line-height:16px;
	padding:70px 325px 0 15px;
	text-align:justify;
    width:260px;
}

/* -- rangées -- */
.bgBA1, .bgBA2, .bgBA3, .bgBA4, .bgBA5, .bgBA6, .bgBA7, 
.bgGC1, .bgGC3, .bgGC4, 
.bgGA1, .bgGA2, .bgGA3, .bgGA5, .bgGA6, .bgGA7, .bgGA8, 
.bgGE2, .bgGE3, .bgGE4, .bgGE5, .bgGE6, .bgGE7, .bgGE8, .bgGE9, .bgGE10, .bgGE11, 
.bgBS1, .bgBS2, .bgBS3, .bgBS4, .bgBS5, 
.bgCL2 {
    color:#000000;
    font-size:12px;
    height:290px;
    line-height:16px;
    padding:70px 15px 0;
    text-align:justify;
    width:570px;
}

.bgBA1 {background:#ffffff url(../images/bg_produits-ba-accessoires.jpg) no-repeat;}
.bgBA2 {background:#ffffff url(../images/bg_produits-ba-sabian.jpg) no-repeat;}
.bgBA3 {background:#ffffff url(../images/bg_produits-ba-pearl.jpg) no-repeat;}
.bgBA4 {background:#ffffff url(../images/bg_produits-ba-roland.jpg) no-repeat;}
.bgBA5 {background:#ffffff url(../images/bg_produits-ba-sonor.jpg) no-repeat;}
.bgBA6 {background:#ffffff url(../images/bg_produits-ba-tama.jpg) no-repeat;}
.bgBA7 {background:#ffffff url(../images/bg_produits-ba-westbury.jpg) no-repeat;}
.bgGC1 {background:#ffffff url(../images/bg_produits-gc-fender.jpg) no-repeat;height:130px;}
.bgGC2 {background:#ffffff url(../images/bg_produits-gc-guild.jpg) no-repeat;padding-top:100px;height:260px;}
.bgGC3 {background:#ffffff url(../images/bg_produits-gc-lapatrie.jpg) no-repeat;}
.bgGC4 {background:#ffffff url(../images/bg_produits-gc-walden.jpg) no-repeat;}
.bgGA1 {background:#ffffff url(../images/bg_produits-ga-crafter.jpg) no-repeat;}
.bgGA2 {background:#ffffff url(../images/bg_produits-ga-fender.jpg) no-repeat;height:150px;}
.bgGA3 {background:#ffffff url(../images/bg_produits-ga-godin.jpg) no-repeat;height:150px;}
.bgGA4 {background:#ffffff url(../images/bg_produits-ga-guild.jpg) no-repeat;padding-top:100px;height:200px;}
.bgGA5 {background:#ffffff url(../images/bg_produits-ga-ibanez.jpg) no-repeat;height:150px;}
.bgGA6 {background:#ffffff url(../images/bg_produits-ga-jayturser.jpg) no-repeat;height:150px;}
.bgGA7 {background:#ffffff url(../images/bg_produits-ga-norman.jpg) no-repeat;}
.bgGA8 {background:#ffffff url(../images/bg_produits-ga-walden.jpg) no-repeat;}
.bgGE1 {background:#ffffff url(../images/bg_produits-ge-bcrich.jpg) no-repeat;}
.bgGE2 {background:#ffffff url(../images/bg_produits-ge-fender.jpg) no-repeat;}
.bgGE3 {background:#ffffff url(../images/bg_produits-ge-godin.jpg) no-repeat;}
.bgGE4 {background:#ffffff url(../images/bg_produits-ge-gretch.jpg) no-repeat;}
.bgGE5 {background:#ffffff url(../images/bg_produits-ge-hagstrom.jpg) no-repeat;}
.bgGE6 {background:#ffffff url(../images/bg_produits-ge-ibanez.jpg) no-repeat;}
.bgGE7 {background:#ffffff url(../images/bg_produits-ge-jackson.jpg) no-repeat;}
.bgGE8 {background:#ffffff url(../images/bg_produits-ge-jayturser.jpg) no-repeat;}
.bgGE9 {background:#ffffff url(../images/bg_produits-ge-kustom.jpg) no-repeat;}
.bgGE10 {background:#ffffff url(../images/bg_produits-ge-samick.jpg) no-repeat;}
.bgGE11 {background:#ffffff url(../images/bg_produits-ge-squier.jpg) no-repeat;}
.bgBS1 {background:#ffffff url(../images/bg_produits-bs-fender.jpg) no-repeat;}
.bgBS2 {background:#ffffff url(../images/bg_produits-bs-godin.jpg) no-repeat;}
.bgBS3 {background:#ffffff url(../images/bg_produits-bs-ibanez.jpg) no-repeat;}
.bgBS4 {background:#ffffff url(../images/bg_produits-bs-jayturser.jpg) no-repeat;}
.bgBS5 {background:#ffffff url(../images/bg_produits-bs-squier.jpg) no-repeat;}
.bgCL1 {background:#ffffff url(../images/bg_produits-cl-casio.jpg) no-repeat;height:170px;}
.bgCL2 {background:#ffffff url(../images/bg_produits-cl-roland.jpg) no-repeat;}


/* ---------------------------------------------------------------------------- */
/* -- FORMULAIRES ------------------------------------------------------------- */
/* ---------------------------------------------------------------------------- */

.frm {
	width:600px;
}
.frm p {
	font-size:12px;
	margin:6px 0;
}
.frm p label {
	cursor:pointer;
	float:left;
	font-weight:bold;
	text-align:right;
	width:100px;
}
.frm p input[type="text"], .frm p textarea {
	border: inset 1px #ffffff;
    font:normal 11px Verdana, Helvetica, sans-serif;
	margin-left:12px;
	padding:2px;
}
.frm p textarea {
    font:normal 11px Verdana, Helvetica, sans-serif;
	height:60px;
	padding:2px;
}
.frm p.simple {
	margin-left:110px;
}
.frm p.simple input[type="text"] {
	border:outset 1px #ffffff;
	padding:2px;
}
.msgErreur {
    font-size:12px;
    font-weight:bold;
    padding-bottom:8px;
    color:#cc0000;
}
.yerr {
    color:#cc0000;
}
.frmConfirmation, .frmEchec, .mpEchec {
    font-size:12px;
    margin:50px 0;
	text-align:left;
}
.frmConfirmation span, .mpConfirmation span {
    font-size:14px;
    color:#009900;
    font-weight:bold;
}
.frmEchec span, .mpEchec span {
    font-size:14px;
    color:#cc0000;
    font-weight:bold;
}

/* ---------------------------------------------------------------------------- */
/* --| RÉFÉRER À UN AMI |------------------------------------------------------ */
/* ---------------------------------------------------------------------------- */

.mpBackground {
	background-color:#000000;
	filter:alpha(opacity=80);
	opacity:0.8;
}
.mpRefererConteneur {
    background:#ffffff url('../images/bg_referer_fr.jpg') no-repeat;
    border:1px solid #170e01;
    height:400px;
    width:760px;
}
.mpHeader, .mpReferer, .mpConfirmation, .mpEchec {
    font-weight:normal;
    padding:15px 15px 0 230px;
}
.mpHeader h1 {
	font:bold 18px "Arial Black", Arial, sans-serif;
	letter-spacing:-1px;
	margin:0;
	text-transform:uppercase;
}
.mpHeader h2 {
    font-size:12px;
    font-weight:normal;
}
.mpReferer p {
    clear:left;
    font-size:12px;
    margin:0;
    padding:4px 4px 4px 165px;
    width:330px;
}
.mpConfirmation p, .mpEchec p {
    font-size:12px;
    margin:30px 0;
	text-align:left;
}
.mpReferer p.obligatoire {
    border-bottom:1px dotted #333333;
    font-size:9px;
    margin:10px 0 0;
    text-align:right;
}
.mpReferer .msgErreur {
    color:#cc0000;
    font-size:11px;
    margin:5px 20px 0 0;
    text-align:right;
}
.mpReferer label {
    float:left;
    font-weight:bold;
    margin-left:-165px;
    text-align:right;
    width:155px;
}
.mpReferer input[type="text"] {
    font:normal 11px Verdana, Helvetica, sans-serif;
    width:320px;
}
.mpReferer input[type="submit"].envoyer, .mpConfirmation input[type="submit"].fermer {
	color:#a90115;
	font-size:10px;
	font-weight:bold;
    text-transform:uppercase;
}
.mpReferer .boutons input[type="submit"].annuler {
	color:#666666;
	font-size:10px;
	font-weight:bold;
    text-transform:uppercase;
}
.mpReferer .boutons {
    margin-left:165px;
}