.submenu {
	position: relative;
	margin: 0;
	padding: 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #eee;
	border-right: 1px solid #aaa;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	font-size: 14px;
	background: #eec;
	color: #333;
	text-indent: 1em;
}
.submenu li{
  list-style-type : none;
  margin: 0;
  padding: 0;
  color:#333;
}
.submenu li a{
  position: relative;
  display: block;
  padding: 10px 0px;
  text-decoration: none;
  line-height: 15px;
}
.submenu > li:hover > a{
  color: #fff;
  background: #660;
  font-weight: bold;
}
.submenu ul li a:hover{
  color:#e47911;
}
.submenu ul{
  display: none;
  z-index: 100;
  position: absolute;
  top: -1px;
  right: 232px;
  width: 280px;
  height: auto;
  margin: 0;
  padding: 10px 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #eee;
	border-right: 1px solid #aaa;
  border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
  background: #eec;
  box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}
.submenu li:hover ul{
  display: none;
}

@media screen and (min-width: 768px) {

.submenu {
	display: inline-block;
	width: 33%;
	position: relative;
	margin: 0;
	padding: 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #eee;
	border-right: 1px solid #aaa;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	font-size: 14px;
	background: #eec;
	color: #333;
	text-indent: 1em;
}
.submenu li{
  list-style-type : none;
  margin: 0;
  padding: 0;
  color:#333;
}
.submenu li a{
  position: relative;
  display: block;
  padding: 10px 0px;
  text-decoration: none;
  line-height: 15px;
}
.submenu > li:hover > a{
  color: #fff;
  background: #660;
  font-weight: bold;
}
.submenu ul li a:hover{
  color:#e47911;
}
.submenu ul{
  display: none;
  position: absolute;
  top: -1px;
  right: 232px;
  width: 280px;
  height: auto;
  margin: 0;
  padding: 10px 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #eee;
	border-right: 1px solid #aaa;
  border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
  background: #eec;
  box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}
.submenu li:hover ul{
  display: none;
}

}

@media screen and (min-width: 992px) {

.submenu {
	position: relative;
	width: 232px;
	margin: 0;
	padding: 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #eee;
	border-right: 1px solid #aaa;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	font-size: 90%;
	background: #eec;
	color: #333;
	text-indent: 1em;
}
.submenu li{
  list-style-type : none;
  margin: 0;
  padding: 0;
  color:#333;
}
.submenu li a{
  position: relative;
  display: block;
  padding: 10px 0px;
  text-decoration: none;
  line-height: 15px;
}
.submenu > li:hover > a{
  color: #fff;
  background: #660;
  font-weight: bold;
}
.submenu ul li a:hover{
  color:#e47911;
}
.submenu ul{
  display: none;
  position: absolute;
  z-index: 110;
  top: -1px;
  right: 230px;
  width: 280px;
  height: auto;
  margin: 0;
  padding: 10px 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #aaa;
	border-left: 1px solid #eee;
	border-right: 1px solid #aaa;
  border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
  background: #eec;
  box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
}
.submenu li:hover ul{
  display: block;
}
.submenu ul.big{
  right: -417px;
  width: 400px;
}
.submenu ul.big li{
  float: left;
  width: 200px;
}
.submenu ul h3{
  margin: 0;
  color:#e47911;
  font-size: 90%;
  font-weight: bold;
}
.submenu ul li a{
  padding: 2px 5px;
}

}