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

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

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

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

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

body {
    background-image: url(main-background.png);
}

#updates {
    width: 150px;
    height: 200px;
    border: 16px solid transparent;
    border-image: url(/updates-border.png) 19 fill round;
    background-image: url(/updates-background.png);
    background-origin: fixed;
    color: #e776c3;
    font-family: 'Mademoiselle';
}
#updates h1 {
    font-family: 'cherish';
    margin: 0px;
    text-align: center;
}
.update b {
    font-family: 'cherish';
    font-weight: normal;
}
.update a, .update a:visited {
    color: #fef9fc;
    text-shadow: -1px -1px 0 #ee9dd4, 1px -1px 0 #ee9dd4, -1px 1px 0 #ee9dd4, 1px 1px 0 #ee9dd4;
    text-decoration: none;
    font-weight: bold;
}
.update a:hover {
    color: #ee9dd4;
    text-shadow: none;
}
.update {
    height: 155px;
    padding: 5px;
    overflow: auto;
}
.update::-webkit-scrollbar {
    width: 5px;
}
.update::-webkit-scrollbar-thumb {
    background-color: #fef9fc;
    border: 1px solid #ee9dd4;
    border-radius: 50px;
}
.update hr {
    border: none;
    background-image: url(/updates-hr.gif);
    height: 20px;
}

#calendar {
    color: #A29CF0;
    font-family: 'cherish';
    font-size: 20px;
    background-image: url(/calendar-background.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 170px;
    height: 185px;
    padding-top: 85px;
    padding-left: 10px;
}
#calendar strong {
    font-family: 'melee';
    font-weight: normal;
}

#banner {
    color: #85E876;
    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;
}

#content {
    background-image: url(/welcome-background.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 368px;
    height: 532px;
    border-radius: 50px;
    box-shadow: 0 0 5px #83d9ea;
    color: #7db785;
    font-family: 'rainy';
}
.content {
    margin: 50px 95px;
    height: 360px;
    overflow: hidden;
}

.content b {
    color: #ea9193;
}

#feel {
    background-image: url(https://64.media.tumblr.com/tumblr_lmr1nnybfP1qcfn0j.bmp);
    border-radius: 50px;
    width: 200px;
    padding: 0px 15px;
    border: 1px solid black;
    color: black;
    font-family: 'melee';
}

#about {
    background-image: url(/about-background.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    width: 340px;
    height: 255px;
    border-radius: 20px;
    box-shadow: 0 0 5px #f98ab5;
    font-family: 'rainy';
}

.about {
    margin: 65px;
    color: #febc0a;
}

#float1 {
    background-image: url(/main-float1.png);
    width: 300px;
    height: 250px;
    background-size: contain;
    background-repeat: no-repeat;
}

#float2 {
    background-image: url(/main-float2.png);
    width: 200px;
    height: 200px;
    background-size: contain;
    background-repeat: no-repeat;
}

#video {
    background-image: url(/video-background.png);
    width: 350px;
    height: 250px;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 46px 20px;
}

#game {
    background-image: url(/game-background.png);
    width: 350px;
    height: 150px;
    background-size: contain;
    background-repeat: no-repeat;
}
.game {
    margin: 14px 75px;
}

#watch {
    background-image: url(/watch-background.png);
    width: 250px;
    height: 250px;
    background-size: contain;
    background-repeat: no-repeat;
}
.watch {
    margin: 40px 37px;
}

#read {
    background-image: url(/read-background.png);
    width: 150px;
    height: 300px;
    background-size: contain;
    background-repeat: no-repeat;
}
.read {
    margin: 22px 25px;
}

#menu {
    width: 400px;
    height: 100px;
    border: 30px solid transparent;
    border-image: url(/menu-border.png) 104 fill round;
    color: #febc0a;
    font-family: 'Mademoiselle';
    background-image: url(menu-background.png);
}

.menu {
    width: 423px;
    height: 113px;
    margin-top: -7px;
    margin-left: -10px;
}

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

.menu a, .menu a:visited {
    color: #fef9fc;
    text-shadow: -1px -1px 0 #febc0a, 1px -1px 0 #febc0a, -1px 1px 0 #febc0a, 1px 1px 0 #febc0a;
    text-decoration: none;
    font-weight: bold;
}
.menu a:hover {
    color: #febc0a;
    text-shadow: none;
}

#foot {
    margin-left: auto;
    margin-right: auto;
    width: auto;
    font-family: 'rainy';
}

#wip {
    border: 20px solid transparent;
    border-image: url(/wip-border.png) 15 fill round;
    background-color: white;
    color: black;
    font-family: 'melee';
}