﻿body {
    font-family: 'Open Sans', sans-serif;
    font-size: 10pt;
    min-height: 100%;
    padding: 0;
    margin: 0;
    width: 100%;
}

/* Header Styles */
.header-container {
    position: fixed;
    z-index: 1;
    background-color: #ffffff;
    overflow: hidden;
    top: 0px;
    left: 0px;
    right: 0px;
    padding-bottom: 20px;
}

#header {
    /*width:100%;*/
    height: 60px;
    background-color: #004054;
    color: #ffffff;
    -moz-min-width: 800px;
    -ms-min-width: 800px;
    -o-min-width: 800px;
    -webkit-min-width: 800px;
    min-width: 900px;
    overflow: hidden;
    top: 0px;
    left: 0px;
    right: 0px;
}

    #header .agent {
        position: absolute;
        right: 0;
        top: 50%;
        font-size: 10pt;
        font-weight: 600;
        height: 48px;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -moz-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        -o-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
    }
#header .agentId {
    position: absolute;
    right: -20px;
    top: 75%;
    font-size: 10pt;
    font-weight: 600;
    height: 48px;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
    #header .updateAgent {
        position: absolute;
        right: -80px;
        top: 80%;
        font-size: 10pt;
        font-weight: 600;
        height: 48px;
        cursor: pointer;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -moz-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        -o-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        transition: color 0.3s ease;
    }

.updateAgent:hover {
    color: deepskyblue;
}

#headerLeft {
    float: left;
    margin-left: 25px;
    margin-top: 10px;
    height: 48px;
}

    #headerLeft img.logo {
        /*width: 112px;
  height: 48px;*/
        width: 75px;
        height: 32px;
        position: relative;
        top: 8px;
        left: 0;
    }

    #headerLeft span.title {
        font-size: 14pt;
        line-height: 48px;
        /*vertical-align: middle;*/
        margin-left: 40px;
        font-weight: bold;
    }

    #headerLeft span.agent-name {
        font-size: 12pt;
    }

#headerRight {
    float: right;
    height: 48px;
    margin-top: 5px;
    line-height: 48px;
    margin-right: 40px;
    font-weight: 600;
}

.help-wrapper {
    cursor: pointer;
    position: absolute;
    right: 2%;
    width: 100px;
    height: 60px;
    top: 0px;
}

    .help-wrapper:hover #helpIcon {
        color: #34b475;
    }

#helpIcon {
    width: 30px;
    height: 30px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 15px;
    border: 2px solid #ffffff;
    text-align: center;
    font-size: 16pt;
    font-weight: 700;
    line-height: 30px;
    color: #ffffff;
    position: relative;
    left: 10px;
    top: 25%;
    -webkit-transform: translateY(-25%);
    -moz-transform: translateY(-25%);
    -ms-transform: translateY(-25%);
    -o-transform: translateY(-25%);
    transform: translateY(-25%);
    display: inline-block;
}

    #helpIcon div {
        display: inline-block;
    }

#headerRight span, #headerRight a {
    vertical-align: middle;
}

#helpMenu {
    width: 270px;
    position: absolute;
    top: 60px;
    right: 2%;
    border-right: 2px solid #ffffff;
    border-left: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    border-top: 1px solid #325668;
    background-color: #004054;
    color: #ffffff;
    overflow: hidden;
    display: block;
    z-index: 1600000;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    /*-webkit-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    -moz-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    -ms-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);*/
    -webkit-box-shadow: 10px 10px 16px 0px rgba(0,0,0,0.73);
    -moz-box-shadow: 10px 10px 16px 0px rgba(0,0,0,0.73);
    box-shadow: 10px 10px 16px 0px rgba(0,0,0,0.73);
}

    #helpMenu div {
        height: 30px;
        line-height: 30px;
        padding-left: 15px;
        border-top: 1px solid #ffffff;
        font-weight: 600;
        font-size: 10pt;
    }

        #helpMenu div.clickable {
            cursor: pointer;
        }

            #helpMenu div.clickable:hover, #helpMenu div.clickable:hover a {
                font-weight: 700;
                color: #21D081 !important;
            }

            #helpMenu div.clickable a:link, #helpMenu div.clickable a:visited {
                font-size: 10pt;
                font-weight: 600;
                text-decoration: none;
                color: #ffffff;
                display: block;
            }

            #helpMenu div.clickable a:hover, #helpMenu div.clickable a:focus {
                font-weight: 700;
                display: block;
                color: #21D081 !important;
            }

        #helpMenu div:first-child {
            border-top: none;
        }

        #helpMenu div img {
            vertical-align: middle;
            padding-left: 10px;
        }

#needHelp {
    font-size: 12pt;
    font-weight: bold;
    position: relative;
    left: 15px;
    top: 3px;
    vertical-align: middle;
    display: inline-block;
}

#helpPhone {
    font-size: 10pt;
}

a:link.zendesk-help, a:visited.zendesk-help {
    font-size: 10pt;
    text-decoration: none;
    color: #ffffff;
}

a:hover.zendesk-help, a:focus.zendesk-help {
    font-size: 10pt;
    text-decoration: none;
    color: #ffffff;
}

/* Body wrapper*/
.portal-body {
    position: absolute;
    top: 60px;
    left: 0px;
    right: 0px;
    overflow: auto;
    margin-top: 20px;
    margin-bottom: 10px;
    bottom: 0px;
}

/* Footer*/
.portal-footer {
    position: fixed;
    left: 0px;
    bottom: 0px;
    right: 0px;
    height: 20px;
    overflow: hidden;
    background-color: #004054;
    z-index: 1;
}

/* Navigation Styles*/
#navigationLoading {
    font-size: 8pt;
}

    #navigationLoading img {
        width: 16px;
        height: 16px;
        vertical-align: middle;
    }

    #navigationLoading span {
        margin-left: 20px;
    }

#navigationPane {
    width: 300px;
    overflow: hidden;
    font-size: 12pt;
    display: table-cell;
    padding-left: 20px;
    padding-right: 10px;
    vertical-align: top;
    height: 100%as;
    position: fixed;
    background: #ffffff;
    z-index: 1;
}

.navigation-item-container {
    /*width: 300px;*/
    /*cursor: pointer;*/
    margin-bottom: 10px;
    padding: 3px;
}

    .navigation-item-container.active {
        cursor: pointer;
    }
        /*.navigation-item-container.active:hover {*/
        .navigation-item-container.active:hover {
            background-color: #F5F5F5;
            border: 0px solid #F5F5F5;
        }

    .navigation-item-container.selected {
        background-color: #F5F5F5;
        font-weight: bold;
    }

        .navigation-item-container.selected div span {
            font-weight: bold;
        }

    .navigation-item-container div {
        display: inline-block;
    }

    .navigation-item-container.extra-padding {
        margin: 20px 0 20px 0px;
    }

.bold-action {
    font-weight: bold;
}

span.indent-action {
    margin-left: 20px;
}

.action-item-count, .action-item-grouping, .compliant-item-count {
    background-color: #f4683c;
    border: 0px solid #f4683c;
    width: 30px;
    -ms-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    color: #ffffff;
    text-align: center;
    font-size: 10pt;
    font-weight: 600;
    float: right;
    padding: 1px;
    margin-top: 1px;
}

.smiley {
    position: relative;
    left: 150px;
    top: 0px;
}

.action-item-grouping {
    background-color: #f4683c;
    border: 0px solid #f4683c;
}

.noaction-item-count {
    background-color: #eeeeee;
    width: 30px;
    -ms-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 0px solid #eeeeee;
    color: #676767;
    text-align: center;
    font-size: 10pt;
    float: right;
    padding: 1px;
    margin-top: 1px;
}

.compliant-item-count {
    background-color: #34b475;
}

.compliant-image {
    position: absolute;
    left: 113px;
    /* top: 11px; */
    margin-top: -4px;
    width: 30px;
    height: 28px;
}

/* Assignment List Styles */
#assignmentsLoadingOuter {
    z-index: 1000000;
    width: 100%;
    height: 100%;
    positioN: fixed;
    top: 60px;
    left: 0px;
}

#assignmentsLoadingOverlay {
    position: fixed;
    top: 30%;
    left: 40%;
    width: 300px;
    height: 200px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    border-radius: 10px;
    border: solid 5px #004054;
    background: #004054;
    z-index: 1000001;
    font-size: 12pt;
    font-weight: normal;
    color: #ffffff;
    font-weight: bold;
}

#assignmentsLoading {
    position: relative;
    left: 17%;
    top: 40%;
}

    #assignmentsLoading img {
        vertical-align: middle;
        width: 24px;
        height: 24px;
    }

#assignmentListPane {
    display: table-cell;
    vertical-align: top;
    height: auto;
    -moz-min-width: 478px;
    -ms-min-width: 478px;
    -o-min-width: 478px;
    -webkit-min-width: 478px;
    min-width: 478px;
    max-width: 100%;
    position: absolute;
    left: 340px;
    padding-right: 20px;
}

#assignmentsContainer {
    width: 100%;
}

.assignment-list-header-container {
    position: fixed;
    height: 40px;
    background: #ffffff;
    z-index: 1;
    display: block;
    width: 100%;
    position: relative;
}

.assignment-list-body-container {
    position: relative;
    top: 25px;
    left: 35px;
    padding-bottom: 100px;
    margin-right: 100px;
    margin-top: 40px;
}

.selected-status-title {
    font-size: 15pt;
    font-weight: bold;
    margin-left: 20px !important;
    width: 100%;
    white-space: normal;
    position: fixed;
}

.selected-status-subtitle {
    font-size: 11pt;    
    margin-left: 10px;
    margin-top: 5px;
    font-weight: 600;
}

#assignmentTable {
    border-collapse: collapse;
    text-align: left;
    width: 100%;
    font-family: 'Open Sans', sans-serif;
    table-layout: fixed;
    margin-top: 20px;
}

    #assignmentTable thead {
        color: #979c9e;
        font-size: 10pt;
        position: relative;
    }

        #assignmentTable thead th:first-child {
            padding-left: 5px;
        }

        #assignmentTable thead tr, #assignmentTable tbody tr {
            border-bottom: solid 1px #e1dedb;
        }

    #assignmentTable tbody {
        color: #2e393d;
        font-size: 12pt;
    }
            #assignmentTable a {
                color: blue;
                text-decoration: underline;
                cursor: pointer;
            }
            #assignmentTable tbody tr.assignment-row td:first-child {
                padding-left: 5px;
            }

            #assignmentTable tbody tr.assignment-row:hover {
                /*border-bottom: solid 1px #e1dedb;
    background-color: #EBF1F7;*/
                background-color: rgba(255, 231, 153, 0.57);
                font-weight: 600;
            }

tr.status-group-header {
    font-size: 12pt;
    font-weight: bold;
    background-color: #F7FAFC;
    margin-left: 5px;
}

    tr.status-group-header:hover {
        background-color: #F0F9FF;
    }

    tr.status-group-header.clickable-row {
        cursor: pointer;
    }

    tr.status-group-header td div.expand-icon, tr.status-group-header td div.collapse-icon {
        -ms-background-size: 20px 20px;
        background-size: 20px 20px;
        background-position: top 1px left 4px;
        width: 25px;
        height: 25px;
        positioN: absolute;
        left: 5px;
    }

    tr.status-group-header td div.expand-icon {
        background: url('../../../images/collapse.png') no-repeat;
    }

    tr.status-group-header td div.collapse-icon {
        background: url('../../../images/expand.png') no-repeat;
    }

tr.selected-assignment-row {
    background-color: rgba(255, 231, 153, 0.57);
    border-left: 2px solid #F2AF32;
    font-weight: 600;
}

tr.status-group-header td {
    padding: 10px 0 10px 0;
}

    tr.status-group-header td span {
        margin-left: 30px;
    }

th.client-column, th.division-column, th.insured-column, th.uploaded-column,
td.client-column, td.division-column, td.insured-column, td.uploaded-column {
    text-align: left;
    padding: 10px 10px 10px 0;
    white-space: nowrap;
    overflow: hidden;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

th.client-column, td.client-column {
    width: 30%;
    max-width: 30%;
    padding-left: 25px;
}

th.division-column, td.division-column {
    width: 25%;
    max-width: 25%;
}

th.insured-column, td.insured-column {
    width: 30%;
    max-width: 30%;
}

th.uploaded-column, td.uploaded-column {
    width: 15%;
    max-width: 15%;
}

th.action-column, td.action-column {
    width: 15%;
    max-width: 15%;
}

    td.uploaded-column div.new-policy {
        width: 75%;
        display: inline-block;
        /* height: 1px; */
        border: solid 1px #979c9e;
    }

/* assignment list button pane*/
#buttonPane {
    position: fixed;
    top: 65px;
    right: 2%;
    z-index: 2;
}

    #buttonPane div.button-container button {
        margin-left: 10px !important;
    }

#flyoutButtonPane div.button-container button {
    margin-right: 10px !important;
}
/*#buttonPane div.button-container button.secondarybutton {
    margin-left: 10px;
    margin-right: 10px;
}*/

/* Flyout Styles*/
.ng-pageslide {
    background: #F5F8FA;
    border-left: solid 1px #8995a2;
    -webkit-box-shadow: -10px 0px 25px -1px #000000;
    -webkit-box-shadow: -10px 0px 25px -1px rgba(0,0,0,0.2);
    -moz-box-shadow: -10px 0px 25px -1px #000000;
    -moz-box-shadow: -10px 0px 25px -1px rgba(0,0,0,0.2);
    -ms-box-shadow: -10px 0px 25px -1px #000000;
    -ms-box-shadow: -10px 0px 25px -1px rgba(0,0,0,0.2);
    box-shadow: -10px 0px 25px -1px #000000;
    box-shadow: -10px 0px 25px -1px rgba(0,0,0,0.2);
    height: auto !important;
}

#flyoutContainer {
    color: #2e393d;
    background-color: #F5F8FA;
    border-left: solid 1px #8995a2;
    height: 100%;
    float: right;
    width: 680px;
}

#flyoutHeader {
    background-color: #004054;
    border-bottom: solid 1px #325668;
    color: #ffffff;
    position: fixed;
    top: 60px;
    width: 680px;
    height: 190px;
}

    .last-reviewed {
        background-color: white;
        border-radius: 20px 20px 20px 20px;
        color: #004054;
        font-weight: 600;
        padding: 1px 6px;
        margin-left: 5px;
    }
    
    #flyoutHeader .close-flyout, #onboardModal div.close-onboard {
        position: absolute;
        right: 30px;
        top: 10px;
        -ms-border-radius: 4px;
        border-radius: 4px;
        border: 1px solid #004054;
        cursor: pointer;
    }

        #flyoutHeader .close-flyout:hover, #flyoutRequirements .close-flyout:hover, #onboardModal div.close-onboard:hover {
            -ms-border-radius: 4px;
            border-radius: 4px;
            border: 1px solid #cccccc;
        }

        #flyoutHeader .close-flyout img, #flyoutRequirements .close-flyout img, #onboardModal div.close-onboard img {
            width: 16px;
            height: 16px;
            padding: 6px;
            vertical-align: middle;
        }

#flyoutBody {
    padding-left: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    position: fixed;
    top: 250px;
    bottom: 0px;
    width: 680px;
    background-color: #f5f8fa;
    border-left: solid 1px #8995a2;
}

#flyoutHeader div.client {
    font-size: 18pt;
    padding-top: 10px;
    overflow: hidden;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    width: 80%;
    white-space: nowrap;
}

#flyoutHeader div.division {
    font-size: 12pt;
    overflow: hidden;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    width: 80%;
    white-space: nowrap;
}

#flyoutHeader div.vendor {
    font-size: 12pt;
    overflow: hidden;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    width: 80%;
    white-space: nowrap;
}

#flyoutHeader div.status {
    font-size: 8pt;
    padding-top: 5px;
}

#flyoutHeader div.client, #flyoutHeader div.division, #flyoutHeader div.vendor, #flyoutHeader div.status {
    margin-left: 20px;
}

    #flyoutHeader div.status span.name, #flyoutNonCompliantNotes span.name {
        color: #F2AF32;
        font-weight: bold;
        font-size: 12pt;
    }

    #flyoutHeader div.status span.last-updated {
        float: right;
        margin-right: 15px;
    }

#flyoutButtonContainer {
    padding: 10px 0px 10px 20px;
    clear: both;
    position: absolute;
    bottom: 0px;
}

    #flyoutButtonContainer button.uploadbutton {
        margin-left: 0px;
    }

    #flyoutButtonContainer button.secondarybutton {
        width: auto;
        background-color: #F2AF32;
    }

    #flyoutButtonContainer button.submitOverride {
        width: auto;
    }

#flyoutNonCompliantNotes, #flyoutRequiredForms, #flyoutSubmittedDocuments, #flyoutPolicies {
    padding: 15px 30px 0px 0;
}

#flyoutPolicies {
    padding-bottom: 15px !important;
}

#flyoutNonCompliantNotes span.name {
    font-size: 12pt;
    margin-left: 15px;
    color: darkorange;
}

#flyoutNonCompliantNotes span.last-updated {
    font-style: italic;
    vertical-align: text-top;
}

#flyoutNonCompliantNotes div.notes {
    font-size: 10pt;
    padding: 5px;
    margin-left: 10px;
}

/*Added to give non-compliant notes a backlight*/
#flyoutNonCompliantNotes {
    background-color: rgba(255, 231, 153, 0.29);
    border-radius: 7px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border: 2px solid darkorange;
    margin: 10px 30px 20px 0px;
    padding: 15px 15px 15px -5px;
    text-align: justify;
}

    #flyoutNonCompliantNotes ul {
        list-style: none;
    }

    #flyoutNonCompliantNotes li:before {
        content: "•";
        color: darkorange;
        font-size: 14pt;
        font-weight: bold;
        vertical-align: middle;
        text-align: left;
        margin-left: -12px;
        margin-right: 7px;
    }

    #flyoutNonCompliantNotes li {
        margin-left: 5px;
        text-align: justify;
    }

#flyoutRequiredForms {
    padding-top: 10px !important;
    padding-bottom: 15px !important;
}

    #flyoutRequiredForms div.indented-container, #flyoutSubmittedDocuments div.indented-container, #flyoutPolicies div.indented-container {
        margin-left: 20px;
    }

    #flyoutRequiredForms div.section-title, #flyoutSubmittedDocuments div.section-title, #flyoutPolicies div.section-title {
        font-weight: bold;
        font-size: 10pt;
        padding-bottom: 15px;
    }

#flyoutSubmittedDocuments {
    padding-bottom: 100px !important;
}

.document-container .form-row.ng-scope:first-child {
    font-weight: bold;
    background-color: rgba(255, 231, 153, 0.57);
}

#flyoutPolicies div.section-title {
    /*padding-bottom: 0px;*/
}

.policy-list-flyout {
    padding-top: 0px;
    width: 100%;
}

    .policy-list-flyout div.policy-detail-line {
        width: 100% !important;
        min-height: 24px;
        height: auto;
        /* clear: both; */
        border-bottom: 1px solid #cccccc;
        padding: 5px 0px 5px 0px;
    }

        .policy-list-flyout div.policy-detail-line.last {
            border-bottom: none !important;
        }

        .policy-list-flyout div.policy-detail-line div div {
            display: inline-block;
            word-wrap: normal;
            word-break: normal;
            /* width: 270px; */
            /* vertical-align: top; */
            /* clear: both;
  height: inherit;*/
        }

.flyout-policy-label {
    float: left;
}

    .flyout-policy-label span.number {
        /*width: 293px!important;*/
        display: inline-block;
        vertical-align: top;
    }

.flyout-policy-expiration {
    float: right;
    margin-right: 5px;
}

    .flyout-policy-expiration span.expired {
        margin-right: 5px;
    }

div.indented-container div.document-upload-label {
    position: relative;
    top: -33px;
    left: 392px;
    color: #2e393d;
    font-size: 10pt;
}

div.indented-container div.document-container {
    border: none;
    position: relative;
    top: -30px;
}

div.indented-container div.document-paging-container {
    position: relative;
    top: -30px;
}

div.form-row {
    border-bottom: solid 1px #e1dedb;
    padding: 8px 0 8px 0px;
    cursor: pointer;
    width: 100%;
    overflow: hidden;
    background-color: #f5f8fa;
}

div.form-row.unprocessed {
    border-bottom: solid 1px #e1dedb;
    padding: 8px 0 8px 0px;
    cursor: pointer;
    width: 100%;
    overflow: hidden;
    background-color: #f5f8fa;
}

div.form-row.nocursor {
    cursor: default;
}

.italic {
    font-style: italic;
}

div.form-row:hover div.filename,
div.form-row:hover div.filedate,
div.form-row.selected {
    font-weight: bold;
    color: #006F91;
}

div.form-row.unprocessed:hover div.filename,
div.form-row.unprocessed:hover div.filedate,
div.form-row.unprocessed.selected {
    font-weight: bold;
}

div.form-row div.filename {
    float: left;
    width: 65%;
    overflow: hidden;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 5px;
}

div.form-row div.filedate {
    float: right;
    padding-right: 5px;
}

.k-tooltip {
    border-color: #004054 !important;
    background-color: #004054 !important;
    background-image: none !important;
    width: 350px;
}

div.document-tooltip {
    background: #004054;
    font-size: 10pt;
    font-weight: normal;
    width: 350px;
    padding: 5px 0 5px 0;
    color: #ffffff;
    text-align: left;
}

.tooltip-image-container, .tooltip-details-container {
    display: inline-block;
    padding-right: 5px;
}

.tooltip-image-container {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.tooltip-image-circle {
    display: inline-block;
    width: 64px;
    height: 64px;
    -ms-border-radius: 32px;
    -webkit-border-radius: 32px;
    -moz-border-radius: 32px;
    border-radius: 32px;
    background-color: rgba(255, 255, 255, .2);
}

div.tooltip-image-container img {
    position: relative;
    top: 50%;
    left: 50%;
    -moz-transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
}

.tooltip-details-container {
    width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-align: left;
    vertical-align: top;
    margin-left: 70px;
}

div.tooltip-details-container div.filename, div.tooltip-details-container div.filedate {
    overflow: hidden;
    -webkit-text-overflow: ellipsis;
    -moz-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 5px;
}

div.tooltip-details-container div.view {
    padding: 10px 0 0 5px;
    font-style: italic;
}

/* document viewer*/

.slideable_content {
    top: 60px;
    right: 550px;
    display: none;
    width: 0px;
    background-color: #F5F8FA;
    z-index: 500;
}

#flyoutRequirements {
    padding: 20px 10px 20px 20px;
    border-left: solid 1px #8995a2;
    border-right: solid 1px #8995a2;
    background-color: #F5F8FA;
    position: absolute;
    top: 0;
    bottom: 0px;
    width: 669px;
}

    #flyoutRequirements div.close-flyout {
        position: absolute;
        top: 20px;
        right: 20px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        border-radius: 4px;
        border: 1px solid #f5f8fa;
        cursor: pointer;
    }

        #flyoutRequirements div.close-flyout:hover {
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            -ms-border-radius: 4px;
            border-radius: 4px;
            border: 1px solid #747474;
        }

.requirements-header {
    margin-bottom: 10px;
    font-size: 14pt;
}

    .requirements-header div.title {
        text-align: center;
        overflow: hidden;
        -webkit-text-overflow: ellipsis;
        -moz-text-overflow: ellipsis;
        text-overflow: ellipsis;
        width: 90%;
        white-space: nowrap;
    }

        .requirements-header div.title.requirements {
            width: auto !important;
        }

            .requirements-header div.title.requirements img {
                cursor: pointer;
                padding-left: 20px;
                vertical-align: middle;
            }

.requirements-body {
    height: 97%;
}

.viewer-container {
    border: 1px solid #cccccc;
    position: absolute;
    top: 60px;
    bottom: 10px;
    width: 660px;
}

.document-viewer {
    margin-top: 15px;
    top: 90px;
}

.form-details {
    display: inline-block;
    vertical-align: middle;
    width: 400px;
    text-align: left;
    margin-left: 30px;
}

    .form-details div.form, .form-details div.form-title {
        padding-left: 0px !important;
        overflow: hidden;
        white-space: nowrap;
        -moz-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

.requirements-footer {
    height: 10px;
}

#documentViewerContainer {
    height: 100%;
    float: left;
}

.download {
    position: absolute;
    top: 57px;
    right: 20px;
    cursor: pointer;
    width: 40px;
    height: 40px;
}

.download-requirements {
    display: inline-block;
    padding-left: 20px;
}

.download img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

.download:hover img {
    -webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.24);
    -moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.24);
    -ms-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.24);
    box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.24);
}

.download:active img {
    -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.24);
    -moz-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.24);
    -ms-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.24);
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.24);
}

#pageDropDown.k-dropdown {
    width: 100%;
}

.page-container {
    font-size: 10pt;
    vertical-align: middle;
    display: inline-block;
    text-align: center;
    padding-top: 0px;
}

.pager-icon {
    height: 23px;
    width: 23px;
    vertical-align: bottom;
    padding-bottom: 3px;
    cursor: pointer;
}

#pageDropDown {
    font-size: 12pt;
    margin-top: 6px;
}

#pageComplete {
    float: right;
    height: 25px;
    width: 25px;
    display: inline-block;
    vertical-align: bottom;
    padding-right: 6px;
    cursor: pointer;
}

#requirementsViewerFrame {
    width: 100%;
    height: 100%;
}

.page-item {
    font-size: 10pt;
    color: grey;
}

div.page-number {
    font-size: 12pt;
    font-weight: bold;
}

div.form-name {
    font-size: 10pt;
    padding-left: 36px;
}

div.form-title {
    font-size: 10pt;
    padding-left: 8px;
}

.recognized-form {
    color: #004054;
}

.historical {
    font-style: italic;
}

#pageBackward {
    cursor: pointer;
    background: url('../../../images/page_backward.png') no-repeat;
}

    #pageBackward.disabled {
        cursor: default;
        background: url('../../../images/page_backward_disabled.png') no-repeat;
    }

#pageForward {
    cursor: pointer;
    background: url('../../../images/page_forward.png') no-repeat;
}

    #pageForward.disabled {
        cursor: default;
        background: url('../../../images/page_forward_disabled.png') no-repeat;
    }

#pageForward, #pageBackward {
    width: 25px;
    height: 25px;
    display: inline-block;
    vertical-align: middle;
}

/* Edit Coverage Window Styles*/
#editCoverageModal {
    padding: 1em !important;
}

.coverage-modal-body {
    font-family: 'Open Sans', sans-serif;
    font-size: 12pt;
    color: #2e393d;
    overflow: hidden;
    /*height: 320px;*/
    width: 550px;
}

#editCoverageModal .coverage-modal-body {
    min-height: 200px;
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: auto;
    border-top: 1px solid #cccccc;
    padding-top: 10px;
    border-bottom: 1px solid #cccccc;
    position: relative;
}

#editCoverageModal .coverage-modal-footer {
    position: absolute;
    bottom: 12px;
}

div.coverage-text-area {
    padding-top: 20px;
}

div.coverage-loading-outer {
    position: absolute;
    left: 50%;
    top: 50%;
    overflow: hidden;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

div.coverage-loading-inner {
    text-align: center;
}

    div.coverage-loading-inner img {
        vertical-align: middle;
    }

div.coverage-list-header {
    height: 30px;
}

    div.coverage-list-header div {
        float: right;
        margin-right: 25px;
        font-weight: 600;
        font-size: 12pt;
    }

.coverage-modal-body div.coverage-list {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

    .coverage-modal-body div.coverage-list.policy-list {
        max-height: 237px;
        min-height: 200px;
        border-bottom: 2px solid #dadfe4;
        padding: 5px 0;
        position: relative;
    }

.confirm-coverage-modal-footer {
    /*text-align: center;*/
    padding-top: 15px;
    float: right;
}

div.certificate-holder-list {
    text-align: center;
    overflow-y: auto;
    max-height: 200px;
}

    div.certificate-holder-list span.header {
        font-weight: bold;
        color: #2e393d;
        text-decoration: underline;
    }

    div.certificate-holder-list ul {
        padding: 0px;
        list-style-type: none;
        margin: 0;
    }

        div.certificate-holder-list ul li {
            font-weight: bold;
            font-size: 12pt;
            margin: 0;
            padding: 2px;
            color: #107391;
            text-decoration: none;
        }

.coverage-modal-body div.coverage-list div.coverage-row {
    overflow: hidden;
    padding-bottom: 10px;
    display: inline-block;
}

.policy-row {
    border-bottom: solid 1px #e1dedb;
    display: block !important;
    padding-bottom: 5px !important;
    padding-top: 5px !important;
}

span.underline {
    text-decoration: underline;
}

.coverage-modal-body div.coverage-list div.coverage-row div.coverage-details {
    /* float: left; */
    /* margin-top: 10px; */
    margin-left: 10px;
    display: inline-block;
    width: 400px;
    height: 30px;
    line-height: 30px;
}

.coverage-modal-body div.coverage-list div.coverage-row div.coverage-buttons {
    float: right;
    width: 90px;
    /*margin-right: 20px;*/
}

.coverage-undo-button, .coverage-remove-button {
    line-height: 10px;
    border: 0 none;
    font-size: 10pt;
    -moz-min-width: 50px !important;
    -ms-min-width: 50px !important;
    -o-min-width: 50px !important;
    -webkit-min-width: 50px !important;
    min-width: 50px !important;
    font-size: 10pt;
    line-height: 10px;
    width: 65px !important;
}

.coverage-remove-button {
    background-color: #F2AF32;
}

span.coverage-type-removed {
    color: #a8adae;
}

span.removed-text {
    color: #ff5151;
    font-size: 8pt;
    float: right;
    margin-top: 3px;
}

.coverage-remove-button:hover {
    background-color: #DEA12F;
}

.coverage-remove-button:active, .coverage-remove-button:active {
    background-color: #DEA12F;
}

.coverage-undo-button {
}

.coverage-notes {
    height: 70px;
    width: 568px;
    -moz-resize: none;
    -ms-resize: none;
    -o-resize: none;
    resize: none;
}

.policy-loader {
    height: 90px !important;
}

.policy-label {
    font-size: 12pt;
    font-weight: bold;
    border-bottom: solid 1px #e1dedb;
}

div.cancel-modal-body div.coverage-list-header {
    position: absolute;
    top: 9px;
    right: 10px;
    font-size: 10pt;
}

.policy-buttons {
    float: none !important;
    display: inline-block;
    position: relative;
    /* right: -32px; */
    top: 50%;
    height: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.cancel-toggle-wrapper div.on-off-wrapper {
    /*width: 145px !important;*/
    font-size: 10pt;
    white-space: nowrap;
}

    .cancel-toggle-wrapper div.on-off-wrapper div {
        white-space: nowrap;
    }

/* Confirm Coverage */
.cancel-button {
    background-color: #F2AF32 !important;
    border-color: #F2AF32 !important;
}

    .cancel-button:hover, .cancel-button:focus {
        background-color: #DEA12F !important;
        border-color: #DEA12F !important;
    }

    .cancel-button:active {
        background-color: #F2AF32 !important;
        border-color: #F2AF32 !important;
    }

#confirmBody {
    font-family: 'Open Sans', sans-serif;
    font-size: 12pt;
    color: #2e393d;
    overflow: hidden;
    height: 310px;
    width: 550px;
}

    #confirmBody div.confirm-header {
    }

    #confirmBody div.confirm-subheader {
    }

.submit-loading {
    position: relative;
    left: -45px;
    height: 24px;
    top: 7px;
    width: 24px;
}

.coverage-text-body {
    padding-top: 20px;
}

p.explanation {
    margin: 5px 0;
}

.file-disclaimer {
    font-size: 10pt;
}

.optional {
    font-size: 10pt;
}

.policy-details {
    font-size: 10pt;
    width: 378px !important;
    overflow: hidden;
    line-height: 20px !important;
    position: relative !important;
    float: none !important;
    height: auto !important;
}

.label {
    font-weight: 600;
    font-size: 10pt;
}

.expires-label {
    margin-right: 5px;
}

.expired {
    font-weight: 600;
    color: #ff0000;
    font-size: 8pt;
    font-style: italic;
}

div.policy-detail-line {
    width: 380px;
    word-wrap: break-word;
    white-space: normal;
    padding: 1px;
}

.cancel-remove-button, .cancel-undo-button {
    -moz-min-width: 110px !important;
    -ms-min-width: 110px !important;
    -o-min-width: 110px !important;
    -webkit-min-width: 110px !important;
    min-width: 110px !important;
    width: 105px !important;
    height: 15px;
}

.explanation-area {
    margin-top: 10ox;
}
/* override of common single upload styles to look okay on cancel policy modal*/
.file-field-wrapper {
    margin-top: 10px;
}

.cancel-modal-body {
    height: auto !important;
    width: 575px
}

    .cancel-modal-body div p span.error {
        font-size: 10pt;
    }

.file-field-wrapper .button {
    top: -1px;
    height: 26px;
}

.file-field-wrapper .file-field {
    left: 1px;
}

.file-disclaimer {
    font-size: 8pt;
    position: relative;
    top: -4px;
}

/* pagedropdown custom shim*/
.iframeshim-wrapper .iframe-shim {
    /*position: relative;
    left: 0px;
    top: 0px;
    width: 308px;
    height: 200px;
    z-index: 1000;*/
}

#onboardIcon {
    background-color: #004054;
    border: 1px solid #004054;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    color: #ffffff;
    text-align: center;
    font-size: 10pt;
    font-weight: 700;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    padding: 0px;
    border: 0px;
    overflow: hidden;
    position: fixed;
    z-index: 16000002;
    width: 180px;
    height: 30px;
    bottom: 0px;
    right: 2%;
    cursor: pointer;
}

    #onboardIcon div {
        position: relative;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

#onboardModalBackground {
    z-index: 1000001;
    width: 100%;
    height: 100%;
    positioN: fixed;
    top: 0px;
    left: 0px;
    background-color: #2d393d;
    background-color: rgba(45,57,61,0.4);
}

#onboardModal {
    overflow: auto;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 860px;
    height: 536px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    -o-border-radius: 6px;
    border-radius: 6px;
    background: #004054;
    z-index: 10001;
    font-size: 12pt;
    font-weight: normal;
    color: #ffffff;
    -webkit-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    -moz-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    -ms-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    -o-box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
    box-shadow: 10px 10px 39px 0px rgba(0,0,0,0.24);
}

.close-onboard {
    position: absolute;
    top: 16px !important;
    right: 16px !important;
    z-index: 10002;
}

#onboardModal div.logo {
    position: absolute;
    top: 13px;
    left: 16px;
}

#onboardModal div.slider-container {
    height: 343px;
    width: 860px;
    position: relative;
}

    #onboardModal div.slider-container div.loading-container {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translateY(-50%) translateX(-50%);
        -moz-transform: translateY(-50%) translateX(-50%);
        -ms-transform: translateY(-50%) translateX(-50%);
        -o-transform: translateY(-50%) translateX(-50%);
        transform: translateY(-50%) translateX(-50%);
    }

div.action-slide-outer {
    height: 343px;
    width: 860px;
    position: relative;
    text-align: center;
}

.slide-header {
    padding-top: 30px;
    font-size: 24px;
}

.slide-text-container {
    font-size: 16px;
    padding-top: 0px;
    overflow: hidden;
}

    .slide-text-container div {
        width: 87%;
        position: relative;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        overflow: hidden;
        white-space: normal;
    }

.slide-attention-container {
    font-size: 14px;
    font-weight: 600;
    position: absolute;
    bottom: 125px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

    .slide-attention-container img {
        vertical-align: middle;
    }

    .slide-attention-container span {
        padding-left: 10px;
    }

.slide-button-container {
    position: absolute;
    bottom: 65px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

button.fix-assignment-button {
    /*width: 190px;*/
    height: 36px;
    text-align: center;
    color: #596264;
    font-size: 14px;
    font-weight: 600;
    background-color: #ffffff;
    border-color: #ffffff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    border: 0 none;
    cursor: pointer;
}

    button.fix-assignment-button:hover {
    }

#onboardModal div.card-outer-container {
    position: relative;
    height: 193px;
    width: 860px;
    background-color: #e9ebef;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
    -ms-border-bottom-left-radius: 6px;
    border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-bottom-right-radius: 6px;
    -ms-border-bottom-right-radius: 6px;
    border-bottom-right-radius: 6px;
}

div.card-outer-container div.card-container {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
}

div.card {
    width: 120px;
    height: 153px;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
    margin: 0px 8px;
    position: relative;
    top: 22px;
    cursor: pointer;
}

    div.card.small {
        width: 90px;
    }

        div.card.small div.body div.inner {
            width: 80px !important;
        }

    div.card.selected, div.card:hover {
        -webkit-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.24);
        -moz-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.24);
        -ms-box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.24);
        box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.24);
    }

    div.card div.header {
        height: 73px;
        width: inherit;
        position: relative;
        white-space: nowrap;
        overflow: hidden;
        color: #ffffff;
        -webkit-border-top-right-radius: 4px;
        -moz-border-top-right-radius: 4px;
        -ms-border-top-right-radius: 4px;
        border-top-right-radius: 4px;
        -webkit-border-top-left-radius: 4px;
        -moz-border-top-left-radius: 4px;
        -ms-border-top-left-radius: 4px;
        border-top-left-radius: 4px;
    }

.green {
    background-color: #41ba77;
}

.orange {
    background-color: #F2AF32;
}

.gray {
    background-color: #BFBFBF;
}

.gray-text {
    color: #BFBFBF;
}

.white-text {
    color: #ffffff;
}

.green-text {
    color: #41ba77;
}

.orange-text {
    color: #f2af32;
}

div.card div.body {
    height: 80px;
    width: inherit;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    color: #596264;
    background-color: #ffffff;
    -webkit-border-bottom-right-radius: 4px;
    -moz-border-bottom-right-radius: 4px;
    -ms-border-bottom-right-radius: 4px;
    border-bottom-right-radius: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-bottom-left-radius: 4px;
    -ms-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

div.card div div.header div.inner {
    position: absolute;
    left: 50%;
    top: 3px;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.center {
    top: 50% !important;
    left: 50% !important;
    -webkit-transform: translateX(-50%) translateY(-50%) !important;
    -moz-transform: translateX(-50%) translateY(-50%) !important;
    -ms-transform: translateX(-50%) translateY(-50%) !important;
    -o-transform: translateX(-50%) translateY(-50%) !important;
    transform: translateX(-50%) translateY(-50%) !important;
}

div.card div.body div.inner {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 60px;
    vertical-align: top;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    width: 95px;
    font-weight: normal;
    font-size: 12px;
    line-height: 12px;
    white-space: normal;
}

.large {
    font-size: 24px;
    font-weight: 600;
}

div.header div.inner div.header-images {
    display: inline-block;
    vertical-align: middle;
}

div.header div.inner div.header-count {
    font-size: 24px;
    font-weight: 600;
    margin-top: 5px;
}

div.card div div.header div.inner div.header-text {
    font-size: 8px;
    font-weight: 600;
    white-space: normal;
    width: 105px;
    margin-top: 2px;
}

div.card.small div div.header div.inner div.header-text {
    font-size: 8px;
    font-weight: 600;
    white-space: normal;
    width: 86px;
    margin-top: 2px;
}

/*slider*/

.slider-dot-container {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: 21px;
}

    .slider-dot-container div {
        display: inline-block;
        margin-left: 8px;
        margin-right: 8px;
    }

.slide-dot {
    width: 12px;
    height: 12px;
    background-color: rgba(255, 255, 255, 0.6);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    border-radius: 6px;
    cursor: pointer;
}

.chevron {
    cursor: pointer;
    positioN: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-opacity: .4;
    -moz-opacity: .4;
    -ms-opacity: .4;
    opacity: .4;
    z-index: 10003;
}

    .chevron:hover {
        -webkit-opacity: 1;
        -moz-opacity: 1;
        -ms-opacity: 1;
        opacity: 1;
    }

    .chevron.left {
        left: 10px;
    }

    .chevron.right {
        right: 10px;
    }

.slide-dot:hover {
    background-color: rgba(255, 255, 255, .8);
}

.slide-dot.selected {
    background-color: rgba(255, 255, 255, 1);
}

div.certificate-icon-container {
    position: absolute;
    left: 360px;
    top: 120px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

div.certificate-circle {
    width: 130px;
    height: 130px;
    -ms-border-radius: 65px;
    -webkit-border-radius: 65px;
    -moz-border-radius: 65px;
    border-radius: 65px;
    background-color: rgba(255, 255, 255, 0.2);
}

    div.certificate-circle img.certificate-icon {
        width: 66px;
        height: 80px;
        position: relative;
        top: 50%;
        left: 50%;
        -webkit-transform: translateY(-50%) translateX(-50%);
        -moz-transform: translateY(-50%) translateX(-50%);
        -ms-transform: translateY(-50%) translateX(-50%);
        -o-transform: translateY(-50%) translateX(-50%);
        transform: translateY(-50%) translateX(-50%);
    }

div.welcome-container {
    position: absolute;
    top: 58%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 16px;
    text-align: center;
    font-weight: 600;
}

    div.welcome-container p {
        margin: 10px 0px;
    }

/* Firefox Kendo fix */
.k-ff {
    overflow: inherit !important;
}

#videoPopupWrapper {
}

#videoPopup {
}


.modern-form {
    max-width: 500px;
    margin: 0 auto;
    padding: 20px;
}

.modern-input-group {
    position: relative;
    margin-bottom: 20px;
}

.modern-input {
    width: 100%;
    padding: 12px 0px 12px 12px;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    font-size: 16px;
    transition: all 0.3s ease;
    outline: none;
    background-color: #f9f9f9;
}

    .modern-input:focus {
        border-color: #4a90e2;
        box-shadow: 0 0 8px rgba(74, 144, 226, 0.2);
        background-color: white;
    }

.modern-label {
    position: absolute;
    top: -10px;
    left: 10px;
    background-color: white;
    padding: 0 5px;
    font-size: 14px;
    color: #666;
    transition: all 0.3s ease;
    pointer-events: none;
}

.modern-input:focus + .modern-label,
.modern-input:not(:placeholder-shown) + .modern-label {
    top: -20px;
    font-size: 12px;
    color: #4a90e2;
}

.modern-error {
    color: #ff4d4d;
    font-size: 13px;
    margin-top: 5px;
    margin-left: 5px;
}

.agent-modal-body {
    font-family: 'Open Sans', sans-serif;
    font-size: 12pt;
    color: #2e393d;
    overflow: hidden;
    /*height: 320px;*/
    width: 550px;
}

div.agent-loading-inner {
    text-align: center;
}

div.agent-list-header {
    height: 30px;
}

divagent-list-header div {
    float: right;
    margin-right: 25px;
    font-weight: 600;
    font-size: 12pt;
}

.agent-modal-body div.agent-list {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.agent-modal-body div.agent-loading-outer {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.agent-modal-body div.agent-list.policy-list {
    max-height: 237px;
    min-height: 200px;
    border-bottom: 2px solid #dadfe4;
    padding: 5px 0;
    position: relative;
}

.confirm-agent-modal-footer {
    /*text-align: center;*/
    padding-bottom: 10px;
    margin-right: 15px;
    float: right;
}

/* Add these styles - similar to what I provided in the previous response */
.email-change-confirm-body {
    text-align: center;
    padding: 20px;
}

.confirm-icon {
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
}

.warning-icon {
    display: inline-block;
    width: 64px;
    height: 64px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23f4683c" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>');
    background-repeat: no-repeat;
}

.email-addresses {
    background-color: #f4f4f4;
    padding: 10px;
    margin: 10px 0;
    border-radius: 5px;
}

.original-email, .new-email {
    margin: 5px 0;
}

.confirmation-actions {
    display: flex;
    gap: 10px;
    float:right;
    margin-left: 10px;
    margin-bottom: 10px;
}

.success-actions {
    display: flex;
    gap: 10px;
    margin-left: 10px;
    margin-bottom: 10px;
}

/* Submit Override */
.submit-override-modal-body {
    font-family: 'Open Sans', sans-serif;
    font-size: 12pt;
    color: #2e393d;
    overflow: hidden;
    /*height: 320px;*/
    width: 580px;
}

.submit-override-modal-body div.submit-override-loading-outer {
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

div.submit-override-loading-inner {
    text-align: center;
    font-size: 35px;
    color: darkslategray;
}

.confirm-submit-override-modal-footer {
    /*text-align: center;*/
    padding-bottom: 10px;
    margin-right: 15px;
}

.submit-override-confirm-body {
    margin-bottom: 20px;
}

.submit-override-sucess-body {
    text-align: center;
    margin-bottom: 20px;
}

.modern-textarea-label {
    position: absolute;
    top: 10px;
    left: 15px;
    background-color: white;
    padding: 0 5px;
    font-size: 14px;
    color: #666;
    transition: all 0.3s ease;
    pointer-events: none;
}

.modern-textarea {
    width: 100%;
    padding: 12px 0px 12px 12px;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    font-size: 16px;
    transition: all 0.3s ease;
    outline: none;
    background-color: #f9f9f9;
}

.overrideMessageRequestClass:focus {
    border-color: lightblue;
}

.overrideMessageReasonClass:focus {
    border-color: lightblue;
}

.override-form-body {
    margin: 0 25px 0 10px;
}

.modern-textarea-footer{
    font-size: 14px;
}

.submitOverrideButtonWrapper{
    margin-left:10px;
}

.submitOverrideButtons {
    background-color: #004456;
    border-color: #004456;
    color: #fff;
    border: 0 none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
    display: inline-block;
    padding: 5px 10px 5px 10px;
    margin-top: 10px;
    margin-bottom: 0px;
    line-height: 20px;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    text-transform: none;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    -moz-min-width: 70px;
    -ms-min-width: 70px;
    -o-min-width: 70px;
    -webkit-min-width: 70px;
    min-width: 70px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    white-space: nowrap;
}

.submitOverrideCancelButton {
    background-color: white;
    border-color: #004456;
    color: #004456;
    border: 1px solid;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
    display: inline-block;
    padding: 5px 10px 5px 10px;
    margin-top: 10px;
    margin-bottom: 0px;
    line-height: 20px;
    font-family: 'Open Sans', sans-serif;
    font-size: 12px;
    text-transform: none;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    -moz-min-width: 70px;
    -ms-min-width: 70px;
    -o-min-width: 70px;
    -webkit-min-width: 70px;
    min-width: 70px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    white-space: nowrap;
}
.mt-1 {
    margin-top: 0.25rem;
}

.mt-2 {
    margin-top: 0.5rem;
}
.mt-3 {
    margin-top: 0.75rem;
}