#privacy-message {
  position: fixed;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba($white, 0.9);
  z-index: 100000;
  padding: em(20px) em(60px);
  @media screen and (max-width: $large_breakpoint) {
    padding: em(20px);
  }
}

.privacy-message__close {
  position: absolute;
  top: 0;
  right: 0;
  width: em(60px);
  height: 100%;
  transform: none;
  transition: transform 0.3s;
  &:before, &:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    height: 2px;
    margin-top: -1px;
    margin-left: em(-10px);
    width: em(20px);
    background: $black;
    transform: rotate(45deg);
  }
  &:after {
    transform: rotate(-45deg);
  }
  &:hover {
    transform: scale(1.1);
  }
  @media screen and (max-width: $large_breakpoint) {
    height: em(60px);
    &:before, &:after {
      height: 1px;
      margin-top: 0;
    }
  }
}

.privacy-message__frame {
  max-width: em(1200px);
  margin: 0 auto;
  width: 100%;
  position: relative;
  padding-right: em(400px);
  p {
    margin: 0;
    color: $black;
    font-size: em(14px);
    padding-right: em(40px);
    line-height: 1.4;
    a {
      color: $green;
      transition: color 0.3s;
      &:hover {
        color: $black;
      }
    }
  }
  @media screen and (max-width: $large_breakpoint) {
    padding-right: 0;
  }
}

.privacy-message__actions {
  position: absolute;
  top: 50%;
  right: 0;
  width: 100%;
  max-width: em(400px);
  font-size: 0;
  transform: translateY(-50%);
  .button {
    display: inline-block;
    width: 48%;
    &:first-child {
      margin-right: 4%;
    }
  }
  @media screen and (max-width: $large_breakpoint) {
    position: relative;
    margin-top: em(20px);
    transform: none;
  }
  @media screen and (max-width: $small_breakpoint) {
    .button {
      width: 100%;
      &:first-child {
        margin-bottom: em(10px);
      }
    }
  }
}