#content {
    min-height: 100%;
}
.rightpadding {
padding-right:10px !important;
}
.side-bar {
    max-width: 100%;
    background: #454546 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 20px #00000076;
    border: none;
    opacity: 1;
    color: #FFF;
    position: relative;
    display: block;
    z-index: 1;
    width: 220px;
}


.logo-small {
    display: none;
}

.logo-big {
    display: block;
}

#side-main-menu {
    margin: 0;
    padding: 0;
}

    #side-main-menu li a {
        font-size: 16px;
        color: #FFF;
        padding: 20px 20px;
        display: block;
        text-decoration: none;
    }

    #side-main-menu li.active a .menu__text {
        opacity: 1;
    }

    #side-main-menu li a .menu__text {
        position: relative;
        top: 2px;
        opacity: 0.8;
    }

    #side-main-menu li.active a, #side-main-menu li:hover a {
        background-color: #626264;
    }

.mob-block {
    display: none;
}

.align-items-center {
    align-items: center !important;
}

.menu_header_bg_layout {
    background: #003D43 0% 0% no-repeat padding-box;
    padding: 15px 15px;
    border-bottom: 2px solid #858f91;
    opacity: 1;
    min-height: 97px;
}

#errorMessage {
    color: red;
}

.meter_text:hover {
    text-decoration: underline;
    cursor: pointer;
}

.m-0 {
    margin: 0 !important;
}

.main_header_layout {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    opacity: 1;
    min-height: 99px;
}

.padding_header {
    padding: 0px 36px;
}

.flex-grow-1 {
    flex-grow: 1 !important;
}

.helvetica {
    font-family: Helvetica, Arial, sans-serif;
}

.font-weight-600 {
    font-weight: 600;
}

.font-weight-700 {
    font-weight: 700;
}

.f-46 {
    font-size: 46px;
}

.f-18-nozoom {
    font-size: 18px;
}


.f-15-7 {
    font-size: 15px;
}

.main__body_head {
    background: #004F5B 0% 0% no-repeat padding-box;    
    opacity: 1;
    color: white;
    padding: 20px;
}

.f-26 {
    font-size: 26px;
}

.f-31 {
    font-size: 31px;
}

.main__body_row {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #CECECE;    
    padding: 20px;
}

.text-Mosque {
    color: #00535B;
}

.f-30 {
    font-size: 20px;
}

.border-right {
    border-right: 1px solid #dee2e6 !important;
}

.img_clock_layout_qc {
    width: 16px;
    margin-top: -10px;
}

.input_calender_span_layout_common {
    background-color: white;
    cursor: pointer;
}

.input_calender_img_common {
    width: 20px;
    cursor: pointer;
}

.width-25 {
    width: 25px;
}

.clsCouponQty {
    border: 0px;
    outline: 0;
    max-width: 280px;
    height: 50px;
}

.minuswidth {
    width: 20px;
}

.mapmeterlogo{
    width:60px;
}
.minuswidth:hover {
    cursor: pointer;
}

.context-menuinputbox {
    cursor: context-menu;
}

.input_date_text_border_common {
    border-left: transparent;
}

.padding-9-40 {
    padding: 9px 40px;
}

.padding-benifits-acs {
    padding: 5px 150px 20px 150px !important;
}

.button-search {
    border-radius: 4px;
    border: none;
    opacity: 1;
}

.padding-0-19 {
    padding: 5px 19px;
}

.img_coupongraph_layout_qc {
    width: 41%;
    margin-top: 6%;
}

.width_div_qc {
    width: 237px;
    max-width: 100%;
}

.box_shadow_card {
    box-shadow: 7px 7px 7px #00000029;
}

.bg_coupongraph_layout_qc {
    background-color: #00A5B5;
    height: 130px;
}

.form-group label {
    font-weight: 600;
    color: #4D4D4DDE;
    margin-bottom: 3px;
}

.font_size_card_qc {
    color: dimgrey;
}

.font_input_label_qc {
    font-size: 12px;
    color: dimgrey;
}

.button_font_qc {
    font-size: 11px;
}

.button_layout {
    padding: 15px 30px;
    background: #004F5B 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
    border: none;
    color: white;
}

.f-16 {
    font-size: 16px;
}

.f-18 {
    font-size: 18px;
}

.f-25 {
    font-size: 25px;
}

.f-12 {
    font-size: 12px;
}

.f-20 {
    font-size: 20px;
}

.line-height-0 {
    line-height: 0;
}


.card_couponsettings {
    background: #19A5B5 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 6px #0000000A;
    opacity: 1;
}

.card_header_couponsettings {
    background: #003D43 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 6px #0000000A;
    border-radius: 4px 4px 0px 0px;
    opacity: 1;
    height: 80px;
}

.card1_couponsettings {
    width: 56%;
}

.inner_div_10000_layout {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    opacity: 1;
    padding: 6px;
}

.font-weight-normal {
    font-weight: normal !important;
}

.label_card2_font {
    font-size: 24px;
    color: #FFFFFF;
    opacity: 1;
}

.Pl-52 {
    padding-left: 52px !important;
}

#markerLayer img {
    filter: drop-shadow(0px 0px 0px rgba(0, 0, 0, 0));
}

.padding_card3_couponsettings {
    padding: 0px 59px;
}

.padding-30 {
    padding: 30px 30px;
}

.border-bottom {
    border-bottom: 2.5px solid !important;
}

.text_layout_mangecoupons {
    color: #00535B;
    opacity: 1;
}

.date-border-right-none {
    border-right: none;
}

.date-border-left-none {
    border-left: none;
}


#couponProfileAssignMeters {
    display: none;
}

.text1_layout_mangecoupons {
    color: #4D4D4DDE;
    opacity: 1;
}

.width-215 {
    width: 215%;
}

.card_managecouons {   
    box-shadow: 2px 2px 6px #000000DE;
    border-radius: 4px;
    opacity: 1;
    height: 110px;
}

.padding_card_managecoupons {
    padding: 5px 0px;
}

.f-15 {
    font-size: 15px;
}

.f-50 {
    font-size: 50px;
}

.f-45 {
    font-size: 35px;
}
.f-36 {   
    font-size: 36px;
}


.button_gray_color {
    /*background: #A8A8A8 0% 0% no-repeat padding-box;*/
    background: white 0% 0% no-repeat padding-box;
    border: none;
    opacity: 1;
    /*color: white;*/
    color: black !important;
}

.button_darkgreen {
    background: #004F5B 0% 0% no-repeat padding-box;
    border-radius: 4px !important;
    opacity: 1;
    border: none;
    color: white;
}

.button_lightgreen {
    background: #00A5B5 0% 0% no-repeat padding-box;
    border-radius: 4px !important;
    opacity: 1;
    border: none;
    color: white;
}

.button_padding {
    padding: 7px 20px !important;
}

.border-right-gray {
    border-right: 1px solid gray;
}

div table thead {
    background: #004F5B 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    opacity: 1;
    text-align: center;
    padding: 10px 20px;
}

div.table-common table thead tr th {
    text-align: center !important;
}

div table tbody {
    text-align: left;
}
#ExportTypeRadioTable{
    width:50px;
}

div.table-green table tbody tr {
    border-bottom: 2px solid white;
}

    div.table-green table tbody tr td:last-child {
        border: none;
        background-color: white;
    }

div.table-green table tbody tr {
    background: #CADCE1 0% 0% no-repeat padding-box;
    opacity: 1;
}

div.table-common table tbody tr:nth-child(even) {
    background: #F7F7F7 0% 0% no-repeat padding-box;
    opacity: 1;
}

div.table-common table tbody tr:nth-child(odd) {
    background: #CADCE1 0% 0% no-repeat padding-box;
    opacity: 1;
}

.checkbox-darkgreen label:before {
    border: 1px solid #00535B;
}

.table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 0px solid #ddd;
}

.boder-right-white {
    border-right: 1px solid white;
}

.bg-circle {
    border: 1px solid white;
    border-radius: 50% !important;
    height: 35px;
    width: 35px;
    max-width: 100%;
    max-height: 100%;
}

.card_managecouons.active {
    background-color: #00535B;
    box-shadow: 2px 2px 6px #000000de;
    opacity: 1;
    color: #FFF6E3;
}

.modal-padding {
    padding: 50px;
}

.modal-header .close {
    padding: 0rem 0rem;
    width: 38px;
    height: 38px;
    background: #004F5B 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
    color: white !important;
}

.modal-header-border-none {
    border-bottom: none;
}



.guide_home {
    margin-top: 120px;
    margin-left: -20px;
    display: none;
    position: absolute;
    z-index: 1;
}

.font_marginleft_guide_home {
    margin-left: -160px;
}

.overflow-x-scroll {
    overflow-x: auto;
}

.overflow-y-scroll {
    overflow-y: auto;
}

.mobile-show {
    display: none;
}

.transform-rotate-180-degree {
    transform: rotate(180deg)
}

.padding_selectgroup {
    padding: 40px 90px;
}

.f-60 {
    font-size: 60px;
}

.bg1_selectgroup {
    background: transparent linear-gradient(148deg, #00A5B5 0%, #007984 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 7px 14px #32505D33;
    border-radius: 4px;
    opacity: 1;
    padding: 30px;
    height: 496px;
}

.bg2_selectgroup {
    background-color: #004F5B;
    box-shadow: 0px 7px 14px #32505D33;
    border-radius: 4px;
    opacity: 1;
    padding: 30px;
    height: 496px;
}

.f-90 {
    font-size: 90px;
}

.f-50 {
    font-size: 50px;
}

.margin-top-selectgroup {
    margin-top: 165px;
}

.f-70 {
    font-size: 70px;
}

.div_number_generatecoupon {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border: 1px solid #DDDDDD;
    opacity: 1;
}

.padding_number {
    padding: 10px 10px;
}

.coupon_ticket_layout {
    background: transparent linear-gradient(148deg, #00A5B5 0%, #007984 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 6px #0000000A;
    border-radius: 4px;
    opacity: 1;
}

.padding_coupon_ticket {
    padding: 10px 10px;
}

.bg-circle-coupon {
    border: 1px solid white;
    border-radius: 50% !important;
    height: 70px;
    width: 70px;
    max-width: 100%;
    max-height: 100%;
}

.line-height-1 {
    line-height: 1;
}

div.ridge {
    border-style: ridge;
    border: 0.4px solid;
    padding: 9px;
}

.card-body-padding {
    padding: 0.75em;
}

.width_button {
    width: 100%;
}

.button_padding_gc {
    padding: 10px 20px;
}

.background-color-header-pop {
    background: #FF0000 0% 0% no-repeat padding-box !important;
    opacity: 1 !important;
}

.padding-modal-header {
    padding: 30px;
}

.meter_panel_wh {
    width: 320px;
    height: 320px;
    background-color: white;
    left: 10px;
    top: 10px;
}


.meter_div_wh {
    width: 320px;
    height: 70px;
}

.background-layout-green {
    background: #00A5B5 0% 0% no-repeat padding-box;
    border-radius: 4px 4px 0px 0px;
    opacity: 1;
    padding: 5px 20px;
}

.background-layout-white {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #CECECE;
    border-radius: 4px;
    opacity: 1;
}

.padding-table-div {
    padding: 5px 20px;
}

.main__body_row_without_padding {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #CECECE;
    border-radius: 4px;
}

.margin-left-20 {
    margin-left: 20px;
}

.margin-left-4-neg {
    margin-left: -4px;
}

.f-29 {
    font-size: 29px;
}

input, select, textarea {
    max-width: 100%;
}

.modal-large-width {
    width: 686px;
    max-width: 100%;
}

.vl_ps {
    border-right: 1px solid lightgray;
    height: 5px;
    right: 8%;
    float:left;
}

.vl1_ps {
    border-right: 1px solid lightgray;
    height: 5px;
    right: 12%;
}

.slide-num{
    text-align:right;
    position:relative;

}

.background-middle-ps {
    background: #626264 0% 0% no-repeat padding-box;
    border: 0.4px solid #D2CFCD;
    opacity: 1;
    padding: 4px;
}

.background_middle_darkgreen_ps {
    background: #00535B 0% 0% no-repeat padding-box;
    border: 1px solid #D2CFCD;
    opacity: 1;
    padding: 4px;
}

.background-first-last-ps {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.4px solid #D2CFCD;
    opacity: 1;
    padding: 4px;
}

.background-question-ps {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border: 0.4px solid #DDDDDD;
    border-radius: 4px;
    opacity: 1;
    padding: 20px;
}

.f-60 {
    font-size: 60px;
}

.margin-left-neg-4-ps {
    margin-left: -4%;
}

.background-steps-div-header-ps {
    background: #004F5B 0% 0% no-repeat padding-box;
    border: 1px solid #E4E4E5;
    opacity: 1;
}

.background-steps-div-body-ps {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #E4E4E5;
    opacity: 1;
}

.padding-steps-div-ps {
    padding: 10px 30px;
    padding-right: 60px;
}

.progress-bar-background {
    background: #00000076 0% 0% no-repeat padding-box;
    opacity: 1;
    margin-bottom: 0px;
    height: 10px;
}

.progress-background {
    background: #FFB718 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.pole {
    cursor: pointer;
}

.progress-width {
    width: 25%;
}

.progress-width-50 {
    width: 50%;
}

.progress-width-75 {
    width: 75%;
}

.progress-width-100 {
    width: 100%;
}

.margin-top-neg-5 {
    margin-top: -2.5%;
}

.background-steps-div-body-ps.active {
    background: #004F5B 0% 0% no-repeat padding-box;
    color: white;
    border: 1px solid #E4E4E5;
    opacity: 1;
}

div.background-steps-div-body-ps.active div.padding-steps-div-ps div {
    color: white;
}

.background-layout-popup {
    background: #00A5B5 0% 0% no-repeat padding-box !important;
    opacity: 1;
}

.close.close_layout {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
    color: #00A5B5 !important;
    margin-top: -12px;
    position: absolute;
    right: 22px;
}

.padding-header {
    padding: 22px;
}

.background_dargreen_sq {
    background: #00535B 0% 0% no-repeat padding-box;
    border: 1px solid #CECECE;
    opacity: 1;
}

.background_white_sq {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 7px 7px 7px #00000029;
    border: 1px solid #CECECE;
    border-radius: 4px;
    opacity: 1;
}

.width-img-on-off {
    width: 80px;
}

.padding-header-sq {
    padding: 40px 25px;
}

.background-cal-sq {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border: 1px solid #DDDDDD;    
    opacity: 1;
}

.padding-cal-sq {
    padding: 25px 15px;
}

.container_radio.margin-bottom-0 {
    margin-bottom: 0px;
}

.div-peach-sq {
    background: #FFF9ED 0% 0% no-repeat padding-box;
    border: 1px solid #231F20;
    border-radius: 3px;
    opacity: 1;
}

.border-bottom-1 {
    border-bottom: 1px solid;
}

.margin-top-neg-10 {
    margin-top: -10px;
}

.border-bottom-gray {
    border-bottom: 0.5px solid gray;
}

.f-13 {
    font-size: 13px;
}

.bg-Couponicon {
    background-image: url('../Images/Coupon Icon_bgpeach.png');
    background-size: 300px 470px;
    width: 300px;
    height: 470px;
}

sup.sup_top {
    top: -1.2em;
}

sup.sup_layout {
    font-weight: normal;
    font-size: 16px;    
}

.padding-img {
    padding: 10px 20px;
}

.padding-25 {
    padding: 25px;
    padding-top: 35px;
}

.padding-right-60 {
    padding-right: 60px;
}

.container_radio.margin-bottom-4 {
    margin-bottom: 4px;
}

.div-dimgrey-sq {
    background: #A5A5A5 0% 0% no-repeat padding-box;
    border: 1px solid #231F20;
    border-radius: 3px;
    opacity: 1;
}

.margin-top-neg-60 {
    margin-top: -60px;
}

.bg-white-reports {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #CECECE;   
    opacity: 1;
    padding: 5px 20px 15px;
}

.padding-25 {
    padding: 25px;
}

.chartdiv {
    background: #004F5B 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 6px #0000000A;
    border: 1px solid #CACED5;
    border-radius: 4px;
    opacity: 1;
    height: 60vh;
}

.overlaychartdiv {
    background: gray 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 6px #0000000A;
    border: 1px solid #CACED5;
    border-radius: 4px;
    opacity: 1;
    height: 60vh;
}

.bg-darkgray {
    background: #626264 0% 0% no-repeat padding-box;
    opacity: 1;
}

.bg-white {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    opacity: 1;
}

.padding_assignmeters {
    padding: 12px 0px;
}

.padding-left-s4-cs {
    padding-left: 15px;
}

.bg-black {
    background: #454546 0% 0% no-repeat padding-box;
    opacity: 1;
    width: 100%;
    height: auto !important;
}

.width-30per {
    width: 100%;
}

.padding-10-15 {
    padding: 10px 15px;
}

.col-10-button {
    max-width: 100%;
}

.padding-10 {
    padding: 10px;
}

.padding-left-30 {
    padding-left: 30px;
}

.border-bottom-A5A5A5 {
    border-bottom: 1px solid #A5A5A5
}

.bottom-div {
    position: absolute;
}

.padding_map_panel {
    padding-right: 55px;
}

.border-1 {
    border: 1px solid;
}

.border-1-black {
    border: 1px solid black;
}

.button-red {
    border-radius: 50%;
    background-color: red;
    color: white;
    border: 1px solid;
    width: 22px;
    font-size: 12px;
    padding: 3px;
}

.bg-edit {
    border-radius: 40%;
    border: 0.4px solid;
    width: 45%;
    height: 20px;
    background-color: white;
}

.margin-top-neg-5 {
    margin-top: -5px;
}

.margin-top-neg-3 {
    margin-top: -3px;
}

.font-weight-900 {
    font-weight: 900;
}

.padding-cancel-btn {
    padding: 5px 12px;
    width: 100px;
}

.padding-activated-coupons {
    padding: 0px 5px;
}

.f-9 {
    font-size: 9px;
}

.button-width-160 {
    width: 160px;
}

.div_color_wh {
    width: 15px;
    height: 15px;
}

.margin-left-90 {
    margin-left: 90px;
}

.margin-left-65 {
    margin-left: 65px;
}

.margin-left-neg-15 {
    margin-left: -15px;
}

.margin-top-neg-20 {
    margin-top: -7px;
}

.width-50 {
    width: 50px;
}

.profile-show {
    display: block;
}

.view-profile:hover {
    background-color: #626264;
}

.border-booton-2-gray {
    border-bottom: 2px solid gray;
}

.f-15-profile {
    font-size: 15px;
}

.padding-20 {
    padding: 20px;
}

.carmargin {
    margin-left: -10px;
}

input[type=text].input-card-green::placeholder {
    color: #00A5B5;
}

input[type=text].input-card::placeholder {
    color: #D2CFCD;
}

input[type=text].input-card-green {
    font-size: 20px;
    height: 85px;
    text-align: center;
    border: 0px;
    font-weight: 600;
    color: #00A5B5;
}

input[type=text].input-card {
    font-size: 60px;
    height: 85px;
    text-align: center;
    border: 0px;
    font-weight: 600;
    color: #D2CFCD;
}

/*left right nav transition*/
.left-right-arrow-layout {
    border-radius: 50%;
    width: 27%;
    height: 50px;
    opacity: 0;
    background-color: white;
    color: gray;
}

#left-arrow {
    display: block;
}

.managecoupongridalignright {
    text-align: right;
}

#right-arrow {
    display: none;
}

/*menu icon*/
.margin-left-neg-20 {
    margin-left: -20px;
}

#menu-icon {
    display: none;
}

/*text colors*/
.text_color_cs {
    color: #00535B;
}

.label1_card_font_layout_qc {
    color: #00A5B5;
}

.label_font_color_qc {
    color: #003D43;
}

.text_dimgrey {
    color: #626264;
}

.color_popupheader {
    color: #004F5B;
}

.color_peach {
    color: #FFF6E3
}

.color-red {
    color: red;
}

.color_black {
    color: #000000;
}

.color_lightgray {
    color: #4D4D4DDE;
}

.color_000000CC {
    color: #D2CFCD;
}

.color_FFFFFF {
    color: #FFFFFF;
}

.color_000000 {
    color: #000000;
}

.color_D2CFCD {
    color: #D2CFCD;
}

.color_4D4D4D {
    color: #4D4D4D;
}

.color_A5A5A5 {
    color: #A5A5A5;
}

.background-col-lightgreen {
    background: #00A5B5 0% 0% no-repeat padding-box !important;
}

.background-col-darkgreen {
    background: #003D43 0% 0% no-repeat padding-box;
}

.background_red {
    background: #FF0000 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.background_orange {
    background: #FF8900 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.background_yellow {
    background: yellow 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.background_lightgreen {
    background: #BAFF00 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.background_blue {
    background: #00EBFF 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.background_black {
    background: #454546 0% 0% no-repeat padding-box;
    opacity: 1;
}

.background_lightgreen_withborder {
    background: #00A5B5 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    opacity: 1;
}

.background_white_withborder {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    opacity: 1;
}

.background_yellow_withborder {
    background: #ffef22 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    opacity: 1;
}

.background_grey_withborder {
    background: #f0ebeb 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    opacity: 1;
}

.background_blue_withborder {
    background: #00e1ff 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    opacity: 1;
}

.FullScreenCouponSetting {
    display: block;
}

.NormalScreenCouponSetting {
    display: none;
}

.text-align-right {
    text-align: right !important;
}

@media only screen and (max-width: 550px) {

    body {
        font-size: 14px;
    }

    .mobile-hide {
        display: none;
    }

    .mobile-show {
        display: block;
    }

    .main_header_layout {
        padding: 0px 15px;
    }

    .form-group label {
        font-size: 14px;
    }

    .padding_card3_couponsettings {
        padding: 0px 25px;
    }   

    .padding-0 {
        padding: 0 !important;
    }

    .label_card2_font {
        font-size: 30px;
    }

    table thead {
        font-size: 14px;
    }

    table tbody {
        font-size: 12px;
    }

    .card_managecouons {
        width: 50%;
        max-width: 100%;
    }

    .button_padding {
        padding: 5px 10px;
    }

    .f-50 {
        zoom: 0.6;
    }

    .margin-left-neg-20 {
        margin-left: 0px;
    }

    .modal-padding {
        padding: 10px;
    }

    .margin-top-selectgroup {
        margin-top: 0px;
    }

    .padding_selectgroup {
        padding: 40px;
    }

    .margin-left-5 {
        margin-left: 15px;
    }

    .sidePanelDescription {
        font-size: 20px !important;
        text-align: center !important;
    }


    #map_canvas {
        margin-left: 0px !important;
    }
}

@media only screen and (max-width: 991px) {
    .sidePanelDescription {
        font-size: 20px !important;
        text-align: center !important;
    }

    .mobile-hide {
        display: none;
    }

    .mobile-show {
        display: block;
    }

    .width-215 {
        width: 100%;
    }

    .FullScreenCouponSetting {
        display: none;
    }

    .NormalScreenCouponSetting {
        display: block;
    }
}


@media only screen and (max-width: 1000px) {

    .sidePanelDescription {
        font-size: 20px !important;
        text-align: center !important;
    }


    .menu_header_bg_layout, .main_header_layout {
        min-height: 70px;
    }

    table thead {
        font-size: 14px;
    }

    table tbody {
        font-size: 12px;
    }

    .f-29, .f-15 {
        zoom: 0.6;
    }

    .guide_home {
        zoom: 0.7;
    }

    .margin-top-selectgroup {
        margin-top: 0px;
    }

    .margin-top-neg-5 {
        margin-top: 0px;
    }

    .bg1_selectgroup {
        width: 100%;
        height: auto;
    }

    .bg2_selectgroup {
        width: 100%;
        height: auto;
    }

    .margin-top-neg-60 {
        margin-top: 0px;
    }

    .carmargin {
        margin-left: 0px !important
    }

    .spanTitleHeader {
        zoom: 0.7;
    }

    .margin-left-step2 {
        margin-left: -15px;
    }

    .f-15-7 {
        zoom: 0.7;
    }

    .f-25 {
        zoom: 0.9;
    }
}

@media only screen and (max-width: 1200px) {
    .padding-left-smstemplate{
        padding-left: 15px !important;
    }

    .nav-item {
        width: 100% !important;
    }

    .sidePanelDescription {
        font-size: 20px !important;
        text-align: center !important;
    }

    label {
        font-size: 12px;
    }

    .side-bar #side-main-menu li a {
        -ms-flex-direction: column !important;
        flex-direction: column !important;
        display: flex !important;
        text-align: center;
        zoom: 0.9;
        padding: 15px 10px;
    }

    .f-50 {
        zoom: 0.7;
    }

    .f-60 {
        zoom: 0.8;
    }

    .logo-big {
        display: none;
    }

    .logo-small {
        display: block;
    }

    .side-bar #side-main-menu li a .menu__text {
        zoom: 0.8;
    }

    .modal-padding {
        padding: 10px;
    }

    .margin-left-20 {
        margin-left: 0px !important;
    }

    .card_header_couponsettings {
        height: auto;
    }

    .margin-left-neg-4-ps {
        margin-left: 0;
    }

    .modal-header .close {
        margin: -1rem -1rem 0rem auto;
    }

    #left-arrow {
        display: none;
    }

    #right-arrow {
        display: none;
    }

    #menu-icon {
        display: block;
    }

    .view-profile {
        text-align: center;
    }

    .view-profile-text {
        display: none;
    }

    .profile-show {
        text-align: center;
    }

    .f-15-profile {
        zoom: 0.8;
    }

    .padding_map_panel {
        padding-right: 0;
    }

    .width-30per {
        width: 188px;
    }

    .step3profilepadding {
        padding: 0px 15px;
    }

    .managecoupongridalignright {
        text-align: right !important;
    }

    .table-minwidth {
        min-width:0 !important;
    }

    .padding-0-mapreport {
        padding: 0px !important;
        height: 30px !important;
    }

    .height-30 {
        height: 30px !important;
    }

    .mb-md-1 {
        margin-bottom: .5rem !important;
    }

    #GridCodeList table tbody tr td .dxgvCSD {
        overflow: auto hidden !important;
        margin-bottom: 7px !important;
        width: 300px !important;
    }

    #GridEventList table tbody tr td .dxgvCSD {
        overflow: auto hidden !important;
        margin-bottom: 7px !important;
        width: 300px !important;
    }

    #step4callgrid {
        width: 100%;
        overflow-x: scroll;
        white-space:nowrap;
    }

    .Width_3Per {
        width: 5% !important;
    }

    .csmapselectionpanel {
        overflow-y: auto;
        overflow-x: hidden;
        height: 140px !important;
    }
    .width-97_per {
        width: 97.6%;
    }
    .width-44-height-41-toggle-step4-tabview {
        padding: 8px 3px !important;
    }

    .gray-step4-width-padding {
        min-width: 39%;
    }

    .width-54 {
        flex: 0 0 50.5% !important;        
    }
    .circle-left {
        left: 38px !important;
    }
    .lockCircle .circle {
        top: 34px !important;
    }

    .margin-left-neg-20-step3 {
        margin-left: -20px !important;
    }

    .modal-sm {
        width: 50%;
    }

    .margintopapplycancel {
        margin-left: -15px;
    }
}

@media only screen and (min-width:1210px) and (max-width:1300px) /*100% browser screen*/
{
    .f-30 {
        font-size: 24px !important;
    }

    .p-7 {
        padding: 6px !important;
    }

    .infoIcon {
        font-size: 14px !important;
    }

    .f-18 {
        font-size: 15px !important;
    }

    .meter_panel_wh {
        width: 250px;
        height: 280px;
    }

    .meter_div_wh {
        width: 250px;
        height: 70px;
    }

    .f-26 {
        zoom: 0.9;
    }

    .container_red {
        font-size: 13px !important;
    }

    .container_blue {
        font-size: 13px !important;
    }

    .container_green {
        font-size: 13px !important;
    }

    .container_gray {
        font-size: 13px !important;
    }

    .container_orange {
        font-size: 13px !important;
    }

    .container_yellow {
        font-size: 13px !important;
    }

    .checkmark_red {
        top: -4px !important;
    }

    .checkmark_blue {
        top: -4px !important;
    }

    .checkmark_green {
        top: -4px !important;
    }

    .checkmark_gray {
        top: -4px !important;
    }

    .checkmark_orange {
        top: -4px !important;
    }

    .checkmark_yellow {
        top: -4px !important;
    }
    /*upper header*/
    .main_header_layout {
        zoom: 0.6;
    }

    /*left menu*/
    .side-bar {
        zoom: 0.6;
    }
   

    /*.chartdiv,*/
    .mapreportcontentzoom {
        zoom: 0.6
    }

    .infoIcon {
        font-size: 14px !important;
    }


    /*profilesetup page*/
    .profileStep1Zoom {
        zoom: 0.8
    }

    .profileStep3Zoom {
        zoom: 0.8 !important
    }

    .profileStep3Input {
        zoom: 0.6 !important;
    }

    .profileStep3InputText {
        zoom: 0.7 !important;
    }

    .profilestep1buttonZoom {
        zoom: 0.6
    }

    .ps3-margintop {
        margin-top: 11px !important;
    }

    .ps3-marginleft {
        margin-left: -7px !important;
    }

    .profileStep4Zoom {
        zoom: 0.7 !important
    }

    .text-align-right {
        text-align: right !important;
    }

    .bg-black {
        height: auto !important;
    }



    /*page completetion*/
    .completePageZoom {
        zoom: 0.6
    }

    #FullScreen {
        zoom: 0.9
    }

    /*manage group*/
    .paddinglabelmanagegroup {
        padding-right: 0rem !important;
    }
}

@media only screen and (min-width:1310px) and (max-width: 1500px) /*90% browser screen*/
{
    .infoIcon {
        font-size: 14px !important;
    }

    .p-7 {
        padding: 6px !important;
    }

    .meter_panel_wh {
        width: 270px;
        height: 300px;
    }

    .meter_div_wh {
        width: 270px;
        height: 70px;
    }

    .f-26 {
        zoom: 0.8;
    }

    .container_red {
        font-size: 14px !important;
    }

    .container_blue {
        font-size: 14px !important;
    }

    .container_green {
        font-size: 14px !important;
    }

    .container_gray {
        font-size: 14px !important;
    }

    .container_orange {
        font-size: 14px !important;
    }

    .container_yellow {
        font-size: 14px !important;
    }

    .checkmark_red {
        top: -3px !important;
    }

    .checkmark_blue {
        top: -3px !important;
    }

    .checkmark_green {
        top: -3px !important;
    }

    .checkmark_gray {
        top: -3px !important;
    }

    .checkmark_orange {
        top: -3px !important;
    }

    .checkmark_yellow {
        top: -3px !important;
    }

    /*upper header*/
    .main_header_layout {
        zoom: 0.7;
    }

    .f-26 {
        zoom: 1.0 !important;
    }
    /*left menu*/
    .side-bar {
        zoom: 0.7;
    }
   
    /*.chartdiv,*/
    .mapreportcontentzoom {
        zoom: 0.7
    }

    .infoIcon {
        font-size: 14px !important;
    }



    /*page completetion*/
    .completePageZoom {
        zoom: 0.7
    }

    /*manage group*/
    .paddinglabelmanagegroup {
        padding-right: 0.8rem !important;
    }
}

@media only screen and (min-width:1510px) and (max-width: 1700px) /*80% browser screen*/ {
    /*upper header*/
    .main_header_layout {
        zoom: 0.8;
    }

    .p-7 {
        padding: 6px !important;
    }

    .infoIcon {
        font-size: 14px !important;
    }

    /*left menu*/
    .side-bar {
        zoom: 0.8;
    }
   
    /*.chartdiv,*/
    .mapreportcontentzoom {
        zoom: 0.8
    }

    .infoIcon {
        font-size: 14px !important;
    }


    /*profilesetup page*/
    .profileStep1Zoom {
        zoom: 0.8
    }

    .profilestep1buttonZoom {
        zoom: 0.8
    }

    .text-align-right {
        text-align: right !important;
    }

    /*page completetion*/
    .completePageZoom {
        zoom: 0.8
    }

    /*manage group*/
    .paddinglabelmanagegroup {
        padding-right: 1.5rem !important;
    }
}

@media only screen and (min-width:1701px) and (max-width: 1800px) /*75% browser screen*/
{
    .infoIcon {
        font-size: 14px !important;
    }

    .p-7 {
        padding: 6px !important;
    }

    /*upper header*/
    .main_header_layout {
        zoom: 0.9;
    }

    /*left menu*/
    .side-bar {
        zoom: 0.9;
    }
    /*home page*/
   
    /*.chartdiv,*/
    .mapreportcontentzoom {
        zoom: 0.9
    }

    .infoIcon {
        font-size: 14px !important;
    }


    /*profilesetup page*/
    .profileStep1Zoom {
        zoom: 0.9
    }

    .profilestep1buttonZoom {
        zoom: 0.9
    }

    .text-align-right {
        text-align: right !important;
    }

    /*page completetion*/
    .completePageZoom {
        zoom: 0.9
    }

    /*manage group*/
    .paddinglabelmanagegroup {
        padding-right: 2rem !important;
    }
}


/*customize radio button*/
.container_radio {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    cursor: pointer;
    font-weight: normal;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default radio button */
    .container_radio input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

/*custon radio css*/

.container_radio_qc {
    margin-bottom: 5px;
}
/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    width: 24px;
    background-color: #eee;
    border-radius: 50%;
    border: 0.5px solid lightgray;
}

/* On mouse-over, add a grey background color */
.container_radio:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container_radio input:checked ~ .checkmark {
    background-color: white;
    color: black;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.container_radio input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.container_radio .checkmark:after {
    top: 5.2px;
    left: 5.2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #004F5B;
}


.checkbox {
    width: 100%;
    margin: -6px auto;
    position: relative;
    display: block;
}

    .checkbox input[type="checkbox"] {
        width: auto;
        opacity: 0.00000001;
        position: absolute;
        left: 0;
    }

    .checkbox label {
        position: relative;
    }

        .checkbox label:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            margin: 4px;
            width: 22px;
            height: 22px;
            transition: transform 0.28s ease;
            border-radius: 3px;
            background-color: white;
        }

        .checkbox label:after {
            content: '';
            display: block;
            width: 10px;
            height: 5px;
            border-bottom: 2px solid #003D43;
            border-left: 2px solid #003D43;
            -webkit-transform: rotate(-45deg) scale(0);
            transform: rotate(-45deg) scale(0);
            transition: transform ease 0.25s;
            will-change: transform;
            position: absolute;
            top: 12px;
            left: 10px;
        }

    .checkbox input[type="checkbox"]:checked ~ label::before {
        color: #003D43;
    }

    .checkbox input[type="checkbox"]:checked ~ label::after {
        -webkit-transform: rotate(-45deg) scale(1);
        transform: rotate(-45deg) scale(1);
    }

    .checkbox label {
        min-height: 31px;
        display: block;
        padding-left: 40px;
        margin-bottom: 0;
        font-weight: normal;
        cursor: pointer;
        vertical-align: sub;
    }

        .checkbox label span {
            position: absolute;
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
        }

    .checkbox input[type="checkbox"]:focus + label::before {
        outline: 0;
    }


table.ui-datepicker-calendar thead tr {
    background-color: white;
    text-align: center;
    font: Bold 14px/16px Arial;
    letter-spacing: 0px;
    color: #004F5B;
    opacity: 1;
    border: none;
}

table.ui-datepicker-calendar thead {
    border: none;
}

table.ui-datepicker-calendar tbody {
    border: none;
}

table.ui-datepicker-calendar {
    border: none;
}

.ui-state-default, .ui-widget-content .ui-state-default {
    background: #F2F2F2 0% 0% no-repeat padding-box;
    border-radius: 2px;
    opacity: 1;
}

.ui-datepicker-calendar tbody tr td a {
    text-align: center;
    font-weight: bold;
}


/*modal css*/
.modal {
    z-index: 4;
    position: absolute !important;
    vertical-align: middle !important;
}

/*carousel css*/
#mycarousel-indicators {
    bottom: -58px;
    border-radius: 50%;
}

.carousel-indicators > li {
    height: 10px;
    width: 10px;
    border-radius: 50%;
    border: 1px solid black;
}

.carousel-indicators .active {
    background-color: black;
}
.carousel  {
    width: auto;
    height: 300px;
}

.carousel img {
    width: auto;
    height: 199px;
}


/*slider css*/
input[type=range] {
    max-width: 100%;
}

    input[type=range]:active + output {
        display: block;
        transform: translateX(-50%);
    }

.range-control {
    position: relative;
}

#inputRange {
    background: linear-gradient(to right, #00535B 0%, #00535B 0%, #e6e6e6 0%, #e6e6e6 100%);
    border: solid 1px #e6e6e6;
    border-radius: 5px;
    height: 10px;
    width: 100%;
    outline: none;
    transition: background 450ms ease-in;
    -webkit-appearance: none;
}

input[type=range]::-webkit-slider-thumb {
    position: relative;
    width: 25px;
    height: 25px;
    border: 0.5px solid #E6E6E6;
    -webkit-appearance: none;
    background-color: #FFB718;
    border-radius: 100%;
    cursor: pointer;
}

output {
    position: absolute;
    top: -32px;
    display: none;
    width: 20px;
    height: 24px;
    border: 1px solid #e2e2e2;
    background: #CECECE 0% 0% no-repeat padding-box;
    opacity: 1;
    border-radius: 3px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    color: white;
    font-size: 12px;
    line-height: 10px;
    text-align: center;
}


input[type=range]:active + output {
    display: block;
    transform: translatex(-50%);
}

output1 {
    position: absolute;
    top: -32px;
    display: none;
    width: 20px;
    height: 23px;
    border: 1px solid #e2e2e2;
    background: #FFB718 0% 0% no-repeat padding-box;
    opacity: 1;
    color: white;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

input[type=range]:active + output1 {
    display: block;
    transform: translatex(-50%);
}

/*togglebutton style*/

.toggle-button1-design {   
    border: none;
    border-radius: 17px;
}

.toggle-button2-design {
    border-bottom-right-radius: 17px;
    border-top-right-radius: 17px;
    border: none;
}

.hide-toggle-button {    
    background-color: white !important;
    border: none;
    opacity: 1;
    border-radius: 20px;
}

.div-togglegroup {   
    border: none;    
    border-radius: 20px;
    padding: 5px;
}



.width-44-height-41-toggle {   
    padding: 5px 4px;
    border-radius: 20px;
}

button:focus {
    outline: 0;
}

.pointer {
    cursor: pointer !important;
}
/*hide button bar*/
.dxgvStatusBar tr.dxgv {
    height: 0px !important;
    display: none !important;
}

/*Moved css from Quick coupon index page*/
.starttimemodal {
    height: 440px;
    width: 580px;
    max-width: 100%;
}

.startlabelml {
    margin-left: 23px;
}

#couponStart {
    padding-left: 3px;
}

.monthlymodal {
    height: 310px;
    width: 260px;
    max-width: 100%;
}

.yearlymodal {
    height: 355px;
    width: 270px;
    max-width: 100%;
}

.weeklyModel {
    width: 235px;
    max-width: 100%;
    height: 260px;
}

.modal-padding {
    padding: 10px;
}

.endtimemodal {
    height: 460px;
    width: 610px;
    max-width: 100%;
}

.ui-datepicker {
    margin-left: -42px;
}

.input-datepicker {
    width: 255px;
}

#popupMapData {
    background-color: black;
    color: white;
    padding: 10px;
}

/*--missing css*/
@media (min-width: 1200px) {
    .col-lg-6 {
        width: 50%;
    }
}

@media (min-width: 1200px) {
    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-pull-6 {
        right: 50%;
    }
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}


@media (min-width: 992px) {
    .col-md-push-6 {
        left: 50%;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1170px;
    }
}

@media (min-width: 1200px) {
    .col-lg-push-9 {
        left: 75%;
    }
}

@media (min-width: 1200px) {
    .col-xl-9 {
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }
}

@media (min-width: 1200px) {
    .col-lg-pull-3 {
        right: 25%;
    }
}

@media (min-width: 1200px) {
    .col-xl-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (min-width: 1200px) {
    .col-lg-push-7 {
        width: 58.66666667%;
    }
}

@media (min-width: 992px) {
    .col-md-pull-5 {
        right: 41.66666667%;
    }
}

@media (min-width: 1200px) {
    .col-lg-5 {
        width: 41.66666667%;
    }
}

@media (min-width: 992px) {
    .col-md-push-7 {
        left: 58.33333333%;
    }
}



h4, .h4 {
    font-size: 18px;
}

.modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px);
}

.modal-title {
    margin: 0 auto;
}


@media only screen and (max-width: 550px) {
    #GroupDetailTable .dxgvCSD {
        overflow: hidden !important;
    }

    .text-align-right {
        text-align: left;
    }
}

@media (min-width: 1800px) {
    #GroupDetailTable .dxgvCSD {
        overflow: hidden !important;
    }

    .text-align-right {
        text-align: right;
    }
}

.tooltip {
    opacity: unset !important;
}

.activeMenu {
    background: #626264 0% 0% no-repeat padding-box !important;
    opacity: !important;
}

.highlightedMenu {
    background: #acacac 0% 0% no-repeat padding-box !important;
    background-color: LightGray;
    opacity: !important;
}

.padding-130 {
    padding: 130px;
}

.red {
    color: red;
}



/*--changes form filter icon*/
.dxGridView_gvFilterRowButton {
    background-position: -130px -182px !important;
    width: 12px !important;
    height: 12px !important;
}

.dxGridView_CTClearFilter, .dxGridView_CTClearFilterDisabled, .dxGridView_CTClearGrouping, .dxGridView_CTClearGroupingDisabled, .dxGridView_CTCollapseDetailRow, .dxGridView_CTCollapseDetailRowDisabled, .dxGridView_CTCollapseRow, .dxGridView_CTCollapseRowDisabled, .dxGridView_CTDeleteRow, .dxGridView_CTDeleteRowDisabled, .dxGridView_CTEditRow, .dxGridView_CTEditRowDisabled, .dxGridView_CTExpandDetailRow, .dxGridView_CTExpandDetailRowDisabled, .dxGridView_CTExpandRow, .dxGridView_CTExpandRowDisabled, .dxGridView_CTExportCsv, .dxGridView_CTExportCsvDisabled, .dxGridView_CTExportDocx, .dxGridView_CTExportDocxDisabled, .dxGridView_CTExportPdf, .dxGridView_CTExportPdfDisabled, .dxGridView_CTExportRtf, .dxGridView_CTExportRtfDisabled, .dxGridView_CTExportXls, .dxGridView_CTExportXlsDisabled, .dxGridView_CTExportXlsx, .dxGridView_CTExportXlsxDisabled, .dxGridView_CTFullCollapse, .dxGridView_CTFullCollapseDisabled, .dxGridView_CTFullExpand, .dxGridView_CTFullExpandDisabled, .dxGridView_CTNewRow, .dxGridView_CTNewRowDisabled, .dxGridView_CTRefresh, .dxGridView_CTRefreshDisabled, .dxGridView_CTShowCustDialog, .dxGridView_CTShowCustDialogDisabled, .dxGridView_CTShowCustomizationWindow, .dxGridView_CTShowCustomizationWindowDisabled, .dxGridView_CTShowFilterEditor, .dxGridView_CTShowFilterEditorDisabled, .dxGridView_CTShowFilterRow, .dxGridView_CTShowFilterRowDisabled, .dxGridView_CTShowGroupPanel, .dxGridView_CTShowGroupPanelDisabled, .dxGridView_CTShowSearchPanel, .dxGridView_CTShowSearchPanelDisabled, .dxGridView_gvCellError, .dxGridView_gvCMClearFilter, .dxGridView_gvCMClearFilterDisabled, .dxGridView_gvCMClearGrouping, .dxGridView_gvCMClearGroupingDisabled, .dxGridView_gvCMCollapseDetailRow, .dxGridView_gvCMCollapseDetailRowDisabled, .dxGridView_gvCMCollapseRow, .dxGridView_gvCMCollapseRowDisabled, .dxGridView_gvCMDeleteRow, .dxGridView_gvCMDeleteRowDisabled, .dxGridView_gvCMEditRow, .dxGridView_gvCMEditRowDisabled, .dxGridView_gvCMExpandDetailRow, .dxGridView_gvCMExpandDetailRowDisabled, .dxGridView_gvCMExpandRow, .dxGridView_gvCMExpandRowDisabled, .dxGridView_gvCMExportCsv, .dxGridView_gvCMExportCsvDisabled, .dxGridView_gvCMExportDocx, .dxGridView_gvCMExportDocxDisabled, .dxGridView_gvCMExportPdf, .dxGridView_gvCMExportPdfDisabled, .dxGridView_gvCMExportRtf, .dxGridView_gvCMExportRtfDisabled, .dxGridView_gvCMExportXls, .dxGridView_gvCMExportXlsDisabled, .dxGridView_gvCMExportXlsx, .dxGridView_gvCMExportXlsxDisabled, .dxGridView_gvCMFullCollapse, .dxGridView_gvCMFullCollapseDisabled, .dxGridView_gvCMFullExpand, .dxGridView_gvCMFullExpandDisabled, .dxGridView_gvCMGroupByColumn, .dxGridView_gvCMGroupByColumnDisabled, .dxGridView_gvCMNewRow, .dxGridView_gvCMNewRowDisabled, .dxGridView_gvCMRefresh, .dxGridView_gvCMRefreshDisabled, .dxGridView_gvCMShowCustDialog, .dxGridView_gvCMShowCustDialogDisabled, .dxGridView_gvCMShowCustomizationWindow, .dxGridView_gvCMShowCustomizationWindowDisabled, .dxGridView_gvCMShowFilterEditor, .dxGridView_gvCMShowFilterEditorDisabled, .dxGridView_gvCMShowGroupPanel, .dxGridView_gvCMShowGroupPanelDisabled, .dxGridView_gvCMShowSearchPanel, .dxGridView_gvCMShowSearchPanelDisabled, .dxGridView_gvCMSortAscending, .dxGridView_gvCMSortAscendingDisabled, .dxGridView_gvCMSortDescending, .dxGridView_gvCMSortDescendingDisabled, .dxGridView_gvCMSummaryAverage, .dxGridView_gvCMSummaryAverageDisabled, .dxGridView_gvCMSummaryCount, .dxGridView_gvCMSummaryCountDisabled, .dxGridView_gvCMSummaryMax, .dxGridView_gvCMSummaryMaxDisabled, .dxGridView_gvCMSummaryMin, .dxGridView_gvCMSummaryMinDisabled, .dxGridView_gvCMSummarySum, .dxGridView_gvCMSummarySumDisabled, .dxGridView_gvCOApply, .dxGridView_gvCOApplyDisabled, .dxGridView_gvCOClearFilter, .dxGridView_gvCOClearFilterDisabled, .dxGridView_gvCOClose, .dxGridView_gvCOColumnDrag, .dxGridView_gvCOColumnDragDisabled, .dxGridView_gvCOColumnGroup, .dxGridView_gvCOColumnGroupDisabled, .dxGridView_gvCOColumnHide, .dxGridView_gvCOColumnHideDisabled, .dxGridView_gvCOColumnRemove, .dxGridView_gvCOColumnRemoveDisabled, .dxGridView_gvCOColumnShow, .dxGridView_gvCOColumnShowDisabled, .dxGridView_gvCOColumnSort, .dxGridView_gvCOColumnSortDisabled, .dxGridView_gvCOColumnSortDown, .dxGridView_gvCOColumnSortDownDisabled, .dxGridView_gvCOColumnSortUp, .dxGridView_gvCOColumnSortUpDisabled, .dxGridView_gvCOColumnUngroup, .dxGridView_gvCOColumnUngroupDisabled, .dxGridView_gvCOColumnUnsort, .dxGridView_gvCOColumnUnsortDisabled, .dxGridView_gvCODragAreaCollapse, .dxGridView_gvCODragAreaExpand, .dxGridView_gvCOFilterCollapse, .dxGridView_gvCOFilterExpand, .dxGridView_gvCollapsedButton, .dxGridView_gvCollapsedButtonRtl, .dxGridView_gvDetailCollapsedButton, .dxGridView_gvDetailCollapsedButtonRtl, .dxGridView_gvDetailExpandedButton, .dxGridView_gvDetailExpandedButtonRtl, .dxGridView_gvDragAndDropArrowDown, .dxGridView_gvDragAndDropArrowLeft, .dxGridView_gvDragAndDropArrowRight, .dxGridView_gvDragAndDropArrowUp, .dxGridView_gvDragAndDropHideColumn, .dxGridView_gvExpandedButton, .dxGridView_gvExpandedButtonRtl, .dxGridView_gvFilterRowButton, .dxGridView_gvFixedGroupRow, .dxGridView_gvGroupRowMoreRows, .dxGridView_gvHeaderFilter, .dxGridView_gvHeaderFilterActive, .dxGridView_gvHeaderSortDown, .dxGridView_gvHeaderSortUp, .dxGridView_gvHideAdaptiveDetailButton, .dxGridView_gvParentGroupRows, .dxGridView_gvShowAdaptiveDetailButton, .dxGridView_WindowResizer, .dxGridView_WindowResizerRtl, .dxgvFocusedRow .dxGridView_gvShowAdaptiveDetailButton {
    background-image: url(/DXR.axd?r=0_5780-jW78l) !important;
    background-repeat: no-repeat;
    background-color: transparent;
}

.dxGridView_gvHeaderFilter {
    background-image: url('../Images/filter.png') !important;
    background-position: 0 !important;
    width: 20px !important;
    height: 10px !important;
    margin-bottom: -2px !important;
}

.dxGridView_gvHeaderFilterActive {
    background-position: -65px -182px !important;
    width: 12px !important;
    height: 12px !important;
}


.dxGridView_gvHeaderFilterActive, .dxGridView_gvHeaderSortDown, .dxGridView_gvHeaderSortUp, .dxGridView_gvHideAdaptiveDetailButton, .dxGridView_gvParentGroupRows, .dxGridView_gvShowAdaptiveDetailButton, .dxGridView_WindowResizer, .dxGridView_WindowResizerRtl, .dxgvFocusedRow .dxGridView_gvShowAdaptiveDetailButton {
    background-image: url(/DXR.axd?r=0_5780-jW78l) !important;
    background-repeat: no-repeat;
    background-color: transparent;
}

.dxmLite .dxm-popup .dxm-checked, .dxmLite .dxm-popup .dxm-checked.dxm-hovered {
    background-color: #004f5b;
}

.dxWeb_pNext {
    background-position: -75px -347px !important;
    width: 14px !important;
    height: 14px !important;
}

.dxWeb_pNext, .dxWeb_pPrev {
    background-image: url(/DXR.axd?r=0_5879-jW78l) !important;
    background-repeat: no-repeat;
    background-color: transparent;
}

.dxWeb_pPrev {
    background-position: -240px -332px !important;
    width: 14px !important;
    height: 14px !important;
}

.ipsg-main-nav .ipsg-user .ipsg-user-select2 {
    float: left;
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 100%;
}


.dxEditors_edtDropDown {
    background-position: -394px -140px !important;
    width: 10px !important;
    height: 10px !important;
}

.dxcaRefreshButtonHover .dxEditors_caRefresh, .dxeButtonEditButtonHover .dxEditors_edtClear, .dxeButtonEditButtonHover .dxEditors_edtDropDown, .dxeButtonEditButtonHover .dxEditors_edtEllipsis, .dxeButtonEditButtonPressed .dxEditors_edtDropDown, .dxeButtonEditButtonPressed .dxEditors_edtEllipsis, .dxEditors_caRefresh, .dxEditors_edtBinaryImageDelete, .dxEditors_edtBinaryImageOpenDialog, .dxEditors_edtCalendarFastNavBackToPrevMode, .dxEditors_edtCalendarFastNavBackToPrevModeRtl, .dxEditors_edtCalendarFNNextPeriod, .dxEditors_edtCalendarFNNextYear, .dxEditors_edtCalendarFNPrevPeriod, .dxEditors_edtCalendarFNPrevYear, .dxEditors_edtCalendarNextMonth, .dxEditors_edtCalendarNextMonthDisabled, .dxEditors_edtCalendarNextYear, .dxEditors_edtCalendarNextYearDisabled, .dxEditors_edtCalendarPrevMonth, .dxEditors_edtCalendarPrevMonthDisabled, .dxEditors_edtCalendarPrevYear, .dxEditors_edtCalendarPrevYearDisabled, .dxEditors_edtClear, .dxEditors_edtDETSClockFace, .dxEditors_edtDETSHourHand, .dxEditors_edtDETSMinuteHand, .dxEditors_edtDETSSecondHand, .dxEditors_edtDropDown, .dxEditors_edtDropDownDisabled, .dxEditors_edtEllipsis, .dxEditors_edtEllipsisDisabled, .dxEditors_edtError, .dxEditors_edtListBoxFilterBtn, .dxEditors_edtListBoxFilterBtnDisabled, .dxEditors_edtListBoxHideFilterBtn, .dxEditors_edtListBoxHideFilterBtnDisabled, .dxEditors_edtListBoxHideFilterBtnRtl, .dxEditors_edtListBoxHideFilterBtnRtlDisabled, .dxEditors_edtRadioButtonChecked, .dxEditors_edtRadioButtonCheckedDisabled, .dxEditors_edtRadioButtonUnchecked, .dxEditors_edtRadioButtonUncheckedDisabled, .dxEditors_edtSpinEditDecrementImage, .dxEditors_edtSpinEditDecrementImageDisabled, .dxEditors_edtSpinEditIncrementImage, .dxEditors_edtSpinEditIncrementImageDisabled, .dxEditors_edtSpinEditLargeDecImage, .dxEditors_edtSpinEditLargeDecImageDisabled, .dxEditors_edtSpinEditLargeIncImage, .dxEditors_edtSpinEditLargeIncImageDisabled, .dxEditors_edtTBDecBtn, .dxEditors_edtTBIncBtn, .dxEditors_edtTokenBoxTokenRemoveButton, .dxEditors_edtTokenBoxTokenRemoveButton.dxeTokenRemoveButtonHover, .dxEditors_edtTokenBoxTokenRemoveButtonDisabled, .dxEditors_fcadd, .dxEditors_fcaddhot, .dxEditors_fcgroupaddcondition, .dxEditors_fcgroupaddgroup, .dxEditors_fcgroupand, .dxEditors_fcgroupnotand, .dxEditors_fcgroupnotor, .dxEditors_fcgroupor, .dxEditors_fcgroupremove, .dxEditors_fcopany, .dxEditors_fcopavg, .dxEditors_fcopbegin, .dxEditors_fcopbetween, .dxEditors_fcopblank, .dxEditors_fcopcontain, .dxEditors_fcopcount, .dxEditors_fcopend, .dxEditors_fcopequal, .dxEditors_fcopexists, .dxEditors_fcopgreater, .dxEditors_fcopgreaterorequal, .dxEditors_fcopless, .dxEditors_fcoplessorequal, .dxEditors_fcoplike, .dxEditors_fcopmax, .dxEditors_fcopmin, .dxEditors_fcopnotany, .dxEditors_fcopnotbetween, .dxEditors_fcopnotblank, .dxEditors_fcopnotcontain, .dxEditors_fcopnotequal, .dxEditors_fcopnotlike, .dxEditors_fcopsum, .dxEditors_fcoptypefield, .dxEditors_fcoptypefieldhot, .dxEditors_fcoptypevalue, .dxEditors_fcoptypevaluehot, .dxEditors_fcremove, .dxEditors_fcremovehot, .dxeSpinDecButtonHover .dxEditors_edtSpinEditDecrementImage, .dxeSpinDecButtonPressed .dxEditors_edtSpinEditDecrementImage, .dxeSpinIncButtonHover .dxEditors_edtSpinEditIncrementImage, .dxeSpinIncButtonPressed .dxEditors_edtSpinEditIncrementImage, .dxeSpinLargeDecButtonHover .dxEditors_edtSpinEditLargeDecImage, .dxeSpinLargeDecButtonPressed .dxEditors_edtSpinEditLargeDecImage, .dxeSpinLargeIncButtonHover .dxEditors_edtSpinEditLargeIncImage, .dxeSpinLargeIncButtonPressed .dxEditors_edtSpinEditLargeIncImage, .dxeTBDecBtnHover.dxEditors_edtTBDecBtn, .dxeTBDecBtnPressed.dxEditors_edtTBDecBtn, .dxeTBIncBtnHover.dxEditors_edtTBIncBtn, .dxeTBIncBtnPressed.dxEditors_edtTBIncBtn, .dxeTrackBar.dxeDisabled .dxEditors_edtTBDecBtn, .dxeTrackBar.dxeDisabled .dxEditors_edtTBIncBtn, .dxgvFocusedRow .dxEditors_edtRadioButtonChecked {
    background-image: url(/DXR.axd?r=0_5772-jW78l) !important;
    background-repeat: no-repeat;
    background-color: transparent;
}

.dxeButtonEditButton {
    padding: 0.4em !important;
    background: white !important;
}

.dxeButtonEditButton, .dxeCalendarButton, .dxeSpinIncButton, .dxeSpinDecButton, .dxeSpinLargeIncButton, .dxeSpinLargeDecButton, .dxeColorEditButton {
    border: none !important;
}

.dxeListBox {
    background-color: white;
    width: 70px;
    height: 109px;
    font: 14px 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
    color: #666;
    border: 1px solid rgba(0,0,0,0.22);
}

textarea {
    cursor: auto;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: #aaa;    
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #aaa;
    -webkit-box-shadow: inset -1px -1px 0 rgba(0,0,0,.05), inset 1px 1px 0 rgba(0,0,0,.05);  
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 10px;
    background-color: #fff;    
}

.pr_25 {
    padding-right: 25px;
}

.dxEditors_edtListBoxFilterBtnDisabled {
    background-position: -80px -423px !important;
    width: 18px !important;
    height: 18px !important;
}

.dxeButtonEditButtonHover .dxEditors_edtClear,
.dxEditors_caRefresh,
.dxEditors_edtBinaryImageDelete,
.dxEditors_edtBinaryImageOpenDialog,
.dxEditors_edtCalendarFastNavBackToPrevMode,
.dxEditors_edtCalendarFastNavBackToPrevModeRtl,
.dxEditors_edtCalendarFNNextPeriod,
.dxEditors_edtCalendarFNNextYear,
.dxEditors_edtCalendarFNPrevPeriod,
.dxEditors_edtCalendarFNPrevYear,
.dxEditors_edtCalendarNextMonth,
.dxEditors_edtCalendarNextMonthDisabled,
.dxEditors_edtCalendarNextYear,
.dxEditors_edtCalendarNextYearDisabled,
.dxEditors_edtCalendarPrevMonth,
.dxEditors_edtCalendarPrevMonthDisabled,
.dxEditors_edtCalendarPrevYear,
.dxEditors_edtCalendarPrevYearDisabled,
.dxEditors_edtClear,
.dxEditors_edtDETSClockFace,
.dxEditors_edtDETSHourHand,
.dxEditors_edtDETSMinuteHand,
.dxEditors_edtDETSSecondHand,
.dxEditors_edtDropDown,
.dxEditors_edtDropDownDisabled,
.dxEditors_edtEllipsis,
.dxEditors_edtEllipsisDisabled,
.dxEditors_edtError,
.dxEditors_edtListBoxFilterBtn,
.dxEditors_edtListBoxFilterBtnDisabled,
.dxEditors_edtListBoxHideFilterBtn,
.dxEditors_edtListBoxHideFilterBtnDisabled,
.dxEditors_edtListBoxHideFilterBtnRtl,
.dxEditors_edtListBoxHideFilterBtnRtlDisabled,
.dxEditors_edtRadioButtonChecked,
.dxEditors_edtRadioButtonCheckedDisabled,
.dxEditors_edtRadioButtonUnchecked,
.dxEditors_edtRadioButtonUncheckedDisabled,
.dxEditors_edtSpinEditDecrementImage,
.dxEditors_edtSpinEditDecrementImageDisabled,
.dxEditors_edtSpinEditIncrementImage,
.dxEditors_edtSpinEditIncrementImageDisabled,
.dxEditors_edtSpinEditLargeDecImage,
.dxEditors_edtSpinEditLargeDecImageDisabled,
.dxEditors_edtSpinEditLargeIncImage,
.dxEditors_edtSpinEditLargeIncImageDisabled,
.dxEditors_edtTBDecBtn,
.dxEditors_edtTBDecBtnDisabled,
.dxEditors_edtTBDecBtnHover,
.dxEditors_edtTBDecBtnPressed,
.dxEditors_edtTBIncBtn,
.dxEditors_edtTBIncBtnDisabled,
.dxEditors_edtTBIncBtnHover,
.dxEditors_edtTBIncBtnPressed,
.dxEditors_edtTokenBoxTokenRemoveButton,
.dxEditors_edtTokenBoxTokenRemoveButtonDisabled,
.dxEditors_fcadd,
.dxEditors_fcaddhot,
.dxEditors_fcgroupaddcondition,
.dxEditors_fcgroupaddgroup,
.dxEditors_fcgroupand,
.dxEditors_fcgroupnotand,
.dxEditors_fcgroupnotor,
.dxEditors_fcgroupor,
.dxEditors_fcgroupremove,
.dxEditors_fcopany,
.dxEditors_fcopavg,
.dxEditors_fcopbegin,
.dxEditors_fcopbetween,
.dxEditors_fcopblank,
.dxEditors_fcopcontain,
.dxEditors_fcopcount,
.dxEditors_fcopend,
.dxEditors_fcopequal,
.dxEditors_fcopexists,
.dxEditors_fcopgreater,
.dxEditors_fcopgreaterorequal,
.dxEditors_fcopless,
.dxEditors_fcoplessorequal,
.dxEditors_fcoplike,
.dxEditors_fcopmax,
.dxEditors_fcopmin,
.dxEditors_fcopnotany,
.dxEditors_fcopnotbetween,
.dxEditors_fcopnotblank,
.dxEditors_fcopnotcontain,
.dxEditors_fcopnotequal,
.dxEditors_fcopnotlike,
.dxEditors_fcopsingle,
.dxEditors_fcopsum,
.dxEditors_fcoptypefield,
.dxEditors_fcoptypefieldhot,
.dxEditors_fcoptypevalue,
.dxEditors_fcoptypevaluehot,
.dxEditors_fcremove,
.dxEditors_fcremovehot,
.dxeFocused .dxeTBHSys .dxeFocusedMDHSys .dxEditors_edtTBMainDH,
.dxeFocused .dxeTBHSys .dxeFocusedMDHSys .dxEditors_edtTBMainDHHover,
.dxeFocused .dxeTBHSys .dxeFocusedMDHSys .dxEditors_edtTBMainDHPressed,
.dxeFocused .dxeTBHSys .dxeFocusedSDHSys .dxEditors_edtTBSecondaryDH,
.dxeFocused .dxeTBHSys .dxeFocusedSDHSys .dxEditors_edtTBSecondaryDHHover,
.dxeFocused .dxeTBHSys .dxeFocusedSDHSys .dxEditors_edtTBSecondaryDHPressed,
.dxeFocused .dxeTBVSys .dxeFocusedMDHSys .dxEditors_edtTBMainDH,
.dxeFocused .dxeTBVSys .dxeFocusedMDHSys .dxEditors_edtTBMainDHHover,
.dxeFocused .dxeTBVSys .dxeFocusedMDHSys .dxEditors_edtTBMainDHPressed,
.dxeFocused .dxeTBVSys .dxeFocusedSDHSys .dxEditors_edtTBSecondaryDH,
.dxeFocused .dxeTBVSys .dxeFocusedSDHSys .dxEditors_edtTBSecondaryDHHover,
.dxeFocused .dxeTBVSys .dxeFocusedSDHSys .dxEditors_edtTBSecondaryDHPressed,
.dxeTBHSys .dxEditors_edtTBMainDH,
.dxeTBHSys .dxEditors_edtTBMainDHDisabled,
.dxeTBHSys .dxEditors_edtTBMainDHHover,
.dxeTBHSys .dxEditors_edtTBMainDHPressed,
.dxeTBHSys .dxEditors_edtTBSecondaryDH,
.dxeTBHSys .dxEditors_edtTBSecondaryDHDisabled,
.dxeTBHSys .dxEditors_edtTBSecondaryDHHover,
.dxeTBHSys .dxEditors_edtTBSecondaryDHPressed,
.dxeTBVSys .dxEditors_edtTBMainDH,
.dxeTBVSys .dxEditors_edtTBMainDHDisabled,
.dxeTBVSys .dxEditors_edtTBMainDHHover,
.dxeTBVSys .dxEditors_edtTBMainDHPressed,
.dxeTBVSys .dxEditors_edtTBSecondaryDH,
.dxeTBVSys .dxEditors_edtTBSecondaryDHDisabled,
.dxeTBVSys .dxEditors_edtTBSecondaryDHHover,
.dxeTBVSys .dxEditors_edtTBSecondaryDHPressed {
    background-image: url(/DXR.axd?r=0_5772-jW78l) !important;
    background-repeat: no-repeat;
    background-color: transparent;
}

.dxeListBoxItemSelected {
    background-color: transparent !important;
    color: #000 !important;
    font-weight: bold !important;
}

.pr_27 {
    padding-right: 27px;
}

.width-100-px {
    width: 100px;
}

.display-none {
    display: none;
}

.background-col-lightgrey {
    background: #D3D3D3 0% 0% no-repeat padding-box;
}

.button_search_layout {
    margin-top: 16px;
    padding: 7px 25px;
}

.mt-18 {
    margin-top: 18rem !important;
}

.mt-16 {
    margin-top: 16rem !important;
}

.mt-3-rem {
    margin-top: 3rem !important;
}

.ui-datepicker td.ui-state-disabled > span {
    background: lightgray !important;
    color: gray !important;
}

.ui-datepicker td.ui-state-disabled {
    opacity: 100 !important;
}

select option:last-child {
    border-bottom: 1px solid black;
}

.f-14 {
    font-size: 14px;
}

/*colored checkboxes*/
/*red colored checkbox*/
/* The container */
.container_red {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: -25px;
}

    /* Hide the browser's default checkbox */
    .container_red input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark_red {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #ff2222;
    border-radius: 5px;
}

/* On mouse-over, add a grey background color */
.container_red:hover input ~ .checkmark_red {
    background-color: gray;
}

/* When the checkbox is checked, add a red background */
.container_red input:checked ~ .checkmark_red {
    background-color: #ff2222;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_red:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container_red input:checked ~ .checkmark_red:after {
    display: block;
}

/* Style the checkmark/indicator */
.container_red .checkmark_red:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*orange colored checkbox*/
/* The container */
.container_orange {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: -25px;
}

    /* Hide the browser's default checkbox */
    .container_orange input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark_orange {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #ff8110;
    border-radius: 5px;
}

/* On mouse-over, add a grey background color */
.container_orange:hover input ~ .checkmark_orange {
    background-color: gray;
}

/* When the checkbox is checked, add a orange background */
.container_orange input:checked ~ .checkmark_orange {
    background-color: #ff8110;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_orange:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container_orange input:checked ~ .checkmark_orange:after {
    display: block;
}

/* Style the checkmark/indicator */
.container_orange .checkmark_orange:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*yellow colored checkbox*/
/* The container */
.container_yellow {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: -25px;
}

    /* Hide the browser's default checkbox */
    .container_yellow input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark_yellow {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #ffef22;
    border-radius: 5px;
}

/* On mouse-over, add a grey background color */
.container_yellow:hover input ~ .checkmark_yellow {
    background-color: gray;
}

/* When the checkbox is checked, add a yellow background */
.container_yellow input:checked ~ .checkmark_yellow {
    background-color: #ffef22;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_yellow:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container_yellow input:checked ~ .checkmark_yellow:after {
    display: block;
}

/* Style the checkmark/indicator */
.container_yellow .checkmark_yellow:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*green colored checkbox*/
/* The container */
.container_green {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: -25px;
}

    /* Hide the browser's default checkbox */
    .container_green input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark_green {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #9bcc52;
    border-radius: 5px;    
}

/* On mouse-over, add a grey background color */
.container_green:hover input ~ .checkmark_green {
    background-color: gray;
}

/* When the checkbox is checked, add a green background */
.container_green input:checked ~ .checkmark_green {
    background-color: #9bcc52;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_green:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container_green input:checked ~ .checkmark_green:after {
    display: block;
}

/* Style the checkmark/indicator */
.container_green .checkmark_green:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*blue colored checkbox*/
/* The container */
.container_blue {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: -25px;
}

    /* Hide the browser's default checkbox */
    .container_blue input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark_blue {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #00e1ff;
    border-radius: 5px;
}

/* On mouse-over, add a grey background color */
.container_blue:hover input ~ .checkmark_blue {
    background-color: gray;
}

/* When the checkbox is checked, add a blue background */
.container_blue input:checked ~ .checkmark_blue {
    background-color: #00e1ff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_blue:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container_blue input:checked ~ .checkmark_blue:after {
    display: block;
}

/* Style the checkmark/indicator */
.container_blue .checkmark_blue:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*grey colored checkbox*/
/* The container */
.container_gray {
    display: block;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: -25px;
}

    /* Hide the browser's default checkbox */
    .container_gray input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

/* Create a custom checkbox */
.checkmark_gray {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: grey;
    border-radius: 5px;
}

/* On mouse-over, add a grey background color */
.container_gray:hover input ~ .checkmark_gray {
    background-color: grey;
}

/* When the checkbox is checked, add a gray background */
.container_gray input:checked ~ .checkmark_gray {
    background-color: grey;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_gray:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container_gray input:checked ~ .checkmark_gray:after {
    display: block;
}

/* Style the checkmark/indicator */
.container_gray .checkmark_gray:after {
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/*show scrollbar in all grid */
@media (max-width: 1200px) {
    table #TemplateGrid_DXMainTable {
        overflow: auto !important;
        width: 1630px !important;
        max-width: 1000px;
    }   

    table #ReportCodeGrid_DXMainTable {
        overflow: auto !important;
        width: 1620px !important;
        max-width: 1000px;
    }

    table #ReportEventGrid_DXMainTable {
        overflow: auto !important;
        width: 1620px !important;
        max-width: 1000px;
    }

    table #ManageCouponDetails_DXMainTable {
        overflow: auto !important;
        width: 1630px !important;
        max-width: 1000px;
    }  

    .meter_panel_wh {
        width: 275px !important;
    }

    .meter_div_wh {
        width: 275px !important;
    }    
}

.padding-25-px {
    padding: 2%;
}

.headerTitle {
    display: none;
}

/*for 25% zoom*/
@media (min-width:4103px) and (max-width:5464px) {
    .sidePanelDescription {
        font-size: 20px !important;
        margin: auto !important;
        text-align: center !important;
    }

    .ModifyActivation {
        margin: auto !important;
        width: 9em !important;
    }

    .spanTitleHeader {
        float: left !important;
    }

    .mt-5 {
        margin-top: 1em !important;
    }

    .spanGeneration, #spanCoupons {
        font-size: 12px !important;
        line-height: 12px !important;
    }

    #generationDescription, #qtyDescription {
        font-size: 18px !important;
    }

    .margin-left-neg-4-ps {
        margin-left: -1%;
    }
}

/*for 33% zoom*/
@media (min-width:2733px) and (max-width:4102px) {

    .margin-left-neg-4-ps {
        margin-left: -1.5%;
    }

    .sidePanelDescription {
        font-size: 20px !important;
        margin: auto !important;
        text-align: center !important;
    }

    .ModifyActivation {
        width: 9em !important;
    }

    .spanTitleHeader {
        float: left !important;
    }

    .mt-5 {
        margin-top: 1em !important;
    }

    .spanGeneration, #spanCoupons {
        font-size: 12px !important;
        line-height: 12px !important;
    }

    #generationDescription, #qtyDescription {
        font-size: 18px !important;
    }

}

/*for 50% zoom*/
@media (min-width:2052px) and (max-width:2732px) {
    .margin-left-neg-4-ps {
        margin-left: -2.7%;
    }

}

.fa-fw {
    width: 1.28571429em;
    text-align: center;
}

.fa-info-circle {
    position: relative;
    font-size: 14px;
}

.fa-info-circle {
    outline: 0px;
}

.infoIcon {
    margin-left: 0px;
    cursor: pointer;
    position: absolute;
    margin-top: 0px;
}

.couponSettingDisplay {
    display: none;
}

.groupcoupondisplay {
    display: block;
}

.groupCouponColorWhite {
    color: white;
}

.manageGroupAddDisplay {
    display: none;
}

.manageGroupEditDisplay {
    display: none;
}

.psStep1Display {
    display: none;
}

.psStep4Display {
    display: none;
}

.psStep4GridMapShowDisplay {
    display: none;
}

.psStep4Position {
    /*position: relative;*/
}

.reportBarChart {
    display: none;
}

.reportDiscountMapReport {
    display: none;
}

.reportDiscountGridReport {
    display: none;
}


.customerListStyleOne {
    padding-left: 0px !important;
    color: grey;
    background-color: none !important
}

.customerListStyleTwo {
    padding-left: 25px !important;
}

.customerListStyleThree {
    padding-left: 25px !important;
}

.imgLineHeight {
    line-height: 1;
}

.dxgvControl_Office365 .dxgvCSD {
    /*margin-bottom: -8px !important;*/
}

/*bootstap missing classes*/

.mb-1 {
    margin-bottom: .5rem !important;
}

.mb-2 {
    margin-bottom: .5rem !important;
}

.mb-3 {
    margin-bottom: 1.5rem !important;
}

.mb-4 {
    margin-bottom: 2rem !important;
}

.ml-1 {
    margin-left: .5rem !important;
}

.mr-2 {
    margin-right: .5rem !important;
}

.mt-3 {
    margin-top: 1.5rem !important;
}

.mt-4 {
    margin-top: 2rem !important;
}

.pb-1 {
    padding-bottom: .5rem !important;
}

.pb-2 {
    padding-bottom: 1rem !important;
}

.pb-3 {
    padding-bottom: 1.5rem !important;
}

.pb-4 {
    padding-bottom: 2rem !important;
}

.ui-widget-header {
    border: none !important;
}

.margin-top-3-managegroup {
    margin-top: 3px
}

.margin-top-10-managegroup {
    margin-top: 10px
}

.margin-top-15-managegroup {
    margin-top: 15px
}

.mt-5-manual {
    margin-top: 3rem !important;
}

.mt-2-manual {
    margin-top: .5rem !important;
}

.mt-1-manual {
    margin-top: .25rem !important;
}

.mb-5-manual {
    margin-bottom: 3rem !important;
}

.mb-5 {
    margin-bottom: 3rem !important;
}

.mb-1-manual {
    margin-bottom: .25rem !important;
}

.mb-2-manual {
    margin-bottom: .5rem !important;
}

.mb-3-manual {
    margin-bottom: 1rem !important;
}

.ml-3-manual {
    margin-left: 1rem !important;
}

.ml-md-2-manual {
    margin-left: .5rem !important;
}


.ml-xl-4-manual {
    margin-left: 1.5rem !important;
}

.mr-1-manual {
    margin-right: .25rem !important;
}

.pt-2-manual {
    padding-top: .5rem !important;
}

.top-21-managegroup {
    top: 21px;
}

.text-white {
    color: white !important;
}

/*card manual classess*/
.card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
}

.card-deck {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin-right: -15px;
    margin-left: -15px;
}

    .card-deck .card {
        -ms-flex: 1 0 0%;
        flex: 1 0 0%;
        margin-right: 15px;
        margin-bottom: 0;
        margin-left: 15px;
    }

/*popup css*/
.modal-header .close {
    margin: -1rem -1rem -1rem auto;
}

.modal-content {
    position: relative;
    display: -ms-flexbox;
    display: block;
    -ms-flex-direction: column;
    flex-direction: column;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: .3rem;
    outline: 0;
    margin-left: auto !important;
    margin-right: auto !important;
}


/*profile setup manual css*/
.circle-left {
    left: 19px;
}

.box-shadow-none {
    box-shadow: none !important;
}

.box-shadow-show {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12) !important;
}

.checkmark-top {
    top: -6px !important;
}

.checkmark-top-5-neg {
    top: -5px !important;
}


.w-100 {
    width: 100% !important;
}

.nav-link {
    display: block;
    padding: 8px 1rem;
}

.nav {
    display: flex !important;
}

.ml-minus-10 {
    margin-left: -10px;
}

/*button manual css*/
.btn-secondary {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
    border-radius: .25rem !important;
}

.margin-left-26-neg-red {
    margin-left: -26px;
}

.margin-left-9-neg-yellow {
    margin-left: -9px;
}

.margin-left-7-neg-green {
    margin-left: -7px;
}

.margin-left-6-neg-blue {
    margin-left: -6px;
}

.margin-left-16-neg-gray {
    margin-left: -16px;
}

.ml-3 {
    margin-left: 1rem !important;
}

.mt-2 {
    margin-top: .5rem !important;
}

.popover {
    font-size: 14px;
    width: 200px;
    font-weight: 400 !important;
}


.pt-1 {
    padding-top: .5rem !important;
}

.mt-16px {
    margin-top: 16px !important;
}

.mt-minus-7 {
    margin-top: -7px;
}

.mt-22px {
    margin-top: 22px;
}

.mt-7px {
    margin-top: 7px;
}

.height_auto {
    height: auto !important;
}

.dxpLite_Office365 {
    margin-top: 10px !important;
}

.startendtimemodal {
    height: 480px;
    width:700px;
}

.popupheaderleft {
    margin-left: 0px !important;
}

.labelpopupmarginbottom {
    margin-bottom: 0 !important;
}

.mt-10px {
    margin-top: 10px;
}

.dxGridView_gvFilterRowButton_Office365 {
    margin-right: 2px;
}

.ml-minus-8px {
    margin-left: -8px;
}

.ml-9px{
    margin-left:9px;
}

.datepicker-header{
    font-size:18px;
}

.mb-2rem {
    margin-bottom: 2rem;
}

/*1/5/2021*/
.ipsg-main-content .ipsg-body {
    padding: 7px 15px !important;
    box-shadow: -1px -2px 15px 0px #bbb inset;
}

.main__body_row {
    padding: 5px 20px 25px 20px !important;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
}

.main__body_head {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
    text-transform:uppercase;
}

.bg-white-reports {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
}

.input-group-addon {
    border-radius: 0px !important;
}

.dxgvControl_Office365 .dxgvCSD {
    min-width: 100% !important;
}

.margin-left-33 {
    margin-left: 33px;
}
}
.f-18{
    font-size:18px;
}
.width-84-px{
    width:84px;
}
.width-90-px {
    width: 90px;
}
.height-50px{
    height:50px;
}
/*change ui css for menu tab*/
.ipsg-tabs-group.ui-tabs .ipsg-tabs.ui-tabs-nav {
    padding: 0 !important;
}
.ipsg-tabs-group.ui-widget.ui-widget-content {
    border: none !important;
}
.ipsg-tabs-group.ui-tabs .ipsg-tabs.ui-tabs-nav li.ui-tabs-active {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.ipsg-tabs-group.ui-tabs .ipsg-nav.ui-tabs-panel {
    padding: 0 !important;
}
.ipsg-tabs-group.ui-tabs {
    padding: 0 !important;
}
    .ipsg-tabs-group.ui-tabs .ipsg-tabs.ui-tabs-nav .ui-tabs-anchor {
        padding: 0  !important;
        text-decoration: none;
    }
}

#FullScreen {
    top:0px !important;
}

.btn-secondary {
    border-radius: 0px !important;
    text-transform: uppercase;
}

.width-auto {
    width: auto !important;
}

.navigationfont {
    font-size: 30px;
    font-weight: bold;
    color: #00A5B5;
}

.tipfont {
    font-size: 30px;
    font-weight: bold;
}
.html2canvas-container {
    width: 3000px !important;
    height: 3000px !important;
}
/*css for modal center on screen*/
.modal {
    text-align: center !important;
}

@media screen and (min-width: 768px) {
    .modal:before {
        display: inline-block !important;
        vertical-align: middle !important;
        content: " " !important;
        height: 100% !important;
    }

}
/*# Tablet*/
@media only screen and (min-width:321px) and (max-width:768px) {
    .modal:before {
        display: inline-block !important;
        vertical-align: middle !important;
        content: " " !important;
        height: 100% !important;
    }
    .modal-body .text-align-right {
        text-align: right !important;
    }
    .paddinglabelmanagegroup {
        padding-right: 0rem !important;
    }
    .startendtimemodal {
        height: 500px !important;
        width: 600px !important;
    }

    #ui-datepicker-div {
        width: 260px !important;
        margin-left: -46px !important;
    }
    .starttimemodal {
        width: 550px !important;
    }

    .endtimemodal {
        width: 550px !important;
        height:500px !important;
    }
    .cs_content{
        padding:0px !important;
    }
    .font-size-30px {
        font-size: 19px !important;
        line-height: 25px !important;
    }
    .coming_soon {
        padding-left: 0px !important;
    }
}
@media only screen and (max-width:320px) {
    .starttimemodal {
        width: 300px !important;
    }
    .endtimemodal {
        width: 300px !important;
    }
}
.modal-dialog {
    display: inline-block !important;
    text-align: left !important;
    vertical-align: middle !important;
    margin: 10px;
    width: auto;
    min-width: 300px;
    max-width: 600px;
}
.cssheight {
    width: auto;
    height: 199px;
}
.MemberIcon{
    opacity:0.6;
    width:235px;
}

.search_layout_s4 {
    background: #454546 0% 0% no-repeat padding-box;
    color: white !important;
    border: none;
}

.toggle-button1-design-step4 {   
    border: none;
    border-bottom-left-radius: 17px;
    border-top-left-radius: 17px;
}

.toggle-button2-design-step4 {
    border-bottom-right-radius: 17px;
    border-top-right-radius: 17px;
    border: none;
}

.hide-toggle-button-step4 {    
    background-color: white !important;
    border: none;
    opacity: 1;
    color: black !important;   
}

.div-togglegroup-step4 {   
    border: none;    
    border-radius: 20px;    
}



.width-44-height-41-toggle-step4 {    
    padding: 10px 15px;   
}

.input-group-step4 {
    width: 100% !important;
}

.datacount_layout {
    color: white;
    background: #00A5B5 0% 0% no-repeat padding-box !important;
    border-radius: 20px;
    padding: 6px 10px;
}

.color-white-s4-fullscreenimage {
    color: white;
}

.padding-0-s4pannel {
    padding: 0px;
}

.padding-5-step4-bottompanel {
    padding-top: 5px;
}
.margin-top-step4-rw1 {
    margin-top: 2px;
}

.ipsg-widget_button.btn-primary {
    border: 1px solid rgba(255,255,255,0.6) !important;
}
/*about cs page css*/
.font-weight-bold{
    font-weight:bold;
}
.cs_content {
    font-size: 16px;
    padding: 5px 300px 20px 300px;
}
.div_What_cs {
    margin: -15px !important;
    padding: 15px;
    background: linear-gradient(180deg, #D8E5E6 0%, #FFFFFF 100%);
    box-shadow: inset 2px 1px 9px rgba(0, 0, 0, 0.1);
}
.p-24px{
    padding:24px;
}
.font-size-18px{
    font-size:18px;
}
.font-size-28px {
    font-size:28px;
    font-weight:bold;
    padding-top:100px;

}
.p_dynamic_text {
    padding-left: 8%;
    padding-right: 10%;
    padding-top: 5%;
    padding-bottom: 5%;
}
.div_cs_work {
    margin: -15px !important;
    padding: 15px;
    background: linear-gradient(180deg, #D8E5E6 0%, #FFFFFF 100%);
    box-shadow: inset 2px 1px 9px rgba(0, 0, 0, 0.1);
}
.gray_color {
    color: #555;
}
.darkgreen_color {
    color: #003D43;
    font-weight:700;
}

.width-100_per {
    width: 100%;
}
.mb-20px{
    margin-bottom:20px;
}
.font-size-30px {
    font-size: 30px;
    line-height:45px;
}
.panel {
    border: unset !important;
    border-right: none !important;
    background-color: unset !important;
    border-radius: 0px !important;
    box-shadow: unset !important;
}
.panel-body{
    border:unset !important;
}
.panel-default > .panel-heading {
    background-color: unset !important;
    border-top: 1px solid #626264 !important;
    cursor: pointer;
}
.panel-heading {
    padding:15px !important;
}
.pannel-text {
    line-height: 18px;
    font-size: 16px;
}
.border-bottom {
    border-bottom: 1px solid #626264 !important;
}
.panel-body {
    border-top: 1px solid #626264 !important;
}
.panel-heading-active {
    color: #00A5B5 !important;
}
.panel-title {
    position: relative;
}

.panel-title::after {
    content: "\f0dd";
    color: #333;
    top: -2px;
    right: 0px;
    position: absolute;
    font-family: "FontAwesome"
}

    .panel-title[aria-expanded="true"]::after {
        content: "\f0de";
        color: #00A5B5 !important;
    }

/*
 * Added 12-27-20 to showcase full title clickthrough
 */

.panel-heading-full.panel-heading {
    padding: 0;
   
}

.panel-heading-full .panel-title {
    padding: 10px 15px;
}

    .panel-heading-full .panel-title::after {
        top: 10px;
        right: 15px;
    }
.coming_soon {
    font-size: 46px;
    font-weight: bold;
}
.line-height-18px{
    line-height:18px;
}
.line-height-27px {
    line-height: 27px;
}
.font-size-14px{
    font-size:14px;
}

.btnDisabledCoupon {
    background-color:gray !important;
}
.btnUnabledCoupon {
    background-color: #003D43 !important;
}

.field-validation-error span, .red {
    line-height: 2;
    color: red !important;  
}

.allselectborder {
    border: 2px solid #00A5B5 !important;
}

.allselectml {
    margin-left: -15px;
    margin-top: -4px;
}

.step4listbmr {
    margin-right: -16px;
}

.line-height-phone {
    line-height: 1 !important;
}

#rdDiscountDurationError {
    line-height: 1;
}

.submit-support-ticket-btn {
    background-color: #004f5b;
    border: none;
    text-transform: uppercase;
    display: inline;
    padding: 8px;
    height: 40px;
    width: auto;
    -ms-flex-align: center;
    align-items: center;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    color: #fff;
    flex: 0 0 auto;
    font: 12px "NunitoSansRegular","Helvetica Neue","Helvetica",Arial,sans-serif;
    -ms-flex-pack: center;
    justify-content: center;
    transition: background-color 500ms cubic-bezier(.075,.82,.165,1);
}

    .submit-support-ticket-btn:hover {
        color: white !important;
    }

.main__body_row_error {
    padding: 20px 20px 20px 20px !important;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #CECECE;
}

.inline-flex-error {
    display: inline-flex;
}

.ui-draggable-dragging {
    border: none !important;
}

.ui-datepicker th {
    padding: 4px 3px !important;
}
.ui-state-default, .ui-widget-content .ui-state-default {
    padding: 8px 9px !important;
}
.ui-datepicker td span {
    text-align: center !important;
}
.form-control[disabled], fieldset[disabled] {
    background-color: #eee !important;
}

.float-left {
    float: left;
}
.group_name_span {
    font-size: 18px;
    margin: 10px 0 0 7px;
    line-height: 1.1;
    display: inline-block;
    color: #00535B;
}
.text-ellipsis-300px {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px;
}

.red-tooltip + .tooltip > .tooltip-inner {
    background-color: #FF0000;
}
.pole-update-tooltip + .tooltip {
    font-size: 15px;
    top: -45px !important;
}
.pole-update-tooltip + .tooltip > .tooltip-arrow {
    border-top-color: #FF0000 !important;
}
.pole-update-tooltip + .tooltip > .tooltip-inner {
    background-color: #FF0000;
    min-width: 250px;
}
.state-unselected {
    background-color: #4a4a4a !important;
}

.form-fieldset {
    margin: 0;
    border: 2px solid silver;
    border-radius: 3px;
}
.form-fieldset legend {
    width: auto;
    font-size: 12px;
    color: #4D4D4DDE;
    font-weight: 600;
    margin-bottom:0;
}

.QC_UsageLimit label {
    margin-bottom: 0px !important;
    float: left;
    line-height: 33px;
    margin-right: 5px;
}
.QC_UsageLimit .txtUsageLimit {
    width: 20%;
    color: #004F5B;
    float:left;
}
.QC_UsageLimit .infoIcon {
    line-height: 35px;
}

/*For Amount Dollar Sign*/
.prefix-dollar-symbol {
    position: relative;
}
.prefix-dollar-symbol input {
    padding-left: 20px;
}
.prefix-dollar-symbol:before {
    position: absolute;
    left: 180px;
    top: 2px;
    content: '$';
    line-height: 30px;
    font-size: 15px;
    font-weight: 600;
    color: #004F5B;
}
/*For Amount Dollar Sign*/

.time-label{
    width:100%;
    line-height:20px !important;
}

.time-colon-sign {
    position: relative;
    margin-top: 20px;
    line-height: 30px;
    font-size: 18px;
    font-weight: bold;
    float: left;
    text-align: center;
}

.error-span {
    color: red;
}
.margin-top-20{
    margin-top: 20px;
}

#MultiProfileDropdown + div .dropdown-item {
    width: 360px !important;
}

.small-toggle {
    padding: 2px 2px;
    border-radius: 20px;
}

.fieldset-shadow {
    box-shadow: 0px 3px 6px #00000029;
    border: 1px solid #DDDDDD;
}

.margin-top-30 {
    margin-top: 30px;
}

.ui-timepicker-div.ui-timepicker-oneLine {
     padding-right: 0 !important; 
}

.ui-timepicker-div .ui-widget-header {
    background: #004F5B 0% 0% no-repeat padding-box;
    padding: 10px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}

.ui-timepicker-div.ui-timepicker-oneLine dl{
    padding-right:8px;
}

.ui-datepicker{
    margin-top:0px !important;
}

.ui-datepicker .ui-datepicker-buttonpane button {
    border: 1px solid rgba(255,255,255,0.6) !important;
    box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 10px 0 rgb(0 0 0 / 12%);
    background-color: #004f5b !important;
    color: #ffffff !important;
    font: 12px "NunitoSansRegular","Helvetica Neue","Helvetica",Arial,sans-serif !important;
    opacity: 1 !important;
}

.ui-datepicker .ui_tpicker_hour_label,
.ui-datepicker .ui_tpicker_minute_label {
    margin-top: 8px;
}

.ui-datepicker .ui-timepicker-div .ui-timepicker-select {
    font-size: 12px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12) !important;
    border-radius: 0 !important;
    background-color: #fff;
    border: 1px solid #ccc;
}

.ui-datepicker .ui-timepicker-div .ui-timepicker-select:focus{
    outline:none !important
}

/* Toggle Button Start */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 28px;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .2s;
    transition: .2s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 24px;
    left: 5px;
    bottom: 5px;
    background-color: white;
    -webkit-transition: ease .2s;
    transition: ease .2s;
}

input:checked ~ .slider {
    background-color: #00A5B5;
}

input:focus ~ .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked ~ .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 20px;
}

input:checked ~ .slider .off,
input ~ .slider .on {
    display: none;
}

input:checked ~ .slider .on,
input ~ .slider .off {
    display: block;
}

.slider .on {
    position: absolute;
    top: 8px;
    left: 7px;
    color: #fff;
    font-size: 11px;
}

.slider .off {
    position: absolute;
    top: 8px;
    right: 5px;
    color: #fff;
    font-size: 11px;
}

#errorNextOccurreDateTime span {
    line-height: 15px !important;
}
/* Toggle Button End*/

/* Checkbox Start*/
.styled-checkbox input {
    -webkit-appearance: none;
    appearance: none;
    background-color: #eee;
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 24px;
    height: 24px;
    border: 1px solid lightgray;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
    font-size: 2rem;
    cursor: pointer;
    border-radius: 2px;
}

.styled-checkbox input:checked {
    background-color: #fff;
}

.styled-checkbox input:checked::before {
    transform: scale(1);
}

.styled-checkbox.disabled input:checked::before {
    background-color: grey;
}

.styled-checkbox input::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    transform: scale(0);
    transform-origin: center;
    transition: 80ms transform ease-in-out;
    box-shadow: inset 1em 1em var(--form-control-color);
    background-color: #004F5B;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.styled-checkbox input:focus {
    outline: none !important;
}

.styled-checkbox .before-label {
    margin-top: 3px;
    display: inline-block;
    margin-right: 15px;
}
/* Checkbox End*/

.ipsg-main-nav .ipsg-logo
{
    /*z-index: 6;*/
}

.ipsg-main-content .ipsg-search{
    /*z-index: 5;*/
}

#ui-datepicker-div {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12) !important;
}

.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    border: 1px solid #ccc;
    background-color: #fff;
    padding: 0;
    font-size: 1.25rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12) !important;
}

.inputfile + label span {
    width: 200px;
    min-height: 35px;
    display: inline-block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: top;
    font-size: 12px;
    font-weight: normal;
}

.inputfile + label .btnBworse {
    height: 100%;
    color: #ffffff;
    background-color: #004F5B;
    display: inline-block;
    border: unset;
}

.inputfile + label span, .inputfile + label .btnBworse {
    padding: 0.625rem 1.25rem;
    line-height: 20px;
    pointer-events: none;
}

.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    margin-right: 0.25em;
}

.inputfile + label .btnClose {
    background-color: transparent;
    border: none;
    font-size: 14px;
    visibility:hidden;
}

.background-color-orange {
    background: #ffb625 0% 0% no-repeat padding-box !important;
    opacity: 1 !important;
}

.link_button_time {
    margin-top: 0 !important;
}

.link_button_time a {
    padding: 6px 8px;
    height: fit-content;
}

.styled-checkbox .after-label {
    margin-top: 3px;
    display: inline-block;
    margin-left: 15px;
}

.button-Time {
    padding:5px 8px;
    height:fit-content !important;
}

.pl-25 {
    padding-left: 25px !important;
}

.dropdown-toggle {
    width: 100%;
    font-size: 12px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12) !important;
    border-radius: 0 !important;
    height: 34px;
    padding: 6px 12px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    text-align: left;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-appearance: none;
    white-space: pre;
}

.dropdown-item {
    font-size: 12px;
    border-radius: 0 !important;
    height: 22px;
    width: 170px; 
    padding: 4px 12px;
    line-height: 1.3;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: none;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    text-align: left;
}

/* Multi select CSS Start */

.multiselect-container .multiselect-group > span,
.multiselect-container > .multiselect-option > span
 {
    padding: 0px !important;
}

    .multiselect-container > .multiselect-option > span > .form-check-label,
    .multiselect-container > .multiselect-all > span > .form-check-label {
        margin-left: 8px;
        position: relative;
        top: 0px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 270px;
    }

.multiselect-native-select .btn-group{
    width:100%;
}

.multiselect-container button .form-check input {
    -webkit-appearance: none;
    appearance: none;
    background-color: #eee;
    margin: 0;
    font: inherit;
    color: currentColor;
    width: 19px;
    height: 19px;
    border: 1px solid lightgray;
    transform: translateY(-0.075em);
    display: grid;
    place-content: center;
    font-size: 2rem;
    cursor: pointer;
    border-radius: 2px;
    float: left;
}

.multiselect-container button .form-check input:checked {
    background-color: #fff;
}

.multiselect-container button .form-check input:checked::before {
    transform: scale(1);
}

.multiselect-container button .form-check input::before {
    content: "";
    width: 0.65em;
    height: 0.65em;
    transform: scale(0);
    transform-origin: center;
    transition: 80ms transform ease-in-out;
    box-shadow: inset 1em 1em var(--form-control-color);
    background-color: #004F5B;
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.multiselect-container button .form-check input:focus {
    outline: none !important;
}

/* Multi select CSS End */

.time-grid-box {
    background-color: #CADCE1;
    /*padding: 5px;*/
    display: table;
    border-bottom: 1px solid #ffffff;
    width: 100%;
}

    .time-grid-box .input-group .multiselect[type="button"],
    .time-grid-box input[type="text"] {
        height:30px;
    }

    .time-grid-box span[id^="btnRemoveTimeStrip_"][disabled="disabled"] {
        filter: grayscale(1);
        opacity: 0.5;
        pointer-events: none;
    }

.mb-0{
    margin-bottom: 0px;
}
.mt-0 {
    margin-top: 0px;
}

/* accordion */
.accordion .card {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12) !important;
}
.accordion .card .card-header {
    border: 1px solid #ccc;
    margin-bottom: 0px;
    cursor: pointer;
    background-color: #00A5B5;
    color: #fff;
}
.accordion .card .card-header h2 {
    margin: 0px;
    display: flex;
    justify-content: space-between;
}
.accordion .card .card-header .card-title {
    font-size: 13px;
    padding: 15px;
    margin-bottom: 0px;
    display: block;
    cursor: pointer;
    display: flex;
    justify-content: flex-start;
}

.accordion .collapse,
.accordion .collapsing {
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.accordion .card .card-body {
    padding: .35em .625em .35em;
}

.accordion .card .card-header .fa {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 14px;
    padding: 15px;
}

.accordion .card .card-header .fa:before {
    transform: rotate(0deg);
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
}

.accordion .card .card-header[aria-expanded="true"] .fa:before {
    transform: rotate(-90deg);
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
}