
/*
	------------------------------------------------------------------------------------------------
	 
	 Cocon Day Spa - Global CSS Styles
	 styled by www.ost-kombinat.de
	 generated by bw@ok - 10.03.2010
	 
	------------------------------------------------------------------------------------------------
	
	
	
	
	------------------------------------------------------------------------------------------------
	 Charset Definition
	------------------------------------------------------------------------------------------------
	*/
	
	@charset "UTF-8";



	/*
	------------------------------------------------------------------------------------------------
	 Global Styles Definition
	------------------------------------------------------------------------------------------------
	*/


	html, body 
	{
		height: 100%;
		
	}
	
	body 
	{
		font: 11px Arial, sans-serif;
		color:#818181;
		margin: 0px; 
		padding:0px;
		background-color:#dcdad1;             
	}
	
	
	
	/*
	------------------------------------------------------------------------------------------------
	 Site Element Definition
	------------------------------------------------------------------------------------------------
	*/
	
	
	
	#WebsiteHolder
	{
		position: absolute;
		left: 50%;
		top: 50%;
		width:973px;
		height:634px;
		margin-top: -317px; /* make this half your image/element height */
		margin-left: -487px; /* make this half your image/element width */
		border:0px solid #333333;
		background-image:url(../../Global_Images/Screen_Backgrouond_Shadow.png);
		background-position:top left;
		background-repeat:no-repeat;
		z-index:1;
	}
	
		
	#WebsiteScreen
	{
		padding:0px;
		border:0px solid #990000;
		position:relative;
		display:block;
		width:955px;
		height:600px;
		left:9px;
		top:9px;
		display:block;
		background-color:#DFDFDF;
		z-index:2;
	
	}
	
	#PictureScreen
	{
		width:955px;
		position:absolute;
		height:600px;
		z-index:5 !important;
		background-position:top left;
		background-repeat:no-repeat;
		border:0px solid #99FF00;
		display:block;
		top:0px;
	}
	
	#PictureScreenText
	{
		width:500px;
		position:absolute;
		display:none;
		height:300px;
		z-index:10;
		background-position:top left;
		background-repeat:no-repeat;
		border:0px solid #99FF00;
		display:none;
		top:0px;
	}
	
	
	h1
	{
		font-size:13px;
		font-weight:normal;
		padding:0px;
		margin:0px;
		padding-top:8px;
		line-height:100%;
		text-transform:uppercase;
		letter-spacing:1px;
	
	}
	
	
	
	#LogoBox
	{
		width:168px;
		height:114px;
		position:absolute;
		float:inherit;
		left:20px;
		border:0px solid #FF0000;
		top:20px;
		z-index:20;
		display:block;
		background-image:url(../../Global_Images/Logo.png);
		background-repeat:no-repeat;
	
	}
	
	#ContentBox
	{
		position:absolute;
		border:0px solid #0000CC;
		top:389px;
		left:0px;
		width:955px;
		display:block;
		height:211px;
		z-index:15;
		background-image:url(../../Global_Images/Content_Background_SubNavigation.png);
		background-position:bottom left;
		background-repeat:no-repeat;
	}
	
	#Content .bodytext
	{
		width:450px;
		line-height:140% !important;
		font-size:11px;
	
	}
	
	.TwoColumContentBox a
	{
		color:#1BC1DF;
text-decoration:underline;
	}
	
	
	.ContactButton a
	{
	color:#818181;
	text-decoration:none;
	}
	
	.ContactButton a:hover
	{
	color:#1bc1df;
	text-decoration:none;
	}
	
	
	.PriceBarExtras .ContactButton .bodytext
	{
		padding:0px;
		margin:0px;
		width:320px !important;
	
	}
	
	
	.PriceBarExtras
	{
		width:500px;
		border:0px solid #666666;
		margin-bottom:4px;
		margin-top:0px;
	
	}
	
	
	
	.PriceTextSmall
	{
		font-size:10px;
		color:#333333;
	
	}
	
	.PriceTextBig
	{
		font-size:16px;
		color:#1bc1df;
		margin-left:7px;
	
	}
	
	
	.tx-newloginbox-pi1 h3
	{
	display:none;
	}
	
	.PriceBar
	{
		width:444px;
		border:0px solid #FF0000;
	
	}
	
	.ContactButton
	{
		width:200px;
		float:left;
	}
	
	
	.PriceDisplayBox
	{
		float:right;
		text-align:right;
	
	}
	
	
	#ContentBoxClean
	{
		position:absolute;
		float:inherit;
		border:0px solid #0000CC;
		top:389px;
		left:0px;
		width:955px;
		display:block;
		height:211px;
		z-index:100 !important;
		background-image:url(../../Global_Images/Content_Background.png);
		background-position:bottom left;
		background-repeat:no-repeat;
	}
	
	
	#ContentBoxCleanBeige
	{
		position:absolute;
		border:0px solid #0000CC;
		top:389px;
		left:0px;
		width:955px;
		display:block;
		height:211px;
		z-index:5;
		background-image:url(../../Global_Images/Content_Background_SubNavigation_Beige.png);
		background-position:bottom left;
		background-repeat:no-repeat;
	}
	
	
	#ContentBoxCleanBeige #SubNavigatioBar ul li a
	{
		color:#b2b0ac;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	#ContentBoxCleanBeige #SubNavigatioBar ul li a:hover
	{
		color:#1bc1df;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	#ContentBoxCleanBeige #SubNavigatioBar ul li.Active a
	{
		color:#1bc1df;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	
	
	#NavigationBox
	{
		width:955px;
		height:50px;
		border-bottom:0px solid #00FF99; 
	
	}
	
	#NavigationBox ul
	{
		padding:0px;
		margin:0px;
		padding-left:151px;
		list-style:none;
		padding-top:36px;
	}
	
	#NavigationBox ul li
	{
		padding:0px;
		margin:0px;
		list-style:none;
		float:left;
		margin-left:10px;
		margin-right:10px;
		letter-spacing:0.5px;
	}
	
	#NavigationBox ul li a
	{
		color:#606060;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	#NavigationBox ul li a:hover
	{
		color:#cff2f8;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	#NavigationBox ul li.Active a
	{
		color:#FFFFFF;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	
	
	#NavigationBox ul li.WhiteLink a
	{
		color:#FFFFFF;
		text-transform:uppercase;
		text-decoration:none;
		
	}
		
		
	#SubNavigatioBar
	{
		width:955px;
		height:50px;
		display:block;
		border-bottom:0px solid #990000; 
	}	
	
	#SubNavigatioBar ul
	{
		padding:0px;
		margin:0px;
		padding-left:248px;
		list-style:none;
		padding-top:25px;
	}
	
	#SubNavigatioBar ul li
	{
		padding:0px;
		margin:0px;
		list-style:none;
		float:left;
		margin-left:10px;
		margin-right:10px;
		letter-spacing:0.5px;
	}
	
	#SubNavigatioBar ul li a
	{
		color:#606060;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	#SubNavigatioBar ul li a:hover
	{
		color:#0da2bd;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	#SubNavigatioBar ul li.Active a
	{
		color:#0da2bd;
		text-transform:uppercase;
		text-decoration:none;
		
	}
	
	
	/*
	Special Links
	*/
	
	li#mn5.Active a
	{
	color:#1bc1df !important;
	
	}
	
	li#mn4.Active a
	{
	color:#1bc1df !important;
	
	}
	
	li#mn3.Active a
	{
	color:#1bc1df !important;
	
	}
	
	
	
	/*
	Information Layer
	*/
	
	#InformationLayer
	{
	background-color:#FFFFFF;
	border:0px solid #FFFFFF;
	height:340px;
	left:50%;
	margin-left:-270px;
	position:absolute;
	top:50px;
	width:540px;
	z-index:20;
	display:none;
	-moz-opacity:0.8
	filter: alpha(opacity=80);
    opacity: 0.8;
    khtml-opacity: 0.8;
	
	}
	
	#InformationLayerDisplayed
	{
	background-color:#FFFFFF;
	border:0px solid #FFFFFF;
	height:340px;
	left:50%;
	margin-left:-270px;
	position:absolute;
	top:50px;
	width:540px;
	z-index:20;
	-moz-opacity:0.8
	filter: alpha(opacity=80);
    opacity: 0.8;
    khtml-opacity: 0.8;
	
	}
	
	
	#InforButton
	{
		position:absolute;
		left:780px;
		top:140px;
		
	
	}
	
	#CloseButton
	{
		position:absolute;
		left:510px;
		top:10px;
	
	}
	

	.TwoColumContentBox
	{
		width:100%;
		display:block;
		border:0px solid #00CC66;
	}
	.ColumnLeftBox
	{
		width:200px;
		display:block;
		border:0px solid #FF0000;
		float:left;
		margin-right:40px;
	
	}
	
	.ColumnRightBox
	{
		width:240px;
		display:block;
		float:left;
		border:0px solid #999999;
	
	}
	
	#Content .ColumnLeftBox
	{
		width:160px !important;
		display:block;
		border:0px solid #FF0000;
		float:left;
		margin-right:40px;
	
	}
	
	
	
	
	
	#TextBoxHolder
	{
		width:900px;
		display:block;
		float:none;
		height:100px;
	
	}
	
	#ProgrammNavigationBox
	{
		width:240px;
		display:block;
		height:100px;
		border:0px solid #FF00FF;
		float:left;
		text-align:right;
	
	}
	
	
	#ProgrammNavigationBox ul
	{
		padding:0px;
		margin:0px;
		list-style:none;
		padding-top:10px;
	
	}
	
	#ProgrammNavigationBox ul li
	{
		padding:0px;
		margin:0px;
		list-style:none;
		padding-top:2px;
		padding-bottom:2px;
	
	}
	
	
	
	#ProgrammNavigationBox ul li a
	{
		color:#606060;
		text-transform:uppercase;
		text-decoration:none;
	
	}
	
	#ProgrammNavigationBox ul li a:hover
	{
		color:#4bcee6;
		text-transform:uppercase;
		text-decoration:none;
	
	}
	
	#ProgrammNavigationBox ul li.Active a
	{
		color:#4bcee6;
		text-transform:uppercase;
		text-decoration:none;
	
	}
	
	#TextBox
	{
		display:block;
		float:left;
		height:100px;
		width:580px;
		padding-left:20px;
		border:0px solid #CCCCCC;
	
	}
	
		
	#FooterBar
	{
		padding-top:14px;
		padding-left:10px;
		padding-right:10px;
	
	}	
		
	#FooterLinksLeft
	{
		float:left;
		border:0px solid #FFFF00;
		width:400px;
		display:block;
	
	}
	
	#FooterLinksLeft ul
	{
		padding:0px;
		margin:0px;
		list-style:none;
	
	}
	
	#FooterLinksLeft ul li
	{
		padding:0px;
		margin:0px;
		list-style:none;
		margin-left:10px;
		margin-right:10px;
		float:left
	
	}
	
	#FooterLinksLeft ul li a
	{
		display:block;
		
		font-size:10px;
		color:#898989;
		text-decoration:none;
	}
	
	#FooterLinksRight
	{
		float:right;
		width:400px;
		border:0px solid #666666;
		display:block;
		text-align:right;
		font-size:10px;
	
	}
	
	#FooterLinksRight ul li
	{
		float:right;
		border:0px solid #666666;
		display:block;
		margin-left:5px;
		margin-right:5px;
		padding:0px;
		line-height:100%;
		
	}
	
		#FooterLinksRight a
	{
		outline:none;
		background-position:center;
		padding:0px;
		margin:0px;
		margin-left:5px;
		margin-right:5px;
		font-size:10px;
	
	}
		
		
		
	.PopUpTextBox
	{
		padding-top:20px;
		padding-left:20px;
		padding-right:30px;
		line-height:140%;
	
	}
	
	.PopUpTextBox a
	{
		color:#1bc1df;
		text-decoration:underline;
	
	}
	
	.PopUpTextBox h1
	{
		padding-bottom:10px;
		font-weight:normal;
		font-size:14px;
		text-transform:uppercase;
		color:#585858;
	
	}
		
	
	/*
	------------------------------------------------------------------------------------------------
	Gutschein Formular - jQuery Styles
	------------------------------------------------------------------------------------------------
	*/
	
	#GutscheinBox
	{
		background-image:url(../../Global_Images/Headline_GutscheinBestellen.png);
		background-position:20px 30px;
		background-repeat:no-repeat;
		padding-top:60px;
	
	}
	
	#GutscheinBox h1
	{
	display:none;
	
	}
	
	
	.FormContentLeft
	{
		width:207px;
		float:left;
		border:0px solid #333333;
		display:block;
		padding-left:38px;
		background-image:url(../../Global_Images/Gutschein_von.png);
		background-repeat:no-repeat;
		background-position:top left;
	}
	
	.FormContentLeft ul 
	{
		list-style:none;
		padding:0px;
		margin:0px;
	
	}
	
	.FormContentLeft ul li
	{
		list-style:none;
		padding-bottom:8px;
		display:block;
	
	}
	
	
	
	.FormContentRight
	{
		width:198px;
		float:left;
		border:0px solid #666666;
		display:block;
		padding-left:38px;
		background-image:url(../../Global_Images/Gutschein_fuer.png);
		background-repeat:no-repeat;
		background-position:top left;
	}
	
	
	.FormContentRight ul 
	{
		list-style:none;
		padding:0px;
		margin:0px;
	
	}
	
	.FormContentRight ul li
	{
		list-style:none;
		padding-bottom:8px;
		display:block;
	
	}
	
	
	
	
	
	.inputfieldbox {width:184px; padding:3px;float:left;clear:left; font-family:Arial, Helvetica, sans-serif; font-size:11px; background-image:url(../../Global_Images/Input_Normal.gif); background-position:top left; background-repeat:no-repeat; border:0px solid #FFFFFF; display:block;}
	
	.inputfielddropdown {width:187px; padding:3px;float:left;clear:left; font-family:Arial, Helvetica, sans-serif; font-size:11px; background-image:url(../../Global_Images/Input_Normal.gif); background-position:top left; background-repeat:no-repeat; border:0px solid #FFFFFF; display:block;}
	
	
	.inputtextfieldbox {width:184px; height:73px; font-family:Arial, Helvetica, sans-serif; font-size:11px; padding:3px;float:left;clear:left; background-image:url(../../Global_Images/Input_Textfield_Normal.gif); background-position:top left; background-repeat:no-repeat; border:0px solid #FFFFFF; display:block;}
	
	
		
	fieldset{border:0;}
	ul.form{list-style:none;padding:0;margin:0 auto;width:480px;border:0;}
	ul.form li{border-bottom:0px dashed #464e5f;padding:0px 0;}
	.form_head{height:20px;width:200px;color:#aaa;text-align:center;border-bottom:0 !important;}
	/*ul.form li label{display:block;width:160px;}
	.required{display:block;font-size:10px;color:#5b6170;}
	ul.form li input, ul.form li select, ul.form li {width:190px; height:19px;float:left;clear:left; background-image:url(../../Global_Images/Input_Normal.gif); background-position:top left; border:0px solid #FFFFFF; display:block;}
	ul.form li.submit{text-align:right;border:0;}
	#comment{width:400px;background-color:#ccc;border:2px solid #ccc;-moz-border-radius-bottomleft:4px;-moz-border-radius-bottomright:4px;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;}
	ul.form li textarea{height:90px;width:340px;}
	ul.form li.comment .required, ul.form li.comment label{width:120px;}
	li.comments{height:130px !important;}*/
	.valid{ background-image:url(../../Global_Images/Input_Normal.gif) !important;}
	.invalid{background-image:url(../../Global_Images/Input_Normal_Error.gif) !important;}
	label {font-size:10px;}	
	
	textarea.valid{ background-image:url(../../Global_Images/Input_Textfield_Normal.gif) !important; height:73px;font-family:Arial, Helvetica, sans-serif; font-size:11px; padding:3px;float:left;clear:left; }	
	textarea.invalid{ background-image:url(../../Global_Images/Input_Textfield_Error.gif) !important; height:73px;font-family:Arial, Helvetica, sans-serif; font-size:11px; padding:3px;float:left;clear:left; }
		
	
	/*
	------------------------------------------------------------------------------------------------
	Global Clearing Style Definition
	------------------------------------------------------------------------------------------------
	*/
	

    .fltrt 
	{ 
    	float: right;
    	margin-left: 8px;
    }
    .fltlft 
	{ 
    	float: left;
    	margin-right: 8px;
    }
    .clearfloat 
	{ 
    	clear:both;
        height:0;
        font-size: 0px;
        line-height: 0px;
    }
		
		
		
		
		
		
		
		
		
		