/* ------------------------------ HELLO ------------------------------ */
/* ------------------------------ HELLO ------------------------------ */
/* ------------------------------ HELLO ------------------------------ */
/* --------------------------- THIS IS FOR --------------------------- */
/* ------------------------- COLORLUNE  2.0! ------------------------- */
/* ------------------------ NORMAL SCREEN ED. ------------------------ */
/* ----------------------------- Thanks! ----------------------------- */
/* ------------------------------ HELLO ------------------------------ */
/* ------------------------------ HELLO ------------------------------ */
/* ------------------------------ HELLO ------------------------------ */

 body {
    font-family: Inter, sans-serif;
    font-size: 1em; text-align: justify; text-justify: inter-word;
    color: #332532;
    background-color: #332532;
    padding: 0.5%; margin: 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
  }
    
  h1 { color: #332532; font-family: Rock Salt; padding: 0; margin: 0; }
  h2, h3 { color: #332532; font-family: Permanent Marker; padding: 0; margin: 0; }
    
  A:link { text-decoration: none; color:#332532; }
  A:visited { text-decoration: none; color:#332532; }
  A:active { text-decoration: none; color:#332532; }
  A:hover { text-decoration: line-through; color:#332532; }
  #short:hover, #long:hover { 
    background-color: #ffffffcc !important; 
    text-decoration: line-through; 
    color:#332532;
    }
  
  #wrapper {
    background-color: #644d52;
    background-image: url("/colorlune/tartan2.png");
    width: 100%; height: 100%;
    padding: 0.5%; margin: 0;
    border-radius: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    overflow: hidden;
  }
    
  #navigation { display: none; }
  #navigation h2, #navigation h3 { display: none; }
  #short { display: none; }
  #long { display: none; }
  #title { display: none; }
  #hideme { display: none; }
    
  .MOBdropdown {
    background-color: #a49a87cc;
    width: 100%; height: auto;
    padding: 0.5%; margin: 0;
    text-align: center;
    border-top: #332532 3px solid;
    border-bottom: #332532 3px solid;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
  }

  select {
    width: 250px; height: auto;
  }
    
  #content {
    background-color: transparent;
    width: 100%; height: 100%;
    padding: 0.5%; margin: 0 0.5% 0 0;
    text-align: center;
    overflow-x: hidden; overflow-y: scroll;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    float: right;
  }
    
  #mainbox {
    background-color: #a49a87cc;
    width: 70%; height: auto;
    padding: 0.5%; margin: 0;
    border: 1px #332532 solid;
    border-radius: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    text-align: left;
  }
    
  #mainbox img {
    width: 100px; height: 100px;
    padding: 0; margin: 0 0.5em 0.5em 0.5em;
    float: left;
  }
    
  #yapper {
    background-color: #ffffff33;
    width: 100%; height: 100px;
    padding: 0.5em; margin: 0;
    border-radius: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    overflow: auto;
  }
    
  #imgbox {
    display: inline-block;
    background-color: #a49a87cc;
    padding: 0.5%; margin: 0.5%;
    border-radius: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    text-align: center;
  }
    
  #imgbox img {
    width: 300px; height: 300px;
    padding: 0; margin: 0;
  }

  #minibox {
    display: inline-block;
    background-color: #a49a87cc;
    padding: 0.5%; margin: 0.5%;
    border-radius: 15px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    text-align: center;
  }
  
  #minibox img {
    width: 100px; height: 100px;
    padding: 0; margin: 0;
  }