:root {
     --mid: #0F8398;
     --light: #DDF3D9;
     --dark: #090C14;
}
/* ------------------------------------------------- */
 @font-face {
     font-family: "Bahnschrift Light";
     src: url("https://unicoroll.neocities.org/wmpgs/jenny/bahnschrift.TTF") format("truetype");
}
/* ------------------------------------------------- */
 #header{
     display: flex;
}
 #index{
     transform: skewX(-15deg);
     margin: 10px;
     flex:1;
}
 #index a{
     background: var(--light);
     width: 120px;
     margin: 15px;
     margin-left: 25px;
     padding: 5px;
     color: var(--mid);
     font-size: 30px;
     font-weight: 900;
     text-align: center;
     text-decoration:none;
     transition: 0.2s;
}
 #index:hover{
     transform: skewX(-15deg);
}
 #index a:hover{
     background: var(--dark);
     color: var(--light);
     text-decoration:none;
}
 #darkmode{
     background: var(--dark);
     color: var(--mid);
     font-size: 30px;
     border-radius: 50%;
     padding: 5px;
     max-width: 50px;
     max-height: 50px;
     border:none;
     flex:2;
     box-sizing: border-box;
}
 body {
     box-sizing: border-box;
     background-color: var(--mid);
     background-image: url(https://unicoroll.neocities.org/wmpgs/jenny/lmbg.png);
     max-height: 100vh;
     margin-top: 3%;
     font-family: "Bahnschrift Light";
     color: var(--dark);
    /*-webkit-transform:scale(0.7);
     -moz-transform:scale(0.7);
     -ms-transform:scale(0.7);
     transform:scale(0.7);
    */
}
 #yk{
     zoom: 0.7;
     width: 960px;
     margin: 0 auto;
}
 .cage{
     background-color: var(--light);
     padding: 8px;
     border-radius: 30px;
}
 main{
     background-color: var(--light);
     border: var(--mid) 8px solid;
     border-radius: 30px;
     padding: 30px 30px 8px 30px;
}
 .top{
     display: flex;
}
 .topLeft{
     flex: 1;
     margin-right: 30px;
}
 .topRight{
     flex:2;
}
 .pfpLinks{
     display: flex;
}
 .pfp{
     flex: 1;
     width: 250px;
     margin-left: 15px;
     border-radius: 10%;
}
 .pLinks{
     flex: 2;
     margin-left: 30px;
}
 .title{
     box-sizing: border-box;
     width:320px;
     height: 70px;
     padding: 0px;
     padding-top: 3px;
     margin: auto;
     margin-top: 10px;
     background: var(--dark);
     font-family: "Bahnschrift Light";
     color: var(--light);
     font-size: 72px;
     text-align: center;
     line-height: 1em;
     transform: skewX(-20deg);
}
 .cLink{
     box-sizing: border-box;
     display: block;
     background-color: var(--mid);
     border-radius: 50%;
     font-size:35px;
     width: 55px;
     height: 55px;
     padding-top: 10px;
     color: var(--light);
     text-align: center;
     line-height: 0em;
     margin-bottom: 10px;
     transition: 0.1s;
}
 .cLink:hover{
     background-color: var(--dark);
}
 #akaNames{
     margin-top: 20px;
}
 #arrow{
     height: 30px;
}
 #aka{
     background: var(--mid);
     color: var(--light);
     font-size: 25px;
     padding: 7px;
     border-radius: 10px;
     font-weight: 800;
     margin-right: 10px;
}
 #names{
     font-size: 25px;
     font-style: italic;
}
 .middle{
     border: var(--mid) 3px solid;
     color: var(--mid);
     margin-top: 20px;
}
 marquee{
     background: var(--mid);
     font-size: 30px;
     padding: 5px;
     color: var(--light);
     transform: skewX(-20deg);
     width: 470px;
     margin-left: 10px;
     margin-bottom: 10px;
     font-weight: 900;
}
 .abMe{
     box-sizing: border-box;
     background: var(--dark);
     height: 320px;
     overflow: auto;
     color: var(--light);
     font-size: 25px;
     padding: 20px;
     border-radius: 20px;
}
 #aug{
     background: var(--dark);
     padding: 5px;
     border-radius: 20px;
}
 .bottom{
     display: flex;
     margin-top: 25px;
}
 #bottomLeft{
     flex:1;
}
 #stats{
     box-sizing: border-box;
     flex:2;
     background: var(--mid);
     max-width: 350px;
     padding: 10px;
     border-radius: 30px;
     text-align: center;
     padding-top: 20px;
}
 #statText{
     font-size: 30px;
     color: var(--light);
     font-weight: 900;
     line-height: 0.3em;
     letter-spacing: 0.5em;
     font-style: italic;
}
 #statHr{
     border: var(--light) 2px solid;
     margin-bottom: 15px;
     color: var(--light);
}
 .cInfo{
     background: var(--light);
     width:300px;
     max-width: 300px;
     padding:0;
     margin: auto;
     margin-bottom: 7px;
     text-align: left;
     border-radius: 30px;
     display: flex;
}
 .C-I-label{
     font-size: 25px;
     display: inline-block;
     background: var(--dark);
     color: var(--light);
     margin-right: 0;
     padding:5px;
     width:90px;
     max-width: 90px;
     flex:1;
     border-radius: 30px;
     text-align: center;
     padding-top:10px;
}
 .C-I-text{
     font-size: 25px;
     display: inline-block;
     background: var(--light);
     color: var(--mid);
     margin-left: 0;
     padding:5px;
     text-align: right;
     border-radius: 30px;
     flex:2;
     padding-right: 15px;
     padding-top:10px;
}
 #bottomLeft{
     margin-right: 30px;
}
 #interest, #byi{
     background: var(--mid);
     font-size: 30px;
     padding: 5px;
     border-radius: 20px;
     box-sizing: border-box;
     color: var(--light);
     text-align: center;
     font-style: italic;
}
 #interest{
     margin-bottom: 10px;
}
 .byiBox, .intBox{
     font-size: 25px;
     height: 200px;
     overflow: auto;
     border-radius: 15px;
     padding: 10px;
     box-sizing: border-box;
     text-align: left;
     font-style: normal;
}
 .intBox{
     background: var(--light);
     color: var(--dark);
}
 .byiBox{
     background: var(--dark);
     color: var(--light);
}
 #ibg{
     background: var(--light);
     padding: 3px;
     border-radius: 15px;
}
 #bbg{
     background: var(--dark);
     padding: 3px;
     border-radius: 15px;
}
 footer{
     background: var(--dark);
     color: var(--light);
     margin: 20px -23px 0 -23px;
     border-radius: 0 0 20px 20px;
     height: 50px;
     text-align: center;
     font-size: 25px;
     padding-top: 10px;
     box-sizing: border-box;
}
 .starLight{
     color: var(--light);
}
 .starLight, .starDark{
     margin-right: -8px;
     -moz-margin-right: -15px;
}
 #traits{
     flex: 1;
     text-align: left;
     font-weight: 900;
     min-width: 140px;
}
 .stars{
     flex:2;
     text-align: right;
}
 #traitStar{
     font-size: 30px;
     display: flex;
     margin: 20px;
     margin-top: 10px;
}
 #starStats{
     margin-top: 50px;
}
 @media (max-width: 1000px) {
     #nameStars {
         display: none;
    }
     .top{
         margin-bottom: -50px;
    }
}
 @-moz-document url-prefix() {
     body{
         margin: 0 auto;
         margin-top: -5%;
         transform: scale(0.7);
         -moz-transform-origin: 0, 0;
         width: 960px;
    }
     #traits{
         min-width: 100px;
    }
     .stars{
         -min-width: 150px;
    }
     .starLight, .starDark{
         margin-right: -8px;
    }
}
/* -------------------------------------------------- */
/* width */
 .abMe::-webkit-scrollbar {
     width: 20px;
     margin: 10px;
     border-radius: 20px;
}
/* Track */
 .abMe::-webkit-scrollbar-track {
     background: var(--dark);
     border-radius: 20px;
}
/* Handle */
 .abMe::-webkit-scrollbar-thumb {
     background: var(--mid);
     border-radius: 20px;
}
/* Handle on hover */
 .abMe::-webkit-scrollbar-thumb:hover {
     background: var(--mid);
     border-radius: 20px;
}
/* -------------------------------------------------- */
/* width */
 .intBox::-webkit-scrollbar {
     width: 20px;
     margin: 10px;
     border-radius: 20px;
}
/* Track */
 .intBox::-webkit-scrollbar-track {
     background: var(--light);
     border-radius: 20px;
}
/* Handle */
 .intBox::-webkit-scrollbar-thumb {
     background: var(--mid);
     border-radius: 20px;
}
/* Handle on hover */
 .intBox::-webkit-scrollbar-thumb:hover {
     background: var(--mid);
     border-radius: 20px;
}
/* -------------------------------------------------- */
/* width */
 .byiBox::-webkit-scrollbar {
     width: 20px;
     margin: 10px;
     border-radius: 20px;
}
/* Track */
 .byiBox::-webkit-scrollbar-track {
     background: var(--dark);
     border-radius: 20px;
}
/* Handle */
 .byiBox::-webkit-scrollbar-thumb {
     background: var(--mid);
     border-radius: 20px;
}
/* Handle on hover */
 .byiBox::-webkit-scrollbar-thumb:hover {
     background: var(--mid);
     border-radius: 20px;
}
/* -------------------------------------------------- */
/* width */
 ::-webkit-scrollbar {
     width: 20px;
     margin: 10px;
     border-radius: 20px;
}
/* Track */
 ::-webkit-scrollbar-track {
     background: var(--mid);
}
/* Handle */
 ::-webkit-scrollbar-thumb {
     background: var(--light);
     border-radius: 20px;
}
/* Handle on hover */
 ::-webkit-scrollbar-thumb:hover {
     background: var(--mid);
     border-radius: 20px;
}
/* Start https://www.cursors-4u.com */
 * {
    cursor: url(https://cur.cursors-4u.net/cursors/cur-3/cur207.ani), url(https://cur.cursors-4u.net/cursors/cur-3/cur207.png), auto !important;
}
/* End https://www.cursors-4u.com */