
@media (max-width:900px) {
    .upper-right-button {
        height:24px;
        width:150px;
    }
    .lower-right-button{
        font-size:12px;
    }
    .content {
        display:flex;
        align-content:flex-start;
        height:100%;
        padding:0 18px 0 18px;
        overflow:hidden;
    }
    .desktop {
        display:none;
    }
    .mobile {
        display:grid;
        place-items:center;
    }
    img {
        max-width:88vw;
        margin:0 auto;
    }
    h2.about, h2.texts {
        height:22px;
        width:100%;
    }
    p{
        font-size:12px;
        line-height:14px;
    }
    #bio .content p, #bio .content li {
    font-size:12px;
    line-height:14px;
    list-style:none;
}
    ul {
        margin:0;
        padding:0;
    }
    li {
        font-size:12px;
        line-height:18px;
        list-style:none;
        text-indent:0;
        padding:0;
        margin:0;
    }
    #index .content {
        padding-top:64px;
    }
    #bio .content{
        align-content:flex-start; 
    }
    #artwork .content {
        align-content:flex-start;
        padding-top:18px;
    }
    #artwork .content .textual {
        width:100%;
    }
    #artwork .content .imagery {
        width:100%;
    }
    #artwork .textual {
        padding:0px 12px ;
    }
    #artwork h1, #artwork h2, #artwork h3, #artwork p{
        font-size:12px;
        line-height:14px;
        padding-top:10px;
    }
    #artwork h2 {
        margin-top:2px;
        padding-left:24px;
    }
    
    #artwork p {
        font-weight:300
    }
    #artwork .note {
        display:none;
    }

    #artwork .imagery {
        position:fixed;
        top:30vh;
        left:0;
        width:100vw;
        height:70vh;
        display:grid;
        align-content:start;
    }
    
}

#artwork .chrome .content {
    align-content:space-around;
    background:#333;
    
}


@media (min-width:900px) {
   .desktop {
        display:block;
    }
    .mobile {
        display:none;
    }
}