@import "reset.css";
body  {
   width: 100%;
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: white;
	margin: 0; /* рекомендуется использовать нулевое значение поля и отступа элемента body, чтобы учесть различные настройки по умолчанию для браузеров. */
	padding: 0;
	text-align: center; /* выравнивает контейнер по центру в браузерах IE 5*. Затем для текста задается по умолчанию выравнивание по левому краю в селекторе #container. */
	color: #000000;
}
h1 {
   color: #8b4513;
   font-size: 1em;
   text-align: center;
}
h3 {
	text-align:center;
}
p {
	color:#363636;
}
<!--[if IE]>   
/* поместите в этом условном комментарии исправления CSS для всех версий браузера 
IE. */ 
@import "reset.css";
.conteiner{
	margin: 0;
	padding: 0;
}
.thrColElsHdr #sidebar1, .thrColElsHdr #sidebar2
{ 
	padding: 0;
	margin: 0;
} 
.thrColElsHdr #mainContent { 
	zoom: 1; 
	padding-top: 15px; 
}
/* указанное выше собственное свойство zoom задает для браузера Internet Explorer
 значение "hasLayout", необходимое для предотвращения нескольких ошибок. */  
<![endif]-->
/* Советы по "эластичным" макетам
1. "Эластичные" макеты более непредсказуемые, поскольку их общий размер зависит от размера шрифтов, заданного пользователем по умолчанию. Вместе с тем при правильном применении такие макеты более удобны для пользователей, которым нужны шрифты более крупного размера, так как длина строки остается пропорциональной.
2. Размеры элементов div в данном макете основаны на 100% размере шрифта в элементе body. При уменьшении общего размера шрифта с помощью свойства font-size (до 80% для элемента body или #container) размеры всего макета будут пропорционально уменьшены. Чтобы компенсировать этот эффект, можно увеличить ширину различных элементов div.
3. Если изменить размер шрифта отдельно для каждого элемента div вместо изменения всего макета (то есть элементу #sidebar1 задан размер шрифта 70%, а элементу #mainContent — 85%), пропорционально будет изменен общий размер каждого элемента div. Их размер можно будет настроить в зависимости от окончательного размера шрифта.
*/

.thrColElsHdr {
	width: 100%;
}
#index_table3.articles_a a {
	display: inline;
}
.thrColElsHdr #container { 
	width: 100%;  
	margin: 3px 0 !important; /* автоматические поля (совместно с шириной) выравнивают страницу по центру. */
	border: 1px solid #000000;
	background-color: #f9f9f9;
	text-align: left; /* переопределяет свойство text-align: выравнивание элемента body по центру. */
} 
.thrColElsHdr #header { 
	background: white; 
	padding: 0;  /* это значение отступа соответствует выравниванию по левому краю элементов в блоках div, расположенных под ним. Если в элементе #header вместо текста используется изображение, отступ можно удалить. */
   height: 130px;
   width: 100%;
}
.thrColElsHdr #mainContent h4 {
	font-size: 1em;
	color: #8b4513;
	text-align: center;
	text-decoration: underline;
	font-style: italic;
} 
.thrColElsHdr #header h1 {
	margin: 0; /* нулевое значение поля последнего элемента в #header div позволит избежать сжатия полей, то есть появления необъяснимого пространства между элементами div. Если вокруг элемента div есть граница, нет необходимости устанавливать это значение, поскольку граница также предотвращает сжатие полей. */
	padding: 10px 0; /* использование отступа вместо поля позволит сохранить расстояние между элементом и границами div. */
}
#gorizont_navig{
	height: 35px;
	width: 100%;
	background-image: url(../images/sidebar2_h.jpg);
	background-repeat: repeat-x;
}
/* Советы по элементу sidebar1:
1. Учтите, что при установке значения font-size для данного элемента div общая ширина элемента div будет изменена соответственно.
2. Поскольку значения устанавливаются в эмах, не рекомендуется использовать отступ для самой боковой панели. Он будет добавлен к ширине для совместимых со стандартами браузеров, создавая таким образом неизвестную действительную ширину. 
3. Пространство между краем блока div и элементами внутри него можно создать путем добавления правого и левого полей к этим элементам, как показано в правиле ".thrColElsHdr #sidebar1 p".
*/
.thrColElsHdr #sidebar1 {
	float: left !important;
	margin: 0 !important; 
	width: 11em  !important; /* поскольку этот элемент является обтекаемым, необходимо задать ширину. */
	background: white; /* цвет фона будет отображаться только на отрезке содержимого в колонке, но не дальше. */
	padding: 0 !important; /* верхний и нижний отступы создают визуальное пространство в этом элементе div. */
}
.thrColElsHdr #menu h1 {
	text-align: center;
	font-size: 0.8em;
	margin: 0 !important;
	padding: 0 !important;
	width: 100%;
	line-height: 36px !important;
	color: #737373;
	background-image: url(../images/fon_navig_vertical_h.jpg);
	background-repeat: repeat-x;
}
.thrColElsHdr #rss h1 {
	text-align: center;
	font-size: 0.8em;
	margin: 0 !important;
	padding: 0 !important;
	width: 100%;
	line-height: 36px !important;
	color: #737373;
	background-image: url(../images/fon_navig_vertical_h.jpg);
	background-repeat: repeat-x;
}
*html .thrColElsHdr #menu h1 {
	height: 36px;
}
.thrColElsHdr #sidebar2 {
	float: right;
	border-left:  1px solid #888888; 
	border-bottom:  1px solid #888888; 
	width: 11em; /* поскольку этот элемент является обтекаемым, необходимо задать ширину. */
	background: white; /* цвет фона будет отображаться только на отрезке содержимого в колонке, но не дальше. */
	padding: 0 0 12px 0 !important; /* верхний и нижний отступы создают визуальное пространство в этом элементе div. */
}
.thrColElsHdr #sidebar2 p, 
.thrColElsHdr #sidebar2 a{
	margin: 0;
	padding: 3px;
	text-align: left;
	font-size: 0.7em;
}
.thrColElsHdr #sidebar2 a {
	color: #737373;
	text-decoration: none;
	padding-left: 12px;
}
.thrColElsHdr #sidebar2 a.link {
	color: #888888;
}
.thrColElsHdr #sidebar2 a:hover {
	color: black;
}
.thrColElsHdr #sidebar2 h1 {
	text-align: center;
}
.thrColElsHdr #sidebar2 h2 {
	text-align: center;
	font-size: 0.8em;
	margin: 0;
	padding: 0;
	width: 100%;
	line-height: 36px;
	color: #888888;
	background-image: url(../images/fon_navig_vertical_h.jpg);
	background-repeat: repeat-x;
}
.thrColElsHdr #sidebar2 h3 {
	color: #8b4513;
	font-size: 0.8em;
	text-align:center;
}
.thrColElsHdr #sidebar1 h3, .thrColElsHdr #sidebar2 p, .thrColElsHdr #sidebar2 h3 {
	margin-left: 10px; /* левое и правое поля нужно задать для каждого элемента, который будет помещен в боковые колонки. */
	margin-right: 10px;
}
 .thrColElsHdr #sidebar1 p {
 	font-size: 0.6em;
 	color: black;
 	padding: 7px 3px 4px 5px;
 }
 .thrColElsHdr #sidebar1 {
 	text-align: center;
 }
/* Советы по элементу mainContent:
1. Если элементу #mainContent div задать значение font-size, отличное от значения элемента #sidebar1 div, поля элемента #mainContent div будут основываться на его свойстве font-size, а ширина элемента #sidebar1 div будет основываться на его свойстве font-size. Значения этих элементов div можно настраивать.
2. Пространство между элементами mainContent и sidebar1 создается путем добавления левого поля к элементу mainContent div. Пространство этой колонки сохранится, несмотря на объем содержимого элемента sidebar1 div. Это левое поле можно удалить, чтобы текст элемента #mainContent div заполнял пространство #sidebar1, если содержимое элемента #sidebar1 закончится.
3. Чтобы избежать выпадения потока, может понадобиться протестировать макет и определить приблизительный максимальный размер изображения/элемента, поскольку данный макет основывается на пользовательском размере шрифтов и задаваемых им значениях. Однако, если в браузере пользователя установлен более мелкий шрифт, в действительности же в элементе #mainContent div будет доступно меньше пространства, чем при тестировании.
4. В условном комментарии к Internet Explorer ниже свойство zoom используется для присвоения элементу mainContent значения "hasLayout". Это позволяет предотвратить несколько специфичных для Internet Explorer ошибок, которые могут возникнуть.
*/
.thrColElsHdr #mainContent {
 	margin: 0 11em 0 11em; /* правое поле можно задать в эмах или пикселах. Данное значение создает пространство с правой стороны страницы. */
} 
.thrColElsHdr #mainContent p {
	margin: 0 5px;
	padding: 7px 10px;
	text-align: justify;
	font-size: 0.8em; 
}
.thrColElsHdr #mainContent h1{
	font-size: 1.2em;
	color: black;
	text-align: center;
}
.thrColElsHdr #footer { 
	padding: 0 10px; /* это значение отступа соответствует выравниванию по левому краю элементов в блоках div, расположенных над ним. */
	border-top: 1px solid #888;
	background-image:  url(../images/sidebar2_h.jpg);
} 
.thrColElsHdr #footer p {
	margin: 0; /* нулевые поля первого элемента в нижнем колонтитуле позволят избежать возможного сжатия полей, то есть появления пространства между элементами div. */
	padding: 9px 0; /* добавление отступа к данному элементу создаст пробел (так, как он был бы создан с помощью поля), не вызывая при этом проблемы сжатия полей. */
	text-align: center;
	color: white;
	font-weight: bolder;
	font-size: 0.6em;
}
.thrColElsHdr #footer a {
	color: white;
	text-decoration: none;
}
.thrColElsHdr #footer a:hover {
	text-decoration: underline;
	color: #d7d7d7;
}

/* Прочие классы для повторного использования */
.fltrt { /* этот класс можно использовать для обтекания элемента справа на странице. Обтекаемый элемент должен предшествовать элементу, рядом с которым он должен размещаться на странице. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* этот класс можно использовать для обтекания элемента слева на странице. */
	float: left;
	margin: 0;
}
.clearfloat { /* этот класс нужно применять к элементу div или break; он должен быть последним элементом перед концом контейнера, который должен полностью вмещать поток. */
	 clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.search {
	width: 16em;
	float: right;
	margin-right: 12px;
	padding-top: 6px;
}
.height {
	height: 40px;
	margin: 5px;
}
#menu, #rss {
	background-color: #f4f4f4;
	border: 1px solid #888888;
	width: 11em;
	margin: 0px !important;
	padding: 0  !important;
}
#menu h1{
	
}
*html #menu {
	margin: 0 !important;
}
#menu p {
	text-align: center;
	color: black;
	font-size: 0.8em;
}
#menu a {
	display: block;
	padding: 4px 5px;
	text-decoration: none;
	color: gray;
	border-bottom: 1px solid #888888;
	font-size: 12px;
	text-align: left;
	font-weight: 500;
}
#menu a:hover {
	background-color: white;
	color: black;
	text-decoration: underline;
}
#gorizont_menu {
  list-style: none;
  line-height: 35px;
  font-size: 0.9em;
  font-weight: 800;
  height: 36px;
  margin-left: 0;
  text-align: left;
}
#gorizont_menu li{
	display:inline;
	padding: 0 12px !important;
	margin: 0;
	border-right: 1px solid white;
}
#gorizont_menu li a {
	padding: 5px 8px 0 4px;
	color: White;
	text-decoration: none;
}
#gorizont_menu li a:hover {
	color: #dddddd;
	text-decoration: underline;
}
#subscr {
	margin-top: 0;
	background-color: white;
	width: 11em;
	text-align: center;
	border: 1px solid #888888; 
	border-top: none;
	border-left: none;
}
#subscr a {
	text-align: center;
}
#subscr img {
	border: 0;
}
#subscr h2 {
	color: #8b4513;
	font-size: 0.7em;
	text-align: center;
	padding: 12px 0 12px 0;
}
#subscr form{
   width: 10em;
   text-align: center;
   padding-bottom: 12px;
}
.line {
	width: 80%;
	color: #737373;
	text-align: center;
	border-style: dotted;	
}
#table_index {
	background-color: #fff;
	float: left;
	width: 48%;
	margin-left: 1.5%;
	margin-top: 18px;
}
#table_index h2, 
#table_index2 h2 {
	font-size: 0.8em;
	line-height: 35px;
	color: white;
	background:url(../images/sidebar2_h.jpg);
	text-align: center;
}
#table_index3 h2,
#table_articles h2 {
	font-size: 0.8em;
	line-height: 35px;
	color: white;
	background:url(../images/sidebar2_h.jpg);
	text-align: center;
}
.thrColElsHdr #table_index p,
.thrColElsHdr #table_index2 p, {
	font-size: 0.7em;
	color: #737373;
	padding: 0.5%;
	text-align: left;
}
.thrColElsHdr #table_index3 p,
.thrColElsHdr #table_articles p {
	font-size: 0.8em;
	color: #737373;
	padding: 7px 15px;
	text-align: left;
}
#table_index h6,
#table_index2 h6,
#table_index3 h6,
#table_articles h6,
.thrColElsHdr #table_earnings h6{
	color: #959595;
	font-size: 0.6em;
   font-weight: 700;
   padding-left: 25px;
   margin: 9px;
}
#table_index a, 
#table_index2 a,
#table_index3 a,
#table_articles a {
   display: block;
	color: maroon;
	font-size: 0.9em;
	margin: 12px;
	font-weight: 800;
	line-height: 1;
}
#table_index a:hover, 
#table_index2 a:hover,
#table_index3 a:hover,
#table_articles a:hover {
	color: #888888;
	text-decoration: none;
}
#table_index img, #table_index2 img,#table_articles img {
	margin: 7px;
	height: 40px;
	width: 40px;
	float: left;
	border: 1px solid black;
}

#table_index2 {
	background-color: #f4f4f4;
	float: right;
	width: 48%;
	margin-right: 1.5%;
	margin-top: 18px;
}
#table_index3 {
	background-color: #fff;  
	width: 80%;
	margin: 14px auto;
}
#table_index3 h3 {
	color: #006400;
	text-align: center;
	font-size: 1em;
	margin-top: 9px;
}
.thrColElsHdr #table_index3 h1 {
	color: #8b4513;
	text-align: center;
	font-size: 0.9em;
	margin: 9px;
}
.thrColElsHdr #table_articles {
	background-color: #f9f9f9; 
	width: 80%;
	margin: 14px auto;
}
.thrColElsHdr #table_articles h3 {
	font-size: 0.7em;
	line-height: 35px;
	color: white;
	background:url(../images/sidebar2_h.jpg);
	text-align: center;
}
.thrColElsHdr #table_author {
	background-color: white; 
	width: 90%;
	margin: 14px auto;
}
.thrColElsHdr #table_author h3 {
	font-size: 0.7em;
	line-height: 35px;
	color: white;
	background:url(../images/sidebar2_h.jpg);
	text-align: center;
}
.thrColElsHdr #table_author h2 {
	font-size: 0.7em;
	line-height: 35px;
	color: #8b4513;
	text-align: center;
}
#table_articles.white {
	background-color: white;
}
#table_articles.pstrnav p{
	color: #606e7b;
	padding: 6px;
	margin: 6px;
}
#table_index3 img, #coments img {
	margin: 12px;
	border: 1px solid #c2c2c2;
}
#page_navigation {
	background-color: #e0e3e7;
	border: 1px solid #5c6976;
	width: 80%;
	height: auto;
	margin: 6px auto;
}
#page_navigation a {
	color: #737373;
	font-size: 1em;
	font-weight: 600;
	text-align: center;
}
#page_navigation a:hover {
	color: white;
}
.thrColElsHdr #coments{
	background-color: #f4f4f4;
	border: 1px solid #5c6976;
	width: 50%;
	margin: 12px auto;
}
.post_comment {
	width: 60%;
	font-size: 1em;
	font-style: italic;
	margin: 15px auto;
	color: #737373;
}
.thrColElsHdr #coments h2 {
	font-size: 0.9em;
	color: #737373;
	margin: 12px 25px;
}
.thrColElsHdr #table_earnings {
	width: 90%;
	border: 1px solid #5c6976;
	background-color: white;
	margin: 12px auto;
}
.thrColElsHdr #table_earnings h1 {
	color: #b90000;
	font-size: 1.5em;
	text-align: center;
	margin: 3% 10%;
}
.thrColElsHdr #table_earnings p {
	color: #5d5d5d;
	text-align: left;
	font-size: 0.9em;
	padding: 2px 10px 0 18px;
	margin-bottom: 12px;
}
.thrColElsHdr #table_earnings h2 {
	color: blue;
	text-align: center;
	margin: 3% 20%;
	font-size: 1.2em;
	text-transform: capitalize; 
} 
.thrColElsHdr #table_earnings h3 {
	color: #006400;
	text-align: center;
	margin: 3% 24%;
	font-size: 1.1em;
	font-weight: 700;
}
.thrColElsHdr #table_earnings table {
	width: 60%;
	border: 1px solid #5c6976;
	margin: 10px auto;
}
.thrColElsHdr #table_earnings img {
	margin: 7px;
}
.thrColElsHdr #table_earnings table.bkg {
	background-color: #ffffd2;
}
.thrColElsHdr #reklama {
	background-color: white;
	width: 96%;
	border: 1px solid black;
	margin: 10px auto;
}
.thrColElsHdr #reklama h3 {
	color: #8b0000;
	font-size: 0.9em;
   text-align: center;
}
.thrColElsHdr #reklama p {
	text-align: left;
	font-size: 0.7em;
}
.thrColElsHdr #mainContent #table_index .div p{
   margin: 0 12px;
   width: 90%;
}
#banner {
	width:468px;
	height:60px;
}