html {
    /* Set the font globally */
    scroll-behavior: smooth;
}
body {
    font-family: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir, "Nimbus Sans L", Roboto, "Noto Sans", "Segoe UI", Arial, Helvetica, "Helvetica Neue", sans-serif;
    color: #dcdcdc;
    background-color: #212121;
    box-sizing: border-box;
    height: 100vh;
    width: 100vw;
    overflow: hidden;

    background-image:
            linear-gradient(
                    rgba(0, 0, 0, 0.9475),
                    rgba(0, 0, 0, 0.9475)
            ),
            url("/assets/images/logo-bg.png");
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

grid-container1to9 {
    display: grid;
    grid-template-columns: 90vw;
    position: absolute;
    top: 50vh;
    left: 50vw;
    transform: translateY(-50%) translateX(-50%);
    column-gap: 0.3vw;
    row-gap: 0.3vh;
    padding-left: 10vw;
}.grid-item {
     padding-bottom: 3vh;
 }.grid-b-name {
      font-size: 2.3vh;
      padding-bottom: 0.3vh;
  }.grid-b-desc {
       font-size: 1.4vh;
       font-style: italic;
   }

grid-container10 {
    display: grid;
    grid-template-columns: 90vw;
    position: absolute;
    top: 50vh;
    left: 50vw;
    transform: translateY(-49vh) translateX(-50%);
    column-gap: 0.3vw;
    /*row-gap: 0.05vh;*/
    padding-left: 10vw;
}.grid-item {

 }.grid-b-name {
      font-size: 2.3vh;

  }.grid-b-desc {
       font-size: 1.4vh;
       font-style: italic;
   }

grid-container11AndUp {
    display: grid;
    grid-template-columns: 48vw 48vw;
    position: absolute;
    top: 50vh;
    left: 50vw;
    transform: translateY(-50%) translateX(-50%);
    column-gap: 1vw;
    /*row-gap: 0.05vh;*/
    padding-left: 2vw;
}.grid-item {
     align-self: center;
 }.grid-b-name {
      font-size: 4.25vw;
  }.grid-b-desc {
       font-size: 1.3vh;
       font-style: italic;
   }