* {margin:0;padding:0;outline:none; border:0;} /* обнуляем все элементы */ wrapper, header, sidebar, content, footer { display: block; /* контейнеры блочного типа */ } } #header{ height: 200px; margin-bottom: 10px; background-color: #F96; width: 900px; background-image: url(Images/header-bg.png); position: relative; } #headimage{ position: absolute; top:40px; right:50px; } h1{ color: #FFFFFF; /*- цвет заголовка*/ font: 40px Georgia; /* - шрифт*/ margin-left: 300px; /*- отступ слева*/ } h3{ width: 200px; /*- ширина*/ czolor: #123C00; /* - цвет*/ font-style: italic; /* - курсив*/ margin: 70px 0 0 30px; /*- расположение*/ } .center{ margin: 0 0 10px 50px; /*Внешние отступы*/ } .left{ float: left; /*Наплыв слева*/ margin: 10px 10px 10px 10px; } .right{ float: right; /*Наплыв справа*/ margin: 10px 10px 10px 10px; } #menu { margin:20px 0 0 150px; position: absolute; top:140px; right:250px; } #menu ul { list-style:none; } /* убираем маркеры */ #menu ul li { display:inline; /* выстраиваем элементы списка в один ряд */ float:left; margin-bottom:20px; /* делаем отступ чтобы пункты меню не сливались */ } /*стиль для ссылок: внутренний отступ 20 пикселей, фон цветной с прозрачностью, текст - сжатый, цветной, с тенью, жирный, без подчеркивания*/ #menu ul li a { padding:20px; background: rgba(255,138,30,0.3); text-decoration: none; font: bold 14px Helvetica, Sans-Serif; letter-spacing: -1px; color: #402e16; text-shadow: #eee 0px 0px 2px; } #menu ul li a.active { background: rgba(255,138,30,0.8) } /*стиль для выделенной ссылки, задается градиент, по разному для разных браузеров*/ #menu ul li a:hover{ text-decoration: underline; background: -webkit-gradient( linear, right bottom, left top, color-stop(0, rgb(237,227,112)), color-stop(0.72, rgb(255,173,10))); background: -moz-linear-gradient( right bottom, rgb(237,227,112) 0%, rgb(255,173,10) 72%); background-color:rgb(255,173,10); -moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; } } #menu ul li a.active { background: rgba(255,138,30,0.8) } /*стиль для выделенной ссылки, задается градиент, по разному для разных браузеров*/ #menu ul li a:hover{ text-decoration: underline; background: -webkit-gradient( linear, right bottom, left top, color-stop(0, rgb(237,227,112)), color-stop(0.72, rgb(255,173,10))); background: -moz-linear-gradient( right bottom, rgb(237,227,112) 0%, rgb(255,173,10) 72%); background-color:rgb(255,173,10); -moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; } } #sidebar{ /*height: 80px;*/ background-color: #99FF99; margin-bottom: 10px; width: 180px; padding: 10px; float: right; } #content{ /*height: 80px;*/ margin-bottom: 10px; background-color: #96F; width: 670px; padding: 10px; } .clear{ clear: both; } #footer{ height: 80px; background: #09F; margin-bottom: 10px; }