body {
    font-family: Arial, sans-serif;
}

header {
    margin-bottom: 2rem;
}

h2 {
    margin-bottom: 1.5rem;
}

footer {
    margin-top: 2rem;
}
#icons{
    display: inline;
    justify-content: space-around;
    margin-bottom: 2rem;
}
i{
    color: #ffffff !important;
    font-size: 20px;
    margin-right: 10px;
}

i:hover{
    color: #f3f0f04a !important;
}
li{
    list-style: none !important;
    padding: 0;
    text-decoration: none !important;
}
.card-img-top {
    height: 200px;
    object-fit: cover;
}
.navbar{
    background-color: rgb(247, 232, 28) !important;
}
.navbar-brand{
    margin: 10px auto;
}
.navbar-nav{
    display: flex;
    float: left;
    margin: 10px auto;
    position: relative;
    gap: 20px;
}
.nav-item:hover{
    text-decoration: underline;
}
.card-img-top{
    height: 200px;
    object-fit: cover;
    width: 100%;
    height: 70vh;
}
/* Media query for mobile devices */
@media (max-width: 767.98px) {
    footer .container-fluid {
      padding: 1rem;
    }
    footer h5 {
      font-size: 1.25rem;
    }
    footer p, footer ul, footer a {
      font-size: 0.875rem;
    }
    footer .row > div {
      margin-bottom: 1rem;
    }
  }
/* Media query for devices with max-width 480px */
@media (max-width: 480px) {
    footer .container-fluid {
      padding: 0.75rem;
    }
    footer h5 {
      font-size: 1rem;
    }
    footer p, footer ul, footer a {
      font-size: 0.75rem;
    }
    footer .social-icons a {
      font-size: 1rem;
      margin-right: 5px;
    }
    footer .row > div {
      margin-bottom: 0.75rem;
    }
  }
  
  /* Media query for devices with max-width 320px */
  @media (max-width: 320px) {
    footer .container-fluid {
      padding: 0.5rem;
    }
    footer h5 {
      font-size: 0.875rem;
    }
    footer p, footer ul, footer a {
      font-size: 0.625rem;
    }
    footer .social-icons a {
      font-size: 0.875rem;
      margin-right: 5px;
    }
    footer .row > div {
      margin-bottom: 0.5rem;
    }
}
/* Media query for devices with max-width 480px */
@media (max-width: 480px) {
    footer .container-fluid {
      padding: 0.75rem;
    }
    footer h5 {
      font-size: 1rem;
    }
    footer p, footer ul, footer a {
      font-size: 0.75rem;
    }
    footer .social-icons a {
      font-size: 1rem;
      margin-right: 5px;
    }
    footer .row > div {
      margin-bottom: 0.75rem;
    }
  }
  
  /* Media query for devices with max-width 320px */
  @media (max-width: 320px) {
    footer .container-fluid {
      padding: 0.5rem;
      
    }
    footer h5 {
      font-size: 0.875rem;
    }
    footer p, footer ul, footer a {
      font-size: 0.625rem;
    }
    footer .social-icons a {
      font-size: 0.875rem;
      margin-right: 5px;
    }
    footer .row > div {
      margin-bottom: 0.5rem;
    }
  }