.ep_panel_ot {
    padding: 0px 4px 0px 4px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_1 {
    margin-bottom: 20px;
    background-color: #fff;
    /*border: 1px solid transparent;*/
    border-left: 5px solid #53b046;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_2 {
    margin-bottom: 20px;
    background-color: #fff;
    /*border: 1px solid transparent;*/
    border-left: 5px solid #e03c42;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_3 {
    margin-bottom: 20px;
    background-color: #fff;
    /*border: 1px solid transparent;*/
    border-left: 5px solid #efb633;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_4 {
    margin-bottom: 20px;
    background-color: #fff;
    /*border: 1px solid transparent;*/
    border-left: 5px solid #0497cb;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_5 {
    margin-bottom: 20px;
    background-color: #fff;
    /*border: 1px solid transparent;*/
    border-left: 5px solid #375fc0;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_border {
    border: 1px solid #cccccc;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.ep_border1 {
    border: 1px solid #cccccc;
}

.ep_borderR {
    border-top-left-radius: 30px;
    border-bottom-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.ep_RT_h1a {
    position: relative;
    float: right;
    right: 10px;
    top: 0px;
    font-size: 11px;
    color: #000;
    line-height: 14px;
    padding: 0px 2px 0px 0px;
    z-index: 100;
}

.ep_RT_h1b {
    position: relative;
    float: right;
    right: 10px;
    top: 0px;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    line-height: 16px;
    padding: 0px 2px 0px 0px;
    z-index: 100;
}

.ep_panel_6 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #ec8883;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_7 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #79c7ab;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_8 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #7e90d0;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_9 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #a563d4;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_10 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #abd875;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_11 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #f2d07d;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_12 {
    margin-bottom: 20px;
    background-color: #fff;
    border-left: 5px solid #f266b8;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding: 0px 0px 0px 0px;
}

.ep_panel_heading {
    padding: 0px 12px 8px 0px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}
/*.ep_panel_heading {
    padding: 12px 12px 8px 12px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}*/
/*.ep_panel_heading_00 {
    padding: 0px 12px 8px 0px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}*/

.ep_panel_heading1 {
    padding: 0px 12px 0px 12px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px
}

.ep_panel_title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 15px;
    color: #4e9af1;
}

.ep_panel_body {
    width: 100%;
    display: table;
    content: " ";
    clear: both;
    padding: 10px 3px 10px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_body1 {
    width: 100%;
    display: table;
    content: " ";
    clear: both;
    padding: 0px 3px 2px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_body_s {
    width: 100%;
    display: table;
    content: " ";
    clear: both;
    padding: 0px 3px 6px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_h {
    height: 121px;
    padding: 0px 3px 10px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_ship_h {
    height: 132px;
    padding: 0px 3px 10px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_ship_h_1 {
    height: 123px;
    padding: 0px 3px 10px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_ship_h_1a {
    min-height: 118px;
    padding: 0px 3px 10px 0px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_h_1 {
    height: 157px;
    padding: 0px 3px 10px 12px;
    margin: 0px 0px 0px 0px;
}

.ep_panel_title1a {
    position: relative;
    float: left;
    left:-2px;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #fff;
    text-transform: uppercase;
    border-radius: 0px 0px 10px 0px;
    background-color: #53b046;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 7px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title1 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing:0.1px;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #53b046;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title2 {
    position: relative;
    float: left;
    left: -2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
/*    text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #e03c42;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title3 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*    text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #efb633;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title4 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #0497cb;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title5 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #375fc0;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title5a {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #375fc0;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title6 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #ec8883;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title7 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #79c7ab;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title8 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #7e90d0;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title9 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #a563d4;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title10 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #abd875;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title11 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #f2d07d;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

.ep_panel_title12 {
    position: relative;
    float: left;
    left:-2px;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #fff;
    /*text-transform: uppercase;*/
    border-radius: 0px 0px 10px 0px;
    background-color: #f266b8;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    padding: 5px 12px 5px 13px;
    margin: 0px 0px 10px 0px;
}

/*.textarea {
    width: 100%;
    resize: none;
    border-top: 1px solid #dadce0;
    border-right: 1px solid #dadce0;
    border-bottom: 1px solid #dadce0;
    border-left: 1px solid #dadce0;
    border-radius: 0.25rem;
    padding: 0.4em 4.5em 0.4em 0.4em;
    margin-bottom: 16px;
}

    .textarea:focus {
        outline: none;
        border-top: 1px solid #1e78e4;
        border-right: 1px solid #1e78e4;
        border-bottom: 1px solid #1e78e4;
        border-left: 1px solid #1e78e4;
    }*/

.textarea_s1 {
    width: 100%;
    height: 200px;
    resize: none;
    border-top: 1px solid #dadce0;
    border-right: 1px solid #dadce0;
    border-bottom: 1px solid #dadce0;
    border-left: 1px solid #dadce0;
    border-radius: 0.25rem;
    padding: 0.4em 4.5em 0.4em 0.4em;
    margin-bottom: 16px;
}

    .textarea_s1:focus {
        outline: none;
        border-top: 1px solid #1e78e4;
        border-right: 1px solid #1e78e4;
        border-bottom: 1px solid #1e78e4;
        border-left: 1px solid #1e78e4;
    }

.notes {
    width: 100%;
    resize: none;
    border-top: 1px solid #dadce0;
    border-right: 1px solid #dadce0;
    border-bottom: 1px solid #dadce0;
    border-left: 1px solid #dadce0;
    border-radius: 0.25rem;
    padding: 0.4em 4.5em 0.4em 0.4em;
    margin-bottom: 1px;
}

    .notes:focus {
        outline: none;
        border-top: 1px solid #1e78e4;
        border-right: 1px solid #1e78e4;
        border-bottom: 1px solid #1e78e4;
        border-left: 1px solid #1e78e4;
    }

/************************ TOP INFO STRIP START ********************/
.strip_h1 {
    position: relative;
    float: left;
    left: 0px;
    font-size: 14px !important;
    color: #FFF;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 15px;
    padding: 3px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}

.strip_mid_h1 {
    position: relative;
    float: left;
    left: 0px;
    font-size: 21px !important;
    font-weight:600;
    color: #FFF;
    line-height: 25px;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}

.strip_sh1 {
    position: relative;
    float: left;
    left: 0px;
    font-size: 13px !important;
    color: #FFF;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 14px;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}
.strip_sh2 {
    position: relative;
    float: left;
    left: 0px;
    font-size: 13px !important;
    color: #FFF;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 14px;
    padding: 0px 0px 3px 0px;
    margin: 0px 0px 0px 0px;
}

.strip_span {
    position: relative;
    float: left;
    left: 0px;
    font-size: 12px;
    color: #FFF;
    line-height: 10px;
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
}

/************************ TOP INFO STRIP ENDS ********************/

/************************ TOP INFO BAR START ********************/
.tile_count .tile_stats_count, ul.quick-list li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #FFF;
}

.tile_count {
    margin-bottom: 0px /*margin-bottom:20px;
	margin-top:20px*/
}

    .tile_count .tile_stats_count {
        border-bottom: 1px solid #D9DEE4;
        /*padding:0 10px 0 20px;*/
        padding: 3px 10px 5px 10px;
        position: relative
    }

        .tile_count .tile_stats_count:before {
            content: "";
            position: absolute;
            left: 0;
            height: 76px;
            /*border-left:2px solid #fff;*/
            margin-top: 0px
        }

@media (min-width:992px) {
    .tile_count .tile_stats_count {
        margin-bottom: 0px;
        border-bottom: 0;
        padding-bottom: 3px;
        /*margin-bottom:10px;
border-bottom:0;
padding-bottom:10px;*/
    }

        .tile_count .tile_stats_count:first-child:before {
            border-left: 0
        }
}

.tile_count .tile_stats_count .count {
    /*font-size:28px;*/
    font-size: 24px;
    line-height: 24px;
    font-weight: 500;
    color: #FFF;
}

.ttl_bg1a {
    background-color: #8f9ede;
}

.ttl_bg1b {
    background-color: #8fd3bb;
}

.ttl_bg1c {
    background-color: #bbd88d;
}

.ttl_bg1d {
    background-color: #eabea0;
}

.ttl_bg1e {
    background-color: #e4a09c;
}

.ttl_bg1f {
    background-color: #FF9AA2;
}

@media (min-width:768px) {
    .tile_count .tile_stats_count .count {
        /*font-size:40px;*/
        font-size: 22px;
        font-weight: 500;
        color: #FFF;
        line-height: 24px;
    }
}

@media (min-width:992px) and (max-width:1100px) {
    .tile_count .tile_stats_count .count {
        font-size: 30px;
    }
}

.tile_count .tile_stats_count span {
    font-size: 12px;
    color: fff !important /*color:#17387d*/
}

@media (min-width:768px) {
    .tile_count .tile_stats_count span {
        font-size: 13px;
        /*font-size: 12px;*/
        color: #FFF;
        padding-top: 5px;
        padding-left: 0px;
        line-height: 10px;
    }

    .count_bottom span {
        font-size: 12px;
        color: #FF0;
        padding-top: 5px;
        padding-left: 0px;
        line-height: 10px;
    }

    /*.strip_h1 {
        position: relative;
        float: left;
        left: 0px;
        font-size: 13px;
        color: #FFF;
        line-height: 15px;
        padding:0px 0px 0px 0px;
        margin:3px 0px 0px 0px;
    }
    .strip_mid_h1 {
        position: relative;
        float: left;
        left: 0px;
        font-size: 16px;
        color: #FFF;
        line-height: 16px;
        padding: 0px 0px 0px 0px;
        margin: 2px 0px 2px 0px;
    }
    .strip_sh1 {
        position: relative;
        float: left;
        left: 0px;
        font-size: 12px;
        color: #FFF;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        line-height: 14px;
        padding: 0px 0px 0px 0px;
        margin: 0px 0px 0px 0px;
    }
    .strip_span {
        position: relative;
        float: left;
        left: 0px;
        font-size: 12px;
        color: #FFF;
        line-height: 10px;
        padding: 0px 0px 0px 0px;
        margin: 0px 0px 0px 0px;
    }*/


}

.tile_count .tile_stats_count .count_bottom i {
    width: 12px;
    line-height:10px;
}

/************************ TOP INFO BAR END ********************/

/************************ PAGES INPUT & BOX START ********************/

.field {
    position: relative;
    /*margin: 0.8em 0.6em 0.8em 0em;*/
    margin: 0.15em 0.6em 0.5em 0em;
}

    .field input {
        width: 100%;
        font-size: 14px !important;
        font-family: Arial, Helvetica, sans-serif;
        border: 1px solid #dadce0;
        border-radius: 0.25rem;
        /*padding: .41em 0.5em;*/
        padding: .62em 0.6em !important;
    }

        .field input:focus {
            width: 100%;
            font-size: 14px !important;
            font-family: Arial, Helvetica, sans-serif;
            border: 1px solid #1e78e4;
            border-radius: 0.25rem;
            /*padding: .41em 0.5em;*/
            padding: .62em 0.6em !important;
        }

    .field label {
        position: absolute;
        left: 0;
        top: 50%;
        font-size:14px !important;
        color: #000000;
        transform: translatey(-50%);
        padding: 0.5em 0.25em;
        margin: 0 0.25em;
        transition: all 0.2s ease-in-out;
        font-family: Arial, Helvetica, sans-serif;
    }

.dropdown1_h1 {
    position: absolute;
    float: left;
    left: 2px;
    top: -5px;
    font-size: 14px !important;
    color: #237ce3;
    line-height: 8px;
    background-color: #FFF;
    padding: 2px 4px 2px 4px;
    z-index: 100;
}

.dropdown1 {
    width: 100%;
    font-size: 14px !important;
    font-family: Arial, Helvetica, sans-serif;
    border: 1px solid #dadce0;
    border-radius: 0.25rem;
    /*padding: .43em 0.1em;*/
    /*padding: .7em 0.2em !important;*/
    padding: .55em 0.2em !important;
}

    .dropdown1:focus {
        width: 100%;
        font-size: 14px !important;
        font-family: Arial, Helvetica, sans-serif;
        border: 1px solid #1e78e4;
        border-radius: 0.25rem;
        /*padding: .43em 0.1em;*/
        padding: .55em 0.2em !important;
    }

.populated-input label, .focus-active label {
    top: 0;
    background-color: white;
    /*font-size: 0.75em;*/
    font-size:12px;
    color: #1e78e4;
    line-height: 9px;
    padding-left:5px;
}

.populated-input input, .focus-active input {
    outline: none;
}

.clear-button {
    margin: 1em;
    padding: 0.5em 1em;
    background-color: transparent;
    font-size: 1em;
}

#toggle {
    position: absolute;
    float: right;
    top: 14px;
    right: -8px;
    display: block;
    width: 28px;
    height: 30px; /*margin: 30px auto 10px;*/
}

    #toggle span:after, #toggle span:before {
        content: "";
        position: absolute;
        left: 0;
        top: -9px;
    }

    #toggle span:after {
        top: 9px;
    }

    #toggle span {
        position: relative;
        display: block;
    }

        #toggle span, #toggle span:after, #toggle span:before {
            width: 100%;
            height: 3px;
            background-color: #888;
            transition: all 0.3s;
            backface-visibility: hidden;
            border-radius: 2px;
        }
    /* on activation */
    #toggle.on span {
        background-color: transparent;
    }

        #toggle.on span:before {
            transform: rotate(45deg) translate(5px, 5px);
        }

        #toggle.on span:after {
            transform: rotate(-45deg) translate(7px, -8px);
        }

    #toggle.on + #menu {
        opacity: 1;
        visibility: visible;
    }
/* menu appearance*/
#menu {
    position: relative;
    float: right;
    /*right:40px;*/
    right: -9px;
    top: 36px;
    color: #999;
    width: 120px;
    padding: 5px;
    margin: auto;
    font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;
    font-size: 14px;
    text-align: left;
    border-radius: 4px;
    background: white;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.09);
    /* just for this demo */
    opacity: 0;
    visibility: hidden;
    transition: opacity .4s;
}

    #menu:after {
        position: absolute;
        top: -12px;
        left: 92px;
        content: "";
        display: block;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-bottom: 12px solid white;
    }

ul, li, li a {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0;
}

    li a {
        padding: 2px;
        color: #888;
        text-decoration: none;
        transition: all .2s;
    }

        li a:hover, li a:focus {
            background: #53b046;
            color: #fff;
        }

.cF_Scroll_ot {
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 3px 1px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 4px 1px rgb(0 0 0 / 10%);
    padding-top: 12px;
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 10px;
}

.cF_Scroll_1 {
    height: 484px;
    overflow: scroll;
    overflow-x: hidden;
    padding-top: 5px;
    padding-right: 5px;
}

.cF_Scroll_2 {
    height: 580px;
    overflow: scroll;
    overflow-x: hidden;
    padding-top: 2px;
    padding-right: 5px;
}
/************************ PAGES INPUT & BOX END ********************/


.centered {
    margin: 50px auto;
    text-align: center;
}

.button::-moz-focus-inner {
    border: 0;
    padding: 0;
}

.button {
    display: inline-block;
    *display: inline;
    zoom: 1;
    padding: 6px 10px;
    margin: 0;
    cursor: pointer;
    border: 1px solid #fff;
    overflow: visible;
    font: 14px arial, helvetica, sans-serif;
    text-decoration: none;
    white-space: nowrap;
    color: #ffffff;
    background-color: #53B04E;
    -webkit-transition: background-color .2s ease-out;
    -moz-transition: background-color .2s ease-out;
    -ms-transition: background-color .2s ease-out;
    -o-transition: background-color .2s ease-out;
    transition: background-color .2s ease-out;
    background-clip: padding-box; /* Fix bleeding */
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .button:hover {
        background-color: #32962d;
        color: #ffffff;
    }

    .button:active {
        background: #e9e9e9;
        position: relative;
        top: 1px;
        text-shadow: none;
        -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
    }

    .button[disabled], .button[disabled]:hover, .button[disabled]:active {
        border-color: #eaeaea;
        background: #fafafa;
        cursor: default;
        position: static;
        color: #999;
        -moz-box-shadow: none !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    .button.small {
        padding: 4px 12px;
    }

    .button.large {
        padding: 8px 15px; /*text-transform: uppercase;*/
    }

        .button.large:active {
            top: 2px;
        }

    .button.green, .button.red, .button.blue {
        color: #fff;
        text-shadow: 0 1px 0 rgba(0, 0, 0, .2);
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .3)), to(rgba(255, 255, 255, 0)));
        background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
        background-image: -moz-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
        background-image: -ms-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
        background-image: -o-linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
        background-image: linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
    }

    .button.green {
        background-color: #57a957;
        border-color: #57a957;
    }

        .button.green:hover {
            background-color: #62c462;
        }

        .button.green:active {
            background: #57a957;
        }

    .button.red {
        background-color: #ca3535;
        border-color: #c43c35;
    }

        .button.red:hover {
            background-color: #ee5f5b;
        }

        .button.red:active {
            background: #c43c35;
        }

    .button.blue {
        background-color: #269CE9;
        border-color: #269CE9;
    }

        .button.blue:hover {
            background-color: #70B9E8;
        }

        .button.blue:active {
            background: #269CE9;
        }

.green[disabled], .green[disabled]:hover, .green[disabled]:active {
    border-color: #57A957;
    background: #57A957;
    color: #D2FFD2;
}

.red[disabled], .red[disabled]:hover, .red[disabled]:active {
    border-color: #C43C35;
    background: #C43C35;
    color: #FFD3D3;
}

.blue[disabled], .blue[disabled]:hover, .blue[disabled]:active {
    border-color: #269CE9;
    background: #269CE9;
    color: #93D5FF;
}

.button-group, .button-group li {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

.button-group {
    position: absolute;
    float: left;
    left: -6px;
    font-size: 0; /* Inline block elements gap - fix */
    margin: 0;
    padding: 0;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
}

    .button-group li {
        margin-right: -1px; /* Overlap each right button border */
    }

    .button-group .button {
        font-size: 13px; /* Set the font size, different from inherited 0 */
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
    }

        .button-group .button:active {
            -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        }

    .button-group li:first-child .button {
        -moz-border-radius: 3px 0 0 3px;
        -webkit-border-radius: 3px 0 0 3px;
        border-radius: 3px 0 0 3px;
    }

        .button-group li:first-child .button:active {
            -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        }

    .button-group li:last-child .button {
        -moz-border-radius: 0 3px 3px 0;
        -webkit-border-radius: 0 3px 3px 0;
        border-radius: 0 3px 3px 0;
    }

        .button-group li:last-child .button:active {
            -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        }

.button1::-moz-focus-inner {
    border: 0;
    padding: 0;
}

.button1 {
    display: inline-block;
    /**display: inline;*/
    zoom: 1;
    padding: 8px 10px;
    margin: 0;
    cursor: pointer;
    border: 1px solid #fff;
    overflow: visible;
    font: 14px arial, helvetica, sans-serif;
    text-decoration: none;
    white-space: nowrap;
    color: #ffffff;
    background-color: #53B04E;
    -webkit-transition: background-color .2s ease-out;
    -moz-transition: background-color .2s ease-out;
    -ms-transition: background-color .2s ease-out;
    -o-transition: background-color .2s ease-out;
    transition: background-color .2s ease-out;
    background-clip: padding-box; /* Fix bleeding */
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .button1:hover {
        background-color: #32962d;
        color: #ffffff;
    }

    .button1:active {
        background: #e9e9e9;
        position: relative;
        top: 1px;
        text-shadow: none;
        -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
        -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
        box-shadow: 0 1px 1px rgba(0, 0, 0, .3) inset;
    }

    .button1[disabled], .button1[disabled]:hover, .butto1n[disabled]:active {
        border-color: #eaeaea;
        background: #fafafa;
        cursor: default;
        position: static;
        color: #999;
        -moz-box-shadow: none !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

.button-group1, .button-group1 li {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

.button-group1 {
    position: absolute;
    float: right;
    right: -6px;
    font-size: 0; /* Inline block elements gap - fix */
    margin: 0;
    padding: 0;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
}

    .button-group1 li {
        margin-right: -1px; /* Overlap each right button border */
    }

    .button-group1 .button1 {
        font-size: 13px; /* Set the font size, different from inherited 0 */
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
    }

        .button-group1 .button1:active {
            -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        }

    .button-group1 li:first-child .button1 {
        -moz-border-radius: 3px 0 0 3px;
        -webkit-border-radius: 3px 0 0 3px;
        border-radius: 3px 0 0 3px;
    }

        .button-group1 li:first-child .button1:active {
            -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
            box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, -5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        }

    .button-group1 li:last-child .button {
        -moz-border-radius: 0 3px 3px 0;
        -webkit-border-radius: 0 3px 3px 0;
        border-radius: 0 3px 3px 0;
    }

    .button-group1 li:last-child .button1:active {
        -moz-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset;
        box-shadow: 0 0 1px rgba(0, 0, 0, .2) inset, 5px 0 5px -3px rgba(0, 0, 0, .2) inset;
    }