$logo-dimensions: 100px;
$logo-sm-dimensions: 85px;
$logo-xs-dimensions: 70px;

.logo-container {
  position: absolute;
  top: -12px;
  left: 0;
  height: $logo-dimensions;
  width: $logo-dimensions;
  z-index: $zindex-logo-container;

  &.is-tier1 {
    display: table;
    .logo-image {
      display: inline-block;
    }
  }

  .company-name {
    max-width: 100%;
    height: auto;
    display: table-cell;
    vertical-align: bottom;
    text-align: center;
    @include font-size(14px);
    font-weight: $font-weight-bold;

    .logo-image,
    .logo-text {
      border: 1px solid $header-background;
      background-color: $white;
      color: $black;
      vertical-align: bottom;
    }
  }
}


@media (max-width: $screen-sm-max) {
  .logo-container {
    .company-name {
      .logo-image,
      .logo-text {
        max-height: $logo-sm-dimensions;
      }
    }
  }
}

@media ( max-width: $screen-xs-max){
  .logo-container {
    height: $logo-xs-dimensions;
    width: $logo-xs-dimensions;
    left: 6px;
    margin: 0;
    margin-top: 1.2rem;

    .company-name {
      @include font-size(12px);
      position: relative;

      .logo-image,
      .logo-text {
        position: absolute;
        bottom: 0;
        left: 0;
        max-height: $logo-xs-dimensions;
      }
    }
    .odp-business-image {
      display: block;
    }
  }
}