@font-face { 
    font-family: "Suisse Int'l Semibold"; 
    src: url("https://framerusercontent.com/assets/NZNod8irILbWmnqW9EFqblG4zI.woff2"); 
    font-display: swap 
}

@font-face { 
    font-family: "Suisse Int'l Semibold"; 
    src: url("https://framerusercontent.com/assets/NZNod8irILbWmnqW9EFqblG4zI.woff2"); 
    font-display: swap; 
    font-style: normal; 
    font-weight: 600 
}

@font-face { 
    font-family: "Uncut Plan8 Regular"; 
    src: url("https://zsobix.xyz/fonts/UncutPlan8-Regular.woff2"); 
    font-display: swap 
}


body {
    font-family: "Suisse Int'l Semibold", sans-serif;
    background-color: white;
    color: hsl(0, 0%, 8%);
    margin: 0;
    scroll-behavior: smooth;
}
h1 {
    font-size: 50px;
}
h5 {
    font-family: "Uncut Plan8 Regular", sans-serif; 
    font-size: 11px;
    font-weight: 400;
    font-style: normal;
    letter-spacing: -.048em;
    line-height: 1.35em;
    margin: 5px;
}

nav h3 {
    font-family: "Suisse Int'l Semibold", sans-serif;
    text-align: end;
}

a {
    color: hsl(0, 0%, 8%);
    text-decoration: none;
    transition-duration: 0.3s;
    transition-property: color;
}
a:hover {
    color: hsl(0, 0%, 40%);
}

.footertext {
    font-size: 19vw;
    line-height: 1.5em;
    text-align: center;
    margin: 0;
}

.inline {
    display: inline;
}

.gridbox {
    margin: 10px;
    padding: 5px;
    border-radius: 15px;
    background-color: hsl(0, 0%, 97%);
}



.nav-bar {
    margin: 10px;
    padding: 15px;
    border-radius: 15px;
    background-color: hsl(0, 0%, 97%);
}

.grid {
    display: grid;
    grid-template-columns: auto auto;
}
.highlight {
    display: inline;
    background-color: yellow;
}
section h5 {
    text-align: start;
}