@media (max-width: 45em) {
  .tabs .tab,
  .tabs label {
    order: initial;
  }
  .tabs label {
    width: 100%;
    margin-right: 0;
    margin-top: 0.2rem;
  }
} 

@media screen and (max-width: 800px) {
	.logo{height: 35px; padding-left: 10px;}
  /*.menu a:not(:first-child) {display: none;}*/
   .menu {display: none;}

  header a.icon {
    display: block;
	padding: 10px;
	text-align: center;
	color: white;
	background: #303034;
	font-size: 15px;
  }
  
  header {
	  display: grid;
	  grid-template-columns: 1fr auto;
      align-items: center;
}
	
	
}


@media screen and (max-width: 800px) {
	.BoxParent.responsive{display: grid; grid-template-rows: auto; grid-template-columns: 1fr auto;}
  .menu.responsive {position: relative; display: block; border-top: 1px solid gray; margin-top: 15px; overflow: visible; width: inherit; grid-row: 2/2; grid-column: 1/3;}
  
  .menu.responsive a {
    display: block;
    text-align: left;
	padding: 10px;
  }
 .menu.responsive a:hover,  .menu.responsive a:active{color: white; background-color: black;}
  
  /*.menu.responsive .buttonBoxContainer #buttonBox{display: none;}*/

	/*.BoxParent.responsive .searchBar{display: block;}*/
}



@-ms-viewport{
    width: device-width;
}