/* NOTES & CONSTANT STUFF */

/* background-position: 0px 0px; /* x,y */

/* z-index:6; -  cover all elements
   z-index:3; - stuff above header 
   z-index:2; - header
   z-index:1; - body 
  */

/* design inspired by https://www.youtube.com/watch?v=rsxMWK5--vU (the gamecube's unreleased planetweb browser *only used for demo discs sadly*) */

  #preloadin {
    position:absolute;
    top:25px;left:15px; background-image:url("/img/rippedfrombrowser/rippedbymyself/PROGRESS/pro_00.png");
    width:320px; height:80px; height:80px;
    z-index:8; user-select:none; pointer-events:none;
  }
  #preloadtxtnote {
    color:#FFF;
     position:absolute;
    top:30px;left:80px;
    font-size:16px;
    line-height:18px;
  }
  #progbar {
    background-color:#0b5c95;
     position:absolute;
    top:57px;left:78px;
    width:1px;
    height:14px;
  } 

    #SEclicknotice {
    font-size:15px; text-align:center;  margin:auto; width:100%;
  position:absolute; bottom:100px; left:3px; background-image:url("/img/background/darkbg-eztoseeebehind.png"); color:#FFF;
  z-index:7;
  user-select:none; pointer-events:none;
  min-height:80px; height:80px; height:fit-content;
  overflow: auto auto; /* x,y */
  }

#tempcursorchange {
    position:fixed;outline:none;top:0px;left:0px;width:100%;height:100%; cursor:url("/img/rippedfrombrowser/edited/DFLTN-ACTIVE.png"),default !important; z-index:15;
}

/* NOTES & CONST STUFF */


* {
    margin:0;
    padding:0;
    box-sizing:border-box;
    /* DFLTN-hover isnt an gcbrowser image */
    scroll-behavior:smooth;
    font-family:'GCN demo disc unreleased browsers font (?)',"Noto Sans JP",sans-serif;
    font-weight:normal;
}

html { position:absolute; top:0; left:0; height:100%; width:100%; cursor:url("/img/rippedfrombrowser/DFLTN.png"),default;}
select *{cursor:url("/img/rippedfrombrowser/DFLTN.png"),default;}
/* font from: https://eng.m.fontke.com/font/215641145/download/ */
/* NOTE: this is not the correct font, but its close enough. */
  @font-face {
    font-family:'GCN demo disc unreleased browsers font (?)';
    src:url(/css/font/Hedra-Medium/Hedra-Medium.otf);
  }

::selection {
  color:#2b2b2b;
 /* background:#c3d3eb;*/
background:#45b2f3;
}
::-moz-selection {
  color:#2b2b2b;
 /* background:#c3d3eb;*/
background:#45b2f3;
}

.hdrshadoww {
      border-bottom:3px solid #d6d6d6;
}
.shadoww {
  border-right:4px solid #d6d6d6;  border-bottom:4px solid #d6d6d6;
}

body {
    position:absolute;top:0px;left:0px;
height:100%;width:100%;
margin:auto;
overflow-x:hidden;
overflow: hidden auto;
background-color:#f7ffff;
 z-index:1;
font-weight:normal;
line-height:17px; letter-spacing:1px; font-size:18px;
outline:none !important;
}

#main {
 position:absolute;top:0;left:0;width:100%;height:100%;
 z-index:1;
}

.nooutline {
  outline:none !important;
}
p,span,h1,h2,h3,h4,hr {
   outline:none !important;
}
/* just to be safe i */
h1 {font-size:36px;}
h2 {font-size:27px;}
h3 {font-size:21px;}
h4 {font-size:18px;}

br{height:10px;}
*:hover {
      outline:5px solid #417eb4 ;
}
*:focus-visible {
  outline:5px solid #417eb4 !important; 
}
.hoveroutline {outline:5px solid #417eb4 !important; }
*:active {
  cursor:url("/img/rippedfrombrowser/edited/DFLTN-ACTIVE.png"),default !important;
}
a {
padding-left:2px;padding-right:2px;
padding:0;
    color:#1710c8;
    width:fit-content;
    text-decoration:underline;
}

a:hover{color:#41ccfa;cursor:url("/img/rippedfrombrowser/edited/DFLTN-hover.png"),default !important; transition:color 1.5s ease-in-out;}
a:active{cursor:url("/img/rippedfrombrowser/edited/DFLTN-ACTIVE.png"),default !important;}
h1,h2,h3,h4 {margin:auto; min-width:fit-content; line-height:25px;}
p{ line-height:18px;  min-width:fit-content;}
hr {height:3px; border-top:2px solid #41ccfa; border-bottom:2px solid #30b9e7; margin-bottom:3px; margin-top:3px; outline:none !important; border-radius:3px;}

select {
border-radius:13px;
}
select:hover {
background-color:#2b2b2b18; border:3px solid #4080ae93; 
}


button {
line-height:20px;
font-size:21px; font-weight:bolder; letter-spacing:0px;
color:#2b2b2b;
text-align:center;
padding:0; padding-left:3px;padding-right:3px;
/* thx idkwhereisthisname */
background-image:url("/img/rippedfrombrowser/edited/BUT-noborder.png");
/* thx idkwhereisthisname */
background-size:27px;
background-position: 0px 0px; /* x,y */
background-repeat:repeat-x;
border:2px solid; border-radius:35px;
outline-style:outset !important; outline:2.5px solid #b0b0b0 !important;
border-top-color:#5f5f5f; border-bottom-color:#3e3e3e; border-left-color:#5c5c5c; border-right-color:#474747;
/* tried my best to support old browsers but eh */

}

button:hover{background-size:29px; background-position: 0px -2px; cursor:url("/img/rippedfrombrowser/edited/DFLTN-hover.png"),default !important;}

button:disabled{background-size:33px; background-position: 0px -5px; color:#747474;}

button:active {
background-image:url("/img/rippedfrombrowser/edited/DBUT-noborder.png") ;
background-position: 0px 0px; /* x,y */
cursor:url("/img/rippedfrombrowser/edited/DFLTN-ACTIVE.png"),default !important;
}

input {
    border-top-color:#636362;
    border-left-color:#ababab;
    border-bottom-color:#ebebeb;
    border-right-color:#f1f0ef;
}

input:active {
outline:5px solid #32c72d !important;
}

input:checked {
    border-top-color:#818485;
    border-left-color:#a3a4a6;
    border-bottom-color:#929395;
    border-right-color:#5f5f61;
  background-color:#dfdde0;
}



/* header/bgm */

  #header {
    position:relative; left:0;
    display:block;
    height:40px; max-height:40px;
    overflow:hidden;
    width:100%;
    /* preload */ background-color:#41ccfa;
    background-image:url("/img/background/thewiiarchivistsgraident-right.png");
    background-size:100%;
    background-position:0px 0px; /* x,y */
    padding-top:6px;
    z-index:2;
    border-top-left-radius:20px;
    border-top-right-radius:20px;
  }
  #hdrtext {
      position:relative; top:-4px;
  float:left; display:inline-block;
  margin-left:15px;
  z-index:3;
  font-size:18px;
  color:#FFF;
  text-shadow: 2px 2px 1px #000000d3;
  min-width:109px; width:fit-content; max-width:380px;
  line-height:28px;
  margin-right:10px;
  max-height:27px;
  }
  #creditsurl {
    float:right; margin-right:7px;
  position:relative;
   display:inline-block;
    z-index:3;
    font-size:16px;
    width:80px;
  }
  #creditsbtn {font-size:16px; width:80px;}


#mailhover {
  opacity:0%;
  border-radius:30px;
  outline:5px solid #4b8fa8;position:absolute;top:2px;left:120px;width:143px;height:31px; transition:.3s ease-in-out;  pointer-events:none;  user-select:none;   
}


  #themainpage {
    text-align:center !important;
  position:relative;
  z-index:2;
  display:block;
  margin-top:5px;
}

/* audio plr */
        #audioplayer {
       display:inline-block;
       height:40px;
       width:fit-content;
       position:relative; top:-5px;
       outline:none;
        }
        #leftaudio {
            position:relative; left:0; float:left; outline:none;
        }
        #middleplay {
          position:relative; width:fit-content; left:0; float:left;  outline:none;

        }
        #infoaboutplaying {
            display:inline-block; position:relative;
            min-width:100px; width:fit-content; height:40px; outline:none;
        }
        #middleinfobg {
            position:absolute; top:0; left:0; width:100%; height:40px;
            z-index:3; outline:none; 
        }
        #trackname {
            width:fit-content; line-height:20px; padding-right:13px; padding-left:5px;
            position:relative; top:8px; margin-left:10px; height:20px; display:inline-block; z-index:4;
        }
        #leftdot {
            position:absolute; top:14px; left:-5px; width:14px; height:13px;
            z-index:3; outline:none; 
        }
        #rightdot {
            position:absolute; top:14px; right:-7px; width:14px; height:13px;
            z-index:3; outline:none; 
        }
        #rightaudio {
            position:relative; right:0; float:right; outline:none;
        }


/* audio plr */

/* da planetweb bar */

    #planetwebbar {
        background-image:url("/img/rippedfrombrowser/rippedbymyself/SPRITE/URLB.png"); background-color:#220022;
        background-size:36px;
        color:#FFF;
        width:100%;
        min-height:27px;max-height:27px;
        height:27px;
        position:absolute;
        top:45px; /* top:-50px; */
        left:0px;
        opacity:0%;
        outline:none;
        pointer-events:none;  
        user-select:none;
        z-index:8; /* hehe */   
       transition:.3s ease-in-out;
       overflow:hidden;
    }

    #planetwebwatermark {outline:none;position:absolute;top:0px;left:3px;width:39px;height:27px;max-height:27px;min-height:27px;
    }
    #planetwebtxt {
      text-overflow:ellipsis;
      font-weight:normal;
       line-height:23px;
       font-size:18px;
        position:absolute;
        top:1px;
        left:55px;
        min-height:27px;
        max-height:fit-content;
        overflow:auto hidden;
        min-width:94%;
        max-width:94%;
        color:#FFF;
        float:left;
        display:inline-block;
    }
    #planetweburl {line-height:23px;font-size:18px; position:absolute;top:1px;left:78px;min-height:27px;max-height:27px;max-width:650px;text-overflow:ellipsis; overflow:hidden;  white-space:nowrap; color:#FFF;float:left;display:inline-block;}

/* da planetweb bar */

/* img displayer*/
#imgdisplayhold {position:absolute;width:100%;height:100%;top:0;left:0; z-index:7; opacity:98%; background-color:#323232;}
#imagedisplayer {pointer-events:none;user-select:none;position:absolute;top:0;left:0;width:100%;height:100%; background-color:#323232; border:0; cursor:url("/img/rippedfrombrowser/edited/DFLTN-hover.png"),default; z-index:6; opacity:98%; }
#urltxt {padding-left:55px;  color:#f3ecff; }
#curimglnk2 {/*actual url */ padding-left:13px; color:#f3ecff; border:3px solid #7e4ab9; text-overflow:ellipsis; overflow:hidden;  white-space: nowrap;}
#curimglnk {/*planetwebbaralt*/ font-weight:normal; line-height:23px;font-size:18px;  padding-top:1px; position:absolute;top:45px; left:0px; width:100%; height:27px; color:#FFF; z-index:8; background-image:url("/img/rippedfrombrowser/rippedbymyself/SPRITE/URLB.png"); background-size:36px; background-color:#220022; text-overflow:ellipsis; overflow:hidden; pointer-events:auto;user-select:auto;}
#planetwebtxt2 {position:absolute; left:150px;}
#abttheimgbar { position:absolute;top:80px; left:0px; width:100%; background-image:url("/img/background/darkbg-eztoseeebehind.png"); color:#323232; text-align:center; z-index:8;   user-select:none; pointer-events:none; }
 #youcancloseityouknow { position:absolute;bottom:50px; left:0px; width:100%; background-image:url("/img/background/darkbg-eztoseeebehind.png"); color:#323232; text-align:center; z-index:8; user-select:none; pointer-events:none; }
/* img displayer */
          

      /* alert */
    #alertbox {cursor:url("/img/rippedfrombrowser/edited/DFLTN-hover.png"),default !important;}
    #alertcontainer {
      position:absolute;top:0;left:0;z-index:7;
      /*  background-color:black; */
      background-image:url("/img/background/darkbg-canbarleyseeabitmore&morebehind.png"); 
      width:100%;
      height:100%;
      overflow:hidden;
      transition:.3s ease-in-out; opacity:20%;
    }
    #alertbox {
      display:block;
      position:relative; top:90px;
      width:566px; height:356px; max-width:566px; max-height:356px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert2.png");
      background-size:100%;
      background-repeat:no-repeat;
      border:1px outset #d4d4d4; border-radius:20px;
    }
    #alerttitle {
      padding-top:1px;
      display:block;
      color:#27163a;
      text-align:center;
      line-height:15px;
      font-size:23px;
       border-radius:10px;
      height:21px; width:534px; max-height:21px; max-width:534px; overflow:hidden;
      position:absolute; top:8px; left:16px;
      user-select:none; pointer-events:none;
    }
    #alertcontentholder {
     background-color:#dedede;
      display:block;
      text-align:center;
      height:285px; width:530px; max-height:285px; max-width:530px; overflow:hidden;
      position:absolute; top:46px; left:19px;
      user-select:none; pointer-events:none;
    }
    #alertmaintext {
      background-color:#d6d5ff;
      padding-left:5px;
      display:block;
      text-align:left;
      line-height:25px; letter-spacing:5px; font-size:25px;
      height:210px; width:503px; max-height:210px; max-width:503px; overflow:hidden auto;
      position:absolute; top:14px; left:15px;
      user-select:auto; pointer-events:auto;  
    }
    #alertoption {
      padding-top:20px;
      background-color:#dedede;
      display:block;
      text-align:center;
      height:60px; width:531px; max-height:60px; max-width:531px; overflow:hidden;
      position:absolute; top:225px; left:0px;
      user-select:auto; pointer-events:auto;
    }
    #alertoption a {text-decoration:none;}
    .alertbtn {
      padding-left:5px; padding-right:5px;
      text-decoration:none;margin-left:8px;margin-right:8px;
      min-width:95px;
      height:17px;
      padding-bottom:20px;
      font-size:21px;
      line-height:20px;
    }
    .alertlnk {
      width:fit-content;
      height:fit-content;
    }
 
  
  /* alertbox */


    /* settings box */

      #Settingscontainer {
      background-color:black;
      position:absolute;top:0;left:0;z-index:6;
      width:100%;
      height:100%;
      overflow:hidden auto;
    }
    #Settingsbox {
      display:block; position:relative; top:20px; margin:auto;
      width:640px; height:633px; max-width:640px; max-height:633px;
    }
    #planetwebhead-sett {
      display:block; position:relative;top:0px;
      background-image:url("/img/rippedfrombrowser/top.png");
      background-size:105%;
      width:640px; height:55px; max-width:640px; max-height:55px;
    user-select:none; pointer-events:none; 
    }
    #bluehead {
      display:block;height:30px; width:649px; position:relative; top:5px;
      border-top-left-radius:13px; border-top-right-radius:15px;
       border-bottom-left-radius:1px; border-bottom-right-radius:4px;
      background-color:#0220a4;
      z-index:7; user-select:none; pointer-events:none;
     color:#FFF;
     padding-left:20px;
     text-shadow: 2px 2px 1px #000000d3;
     line-height:25px;
    }
    #Settingscontholder {
      text-align:center;
      display:block; position:relative; top:4px; border-top-left-radius:9px; border-top-right-radius:3px; border-bottom-left-radius:9px; border-bottom-right-radius:9px;
      z-index:8;
      min-height:450px; margin-bottom:4px;
      width:645px;
      background-color:#f7ffff;  outline:none;
    }
    /* yes im doing this much accuracy */
    #littleflapontopright{
      background-color:#f7ffff;
      position:absolute;top:0px; right:-2px; border-radius:4px;
      width:9px; height:10px;
    user-select:none; pointer-events:none; 
    }
      #littleflaponbottomright{
      background-color:#f7ffff;
      position:absolute;bottom:0px; right:-1px; border-top-left-radius:18px; border-bottom-right-radius:15px; border-bottom-left-radius:18px;
      width:23px; height:17px;
      user-select:none; pointer-events:none; 
    }
    #Settingsmain {
      background-color:inherit;
      background-size:contain;
      width:645px;max-width:645px;
      border-top-left-radius:9px; border-top-right-radius:inherit;
      height:385px; max-height:385px;
      overflow:hidden auto;
      user-select:auto; pointer-events:auto;
       outline:none;
    }
    #Settingsoptions {
      padding-top:5px;
      background-color:inherit;
      width:645px;max-width:645px;
      border-bottom-right-radius:15px;
      border-top-left-radius:0; border-top-right-radius:0; border-bottom-left-radius:9px;border-bottom-right-radius:9px;
      height:63px;
      overflow:hidden;
      user-select:auto; pointer-events:auto; 
      outline:none;
    }
      .settingsbtn {
      position:relative; bottom:5px;
      outline:0px !important;
      background-repeat:no-repeat;
      background-size:38px; background-position:3px 4px;
      border:2px solid; border-radius:10px; border-top-color:#6d7172; border-left-color:#3d4142; border-right-color:#535355; border-bottom-color:#575d5d;
      background-color:#ffffff; display:inline-block; margin-right:0px;
      min-height:55px; min-width:87px; width:fit-content; height:55px; max-height:55px;
      line-height:28px; color:#010101; text-shadow: 2px 3px 1px #c0c0c0; font-size:25px; text-decoration:none;
    }
    .spacer {position:absolute; top:0; left:0; width:100%; height:100%;} /* yes spacers in the big 25 */
    .settingsbtn:hover {
      background-repeat:no-repeat;
      background-size:38px; background-position:3px 4px;
    }
    .settingsbtn:active {
      background-repeat:no-repeat;
      background-size:38px; background-position:3px 4px;
    }
    .agree {
      background-image:url("/img/rippedfrombrowser/edited/btn_save.png")  !important;
      padding-left:45px;
    }
    .disagree {
      background-image:url("/img/rippedfrombrowser/edited/btn_cncl.png") !important;
      min-width:130px; max-width:140px;
      padding-left:45px;
    }

    #planetwebfooter-sett {
      display:block; position:relative;top:10px;
      background-image:url("/img/rippedfrombrowser/bottom.png");
      background-size:116%; background-position:-58px 0px;
      width:640px; height:57px; max-width:640px; max-height:57px;
      user-select:none; pointer-events:none;
    }


  /* settings box */

  /* errorbox */
    #errorboxbg {
          position:fixed;top:0;left:0;z-index:7;
      /*  background-color:black; */
      background-image:url("/img/background/darkbg-eztoseeebehind.png"); 
      width:100%;
      height:100%;
      overflow:hidden auto;
      transition:.3s ease-in-out;
  }
  .errorbox {
    background-image:url("/img/background/error.png");
    background-size:cover;
    border:1px solid #FFF;
    min-width:241px; min-height:63px;
    width:fit-content; height:fit-content; max-width:70%;
    padding-top:15px; padding-bottom:8px; padding-left:8px; padding-right:8px;
    position:relative;display:block; margin:auto; margin-top:4px; margin-bottom:4px;
    color:#FFF; font-size:17px; word-spacing:3px;
    line-height:20px;
  }
  /* errorbox */



  @media only screen and (max-width:536px) {
    #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:15px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.9);
      transform-origin:top left;
    }
  }

  @media only screen and (max-width:499px) {
        #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:25px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }

  @media only screen and (max-width:490px) {
      #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:25px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }

    @media only screen and (max-width:483px) {
        #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:15px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }

      @media only screen and (max-width:474px) {
          #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:10px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }

        @media only screen and (max-width:463px) {
            #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:4px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }

          @media only screen and (max-width:456px) {
              #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:4px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }
          @media only screen and (max-width:442px) {
              #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:4px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.8);
      transform-origin:top left;
    }
  }

          @media only screen and (max-width:439px) {
              #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:20px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.7);
      transform-origin:top left;
    }
  }

          @media only screen and (max-width:426px) {
              #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:13px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.7);
      transform-origin:top left;
    }
  }

          @media only screen and (max-width:413px) {
              #alertcontentholder {overflow: hidden auto;}
    #alertbox {
      display:block;
      position:relative; top:90px; left:7px;
      width:566px; height:362px; max-width:566px; max-height:362px;
      margin:auto;
      /*background-color:Red;*/
      background-image:url("/img/background/alert.png");
      background-size:100%;
      background-repeat:no-repeat;
      transform:scale(0.7);
      transform-origin:top left;
    }
  }

          @media only screen and (max-width:635px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-8px;
      width:640px; height:633px; max-width:640px; max-height:633px;
      transform:scale(0.9); transform-origin:top center;
    }
  }
  
  

          @media only screen and (max-width:600px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-25px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.8); transform-origin:top center;
    }
  }
  
          @media only screen and (max-width:541px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-53px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.8); transform-origin:top center;
    }
  }
  
          @media only screen and (max-width:513px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-65px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.7); transform-origin:top center;
    }
  }
  
          @media only screen and (max-width:471px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-85px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.7); transform-origin:top center;
    }
  }

          @media only screen and (max-width:453px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-95px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.7); transform-origin:top center;
    }
  }
          @media only screen and (max-width:444px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-98px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.6); transform-origin:top center;
    }
  }
  
          @media only screen and (max-width:406px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-118px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.6); transform-origin:top center;
    }
  }
  
          @media only screen and (max-width:388px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-125px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.6); transform-origin:top center;
    }
  }
  
          @media only screen and (max-width:380px) {
    #Settingscontainer {overflow: auto hidden;}
      #Settingsbox {
      display:block; position:relative; top:20px; margin:auto; left:-130px;
      width:640px; height:633px; max-width:640px; max-height:633px; 
      transform:scale(0.5); transform-origin:top center;
    }
  }
  
  .e {display:inline-block; word-wrap:none; font-size:50px; color:#f1fafa;opacity:30%; margin-top:50px; line-height:1px; }
  .ee {font-family:"Comic Sans MS" !important;}