@font-face { 
	font-family: 'OpenSans-Bold';
	src: url('../fonts/OpenSans-Bold.ttf') format('truetype');
}

@font-face { 
	font-family: 'OpenSans-Regular';
	src: url('../fonts/OpenSans-Regular.ttf') format('truetype');
}

@font-face { 
	font-family: 'OpenSans-Semibold';
	src: url('../fonts/OpenSans-Semibold.ttf') format('truetype');
}

body, html {
  /* important */
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

#bg {
	width: calc(100vw - 60px);
	height: calc(100vh - 90px);
	top: 60px;
	left: 30px;
	margin: 0;
	overflow: hidden;
	position: fixed !important;
	position: absolute;
	top: calc(expression(documentElement.scrollTop) + 60px);
}

img.bg {
	height: calc(100vh - 90px);
	left: 30px;
	margin: 0;
	top: 60px;
}

.fixed-bg {
  position: relative;
  min-height: 100%;
  display: none;
}

.fixed-bg h1 {
  position: absolute;
  left: 50vw;
  top: 40vh;
  font-size: 2vw;
  font-family: OpenSans-Semibold;
  color: #30494B;
}

.green { color: #8aaf6b; }