Move ASGI card item to bulma notification at the top

Author: Bluenix2

pydis_site/templates/events/pages/code-jams/9/frameworks.html

@@ -17,6 +17,16 @@
         If there is a library not listed below that you think should be here, you're welcome to discuss it with the Events Team over at <a href="https://discord.gg/HnGd3znxhJ">the server</a>.
     </p>
 
+    <div class="notification is-info is-light">
+        <p>Most of the below frameworks implement what is called the ASGI Specification.
+            This specification documents how the frameworks should interact with ASGI servers and call the frameworks.
+            You are also allowed to <strong>work with the ASGI specification directly</strong> without a framework, if your team so chooses to.
+            Refer to the <a href="https://asgi.readthedocs.io/en/latest/">specification online</a>.
+        </p>
+    </div>
+
+    <h3 id="approved-frameworks"><a href="#approved-frameworks">Approved Frameworks</a></h3>
+
     <div class="card mb-4">
         <div class="card-content">
             <div class="content">
@@ -86,18 +96,6 @@
         </div>
     </div>
 
-    <div class="card mb-4">
-        <div class="card-content">
-            <div class="content">
-                <p class="subtitle">ASGI</p>
-                <p>ASGI is the specification your favourite frameworks are built on. This is not a framework in of itself, but listed here for completeness.</p>
-            </div>
-        </div>
-        <div class="card-footer">
-            <a href="https://asgi.readthedocs.io/en/latest/" class="card-footer-item"><i class="fas fa-clipboard-list"></i>&ensp;Specification</a>
-        </div>
-    </div>
-
     <div class="card mb-4">
         <div class="card-content">
             <div class="content">