@import "base";

$bar-shadow-color: #ccc;

html, body {
	height: 100%;
	box-sizing: border-box;
	overflow: hidden;
}

body {
	color: $default-font-color;
	font: 300 12pt "Open Sans", Arial, sans-serif;
  background-color: $light-grey;
  @include display-box;
  @include box-orient(vertical);
}

h1 {
  font-size: 20px;
}

header, footer {
  background: rgba(255, 255, 255, 0.5);
  padding: 1em;
  @include box-shadow(0 2px 5px $bar-shadow-color);
  @include display-box;
	@include flexbox-vert(center);
}

footer {
	bottom: 0;
	width: 100%;
	@include box-shadow(0 -2px 5px $bar-shadow-color);
}

#container {
  @include display-box;
	@include flexbox-horiz(center);
	@include flexbox-vert(center);
	@include box-orient(vertical);
	@include box-flex(2);
	//height: 100%;
}
