* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    font-family	: Verdana, Arial, Helvetica, sans-serif;
}
nav {
  width: 100%;
  background-color	: #f44336;
  box-shadow		: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); 
}

.mainHeader { font-size : 2em; }

#hamitems { display: flex; } /* (B) HORIZONTAL MENU ITEMS */
#hamitems a {
  flex-grow: 1;
  flex-basis: 0;
  padding: 10px;
  color	: #f2f2f2;
  text-decoration: none;
  text-align: center;
}

#hamitems a:hover { background: #245C6D; }

nav label, #hamburger { display: none; } /* (C) HIDE HAMBURGER */

@media screen and (max-width: 768px){
  /* (A) BREAK INTO VERTICAL MENU */
  #hamitems a {
    box-sizing: border-box;
    display: block;
    width: 100%;
    border-top: 1px solid #333;
  }
  
  nav label {  /* (B) SHOW HAMBURGER ICON */
    display: inline-block; 
    color: white;
    background: #a02620;
    font-style: normal;
    font-size: 1.2em;
    padding: 10px;
  }

  /* (C) TOGGLE SHOW/HIDE MENU */
  #hamitems, .mainHeader  { display: none; }
  nav input:checked ~ #hamitems { display: block; }
  #smallheader { color : white; background-color : #f44336; }
}