Your Majesty (thread)

<style>
#yourmajesty-thread{
  position: relative;
  margin: 10px auto;
  overflow: hidden;
  width: 502px;
  height: 602px;
}

#yourmajesty-thread .base{
  position: relative;
  width: 500px;
  height: 600px;
  background: #FAF0FF;
  border: 1px solid #222222;
}

#yourmajesty-thread .crown{
  position: absolute;
  width: 170px;
  height: 100px;
  top: 0px;
  left: 0px;
  background: #222222;
  border: 1px solid #222222;
}
#yourmajesty-thread .sf{
  font-size: 110px;
  color: transparent;
  -webkit-text-stroke: 2px #444444;
  margin-left: 0px;
  display: inline block;
  line-height: 180px;
}

#yourmajesty-thread .avatar{
  position: absolute;
  width: 170px;
  height: 300px;
  top: 100px;
  left: 0px;
  background: #eeeeee;
  border: 1px solid #222222;
  overflow: hidden;
}

#yourmajesty-thread .avatar img{
  margin-top: 0.5px;
  width: 169.5px;
  height: 300px;
}

#yourmajesty-thread .lyrics-box{
  position: absolute;
  width: 170px;
  height: 200px;
  top: 400px;
  left: 0px;
  background: #FAF0FF;
  border: 1px solid #222222;
  overflow: hidden;
}
#yourmajesty-thread .lyrics{
  position: absolute;
  width: 90px;
  height: 140px;
  top: 60px;
  left: 40px;
  text-align: justify;
  color: #000000;
  font-family: 'Cardo', serif;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 18px;
}

#yourmajesty-thread .textbox{
  position: absolute;
  width: 188px;
  height: 400px;
  top: 50px;
  right: 50px;
  background: #FAF0FF;
  border: 10px solid #FAF0FF;
  padding-right: 17px;
  overflow: auto;
  text-align: justify;
  color: #000000;
  font-family: 'Cardo', serif;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 18px;
}
#yourmajesty-thread .textbox b{
  font-size: 22px;
  background: #FAF0FF;
  padding: 20px;
  width: 15px;
  float: left;
  margin-right: 17px;
}

#yourmajesty-thread .notes{
  position: absolute;
  width: 330px;
  height: 50px;
  bottom: 0px;
  right: -1px;
  background: #222222;
  border: 1px solid #222222;
  padding-top: 30px;
}

#yourmajesty-thread .notes c{
  color: #FAF0FF;
  font-family: 'Cardo', serif;
  font-size: 10px;
  line-height: 10px;
  background: #333333;
  padding: 7px;
  border: 1px solid #444444;
  border-radius: 3px;
  margin: 5px;
}

#yourmajesty-thread .notes a{
  color: #FAF0FF;
  text-decoration: none;
}

#yourmajesty-thread ::-webkit-scrollbar {
  width: 8px;
}

#yourmajesty-thread ::-webkit-scrollbar-track {
  background: #FAF0FF;
}

#yourmajesty-thread ::-webkit-scrollbar-thumb {
  background: #333333;
  border-top: 1px solid #333333;
  border-left: 3px solid #FAF0FF;
  border-right: 3px solid #FAF0FF;
  border-bottom: 1px solid #333333;
}

#yourmajesty-thread ::-webkit-scrollbar-button{
  background: #FAF0FF;
  height: 6px;
}</style>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Cardo:wght@400;700&family=Playfair+Display&display=swap" rel="stylesheet">

<center>
<div id="yourmajesty-thread">

  <div class="base"></div>
  <div class="crown"><span class="sf sf-crown-o"></span></div>

  <div class="avatar">
    <a href="https://shadowplayers.jcink.net/index.php?showuser=95" title="Hanie ©">
       <img src="https://via.placeholder.com/170x300"></a>
  </div>

  <div class="lyrics-box">
      <div class="lyrics">Put your short lyrics here.
      </div>
  </div>

  <div class="textbox">
    <b>L</b>orem ipsum dolor sit amet, consectetur adipiscing elit. Etiam justo eros, sagittis ac aliquam elementum, placerat vel magna. Suspendisse scelerisque gravida accumsan. Mauris aliquet velit ac risus suscipit varius. Integer sed nibh aliquet, semper ex ut, ullamcorper nibh. Aliquam nisl nisi, luctus lacinia orci eu, elementum semper lectus. Praesent tristique suscipit ex. Morbi libero est, aliquet condimentum tristique a, lacinia a sem.
    <br><br>
     Phasellus id risus eget tortor consequat sodales non at nisl. Aenean suscipit faucibus mattis. Phasellus eget interdum velit. Vivamus enim nulla, volutpat in ipsum id, egestas lacinia sem. Nunc rutrum scelerisque dolor, sit amet fringilla diam aliquam et. Sed ac pellentesque magna. Vestibulum quis interdum nibh. Mauris in laoreet magna. Donec nec aliquet risus, id efficitur mi. Integer ac mi ultrices, dictum nisi eget, accumsan enim. In massa nisi, porta a dignissim nec, semper at eros. Donec vitae tellus sed sapien cursus tristique. Aliquam sed ligula non mauris auctor bibendum. Interdum et malesuada fames ac ante ipsum primis in faucibus.
    <br><br>
    Proin faucibus pulvinar diam et rhoncus. Morbi convallis, tellus vitae pulvinar semper, quam libero porttitor lectus, eu porta diam mauris nec nibh. Nulla a nunc tempor, auctor leo varius, feugiat turpis. In ut pulvinar justo. Donec in malesuada urna. Curabitur sit amet nunc eleifend, auctor magna facilisis, ultricies sem. Integer non finibus justo. Duis placerat non lacus ut elementum. Praesent dignissim vulputate quam non consequat. Maecenas non aliquam nulla. Donec euismod, mi a vehicula rutrum, ligula enim ultrices tortor, non tincidunt augue eros vitae massa.
  </div>

  <div class="notes">
    <c><b>TAGS:</b> @@</c> <c><b>WORDS:</b> ##</c>
  </div>

</div>
</center>