/*=================================================================
	Stylesheet für die Webseite www.hakaswelt.de/new   2010
		1. Kalibrierung und allgemeine Styles
		2. Styles für Layoutbereiche
		3. sonstige Styles
	===================================================================*/
	
	/*=================================================
		1. Kalibrierung und allgemeine Styles
	  =================================================*/
	  

	* { padding: 0; margin: 0; 
	}
	
	h1, h2, h3, h4, p, ul, li, ol {
		margin-bottom: 0.5em; color: #fff;
	}

	body { 
		color: #fff; /* Schriftfarbe*/
		background-attachment:fixed;padding:0px; 
		background-position: 0px 0px;
		background: #000099 url(/images/blubl85x.jpg) repeat-x left top; 
		background-attachment:fixed; padding:0px; background-position: 0px 0px;
		background-color: #000000; /*black*/ 
		font-family:  Arial, Times New Roman, Veranda, Helvetica, sans-serif;
		font-size: small; /*Schriftgröße*/
	}
	
	
	#wrapper { 
		color: black;
		background-color: #000099;	
		width: 880px;	 /*Breite des Inhaltsbereiches*/					
		border-top: 2px solid #ccc; /* Rahmen hinzugefügt*/
		border-right: 2px solid #ccc; /*Rahmen hinzugefügt*/
		border-bottom: 2px solid #ccc; /*Rahmen hinzugefügt*/
		border-left: 2px solid #ccc;
		border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
		padding:5px;
		padding-bottom:5px;
		margin-top:10px;
		margin-right: auto; /*Abstand rechts automatisch */
		margin-bottom: 10px;
		margin-left: auto; /*Abstand links automatisch*/	
	}
	
	#kopfbereich {
		position: relative; /* positioniert aber bleibt im Fluss*/
   		color: white;
		background-color: #000 ; /*Gelb-Orange*/
   		background: #000000 url(/images/rp_logo1_standart.jpg) repeat-y top left ;background-repeat:no-repeat;
		height: 90px;
   		padding-top: 20px;
   		padding-right: 20px;				
   		padding-bottom: 0px;
   		padding-left:20px;						
		border-top: 2px solid #ccc; /* Rahmen hinzugefügt*/
		border-right: 2px solid #ccc; /*Rahmen hinzugefügt*/
		border-bottom: 2px solid #ccc; /*Rahmen hinzugefügt*/
		border-left: 2px solid #ccc; /* Rahmen hinzugefügt*/
		border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
	}

	#kopfbereich p {
		color:#ffffff;
		position:absolute;
		top: 80px ;	
		right: 10px ; 
		font-weight: bold; /* fett*/
		padding: 5px 0 5px 0;
		margin-bottom: 0; 
		margin-top: 5px;
	}

	#kopfbereich p span {
		color: #cc6633; /* Schriftfarbe*/
	}

	#navibereich {
		float: left;
		width: 110px;
		padding-left: 10px;
		padding-top:5.8em;
		padding-left:10px;
	}

	#navibereich ul {
		width: 7em;
		border-top: 0px solid #f7e51f;		
	}

	#navibereich li {					/*display: inline; /*nebeneinander anzeigen*/	
		list-style-type: none;
		border-left: 0px solid #f7e51f;
		border-bottom: 3px solid #000099; /*blau zwischen den Butten*/
		margin: 0;     
	}

	#navibereich a {
		display: block; /* ganze Fläche anklickbar machen*/
		text-decoration: none;
		color: #000;
		background-color: #eee;
		padding: 4px;
		border-left: 0px solid #cc6633; 			
		border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;		/*runde butten*/					
	}

	#navibereich a:hover,
	#navibereich a:focus,
		#startseite #navi01 a,
		#galerieseite #navi02 a,
		#links #navi03 a,
		#start_reisen #navi04 a,
		#start_familie_neu #navi05 a,
		#referenzen #navi10 a,
		#gaestebuch #navi11 a,
		#impressum #navi12 a,
		#kontakt #navi13 a,
		#belize #navi14 a
		{
			color: #009900;
			background-color: white;
			background: #fff url(/images/img2_1.gif) repeat-x left bottom;
			border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;/*runde butten*/
			margin-right: 0px;
			border-left-color: #00ff00; /* ersetzt #ffe574 */
			border-bottom: none; /*Unterstreichung aus*/
		}
	
	#navibereich a:active {
		color: black;
		background-color: #d9d9d9;
		margin-right: 0px;
	}

/*Beginn Navibereich1*/
	#navibereich1 {					/*float: left;width: 110px;*/
		padding-left: 8px; /*Einrücken der Butten*/
		padding-top:0px;
	}

	#navibereich1 ul {
		width: 6.9em;
		border-top: 0px solid #cc6633;
		border-left: 0px solid #cc6633;		
	}

	#navibereich1 li {			/*display: inline;! /*nebeneinander anzeigen*/	
		list-style-type: none;
		border-left: 0px solid #cc6633;
		border-bottom: 1px solid #000099; /*blau zwischen den Butten*/
		margin: 0;     
	}

	#navibereich1 a {
		display: block; 		/* ganze Fläche anklickbar machen*/
		text-decoration: none;
		color: #000;
		background-color: #eee;
		padding: 1px 4px 0px 10px; /*Einrücken Text Untermenue*/
		border-left: 0px solid #cc6633;
	}

	#navibereich1 a:hover,
	#navibereich1 a:focus,		
		#login_start_familie_neu #navi05 a,			
			#login_bela #navi0506 a,			/*Start Untermenue Familie*/	
			#login_rpraxl #navi0507 a,
			#login_tpraxl #navi0508 a,
			#login_danneker #navi0509 a,
			#login_birnstiel #navi0510 a,
			#login_kuntze #navi0511 a,
			#login_enya #navi0512 a,
			
				#login_bela #navi05 a,		/*Button "Familie" bleibt aktiv*/					
				#login_rpraxl #navi05 a,
				#login_tpraxl #navi05 a,
				#login_danneker #navi05 a,
				#login_birnstiel #navi05 a,
				#login_kuntze #navi05 a,
				#login_enya #navi05 a,
						
				#login_galerie04_bela #navi05a, 		/*Button Familie bleibt aktiv*/
				#login_galerie05_bela #navi05 a,
				#login_galerie06_bela #navi05 a,
				#login_galerie07_bela #navi05 a,
				#login_galerie08_bela #navi05 a,
				#login_galerie09_bela #navi05 a,
				#login_galerie10_bela #navi05 a,
				#login_galerie11_bela #navi05 a,
				#login_galerie10_enya #navi05 a,
				#login_galerie11_enya #navi05 a,
				#login_galerie_10jahre #navi05 a,
				
				#login_galerie04_bela #navi0506 a, 	/*Button "Bela bleibt aktiv*/
				#login_galerie05_bela #navi0506 a,
				#login_galerie06_bela #navi0506 a,
				#login_galerie07_bela #navi0506 a,
				#login_galerie08_bela #navi0506 a,
				#login_galerie09_bela #navi0506 a,
				#login_galerie10_bela #navi0506 a,
				#login_galerie11_bela #navi0506 a,
				#login_galerie10_enya #navi0512 a,
				#login_galerie11_enya #navi0512 a,
				
				#login_oma_75 #navi05 a,			/* Butten Familie bleibt aktiv*/
				#login_haka_53 #navi05 a,
				#login_wittenberg #navi05 a,
				#login_einladung_10jahre #navi05 a,
				#login_countdown #navi05 a,
				#login_feier #navi05 a,
				#login_thomas_amerika #navi05 a,
				#login_annett_deutschland #navi05 a,
				#login_ueberraschung_mallorca #navi05 a,
				#login_mexico2010 #navi05 a,
				#login_mexico2010_kritik #navi05 a,
				#login_mailo #navi05 a,
				#login_hochzeit_annett #navi05 a,
				
		#reisen_start_reisen #navi04 a,						
			#reisen_portugal #navi0402 a,			/*Start Untermenue Reisen*/
			#reisen_florida #navi0401 a,
			#reisen_neuseeland #navi0403 a,
			#reisen_brasilien #navi0404 a,
			#reisen_cuba #navi0405 a,
			#reisen_australien #navi0406 a,
			#reisen_mexico #navi0407 a,
			#reisen_mallorca #navi0408 a,
			#reisen_belize #navi0411 a,
			

				#reisen_galerie03_cuba #navi04 a, 		/*Button Reisen bleibt aktiv*/
				#reisen_galerie04_australien #navi04 a, 
				#reisen_galerie05_florida #navi04 a, 
				#reisen_galerie06_portugal #navi04 a,
				#reisen_galerie07_neuseeland #navi04 a,
				#reisen_galerie08_brasilien #navi04 a,
				#reisen_galerie09_mallorca #navi04 a,
				#reisen_galerie10_mexico #navi04 a,
				#reisen_galerie10_belize #navi04 a,
								
				#reisen_galerie03_cuba #navi0405 a, 
				#reisen_galerie04_australien #navi0406 a,
				#reisen_galerie05_florida #navi0401 a,
				#reisen_galerie06_portugal #navi0402 a,
				#reisen_galerie07_neuseeland #navi0403 a,
				#reisen_galerie08_brasilien #navi0404 a,
				#reisen_galerie09_mallorca #navi0408 a,
				#reisen_galerie10_mexico #navi0407 a,
				#reisen_galerie10_belize #navi0411 a{																

		color: #009900;
		background-color: white;
		background: #fff url(/images/img2_1.gif) repeat-x left bottom;/*Hintergrundverlaufsgrafik 1x30px*/
		border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;/*runde butten*/
		border-left-color: #00ff00; /* ersetzt #ffe574 */
		border-bottom: none; /*Unterstreichung aus*/
	}
	
	#navibereich1 a:active {
		color: black;
		background-color: #d9d9d9;
	}
/*Ende Navibereich1*/

	#textbereich {
		padding-top: 20px ;
		padding-right: 10px;
   		padding-bottom: 20px;
   		padding-left: 20px;
   		margin-left: 130px;					
	}
	
	#textbereich p {
		font-size: 13px;       		/*normale Schriftgroesse*/
		color:#ffffff;	       		/*Textfarbe weiß*/				
		font-weight: normal; 		/* small,normal,bold*/
		padding: 5px 1em 5px 0; 	/*top,right,bottom,left*/
		margin: 0 1px 0 0; 			/*top,right,bottom,left*/								
	}
	
	#textbereich p span {
		color: #cc6633; /* Schriftfarbe*/
	}
		
	div.galerie {
		background: #eee url(images/img2_2.gif) repeat-x left ;
		width: 500px;
		padding: 10px;
		padding: 25px;
		border: 1px solid black;
		margin: 0 3px 3px 0;
	}

	* html div.galerie {height: 1%;}/*für IE*/

	html { height: 101% } /*erzwingt Scrollbar im Firefox*/

	div.galerie img {
		float: left;
		margin-right: 15px;
	}
		
	#logo { /*Gestalte das HTML-Element mit id="logo" */
		color: black;
   		background-color: transparent;
   		border: 0px solid #d9d9d9;
	}

	#fussbereich {
		color: white;
		background-color: #000; 
		background: #000000 url(/images/blubl85x.jpg) repeat-x left top;
   		padding-top: 1px; 				/*unterhalb Rahmenlinie*/
   		padding-right: 20px;  		  					
		padding-bottom: 5px;
   		padding-left: 10px;
		margin-bottom: 1px;
		border: 2px solid #ccc;		
		border-radius: 10px;			/*Radius*/
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
	}
	address {
		text-align: right; 		/*Rechtsbündig*/ 
   		font-size: 80%;     	/*etwas kleiner*/
   		font-style: normal; 	/*normale Schrift, nicht kursiv*/
   		letter-spacing: 2px;	/*Abstand zwischen den Buchstaben*/
   		line-height: 1.0em; 	/*Zeilenabstand*/					
	} 

/*Überschriften*/			
	h1 { font-size: 200%;/*nur im Kopfbereich*/
		font-weight: normal;
		color: #ffffff;
		letter-spacing: 2px;/*Buchstabenabstand*/
		margin-bottom: 0;
		margin-top: 60px; /* Achtung unterschiedliche Positionen im IE und Firefox ???*/
		margin-left: 195px;
	}
	
	h2 { font-size: 80%; color: white; 
	}
	
	h3 { font-size: 150%; 
		color: white;
		font-weight: normal; 
		margin: 0 0 0.5em 0;
	}
	
	h4 { font-size: 120%; 
		font-weight: normal;
		color: white;
	}
	
	h5 { font-size: 100%;
		font-weight: normal;
		color: #ffffff;
	}
	
	h6 {font-size: 90%; 
		color: #f7e51f;
	}	
	
/*Bildgestaltung*/	
		
	.bildlinks {
		float: left;
		padding: 2px;
		border: 1px solid #ccc;
		margin-right: 10px;
		margin-bottom: 10px;
		border:1px solid #fff;
        border-radius: 5px;					/*Radius der Bilder*/
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
	}

	.bildlinkso {
		float: left;
		padding: 2px;
		border: 0px solid #ccc;
		margin-right: 10px;
		margin-bottom: 10px;					
	}

	.bildrechts {
		float: right;
		padding: 2px;
		border: 1px solid #ccc;
		margin-right: 100px;
		margin-bottom: 10px;
		margin-left: 10px;
		border:1px solid #fff;
        border-radius: 5px;					/*Radius der Bilder*/
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
	}
	
	.bildmitte {
		float: left;
		padding: 2px;
		border: 1px solid #ccc;
		margin-right: 10px;
		margin-bottom: 10px;
		border:1px solid #fff;
        border-radius: 5px;					/*Radius der Bilder*/	
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;						
	}
	
	.bildrahmen { 
		padding: 2px;
		border: 1px solid #fff;						
		border-radius: 5px 5px 5px 5px;			/*Radius der Bilder*/
        -moz-border-radius:  5px 5px 5px 5px;
        -webkit-border-radius:  5px 5px 5px 5px;
	}

	.clearing { clear: both; }
	
	a {   
		text-decoration: none;			/*Unterstreichung entfernen*/
   		outline: none;
	}

	a:link { color: #ffffff; 
	}

	a:visited { color: #cc6633; 
	}

	a:hover, a:focus {
		border-bottom: 1px solid #cc6633;
	}

	a:active {
		color:white;
   		background-color: #cc6633;	
	}
	
	.skipbox{
		color: #000;
        margin-left:2px;
        background-color:#eee;
        padding:1px;
		border:1px solid #fff;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
    }
	
	/*Nach oben*/
    .skipbox h1, .skipbox h2, .skipbox h3, .skipbox h4, .skipbox p{
		color:#000;
		padding:0 0.1em 0 0.1em;
        margin:2px 0 0 2px;
    }
	.skipbox a {color: #cc6633}
    #content #skiptocontent{
		color: #000;
        height:1px;
        float:left;
    }   	
    #textbereich .skipbox p, #textbereich .skipbox ul{
		color: #000;
        padding-left:5px;		
    }
	.skiplink {
		position: absolute;
		top: -2000px;
		left: -3000px;
		width: 0px;
		height: 0px;
		overflow: hidden;
		display: inline;
	}
	#textbereich a {
		border-bottom: 0px dotted #cc0000;
	}
	#textbereich a:hover,
	#textbereich a:focus {
		border-bottom: 0px solid #cc6633;
	}

/*Abstand nach unten*/
/*h1, h2, p, ul, ol { margin-bottem: 1em; }*/
/*verschachtelte Listen ohne Abstand*/

	ul ul {margin-bottom: 0px; 
	}	
	li {margin-left: 1.5em; 		/*Abstand von links*/
	}	

/*====================================
  Sonstige Styles
  =====================================*/
  /*Das Kontaktformular*/
	form {
		background-color: #eee;
		background-image:    url(images/img2_2.gif);
		width: 370px; /* Breite des Formulars*/
		padding:20px;
		border: 1px solid #8c8c8c;
		border-radius: 5px;			/*Radius des Formulares*/
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
	}
	label { 			/* Beschriftung auf eigener Zeile*/
		display: block;
		cursor: pointer; 		/* Mauszeiger wird zur Hand */
	}
	input#mailform-email,
	textarea {
		width: 300px;
		border: 1px solid #8c8c8c;
		margin-bottom: 1em;
	}
	input#mailform-code{
		border: 1px solid #8c8c8c;
	}
	textarea {
		height: 7em;
	}
	
	input#mailform-email:focus,
	input#mailform-code:focus,
	
	#mailform-message:focus {
		background-color: #ccff99;
	}
	
	input#mailform-email,
	#mailform-message,
	input#mailform-code {/*sonst stellt der Internet-Explorer die Eingabefelder eingerückt dar*/	
		display:inline;
	}
	
	input#mailform-submit{
		display:block;
		margin-top:1em;
	}
	.mailform-error{
		border: 1px solid #dd0000;
		width: 300px;
		color:#000000
	}					

/*Beschriftung von Bildern unterhalb*/
	.gallery-overview{
		font-size:80%;
	}
	.gallery-overview .row{
		overflow:hidden;
		width:100%;	
	}
	.gallery-overview .row{		/**ie - hack**/
		zoom:1;
	}
	.gallery-preview a{
		width:110px;	
	}
	.gallery-preview{				/*border: 1px solid #fff;*/ /*Rahmen um die Bilder 1px weiss*????*/
		float:left;
		padding: 1px;
		margin-right:10px;	
	}					


/*Nach Oben button*/ 

	a.linkbutton{
		display:inline;
		padding-top:0.5em;
		text-decoration:none;
		border-bottom:1px solid #991227;
		background-image:url(/images/skiptotop.gif);
		background-color:#eddec1;
		background-repeat: no-repeat;
		background-position:left ;
		margin-top:1em;
		margin-bottom:1em;
		text-align:left;
		padding-right:5px;
		padding-left:25px;
		padding-bottom:5px;
		border-radius: 5px 5px 5px 5px;
        -moz-border-radius:  5px 5px 5px 5px;
        -webkit-border-radius:  5px 5px 5px 5px;		
	}
	a.skiptotop{
		color:#000000;
		display:block;
		padding-top:0.1em;
		text-decoration:none;
		border-bottom:1px solid #991227;
		background-image:url(/images/skiptotop.gif);
		background-color:#eee;
		background-repeat: no-repeat;
		background-position:right ;
		margin-top:1em;
		margin-bottom:0em;
		text-align:right;
		padding-right:30px;
		border-radius: 5px 5px 0px 0px;
        -moz-border-radius:  5px 5px 0px 0px;
        -webkit-border-radius:  5px 5px 0px 0px;
	}
	
	
#update{
	
	font-size:80%;
	font-style:normal;
	letter-spacing:2px;
	line-height:1em;
	text-align:right;
	
}
/*==============================================================	
Versuch Kopfnavigation - wird hier nicht verwendet 5.2.2010
=================================================================*/
/*#navibereicht {
	text-align: left; 
	color: black;
	
	padding-top: 3px ;
	padding-right: 10px;
    padding-bottom: 2px;
    padding-left: 0px;
	border-bottom: 1px solid #8c8c8c;
}
	#navibereicht ul { margin-bottom: 0; }
	#navibereicht li {
		display: inline;
		list-style-type: none;
		width: 300px;
		margin: 0;     
		background: #8c8c8c url(../hakaswelt-new/familie/bela_favorit_roehre04_27x20.jpg);
		}
	#navibereicht a {
		color: black;
		background-color: #8c8c8c;
		padding: 1px 5px 1px 5px;
		border: 1px solid #000000;
		}

	#navibereicht a:hover,
	#navibereicht a:focus,
	#startseite #navi01 a,
	#galerieseite #navi02 a,
	#kontaktseite #navi03 a{
		color: black;
		background-color: white;
		border-bottom-color: white ;
		}
	#startseite #navi01 a,
	#kontaktseite #navi03 a {
		color: black;
		background-color: white;
		border-bottom-color: white;
	}
	#navibereicht a:active {
	color: black;
	background-color: white;
	}*/

/*Ende Kopfnavigation*/