#homepage {
                font-family: 'Roboto';
                /* background: #ddd url(https://tympanus.net/Tutorials/CustomLoginFormStyling/images/bg.jpg) repeat top left; */
                font-weight: 300;
                font-size: 14px;
                color: #333;
                /* -webkit-font-smoothing: antialiased;
    overflow-y: scroll;
    overflow-x: hidden; */
                position: relative;
                background: #1875f0;
                background: url(assets/img/background-image.png);
                background-position: center;
                /* background-size: cover; */
                background-repeat: no-repeat;
                background-attachment: fixed;
            }
            
            .logo-brand {
                margin: 10px auto;
                float: left;
            }
            
            .logo-brand img {
                width: 100%;
            }
            
            header {
                position: relative;
                background: rgba(255, 255, 255, 0.1);
            }
            
            .copyright p {
                text-align: center;
                color: #fff;
                margin-top: 10px;
            }
            
            .footer-bottom {
                background: #1875f0;
            }
            /* div#myModal .modal-header {
        background: #0077bd;
        color: #fff;
    }
    
    .form-horizontal .radio-inline {
        margin-bottom: 10px;
    } */
            
            section#application {
                padding: 20px 0px;
            }
            
            .panel-body {
                /* border: 1px solid #0077bd; */
                padding: 30px 25px 15px;
                /* margin: 60px auto 30px; */
                /* padding: 10px; */
                position: relative;
                box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 3px 7px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 1), inset 0 -3px 2px rgba(0, 0, 0, 0.25);
                border-radius: 5px;
                background: white;
                background: -moz-linear-gradient(#eeefef, #ffffff 10%);
                background: -ms-linear-gradient(#eeefef, #ffffff 10%);
                background: -o-linear-gradient(#eeefef, #ffffff 10%);
                background: -webkit-gradient(linear, 0 0, 0 100%, from(#eeefef), color-stop(0.1, #ffffff));
                background: -webkit-linear-gradient(#eeefef, #ffffff 10%);
                background: linear-gradient(#eeefef, #ffffff 10%);
            }
            
            .panel-heading {
                background: #1875f0;
                padding: 10px;
                border-bottom: none;
                color: #fff;
                border-top-left-radius: 5px;
                border-top-right-radius: 5px;
            }
            
            .form-horizontal .control-label {
                text-align: left;
                font-weight: 400;
            }
            
            .form-group.password,
            .form-group.domainId {
                margin-bottom: 30px;
            }
            
            p.disclaim {
                color: #fff;
                text-align: center;
                margin-bottom: 20px;
                /* position: absolute;
    bottom: -70px;
    left: 0;
    right: 0; */
                font-weight: 600;
            }
            
            .heading.row {
                margin-top: 30px;
            }
            /* .custom-file-label {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1;
        height: calc(1.5em + .75rem + 2px);
        padding: .375rem .75rem;
        font-weight: 400;
        line-height: 1.5;
        color: #495057;
        background-color: #fff;
        border: 1px solid #ced4da;
        margin: 0px 15px;
        border-radius: .25rem;
    }
    
    .custom-file-input {
        position: relative;
        z-index: 2;
        width: 100%;
        height: calc(1.5em + .75rem + 2px);
        margin: 0;
        opacity: 0;
    }
    
    .modal-dialog.modal-sm {
        width: 350px;
    }
    
    .thank-you {
        margin: 150px auto;
        display: table;
    }
    
    .thank-you img {
        margin: 0px auto;
        display: table;
    }
    
    .thank-you h2 {
        color: #f79444;
        font-weight: 600;
        font-size: 6rem;
    }
    
    input[type=file] {
        margin-top: 10px;
    } */
            
            button.btn.btn-default.marginTop {
                margin-bottom: 0px;
            }
            
            button.btn.btn-default {
                color: #fff;
                text-align: center;
             
                border: 2px solid #1875f0;
                padding: 5px 15px;
                margin-top: 10px;
                cursor: pointer;
                background: #1875f0;
                margin-bottom: 10px;
                text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
                -webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset, 0px 0px 0px 3px rgb(254, 254, 254), 0px 5px 3px 3px rgb(210, 210, 210);
                -moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset, 0px 0px 0px 3px rgb(254, 254, 254), 0px 5px 3px 3px rgb(210, 210, 210);
                box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.07) inset, 0px 0px 0px 3px rgb(254, 254, 254), 0px 5px 3px 3px rgb(210, 210, 210);
                -webkit-transition: all 0.2s linear;
                -moz-transition: all 0.2s linear;
                -o-transition: all 0.2s linear;
                transition: all 0.2s linear;
            }
            
            .btn-default:active:focus {
                color: #fff;
                border: 2px solid #1875f0;
                background: #1875f0;
            }
            
            button.btn.btn-default:hover {
                background: #0d91de;
            }
            
            button.btn.btn-default.otpbtn {
                margin-top: 0px;
                margin-bottom: 0px;
            }
            
            .form-group p {
                margin-bottom: 0px;
            }
            
            .appdetails {
                display: inline-block;
                width: 100%;
                margin-bottom: 30px;
                position: relative;
            }
            /* .custom-radio {
        display: inline-block;
        position: relative;
        padding-left: 35px;
        margin-bottom: 12px;
        cursor: pointer;

-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
margin-right: 10px;
border: 1px solid #eee;
padding: 10px 20px 10px 40px;

}


.custom-radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.checkmark {
    position: absolute;
    top: 10px;
    left: 10px;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border-radius: 50%;
}

.custom-radio:hover input~.checkmark {
    background-color: #ccc;
}

.custom-radio input:checked~.checkmark {
    background-color: #2196F3;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.box {
    border: 1px solid #eee;
}

*/
            /* .selected {
    border: 1px solid #0072bc;
}

.custom-radio input:checked~.checkmark:after {
    display: block;
}

.custom-radio .checkmark:after {
    top: 6px;
    left: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
} */
            
            .heading h4 {
                color: #fff;
                font-weight: 600;
                margin-bottom: 15px;
            }
            
            #loginScreen {
                margin-bottom: 15px;
            }
            
            select {
                -webkit-appearance: none;
                appearance: none;
                -moz-appearance: none;
                position: relative;
            }
            
            .selectdiv,
            .form-input {
                position: relative;
            }
            
            .selectdiv:after {
                font: 25px "Consolas", monospace;
                color: #0072bc;
                -webkit-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -ms-transform: rotate(90deg);
                transform: rotate(90deg);
                right: 11px;
                top: 2px;
                padding: 0 0 2px;
                position: absolute;
                pointer-events: none;
                content: '>';
            }
            
            .error-label.error-field {
                opacity: 1;
            }
            
            .error-label {
                background: #fff;
                color: red;
                position: absolute;
                left: 0;
                margin-top: 7px;
                padding: 0 10px 0 20px;
                opacity: 0;
                top: 95%;
                border-radius: 3px;
                font-size: 1.2rem;
                z-index: 2;
                line-height: 20px;
            }
            
            .error-label:before {
                content: "";
                position: absolute;
                width: 14px;
                height: 14px;
                display: block;
                left: 4px;
                top: 10px;
                transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                background-image: url(assets//img/error.png);
                background-repeat: no-repeat;
            }
            
            .error-label:after {
                content: "";
                position: absolute;
                border-left: 6px solid transparent;
                border-right: 6px solid transparent;
                top: 0;
                left: 6px;
                border-bottom: 6px solid #fff;
                margin-top: -6px;
            }
            /*moving icons*/
            
            .moving-icons {
                position: relative;
            }
            
            .object1 {
                position: absolute;
                top: 28%;
                left: 20%;
            }
            
            .object2 {
                position: absolute;
                top: -7%;
                left: 50%;
            }
            
            .object3 {
                position: absolute;
                top: 50%;
                right: 20%;
            }
            
            .object6 {
                position: absolute;
                top: 32%;
                right: 17%;
            }
            
            .object4 {
                position: absolute;
                top: 90%;
                left: 19%;
            }
            
            .object5 {
                position: absolute;
                bottom: -10%;
                left: 30%;
            }
            
            .object7 {
                position: absolute;
                top: 80%;
                left: 15%;
            }
            
            .object8 {
                position: absolute;
                top: 105%;
                left: 50%;
            }
            /*rotate*/
            
            .rotate {
                -webkit-animation: rotation 10s infinite linear;
            }
            
            @-webkit-keyframes rotation {
                from {
                    -webkit-transform: rotate(0deg);
                }
                to {
                    -webkit-transform: rotate(359deg);
                }
            }
            
            .rotate2 {
                -webkit-animation: rotation2 14s infinite linear;
            }
            
            @-webkit-keyframes rotation2 {
                from {
                    -webkit-transform: rotate(0deg);
                }
                to {
                    -webkit-transform: rotate(359deg);
                }
            }
            /*bounce*/
            /*rotate*/
            
            .bounce {
                -webkit-animation-name: bounce;
                animation-name: bounce;
                -webkit-animation: bounce 3s infinite linear;
            }
            
            .bounce1 {
                -webkit-animation: bounce 2s infinite linear;
            }
            
            .bounce2 {
                -webkit-animation: bounce 4s infinite linear;
            }
            
            .bounce3 {
                -webkit-animation: bounce 6s infinite linear;
            }
            
            .bounce4 {
                -webkit-animation-name: bounce;
                animation-name: bounce;
                -webkit-animation: bounce 4s infinite linear;
            }
            
            .bounce5 {
                -webkit-animation: bounce 7s infinite linear;
            }
            
            @-webkit-keyframes bounce {
                0%,
                20%,
                50%,
                80%,
                100% {
                    -webkit-transform: translateY(0);
                }
                40% {
                    -webkit-transform: translateY(-30px);
                }
                60% {
                    -webkit-transform: translateY(-15px);
                }
            }
            
            @keyframes bounce {
                0%,
                20%,
                50%,
                80%,
                100% {
                    -webkit-transform: translateY(0);
                    transform: translateY(0);
                }
                40% {
                    -webkit-transform: translateY(-30px);
                    transform: translateY(-30px);
                }
                60% {
                    -webkit-transform: translateY(-15px);
                    transform: translateY(-15px);
                }
            }
            
            @-webkit-keyframes bounce4 {
                0%,
                20%,
                50%,
                80%,
                100% {
                    -webkit-transform: translateY(0);
                }
                40% {
                    -webkit-transform: translateY(-70px);
                }
                60% {
                    -webkit-transform: translateY(-15px);
                }
            }
            
            @keyframes bounce4 {
                0%,
                20%,
                50%,
                80%,
                100% {
                    -webkit-transform: translateY(0);
                    transform: translateY(0);
                }
                40% {
                    -webkit-transform: translateY(-70px);
                    transform: translateY(-70px);
                }
                60% {
                    -webkit-transform: translateY(-15px);
                    transform: translateY(-15px);
                }
            }
            
            .top-header h4 {
                text-align: right;
                color: #fff;
                font-size: 2.3rem;
                margin-top: 25px;
            }
            
            button.btn.btn-default.resend {
                margin: 0px 0px 0px 20px;
            }
            
            .custom-control {
                position: relative;
                /* display: block; */
                min-height: 1.5rem;
                /* padding-left: 2.5rem; */
            }
            
            .custom-control-input {
                position: absolute;
                z-index: -1;
                opacity: 0;
            }
            /* .custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    background-color: #007bff;
} */
            
            .custom-control-input:focus~.custom-control-label::before {
                box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
            }
            
            .custom-control-input:active~.custom-control-label::before {
                color: #fff;
                background-color: #b3d7ff;
            }
            
            .custom-control-input:disabled~.custom-control-label {
                color: #6c757d;
            }
            
            .custom-control-input:disabled~.custom-control-label::before {
                background-color: #e9ecef;
            }
            
            .custom-control-label {
                margin-bottom: 0;
            }
            
            .custom-control-label::before {
                /* position: absolute; */
                /* top: 0.15rem; */
                /* left: 2px; */
                /* display: block; */
                /* width: 1.5rem; */
                /* height: 1.5rem; */
                /* pointer-events: none;
    content: "";
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #dee2e6; */
            }
            
            .custom-control-label::after {
                /* position: absolute; */
                /* top: 0.15rem; */
                /* left: 0.3rem; */
                /* display: block; */
                /* width: 1.5rem; */
                /* height: 1.5rem; */
                /* content: "";
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%; */
            }
            /* .custom-radio .custom-control-label::before {
    border-radius: 50%;
} */
            /* .custom-radio .custom-control-input:checked~.custom-control-label::before {
    background-color: #007bff;
} */
            
            .custom-radio .custom-control-input:checked~.custom-control-label::after {
                background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E");
            }
            
            .custom-radio .custom-control-input:disabled:checked~.custom-control-label::before {
                background-color: rgba(0, 123, 255, 0.5);
            }
            /* .custom-control-label:not(.hereby)::before,
.custom-control-label:not(.hereby)::after {
    right: 16px;
    left: auto;
    top: 14px;
    width: 10px;
    height: 10px;
} */
            
            .form-horizontal .custom-control {
                /* display: inline-block; */
                /* padding-left: 6px; */
                /* padding-right: 1.5rem; */
                /* margin-bottom: 10px; */
            }
            
            .form-horizontal .custom-control-label {
                font-size: 14px;
                border-radius: 5px;
                border: solid 1px #e6e9ec;
                padding: 10px 25px 9px;
                width: 100%;
                text-align: center;
            }
            
            .form-horizontal .custom-control-label span {
                color: #707b7f;
                display: inline-block;
                width: 100%;
            }
            
            .form-horizontal label:hover {
                box-shadow: 0 10px 20px -5px rgba(0, 132, 212, 0.25);
            }
            /* .form-horizontal .custom-control-label::before,
.form-horizontal .custom-control-label::after {
    top: 10px;
    left: 14px;
    border: solid 0.5px #D1D7DC;
    border-radius: 50%;
    background-color: transparent;
    width: 20px;
    height: 20px;
} */
            /* .custom-radio .custom-control-input:checked~.custom-control-label::before {
    background-color: transparent !important;
    background-image: linear-gradient(to bottom, #00a7e6, #006ec8);
} */
            
            .form-horizontal input[type="radio"]:checked+label {
                border: solid 1px #0073cb;
                box-shadow: 0 10px 20px -5px rgba(0, 132, 212, 0.25);
            }
            
            .custom-control-label img {
                /* width: 40px; */
                /* height: 40px; */
                margin-bottom: 5px;
            }
            
            #selectUser {
                position: relative;
                margin-bottom: 40px;
            }
            
            #selectUser .error-label {
                margin-left: 15px;
            }
            
            #submitBtn {
                margin-top: 20px;
            }
            /*---------------------------------
/*********************************** Mobile Media Query*************/
            
            @media screen and (max-width: 400px) {
                .top-header h4 {
                    font-size: 2rem;
                    margin-top: 15px;
                }
            }
            
            @media screen and (max-width: 320px) {
                button.btn.btn-default {
                    padding: 5px 12px;
                }
            }
            
            @media (min-width: 400px) and (max-width: 767px) {
                .top-header h4 {
                    font-size: 2rem;
                    margin-top: 25px;
                }
            }
            
            @media (min-width:320px) and (max-width:767px) {
                .logo-brand {
                    width: 160px;
                }
                .container {
                    width: 100%;
                }
                .top-header h4 {
                    font-size: 1.5rem;
                    margin-top: 20px;
                }
                .selectdiv,
                .form-input {
                    margin-bottom: 30px;
                }
                /* .thank-you {
            margin: 130px auto;
        }
        .thank-you h2 {
            font-size: 5rem;
        } */
                .updateEmail {
                    margin-top: 10px;
                }
                select {
                    margin-bottom: 10px;
                }
                button.btn.btn-default.otpbtn,
                #customerMobile {
                    /* margin-top: 10px; */
                }
                .form-horizontal .custom-control {
                    /* display: inline-block; */
                    /* padding-left: 6px; */
                    /* padding-right: 1.5rem; */
                    margin-bottom: 10px;
                }
            }
            
            @media (min-width: 360px) and (max-width: 767px) {}
            
            @media (min-width:768px) and (max-width:1024px) {
                .container {
                    width: 100%;
                }
                /* .thank-you {
            margin: 120px auto;
        } */
            }
            
            @media (min-width:768px) and (max-width:991px) {
                .container {
                    width: 100%;
                }
                header {
                    width: auto;
                }
            }
            
            @media (min-width: 768px) {}
            
            @media only screen and (min-width: 992px) {}
            
            @media only screen and (min-width: 480px) and (max-width: 767px) {}
            
            @media screen and (max-width: 768px) {}