/*
  LWT EU Compliance Banner module styles
  For use across all themes in combination with default eu_cookie_compliance.bare.css
*/

#sliding-popup {
  z-index: 99999;
  margin: 0;
  padding: 1.1em 0;
  width: 100%;
  left: 0;
  background-color: #000;
  background-image: none;
  color: #fff;
}

#sliding-popup .popup-content {
  max-width: 85%;
  min-height:2.6em;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
}

@media screen and (min-width: 645px) and (max-width: 840px) {
  /* Extra height to cover blue sticky footer on tablet sizes */
  #sliding-popup .popup-content {
    min-height:4.9em;
  }
}

@media screen and (max-width: 860px) {
  /* Tighten spacing */
  #sliding-popup .popup-content {
    max-width: 90%;
  }
}
@media screen and (max-width: 600px) {
  #sliding-popup .popup-content {
    max-width: none;
    padding: 0 1em;
  }
}
@media screen and (max-width: 480px) {
  /* Remove wrapping */
  #sliding-popup .popup-content {
    flex-flow: row wrap;
  }
}


/* Text column */
#sliding-popup .popup-content #popup-text {
  float: none;
  max-width: none;
  margin: 0;
  font: 400 17px/1.3 "futura-pt",sans-serif;
}
#sliding-popup .popup-content #popup-text p {
  display: inline;
  margin: 0;
  color: #fff;
  line-height: 1.3;
}

#sliding-popup .popup-content #popup-text strong,
#sliding-popup .popup-content #popup-text b {
  display: block;
  font-weight: 600;
}

@media screen and (max-width: 1100px) {
  /* Prevent wrapping of bold text */
  #sliding-popup .popup-content #popup-text strong,
  #sliding-popup .popup-content #popup-text b {
    display: inline;
  }
}

#sliding-popup .popup-content #popup-text a {
  color: #fff;
  text-decoration: underline;
}
#sliding-popup .popup-content #popup-text a:hover {
  color: #fff;
  text-decoration: none;
}

#sliding-popup .popup-content #popup-text button {
  display: inline;
  cursor: pointer;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  color: #fff;
  font: 400 17px/1.3 "futura-pt",sans-serif;
  text-decoration: underline;
}
#sliding-popup .popup-content #popup-text button:hover {
  text-decoration: none;
}


/* Button column */
#sliding-popup .popup-content #popup-buttons {
  float: none;
  max-width: none;
  margin: 0 0 0 1.6em;
}
@media screen and (max-width: 600px) {
  #sliding-popup .popup-content #popup-buttons {
    margin-left: 0.8em;
  }
}
@media screen and (max-width: 480px) {
  /* Wraps below text */
  #sliding-popup .popup-content #popup-buttons {
    margin: 1em 0 0;
  }
}

/* Close button */
#sliding-popup .eu-cookie-compliance-default-button {
  display: inline-block;
  margin: 0;
  padding: 0.35em 1.1em;
  -webkit-appearance: none;
  border: 1px solid transparent;
  border-radius: 2.3125rem;
  box-shadow: none;
  transition: background-color 0.25s ease-out, color 0.25s ease-out;
  font: 600 17px/1.3 "futura-pt",sans-serif;
  cursor: pointer;
  background-color: #fff;
  text-shadow: none;
  color: #000;
}
#sliding-popup .eu-cookie-compliance-default-button:hover,
#sliding-popup .eu-cookie-compliance-default-button:focus {
  background-color: #bbb;
  color: #000;
}
#sliding-popup .eu-cookie-compliance-default-button:active {
  position: inherit;
}
