footer {
  background-color: #114133;
  padding: 100px 18% 0 18%;
  font-family: "Abel";
  color: #fff;
}

footer p {
  color: white;
}

footer a {
  color: white;
  transition-duration: 0.5s;
}
footer a:hover {
  /* color: #ffda47; */
  color: #b3b3b3;
  transition-duration: 0.5s;
}

.logo-sm {
  height: 71px;
  width: auto;
}

.footer-bottom {
  padding-top: 80px;
  padding-bottom: 15px;
  text-align: center;
}

.footer-content {
  display: grid;
  grid-template-columns: auto 1fr;
  margin-top: 35px;
}

.footer-main {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 15px;
  margin-left: 15%;
}

.footer-nav {
  display: grid;
  align-content: baseline;
  gap: 15px;
}

.footer-nav a {
  color: #fff;
  transition-duration: 0.5s;
  font-family: "Abel";
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
}
.footer-nav a:hover {
  /* color: #ffda47; */
  color: #b3b3b3;
  transition-duration: 0.5s;
}

.footer-span-long {
  /* grid-area: 1/1/span 1/span 3; */
  grid-column: span 3;
}

@media (max-width: 1250px) {
  footer {
    padding: 100px 10% 0 10%;
  }
}
@media (max-width: 1008px) {
  footer {
    padding: 100px 10% 0 10%;
  }
  .footer-main {
    grid-template-columns: 1fr 1fr;
    margin-left: 15%;
    gap: 25px;
  }
  .footer-span-long {
    grid-column: span 2;
  }
  #footer-follow-us {
    grid-area: 4/1;
  }
  #footer-write-us {
    grid-area: 4/2;
  }
}
@media (max-width: 720px) {
  footer {
    padding: 100px 10% 0 10%;
  }
  .footer-main {
    grid-template-columns: 1fr;
    margin-left: 15%;
    gap: 25px;
  }
  .footer-span-long {
    grid-column: span 1;
  }
  #footer-follow-us {
    grid-area: 5/1;
  }
  #footer-socials {
    grid-area: 6/1;
  }
  #footer-write-us {
    grid-area: 7/1;
  }
  #footer-mail {
    grid-area: 8/1;
  }
}
@media (max-width: 500px) {
  footer {
    text-align: center;
  }
  .footer-main {
    margin-left: 0;
  }
  .footer-nav {
    margin-bottom: 35px;
  }

  .footer-content {
    grid-template-columns: 1fr;
    justify-items: center;
    margin-top: 35px;
  }
  .footer-brand {
    display: grid;
    justify-content: center;
  }
}