Him & I (thread)

[dohtml]
<link href="https://fonts.googleapis.com/css?family=Oswald|Abril+Fatface" rel="stylesheet">

<style>
#blckwht{
  width: 420px;
  height: 580px;
  margin: 0px auto;
  outline: 1.5px solid #000;
  border: 3px solid #fff;
  position: relative;
  background: #fff;
}

#blckwht .base{
  width: 360px;
  height: 520px;
  background: #fff;
  position: relative;
  top: 30px;
  border: 0.5px solid #000;
}

#blckwht .header{
  position: absolute;
  width: 360px;
  height: 85px;
  border-bottom: 0.5px solid #000;
  top: 69px;
  left: 30px;
  font-family: 'Abril Fatface', cursive;
  font-size: 45px;
  text-transform: uppercase;
  line-height: 40px;
  letter-spacing: 2px;
  color: #fff;
  text-shadow: 2px 1px #000;
}
#blckwht .header c{
  color: #8EA076;
  font-size: 55px;
  text-shadow: 1px 1px #fff;
}

#blckwht .lyric{
  position: absolute;
  width: 426px;
  height: 24px;
  border-bottom: 1px solid #000;
  top: 167px;
  left: -3px;
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 3px;
  line-height: 12px;
  font-weight: bold;
  color: #000;
}
#blckwht .lyric c{
  color: #8EA076;
}

#blckwht .textbox{
  position: absolute;
  width: 170px;
  height: 290px;
  top: 225px;
  right: 60px;
  overflow: auto;
  text-align: justify;
  font-family: 'Times';
  font-size: 11px;
  line-height: 13px;
  letter-spacing: 0px;
  padding-right: 5px;
  color: #000;
}
#blckwht .textbox b{
  color: #8EA076;
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

#blckwht .sidebar{
  position: absolute;
  width: 120px;
  height: 325px;
  border-right: 0.5px solid #000;
  top: 210px;
  left: 27px;
  overflow: auto;
  text-align: justify;
  font-family:
  font-size: 11px;
  line-height: 12px;
  text-align: center;
}
#blckwht .words{
  position: absolute;
  top: 100px;
  left: 37px;
  font-family: 'Oswald', sans-serif;
  font-size: 9px;
  line-height: 15px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-style: italic;
}
#blckwht .words c{
  color: #8EA076;
  font-size: 23px;
  font-family: 'Abril Fatface', cursive;
  letter-spacing: 0px;
  text-transform: lowercase;
}
#blckwht .words a{
  font-style: normal;
  font-size: 8px;
  text-decoration: none;
  color: #000;
  letter-spacing: 2px;
  font-style: italic;
}

#blckwht ::-webkit-scrollbar {
  width: 0px;
}

#blckwht ::-webkit-scrollbar-track {
  background: #000;
  border: 0.5px solid #000;
}

#blckwht ::-webkit-scrollbar-thumb {
  background: #000;
  border: 0.5px solid #000;
}

</style>

<center>
<div id="blckwht">

  <div class="base"></div>

  <div class="header">him <c>&</c> i</div>

  <div class="lyric">
     We got that <c>love</c>, the <c>crazy</c> kind
  </div>

  <div class="sidebar">
    <div class="words">
    <c>tags;</c><br><br>
    ## put <br>
    some tags <br>
    or notes <br>
    here #

    <br><br><a href="https://shadowplayers.jcink.net/index.php?showuser=95" title="hanie ©">/////////</a>

    </div>
  </div>

  <div class="textbox">
    <b>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b>  Proin varius est vitae dui maximus, vel commodo ante vulputate. Sed vitae nisi nec diam efficitur bibendum nec at arcu. Nullam at finibus dolor. Maecenas ipsum ligula, pretium et egestas vel, dignissim a ante. Nunc varius dui nulla, sed blandit enim pulvinar vel. Vestibulum eleifend odio sit amet eros pretium faucibus. Curabitur consectetur urna eu est laoreet interdum. Integer libero eros, fermentum suscipit lacinia ut, consequat ac urna.
    <p>
    Donec ut lobortis purus, ut rutrum quam. <b>Aenean fermentum est at lobortis tincidunt.</b> Sed nunc augue, facilisis at iaculis lobortis, accumsan nec enim. Morbi sed aliquam sem, ut ullamcorper mauris. Sed ultrices dui quis mauris aliquam dictum. Suspendisse eu sollicitudin tellus, pharetra efficitur dui. Nam quam metus, sagittis nec ligula at, egestas finibus augue. Duis accumsan ultricies velit eu aliquet.
    <p>
    Fusce accumsan venenatis metus, eu faucibus nibh auctor at. Cras vitae magna ligula. Curabitur commodo consequat facilisis. Suspendisse a libero massa. Vestibulum rutrum sollicitudin nisl eget interdum. Nam sed erat dictum, ullamcorper ex eu, accumsan urna. Sed cursus posuere feugiat. Nunc consectetur laoreet erat maximus porttitor. Cras et ipsum quis odio scelerisque volutpat.
  </div>

</div>
</center>
[/dohtml]