﻿body {
    color: #000;
    padding-top: 70px;
    font-family: citifont;
}

@media screen and (min-width:992px) {
    body {
        padding-top: 96px;
    }
}

section {
    padding-top: 4em;
    padding-bottom: 4em;
}

input:disabled,
input[disabled],
button:disabled,
button[disabled] {
    opacity: .5;
}
a {
    cursor: pointer;
    color: #056dae;
}

    a:hover {
        text-decoration: none;
    }

sup {
    line-height: 0;
    font-weight: lighter;
}

ul {
    padding-left: 1em;
}

h5 {
    font-weight: lighter
}

.bg-grey {
    background-color: #f7f7f7;
}

.card {
    padding: 1em 1.5em;
}

.fixed {
    position: fixed;
    left: 0;
    z-index: 999;
}

.small, small {
    font-weight: lighter;
}

.shadow {
    box-shadow: 0 0 10px #666 !important;
}

.shadow-top {
    box-shadow: 0 -5px 5px -5px #666;
}

.shadow-bottom {
    box-shadow: 0 5px 5px -5px #666;
}

.larger {
    font-size: 1.7em
}

.banner {
    /*position: relative;
    overflow: hidden;*/
    /*width: 100vw;*/
    height: 79.167vw;
    background-image: url('../img/banner-m.jpg');
    background-size: cover;
}

    .banner img {
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
    }

.banner_content {
    /* position: absolute; */
    /* bottom: 1em; */
    /* left: 8%; */
    background-color: rgba(0,111,179,.9);
    /* width: 86%; */
    color: #fff;
    padding: 1em;
    text-align: center;
    line-height: 1.3;
    border-radius: 4px;
    margin-top: 20%;
}

    .banner_content h1 {
        font-size: 1.4em;
        line-height: 1;
        font-weight: lighter;
    }

    .banner_content a.btn {
        background-color: #fff;
        color: #006fb3;
        padding: .5em 1.5em;
    }

        .banner_content a.btn:hover {
            background-color: #fff;
            color: #006fb3;
        }

.ctb {
    color: #076dae;
}
.ctp {
    color: #0e2a48;
}

.ctg {
    color: #b4975a;
}

.cpc {
    color: #281814;
}

.bgctb {
    background-color: #076dae;
    color: #fff;
}
.bgctp {
    background-color: #0e2a48;
    color: #fff;
}

.bgctg {
    background-color: #b4975a;
    color: #fff;
}

.bgcpc {
    background-color: #281814;
    color: #fff;
}

.ctb.btn {
    background-color: #076dae !important;
    color: #fff !important;
    font-weight: bold;
    padding-left: 2.5em;
    padding-right: 2.5em;
}

.ctp.btn {
    background-color: #0e2a48 !important;
    color: #fff !important;
    font-weight: bold;
    padding-left: 2.5em;
    padding-right: 2.5em;
}

.ctg.btn {
    background-color: #b4975a !important;
    color: #fff !important;
    font-weight: bold;
    padding-left: 2.5em;
    padding-right: 2.5em;
}

.cpc.btn {
    background-color: #281814 !important;
    color: #fff !important;
    font-weight: bold;
    padding-left: 2.5em;
    padding-right: 2.5em;
}
.ctb.border {
    border-color: #076dae !important;
}
.ctp.border {
    border-color: #0e2a48!important;
}
.ctg.border {
    border-color: #b4975a !important;
}
.cpc.border {
    border-color: #281814 !important;
}

.tabsnav {
    font-size: 1.3em;
    background-color: #eee;
}

    .tabsnav > a,
    .tabsnav > a:hover {
        align-self: center;
        background-color: #eee;
        padding: 1em;
        color: #000;
    }

        .tabsnav > a.ctb:not([href]):not([tabindex]):focus,
        .tabsnav > a.ctb:not([href]):not([tabindex]):hover,
        .tabsnav > a.ctb {
            color: #076dae;
        }

        .tabsnav > a.ctp {
            color: #0e2a48;
        }

        .tabsnav > a.ctg {
            color: #b4975a;
        }

        .tabsnav > a.cpc {
            color: #281814;
        }

        .tabsnav > a.active {
            font-size: 1.4em;
            padding: .5em;
            box-shadow: 0 0 010px #666;
            border-bottom: solid 4px;
            background-color: #fff;
            font-weight: bold;
            border-radius: 4px;
        }

.cvp {
    padding-top: 3em;
    padding-bottom: 3em;
    display: none;
}

    .cvp.active {
        display: flex;
    }

    .cvp .row {
        padding-top: 1em;
        padding-bottom: 1em;
    }

    .cvp img {
    }



.checkbox {
    display: block;
    position: relative;
    padding-left: 35px;
    margin: 1em auto 2em;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .checkbox input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #fff;
    border: solid 1px;
}

.checkbox:hover input ~ .checkmark {
    background-color: #eee;
}

.checkbox.ctb input:checked ~ .checkmark {
    background-color: #076dae;
}

.checkbox.ctp input:checked ~ .checkmark {
    background-color: #0e2a48;
}

.checkbox.ctg input:checked ~ .checkmark {
    background-color: #b4975a;
}

.checkbox.cpc input:checked ~ .checkmark {
    background-color: #281814;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.checkbox input:checked ~ .checkmark:after {
    display: block;
}

.checkbox .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#ctb-cvp-02,
#ctp-cvp-02,
#ctg-cvp-02,
#cpc-cvp-02 {
    display: none;
}

#ctb-cvp-02-01.active .card,
#ctb-cvp-02-02.active .card,
#ctb-cvp-02-03.active .card,
#ctb-cvp-02-04.active .card {
    border-color: #076dae;
}


#ctp-cvp-02-01.active .card,
#ctp-cvp-02-02.active .card,
#ctp-cvp-02-03.active .card,
#ctp-cvp-02-04.active .card {
    border-color: #0e2a48;
}

#ctg-cvp-02-01.active .card,
#ctg-cvp-02-02.active .card,
#ctg-cvp-02-03.active .card,
#ctg-cvp-02-04.active .card {
    border-color: #b4975a;
}

#cpc-cvp-02-01.active .card,
#cpc-cvp-02-02.active .card,
#cpc-cvp-02-03.active .card,
#cpc-cvp-02-04.active .card {
    border-color: #281814;
}

.modal .tabsnav {
    font-size: 1em;
}


    .modal .tabsnav > a.active {
        font-size: 1em;
        padding: 1em;
        box-shadow: none;
        border-bottom: solid 4px;
        background-color: #fafafa;
        font-weight: normal;
        border-radius: 0;
    }

.model-content {
    background-color: #fafafa;
}

#ctb-modal img,
#ctp-modal img,
#ctg-modal img,
#cpc-modal img {
    max-width: 60px;
}

#ctb-modal .close,
#ctp-modal .close,
#ctg-modal .close,
#cpc-modal .close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 31px;
    line-height: 1;
}


.details-ctb,
.details-ctp, .details-ctg, .details-cpc {
    display: none;
}

    .details-ctb.active,
    .details-ctp.active,
    .details-ctg.active,
    .details-cpc.active {
        display: flex;
    }

#ctb-cvp-02 .card.active {
    border-color: #076dae;
}
#ctp-cvp-02 .card.active {
    border-color: #0e2a48;
}

#ctg-cvp-02 .card.active {
    border-color: #b4975a;
}

#cpc-cvp-02 .card.active {
    border-color: #281814;
}
.inputBox-lable, .labelTxt {
    position: absolute;
    top: -17px;
    font-size: 12px;
    line-height: 12px;
    display: none;
    -webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
}
.inputField input {
    font-family: citifont;
    font-size: 16px;
}

.input-box {
    color: #999999;
    background: #fff;
    outline: 0px;
    border: solid 1px #c8c8c8;
    border-radius: 6px;
    padding: 15px 20px 15px 18px;
    font-size: 16px;
    letter-spacing: 0px;
    color: #333333;
    border: 1px solid #F6F6F6;
    width: 100%;
    -webkit-appearance: none;
}
.error_border,
.mandy_notfilled {
    border: 1px solid #D60000 !important;
    background: #ffffff;
    color: #D60000;
}
@media (min-width: 576px) {

    .modal-dialog {
        min-width: 90%;
        max-width: 1200px;
        padding: 15px;
    }
    .banner {
        height:26vw;
        background-image: url('../img/banner-d.jpg');
    }

    .banner_content {
        /*width: 56%;
        left: 22%;*/
        padding: 2em;
        /*bottom: 10em;*/
    }
}

@media screen and (min-width:768px) {


    .banner_content {
        max-width: 350px;
        margin-top: 5%;
    }

}

@media screen and (min-width:996px) {

    .banner_content {
        min-width: 500px;
max-width:unset;
    }

    .banner_content p {
        font-size: 2em;
        margin-bottom: 1em;
    }

    .banner_content h1 {
        font-size: 2.8em;
        line-height: 1.3;
    }
}
