    body {background: ghostwhite;}

    * {box-sizing: border-box;}

    .grid-container {
        display: inline-grid;
        grid-template-columns: repeat(auto-fit,minmax(250px, 1fr));
        grid-gap: .3em 3em; 'row gap, column gap; it is relative to font size'
        background-color: white;
        padding: 0vw; 'as a percentage of viewport width'

    }

    .grid-container > div {
      background-color: aliceblue;
      border: 1px solid blue;
      padding-inline-start: .25em;
      font-size: 20px;
      text-align: start;
      align-items: stretch;
      max-width: 100%;
      min-height: 100px; /* Adjust this value as needed */
    }

    #paraLocation {
        background-color: rebeccapurple;
        border-left-style: solid;
        border-left-color: mediumblue;
        padding-left: 4px;
        font-size: 24px;
        font-weight: bold;
        color: white;
    }

    #paraDayHeader {
        background-color: skyblue;
        font-size: 24px;
        font-weight: bold;
        padding-inline-start: 3px;
    }
