@font-face
{
    font-family: "Rabbit"; src: url(Rabbit_On_The_Moon.ttf);
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a img {
    border: none;
}

ul, li {
    list-style: none;
}

body {
    font-family: "Rabbit";
    background: url(../img/wood-background.jpg);
}

.big-container {
    width: 980px; margin: 0 auto;
}

.footer {
    float: right; clear: both;
    width: 456px; height: 56px; padding: 17px; margin: 10px 0;
    background: url(../img/logos-box.png);
}

.footer-idf {
    float: left; width: 160px; height: 55px;
}

p.footer-soutenu {
    height: 30px; font-family: Helvetica, Arial, sans-serif; font-size: 12px; font-weight: bold; text-align: center; 
}

.footer-logo {
    float: left; margin-left: 8px;
}

.home-header {
    background: url(../img/home-header.png);
    width: 960px; height: 150px; padding: 5px 10px;
    color: #ffffff;
}

.home-header h1 {
    float: left; margin-left: 10px; height: 120px; padding-top: 15px; padding-left: 140px; font-size: 60px;
    background: url(../img/logo-home.png) left no-repeat;
}

.home-header h2 {
    float: right; width: 480px; margin-top: 20px; font-size: 30px; text-align: center;
}

.home-media {
    float: left; width: 440px; height: 130px; padding: 25px; background: url(../img/home-media-box.png); cursor: pointer;
}

.home-media-image {
    float: left; margin-top: 5px; width: 135px; height: 120px;
}

.home-media h3 {
    font-size: 28px; margin-left: 145px;
}

.home-media h3 a {
    color: #000000;
}

.home-media h4 {
    font-size: 24px; margin-left: 145px;
}

.home-media h4 a {
    color: #000080;
}

.home-dataviz {
    width: 140px; margin-left: 10px; float: left;
}

.home-dataviz li {
    float: left;
}

.hidden {
    visibility: hidden;
}

.tag-container-50 {
    position:relative; width:50px; height:50px; cursor: pointer;
}

.tag-shadow, .tag-color, .tag-emoticon {
    position: absolute;
}

.tag-container-50 .tag-shadow, .tag-container-50 .tag-color, .tag-container-50 .tag-emoticon {
    width:50px; height:50px; background: url(../img/tags50.png) no-repeat;
}

.tag-container-50 .tag-shadow {
    left: 2px; top: 2px; background-position: -200px -50px;
}

.tag-container-50 .tag-yellow {
    background-position: -50px 0;
}

.tag-container-50 .tag-green {
    background-position: -100px 0;
}

.tag-container-50 .tag-red {
    background-position: -150px 0;
}

.tag-container-50 .tag-blue {
    background-position: -200px 0;
}

.tag-container-50 .tag-happy {
    background-position: 0 -50px;
}

.tag-container-50 .tag-unhappy {
    background-position: -50px -50px;
}

.tag-container-50 .tag-laughing {
    background-position: -100px -50px;
}

.tag-container-50 .tag-surprised {
    background-position: -150px -50px;
}

.player-header {
    width: 980px; height: 220px;
}

.player-topleft {
    width: 310px; height: 200px; float: left; padding: 10px; background: url(../img/player-topleft.png);
}

.player-topleft h1 {
    color: #ffffff; font-size: 45px; text-align: center;
}

.back-home {
    background: url(../img/back-home.png); width: 120px; height: 90px;
    padding: 5px 20px 5px 100px; margin: 10px auto; font-size: 30px; text-align: center;
}

.back-home a {
    color: #ffffff;
}

.player-album {
    width: 610px; height: 190px; padding: 15px 20px; float: left;
    background: url(../img/player-album.png); text-align: right;
}

.player-album img {
    float: right; margin-left: 10px;
}

.player-album h2 {
    font-size: 40px;
}

.player-album h3 {
    font-size: 36px; color: #000080;
}

.player-timeline {
    width: 930px; height: 50px; padding: 15px 25px; position: relative;
    background: url(../img/slider-bg.png); z-index: 40;
}

#player-elements {
    width: 1px; height: 1px;
}

#controller-widget {
    float: left; width: 45px; height: 50px;
}

#slider-widget {
    margin: 14px 0 0 60px;
}

.player-belowtl {
    width: 870px; margin-left: 90px; position: relative; height: 400px;
}

#player-annotations {
    position: absolute; top: -15px; left: 0; z-index: 5;
}

#player-andyou {
    position: absolute; top: -15px; left: 0; z-index: 4;
}

#player-annotator {
    position: absolute; top: -15px; left: 0; z-index: 6;
}