/*Menu Buttons Style*/

input[type=checkbox] {
    display: none;
}

/* Show the menu when the checkbox is checked */
input[type=checkbox]:checked ~ .menu_cap {
    transform: translateY( calc( -35vh + 70px));
    z-index: 100;
}
input[type=checkbox]:checked ~ #fullscreen_toogle {
    display: block;
    z-index: 100;
}

/* You can click any place of the screen to close the menu but in the menu itself */

#fullscreen_toogle {
    z-index: 100;
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    background-color: var(--acompanamiento-color);
    opacity: 0.7;
}

/* Menu style */

.menu_cap {
    z-index: 100;
    height: 35vh;
    position: absolute;
    top: 0;
    transform: translateY(-35vh);
    transition: all 0.25s;
    width: 17vw;
    color: white;
}
.menu_cap:hover {
    transform: translateY(0vh) !important;
}

.menu_cap button {
    width: 100%;
    border: none;
    position: fixed;
    bottom: 0;
    padding: 1%;
    font-family: Ancizar sans;
    color: white;
    font-size: 25px;
    text-transform: uppercase;
}

.menu_cap p {
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    text-align: center;
    font-family: Ancizar sans;
    font-size: medium;
    line-height: 100%;
    color: white;
    margin: 0;
    text-transform: uppercase;
}

.bot_0 {
    left: 20vw;
}
.bot_0:hover {
    transform: translateY(0vh) !important;
}
.bot_1 {
    left: 38vw;

}
.bot_2 {
    left: 56vw;
}
.bot_3 {
    left: 74vw;

}

.close {
    float: right;
}
.close:hover,
.open:hover,
li:hover {
    color: black;
}