/*------------------------------------------------------------------------ */
/* Biodiversia GmbH - www.biodiversia.ch                                   */
/*-------------------------------------------------------------------------*/

/*-------------------------------RESET CSS---------------------------------*/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.3;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*-------------------------------ALLGEMEIN------------------------------*/
body {color:#333;
	background-color: #FFFFFF;
	font-family:'Roboto', sans-serif;
	font-size:1.1em;
	/* background:url(../images/design/bg_biodiversia.png) bottom left no-repeat fixed,
	url(../images/design/bg_biodiversia2.png) top right no-repeat scroll;  SIEHE KLASSEN */

}

p, td, th, textarea, ul li, ol li, input, label, fielset, legend {
	font-family: 'Roboto', sans-serif; font-weight:400;
	font-size:1em;
	line-height:1.6em;
}

#content p, #content ul {margin:0 0 1em 0;}

h1	{font-family: 'Roboto', sans-serif; font-weight:400; font-size:1.7em; padding:0; margin:0 0 1em 0; color:#3399CC; line-height:1.3em; }
h2 	{font-family: 'Roboto', sans-serif; font-weight:400; font-size:1.2em; padding:0; margin:0.4em 0 0.2em 0; color:#3399CC; line-height:1.3em;}
h3	{font-family: 'Roboto', sans-serif; font-weight:400; font-size:1.05em; padding:0; margin:0 0 0.1em 0; color:#3399CC;}
h4	{font-family: 'Roboto', sans-serif; font-weight:700; font-size:1em; padding:0; margin:0 0 0.1em 0; color:#3399CC;}

img {
	max-width: 100%; height: auto; 
}

img[usemap] {
		border: none;
		height: auto;
		max-width: 100%;
		width: auto;
	}

* {-khtml-transition:all 1s;
	-rim-transition:all 1s;
	-ms-transition:all 1s;
	-o-transition:all 1s;
	-moz-transition:all 1s;
	-webkit-transition:all 1s;
	transition:all 1s; 
}

#content li {
	list-style-type:disc;
	margin-left:1em;
}

/*-------------------------------CLASSES--------------------------------*/
.newsBild {float:left; margin:0 15px 10px 0; width:30%;}

.mnuTitle {font-style:italic;
	font-size: 0.8em;
}

.italic {font-style:italic;}

.bold {font-weight: 700;}

.bigger {font-size: 1.3em;}

.clear {clear:both;}

.clearSmall {clear:both; padding:0; margin:0; height: 1px; width:1px;}

.newsTitel {border-bottom:1px solid #3399CC; font-size:1.05em; margin:0.4em 0 1.1em 0;}

.overviewTitel {font-size:0.9em; font-weight:700; margin:0.4em 0 0.4em 0;}

.news {margin:0 0 2em 0;}

div.box {
	width:97%;
	text-align:left;
	padding:0.6em 0.6em 0.6em 1em;
	margin:0.6em 0 0 0;
	border-radius: 10px;
	height:auto;
	background-color:#CAE1EB;
	float:none;
	clear:both;}
	
div.boxAside {
	width:97%;
	text-align:left;
	padding:1em 0.6em 1em 0em;
	margin: 0;
	border-bottom: 1px solid #3399CC;
	height:auto;
	float:none;
	clear:both;}

.centerPicNormal {width:100%; max-width:800px; height:auto;}

.centerPicNormal70 {width:70%; max-width:800px; height:auto; margin-left:14%;}

.centerPicInternet {width:100%; max-width:190px; height:auto; border:15px solid #eeeeee;}

.centerPicDiversiflora {width:100%; max-width:620px; height:auto;}

.leftPicTeam {float:left; margin:0.5em 1em 0.5em 0; padding:0; width:25%; max-width:120px; height:auto;}

.rightPicMngmnt {width:100%; max-width:600px; height:auto;}

.leftPicPrint {float:left; margin:0.5em 1em 0.5em 0; width:40%; max-width:400px; height:auto;}
.leftPicPrint2 {float:left; margin:0.5em 1em 0.5em 0; width:40%; max-width:400px; height:auto; border:1px solid #CCCCCC;}

.leftPicDiver {float:left; margin:0 1em 0.5em 0; width:60%; max-width:455px; height:auto;}

.rightContent {float:right; margin-left:1em;}

.rightContentMngmnt {float:right; margin-left:1em; padding:15px; width:35%;}

.leftContent {float:left; margin:1em; font-size:0.9em;}

.rightTextAlign {text-align:right;}

.leftTextAlign {text-align:left;}

.centerTextAlign {text-align:center;}

.grayborder {border:1px solid #CCCCCC;}

aside ul li.asidehome {list-style-type: disc;}

.subItem {margin-left:2em;}


table.experienceTable tr td {border-bottom:1px solid #9DCEE3; padding:0.4em 0.6em 0.4em 0.6em;}

.slogan {float:right;}

/*-------------------------------LAYOUT---------------------------------*/

#wrapper {
	margin-right: auto;
	margin-left: auto;
	margin-top: 0;
	margin-bottom: 0;
	width: 92%;
	max-width:1480px;
	background-color:transparent;
}

header {
	margin-right: 1.5%;
	margin-left: 1.5%;
	margin-top: 0;
	margin-bottom: 0;
	padding: 0.5em 0 0.5em 0;
	width: 97%;


}

#logo {
	margin-right: 2%;
	margin-left: 2%;
	margin-top:0;
	margin-bottom:0;
	padding: 1.5em 0 0 0;
	width: 96%;
}

#content {
	margin-right: 3.5%;
	margin-left: 0.5%;
	margin-top:0em;
	margin-bottom:2em;
	padding-left:2%;
	width: 68%;
	float:right;
	background-color:#ffffff;
}

#komm {
	margin-top:2em;
	margin-bottom:2em;
	padding: 0;
	width:100%;
	background-color:#3399CC;
}

aside {
	margin-right: 0.5%;
	margin-left: 3.5%;
	margin-top:0;
	margin-bottom:2em;
	padding-right:1%;
	width: 20%;
	float:left;
}

footer {
	margin-right: 1.5%;
	margin-left: 1.5%;
	margin-top:0;
	margin-bottom:0px;
	padding: 1.5em 0 2.5em 0em;
	width: 97%;
	clear:both;
	text-align:left;
	font-size:1em;
	border-top:1px solid #3399CC;
}

/*-------------------------------NAVIGATION-----------------------------*/

/*----------------------Navigation Top -----------------------------*/

#navigationTop {text-align:center; margin: 1.5em 0em 3.5em 0em; border-bottom:1px solid #3399CC;}
#navigationTop ul li {
	display: inline-block;
	margin-right:2%;
}

#navigationTop ul li li {
	list-style-type:disc;
}

#navigationTop a {
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
	font-size: 1.1em;
	font-weight: normal;
	color: #3399CC;
	padding:0 0.4em 0 0.4em;
	display:block;
}

#navigationTop a:link    {color: #3399CC; background-color:transparent;}
#navigationTop a:visited {color: #3399CC; background-color:transparent;}
#navigationTop a:focus	{color:#000; background-color:transparent;}
#navigationTop a:hover   {color:#000; background-color:transparent;}

#navigationTop a:active  {color:#000; background-color:transparent;}
#navigationTop a:selected {color:#000; background-color:transparent;}


/*----------------------NAVIGATION ASIDE -----------------------------*/
aside ul li {
	list-style-type:none;
}

aside ul li li {
	list-style-type:disc;
}

aside a {
	height: auto;
	text-decoration: underline;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
	font-size: 1em;
	line-height:2.3em;
	color: #3399CC;
		display:block;

}

aside a:link    {color: #3399CC;}
aside a:visited {color: #3399CC;}
aside a:focus	{color:#000;}
aside a:hover   {color:#000;}
aside a:active  {color:#000;}
aside a:selected {color:#000;}

/*----------------------NAVIGATION KOMMUNIKATION -----------------------------*/


#komm ul li {
	display: inline-block;
	margin-right: 1.8em;
	margin-left: 0.8em;
}

#komm ul li a {
	height: auto;
	line-height: auto;
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-weight:700;
	font-size: 1em;
	color: #FFFFFF;
	padding:0 0.2em 0 0.2em;
	display:block;
}

#komm a:link    {color: #FFFFFF; background-color:transparent;}
#komm a:visited {color: #FFFFFF; background-color:transparent; }
#komm a:focus	{color: #FFFFFF; background-color:#0f73a5;}
#komm a:hover   {color: #FFFFFF; background-color:#0f73a5; }
	
#komm a:active  {color: #FFFFFF; background-color:#0f73a5;}
#komm a:selected {color: #FFFFFF; background-color:#0f73a5; border:1px solid #0DBCFF;}

/*-------------------------------LINKS -------------------------------*/

a {
	height: auto;
	text-decoration: underline;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
	font-size: 1em;
	color: #000;

}

a:link    {color: #333;}
a:visited {color: #333;}
a:focus	{color:#3399CC;}
a:hover   {color:#3399CC;}
a:active  {color:#3399CC;}
a:selected {color:#2879a1;}

/*-------------------------------LINKS UEBERSICHT -------------------------------*/

a.overview {
	height: auto;
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-weight:400;
	font-size: 1em;
	color: #000;
	background-color:#FF0;

}

a.overview:link    {color: #333;}
a.overview:visited {color: #333;}
a.overview:focus	{color:#3399CC;}
a.overview:hover   {color:#3399CC; background-color:#03C}
a.overview:active  {color:#3399CC;}
a.overview:selected {color:#2879a1;}



/*------------------------------- HOME OVERVIEW -------------------------------*/
/*------------Thanks to Bevan Stephens, 2012.dconstruct.org -------------------*/

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after{ clear: both; }
.clearfix { zoom: 1; }

.item-list {
	text-shadow: none;
	margin:2em 0 2em -0.8em;
}

.item-list h2 {
	display: none;
}

.item-list ul {
	list-style-type: none;
	margin: 0 0 0 0;
	padding: 0;
}

.item-list li a {
	display: block;
}

.item-list li {
	display: block;
	background-color:#CAE1EB;
	float: left;
	position: relative;
	padding:0;
	margin:0;
	width: 30.5%;
	text-align: center;
}

.item-list li span {
	background-color:#3399CC;
	color:#EEE;
	font-weight:700;
	font-size: 1.2em;
	letter-spacing:0.01em;
	position: absolute;
	right: 0;
	left: 0;
	bottom: 0;
	padding: 7px 10px;
	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out;  
	-ms-transition: all 0.3s ease-out;  
	-o-transition: all 0.3s ease-out;  
	transition: all 0.3s ease-out;
}
.item-list li img {
	width: 100%;
	max-width: none;
}

.item-list li a:active {
	top: 0;
}

.item-list li a:hover span {
	background-color:#0f73a5;
	color: #FFFFFF;
	padding-bottom: 20px;
}

/*-------------------------------MEDIA QUERY-----------------------------*/

@media screen and (min-width: 661px) and (max-width: 850px) {

body.biodiversia, body.angebot, body.felder {background-image:none;}

#wrapper {
	margin:0;
	padding:0;
	width:100%;
}

header {
	margin:0;
	padding: 0.5em 0 0.5em 0;
	width:100%;
}

#logo {
	margin-right: 0;
	margin-left: 0;
	margin-top: 0;
	padding:1em 0 0 0;
	width: 97%;
	text-align:center;
}

nav.navMain {
	margin-right: 0;
	margin-left: 0;
	padding: 0 1.5% 0 1.5%;
	width: 97%;
}

#content, aside {
	margin-right: 1.5%;
	margin-left: 1.5%;
	margin-bottom:1em;
	padding: 0 1.5% 0 1.5%;
	border:0;
	width: 94%;
}

aside {
	border-top:1px solid #3399CC;
	padding-top:1em;
}

footer {
	padding: 0.4em 0 0.4em 0;
	border-top:1px solid #3399CC; 
	font-size:1em;

}

/*----------------------Navigation Top -----------------------------*/

#navigationTop {padding:0 0 0 4% ; margin:0 0 2em 0; background-color:#333; border:none;}


#navigationTop ul li {
	display: block;
	width:100%;
	background-color:#333;
	margin:0;
}

#navigationTop ul li li {
	list-style-type:none;
}

#navigationTop a {
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-size: 1em;
	color: #fff;
	display: block;
	border-bottom:1px solid #666;
	padding: 1.2% 0% 1.2% 0.5%;

}

#navigationTop a:link    {color: #fff;}
#navigationTop a:visited {color: #fff;}
#navigationTop a:focus	{color:#fff; background-color:#666;}
#navigationTop a:hover   {color:#fff; text-decoration: none; background-color:#666;}

#navigationTop a:active  {color:#fff; background-color:#666;}
#navigationTop a:selected {color:#fff; background-color:#666;}





.rightContent, .leftContent, .rightContentMngmnt {float:none; clear:both; width:90%;}

.centerPicNormal70 {width:100%; height:auto; margin:0;}



.leftPicDiver {float:none; margin-left:14%; width:70%; height:auto;}

.item-list li {width:90%; margin-bottom:10px;}
.item-list li span {padding: 14px 10px;}
.item-list li a:hover span {padding-bottom: 30px;}

.slogan {float:left;}


}

@media screen and (min-width: 100px) and (max-width: 660px) {

body.biodiversia, body.angebot, body.felder {background-image:none;}

h1	{font-size:1.4em;}

#wrapper {
	margin:0;
	padding:0;
	width:100%;
}

header {
	margin:0;
	padding:0;
	width:100%;
}

#logo {
	margin-right: 0;
	margin-left: 0;
	margin-top: 0;
	padding:1em 0.5em 0 0.5em;
	width: 97%;
	text-align:center;
}

.newsBild {width:99%;}

/*----------------------Navigation Top -----------------------------*/

#navigationTop {padding:0 0 0 4% ; margin:0 0 2em 0; background-color:#333; border:none;}


#navigationTop ul li {
	display: block;
	width:100%;
	background-color:#333;
	margin:0;
}

#navigationTop ul li li {
	list-style-type:none;
}

#navigationTop a {
	text-decoration: none;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #fff;
	display: block;
	border-bottom:1px solid #666;
	padding: 1.2% 0% 1.2% 0.5%;
}

#navigationTop a:link    {color: #fff;}
#navigationTop a:visited {color: #fff;}
#navigationTop a:focus	{color:#fff; background-color:#666;}
#navigationTop a:hover   {color:#fff; text-decoration: none; background-color:#666;}

#navigationTop a:active  {color:#fff; background-color:#666;}
#navigationTop a:selected {color:#fff; background-color:#666;}





#content, aside {
	margin-right: 1.5%;
	margin-left: 1.5%;
	margin-bottom:1em;
	padding: 0 1.5% 0 1.5%;
	border:0;
	width: 94%;
}

#komm {margin-right: 0;	margin-left: 0;	padding: 0 1.5% 0 1.5%;	width: 97%;}

#komm ul li {display: list-item; list-style-type:none; border-top:1px solid #4bb5ea;}

aside {
	border-top:1px solid #3399CC;
	padding-top:1em;
}

footer {
	padding: 0.4em 0 0.4em 0;
}

/* #logo img {width: 150px;} */

.rightContent, .leftContent, .rightContentMngmnt {float:none; clear:both; width:90%;}

.centerPicNormal70 {width:100%; height:auto; margin:0;}

.centerPicInternet {width:90%;  max-width: none;}

.leftPicDiver {float:none; 	margin-left: 14%; width:70%; height:auto;}


.item-list li {width:90%; margin-bottom:10px;}
.item-list li span {padding: 14px 10px;}
.item-list li a:hover span {padding-bottom: 30px;}

.slogan {float:left; margin-top:30px;}


}