Fonts.css

fonts.css

/* 
** Vertical rhythm made with Gridlover
** https://www.gridlover.net/try
**
** CSS antialiasing cheatsheet from:
** https://devhints.io/css-antialias
*/

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

html {
    font-size: 18px;
    line-height: 27px;
}

body {
    font-size: 1rem;
    line-height: 1.5rem;
}

h1,
.h1 {
    font-size: 2.7222222rem;
    line-height: 3rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    font-size: 1.9444444rem;
    line-height: 3rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

p,
ul,
ol,
pre,
table,
blockquote {
    margin-top: 0rem;
    margin-bottom: 1.5rem;
}

blockquote {
    border-left: 2px solid;
    padding-left: 1rem;
    padding-top: .5rem;
    padding-bottom: .5rem;
}

ul ul,
ol ol,
ul ol,
ol ul {
    margin-top: 0rem;
    margin-bottom: 0rem;
}

hr,
.hr {
    border: 1px solid;
    margin: -1px 0;
    margin-bottom: 1.5rem;
}

a,
b,
i,
strong,
em,
small,
code {
    line-height: 0;
}

sub,
sup {
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

ins {
    position: relative;
    text-decoration: none;
}

ins::before {
    position: absolute;
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    bottom: 0;
    margin-top: -1px;
    background-color: black;
    left: 0;
}

del {
    position: relative;
    text-decoration: none;
}

del::before {
    position: absolute;
    content: '';
    display: block;
    width: 110%;
    height: 2px;
    top: 50%;
    margin-top: -1px;
    background-color: black;
    left: -5%;
}