*{
    margin:0;
    padding:0;
}
body {
    margin: 0;
    background:#000;
    font-family: 'Oswald', sans-serif;
    line-height:2em;
    background-image:url(../img/motif.gif);
    background-size:50%;
    background-position:center center;
    background-attachment:fixed;
}
#header{
    position:absolute;
    width:100%;
    height:100%;
}
#logo{
    position:absolute;
    background-image:url(../img/logo.svg);
    width:700px;
    left:50%;
    margin-left:-350px;
    height:40%;
    background-size:100%;
    background-attachment:scroll;
    background-position:center center;
    background-repeat:no-repeat;
}
#band1{
    background-image:url(../img/band1.png);
    background-size:100%;
    height:calc(100% - 100px);
    width:100%;
    background-position:bottom center;
    background-repeat:no-repeat;
    position:absolute;
    bottom:100px;
}
#band2{
    background-image:url(../img/band2.png);
    background-size:100%;
    height:calc(100% - 150px);
    width:100%;
    background-position:bottom center;
    background-repeat:no-repeat;
    position:absolute;
    bottom:150px;
}
#divider{
    background-image:url(../img/divider.png);
    background-size:100%;
    background-position:bottom;
    height:calc(100% - 100px);
    width:100%;
    background-position:bottom center;
    background-repeat:no-repeat;
    position:absolute;
    bottom:100px;
}
#menu a:first-child{
    color:#b24d72;
}
#menu a{
    color:#153c71;
}
#menu a:last-child{
    color:#000;
}
#menu a{
    text-decoration:none;
    display:inline-block;
    margin: 0 3%;
}
#menu{
    position:absolute;
    height:200%;
    width:100%;
    padding-top:20px;
    text-align:center;
    background-color:#ffffdf;
    text-transform:uppercase;
    font-size:35px;
    top:100%;
}
#content{
    width:100%;
    position:absolute;
    top:100%;
    background-color:#ffffdf;
    text-align:center;
}

#music{
    padding-top:50px;
    margin-bottom: 100px;
}

#videos h1 {
    color:#fff;
}
#videos {
    margin-bottom: 100px;
    background-image:url(../img/map.jpg);
    background-position:center center;
    background-attachment:fixed;
}

#music p{
    line-height:3em;
    text-transform:uppercase;
    letter-spacing:0.2em;
    color:#aeae99;
}

#music h1{
    text-transform:uppercase;
    font-size:50px;
    font-weight:lighter;
}

#dividerbottom{
    background-image:url(../img/divider.png);
    background-size:100%;
    background-position:bottom;
    width:100%;
    background-repeat:no-repeat;
}
#dividertop{
    background-image:url(../img/divider2.png);
    background-size:100%;
    background-position:top;
    width:100%;
    background-repeat:no-repeat;
}
#videos iframe{
    margin: 50px auto;
    width: 90%;
    max-width: 700px;
    height: 350px;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 2px,
                rgba(0, 0, 0, 0.2) 0px 4px 4px,
                rgba(0, 0, 0, 0.2) 0px 8px 8px,
                rgba(0, 0, 0, 0.2) 0px 16px 16px,
                rgba(0, 0, 0, 0.2) 0px 32px 32px,
                rgba(0, 0, 0, 0.2) 0px 64px 64px;
}

#music a {
    text-decoration:none;
    color:#000;
}
#music h2{
    margin:0;
    letter-spacing:0.1em;
    font-size:2em;
    text-transform:uppercase;
}
#music h3{
    color:#aeae99;
    letter-spacing:0.2em;
    margin:0;
    text-transform:uppercase;
}
.play{
    transition:0.5s;
    opacity:0;
    background-color:rgba(0,0,0,0.4);
    background-image:url(../img/play.png);
    background-position:center center;
    background-repeat:no-repeat;
    height:500px;
    width:500px;
}

.album{
    transition:0.5s;
    margin: 25px auto;
    width:500px;
    height:500px;
    background-size:cover;
    background-position:center center;
    box-shadow: rgba(91, 72, 41, 0.2) 0px 2px 2px,
                rgba(91, 72, 41, 0.2) 0px 4px 4px,
                rgba(91, 72, 41, 0.2) 0px 8px 8px,
                rgba(91, 72, 41, 0.2) 0px 16px 16px,
                rgba(91, 72, 41, 0.2) 0px 32px 32px,
                rgba(91, 72, 41, 0.2) 0px 64px 64px;
}
#cotonou{
    background-image:url(../img/cotonou-club.jpg);
}
#madjafalao{
    background-image:url(../img/madjafalao.jpg);
}

a .album:hover{
    transition:0.2s;
    -ms-transform: rotate(-7deg); /* IE 9 */
    -webkit-transform: rotate(-7deg); /* Chrome, Safari, Opera */
    transform: rotate(-7deg);
}
a .album:hover .play{
    transition:0.2s;
    opacity:1;
}
#clips{
    background-image:url(../img/dots.jpg);
    background-repeat:no-repeat;
    background-position:center center;
}
#clips iframe{
    margin: 100px auto;
    width: 90%;
    max-width: 700px;
    height: 350px;

    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 2px,
                rgba(0, 0, 0, 0.2) 0px 4px 4px,
                rgba(0, 0, 0, 0.2) 0px 8px 8px,
                rgba(0, 0, 0, 0.2) 0px 16px 16px,
                rgba(0, 0, 0, 0.2) 0px 32px 32px,
                rgba(0, 0, 0, 0.2) 0px 64px 64px;
}

#tour{
    margin:0 auto;
    max-width:800px;
}

#footer{
    margin:100px;
}

#footer p{
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:0.2em;
}