Just Galactic Things

<p><iframe allowfullscreen="" frameborder="0" height="1" src="//www.youtube.com/embed/_4kHxtiuML0?autoplay=1&amp;loop=1&amp;playlist=_4kHxtiuML0" width="1" wmode="transparent"></iframe></p>
<style>
  @font-face {
    font-family: 'Balnuettes';
    src: url('https://cdn.statically.io/gh/Asmera25/balnuettes/main/Balnuettes.otf') format('woff2'),
      url('https://cdn.statically.io/gh/Asmera25/balnuettes/main/Balnuettes.otf') format('woff');
    font-weight: normal;
    font-style: normal;
  }

  @font-face {
    font-family: 'Majalla';
    src: url('https://cdn.statically.io/gh/Asmera25/SakkalMajalla/main/majalla.ttf') format('woff2'),
      url('https://cdn.statically.io/gh/Asmera25/SakkalMajalla/main/majalla.ttf') format('woff');
    font-weight: normal;
    font-style: normal;
  }

  ::-webkit-scrollbar {
    display: none;
  }

  @keyframes fadeIn {
    0% {
      opacity: 0
    }

    100% {
      opacity: 1;
    }
  }

  ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px black;
    border-radius: 10px;
  }


  ::-webkit-scrollbar-thumb {
    background: #8bb9dd;
    border-radius: 10px;
  }


  ::-webkit-scrollbar-thumb:hover {
    background: #2a628f;
  }

  ::-webkit-scrollbar-corner {
    width: 5px;
  }

  .background {
    background: rgba(0, 0, 0, .6);
    background-size: cover;
    object-fit: cover;
    background-position: top center;
    background-attachment: fixed;
    height: auto;
    width: 800px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: auto;
    margin-top: -40px;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    color: #fff;
    border: 5px ridge #bc9d58;
    box-shadow: 5px 10px 5px #000;
  }

  .bg2 {
    background: rgba(0, 0, 0, .6);
    background-size: cover;
    background-position: top center;
    background-attachment: fixed;
    height: 860px;
    width: 750px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: auto;
    margin-top: 200px;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    color: #fff;
    box-shadow: 10px 10px 10px #000;
  }

  .body {
    background: #9c9c9c;
    height: auto;
    width: 44%;
    padding: 10px;
    margin-top: -1040px;
    margin-left: 200px;
    float: center;
    text-align: justify;
    border: 2px ridge #bc9d58;
    box-shadow: 5px 10px 5px #000;
  }

  .body2 {
    background: #9c9c9c;
    height: 650px;
    width: 200px;
    padding: 10px;
    margin-top: 50px;
    float: right;
    text-align: left;
    border: 2px ridge #bc9d58;
    box-shadow: 5px 10px 5px #000;
    overflow: scroll;
    overflow-x: hidden;
  }

  .title {
    font-family: 'Balnuettes';
    color: #bc9d58;
    font-size: 80px;
    text-align: center;
    text-shadow: 2px 1px 3px #000;
  }

  .text {
    font-family: 'Majalla';
    color: #000;
    font-size: 22px;
    padding: 10px;
  }

  .titles {
    text-align: center;
    font-family: 'Balnuettes';
    font-size: 30px;
    color: #bc9d58;
    text-shadow: 1px 2px 2px #000;
  }

  * {
    box-sizing: border-box;
  }

</style>
<center>
  <div class="title">Course Name</div>
</center>

<div class="background">
  <div class="bg2">
    <div class="body2">
      <div class="text">
        <div class="titles">Assignment</div>
        - Question 1<br>
        - Question 2<br>
        - Question 3<br>
        - Question 4<br>

        <div class="titles">Requirement</div>
        - Write in RPG format.<br>
        - Do no plagiarize, it will result in a toll grade.<br>
        - Remember to state your sources, even it is your imagination.<br>
        - Send an Owl to <b style="color:#255e3c">Teacher Name</b> if you require help with anything.
      </div>
    </div>
    <img alt="pfp" src="" style="float:center; height:650px; width:170px; object-fit:cover; margin-top:50px; margin-bottom:50px; border-left: 4px ridge #bc9d58; border-top: 4px ridge #bc9d58; border-bottom: 2px ridge #000; border-right: 2px ridge #000; box-shadow: 5px 10px 5px #000;">
  </div>

  <div class="body">
    <div class="text">
      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br><br>

      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br><br>

     Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <b style="color:#744d4d;">“Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.”</b> Ade said as she began the lecture planned for the day.<br><br>

      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br><br>

      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </div>
  </div><br>

  <center><a href="https://alacodes.tumblr.com/" style="text-decoration:none; color:#fff; text-shadow:1px 1px 1px #000; font-family:'Magneto'" target="_blank">Coded by Ala</a></center>
</div>