*{
    font-family: Roboto,"Helvetica Neue",Arial,sans-serif;
   }
   
body {
    padding-top: 0px;
    background-color: #F5F5F5;
    font-family: Roboto,"Helvetica Neue",Arial,sans-serif !important;
}

html {
    font-family: Roboto,"Helvetica Neue",Arial,sans-serif !important;
}

/*style for menu label*/
.labelFont {
   
    font-family: Roboto,"Helvetica Neue",Arial,sans-serif !important;
    /* font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; */
    font-size: 14px;
    cursor: pointer;
    margin-bottom: 5px;
    font-weight: bold;
}

/* Claim Title bar Icons*/
.titleIcon {
    cursor: pointer !important;
    margin-left: 10px !important;
    font-size: 20px !important;
}

/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-color: #2D323E;
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.1s; /* Transition effect to slide in the sidenav */
}

    /* When you mouse over the navigation links, change their color */
    .sidenav a:hover {
        color: #f1f1f1;
    }

/*Labels on side navigation bar*/
.MenuLabel {
    padding: 8px 8px 8px 10px;
    text-decoration: none;
    font-size: 14px;
    /*font-family: Arial;*/
    color: white;
    display: block;
}

/*List of menus on side navigation*/
ul {
    list-style-type: none;
    padding-left: 0px;
}

/*List item on side navigation var*/
li {
    padding: 0px;
}

/*Content style*/
.contentHeight {
    height: 80vh;
    overflow-y: auto;
    background-color:#e7e7e7;
}

@media (min-width: 1650px) {
    .contentHeight {
        height: 83vh;
        overflow-y: auto;
        background-color:#e7e7e7;
    }
}

.nestedContentHeight {
    height: 70vh;
    overflow-y: auto;
    background-color:#ededed;
}

@media (min-width: 1650px) {
    .nestedContentHeight {
        height: 73vh;
        overflow-y: auto;
        background-color:#ededed;
    }
}

/**Height of Tabstrip*/
.k-tabstrip {
    height: 80vh;
    overflow-y: auto;
}

@media (min-width: 1650px) {
    .k-tabstrip {
        height: 83vh;
        overflow-y: auto;
    }
}

/*The div containing each menu*/
.MenuDiv {
    line-height: 38px;
}

    .MenuDiv:hover {
        background-color: black;
    }

/*hover on the anchor tags of the menu items*/
a:hover {
    text-decoration: none;
}

/*Icons of Menu items*/
.MenuIcon {
    padding-left: 15px;
    font-size: 20px;
    margin-right: 20px;
}

/*Icon of SysAdmin in Menu bar*/
.logo-image {
    display: inline-block;
    /*background: #039BE5;*/
    width: 32px;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: #FFF;
    border-radius: 2px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left .5s;
    padding: 0px 0px 0px 0px;
}

/*Style for the open/close arrow on side nav*/
.sidenav-arrow {
    color: white;
    /*font-size: 20px;
    padding-top: 8px;*/
    font-size: 22px;
    padding-top: 10px;
}

/*Style for the top menu on the side nav*/
.sidenav-top-menu {
    background-color: rgba(255,255,255,.05);
    line-height: 38px;
    padding-left: 20px;
}

/*Style for top horizantal title bar*/
.top-bg {
    background-color: rgb(3,155,229);
    color: rgba(255,255,255,1);
    height: 55px;
}

/*Style for top div title*/
.top-div-title {
    padding-left: 25px;
    padding-right: 35px;
    padding-top: 13px;
    font-size: 20px;
    font-weight: 400;
}

table {
    background-color: white;
    font-size: 13px !important;
}

    table td {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

/*table th {
        padding-left: 14px !important;
        padding-right: 14px !important;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }*/

/*Style to right align a label and centralize vertically*/
.label-right-center {
    text-align: right;
    padding-top: 5px;
}

/*Style for loader div*/
.loader-div {
    width: 100%;
    height: 100%;
    z-index: 100;
    overflow: hidden;
    display: none;
}

.loader {
    border: 10px solid #d3d3d3;
    border-radius: 50%;
    border-top: 10px solid #3498db;
    width: 30px;
    height: 30px;
    z-index: 4;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute;
    margin: auto;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

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

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

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

/*Style for validation message text*/
.validation-text {
    color: red;
    font-size: 12px;
}

.input-border-color {
    border-color: red;
}

/*Tooltip for buttons*/

.tooltiptext {
    visibility: hidden;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    margin-top: 10px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    border-radius: 6px;
    font-size: 11px;
}

.tooltipButton:hover .tooltiptext {
    cursor: pointer;
    visibility: visible;
}

.col-padding {
    padding: 3px !important;
}

.modal-footer {
    border-top: rgba(0, 0, 0, 0.08) !important;
    padding-top: 0px !important;
}

.textalign {
    text-align: right;
    padding-top: 5px;
}

.icon-align-center {
    text-align: center !important;
    padding: 0px !important;
}

.paddingbottom {
    padding-bottom: 20px;
}

.padding-top-bottom {
    padding: 20px 0px;
}

.modal-header {
    border-color: rgba(0, 0, 0, 0.08) !important;
}

.modal-footer {
    border-top: rgba(0, 0, 0, 0.08) !important;
    padding-top: 0px !important;
}


.text-align-center {
    text-align: center !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

/*--------------------------------------------------kendo-CSS------------------------------------------ */

.k-panelbar {
    background-color: #2D323E !important;
}

    .k-panelbar .k-group {
        background-color: #2D323E !important;
        color: #ffffff !important;
    }

    .k-panelbar > .k-item.k-state-expanded > .k-link, .k-panelbar > .k-item.k-state-active > .k-link {
        color: #ffffff !important;
        background-color: #2D323E !important;
        border-color: none !important;
    }

    .k-drag-clue, .k-treeview .k-in.k-state-selected, .k-calendar .k-state-selected .k-link, .k-calendar .k-weekend.k-state-selected .k-link, .k-calendar:not(.k-calendar-infinite) .k-content .k-state-selected .k-link, .k-calendar:not(.k-calendar-infinite) .k-content .k-weekend .k-state-selected .k-link, .k-event, .k-panelbar > .k-item > .k-link.k-state-selected:not(.k-state-expanded), .k-panelbar > .k-item > .k-link.k-state-selected:not(.k-state-active), .k-panelbar .k-group > .k-item > .k-link.k-state-selected {
        color: #ffffff;
        background-color: #000 !important;
        border-color: #000 !important;
    }

    .k-panelbar > .k-item > .k-link {
        color: #ffffff !important;
        margin-top: 10px !important;
    }

    .k-panelbar .k-group > .k-item {
        margin-top: 10px !important;
    }


        .k-panelbar .k-group > .k-item > .k-link {
            margin-left: 15px !important;
            margin-right: 3px !important;
        }

    .k-panelbar .k-group {
        padding: 4px 8px !important;
    }

/*.k-panelbar > .k-item > .k-link .k-icon
    {
        margin-left:12px !important;
    }*/

.k-tooltip {
    /*background: #2D323E !important;*/
    background: #2D323E !important;
}

.k-callout-s {
    border-top-color: #2D323E !important;
}

.k-icon {
    /*color: #ffffff !important;
    padding-right: 20px;*/
    padding-right: 20px;
}

.k-panelbar > .k-item > .k-link .k-icon {
    color: #ffffff !important;
    margin-left: 12px !important;
}

.k-input .k-select .k-icon {
    color: #000 !important;
}

.k-form fieldset, .k-form-inline fieldset {
    margin: 10px 0px !important;
}

.k-radio:checked + .k-radio-label::before {
    border-color: rgb(3,155,229) !important;
    background-color: rgb(3,155,229) !important;
}

.k-radio:hover + .k-radio-label::after {
    background-color: rgb(3,155,229) !important;
}

.k-button.k-primary, .k-slider .k-draghandle {
    background-color: rgb(3,155,229) !important;
    border-color: rgb(3,155,229) !important;
}

.k-list .k-item.k-state-selected {
    background-color: rgb(3,155,229) !important;
}

/*.k-textbox::selection, .k-input::selection, .k-textarea::selection {
    background-color: rgb(3,155,229) !important;
}

.k-widget ::selection, .k-block ::selection, .k-panel ::selection {
    background-color: rgb(3,155,229) !important;
}*/

.k-list .k-item.k-state-selected, .k-list-optionlabel.k-state-selected, .k-list-container .k-button:active, .k-list-container .k-button.k-state-active, .k-spreadsheet-popup .k-button:active, .k-spreadsheet-popup .k-button.k-state-active, .k-spreadsheet-popup .k-button.k-state-selected, .k-menu-group .k-item.k-state-selected, .k-menu.k-context-menu .k-item.k-state-selected {
    background-color: rgb(3,155,229) !important;
}

.k-dropdown {
    width: 100% !important;
}

/*input, select, textarea {
    max-width: 600px !important;
}*/

.k-grid th {
    font-weight: bold !important;
}

.k-panelbar > .k-item > .k-link:hover {
    background-color: #000 !important;
}

.k-checkbox:checked + .k-checkbox-label::before {
    border-color: rgb(3,155,229) !important;
    /*background-color: #ff6358;*/
    background-color: rgb(3,155,229) !important;
}

.k-form-field > input[type="password"], .k-form-field > input[type="text"] {
    display: block;
    background-clip: padding-box;
    border-radius: 2px;
    padding: 4px 8px;
    width: 12.4em;
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    outline: 0;
    font: inherit;
    font-size: 14px;
    line-height: 1.42857143em;
    display: inline-flex;
    vertical-align: middle;
    position: relative;
    -webkit-appearance: none;
    color: #656565;
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.08);
    width: 100% !important;
}

input {
    width: 100% !important;
}

.k-dialog-buttongroup .k-primary:not(:hover):not(.k-state-hover):not(:active):not(.k-state-eactive) {
    color: inherit !important;
    background: none !important;
}

.k-dialog-titlebar {
    border-color: inherit;
    color: #ffffff;
    background-color: rgb(3,155,229) !important;
}

/* Set Common fontSize */
.k-textbox, .k-input.k-textbox, .k-textarea, .k-button, .k-widget, .k-form {
    font-size: 13px !important;
}

    .k-widget ::selection, .k-block ::selection, .k-panel ::selection {
        background-color: rgb(3,155,229) !important;
    }

.k-maskedtextbox, .k-textarea {
    width: 100% !important;
}

    .k-maskedtextbox .k-textbox {
        width: 100% !important;
    }

.k-switch-label-on {
    color: white !important;
    left: -3.7em !important;
}

.k-switch-label-off {
    color: white !important;
    margin-left: 40px !important;
}

.k-switch-on .k-switch-handle {
    background-color: white !important;
    border-color: green !important;
     left: 0 !important;
}

.k-switch-on .k-switch-container {
    background-color: green !important;
}



.k-switch-off .k-switch-container {
    background-color: red !important;
}

.k-switch-on {
    font-size: 8px;
    font-weight: 500;
}

.k-switch-off {
    opacity: 0.8;
    font-size: 8px;
    font-weight: 500;
}

k-switch-on .k-switch-handle {
    left: 0 !important;
} 

k-switch-off .k-switch-handle {
    right: 0 !important;
} 

.k-success-colored {
    border-color: transparent !important;
    background-color: transparent !important;
}

.k-error-colored {
    border-color: transparent !important;
    background-color: transparent !important;
}

.k-form-field > input[type="text"] {
    width: 100% !important;
}

.k-action-buttons .k-button + .k-button {
    color: white !important;
}

#ok {
    padding: 10px 12px !important;
}

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

/*Kendo TABs*/

kendo-tabstrip p {
    margin: 0;
    padding: 8px;
    padding-left: 0px;
}

.k-tabstrip .k-item {
    color: rgb(3,155,229) !important;
}

    .k-tabstrip .k-item.k-state-active {
        color: #656565 !important;
    }


.k-tabstrip > .k-content {
    padding: 0px 0px !important;
    border-width: 1px;
    border-style: none !important;
    border-color: inherit;
    display: none;
    overflow: auto;
    flex: 1 1 auto;
}

.k-tabstrip-top > .k-tabstrip-items .k-item.k-state-active {
    border-bottom-color: #e7e7e8 !important;
}

.k-tabstrip .k-item.k-state-active {
    background-color: #e7e7e8 !important;
}

.k-pager-wrap .k-pager-input .k-textbox {
    width: 4em !important;
}

@media(max-width: 767px) {
    .textalign {
        text-align: left !important;
    }
}