$main-overflow: hidden !default;
$section-padding-desktop: 2rem 0 !default;
$section-padding-mobile: 1rem 0 !default;

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

main { overflow: $main-overflow; }

section {
  padding: $section-padding-mobile;

  @media (min-width: $large) {
    padding: $section-padding-desktop;
  }
}

a {
  color: inherit;
  text-decoration: none;
  transition: 300ms;
}

ul,
ol {
  &.no-style { list-style-type: none; }
  &.circle { list-style-type: circle; }
  &.square { list-style-type: square; }
  &.upper-roman { list-style-type: upper-roman; }
  &.lower-alpha { list-style-type: lower-alpha; }
}

img {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}