@use "00-base/configure" as *;

.ma__footer-new {

  // height: 100px;
  background-color: var(--mf-c-bg-section);
  
  &__container {

    @include ma-container;
    
    @include clearfix;

    display: flex;
    padding-top: 2rem;
    padding-bottom: 1rem;

    @media ($bp-medium-max) {
      flex-direction: column;
    } 
  }

  &__logo {

    @include ma-layout-left-col;
    min-width: 45px;

    @media ($bp-medium-max) {

      img {
        width: 60px;
      }
    }
  }

  &__navlinks {
    margin-bottom: 1rem;
    display: flex;

    @media ($bp-small-max) {
      flex-direction: column;
    }
    
    & > div {


      @media ($bp-small-min) {

        &:not(:first-child) {
          margin-left: 2.5rem;
        }
      }

      @media ($bp-small-max) {
        margin-top: 0.5rem;
      }

      & > a {
      
        @include ma-link-underline;
        padding-bottom: 3px;
        color: var(--mf-c-font-base);
        font-weight: $fonts-normal;
    
        &:hover {
          border-bottom-color: rgba($c-font-dark,.5);
        }
      }
    }

  }

  &__copyright {
    font-size: $fonts-smaller;
    color: var(--mf-c-gray-dark);
    font-weight: $fonts-light;

    &--bold {
      font-weight: $fonts-normal;
    }
  }
}