#menu {
  background: #B10021;
  color: #eee;
  height: 20px;
  padding:inherit;
  border-bottom: 0px solid #eeeded;
}

#menu ul,
#menu li {
  margin: 0 0;
  padding: 1 0;
  list-style: none;
}

#menu ul {
  height: 20px
}

#menu li {
  float: left;
  display: block;
  position: relative;
  font: normal 9px Arial;
  text-shadow: 0 1px 0 #000;
  border-right: 1px solid #A99C9F;
  border-left: 0px double #A99C9F;
  text-transform:capitalize
}

#menu li:first-child {
  border-left: none
}

#menu a {
  display: block;
  line-height: 20px;
  padding: 0 4.5px;
  text-decoration: none;
  color: #eee;
  background: #B10021;
}

#menu li:hover > a,
#menu li a:hover {
  background: #730000
}

#menu input {
  display: block;
  margin: 0 0;
  padding: 0 0;
  width: 100px;
  height: 20px;
  opacity: 0;
  cursor: pointer
}

#menu label {
  font: bold 20px Arial;
  display: none;
  width: 125px;
  height: 20px;
  line-height: 14px;
  line-width: 14px;
  text-align: center
}

#menu label span {
  font-size: 9px;
  position: absolute;
  left: 1px
}

#menu ul.menus {
  height: auto;
  width: 102px;
  background: #B10021;
  position: absolute;
  padding:inherit;
  z-index: 89;
  display: none;
  border: 1;
}

#menu ul.menus li {
  display: block;
  width: 100%;
  font: 9px Arial;
  text-transform: none;
}

#menu li:hover ul.menus {
  display: block
}

#menu a.home {
  background: #4A0202;
}

#menu a.prett {
  padding: 0 17px 0 12px
}

#menu a.prett::after {
  width: 0;
  height: 0;
  border-width: 6px 5px;
  border-style: solid;
  border-color: #A99C9F;
  position: absolute;
  top: 15px;
  right: 9px
}

#menu ul.menus a:hover {
  background: #4A0202;
}

#menu ul.menus .submenu {
  display: none;
  position: absolute;
  left: 102px;
  padding:inherit;
  background: #B10021;
  top: 0;
  width: 100px;
}

#menu ul.menus .submenu li {
  background: #B10021;
}

#menu ul.menus .has-submenu:hover .submenu {
  display: block;
}




@media (min-width: 1202px) {

#menu {
  background: #B10021;
  color: #eee;
  height: 45px;
  padding:inherit;
  border-bottom: 4px solid #eeeded;
}

#menu ul,
#menu li {
  margin: 0 0;
  padding: 0 0;
  list-style: none;
}

#menu ul {
  height: 45px
}

#menu li {
  float: left;
  display: block;
  position: relative;
  font: normal 14px Arial;
  text-shadow: 1 1px 0 #000;
  border-right: 0px double #A99C9F;
  border-left: 1px double #A99C9F;
  text-transform:capitalize
}

#menu a {
  display: block;
  line-height: 40px;
  padding: 0 47.5px;
  text-decoration: none;
  color: #eee;
  background: #B10021;
}

#menu li:hover > a,
#menu li a:hover {
  background: #730000
}

#menu input {
  display: none;
  margin: 0 0;
  padding: 0 0;
  width: 100px;
  height: 45px;
  opacity: 0;
  cursor: pointer
}

#menu label span {
  font-size: 14px;
  position: absolute;
  left: 35px
}

#menu ul.menus {
  height: auto;
  width: 160px;
  background: #B10021;
  position: absolute;
  z-index: 99;
  display: none;
  border: 10;
}

#menu ul.menus li {
  display: block;
  width: 100%;
  font: 14px Arial;
  text-transform: none;
}

#menu li:hover ul.menus {
  display: block
}

#menu a.home {
  background: #4A0202;
}

#menu a.prett {
  padding: 0 27px 0 12px
}

#menu a.prett::after {
  width: 0;
  height: 0;
  border-width: 6px 5px;
  border-style: solid;
  border-color: #A99C9F;
  position: absolute;
  top: 15px;
  right: 9px
}

#menu ul.menus a:hover {
  background: #4A0202;
}

#menu ul.menus .submenu {
  display: none;
  position: absolute;
  left: 158px;
  background: #B10021;
  top: 0;
  width: 198px;
}
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 1202px) {
  /* Remove the padding we set earlier */
 #menu {
  background: #B10021;
  color: #eee;
  height: 45px;
  padding:inherit;
  border-bottom: 4px solid #eeeded;
}

#menu ul,
#menu li {
  margin: 0 0;
  padding: 0 0;
  list-style: none;
}

#menu ul {
  height: 45px
}

#menu li {
  float: left;
  display: block;
  position: relative;
  font: normal 14px Arial;
  text-shadow: 1 1px 0 #000;
  border-right: 0px double #A99C9F;
  border-left: 1px double #A99C9F;
  text-transform:capitalize
}

#menu a {
  display: block;
  line-height: 40px;
  padding: 0 47.5px;
  text-decoration: none;
  color: #eee;
  background: #B10021;
}

#menu li:hover > a,
#menu li a:hover {
  background: #730000
}

#menu input {
  display: none;
  margin: 0 0;
  padding: 0 0;
  width: 100px;
  height: 45px;
  opacity: 0;
  cursor: pointer
}

#menu label span {
  font-size: 14px;
  position: absolute;
  left: 35px
}

#menu ul.menus {
  height: auto;
  width: 160px;
  background: #B10021;
  position: absolute;
  z-index: 99;
  display: none;
  border: 10;
}

#menu ul.menus li {
  display: block;
  width: 100%;
  font: 14px Arial;
  text-transform: none;
}

#menu li:hover ul.menus {
  display: block
}

#menu a.home {
  background: #4A0202;
}

#menu a.prett {
  padding: 0 27px 0 12px
}

#menu a.prett::after {
  width: 0;
  height: 0;
  border-width: 6px 5px;
  border-style: solid;
  border-color: #A99C9F;
  position: absolute;
  top: 15px;
  right: 9px
}

#menu ul.menus a:hover {
  background: #4A0202;
}

#menu ul.menus .submenu {
  display: none;
  position: absolute;
  left: 160px;
  background: #B10021;
  top: 0;
  width: 198px;
}
}