/**
 * Provides password input style masking, but ensures that the field
 * is NOT type password. This allows "password" fields to exist that cannot
 * be identified by a browsers password manager.
 */
input.fakePasswordField {
    -webkit-text-security: circle !important;
    -moz-text-security: circle !important;
    font-family: text-security-circle !important;
}

/**
 * Adds red coloration to fieldset legends when they have the error class.
 */
fieldset:has(div.form-group.has-error) > legend {
    color: red;
}

/*
 * Corrected the spacing of the filter row boolean radio boxes. They were too squished before.
 */
span.k-operator-hidden > label > input[type=radio] {
    margin-left: 5px !important;
}
span.k-operator-hidden > label {
    margin-right: 5px !important;
}

/*
 * Fixes the kendo multi-select CSS. Selected items will be properly highlighted, so that you know what you have selected.
 */
.k-chip {
    font-size: inherit;
    background-color: #fafafa;
    /*background-color: #005ef7;*/
    color: #333333;
}
li.k-list-item.k-selected {
    background-color: #2196F3;
    color: #ffffff;
}

/*
 * Ensures that kendo elements (combobox and multiselect) have proper red coloration when they have validation errors.
 */
div.has-error > div.controls > span.k-multiselect {
    border-color: #D84315 !important;
    color: #D84315 !important;
}
div.has-error > div.controls > span.k-combobox {
     border-color: #D84315 !important;
     color: #D84315 !important;
 }

/*
 * Allows validation messages in popup editors for grids to be flagged as red.
 */
div.k-form-field-error {
    border-color: #D84315 !important;
    color: #D84315 !important;
}

/*
 * Required for the sticky columns to function. By default, columns for some reason are entirely transparent when they are marked
 * as sticky in kendo, resulting in the user seeing the other columns behind and through the sticky columns, making the data
 * unreadable. Setting the background to white is not noticeable to users (all column cells currently are white as of 12/2/2022, V9.11.2.54),
 * but it prevents the columns from being transparent.
 */
.k-grid-content-sticky {
    background: white;
}

/*
 * Changes the loading mask so that it is ALWAYS center of the available screen area, and that it scrolls with the user.
 * This ensures that the message can never leave the users field of view.
 */
div.blockUI.blockMsg.blockElement {
    position: fixed !important;
    z-index: 100000 !important;
    justify-content: center !important;
    align-items: center !important;
    display: flex !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

/*
 * An override of the same value from the components.min.css. Used for the error image displayed for tab errors.
 * The margin-right has been changed from 15px to 2px, which removes a lot of extra space that is not desired.
 */
.navigation li a>i {
    float:left;
    top:0;
    margin-top:2px;
    margin-right:2px;
    -webkit-transition:opacity 0.2s ease-in-out;
    -o-transition:opacity 0.2s ease-in-out;
    transition:opacity 0.2s ease-in-out
}

/*
 * CSS for menu action buttons.
 */
.menuActionButton {
    word-wrap: break-word  !important;
    white-space: normal !important;
    max-width: 208px !important;
    max-height: 30px !important;
    padding: 2% !important;
    font-style: normal;
}

#grid .k-grid-toolbar
{
    padding: .6em 1.3em .6em .4em;
}
.category-label
{
    vertical-align: middle;
    padding-right: .5em;
}
#category
{
    vertical-align: middle;
}
.actionBtnContainer
{
    display: inline-block;
}
.k-grid .toolbar
{
    margin-left: auto;
    margin-right: 0;
}

.k-grid-add {
    border-radius: 4px;
}

/*
* This in for the validation messages in a kendo grid, this creates a new line for the validation messages
*/
.k-callout{
    display: none;
}
.k-tooltip.k-invalid-msg {
    position: static;
    display: inline-block;
}

/*
 * Prevents actions against the input the label is for. Used to prevent file inputs from requesting files when a user clicks on the corresponding label.
 */
label.fileInputLabel {
    pointer-events:none;
}

/**
 * CSS for ensuring that file input labels for the new style of inputs are red.
 */
label.has-error {
    border-color: #D84315 !important;
    color: #D84315 !important;
}

/**
 * CSS for ensuring that file input labels for the uploaded style of inputs are red.
 */
div.has-error {
    border-color: #D84315 !important;
    color: #D84315 !important;
}

/*
 * Removes a background image that screws up the visuals of the kendo ui editor widget.
 */
.k-tool-icon {
	background-image: none;
}

/*
 * Causes the sidebar content to be shown or hidden automatically depending on the size of the page.
 */
@media (max-width: 768px) {
	.sideBarContentDisplay {
        display: none;
	}
}
@media (min-width: 769px) {
	.sideBarContentDisplay {
        display: block;
	}
}

/*
 * Makes the modal windows slightly larger than usual.
 */
.modal-dialog {
    width: 70%;
}

.clickableSpan {
	cursor: pointer;
}

/**
 * These ensure that the selections for custom value selectors and field selectors for the new Kendo UI Filter element (https://docs.telerik.com/kendo-ui/api/javascript/ui/filter)
 * are sized properly. They are too small by default.
 */
.k-filter-value > span {
	width: 400px;
}
.k-filter-value > input[type="text"] {
	width: 400px;
}
.k-filter-field > span {
	width: 400px;
}

/**
 * Correction of the grid selected page color.
 */
.k-link.k-state-selected {
    background-color: #005EF7;
	color: #FFF;
}

/**
 * Ensures that all column headers for all kendo grids always display all available title text by word-wrapping.
 */
.k-grid .k-header {
	word-wrap: break-word !important;
	white-space: normal !important;
	overflow: visible !important;
	vertical-align: middle !important;
}

.ui-pnotify-action-button {
	color: #FFF;
    text-decoration: none;
    outline: 0;
    background-color: #005EF7;
}
.ui-pnotify-action-button:focus {
	color: #005EF7;
    text-decoration: none;
    outline: 0;
    background-color: #FFF;
}

/**
 * Ensures that the pageSize selection drop down for kendo grids is large enough to
 * show the selected pageSize.
 */
.k-pager-wrap .k-dropdown{
    width: 60px; /* specify the width */
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    color: #FFF;
    text-decoration: none;
    outline: 0;
    background-color: #005EF7;
}

/* .login-container .login-form {
	width:420px;
} */
.department-wrapper {
    position: relative;
    padding: 1px 10px 10px 10px;
    margin-top: 10px;
}

.department-overlay {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    z-index: 999;
}

.department-overlay-content {
    margin-left: auto;
    margin-right: auto;
    width: 400px;
    text-align: center;
    padding: 15px;
    border: 4px solid #004D75;
    background-color: #FFFFFF;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.contractor-overlay {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    margin-top: 10px;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    z-index: 999;
}

.contractor-overlay-content {
    margin-left: auto;
    margin-right: auto;
    width: 400px;
    text-align: center;
    padding: 15px;
    border: 4px solid #004D75;
    background-color: #FFFFFF;
    margin-top: 24px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.email-notify-overlay {
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.email-notify-overlay-content {
    margin-left: auto;
    margin-right: auto;
    width: 250px;
    text-align: center;
    padding: 15px;
    border: 4px solid #004D75;
    background-color: #FFFFFF;
    margin-top: 80px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.blockui-growl {
    display: none;
    text-align: left;
    padding: 15px;
    background-color: #455A64;
    color: #FFF;
    border-radius: 3px;
}

.blockui-growl h6 {
    margin-top: 2px;
    margin-bottom: 8px;
}

.blockui-message {
    display: none;
    background-color: #455A64;
    color: #FFF;
    border-radius: 3px;
    padding: 15px 15px 10px 15px;
}

.blockui-message > i {
    display: block;
    margin-bottom: 10px;
}

.multiple-messages-container, .blockui-animation-container {
    display: none;
}

.blockui-animation-container {
    background-color: #555;
    padding: 10px;
    line-height: 1;
    border-radius: 3px;
}

.frame {
    border: 1px solid #004D75;
    margin-top: 20px;
    position: relative;
    padding: 14px 10px 10px;
}

.frame-title {
    padding: 4px;
    top: -14px;
    position: absolute;
    background: #FFF;
}

/*
 * Styles related to PDF files. For displaying icons, links to the documents, and the buttons.
 */
.pdf-icon {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px;
    background: url("../images/ico_file_pdf.png") no-repeat scroll 50% 50% #FFF;
    width: 33px;
    margin-right: -6px;
    vertical-align: top;
    border: 1px solid #CCCCCC;
    display: inline-block;
    height: 36px;
    min-width: 16px;
    padding: 3px 5px;
}

.pdf-a {
    float: left;
    margin-right: -1px;
}

.pdf-link {
    vertical-align: top;
    background-color: #FFF;
    border: 1px solid #CCCCCC;
    display: inline-block;
    height: 36px;
    line-height: 22px;
    min-width: 16px;
    padding: 6px 10px 3px 5px;
    cursor: pointer !important;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #000000;
    font-size: 13px;
}

.pdf-replace-button {
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
    font-size: 13px !important;
}

.pdf-cancel-button {
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0;
    margin-left: -3px;
}

.pdf-document {
    width: 100%;
}

.pdf-uneditable-input {
    width: 205px !important;
    height: 20px !important;
}

/* Frames */
.frame {
    border: 1px solid #004D75;
    margin-top: 20px;
    position: relative;
    padding: 14px 10px 10px;
}

.frame-title {
    padding: 4px;
    top: -14px;
    position: absolute;
    background: #FFF;
}

/* General Utility Styles */
/*
.top-margin-ten {
    margin: 10px 0px 0px 0px;
}
.top-margin-twenty {
    margin: 20px 0px 0px 0px;
}
.top-margin-twenty-five {
    margin: 25px 0px 0px 0px;
}
.top-margin-thirty {
    margin: 30px 0px 0px 0px;
}

.bottom-margin-ten {
    margin: 0px 0px 10px 0px;
}

.left-margin-ten {
    margin: 0px 10px 0px 0px;
}

.right-margin-ten {
    margin: 0px 0px 0px 10px;
}

.full-margin-ten {
    margin: 10px 10px 10px 10px;
}

.float-left {
    float: left;
}
*/
.grid-placeholder {
    /* height: 200px; */
    width: 100%;
    border: 2px solid #CCCCCC;
    background: #EEEEEE;
}

.grid-placeholder.short {
    /* height: 80px !important; */
}

.grid-placeholder-inner {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 3px solid #004D75;
    padding: 16px;
    margin: 50px auto 50px auto;
    text-align: center;
    vertical-align: middle;
    width: 15%;
}

.grid-placeholder-inner-mobile {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 3px solid #004D75;
    padding: 16px;
    margin: 70px auto 0;
    text-align: center;
    vertical-align: middle;
}

.grid-placeholder-inner-mobile.short {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.grid-placeholder-inner.short {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

/*@media (max-width: 769px) {
	.adaptive-grid-wrapper {
	    position: relative;
	    height: 300px;
	}
	.k-grid {
	    height: 299px;
	}
}*/

/* These three configurations hide the vertical scrollbar from the kendo grids. We don't use the vertical scrollbar, so it isn't needed. */
.k-grid-header
{
   padding: 0 !important;
}
.k-grid-content
{
   overflow-y: visible;
}
.k-grid-footer
{
   padding: 0 !important;
}

span.csv {
    background-image: url(../images/ico_file_csv.png);
}

span.excel {
    background-image: url(../images/ico_file_excel.png);
}

span.pdf {
    background-image: url(../images/ico_file_pdf.png);
}

span.xml {
    background-image: url(../images/ico_file_xml.png);
}

.no-margin-right-buttonicon span.ui-button-icon-primary.ui-icon.icon-floppy-disk, span.ui-button-icon-primary.ui-icon.icon-plus2, span.ui-button-icon-primary.ui-icon.icon-search4 {
    margin-right: 0;
}

.k-filter-menu label {
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.k-filter-menu input[type=radio], input[type=checkbox] {
    vertical-align: sub;
    margin: 4px 5px 0 0;
}

/*
 * Styles the borders for the listboxes. By default, listboxes have a dark black border around them that distracts from the
 * items actually listed in the boxes. They now have a light grey border that is visible, but easily ignored.
 */
.k-list-scroller.k-selectable {
    border-color: lightgrey;
}

/*
 * Pads the left of the listbox toolbars a bit. By default, the toolbars are almost touching the left-side box for the listbox pairs,
 * which is noticeable and distracting. This padding puts the boxes in the middle between the left and right boxes.
 */
.k-listbox-toolbar {
    padding: 0 0 0 15px;
}

/*
 * Prepares the group header for the custom report available fields list box. Styled to have a line stretching across the top,
 * a rounded grey box containing the text, and a the font color is white.
 */
.customReportFieldGroupHeader {
    float: left;
    border-radius: 5px;
    background: #999;
    font-size: 11px;
    padding: 0 5px;
    margin-top: -16px;
    line-height: 18px;
    color: #FFF;
}

/*
 * Adds padding for the previous/next/finish buttons used by the step wizards.
 */
.actions.clearfix {
    margin-top: 15px;
}

.btn-xs, .btn-group-xs > .btn {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.6666667;
    border-radius: 2px;
}

#customFieldMetaSave > fieldset > div > div.panel-body > div.form-groupstyled.checkbox > div.controls {
    padding-left: 5px;
}

fieldset.customDocFieldSet {
    background: #FBFBFB;
    border: 1px solid #E9ECEF !important;
    border-radius: 3px;
    padding: 0 1rem 1rem 1rem !important;
    margin: 0 0 1rem 0 !important;
    -webkit-box-shadow: 0 0 0 0 #000;
    box-shadow: 0 0 0 0 #000;
}

legend.customDocFieldSet {
    font-size: 0.9em !important;
    font-weight: bold !important;
    text-align: left !important;
    width: auto;
    padding: 0 10px;
    border-bottom: none;
}

fieldset.disable-email-notification-border {

    background: #FBFBFB;
    border: 1px solid #E9ECEF !important;
    border-radius: 3px;
    padding: 0 1rem 1rem 1rem !important;
    margin: 0 0 1rem 0 !important;
    -webkit-box-shadow: 0 0 0 0 #000;
    box-shadow: 0 0 0 0 #000;
}

legend.disable-email-notification-border {
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: left !important;
    width: auto;
    padding: 0 10px;
    border-bottom: none;
}

legend.admin-disable-email-notification-border {
    font-size: 13px !important;
    /*font-weight: 500 !important;*/
    text-align: left !important;
    width: auto;
    padding: 0 10px;
    border-bottom: none;
}



/*
fieldset.customDocFieldSet {
    margin: 8px;
    border: 1px solid silver;
    padding: 8px;
    border-radius: 4px;
}
legend.customDocFieldSet {
    padding: 2px;
}
*/
.mod-detail-wrapper {
    border: 1px solid #004D75;
    padding-bottom: 10px;
}

.mod-detail-wrapper-new-inner {
    background: #FFFFFF;
    border: 2px solid #004D75;
    line-height: 28px;
    margin: 8px auto;
    padding: 10px;
    text-align: center;
    width: 380px;
}

.mod-detail-wrapper-new-inner-mobile {
    background: #FFFFFF;
    border: 2px solid #004D75;
    line-height: 28px;
    margin: 8px auto;
    padding: 10px;
    text-align: center;
}

.frame2-title {
    font-size: 14px !important;
    line-height: 30px;
    background: #FFFFFF;
    padding: 2px 4px;
}

.reports-button-set {
    position: relative;
    min-height: 38px;
}

input[type=radio]:checked + label.ui-button.ui-state-disabled {
    cursor: not-allowed;
    opacity: 0.40;
    filter: alpha(opacity=65);
    -webkit-box-shadow: 0 0 0 100px rgba(0,71,186,.90) inset;
    box-shadow: 0 0 0 100px rgba(0, 71, 186, 1) inset;
}

input[type=radio]:checked + label.ui-button.ui-state-disabled > span {
    color: #FFF;
}

input[type=radio]:checked + label.ui-button.ui-state-active {
    -webkit-box-shadow: 0 0 0 100px rgba(0, 83, 217, 1) inset;
    box-shadow: 0 0 0 100px rgba(0, 83, 217, 1) inset;
    color: #FFF;
}

.multiselect-container > li > a > label.checkbox {
    padding: 0 8px 8px 40px;
    height: 100%;
    margin: 0;
    cursor: pointer;
}

.pl-35 {
    padding-left: 35px !important;
}

.ui-datepicker {
    position: relative;
    z-index: 10000 !important;
}

li.select2-selection__choice {
    background-color: #356AC1 !important;
}

/* Styling for Select2 with error */
div.has-error span.select2-selection {
    border-color: #D84315 !important;
}

/* Styling for the kendo drop down (Tested with the combobox. Might be different for other kendo widgets.) */
div.has-error span.k-dropdown-wrap {
    border-color: #D84315 !important;
}

/* Styling for the kendo datepicker (the above assumption was true. The date picker utilizes the k-picker-wrap class instead of the k-drop-wrap) */
div.has-error span.k-picker-wrap {
    border-color: #D84315 !important;
}

/* Styling for the kendo multiselects */
div.has-error div.k-multiselect-wrap {
    border-color: #D84315 !important;
}

/**
 * Red border for kendo editors when a validation error is present.
 */
div.has-error table.k-editor-widget {
	border-color: #D84315 !important;
}

/**
 * Red border for kendo multi-file uploads when a validation error is present.
 */
div.has-error div.k-upload {
	border-color: #D84315 !important;
}

.wizard > .actions > ul > li > a {
    background: #005EF7;
    color: #FFF;
    display: block;
    padding: 7px 12px;
    border-radius: 2px;
    border: 1px solid transparent;
}

.sidebar-default .navigation > li.active > a, .sidebar-default .navigation > li.active > a:hover, .sidebar-default .navigation > li.active > a:focus {
    background-color: #0047BA;
    color: #FFF;
}

.tab-content2 {
    margin-left: 1.2em;
}

.m-25 {
    margin: 25px !important;
}

.m-30 {
    margin: 30px !important;
}

.m-35 {
    margin: 35px !important;
}

.m-40 {
    margin: 40px !important;
}

.mt-25 {
    margin-top: 25px !important;
}

.mt-30 {
    margin-top: 30px !important;
}

.mt-35 {
    margin-top: 35px !important;
}

.mt-40 {
    margin-top: 40px !important;
}

.mb-25 {
    margin-bottom: 25px !important;
}

.mb-30 {
    margin-bottom: 30px !important;
}

.mb-35 {
    margin-bottom: 35px !important;
}

.mb-40 {
    margin-bottom: 40px !important;
}

.ml-25 {
    margin-left: 25px !important;
}

.ml-30 {
    margin-left: 30px !important;
}

.ml-35 {
    margin-left: 35px !important;
}

.ml-40 {
    margin-left: 40px !important;
}

.mr-25 {
    margin-right: 25px !important;
}

.mr-30 {
    margin-right: 30px !important;
}

.mr-35 {
    margin-right: 35px !important;
}

.mr-40 {
    margin-right: 40px !important;
}

.pt-25 {
    padding-top: 25px !important;
}

.pt-30 {
    padding-top: 30px !important;
}

.pt-35 {
    padding-top: 35px !important;
}

.pt-40 {
    padding-top: 40px !important;
}

.pb-25 {
    padding-bottom: 25px !important;
}

.pb-30 {
    padding-bottom: 30px !important;
}

.pb-35 {
    padding-bottom: 35px !important;
}

.pb-40 {
    padding-bottom: 40px !important;
}

.pl-25 {
    padding-left: 25px !important;
}

.pl-30 {
    padding-left: 30px !important;
}

.pl-35 {
    padding-left: 35px !important;
}

.pr-25 {
    padding-right: 25px !important;
}

.pr-30 {
    padding-right: 30px !important;
}

.pr-35 {
    padding-right: 35px !important;
}

.ui-buttonset {
    display: inline;
}

.pamp-info-section {
    padding-left: 14px;
}

#financialReportFiscalDatepicker_browser label, #siteVisitsFiscalDatepicker_browser label, #performanceReportFiscalDatepicker_browser label {
    padding-left: 0;
    padding-right: 0;
}

/* Page Template for the exported PDF */
.page-template {
    font-family: "DejaVu Sans", "Arial", sans-serif;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.page-template .header {
    position: absolute;
    top: 30px;
    left: 30px;
    right: 30px;
    border-bottom: 1px solid #888;
    color: #888;
}

.page-template .footer {
    position: absolute;
    bottom: 30px;
    left: 30px;
    right: 30px;
    border-top: 1px solid #888;
    text-align: center;
    color: #888;
}

.page-template .watermark {
    font-weight: bold;
    font-size: 400%;
    text-align: center;
    margin-top: 30%;
    color: #AAAAAA;
    opacity: 0.1;
    transform: rotate(-35deg) scale(1.7, 1.5);
}

/* Hide the Grid header and pager during export */
.k-pdf-export .k-grid-toolbar, .k-pdf-export .k-pager-wrap {
    display: none;
}

.k-grid-toolbar {
    /*background-color:#ddd;*/
    /*background-color: #0059E9;*/
    border-width: 0 !important;
}

.k-grouping-header {
    background-color: #F2F3F4;
    color: #000;
    border-radius: 0 !important;
}

.k-group-indicator {
    background-color: #FFF;
}

.docusignContainer {
	padding-top: 25px;
	padding-right: 25px;
	padding-bottom: 25px;
	padding-left: 25px;
}

.approval-label {
    margin-left: 5px;
}

/*
Applied to parent rows that will have variable amounts of column divs, each with potentially different heights. Ensures that anything that exists on the
same line will have the same height. This ensures that things can be hidden/displayed in real time and that the resulting gaps will be filled with everything else.

EX.
	<div class="row flex-row">
		<div class="col-md-6">Item 1<br>&nbsp;&nbsp;&nbsp;Subtext</div>
		<div class="col-md-6">Item 2</div>
		<div id="item3Div" class="col-md-6">Item 3</div>
		<div class="col-md-6">Item 4</div>
		<div class="col-md-6">Item 5</div>
	</div>

----------------------------------

	Item 1				Item 2
	   Subtext
	Item 3				Item 4
	Item 5

-----------------------------------

	$("#item3Div").hide();

----------------------------------

	Item 1				Item 2
	   Subtext
	Item 4				Item 5

------------------------------------

But without flex-row, then the above will look like this:


	Item 1				Item 2
	   Subtext
						Item 3
	Item 4				Item 5

-----------------------------------

	$("#item3Div").hide();

----------------------------------

	Item 1				Item 2
	   Subtext
						Item 4
	Item 5

 */
.flex-row {
	display: flex;
	flex-wrap: wrap;
}


[data-toggle="collapse"] .icon-circle-down2:before{
    content: "\ede4";
}

[data-toggle="collapse"].collapsed .icon-circle-down2:before{
    content: "\ede6";
}

legend {
    font-size: 14px;
    text-transform: capitalize;
}

#status {
    font-size: 14px;
}

.k-grid-viewModificationAction > span.icon-eye {

    margin-right: 3px;
}

.k-grid-editModificationAction > span.icon2-pencil5 {

    margin-right: 3px;
}

/* For Document List*/

.type-document{
    width:100%;
    margin-bottom:20px;
}

.documents {
    padding:20px;
}

.tab-content2 {
    background-color: #fff;
    border: 1px solid #dce2e9;
    border-radius: 4px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-top: none;
}

.tab-content2 > .tab-pane {
    display: none;
}

.tab-content2 > .active {
    display: block;
}

.document {
    float: left;
    width: calc(100% - 10px);
    max-width: 320px;
    margin: 0px 10px 20px;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #dce2e9;
}


.document .document-body {
    height: 130px;
    /*text-align: center;*/
    border-radius: 5px 5px 0 0;
    background-color: #fdfdfe;
    display: flex;
    flex-direction: column;
    flex-shrink: ;
}

.document .document-body a.text-default {
    margin: auto;
}

.document .document-body i {
    font-size: 45px;
    /*line-height: 120px;*/
}

.bg-rti {
   /* background-color: #010073;*/
    //background-color: #0053d9;
    background: rgb(242,242,248);
    background: linear-gradient(50deg, rgba(242,242,248,1) 0%, rgba(13,106,255,1) 49%, rgba(0,83,217,1) 100%);

}

.document-label {
    border-radius: 5px;
}

.document .document-body img {
    width: 100%;
    height: 100%;
}

.document .document-footer {
    border-top: 1px solid #ebf1f5;
    height: 50px;
    padding: 5px 5px;
    border-radius: 0 0 3px 3px;
}

.document .document-footer .document-name {
    display: block;
    margin-bottom: 0;
    font-size: 15px;
    font-weight: 600;
    width: 100%;
    line-height: normal;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.document .document-footer .document-description {
    display: block;
    margin-top: -1px;
    font-size: 11px;
    font-weight: 600;
    color: #8998a6;
    width: 100%;
    line-height: normal;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.document.info .document-footer >*, .document.success .document-footer >*,
.document.danger .document-footer >*, .document.warning .document-footer >*,
.document.dark .document-footer >* {
    color: #fff;
}

.document.info .document-footer {
    background-color: #2da9e9;
}

.document.success .document-footer {
    background-color: #0ec8a2;
}

.document.warning .document-footer {
    background-color: #ff9e2a;
}

.document.danger .document-footer {
    background-color: #f95858;
}

.document.dark .document-footer {
    background-color: #314557;
}

@media screen and (max-width: 600px) {
    .document  {
        width: 100%;
        margin: 5px 0;
        max-width: none;
    }
}

.dropdown-menu {
    min-width: 205px;
    padding: 7px 0;
    color: #333333;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.document.document-body > span:after {
    line-height:100px;
}

.document .document-body span.label {
    margin-right: 5px;
}

/*.navbar-brand > img {
    margin-top: 2px;
    height: 25px;
}*/

.navbar-brand {
    float: left;
    padding: 2px 20px;
    font-size: 14px;
    line-height: 20px;
    height: 46px;
}

img {
    image-rendering: -webkit-optimize-contrast
}

.kendo-export-btn {
    margin-left: auto;
    order: 2;
}

.kendo-command-button {
    width: 60px;
}


.page-container {
    position: relative;
    padding: 20px 20px;
    padding-bottom: 20px;
}



