scaffolding.scss

//sass-lint:disable single-line-per-selector, no-vendor-prefixes, no-color-literals
// Reset
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  font-family: inherit;
  font-size: 100%;
  font-style: inherit;
  font-weight: inherit;
  margin: 0;
  outline: 0;
  padding: 0;
  vertical-align: baseline;
}

* {
  box-sizing: inherit;

  &::before,
  &::after {
    box-sizing: inherit;
  }
}

html {
  font-size: 10px;
  box-sizing: border-box;
}

body {
  font-family: 'Arial', sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.618;

  background-color: #FFFFFF;
  margin: 0;
  padding: 0;
}

h1 {
  font-size: 3.5rem;
}

h2 {
  font-size: 2.5rem;
}

h3 {
  font-size: 2rem;
}

h4 {
  font-size: 1.5rem;
}

h5 {
  font-size: 1.2rem;
}

h6 {
  font-size: 0.8rem;
}

a {
  text-decoration: none;
  outline: 0;

  &:hover,
  &:focus,
  &:active {
    text-decoration: none;
    outline: 0;
  }
}

ul {
  padding: 0;
}

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  outline: 0;
}

input,
textarea {
  border: 1px solid #DDDDDD;
  border-radius: 3px;
  padding: 0.5rem 0 0.5rem 0.8rem;
  line-height: normal;

  &::-ms-input-placeholder,
  &:-ms-input-placeholder {
    color: #555555;
  }
}

figure {
  margin: 0;
}

// This hides focus around selected option in FF and native dropdown button arrow in IE
select {
  &::-ms-expand {
    display: none;
  }

  &:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000000;
  }
}

iframe {
  border: 0;
  width: 100%;
  min-height: 80vh;

  body {
    margin: 0;
  }
}

.navbar {
  height: 8rem;
}

li {
  list-style: none;
}

button {
  outline: none;
}

blockquote {
  border: 0;
}

// Correct `block` display not defined for any HTML5 element in IE
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

// Correct `inline-block` display not defined in IE 8/9.
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

// Prevent modern browsers from displaying `audio` without controls.
audio {
  &:not([controls]) {
    display: none;
    height: 0;
  }
}

// Address `[hidden]` styling not present in IE 8/9/10.
[hidden],
template {
  display: none;
}

// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
b,
strong {
  font-weight: bold;
}

// Address styling not present in Safari and Chrome.
dfn {
  font-style: italic;
}

// Address inconsistent and variable font size in all browsers.
small {
  font-size: 80%;
}

// Prevent `sub` and `sup` affecting `line-height` in all browsers.
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

// Remove border when inside `a` element in IE 8/9/10.
img {
  border: 0;
}

// Correct overflow not hidden in IE 9/10/11.
svg {
  &:not(:root) {
    overflow: hidden;
  }
}

// Remove most spacing between table cells.
table {
  border-collapse: collapse;
  border-spacing: 0;

  td,
  th {
    padding: 0;
  }
}