* { поле: 0px; отступ: 0px; контур: отсутствует; граница: отсутствует; оформление текста: отсутствует; стиль списка: отсутствует; размер рамки: border-box; } img { максимальная ширина: 100%; } .очистить { очистить: оба; } .оболочка { максимальная ширина: 1024 пикселей; ширина: 96%; поле: 0 авто; } .основное { ширина: 100%; плавающий: слева; /* семейство шрифтов: "Освальд", без засечек;*/ семейство шрифтов: "Открыть без засечек", без засечек; фон: URL (https://wearephoenixteam.com/ebay/free-templates/images/temp5/bg.jpg) повторяется вверху слева; } .заголовок { ширина: 100%; с плавающей точкой: слева; фон: #fff; выравнивание текста: по центру; радиус границы: 6 пикселей; граница: сплошная 1 пиксель #e7e7e7; отступ: 30 пикселей на 0; поле: 22 пикселя на 0; позиция: относительная; } . заголовок: после { содержимое: "; позиция: абсолютная; слева: 0; справа: 0; внизу: -30 пикселей; высота: 30 пикселей; фон: URL (https://wearephoenixteam.com/ebay/free-templates/images/temp5/head-shadow.png) в центре вверху без повторов; } .шаблон { ширина: 100%; с плавающей точкой: слева; } .template_left { ширина: 75%; с плавающей точкой: слева; } .white_space { отступ: 16 пикселей; фон: #fff; радиус границы: 8 пикселей; граница: сплошная 1 пиксель #e7e7e7; } .заголовок, .heading { ширина: 100%; плавающий: слева; фон: #f9962f; семейство шрифтов: "Освальд", без засечек; размер шрифта: 22 пикселя; высота строки: 28 пикселей; размер шрифта: обычный; цвет: #fff; отступ: 7 пикселей на 15 пикселей; } h2.заголовок { поле внизу: 15 пикселей; } /* галерея*/ .gallery_list { ширина: 100%; с плавающей точкой: слева; положение: относительно; выравнивание текста: по центру; поле: 35 пикселей 0; } .эскизы { стиль списка: отсутствует; размер шрифта: 0; } .миниатюры li { отображение: встроенный блок; поле: 0 10px 0 0; ширина: 90px; высота: 90px; выравнивание текста: по центру; выравнивание по вертикали: по середине; } .миниатюры li: наведите указатель мыши на объект-обнимашку { фон: белый; } .миниатюры li: наведите указатель мыши на объект-обнимашку .title { цвет: #000; } .ввод эскизов [name="выбрать"] { отображение: отсутствует; } .эскизы .элемент-обнималка { высота: 100%; положение: относительно; фон: #fff; дисплей: гибкий; направление сгибания: столбец; выравнивание-содержимое: центр; переход: все 150 мс плавного ввода-вывода; -moz-переход: все 150 мс плавного ввода-вывода; -webkit-переход: всего 150 мс для удобства ввода-вывода; граница: сплошная 1px #e4e4e4; z-индекс: 999; отступ: 4px; } . метка миниатюр { положение: абсолютное; вверху: 0; слева: 0; справа: 0; внизу: 0; курсор: указатель; } .эскизы .заголовок { отступ: 20px 0 0; размер шрифта: 18px; цвет: #555; переход: всего 150 мс линейный; } .thumbnails .thumb-изображение, .thumbnails .content2 img { выровнять по центру; максимальная высота: 100%; } .thumbnails .content2 { положение: абсолютное; верхнее: 0; слева: 0; ширина: 100%; высота: 350 пикселей; отступ: 5 пикселей; непрозрачность: 0; переход: все 150 мс линейный; дисплей: гибкий; фон: #FFF; направление сгиба: столбец; выровнять-содержимое: по центру; переполнение: скрыто; выровнять-себя: по центру; } . ввод эскизов [name="выбрать"]: отмечен + .элемент-обниматель { фон: белый; граница: сплошная 1px #f9962f; } . ввод эскизов [name="выбрать"]: проверено ~ .content2 { непрозрачность: 1; } .белый прямоугольник { высота: 400px; переполнение: скрыто; } .temp_lest { ширина: 100%; float: слева; margin-bottom: 15 пикселей; } .temp_lest li { ширина: 100%; с плавающей точкой: слева; размер шрифта: 14 пикселей; высота строки: 28 пикселей; вес шрифта: обычный; цвет: #737373; фон: URL (https://wearephoenixteam.com/ebay/free-templates/images/temp5/list-arrow.jpg) слева 10 пикселей без повтора; отступ слева: 18 пикселей; } p { размер шрифта: 14 пикселей; высота строки: 24 пикселя; вес шрифта: обычный; цвет: #737373; } .temp_left2 { фон: прозрачный; отступ: 0; верхнее поле: 20 пикселей; граница: отсутствует; } /* ВКЛАДКА CSS*/ .css_tab { ширина: 100%; с плавающей точкой: слева; положение: относительно; } .css-tab { отображение: отсутствует; } .css_tab li { отображение: встроенный блок; с плавающей точкой: слева; ширина: 100%; } .css_tab li метка { отступ: 10x8 пикселей; ширина: 16,7%; фон: #f9962f; семейство шрифтов: "Освальд", без засечек; выравнивание текста по центру; размер шрифта: 16 пикселей; вес шрифта: 400; Цвет:#FFF; позиция: абсолютная; слева: 0; сверху: 0 пикселей; с плавающей точкой: слева; курсор: указатель; радиус границы: 8 пикселей 8 пикселей 0 0; } .css_tab li: n-я дочерняя (1) метка { слева: 15 пикселей; } .css_tab li: n-я дочерняя (2) метка { слева: 19,2%; } .css_tab li: n-я дочерняя (3) метка { слева: 36,4%; } .css_tab li: n-я дочерняя (4) метка { слева: 53,6%; } .css_tab li: n-я дочерняя (5) метка { слева: 70.8%; } .css-tab: отмечен + .tab-label { фон: #b75d00; } .ярлык вкладки:наведите курсор { фон: #b75d00; } #tab1: проверено ~ #tab-content1, #tab2: проверено ~ #tab-content2, #tab3: проверено ~ #tab-content3, #tab4: проверено ~ #tab-content4, #tab5: проверено ~ #tab-content5 { дисплей: блок; } .вкладка-содержимое { ширина: 100%; с плавающей точкой: слева; верхнее поле: 44px; отступ: 15px 20px; граница: сплошная 1px #e7e7e7; фон: #fff; отображение: отсутствует; выравнивание текста: по левому краю; минимальная высота: 150 пикселей; радиус границы: 8 пикселей; } .вкладка-содержимое p { размер шрифта: 14 пикселей; высота строки: 24 пикселя; вес шрифта: обычный; цвет: #737373; } .вкладка-content .temp_lest { поле: 15 пикселей 0; } .template_right { ширина: 23%; с плавающей точкой: справа; радиус границы: 8 пикселей; } .ftr_box { ширина: 100%; с плавающей точкой: слева; выравнивание текста: по центру; фон: #fff; граница: сплошная 1px #e7e7e7; радиус границы: 8 пикселей; отступ: 12 пикселей; нижнее поле: 20 пикселей; положение: относительно; } .ftr_box: после { содержимое: URL('https://wearephoenixteam.com/ebay/free-templates/images/temp5/box-shadow.png'); положение: абсолютное; слева: -21px; внизу: -26px; } .contact_box { ширина: 100%; плавающий элемент: слева; фон: #fff; радиус границы: 10px; выравнивание по тексту: по центру; положение: относительное; } .contact_box: после { содержимое: url('https://wearephoenixteam.com/ebay/free-templates/images/temp5/box-shadow.png'); положение: абсолютное; слева: - 21px; внизу: -26px; } .contact_box h2 { поле-внизу: 0; радиус границы: 10 пикселей, 10 пикселей, 0 пикселей, 0 пикселей; } .contant_det { ширина: 100%; с плавающей точкой: слева; граница: сплошная 1px #e7e7e7; верхняя граница: отсутствует; отступ: 10px; } .contant_det p { размер шрифта: 13px; высота строки: 20 пикселей; вес шрифта: обычный; цвет: #777; стиль шрифта: курсив; } .contant_det p b { отображение: блок; вес шрифта: жирный; } .обратная связь { ширина: 100%; с плавающей точкой: слева; фон: #fff; граница: сплошная 1px #e7e7e7; отступ: 25px; верхнее поле: 20px; радиус границы: 8 пикселей; } .изображение обратной связи { с плавающей точкой: слева; правое поле: 30 пикселей; } .обратная связь p { стиль шрифта: курсив; } .нижний колонтитул { ширина: 100%; с плавающей точкой: слева; выравнивание текста: по центру; отступ: 30 пикселей на 0; } .нижний колонтитул p { стиль шрифта: курсив; } @media (максимальная ширина: 980 пикселей) { .заголовок { поле: 10 пикселей 0; } .template_left { ширина: 100%; поле внизу: 20 пикселей; } .template_right { ширина: 100%; } .ftr_box { нижнее поле: 10 пикселей; } } @media (максимальная ширина: 800 пикселей) { .css_tab li label { поле слева: 0!важно; отступ: 10x15 пикселей; ширина: 100% !важно; положение: статичное; фон: URL #f9962f (https://wearephoenixteam.com/ebay/free-templates/images/temp5/plus.png) по правому центру без повтора; выравнивание текста: по левому краю; граница: отсутствует; } .css_tab li { нижнее поле: 1 пиксель; } .вкладка-содержимое { верхнее поле: 0 пикселей; минимальная высота: 0; } .css_tab-метка: наведите курсор { фон: URL #b75d00(https://wearephoenixteam.com/ebay/free-templates/images/temp5/plus.png) по правому центру без повтора; граница: отсутствует; } .css-tab: отмечен + .tab-label { нижняя граница: сплошная 1 пиксель #ddd; фон: URL-адрес #b75d00(https://wearephoenixteam.com/ebay/free-templates/images/temp5/minus.png) по правому центру без повторов; } .вкладка-содержимое, метка .css_tab li { радиус границы: 0; } } @медиа (максимальная ширина: 600 пикселей) { .эскизы .содержание2, .белый прямоугольник { высота: 340 пикселей; } .gallery_list { поле: 10 пикселей 0; } .заголовок { отступ: 15 пикселей на 0; } .обратная связь { выравнивание текста по центру; } .изображение обратной связи { с плавающей точкой: отсутствует; } } @media (максимальная ширина: 480 пикселей) { .миниатюры li { ширина: 80 пикселей; высота: 80 пикселей; } .миниатюры .содержание2, .белый ящик { высота: 300 пикселей; } }Примечания к публикации