:root {
    --primary-purple: #2A0134;
    /* --primary-purple: #76409B; */
    --logo-primary-purple: #6510A3;
    --logo-primary-orange: #f48001;
    --logo-secondry-orange: #F58102;
    --logo-third-orange: #FCB454;
    --d-transition-duration: 0.8s;
    --d-transition-delay-base: 0.1s;
   --swiper-navigation-size: 25px;
}

.txtjust{
    text-align: justify;
}

.testdiv {
    width: 100%;
    height: 100%;
    background-color: blueviolet;
}

/* Placement Section Start here */

.placement_brochure .btn-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary-purple);
    --bs-btn-border-color: white;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--logo-primary-orange);
    --bs-btn-hover-border-color: var(--logo-primary-orange);
    --bs-btn-focus-shadow-rgb: 66, 70, 73;
    --bs-btn-active-color: var(--primary-purple);
    --bs-btn-active-bg: #fff;
    --bs-btn-active-border-color: #373b3e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--primary-purple);
    --bs-btn-disabled-border-color: var(--primary-purple);
    border-radius: 25px;
    border-width: 2px;
}
.course_anc{
    color: var(--primary-purple);
    text-decoration: none;
    color: inherit;
}
/* Placement Section End here */

/* Hiring Partner Start Here */

/* .hiring-partner-course .owl-carousel .owl-item img { */
/* display: block; */
/* width: 120%; */
/* } */

/* Hiring Partner End Here */

/* Home Course Sectinon Start here */
.new_home_Course {
    background-color: #0000000a;
}

.new_home_Course .nav-pills,
.new_home_Course .nav-link.active,
.new_home_Course .show>.nav-link {
    --bs-nav-pills-border-radius: 4px;
    --bs-nav-pills-link-active-color: #fff;
    --bs-nav-pills-link-active-bg: var(--primary-purple);
}

.new_home_Course .nav-link {
    color: var(--primary-purple);
    border: 2px solid var(--primary-purple);
    margin: 5px 0.25em;
    border-bottom-right-radius: 30px;
    font-size: 1.15em;
    font-weight: 500;
}

.new_home_Course .card {
    --bs-card-border-width: 0;
    max-width: 45vw;
}

.new_home_Course .card-title {
    font-weight: 700;
}

.new_home_Course .col-2,.new_home_Course .col-10 {
    font-size: 1rem;
}

.new_home_Course .col-10 {
    padding-left: 0;
    padding-right: 0;
    font-weight: 500;
}

.new_home_Course .card-text {
    padding-top: 0;
}

.new_home_Course .card-footer {
    padding-top: 0;
}

.new_home_Course .btn-outline-dark {
    padding: 5px 10px;
    --bs-btn-active-color: var(--primary-purple);
    --bs-btn-active-bg: white;
}

.new_home_Course .btn-dark {
    padding: 5px 10px;
    border-radius: 6px;
    --bs-btn-hover-color: var(--primary-purple);
    --bs-btn-hover-bg: white;
    --bs-btn-active-bg: var(--bs-btn-hover-color);
}

.tab-content>.active{
    top : 100px;
}

/* Home Course Sectinon End here */

/* Home Course Carasoule Sectinon Start here */

/* .owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled {
    display: block;
} */

.new_home_Course .swiper {
    width: 90%;
    height: 100%;
}

.new_home_Course .swiper-slide {
    text-align: center;
    font-size: 18px;
    /* background: #444; */
    display: flex;
    justify-content: center;
    align-items: center;
}

.new_home_Course .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.new_home_Course .swiper-button-next,.new_home_Course .swiper-button-prev {
    /* position: absolute;
    top: var(--swiper-navigation-top-offset,50%);
    width: calc(var(--swiper-navigation-size)/ 44 * 27); 
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
   */
    /* font-size:10px; */
    color: var(--logo-primary-orange);
}

 .arrow {
/* position: absolute; */
  /* margin-top: 50px; */
  z-index: 10 ;  
  border: solid #f48001 ;
  border-width: 0 3px 3px 0 ;
  /* display: inline-block; */
  padding: 7px ;



position:absolute;
top:var(--swiper-navigation-top-offset,50%) ;
/* width:calc(var(--swiper-navigation-size)/ 44 * 27);
height:var(--swiper-navigation-size); */
margin-top:calc(0px - (var(--swiper-navigation-size)/ 2)) ;
z-index:10;
cursor:pointer ;
display:flex;
align-items:center ;
justify-content:center ;
/* color:var(--swiper-navigation-color,var(--swiper-theme-color))  */
}


.right {
   right:var(--swiper-navigation-sides-offset,10px);left:auto; 
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.left {
left:var(--swiper-navigation-sides-offset,10px);right:auto;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}




.new_home_Course .swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--logo-primary-orange);
}

.new_home_Course .swiper-button-next,.new_home_Course .swiper-rtl .swiper-button-prev {
    right: var(--swiper-navigation-sides-offset, -2px);
    /* left: auto; */
}
.new_home_Course .swiper-button-prev,.new_home_Course .swiper-rtl .swiper-button-next {
    left: var(--swiper-navigation-sides-offset,-2px);
    /* right: auto; */
}

.swiper-slide .card-footer{
background-color: inherit;
}

/* Home Course Carasoule Sectinon End here */


/* Popular Courses Start here */

.popCourse_sec .bg-warning {
    height: 2.5px;
    border-radius: 2px;
}

.popCourse_sec h5 {
    /* color: var(--primary-purple); */
    color: white;
    border: 2px solid var(--primary-purple);
    font-weight: 500;
    padding: 10px 20px;
    /* padding-right: ; */
    margin: 5px 5px;
    background-color: var(--primary-purple);
    border-bottom-right-radius: 30px;
}

.shadow-inset-center {
    animation: shadow-inset-center 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite alternate both;
}

/* rgb(254, 119, 67) 
42, 1, 52*/
@keyframes shadow-inset-center {
    0% {
        box-shadow: inset 0 0 0 0 rgba(255, 255, 255, 0);
    }

    100% {
        box-shadow: inset 0 0 11px 0px rgba(255, 255, 255, 1);
    }
}

/* .shadow-inset-center {
	animation: shadow-inset-center 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.2s infinite both;
} */

/* .popCourse_sec h3:nth-child(odd){
    color: white;
    font-weight: 500;
    background-color: var(--primary-purple);
    border-bottom-right-radius: 10px;
} */



/* Popular Sourses End here */



/* Welcome to Ntech */
.welcome-hero .bgimg {
    background-image: url('../images/background-img/Purple_Background_Img.jpg');
    background-repeat: round;
    background-color: #2A0134;
    color: #f0f8ff;
    /* min-height: 70vh; */
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.welcome-hero h2 {
    font-weight: 700;
}

.welcome-hero .col-dv-bg {
    background-image: url('../images/homepage-img/about.jpg');
    background-repeat: no-repeat;
    /* background-position: center; */
    background-position-x: center;
    background-position-y: -40px;
    background-color: #2A0134;
    color: #f0f8ff;
    width: 100%;
    height: auto;
    min-height: 356px;
    /* min-height: 70vh; */
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 25px;
}

/* .col-dv-bg h1{
    visibility: hidden;
    height: 100%;
} */

.welcome-hero .bg-warning {
    height: 2.5px;
    border-radius: 2px;
}

/* Welcome to Ntect End here */


/* Learning path start hear */

.lp-sec{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* background-color: var(--bg-light); */
    color: var(--primary-purple);
    line-height: 1.6;
    overflow-x: hidden; /* Prevent horizontal scroll due to initial off-screen elements */
}

@keyframes lp-fadeInDown {
    from { opacity: 0; transform: translateY(-50px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes lp-fadeInUp {
    from { opacity: 0; transform: translateY(50px); }
    to { opacity: 1; transform: translateY(0); }
}
/* Keyframe Animations */
@keyframes lp-slideInFromLeft {
    from { opacity: 0; transform: translateX(-50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes lp-slideInFromRight {
    from { opacity: 0; transform: translateX(50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes lp-fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes lp-zoomIn {
    from { opacity: 0; transform: scale(0.5); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes lp-rotateIn {
    from { opacity: 0; transform: perspective(800px) rotateX(45deg); }
    to { opacity: 1; transform: perspective(800px) rotateX(0deg); }
}


/* Workflow Container */
.workflow-container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 4rem 1rem;
    position: relative; /* For potential future timeline elements */
}

/* Workflow Step Basic Styling */
.workflow-step {
    /* min-height: 70vh; Ensures enough scroll space for each step to fully appear */
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 1.5rem;
    margin-bottom: 6rem; /* Space between steps */
    box-sizing: border-box;
    background-color: white;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: transform var(--d-transition-duration) ease-out,
                opacity var(--d-transition-duration) ease-out,
                box-shadow 0.3s ease-in-out; /* Smooth hover */
    position: relative; /* For absolute positioning of elements inside */

    /* Initial hidden state */
    opacity: 0;
    transform: translateY(100px) scale(0.95);
}

.workflow-step:nth-child(even) {
    background-color: var(--bg-dark);
}

.workflow-step:hover {
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}

.step-content {
    text-align: center;
    max-width: 600px;
}

.step-content h2 {
    color: var(--primary-color);
    font-size: 2.5rem;
    margin-bottom: 1rem;
    position: relative;
    padding-bottom: 0.5rem;
}

.step-content h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background-color: var(--primary-color);
    margin: 0.5rem auto 0;
    border-radius: 2px;
}

.step-content p {
    font-size: 1.15rem;
    color: var(--secondary-color);
    margin-top: 1.5rem;
}

.step-icon {
    font-size: 4rem;
    margin-top: 2rem;
    color: var(--primary-color);
    opacity: 0.8;
}


/* Class added by JavaScript when step is in view */
.workflow-step.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Engaging Animations for visible steps (applied on 'is-visible') */
.workflow-step.is-visible .step-content h2 {
    animation: lp-slideInFromLeft 0.8s ease-out var(--d-transition-delay-base) forwards;
}

.workflow-step.is-visible .step-content p {
    animation: lp-fadeIn 0.8s ease-out calc(var(--d-transition-delay-base) + 0.2s) forwards;
}

.workflow-step.is-visible .step-icon {
    animation: lp-zoomIn 0.8s ease-out calc(var(--d-transition-delay-base) + 0.4s) forwards;
}


/* Individual step animations for more variation */
/* Example: Step 2 slides from right */
#step2.is-visible {
    transform: translateX(0) scale(1);
    animation: lp-slideInFromRight var(--d-transition-duration) ease-out forwards;
}

#step2 {
    transform: translateX(100px) scale(0.95);
}

/* Example: Step 3 fades in with slight rotation */
#step3.is-visible {
    transform: translateX(0) scale(1);
    animation: lp-slideInFromLeft var(--d-transition-duration) ease-out var(--d-transition-delay-base) forwards;
    /* transform: rotateX(0) scale(1);
    animation: lp-rotateIn var(--d-transition-duration) ease-out forwards; */
}

#step3 {
    transform: rotateX(20deg) scale(0.9);
}

/* Responsive Design */
@media (max-width: 768px) {
    .workflow-step {
        padding: 2rem 1rem;
        min-height: unset; /* Allow height to collapse on smaller screens */
    }
    .step-content h2 {
        font-size: 2rem;
    }
    .step-content p {
        font-size: 1rem;
    }
    .step-icon {
        font-size: 3rem;
    }
}

@media (max-width: 480px) {
    .workflow-step {
        margin-bottom: 3rem;
    }
}


/* Line CSS Start here */

.lp-sec .svg-container{
    position: absolute;
    top: 0;
    display: flex;
    /* align-items: center; */
    justify-content: center;
    width: 100%;
    height: 100%;
}

.svg-container .svg{
    height: 100%;
}
/* Line CSS End here */



/* Learning path End hear */



/* Testimonial Start Here */

.testimonialCont .pover {
    height: 10em;
}

.testimonialCont .card-header {
    background-color: white;
}

/* Testimonial End Here */

/* FAQ Start here */

.faq_sec {
    background-color: white;
}

/* FAQ End here */


/* Blog Start here */

.blog_by_ntech {
    background-color: #00000012;
}

.blog_by_ntech .card {
    --bs-card-border-color: none;
}

/* Blog End here */


/* Media Query Start here */

/* Small devices (phones, 600px and down) */
@media only screen and (max-width: 667px) {
  .new_home_Course .card {
    --bs-card-border-width: 0;
    max-width: 82vw;
}

.new_home_Course .swiper {
    width: 96%;
    height: 100%;
}

.why-section .row>* {
    padding-right: unset;
    padding-left: unset;
}
}

/* Medium devices (tablets, 601px to 768px) */
@media only screen and (min-width: 668px) and (max-width: 768px) {
  .new_home_Course .card {
    --bs-card-border-width: 0;
    max-width: 50vw;
}
}

/* Large devices (laptops/desktops, 769px to 1200px) */
@media only screen and (min-width: 769px) and (max-width: 1200px) {
  .new_home_Course .card {
    --bs-card-border-width: 0;
    max-width: 45vw;
}
}

/* Extra large devices (large desktops, 1201px and up) */
@media only screen and (min-width: 1201px) {
  .new_home_Course .card {
    --bs-card-border-width: 0;
    max-width: 35vw;
}
}

/* Example for a specific device orientation (e.g., landscape mode for phones) */
@media only screen and (max-width: 768px) and (orientation: landscape) {
  .new_home_Course .card {
    --bs-card-border-width: 0;
    max-width: 45vw;
}
}

/* Media Query End here */
















/* Not in Used for now */
/*Home Start here */
.new_all_Course .nav-pills,
.new_all_Course .nav-link.active,
.new_all_Course .show>.nav-link {
    --bs-nav-pills-border-radius: 5px;
    --bs-nav-pills-link-active-color: #fff;
    --bs-nav-pills-link-active-bg: var(--primary-purple);
}

.new_all_Course .nav-link {
    color: var(--primary-purple);
    border: 2px solid var(--primary-purple);
    margin: 5px 0.25em;
}

.new_all_Course .card {
    --bs-card-border-width: 0;
    max-width: 45vw;
}

.new_all_Course .card-title {
    font-weight: 700;
}

.new_all_Course .col-10 {
    padding-left: 0;
    padding-right: 0;
    font-weight: 600;
}

.new_all_Course .card-text {
    padding-top: 0;
}

.new_all_Course .card-footer {
    padding-top: 0;
}

.new_all_Course .btn-outline-dark {
    padding: 5px 10px;
    --bs-btn-active-color: var(--primary-purple);
    --bs-btn-active-bg: white;
}

.new_all_Course .btn-dark {
    padding: 5px 10px;
    border-radius: 6px;
    --bs-btn-hover-color: var(--primary-purple);
    --bs-btn-hover-bg: white;
    --bs-btn-active-bg: var(--bs-btn-hover-color);
}

/* Popular Sourses Start here */

/* course page CSS */
.text-justify { 
    text-align: justify; 
}












/* New CSS Updated By D */
:root {
    --primary-purple: #2A0134;
    /* --primary-purple: #76409B; */
    --logo-primary-purple: #6510A3;
    --logo-primary-orange: #f48001;
    --logo-secondry-orange: #F58102;
    --logo-third-orange: #FCB454;
}

.borderpri {
    border-bottom: 0.2rem solid var(--logo-primary-orange);
}

.colp {
    color: var(--primary-purple) !important;
}

.bgcolp {
    background-color: var(--primary-purple);
}

.col-lo {
    color: var(--logo-primary-orange);
}

.bgcol-lo {
    background-color: var(--logo-primary-orange);
}

.bg-gradiant {
    /* background: linear-gradient(90deg, var(--primary-purple) 35%, var(--logo-primary-orange)); */
    /* background-image: linear-gradient(to right top, #2a0134, #690045, #a71245, #d84534, #f48001); */
    background-image: linear-gradient(to right, #2a0134, #2a0134, #690045, #a71245, #d84534, #f48001);
}

.wbg {
    background-color: var(--background-color);
}

.new-tools-section {
    color: white;
    text-align: center;
    background-color: var(--primary-purple);
}

.btn-trans-white:hover {
    color: var(--primary-purple);
    background-color: white;
    /* transform: scale(105%); */
}

/*---------------------- Privacy Policy */

.privacyheading {
    height: 25vh;
}

.pri-lh {
    line-height: 1.6;
}

.fweight {
    font-weight: 700;
}

.anc {
    color: var(--primary-purple);
    text-decoration: none;

}

.anc:hover {
    color: var(--logo-primary-orange);
}


/* FAQ */
section.cousre-faq-section {
    color: var(--primary-purple);
}

/*--------------------------- why Ntech */

/* Styles for individual cards */
.whyntechdv {
    width: 90%;
    /* This might be too wide for horizontal scrolling, consider a fixed width */
    min-width: 280px;
    /* Set a reasonable minimum width for cards */
    max-width: 350px;
    /* Optional: set a maximum width */
    height: 260px;
    min-height: 250px;
    /* Ensure a consistent height for the cards */
    padding: 15px 10px;
    margin: 10px;
    /* Use consistent margin for spacing between cards */
    border: 1px solid var(--primary-purple);
    border-radius: 10px;
    box-sizing: border-box;
    flex-shrink: 0;
    /* Crucial: Prevents cards from shrinking in flex container */
    display: flex;
    /* Make the content within the card flex for vertical centering */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    /* Center text within the cards */
}

/* Target odd whyntechdv elements */
.whyntechdv:nth-child(odd) {
    color: white;
    background-color: var(--primary-purple);
}

/* Target even whyntechdv elements */
.whyntechdv:nth-child(even) {
    color: white;
    background-color: var(--primary-purple);
    /* color: var(--primary-purple);
    background-color: white; */
    /* color: white; */
    /* background-color:var(--logo-third-orange); */
    /* background-color:var(--logo-primary-orange); */
    /* background-color:var(--logo-secondry-orange); */
}

/* Style for the main heading */
.whyntechh {
    color: var(--primary-purple);
    /* Or black, depending on your design */
    margin-bottom: 20px;
}

/* Scroll Container - this is the viewport */
.whyntech.scroll-container {
    overflow: hidden;
    /* Hide the scrollbar and clip content */
    width: 100%;
    /* Ensure it takes full width */
    position: relative;
    /* Needed for positioning of inner content */
    /* Remove manual scrolling classes like d-md-flex and overflow-auto from this element */
}

/* Remove gray scrollbar */
.scroll-container::-webkit-scrollbar {
    display: none;
    /* For Chrome, Safari, and Opera */
}

.scroll-container {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

/* Inner wrapper that contains all content and gets animated */
.scroll-content-wrapper {
    display: flex;
    /* Make it a flex container */
    flex-wrap: nowrap;
    /* Prevent wrapping */
    animation: autoScroll 40s linear infinite;
    /* Adjust duration (e.g., 40s) for desired speed */
    animation-play-state: running;
    /* Start animation automatically */
}

/* Pause animation on hover for better user experience */
.scroll-container:hover .scroll-content-wrapper {
    animation-play-state: paused;
}

/* Keyframes for the automatic horizontal scroll animation */
@keyframes autoScroll {
    0% {
        transform: translateX(0);
    }

    100% {
        /* This value causes the first duplicated set to scroll completely out of view.
                   'calc(-50% - 20px)' assumes you duplicated your content exactly once, and
                   '20px' is roughly the combined margin of one card (10px left + 10px right).
                   You might need to fine-tune this value if your margins or card widths vary. */
        transform: translateX(calc(-50% - 20px));
    }
}

/* Responsive adjustments for smaller screens if needed */
@media (max-width: 767.98px) {
    .whyntechdv {
        width: 95%;
        /* Adjust width for smaller screens */
        min-width: 250px;
        margin: 10px auto;
        /* Center individual cards on small screens */
    }
}

/* Digital Marketing With AI Curriculum */
.btn-outline-dark {

    --bs-btn-color: var(--primary-purple);
    --bs-btn-border-color: var(--primary-purple);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-purple);
    --bs-btn-hover-border-color: var(--primary-purple);
    --bs-btn-focus-shadow-rgb: 33, 37, 41;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--primary-purple);
    --bs-btn-active-border-color: var(--primary-purple);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--primary-purple);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--primary-purple);
    --bs-gradient: none;
}

.card {
    color: var(--primary-purple);
    --bs-card-border-color: var(--primary-purple);
    background-color: white;
}

.card-header {
    color: var(--primary-purple);
    --bs-card-cap-padding-x: 0;
    --bs-card-cap-padding-y: 0;
    /* newByD*/
    border-bottom: 0;
}

.text-justify-custom {
    text-align: justify !important;
    /* Use !important if Bootstrap's default alignment is overriding */
}

.card-ph {
    min-height: 165px;
    /* text-overflow:; */
    overflow: hidden;
}



/* Navbar Styling Start */
/* .container img[class="img-fluid"] {
    width: 200px;
} */

/* 
@media screen and (max-width: 650px) {
    
}

@media screen and (min-width: 650px) and (max-width: 999px) {

}

@media screen and (min-width: 900px) {

} */

.navbar-brand {
    margin-right: 0;
}

.btn-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary-purple);
    --bs-btn-border-color: var(--primary-purple);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--logo-primary-orange);
    --bs-btn-hover-border-color: none;
    --bs-btn-focus-shadow-rgb: 66, 70, 73;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #4d5154;
    --bs-btn-active-border-color: #373b3e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--primary-purple);
    --bs-btn-disabled-border-color: var(--primary-purple);
    border-radius: 25px;
}

[class^="navbar-nav justify-content-center"]>li {
    font-size: 1.2rem;
    font-weight: 500;
    /* color: var(--primary-purple); */
}

/* [class^="navbar-nav justify-content-center"]>li>a {
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--primary-purple) !important;
} */


[class^="navbar-nav justify-content-center"]>li a {
    text-decoration: none;
    position: relative;
    transition: 0.4s;
}

[class^="navbar-nav justify-content-center"]>li a::before {
    content: "";
    position: absolute;
    width: 0;
    height: 3px;
    bottom: 0;
    left: 50%;
    background-color: var(--primary-purple);
    transition: all 0.4s;
}

[class^="navbar-nav justify-content-center"]>li a:hover::before {
    width: 100%;
    left: 0;
}

.nav-link:focus,
.nav-link:hover {
    color: var(--primary-purple);
}

/* 
    .nav-link:active {
        content: "";
        position: absolute;
        width: 100%;
        height: 3px;
        bottom: 0;
        left: 0;
    color: var(--primary-purple);
} */

    /* .container-fluid [class="img-fluid brand-logo"] {
    min-width: 250px !important;
} */

/* Nav */
.nav-scroll-wrapper {
    display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  white-space: nowrap;
  scroll-behavior: smooth; /* smooth scroll */
  scrollbar-width: none;   /* hide scrollbar for Firefox */
}


.nav-scroll-wrapper::-webkit-scrollbar {
  display: none; /* hide scrollbar for Chrome/Safari */
}

.nav-scroll-wrapper .nav-pills {
  display: flex;
  flex-wrap: nowrap; /* prevent wrapping */
}

.nav-scroll-wrapper .nav-item {
  flex: 0 0 auto; /* keep items same size */
}

/* Navbar Styling End */

/* Homepage Styling Start */
.homepg-hero {
    /* background-image: url('../images/BanerImg/home_banner.jpg'); */
    /* background-position: center center; */
    /* background-repeat: no-repeat; */
    /* background-size: cover; */
    background-color: var(--primary-purple);
    color: #f0f8ff;
    min-height: 98vh;
    max-height: max-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.ovarlay_box {
    height: 100%;
}

.homepg-hero {
    --display: flex;
    --flex-direction: column;
    --container-widget-width: 100%;
    --container-widget-height: initial;
    --container-widget-flex-grow: 0;
    --container-widget-align-self: initial;
    --flex-wrap-mobile: wrap;
    --gap: 0px 0px;
    --row-gap: 0px;
    --column-gap: 0px;
    --overlay-opacity: 0.3;
    --border-radius: 0px 0px 0px 0px;
    --padding-top: 100px;
    --padding-bottom: 100px;
    --padding-left: 60px;
    --padding-right: 35px;
}

.homepg-hero h5 {
    font-size: 24px;
    font-weight: 600;
    line-height: 1;
    box-sizing: border-box;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}

.homepg-hero h1 {
    font-size: 50px;
    font-weight: 700;
    line-height: 1.2em;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}

.homepg-hero .btn-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--primary-purple);
    --bs-btn-border-color: #fff;
    --bs-btn-hover-color: var(--primary-purple);
    --bs-btn-hover-bg: #fff;
    --bs-btn-hover-border-color: none;
    --bs-btn-focus-shadow-rgb: 66, 70, 73;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--logo-primary-orange);
    --bs-btn-active-border-color: var(--logo-primary-orange);
    border-radius: 15px;
    border-width: 2px;
}

.homepg-hero .elementor-icon svg {
    height: 36px;
    /* overflow: hidden; */
    /* display: inline; */
}

.elementor-icon svg {
    font-size: 36px;
    fill: #fff;
    overflow: hidden;
    display: inline;
    position: relative;
    width: 1em;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
    /* overflow-clip-margin: content-box; */
}



/* Homepage Styling End */




/* in between css/ */
/* New Class Updated By D */
.new-course-hero {
    background-image: url('../images/background-img/Purple_Background_Img.jpg');
    background-repeat: round;
    background-color: #2A0134;
    color: #f0f8ff;
    min-height: 100vh;
    /* max-height: auto; */
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.dropdown-content{
    box-sizing: border-box;
    width: 99vw;
}
.dropdown-content .row{
    width: 100%;
}

.aboutcareer .anc{
    color: white;
}