.ho-cookies {
position: fixed;
bottom: 1rem;
left: 1rem;
right: 1rem;
border-radius: 10px;
z-index: 997;
background-color: #013f09;
color: white;
max-height: calc(100vh - 100px - 1rem - 1rem);
overflow-y: auto;
transform: translateY(calc(100% + 1rem));
animation: showCookieBar 250ms forwards; box-shadow: 0 0 8px rgba(0,0,0,.6);
max-width: 600px;
margin-left: auto;
}
.admin-bar .ho-cookies {
bottom: calc(1rem + 46px);
}
@media screen and (min-width: 783px) {
.admin-bar .ho-cookies {
bottom: calc(1rem + 32px);
}
}
.text-x {
background: lime;
}
.ho-cookies--hidden {
display: none;
}
.ho-cookies__close {
color: white;
background-color: transparent;
position: absolute;
top: .1rem;
right: .6rem;
border: none;
padding: .25rem;
z-index: 2;
}
.ho-cookies__close path {
fill: white;
}
.ho-cookies > div {
overflow: hidden;
}
.ho-cookies > div::before {
content: "";
display: block;
position: absolute;
top: 0;
right: 0;
left: 0;
background-color: rgba(0, 0, 0, .3);
height: 38px;
z-index: 1;
}
.ho-mode-scrolling .ho-cookies {
max-height: calc(100vh - 60px - 1rem - 1rem);
}
.ho-cookies-btn-cookies-bar {
position: absolute;
bottom: 120px;
right: 0;
z-index: 997;
background-color: #013f09;
color: white;
border: none;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
padding: .25rem .5rem;
font-size: .8rem;
box-shadow: 0 0 8px rgba(0,0,0,.6);
}
.ho-cookies-btn-cookies-bar--hidden {
display: none;
}
@keyframes showCookieBar {
to {
transform: translateY(0);
}
}