.el_bt {
    position      : relative;
    width         : 86px;
    height        : 34px;
    min-height    : 34px;
    font-size     : 14px;
    text-align    : center;
    border        : 2px solid transparent;
    outline       : none;
    border-spacing: none;
    transition    : ease 0.3s;
    border-radius : 10px;
}

.el_positive {
    border-color    : #4081FF;
    color           : #4081FF;
    background-color: white;
}

.el_positive:active {
    color           : white;
    background-color: #4081FF;
}

.el_static {
    border-color    : #c5c5c5;
    color           : #c5c5c5;
    background-color: white;
}

.el_static:active {
    color           : white;
    background-color: #c5c5c5;
}

.el_good {
    border-color    : #2CC880;
    color           : #2CC880;
    background-color: white;
}

.el_good:active {
    color           : white;
    background-color: #2CC880;
}

.el_negative {
    border-color    : #FF6464;
    color           : #FF6464;
    background-color: white;
}

.el_negative:active {
    color           : white;
    background-color: #FF6464;
}

.el_select {
    position     : relative;
    width        : 228px;
    height       : 30px;
    border       : 2px solid #C5C5C5;
    outline      : none;
    font-size    : 14px;
    color        : #C5C5C5;
    transition   : ease 0.3s;
    border-radius: 10px;
    padding      : 0px 6px 0px 6px;
}

.el_select:active {
    border: 2px solid #D4ACFF;
    color : #D4ACFF;
}

.el_hlGrid {
    position   : relative;
    display    : flex;
    align-items: center;
    margin     : 0 auto;
}

smartselection {
    display: none;
}

.el_ss_options_holder {
    position                  : absolute;
    display                   : flex;
    align-items               : center;
    justify-content           : center;
    width                     : 70px;
    flex-direction            : column;
    min-height                : 0px;
    max-height                : 0px;
    color                     : #898989;
    background                : white;
    box-shadow                : rgba(0, 0, 0, 0.16) 0 3px 6px;
    border-bottom-left-radius : 10px;
    border-bottom-right-radius: 10px;
    overflow-x                : hidden;
    overflow-y                : hidden;
}

.el_ss_option {
    position  : relative;
    width     : calc(100% - 20px);
    max-width : calc(100% - 20px);
    font-size : 12px;
    padding   : 10px 10px 10px 10px;
    transition: ease 0.3s;
    text-align: center;
    word-wrap : break-word;
}

.el_ss_option:active {
    background-color: #4081FF;
    color           : white;
}

.el_ss_option[negative="true"]:active {
    background-color: #FF6464;
    color           : white;
}

.el_static_layout {
    position : relative;
    padding  : 62px calc(50% - 502px) 62px calc(50% - 502px);
    word-wrap: break-word;
    width    : 1004px;
    min-width: 280px;
}

@media (max-width:1044px) and (min-width:0),
(max-width:1044px) and (min-device-width:0) {
    .el_static_layout {
        padding: 62px 20px 62px 20px;
        width  : calc(100% - 40px);
    }
}

@media (max-width:320px) and (min-width:0),
(max-width:320px) and (min-device-width:0) {
    .el_static_layout {
        padding: 62px 20px 62px 20px;
        width  : 280px;
    }
}

@media(hover:hover) and (pointer:fine) {
    .el_positive:hover {
        color           : white;
        background-color: #4081FF;
    }

    .el_negative:hover {
        color           : white;
        background-color: #FF6464;
    }


    .el_static:hover {
        color           : white;
        background-color: #c5c5c5;
    }

    .el_good:hover {
        color           : white;
        background-color: #2CC880;
    }

    .el_select:hover {
        border: 2px solid #D4ACFF;
        color : #D4ACFF;
    }

    .el_ss_option:hover {
        background-color: #4081FF;
        color           : white;
    }

    .el_ss_option[negative="true"]:hover {
        background-color: #FF6464;
        color           : white;
    }
}