/*@charset "UTF-8";
/* CSS Document */

html {
	background: #000 url( "dark/background.png" ) repeat-x;
	cursor: default;
}

body {
	color: #aaa;
	font: 0.85em "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	margin: 0;
	min-width: 720px;
}

a:link {
	color: #eee;
	font-weight: bold;
}

a:visited {
	color: #777;
}

a:hover {
	background: #aaa;
	color: #000;
}

a:active {
	background: #aaa;
	color: #eee;
}

a img	{
	border: 0;
	vertical-align: top;
}

a[href^="http"] {
	padding: 0 1.5em 0 0;
	background: url( "dark/externalLink.png" ) no-repeat 100% 60%;
}

a[href^="http"]:active, a[href^="http"]:hover {
	background: #aaa url( "dark/externalLink.png" ) no-repeat 100% 60%;
}

a[href*="kwasi-ich.de"] {
	padding: 0;
	background: none;
}

a[href*="kwasi-ich.de"]:active, a[href*="kwasi-ich.de"]:hover {
	background: #aaa;
}

acronym, abbr {
	border-bottom: 1px dotted #aaa;
}

hr {
	border-top: 1px solid #666;
	border-bottom: 1px solid #999;
	border-right-style: none;
	border-left-style: none;
}

h1, h2, h3, h4, h5, h6 {
	/*font-weight:	bolder;*/
	color: #eee;
	/*margin: 1.5em 0 0.5em 0;*/
}

h1 {
	font-size: xx-large;
	text-align: center;
	color: #fff;
}

h2 {
	font-size: x-large;
}

h3 {
	font-size: large;
}

h6 {
	font-size:	xx-small;
}

li {
	margin: 0.5em 0;
}

/*
li h4 {
	margin-bottom: 0.5em;
}

li p {
	margin: 0;
}
*/

blockquote {
	margin: 0.5em;
	padding: 1em;
	background: #222;
}

blockquote cite {
	display:block;
	text-align: right;
	margin: 0;
	font-size:	x-small;
	color: #eee;
	font-weight:bold;
}

blockquote p {
	margin: 0;
}

dt {
	color: #eee;
	font-weight:bold;
	margin: 1.33em 0 0.5em 0;
}

dd p {
	margin: 0;
}

pre {
	margin: 0.5em;
	padding: 1em;
	background: #222;
	border: 1px solid #444;
}

pre code {
	padding: 0em;
	background: transparent;
}

code, kbd, samp {
	padding: 0.25em;
	background: #222;
}

strong {
	color:	#fff;
}

.hide	{
	display:	none;
}

.center	{
	padding: 10px;
	text-align: center;
}

.center * {
	vertical-align: middle;
}

/* global header */

#gHead a {
	text-decoration: none;
}

#gHeadHierarchy {
	padding: 1.5em 3em;
	margin: 0;
	text-align: right;
}

#gHeadHierarchy a:visited {
	color: #eee;
}

#gHeadHierarchy a:hover {
	color: #000;
}

#gHeadHierarchy a:active {
	background: #aaa;
	color: #eee;
}

#gHeadNavi {
	margin: 0 0 0 12.5%;
}

#gHeadNavi a {
	color: #000;
}

#gHeadNavi a:hover {
	background: transparent;
	color: #eee;
}

#gHeadRed	{
	overflow: hidden;
}

#gHeadRedCapLeft	{
	background: url( "dark/redCapLeft.png" ) no-repeat;
	height: 44px;
	width: 13px;
}

#gHeadRedBody	{
	background: url( "dark/redRepeat.png" ) repeat-x;
	height:	44px;
	line-height: 43px;
	margin: -44px 0 0 13px;
	white-space: nowrap;
}

#gHeadRedBody a	{
	padding: 0 0.5em;
}

#gHeadYell	{
	margin: -3px 0 0 14.3%;
	overflow: hidden;
	/*white-space: nowrap;
/*	min-width: 525px;	/*0.75 * minwidth*/
}

#gHeadYellCapLeft	{
	background: url( "dark/yellowCapLeft.png" ) no-repeat;
	float: left;
	height: 22px;
	width: 13px;
}

#gHeadYellBody	{
	background: url( "dark/yellowRepeat.png" ) repeat-x;
	float: left;
	height: 22px;
	line-height: 21px;
	margin: 0;
	width: auto;
	white-space: nowrap;
}

#gHeadYellBody a	{
	padding: 0 0.75em;
}

#gHeadYellBody span.private {
	padding: 0 0 0 1em;
	background: url( "dark/private.png" ) no-repeat 0 60%;
}

#gHeadYellCapRight	{
	background: url( "dark/yellowCapRight.png" ) no-repeat;
	float: left;
	height: 22px;
	width: 13px;
}

#gHead hr	{
	display: none;
}


/* body */

#gBody	{
	min-height: 528px; /* = 640 - padding - gHead height*/
	padding: 0.5em 6.25%;
	text-align: justify;
}


/* global footer */

#gFoot	{
	padding: 0.75em 0;
}

#gFoot hr	{
	display: none;
}

#gFoot h6	{
	margin: 1em 0;
	text-align: center;
}



/*item list*/

ul#list	{
	list-style-type: none;
	margin: 2em 2% 0 2%;
	padding: 0;
}

ul#list li	{
	margin:	1em;
	padding:	0;
	height:	192px;
}

ul#list li div	{
	margin: -192px 0 0 256px;
}

/*item list*/

ul.list128	{
	list-style-type: none;
	margin: 2em 2% 0 2%;
	padding: 0;
}

ul.list128 li	{
	margin:	1em;
	padding:	0;
	height:	128px;
}

ul.list128 span a:hover {
	background: transparent;
}

ul.list128 li div	{
	margin: -128px 0 0 192px;
}


/*image array*/

div#imageArray	{
	margin: 2em 2.5%; /* 0 2.5%;*/
	padding: 0;
	/*text-align: justify; inherited*/
}

/*div#imageArray li	{
	display:	inline;
}*/

div#imageArray a:hover {
	background: transparent;
}

div#imageArray a img	{
	margin: 8px 7px;
	border: 2px solid #aaa;
	vertical-align:	middle;
}

body	{
	/*background: url( "dark/_backgroundSafari.png" ) no-repeat right 78px;*/
}

body.NGError	{
	background: url( "dark/backgroundError.png" ) no-repeat 90% 100px;
}

body.NGRoot	{
	background: url( "dark/backgroundKwasi.png" ) no-repeat right 78px;
}

body.NGPhotos	{
	background: url( "dark/backgroundPhotos.png" ) no-repeat right 78px;
}

body.NGSoftware	{
	background: url( "dark/backgroundSoftware.png" ) no-repeat right 78px;
}

body.NG	{
	background: #000 url( "dark/background.png" ) repeat-x;
}

body	{
	background-color: #000;
}

.hilit{
	background: #d44;
	color: #fff;
}





/* hispot */

#gHighlight	{
	display: none;
}

div#hlButton {
	display: block;
	position: absolute;
	right: 20px;
	background: url( "dark/hispot.png" ) no-repeat;
	height: 44px;
	margin: -0px 0 0;
	width: 48px;
	overflow: hidden;
	line-height: 200px;
}

div#hlButton:hover {
	background: url( "dark/hispot.png" ) no-repeat 0px -44px;
}

div#hlButton.inactive	{
	background-position: 0px 0px;
}

div#hlButton.inactive:hover	{
	background-position: 0px -44px;
}

div#hlButton.active	{
	background-position: 0px -44px;
}

div#hlButton.active:hover	{
	background-position: 0px 0px;
}

div#hlButton.open	{
	background-position: 0px -88px;
}

div#hlButton.open:hover	{
	background-position: 0px -88px;
}

#hlWindow {
	z-index: 997;
	display: none;
	margin: 42px 0 0;
	overflow: hidden;
	position: absolute;
	right: 20px;
	width: 320px;
}

#hlBar {
	background: #c00 url( "dark/hispotInputBackRepeat.png" ) repeat-x;
	color: #000;
	height: 32px;
	line-height: 32px;
	padding: 0 10px 0 0;
	text-align: right;
	overflow: hidden;
}

#hlBar span {
	color: #eee;
	height: 20px;
	line-height: 20px;
	padding: 0 8px 0 20px;
}

div#hlAsync {
	width: 16px;
	height: 16px;
	background: url( "dark/async.png" ) repeat-y 0 0;
	top: 8px;
	left: 8px;
	position: relative;
	margin: 0 0 -16px 0;
	visibility: hidden;
}

span#hlImageCounter  {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 0;
	display: none; /*inline*/
}

span#hlTextCounter  {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 -40px;
	display: none; /*inline*/
}

#hlInput	{
	width: 160px;
}

#hlOutput {
	background: url( "dark/hispotResultRepeat.png" );
	display: none;
	padding: 4px 0 0;
}

#hlOutput a {
	display: block;
	color: #000;
	text-decoration: none;
	height: 20px;
	line-height: 20px;
	padding: 0 8px 0 32px;
}

#hlOutput a:hover {
	background: url( "dark/hispotResultSelectedRepeat.png" ) repeat-x;
	color: #fff;
}

#hlResults a span  {
	margin: 0 0 0 -24px;
	padding: 0 0 0 24px;
}

#hlResults a span.txt {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 -60px;
}

#hlResults a:hover span.txt {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 -40px;
}

#hlResults a span.img {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 -20px;
}

#hlResults a:hover span.img {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 0;
}

#hlResults a span.imgtxt {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 -100px;
}

#hlResults a:hover span.imgtxt {
	background: url( "dark/hispotTypeIcons.png" ) no-repeat 0 -80px;
}


a#hlWindowShowAll {
	margin-bottom: 4px;
	display: none;
}

span#hlWindowShowingOne, span#hlWindowShowingAll {
	display: none;
	color: #777;
	padding: 0 8px 0 32px;
	height: 20px;
	line-height: 20px;
	margin-bottom: 4px;
}

span#hlWindowNotFound {
	display: block;
	color: #777;
	padding: 0 8px 0 32px;
	height: 20px;
	line-height: 20px;
}

#hlBottomCap {
	background: url( "dark/hispotResultCap.png" ) no-repeat;
	height: 4px;
	display: none;
}


@media screen and (-webkit-min-device-pixel-ratio: 2) {
	html {
		/*background-image: url( "dark/background_2x.png" );*/
	}
		
	a[href^="http"] {
		background-image: url( "dark/externalLink_2x.png" );
		background-size: 17px 8px;
	}

	a[href^="http"]:active, a[href^="http"]:hover {
		background-image: url( "dark/externalLink_2x.png" );
		background-size: 17px 8px;
	}

	a[href*="kwasi-ich.de"] {
		padding: 0;
		background: none;
	}
	
	a[href*="kwasi-ich.de"]:active, a[href*="kwasi-ich.de"]:hover {
		background: #aaa;
	}
	
	#gHeadRedCapLeft	{
		background-image: url( "dark/redCapLeft_2x.png" );
		background-size: 13px 44px;
	}
	
	#gHeadRedBody	{
		background-image: url( "dark/redRepeat_2x.png" );
		background-size: 4px 44px;
	}
	
	#gHeadYellCapLeft	{
		background-image: url( "dark/yellowCapLeft_2x.png" );
		background-size: 13px 22px;
	}
	
	#gHeadYellBody	{
		background-image: url( "dark/yellowRepeat_2x.png" );
		background-size: 4px 22px;
	}
	
	#gHeadYellBody span.private {
		background-image: url( "dark/private_2x.png" );
		background-size: 8px 10px;
	}
	
	#gHeadYellCapRight	{
		background-image: url( "dark/yellowCapRight_2x.png" );
		background-size: 13px 22px;
	}
	
	body	{
		/*background-image: url( "dark/_backgroundSafari_2x.png" );*/
	}
	
	body.NGError	{
		background-image: url( "dark/backgroundError_2x.png" );
		background-size: 320px 320px;
	}
	
	body.NGRoot	{
		background-image: url( "dark/backgroundKwasi_2x.png" );
		background-size: 640px 173px;
	}
	
	body.NGPhotos	{
		background-image: url( "dark/backgroundPhotos_2x.png" );
		background-size: 449px 230px;
	}
	
	body.NGSoftware	{
		background-image: url( "dark/backgroundSoftware_2x.png" );
		background-size: 437px 304px;
	}
	
	body.NG	{
		/*background-image: url( "dark/background_2x.png" );*/
	}
	
	div#hlButton {
		background-image: url( "dark/hispot_2x.png" );
		background-size: 48px 132px;
	}
	
	div#hlButton:hover {
		background-image: url( "dark/hispot_2x.png" );
		background-size: 48px 132px;
	}
	
	#hlBar {
		background-image: url( "dark/hispotInputBackRepeat_2x.png" );
		background-size: 4px 32px;
	}
	
	div#hlAsync {
		background-image: url( "dark/async_2x.png" );
		background-size: 16px 192px;
	}
	
	span#hlImageCounter  {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	span#hlTextCounter  {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlOutput {
		background-image: url( "dark/hispotResultRepeat_2x.png" );
		background-size: 4px 4px;
	}
	
	#hlOutput a:hover {
		background-image: url( "dark/hispotResultSelectedRepeat_2x.png" );
		background-size: 4px 20px;
	}
	
	#hlResults a span.txt {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlResults a:hover span.txt {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlResults a span.img {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlResults a:hover span.img {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlResults a span.imgtxt {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlResults a:hover span.imgtxt {
		background-image: url( "dark/hispotTypeIcons_2x.png" );
		background-size: 20px 120px;
	}
	
	#hlBottomCap {
		background-image: url( "dark/hispotResultCap_2x.png" );
		background-size: 320px 4px;
	}

}

