body {
    margin:0;
    box-sizing:border-box;
    background-color:black;
}

header>img {
    margin-top:30px;
}

#main-nav {
    margin-left:75px;
    text-transform:uppercase;
    font-size: 32px;
    font-weight:100;

    position:fixed;
    /*      bottom:50%;*/
    margin-top:2.5em;
    z-index:1000;
}
#main-nav a {
    color:white;
    text-shadow: 2px 2px 20px black;
}
#main-nav>ul {
    list-style-type:none;
    margin:0;
    padding:0;
}
#main-nav>ul>li {
    margin-top:0.6em;
}
#main-nav>ul>li>a {
    opacity:0.8;
}
#main-nav>ul>li.selected>a,
#main-nav>ul>li>a:hover {
    opacity:1;
}

#background1, #background2, #background3, #background4 {
    position: fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:-2;
    background-repeat: no-repeat;
    background-size: cover;
    background-position:0;
    background-attachment:fixed;
    opacity:0;
}
#background1.animationTrigger {
    background-image:url(../img/background-wohnen-sichtbeton.jpg);
    animation: backgroundOpacityAnimation 3s ease-in 0s forwards;
    -webkit-animation: backgroundOpacityAnimationWebkit 3s ease-in 0s forwards;
}
#background2.animationTrigger {
    background-image:url(../img/background-nasszellen-bad.jpg);
    animation: backgroundOpacityAnimation 2s ease-in 10s forwards;
    -webkit-animation: backgroundOpacityAnimationWebkit 3s ease-in 10s forwards;
}
#background3.animationTrigger {
    background-image:url(../img/background-treppe-gang.jpg);
    animation: backgroundOpacityAnimation 2s ease-in 20s forwards;
    -webkit-animation: backgroundOpacityAnimationWebkit 3s ease-in 20s forwards;
}
#background4.animationTrigger {
    background-image:url(../img/background-garten-terasse.jpg);
    animation: backgroundOpacityAnimation 2s ease-in 30s forwards;
    -webkit-animation: backgroundOpacityAnimationWebkit 3s ease-in 30s forwards;
}
@keyframes backgroundOpacityAnimation {
    from {
	opacity:0;
    }
    to {
	opacity:1;
    }
}
@-webkit-keyframes backgroundOpacityAnimationWebkit {
    from {
	opacity:0;
    }
    to {
	opacity:1;
    }
}

/* Bugfix for Android <= 4 fixed positioning issues */
html.legacy #backgroundContainer {
display:none;
}
html.legacy body {
background-image:url(../img/background-wohnen-sichtbeton.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position:0;
}

footer {
    display:table;

    position:fixed;
    bottom:0;
    left:0;
    right:0;

    width:100%;
    box-sizing:border-box;
    opacity:0.8;

    z-index:1000;
}
footer>* {
    background-color: black;
    padding:40px 60px;
}

footer h1 {
    font-size:18px;
    font-weight:100;
    line-height:normal;
}


/* Anchors                                  */
/* ---------------------------------------- */
a {
    text-decoration:none;
    color:#111;
}

@media
only screen and (max-width: 759px),
only screen and (max-device-width: 759px) {
    body {
	padding:0px;
    }
    header>img {
	margin-top:30px;
    }

    footer {
	display:block;
	position:static;
	padding:0;
    }
    footer>* {
	width:100%;
	display:inline-block;
	box-sizing:border-box;
	padding: 20px;
    }
    footer>address {
	padding-left:20px;
	padding-top:40px;
    }
    footer>div {
	padding-right:20px;
	padding-bottom:40px;
    }
    #main-nav {
	margin: 40px 20px 120px 20px;
	position:static;
    }
}
