body {
    background-color: #f7f6f9 !important;
}

.icon-spin {
    -webkit-animation: icon-spin 2s linear infinite;
    animation: icon-spin 2s linear infinite;
}
.icon-pulse {
    -webkit-animation: icon-spin 1s steps(8) infinite;
    animation: icon-spin 1s steps(8) infinite;
}
.icon-blink {
    -webkit-animation: icon-blink 1s linear infinite;
}
@-webkit-keyframes icon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}
@keyframes icon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}
@keyframes icon-blink {
    50% { opacity: 0; }
}

.material-icons {
    vertical-align: bottom;
}

table.dataTable th,
table.dataTable td {
    font-size: 10pt;
    border: 1px solid #ccc;
    padding: .5em;
    cursor: pointer;
}

table.dataTable th:nth-child(n+2),
table.dataTable td:nth-child(n+2) {
    padding-left: 10px;
}

.dataTables_filter > label > input {
    margin-right: -39px;
}

.dataTables_filter > label > button {
    margin-right: 4px;
    padding: 2px 10px;
    margin-top: -2px;
}
.dataTables_scrollBody {
    padding-bottom: 15px;
}

button.dt-button {
    padding: 0.25em 1em;
}

.active > .page-link {
    background-color: #dc3545;
    border-color: #dc3545;
}

.offcanvas {
    width: calc(100% - 1em) !important;
    max-width: 1200px !important;
}

.offcanvas-backdrop .show {
    opacity: 0.65 !important;
}

input::placeholder {
    color: #888 !important;
    opacity: 0.5 !important;
}

input::-ms-input-placeholder { /* Edge 12-18 */
    color: #888 !important;
    opacity: 0.5 !important;
}

.nav-callout {
    border-bottom: 1px solid rgba(0, 0, 0, .07);
}

.nav-callout .nav-link {
    appearance: none;
    background-color: transparent;
    border: 0
}

.nav-callout > li.nav-item {
    border-radius: 10px 10px 0 0;
}

.nav-callout .nav-link.active {
    box-shadow: inset 0 -.1875rem #25476a;
}

.nav:not(.nav-pills) .nav-link:not(.active) {
    color: #6584a4;
}

.nav:not(.nav-pills) .nav-link.active {
    color: #25476a;;
    font-weight: 700;
}

.nav-item > button.nav-link {
    border-radius: 10px 10px 0 0;
}

.nav-item-label {
    padding: .25em .55em;
    border-radius: 50%;
    color: #fff;
    background-color: #000;
    margin-right: .5em;
}

.navbar-menu .navbar-nav .nav-link {
    color: #bcbcbc;
}

.navbar-menu .navbar-nav .nav-link.active {
    background-color: #79434380;
    color: #fff;
}

.navbar-menu .navbar-nav .nav-link:hover {
    color: #fff;
}

.select2-container .select2-selection--single {
    height: 37px !important;
}

.select2-selection__rendered {
    font-size: 13pt;
    padding-top: 3px;
}

.form-control:not(.is-invalid),
.select2-container .select2-selection--single {
    border-color: #999da2 !important;
}

span.small {
    font-size: 9pt !important;
}

.bg-red-200 {
    background-color: rgba(242, 187, 181) !important;
}

div.dashboard {
    margin-bottom: 2em;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 90px;
    gap: 1em;

    div.card { margin-bottom: 0 }
    strong.year,
    strong.policy-sold,
    strong.assured-amount,
    strong.total-premium,
    strong.average-premium,
    strong.average-claim-process
    { font-size: large }

    div.year { grid-area: 1 / 1 / 2 / 13 }
    div.policy-sold { grid-area: 2 / 1 / 3 / 13 }
    div.assured-amount { grid-area: 3 / 1 / 4 / 13 }
    div.total-premium { grid-area: 4 / 1 / 5 / 13 }
    div.average-premium { grid-area: 5 / 1 / 6 / 13 }
    div.average-claim-process { grid-area: 6 / 1 / 7 / 13 }

    div.assured-amount-by-risk { grid-area: 7 / 1 / 9 / 13; div > div { max-width: 300px } }
    div.premium-claim-ratio-by-risk { grid-area: 9 / 1 / 11 / 13; div > div { max-width: 300px } }
    div.compliance-table { grid-area: 11 / 1 / 16 / 13 }

    @media (min-width: 385px) and (max-width: 768px) {
        div.year { grid-area: 1 / 1 / 2 / 7 }
        div.policy-sold { grid-area: 1 / 7 / 2 / 13 }
        div.assured-amount { grid-area: 2 / 1 / 3 / 7 }
        div.total-premium { grid-area: 2 / 7 / 3 / 13 }
        div.average-premium { grid-area: 3 / 1 / 4 / 7 }
        div.average-claim-process { grid-area: 3 / 7 / 4 / 13 }

        div.assured-amount-by-risk { grid-area: 4 / 1 / 7 / 13; div > div { max-width: 500px } }
        div.premium-claim-ratio-by-risk { grid-area: 7 / 1 / 10 / 13; div > div { max-width: 500px } }
        div.compliance-table { grid-area: 10 / 1 / 16 / 13 }
    }

    @media (min-width: 769px) and (max-width: 1200px) {
        div.year { grid-area: 1 / 1 / 2 / 6 }
        div.policy-sold { grid-area: 2 / 1 / 3 / 6 }
        div.assured-amount { grid-area: 3 / 1 / 4 / 6 }
        div.total-premium { grid-area: 4 / 1 / 5 / 6 }
        div.average-premium { grid-area: 5 / 1 / 6 / 6 }
        div.average-claim-process { grid-area: 6 / 1 / 7 / 6 }

        div.assured-amount-by-risk { grid-area: 1 / 6 / 4 / 13; div > div { max-width: 400px } }
        div.premium-claim-ratio-by-risk { grid-area: 4 / 6 / 7 / 13; div > div { max-width: 400px } }
        div.compliance-table { grid-area: 7 / 1 / 10 / 13 }
    }

    @media (min-width: 1201px) and (max-width: 1600px) {
        div.year { grid-area: 1 / 1 / 2 / 4 }
        div.policy-sold { grid-area: 2 / 1 / 3 / 4 }
        div.assured-amount { grid-area: 3 / 1 / 4 / 4 }
        div.total-premium { grid-area: 4 / 1 / 5 / 4 }
        div.average-premium { grid-area: 5 / 1 / 6 / 4 }
        div.average-claim-process { grid-area: 6 / 1 / 7 / 4 }

        div.assured-amount-by-risk { grid-area: 1 / 4 / 4 / 8 }
        div.premium-claim-ratio-by-risk { grid-area: 1 / 8 / 4 / 13; div > div { max-width: 450px } }
        div.compliance-table { grid-area: 4 / 4 / 7 / 13 }
    }

    @media (min-width: 1601px) {
        div.year { grid-area: 1 / 1 / 2 / 3 }
        div.policy-sold { grid-area: 2 / 1 / 3 / 3 }
        div.assured-amount { grid-area: 3 / 1 / 4 / 3 }
        div.total-premium { grid-area: 4 / 1 / 5 / 3 }
        div.average-premium { grid-area: 5 / 1 / 6 / 3 }
        div.average-claim-process { grid-area: 6 / 1 / 7 / 3 }

        div.assured-amount-by-risk { grid-area: 1 / 3 / 4 / 6 }
        div.premium-claim-ratio-by-risk { grid-area: 4 / 3 / 7 / 6; div > div { max-width: 475px } }
        div.compliance-table { grid-area: 1 / 6 / 7 / 13 }
    }
}

.index-right {
    background-image: url(../images/back-2.jpg); background-position: bottom, 50px; background-size: cover;
}

.index-big-text {
    font-size: 5.5vw; padding: 3.5vw 6vw 1.5vw;
}
.index-medium-text {
    font-size: 5.5vw; padding: 2vw 6vw 1vw
}
.index-bottom-text {
    margin-top: 0
}

@media (max-width: 768px) {
    .index-big-text {
        font-size: 5.5vw; padding: 3.5vw 6vw 1.5vw;
    }
    .index-medium-text {
        font-size: 4.5vw; padding: 2vw 6vw 1vw
    }
}

@media (min-width: 769px) and (max-width: 992px) {
    .index-big-text {
        font-size: 4.5vw; padding: 2.5vw 6vw 1.5vw;
    }
    .index-medium-text {
        font-size: 4.5vw; padding: 2vw 6vw 1vw
    }
}

@media (min-width: 993px) and (max-width: 1600px) {
    .index-big-text {
        font-size: 2.5vw; padding: 1.5vw 6vw 1.5vw;
    }
    .index-medium-text {
        font-size: 2.5vw; padding: 2vw 6vw 1vw
    }
}

@media (min-width: 1601px) {
    .index-big-text {
        font-size: 2.5rem; padding: 1.5vw 6vw 1.5vw;
    }
    .index-medium-text {
        font-size: 2.5rem; padding: 2vw 6vw 1vw
    }
}

.form-label {
    float: left;
}

.auth-input .form-label {
    top: 0;
    left: 0;
}

dialog.loading,
dialog.document,
dialog.documentPrint,
dialog.listEdit,
dialog.listEditSub {
    border-radius: 25px;
    border: 1px solid #ff000080
}

dialog.document {
    width: 100%;
    max-width: 700px;
}

dialog.documentPrint {
    width: calc(100% - 16px);
    max-width: 220mm;
    height: calc(100% - 16px);
    max-height: 300mm;
}

dialog.listEdit,
dialog.listEditSub {
    width: calc(100% - 16px);
    max-width: 1200px;
    height: calc(100% - 16px);
}

dialog.listEditSub {
    height: calc(100% - 145px);
    margin-top: 125px;
}

/*dialog::backdrop {*/
/*    background: rgba(255, 255, 255, 0.02);*/
/*    backdrop-filter: blur(2px);*/
/*}*/

.form-check-warning:checked {
    background-color:#f7cd45 !important;
    border-color:#f7cd45 !important;
}

.form-check-danger:checked {
    background-color:#d33952 !important;
    border-color:#d33952 !important;
}