HTML/CSS - Game Contest Online Editor and JavaScript Compiler

html

<!-- 
    Created by Jadene Onobun
     Owned by Jadene & Kayla Onobun 
-->
     
     
<!DOCTYPE html>
<html>
    <head>
        <title>Game contest</title>
        <link href='https://fonts.googleapis.com/css?family=Aguafina Script|Akronim|Aldrich|Alegreya|Alex Brush|Allerta Stencil|Allura|Almendra SC|Amethysta|Annie Use Your Telescope|Arbutus|Arizonia|Asset|Astloch|Bad Script|Barrio|Bellefair|Berkshire Swash|Bilbo|BioRhyme Expanded|Bonbon|Butcherman|Butterfly Kids|Caveat|Charmonman|Cinzel Decorative|Codystar|Crafty Girls|Dawning of a New Day|Faster One|Frijole|Geostar|Give You Glory|Hi Melody|Italianno|Jacques Francois Shadow|KhandMajor Mono Display|Meddon|Miltonian|Monofett|Monoton|Mystery Quest|Nosifer|Orbitron|Petit Formal Script|Sacramento|Shadows Into Light Two|Snowburst One|Dancing Script|Vibur|Raleway|Iceberg' rel='stylesheet'>
        <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    </head>
    <body>
        <div class="loader">
            <img src = "https://dl.dropbox.com/s/09ladra8tf0jclk/Loader.png" alt="Loader" border="0">
        </div>
        
        <div class="statusBar" onload="showTime()" id="MyClockDisplay" style="display: none;"></div>
        <h1 class="ques">Are You Ready For A game 🕹️ Blast?</h1>
        
        <h2 align="center" class="rule"><button class="rule-button" onclick="rules()">🕹️ RULES</button></h2>
        
        <div id="rules">
            <ol>
                <li>Don't copy other codes, your submitted codes should be made yourself.</li><br>
                <li>One person per code</li><br>
                <li>The contest will last for 30 days i.e. from the 15th of the August, 2020 to the 15th of September, 2020</li><br>

css

body {
    background:linear-gradient(to bottom,  #123,  blue,  darkblue);
    background-color:  darkblue;
    background-repeat: no-repeat;
}
.loader{
    height:100vh;
    width:100vw;
    position:fixed;
    background: #fff;
    z-index:999;
    top: 0%;
    left: 0%;
}
.loader img{
    top:50%;
    left: 50%;
    width: 100vw;
    position:absolute;
    transform:translate(-50%,-50%);
}
.ques {
    color:  white;
    text-align: center;
}
.rule-button {
    font-size: 30px;
    background-color:  deepskyblue;

BROWSER

Console