@import url(https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap);
.otp_based_login.modal{position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgb(0 0 0 / 72%);transform:scale(1.1);transition:visibility 0s linear .25s,opacity .25s 0s,transform .25s;font-family:Inter,sans-serif}
.privcy-policytext{opacity:.75;color:#00060b;font-family:Inter;font-size:12px;line-height:20px;font-weight:400;margin-bottom:1.25em;text-align:center}
.otp_based_login .modal-dialog{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)!important;opacity:1;background:#f4f5ff;margin:0 0!important;width:639px;height:auto;border-radius:24px;background:#f4f5ff;font-family:Inter,sans-serif}
.otp_based_login .modal-header{padding:0;border-bottom:0 solid #e5e5e5;position:absolute;right:15px;top:15px;z-index:1;font-family:Inter,sans-serif}
.otp_based_login .modal-body{position:relative;padding:0;font-family:Inter,sans-serif}
.otp_based_login .close-button{float:right;width:1.5rem;font-size:1.2em;line-height:1;padding:0 .2em .15em;text-align:center;cursor:pointer;border-radius:.25rem;background-color:var(--clr-neutral);color:var(--clr-dark);font-family:Inter,sans-serif;transition:color .12s ease-in-out}
.otp_based_login .close-button:hover{color:var(--clr-main)}
.otp_based_login .show-modal{opacity:1;visibility:visible;transform:scale(1);font-family:Inter,sans-serif;transition:visibility 0s linear 0s,opacity .25s 0s,transform .25s}
.otp_based_login.modal{display:none}
.right_side_inputs{padding-left:10px;padding-top:.8em;padding-right:25px;padding-bottom:0em}
.forget_passwrd{text-align:end;margin-bottom:0;margin-top:0px}
.forget_passwrd a{text-decoration:underline;color:#337ab7;white-space:nowrap;font-family:Inter}
.left_sideImg{padding-left:0;display:flex;flex-direction:column}
.left_sideImg img {border-radius: 24px 0 0 24px;}
.otp_based_login .right_side_inputs .modal-title{margin:0;white-space:wrap;font-family:Inter;font-size:30px;line-height:38px;font-weight:600}
.otp_based_login .modal-header .close{margin-top:0;border:1px solid #565759d6;border-radius:50%;width:25px;height:25px;font-size:14px;line-height:0;top: 0;right: 0;color: #565759d6;}
.or_contnue{text-align:center}
.or_contnue p a{text-decoration:underline;color:#337ab7;white-space:nowrap;font-family:Inter}
.or_contnue span{font-size:12px;margin-bottom:5px;display:block}
button.send-opt:disabled{height:48px;border-radius:8px;background:#e4e4e4;width:100%;text-transform:uppercase;color:#fff;white-space:wrap;font-family:Inter;font-size:18px;font-weight:500;line-height:2;border:1px solid #fff;margin:.5em 0 0 0}
button.send-opt:enabled{outline: 0;height:48px;border-radius:8px;background:#0061af;width:100%;text-transform:uppercase;color:#fff;white-space:nowrap;font-family:Inter;font-size:18px;font-weight:500;line-height:2;border:1px solid #0061af;margin:.5em 0 0 0}
.send-opt.active:hover{background:#0061af;width:100%;text-transform:uppercase;color:#fff;border-color:#173f5f}
.otp_inpts{margin-top:1em;min-height:285px;flex-direction:column;align-items:center;justify-content:space-evenly;overflow-y:auto}
.otp_inpts label{color:rgba(1,26,48,.81);white-space:nowrap;font-family:Inter;font-size:14px;line-height:17px;font-weight:400;width: 100%;}
.otp_inpts input{height:48px;backdrop-filter:blur(10px);border-radius:8px;background:#fff;border:1px solid #e7e7e7;font-size: 16px;margin-bottom: 12px;}
.otp_inpts ::placeholder{opacity:.6499999761581421;color:#3d3d3d;white-space:nowrap;font-family:Inter;font-size:12px;line-height:15px;font-weight:300}
.otp_inpts input:focus{outline:0;box-shadow:none}
.send-opt:hover{background:#0061af}
.otp_sent{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:10px 15px;backdrop-filter:blur(10px);border-radius:8px;background:#0061af;box-sizing:content-box;border:1px solid #e7e7e7}
.otp_sent p{margin-bottom:0}
.mobile-detail span{color:rgba(1,26,48,.81);white-space:nowrap;font-family:Inter;font-size:12px;line-height:15px;font-weight:400}
.otp_sent a{color:#0061af;white-space:nowrap;font-family:Inter;font-size:14px;line-height:17px;font-weight:500;text-transform:uppercase}
.otp-field{flex-direction:row;column-gap:8px;display:flex;align-items: normal;justify-content: left;}
.otp-field input{height:40px;width:40px;border-radius:8px;outline:0;text-align:center;border:1px solid #ddd;color:#3d3d3d;white-space:nowrap;font-family:Inter;font-size:24px;line-height:29px;font-weight:600;}
.otp-field input:focus{box-shadow:0 1px 0 rgba(0,0,0,.1)}
.otp-field input::-webkit-inner-spin-button,.otp-field input::-webkit-outer-spin-button{display:none}
.otp_sent{display:flex;flex-direction:row;justify-content:space-between;align-items:center;backdrop-filter:blur(10px);border-radius:8px;background:#fff;box-sizing:content-box;border:1px solid #e7e7e7;padding:10px 12px;margin-bottom:15px}
.mobile-detail{overflow: hidden;}
.mobile-detail p{margin-bottom:0;font-size: 16px;} 
.mobile-detail span{color:rgba(1,26,48,.81);white-space:nowrap;font-family:Inter;font-size:12px;line-height:15px;font-weight:400}
.resent_timer{margin-bottom:0;margin-top:10px;opacity:.699999988079071;color:#00060b;white-space:nowrap;font-family:Inter;font-size:12px;line-height:15px;font-weight:500}
.resent_timer span{font-size:16px;line-height:22px;font-weight:600;opacity:1}
.enter_otpTxt{color:#3d3d3d;white-space:nowrap;font-family:Inter;font-size:16px;line-height:19px;font-weight:400}
.resent_timer a{font-size:14px;opacity:1;font-weight:600;text-decoration:underline;color:#0061af}
.otp_inpts .media{border-radius:8px;border:1px solid #e7e7e7;padding:12px 10px}
.otp_inpts .media img{width:30px}
.otp_inpts .media .media-heading{color:#00060b;white-space:nowrap;font-family:Inter;font-size:16px;line-height:30px;font-weight:400}
a:hover{text-decoration:none}
.multiple_emails:hover{backdrop-filter:blur(10px);border-radius:10px;background:#ecf0fc;box-sizing:content-box;border:1px solid #0061af;padding: 12px 10px;}
.otp_inpts .media .media-heading{margin-bottom:0}
.multiple_emails{margin-bottom:10px;display:block;background: #fff;border-radius: 10px;color: #00060b;font-family: Inter;border: 1px solid #e7e7e7;padding: 12px 10px;overflow: hidden;}
.multiple_email{color:#011c31;white-space:nowrap;font-family:Inter;font-size:14px;line-height:20px;font-weight:400}
.valid_msg_text{color:red;font-size:12px;margin-top:5px;width: 100%;}
.valid_msg_borders input{border:1px solid red}
#screen2 .otp_sent {margin-top: 0;}
.invalid{border:1px solid red!important}
.valid_msg_text{color:red;font-size:11px;margin-bottom: 5px !important;text-align: left !important;line-height: 1 !important;}
.valid{border:1px solid green!important}
.valid-text{color:green!important}
.fade-in{opacity:0;transition:opacity .3s ease-in-out}
.fade-out{opacity:0;transition:opacity .3s ease-in-out}
.singdiv {display: flex;}
#screen2,#screen3,#screen5,#screen6,#screen7,#screen8{display:none}
div#screen2{margin-top:15px}
div#screen2 button.send-opt:disabled,div#screen2 button.send-opt:enabled{margin-top:1rem}
.forgetPassword{display:flex;flex-direction:row;justify-content:space-between}
#screen5 {margin-top: 4rem;}
#screen5{margin-top:4rem}
#screen7 {margin-top: 40px;}
#screen6 .form-group.valid_msg_border{padding: 0;font-size: 15px;color: #172801;text-align: center;line-height: 24px;margin-bottom: 0;letter-spacing: .2px;}
#screen6 .form-group.valid_msg_border{margin-top:5rem;display: block;}
#screen6 .form-group.valid_msg_border p.forget_passwrd{background:#0061af;border:1px solid #0061af;bottom:0;display:block;width:175px;text-align:center;padding:5px 2px;left:0;border-radius:4px;margin:40px auto 10px}
#screen6 .fa.fa-check-circle{font-size:24px;text-align:center;display:block;color:#4e8305;margin:5px 0;display: none;}
#screen6 .form-group.valid_msg_border p.forget_passwrd a{color:#fff;text-decoration:none}
#screen8 {padding-top:11rem;}
#screen8 .fa.fa-check-circle {display: none;}
/*Full page loader css start*/
section.fullPageLoader{position:fixed;background:#fffffff2;width:100%;height:100%;z-index:99999999;top:0;left:0;display:flex;flex-direction:column;backdrop-filter:blur(3px);justify-content:center;align-items:center}
h4.loader-title{font-size:42px;color:#02022a;font-weight:600;text-align:center;margin:4rem 0}
h3.loader-maintitle{font-size:18px;line-height:28px;color:#333;font-weight:400;margin-top:4rem;margin-bottom:8rem;text-align:center}
.fullPageLoader .fullPagespinner{display:grid;place-items:center;width:70px;height:70px;border-radius:50%;background:conic-gradient(from 180deg at 50% 50%,rgb(82 0 255 / 0%) 0deg,#0a941d 360deg);animation:spin 1s infinite linear;margin:0 auto}
.fullPageLoader .fullPagespinner::before{content:"";border-radius:50%;width:80%;height:80%;background-color:#fff}
.loader_contents_ {position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 100%;}
.resmsg,p.forget_passwrd_reserror,.valid_msg_text{padding:0;font-size:15px;color:red;text-align:center;line-height:24px;margin-bottom:0;letter-spacing:.2px;font-size:12px;position: relative;top:-8px;}

@media screen and (max-width: 767px) {
    /*OTP BASED LOGIN=================================================*/ 
.mobile-hide{display:none}
.otp_based_login .modal-dialog{height:auto;width:80%;padding-bottom:20px;min-width:80%;top:45%}
.right_side_inputs{padding-left:20px;padding-top:1.5em;padding-right:20px;padding-bottom:1.5em}
.multiple_emails{margin-bottom:10px;display:block;background:#fff;border-radius:8px;border:1px solid #c7c7c7}
.otp_inpts{margin-top:1em;min-height: auto;}
.privcy-policytext{font-size:10px}
.otp-field{flex-direction:row;column-gap:2.3px}
.otp_based_login .right_side_inputs .modal-title{font-size:30px;line-height:44px;font-weight:700}
.otp_inpts input{font-size: 16px;}
.otp_inpts input::placeholder {font-size: 14px !important;}
#screen5 {margin-top: 15px;}
#logInUserList {max-height: 270px;padding-right: 0;overflow-y: scroll;}
#screen1 .valid_msg_text {margin-top: -7px;}
#screen6 .form-group.valid_msg_border {margin-top: 1rem;display: block;margin-bottom: 0;}
#screen8 {padding-top:2rem;}
#logInUserList {height: 250px;overflow-y: auto;padding-right: 10px;}
.customModalNewDesign .modal-backdrop.in{opacity:.8}
.customModalNewDesign .modal-title{margin:0;line-height:1.42857143;font-family:Nunito,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal;font-size:20px;margin-bottom:10px;}
.customModalNewDesign .custom-modal .modal-content{background-color:#fafafa;border-radius:5px;border:none;padding:15px 10px 10px;animation:slideUp .4s ease;position:relative}
.customModalNewDesign .close-btn{position:absolute;top:10px;right:10px;font-size:18px;color:#333;cursor:pointer;background:#FFB5B5;height:26px;width:26px;border-radius:50px;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:3px 0 3px;z-index:2}
.customModalNewDesign .box{background-color:#f8f9fa;padding:15px 12px;text-align:center;margin:10px 0;border-radius:12px}
.customModalNewDesign .box .icon{font-size:40px;margin-bottom:10px;color:#007bff}
.customModalNewDesign .box .title{margin:0;line-height:1.42857143;font-size:15px;text-align:left;font-family:Nunito,sans-serif;font-optical-sizing:auto;font-weight:500;font-style:normal}
.customModalNewDesign .box .icon img{width:42px;height:38px;object-fit:contain}
.customModalNewDesign .box.my_applicsn_bg{background:#f26641;color:#fff}
.customModalNewDesign .box a{color:#fff;font-size:16px;font-family:Nunito,sans-serif;font-optical-sizing:auto;font-weight:500;font-style:normal}
.customModalNewDesign .box a:hover{text-decoration:none;color:#f8f9fa}
.customModalNewDesign .box.my_paymnt_bg{background:#0061af;color:#fff}
.customModalNewDesign .box.refr-frd_bg{background:#fdb714;color:#fff}
.customModalNewDesign .box.explor_more_bg{background:#abcb37;color:#fff}
/* .customModalNewDesign .box-container{display:flex;justify-content:space-between} */
.customModalNewDesign .modal-body{padding:10px}
.customModalNewDesign .media-right{display:flex;align-items:center}
.customModalNewDesign .media.card{border:1px solid #ddd;border-radius:5px;margin-bottom:10px;display:flex;flex-direction:row;justify-content:space-around;align-items:center;padding:10px 15px;box-shadow:0 1px 4px 0 #a8a8a845}
.customModalNewDesign .media-right img{width:26px;height:25px;object-fit:contain}
.customModalNewDesign .media-left .icon{font-size:36px;color:#007bff}
.customModalNewDesign .media-heading{font-size:20px;font-weight:700}
.customModalNewDesign .click-icon{font-size:24px;color:#007bff;cursor:pointer}
.customModalNewDesign .media-heading{font-size:14px;font-weight:500;line-height:16px;margin-bottom:0;color:#000}
.customModalNewDesign .media-left img{width:40px;height:35px;object-fit:contain}
.go_back_btn img{padding-left: 15px;margin-bottom: 10px;}
.customModalNewDesign .box-container{flex-direction:row}
.customModalNewDesign .modal-dialog{margin:0;width:100%;position:fixed;bottom:0;left:0}
/*------------------------------Main Header design impliment----------------------------------*/
#user_mycourse_modal_box .form-check{display: flex;flex-direction: row;align-items: center;}
div#user_mycourse_modal_box .modal-body {padding: 0;}
#menuToggle input[type='checkbox'] {position: absolute; width: 30px;height: 22px;left:-4px;top:-4px;}
div#menuToggle {margin-top: 8px;}
#menuToggle span {display: flex;width: 22px;height: 2px;}
.mega_menu_new_mobile.desktop-hide a img.img-responsive.niit_logo_pt {padding-top: 1px;}
#menuToggle input:checked~span{transform: rotate(45deg) translate(-2px,1px);}
div#menuToggle {position: relative;}
.program_cta_mob img {display: none;}
.program_cta_mob{background: #0061af;margin-top: 5px;padding: 2px 10px;width: auto;text-transform: capitalize;border-radius:4px;font-size: 14px;line-height: 2;font-family: 'Bahnschrift';margin-top: 5px;}
.program_cta_mob a{color: #fff;}
section.home_banner .home_banner_righ_block div#myCarousel ol.carousel-indicators{width:10rem;margin:3px 0;padding:4px 0;line-height:0}
section.home_banner .home_banner_righ_block div#myCarousel ol.carousel-indicators li{width:2.5rem;height:.5rem}
section.home_banner .home_banner_righ_block div#myCarousel ol.carousel-indicators li.active {margin: 1px !important;}
div#removeaftermobloginload{bottom:4px;}
section.latest_mobileNavigation.desktop-hide li:first-child .nav-link.nav-back-link.img-ds.nav-expand-link{background:#0161af;clear:both;display:flow;width:75px;border-bottom:0;margin-left:15px;border-radius:4px;margin-top:4px;padding:7px 8px;text-align:center;margin-bottom:4px;font-size:12px;color:#fff}
.megaMenu_courseCard h3{font-size:14px;margin-bottom:35px;line-height:20px}
.col-md-6.megaMenuCourseCard{padding-right:0}

.customModalNewDesign .modal-backdrop.in{opacity:.8}
.customModalNewDesign .modal-title{margin:0;line-height:1.42857143;font-family:Nunito,sans-serif;font-optical-sizing:auto;font-weight:600;font-style:normal;font-size:20px;margin-bottom:10px;}
.customModalNewDesign .custom-modal .modal-content{background-color:#fafafa;border-radius:5px;border:none;padding:15px 10px 10px;animation:slideUp .4s ease;position:relative}
.customModalNewDesign .close-btn{position:absolute;top:10px;right:10px;font-size:18px;color:#333;cursor:pointer;background:#FFB5B5;height:26px;width:26px;border-radius:50px;display:flex;flex-direction:row;justify-content:center;align-items:center;padding:3px 0 3px;z-index:2}
.customModalNewDesign .box{background-color:#f8f9fa;padding:15px 12px;text-align:center;margin:10px 0;border-radius:12px}
.customModalNewDesign .box .icon{font-size:40px;margin-bottom:10px;color:#007bff}
.customModalNewDesign .box .title{margin:0;line-height:1.42857143;font-size:15px;text-align:left;font-family:Nunito,sans-serif;font-optical-sizing:auto;font-weight:500;font-style:normal}
.customModalNewDesign .box .icon img{width:42px;height:38px;object-fit:contain}
.customModalNewDesign .box.my_applicsn_bg{background:#f26641;color:#fff}
.customModalNewDesign .box a{color:#fff;font-size:16px;font-family:Nunito,sans-serif;font-optical-sizing:auto;font-weight:500;font-style:normal}
.customModalNewDesign .box a:hover{text-decoration:none;color:#f8f9fa}
.customModalNewDesign .box.my_paymnt_bg{background:#0061af;color:#fff}
.customModalNewDesign .box.refr-frd_bg{background:#fdb714;color:#fff}
.customModalNewDesign .box.explor_more_bg{background:#abcb37;color:#fff}
/* .customModalNewDesign .box-container{display:flex;justify-content:space-between} */
.customModalNewDesign .modal-body{padding:10px}
.customModalNewDesign .media-right{display:flex;align-items:center}
.customModalNewDesign .media.card{border:1px solid #ddd;border-radius:5px;margin-bottom:10px;display:flex;flex-direction:row;justify-content:space-around;align-items:center;padding:10px 15px;box-shadow:0 1px 4px 0 #a8a8a845}
.customModalNewDesign .media-right img{width:26px;height:25px;object-fit:contain}
.customModalNewDesign .media-left .icon{font-size:36px;color:#007bff}
.customModalNewDesign .media-heading{font-size:20px;font-weight:700}
.customModalNewDesign .click-icon{font-size:24px;color:#007bff;cursor:pointer}
.customModalNewDesign .media-heading{font-size:14px;font-weight:500;line-height:16px;margin-bottom:0;color:#000}
.customModalNewDesign .media-left img{width:40px;height:35px;object-fit:contain}
.go_back_btn img{padding-left: 15px;margin-bottom: 10px;}
.customModalNewDesign .box-container{flex-direction:row}
.customModalNewDesign .modal-dialog{margin:0;width:100%;position:fixed;bottom:0;left:0}
/*------------------------------Main Header design impliment----------------------------------*/
#user_mycourse_modal_box .form-check{display: flex;flex-direction: row;align-items: center;}
div#user_mycourse_modal_box .modal-body {padding: 0;}
#menuToggle input[type='checkbox'] {position: absolute; width: 30px;height: 22px;left:-4px;top:-4px;}
div#menuToggle {margin-top: 8px;}
#menuToggle span {display: flex;width: 22px;height: 2px;}
.mega_menu_new_mobile.desktop-hide a img.img-responsive.niit_logo_pt {padding-top: 1px;}
#menuToggle input:checked~span{transform: rotate(45deg) translate(-2px,1px);}
div#menuToggle {position: relative;}
.program_cta_mob img {display: none;}
.program_cta_mob{background: #0061af;margin-top: 5px;padding: 2px 10px;width: auto;text-transform: capitalize;border-radius:4px;font-size: 14px;line-height: 2;font-family: 'Bahnschrift';margin-top: 5px;}
.program_cta_mob a{color: #fff;font-weight: 100;}
section.home_banner .home_banner_righ_block div#myCarousel ol.carousel-indicators{width:10rem;margin:3px 0;padding:4px 0;line-height:0}
section.home_banner .home_banner_righ_block div#myCarousel ol.carousel-indicators li{width:2.5rem;height:.5rem}
section.home_banner .home_banner_righ_block div#myCarousel ol.carousel-indicators li.active {margin: 1px !important;}
div#removeaftermobloginload{bottom:4px;}
section.latest_mobileNavigation.desktop-hide li:first-child .nav-link.nav-back-link.img-ds.nav-expand-link{background:#0161af;clear:both;display:flow;width:75px;border-bottom:0;margin-left:15px;border-radius:4px;margin-top:4px;padding:7px 8px;text-align:center;margin-bottom:4px;font-size:12px;color:#fff}
.megaMenu_courseCard h3{font-size:14px;margin-bottom:35px;line-height:20px}
.col-md-6.megaMenuCourseCard{padding-right:0}
.niit_logo_pt {width: auto !important;height: auto !important;}
.filtrbx {margin: 0 12px 15px;padding: 10px 15px !important;margin-top: -1rem !important;}
.filter-content {width: 100%;}
.pagination-list {margin-top: 4rem;}
.col-lg-12.col-md-12.text-center h2 {font-size: 18px;margin: 10px 0 0px;padding: 20px 4rem;}
}