1 files changed, 82 insertions, 0 deletions
diff --git a/stylesheets/programmes.css b/stylesheets/programmes.css
new file mode 100644
index 0000000..98a1a4f
--- /dev/null
+++ b/stylesheets/programmes.css
@@ -0,0 +1,82 @@
+#program-list {
+    max-height: 60vh;
+    overflow: auto;
+    scrollbar-width: thin;
+    scrollbar-color: darkblue #8ad;
+}
+
+#program-list::-webkit-scrollbar {
+    width: 0.25em;
+    height: 0.25em;
+}
+
+#program-list::-webkit-scrollbar-track {
+    background: #8ad;
+}
+
+#program-list::-webkit-scrollbar-thumb {
+    background: darkblue;
+}
+
+.programs {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(var(--cell-width), 1fr));
+    grid-auto-rows: var(--cell-height);
+    grid-gap: 0.8em;
+}
+
+.program {
+    background-color: #099;
+}
+
+.program a {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    height: 100%;
+    color: inherit;
+    text-decoration: none;
+}
+
+.program .summary {
+    font-weight: bold;
+}
+
+details summary .duration {
+    font-family: monospace;
+}
+
+@media (min-width: 40em) {
+    main {
+        display: grid;
+        grid-template-columns: 50% 50%;
+    }
+
+    main > div {
+        padding: 1em;
+    }
+
+    .programs {
+        --cell-width: 10em;
+        --cell-height: 10em;
+    }
+
+    .program a {
+        transition: color 0.5s;
+    }
+    .program:hover a {
+        color: white;
+    }
+
+    .details.active > *:first-child {
+        margin-top: 0;
+    }
+}
+
+@media (max-width: 40em) {
+    .programs {
+        --cell-width: 8em;
+        --cell-height: 4em;
+    }
+}