/* css released under Creative Commons License -  http://creativecommons.org/licenses/by/2.0/deed.en  */
/* html5 + CSS 3 Template created by miss monorom  http://intensivstation.ch 2013 */

/* reset */
*{
  box-sizing: padding-box;
  -moz-box-sizing: padding-box;
  -webkit-box-sizing: padding-box;
  box-sizing:border-box;
  -moz-box-sizing:border-box; /* Firefox */
  -webkit-box-sizing:border-box; /* Safari */
  padding: 0;
  margin: 0;  
}

/* render html5 elements as block 
   rendert html5 elemente als block  */

header, footer, section, aside, nav, article { display: block;}

body {
	background-color: #c6d9f1; 
	font-size: 0.875em; /*14px*/
	font-family: Arial, Helvetica, sans-serif;
	color: #555;
	margin: 0px 0px 0px 0px;
}

html{
-webkit-text-size-adjust: none;
}

a {color: #26518D;text-decoration: none;}/*#2C44B7*/
a:visited {color:#26518D;}
a:hover {
	color: #69759C;
	text-decoration: underline;
}


/*----------container zentriert das layout----------*/
#container {
	position: relative;
	max-width: 830px;
	min-width: 320px;
	background-color: #fff;
	margin: 20px auto 0px auto;
}


/*----------bild----------*/
header {
	margin: 0px 15px 0px 15px;
	padding: 0px 0px 0px 0px;
	position: relative;
	height: 217px;
	background-image: url(images/pano-forweb.jpg);/*Sommer*/
	/*background-image: url(images/pano-winter4.jpg);*//*Winter*/
	background-repeat: no-repeat;
	border-top: 15px solid #fff;
	background-position: center top;
}


header p {
	margin: 0px 0px 0px 0px;
	padding: 127px 12px 0px 0px;
	font-size: 1.2em;
	color: #fff;
	text-align: right;
	font-family: Geneva, sans-serif;
	text-shadow: 2px 2px 3px #444;/*Winterformatierung*/
	}
		
header img {
	padding-left: 220px;
	width: 100%;  height: 100%;}
	
	
#zitat {position: absolute;
    margin-top: 120px;
    margin-left: 20px;
	line-height: 1.3em;
    color: #fff;}	

/*----------logo----------*/
#logoredleftofnav {
	position: absolute;
	left: 15px;
	top: 255px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;	
	}

/*----------logo----------*/
#logowhiteinheader {
	position: absolute;
	left: 25px;
	top: 60px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;	
	}

/*----------nav-horizontal----------*/
nav {
	float: right;
	width: 660px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 3%;
	font-size: 0.95em;
}
	
nav ul{
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

nav li{
	display: block;
	float: left;
	width: 16%;
    margin: 0px 0px 0px 0px;
	padding: 6px 0px 0px 0px;
	list-style-type: none;
	line-height: 1.8em;
	/*text-align:center;*/
	text-align: left;
}


.li26{width: 26%;}
.li25{width: 25%;}
.li24{width: 24%;}
.li23{width: 23%;}
.li22{width: 22%;}
.li21{width: 21%;}
.li20{width: 20%;}
.li19{width: 19%;}
.li18{width: 18%;}
.li17{width: 17%;}
.li16{width: 16%;}
.li15{width: 15%;}
.li14{width: 14%;}
.li13{width: 13%;}
.li12{width: 12%;}
.li11{width: 11%;}
.li10{width: 10%;}

nav ul ul{
	display: block;
	margin: 0px 0px 0px 0px; /*margin: 0px -20px 0px -20px;*/
	padding: 0px 0px 0px 0px;
}

nav li li{
	float: none;
	display: block;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
	text-align: left;
	line-height: 1.6em;
	width: 200px; /*width: 100%;*/
}

nav li li a {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	font-weight: normal;
}

nav a, a:visited {
	color: #656565;
	font-weight: bold;
	text-decoration:none;
	display:block;
	padding:0px 0px 0px 0px;
	margin:0px 0px 0px 0px;
}
	
nav a:hover{
	display: block;
	color: #800000;
	/*color: #008000;*/
	text-decoration: none;
	}

nav a.selected {
	color: #800000;
	/*color: #008000;*/	
	display: block;
}

/*----------content----------*/

#content {
	margin: 117px 0px 0px 0px; 
	min-height: 320px;
	padding: 0px 0px 10px 0px;
    line-height: 1.3846em; /*18px*/
}


#contentimg {
	float: left; 
	width: 150px; 
	height: 150px; 
	margin: 10px 20px 10px 15px;
	}
	
#contentimg img{width:100%; height: 100%;}


article {
    margin: 0px 0px 0px 170px;
	padding: 10px 48px 45px 20px;
}

article p {
	margin: 8px 0px 0px 0px;
	padding: 0px 0px 4px 0px;
	font-size: 1.072em;
	}

article h1 {
	padding: 0px 0px 10px 0px;
	margin: 0px 20px 0px 0px;
	color: #800000;
	font-size: 1.2em;
}

article h2 {
	padding: 0px 0px 10px 0px;
	margin: 0px 20px 0px 0px;
	font-size: 1em; /*14px*/
	color: #555;
}

	
	
article ul {
	margin: 4px 0px 0px 18px;
	padding: 0px 0px 10px 0px;
	line-height: 1.3076em; /*17px*/
	left: 20px;

	}
	
article ul li{
	margin: 0px 0px 3px 0px;
	padding: 0px 0px 0px 0px;
	}
	
article img{
	float: left;
	margin: 0px 0px 0px 0px;
	}
article a {color: #26518D;text-decoration: none;}/*#2C44B7*/
article a:visited {color:#26518D;}
article a:hover {
	color: #69759C;
	text-decoration: underline;
}

/*----------leftimages----------*/

#leftimages {
	position: absolute;
	top: 324px;
	left: 15px;
	width: 150px;
	height: 150px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}



/*----------rightimage----------*/

#rightimage {
	position: absolute;
	top: 324px;
	left: 605px;
	width: 150px;
	height: 150px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

	
	
#clearthefloats {clear: both;}		

/*----------footer----------*/
footer {
	max-width: 830px;
    min-width: 320px;
    margin: 10px auto 20px auto;
	padding: 0px;
	height: 20px;
	font-size: 0.8em; /*10px*/
}

footer p{
	color: #777;
	text-align:right;
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 7px 0px;
}

footer a {color: #26518D;text-decoration: none;}/*#2C44B7*/
footer a:visited {color:#26518D; text-decoration: none;}
footer a:hover {
	color: #69759C;
	text-decoration: underline;
}



/* -----------always scrollbar------------------ */

html {overflow-y: scroll;}

/* -----------classes--------------------------- */
.shadow { box-shadow: 0px 2px 10px #7C97B6; } 

.leftimagesuntil780px {display: block;}
.rightimageuntil780px {display: block;}

.logobefore680px {display: block;}
.logoafter680px {display: none;}

.laotse {
	font-weight: bold;
	font-size: 1.25em;
	color: #800000;
	padding: 5px 0px 15px 0px;
}
.laotse2 {
	font-size: 0.8em;
}
.blue {
	color: #33F;font-size: 1.1em;
}
.green {
	color: #96bf0d;font-size: 1.1em;
}

.red {
	color: #800000;
}



@media only screen and (max-width: 800px) { 
#container {margin-top: 14px;}
article {padding-right: 38px;}
}

@media only screen and (max-width: 780px) { 
.leftimagesuntil780px {display: none;}
.rightimageuntil780px {display: none;}
}

@media only screen and (max-width: 700px) { 
#container {margin-top: 7px;}
article {padding-right: 28px;}
}

@media only screen and (max-width: 680px) { 
nav {width: 100%;
	font-size: 0.9em;}
nav li li{line-height: 1.72em;}
.logoafter680px {display: block;}
.logobefore680px {display: none;}
#zitat{display: none;}
#contentimg {width:90px; height: 90px;}
article {
    margin-left: 0px;
	padding-left: 15px;
	padding-right: 20px;}
#contentimg {
	float: right; 
	}
	

}


@media only screen and (max-width: 590px) { 
#container {margin-top: 0px;}
}

@media only screen and (max-width: 480px) { 

header {
	margin-left: 10px;
	margin-right: 10px;
	background-image: url(images/pano-forweb-small.jpg); /*Sommer*/
	/*background-image: url(images/pano-winter4-small.jpg);*/ /*Winter*/
	height: 133px;
	border-top: 10px solid #fff;
}


header p {
	padding-top: 70px;
	font-size: 0.82em;
}

#logowhiteinheader {
	top: 15px;}

nav {
	font-size: 0.88em;}
	
nav a, a:visited {
	font-weight: normal;
}

nav li li a {
	font-size: 0.93em;
}

#content{
    float: left;
	min-width: 100%;
    margin: 0px 0px 0px 0px; 
	min-height: 200px;
}

#contentimg {
	margin: 20px 15px 10px 10px;
}

article {
	padding: 15px 10px 15px 10px;
	}
	

}