* {
    padding: 0;
    margin: 0;
}

body {
    font-size: 13px; /* Resets 1em to 10px */
    font-family: 'Trebuchet MS', Verdana, Geneva, Arial, Helvetica, sans-serif;
    color: #000;
    background: #BCBCBC url('../images/degrade.png') repeat-x 0 0;
    line-height: 1.3em;
}

strong {
    color: #5ec13c;
}

img {
    border: none;
}

.center {
	text-align: center;
}

.colonne {
	float: left;
}
/*
 ---> Formulaire
 */
label {
    display: block;
}

input, textarea {
    width: 350px;
    margin-bottom: 10px;
}

#btn {
    width: auto;
}

.erreur {
    color: red;
    display: block;
}
/*
 <--- Formulaire
 */
#page {
    margin: 0 auto;
    width: 800px;
    text-align: left;
}

#header {
    background: url('../images/banniere.png') no-repeat;
    width: 800px;
    height: 277px;
}

#header #logo {
    position: relative;
    top: 30px;
    left: 20px;
    width: 750px;
    height: 150px;
    display: block;
}

#header #logo span {
    display: none;
}
/*
 ---> infos
 */
#infos {
    list-style: none;
    position: relative;
    height: 20px;
    width: 300px;
    top: -150px;
    left: 500px;
}

#infos li {
    margin-right: 15px;
    float: left;
}

#infos li a {
    color: white;
    text-decoration: none;
}

#infos li a:hover {
    color: #51A8B2;
    background-color: white;
}
/*
 <--- infos
 */
/*
 ---> Menu
 */
ul#menu {
    position: relative;
    width: 800px;
    height: 37px;
    top: 38px;
    left: 20px;
    list-style: none;
}

ul#menu li {
    float: left;
    font-size: 14px;
    font-weight: bolder;
}

ul#menu li a {
    display: block;
    color: white;
    text-align: center;
    text-decoration: none;
    height: 47px;
}

#menu li a span {
    position: relative;
    top: 20px;
}

a#ongletChorale {
    background: url('../images/ongletchorale.png') no-repeat;
    background-position: 500px;
    width: 92px !important;
}

a#ongletChorale:hover, .current1 {
    background-position: top left !important;
}

a#ongletAgenda {
    background: url('../images/ongletagenda.png') no-repeat;
    background-position: 500px;
    margin-left: 23px;
    width: 87px !important;
}

a#ongletAgenda:hover, .current2 {
    background-position: top left !important;
}

a#ongletDiscographie {
    background: url('../images/ongletdiscographie.png') no-repeat;
    background-position: 500px;
    margin-left: 23px;
    width: 112px !important;
}

a#ongletDiscographie:hover, .current3 {
    background-position: top left !important;
}

a#ongletRepertoire {
    background: url('../images/ongletrepertoire.png') no-repeat;
    background-position: 500px;
    margin-left: 23px;
    width: 97px !important;
}

a#ongletRepertoire:hover, .current4 {
    background-position: top left !important;
}

a#ongletPhotos {
    background: url('../images/ongletphotos.png') no-repeat;
    background-position: 500px;
    margin-left: 24px;
    width: 69px !important;
}

a#ongletPhotos:hover, .current5 {
    background-position: top left !important;
}

a#contact {
    background: url('../images/flechecontact.png') no-repeat;
    background-position: top left;
    padding-left: 8px;
    margin-left: 54px;
    width: 120px !important;
    height: 22px !important;
    position: relative;
    top: 13px;
    padding-top: 7px;
}

a#contact:hover {
    background-position: 0 -28px;
}
/* Sous Menu */
.subMenu {
    position: absolute;
    list-style: none;
    left: 30px;
    margin-top: 3px;
	width: auto;
}

.subMenu li a {
    background: url('../images/flechesoustitre.png') no-repeat;
    background-position: 0 1px;
    color: #5ec13c !important;
    margin-right: 10px;
    float: left !important;
    padding-left: 14px;
    height: 15px !important;
    font-size: 12px;
}

.subMenu li a:hover, li a.current {
    background-position: 0 -14px;
    color: #51a8b2 !important;
}

ul#subOngletAgenda {
    left: 143px;
}

ul#subOngletDiscographie {
    left: 266px;
}

ul#subOngletRepertoire {
    left: 394px;
	width: 300px;
}

ul#subOngletPhotos {
    left: 501px;
}
/*
 <--- Menu
 */
/*
 ---> Content
 */
#content {
    background: url(../images/milieu.png);
    width: 760px;
    overflow: hidden;
    padding: 40px 20px 20px 20px;
    position: relative;
	line-height: normal;
}

#content p {
    padding-bottom: 10px;
}

#content ol, #content ul {
    margin-left: 30px;
    margin-bottom: 10px;
}

#text, #textBulle {
    float: left;
}

#text p {
	margin: 0 10px;
}

#textBulle p, #textBulle h3 {
	margin-left: 25px;
}

#content a {
    color: #51a8b2;
    text-decoration: none;
}

#content a:hover {
    color: white;
    background-color: #51a8b2;
}

#content h2, #content h3 {
	clear: both;
    display: block;
    padding-left: 26px;
    height: 24px;
    background: url('../images/puce.png') no-repeat top left;
    margin-bottom: 20px;
    font-size: 20px;
    color: #5ec13c;
	line-height: 1em;
}

#content h2 span, #content h3 span {
    color: #51a8b2;
}

#content h3 {
    margin-bottom: 10px;
    margin-top: 20px;
    font-size: 15px;
}

#imageAcceuil {
    background: url('../images/mosaiquephotos.png') no-repeat top left;
    height: 303px;
    width: 315px;
    position: absolute;
    top: -1px;
    left: 12px;
}

#textAcceuil {
    position: relative;
    width: 400px;
    left: 350px;
	height: 300px;
}

#textAcceuil p {
	margin-bottom: 25px;
}
/** Menu droite + texte bulle **/
#textBulle {
    width: 525px;
}

#menuDroite,#menuDroite2 {
    width: 215px;
    float: right;
}

#menuDroiteHaut,#menuDroiteHaut2 {
    background-image: url('../images/hautbulle.png');
    width: 215px;
    height: 55px;
    text-align: center;
}

#menuDroiteHaut span,#menuDroiteHaut2 span {
    position: relative;
    top: 15px;
    color: white;
    font-size: 20px;
}

#menuDroiteMilieu,#menuDroiteMilieu2 {
    background-image: url('../images/milieubulle.png');
    width: 175px;
    margin: 0 !important;
    padding: 0 !important;
	padding-left: 40px !important;
}

#menuDroiteMilieu li,#menuDroiteMilieu2 li  {
    padding-bottom: 5px;
}

#menuDroiteBas,#menuDroiteBas2 {
    background-image: url('../images/basbulle.png');
    width: 213px;
    height: 30px;
}
/** Langue **/
#lang {
    margin: 0 !important;
    padding: 0 !important;
    position: absolute;
    top: 0;
    left: 700px;
    list-style: none;
    font-size: 11px;
    font-style: italic;
    width: 100px;
}
#login {
    left: 20px;
    position: absolute;
    top:320px;
}
/*
#content >#lang {
    left: 740px;
}
*/
/*
 <--- Content
 */
#footer {
    clear: both;
    background: url('../images/footer.png') no-repeat;
    width: 800px;
    height: 148px;
}

#footer a {
    color: white;
    text-decoration: none;
}

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

#footer p {
    text-align: center;
    padding-top: 82px;
    color: white;
}