body, html {
	margin:0;
	padding:0;
	height:100%;
	font-family:Arial, sans-serif;
	color:#fff;
	font-size: calc(14px + (16 - 14) * ((100vw - 300px) / (1600 - 300)));
}
a {
	color:#fff;
}
a:hover {
	color:#ccc;
}
#container {
	min-height:100%;
	position:relative;
	background-color:#000;
}
#header {
	width:100%;
	padding: 30px 0 ;
	color:#fff;
	text-align:center;
	margin:0;
}
#header-heading {
	display:inline-block;
	border-bottom: 1px solid #fff;
	margin-bottom:1em;
}
#content {
	padding-bottom:300px; /* Height of the footer */
}
#column {
	max-width:800px;
	margin:0 auto;
}
#section-dark {
	background-color:#111;
	padding:3em;
}
#section-black {
	background-color:#000;
	padding:3em;
}
#section-light {
	background-color:#1f1f1f;
	padding:3em;
}
#footer {
	position:absolute;
	bottom:0;
	width:100%;
	height:100px;   /* Height of the footer */
	background-color:#000;
	padding:50px 3em 150px 3em;
	text-align:center;
}
.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  margin:0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.description {
	padding:1em;
	background-color:#1f1f1f;
	margin:0;
	text-align:center;
}
.column-3 {
	display:inline-block;
	width:33%;
	margin-bottom:0em;
}
.column-2 {
	display:inline-block;
	width:45%;
	margin-bottom:0em;
	margin-right:2em;
	vertical-align:top;
}
@media screen and (max-width: 800px) {
	.column-2 {display:block; width:100%;}
	.column-3 {width:45%;}
}

h1 {
	display:block;
	font-weight:bold;
	font-size: calc(20px + (30 - 20) * ((100vw - 300px) / (1600 - 300)));
	margin:0 0 0.5em 0;
}

h2 {
	display:inline-block;
	font-weight:bold;
	font-size: calc(16px + (21 - 16) * ((100vw - 300px) / (1600 - 300)));
	font-family: "Arial Narrow", Arial, sans-serif;
	margin:0 0 1.5em 0;
	padding:0 0 0.5em 0;
	text-align:center;
	border-bottom: 1px solid #fff;
	color:#fff;
}
#footer h2 {
	margin:0 0 0.5em 0;
}
h3 {
	margin-top:2em;
}
.heading {
	width:100%;
	text-align:center;
}
img {
	width:100%;
	margin-bottom:0.1em;
}
.heading img {
	margin-bottom:2em;
}
.image-hover-highlight {
    -webkit-transition: all 0.10s;
    transition: all 0.10s;
    &:hover {
        border: 0px solid gray;
        filter: brightness(150%);
        -webkit-filter: brightness(150%);
        -moz-filter: brightness(150%);
        -o-filter: brightness(150%);
        -ms-filter: brightness(150%);
        -webkit-transition: all 0.50s;
        transition: all 0.10s;
		cursor:pointer;
    }
}
#paragraph, #paragraph-center, #ingress, #paragraph-video ul {
	line-height:1.5em;
	font-family:Arial;
}
#ingress {
	font-weight:bold;
	font-size:  calc(16px + (18 - 16) * ((100vw - 300px) / (1600 - 300)));
}
#paragraph-center {
	text-align:center;
}
#paragraph-video {
	margin-bottom:2em;
}
@media screen and (min-width: 800px) {
	#header-title {font-size:26px;}
	h2 {font-size:22px;}
}
figcaption {
	font-size: calc(10px + (12 - 10) * ((100vw - 300px) / (1600 - 300)));
	font-style: italic;
}
#menu {
	margin:1em 1em 0 1em;
}
#menu a {
	display:inline-block;
	font-weight:bold;
	padding:0 1% 0 1%;
	vertical-align:center;
	text-align:center;
	text-decoration:none;
	line-height:1em;
	border-right:1px solid #999;
}
#menu a:last-child {
	border-right:0;
}
#menu a:hover {
	text-decoration:underline;
	cursor:pointer;
}
@media screen and (max-width: 347px) {
	#menu a {
		display:block;
		line-height:2em;
	}
	#menu {
		margin:0.5em 1em 0 1em;
	}

}
.no-underline {
	text-decoration:none;
}
.image-grid {
	font-size: calc(10px + (12 - 10) * ((100vw - 300px) / (1600 - 300)));
}