/* Правила для экранной версии представления данных. */

@media screen {
  /* ================== Общие установки для страницы =================== */
  html, body, img {
    margin: 0;
    padding: 0;
    border: 0;
  }
  body {
    color: #000;
    background: #fff;
    font-family: "Times New Roman", Times, serif;
    text-align: center;
  }

  /* "Носитель" всей страницы */
  #support {
    width: 980px;
    margin: auto;
    text-align: left;
  }

  /* Шрифт для "шапки", меню навигации, заголовков в основном тексте, "подвала": */
  #header, #hmenu, #menu, #text h1, #text h2, #text h3, #footer {
    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
  }

  /*============================= "Шапка" ================================*/
  /* Представление "шапки" на главной и внутренних страницах сайта: */
  #header {
    color: #000;
    font-size: 32px;
    font-weight: bold;
    background: #fff url(/_styles/images/bg_head.gif) center center no-repeat scroll;
    padding: 20px 0px;
    margin: 0px;
    margin-top: 10px;
    text-align: right;
/*    width: 100%;  */
  }
  #name {
    white-space: nowrap;
    margin-right: 20px;
  }

  /* Выделение текста другим цветом: */
  #header .red {
    color: #f00;
  }
  #header .yellow {
    color: #ff0;
  }
  #header .blue {
    color: #00f;
  }

  /* Представление логотипа: */
  #header img.logo {
    width: 253px;
    height: 57px;
    margin: -9px 50px 0px 5px;
    vertical-align: middle;
    float: left;
    clear: left;
  }

  /*========================= Вертикальное меню ==========================*/
  /* "Носитель" вертикального меню: */
  #menusupport {
    width: 200px;
    margin-top: 40px;
/*    margin-bottom: 300px;*/  /* 300px - без баннеров под меню */
    float: left;
  }

  /* Вертикальное меню: */
  #menu {
    font-size: 14px;
    font-weight: bold;
    background: #fff url(/_styles/images/bg_menu.gif) top left no-repeat scroll;
    text-align: left;
    padding: 30px 0px 60px 5px;  /* top + bottom = 90px ! */
  }
  #menu ul {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    margin-left: 10px;
  }
  #menu ul li {
    white-space: nowrap;
    padding: 8px 0px;
    margin: 0px;
  }
  #menu ul li a, #menu ul li span {
    display: block;
  }

  /* Представление рисунка пункта меню: */
  #menu img.item {
    width: 4px;
    height: 9px;
    vertical-align: middle;
  }

  /* Представление блока рекламы: */
  #ad {
    margin: 20px 0px 0px 20px;
  }

  /* Общие правила оформления ссылок в горизонтальном и вертикальном меню: */
  #hmenu a, #menu a {
    color: #000;
    text-decoration: none;
  }
  #hmenu a.current:link, #hmenu a.current:visited, #hmenu span, #menu a.current:link, #menu a.current:visited, #menu span {
    color: #00f;
  }
  #hmenu a:hover, #hmenu a.current:hover, #menu a:hover, #menu a.current:hover {
    color: #09f;
  }

  /*========================== Основной текст =============================*/
  /* Ширина margin-left блока #text должна быть равна ширине "носителя" #menusupport: */
  #text {
    padding: 30px 20px 20px 20px;
    margin-left: 200px;
  }
  #text h1 {
    color: #000;
    font-size: 100%;
    padding: 5px 0px;
    margin: 0px 0px 20px 0px;   /* значение верхнего отступа обязательно должно быть задано 0px! */
  }
  #text h2 {
    color: #999;
    font-size: 100%;
    margin-top: 20px;
    margin-bottom: 10px;
  }

  /* Выделение текста другим цветом: */
  .greybold {
    color: #808080;
    font-weight: bold;
  }
  .greyboldm {
    color: #808080;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 5px;
  }

  /* Представление списков в основном тексте: */
  #text ul, #text ol {
    margin-top: 0px;
    margin-bottom: 0px;
  }

  /* Оформление ссылок в основном тексте: */
  #text a {
    text-decoration: none;
  }
  #text a:link {
    color: #03f;
  }
  #text a:visited
  {
    color: #808080;
  }
  #text a:hover {
    text-decoration: underline;
  }
  #text a:active {
    color: #f00;
  }

  /* Оформление специальных ссылок в основном тексте: */
  #text a.special {
    font-size: 80%;
    color: #f00;
    background: #f6f6f6;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    border: solid 1px #a9a9a9;
    padding: 3px 5px;
  }
  #text a.special:link, #text a.special:visited, #text a.special:active {
    color: #f00;
  }
  #text a.special:hover {
    color: #09f;
  }

  /*======================== Горизонтальное меню =========================*/
  #hmenu {
    width: 100%;            /* аналогично подвалу */
    font-size: 14px;
    color: #808080;
    text-align: center;
    background: #fff url(/_styles/images/bg_hmenu.png) center center no-repeat scroll;
    padding: 20px 0px;
    clear: both;
  }
  #hmenu a, #hmenu span {
    font-weight: bold;
    white-space: nowrap;
  }

  /*============================= "Подвал" ===============================*/
  #footer {
/*    width: 100%;*/         /* 100% не нужно (чтобы корректно задать padding) */
    font-size: 60%;
    color: #000;
    clear: both;
    padding: 5px 20px 20px 20px;
  }
  #footer .fdiv {
    float: right;
    clear: right;
  }
  #footer span {
    white-space: nowrap;
  }

  /* Оформление счетчиков: */
  #footer img {
    vertical-align: middle;
    margin-left: 10px;
  }

  /* Оформление ссылок в "подвале": */
  #footer a:link, #footer a:visited, #footer a:hover, #footer a:active {
    color: #bbb;
    text-decoration: underline;
  }
  #footer a:hover {
    text-decoration: none;
  }
  #s_links {
    color: #bbb;
    clear: both;
    margin-top: 15px;
  }
  #footer #devel a {
    color: #01019f;
    text-decoration: underline;
  }
  #footer #devel a:hover {
    text-decoration: none;
  }

  /*======================== Оформление таблиц ===========================*/
  table {
    border-collapse: collapse;
    border: solid 1px #808080;
  }
  td, th {
    padding: 5px 10px;
    border: solid 1px #808080;
  }
  th {
    color: #808080;
    background: #f1f1f1;
    text-align: center;
    font-weight: bold;
  }
  td {
    font-size: 80%;
    background: #f9f9f9;
  }
  .cbold {
    text-align: center;
    font-weight: bold;
  }
  .center {
    text-align: center;
  }
  .ital {
    color: #808080;
    font-style: italic;
    white-space: nowrap;
  }
  .double {
    border-top: solid 2px #f9f9f9;
  }

  /*=============== Оформление полей ввода текста и кнопок ===============*/
  input.ttext, textarea {
    background: #f6f6f6;
    border: solid 1px #ccc;
    font-family: "Lucida Console", monospace;
  }
  input.button {
    color: #f00;
    background: #f6f6f6;
    font-weight: bold;
    border: solid 1px #a9a9a9;
  }
  select.selplus {
    width: 700px;
    font-size: 80%;
    background: #f6f6f6;
  }
  fieldset {
    border: solid 1px #ccc;
    padding: 20px;
  }
  legend {
    color: #c00;
    font-weight: bold;
  }
}