
/* A modern CSS reset by Josh Comeau*/
    /*
    1. Use a more-intuitive box-sizing model.
    */
    *, *::before, *::after {
        box-sizing: border-box;
    }
    
    /*
        2. Remove default margin
    */
    * {
        margin: 0;
    }
    
    /*
        Typographic tweaks!
        3. Add accessible line-height
        4. Improve text rendering
    */
    body {
        line-height: 1.5;
        -webkit-font-smoothing: antialiased;
    }
    
    /*
        5. Improve media defaults
    */
    img, picture, video, canvas, svg {
        display: block;
        max-width: 100%;
    }
    
    /*
        6. Remove built-in form typography styles
    */
    input, button, textarea, select {
        font: inherit;
    }
    
    /*
        7. Avoid text overflows
    */
    p, h1, h2, h3, h4, h5, h6 {
        overflow-wrap: break-word;
    }
    
    /*
        8. Create a root stacking context
    */
    #root, #__next {
        isolation: isolate;
    }

    /* @font-face {
        font-family: "Quicksand";
        src: url(../Fonts/Quicksand/static/Quicksand-Medium.ttf);
        font-weight: normal;
        font-style: normal;
      } */

@font-face {
    font-family: "Quicksand";
    src: url(/Fonts/Quicksand-Regular.ttf);
}

* {
    font-family: "Quicksand" , system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

/* Code CSS copied from W3 Schools */
ul {
    position: sticky;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    /* z-index: +10; */

}
      
li {
    float: right;
}
      
li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
    
li a:hover {
    background-color: #111;
}

.current {
    background-color: blue;
}




.text {
    background-color: white;
    padding: 30px;
}

h1{
    text-align: center;
}


footer{
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #333;
    color: white;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    z-index: +10;
    margin-top: 30px;
  }

#footer {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;
}

.icon {
    max-width: 30px;
    border-radius: 15px;
    margin: 5px;
}




