body {
    background-color: #eee;
    /*background-color: #f97514;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='674' height='561.7' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='.1'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/svg%3E");
    background-size: auto auto;
    background-position: center;*/
}

iframe body {
    background-color: #fff;
    background-image: none;
}

.colorpicker {
    margin: 4px 0 0 0px;
}

html .main-header, html .sidebar {
}

html .sidebar {
    border-top-width: 42px;
    border-top-style: solid;
    border-color: #222;
}

html .scroller {
    /*background-color: #fff;*/
}

html .section {
    background-color: #eee;
}

html .sidebar .btn-new-node,
html .help-menu .rmRootGroup {
    color: #f77312;
}

html body .RadInput_MetroTouch input.riFocused,
html body .RadInput_Focused_MetroTouch, html body .RadInput_Metro input.riFocused, html body .RadInput_Focused_Metro {
    border-color: #ff811b;
}

html .container .RadNavigation .rnvHovered .rnvRootLink {
    border-color: #ff811b;
    background: #ff811b;
}

html .container .RadNavigation .rnvSelected .rnvRootLink,
html .container .RadNavigation .rnvExpanded .rnvRootLink {
    border-color: #ec6807;
    background: #ec6807;
}

html .radSkin_BlackMetroTouch .rnvPopup .rnvHovered > .rnvLink, html .radSkin_Metro .rnvPopup .rnvHovered > .rnvLink {
    background-color: #ff811b;
}

html .radSkin_BlackMetroTouch .rnvPopup .rnvSelected > .rnvLink, html .radSkin_Metro .rnvPopup .rnvSelected > .rnvLink {
    background-color: #ec6807;
}

html .mobile .breadcrumb {
    color: #f77312;
}

    html .mobile .breadcrumb .item.expanded {
        background-color: #f77312;
    }

html .mobile .RadMenuPopup_MetroTouch .rmItem.rmSelected, html .mobile .RadMenuPopup_Metro .rmItem.rmSelected {
    color: #ec6807;
}

.mobile .scroller {
    /*overflow: auto;*/
}

#sidepanel {
    float: left;
    background-color: #eee;
    min-width: 270px;
    height: 100%;
    clear: left;
    padding-right: 15px;
    border-right: solid 1px #ddd;
    margin-right: 15px;
}

#contentpanel {
    margin-left: 15px;
    float: left;
    max-width: 60%;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 2px solid #ddd;
    margin: 1em 0;
    padding: 0;
}

.sidebar .rtUL.rtLines {
    padding: 15px 18px 20px 0;
    background-color: rgba(0, 0, 0, 0.1);
}

.sidebar .rtSelected .rtIn {
    background-color: rgba(0,0,0,0.2) !important;
    border-color: rgba(0,0,0,0.1) !important;
}


.main-header {
    /*background-color: #393939;*/
    background-color: #00a0db;
}

.rnvRootGroupWrapper {
    float: right;
    width: 48px;
}

body, body * {
    font-family: 'Lato',Arial,sans-serif !;
}

.secondaryMenu {
    background-color: #fff;
    margin-bottom: 00px;
}

#account-menu {
    width: 84px;
    float: right;
}

    #account-menu span.account {
        float: left;
        cursor: pointer;
    }

.main-header .icon {
    color: #bbb;
    font-size: 1.3em;
}

.RadNavigation .rnvRootGroup {
    background-color: #000;
}

.RadNavigation_MetroTouch .rnvRootLink, .RadNavigation_Metro .rnvRootLink {
    border-color: #000 !important;
}

.RadGrid {
    outline: none;
}

.rnvRootGroupWrapper {
    background-color: #000 !important;
}

.mainlink {
    margin-right: 40px;
    background-color: #393939;
    /*padding: 10px;*/
    border-radius: 2px;
    text-transform: uppercase;
}

.account.menuclick {
    text-transform: uppercase;
}

#account-menu a {
    text-transform: uppercase;
}

.block-1 {
    min-width: 938px;
    margin: 0px 0;
    float: left;
    border: solid 1px #eee;
}

.block-2 {
    width: 448px;
    float: left;
    border: solid 1px #eee;
}

    .block-2:first-child {
        margin-right: 20px;
    }

.block-3 {
    width: 290px;
    max-width: 100% !important;
    float: left;
    border: solid 1px #eee;
}

    .block-3:nth-child(2) {
        margin: 0 20px;
    }

.row {
    margin: 10px 0;
    width: 100%;
    display: inline-block;
    display: inline-flex;
}

.block-1, .block-2, .block-3 {
    padding: 20px;
    background-color: #fff;
    display: block;
}

.block-1, .block-2, .block-3 {
    font-size: 0.95em;
}

body *, p, h1, h2, h3, h4, h5, h6 {
    color: #000;
}

.row h2 {
    background-color: #eee;
    margin: -20px -20px 20px -20px;
    padding: 10px 10px 15px 0px;
    color: #111;
    font-weight: lighter;
}

.row h4 {
    /*margin: -20px -20px -6px 0px;
    padding: 3px 9px 3px 0;*/
    margin: 10px 0;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    color: #fff;
    /*position: relative;
    top: -17px;*/
    text-transform: uppercase;
    color: #393939;
}

.block-1:hover, .block-2:hover, .block-3:hover {
    background-color: #f9f9f9;
}

.row a, html .RadGrid_MetroTouch .rgRow a, html .RadGrid_MetroTouch .rgAltRow a, .secondarymenuarea a, .row a, html .RadGrid_Metro .rgRow a, html .RadGrid_Metro .rgAltRow a, .secondarymenuarea a {
    color: #00a0db;
}

    .row a:hover {
        text-decoration: underline;
    }

.row h6 {
    font-size: 13px;
    color: #6B787F;
    margin: 0.8em 0 0.3em;
}

.standout {
    font-size: 1.5em;
}

p.standout {
    margin: 0.3em 0;
}

.main-header * {
    color: #fff !important;
}

p {
    margin: 0.6em 0;
}

#secondarymenuarea {
    background-color: #fff;
    width: 100%;
    clear: both;
}

    #secondarymenuarea .mainlink {
        display: inline-block;
        height: 40px;
        vertical-align: middle;
        margin: 0 40px;
        padding-top: 20px;
    }

        #secondarymenuarea .mainlink:hover {
            text-decoration: underline;
        }

#notificationarea {
    background-color: #eee;
    width: 100%;
    clear: both;
}

    #notificationarea .notification {
        margin: 0 auto;
        padding: 10px 0;
        text-align: center;
    }

    #notificationarea a, .footer a {
        color: #007cab;
        text-decoration: underline;
    }

html .mobile .page > div {
    min-width: 320px;
}

.mobile html .scroller {
    max-width: 960px;
    min-width: 320px;
}

.mobile .block-1 {
    max-width: 938px;
    min-width: 320px;
    margin: 0px 0;
    float: left;
    border: solid 1px #eee;
    width: 100%;
}

.mobile .block-2 {
    max-width: 448px;
    float: left;
    border: solid 1px #eee;
    width: 50%;
}

.block-2:first-child {
    margin-right: 20px;
}

.mobile .block-3 {
    max-width: 290px;
    float: left;
    border: solid 1px #eee;
    width: 33%
}

    .mobile .block-3:nth-child(2) {
        margin: 0 20px;
    }

html .mobile .scroller {
    max-width: 938px;
    width: 100%;
    min-width: 320px;
}

.footer {
    background-color: #e0e0e0;
    min-height: 30px;
    padding-top: 5px;
    width: 100%;
    text-align: center;
    border-top: solid 1px #d0d2d3;
}

.mobile-mainmenu {
    display: none;
}

@media only screen and (max-width: 750px) {
    .username {
        max-width: 69px;
        overflow: hidden;
        display: inline-block;
        overflow-wrap: break-word;
    }

    .mainlink {
        margin-right: 0;
    }

    .button.red {
        margin: 10px 0 0;
    }

    .row {
        display: inline-block;
        margin: 0 0;
    }

    .mobile .block-1, .mobile .block-2, .mobile .block-3 {
        width: 94% !important;
        clear: both;
        margin: 10px 1% !important;
        padding: 20px 2%;
        min-width: 94%;
    }

    .row h2 {
        background-color: #eee;
        margin: -20px -3% 20px -3%;
        padding: 10px 10px 15px 2%;
        color: #333E48;
    }

    #main-menu {
        width: 100%;
        clear: both;
        display: none;
    }

    .mobile-mainmenu {
        display: block;
    }

    #main-menu a {
        display: inline-block;
        clear: both;
        text-align: center;
        width: 100%;
        height: 40px;
    }

    .home-btn {
        width: 100%;
    }
}
/*media end*/
.right {
    float: right
}

.button {
    color: white;
    font-weight: bold;
    font-size: 16px;
    padding: 10px;
    display: inline-block;
}

table.report-download, table.active-surveys {
    vertical-align: top;
    width: 100%;
    border-top: solid 1px #ddd;
    margin-top: 20px;
    padding-top: 10px;
}

    table.report-download h3, table.active-surveys h3 {
        margin: 0px 0px;
    }

    table.report-download a:hover {
        text-decoration: none;
    }

    table.report-download .date, table.active-surveys .date {
        font-size: 15px;
        color: #999;
    }

    table.report-download .collector, table.active-surveys .collector {
        font-weight: bold;
        font-size: 1em;
        color: #393939;
    }

    table.report-download:first-of-type, table.active-surveys:first-of-type {
        margin-top: 0px;
        padding-top: 0px;
        border-top: none;
    }

    table.report-download td {
        vertical-align: top;
    }

#main-menu {
    float: left;
    padding-top: 6px;
}

#homelink {
    float: left;
}

.mobile-mainmenu {
    float: left;
    padding-right: 10px;
}

html .RadNavigation .rnvRootLink {
    padding: 0px 7px !important;
}

#accountmenu a {
    display: block;
    vertical-align: middle;
    padding: 10px;
    background-color: #333;
    clear: both;
}

#accountmenu {
    display: none;
    position: absolute;
    margin-top: 36px;
    z-index: 9;
}

a.button, button.primarybutton {
    background-color: #00a0db;
    color: #fff;
}

    button.primarybutton, button.primarybutton * {
        background-color: #00a0db !important;
        color: #fff !important;
        float: right;
        margin-top: 9px;
    }

button.primarybutton {
    float: right;
    margin-top: 9px;
}

a {
    color: #00a0db;
}

#secondarymenuarea a {
    height: 30px;
    color: #444;
    margin-right: 0px;
    display: inline-block;
    vertical-align: middle;
    clear: none;
    padding-top: 20px;
    padding-bottom: 10px;
    margin-left: 20px;
}

input[type=button], input[type=submit], .button {
    background-color: #00a0db;
    background-image: none;
    background-origin: padding-box;
    background-position: 0% 0%;
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-size: auto auto;
    border-bottom-color: rgb(255, 255, 255);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-style: none;
    border-bottom-width: 0px;
    border-image-outset: 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100%;
    border-image-source: none;
    border-image-width: 1;
    border-left-color: rgb(255, 255, 255);
    border-left-style: none;
    border-left-width: 0px;
    border-right-color: rgb(255, 255, 255);
    border-right-style: none;
    border-right-width: 0px;
    border-top-color: rgb(255, 255, 255);
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-top-style: none;
    border-top-width: 0px;
    box-shadow: none;
    box-sizing: border-box;
    color: rgb(255, 255, 255);
    display: inline-block;
    font-family: "Lato";
    font-size: 16px;
    font-weight: 500;
    height: 55px;
    letter-spacing: 0px;
    line-height: 58px;
    min-width: 200px;
    overflow-wrap: break-word;
    padding-bottom: 0px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 0px;
    text-align: center;
    text-decoration: none;
    text-decoration-color: rgb(255, 255, 255);
    text-decoration-line: none;
    text-decoration-style: solid;
    text-transform: capitalize;
    transition-delay: 0s;
    transition-duration: 0.5s;
    transition-property: all;
    cursor: pointer;
}

.failureNotification ul {
    border: solid 1px #ccc;
    padding: 10px 10px 10px 38px;
    background-color: #ffd8d8;
}

.required {
    color: #393939;
    margin-left: 2px;
    font-size: 19px;
}

/*input[type=text], input[type=password], input[type=number], select {
    border: rgb(239, 239, 239);
    border: solid 1px #ddd;
    box-sizing: border-box;
    color: rgb(132, 132, 132);
    height: 50px;
    letter-spacing: normal;
    line-height: 50px;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    outline-color: rgb(132, 132, 132);
    outline-style: none;
    outline-width: 0px;
    overflow-wrap: break-word;
    padding-bottom: 0px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 0px;
    text-align: start;
    transition-delay: 0s;
    transition-duration: 0.5s;
    transition-property: border;
}*/

.accountInfo label, .registrationbox label {
    min-width: 140px;
    display: inline-block;
}

.accountInfo input[type=password], .accountInfo input[type=text], .registrationbox input, .registrationbox select, registrationbox {
    width: 96%;
}


h3 {
    font-size: 16px;
}

.lgnBtn {
    margin-top: 10px;
}

.editroles {
}

.highlightbackground {
    display: inline-block;
    border-radius: 3px;
    padding: 10px;
    border: solid 1px #ccc;
    padding: 10px 10px 10px 38px;
    background-color: #ddd;
}

.hiddenText label {
    display: none;
}

.rgEditFormContainer {
    padding: 10px;
}

.RadGrid_MetroTouch .rgEditForm, .RadGrid_Metro .rgEditForm {
    width: auto !important;
}

.infoTable .open {
    background-color: green;
    padding: 0px 3px;
    border-radius: 3px;
    color: #fff;
    font-weight: bold;
}

.infoTable .closed {
    background-color: #00a0db;
    padding: 0px 3px;
    border-radius: 3px;
    color: #fff;
    font-weight: bold;
}

.infoTable .icon:before {
    padding-top: 2px;
    display: inline-block;
}

.checkboxlist.strategy label {
    display: block;
    padding-left: 30px;
    margin-top: -22px;
    padding-bottom: 8px;
    padding-top: 8px;
    cursor: pointer;
}

.checkboxlist.strategy input {
    position: relative;
    top: 8px;
}

.checkboxlist.strategy td:hover {
    background-color: #ddd;
    border-radius: 3px;
}

.objectiveheader {
    cursor: pointer;
}

.glowing.notification {
    animation: glowing 3000ms infinite;
    font-size: 0.7em;
    background-color: #393939;
    color: #fff;
}

.SetObjectiveLabel {
    display: none;
    color: #393939;
    font-size: 0.8em;
}

@keyframes glowing {
    0% {
        box-shadow: 0 0 -5px #393939;
    }

    40% {
        box-shadow: 0 0 10px #393939;
    }

    60% {
        box-shadow: 0 0 10px #393939;
    }

    100% {
        box-shadow: 0 0 -5px #393939;
    }
}

.savebutton, .lsavebutton {
    display: inline-block;
    border: solid 1px #ccc;
    padding: 5px;
    margin: 5px;
    clear: both;
}

.circle {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
}

.impersonated {
    background-color: #00a0db;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    padding: 2px;
    border-radius: 3px;
}

.accepttermsandconditions input:checked + label {
    font-weight: normal;
}

.accepttermsandconditions {
    font-weight: bold;
}

.DDLightHeader {
    vertical-align: top;
}

.LeadQuestionPanel {
    clear: both;
}

.LeadQuestionText span {
    font-size: 22px;
    font-weight: normal;
    margin-top: 27px;
    display: inline-block;
}

.LeadQuestion {
    width: 275px;
    float: left;
    padding: 5px;
    margin: 3px;
    /*border: dashed 1px gray;*/
    border-radius: 3px;
    background-color: #dedede;
}

    .LeadQuestion label {
        width: 248px;
        display: inline-block;
    }

    .LeadQuestion h3 {
        margin-top: 5px;
    }

.LeadQuestionPanelEx {
    cursor: pointer;
}

a.button.surveylink {
    background-color: #393939;
}

a.button.lsavebutton, a.button.savebutton {
    padding: 0px;
}

.LeadQuestionTD h1 {
    cursor: pointer;
}

.noreports {
    background-color: #eee;
    border-radius: 3px;
    padding: 9px;
    display: inline-block;
}

span.ss::before {
    padding-top: 0px !important;
}

.active-surveys h2, .activedownloads h2 {
    color: #393939;
    font-weight: bold;
    text-transform: uppercase;
}

.objectiveinstructions {
    padding: 15px;
    border-radius: 3px;
    background-color: #eee;
}

.checkboxlist.strategy td {
    border-bottom: solid 1px #dedede;
    padding: 8px 0;
}

.LeadQuestionPanel h3 {
    font-weight: normal;
}

.smaller {
    font-size: 0.8em;
}

.LeadinRadio {
    width: 100%;
    margin-bottom: 35px;
}

    .LeadinRadio table {
        width: 100%
    }

        .LeadinRadio table tr {
            display: flex;
            float: left;
        }

            .LeadinRadio table tr label {
                display: none;
            }

            .LeadinRadio table tr input {
                margin: 0 auto;
                display: block;
                padding: 20px 0;
            }

    .LeadinRadio.leadin2 td {
        width: 175px;
    }

    .LeadinRadio td {
        width: 110px;
        text-align: center;
        padding: 10px 0;
    }

.rwTitleBar {
    background-color: #393939 !important;
}

    .rwTitleBar * {
        color: #fff !important;
    }

.RadWindow_MetroTouch .rwDialogButtons button, .RadWindow_Metro .rwDialogButtons button {
    border-color: #e0e0e0 !important;
    color: #fff !important;
    background-color: #00a0db !important;
    cursor: pointer;
}

.LeadQuestionPanel h3 {
    margin: 30px 0px !important;
}

.LeadQuestionPanel p {
    margin: 20px 0;
}

.row a.delete, html .RadGrid_MetroTouch .rgRow a.delete, html .RadGrid_MetroTouch .rgAltRow a.delete, .row a.delete, html .RadGrid_Metro .rgRow a.delete, html .RadGrid_Metro .rgAltRow a.delete {
    color: red;
}

.DisabledRow1 {
    background-color: lightpink;
}

    .DisabledRow1 * {
        border-color: lightpink !important
    }

.leadinq {
    font-weight: bold;
}

.LeadQuestionText h3 {
    text-transform: uppercase;
}

.downloadbox {
    width: 320px;
}

.resetpassword {
    color: orangered !important;
}

#invitePanelInput {
    display: none !important;
}

.registrationsection {
    padding-top: 36px;
}

.registrationheader {
    margin-bottom: 10px !important;
}

.registerrequiredheader {
    text-align: right;
    font-size: 0.7em;
    margin: 0px !important;
}

.registrationdescription {
    max-width: 96% !important;
    height: 350px !important;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}


.deletebutton:before {
    color: red !important;
}

.deletebutton {
    color: red !important;
}

    .deletebutton::before {
        color: red !important;
    }

.savebutton {
    color: black !important;
}

.genericBlackbutton {
    color: black !important;
}


.editbutton {
    color: black !important;
}

.GeoFenceWindowDesign {
    z-index: 900 !important;
}

.RadWindow.rwInactiveWindow {
    z-index: 3000 !important;
}

.RadAjax {
    z-index: 2 !important;
}

.gridTimeTracker, .timertext {
    font-size: 12px;
    color: #999 !important;
    font-family: Arial,sans-serif;
}

.agentstatus.Accepted {
    background-color: aquamarine;
}

.agentstatus.Declined {
    color: red;
}

.agentstatus.Added {
    color: black;
}

.agentstatus.Cancelled {
    color: orange;
}

.agentgrid .infortd {
    display: block;
    float: left;
    padding: 0px 5px 0 5px !important;
    margin: 0px;
    height: 1.2em;
}

.agentgrid {
    padding-bottom: 20px;
}

    .agentgrid .infortd.surname {
        clear: right;
        font-weight: bold;
        padding-left: 0px !important;
        font-size: 13px;
    }

    .agentgrid .infortd.firstname {
        font-weight: bold;
        font-size: 13px;
    }

    .agentgrid .infortd.geoservice {
        clear: left;
        font-size: 21px;
        padding-bottom: 6px !important;
    }

    .agentgrid .infortd.startdate {
        clear: left;
        position: relative;
        font-size: 0.7em;
    }

    .agentgrid .infortd.response {
        width: 230px;
    }

        .agentgrid .infortd.response:before {
            content: "\f441";
            font-family: 'Font Awesome 5 Free';
            font-weight: 900;
            padding-right: 2px;
            font-size: 0.8em;
            color: #016330;
        }

    .agentgrid .infortd.distance:before {
        content: "\f70c";
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        padding-right: 0px;
        font-size: 0.8em;
        color: royalblue;
    }

    .agentgrid .infortd.response {
        width: 100%;
        padding-top: 1px !important;
        padding-bottom: 3px !important;
    }

        .agentgrid .infortd.response > span {
            border: solid 1px #016330;
            padding: 0px 3px 1px;
            border-radius: 5px;
            color: #016330;
            font-weight: bold;
        }

        .agentgrid .infortd.response * {
            color: #016330;
        }

        .agentgrid .infortd.response > span br {
            display: none;
        }

    .agentgrid thead {
        display: none;
    }

    .agentgrid > table, .mobileready > table {
        width: 360px !important;
    }

    .agentgrid .clickbutton, .mobileready .clickbutton {
        font-size: 50px;
        padding: 0 17px 0 16px !important
    }

    .agentgrid .comment, .agentgrid .chat, .agentgrid .assigned {
        display: none;
    }

    .agentgrid .infortd.distance span {
        border: solid 1px royalblue;
        padding: 0px 3px 1px;
        border-radius: 5px;
        color: royalblue;
        font-weight: bold;
    }

    .agentgrid .infortd.distance {
        top: 22px;
        position: relative;
        left: 28px;
    }

iframe {
    border: solid 1px #fff;
}

.agent-information {
    float: left;
    width: 32%;
    margin-right: 1%;
}

.KnightList {
    position: relative;
    top: 50%;
    transform: translateY(-100%);
}

.ping.pending span.genericBlackbutton {
    color: orange !important;
}

.checkinLables {
    min-width: 225px;
    margin-bottom: 5px;
}

.Skip {
    display: inline-block;
}

.Submit {
    display: inline-block;
}

.Back {
    display: inline-block;
}

.backButton {
    display: inline-block;
}

.skipButton {
    display: inline-block;
}

.submitButton {
    display: inline-block;
}

.imageContainer {
    max-width: 550px;
}

.rgSelectedRow {
    background-color: #25a0da !important;
}

.details.fas:before {
    padding: 10px;
}

.payoutbutton.dollar {
    margin-left: 5px;
}

@keyframes highlight {
    0% {
        background-color: darkgreen;
    }

    100% {
        background: #e77051;
    }
}

.highlight {
    animation: highlight 3s;
}


/*Triggers*/
.triggerWizard {
    margin-top: 5px;
}

.triggerNext {
    display: inline-block;
    float: right;
    height: 20px;
    margin: 2px 2px 2px 2px;
}

.triggerSkip {
    display: inline-block;
    height: 20px;
    position: absolute;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%);
    margin: 2px 2px 2px 2px;
}

.triggerBack {
    display: inline-block;
    float: left;
    height: 20px;
    margin: 2px 2px 2px 2px;
}

.triggerEdit {
    max-width: 330px !important;
    height: 380px !important;
}

/*COLORPICKER*/
.triggerFourground {
    height: 200px;
}

.triggerBackground {
    height: 200px;
}

.triggerSubmitButton {
    border-color: #e0e0e0;
    color: #000;
    background-color: #f9f9f9;
    padding: 4px 10px;
    min-width: 64px;
    border-width: 1px;
    border-style: solid;
    position: relative;
    font: inherit;
    line-height: 1.42857143;
    display: inline-block;
    vertical-align: top;
    cursor: pointer;
    outline: 0;
}

#colorPicker {
    width: 30px;
    height: 30px;
    position: relative;
    clear: both;
    margin: 80px auto 20px;
}

    #colorPicker .track {
        background: #EFEFEF url('/Images/text-color.png') no-repeat 50% 50%;
        height: 150px;
        width: 150px;
        padding: 10px;
        position: absolute;
        cursor: crosshair;
        float: left;
        left: -71px;
        top: -71px;
        display: block !important;
        border: 1px solid #ccc;
        z-index: 10;
        -webkit-border-radius: 150px;
        -moz-border-radius: 150px;
        border-radius: 150px;
    }

    #colorPicker .color {
        width: 25px;
        height: 25px;
        padding: 1px;
        border: 1px solid #ccc;
        display: block;
        position: relative;
        z-index: 11;
        background-color: #EFEFEF;
        -webkit-border-radius: 27px;
        -moz-border-radius: 27px;
        border-radius: 27px;
        cursor: pointer;
    }

    #colorPicker .colorInner {
        width: 25px;
        height: 25px;
        -webkit-border-radius: 27px;
        -moz-border-radius: 27px;
        border-radius: 27px;
    }

    #colorPicker .dropdown {
        list-style: none;
        display: none;
        width: 27px;
        position: absolute;
        top: 28px;
        border: 1px solid #ccc;
        left: 0;
        z-index: 1000;
    }

        #colorPicker .dropdown li {
            height: 25px;
            cursor: pointer;
        }

#colorPickerFour {
    width: 30px;
    height: 30px;
    position: relative;
    clear: both;
    margin: 80px auto 20px;
}

    #colorPickerFour .track {
        background: #EFEFEF url(/Images/text-color.png) no-repeat 50% 50%;
        height: 150px;
        width: 150px;
        padding: 10px;
        position: absolute;
        cursor: crosshair;
        float: left;
        left: -71px;
        top: -71px;
        display: block !important;
        border: 1px solid #ccc;
        z-index: 10;
        -webkit-border-radius: 150px;
        -moz-border-radius: 150px;
        border-radius: 150px;
    }

    #colorPickerFour .color {
        width: 25px;
        height: 25px;
        padding: 1px;
        border: 1px solid #ccc;
        display: block;
        position: relative;
        z-index: 11;
        background-color: #EFEFEF;
        -webkit-border-radius: 27px;
        -moz-border-radius: 27px;
        border-radius: 27px;
        cursor: pointer;
    }

    #colorPickerFour .colorInner {
        width: 25px;
        height: 25px;
        -webkit-border-radius: 27px;
        -moz-border-radius: 27px;
        border-radius: 27px;
    }

    #colorPickerFour .dropdown {
        list-style: none;
        display: none;
        width: 27px;
        position: absolute;
        top: 28px;
        border: 1px solid #ccc;
        left: 0;
        z-index: 1000;
    }

        #colorPickerFour .dropdown li {
            height: 25px;
            cursor: pointer;
        }

/*.RadGrid .rgMasterTable, .RadGrid .rgDetailTable, .RadGrid .rgEditForm table {
    border: solid 0px #ccc!important;
    border-collapse: collapse !important;
}

.RadGrid_MetroTouch .rgFilterRow > td {
border:solid 1px #ccc;}*/
.rgMasterTable td {
    border: solid 0px #ccc !important;
}

.RadMenu_Metro .rmRootGroup {
    background-color: transparent !important;
}

.RadMenu_Metro .rmGroup {
    background-color: #00a0db !important;
}

.RadMenu .rmRootGroup.rmHorizontal > .rmItem, .RadMenu .rmRootGroup.rmHorizontal > .rmRootScrollGroup > .rmItem,
.RadMenu .rmGroup, .RadMenu .rmRootGroup, .RadMenu .rmMultiColumn, .RadMenu .rmPopup {
    border-width: 0px !important;
}

.RadMenu_Metro .rmGroup .rmLink:hover, .RadMenu_Metro .rmGroup .rmToggle:hover {
    background-color: #007cab !important;
    color: #fff !important;
    border: solid 1px #007cab !important;
}

.RadMenu_Metro .rmRootGroup .rmSelected > .rmRootLink, .RadMenu_Metro .rmRootGroup .rmExpanded > .rmRootLink {
    background-color: #007cab !important;
}

.percentage::after {
    content: ' %';
}

.shiftDisplayLabel {
    width: 160px !important;
}

.pagesecurity {
    float: right;
    padding: 10px 5px;
}

.RadMenu .rmRootGroup.rmHorizontal > .rmItem:hover, .RadMenu .rmRootGroup .rmRootLink:hover {
    background-color: #007cab !important;
    color: #fff !important;
    border: solid 0px #007cab !important;
}

.shiftConfirmButton {
    height: 60px !important;
    width: 140px !important;
    float: right !important;
}

.RadGrid_Metro .rgEditRow {
    background-image: none !important;
    background-color: rgba(230,230,230,0.75) !important
}

.RadGrid .rgMasterTable {
    border: none !important;
}

.RadMenu .rmGroup .rmLink {
    color: #fff;
}

.hidethis {
    display: none;
}

.rgProductionLines th:nth-child(4) {
    writing-mode: vertical-lr;
    text-orientation: mixed;
}

.rgDowntime th:nth-child(10), .rgDowntime th:nth-child(11), .rgDowntime th:nth-child(12), .rgDowntime th:nth-child(13)
.rgQualityIncident th:nth-child(6), .rgQualityIncident th:nth-child(7), .rgQualityIncident th:nth-child(8), .rgQualityIncident th:nth-child(9), .rgQualityIncident th:nth-child(10), .rgQualityIncident th:nth-child(11), .rgQualityIncident th:nth-child(12), .rgQualityIncident th:nth-child(13) {
    font-size: 0.7em;
}
/*Make grid smaller*/
th.rgHeader {
    width: 25px !important;
}

.RadGrid .rgRow > td, .RadGrid .rgAltRow > td, .RadGrid .rgEditRow > td, .RadGrid .rgFooter > td, .RadGrid .rgFilterRow > td, .RadGrid .rgHeader, .RadGrid .rgResizeCol, .RadGrid .rgGroupHeader td {
    padding-left: 3px !important;
    padding-right: 5px !important;
}

.rgProductionLines.RadGrid .rgRow > td, .rgProductionLines.RadGrid .rgAltRow > td {
    padding-left: 3px !important;
    padding-right: 3px !important;
    text-align: center;
}

.currencyFormat::before {
    content: 'R ';
}

.dashboard .dicon {
    font-size: 85px;
    float: left;
    padding-left: 0px;
    color: green;
    padding-top: 7px;
}

.dashboard .leftcolumn {
    float: left;
    width: 117px;
    /*background-color: #ccc;*/
    margin-top: -20px;
    margin-left: -20px;
    /*padding-top: 20px;*/
    padding-left: 20px;
    margin-bottom: -20px;
}

.dashboard .rightcolumn {
    padding: 10px 10px 10px 20px;
    float: left;
    margin-top: -15px;
    width: 311px;
    margin-right: -20px;
}

.dashboard .block-2.yes .yesEvents {
    display: inline-block;
}

.dashboard .block-2.yes .noEvents {
    display: none;
}

.dashboard .block-2.no .yesEvents {
    display: none;
}

.dashboard .YesNo {
    font-size: 35px;
    color: #eee;
    font-weight: bold;
    text-align: center;
    padding-right: 20px;
}

.dashboard .rightcolumn a {
    color: #333;
    font-weight: bold;
}

    .dashboard .rightcolumn a.aspNetDisabled {
        color: #ccc;
        font-weight: bold;
    }

.dashboard .mayorindicator {
    font-size: 35px;
}

.dashboard .block-2 {
    width: 448px;
    /*height: 172px;*/
    overflow: hidden;
    margin: 20px;
    margin-top: 0px;
}

.row.dashboard {
    display: block;
}

.dashboard .fa, .dashboard .fas:after {
    font-family: 'Font Awesome 5 Free';
}

.dashboard a:after {
    font-family: 'Font Awesome 5 Free';
    content: " \f35d";
    color: #a4c5fb;
    font-weight: 900;
}

.dashboard .headersubscript {
    background-color: orange;
    border-radius: 3px;
    font-size: 15px;
    padding: 3px;
    position: relative;
    float: right;
    top: 9px;
    color: white;
    font-weight: bold;
}

.dashboard .fas:before {
    padding-right: 10px;
}

.RadGrid_Metro .rgRow > td, .RadGrid_Metro .rgEditRow > td, .RadGrid_Metro .rgAltRow > td {
    word-break: break-word;
}

.balanceHeader {
    background-color: #444444;
    color: #FFFFFF;
    font-variant: inherit;
    font-weight: bold;
    padding: 4px 10px;
    text-transform: none;
    width: 200px;
    float: left;
    margin-bottom: 0px;
    font-size: 1em;
    width: auto;
}

#balancemeta {
    font-size: 10px;
    clear: both;
    display: inline-block;
    padding-left: 10px;
    color: #666;
    float: right;
}

#BalanceContainer {
    background-color: transparent !important;
    padding-left: 0px;
    float: right;
}

#BalanceAmount {
    font-size: 20px;
    color: #333;
    padding-top: 4px;
    margin-left: 10px;
    font-weight: normal;
    float: right;
}

.rotate {
    transform: rotate(-180deg);
    color: #aaa !important;
    text-decoration: none !important;
}

a.noDecoration {
    text-decoration: none !important;
}

.buttonSelect {
    cursor: pointer !important;
}

.nextline span, .nextline {
    display: block !important;
}

.padBtm4 {
    padding-bottom: 4px !important;
}

.padTop4 {
    padding-top: 4px !important;
}

.padLeft15 {
    padding-left: 15px !important;
}

.padLeft4 {
    padding-left: 4px !important;
}

.roundBorders5 {
    border-radius: 5px;
}

.blueLink, .blueLink span {
    color: #00a0db !important;
}

.rechargeDisplayLabel {
    display: block !important;
    padding: 10px 5px;
}

.linkbutton {
    border: none !important;
    background-color: transparent !important;
    padding: 0px !important;
}

    .linkbutton span {
        color: #007cab;
        padding: 0px;
        height: auto;
        display: inline-block;
        margin-right: 14px;
    }

        .linkbutton span:hover {
            text-decoration: underline;
        }


.loading {
    background-color: rgba(255,255,255,0.99);
    width: 100%;
    height: 100%;
}

    .loading img {
        vertical-align: middle;
        margin-top: 30px;
    }

.customDeleteButton {
    text-align: center !important;
}

.newAccount {
    text-align: center;
    padding-top: 5px;
}

.display .scroller {
    min-width: 320px;
    width: 98%;
    padding-top: 15px;
    /*margin-left:10px;*/
    /*margin:0px;
display:block*/
}

.display .row {
    /*margin-right:10px;*/
}

.display {
    padding-top: 0px !important;
}

    .display .block-1 {
        min-width: 320px;
    }

html .page.display > div {
    min-width: 320px;
}

.display .block-2 {
    width: 44.7%;
}

.display .block-1 {
    padding: 10px 3%;
    margin: 0px;
    width: 93%;
}

    .display .block-1 h2 {
        margin: -20px -4% 20px -4%;
    }

.cellcsmallicon::before {
    content: url(../Images/cell_c_logo.png);
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    height: 20px;
}

.mtnsmallicon::before {
    content: url(../Images/mtn_logo.png);
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    height: 20px;
}

.telkommobilesmallicon::before {
    content: url(../Images/telkom_mobile_logo.png);
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    height: 20px;
}

.vodacomsmallicon::before {
    content: url(../Images/vodacom_logo.png);
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    height:20px;
}

.HistoryType9::before {
    color: #00a0db !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f274";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align: center;
}



.HistoryType4::before {
    color: red !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f06a";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
}

.HistoryType3::before, .HistoryType2::before, .HistoryType5::before, .HistoryType13::before {
       color: #00a0db !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f651";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align:center;
}
.HistoryType5::before {
color:green!important;}
.HistoryType12::before {
    color: #00a0db !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f46c";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align: center;
    height: 67px;
}

.HistoryType1::before {
    color: #00a0db !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f055";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align: center;
}

.HistoryType11::before {
    color: #00a0db !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f205";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align: center;
}

.HistoryType10::before {
    color: #aaa !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f205";
    padding-left: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align: center;
    transform: rotate(-180deg);
}
.rgMasterTable td span {
max-width:228px;}
.HistoryType7::before {
    color: #00a0db !important;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: xx-large;
    content: "\f044";
    padding-right: 10px;
    opacity: 0.7;
    padding-top: 1px;
    float: left;
    width: 37px;
    text-align: center;
}

.padLeft135{
    padding-left:135px !important;
}

.padLeft165{
    padding-left:165px!important;
}

.textSpace{
    float:left;
}

.valueSpace{
    float:right;
    padding-left: 10px;
}

.reportImage{
   font-size:80px;
   padding-left: 65px;
   padding-bottom: 15px;
}

.reportSelectPanel {
    padding: 10px 10px 10px 50px;
}

.reportConfirmButton {
    width: 200px;
}