* {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  margin:0;
  padding:0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  background-color: #eeeeee;
}

header {
  padding:1rem;
  padding-top:2rem;
  padding-bottom:3rem;
}

header h1 {
  font-weight: 400;
  font-size: 2rem;
}

main {
  padding-top:2rem;
  padding-bottom:4rem;
}

footer {
  padding:1rem;
  min-height:25vh;
}

footer p {
  font-size: 1rem;
  color:#333333;
  padding-top:1rem;
  max-width:32rem;
}


.bounds {
  width:100%;
  max-width:84rem;
  margin:auto;
}

.divider {
  width:100%;
  border-top:1px solid black;
}

.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

/* 3 columns layout */
.row > * {
  width: calc(100% / 3);
  color:#333333;
}

.col h2 {
  color:#333333;
  font-size: 2rem;
  font-weight: 400;
  padding-top:1rem;
}

.col p {
  margin-top:1rem;
  margin-right:1rem;
  margin-bottom:1rem;
}

figure {
  margin:0;
  padding: 1rem;
}

img {
  width: 100%;
  display: block;
}


@media (orientation: portrait) {
  .row > * {
    width: 100%;
  }
}