/* Scrollbar width */
::-webkit-scrollbar {
    width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #4d4a69;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #5cb88e;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgba(221, 119, 16, 0.521);
}

label {
    width: 90px;
    margin: 0px 10px 0px 0px;
}

#display_container {
    display: table;
    width: 360px;
    padding: 4px;
    margin-top: 6px;
    border: solid rgb(221, 206, 183) 2px;
}

#add_times {
    background-color: rgba(11, 92, 185, 0.199);
    padding: 8px;
    border: solid rgb(243, 234, 234) 1px;
    border-radius: 3px;
}

#times {
    width: 240px;
    margin: 0px 0px 0px 3px;
}

.results {
    background-color: rgba(230, 242, 247, 0.9);
    width: 150px;
    height: 35px;
    padding: 4px;
    border: solid rgb(243, 234, 234) 1px;
    border-radius: 3px;
}

/* help */
#hlp_button {
    position: absolute;
    top: 6px;
    left: 280px;
    cursor: crosshair;
    vertical-align: middle;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 40px;
    font-weight: bold;
    color: #8d560e;
}

#hlp_button:hover {
    color: #dd1710;
}

#hlp_box {
    position: fixed;
    top: 35px;
    left: 30px;
    width: 382px;
    height: 120px;
    overflow-y: scroll;
    background-color: #fffffe;
    color: #302f88;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 15px;
    margin: -5px 0px 6px 0px;
    padding: 2px;
    border: solid #539b7f 1px;
    border-radius: 4px;
    z-index: 1;
    display: none;

}

#hlp_close {
    background: #202642;
    color: #cff0ce;
    font-weight: bold;
}

#hlp_close:hover {
    color: #dd1710;
    cursor: crosshair;
}

@media all and (max-device-width: 500px) {
    #times {
        width: 200px;
        margin: 0px 0px 0px 3px;
    }

    #hlp_box {
        position: fixed;
        top: 33px;
        left: 27px;
        width: 348px;
        padding: 3px;
    }
}