RemindMe page

custom.html

<style>
body {
    background: linear-gradient(-45deg, #6495ed, #fa8072) no-repeat center center fixed;
    background-size: 170% 170%;
    -webkit-animation: background 19s ease infinite;
    -moz-animation: background 19s ease infinite;
    -o-animation: background 19s ease infinite;
    animation: background 19s ease infinite;
}

#site-header .site-header-toprow {
    box-shadow: none !important;
    background: transparent !important;
}

#site-header {
    background: transparent !important;
}

@-webkit-keyframes background {
    0% {
        background-position: 0% 51%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 51%
    }
}

@-moz-keyframes background {
    0% {
        background-position: 0% 51%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 51%
    }
}

@-o-keyframes background {
    0% {
        background-position: 0% 51%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 51%
    }
}

@keyframes background {
    0% {
        background-position: 0% 51%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 51%
    }
}

@media (max-width: 880px) {
    #site-header #site-nav a {
        background: transparent !important;
    }
}

#fuckyoumelmsie {
    padding: 2%;
    font-size: 1.85rem;
}

td, th {
    font-weight: 575;
    font-size: 1.15rem;
    text-align: left;
    width: 350px;
    padding-bottom: 1%;
    padding-top: 1%;
    vertical-align: top;
}

.short {
    width: 125px;
}

table {
    table-layout: fixed;
    position: relative;
    align: center;
}

.card {
    background: #fff;
    border-radius: 4px;
    display: inline-block;
    position: relative;
}

.card-1 {
    background: rgba(255, 255, 255, 0.15);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.card-1:hover {
    background: rgba(255, 255, 255, 0.25);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}
</style>

<p id="fuckyoumelmsie">
    RemindMeBot does exactly what it says on the tin; a reminder bot. As a specialized bot, you can be assured RemindMeBot does a top notch job. With features like allowing you to set reminders using whichever method suits you best, viewing current reminders
    and forgetting them, custom prefixes per guild and (soon) very much more, RemindMeBot is unparalleled in his field.
</p>

<h4 class="ui horizontal divider header">
  Commands
</h4>

<div class="card card-1">
    <table border="1" frame="void" rules="rows">
        <thead>
            <tr>
                <th class="short">Command</th>
                <th>Usage</th>
                <th>Info</th>
                <th>Example</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td class="short">help</td>
                <td>r&gt;help or @RemindMeBot help</td>
                <td>Returns a help message to get you started with RemindMeBot.</td>
                <td><code>r&gt;help</code></td>
            </tr>

            <tr>
                <td class="short">remindme</td>
                <td>r&gt;remindme [&lt;time argument&gt; "&lt;message&gt;"]</td>
                <td>Creates a reminder. Pass without args to start a guided tour.</td>
                <td><code>r&gt;remindme 12 hours "Buy groceries"</code></td>
            </tr>

            <tr>
                <td class="short">list</td>
                <td>r&gt;list</td>
                <td>Sends you your current reminders in DM. Note: will send in channel if DMs are disabled.</td>
                <td><code>r&gt;list</code></td>
            </tr>

            <tr>
                <td class="short">clear</td>
                <td>r&gt;clear</td>
                <td>Starts a guided tour to clear all of your reminders.</td>
                <td><code>r&gt;clear</code></td>
            </tr>
            
            <tr>
                <td class="short">forget</td>
                <td>r&gt;forget</td>
                <td>Starts a guided tour to forget one of your reminders.</td>
                <td><code>r&gt;forget</code></td>
            </tr>

            <tr>
                <td class="short">prefix</td>
                <td>r&gt;prefix &lt;desired prefix&gt;</td>
                <td>Changes your prefix to the given argument.</td>
                <td><code>r&gt;prefix !!</code></td>
            </tr>

            <tr>
                <td class="short">invite</td>
                <td>r&gt;invite</td>
                <td>Returns an invite for RemindMeBot.</td>
                <td><code>r&gt;invite</code></td>
            </tr>

            <tr>
                <td class="short">ping</td>
                <td>r&gt;ping</td>
                <td>Returns the Websocket ping to the API servers in ms.</td>
                <td><code>r&gt;ping</code></td>
            </tr>

            <tr>
                <td class="short">stats</td>
                <td>r&gt;stats</td>
                <td>Returns information and statistics about RemindMeBot.</td>
                <td><code>r&gt;stats</code></td>
            </tr>

    </table>
</div>

<br>
<h4 class="ui horizontal divider header">
  Links
</h4>
<br>

<div style="position: relative; left: 30px;" class="ui buttons">

    <a href="https://discordapp.com/invite/Yphr6WG" class="ui button">
      Support server
    </a>
    <div class="or"></div>
    <a href="https://github.com/Aetheryx/remindme" class="ui vertical animated button" tabindex="0">
        <div class="visible content">GitHub</div>
        <div class="hidden content">
            <i class="github icon"></i>
        </div>
    </a>
    <div class="or"></div>

    <a href="https://discordapp.com/oauth2/authorize?permissions=27648&scope=bot&client_id=290947970457796608" class="ui button">
      Invite me to your guild!
    </a>

</div>

<br>
<br>