switched semantic lib for fomantic

assets/style.rc1.css

@@ -48,14 +48,67 @@
 
     --logofront: var(--yellowryblighter);
     --logoshade: var(--tartorange);
+
+    --direction: 1;
 }
 
+@view-transition {
+    navigation: auto;
+}
+
+
+/*.pusher .ui {*/
+/*    view-transition-name: content;*/
+/*}*/
+
+/*.pusher .ui.masthead {*/
+/*    view-transition-name: header;*/
+/*}*/
+
+/*::view-transition-old(header) {*/
+/*    animation: slide-out 0.5s cubic-bezier(0.86, 0, 0.07, 1) forwards;*/
+/*}*/
+
+/*::view-transition-new(header) {*/
+/*    animation: slide-in 0.5s cubic-bezier(0.86, 0, 0.07, 1) forwards;*/
+/*}*/
+
+/*::view-transition-old(content) {*/
+/*    animation: slide-out 0.5s cubic-bezier(0.86, 0, 0.07, 1) forwards;*/
+/*}*/
+
+/*::view-transition-new(content) {*/
+/*    animation: slide-in 0.5s cubic-bezier(0.86, 0, 0.07, 1) forwards;*/
+/*}*/
+
+/*@keyframes slide-out {*/
+/*    0% {*/
+/*        transform: translateY(0%);*/
+/*    }*/
+
+/*    100% {*/
+/*        opacity: 0;*/
+/*        transform: translateY(calc(20% * var(--direction)));*/
+/*    }*/
+/*}*/
+
+/*@keyframes slide-in {*/
+/*    0% {*/
+/*        opacity: 0;*/
+/*        transform: translateY(calc(-20% * var(--direction)));*/
+/*    }*/
+
+/*    100% {*/
+/*        transform: translateY(0%);*/
+/*    }*/
+/*}*/
+
 html {
     scroll-behavior: smooth;
 }
 
 body {
-    background-color: var(--cultured);
+    background-color: #ffffff;
     font-family: var(--textfont);
     font-size: 1.25em;
 }