.directory-button-div {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        row-gap: 0.5rem;
        padding: 2rem;
        background-color: rgb(12, 22, 32);
    }

    .directory-button, .directory-page-name {
        color: aliceblue;
        display: inline-block;
        background-color: transparent;
        border: none;
        font-size: 0.8rem;
        padding: 0rem;
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }
    .directory-page-name {
        border-bottom: 1px solid violet ;      
    }
    .directory-button {
        border-bottom: 1px dashed rgba(240, 248, 255, 0.5);
        
        cursor: pointer;
        opacity: 1;
        transition: opacity 0.2s;
    }
    .directory-arrow {
        font-size: 0.8rem;
    }

    .directory-button:active {
        opacity: 0.5;
    }

@media (min-width: 1400px) /* Desktop */
{
    
    .directory-button:hover 
    {
        opacity: 0.7;
    }

    .directory-button-div 
    {
      padding-top: 2rem;
      padding-bottom: 2rem;
      padding-right: 2rem;
      padding-left: 25rem;
    }

}