    .vid-bg {
        position: absolute;
        right: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        opacity: 0.1;
        z-index: 0;
    }

    .foot-wrap {
      display: flex;
      justify-content: center;
    }

    .footer {
        display: flex;
        position: relative;
        justify-content: space-between;
        align-items: center;
        padding: 4rem 2rem;
        gap: 1rem;
        background-color: var(--char);
        border-radius: 30px 30px 0 0;
        overflow: hidden;
    }
    .footer-right {
        display: flex;
        position: relative;
        flex-direction: column;
        width: 100%;
        overflow: hidden;
        gap: 2rem;
        z-index: 1;
        img {
            width: 400px;
            height: 100%;
        }
        hr {
            width: 100%;
        }
    }
    .bot-right {
        display: inherit;
        flex-direction: column;
        padding-right: 2rem;
        gap: 2rem;
        span {
            color: white;
            font-size: 20px;
            font-weight: bold;
        }
        p {
            font-size: 20px;
            font-weight: 200;
            margin: 0;
        }
        a {
            /* font-size: 20px;
            font-weight: 200;
            color: white; */
            transition: all 0.3s ease-in-out;
        }
        a:hover {
            /* font-weight: 500; */
            transform: scale(1.1);
        }
        img {
          height: 50px;
          width: 50px;
        }
    }
    .soc-col {
        display: inherit;
        flex-direction: row;
        gap: 1rem;
    }
    .cont-col {
      display: inherit;
      flex-direction: column;
      gap: 1rem;
  }
    .footer-left {
        display: flex;
        max-width: 470px;
        width: 100%;
        position: relative;
        padding: 0 1rem;
        z-index: 1;
        p {
            margin: 0 0 1rem;
            font-weight: 200;
            font-size: 40px;
        }
        span {
            font-size: 25px;
            font-weight: 500;
        }
    }

@keyframes spin { 100% { transform: rotate(360deg); } }
  
.other-ways {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--primary);
  padding: 2rem 1rem;
  gap: 1rem;
}

@media (max-width: 1113px) {
  .footer {
    flex-wrap: wrap-reverse;
    gap: 2rem;
  }
  .footer-right { 
    justify-content: center;
    overflow: visible;
    img { width: 300px; } 
  }
  .bot-right {
    gap: 2rem;
    padding-right: 0;
    img {
      height: 50px;
      width: 50px;
    }
  }
  .soc-col,
  .cont-col {
    width: auto;
  }
  .vid-bg {
    width: auto;
    height: 100%;
  }
}

@media (max-width: 570px) {
  .footer{
    align-items: center;
    border-radius: 0;
  }
  .footer-right {
    align-items: center;
    img {width: 200px;}
  }
  .cont-col,
  .soc-col {
    text-align: center;
    justify-content: center;
    gap: 1rem;
  }
  .footer-left {
    padding: 1rem 2rem;
    p {
        font-size: 20px;
    }
    span {
        font-size: 16px;
    }
}
  .bot-right {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2rem;
    span, a, p {
      font-size: 16px;
    }
    img {
      height: 40px;
      width: 40px;
    }
  }
}