.scrollbar
{
    height: 400px;
    /*min-width: 100%;*/
    background-color: #fcfcfc;
    overflow-y: scroll;
    overflow-x: auto;
    /*margin-bottom: 25px;*/
    position:relative;
    border-bottom:2px solid #9d9e9d;
    border-top:2px solid #9d9e9d;
    border-left:1px solid #9d9e9d;
    /*max-height: 80vh;*/
}
.force-overflow
{
    min-height: 550px;
}
#rollertable {
} 
#rollertable .cdiv {
    display:inline-flex;
    padding:1px;
    height:100%;
    vertical-align:top;
    width:120px;
    border-right: 1px solid silver;
    border-bottom: 1px solid silver;
}
#rollertable .rdiv {
    position:relative;
    max-height:100px;
    height:20px;
}
.rdiv:nth-child(odd) {
    background-color:#f1f1f1 !important;
}
.rdiv:nth-child(even) {
    background-color:#ffffff !important;
}

#viewportDiv {
    padding:1px;
    overflow-y:auto;
    width:200px;
    height:100px;
    position:absolute;
    background-color:white;
    border:solid 1px red;
    box-shadow: 0 3px 8px rgba(0,0,0,.24);
    border-top-right-radius:8px;
    border-bottom-right-radius:8px;
    border-bottom-left-radius:8px;
    z-index:1100;
}
.viewport {
    cursor:zoom-in;
    white-space: nowrap;
    overflow:hidden;
    font-size:0.7rem;
}
.viewport-header {
    width:120px;
    padding:2px;
    border-top:1px solid #cacaca;
    border-right:1px solid #cacaca;
    display:inline-flex;
    background-color:#6d6e6d;
    transition: background-color 0.5s ease;
    border-bottom: 1px solid silver;
    text-transform: capitalize;
    color:#e8e8e8;
    height:40px;
    font-size:0.7rem;
    position:relative;
}
.viewport-header:hover {
    background-color:#3BA3C4;
    cursor:pointer;
}
.viewport-block {
    position:absolute;
    right:0;top:0px;
    height:39px;z-index:-1;width:100%;
    background-color: #6d6e6d; /* Old browsers */
    background: -moz-linear-gradient(top, #7e7e7e 0%, #5e5e5e 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #7e7e7e 0%,#5e5e5e 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #7e7e7e 0%,#5e5e5e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

    border-top:1px solid #cacaca;
}
#scrollbar-header {
    border-left:1px solid #cacaca;
}
.sort {
    position:absolute;
    right:2px;
    z-index:1;
}
/*results list's toggler */
.slider{
    display:none;
    position:fixed;
    background-color:white;
    z-index:10001;
    -webkit-box-shadow: 0 3px 8px rgba(0,0,0,.4);
    box-shadow: 0 3px 8px rgba(0,0,0,.24);
    top:0px;
    right:0px;
    min-width:500px;
    width:auto;
    max-width:50%;
    min-height:200px;
    height:max-content;
    max-height:90%;
    padding-right:50px;
    margin-right:20px;
    border-color: gray;
    border-image: none;
    border-style: solid;
    border-width: 2px 1px 1px;
    font-size:0.9rem;
}
.toggler {
    font-size:0.9rem;
    line-height:1.9rem;
    margin:0;
    cursor:pointer;
}
.toggler:hover {
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    font-weight:bold;
}
.expandSlider {
    float:right;
    font-weight:bold;
    font-size:1.1rem;
    cursor:pointer;
}
.sliderExpanded {
    font-weight:bold;
}
.collapseSlider{
    display:none;
    float:right;
    font-weight:bold;
    font-size:1.1rem;
    cursor:pointer;
}
.sliderExpanded .collapseSlider{
	display:block;
    float:right;
    font-weight:bold;
    cursor:pointer;
}
.sliderExpanded .expandSlider{
	display:none;
}
.slide-body {
    list-style-type:none;
    padding-left:10px;
    padding-top:5px;
    list-style-type: none;
    max-height: 800px;
    overflow-x:auto;
    width:auto;
}