h1 {
  text-align: center; }

#blogs-parent {
  width: fit-content;
  max-width: 95vw;
  margin: 10px auto;
  display: grid; }
  #blogs-parent .blog {
    margin: 5px;
    background-color: white;
    padding: 10px;
    border-radius: 5px;
    border: rgba(0, 0, 0, 0.25) 1px solid; }
    @media screen and (max-width: 1000px) {
      #blogs-parent .blog {
        width: 90vw; } }
    #blogs-parent .blog img {
      width: 15vw;
      height: 10vw;
      position: relative;
      display: inline-block;
      left: 50%;
      transform: translate(-50%);
      background-color: gray;
      border-radius: 5px; }
    #blogs-parent .blog h2 {
      text-align: center; }
    #blogs-parent .blog .author {
      color: rgba(0, 0, 0, 0.8); }
    #blogs-parent .blog:hover {
      cursor: pointer;
      border: rgba(0, 0, 0, 0.5) 1px solid; }
    #blogs-parent .blog a {
      display: none; }
  @media screen and (max-width: 1000px) {
    #blogs-parent {
      display: block; }
      #blogs-parent .blog {
        width: 90vw;
        display: grid;
        grid-template-columns: auto auto; }
        #blogs-parent .blog div {
          height: fit-content;
          margin-top: auto;
          margin-bottom: auto; }
        #blogs-parent .blog img {
          margin-right: 2vw; } }
  @media screen and (min-width: 1000px) {
    #blogs-parent {
      grid-template-columns: auto auto; }
      #blogs-parent .blog {
        width: 45vw; } }
  @media screen and (min-width: 1300px) {
    #blogs-parent {
      grid-template-columns: auto auto auto; }
      #blogs-parent .blog {
        width: 30vw; } }
  @media screen and (min-width: 1500px) {
    #blogs-parent {
      grid-template-columns: auto auto auto auto; }
      #blogs-parent .blog {
        width: 20vw; } }

/*# sourceMappingURL=blog-homepage.css.map */