diff --git a/css/app/ribbon.css b/css/app/ribbon.css
index 324378f5..1821cff6 100644
--- a/css/app/ribbon.css
+++ b/css/app/ribbon.css
@@ -61,3 +61,8 @@
     right:              0;
     border-width:       1em 1em 0 0;
 }
+@media (prefers-color-scheme: dark) {
+    .ribbon {
+         color: #B3B3B3;
+    }
+}
diff --git a/css/app/seagl.scss b/css/app/seagl.scss
index 67c9b1ad..87c3e5f3 100644
--- a/css/app/seagl.scss
+++ b/css/app/seagl.scss
@@ -15,6 +15,7 @@ body {
   border-bottom: 12px solid #0C5A73;
   overflow-x: hidden;
 }
+
 :hover {
   -webkit-transition: all .25s ease-in-out;
   -moz-transition: all .25s ease-in-out;
@@ -395,3 +396,35 @@ img.align-center {
   margin-top: 15px;
   margin-bottom: 15px;
 }
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background-color: #0D0D0D ;
+    color: #B3B3B3;
+    outline: 5px dashed #000;
+
+  }
+  h1,h2,h3,h4,h5,h6 {
+    text-shadow: 0px 1px 1px #565656;
+  }
+  h2,h3,h5,h6 {
+    color: #1D7193;
+  }
+  a:not(.btn):not(.label) {
+    &, &:active {
+      color: #1D7193;
+    }
+    &:visited {
+      color: #1D7193;
+    }
+    &:hover {
+      color: #565656;
+    }
+  }
+  #main-nav .main-nav-links li a {
+    color: #B3B3B3;
+  }
+  .logo-wall{
+    background-color: #B3B3B3;
+  }
+}
diff --git a/css/app/sponsors.scss b/css/app/sponsors.scss
index 36293b0f..4ebbcb1e 100644
--- a/css/app/sponsors.scss
+++ b/css/app/sponsors.scss
@@ -39,3 +39,10 @@
     width: auto;
   }
 }
+@media (prefers-color-scheme: dark) {
+    .logo-wall {
+         display: flex;
+         border-radius: 4px;
+         background-color: #B3B3B3;
+    }
+}