diff --git a/src/css/sections/media.css b/src/css/sections/media.css
index 63857069ca6..dca411e2fd1 100644
--- a/src/css/sections/media.css
+++ b/src/css/sections/media.css
@@ -6,11 +6,15 @@
& .logo {
display: inline-block;
max-width: 100%;
- background: #FFF;
+ background: var(--color-neutral-0);
border-radius: var(--space-s);
padding: var(--space-m);
}
+ & .logo.inverted {
+ background: var(--color-interview);
+ }
+
& .logo-square {
width: 9em;
}
diff --git a/src/media.pug b/src/media.pug
index 6d84dda54e2..1d544c6f7cd 100644
--- a/src/media.pug
+++ b/src/media.pug
@@ -19,6 +19,16 @@ block main
a.logo.logo-horizontal(href=assetPath("/img/media/einundzwanzig-horizontal.svg") target="_blank")
img(src=assetPath("/img/media/einundzwanzig-horizontal.svg") alt="Logo horizontal")
+ article
+ h2 Logo quadratisch, invertiert
+ a.logo.logo-square.inverted(href=assetPath("/img/media/einundzwanzig-square-inverted.svg") target="_blank")
+ img(src=assetPath("/img/media/einundzwanzig-square-inverted.svg") alt="Logo quadratisch, invertiert")
+
+ article
+ h2 Logo horizontal, invertiert
+ a.logo.logo-horizontal.inverted(href=assetPath("/img/media/einundzwanzig-horizontal-inverted.svg") target="_blank")
+ img(src=assetPath("/img/media/einundzwanzig-horizontal-inverted.svg") alt="Logo horizontal, invertiert")
+
article
h2 Telegram Vorlage Gruppenbild
a.telegram(href=assetPath("/img/media/einundzwanzig-telegram.png") target="_blank")
diff --git a/static/img/media/einundzwanzig-horizontal-inverted.svg b/static/img/media/einundzwanzig-horizontal-inverted.svg
new file mode 100644
index 00000000000..7edf22aef38
--- /dev/null
+++ b/static/img/media/einundzwanzig-horizontal-inverted.svg
@@ -0,0 +1 @@
+
diff --git a/static/img/media/einundzwanzig-square-inverted.svg b/static/img/media/einundzwanzig-square-inverted.svg
new file mode 100644
index 00000000000..e07b3337b3b
--- /dev/null
+++ b/static/img/media/einundzwanzig-square-inverted.svg
@@ -0,0 +1 @@
+