Beastly Template

<!DOCTYPE html>
<html>
  <head>

  <style>

    /* "BEASTLY V.1.0" Template, send any questions to [email protected]! Powered by long bass guitar solos. */

  /* Style body and background here.
  Background displays on the left */
body {
    padding:0;
    padding-right:0px;
    margin:0;
    background: black;
    background-image: url('BACKGROUND URL');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
    font-family: "ms ui gothic";
    font-size:16px;
}

/* This wraps around .text and makes it so the background is black. I just realized while typing this that I could've just done background-color. I may be stupid!
At least with this weird mess you can set a border I guess...? */
.container {
  padding: 0px;
  margin: 0px;
  vertical-align: top;
  margin-left: auto;
  margin-right: 0;
  text-align: right;
  background: black;
  color: white;
  max-width: 1393px;
}

/* You can change the look of the main text here.
This is for setting the width of the text area. */
.text {
  padding: 0px;
  margin: 0px;
  vertical-align: top;
  text-align: left;
  background: black;
  color: white;
  max-width: 700px;
}

  /* Changes the .title text. */
.title  {
  color: rgba(223, 0, 43, 1);
  font-family: "Mael";
  font-size: 80px;
}

/* Changes the look of the div that contains the links.
The background is a gradient, you can change it here.*/
.navDiv {
  margin: 0px;
  padding: 0px;
  background: #600010;
  background: linear-gradient(360deg,rgba(96, 0, 16, 1) 45%, rgba(223, 0, 43, 1) 90%);
  text-align: center;
  border-radius: 30px;
  padding-bottom: -20px;
}

/* Changes the look of visited links */
a:visited {
  color: #f9d73b;
  background-color: transparent;
  text-decoration: underline;
  font-weight: bold;
}

/* Changes the look of links. */
a:link {
  color: #f9d73b;
  background-color: transparent;
  text-decoration: underline;
  font-weight: bold;
}

/* Style h2 here. */
h2 {
  font-size:18px;
  font-family:"ms gothic";
  padding-left: 20px;
  color: rgba(223, 0, 43, 1);
}

/* Style paragraphs here. */
p {
  padding-left: 10px;
  padding-right: 10px;
}

/* You can add custom fonts here.
"font-family" is the name you denote to your font, it can be anything, it doesn't have to match the file name.
I recommend placing the font in a font sub-folder on your NeoCities dashboard. */
    @font-face {
      font-family: "CUSTOM FONT";
      src: url(FONT URL);
    }


</style>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>TITLE</title>
      <link rel="icon" type="image/x-icon" href="FAVICON URL">
  </head>


<div class="container">

<center>

<div class="text">

<br>

<div class="title"> TITLE </div>

<div class="navDiv">
<nav>
LINK 1 ✧ LINK 2 ✧ LINK 3✧ LINK 4 ✧ LINK 5 ✧ LINK 6 ✧ LINK 7 ✧ LINK 8
</nav>

</div>

<br>


<p style="text-align: center"> Template by <a href="https://recarmdra.neocities.org/">recarmdra</a>. </p>

<br>


</div>

</center>

</div>


  </body>
</html>