@CHARSET "ISO-8859-1";

.characters {
	height: 600px;
	background: url(/images/character/characterBackground.jpg) center top no-repeat;
	}
	
.characters #container #content {
	padding: 0 5px;
	}

.character.schnattke {
	background: url(/images/character/bubbleSchnattke.jpg) right 85px no-repeat;
	}

.character.nestor {
	background: url(/images/character/bubbleNestor.jpg) right 85px no-repeat;
	}

.character.promi {
	background: url(/images/character/bubblePromi.jpg) right 200px no-repeat;
	}

.character.polli {
	background: url(/images/character/bubblePolli.jpg) right 55px no-repeat;
	}

.character .aboutCharacter {
	width: 560px;
	margin: 0 0 20px 0;
	}
	
.character.promi .aboutCharacter {
	width: auto;
	}
	
.character .projectCharacter {
	width: 600px;
	background: url(/images/dottedLine.gif) left top repeat-x;
	}
	
.character .innerProjectCharacter {
	width: 570px;
	background: url(/images/dottedLineVertical.gif) right top repeat-y;
	padding: 11px 30px 0 0;
	position: relative;
	}
	
.character a {
	color: #0086c4;
	text-decoration: underline;
	}
	
.character .showUserBoxContent {
	width: 540px;
	height: 200px;
	padding: 0 0 10px 0;
	margin: 0 0 10px 0;
	position: relative;
	overflow: hidden;
	}

.character.promi .showUserBoxContent {
	width: 540px;
	height: 280px;
	padding: 0 0 10px 0;
	margin: 0 0 10px 0;
	position: relative;
	overflow: hidden;
	}
	
.character .scrollableContent {
	position: absolute;
	width: 540px;
	clip: rect(0px, 540px, 200px, 0px);
	padding: 0 0 10px 0;
	overflow: hidden;
	}
	
.character.promi .scrollableContent {
	position: absolute;
	width: 540px;
	clip: rect(0px, 540px, 280px, 0px);
	padding: 0 0 10px 0;
	overflow: hidden;
	}
	
.character .showScrollButtons {
	position: absolute;
	width: 17px;
	right: 15px;
	top: 50px;
	height: 200px;
	}
	
.character.promi .showScrollButtons {
	position: absolute;
	width: 17px;
	right: 15px;
	top: 50px;
	height: 280px;
	}
	
.character .showScrollButtons a {
	display: block;
	width: 17px;
	height: 17px;
	text-indent: -19999px;
	position: absolute;
	}
	
.character .showScrollButtons a:focus {
	outline: none;
	}
	
.character .showScrollButtons a.scrollUp {
	background: url(/images/buttons/scrollUp.gif) 0 0 no-repeat;
	top: 0px;
	left: 0px;
	}
	
.character .showScrollButtons a.scrollDown {
	bottom: 0px;
	left: 0px;
	background: url(/images/buttons/scrollDown.gif) 0 0 no-repeat;
	}
	
.character .showScrollButtons #track {
	position: absolute;
	left: 1px;
	top: 17px;
	width: 15px;
	height: 168px;
	background: #E5E4E4;
}

.character.promi .showScrollButtons #track {
	position: absolute;
	left: 1px;
	top: 17px;
	width: 15px;
	height: 248px;
	background: #E5E4E4;
}

.character .showScrollButtons #handle {
	position: absolute;
	left: 0;
	top: 0;
	width: 15px;
	height: 15px;
	background: #CFCFCF;
}