 @media(min-width: 600px) {
    #menu-icon {
        display: none;
    }
    #search-form {
        grid-area: b;
        justify-self: end;
        margin-top: 0;
    }

    #search-form.hide {
        display: flex;
    }

    
 }
 
 #menu-icon {
    justify-self: end;
    align-self: center;
 }
 
 /* menu icon; adapted from: https://codepen.io/designcouch/pen/ExvwPY */
   #menu-icon span:nth-child(1) {
       top: calc(0%);
   }

   #menu-icon span:nth-child(2),
   #menu-icon span:nth-child(3) {
       top: calc(50% - 2px);
   }

   #menu-icon span:nth-child(4) {
       top: calc(100% - 4px);
   }

   #menu-icon.open span:nth-child(1) {
       top: 25%;
       width: 0%;
       left: 50%;
   }

   #menu-icon.open span:nth-child(2) {
       transform: rotate(45deg);
   }

   #menu-icon.open span:nth-child(3) {
       transform: rotate(-45deg);
   }

   #menu-icon.open span:nth-child(4) {
       top: 25%;
       width: 0%;
       left: 50%;
   }


   #menu-icon span {
       display: flex;
       position: absolute;
       height: 4px;
       width: 100%;
       background: #0e0472;
       border-radius: 9px;
       opacity: 1;
       left: 0;
       transform: rotate(0deg);
       transition: .25s ease-in-out;
   }


   #menu-icon {
       height: 1.25rem;
       width: 1.8rem;
       transform: rotate(0deg);
       transition: .5s ease-in-out;
       cursor: pointer;
       border: 0;
       background: none;
   }

