%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /var/www/maraton.eco-n-tech.co.uk/wp-content/themes/maraton/src/scss/
Upload File :
Create Path :
Current File : /var/www/maraton.eco-n-tech.co.uk/wp-content/themes/maraton/src/scss/_footer.scss

// Footer {
footer {
  // First Footer Section
  .footer__section_1 {
    background: $primary;
    color: $white;
    padding-block: calc-rem(150);

    @include media-breakpoint-down(md) {
      padding-block: calc-rem(80);
    }

    &-description {
      font-size: calc-rem(30);

      @include media-breakpoint-down(md) {
        font-size: calc-rem(22);
        max-width: calc-rem(330);
      }
    }

    &-link {
      text-align: center;

      @include media-breakpoint-down(md) {
        margin-top: calc-rem(30);
        text-align: left;
      }

      a {
        color: #e1d4c8;
        font-size: calc-rem(30);
        font-weight: 400;
        text-decoration: none;

        &:hover {
          img {
            margin-left: 15px;
          }
        }

        img {
          vertical-align: middle;
          margin-left: calc-rem(10);
          display: inline-block;
          transition: 0.2s all ease;
        }
      }
    }

    &-contacts {
      p {
        margin-bottom: calc-rem(35);
      }

      a {
        color: $white;
        font-weight: 600;
        text-decoration: none;
        transition: 0.2s all ease;

        &:hover {
          color: shift-color($white, $link-shade-percentage);
        }
      }

      h4 {
        margin-bottom: calc-rem(20);
      }
    }

    hr {
      background-color: $white;
      margin-block: calc-rem(85);

      @include media-breakpoint-down(md) {
        margin-block: calc-rem(50);
      }
    }
  }

  // Footer main section
  .footer {
    background-color: $black;
    padding-top: calc-rem(130);
    padding-bottom: calc-rem(150);
    color: #e1d4c8;

    @include media-breakpoint-down(md) {
      padding-top: calc-rem(80);
      padding-bottom: calc-rem(25);
    }

    // left footer part
    &__left {
      // Menu
      &-menu {
        display: flex;
        flex-flow: column;

        @include media-breakpoint-down(md) {
          align-items: center;
        }

        a {
          color: #e1d4c8;
          text-decoration: none;
          font-weight: 400;
          line-height: calc-lh(20, 40);
          transition: 0.2s all ease;

          @include media-breakpoint-down(md) {
            line-height: 2.5;
          }

          &:hover {
            color: shift-color(#e1d4c8, $link-shade-percentage);
          }
        }
      }

      // Meta Links
      &-meta_links {
        @include media-breakpoint-down(md) {
          flex-flow: column;
          display: flex;
          align-items: center;
          margin-top: calc-rem(75);

          a {
            width: calc-rem(260);
            justify-content: center;
          }
        }

        a {
          text-decoration: none;
          margin: calc-rem(10);
          color: #e1d4c8;
          border: 1px solid #e1d4c8;
          border-radius: 28px;
          padding-inline: calc-rem(30);
          height: calc-rem(54);
          display: inline-flex;
          align-items: center;
          transition: $transition_normal;

          @include media-breakpoint-down(md) {
            margin: calc-rem(15) 0;
          }

          &:hover {
            background-color: #e1d4c8;
            color: $black;
          }
        }
      }

      // Addresses
      &-addresses {
        margin-top: calc-rem(125);

        @include media-breakpoint-down(md) {
          text-align: center;
          margin-top: calc-rem(80);
        }
      }

      // Footer part
      &-footer {
        margin-top: calc-rem(100);
        display: flex;

        @include media-breakpoint-down(md) {
          display: none;
        }

        &__meta {
          font-size: calc-rem(15);
        }

        &__socials {
          margin-left: calc-rem(45);
        }

        a {
          color: $white;
          text-decoration: none;
          transition: 0.2s all ease;
          display: inline-block;

          &:hover {
            color: shift-color($white, $link-shade-percentage);
          }

          &:not(:last-child) {
            margin-right: calc-rem(45);
          }
        }

        span {
          margin-left: calc-rem(45);
        }
      }
    }

    // right footer part
    &__right {
      color: #e1d4c8;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
      margin-top:calc-rem(30);

      @include media-breakpoint-down(lg) {
        padding-top: calc-rem(100);
        margin-top: 0;
      }

      .col {
        &:not(:last-child) {
          margin-right: calc-rem(38);
        }
      }

      &-content {
        * {
          max-width: calc-rem(560);
          margin-inline: auto;
        }

        h2 {
          margin-bottom: calc-rem(45);
          font-size: calc-rem(60);

          @include media-breakpoint-down(md) {
            font-size: calc-rem(30);
          }
        }

        p {
          margin-bottom: calc-rem(30);
        }
      }

      &-button {
        background-color: $primary;
        color: $white;
        text-decoration: none;
        padding-inline: calc-rem(40);
        height: calc-rem(65);
        border-radius: calc-rem(33);
        display: flex;
        align-items: center;
        transition: 0.2s all ease;

        @include media-breakpoint-down(md) {
          max-width: calc-rem(240);
          margin-inline: auto;
        }

        &:hover {
          background-color: $black;
        }

        img {
          width: calc-rem(27);
          margin-left: calc-rem(8);
          margin-block: 0 !important;
        }
      }

      img {
        @include media-breakpoint-down(md) {
          margin-bottom: calc-rem(15);
        }
      }
    }

    // mobile footer part
    &__mobile {
      &-socials {
        text-align: center;
        margin-top: calc-rem(50);
        margin-bottom: calc-rem(30);

        a {
          display: inline-block;
          padding: calc-rem(50);
          color: $white;
          font-size: calc-rem(35);
        }
      }

      &-meta {
        display: flex;
        flex-flow: row;
        justify-content: space-around;

        a {
          font-size: calc-rem(16);
          color: $white;
          text-decoration: none;
        }
      }
    }
  }

  // Footer tagline
  .footer__tagline {
    background-color: $primary;
    color: $white;
    padding-block: calc-rem(75);

    @include media-breakpoint-down(md) {
      padding-block: calc-rem(35);
    }

    h2 {
      font-size: calc-rem(60);
      font-weight: 600;
      margin-bottom: 0;

      @include media-breakpoint-down(md) {
        font-size: calc-rem(30);
        text-align: center;
        letter-spacing: calc-rem(-1.2);
        line-height: calc-rem(38);
        max-width: 340px;
        margin: auto;
      }

      @media (max-width: 400px) {
        font-size: calc-rem(26);
      }
    }
  }

  // Copyright
  .footer__copyright {
    background-color: $black;
    color: $white;
    font-size: calc-rem(15);
    padding-block: calc-rem(15);

    @include media-breakpoint-down(md) {
      text-align: center;
    }
  }
}
// } Footer

Zerion Mini Shell 1.0