@media (max-width: 900px) {
    .image-gallery a {
        max-width: 150px;
        max-height: 150px;
        margin: 0;
        position: relative;
        overflow: hidden;
    }

    .image-gallery a span {
        position: absolute;
        bottom: 10px;
        left: 0;
        right: 0;
        text-align: center;
        background-color: rgba(0, 0, 0, 0.7);
        color: white;
        padding: 5px;
        font-size: 12px;
        opacity: 1;
        z-index: 1;
        pointer-events: none;

    }

    #rewindButton {
        margin: -10px;

    }

    body {

        min-height: 100vh;
        font-size: 14px;
    }

    h1 {
        margin: 100px 0 0px;
    }

    .image-gallery {
        grid-template-columns: repeat(2, 1fr);
        margin: 100px;
       
    }
.image-gallery img { border-radius: 0;}
.image-gallery a span { border-radius: 0;
animation: none;}
    .social-column {
        right: 0;
        left: 0;
        top: 95%;
        transform: none;
        flex-direction: row;
        justify-content: center;
        background: none;
        position: absolute;

    }

    .social-column a {
        font-size: 18px;
        margin-top: 20px;
    }

    .contact-container {
        width: 90%;
        padding: 10px;
        margin: 100px;



    }

    input,
    select,
    textarea {
        font-size: 14px;
    }

    button {
        font-size: 14px;
    }

    #music-control {
        flex-direction: column;
        padding: 10px;
    }

    .media-options {
        flex-direction: column;
        align-items: center;
    }

    .media-options button {
        width: 100%;
        margin: 5px 0;
    }



    .dropdown {
        text-align: center;
    }

    .main-section {
        flex-direction: column;
        align-items: center;
        background-color: #5858584f;
        border-radius: 2em;
        padding: 18px 20px;
    }

    .nav-link {
        font-size: 30px;

    }

    .dropdown-content {
        position: static;
        width: 100%;
        text-align: center;
        display: flex;
        border-radius: 1em;
        box-shadow: none;
        background: none;
        border: 2px black solid;
        margin-top: 10px;



    }

    .dropdown-content .dropdown-link {
        font-size: 30px;

    }

    .dropdown-content .dropdown-link:hover {
        color: aliceblue;
        background-color: #19519b6e;
        border-radius: 10px;

    }

    #playPauseButton {
        font-size: 24px;
        padding: 15px;
    }

    .media-options {
        position: absolute;
        right: 0;
        left: 0;
        top: 95%;
        transform: none;
        flex-direction: row;
        justify-content: center;
        background: none;
    }

    .capsco {
        flex-direction: column;
        align-items: center;
    }

    #capsco {
        max-width: 100%;
        max-height: 100%;
        margin-bottom: 20px;
    }

    .text-content {
        margin-left: 0;
        text-align: center;
    }

    .left {
        display: flex;
        flex-direction: column;

    }

    .ARTISTS {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 80px;
    }

    #logo {
        position: relative;
        max-width: 250px;
        max-height: 250px;
    }

    .imgbio {
        display: flex;
        flex-direction: column;

        align-items: center;

        border: 2px solid #888;
        padding: 40px;
        background-color: #333;
        max-width: 800px;
        overflow-y: auto;
        font-size: calc(13px + 1vw);
        font-family: "Micro 5", sans-serif;
        margin-bottom: 4px;
    }
    .AudioVideo{margin-bottom: 20%;}

    .artist{display: flex;
    flex-direction: column;
             
    gap: 10px;                
    padding: 20px;}
    nav{width: 125px;
        padding: 5px 5px;
       

        
    }
    nav a{font-size: 12px;
     margin: 6px 0;}
    nav a.active {
     
  font-size: 15px;  
 
}
nav a:last-child {
  margin-bottom: 60px; 
}
    .artist img {max-width: 140px;}
     .artist h2 {
    font-size: 22px;  
    margin: 0 0 5px;        
  }

  .artist p {
    font-size: 10px;          
  }

    .container{height: 100vh;
         margin-left: 125px;
         
    }
    body.artist-page .social-column {
    display: none;
  }
  #rewindButton {
   
    
    padding: 5px 5px;
    
    font-size: 20px;
   
}
    #music-control {
    
    top: 0px;
    left: 120px;
}

#playPauseButton {
   
    
    padding: 5px 20px;
    
    font-size: 15px;
}

.tags span {font-size: 10px;
 padding: 2px 4px;
  margin: 0px;}

.tags{gap:0;}
}