/* @group general styles */

body {
	color:#999;
/* needed to eliminate scrollbars caused by the background image */
	padding:0;
	margin:0;
	background-color: #fff;
	font: normal 0.75rem "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
}

img {
	max-width: 100%;
}

#wrap {
    padding:0 15px;
}
@media (min-width: 1024px) {
    #wrap {
        padding:0;
    }
}
.footer{
	float: left;
	border-top: 1px solid #fff;
	margin-bottom: 40px;
}
@media (min-width: 1024px) {
    .footer {
        padding-left:40px;
    }
}
#wrap,#overlay {
	padding-top:20px;
	display: block;
	overflow: hidden !important;

}
#top{
	width: 280px;
	margin: auto;
	float: none;
	position: relative;
}
@media (min-width: 1025px) {
	#top{
		width: 100%;
	}
    .logo {
        cursor: pointer;
        margin-bottom: 0px;
        float: left;
        clear: both;
        margin-left: 517px;
    }

    #header{
        padding-left: 47px;
        float: left;
        width: 100%;
		margin: unset;
        margin-bottom: 3px;

    }
}

.marge{
	padding-left: 3px;
}
.hidden {
	display:none;
}

a, a:visited, a:active, a:link, .iLink {
	cursor:pointer;
	padding-top:3px;
	padding-bottom:0px;
	padding-left:3px;
	padding-right:3px;
	text-decoration:none;
	color: #999999;
}

a:hover,.selected,.iLink:hover {
	color: #444;!important;
}

.left {
	float:left;
}

.right {
	float:right;
}

#left,#right {
	width:182px;
	padding-top:50px;
	margin-right:20px;
}
@media (min-width: 1024px) {
    #top {
        padding-top:0px;
        padding-left:40px;
        padding-bottom: 0px;
    }
}

#overlay {
z-index: 4 !important;

}

#bgimg {
	position:absolute;
	z-index:-1;
}



h1,.articleTitle {
	font-size:1.5em;
}

h1,strong,.articleTitle {
	padding-left:3px;
	padding-bottom:0px;
	padding-right:3px;
	padding-top:3px;
	clear:both;
	font-weight: normal;
	background-color: #fff;
	float:left;
	margin-top:0px;
	margin-bottom:2px;
	white-space: nowrap;
	color: #333;
	text-transform: uppercase;
}
.kontaktBox strong{
	font-weight: bold !important;
	padding-left:0;
	padding-bottom:0;
	padding-right:0;
	padding-top:0;
	clear:both;
	font-weight: normal;
	background-color: transparent;
	float:none;
	margin-top:0;
	margin-bottom:0;
	white-space: normal;
	color: inherit;
	text-transform: none;
}

#main-content {
width: 100%;
}

#content {
	margin:0 auto;
	height:100px;
	width:100%;
	bottom:5%;
	z-index:3;
	background:#262626 no-repeat 90%;
	border-top:1px solid #000;
	border-bottom:1px solid #4F4F4F;
	position:absolute;
}

.current {
	color: #0aceff;
	font-weight:bold;
}

h2 {
	padding-left:4px;
	padding-bottom:2px;
	padding-right:4px;
	padding-top:2px;
	clear:both;
	font-weight:normal;
	background-color: #0aceff;
	color:#fff;
	float:left;
	margin-top:1px;
	margin-bottom:1px;
	font-size:1em;
}

h3 {
	font-weight:normal;
	font-size:.9em;
}

h4 {
	font-family:"Lucida Grande", Verdana, Arial, sans-serif;
	color: #0aceff;
	font-size:1.1em;
	font-variant:bold;
	margin-bottom:0;
	padding-top:10px;
}

.box {
	height:100%;
	float:left;
}

.osbox {
	float:left;
	clear:both;
	padding-top:20px;
}

.external {
	padding-right:12px!important;
	white-space: nowrap;

}

.bgImages {
	margin-bottom: 15px;
	text-align: center;
}

@media (min-width: 1024px) {
	.bgImages{
		float: left;
		margin-right: 40px;
		margin-bottom: 0;
	}
    .bgImageStage{
        padding-left: 64px !important;
        width:5000px;
    }
}

.external:hover,.externalHover,#page .external:hover {
	text-decoration:underline!important;
	background-repeat:no-repeat;
	background-position:right top;
	background-image:url(../images/external.gif)!important;
}

.topLink {
	position:relative;
	float:right;
	padding:2px;
}
.topLink2 {
	float:right;
	padding:2px;
	clear: both;
	margin-right: 12px;
}

@media screen and (min-width: 1025px) {
	#stage {
		float:left;
		clear:both;
		padding-left: 0px;
		min-height: 415px;
		overflow: hidden;
		min-width: 1200px;
		width:100%;
	}
}


.boxbody {
	background-color:#333;
	float:left;
	width:183px;

	padding:5px;
	margin-bottom:20px;
	clear:both;
}
@media screen and (min-width: 1025px){
	#projekteBox{
		float: left;
		padding-left: 60px;
		padding-bottom: 10px;
	}
}
.articles,#page {
	padding-top:5px;
	margin-bottom:0px;
}
@media screen and (min-width: 1025px) {
	.articles,#page {
		float:left;
	}
}
#articles{
	max-width: 535px;
	margin: auto;
}
@media screen and (min-width: 1025px){
	#articles{
		max-width: none;
		float: left;
		clear: none;
	}
}
#articles .article{
clear: both;
cursor: pointer;
}
@media screen and (min-width: 1025px){
	#scrollingDivs{
		width:10000em;
		float: left;
	}
}

@media screen and (max-width: 1024px) {
	.scrollDiv{
		margin: 15px auto;
		text-align: center;
	}
}
@media screen and (min-width: 1025px){
	.scrollDiv{
		float: left;
		margin-right: 40px;
	}
}
.selected{

color: #444 !important;
}


/* @end */

/* @group navigation */

#mainnav {
	float: left;
	clear: 	left;
	padding: 0;
}
#nav{
	float: right;
}
#navigation {
	float:right;
	margin:22px 20px 0 0;
}


#mainnav {
	margin-left: 95px;
	text-transform: uppercase;
}

#mainnav a {
	background-position: 0 10px;
	background-repeat: no-repeat;
	background-image: url(../images/underscore.jpg);
	margin-bottom:2px;
	margin-bottom: 10px;
	margin-top: 10px;
	margin-right: 45px;
	padding-left: 20px;
	display: block;
	font-size: 1.1666666666666667em;
	letter-spacing: 2px;
}

@media screen and (min-width: 1025px) {
	#mainnav {
		float:left;
		display: block;
		width: 100%;
		margin-left: 0;
		margin-top: 0;
	}
	#mainnav a {
		display: inline;
		font-size: 12px;
		letter-spacing: 0;
	}
}
@media screen and (max-width: 1024px) {
	#mainnav #btn_projekte.selected {
		margin-bottom: 110px;
	}
}

/* @end */

/* @group tagcloud */

#tagcloud {
	font-size:1em;
}
@media screen and (min-width: 1025px) {
	#tagcloud.js--hide {
		display: none !important;
	}
}

@media screen and (min-width: 1025px) {
	#tagcloud {
		padding-left: 154px;
		padding-top: 60px;
		float: left;
		width: 290px;
	}
}
@media screen and (max-width: 1024px) {
	#tagcloud {
		position: absolute;
		top: 181px;
		left: 50%;
		font-size:1.2em;
		margin-left: -111px;
	}
	#tagcloud a{
		padding-bottom: 10px;
	}
}

#tagcloud .active {
	color: #444;
}


a.tag, #tagcloud a {
min-width: 150px;
display: inline-block;
word-break: keep-all;
background-position: 0px 11px;
background-repeat: no-repeat;
background-image: url(../images/underscore.jpg) !important;
padding-left:20px !important;
	float: left;
	clear: left;

}
@media screen and (min-width: 1025px){
	a.tag, #tagcloud a {
		margin-bottom: 40px;
		background-position: 0px 9px;
	}
}


/* @end */

/* @group overlay */

.fullview {
	padding-top:50px;
	padding-left:70px;
	float:left;
	width:730px;
}


	
/* styling for the image wrapper  */
#image_wrap {
	float:left;
	clear:both;

	display: block;

	height: 450px;
/* dimensions */
	width:686px;

	
/* centered */
	text-align:center;
}

.thumbpanel {
	float:left;
	clear:both;
	width:743px;
	padding-left:199px;
	padding-top:5px;
}


	
/* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/
#overlay .scrollable {

	
/* required settings */
	position:relative;
	overflow:hidden;
	width:690px;
	height:120px;
	float:left;
}


	
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a extremely large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/
#overlay .scrollable div.items {

	
/* this cannot be too large */
	width:20000em;
	position:absolute;
}

.items img {
	margin-right:2px;
}

.fClose {
	float:right!important;
	font-size:1.25em;
	margin-bottom:2px;
}

h2.eTitle {
	font-size:1.4em;
	background-color:#fff;
	color:#ff0066;
	float:none;
	display:inline;
}

.overlogo {
	margin-bottom:20px;
	padding-top:50px;
	float:left;
}

/* 
    a single item. must be floated in horizontal scrolling. 
    typically, this element is the one that *you* will style 
    the most. 
*/
#overlay .scrollable #overlay .items div {
	float:left;
}

#overlay .items {
	cursor:pointer;
	margin-right:2px!important;
}


	
/* you may want to setup some decorations to active the item */
#overlay .active {
	border:2px solid #ff0066;
}

a.nextPage {
	background-position:6px 3px;
	background-repeat:no-repeat;
	float:right;
	width:20px;
	height:28px;
	margin-top:40px;
	cursor:pointer;
	background-image:url(../images/right.png);
	padding:2px!important;
}

a:hover.nextPage {
	background-image:url(../images/o_right.png)!important;
}

a:hover.prevPage {
	background-image:url(../images/o_left.png);
}

a.prevPage {
	background-image:url(../images/left.png);
	background-repeat:no-repeat;
	padding:2px!important;
	float:left;
	width:20px;
	height:28px;
	margin-right:2px;
	margin-top:40px;
	cursor:pointer;
	background-position:4px 3px;
}

.eDescription {
	color:#555;
	width:690px;
	padding-left:26px;
	line-height:1.35em;
	float:left;
	clear:both;
	margin-bottom:20px;
}

.fArticleTitle {
	width:690px;
}
#scrollL,#scrollR{
width:15px;
height:15px;
float: left;
cursor: pointer;
}
#scrollL:hover{
background-image: url(../images/pfeil_l_o.jpg);

}
#scrollR:hover{
background-image: url(../images/pfeil_r_o.jpg);

}
#scrollL{
background-repeat: no-repeat;
background-image: url(../images/pfeil_l.jpg);
margin-right: 25px;
}
#scrollR{
background-repeat: no-repeat;
background-image: url(../images/pfeil_r.jpg);
margin-left: 22px;

}

#scrollDivPager{
position: absolute;
left: 660px;
display:block;
}

@media (max-width:1024px) {
	#scrollDivPager {
		display:none !important;
	}
}

#scrollDivPager .selected{
background-color: #aba99b;
}
.scrollPageLink{
width: 10px;
height: 10px;
cursor: pointer;
background-color: #e4e2d5;
float: left;
margin-top: 1px;
margin-right: 3px;
margin-bottom: 3px;
}
.scrollPageLink:hover{

background-color: #aba99b;
}
/* @end */

/* @group loader */


.stageLoader {
	width:50px;
	height:30px;
	float: left;
	position:absolute;
	top:160px;
	left:40px;
	opacity: 0.6;
}



/* @end */

/* @group pagination */

.pager {
	cursor:pointer;
}

.pager,.current {
	width:10px;
	padding-left:1px;
	padding-right:1px;
}

.pagerTitle {
	padding-right:4px;
}

.pagination div {
	float:left;
}

.pagination a {
	background-color:#333;
	padding:0;
}

#pagerContainer {
	min-height:23px;
}

.pagination {
	background-color:#333;
	display:block;
	clear:both;
	float:left;
	padding: 3px 3px 1px;
}



/* @end */

/* @group article */

.article {
	margin-bottom:10px;
	background-color: #fff;
	padding: 8px;
}
@media screen and (min-width: 1025px){
	.article {
		margin-right: 10px;
	}
}
.articleTitle {
	margin-bottom:2px;

	z-index: 5;
	position: absolute;
	
}

.articleBody {
	margin-bottom:2px;
	padding-top:0;
}

.articleTxt {
	background-color: #e4e2d5;
}
@media screen and (min-width: 1025px){
	.articleBody {
		float: left;
	}
	.articleTxt {
		width: 110px;
		height:65px;
		padding-top:30px;
		padding-left: 10px;
		padding-right: 25px;
		margin-right: 10px;
		float: left;
	}
}
@media screen and (max-width: 1024px){
	.articleTxt {
		padding: 7px;
	}
}

.articletags {
	float:left;
	clear:both;
}

.articleImage {
	z-index: 4;
}

@media (min-width:1025px) {
	.imageContainer {
		float:left;
	}
}
@media (max-width:1024px) {
	.imageContainer {
		margin-top: 7px;
		margin-bottom: 10px;
	}
}

.articleLink {
	position:relative;
	top:184px;
	float:right;
	padding:2px;
}

.aTitles {
	color:#333;
}

.aTitles,.aContent {
	float:left;
	list-style-type:none;
	padding-top:0;
	padding-bottom:0;
	padding-left:0;
	padding-right:5px;
	margin:0;
}
.aContent{

}
.article p {
	clear:both;
	float:left;
	width: 210px;
}


.kontaktBox{
padding-top: 40px;
		background-color:#e4e2d5;
}
@media (min-width: 1024px) {
	.kontaktBox{
		width: 580px !important;
	}
}
.scrollDivText{
	background-color:#e4e2d5;
	padding-top: 40px !important;
	padding-bottom: 40px;
	padding-right: 10px;
	padding-left: 10px;
	box-sizing: border-box;
	max-width: 560px;
}
@media (min-width: 1025px) {
	.scrollDivText{
		width: 560px;
		height: 420px;
		padding-right: 40px !important;
		padding-right: 0;
		padding-left: 0;
		max-width: unset;
	}
}
@media (max-width: 1024px) {
	.scrollDivText{
		padding-right: 15px;
		padding-left: 15px;
	}
}
.profilBox{
    padding-top: 40px;
	background-color:#e4e2d5;
}
@media (min-width: 1024px) {
	.profilBox{
		width: 500px;
	}
    .profil .pArticle{
        float: left;
    }
}
.portaitBox{
background-repeat: no-repeat;
background-image: url(../../ostblk/database/images/profil/kerstin_wessels.png);
width: 143px;
height: 178px;
	padding:0 0 40px 0 !important;
	margin-right: auto;
	margin-left: auto;
	float: none !important;
}
@media (min-width: 1025px) {
	.portaitBox {
		margin-left: 0;
		padding: unset;
		margin-right: 140px;
		padding:0 20px 10px 10px !important;
		float: left !important;
	}
}

@media (min-width: 1024px) {
    .profil div{
        float: left;
    }
}
.kontaktBox p, .kontaktBox ul{
line-height: 2em;
padding-bottom: 40px;
	margin: auto;
}
@media (min-width: 1025px) {
	.kontaktBox p{
		margin: unset;
	}
}
p.underscoreK, ul.underscoreK{


margin: 0;
background-position: 235px 15px;
background-repeat: no-repeat;
background-image: url(../images/underscore.jpg)

}
.noneBgImg{
	background-image: none !important;

}
ul.underscoreK {
	margin-left: 13px;
}
p.underscoreK.beforeUl {
	padding-bottom: 24px;
}
@media (min-width: 1025px) {
	p.underscoreK, ul.underscoreK{
		padding-left: 255px;
	}
}

p.underscoreP{
	line-height: 2em;
	background-position: 15px 23px;
	background-repeat: no-repeat;
	margin: 0;
	background-image: url(../images/underscore.jpg);
	margin-top: 50px;
	padding-top: 10px;
}
@media (min-width: 1025px) {
	p.underscoreP{
		padding-left: 45px;
	}
}


/* @end */

/* @group pages */

.nameBadge {
	width:300px!important;
}


#page {
	padding-top:0;
	display: block;
    padding-bottom: 40px;
	margin: auto;
	max-width: 560px;
}
@media (min-width: 1025px) {
    #page {
        padding-left:40px;
        padding-right:0;
		float:left;
		margin: auto;
		max-width: none;
	}
}
 .about {
	background-position:0 30px;
	background-repeat:no-repeat;
	background-image:url(../images/about_portrait.jpg);
}

.about h1 {
	margin-bottom:248px;
}

.about h2 {
	display:block;
	width:100%;
	background-color:transparent!important;
	font-weight:normal;
	color:#ff0066;
	margin-bottom:5px;
	font-size:1.2em;
	padding:0;
}

.about p {
}

.about h3 {
	margin-bottom:300px;
	margin-bottom:0;
	font-size:1em;
	background-color:transparent!important;
	padding:0;
}

cite {
}

.pArticle {
	color:#5e5e5e;
	margin-bottom:2px;
	padding-left:10px;
	padding-right:20px;
	padding-bottom:10px;


}
@media (min-width: 1024px) {
    .pArticle {
        float:left;
        }
}
.pArticle a img{
	padding-left: 45px;
}
#page .external{
color: #666 !important;
text-decoration: underline !important;
line-height: 1.5em;
}
#page .external:hover{
color: #666 !important;
text-decoration: underline !important;
background-color: transparent !important;
}

.first {
	margin-right:25px;
}



/* @end */

/* @group box_blog */

.readon {
	background-color:#333;
	padding:0;
	color:#fff!important;
}

.readon:hover {
	background-color:#333;
	color:aqua;
}

#news h1 {
	margin-bottom:2px;
}

.nDate {
	font-size:.7em;
	color:#ccc;
}

.nTitle {
	color:aqua;
}

.nUrl {
	display:none;
}



/* @end */

/* @group box_earthfaves */

#earthfaves {
	
	float:left;
	text-align:center;
}

#earthfaves .boxbody {
	padding-top:15px;
}

#earthfaves a,#earthfaves a:hover {
	background-color:transparent!important;
}

#earthfaves h1 {
	background-color:#e56534;
	float:left;
	clear:both;
}



/* @end */

/* @group box_news */

.newsitem:hover {
	cursor:pointer;
	background-color:#7b7b7b;
}

.alternate {
	background-color:#464646;
}

#newsbox {
	font-size:1em;
	font-family:"Lucida Grande", Verdana, Arial, sans-serif;
}

#news h1 {
	margin-top:0;
}

.newsitem {
	padding-left: 5px;
	padding-bottom: 7px;
	padding-right: 5px;
	padding-top: 7px;
}

.newsbody {
	float:left;
	overflow:auto;
}

#newsbox a,#network a,#page .external {
	background-color:transparent;
	color:aqua;
	font-style:italic;
}


#network a:hover {
	color:aqua!important;
	text-decoration:underline;
	background-color:transparent!important;
	font-style:italic;
}

#newsbox {
	background-color:#333;
	padding-right:0!important;
	margin-right:0!important;
		margin-bottom: 20px;

}



/* @end */

/* @group box_network */

#network {
	padding-top:20px;
}

#network h1 {
	background-color:aqua;
	color:#333;
}

.bolder{
font-size:14px;

}


/* @end */

/* @group plugins */

#slidecounter {
	float:left;
	color:#4F4F4F;
	font:50px "Helvetica Neue", Arial, sans-serif;
	font-weight:bold;
	margin:18px 20px;
}

#slidecaption {
	overflow:hidden;
	float:left;
	color:#FFF;
	font:26px "Helvetica Neue", Arial, sans-serif;
	font-weight:bold;
	margin:33px 0;
}

/* @group scrollpane */

.jScrollPaneTrack {
	position:absolute;
	cursor:pointer;
	right:0;
	top:0;
	height:100%;
	background:#666666;
}

.jScrollPaneDrag {
	position:absolute;
	background:#999999;
	cursor:pointer;
	overflow:hidden;
}

.holder {
	float:left;
	margin:0;
}

.scroll-pane {
	width:200px;
	height:227px;
	overflow:auto;
	background:#666666;
	float:left;

}

.jScrollPaneContainer {
	width:195px!important;
	position:relative;
	overflow:hidden;
	z-index:3;
			margin-bottom: 20px;

}



/* @end */

/* @group supersized */

#supersize {
position:fixed;


}

#supersize img,#supersize a {
	height:100%;
	width:100%;
	position:absolute;
	z-index:0;
	text-decoration:none;
	outline:none;
	padding:0;

}

#supersize .prevslide,#supersize .prevslide img {
	z-index:1;
}

#supersize .activeslide,#supersize .activeslide img {
	    z-index: 2; 

}

.stamp {
	float:right;
	margin:25px 20px 0 0;
}



/* @end */

.wide {
	width:400px;
}

.super-wide {
	width:700px;
}
.galleryContainer{
	float: left;
	padding: 0;
	position: absolute;
	}
}
.tall {
	height:400px;
}



/* @end */