body
{
background: url("fond.jpg") no-repeat center top fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
} 


#partenariat
{
width: 33%;
position: fixed;
left: 33.2%;
top: 33%;
}

#sommaire
{
width: 350px;
height: 150px;
position: fixed;
top: 35%;
left: 1%;
}

.sommaireimg
{
position: relative;
width: 90%;
left: 5%;
top: 0.5%;
}

.boutonaccueil
{
width: 4%;
position: fixed;
top: 48%;
left: 5%;
}

.boutonlire
{
width: 4%;
position: fixed;
top: 48%;
left: 9.5%;
}


.boutonorigines
{
width: 4%;
position: fixed;
top: 48%;
left: 14%;
}

.boutonmerci
{
width: 4%;
position: fixed;
top: 48%;
left: 18.5%;
}

.newsletterimage
{
width: 15%;
position: absolute;
right: 5%;
top: 35%;
}

.livreorimage
{
width: 15%;
position: absolute;
right: 0%;
top: 44%;
}

.facebookimage
{
width: 15%;
position: absolute;
right: 12%;
bottom: 22%;
}


.contactimage
{
width: 15%;
position: absolute;
right: 3%;
bottom: 8%;
}

section
{
position: fixed;
left: 33.5%;
top: 39%;
width: 32%;
height: 46.5%;
color: #B16446;
font-size: medium;
text-align: justify;
padding-right: 10px;
padding-left: 10px;
overflow: auto;
border: 1px #310F0B solid;
border-radius: 10px;
background-color: #310F0B;
opacity: 0.9;
}

.bannière400px
{
width: 80%;
position: relative;
left: 10%;
}
.autre
{
position: relative;
left: 30%;
}
.autre1
{
position: relative;
left: 30%;
}

.perle
{
position: relative;
left: 48%;
}

#Troubles
{
position: relative;
left: 27%;
}
#Vanilla
{
position: relative;
left: 29.5%;
}
#Marionnettistes
{
position: relative;
left: 24%;
}
#Freyja
{
position: relative;
left: 31%;
}

footer
{
width: 40%;
position: absolute;
bottom: 1%;
left: 30%;
color: #F2D5C1;
text-align: center;
font-size: 0.8em;
}