medialog.css

@font-face {
  font-family: 'Londrina Solid';
  font-size: 30px;
  font-display: auto;
  src: url('assets/fonts/londrinasolid-regular-webfont.woff'); format:('woff'),
       url('assets/fonts/londrinasolid-regular-webfont.woff2'); format:('woff2')
}


body {
    background-color: #FEE715;
    margin: 0 auto;
    padding: 0 20px 20px 20px;
   }
  html {
    font-size: 30px; /* px means "pixels": the base font size is now x pixels high */
    font-family: 'Londrina Solid'; /* this should be the rest of the output you got from Google Fonts */
    text-align: center;
    color:  #101820; 
  }
/* Aligns the heading text to the center. */
 
h1 {
  text-align: center;
  font-size: 30px;
}

.grid-container {
    display: grid;
    grid-template-columns: auto auto auto;
    background-color: #C4A1FF;
    padding: 10px;
  }
  
  .grid-item {
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(0, 0, 0, 0.8);
    padding: 20px;
    font-size: 15px;
    text-align: center;
  }