/* CSS Document */

.cssMenu {
text-align: center;
	width:790x;
	height:32px;
	font-size:4; font-family: Arial ; 
	font color:#6c6c6c;
	position:relative; /* когда значения left и top задаются относительно текста, за которым следует элемент */
	z-index:100;
	border-right:0px;
	}
* html .cssMenu { /* А вот здесь первый hack для IE 5.5 чтоб корректно отобразить размер */
	width:790px;
	width:790px;
	}
.cssMenu ul { /* Теперь уберем все отступы и точки в начале пунктов меню */
	padding:0;
	margin:0;
	list-style-type:none;
	}
.cssMenu li { /* Указываем элементам нашего списка относительую позицию и вертикальную организацию */
	float:left;
	width:156px;
	position:relative;
	color:#a8a8a8;
	}

.cssMenu a, .cssMenu a:visited { /* Здесь задаем стиль для элементов высшего уровня */
	display:block;
	font-size:14px; 
	color:#6c6c6c;
	text-decoration:none;
	color:#a8a8a8;
	width:156px;
	height:30px;
	border:1px solid #3c3c3c;
	border-width:1px 1px 1px;
	background:#3c3c3c; /*background-image:url(menu.gif)- если потребуется внести картинку на место кнопок*/
	padding-left:10px;
	line-height:29px;
	}
* html .cssMenu a, * html .cssMenu a:visited { /* Еще один hack для корректного отображения IE 5.5 элементов меню */
	width:156px;
	width:156px;
	}
.cssMenu ul ul a.list, .cssMenu ul ul a.list:visited { /* Указываем заний фон для элементов второго уровня из которых будут выпадать другие разделы */
	background:#3c3c3c;
	}
.cssMenu ul ul a.list:hover{ /* Теперь как будут выглядеть элементы второго уровня при наведении курсора */
	background:#3c3c3c;
	color:#fff;
	}
.cssMenu ul ul :hover > a.list { /* И здесь для других броузеров */ 
	background:#3c3c3c;
	color:#fff
	}
.cssMenu ul ul ul a, .cssMenu ul ul ul a:visited{ /* Теперь для элементов меню третьего уровня */
	background:#3c3c3c;
	color:#fff;
	}
.cssMenu ul ul ul a:hover { /* Как будут выглядеть элементы третьего уровня при наведении курсора */
	background:#3c3c3c;
	color:#fff;
	}
.cssMenu ul ul { /* Теперь присваиваем выпадающим элементам абсолютную позицию и прячем их */
	visibility:hidden;
	position:absolute;
	height:0;
	top:31px;
	left:0;
	width:156px;
	border-top:0px solid #fff;
	}
* html .cssMenu ul ul { /* И еще один hack для 5й версии */
	top:30px;
	top:31px;
	}
.cssMenu ul ul ul{ /* Позиция элементов третьего уровня */
	left:156px;
	top:0px;
	width:156px;
	}
.cssMenu ul ul ul.left { /* А здесь позиция элементов третьего уровня для выпадания в левую сторону */
	left:-156px;
	}
.cssMenu table { /* Здесь указываем свойства таблицы. Необходимо для IE */
	position:absolute;
	top:0;
	left:0;
	border-collapse:collapse;
	}
.cssMenu ul ul a, .cssMenu ul ul a:visited { /* Свойства элементов <a> второго уровня */
	background:#3c3c3c;
	font-size:14px; 
	color:#6c6c6c;
	height:auto;
	line-height:1em;
	padding:5px 10px;
	width:146px;
	border-width:0 1px 1px 1px;
	}
* html .cssMenu ul ul a, * html .cssMenu ul ul a:visited { /* И еще один hack для IE 5.5 */
	width:146px;
	width:147px;
	background-color:#393939;
	}

/* Теперь определим свойства элементов, на которые наведен курсор */

.cssMenu a:hover, .cssMenu ul ul a:hover{ /* Элементы высшего уровня */
	color:#fff;
	background-image:url(menu.png); 
	background-position:center; 
	background-repeat:no-repeat;
	}
.cssMenu :hover > a, .cssMenu ul ul :hover > a { /* Для остальных броузеров */
	color:#fff;

	}
.cssMenu ul li:hover ul, .cssMenu ul a:hover ul{ /* Показываем элементы второго уровня если навели на первый */
	visibility:visible;
	}
.cssMenu ul :hover ul ul{ /* Оставляем третий уровень невидимым */ 
	visibility:hidden;
	}
.cssMenu ul :hover ul :hover ul{ /* И теперь показываем элементы третьего уровня при наведении на соотвествующий пункт второго */
	visibility:visible;
	}
