/************************************/
/***       Responsive Css     	 ***/
/************************************/
@media(min-width:768px){

}

@media only screen and (max-width: 1300px){

	
}
@media (max-width: 1199px) {

}
@media only screen and (max-width: 1024px){
	
	
}

@media only screen and (max-width: 991px){

.menu-toggle {
    display: block;
    font-size: 28px;
    cursor: pointer;
    z-index: 1001;padding-right: 10px;
}

.right-side {
    position: fixed;
    top: 0;
    right: -100%; /* hidden */
    width: 100%;
    height: 100vh;
    background: #000;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: right 0.4s ease;
    z-index: 1000;
}

.about-inner {
    padding: 130px 20px 60px;
}
.right-side.active {
    right: 0;
    padding: 100px 0 0;
    align-items: flex-start;
}
.inner-header{
    padding: 0 15px;
}
.nav {
    display: flex;
    flex-direction: column;
    position: static;
    transform: none;
}

.nav a {
    color: #fff;
    text-decoration: none;
    font-size: 36px;
    font-weight: 400;
}

.header .social {
    margin-top: 30px;padding-left: 20px;
}

.social a {
    color: #fff;
    margin-right: 15px;
    font-size: 16px;
}
.logo-2 img{
    opacity: 0;
}
.logo-1{
    opacity: 1 !important;
}
.header .logo img {
    width: 85px;
}
.nav-links {
    display: none;
}
.hamburger {
    display: flex;
}
 .music-grid {
    grid-template-columns: repeat(2, 1fr);
  }
.single-blog .sidebar {
    display: none;
}
.single-blog .container {
    padding: 120px 0px 50px;
}
.inner-blog-content{
    padding: 0 20px;
}

.single-blog h1{
    padding: 0 20px;
    font-size: 22px;
    margin-bottom: 10px;
}
.single-artist .content{
    flex-direction: column-reverse;
    padding: 70px 20px 50px;
}
.single-artist .main, .single-artist .sidebar{
    width: 100%;
}
.single-artist .hero-text h1{
    font-size: 40px;
}
.single-artist .footer-nav {
    padding: 40px 45px 20px;
}

.hero .left {
    padding: 0 40px;
}
.artists-grid {
    gap: 10px;
}
}

@media only screen and (max-width: 767px){
.footer {
    padding: 30px 20px 10px;
}
.header{
    background: var(--color-primary);
    padding: 5px 0 !important;
}
.inner-header .logo{
    top: 4px;
}
 .music-grid{
        display:block;
    }

    .mobile-music-slider .music-card{
        width:100%;
    }

    /* NUMBER PAGINATION */
    .mobile-music-slider .owl-dots{
        margin-top:30px;
        text-align:center;
    }

    .mobile-music-slider .owl-dot{
        display:inline-block;
        margin:0 4px;
    }

    .mobile-music-slider .owl-dot span{
        width:30px;
        height:40px;
        line-height:40px;
        display:block;
        border-radius:3px;
        border: 1px solid #fff;
        color:#fff;
        font-size:14px;
        font-weight:600;
        text-align:center;
    }

    .mobile-music-slider .owl-dot.active span{
        background: #fff;
        color: #000;border-color: #000;
    }

    /* NUMBER TEXT */
    .mobile-music-slider .owl-dot:nth-child(1) span:before{content:"1";}
    .mobile-music-slider .owl-dot:nth-child(2) span:before{content:"2";}
    .mobile-music-slider .owl-dot:nth-child(3) span:before{content:"3";}
    .mobile-music-slider .owl-dot:nth-child(4) span:before{content:"4";}
    .mobile-music-slider .owl-dot:nth-child(5) span:before{content:"5";}
    .mobile-music-slider .owl-dot:nth-child(6) span:before{content:"6";}
    .mobile-music-slider .owl-dot:nth-child(7) span:before{content:"7";}
    .mobile-music-slider .owl-dot:nth-child(8) span:before{content:"8";}
    .mobile-music-slider .owl-dot:nth-child(9) span:before{content:"9";}
    .mobile-music-slider .owl-dot:nth-child(10) span:before{content:"10";}

    .mobile-music-slider .owl-dot span{
        font-size:0;
    }

    .mobile-music-slider .owl-dot span:before{
        font-size:14px;
    }
.top-links{
    flex-direction: column;
    align-items: center;
            gap: 20px;
        margin-bottom: 25px;
}
.newsletter{
    flex-direction: column;
text-align: center;
}
.newsletter-text{
    text-align: center;
}
.form{
    flex-direction: column;
    gap:20px
}
.form button{
    margin-left: 0;
}

h1 {
    font-size: 46px;
}
 .music-grid {
    grid-template-columns: 1fr;
  }
  /* .about-img img {
    width: 100%;
} */
.artist-box{
    height: 275px;
}
.single-artist .footer-nav a{
    font-size: 16px;
}
.single-artist .footer-nav a span{
    display: none;
}
.footer-nav.single-item{
    justify-content: flex-start;
}
.single-artist .footer-nav {
    padding: 40px 45px 40px;
}
.single-artist .footer-nav a.prev::after{
    left: -25px;
}
.single-artist .footer-nav a.next::after{
    right: -25px;
}
.artists-grid{
    grid-template-columns: repeat(1, 1fr);
}
.hero .left{
    width: 100%;
}

.hero .left {
    padding: 0 20px;
}
.artist-box .content h3{
    font-size: 22px;
}
.about-text {
    padding: 0;
}
.about-text small,.about-text h2{
    padding: 0 20px;
}
.about-text .columns{
    flex-direction: column;
}
.about-text .columns div {
    width: 100%;
}
.dark-section .content {
    padding: 0 30px;
}
.dark-section{
    padding-bottom: 50px;
}
.about-btn{
    font-size: 16px !important;
    padding: 15px !important;
    margin-top: 20px;
}
.job-section .right{
    width: auto;
}
 .main-artist .artist-grid {
    grid-template-columns: repeat(1, 1fr);
    padding-top: 40px;
}
.main-artist {
    padding: 115px 20px 50px;
}
.about-inner .inner-sec-title {
    font-size: 21px;
    line-height: 34px;
}
.about-inner p {
    font-size: 13px;
}
.about-inner .line {
    width: 165px;
    margin: -35px auto;
}
.about-text {
    padding: 30px 0 30px;
}
.about-text h2{
    font-size: 20px;
    line-height: 1.3em;
}
.dark-section h2{
    font-size: 22px;
    line-height: 34px;
    white-space: wrap;
}
.dark-section h3{
    font-size: 17px;
}
.main-news .news-grid {
    grid-template-columns: 1fr;
    padding: 50px 20px 0;
}
.main-news {
    padding: 110px 0 50px;
}
.main-news .news-card {
    height: 350px;
}
.main-news .news-content h3{
    font-size: 18px;line-height: 24px;
    margin-bottom: 5px;
}
.job-page {
    padding-top: 85px;
}
.job-content{
    flex-direction: column;
}
.job-section .left{
    padding: 0;
}
.job-banner{
        padding: 130px 0px 40px;
}
.job-detail{
    border: 2px solid rgba(48, 146, 192, 1);
    padding: 12px;
    background: transparent;
}
.job-detail h2{
    font-size: 18px !important;
    margin-bottom: 10px;
}
.job-banner .tag, .job-banner h1{
    padding: 0px 12px 0px 20px;
}
.job-section .job{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}
.job-section{
    padding: 50px 10px 15px;
}
.contact-section .content{
    flex-direction: column;
}
.contact-section {
    padding: 120px 20px 50px;
}
.contact-section .left h2, .contact-section .right h2{
    margin-bottom: 25px;
    font-size: 22px;
}
.contact-section .left, .contact-section .right{
    width: 100%;
}
.contact-section .right h3.sec-title {
    font-size: 20px;
    letter-spacing: 3px;
}
aside.links-block {
    display: none;
}
.single-artist .hero-text h1{
    font-size: 25px;
}
.single-artist .artist-banner {
    height: 70vh;
}
.music-title{
    font-size: 22px;
}
.single-artist .playlists ul{
    flex-wrap: wrap;
}
.job-meta .row span {
    width: 135px;
    min-width: 135px;
}
.job_apply_50 {
    float: left;
    width: 100%;
}
.store_form_line_l {
    width: 98%;
    min-height: 27px;
}
.store_form_line_r {
    width: 100%;
}
    .store_form_align_right {
    text-align: left;
}
.store_form_line{
    float: none;
}
.job-apply {
    margin-bottom: 100px;
}
.store_form_content_wrapper{
    padding: 0 10px;
}
.hero .shape-divider svg{
    height: 76px;
}
.hero .title{
    padding-top: 50px;
}
.hero .social {
    margin-top: 0px;
}
.hero .social a{
    padding: 0;
}
.hero {
    padding: 210px 0 100px;
}
.artists-section{
    padding: 45px 20px 70px;
}

.form, #newsletter-form{
    flex-direction: column;
    gap: 15px;margin: 0 auto;
}
.form input, #newsletter-form input{
    margin-right: 0;
}
.form button, #newsletter-form button{
    margin-left: 0;
}
.apply-label-main{
    padding-top: 100px;
}
.social-icons {
    margin: 30px 0;
}
.social-icons a {
    font-size: 22px;
    margin: 0 20px;
}
.newsletter h3{
    font-size: 35px;
}
}

@media(max-width: 410px){

  
}

@media only screen and (max-width: 500px){
    
}