@keyframes bouns {
  0% {
    transform: translateY(0); }
  60% {
    transform: translateY(-8px); }
  100% {
    transform: translateY(0); } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

/* fixed-bar */
.fixed-bar__btn {
  background-color: #fff;
  height: 70px;
  width: 70px;
  position: fixed;
  bottom: 45px;
  right: 60px;
  left: auto;
  top: auto;
  border-radius: 50%;
  border: 1px solid #eae7e7;
  z-index: 2010;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  text-align: center;
  cursor: pointer;
  font-size: 26px;
  animation: bouns .6s linear infinite;
  animation-play-state: paused; }
  @media only screen and (max-width: 37.5em) {
    .fixed-bar__btn {
      bottom: 25px;
      right: 23px; } }
  .fixed-bar__btn:hover {
    /* Toggle our animation play state to running when we are hovering over our sticker */
    animation-play-state: running; }
  .fixed-bar__btn__icon {
    vertical-align: middle;
    transition: .4s;
    font-family: 'FontAwesome';
    font-style: normal; }
    .fixed-bar__btn__icon::before {
      display: none;
      opacity: 0;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }

.fixed-bar__bar {
  max-height: 70vh;
  max-width: 90vw;
  z-index: 2000;
  position: fixed;
  top: auto;
  left: auto;
  bottom: 145px;
  right: 75px;
  background-color: #ffffff;
  border-radius: 4px;
  padding: 15px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  display: inline-block;
  border: 1px solid lightgrey;
  display: none;
  opacity: 0; }
  @media only screen and (max-width: 37.5em) {
    .fixed-bar__bar {
      top: 10%;
      left: 5%;
      right: 5%;
      bottom: auto;
      width: auto;
      max-height: 70vh;
      overflow-y: auto; } }
  .fixed-bar__bar:after {
    content: '';
    position: absolute;
    bottom: -20px;
    right: 10px;
    border: 10px solid transparent;
    border-top: 10px solid #fff; }
  .fixed-bar__bar img {
    max-width: 90%; }

/* js stuff */
.active-icon::before {
  display: block;
  opacity: 1; }

.active-bar {
  display: block;
  opacity: 1; }

.fadeIn {
  animation: fadeIn .3s linear; }

.fadeOut {
  animation-name: fadeOut; }

.wp-picker-container {
  vertical-align: -webkit-baseline-middle; }

.enable-fa .fab {
  font-family: 'Font Awesome 5 Brands'; }

@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  src: url("../webfonts/fa-regular-400.eot");
  src: url("../webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.woff") format("woff"), url("../webfonts/fa-regular-400.ttf") format("truetype"), url("../webfonts/fa-regular-400.svg#fontawesome") format("svg"); }

.enable-fa .far {
  font-family: 'Font Awesome 5 Free';
  font-weight: 400; }

@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  src: url("../webfonts/fa-solid-900.eot");
  src: url("../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-solid-900.woff2") format("woff2"), url("../webfonts/fa-solid-900.woff") format("woff"), url("../webfonts/fa-solid-900.ttf") format("truetype"), url("../webfonts/fa-solid-900.svg#fontawesome") format("svg"); }

.enable-fa .fa,
.enable-fa .fas {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900; }
