/* Mobile Responsive CSS */
@media (max-width: 1024px) {
    .row {
        flex-direction: column;
        padding: 10px 20px;
    }
    .col-3, .col-4, .col-5, .col-6 {
        width: 100%;
    }
    .logo > h1 {
        font-size: 30px;
    }
    .logo > h3 {
        font-size: 20px;
    }
    .hero-txt h1 {
        font-size: 40px;
    }
}

@media (max-width: 768px) {
    .logo-content>.row{
        flex-direction: row;
    }
    .logo {
        display: flex;
        height: auto;
        line-height: 1.2;
        
    }
    .logo img{
    width: 16vw;
    height: auto;
    }
    .logo  h1 {
        font-size: 17px;
        text-align: left !important;
    }
    .logo  h3 {
        font-size: 9px;
        text-align: center;
        justify-content: center;
        font-weight: 600;
    }
    .digital-india{
        max-width: 50px;
    }
    .container {
        padding: 0px;
        overflow-x: hidden;
    }
    .menu-toggle {
        display: block;
    }
    ul.nav-links {
        display: none;
        flex-direction: column;
        width: 100%;
        background-color: #0F3D44;
        top: 50px;
        left: 0;
        text-align: center;
        padding: 10px 0;
    }

    .nav-links.active {
        display: flex;
        z-index: 9999;
    }

    .nav-links li {
        width: 100%;
        padding: 5px 0;
    }

    .nav-links ul {
        position: static;
        background: none;
    }
    .nav-links ul li {
        width: 100%;
        text-align: left;
        padding:2px;
        font-size: 12px;
    }

    .swiper {
        height: 250px;
    }
    .hero-txt h1 {
        font-size: 30px;
    }
    .footer-container {
        flex-direction: column;
        align-items: center;
    }
    .footer-column {
        text-align: center;
        width: 100%;
    }
    .footer-column h3 {
        font-size: 14px;
    }
    .footer-bottom{
        flex-direction: column;
    }

    .row {
        flex-direction: column;
        padding: 10px 0px;
    }
    .col-3, .col-4, .col-5, .col-6 {
        width:98%;
    }
    .fix-col {
        display: flex;
        align-items: center;
        flex-direction: column;
        text-align: center;
        min-width: 220px;
        max-width: 100%;
    }

    .hero-txt h1 {
        text-align: center;
        font-size: 20px !important;
        padding: 0px 30px;
    }
    h1 {
        font-size: 20px;
    }
    h2{
        line-height: 1.3;
        font-size: 15px;
        color:#0F3D44;
    }
    h3{
        font-size: 14px;
    }
    a{
        font-size: 12px !important;
        padding:0px !important;
    }
    p{
        font-size: 12px;
    }
    .swiper{
        height:65% !important;
    }
    .swiper-slide{
        height:65% !important;
    }
    .swiper-button-next, .swiper-button-prev{
        top:30% !important;
        height: 25px !important;
        width: 20px !important;
    }
    .swiper-button-next:after, .swiper-button-prev:after{
        font-size: 15px !important;
    }
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{

      display: none;
    }
    label{
        font-size: 15px;
        margin-top:5px;
    }
    input{
        padding: 5px 5px;
        line-height: 1.3;
    }
     select{
        width: 98%;
        padding: 5px 5px;
        line-height: 1.3;
    }
    .question-title p{
        text-align: left !important;
        letter-spacing: 0rem;
    }

}

@media (max-width: 480px) {
    body {
        font-size: 12px;
    }
    .row {
        padding: 5px;
    }
   
    .hero-txt h1 {
        font-size: 25px;
    }
    button, .button-2 {
        padding: 8px 12px;
        font-size: 14px;
    }
    .calendar-container {
        flex-direction: column;
        min-width: 100px;
    }
    .month-name, .day-name, .day-number, .year {
        font-size: 14px;
    }
    table th, table td {
        font-size: 12px;
        padding: 3px 5px;
    }
}