Add "currently offline" bar over the link to usdb.animux.de

_includes/songs.html

@@ -2,15 +2,18 @@
     <section id="{{ page.section-type }}" class="content-section">
         <div class="container">
             <div class="row">
-                <h1 class="title">{{ page.title }}</h1>
+                <h1 class="title">{{ page.title }}</h1>                
                 {{ page.content | markdownify }}
                 <div class="flex-box-row">
-                    {% for song in site.data.songs %}
+                    {% for song in site.data.songs %}                        
                         <div class="col-md-6 flex-box-col" >
                             <h2 class="flex00a">{{ song.title }}</h2>
                             <span class="contribute-icon fa fa-{{ song.icon }} flex00a" aria-hidden="true"></span>
                             <p class="flex11100">{{ song.description }}</p>
                             <p><a class="btn flex00a" href="{{ song.url }}">{{ song.url_text }}</a></p>
+                            {% if song.title=='Download' %}
+                                <h1 class="stamp">CURRENTLY OFFLINE</h1>
+                            {% endif %}
                         </div>
                     {% endfor %}
                 </div>

css/main.css

@@ -396,4 +396,29 @@ a:hover {
 
 .no-release-text {
     margin-top: 40px;
+}
+
+.stamp {
+    position: relative;
+    display: inline-block;
+    color: red;
+    padding: 15px;
+    background-color: white;
+    box-shadow:inset 0px 0px 0px 10px red;
+    transform: rotate(30deg);
+    margin-top: -150px;
+    margin-left: 18%;
+    font-size: 25px;
+    width: 350px;
+}
+
+.stamp:after {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    background-image: url("../img/stamp.jpg");
+    mix-blend-mode: lighten;
 }