/* =================== */
  /* =================== */
 /*   © by Selexan		*/
/* =================== */

/* === =  Размер шрифта (процент от базового)  = === */
.fs-0-1em{font-size:0.1em}
.fs-0-2em{font-size:0.2em}
.fs-0-3em{font-size:0.3em}
.fs-0-4em{font-size:0.4em}
.fs-0-5em{font-size:0.5em}
.fs-0-6em{font-size:0.6em}
.fs-0-7em{font-size:0.7em}
.fs-0-8em{font-size:0.8em}
.fs-0-9em{font-size:0.9em}
.fs-1em{font-size:1em}
.fs-1-1em{font-size:1.1em}
.fs-1-2em{font-size:1.2em}
.fs-1-3em{font-size:1.3em}
.fs-1-4em{font-size:1.4em}
.fs-1-5em{font-size:1.5em}
.fs-1-6em{font-size:1.6em}
.fs-1-7em{font-size:1.7em}
.fs-1-8em{font-size:1.8em}
.fs-1-9em{font-size:1.9em}
.fs-2em{font-size:2em}

/* === =  Жирность шрифта  = === */

.b-1{font-weight:100} /* 100 - это самый тонкий */
.b-2{font-weight:200}
.b-3{font-weight:300}
.b-4{font-weight:400} /* 400 - это normal */
.b-5{font-weight:500}
.b-6{font-weight:600}
.b-7{font-weight:700} /* 700 - это bold */
.b-8{font-weight:800}
.b-9{font-weight:900} /* 900 - это сверхжирный */


/* === =  Другие преобразования со шрифта  = === */

.fs-n{font-style:normal}
.fs-i{font-style:italic} /* наклонный шрифт */
.fs-o{font-style:oblique} /* наклонное начертание. Курсив и наклонный шрифт при всей их похожести не одно и то же. Курсив это специальный шрифт имитирующий рукописный, наклонный же образуется путем наклона обычных знаков вправо */

.td-n{text-decoration:none}
.td-o{text-decoration:overline} /* линия проходит над текстом */
.td-u{text-decoration:underline} /* нижнее подчеркивание */
.td-lt{text-decoration:line-through} /* перечеркивает текст */


/* === =  Вертикальное выравнивание  = === */

.va-t{vertical-align:top}
.va-sub{vertical-align:sub}
.va-m{vertical-align:middle}
.va-b{vertical-align:bottom}
.va-sup{vertical-align:super}
.va-tt{vertical-align:text-top}
.va-bsl{vertical-align:baseline}
.va-tb{vertical-align:text-bottom}


/* === =  Горизонтальное выравнивание  = === */

.ta-l{text-align:left}
.ta-r{text-align:right}
.ta-c{text-align:center}


/* === =  Расстояние между границами ячеек  = === */
/* Одно значение устанавливает одновременно расстояние по вертикали и горизонтали между границами ячеек. Если значений два, то первое определяет горизонтальное расстояние, а второе — вертикальное */

.bs-1{border-spacing:1px}
.bs-2{border-spacing:2px}
.bs-3{border-spacing:3px}
.bs-4{border-spacing:4px}
.bs-5{border-spacing:5px}


/* === =  Float  = === */

.f-n{float:none}
.f-l{float:left}
.f-r{float:right}


.c-b{clear:both}
.c-l{clear:left}
.c-r{clear:right}


/* === =  Display  = === */

.d-n{display:none}
.d-t{display:table}
.d-b{display:block}
.d-i{display:inline}
.d-tr{display:table-row}
.d-tc{display:table-cell}
.d-ib{display:inline-block}


/* === =  White-Space  = === */

.ws-norm{white-space:normal}
.ws-now{white-space:nowrap} /* пробелы не учитываются, переносы строк в коде HTML игнорируются, весь текст отображается одной строкой; вместе с тем, добавление <br> переносит текст на новую строку */
.ws-pre{white-space:pre} /* текст показывается с учётом всех пробелов и переносов, как они были добавлены разработчиком в коде HTML. Если строка получается слишком длинной и не помещается в окне браузера, то будет добавлена горизонтальная полоса прокрутки */
.ws-prel{white-space:pre-line} /* в тексте пробелы не учитываются, текст автоматически переносится на следующую строку, если он не помещается в заданную область */
.ws-prew{white-space:pre-wrap} /* в тексте сохраняются все пробелы и переносы, однако если строка по ширине не помещается в заданную область, то текст автоматически будет перенесён на следующую строку */


/* === =  Overflow  = === */

.o-a{overflow:auto} /* полосы прокрутки добавляются только при необходимости */
.o-h{overflow:hidden} /* отображается только область внутри элемента, остальное будет скрыто */
.o-s{overflow:scroll} /* всегда добавляются полосы прокрутки */
.o-v{overflow:visible} /* отображается всё содержимое элемента, даже за пределами установленной высоты и ширины */


/* === =  Table-Layout  = === */

.tl-a{table-layout:auto} /* браузер загружает всю таблицу, анализирует её для определения размеров ячеек и только после этого отображает */
.tl-f{table-layout:fixed} /* ширина колонок в этом случае определяется либо с помощью элемента <col>, либо вычисляется на основе первой строки. Если данные о форматировании первой строки таблицы по каким-либо причинам получить невозможно, в этом случае таблица делится на колонки равной ширины. При использовании этого значения, содержимое, которое не помещается в ячейку указанной ширины, будет «обрезано» либо наложено поверх ячейки. Это зависит от используемого браузера, но в любом случае ширина ячейки меняться не будет. Для корректной работы этого значения обязательно должна быть задана ширина таблицы */


.p-rel{position:relative}
.p-abs{position:absolute}
.p-fix{position:fixed} /* фиксированное позиционирование. По своему действию это значение близко к absolute, но в отличие от него привязывается к указанной свойствами left, top, right и bottom точке на экране и не меняет своего положения при прокрутке веб-страницы */
.p-sticky{position:sticky} /* это сочетание относительного и фиксированного позиционирования. Элемент рассматривается как позиционированный относительно, пока он не пересекает определённый порог, после чего рассматривается как фиксированный. Обычно применяется для фиксации заголовка на одном месте, пока содержимое, к которому относится заголовок, прокручивается на странице */

.w-9{width:9%}
.w-10{width:10%}
.w-15{width:15%}
.w-25{width:25%}
.w-28{width:28%}
.w-30{width:30%}
.w-32{width:32%}
.w-33{width:33%}
.w-35{width:35%}
.w-37{width:37%}
.w-40{width:40%}
.w-42{width:42%}
.w-43{width:43%}
.w-45{width:45%}
.w-50{width:50%}
.w-55{width:55%}
.w-60{width:60%}
.w-65{width:65%}
.w-70{width:70%}
.w-75{width:75%}
.w-80{width:80%}
.w-85{width:85%}
.w-90{width:90%}
.w-95{width:95%}
.w-100{width:100%}
.w-200px{width:200px}
.w-109px{width:109px}
.w-9{width:9%}
.w-10{width:10%}
.w-15{width:15%}
.w-25{width:25%}
.w-28{width:28%}
.w-30{width:30%}
.w-32{width:32%}
.w-33{width:33%}
.w-35{width:35%}
.w-37{width:37%}
.w-44{width:42%}
.w-40{width:40%}
.w-45{width:45%}
.w-43{width:43%}
.w-50{width:50%}
.w-55{width:55%}
.w-60{width:60%}
.w-65{width:65%}
.w-70{width:70%}
.w-75{width:75%}
.w-80{width:80%}
.w-85{width:85%}
.w-88{width:88%}
.w-90{width:90%}
.w-95{width:95%}
.w-100{width:100%}


.h-15{height:15%}
.h-25{height:25%}
.h-28{height:28%}
.h-30{height:30%}
.h-32{height:32%}
.h-33{height:33%}
.h-35{height:35%}
.h-40{height:40%}
.h-45{height:45%}
.h-50{height:50%}
.h-55{height:55%}
.h-60{height:60%}
.h-65{height:65%}
.h-70{height:70%}
.h-75{height:75%}
.h-80{height:80%}
.h-85{height:85%}
.h-90{height:90%}
.h-95{height:95%}
.h-100{height:100%}
.h-144{height:144px}


.p-0{padding:0px}
.p-1{padding:1px}
.p-2{padding:2px}
.p-3{padding:3px}
.p-4{padding:4px}
.p-5{padding:5px}
.p-6{padding:6px}
.p-7{padding:7px}
.p-8{padding:8px}
.p-9{padding:9px}
.p-10{padding:10px}

.pt-0{padding-top:0px}
.pt-1{padding-top:1px}
.pt-2{padding-top:2px}
.pt-3{padding-top:3px}
.pt-4{padding-top:4px}
.pt-5{padding-top:5px}
.pt-6{padding-top:6px}
.pt-7{padding-top:7px}
.pt-8{padding-top:8px}
.pt-9{padding-top:9px}
.pt-10{padding-top:10px}
.pt-10{padding-top:10px}
.pt-15{padding-top:15px}

.pr-0{padding-right:0px}
.pr-1{padding-right:1px}
.pr-2{padding-right:2px}
.pr-3{padding-right:3px}
.pr-4{padding-right:4px}
.pr-5{padding-right:5px}
.pr-6{padding-right:6px}
.pr-7{padding-right:7px}
.pr-8{padding-right:8px}
.pr-9{padding-right:9px}
.pr-10{padding-right:10px}

.pb-0{padding-bottom:0px}
.pb-1{padding-bottom:1px}
.pb-2{padding-bottom:2px}
.pb-3{padding-bottom:3px}
.pb-4{padding-bottom:4px}
.pb-5{padding-bottom:5px}
.pb-6{padding-bottom:6px}
.pb-7{padding-bottom:7px}
.pb-8{padding-bottom:8px}
.pb-9{padding-bottom:9px}
.pb-10{padding-bottom:10px}

.pl-0{padding-left:0px}
.pl-1{padding-left:1px}
.pl-2{padding-left:2px}
.pl-3{padding-left:3px}
.pl-4{padding-left:4px}
.pl-5{padding-left:5px}
.pl-6{padding-left:6px}
.pl-7{padding-left:7px}
.pl-8{padding-left:8px}
.pl-9{padding-left:9px}
.pl-10{padding-left:10px}

.ptm-1{padding-top:-1px}
.ptm-2{padding-top:-2px}
.ptm-3{padding-top:-3px}
.ptm-4{padding-top:-4px}
.ptm-5{padding-top:-5px}
.ptm-6{padding-top:-6px}
.ptm-7{padding-top:-7px}
.ptm-8{padding-top:-8px}
.ptm-9{padding-top:-9px}
.ptm-10{padding-top:-10px}

.prm-1{padding-right:-1px}
.prm-2{padding-right:-2px}
.prm-3{padding-right:-3px}
.prm-4{padding-right:-4px}
.prm-5{padding-right:-5px}
.prm-6{padding-right:-6px}
.prm-7{padding-right:-7px}
.prm-8{padding-right:-8px}
.prm-9{padding-right:-9px}
.prm-10{padding-right:-10px}

.pbm-1{padding-bottom:-1px}
.pbm-2{padding-bottom:-2px}
.pbm-3{padding-bottom:-3px}
.pbm-4{padding-bottom:-4px}
.pbm-5{padding-bottom:-5px}
.pbm-6{padding-bottom:-6px}
.pbm-7{padding-bottom:-7px}
.pbm-8{padding-bottom:-8px}
.pbm-9{padding-bottom:-9px}
.pbm-10{padding-bottom:-10px}

.plm-1{padding-left:-4px}
.plm-2{padding-left:-2px}
.plm-3{padding-left:-3px}
.plm-4{padding-left:-4px}
.plm-5{padding-left:-5px}
.plm-6{padding-left:-6px}
.plm-7{padding-left:-7px}
.plm-8{padding-left:-8px}
.plm-9{padding-left:-9px}
.plm-10{padding-left:-10px}

.m-a{margin:auto}

.m-1{margin:1px}
.m-2{margin:2px}
.m-3{margin:3px}
.m-4{margin:4px}
.m-5{margin:5px}
.m-6{margin:6px}
.m-7{margin:7px}
.m-8{margin:8px}
.m-9{margin:9px}
.m-10{margin:10px}

.mt-0{margin-top:0}
.mt-1{margin-top:1px}
.mt-2{margin-top:2px}
.mt-3{margin-top:3px}
.mt-4{margin-top:4px}
.mt-5{margin-top:5px}
.mt-6{margin-top:6px}
.mt-7{margin-top:7px}
.mt-8{margin-top:8px}
.mt-9{margin-top:9px}
.mt-10{margin-top:10px}
.mt-14{margin-top:14px}
.mt-36{margin-top:36px}

.mb-0{margin-bottom:0}
.mb-1{margin-bottom:1px}
.mb-2{margin-bottom:2px}
.mb-3{margin-bottom:3px}
.mb-4{margin-bottom:4px}
.mb-5{margin-bottom:5px}
.mb-6{margin-bottom:6px}
.mb-7{margin-bottom:7px}
.mb-8{margin-bottom:8px}
.mb-9{margin-bottom:9px}
.mb-10{margin-bottom:10px}

.ml-0{margin-left:0}
.ml-1{margin-left:1px}
.ml-2{margin-left:2px}
.ml-3{margin-left:3px}
.ml-4{margin-left:4px}
.ml-5{margin-left:5px}
.ml-6{margin-left:6px}
.ml-7{margin-left:7px}
.ml-8{margin-left:8px}
.ml-9{margin-left:9px}
.ml-10{margin-left:10px}

.mr-0{margin-right:0}
.mr-1{margin-right:1px}
.mr-2{margin-right:2px}
.mr-3{margin-right:3px}
.mr-4{margin-right:4px}
.mr-5{margin-right:5px}
.mr-6{margin-right:6px}
.mr-7{margin-right:7px}
.mr-8{margin-right:8px}
.mr-9{margin-right:9px}
.mr-10{margin-right:10px}

.mtm-1{margin-top:-1px}
.mtm-2{margin-top:-2px}
.mtm-3{margin-top:-3px}
.mtm-4{margin-top:-4px}
.mtm-5{margin-top:-5px}
.mtm-6{margin-top:-6px}
.mtm-7{margin-top:-7px}
.mtm-8{margin-top:-8px}
.mtm-9{margin-top:-9px}
.mtm-10{margin-top:-10px}

.mr-1{margin-right:-1px}
.mrm-2{margin-right:-2px}
.mrm-3{margin-right:-3px}
.mrm-4{margin-right:-4px}
.mrm-5{margin-right:-5px}
.mrm-6{margin-right:-6px}
.mrm-7{margin-right:-7px}
.mrm-8{margin-right:-8px}
.mrm-9{margin-right:-9px}
.mrm-10{margin-right:-10px}

.mbm-1{margin-bottom:-1px}
.mbm-2{margin-bottom:-2px}
.mbm-3{margin-bottom:-3px}
.mbm-4{margin-bottom:-4px}
.mbm-5{margin-bottom:-5px}
.mbm-6{margin-bottom:-6px}
.mbm-7{margin-bottom:-7px}
.mbm-8{margin-bottom:-8px}
.mbm-9{margin-bottom:-9px}
.mbm-10{margin-bottom:-10px}

.mlm-1{margin-left:-4px}
.mlm-2{margin-left:-2px}
.mlm-3{margin-left:-3px}
.mlm-4{margin-left:-4px}
.mlm-5{margin-left:-5px}
.mlm-6{margin-left:-6px}
.mlm-7{margin-left:-7px}
.mlm-8{margin-left:-8px}
.mlm-9{margin-left:-9px}
.mlm-10{margin-left:-10px}