﻿
.btn1, .btn2, .btn3, .btn4,.btn5, .btn6 {color:#fff; transition: 1s; border-radius:50px;}
.btn1{background: linear-gradient(45deg, #3d81f6, #883deb);}
.btn2{background: linear-gradient(45deg, #e94c99, #f38f40);}
.btn3{background: linear-gradient(45deg, #e64fa0, #8f3ce4);}
.btn4{background: linear-gradient(45deg, #e94c99, #f38f40);}
.btn5{background: linear-gradient(135deg, #3182ed, #6b26d9);}
.btn6{background: #ffffff1a; border: 2px solid #ffffff4d;}
.btn1:hover, .btn2:hover, .btn3:hover, .btn4:hover,.btn5:hover, .btn6:hover 
{color:#fff; transform: scale(1.04); transition: .5s;}

.bannerOverlay{background-image: linear-gradient(135deg, #3182ed 0%, #6b26d9 50%, #f97415 100%);
    width: 100%; height: 100%; position: absolute; top: 0; z-index: 1; opacity: 0.85;}
.textGradient {background: linear-gradient(90deg, #f97a17, #FFEB3B); display: inline-block; 
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}

.Mainheading {font-size: 45px; line-height: 1.2; font-weight: 700; margin-bottom: 24px;}
.Subheading {font-size: 18px; line-height: 28px; color:#000;}
.btn-check:focus + .btn, .btn:focus {outline: 0; box-shadow: 0 0;}
button, a.btn, .orange-btn, .transparent-btn, .darkred-btn {transition: 1s;}
button:hover, a.btn:hover, .orange-btn:hover, .transparent-btn:hover, .darkred-btn:hover {
    transform: scale(1.04);  transition: .5s;}
.card:hover {transition: all .5s;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;}
/*Banner*/
.HomeBannerN1 {background-image: url(../../assets/images/home1/hero-robotics-banner.webp);
    position: relative; background-size: cover; background-position: center;}

.HomeBannerN1:has(.carousel-item.NewBannerHomeBannerN1.active) {
    background-image: url(../../assets/images/Home/newhome/mapBanner1.webp) !important;
}
.HomeBannerN1:has(.carousel-item.NewBannerHomeBannerN1.active) .HomeBannerN1Overlay {
    display:none;
}
.HomeBannerN1 .HomeBannerN4B .HomeBannerN1BTxt{width: 100%; left: 3%;}
.HomeBannerN1 .HomeBannerN4B .HomeBannerN1BTxt img{width: 610px; visibility: hidden;}
.HomeBannerN1 .HomeBannerN4B .HomeBannerN1BTxt h1 {font-size: 40px; text-align:start;
    -webkit-text-fill-color: #ffffff; text-shadow: 2px 2px 10px #000000;}

.HomeBannerN1 .HomeBannerN1Overlay{background-image: linear-gradient(135deg, #3182ed 0%, #6b26d9 50%, #f97415 100%);
    width: 100%; height: 100%; position: absolute; top: 0; z-index: 1; opacity: 0.85;}
.HomeBannerN1 .container-fluid{position:relative; z-index:2; padding: 0px 12px;}
.HomeBannerN1 .HomeBannerN1B svg{width: 100% !important;}
.HomeBannerN1 .HomeBannerN1B .HomeBannerN1img1{width: 173px; margin-left: 20%;}
.HomeBannerN1 .HomeBannerN1B .HomeBannerN1img2, 
.HomeBannerN1 .HomeBannerN1B .HomeBannerN1img3{width: 752px;}
.HomeBannerN1 .HomeBannerN1B{display: flex; align-items: flex-start; justify-content: space-between;}
.HomeBannerN1 .HomeBannerN1BTxt{position: relative; right: 8%; width: 42%; text-align: center;}
.HomeBannerN1 .HomeBannerN1BTxt h1{background: linear-gradient(90deg, #f97a17, #FFEB3B); display: block;
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; 
    letter-spacing: -1px; font-size:34px;}
.HomeBannerN1 .HomeBannerN1BTxt p{color: #fff; font-size: 22px; line-height: 30px;}
.HomeBannerN1 .carousel-indicators{width: 42%; right: 8%; left: auto; margin-right: 0%; margin-left: 0%; margin-bottom:0px;}
.HomeBannerN1 .carousel-indicators [data-bs-target]{height: 15px; width: 15px; border-radius: 50%;}

.HomeBannerN1 .HomeBannerN1B.HomeBannerN1NB .HomeBannerN1BTxt{margin-top: 4%;} 

/*.HomeBannerN1 .HomeBannerN1B1{display: flex; align-items: center; padding-left:12%; margin:10px 0px;}
.HomeBannerN1 .HomeBannerN1B1 h1{font-size: 2.25rem; line-height: 2.5rem; font-weight:700; color:#fff;
    margin-bottom:15px;}
.HomeBannerN1 .HomeBannerN1B1 h1 strong{background: linear-gradient(90deg, #f97a17, #f8b82c); display:block; 
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;}
.HomeBannerN1 .HomeBannerN1B1 p{color:#fff; font-size:18px;}
.HomeBannerN1 .HomeBannerN1B1 h6{color:#facc15; font-size: .875rem; line-height: 1.25rem; margin-bottom:12px;}
.HomeBannerN1 .HomeBannerN1B1 dotlottie-wc{width:400px; height:400px; margin-left:20px;}
.HomeBannerN1 .HomeBannerN1B1 span{display:block;}*/
/*.HomeBannerN1 .HomeBannerN1B2{display: flex; align-items: center;}
.HomeBannerN1 .HomeBannerN1B2 img{width:550px;}
.HomeBannerN1 .HomeBannerN1B2 {position:relative;}
.HomeBannerN1 .HomeBannerN1B2 img{width: 752px;}
.HomeBannerN1 .HomeBannerN1B2 .HomeBannerN1B2Txt{position: absolute; top: 5%; right: 10%;}
.HomeBannerN1 .HomeBannerN1B2 h2{font-size: 65px; font-weight: 800; display: inline-block;
    text-align: center; line-height: 55px;}
.HomeBannerN1 .HomeBannerN1B2 h2 span{display: block; font-size: 20px; font-weight: 600; line-height: 20px;}
.HomeBannerN1 .HomeBannerN1B2 sub{font-size: 55px; font-weight: 800; display: inline-block;
    text-align: center; line-height: 45px;}
.HomeBannerN1 .HomeBannerN1B2 sub span{display: block; font-size: 18px; font-weight: 600; 
        line-height: 18px;}*/


/*Form*/

.TrialFormBoxNN1{position:relative; width: 92%; margin-top:50px;}
.TrialFormBoxNN1 ul.nav{width: 100%; display: flex; justify-content: space-between;
    position: absolute; top: 0px; left: 0; z-index:1;}
.TrialFormBoxNN1 ul.nav label.btn {color: #fff; font-size: 14px; border-radius: 25px 25px 0px 0px;
    padding: 10px 5px 25px 5px; font-weight: 500;}
.TrialFormBoxNN1 .nav-pills .nav-link.active, .TrialFormBoxNN1 .nav-pills .nav-link:hover, 
.TrialFormBoxNN1 .nav-pills .show > .nav-link, .TrialFormBoxNN1 .nav-pills .show > .nav-link:hover {
    background: #fffffff2; color: #000;}

.TrialFormN1{background:#fffffff2; border-radius: 1rem; padding: 1.5rem; 
    margin:40px 0px 50px 0px; position:relative; z-index:2;}

/*.TrialFormN1{width: 92%; background:#fffffff2; border-radius: 1rem; padding: 1.5rem; margin:50px 0px;}
.TrialFormN1 ul.nav{width: 100%; display: flex; justify-content: space-between; margin-bottom: 15px;}*/

.TrialFormN1 ul.nav li.nav-item{text-align: center;}

/*.TrialFormN1 .nav-pills .nav-link.active, .TrialFormN1 .nav-pills .nav-link:hover, 
.TrialFormN1 .nav-pills .show > .nav-link, .TrialFormN1 .nav-pills .show > .nav-link:hover {
    outline: 5px solid; outline-color: #dddddd; outline-offset: 4px;}*/

/*.TrialFormN1 ul.nav label.btn{color:#fff; font-size: .75rem; line-height: 1rem; border-radius: 50px;
    min-width: 125px; padding: 6px 10px;}*/

.TrialFormBoxNN1 ul.nav .nav-item .btnTextF1{display: inline-block; font-size: 11px; font-weight: 600;
    line-height: 13px; letter-spacing: -.5px; text-align: center; margin-top: 10px;}
.TrialFormBoxNN1 .btnRobo.nav-link{background: linear-gradient(45deg, #f36fb4, #ec4a9b);}
.TrialFormBoxNN1 .btnDebate.nav-link{background: linear-gradient(45deg, #e94c99, #f38f40);}
.TrialFormBoxNN1 .btnAdm.nav-link{background: linear-gradient(45deg, #3d81f6, #883deb);}
.TrialFormBoxNN1 h3{color:#1f2937; font-size: 1.25rem; line-height: 1.75rem; text-align:center;
    margin-bottom: 1rem;}
.TrialFormN1 .TrialFormN1Box, .TrialFormN1 .TrialFormN1Footer{margin-bottom:10px; position:relative;}
.TrialFormN1 .TrialFormN1Box label{color: #000; font-size: .75rem; line-height: 1rem;}
.TrialFormN1 .TrialFormN1Box label.error, .TrialFormN1 .TrialFormN1Footer label.error{font-size: 10px; 
    position: absolute; bottom: -14px;}
.TrialFormN1 .TrialFormN1Box .form-control, .TrialFormN1 .TrialFormN1Box .form-select{margin: .25rem 0px;
    font-size: .875rem; height: 2rem; line-height: 1.25rem; border:1px #d1d5db solid; 
    border-radius:.75rem;}
.TrialFormN1 .TrialFormN1Box .iti{margin: .25rem 0px; font-size: .875rem;}
.TrialFormN1 .TrialFormN1Box .iti .iti__selected-flag{background: #f9fafb; border-radius: .75rem 0px 0px .75rem;
    border-right:1px #d1d5db solid;}
.TrialFormN1 .TrialFormN1Footer label, .TrialFormN1 .TrialFormN1Footer a{font-size: 11.5px; line-height: 1rem; letter-spacing: -.5px;}
.TrialFormN1 .TrialFormN1Footer .form-check-input {border-radius: 50%; width: 15px; height: 15px;
    margin: 0px; border: 1px #1b7dff solid;}
/*@media (min-width: 1200px) {
    .HomeBannerN1{zoom: 80%;}
}
@media (max-width: 1350px) {
    .HomeBannerN1{zoom: 80%;}
}*/

@media (max-width:968px) {
    /*.HomeBannerN1 .HomeBannerN1B1 {padding: 3% 5%;}
    .HomeBannerN1 .HomeBannerN1B1 h1{font-size: 24px; line-height: 24px;}
    .HomeBannerN1 .HomeBannerN1B1 dotlottie-wc{display:none;}
    .HomeBannerN1 .HomeBannerN1B1 span{display: contents;}
    .HomeBannerN1 .HomeBannerN1B2 .HomeBannerN1B2Txt {position: relative; bottom: auto; right: auto;
        zoom: 60%; padding: 15% 5%;}
    .HomeBannerN1 .HomeBannerN1B2 img {display:none;}*/
    .TrialFormBoxNN1 {width: 100%; margin: auto; margin-top: 20px;}
    .HomeBannerN1 .HomeBannerN1B .HomeBannerN1img1, .HomeBannerN1 .HomeBannerN1B .HomeBannerN1img2,
    .HomeBannerN1 .HomeBannerN1B .HomeBannerN1img3, .HomeBannerN1 #animation-container{display:none;}
    .HomeBannerN1 .HomeBannerN1B svg {display:none !important;}
    .HomeBannerN1 .HomeBannerN1BTxt {right: 0%; width: 100%; padding: 20px;}
    .HomeBannerN1 .HomeBannerN1BTxt h1 {font-size: 22px; line-height: 30px;}
    .HomeBannerN1 .HomeBannerN1BTxt p {font-size: 14px; line-height: 22px;}
    .HomeBannerN1 .carousel-item {top:0% !important;}   
    .TrialFormN1Box {justify-content: center;}
    .TrialFormN1 {width: 100%; margin: 35px 0px 20px 0px; padding: 20px 20px;}
    .TrialFormN1 .nav-pills .nav-link.active, .TrialFormN1 .nav-pills .nav-link:hover, 
    .TrialFormN1 .nav-pills .show > .nav-link, .TrialFormN1 .nav-pills .show > .nav-link:hover {
        outline: 3px solid; outline-color: #dddddd; outline-offset: 3px;}

    .HomeBannerN1 .HomeBannerN1B {align-items: flex-start; min-height: 355px;}
    .HomeBannerN1 .carousel-indicators{width: 100%; right: 0%; left: 0%;}
    .HomeBannerN1 .carousel-indicators [data-bs-target]{height: 15px; width: 15px;}
    .btn-lg{font-size:16px;}

    .HomeBannerN1:has(.carousel-item.NewBannerHomeBannerN1.active) .HomeBannerN1Overlay {
        display: block;
    }
    .HomeBannerN1 .HomeBannerN4B .HomeBannerN1BTxt{display:flex; align-items: center; left: 0%;
    justify-content: center; min-height: 355px}
    .HomeBannerN1 .HomeBannerN4B .HomeBannerN1BTxt img{display:none;}
    .HomeBannerN1 .HomeBannerN4B .HomeBannerN1BTxt h1 {font-size: 22px; text-align: center;
    -webkit-text-fill-color: transparent; text-shadow: 0px 0px 0px transparent;}
}
@media (max-width:468px) {.TrialFormBoxNN1 ul.nav label.btn {font-size: 10px;}}


.HomeInnovator .item {padding: 20px;}
.HomeInnovator .slick-arrow {color: #3876ea; font-size: 20px; font-weight: 600; position: absolute !important;
    top: 50% !important; border: 2px #3876ea solid; width: 30px; height: 30px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; z-index: 9;
}
.HomeInnovator .slick-arrow:hover {color: #fff; background: #3876ea;}
.Oursoution .Mainheading span, .Realfamily .Mainheading span {color: #4f46f5;}
.Oursoution {position:relative;}
.Oursoution .BannerHeading {min-height:182px;}
.Oursoution .carousel-indicators{bottom: -60px;}
.Oursoution .carousel-indicators [data-bs-target] {background-color: #3182ed; width: 20px;
    height: 20px; border-radius: 50%;}
.Oursoution .carousel-control-prev, .Oursoution .carousel-control-next {
    top: 50%; opacity: 1; background: #ffffffb5; height: 50px; width: 50px; border-radius: 50%;
    box-shadow: 0px 0px 25px #0000003d; font-size: 24px; color: #000;}
.Oursoution .card {width: 100%; margin-bottom: 20px;}
.Oursoution .card-body {padding: 15px 10px; }
.Oursoution .card ul{padding-left: 2px; margin: 0px; letter-spacing: -.5px; line-height: 30px;}
.Oursoution .card .OursoutionUl {list-style: none; padding-left: 0;}
.Oursoution .card .OursoutionUl li {position: relative; padding-left: 5px; text-decoration: underline;
    color: blue;}
.Oursoution .card .OursoutionUl li::before {content: "➔"; position: absolute; left: -20px;
    top: 0; font-weight: 900; color: #3182ed;}
.Oursoution .card .OursoutionUl li:hover{cursor:pointer;text-decoration: none; color: #575756;}
.Programcurriculum .card {padding: 20px; width: 100%;}
.Oursoution .card:hover { 
    box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;}
.Oursoution .card i, .text .readmore a, .Programcurriculum .card i, 
.Oursoution .card ul li::marker{color: #3182ed;}
.Oursoution .card p, .Programcurriculum .card ul{font-size: 16px;}
.Oursoution img, .Programcurriculum img {width: -webkit-fill-available;  max-width: 70%;}
.Programcurriculum .card ul {padding-left: 16px;}
.Programcurriculum .card ul li span {color: #747d88;}
.Chooseyourstream, .Powerskillprogram, .OurAdvancedprogram, .Realfamily {background: #f3f4f6;}
.Chooseyourstream .orangebg {background: linear-gradient(to right, #f77f2a, #f7b93b);
        padding: 15px 20px; border-radius: 10px; margin-bottom: 30px;}
.Chooseyourstream .orangebg h5 {line-height: 28px; margin:0px;}
.Chooseyourstream .card, .Powerskillprogram .card, .OurAdvancedprogram .card {padding: 32px; width: 100%;
    border: none; transition: all 1s;}
.Chooseyourstream .card:hover, .Powerskillprogram .card:hover, 
.OurAdvancedprogram .card:hover {padding: 20px; transition: all .5s;}
.Chooseyourstream .card .imgbox img, .Powerskillprogram .card .imgbox img, 
.OurAdvancedprogram .card .imgbox img {border-radius: 10px; height: 192px; object-fit: cover;}
.Chooseyourstream .card .agebox, .Powerskillprogram .card .agebox, .OurAdvancedprogram .card .agebox {
    display: inline-flex; align-items: center; background-color: #f0f8ff; color: #3182ed;
    padding: 6px 14px; border-radius: 9999px; font-size: 0.875rem; font-weight: 600;}
.FromSiliconvalley {background-image: url(../../assets/images/home1/globe.webp);
    position: relative; background-size: cover; background-position: center; overflow: hidden;
}
.FromSiliconvalley .fromsiliconvalleybanner, .Experentiallearning .experentialleraningbanner,
.Readytofutureproof .Readytofutureproofbanner {
    background-image: linear-gradient(135deg, #3182ed 0%, #6b26d9 50%, #f97415 100%); width: 100%;
    height: 100%; position: absolute; top: 0; z-index: 1; opacity: 0.85;}
.FromSiliconvalley .container, .Experentiallearning .container, .Readytofutureproof .container {
    position: relative; z-index: 2;}
 .FromSiliconvalley .container h2 span, .Experentiallearning .container h2 span {color: transparent;
    background: linear-gradient(135deg, hsl(25 95% 53%), hsl(45 93% 58%));
    background-clip: text; font-weight: 700;}
.FromSiliconvalley .card, .Readytofutureproof .card {width: 100%; background: transparent;
    border: none;}
.FromSiliconvalley .card i, .Readytofutureproof .card i {display: inline-flex; align-items: center;
    justify-content: center; background-color: #ffffff1a; color: #fff; width: 64px; height: 64px;
    border-radius: 9999px; font-size: 0.875rem; font-weight: 600;}
.Educationcrisis {background: #f3f4f680;}
.Educationcrisis .card, .Whyourapproach .card, 
.Realfamily .card {padding: 32px; width: 100%; border-radius: 20px; border: none;  transition: all 1s;}
.Educationcrisis .card:hover, .Whyourapproach .card:hover, 
.Realfamily .card:hover {transform:scale(1.03); transition: all .5s;}
.Educationcrisis .card .animation-box {text-align:center; display: flex; justify-content: center;
    margin-bottom: 20px; transition: all 1s;}
.Educationcrisis .card:hover .animation-box {transform: rotate(5deg) scale(1.03); transition: all .5s;}
.Educationcrisis .card .animation-box dotlottie-wc {width: 255px; height: 255px; border-radius: 10px;}
.Whyourapproach {background: linear-gradient(to bottom right, #f3f4f6, white );}

.Whyourapproach .bgcard {background: linear-gradient(135deg, hsl(0 0% 100%) 0%, hsl(220 20% 98%) 100%);}

        .Whyourapproach .card i {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 10px;
            border-radius: 5px;
            width: 48px;
            height: 48px;
        }

        .Whyourapproach .card img {
            border-radius: 20px;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .Whyourapproach .realinnovation p, .aienhanced p, .completeecosystem p {
            font-size: 18px;
            line-height: 1.625;
            color: transparent;
            background-clip: text;
        }

        .Whyourapproach .card ul {
            padding-left: 16px;
            margin-top: 20px;
        }

            .Whyourapproach .card ul li span {
                color: #747d88;
            }

        .Whyourapproach .realinnovation ul li {
            color: #f97415;
            margin-bottom: 10px;
        }

        .Whyourapproach .aienhanced ul li, .Whyourapproach .completeecosystem ul li {
            color: #3182ed;
            margin-bottom: 10px;
        }

        .Whyourapproach .futureproof ul li {
            color: #21c45d;
            margin-bottom: 10px;
        }

        .Whyourapproach .provenresult ul li {
            color: #6b26d9;
            margin-bottom: 10px;
        }

        .Whyourapproach .sharktank ul li {
            color: #ef4343;
            margin-bottom: 10px;
        }

        .Whyourapproach .futureproof p, .provenresult p, .sharktank p {
            font-size: 18px;
            line-height: 1.625;
            font-weight: 600;
        }

    .orange-box {
        color: #f97415;
        background: #fee1cd;
    }

    .blue-box {
        
        background: #d0e3fb;
    }

    .green-box {
        color: #21c45d;
        background: #d3f8e1;
    }

    .darkblue-box {
        color: #6b26d9;
        background: #e1d4f7;
    }

    .lightgrey-box {
        color: #ef4343;
        background: #f9fafb;
    }

    .grey-box {
        color: #3182ed;
        background: #f3f4f6;
    }

    .bluebgtext {
        background-image: linear-gradient(135deg, hsl(214 84% 56%), hsl(263 70% 50%));
    }

    .orangebgtext {
        background-image: linear-gradient(135deg, hsl(25 95% 53%), hsl(45 93% 58%))
    }

    .text-green {
        color: #21c45d;
    }

    .text-darkblue {
        color: #6b26d9;
    }

    .text-red {
        color: #ef4343;
    }

.Experentiallearning {background-image: url(../../assets/images/home1/hero-robotics-banner.webp);
    position: relative; background-size: cover; background-position: center; overflow: hidden;
}

        .Experentiallearning .card {
            width: 100%;
            border: none;
            background: rgba(255, 255, 255, 0.1);
            padding: 24px;
            transition: all 0.3s ease;
        }

            .Experentiallearning .card:hover {
                background: rgba(255, 255, 255, 0.2);
            }

    .Realfamily .card .textbox {
        margin: 24px 0px;
        border-bottom: 1px solid #e5e7eb;
    }

    .Realfamily .card:hover {
        box-shadow: 0 20px 50px -12px hsl(220 15% 15% / .25)
    }

    .Latestinsghts .card {
        width: 100%;
        border: none;
    }

        .Latestinsghts .card .Imgbox {
            position: relative;
        }

            .Latestinsghts .card .Imgbox .purpletag {
                position: absolute;
                top: 10px;
                left: 10px;
            }

                .Latestinsghts .card .Imgbox .purpletag p {
                    display: inline-flex;
                    align-items: center;
                    background-color: #a855f7;
                    color: #fff;
                    padding: 6px 14px;
                    border-radius: 9999px;
                    font-size: 0.875rem;
                    font-weight: 600;
                }

        .Latestinsghts .card img {
            border-radius: 10px 10px 0px 0px;
        }

.Readytofutureproof {background-image: url(../../assets/images/home1/readytofutureproof.webp);
    position: relative; background-size: cover; background-position: center; overflow: hidden;}


    .orange-btn {
        background: #f97415;
        padding: 16px 48px;
        font-size: 20px;
        color: #fff !important;
        font-weight: 600;
        border: none;
        height: 44px;
        display: inline-flex;
        align-items: center;
        border-radius: 12px;
    }

    .bluebg-btn {
        display: inline-flex;
        justify-content: center;
        align-items: center;
        height: 44px;
        color: white !important;
        font-weight: 600;
        background: linear-gradient(135deg, hsl(214 84% 56%), hsl(263 70% 50%));
        border-radius: 50px;
        cursor: pointer;
        padding: 24px 32px;
        width: 100%;
        border: none;
    }

    .transparent-btn {
        background: #ffffff1a;
        border: 2px solid #ffffff4d;
        padding: 16px 48px;
        font-size: 20px;
        color: #fff !important;
        font-weight: 600;
        height: 44px;
        display: inline-flex;
        align-items: center;
        border-radius: 12px;
    }

    .darkred-btn {
        background: #ef4444e6;
        border: 2px solid rgb(248, 113, 113);
        padding: 16px 48px;
        font-size: 20px;
        color: #fff !important;
        font-weight: 600;
        height: 44px;
        display: inline-flex;
        align-items: center;
        border-radius: 12px;
    }

    .purple-box {background: #f0e9fb; border: 1px solid #6b26d94d;}
    .purple-box a:hover{color:#7a22c1 !important;}

    .yellow-box {
        background: #fef1e7;
        border: 1px solid #f974154d;
    }

    .blue-box {
        background: #f0f8ff;
        border: 1px solid #3182ed33;
    }

    .animate-pulse {
        animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite;
    }

    .bounce-gentle {
        animation: bounce-gentle 2s infinite ease-in-out;
    }

 @keyframes bounce-gentle {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0px);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}

@keyframes pulse {
    50% {opacity: .5;}
}


/*Text Typing*/
.textTyping {width: 25ch; animation: typing 10s steps(25) infinite, blink 0.7s step-end infinite;
    overflow: hidden; white-space: nowrap;}
@keyframes typing {
    0% {width: 0ch; /* start typing */}
    40% {width: 25ch; /* fully typed */}
    70% {width: 25ch; /* hold text for pause */}
    100% {width: 0ch; /* delete */}
}

.bounce {animation: 1s ease 0s infinite normal none running bounce; animation-delay: 0.81s; opacity: 0.15;}
.slow-blink {animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite;}
.spin {animation-name: spin; animation-duration: 5000ms; animation-iteration-count: infinite;
    animation-timing-function: linear;}

@keyframes spin {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

@keyframes bounce {
    0%, 100% {transform: translateY(-25%); animation-timing-function: cubic-bezier(0.8, 0, 1, 1);}
    50% {transform: none; animation-timing-function: cubic-bezier(0, 0, 0.2, 1);}
}
@keyframes pulse {
    50% {opacity: .5;}
}


/*Financial Literacy*/
.FinancialLiteracyBanner {
    background-image: url(../../assets/images/newImg/financial-literacy/banner.webp); padding: 80px 0px;
    width: 100%; height: 100%; background-position: center; background-size: cover; position: relative;
}
.FinancialLiteracyBanner .container {position: relative; z-index: 2;}
.FinancialLiteracyBanner span { display:block;}
.FinancialLiteracyBanner h5 {color:#facc15; font-size: 1.5rem; line-height: 2rem; text-align:center;
    font-family: Dancing Script, cursive; margin-top: 20px;}
.FinancialLiteracyBanner .card {padding: 32px;}
.FinancialLiteracyBanner .card h4, .FinancialLiteracyBanner .card h6{color: #7033ff;}
.FinancialLiteracyBanner .card ul {list-style:none; padding: 15px 0px; border-bottom: 1px #e3e1e1 solid;}
.FinancialLiteracyBanner .card  ul li{border-left: 5px solid #ff3399; color:#000; padding-left: 15px;
    font-size: 14px;}
.FinancialLiteracyBanner .card  ul li h3{color: #ff3399; font-weight:700; margin:0px;}

.FinancialLiteracy1{}
.FinancialLiteracy1 ul{list-style:none; margin:30px 0px; padding:0px;}
.FinancialLiteracy1 ul li{margin-bottom:15px;}
.FinancialLiteracy1 ul li .card{border-color:transparent; transition: all 1s; padding:10px;}
.FinancialLiteracy1 ul li .card:hover{border:1px #dbccff solid; transition: all .5s;}
.FinancialLiteracy1 ul li .card .card-body{display: flex; align-items: flex-start;}
.FinancialLiteracy1 ul li .card .card-body .Financial1Icon{background: #f0f0f0; min-width: 50px;
    min-height: 50px; margin-right: 15px; border-radius: 10px; display: flex; align-items: center;
    justify-content: center; box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;  transition: all 1s;}
.FinancialLiteracy1 ul li .card .card-body p{font-size:18px; margin:0px;}
.FinancialLiteracy1 ul li .card:hover .Financial1Icon{transform: scale(1.1); transition: all .5s;}
.FinancialLiteracy2{background: linear-gradient(45deg, #eff6ff, #f8f4ff);}
.FinancialLiteracy2 .card{overflow:hidden;}
.FinancialLiteracy2 .card header{background: linear-gradient(135deg, #5545e6, #9034ea);
    text-align: center; padding: 20px; font-size: 20px; font-weight: 700; color: #fff;}
.FinancialLiteracy2 .card .Financial2Head{border-left: 5px #fb923c solid; background:#fff7ed;
    padding: 20px; color: #9a3412; display:flex; font-size:15px; min-height: 160px;}
.FinancialLiteracy2 .card .card-body{padding:30px;}
.FinancialLiteracy2 .card .card-body ul{list-style: none; padding: 0px; margin-top: 15px;}
.FinancialLiteracy2 .card .card-body ul li{display: flex; margin-bottom: 15px; align-items: flex-start;}
.FinancialLiteracy2 .card .Financial2Foot{background:#f0fdf4; color:#166534; padding:20px;
    border-top:1px #bbf7d0 solid; display: flex;
}
@media screen and (max-width: 1746px) {.HomeBannerN1 {zoom: 85%;}}
@media screen and (max-width: 1484px) {.HomeBannerN1 {zoom: 80%;}}
@media screen and (max-width: 1365px) {.HomeBannerN1 {zoom: 100%;}}
@media screen and (max-width: 1240px) {.HomeBannerN1 {zoom: 100%;}}
@media screen and (max-width: 1170px) {.HomeBannerN1 {zoom: 85%;}}
@media screen and (max-width: 1020px) {.HomeBannerN1 {zoom: 52%;}}
@media screen and (max-width: 991px) {.HomeBannerN1 {zoom: 100%;}}
@media screen and (max-width: 480px) {.HomeBannerN1 .TrialFormN1 ul.nav {zoom: 65%;}}

@media (max-width:768px) {
    h2{font-size:22px;}
    h4{font-size:20px;}
    h5{font-size:17px;}
    p{font-size:13px;}
    .Whyourapproach .futureproof p, .provenresult p, .sharktank p, .Whyourapproach .realinnovation p, 
    .aienhanced p, .completeecosystem p {font-size: 16px; line-height: 18px;}
    .Mainheading {font-size: 24px; margin-bottom: 15px;}
    .Subheading {font-size: 16px; line-height: 24px;}
    .Oursoution .card, .Programcurriculum .card {padding: 10px;}
    .Oursoution .card h5, .Programcurriculum .card h5{font-size: 18px; animation: none;
        width: auto; white-space: unset;}
    .Oursoution .card .icon i svg, .Programcurriculum .card .icon i svg{width: 20px; height: 20px;}
    .Oursoution .card p, .Programcurriculum .card p{font-size: 12px; margin:0px;}
    .Oursoution .card ul, .Programcurriculum .card ul{font-size: 14px; line-height: 22px;}
    .Oursoution img, .Programcurriculum img {width: 50%; margin:0px;}
    .transparent-btn, .darkred-btn, .orange-btn {padding: 8px 10px; font-size: 16px; height: auto;}
    .Whyourapproach .row.mt-5{margin-top: 0px !important;}
    .Chooseyourstream .orangebg {padding: 10px 15px; border-radius: 15px;}
    .Chooseyourstream .orangebg h5 {line-height: 18px; font-size: 16px;}
    .Chooseyourstream .card, .Powerskillprogram .card, .OurAdvancedprogram .card{padding: 15px;}
    .Educationcrisis .card, .Whyourapproach .card, .Realfamily .card{padding: 15px;}
    .bluebg-btn{padding: 6px 15px; height: auto;}
    .Experentiallearning .card{padding:10px;}
}
@media (max-width:768px) {
    .FinancialLiteracyBanner {padding: 30px 0px;}
    .FinancialLiteracyBanner span {display: unset;}
    .FinancialLiteracyBanner .btn4 {font-size:14px; display: table; margin: auto;}
    .FinancialLiteracy1 ul li .card .card-body {display: block;}
    .FinancialLiteracy1 ul li .card .card-body .Financial1Icon{display: inline-flex; margin-bottom: 10px;}
}

