.muso-search-abd-banner{
    font-family: Inter, sans-serif;
    padding: 10px 20px;
    display: flex;
    justify-content: flex-end;
}

.muso-search-abd-banner .muso-banner-form {
    position: relative;
    width: 320px;
    max-width: 100%;
    margin: 0px !important;
}

.muso-home-banner {
        font-family: Inter, sans-serif;
        padding: 20px;
    }

    .muso-home-banner .muso-home-banner-inner {
        background: #171615;
        border-radius: 12px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .muso-home-banner .muso-home-banner-inner .muso-home-banner-content {
        padding: 40px;
        width: 60%;
    }

    .muso-home-banner .muso-home-banner-inner .muso-home-banner-content h2 {
        font-size: 3.9vw;
        line-height: 4vw;
        font-family: Inter, sans-serif;
        color: #fff;
        margin-top: 0px;
    }

    .muso-home-banner .muso-home-banner-inner .muso-home-banner-content h2 span {
        display: block;
        color: #6be7c8;
    }

    .muso-home-banner .muso-home-banner-inner .muso-home-banner-content p {
        font-size: 17px;
        font-family: Inter, sans-serif;
        color: #ccc;
        line-height: 140%;
        width: 80%;
    }

    .muso-home-banner .muso-home-banner-inner .muso-home-banner-img {
        width: 40%;
        padding-left: 60px;
    }

    .muso-home-banner .muso-home-banner-inner .muso-home-banner-img img {
        width: 100%;
    }
 .muso-home-banner .muso-home-banner-inner .muso-home-banner-img img.mobile-img{
    display: none;
}
    .muso-banner-form {
        position: relative;
    }

    .muso-banner-form .form-field {
        border: rgb(94, 93, 92) solid 1px;
        background: #21201f;
        padding: 15px;
        color: #fff;
        font-size: 16px;
        width: 100%;
        border-radius: 12px;
        outline: none !important;
    }

    .muso-banner-form button {
        background: none;
        border: 0px;
        outline: none;
        position: absolute;
        right: 10px;
        top: 12px;
    }

    .muso-banner-form button img {
        width: 23px !important;
    }

    .union-app-wrapp .union-app-listing .union-app-lists .union-app-box {
        display: flex;
        gap: 0.5rem;
        background: #171615;
        padding: 15px;
        border-radius: 10px;
        position: relative;
        align-items: center;
    }


.no-result-app{
    padding: 20px 20px;
display: flex;
}


.no-result-app .no-result-app-inner{
    background: #351113;
        padding: 10px 25px;
        border-radius: 10px;
        color:#fff;
        font-size: 18px;
        width: 50%;

}
    .union-app-wrapp .union-app-listing {
        width: 100%;
        padding: 0px 30px;
    }

    .union-app-wrapp .union-app-listing .union-app-lists {
        display: grid;
        grid-template-columns: 50% 50%;
        gap: 1.5rem;
    }

    .muso-home-banner.muso-search-banner .muso-home-banner-inner .muso-home-banner-content {
        padding: 30px;
        width: 60%;
    }

    .muso-home-banner.muso-search-banner .muso-home-banner-inner .muso-home-banner-content h2 {
        font-size: 2.9vw;
        line-height: 3vw;
    }

    .muso-home-banner.muso-search-banner .muso-home-banner-inner {

        justify-content: flex-start;
    }

    .union-app-wrapp .union-app-listing .union-app-lists .union-app-box .union-app-box-img img {
        width: 70px;
        border-radius: 50%;
        height: 70px;
        max-width: inherit;
        object-fit: cover;
    }
.union-app-wrapp .union-app-listing.union-app-listing-album  .union-app-lists .union-app-box .union-app-box-img img {
       
        border-radius: 12px; 
    }

    .union-app-wrapp .union-app-listing .union-app-lists .union-app-box .union-app-box-img {
        width: 80px;
    }

    .union-app-wrapp .union-app-listing .union-app-lists .union-app-box h4 {
        margin: 0px;
        font-size: 16px;
        font-family: Inter, sans-serif;
        margin-bottom: 5px;
        font-weight: normal !important;
    }

    .union-app-wrapp .union-app-listing .union-app-lists .union-app-box span {
        display: block;
        font-size: 13px;
        color: #ccc;
        font-family: Inter, sans-serif;
    }
.union-app-wrapp .union-app-listing .union-app-lists .union-app-box span strong{
    font-weight:600; 
}
    .union-app-wrapp .union-app-listing h3 {
        text-transform: uppercase;
        font-family: Inter, sans-serif;
        font-size: 26px;
        margin-bottom: 15px;
        font-weight: normal !important;
    }

    .popularity {
        position: absolute;
        right: 15px;
        top: 15px;
        width: 140px;
    }
.union-app-listing-album  .popularity {
       position: static;
  margin-top: 5px;
  width: auto;
  display: flex;
  align-items: center;
  gap:1rem;

    }
.popularity .popularity-count{
position: absolute;
  right: 0px;
  top: -1px;
  font-size: 12px;
}

.union-app-listing-album .popularity .popularity-count{
position: static;
}
    .popularity>span {
        margin-bottom: 10px;
        text-transform: capitalize;
    }

    .union-app-listing-album  .popularity>span {
        margin-bottom: 0px;
}

    .popularity .popularity-progress {
        width: 100%;
        position: relative;
        height: 2px;
        border-radius: 12px;
        background: #ffffff8f;
    }

    .union-app-listing-album   .popularity .popularity-progress {
 width: 140px;
}
    .popularity .popularity-progress span {
        position: absolute;
        left: 0px;
        top: 0px;
        border-radius: 12px;
        background: #6be7c8;
        z-index: 3;
        height: 2px;
    }
    .union-app-wrapp {
  padding: 20px 0px;
}
    
  .artist-bio-banner {
        font-family: Inter, sans-serif;
        padding: 20px;
    }
.artist-bio-banner .muso-artist-bio-signby a {
	
	color:#6be7c8;
	
	
	}
	.muso-artist-bio .spotify-track-link {
	padding-top:7px;
	}
	.muso-artist-bio .spotify-track-link a {
	color:#6be7c8;
	
	}
	.muso-artist-bio .spotify-track-link a.spotify-link  , .muso-artist-bio .spotify-track-link a.preview-link {
  background: rgb(255 255 255 / 5%);
  border-radius: 100%;
  width: 40px;
  height: 40px;
  padding: 5px 0px;
  margin-right: 5px;
  display: inline-block;
  text-align: center;
  }

    .artist-bio-banner .artist-bio-banner-inner {
        background: #171615;
        border-radius: 12px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 20px;
        gap: 1rem;

    }

    .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio {
        background: #171615;
        border-radius: 12px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;

    }

    .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-img img {
        width: 125px;
        height: 125px;
        object-fit: cover;
        border-radius: 100%;
    }

    .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-content h2 {
        font-size: 2.3vw;
        line-height: 3vw;
        font-family: Inter, sans-serif;
        color: #fff;
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-content .muso-artist-bio-info {
        font-family: Inter, sans-serif;
        color: #fff;
        font-size: 16px;
        margin-bottom: 10px;
    }

    .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-content .muso-artist-bio-location {
        font-family: Inter, sans-serif;
        color: #fff;
        font-size: 16px;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-content .muso-artist-bio-location img {
        width: 18px;
    }

    .muso-artist-bio-sign-social {
        width: 35%;
		padding-left:25px;
    }

    .muso-artist-bio-sign-social .muso-artist-bio-signby h3 {
        margin: 0px;
        font-size: 14px;
        font-family: Inter, sans-serif;
        color: #fff;
        font-weight: normal !important;
        margin-bottom: 5px;
    }

    .muso-artist-bio-sign-social .muso-artist-bio-signby .muso-artist-bio-signby-link {
        background: rgb(255 255 255 / 5%);
        border-radius: 12px;
        padding: 10px;
        color: #fff;
        display: flex;
        gap: 0.5rem;
        width: 171px;
        font-size: 13px;
        align-items: center;

    }

    .muso-artist-bio-sign-social .muso-artist-bio-signby .muso-artist-bio-signby-link:hover {
        background: #6be7c8;
        color: #000;

    }

    .muso-artist-bio-sign-social .muso-artist-bio-signby .muso-artist-bio-signby-link img {
        width: 25px;
        height: 25px;
        object-fit: cover;
        border-radius: 100%;
    }

    .muso-artist-bio-social h3 {
        margin: 15px 0px;
        font-size: 14px;
        font-family: Inter, sans-serif;
        color: #fff;
        font-weight: normal !important;
        margin-bottom: 5px;

    }

    .muso-artist-bio-social a {
        background: rgb(255 255 255 / 5%);
        border-radius: 100%;
        width: 40px;
        height: 40px;
        padding: 5px 0px;
        margin-right: 5px;
        display: inline-block;
        text-align: center;
    }

    .muso-artist-bio-social a:hover {
        background: #6be7c8;
    }

    .muso-artist-bio-social a:hover img {
        filter: invert();
    }

    .muso-artist-detail-credits {
        display: flex;
        gap: 1rem;
        padding: 20px;
    }

    .muso-artist-detail-credits .muso-artist-credits {
        background: #18022e;
        border-radius: 12px;
        padding: 15px;
        width: 70%;
    }

    .muso-artist-detail-credits .muso-artist-credit-role {
        background: #18022e;
        border-radius: 12px;
        padding: 15px;
        width: 30%;
    }

    .muso-artist-detail-credits .muso-artist-detail-credits-heading {
        display: flex;
        justify-content: space-between;
        font-size: 16px;
        align-items: center;
    }

    .muso-artist-detail-credits .muso-artist-detail-credits-heading h3 {
        font-size: 1.3vw;
        line-height: 2vw;
        color: #fff;
        font-weight: 400;
        margin: 0px;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing {
        display: grid;
        grid-template-columns: 48% 48%;
        gap: 0.5rem;
        padding-top: 15px;

    }

    .muso-artist-detail-credits .muso-artist-credit-listing .popularity .popularity-progress {
        width: 100px !important;

    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box {
        display: flex;
        gap: 0.5rem;
        border-radius: 12px;
        padding: 10px;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box:hover {
        background: rgb(255 255 255 / 5%);
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box span {
        display: block;
        font-size: 11px;
        color: rgba(255, 255, 255, 0.6);
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box span img {
        width: 11px;
        margin-right: 4px;
        margin-left: 4px;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box h4 {
        margin: 0px;
        font-size: 16px;
        font-family: "Plus Jakarta Sans", sans-serif;
        margin-bottom: 5px;
        font-weight: normal !important;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box h4 a {
        color: #fff;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img {
        width: 60px;
    }


    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img img {
        width: 70px;
        border-radius: 50%;
        height: 70px;
        max-width: inherit;
        object-fit: cover;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img img {

        border-radius: 12px;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img {
        width: 80px;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box h4 {
        margin: 0px;
        font-size: 16px;
        font-family: Inter, sans-serif;
        margin-bottom: 5px;
        font-weight: normal !important;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box span {
        display: block;
        font-size: 13px;
        color: #ccc;
        font-family: Inter, sans-serif;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box span strong {
        font-weight: 600;
    }

    .muso-artist-detail-credits .muso-artist-credit-listing h3 {
        text-transform: uppercase;
        font-family: Inter, sans-serif;
        font-size: 26px;
        margin-bottom: 15px;
        font-weight: normal !important;
    }

    .muso-artist-credit-role-listing {
        display: flex;
        gap: 0.5rem;
        flex-direction: column;
        padding-top: 10px;
    }

    .muso-artist-credit-role-listing .muso-acr-box {
        display: flex;
        gap: 0.5rem;
        border-radius: 12px;
        padding: 10px;
        background: rgb(255 255 255 / 5%);
        width: 100%;
        font-size: 14px;
        font-weight: normal;
    }

    .muso-artist-credit-role-listing .muso-acr-box h4 {
        font-weight: normal !important;
        margin-top: 0px;
        font-family: Inter, sans-serif;
		padding: 7px 0px;
    }

    .muso-artist-credit-role-listing .muso-acr-box strong {
        font-weight: normal;
    }

    .muso-artist-credit-role-listing .muso-acr-box .muso-acr-box-img {
        width: 50px;
    }

    .muso-artist-credit-role-listing .muso-acr-box .muso-acr-box-img img {
        filter: invert();
        width: 100%;
        font-family: Inter, sans-serif;
    }

    .muso-artist-detail-collaborators.muso-artist-detail-credits .muso-artist-credits {

        width: 50%;
    }

    .muso-artist-detail-collaborators.muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img {
        width: 60px;
    }


    .muso-artist-detail-collaborators.muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img img {
        width: 60px;
        border-radius: 100%;
        height: 60px;
        max-width: inherit;
        object-fit: cover;
    }

    .muso-artist-detail-collaborators.muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .popularity {
        margin-top: 10px;
    }

    .macbm img {
        filter: invert();
    }

.muso-artist-bio-info .popularity{
    position: static;
    display: inline-block; margin-top: 10px;
    float: right;
    margin-left: 10px;
}
.muso-artist-bio-info .popularity span{
     display: inline-block;
}
.muso-artist-bio-info  .popularity .popularity-count {
    position: absolute;
    right: -20px;
    top: -5px;
    font-size: 11px;
}

  .artist-bio-banner.album-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-img img {
        width: 125px;
        height: 125px;
        object-fit: cover;
        border-radius:12px;
    }

.muso-album-bio-artist{
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 14px;
}
.muso-album-bio-artist span{
    display: flex;
    align-items: center;
    gap: 0.2rem;

}
.muso-artist-bio-content .muso-album-bio-artist a {
   color:#fff;
}
.muso-album-bio-artist span img{
    width: 20px;
    height: 20px;
    object-fit: cover;
    border-radius: 100%;

}
.muso-album-wrapper{
    padding: 20px;
}
/*.muso-album-boxes{
    display: grid;
    grid-template-columns: 32.33% 32.33% 32.33%;
    gap: 0.5rem;
    padding-top: 15px;
}*/
.muso-album-boxes {
  column-count: 3;
  column-gap: 1rem;
  padding-top: 15px;
}

.muso-album-boxes > div {
  break-inside: avoid;
  margin-bottom: 1rem;
}
.muso-album-boxes .muso-album-box{
    background: #171615;
   border-radius: 12px;
   overflow: hidden;
}

.muso-album-boxes .muso-album-box .muso-album-box-head{
    padding: 10px;
    background: rgb(255 255 255 / 5%);
}
.muso-album-boxes .muso-album-box ul{
    padding: 0px;
    margin:0px;
    list-style: none;
}
.muso-album-boxes .muso-album-box ul li{
padding: 8px 10px;
}
.muso-album-boxes .muso-album-box ul li h4 {
font-size:14px;
margin: 5px 0px;
}
.muso-album-boxes .muso-album-box ul li:hover{
background: rgb(255 255 255 / 7%);
}
.muso-album-boxes .muso-album-box ul li a{
       text-decoration: none;
    color: #fff;
    display: flex;
    gap: 0.5rem;
    font-size: 14px;
    font-weight: normal;
    align-items: center;
       line-height: 1.2;
    justify-content: start;
}
.muso-album-boxes .muso-album-box ul li a img{
    width: 20px;
    height: 20px;
    border-radius: 100%;
    object-fit: cover;

}

    @media only screen and (min-width: 1580px) {
     .union-app-wrapp .union-app-listing .union-app-lists .union-app-box h4 {
                font-size: 21px; 
    }
    .union-app-wrapp .union-app-listing .union-app-lists .union-app-box span {
   font-size: 15px;
}
.popularity .popularity-count {
   top: 3px;
   
}
}

    @media only screen and (max-width: 651px) {
        .muso-search-abd-banner .muso-banner-form {
  
    width: 100%;
}
           .muso-album-boxes {
    column-count: 1;
    column-gap: 1rem;
    padding-top: 15px;
}
.popularity .popularity-count {
  position: static;
}
      .popularity {
       position: static;
  margin-top: 5px;
  width: auto;
  display: flex;
  align-items: center;
  gap:1rem;

    }
    .popularity>span {
        margin-bottom: 10px;
        text-transform: capitalize;
    }

      .popularity>span {
        margin-bottom: 0px;
}
 

   .popularity .popularity-progress {
 width: 140px;
}
        .union-app-wrapp .union-app-listing h3 {
    
    font-size: 22px;
    margin-bottom: 15px; 
}
        .muso-home-banner { 
    padding: 20px 5px;
}
.muso-home-banner.muso-search-banner .muso-home-banner-inner .muso-home-banner-content h2 {
    font-size: 5.9vw;
    line-height: 6vw;
}
        .muso-home-banner.muso-search-banner .muso-home-banner-inner .muso-home-banner-content {
    padding: 20px;
    width: 100%;
}
        .union-app-wrapp .union-app-listing {
    width: 100%;
    padding: 0px 5px;
}
.union-app-wrapp .union-app-listing .union-app-lists .union-app-box .union-app-box-img {
  width: 70px;
}
     .union-app-wrapp .union-app-listing .union-app-lists .union-app-box .union-app-box-img img {
  width: 60px; 
  height: 60px;
}
        .union-app-wrapp .union-app-listing .union-app-lists {
        display: grid;
        grid-template-columns: 100%;
        gap: 1.5rem;
    }
        .muso-home-banner .muso-home-banner-inner {
            flex-direction: column-reverse;

        }

        .muso-home-banner .muso-home-banner-inner .muso-home-banner-img {
            width: 100%;
            padding: 20px 40px;
        }

        .muso-home-banner .muso-home-banner-inner .muso-home-banner-content {
            padding: 20px;
            width: 100%;
            text-align: center;
        }

        .muso-home-banner .muso-home-banner-inner .muso-home-banner-content h2 {
            font-size: 6.9vw;
            line-height: 8vw;
        }

        .muso-home-banner .muso-home-banner-inner .muso-home-banner-content p {
            font-size: 14px;
            font-family: Inter, sans-serif;
            color: #ccc;
            line-height: 140%;
            width: 90%;
            margin: 10px auto;
        }

        .muso-banner-form {
           margin-top: 15px;
    display: block;
    float: left;
    width: 100%;
    margin-bottom: 20px;
  
        }
         .muso-home-banner .muso-home-banner-inner .muso-home-banner-img img.desktop-img{
        
    display: none;
}
 .muso-home-banner .muso-home-banner-inner .muso-home-banner-img img.mobile-img{
    display: block;
}

  .muso-artist-bio-info .popularity{
            float: none;
        }
        .muso-artist-detail-collaborators.muso-artist-detail-credits .muso-artist-credits {
            width: 100%;
        }

        .muso-artist-detail-credits .muso-artist-credit-role {

            width: 100%;
        }

        .muso-artist-detail-credits .muso-artist-credit-listing .muso-ac-box .muso-ac-box-img img {
            width: 55px;
            height: 55px;
        }

        .muso-artist-detail-credits .muso-artist-detail-credits-heading h3 {
            font-size: 4.3vw;
            line-height: 5vw;
        }

        .union-app-listing-album .popularity span {
            display: none;
        }

        .muso-artist-detail-credits .muso-artist-credits {

            width: 100%;
        }

        .muso-artist-detail-credits .muso-artist-credit-listing {

            grid-template-columns: 98%;
            gap: 0.5rem;
            padding-top: 15px;
        }

        .muso-artist-detail-credits {

            flex-direction: column;
        }

        .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-img img {
            width: 50vw;
            height: 50vw;
        }

        .muso-artist-bio-sign-social {
            width: 100%;
            padding-top: 20px;
			padding-left:0px;
        }
		.muso-album-bio-artist {
		  padding-top: 20px;
		}

        .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-content .muso-artist-bio-location {
            justify-content: center;
        }

        .artist-bio-banner .artist-bio-banner-inner {

            flex-direction: column;
        }
		

        .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio {

            flex-direction: column;
            text-align: center;
        }
		.artist-bio-banner .artist-bio-banner-inner .muso-artist-bio.track-page , .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio.track-page .muso-artist-bio-content {
			width:100%;
		}
		 
		.muso-artist-bio.track-page .spotify-track-link {
		  text-align:left;
		}
		

        .artist-bio-banner .artist-bio-banner-inner .muso-artist-bio .muso-artist-bio-content h2 {
            font-size: 8.3vw;
            line-height: 10vw;
        }
    }