@charset "utf-8";
/* ---------------------------------------------------
Title: ELMAU - Main Style Sheet
Author: Pierpaolo Federici - Ideenwerkstatt Tintifax
------------------------------------------------------

Colors: 
rot		-	rgb(204, 67, 47)
blau	-	rgb(0, 104, 170)

------------------------------------------------------ */
@import "reset.css";
@import "type.css";
@import "navigation.css";
@import "bilder.css";

body{
	background:url(../_bilder/bg_blue.jpg) repeat-x top center;
	height:100%;
	color:#FFFFFF;
}

/* ############################################ WRAPPER */
#wrapper {
	position:relative;
	width: 100%; height:100%;
	background:url(../_bilder/bg_pflanze.png) no-repeat fixed right bottom;
}

#wrap{
	margin: 0 auto;	width:960px;
}

/* ############################################ HEAD */

#head{ width:960px; height:320px; }

h1 {	/* logo */
	position:absolute;
	text-decoration:none;
	border:0;
	width : 119px;
	height : 90px;
	margin : 8px 25px 0;
	padding : 0;
	background : url(../_bilder/logo.png) no-repeat 0 0;
}
 
h1 a { /* logo-text */
	display : block;
	height : 119px;
	text-indent : -9999px; 
}

#schatten{
	background:url(../_bilder/schatten_head.png) no-repeat top center;
	height:10px;
	margin-bottom:10px;
}

a.schlittenfahrt{
	position:relative;
	display:block;
	top:205px;
	left:845px;
	width:150px;
	height:150px;
	background: url(../_bilder/reiterparadies.png) no-repeat top left;
	z-index:10;
}
	a.schlittenfahrt:hover{ background-position: -157px 0; }

#schneebericht a{
	position:absolute;
	top:0; margin-left:855px;
	text-decoration:none;
	border:0;
	width : 125px;
	height : 55px;
	padding : 0;
	background : url(../_bilder/wetterinfos.png) no-repeat 0 0;
	text-indent : -9999px; 
}
#schneebericht a:hover{
	background-position: -127px 0;
}

/* ############################################ COL-LEFT */

#index #col-left{ width:490px; float:left; }

#col-left{ width:270px; float:left; }

	.box-485{
		position:relative;
		width:475px; height:142px;
		text-align:right;
		padding:10px 10px 0 0;
		margin-bottom:10px;
	}
	.pfeil a{
		position:absolute;
		background:url(../_bilder/pfeil.png) no-repeat 0 0;
		width:23px;	height:21px;
		display:block;
		right:10px;
	}
	.pfeil a:hover{ background-position: 0px -21px; }
	
	span.schatten-485{
		position:absolute;
		display:block;
		width:485px; height:10px;
		background:url(../_bilder/schatten_485.png) no-repeat center center;
		bottom:0;
		left:0;
	}
	
	.box-kinderparadies{ background:url(../_bilder/box_kinderparadies.jpg) no-repeat 0 0; }
	.box-bauernhaus{ background:url(../_bilder/box_bauernhaus.jpg) no-repeat 0 0; }
	.box-zimmer{ background:url(../_bilder/box_zimmer.jpg) no-repeat 0 0; }
	
	
	/* seiten */
	
	.box-215{
		position:relative;
		width:215px; height:137px;
		margin:0 0 10px 40px;
	}
	span.schatten-215{
		position:absolute;
		display:block;
		width:215px; height:10px;
		background:url(../_bilder/schatten_215.png) no-repeat center center;
		bottom:0;
		left:0;
	}
	span.zoom a{
		display:block;
		width:215px;
		height:137px;
		background:url(../_bilder/zoom.png) no-repeat 191px 0px;
	}
	span.zoom a:hover{background-position: 165px -24px;}
	
	span.zur_galerie a{
		margin:5px 37px 13px;
		display:block;
		width:219px;
		height:28px;
		background:url(../_bilder/pfeil.png) no-repeat -23px 0px;
	}
	span.zur_galerie a:hover{background-position: -23px -28px;}
	
/* ############################################ COL-RIGHT */

#col-right{
	width:440px;
	float:left;
	margin-left:20px;
}

	#index .box-news{
		position:relative;
		padding:20px 10px 0;
		width:430px; height:119px;
		margin-top:3px;
		background-image: url(../_bilder/bg-blue-transp.png);
	}
	#index .box-450{
		position:relative;
		padding:20px 10px 0;
		width:430px; height:280px;
		margin-top:23px;
		background-image: url(../_bilder/bg-blue-transp.png);
	}
		#menu-akt{
			position:absolute;
			margin:-24px -10px 0;
			z-index:1;
		}
			span.dienst a, span.hofakt a{
				display:block;
				float:left;
				padding:14px;
				width:197px;
			}
			span.dienst a{background: url(../_bilder/pfeil.png) no-repeat 1px -79px; color: #75D2FF;}
			span.dienst a.current{background-position: 1px -131px; color:rgb(0, 104, 170);}
			span.hofakt a{background: url(../_bilder/pfeil.png) no-repeat -224px -131px; color: #75D2FF;}
			span.hofakt a.current{background-position:-224px -79px; color:rgb(0, 104, 170);}
			
			span.dienst a:hover, span.hofakt a:hover{color:rgb(204, 67, 47);}
			
		#slide_1, #slide_2{
			position:absolute;
			margin-top:25px;
		}
			
	span.top-450{
		position:absolute;
		display:block;
		width:450px; height:3px;
		top:0; left:0;
		margin-top:-3px;
		background:url(../_bilder/top_450.gif) no-repeat bottom center;
		font-size:0px; /* ie6 fix */
	}
	span.schatten-450{
		position:absolute;
		display:block;
		width:450px; height:10px;
		background:url(../_bilder/schatten_450.png) no-repeat center center;
		bottom:-10px;
		left:0;
		font-size:0px; /* ie6 fix */
	}
	
	/* seiten */
	
	.box-550{
		position:relative;
		width:500px; height:375px;
		padding:1px 25px 0;
		margin-top:20px;
		background-image: url(../_bilder/bg-blue-transp.png);
	}
	span.top-550{ width:550px; background:url(../_bilder/top_550.png) no-repeat bottom center }
	span.schatten-550 { width:550px; background:url(../_bilder/schatten_550.png) no-repeat center center; }
	
	#familie .box-550{height:253px; margin-bottom:20px;}
	#geschichte .box-550{height:525px; margin-bottom:20px;}
	#preise .box-550{height:3500px; margin-bottom:20px;}
	#wandern .box-550{height:425px; margin-bottom:20px;}
	#sommer .box-550{height:525px; margin-bottom:20px;}
	#kinder .box-550{height:623px; margin-bottom:20px;}
	#kinder-malwettbewerb .box-550{height:315px; margin-bottom:20px;}
	#kinder-melkwettbewerb .box-550{height:315px; margin-bottom:20px;}
	#tiere .box-550{height:425px; margin-bottom:20px;}
	#anfrage .box-550{height:820px; margin-bottom:20px;}
	#reiterparadies .box-550{height:530px; margin-bottom:20px;}
	#reiterparadies-sommer .box-550{height:820px; margin-bottom:20px;}
	
	.box-890{
		position:relative;
		width:890px; height:650px;
		padding:1px 25px 0;
		margin-top:20px;
		background-image: url(../_bilder/bg-blue-transp.png);
	}
	span.top-890{ width:550px; background:url(../_bilder/top_550.png) no-repeat bottom center }
	span.schatten-890 { width:550px; background:url(../_bilder/schatten_550.png) no-repeat center center; }
	
	/* galerie */
	
	.galerie{float:left; width:250px; margin:15px 0 10px 35px;}
	.galerie div {margin-bottom:20px;}
	
	/* pflegetiere */
	
	.box-910{
		position:relative;
		width:860px; height:650px;
		padding:1px 25px 0;
		margin:20px 27px 30px;
		background-image: url(../_bilder/bg-blue-transp.png);
	}
	
	span.top-910{ width:910px; height:5px; margin-top:-5px; background:url(../_bilder/top_910.png) no-repeat top center }
	span.schatten-910 { width:910px; background:url(../_bilder/schatten_910.png) no-repeat center center; }
	
	.pflegetiere { width:180px; height:95px; padding:30px 15px; float:left; }
	.pflegetiere img {position:absolute; border:1px solid #75D2FF; padding:10px; background-color:#246AAC}
	.pflegetiere span {
		position:absolute;
		float:left;
		background-color: #246AAC;
		margin:-10px 10px 0;
		width:177px;
		text-align:center;
	}
	
	/* preise */
	
	.pauschalen_logos{
		display:block;
		position:absolute;
		width:110px;
		height:45px;
		right:25px;
		margin-top:-28px;
		background-position:top left;
	}
	.oster{background:url(../_bilder/pauschalen_oster.png) no-repeat}
	.schneewutzel{background:url(../_bilder/pauschalen_schneewutzel.png) no-repeat; width:80px; height:80px; margin-top:-50px}
	.lady{background:url(../_bilder/pauschalen_lady.png) no-repeat}
	.sixty{background:url(../_bilder/pauschalen_sixty.png) no-repeat}
	
	/* tabelle */
		table#preise{
				border-collapse: separate;
				border-spacing: 5px;
			}
				table#preise td {width:20%; padding:0 10px;}
				table#preise th{ padding:8px 10px; background-color:rgb(0, 104, 170); border-bottom:1px solid rgb(204, 67, 47);}
				
				table#preise thead {text-align:left;}

				table#preise tr.preise {font-weight:bold;}
				
				table#preise p { line-height:1em; }
				#reiterparadies-sommer table#preise p{margin:0; line-height:1.2em;}
				
	/* list */
		ul#index{list-style: disc; padding:0 20px 0}
		ul#index li{ line-height:1.5em;}
		
		li.li_14px{font-size:14px;} 
		
	/* form */
	
		fieldset {
			border:1px solid #FFFFFF;
			padding:10px 15px;
			margin:0 5px;
			}
		fieldset legend{padding:10px;}
		
		fieldset li{
			list-style:none;
			float:left;
			margin-bottom:5px;
		}
		
		fieldset span{ float:left; line-height:22px; }
			
		fieldset span.unterkunft{ width:130px; }
		fieldset span.termin{ width:50px; }
		fieldset span.bauern{ width:130px; }
		
		fieldset span.daten{ width:50px; }
		fieldset span.ort{ width:35px; margin-left:7px; }
		
		fieldset.termin { width:208px; float:left; }
		
		fieldset input { float:left; margin-right:10px; }
		fieldset input:focus, fieldset input:hover { background-color: #D7EBFF }
		
		fieldset input.date { float:left; margin:0 3px; }
		fieldset input.plz { float:left; margin:0 3px; }
		fieldset input.ort { float:left; width:230px; }
		fieldset input.email { float:left; width:186px; }
		
		fieldset textarea{ width:388px; height:100px; }
		
		fieldset .radio1 { width:45px; }
		fieldset .radio2 { margin-left:20px; width:80px; }
		
		#msg {
			display:none;
			position:absolute;
			z-index:200;
			background:url(../_bilder/msg_arrow.gif) left center no-repeat;
			padding-left:7px
			}
		#msgcontent {
			display:block; 
			background: rgb(204, 67, 47); 
			border:2px solid #924949; 
			border-left:none; 
			padding:5px; 
			min-width:150px; max-width:250px;
			font-size:1.2em;
			}


/* ############################################ FOOTER */

#footer{
	position:relative;
	margin: 0 auto;
	width:960px;
	background-color:rgb(0, 104, 170);
	text-align:center;
}
	span.top-footer{
		position:absolute;
		display:block;
		width:960px; height:3px;
		top:0; left:0;
		background:url(../_bilder/top_footer.gif) no-repeat bottom center;
		font-size:0; /* ie6 fix */
	}
	#foot{
		position:relative;
		height:190px;
		background:url(../_bilder/bg_footer.jpg) repeat-x center bottom;
		text-align:left;
	}
	#foot div{
		float:left;
	}
	span.icon{
		display:block;
		width:185px; height:49px;
		margin: 0 0 10px 21px;
		background:url(../_bilder/icons_footer.png) no-repeat;
		letter-spacing:1px;
		text-indent:-9999px;
	}
		span.reiten{background-position: 0 0;}
		span.bio{background-position: 0 -48px;}
		span.kinder{background-position: 0 -96px;}
		
	span.schlawutzel a, span.wanderschuhe a{
		display:block;
		text-indent:-9999px;
		width:173px; height:57px;
	}
	span.schlawutzel a{ background: url(../_bilder/icons_footer.png) no-repeat -220px -2px; }
	span.schlawutzel a:hover{ background-position: -393px -2px }
	
	span.wanderschuhe a{ background: url(../_bilder/icons_footer.png) no-repeat -220px -61px; }
	span.wanderschuhe a:hover{ background-position: -393px -61px }
	
	span.english {margin:35px 0 0px 65px; position:absolute;}
	
	span.bergdorf_der_tiere {margin-top:8px; display:block; float:left;}
		
	span.blumen{
		display:block;
		width:320px; height:110px;
		background:url(../_bilder/icons_footer.png) no-repeat 0 -154px;
		text-indent:-9999px;
		margin-right:20px;
	}
	
	span.impressum{
		display:block;
		margin-top:168px;
		text-align:right;		
		width:165px;
		}
	span.impressum a{color: rgb(0, 104, 170);}
	span.impressum a:hover { color:rgb(204, 67, 47) }
	
	span.logos{
		display:block;
		position:absolute;
		background:url(../_bilder/logos_footer.png) no-repeat;
		text-indent:-9999px;
		width:100px;
	}
	span.bauernhof{ right:50px}
	span.hochkoenig{ left:460px; top:120px}
	span.salzburg{ left:367px; top:140px}
	span.ski-amade{ left:249px; top:159px}
	
	span.logos a{ display:block; float:right; }
	span.bauernhof a{ width:76px; height:112px; }
	span.hochkoenig a{ width:63px; height:61px; }
	span.salzburg a{ width:90px; height:44px; }
	span.ski-amade a{ width:104px; height:21px; }
	
	span.bauernhof { width:76px; height:112px; background-position: top left; }
	span.hochkoenig{ width:104px; height:61px; background-position: -76px 0; }
	span.salzburg{ width:104px; height:44px; background-position: -77px -82px }
	span.ski-amade{ width:104px; height:21px; background-position: -77px -61px }
	
	
	
