html,body{
height:100%;
padding:0;
margin:0;
}

.page{
position:relative;
display:table;
table-layout:fixed;
width:100%;
height:100%;
line-height:1.2;
text-align:left;
font-family:AlphaHeadline, sans-serif;
font-size:1.3em;
color:#000000;
background-color:#FFFFFF;
background-size:cover;
background-position:50% 50%;
background-repeat:no-repeat;
background-attachment:fixed;
}

h1{
font-family:AlphaHeadline;
line-height:1.3;
font-weight:normal;
}

h2{
font-family:AlphaHeadline;
line-height:1.3;
font-weight:normal;
color:#99FF00;
padding-top:0.5em;
}

h3,h4,h5{
font-family:AlphaHeadline;
line-height:1.3;
font-weight:normal;
color:#EC008C;
padding-top:1em;
}

hr{
 border: 10px solid #99FF00;
 border-radius: 5px;
}

a,a:link{
color:#EC008C;
text-decoration:none;
}



.bg-position-top{background-position:50% 0;}
.bg-position-middle{background-position:50% 50%;}
.bg-position-bottom{background-position:50% 100%;}

.page:before{
content:"";
position:absolute;
top:0;
left:0;
bottom:0;
right:0;
}

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


img{
max-width:100%;
width:auto\9;
height:auto;
padding-bottom:1em;
}

.poem{
width:70%;
font-family:DINMedium;
text-align: center;
padding:5em 5em;
}

.container{
position:relative;
display:table-cell;
width:100%;
vertical-align:middle;
padding:1em 2em;
z-index:1;
}

.content{
max-width:900px;
margin:0 auto;
}

@media screen{
.page[class]{background-image:none}
body.debug:after{
content:"default";
position:fixed;
left:0;
bottom:0;
background-color:white;
color:black;
padding:0.5em;
font-size:10px;
text-transform:uppercase;
}
}

@media screen and (max-width: 640px){
	body.debug:after{
	content:"small";
}

h1{
font-size:2em;
}

.page{min-width:300px;
}

.page .container{
	padding:1em;
}
.page,.page[class]{
background-image:none;
}
}

@media screen and (min-width: 641px) and (max-width: 1199px),(min-height:500px) and (max-height: 1199px){
body.debug:after{
content:"medium";
}

.page,.page[class]{
background-image:none;
}
}

@media screen and (min-width: 1200px){
	body.debug:after{
	content:"large";}
	.page,.page[class]{background-image:none;}
	.page .fallback-bg{display:none;}
	.ie8 .page .fallback-bg{
	display:block;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	width:100%;
	height:100%;
	max-width:inherit;
	z-index:0;
	}
}
