@charset "utf-8";
/* CSS Document for Handle Creativ Art Werbeagentur */
/*
	created by: Klaus Hoermann <klaus@3b-solutions.net>
	created for: Handle Creativ Art
	Client: Hotel Wiesental
	Description: main css file
	Copyright: (C) 3B-Solutions Klaus Hoermann 2009
*/

/********************************************************************/
/* HTML */

/* clear all margins and paddings to zero */
* {
	margin:0px;
	padding:0px;
}

/* html style */
html {
	height: 100%; 
	margin-bottom: 1px;	
}


/********************************************************************/
/* BODY */

/* body tag */
body {
	height:100%;
	margin:0px;
	padding:0px;
	color:#444444;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	background-color:#f0f2f0;
	/*background-image:url(../img/background.jpg);
	background-position:top left;
	background-repeat:repeat;*/
}

/* general link color */
a {
	color:#338585;
	text-decoration:none;
}

/* general link color on hover */
a:hover {
	/*color:#cee3c9;*/
	text-decoration:underline;
}


/********************************************************************/
/* GLOBAL CLASSES */

/* clearing the floats */
.clearer {
	clear:both;
}

/* active class for the listitems in the main menu */
.active {
	font-weight:bold;
}


/********************************************************************/
/* CONTAINERS */

/* surrounding container */
#container {
	width:950px;
	margin:0px auto;
}


/********************************************************************/
/* HEADER */

/* the header holding the logo, markenarchitektur, links, language,...*/
#header {
	height:60px;
	width:950px;
	overflow:visible;
	position:relative;
	/*
	background-image:url(../img/background/gradientBg.png);
	background-position:center center;
	background-repeat:no-repeat;	
	*/
}

/* the wiesental logo overlapping the headerimage*/
#headerlogo {
	height:50px;
	width:250px;
	margin-top:10px;
	float:left;	
	overflow:visible;	
}

/* header menu holding the icons of the markenarchitektur */
#headermenu {
	height:50px;
	width:560px;
	margin-top:10px;
	float:left;
}

/* list for all items in the header menu */
#headermenu ul {
	padding-top:20px;
	float:right;
}

/* topmenubar unordered list */
#headermenu li {
	float:left;
	position:relative;
	overflow: hidden;	
}

/* links in the topmenu bar */
#headermenu a {
	width:45px;
	color:#d00000;
	text-decoration: none;
	outline:none;
	display:block;
	cursor:pointer;
}

/* the span holding the textmessage */
#headermenu span {
	height:20px;
	width:150px;
	position:absolute;
	display:none;
}

/* sitemap link */
#headersitemap {
	height:19px;
	width:102px;
	padding-right:3px;
	padding-top:6px;
	float:left;
	text-align:right;
}

/* container holding the language buttons and the sitemap button */
#headerlanguage {
	height:20px;
	width:35px;
	padding-top:10px;
	float:left;
}

/* links in the header */
#headerlinks {
	height:25px;
	width:140px;
	padding-top:5px;
	float:left;
}

/* set the opacity of the tirol links to 20%, enable 100% using JS on hover */
#headerlinks img {
	opacity:.2;
	filter:alpha(opacity = 20);
}

/* the style for the images in the links and language container */
#headerlanguage img, #headerlinks img {
	padding-left:5px;
	float:right;
}


/********************************************************************/
/* HEADERIMAGE */

/* the header image holding the header images */
#headerimage {
	height:248px;
	width:948px;
	border-left:1px solid #999;
	border-right:1px solid #999;
	border-top:1px solid #999;
	background-color:white;
	overflow:hidden;
	z-index:-1000;
}


/********************************************************************/
/* CONTENT */

/* the content holds the mainmenu, both sidebars, and the maincontent */
#content {
	width:948px;
	border-bottom:1px solid #999;
	border-left:1px solid #999;
	border-right:1px solid #999;
	background-color:white;	
}


/********************************************************************/
/* MAINMENU */

/* the main menu */
#mainmenu {
	height:20px;
	width:930px;
	border-bottom:1px solid #999;
	border-top:1px solid #999;
	margin-bottom:10px;
	padding-left:18px;
	float:left;
	background-color:#d7e8d3;
	/*background-image:url(../img/background/mainMenuBackground.png);
	background-position:top left;
	background-repeat:repeat-x;*/
}

/* unordered list holding the items for the menu*/
ul.mainnav {  
    list-style:none;
}

/* items in the main menu list */
ul.mainnav li {  
	width:100px;
	margin-left:7px;
	margin-right:7px;
    position:relative; /*--Declare X and Y axis base for sub navigation--*/  	
    float:left;
}

/* links in the listitems */
ul.mainnav li a {
	height:14px;
	width:115px;
	padding-top:3px;
    float:left;	
    display:block;
	text-align:center;
}

/**/
ul.mainnav li a:hover {
	text-decoration:none;
}

/* hover effect for trigger */
ul.mainnav li span.subhover {
	cursor:pointer;
	background-position:center bottom bottom; 	
} 

/* subnav list */
ul.mainnav li ul.subnav {
	border-left:1px solid #999;
	border-right:1px solid #999;
	border-top:1px solid #999;
	border-bottom:1px solid #d7e8d3;
	padding-bottom:2px;	
    position: absolute; /*--Important - Keeps subnav from affecting main navigation flow--*/  
    left:-10px;
	bottom:17px;
	display:none;
    float:left;
	list-style: none;	
	-moz-border-radius-topleft:6px;
	-moz-border-radius-topright:6px;
	-webkit-border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	opacity:.85;
	filter:alpha(opacity = 85);
	background-color:#d7e8d3;
}

/* listitems in the subnav list */
ul.mainnav li ul.subnav li {
	height:17px;
	width:130px;
	margin:0px;
	padding:0px;	
	clear: both;
}

/* style for links in the subnav listitems*/
ul.mainnav li ul.subnav li a {  
	height:15px;
	width:130px;
	float: left;
	color:#666;
	font-size:11px;
} 

/* hover effect for subnav links */
ul.mainnav li ul.subnav li a:hover {
	-moz-border-radius-topleft:6px;
	-moz-border-radius-topright:6px;
	-webkit-border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	color:#338585;
	background-color:white;
}  


/********************************************************************/
/* LEFT & RIGHT COLUMNS */

/* left and right sidebar columns */
#leftcol, #rightcol {
	min-height:100px;
	width:189px;
	padding-left:5px;
	padding-right:5px;		
	position:relative;
	top:0px;
	background-color:white;
}

/**/
#leftcol {
	padding-left:10px;
	float:left;
}

/**/
#rightcol {
	padding-left:10px;
	float:left;
}

/* a item in the left and right sibebar */
.itemcontainer {
	width:182px;
	border:1px solid #999;
	margin-bottom:15px;	
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	background-color:#f0f2f0;
}

/* header element in an item */
.itemheader {
	height:20px;
	width:180px;
	border-bottom:1px solid #999;
	padding-left:2px;
	-moz-border-radius-topleft:6px;
	-moz-border-radius-topright:6px;
	-webkit-border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	background-color:#d7e8d3;	
}

/**/
.itemheader img {
	margin-right:5px;
}

/* content element in an item */
.itemcontent {
	width:170px;
	padding:5px;
	
}

/* content element for the top packages, current view */
.itemcontenttop {
	width:170px;
	padding:5px;
	background-image:url(../img/background/topPackagesBackground.png);
	background-position:top left;
	background-repeat:no-repeat;

}



/* item content für wetter*/
.itemcontentplain {
	width:170px;
	padding:5px;
}

/**/
.itemcontentweather {
	width:170px;
	padding:5px;
}

/**/
.itemcontentbooking {
	height:35px;
	padding:5px;
	padding-left:36px;
}

/**/
.itemcontentweather td {
	padding-top:3px;
}

/**/
.itemcontentweather a {
	color:#338585;
}

/**/
.itemcontentweather img {
	padding-right:4px;
	padding-top:5px;
}

/**/
.itemcontentweather hr {
	margin:2px;
}

/**/
.itemcontentnews {
	padding-left:5px;
	padding-right:5px;
}

/* heading 1 in a item */
.itemcontent h2, .itemcontenttop h2 {
	padding-bottom:2px;
	color:#338585;
	font-size:12px;
}

/* heading 2 in a item */
.itemcontent h3, .itemcontenttop h3 {
	padding-bottom:5px;
	color:#338585;
	font-size:11px;
}

/**/
.itemcontent h4, .itemcontenttop h4 {
	padding-bottom:3px;
	padding-right:5px;
	padding-top:7px;
	color:red;
	float:right;
	font-size:13px;
	font-weight:bold;	
}

.itemcontent p.moretextC, .itemcontenttop p.moretextC {
	cursor:pointer;
	color:#338585;
	margin-left:2px;
}

/**/
.itemcontent p, .itemcontenttop p {
	padding-bottom:5px;
	color:#444444;
	font-size:11px;
	text-align:left;
}

/* unordered list style in a itemcontent div */
.itemcontent ul, .itemcontenttop ul {
	padding-left:15px;
	padding-bottom:5px;
	font-size:11px;	
}

/**/
.itemcontent a.inclusive, .itemcontenttop a.inclusive {
	height:32px;
	width:60px;
	margin-left:5px;
	padding-top:4px;
	float:left;
	font-size:10px;
	text-align:center;
	background-image:url(../img/background/inclusiveButtonBackground.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.itemcontent a.booking, .itemcontentbooking a.booking, .itemcontenttop a.booking {
	height:32px;
	width:100px;
	padding-top:4px;
	float:left;
	font-size:10px;
	text-align:center;
	background-image:url(../img/background/bookingButtonBackground.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.itemcontent a.inclusive:hover, .itemcontenttop a.inclusive:hover {
	background-image:url(../img/background/inclusiveButtonBackgroundOver.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.itemcontent a.booking:hover, .itemcontentbooking a.booking:hover, .itemcontenttop a.booking:hover {
	background-image:url(../img/background/bookingButtonBackgroundOver.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.itemcontent a:hover, .itemcontentbooking a:hover, .itemcontenttop a:hover {
	color:white;
	text-decoration:none;
}

/**/
.packagesline {
	marging:0px;
	padding:0px;
}

/**/
.itemcontainer hr {
	margin:0px;
	padding:0px;
}


/********************************************************************/
/* NEWS */

/**/
#ticker {
	height:100px;
	width:175px;
	overflow:auto;
}

/**/
#ticker dt {
	padding-top:11px;
	color:#338585;
	font-size:11px;
	font-weight:bold;
}  

/**/
#ticker dd {  
	margin-left:0; 
	font-size:11px;
	font-weight:normal;
	text-align:justify;
}  


/********************************************************************/
/* MAIN COLUMN */

/* main column holding the main content */
#maincol {
	min-height:100px;
	width:540px;
	padding-bottom:10px;	
	float:left;
}

/* heading in the main content */
#maincol h1, .tx-wiesentalpackages-pi1 h1 {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:16px;	
	color:#338585;
	padding-bottom:5px;
}

/**/
#maincol h2 {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:14px;	
	font-weight:bold;
}

/**/
#maincol h3 {
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:12px;	
}

/* paragraph style for the content */
#maincol p {
	padding-bottom:5px;
	line-height:13pt;
}

/* list style */
#maincol ul {
	padding-bottom:5px;
	list-style-type:circle;
	line-height:12pt;
}

/**/
#maincol li {
	margin-left:25px;
	list-style-type:circle;
}

/**/
#maincol dd {
	font-size:11px;
}

/********************************************************************/
/* FOOTER */

/* the footer container */
#footer {
	height:15px;
	width:948px;
	padding-top:1px;
	float:left;
	background-color:#d7e8d3;
}

/* paragraph style in the footer */
#footer p {
	margin:0px auto;
	padding-left:125px;
	font-size:10px;
}

/* hover over links */
#footer a:hover {
	text-decoration:underline;
}

/********************************************************************/
/* TOP LINK */

/* anchor tag with class toTop, jQuery eneabled */
#toTop { 
	height:18px;
	width:137px;
	border:1px solid #999;
	padding-top:2px;
	position:fixed;
	bottom:10px;
	font-weight:bold;
	right:10px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	float:right;
	text-align:center;
	color:#338585;	
	text-decoration:none;
	cursor:pointer;	
	background-color:#f0f2f0;	
	/*background-image:url(../img/toTopArrow.png);
	background-position:center left;
	background-repeat:no-repeat;*/
}


/********************************************************************/
/* PACKAGES EXTENSION */

/* Container for package items */
.packageoverview {
	width:540px;
}

/* Overall styles for the items, 1st and 2nd */
.overviewitem1, .overviewitem2 {
	min-height:210px;
	width:262px;
	border:1px solid #999;
	margin-bottom:15px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	background-color:#f0f2f0;	
}

/* first item in line floats left */
.overviewitem1 { 	
	position:relative;
	float:left;
}

/* second item in line floats right */
.overviewitem2 {
	position:relative;
	float:right;
}

/* header of an item */
.packageoverview .overviewitemheader {
	height:35px;
	border-bottom:1px solid #999;
	-moz-border-radius-topleft:6px;
	-moz-border-radius-topright:6px;
	-webkit-border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	background-color:#d7e8d3;	
}

/* title of item */
.tx-wiesentalpackages-pi1 .overviewitemheader h5 {
	height:20px;
	width:207px;
	margin:0px;
	padding:0px;
	padding-left:5px;
	float:left;
	font-weight:bold;	
	line-height:18px;
	font-size:12px;
}

/* date (from to) of item */
.packageoverview .overviewitemheader h6 {
	height:11px;
	padding:0px;
	margin:0px;
	padding-left:5px;
	float:left;
	font-size:11px;
	font-weight:bold;
	line-height:15px;
}

/* selected branding image in header */
.packageoverview .overviewitemheader img {
	padding-right:2px;
	padding-top:2px;
	float:right;
}

/**/
.packageoverview .overviewitembody p {
	padding:5px;
	clear:both;
	font-size:11px;
}

/**/
.packageoverview .overviewitembody td {
	padding-left:5px;
	font-size:11px;	
}

/**/
.packageoverview .links .inclusive {
	height:32px;
	width:60px;
	margin-left:15px;
	margin-right:10px;
	padding-top:4px;	
	float:right;
	font-size:10px;
	text-align:center;
	background-image:url(../img/background/inclusiveButtonBackground.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.packageoverview .links .booking  {
	height:32px;
	width:100px;
	margin-left:5px;	
	padding-left:0px;
	padding-top:4px;
	float:left;
	font-size:10px;
	text-align:center;
	background-image:url(../img/background/bookingButtonBackground.png);
	background-position:top left;
	background-repeat:no-repeat;	
}

/**/
.packageoverview .links a.inclusive:hover {
	background-image:url(../img/background/inclusiveButtonBackgroundOver.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.packageoverview .links a.booking:hover {
	background-image:url(../img/background/bookingButtonBackgroundOver.png);
	background-position:top left;
	background-repeat:no-repeat;
}

/**/
.packageoverview .links a:hover {
	color:white;
	text-decoration:none;
}

/**/
.overviewitembody ul {
	font-size:11px;
}

/**/
.overviewitembody p.moretextOR, .overviewitembody p.moretextOL {
	cursor:pointer;
	color:#338585;
}

/**/
.packageoverview .overviewitembody {
	position:relative;
	height:135px;
}

/**/
.packageoverview .links {
	height:32px;
	width:100%;
	position:relative;
	bottom:0px;
	left:0px;
}

/********************************************************************/
/* PRICE TABLE*/ --> OK

/* the price table */
#pricetable {
	border:0px;
	background-color:#CCC;
}


/* price table cell */
#pricetable td {
	border:0px;
	font-size: 12px;
	font-weight: normal;
	text-align: center;	
	background-color:#f0f2f0;	
}

/* price table heading cell */
#pricetable th {
	border:0px;
	font-size: 11px;
	font-weight: normal;
	text-align: center;
	background-color:white;	
}

/* header class */
#pricetable th.header {
	border:0px;
	background-color:#d7e8d3;	
}


/*****************************************************************/
/* KURSE TABLE*/
#kursetable {
	border:0px;
	background-color:#CCC;
}

#kursetable td {
	border:0px;
	font-size: 12px;
	font-weight: normal;
	text-align: center;	
	background-color:#f0f2f0;	
}

#kursetable th {
	border:0px;
	font-size: 11px;
	font-weight: normal;
	text-align: center;
	background-color:white;
}

#kursetable th.header {
	border:0px;
	background-color:#d7e8d3;	
}




.qtip-content {
	background-color:red;
}

.qtip-title {
	background-color:blue;
}


.bodytext ul {
	background-color:green;
}




.align-left{ text-align: left;}
.align-center{ text-align: center;}
.align-right{ text-align: right;}

