コーディング作業短縮化プラグイン『Emmet』をベースにしたCSS
『Emmet』とは入力補完機能によりHTML、CSS等を素早く編集できる、
テキストエディタ用のプラグインのことです。
記述法や練習だったりでわかりやすいページはこのあたり
Emmetの使い方を覚えてHTML/CSSの高速コーディングを身に付けよう
https://webdesign-trends.net/entry/10748
それで、これはいいなとタッチタイピングの練習をしていたのですけど、かんたんな調整用CSSとしても共通認識と入力の手間的にいいんじゃないかと思ったのでCSSにしてみました。
primer-emmet(emmet文法に合わせた調整用CSS)
/* primer-emmet
(emmet文法に合わせた調整用CSS設定)
===================================================================
# 目次
- visual Formatting
- box Sizing
- font
- text
- background
- border
- list
=================================================================== */
/* Visual Formatting
------------------------------------------------------------------- */
.pos--s { position: static; }
.pos--a { position: absolute; }
.pos--r { position: relative; }
.pos--f { position: fixed; }
.t--a { top: auto; }
.r--a { right: auto; }
.b--a { bottom: auto; }
.l--a { left: auto; }
.z--a { z-index: auto; }
.fl--n { float: none; }
.fl--l { float: left; }
.fl--r { float: right; }
.cl--n { clear: none; }
.cl--l { clear: left; }
.cl--r { clear: right; }
.cl--b { clear: both; }
.d--n { display: none; }
.d--b { display: block; }
.d--f { display: flex; }
.d--if { display: inline-flex; }
.d--i { display: inline; }
.d--ib { display: inline-block; }
.d--li { display: list-item; }
.d--tb { display: table; }
.d--itb { display: inline-table; }
.d--tbcp { display: table-caption; }
.d--tbcl { display: table-column; }
.d--tbclg { display: table-column-group; }
.d--tbhg { display: table-header-group; }
.d--tbfg { display: table-footer-group; }
.d--tbr { display: table-row; }
.d--tbrg { display: table-row-group; }
.d--tbc { display: table-cell; }
.d--rb { display: ruby; }
.d--rbb { display: ruby-base; }
.d--rbt { display: ruby-text; }
.v--v { visibility: visible; }
.v--h { visibility: hidden; }
.v--c { visibility: collapse; }
.ov--v { overflow: visible; }
.ov--h { overflow: hidden; }
.ov--s { overflow: scroll; }
.ov--a { overflow: auto; }
.ovx--v { overflow-x: visible; }
.ovx--h { overflow-x: hidden; }
.ovx--s { overflow-x: scroll; }
.ovx--a { overflow-x: auto; }
.ovy--v { overflow-y: visible; }
.ovy--h { overflow-y: hidden; }
.ovy--s { overflow-y: scroll; }
.ovy--a { overflow-y: auto; }
.rsz--n { resize: none; }
.rsz--b { resize: both; }
.rsz--h { resize: horizontal; }
.rsz--v { resize: vertical; }
/* Box Sizing
------------------------------------------------------------------- */
.bxz--cb { box-sizing: content-box; }
.bxz--bb { box-sizing: border-box; }
.bxsh--n { box-shadow: none; }
/* Font
------------------------------------------------------------------- */
.fw--n { font-weight: normal; }
.fw--b { font-weight: bold; }
.fw--br { font-weight: bolder; }
.fw--lr { font-weight: lighter; }
.fs--n { font-style: normal; }
.fs--i { font-style: italic; }
.fs--o { font-style: oblique; }
.fst--n { font-stretch: normal; }
.fst--uc { font-stretch: ultra-condensed; }
.fst--ec { font-stretch: extra-condensed; }
.fst--c { font-stretch: condensed; }
.fst--sc { font-stretch: semi-condensed; }
.fst--se { font-stretch: semi-expanded; }
.fst--e { font-stretch: expanded; }
.fst--ee { font-stretch: extra-expanded; }
.fst--ue { font-stretch: ultra-expanded; }
/* text
------------------------------------------------------------------- */
.va--sup { vertical-align: super; }
.va--t { vertical-align: top; }
.va--tt { vertical-align: text-top; }
.va--m { vertical-align: middle; }
.va--bl { vertical-align: baseline; }
.va--b { vertical-align: bottom; }
.va--tb { vertical-align: text-bottom; }
.va--sub { vertical-align: sub; }
.ta--l { text-align: left; }
.ta--c { text-align: center; }
.ta--r { text-align: right; }
.ta--j { text-align: justify; }
.tal--a { text-align-last: auto; }
.tal--l { text-align-last: left; }
.tal--c { text-align-last: center; }
.tal--r { text-align-last: right; }
.td--n { text-decoration: none; }
.td--u { text-decoration: underline; }
.td--o { text-decoration: overline; }
.td--l { text-decoration: line-through; }
.te--n { text-emphasis: none; }
.te--ac { text-emphasis: accent; }
.te--dt { text-emphasis: dot; }
.te--c { text-emphasis: circle; }
.te--ds { text-emphasis: disc; }
.te--b { text-emphasis: before; }
.te--a { text-emphasis: after; }
.tt--n { text-transform: none; }
.tt--c { text-transform: capitalize; }
.tt--u { text-transform: uppercase; }
.tt--l { text-transform: lowercase; }
.tsh--n { text-shadow: none; }
.whs--n { white-space: normal; }
.whs--p { white-space: pre; }
.whs--nw { white-space: nowrap; }
.whs--pw { white-space: pre-wrap; }
.whs--pl { white-space: pre-line; }
.wob--n { word-break: normal; }
.wob--k { word-break: keep-all; }
.wob--ba { word-break: break-all; }
.wow--nm { word-wrap: normal; }
.wow--n { word-wrap: none; }
.wow--u { word-wrap: unrestricted; }
.wow--s { word-wrap: suppress; }
.wow--b { word-wrap: break-word; }
/* background
------------------------------------------------------------------- */
.bg--n { background: none; }
.bgc--t { background-color: transparent; }
.bgi--n { background-image: none; }
.bgr--n { background-repeat: no-repeat; }
.bgr--x { background-repeat: repeat-x; }
.bgr--y { background-repeat: repeat-y; }
.bgr--sp { background-repeat: space; }
.bgr--rd { background-repeat: round; }
.bga--f { background-attachment: fixed; }
.bga--s { background-attachment: scroll; }
.bgsz--a { background-size: auto; }
.bgsz--ct { background-size: contain; }
.bgsz--cv { background-size: cover; }
/* outline
------------------------------------------------------------------- */
.olw--tn {
outline-style: none;
}
.ols--dt {
outline-style: dotted;
}
.ols--ds {
outline-style: dashed;
}
.ols--s {
outline-style: solid;
}
.ols--db {
outline-style: double;
}
.ols--g {
outline-style: groove;
}
.ols--r {
outline-style: ridge;
}
.ols--i {
outline-style: inset;
}
.ols--o {
outline-style: outset;
}
.tbl--a {
table-layout: auto;
}
/* table
------------------------------------------------------------------- */
.tbl--a {
table-layout: auto;
}
.tbl--f {
table-layout: fixed;
}
.cps--t {
caption-side: top;
}
.cps--b {
caption-side: bottom;
}
.es--s {
empty-cells: show;
}
.es--h {
empty-cells: hide;
}
/* border
------------------------------------------------------------------- */
.bd--n {
border: none;
}
.bdcl--c {
border-collapse: collapse;
}
.bdcl--s {
border-collapse: separate;
}
.bds--n {
border-style: none;
}
.bds--h {
border-style: hidden;
}
.bds--dt {
border-style: dotted;
}
.bds--ds {
border-style: dashed;
}
.bds--s {
border-style: solid;
}
.bds--db {
border-style: double;
}
.bds--dtds {
border-style: dot-dash;
}
.bds--dtdtds {
border-style: dot-dot-dash;
}
.bds--w {
border-style: wave;
}
.bds--g {
border-style: groove;
}
.bds--r {
border-style: ridge;
}
.bds--i {
border-style: inset;
}
.bds--o {
border-style: outset;
}
/* border-top
------------------------------------------------------------------- */
.bdt--n {
border-top: none;
}
.bdts--n {
border-top-style: none;
}
.bdts--h {
border-top-style: hidden;
}
.bdts--dt {
border-top-style: dotted;
}
.bdts--ds {
border-top-style: dashed;
}
.bdts--s {
border-top-style: solid;
}
.bdts--db {
border-top-style: double;
}
.bdts--dtds {
border-top-style: dot-dash;
}
.bdts--dtdtds {
border-top-style: dot-dot-dash;
}
.bdts--w {
border-top-style: wave;
}
.bdts--g {
border-top-style: groove;
}
.bdts--r {
border-top-style: ridge;
}
.bdts--i {
border-top-style: inset;
}
.bdts--o {
border-top-style: outset;
}
/* border-right
------------------------------------------------------------------- */
.bdr--n {
border-right: none;
}
.bdrs--n {
border-right-style: none;
}
.bdrs--h {
border-right-style: hidden;
}
.bdrs--dt {
border-right-style: dotted;
}
.bdrs--ds {
border-right-style: dashed;
}
.bdrs--s {
border-right-style: solid;
}
.bdrs--db {
border-right-style: double;
}
.bdrs--dtds {
border-right-style: dot-dash;
}
.bdrs--dtdtds {
border-right-style: dot-dot-dash;
}
.bdrs--w {
border-right-style: wave;
}
.bdrs--g {
border-right-style: groove;
}
.bdrs--r {
border-right-style: ridge;
}
.bdrs--i {
border-right-style: inset;
}
.bdrs--o {
border-right-style: outset;
}
/* border-bottom
------------------------------------------------------------------- */
.bdb--n {
border-bottom: none;
}
.bdbs--n {
border-bottom-style: none;
}
.bdbs--h {
border-bottom-style: hidden;
}
.bdbs--dt {
border-bottom-style: dotted;
}
.bdbs--ds {
border-bottom-style: dashed;
}
.bdbs--s {
border-bottom-style: solid;
}
.bdbs--db {
border-bottom-style: double;
}
.bdbs--dtds {
border-bottom-style: dot-dash;
}
.bdbs--dtdtds {
border-bottom-style: dot-dot-dash;
}
.bdbs--w {
border-bottom-style: wave;
}
.bdbs--g {
border-bottom-style: groove;
}
.bdbs--r {
border-bottom-style: ridge;
}
.bdbs--i {
border-bottom-style: inset;
}
.bdbs--o {
border-bottom-style: outset;
}
/* border-left
------------------------------------------------------------------- */
.bdl--n {
border-left: none;
}
.bdls--n {
border-left-style: none;
}
.bdls--h {
border-left-style: hidden;
}
.bdls--dt {
border-left-style: dotted;
}
.bdls--ds {
border-left-style: dashed;
}
.bdls--s {
border-left-style: solid;
}
.bdls--db {
border-left-style: double;
}
.bdls--dtds {
border-left-style: dot-dash;
}
.bdls--dtdtds {
border-left-style: dot-dot-dash;
}
.bdls--w {
border-left-style: wave;
}
.bdls--g {
border-left-style: groove;
}
.bdls--r {
border-left-style: ridge;
}
.bdls--i {
border-left-style: inset;
}
.bdls--o {
border-left-style: outset;
}
/* list
------------------------------------------------------------------- */
.lisp--i {
list-style-position: inside;
}
.lisp--o {
list-style-position: outside;
}
.list--n {
list-style-type: none;
}
.list--d {
list-style-type: disc;
}
.list--c {
list-style-type: circle;
}
.list--s {
list-style-type: square;
}
.list--dc {
list-style-type: disc;
}
.list--lr {
list-style-type: lower-roman;
}
.list--ur {
list-style-type: upper-roman;
}
/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––– primer-emmet */
primer-emmet-parameter(emmet文法に合わせた調整用CSS。値が固定値でないもの)
/* scss/_primer-emmet-parameter.scss
(emmet文法に合わせた調整用CSS。値が固定値でないもの)
===================================================================
# 目次
- margin
- padding
- top, right, bottom, left
- width, height
- text-indent
- word-spacing
- opacity
- border-width
=================================================================== */
/* margin
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
.m--a,
.m--auto {
margin: auto;
}
.m--a-0,
.m--auto-0 {
margin: auto 0;
}
.m--0 {
margin: 0;
}
.m--0-auto {
margin: 0 auto;
}
/* em */
.m--d25e {
margin: 0.25em;
}
.m--d50e {
margin: 0.50em;
}
.m--d75e {
margin: 0.75em;
}
.m--1e {
margin: 1em;
}
.m--2e {
margin: 2em;
}
.m--3e {
margin: 3em;
}
.m--4e {
margin: 4em;
}
.m--5e {
margin: 5em;
}
.m--6e {
margin: 6em;
}
.m--7e {
margin: 7em;
}
.m--8e {
margin: 8em;
}
.m--9e {
margin: 9em;
}
.m--10e {
margin: 10em;
}
/* rem */
.m--d25r {
margin: 0.25rem;
}
.m--d50r {
margin: 0.50rem;
}
.m--d75r {
margin: 0.75rem;
}
.m--1r {
margin: 1rem;
}
.m--2r {
margin: 2rem;
}
.m--3r {
margin: 3rem;
}
.m--4r {
margin: 4rem;
}
.m--5r {
margin: 5rem;
}
.m--6r {
margin: 6rem;
}
.m--7r {
margin: 7rem;
}
.m--8r {
margin: 8rem;
}
.m--9r {
margin: 9rem;
}
.m--10r {
margin: 10rem;
}
/* % */
.m--25p {
margin: 25%;
}
.m--50p {
margin: 50%;
}
.m--75p {
margin: 75%;
}
.m--10p {
margin: 10%;
}
.m--20p {
margin: 20%;
}
.m--30p {
margin: 30%;
}
.m--40p {
margin: 40%;
}
.m--60p {
margin: 60%;
}
.m--70p {
margin: 70%;
}
.m--80p {
margin: 80%;
}
.m--90p {
margin: 90%;
}
.m--100p {
margin: 100%;
}
/* vw */
.m--25vw {
margin: 25vw;
}
.m--50vw {
margin: 50vw;
}
.m--75vw {
margin: 75vw;
}
.m--10vw {
margin: 10vw;
}
.m--20vw {
margin: 20vw;
}
.m--30vw {
margin: 30vw;
}
.m--40vw {
margin: 40vw;
}
.m--60vw {
margin: 60vw;
}
.m--70vw {
margin: 70vw;
}
.m--80vw {
margin: 80vw;
}
.m--90vw {
margin: 90vw;
}
.m--100vw {
margin: 100vw;
}
/* vh */
.m--25vh {
margin: 25vh;
}
.m--50vh {
margin: 50vh;
}
.m--75vh {
margin: 75vh;
}
.m--10vh {
margin: 10vh;
}
.m--20vh {
margin: 20vh;
}
.m--30vh {
margin: 30vh;
}
.m--40vh {
margin: 40vh;
}
.m--60vh {
margin: 60vh;
}
.m--70vh {
margin: 70vh;
}
.m--80vh {
margin: 80vh;
}
.m--90vh {
margin: 90vh;
}
.m--100vh {
margin: 100vh;
}
/* px */
.m--1px {
margin: 1px;
}
.m--2px {
margin: 2px;
}
.m--3px {
margin: 3px;
}
.m--4px {
margin: 4px;
}
.m--5px {
margin: 5px;
}
.m--6px {
margin: 6px;
}
.m--7px {
margin: 7px;
}
.m--8px {
margin: 8px;
}
.m--9px {
margin: 9px;
}
.m--10px {
margin: 10px;
}
.m--20px {
margin: 20px;
}
.m--30px {
margin: 30px;
}
.m--40px {
margin: 40px;
}
.m--50px {
margin: 50px;
}
.m--60px {
margin: 60px;
}
.m--70px {
margin: 70px;
}
.m--80px {
margin: 80px;
}
.m--90px {
margin: 90px;
}
.m--100px {
margin: 100px;
}
.m--150px {
margin: 150px;
}
.m--200px {
margin: 200px;
}
.m--250px {
margin: 250px;
}
.m--300px {
margin: 300px;
}
/* margin-top
------------------------------------------------------------------- */
.mt--a,
.mt--auto {
margin-top: auto;
}
.mt--0 {
margin-top: 0;
}
/* em */
.mt--d25e {
margin-top: 0.25em;
}
.mt--d50e {
margin-top: 0.50em;
}
.mt--d75e {
margin-top: 0.75em;
}
.mt--1e {
margin-top: 1em;
}
.mt--2e {
margin-top: 2em;
}
.mt--3e {
margin-top: 3em;
}
.mt--4e {
margin-top: 4em;
}
.mt--5e {
margin-top: 5em;
}
.mt--6e {
margin-top: 6em;
}
.mt--7e {
margin-top: 7em;
}
.mt--8e {
margin-top: 8em;
}
.mt--9e {
margin-top: 9em;
}
.mt--10e {
margin-top: 10em;
}
/* rem */
.mt--d25r {
margin-top: 0.25rem;
}
.mt--d50r {
margin-top: 0.50rem;
}
.mt--d75r {
margin-top: 0.75rem;
}
.mt--1r {
margin-top: 1rem;
}
.mt--2r {
margin-top: 2rem;
}
.mt--3r {
margin-top: 3rem;
}
.mt--4r {
margin-top: 4rem;
}
.mt--5r {
margin-top: 5rem;
}
.mt--6r {
margin-top: 6rem;
}
.mt--7r {
margin-top: 7rem;
}
.mt--8r {
margin-top: 8rem;
}
.mt--9r {
margin-top: 9rem;
}
.mt--10r {
margin-top: 10rem;
}
/* % */
.mt--25p {
margin-top: 25%;
}
.mt--50p {
margin-top: 50%;
}
.mt--75p {
margin-top: 75%;
}
.mt--10p {
margin-top: 10%;
}
.mt--20p {
margin-top: 20%;
}
.mt--30p {
margin-top: 30%;
}
.mt--40p {
margin-top: 40%;
}
.mt--60p {
margin-top: 60%;
}
.mt--70p {
margin-top: 70%;
}
.mt--80p {
margin-top: 80%;
}
.mt--90p {
margin-top: 90%;
}
.mt--100p {
margin-top: 100%;
}
/* vw */
.mt--25vw {
margin-top: 25vw;
}
.mt--50vw {
margin-top: 50vw;
}
.mt--75vw {
margin-top: 75vw;
}
.mt--10vw {
margin-top: 10vw;
}
.mt--20vw {
margin-top: 20vw;
}
.mt--30vw {
margin-top: 30vw;
}
.mt--40vw {
margin-top: 40vw;
}
.mt--60vw {
margin-top: 60vw;
}
.mt--70vw {
margin-top: 70vw;
}
.mt--80vw {
margin-top: 80vw;
}
.mt--90vw {
margin-top: 90vw;
}
.mt--100vw {
margin-top: 100vw;
}
/* vh */
.mt--25vh {
margin-top: 25vh;
}
.mt--50vh {
margin-top: 50vh;
}
.mt--75vh {
margin-top: 75vh;
}
.mt--10vh {
margin-top: 10vh;
}
.mt--20vh {
margin-top: 20vh;
}
.mt--30vh {
margin-top: 30vh;
}
.mt--40vh {
margin-top: 40vh;
}
.mt--60vh {
margin-top: 60vh;
}
.mt--70vh {
margin-top: 70vh;
}
.mt--80vh {
margin-top: 80vh;
}
.mt--90vh {
margin-top: 90vh;
}
.mt--100vh {
margin-top: 100vh;
}
/* px */
.mt--1px {
margin-top: 1px;
}
.mt--2px {
margin-top: 2px;
}
.mt--3px {
margin-top: 3px;
}
.mt--4px {
margin-top: 4px;
}
.mt--5px {
margin-top: 5px;
}
.mt--6px {
margin-top: 6px;
}
.mt--7px {
margin-top: 7px;
}
.mt--8px {
margin-top: 8px;
}
.mt--9px {
margin-top: 9px;
}
.mt--10px {
margin-top: 10px;
}
.mt--20px {
margin-top: 20px;
}
.mt--30px {
margin-top: 30px;
}
.mt--40px {
margin-top: 40px;
}
.mt--50px {
margin-top: 50px;
}
.mt--60px {
margin-top: 60px;
}
.mt--70px {
margin-top: 70px;
}
.mt--80px {
margin-top: 80px;
}
.mt--90px {
margin-top: 90px;
}
.mt--100px {
margin-top: 100px;
}
.mt--150px {
margin-top: 150px;
}
.mt--200px {
margin-top: 200px;
}
.mt--250px {
margin-top: 250px;
}
.mt--300px {
margin-top: 300px;
}
/* margin-right
------------------------------------------------------------------- */
.mr--a,
.mr--auto {
margin-right: auto;
}
.mr--0 {
margin-right: 0;
}
/* em */
.mr--d25e {
margin-right: 0.25em;
}
.mr--d50e {
margin-right: 0.50em;
}
.mr--d75e {
margin-right: 0.75em;
}
.mr--1e {
margin-right: 1em;
}
.mr--2e {
margin-right: 2em;
}
.mr--3e {
margin-right: 3em;
}
.mr--4e {
margin-right: 4em;
}
.mr--5e {
margin-right: 5em;
}
.mr--6e {
margin-right: 6em;
}
.mr--7e {
margin-right: 7em;
}
.mr--8e {
margin-right: 8em;
}
.mr--9e {
margin-right: 9em;
}
.mr--10e {
margin-right: 10em;
}
/* rem */
.mr--d25r {
margin-right: 0.25rem;
}
.mr--d50r {
margin-right: 0.50rem;
}
.mr--d75r {
margin-right: 0.75rem;
}
.mr--1r {
margin-right: 1rem;
}
.mr--2r {
margin-right: 2rem;
}
.mr--3r {
margin-right: 3rem;
}
.mr--4r {
margin-right: 4rem;
}
.mr--5r {
margin-right: 5rem;
}
.mr--6r {
margin-right: 6rem;
}
.mr--7r {
margin-right: 7rem;
}
.mr--8r {
margin-right: 8rem;
}
.mr--9r {
margin-right: 9rem;
}
.mr--10r {
margin-right: 10rem;
}
/* % */
.mr--25p {
margin-right: 25%;
}
.mr--50p {
margin-right: 50%;
}
.mr--75p {
margin-right: 75%;
}
.mr--10p {
margin-right: 10%;
}
.mr--20p {
margin-right: 20%;
}
.mr--30p {
margin-right: 30%;
}
.mr--40p {
margin-right: 40%;
}
.mr--60p {
margin-right: 60%;
}
.mr--70p {
margin-right: 70%;
}
.mr--80p {
margin-right: 80%;
}
.mr--90p {
margin-right: 90%;
}
.mr--100p {
margin-right: 100%;
}
/* vw */
.mr--25vw {
margin-right: 25vw;
}
.mr--50vw {
margin-right: 50vw;
}
.mr--75vw {
margin-right: 75vw;
}
.mr--10vw {
margin-right: 10vw;
}
.mr--20vw {
margin-right: 20vw;
}
.mr--30vw {
margin-right: 30vw;
}
.mr--40vw {
margin-right: 40vw;
}
.mr--60vw {
margin-right: 60vw;
}
.mr--70vw {
margin-right: 70vw;
}
.mr--80vw {
margin-right: 80vw;
}
.mr--90vw {
margin-right: 90vw;
}
.mr--100vw {
margin-right: 100vw;
}
/* vh */
.mr--25vh {
margin-right: 25vh;
}
.mr--50vh {
margin-right: 50vh;
}
.mr--75vh {
margin-right: 75vh;
}
.mr--10vh {
margin-right: 10vh;
}
.mr--20vh {
margin-right: 20vh;
}
.mr--30vh {
margin-right: 30vh;
}
.mr--40vh {
margin-right: 40vh;
}
.mr--60vh {
margin-right: 60vh;
}
.mr--70vh {
margin-right: 70vh;
}
.mr--80vh {
margin-right: 80vh;
}
.mr--90vh {
margin-right: 90vh;
}
.mr--100vh {
margin-right: 100vh;
}
/* px */
.mr--1px {
margin-right: 1px;
}
.mr--2px {
margin-right: 2px;
}
.mr--3px {
margin-right: 3px;
}
.mr--4px {
margin-right: 4px;
}
.mr--5px {
margin-right: 5px;
}
.mr--6px {
margin-right: 6px;
}
.mr--7px {
margin-right: 7px;
}
.mr--8px {
margin-right: 8px;
}
.mr--9px {
margin-right: 9px;
}
.mr--10px {
margin-right: 10px;
}
.mr--20px {
margin-right: 20px;
}
.mr--30px {
margin-right: 30px;
}
.mr--40px {
margin-right: 40px;
}
.mr--50px {
margin-right: 50px;
}
.mr--60px {
margin-right: 60px;
}
.mr--70px {
margin-right: 70px;
}
.mr--80px {
margin-right: 80px;
}
.mr--90px {
margin-right: 90px;
}
.mr--100px {
margin-right: 100px;
}
.mr--150px {
margin-right: 150px;
}
.mr--200px {
margin-right: 200px;
}
.mr--250px {
margin-right: 250px;
}
.mr--300px {
margin-right: 300px;
}
/* margin-bottom
------------------------------------------------------------------- */
.mb--a,
.mb--auto {
margin-bottom: auto;
}
.mb--0 {
margin-bottom: 0;
}
/* em */
.mb--d25e {
margin-bottom: 0.25em;
}
.mb--d50e {
margin-bottom: 0.50em;
}
.mb--d75e {
margin-bottom: 0.75em;
}
.mb--1e {
margin-bottom: 1em;
}
.mb--2e {
margin-bottom: 2em;
}
.mb--3e {
margin-bottom: 3em;
}
.mb--4e {
margin-bottom: 4em;
}
.mb--5e {
margin-bottom: 5em;
}
.mb--6e {
margin-bottom: 6em;
}
.mb--7e {
margin-bottom: 7em;
}
.mb--8e {
margin-bottom: 8em;
}
.mb--9e {
margin-bottom: 9em;
}
.mb--10e {
margin-bottom: 10em;
}
/* rem */
.mb--d25r {
margin-bottom: 0.25rem;
}
.mb--d50r {
margin-bottom: 0.50rem;
}
.mb--d75r {
margin-bottom: 0.75rem;
}
.mb--1r {
margin-bottom: 1rem;
}
.mb--2r {
margin-bottom: 2rem;
}
.mb--3r {
margin-bottom: 3rem;
}
.mb--4r {
margin-bottom: 4rem;
}
.mb--5r {
margin-bottom: 5rem;
}
.mb--6r {
margin-bottom: 6rem;
}
.mb--7r {
margin-bottom: 7rem;
}
.mb--8r {
margin-bottom: 8rem;
}
.mb--9r {
margin-bottom: 9rem;
}
.mb--10r {
margin-bottom: 10rem;
}
/* % */
.mb--25p {
margin-bottom: 25%;
}
.mb--50p {
margin-bottom: 50%;
}
.mb--75p {
margin-bottom: 75%;
}
.mb--10p {
margin-bottom: 10%;
}
.mb--20p {
margin-bottom: 20%;
}
.mb--30p {
margin-bottom: 30%;
}
.mb--40p {
margin-bottom: 40%;
}
.mb--60p {
margin-bottom: 60%;
}
.mb--70p {
margin-bottom: 70%;
}
.mb--80p {
margin-bottom: 80%;
}
.mb--90p {
margin-bottom: 90%;
}
.mb--100p {
margin-bottom: 100%;
}
/* vw */
.mb--25vw {
margin-bottom: 25vw;
}
.mb--50vw {
margin-bottom: 50vw;
}
.mb--75vw {
margin-bottom: 75vw;
}
.mb--10vw {
margin-bottom: 10vw;
}
.mb--20vw {
margin-bottom: 20vw;
}
.mb--30vw {
margin-bottom: 30vw;
}
.mb--40vw {
margin-bottom: 40vw;
}
.mb--60vw {
margin-bottom: 60vw;
}
.mb--70vw {
margin-bottom: 70vw;
}
.mb--80vw {
margin-bottom: 80vw;
}
.mb--90vw {
margin-bottom: 90vw;
}
.mb--100vw {
margin-bottom: 100vw;
}
/* vh */
.mb--25vh {
margin-bottom: 25vh;
}
.mb--50vh {
margin-bottom: 50vh;
}
.mb--75vh {
margin-bottom: 75vh;
}
.mb--10vh {
margin-bottom: 10vh;
}
.mb--20vh {
margin-bottom: 20vh;
}
.mb--30vh {
margin-bottom: 30vh;
}
.mb--40vh {
margin-bottom: 40vh;
}
.mb--60vh {
margin-bottom: 60vh;
}
.mb--70vh {
margin-bottom: 70vh;
}
.mb--80vh {
margin-bottom: 80vh;
}
.mb--90vh {
margin-bottom: 90vh;
}
.mb--100vh {
margin-bottom: 100vh;
}
/* px */
.mb--1px {
margin-bottom: 1px;
}
.mb--2px {
margin-bottom: 2px;
}
.mb--3px {
margin-bottom: 3px;
}
.mb--4px {
margin-bottom: 4px;
}
.mb--5px {
margin-bottom: 5px;
}
.mb--6px {
margin-bottom: 6px;
}
.mb--7px {
margin-bottom: 7px;
}
.mb--8px {
margin-bottom: 8px;
}
.mb--9px {
margin-bottom: 9px;
}
.mb--10px {
margin-bottom: 10px;
}
.mb--20px {
margin-bottom: 20px;
}
.mb--30px {
margin-bottom: 30px;
}
.mb--40px {
margin-bottom: 40px;
}
.mb--50px {
margin-bottom: 50px;
}
.mb--60px {
margin-bottom: 60px;
}
.mb--70px {
margin-bottom: 70px;
}
.mb--80px {
margin-bottom: 80px;
}
.mb--90px {
margin-bottom: 90px;
}
.mb--100px {
margin-bottom: 100px;
}
.mb--150px {
margin-bottom: 150px;
}
.mb--200px {
margin-bottom: 200px;
}
.mb--250px {
margin-bottom: 250px;
}
.mb--300px {
margin-bottom: 300px;
}
/* margin-left
------------------------------------------------------------------- */
.ml--a,
.ml--auto {
margin-left: auto;
}
.ml--0 {
margin-left: 0;
}
/* em */
.ml--d25e {
margin-left: 0.25em;
}
.ml--d50e {
margin-left: 0.50em;
}
.ml--d75e {
margin-left: 0.75em;
}
.ml--1e {
margin-left: 1em;
}
.ml--2e {
margin-left: 2em;
}
.ml--3e {
margin-left: 3em;
}
.ml--4e {
margin-left: 4em;
}
.ml--5e {
margin-left: 5em;
}
.ml--6e {
margin-left: 6em;
}
.ml--7e {
margin-left: 7em;
}
.ml--8e {
margin-left: 8em;
}
.ml--9e {
margin-left: 9em;
}
.ml--10e {
margin-left: 10em;
}
/* rem */
.ml--d25r {
margin-left: 0.25rem;
}
.ml--d50r {
margin-left: 0.50rem;
}
.ml--d75r {
margin-left: 0.75rem;
}
.ml--1r {
margin-left: 1rem;
}
.ml--2r {
margin-left: 2rem;
}
.ml--3r {
margin-left: 3rem;
}
.ml--4r {
margin-left: 4rem;
}
.ml--5r {
margin-left: 5rem;
}
.ml--6r {
margin-left: 6rem;
}
.ml--7r {
margin-left: 7rem;
}
.ml--8r {
margin-left: 8rem;
}
.ml--9r {
margin-left: 9rem;
}
.ml--10r {
margin-left: 10rem;
}
/* % */
.ml--25p {
margin-left: 25%;
}
.ml--50p {
margin-left: 50%;
}
.ml--75p {
margin-left: 75%;
}
.ml--10p {
margin-left: 10%;
}
.ml--20p {
margin-left: 20%;
}
.ml--30p {
margin-left: 30%;
}
.ml--40p {
margin-left: 40%;
}
.ml--60p {
margin-left: 60%;
}
.ml--70p {
margin-left: 70%;
}
.ml--80p {
margin-left: 80%;
}
.ml--90p {
margin-left: 90%;
}
.ml--100p {
margin-left: 100%;
}
/* vw */
.ml--25vw {
margin-left: 25vw;
}
.ml--50vw {
margin-left: 50vw;
}
.ml--75vw {
margin-left: 75vw;
}
.ml--10vw {
margin-left: 10vw;
}
.ml--20vw {
margin-left: 20vw;
}
.ml--30vw {
margin-left: 30vw;
}
.ml--40vw {
margin-left: 40vw;
}
.ml--60vw {
margin-left: 60vw;
}
.ml--70vw {
margin-left: 70vw;
}
.ml--80vw {
margin-left: 80vw;
}
.ml--90vw {
margin-left: 90vw;
}
.ml--100vw {
margin-left: 100vw;
}
/* vh */
.ml--25vh {
margin-left: 25vh;
}
.ml--50vh {
margin-left: 50vh;
}
.ml--75vh {
margin-left: 75vh;
}
.ml--10vh {
margin-left: 10vh;
}
.ml--20vh {
margin-left: 20vh;
}
.ml--30vh {
margin-left: 30vh;
}
.ml--40vh {
margin-left: 40vh;
}
.ml--60vh {
margin-left: 60vh;
}
.ml--70vh {
margin-left: 70vh;
}
.ml--80vh {
margin-left: 80vh;
}
.ml--90vh {
margin-left: 90vh;
}
.ml--100vh {
margin-left: 100vh;
}
/* px */
.ml--1px {
margin-left: 1px;
}
.ml--2px {
margin-left: 2px;
}
.ml--3px {
margin-left: 3px;
}
.ml--4px {
margin-left: 4px;
}
.ml--5px {
margin-left: 5px;
}
.ml--6px {
margin-left: 6px;
}
.ml--7px {
margin-left: 7px;
}
.ml--8px {
margin-left: 8px;
}
.ml--9px {
margin-left: 9px;
}
.ml--10px {
margin-left: 10px;
}
.ml--20px {
margin-left: 20px;
}
.ml--30px {
margin-left: 30px;
}
.ml--40px {
margin-left: 40px;
}
.ml--50px {
margin-left: 50px;
}
.ml--60px {
margin-left: 60px;
}
.ml--70px {
margin-left: 70px;
}
.ml--80px {
margin-left: 80px;
}
.ml--90px {
margin-left: 90px;
}
.ml--100px {
margin-left: 100px;
}
.ml--150px {
margin-left: 150px;
}
.ml--200px {
margin-left: 200px;
}
.ml--250px {
margin-left: 250px;
}
.ml--300px {
margin-left: 300px;
}
/* margin-top-bottom
------------------------------------------------------------------- */
.mtb--a,
.mtb--auto {
margin-top: auto;
margin-bottom: auto;
}
.mtb--0 {
margin-top: 0;
margin-bottom: 0;
}
/* em */
.mtb--d25e {
margin-top: 0.25em;
margin-bottom: 0.25em;
}
.mtb--d50e {
margin-top: 0.50em;
margin-bottom: 0.50em;
}
.mtb--d75e {
margin-top: 0.75em;
margin-bottom: 0.75em;
margin: 1rem 1rem;
}
.mtb--1e {
margin-top: 1em;
margin-bottom: 1em;
}
.mtb--2e {
margin-top: 2em;
margin-bottom: 2em;
}
.mtb--3e {
margin-top: 3em;
margin-bottom: 3em;
}
.mtb--4e {
margin-top: 4em;
margin-bottom: 4em;
}
.mtb--5e {
margin-top: 5em;
margin-bottom: 5em;
}
.mtb--6e {
margin-top: 6em;
margin-bottom: 6em;
}
.mtb--7e {
margin-top: 7em;
margin-bottom: 7em;
}
.mtb--8e {
margin-top: 8em;
margin-bottom: 8em;
}
.mtb--9e {
margin-top: 9em;
margin-bottom: 9em;
}
.mtb--10e {
margin-top: 10em;
margin-bottom: 10em;
}
/* rem */
.mtb--d25r {
margin-top: 0.25rem;
margin-bottom: 0.25rem;
}
.mtb--d50r {
margin-top: 0.50rem;
margin-bottom: 0.50rem;
}
.mtb--d75r {
margin-top: 0.75rem;
margin-bottom: 0.75rem;
}
.mtb--1r {
margin-top: 1rem;
margin-bottom: 1rem;
}
.mtb--2r {
margin-top: 2rem;
margin-bottom: 2rem;
}
.mtb--3r {
margin-top: 3rem;
margin-bottom: 3rem;
}
.mtb--4r {
margin-top: 4rem;
margin-bottom: 4rem;
}
.mtb--5r {
margin-top: 5rem;
margin-bottom: 5rem;
}
.mtb--6r {
margin-top: 6rem;
margin-bottom: 6rem;
}
.mtb--7r {
margin-top: 7rem;
margin-bottom: 7rem;
}
.mtb--8r {
margin-top: 8rem;
margin-bottom: 8rem;
}
.mtb--9r {
margin-top: 9rem;
margin-bottom: 9rem;
}
.mtb--10r {
margin-top: 10rem;
margin-bottom: 10rem;
}
/* % */
.mtb--25p {
margin-top: 25%;
margin-bottom: 25%;
}
.mtb--50p {
margin-top: 50%;
margin-bottom: 50%;
}
.mtb--75p {
margin-top: 75%;
margin-bottom: 75%;
}
.mtb--10p {
margin-top: 10%;
margin-bottom: 10%;
}
.mtb--20p {
margin-top: 20%;
margin-bottom: 20%;
}
.mtb--30p {
margin-top: 30%;
margin-bottom: 30%;
}
.mtb--40p {
margin-top: 40%;
margin-bottom: 40%;
}
.mtb--60p {
margin-top: 60%;
margin-bottom: 60%;
}
.mtb--70p {
margin-top: 70%;
margin-bottom: 70%;
}
.mtb--80p {
margin-top: 80%;
margin-bottom: 80%;
}
.mtb--90p {
margin-top: 90%;
margin-bottom: 90%;
}
.mtb--100p {
margin-top: 100%;
margin-bottom: 100%;
}
/* vw */
.mtb--25vw {
margin-top: 25vw;
margin-bottom: 25vw;
}
.mtb--50vw {
margin-top: 50vw;
margin-bottom: 50vw;
}
.mtb--75vw {
margin-top: 75vw;
margin-bottom: 75vw;
}
.mtb--10vw {
margin-top: 10vw;
margin-bottom: 10vw;
}
.mtb--20vw {
margin-top: 20vw;
margin-bottom: 20vw;
}
.mtb--30vw {
margin-top: 30vw;
margin-bottom: 30vw;
}
.mtb--40vw {
margin-top: 40vw;
margin-bottom: 40vw;
}
.mtb--60vw {
margin-top: 60vw;
margin-bottom: 60vw;
}
.mtb--70vw {
margin-top: 70vw;
margin-bottom: 70vw;
m:1r1r ;
}
.mtb--80vw {
margin-top: 80vw;
margin-bottom: 80vw;
}
.mtb--90vw {
margin-top: 90vw;
margin-bottom: 90vw;
}
.mtb--100vw {
margin-top: 100vw;
margin-bottom: 100vw;
}
/* vh */
.mtb--25vh {
margin-top: 25vh;
margin-bottom: 25vh;
}
.mtb--50vh {
margin-top: 50vh;
margin-bottom: 50vh;
}
.mtb--75vh {
margin-top: 75vh;
margin-bottom: 75vh;
}
.mtb--10vh {
margin-top: 10vh;
margin-bottom: 10vh;
}
.mtb--20vh {
margin-top: 20vh;
margin-bottom: 20vh;
}
.mtb--30vh {
margin-top: 30vh;
margin-bottom: 30vh;
}
.mtb--40vh {
margin-top: 40vh;
margin-bottom: 40vh;
}
.mtb--60vh {
margin-top: 60vh;
margin-bottom: 60vh;
}
.mtb--70vh {
margin-top: 70vh;
margin-bottom: 70vh;
}
.mtb--80vh {
margin-top: 80vh;
margin-bottom: 80vh;
}
.mtb--90vh {
margin-top: 90vh;
margin-t: 90vh;
}
.mtb--100vh {
margin-top: 100vh;
margin-bottom: 100vh;
}
/* px */
.mtb--1px {
margin-top: 1px;
margin-bottom: 1px;
}
.mtb--2px {
margin-top: 2px;
margin-bottom: 2px;
}
.mtb--3px {
margin-top: 3px;
margin-bottom: 3px;
}
.mtb--4px {
margin-top: 4px;
margin-bottom: 4px;
}
.mtb--5px {
margin-top: 5px;
margin-bottom: 5px;
}
.mtb--6px {
margin-top: 6px;
margin-bottom: 6px;
}
.mtb--7px {
margin-top: 7px;
margin-bottom: 7px;
}
.mtb--8px {
margin-top: 8px;
margin-bottom: 8px;
}
.mtb--9px {
margin-top: 9px;
margin-bottom: 9px;
}
.mtb--10px {
margin-top: 10px;
margin-bottom: 10px;
}
.mtb--20px {
margin-top: 20px;
margin-bottom: 20px;
}
.mtb--30px {
margin-top: 30px;
margin-bottom: 30px;
}
.mtb--40px {
margin-top: 40px;
margin-bottom: 40px;
}
.mtb--50px {
margin-top: 50px;
margin-bottom: 50px;
}
.mtb--60px {
margin-top: 60px;
margin-bottom: 60px;
}
.mtb--70px {
margin-top: 70px;
margin-bottom: 70px;
}
.mtb--80px {
margin-top: 80px;
margin-bottom: 80px;
}
.mtb--90px {
margin-top: 90px;
margin-bottom: 90px;
}
.mtb--100px {
margin-top: 100px;
margin-bottom: 100px;
}
.mtb--150px {
margin-top: 150px;
margin-bottom: 150px;
}
.mtb--200px {
margin-top: 200px;
margin-bottom: 200px;
}
.mtb--250px {
margin-top: 250px;
margin-bottom: 250px;
}
.mtb--300px {
margin-top: 300px;
margin-bottom: 300px;
}
/* margin-right-left
------------------------------------------------------------------- */
.mrl--a,
.mrl--auto {
margin-right: auto;
margin-left: auto;
}
.mrl--0 {
margin-right: 0;
margin-left: 0;
}
/* em */
.mrl--d25e {
margin-right: 0.25em;
margin-left: 0.25em;
}
.mrl--d50e {
margin-right: 0.50em;
margin-left: 0.50em;
}
.mrl--d75e {
margin-right: 0.75em;
margin-left: 0.75em;
margin: 1rem 1rem;
}
.mrl--1e {
margin-right: 1em;
margin-left: 1em;
}
.mrl--2e {
margin-right: 2em;
margin-left: 2em;
}
.mrl--3e {
margin-right: 3em;
margin-left: 3em;
}
.mrl--4e {
margin-right: 4em;
margin-left: 4em;
}
.mrl--5e {
margin-right: 5em;
margin-left: 5em;
}
.mrl--6e {
margin-right: 6em;
margin-left: 6em;
}
.mrl--7e {
margin-right: 7em;
margin-left: 7em;
}
.mrl--8e {
margin-right: 8em;
margin-left: 8em;
}
.mrl--9e {
margin-right: 9em;
margin-left: 9em;
}
.mrl--10e {
margin-right: 10em;
margin-left: 10em;
}
/* rem */
.mrl--d25r {
margin-right: 0.25rem;
margin-left: 0.25rem;
}
.mrl--d50r {
margin-right: 0.50rem;
margin-left: 0.50rem;
}
.mrl--d75r {
margin-right: 0.75rem;
margin-left: 0.75rem;
}
.mrl--1r {
margin-right: 1rem;
margin-left: 1rem;
}
.mrl--2r {
margin-right: 2rem;
margin-left: 2rem;
}
.mrl--3r {
margin-right: 3rem;
margin-left: 3rem;
}
.mrl--4r {
margin-right: 4rem;
margin-left: 4rem;
}
.mrl--5r {
margin-right: 5rem;
margin-left: 5rem;
}
.mrl--6r {
margin-right: 6rem;
margin-left: 6rem;
}
.mrl--7r {
margin-right: 7rem;
margin-left: 7rem;
}
.mrl--8r {
margin-right: 8rem;
margin-left: 8rem;
}
.mrl--9r {
margin-right: 9rem;
margin-left: 9rem;
}
.mrl--10r {
margin-right: 10rem;
margin-left: 10rem;
}
/* % */
.mrl--25p {
margin-right: 25%;
margin-left: 25%;
}
.mrl--50p {
margin-right: 50%;
margin-left: 50%;
}
.mrl--75p {
margin-right: 75%;
margin-left: 75%;
}
.mrl--10p {
margin-right: 10%;
margin-left: 10%;
}
.mrl--20p {
margin-right: 20%;
margin-left: 20%;
}
.mrl--30p {
margin-right: 30%;
margin-left: 30%;
}
.mrl--40p {
margin-right: 40%;
margin-left: 40%;
}
.mrl--60p {
margin-right: 60%;
margin-left: 60%;
}
.mrl--70p {
margin-right: 70%;
margin-left: 70%;
}
.mrl--80p {
margin-right: 80%;
margin-left: 80%;
}
.mrl--90p {
margin-right: 90%;
margin-left: 90%;
}
.mrl--100p {
margin-right: 100%;
margin-left: 100%;
}
/* vw */
.mrl--25vw {
margin-right: 25vw;
margin-left: 25vw;
}
.mrl--50vw {
margin-right: 50vw;
margin-left: 50vw;
}
.mrl--75vw {
margin-right: 75vw;
margin-left: 75vw;
}
.mrl--10vw {
margin-right: 10vw;
margin-left: 10vw;
}
.mrl--20vw {
margin-right: 20vw;
margin-left: 20vw;
}
.mrl--30vw {
margin-right: 30vw;
margin-left: 30vw;
}
.mrl--40vw {
margin-right: 40vw;
margin-left: 40vw;
}
.mrl--60vw {
margin-right: 60vw;
margin-left: 60vw;
}
.mrl--70vw {
margin-right: 70vw;
margin-left: 70vw;
m:1r1r ;
}
.mrl--80vw {
margin-right: 80vw;
margin-left: 80vw;
}
.mrl--90vw {
margin-right: 90vw;
margin-left: 90vw;
}
.mrl--100vw {
margin-right: 100vw;
margin-left: 100vw;
}
/* vh */
.mrl--25vh {
margin-right: 25vh;
margin-left: 25vh;
}
.mrl--50vh {
margin-right: 50vh;
margin-left: 50vh;
}
.mrl--75vh {
margin-right: 75vh;
margin-left: 75vh;
}
.mrl--10vh {
margin-right: 10vh;
margin-left: 10vh;
}
.mrl--20vh {
margin-right: 20vh;
margin-left: 20vh;
}
.mrl--30vh {
margin-right: 30vh;
margin-left: 30vh;
}
.mrl--40vh {
margin-right: 40vh;
margin-left: 40vh;
}
.mrl--60vh {
margin-right: 60vh;
margin-left: 60vh;
}
.mrl--70vh {
margin-right: 70vh;
margin-left: 70vh;
}
.mrl--80vh {
margin-right: 80vh;
margin-left: 80vh;
}
.mrl--90vh {
margin-right: 90vh;
margin-left: 90vh;
}
.mrl--100vh {
margin-right: 100vh;
margin-left: 100vh;
}
/* px */
.mrl--1px {
margin-right: 1px;
margin-left: 1px;
}
.mrl--2px {
margin-right: 2px;
margin-left: 2px;
}
.mrl--3px {
margin-right: 3px;
margin-left: 3px;
}
.mrl--4px {
margin-right: 4px;
margin-left: 4px;
}
.mrl--5px {
margin-right: 5px;
margin-left: 5px;
}
.mrl--6px {
margin-right: 6px;
margin-left: 6px;
}
.mrl--7px {
margin-right: 7px;
margin-left: 7px;
}
.mrl--8px {
margin-right: 8px;
margin-left: 8px;
}
.mrl--9px {
margin-right: 9px;
margin-left: 9px;
}
.mrl--10px {
margin-right: 10px;
margin-left: 10px;
}
.mrl--20px {
margin-right: 20px;
margin-left: 20px;
}
.mrl--30px {
margin-right: 30px;
margin-left: 30px;
}
.mrl--40px {
margin-right: 40px;
margin-left: 40px;
}
.mrl--50px {
margin-right: 50px;
margin-left: 50px;
}
.mrl--60px {
margin-right: 60px;
margin-left: 60px;
}
.mrl--70px {
margin-right: 70px;
margin-left: 70px;
}
.mrl--80px {
margin-right: 80px;
margin-left: 80px;
}
.mrl--90px {
margin-right: 90px;
margin-left: 90px;
}
.mrl--100px {
margin-right: 100px;
margin-left: 100px;
}
.mrl--150px {
margin-right: 150px;
margin-left: 150px;
}
.mrl--200px {
margin-right: 200px;
margin-left: 200px;
}
.mrl--250px {
margin-right: 250px;
margin-left: 250px;
}
.mrl--300px {
margin-right: 300px;
margin-left: 300px;
}
/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––––––––– margin */
/* padding
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
.p--0 {
padding: 0;
}
/* em */
.p--d25e {
padding: 0.25em;
}
.p--d50e {
padding: 0.50em;
}
.p--d75e {
padding: 0.75em;
}
.p--1e {
padding: 1em;
}
.p--2e {
padding: 2em;
}
.p--3e {
padding: 3em;
}
.p--4e {
padding: 4em;
}
.p--5e {
padding: 5em;
}
.p--6e {
padding: 6em;
}
.p--7e {
padding: 7em;
}
.p--8e {
padding: 8em;
}
.p--9e {
padding: 9em;
}
.p--10e {
padding: 10em;
}
/* rem */
.p--d25r {
padding: 0.25rem;
}
.p--d50r {
padding: 0.50rem;
}
.p--d75r {
padding: 0.75rem;
}
.p--1r {
padding: 1rem;
}
.p--2r {
padding: 2rem;
}
.p--3r {
padding: 3rem;
}
.p--4r {
padding: 4rem;
}
.p--5r {
padding: 5rem;
}
.p--6r {
padding: 6rem;
}
.p--7r {
padding: 7rem;
}
.p--8r {
padding: 8rem;
}
.p--9r {
padding: 9rem;
}
.p--10r {
padding: 10rem;
}
/* % */
.p--25p {
padding: 25%;
}
.p--50p {
padding: 50%;
}
.p--75p {
padding: 75%;
}
.p--10p {
padding: 10%;
}
.p--20p {
padding: 20%;
}
.p--30p {
padding: 30%;
}
.p--40p {
padding: 40%;
}
.p--60p {
padding: 60%;
}
.p--70p {
padding: 70%;
}
.p--80p {
padding: 80%;
}
.p--90p {
padding: 90%;
}
.p--100p {
padding: 100%;
}
/* vw */
.p--25vw {
padding: 25vw;
}
.p--50vw {
padding: 50vw;
}
.p--75vw {
padding: 75vw;
}
.p--10vw {
padding: 10vw;
}
.p--20vw {
padding: 20vw;
}
.p--30vw {
padding: 30vw;
}
.p--40vw {
padding: 40vw;
}
.p--60vw {
padding: 60vw;
}
.p--70vw {
padding: 70vw;
}
.p--80vw {
padding: 80vw;
}
.p--90vw {
padding: 90vw;
}
.p--100vw {
padding: 100vw;
}
/* vh */
.p--25vh {
padding: 25vh;
}
.p--50vh {
padding: 50vh;
}
.p--75vh {
padding: 75vh;
}
.p--10vh {
padding: 10vh;
}
.p--20vh {
padding: 20vh;
}
.p--30vh {
padding: 30vh;
}
.p--40vh {
padding: 40vh;
}
.p--60vh {
padding: 60vh;
}
.p--70vh {
padding: 70vh;
}
.p--80vh {
padding: 80vh;
}
.p--90vh {
padding: 90vh;
}
.p--100vh {
padding: 100vh;
}
/* px */
.p--1px {
padding: 1px;
}
.p--2px {
padding: 2px;
}
.p--3px {
padding: 3px;
}
.p--4px {
padding: 4px;
}
.p--5px {
padding: 5px;
}
.p--6px {
padding: 6px;
}
.p--7px {
padding: 7px;
}
.p--8px {
padding: 8px;
}
.p--9px {
padding: 9px;
}
.p--10px {
padding: 10px;
}
.p--20px {
padding: 20px;
}
.p--30px {
padding: 30px;
}
.p--40px {
padding: 40px;
}
.p--50px {
padding: 50px;
}
.p--60px {
padding: 60px;
}
.p--70px {
padding: 70px;
}
.p--80px {
padding: 80px;
}
.p--90px {
padding: 90px;
}
.p--100px {
padding: 100px;
}
.p--150px {
padding: 150px;
}
.p--200px {
padding: 200px;
}
.p--250px {
padding: 250px;
}
.p--300px {
padding: 300px;
}
/* padding-top
------------------------------------------------------------------- */
.pt--0 {
padding-top: 0;
}
/* em */
.pt--d25e {
padding-top: 0.25em;
}
.pt--d50e {
padding-top: 0.50em;
}
.pt--d75e {
padding-top: 0.75em;
}
.pt--1e {
padding-top: 1em;
}
.pt--2e {
padding-top: 2em;
}
.pt--3e {
padding-top: 3em;
}
.pt--4e {
padding-top: 4em;
}
.pt--5e {
padding-top: 5em;
}
.pt--6e {
padding-top: 6em;
}
.pt--7e {
padding-top: 7em;
}
.pt--8e {
padding-top: 8em;
}
.pt--9e {
padding-top: 9em;
}
.pt--10e {
padding-top: 10em;
}
/* rem */
.pt--d25r {
padding-top: 0.25rem;
}
.pt--d50r {
padding-top: 0.50rem;
}
.pt--d75r {
padding-top: 0.75rem;
}
.pt--1r {
padding-top: 1rem;
}
.pt--2r {
padding-top: 2rem;
}
.pt--3r {
padding-top: 3rem;
}
.pt--4r {
padding-top: 4rem;
}
.pt--5r {
padding-top: 5rem;
}
.pt--6r {
padding-top: 6rem;
}
.pt--7r {
padding-top: 7rem;
}
.pt--8r {
padding-top: 8rem;
}
.pt--9r {
padding-top: 9rem;
}
.pt--10r {
padding-top: 10rem;
}
/* % */
.pt--25p {
padding-top: 25%;
}
.pt--50p {
padding-top: 50%;
}
.pt--75p {
padding-top: 75%;
}
.pt--10p {
padding-top: 10%;
}
.pt--20p {
padding-top: 20%;
}
.pt--30p {
padding-top: 30%;
}
.pt--40p {
padding-top: 40%;
}
.pt--60p {
padding-top: 60%;
}
.pt--70p {
padding-top: 70%;
}
.pt--80p {
padding-top: 80%;
}
.pt--90p {
padding-top: 90%;
}
.pt--100p {
padding-top: 100%;
}
/* vw */
.pt--25vw {
padding-top: 25vw;
}
.pt--50vw {
padding-top: 50vw;
}
.pt--75vw {
padding-top: 75vw;
}
.pt--10vw {
padding-top: 10vw;
}
.pt--20vw {
padding-top: 20vw;
}
.pt--30vw {
padding-top: 30vw;
}
.pt--40vw {
padding-top: 40vw;
}
.pt--60vw {
padding-top: 60vw;
}
.pt--70vw {
padding-top: 70vw;
}
.pt--80vw {
padding-top: 80vw;
}
.pt--90vw {
padding-top: 90vw;
}
.pt--100vw {
padding-top: 100vw;
}
/* vh */
.pt--25vh {
padding-top: 25vh;
}
.pt--50vh {
padding-top: 50vh;
}
.pt--75vh {
padding-top: 75vh;
}
.pt--10vh {
padding-top: 10vh;
}
.pt--20vh {
padding-top: 20vh;
}
.pt--30vh {
padding-top: 30vh;
}
.pt--40vh {
padding-top: 40vh;
}
.pt--60vh {
padding-top: 60vh;
}
.pt--70vh {
padding-top: 70vh;
}
.pt--80vh {
padding-top: 80vh;
}
.pt--90vh {
padding-top: 90vh;
}
.pt--100vh {
padding-top: 100vh;
}
/* px */
.pt--1px {
padding-top: 1px;
}
.pt--2px {
padding-top: 2px;
}
.pt--3px {
padding-top: 3px;
}
.pt--4px {
padding-top: 4px;
}
.pt--5px {
padding-top: 5px;
}
.pt--6px {
padding-top: 6px;
}
.pt--7px {
padding-top: 7px;
}
.pt--8px {
padding-top: 8px;
}
.pt--9px {
padding-top: 9px;
}
.pt--10px {
padding-top: 10px;
}
.pt--20px {
padding-top: 20px;
}
.pt--30px {
padding-top: 30px;
}
.pt--40px {
padding-top: 40px;
}
.pt--50px {
padding-top: 50px;
}
.pt--60px {
padding-top: 60px;
}
.pt--70px {
padding-top: 70px;
}
.pt--80px {
padding-top: 80px;
}
.pt--90px {
padding-top: 90px;
}
.pt--100px {
padding-top: 100px;
}
.pt--150px {
padding-top: 150px;
}
.pt--200px {
padding-top: 200px;
}
.pt--250px {
padding-top: 250px;
}
.pt--300px {
padding-top: 300px;
}
/* padding-right
------------------------------------------------------------------- */
.pr--0 {
padding-right: 0;
}
/* em */
.pr--d25e {
padding-right: 0.25em;
}
.pr--d50e {
padding-right: 0.50em;
}
.pr--d75e {
padding-right: 0.75em;
}
.pr--1e {
padding-right: 1em;
}
.pr--2e {
padding-right: 2em;
}
.pr--3e {
padding-right: 3em;
}
.pr--4e {
padding-right: 4em;
}
.pr--5e {
padding-right: 5em;
}
.pr--6e {
padding-right: 6em;
}
.pr--7e {
padding-right: 7em;
}
.pr--8e {
padding-right: 8em;
}
.pr--9e {
padding-right: 9em;
}
.pr--10e {
padding-right: 10em;
}
/* rem */
.pr--d25r {
padding-right: 0.25rem;
}
.pr--d50r {
padding-right: 0.50rem;
}
.pr--d75r {
padding-right: 0.75rem;
}
.pr--1r {
padding-right: 1rem;
}
.pr--2r {
padding-right: 2rem;
}
.pr--3r {
padding-right: 3rem;
}
.pr--4r {
padding-right: 4rem;
}
.pr--5r {
padding-right: 5rem;
}
.pr--6r {
padding-right: 6rem;
}
.pr--7r {
padding-right: 7rem;
}
.pr--8r {
padding-right: 8rem;
}
.pr--9r {
padding-right: 9rem;
}
.pr--10r {
padding-right: 10rem;
}
/* % */
.pr--25p {
padding-right: 25%;
}
.pr--50p {
padding-right: 50%;
}
.pr--75p {
padding-right: 75%;
}
.pr--10p {
padding-right: 10%;
}
.pr--20p {
padding-right: 20%;
}
.pr--30p {
padding-right: 30%;
}
.pr--40p {
padding-right: 40%;
}
.pr--60p {
padding-right: 60%;
}
.pr--70p {
padding-right: 70%;
}
.pr--80p {
padding-right: 80%;
}
.pr--90p {
padding-right: 90%;
}
.pr--100p {
padding-right: 100%;
}
/* vw */
.pr--25vw {
padding-right: 25vw;
}
.pr--50vw {
padding-right: 50vw;
}
.pr--75vw {
padding-right: 75vw;
}
.pr--10vw {
padding-right: 10vw;
}
.pr--20vw {
padding-right: 20vw;
}
.pr--30vw {
padding-right: 30vw;
}
.pr--40vw {
padding-right: 40vw;
}
.pr--60vw {
padding-right: 60vw;
}
.pr--70vw {
padding-right: 70vw;
}
.pr--80vw {
padding-right: 80vw;
}
.pr--90vw {
padding-right: 90vw;
}
.pr--100vw {
padding-right: 100vw;
}
/* vh */
.pr--25vh {
padding-right: 25vh;
}
.pr--50vh {
padding-right: 50vh;
}
.pr--75vh {
padding-right: 75vh;
}
.pr--10vh {
padding-right: 10vh;
}
.pr--20vh {
padding-right: 20vh;
}
.pr--30vh {
padding-right: 30vh;
}
.pr--40vh {
padding-right: 40vh;
}
.pr--60vh {
padding-right: 60vh;
}
.pr--70vh {
padding-right: 70vh;
}
.pr--80vh {
padding-right: 80vh;
}
.pr--90vh {
padding-right: 90vh;
}
.pr--100vh {
padding-right: 100vh;
}
/* px */
.pr--1px {
padding-right: 1px;
}
.pr--2px {
padding-right: 2px;
}
.pr--3px {
padding-right: 3px;
}
.pr--4px {
padding-right: 4px;
}
.pr--5px {
padding-right: 5px;
}
.pr--6px {
padding-right: 6px;
}
.pr--7px {
padding-right: 7px;
}
.pr--8px {
padding-right: 8px;
}
.pr--9px {
padding-right: 9px;
}
.pr--10px {
padding-right: 10px;
}
.pr--20px {
padding-right: 20px;
}
.pr--30px {
padding-right: 30px;
}
.pr--40px {
padding-right: 40px;
}
.pr--50px {
padding-right: 50px;
}
.pr--60px {
padding-right: 60px;
}
.pr--70px {
padding-right: 70px;
}
.pr--80px {
padding-right: 80px;
}
.pr--90px {
padding-right: 90px;
}
.pr--100px {
padding-right: 100px;
}
.pr--150px {
padding-right: 150px;
}
.pr--200px {
padding-right: 200px;
}
.pr--250px {
padding-right: 250px;
}
.pr--300px {
padding-right: 300px;
}
/* padding-bottom
------------------------------------------------------------------- */
.pb--0 {
padding-bottom: 0;
}
/* em */
.pb--d25e {
padding-bottom: 0.25em;
}
.pb--d50e {
padding-bottom: 0.50em;
}
.pb--d75e {
padding-bottom: 0.75em;
}
.pb--1e {
padding-bottom: 1em;
}
.pb--2e {
padding-bottom: 2em;
}
.pb--3e {
padding-bottom: 3em;
}
.pb--4e {
padding-bottom: 4em;
}
.pb--5e {
padding-bottom: 5em;
}
.pb--6e {
padding-bottom: 6em;
}
.pb--7e {
padding-bottom: 7em;
}
.pb--8e {
padding-bottom: 8em;
}
.pb--9e {
padding-bottom: 9em;
}
.pb--10e {
padding-bottom: 10em;
}
/* rem */
.pb--d25r {
padding-bottom: 0.25rem;
}
.pb--d50r {
padding-bottom: 0.50rem;
}
.pb--d75r {
padding-bottom: 0.75rem;
}
.pb--1r {
padding-bottom: 1rem;
}
.pb--2r {
padding-bottom: 2rem;
}
.pb--3r {
padding-bottom: 3rem;
}
.pb--4r {
padding-bottom: 4rem;
}
.pb--5r {
padding-bottom: 5rem;
}
.pb--6r {
padding-bottom: 6rem;
}
.pb--7r {
padding-bottom: 7rem;
}
.pb--8r {
padding-bottom: 8rem;
}
.pb--9r {
padding-bottom: 9rem;
}
.pb--10r {
padding-bottom: 10rem;
}
/* % */
.pb--25p {
padding-bottom: 25%;
}
.pb--50p {
padding-bottom: 50%;
}
.pb--75p {
padding-bottom: 75%;
}
.pb--10p {
padding-bottom: 10%;
}
.pb--20p {
padding-bottom: 20%;
}
.pb--30p {
padding-bottom: 30%;
}
.pb--40p {
padding-bottom: 40%;
}
.pb--60p {
padding-bottom: 60%;
}
.pb--70p {
padding-bottom: 70%;
}
.pb--80p {
padding-bottom: 80%;
}
.pb--90p {
padding-bottom: 90%;
}
.pb--100p {
padding-bottom: 100%;
}
/* vw */
.pb--25vw {
padding-bottom: 25vw;
}
.pb--50vw {
padding-bottom: 50vw;
}
.pb--75vw {
padding-bottom: 75vw;
}
.pb--10vw {
padding-bottom: 10vw;
}
.pb--20vw {
padding-bottom: 20vw;
}
.pb--30vw {
padding-bottom: 30vw;
}
.pb--40vw {
padding-bottom: 40vw;
}
.pb--60vw {
padding-bottom: 60vw;
}
.pb--70vw {
padding-bottom: 70vw;
}
.pb--80vw {
padding-bottom: 80vw;
}
.pb--90vw {
padding-bottom: 90vw;
}
.pb--100vw {
padding-bottom: 100vw;
}
/* vh */
.pb--25vh {
padding-bottom: 25vh;
}
.pb--50vh {
padding-bottom: 50vh;
}
.pb--75vh {
padding-bottom: 75vh;
}
.pb--10vh {
padding-bottom: 10vh;
}
.pb--20vh {
padding-bottom: 20vh;
}
.pb--30vh {
padding-bottom: 30vh;
}
.pb--40vh {
padding-bottom: 40vh;
}
.pb--60vh {
padding-bottom: 60vh;
}
.pb--70vh {
padding-bottom: 70vh;
}
.pb--80vh {
padding-bottom: 80vh;
}
.pb--90vh {
padding-bottom: 90vh;
}
.pb--100vh {
padding-bottom: 100vh;
}
/* px */
.pb--1px {
padding-bottom: 1px;
}
.pb--2px {
padding-bottom: 2px;
}
.pb--3px {
padding-bottom: 3px;
}
.pb--4px {
padding-bottom: 4px;
}
.pb--5px {
padding-bottom: 5px;
}
.pb--6px {
padding-bottom: 6px;
}
.pb--7px {
padding-bottom: 7px;
}
.pb--8px {
padding-bottom: 8px;
}
.pb--9px {
padding-bottom: 9px;
}
.pb--10px {
padding-bottom: 10px;
}
.pb--20px {
padding-bottom: 20px;
}
.pb--30px {
padding-bottom: 30px;
}
.pb--40px {
padding-bottom: 40px;
}
.pb--50px {
padding-bottom: 50px;
}
.pb--60px {
padding-bottom: 60px;
}
.pb--70px {
padding-bottom: 70px;
}
.pb--80px {
padding-bottom: 80px;
}
.pb--90px {
padding-bottom: 90px;
}
.pb--100px {
padding-bottom: 100px;
}
.pb--150px {
padding-bottom: 150px;
}
.pb--200px {
padding-bottom: 200px;
}
.pb--250px {
padding-bottom: 250px;
}
.pb--300px {
padding-bottom: 300px;
}
/* padding-left
------------------------------------------------------------------- */
.pl--0 {
padding-left: 0;
}
/* em */
.pl--d25e {
padding-left: 0.25em;
}
.pl--d50e {
padding-left: 0.50em;
}
.pl--d75e {
padding-left: 0.75em;
}
.pl--1e {
padding-left: 1em;
}
.pl--2e {
padding-left: 2em;
}
.pl--3e {
padding-left: 3em;
}
.pl--4e {
padding-left: 4em;
}
.pl--5e {
padding-left: 5em;
}
.pl--6e {
padding-left: 6em;
}
.pl--7e {
padding-left: 7em;
}
.pl--8e {
padding-left: 8em;
}
.pl--9e {
padding-left: 9em;
}
.pl--10e {
padding-left: 10em;
}
/* rem */
.pl--d25r {
padding-left: 0.25rem;
}
.pl--d50r {
padding-left: 0.50rem;
}
.pl--d75r {
padding-left: 0.75rem;
}
.pl--1r {
padding-left: 1rem;
}
.pl--2r {
padding-left: 2rem;
}
.pl--3r {
padding-left: 3rem;
}
.pl--4r {
padding-left: 4rem;
}
.pl--5r {
padding-left: 5rem;
}
.pl--6r {
padding-left: 6rem;
}
.pl--7r {
padding-left: 7rem;
}
.pl--8r {
padding-left: 8rem;
}
.pl--9r {
padding-left: 9rem;
}
.pl--10r {
padding-left: 10rem;
}
/* % */
.pl--25p {
padding-left: 25%;
}
.pl--50p {
padding-left: 50%;
}
.pl--75p {
padding-left: 75%;
}
.pl--10p {
padding-left: 10%;
}
.pl--20p {
padding-left: 20%;
}
.pl--30p {
padding-left: 30%;
}
.pl--40p {
padding-left: 40%;
}
.pl--60p {
padding-left: 60%;
}
.pl--70p {
padding-left: 70%;
}
.pl--80p {
padding-left: 80%;
}
.pl--90p {
padding-left: 90%;
}
.pl--100p {
padding-left: 100%;
}
/* vw */
.pl--25vw {
padding-left: 25vw;
}
.pl--50vw {
padding-left: 50vw;
}
.pl--75vw {
padding-left: 75vw;
}
.pl--10vw {
padding-left: 10vw;
}
.pl--20vw {
padding-left: 20vw;
}
.pl--30vw {
padding-left: 30vw;
}
.pl--40vw {
padding-left: 40vw;
}
.pl--60vw {
padding-left: 60vw;
}
.pl--70vw {
padding-left: 70vw;
}
.pl--80vw {
padding-left: 80vw;
}
.pl--90vw {
padding-left: 90vw;
}
.pl--100vw {
padding-left: 100vw;
}
/* vh */
.pl--25vh {
padding-left: 25vh;
}
.pl--50vh {
padding-left: 50vh;
}
.pl--75vh {
padding-left: 75vh;
}
.pl--10vh {
padding-left: 10vh;
}
.pl--20vh {
padding-left: 20vh;
}
.pl--30vh {
padding-left: 30vh;
}
.pl--40vh {
padding-left: 40vh;
}
.pl--60vh {
padding-left: 60vh;
}
.pl--70vh {
padding-left: 70vh;
}
.pl--80vh {
padding-left: 80vh;
}
.pl--90vh {
padding-left: 90vh;
}
.pl--100vh {
padding-left: 100vh;
}
/* px */
.pl--1px {
padding-left: 1px;
}
.pl--2px {
padding-left: 2px;
}
.pl--3px {
padding-left: 3px;
}
.pl--4px {
padding-left: 4px;
}
.pl--5px {
padding-left: 5px;
}
.pl--6px {
padding-left: 6px;
}
.pl--7px {
padding-left: 7px;
}
.pl--8px {
padding-left: 8px;
}
.pl--9px {
padding-left: 9px;
}
.pl--10px {
padding-left: 10px;
}
.pl--20px {
padding-left: 20px;
}
.pl--30px {
padding-left: 30px;
}
.pl--40px {
padding-left: 40px;
}
.pl--50px {
padding-left: 50px;
}
.pl--60px {
padding-left: 60px;
}
.pl--70px {
padding-left: 70px;
}
.pl--80px {
padding-left: 80px;
}
.pl--90px {
padding-left: 90px;
}
.pl--100px {
padding-left: 100px;
}
.pl--150px {
padding-left: 150px;
}
.pl--200px {
padding-left: 200px;
}
.pl--250px {
padding-left: 250px;
}
.pl--300px {
padding-left: 300px;
}
/* padding-top-bottom
------------------------------------------------------------------- */
.ptb--0 {
padding-top: 0;
padding-bottom: 0;
}
/* em */
.ptb--d25e {
padding-top: 0.25em;
padding-bottom: 0.25em;
}
.ptb--d50e {
padding-top: 0.50em;
padding-bottom: 0.50em;
}
.ptb--d75e {
padding-top: 0.75em;
padding-bottom: 0.75em;
padding: 1rem 1rem;
}
.ptb--1e {
padding-top: 1em;
padding-bottom: 1em;
}
.ptb--2e {
padding-top: 2em;
padding-bottom: 2em;
}
.ptb--3e {
padding-top: 3em;
padding-bottom: 3em;
}
.ptb--4e {
padding-top: 4em;
padding-bottom: 4em;
}
.ptb--5e {
padding-top: 5em;
padding-bottom: 5em;
}
.ptb--6e {
padding-top: 6em;
padding-bottom: 6em;
}
.ptb--7e {
padding-top: 7em;
padding-bottom: 7em;
}
.ptb--8e {
padding-top: 8em;
padding-bottom: 8em;
}
.ptb--9e {
padding-top: 9em;
padding-bottom: 9em;
}
.ptb--10e {
padding-top: 10em;
padding-bottom: 10em;
}
/* rem */
.ptb--d25r {
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.ptb--d50r {
padding-top: 0.50rem;
padding-bottom: 0.50rem;
}
.ptb--d75r {
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.ptb--1r {
padding-top: 1rem;
padding-bottom: 1rem;
}
.ptb--2r {
padding-top: 2rem;
padding-bottom: 2rem;
}
.ptb--3r {
padding-top: 3rem;
padding-bottom: 3rem;
}
.ptb--4r {
padding-top: 4rem;
padding-bottom: 4rem;
}
.ptb--5r {
padding-top: 5rem;
padding-bottom: 5rem;
}
.ptb--6r {
padding-top: 6rem;
padding-bottom: 6rem;
}
.ptb--7r {
padding-top: 7rem;
padding-bottom: 7rem;
}
.ptb--8r {
padding-top: 8rem;
padding-bottom: 8rem;
}
.ptb--9r {
padding-top: 9rem;
padding-bottom: 9rem;
}
.ptb--10r {
padding-top: 10rem;
padding-bottom: 10rem;
}
/* % */
.ptb--25p {
padding-top: 25%;
padding-bottom: 25%;
}
.ptb--50p {
padding-top: 50%;
padding-bottom: 50%;
}
.ptb--75p {
padding-top: 75%;
padding-bottom: 75%;
}
.ptb--10p {
padding-top: 10%;
padding-bottom: 10%;
}
.ptb--20p {
padding-top: 20%;
padding-bottom: 20%;
}
.ptb--30p {
padding-top: 30%;
padding-bottom: 30%;
}
.ptb--40p {
padding-top: 40%;
padding-bottom: 40%;
}
.ptb--60p {
padding-top: 60%;
padding-bottom: 60%;
}
.ptb--70p {
padding-top: 70%;
padding-bottom: 70%;
}
.ptb--80p {
padding-top: 80%;
padding-bottom: 80%;
}
.ptb--90p {
padding-top: 90%;
padding-bottom: 90%;
}
.ptb--100p {
padding-top: 100%;
padding-bottom: 100%;
}
/* vw */
.ptb--25vw {
padding-top: 25vw;
padding-bottom: 25vw;
}
.ptb--50vw {
padding-top: 50vw;
padding-bottom: 50vw;
}
.ptb--75vw {
padding-top: 75vw;
padding-bottom: 75vw;
}
.ptb--10vw {
padding-top: 10vw;
padding-bottom: 10vw;
}
.ptb--20vw {
padding-top: 20vw;
padding-bottom: 20vw;
}
.ptb--30vw {
padding-top: 30vw;
padding-bottom: 30vw;
}
.ptb--40vw {
padding-top: 40vw;
padding-bottom: 40vw;
}
.ptb--60vw {
padding-top: 60vw;
padding-bottom: 60vw;
}
.ptb--70vw {
padding-top: 70vw;
padding-bottom: 70vw;
m:1r1r ;
}
.ptb--80vw {
padding-top: 80vw;
padding-bottom: 80vw;
}
.ptb--90vw {
padding-top: 90vw;
padding-bottom: 90vw;
}
.ptb--100vw {
padding-top: 100vw;
padding-bottom: 100vw;
}
/* vh */
.ptb--25vh {
padding-top: 25vh;
padding-bottom: 25vh;
}
.ptb--50vh {
padding-top: 50vh;
padding-bottom: 50vh;
}
.ptb--75vh {
padding-top: 75vh;
padding-bottom: 75vh;
}
.ptb--10vh {
padding-top: 10vh;
padding-bottom: 10vh;
}
.ptb--20vh {
padding-top: 20vh;
padding-bottom: 20vh;
}
.ptb--30vh {
padding-top: 30vh;
padding-bottom: 30vh;
}
.ptb--40vh {
padding-top: 40vh;
padding-bottom: 40vh;
}
.ptb--60vh {
padding-top: 60vh;
padding-bottom: 60vh;
}
.ptb--70vh {
padding-top: 70vh;
padding-bottom: 70vh;
}
.ptb--80vh {
padding-top: 80vh;
padding-bottom: 80vh;
}
.ptb--90vh {
padding-top: 90vh;
padding-t: 90vh;
}
.ptb--100vh {
padding-top: 100vh;
padding-bottom: 100vh;
}
/* px */
.ptb--1px {
padding-top: 1px;
padding-bottom: 1px;
}
.ptb--2px {
padding-top: 2px;
padding-bottom: 2px;
}
.ptb--3px {
padding-top: 3px;
padding-bottom: 3px;
}
.ptb--4px {
padding-top: 4px;
padding-bottom: 4px;
}
.ptb--5px {
padding-top: 5px;
padding-bottom: 5px;
}
.ptb--6px {
padding-top: 6px;
padding-bottom: 6px;
}
.ptb--7px {
padding-top: 7px;
padding-bottom: 7px;
}
.ptb--8px {
padding-top: 8px;
padding-bottom: 8px;
}
.ptb--9px {
padding-top: 9px;
padding-bottom: 9px;
}
.ptb--10px {
padding-top: 10px;
padding-bottom: 10px;
}
.ptb--20px {
padding-top: 20px;
padding-bottom: 20px;
}
.ptb--30px {
padding-top: 30px;
padding-bottom: 30px;
}
.ptb--40px {
padding-top: 40px;
padding-bottom: 40px;
}
.ptb--50px {
padding-top: 50px;
padding-bottom: 50px;
}
.ptb--60px {
padding-top: 60px;
padding-bottom: 60px;
}
.ptb--70px {
padding-top: 70px;
padding-bottom: 70px;
}
.ptb--80px {
padding-top: 80px;
padding-bottom: 80px;
}
.ptb--90px {
padding-top: 90px;
padding-bottom: 90px;
}
.ptb--100px {
padding-top: 100px;
padding-bottom: 100px;
}
.ptb--150px {
padding-top: 150px;
padding-bottom: 150px;
}
.ptb--200px {
padding-top: 200px;
padding-bottom: 200px;
}
.ptb--250px {
padding-top: 250px;
padding-bottom: 250px;
}
.ptb--300px {
padding-top: 300px;
padding-bottom: 300px;
}
/* padding-right-left
------------------------------------------------------------------- */
.prl--0 {
padding-right: 0;
padding-left: 0;
}
/* em */
.prl--d25e {
padding-right: 0.25em;
padding-left: 0.25em;
}
.prl--d50e {
padding-right: 0.50em;
padding-left: 0.50em;
}
.prl--d75e {
padding-right: 0.75em;
padding-left: 0.75em;
padding: 1rem 1rem;
}
.prl--1e {
padding-right: 1em;
padding-left: 1em;
}
.prl--2e {
padding-right: 2em;
padding-left: 2em;
}
.prl--3e {
padding-right: 3em;
padding-left: 3em;
}
.prl--4e {
padding-right: 4em;
padding-left: 4em;
}
.prl--5e {
padding-right: 5em;
padding-left: 5em;
}
.prl--6e {
padding-right: 6em;
padding-left: 6em;
}
.prl--7e {
padding-right: 7em;
padding-left: 7em;
}
.prl--8e {
padding-right: 8em;
padding-left: 8em;
}
.prl--9e {
padding-right: 9em;
padding-left: 9em;
}
.prl--10e {
padding-right: 10em;
padding-left: 10em;
}
/* rem */
.prl--d25r {
padding-right: 0.25rem;
padding-left: 0.25rem;
}
.prl--d50r {
padding-right: 0.50rem;
padding-left: 0.50rem;
}
.prl--d75r {
padding-right: 0.75rem;
padding-left: 0.75rem;
}
.prl--1r {
padding-right: 1rem;
padding-left: 1rem;
}
.prl--2r {
padding-right: 2rem;
padding-left: 2rem;
}
.prl--3r {
padding-right: 3rem;
padding-left: 3rem;
}
.prl--4r {
padding-right: 4rem;
padding-left: 4rem;
}
.prl--5r {
padding-right: 5rem;
padding-left: 5rem;
}
.prl--6r {
padding-right: 6rem;
padding-left: 6rem;
}
.prl--7r {
padding-right: 7rem;
padding-left: 7rem;
}
.prl--8r {
padding-right: 8rem;
padding-left: 8rem;
}
.prl--9r {
padding-right: 9rem;
padding-left: 9rem;
}
.prl--10r {
padding-right: 10rem;
padding-left: 10rem;
}
/* % */
.prl--25p {
padding-right: 25%;
padding-left: 25%;
}
.prl--50p {
padding-right: 50%;
padding-left: 50%;
}
.prl--75p {
padding-right: 75%;
padding-left: 75%;
}
.prl--10p {
padding-right: 10%;
padding-left: 10%;
}
.prl--20p {
padding-right: 20%;
padding-left: 20%;
}
.prl--30p {
padding-right: 30%;
padding-left: 30%;
}
.prl--40p {
padding-right: 40%;
padding-left: 40%;
}
.prl--60p {
padding-right: 60%;
padding-left: 60%;
}
.prl--70p {
padding-right: 70%;
padding-left: 70%;
}
.prl--80p {
padding-right: 80%;
padding-left: 80%;
}
.prl--90p {
padding-right: 90%;
padding-left: 90%;
}
.prl--100p {
padding-right: 100%;
padding-left: 100%;
}
/* vw */
.prl--25vw {
padding-right: 25vw;
padding-left: 25vw;
}
.prl--50vw {
padding-right: 50vw;
padding-left: 50vw;
}
.prl--75vw {
padding-right: 75vw;
padding-left: 75vw;
}
.prl--10vw {
padding-right: 10vw;
padding-left: 10vw;
}
.prl--20vw {
padding-right: 20vw;
padding-left: 20vw;
}
.prl--30vw {
padding-right: 30vw;
padding-left: 30vw;
}
.prl--40vw {
padding-right: 40vw;
padding-left: 40vw;
}
.prl--60vw {
padding-right: 60vw;
padding-left: 60vw;
}
.prl--70vw {
padding-right: 70vw;
padding-left: 70vw;
m:1r1r ;
}
.prl--80vw {
padding-right: 80vw;
padding-left: 80vw;
}
.prl--90vw {
padding-right: 90vw;
padding-left: 90vw;
}
.prl--100vw {
padding-right: 100vw;
padding-left: 100vw;
}
/* vh */
.prl--25vh {
padding-right: 25vh;
padding-left: 25vh;
}
.prl--50vh {
padding-right: 50vh;
padding-left: 50vh;
}
.prl--75vh {
padding-right: 75vh;
padding-left: 75vh;
}
.prl--10vh {
padding-right: 10vh;
padding-left: 10vh;
}
.prl--20vh {
padding-right: 20vh;
padding-left: 20vh;
}
.prl--30vh {
padding-right: 30vh;
padding-left: 30vh;
}
.prl--40vh {
padding-right: 40vh;
padding-left: 40vh;
}
.prl--60vh {
padding-right: 60vh;
padding-left: 60vh;
}
.prl--70vh {
padding-right: 70vh;
padding-left: 70vh;
}
.prl--80vh {
padding-right: 80vh;
padding-left: 80vh;
}
.prl--90vh {
padding-right: 90vh;
padding-t: 90vh;
}
.prl--100vh {
padding-right: 100vh;
padding-left: 100vh;
}
/* px */
.prl--1px {
padding-right: 1px;
padding-left: 1px;
}
.prl--2px {
padding-right: 2px;
padding-left: 2px;
}
.prl--3px {
padding-right: 3px;
padding-left: 3px;
}
.prl--4px {
padding-right: 4px;
padding-left: 4px;
}
.prl--5px {
padding-right: 5px;
padding-left: 5px;
}
.prl--6px {
padding-right: 6px;
padding-left: 6px;
}
.prl--7px {
padding-right: 7px;
padding-left: 7px;
}
.prl--8px {
padding-right: 8px;
padding-left: 8px;
}
.prl--9px {
padding-right: 9px;
padding-left: 9px;
}
.prl--10px {
padding-right: 10px;
padding-left: 10px;
}
.prl--20px {
padding-right: 20px;
padding-left: 20px;
}
.prl--30px {
padding-right: 30px;
padding-left: 30px;
}
.prl--40px {
padding-right: 40px;
padding-left: 40px;
}
.prl--50px {
padding-right: 50px;
padding-left: 50px;
}
.prl--60px {
padding-right: 60px;
padding-left: 60px;
}
.prl--70px {
padding-right: 70px;
padding-left: 70px;
}
.prl--80px {
padding-right: 80px;
padding-left: 80px;
}
.prl--90px {
padding-right: 90px;
padding-left: 90px;
}
.prl--100px {
padding-right: 100px;
padding-left: 100px;
}
.prl--150px {
padding-right: 150px;
padding-left: 150px;
}
.prl--200px {
padding-right: 200px;
padding-left: 200px;
}
.prl--250px {
padding-right: 250px;
padding-left: 250px;
}
.prl--300px {
padding-right: 300px;
padding-left: 300px;
}
/*ƒ ––––––––––––––––––––––––––––––––––––––––––––––––––––––– padding */
/* top, right, bottom, left
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* top
------------------------------------------------------------------- */
.t--a,
.t--auto {
top: auto;
}
.t--0 {
top: 0;
}
/* em */
.t--d25e {
top: 0.25em;
}
.t--d50e {
top: 0.50em;
}
.t--d75e {
top: 0.75em;
}
.t--1e {
top: 1em;
}
.t--2e {
top: 2em;
}
.t--3e {
top: 3em;
}
.t--4e {
top: 4em;
}
.t--5e {
top: 5em;
}
.t--6e {
top: 6em;
}
.t--7e {
top: 7em;
}
.t--8e {
top: 8em;
}
.t--9e {
top: 9em;
}
.t--10e {
top: 10em;
}
/* rem */
.t--d25r {
top: 0.25rem;
}
.t--d50r {
top: 0.50rem;
}
.t--d75r {
top: 0.75rem;
}
.t--1r {
top: 1rem;
}
.t--2r {
top: 2rem;
}
.t--3r {
top: 3rem;
}
.t--4r {
top: 4rem;
}
.t--5r {
top: 5rem;
}
.t--6r {
top: 6rem;
}
.t--7r {
top: 7rem;
}
.t--8r {
top: 8rem;
}
.t--9r {
top: 9rem;
}
.t--10r {
top: 10rem;
}
/* % */
.t--25p {
top: 25%;
}
.t--50p {
top: 50%;
}
.t--75p {
top: 75%;
}
.t--10p {
top: 10%;
}
.t--20p {
top: 20%;
}
.t--30p {
top: 30%;
}
.t--40p {
top: 40%;
}
.t--60p {
top: 60%;
}
.t--70p {
top: 70%;
}
.t--80p {
top: 80%;
}
.t--90p {
top: 90%;
}
.t--100p {
top: 100%;
}
/* vw */
.t--25vw {
top: 25vw;
}
.t--50vw {
top: 50vw;
}
.t--75vw {
top: 75vw;
}
.t--10vw {
top: 10vw;
}
.t--20vw {
top: 20vw;
}
.t--30vw {
top: 30vw;
}
.t--40vw {
top: 40vw;
}
.t--60vw {
top: 60vw;
}
.t--70vw {
top: 70vw;
}
.t--80vw {
top: 80vw;
}
.t--90vw {
top: 90vw;
}
.t--100vw {
top: 100vw;
}
/* vh */
.t--25vh {
top: 25vh;
}
.t--50vh {
top: 50vh;
}
.t--75vh {
top: 75vh;
}
.t--10vh {
top: 10vh;
}
.t--20vh {
top: 20vh;
}
.t--30vh {
top: 30vh;
}
.t--40vh {
top: 40vh;
}
.t--60vh {
top: 60vh;
}
.t--70vh {
top: 70vh;
}
.t--80vh {
top: 80vh;
}
.t--90vh {
top: 90vh;
}
.t--100vh {
top: 100vh;
}
/* px */
.t--1px {
top: 1px;
}
.t--2px {
top: 2px;
}
.t--3px {
top: 3px;
}
.t--4px {
top: 4px;
}
.t--5px {
top: 5px;
}
.t--6px {
top: 6px;
}
.t--7px {
top: 7px;
}
.t--8px {
top: 8px;
}
.t--9px {
top: 9px;
}
.t--10px {
top: 10px;
}
.t--20px {
top: 20px;
}
.t--30px {
top: 30px;
}
.t--40px {
top: 40px;
}
.t--50px {
top: 50px;
}
.t--60px {
top: 60px;
}
.t--70px {
top: 70px;
}
.t--80px {
top: 80px;
}
.t--90px {
top: 90px;
}
.t--100px {
top: 100px;
}
.t--150px {
top: 150px;
}
.t--200px {
top: 200px;
}
.t--250px {
top: 250px;
}
.t--300px {
top: 300px;
}
/* right
------------------------------------------------------------------- */
.r--a,
.r--auto {
right: auto;
}
.r--0 {
right: 0;
}
/* em */
.r--d25e {
right: 0.25em;
}
.r--d50e {
right: 0.50em;
}
.r--d75e {
right: 0.75em;
}
.r--1e {
right: 1em;
}
.r--2e {
right: 2em;
}
.r--3e {
right: 3em;
}
.r--4e {
right: 4em;
}
.r--5e {
right: 5em;
}
.r--6e {
right: 6em;
}
.r--7e {
right: 7em;
}
.r--8e {
right: 8em;
}
.r--9e {
right: 9em;
}
.r--10e {
right: 10em;
}
/* rem */
.r--d25r {
right: 0.25rem;
}
.r--d50r {
right: 0.50rem;
}
.r--d75r {
right: 0.75rem;
}
.r--1r {
right: 1rem;
}
.r--2r {
right: 2rem;
}
.r--3r {
right: 3rem;
}
.r--4r {
right: 4rem;
}
.r--5r {
right: 5rem;
}
.r--6r {
right: 6rem;
}
.r--7r {
right: 7rem;
}
.r--8r {
right: 8rem;
}
.r--9r {
right: 9rem;
}
.r--10r {
right: 10rem;
}
/* % */
.r--25p {
right: 25%;
}
.r--50p {
right: 50%;
}
.r--75p {
right: 75%;
}
.r--10p {
right: 10%;
}
.r--20p {
right: 20%;
}
.r--30p {
right: 30%;
}
.r--40p {
right: 40%;
}
.r--60p {
right: 60%;
}
.r--70p {
right: 70%;
}
.r--80p {
right: 80%;
}
.r--90p {
right: 90%;
}
.r--100p {
right: 100%;
}
/* vw */
.r--25vw {
right: 25vw;
}
.r--50vw {
right: 50vw;
}
.r--75vw {
right: 75vw;
}
.r--10vw {
right: 10vw;
}
.r--20vw {
right: 20vw;
}
.r--30vw {
right: 30vw;
}
.r--40vw {
right: 40vw;
}
.r--60vw {
right: 60vw;
}
.r--70vw {
right: 70vw;
}
.r--80vw {
right: 80vw;
}
.r--90vw {
right: 90vw;
}
.r--100vw {
right: 100vw;
}
/* vh */
.r--25vh {
right: 25vh;
}
.r--50vh {
right: 50vh;
}
.r--75vh {
right: 75vh;
}
.r--10vh {
right: 10vh;
}
.r--20vh {
right: 20vh;
}
.r--30vh {
right: 30vh;
}
.r--40vh {
right: 40vh;
}
.r--60vh {
right: 60vh;
}
.r--70vh {
right: 70vh;
}
.r--80vh {
right: 80vh;
}
.r--90vh {
right: 90vh;
}
.r--100vh {
right: 100vh;
}
/* px */
.r--1px {
right: 1px;
}
.r--2px {
right: 2px;
}
.r--3px {
right: 3px;
}
.r--4px {
right: 4px;
}
.r--5px {
right: 5px;
}
.r--6px {
right: 6px;
}
.r--7px {
right: 7px;
}
.r--8px {
right: 8px;
}
.r--9px {
right: 9px;
}
.r--10px {
right: 10px;
}
.r--20px {
right: 20px;
}
.r--30px {
right: 30px;
}
.r--40px {
right: 40px;
}
.r--50px {
right: 50px;
}
.r--60px {
right: 60px;
}
.r--70px {
right: 70px;
}
.r--80px {
right: 80px;
}
.r--90px {
right: 90px;
}
.r--100px {
right: 100px;
}
.r--150px {
right: 150px;
}
.r--200px {
right: 200px;
}
.r--250px {
right: 250px;
}
.r--300px {
right: 300px;
}
/* bottom
------------------------------------------------------------------- */
.b--a,
.b--auto {
bottom: auto;
}
.b--0 {
bottom: 0;
}
/* em */
.b--d25e {
bottom: 0.25em;
}
.b--d50e {
bottom: 0.50em;
}
.b--d75e {
bottom: 0.75em;
}
.b--1e {
bottom: 1em;
}
.b--2e {
bottom: 2em;
}
.b--3e {
bottom: 3em;
}
.b--4e {
bottom: 4em;
}
.b--5e {
bottom: 5em;
}
.b--6e {
bottom: 6em;
}
.b--7e {
bottom: 7em;
}
.b--8e {
bottom: 8em;
}
.b--9e {
bottom: 9em;
}
.b--10e {
bottom: 10em;
}
/* rem */
.b--d25r {
bottom: 0.25rem;
}
.b--d50r {
bottom: 0.50rem;
}
.b--d75r {
bottom: 0.75rem;
}
.b--1r {
bottom: 1rem;
}
.b--2r {
bottom: 2rem;
}
.b--3r {
bottom: 3rem;
}
.b--4r {
bottom: 4rem;
}
.b--5r {
bottom: 5rem;
}
.b--6r {
bottom: 6rem;
}
.b--7r {
bottom: 7rem;
}
.b--8r {
bottom: 8rem;
}
.b--9r {
bottom: 9rem;
}
.b--10r {
bottom: 10rem;
}
/* % */
.b--25p {
bottom: 25%;
}
.b--50p {
bottom: 50%;
}
.b--75p {
bottom: 75%;
}
.b--10p {
bottom: 10%;
}
.b--20p {
bottom: 20%;
}
.b--30p {
bottom: 30%;
}
.b--40p {
bottom: 40%;
}
.b--60p {
bottom: 60%;
}
.b--70p {
bottom: 70%;
}
.b--80p {
bottom: 80%;
}
.b--90p {
bottom: 90%;
}
.b--100p {
bottom: 100%;
}
/* vw */
.b--25vw {
bottom: 25vw;
}
.b--50vw {
bottom: 50vw;
}
.b--75vw {
bottom: 75vw;
}
.b--10vw {
bottom: 10vw;
}
.b--20vw {
bottom: 20vw;
}
.b--30vw {
bottom: 30vw;
}
.b--40vw {
bottom: 40vw;
}
.b--60vw {
bottom: 60vw;
}
.b--70vw {
bottom: 70vw;
}
.b--80vw {
bottom: 80vw;
}
.b--90vw {
bottom: 90vw;
}
.b--100vw {
bottom: 100vw;
}
/* vh */
.b--25vh {
bottom: 25vh;
}
.b--50vh {
bottom: 50vh;
}
.b--75vh {
bottom: 75vh;
}
.b--10vh {
bottom: 10vh;
}
.b--20vh {
bottom: 20vh;
}
.b--30vh {
bottom: 30vh;
}
.b--40vh {
bottom: 40vh;
}
.b--60vh {
bottom: 60vh;
}
.b--70vh {
bottom: 70vh;
}
.b--80vh {
bottom: 80vh;
}
.b--90vh {
bottom: 90vh;
}
.b--100vh {
bottom: 100vh;
}
/* px */
.b--1px {
bottom: 1px;
}
.b--2px {
bottom: 2px;
}
.b--3px {
bottom: 3px;
}
.b--4px {
bottom: 4px;
}
.b--5px {
bottom: 5px;
}
.b--6px {
bottom: 6px;
}
.b--7px {
bottom: 7px;
}
.b--8px {
bottom: 8px;
}
.b--9px {
bottom: 9px;
}
.b--10px {
bottom: 10px;
}
.b--20px {
bottom: 20px;
}
.b--30px {
bottom: 30px;
}
.b--40px {
bottom: 40px;
}
.b--50px {
bottom: 50px;
}
.b--60px {
bottom: 60px;
}
.b--70px {
bottom: 70px;
}
.b--80px {
bottom: 80px;
}
.b--90px {
bottom: 90px;
}
.b--100px {
bottom: 100px;
}
.b--150px {
bottom: 150px;
}
.b--200px {
bottom: 200px;
}
.b--250px {
bottom: 250px;
}
.b--300px {
bottom: 300px;
}
/* left
------------------------------------------------------------------- */
.l--a,
.l--auto {
left: auto;
}
.l--0 {
left: 0;
}
/* em */
.l--d25e {
left: 0.25em;
}
.l--d50e {
left: 0.50em;
}
.l--d75e {
left: 0.75em;
}
.l--1e {
left: 1em;
}
.l--2e {
left: 2em;
}
.l--3e {
left: 3em;
}
.l--4e {
left: 4em;
}
.l--5e {
left: 5em;
}
.l--6e {
left: 6em;
}
.l--7e {
left: 7em;
}
.l--8e {
left: 8em;
}
.l--9e {
left: 9em;
}
.l--10e {
left: 10em;
}
/* rem */
.l--d25r {
left: 0.25rem;
}
.l--d50r {
left: 0.50rem;
}
.l--d75r {
left: 0.75rem;
}
.l--1r {
left: 1rem;
}
.l--2r {
left: 2rem;
}
.l--3r {
left: 3rem;
}
.l--4r {
left: 4rem;
}
.l--5r {
left: 5rem;
}
.l--6r {
left: 6rem;
}
.l--7r {
left: 7rem;
}
.l--8r {
left: 8rem;
}
.l--9r {
left: 9rem;
}
.l--10r {
left: 10rem;
}
/* % */
.l--25p {
left: 25%;
}
.l--50p {
left: 50%;
}
.l--75p {
left: 75%;
}
.l--10p {
left: 10%;
}
.l--20p {
left: 20%;
}
.l--30p {
left: 30%;
}
.l--40p {
left: 40%;
}
.l--60p {
left: 60%;
}
.l--70p {
left: 70%;
}
.l--80p {
left: 80%;
}
.l--90p {
left: 90%;
}
.l--100p {
left: 100%;
}
/* vw */
.l--25vw {
left: 25vw;
}
.l--50vw {
left: 50vw;
}
.l--75vw {
left: 75vw;
}
.l--10vw {
left: 10vw;
}
.l--20vw {
left: 20vw;
}
.l--30vw {
left: 30vw;
}
.l--40vw {
left: 40vw;
}
.l--60vw {
left: 60vw;
}
.l--70vw {
left: 70vw;
}
.l--80vw {
left: 80vw;
}
.l--90vw {
left: 90vw;
}
.l--100vw {
left: 100vw;
}
/* vh */
.l--25vh {
left: 25vh;
}
.l--50vh {
left: 50vh;
}
.l--75vh {
left: 75vh;
}
.l--10vh {
left: 10vh;
}
.l--20vh {
left: 20vh;
}
.l--30vh {
left: 30vh;
}
.l--40vh {
left: 40vh;
}
.l--60vh {
left: 60vh;
}
.l--70vh {
left: 70vh;
}
.l--80vh {
left: 80vh;
}
.l--90vh {
left: 90vh;
}
.l--100vh {
left: 100vh;
}
/* px */
.l--1px {
left: 1px;
}
.l--2px {
left: 2px;
}
.l--3px {
left: 3px;
}
.l--4px {
left: 4px;
}
.l--5px {
left: 5px;
}
.l--6px {
left: 6px;
}
.l--7px {
left: 7px;
}
.l--8px {
left: 8px;
}
.l--9px {
left: 9px;
}
.l--10px {
left: 10px;
}
.l--20px {
left: 20px;
}
.l--30px {
left: 30px;
}
.l--40px {
left: 40px;
}
.l--50px {
left: 50px;
}
.l--60px {
left: 60px;
}
.l--70px {
left: 70px;
}
.l--80px {
left: 80px;
}
.l--90px {
left: 90px;
}
.l--100px {
left: 100px;
}
.l--150px {
left: 150px;
}
.l--200px {
left: 200px;
}
.l--250px {
left: 250px;
}
.l--300px {
left: 300px;
}
/*ƒ –––––––––––––––––––––––––––––––––––––– top, right, bottom, left */
/* top, right, bottom, left
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* width, height
------------------------------------------------------------------- */
.w--a,
.w--auto {
width: auto;
}
.w--0 {
width: 0;
}
/* em */
.w--d25e {
width: 0.25em;
}
.w--d50e {
width: 0.50em;
}
.w--d75e {
width: 0.75em;
}
.w--1e {
width: 1em;
}
.w--2e {
width: 2em;
}
.w--3e {
width: 3em;
}
.w--4e {
width: 4em;
}
.w--5e {
width: 5em;
}
.w--6e {
width: 6em;
}
.w--7e {
width: 7em;
}
.w--8e {
width: 8em;
}
.w--9e {
width: 9em;
}
.w--10e {
width: 10em;
}
/* rem */
.w--d25r {
width: 0.25rem;
}
.w--d50r {
width: 0.50rem;
}
.w--d75r {
width: 0.75rem;
}
.w--1r {
width: 1rem;
}
.w--2r {
width: 2rem;
}
.w--3r {
width: 3rem;
}
.w--4r {
width: 4rem;
}
.w--5r {
width: 5rem;
}
.w--6r {
width: 6rem;
}
.w--7r {
width: 7rem;
}
.w--8r {
width: 8rem;
}
.w--9r {
width: 9rem;
}
.w--10r {
width: 10rem;
}
/* % */
.w--25p {
width: 25%;
}
.w--50p {
width: 50%;
}
.w--75p {
width: 75%;
}
.w--10p {
width: 10%;
}
.w--20p {
width: 20%;
}
.w--30p {
width: 30%;
}
.w--40p {
width: 40%;
}
.w--60p {
width: 60%;
}
.w--70p {
width: 70%;
}
.w--80p {
width: 80%;
}
.w--90p {
width: 90%;
}
.w--100p {
width: 100%;
}
/* vw */
.w--25vw {
width: 25vw;
}
.w--50vw {
width: 50vw;
}
.w--75vw {
width: 75vw;
}
.w--10vw {
width: 10vw;
}
.w--20vw {
width: 20vw;
}
.w--30vw {
width: 30vw;
}
.w--40vw {
width: 40vw;
}
.w--60vw {
width: 60vw;
}
.w--70vw {
width: 70vw;
}
.w--80vw {
width: 80vw;
}
.w--90vw {
width: 90vw;
}
.w--100vw {
width: 100vw;
}
/* vh */
.w--25vh {
width: 25vh;
}
.w--50vh {
width: 50vh;
}
.w--75vh {
width: 75vh;
}
.w--10vh {
width: 10vh;
}
.w--20vh {
width: 20vh;
}
.w--30vh {
width: 30vh;
}
.w--40vh {
width: 40vh;
}
.w--60vh {
width: 60vh;
}
.w--70vh {
width: 70vh;
}
.w--80vh {
width: 80vh;
}
.w--90vh {
width: 90vh;
}
.w--100vh {
width: 100vh;
}
/* px */
.w--1px {
width: 1px;
}
.w--2px {
width: 2px;
}
.w--3px {
width: 3px;
}
.w--4px {
width: 4px;
}
.w--5px {
width: 5px;
}
.w--6px {
width: 6px;
}
.w--7px {
width: 7px;
}
.w--8px {
width: 8px;
}
.w--9px {
width: 9px;
}
.w--10px {
width: 10px;
}
.w--20px {
width: 20px;
}
.w--30px {
width: 30px;
}
.w--40px {
width: 40px;
}
.w--50px {
width: 50px;
}
.w--60px {
width: 60px;
}
.w--70px {
width: 70px;
}
.w--80px {
width: 80px;
}
.w--90px {
width: 90px;
}
.w--100px {
width: 100px;
}
.w--150px {
width: 150px;
}
.w--200px {
width: 200px;
}
.w--250px {
width: 250px;
}
.w--300px {
width: 300px;
}
/* height
------------------------------------------------------------------- */
.h--a,
.h--auto {
height: auto;
}
.h--0 {
height: 0;
}
/* em */
.h--d25e {
height: 0.25em;
}
.h--d50e {
height: 0.50em;
}
.h--d75e {
height: 0.75em;
}
.h--1e {
height: 1em;
}
.h--2e {
height: 2em;
}
.h--3e {
height: 3em;
}
.h--4e {
height: 4em;
}
.h--5e {
height: 5em;
}
.h--6e {
height: 6em;
}
.h--7e {
height: 7em;
}
.h--8e {
height: 8em;
}
.h--9e {
height: 9em;
}
.h--10e {
height: 10em;
}
/* rem */
.h--d25r {
height: 0.25rem;
}
.h--d50r {
height: 0.50rem;
}
.h--d75r {
height: 0.75rem;
}
.h--1r {
height: 1rem;
}
.h--2r {
height: 2rem;
}
.h--3r {
height: 3rem;
}
.h--4r {
height: 4rem;
}
.h--5r {
height: 5rem;
}
.h--6r {
height: 6rem;
}
.h--7r {
height: 7rem;
}
.h--8r {
height: 8rem;
}
.h--9r {
height: 9rem;
}
.h--10r {
height: 10rem;
}
/* % */
.h--25p {
height: 25%;
}
.h--50p {
height: 50%;
}
.h--75p {
height: 75%;
}
.h--10p {
height: 10%;
}
.h--20p {
height: 20%;
}
.h--30p {
height: 30%;
}
.h--40p {
height: 40%;
}
.h--60p {
height: 60%;
}
.h--70p {
height: 70%;
}
.h--80p {
height: 80%;
}
.h--90p {
height: 90%;
}
.h--100p {
height: 100%;
}
/* vw */
.h--25vw {
height: 25vw;
}
.h--50vw {
height: 50vw;
}
.h--75vw {
height: 75vw;
}
.h--10vw {
height: 10vw;
}
.h--20vw {
height: 20vw;
}
.h--30vw {
height: 30vw;
}
.h--40vw {
height: 40vw;
}
.h--60vw {
height: 60vw;
}
.h--70vw {
height: 70vw;
}
.h--80vw {
height: 80vw;
}
.h--90vw {
height: 90vw;
}
.h--100vw {
height: 100vw;
}
/* vh */
.h--25vh {
height: 25vh;
}
.h--50vh {
height: 50vh;
}
.h--75vh {
height: 75vh;
}
.h--10vh {
height: 10vh;
}
.h--20vh {
height: 20vh;
}
.h--30vh {
height: 30vh;
}
.h--40vh {
height: 40vh;
}
.h--60vh {
height: 60vh;
}
.h--70vh {
height: 70vh;
}
.h--80vh {
height: 80vh;
}
.h--90vh {
height: 90vh;
}
.h--100vh {
height: 100vh;
}
/* px */
.h--1px {
height: 1px;
}
.h--2px {
height: 2px;
}
.h--3px {
height: 3px;
}
.h--4px {
height: 4px;
}
.h--5px {
height: 5px;
}
.h--6px {
height: 6px;
}
.h--7px {
height: 7px;
}
.h--8px {
height: 8px;
}
.h--9px {
height: 9px;
}
.h--10px {
height: 10px;
}
.h--20px {
height: 20px;
}
.h--30px {
height: 30px;
}
.h--40px {
height: 40px;
}
.h--50px {
height: 50px;
}
.h--60px {
height: 60px;
}
.h--70px {
height: 70px;
}
.h--80px {
height: 80px;
}
.h--90px {
height: 90px;
}
.h--100px {
height: 100px;
}
.h--150px {
height: 150px;
}
.h--200px {
height: 200px;
}
.h--250px {
height: 250px;
}
.h--300px {
height: 300px;
}
/*ƒ ––––––––––––––––––––––––––––––––––––––––––––––––– width, height */
/* text-indent
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
.ti--0 {
text-indent: 0;
}
.ti--n {
text-indent: -9999px;
}
/* em */
.ti--d25e {
text-indent: 0.25em;
}
.ti--d50e {
text-indent: 0.50em;
}
.ti--d75e {
text-indent: 0.75em;
}
.ti--1e {
text-indent: 1em;
}
.ti--2e {
text-indent: 2em;
}
.ti--3e {
text-indent: 3em;
}
.ti--4e {
text-indent: 4em;
}
.ti--5e {
text-indent: 5em;
}
.ti--6e {
text-indent: 6em;
}
.ti--7e {
text-indent: 7em;
}
.ti--8e {
text-indent: 8em;
}
.ti--9e {
text-indent: 9em;
}
.ti--10e {
text-indent: 10em;
}
.ti--nd25e {
text-indent: -0.25em;
}
.ti--nd50e {
text-indent: -0.50em;
}
.ti--nd75e {
text-indent: -0.75em;
}
.ti--n1e {
text-indent: -1em;
}
.ti--n2e {
text-indent: -2em;
}
.ti--n3e {
text-indent: -3em;
}
.ti--n4e {
text-indent: -4em;
}
.ti--n5e {
text-indent: -5em;
}
.ti--n6e {
text-indent: -6em;
}
.ti--n7e {
text-indent: -7em;
}
.ti--n8e {
text-indent: -8em;
}
.ti--n9e {
text-indent: -9em;
}
.ti--n10e {
text-indent: -10em;
}
/*ƒ ––––––––––––––––––––––––––––––––––––––––––––––––––– text-indent */
/* word-spacing
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
.wos--0 {
word-spacing: 0;
}
.wos--n {
word-spacing: -9999px;
}
/* em */
.wos--d25e {
word-spacing: 0.25em;
}
.wos--d50e {
word-spacing: 0.50em;
}
.wos--d75e {
word-spacing: 0.75em;
}
.wos--1e {
word-spacing: 1em;
}
.wos--2e {
word-spacing: 2em;
}
.wos--3e {
word-spacing: 3em;
}
.wos--4e {
word-spacing: 4em;
}
.wos--5e {
word-spacing: 5em;
}
.wos--6e {
word-spacing: 6em;
}
.wos--7e {
word-spacing: 7em;
}
.wos--8e {
word-spacing: 8em;
}
.wos--9e {
word-spacing: 9em;
}
.wos--10e {
word-spacing: 10em;
}
.wos--nd25e {
word-spacing: -0.25em;
}
.wos--nd50e {
word-spacing: -0.50em;
}
.wos--nd75e {
word-spacing: -0.75em;
}
.wos--n1e {
word-spacing: -1em;
}
.wos--n2e {
word-spacing: -2em;
}
.wos--n3e {
word-spacing: -3em;
}
.wos--n4e {
word-spacing: -4em;
}
.wos--n5e {
word-spacing: -5em;
}
.wos--n6e {
word-spacing: -6em;
}
.wos--n7e {
word-spacing: -7em;
}
.wos--n8e {
word-spacing: -8em;
}
.wos--n9e {
word-spacing: -9em;
}
.wos--n10e {
word-spacing: -10em;
}
/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––– word-spacing */
/* oppacity
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
.op--0 {
opacity: 0;
}
.op--d1 {
opacity: 0.1;
}
.op-d2 {
opacity: 0.2;
}
.op--d3 {
opacity: 0.3;
}
.op--d4 {
opacity: 0.4;
}
.op--d5 {
opacity: 0.5;
}
.op--d6 {
opacity: 0.6;
}
.op--d7 {
opacity: 0.7;
}
.op--d8 {
opacity: 0.8;
}
.op--d9 {
opacity: 0.9;
}
.op--1 {
opacity: 1;
}
/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––––––– oppacity */
/* border-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* px */
.bdw--1px {
border-width: 1px;
}
.bdw--2px {
border-width: 2px;
}
.bdw--3px {
border-width: 3px;
}
.bdw--4px {
border-width: 4px;
}
.bdw--5px {
border-width: 5px;
}
.bdw--6px {
border-width: 6px;
}
.bdw--7px {
border-width: 7px;
}
.bdw--8px {
border-width: 8px;
}
.bdw--9px {
border-width: 9px;
}
.bdw--10px {
border-width: 10px;
}
.bdw--20px {
border-width: 20px;
}
.bdw--30px {
border-width: 30px;
}
.bdw--40px {
border-width: 40px;
}
.bdw--50px {
border-width: 50px;
}
.bdw--60px {
border-width: 60px;
}
.bdw--70px {
border-width: 70px;
}
.bdw--80px {
border-width: 80px;
}
.bdw--90px {
border-width: 90px;
}
.bdw--100px {
border-width: 100px;
}
.bdw--150px {
border-width: 150px;
}
.bdw--200px {
border-width: 200px;
}
.bdw--250px {
border-width: 250px;
}
.bdw--300px {
border-width: 300px;
}
.bdtw--1px {
border-top-width: 1px;
}
/* border-top-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* px */
.bdtw--1px {
border-top-width: 1px;
}
.bdtw--2px {
border-top-width: 2px;
}
.bdtw--3px {
border-top-width: 3px;
}
.bdtw--4px {
border-top-width: 4px;
}
.bdtw--5px {
border-top-width: 5px;
}
.bdtw--6px {
border-top-width: 6px;
}
.bdtw--7px {
border-top-width: 7px;
}
.bdtw--8px {
border-top-width: 8px;
}
.bdtw--9px {
border-top-width: 9px;
}
.bdtw--10px {
border-top-width: 10px;
}
.bdtw--20px {
border-top-width: 20px;
}
.bdtw--30px {
border-top-width: 30px;
}
.bdtw--40px {
border-top-width: 40px;
}
.bdtw--50px {
border-top-width: 50px;
}
.bdtw--60px {
border-top-width: 60px;
}
.bdtw--70px {
border-top-width: 70px;
}
.bdtw--80px {
border-top-width: 80px;
}
.bdtw--90px {
border-top-width: 90px;
}
.bdtw--100px {
border-top-width: 100px;
}
.bdtw--150px {
border-top-width: 150px;
}
.bdtw--200px {
border-top-width: 200px;
}
.bdtw--250px {
border-top-width: 250px;
}
.bdtw--300px {
border-top-width: 300px;
}
/* border-right-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* px */
.bdrw--1px {
border-right-width: 1px;
}
.bdrw--2px {
border-right-width: 2px;
}
.bdrw--3px {
border-right-width: 3px;
}
.bdrw--4px {
border-right-width: 4px;
}
.bdrw--5px {
border-right-width: 5px;
}
.bdrw--6px {
border-right-width: 6px;
}
.bdrw--7px {
border-right-width: 7px;
}
.bdrw--8px {
border-right-width: 8px;
}
.bdrw--9px {
border-right-width: 9px;
}
.bdrw--10px {
border-right-width: 10px;
}
.bdrw--20px {
border-right-width: 20px;
}
.bdrw--30px {
border-right-width: 30px;
}
.bdrw--40px {
border-right-width: 40px;
}
.bdrw--50px {
border-right-width: 50px;
}
.bdrw--60px {
border-right-width: 60px;
}
.bdrw--70px {
border-right-width: 70px;
}
.bdrw--80px {
border-right-width: 80px;
}
.bdrw--90px {
border-right-width: 90px;
}
.bdrw--100px {
border-right-width: 100px;
}
.bdrw--150px {
border-right-width: 150px;
}
.bdrw--200px {
border-right-width: 200px;
}
.bdrw--250px {
border-right-width: 250px;
}
.bdrw--300px {
border-right-width: 300px;
}
/* border-bottom-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* px */
.bdbw--1px {
border-bottom-width: 1px;
}
.bdbw--2px {
border-bottom-width: 2px;
}
.bdbw--3px {
border-bottom-width: 3px;
}
.bdbw--4px {
border-bottom-width: 4px;
}
.bdbw--5px {
border-bottom-width: 5px;
}
.bdbw--6px {
border-bottom-width: 6px;
}
.bdbw--7px {
border-bottom-width: 7px;
}
.bdbw--8px {
border-bottom-width: 8px;
}
.bdbw--9px {
border-bottom-width: 9px;
}
.bdbw--10px {
border-bottom-width: 10px;
}
.bdbw--20px {
border-bottom-width: 20px;
}
.bdbw--30px {
border-bottom-width: 30px;
}
.bdbw--40px {
border-bottom-width: 40px;
}
.bdbw--50px {
border-bottom-width: 50px;
}
.bdbw--60px {
border-bottom-width: 60px;
}
.bdbw--70px {
border-bottom-width: 70px;
}
.bdbw--80px {
border-bottom-width: 80px;
}
.bdbw--90px {
border-bottom-width: 90px;
}
.bdbw--100px {
border-bottom-width: 100px;
}
.bdbw--150px {
border-bottom-width: 150px;
}
.bdbw--200px {
border-bottom-width: 200px;
}
.bdbw--250px {
border-bottom-width: 250px;
}
.bdbw--300px {
border-bottom-width: 300px;
}
/* border-left-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */
/* px */
.bdlw--1px {
border-left-width: 1px;
}
.bdlw--2px {
border-left-width: 2px;
}
.bdlw--3px {
border-left-width: 3px;
}
.bdlw--4px {
border-left-width: 4px;
}
.bdlw--5px {
border-left-width: 5px;
}
.bdlw--6px {
border-left-width: 6px;
}
.bdlw--7px {
border-left-width: 7px;
}
.bdlw--8px {
border-left-width: 8px;
}
.bdlw--9px {
border-left-width: 9px;
}
.bdlw--10px {
border-left-width: 10px;
}
.bdlw--20px {
border-left-width: 20px;
}
.bdlw--30px {
border-left-width: 30px;
}
.bdlw--40px {
border-left-width: 40px;
}
.bdlw--50px {
border-left-width: 50px;
}
.bdlw--60px {
border-left-width: 60px;
}
.bdlw--70px {
border-left-width: 70px;
}
.bdlw--80px {
border-left-width: 80px;
}
.bdlw--90px {
border-left-width: 90px;
}
.bdlw--100px {
border-left-width: 100px;
}
.bdlw--150px {
border-left-width: 150px;
}
.bdlw--200px {
border-left-width: 200px;
}
.bdlw--250px {
border-left-width: 250px;
}
.bdlw--300px {
border-left-width: 300px;
}
/*ƒ –––––––––––––––––––––––––––––––––––––––– primer-emmet-parameter */
--
(double-hiphen)にしているのは、一応競合防止と、
(※例えば『Bootstrap』のm-0
もmargin: 0;
で、
『Emmet』なら競合しても大きく問題出ないような気がしますが)
自分の場合は若干コードをわかりやすくするために、
element .class-property
(※種類・属性。主に .(dot) の代わり) と、
element .class--value
(※値。主に : (colon) 、= (equal) の代わり)
で分類しようとしているのが理由です。以上です。