body {
	background-image: url('../img/bg.jpg');
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;

}

#telo {
background: #fff;
border:2px solid black;
}

#menu {
margin-right:10px;
margin-top:10px;

}
#block {
border:1px solid black;
background-color:#ffffff;
}

#content {
background-color:#ffffff;
margin:10px;
padding:15px;
}
#downbox {
border:1px solid black;
background-color:#fff;
width:727px;
height:60px;
}
#matimg {
width:261px;
margin-right:10px;
border:1px solid black;
}
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
	margin: 0px;
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 10px;
}

ul {
padding-top:0px;
padding-left:15px;
list-style: none;
font-family:comic sans ms;
}
a {
color:#0071bb;
text-decoration: none;
font-size:15px;
}
a:hover {
color:#4b55a1;
}

h1 {
	font-family: Courier New, sans-serif;
	font-size: 16px;
	color: #000;
	margin: 0px;
	padding-top: 0px;
	padding-left: 0px;
	text-align:right;
}
#menuname {
	font-size: 20px;
	color: #0071bb;
	padding: 4px;
	font-family: Arial, sans-serif;
	margin: 0px;
}
h3 {
	font-family: Arial, sans-serif;
	font-size: 16px;
	color: #0071bb;
	margin: 0px;
	padding-top: 20px;
	padding-left: 10px;
}


td {
	margin: 0px;
	padding: 0px;
	font-family: Arial, sans-serif;
	font-size: 12px;
}
.topbutton {
width:100px;
border:2px solid #ccc;
background:#f7f7f7;
text-align:center;
padding:10px;
position:fixed;
bottom:50px;
right:50px;
cursor:pointer;
color:#333;
font-family:verdana;
font-size:12px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
}


#nav{

    float:left;

    width:100%;

    list-style:none;

    font-weight:bold;

    margin-bottom:50px;

}

#nav li{

    float:left;

    margin-right:50px;

    position:relative;

    display:block;

}

#nav li a{

    display:block;

    padding:5px;

    color:#fff;

    background:#1E90FF;

    text-decoration:none;

     

    text-shadow:1px 1px 1px rgba(0,0,0,0.75); /* Тень текста, чтобы приподнять его на немного */

    -moz-border-radius:2px;

    -webkit-border-radius:2px;

    border-radius:2px;

}

#nav li a:hover{

    color:#fff;

    background:#0000FF;

    background:rgba(107,12,54,0.75); /* Выглядит полупрозрачным */

    text-decoration:underline;

}

 

/*--- ВЫПАДАЮЩИЕ ПУНКТЫ ---*/

#nav ul{

    list-style:none;

    position:absolute;

    left:-9999px; /* Скрываем за экраном, когда не нужно (данный метод лучше, чем display:none;) */

    opacity:0; /* Устанавливаем начальное состояние прозрачности */

    -webkit-transition:0.25s linear opacity; /* В Webkit выпадающие пункты будут проявляться */

}

#nav ul li{

    padding-top:1px; /* Вводим отступ между li чтобы создать иллюзию разделенных пунктов меню */

    float:none;

    background:url(dot.gif);

}

#nav ul a{

    white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */

    display:block;

}

#nav li:hover ul{ /* Выводим выпадающий пункт при наведении курсора */

    left:0; /* Приносим его обратно на экран, когда нужно */

    opacity:1; /* Делаем непрозрачным */

}

#nav li:hover a{ /* Устанавливаем стили для верхнего уровня, когда выводится выпадающий список */

    background:#0000FF;

    background:rgba(107,12,54,0.75); /* Выглядит полупрозрачным */

    text-decoration:underline;

}

#nav li:hover ul a{ /* Изменяем некоторые стили верхнего уровня при выводе выпадающего пункта */

    text-decoration:none;

    -webkit-transition:-webkit-transform 0.075s linear;

}

#nav li:hover ul li a:hover{ /* Устанавливаем стили для выпадающих пунктов, когда курсор наводится на конкретный пункт */

    background:#1E90FF;

    background:rgba(51,51,51,0.75); /* Будет полупрозрачным */

    text-decoration:underline;

    -moz-transform:scale(1.05);

    -webkit-transform:scale(1.05);

}