:root{
            --lace: var(--purple); /* change pink to the color you want */ 
            /* options are: pink, black, blue, yellow, purple */
            --pink: url("https://files.catbox.moe/bsr34l.png");
            --black: url("https://files.catbox.moe/stv815.png");
            --blue: url("https://files.catbox.moe/pweyk3.png");
            --yellow: url("https://files.catbox.moe/r3ub8h.png");
            --purple: url("https://files.catbox.moe/acs8xi.png");
        }
      
        /****** fonts ******/
 
        @font-face {
            src: url(https://dl.dropbox.com/s/hfc6fjqu9kkxbt5/Sweet%20Creamy.ttf);
            font-family: creamy;
        } 
        
          @font-face {
            src: url(/basiic.ttf);
            font-family: basiic;
        } 
 
        /****** scrollbar ******/
        ::-webkit-scrollbar{
            display:none;
        }
 
        /****** select hightlight ******/
        ::selection {
            background: #83cae4;
            color:white;
        }
 
        ::-moz-selection {
            background: #83cae4;
            color:white;
        }
 
        /****** body ******/
        * {
          cursor: url(https://cur.cursors-4u.net/anime/ani-12/ani1147.ani), url(https://cur.cursors-4u.net/anime/ani-12/ani1147.gif), auto;
          }
        
        body {
            background-color:#ffebeb;
            background-image:url(/img/bg1.gif);
            background-size: 100%;
            background-repeat: repeat;
            background-position: 0 0;
            background-attachment: fixed;
            color:#7f6a68; /* default font color */
            font-family:'creamy'; /* default font */
            font-size:20px; /* default font size */
            padding:10px;
            position: relative;
            display: block;
            margin-left:auto;
            margin-right:auto;
        }
 
        /****** links ******/
        a{
            text-decoration: none;
            color:#7f6a68;
            transition:0.3s;
            text-shadow: -1px 0 #d9bbba, 0 1px #d9bbba, 1px 0 #d9bbba, 0 -1px #d9bbba;
        }
 
        a:hover{
            transition:0.3s;
            color:#d9bbba;
            text-shadow: -1px 0 #7f6a68, 0 1px #7f6a68, 1px 0 #7f6a68, 0 -1px #7f6a68;
            cursor: url(https://cur.cursors-4u.net/anime/ani-12/ani1147.ani), url(https://cur.cursors-4u.net/anime/ani-12/ani1147.gif), auto;
        }
        
        buttons
        {
            font-family:"basiic";
            font-size:14px;
          }
        
        
        hr{
          color:#ffebeb;
        }
 
        /****** wrappers ******/
        #wrapper{
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            animation: fadeEffect 1s;
            margin: auto;
            display:flex;
            align-items:center;
            justify-content:center;
        }
 /*
        @keyframes fadeEffect {
            from {opacity: 0;}
            to {opacity: 1;}
        }
        */
 
        /****** containers ******/
        .container{
            width:500px;
            height:500px;
            border:5px solid #af8a94;
            background-color:#d9bbba;
            padding:10px;
            overflow:auto;
        }
 
        .inner{
            border-width:10px;
            border-style:solid;
            border-image: var(--lace) 8 fill round; 
            background-color:white;
            font-family:"basiic";
            font-size:14px;
            text-align:center;
            line-height:150%;
        }
 
        .icon{
            border:5px solid #af8a94;
            margin-right:50px;
            padding:10px;
            background-color:#d9bbba;
        }
 
        .icon img{
            width:250px;
            height:auto;
            display:block;
            border:10px solid #af8a94;
            border-image: var(--lace) 8 fill round; 
        }
        
          .scroller {
          overflow: auto;
          width:100%;
          white-space: nowrap;
          display: inline-block;
        }
    

        .links{
            display:flex;
            flex-direction:column;
            width:120px;
        }
 
        .links a{
            border:5px solid #af8a94;
            background-color:#d9bbba;
            border-left:none;
            margin:8px 0px;
            padding:10px;
            width:100px;
            transition: all .3s ease-in-out;
            text-align:center;
        }
        
        .one:hover, .two:hover, .three:hover, .four:hover, .five:hover{
            width:120px;
            transition: all .3s ease-in-out;
        }
        
      
    .three:hover .sublinks {
      display: flex;
      }
        
 
    .sublinks{
            flex-direction:column;
            position: absolute;
            display: none;
            width:120px;
            z-index:10;
        }
 
        .sublinks a{
            border:3px solid #d9bbba;
            background-color:#af8a94;
            color: #fff;
            font-size:16px;
            padding:5px;
            width:120px;
            transition: all .3s ease-in-out;
            text-align:center;
        }
        
 
        .title{
            font-size:70px;
            position:absolute;
            color:#7f6a68;
            margin-top:-75px; /* change this if the title is too low */
            text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
        }
        
        .innertitle{
            font-family:'creamy'; /* default font */
            font-size:16px; /* default font size */
        }
        
        .innerbox{
            height: 150px;
            border-width:10px;
            border-style:solid;
            border-image: var(--lace) 8 fill round; 
            background-color:white;
            overflow:auto;
            
        }
        
        .columns {
            columns:2;
            column-gap:30px;
            column-fill:balance;
        }
        
        
        #statuscafe {
    padding: .5em;
    background-color: white;
    border-width:10px;
    border-style:solid;
    border-image: var(--lace) 8 fill round; 
    }
    #statuscafe-username {
        margin-bottom: .5em;
    }
    #statuscafe-content {
        margin: 0 1em 0.5em 1em;
    }