﻿#divFilter {
    position: fixed;
    top: 0px;
    left: 0px;
    border: solid .5px #ddd;
    height: 100%;
    font: normal .9rem var(--theme-font);
    overflow-y: visible;
    transition: .6s;
    z-index: 99;
    margin: 0px;
    background-color: #ddd;
}

    #divFilter.filterHidden {
        overflow-x: hidden;
        width: 0px;
        transition: .6s;
    }


    #divFilter > div > div > input, #divFilter > div > div > select {
        border: none;
    }




    #divFilter.filterVisible {
        opacity: 1;
    }

#back2Top, #btnRegister2 {
    display: none;
}



#sessionResult {
    padding-bottom: 10px;
    padding-left: 20px;
    font: normal 1rem var(--theme-font);
    color: #444;
}
.slideFilter {
    margin-left: 250px;
}

.filterHeading {
    font: bold 1.1rem var(--theme-font);
    color: #666;
    margin-top: 25px;
    margin-bottom: 20px;
}
#closeFilter {
    text-align:right;
}

#closeFilter > svg > path {
    fill: #444;
}

#closeFilter:hover > svg > path {
    fill: #999;
}








.filter {
    border-bottom:dashed .5px #aaa;
    margin-bottom:10px;
    padding-bottom:10px;
}

.filterplus {
    margin-top:10px;
    margin-bottom:10px;
    padding-top:10px;
    padding-bottom:10px;
    cursor:pointer;
}
.filterplus:after {
    content: "+";
    text-align: right;
    float: right;
    margin-right: 15px;
}

.filterminus:after {
    content: "-";
    text-align: right;
    float: right;
    margin-right: 15px;
}

.filterinput td {
    padding-left: 1.5rem;
    text-indent: -1.5rem;
    line-height: 1.3rem;
}

.filterinput input, .filterinput select {
    padding:7px;
}
.searchText {
    line-height: 1em;
}

@media screen and (min-width:0px) {


    .slideFilter {
        margin-left: 0px;
    }

    .searchText {
        display: none;
    }

    .searchbutton {
        width: 40%;
        max-width: 250px;
    }

    .filterplus:hover {
        background-color: #eee;
    }

    .filterplus:after {
        content: "+";
        text-align: right;
        float: right;
        margin-right: 15px;
    }

    .filterminus:after {
        content: "-";
        text-align: right;
        float: right;
        margin-right: 15px;
    }

    .filterinput {
        height: 0px;
        transition: .6s;
        overflow-y: hidden;
        padding: 0px;
        margin: 0px;
    }

    #divFilter.filterVisible {
        overflow-x: auto;
        overflow-y: visible;
        width: 90%;
        transition: opacity .6s linear;
        min-width: 210px;
        opacity: 1;
        padding: 20px;
        padding-left: 10%;
    }



    #divFilter > div {
        width: 90%;
    }

        #divFilter > div > div > input, #divFilter > div > div > select, #btnSearch {
            width: 360px;
        }

    .filtersubmenuvisible {
        height: auto;
        transition: .6s;
        overflow-y: visible;
        padding-right: 0px;
        margin-bottom: 20px;
        padding-left: 0px;
    }


}




@media screen and (min-width:1000px) {


    .slideFilter {
        margin-left: 250px;
    }

    .searchText {
        display:inline;
    }

    .searchbutton {
        width: 200px;
    }

    .filterplus:hover {
        background-color: #ddd;
    }


    .filterinput {
        display: block;
    }

    #divFilter.filterVisible {
        width: auto;
        opacity: 1;
        padding:20px;
    }



    #divFilter > div  {

        width: 210px;
    }

        #divFilter > div > div > input, #divFilter > div > div > select, #btnSearch {
            width: 210px;
        }



    .filtersubmenuvisible {

        padding-left: 0px;
    }
}

