README.html

<div class=content>
  <div class="wrapper-1">
    <div class="wrapper-2">
      <h1>Thank you!</h1>
      <p>Thank you for downloading Nexus 1.6.1!</p>
      <p>In this page you will find a quick start-up guide.</p>
      <p>Need help? Please join our Discord for support.</p>
      <button class="go-home" onclick="window.location.href='https://resourcemc.net/discord'"">
      Discord
      </button>
    </div>
    <div class=" footer-like">
        <p>Did you like this resource?
          <a
            href="https://namelessmc.com/resources/resource/162-nexus-template--available-for-free--supported-for-pre10/">Please
            leave a 5-star review :)</a>
        </p>
    </div>
  </div>
</div>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css">

<div class="container my-5">
  <section id="steps">
    <div class="text-center mb-5">
      <span>STEPS</span>
      <h2 class="font-weight-bold display-4 ">How It <span style=" color: #9B5DE5">Works?</span></h2>
    </div>
    <div class="row">
      <div class="col-md-4">
        <div class="bg-light position-relative px-3 my-5">
          <div
            class="font-weight-bold circle text-white rounded-circle d-flex align-items-center justify-content-center mx-auto position-relative border border-white"
            style="width: 60px;height: 60px;top: -30px;border-width: 4px !important; background-color: #9B5DE5">
            1
          </div>
          <div class="px-3 text-center pb-3">
            <h4>Upload</h4>
            <p class="font-weight-light my-3">Upload "custom" and the "modules" folder to your NamelessMC Root directory
              (public_html, html, htdocs)</p>
          </div>
        </div>
      </div>
      <div class="col-md-4">
        <div class="bg-light position-relative px-3 my-5">
          <div
            class="font-weight-bold circle text-white rounded-circle d-flex align-items-center justify-content-center mx-auto position-relative border border-white"
            style="width: 60px;height: 60px;top: -30px;border-width: 4px !important; background-color: #9B5DE5">
            2
          </div>
          <div class="px-3 text-center pb-3">
            <h4>Installing Template</h4>
            <p class="font-weight-light my-3">Open your NamelessMC dashboard => Layout => Templates => Click on
              "Install" - Enable after you've installed it.</p>
          </div>
        </div>
      </div>
      <div class="col-md-4">
        <div class="bg-light position-relative px-3 my-5">
          <div
            class="font-weight-bold circle text-white rounded-circle d-flex align-items-center justify-content-center mx-auto position-relative border border-white"
            style="width: 60px;height: 60px;top: -30px;border-width: 4px !important; background-color: #9B5DE5">
            3
          </div>
          <div class="px-3 text-center pb-3">
            <h4>Installing Backend</h4>
            <p class="font-weight-light my-3">Open your NamelessMC dashboard => Modules => Click on "Install" - Enable
              after you've installed it. You're done :)</p>
          </div>
        </div>
      </div>
    </div>
  </section>
</div>

<link href="https://fonts.googleapis.com/css?family=Kaushan+Script|Source+Sans+Pro" rel="stylesheet">
<style>
  * {
    box-sizing: border-box;
    /* outline:1px solid ;*/
  }

  body {
    background: #ffffff;
    background: linear-gradient(to bottom, #ffffff 0%, #e1e8ed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e1e8ed', GradientType=0);
    height: 100%;
    margin: 0;
    background-repeat: no-repeat;
    background-attachment: fixed;

  }

  .wrapper-1 {
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
  }

  .wrapper-2 {
    padding: 30px;
    text-align: center;
  }

  h1 {
    font-family: 'Kaushan Script', cursive;
    font-size: 4em;
    letter-spacing: 3px;
    color: #9B5DE5;
    margin: 0;
    margin-bottom: 20px;
  }

  .wrapper-2 p {
    margin: 0;
    font-size: 1.3em;
    color: #aaa;
    font-family: 'Source Sans Pro', sans-serif;
    letter-spacing: 1px;
  }

  .go-home {
    color: #fff;
    background: #9B5DE5;
    border: none;
    padding: 10px 50px;
    margin: 30px 0;
    border-radius: 30px;
    text-transform: capitalize;
    box-shadow: 0 10px 16px 1px rgba(174, 199, 251, 1);
  }

  .footer-like {
    margin-top: auto;
    background: #D7E6FE;
    padding: 6px;
    text-align: center;
  }

  .footer-like p {
    margin: 0;
    padding: 4px;
    color: #9B5DE5;
    font-family: 'Source Sans Pro', sans-serif;
    letter-spacing: 1px;
  }

  .footer-like p a {
    text-decoration: none;
    color: #9B5DE5;
    font-weight: 600;
  }

  @media (min-width:360px) {
    h1 {
      font-size: 4.5em;
    }

    .go-home {
      margin-bottom: 20px;
    }
  }

  @media (min-width:600px) {
    .content {
      max-width: 1000px;
      margin: 0 auto;
    }

    .wrapper-1 {
      height: initial;
      max-width: 620px;
      margin: 0 auto;
      margin-top: 50px;
      box-shadow: 4px 8px 40px 8px rgba(88, 146, 255, 0.2);
    }

  }

  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

  body {
    font-family: 'Poppins', sans-serif !important;
  }

  a:hover {
    text-decoration: none;
  }
</style>