Add credits to DigitalOcean for their support

README.md

@@ -46,6 +46,15 @@ To submit a feature suggestion or file a bug report, please [create a new issue
 
 Safari needs to be built in Xcode. I have only tested building Cookie-Editor on Xcode 15.
 
+## Thanks
+
+Thanks to DigitalOcean for supporting open-source software.
+
+<p>
+  <a href="digitalocean.pxf.io/k0BxXd">
+    <img alt="Powered by DigitalOcean" src="https://opensource.nyc3.cdn.digitaloceanspaces.com/attribution/assets/PoweredByDO/DO_Powered_by_Badge_blue.svg" width="201px">
+  </a>
+</p>
 
 ## Disclaimer
 

site/index.html

@@ -168,7 +168,23 @@ <h3>Cookie-Editor is available on Google Chrome, Firefox, Safari, Edge and Opera
 
 
         <div class="block ad-container">
-            <h2>Ad</h2>
+
+            <div class="ad">
+                <img src="img/digitalocean-vertical.svg" alt="Digital Ocean Logo" />
+                <div>
+                    <h3><a href="https://tab.gladly.io/cookieeditor/" class="ads-link" data-ad="tab-for-cause">DigitalOcean</a></h3>
+                    <p>
+                        Cookie-Editor is supported by: DigitalOcean
+                    </p>
+                    <p>
+                        Thanks to DigitalOcean for supporting open-source software.
+                    </p>
+                    <a href="digitalocean.pxf.io/k0BxXd" class="btn-cta btn-sm ads-link" data-ad="digitalocean">
+                        Learn more
+                    </a>
+                </div>
+            </div>
+
             <div class="ad">
                 <img src="img/tab-for-cause.png" alt="Tab for cause logo" />
                 <div>
@@ -182,6 +198,7 @@ <h3><a href="https://tab.gladly.io/cookieeditor/" class="ads-link" data-ad="tab-
                     <a href="https://tab.gladly.io/cookieeditor/" class="btn-cta btn-sm ads-link" data-ad="tab-for-cause">
                         Get Tab for a Cause
                     </a>
+                    <div class="ad-disclaimer">(Ad)</div>
                 </div>
             </div>
         </div>

site/style/main.css

@@ -360,11 +360,29 @@ header .btn-cta {
   font-weight: 700;
 }
 
-.ad {
+.ad-container {
+  display: flex;
+	flex-wrap: wrap;
+	justify-content: center;
+	align-items: baseline;
+	align-content: flex-start;
+  gap: 50px
+}
+
+.ad { 
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 20px;
+  margin-top: 40px;
+  max-width: 560px;
+  flex: 1;
+}
+
+.ad p {
+  line-height: 1.2em;
+  font-size: 0.95em;
+  padding: 5px 0;
 }
 
 .ad > img {
@@ -375,6 +393,12 @@ header .btn-cta {
   margin-top: 5px;
 }
 
+.ad .ad-disclaimer {
+  display: inline-block;
+  margin-left: 10px;
+  color: #CACACA
+}
+
 #contribution {
   display: flex;
   gap: 100px;