:root {
  --annon-block-height: 0px;
  --annon-block-positions: -40px;
}

#bx-panel,
#bx-panel.bx-panel-fixed {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  top: unset !important;
}

section.announcements-layer {
  background: rgb(207, 207, 207);
  padding: 12px 0;

  height: var(--annon-block-height);

  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;

  transition: top 1s ease;
  z-index: 10;
}

section.announcements-layer,
section.announcements-layer a {
  font-size: 11px;
}

.announcements-layer ~ .header__top {
  transition: margin-top 1s ease;
  margin-top: var(--annon-block-height);
}

section.announcements-layer.hide {
  transition: top 1s ease;
  top: var(--annon-block-positions);
}

.announcements-layer.hide ~ .header__top {
  transition: margin-top 1s ease;
  margin-top: 0;
}

section.announcements-layer > a {
  display: block;
  width: 100%;
  text-align: center;
}

.announcements-hide-fix {
  transition: margin-top 1s ease;
  margin-top: var(--annon-block-height);
}

@media (max-width: 650px) {
  .announcements-layer ~ .header__center {
    transition: margin-top 1s ease;
    margin-top: var(--annon-block-height);
  }

  .announcements-layer.hide ~ .header__center,
  .announcements-layer.hide ~ .header__bottom {
    transition: margin-top 1s ease;
    margin-top: 0;
  }

  .announcements-layer .countdown {
    display: block;
  }
}
