/* Common styles for all screen sizes */
.meme-generator {
    font-family: "Roboto", sans-serif;
    text-align: center;
    margin: 20px;
  }
  
  .meme-generator img {
    height: 430px;
    object-fit: cover;
  }
  
  .generate-meme {
    padding: 8px 20px;
    border: none;
    border-left: 4px solid #222;
    border-right: 4px solid #222;
    margin: 24px 0;
    font-size: 20px;
    color: #f64d4d;
    background-color: #fff;
    cursor: pointer;
    transition: all 400ms ease;
  }
  
  .meme-generator .generate-meme:hover {
    padding: 8px 36px;
    border-left: 8px solid #222;
    border-right: 8px solid #222;
    letter-spacing: 3px;
  }
  
  .meme-generator .meme-author {
    margin: 8px;
  }
  
  /* Responsive styles for smaller screens */
  @media (max-width: 768px) {
    .meme-generator img {
      height: 300px;
    }
  
    .generate-meme {
      font-size: 16px;
    }
  }
  
  /* Responsive styles for even smaller screens */
  @media (max-width: 480px) {
    .meme-generator img {
      height: 200px;
    }
  
    .generate-meme {
      font-size: 14px;
    }
  }