& when (@media-common = true) {
  .page-footer {
    .footer.content {
      display: flex;
      justify-content: space-between;
      .tp-footer-cell {
        ul {
          padding-right: 0;
          &.socnet {
            width: 222px;
            a {
              display: block; height: 34px; width: 34px; float: left; overflow: hidden; text-indent: -9999px; margin-right: 3px;margin-bottom:5px;
              &.fb { background: url('@{baseDir}Vkost_Tp24/images/socnet.png') no-repeat 0 0; &:hover { background-position: 0 -44px; }}
              &.in { background: url('@{baseDir}Vkost_Tp24/images/socnet.png') no-repeat -76px 0; &:hover { background-position: -76px -44px; }}
              &.gp { background: url('@{baseDir}Vkost_Tp24/images/socnet.png') no-repeat -38px 0; &:hover { background-position: -38px -44px; }}
              &.yt { background: url('@{baseDir}Vkost_Tp24/images/socnet.png') no-repeat -152px 0; &:hover { background-position: -152px -44px; }}
              &.tw { background: url('@{baseDir}Vkost_Tp24/images/socnet.png') no-repeat -114px 0; &:hover { background-position: -114px -44px; }}
              &.pt { background: url('@{baseDir}Vkost_Tp24/images/socnet.png') no-repeat -190px 0; &:hover { background-position: -190px -44px; }}
            }
          }
        }
      }
    }
  }
  // This wrapper wraps the contact form on a cms page, so it needs the same css as a normal row block
  .contact-form-wrapper {
    box-sizing: border-box;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1280px;
    padding: 0 10px;
  }
  .register-your-lamp {
    display: flex;
    justify-content: space-between
  }
  .bundle-options-attributes {
    display: flex;
    flex-direction: column;
    .table-wrapper {
      .option-product-name {
        text-transform: uppercase;
        font-size: 14px;
      }
      margin-top: 10px!important;
      &:first-child {
        margin-top: 0!important;
      }
    }
  }
  .bundle-options-container {
    clear: none;
  }
}

// DESKTOP CUSTOMIZATION - over 1024px
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__l) {
  .register-your-lamp {
    display: flex;
  }
  .bundle-options-attributes {
    flex-direction: row;
    .table-wrapper {
      margin-top: 0!important;
      margin-left: 10px!important;
      &:first-child {
        margin-top: 0!important;
        margin-left: 0!important;
      }
    }
  }
}

// DESKTOP - under 1024, but over 768
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
  .tp-header-contact {
    float: left;
    width: 300px;
  }
  .register-your-lamp {
    display: flex;
    &:before {
      content: none;
    }
    &:after {
      content: none;
    }
  }
  .bundle-options-attributes {
    flex-direction: row;
    .table-wrapper {
      margin-top: 0!important;
      margin-left: 10px!important;
      &:first-child {
        margin-top: 0!important;
        margin-left: 0!important;
      }
    }
  }
}

// MOBILE CUSTOMIZATION - under 768
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
  .page-footer {
    .footer.content {
      flex-direction: column;
      justify-content: space-between;
      .tp-footer-cell {
        text-align: center;
        margin-bottom: 10px;
        &.footer-logo {
          display: none;
        }
        .socnet {
          margin: 0 auto;
        }
      }
    }
  }
  .tp-header-contact {
    padding: 7px 0 7px 0;
    text-align: center;
    float: none;
    width: 100%;
  }
}