.helix {
    background-color: rgba(211, 211, 211, 0.5);
    font: 15pt arial, sans-serif;
    text-align: center;
}

.helix  .hidden {
    display: none !important;
}

.helix .hamburger {
    display: none;
    height: initial !important;
    margin-left: 5px;
    user-select: none;
}

.helix.menu > div {
    vertical-align: top;
}

.helix.menu > .item {
    display: inline-block;
    width: 200px;
    height: 50px;
    text-align: center;
    padding-top: 20px;
    font-weight: bold;
    font-size: 17pt;
    user-select: none;
}

.helix.menu > .item.small {
    height: 30px;
}

.helix.menu > .item:hover {
    color: white;
    background-color: #01993c;
    cursor: pointer;
}

.helix.menu > .item.selected {
    background-color: lightgrey;
    color: white;
    cursor: default;
}

.helix.menu  .logo {
    display: inline-block;
    max-height: 70px;
}

.helix.menu .logoContainer {
    display: inline-block;
}

.helix.menu.fixed {
    position: fixed !important;
    top: 0px !important;
    width: 100%;
    z-index: 100 !important;
}

.helix.menu.horizontal > .item {
    display: inline-block;
}

.helix.menu.small .item, .helix.menu.small .logo {
    height: 60px;
}

.helix.menu.vertical > div {
    display: block;
}

@media screen and (max-width: 1020px) {
    .helix.menu.fixed {
        position: initial !important;
    }

    .helix .hamburger {
        cursor: pointer;
        display: block;
        font-size: 60pt;
    }

    .helix.menu {
        height: initial !important;
    }	
    
    .helix.menu  .item {
        font-size: 35pt;
        height: 80px;
    }	

    .helix.menu  > .item.smallMenu { 
        display: none; 
        font-size: 35pt;
        height: 80px;
        width: 100%;
    }
    
    .helix.menu > .item.hidden {
        display: none !important;
    }
}