//Put this in it's own file
<style>
      @font-face{
      font-family: "CYBERTOOTH";
      src: url('/styles/templates/Custom1/fonts/CYBERTOOTH.ttf');
      }
      @font-face{
      font-family: "Roboto";
      src: url('/styles/templates/Custom1/fonts/Roboto-Light.ttf');
      }
      .banner {
        height: 75vh;
        background-attachment: fixed;
        background-position: center;
        background-image: url("core/assets/img/background-1920x1080.jpg");
        background-size: 100% 100%;
      }
      .textbanner {
        font-family: "CYBERTOOTH";
        font-size: 13vh;
        padding-top:20vh;
        color: white;
        text-align: center;
}
       @media (max-width: 600px) {
        .textbanner {
        font-family: "CYBERTOOTH";
        font-size: 10vh;
        padding-top:20vh;
      }
      .text {
        color: white;
        font-family: "Roboto";
        font-size: 6vh;
}
</style>
//Replace Jumbotron stuff with banner and textbanner class (Also text class for other lines)
  <div class="banner">
    <div class="textbanner">{$SITENAME}</h1>
        <h2 class="text">{$PLAYERS_ONLINE}</h2>
        <h2 class="text">{$CONNECT_WITH}</h2>
  </div>