floatingmenu {
    display: block;
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 100000;
    opacity: 0;
    pointer-events: none;
    transition-duration: 300ms;
    background: rgba(0,0,0,0.8);
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

floatingmenu ul {
    max-height: 510px;
    overflow: auto;
    text-align: center;
    margin: 0px;
    padding: 0px;
    list-style-image: none;
	padding-bottom: calc(constant(safe-area-inset-bottom) + 0px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 0px);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    transform: translateY(150px);
    transition-duration: 300ms;
    position: fixed;
    bottom: 0px;
    width: 100%;
    /*background: rgba(40,40,40,0.7);*/
    background: #222222;
    /*
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    box-shadow: 0px 0px 20px rgba(0,0,0,1);
    */
}

floatingmenu ul li {
    display: block;
    line-height: 60px;
    text-align: center;
    /*border-top: 1px solid #eeeeee;*/
}

floatingmenu ul li:first-child {
    border: 0px;
}

floatingmenu.show {
    opacity: 1;
    pointer-events: initial;
}

floatingmenu.show ul {
    transform: translateY(0px);
    opacity: 1;
    pointer-events: initial;
}