:root {
    --tn-text: 15px;
    --sm-text: 16px;
    --md-text: 18px;
    --lg-text: 34px;

    --_p: 15%;

    --general-pad: 100px var(--_p);
    --general-sm-pad: 100px var(--_p);
    --large-pad: 120px 33%;
    --narrow-top-pad: 50px var(--_p) 100px var(--_p);
    --sm-narrow-top-pad: 50px var(--_p) 100px var(--_p);
    --sm-pad: 15px var(--_p);

    --error-color: 245, 33, 33;

    --head: #272830;
    --color: #f5f5f5;
    --accent: #cd4b31;
    --accent-dark: #841f0c;
    --accent-light: #c55742;
    --lgrey: #f2f2f3;
    --text-grey: #737377;
    --dgrey: #d3d3d4;
    --blue: #272830;
}

.sm-text {
    font-size: var(--sm-text);
}

body [accent] {
    color: var(--accent);
}

a[accent] {
    color: var(--accent) !important;
    text-decoration: none;
}

a[accent]:hover {
    text-decoration: underline;
}

body section {
    font-size: var(--md-text);
}

section[break-after], section[break], .break {
    margin-bottom: 80px;
}

section.break-before-except-desktop, section.break-except-desktop {
    margin-top: 80px;
}

section[break-before], section[break] {
    margin-top: 80px;
}

.mid-break {
    margin-bottom: -20px;
    margin-top: 55px;
}


.md-text {
    font-size: var(--md-text);
}

.sm-pad {
    padding: var(--sm-pad);
}

.general-sm-pad {
    padding: var(--general-sm-pad);
}

.sm-narrow-top-pad {
    padding: var(--sm-narrow-top-pad) !important;
}

.uppercase {
    text-transform: uppercase;
}

body {

    display: block;
    background: white !important;
}

a {
    text-decoration: none;
    cursor: pointer;
}

[block] {
    padding: 0px 20%;
}

[cap] {
    text-transform: capitalize;
}

[upper] {
    text-transform: uppercase;
}

[small] {
    font-size: var(--tn-text);
}

[relative] {
    position: relative;
}

.no-a {
    text-decoration: none;
    color: inherit;
}

a[revert] {
    text-decoration: none;
    color: inherit;
}

hr[clean] {
    border: none;
    height: 2px;
    background: white;
}

[flr] {
    float: right;
}

[align-right] {
    text-align: right;
}

.blue hr[clean] {
    background: #b6b9cf;
}

body, [basefont] {
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
}

h1, h2, h3, .title, [title] {
    font-family: 'Libre Baskerville', serif;
    color: var(--accent-dark);
    font-weight: 600 !important;
}

h1 {
    font-size: 1.85em !important;
    margin-bottom: 1rem !important;
}


h2 {
    font-size: 1.35em !important;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    font-weight: 600 !important;

}

span[vertical] {
    color: var(--accent);
    margin: 0 4px;
}

button, input[type="submit"], input[type="reset"] {
    background: var(--accent);
    text-transform: uppercase !important;
    padding: 9px 20px;
    border: none;
    font-weight: 500;
    color: white;
    font-size: smaller !important;
    transition: .2s all;
}

button:hover {
    background: var(--accent-light);
}

button[disabled][outlined], button[disabled][outlined]:hover {
    border-color: #666;
    color: #666;
    background: transparent !important;
}

button[outlined],  input[type="reset"] {
    padding: 6px 17px;
    border: 3px solid var(--accent);
    background: transparent;
    color: var(--accent);

}

button[outlined]:hover {
    color: white;
    background: var(--accent);
}

button[small] {
    padding: 3px 8px;
    border-width: 1px !important;
}

section {
    padding: 0 calc(var(--_p));
    background: white;
}

.reset-pad-left {
    padding-left: 0 !important;
}

.reset-pad-right {
    padding-right: 0 !important;
}

sup {
    top: 0 !important;
}


.blue {
    background: var(--blue);
    color: white;
}

.blue h1 {
    color: white;
    font-weight: 400;
}


.grey {
    text-transform: uppercase;
    text-decoration: none;
    color: var(--text-grey);
    font-weight: 500;
}

a.grey:hover {
    text-decoration: underline;
    color: #444;
}

.w-6 {
    width: calc(100% / 12 * 6);
    max-width: 600px;
}

.w-7 {
    width: calc(100% / 12 * 7);
}

.color-accent-light {
    color: var(--accent-light);
}

.row-center {
    align-items: center;
}

.row-flex-end {
    align-items: flex-end;
}

.absolute-footer footer[block] {
    position: absolute;
}

.overflow-hidden {
    overflow: hidden;
}


[tame] {
    max-width: 1340px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.center {
    text-align: center;
}

.center-layout {
    margin: 0 auto;
    width: max-content;
}