/* style the outer div to give it width */



.menu {



position: absolute;



width:984px;



height:31px;



top: 160px;



left:0px;



float:left;



font-size:1em;



z-index:10;



background: #ffffff url("../images/menu-podklad.gif") 0px 0px repeat-x;



border: 2px solid #360404;

border-left: 10px solid #360404;

border-right: 10px solid #360404;



}



/* remove all the bullets, borders and padding from the default list styling */



.menu ul {



padding:0;



margin:0;



list-style-type:none;



}



.menu ul ul {







}



/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */



.menu li {



	float:left;



	position:relative;



}



/* style the links for the top level */



.menu a, .menu a:visited {



	display:block;



	font-size:13px;



	text-decoration:none;



	color:#fff;



	height:31px;



	border:0px solid #fff; /*border*/



	border-width:0px 0px 0 0;



	padding-left:30px;



	padding-right:30px;



	line-height:30px;



}



/* a hack so that IE5.5 faulty box model is corrected */



* html .menu a, * html .menu a:visited {



	//float:left;



}







/* style the second level background */



.menu ul ul a.drop, .menu ul ul a.drop:visited {



background:#949e7c;



}



/* style the second level hover */



.menu ul ul a.drop:hover{



	background-color: #2e5c87;



}



.menu ul ul :hover > a.drop {



background:#c9ba65;



}



/* style the third level background */



.menu ul ul ul a, .menu ul ul ul a:visited {



background:#e2dfa8;



}



/* style the third level hover */



.menu ul ul ul a:hover {



background:#b2ab9b;



}



.menu ul ul ul :hover > a {



background:#b2ab9b;



}







/* hide the sub levels and give them a positon absolute so that they take up no room */



.menu ul ul {



visibility:hidden;



position:absolute;



height:0;



top:31px;



left:0; 



width:150px;



}



/* another hack for IE5.5 */



* html .menu ul ul {



top:31px;



t\op:31px;



}











/* style the table so that it takes no part in the layout - required for IE to work */



.menu table {position:absolute; top:0; left:0;}







/* style the second level links */



.menu ul ul a, .menu ul ul a:visited {



background:#bd3739; 



color:white; 



height:auto; 



line-height:1em; 



padding:5px 10px; 



width:150px



/* yet another hack for IE5.5 */



}



* html .menu ul ul a{



width:150px;



w\idth:150px;



}







.menu a {text-align:center;}



.menu ul ul a {text-align:left;}







/* style the top level hover */



.menu a:hover{



	color:#fff;



	background-color: #000;



	background-image: url("../images/menu-hover.gif");



}







.menu ul ul a:hover{



	color:white;



	background-color: #570202;



	background-image: none;



}







.menu :hover > a {



	color:#fff;



	background-color: #570202;



	background-image: url("../images/menu-hover.gif");



	background-repeat: repeat-x;



}







.menu ul ul :hover > a {



	color:#fff;



	background-color: #570202;

	

	background-image: none;





}











/* make the second level visible when hover on first level list OR link */



.menu ul li:hover ul,



.menu ul a:hover ul{



visibility:visible; 



}



/* keep the third level hidden when you hover on first level list OR link */



.menu ul :hover ul ul{



visibility:hidden;



}



/* keep the fourth level hidden when you hover on second level list OR link */



.menu ul :hover ul :hover ul ul{



visibility:hidden;



}



/* make the third level visible when you hover over second level list OR link */



.menu ul :hover ul :hover ul{ 



visibility:visible;



}



/* make the fourth level visible when you hover over third level list OR link */



.menu ul :hover ul :hover ul :hover ul { 



visibility:visible;



}