.wrapper {
  position: fixed;
  left: 50%;
  bottom: -1000px;
  transform: translateX(-50%);
  width: 90%;
  padding: 1em;
  margin: 0 auto;
  font-size: .9em;
  color: #fff;
  background: #054a51;
  border-radius: 10px;
  border: 1px solid #555;
  transition: bottom .8s ease;
  z-index:100;
}
.wrapper.show {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  bottom: 2em;
}
.wrapper h1 {
  margin-bottom: 10px;
  text-align: center;
  font-family: var(--fontserif);
  font-size: 1.2em;
}
.wrapper div p {
  font-family: var(--fontsans);
  text-align: justify;
  color: #fff;
}
.wrapper div p:nth-of-type(1) {
  padding-bottom: 1em;
}
.wrapper div p a {
  color: #fff;
  text-decoration: underline;
}
.buttons {
  display: flex;
  justify-content: center;
}
.buttons .button {
  margin-top: 15px;
  margin-bottom: 15px;
  background-color: #ffc52f;
  color: #000;
  padding: 15px;
  font-family: var(--fontsans);
  font-size: 1em;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.buttons .button:hover {
  filter: brightness(110%);
}

@media screen and (min-width:768px) {
	.wrapper {
    font-size: 1em;
  }
}
@media screen and (min-width:1000px) {
	.wrapper {
        width: 100%;
        border-radius: 0;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        font-size: .9em;
        padding: 1.2em;
    }
    .wrapper.show {
        bottom: 0;
    }
    .wrapper h1 {
        text-align: left;
    }
    .wrapper > .data {
        width: 70%;
        margin-right: 2em;
    }
    .wrapper > .buttons {
        width: 25%;
    }
}
@media screen and (min-width:1110px) {
	.wrapper {
        left: 0;
        transform: none;
        justify-content: center; /* centers the children as a group */
    }
    .wrapper > .data, .wrapper > .buttons {
        flex: 0 0 auto;
    }
    .wrapper > .data {
        width: calc(1080px * 0.7);
    }
    .wrapper > .buttons {
        width: calc(1080px * 0.25);
    }
  
}

.wrapper .data {
  margin-top: 0;
}
.data p a:hover {
  text-decoration: underline;
}
/*.buttons #acceptBtn:hover {
  background-color: aqua;
}*/