@font-face {
  font-family: "oswald";
  src: url("/fonts/oswald/oswald-regular.ttf") format("truetype");
	font-weight: 500;
}
@font-face {
  font-family: "oswald";
  src: url("/fonts/oswald/oswald-medium.ttf") format("truetype");
	font-weight: 600;
}@font-face {
	font-family: "oswald";
	src: url("/fonts/oswald/oswald-semibold.ttf") format("truetype");
	font-weight: 700;
}
@font-face {
	font-family: "oswald";
	src: url("/fonts/oswald/oswald-bold.ttf") format("truetype");
	font-weight: 900;
}

@font-face {
  font-family: "heebo";
  src: url("/fonts/heebo/heebo-regular.ttf") format("truetype");
	font-weight: 400;
}
@font-face {
  font-family: "heebo";
  src: url("/fonts/heebo/heebo-medium.ttf") format("truetype");
	font-weight: 400;
}@font-face {
	font-family: "heebo";
	src: url("/fonts/heebo/heebo-semibold.ttf") format("truetype");
	font-weight: 600;
}
@font-face {
	font-family: "heebo";
	src: url("/fonts/heebo/heebo-bold.ttf") format("truetype");
	font-weight: 700;
}

body {
	margin: 0 auto;
	max-width: 60em;
	font-family: sans-serif;
	color: #333333;

  /* Location of the image */
  /* background-image: url(/images/manuela-fersen-start-love.jpg); */

  /* Background image is centered vertically and horizontally at all times */
  background-position: center center;

  /* Background image doesn't tile */
  background-repeat: no-repeat;

  /* Background image is fixed in the viewport so that it doesn't move when
     the content's height is greater than the image's height */
  background-attachment: fixed;

  /* This is what makes the background image rescale based
     on the container's size */
  background-size: cover;

  /* Set a background color that will be displayed
     while the background image is loading */
  background-color: #464646;

  /* Animate the background */
  animation-name: fersen_background;
  animation-duration: 18s;
  animation-iteration-count: infinite;
}

@keyframes fersen_background {
   0% {
     background-image: url(/images/art-lab-start-1.jpg);
   }
  20% {
     background-image: url(/images/art-lab-start-3.jpg);
   }
  40% {
     background-image: url(/images/art-lab-start-4.jpg);
   }
  60% {
     background-image: url(/images/art-lab-start-7.jpg);
   }
  80% {
     background-image: url(/images/art-lab-start-10.jpg);
   }
  100% {
     background-image: url(/images/art-lab-start-1.jpg);
   }
}

::-webkit-scrollbar {
    height: 12px;
    width: 6px;
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #c5d5c5;
    -webkit-border-radius: 1ex;
}

::-webkit-scrollbar-corner {
    background: #000;
}

.scroller {
  /*width: 300px;
  height: 100px;*/
  overflow-y: scroll;
  scrollbar-color: #c5d5c5 transparent;
  scrollbar-width: normal;
}

.statement {
		position: fixed;
		top: 80px;
		margin: 0px 20px 0px 20px;
		max-width: 600px;
		height: 140px;
		color: #333;
		overflow: auto;
		/*padding-right: 20px;
		padding-bottom: 20px;*/
		font-family: 'heebo', sans-serif;
		font-size: small;
		font-weight: 400;
}

.publicprivate {
		position: fixed;
		bottom: 20px;
		right: 20px;
		width: 360px;
		height: 45px;
		color: #333;
		overflow: auto;
}

h1 {
	font-family: 'oswald', sans-serif;
	font-size: 4em;
	font-weight: 500;
	color: #333;
}
