/* ----------- Turn off some lab.css ----------- */
h1 {
  background-color: transparent;
  padding: 0;
}

/* ----------- Layout for header elements ----------- */
body, header nav {
  margin: 0;
  padding: 0;
}

header {
  position: fixed;
  z-index: 10;
  left: 0;
  right: 0;
  padding: 1.25em 5vw;
}
header.small {
  padding: 0.75em 5vw;
}
/* header {
  transition: all 1s;
} -- makes img wiggle */
.main {
  position: fixed;
  overflow: auto;
  left: 0;
  right: 0;
  bottom: 0;
  top: 3em;	/* assumes fixed header doesn't wrap; 2*0.75 + 1.6 - fudge em */
}
@media only screen and (max-device-width: 1024px) {	/* incl. 'fixed' buggy on ios8.1 */
  header, .main {
    position: static;
    overflow: visible;
  }
}

/* ----------- Other Layout ----------- */
h1, .flex-wrapper h2 {
  margin-top: 0;
}
h1, h2, h3, h4, h5, h6 {
  margin-bottom: 0;
}

/* @@ redo this section: */
.home {
  padding: 2em 10vw 1em 10vw;
}
section {
  padding: 0 5vw;
}
.flex-wrapper > div:not(#model) {
  max-width: 23em;
}
.flex-wrapper.cols3 > div:not(#model) {
  max-width: 14em;
}
.flex-wrapper > * {	/* flex item margins don't collapse, incl. need gutters between rows */
  margin: 1rem;
}
.flex-wrapper {
  padding: 1rem;
}
.flex-wrapper.cols3 > * {
  margin: 0.5rem;
  padding: 0 1em;
}
.flex-wrapper.cols3 {
  padding: 0.5rem;
}
.alg1-free {
	margin: 1rem 0 2rem 0;
}

#model {
  width: 465px;
  overflow: auto;
  padding: 4px;
  font-size: 0.9rem;
}

#model, img, iframe {
  max-width: 100%;
}

/* ----------- Typography ----------- */
body {
  font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6, .slogan, .h3-normal, .home, .alg1-free {
  text-align: center;
}
h1 img {
  height: 6rem;
  vertical-align: middle;
}
.slogan {
  font-family: Neuton, serif;
  font-weight: bold;
  font-size: 2.5rem;
}
.home {
  font-size: 1.25em;
}
.h3-normal {
  font-size: 1.17em;
}
.alg1-free {
  font-size: 1.333em;
}
.cta {
  font-style: italic;
}

/* ----------- Colors & Backgrounds ----------- */
body				{ background: white }
.dark				{ background: #00BBFF; color: white }
						/* #00BBFF hsl(196, 100%, 50%) in our logo */
#model				{ color: black }
.dark a:link		{ color: hsl(60, 80%, 80%); font-weight: bold }
						/* default #0000EE hsl(240, 100%, 47%) lum 41% */
.dark a:visited		{ color: hsl(40, 60%, 85%); font-weight: bold }
						/* default #551A8B hsl(271, 68%, 32%) lum 31% */
.dark a:active		{ color: #EE0000; font-weight: bold }
						/* default #EE0000 hsl(0, 100%, 47%) lum 50% */
