@charset=windows-1251";
/* CSS Document */
body {
  margin: 20px;
  padding: 0;
  font-family: "Georgia", serif;
  line-height: 150%;
}
 
h1 {
  line-height: 100%;
}
 
#pageBody {
  max-width: 1200px;
}
 
#header, #nav, #footer, h1, h2, h3 {
  font-family: Tahoma, Geneva, sans-serif;
}
 
#header {
  width: 100%;
  margin: 0;
  padding: 0;
}
 
#header .inner {
  margin: 0 0 20px 0;
  padding: 20px;
  color: #990000;
}
  
#content {
  float: right;
  width: 75%;
  margin: 0 0 20px 0;
  padding: 0; z-index:1;
}
 
#content .inner {
  margin-right: 20px;
  padding: 20px;
  color: #333;
  background: #FFFFCC;
}
 
#sidebar {
  float: left;
  width: 8%;
  margin: 0;
  padding: 0;
}
 
#sidebar .inner {
 margin-right: 20px;
  padding: 0px;
  color: #fff;
  background: #FFCC66;
  font-size: 85%;
}
 
#nav {
  float: right;
  width: 15%;
  margin: 0;
  padding: 0; z-index:100;
}
 
#nav ul {
  margin: 0;
  padding: 20px;
  list-style: none;
  color: #333;
  background: #990000;
  overflow: hidden;
}
 
#nav li {
  border-bottom: 1px solid rgba(255,255,255,.5);
}
 
#nav li:last-child {
  border-bottom: none;
}
 
#nav a {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 10px 0 10px 10px;
  font-weight: bold;
}
 
#nav a:hover {
  background: #bce5e3;
}
 
#footer {
  clear: both;
  width: 100%;
  margin: 0;
  padding: 0;
  color: #fff;
  background: #990000;
}
 
#footer .inner {
  padding: 5px 20px;
}

/* если ширина окна <= 1000px ... */
 /*открываем media query*/
@media screen and (max-width: 1000px) {
 
  /* Делаем основной контент немного шире */
 
  #content {
    width: 75%;
  }
 
  /* Переносим навигацию наверх сайдбара */
 
  #nav, #sidebar {
    width: 25%;
  }
 
  /* Регулируем отступы сайдбара */
 
  #sidebar .inner {
    display: none;
  }
 
}
/* если ширина окна <= 700px ... */
      /*открываем media query*/
    @media screen and (max-width: 700px) {
 
      /* Заполняем контентом всю ширину экрана */
 
      #content {
        width: 100%;
      }
 
      /* Удаляем правый отступ у контента */
 
      #content .inner {
        margin-right: 0;
      }
 
      /* Располагаем навигацию над контентом */
 
      #nav {
        float: none;
        width: 100%;
        margin-bottom: 20px;
      }
 
      /* Располагаем элементы навигации в строку */
 
      #nav li {
        float: left;
        width: 24%;
        border-bottom: none;
        border-right: 1px solid rgba(255,255,255,.5);
      }
 
      #nav li:last-child {
        width: 27%;
        border-right: none;
      }
 
      #nav a {
        text-align: center;
        padding-left: 0;
      }
 
      /* Располагаем сайдбар под контентом*/
 
      #sidebar {
        display: none;
      }
	  
}
 /*закрываем media query*/
/* Если ширина окна  <= 480px ... */
 
@media screen and (max-width: 480px) {
 
  body {
    margin: 0;
  }
 
  #header .inner {
    padding-top: 5px;
    padding-bottom: 5px;
  }
 
  #header .inner, #content, #nav, #sidebar {
    margin-bottom: 5px;
  }
 
  #nav ul {
    padding: 5px 7px;
  }
 
}