@import url(reset.css);
body {
    font-family: Tahoma, sans-serif; background: #eee;/*АБ добавил фоновый цвет, чтобы лучше смотрелся дизайн вкроплений серого цвета.
                                                        При этом для блока обертки над таблицей content-under надо задать фоновый цвет белый,
                                                        чтобы заданный сейчас серый цвет для body не просвечивал в таблице*/    
}

a {color: #1c56a0;}

a:hover {text-decoration: none;}

.wrapper {
    min-width: 970px;
    max-width: 1280px;
    margin: 0 auto;
    
}

/*Начало блока хедера*/

.header-main {
    background: url(../images/imgrubbertotable/headerRubberBg.jpg) left top repeat-x;    
}

header {
    /*height: 181px;*/
    background: url(../images/imgrubbertotable/headerTunelBg.png) left top no-repeat;
    position: relative;
    overflow: hidden;/*Т.к. блок меню имеет float: right, но это если мы убираем высоту блоку !!!*/
}

.ico {
    position: absolute;
    left: 0;
    top: 0;
    margin: 32px 0 0 20px;/*То есть он задал смещение иконок не засчет top и left, а засчет margin !!!*/    
}

.ico li {
    margin-bottom: 20px;/*Делаем нижний, т.к. верхний у нас уже есть!*/
}

.header-form {
    background: #eee; overflow: hidden;
    padding: 10px 0 10px 30px;
    width: 290px;
    position: absolute;
    right: 0;
    top: 0;
    border-bottom-left-radius: 15px;/*border-radius:0 0 0 15px; - можно и так записать*/    
}

.header-form input {
    float: left;
}

.header-form input.search-form {
    background: #fff;
    border: 1px solid #a5acb2;
    height: 18px;
    margin-right: 11px;    
}

nav ul {
    float: right;/*НП*/
    margin: 90px 0 67px 0;/*Без нижнего поля часть блока под меню не показывается при убирании height у блока header*/
    border-bottom: 3px solid #93b0c8;
    padding: 0 86px 3px 0;
}

nav ul li {
    float: left;
    padding: 0 9px;
    border-left: 1px solid #ebf0f5;
    /*line-height: 1; это правило АБ добавил, чтобы border-left не вылизал наверх слишком высоко, но у меня это уже сделано в табл. reset.css*/
}

nav ul li:first-child {
    border: none;
    padding-left: 2px;
}

nav ul li a {
    font: bold 15px "Trebuchet MS", sans-serif;
    text-decoration: none;
    text-transform: uppercase;
    color: #ebf0f5;
}

nav ul li a:hover {
    text-decoration: underline;
}

/*Конец блока хедера*/

.returnBut {
    position: fixed;
    width: 25px;
    height: 200px;
    left: 0;
    top: 250px;
    z-index: 10;
}

/*Начало блока контента*/

/*Блок левый с контентом*/

.content-under {
    background: #fff url(../images/imgrubbertotable/contentBgRepeatX.png) left top repeat-x;/*Повтор полоска слева для растягивания фона в общ блоке контента */
}

.content-main {
    height: 597px;
    width: 100%;/*Резина для таблицы, в которой лежит контент*/
    background: url(../images/imgrubbertotable/contentBg.png) right top no-repeat;
    
}

.content  {
    vertical-align: top;/*Это для ячеек таблицы важно, т.к. по умолчанию стоит center*/
    font-size: 12px;
    color: #313131;
    padding: 0 30px 30px 30px;
        
}

.logo {
    text-align: right;
    padding: 10px 0 0 0;
}

.content h1 {
    font: 24px "Trebuchet MS", sans-serif;
    color: #1c56a0;
    margin-bottom: 10px;    
}

.content p {
    font-size: 12px;
    color: #313131;
    margin-bottom: 20px;
    text-align: justify;    
}

.print {
    font: 10px "Trebuchet MS", sans-serif;
    text-align: right !important;/*Чтобы <p> принудительно расположить справа*/
}

.print a {
    color: #1c56a0;
}

.print a:hover {
    text-decoration: none;
}

.print img {
    position: relative; top: 8px;/*НП*/
    margin-left: 5px;
}

/*Далее правый сайт бар*/

.right-bar {
    vertical-align: top;/*Это для ячеек таблицы важно, т.к. по умолчанию стоит center*/
    width: 490px;
    padding: 20px 30px 0 0;
    /*position: relative;*/
            
}

.right-header {
    background: url(../images/imgrubbertotable/rightHeaderBg.png) left top no-repeat;
    margin: -69px 0 20px 0;                                             /*НП*/
    z-index: 100; position: relative;
    padding: 20px 0 10px 20px;
    font: 18px "Trebuchet MS", sans-serif;
    color: #1c56a0;
    text-decoration: underline;
}

.product-main {
    overflow: hidden;/*Т.к. у нас внутри задан float для картинки*/
    margin: 0 30px 20px 0;    
}

.product-main img {
    float: left;/*Для обтекания картинки справа последующ элементами*/
    margin: 0 10px;
}

.product-main h2 {
    font-size: 11px;
    font-weight: bold;
    color: #1c56a0;    
}

.product-main h2 a {
    color: #1c56a0;    
}

.product-main h2 a:hover {
    text-decoration: none;    
}

.product-main p {
    font-size: 10px;
    color: #313131;
    margin: 0 0 0 191px;/*Чтобы текст в <p> не заползал под картинку*/
    line-height: 1.1;
}

.all-products {
    text-align: right;
    border-top: 1px solid #c9d7e8;
    margin: 0 30px 0 10px;
}

.all-products img {
    margin-right: 3px;
}

.all-products a {
    font-size: 10px;
    font-weight: bold;
    color: #1c56a0;    
}

.all-products a:hover {
    text-decoration: none;
}

.right-bot {
    vertical-align: bottom;
    background: url(../images/imgrubbertotable/rightBarBg.png) right bottom no-repeat;
    position: relative;
    padding: 0 30px 235px 0;
}

.contact {
    text-align: right;/*Содержимое блока прижато вправо, т.к. у нас внутри блока текст и картинка, которая inline-block элемент*/
    margin-right: 30px;
}

.contact h3 {
    font: bold 12px "Trebuchet MS", sans-serif;
    color: #1c56a0;
    margin: 27px 0 10px 0;    
}

.contact p {
    font-size: 11px;
    color: #3d3d3d;
    line-height: 12px;
    margin-top: 19px;
}

.contact p span {
    font-size: 12px;
    font-weight: bold;
    color: #1c56a0;
    line-height: 16px;
}

.contact p a {
    color: #1c56a0;
}

.contact p a:hover {
    text-decoration: none;
}

.toper {
    display: block;
    width: 22px;
    height: 22px;
    background-image: url(../images/imgrubbertotable/return-up.png);
    background-repeat: no-repeat;
    position: absolute; right: 39px; bottom: 0;
}

footer {
    background: #eee; overflow: hidden;    
}

.atstar {
    float: left; margin: 34px 0 0 46px; 
}

.copy {
    float: left; font-size: 11px; color: #6d6e71; text-align: right; line-height: 12px; margin: 40px 0 0 21%;
}

.copy a {
    color: #1c56a0;    
}

.copy a:hover {
    text-decoration: none;
}

.ftr-link {
    float: right; margin: 10px 95px 9px 0;
}

.ftr-link img {
    margin: 10px 0 0 13px;
}
