@import 'client/common';

[data-react-class="BroadcastHolder"] {
  position:absolute;
  min-height:60px;
  top:62px;
  @include border_box_sizing;

  .broadcast-notification {
    position:absolute;
    border-width:1px;
    border-color:$ColorScreenPrimary;
    border-style:solid;
    padding:5px 12px;
    height:100%;
    width:100%;
    left:0;
    top:0;
    overflow:hidden;
    margin-left:60px;
    @include border_box_sizing;

  }
  .message {
    float:left;
    width:calc(100% - 150px);
    font-size:12px;
  }

  .actions {
    float:right;
    text-align: right;
    vertical-align: middle;
    display:inline;
    height:100%;
    width:150px;
  }

  .actionsAligner {
    display:inline-block;
    vertical-align:middle;
    text-align:center;
  }

  a { display:inline-block; }

  .button-orange {
    font-size:16px;
    position:relative;
    top:8px;
  }

  .not-now {
    font-size:11px;
    top:13px;
    position:relative;
  }
}


.bn-slidedown-enter {
  max-height:0;
  opacity: 0.01;
  transition: max-height .5s ease-in;
}

.bn-slidedown-enter.bn-slidedown-enter-active {
  max-height:60px;
  opacity: 1;
}

.bn-slidedown-leave {
  max-height:60px;
  transition: max-height .5s ease-in;
}

.bn-slidedown-leave.bn-slidedown-leave-active {
  max-height:0;
}