initial commit

main.css

@@ -0,0 +1,83 @@
+@font-face {
+    font-family: "Cantarell var";
+    font-weight: 100 900;
+    font-display: swap;
+    font-style: normal;
+    font-named-instance: "Regular";
+    src: url("Cantarell-VF.otf") format("opentype");
+}
+
+h1 {
+    margin: 20px;
+}
+
+* {
+    margin: 0;
+    padding: 0;
+    font-family: Cantarell;
+}
+
+#links {
+    display: inline-grid;
+    grid-template-rows: 100% 0px;
+}
+
+#links > * {
+    margin-left: 10px;
+    margin-right: 10px;
+}
+
+#header {
+    text-align: center;
+    padding-top: 10%;
+    padding-bottom: 10%;
+    min-height: 40vh;
+    background-image: url(https://www.state.gov/wp-content/uploads/2022/02/Kuwait-2323x1406.png);
+    background-attachment: fixed;
+}
+
+.dropdown {
+    background-color: aliceblue;
+    padding: 10px;
+    display: inline-block;
+    grid-row: 1;
+}
+
+.dropdown-inner {
+    background-color: white;
+    display: flex;
+    grid-row: 2;
+    visibility: hidden;
+    flex-direction: column;
+}
+
+.dropdown:hover + div > .dropdown-inner, .dropdown-inner:hover {
+    visibility: visible;
+}
+
+.dropdown-inner > * {
+    padding: 10px;
+}
+
+#content {
+    margin: 10%;
+}
+
+#headin {
+    padding-top: 5%;
+    padding-bottom: 5%;
+    transition: background-color 0.3s, color 0.3s;
+    width: 100%;
+}
+
+#head-marker.scrolly-out + #headin {
+    position: fixed;
+    top: 0px;
+    left: 0px;
+    background-color: darkred;
+    color: lightgreen;
+}
+
+#head-marker.scrolly-out + #headin > #links > * > *, #head-marker.scrolly-out + #headin > #links > * {
+    background-color: black;
+}