

/* -------------------- Media Query For Home Start --------------------- */


@media (max-width:992px) {
    .line-grid{
        display: none;
    }
    .container{
        width: auto;
        max-width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
    #header {
        margin-bottom: 0;
        position: fixed;
        left: 0;
        top: 0;
        right: 0;
        z-index: 111;
        padding-top: 12px;
        padding-bottom: 12px;
        background: #fff;
    }
    #header .col-lg-6 img{
        margin-bottom: 0;
        padding-bottom: 0;
        width: 45px;
    }
    .text-center-in-resp{
        text-align: center;
    }
    .logo-responsive {
        order: 1;
        position: relative;
        z-index: 1;
    }
    .sara-zaman-text-responsive{
        order: 2;
    }
    .menu-res{
        order: 3;
    }
    .menu {
        position: absolute;
        left: 0;
        right: 0;
        top: 81px;  
        display: block;
        background: white;
        padding-top: 0px;
        padding-bottom: 20px;
        z-index: 10;
        transition: none ;
        display: none;
        box-shadow: 0px 5px 5px rgba(0,0,0,.1);
        z-index: 10;
    }
    .menu ul{
        flex-flow: wrap column;
        margin-bottom: 0;
        /* width: 80%; */
    }
    .menu ul li{
        text-align: center;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .menu ul li a{
        color: black;
        font-size: 4vw;
    }
    .menu-btn {
        background: #fff;
        height: auto;
    }
    .menu-btn{
        display: block !important;
        z-index: 10;
        position: relative;
        background: none;
        border: none;
    }
.menu-btn .bars {
    width: 40px;
    height: 1px;
    margin-bottom: 0;
    display: block;
    font-size: 0;
    background-color: black;
    transition: all .5s linear;
    display: block;
    margin: 11px 0 !important;
}
.menu-btn.active .bar1 {
    background-color: black;
    transform: rotate(45deg);
    margin-bottom: 0px;
    position: relative;
    top: 7px;
    left: 0px;
}
.menu-btn.active .bar3 {
    background-color: black;
    transform: rotate(-45deg);
    margin-top: -18px;
    position: relative;
    top: -17px;
}

    .menu-btn span:last-child{
        margin-bottom: 0;
    }
    #banner-section .banner-content .banner-text p{
        display: none;
    }
    #main {
        margin-top: 0;
        padding-top: 100px;
    }
    .banner-content .name h1{
        font-size: 20vw !important;
    }
    #banner-section .banner-content .banner-text p{
        right: 76%;
        left: 40vw;
    }
    #banner-section{
       height: calc(100vh - 100px);
    }
    html #banner-section .banner-content .banner-img{
        position: static;
    }
html #banner-section .banner-content .banner-img img {
    padding-left: 0vw !important;
    padding-right: 0vw !important;
    max-width: 65%;
}
    #early-life-section{
        margin-top:0;
        padding-top: 160px;
        padding-left: 0;
        padding-right: 0;
    }
    #early-life-section h1{
        font-size: 12vw ;
    }
    #early-life-section .row .mt-5,
     #early-life-section .row .pt-5  {
        padding-top: 0 !important;
        margin-top: 0 !important;

    }

#early-life-section .row-middle {
    border-bottom: 1px solid #000;
    padding-bottom: 50px;
    padding-top: 0;
}    
#early-life-section p {
    padding-right: 17px;
    font-size: 14px;
}
#early-life-section .row-bottom {
    border-bottom: 1px solid #000;
    padding-bottom: 20px;
    padding-top: 20px;
}
#early-life-section .row-bottom p {
    font-size: 5vw;
    margin: 0;
}

#education-section .row-second h1{
    font-size: 12vw;
}
#education-section .row-second p {
    font-size: 14px;
    font-family: 'MADE Mirage';
    font-weight: 400;
}
.education-text {
    padding-top: 20px;
}
.international-padding {
	padding-top: 0;
	padding-bottom: 0;
}

.early-life-section-text-1{
    width: 100% ;
}
.early-life-section-text-1 .col-lg-2{
    width: 50% ;
}
.early-life-section-text-2{
    width: 100%;
}
.early-life-section-text-2 .col-lg-2{
    width: 50%;
}
#early-life-section .row-bottom p{
    font-size: 5vw;
}
#education-section{
    padding-left: 6vw;
    padding-right: 6vw;
}
.Kinnaird-Formal{
    width: 100%;
}
.Kinnaird-Formal .col-lg-4{
    width: 50%;
}
#footer .footer-top .footer-text {
    border-bottom: 1px solid #000;
    padding-bottom: 30px;
}
    #footer .footer-middle {
    padding-top: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #000;
}
#footer .footer-middle .footer-text h2 {
    font-family: 'MADE Mirage';
    font-weight: 100;
    font-size: 32px;
    text-align: center;
    padding-bottom: 25px;
}
#footer .footer-middle .footer-text h2 br{
    display: none;
}

#footer .footer-middle .footer-text p {
    margin-bottom: 20px;
    font-family: 'MADE Mirage';
    font-weight: 100;
    font-size: 20px;
    padding: 0 !important;
}
.footer-img-wrapper{
    padding-bottom: 20px;
}
.footer-ul{
    display: none !important;
}

#footer .footer-bottom .container {
    padding: 0;
}
.footer-text{
    display: block;
}
.footer-text span {
    text-align: right;
}

.banner-section-glance .banner-heading-text span {
    display: none;
}
.founder-section-glance{
    padding-bottom: 0;
}
.founder-text {
    padding-bottom: 40px;
}
    #footer .footer-top .footer-text h2 {
        font-size: 38px;
        margin: auto;
    }
    #education-section .row .col-lg-6 .education-img-wrapper img{
        width: 100%;
    }
    #education-section .row .col-lg-6 .education-img-wrapper{
        max-width: 92% !important;
    }
    .history-section-container{
        margin-top: 250px;
    }
    .history-section-container .history-row .row{
        width: 100%;
    }
    .history-section-container .history-row .row .col-lg-2{
        width: 50%;
    }
    .step2{
        margin-top: 720px;
    }
    #history-section .history-row .col-lg-2 .history-text {
        margin-top: 0px;
    }
    #history-section .history-row .history-text{
        border-left: none;
    }
    #history-section .history-row .step2 .history-text{
        padding-top: 0px;
    }
    #history-section .history-row .history-graphic {
        top: 125px;
        max-width: 100%;
    }
    .history-graphic img{
        max-width: 100%;
        width: 100vw;
    }
    #history-section .history-row .history-additional-info{
        position: static;
    }
    #history-section .flex-row-reverse + .history-graphic{
        left: 0 !important;
        top: 0 !important;
    }
    .static-additional-text{
        margin-top: 60px;
    }
    .flex-row-reverse .step1{
        height: 0px;
    }
    .flex-row-reverse .step3{
        margin-top: -175px !important;
        height: 100%;
    }
    .history-text {
        padding-bottom: 30px !important;
        margin-top: 0 !important;
        padding-top: 40px !important;
        padding-left: 50px;
        padding-right: 60px;
    }
    .flex-row-reverse .step5{
        margin-top: -175px;
    }
    .history-logo-footer{
        position: static;
        padding-bottom: 15px;
    }
    .career-years{
        width: 100%;
    }
    .career-years .col-lg-6{
        width: 50%;
    }
    #career-section .col-lg-6{
        padding-top:0 !important;
    }
    #career-section .col-lg-6 .mb-5,
    #career-section .col-lg-6 .pb-5{
        padding-bottom: 0!important;
        margin-bottom: 0 !important;
    }
    .performances-text {
        margin-bottom: 30px;
        padding-left: 0;
    }

    #career-section .col-lg-4 + .p-1{
        display: none !important;
    }


    .international-img-wrapper img,
    .education-img-wrapper img,
    .activism-img-wrapper img,
    .activism-img-wrapper img{
        height: 150px;
        mix-blend-mode: darken;
    }

    .career-years-outer .order-1{
        order: 2;
    }
    .career-years-outer .order-2{
        order: 1;
    }
    .career-img-wrapper img{
        width: 100%;
    }
    #international-performances-section{
        padding-bottom: 25px;
        margin-bottom: 40px;
    }
    .career-img-wrapper > img,
    .international-img-wrapper2 > img{
        margin-bottom: 50px;
    }
    .performances-text-left{
        padding-bottom: 0 !important;
    }
    .performances-text{
        margin-bottom: 30px;
    }
    .international-img-wrapper2 h1{
        top:0px;
        padding-left: 0px;
        font-size: 52px;
    }
    .international-img-wrapper2 img {
        width: 100%;
    }
    .performances-text-1-outer{
        width: 100%;
        padding-bottom: 15px;
        padding-top: 15px;
    }
    .performances-text-left{
        float: left;
        width: 50%;
        /* padding-right: 1vw; */
    }
    .performances-text-right{
        float: right;
        width: 50%;
        /* padding-left: 1vw; */
    }    
    .performances-text-1-outer div + div{
        padding-bottom: 22px;
        padding-top: 0px;
    }
    .performances-text-3-outer{
        padding-top: 20px;
    }
    .performances-text-2-outer{
        width: 100%;
    }
    .performances-text-2-outer .performances-text{
        text-align: justify;
    }
    .extra-padding .order-1 .performances-text{
        position: relative;
    }
    .extra-padding .order-1 .performances-text h1{
        position: absolute;
        top: -600px;
    }
    .extra-padding .order-1{
        order: 2;
    }
    .extra-padding .order-2{
        order: 1;
    }
    .performances-img-wrapper img{
        width: 100%;
        padding-top: 70px;
    }
    .performances-row-1{
        width: 100%;
        padding-top: 40px !important;
    }
    .performances-row-1 .col-lg-3{
        width: 50%;
    }
    #performances .container .padding-left {
        padding-left: 0px;
        margin-bottom: 0px;
    }
    .performance-before::before{
        background-color: white;
    }
    .Sazavaaz-karachi{
        padding-top: 20px;
    }
    .performances-row-2{
        width: 100%;
    }
    .performances-row-2 .col-lg-2{
        width: 50%;
    }
    #activism .activism-text h2 + h2{
        font-size: 25px;
    }

    .international-img-wrapper2 h1,    
    .performances-text h1,    
    #activism .activism-text h2 {
        font-size: 10vw;
    }
    .international-img-wrapper2 h1{
        position: static;
        margin-bottom: 50px;
    }
    #activism .row {
        width: auto;
        margin: 0;
        padding: 0;
    }
    #activism .activism-left .records {
        padding-right: 20px;
        padding-left: 20px;
    }
    #activism .activism-right .records {
        padding-left: 25px;
        padding-right: 20px;
        margin-top: -2px;
    }
    #activism .activism-left .records h2, #activism .activism-right .records h2 {
        font-family: 'MADE Mirage';
        font-weight: 300;
        font-size: 20px;
        margin-bottom: 20px !important;
    }
    #activism .activism-left .records strong, #activism .activism-right .records strong {
        font-size: 12px;

        display: block;
    }

    #activism .row .col-lg-6{
        width: 50%;
    }
    .activism-right{
        max-height: 100% !important;
    }
    .activism-left{
        padding-right: 10px;
    }
    #career-second-section .career-text {
        padding-right: 0;
        padding-top: 20px;
        padding-left: 0;
    }
    #career-second-section .career-text h1{
        text-align: center;
    }
    html #header .header-part-1{
        position: relative;
        padding: 40px 40px 110px 40px !important;
    } 
    .nav-section.col-lg-4.col-6{
        position: absolute;
        left: 320px;
        top: 65px;
        width: auto;
    }
    .container-fluid.justify-content-end{
        position: relative;
    }
    .navbar-light .navbar-toggler{
        color: none !important;
        border-color: none !important;
        border: none !important;
    }
    .navbar-toggler:focus{
        box-shadow: none !important;
    }
    .navbar-toggler-icon{
        width: 50px !important;
    }
    
    .order-1{
        order: 2 !important;
    }
    .order-2{
        order: 1 !important;
    }
    .header-logo-img{
        width: auto;
        position: absolute;
        left: 40px;
    }
    .header-logo-img img{
        width: 70px ;
    }
    .header-logo-text{
        position: absolute;
        left: 142px;
        top: 75px;
        width: auto;
    }
    .header-part-2{
        padding: 35px 0 0 0 !important;
    }
    .publications-header{
        margin-top: 15px !important;
    }
    .publications-header-nav{
        margin: 0 !important;
    }
    .publications-header-nav ul li{
        padding-top: 20px !important;
    }
    .publications-layout-heading h1{
        text-align: center;
    }
    .aag-performance,.raag-malhaar,.early-years,.school-days,
    .raag-malhaar-2,.golden-memory,.international-representation,
    .learning-sessions,.jury-member{
        margin: 20px 35px 30px !important;
    }

    #footer .footer-bottom{
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .footer-text h4{
        font-size: 17px !important;
        font-family: 'MADE Mirage';
        font-weight: 400 !important;
        font-style: normal;
        text-transform: uppercase;
    }
    .copy-right-text{
        text-align: start !important;
        padding-top: 90px;
        font-size: 16px;
        font-family: 'MADE Mirage';
        font-weight: 400;
        font-style: normal;
        letter-spacing: 1px !important;
    }
    #footer .footer-bottom .container .row .nav-section .navbar-collapse{
        position: absolute;
        left: 0px;
        top: 45px;
    }
    #header .container .row {
        padding-top: 0px;
    }
    .order-resp-1{
        order: 1;
    }
    .order-resp-2{
        order: 2;
    }

    .order-resp-3{
        order: 3;
    }  
    .music-banner-section .music-banner-text {
        padding-right: 40px;
        padding-top: 70px;
        text-align: justify;
    }
    
    .music-banner-section .music-banner-text h1 {
        text-align: center;
    }
    .sarazaman-heading-caption{
        display: flex;
        justify-content: center;
    }
    .music-banner-section .music-banner-text p {
        font-size: 4vw;
    }
    .music-album-section .album-content .music-album-img-wrapper img {
        width: 100%;
    }
    .music-main-footer .container {
        max-width: 100%;
    }
    #footer .footer-bottom .container .row {
        width: 100%;
    }
    .music-album-description strong{
        font-size: 8vw !important;
    }
    .music-album-description p{
        font-size: 5vw !important;
    }
    .my-in-resp{
        margin: 20px 0;
    }
    .music-banner-img-wrapper > img {
        width: 100%;
    }
    .music-banner-section .music-banner-text h1 {
        font-size: 13vw;
    }
    .music-banner-section .music-banner-text span {
        text-align: center;
    }
    .music-banner-section .music-banner-text span {
        display: flex;
        justify-content: center;
    }
    .music-detailpage-playlist-section .playlist-header h1 {
        text-align: center;
        margin-bottom: 50px;
    }
    .music-detailpage-playlist-section .playlist-data h4 {
        font-weight: 600;
        font-size: 3vw;
    }
    .music-detailpage-footer-playstaion-img > img {
        width: 100%;
    }
    .align-left-in-res{
        display: flex;
        justify-content: center !important;
    }
    .music-banner-section .music-banner-text {
        padding-right: 0px;
    }
    .music-detailpage-playlist-content .row .col div{
        border-right: 1px solid black;
        margin-left: 5px;
        margin-right: 0;
        height: 60px;
    }
    .br-in-res{
        border: 0 !important;
    }
    .m-in-res {
        margin: 30px 0;
    }

    .founder-img-wrapper-glance {
        margin-left: 0px;
    }
    .founder-img-wrapper-glance img {
        width: 100%;
    }
    .banner-img-wrapper-glance {
        margin-left: 0;
        margin-bottom: 50px;
    }
    .banner-img-wrapper-glance img {
        max-width: 100%;
        width: 100%;
    }
    .founder-section-glance .founder-text-heading{
        padding-top: 50px;
    }
    .founder-text h1 {
        font-size: 8vw;
    }
    .m-lessend-in-res{
        margin: 0 !important;
    }
    .mt-reset-in-resp{
        margin-top: 50px !important;
    }
    .banner-section-glance .banner-heading-text span {
        margin-bottom: 50px;
        margin-top: 0 !important;
    }
    .banner-section-glance .banner-heading-text h1 {
        font-size: 10vw;
        padding-bottom: 0 !important;
    }
  
    .mt-reset-in-resp + .col-6{
        width: 100%;
        max-width: 100%;
        text-align: center;
    }
    .mt-reset-in-resp + .col-6 p strong{
        display: block;
        padding-bottom: 10px;
    }
    .publication-photos-open-banner-section .publication-photos-open-banner-header nav ul li a {
        font-size: 2.9vw;
        letter-spacing: 0px;
        white-space: nowrap;
    }
    .publication-photos-open-banner-img img {
        width: 100%;
    }
    .publication-photos-open-banner-subcontent-heading {
        padding-top: 50px;
    }
    .publication-photos-open-banner-subcontent-graphics {
        padding-top: 50px;
    }
    .publication-photos-open-gallery-caption-header strong{
        font-size: 5vw !important;
    }
    .publication-photos-open-gallery-items {
        margin-right: 0px;
    }

.publication-photos-open-banner-section {
    background-color: var(--main-color);
    padding: 20px 0 10px 0;
}
.publication-photos-open-banner-header .publication-photos-open-banner-nav{
    padding-top: 0 !important;
}
.publication-photos-open-banner-section .publication-photos-open-banner-header h1 {
    font-family: 'MADE Mirage';
    font-weight: 100;
    font-size: 40px;
}
.publication-photos-open-banner-header  ul {
    display: block !important;
}
.publication-photos-open-banner-header  ul li{
    margin:10px 0;
}
.publication-photos-open-banner-section .publication-photos-open-banner-header nav ul li a {
    font-size: 20px;
    letter-spacing: 0px;
    white-space: nowrap;
    display: block;
    position: relative;
    padding: 0;
}

    #education-section .row .align-self-center .education-text p{
        margin-bottom: 50px;
    }
    .history-logo {
        z-index: 1;
        mix-blend-mode: darken;
        top: 0;
        position: relative;
        margin-bottom: 50px;
    }
    #history-section  > .container > .history-row > .row {
        margin-top: 50px;
    }
    #header.sticky-top .container .row{
        padding-top: 0;
    }
    #header h1{
        margin: 0;
    }
    #header.sticky-top .col-lg-6 img {
        padding-bottom: 0;
    }
    #history-section{
        display: none;
    }
    #mobile-only-history-section{
        display: block;
    }
    #mobile-only-history-section h2{
        font-size: 20px;
        font-family: 'MADE Mirage';
        font-weight: 300;
    }
    #history-section > .container > .history-content .history-text h2{
        font-size: 20px;
        font-family: 'MADE Mirage';
        font-weight: 300;
    }
    .history-additional-info {
        padding-top: 50px;
        padding-left: 50px;
        padding-right: 60px;
    }
    .p-zero-in-resp{
        padding-top: 0;
        padding-bottom: 0;
    }
    .menu > div.justify-content-end{
        justify-content: center !important;
    }
    #early-life-section p {
        padding-left: 0;
    }
    #career-section .career-text h2 {
        padding-bottom: 15px;
        margin-bottom: 0;
    }
    img[src*="career-sarazaman-img.png"] {
        position: static;
    }
    .mb-zero-in-resp {
        margin-bottom: 0 !important;
    }
    #career-section {
        padding: 30px 0;
    }
    #international-performances-section .international-img-wrapper {
        padding-bottom: 50px;
    }
    .p-zero-in-resp{
        padding-bottom: 0 !important;
    }
    #performances {
        margin-bottom: 50px;
    }
    #activism .activism-left .records::before {
        right: -15%;
        left: auto;
    }
    #activism .activism-right .records:nth-child(6) {
        margin-top: -18px;
    }
    .footer-text {
        padding-left: 0px;
        padding-right: 0px;
      }
      .p-zero-in-resp-footer-top{
        padding-left: 0px;
        padding-right: 0px;
      }

    /* -------------------------------------------------- slider ------------------ */


    .slick-prev::before, .slick-next::before {
        position: absolute;
        top: 0;
        left: -16px;
    }
    .slick-prev::before {
        content: url('https://demo.digitalwebdrive.com/sz/wp-content/themes/sz/images/arrow-prev.png');
        padding-left: 16px;
    }
    .slick-next::before {
        content: url('https://demo.digitalwebdrive.com/sz/wp-content/themes/sz/images/arrow-next.png');
    }
    .slick-prev {
        left: 0px;
        position: relative;
        z-index: 1;
        height: 40px;
        width: 35px;
        overflow: hidden;
    }
    .slick-next {
        right: 16px;
        z-index: 1;
        height: 40px;
        width: 35px;
        overflow: hidden;
    }

        /* ------------------------- Media Query for Analytical-listening Page (Farooq) ---------------------------------- */
    /* -------- General Small Screen Classes -------------- */
    .text-center-sm{
        text-align: center !important;
    }
    .text-left-sm{
        text-align: left !important;
    }
    .text-right-sm{
        text-align: right !important;
    }
    .d-none-in-sm{
        display: none;
    }
    .d-block-sm{
        display: block;
    }
    .mb-3-sm{
        margin-bottom: 16px;
    }
    .mb-4-sm{
        margin-bottom: 24px;
    }
    .mb-5-sm{
        margin-bottom: 48px;
    }
    .pb-3-sm{
        padding-bottom: 16px;
    }
    .pb-4-sm{
        padding-bottom: 24px;
    }
    .pb-5-sm{
        padding-bottom: 48px;
    }
    .pr-0-sm{
        padding-right: 0 !important;
    }
    .pl-0-sm{
        padding-left: 0 !important;
    }
    .p-0-sm{
        padding: 0 !important;
    }
    .mr-0-sm{
        margin-right: 0 !important;
    }
    .ml-0-sm{
        margin-left: 0 !important;
    }
    .m-0-sm{
        margin: 0 !important;
    }
    /* ----------------------------------------------------- */

    .container{
        width: auto;
        padding: 0 20px;
    }
    .page-headings .analytical-heading {
        font-size: 9vw;
        text-align: center !important;
    }
    .page-headings .analytical-sub-heading {
        font-size: 5vw;
        text-align: center !important;
    }
    .analytic-term-heading {
        font-size: 14px;
        display: block !important;
    }
    .analytical-para {
        text-align: left;
    }
    .section-7-para-2 > .analytical-para > .analytic-term-heading{
        display: inline !important;
    }
    .promise-bold-text {
        text-align: left !important;
    }
    .analytical-heading {
        font-size: 6vw;
        text-align: left !important;
    }
    .terms-section > .terms-section-main-heading > .analytical-heading{
        font-size: 14px;
    }
    .terms-section-list-num > .list-num > li > .analytic-term-caption{
        display: block;
    }

    /* ------------------------- Media Query for Basic-analysis Page (Farooq) ---------------------------------- */
    .basic-analysis-padd-r-100{
        padding-right: 0 !important;
    }
    .basic-analysis-pad-left-0 {
        padding-left: 0;
    }
    /* ------------------------- Media Query for Bibliography Page (Farooq) ---------------------------------- */
    .bibliography-img-1-flower-position {
        top: 0;
    }
    /* ------------------------- Media Query for Raag-Vaads Page (Farooq) ---------------------------------- */
    .raag-vaads-img-1-wrapper {
        top: 0;
    }
    .intonation-img-wrapper {
        left: 0;
    }
    .pl-none {
        padding-left: 12px !important;
    }
    .padd-r-150 {
        padding-right: 12px !important;
    }
    /* ------------------------- Media Query for Raag-Vaads Page (Farooq) ---------------------------------- */
    .courses-footer-bird-img {
        top: 0;
    }
}


/* ------------------------------------------------- 992 end -------------------------------------------------- */

/* Don't remove/comment the code below */
@media (max-width: 992px) and (min-width: 576px){
    .container{
        padding: 0;
    }

}
@media (max-width: 768px) and (min-width: 576px){
    .container{
        padding: 0;
    }
}
/* _________________________________________________________________________________________________________ */
/*
@media (min-width: 1201px) and (max-width: 1399px){
    .pr-in-xlg{
        padding-right: 15px;
    }
    .music-banner-section .music-banner-text p {
        font-size: 16px;
    }
}
@media (min-width:993px) and (max-width:1200px){
    .publications-layout .img-section img {
        width: 100%;
    }
    .aag-performance,.school-days,.international-representation{
        margin: 20px 14px 30px 0 !important;
    }
    .raag-malhaar, .raag-malhaar-2, .learning-sessions{
        margin: 20px 14px 30px 7px;
    }
    .early-years,.golden-memory,.jury-member{
        margin: 20px 14px 30px 13px;
    }
    .publications-layout .text-section p:first-child{
        font-size: 12px;
    }
    .copy-right-text {
        padding-right: 75px;
    }
    #header .container {
        max-width: 100%;
        padding: 0 30px;
    }
    .music-banner-section .music-banner-text {
        padding-right: 30px;
    }
    .music-banner-section .music-banner-text p {
        font-size: 15px;
    }
    .pr-in-lg{
        padding-right: 10px;
    }

}
*/

/* --------------------------------------------------- 1200 end ------------------------------------------------ */

/*
@media (min-width:769px) and (max-width:991px){
    .header-logo-text {
        position: absolute;
        left: 0vw;
        top: 40px;
        width: auto;
    }
    .header-logo-text h1{
        font-size: 20px !important;
    }
    .header-logo-img {
        width: auto;
        position: absolute;
        left: 40vw;
    }
    html .col-lg-4.header-logo-img.order-2 img {
        width: 100px;
    } 
    .nav-section.col-lg-4.col-6{
        position: absolute;
        right: 0vw;
        top: 38px;
        width: auto;
    }
    .navbar-light .navbar-toggler{
        color: none !important;
        border-color: none !important;
        border: none !important;
    }
    .navbar-toggler:focus{
        box-shadow: none !important;
    }
    .publications-header-heading{
        padding-top: 30px;
    }
    .publications-header-heading h1{
        font-size: 40px !important;
    }
    .publications-header-nav ul li{
        font-size: 14px;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .publications-layout-heading h1{
        font-size: 23px !important;
    }
    .aag-performance, .raag-malhaar, .early-years, 
    .school-days, .raag-malhaar-2, .golden-memory, 
    .international-representation, .learning-sessions, 
    .jury-member {
        margin: 20px 20px 30px !important;
    }
    .publications-layout .img-section img {
        width: 100%;
    }
    #footer .footer-bottom {
        padding-top: 20px;
        padding-bottom: 40px;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .footer-text h4{
        font-size: 20px !important;
    }
    #footer .footer-bottom .container .row{
        width: 100%;
    }
    .footer-text-outer{
        width: 50%;
    }
    .copy-right-text-outer{
        width: 50%;
    }
    .copy-right-text{
        padding-top: 0px !important;
        letter-spacing: 0px !important;
        text-align: end !important;
    }
    footer{
        overflow: hidden;
    }
    .container {
        width: auto;
        max-width: 100%;
    }
    .pr-in-md {
        padding-right: 20px;
    }
    .music-banner-section .music-banner-text span {
        font-size: 14px;
    }
    .music-banner-section .music-banner-text h4 {
        font-size: 4vw;
    }
    .music-banner-section .music-banner-text p {
        font-size: 2vw;
    }
    .music-album-description strong {
        font-size: 4vw !important;
    }
    .music-album-description p {
        font-size: 3vw !important;
    }
    #footer .container {
        max-width: 100% !important;
    }
    #footer .footer-bottom .footer-text span {
        font-size: 14px;
    }
    #footer .footer-bottom .footer-ul li a {
        font-size: 18px;
    }
    .footer-text h4 {
        font-size: 20px !important;
    }
    #banner-section .banner-content .banner-text {
        left: -10vw;
    }

}
/*

/* ---------------------------------------------- 769 end ----------------------------------------------------- */

/*
@media (min-width:577px) and (max-width:768px){
    .header-logo-img{
        left: 0vw;
    }
    .header-logo-img img{
        width: 85px !important;
    }
    .nav-section.col-lg-4.col-6{
        left: 85vw;
    }
    .header-logo-text{
        left:36vw;
    }
    .header-logo-text h1{
        font-size: 19px !important;
    }
    .publications-header-heading h1{
        font-size: 37px !important;
    }
    .publications-header-nav ul li{
        font-size: 14px;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .navbar-light .navbar-toggler{
        color: none !important;
        border-color: none !important;
        border: none !important;
        padding: 0px !important;
    }
    .navbar-toggler:focus{
        box-shadow: none !important;
    }
    .navbar-collapse{
        position: absolute;
        top: 110px !important;
        left: -89vw !important;
        background: white;
        width: 100vw;
        padding-left: 45px;
        padding-top: 8px;
        padding-bottom: 4px;
    }
    .publications-header {
        margin-top: 30px !important;
    }
    .publications-layout-heading h1{
        font-size: 23px !important;
    }
    .publications-layout .img-section img {
        width: 100%;
    }
    .aag-performance, .raag-malhaar, .early-years, 
    .school-days, .raag-malhaar-2, .golden-memory, 
    .international-representation, .learning-sessions, 
    .jury-member {
        margin: 20px 30px 30px !important;
    }
    #footer .footer-bottom .container .row{
        width: 100%;
    }
    .footer-text-outer{
        width: 50%;
    }
    .copy-right-text-outer{
        width: 50%;
    }
    .copy-right-text{
        padding-top: 0px !important;
        letter-spacing: 0px !important;
        text-align: end !important;
    }
    #footer .footer-bottom{
        padding-bottom: 50px;
    }
}
*/

/* --------------------------------------------------------------------------------------------------- */

/*
@media (min-width:421px) and (max-width:576px){
    .header-logo-img img {
        width: 65px;
    }
    .header-logo-img{
        left: 20px;
        top: 20px;
    }
    .nav-section.col-lg-4.col-6{
        right: 20px;
        top: 60px;
    }
    .header-logo-text{
        left: 36vw;
        top: 60px;
    }
    .publications-header-heading h1{
        font-size: 34px !important;
    }
    .publications-header-nav ul li{
        font-size: 11px;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
    .navbar-light .navbar-toggler{
        color: none !important;
        border-color: none !important;
        border: none !important;
        padding: 0px !important;
    }
    .navbar-toggler:focus{
        box-shadow: none !important;
    }
    .navbar-collapse{
        position: absolute;
        top: 75px;
        left: -318px;
        background: white;
        width: 100vw;
        padding-left: 45px;
        padding-top: 8px;
        padding-bottom: 4px;
    }
    .publications-layout-heading h1{
        font-size: 20px !important;
    }
    .aag-performance, .raag-malhaar, .early-years,
    .school-days, .raag-malhaar-2, .golden-memory,
    .international-representation, .learning-sessions,
    .jury-member {
        margin: 20px 30px 30px !important;
    }
    .publications-layout .img-section img {
        width: 100%;
    }
    #footer .footer-bottom .container .row{
        width: 100%;
    }
    .footer-text-outer{
        width: 50%;
    }
    .copy-right-text-outer{
        width: 50%;
    }
    .copy-right-text{
        padding-top: 0px !important;
        letter-spacing: 0px !important;
        text-align: end !important;
    }
    #footer .footer-bottom{
        padding-bottom: 40px !important;
    }
    
}
*/

/* --------------------------------------------------------------------------------------------------- */

/*
@media (min-width:320px) and (max-width:420px){
    .header-logo-text{
        left: 33vw;
        top: 50px;
    }
    .header-logo-tex h1{
        font-size: 15px !important;
    }
    .header-logo-img{
        left: 20px;
        top: 20px;
    }
    .header-logo-img img{
        width: 64px !important;
    }
    .nav-section.col-lg-4.col-6{
        left: 83vw;
        top: 41px;
    }
    .publications-header-heading h1{
        font-size: 30px !important;
        padding-top: 20px;
        padding-bottom: 0px;
        margin-bottom: 0px;
    }
    .publications-header-nav ul{
        padding-left: 0px !important;
    }
    .publications-header-nav ul li{
        font-size: 13px;
    }
    .navbar-light .navbar-toggler{
        color: none !important;
        border-color: none !important;
        border: none !important;
        padding: 0px !important;
    }
    .navbar-toggler:focus{
        box-shadow: none !important;
    }
    .navbar-collapse{
        position: absolute;
        top: 85px;
        left: -83vw;
        background: white;
        width: 100vw;
        padding-left: 45px;
        padding-top: 8px;
        padding-bottom: 4px;
    }
    .navbar-toggler-icon {
        width: 40px !important;
      }
    .publications-layout-heading h1{
        font-size: 20px !important;
    }
    .aag-performance, .raag-malhaar, 
    .early-years, .school-days, .raag-malhaar-2, 
    .golden-memory, .international-representation, 
    .learning-sessions, .jury-member {
        margin: 20px 20px 30px !important;
    }
    .publications-layout .img-section img {
        width: 100%;
    }
    .footer-text h4{
        font-size: 4vw !important;
    }
    .copy-right-text{
        padding-top: 10px !important;
        letter-spacing: 0px !important;
        font-size: 3.9vw;
    }
    #footer .footer-bottom .container .row .nav-section{
        left: 217px;
        width: auto;
    }
    #footer .footer-bottom .container 
    .row .nav-section .navbar-collapse{
        left: 5px;
    }
    #footer .footer-bottom{
        padding-bottom: 40px !important;
    }
    #footer .footer-bottom .container .row{
        width: 100%;
    }
    .footer-text-outer{
        width: 50%;
    }
    .copy-right-text-outer{
        width: 50%;
    }
    .copy-right-text{
        padding-top: 0px !important;
        letter-spacing: 0px !important;
        text-align: end !important;
    }
}
@media (max-width: 767px){
    .order-2-in-resp{
        order: 2;
    }

}
*/