@font-face {
    font-family: lowres;
    src: url(LowerResolution.ttf) format("truetype");
}

@keyframes gelatine {
    from, to { transform: scale(1, 1); }
    25% { transform: scale(0.9, 1.1); }
    50% { transform: scale(1.1, 0.9); }
    75% { transform: scale(0.95, 1.05); }
  }


* {
  cursor: url('https://cdn.cursors-4u.net/css-previews/shark-attack-hand-0bd3e672-css.webp') 0 0, auto !important;
}




body {
    background-image: url(https://i.pinimg.com/originals/94/5e/43/945e43b9cbb6ff031ba441f2234d629a.gif);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 10%;
    overflow: hidden;
}

.container {
    
    width: 70%;
    height: 93%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2%;
    border-width: 3px;
    border-style: dashed;
    border-color: #9c3f09;
    overflow-x: hidden;
    scrollbar-width: none;
    
}

.header {
    width: 100%;
    height: 200px;
    background-image: url(https://i.pinimg.com/originals/fa/f9/98/faf9982e0d6aa6c53458bd31f411c723.gif);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    border-bottom: #5c290bc5;
    border-width: 3px;
    border-top: #fcfaf59a;
    border-style: solid;
    border-right: #fcfaf59a;
}

h1 {
    padding: 10px;
    margin-top: 0%;
    font-family: lowres;
    color: #fcfaf5;
    font-size: 100px;
    
}

.row, .rowsong {
    display: flex;
    
}

.left {
    width: 25%;
    height: 800px;
    background-image: url(https://files.catbox.moe/m4bwns.jpg);
    overflow:auto;
    padding: 10px;
    border-radius: 7px;
    border-top-style: solid;
    border-right-style: solid;
    border-top-color: #fcfaf59a;
    scrollbar-width: none;
    border-right-color: #9c3f0993;
}

.right {
    width: 75%;
    
    background-color: #fcfaf585;
    
    
    border-radius: 3px;
    border-top-style: solid;
    border-right-style: solid;
    border-color: #fcfaf59a;
}

.hansry:hover {
    animation: gelatine 0.5s infinite ease;
}

h1:hover {
    mix-blend-mode: difference;
    font-style: italic;
    text-shadow: 0px 0px 8px #fcfaf5;
    
}

.mewo {
     display: flex;
     height: 500px;
}



.lyrics {
    height: 315;
    overflow: auto;
    width: 50%;
    mix-blend-mode: difference;
    color: rgb(255, 255, 255);
    transition: font-size .5s;
    scrollbar-width: none;
}

p {
    font-family: lowres;
}

.lyrics:hover {
    font-size: 150%;
    text-shadow: #fcfaf5;
}

iframe {
    transition: box-shadow .5s;
    transition: transform 0.5s;
}

iframe:hover {
    transform:scale(1.01);
    box-shadow: 0 8px 16px 0 #5c290b6c;
}

.mecoreee {
    transition: transform 0.2s;
}

.mecoreee:hover {
    transform:scale(1.02);
}

.rowsong {
    padding: 10px;
}

.pagedoll {
    transition: transform 5s;
}

.pagedoll:active {
    transform: rotate(1000deg);
}

.cburn:hover {
    
    mix-blend-mode:color-burn;
}