/*               footer */

@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");



footer {

  position: relative;

}



.container2 {

  max-width: 1170px;

  margin: auto;

}

.row {

  display: flex;

  flex-wrap: wrap;

}

ul {

  list-style: none;

}

.footer {

  margin-top: 120px;

  /* background-color: #24262b; */

  background: linear-gradient(#3d3d3d, #232323, #000000);

  padding: 70px 0;

}

.footer-col {

  width: 25%;

  padding: 0 15px;

}

.footer-col h4 {

  font-size: 18px;

  color: #ffffff;

  text-transform: capitalize;

  margin-bottom: 35px;

  font-weight: 700;

  position: relative;

  letter-spacing: 1px;

}

.footer-col h4::before {

  content: "";

  position: absolute;

  left: 0;

  bottom: -10px;

  background-color: #da4817;

  height: 2px;

  box-sizing: border-box;

  width: 50px;

}

.footer-col ul li:not(:last-child) {

  margin-bottom: 10px;

}

.footer-col ul li a {

  font-size: 16px;

  text-transform: capitalize;

  color: #ffffff;

  text-decoration: none;

  font-weight: 300;

  color: #bbbbbb;

  display: block;

  transition: all 0.3s ease;

}

.footer-col ul li a:hover {

  color: #ffffff;

  padding-left: 8px;

}

.footer-col .social-links a {

  display: inline-block;

  height: 40px;

  width: 40px;

  background-color: rgba(255, 255, 255, 0.2);

  margin: 0 10px 10px 0;

  text-align: center;

  line-height: 40px;

  border-radius: 50%;

  color: #ffffff;

  font-size: 1.2rem;

  transition: all 0.5s ease;

}

.footer-col .social-links a:hover {

  color: #24262b;

  background-color: #ffffff;

}



.footer-bottom {

  position: absolute;

  bottom: 0;

  width: 100%;

  text-align: center;

  font-size: 13px;

  color: #fff;

  letter-spacing: 1px;

  font-family: sans-serif;

  padding: 3px;

}



.footer-bottom b {

  color: #da4817;

  font-size: 15px;

  font-weight: bolder;

}



.footer-bottom p {

  margin: 0;

}



.footer-bottom a {

  color: #da4817cb;

  text-decoration: none;

}



.footer-bottom a:hover {

  text-decoration: underline;

}



/*responsive*/

@media (max-width: 767px) {

  .footer-col {

    width: 50%;

    margin-bottom: 30px;

  }

}

@media (max-width: 574px) {

  .footer-col {

    width: 100%;

  }

}