﻿.burger-container {
}

.burger-menu {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    border: none;
    padding: 0px;
    margin: 20px;
    background: linear-gradient( to bottom, #f4ebdb, #f4ebdb 20%, rgba(0,0,0,0.100) 20%, rgba(0,0,0,0.100) 40%, #f4ebdb 40%, #f4ebdb 60%, rgba(0,0,0,0.100) 60%, rgba(0,0,0,0.100) 80%, #f4ebdb 80%, #f4ebdb 100% );
}

    .burger-menu .sidebar-menu {
        visibility: hidden;
        position: relative;
        top: 40px;
        right: 170px;
        width: 200px;
        height: 100px;
        background-color: rgba(0,0,0,0.100);
        border: solid thin #f4ebdb;
        border-radius: 1em;
        padding: 0px 10px;
        box-sizing: border-box;
    }

.sidebar-menu ul {
    padding: 10px;
}

    .sidebar-menu ul li {
        list-style-type: none;
        line-height: 1.5rem;
    }

.sidebar-menu a {
    color: #f4ebdb;
    font-size: 1rem;
    text-decoration: none;
}

#burger-input:checked + .burger-menu .sidebar-menu {
    visibility: visible;
}
