footer{
    display: flex;
    justify-content: center;
    padding: 50px;
    background-color: #3338A0;
    color: white;
    gap: 50px;
}

footer h1{
    font-size: 20px;
}

footer .nav {
    color: #fff;
    width: 25%;
}

footer .nav .nav-item .nav-link {
    color: #fff !important;
}

footer .nav .nav-item .nav-link:hover {
    color: #ccc; 
}
.logo-text{
    font-size: 3rem;
}

@media (max-width: 575px){
    footer {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: 50px 30px;
    background-color: #3338A0;
    color: white;
    gap: 50px;
    height: auto;
  }

footer .nav {
    color: #fff;
    width: 100%;
    display: flex;
    justify-content: start;
}

footer .nav div{
    display: flex;
    flex-direction: column;
    text-align: start;
}
}
  

@media (min-width: 576px) and (max-width: 767.98px) {
   footer {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: 50px 30px;
    background-color: #3338A0;
    color: white;
    gap: 50px;
    height: auto;
  }

footer .nav {
    color: #fff;
    width: 100%;
    display: flex;
    justify-content: start;
}

footer .nav div{
    display: flex;
    flex-direction: column;
    text-align: start;
}
}

@media (min-width: 768px) and (max-width: 991.98px) {
   footer {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: 50px 30px;
    background-color: #3338A0;
    color: white;
    gap: 50px;
    height: auto;
  }
  
footer .nav {
    color: #fff;
    width: 100%;
    display: flex;
    justify-content: start;
}

footer .nav div{
    display: flex;
    flex-direction: column;
    text-align: start;
}
}