/* ---------------------------------------------
	
	STYLE.CSS

	Erstellt von:	TR
	Erstellt am:	04.09.2006
	
	Index:			Generelle Definitionen
					Main Container
					Content Definitionen
					Footer
					Title
					Maus Symbole / Gruss / Logos
					Classes
					Navigation
					Schrift Definitionen
					Link
					Formular Definitionen
					Transformationen
					
----------------------------------------------*/


/* ---------------------------------------------
	Generelle Definitionen
----------------------------------------------*/

	* {
		padding: 0;
		margin: 0;
	}

	body {
		background-color:#FFF;
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		color: #FFF;
	}
	
	hr {
		display: none;
	}
	
	li {
		color:#FFF
	}


/* ---------------------------------------------
	Main Container
----------------------------------------------*/
	
	h1 {
		position: absolute;
		top: 0;
		left: 50%;
		background: url(../_images/_border/logo.gif) no-repeat center top;
		height: 108px;
		width: 617px;
		padding: 0;
		margin: 0 0 0 -298px;
	}

	h1 span {
		display: none;
	}

	div#main {
		width:920px;
		padding-top: 98px;
		margin: 0 auto;
	}

	div#top 	{ background:url(../_images/_border/repeat-top.gif) top repeat-x; }
	div#right 	{ background:url(../_images/_border/repeat-right.gif) right repeat-y; }
	div#bottom 	{ background:url(../_images/_border/repeat-bottom.gif) bottom repeat-x; }
	div#left 	{ background:url(../_images/_border/repeat-left.gif) left repeat-y ; }
	
	div#border-top-left 	{ background:url(../_images/_border/corner-top-left.gif) top left no-repeat; }
	div#border-top-right 	{ background:url(../_images/_border/corner-top-right.gif) top right no-repeat; }
	div#border-bottom-right { background:url(../_images/_border/corner-bottom-right.gif) bottom right no-repeat; }
	div#border-bottom-left 	{ background:url(../_images/_border/corner-bottom-left.gif) bottom left no-repeat; }


/* ---------------------------------------------
	Content Definitionen
----------------------------------------------*/

	div#content{
		padding: 10px 10px 13px 10px;
	}

	div#content-black{
		background-color: #000;
		padding: 10px;
	
	}

	div#content p {
		padding: 0;
		margin: 0 0 12px 0;
	}

	ol {
	margin-left:26px;
	
	}

/* ---------------------------------------------
	Footer
----------------------------------------------*/

	div#footer {
		width:920px;
		margin: 0 auto;
		padding-bottom:30px;
	}


/* ---------------------------------------------
	Titel
----------------------------------------------*/
	
	h2 {
		height:40px;
		padding-bottom:14px;
	}
	
	h2 span {
		display: none;
	}
	
	h2#title-h2-home {
		background:url(../_images/_content/title_home.gif) no-repeat;
		width:413px;
		height:69px;
	}
	
	h2#title-h2-start {
		background:url(../_images/_content/title_start.gif) no-repeat;
		width:248px;
	}

	h2#title-h2-maus {
		background:url(../_images/_content/title_maus.gif) no-repeat;
		width:726px;
	}

	h2#title-h2-kontakt {
		background:url(../_images/_content/title_kontakt.gif) no-repeat;
		width:110px;
	}

	h2#title-h2-erwachsene {
		background:url(../_images/_content/title_erwachsene.gif) no-repeat;
		width:262px;
	}

	h2#title-h2-impressum {
		background:url(../_images/_content/title_impressum.gif) no-repeat;
		width:148px;	
	}

	h2#title-h2-computermauspass {
		background:url(../_images/_content/title_computermaus-pass.gif) no-repeat;
		width:293px;
	}
	
	h2#title-h2-wunderkiste {
		background:url(../_images/_content/title_wunderkiste.gif) no-repeat;
		width:172px;
	}
	
	h2#title-h2-erfolgreichsenden {
		background:url(../_images/_content/title_erfolgreich.gif) no-repeat;
		width:633px;
	}

	h3#subtitle-1 {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		color:#FFF;
	}
	
	h4 {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		color:#FFF;
		margin: 16px 0 6px 0;
	}
	
	h4.title-border {
		border-bottom: 1px solid #FFF;
	}



/* ---------------------------------------------
	Maus Symbole / Gruss / Logos
----------------------------------------------*/


	div#maus-a {
		background: url(../_images/_content/mausA.gif) no-repeat;
		width: 288px;
		height: 276px;
		float: right;
	}

	div#gruss {
		background:url(../_images/_content/paw.gif) no-repeat;
		width:275px;
		height:61px;
		margin-top:20px;
	}
	
	#purzelmaus {
		background:url(../_images/_content/purzelmaus.gif) center no-repeat;
		height:120px;
	}

	#maus1 {
		background:url(../_images/_content/maus1.gif) center no-repeat;
		height:120px;
	}
	
	#maus1left {
		background:url(../_images/_content/maus1.gif) left no-repeat;
		height:120px;
	}

	#maus2{
		background:url(../_images/_content/maus2.gif) center no-repeat;
		height:120px;
	}
	
	#maus2left{
		background:url(../_images/_content/maus2.gif) left no-repeat;
		height:120px;
	}


	#maus3 {
		background:url(../_images/_content/maus3.gif) center no-repeat;
		height:120px;
	}
	
	#maus3left {
		background:url(../_images/_content/maus3.gif) left no-repeat;
		height:120px;
	}

	#maus4 {
		background:url(../_images/_content/maus4.gif) center no-repeat;
		height:120px;
	}
	
	#maus4left {
		background:url(../_images/_content/maus4.gif) left no-repeat;
		height:120px;
	}
		
	#maus5 {
		background:url(../_images/_content/maus5.gif) center no-repeat;
		height:120px;
	}
	
	#maus5left {
		background:url(../_images/_content/maus5.gif) left no-repeat;
		height:120px;
	}

	#maus6 {
		background:url(../_images/_content/maus6.gif) center no-repeat;
		height:120px;
	}
	
	#maus6left {
		background:url(../_images/_content/maus6.gif) left no-repeat;
		height:120px;
	}

	div#phr{
		background:url(../_images/_content/computermaus-phr.gif) no-repeat;
		width:152px;
		height:67px;
	}

	div#bfbt{
		background:url(../_images/_content/computermaus-bbt.gif);
		width:152px;
		height:67px;
	}

	div#clicklogo{
		background:url(../_images/_content/computermaus-clickwerk.gif) no-repeat;
		width:152px;
		height:26px;
	}


/* ---------------------------------------------
	Classen
----------------------------------------------*/

	
	.cursorhand {
		cursor:pointer;
	}
	
	.boarder-solid {
		border-top:1px solid #FFFFFF;
		padding-top:20px;
	}
	
	.clear {
		clear: both;
	}
	
	.strich-news {
		border-bottom: 1px solid #FFF ;
		width: 400px;
	}
	
	
/* ---------------------------------------------
	Navigation
----------------------------------------------*/

	ul#nav {
		list-style: none;
	}

	ul#nav li a span {
		display: none;
	}

	ul#nav li {
		display: block;
		float: left;
	}

	a#btn-start, a#btn-purzelmaus, a#btn-computermauspass, a#btn-wunderkiste, a#btn-erwachsene {
		display: block;
		float: left;
		height: 76px;
		padding-right: 8px;
	
	}

	a#btn-start {
		background:url(../_images/_menu/start.gif) left no-repeat;
		/*width: 138px;*/
		width:114px;
	}
	
	a#btn-start:hover {
		background:url(../_images/_menu/start_a.gif) left no-repeat;
	}

	a#btn-start-aktiv {
		background:url(../_images/_menu/start_a.gif) left no-repeat;
	}
	
	a#btn-purzelmaus {
		background:url(../_images/_menu/purzelmaus.gif) left no-repeat;
		/*width:200px;*/
		width:164px;
	}
	
	a#btn-purzelmaus:hover {
		background:url(../_images/_menu/purzelmaus_a.gif) left no-repeat;
	}

	a#btn-computermauspass {
		background:url(../_images/_menu/computermauspass.gif) left no-repeat;
		/*width: 312px;	*/
		width:264px;
	}

	a#btn-computermauspass:hover {
		background:url(../_images/_menu/computermauspass_a.gif) left no-repeat;	
	} 

	a#btn-wunderkiste {
		background:url(../_images/_menu/wunderkiste.gif) left no-repeat;
		/*width: 169px;*/
		width:114px;
	}

	a#btn-wunderkiste:hover {
		background:url(../_images/_menu/wunderkiste_a.gif) left no-repeat;
	}

	a#btn-erwachsene {
		background:url(../_images/_menu/erwachsene.gif) left no-repeat;
		/*width: 226px;*/
		width:184px;
	}

	a#btn-erwachsene:hover {
		background:url(../_images/_menu/erwachsene_a.gif) left no-repeat;
	}

	div#menu-strich {
		background:url(../_images/_menu/menu_strich.gif) left no-repeat;
		height: 18px;
	}


/* ---------------------------------------------
	Schrift Definitionen
----------------------------------------------*/

	span.highlight {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		color:#FF6300;
	}

	.link-normal a:visited, a:active, a:hover {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		color: #FF6300;
	}

	span.font-bold {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		color:#FFF;
	}

	span.news-bold {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		color:#FF6300;
	}
	
	span.font-bold-red {
		font: 14px/20px Verdana, Arial, Helvetica, sans-serif;
		font-weight:bold;
		color:#FF6300;
	}
	
	
/* ---------------------------------------------
	Link
----------------------------------------------*/
	
	a.link-clickwerk, a.link-clickwerk:hover {
		color:#FF6300;
		text-decoration:none;
		margin-left: 10px;
		background:url(../_images/_border/www-clickwerk-ch.gif) no-repeat center left;
		padding-left: 12px;
		font-size: 10px;
	}

	a.link-cm {
		color:#FF6300;
		text-decoration:none;
	}
	
	a.link-cm-bold, a.link-cm-bold:hover {
		color:#FF6300;
		text-decoration:none;
		font-weight:bold;
	}
	
	
	a.footer-right {
		float: right;
		color: #FF6300;
		margin: 0 10px 0 0;
		text-decoration: none;
	}
	
	span.datum-news {
		color:#FFF;
		font-size: 10px;
		font-weight:bold;
	}


/* ---------------------------------------------
	Formular Definitionen
----------------------------------------------*/

	.formbox {
		background-color:#000000;
		border: 1px solid #FFF; 
		width: 200px;
		color:#FFF;
	}
	
	.formpass {
		background-color:#000000;
		border: 1px solid #FFF; 
		width: 60px;
		color:#FFF;
	}
	
	.formSend {
		color:#FFF;
		border: 1px solid #FFF; 
		width: 90px;
		background-color:#000;
	}
	
/* ---------------------------------------------
	Transformation
----------------------------------------------*/

	.object-center{
	center;
		
	}
	
	.text-center{
	text-align:center;
	
	}