@import "flive-vars";

.banner-wrapper {
  width: 100%;
  text-align: center;
}
.banner--vertical {
  width: 100%;
  min-width: 100%;
}
.banner--horizontal-sm {
  width: 80px;
  min-width: 80px;
  @media (min-width: $screen-sm-min) {
    width: 145px;
    min-width: 145px;
  }
}
.banner--horizontal-md {
  width: 80px;
  min-width: 80px;
  @media (min-width: $screen-sm-min) {
    width: 145px;
    min-width: 145px;
  }
  @media (min-width: $screen-md-min) {
    width: 200px;
    min-width: 200px;
  }
}
.banner--horizontal-lg {
  width: 80px;
  min-width: 80px;
  @media (min-width: $screen-sm-min) {
    width: 145px;
    min-width: 145px;
  }
  @media (min-width: $screen-md-min) {
    width: 200px;
    min-width: 200px;
  }
  @media (min-width: $screen-lg-min) {
    width: 300px;
    min-width: 300px;
  }
}
.banner--padded {
  padding: 20px;
}