@media screen and (max-width : 800px) {

    .nav-container {
        display: grid;
        grid-template-columns: 50% 50%;
        margin: 0 10px;
    }
    .logo {
        grid-column: 1/2;
        display: flex;
        justify-content: flex-start;
        margin-left: 10%;
    }

    .icon {
        grid-column: 2/3;
        display: flex;
        justify-content: flex-end;
        margin-right: 10%;
        align-items: center;
        z-index: 1000;
    }
    .nav-bar {
        display: none;
    }
    .nav-items {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;

    }
    .nav-bar.responsive {
        position: relative;
        grid-column: 1/3;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .nav-bar.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .nav-bar.responsive .nav-items a {
      float: none;
      display: flex;
      flex-direction: column;
      width: 100%;
    }
    .nav-bar.responsive .nav-items .Tigdropdown, .nav-bar.responsive .nav-items .Migdropdown, 
    .nav-bar.responsive .nav-items .Arcdropdown, .nav-bar.responsive .nav-items .Plasmadropdown {

        float: none;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: center;
        align-content: center;
    }
    .nav-bar.responsive .nav-items .Tigdropdown .Tigdropbtn, .nav-bar.responsive .nav-items .Migdropdown .Migdropbtn, 
    .nav-bar.responsive .nav-items .Arcdropdown .Arcdropbtn, .nav-bar.responsive .nav-items .Plasmadropdown .Plasmadropbtn {

        display: flex;
        flex-direction: row;
        justify-content: center;
        width: 100%;
        cursor: pointer;
    }
    .nav-bar.responsive .nav-items .Tigdropdown-content, .nav-bar.responsive .nav-items .Migdropdown-content, 
    .nav-bar.responsive .nav-items .Arcdropdown-content, .nav-bar.responsive .nav-items .Plasmadropdown-content {

        position: relative;
        display: none;
    }
    .nav-bar.responsive .nav-items .Tigdropdown .Tigdropdown-content a, .nav-bar.responsive .nav-items .Migdropdown .Migdropdown-content a,
    .nav-bar.responsive .nav-items .Arcdropdown .Arcdropdown-content a, .nav-bar.responsive .nav-items .Plasmadropdown .Plasmadropdown-content a {
       

        display: flex;
        flex-direction: column;
      }
    .nav-bar.responsive .nav-items .Tigdropdown .Tigdropdown-content.Test1responsive, .nav-bar.responsive .nav-items .Migdropdown .Migdropdown-content.Test1responsive,
    .nav-bar.responsive .nav-items .Arcdropdown .Arcdropdown-content.Test1responsive, .nav-bar.responsive .nav-items .Plasmadropdown .Plasmadropdown-content.Test1responsive {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
      }
}