body
{
background: url("fond.jpg") no-repeat center center fixed;
background-size: 100% 100%;
background-color: black;
}


#sommaire
{
width: 265px;
height: 160px;
position: fixed;
top: 29%;
left: 1%;
}

.sommaireimg
{
position: relative;
width: 85%;
left: 12%;
top: 10%;
}

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

.boutonlire
{
width: 5%;
position: fixed;
top: 44%;
left: 10.5%;
}

.boutonextrait
{
width: 5%;
position: fixed;
top: 44%;
left: 16%;
}

.boutonrésumé
{
width: 5%;
position: fixed;
top: 57%;
left: 5%;
}

.boutonorigines
{
width: 5%;
position: fixed;
top: 57%;
left: 10.5%;
}

.boutonmerci
{
width: 5%;
position: fixed;
top: 57%;
left: 16%;
}


.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%;
}

.twitterimage
{
display: none;
}

.contactimage
{
width: 15%;
position: absolute;
right: 7%;
bottom: 5%;
}

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

section
{
position: fixed;
left: 34%;
top: 42.5%;
width: 30%;
height: 42%;
color: #B16446;
font-size: 0.8em;
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: 70%;
position: relative;
left: 15%;
}
.autre
{
width: 50%;
position: relative;
left: 25%;
}
.perle
{
position: relative;
left: 48%;
}

#Troubles
{
position: relative;
left: 20.5%;
font-size: 1.2em;
}
#Vanilla
{
position: relative;
left: 24.5%;
font-size: 1.2em;
}
#Marionnettistes
{
position: relative;
left: 16%;
font-size: 1.2em;
}