// (C) Copyright 2020 Hewlett-Packard Enterprise Company, L.P.

#hp-info-bar {
  height: 0px;
  text-align: center;
  color: #fff;

  &.hp-active {
    height: 20px;
    line-height: 20px;
    background-color: #666;
    -webkit-animation-name: relax;
    -webkit-animation-duration: 10s;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-delay: 0;
    -moz-animation-name: relax;
    -moz-animation-duration: 10s;
    -moz-animation-timing-function: ease-in;
    -moz-animation-iteration-count: 1;
    -moz-animation-delay: 0;
    -ms-animation-name: relax;
    -ms-animation-duration: 10s;
    -ms-animation-timing-function: ease-in;
    -ms-animation-iteration-count: 1;
    -ms-animation-delay: 0;
    -o-animation-name: relax;
    -o-animation-duration: 10s;
    -o-animation-timing-function: ease-in;
    -o-animation-iteration-count: 1;
    -o-animation-delay: 0;
  }
}

@-webkit-keyframes relax {
  0%   {background-color: $tooltip-background; height: 0px;}
  5%   {background-color: $tooltip-background; height: 30px; line-height: 30px;}
  90%  {background-color: $tooltip-background; height: 30px; line-height: 30px;} 100% {background-color: #666; height: 20px; line-height: 20px;} 
}

@-moz-keyframes relax {
  0%   {background-color: $tooltip-background; height: 0px;}
  5%   {background-color: $tooltip-background; height: 30px; line-height: 30px;}
  90%  {background-color: $tooltip-background; height: 30px; line-height: 30px;} 100% {background-color: #666; height: 20px; line-height: 20px;} 
}

@-ms-keyframes relax {
  0%   {background-color: $tooltip-background; height: 0px;}
  5%   {background-color: $tooltip-background; height: 30px; line-height: 30px;}
  90%  {background-color: $tooltip-background; height: 30px; line-height: 30px;} 100% {background-color: #666; height: 20px; line-height: 20px;} 
}

@-o-keyframes relax {
  0%   {background-color: $tooltip-background; height: 0px;}
  5%   {background-color: $tooltip-background; height: 30px; line-height: 30px;}
  90%  {background-color: $tooltip-background; height: 30px; line-height: 30px;} 100% {background-color: #666; height: 20px; line-height: 20px;} 
}
