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

ESPACE PERCUSSION Styles

version :	15/12/2007
author :	laurent lelion
email :		web.leo.creation@free.fr

gris : #aea6a6;
orange : #ff6800;

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

* {margin:0px; padding:0px}

body { font-family:"Lucida Grande", Arial, Helvetica, Georgia, sans-serif; font-size:62%; color:#000; text-align:center; background:#e4e4e4 url(../images/globalBG.jpg) top left repeat-x; background-attachment: fixed;}

.breaker {clear:both; overflow:hidden; height:0px}
acronym {border-bottom:1px dotted #000; cursor: help}

/* Hack FF bordure pointille */
a {outline: none;}
:focus{-moz-outline-style: none;}

a {text-decoration:none; color:#000}
a:hover {text-decoration:underline}
img {border:none}

#global {width:815px; margin:10px auto 10px auto; text-align:left}
#global .mainTop {width:815px; height:15px; background:url(../images/mainTop.png) no-repeat; overflow:hidden}
* html #global .mainTop {background-image:url(no-image); filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='http://www.espace-percussion.fr/ross-asaret-majestic-jupiter/images/mainTop.png'); background-repeat: no-repeat;}	/* IE 6*/

#global .mainMiddle {width:815px; background:url(../images/mainMiddle.png) repeat-y; }
* html #global .mainMiddle {background-image:url(no-image); filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='http://www.espace-percussion.fr/ross-asaret-majestic-jupiter/images/mainMiddle.png'); background-repeat: repeat-y}	/* IE 6*/

#global .mainBottom {width:815px; height:17px; background:url(../images/mainBottom.png) no-repeat; overflow:hidden}
* html #global .mainBottom {background-image:url(no-image); filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='http://www.espace-percussion.fr/ross-asaret-majestic-jupiter/images/mainBottom.png'); background-repeat: no-repeat;}	/* IE 6*/

/* -- HEADER -- */
#header {height:60px; }
#header .content {position:absolute; margin:-10px 0 0 20px; width:790px; /*height:134px;*/ overflow:hidden}
* html #header .content {}	/* IE 6*/

#header .content h1 {text-indent:-999em; font-size:1.0em}
#header .logo {float:left;}
#header .logo img {border:none}


/* -- CONTENT -- */
#mainContent {padding:12px 0 0 35px}

#innerContent {margin:12px 0 0 13px}
#innerContent .innerTop {width:713px; height:10px; background:url(../images/innerTop.gif) no-repeat; overflow:hidden}
#innerContent .innerMiddle {width:713px; background:url(../images/innerMiddle.gif) repeat-y;  overflow:hidden}
#innerContent .innerMiddle .content {}
#innerContent .innerMiddle .content h3.titreRubrique {margin:10px 0 10px 30px; color:#e64415; font-size:2.0em; font-weight:normal; font-family:Tahoma, Arial, Helvetica, Georgia, sans-serif;}
#innerContent .innerMiddle .content p {font-size:1.1em; text-align:justify}
#innerContent .innerMiddle .content p strong {font-size:1.2em}
#innerContent .innerMiddle .content p a {text-decoration:underline}
#innerContent .innerMiddle .content p a:hover {text-decoration:none}
#innerContent .innerMiddle .content p.col_1 {float:left; width:200px; padding:0 25px 0 30px}
#innerContent .innerMiddle .content p.col_2 {float:left; width:200px; padding-right:25px}
#innerContent .innerMiddle .content p.col_3 {float:left; width:200px; }
#innerContent .innerBottom {width:713px; height:10px; background:url(../images/innerBottom.gif) no-repeat; overflow:hidden}


#leftNav {float:left; padding:15px 0 0 13px}
.customSpacer {margin-top:70px}
#leftNav .navTop {width:156px; height:16px; background:url(../images/innerLeftTop.gif) no-repeat; overflow:hidden}
#leftNav .navMiddle {width:156px; background:url(../images/innerLeftMiddle.gif) repeat-y;  overflow:hidden}
#leftNav .navMiddle ul {}
#leftNav .navMiddle ul li {list-style:none; }
#leftNav .navMiddle ul li a {margin:2px 0 3px 14px; text-indent: -999em; display:block;}
#leftNav .navMiddle ul li a.majestic {width:124px; height:41px; background:url(../images/majestic.gif) no-repeat;}
#leftNav .navMiddle ul li a.ross {width:124px; height:45px; background:url(../images/ross.gif) no-repeat;} 
#leftNav .navMiddle ul li a.jupiter {width:124px; height:42px; background:url(../images/jupiter.gif) no-repeat;} 
#leftNav .navMiddle ul li a.asaret {width:124px; height:45px; background:url(../images/asaret.gif) no-repeat;} 
#leftNav .navBottom {width:156px; height:16px; background:url(../images/innerLeftBottom.gif) no-repeat; overflow:hidden}

#diaporama {float:left; padding:13px 0 0 50px}

#instrumentsList {padding:10px 0 10px 0;}
#instrumentsList h2 {text-indent:-999em; padding:0px 0 0px 0; font-size:1.0em}

#instrumentsList h2.marimbas {width:324px; height:120px; background:url(../images/instruments/marimbas.gif) no-repeat; }
#instrumentsList h2.baguettes {width:304px; height:120px; background:url(../images/instruments/baguettes.gif) no-repeat; }
#instrumentsList h2.caisses-claires {width:403px; height:120px; background:url(../images/instruments/caisse-claire.gif) no-repeat; }
#instrumentsList h2.cloches-tubulaires {width:486px; height:120px; background:url(../images/instruments/Chimes.gif) no-repeat; }
#instrumentsList h2.flight-chaises {width:370px; height:120px; background:url(../images/instruments/etui-flight.gif) no-repeat; }
#instrumentsList h2.glockenspiel {width:396px; height:120px; background:url(../images/instruments/glockenspiels.gif) no-repeat; }
#instrumentsList h2.grosses-caisses {width:407px; height:120px; background:url(../images/instruments/grosses-caisses.gif) no-repeat; }
#instrumentsList h2.housses {width:265px; height:120px; background:url(../images/instruments/housses.gif) no-repeat; }
#instrumentsList h2.instruments-de-marche {width:570px; height:120px; background:url(../images/instruments/instruments-de-marche.gif) no-repeat; }
#instrumentsList h2.petites-percussions {width:472px; height:120px; background:url(../images/instruments/petites-percussions.gif) no-repeat; }
#instrumentsList h2.systeme-ruf {width:375px; height:120px; background:url(../images/instruments/systeme-RUF.gif) no-repeat; }
#instrumentsList h2.timbales {width:285px; height:120px; background:url(../images/instruments/timbales.gif) no-repeat; }
#instrumentsList h2.vibraphones {width:351px; height:120px; background:url(../images/instruments/vibraphones.gif) no-repeat; }
#instrumentsList h2.xylophones {width:338px; height:120px; background:url(../images/instruments/xylophones.gif) no-repeat; }

#instrumentsList .cartoucheInstru {margin:15px 0 0 0;}
#instrumentsList .cartoucheInstru .leftPart {float:left; width:380px; padding:10px 0 0 20px; text-align:left; /*background:lime*/}
#instrumentsList .cartoucheInstru .leftPart h3 {color:#e64415; font-size:1.6em; font-weight:bold; text-transform:uppercase}
#instrumentsList .cartoucheInstru .leftPart h4 {color:#505151; font-size:1.4em; font-weight:normal;  }
#instrumentsList .cartoucheInstru .leftPart h5 {color:#505151;  font-size:1.4em; font-weight:normal; }
#instrumentsList .cartoucheInstru .leftPart h6 {color:#ec7856; font-style:italic; font-size:1.4em; font-weight:normal; }
#instrumentsList .cartoucheInstru .leftPart p.infos {color:#505151; font-size:1.3em; margin:2px 0}
#instrumentsList .cartoucheInstru .leftPart .infosSpec { width:340px}
#instrumentsList .cartoucheInstru .leftPart .infosSpec a.toggleBtn {display:block; padding:4px 0; color:#e64415 }
#instrumentsList .cartoucheInstru .leftPart .infosSpec a:visited.toggleBtn {color:#e64415}
#instrumentsList .cartoucheInstru .leftPart .infosSpec a:hover.toggleBtn {text-decoration:none; color:#505151}
#instrumentsList .cartoucheInstru .leftPart .infosSpec a:active.toggleBtn {border:none}

#instrumentsList .cartoucheInstru .leftPart .infosSpec a.rightAlign {text-align:right}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent {border:1px solid #e64415; padding:5px;}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent ul {text-align:left}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent ul li {list-style:none; clear:both; color:#505151;}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent .specIntitule {display:block; float:left; background:#FAFAFA; width:90px; padding:3px 5px 3px 10px; font-weight:bold; font-size:11px; text-transform:capitalize; margin-bottom:2px}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent .specIntituleBis {display:block; float:left; background:#FAFAFA; width:90px; padding:3px 5px 3px 10px; font-weight:bold; font-size:11px; text-transform:capitalize; margin-bottom:10px}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent .specInfo {display:block; float:left; padding:3px 5px 3px 10px; font-weight:normal; font-size:11px; width:200px}
#instrumentsList .cartoucheInstru .leftPart .infosSpec .toggleContent br {/*display:none; height:0px*/}

#instrumentsList .cartoucheInstru .rightPart {float:left; width:350px; overflow:hidden}
#instrumentsList .cartoucheInstru .rightPart img {}
#instrumentsList .cartoucheInstru .separateur {display:none; margin:10px 0 0 0; width:750px; height:1px; background:url(../images/instruments/separateur.jpg) no-repeat;}

#instrumentsList p.noResult {text-align:center; margin:0 auto; font-size:1.2em;  color:#505151}
#instrumentsList p.noResultBis {text-align:center; margin:0 auto; padding:20px 0 15px 0; font-size:1.2em; color:#505151; font-style:italic}

#instrumentsList .backTop {text-align:center; margin:0 auto; color:#aea6a6}
#instrumentsList .backTop a { padding:0 2px; text-decoration:none; font-size:1.0em; color:#aea6a6}
#instrumentsList .backTop a:hover {text-decoration:underline; color:#e64415;}

/* Liste brochures */
ul#brochures {padding:15px 0 10px 0; width:380px; margin:0 0 0 30px;}
ul#brochures li {list-style:none; line-height:40px; background:url(../images/pinsIcon.gif) no-repeat 0% 50%; font-size:1.2em; padding:0 0 0 50px;}
* html ul#brochures li {zoom:1}	/* IE6 */
ul#brochures li a {display:block; color:#505151; text-decoration:none;}
ul#brochures li a:visited {color:#AEA6A6;}
ul#brochures li a:hover {text-decoration:underline; color:#E64415;}
ul#brochures li a.pdf {background:url(../images/pdfIcon.gif) no-repeat 100% 50%;}

/* -- FOOTER -- */
#footer {text-align:center; margin-top:7px; padding:5px 0px 0px 0; height:16px; overflow:hidden;}
#footer ul {}
#footer li {display:inline; list-style-type:none; /*text-transform:uppercase;*/ font-size:1.0em; color:#aea6a6}
#footer li a {color:#aea6a6; text-decoration:none; padding:0px 3px 0px 3px;}
#footer li a:visited {color:#aea6a6}
#footer li a:hover, #footer li a:active {color:#ff6800; text-decoration:underline}
#footer li.ON a {color:#ff6800; text-decoration:underline;  }	/* Soulignement du lien actif */
#footer li a.copyLeo {/*text-align:left; display:block; float:left; text-indent:-999em; background:url(../images/copy.gif) no-repeat; width:7px; height:7px; padding:0px; text-decoration:none;*/ }

#footer2 {text-align:center;  padding:2px 0px 0px 0; /*height:16px;*/ overflow:hidden; }
#footer2 ul {margin:0px auto; width:450px;}
#footer2 li {display:inline; list-style-type:none; text-transform:capitalize; font-size:1.0em; color:#aea6a6}
#footer2 li a {color:#aea6a6; text-decoration:none; padding:0px 3px 0px 3px;}
#footer2 li a:visited {color:#aea6a6}
#footer2 li a:hover, #footer li a:active {color:#ff6800; text-decoration:underline}
#footer2 li.ON a {color:#ff6800; text-decoration:underline;  }	/* Soulignement du lien actif */

/* ================ LINKS ===========================*/
#web-links {margin:0px; width:170px; height:1px; overflow:hidden; color:#000; font-size:9px; visibility: hidden;}
#web-links ul {margin:0px; padding:0px; list-style-type:none; }
#web-links li {display:inline}
#web-links ul li a:link, #web-links ul li a:visited, #web-links ul li a:hover, #web-links ul li a:active { color:#000; text-decoration:none; font-weight:normal; cursor: default}

/* PHPmV2 */
#phpmv2 {/*display:none*/ height:1px; width:1px; overflow:hidden; color:#FFF}

/* -- CONTACT -- */
#contactBox {float:left; padding:15px 0 0 30px;}
#contactBox p {width:480px; color:#505151;; font-size:11px; margin-bottom:12px}
#contactBox .champ {margin:2px 0; line-height:16px; width:490px; }
#contactBox .champ .intitule {float:left; width:195px; height:16px; color:#505151; font-size:1.2em; padding-left:5px;}
#contactBox .champ label {float:left; width:195px; height:16px; color:#505151; font-size:1.2em; padding-left:3px;}
#contactBox .champ span {color:#ccc; font-size:10px; padding-left:5px; line-height:12px;}
#contactBox .champ input {float:left; width:280px; height:15px;  background:#fff; color:#505151; font-size:1.1em; padding-left:2px}
#contactBox .champ .textBlured {border:1px solid #ccc;}
#contactBox .champ .textFocused {border:1px solid #e64415;}
#contactBox .champ select {float:left; width:234px; height:17px; border:1px solid #ccc; background:#fff; color:#505151; font-size:1.1em; padding-left:2px}
#contactBox .champ input.text-restant {float:right; color:#505151; width:30px; height:15px; border:1px solid #ccc; background:#fff; color:#ccc; font-size:1.1em; padding-left:3px; margin-right:8px}
#contactBox .champ textarea {width:480px; height:200px; background:#fff; color:#505151; font-size:1.2em; margin:5px 0px}
#contactBox .champ .zone-radio {float:left; width:50px; height:16px; margin-top:5px; }
#contactBox .champ .zone-radio input.btn-radio {background:#f2ecef; border:0px; width:10px; margin:0 5px}

#contactBox .champ #log_res {float:left; width:482px; /*height:15px;*/ margin:5px 0 3px 0; }
#contactBox .champ #log_res .error {padding:5px; text-transform:uppercase; font-weight:bold; font-size:1.1em; color: #e64415; border:1px solid #e64415; background:#FFF }
#contactBox .champ #log_res .resultat {padding:5px; text-transform:uppercase; font-weight:bold; border:1px solid #505151; background:#FFF; font-size:1.1em; color:#505151}
#contactBox .champ #log_res .ajax-loading {padding:20px 0; background: url(../images/spinner.gif) no-repeat center; }

#contactBox .champ .zone-chkbox {float:left; width:230px; padding:10px 0 5px 20px; }
#contactBox .champ .zone-chkbox label {float:left; clear:both; width:100px;}
#contactBox .champ .zone-chkbox input.chbox {background:#f2ecef; border:0px; width:11px; margin:0 5px;}
#contactBox .champ .zone-chkbox input.chbox-input {width:229px; height:15px; border:1px solid #868683; background:#fff; color:#000; font-size:1.1em; margin-top:2px}
#contactBox .champ-submit { padding:0 0px 0px 0; width:482px; }
#contactBox .champ-submit .bouton-envoi {float:right; margin:-5px 0px 0 0; display:block; background:url(../images/envoyer_OFF.gif) no-repeat; height:25px; width:100px; cursor:pointer; border:none; text-indent:-500em;}
* html #contactBox .champ-submit .bouton-envoi {margin:0px 0px 0 0; }	/* IE 6 */
#contactBox .champ-submit .bouton-envoi:hover {background:url(../images/envoyer_ON.gif) no-repeat; }

