/* <style> */

/* ----- Required ----------------------------------------------------------- */

div.horz_menu a { display: block; float: left; }
div.vert_menu a { display: block; float: none; }

div.vert_menu
{
	position: absolute;
	visibility: hidden;
}


/* ----- Sample 1 ----------------------------------------------------------- */

div.sample1 div.vert_menu
{
	border-bottom: 1px solid black; /*second level very top and bottom border only*/
	border-top: 1px solid black; 
}

div.sample1 div.horz_menu a /*first level details*/
{
	border-left: 1px solid white;
	padding: 1px 0px 1px 0px;
	width: 114px;
	background: black;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 11px;
	color: white;
	text-align: center;
	visibility: visible;
}
div.sample1 div.vert_menu a /*second level details*/
{
	border: 1px solid black;
	padding: 1px 0px 1px 0px;
	width: 160px;
	height: 25px;
	background: #B9B9B9;
	text-decoration: none;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 11px;
	color: black;
}

div.sample1 div.horz_menu a { margin-right:  -1px; }
div.sample1 div.vert_menu a { margin-bottom: -1px; margin-top: -1px; padding-right: 2px; padding-right: 2px; padding-top: 5px; padding-bottom: 5px; }

div.sample1 div.horz_menu a:hover /*main level details mouse on*/
{ 
	background: #EB090B;
	width: 114px;
	text-decoration: none;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 11px;
	color: black;
}
div.sample1 div.vert_menu a:hover /*second level details mouse on*/
{ 
	background: black;
	width: 160px;
	text-decoration: none;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 11px;
	color: white;
}
div.sample1 div.horz_menu a.active /*main level details activate*/
{ 
	background: black;
	width: 114px;
}
div.sample1 div.vert_menu a.active /*second level details activate*/
{ 
	background: #AFDEED;
	width: 160px;
	border: 1px solid black;
}


/* ----- Sample 2 ----------------------------------------------------------- */

div.sample2 div.vert_menu { border-bottom:  1px solid black; }

div.sample2 div.horz_menu a,
div.sample2 div.vert_menu a
{
  border: 1px solid black;

  width: 106px;

  height:      20px;
  line-height: 19px;
  vertical-align: middle;

  background: url('img.png') 0px 40px;

  text-decoration: none;
  font-family: "Times New Roman", Serif;
  font-weight: 900;
  font-size: 13px;
  color: #206040;
}

div.sample2 div.horz_menu a { margin-right:  -1px; }
div.sample2 div.vert_menu a { margin-bottom: -1px; }

div.sample2 div.horz_menu a:hover,
div.sample2 div.vert_menu a:hover { background-position: 0px 20px; }

div.sample2 div.horz_menu a.parent,
div.sample2 div.vert_menu a.parent
{
  color: #206060;
  background-position: 0px 0px;
}

div.sample2 div.horz_menu a.active,
div.sample2 div.vert_menu a.active,
div.sample2 div.horz_menu a.active:hover,
div.sample2 div.vert_menu a.active:hover
{
  color: #206060;
  background-position: 0px 60px;
}