@font-face {
font-family: 'carolingiaregular';
src: url('../font/carolingia-webfont.woff2') format('woff2'),
url('../font/carolingia-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'alte_schwabacherdemibold';
src: url('../font/alteschwabacher-demibold-webfont.woff2') format('woff2'),
url('../font/alteschwabacher-demibold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
html *{
margin:0;               
padding:0;
border:none;
}    
body{   
background-color: #fff;
} 
#page{
position:absolute;
top:0;
left:0;
width: 100%;
height: 100%;
z-index:-1;
margin:0;
padding:0;
background-image: url('../images/background/landscape.jpg');
background-position: 0 100%;
background-repeat: no-repeat;
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover;
background-size: cover;
}
.container{
display:flex;
flex-flow:column wrap;
justify-content:center;
align-items:center;
width:100%;
height:100%;
margin: 0 auto 0 auto;
padding:0;
}
footer{
display:flex;
flex-flow:row wrap;
/*justify-content:center;
align-items:flex-end;*/
width:100%;
height:auto;
margin-top:auto;
background: -webkit-linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6)); 
background: -o-linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6));     
background: -moz-linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6));        
background: linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6)); 
}
.footertextleft{
width:auto;
height:auto;
font-family:Lato, Arial;
font-size:2.2rem;
color:#fff;
text-align: center;
margin:0 0 10px auto;
padding:0;
}
.footertextright{
align-self:flex-end;
width:auto;
height:auto;
font-family:Lato, Arial;
font-size:1rem;
color:#fff;
text-align: left;
margin:0 15px 10px auto;
padding:5px 5px 0 0;
}
a{
display:inline-block;
color:#fff;
text-decoration:none;
padding:0;
}
html, body{
height:100%;
overflow:hidden;
}
@media only screen and (min-width: 801px) and (max-width: 1024px){
.footertextleft{
font-size:2rem;
}
}

@media only screen and (min-width: 641px) and (max-width: 800px){
.footertextleft{
font-size:2rem;
padding:10px 0 0 0;
}
}
@media only screen and (min-width: 240px) and (max-width: 640px){
.footertextleft{
font-size:1.5rem;
margin:0 0 0 auto;
padding:10px 0 0 0;
}
.footertextright{
font-size:1rem;
padding:5px 0 0 0;
}
}
@media only screen and (min-width: 240px) and (max-width:370px){
footer{
background-image:none;
}
.footertextleft{
width:100%;
font-size:1.5rem;
margin:0 0 0 auto;
padding:0 0 5px 0;
}
.footertextright{
width:100%;
font-size:1rem;
text-align:center;
margin:0 auto 0 auto;
padding:5px 0 5px 0;
background: -webkit-linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6)); 
background: -o-linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6));     
background: -moz-linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6));        
background: linear-gradient(rgba(40,46,80,0.6),rgba(40,46,80,0.6)); 
}
}
@media only screen and (orientation:portrait){
#page{
position:absolute;
top:0;
left:0;
width: 100%;
height: 100%;
margin:0;
padding:0;
background-image: url('../images/background/portrait.jpg');
background-position: 0 100%;
background-repeat: no-repeat;
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover;
background-size: cover;
}
}