@import url('https://fonts.googleapis.com/css?family=Exo:400,700');

body {
    font-family: 'Poppins', sans-serif;
    color: #000;
    font-weight: 400;
    font-size: 14px;
    background:#ffffff !important;
}
a {
    transition: all 0.5s ease;
    text-decoration: none;
}
.landing-page {
    overflow: hidden;
}
.header-section header {
    display: block;
    width: 100%;
}

.header-section .navbar {
    padding: .6rem 2rem;
    z-index: 9999; /*
    -webkit-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.3);*/
    background-color: #311e69;
}

.header-section .navbar-brand {
    padding-top: 0rem;
    padding-bottom: 0rem;
}
.header-section .navbar-brand img {
    height: 30px;
}
.header-section .navbar span {
    font-size: 20px;
    font-weight: 600;
    color: #fff;
}
.main-body {
    background: url('../images/bottom-shape.png') center bottom no-repeat;
    background-size: contain;
    min-height: 100vh;
}
.home-body {
    padding: 30px 0px;
}

/*Dev added*/
.dtbl-btn {
    background-color: transparent !important;
    border: 0px !important;
    outline: none !important;
    box-shadow: none;
    line-height: 16px;
}

    .dtbl-btn i {
        font-size: 18px;
        margin-right: 5px;
    }

        .dtbl-btn i.fa-edit {
            color: #008aff;
        }

        .dtbl-btn i.fa-trash-alt {
            color: #ff0000;
            margin-right: 0px;
        }
/*Dev added End*/

.pool-box {
    padding: 0px 35px;
}

    .pool-box .ribbon-col {
        height: auto;
        background-color: #9fc1ff;
        border-top-left-radius: 7px;
        border-top-right-radius: 7px;
        position: absolute;
        right: 31px;
        left: 28px;
        height: 45px;
        -webkit-box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
        -moz-box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
        box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
    }

        .pool-box .ribbon-col:before {
            position: absolute;
            content: '';
            background: url(../images/ribbon-bg1.png) left bottom repeat-x;
            height: 38px;
            width: 100%;
            top: 24px;
        }

    .pool-box .pool-box-inner {
        background-color: #fff;
        display: block;
        width: 100%;
        height: 325px;
        -webkit-box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
        -moz-box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
        box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
        border-radius: 7px;
        border: 2px solid #9fc1ff;
        padding: 70px 40px 20px 40px;
    }

        .pool-box .pool-box-inner:before {
            position: absolute;
            content: '';
            background: url(../images/B-L-A.jpg) left center no-repeat;
            height: 168px;
            width: 70px;
            left: 36px;
            top: 26%;
        }



        .pool-box .pool-box-inner:after {
            position: absolute;
            content: '';
            background: url(../images/B-R-A.jpg) right center no-repeat;
            height: 168px;
            width: 70px;
            right: 36px;
            top: 26%;
        }



.bg2 .ribbon-col {
    background-color: #5acfad;
}



.bg2 .pool-box-inner {
    border: 2px solid #5acfad;
}



    .bg2 .pool-box-inner:before {
        background: url(../images/GLA.jpg) left center no-repeat;
    }



    .bg2 .pool-box-inner:after {
        background: url(../images/GRA.jpg) right center no-repeat;
    }



.bg2 .ribbon-col:before {
    background: url(../images/ribbon-bg2.png) left bottom repeat-x;
}




.bg3 .ribbon-col {
    background-color: #a4d0e7;
}



.bg3 .pool-box-inner {
    border: 2px solid #a4d0e7;
}



.bg3 .ribbon-col:before {
    background: url(../images/ribbon-bg3.png) left bottom repeat-x;
}



.bg3 .pool-box-inner:before {
    background: url(../images/PLA.jpg) left center no-repeat;
}



.bg3 .pool-box-inner:after {
    background: url(../images/PRA.jpg) right center no-repeat;
}



.bg4 .ribbon-col {
    background-color: #ffc6e3;
}



.bg4 .pool-box-inner {
    border: 2px solid #ffc6e3;
}



.bg4 .ribbon-col:before {
    background: url(../images/ribbon-bg4.png) left bottom repeat-x;
}



.bg4 .pool-box-inner:before {
    background: url(../images/PinkLA.jpg) left center no-repeat;
}



.bg4 .pool-box-inner:after {
    background: url(../images/PinkRA.jpg) right center no-repeat;
}



.bg5 .ribbon-col {
    background-color: #ff97a3;
}



.bg5 .pool-box-inner {
    border: 2px solid #ff97a3;
}



.bg5 .ribbon-col:before {
    background: url(../images/ribbon-bg5.png) left bottom repeat-x;
}



.bg5 .pool-box-inner:before {
    background: url(../images/RLA.jpg) left center no-repeat;
}



.bg5 .pool-box-inner:after {
    background: url(../images/RRA.jpg) right center no-repeat;
}

.bg6 .ribbon-col {
    background-color: #d8dda4;
}

.bg6 .pool-box-inner {
    border: 2px solid #d8dda4;
}

.bg6 .ribbon-col:before {
    background: url(../images/ribbon-bg6.png) left bottom repeat-x;
}

.bg6 .pool-box-inner:before {
    background: url(../images/cunduct-L.jpg) left center no-repeat;
}

.bg6 .pool-box-inner:after {
    background: url(../images/cunduct-R.jpg) right center no-repeat;
}

.pool-box .pool-box-inner .pool-icon {
    width: 100%;
    height: auto;
    text-align: center;
}

.pool-box .pool-box-inner h2 {
    font-size: 18px;
    font-weight: 500;
    color: #000;
    margin: 0px;
    padding: 0px;
    text-align: center;
}

/*.pool-box .pool-box-inner .btn-theme {
    background-color: #311e69;
    border: 1px solid #311e69;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    border-radius: 7px;
    min-width: 160px;
    padding: 9px 20px;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
}
    .pool-box .pool-box-inner .btn-theme:hover {
        background-color: #741cc1;
        border: 1px solid #741cc1;
        transition: all .5s ease;
    }*/

.pool-box .pool-box-inner .btn {
    background: none;
    cursor: pointer;
    padding: 7px 20px;
    display: inline-block;
    text-transform: uppercase;
    font-size: 13px;
    border: 1px solid #311e69;
    color: #311e69;
    font-weight: 700;
    outline: none;
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 0px;
}

    .pool-box .pool-box-inner .btn:after {
        content: '';
        position: absolute;
        z-index: -1;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s;
    }

.btn-theme:after {
    width: 100%;
    height: 0;
    top: 0;
    left: 0;
    background: #311e69;
    color: #ffffff;
}

.btn-theme:hover,
.btn-theme:active {
    color: #ffffff !important;
}

    .btn-theme:hover:after,
    .btn-theme:active:after {
        height: 100%;
    }

.pool-box .pool-box-inner:hover {
    cursor: pointer;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(49, 30, 105, 0.3);
    -moz-box-shadow: 0px 10px 20px 0px rgba(49, 30, 105, 0.3);
    box-shadow: 0px 10px 20px 0px rgba(49, 30, 105, 0.3);
    border-bottom: 7px solid #0e68aa;
}

.pool-page-top {
    padding: 0rem 2rem;
}

    .pool-page-top .section-link {
        width: 100%;
        height: auto;
        display: block;
        padding: 0px 15px;
    }

        .pool-page-top .section-link span {
            font-size: 18px;
            font-weight: 600;
            color: #234478;
        }

            .pool-page-top .section-link span a {
                color: #234478;
                text-decoration: none;
            }

    .pool-page-top .range-slide-col {
        width: 100%;
        height: 115px;
        display: block;
        padding: 15px 20px;
        background-color: #efefef;
        border: 1px solid #b6d1e5;
        border-top-left-radius: 15px;
    }

        .pool-page-top .range-slide-col .range-col {
            padding-left: 30px;
        }

            .pool-page-top .range-slide-col .range-col h2 {
                font-size: 16px;
                font-weight: 600;
                color: #234478;
                margin: 0px;
                padding-top: 5px;
                margin-bottom: 40px;
            }

            .pool-page-top .range-slide-col .range-col p {
                display: inline-block;
                vertical-align: bottom;
                margin: 0px;
                padding: 0px;
                margin-left: 20px;
            }

                .pool-page-top .range-slide-col .range-col p a {
                    height: auto;
                    width: 26px;
                    display: inline-block;
                    text-align: center;
                    margin-right: 8px;
                }

                    .pool-page-top .range-slide-col .range-col p a i {
                        font-size: 26px;
                    }

                        .pool-page-top .range-slide-col .range-col p a i.clr-1 {
                            color: #000;
                        }

                        .pool-page-top .range-slide-col .range-col p a i.clr-2 {
                            color: #ff0000;
                            font-size: 30px;
                        }

                        .pool-page-top .range-slide-col .range-col p a i.clr-3 {
                            color: #287904;
                            font-size: 30px;
                        }

            .pool-page-top .range-slide-col .range-col select {
                display: inline-block;
                min-width: 95px;
                max-width: 95px;
                border-radius: 50px;
                border: 1px solid #005493;
                font-size: 13px;
                font-weight: 600;
                color: #005493;
                padding: 5px 10px;
                height: 32px;
            }

            .pool-page-top .range-slide-col .range-col .form-control {
                display: inline-block;
                border: 0px;
                border-bottom: 2px solid #d1d0d0;
                height: 32px;
                border-radius: 0px;
                background-color: transparent;
                box-shadow: none;
                outline: none;
                font-size: 15px;
                font-weight: 500;
                color: #636363;
                padding: 0px;
                width: 70%;
            }

        .pool-page-top .range-slide-col .cus-range-col .top-area {
            text-align: right;
        }

            .pool-page-top .range-slide-col .cus-range-col .top-area span {
                font-size: 16px;
                font-weight: 600;
                color: #234478;
                display: inline-block;
                vertical-align: top;
                padding-right: 10px;
                padding-top: 2px;
            }

            .pool-page-top .range-slide-col .cus-range-col .top-area a {
                height: 28px;
                width: 28px;
                display: inline-block;
                border-radius: 50px;
                background-color: #fff;
                text-decoration: none;
                text-align: center;
                margin-left: 6px;
                vertical-align: top;
            }

                .pool-page-top .range-slide-col .cus-range-col .top-area a i {
                    font-size: 18px;
                    line-height: 30px;
                    color: #311e69;
                }

    .pool-page-top .bottom-area {
        background-color: #0e68aa;
        border-bottom-right-radius: 15px;
        padding-top: 5px;
        padding-bottom: 5px;
    }

        .pool-page-top .bottom-area p {
            font-size: 16px;
            font-weight: 600;
            color: #ffde00;
            display: inline-block;
            margin-right: 10px;
            padding-left: 12px;
            position: relative;
            margin-bottom: 0px;
        }

            .pool-page-top .bottom-area p:before {
                position: absolute;
                font-family: FontAwesome;
                content: "\f0da";
                top: 0px;
                left: 0px;
                font-size: 16px;
                font-weight: 500;
                color: #fff;
                display: inline-block;
                margin-right: 10px;
            }

        .pool-page-top .bottom-area .form-control, .pool-page-top .bottom-area .multiselect {
            display: inline-block;
            width: 70%;
            background-color: transparent;
            border: 0px;
            border-bottom: 2px solid #a6bdd7;
            border-radius: 0px;
            font-size: 16px;
            color: #fff;
            font-style: italic;
            font-weight: 500;
            height: 28px;
            padding: 0px;
            box-shadow: none;
            min-width: 250px;
            text-align: left;
            padding-right: 20px;
        }

            .pool-page-top .bottom-area .multiselect.dropdown-toggle::after {
                position: absolute;
                right: 5px;
                top: 11px;
            }

        .pool-page-top .bottom-area .multiselect-container {
            border-radius: 0px;
            margin: 4px 0px;
            min-width: 215px;
        }

            .pool-page-top .bottom-area .multiselect-container > li > a > label {
                font-size: 14px;
                font-weight: 500;
                padding: 5px 10px 5px 10px;
                color: #234478;
            }

                .pool-page-top .bottom-area .multiselect-container > li > a > label > input[type=checkbox] {
                    margin-bottom: 0px;
                    height: 18px;
                    margin-right: 3px;
                    width: 18px;
                    position: relative;
                    top: 4px;
                }

        .pool-page-top .bottom-area .form-control::placeholder {
            color: #fff;
            opacity: 1;
        }

        .pool-page-top .bottom-area .form-control:-ms-input-placeholder {
            color: #fff;
        }

        .pool-page-top .bottom-area .form-control::-ms-input-placeholder {
            color: #fff;
        }

    .pool-page-top .range-slide-col .cus-range-col .top-area input[type=checkbox] {
        height: 0;
        width: 0;
        visibility: hidden;
        position: absolute;
    }

    .pool-page-top .range-slide-col .cus-range-col .top-area label {
        cursor: pointer;
        text-indent: -9999px;
        width: 58px;
        height: 28px;
        background: #797077;
        display: inline-block;
        border-radius: 100px;
        position: relative;
    }

        .pool-page-top .range-slide-col .cus-range-col .top-area label:after {
            content: '';
            position: absolute;
            top: 3px;
            left: 3px;
            width: 22px;
            height: 22px;
            background: #fff;
            border-radius: 90px;
            transition: 0.3s;
        }

    .pool-page-top .range-slide-col .cus-range-col .top-area input:checked + label {
        background: #0e68aa;
    }

        .pool-page-top .range-slide-col .cus-range-col .top-area input:checked + label:after {
            left: calc(100% - 3px);
            transform: translateX(-100%);
        }

    /*.pool-page-top .range-slide-col .cus-range-col .top-area label:active:after {
                width: 130px;
            }*/

    .pool-page-top .total-q-col {
        padding-left: 30px;
        padding-top: 37px;
    }

        .pool-page-top .total-q-col .total-q-box {
            background-color: #0e68aa;
            border-top-right-radius: 15px;
            border-bottom-left-radius: 15px;
            padding: 20px 15px;
            text-align: center;
            -webkit-box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
            -moz-box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
            box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
        }

            .pool-page-top .total-q-col .total-q-box .q-count {
                height: 70px;
                width: 70px;
                margin: 0 auto;
                background-color: #efefef;
                border: 2px solid #311e69;
                color: #311e69;
                border-radius: 100px;
                text-align: center;
                font-size: 24px;
                font-weight: 700;
                line-height: 70px;
            }

            .pool-page-top .total-q-col .total-q-box h2 {
                font-size: 16px;
                font-weight: 600;
                color: #fff;
                text-align: center;
                margin-top: 19px;
            }

.questionnaire-section {
    padding: 0rem 2rem;
    margin-bottom: 70px;
}

    .questionnaire-section .questionnaire-inner {
        width: 100%;
        height: auto;
        display: block;
        background-color: #ffffff;
        border-top-left-radius: 15px;
        border-bottom-right-radius: 15px;
        padding: 20px 30px;
        border: 1px solid #b6d1e5;
        -webkit-box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
        -moz-box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
        box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
    }

        .questionnaire-section .questionnaire-inner .questionnaire-top {
            padding: 0px 10px;
        }

            .questionnaire-section .questionnaire-inner .questionnaire-top span {
                font-size: 18px;
                font-weight: 600;
                color: #234478;
            }

            .questionnaire-section .questionnaire-inner .questionnaire-top a {
                text-decoration: none;
                cursor: text;
                display: inline-block;
                font-size: 14px;
                font-weight: 500;
                color: #333;
                font-style: italic;
                position: relative;
                padding-left: 25px;
                margin-right: 12px;
            }

                .questionnaire-section .questionnaire-inner .questionnaire-top a:before {
                    position: absolute;
                    content: '';
                    height: 18px;
                    width: 18px;
                    top: 1px;
                    left: 0px;
                    border-radius: 50px;
                }

                .questionnaire-section .questionnaire-inner .questionnaire-top a.com:before {
                    background-color: #ff0000;
                }

                .questionnaire-section .questionnaire-inner .questionnaire-top a.hrd:before {
                    background-color: #e69d00;
                }

                .questionnaire-section .questionnaire-inner .questionnaire-top a.mod:before {
                    background-color: #ebe300;
                }

                .questionnaire-section .questionnaire-inner .questionnaire-top a.esy:before {
                    background-color: #287904;
                }

        .questionnaire-section .questionnaire-inner .question-category-col {
        }

            .questionnaire-section .questionnaire-inner .question-category-col .cus-card {
                background: #006abb; /* Old browsers */
                background: -moz-linear-gradient(top, #006abb 0%, #005494 100%); /* FF3.6-15 */
                background: -webkit-linear-gradient(top, #006abb 0%,#005494 100%); /* Chrome10-25,Safari5.1-6 */
                background: linear-gradient(to bottom, #006abb 0%,#005494 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006abb', endColorstr='#005494',GradientType=0 ); /* IE6-9 */
                border: 0px solid #005da3;
                border-radius: 50px;
                margin-bottom: 15px;
            }

                .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body {
                    padding: 8px 25px;
                }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-left span {
                        display: inline-block;
                        font-size: 15px;
                        font-weight: 400;
                        color: #fff;
                        position: relative;
                        padding-left: 25px;
                        vertical-align: sub;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-left span:before {
                            position: absolute;
                            content: "\f00c";
                            font-size: 22px;
                            font-weight: 400;
                            color: #fff;
                            font-family: FontAwesome;
                            left: -5px;
                            top: -5px;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-type {
                        background-color: #287904;
                        border-color: #287904;
                        border-radius: 50px;
                        font-size: 12px;
                        color: #fff;
                        font-weight: 400;
                        padding: 3px 10px;
                        line-height: normal;
                        -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.8);
                        -moz-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.8);
                        box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.8);
                        margin-right: 10px;
                    }

                .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-right .que-type {
                    background-color: #005799;
                    border-color: #005799;
                    border-radius: 50px;
                    font-size: 12px;
                    color: #fff;
                    font-weight: 400;
                    padding: 3px 10px;
                    line-height: normal;
                    box-shadow: none;
                    margin-right: 10px;
                }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-right .que-type a {
                        text-decoration: none;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-right .que-type a i {
                            font-size: 12px;
                            color: #fff;
                        }


                .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level {
                    display: inline-block;
                    background-color: #fff;
                    border: 1px solid #333;
                    border-radius: 50px;
                    font-size: 12px;
                    color: #030303;
                    font-weight: 500;
                    padding: 3px 10px;
                    line-height: normal;
                    box-shadow: none;
                    margin-right: 5px;
                    min-width: 95px;
                    position: relative;
                    text-align: left;
                    padding-left: 24px;
                }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-green {
                        border: 1px solid #287904;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-green:before {
                            background-color: #287904;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-yellow {
                        border: 1px solid #ebe300;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-yellow:before {
                            background-color: #ebe300;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-orange {
                        border: 1px solid #e69d00;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-orange:before {
                            background-color: #e69d00;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-red {
                        border: 1px solid #ff0000;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level.l-red:before {
                            background-color: #ff0000;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level a {
                        text-decoration: none;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level a i {
                            font-size: 16px;
                            color: #030303;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level input {
                        background-color: transparent;
                        border: 0px;
                        box-shadow: none;
                        width: 20px;
                        padding: 0px;
                        color: #000;
                        font-size: 12px;
                        font-weight: 500;
                        outline: none;
                        text-align: center;
                    }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-level:before {
                        position: absolute;
                        content: '';
                        height: 16px;
                        width: 16px;
                        top: 4px;
                        left: 5px;
                        border-radius: 50px;
                        background-color: #333;
                    }

                .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right .que-type span {
                    background-color: #dbdbdb;
                    height: 18px;
                    width: 18px;
                    font-size: 12px;
                    text-align: center;
                    font-weight: 600;
                    color: #015596;
                    border-radius: 50px;
                    display: inline-block;
                    position: relative;
                    margin-right: -7px;
                    margin-left: 5px;
                }

                .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right a {
                    text-decoration: none;
                }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card .card-body .question-right a i {
                        font-size: 20px;
                        color: #fff;
                        display: inline-block;
                        vertical-align: middle;
                        text-decoration: none;
                    }


                .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card {
                    background: none;
                    background-color: #fff !important;
                    border: 1px solid #005da3;
                    border-radius: 50px;
                    margin-bottom: 15px;
                }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left span {
                        color: #005da3;
                        padding-left: 0px;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left span:before {
                            display: none;
                        }

                    .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left .custom_checkbox {
                        display: inline-block;
                        width: 30px;
                        height: 26px;
                        margin-left: -6px;
                    }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left .custom_checkbox input {
                            padding: 0;
                            height: initial;
                            width: initial;
                            display: none;
                            cursor: pointer;
                            position: absolute;
                        }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left .custom_checkbox label {
                            position: relative;
                            cursor: pointer;
                            color: #fff;
                            width: 30px;
                        }

                            .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left .custom_checkbox label:before {
                                content: '';
                                background-color: transparent;
                                border: 1px solid #818181;
                                padding: 10px;
                                top: 2px;
                                border-radius: 0px;
                                display: inline-block;
                                position: relative;
                                vertical-align: middle;
                                cursor: pointer;
                                margin-right: 0px;
                                transition: background-color 0.3s ease-in-out;
                            }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left .custom_checkbox input:checked + label::after {
                            content: '';
                            display: block;
                            position: absolute;
                            top: 4px;
                            left: 8px;
                            width: 7px;
                            height: 14px;
                            border: solid #fff;
                            border-width: 0 2px 2px 0;
                            transform: rotate(45deg);
                        }

                        .questionnaire-section .questionnaire-inner .question-category-col .cus-card.plain-card .card-body .question-left .custom_checkbox input:checked + label::before {
                            content: '';
                            background-color: #005fa7;
                            border-color: #0060aa;
                        }

.file-upload {
    display: block;
    text-align: center;
    font-size: 13px;
}

    .file-upload .file-select {
        display: inline-block;
        border: 2px solid #bcc5e6;
        color: #34495e;
        cursor: pointer;
        text-align: left;
        background: #FFFFFF;
        overflow: hidden;
        position: relative;
        width: 90%;
    }

        .file-upload .file-select .file-select-button {
            background: #0060a9;
            padding: 0 10px;
            display: inline-block;
            height: 40px;
            line-height: 40px;
            color: #fff;
        }

        .file-upload .file-select .file-select-name {
            line-height: 40px;
            display: inline-block;
            padding: 0 10px;
        }

        .file-upload .file-select:hover {
            border-color: #34495e;
            transition: all .2s ease-in-out;
            -moz-transition: all .2s ease-in-out;
            -webkit-transition: all .2s ease-in-out;
            -o-transition: all .2s ease-in-out;
        }

            .file-upload .file-select:hover .file-select-button {
                background: #34495e;
                color: #FFFFFF;
                transition: all .2s ease-in-out;
                -moz-transition: all .2s ease-in-out;
                -webkit-transition: all .2s ease-in-out;
                -o-transition: all .2s ease-in-out;
            }

    .file-upload.active .file-select {
        border-color: #3fa46a;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
    }

        .file-upload.active .file-select .file-select-button {
            background: #3fa46a;
            color: #FFFFFF;
            transition: all .2s ease-in-out;
            -moz-transition: all .2s ease-in-out;
            -webkit-transition: all .2s ease-in-out;
            -o-transition: all .2s ease-in-out;
        }

    .file-upload .file-select input[type=file] {
        z-index: 100;
        cursor: pointer;
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .file-upload .file-select.file-select-disabled {
        opacity: 0.65;
    }

        .file-upload .file-select.file-select-disabled:hover {
            cursor: default;
            display: block;
            border: 2px solid #dce4ec;
            color: #34495e;
            cursor: pointer;
            height: 40px;
            line-height: 40px;
            margin-top: 5px;
            text-align: left;
            background: #FFFFFF;
            overflow: hidden;
            position: relative;
        }

            .file-upload .file-select.file-select-disabled:hover .file-select-button {
                background: #dce4ec;
                color: #666666;
                padding: 0 10px;
                display: inline-block;
                height: 40px;
                line-height: 40px;
            }

            .file-upload .file-select.file-select-disabled:hover .file-select-name {
                line-height: 40px;
                display: inline-block;
                padding: 0 10px;
            }

.upload-box {
    background-color: #f6f9ff;
    padding: 15px 0px 30px 0px;
    border-radius: 15px;
    border: 3px dashed #bcc5e6;
}

    .upload-box h2 {
        font-size: 20px;
        font-weight: 500;
        color: #0061ac;
    }

.bottom-btn-col {
    padding: 20px;
    background-color: #fff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    -webkit-box-shadow: 0px 5px 10px 0px rgb(14 104 170 / 30%);
    -moz-box-shadow: 0px 5px 10px 0px rgba(14, 104, 170, 0.3);
    box-shadow: 0px 5px 10px 0px rgb(14 104 170 / 30%);
    position: relative;
    bottom: -20px;
    z-index: 999;
    text-align: center;
    border: 1px solid #b6d1e5;
    border-top: 0px;
}

.btn-genrate {
    padding: 8px 30px;
    background: #006abb;
    background: -moz-linear-gradient(top, #006abb 0%, #005494 100%);
    background: -webkit-linear-gradient(top, #006abb 0%,#005494 100%);
    background: linear-gradient(to bottom, #006abb 0%,#005494 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006abb', endColorstr='#005494',GradientType=0 );
    border: 0px solid #005da3;
    border-radius: 50px;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    min-width: 250px;
}

    .btn-genrate:hover {
        color: #fff;
    }

.questionnaire-inner .accordion {
    border: 0;
    width: 100%;
}

    .questionnaire-inner .accordion h3 {
        background-color: #f3e9eb;
        color: #222;
        font-size: 16px;
        text-align: center;
        margin: 0;
        padding: 10px;
    }

    .questionnaire-inner .accordion .card-header {
        padding: 0px;
        border-bottom: 2px solid #000000;
    }

        .questionnaire-inner .accordion .card-header button {
            text-align: left;
            display: block;
            width: 100%;
            font-size: 18px;
            color: #311e69;
            position: relative;
            background: #ffffff;
            border-radius: 0;
            text-decoration: none;
        }

            .questionnaire-inner .accordion .card-header button.collapsed {
                color: #010101;
            }

                .questionnaire-inner .accordion .card-header button.collapsed::after {
                    position: absolute;
                    width: 3px;
                    height: 14px;
                    content: '';
                    background-color: #000000;
                    right: 12px;
                    top: 54%;
                    -webkit-transform: translateY(-50%);
                    transform: translateY(-50%);
                }

            .questionnaire-inner .accordion .card-header button::before {
                position: absolute;
                width: 14px;
                height: 3px;
                content: '';
                background-color: #000000;
                right: 7px;
                top: 50%;
            }

            .questionnaire-inner .accordion .card-header button:hover {
                text-decoration: none;
            }

            .questionnaire-inner .accordion .card-header button i {
                float: right;
                margin-top: 3px;
            }

.questionnaire-inner .card {
    border: 0px;
    margin-top: 10px;
}

.min-w-200 {
    min-width: 190px;
}

.questionnaire-inner div.answer h4 {
    color: #000000;
    font-size: 18px;
    font-style: italic;
    margin-left: 54px;
}

.ans1 {
    background: #f8fcff;
    padding: 6px;
    margin-bottom: 10px;
    height: auto;
}
    /*****Nik*****/
    .ans1 .green_circle {
        background: #ffffff;
        border: 2px solid #287904;
        border-radius: 50%;
        -webkit-box-shadow: 0px 3px 14px -4px rgba(0,0,0,0.4);
        -moz-box-shadow: 0px 3px 14px -4px rgba(0,0,0,0.4);
        box-shadow: 0px 3px 14px -4px rgba(0,0,0,0.4);
        width: 45px;
        height: 45px;
        margin-left: -22px;
        margin-top: -18px;
        float: left;
    }

        .ans1 .green_circle span {
            width: 29px;
            height: 29px;
            background: #287904;
            position: relative;
            border-radius: 50%;
            left: 6px;
            top: 6px;
            color: #ffffff;
            text-align: center;
            line-height: 31px;
            font-size: 13px;
            display: block;
            font-weight: 600;
        }
/**************Nik***************/

.bg_gray {
    background: #fafafa;
}

.bor-y {
    border-color: #e69d00 !important;
}

.bg-yellow {
    background: #e69d00 !important;
}

.ans1 .icon {
    float: right;
    margin-top: -30px;
}

.edit-icon {
    font-size: 26px;
    color: #0e68aa;
}

.ans_input {
    background: #fafafa;
    border: 0px;
    padding: 2px 4px;
    border-bottom: 2px dashed #000000;
    max-width: 150px;
}

    .ans_input:focus {
        outline: 0px
    }

.ans-badge {
    margin: 50px 0px 30px 54px;
    border-bottom: 1px solid #b6b6b6;
}

.questionnaire-inner div.answer .ans-badge h5 {
    color: #000000;
    font-size: 14px;
}

.questionnaire-inner div.answer .ans-badge:before {
    position: absolute;
    content: "\f04b";
    color: #000000;
    font-size: 13px;
    font-family: 'FontAwesome';
    left: 60px;
}

.bor_btn {
    color: #0e68aa;
    border: 1px solid #0e68aa;
    padding: 3px 12px;
    margin-top: -36px;
    border-radius: 20px;
}

    .bor_btn:hover {
        background: #0e68aa;
        color: #ffffff;
        text-decoration: none;
    }

.ans-badge .blue-txt {
    color: #0e68aa;
    font-size: 18px;
    margin-right: 20px;
}

.ans_option {
    height: auto;
    border-left: 5px solid rgba(0, 0, 0, 0.3);
    margin: 0px 0px 0px 20px;
}

    .ans_option ul {
        margin: 0px;
    }

    .ans_option .left-arrow:before {
        position: relative;
        content: "\f0d8";
        color: #ffffff;
        font-size: 13px;
        font-family: 'FontAwesome';
        left: -9px;
        bottom: 13px;
        background: #000000;
        width: 15px;
        height: 15px;
        text-align: center;
        border-radius: 50%;
        display: block;
        line-height: 13px;
    }

    .ans_option .left-arrow:after {
        position: relative;
        content: "\f0d7";
        color: #ffffff;
        font-size: 13px;
        font-family: 'FontAwesome';
        left: -10px;
        bottom: -13px;
        background: #000000;
        width: 15px;
        height: 15px;
        text-align: center;
        border-radius: 50%;
        display: block;
        line-height: 16px;
    }

    .ans_option ul li {
        list-style: none;
        padding: 1px 2px;
    }

        .ans_option ul li .alph_opt {
            width: 18px;
            height: 18px;
            border-radius: 50%;
            color: #ffffff;
            font-size: 12px;
            display: inline-block;
            text-align: center;
            background: #000000;
            margin-right: 10px;
        }

        .ans_option ul li .txt-opt {
            color: #000000;
            font-size: 18px;
            border-bottom: 1px solid #b6b6b6 !important;
            width: 120px;
            max-width: 250px;
            display: inline-block;
            border: 0;
            background: #fafafa;
        }

        .ans_option ul li.active .txt-opt {
            border-bottom: 1px solid #287904 !important;
        }

        .ans_option ul li .txt-opt:focus {
            outline: 0px;
        }

        .ans_option ul li .txt-del {
            color: #ff0000;
            font-size: 26px;
        }

.loader-container {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 99999;
}

.lds-roller {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
    left: 46%;
    top: 46%;
}

    .lds-roller div {
        animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
        transform-origin: 40px 40px;
    }

        .lds-roller div:after {
            content: " ";
            display: block;
            position: absolute;
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: #fff;
            margin: -4px 0 0 -4px;
        }

        .lds-roller div:nth-child(1) {
            animation-delay: -0.036s;
        }

            .lds-roller div:nth-child(1):after {
                top: 63px;
                left: 63px;
            }

        .lds-roller div:nth-child(2) {
            animation-delay: -0.072s;
        }

            .lds-roller div:nth-child(2):after {
                top: 68px;
                left: 56px;
            }

        .lds-roller div:nth-child(3) {
            animation-delay: -0.108s;
        }

            .lds-roller div:nth-child(3):after {
                top: 71px;
                left: 48px;
            }

        .lds-roller div:nth-child(4) {
            animation-delay: -0.144s;
        }

            .lds-roller div:nth-child(4):after {
                top: 72px;
                left: 40px;
            }

        .lds-roller div:nth-child(5) {
            animation-delay: -0.18s;
        }

            .lds-roller div:nth-child(5):after {
                top: 71px;
                left: 32px;
            }

        .lds-roller div:nth-child(6) {
            animation-delay: -0.216s;
        }

            .lds-roller div:nth-child(6):after {
                top: 68px;
                left: 24px;
            }

        .lds-roller div:nth-child(7) {
            animation-delay: -0.252s;
        }

            .lds-roller div:nth-child(7):after {
                top: 63px;
                left: 17px;
            }

        .lds-roller div:nth-child(8) {
            animation-delay: -0.288s;
        }

            .lds-roller div:nth-child(8):after {
                top: 56px;
                left: 12px;
            }

@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.link-txt {
    color: #0e68aa;
    font-size: 18px;
    margin-left: 87px;
}

.footer-section {
    position: fixed;
    bottom: 0px;
    width: 100%;
    display: none;
}

    .footer-section span {
        display: inline-block;
        min-width: 240px;
        border-top-left-radius: 20px;
        background-color: #0e68aa;
        padding: 13px 0px 13px 0px;
        text-align: center;
        float: right;
        margin-right: -15px;
    }

        .footer-section span img {
            width: 110px;
        }

/*BA Added*/
/* new added */
.que-mode {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.questionnaire-inner div.answer h4 {
    line-height: 20px;
    margin-left: 7px;
    width: calc(100% - 165px);
    cursor: pointer;
    font-size: 15px;
}

.ans1 .green_circle {
    margin-left: 0;
    margin-top: 0;
}

.ans1 .icon {
    margin-top: 0;
    width: 107px;
    text-align: right;
}

.ans-badge {
    margin-top: 30px;
}

.ans_input {
    border-bottom: none;
}

ul.view-list li {
    font-size: 16px;
    line-height: 30px;
}

ul.view-list {
    padding-left: 90px;
}

.add-option {
    color: #0e68aa;
    font-size: 18px;
    margin-left: 70px;
    margin-top: 15px;
    display: block;
    padding: 5px;
}

.ans_option {
    position: relative;
}

.up {
    position: absolute;
    top: 0;
    top: -17px;
    left: -9px;
    font-size: 16px;
}

.down {
    position: absolute;
    bottom: -17px;
    left: -9px;
    font-size: 16px;
}

.active-ans {
    background: #8cc88c;
}


@media (min-width: 1025px) and (max-width: 1280px) {
}

@media (min-width: 981px) and (max-width: 1190px) {
}

@media (min-width: 768px) and (max-width: 1024px) {
}

@media (min-width: 481px) and (max-width: 767px) {
}

@media (min-width: 320px) and (max-width: 480px) {
}

@media (min-width: 320px) and (max-width: 375px) {
}


/*************************Nikhil************************/

.counter {
    color: #fff;
    text-align: center;
    padding: 0 0 45px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

    .counter h3 {
        margin-top: 12px;
        font-size: 34px;
        margin-bottom: 0;
    }

    .counter:before,
    .counter:after {
        content: '';
        background-color: #9fc1ff;
        height: calc(100% - 62px);
        width: 100%;
        border-radius: 0 0 20px 20px;
        position: absolute;
        left: 0;
        bottom: 20px;
        z-index: -1;
        box-shadow: 0 5px 0 rgb(255 255 255 / 80%), 0 10px 10px rgb(0 0 0 / 30%);
    }

    .counter:after {
        width: 30px;
        height: 30px;
        border-radius: 0;
        transform: translateX(-50%) rotate(45deg);
        bottom: 6px;
        left: 50%;
        box-shadow: none;
    }

    .counter .counter-value {
        color: #ffffff;
        background: #0e3a8b;
        font-size: 17px;
        font-weight: 400;
        line-height: 28px;
        padding: 18px 15px;
        width: 95%;
        height: auto;
        margin: 0 auto 0px;
        border-radius: 50%;
        box-shadow: 0 -5px 0 rgb(255 255 255 / 80%), 0 10px 10px rgb(0 0 0 / 30%);
        display: block;
        border: 2px solid #9fc1ff;
    }

    .counter ul {
        margin: 0px;
        padding: 0px;
    }

        .counter ul li:first-child {
            font-size: 25px;
            font-weight: 700;
        }

        .counter ul li:last-child {
            background: #ffffff;
            color: #e8ab29 !important;
        }

        .counter ul li {
            list-style: none;
            display: block;
            padding: 3px 0px;
            color: #072e76;
            font-size: 14px;
            margin: 5px 10px;
            cursor: pointer;
            border: 1px dashed #ffffff9e;
            -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.20);
            -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.20);
            box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.20);
            border-radius: 5px;
        }

            .counter ul li:nth-child(even) {
            }

    .counter.red:before, .counter.red:after {
        background-color: #ff97a3;
    }

    .counter.red ul li {
        color: #791723;
    }

    .counter.red .counter-value {
        border: 2px solid #ff97a3;
        background: #75000e;
    }

    .counter.gren:before,
    .counter.gren:after {
        background-color: #5acfad;
    }

    .counter.gren ul li {
        color: #065941;
    }

    .counter.gren .counter-value {
        border: 2px solid #5acfad;
        background: #014934;
    }

    .counter.pink:before,
    .counter.pink:after {
        background-color: #ffc6e3;
    }

    .counter.pink ul li {
        color: #7e0a45;
    }

    .counter.pink .counter-value {
        border: 2px solid #ffc6e3;
        background: #73053d;
    }

@media screen and (max-width:990px) {
         .counter {
        margin-bottom: 40px;
    }
}

.btn-theme {
    background-color: #311e69;
    border: 1px solid #311e69;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    border-radius: 7px;
    min-width: 160px;
    padding: 9px 20px;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
}

    .btn-theme:hover {
        background-color: #741cc1;
        border: 1px solid #741cc1;
        color: #ffffff;
    }
/*******************************e-learning ***********************************/

/***************************Exam sytle***************************/

.questionnaire-inner h4 {
    font-size: 18px;
    font-weight: 600;
    color: #234478;
}

.btn-test {
    font-weight: 500;
    font-size: 12px;
    padding: 3px 10px;
    margin-top: 10px;
    color: #fff;
    background-color: #311e69;
}

    .btn-test span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }

        .btn-test span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: -6px;
            right: -20px;
            font-size: 18px;
            transition: 0.5s;
        }

    .btn-test:hover {
        background: #741cc1;
    }

        .btn-test:hover span {
            padding-right: 22px;
            color: #ffffff;
        }

            .btn-test:hover span:after {
                opacity: 1;
                right: 0;
            }

.progress-bar-success {
    background-color: #5cb85c;
}

.question-area .que-mode h3 {
    line-height: 26px;
    margin-left: 7px;
    width: calc(100% - 50px);
    cursor: pointer;
    font-size: 16px;
}

.question-area ul {
    margin: 15px 10px;
    padding: 0px;
}

    .question-area ul li .Ansoption {
        color: #797979;
        font-size: 18px;
        display: inline-block;
        line-height: 17px;
        height: 30px;
        width: 35px;
        border: 0;
        padding: 6px 10px;
        border-right: 2px solid #cecdcd;
    }

    .question-area ul li {
        list-style: none;
        padding: 5px 2px;
        cursor: pointer;
    }

        .question-area ul li .Anstxt {
            color: #000000;
            font-size: 18px;
            display: inline-block;
            padding-left: 12px;
        }

        .question-area ul li.active .Ansoption {
            background: #2ccaa9;
            color: #ffffff;
            border-right: 2px solid #2ccaa9;
        }

        .question-area ul li.active .Anstxt {
            color: #2ccaa9;
        }
/*******Nik*********/
.ques-num {
    height: 320px;
    overflow: auto;
}

.ques-nav {
    border-left: 2px solid #b4cee1;
    height: 320px;
    padding: 10px 14px;
}
    /*******Nik*********/
    .ques-nav h5 {
        font-size: 16px;
    }

.rev-ans ul {
    margin: 0px;
    padding: 0px;
    border-bottom: 1px solid #b4cee1;
}

    .rev-ans ul li {
        list-style: none;
        display: inline-flex;
        font-size: 12px;
        color: #56585a;
        width: 44%;
        margin: 1px 8px 1px 0px;
    }

        .rev-ans ul li span {
            width: 12px;
            height: 12px;
            border-radius: 3px;
            display: inline-block;
            margin-right: 4px;
        }

.d-blue {
    background: #081466;
    color: #ffffff !important;
    border-color: #081466 !important;
}

.d-red {
    background: #ff808b;
    color: #ffffff !important;
    border-color: #ff808b !important;
}

.d-green {
    background: #2ccaa9;
    color: #ffffff !important;
    border-color: #2ccaa9 !important;
}

.d-org {
    background: #dc8a09;
    color: #ffffff !important;
    border-color: #dc8a09 !important;
}

.que-ans ul {
    margin: 0px;
    padding: 0px;
}

    .que-ans ul li {
        list-style: none;
        display: inline-block;
        font-size: 11px;
        color: #43779f;
        margin: 10px 8px 0px 0px;
        text-align: center;
        padding: 6px 6px;
        line-height: 10px;
        width: 24px;
        height: 24px;
        border-radius: 3px;
        border: 1px solid #8bb6d7;
    }
/*nikhil*/
.select-client-btn {
   
    border: 0px;
    outline: none;
    box-shadow: none;
    color: #000 !important;
    padding: 5px 0px 0px 6px;
    width: 100% !important;
    
}

    .select-client-btn:focus {
        outline: 0px;
    }

    .start-call-btn {
        background-color: #e33544 !important;
        right: 8px !important;
    }

.select-client-btn .button-text {
    display: inline-block;
    padding-top: 3px;
    width: 100px;
    float: left;
}

.select-client-btn span {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #000;
    display: inline;
    line-height: 50px;
    text-align: center;
}

.select-client-btn p {
    display: inline-block;
    padding: 8px 3px;
    vertical-align: top;
    width: 55px;
    float: left;
}

    .select-client-btn p i {
        font-size: 40px;
        animation: blinker 1s linear infinite;
    }

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

/****Nik***/
/*******************Blue Intro********************/

.intro_bg {
    background: url(../images/intro_bg.png) left top repeat;
    background-size: contain;
    min-height: 100vh;
}

.bor-15 {
    border-radius: 15px;
}

.blue-back {
    background-color: #0e68aa;
}

.trans-bg {
    background-color: rgba(255, 255, 255, 0.8) !important;
}

.intro-tp-btn {
    top: 0;
    border-radius: 0;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    box-shadow: none;
    border: 0;
}

.trans-bg h1 {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0px;
    color: #3f3f3f;
}

.trans-bg h2 {
    color: #3f3f3f;
    font-size: 18px;
    font-weight: 700;
}

    .trans-bg h2 span {
        font-weight: 400;
    }

.trans-bg .intro-box {
    background: #fff;
    padding: 10px 20px 20px;
    border-radius: 15px 15px 20px 20px;
    border-top: 5px solid #3088E2;
    box-shadow: 0 10px 20px rgb(0 0 0 / 10%);
    text-align: center;
    min-height: 440px;
    height: 100%;
}

.intro-box h3 {
    font-size: 22px;
    color: #3f3f3f;
    font-weight: 600;
    text-transform: uppercase;
    margin-top: 5px;
}

.intro-box ul {
    margin: 0px;
    padding: 0px;
}

    .intro-box ul li {
        padding: 3px 0px;
        font-size: 12px;
        color: #3f3f3f;
        list-style-position: outside;
        margin-left: 12px;
        text-align: left;
    }

.intro-box img {
    margin: 0 auto;
}
/********************Nav Css********************/
.button_container:hover {
    opacity: .9;
}

.button_container.active .top {
    transform: translateY(2px) translateX(0) rotate(45deg);
    background: #FFF;
}

.button_container.active .middle {
    opacity: 0;
    background: #FFF;
}

.button_container.active .bottom {
    transform: translateY(-11px) translateX(0) rotate(-45deg);
    background: #FFF;
}

.button_container span {
    background: #fff;
    border: none;
    height: 3px;
    transition: all .35s ease;
    cursor: pointer;
    width: 26px;
    display: block;
    margin-top: 4px;
}

    .button_container span:nth-of-type(2) {
        top: 11px;
    }

    .button_container span:nth-of-type(3) {
        top: 22px;
    }

.overlay-menu-top {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    height: 0%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s, visibility .35s, height .35s;
    overflow: hidden;
    background: #ffffff;
    min-height: 100vh;
}

    .overlay-menu-top.open {
        opacity: 1;
        visibility: visible;
        height: 100%;
    }

.custom-nav-pills .nav-pills {
    margin: 34px 0px 20px 0px;
}

    .custom-nav-pills .nav-pills .nav-link {
        text-transform: uppercase;
        border-radius: 0px;
        position: relative;
        color: #000;
        font-size: 27px;
        line-height: 1.1em;
        font-weight: 500;
        display: inline-block;
        margin-bottom: 7px;
        background-size: 100% 200%;
        background-image: linear-gradient(to bottom, white 50%, #311e69 50%);
        -webkit-transition: background-position 1s;
        -moz-transition: background-position 1s;
        transition: background-position 1s;
    }

        .custom-nav-pills .nav-pills .nav-link.active, .custom-nav-pills .nav-pills .show > .nav-link, .custom-nav-pills .nav-pills .nav-link:hover {
            color: #fff;
            background-color: #311e69;
            background-position: 0 -100%;
        }

        .custom-nav-pills .nav-pills .nav-link i {
            font-size: 16px;
            margin-right: 10px;
        }

.custom-nav-pills .quick-links {
    margin-top: 20px;
    display: block;
    width: 100%;
    margin-left: 50px;
}

    .custom-nav-pills .quick-links .badge-primary {
        background-color: #311e69;
    }

    .custom-nav-pills .quick-links h3 {
        position: relative;
        color: #550c55;
        font-weight: 500;
        font-size: 16px;
        line-height: 1.2em;
        margin-bottom: 5px;
    }

    .custom-nav-pills .quick-links ul {
        margin: 0px;
        padding: 0px;
        list-style-type: none;
    }

        .custom-nav-pills .quick-links ul li {
            display: block;
        }

            .custom-nav-pills .quick-links ul li a {
                display: inline-block;
                margin: 6px 10px;
                position: relative;
                color: #666666;
                font-weight: 500;
                font-size: 18px;
                line-height: 1.2em;
                -webkit-transition: all 600ms ease;
                -moz-transition: all 600ms ease;
                -ms-transition: all 600ms ease;
                -o-transition: all 600ms ease;
                transition: all 600ms ease;
            }

                .custom-nav-pills .quick-links ul li a:hover {
                    color: #311e69;
                    border-left: 4px solid #311e69;
                    padding: 0px 10px;
                    text-decoration: none;
                }

                .custom-nav-pills .quick-links ul li a.active {
                    color: #311e69;
                    border-left: 4px solid #311e69;
                    padding: 0px 10px;
                }

.custom-nav-content .tab-content {
    padding: 0px;
}

    .custom-nav-content .tab-content h2 {
        position: relative;
        color: #7f7f7f;
        font-size: 60px;
        line-height: 1em;
        font-weight: 600;
        border-left: 2px solid #350635;
        padding-left: 20px;
    }

    .custom-nav-content .tab-content .tab-inner-content {
        display: block;
        padding-left: 26px;
        margin: 30px 0px;
    }

        .custom-nav-content .tab-content .tab-inner-content h3 {
            position: relative;
            color: #311e69;
            font-size: 34px;
            line-height: 1em;
            font-weight: 500;
            text-transform: uppercase;
        }

.btn-transparent {
    background-color: transparent !important;
    border: 0px !important;
    color: #fff !important;
    border-radius: 0px !important;
    outline: none !important;
    margin-left: 10px;
}

    .btn-transparent:hover, .btn-transparent:focus, .btn-transparent:visited {
        border: 0px !important;
        outline: none !important;
        box-shadow: none !important;
    }

    .btn-transparent i.fa-bars {
        font-size: 26px;
        vertical-align: text-top;
    }

.btn-transparent-top {
    background-color: #231351 !important;
    border: 0px !important;
    color: #fff !important;
    border-radius: 0px !important;
    padding: 34px 30px;
    outline: none !important;
    margin-left: 10px;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.5);
    position: relative;
    z-index: 99999;
}

    .btn-transparent-top:hover, .btn-transparent-top:focus, .btn-transparent-top:visited {
        border: 0px !important;
        outline: none !important;
    }

    .btn-transparent-top i.fa-bars {
        font-size: 34px;
        vertical-align: text-top;
        line-height: 76px;
    }

.btn-transparent i.fa-angle-down {
    position: relative;
    top: 12px;
    font-size: 18px;
}

.m-t-10 {
    margin-top: 10px;
}

.tab-content {
    padding: 10px;
    position: relative;
}

    .tab-content p {
        color: #000000;
        margin-bottom: 10px;
        font-size: 13px;
    }

.custom-menu ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

    .custom-menu ul li {
        display: block;
        margin-bottom: 0px;
    }

        .custom-menu ul li span {
            display: inline-block;
            width: 40px;
            height: 40px;
            vertical-align: top;
            border: 1px solid #571d57;
            background-color: #fff;
            border-radius: 3px;
            margin-top: 13px;
            text-align: center;
            -webkit-transition: all 300ms ease;
            -ms-transition: all 300ms ease;
            -o-transition: all 300ms ease;
            -moz-transition: all 300ms ease;
            transition: all 300ms ease;
        }

            .custom-menu ul li span i {
                font-size: 34px;
                line-height: 49px;
                color: #311e69;
            }

        .custom-menu ul li:hover span {
            background-color: #311e69;
        }

            .custom-menu ul li:hover span i {
                color: #fff;
            }

        .custom-menu ul li a {
            display: inline-block;
            padding: 10px;
            width: 100%;
            vertical-align: middle;
        }

.cust-right ul li a {
    width: 78%;
}

.custom-menu ul li a h4 {
    display: block;
    font-size: 22px;
    color: #000000;
    line-height: 30px;
    font-weight: 500;
    margin-top: 3px;
    margin-bottom: 3px;
}

.custom-menu ul li a h5 {
    display: block;
    font-size: 14px;
    color: #000000;
    line-height: 21px;
    font-weight: 400;
    margin-top: 3px;
    margin-bottom: 3px;
}

.custom-menu ul li a:hover {
    text-decoration: none;
}

.custom-menu ul li a p {
    font-size: 12px;
    color: #727272;
    line-height: 18px;
    font-weight: 400;
    margin-bottom: 0px;
}

.custom-menu ul li a:hover h4, .custom-menu ul li a:hover p {
    color: #311e69;
    text-decoration: none !important;
}

.main-header {
    position: absolute;
    z-index: 999;
    width: 100%;
    -ms-animation-duration: 500ms;
    -moz-animation-duration: 500ms;
    -op-animation-duration: 500ms;
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms;
}

    .main-header .main-box {
        position: relative;
        padding: 0px 0px;
        left: 0px;
        top: 0px;
        width: 100%;
        background: none;
        -webkit-transition: all 300ms ease;
        -ms-transition: all 300ms ease;
        -o-transition: all 300ms ease;
        -moz-transition: all 300ms ease;
        transition: all 300ms ease;
    }

        .main-header .main-box .outer-container {
            position: relative;
            padding: 0px 40px;
        }

        .main-header .main-box .logo-box {
            position: relative;
            float: left;
            left: 0px;
            z-index: 10;
            padding: 30px 0px;
        }

            .main-header .main-box .logo-box .logo img {
                display: inline-block;
                max-width: 100%;
                -webkit-transition: all 300ms ease;
                -ms-transition: all 300ms ease;
                -o-transition: all 300ms ease;
                -moz-transition: all 300ms ease;
                transition: all 300ms ease;
            }

    .main-header .header-upper {
        position: relative;
        z-index: 1;
    }

        .main-header .header-upper .outer-box {
            position: relative;
            float: right;
            margin-right: 0px;
            padding-left: 30px;
        }

    .main-header .nav-outer {
        position: static;
        margin-left: 220px;
        padding-top: 0px;
        transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -webkit-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        -o-transition: all 500ms ease;
    }

    .main-header .header-upper .logo-box {
        position: relative;
        padding: 22px 0px 0px;
        transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -webkit-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        -o-transition: all 500ms ease;
    }

        .main-header .header-upper .logo-box .logo {
            position: relative;
        }

    .main-header .header-lower {
        position: relative;
        background-color: rgba(0, 0, 0, 0.55);
    }

    .main-header.fixed-header {
        position: fixed;
        left: 0px;
        right: 0px;
        top: 0px;
        z-index: 999;
        width: 100%;
        background-color: #311e69;
        -webkit-box-shadow: 0px 2px 3px 0px rgb(0 0 0 / 30%);
        -moz-box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.3);
        box-shadow: 0px 2px 3px 0px rgb(0 0 0 / 30%);
    }

.max-w-100 {
    max-width: 100%;
}

.main-header.fixed-header .header-upper .logo-box {
    padding: 15px 15px 0px;
}

.main-header.fixed-header .nav-outer {
    padding-top: 0px;
}

.main-header.fixed-header .main-menu .navigation > li > a {
    padding: 10px 0px;
}

    .main-header.fixed-header .main-menu .navigation > li > a:before {
        display: none;
    }

.main-header.fixed-header .header-upper .outer-box {
    padding-top: px;
}

.main-header.fixed-header .main-menu .navigation > li > a i.fa-search {
    color: #fff;
    margin-top: 0px;
}

.main-header.fixed-header .header-upper .outer-box .btn-transparent-top {
    padding: 20px 26px;
}

.auto-container {
    position: static;
    max-width: 1200px;
    padding: 0px 15px;
    margin: 0 auto;
}

.notification {
    background: #311e69;
    width: 90px;
    padding: 2px 2px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    position: absolute;
    left: -35px;
    -webkit-box-shadow: 0px 3px 8px 0px rgba(49,30,105,0.55);
    -moz-box-shadow: 0px 3px 8px 0px rgba(49,30,105,0.55);
    box-shadow: 0px 3px 8px 0px rgba(49,30,105,0.55);
}

    .notification img {
        height: 30px;
        float: right;
    }



.post-block-style img {
    position: relative;
    width: 100%;
    display: block;
    border-radius: 7px;
    margin-bottom: 10px;
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
    -webkit-box-shadow: 0px 7px 7px 0px rgba(87, 29, 87, 0.5);
    -moz-box-shadow: 0px 7px 7px 0px rgba(87, 29, 87, 0.5);
    box-shadow: 0px 7px 7px 0px rgba(87, 29, 87, 0.5);
}

    .post-block-style img:hover {
        transform: scale(1.04, 1.04);
        opacity: 0.7;
    }

.post-block-style ul li a h5 {
    font-size: 13px;
}

.user-profile img {
    width: 45px;
    border: 3px solid #0e68aa;
    border-style: double;
}

.user-profile .dropdown-user {
    right: -95%;
    position: relative;
    top: -32px;
    height: 0px;
}

    .user-profile .dropdown-user button:focus {
        box-shadow: none;
    }

    .user-profile .dropdown-user .dropdown-menu {
        z-index: 999999;
        padding: 0px;
        border-radius: 5px;
        top: 56px;
        left: 10px !important;
        -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.25);
        -moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.25);
        box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.25);
    }

        .user-profile .dropdown-user .dropdown-menu a, .dropdown-custom .dropdown-menu a {
            font-size: 13px;
            font-weight: 400;
            color: #333;
            padding: 5px 15px 5px 5px;
            border-bottom: 1px solid #ecebeb;
        }

.dropdown-custom .dropdown-menu a {
    padding: 5px 12px 5px 12px;
}

.user-profile .dropdown-user .dropdown-menu a i, .user-profile .dropdown-menu a i {
    font-size: 18px;
    color: #311e69;
    display: inline-block;
    line-height: 26px;
    vertical-align: middle;
    min-width: 28px;
    text-align: center;
    margin-right: 5px;
}

.user-profile .dropdown-item.active, .user-profile .dropdown-item:active {
    background-color: rgba(0, 0, 0, 0.1)
}

#Logout {
    cursor: pointer;
}
/****
====================================================================
Mobile Menu
====================================================================

***/
.nav-outer .mobile-nav-toggler {
    position: relative;
    float: right;
    font-size: 40px;
    line-height: 50px;
    cursor: pointer;
    color: #ffffff;
    display: none;
}

.mobile-menu {
    position: fixed;
    right: 0;
    top: 0;
    width: 300px;
    padding-right: 30px;
    max-width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    z-index: 999999;
}

    .mobile-menu .nav-logo {
        position: relative;
        padding: 20px 20px;
        text-align: left;
    }

        .mobile-menu .nav-logo img {
            max-width: 200px;
        }

.mobile-menu-visible {
    overflow: hidden;
}

    .mobile-menu-visible .mobile-menu {
        opacity: 1;
        visibility: visible;
    }

.mobile-menu .menu-backdrop {
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(0, 0, 0, 0.90);
    -webkit-transform: translateX(101%);
    -ms-transform: translateX(101%);
    transform: translateX(101%);
}

.mobile-menu-visible .mobile-menu .menu-backdrop {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -ms-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.mobile-menu .menu-box {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    background: #ffffff;
    padding: 0px 0px;
    z-index: 5;
    opacity: 0;
    visibility: hidden;
    border-radius: 0px;
    -webkit-transform: translateX(101%);
    -ms-transform: translateX(101%);
    transform: translateX(101%);
}

.mobile-menu-visible .mobile-menu .menu-box {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.7s ease 500ms;
    -moz-transition: all 0.7s ease 500ms;
    -ms-transition: all 0.7s ease 500ms;
    -o-transition: all 0.7s ease 500ms;
    transition: all 0.7s ease 500ms;
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.mobile-menu .close-btn {
    position: absolute;
    right: 3px;
    top: 3px;
    line-height: 30px;
    width: 30px;
    text-align: center;
    font-size: 14px;
    color: #202020;
    cursor: pointer;
    z-index: 10;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
}

.mobile-menu-visible .mobile-menu .close-btn {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
}

.mobile-menu .close-btn:hover {
    opacity: 0.50;
}

.mobile-menu .navigation {
    position: relative;
    display: block;
    width: 100%;
    border-top: 1px solid rgba(0, 0, 0, 0.10);
}

    .mobile-menu .navigation li {
        position: relative;
        display: block;
        border-bottom: 1px solid rgba(0, 0, 0, 0.10);
    }

        .mobile-menu .navigation li > ul > li:last-child {
            border-bottom: none;
        }

        .mobile-menu .navigation li > ul > li:first-child {
            border-top: 1px solid rgba(0, 0, 0, 0.10);
        }

        .mobile-menu .navigation li > a {
            position: relative;
            display: block;
            line-height: 24px;
            padding: 10px 20px;
            font-size: 15px;
            color: #404040;
            text-transform: capitalize;
        }

        .mobile-menu .navigation li:hover > a, .mobile-menu .navigation li.current > a {
            color: #f34a4d;
        }

        .mobile-menu .navigation li.dropdown .dropdown-btn {
            position: absolute;
            right: 0px;
            top: 0px;
            width: 44px;
            height: 44px;
            text-align: center;
            font-size: 16px;
            line-height: 44px;
            color: #404040;
            cursor: pointer;
            z-index: 5;
        }

            .mobile-menu .navigation li.dropdown .dropdown-btn:after {
                content: '';
                position: absolute;
                left: 0px;
                top: 10px;
                width: 1px;
                height: 24px;
                border-left: 1px solid rgba(0, 0, 0, 0.10);
            }

        .mobile-menu .navigation li > ul, .mobile-menu .navigation li > ul > li > ul {
            display: none;
        }

.sticky-header .navbar-header {
    display: none;
}

.max-w-100 {
    max-width: 100%;
}

.logo img {
    height: 30px;
}

.header-section {
    height: 50px;
}

    .header-section .rapid-txt {
        margin-top: 15px;
    }

        .header-section .rapid-txt span {
            font-size: 20px;
            font-weight: 600;
            color: #fff;
        }

/**********************Score Card Start***********************/

.scoreCard-top {
    background-color: #0e68aa;
    border-top-left-radius: 15px;
    padding: 15px;
    color: #ffffff;
}

    .scoreCard-top span {
        font-size: 20px;
        font-weight: 500;
    }

.score-g-bg {
    background: #287904 !important;
}

.align-middle {
    vertical-align: middle !important;
}

.img-radius {
    border-radius: 50%;
}

.score-area .user-img {
    border: 3px solid #0e68aa;
    border-style: double;
}

.score-area h6, .score-area h3 {
    color: #0e68aa;
    font-size: 20px;
}

.score-area p {
    font-weight: 600;
}

.score-box {
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    padding: 20px;
    background: #ececec;
}

    .score-box .user-detail {
        border-bottom: 1px solid #c4c4c4;
    }

        .score-box .user-detail label {
            font-weight: 600;
        }

.progress-box .progress {
    width: calc(100% - 50%);
    height: 8px;
    text-align: center;
    margin: 0 auto;
    background-color: #d7d7d7;
    border-radius: 30px;
    position: relative;
    overflow: inherit;
}

.progress-box p {
    width: 40%;
}

.progress-box .progress .progress-bar {
    border-radius: 30px;
}

    .progress-box .progress .progress-bar label {
        position: absolute;
        top: -15px;
        right: 0;
        font-weight: 600;
        font-size: 13px;
        color: #000000;
    }
/*******************/

.ques-circle {
    position: relative;
    margin: 20px auto;
    height: 120px;
    width: 120px;
    background-color: #ffffff;
    border-radius: 50%;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.65);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.65);
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.65);
}

    .ques-circle span {
        position: relative;
        top: 30%;
        text-align: center;
        font-size: 35px;
        font-weight: 700;
    }

    .ques-circle:before {
        position: absolute;
        content: '';
        height: calc(100% + 10px);
        width: calc(100% + 10px);
        border: 3px dashed #2ccaa9;
        top: -5px;
        left: -5px;
        border-radius: inherit;
        animation: spin 10s linear infinite;
    }

@keyframes spin {
    100% {
        transform: rotateZ(360deg);
    }
}

.pink-border:before {
    border-color: #ff808b;
}

.pur-border:before {
    border-color: #5667e0;
}

.org-border:before {
    border-color: #e2a442;
}

.red-border:before {
    border-color: #db3711;
}


/***********************Score Card End***********************/
/************************Score Card 3rd start***************************/

.roundbox {
    width: 40px;
    height: 40px;
}

.b-radius-10 {
    border-radius: 10px;
}

.btn-shadow {
    box-shadow: 0 4px 8px -4px rgb(94 86 105 / 42%) !important;
}

.exam-area ul {
    margin: 0px;
    padding: 0px;
}

    .exam-area ul li {
        list-style: none;
        display: inline-block;
        margin: 10px 8px;
        width: 18%;
    }

.examBox h2 {
    font-weight: 700;
}

.examBox {
    background: #fff;
    text-align: center;
    padding: 0 15px 20px;
    margin: 10px;
    border: 2px solid #9fc1ff;
    border-radius: 50px 0;
    box-shadow: 0 0 8px rgba(0,0,0,0.3) inset;
    position: relative;
    transition: all 0.3s ease 0s;
}

.examBox:hover {
    -webkit-box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
    -moz-box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
    box-shadow: 0px 5px 10px 0px rgba(49, 30, 105, 0.3);
}

.examBox:before, .examBox:after {
    content: "";
    width: 25px;
    height: 25px;
    border-top: 7px solid #9fc1ff;
    border-right: 7px solid #799fe5;
    position: absolute;
    top: -7px;
    right: -7px;
}

.examBox:after {
    border-top: none;
    border-right: none;
    border-bottom: 7px solid #9fc1ff;
    border-left: 7px solid #799fe5;
    top: auto;
    right: auto;
    bottom: -7px;
    left: -7px;
}

.examBox .exam-icon {
    color: #fff;
    background: #9fc1ff;
    font-size: 22px;
    width: 70px;
    padding: 0 0 5px;
    margin: 0 auto 15px;
    border-radius: 0 0 15px 15px;
    box-shadow: 3px 3px 3px rgba(0,0,0,0.2);
    position: relative;
}

.examBox:hover .exam-icon i {
    transform: rotateX(360deg);
    transition: all 0.3s;
}

.examBox .exam-icon:before {
    content: "";
    background: #9fc1ff;
    width: calc(100% + 14px);
    height: 10px;
    transform: translateX(-50%);
    position: absolute;
    top: -10px;
    left: 50%;
}

.examBox .exam-icon span:before,
.examBox .exam-icon span:after {
    content: '';
    background-color: #799fe5;
    height: 10px;
    width: 15px;
    border-radius: 10px 10px 0 0;
    position: absolute;
    left: -15px;
    top: -10px;
}

.examBox .exam-icon span:after {
    left: auto;
    right: -15px;
}

.examBox .title {
    color: #0a1f44;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 10px;
}

.examBox.orange {
    border-color: #ffc6e3;
}

.examBox.orange:before {
    border-top-color: #ffc6e3;
    border-right-color: #e395bd;
}

.examBox.orange:after {
    border-left-color: #ffc6e3;
    border-bottom-color: #e395bd;
}

.examBox.orange .exam-icon,
.examBox.orange .exam-icon:before {
    background-color: #ffc6e3;
}

.examBox.orange .exam-icon span:before,
.examBox.orange .exam-icon span:after {
    background-color: #e395bd;
}

.examBox.purple {
    border-color: #a4d0e7;
}

.examBox.purple:before {
    border-top-color: #a4d0e7;
    border-right-color: #72b2d3;
}

.examBox.purple:after {
    border-left-color: #a4d0e7;
    border-bottom-color: #72b2d3;
}

.examBox.purple .exam-icon,
.examBox.purple .exam-icon:before {
    background-color: #a4d0e7;
}

.examBox.purple .exam-icon span:before,
.examBox.purple .exam-icon span:after {
    background-color: #72b2d3;
}

.examBox.green {
    border-color: #5acfad;
}

.examBox.green:before {
    border-top-color: #5acfad;
    border-right-color: #2fb890;
}

.examBox.green:after {
    border-left-color: #5acfad;
    border-bottom-color: #2fb890;
}

.examBox.green .exam-icon,
.examBox.green .exam-icon:before {
    background-color: #5acfad;
}

.examBox.green .exam-icon span:before,
.examBox.green .exam-icon span:after {
    background-color: #2fb890;
}

.examBox.rbg {
    border-color: #ff97a3;
}

.examBox.rbg:before {
    border-top-color: #ff97a3;
    border-right-color: #e5717e;
}

.examBox.rbg:after {
    border-left-color: #ff97a3;
    border-bottom-color: #e5717e;
}

.examBox.rbg .exam-icon,
.examBox.rbg .exam-icon:before {
    background-color: #ff97a3;
}

.examBox.rbg .exam-icon span:before,
.examBox.rbg .exam-icon span:after {
    background-color: #e5717e;
}

@media only screen and (max-width:480px) {
    .examBox {
        margin: 10px 10px 50px;
    }

    .exam-area ul li {
        width: 90% !important;
    }
}

@media only screen and (max-width:768px) {
    .examBox {
        margin: 10px 10px 50px;
    }

    .exam-area ul li {
        width: 29%;
    }
}

@media only screen and (max-width:1024px) {
    .exam-area ul li {
        width: 29%;
    }
}

/*****************Score Card 3rd end**************************/
/***********************Score chart*******************************/
.chart-gauge {
    width: 300px;
    margin: 0px auto
}

    .chart-gauge svg {
        height: 150px !important;
    }

.chart-first {
    fill: #9FBD35;
}

.chart-second {
    fill: #F2BA3A;
}

.chart-third {
    fill: #FB3033;
}

.needle, .needle-center {
    fill: #000000;
}

.text {
    color: #112864;
    font-size: 16px;
}

svg {
    font: 10px sans-serif;
}



/***********************Score chart*******************************/
/**************************Score Card 4*/
.card {
    box-shadow: 0 2px 10px -1px rgb(69 90 100 / 30%);
    margin-bottom: 30px;
    transition: box-shadow 0.2s ease-in-out;
}

.user-card-2 .cover-img-block {
    -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 80%);
    clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 80%);
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

.user-card .user-about-block {
    margin-top: -30px;
    position: relative;
}

.b-wid-3 {
    border-width: 3px;
}

.wid-80 {
    width: 80px;
}

.user-card .user-about-block .certificated-badge {
    position: absolute;
    bottom: -5px;
    right: -5px;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background: #fff;
    padding: 5px 3px;
}

.user-card-2 .card-header:first-child {
    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}

.user-card .user-about-block img {
    box-shadow: 0 0 0 5px #fff;
    margin-top: -20px;
}

.user-card .card-header {
    background: #ececec;
}

.text-c-blue {
    color: #4680ff;
}

.user-card .user-about-block .certificated-badge .front-icon {
    font-size: 10px;
    position: absolute;
    top: 11px;
    left: 10px;
}

.serviceBox {
    color: #ffc6e3;
    font-family: 'Poppins', sans-serif;
    text-align: center;
    padding: 50px 0 0;
    position: relative;
    z-index: 1;
}

    .serviceBox:before,
    .serviceBox:after {
        content: '';
        background-color: #ffc6e3;
        height: 100px;
        width: 100px;
        border-radius: 20px;
        transform: translateX(-50%) rotate(45deg);
        position: absolute;
        left: 50%;
        top: 15px;
        z-index: -1;
    }

    .serviceBox:after {
        background-color: #999;
        height: 10px;
        width: 10px;
        border: 3px solid #fff;
        box-shadow: 0 0 10px rgba(0,0,0,0.3);
    }

    .serviceBox .service-content {
        background-color: #ffffff;
        padding: 15px;
        border-radius: 20px;
        box-shadow: 0 0 10px rgba(0,0,0,0.25);
    }

    .serviceBox .service-icon {
        font-size: 30px;
        line-height: 32px;
        margin: 0 0 10px;
    }

    .serviceBox .title {
        font-size: 28px;
        font-weight: 700;
        line-height: 26px;
        margin: 0 0 8px;
        color: #000000;
    }

    .serviceBox .description {
        color: #000;
        font-size: 14px;
        line-height: 20px;
        margin: 0;
        font-weight: 400;
    }

    .serviceBox.red {
        color: #F24148;
    }

        .serviceBox.red:before {
            background-color: #F24148;
        }

    .serviceBox.gray {
        color: #779393;
    }

        .serviceBox.gray:before {
            background-color: #779393;
        }

    .serviceBox.blue {
        color: #9fc1ff;
    }

        .serviceBox.blue:before {
            background-color: #9fc1ff;
        }

    .serviceBox.bg-g {
        color: #5acfad;
    }

        .serviceBox.bg-g:before {
            background-color: #5acfad;
        }

    .serviceBox.bg-pur {
        color: #a4d0e7;
    }

        .serviceBox.bg-pur:before {
            background-color: #a4d0e7;
        }

    .serviceBox.bg-lred {
        color: #ff97a3;
    }

        .serviceBox.bg-lred:before {
            background-color: #ff97a3;
        }

.progress {
    float: right;
    width: 100%;
    height: 40px;
    margin: 5px 0px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    background-image: none;
    -webkit-box-shadow: inset 0 1px 2px rgb(0 0 0 / 10%);
    box-shadow: inset 0 1px 2px rgb(0 0 0 / 10%);
}

    .progress-bar.active, .progress.active .progress-bar {
        -webkit-animation: progress-bar-stripes 2s linear infinite;
        -o-animation: progress-bar-stripes 2s linear infinite;
        animation: progress-bar-stripes 2s linear infinite;
    }

.progress-bar-danger {
    background-color: rgba(0, 0, 0, 0.2) !important;
}

.progress-red-bg {
    background-color: #f8d7d6 !important;
}

.progress-bar-success {
    background-color: #2c9414 !important;
}

.green_text {
    font-size: 80px;
    color: #2c9414;
}

/**************************************/
.ques-num {
    scrollbar-face-color: #2ccaa9 !important;
    scrollbar-shadow-color: #FFFFFF;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-3dlight-color: #FFFFFF;
    scrollbar-darkshadow-color: #FFFFFF;
    scrollbar-track-color: #FFFFFF;
    scrollbar-arrow-color: #FFFFFF;
}

    .ques-num::-webkit-scrollbar {
        width: 10px;
    }

    .ques-num::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 3px rgba(255, 255, 255, 0.1);
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }

    .ques-num::-webkit-scrollbar-thumb {
        -webkit-border-radius: 10px;
        border-radius: 10px;
        background: #9fc1ff;
        -webkit-box-shadow: inset 0 0 3px rgba(255, 255, 255, 0.1);
    }

/*************************Animation css*************************/


.btn-transparent-top:hover::before, .btn-transparent-top:focus::before {
    opacity: 1;
}

.btn-transparent-top::after {
    content: '';
    width: 30px;
    height: 30px;
    border-radius: 100%;
    border: 6px solid #9fc1ff;
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: ring 1.5s infinite;
}

.btn-transparent-top:hover::after, .btn-transparent-top:focus::after {
    animation: none;
    display: none;
}

@keyframes ring {
    0% {
        width: 30px;
        height: 30px;
        opacity: 1;
    }

    100% {
        width: 100px;
        height: 100px;
        opacity: 0;
    }
}

.pool-box .pool-box-inner .btn-theme {
    animation: pulse 1s ease infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

.pool-box .pool-icon img {
    animation: animate 3s linear infinite;
    border-radius: 50%;
}

@keyframes animate {
    0% {
        box-shadow: 0 0 0 0 rgb(159, 193, 255, 1), 0 0 0 0 rgb(159, 193, 255, 1)
    }

    40% {
        box-shadow: 0 0 0 20px rgb(159, 193, 255, 0), 0 0 0 0 rgb(159, 193, 255, 1)
    }

    80% {
        box-shadow: 0 0 0 20px rgb(159, 193, 255, 0), 0 0 0 10px rgb(159, 193, 255, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgb(159, 193, 255, 0), 0 0 0 10px rgb(159, 193, 255, 0)
    }
}

.pool-box.bg2 .pool-icon img {
    animation: animate1 3s linear infinite;
    border-radius: 50%;
}

@keyframes animate1 {
    0% {
        box-shadow: 0 0 0 0 rgb(90, 207, 173, 0.9), 0 0 0 0 rgb(90, 207, 173, 0.9)
    }

    40% {
        box-shadow: 0 0 0 20px rgb(90, 207, 173, 0), 0 0 0 0 rgb(90, 207, 173, 0.9)
    }

    80% {
        box-shadow: 0 0 0 20px rgb(90, 207, 173, 0), 0 0 0 10px rgb(90, 207, 173, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgb(90, 207, 173, 0), 0 0 0 10px rgb(90, 207, 173, 0)
    }
}

.pool-box.bg6 .pool-icon img {
    animation: animate2 3s linear infinite;
    border-radius: 50%;
}

@keyframes animate2 {
    0% {
        box-shadow: 0 0 0 0 rgb(216, 221, 164, 0.9), 0 0 0 0 rgb(216, 221, 164, 0.9)
    }

    40% {
        box-shadow: 0 0 0 20px rgb(216, 221, 164, 0), 0 0 0 0 rgb(216, 221, 164, 0.9)
    }

    80% {
        box-shadow: 0 0 0 20px rgb(216, 221, 164, 0), 0 0 0 10px rgb(216, 221, 164, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgb(216, 221, 164, 0), 0 0 0 10px rgb(216, 221, 164, 0)
    }
}

.pool-box.bg4 .pool-icon img {
    animation: animate3 3s linear infinite;
    border-radius: 50%;
}

@keyframes animate3 {
    0% {
        box-shadow: 0 0 0 0 rgb(255, 198, 227, 0.9), 0 0 0 0 rgb(255, 198, 227, 0.9)
    }

    40% {
        box-shadow: 0 0 0 20px rgb(255, 198, 227, 0), 0 0 0 0 rgb(255, 198, 227, 0.9)
    }

    80% {
        box-shadow: 0 0 0 20px rgb(255, 198, 227, 0), 0 0 0 10px rgb(255, 198, 227, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgb(255, 198, 227, 0), 0 0 0 10px rgb(255, 198, 227, 0)
    }
}

.pool-box.bg5 .pool-icon img {
    animation: animate4 3s linear infinite;
    border-radius: 50%;
}

@keyframes animate4 {
    0% {
        box-shadow: 0 0 0 0 rgb(255, 151, 163, 0.9), 0 0 0 0 rgb(255, 151, 163, 0.9)
    }

    40% {
        box-shadow: 0 0 0 20px rgb(255, 151, 163, 0), 0 0 0 0 rgb(255, 151, 163, 0.9)
    }

    80% {
        box-shadow: 0 0 0 20px rgb(255, 151, 163, 0), 0 0 0 10px rgb(255, 151, 163, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgb(255, 151, 163, 0), 0 0 0 10px rgb(255, 151, 163, 0)
    }
}

.bg {
    animation: slide 3s ease-in-out infinite alternate;
    background-image: linear-gradient(-60deg, #ddfde7 50%, #acc5e4 50%);
    bottom: 0;
    left: -50%;
    opacity: .5;
    position: fixed;
    right: -50%;
    top: 0;
    z-index: -1;
}

.bg2 {
    animation-direction: alternate-reverse;
    animation-duration: 4s;
}

.bg3 {
    animation-duration: 5s;
}

@keyframes slide {
    0% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(25%);
    }
}
/*****************Bubble****************/

.area {
    background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);
    width: 100%;
    height: 100%;
}

.circles {
    position: relative;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* overflow: hidden; */
    z-index: -1;
}

    .circles li {
        position: absolute;
        display: block;
        list-style: none;
        width: 20px;
        height: 20px;
        background: rgba(7, 75, 159, 0.5);
        animation: animate-bubble 25s linear infinite;
        bottom: 0px;
    }

        .circles li:nth-child(1) {
            left: 25%;
            width: 80px;
            height: 80px;
            animation-delay: 0s;
        }

        .circles li:nth-child(2) {
            left: 10%;
            width: 20px;
            height: 20px;
            animation-delay: 2s;
            animation-duration: 12s;
        }

        .circles li:nth-child(3) {
            left: 70%;
            width: 20px;
            height: 20px;
            animation-delay: 4s;
        }

        .circles li:nth-child(4) {
            left: 40%;
            width: 60px;
            height: 60px;
            animation-delay: 0s;
            animation-duration: 18s;
        }

        .circles li:nth-child(5) {
            left: 65%;
            width: 20px;
            height: 20px;
            animation-delay: 0s;
        }

        .circles li:nth-child(6) {
            left: 75%;
            width: 110px;
            height: 110px;
            animation-delay: 3s;
        }

        .circles li:nth-child(7) {
            left: 35%;
            width: 150px;
            height: 150px;
            animation-delay: 7s;
        }

        .circles li:nth-child(8) {
            left: 50%;
            width: 25px;
            height: 25px;
            animation-delay: 10s;
            animation-duration: 25s;
        }

        .circles li:nth-child(9) {
            left: 20%;
            width: 15px;
            height: 15px;
            animation-delay: 2s;
            animation-duration: 15s;
        }

        .circles li:nth-child(10) {
            left: 85%;
            width: 150px;
            height: 150px;
            animation-delay: 0s;
            animation-duration: 11s;
        }

@keyframes animate-bubble {

    0% {
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100% {
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }
}


/**************************2nd exam style**************************/



/***********************Proctoring Style**************************/
.proctor-bg {
    background-color: #003a83 !important;
}

.proctor-box {
    text-align: center;
    margin: 0 auto;
    box-shadow: 0 0 15px rgba(0,0,0,0.15);
    position: relative;
    z-index: 1;
}

    .proctor-box:before,
    .proctor-box:after {
        content: '';
        height: 85%;
        width: 85%;
        border: 8px solid #29c2f4;
        border-right: none;
        border-bottom: none;
        border-radius: 20px;
        position: absolute;
        left: -7px;
        top: -7px;
        z-index: -1;
    }

    .proctor-box:after {
        transform: rotate(180deg);
        left: auto;
        right: -7px;
        top: auto;
        bottom: -7px;
    }

.inside-counter {
    background: #ffff;
    width: 100%;
    padding: 20px;
    border-radius: 14px;
    position: relative;
    z-index: 9;
}

    .inside-counter:before,
    .inside-counter:after {
        content: '';
        height: 20%;
        width: 20%;
        border: 3px solid #29c2f4;
        border-right: none;
        border-top: none;
        border-radius: 10px;
        position: absolute;
        left: -6px;
        border-top-left-radius: 0px;
        border-bottom-right-radius: 0px;
        bottom: -6px;
        z-index: -1;
    }

    .inside-counter:after {
        transform: rotate(180deg);
        left: auto;
        right: -6px;
        top: -6px;
    }

.proctor-box .counter-value {
    font-size: 33px;
    font-weight: 700;
    margin: 0 0 5px;
    display: block;
}

.proctor-box .counter-icon {
    color: #999;
    font-size: 30px;
    margin: 0 0 12px;
}

.proctor-box h3 {
    font-size: 18px;
    font-weight: 600;
    text-transform: capitalize;
    margin: 0;
}



/* Landing Page */

html {
    scroll-behavior: smooth;
}

main.landing-page .header-section .navbar {
    background: #fff;
    z-index: 99;
    position: fixed;
    width: 100%;
}
.header-section button.navbar-toggler {
    padding: 0;
    border: none;
    color: #311e69;
    outline: none;
}

.landing-page .navbar-light .navbar-nav .nav-link {
    color: #000;
    padding: 0;
    margin: 0 30px;
    position: relative;
}

.landing-page .navbar-light .navbar-nav .active .nav-link {
    border-bottom: 3px solid #006aba;
}

    .landing-page .navbar-light .navbar-nav .active .nav-link:after {
        content: '';
        color: #000;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #006aba;
        position: absolute;
        top: 24px;
        right: 35%;
    }

.landing-page .navbar-light .navbar-nav .nav-link:hover {
    border-bottom: 3px solid #006aba;
}

    .landing-page .navbar-light .navbar-nav .nav-link:hover:after {
        content: '';
        color: #000;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #006aba;
        position: absolute;
        top: 24px;
        right: 35%;
    }

.landing-page ul.navbar-nav {
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

main.landing-page .header-section .navbar .btn {
    background: #311e69;
    color: #fff;
    border-radius: 30px;
}

#loginPopup .modal-content {
    background: none;
    border: none;
}

.title-icon-divider {
    display: flex;
    color: #311e69;
    position: relative;
    margin-bottom: 15px;
}

    .title-icon-divider::before {
        content: "...";
        font-size: 37px;
        line-height: 0;
    }

    .title-icon-divider::after {
        content: "...";
        font-size: 37px;
        line-height: 0;
    }

    .title-icon-divider i {
        font-size: 25px;
        margin: 0 10px;
    }

section.about-us {
    /* background: rgb(33,53,139);
    background: linear-gradient(180deg, rgba(33,53,139,1) 0%, rgba(90,126,222,1) 100%); */
    background: #f5f5f5;
}
/* .about-us .about-title {
    font-weight: bold;
    margin-bottom: 20px;
} */
.about-us p {
    color: #444;
    line-height: 26px;
}

.section-title h4 {
    color: #000000;
    margin-bottom: 15px;
    font-size: 45px;
}

.section-title h5 {
    color: #eaaa00;
}

.solutions-section .content-height {
    /*height:250px;*/
}

.solutions-section .request-demo {
    position: absolute;
    bottom: -10px;
}

.solutions-section .tab-content ul li {
    font-size: 13px;
}

.solutions-section .carousel-indicators {
    bottom: -17px;
}

    .solutions-section .carousel-indicators li {
        background: #ebe8e8;
        opacity: 1;
        border: none;
        height: 7px;
    }

        .solutions-section .carousel-indicators li.active {
            background: #eaaa00;
        }

.solutions-section .ribbon-col,
.solutions-section .bg2 .ribbon-col,
.solutions-section .bg3 .ribbon-col {
    background: #311e69;
}

.solutions-section .pool-box .ribbon-col:before {
    background: url(../images/ribbon-bg7.png) left bottom repeat-x;
}

.pool-box .pool-box-inner:before {
    background: url(../images/DBLA.jpg) left center no-repeat;
}

.pool-box .pool-box-inner:after {
    background: url(../images/DBRA.jpg) right center no-repeat;
}

.pool-box .pool-box-inner {
    border: 2px solid #311e69;
}

    .pool-box .pool-box-inner:hover {
        border-bottom: 7px solid #311e69;
    }

.pool-box .pool-icon img {
    animation: animate5 3s linear infinite;
    border-radius: 50%;
}

@keyframes animate5 {
    0% {
        box-shadow: 0 0 0 0 rgb(49, 30, 105, 0.5), 0 0 0 0 rgb(49, 30, 105, 0.5)
    }

    40% {
        box-shadow: 0 0 0 20px rgb(49, 30, 105, 0), 0 0 0 0 rgb(49, 30, 105, 0.5)
    }

    80% {
        box-shadow: 0 0 0 20px rgb(159, 193, 255, 0), 0 0 0 10px rgb(159, 193, 255, 0)
    }

    100% {
        box-shadow: 0 0 0 0 rgb(159, 193, 255, 0), 0 0 0 10px rgb(159, 193, 255, 0)
    }
}

.solutions-section ul.nav-tabs {
    display: flex;
    flex-wrap: wrap;
    border: none;
    padding: 0 80px;
}

    .solutions-section ul.nav-tabs li {
        flex: 0 0 50%;
        height: 150px;
        padding: 0 20px;
        margin-bottom: 35px;
    }

        .solutions-section ul.nav-tabs li a {
            height: 150px;
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            /* background: #311e69; */
            color: #fff;
            font-size: 16px;
            border-radius: 10px;
            margin-bottom: 20px;
            text-decoration: none;
        }
            /* .solutions-section ul.nav-tabs li a span {
    width: 50px;
    height: 50px;
    margin: 0 auto;
    line-height: 50px;
    background: #fff;
    color: #311e69;
    font-size: 22px;
    border-radius: 50px;
    margin-bottom: 10px;
} */
            .solutions-section ul.nav-tabs li a p {
                margin: 0;
            }

            .solutions-section ul.nav-tabs li a .examBox {
                height: 150px;
                margin: 0;
                border-color: #311e69;
            }

                .solutions-section ul.nav-tabs li a .examBox .title {
                    margin: 30px 0 0 0;
                    font-weight: 600;
                }

                .solutions-section ul.nav-tabs li a .examBox::before,
                .solutions-section ul.nav-tabs li a .examBox::after {
                    border-color: #311e69;
                }

                .solutions-section ul.nav-tabs li a .examBox .exam-icon {
                    background: #311e69;
                }

                    .solutions-section ul.nav-tabs li a .examBox .exam-icon::before {
                        background: #311e69;
                    }

                    .solutions-section ul.nav-tabs li a .examBox .exam-icon span:before,
                    .solutions-section ul.nav-tabs li a .examBox .exam-icon span:after {
                        background: #5d4c8e;
                    }

.solutions-section .tab-content h3 {
    color: #000000;
    margin-bottom: 15px;
    line-height: 40px;
    font-weight: 600;
}

.solutions-section ul.nav-tabs li a.active .examBox {
    background: #5d4c8e;
}

    .solutions-section ul.nav-tabs li a.active .examBox .title {
        color: #fff;
    }

    .solutions-section ul.nav-tabs li a.active .examBox .exam-icon {
        background: #fff;
        color: #311e69;
    }

.solutions-section .tab-content ul {
    padding: 0 0 0 18px;
}



section.features-section {
    /* background: url("../images/features-images.png") no-repeat scroll 0 0 / cover; */
    /* background: rgb(33,53,139);
    background: linear-gradient(90deg, #22358b 0%, #4761d4 100%); */
    background: #f5f5f5;
}


.features-inner {
    width: 150px;
    height: 150px;
    background: rgba(255,255,255,0.7);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #21358b;
    font-weight: bold;
    padding: 0 15px;
}

    .features-inner p {
        margin: 0;
        font-size: 15px;
    }

.features-section .card {
    box-shadow: 0 44px 98px 0 rgb(0 0 0 / 12%);
    border: none;
    border-bottom: 3px solid #eaaa00;
}

    .features-section .card p {
        color: #828282;
        line-height: 24px;
    }

/*----- Features Section Start -----*/

.features-section .card {
    min-height: 220px;
    transition: all .5s ease;
    border-bottom: 2px solid #311e69;
}
.features-section .card:hover {
    transform: scale(1.15);
}
.features-section .features-icon {
    position: absolute;
    right: 0;
    top: 70px;
    font-size: 90px;
    transition: all .5s ease;
    color: #311e69;
    opacity: 0.2;
}
.features-section .card:hover .features-icon {
    opacity: 1;
}
.features-section .card h3.features-title {
    font-weight: 600;
    font-size: 18px;
    transition: all .5s ease;
}
.features-section .card p {
    margin: 50px 0 0 0;
    opacity: 0;
    font-size: 12px;
    line-height: 18px;
    transition: all .5s ease;
}
.features-section .card:hover p {
    opacity: 1;
}
.features-section .card:hover h3.features-title {
    font-size: 20px;
    transition: all .5s ease;
}
.features-section .card:hover .features-icon {
    font-size: 65px;
    top: 35px;
    transition: all .5s ease;
}
@media only screen and (max-width:1366px){
    .features-section .card:hover .features-icon{
        top:45px;
        font-size:55px;
    }
    .features-section .card:hover h3.features-title{
        font-size:17px;
    }
}

/*----- Features Section End -----*/

.pillars-section {
    margin-top: 120px;
}

.pillars-container {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    z-index: 2;
}
.home-pillars .pillars-section .left .center i{
    font-size:100px;
}
    .home-pillars .pillars-section .left {
    width: 40%;
    position: sticky;
    top: 15vh;
    left: 0;
    -ms-flex-item-align: start;
    align-self: flex-start;
}

    .home-pillars .pillars-section .left .circle {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 33.125rem;
        height: 33.125rem;
        margin: 0 auto;
    }

        .home-pillars .pillars-section .left .circle .center {
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            width: 16.6875rem;
            height: 16.6875rem;
            padding: 0 1.25rem;
            background: #ffffff;
            border-radius: 100%;
            color: #000000;
            font-size: 1.5em;
            line-height: 31px;
            font-weight: 700;
            text-align: center;
            z-index: 10;
            -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
            -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
            box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.35);
        }

        .home-pillars .pillars-section .left .circle .middleCircle {
            width: 350px;
            height: 350px;
            background: #2460ae;
            z-index: 9;
        }

        .home-pillars .pillars-section .left .circle .middleCircle,
        .home-pillars .pillars-section .left .circle .outerCircle {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
            border-radius: 100%;
        }

        .home-pillars .pillars-section .left .circle .outerCircle {
            width: 300px;
            height: 300px;
            background: #f1f7fc;
            z-index: 8;
        }

        .home-pillars .pillars-section .left .circle .pillars {
            position: absolute;
            top: 0;
            left: 0;
            width: 300px;
            height: 300px;
            padding: 0;
            border-radius: 50%;
            list-style: none;
            z-index: 11;
            -webkit-transition: all .9s cubic-bezier(.65,0,.35,1);
            transition: all .9s cubic-bezier(.65,0,.35,1);
        }

        .home-pillars .pillars-section .left .circle .pillars--single {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            position: absolute;
            top: 50%;
            left: 50%;
            width: 128px;
            height: 128px;
            margin: -64px;
            background: #a9c4db;
            border-radius: 100%;
            -webkit-transition: all .3s;
            transition: all .3s;
            cursor: pointer;
        }

            .home-pillars .pillars-section .left .circle .pillars--single.active {
                background: #311e69;
            }

            .home-pillars .pillars-section .left .circle .pillars--single:first-of-type {
                -webkit-transform: rotate(0deg) translate(265px) rotate(0deg);
                transform: rotate(0deg) translate(265px) rotate(0deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single:nth-of-type(2) {
                -webkit-transform: rotate(51.42857deg) translate(265px) rotate(-51.42857deg);
                transform: rotate(51.42857deg) translate(265px) rotate(-51.42857deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single:nth-of-type(3) {
                -webkit-transform: rotate(102.85714deg) translate(265px) rotate(-102.85714deg);
                transform: rotate(102.85714deg) translate(265px) rotate(-102.85714deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single:nth-of-type(4) {
                -webkit-transform: rotate(154.28571deg) translate(265px) rotate(-154.28571deg);
                transform: rotate(154.28571deg) translate(265px) rotate(-154.28571deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single:nth-of-type(5) {
                -webkit-transform: rotate(205.71429deg) translate(265px) rotate(-205.71429deg);
                transform: rotate(205.71429deg) translate(265px) rotate(-205.71429deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single:nth-of-type(6) {
                -webkit-transform: rotate(257.14286deg) translate(265px) rotate(-257.14286deg);
                transform: rotate(257.14286deg) translate(265px) rotate(-257.14286deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single:nth-of-type(7) {
                -webkit-transform: rotate(308.57143deg) translate(265px) rotate(-308.57143deg);
                transform: rotate(308.57143deg) translate(265px) rotate(-308.57143deg);
            }

            .home-pillars .pillars-section .left .circle .pillars--single span {
                position: relative;
                width: 40px;
                height: auto;
                color: #f6f9fe;
                text-align: center;
                -webkit-transition: all .3s ease-in-out;
                transition: all .3s ease-in-out;
                z-index: 2;
            }

            .home-pillars .pillars-section .left .circle .pillars--single:after {
                content: "";
                position: absolute;
                top: 50%;
                left: 50%;
                -webkit-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
                -webkit-transform-origin: center;
                transform-origin: center;
                width: 0;
                height: 0%;
                opacity: .3;
                border-radius: 100%;
                -webkit-transition: all .3s ease;
                transition: all .3s ease;
                -webkit-transition-delay: .3s;
                transition-delay: .3s;
                z-index: 1;
            }

            .home-pillars .pillars-section .left .circle .pillars--single.active:after {
                width: 120%;
                height: 120%;
            }

            .home-pillars .pillars-section .left .circle .pillars--single span:before {
                font-size: 40px;
            }

.home-pillars .pillars-section .right {
    width: 60%;
    min-height: 80rem;
}

.home-pillars .pillars-section .right--single {
    width: 100%;
    padding: 1rem 1.5625rem;
    text-align: left;
    background: #fff;
    border: 5px solid transparent;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 10px 1px rgba(0,0,0,.025);
    box-shadow: 0 0 10px 1px rgba(0,0,0,.025);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    cursor: pointer;
}

    .home-pillars .pillars-section .right--single.active {
        border: 5px solid #2460ae;
        -webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.25);
        -moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.25);
        box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.25);
    }
   

    .home-pillars .pillars-section .right--single:not(:last-child) {
        margin-bottom: 20px;
    }

    .home-pillars .pillars-section .right--single .icon {
        margin-bottom: .625rem;
        opacity: .2;
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
    }

        .home-pillars .pillars-section .right--single .icon span {
            font-size: 30px;
        }

    .home-pillars .pillars-section .right--single .title {
        opacity: .2;
        -webkit-transition: .3s ease;
        transition: .3s ease;
    }

        .home-pillars .pillars-section .right--single .title h3 {
            font-size: 1.875rem;
            font-weight: 600;
        }

    .home-pillars .pillars-section .right--single .content {
        margin-top: .625rem;
        opacity: .2;
    }

        .home-pillars .pillars-section .right--single .content p {
            margin-bottom: 0;
            font-size: 1.2rem;
            line-height: 1.4;
            color: #00313d;
        }

        .home-pillars .pillars-section .right--single .content > a {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            margin-top: 20px;
            color: #311e69;
            font-weight: 600;
            text-decoration: none;
        }

            .home-pillars .pillars-section .right--single .content > a span {
                margin-left: 7.5px;
                -webkit-transform: scale(.7);
                transform: scale(.7);
            }

    .home-pillars .pillars-section .right--single.active .content,
    .home-pillars .pillars-section .right--single.active .icon,
    .home-pillars .pillars-section .right--single.active .title {
        opacity: 1;
    }




section.conduct-exam-section {
    /*background: url("../images/conduct-exam-bg.png") no-repeat scroll 0 0 / 100% 100%;*/
    background-image: linear-gradient(to right, #22368d, #2c409e, #354bb0, #3e56c2, #4761d4);
    -webkit-clip-path: polygon(100% 2%, 100% 100%, 0 100%, 0 7%);
    clip-path: polygon(100% 2%, 100% 100%, 0 100%, 0 7%);
    padding: 100px 0px 30px 0;
}

    section.conduct-exam-section h5 {
        color: #ffffff;
        font-size: 30px;
        font-weight: bold;
    }

    section.conduct-exam-section p {
        width: 75%;
        margin: 20px auto 30px;
        font-size: 28px;
        font-weight: bold;
    }

.conduct-exam-section .form-control {
    color: #262626;
    border: 1px solid #e0e0e0;
    padding: 0.47rem 0.75rem;
    height: 38px;
    font-size: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
}

.conduct-exam-section textarea.form-control {
    height: 80px;
}
.accordion .card-header button.btn::after {
    content: "";
    border: solid #311e69;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
    position: absolute;
    right: 10px;
    top: 35%;
    transform: rotate(-135deg) translateY(-50%);
    -webkit-transform: rotate(-135deg) translateY(-50%);
}
.accordion > .card button.btn.collapsed::after {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.accordion > .card {
    margin-bottom: 0;
    box-shadow: none;
}
section.conduct-exam-section .accordion {
    margin-bottom: 20px;
}
.accordion .card-header button.btn {
    box-shadow: none;
    font-size: 14px;
    color: #311e69;
    padding: 10px;
}
.accordion button.speakPopup {
    color: #fff;
    border-radius: 50%;
    height: 80px;
    width: 80px;
    text-align: center;
    padding: 20px;
    border: 2px solid #311e69;
    box-shadow: none;
}
.accordion button.speakPopup.speakPopupSelected {
    background: #311e69;
}
.accordion button.speakPopup img {
    width: 100%;
}
.accordion > .card .form-group {
    margin: 15px 0 0 0;
}
.flex-1 {
    flex: 1;
}
.btn-common {
    background: #311e69;
    color: #fff;
    border-radius: .25rem;
    font-size: 14px;
    height: 37px;
}
.speakPopup button.close {
    right: -10px;
    top: -10px;
    background: #fff;
    opacity: 1;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    z-index: 11;
    border: 1px solid #ccc;
    color: #555;
}
.speakPopup button.close:hover,
.speakPopup button.close:focus {
    opacity: 1 !important;
    outline: none;
}
.translate select#inputLang {
    width: 100% !important;
}
section.conduct-exam-section .resultText p {
    width: auto;
    color: #333;
    font-size: 14px;
    font-weight: 3;
    margin: 0;
}
.speakPopup .select-client-btn {
    padding: 0;
    transform: unset;
    margin: 0 0 15px 0;
}
.speakPopup .button-text {
    width: auto;
    margin: 0 auto;
    float: none;
}
.speakPopup .button-text span {
    font-size: 20px !important;
}
.speakPopup .select-client-btn {
    padding: 0;
    transform: unset;
    margin: 0;
    width: auto;
    background: none;
    height: auto;
    box-shadow: none;
}
.speakPopup .button-text span {
    font-size: 20px !important;
    color: #333 !important;
}
.timer-button button.time {
    background: #311e69;
    color: #fff;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    font-size: 45px;
}
a.useKeyboard:hover {
    color: #fff;
}
.speakPopup .modal-dialog {
    margin: 0 auto;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.translate label {
    color: #333;
}
.voice-kayboard {
    background: #f1f1f1;
    border-radius: 15px;
    text-align: center;
    padding: 20px 0;
    border: 1px solid #ddd;
}
.voice-kayboard .voice-kayboard-title {
    color: #333;
    font-size: 14px;
}
.conduct-exam-section .useKeyboardInput textarea.form-control {
    height: auto;
    min-height: 170px;
}
.resultText {
    color: #000;
}

.request-demo {
    background: #311e69;
    color: #fff;
    font-weight: 600;
    padding: 3px 30px;
    border-radius: 50px;
}

.request-demo:hover {
    color: #fff;
}

.landing-page-footer {
    background: #f1f1f1;
}

    .landing-page-footer p {
        margin: 10px 0;
    }

section.faq-section .accordion .card {
    box-shadow: none;
    border: none;
    overflow: visible;
}

    section.faq-section .accordion .card .card-header {
        background: none;
        border: none;
        padding: 0;
    }

        section.faq-section .accordion .card .card-header button.btn {
            text-decoration: none;
            background: none;
            color: #21358b;
            padding: 10px 30px 10px 70px;
            border-radius: 40px;
            position: relative;
            border: 2px solid #21358b;
        }

            section.faq-section .accordion .card .card-header button.btn.collapsed {
                background: #21358b;
                color: #fff;
            }

            section.faq-section .accordion .card .card-header button.btn:focus {
                outline: none;
                box-shadow: none;
            }

section.faq-section .accordion button.btn .accordion-count {
    position: absolute;
    left: -2px;
    background: #3959b9;
    top: -8px;
    width: 60px;
    height: 60px;
    display: flex;
    color: #fff;
    border-radius: 40px;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.4);
}

#myBtn {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    font-size: 18px;
    border: none;
    outline: none;
    background-color: #311e69;
    color: white;
    cursor: pointer;
    border-radius: 50px;
    width: 40px;
    height: 40px;
}

#loginPopup .white-bg {
    background-size: 100% 100%;
    max-width: 100%;
    flex: 0 0 100%;
}

#loginPopup .form-control {
    padding: 0 10px;
}

#loginPopup .form-group {
    margin-bottom: 10px;
}

#loginPopup .bot-text {
    margin-top: 0;
    border: none;
}

#loginPopup .close {
    position: absolute;
    right: -20px;
    top: -15px;
    z-index: 11;
    background: #311e69;
    opacity: 1;
    color: #fff;
    box-shadow: none;
    text-shadow: none;
    width: 35px;
    height: 35px;
    border-radius: 50px;
    color: #311e69;
    background: #fff;
    border: 3px solid #311e69;
}

#loginPopup .modal-dialog {
    max-width: 1000px;
    min-height: 100vh;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.light_logo {
    width: 120px;
    position: absolute;
    bottom: 0;
    right: 5%;
    opacity: .3;
}

input:-webkit-autofill {
    background-color: transparent;
}

/*loader code*/

.loader-container {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 99999;
}

.lds-roller {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
    left: 46%;
    top: 46%;
}

.lds-roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
}

.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    margin: -4px 0 0 -4px;
}

.lds-roller div:nth-child(1) {
    animation-delay: -0.036s;
}

.lds-roller div:nth-child(1):after {
    top: 63px;
    left: 63px;
}

.lds-roller div:nth-child(2) {
    animation-delay: -0.072s;
}

.lds-roller div:nth-child(2):after {
    top: 68px;
    left: 56px;
}

.lds-roller div:nth-child(3) {
    animation-delay: -0.108s;
}

.lds-roller div:nth-child(3):after {
    top: 71px;
    left: 48px;
}

.lds-roller div:nth-child(4) {
    animation-delay: -0.144s;
}

.lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
}

.lds-roller div:nth-child(5) {
    animation-delay: -0.18s;
}

.lds-roller div:nth-child(5):after {
    top: 71px;
    left: 32px;
}

.lds-roller div:nth-child(6) {
    animation-delay: -0.216s;
}

.lds-roller div:nth-child(6):after {
    top: 68px;
    left: 24px;
}

.lds-roller div:nth-child(7) {
    animation-delay: -0.252s;
}

.lds-roller div:nth-child(7):after {
    top: 63px;
    left: 17px;
}

.lds-roller div:nth-child(8) {
    animation-delay: -0.288s;
}

.lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12px;
}

@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


@media only screen and (max-width: 1199px) {
    #loginPopup {
        padding: 20px !important;
    }
}
@media only screen and (max-width: 991px) {
    .landing-page .navbar-light .navbar-nav .nav-link {
        margin: 0 10px;
    }
    .about-us .section-title {
        margin-top: 30px;
    }
    .about-us .section-title h4 br {
        display: none;
    }
    .about-us .section-title h4 {
        font-size: 30px;
    }
    .about-us .section-title h5 {
        font-size: 15px;
    }
    .solutions-section .request-demo {
        position: relative;
        bottom: auto;
    }
    .solutions-section .solutions-content {
        order: 2;
    }
    .solutions-section .solutions-tabs {
        order: 1;
    }
    section.conduct-exam-section {
        background: #311e69;
        padding: 30px 0;
    }
    .voice-kayboard {
        margin-top: 20px;
    }
    .select-client-btn .button-text {
        margin: 0 auto;
        float: none;
    }
    .select-client-btn {
        text-align: center;
        background: none;
    }
    .voice-kayboard .voice-kayboard-title {
        margin: 0 !important;
    }
    section.conduct-exam-section .request-demo {
        background: #fff;
        color: #311e69;
        padding: 7px 20px;
    }
    .features-section .features-icon {
        position: relative;
        top: auto;
        font-size: 50px;
        opacity: 1;
    }
    .features-section .card:hover {
        transform: scale(1);
    }
    .features-section .card:hover .features-icon {
        top: auto;
        font-size: 50px;
    }
    .features-section .card p {
        opacity: 1;
        margin: 0;
    }
    .features-section .card {
        min-height: auto;
    }
}

@media only screen and (max-width: 767px) {
    .header-section .navbar {
        padding: 10px;
    }
    .header-section .navbar .navbar-collapse {
        position: absolute;
        width: 100%;
        top: 52px;
        left: 0;
        right: 0;
        background: #fff;
    }
    .header-section .navbar ul.navbar-nav {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }
    .header-section .navbar ul.navbar-nav li {
        width: 100%;
        text-align: left;
    }
    .header-section .navbar ul.navbar-nav li a.nav-link {
        margin: 0;
        padding: 10px 10px;
        border-bottom: 1px solid #ddd;
    }
    .header-section .navbar ul.navbar-nav li.active a.nav-link {
        border-bottom: 1px solid #ddd;
    }
    .header-section .navbar ul.navbar-nav li.active a.nav-link {
        border-bottom: 1px solid #ddd;
        background: #eee;
    }
    .landing-page .navbar-light .navbar-nav .active .nav-link:after {
        opacity: 0;
        visibility: hidden;
        border: none;
    }
    .solutions-section ul.nav-tabs {
        width: 100%;
        padding: 0;
    }
    .solutions-section ul.nav-tabs li a {
        height: auto;
        margin: 0 0 15px 0;
    }
    .solutions-section ul.nav-tabs li a .examBox {
        height: auto;
        padding: 0;
    }
    .solutions-section ul.nav-tabs li a .examBox::before, 
    .solutions-section ul.nav-tabs li a .examBox::after {
        opacity: 0;
        visibility: hidden;
        width: 0;
        height: 0;
        border: none;
    }
    .solutions-section ul.nav-tabs li a .examBox .exam-icon {
        display: none;
    }
        .solutions-section ul.nav-tabs li {
            height: auto;
            margin: 0;
            padding: 0 5px;
        }
    .solutions-section ul.nav-tabs li a .examBox .title {
        margin: 0;
        font-size: 14px;
    }
    .solutions-section ul.nav-tabs li a .examBox {
        height: 60px;
        padding: 0;
        border: 1px solid #311e69;
        display: flex;
        align-items: center;
        width: 100%;
        justify-content: center;
        border-radius: 5px;
    }
    .solutions-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .solutions-section .tab-content h3 {
        font-size: 20px;
        line-height: 25px;
    }
    section.conduct-exam-section h5 {
        font-size: 20px;
    }
    section.about-us {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    section.about-us .container {
        max-width: 100%;
    }
}

#TrainingloginPopup .modal-content {
    background: none;
    border: none;
}
#TrainingloginPopup .white-bg {
    background-size: 100% 100%;
    max-width: 100%;
    flex: 0 0 100%;
}

#TrainingloginPopup .form-control {
    padding: 0 10px;
}

#TrainingloginPopup .form-group {
    margin-bottom: 10px;
}

#TrainingloginPopup .bot-text {
    margin-top: 0;
    border: none;
}

#TrainingloginPopup .close {
    position: absolute;
    right: -20px;
    top: -15px;
    z-index: 11;
    background: #311e69;
    opacity: 1;
    color: #fff;
    box-shadow: none;
    text-shadow: none;
    width: 35px;
    height: 35px;
    border-radius: 50px;
    color: #311e69;
    background: #fff;
    border: 3px solid #311e69;
}

#TrainingloginPopup .modal-dialog {
    max-width: 1000px;
    min-height: 100vh;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.banner .banner-image {
    background: url('../images/iknow-banner.jpg') left top no-repeat !important;
    height: 472px;
    background-size: 100% auto !important;
}

.navbar-brand .landingPage-logo {
    background: url('../images/logo-dark-blue.png') left top no-repeat !important;
    height: 30px !important;
    width: 110px !important;
}

.white-bg .login-logo {
    background: url('../images/ikonw-login.png') left top no-repeat !important;
    height: 30px !important;
    width: 110px !important;
    margin-left: 30px;
}