/*--- + body + font imports + ---*/
    @font-face {
    font-family: 'starborn';
    src: url(https://dl.dropbox.com/s/8p8mi5uzbekohv7/Starborn.ttf);}
    
    @font-face {
    font-family: 'tegaki';
    src: url(https://dl.dropbox.com/scl/fi/isoa4nl8ahb8x9bysike0/KTEGAKI.ttf?rlkey=8813npy3oc084y33g92zja59t&dl=0);}
    
    body{
        background-image:url('https://i.imgur.com/3tR9qYk.png');
        font-size:16px;
        font-family:"tegaki";
        color:#ff7d81;
        margin-top:90px;
        /* the stuff below animates the background :] */
        -webkit-animation: woof 15s linear infinite;
        -moz-animation: woof 15s linear infinite;
        -o-animation: woof 15s linear infinite;
        animation: woof 15s linear infinite;
    }
    
    @keyframes woof {
      from {
        background-position: 1024px 1024px;}

       to {
        background-position: 0 0;}
        }
    }
    
    h1, h2, h3, h4, h5, h6 {
      font-family:starborn;
    }
    
    /*--- + link colors + effects + --- */
    a{
        color:#ff595e;
        text-decoration:underline;
    }
    
    a:hover {
        font-style:italic;
        font-style:bold;
    }
    
    /* rainbow hover links */
    .squidparty, a:hover {
        -webkit-animation: ikkan 5s linear infinite;
        text-shadow: 0px 0px 10px}

    @keyframes ikkan{
        0% {color: #ff6982}
        10% {color: #ff8f69}
        20% {color: #ffd069}
        30% {color: #faff69}
        40% {color: #beff69}
        50% {color: #84ff69}
        60% {color: #69ffaf}
        70% {color: #69ebff}
        80% {color: #6991ff}
        90% {color: #a069ff}
        100% {color: #ff6982}
    }
    
    /*--- + cursors + ---*/
    body, html {
        cursor: url(https://cur.cursors-4u.net/nature/nat-10/nat905.cur), auto;}
    
    a:hover, a:hover img  {
        cursor: url(https://cur.cursors-4u.net/nature/nat-10/nat908.cur), pointer;}
    
    /*--- + selection + scrollbar + ---*/
    ::selection{ 
        color:white; 
        background-color:hotpink;}

/*! 7.css v0.14.0 - https://khang-nd.github.io/7.css */
::-webkit-scrollbar{
    width:16px
}
::-webkit-scrollbar:horizontal{
    height:17px
}
::-webkit-scrollbar-corner{
    background:#eee
}
::-webkit-scrollbar-track:vertical{
    background:linear-gradient(90deg,#e5e5e5,#f0f0f0 20%)
}
::-webkit-scrollbar-track:horizontal{
    background:linear-gradient(180deg,#e5e5e5,#f0f0f0 20%)
}
::-webkit-scrollbar-thumb{
    background-color:#eee;
    border:1px solid #8e8f8f;
    border-radius:3px;
    box-shadow:inset 0 -1px 1px hsla(0,0%,100%,.8),inset 0 1px 1px #fff
}
::-webkit-scrollbar-thumb:vertical{
    background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKCAIAAADpZ+PpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAADrSURBVChTTc5LboJQGAXguyoCu4ERCzAGlRk7UOwGWIDh0s4M4kxb06RSq/jAB6AxJkJ4lTDrue3AnvyzP+fLId+/yfM8juP7PQmCCOf7B3e+ZD+O40RRVFW12VQUpd3r9U3T2m4OpKoqWZYNwzBZLEqfh0N7NnvfrPcEWlEUWZb9mWF4Ph6D0ylcLbfM5HkeJrhGA2hb15/QXnv+w7RYXsDatjOdvnmrHSnLEizMNE2v11sUXQBCnn98kbquBUGQJAlmq9WB2e3qg4HJdqKkaRql1HGc0WgMcDJ5dd0F24kediZJ8t/ELT69H+8py0CYSIO5AAAAAElFTkSuQmCC") no-repeat 50%,linear-gradient(90deg,#eee 45%,#ddd 0,#bbb)
}
::-webkit-scrollbar-thumb:horizontal{
    background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAJCAYAAAALpr0TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAADcSURBVChTNZBLqoUwEEQrURQUxZGCvy24ACfiityJi7tv8GauQoPxk5tquA2RQ9vVVYk6z9NZaxFFEe77htYazjk8z4MwDIVZ+rourOuKaZrwvi+WZcE8z1BKCbPPCjk4DAO2bRP1OI7wLiL6Mbd7J408z1GWpQwWRYGqqiQG+03TgMu0MacfUN4qANmn8UOv9MjW3sKaSm7iIdOSlziOQ3LScd93aPonSYK6riVLlmVo21aYfVqzND9pmqLrOlGT+76XbcxLZkb19/l3fEP+oF0cx8KMEASBsDEGX2/CgZCHkg+8AAAAAElFTkSuQmCC") no-repeat 50%,linear-gradient(180deg,#eee 45%,#ddd 0,#bbb)
}
::-webkit-scrollbar-thumb:hover:vertical{
    background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKCAIAAADpZ+PpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAADrSURBVChTTc5LboJQGAXguyoCu4ERCzAGlRk7UOwGWIDh0s4M4kxb06RSq/jAB6AxJkJ4lTDrue3AnvyzP+fLId+/yfM8juP7PQmCCOf7B3e+ZD+O40RRVFW12VQUpd3r9U3T2m4OpKoqWZYNwzBZLEqfh0N7NnvfrPcEWlEUWZb9mWF4Ph6D0ylcLbfM5HkeJrhGA2hb15/QXnv+w7RYXsDatjOdvnmrHSnLEizMNE2v11sUXQBCnn98kbquBUGQJAlmq9WB2e3qg4HJdqKkaRql1HGc0WgMcDJ5dd0F24kediZJ8t/ELT69H+8py0CYSIO5AAAAAElFTkSuQmCC") no-repeat 50%,linear-gradient(90deg,#e5f4fd 45%,#b3e0f9 0);
    border-color:#3c7fb1
}
::-webkit-scrollbar-thumb:hover:horizontal{
    background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAJCAYAAAALpr0TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAADcSURBVChTNZBLqoUwEEQrURQUxZGCvy24ACfiityJi7tv8GauQoPxk5tquA2RQ9vVVYk6z9NZaxFFEe77htYazjk8z4MwDIVZ+rourOuKaZrwvi+WZcE8z1BKCbPPCjk4DAO2bRP1OI7wLiL6Mbd7J408z1GWpQwWRYGqqiQG+03TgMu0MacfUN4qANmn8UOv9MjW3sKaSm7iIdOSlziOQ3LScd93aPonSYK6riVLlmVo21aYfVqzND9pmqLrOlGT+76XbcxLZkb19/l3fEP+oF0cx8KMEASBsDEGX2/CgZCHkg+8AAAAAElFTkSuQmCC") no-repeat 50%,linear-gradient(180deg,#e5f4fd 45%,#b3e0f9 0);
    border-color:#3c7fb1
}
::-webkit-scrollbar-thumb:active:vertical{
    background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKCAIAAADpZ+PpAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAADrSURBVChTTc5LboJQGAXguyoCu4ERCzAGlRk7UOwGWIDh0s4M4kxb06RSq/jAB6AxJkJ4lTDrue3AnvyzP+fLId+/yfM8juP7PQmCCOf7B3e+ZD+O40RRVFW12VQUpd3r9U3T2m4OpKoqWZYNwzBZLEqfh0N7NnvfrPcEWlEUWZb9mWF4Ph6D0ylcLbfM5HkeJrhGA2hb15/QXnv+w7RYXsDatjOdvnmrHSnLEizMNE2v11sUXQBCnn98kbquBUGQJAlmq9WB2e3qg4HJdqKkaRql1HGc0WgMcDJ5dd0F24kediZJ8t/ELT69H+8py0CYSIO5AAAAAElFTkSuQmCC") no-repeat 50%,linear-gradient(90deg,#cee9f8 45%,#86c6e8 0);
    border-color:#6d91ab
}
::-webkit-scrollbar-thumb:active:horizontal{
    background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAJCAYAAAALpr0TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAEnQAABJ0Ad5mH3gAAADcSURBVChTNZBLqoUwEEQrURQUxZGCvy24ACfiityJi7tv8GauQoPxk5tquA2RQ9vVVYk6z9NZaxFFEe77htYazjk8z4MwDIVZ+rourOuKaZrwvi+WZcE8z1BKCbPPCjk4DAO2bRP1OI7wLiL6Mbd7J408z1GWpQwWRYGqqiQG+03TgMu0MacfUN4qANmn8UOv9MjW3sKaSm7iIdOSlziOQ3LScd93aPonSYK6riVLlmVo21aYfVqzND9pmqLrOlGT+76XbcxLZkb19/l3fEP+oF0cx8KMEASBsDEGX2/CgZCHkg+8AAAAAElFTkSuQmCC") no-repeat 50%,linear-gradient(180deg,#cee9f8 45%,#86c6e8 0);
    border-color:#6d91ab
}
::-webkit-scrollbar-button:horizontal:end:decrement,::-webkit-scrollbar-button:horizontal:start:increment,::-webkit-scrollbar-button:vertical:end:decrement,::-webkit-scrollbar-button:vertical:start:increment{
    display:none
}
::-webkit-scrollbar-button{
    border:1px solid transparent
}
::-webkit-scrollbar-button:vertical{
    height:17px
}
::-webkit-scrollbar-button:vertical:start{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik04IDZIN3YxSDZ2MUg1djFINHYxaDdWOWgtMVY4SDlWN0g4VjZaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(90deg,#e5e5e5,#f0f0f0 20%)
}
::-webkit-scrollbar-button:vertical:end{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik0xMSA2SDR2MWgxdjFoMXYxaDF2MWgxVjloMVY4aDFWN2gxVjZaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(90deg,#e5e5e5,#f0f0f0 20%)
}
::-webkit-scrollbar-button:horizontal{
    width:16px
}
::-webkit-scrollbar-button:horizontal:start{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIxMDAlIiB4Mj0iMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik05IDRIOHYxSDd2MUg2djFINXYxaDF2MWgxdjFoMXYxaDFWNFoiIGZpbGw9InVybCgjYSkiLz48L3N2Zz4="),linear-gradient(180deg,#e5e5e5,#f0f0f0 20%)
}
::-webkit-scrollbar-button:horizontal:end{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIxMDAlIiB4Mj0iMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik03IDRINnY3aDF2LTFoMVY5aDFWOGgxVjdIOVY2SDhWNUg3VjRaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(180deg,#e5e5e5,#f0f0f0 20%)
}
::-webkit-scrollbar-button:hover{
    background-color:#eee;
    border-color:#8e8f8f;
    border-radius:3px;
    box-shadow:inset 0 -1px 1px hsla(0,0%,100%,.8),inset 0 1px 1px #fff
}
::-webkit-scrollbar-button:hover:vertical{
    height:17px
}
::-webkit-scrollbar-button:hover:vertical:start{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik04IDZIN3YxSDZ2MUg1djFINHYxaDdWOWgtMVY4SDlWN0g4VjZaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(90deg,#e5f4fd 45%,#b3e0f9 0);
    border-color:#3c7fb1
}
::-webkit-scrollbar-button:hover:vertical:end{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik0xMSA2SDR2MWgxdjFoMXYxaDF2MWgxVjloMVY4aDFWN2gxVjZaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(90deg,#e5f4fd 45%,#b3e0f9 0);
    border-color:#3c7fb1
}
::-webkit-scrollbar-button:hover:horizontal{
    width:16px
}
::-webkit-scrollbar-button:hover:horizontal:start{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIxMDAlIiB4Mj0iMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik05IDRIOHYxSDd2MUg2djFINXYxaDF2MWgxdjFoMXYxaDFWNFoiIGZpbGw9InVybCgjYSkiLz48L3N2Zz4="),linear-gradient(180deg,#e5f4fd 45%,#b3e0f9 0);
    border-color:#3c7fb1
}
::-webkit-scrollbar-button:hover:horizontal:end{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIxMDAlIiB4Mj0iMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik03IDRINnY3aDF2LTFoMVY5aDFWOGgxVjdIOVY2SDhWNUg3VjRaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(180deg,#e5f4fd 45%,#b3e0f9 0);
    border-color:#3c7fb1
}
::-webkit-scrollbar-button:active{
    background-color:#eee;
    border-color:#8e8f8f;
    border-radius:3px;
    box-shadow:inset 0 -1px 1px hsla(0,0%,100%,.8),inset 0 1px 1px #fff
}
::-webkit-scrollbar-button:active:vertical{
    height:17px
}
::-webkit-scrollbar-button:active:vertical:start{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik04IDZIN3YxSDZ2MUg1djFINHYxaDdWOWgtMVY4SDlWN0g4VjZaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(90deg,#cee9f8 45%,#86c6e8 0);
    border-color:#6d91ab
}
::-webkit-scrollbar-button:active:vertical:end{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik0xMSA2SDR2MWgxdjFoMXYxaDF2MWgxVjloMVY4aDFWN2gxVjZaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(90deg,#cee9f8 45%,#86c6e8 0);
    border-color:#6d91ab
}
::-webkit-scrollbar-button:active:horizontal{
    width:16px
}
::-webkit-scrollbar-button:active:horizontal:start{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIxMDAlIiB4Mj0iMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik05IDRIOHYxSDd2MUg2djFINXYxaDF2MWgxdjFoMXYxaDFWNFoiIGZpbGw9InVybCgjYSkiLz48L3N2Zz4="),linear-gradient(180deg,#cee9f8 45%,#86c6e8 0);
    border-color:#6d91ab
}
::-webkit-scrollbar-button:active:horizontal:end{
    background:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJhIiB4MT0iMCUiIHkxPSIxMDAlIiB4Mj0iMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3R5bGU9InN0b3AtY29sb3I6IzMzMztzdG9wLW9wYWNpdHk6MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3R5bGU9InN0b3AtY29sb3I6I2FhYTtzdG9wLW9wYWNpdHk6MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxwYXRoIGQ9Ik03IDRINnY3aDF2LTFoMVY5aDFWOGgxVjdIOVY2SDhWNUg3VjRaIiBmaWxsPSJ1cmwoI2EpIi8+PC9zdmc+"),linear-gradient(180deg,#cee9f8 45%,#86c6e8 0);
    border-color:#6d91ab
}
    
    /********************************
    
                CONTAINER
    
    ********************************/
    
    #container{
        /* the container is what positions all of your content */
    position: relative;
    width: 1000px;
    height: auto;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 30px;
    padding: 15px;
    background-color: #fff;
    border: 1px dashed #f99f9f!important;
    box-shadow: 0 0 0 5px #fff!important;
    border-radius:18px;
    } 
    
      
    
    /********************************
    
                  HEADER
    
    ********************************/        
    
    #topborder {
      border-top-left-radius:18px;
        border-top-right-radius:18px;
        height:30px;
        background-image:url(https://i.imgur.com/ba7PmMP.png);
        border:1px #f99f9f solid;
        image-rendering:pixelated;
    }
    
    #bottomborder {
      border-top:transparent;
      border-bottom-left-radius:18px;
        border-bottom-right-radius:18px;
        height:30px;
        background-image:url(https://i.imgur.com/ba7PmMP.png);
        border:1px #f99f9f solid;
        image-rendering:pixelated;
    }
        
    
    #header{
        border:1px #f99f9f solid;
        height:250px;
        border-top:transparent;
        border-bottom:transparent;
        /* object-fit:fill makes the image fit into the header without overflowing. background:position makes it where you can easily adjust the position of your header. the "-30%" represents horizontal, and the "30%" represents vertical. You can change these as needed when inserting your own image. I recommend going slowly - i.e. changing "30%" to "35%" */
        object-fit: fill;
        background-position: 100% 30%; 
        background-image:url('https://i.imgur.com/yNTghiw.png');        
        image-rendering:pixelated;
    }  
    
    #footer{
        border:1px #f99f9f solid;
        height:auto;
        background-color:white;
        padding:15px;
        border-radius:10px;
        justify-content:center;
    } 
    
    /********************************
    
                CONTENT
    
    ********************************/    
    
    #content{
        border:1px #ffd587 solid;
        background:white;
        width:530px;
        margin-top:6px;
        /* adjust height to your liking */
        height:auto;
        padding:15px;
        padding-top: 10px;
        padding-bottom:10px;
        margin-left:auto;
        margin-right:auto;
        border-radius:10px;
        margin-bottom:8px;
        
    }
    
    #stamps {
    border: 1px #ffd587 solid;
    background: white;
    margin-left: auto;
    margin-right: auto;
    border-radius:10px;
    padding: 15px;
    width: 530px;
    height: 56px;
    margin-bottom: 8px;
}
    
    /********************************
    
                 SIDEBAR
    
    ********************************/    
    
    #leftnav {
      float:left;
    }
    
    #sidenav{
      margin-top:6px;
        width:196px;
        background:white;
        padding:8px;
        border:1px #f99f9f solid;
        border-radius:10px;
                padding-top:10px;
        padding-bottom:10px; 
        /* adjust height to your liking */
        height:743px;
    }
    
    #rightnav {
      float:right;
    }
    
    #stats a, #sitebtn a {
      color: #29e7ff;
    }
    
        #stats{
          margin-top:6px;
        width:196px;
        background:white;
        padding:8px;
        padding-top:10px;
        padding-bottom:10px; 
        border-radius:10px;
        border:1px #87d7ff solid;
        color: #00cae3;
        /* adjust height to your liking */
        height:100%;
    }
    
    #sitebtn{
        margin-top:6px;
        width:196px;
        background:white;
        padding:8px;
        padding-top:10px;
        padding-bottom:10px; 
        border-radius:10px;
        border:1px #87d7ff solid;
        color: #00cae3;
        /* adjust height to your liking */
        height:160px;
    }
    
        #webrings{
        margin-top:6px;
        width:196px;
        background:white;
        padding:8px;
        padding-top:10px;
        padding-bottom:10px; 
        border-radius:10px;
        border:1px #87d7ff solid;
        color: #00cae3;
        /* adjust height to your liking */
        height:233px;
    }
    
    #wrapper {
        display: flex;
        justify-content: center;
    }
    
    
#smallerbox {
    border: 1px #ffd587 solid;
    background: white;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    padding: 10px;
    width: 264px;
    height: 235px;
    overflow-y: auto;
    margin-bottom: 8px;
}


#cafe {
    border: 1px #ffd587 solid;
    background: white;
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    padding: 10px;
    width: 542px;
    height: auto;
    margin-bottom: 8px;
}
    
/* customizable snowflake styling */
.snowflake {
  color: #fff;
  font-size: 1em;
  font-family: Arial;
}

@-webkit-keyframes snowflakes-fall{
    0%{
        top:-10%
    }
    100%{
        top:100%
    }
}
@-webkit-keyframes snowflakes-shake{
    0%{
        -webkit-transform:translateX(0px);
        transform:translateX(0px)
    }
    50%{
        -webkit-transform:translateX(80px);
        transform:translateX(80px)
    }
    100%{
        -webkit-transform:translateX(0px);
        transform:translateX(0px)
    }
}
@keyframes snowflakes-fall{
    0%{
        top:-10%
    }
    100%{
        top:100%
    }
}
@keyframes snowflakes-shake{
    0%{
        transform:translateX(0px)
    }
    50%{
        transform:translateX(80px)
    }
    100%{
        transform:translateX(0px)
    }
}
.snowflake{
    position:fixed;
    top:-10%;
    z-index:9999;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    cursor:default;
    -webkit-animation-name:snowflakes-fall,snowflakes-shake;
    -webkit-animation-duration:10s,3s;
    -webkit-animation-timing-function:linear,ease-in-out;
    -webkit-animation-iteration-count:infinite,infinite;
    -webkit-animation-play-state:running,running;
    animation-name:snowflakes-fall,snowflakes-shake;
    animation-duration:10s,3s;
    animation-timing-function:linear,ease-in-out;
    animation-iteration-count:infinite,infinite;
    animation-play-state:running,running
}
.snowflake:nth-of-type(0){
    left:1%;
    -webkit-animation-delay:0s,0s;
    animation-delay:0s,0s
}
.snowflake:nth-of-type(1){
    left:10%;
    -webkit-animation-delay:1s,1s;
    animation-delay:1s,1s
}
.snowflake:nth-of-type(2){
    left:20%;
    -webkit-animation-delay:6s,.5s;
    animation-delay:6s,.5s
}
.snowflake:nth-of-type(3){
    left:30%;
    -webkit-animation-delay:4s,2s;
    animation-delay:4s,2s
}
.snowflake:nth-of-type(4){
    left:40%;
    -webkit-animation-delay:2s,2s;
    animation-delay:2s,2s
}
.snowflake:nth-of-type(5){
    left:50%;
    -webkit-animation-delay:8s,3s;
    animation-delay:8s,3s
}
.snowflake:nth-of-type(6){
    left:60%;
    -webkit-animation-delay:6s,2s;
    animation-delay:6s,2s
}
.snowflake:nth-of-type(7){
    left:70%;
    -webkit-animation-delay:2.5s,1s;
    animation-delay:2.5s,1s
}
.snowflake:nth-of-type(8){
    left:80%;
    -webkit-animation-delay:1s,0s;
    animation-delay:1s,0s
}
.snowflake:nth-of-type(9){
    left:90%;
    -webkit-animation-delay:3s,1.5s;
    animation-delay:3s,1.5s
}

#pompom {
animation-name:pompom;
animation-duration: 2s;
animation-iteration-count: infinite;
position:relative;
}

@keyframes pompom {
0% {
    transform: rotate(
8deg);
}
50% {
    transform: rotate(
-8deg);
}
100% {
    transform: rotate(
8deg);
}
}

#melody {
animation-name:melody;
animation-duration: 2s;
animation-iteration-count: infinite;
position:relative;
}

@keyframes melody {
0% {
    transform: rotate(
-8deg);
}
50% {
    transform: rotate(
8deg);
}
100% {
    transform: rotate(
-8deg);
}
}

    /*--- + statuscafe widget + ---*/
    #statuscafe {
        padding: .5em;
        border: 1px dashed #ffd587;
        padding:10px;
        border-radius:10px;
        color: #ff9c28;
    }
    
    #statuscafe-username {
        margin-bottom: .5em;
    }
    
    #statuscafe-content {
        margin: 0 1em 0.5em 1em;
    }
    
    #statuscafe a {
      color: #ffb60d;
    }

#insertring {
  font-size:10px;
  width:10em;
}

#ringnote table {
  width:163px;
  color:black;
}

#float {
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
 
@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 15px); }
    100%   { transform: translate(0, -0px); }    
}