@media (max-width: 710px) {

    .header{

        padding:6px;
        background-color: rgb(230, 230, 230);
    
       
    }
    
    .headerWrapper{
    
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        
    
    }
    
    .headerItem{
       
        display:none;

    }
    
    .pmsLogo{
    
        display:flex;
        justify-content: center;
        align-items: center;
        min-width: 100px;
        font-size:2rem;
        font-weight: bold;
        color:gray;
    
        font-family: Arial, Helvetica, sans-serif;
        
        
    
    }

    .navbarButtons{



    }
    
    #navbarIcon{
        display:block;
        
        z-index:0;
        cursor: pointer;
        margin-right:10px;

    }

    .iconBars{

        width: 35px;
        height: 5px;
        background-color: white;
        margin: 6px 0;
        transition: all 0.5s;

    }

    .bar1{
        color:white;
    }
    .bar2{
        color:white;
    }  
    .bar3{
        color:white;
    }

    
    
    .headerButtonSideShow{

        display:flex;
        flex-direction: column;
        position:fixed;
        justify-content: center;

        background-color: white;

        top:0;
        left:0; 

        width:100%;
        height:100vh;        

        background-color: white;
        z-index: 500;

    }

    
    .headerButtons{
        
        background-color: white;
        font-size:1.5rem;
        color:black;
        border:none;
        padding:5px;
        margin-bottom:5px;
        cursor: pointer;
       

    }

    .headerButtons:hover{

        background-color :rgb(222, 247, 190);

    }








}