﻿
/*
------------------------------------
Mount-Everest, Responsives Webdesign
Verbundausbildung Geomatiker 
11.3.-12.3.2015
------------------------------------
*/

* {
	margin:0;
	padding:0;
}

h1 {
	color:#F93;
	font-size: 2.6em;
	padding-top:45px;
	padding-left:40px;
}

h2 {
	font-size:1.4em;
}

h3 {
	font-size:1.3em;
}

body {
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color:#666666;
	font-size: 62.5%;
}

#top {
	height:8px;
}

#header {
}

#container {
	max-width: 80%;
	margin:auto; /*zentriert*/
	padding:1%;
	border: solid 1px #C60;
	border-radius: 18px;
	box-shadow: 2px 2px 2px 2px #FC6;
}

#navigation {
	font-size:1.6em;
 background-color#FFF;
	padding-top:30px;
	padding-bottom:30px;
	padding-left:40px;
}

#navigation a {
	text-decoration:none;
	padding-top:3px;
	padding-bottom:3px;
	padding-left:15px;
	padding-right:15px;
	background-color:#Fff;
	color:#F93;
	-webkit-transition: all 0.5s ease-in;
	-moz-transition: all 0.5s ease-in;
	-o-transition: all 0.5s ease-in;
	-ms-transition: all 0.5s ease-in;
	border-radius: 5px;
	border: solid 1px #FC6;
}

#navigation ul {
	list-style:none;
}

#navigation li {
	display:inline;
	padding-right:15px;
	font-weight:bold;
}

#navigation a:hover {
	background-color:rgba(255,153,51,0.9);
	color:#FFF;
}

#navigation a.auswahl {
	background-color:rgba(153,153,153,0.2);
	color:#666;
}

aside {
	width:25%;
	float:right;
	background-color:#FFFFFF;
	font-size:1.4em;
	padding:2%;
	font-family:Arial, Helvetica, sans-serif;
	line-height:160%;
	border-left: solid 0.5px #FC6;
	padding-top:40px;
}

article {
	width:61%;
	float:left;
	line-height:160%;
	padding-left:4%;
	padding-right:4%;
	padding-top:3%;
	padding-bottom:2%;
	font-size:1.4em;
}

figcaption {
	font-style:italic;
	font-size:0.9em;
	color:#F93;
}

#bild {
	float:right;
}

#bild1 {
	float:right;
}

#bild2 {
	float:right;
}

#bild5 {
	text-align:center;
	margin-top: 20px;
}

img {
	max-width:100%;
	height:auto;
	padding:2%;
	border: 1px solid #FC6;
	margin:3%;
}

#footer {
	padding-top:1%;
	padding-bottom:1%;
	clear:both;
	text-align:center;
}

#footer a {
	color:#F60;
	font-size:1.4em;
	text-decoration:none;
	padding-bottom:10px;
}

#koordinaten {
	padding-left: 20px;
}

#koordinaten1 {
	padding-left: 20px;
}

#loesung {
	color:rgba(255,255,255,0.0);
	font-size:0.2em;
	line-height:120%;
}

#b {
	float:left;
}

#c {
	float:left;
}

#d {
	float:left;
}

#e {
	float:left;
}
 @media screen and (max-width:850px) {

aside {
	width:100%;
	background-color:#FF9;
	text-align:center;
	border:none;
}

h1 {
	font-size: 2.4em;
}

article {
	width:auto;
	float:left;
}

#container {
	max-width: 100%;
	padding:0%;
	border: none;
	border-radius:none;
}

#navigation {
	padding-left:15px;
}

#navigation a {
	line-height:200%;
}

#c {
	clear:both;
}

#e {
	float:left;
}
}
 @media screen and (max-width:600px) {

#navigation {
	padding-left:25px; /*Abstand der Schaltflächen-zum linken Rand*/
	padding-right:25px;  /*Abstand der Schaltflächen-zum rechten Rand*/
	background-color:#ffF;
}

#navigation li {
	display:block;
	padding-bottom:5px; /*Abstand der Schaltflächen_Horizontal*/
}

#navigation a {
	display:block;
	padding-top:1px;
	padding-bottom:1px;
	padding-right:100%;
}

#container {
	border: solid 0px #fff;
	border-radius: 0px;
	box-shadow: 0px 0px 0px 0px #Fff;
}

#top {
	height:0px;
}
}
@media screen and (max-width:400px) {

.test {
	display:none;
}

figcaption {
	display:none;
}

aside {
	padding-top:20px;
	padding-bottom: 40px;
 #bild {
 float:right;
}

#b {
	display:none;
}

#c {
	display:none;
}

#d {
	display:none;
}

#e {
	display:none;
}

h1 {
	font-size: 2.2em;
}

#navigation a {
	-webkit-transition: all 0s ease-in;
	-moz-transition: all 0s ease-in;
	-o-transition: all 00s ease-in;
	-ms-transition: all 0s ease-in;
}
