@font-face {
    font-family: 'cherish';
    src: url(/Cherish.ttf);
}

@font-face {
    font-family: 'Mademoiselle';
    src: url(/Mademoiselle.ttf);
}

@font-face {
    font-family: 'gothic pixels';
    src: url(/GothicPixels.ttf);
}

body {
    background-image: url(/series/main-background.gif);
}

#shelf {
    border: 20px solid transparent;
    border-image: url(/series/shelf-border.png) 15 fill round;
    width: 715px;
    height: 405px;
}

#content {
    background-image: url(/series/content-border.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 600px;
    height: 600px;
    filter: drop-shadow(20px 26px 20px rgba(0, 0, 0, 0.397));
}

.content {
    background-image: url(/series/content-background.gif);
    margin-top: 68px;
    margin-left: 54px;
    width: 467px;
    height: 346px;
    overflow: auto;
    color: white;
    padding: 10px;
}

#menu {
    width: 390px;
    height: 100px;
    border: 10px solid transparent;
    border-image: url(/series/menu-border.png) 12 fill round;
    color: #b1daa7;
    font-family: 'Mademoiselle';
    padding-left: 10px;
}

#menu h1 {
    font-family: 'cherish';
    margin: 0px;
    text-align: center;
}

#menu a, #menu a:visited {
    color: #b1daa7;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
    text-decoration: none;
}

#menu a:hover {
    color: #fff;
    text-shadow: -1px -1px 0 #b1daa7, 1px -1px 0 #b1daa7, -1px 1px 0 #b1daa7, 1px 1px 0 #b1daa7;
}

#banner {
    color: #f3a8b7;
    font-family: 'gothic pixels';
    font-size: 30px;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
}