* {
     margin: 0;
     padding: 0;
     font-family: "Poppins", sans-serif;
     line-height: 1.5;
     font-size: 1rem;
     transition: all 0.2s ease;
}

footer {
     background-color: #1e293b;
     border-top: 1px solid #2c2c2c;
     z-index: inherit;
}

.footer {
     padding: 1.5rem 5.75rem 0rem;
     display: flex;
     flex-direction: column;
     color: #b6bcc9;
}

.footer h4 {
     color: #fff;
     font-weight: 600;
     padding-bottom: 0.75rem;
     /* margin-left: 1.5rem; */
}

.top-footer {
     display: grid;
     grid-template-columns: 1fr 1fr 1fr 1fr;
}

.footer ul {
     display: inline;
}

.footer ul li {
     list-style: none !important;
     padding-top: 0.75rem;
     color: #b6bcc9;
}

li a {
     text-decoration: none;
     color: #b6bcc9;
}

li a:hover {
     color: #fff;
}

li i {
     font-size: 1.2rem;
     padding-right: 0.5rem;
     color: #b6bcc9;
}

.footer .icons a {
     text-decoration: none;
}

.icons a i:hover {
     color: #fff;
}

.footer li:hover {
     color: #fff;
}

.bottom-footer {
     color: #b6bcc9;
     text-align: center;
     padding: 1.5rem 0;
}

.footer .bottom-footer div a {
     color: #fff;
     text-decoration: none;
}

.footer .bottom-footer div a:hover {
     color: #0fe;
     text-decoration: none;
}

.bottom-footer span {
     color: #b6bcc9;
     font-size: 1rem;
     font-weight: 400;
}

.bottom-footer span:hover {
     cursor: pointer;
     color: #fff;
     transition: 0.2s ease;
}
@media screen and (max-width: 900px) {
     .footer {
          display: flex;
          align-items: center;
          justify-content: center;
          padding: 1rem 2rem;
     }

     .top-footer {
          grid-template-columns: repeat(2, 1fr);
          column-gap: 5rem;
          text-align: left;
     }

     .top-footer h4 {
          text-align: left;
          margin: 1rem 0 0 0;
          padding-top: 2rem;
     }
}

@media screen and (max-width: 500px) {
     .top-footer h4 {
          padding-top: 1rem;
          width: 100%;
     }

     .top-footer ul {
          display: flex;
          flex-direction: column;
          /* align-items: center; */
          /* justify-content: center; */
     }

     .top-footer ul li {
          width: 100%;
          margin: 0;
     }

     .top-footer {
          grid-template-columns: 7.5rem;
     }
}