﻿/*----------------LAYOUT----------------*/

body {
    font-family: Roboto;
    font-size: .8em;
    margin: 0px;
    padding: 0px;
}

img:hover {
    cursor: pointer;
}

.imgDel {
    height: 24px;
}

sup {
    vertical-align: top;
    position: relative;
    top: -3px;
}

.content {
    display: flex;
    flex: 1;
    /*background: #eee;*/
    color: #000;
    height: 100%;
}

.main {
    order: 2;
    height: 100%;
    overflow: auto;
    /* background: #f2f4f5; */
}

.sidebar {
    width: 150px;
    order: 1;
    background: #fff;
}

#sidebarFooterContent {
    margin-top: 1.5em;
    text-align: center;
    vertical-align: bottom;
    font-family: Roboto;
    font-size: 0.7em;
}

.docbar {
    width: 45vw;
    order: 3;
    background: #fff;
}

.header {
    height: 64px;
    display: flex;
    flex: 3;
    font-family: Roboto;
}

.mainHeader {
    height: inherit;
    order: 2;
    background: #0078d7;
    overflow: auto;
}

.sidebarHeader {
    width: 150px;    
    height: inherit;
    order: 1;
    background: #fff;
}

.docbarHeader {
    width: 45vw;
    height: inherit;
    order: 3;
    background: #fff;
}

.menuLine {
    height: 48px;
    padding-left: 15px;
    padding-top: 10px;
    background-color: #f7f7f7;
}

.menuBox {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #81898e;
    background: #fff;
    border-bottom: solid 1px #f7f7f7;
}

.menuBoxBlue {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #f2f4f5;
    border-bottom: solid 1px #f7f7f7;
}

.menuBox:hover {
    cursor: pointer;
}

.menuBoxBlue:hover {
    cursor: pointer;
}

.menuTitleBlue {
    color: #0078D7;
}

.menuBoxTitle {
    display: normal;
}


/** LOGIN */
.loginText {
    font-size: 1em;
    margin-bottom: 0.5em;
    background-color: white;
    padding: 3px;
}
#baselineVisibility {
    width: 16pt;
    position: relative;
    top: 5px;
    left: 5px;
}
#loginButton {
    background-color: #00AEED;
    color: white;
    height: 40px;
    width: 120px;
    margin-right: 10px;
    border-radius: 10px;
}

#doArchiveButton {
    background-color: #00AEED;
    color: white;
    height: 40px;
    width: 190px;
}

.loginLink {
    padding-left: 45px;
    color: #00AEED;
    text-decoration: none;
}

.AgbLink {
    color: #00AEED;
    text-decoration: none;
}

.loginTdLeft {
    width: 55%;
}

.loginDivLeft {
    display: inline-block;
    width: 320px;
    padding: 5%;
}

.loginDivRight {
    display: inline-block;
    padding-top: 7%;
    vertical-align: top;
}

@media only screen and (max-width: 1025px) {
    #loginDivLeft {
        display: none;
    }

    #loginImgLeft {
        display: none;
    }

    .loginTdLeft {
        display: none;
    }
    .loginLink {
        padding-left: 0px;
    }
    .loginDivLeft {
        display: none;
    }
}


/** Settings */
.mdm_main table {
    font-size: inherit;
    width: 100% !important;
}

.mdm_text {
    font-size: .75em;
    color: #81898e;
    margin-top: 20px;
}

.mdm_must_text {
    font-size: .75em;
    color: darkgreen;
    margin-top: 20px;
}

.mdm_must_checkbox {
    color: darkgreen;
}

.mdm_input {
    border-bottom: 1px solid #d5d5d5;
}

.k-list > .k-state-focused.k-state-selected, .k-state-focused.k-state-selected {
    box-shadow: none;
    color: inherit;
}

.k-list > .k-state-selected {
    border-color: inherit;
}

.k-state-selected .k-ghost {
    border-color: inherit;
}

.k-drag-clue {
    border-color: inherit;
}

li.k-drop-hint {
    border-color: inherit !important;
}

li.k-item.k-state-hover {
    background-color: #eff5fb !important;
}

div.k-list-container.k-popup.k-group.k-reset.k-state-border-up {
    border: none !important;
    box-shadow: none;
}

.input_container {
    width: 100%;
}

.input_container input {
    width: 56%;
}

.buttons_container {
    margin-top: 20px;
    text-align: left;
}

.buttons_container .k-button {
    border: solid 1px;
    height: 34px;
}

#uploadButton {
    background-color: #0078d7;
    color: white;
}

.k-upload .k-upload-selected {
    background-color: #0078d7;
    color: white;
}

#clearUploadButton {
    background-color: #81898e;
    color: white;
}

.k-upload .k-clear-selected {
    background-color: #81898e;
    color: white;
}

.k-button-solid-primary {
    color: #0078d7;
}

#newQueryButton {
    background-color: #81898e;
    color: white;
}

#downQueryButton {
    background-color: #0078d7;
    color: white;
}

#saveButton {
    background-color: #0078d7;
    color: white;
}

#newButton {
    background-color: #009900;
    color: white;
}

#calcButton {
    background-color: #fff;
}

#deleteButton {
    background-color: #CC3333;
    color: white;
}

#newButtonWf {
    background-color: #009900;
    color: white;
}   


.doqio-ext-image {
    height: 38px;
}

.doqio-folder-image {
    height: 21px;
}


.recinfo {
    margin-top: 20px;
    color: #81898e;
    font-size: .75em;
}

.k-i-gear {
    color: #000 !important;
}


/**Combobox & DropDownlist**/

.k-dropdown {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5 !important;
    border-width: 1px;
    background-color: white;
    box-shadow: none !important;
}

.k-picker.k-dropdownlist.k-picker-solid.k-picker-md.k-rounded-md {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5 !important;
    border-width: 1px;
    background-color: white;
    box-shadow: none !important;
}

.k-dropdown .k-input-inner {
    background-color: white;
}

.k-widget.k-picker {
    background-color: white;
}

.k-widget.k-picker.k-hover {
    background-color: white;
}

.k-dropdown.k-focus {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-color: #d5d5d5 !important;
}

.k-dropdown.k-hover {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-color: #d5d5d5 !important;
}


.k-combobox {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5 !important;
    border-width: 1px;
    background-color: white;
    box-shadow: none !important;
}

.k-combobox .k-input-inner {
    background-color: white;
}

.k-combobox.k-focus {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-color: #d5d5d5 !important;
}

.k-combobox.k-hover {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-color: #d5d5d5 !important;
}

#divSelQueries .k-combobox {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-color: #0078d7 !important;
    background-color: #0078d7 !important;
    color: white !important;    
}

#divSelQueries .k-combobox .k-input-inner {
    background-color: #0078d7;
}

#divSelQueries .k-combobox .k-input-inner {
    background-color: #0078d7;
}

#divSelQueries .k-widget.k-picker.k-hover {
    background-color: #0078d7;
}

#divSelQueries .k-icon-button {
    background-color: inherit !important;
    color: white !important;
}

#divSelQueries .k-combobox .k-input-inner::placeholder {
    color: white !important;
    opacity: 1;
}

.k-combobox .k-input {
    background-color: white;
}

.k-listbox .k-item, .k-popup .k-list .k-item {
    background-color: white;
}

.k-selected {
    color: inherit !important;
    background-color: white !important;
}

span.k-icon.k-i-arrow-60-down {
    margin: auto;
    width: 100%;
    height: 100%;
}

/**MultiSelect**/
.k-multiselect {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5 !important;
    border-width: 1px;
    background-color: white;
    box-shadow: none !important;
}
.k-chip {
    border: none;
    background-color: white;
    box-shadow: none !important;
}

/**KendoTextbox**/
.k-textbox {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5;
}


/**DatePicker**/
.k-datepicker {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5 !important;
    background-color: white;
    width: 50%;
}

.k-datepicker.k-state-default {
    background-color: white;
}

span.k-icon.k-i-calendar {
    margin: auto;
    height: 100%;
    width: 100%
}


/**NumericTextBox**/
.k-numerictextbox {
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5;
    background-color: white;
    width: 50%;
}

 
/**Input **/
input {
    border-top: none;
    border-right: none;
    border-left: none;
    border-bottom: 1px solid #d5d5d5;
    padding: 10px;
    width: 96%;
    font-family: Roboto;
    background-color: inherit !important;
    caret-color: #0078d7;
}

input[type="text"]:disabled {
    color: #81898e;
    background-color: #fff;
    font-family: Roboto;
}

::placeholder {
    color: #353535;
    opacity: 1;
}

#tbSearch::placeholder {
    color: white !important;
    opacity: 1;
}

#tbSearch {
    border-bottom: none;
    opacity: .95;
    caret-color: white !important;
}

input:focus {
    outline: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px #0078d7 inset !important;
    -webkit-text-fill-color: white !important;
    color: white !important;
}

/**Treeview*/
#TabFolder-1 {
    height: 100%;
}

.tableFolder {
    padding: 0px;
    background-color: inherit !important;
    border: none !important;
    border-spacing: 0px;
}
.tableFolder tr {
    padding: 0px;
    background-color: inherit !important;
    border: none !important;
    border-spacing: 0px;
}
.tableFolder td {
    padding: 0px 5px 0px 5px;
    background-color: inherit !important;
    border: none !important;
    border-spacing: 0px;
}

/**Textarea**/
textarea {
    width: 96%;
    padding: 10px;
    resize: none;
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: #d5d5d5;
    border-width: 1px;
    height: 40px;
    overflow: hidden;
    caret-color: #0078d7;
}


/**Kendo TabStrip**/
li.k-item.k-state-default.k-state-active.k-tab-on-top.k-first, li.k-item.k-state-default.k-tab-on-top.k-state-active, span.k-loading.k-complete,
li.k-item.k-state-default.k-first, li.k-item.k-state-default, div.k-widget.k-tabstrip.k-header.k-floatwrap.k-tabstrip-top,
li.k-item.k-state-disabled {
    border: none;
    background-color: white;
}

div.k-content.k-state-active {
    border: none;
}

#iframeData {
    min-height: 89vh;
}

#iframePrev {
    border: none;
    min-height: 89vh;
}

li.k-item.k-state-default.k-first.k-tab-on-top.k-state-active span.k-link, li.k-item.k-state-default.k-tab-on-top.k-state-active span.k-link {
    color: #0078D7;
    border-bottom: solid 1.5px #0078D7;
}

li.k-item.k-state-default, li.k-item.k-state-disabled {
    padding-top: 17px;
}

#TabStrip li.k-item.k-state-default, li.k-item.k-state-disabled {
    padding-top: 0px;
    line-height: 50px;
}

.k-tabstrip:focus {
    box-shadow: none;
}

.sidebar-second {
    background-color: white;
}

div.k-content.k-state-active {
    border-top: solid 1px #f0efef;
    margin: 0;
}

ul.k-tabstrip-items {
    padding: 0;
    height: 64px;
}

#TabMain ul.k-tabstrip-items {
    background-color: #f7f7f7;
}

#TabMain .k-item.k-state-default {
    background-color: white;
}

#TabMain {
    border: solid 1px #d5d5d5;
    background-color: white;
}
#mainContent {
    border: solid 1px #d5d5d5;
}
#mainSearch {
    border: solid 1px #d5d5d5;
}
#mainFolders {
    border: solid 1px #d5d5d5;
}


/**Grid**/

a.k-link.k-header, .k-pager-wrap .k-link.k-state-disabled, a.k-link.k-pager-nav, div.k-widget.k-grid.k-display-block.k-editable, .k-link:link {
    border: none;
}

.k-grid-update {
    background-color: #0078d7 !important;
    color: white !important;
}
.k-grid-destroy {
    background-color: #CC3333 !important;
    color: white !important;
}
.k-grid-cancel {
    background-color: #FFF !important;
}

.k-button.doqio-gear {
    position: relative;
    top: 15px;
    left: -8px;
    color: inherit;
}

.k-widget.k-grid.k-display-block.k-editable {
    height: 100%;
    overflow: auto;
}

.k-grid-header th.k-header {
    border-top: none;
    border-right: none;
    border-left: none;
    height: 40px;
    vertical-align: middle !important;
    cursor: default;
}

th.k-header {
    background-color: white;
}

.k-grid td {
    border-top: none;
    border-right: none;
    border-left: none;
    border-bottom: solid 1px #f0efef;
    cursor: pointer;
}

a.k-button.k-button-icontext.k-grid-edit {
    border: none;
    background-image: none;
    background-color: inherit;
    color: #81888E;
}

.k-pager-wrap {
    background-color: white;
}

tbody tr {
    background-color: #FAFAFA;
}

.k-alt {
    background-color: white;
}

.k-grid .k-state-selected {
    background-color: #F0F5FB !important;
    background-image: none;
}

.k-grid .k-alt.k-state-selected {
    background-color: #F0F5FB !important;
    background-image: none;
}

.k-panelbar .k-state-selected {
    background-color: #F0F5FB !important;
    border-image: none;
    border: solid 1px #F0F5FB;
    /*margin: 0px;*/
}

.k-grid tr:hover {
    background-color: #efefef !important;
    background-image: none;
}

.k-grid td.k-state-selected, .k-grid td.k-state-focused, .k-link:link, .k-link:visited, .k-nav-current.k-state-hover .k-link, .k-grid-header th.k-state-focused {
    box-shadow: none;
}

.k-pager-wrap .k-link:hover {
    background-color: inherit;
    border: none;
    color: #0078D7;
    /*margin: 0px;*/
}

.k-pager-numbers .k-state-selected {
    border: none;
}

.k-state-selected {
    background-color: #eff5fb;
    color: inherit;
}

.k-state-selected:hover {
    background-color: #eff5fb;
    color: inherit;
}

.k-header.k-grid-toolbar.k-grid-top {
    background-color: white;
    border: none;
    height: 0px;
}

.k-grid-toolbar {
    background-color: white;
    float: right;
    border: none;
}

.ruleGrid th.k-header {
    display: none;
}


.ruleGrid tbody tr {
    background-color: white;
}


#GridQueries {
    margin-top: 10px;
    margin-bottom: 15px;
}

#GridQueries .k-header.k-grid-toolbar.k-grid-top {    
    height: 30px;
}

/***Button***/

.k-button {
    background-color: inherit;
    border: none;
    background-image: none;
}

.k-button-icontext {
    color:#2e2e2e;
}

.k-button:hover {
    background-color: #F0F5FB;
    background-image: none;
}

.k-button:active {
    background-color: #F0F5FB;
    color: inherit;
}

.k-button:focus, .k-button:focus:active, .k-button:focus, .k-button:focus:hover {
    box-shadow: none;
}

/* Tab-Settings */
.tabSettings-section label {
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 11pt;
    display: inline-block;
}

#tabSettings .k-listbox {
    width: 50%;
    height: 320px;
}


#lblSel {
    width: 270px !important;
}

#tabSettings .tabSettings-section {
    max-width: none;
    width: 515px;
}

div.sliderVersion {
    width: 480px;
    margin-bottom: 30px;
}

div.sliderVersion .k-slider-selection {
    display: none;
}

/* Upgrade */

.upgrdBox {
    height: 160px;
    width: 210px;
    border: 1px;
    border-style: solid;
    border-color: grey;
    border-radius: 8px;
    text-align: center;
    display: inline-block;
    margin-top: 20px;
    margin-right: 20px;
    padding-bottom: 20px;
    vertical-align: middle;
}

.upgrdButton {
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: #0078d7;
    color: white;
    text-align: center;
}

.upgrdBox h5 {
    margin-bottom: 5px;
    font-size: 12pt;
}
.upgrdBox h6 {
    margin: 5px;
    font-size: 7pt;
    font-weight: normal;
}

.upgrdBox3 {
    height: 160px;
    width: 210px;
    border: 1px;
    border-style: solid;
    border-color: grey;
    border-radius: 8px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    margin-top: 20px;
    margin-right: 20px;
    padding-bottom: 20px;
    color: white;
    background-color: #0078d7;
}

.upgrdButton3 {
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: white;
    text-align: center;
}

.upgrdBox3 h5 {
    margin-bottom: 5px;
    font-size: 12pt;
}

.upgrdBox3 h6 {
    margin: 5px;
    font-size: 7pt;
    font-weight: normal;
}

/* Popup */

.k-window .k-select {
    background-color: #fff;
    border: none;
}
.k-window table {
    border-spacing: 10px;
    border-collapse: separate;
}

.k-window td {
    padding: 3px;
    background-color: #fff;
}

.k-window-titlebar.k-header {
    height: 56px;
    background-color: #fff;
    font-size: 10pt;
    padding-top: 18px;
}

.k-dropdown {
    width: 96%;
}

.k-combobox {
    width: 96%;
}

.k-multiselect {
    width: 100%;
}

.k-multiselect .k-draghandle.k-state-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list > .k-state-highlight, .k-list > .k-state-selected, .k-marquee-color, .k-panel > .k-state-selected, .k-scheduler .k-scheduler-toolbar .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-state-selected, .k-state-selected:link, .k-state-selected:visited, .k-tool.k-state-selected {
    color: inherit !important;
}

.k-primary {
    color: inherit;
}

.k-primary:hover {
    color: inherit;
}

.k-edit-form-container {
    width: 770px;
}

.k-edit-form-container .k-edit-buttons {
    text-align: left;
    border: none;
}

.k-edit-buttons.k-actions-end {
    padding: 20px;    
    width: 760px;
    height: 60px;
    background-color: #f7f7f7;
}

.k-state-selected.k-complete .k-progress-status-wrap {
    background-color: #0078d7 !important;
    border-color: #0078d7 !important;
    color: white !important;
}
.k-state-selected .k-progress-status-wrap {
    background-color: #0078d7 !important;
    border-color: #0078d7 !important;
    color: white !important;
}

.k-state-selected {
    border-color: #0078d7 !important;
}

.menubuttonRight {
    position: absolute;
    top: 20px;
    left: 90%;
}
.menubuttonSmall {
    display: none;
}

.is-wv-parent {
    font-weight: bold;
}
.is-wv-child {
    font-weight: normal;
}

@media only screen and (max-width: 1199px) {    
    .menubuttonRight {
        display: none;
    }
    .menubuttonSmall {
        display: flex;
        order: 0;
        position: relative;
        top: 20px;
        left: 70%;
        height: 44px;
    }
}
