@import "commun.css";
body
{
  background: url('../images/bach.gif') no-repeat 120px 50px;  
}

div#page
{
  width: 1000px;
  margin: 0px;
  padding: 0px;
}


div#bandeau
{
  width: 1000px;
  height: 112px;
  margin: 0px;
  padding: 0px;
}

div#bandeau div#cache
{
  width: 0px;
  height: 0px;
  display: none;
  
}

div#coin
{
  width: 175px;
  height: 112px;
  float: left;
  background: url('../images/coin.gif') no-repeat 70px 38px;
  margin: 0px;
  padding: 0px;
}

div#bandeau-contenu
{
  width: 615px;
  height: 112px;
  background: url('../images/bandeau.gif') no-repeat;
  float: left;
  margin: 0px;
  padding: 0px;
}

div#principal
{
  width: 800px;
}

div#menu
{
  width: 150px;
  height: 435px;
  float: left;
  background: url('../images/menu.gif') no-repeat;  
  padding: 30px 0px 0px 0px;
  margin: 0px;
  /*border: solid 1px black;*/
}

div#menu img
{
  padding: 5px 0px 0px 0px;
}

div#central
{
  width: 640px;
  float: left;
  padding: 10px 0px 0px 10px;
 
}

div#shinystat
{
  display:none;
}

h1
{
  font-size: 150%;
  color: rgb(147,32,40);
  border-left: solid 2px rgb(147,32,40);
  border-top: solid 2px rgb(147,32,40);
  font-weight: bold;
  font-style: italic;
  padding: 2px 0px 0px 5px;
}

h2
{
  font-size: 110%;
  color: rgb(147,32,40);
  font-weight: bold;
  font-style: italic;
  padding: 5px 0px 0px 5px;
}

div#central p span
{
  background-color: rgb(255,255,255);
}

p.photo
{
  float:left;
  padding: 0px 10px 0px 0px;
}

p.contact
{
  float: right;
  padding: 0px;
  margin 0px;
}

p.billets
{
  color: rgb(147,32,40);
  font-size: 90%;
  padding: 5px 0px 5px 0px;
}

/*-------------------- violons virtuoses -------------------------*/
div#violons-virtuoses
{
  clear: both;
  padding: 0px;
  margin 0px;
}
p.alexandre
{
  float: left;
  border-style: solid;
  border-color: rgb(147,32,40);
  border-width: 2px 0px 0px 2px;
  width: 162px;
  margin: 0px;
}

p.alexandre img
{
  margin: 5px 0px 0px 5px;
}

h1.alexandre
{
  float: left;
  width: 450px;
  border-style: solid;
  border-color: rgb(147,32,40);
  border-width: 2px 0px 0px 0px;
  padding: 5px 0px 0px 5px;
  margin: 0px;
}

p#violons-virtuoses
{
  border-style: solid;
  border-color: rgb(147,32,40);
  border-width: 0px 2px 2px 0px;
  margin: 10px 0px 0px 0px;
  text-align: right;
}

p#violons-virtuoses img
{
  margin: 0px 5px 5px 0px;
}

div#musiciens
{
  clear: both;
}



/*------------------ trio ----------------------*/

div#trio
{
  clear: both;
  padding: 0px;
  margin 0px;
}

div#trio p#photo-trio
{
  float: left;
  padding: 0px;
}

div#trio dl#accesseur-musiciens
{
  float: left;
  width: 230px;
  padding: 80px 0px 0px 0px;
}

div#trio dl#accesseur-musiciens span
{
  background-color: white;
}

div#trio dl#accesseur-musiciens dt
{
  clear: both;
  float: left;
  width: 130px;
  padding: 0px 0px 5px 0px;
  margin: 0px;
  font-weight: bold;
}

div#trio dl#accesseur-musiciens dd
{
  float: left;
  padding: 0px 0px 5px 15px;
  margin: 0px 0px 0px 0px;
  width: 80px;
  font-style: italic;
  
}

div#trio h2
{
  clear: both;
  float: left;
  width: 400px; 
}

div#trio p.retour
{
  float: right;
  padding: 20px 0px 0px 0px;
}


div#trio div.musicien
{
  clear: both;
}



div#repertoire
{
  clear: both;
  margin-top: 30px;
  border-top: solid 1px rgb(147,32,40);
}

div#repertoire h2
{
  clear: both;
  float: left;
  width: 400px; 
}

div#repertoire dl
{
  clear: both;
  margin: 0px 0px 10px 0px;
}

div#repertoire dl dt
{
  float: left;
  width: 200px;
  text-align: right;
  padding: 0px 20px 5px 0px;
  margin: 0px;
  font-style: italic;
  font-weight: bold;
}

div#repertoire dl dd
{
  float: left;
  width: 300px;
  padding: 0px 0px 5px 0px;
  margin: 0px;
  font-weight: bold;
}

/*------------------------- quatuor ---------------------------*/

div#quatuor
{
  clear: both;
  padding: 0px;
  margin 0px;
}

div#quatuor ul
{
  float: left;
  text-align: right;
  list-style-type: none;
  width: 220px;
  padding: 10px 10px 0px 0px;
  margin: 0px;
}

div#quatuor ul li
{
  font-weight: bold;
  padding: 0px 0px 5px 0px;
}

div#quatuor ul span
{
	background-color: white;
}

div#quatuor p#photo-quatuor
{
  float: right;
  padding-left: 10px;  
  height: 400px;
  vertical-align: middle;
}

div#quatuor p.presentation1
{
  font-style: italic;
  font-weight: bold;
  text-align: right;
  padding-right: 20px;
}

div#quatuor p.presentation2
{
  clear: both;
  float: none;
  font-style: italic;
  font-weight: bold;
  text-align: center;
  padding-top: 5px;
}

div#quatuor p.accroche
{
	font-style: italic;
  font-weight: bold;
  color: rgb(147,32,40);
  padding-top: 10px;
  text-align: center;
}



div#quatuor p.retour
{
  float: right;
  padding: 20px 0px 0px 0px;
}

div#quatuor div.musicien
{
  margin-left: 0px ;
  width: 300px;
  float: left;
}
div#quatuor div.musicien p.photo
{
  float: left;
  width: 127px;
}
div#quatuor div.musicien h2
{
  /*float: left;*/
}

div#quatuor div.musicien p.bio
{
  padding: 0px 7px 0px 0px;
  /*float: left;*/
}

div#quatuor div#repertoire dl dd
{
  font-weight: normal;
}
/*-------------- tournees ---------*/
div.item-tournee
{
  border-top: solid 1px #909090;
  float: left;
}

div.separateur
{
  clear:both;
  height: 20px;
  border-top: solid 1px #909090;
  width: 600px;
}

div.date
{
  float: left;
  width: 100px;
}

div.destination
{
  float: left;
  width: 500px;
}


/*--------------------------- contact -------------------------*/

form#contact div.champ 
{
  clear: both;
}

form#contact div.champ p.titre,
form#contact div.champ p.titre-aide
{
  float: left;
  font-weight: bold;
  text-align: right;
  margin: 0px 0px 0px 0px;
  
}

form#contact div.champ p.titre
{
  width: 120px;
  margin: 0px 21px 0px 0px;
}

form#contact div.champ p.titre-aide
{
  width: 115px;
  padding: 0px 5px 0px 0px;
}

form#contact div.champ img
{
  float: left;
  padding: 0px 5px 0px 0px;
}

form#contact div.champ input,
form#contact div.champ select,
form#contact div.champ textarea
{
  float: left;
  width: 400px;
  padding: 0px 0px 0px 0px;
  margin: 2px 0px 5px 0px;
  border: solid 1px rgb(147,32,40);
}

form#contact div.champ input.radio,
form#contact div.champ input.case-a-cocher
{
  width: 20px;
  height: 16px;
  border: none;
  float: left;
  clear: both;
}

form#contact div.champ div.sujets
{
  float: left;
}

form#contact div.champ div.sujet
{
  float: none;
}


form#contact div.champ div.sujet input.texte
{
  float: left;
  width: 300px;
}

form#contact div.champ p.texte-radio
{
  float: left;
  width: 80px;
  padding-top: 2px;
}

form#contact div.champ p.texte-case-a-cocher
{
  float: left;
  width: 380px;
  padding-top: 2px;
}

form#contact div#supplement-vide,
form#contact div#supplement-recrutement,
form#contact div#supplement-concert
{
  clear: both;
  height: 110px;
}

form#contact div#supplement-recrutement div.champ,
form#contact div#supplement-concert div.champ
{
  height: 23px;
}

form#contact div.texte
{
  clear: both;
  margin: 0px 0px 5px 105px;
  width: 400px;
  height: 75px;
}

form#contact p#envoyer
{
  text-align: right;
  width: 500px;
}

form#contact p.note
{
  clear: both;
  margin-left: 140px;
  width: 400px;
  font-size: 85%;
}

form#contact p.note a
{
  color: rgb(147,32,40);
}

p#message-envoi,
p.message
{
  font-weight: bold;
  font-style: italic;
  text-align: center;
  font-size: 110%;
}

/*------------------ liens ---------------------*/

dl#liens dt a
{
  font-weight: bold;
}

dl#liens dt span,
dl#liens dd span
{
  background-color: white;
}

dl#liens dd
{
  padding-bottom: 5px;
}