﻿/* mobil menu */

.panel, .subPanel {
    width: 100%;
    /*background: #F8F7F2;*/
    /*background:#e2dddd;*/
    position: absolute;
    /*height: 100%;*/
    top: 0;
    bottom: 0;
    /*right: -200px;*/
    right: 0px;
    -webkit-transition: ease 0.5s;
    -moz-transition: ease 0.5s;
    -o-transition: ease 0.5s;
    transition: ease 0.5s;
    overflow: hidden;
    height: 0px;
    text-align: left;
    border-top: solid 4px #006caa;
    background-color: #DCDCDE;
}

.panel {
    z-index: 10;
    /*border-left: 1px solid #F2F0E8;*/
    font-size: 0; /* this removes spaces that was above panel */
    /*border-top: 4px solid #006caa;*/
    /*background-color: #DCDCDE;*/
}

    /*.panel a {
        color: Black;
    }*/

    .panel ul {
        list-style: none;
        padding: 0;
    }

        .panel ul li {
            width: 100%;
            padding: 10px;
            font-size: 1.2rem;
            border-bottom: 1px solid Silver;
            /*color: #F15F48;*/
            /*color: Black;*/
            cursor: pointer;
            font-weight: bold;
            /*background-color: #F8F7F2;*/
        }

            /*.panel ul li:hover {
                background: #FFB305;
                color: #fff;
            }*/

            /*.panel ul li ul li {
                color: Black;
            }*/

            .panel ul li ul li:hover {
                /*background: #00B4AB;*/
                background: Gray;
                color: #fff;
            }

            .panel ul li.link {
                border-bottom: none;
                /*background-color: #DCDCDE;*/
                font-size: 16px;
                font-weight: normal;
                padding: 10px;
            }


    .panel.isOpen, .subPanel.isOpen {
        /*-webkit-transform: translateX(-200px);
    -moz-transform: translateX(-200px);
    -ms-transform: translateX(-200px);
    -o-transform: translateX(-200px);
    transform: translateX(-200px);*/
        height: 100%;
    }

.subPanel {
    z-index: 20;
    margin: 0;
}

    .subPanel .heading::before {
        content: '\25c0';
        font-weight: bold;
        margin-right: .5em;
        font-size: 85%;
    }

.openSubPanel::after {
    content: ' +';
    font-weight: bold;
    margin-right: .5em;
    font-size: 100%;
    float: right;
    padding-top: 3px;
}

.subPanel .heading {
    background: #33475B !important;
    color: #fff !important;
    font-weight: bold;
}

.closeSubPanel, .closePanel, .openSubPanel {
    cursor: pointer;
}

/* end of mobile menu */
