/* (A) STICKY MENU */
#sticky-menu {
  /* (A1) STICK TO TOP ON SCROLL */
  position: sticky;
  top: 0; left: 0;

  /* (A2) LAYOUT + BACKGROUND */
	background: #fff;
  display: flex;
	z-index: 1000;
}

/* (B) MENU ITEMS */
#sticky-menu a {
  /* (B1) AUTO WIDTH */
  width: 100%;
  padding: 10px 0;

  /* (B2) TEXT */
  color: #000;
	font-size: 1.5em;
  text-decoration: none;
  text-align: center;
}
#sticky-menu a:nth-child(1), #sticky-menu a:nth-child(7) {
padding-left:10px !important;
}
#sticky-menu a:nth-child(7) {
padding-right:10px !important;
}

/* (B3) ON HOVER */
#sticky-menu a:hover { background: #999; }

/* (X) DOES NOT MATTER - FOR DEMO */
html, body {
  font-family: arial, sans-serif;
  padding: 0;
  margin: 0;
	}
#page-header {
padding: 10px 10px 10px 22px;
}
#page-contents { 
padding: 10px;
}
#page-header {
  font-weight: bold;
  font-size: 2.25em;
  background: #fff;
}
#page-contents {
  height: auto;
  background: #fff;
	margin:0;
}
#page-footer {
  margin:5px 0 5px 0!important;
  padding:0 !important;
	text-align: center;	
	font-size: 1em;
}
/* (C) ON SMALL SCREENS */
@media all and (max-width: 768px) {
  /* (C1) BREAK TEXT INTO NEXT LINE */
  #sticky-menu a span { display: block; }

  /* (C2) BIG ICON */
  #sticky-menu i { font-size: 1.7em; }
}