BASICS
Why typography matters?
langhtml <="ru">
>title<[[*название страницы]]
charsetmeta <="utf-8">
http-equivmeta <="X-UA-Compatible" content="IE=edge,chrome=1">
namemeta <="viewport" content="width=device-width,initial-scale=1">
typestyle <="text/css">
тело {
margin: 0
}
Статья,
в сторону,
Подробные сведения,
подпись к изображению,
рисунок,
нижний колонтитул,
заголовок,
hgroup,
Главная,
навигация,
Раздел,
краткое содержание {
:отображения
}
Аудио,
холст,
прогресс,
видео {
:display inline-block;
:по-вертикали по базовой линии
}
not:audio([controls]) {
:display none;
высота: 0
}
[скрыто],
шаблон {
:дисплей отсутствует
}
a {
:фон прозрачный
}
a:active,
наведите:на {
контур: 0
}
abbr[title] {
1px :border-bottom пунктир
}
b,
сильный {
:начертание полужирный
}
dfn {
:курсив
}
h1 {
2em :размер шрифта;
margin: 0,67em 0
}
отметка {
#ff0 :фон;
color: #000
}
маленький {
font-size: 80%
}
SUB,
суп {
75% :размер шрифта;
0: line-height;
:position относительно;
:по-вертикали по базовой линии
}
суп {
top: -0,5em
}
подлодка {
bottom: -0,25em
}
изображение {
граница: 0
}
not:svg(:root) {
: скрытопереполнение
}
рисунок {
margin: 1em 40px
}
hr {
box-sizing: content-box;
height: 0
}
pre {
overflow: auto
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0
}
button {
overflow: visible
}
button,
select {
text-transform: none
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer
}
button[disabled],
html input[disabled] {
cursor: default
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0
}
ввод {
:line-height normal
}
input[type="checkbox"],
input[type="radio"] {
:box-sizing border-box;
padding: 0
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
:высота
}
input[type="поиск"] {
:-webkit-appearance текстовое поле;
:box-sizing content-box
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
:-webkit-appearance none
}
набор полей {
1px :border solid #c0c0c0;
2px 0 :margin;
padding: 0,35em 0,625em 0,75em
}
легенда {
0: border;
padding: 0
}
текстовое поле {
:переполнение
}
optgroup {
:начертание полужирный
}
таблица {
:border-collapse свернуть;
border-spacing: 0
}
тд,
й {
padding: 0
}
* {
:box-sizing border-box
}
*:до,
после:* {
:box-sizing border-box
}
фокус:* {
:контур none !important
}
html {
10px :размер шрифта;
:-webkit-tap-highlight-color прозрачный
}
ввод,
кнопка,
выбрать,
a {
#ed5c15 :цвет;
:text-decoration подчеркивание;
:переход все, 0,15с
}
a:при наведении,
фокус:a {
#a9400d :цвет;
:text-decoration none
}
фокус:a {
:контур тонкий пунктир;
5px :контур auto -webkit-focus-ring-color;
outline-offset: -2px
}
a.back {
10px :padding-left;
1px :border-left solid #b5b5b5;
line-height: 38px
}
рисунок {
margin: 0
}
изображение {
:по центру
}
.img-responsive {
:отобразить блок;
100% :width \9;
100% :max-width;
:высота
}
.img-rounded {
border-radius: 6px
}
.img-circle {
border-radius: 50%
}
отдел кадров {
30px :margin-top;
30px :margin-bottom;
0: border;
1px :border-top пунктир #b5b5b5
}
hr.хорошо {
2px :height;
#f0f0f0 :цвет фона;
4px :border-radius;
:border none;
1px :border-top solid #e3e3e3
}
h1 small,
h1 .small,
h2 small,
h2 .small,
h3 small,
h3 .small,
h4 small,
h4 .small,
h5 small,
h5 .small,
h6 small,
h6 .small,
.h1 small,
.h1 .small,
.h2 small,
.h2 .small,
.h3 small,
.h3 .small,
.h4 small,
.h4 .small,
.h5 small,
.h5 .small,
.h6 small,
.h6 .small {
:нагрузка на шрифт нормальная;
1: line-height;
#888 :цвет;
:отобразить блок;
margin-top: 5px
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
.h1 a,
.h2 a,
.h3 a,
.h4 a,
.h5 a,
.h6 a {
color: #ed5c15
}
h1,
.h1 {
наклон шрифта: 700
}
h1 small,
h1 .small,
.h1 small,
.h1 .small,
h2 small,
h2 .small,
.h2 small,
.h2 .small,
h3 small,
h3 .small,
.h3 small,
.h3 .small {
font-size: 65%
}
h4,
.h4,
h5,
.h5,
h6,
.h6 {
наклон шрифта: 500
}
h4 small,
h4 .small,
.h4 small,
.h4 .small,
h5 small,
h5 .small,
.h5 small,
.h5 .small,
h6 small,
h6 .small,
.h6 small,
.h6 .small {
font-size: 75%
}
h1,
.h1 {
font-size: 26px
}
h2,
.h2 {
font-size: 22px
}
h3,
.h3 {
font-size: 18px
}
h4,
.h4 {
font-size: 16px
}
h5,
.h5 {
font-size: 14px
}
h6,
.h6 {
font-size: 12px
}
.заголовок страницы {
24px :размер шрифта;
600: нагрузка на шрифт;
margin: 0 0 5px
}
п {
margin: 0 0 10px
}
.свинец {
20px :margin-bottom;
16px :размер шрифта;
300: нагрузка на шрифт;
line-height: 1.4
}
@media (min-width: 768px) {
.свинец {
font-size: 21px
}
}
.новрап {
:white-space nowrap
}
маленький,
.маленький {
размер шрифта: 85%
}
.курсив {
:курсив
}
цитировать {
:шрифт обычный
}
отметка,
.марк {
#fcf8e3 :цвет фона;
padding: .2em
}
.text-left {
:text-align left
}
.text-right {
:text-align вправо
}
.text-center {
:text-align по центру
}
.text-justify {
:text-align по центру
}
.text-nowrap {
:white-space nowrap
}
.text-lowercase {
:text-transform строчные буквы
}
.text-uppercase {
:text-transform заглавными буквами
}
.text-capitalize {
:text-transform заглавная буква
}
.text-muted {
color: #888
}
.text-red {
color: #ed5c15
}
a.text-red:при наведении {
color: #c0490f
}
.text-white {
color: #fff
}
a.text-white:при наведении {
color: #e6e6e6
}
.text-black {
color: #000
}
a.text-black:при наведении {
color: #000
}
.bg-gray {
color: #fff
}
.bg-gray {
background-color: #b5b5b5
}
a.bg-gray:hover {
background-color: #9c9c9c
}
.выделено жирным шрифтом {
800: нагрузка на шрифт;
:шрифт обычный
}
.fz13 {
font-size: 13px
}
.fz15 {
font-size: 15px
}
.fz16 {
font-size: 16px
}
.page-header {
9px :padding-bottom;
20px 040 px :margin;
1px :border-bottom solid #eee
}
ул,
старина {
0: margin-top;
margin-bottom: 10px
}
ul ul,
ul ol,
ol ul,
ol ol {
margin-bottom: 0
}
.list-unstyled,
.list-inline,
.list-list,
.list-ok {
0: padding-left;
:list-style none
}
.list-inline {
margin-left: -5px
}
.list-inline>li {
:display inline-block;
5px :padding-left;
padding-right: 5px
}
.list-list>li {
:position относительно;
20px :padding-left;
margin-bottom: 5px
}
.list-list>li:last-child {
margin-bottom: 0
}
.list-list>li:before {
'—': content;
:отобразить блок;
:position абсолютное позиционирование;
0: top;
слева: 0
}
.list-ok>li {
:position относительно;
20px :padding-left;
5px :margin-bottom;
:отображения
}
.list-ok>li:last-child {
margin-bottom: 0
}
.list-ok>li:before {
'': content;
:отобразить блок;
:position абсолютное позиционирование;
6px :top;
0: влево;
9px :width;
7px :высота;
url: background-image("../img/sprite.png");
:background-repeat без повтора;
background-position: -196px 0
}
.list-orange {
:position относительно;
35px :padding-left;
8px :margin-bottom;
:отобразить блок;
наклон шрифта: 900
}
.list-orange:before {
'': content;
:отобразить блок;
:position абсолютное позиционирование;
7px :вверх;
0: влево;
24px :width;
6px :высота;
url: background-image("../img/sprite.png");
:background-repeat без повтора;
background-position: -169px -50px
}
дл {
0: margin-top;
margin-bottom: 20px
}
dt,
dd {
line-height: 1,42857
}
dt {
:начертание полужирный
}
dd {
margin-left: 0
}
.dl-horizontal dd:before,
.dl-horizontal dd:after {
" ": content;
:отобразить таблицу
}
.dl-horizontal dd:after {
:очистить оба
}
@media (min-width: 768px) {
.dl-horizontal dt {
:float слева;
160px :width;
:clear слева;
:text-align right;
:overflow скрыто;
:text-overflow многоточие;
:white-space nowrap
}
.dl-horizontal dd {
margin-left: 180px
}
}
abbr[title],
abbr[data-original-title] {
:курсор справка;
1px :border-bottom пунктир #b5b5b5
}
.инициализм {
90% :размер шрифта;
:text-transform заглавными буквами
}
цитата из блока {
20px 10px :padding;
20px 0 0 :margin;
17,5px :размер шрифта;
5px :border-left solid #eee
}
blockquote p:last-child,
blockquote ul:last-child,
последний ребенок :olblockquote {
margin-bottom: 0
}
цитата подвал,
цитата маленький,
blockquote .small {
:отобразить блок;
80% :размер шрифта;
1.42857: высота строки;
color: #b5b5b5
}
blockquote footer:before,
blockquote small:before,
blockquote .small:before {
content: '\2014 \00A0'
}
.blockquote-reverse,
blockquote.pull-right {
15px :padding-right;
0: padding-left;
5px :border-right solid #eee;
0: border-left;
:text-align вправо
}
.blockquote-reverse footer:before,
.blockquote-reverse small:before,
.blockquote-reverse .small:before,
blockquote.pull-right footer:before,
blockquote.pull-right small:before,
blockquote.pull-right .small:before {
content: ''
}
.blockquote-reverse подвал:после,
.blockquote-reverse small:after,
.blockquote-reverse .small:after,
blockquote.pull-right footer:after,
blockquote.pull-right small:after,
blockquote.pull-right .small:after {
content: '\00A0 \2014'
}
цитата:до,
после:цитата {
content: ""
}
адрес {
20px :margin-bottom;
:шрифт обычный;
line-height: 1,42857
}
.контейнер {
:margin-right auto;
:margin-left auto;
10px :padding-left;
padding-right: 10px
}
.container:before,
.container:after {
" ": content;
:отобразить таблицу
}
.container:after {
:очистить оба
}
@media (min-width: 768px) {
.контейнер {
width: 740px
}
}
@media (min-width: 992px) {
.контейнер {
width: 970px
}
}
@media (min-width: 1000px) {
.контейнер {
width: 970px
}
}
.container-fluid {
:margin-right auto;
:margin-left auto;
10px :padding-left;
padding-right: 10px
}
.container-fluid:before,
.container-fluid:after {
" ": content;
:отобразить таблицу
}
.container-fluid:after {
:очистить оба
}
.container-fluid.inset {
#f4f4f4 :цвет фона;
20px :padding-top;
20px :padding-bottom;
:box-shadow inset 0 2px 10px -4px rgba(0, 0, 0, 0.6)
}
.ряд {
-10px :margin-left;
margin-right: -10px
}
.row:before,
.row:after {
" ": content;
:отобразить таблицу
}
.row:after {
:очистить оба
}
.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
:position относительно;
1px :min-height;
10px :padding-left;
padding-right: 10px
}
.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
:плавающий влево
}
.col-xs-1 {
width: 8,33333%
}
.col-xs-2 {
width: 16,66667%
}
.col-xs-3 {
width: 25%
}
.col-xs-4 {
width: 33.33333%
}
.col-xs-5 {
width: 41,66667%
}
.col-xs-6 {
width: 50%
}
.col-xs-7 {
width: 58,33333%
}
.col-xs-8 {
width: 66,66667%
}
.col-xs-9 {
width: 75%
}
.col-xs-10 {
width: 83,33333%
}
.col-xs-11 {
width: 91,66667%
}
.col-xs-12 {
width: 100%
}
.col-xs-pull-0 {
:правый авто
}
.col-xs-pull-1 {
справа: 8,33333%
}
.col-xs-pull-2 {
справа: 16,66667%
}
.col-xs-pull-3 {
справа: 25%
}
.col-xs-pull-4 {
справа: 33,33333%
}
.col-xs-pull-5 {
справа: 41,66667%
}
.col-xs-pull-6 {
справа: 50%
}
.col-xs-pull-7 {
справа: 58,33333%
}
.col-xs-pull-8 {
справа: 66,66667%
}
.col-xs-pull-9 {
справа: 75%
}
.col-xs-pull-10 {
справа: 83,33333%
}
.col-xs-pull-11 {
справа: 91,66667%
}
.col-xs-pull-12 {
справа: 100%
}
.col-xs-push-0 {
:левый авто
}
.col-xs-push-1 {
слева: 8,33333%
}
.col-xs-push-2 {
слева: 16,66667%
}
.col-xs-push-3 {
слева: 25%
}
.col-xs-push-4 {
слева: 33,33333%
}
.col-xs-push-5 {
слева: 41,66667%
}
.col-xs-push-6 {
слева: 50%
}
.col-xs-push-7 {
слева: 58,33333%
}
.col-xs-push-8 {
слева: 66,66667%
}
.col-xs-push-9 {
слева: 75%
}
.col-xs-push-10 {
слева: 83,33333%
}
.col-xs-push-11 {
слева: 91,66667%
}
.col-xs-push-12 {
слева: 100%
}
.col-xs-offset-0 {
margin-left: 0%
}
.col-xs-offset-1 {
margin-left: 8,33333%
}
.col-xs-offset-2 {
margin-left: 16,66667%
}
.col-xs-offset-3 {
margin-left: 25%
}
.col-xs-offset-4 {
margin-left: 33,33333%
}
.col-xs-offset-5 {
margin-left: 41,66667%
}
.col-xs-offset-6 {
margin-left: 50%
}
.col-xs-offset-7 {
margin-left: 58,33333%
}
.col-xs-offset-8 {
margin-left: 66,66667%
}
.col-xs-offset-9 {
margin-left: 75%
}
.col-xs-offset-10 {
margin-left: 83,33333%
}
.col-xs-offset-11 {
margin-left: 91,66667%
}
.col-xs-offset-12 {
margin-left: 100%
}
@media (min-width: 768px) {
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12 {
:поплавок влево
}
.col-sm-1 {
width: 8,33333%
}
.col-sm-2 {
width: 16,66667%
}
.col-sm-3 {
width: 25%
}
.col-sm-4 {
width: 33.33333%
}
.col-sm-5 {
width: 41,66667%
}
.col-sm-6 {
width: 50%
}
.col-sm-7 {
width: 58,33333%
}
.col-sm-8 {
width: 66,66667%
}
.col-sm-9 {
width: 75%
}
.col-sm-10 {
width: 83,33333%
}
.col-sm-11 {
width: 91,66667%
}
.col-sm-12 {
width: 100%
}
.col-sm-pull-0 {
:правый авто
}
.col-sm-pull-1 {
справа: 8,33333%
}
.col-sm-pull-2 {
справа: 16,66667%
}
.col-sm-pull-3 {
справа: 25%
}
.col-sm-pull-4 {
справа: 33,33333%
}
.col-sm-pull-5 {
справа: 41,66667%
}
.col-sm-pull-6 {
справа: 50%
}
.col-sm-pull-7 {
справа: 58,33333%
}
.col-sm-pull-8 {
справа: 66,66667%
}
.col-sm-pull-9 {
справа: 75%
}
.col-sm-pull-10 {
справа: 83,33333%
}
.col-sm-pull-11 {
справа: 91,66667%
}
.col-sm-pull-12 {
справа: 100%
}
.col-sm-push-0 {
:левый авто
}
.col-sm-push-1 {
слева: 8,33333%
}
.col-sm-push-2 {
слева: 16,66667%
}
.col-sm-push-3 {
слева: 25%
}
.col-sm-push-4 {
слева: 33,33333%
}
.col-sm-push-5 {
слева: 41,66667%
}
.col-sm-push-6 {
слева: 50%
}
.col-sm-push-7 {
слева: 58,33333%
}
.col-sm-push-8 {
слева: 66,66667%
}
.col-sm-push-9 {
слева: 75%
}
.col-sm-push-10 {
слева: 83,33333%
}
.col-sm-push-11 {
слева: 91,66667%
}
.col-sm-push-12 {
слева: 100%
}
.col-sm-offset-0 {
margin-left: 0%
}
.col-sm-offset-1 {
margin-left: 8,33333%
}
.col-sm-offset-2 {
margin-left: 16,66667%
}
.col-sm-offset-3 {
margin-left: 25%
}
.col-sm-offset-4 {
margin-left: 33,33333%
}
.col-sm-offset-5 {
margin-left: 41,66667%
}
.col-sm-offset-6 {
margin-left: 50%
}
.col-sm-offset-7 {
margin-left: 58,33333%
}
.col-sm-offset-8 {
margin-left: 66,66667%
}
.col-sm-offset-9 {
margin-left: 75%
}
.col-sm-offset-10 {
margin-left: 83,33333%
}
.col-sm-offset-11 {
margin-left: 91,66667%
}
.col-sm-offset-12 {
margin-left: 100%
}
}
@media (min-width: 992px) {
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12 {
:поплавок влево
}
.col-md-1 {
width: 8,33333%
}
.col-md-2 {
width: 16,66667%
}
.col-md-3 {
width: 25%
}
.col-md-4 {
width: 33.33333%
}
.col-md-5 {
width: 41,66667%
}
.col-md-6 {
width: 50%
}
.col-md-7 {
width: 58,33333%
}
.col-md-8 {
width: 66,66667%
}
.col-md-9 {
width: 75%
}
.col-md-10 {
width: 83,33333%
}
.col-md-11 {
width: 91,66667%
}
.col-md-12 {
width: 100%
}
.col-md-pull-0 {
:правый авто
}
.col-md-pull-1 {
справа: 8,33333%
}
.col-md-pull-2 {
справа: 16,66667%
}
.col-md-pull-3 {
справа: 25%
}
.col-md-pull-4 {
справа: 33,33333%
}
.col-md-pull-5 {
справа: 41,66667%
}
.col-md-pull-6 {
справа: 50%
}
.col-md-pull-7 {
справа: 58,33333%
}
.col-md-pull-8 {
справа: 66,66667%
}
.col-md-pull-9 {
справа: 75%
}
.col-md-pull-10 {
справа: 83,33333%
}
.col-md-pull-11 {
справа: 91,66667%
}
.col-md-pull-12 {
справа: 100%
}
.col-md-push-0 {
:левый авто
}
.col-md-push-1 {
слева: 8,33333%
}
.col-md-push-2 {
слева: 16,66667%
}
.col-md-push-3 {
слева: 25%
}
.col-md-push-4 {
слева: 33,33333%
}
.col-md-push-5 {
слева: 41,66667%
}
.col-md-push-6 {
слева: 50%
}
.col-md-push-7 {
слева: 58,33333%
}
.col-md-push-8 {
слева: 66,66667%
}
.col-md-push-9 {
слева: 75%
}
.col-md-push-10 {
слева: 83,33333%
}
.col-md-push-11 {
слева: 91,66667%
}
.col-md-push-12 {
слева: 100%
}
.col-md-offset-0 {
margin-left: 0%
}
.col-md-offset-1 {
margin-left: 8,33333%
}
.col-md-offset-2 {
margin-left: 16,66667%
}
.col-md-offset-3 {
margin-left: 25%
}
.col-md-offset-4 {
margin-left: 33,33333%
}
.col-md-offset-5 {
margin-left: 41,66667%
}
.col-md-offset-6 {
margin-left: 50%
}
.col-md-offset-7 {
margin-left: 58,33333%
}
.col-md-offset-8 {
margin-left: 66,66667%
}
.col-md-offset-9 {
margin-left: 75%
}
.col-md-offset-10 {
margin-left: 83,33333%
}
.col-md-offset-11 {
margin-left: 91,66667%
}
.col-md-offset-12 {
margin-left: 100%
}
}
@media (min-width: 1000px) {
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12 {
:поплавок влево
}
.col-lg-1 {
width: 8,33333%
}
.col-lg-2 {
width: 16,66667%
}
.col-lg-3 {
width: 25%
}
.col-lg-4 {
width: 33.33333%
}
.col-lg-5 {
width: 41,66667%
}
.col-lg-6 {
width: 50%
}
.col-lg-7 {
width: 58,33333%
}
.col-lg-8 {
width: 66,66667%
}
.col-lg-9 {
width: 75%
}
.col-lg-10 {
width: 83,33333%
}
.col-lg-11 {
width: 91,66667%
}
.col-lg-12 {
width: 100%
}
.col-lg-pull-0 {
:правый авто
}
.col-lg-pull-1 {
справа: 8,33333%
}
.col-lg-pull-2 {
справа: 16,66667%
}
.col-lg-pull-3 {
справа: 25%
}
.col-lg-pull-4 {
справа: 33,33333%
}
.col-lg-pull-5 {
справа: 41,66667%
}
.col-lg-pull-6 {
справа: 50%
}
.col-lg-pull-7 {
справа: 58,33333%
}
.col-lg-pull-8 {
справа: 66,66667%
}
.col-lg-pull-9 {
справа: 75%
}
.col-lg-pull-10 {
справа: 83,33333%
}
.col-lg-pull-11 {
справа: 91,66667%
}
.col-lg-pull-12 {
справа: 100%
}
.col-lg-push-0 {
:левый авто
}
.col-lg-push-1 {
слева: 8,33333%
}
.col-lg-push-2 {
слева: 16,66667%
}
.col-lg-push-3 {
слева: 25%
}
.col-lg-push-4 {
слева: 33,33333%
}
.col-lg-push-5 {
слева: 41,66667%
}
.col-lg-push-6 {
слева: 50%
}
.col-lg-push-7 {
слева: 58,33333%
}
.col-lg-push-8 {
слева: 66,66667%
}
.col-lg-push-9 {
слева: 75%
}
.col-lg-push-10 {
слева: 83,33333%
}
.col-lg-push-11 {
слева: 91,66667%
}
.col-lg-push-12 {
слева: 100%
}
.col-lg-offset-0 {
margin-left: 0%
}
.col-lg-offset-1 {
margin-left: 8,33333%
}
.col-lg-offset-2 {
margin-left: 16,66667%
}
.col-lg-offset-3 {
margin-left: 25%
}
.col-lg-offset-4 {
margin-left: 33,33333%
}
.col-lg-offset-5 {
margin-left: 41,66667%
}
.col-lg-offset-6 {
margin-left: 50%
}
.col-lg-offset-7 {
margin-left: 58,33333%
}
.col-lg-offset-8 {
margin-left: 66,66667%
}
.col-lg-offset-9 {
margin-left: 75%
}
.col-lg-offset-10 {
margin-left: 83,33333%
}
.col-lg-offset-11 {
margin-left: 91,66667%
}
.col-lg-offset-12 {
margin-left: 100%
}
}
набор полей {
0: padding;
0: margin;
0: border;
min-width: 0
}
легенда {
:отобразить блок;
100% :width;
0: padding;
20px :margin-bottom;
21px :размер шрифта;
:line-height inherit;
#333 :цвет;
0: border;
1px :border-bottom solid #e5e5e5
}
этикетка {
:display inline-block;
100% :max-width;
5px :margin-bottom;
:начертание полужирный
}
p.label {
0: margin;
42px :высота;
line-height: 40px
}
p.label.text-left {
:text-align left
}
.text-center p.label {
:text-align по центру
}
@media (min-width: 992px) {
p.label {
:text-align вправо
}
}
input[type="поиск"] {
:box-sizing border-box
}
input[type="radio"],
input[type="checkbox"] {
00 4px : margin;
1px :margin-top \9;
:line-height normal
}
input[type="file"] {
:отображения
}
input[type="range"] {
:отобразить блок;
width: 100%
}
select[multiple],
select[размер] {
:высота
}
input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
:контур тонкий пунктир;
5px :контур auto -webkit-focus-ring-color;
outline-offset: -2px
}
вывод {
:отобразить блок;
7px :padding-top;
14px :размер шрифта;
1.42857: высота строки;
color: #888
}
.form-control {
:отобразить блок;
100% :width;
42px :высота;
20px 6px :padding;
14px :размер шрифта;
1.42857: высота строки;
#ed5c15 :цвет;
#fff :цвет фона;
:background-image none;
2px :border solid #c8c8c8;
22px :border-radius;
:text-align по центру;
:transition border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s
}
.form-control:focus {
#ed5c15 :цвет границы;
0: контур;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(237, 92, 21, 0.6)
}
.form-control::-moz-placeholder {
#b5b5b5 :цвет;
непрозрачность: 1
}
.form-control:-ms-input-placeholder {
color: #b5b5b5
}
.form-control::-webkit-input-placeholder {
color: #b5b5b5
}
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
:курсор не разрешен;
#eee :цвет фона;
непрозрачность: 1
}
.form-control.gray {
#e6e6e6 :цвет фона;
#e6e6e6 :цвет границы;
#111 :цвет;
наклон шрифта: 600
}
.form-control.gray:focus {
#888 :цвет границы;
0: контур;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(136, 136, 136, 0.6)
}
textarea.form-control {
:высота auto;
15px :padding-top;
padding-bottom: 15px
}
input[type="поиск"] {
:-webkit-appearance none
}
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="месяц"] {
42px :line-height;
1.42857: высота строки \0
}
input[type="date"].input-sm,
.form-horizontal .form-group-sm input[type="date"].form-control,
input[type="time"].input-sm,
.form-horizontal .form-group-sm input[type="time"].form-control,
input[type="datetime-local"].input-sm,
.form-horizontal .form-group-sm input[type="datetime-local"].form-control,
input[type="месяц"].input-sm,
.form-horizontal .form-group-sm input[type="month"].form-control {
line-height: 30px
}
input[type="date"].input-lg,
.form-horizontal .form-group-lg input[type="date"].form-control,
input[type="time"].input-lg,
.form-horizontal .form-group-lg input[type="time"].form-control,
input[type="datetime-local"].input-lg,
.form-horizontal .form-group-lg input[type="datetime-local"].form-control,
input[type="месяц"].input-lg,
.form-horizontal .form-group-lg input[type="month"].form-control {
line-height: 46px
}
.form-group {
margin-bottom: 15px
}
.radio,
.флажок {
:position относительно;
:отобразить блок;
10px :margin-top;
10px :margin-bottom;
line-height: 25px
}
.radio label,
.checkbox label {
20px :min-height;
30px :padding-left;
0: margin-left;
0: margin-bottom;
:нагрузка на шрифт нормальная;
:курсор указатель;
:положение относительно
}
.radio label:before,
.checkbox label:before {
"": content;
:отобразить блок;
:position абсолютное позиционирование;
20px :width;
20px :высота;
0: влево;
2px :top;
2px :border solid #c8c8c8;
#fff :цвет фона;
:переход все, 0,15с
}
.radio label:after,
.checkbox label:after {
'': content;
:отобразить блок;
:position абсолютное позиционирование;
16px :width;
16px :высота;
:переход все, 0,15с
}
.radio label p,
.checkbox label p {
line-height: 1,4em
}
.radio input[type="checkbox"],
.radio input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox input[type="radio"] {
0: непрозрачность;
z-index: 1
}
.radio input[type="checkbox"]:checked+label:after,
.radio input[type="radio"]:checked+label:after,
.checkbox input[type="checkbox"]:checked+label:after,
.checkbox input[type="radio"]:checked+label:after {
content: ''
}
.radio input[type="checkbox"]:disabled+label,
.radio input[type="radio"]:disabled+label,
.checkbox input[type="checkbox"]:disabled+label,
.checkbox input[type="radio"]:disabled+label {
#888 :цвет;
непрозрачность: 0,6
}
.radio input[type="checkbox"]:disabled+label:before,
.radio input[type="radio"]:disabled+label:before,
.checkbox input[type="checkbox"]:disabled+label:before,
.checkbox input[type="radio"]:disabled+label:before {
#c8c8c8 :цвет фона;
:курсор запрещено
}
.checkbox>label:before {
border-radius: 3px
}
.checkbox>label:after {
12px :width;
12px :высота;
4px :left;
6px :top;
border-radius: 3px
}
.checkbox input[type="checkbox"]:checked+label:after {
#ed5c15 :фон;
:размер фона содержит
}
.checkbox.col {
:width auto;
:display встроенный блок
}
.checkbox.col input {
:дисплей отсутствует
}
.checkbox.col>label {
45px :высота;
:width auto;
min-width: 25px
}
.checkbox.col>label:before,
.checkbox.col>label:after {
50% :слева;
translateX: -webkit-transform(-50%);
translateX: -ms-transform(-50%);
translateX: transform(-50%)
}
.checkbox.col>label>span {
:отобразить блок;
:position абсолютное позиционирование;
:text-align по центру;
0: bottom;
50% :слева;
translateX: -webkit-transform(-50%);
translateX: -ms-transform(-50%);
translateX: transform(-50%)
}
.checkbox.black input[type="checkbox"]:checked+label:after {
фон: #111
}
.radio>label:before {
border-radius: 50%
}
.radio>label:after {
12px :width;
12px :высота;
4px :left;
6px :top;
border-radius: 50%
}
.radio input[type="radio"]:checked+label:before {
border-color: #c8c8c8
}
.radio input[type="radio"]:checked+label:after {
фон: #ed5c15
}
.radio.black input[type="radio"]:checked+label:after {
фон: #111
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
:position абсолютное позиционирование;
4px :margin-top \9
}
.radio+.radio,
.checkbox+.checkbox {
margin-top: -5px
}
.radio-inline,
.checkbox-inline {
:position относительно;
:display inline-block;
0: margin-bottom;
0: margin-top;
:vertical-align middle;
:нагрузка на шрифт нормальная;
:курсора
}
.radio-inline+.radio-inline,
.checkbox-inline+.checkbox-inline {
margin-top: 0;
margin-left: 10px
}
.form-select {
:положение относительно
}
.form-select>select {
:text-overflow многоточие;
100% :width;
#fff :цвет фона;
:background-image none;
:-webkit-appearance none;
:-moz-appearance none;
:appearance none;
padding-right: 35px
}
.form-select:after {
:отобразить блок;
'': content;
0: ширина;
0: высота;
:border-style solid;
5px 05 px7 px :border-width;
#c8c8c8 :border-color прозрачный прозрачный прозрачный;
:background none;
:position абсолютное позиционирование;
50% :top;
-4px :margin-top;
13px :вправо;
:pointer-events none
}
.form-select>select::-ms-expand {
:дисплей отсутствует
}
.form-select.gray>select {
#e6e6e6 :цвет фона;
#e6e6e6 :цвет границы;
#111 :цвет;
font-weight: 600
}
.form-select.gray>select:focus {
border-color: #888;
outline: 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(136, 136, 136, 0.6)
}
.form-select.gray:after {
border-color: #888 transparent transparent transparent
}
.form-select.shadow {
rgba-2 px 6px 2px 0: box-shadow(0, 0, 0, 0.35);
border-radius: 22px
}
.form-select.shadow>select {
:border none;
color: #111
}
.form-select.shadow:after {
16px :width;
7px :высота;
:border none;
url: background-image("../img/sprite.png");
:background-repeat без повтора;
-124px -198px :background-position;
margin-top: -2px
}
input[type="radio"][disabled],
input[type="radio"].disabled,
fieldset[disabled] input[type="radio"],
input[type="checkbox"][disabled],
input[type="checkbox"].disabled,
fieldset[disabled] input[type="checkbox"] {
:курсор запрещено
}
.radio-inline.disabled,
fieldset[disabled] .radio-inline,
.checkbox-inline.disabled,
fieldset[disabled] .checkbox-inline {
:курсор запрещено
}
.radio.disabled label,
fieldset[disabled] .radio label,
.checkbox.disabled label,
fieldset[disabled] .checkbox label {
cursor: not-allowed
}
.form-control-static {
padding-top: 7px;
padding-bottom: 7px;
margin-bottom: 0
}
.form-control-static.input-lg,
.form-horizontal .form-group-lg .form-control-static.form-control,
.form-control-static.input-sm,
.form-horizontal .form-group-sm .form-control-static.form-control {
padding-left: 0;
padding-right: 0
}
.input-sm,
.form-horizontal .form-group-sm .form-control {
height: 30px;
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px
}
select.input-sm,
.form-horizontal .form-group-sm select.form-control {
height: 30px;
line-height: 30px
}
textarea.input-sm,
.form-horizontal .form-group-sm textarea.form-control,
select[multiple].input-sm,
.form-horizontal .form-group-sm select[multiple].form-control {
height: auto
}
.input-lg,
.form-horizontal .form-group-lg .form-control {
height: 46px;
padding: 10px 16px;
font-size: 18px;
line-height: 1.33;
border-radius: 6px
}
select.input-lg,
.form-horizontal .form-group-lg select.form-control {
height: 46px;
line-height: 46px
}
textarea.input-lg,
.form-horizontal .form-group-lg textarea.form-control,
select[multiple].input-lg,
.form-horizontal .form-group-lg select[multiple].form-control {
height: auto
}
.has-feedback {
position: relative
}
.has-feedback .form-control {
padding-right: 52.5px
}
.form-control-feedback {
position: absolute;
top: 25px;
right: 0;
z-index: 2;
display: block;
width: 42px;
42px :высота;
42px :line-height;
:text-align по центру
}
.input-lg+.form-control-feedback,
.form-horizontal .form-group-lg .form-control+.form-control-feedback {
46px :width;
46px :высота;
line-height: 46px
}
.input-sm+.form-control-feedback,
.form-horizontal .form-group-sm .form-control+.form-control-feedback {
30px :width;
30px :высота;
line-height: 30px
}
.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline {
color: #3c763d
}
.has-success .form-control {
#3c763d :цвет границы;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075)
}
.has-success .form-control:focus {
#2b542c :цвет границы;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168
}
.has-success .input-group-addon {
#3c763d :цвет;
#3c763d :цвет границы;
background-color: #dff0d8
}
.has-success .form-control-feedback {
color: #3c763d
}
.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline {
color: #8a6d3b
}
.has-warning .form-control {
#8a6d3b :цвет границы;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075)
}
.has-warning .form-control:focus {
#66512c :цвет границы;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b
}
.has-warning .input-group-addon {
#8a6d3b :цвет;
#8a6d3b :цвет границы;
background-color: #fcf8e3
}
.has-warning .form-control-feedback {
color: #8a6d3b
}
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline {
color: #a94442
}
.has-error .form-control {
#a94442 :цвет границы;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075)
}
.has-error .form-control:focus {
#843534 :цвет границы;
:box-shadow inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483
}
.has-error .input-group-addon {
color: #a94442;
border-color: #a94442;
background-color: #f2dede
}
.has-error .form-control-feedback {
color: #a94442
}
.has-feedback label.sr-only ~ .form-control-feedback {
top: 0
}
.help-block {
display: block;
margin-top: 5px;
margin-bottom: 10px;
color: #515151
}
@media (min-width: 768px) {
.form-inline .form-group {
display: inline-block;
margin-bottom: 0;
vertical-align: middle
}
.form-inline label {
font-weight: normal;
margin-right: 10px
}
.form-inline .form-control {
display: inline-block;
width: auto;
vertical-align: middle
}
.form-inline .input-group {
display: inline-table;
vertical-align: middle
}
.form-inline .input-group .input-group-addon,
.form-inline .input-group .input-group-btn,
.form-inline .input-group .form-control {
width: auto
}
.form-inline .input-group>.form-control {
width: 100%
}
.form-inline .control-label {
margin-bottom: 0;
vertical-align: middle
}
.form-inline .radio,
.form-inline .checkbox {
display: inline-block;
margin-top: 0;
margin-bottom: 0;
vertical-align: middle
}
.form-inline .radio label,
.form-inline .checkbox label {
padding-left: 0
}
.form-inline .radio input[type="radio"],
.form-inline .checkbox input[type="checkbox"] {
:position относительно;
margin-left: 0
}
.form-inline .has-feedback .form-control-feedback {
top: 0
}
}
.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
0: margin-top;
0: margin-bottom;
padding-top: 7px
}
.form-horizontal .radio,
.form-horizontal .checkbox {
min-height: 27px
}
.form-horizontal .form-group {
-10px :margin-left;
margin-right: -10px
}
.form-horizontal .form-group:before,
.form-horizontal .form-group:after {
" ": content;
:отобразить таблицу
}
.form-horizontal .form-group:after {
:очистить оба
}
@media (min-width: 768px) {
.form-horizontal .control-label {
text-align: right;
margin-bottom: 0;
padding-top: 7px
}
}
.form-horizontal .has-feedback .form-control-feedback {
top: 0;
right: 10px
}
@media (min-width: 768px) {
.form-horizontal .form-group-lg .control-label {
padding-top: 14,3px
}
}
@media (min-width: 768px) {
.form-horizontal .form-group-sm .control-label {
padding-top: 6px
}
}
.form-group.input-file input[type="file"] {
:дисплей отсутствует
}
.form-group.input-file label {
!important20 px: padding-left;
padding-right: 20px !important
}
.btn,
.form-group.input-file label {
:display inline-block;
0: margin-bottom;
:нагрузка на шрифт нормальная;
:text-align по центру;
:text-decoration none;
:vertical-align middle;
:курсор указатель;
:background-image none;
:border none;
42px :высота;
:white-space nowrap;
:переход все, 0,15с;
22px 11px :padding;
16px :размер шрифта;
1,2em :line-height;
21px :border-radius;
:-webkit-user-select none;
:-moz-user-select none;
-ms-user-select: none;
user-select: none;
font-size: 13px
}
.btn:focus,
.form-group.input-file label:focus,
.btn:active:focus,
.form-group.input-file label:active:focus,
.btn.active:focus,
.form-group.input-file label.active:focus {
:контур тонкий пунктир;
5px :контур auto -webkit-focus-ring-color;
outline-offset: -2px
}
.btn:hover,
.form-group.input-file label:hover,
.btn:focus,
.form-group.input-file label:focus {
#111 :цвет;
:text-decoration none
}
.btn:active,
.form-group.input-file label:active,
.btn.active,
.form-group.input-file label.active {
0: контур;
:background-image none;
:box-shadow inset 0 3px 5px rgba(0, 0, 0, 0.125)
}
.btn.disabled,
.form-group.input-file label.disabled,
.btn[disabled],
.form-group.input-file label[disabled],
fieldset[disabled] .btn,
fieldset[disabled] .form-group.input-file label,
.form-group.input-file fieldset[disabled] label {
:курсор не разрешен;
:pointer-events none;
0,65: непрозрачность;
alpha: filter(opacity=65);
:box-shadow none
}
@media (min-width: 768px) {
.btn,
.form-group.input-file label {
font-size: 16px
}
}
.btn-orange,
.form-group.input-file label {
background-image: linear-gradient(to bottom, #ffcf3e 0, #ed5c15 100%);
background-repeat: repeat-x;
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#FFFFCF3E', endColorstr='#FFED5C15', GradientType=0);
color: #fff;
text-shadow: 0px 1px 1px #ed5c15;
font-weight: 600;
padding-left: 40px;
padding-right: 40px
}
.btn-orange:hover,
.form-group.input-file label:hover,
.btn-orange:focus,
.form-group.input-file label:focus {
background-image: linear-gradient(to bottom, #ffc20b 0, #d85211 100%);
background-repeat: repeat-x;
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#FFFFC20B', endColorstr='#FFD85211', GradientType=0);
color: #fff
}
.btn-border {
color: #fdc13b;
background: transparent;
border: 2px solid #fdc13b
}
.btn-border:hover,
.btn-border:focus {
color: #ed5c15;
border-color: #ed5c15
}
.btn-modal {
border: none;
border-bottom: 1px dotted;
height: auto;
line-height: 1.3em;
padding: 0 0 1px;
border-radius: 0;
font-size: inherit;
box-shadow: none !important
}
.btn-modal:hover,
.btn-modal:focus {
:цвет наследуется
}
.btn-link {
#111 :цвет;
:background-color прозрачный;
:text-decoration подчеркивание;
:border none;
20px 10px :padding;
14px :размер шрифта;
800: нагрузка на шрифт;
:box-shadow none !important
}
.btn-gray {
линейный градиент: фоновое изображение(внизу, #cecece 0, #686869 100%);
:background-repeat repeat-x;
:filter progid: DXImageTransform.Microsoft.gradient(startColorstr='#FFCECECE', endColorstr='#FF686869', GradientType=0);
#fff :цвет;
#000 1px 1px 0px :text-shadow;
600: нагрузка на шрифт;
40px :padding-left;
padding-right: 40px
}
.btn-gray:hover,
.btn-gray:focus {
линейный градиент: фоновое изображение(внизу, #b4b4b4 0, #5b5b5c 100%);
:background-repeat repeat-x;
:filter progid: DXImageTransform.Microsoft.gradient(startColorstr='#FFB4B4B4', endColorstr='#FF5B5B5C', GradientType=0);
color: #fff
}
.btn-lg {
30px 18px :padding;
18px :размер шрифта;
line-height: 1.33;
border-radius: 30px;
height: auto;
font-size: 20px
}
.btn-sm {
padding: 5px 15px;
font-size: 12px;
line-height: 1.5;
border-radius: 21px;
height: auto
}
.btn-block {
display: block;
width: 100%
}
.btn-block+.btn-block {
margin-top: 5px
}
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
width: 100%
}
.btn-enter {
38px :высота;
padding: 10px 22px
}
.btn-enter:before {
'': content;
:display inline-block;
url: background-image("../img/sprite.png");
:background-repeat без повтора;
-20px -68px :background-position;
11px :width;
14px :высота;
8px :margin-right;
margin-bottom: -2px
}
.btn-cabinet {
31px :высота;
11px :размер шрифта;
:text-transform uppercase;
28px :line-height;
0: padding-top;
0: padding-bottom;
700: нагрузка на шрифт;
:шрифт обычный
}
header# .btn-cabinet {
color: #fdc13b
}
header# .btn-cabinet:hover,
header# .btn-cabinet:focus {
color: #ed5c15
}
.btn-cabinet:hover .icon.icon-cabinet,
.btn-cabinet:focus .icon.icon-cabinet {
background-position: -85px 0
}
.clearfix:before,
.clearfix:after {
content: " ";
display: table
}
.clearfix:after {
clear: both
}
.ясно {
:очистить оба;
:отображения
}
.center-block {
:отобразить блок;
:margin-left auto;
:margin-right auto
}
.pull-right {
:float right !important
}
.pull-left {
:float left !important
}
.спрятаться {
:display none !important
}
.показать {
:display блок !important
}
.invisible {
: скрытаявидимость
}
.text-hide {
0/ 0:шрифт a;
:цвет прозрачный;
:text-shadow none;
:background-color прозрачный;
граница: 0
}
.встроенный {
:display встроенный блок
}
@media (min-width: 768px) {
.pull-sm-left {
float: left !important
}
.pull-sm-right {
float: right !important
}
.pull-sm-none {
float: none !important
}
.text-sm-left {
:text-align left
}
.text-sm-right {
:text-align вправо
}
.text-sm-center {
:text-align по центру
}
}
@media (min-width: 992px) {
.pull-md-left {
:float left !important
}
.pull-md-right {
:float right !important
}
.pull-md-none {
:float none !important
}
.text-md-left {
:text-align left
}
.text-md-right {
:text-align вправо
}
.text-md-center {
:text-align по центру
}
}
@media (min-width: 1000px) {
.pull-lg-left {
:float left !important
}
.pull-lg-right {
:float right !important
}
.pull-lg-none {
float: none !important
}
.text-lg-left {
text-align: left
}
.text-lg-right {
text-align: right
}
.text-lg-center {
:text-align по центру
}
}
.скрытый {
:display none !important;
:visibility скрыто !important
}
.прификс {
:position fixed;
translate3d: -webkit-transform(0, 0, 0);
translate3d: transform(0, 0, 0)
}
.mauto {
:margin-left auto;
:margin-right auto
}
.m0 {
margin: 0 !important
}
.p0 {
padding: 0 !important
}
.m5 {
margin: 5px
}
.p5 {
padding: 5px
}
@media (min-width: 768px) {
.sm-m5 {
margin: 5px
}
.sm-p5 {
padding: 5px
}
}
@media (min-width: 992px) {
.md-m5 {
margin: 5px
}
.md-p5 {
padding: 5px
}
}
@media (min-width: 1000px) {
.lg-m5 {
margin: 5px
}
.lg-p5 {
padding: 5px
}
}
.m10 {
margin: 10px
}
.p10 {
padding: 10px
}
@media (min-width: 768px) {
.sm-m10 {
margin: 10px
}
.sm-p10 {
padding: 10px
}
}
@media (min-width: 992px) {
.md-m10 {
margin: 10px
}
.md-p10 {
padding: 10px
}
}
@media (min-width: 1000px) {
.lg-m10 {
margin: 10px
}
.lg-p10 {
padding: 10px
}
}
.m20 {
margin: 20px
}
.p20 {
padding: 20px
}
@media (min-width: 768px) {
.sm-m20 {
margin: 20px
}
.sm-p20 {
padding: 20px
}
}
@media (min-width: 992px) {
.md-m20 {
margin: 20px
}
.md-p20 {
padding: 20px
}
}
@media (min-width: 1000px) {
.lg-m20 {
margin: 20px
}
.lg-p20 {
padding: 20px
}
}
.m30 {
margin: 30px
}
.p30 {
padding: 30px
}
@media (min-width: 768px) {
.sm-m30 {
margin: 30px
}
.sm-p30 {
padding: 30px
}
}
@media (min-width: 992px) {
.md-m30 {
margin: 30px
}
.md-p30 {
padding: 30px
}
}
@media (min-width: 1000px) {
.lg-m30 {
margin: 30px
}
.lg-p30 {
padding: 30px
}
}
.mt0 {
margin-top: 0px
}
.pt0 {
padding-top: 0px
}
@media (max-width: 768px) {
.xs-mt0 {
margin-top: 0px
}
.xs-pt0 {
padding-top: 0px
}
}
@media (min-width: 768px) {
.sm-mt0 {
margin-top: 0px
}
.sm-pt0 {
padding-top: 0px
}
}
@media (min-width: 992px) {
.md-mt0 {
margin-top: 0px
}
.md-pt0 {
padding-top: 0px
}
}
@media (min-width: 1000px) {
.lg-mt0 {
margin-top: 0px
}
.lg-pt0 {
padding-top: 0px
}
}
.mt5 {
margin-top: 5px
}
.pt5 {
padding-top: 5px
}
@media (max-width: 768px) {
.xs-mt5 {
margin-top: 5px
}
.xs-pt5 {
padding-top: 5px
}
}
@media (min-width: 768px) {
.sm-mt5 {
margin-top: 5px
}
.sm-pt5 {
padding-top: 5px
}
}
@media (min-width: 992px) {
.md-mt5 {
margin-top: 5px
}
.md-pt5 {
padding-top: 5px
}
}
@media (min-width: 1000px) {
.lg-mt5 {
margin-top: 5px
}
.lg-pt5 {
padding-top: 5px
}
}
.mt10 {
margin-top: 10px
}
.pt10 {
padding-top: 10px
}
@media (max-width: 768px) {
.xs-mt10 {
margin-top: 10px
}
.xs-pt10 {
padding-top: 10px
}
}
@media (min-width: 768px) {
.sm-mt10 {
margin-top: 10px
}
.sm-pt10 {
padding-top: 10px
}
}
@media (min-width: 992px) {
.md-mt10 {
margin-top: 10px
}
.md-pt10 {
padding-top: 10px
}
}
@media (min-width: 1000px) {
.lg-mt10 {
margin-top: 10px
}
.lg-pt10 {
padding-top: 10px
}
}
.mt20 {
margin-top: 20px
}
.pt20 {
padding-top: 20px
}
@media (max-width: 768px) {
.xs-mt20 {
margin-top: 20px
}
.xs-pt20 {
padding-top: 20px
}
}
@media (min-width: 768px) {
.sm-mt20 {
margin-top: 20px
}
.sm-pt20 {
padding-top: 20px
}
}
@media (min-width: 992px) {
.md-mt20 {
margin-top: 20px
}
.md-pt20 {
padding-top: 20px
}
}
@media (min-width: 1000px) {
.lg-mt20 {
margin-top: 20px
}
.lg-pt20 {
padding-top: 20px
}
}
.mt30 {
margin-top: 30px
}
.pt30 {
padding-top: 30px
}
@media (max-width: 768px) {
.xs-mt30 {
margin-top: 30px
}
.xs-pt30 {
padding-top: 30px
}
}
@media (min-width: 768px) {
.sm-mt30 {
margin-top: 30px
}
.sm-pt30 {
padding-top: 30px
}
}
@media (min-width: 992px) {
.md-mt30 {
margin-top: 30px
}
.md-pt30 {
padding-top: 30px
}
}
@media (min-width: 1000px) {
.lg-mt30 {
margin-top: 30px
}
.lg-pt30 {
padding-top: 30px
}
}
.mb5 {
margin-bottom: 5px
}
.pb5 {
padding-bottom: 5px
}
@media (max-width: 768px) {
.xs-mb5 {
margin-bottom: 5px
}
.xs-pb5 {
padding-bottom: 5px
}
}
@media (min-width: 768px) {
.sm-mb5 {
margin-bottom: 5px
}
.sm-pb5 {
padding-bottom: 5px
}
}
@media (min-width: 992px) {
.md-mb5 {
margin-bottom: 5px
}
.md-pb5 {
padding-bottom: 5px
}
}
@media (min-width: 1000px) {
.lg-mb5 {
margin-bottom: 5px
}
.lg-pb5 {
padding-bottom: 5px
}
}
.mb10 {
margin-bottom: 10px
}
.pb10 {
padding-bottom: 10px
}
@media (max-width: 768px) {
.xs-mb10 {
margin-bottom: 10px
}
.xs-pb10 {
padding-bottom: 10px
}
}
@media (min-width: 768px) {
.sm-mb10 {
margin-bottom: 10px
}
.sm-pb10 {
padding-bottom: 10px
}
}
@media (min-width: 992px) {
.md-mb10 {
margin-bottom: 10px
}
.md-pb10 {
padding-bottom: 10px
}
}
@media (min-width: 1000px) {
.lg-mb10 {
margin-bottom: 10px
}
.lg-pb10 {
padding-bottom: 10px
}
}
.mb20 {
margin-bottom: 20px
}
.pb20 {
padding-bottom: 20px
}
@media (max-width: 768px) {
.xs-mb20 {
margin-bottom: 20px
}
.xs-pb20 {
padding-bottom: 20px
}
}
@media (min-width: 768px) {
.sm-mb20 {
margin-bottom: 20px
}
.sm-pb20 {
padding-bottom: 20px
}
}
@media (min-width: 992px) {
.md-mb20 {
margin-bottom: 20px
}
.md-pb20 {
padding-bottom: 20px
}
}
@media (min-width: 1000px) {
.lg-mb20 {
margin-bottom: 20px
}
.lg-pb20 {
padding-bottom: 20px
}
}
.mb30 {
margin-bottom: 30px
}
.pb30 {
padding-bottom: 30px
}
@media (max-width: 768px) {
.xs-mb30 {
margin-bottom: 30px
}
.xs-pb30 {
padding-bottom: 30px
}
}
@media (min-width: 768px) {
.sm-mb30 {
margin-bottom: 30px
}
.sm-pb30 {
padding-bottom: 30px
}
}
@media (min-width: 992px) {
.md-mb30 {
margin-bottom: 30px
}
.md-pb30 {
padding-bottom: 30px
}
}
@media (min-width: 1000px) {
.lg-mb30 {
margin-bottom: 30px
}
.lg-pb30 {
padding-bottom: 30px
}
}
.ml5 {
margin-left: 5px
}
.pl5 {
padding-left: 5px
}
@media (max-width: 768px) {
.xs-ml5 {
margin-left: 5px
}
.xs-pl5 {
padding-left: 5px
}
}
@media (min-width: 768px) {
.sm-ml5 {
margin-left: 5px
}
.sm-pl5 {
padding-left: 5px
}
}
@media (min-width: 992px) {
.md-ml5 {
margin-left: 5px
}
.md-pl5 {
padding-left: 5px
}
}
@media (min-width: 1000px) {
.lg-ml5 {
margin-left: 5px
}
.lg-pl5 {
padding-left: 5px
}
}
.ml10 {
margin-left: 10px
}
.pl10 {
padding-left: 10px
}
@media (max-width: 768px) {
.xs-ml10 {
margin-left: 10px
}
.xs-pl10 {
padding-left: 10px
}
}
@media (min-width: 768px) {
.sm-ml10 {
margin-left: 10px
}
.sm-pl10 {
padding-left: 10px
}
}
@media (min-width: 992px) {
.md-ml10 {
margin-left: 10px
}
.md-pl10 {
padding-left: 10px
}
}
@media (min-width: 1000px) {
.lg-ml10 {
margin-left: 10px
}
.lg-pl10 {
padding-left: 10px
}
}
.ml20 {
margin-left: 20px
}
.pl20 {
padding-left: 20px
}
@media (max-width: 768px) {
.xs-ml20 {
margin-left: 20px
}
.xs-pl20 {
padding-left: 20px
}
}
@media (min-width: 768px) {
.sm-ml20 {
margin-left: 20px
}
.sm-pl20 {
padding-left: 20px
}
}
@media (min-width: 992px) {
.md-ml20 {
margin-left: 20px
}
.md-pl20 {
padding-left: 20px
}
}
@media (min-width: 1000px) {
.lg-ml20 {
margin-left: 20px
}
.lg-pl20 {
padding-left: 20px
}
}
.ml30 {
margin-left: 30px
}
.pl30 {
padding-left: 30px
}
@media (max-width: 768px) {
.xs-ml30 {
margin-left: 30px
}
.xs-pl30 {
padding-left: 30px
}
}
@media (min-width: 768px) {
.sm-ml30 {
margin-left: 30px
}
.sm-pl30 {
padding-left: 30px
}
}
@media (min-width: 992px) {
.md-ml30 {
margin-left: 30px
}
.md-pl30 {
padding-left: 30px
}
}
@media (min-width: 1000px) {
.lg-ml30 {
margin-left: 30px
}
.lg-pl30 {
padding-left: 30px
}
}
.mr5 {
margin-right: 5px
}
.pr5 {
padding-right: 5px
}
@media (max-width: 768px) {
.xs-mr5 {
margin-right: 5px
}
.xs-pr5 {
padding-right: 5px
}
}
@media (min-width: 768px) {
.sm-mr5 {
margin-right: 5px
}
.sm-pr5 {
padding-right: 5px
}
}
@media (min-width: 992px) {
.md-mr5 {
margin-right: 5px
}
.md-pr5 {
padding-right: 5px
}
}
@media (min-width: 1000px) {
.lg-mr5 {
margin-right: 5px
}
.lg-pr5 {
padding-right: 5px
}
}
.mr10 {
margin-right: 10px
}
.pr10 {
padding-right: 10px
}
@media (max-width: 768px) {
.xs-mr10 {
margin-right: 10px
}
.xs-pr10 {
padding-right: 10px
}
}
@media (min-width: 768px) {
.sm-mr10 {
margin-right: 10px
}
.sm-pr10 {
padding-right: 10px
}
}
@media (min-width: 992px) {
.md-mr10 {
margin-right: 10px
}
.md-pr10 {
padding-right: 10px
}
}
@media (min-width: 1000px) {
.lg-mr10 {
margin-right: 10px
}
.lg-pr10 {
padding-right: 10px
}
}
.mr20 {
margin-right: 20px
}
.pr20 {
padding-right: 20px
}
@media (max-width: 768px) {
.xs-mr20 {
margin-right: 20px
}
.xs-pr20 {
padding-right: 20px
}
}
@media (min-width: 768px) {
.sm-mr20 {
margin-right: 20px
}
.sm-pr20 {
padding-right: 20px
}
}
@media (min-width: 992px) {
.md-mr20 {
margin-right: 20px
}
.md-pr20 {
padding-right: 20px
}
}
@media (min-width: 1000px) {
.lg-mr20 {
margin-right: 20px
}
.lg-pr20 {
padding-right: 20px
}
}
.mr30 {
margin-right: 30px
}
.pr30 {
padding-right: 30px
}
@media (max-width: 768px) {
.xs-mr30 {
margin-right: 30px
}
.xs-pr30 {
padding-right: 30px
}
}
@media (min-width: 768px) {
.sm-mr30 {
margin-right: 30px
}
.sm-pr30 {
padding-right: 30px
}
}
@media (min-width: 992px) {
.md-mr30 {
margin-right: 30px
}
.md-pr30 {
padding-right: 30px
}
}
@media (min-width: 1000px) {
.lg-mr30 {
margin-right: 30px
}
.lg-pr30 {
padding-right: 30px
}
}
@-ms-viewport {
:width на всю ширину экрана
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
:display none !important
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
:display none !important
}
@media (max-width: 767px) {
.visible-xs {
:display блок !important
}
table.visible-xs {
:отобразить таблицу
}
tr.visible-xs {
:display table-row !important
}
th.visible-xs,
td.visible-xs {
:display table-cell !important
}
}
@media (max-width: 767px) {
.visible-xs-block {
display: block !important
}
}
@media (max-width: 767px) {
.visible-xs-inline {
display: inline !important
}
}
@media (max-width: 767px) {
.visible-xs-inline-block {
display: inline-block !important
}
}
@media (min-width: 768px) and (max-width: 991px) {
.visible-sm {
:display блок !important
}
table.visible-sm {
:отобразить таблицу
}
tr.visible-sm {
:display table-row !important
}
th.visible-sm,
td.visible-sm {
:display table-cell !important
}
}
@media (min-width: 768px) and (max-width: 991px) {
.visible-sm-block {
:display блок !important
}
}
@media (min-width: 768px) and (max-width: 991px) {
.visible-sm-inline {
:display inline !important
}
}
@media (min-width: 768px) and (max-width: 991px) {
.visible-sm-inline-block {
:display inline-block !important
}
}
@media (min-width: 992px) and (max-width: 999px) {
.visible-md {
:display блок !important
}
table.visible-md {
display: table
}
tr.visible-md {
display: table-row !important
}
th.visible-md,
td.visible-md {
display: table-cell !important
}
}
@media (min-width: 992px) and (max-width: 999px) {
.visible-md-block {
display: block !important
}
}
@media (min-width: 992px) and (max-width: 999px) {
.visible-md-inline {
display: inline !important
}
}
@media (min-width: 992px) and (max-width: 999px) {
.visible-md-inline-block {
display: inline-block !important
}
}
@media (min-width: 1000px) {
.visible-lg {
display: block !important
}
table.visible-lg {
display: table
}
tr.visible-lg {
display: table-row !important
}
th.visible-lg,
td.visible-lg {
display: table-cell !important
}
}
@media (min-width: 1000px) {
.visible-lg-block {
display: block !important
}
}
@media (min-width: 1000px) {
.visible-lg-inline {
display: inline !important
}
}
@media (min-width: 1000px) {
.visible-lg-inline-block {
display: inline-block !important
}
}
@media (max-width: 767px) {
.hidden-xs {
:display none !important
}
}
@media (min-width: 768px) and (max-width: 991px) {
.hidden-sm {
:display none !important
}
}
@media (min-width: 992px) and (max-width: 999px) {
.hidden-md {
:display none !important
}
}
@media (min-width: 1000px) {
.hidden-lg {
:display none !important
}
}
.visible-print {
:display none !important
}
@сми печать {
.visible-print {
:display блок !important
}
table.visible-print {
:отобразить таблицу
}
tr.visible-print {
:display table-row !important
}
th.visible-print,
td.visible-print {
display: table-cell !important
}
}
.видимый-печатный-блок {
:display none !important
}
@сми печать {
.видимый-печатный-блок {
:display блок !important
}
}
.visible-print-inline {
:display none !important
}
@сми печать {
.visible-print-inline {
:display inline !important
}
}
.visible-print-inline-block {
:display none !important
}
@сми печать {
.visible-print-inline-block {
:display inline-block !important
}
}
@сми печать {
.скрытый-принт {
:display none !important
}
}
.список тегов {
040 px: margin;
}
.taglist:before, .taglist:after {
" ": content;
display: table;
}
.taglist:after {
clear: both;
}
.taglist .title {
font-size: 12px;
display: inline-block;
color: #888;
padding: 0 10px 0 0;
}
.список_тегов .тег {
13px :размер шрифта;
:display inline-block;
#eee :цвет фона;
#000 :цвет;
:text-decoration none;
10px 5px :padding;
margin: 0 5px 5px
}
.taglist .tag:hover, .taglist .tag:active, .taglist .tag:focus {
#000 :цвет фона;
color: #fff
}
namemeta <="robots" content="noindex">
typestyle <="text/css">
[[+toPDF:is=`1`:then=`*{font-family: DejaVu Sans;font-size:12px}small{font-size:8px}body {
line-height: 1;}`:else=`body {
font-family: "Open Sans", sans-serif;
font-size: 14px;
line-height: 1.32;}`]]
body{width:100%;margin:0;padding-top:10px;font-size:14px}
@media print{*{цвет:#000!важно;текст-тень:нет!важно;фон:прозрачный!важно;поле-тень:нет!важно}a,a:visited{оформлениетекста:подчеркивание}a[href]:после{содержимое:" (" attr( href) ")"}abbr[title]:after{content:" (" attr(title) ")"}.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{content: ""}pre,blockquote{граница:1пиксель сплошной #999;разрыв страницы внутри:избегать}thead{отображение:таблица-группа заголовков}tr,img{разрыв страницы внутри:избегать}img{максимальная ширина:100%!важно}@страница{поле: .5см}p,h2,h3{сироты:3;вдовы:3}h2,h3{после разрыва страницы:избегать}}
@сми печать {
.header-left-top, .a-right-bottom, .time-right-bottom, button, .margin-control {
:display none;
}
}
.ppp td{padding:5px;}
/* Пользовательский контейнер */
.контейнер {
0: margin auto;
width:100%;
}
.container-narrow > hr {
margin: 30px 0;
}
.border {
border: 1px solid #000;
}
.border-top {
border-top: 1px solid #000;
}
.pp {
width:100%;
}
classdiv <="clear clearfix">
[[+toPDF:ne=`1`:then=`
stylediv <="text-align:center;width:100%">
stylebutton <="text-align:center;margin:10px auto;font-size:20px;color:yellow;background-color:#000" onclick="window.print();return false;">Распечатать | Внимание! Оплата данного счёта означает согласие с условиями поставки товара и оказания услуг. Уведомление об оплате обязательно. Товар отпускается, а услуги оказываются только по факту прихода денег на р/с Поставщика (Исполнителя). | ||||||||||||||||||||||||||||||
| >b<Счет действителен при соблюдении следующих условий: | ||||||||||||||||||||||||||||||
| classdiv <="offset1"> — сумма платежа строго соответствует указанной в счете и составляет [[+amount]] руб.; | ||||||||||||||||||||||||||||||
| classdiv <="offset1"> — платеж произведен в течение 3 банковских дней с даты выставления счета. | ||||||||||||||||||||||||||||||
| classdiv <="text-center">Образец заполнения платежного поручения | ||||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||
| >h2<СЧЕТ №[[+номер]] от [[+дата]] | ||||||||||||||||||||||||||||||
| stylediv <="width:100%;border-top:1px solid;height:20px"> | ||||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||
|
Всего наименований 1, на сумму [[+amount]] руб. >b<[[+amount_string]] | ||||||||||||||||||||||||||||||
srcimg <="[[+toPDF:is=`1`:then=`[[++assets_path]]img/pechat_ooo.gif `:else=`/assets/img/pechat_ooo.gif `]]" style="max-width: 100%; ширина: 648 пикселей; высота: 205 пикселей" width="648", height="205", alt="">