@font-face {
    font-family: 'Effra';
  src: url('../fonts/Effra_Trial_Rg.ttf') format('truetype');
  font-style: normal;
  font-display: swap;
}
@font-face {
    font-family: 'Effra Trail';
  src: url('../fonts/Effra_Trial_Th.ttf') format('truetype');
  font-style: normal;
  font-weight: 100;
  font-display: swap;
}
body {
    font-family: "Effra", sans-serif !important;
}
h1, h2, h3, h4, h5, h6, span, input, select, small{
    font-family: "Effra", sans-serif !important;
}
.bg-yellow {
    background: #FFCB05;
}
.yellow {
    color: #FFCB05;
}
:root{    --footer-bg: #231f20;    --section-background: #A4D5FF66;--container: 1320px;scroll-padding-top: 100px;    --white: #ffffff;--font-color: #565759;}
h2 {
    font-size: 40px;
    font-weight: 600;
    text-align: center;
}
h2 span{
    font-weight: 300;
    text-align: center;font-family: 'Effra Trail' !important;
}
section{padding: 70px 0}
/*header css start here*/
header.header-section{position:fixed;width:100%;top:0;z-index:99}
.niit-logo{padding:25px 16px;background-color:#FFCB05;border-radius:0 0 10px 0}
a.btn.btn-yellow.rounded-pill{border-radius:8px!important;color:#0061afff;min-width:222px;font-size:15px;padding:8px;position:relative;overflow:hidden}
.btn-yellow{background:#FFCB05;color:#0061afff;font-weight:600;margin-right:20px;border:1px solid #ffcb05}
.btn:hover{color:#ffcb05;border:1px solid #0061afff;background:#0061afff}
a.btn.btn-yellow.rounded-pill:hover{color:#FFCB05}
.playbtn span:nth-child(1){top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,transparent,#0061afff);animation:animate1 1s linear infinite}
@keyframes animate1 {
0%{left:-100%}
50%,100%{left:100%}
}
.playbtn span:nth-child(2){top:-100%;right:0;width:4px;height:100%;background:linear-gradient(180deg,transparent,#0061afff);animation:animate2 1s linear infinite;animation-delay:.25s}
@keyframes animate2 {
0%{top:-100%}
50%,100%{top:100%}
}
.playbtn span:nth-child(3){bottom:0;right:0;width:100%;height:4px;background:linear-gradient(270deg,transparent,#0061afff);animation:animate3 1s linear infinite;animation-delay:.5s}
@keyframes animate3 {
0%{right:-100%}
50%,100%{right:100%}
}
.playbtn span:nth-child(4){bottom:-100%;left:0;width:4px;height:100%;background:linear-gradient(360deg,transparent,#0061afff);animation:animate4 1s linear infinite;animation-delay:.75s}
@keyframes animate4 {
0%{bottom:-100%}
50%,100%{bottom:100%}
}
a.btn.btn-yellow.rounded-pill:hover{color:#FFCB05}
header.header-section.blur{background-color:#ffffff80;-webkit-backdrop-filter:blur(0.625rem);backdrop-filter:blur(0.625rem)}
/*header css end here*/
/*hero section css start here*/
.hero-section{
    background-image: var(--desktop-banner, url(../images/banner-bg.png));
    background-size: cover;
    background-position: bottom;
    color: #fff;
    min-height: 96vh;
    padding: 0;
}
.hero-section .row.align-items-center{height:96vh}
.hero-section h3{font-size:35px;color:#fff;font-weight:500}
.hero-section h1{font-size:57px;color:#ffcb05ff;font-weight:700;margin-bottom:20px;text-transform:uppercase}
.form-box.bg-white.shadow.rounded-3{width:475px;float:right;padding:25px}
h5.fw-bold.mb-3{color:#000;text-align:center;font-size:22px}
.input{display:flex;color:#868686ff;gap:10px;align-items:anchor-center;font-size:15px;margin-bottom:8px}
.form-box input{height:45px;border-radius:8px}
label.checkbox{font-size:13px}
.hero-section small{font-size:22px;font-weight:500}
.form-box .first-screen p{color:#000}
.otp-box{display:flex;justify-content:center;gap:10px;position:relative;margin-bottom:15px}
.otp-box{display:flex;justify-content:center;gap:10px}
.otp-input{width:50px;height:50px;text-align:center;font-size:22px;border:1px solid #ccc;border-radius:8px;margin:5px;background:#f5f5f5ff}
h5.modal-title{font-size:22px;font-weight:700;margin-bottom:10px;color:#000}
.input-field-group{margin-bottom:18px;position:relative}
.form-input-field{width:100%;padding:11px 16px;border:0 solid #e2e8f0;border-radius:8px;font-size:15px;transition:all .3s ease;background:#f5f5f5ff}
.submit-form-btn{width:100%;background:#fbbf24;color:#0061afff;border:none;padding:10px;border-radius:8px;font-weight:700;font-size:15px;transition:all .3s ease;padding:10px 20px;cursor:pointer}
.form-input-field{width:100%;padding:8px;margin-bottom:6px}
.input-field-group{margin-bottom:18px;position:relative}
select{width:100%;padding:11px 16px;border:0 solid #e2e8f0;border-radius:8px;font-size:15px;transition:all .3s ease;background:#f5f5f5ff;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBvbHlsaW5lIHBvaW50cz0iNiA5IDEyIDE1IDE4IDkiPjwvcG9seWxpbmU+PC9zdmc+);background-repeat:no-repeat;background-position:right 13px center;color:#868686ff}
input#dob{background-color:#f5f5f5!important}
.form-box span.position-absolute.top-50{height:42px;width:42px;padding-right:0;background-color:#f5f5f5;display:flex;justify-content:center;align-items:anchor-center;margin-right:3px}
small.perror,small.error{font-size:13px}
/*hero section css end here*/

/*literacy section css end here image-after-dot*/
.literacy{background:linear-gradient(180deg,var(--section-background) 0%,#ffffff66 60%)}
.literacy img.img-fluid{width:100%;    border-radius: 220px;}
/*.row.mt-5.relative .col-md-6:first-child img.img-fluid{filter: grayscale(100%);}*/
.literacy .tab-content.tab-box{height:100%;display:flex;flex-direction:column;justify-content:center;padding-right:40px}
.literacy .tab-content.tab-box h4{font-size:35px;color:#0e2a4bff}
.literacy .tab-content.tab-box p{color:#565656ff;font-size:16px;line-height:25px}
.row.mt-5.relative .col-md-6:first-child{position:relative}
.row.mt-5.relative .col-md-6:first-child:before{content:"";position:absolute;right:-40px;bottom:-88px;background-image:url(../images/image-after-dot.png);width:116px;height:112px;z-index:-1;background-repeat:no-repeat}
/*literacy hero section css end here*/
/*it ready hero section css end here*/
section.it-ready{position:relative;padding:0!important}
.it-ready .position-absolute{left:0;top:0;width:100%}
.it-ready img{width:100%}
.it-ready h3{font-size:35px;font-weight:700;color:#fff;padding-top:120px;margin-bottom:30px}
.it-ready p{font-size:16px;font-weight:400;color:#fff}

/*it ready hero section css end here*/
/*what happened section css start here*/
.why-choose-block{background-color:#f4f7feff;position:relative;overflow:hidden}
.why-choose-block h2.primary-title{color:#0e2a4bff}
.why-choose-block h2 span{font-weight:300}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;position:relative;z-index:10;width:94%;margin:0 auto}
.feature-card-item{background:#fff;border-radius:16px;padding:40px 30px;text-align:center;transition:all .4s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden}
.feature-card-item:before{content:"";background-size:cover;background-image:url(../images/choose-item.png);width:80%;position:absolute;height:100%;left:10%;top:0}
.icon-container{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 25px;position:relative;transition:all .4s ease}
.card-heading{font-size:1.35rem;font-weight:700;color:#1a202c;margin-bottom:18px;position:relative}
.icon-container p{font-size:14px;color:#64748b;line-height:1.7}
/*what happened section css end here*/
section.literacy.every-indian {
    background: #fff;
}
/*every-indian section css start here*/
section.literacy.every-indian .bg-image {background-size: 100% 100%;background-image: url(../images/p-bg-image.png);padding: 0px 130px 30px;}
/*every-indian section css end here*/
/*learning section css start here*/
.learning{background:#f4f7feff}
.learning .manageleft-design{width:calc(100vw - (100vw - var(--container)) / 2)!important;margin-left:auto}
.learning .project-card-box img{width:40px;height:40px;margin-bottom:15px;    margin-bottom: 15px;}
.learning .project-card-box{background-color:#fff;border-radius:25px;padding:30px 15px;    min-height: 227px;}
.learning .owl-theme .owl-nav{margin-top:0;display:flex;justify-content:center;gap:30px;position:absolute;top:-100px;right:12%}
.learning .owl-theme .owl-nav button{justify-content:center;align-items:center;display:flex!important;padding:0;border:0;border-radius:20px;background-color:#fff}
.learning .owl-nav span{border:1px solid #53adf5ff;font-size:32px;float:left;width:40px;height:40px;line-height:31px;border-radius:21px}
.learning .project-card-box p { min-height: 72px;}
/*learning section css end here*/
/*Inside the 2-Hour Session css start here*/
.accordion-item{border:0 solid #dcdcdc;border-radius:10px;overflow:hidden;margin:10px 0}
.accordion-button{background:#f7f9ff;font-weight:500;border-radius:0;padding:18px 20px;border:none;box-shadow:none!important;position:relative}
.accordion-button:not(.collapsed){background:#fff;border-bottom:0 solid #e0e0e0;border-radius:0}
.accordion-button:focus{box-shadow:none}
.accordion-body{padding:18px 20px;border-top:0}
.accordion-item:last-of-type .accordion-button.collapsed,.accordion-item:first-of-type .accordion-button{border-bottom-right-radius:unset!important;border-bottom-left-radius:unset!important}
.text-left{text-align:left}
.accordion-item{border-radius:50px!important}
.accordion-item.show{border-radius:20px!important;border:.5px solid #0e2a4bff;background:#fff}
/*.accordion-item:nth-child(even) {margin-left: 2%}*/
/*.accordion-item:nth-child(2), .accordion-item:nth-child(4), .accordion-item:nth-child(6), .accordion-item:nth-child(8), .accordion-item:nth-child(10), .accordion-item:nth-child(12) {margin-left: 2%}*/
.accordion-button::after{margin-top:-23px;background-image:none!important;font-size:37px;font-weight:600;content:"+";transform:none!important;color:#000;font-family:'Effra Trail'!important;position:absolute;right:20px}
.accordion-button:not(.collapsed)::after{content:"–";color:#000;width:37px;font-weight:600;font-family:'Effra Trail'!important;float:right;text-align:right}

/*Inside the 2-Hour Session css end here*/
/*tools section css start here*/
section.tool-section{background:linear-gradient(0deg,#e3f0ff99 0%,#ffffff66 90%)}
.tool-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.tool-grid hr{border-top:var(--bs-border-width) solid #0e2a4bff;opacity:1}
.tool-grid-item{text-align:center}
/*.program-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}*/
.program-grid .program-grid-item{background-color:#f4f7feff;    background-color: transparent;border-radius:30px;min-width: 100% !important;}
.program-grid img{width:100%;border-radius:30px}
.program-grid .program-grid-item h6{font-size:25px;color:rgba(14, 42, 75, 1);font-weight:600;margin:0 0 20px}
.program-grid-content{padding:20px;    padding: 20px 20px 20px 50px;
    text-align: left;}
.program-grid-content a {text-decoration: none;}
/*program-grid section css end here*/
/*footer css start here*/
.footer{background-color:#231f20;color:#fff;padding-top:2rem;padding-bottom:1rem}
.copyright{color:#8B8B8B;text-transform:uppercase}
img.hidden-xs{}
img.visible-xs{display: none;}
.footer {
    margin-top: auto;
    background-color: var(--footer-bg);
    color: var(--white);
    font-size: 0.875rem;
}
.footer-top-sec {
    padding-top: 3rem;
    padding-bottom: 1rem;
    --bs-gutter-x: 5rem;
}
.niit-branch-logo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--font-color);
    padding-bottom: 1.5rem;
}
.footer a {
    color: var(--white);
    text-decoration: none;
}
.niit-brand-logo {
    height: 40px;
    position: relative;
    width: auto;
}
.footer-social-icons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    align-items: center;
    margin: 1.5rem 0;
}
.footerlist {
    display: flex;
    position: relative;
    justify-content: space-between;
}
.footerlist .items h6 {
    font-weight: 700;
    color: var(--white);
    font-size: 18px;
}
.footer ul {
    padding-left: 0;
    list-style: none;
}
.link-column li {
    margin-bottom: .5rem;
}
.copyright-section {
    border-top: 1px solid #565759;
}
.ppandcopy {
    padding: 1rem 0;
    text-align: center;
}
.fbottomlink {
    margin-bottom: .5rem;
    display: flex;
    gap: 2rem;
    align-items: center;
    justify-content: space-between;
}

.footer .left-section h6 {
    font-weight: 700;
    color: var(--white);
    font-size: 18px;
}
.col-md-6.left-section {
    display: flex;
    position: relative;
    justify-content: space-between;
}

.visible-xs{display:none}
.hidden-xs{}
/*footer css end here*/
.learning-owl-carousel .owl-stage-outer {
    padding: 0;
}
.program-grid.owl-carousel.owl-loaded.owl-drag {
    padding-top: 40px;
}
.program-grid-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: baseline;
    height: 100%;
}
@media (max-width: 767px) {
    p.text-center.mb-0 {
    width: 100%;
}
    .program-grid-content {
    padding: 20px 0px}
    section.literacy.every-indian.test p.mobile-manage{text-align: center;        margin-bottom: 30px;}
	.hidden-xs{display:none}
	.visible-xs{display:block !important}
	.tool-grid-item img.tool-icon {
    max-width: 100%;
}
.accordion-button {
    padding: 18px 30px 18px 20px;
}
.accordion-button::after {
    right: 10px;
}
    .learning .project-card-box {
    min-height: auto;
    margin-bottom: 15px;
}
.footer-top-sec {
    --bs-gutter-x: 0;
}
   .hero-section .row.align-items-center{height:550px}
.hero-section{min-height:550px}
.hero-section h3{padding-top:90px;font-size:20px}
.hero-section h1{font-size:30px}
img.hidden-xs{display:none}
img.visible-xs{display:block!important}
h2{font-size:25px}
section{padding:40px 0}
.learning .manageleft-design{width:100%!important;padding-left:15px}
.learning .owl-theme .owl-nav{position:static;margin-top:30px}
.literacy .tab-content.tab-box{padding-right:0}
section.literacy.every-indian .bg-image{padding:70px 1px 30px}
br{display:none}
.tool-grid{grid-template-columns:repeat(2,1fr)}
.program-grid,.features-grid{grid-template-columns:repeat(1,1fr)}
.row.mt-5.relative .col-md-6:first-child:before{display:none}
.it-ready h3{padding-top:20px;font-size:27px}
.literacy .tab-content.tab-box h4{margin-top:30px}
.it-ready .row.mt-2{flex-wrap:wrap-reverse}
.form-box.bg-white.shadow.rounded-3{width:100%}
}

.top-menu-left {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    position: absolute !important;
    left: 0 !important;             /* stick to left */
    top: 0 !important;
    background: var(--nav-secondry) !important;
    padding: 24px !important;
    border-radius: 0 0 0.625rem 0 !important;
    z-index: 9999 !important;
}
.top-menu-right{
    display:none !important;
}
.bottom-fixed-actionbar thebox{
    display:none !important;
}
.begin-journey{
    display:none !important;
}
.bottom-fixed-actionbar{
    display:none !important;
}
.navbar {
    --bs-navbar-padding-x: 0 !important;
    --bs-navbar-padding-y: 0.0rem !important;
}
.sticky-header {
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 767px){
    .hero-section{
        background-image: var(--mobile-banner, url(../images/banner-bg.png));
        background-position: center;
    }
}