Integrate hugo static generator

static/assets/main/1_0/css/intro.css

@@ -0,0 +1,82 @@
+
+:root{
+    --fw-reg: 400;
+    --fw-bold: 700;
+    --clr-accent: #0dcaf0;
+    
+    --fs-h1: 3rem;
+    --fs-h3: 1.25rem;
+    --bs: 0.25em 0.25em 0.75em rgba(0,0,0,.25),
+          0.125em 0.125em 0.25em rgba(0,0,0,.15);
+}
+
+@media (min-width: 768px) {
+    :root {
+        --fs-h1: 4.5rem;
+    }
+}
+
+section.intro{
+    padding: 5em 2em;
+    position: relative;
+}
+
+img.intro__img{
+    display: block;
+    max-width: 100%;
+    box-shadow: var(--bs);
+}
+
+h1.section__title{
+    line-height: 1;
+    margin: 0;
+    font-size: var(--fs-h1);
+    margin-bottom: .25em;
+    font-weight: var(--fw-reg);
+}
+
+.section__title strong {
+    font-weight: var(--fw-bold);
+    display: block;
+}
+
+.section__subtitle {
+    margin: 0;
+    font-size: var(--fs-h3);
+    background: var(--clr-accent);
+    padding: .25em 1em;
+    font-family: var(--ff-secondary);
+    margin-bottom: 1em;
+    display: inline-block;
+    color: black;
+}
+
+@media (min-width: 576px) {
+    section.intro {
+        display: grid;
+        width: min-content;
+        margin: 0 auto;
+        grid-column-gap: 1em;
+        grid-template-areas: 
+            "img title"
+            "img subtitle";
+        grid-template-columns: min-content max-content;
+    }
+    
+    img.intro__img {
+        grid-area: img;
+        min-width: 250px;
+        position: relative;
+        z-index: 2;
+    }    
+    
+    .section__subtitle {
+        align-self: start;
+        grid-column: -1 / 1;
+        grid-row: 2;
+        text-align: right;
+        position: relative;
+        left: -1.5em;
+        width: calc(100% + 1.5em);
+    }
+}

static/assets/main/1_0/css/styles.css

@@ -0,0 +1,57 @@
+:root{
+    --clr-backgraund: rgb(100, 100, 100);
+    --clr-txt: rgb(255, 255, 255);
+    --clr-cyan:#0dcaf0;
+}
+
+body{
+    background-color: var(--clr-backgraund);
+    color: var(--clr-txt);
+    font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    font-size: 100%;
+}
+
+.wb-body{
+    background: var(--clr-backgraund);
+}
+
+.hidden{
+    display: none;
+}
+/*-------------------------------------------------------------*/
+h2{
+    text-align: center;
+}
+
+a{
+    text-decoration: none;
+    color: var(--clr-txt);
+}
+
+a:hover{
+    color: var(--clr-cyan);
+    cursor: pointer;
+}
+
+table{
+    margin-left: auto;
+    margin-right: auto;
+    text-align: center;
+}
+
+div.margin-top{
+    margin-top: 2em;
+}
+
+.wb-icon * {
+    opacity: 0.65;
+    filter: invert(1);
+}
+
+.wb-title {
+    color: black;
+}
+
+.btn{
+    margin: 2px;
+}