/*Chrome Fix*/
.RadGrid div[id*='_Frozen'] {
    overflow-x: scroll !important;
}

/*Web Fonts*/
@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300italic,100italic,300,400italic,500,500italic,700italic,900italic,900);

/*Local font's Installation input case online fails*/
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: normal;
    src: url("../../../Fonts/roboto/Roboto-Regular.ttf");
}

@font-face {
    font-family: "RobotoMedium";
    font-style: normal;
    font-weight: normal;
    src: url("../../../Fonts/roboto/Roboto-Medium.ttf");
}

/*font-face-src Installation Ends Here*/
.clrblk {
    color: #000000;

}


.table21 {
  
  border-collapse: collapse;
  width: 100%;

}

.table21 th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}
.table21 td {
  border: 1px solid #dddddd;
  border-right: 0;
  text-align: left;
  padding: 8px;
  width: 16.6%
}

.table21 td:nth-child(even) {
  border-left: none;
  text-align: right;
  text-decoration-color: #2CB5CB;
}

.table21 td:nth-child(6) {
  border-left: none;
  border-right: 1px solid #dddddd;
  text-align: right;
  text-decoration-color: #2CB5CB;
}

#dialog-closepayments {
    padding: 0px !important;
}




h1 {
    font-size: 23px;
    color: #fff;
    padding: 5px 0 0 12px;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 10px;
    font-weight: 500;
    text-transform: uppercase;
}

.Del-Button a, Edit-Button a {
    color: #fff !important;
}

html, body {
    margin: 0px;
    background-color: #fff;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 13px !important;
    line-height: 17px !important;
    color: #333333;
}

.fa-question-circle {
    display: none !important;
}

.ui-button .ui-button-text {
    line-height: 20px;
    color: #fff;
}

#divHelpText ul {
    margin-bottom: 10px !important;
    margin-left: -3.2em !important;
}

.RadGrid .rgHeader, .RadGrid th.rgResizeCol {
    font-weight: 500 !important;
}

.RadComboBox_Windows7 .rcbInput {
    font-family: "roboto",Arial,Helvetica,sans-serif !important;
}

.capitalizeAll {
    text-transform: lowercase;
}

.capitalizeAll {
    text-transform: capitalize;
}

.top_0 {
    margin-top: 5px !important;
}

.header_top_menu {
    float: right;
    padding: 6px 2em 0 0;
    width: auto;
}

.user i {
    padding: 0 0 0 10px !important;
}

.orgname {
    margin-top: 8px;
    float: left;
    width: 50%;
    text-transform: none !important;
}

    .orgname h1 {
        color: #fff !important;
        font-size: 18px;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .orgname a:hover {
        color: #fff !important;
        text-decoration: none !important;
    }


.lbl {
    color: #fff;
    /*border-bottom: 1px dashed white;
    font-weight: bold;*/
    text-transform: uppercase;
    font-size: 12px;
    /*margin-left: 7%;*/
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline !important;
}

.acc_nav {
    width: 250px;
    z-index: 1;
    position: absolute;
    top: 63px;
    margin-left: 0px;
    padding-left: 7px;
}

a:focus {
    outline: none !important;
    outline-offset: 0 !important;
}


.table-container-heading {
    margin-left: -1px;
    background-color: rgb(73,121,147);
    position: fixed;
    z-index: 2;
    width: 101%;
    height: 30px;
    top: 65px;
}


    .table-container-heading h2 {
        margin-top: 9px;
        color: #fff;
        font-size: 14px;
        font-weight: 500;
        padding: 0px 0px 0px 12px;
        letter-spacing: 0.8px;
        text-transform: uppercase;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

#zenbox_tab {
    top: 35% !important;
    transform: rotate(180deg);
}

    #zenbox_tab img {
        max-width: 150% !important;
    }

#divHelpText h1 {
    height: 0 !important;
    line-height: 0 !important;
    padding: 0;
    margin-top: 2em;
}

#header {
    float: right !important;
    padding: 0px 0px !important;
    height: 20px !important;
    background: none !important;
}

.x-panel-header-default {
    background-color: #3F6172;
    position: fixed;
    z-index: 3;
    width: 100%;
    height: 65px;
}

.adm_name h1 {
    top: 16px !important;
    font-size: 23px;
    color: #FFF !important;
    font-weight: bold !important;
    position: absolute;
    margin: 4px 0 0 -15px;
}


.topleft {
    width: 100px;
    height: 40px;
    padding: 5px 0px 0px 0px;
}

.middle {
    height: 0px;
}

/* Copyright Class*/
.copyright {
    font-size: 10px;
    color: #333;
    background-color: #fff;
    right: 0;
    position: fixed;
    bottom: 0;
}

.border_bottom {
    border-bottom: 1px solid #497993;
}


#menuLeft ul {
    margin: 0;
    padding: 5px;
    list-style-type: none;
    font-family: 'Roboto', Arial,Helvetica,Verdana,sans-serif;
}

#menuLeft li a {
    display: block;
    display: block;
    padding: 3px 0;
    padding-left: 9px;
    width: 100%; /*185px minus all left/right paddings and margins*/
    text-decoration: none;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    font-weight: normal;
    color: #4c99d1;
    text-align: left;
}

    #menuLeft li a:hover {
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 10px;
        font-weight: normal;
        color: #000000;
    }

    #menuLeft li a.active {
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 10px;
        font-weight: normal;
        background-color: #e5ebf9;
        color: #000000;
    }

.menuTitle {
    padding: 1px 0;
    padding-left: 9px;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #4c99d1;
    text-align: left;
}
/* Page Header options*/
.pageHead {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    color: #fff;
    text-decoration: none;
    padding: 0px;
    line-height: 18px;
    float: left;
}

a.headera {
    font-size: 11px !important;
    color: #FFF !important;
    text-decoration: none !important;
    margin-left: 1em;
    padding: 2px;
    text-transform: uppercase;
    font-weight: bold !important;
}

/*a.top-active {
    border-top: 1px solid #f60;
    padding: 5px 10px 7px;
    margin: 0px 0px 0px -3px;
    font-size: 12px !important;
    background-color: rgb(73,121,147) !important;
    color: #fff !important;
    text-decoration: none !important;
}*/

/* Div tag*/
div.wrap_div {
    padding: 0px 20px 0px 0px;
    margin: 2px auto;
    width: 100%;
}

.divSuccessMessage {
    padding: 5px 20px;
    width: 55% !important;
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #D6E9C6;
}

.divErrorMessageHidden {
    border: 1px solid #fff;
    padding: 10px 15px;
    color: Red;
    text-align: left;
    font-size: 12px;
    width: 95%;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    display: none;
}

.divErrorMessage {
    color: #F00;
    text-align: center;
    font-size: 14px;
    font-family: "Roboto",Arial,Helvetica,Verdana,sans-serif;
    text-transform: uppercase;
    border: 1px solid #f00;
    width: 30%;
    margin-top: 1%;
    font-weight: 500;
}

/* Default Sytle for Calendar control */

div.ui-datepicker {
    background-color: #eeeeee;
    border: 1px solid grey;
    font-size: 10px;
}

.ui-datepicker {
    width: 19em !important;
    padding: .2em .2em 0;
}

/*Multiview header*/
ul.nav_ul {
    float: left;
    display: block;
    width: 100%;
    height: 50px;
    background-image: url(../../../../common/Images/base_line.png);
    background-repeat: repeat-x;
    background-position: center center;
}

li.anc_li {
    margin: 0px 4px;
    float: left;
    display: block;
    width: auto;
    height: 50px;
}

    li.anc_li a {
        display: block;
        width: 100%;
        height: 32px;
        background-image: url(../../../../common/Images/nav_img.png);
        background-position: bottom center;
        background-repeat: no-repeat;
        text-align: center;
        color: #bbb;
        font-size: 11px;
    }

    li.anc_li div {
        display: block;
        width: 100%;
        height: 32px;
        background-image: url(../../../../common/Images/nav_img.png);
        background-position: bottom center;
        background-repeat: no-repeat;
        text-align: center;
        color: #bbb;
        font-size: 11px;
    }

    li.anc_li a:hover {
        color: #555;
    }

    li.anc_li a.selected {
        color: #1158b4;
        background-image: url(../../../../common/Images/nav_hover_bg.png);
        background-position: bottom center;
        background-repeat: no-repeat;
        font-weight: bold;
    }

.clear {
    display: block;
    clear: both;
}

a {
    text-decoration: none;
    outline: none;
    color: #00a7bb;
}
/* body */

.table {
    width: 100%;
    border: 2px solid #000;
    border-collapse: collapse;
}

/*lazy load*/
#lazy_preloader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fefefe;
    z-index: 99;
    height: 100%;
}

#lazyload_status {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 8px solid #f3f3f3; /* Light grey */
    border-top: 8px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 60px;
    height: 60px;
    animation: spin 2s linear infinite;
    margin: -50px 0 0 -50px;
}
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.loading {
    /* Since the table may be empty, set a decent default height. */
    border: 8px solid #f3f3f3; /* Light grey */
    border-top: 8px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 60px;
    height: 60px;
    animation: spin 2s linear infinite;
}


/*.loading {*/
    /* Since the table may be empty, set a decent default height. */
    /*height: 350px;*/ /* Center an animated progress indicator over the table body. */
    /*background-image: url(../../../../common/Images/indicator.gif);
    background-position: center center;
    background-repeat: no-repeat;
    background-color: transparent;
}*/

.TableRoundtop {
    height: 7px;
    background: transparent url(../../../../common/Images/top_curve.gif) no-repeat;
}

.TableRoundmid {
    background: transparent url(../../../../common/Images/mid.gif);
}

.TableRoundbottom {
    height: 7px;
    background: transparent url(../../../../common/Images/bottom.gif) no-repeat;
}
/* Message */

#save_status { /* for employee schedule page */
    vertical-align: middle;
    padding: 10px 10px 0 0;
}

#notification-box {
    display: none;
    text-align: center;
    line-height: 27px;
    width: 20%;
    color: #3c763d;
    background: #d6e9c6;
    border: 1px solid #bad8a0;
    font-size: 13px;
    font-weight: 500;
    font-family: Roboto;
    top: 20%;
    left: 20%;
    position: absolute;
}


.message {
    display: block;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 13px;
    color: #000000;
    text-decoration: none;
    line-height: 17px;
    text-align: justify;
}

.messageblue {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 11px;
    font-weight: bold;
    color: #4c99d1;
    text-align: center;
}
/* label */
.label {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 13px;
}

.labelFormTitle {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 14px;
    color: #FF6600;
    font-weight: 500;
    text-transform: uppercase;
}

.labelBold {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-weight: 500;
    font-size: 13px;
    text-transform: uppercase;
}

.labelSkinBlue {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 9px;
    color: #606a94;
    display: block;
}

.labelSkinBlueHidden {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 9px;
    color: #606a94;
    display: none;
}

.labelHeading {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #4c99d1;
}

.labelSubHeading {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: #4c99d1;
}
/*watermark*/
.water {
    background: #fff;
    border: 1px solid #CCC7C7;
    color: #333333;
    height: 22px;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    padding-left: 4px;
}

.rmitem > .rmSlide {
    left: 180px !important;
}

.actxtbox {
    font-family: roboto;
    background: #fff;
    border: 1px solid #CCC7C7;
    color: #000;
    font-size: 13px;
}

.servicetxtbox {
    background: #fff;
    border: 1px solid #CCC7C7;
    color: #333333;
}


/* textbox */

.txtbox {
    border-radius: 0px;
    background: #FFF none repeat scroll 0% 0%;
    border: 1px solid #CCC7C7;
    color: #000;
    /*margin-right: 4px;*/
    font: 13px Roboto !important;
    height: 23px;
    padding: 0 4px 0 4px;
}

.txtboxred {
    background-image: url(../../../../common/Images/form_bg.jpg) !important;
    background-repeat: repeat-x !important;
    border: 1px solid #f00 !important;
    color: #333333 !important;
    padding: 3px !important;
    margin-right: 4px !important;
    margin-bottom: 2px !important;
}

.txtbox:hover {
    border: 1px solid #87BEEC;
}

.txtbox:focus {
    border: 1px solid #87BEEC;
}


.txtbox-red {
    background: #fff;
    border: 1px solid #CCC7C7;
    color: #333333;
    padding: 3px;
    margin-right: 3px;
    margin-bottom: 2px;
    padding: 2px 2px;
    text-align: right;
    padding-left: 4px;
}

.focus {
    border-radius: 0px;
    background: #FFF none repeat scroll 0% 0%;
    border: 1px solid #CCC7C7;
    color: #000;
    /*margin-right: 4px;*/
    font: 13px Roboto !important;
    height: 23px;
    padding: 0px 4px;
}


.imgbtn {
    margin-left: 5px;
    margin-top: 8px;
    margin-bottom: -3px;
}

/* dropdown list*/
.selbox {
    color: #000000 !important;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px !important;
    height: 25px !important;
    margin: 0 5px 0 0 !important;
    padding: 0 0 !important;
}

/* radio button */
.rbtbox {
    color: #333333;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
}

.rbtbox-red {
    color: #ff0000;
}


/* tooltip */
.tooltip {
    background-color: #000000;
    border: 3px solid #ffffff;
    padding: 5px 5px;
    width: 200px;
    display: none;
    color: #ffffff;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px; /* outline radius for mozilla/firefox only */
    -moz-box-shadow: 0 0 10px #000;
    -webkit-box-shadow: 0 0 10px #000;
}
/* footer */
.footer {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    font-style: normal;
    line-height: normal;
    font-weight: normal;
    font-variant: normal;
    color: #ffffff;
    background-color: #0656a0;
}
/*Grid*/

.GridHeader {
    height: 30px;
}

.GridColumn1 {
    background-color: #F4F3F3;
    text-align: left;
    height: 25px;
    !important;
}

.GridColumn2 {
    background-color: #Fff;
    height: 25px;
    border: solid 0px !important;
}

.Grid {
    width: 100%;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    background-color: #fff;
    margin: 5px 0 0px 0;
    border: solid 0px #ffffff;
    height: 30px;
}

    .Grid td {
        padding: 3px;
        color: #000000;
        text-align: left;
        border: solid 0px;
        font-size: 13px;
    }

    .Grid th {
        padding: 3px;
        color: #000;
        text-align: left;
        border: 0px solid;
        text-transform: uppercase;
        font-weight: 500;
    }

checkbox-td {
    width: 25% !important;
    background-color: #333333 !important;
}

/*Form*/
#aspnetForm table {
    border-spacing: 0px;
    padding-left: 10PX;
    border-collapse: collapse;
    empty-cells: show;
    font-family: roboto;
}



#aspnetForm .label {
    background-color: transparent;
    color: #333;
    font-size: 13px;
    text-align: left;
    vertical-align: top;
    font-family: roboto;
}

#aspnetForm .field {
    padding-bottom: 2px;
    white-space: nowrap;
    margin-left: 2px;
    margin-top: 8px;
    margin-bottom: 3px;
    font-size: 13px;
    font-family: roboto;
}

#aspnetForm .status {
    vertical-align: top;
    text-align: left;
    white-space: nowrap;
    font-family: roboto;
}

#aspnetForm label.error {
    background: url(../../../../common/Images/delete.png) no-repeat 0px 0px;
    padding-left: 20px;
    padding: 0 0 0 20px;
    font-weight: 500;
    color: #F00;
}

#aspnetForm label.checked {
    background: url(../../../../common/Images/checked.gif) no-repeat 0px 0px;
}

#aspnetForm .success_msg {
    font-family: roboto;
    font-weight: 500;
    color: #48A200;
}

/*Popup */
#popup_container {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    min-width: 300px; /* Dialog will be no smaller than this */
    max-width: 600px; /* Dialog will wrap after this width */
    background: #FFF;
    border: solid 0px #ff6600;
    color: #000;
    box-shadow: 7px 6px 13px -6px #000 !important;
}

#popup_title {
    font-size: 12px;
    font-weight: 500;
    text-align: left;
    line-height: 1.75em;
    color: #fff;
    background-color: #497993;
    cursor: default;
    padding: 3PX;
    margin: 0 auto;
}

#popup_content {
    background: 16px 16px no-repeat url(../../../../common/Images/info.png);
    padding: 1em 1.75em;
    margin: 0em;
}

    #popup_content.alert {
        background-image: url(../../../../common/Images/info.png);
    }

.alert {
    border: none !important;
    color: #333 !important;
}

.customcol2Label {
    text-transform: uppercase;
}

#popup_content.confirm {
    background-image: url(../../../../common/Images/important.gif);
}

#popup_content.prompt {
    background-image: url(../../../../common/Images/help.gif);
}

#popup_message {
    font-size: 12px;
    padding-left: 48px;
    text-align: left;
    font-family: inherit;
}

#popup_panel {
    text-align: center;
    margin: 1em 0em 0em 1em;
}

#popup_prompt {
    margin: .5em 0em;
}

/*Pagination */
.pagerActive {
    text-decoration: none;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    color: gray;
    background-color: #fff;
}

    .pagerActive a {
        text-decoration: none;
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 10px;
        color: gray;
        background-color: #fff;
    }

.pagerDeactive {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    color: #000000;
    background-color: #fff;
}

    .pagerDeactive a {
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 10px;
        color: #000000;
        background-color: #fff;
    }

.pagerNumbers {
    float: right;
}
/* root element for tabs  */
.tabs {
    list-style: none;
    margin: 0 !important;
    padding: 0;
    height: 30px;
    border-bottom: 1px solid #666;
}


#calroot {
    /* place on top of other elements. set a higher value if nessessary */
    z-index: 1;
    margin-top: -1px;
    width: 198px;
    padding: 2px;
    background-color: #fff;
    font-size: 11px;
    border: 1px solid #ccc;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow: 0 0 15px #666;
    -webkit-box-shadow: 0 0 15px #666;
}

/* head. contains title, prev/next month controls and possible month/year selectors */
#calhead {
    padding: 2px 0;
    height: 22px;
}

#caltitle {
    font-size: 14px;
    color: #0150D1;
    float: left;
    text-align: center;
    width: 155px;
    line-height: 20px;
    text-shadow: 0 1px 0 #ddd;
}

#calnext, #calprev {
    display: block;
    width: 20px;
    height: 20px;
    background: transparent url(../../../../common/Images/prev.gif) no-repeat scroll center center;
    float: left;
    cursor: pointer;
}

#calnext {
    background-image: url(../../../../common/Images/next.gif);
    float: right;
}

    #calprev.caldisabled, #calnext.caldisabled {
        visibility: hidden;
    }

/* year/month selector */
#caltitle select {
    font-size: 10px;
}

/* names of the days */
#caldays {
    height: 14px;
    border-bottom: 1px solid #ddd;
}

    #caldays span {
        display: block;
        float: left;
        width: 28px;
        text-align: center;
    }

/* container for weeks */
#calweeks {
    background-color: #fff;
    margin-top: 4px;
}

/* single week */
.calweek {
    clear: left;
    height: 22px;
}

    /* single day */
    .calweek a {
        display: block;
        float: left;
        width: 27px;
        height: 20px;
        text-decoration: none;
        font-size: 11px;
        margin-left: 1px;
        text-align: center;
        line-height: 20px;
        color: #666;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

        /* different states */
        .calweek a:hover, .calfocus {
            background-color: #ddd;
        }

/* sunday */
a.calsun {
    color: red;
}

/* offmonth day */
a.caloff {
    color: #ccc;
}

    a.caloff:hover {
        background-color: rgb(245, 245, 250);
    }


/* unselecteble day */
a.caldisabled {
    background-color: #efefef !important;
    color: #ccc !important;
    cursor: default;
}

/* current day */
#calcurrent {
    background-color: #498CE2;
    color: #fff;
}

/* today */
#caltoday {
    background-color: #333;
    color: #fff;
}

.RoundedDiv {
    width: 90%;
    border: 1px solid #4d97d4;
    background: #E4ecf9;
    padding: 1px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}


.TableRoundtop {
    height: 7px;
    background: transparent url(../../../../common/Images/top_curve.gif) no-repeat;
}

.TableRoundmid {
    background: transparent url(../../../../common/Images/mid.gif);
}

.TableRoundbottom {
    height: 7px;
    background: transparent url(../../../../common/Images/bottom.gif) no-repeat;
}

.ViewDrop {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
}

input.text {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    margin-bottom: 12px;
    width: 95%;
    padding: .4em;
}

.validateTips {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 10px;
    border: 1px solid transparent;
    padding: 0.3em;
}

fieldset {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    padding-left: 10px;
    margin-top: 10px;
}


#divEditBox {
    display: none;
    position: absolute;
    left: 30%;
    top: 30%;
}

.formtxtbox {
    width: 198px;
    color: #000000;
    border: solid 1px #7F9DB9;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 8pt;
}

/* Default Sytle for Calendar control */
.demoHeaders {
    margin-top: 2em;
}

#dialog_link {
    padding: .4em 1em .4em 20px;
    text-decoration: none;
    position: relative;
}

    #dialog_link span.ui-icon {
        margin: 0 5px 0 0;
        position: absolute;
        left: .2em;
        top: 50%;
        margin-top: -8px;
    }

ul#icons {
    margin: 0;
    padding: 0;
}

    ul#icons li {
        margin: 2px;
        position: relative;
        padding: 4px 0;
        cursor: pointer;
        float: left;
        list-style: none;
    }

    ul#icons span.ui-icon {
        float: left;
        margin: 0 4px;
    }

/* single tab */
.tabs li {
    float: left;
    text-indent: 0;
    padding: 0;
    margin: 0 !important;
    list-style-image: none !important;
}

/* link inside the tab. uses a background image */
.tabs a {
    background: url(../../../../common/Images/tabs.png) no-repeat -652px 0;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 13px;
    font-weight: bold;
    display: block;
    height: 30px;
    line-height: 30px;
    width: 111px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    padding: 0px;
    margin: 0px;
    position: relative;
    top: 1px;
}

    .tabs a:active {
        outline: none;
    }

    /* when mouse enters the tab move the background image */
    .tabs a:hover {
        background-position: -652px -31px;
        color: #fff;
    }

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
.tabs .current, .tabs .current:hover, .tabs li.current a {
    background-position: -652px -31px;
    cursor: default !important;
    color: #fff !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
.tabs .w1 {
    background-position: -519px 0;
    width: 134px;
}

    .tabs .w1:hover {
        background-position: -519px -31px;
    }

    .tabs .w1.current {
        background-position: -519px -62px;
    }

/* width 2 */
.tabs .w2 {
    background-position: -366px -0px;
    width: 154px;
}

    .tabs .w2:hover {
        background-position: -366px -31px;
    }

    .tabs .w2.current {
        background-position: -366px -62px;
    }


/* width 3 */
.tabs .w3 {
    background-position: -193px -0px;
    width: 174px;
}

    .tabs .w3:hover {
        background-position: -193px -31px;
    }

    .tabs .w3.current {
        background-position: -193px -62px;
    }

/* width 4 */
.tabs .w4 {
    background-position: -0px -0px;
    width: 194px;
}

    .tabs .w4:hover {
        background-position: -0px -31px;
    }

    .tabs .w4.current {
        background-position: -0px -62px;
    }


/* initially all panes are hidden */
.panes .pane {
    display: none;
}

#pnEmailCommTemplate {
    width: 780px;
}

#pnSMSCommTemplate {
    width: 780px;
}

/* Z-index of #mask must lower than #boxes .window */
.mask {
    position: absolute;
    z-index: 9000;
    background-color: #4C4C4C;
    display: none;
    top: 5px;
    left: 0;
}

.boxes .window {
    position: absolute;
    width: 440px;
    height: 200px;
    display: none;
    z-index: 9999;
    padding: 20px;
}


/* Customize your modal window here, you can add background image too */
.boxes #dialog {
    background-color: #ffffff;
    width: 600px;
    height: 400px;
    overflow: auto;
}

.close {
    float: right;
}
/* Customize your modal window here, you can add background image too */
.boxes #dialog2 {
    background-color: #FDFCC3;
    width: 610px;
    height: 400px;
    overflow: auto;
}

.paneltxtbox {
    width: 615px;
    height: 400px;
}

.panelsmalltxtbox {
    width: 615px;
    height: 100px;
}

.showdialog {
    float: left;
    overflow: auto;
    margin-top: 20px;
    margin-left: 10px;
}


#sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 60%;
}

    #sortable li {
        margin: 0 3px 3px 3px;
        padding: 0.4em;
        padding-left: 1.5em;
        font-size: 1.4em;
        height: 18px;
    }

        #sortable li span {
            position: absolute;
            margin-left: -1.3em;
        }

#rounded_container {
    width: 585px;
    height: auto;
    margin: 0 auto;
}

#rounded_top {
    width: 585px;
    height: 22px;
    background-repeat: no-repeat;
}

#rounded_mid {
    width: 585px;
    min-height: 425.5px;
    background-color: #fff;
    border: 1px solid #C6C6C6;
}

#rounded_bottom {
    width: 585px;
    height: 42px;
    margin: 0 auto;
    background-repeat: no-repeat;
}

.loginbody {
    background-color: #e5e5e5;
    margin: auto;
    padding: 60px;
    color: #999;
    text-align: center;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
}
/*.pos_bottom{
    top: 350px;
    position: absolute;
}
.pos_bottom1{
    top: 200px;
    width: 44%;
    position: absolute;
    
}*/
.errorloginbody {
    background-color: #e5e5e5;
    color: #999;
    text-align: center;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    padding-top: 80px;
}

#imgLogo {
    margin: 10px 0 10px 20px;
    max-width: 185px;
    max-height: 64px;
}

#logo {
    float: left;
}

#top_box {
    font-size: 12px;
    background-color: #f2dede;
    color: #a94442;
    padding: 6px;
    width: 91%;
    margin-right: 20px;
    margin-top: 5px;
    float: right;
    border: 1px solid #ebccd1;
}


top1_box {
    margin: 0 auto;
    width: 530px;
    height: 28px;
    background-color: white;
    border: 1px solid #c2c2c2;
    line-height: 28px;
    padding-left: 10px;
    text-align: left;
    clear: left;
    font-weight: 500;
    color: blue;
}

.divider {
    margin: 10px;
}

.divider_gap {
    margin-top: 90px;
}

#inputArea {
    clear: both;
    width: 95%;
    height: auto;
    padding: 0 0 0 15px;
    text-align: left;
}

    #inputArea label {
        display: block;
        text-align: left;
        margin: 3px;
        padding: 0;
        font-size: 14px;
    }

    #inputArea input {
        display: block;
        font-size: 12px;
    }

        #inputArea input[type="submit"] {
            text-align: left;
            font-size: 15px;
        }

#dashed_line {
    width: 530px;
    margin: 20px auto 0 auto;
    border-top: 1px dashed #8f8f8f;
}

#login_bottom {
    clear: both;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    overflow: hidden;
}

#text {
    float: left;
    width: 330px;
    font-size: 12px;
    text-align: left;
    line-height: 21px;
    margin-top: 25px;
    margin-left: 35px;
}

#mlogo {
    float: right;
    width: 200px;
    height: 56px;
    margin-right: 35px;
}

#btnLogin {
    width: 54px;
    height: 21px;
    margin: 0;
    padding: 0;
}

.NoDataTitle {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #FF6600;
}

.NoDataDescription {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: #000000;
}

.NoDataCreateNewLink {
    text-decoration: none;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 13px;
    font-weight: normal;
    color: #FF6600;
    text-align: left;
}

    .NoDataCreateNewLink:hover {
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 13px;
        font-weight: normal;
        color: #000000;
    }

    .NoDataCreateNewLink:active {
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 13px;
        font-weight: normal;
        background-color: #e5ebf9;
        color: #000000;
    }

.red-txt {
    color: #FF0000;
    font-size: 10px;
}

.feedback-txt {
    font-size: 12px;
}

.appointment-header {
    background-color: #3F6172;
    height: 30px;
    padding-right: 0px;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    font-weight: 500;
}

/*.appointment-border {
    border: solid 1px #FF9933;
}*/

.invoice-header {
    background-color: #E3F2F3;
    height: 35px;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    color: #FF6636;
    font-weight: bold;
}

.apselbox {
    color: #000000;
    border: solid 1px #7F9DB9;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    margin-left: 5px;
    margin-top: 8px;
    margin-bottom: -3px;
    height: 21px;
}

.itemactions {
    font-style: italic;
    font-size: 10px;
}

.labelSubHeadingOrange {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    color: #FF6600;
}

.long-button {
    -webkit-appearance: none;
    font-family: roboto;
    cursor: pointer;
    height: 25px;
    text-align: center;
    border: 1px solid transparent !important;
    color: #FFF !important;
    background-color: #FE6C00;
    top: 0px;
    padding: 4px 30px;
    text-transform: capitalize;
}

    .long-button:hover {
        background-color: #EB6712;
        border: none !important;
        color: white !important;
        padding: 5px 31px;
    }

.ui-icon-newwin {
    background-position: 0px 10px !important;
}

.global-link {
    background-color: #BDBDBD;
    border-style: solid;
    border-width: 0px;
    color: #FFFFFF !important;
    cursor: pointer;
    padding: 2px 15px 3px;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
}

    .global-link:hover {
        background-color: #FE6C00;
        text-decoration: none;
    }

.RadGrid_Default .rgHeaderWrapper {
    border-color: -moz-use-text-color -moz-use-text-color #FFF !important;
}

.cancel {
    -webkit-appearance: none;
    font-family: roboto;
    color: #FFF !important;
    cursor: pointer;
    height: 27px;
    text-align: center;
    background-color: #FE6C00;
    padding: 4px 20px;
    text-transform: capitalize;
    font-size: 14px !important;
    border: medium none;
    min-width: 90px;
}

    .cancel a {
        min-width: 90px;
    }

    .cancel:hover {
        /*border: 1px solid transparent !important;*/
        background-color: #EB6712;
    }

.login {
    font-family: roboto;
    font-size: 13px;
    border: 1px solid transparent !important;
    color: #FFF !important;
    cursor: pointer;
    height: 25px;
    text-align: center;
    text-transform: capitalize;
    background-color: #FE6C00 !important;
    top: 0px;
    padding: 4px 16px;
    margin: 0px 3px;
}

    .login:hover {
        background-color: #EB6712 !important;
        text-decoration: none !important;
        color: #FFF !important;
    }

#divHelpText {
    padding: 0 15% 0 0%;
    text-align: left;
}

    #divHelpText h3 {
        line-height: 20px;
    }

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

.nogapp {
    margin-left: 0 !important;
}

.tagHandler ul.tagHandlerContainer {
    border: 1px solid #CCC7C7 !important;
}


.action_btn {
    text-align: right;
    position: relative;
    top: 40px;
}

.img_btn {
    cursor: pointer;
    width: 28px;
    margin-left: 2px;
}

    .img_btn:hover {
        opacity: 0.8;
    }


.global-button3 {
    font-size: 13px;
}

.global-button {
    -webkit-appearance: none;
    font-size: 14px !important;
    border: none;
    color: #FFF !important;
    background-color: #FE6C00;
    cursor: pointer;
    height: 27px;
    text-align: center !important;
    padding: 4px;
    text-transform: capitalize;
    min-width: 80px;
}

    .global-button a {
        -webkit-appearance: none;
        border-style: solid;
        border-width: 0px;
        color: #FFFFFF;
        cursor: pointer;
        padding: 2px 15px 3px;
        text-align: center;
        text-transform: capitalize;
    }

        .global-button a:hover, .global-button:hover {
            background-color: #EB6712 !important;
            text-decoration: none;
        }

.paymentSetting-button {
    -webkit-appearance: none;
    font-size: 14px !important;
    border: none;
    color: #FFF !important;
    background-color: #FE6C00;
    cursor: pointer;
    height: 30px !important;
    text-align: center !important;
    padding: 4px;
    text-transform: capitalize;
    min-width: 40px;
}

    .paymentSetting-button a {
        -webkit-appearance: none;
        border-style: solid;
        border-width: 0px;
        color: #FFFFFF;
        cursor: pointer;
        padding: 2px 15px 3px;
        text-align: center;
        text-transform: capitalize;
    }

        .paymentSetting-button a:hover, .paymentSetting-button:hover {
            text-decoration: none;
        }

.txtbox-right {
    background: #fff;
    border: 1px solid #CCC7C7;
    color: #333333;
    padding: 3px;
    margin-right: 3px;
    margin-bottom: 2px;
    padding: 2px 2px;
    text-align: right;
}


    .txtbox-right:hover {
        border: 1px solid #ff6600;
    }

.txt-box {
    padding-left: 3px;
    border: 1px solid #CCC7C7;
    background: #FFF none repeat scroll 0% 0%;
    color: #333;
    width: 130px;
    height: 17px;
    font-family: inherit;
    font-size: 12px;
}

.actxtbox {
    padding-left: 3px;
}

.txt-box:hover {
    border: 1px solid #87BEEC;
}

#idPayTable {
    margin-top: 1px;
}

.PaymentBtnRight {
    border: 1px solid #D8D8D8;
    padding: 10px;
}
/*.PaymentBtnLeft{
    background: #EAEAEA;
    border-top: 1px solid #D8D8D8;
    border-bottom: 1px solid #D8D8D8;
    border-left: 1px solid #D8D8D8;
    border-right: 0px solid transparent;
}*/



.faspace {
    color: #4a4a4a;
    font-size: 17px;
    margin: 0 10px 0 5px;
    transition: all 0.1s;
}

.payment-button-hover .faspace, .payment-button-active .faspace {
    color: #EB6712;
    font-size: 17px;
    margin: 0 10px 0 5px;
}

.payment-button {
    -webkit-appearance: none;
    background-color: #EAEAEA;
    color: #000000;
    display: inline-block;
    font-size: 13px;
    cursor: pointer;
    text-align: left;
    width: 99%;
    height: 25px;
    line-height: 25px;
    margin: -1px 15px 0 0;
    padding: 2px 0;
    text-transform: capitalize;
    border-top: 1px solid #d8d8d8;
    border-left: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    border-right: 1px solid #EAEAEA;
}

.payment-button-active, .payment-button-hover {
    background-color: #FFF;
    color: #EB6712;
    display: inline-block;
    font-size: 13px;
    cursor: pointer;
    text-align: left;
    width: 99%;
    height: 25px;
    line-height: 25px;
    margin: -1px 15px 0 0;
    padding: 2px 0;
    -webkit-appearance: none;
    text-transform: capitalize;
    border-top: 1px solid #d8d8d8;
    border-left: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    border-right: 1px solid #fff;
}



.payment-button-active {
    position: relative;
}

    .payment-button-active:after {
        content: "\f105";
        font-family: FontAwesome;
        top: 1px;
        right: 3px;
        position: absolute;
        font-size: 18px;
        font-weight: bold;
    }


.appsave-button {
    -webkit-appearance: none;
    background-color: #FF8B3E;
    color: #FFF;
    padding: 4px 17px;
    font-size: 14px;
    cursor: pointer;
    text-align: center;
    /*height: 20px;*/
    font-weight: initial;
    /*margin: 0px 2px 0px 0px;*/
    text-transform: capitalize;
}

    .appsave-button:hover {
        background-color: #EB6712;
        color: #FFF;
    }

@media all and (max-width: 1024px) {
    .appsave-button {
        padding: 1px 4px;
    }
}

.marging-bottom {
    margin-bottom: 20px;
}

.search-txtbox {
    border-color: #DDDDDD;
    border-style: solid;
    border-width: 1px;
    color: #333;
    font-size: 14px;
    outline-style: none;
    outline-width: medium;
    width: 30%;
    height: 23px;
    margin-top: 1px;
    font-family: 'Roboto';
    padding-left: 4px;
    /*border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;*/
}

.isearch-txtbox {
    background: #fff;
    border-radius: 5px 0px 0px 5px;
    border: 1px solid #CCC7C7;
    color: #808080;
    padding: 3px;
    margin-right: 4px;
    margin-bottom: 2px;
    padding: 6px 2px;
}

.search-txtbox:hover, .search-txtbox:focus {
    border: 1px solid #ff6600 !important;
}


.AppLink {
    color: #333;
    text-decoration: none;
    cursor: pointer;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    background-color: #D1D1D1;
    width: 100%;
    height: 100%;
    padding: 5px;
}


    .AppLink:hover {
        cursor: pointer;
        font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
        font-size: 12px;
        color: #000;
    }


.PrevBtn {
    width: 7px !important;
    height: 12px !important;
    padding-top: 10px !important;
    display: block !important;
    background-image: url(Images/previous.png) !important;
    background-repeat: no-repeat !important;
    float: left !important;
    margin-top: 10px !important;
    margin-left: 0px !important;
}

    .PrevBtn:hover {
        background-image: url(Images/previous-hover.png) !important;
        background-repeat: no-repeat !important;
        background-color: none !important;
    }

.NextBtn {
    width: 7px !important;
    height: 12px !important;
    padding-top: 10px !important;
    display: block !important;
    background-image: url(Images/next.png) !important;
    background-repeat: no-repeat !important;
    float: left !important;
    margin-top: 10px !important;
    text-transform: uppercase;
}

.NextBtn {
    background-image: url(Images/next-hover.png) !important;
    background-repeat: no-repeat !important;
    background-color: none !important;
}


.ui-state-hover .ui-state-focus {
    background-color: #fff !important;
    border: none !important;
    color: #fff !important;
}

.status-button {
    -webkit-appearance: none;
    font-size: 13px;
    background-color: #EB6712;
    border-style: solid;
    border-width: 0px;
    color: #FFFFFF;
    cursor: pointer;
    padding: 4px 25px;
    text-align: center;
    text-transform: capitalize;
}


.status-buttonGrey {
    -webkit-appearance: none;
    font-size: 13px;
    background-color: #B1B1B1;
    border: 1px solid #B1B1B1;
    color: #747474;
    cursor: inherit;
    text-align: center;
    text-transform: capitalize;
    height: 24px;
    padding: 0px;
    min-width: 80px;
}

#trMain .global-button {
    height: 24px !important;
    padding: 0px !important;
}

.dis_grey {
    -webkit-appearance: none;
    font-size: 13px;
    background-color: #B1B1B1;
    border: 1px solid #B1B1B1;
    color: #fff;
    cursor: inherit;
    text-align: center;
    text-transform: capitalize;
    padding: 4px;
    min-width: 80px;
    text-align: center !important;
}

.status-buttonGrey1 {
    -webkit-appearance: none;
    background-color: none !important;
    border: 1px solid #515151;
    height: 23px;
    color: #FFFFFF;
    cursor: pointer;
    padding: 2px 15px 3px;
    text-align: center;
    text-transform: capitalize;
    font-size: 13px;
}

.status-button:hover {
    background-color: #FF9B2F;
    text-decoration: none;
}

.status-buttonGrey:hover {
    background-color: #b1b1b1;
    border: 1px solid #B1B1B1;
    cursor: not-allowed;
}

.appointment-button {
    -webkit-appearance: none;
    background-color: #e3751e;
    border-style: solid;
    border-width: 0px;
    color: #FFFFFF;
    cursor: pointer;
    padding: 5px 10px 5px 10px;
    text-align: center;
    text-transform: capitalize;
}

    .appointment-button:hover {
        background-color: #FF9B2F;
        text-decoration: none;
    }

.go-button {
    -webkit-appearance: none;
    width: 25px;
    height: 22px;
    display: block;
    cursor: pointer;
    background-image: url(../../../../Common/Images/go.gif);
    background-repeat: no-repeat;
    float: left;
    text-transform: capitalize;
}

    .go-button:hover {
        width: 25px;
        height: 22px;
        background-image: url(../../../../Common/Images/go-hover.gif);
        background-repeat: no-repeat;
    }

.appointment-help-container {
    border-radius: 4px 4px 4px 4px;
    background-color: #eeeeee;
}

.lblClass {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-size: 12px;
    line-height: 17px;
}

.purchase-order {
    font-size: 30px;
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    font-weight: bold;
    color: #000;
}

.merge-guest-header {
    width: 250px;
    height: 52px;
    border: 4px solid #F4f4f4;
    box-shadow: 1px 1px 1px 1px #CCC;
    padding: 12px;
}

.exportbtn {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif;
    color: #fff;
    font-size: 13px;
    background-color: #FE6C00;
    border: 0px solid;
    padding: 5px 10px 5px 10px;
    text-decoration: none;
    cursor: pointer;
    text-transform: capitalize;
}

    .exportbtn:hover {
        background-color: #EB6712;
    }

.search-button {
    font-family: inherit;
    -webkit-appearance: none;
    font-size: 13px !important;
    color: #FFFFFF !important;
    float: left;
    cursor: pointer;
    border: 0 none !important;
    font-weight: normal !important;
    height: 27px !important;
    margin-top: 1.1px !important;
    margin-left: -10px !important;
    padding: -2px 6px 4px 10px !important;
    position: absolute !important;
    text-decoration: none !important;
    text-shadow: none !important;
    width: 70px !important;
    text-transform: capitalize;
    background: #FE6C00 !important;
    /*url("/Common/Images/search.png") no-repeat scroll 14% 0% !important;
    background-position: 3px 2px !important;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;*/
}

    .search-button:hover {
        background: #EB6712 !important;
    }


#search-background-color {
    margin-left: 280px !important;
    width: 350px;
    border-radius: 3px 3px 3px 3px !important;
    padding: 20px !important;
}

.RadComboBox .rcbReadOnly .rcbInput, .RadComboBox .rcbDisabled .rcbInput {
    background-color: transparent !important;
}



#popup_ok {
    font-size: 12px;
    background-color: #FE6C00;
    border: transparent;
    color: #FFF !important;
    cursor: pointer;
    padding: 4px 10px 18px 10px;
    text-align: center;
    height: 20px;
}


    #popup_ok:hover {
        background-color: #EB6712;
        text-decoration: none;
        color: #fff !important;
    }

#popup_cancel {
    font-size: 12px;
    background-color: #FE6C00;
    border: transparent;
    color: #FFF !important;
    cursor: pointer;
    padding: 4px 10px 18px 10px;
    text-align: center;
    height: 20px;
}

    #popup_cancel:hover {
        background-color: #EB6712;
        text-decoration: none;
        color: #fff !important;
    }

/* Employee schedule page tab visibility for month, week & days */
.RadTabStripTop_Office2007 .rtsLevel1 .rtsLink, .RadTabStripTop_Office2007 .rtsLevel1 .rtsOut, .RadTabStripBottom_Office2007 .rtsLevel1 .rtsLink, .RadTabStripBottom_Office2007 .rtsLevel1 .rtsOut, .RadTabStripTop_Office2007 .rtsLevel1, .RadTabStripBottom_Office2007 .rtsLevel1 {
    background-image: url('../../../../App_Themes/EmpSchedule/TabStrip/TabStripStates.png') !important;
}


/*Custom code for second level menu navigation*/

.nav_div .fa {
    width: 20px;
}

.nav_div {
    width: 100%;
}

.nav_wrapper {
    position: fixed;
    right: 0;
    top: 37px;
    background: transparent;
}

.menu-link {
    display: none;
}

.spinner-master input[type=checkbox] {
    display: none;
}

.menu {
    width: 100%;
    height: auto;
    background: #2f3b3f;
}

    .menu ul {
        padding: 0px;
        margin: 0px;
        float: right;
        list-style: none;
        position: relative;
        display: inline-block;
    }

    .menu > li > ul.sub_menu {
        min-width: 10em;
        padding: 4px 0;
        background-color: #f4f4f4;
        border: 1px solid #fff;
    }

    .menu ul li {
        padding: 0px;
    }

    .menu > ul > li {
        display: inline-block;
    }

    .menu ul li a {
        display: block;
        text-decoration: none;
        color: #fff;
        font-size: 14px;
        text-transform: uppercase;
    }

        .menu ul li a:hover {
            margin-top: -1px;
            border-top: 1px solid rgb(255, 102, 0);
            color: #fff;
        }

    .menu ul li > a {
        padding: 6px;
    }

.active, .top-active {
    background-color: #497993;
    border-top: 1px solid #f60;
    color: #FFF;
    margin-top: -1px;
}
.formio-dialog .active {
    background-color: inherit;
    border: none;
    color: inherit;
    margin-top: 0px;
}

.menu ul ul {
    display: none;
    position: absolute;
    top: 100%;
    min-width: 160px;
    background: #39484d;
}

.menu ul li:hover > ul {
    display: block;
}

.menu ul ul > li {
    position: relative;
}

    .menu ul ul > li a {
        padding: 10px 15px;
        height: auto;
        background: #39484d;
    }

        .menu ul ul > li a:hover {
            background: #efa666;
            color: #fff;
        }

.menu ul ul ul {
    position: absolute;
    left: 100%;
    top: 0;
}

@media all and (max-width: 1024px) {
    .nav_wrapper {
        right: 33px;
    }

    .menu ul li a .fa {
        font-size: 20px;
    }

    .menu ul li span {
        margin-left: 10px;
    }

    .menu ul li a {
        padding: 10px;
    }

        .menu ul li a:hover {
            border-top: none;
            margin-top: 0px;
        }

    .active {
        border-top: none;
        color: #FFF;
        background-color: #f60;
    }

    .nav_wrapper {
        top: 65px;
    }

    .example-header .container {
        width: 100%;
    }

    .spinner-master * {
        transition: all 0.5s;
        box-sizing: border-box;
    }

    .spinner-master {
        position: relative;
        margin-right: -2px;
        height: 30px;
        width: 30px;
        float: right;
        z-index: 1;
    }

        .spinner-master label {
            cursor: pointer;
            position: absolute;
            z-index: 99;
            height: 100%;
            width: 100%;
            top: 5px;
            left: 0;
        }

        .spinner-master .spinner {
            position: absolute;
            height: 4px;
            width: 100%;
            padding: 0;
            background-color: #fff;
        }

        .spinner-master .diagonal.part-1 {
            position: relative;
            float: left;
        }

        .spinner-master .horizontal {
            position: relative;
            float: left;
            margin-top: 4px;
        }

        .spinner-master .diagonal.part-2 {
            position: relative;
            float: right;
            margin-top: 4px;
        }

    a.menu-link {
        display: block;
        color: #fff;
        float: left;
        text-decoration: none;
        padding: 10px 16px;
        font-size: 1.5em;
    }

        a.menu-link:hover {
            color: #719AB0;
        }

        a.menu-link:after {
            content: "\2630";
            font-weight: normal;
        }

        a.menu-link.active:after {
            content: "\2715";
        }

    .menu {
        clear: both;
        min-width: inherit;
    }

        .menu,
        .menu > ul ul {
            overflow: hidden;
            max-height: 0;
            background-color: #3F6172;
        }

            .menu > li > ul.sub-menu {
                padding: 0px;
                border: none;
            }

            .menu.active, .menu > ul ul.active {
                max-height: 55em;
                width: 100%;
                float: right;
                border-top: none;
                padding: 10px;
            }

            .menu ul {
                display: inline;
                width: 100%;
                text-align: left;
            }

            .menu li,
            .menu > ul > li {
                display: block;
            }

                .menu li a {
                    color: #fff;
                    display: block;
                    padding: 0.8em;
                    position: relative;
                }

                .menu li.has-submenu > a:after {
                    content: '+';
                    position: absolute;
                    top: 0;
                    right: 0;
                    display: block;
                    font-size: 1.5em;
                    padding: 0.55em 0.5em;
                }

                .menu li.has-submenu > a.active:after {
                    content: "-";
                }

            .menu ul ul > li a {
                background-color: #39484d;
                padding: 10px 18px 10px 30px;
            }


            .menu ul li.hover > a {
                background: #719AB0;
                color: #fff;
            }

            .menu ul ul,
            .menu ul ul ul {
                display: inherit;
                position: relative;
                left: auto;
                top: auto;
                border: none;
            }
}

/*All Pages Floating Left Navigation Menu CSS Master*/

.accordion {
    text-transform: uppercase;
    padding: 0;
    width: 100%;
    max-width: 360px;
    margin: 3em auto 2em;
    background: #3F6172;
    list-style-type: none;
}

    .accordion .link {
        font-weight: 500;
        letter-spacing: 0.8px;
        color: #FFF;
        cursor: pointer;
        padding: 7px 0px 7px 2.5em;
        border-bottom: 1px solid #3F6172;
        display: block;
        position: relative;
        -webkit-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -moz-transition: all 0.4s ease;
        -o-transition: all 0.4s ease;
        transition: all 0.4s ease;
        font-size: 13px;
    }

        .accordion .link:hover {
            background: #719AB0 none repeat scroll 0% 0%;
            color: #FFF;
        }

    .accordion li:last-child .link {
        border-bottom: 0;
    }

    .accordion li {
        list-style-type: none;
    }

        .accordion li i {
            position: absolute;
            top: 8px;
            left: 14px;
            color: #FFF;
            transition: all 0.4s ease 0s;
            font-size: 14px;
        }

            .accordion li i.fa-angle-down {
                right: 12px;
                left: auto;
                font-size: 15px;
                top: 6px;
            }

        .accordion li.open .link {
            color: #fff;
        }

        .accordion li.open i {
            color: #fff;
        }

            .accordion li.open i.fa-angle-down {
                -webkit-transform: rotate(180deg);
                -moz-transform: rotate(180deg);
                -ms-transform: rotate(180deg);
                -o-transform: rotate(180deg);
                transform: rotate(180deg);
            }

/**=======================
* Submenu
==========================**/
.submenu {
    padding: 0;
    display: none;
    background: #497993;
    font-size: 0.95em;
    margin: 0px;
}

.actv {
    display: block;
}

/*.submenu li {
    border-bottom: 1px solid #449FCC;
}*/

.submenu li:hover {
    /*border-top: 1px solid #3F6172;*/
}

.submenu a {
    display: block;
    text-decoration: none;
    color: #d9d9d9;
    padding: 12px;
    padding-left: 3.5em;
    -webkit-transition: all 0.25 ease;
    -moz-transition: all 0.25 ease;
    -o-transition: all 0.25 ease;
    transition: all 0.25 ease;
}

    .submenu a:hover {
        background: #719AB0 none repeat scroll 0% 0%;
        color: #FFF;
        border-right: 5px solid #F60;
    }

.none {
    border: none !important;
}

.inner {
    margin-left: 20px;
}

i {
    -webkit-transition: all 300ms ease-in 0s;
    -moz-transition: all 300ms ease-in 0s;
    -o-transition: all 300ms ease-in 0s;
    transition: all 300ms ease-in 0s;
}

.acc {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif !important;
    color: white !important;
    text-align: left !important;
    text-decoration: none !important;
    font-size: 12px !important;
    line-height: 25px !important;
    display: block !important;
    padding: 0 15px !important;
    letter-spacing: 0.5px;
}

.top_gap {
    padding-top: 97px !important;
    padding-bottom: 2em !important;
}

.top_gap5 {
    padding-top: 5em !important;
    padding-bottom: 2em !important;
    padding-left: 2em !important;
}

.top_gap7 {
    padding-top: 7em !important;
}

.top_gap8 {
    padding-top: 8em !important;
}

.top_gap9 {
    padding-top: 9em !important;
}

.top_gap10em {
    padding-top: 10em !important;
}

.top_gap75 {
    padding-top: 7.5em !important;
}

#gap {
    margin: 0 auto;
    position: relative;
    max-width: 260px;
}

.RadComboBox {
    margin-right: 1em;
}

.ui-jqgrid tr.ui-row-ltr td {
    font-family: roboto !important;
    font-size: 13px !important;
}

.movetoOrgView {
    font-weight: 300;
    width: auto !important;
    margin-bottom: 1em;
    background-color: #E7E7E7;
    border: 1px solid #B9B9B9;
    font-size: 13px !important;
    padding: 0px;
    list-style: outside none none;
    text-align: left;
    height: 42px;
}

    .movetoOrgView img {
        margin: 5px;
    }

.rtontent {
    width: 80%;
}

.tour-button {
    -webkit-appearance: none;
    background-color: #FF6600;
    border-style: solid;
    border-width: 0px;
    color: #FFFFFF;
    cursor: pointer;
    height: 23px;
    padding: 2px 15px 3px;
    text-align: center;
    float: right;
    -webkit-appearance: none;
}

    .tour-button:hover {
        background-color: #EB6712;
        border: 0px solid #CCC7C7;
        color: #FFF;
    }


.tabular {
    border-color: #BBB;
    padding: 0;
    margin: 0;
    border-top: 1;
    border-top-style: dotted;
    border-right: 0;
    border-left: 0;
    border-bottom: 0;
    width: 100%;
}

.rowseparator {
    height: 10px;
}

.left {
    float: left;
}

.left_top {
    float: left;
    padding: 17px 0 0 10px;
}

.textBoxLargeCustom {
    width: 92%;
    padding-right: 2px;
    resize: none;
    height: 100px;
}

.textBoxRegularCustom {
    width: 92%;
    padding-right: 2px;
    resize: none;
}

fieldset:hover {
    border: 1px solid #497993;
}

.ui-jqgrid table#NotesHistorylist table#gridServiceEntity tr.jqgrow td {
    white-space: normal !important;
    height: 10px;
    vertical-align: top;
}


.dateClass {
    color: #1C94C4 !important;
    cursor: pointer;
    text-decoration: underline;
}

.lnkHyper {
    text-decoration: none !important;
    color: #333333 !important;
}

.LinkNoUnderLine {
    cursor: pointer;
    color: #1C94C4;
    font-size: 13px;
    text-decoration: none;
}

#ui-datepicker-div .ui-widget {
    font-size: 1.1em;
}

    #ui-datepicker-div .ui-widget .ui-widget {
        font-size: 1em;
    }

    #ui-datepicker-div .ui-widget input, #ui-datepicker-div .ui-widget select, #ui-datepicker-div .ui-widget textarea, #ui-datepicker-div .ui-widget button {
        font-size: 1em;
    }



#ui-datepicker-div .ui-widget-content {
    border: 1px solid #dddddd;
    background: #eeeeee url(images/ui-bg_highlight-soft_100_eeeeee_1x100.png) 50% top repeat-x;
    color: #333333;
}

    #ui-datepicker-div .ui-widget-content a {
        color: #333333;
    }

#ui-datepicker-div .ui-widget-header {
    border: 1px solid #e78f08;
    background: #f6a828 url(images/ui-bg_gloss-wave_35_f6a828_500x100.png) 50% 50% repeat-x;
    color: #ffffff;
    font-weight: 500;
}

.AppProdGrid .rgDataDiv {
    height: auto !important;
}

#ui-datepicker-div .ui-widget-header a {
    color: #ffffff;
}

#ui-datepicker-div .ui-state-default, #ui-datepicker-div .ui-widget-content .ui-state-default, #ui-datepicker-div .ui-widget-header .ui-state-default {
    border: 1px solid #cccccc !important;
    background: #f6f6f6 /* url(images/ui-bg_glass_100_f6f6f6_1x400.png) 50% 50% repeat-x */ !important;
    font-weight: bold !important;
    color: #1c94c4 !important;
}

    #ui-datepicker-div .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
        color: #333;
        text-decoration: none !important;
    }

#ui-datepicker-div .ui-state-hover, #ui-datepicker-div .ui-widget-content .ui-state-hover, #ui-datepicker-div .ui-widget-header .ui-state-hover, #ui-datepicker-div .ui-state-focus, #ui-datepicker-div .ui-widget-content .ui-state-focus, #ui-datepicker-div .ui-widget-header .ui-state-focus {
    border: 1px solid #fbcb09 !important;
    background: #fdf5ce 50% 50% repeat-x !important;
    font-weight: normal;
    color: #c77405 !important;
}

    #ui-datepicker-div .ui-state-hover a, #ui-datepicker-div .ui-state-hover a:hover {
        color: #c77405 !important;
        text-decoration: none !important;
    }

#ui-datepicker-div .ui-state-default, #ui-datepicker-div .ui-widget-content .ui-state-default, #ui-datepicker-div .ui-widget-header .ui-state-default {
    border: 1px solid #cccccc !important;
    background: #f6f6f6 /*url(images/ui-bg_glass_100_f6f6f6_1x400.png) 50% 50% repeat-x*/ !important;
    font-weight: normal;
    color: #1c94c4 !important;
}


#ui-datepicker-div .ui-state-active, #ui-datepicker-div .ui-widget-content .ui-state-active, #ui-datepicker-div .ui-widget-header .ui-state-active {
    border: 1px solid #fbd850 !important;
    background: #ffffff /*url(images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x*/ !important;
    font-weight: normal;
    color: #eb8f00 !important;
}

#ui-datepicker-div .ui-state-highlight, #ui-datepicker-div .ui-widget-content .ui-state-highlight, #ui-datepicker-div .ui-widget-header .ui-state-highlight {
    border: 1px solid #fed22f;
    background: #ffe45c url(images/ui-bg_highlight-soft_75_ffe45c_1x100.png) 50% top repeat-x;
    color: #363636;
}

#ui-datepicker-div .ui-state-active a, #ui-datepicker-div .ui-state-active a:link, .ui-state-active a:visited {
    color: #eb8f00 !important;
    text-decoration: none !important;
}

#ui-datepicker-div .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {
    border: 1px solid #cd0a0a;
    background: #b81900 /*url(images/ui-bg_diagonals-thick_18_b81900_40x40.png) 50% 50% repeat*/;
    color: #ffffff;
}

#ui-datepicker-div .ui-widget:active {
    outline: none !important;
}

#ui-datepicker-div .ui-state-highlight a, #ui-datepicker-div .ui-widget-content .ui-state-highlight a, #ui-datepicker-div .ui-widget-header .ui-state-highlight a {
    color: #363636;
}

#ui-datepicker-div .ui-state-error a, #ui-datepicker-div .ui-widget-content .ui-state-error a, #ui-datepicker-div .ui-widget-header .ui-state-error a {
    color: #ffffff;
}

#ui-datepicker-div .ui-state-error-text, #ui-datepicker-div .ui-widget-content .ui-state-error-text, #ui-datepicker-div .ui-widget-header .ui-state-error-text {
    color: #ffffff;
}

#ui-datepicker-div .ui-priority-primary, #ui-datepicker-div .ui-widget-content .ui-priority-primary, #ui-datepicker-div .ui-widget-header .ui-priority-primary {
    font-weight: normal;
}

#ui-datepicker-div .ui-priority-secondary, #ui-datepicker-div .ui-widget-content .ui-priority-secondary, #ui-datepicker-div .ui-widget-header .ui-priority-secondary {
    opacity: .7;
    filter: Alpha(Opacity=70);
    font-weight: normal;
}

#ui-datepicker-div .ui-state-disabled, #ui-datepicker-div .ui-widget-content .ui-state-disabled, #ui-datepicker-div .ui-widget-header .ui-state-disabled {
    opacity: .35;
    filter: Alpha(Opacity=35);
    background-image: none;
}

.edit-box-container {
    border-radius: 10px;
    box-shadow: 1px 1px 5px 0 #BBBBBB;
    float: left;
    line-height: 1.3;
    margin-left: 20px !important;
}

.RadGrid_Default .rgFooterDiv, .RadGrid_Default .rgFooter {
    background: #fff !important;
}

.RadMenu_Default, .RadMenu_Default a.rmLink {
    font: 12px/23px "roboto",Arial,sans-serif !important;
}

.rmRootGroup {
    background-image: none !important;
}

#gview_AppointmentProducts > .ui-jqgrid-bdiv {
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 130px;
    min-height: 130px;
}

html body .RadInput_Default .riTextBox, html body .RadInputMgr_Default {
    height: 24px;
    border-color: #CCC !important;
}


/*input button currency style*/
.column10 {
    width: 10%;
    margin: 0 0.6em 0 0;
    display: inline-block;
}

#noAnnouncement .zen_labelHeading, #divCommon .zen_labelHeading {
    text-align: left;
}

#noAnnouncement p {
    display: inline-block;
    width: initial;
    font-size: 14px;
}

.input-group {
    position: relative;
    display: table;
    top: 5px;
    border-collapse: separate;
}

.input-group-addon {
    padding: 0px 3px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #000;
    text-align: center;
    background-color: #eee;
    vertical-align: middle;
    border-top: 1px solid #BDBDBD;
    border-bottom: 1px solid #BDBDBD;
    border-left: 1px solid #BDBDBD;
}

.input-group .form-control, .input-group-addon {
    display: table-cell;
}

.input-group .form-control {
    position: relative;
    z-index: 1;
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.form-control {
    display: block;
    width: 100%;
    height: 23px;
    padding: 0px 3px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #000;
    background-color: #fff;
    border: 1px solid #BDBDBD;
}

/*-------------------------------------------------------------------*/


/*Custom Drop Down Settings*/
.fa-pencil-square-o, .fa-search {
    font-size: 24px !important;
    color: #497993;
}


.rtcontent {
    padding: 0 0 0 2%;
    width: 78%;
    float: right;
}

.rtcontent1 {
    padding: 0 0 0 2%;
    width: 78%;
    float: right;
}

.new {
    color: #497993;
    font-size: 20px !important;
}

.divInnerTable {
    width: 98%;
    margin: 2% 1% 0 1% !important;
}

fieldset, .mainDivCustomData {
    margin-top: 1% !important;
    border: none !important;
}

    .mainDivCustomData: hover {
        border: none !important;
    }

.ui-accordion .ui-accordion-content {
    border-color: -moz-use-text-color #CCC7C7 #CCC7C7;
}


.ui-draggable .ui-dialog-titlebar {
    padding: 0 !important;
    height: 25px;
}

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

.ui-dialog .ui-dialog-title {
    margin: 3px 16px 0.2em 10px !important;
    text-transform: uppercase;
}


.RadGrid input[type="image"] {
    padding-left: 20px !important;
}


.cust {
    padding: 5px 35px !important;
}

.TabbedPanelsTab {
    border: 1px solid #bdbdbd !important;
    padding: 5px 5px !important;
}

.ui-autocomplete {
    border: 1px solid rgb(204, 199, 199) !important;
}



.rcbSubGroupHeading {
    color: #333;
    opacity: 1 !important;
    text-transform: uppercase;
    font-size: 13px !important;
    font-weight: 400;
    background-color: #EDEDED !important;
}

.rcbSeparator {
    color: #333 !important;
    font-size: 14px !important;
    text-transform: uppercase;
    font-weight: 500;
    background-color: #E0E0E0 !important;
}

#bottomStats {
    cursor: default !important;
    border: none;
}

#cke_1_contents {
    min-height: 500px !important;
}

.Reopen_Invoice {
    height: 30px;
    font-weight: 300;
    width: 650px;
    margin-bottom: 1em;
    background-color: #E7E7E7;
    border: 1px solid #B9B9B9;
    font-size: 13px !important;
}

    .Reopen_Invoice p {
        margin: -22px 0px 0px 35px;
    }

    .Reopen_Invoice img {
        width: 20px;
        height: 20px;
    }

.chrome-v3 .global-nav .util LI {
    display: inline-block !important;
}


.ui-jqgrid tr.jqgrow td {
    white-space: pre-wrap !important;
}

.size {
    max-width: 50%;
    float: right;
    margin: 0 10px 3px 0 !important;
    font-family: Roboto;
}

.RadGrid_Default {
    font-family: 'Roboto',Arial,Helvetica,Verdana,sans-serif !important;
}


/*Custom style form dropdown*/


.dropdownn {
    width: 150px;
    height: 29px;
}

.submenuu {
    background: #fff;
    position: relative;
    top: -7px;
    z-index: 1;
    width: 140px;
    display: none;
    margin: 6px 0;
    padding: 0;
    border: 1px solid #BEC3C7;
    left: 0px;
}

    .submenuu ul li input {
        font-size: 12px;
        background-color: white;
        width: 100%;
        text-align: left;
        padding: 5px;
        border-top: none;
        border-left: none;
        border-right: none;
    }

    .submenuu ul li span {
        font-size: 12px;
        background-color: white;
        width: 100%;
        color: #000;
        text-align: left;
        padding: 3px 53px 5px 4px;
        border-top: none;
        border-left: none;
        border-right: none;
        line-height: 30px;
    }

    .submenuu ul li input:last-child {
        border-bottom: none;
    }

    .submenuu ul li input:hover {
        background-color: #EB6712;
        color: white;
        cursor: pointer;
    }

    .submenuu ul li span:hover {
        background-color: #EB6712;
        color: white;
        cursor: pointer;
    }

a.account {
    color: #000;
    padding: 0px 0 0px 5px;
    background: #fff url(../../../../Common/Images/Icons/drop-chevron.png) 95% 50% no-repeat;
    cursor: pointer;
    background-size: 10px;
    border: 1px solid #BEC3C7;
    width: 135px;
    display: inline-block;
    height: 23px;
    margin: 3px 4px 0 0;
    line-height: 22px;
}

.rotate-arrow {
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.root {
    list-style: none;
    margin: -4px 0 0 0;
    padding: 0px;
}

/*Toggle Switch for Radio Button*/

.onoffswitch {
    margin: 5px;
    position: relative;
    width: 49px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #999;
    border-radius: 3px;
}

.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}

    .onoffswitch-inner::before, .onoffswitch-inner::after {
        display: block;
        float: left;
        width: 50%;
        height: 21px;
        padding: 0px;
        line-height: 21px;
        font-size: 13px;
        color: #FFF;
        font-family: roboto;
        font-weight: 400;
        box-sizing: border-box;
        border: 0px solid transparent;
        background-clip: padding-box;
    }

    .onoffswitch-pos-inner:before {
        content: attr(data-contentOn);
        padding-left: 6px;
        background-color: #4cda64;
        color: #FFFFFF;
    }

    .onoffswitch-pos-inner:after {
        content: attr(data-contentOff);
        padding-right: 4px;
        background-color: #f7f7f7;
        color: #878787;
        text-align: right;
    }

    .onoffswitch-inner:before {
        content: "ON";
        padding-left: 6px;
        background-color: #4cda64;
        color: #FFFFFF;
    }

    .onoffswitch-inner:after {
        content: "OFF";
        padding-right: 4px;
        background-color: #f7f7f7;
        color: #878787;
        text-align: right;
    }

.onoffswitch-switch {
    border-radius: 3px;
    display: block;
    width: 18px;
    margin: 0px;
    background: #999;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 32px;
    transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}
#sw-check{
  display:none;
}
#switch-selector1{
  background:#fe6c00;
  margin:1px;
  height:18px;
  width:50%;
  position:absolute;
  left:0px;
  border-radius: 9px;

}
.sw-active, .sw-inactive{
  position:absolute;
  line-height:24px;
  text-shadow:0px 0px 3px rgba(255,255,255,0.4);
  
}
.sw{color:black;}
.sw-active{
  left:12px;
}
.sw-inactive{
  right:20px;

}
.sw-deactivated{
  color:white;
   text-shadow:0px 0px 1px rgba(0,0,0,0.2);
}
.container1{

  width:140px;
  height:26px;
  position:relative;
  line-height:1rem;
  display:block;
}
.switch-container1{
  font-family:verdana;
  width:80px;
  height:20px;
  font-size:0.8rem;
  background:#ffffff;
  position:relative;
  line-height:1rem;
  border:2px solid #ababab;
  border-radius:13px;
  cursor:pointer;
  cursor:hand;
  display:block;
  margin:0 auto;
}
.required::after {
    color: #E32;
    content: "*";
    padding: 4px 0 0 4px;
}

.inner_tabbed_panel {
    padding: 30px !important;
}


.divInTextLabelWrapper {
    height: 30px;
    padding-bottom: 5px;
}

.inTextRightLabel {
    position: absolute;
    right: 0px;
    top: 0px;
    background-color: #e7e7e7;
    border: 1px solid #cccccc;
    font-weight: normal;
    height: 22px;
    line-height: 1.8;
    padding-left: 0;
    padding-top: 1px;
    text-align: center;
    width: 20px;
}

.divInTextRightLabel {
    position: relative;
    width: auto;
}

    .divInTextRightLabel > input[type='text'] {
        padding-right: 25px;
    }

.inTextLeftLabel {
    background-color: #e7e7e7;
    border: 1px solid #cccccc;
    font-weight: normal;
    padding: 2px 5px 3px 5px;
    text-align: center;
    margin-right: -4px;
}

.label_align {
    float: left;
    line-height: 25px;
}

/*.cke_button__newplugin .cke_button_label,*/
.cke_button__maximize .cke_button_label {
    display: inline !important;
}

.NumHighlighter {
    font-size: 11px;
}

.NameHighliter {
    text-transform: capitalize;
    font-weight: 500;
    word-break: break-all;
}

#divHistory2 {
    max-height: 0px !important;
    overflow-x: initial !important;
    overflow-y: initial !important;
}

#gview_Replylist th div, #gview_listOnlineAppointments th div, #gview_Requestlist th div {
    height: auto;
}

#gbox_Requestlist .ui-jqgrid-resize-mark, #gbox_listOnlineAppointments .ui-jqgrid-resize-mark {
    width: 0;
}

/*Label within Textbox END*/

/*Record Box*/
#imgrecordurl, #spanrecordNote {
    cursor: pointer;
}

#divSwitch {
    z-index: 9999;
    background: white;
    opacity: 0.9;
    cursor: all-scroll;
    height: 50px;
    position: fixed;
    bottom: 15px;
    left: 10px;
    padding: 5px;
    background: none !important;
    border: 0px solid #aaaaaa !important;
}

.switch {
    position: relative;
    display: block;
    vertical-align: top;
    width: 100px;
    height: 30px;
    padding: 3px;
    margin: 0 10px 3px 0;
    background: linear-gradient(to bottom, #eeeeee, #FFFFFF 25px);
    background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF 25px);
    border-radius: 18px;
    box-shadow: inset 0 -1px white, inset 0 1px 1px rgba(0, 0, 0, 0.05);
    cursor: pointer;
}

.switch-input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.switch-label {
    position: relative;
    display: block;
    height: inherit;
    font-size: 10px;
    text-transform: uppercase;
    background: #eceeef;
    border-radius: inherit;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 2px rgba(0, 0, 0, 0.15);
}

    .switch-label:before, .switch-label:after {
        position: absolute;
        top: 50%;
        margin-top: -.5em;
        line-height: 1;
        -webkit-transition: inherit;
        -moz-transition: inherit;
        -o-transition: inherit;
        transition: inherit;
    }

    .switch-label:before {
        content: attr(data-off);
        right: 11px;
        color: #aaaaaa;
        text-shadow: 0 1px rgba(255, 255, 255, 0.5);
    }

    .switch-label:after {
        content: attr(data-on);
        left: 11px;
        color: #FFFFFF;
        text-shadow: 0 1px rgba(0, 0, 0, 0.2);
        opacity: 0;
    }

.switch-input:checked ~ .switch-label {
    background: #E1B42B;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15), inset 0 0 3px rgba(0, 0, 0, 0.2);
}

    .switch-input:checked ~ .switch-label:before {
        opacity: 0;
    }

    .switch-input:checked ~ .switch-label:after {
        opacity: 1;
    }

.switch-handle {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 28px;
    height: 28px;
    background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
    background-image: -webkit-linear-gradient(top, #FFFFFF 40%, #f0f0f0);
    border-radius: 100%;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}

    .switch-handle:before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -6px 0 0 -6px;
        width: 12px;
        height: 12px;
        background: linear-gradient(to bottom, #eeeeee, #FFFFFF);
        background-image: -webkit-linear-gradient(top, #eeeeee, #FFFFFF);
        border-radius: 6px;
        box-shadow: inset 0 1px rgba(0, 0, 0, 0.02);
    }

.switch-input:checked ~ .switch-handle {
    left: 74px;
    background: #777777;
    box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* Transition
========================== */
.switch-label, .switch-handle {
    transition: All 0.3s ease;
    -webkit-transition: All 0.3s ease;
    -moz-transition: All 0.3s ease;
    -o-transition: All 0.3s ease;
}

.switch-flat {
    padding: 0;
    background: #FFF;
    background-image: none;
}

    .switch-flat .switch-label {
        background: #FFF;
        border: solid 2px #eceeef;
        box-shadow: none;
    }

        .switch-flat .switch-label:after {
            color: #0088cc;
        }

    .switch-flat .switch-handle {
        top: 6px;
        left: 6px;
        cursor: pointer;
        background: #dadada;
        width: 22px;
        height: 22px;
        box-shadow: none;
    }

        .switch-flat .switch-handle:before {
            background: #fff;
            border: 2pt solid #eceeef;
            border-radius: 10px;
            margin: -8px 0 0 -8px;
        }

    .switch-flat .switch-input:checked ~ .switch-label {
        background: #FFF;
        border-color: #0088cc;
    }
    /*Animated record button*/
    .switch-flat .switch-input:checked ~ .switch-handle:before {
        left: 11px;
        background: #ff3333;
        box-shadow: none;
        animation: blink-animation 2s steps(2, start) infinite;
        -webkit-animation: blink-animation 2s steps(2, start) infinite;
    }

    .switch-flat .switch-input:not(:checked) ~ .switch-handle:before {
        background: #dadada;
    }

@keyframes blink-animation {
    to {
        visibility: hidden;
    }
}

@-webkit-keyframes blink-animation {
    to {
        visibility: hidden;
    }
}


.plus-img {
    position: relative;
    top: -20px;
    left: 4px;
}


.select-button {
    background: #fff;
    border: 1px solid #b5b5b5;
    margin: 2px 0;
    cursor: pointer;
    font-size: 12px !important;
    color: #333;
}

    .select-button:hover {
        background: #5b97d4;
        color: #fff;
        border: 1px solid #5d88b3;
    }

.cancel-button {
    -webkit-appearance: none;
    font-size: 14px !important;
    color: #fff;
    background-color: #FE6C00;
    cursor: pointer;
    border: 1px solid #fe6c00;
    height: 27px;
    text-align: center !important;
    padding: 4px;
    text-transform: capitalize;
    min-width: 80px;
}

    .cancel-button:hover {
        background-color: #EB6712;
    }

/*Media for all screens starts here*/

@media only screen and (min-width: 1025px) and (max-width: 1280px) {

    .movetoOrgView {
        width: 100%;
    }

    .top_gap {
        padding-top: 113px;
    }
}


@media only screen and (min-width: 480px) and (max-width: 1024px) {

    .Campaign_Name {
        font-size: 1em !important;
    }

    .camptype, .campstatus {
        font-size: 10px;
    }

    .left_column {
        width: 73%;
    }

    a.top-active {
        padding-top: 4px;
    }

    .rtcontent1 {
        width: 76%;
    }

    .rtcontent {
        width: 77% !important;
    }
}

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

    #gap {
        width: 220px;
        padding-left: 30px;
    }

    .accordion {
        margin: 3em 0;
        max-width: 360px;
        width: 85%;
    }
}

@media only screen and (min-width: 1280px) {

    .movetoOrgView {
        width: 100%;
    }

    .top_gap {
        padding-top: 113px;
    }
}

.show {
    display: block !important;
}

.dropdown-content a:hover {
    visibility: visible;
}

.dropbtn {
    color: blue !important;
    cursor: pointer;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

    .dropdown-content a {
        color: black;
        text-decoration: none;
        display: block;
        padding: 12px 16px;
    }

        .dropdown-content a:hover {
            background-color: #f1f1f1;
        }

/* Admin page navigation fix for "img" */
img#fitnessIconUrl {
    width: 19px !important;
    height: 15px !important;
}

.zen-component-container {
    display: table;
    width: 100%;
}

    .zen-component-container .zen-row {
        padding: 5px;
        display: inline-table;
        width: 100%;
    }

    .zen-component-container .zen-footer {
        padding: 5px;
        text-align: center;
    }

    .zen-component-container .zen-column {
        display: table-cell;
        word-break: break-all;
    }

    .zen-component-container .zen-column-30 {
        width: 30%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

    .zen-component-container .zen-column-35 {
        width: 35%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

    .zen-component-container .zen-column-80 {
        width: 80%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

    .zen-component-container .zen-column-70 {
        width: 70%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

    .zen-component-container .zen-column-10 {
        width: 10%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

    /* width defaults */
    .zen-component-container .zen-column-sm {
        width: 20%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

    .zen-component-container .zen-column-md {
        width: 50%;
        padding: 5px;
        display: table-cell;
        word-break: break-all;
    }

.loaderContainer {
    position: fixed;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: rgba(64, 64, 64, 0.5);
    left: 0px;
    top: 0px;
    display: none;
}

    .loaderContainer .innerContainer {
        position: absolute;
        left: 35%;
        top: 30%;
        z-index: 1;
        width: 600px;
        height: 250px;
        border: 1px solid #f3f3f3;
        background-color: white;
    }

        .loaderContainer .innerContainer .loaderText {
            position: relative;
            font-size: x-large;
            font-weight: 600;
            text-align: center;
            padding-top: 10px;
        }

        .loaderContainer .innerContainer .loaderDetailedText {
            position: relative;
            text-align: justify;
            margin: 10px;
        }

        .loaderContainer .innerContainer .loaderNew {
            position: relative;
            z-index: 1;
            border-radius: 50%;
            border-left: 12px solid #FF6C00;
            border-right: 12px solid #515dbf;
            border-top: 12px solid #BEC3C7;
            border-bottom: 12px solid #497993;
            width: 100px;
            height: 100px;
            -webkit-animation: spin 2s linear infinite;
            animation: spin 2s linear infinite;
            margin-left: 37%;
            margin-top: 17px;
        }

/* For touch enabled devices */
@media (pointer: coarse) {
    #divPreferences .mm-main-table .mm-breadcrumb{
        font-size: medium !important;
    }
    .RadGrid_Default .rgPagerCell input {
        margin: 0px 2px !important;
    }
    .RadGrid .rgNumPart{
        margin: 0px 0.5em !important;   
    }
    .RadGrid .rgRow, 
    .RadGrid .rgAltRow, 
    .RadGrid .rgHeader, 
    .RadGrid .rgResizeCol, 
    .RadGrid .rgPager, 
    .RadGrid .rgGroupPanel, 
    .RadGrid .rgGroupHeader,
    .RadGrid_Default .rgRow a, 
    .RadGrid_Default .rgAltRow a, 
    .RadGrid_Default .rgEditRow a, 
    .RadGrid_Default tr.rgEditRow a, 
    .RadGrid_Default tr.rgHoveredRow a, 
    .RadGrid_Default tr.rgActiveRow a, 
    .RadGrid_Default .rgFooter a, 
    .RadGrid_Default .rgEditForm a{
        font-size: 15px !important;
    }
    .ui-datepicker .ui-datepicker-prev span,
    .ui-datepicker .ui-datepicker-next span{
        zoom: 1.3 !important;
    }
    .ui-datepicker td span, .ui-datepicker td a{
        padding: 0.6em !important;
    }
}

.dlgMask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    margin: auto;
    background-image: url(/Common/Images/loading_4.gif);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-color: #f1f1f177;
}

.zPopover{
    position: absolute;
    z-index: 1000;
    display: none;
    padding: 10px;
    margin-top:10px;
    color:initial;
    font-size: 14px;
    line-break: auto;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    letter-spacing: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    white-space: normal;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 5px;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
.zArrow1,.zArrow2{
    position: absolute;
    left: 50%;
    top: -10px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}
.zArrow1{
    border-bottom: 10px solid black;
}
.zArrow2{
    border-bottom: 10px solid white;
}
div.sch-event.sch-event-highlighted{
    box-shadow: 0px 0px 5px 1px red !important;
    opacity: 1 !important;
}
.green-oval {
    border-radius: 50%;
    display: inline-block;
    height: 38px;
    width: 38px;
    background-color: #6FC412;
}
.red-oval {
    border-radius: 50%;
    display: inline-block;
    height: 38px;
    width: 38px;
    background-color: #FF6061;
}
.hollow-oval {
    border-radius: 50%;
    display: inline-block;
    height: 38px;
    width: 38px;
    background-color: #E3E3E3;
}
.black-oval {
    border-radius: 50%;
    display: inline-block;
    height: 38px;
    width: 38px;
    background-color: #000000;
}
.savedCardPaymentProgress {
    height: 15px;
    width: 153px;
    color: #12ACC4;
    font-family: Roboto;
    font-size: 13px;
    line-height: 15px;
    text-align: center;
 }
.blankrow {
    height: 15px !important; 
    background-color: #FFFFFF;
}
.signature-skipped {
    height: 42px;
    width: 79px;
    color: #9D9D9D;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.3px;
    line-height: 21px;
    text-align: center;
}
.step-completed {
    height: 42px;
    width: 148px;
    color: #000000;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.3px;
    line-height: 21px;
    text-align: center;
}
.payment-failed {
    height: 63px;
    width: 140px;
    color: #FF6061;
    font-family: Roboto;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.3px;
    line-height: 21px;
    text-align: center;
}
.collecting-payment-u {
    height: 24px;
    width: 344px;
    color: #000000;
    font-family: Roboto;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    text-align: center;
}
.path-7 {
    box-sizing: border-box;
    height: 10px;
    width: 15px;
    border: 2.82px solid #FFFFFF;
}
.mirrorstatus {
    padding: 2%;
    text-align: Center;
    height: auto;
    width: auto;
    border: 0.5px solid #D5C792;
    background-color: #FFFCE4;
    border-radius: 5px;
}
.ui-dialog{
    max-width: 95%;
}

.pad-top-32px {
    padding-top: 32px;
}

.pad-top-42px {
    padding-top: 42px;
}

html[lang=fr] .onoffswitch,
html[lang=fr-ca] .onoffswitch {
    width: 65px !important;
}

html[lang=fr] .onoffswitch-switch,
html[lang=fr-ca] .onoffswitch-switch {
    right: unset;
}

html[lang=fr] .onoffswitch-inner:before,
html[lang=fr-ca] .onoffswitch-inner:before {
    content: "SUR" !important;
    padding-left: 10px;
}

html[lang=fr] .onoffswitch-inner:after,
html[lang=fr-ca] .onoffswitch-inner:after {
    content: "ARRÊT" !important;
    padding-right: 2.5px;
}