/********** Template CSS **********/
@import url('style.css');
:root {
    --primary: #06BBCC;
    --light: #F0FBFC;
    --dark: #181d38;
}


.fw-medium {
    font-weight: 600 !important;
}

.fw-semi-bold {
    font-weight: 700 !important;
}

.back-to-top {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 45px;
    z-index: 99;
}
/*@media (max-width:991.98px) {
    .logo{
        padding-left:0px;
    }
}*/
@media (max-width:991.98px) {
    .navbar-brand {
        margin-right:0px;
    }
    .logo{
        padding-left:0px;
    }
}

.line{
    text-align:justify;
}
   
   

    /*.navbar-brand {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
    .dropdown{
        display:block;
        position:absolute;
        
       
        
    }
.dropdown-item a{
    display:inline-block;
    position:relative;
    cursor:pointer;
}
.nav-item dropdown1 {
    display: none;
}
.nav-item dropdown a :hover .nav-item dropdown1 {
    position: absolute;
    top: 0;
    left: 200px;
    display: block;
    background-color:white;
    
}
.dropdown-item1 {
    position: absolute;
    left: 150px;
    background-color: white;
}
.fa {
    float: right;
    margin-left: 10px;
    padding-top: 3px;
}*/
.dropdown-menu{
    display:block;
    position:absolute;
    left:50px;
    top:10px;
}

.dropdown-item + .dropdown-menu {
    display: none !important;
}

.dropdown-item:hover + .dropdown-menu {
    display: block !important;
}


/*** Spinner ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

        #spinner.show {
            transition: opacity .5s ease-out, visibility 0s linear 0s;
            visibility: visible;
            opacity: 1;
        }


    /*** Button ***/
    .btn {
        font-family: 'Nunito', sans-serif;
        font-weight: 600;
        transition: .5s;
    }

        .btn.btn-primary,
        .btn.btn-secondary {
            color: #FFFFFF;
        }

    .btn-square {
        width: 38px;
        height: 38px;
    }

    .btn-sm-square {
        width: 32px;
        height: 32px;
    }

    .btn-lg-square {
        width: 48px;
        height: 48px;
    }

    .btn-square,
    .btn-sm-square,
    .btn-lg-square {
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: normal;
        border-radius: 0px;
        
    }
.dropdown-menu{
    display:none;
}
.dropdown-menu {
    display: block;
    position: absolute;
}
    /*** Navbar ***/
    /*#navbarCollapse{
    padding-top:1%;
}*/
    .navbar .dropdown-toggle::after {
        border: none;
        content: "\f107";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        vertical-align: middle;
        margin-left: 8px;
    }

    .navbar-light .navbar-nav .nav-link {
        margin-right:15px;
        padding: 0px;
        color: #FFFFFF;
        font-size: 15px;
        text-transform: uppercase;
        outline: none;
    }

        .navbar-light .navbar-nav .nav-link:hover,
        .navbar-light .navbar-nav .nav-link.active {
            color: var(--primary);
        }
    /*@media (max-width: 991.98px) {
        .schooltop{
           display:flex;
        }*/

        @media (max-width: 991.98px) {
            .navbar-light .navbar-nav .nav-link {
                margin-right: 0;
                padding: 10px 0;
            }

            .navbar-light .navbar-nav {
                border-top: 1px solid #EEEEEE;
            }
        }

        .navbar-light .navbar-brand,
        .navbar-light a.btn {
            height: 75px;
        }

        .navbar-light .navbar-nav .nav-link {
            color: var(--dark);
            font-weight: 500;
        }

        .navbar-light.sticky-top {
            top: -100px;
            transition: .5s;
        }

        @media (min-width: 992px) {
            .navbar .nav-item .dropdown-menu {
                display: block;
                margin-top: 0;
                opacity: 0;
                visibility: hidden;
                transition: .5s;
            }

            .navbar .dropdown-menu.fade-down {
                top: 100%;
                transform: rotateX(-75deg);
                transform-origin: 0% 0%;
            }

            .navbar .nav-item:hover .dropdown-menu {
                top: 100%;
                transform: rotateX(0deg);
                visibility: visible;
                transition: .5s;
                opacity: 1;
            }
        }

        .logo {
            height: 58px;
            /*padding-left: 58px;*/
        }

        .gallery {
            height: 270px;
        }

        .about {
            border: 2px solid #06BBCC;
            height: 231px;
        }

        .pri {
            height: 314px;
        }

        .Safe {
            height: 400px;
            width: 1116px;
            margin-top: 10px;
        }

        .form-group {
            height: 60px !important;
            width: 347px !important;
        }
        /*.First {
    text-align: center;
    color: #06BBCC;
}*/
        /*** Header carousel ***/
        @media (max-width: 768px) {
            .header-carousel .owl-carousel-item {
                position: relative;
                min-height: 500px;
            }

                .header-carousel .owl-carousel-item img {
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
        }

        .header-carousel .owl-nav {
            position: absolute;
            top: 50%;
            right: 8%;
            transform: translateY(-50%);
            display: flex;
            flex-direction: column;
        }

            .header-carousel .owl-nav .owl-prev,
            .header-carousel .owl-nav .owl-next {
                margin: 7px 0;
                width: 45px;
                height: 45px;
                display: flex;
                align-items: center;
                justify-content: center;
                color: #FFFFFF;
                background: transparent;
                border: 1px solid #FFFFFF;
                font-size: 22px;
                transition: .5s;
            }

                .header-carousel .owl-nav .owl-prev:hover,
                .header-carousel .owl-nav .owl-next:hover {
                    background: var(--primary);
                    border-color: var(--primary);
                }

        .page-header {
            background: linear-gradient(rgba(24, 29, 56, .7), rgba(24, 29, 56, .7)), url('../img/Slider1_jps_Academy.jpg');
            background-position: center  30%;
            background-repeat: no-repeat;
            background-size: cover;
        }

        .page-header-inner {
            background: rgba(15, 23, 43, .7);
        }

        .breadcrumb-item + .breadcrumb-item::before {
            color: var(--light);
        }

        .icon {
            font-size: 54px;
            color: #06BBCC;
        }

        .box {
            box-sizing: border-box;
        }

        .head {
            font-size: 25px;
            font-weight: bold;
            text-align: center;
            color: #06BBCC;
        }

        .tab {
            background-color: #06BBCC;
            color: black;
        }

        .hour {
            padding-left: 1rem !important;
        }

        /*** Section Title ***/
        .section-title {
            position: relative;
            display: inline-block;
            text-transform: uppercase;
        }

            .section-title::before {
                position: absolute;
                content: "";
                width: calc(100% + 80px);
                height: 2px;
                top: 4px;
                left: -40px;
                background: var(--primary);
                z-index: -1;
            }

            .section-title::after {
                position: absolute;
                content: "";
                width: calc(100% + 120px);
                height: 2px;
                bottom: 5px;
                left: -60px;
                background: var(--primary);
                z-index: -1;
            }

            .section-title.text-start::before {
                width: calc(100% + 40px);
                left: 0;
            }

            .section-title.text-start::after {
                width: calc(100% + 60px);
                left: 0;
            }


        /*** Service ***/
        .sec {
        }

        .service-item {
            background: var(--light);
            transition: .5s;
            height: 270px;
            text-align: justify;
        }

            .service-item:hover {
                margin-top: -10px;
                background: var(--primary);
            }

            .service-item * {
                transition: .5s;
            }

            .service-item:hover * {
                color: var(--light) !important;
            }


        /*** Categories & Courses ***/
        .category img,
        .course-item img {
            transition: .5s;
        }

        .category a:hover img,
        .course-item:hover img {
            transform: scale(1.1);
        }


        /*** Team ***/
        .team-item img {
            transition: .5s;
        }

        .team-item:hover img {
            transform: scale(1.1);
        }


        /*** Testimonial ***/
        .testimonial-carousel::before {
            position: absolute;
            content: "";
            top: 0;
            left: 0;
            height: 100%;
            width: 0;
            background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
            z-index: 1;
        }

        .testimonial-carousel::after {
            position: absolute;
            content: "";
            top: 0;
            right: 0;
            height: 100%;
            width: 0;
            background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
            z-index: 1;
        }

        @media (min-width: 768px) {
            .testimonial-carousel::before,
            .testimonial-carousel::after {
                width: 200px;
            }
        }

        @media (min-width: 992px) {
            .testimonial-carousel::before,
            .testimonial-carousel::after {
                width: 300px;
            }
        }

        .testimonial-carousel .owl-item .testimonial-text,
        .testimonial-carousel .owl-item.center .testimonial-text * {
            transition: .5s;
        }

        .testimonial-carousel .owl-item.center .testimonial-text {
            background: var(--primary) !important;
        }

            .testimonial-carousel .owl-item.center .testimonial-text * {
                color: #FFFFFF !important;
            }

        .testimonial-carousel .owl-dots {
            margin-top: 24px;
            display: flex;
            align-items: flex-end;
            justify-content: center;
        }

        .testimonial-carousel .owl-dot {
            position: relative;
            display: inline-block;
            margin: 0 5px;
            width: 15px;
            height: 15px;
            border: 1px solid #CCCCCC;
            transition: .5s;
        }

            .testimonial-carousel .owl-dot.active {
                background: var(--primary);
                border-color: var(--primary);
            }


        /*** Footer ***/
        .bottom {
            display: flex;
            justify-content: flex-start;
            height: 67px;
        }

        .first {
            color: #40c6df;
            font-size: 31px;
            margin-top: 30px;
            margin-left: 14px;
        }

        @media (min-width: 430px) {
            .first {
                font-size: 23px;
                margin-top: 18px;
            }
        }

        @media (max-width: 430px) {
            .expert {
                width: 400px;
            }
        }


        .footer .btn.btn-social {
            margin-right: 5px;
            width: 35px;
            height: 35px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--light);
            font-weight: normal;
            border: 1px solid #FFFFFF;
            border-radius: 35px;
            transition: .3s;
        }

            .footer .btn.btn-social:hover {
                color: var(--primary);
            }

        .footer .btn.btn-link {
            display: block;
            margin-bottom: 5px;
            padding: 0;
            text-align: left;
            color: #FFFFFF;
            font-size: 15px;
            font-weight: normal;
            text-transform: capitalize;
            transition: .3s;
        }

            .footer .btn.btn-link::before {
                position: relative;
                content: "\f105";
                font-family: "Font Awesome 5 Free";
                font-weight: 900;
                margin-right: 10px;
            }

            .footer .btn.btn-link:hover {
                letter-spacing: 1px;
                box-shadow: none;
            }

        .footer .copyright {
            padding: 25px 0;
            font-size: 15px;
            border-top: 1px solid rgba(256, 256, 256, .1);
            text-align: center !important;
        }

            .footer .copyright a {
                color: var(--light);
            }

        .footer .footer-menu a {
            margin-right: 15px;
            padding-right: 15px;
            border-right: 1px solid rgba(255, 255, 255, .1);
        }

            .footer .footer-menu a:last-child {
                margin-right: 0;
                padding-right: 0;
                border-right: none;
            }