$b: "top_logo";

.#{$b}__outer {
  background-image: url(image_path('bg.png'));

  width: 100%;
  max-height: 100%;
  background-position: 0 21px;
  transition: max-height 0.25s ease-in;
  overflow: hidden;
}

.#{$b}_collapser {
  padding-top: 20px;
  padding-bottom: 20px;

}

.#{$b}_collapser.collapsed {
  max-height: 0;
  transition: max-height 0.15s ease-out;
}

.#{$b}__logo-outer {
  text-align: center;
}

.#{$b}__logo {
    &:hover {
    color: white;
    text-decoration: none;
  }
}

.#{$b}__logo-text {
  font: 18px/24px $arial;
  color: white;
}

.#{$b}__lable-outer {
}

.#{$b}__lable-wrapper {
  text-align: center;
  display: inline-block;
  min-width: 345px;
  width: 100%;
}

.#{$b}__lable {
  display: inline-block;
  background-color: red;
  color: white;
  @include single-text-shadow(1px, 1px, 2px, false, #000);
  @include single-box-shadow(0px, 0px, 5px, false, #000);

  height: 40px;
  font: 22px/40px $arial;
  padding-left: 10px;
  padding-right: 10px;
  @include border-radius(20px);
  margin-top: 35px;
  margin-bottom: 35px;
}

@media (min-width: 768px) {
  .#{$b}__logo-outer {
    text-align: left;
  }
  .#{$b}__lable-wrapper {
    text-align: right;
  }
}

@media (min-width: 992px) {
  .#{$b}__lable {
    height: 60px;
    font: 34px/60px Arial, Verdana, sans-serif;
    padding-left: 15px;
    padding-right: 15px;
    @include border-radius(30px);
    margin-top: 25px;
    margin-bottom: 25px;
  }

}