﻿.abs-btn-danger {
    width: 80px;
    height: 30px;
    text-align: center;
    background: #DA1F33;
    color: #fff;
    font-weight: bold;
    margin-left: 10px;
}

    .abs-btn-danger:hover {
        color: #fff;
        border-color: white;
    }

.abs-btn-secondary {
    width: 80px;
    height: 30px;
    text-align: center;
    background: white;
    border: 1px solid black;
    margin-left: 10px;
}

    .abs-btn-secondary:hover {
        border-color: white;
    }


@media (min-width: 1243px) {
    .landing-page-container {
        margin-right: 30px;
    }

    #page-wrapper {
        position: inherit;
        min-height: calc(100vh - 75px);
    }

    .expand-collapse-switch .k-switch-container {
        width: 54px;
    }

    .navbar-static-side {
        z-index: 2001;
        width: 220px;
    }

    .side-menu-push {
        margin-left: 220px;
    }

    .navbar-top-links .dropdown-messages,
    .navbar-top-links .dropdown-tasks,
    .navbar-top-links .dropdown-alerts {
        margin-left: auto;
    }
}

@media (max-width: 1243px) {

    .landing-page-container {
        margin-right: 0px;
    }

    .add-file .upload-section {
        padding-left: 40px;
        padding-right: 40px;
    }

    .expand-collapse-switch .k-switch-container {
        width: 42px;
    }

    #page-wrapper {
        position: inherit;
        margin: 0 0 0 0;
        min-height: calc(100vh - 75px);
        width: 100%;
    }

    .body-small .navbar-static-side {
        display: block;
        z-index: 2001;
        width: 0;
        overflow: hidden;
    }

    .body-small.mini-navbar .navbar-static-side {
        display: block;
        overflow: visible;
    }

    .lock-word {
        display: none;
    }

    .navbar-form-custom {
        display: none;
    }

    .navbar-header {
        display: inline;
        float: left;
    }

    .sidebar-panel {
        z-index: 2;
        position: relative;
        width: auto;
        min-height: 100% !important;
    }

    .sidebar-content .wrapper {
        padding-right: 0;
        z-index: 1;
    }

    .fixed-sidebar.body-small .navbar-static-side {
        display: none;
        z-index: 2001;
        position: fixed;
        width: 220px;
    }

    .fixed-sidebar.body-small.mini-navbar .navbar-static-side {
        display: block;
    }

    .ibox-tools {
        float: none;
        text-align: right;
        display: block;
    }

    .navbar-static-side {
        display: none;
    }

    .side-menu-push {
        margin-left: 0px;
    }

    body:not(.mini-navbar) {
        -webkit-transition: background-color 500ms linear;
        -moz-transition: background-color 500ms linear;
        -o-transition: background-color 500ms linear;
        -ms-transition: background-color 500ms linear;
        transition: background-color 500ms linear;
        background-color: #f3f3f4;
    }
}

.project-container .row {
    padding: 0px 25px 20px 35px;
}

.project-container .k-window {
    top: 50% !important;
    left: 50% !important;
}


.project-container .k-window-title {
    line-height: 0;
}

.project-container .k-window-titlebar {
    border: none;
}

.project-container .display-input-container {
    padding-bottom: 0px;
}

.project-navigation-container {
    margin: 12px 0px;
    padding: 2px;
}

a.project-navigation-button {
    color: orangered;
    border-top: 1px solid orangered;
    border-bottom: 1px solid orangered;
    border-left: 0px;
    border-right: 0px;
    background-color: transparent;
    margin: 10px -2px;
    padding: 4px 18px;
    text-decoration: none;
}

    a.project-navigation-button:first-child {
        border: 1px solid orangered;
    }

    a.project-navigation-button:last-child {
        border: 1px solid orangered;
    }

    a.project-navigation-button.active {
        background-color: orangered;
        color: #ffff;
    }

.save-cancel-container {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 5px;
    padding-top: 5px;
}

    .save-cancel-container .button-item {
        padding: 4px 10px;
    }

.breadcrumb-header {
    background-color: #ffff;
    border: 1px solid #a9a9a9;
    padding: 15px;
    margin: 0px 0px 10px 0px;
    text-align: left;
    /*margin-left:-50%;
    margin-right:-50%;*/
}

.display-input-container {
    border-radius: 10px;
    background-color: #ffff;
    padding-top: 15px;
    padding-bottom: 15px;
}

    .display-input-container.status-container {
        padding-left: 40px;
    }


.strike {
    display: block;
    /*text-align: center;*/
    overflow: hidden;
    white-space: nowrap;
    margin: 10px 0px;
    font-weight: 900;
}

    .strike > span,
    .strike > h3 {
        position: relative;
        display: inline-block;
    }

        .strike > span:before,
        .strike > span:after,
        .strike > h3:before,
        .strike > h3:after {
            content: "";
            position: absolute;
            top: 50%;
            width: 9999px;
            height: 1px;
            background: #a9a9a9;
        }

        .strike > span:before,
        .strike > h3:before {
            right: 100%;
            margin-right: 15px;
        }

        .strike > span:after,
        .strike > h3:after {
            left: 100%;
            margin-left: 15px;
        }

h4 {
    display: inline-block;
    text-align: left;
    font-family: Montserrat, sans-serif;
    color: black;
    opacity: 1;
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 15px;
    text-transform: uppercase;
    padding-right: 15px;
    padding-left: 50px;
}

.section-validation {
    display: inline;
    color: #ed5565 !important;
    font-style: italic;
}

.exclamation-circle {
    vertical-align: text-bottom;
}

.form-group {
    margin-bottom: 15px;
    padding-right: 25px;
    color: black;
}

.row {
    padding-left: 35px;
    padding-right: 25px;
}

body {
    color: black;
}

.text-danger {
    display: block;
}

label.required:after {
    content: "*";
    color: black;
    padding-left: 5px;
}

.title {
    color: lightgray;
}

.container-fluid {
    padding-left: 40px;
    padding-right: 40px;
}

.contract-client-chkbx {
    padding-top: 24px;
}

.imo-search-btn {
    display: inline;
    vertical-align: bottom;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    white-space: nowrap;
    background-color: #e9ecef;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}

.imo-search-field {
    white-space: nowrap;
}

    .imo-search-field input {
        display: inline;
        width: 75% !important;
    }

#classSocietyOtherDiv,
#capScopeOther {
    padding-top: 10px;
}

textarea {
    width: 100% !important;
    height: 200px;
}

label {
    display: block;
}

.k-textbox:not(.light-grid, .k-textbox, .k-grid-search),
.k-dropdown,
.k-numerictextbox,
.k-maskedtextbox,
.k-combobox {
    width: 100% !important;
}

.k-radio-label {
    margin-right: 15px;
}

.k-multiselect .k-button[role='option'] {
    background-color: #0099cc;
    color: #FFFFFF;
}

.k-window:not(.k-dialog) {
    top: 50% !important;
    left: 50% !important;
}

#window {
    padding-top: 0px;
    margin-top: 0px;
}

.k-window-title:not(.k-dialog, .k-window-title) {
    line-height: 0;
}

.k-window-titlebar:not(.k-dialog, .k-window-titlebar) {
    border: none;
}

.k-notification-success {
    background-color: #C0D8B7;
    border-left: solid;
    border-width: thick;
    border-color: #509E2F;
    border-top: none;
    border-bottom: none;
    border-right: none;
    border-radius: 0px;
}

.k-datepicker {
    width: 100%;
    min-width: 120px;
}

.header-row {
    padding-bottom: 0px;
}

#success-notification {
    padding-top: 10px;
}

.client-field {
    padding-bottom: 20px;
}

    .client-field .k-form-error {
        position: absolute;
        left: 0;
        padding-left: 20px;
        padding-top: 2px;
    }

.edit-icon {
    color: #23c5c8;
}

.action-button {
    border-color: black;
    border-width: 2px;
    background-color: white;
    margin-right: 25px;
}

.toolbar-table {
    padding-left: 30px;
    padding-right: 30px;
}

.light-grid td,
.light-grid th,
.light-grid .k-toolbar {
    background: white;
    border-color: lightgray;
}

.light-grid td,
.light-grid th {
    border-width: 0px 0px 1px 0px;
}

.light-grid,
.light-grid .k-toolbar {
    border-width: 0px 0px 0px 0px;
}

    .light-grid .k-toolbar span.fa-plus {
        padding-top: 5px;
    }

    .light-grid .k-command-cell {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }

.k-button-icontext {
    background-color: #fff;
    border: 2px solid #002a4e;
    color: #002a4e;
    text-align: center;
    margin-right: 2px;
}

    .k-button-icontext .k-icon {
        margin: 0;
    }

.client-details {
    width: 60%;
    margin: auto;
}

    .client-details h3 {
        text-align: center;
        font-family: Montserrat;
        font-weight: 400;
    }

        .client-details h3:first-of-type {
            font-weight: 900;
        }

    .client-details .save-cancel-container {
        padding-right: 50px;
    }

    .client-details .abs-btn-danger {
        width: auto;
    }

.clickable-grid td:not(.k-command-cell):hover {
    cursor: pointer;
}

.task-link-container {
    border: solid;
    border-width: 2px;
    border-radius: 5px;
}

.task-link {
    padding: 10px 5px;
}

.task-icon-container {
    display: inline;
    white-space: nowrap;
}

.task-icon.bi::before {
    color: #FFAD0A;
    padding-right: 5px;
    font-size: 1.33333em;
    line-height: 0.75em;
}

.task-icon {
    white-space: nowrap;
}

.task-text {
    padding-right: 20px;
}

.tasks-container .icon.fa {
    padding-right: 10px;
    color: #FCAC1D;
}

.tasks-progress {
    align-items: baseline;
}

.tasks-container tr td:first-child {
    border-radius: 8px 0px 0px 8px;
}

.tasks-container tr td:last-child {
    border-radius: 0px 8px 8px 0px;
    text-align: right;
    padding-right: 50px;
}

@media only screen and (max-width: 480px) {
    .tasks-container tr td:last-child {
        padding-right: 10px;
    }

    .tasks-container tr td {
        padding: 1px;
    }
}

.tasks-container tbody {
    font-size: 13px;
}

.tasks-container td {
    background-color: white;
}

.tasks-container .k-grid {
    border: none;
    overflow-x: auto;
    overflow-y: hidden;
}

.tasks-container table {
    border-collapse: separate;
    border-spacing: 0px 10px;
    background-color: #F3F3F4;
    border: none;
}

.tasks-container {
    margin: 0px 30px 0px 30px;
}

    .tasks-container .section-heading .collapse-icon {
        align-self: center;
        width: 20px;
    }

    .tasks-container .section-heading h3 {
        flex-grow: 1;
        align-self: center;
        font-size: large;
    }

.section-heading .collapse-icon .fa-chevron-down {
    display: inline-block;
}

.section-heading .collapse-icon .fa-chevron-right {
    display: none;
}

.section-heading.collapsed .collapse-icon .fa-chevron-down {
    display: none;
}

.section-heading.collapsed .collapse-icon .fa-chevron-right {
    display: inline-block;
}

.expand-collapse-switch {
    margin-top: 20px;
    display: inline-flex;
    align-items: center;
}

    .expand-collapse-switch .k-switch {
        margin-left: 20px;
        margin-right: 20px;
        width: 50px;
    }

    .expand-collapse-switch .k-switch-handle {
        background-color: #FCAC1D !important;
        transition: none;
        height: 20px;
        width: 20px;
        bottom: 5px;
    }

    .expand-collapse-switch .k-switch-container {
        background-color: #F9C87D !important;
        height: 20px;
        transition: none;
        border-color: #FCAC1D;
        border-width: thin;
    }

        .expand-collapse-switch .k-switch-container:hover .k-switch-handle {
            background-color: #FCAC1D;
        }

    .expand-collapse-switch .k-switch-on:focus {
        box-shadow: 0 0 1px 2px #ECECEC;
    }

.tasks-container .expand-collapse-switch-container {
    text-align: right;
}

.tasks-container .k-grid-header {
    display: none;
}

.tasks-container .k-grid .k-alt {
    background-color: white;
}

    .tasks-container .k-grid .k-alt:hover {
        background-color: #ECECEC !important;
    }

.tasks-container .section-heading {
    margin-top: 20px;
    margin-bottom: 5px;
    display: flex;
    justify-content: space-between;
}

    .tasks-container .section-heading h3 {
        margin: 0;
    }

.tasks-container th[role='columnheader'] {
    text-decoration: underline;
    color: #000000 !important;
    text-align: center !important;
}

.tasks-container .section tr[role='row'] td {
    border-left: none !important;
    border-right: none !important;
}

.tasks-container .k-header,
.tasks-container .k-grid-header,
.tasks-container .k-link {
    background: white;
    border: none !important;
    font-weight: bold !important;
    padding: 0px !important;
}

.tasks-container .column.value {
    text-align: center;
}

.tasks-container .column.grid-options .dropdown .dropdown-toggle {
    background-color: rgb(0,47,108);
    color: #ffffff;
}

.milestone {
    padding-left: 10px;
    max-width: 50px;
}

.column.status {
    text-align: left;
    padding: 0px;
}

    .project-details-container .badge,
    .column.status .badge {
        color: #ffffff;
        border-radius: 4px;
        padding: 3px;
        width: 90px;
    }

    .column.status.notstarted .badge {
        background-color: #DBDCDD;
        color: black;
    }

    .column.status.inprogress .badge {
        background-color: #ffad0a;
    }

    .column.status.completed .badge {
        background-color: #509e2f;
    }

    .column.status.overdue .badge {
        background-color: #da1f33;
    }

    .column.status.notapplicable .badge {
        background-color: #939598;
    }

.task-group-indicators {
    justify-content: flex-end;
    display: flex;
    width: 175px;
    margin-top: 10px;
}

    .task-group-indicators.overdue .icon {
        color: #da1f33;
    }

    .task-group-indicators * {
        bottom: 0px;
        display: flex;
        justify-content: space-between;
    }

    .task-group-indicators .fa {
        margin-left: 5px;
        margin-top: 5px;
    }

    .task-group-indicators label {
        margin: 0 3px;
    }

.task-progress {
    background-color: white;
    border-width: 1px;
    border-color: lightgrey;
}

    .task-progress .k-state-selected {
        background-color: #FFAD0A;
    }

    .task-progress.cancelled .k-state-selected {
        background-color: #939598;
    }

    .task-progress.completed .k-state-selected {
        background-color: #509E2F;
    }

    .task-progress.completed.cancelled .k-state-selected {
        background-color: #939598;
    }

.progressbar li.pb-completed.cancelled:before {
    background-color: #939598;
}

.progressbar li.pb-active.cancelled:before {
    background-color: #939598;
}

.progressbar li.pb-completed.cancelled + li:after {
    background-color: #939598;
}

.progressbar li.pb-active.cancelled + li:after {
    background-color: #939598;
}

.progress-percent {
    font-size: 24pt;
}

.status-container {
    text-align: left;
    padding-left: 0px;
    padding-right: 40px;
    margin-left: 5px;
}

.milestone-tip {
    padding-top: 50px;
}

    .milestone-tip .milestone {
        padding-left: 5px;
        margin-right: -2px;
    }

.vessel-documents .vessel-files-grid {
    display: none;
    overflow: auto;
}

.column.upload-date {
    text-align: left !important;
    padding-left: 40px !important;
}

.document-grid-tab {
    background-color: white;
    border-style: none none none none;
    margin-left: 30px;
    margin-top: 18px;
    margin-bottom: 12px;
    font-weight: 400;
    border-radius: 0px;
}

    .document-grid-tab:hover {
        background-color: #E6E6E6;
        border-radius: 8px;
    }

.document-grid-tab-selected {
    border-color: #DF444E;
    border-style: none none solid none;
    border-width: 3px;
}

.manage-files {
    border-radius: 8px;
}

.actions {
    display: inline;
    white-space: nowrap;
}

.manage-files .bi {
    border: solid;
    border-width: 2px;
    border-radius: 8px;
    padding: 2px 5px 2px 5px;
}

.manage-files .fas {
    border: solid;
    border-width: 2px;
    border-radius: 4px;
    padding: 4px 5px 4px 5px;
}

.manage-files .fa {
    border: solid;
    border-width: 2px;
    border-radius: 4px;
    padding: 4px 5px 4px 5px;
}

.manage-files .fa-check {
    border: solid;
    border-width: 2px;
    border-radius: 8px;
    padding: 5px 5px 4px 5px;
}

.icon-span {
    padding: 5px;
}

.manage-files .available-x {
    border: none;
    background-color: #FFAD0A;
    -webkit-text-fill-color: white;
    border-radius: 50%;
}

.available-check {
    border: none;
    background-color: #509E2F;
    -webkit-text-fill-color: white;
    border-radius: 50%;
}

.available-text {
    padding-left: 5px;
}

.available-x {
    border: none;
    background-color: #FFAD0A;
    -webkit-text-fill-color: white;
    border-radius: 50%;
    padding: 2px 5px 2px 5px;
}

.available-check {
    border: none !important;
    background-color: #509E2F;
    -webkit-text-fill-color: white;
    border-radius: 50% !important;
    padding: 2px 5px 2px 5px;
}

.manage-files .available-text {
    padding-left: 5px;
}

.manage-files .k-header-column-menu {
    position: relative !important;
    float: right;
}

.manage-files .k-header {
    text-align: left !important;
}

    .manage-files .k-header .k-link {
        margin: 0px !important;
        padding-left: 40px !important;
        bottom: -3px !important;
    }

@media (max-width: 1570px) {
    .manage-files .k-header .k-link {
        padding-left: 20px !important;
    }

    .manage-files tr td:first-child {
        padding-left: 20px;
    }
}

@media (max-width: 1490px) {
    .manage-files .k-header .k-link {
        padding-left: 10px !important;
    }

    .manage-files tr td:first-child {
        padding-left: 10px;
    }
}


@media (min-width: 1570px) {
    .manage-files tr td:first-child {
        padding-left: 40px;
    }
}

.manage-files tr td:first-child {
    text-align: left !important;
}

.abs-documents tr td:last-child {
    text-align: left !important;
}

.manage-files tr td:nth-last-child(2) {
    text-align: left !important;
}

.manage-files tr:last-child td:first-child {
    border-radius: 0px 0px 0px 8px;
}

.manage-files tr:last-child td:last-child {
    border-radius: 0px 0px 8px 0px;
}

.manage-files tr:last-child td:nth-last-child(2) {
    border-radius: 0px 0px 8px 0px;
}

.manage-files .k-menu-vertical {
    display: block;
}

.manage-files .upload-title {
    font-size: 15px;
}

.add-file .k-dropdown-wrap {
    background-color: #F1F1F2;
}

.manage-files .k-list .k-item.k-state-selected, .k-list-optionlabel.k-state-selected {
    background-color: white !important;
    color: black !important;
}

.manage-files .k-grid-search {
    margin-top: 18px;
    margin-right: 25px;
    width: 25%;
}

    .manage-files .k-grid-search .k-input::placeholder {
        color: #E6E6E6;
    }

.manage-files .k-alt {
    background-color: white !important;
}

    .manage-files .k-alt:hover {
        background-color: #ECECEC !important;
    }

.manage-files .k-icon {
    color: black !important;
}

.manage-files .k-state-selected .k-link.k-menu-link {
    background-color: #CED3DB !important;
    color: black;
}

.manage-files .k-menu-item.k-state-selected {
    background-color: #CED3DB !important;
}

.manage-files .k-header-column-menu.k-state-active {
    background-color: #F3F3F4 !important;
}

.manage-files table {
    border-collapse: collapse !important;
}

.manage-files .section {
    margin: 15px;
}

.vessel-upload-date {
    text-align: left !important;
    padding-left: 40px !important;
}

#FileManagementGrid {
    overflow: auto;
}

.file-upload {
    background-color: white;
    border-radius: 8px;
}

.select-file-placeholder {
    background-color: #F1F1F2;
    font-style: italic;
    text-align: center;
    padding-top: 25px;
    padding-bottom: 25px;
    border-radius: 8px;
}

.uploader {
    display: none;
    border-radius: 8px;
}

.upload-section {
    padding-left: 12px;
    padding-right: 100px;
    line-height: 30px;
}

.upload-header {
    padding-top: 15px;
}

.upload-title {
    padding-left: 35px;
}

.add-file .k-dropzone-hint {
    text-align: left;
    padding-left: 20px;
    margin: auto;
    font-style: italic !important;
    content: 'Drop files here' !important;
}

.add-file .k-dropzone {
    background-color: white !important;
    border-radius: 8px !important;
    padding: 25px 25px 25px 20px !important;
}

.add-file .k-upload-button {
    background-color: white !important;
    width: 160px;
    border-color: black;
    border-width: 1px;
}

.add-file .k-upload {
    border-radius: 8px;
    border-color: #D6DBE2;
}

.uploader {
    border-radius: 8px;
    border-color: #D6DBE2;
}

.add-file {
    padding: 10px 10px 45px 25px;
}

    .add-file .file-upload .k-dropzone {
        padding-left: 0;
    }

    .add-file .form-group label {
        display: block;
    }

    .add-file .form-group .k-dropdown {
        width: 500px;
    }

    .add-file .k-dropzone em {
        display: inline-block;
    }


    .add-file .control-bar {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

/* Control bar */

.manage-files .control-bar {
    margin-bottom: 10px;
}

.control-bar .search-box input {
    width: 400px;
}

/* Grid */

.manage-files .k-grid td {
    overflow: visible;
}

.manage-files th[role='columnheader'] {
    text-decoration: none !important;
    color: #000000 !important;
    white-space: nowrap;
    min-width: 106px;
    background-color: #FAFAFA;
}

.manage-files tr[role='row'] td {
    border-left: none !important;
    border-right: none !important;
}

.manage-files .k-header,
.manage-files .k-grid-header,
.manage-files .k-link {
    background: white;
    border: none !important;
    padding: 0px !important;
}

.manage-files .k-grid-header {
    height: 50px;
    vertical-align: bottom;
}

.manage-files .k-link {
    display: inline;
    background-color: #FAFAFA;
}

.manage-files .k-grid {
    border: none;
    border-radius: 8px;
}

.manage-files .k-grid-toolbar {
    background-color: white;
    border-radius: 8px;
    border-bottom: none;
}

.manage-files .k-grid .k-grouping-header {
    border: none;
    background-color: #E6E6E6;
    font-size: small;
    font-style: italic;
    padding-left: 35px;
}

.manage-files tbody tr {
    border-radius: 0px;
    border-bottom: 1px solid #F3F3F4 !important;
    text-align: center;
}

.manage-files thead tr {
    height: 50px;
}

.grid-update {
    display: none;
}

.abs-documents thead tr th:last-child {
    display: none;
}

/* Columns */

.manage-files .column.grid-options .dropdown .dropdown-toggle {
    background-color: rgb(0,47,108);
    color: #ffffff;
}

.file-management {
    padding-top: 20px;
}

.projects-list .k-rating-container .k-rating-item {
    padding: 4px 0;
}

    .projects-list .k-rating-container .k-rating-item .k-icon {
        font-size: 16px;
    }

.dropdown-country-wrap img {
    margin-right: 10px;
}

.projects-list .k-grid .k-header {
    border: none;
}

.projects-list .k-grid .k-grouping-header {
    border: none;
    background-color: rgba(0,0,0,.05);
    font-size: small;
    font-style: italic;
    padding-left: 30px;
}

.projects-list .k-grid td {
    border-left: none;
    border-right: none;
    border-bottom: none;
    border-top: solid;
    border-width: thin;
    border-color: lightgray;
}

.projects-list .k-grid {
    border: none;
    border-radius: 8px !important;
}

.export-button {
    background-color: white;
    border-color: #002A4E !important;
    color: #002A4E !important;
    border-width: 2px;
    height: 30px;
    width: 93px;
    font-size: 14px;
    font-weight: 500;
    padding-left: 0px !important;
    padding-top: 3px !important;
    margin: 1px 0px 0px 0px;
}

    .export-button .fas {
        align-self: flex-end;
        padding-right: 3px;
    }

.add-project-button {
    width: 130px;
    height: 30px;
    text-align: center;
    background: #DA1F33;
    color: #fff !important;
    font-weight: 500;
    margin-left: 25px;
    font-size: 14px;
    margin-top: 4px;
    border: none;
}

.plus {
    --t: 2px;
    --l: 14px;
    --s: 0px;
    --c1: white;
    --c2: #DA1F33;
    display: inline-block;
    width: var(--l);
    height: var(--l);
    padding: var(--s);
    box-sizing: border-box;
    background: linear-gradient(var(--c1),var(--c1)) content-box, linear-gradient(var(--c1),var(--c1)) content-box, var(--c2);
    background-position: center;
    background-size: 100% var(--t),var(--t) 100%;
    background-repeat: no-repeat;
    background-color: inherit;
    margin-right: 14px;
    margin-top: 3px;
}

.projects-list .k-current-page {
    display: none !important;
}

.projects-list .k-link {
    color: black !important;
    font-size: 14px;
    padding-left: 0px !important;
}


.projects-list .k-state-selected.k-link {
    background-color: #FCAC1D !important;
    border: none !important;
}

.indicator {
    display: inline-block;
    width: 28px;
    height: 24px;
    color: #ffffff;
    background-color: #17B393;
    border-radius: 3px;
    cursor: pointer;
}

.priority {
    text-align: center !important;
    padding-left: 0px;
    padding-right: 5px;
    cursor: pointer;
}

.empty {
    background-color: #63666A;
    margin-top: 5px;
}

.projects-list .status {
    color: white;
    border-radius: 5px;
    text-align: center;
    padding: 2px 10px;
    font-size: 12px;
}

.sister-fields,
.company-billing-fields,
.company-fields,
#classSocietyOtherDiv,
#capScopeOther {
    display: none;
}

.project-link {
    padding: 10px 5px;
}

.project-link-container {
    border: solid;
    border-width: 2px;
    border-radius: 5px;
}

.projects-list .k-icon {
    color: black !important;
}

.update-priority .priority-options .priority {
    display: inline-block;
    width: 30px !important;
    height: 25px !important;
    color: #ffffff;
    background-color: #17B393 !important;
    border-radius: 3px !important;
    padding: 3px;
}

.projects-list .selected {
    border-left: 3px solid #63666A !important;
}

.projects-list .k-grid td.details-td {
    font-size: 12px;
    border-top: none !important;
    border-bottom: solid;
    border-width: 1px;
    border-color: lightgray;
    padding-top: 7px !important;
    padding-bottom: 5px !important;
}

.projects-list .bi {
    margin-right: 8px;
    margin-top: -3px;
    fill: #FCAC1D;
}

.projects-list .k-grid td.k-group-cell {
    border: none;
}

.projects-list .k-grouping-row td {
    border: none;
}

.clipboard-div {
    fill: #FCAC1D;
}

.project-row td {
    padding: 8px 5px 0px 0px;
    font-size: 14px;
}

.projects-list .k-grid .k-grid-search {
    display: flex;
    margin-left: auto;
    margin-right: 0;
}

.comments {
    color: #FCAC1D;
}

.projects-list .k-grid-search input {
    opacity: 50%;
}

.projects-list .k-grid-toolbar {
    padding: 18px 18px 18px 30px;
    border-radius: 8px 8px 0px 0px;
    background-color: white;
    border: none;
}

.projects-list .k-pager-wrap {
    border-radius: 0px 0px 8px 8px;
    background-color: white;
}

.projects-list .k-grid .k-grid-header .k-header .k-link {
    height: auto;
}

.projects-list .k-grid .k-grid-header .k-header {
    white-space: normal;
}

#pageSelect {
    margin-left: 15px;
    border: none;
    background-color: #F5F7F6;
    width: 38px;
    height: 24px;
    font-size: 12px;
    font-weight: 500;
}

.projects-list .k-pager-nav {
    height: 24px !important;
    width: 24px !important;
    min-width: 20px;
    min-height: 20px;
}

.projects-list .k-pager-wrap {
    padding: 15px 25px;
}

.projects-list .k-pager-numbers .k-link {
    height: 24px !important;
    width: 24px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    font-size: 12px;
    font-weight: 500;
}

.projects-list .k-pager-last {
    border-radius: 0;
}

.projects-list .k-pager-first {
    border-radius: 0;
}

#pageSelect * {
    margin-left: 15px;
    border: none;
    background-color: #F5F7F6;
    width: 38px;
    height: 24px;
    font-size: 12px;
    font-weight: 500;
}

#allProjectsGrid {
    overflow: auto;
}

.projects-list .k-header-column-menu.k-state-active {
    background-color: rgba(0,0,0,.075) !important;
}

.additional-files-container,
.projects-list {
    margin: 10px 15px 0px 15px
}

.hidden {
    visibility: hidden;
}

.status-date,
.due-date,
.column.task,
.column.status {
    max-width: 150px;
}

.task-files .k-grid-toolbar {
    display: none;
}

.task-files .k-grouping-header {
    display: none;
}

.task-files.file-upload {
    border-radius: 8px 8px 0px 0px !important;
}

.task-files.file-management {
    border-radius: 0px 0px 8px 8px;
    padding-top: 0px;
    background-color: white;
}

    .task-files.file-management th {
        border-radius: 0px 0px 8px 8px;
        background-color: white;
    }

    .task-files.file-management .k-link {
        background-color: white;
    }

.upload-subheader {
    padding: 10px 0px 25px 35px;
}

.comments-container {
    background-color: white;
    border-radius: 8px;
    padding-bottom: 25px;
    margin-bottom: 13px;
    height: 350px;
}

.comments-header {
    padding: 15px 0px 0px 0px;
}

.comments-subheader {
    display: none;
    padding: 0px 0px 15px 35px;
}

.comments-title {
    padding-left: 35px;
}

.comments-grid-container,
.comments-textarea-container {
    margin-left: 35px;
    margin-right: 25px;
}

.comments-textarea {
    width: 100% !important;
    overflow-y: auto;
}

.comments-save-container {
    color: #A7B1C2;
    display: flex;
    justify-content: flex-end;
    padding-top: 10px;
}

.comments-save.bi {
    padding-right: 5px;
}

comments-textarea-container .bi {
    padding-right: 5px;
}

.comments-save-container.active {
    color: #23C6C8;
    cursor: pointer;
}

#CommentsGrid .k-grid-header {
    display: none;
}

#CommentsGrid .k-alt {
    background-color: white;
}

#CommentsGrid tr:hover {
    background-color: white;
}

#CommentsGrid td,
#CommentsGrid {
    border: none;
    padding: 0px;
}

.comment-details {
    color: #FFAD0A;
}

#CommentsGrid .k-grid tbody .k-grid-edit {
    min-width: 0;
    width: calc(2px + .75rem + 1.5em);
    height: calc(2px + .75rem + 1.5em);
    padding: .375rem;
}

    #CommentsGrid .k-grid tbody .k-grid-edit .k-icon {
        margin: 0;
    }

.hint-label {
    display: flex;
}

.hint-date {
    color: grey;
    font-size: 11px;
    margin-left: 10px;
}

.task-item {
    font-weight: bold;
    padding-bottom: 19px;
}

.task-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.details-form .form-group {
    margin-bottom: 27px;
}


#CommentsGrid .k-button.k-button-icontext,
#CommentsGrid .update,
#CommentsGrid .cancel,
#CommentsGrid .edit,
#CommentsGrid .delete {
    background-color: white;
    border: none;
    color: #23C6C8;
}

#CommentsGrid .k-grid-update,
#CommentsGrid .k-grid-cancel {
    padding: 0px;
}

#CommentsGrid .text-box.single-line:focus-visible {
    outline: none;
}

#CommentsGrid .text-box.single-line:focus-visible {
    border-color: #DEDFDF;
}

#CommentsGrid .text-box.single-line {
    padding: 0px 5px 0px 5px;
}

.comments-textarea-container {
    padding-top: 15px;
}

textarea.comments-textarea {
    height: 75px !important;
}

.comment,
.comment-details {
    font-size: 13px;
}

#CommentsGrid {
    overflow-y: auto;
    max-height: 130px;
}

.upload-title,
.comments-title {
    font-size: 15px;
}

.invoicing-task-container hr {
    margin-top: 6px;
    margin-bottom: 15px;
}

.invoicing-task-container .display-input-container {
    margin-bottom: 13px;
}

.task-files .add-file {
    padding-left: 60px;
}

#Comment {
    border-radius: 4px;
}

.invoicing-task-container h4 {
    color: black;
    font-size: 15px;
    font-weight: 600;
    padding-left: 35px;
}

.additional-files-container .form-group {
    padding-left: 27px;
}

.invoicing-task-container .k-select,
.invoicing-task-container .k-dropdown-wrap {
    background-color: #F5F5F5;
}

.landing-page-container h4 {
    padding-left: 35px;
}

.activity-section .col-lg-8 {
    padding: 0px;
}

.revenue-project-row {
    padding: 0px;
    display: flex;
}

.report-details-section {
    margin-bottom: 50px;
}

.details-section,
.activity-section {
    display: flex;
    margin-bottom: 15px;
}

.landing-container {
    padding: 14px 0px 0px 0px;
    border-radius: 8px;
    background-color: white;
    margin: 5px;
}

    .landing-container h4,
    .project-container h4 {
        font-weight: 400;
        margin-bottom: 4px;
    }

.landing-button-container .button-delete {
    background-color: #DF444E;
    border: none;
    border-radius: 7px;
    color: white;
    padding: 10px 11px;
    margin-left: 5px;
}

.landing-button-container .button-cancel {
    border-width: 2px;
    background-color: white;
    border-radius: 7px;
    font-size: 15px;
    padding: 4px 25px;
}

.landing-button-container .button-close {
    background-color: #509E2F;
    border-radius: 7px;
    font-size: 15px;
    padding: 4px 25px;
    color: white;
    border: none;
}

.landing-button-container .button-reassessment {
    border-width: 2px;
    background-color: white;
    border-radius: 7px;
    font-size: 15px;
    padding: 4px 25px;
}

.landing-button-container {
    align-self: center;
    margin-right: 2px;
}

.landing-page-container .row,
.project-container .row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-right: 0px;
    align-self: center;
    margin: 0px;
}

.project-container .display-input-container .row {
    justify-content: initial;
}

.landing-page-container .row .breadcrumb,
.project-container .row .breadcrumb {
    margin-top: 4px;
    margin-bottom: 10px;
    color: #A7B1C2;
}

.landing-page-container .status-container {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    padding: 0px;
}

.landing-page-container .display-input-container {
    padding: 0px;
}

.landing-page-container #status-bar-container {
    padding-left: 20px;
}

.landing-page-container .task-progress {
    width: 270px;
    margin-right: 42px;
}

.landing-page-container .progress-percent-container {
    padding-left: 20px;
}

.landing-page-container .progressbar li {
    display: flex;
    width: 370px !important;
    align-items: center;
    padding-top: 30px;
}

    .landing-page-container .progressbar li:last-child {
        margin-bottom: 50px;
    }

.landing-page-container ul {
    display: block;
    padding-left: 30px;
}

.landing-page-container .progressbar li::after {
    width: 7px;
    height: 100%;
    content: '';
    position: absolute;
    background-color: #dbdcdd;
    top: -11px;
    left: 5%;
    z-index: 0;
}

.landing-page-container .progressbar li::before {
    margin-left: 0px;
    margin-right: 15px;
}

.progress-section-title {
    font-size: 14px;
    padding-bottom: 12px;
}

.progress-details {
    font-size: 12px;
    font-style: italic;
    color: #A7B1C2;
    padding-bottom: 12px;
}

.cap-type-details hr,
.vessel-details hr,
.contact-abs-details hr {
    color: #FFAD0A;
    background-color: #FFAD0A;
    margin-top: 8px;
    margin-bottom: 5px;
    margin-left: 0px;
    height: 1px;
    width: 18px;
}

.cap-type-details h4,
.vessel-details h4,
.contact-abs-details h4 {
    padding-left: 0px;
    font-weight: 600;
}

.cap-type-details span,
.vessel-details span,
.contact-abs-details span {
    display: block;
    color: black;
}

.cap-type-details,
.vessel-details,
.contact-abs-details {
    padding-left: 50px;
}

.cap-type-details-container,
.vessel-details-container,
.contact-abs-details-container {
    display: flex;
    padding-top: 20px;
}

.project-details-comments-container hr {
    display: none;
}

.project-details-comments-container h4 {
    font-size: 13px;
    font-weight: 600;
}

.project-details-comments-container .comments-header {
    margin-bottom: 15px;
}

.report-details-datebox,
.report-details-textbox {
    display: none;
}

.grades-display-container .k-progressbar .k-state-selected {
    background-color: #DBDCDD;
}

.grades-display-container {
    padding-right: 15px;
}

#FinalGrade {
    width: 100%;
}

.grades-col-1 {
    display: flex;
    justify-content: space-between;
    padding-right: 20px;
}

.grades-col-2 {
    display: flex;
    justify-content: space-between;
    padding-left: 0px;
}

.grades-display-container .k-progressbar {
    margin-bottom: 30px;
}

.grade-text-value {
    font-weight: 600;
}

    .grade-text-value.final-gradeOne,
    .grade-text-value.final-gradeTwo,
    .grade-text-value.grade1,
    .grade-text-value.grade2,
    .grade-text-value.grade3,
    .grade-text-value.grade4 {
        color: #509E2F;
    }

    .grade-text-value.final-gradeThree,
    .grade-text-value.grade5,
    .grade-text-value.grade6,
    .grade-text-value.grade7,
    .grade-text-value.grade8,
    .grade-text-value.grade9 {
        color: #FFAD0A;
    }

    .grade-text-value.final-gradeFour,
    .grade-text-value.final-gradeFive,
    .grade-text-value.grade10 {
        color: #DF444E;
    }

.grades-display-container .k-progressbar.final-gradeOne,
.grades-display-container .k-progressbar.final-gradeTwo,
.grades-display-container .k-progressbar.grade1,
.grades-display-container .k-progressbar.grade2,
.grades-display-container .k-progressbar.grade3,
.grades-display-container .k-progressbar.grade4 {
    background-color: #509E2F;
}

.grades-display-container .k-progressbar.final-gradeThree,
.grades-display-container .k-progressbar.grade5,
.grades-display-container .k-progressbar.grade6,
.grades-display-container .k-progressbar.grade7,
.grades-display-container .k-progressbar.grade8,
.grades-display-container .k-progressbar.grade9 {
    background-color: #FFAD0A;
}

.grades-display-container .k-progressbar.final-gradeFour,
.grades-display-container .k-progressbar.final-gradeFive,
.grades-display-container .k-progressbar.grade10 {
    background-color: #DF444E;
}

.report-details .row {
    margin-bottom: 25px;
}

.report-details span {
    font-weight: 600;
}

.report-details-container .section-heading button {
    border: none;
    background-color: white;
    color: #23C6C8;
}

.report-details-container .update {
    display: none;
    font-size: 20px;
}

.report-details-container .cancel {
    display: none;
    font-size: 20px;
}

.report-details-container .edit {
    font-size: 15px;
}

.landing-page-container a[role="link"] {
    display: block;
    text-align: center;
    bottom: 15px;
    position: absolute;
    width: 100%;
    text-decoration: underline;
}

.landing-page-container hr,
.project-container hr {
    margin-top: 6px;
}

.report-details-textbox.k-input {
    width: 75% !important;
}

.report-details-datebox .k-picker-wrap {
    width: 88% !important;
}

.grades-edit-container {
    display: none;
}

.grading-selection {
    border: none;
    border-radius: 3px;
    margin-right: 10px;
    background-color: #DBDCDD;
}

#grade-edit-table .row-alt {
    background-color: #F1F1F2;
}

#grade-edit-table td:first-child label {
    padding-left: 50px;
    padding-top: 7px;
    min-width: 170px;
}

#grade-edit-table tr:last-child td:last-child li:last-child {
    padding-right: 60px;
}

#grade-edit-table {
    list-style-type: none;
    margin: auto;
    padding: 0;
}

    #grade-edit-table li {
        float: left;
        width: 25px;
        height: 30px;
        position: relative;
        margin-left: 15px;
        margin-top: 7px;
        list-style-type: none;
    }

        #grade-edit-table li label, #grade-edit-table input {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }

            #grade-edit-table input[type="radio"] {
                opacity: 0.011;
                z-index: 100;
            }

                #grade-edit-table input[type="radio"]:checked + label {
                    background-color: #FFAD0A;
                }

        #grade-edit-table li label {
            z-index: 90;
            background-color: #ddd;
            padding-top: 2px;
            padding-bottom: 2px;
            width: 25px;
            text-align: center;
            font-size: 12px;
            border: none;
            border-radius: 3px;
            cursor: pointer;
        }

            #grade-edit-table li label:hover {
                background-color: #ced3db;
            }

.grades-subheader {
    text-align: center;
    font-style: italic;
}

.badge.Contracted {
    background-color: #DBDCC6;
    color: black;
}

.badge.Open {
    background-color: #71C2FF;
    color: black;
    width: 55px;
}

.badge.Active {
    background-color: #5E8CCA;
    width: 55px;
}

.badge.ToBeClosed {
    background-color: #509E2F;
    width: 130px;
}

.badge.Ready.for.Closure {
    background-color: #509E2F;
    width: 130px;
}

.badge.Closed {
    background-color: #002A4E;
    width: 55px;
}

.badge.Cancelled {
    background-color: #939598;
}

.vessel-history {
    font-size: 0px;
    padding-left: 35px;
    margin-top: 40px;
    margin-bottom: 30px;
}

    .vessel-history span {
        font-size: 13px;
    }

.project-details-container .section-heading-details {
    font-size: 10px;
    font-style: italic;
    color: #A7B1C2;
}

.project-details-container,
.report-details-container {
    max-width: 49.4%;
    min-width: 486px;
}

.project-files-container,
.report-details-container {
    margin-right: 0px;
}

.project-files-container,
.revenue-tracker-container {
    margin-left: 15px;
    max-width: 47.5%;
}

.revenue-image-container {
    text-align: center;
    margin-bottom: 20px;
}

    .revenue-image-container img {
        width: inherit;
    }

.revenue-details-container {
    margin: 0 30px 75px 30px;
}

    .revenue-details-container span {
        float: right;
        padding-right: 10px;
    }

    .revenue-details-container label {
        display: inline;
        padding-left: 10px;
    }

.project-files-none-available {
    text-align: center;
    margin-top: 40px;
}

    .project-files-none-available span {
        font-style: italic;
    }

    .project-files-none-available button {
        margin-top: 10px;
        color: black;
        background-color: white;
        border-radius: 5px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

    .project-files-none-available i {
        padding-right: 5px;
    }


.project-files-section i {
    color: #A7B1C2;
    cursor: pointer;
}

.project-files-section button i {
    color: black;
}

.project-files-section button {
    background-color: white;
    border-radius: 5px;
    padding: 5px 8px;
    margin-bottom: 10px;
}

.project-files-section {
    margin: 40px 30px 75px 30px;
    display: flex;
    align-items: center;
    font-size: 10px;
}

.project-files {
    display: flex;
    align-items: flex-start;
}

.project-file {
    width: 80px;
    margin-right: 5px;
}

.upload-files {
    display: none;
    margin-bottom: 50px;
}

.project-files-partial {
    margin-bottom: 50px;
}

.upload-files .add-file.row {
    display: block;
}

.upload-files .upload-section {
    margin: auto;
    padding: 0px;
}

.upload-files .form-group {
    margin: auto auto 20px auto;
    padding: 0px;
    width: 200px;
    max-width: 200px;
}

.upload-files .k-dropzone {
    display: block;
    text-align: center;
}

    .upload-files .k-dropzone .k-upload-button {
        margin-bottom: 10px;
    }

.upload-files .k-upload-status {
    justify-content: center;
}

.project-activity-container {
    margin-left: 15px;
    margin-right: 0px;
    max-width: 98%;
}

ol.breadcrumb {
    color: grey;
    align-items: baseline;
}

ol li.breadcrumb-item:last-child {
    font-weight: bold;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: "\f054";
    font-weight: 600;
    font-family: 'Font Awesome 5 Free';
}

.activity-grid {
    font-size: 12px;
}

    .activity-grid thead {
        display: none;
    }

    .activity-grid .change-time {
        color: grey;
        font-style: italic;
    }

.project-activity-partial {
    font-weight: 600;
    margin-left: 30px;
    margin-right: 30px;
}

    .project-activity-partial .k-grid-header {
        border-width: 0px;
    }

    .project-activity-partial .k-grid-content {
        overflow-y: auto;
    }

.project-activity-container hr {
    margin-bottom: 0px;
}

.project-activity-partial tr {
    display: none;
}

.project-activity-partial table tr:nth-child(-n+9) {
    display: table-row;
}

.project-activity-partial #ActivityGrid col:first-child {
    width: 25% !important;
}

.project-activity-partial #ActivityGrid col:last-child {
    width: 15% !important;
}

.project-activity-partial tr:nth-child(9) td {
    border-width: 0px;
}

.landing-page-container .section-heading {
    display: flex;
    align-content: center;
    justify-content: left;
    align-items: flex-start;
}

    .landing-page-container .section-heading span {
        margin-top: 3px;
        margin-right: 2px;
    }

    .landing-page-container .section-heading button {
        margin-top: 3px;
    }

button {
    cursor: pointer;
}

.workflow-container {
    min-width: 461px;
    max-width: 461px;
    height: 826px;
}

@media (max-width: 1000px) {
    .revenue-project-row,
    .activity-section,
    .details-section {
        flex-wrap: wrap;
    }

    .project-details-container,
    .report-details-container {
        max-width: 99.2%;
    }

    .project-files-container,
    .revenue-tracker-container {
        max-width: 99.2%;
    }

    .landing-page-container {
        margin-right: 0px;
    }
}

@media (max-width: 1600px) {
    .revenue-project-row {
        flex-wrap: wrap;
    }

    .project-files-container,
    .revenue-tracker-container {
        max-width: 99.2%;
        flex-basis: 100%;
    }
}

@media (min-width: 1600px) {
    .revenue-project-row {
        flex-wrap: nowrap;
    }

    .project-files-container,
    .revenue-tracker-container {
        max-width: 48%;
        flex-basis: inherit;
    }
}

@media (max-width: 600px) {
    .project-details-container,
    .report-details-container,
    .activity-section,
    .details-section {
        overflow: auto;
    }
}

.project-files-container {
    margin-right: 0px;
}

.revenue-project-row-container a[role=link] {
    margin-top: 50px;
    position: relative;
}

.workflow-container a[role=link] {
    width: 461px;
    bottom: 0px;
    position: relative;
    display: flow-root;
}

.workflow-container #status-bar-container {
    height: 615px;
}



.filter-dark-blue {
    filter: invert(12%) sepia(75%) saturate(1433%) hue-rotate(183deg) brightness(65%) contrast(103%);
}

.login-logo {
    height: 50px;
    width: initial;
}

.red-line {
    height: 5px;
    width: 25px;
    border-bottom: 3px solid red;
}

.change-password {
    width: 60%;
}

    .change-password h4 {
        display: block;
        text-align: center;
        font-family: Montserrat;
        font-weight: 400;
    }

        .change-password h4:first-of-type {
            font-weight: 700;
        }

.right-buttons {
    justify-content: flex-end;
}

.navbar .container {
    padding-right: 150px;
}

.grades-progressbar-col-2 {
    padding-left: 0px;
}

.client-landing-page-container .display-input-container {
    height: 135px;
    margin-left: 20px;
    margin-bottom: 20px;
    width: 97%;
}

.client-project-details-container {
    width: 72%;
}

    .client-project-details-container img {
        padding-top: 20px;
    }

    .client-project-details-container .vessel-details,
    .client-project-details-container .cap-type-details,
    .client-project-details-container .contact-abs-details {
        padding-left: 20px;
    }

    .client-project-details-container .vessel-details-container,
    .client-project-details-container .cap-type-details-container,
    .client-project-details-container .contact-abs-details-container {
        padding-right: 15px;
        padding-left: 5px;
        padding-top: 10px;
        padding-bottom: 60px;
    }

.client-project-details-container {
    margin-right: 15px;
}

.client-landing-page-container .details-section {
    margin-left: 15px;
    width: 97.7%;
}

.client-project-files-container {
    width: 28%;
    min-width: 350px;
}

.client-report-details-container {
    width: 97%;
    margin-left: 20px;
    padding-bottom: 20px;
}

    .client-report-details-container .client-report-details-message {
        display: block;
        padding-left: 35px;
    }

    .client-report-details-container .grades-display-container {
        padding-top: 40px;
    }

    .client-report-details-container .final-grade-label {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding-left: 16px;
        width: 600px;
    }

    .client-report-details-container .final-grade-progressbar,
    .client-report-details-container .final-grade-progressbar .col-12 {
        padding-left: 8px;
        padding-right: 0px;
    }

    .client-report-details-container #FinalGradeClient {
        width: 568px;
    }


    .client-report-details-container .report-details-section {
        margin-bottom: 0px;
    }

    .client-report-details-container .report-details,
    .client-report-details-container .report-details .row {
        padding-left: 0px;
        padding-right: 0px;
    }

.client-landing-page-container a[role=link] {
    display: block;
    text-align: center;
    bottom: 15px;
    position: relative;
    width: 100%;
    text-decoration: underline;
}

.project-files-complete {
    text-align: center;
}

#complete-files-button {
    margin-top: 20px;
    border: none;
    border-radius: 4px;
    padding: 5px 10px;
    color: white;
    background-color: #DF444E;
}

.client-upload-message-container {
    display: flex;
    align-items: center;
    height: 90px;
}

    .client-upload-message-container img {
        padding-right: 30px;
    }

.top-row {
    margin-top: 49px;
    display: flex;
    padding-right: 11px;
}

.report-tabs {
    display: flex;
    font-family: 'Open Sans';
    gap: 49px;
    padding-right: 0px;
    justify-content: flex-end;
}

    .report-tabs .tab-icon {
        width: 50px;
        height: 64px;
    }

    .report-tabs [data-flag='recently-issued'] .tab-icon,
    .report-tabs [data-flag='issued'] .tab-icon {
        background: url('/images/icons8-certificate.svg') no-repeat;
        background-size: contain;
    }

    .report-tabs [data-flag='in-progress'] .tab-icon,
    .report-tabs [data-flag='contracted'] .tab-icon {
        background: url('/images/icons8-survey.svg') no-repeat;
        background-size: contain;
    }

    .report-tabs .tab-text {
        margin-left: -6px;
        margin-right: -18px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .report-tabs > div {
        display: flex;
        background: white;
        border-radius: 8px;
        width: 212px;
        height: 143px;
        padding: 32px 26px 26px 26px;
        text-align: center;
        box-shadow: 3px 6px 10px #0000001C;
    }

    .report-tabs .count {
        font-size: 39px;
        margin-top: -18px;
        margin-bottom: 10px
    }

.big-welcome {
    font-family: Montserrat;
    font-size: 35px;
    color: #FFAD0A;
}

.project-status .badge {
    font: normal 12px 'Open Sans';
    color: white;
    padding: 1px 5px;
    margin: 0 2px;
}

.servicerequest > .badge {
    color: black;
    background-color: #DBDCDD;
}

.recordreview > .badge {
    background-color: #1AB394;
}

.engineeringanalysis > .badge {
    background-color: #5E8AB4;
}

.survey > .badge {
    background-color: #002A4E;
}

.strengthanalysis > .badge {
    background-color: #FFAD0A;
}

.certificateissued > .badge {
    background-color: #71C2FF;
}

.reportissued > .badge {
    background-color: #509E2F;
}

.donut-chart,
.donut-wrapper {
    width: 130px;
    height: 170px;
}

.donut-text {
    position: absolute;
    top: 58px;
    left: 50%;
    width: 100px;
    height: 100px;
    margin-top: -50px;
    margin-left: -50px;
    font-size: 16px;
    line-height: 100px;
    vertical-align: middle;
    text-align: center;
    color: #509E2F;
    font-family: 'Open Sans', 'sans-serif';
    font-weight: bold;
}

.search-row {
    margin-top: 25px;
}

    .search-row > div {
        width: 100%;
    }

    .search-row .search-icon {
        float: right;
        margin-right: 15px;
        margin-top: -24px;
        position: relative;
        z-index: 2;
    }

.vessel-projects {
    display: flex;
    gap: 20px;
    margin-left: 22px;
    margin-top: 25px;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-right: 10px;
}

    .vessel-projects .vessel-card {
        width: 517px;
        height: 282px;
        background: white;
        border-radius: 8px;
        padding-right: 5px;
        margin-right: 0;
        margin-left: 0;
    }

.vessel-card > .donut {
    padding-top: 60px;
}

.donut-wrapper {
    position: relative
}

.vessel-card .vessel-info {
    padding-top: 25px;
    padding-left: 30px;
    font: normal 12px 'Open Sans','sans-serif';
    line-height: 2.5em;
}

.vessel-info .vessel-name {
    font: normal 18px Montserrat, 'sans-serif';
    color: #002A4E;
    padding-bottom: 8px;
}

.vessel-info .project-status {
    font-size: 14px;
    display: flex;
}

    .vessel-info .project-status > div {
        flex-shrink: 0;
    }

.vessel-info-text {
    font-weight: bold;
}

.orange-line {
    height: 5px;
    width: 40px;
    border-bottom: 3px solid #FFAD0A;
    padding-top: 6px;
    margin-bottom: 6px;
}

.cap-scope {
    padding-bottom: 14px;
}

.card-actions {
    display: flex;
    align-content: space-between;
    font: normal 14px 'Open Sans','sans-serif';
}

    .card-actions > a.deliverables-link {
        color: #2CC6C8;
        padding-top: 8px;
    }

    .card-actions > .view-button {
        margin-left: auto;
    }

.card-label {
    padding-right: 3px;
}

.filter-tab.filtered {
    border: 3px solid #1AB394;
}

.filter-tab:hover:not(.filtered) {
    border: 1px solid lightgrey;
}


/*Survey Report Styles
*/

/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.smallWebNormalPdf {
    font-size: 14pt;
}

img {
    max-width: 100%;
    width: 100%;
    /*max-height:100%;*/
    /* object-fit:contain;*/
}

div.col-6.p-2.border.border-dark {
    /*max-height:686px;*/
    /*font-size:12px;*/
    min-height: 440px;
}

.k-textbox {
    max-width: 100%;
}

.absalignbottom > img {
    width: auto;
    height: 100%;
}

.absalignbottom {
    text-align: center;
    bottom: 3px;
    left: 1px;
    height: 470px !important;
    overflow: hidden;
    padding: 0px !important;
}

.page-template .header {
    position: absolute;
    top: 30px;
    left: 30px;
    right: 30px;
    text-align: right;
    font-size: 16px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.page-template .footer {
    position: absolute;
    text-align: right;
    bottom: 5px;
    left: -23px;
    margin-bottom: 20px;
}

.btn-primary {
    color: #fff !important;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
.survey-report-container {
    font-size: 14px;
}

@media (min-width: 768px) {
    .survey-report-container {
        font-size: 16px;
    }
}

.survey-report-container .floatLeftBeforeSpan {
    position: relative;
    top: -25px;
    left: 238px;
}

.survey-report-container .border-top {
    border-top: 1px solid #e5e5e5;
}

.survey-report-container .border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.survey-report-container .box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

.survey-report-container button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
.survey-report-container {
    position: relative;
}

.survey-report-container {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
    font-family: myriad-pro, sans-serif !important;
    font-size: 16pt !important;
    font-style: normal !important;
    font-weight: 400 !important;
}

.survey-report-container-kendo {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
    font-family: myriad-pro, sans-serif !important;
    font-size: 13pt !important;
    font-style: normal !important;
    font-weight: 400 !important;
}

    .survey-report-container-kendo > .k-tabstrip-items {
        font-weight: 700 !important;
    }

.survey-report-container .footer {
    position: absolute;
    bottom: 10px;
    width: 100%;
    white-space: nowrap;
    line-height: 40px; /* Vertically center the text there */
    background-color: white !important;
    height: 50px;
    border-top: none;
}

.survey-report-container .k-label.k-input-label {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

.survey-report-container input.ReportHeaderTextBox {
    min-width: 93%;
    max-width: 100%;
}

.survey-report-container span.ReportHeaderTextBox {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-bottom: 1px solid black !important;
    border-radius: 4px 4px 0px 0px;
    min-width: 93%;
    max-width: 100%;
}




.hide {
    display: none;
}

.survey-report-container .k-pdf-export .hideOnExport {
    display: none;
}

.survey-report-container textarea {
    width: inherit;
    height: 40px;
}

.survey-report-container .description {
    max-width: 300px;
    width: 100%;
}

.survey-report-container {
    margin: 0px;
    padding-right: 0px;
}

    .survey-report-container #ExportButton {
        height: 45px;
        width: 10%;
        margin-top: 10px;
        margin-left: -26px;
        margin-bottom: 30px;
    }

.survey-report-partial-container {
    padding-right: 0px;
}

    .survey-report-partial-container .ReportHeader {
        padding: 0px;
        margin: 0px;
    }

.export-textarea-width {
    width: 389px !important;
}

.description-input {
    width: 80%;
    height: 70px;
    min-height: 35px;
    overflow: hidden;
}

.additional-description-input {
    /*max-width: 400px;*/
    width: 250px;
    height: 60px !important;
    /*min-height: 35px;*/
    overflow: hidden;
}

.photo-button-container {
    display: flex;
    justify-content: space-between;
}

.photo-button {
    padding-right: 20px;
    padding-left: 20px;
    margin-left: 30px;
    margin-right: 30px;
}

.survey-report-partial-container .grade-notes {
    width: 100% !important;
}

.survey-report-partial-container h4 {
    margin-top: 20px;
    font-size: 18px;
}

.recent-activity-container h4 {
    padding-left: 12px;
}

.k-animation-container .k-menu-link input[title="Potential Drydock<br>Date"] {
    align-self: normal;
    margin-top: 6px;
}

.breadcrumb .breadcrumb-item a {
    text-decoration: none;
    color: inherit !important;
}

.tasks-container .breadcrumb {
    margin-bottom: 0px;
}

.landing-page-container .breadcrumb-row,
.project-container .breadcrumb-row {
    padding-left: 6px;
}

select option {
    background-color: white;
}

/*.modal-backdrop.show {
    z-index: auto !important;
}*/

/* Recent activity */
.project-charts-container .recent-activity {
    padding: 10px;
    text-align: left;
}

    .project-charts-container .recent-activity.collapsed {
        height: 200px;
    }

.project-charts-container .toggle-recent-activity {
    margin-top: 5px;
}

.project-charts-container .recent-activity-item {
    border-bottom: solid 1px black;
    padding: 10px 3px;
}

    .project-charts-container .recent-activity-item .activity-date {
        font-size: 12px;
        font-style: italic;
        display: block;
    }

/* Charts */
.project-charts-container .chart-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.project-charts-container #CertsByRegionChart,
.project-charts-container #ProjectsByStatusChart {
    display: flex;
    flex-basis: 50%;
}

#cancel-file-button {
    margin: auto;
    margin-top: 15px;
    display: block;
}

    #cancel-file-button:hover {
        border-color: black;
    }

.project-container .breadcrumb-row {
    padding-bottom: 0px;
}

.k-column-list input[data-field="AspNetUserId"] + span {
    display: none;
}

.k-column-list input[data-field="AspNetUserId"] {
    display: none;
}

.status-message-container {
    margin-left: 35px;
    margin-right: 36px;
}

.forgot-password-container h2 {
    padding-left: 33px;
}

.forgot-password-container h4 {
    padding-left: 34px;
}

.report-fileName-value {
    padding-left: 31px;
}

.menu-collapse-container {
    background-color: #1AB394;
    color: white;
    display: flex;
    width: 30px;
    height: 25px;
    border-radius: 4px;
    margin-right: 10px;
}

    .menu-collapse-container .fa-bars {
        margin: auto;
    }

.site-title {
    display: inline-flex;
    white-space: nowrap;
}

    .site-title h3 {
        color: #234766;
    }

.navbar .container {
    min-width: 85% !important;
}

#nvMain {
    width: 220px;
    position: fixed;
    top: 0px;
    height: 100%;
    overflow-x: hidden;
}

#abs-email-validation {
    display: none;
}

/*Initial Survey Report Styles*/
.survey-grid-container {
    background-color: white;
    margin-top: 20px;
    display: flex;
    padding-left: 40px;
    padding-right: 40px;
}

.survey-image-container {
    border-color: black;
    border: solid;
    border-width: 2px;
    width: 50%;
    height: 500px;
    font-weight: 600;
}

    .survey-image-container tr td:first-child {
        padding-left: 10px;
        padding-right: 30px;
    }

    .survey-image-container tr td:nth-child(2) {
        padding-left: 10px;
        padding-right: 30px;
    }

    .survey-image-container img {
        max-width: 96%;
        margin: 2%;
        height: 300px;
        width: 520px;
    }

    .survey-image-container label {
        font-weight: 600;
    }

.survey-report-body-container {
    display: flex;
    padding: 0px;
}

.survey-report-page-container {
    display: flex;
}

.survey-upload-message-container {
    width: 223px;
    text-align: left;
}

.survey-image-upload-container .add-file {
    padding: 0px;
}

    .survey-image-upload-container .add-file .form-group.col-lg-4 {
        max-width: 100%;
        padding: 0px;
    }

.survey-image-upload-container .add-file {
    padding: 15px;
}

    .survey-image-upload-container .add-file .upload-section.col-lg-8 {
        max-width: 100%;
        padding: 0px;
    }

#generateSurveyReport {
    height: 34px;
    width: 156px;
    border-radius: 4px;
    border: none;
    background-color: #E2414A;
    color: white;
    font-weight: 600;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
}

.survey-image-upload-container {
    max-width: 365px;
    position: fixed;
    top: 168px;
    right: 32px;
    background-color: white;
    border-radius: 6px;
    padding: 15px;
    display: none;
}

survey-image-upload-container .upload-section {
    padding-left: 0px;
    padding-right: 0px;
}

.survey-image-upload-container .add-file .k-dropzone {
    display: flex;
    flex-direction: column;
}

.survey-image-upload-container .k-file-name {
    max-width: 100px;
}

.survey-image-upload-collapse .fa-arrow-left {
    display: none;
    padding-right: 0px;
}

.survey-image-upload-collapse {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: none;
    margin-right: 10px;
    cursor: pointer;
}

    .survey-image-upload-collapse i {
        padding-right: 10px;
    }

.survey-image-upload-container .add-file .k-dropzone-hint {
    margin-top: 20px;
}

.survey-image-footer {
    text-align: center;
}

.replaceImage {
    background-color: #ECECEC;
    border-radius: 4px;
    margin-right: 20px;
}

.deleteImage {
    color: #2BBEC4;
    border: none;
    background-color: white;
}

.start-placing-images {
    margin-top: 10px;
    color: #2BBEC4;
    text-align: center;
    cursor: pointer;
}

.unplaced-images {
    display: flex;
    flex-direction: column;
    max-width: 300px;
}

.survey-photo-placement-modal {
    background-color: white;
    text-align: left;
    position: fixed;
    top: 10%;
    left: 30%;
    z-index: 100;
    border: solid;
    border-color: #DEDEDE;
    border-radius: 4px;
    display: none;
    width: 750px;
    overflow: auto;
    resize: auto;
    height: 650px;
}

.survey-photo-placement-footer {
    text-align: right;
    padding-top: 20px;
    padding-right: 20px;
}

.saveAndClose {
    font-weight: 600;
    padding: 5px 10px;
    background-color: white;
    border-radius: 4px;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    margin-left: 15px;
}

.saveAndContinue {
    color: white;
    font-weight: 600;
    padding: 6px 11px;
    background-color: #E0414E;
    border-radius: 4px;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    border: none;
    margin-left: 15px;
}

.survey-photo-placement-header {
    background-color: #EFEFEF;
    padding: 15px;
    display: flex;
    justify-content: space-between;
}

    .survey-photo-placement-header .fa-times {
        cursor: pointer;
    }

.survey-photo-placement-body {
    padding: 10px 20px 20px 20px;
}

.survey-photo-placement-navigation {
    text-align: center;
    padding-bottom: 15px;
    display: flex;
    justify-content: center;
}

.inactive {
    color: #DDDFE0;
    cursor: default !important;
}

#current-image {
    padding-left: 20px;
}

#total-images {
    padding-right: 20px;
}

#placement-image {
    padding-top: 20px;
}

.photo-link {
    cursor: pointer;
}

.image-comments {
    width: 100%;
}

/*END - Initial Survey Report Styles*/
.project-container .breadcrumb-row {
    padding-bottom: 0px;
}

.k-column-list input[data-field="AspNetUserId"] + span {
    display: none;
}

.k-column-list input[data-field="AspNetUserId"] {
    display: none;
}

.status-message-container {
    margin-left: 35px;
    margin-right: 36px;
}

.forgot-password-container h2 {
    padding-left: 33px;
}

.menu-collapse-container {
    background-color: #1AB394;
    color: white;
    display: flex;
    width: 30px;
    height: 25px;
    border-radius: 4px;
    margin-right: 10px;
}

    .menu-collapse-container .fa-bars {
        margin: auto;
    }

.site-title {
    display: inline-flex;
    white-space: nowrap;
}

    .site-title h3 {
        color: #234766;
    }

.navbar .container {
    min-width: 85% !important;
}

#nvMain {
    width: 220px;
    position: fixed;
    top: 0px;
    height: 100%;
    overflow-x: hidden;
}

.k-group-indicator .k-link {
    padding-right: 10px !important;
    padding-left: 10px !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.k-grid col.k-sorted, .k-grid th.k-sorted {
    background-color: initial;
}

.invoice-breadcrumbs {
    margin-left: 30px;
}

    .invoice-breadcrumbs .breadcrumb {
        margin-bottom: 0px;
    }

.k-dropdown.navigation-drop-down {
    width: 185px !important;
    border: none;
}

.navigation-drop-down .k-dropdown-wrap,
.navigation-drop-down .k-dropdown-wrap:hover,
.navigation-drop-down .k-dropdown-wrap.k-state-focused {
    border: none;
    background-color: #F3F3F4;
}

.k-dropdown.navigation-drop-down .k-input,
.k-dropdown.navigation-drop-down .k-select {
    color: #a7b1c2;
    background-color: #F3F3F4;
    border: none;
    font-size: 13px;
}

#unplaced-image-count {
    font-weight: 600;
}

#placement-image {
    width: 400px;
}

.survey-photo-placement-modal textarea {
    height: initial;
}

#repair-condition-container,
#modification-condition-container {
    display: none;
}

#suvery-photo-filename-container {
    display: none;
}

.filename-condition-container {
    display: flex;
    padding: 0px
}

    .filename-condition-container div {
        padding: 0px;
        padding-right: 20px;
    }

.image-details {
    font-weight: 600;
}

.report-section {
    font-weight: 600;
    margin-bottom: 0px;
}

.survey-photo-placement-image-container {
    display: flex;
    justify-content: center;
}

.unplaced-images hr {
    width: 100%;
}

.survey-photo-placement-footer button {
    cursor: pointer;
}

.label-validation {
    margin-top: 15px;
    display: flex;
}

    .label-validation label {
        padding-right: 10px;
    }

.select-reportSection-msg-container {
    margin-top: 10px;
    text-align: center;
}

.certificate-number-textbox,
.onboard-maintenance-dropdown,
.photograph-representative-dropdown,
.Accommodation-dropdown,
.equipment-online-dropdown {
    width: 100px !important;
}

.expiration-date-textbox {
    width: 150px !important;
}

.company-name-textbox,
.operational-location-textbox,
.trial-end-date,
.trial-start-date,
.last-visit-dates-textbox {
    width: 250px !important;
}

.frame-trans-textbox {
    width: 100%;
}

.additional-surveyor-comments {
    width: 100%;
    font-size: 15px;
}

#unplaced-images-container,
.survey-upload-message-container,
.survey-photo-placement-modal {
    font-size: 15px !important;
}

.survey-image-upload-body .add-file .k-upload-files.k-reset {
    max-height: 243px !important;
    overflow-y: auto;
}

.survey-report-list-container {
    width: 98%;
}

@media only screen and (min-width: 2055px) {
    .survey-report-list-container > .k-tabstrip-wrapper > .k-tabstrip > .k-content {
        height: 1750px !important;
    }

    .ReportHeader {
        height: 1630px;
        overflow: auto !important;
    }

    #VesselInspectionDetails {
        height: 1620px;
        overflow: auto !important;
    }
}


.survey-report-list-container > .k-tabstrip-wrapper > .k-tabstrip > .k-content {
    display: none;
}

.create-survey-report-btn {
    float: right;
    font-size: 1rem;
    height: 35px;
}

.survey-report-list-container h4 {
    font-weight: 400;
    margin-bottom: 15px;
    padding-left: 0px;
}

.survey-report-list-container .actions {
    display: flex;
    justify-content: center;
    white-space: nowrap;
}

.survey-report-breadcrumb {
    margin-left: 20px;
}

.hide-important {
    display: none !important;
}

select.class-society {
    display: none;
}

.cap-title {
    font-family: Montserrat,Noto Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
    font-weight: 600;
    font-size: 16px;
}

.sea-trials {
    display: flex;
}

.border-none {
    border: none;
}

.absalignbottom-imag {
    width: 100%;
    object-fit: contain;
}

.border-bottom-textBox {
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    border-bottom: 1px solid black !important;
    border-radius: 4px 4px 0px 0px;
}

.abs-btn-save {
    width: 80px;
    height: 40px;
    text-align: center;
    background: #062C4D;
    color: #fff;
    font-weight: bold;
    margin-left: 331px;
    margin-top: 10px;
    margin-right: 26px;
}

    .abs-btn-save:hover {
        color: #fff;
    }

.abs-btn-cancel {
    width: 83px;
    height: 40px;
    text-align: center;
    background: #062C4D;
    border: 1px solid black;
    margin-top: 10px;
    color: #fff;
    font-weight: bold;
}

    .abs-btn-cancel:hover {
        color: #fff;
    }

div.imageuploaddiv .k-dropzone-hint {
    padding-right: 120px !important;
    font-size: 30px;
    color: #000;
}

#attentionId {
    font-size: 14px;
}

.attentionClass {
    font-size: 1rem;
    color: #DF444E;
    font-weight: 700;
    display: inline;
    width: 180px;
    cursor: pointer;
}

@media screen and (min-width : 1280px) and (max-width: 1500px) {
    .col-sm-3 {
        max-width: 35% !important;
        flex: 0 0 35%;
    }

    .col-sm-8 {
        max-width: 64.5% !important;
        flex: 0 0 64.5%;
    }

    div.imageuploaddiv .k-dropzone-hint {
        padding-right: 56px !important;
        font-size: 20px !important;
    }

    .navbar-expand-sm > .container {
        padding-right: 185px;
    }

    #attentionId {
        font-size: 90%;
    }

    .attentionClass {
        font-size: 103%;
        color: #DF444E;
        font-weight: 700;
        display: inline;
        width: 180px;
        cursor: pointer;
        padding-left: 58px;
    }
}

.grid-actions .project-link-container + .project-link-container {
    margin-left: 10px
}

.modal-alert {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

    .modal-alert .img-wrapper {
        height: 48px;
        width: 48px;
        display: grid;
        place-content: center;
        border-radius: 3px;
        background: rgba(0, 42, 78, 0.12);
        margin-bottom: 10px
    }

    .modal-alert .img-wrappers {
        height: 72px;
        width: 72px;
        display: grid;
        place-content: center;
        border-radius: 3px;
        background: #F6F8F9;
        margin-bottom: 10px
    }

    .modal-alert .img-wrapper i {
        color: #002A4E
    }

    .modal-alert .alert-content {
        text-align: center
    }

        .modal-alert .alert-content h5 {
            font-weight: 600;
            font-size: 18px;
        }

.survey-report-export-button {
    background: #BFBDBC !important;
    font-size: 14px;
    color: black !important;
}

#btnDownloadOffline {
    background: #BFBDBC !important;
    font-size: 14px;
    color: black !important;
}

.modal-alert .alert-content p {
    font-weight: 400
}

.modal-alert .alert-img-section {
    display: flex;
    justify-content: space-between;
    align-items: center !important;
    gap: 20px !important;
}

.processing-loader {
    display: flex;
    gap: 20px;
}

.dot-flashing {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #2196f3;
    color: #2196f3;
    animation: dot-flashing 1s infinite linear alternate;
}

@keyframes dot-flashing {
    0%, 100% {
        background-color: #2196f3;
    }

    50% {
        background-color: #ebe6ff;
    }
}

/* Apply animation delay to each dot */
.dot-flashing:nth-child(2) {
    animation-delay: 0.5s;
}

.dot-flashing:nth-child(3) {
    animation-delay: 1s;
}

.dot-flashing:nth-child(4) {
    animation-delay: 1.5s;
}

.dot-flashing:nth-child(5) {
    animation-delay: 2s;
}

.alert-light-alt {
    color: #004085;
    background-color: #ffffff;
    border-color: #2f4050;
    padding: .75rem;
}

.minimize-card {
    position: fixed;
    bottom: 0px;
    padding: 0px;
    right: 1px;
    z-index: 99999 !important;
    max-width: 400px;
    display: none
}

.minimize-modal-alert {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    margin-bottom: 20px;
    gap: 20px
}

    .minimize-modal-alert .img-wrapper {
        min-height: 48px;
        max-height: 48px;
        min-width: 48px;
        max-width: 48px;
        display: grid;
        place-content: center;
        border-radius: 3px;
        background: rgba(0, 42, 78, 0.12);
    }

        .minimize-modal-alert .img-wrapper i {
            color: #002A4E
        }

    .minimize-modal-alert .alert-content {
        /* text-align: center*/
        width: 280px
    }

        .minimize-modal-alert .alert-content h5 {
            font-weight: 600;
            font-size: 18px;
        }



        .minimize-modal-alert .alert-content p {
            font-weight: 400
        }

    .minimize-modal-alert .alert-img-section {
        display: flex;
        justify-content: space-between;
        align-items: center !important;
        gap: 20px !important;
    }

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Apply the rotation animation to the icon */
.icon-rotate {
    animation: rotate 2s linear infinite; /* Adjust duration, timing function, and iteration count as needed */
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.2);
    }

    100% {
        transform: scale(1);
    }
}

/* Apply the pulsating animation to the download icon */
.download-icon {
    animation: pulse 1.5s ease-in-out infinite; /* Adjust duration, timing function, and iteration count as needed */
}

.minimize-modal-alert .downloadprogress.k-progressbar .k-state-selected, .minimize-modal-alert .syncprogress.k-progressbar .k-state-selected {
    background-color: #002a4e !important;
}

.downloadprogressbar.k-progressbar .k-state-selected, .syncprogressbar.k-progressbar .k-state-selected {
    background-color: #002a4e !important;
}

.badge-online i {
    -webkit-animation: flash linear 1s infinite;
    animation: flash linear 1s infinite;
}

.badge-online {
    color: #3AA471;
    background-color: #c2ebd9;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-right: 10px;
    padding: 6px 10px;
}

.btn-block {
    width: 100%
}

.badge-offline i {
    -webkit-animation: flash linear 1s infinite;
    animation: flash linear 1s infinite;
}

.badge-offline {
    color: #FE0000;
    background-color: #FFD0D0;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-right: 10px;
    padding: 6px 10px;
}

    .badge-offline i, .badge-online i {
        font-size: 12px;
    }


@-webkit-keyframes flash {
    0% {
        opacity: 1;
    }

    50% {
        opacity: .1;
    }

    100% {
        opacity: 1;
    }
}

@keyframes flash {
    0% {
        opacity: 1;
    }

    50% {
        opacity: .1;
    }

    100% {
        opacity: 1;
    }
}

.gap-0 {
    gap: 0 !important;
}

.gap-1 {
    gap: .25rem !important;
}

.gap-2 {
    gap: .5rem !important;
}

.gap-3 {
    gap: 1rem !important;
}

.gap-4 {
    gap: 1.5rem !important;
}

.gap-5 {
    gap: 3rem !important;
}
.version-name {
  
    display: block;
    text-align: center;
    color: #fff;
}
.sidebar-collapse {
    /* display:block;*/
    min-height: 80vh;
    overflow: auto;
}
.status-Online {
    background-color: #04c953;
    color: #5e5e5e;
    font-size: 11px;
    font-weight: 600;
    height: 55px;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    text-shadow: none;
    white-space: nowrap;
}
.status-Offline {
    background-color: #e53e3e;
    color: #5e5e5e;
    font-size: 11px;
    font-weight: 600;
    padding-bottom: 4px;
    padding-left: 6px;
    padding-right: 6px;
    height: 55px;
    text-shadow: none;
    white-space: nowrap;
}
.filter-grid {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    display: grid;
    place-content:center
}
.tank-norecord{
    display:grid;
    place-content:center;
    font-weight:600;
}
.k-grid-norecords{
    justify-content:center!important;
    font-weight:600;
    font-size:20px;
}
ul.section-tabs {
    display: flex !important;
    justify-content: flex-start;
    gap: 10px
}
.template-tab-section .tab-content{
    padding:10px ;
    border:1px solid #ededed;
}
/* Allow dropdown to be visible outside Kendo Grid cells */
.custom-table-grid.k-grid .dropdown {
    position: relative; /* Ensures correct positioning */
    z-index: 1050; /* Higher than the grid container */
}

/* Ensure the dropdown-menu is displayed correctly */
.custom-table-grid.k-grid .dropdown-menu {
    position: absolute; /* Proper positioning outside the grid */
    z-index: 1050; /* Matches the dropdown's z-index */
}

/* For large tables, ensure grid rows do not clip dropdowns */
.custom-table-grid .k-grid-content {
    overflow: visible !important; /* Overrides hidden overflow */
}
.custom-table-grid.k-grid td{
    z-index: 0 !important
}

.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* 4 columns with equal width */
    gap: 16px; /* Space between grid items */
}
.checkbox-item{
    display:flex;
    justify-content:flex-start;
    gap:10px;
     
}

input.k-input:disabled, input.k-input[disabled], textarea.k-textarea:disabled, textarea.k-textarea[disabled] {
    background: #ffff !important;
}