.bookingwrap {
    position:fixed;
    bottom:0;
    right:-100%;
    width:100%;
    height:100vh;
    background:rgba(0,0,0,.95);
    z-index:9;
    transition:all 0.4s linear;
    visibility: hidden;
}

.bookme {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    background:#FDFAF1;
    padding:40px;
    width:50%;
    max-width:50%;
    max-height:80vh;
    transition:all 0.4s linear;
    overflow:hidden;
    text-align:center;
}

.bookme iframe {
}

.bookingframe {
    max-height:70vh;
    overflow:auto;

}

.bookingwrap.active {
    left:0;
    visibility: visible;
}

.closebooking {
    background:#AA8246;
    width:60px;
    height:60px;
    border-radius:50%;
    position:absolute;
    right:40px;
    top:40px;
    transition:all 0.4s ease-in-out;
    z-index:1;
}
.closebooking:hover {
    filter:brightness(1.1);
    cursor:pointer;
    transform:scale(1.1)
}
.closebooking svg {
    width:25px;
    height:25px;
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
}
.groups {
    text-align:center;
    margin-bottom:50px;
}
.openbookinggolden {
    background: #AA8246;
    font-size:28px;
    color:#fff;
    text-align:center;
    text-decoration: none;
    line-height: 1;
    text-transform: uppercase;
    padding:10px 15px;
    filter: drop-shadow(0px 4px 10px rgba(0,0,0,.25));
    border-radius: 10px;
    transition:all 0.4s linear;
    display:inline-block;
    font-weight:600;
    margin-top:12px;
}
.openbookinggolden:hover {
    background:#CE9D3E;
    cursor:pointer;
}
@media screen and (max-width: 960px) {
    .bookme {
        width:90%;
        max-width:90%;
    }
}
@media screen and (max-width: 430px) {
    .bookme {
        padding:25px;
    }
}