html,
body {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}

.header {
    width: 200px;
    height: 100%;
    position: relative;
    top: 0;
    left: 0;
    background: whitesmoke;
    /*background: #25538e;
     background: linear-gradient(
        to bottom,
        #25538e,
        #0b1036
    ); */
}

.currinput {
    width: 125px !important;
    text-align: right;
}

.header-logo {
    width: 200px;
    height: 120px;
    background: url(../images/ast-logo.png) no-repeat center;
    background-size: contain;
}

.header-function {
    position: relative;
    top: 60px;
}

.header-function-button {
    height: 36px;
    line-height: 36px;
    padding: 4px 0;
    /* color: #fff; */
    color: #000;
    transition: all 0.2s ease-in;
}

.header-function-button:hover {
    cursor: pointer;
    background: rgb(237, 237, 237);
    color: #000;
}

.body {
    position: absolute;
    top: 0;
    left: 200px;
    padding: 0 0 100px 0;
}

#master-menu {
    margin: 36px 0 0 12px;
}

#forms-menu {
    max-height: 1000px;
    overflow: auto;
}

.menu-container {
    width: 824px;
    display: none;
    margin: 12px 0 0 12px;
    background-color: #fff;
    min-height: 300px;
}

.menu-container2 {
    display: none;
}

.menu-button {
    min-width: 160px;
    width: 41%;
    height: 36px;
    line-height: 36px;
    padding: 4px 0;
    color: #fff;
    background: rgb(120, 120, 120);
    /*
    color: #000;
    background: rgb(237,237,237);
    */
    transition: all 0.2s ease-in;
    text-align: center;
}

.menu-button2 {
    width: 80%;
    height: 36px;
    line-height: 36px;
    padding: 4px 0;
    color: #fff;
    background: rgb(120, 120, 120);
    /*
    color: #000;
    background: rgb(237,237,237);
    */
    transition: all 0.2s ease-in;
    text-align: center;
}

.menu-button:hover,
.menu-button2:hover {
    cursor: pointer;
    background: #25538e;
    color: #fff;
}

.menu-page {
    display: none;
    min-height: 200px;
}

.menu-preview {
    display: none;
    height: 800px;
    margin: 0 0 8px 0;
}

.menu-preview iframe {
    width: 600px;
    height: 800px;
    border: none;
}

.filter-container {
    width: 80%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: 0 0 4px 0;
}

.filter-container2 {
    width: 75%;
    display: flex;
    margin: 0 0 4px 0;
}

.filter-button {
    min-width: 96px;
    height: 28px;
    line-height: 28px;
    padding: 4px 16px;
    text-align: center;
    font-size: 100%;
    background: rgb(237, 237, 237);
    transition: all 0.2s ease-in;
}

.filter-button:hover {
    cursor: pointer;
    color: #fff;
    background: #25538e;
}

.active-filter-button {
    background: #25538e;
    color: #fff;
    transition: all 0.2s ease-in;
}

.active-filter-button:hover {
    cursor: pointer;
    background: #30589d;
}

.filter {
    background: url(../images/glyphicons-321-filter-25538e.png) no-repeat center left 2px;
}

.filters {
    width: 280px;
    height: 32px;
    margin: 0 0 2px 0;
}

.filters input {
    width: 200px;
    padding: 4px 0 4px 30px;
    font-size: 100%;
    border: 1px solid gray;
    margin: 0 0 0 4px;
    transform: translate(0, 5px);
}

.filters2 input {
    width: 156px;
    padding: 6px 0 6px 30px;
    font-size: 100%;
    border: 1px solid gray;
    margin: 0 0 0 4px;
    transform: translate(0, 5px);
}

.filters input:hover,
.filters input:hover {
    border: 1px solid #000;
}

.filters select {
    width: 200px;
    height: 30px;
    padding: 6px 0 6px 4px;
    transform: translate(0, 5px);
    font-size: 100%;
    margin: 0 0 0 4px;
}

.filters input[type='checkbox'] {
    width: auto;
    height: auto;
    padding: 0 4px;
    margin: 0 0 0 4px;
}

.filters label {
    width: 120px;
    height: 30px;
    line-height: 30px;
    margin: 2px 0 0 4px;
    vertical-align: middle;
}

.filters .input-date input {
    width: 200px;
    padding: 5px 0 5px 30px;
    font-size: 100%;
    border: 1px solid gray;
    margin: 0 0 0 4px;
    /*transform: translate(0,5px);*/
}

.page-container {
    width: 80%;
    display: flex;
    justify-content: space-between;
    margin: 5px 0 0 0;
}

.pages {
    min-width: 240px;
    height: 44px;
    line-height: 44px;
    font-size: 100%;
    text-align: center;
}

.hr-table {
    width: 80%;
    margin: 2px 0 2px 0;
    border: 1px solid #000;
    box-sizing: border-box;
}

.table-tabs {
    width: 80%;
    height: 44px;
    display: flex;
    background: rgb(120, 120, 120);
}

.table-tab {
    width: 50%;
    height: 100%;
    line-height: 44px;
    text-align: center;
    color: #fff;
    transition: all 0.2s ease-in;
}

.table-tab:hover {
    cursor: pointer;
    background: #25538e;
}

.active-table-tab {
    background: #25538e;
}

.active-table-tab:hover {
    background: #30589d;
}

.result-table {
    border-collapse: collapse;
}

.result-table2 {
    table-layout: auto;
    width: 80%;
    /*
    display: none;
    */
    border-collapse: collapse;
}

/* For CPL List */
.cpl-result {
    display: none;
}

/* For Jacket List  */
.jacket-result {
    display: none;
}

/* For Admin List */
.master-result {
    display: none;
}

.reset-table-button {
    width: 120px;
    height: 32px;
    line-height: 32px;
    padding: 4px 8px;
    margin: 0;
    text-align: center;
    background: rgb(120, 120, 120);
    color: #fff;
    transition: all 0.2s ease-in;
}

.reset-table-button:hover {
    cursor: pointer;
    background: #25538e;
}

.table-header {
    background: rgb(120, 120, 120);
    color: #fff;
}

.table-header-icons {
    padding: 6px 16px;
}

.table-header-button {
    padding: 6px 16px;
    transition: all 0.2s ease-in;
    font-size: 14px;
}

.table-header-button:hover {
    cursor: pointer;
    background: rgb(80, 80, 80);
}

.table-row {
    border-collapse: collapse;
}

.table-row:nth-child(even) {
    background: rgb(237, 237, 237);
}

.table-icons {}

.auto-width {
    min-width: 44px;
    width: auto;
}

.auto-width2 {
    min-width: 44px;
    width: auto;
    padding: 0 6px;
}

.menu-title {
    height: 44px;
    font-size: 150%;
}

.on-off {}

.disabled {
    background: rgb(200, 200, 200) !important;
    color: #000 !important;
}

.disabled:hover {
    cursor: default;
    background: rgb(200, 200, 200) !important;
    color: #000 !important;
}

.disable-fields {
    width: 660px;
    height: 190px;
    position: absolute;
    background: rgba(160, 160, 160, 0.2);
    z-index: 1;
}

.disable-fields2 {
    width: 660px;
    height: 300px;
    position: absolute;
    background: rgba(160, 160, 160, 0.2);
    z-index: 1;
}

.disable-fields4 {
    width: 660px;
    height: 128px;
    position: absolute;
    background: rgba(160, 160, 160, 0.2);
    z-index: 1;
}

.disable-fields3 {
    visibility: hidden;
}

.disable-fields5 {
    width: 660px;
    height: 136px;
    position: absolute;
    background: rgba(160, 160, 160, 0.2);
    z-index: 1;
}

.flex-form {
    width: 684px;
    display: block;
    position: relative;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    margin: 0 0 8px 0;
}

.row {
    width: 100%;
    /*
    height: 24px;
    */
}

.row2 {
    width: 100%;
    /*
    height: 54px;
    */
    position: relative;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.row2:nth-child(odd) {
    background: rgba(37, 83, 142, 0.05);
    /* background: rgb(237,237,237); */
    /* border: 1px solid #bde4f4; */
}

.no-row {
    width: 40%;
    height: 54px;
}

.icon-row {
    width: 36px;
    height: 20px;
    position: absolute;
    top: 8px;
    right: 8px;
}

.form-row {
    width: 40%;
    height: 54px;
}

.mortgage-row {
    /*
    min-width: 40%;
    display: table-cell;
    */
}

.mortgage-row .input-title {
    width: auto;
}

.mortgage-row .input-date input,
.row2 .input-date2 input {
    background-color: #fff;
}

.input-title {
    width: 100%;
    height: 16px;
    margin: 0 0 6px 0;
    font-size: 15px;
    position: relative;
}

.input-help {
    width: 24px;
    height: 14px;
    display: inline;
    margin: 0 0 0 20px;
    padding: 2px 10px;
    font-size: 11px;
    text-align: center;
}

.input-help-active {
    background: url(../images/glyphicons-196-info-sign-25538e.png) no-repeat center;
}

.input-help-active:after {
    /*
    content: '?';
    */
}

.input-help-inactive:after {
    content: '';
}

.input-error {
    background: url(../images/glyphicons-197-exclamation-sign-fd2e2e.png) no-repeat center;
}

.input-error:after {
    content: '';
}

.input-dropdown {
    display: none;
    position: absolute;
    right: 0;
    z-index: 2;
}

.help-dropdown,
.error-dropdown {
    display: none;
}

.input-help.input-help-active:hover+.input-dropdown,
.input-help.input-help-inactive:hover+.input-dropdown {
    cursor: help;
    display: block;
}

.input-help.input-help-active:hover+.input-dropdown>.help-dropdown {
    display: block;
    padding: 4px 10px;
    background: #fff;
    border: 2px solid #25538e;
}

.input-help.input-error:hover+.input-dropdown {
    cursor: help;
    display: block;
}

.input-help.input-error:hover+.input-dropdown>.error-dropdown {
    display: block;
    padding: 4px 10px;
    background: #fff;
    border: 2px solid #fd2e2e;
}

.input textarea {
    width: 300px;
    height: 32px;
    margin: 0 0 0 6px;
}

.input input {
    width: 90%;
    height: 26px;
    padding: 2px 4px;
    box-sizing: border-box;
}

.input2 input {
    width: 45%;
    height: 26px;
    padding: 2px 4px;
    box-sizing: border-box;
}

.input input:focus,
.input2 input:focus,
.input-date input:focus,
.input-date2 input:focus {
    box-shadow: 0px 0px 3px #25538e;
    border: 1px solid #25538e;
}

.input-date input {
    width: 90%;
    height: 26px;
    padding: 2px 0 2px 30px;
    border: 1px solid gray;
    box-sizing: border-box;
    background: url(../images/glyphicons-46-calendar-25538e.png) no-repeat center left 2px;
}

.input-date2 input {
    width: 45%;
    height: 26px;
    padding: 2px 0 2px 30px;
    border: 1px solid gray;
    box-sizing: border-box;
    background: url(../images/glyphicons-46-calendar-25538e.png) no-repeat center left 2px;
}

.input select {
    width: 90%;
    height: 28px;
    padding: 2px 0 2px 4px;
    box-sizing: border-box;
}

.input [type='checkbox'] {
    width: auto;
}

.input textarea {
    width: 86%;
    height: 40px;
    padding: 2px 0 2px 30px;
    margin: 0 0 0 34px;
    border: 1px solid gray;
    box-sizing: border-box;
}

.input .table-cell {
    vertical-align: middle;
}

.input-warning {
    font-size: 12px;
    border-top: 1px solid #ff5733;
}

.agent-label {
    margin: 0 0 0 24px
}

/* IE 9+ */
@media screen and (min-width:0\0) {
    .menu-function2 {
        width: 75%;
        display: inline-block;
    }

    .form-button {
        margin: 0 8px;
    }
}

/* IE 10+ */
@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .menu-function2 {
        width: 75%;
        display: inline-block;
    }

    .form-button {
        margin: 0 8px;
    }
}

.menu-function2 {
    width: 75%;
    display: flex;
    justify-content: space-around;
}

.form-button {
    min-width: 96px;
    height: 28px;
    line-height: 28px;
    padding: 4px 16px;
    text-align: center;
    font-size: 100%;
    color: #fff;
    background: rgb(120, 120, 120);
    /*
    background: rgb(237,237,237);
    */
    transition: all 0.2s ease-in;
}

.form-button2 {
    height: 28px;
    line-height: 28px;
    padding: 4px 0;
    text-align: center;
    font-size: 100%;
    color: #fff;
    background: rgb(120, 120, 120);

    transition: all 0.2s ease-in;
}

.form-button:hover,
.form-button2:hover {
    cursor: pointer;
    background: #25538e;
    color: #fff;
}

.footer {}

.modal {
    width: 320px;
    height: 108px;
    display: none;
    position: fixed;
    top: 25%;
    left: 45%;
    border: 3px solid #25538e;
    z-index: 5;
    border-radius: 2px;
    background: #fff;
}

.reportmodal2 {
    width: 320px;
    padding: 15px;
    /* height: 108px; */
    display: none;
    position: fixed;
    top: 25%;
    left: 45%;
    border: 3px solid #25538e;
    z-index: 5;
    border-radius: 2px;
    background: #fff;
}

.modal2 {
    width: 600px;
    height: 800px;
    display: none;
    position: absolute;
    top: 5%;
    left: 20%;
    border: 3px solid #25538e;
    z-index: 5;
    border-radius: 2px;
    background-color: #fff;
}

.modal2 iframe {
    width: 600px;
    height: 766px;
    border: none;
    position: absolute;
    top: 34px;
    left: 0;
}

.modal-textbox {
    width: 100%;
    height: 100%;
    position: relative;
    top: 0;
    left: 0;
}

.modal-text {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #000;
}

.modal-function {
    margin: 4px 0;
    width: 100%;
    display: flex;
    justify-content: space-around;
}

.modal-function2 {
    width: 100%;
    height: 34px;
    display: flex;
    justify-content: space-around;
    background: rgb(237, 237, 237);
}

.modal-function-button {
    height: 28px;
    line-height: 28px;
    padding: 4px 12px;
    color: #fff;
    background: rgb(120, 120, 120);
    /*
    background: rgb(237,237,237);
    */
    transition: all 0.2s ease-in;
}

.modal-function-button2 {
    width: 100%;
    height: 100%;
    transition: all 0.2s ease-in;
}

.modal-function-button:hover {
    cursor: pointer;
    background: #25538e;
    color: #fff;
}

.modal-function-button2:hover {
    cursor: pointer;
    background-color: #bde4f4;
}

.end-name input {
    width: 260px;
}

.end-price input {
    width: 140px;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.table-cell {
    display: table-cell;
    padding: 0 6px;
}

.serif {
    font-family: 'Lora', serif;
}

.sans-serif {
    font-family: 'Open Sans', sans-serif;
}

.status-bar {
    width: 100%;
    height: 44px;
    display: flex;
    position: fixed;
    top: -44px;
    left: 0;
    color: #fff;
    background: #fd2e2e;
    /*
    background: #ff5733;
    */
}

.status-bar-text {
    width: 90%;
    height: 100%;
    line-height: 44px;
    font-size: 22px;
    text-align: center;
}

.status-bar-close {
    min-width: 44px;
    width: 5%;
    height: 44px;
    transition: all 0.2s ease-in;
}

.status-bar-close:hover {
    cursor: pointer;
    background-color: #ff5c5c;
}

.icon {
    width: 40px;
    height: 40px;
    display: table-cell;
    transition: all 0.2s ease-in;
}

.icon2 {
    width: 54px;
    height: 54px;
    display: table-cell;
    transition: all 0.2s ease-in;
}

.icon:hover,
.icon2:hover {
    cursor: pointer;
    /*
    background-color: rgb(237,237,237);
    */
    background-color: #bde4f4;
}

.chevron-left {
    background: url(../images/glyphicons-225-chevron-left-25538e.png) no-repeat 45% center;
}

.chevron-right {
    background: url(../images/glyphicons-224-chevron-right-25538e.png) no-repeat 55% center;
}

.user-icon {
    background: url(../images/glyphicons-4-user-25538e.png) no-repeat center;
}

.print-icon {
    background: url(../images/glyphicons-16-print-25538e.png) no-repeat center;
}

.edit-icon {
    background: url(../images/glyphicons-31-pencil-25538e.png) no-repeat center;
}

.file-icon {
    background: url(../images/glyphicons-37-file-25538e.png) no-repeat center;
}

.exit-icon {
    background: url(../images/glyphicons-208-remove-25538e.png) no-repeat center;
}

.exit-icon2 {
    background: url(../images/glyphicons-208-remove-ffffff.png) no-repeat center;
}

.trash-icon {
    background: url(../images/glyphicons-17-bin-25538e.png) no-repeat center;
}

.calendar-icon {
    background: url(../images/glyphicons-46-calendar-25538e.png) no-repeat center;
}

.upload-icon {
    background: url(../images/glyphicons-364-cloud-upload-25538e.png) no-repeat center;
}

.circle-box {
    width: 100px;
    height: 100px;
    /*
    border: 4px dashed #000;
    */
    position: absolute;
    top: 180px;
    left: 450px;
}

.circle-outline {
    width: 80px;
    height: 80px;
    margin: 5px 0 0 5px;
    border-radius: 100%;
    position: relative;
    animation: spin 2s linear infinite;
    /*
    border: 4px dashed #000;
    */
}

.circle-segment {
    width: 80px;
    height: 80px;
    background: linear-gradient(-90deg, white, #25538e);
    border-radius: 100%;
    /*
    background: linear-gradient(-90deg,white,rgb(80,80,80));
    border-radius: 90px 90px 0 0;
    transform: rotate(90deg);
    border-radius: 0 100% 0 0;
    */
}

.hide-segment {
    width: 66px;
    height: 66px;
    background-color: white;
    border-radius: 100%;
    position: absolute;
    top: 7px;
    left: 7px;
}

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

    to {
        transform: rotate(360deg);
    }
}

.splash-title {
    text-align: center;
    font-size: 20px;
}

.splash-content {
    margin: 10% 0 0 0;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.splash-button {
    width: 90%;
    height: 64px;
    background-color: #25538e;
    color: #fff;
    transition: all 0.2s ease-in;
    margin: 5px 0;
    border-radius: 2px;
    position: relative;
}

.splash-button:hover {
    cursor: pointer;
    background-color: #35639f;
}

.splash-button-graphic {
    width: 64px;
    height: 64px;
    /*
    background-color: #7b9dd4;
    display: inline;
    */
    border-right: 2px solid #8bade4;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
}

.splash-button-graphic svg {
    height: 64px;
    display: inline;
    vertical-align: middle;
}

.splash-button-graphic svg path {
    fill: #ffffff;
}

.splash-button-context {
    height: 64px;
    line-height: 64px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    /*
    display: inline;
    */
    position: absolute;
    top: 0;
    left: 74px;
}

.menu-list {
    display: none;
    margin: 5% 0 0 0;
}

.menu-list .menu-button {
    width: 80%;
}

.menu-list .result-table2 {
    /*
    display: block;
    table-layout: auto;
    width: 100%;
    */
}

.working-container {
    display: none;
}

.flex-container {
    width: 100%;
    height: 700px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin: 0 0 20px 0;
    overflow: hidden;
}

.flex-left {
    width: 320px;
}

.flex-left .flex-form {
    width: 100%;
    flex-wrap: wrap;
}

.flex-left .form-row {
    width: 100%;
}

.flex-left .form-row textarea {
    width: 90%;
    margin: 0;
}

.flex-left .menu-function2 {
    width: 90%;
    margin: 20px 0 0 0;
}

.flex-right {
    width: 480px;
    height: 640px;
    border: 1px solid #1c4a99;
    box-sizing: border-box;
}

.flex-right iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.ocr-overlay {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(222, 222, 222, 0.5);
    z-index: 2;
}

.ocr-overlay svg {
    position: absolute;
    top: 50%;
    left: 50%;
    overflow: visible;
}

.ocr-container {
    position: relative;
    /*
    overflow: hidden;
    */
}

#user-submit {
    width: 100px;
}

.admin-report-row {
    height: 50px;
    padding: 5px;
}

.display-none {
    display: none;
}

.end_select_header {
    width: 400px;
}

#upload-browse-input {
    opacity: 0;
    width: 0;
}

#policy_date {
    width: 90px;
    text-align: center;
}

.width-content {
    width: content;
}