@font-face {
  font-family: 'MyWebFont';
  src: url('webfont.eot'); /* IE9 Compat Modes */
  src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

* {
  margin: 0;
  padding: 0;

}

body {
  background-color: #eee;
  background-image: url("images/bg_pic_hexagons.png");
  background-size: cover;
}

nav {
  position: sticky;
  width: 529px;
  height: 20px;
  background-color:  black; /*#4D84F1; light blue /*	#000000; /* 	#000000 is black for nav bg color */
}

nav p {
  font-family: arial;
  color: #eee;
  font-size: 22px;
  line-height: 80px;
  float: left;
  padding: 0px 0px 0px 0px;

}

nav ul {
  float: left;
	height: 0px;


}

nav ul li {
  float: left;
  list-style: none;
  position: relative; /* allows for position absolute later */

}

nav ul li a {
  display: block;
  font-family: arial;
  color: #9CB4E2; /* #32CD32 is bright green LINK TEXT color */
  font-size: 17px;
  padding: 5px 10px 5px 10px; /* ( 1st value is space above main level words. 2nd value is space between top level words) */
  text-decoration: none;

}

nav ul li a:hover {
background-color:  #3B3C3D; /* #38383A darker Gray #696969 is Dim Gray #5F9EA0 is Cadet Green */
border-radius: 4px
}

nav ul li ul { /* Properties of actual sub level of menu*/
  display: none;
  position: absolute;
  background-color: #000000; /* #DAA520 is goldenrod LINK TEXT color */
  padding: 1px;
  /* height: 150px; /* height of dropdown menu background color */
  border-radius: 0px 0px 10px 10px

}

nav ul li:hover ul { /* Properties of actual sub level of menu*/
  display: block;

}

nav ul li :hover ul {
  display: block;
}

nav ul li ul li {
  width: 165px;  /* Width of sub menu items so text will fit */
  border-radius: 4px

  }

nav ul li ul li a { /*actual drop down section  vertical | horizontal */
  padding: 5px 5px; /* 1st value is vert sp between dropdown section words. 2nd value is Indentation */
  font-size: 16px; /* font size of dropdown section*/
  border-radius: 4px
}

nav ul li ul li a:hover {
  background-color:  #3B3C3D; /* #696969 is Dim Gray #5F9EA0 is Cadet Green */
}

/*
Apply to all four sides
padding: 1em;

Apply vertical | horizontal
padding: 5% 10%;

Apply top | horizontal | bottom
padding: 1em 2em 2em;

Apply top | right | bottom | left
padding: 5px 1em 0 2em;*/