@import url("html4.css");
@import url("divbox.css");
@import url("datepicker.css");
@import url("flexslider.css");
@import url('font-awesome.min.css');

html	{ height:100%; }
	body	{ height:100%; margin:0px; padding:0px; color:#4f6a72; font-family:Arial,sans-serif; font-size: 0.813em; }
		div#bground			{ position:absolute; top:79px; right:0; z-index:0; width:50%; height:332px;
											background:transparent url(/assets/Styles/img/bground_grey.png) repeat-x left top scroll; }
		div#container		{ position:relative; z-index:1; max-width:939px; margin:0 auto; padding:0 61px 0 55px; min-height:100%; height:auto !important; height:100%;
											background:#fff url(/assets/Styles/img/border-left.gif) repeat-y 33px top scroll; overflow-x:hidden; }

			div#header			{ padding-top:53px; height:354px }
				#navbtn		{ display:none; cursor:pointer; }
				#navbtn i { font-size:30px; padding:10px; }
				#navigation		{ position:relative; margin-bottom:10px; z-index:4; }
					#navigation ul { margin:0; padding:0; list-style:none; display:inline }
						#navigation li.navlevel1 { position:relative; display:inline }
							#navigation ul.navlevel2 { z-index:2; position:absolute; left:0; top:0; width:300px; margin-top:13px; padding:50px 0 36px; display:none;
																				 background:transparent url(/assets/Styles/img/nav_split.png) no-repeat 8px 15px scroll }
							#navigation li:hover ul { display:block }
								#navigation li.navlevel2 { list-style:none; }
						#navigation a	{ padding:0 8px; color:#4f6a72; text-decoration:none; font-size:0.923em; line-height:1em; font-weight:bold }
							#navigation a.navlevel1 { background:transparent url(/assets/Styles/img/nav-split.gif) no-repeat left 2px scroll }
								#navigation a.navlevel1.number_0 { background-image:none }
							#navigation a.navlevel2	{ display:block; color:#fff; padding:5px 8px }
						
				/* Flexslider mit eigenem CSS */
				div#menu-overlay { zoom: 1; position: absolute; left:0; top:0; width:939px; height:332px; display:none;
													 background:transparent url(/assets/Styles/img/bground-red.png) repeat-x left top scroll }
					img#headerimg { position:absolute; right:250px; top:40px  }

			div#content		{ margin-top:73px; padding:20px 0 320px; border-top:#ececec 6px solid; }

			div#foot_wrapper { position:absolute; bottom:0; width:calc(100% - 110px); padding:44px 0 10px 0; border-top:#ececec 6px solid; }
				div#footer	{ position:relative; height:auto; overflow:hidden; background-color:#eee; }
					div#footer_left	{ width:calc(34% - 36px); float:left; display:inline; text-align:left; padding:7px 0 0 36px; }
						div#footer_left	p { color:#4b4b4b; font-size:0.923em }
					div#footer_right	{ float:right; width:calc(66% - 18px); padding:18px 5px 0 0; }
			
			img#logo { position:absolute; right:0; top:39px; width:214px; height:33px; }
			#bubbles { position:absolute; right:-151px; top:-6px; width:462px; height:353px; }
			
			div#overlay { position:absolute; top:0; display:none; height:100%;
										background:transparent url(/assets/Styles/img/bg_overlay.png) repeat left top scroll; }
			div#bath_style {

    position: absolute;
    left: 0;
    top: 410px;

}
				img.badausstellung { display:block; width:30px; height:194px }
				img.stilfinder { display:block; width:30px; height:120px }
				div.badausstellung { position:absolute; left:30px; top:0px; right:0; height:285px; padding:15px 0; outline:1px solid #000; display:none; background-color:#fff; }
					/*div#inner_bad p, div#inner_bad div { float:left; margin:0; }*/
					.items div { float:left; position:relative; }
					.items p
					{ height: 285px;
						overflow: hidden;
						position: relative;
						width: 88px;
						float:right;
						margin:0
					}
					.items span
					{ display: block; height: 88px; left: -98px; position: absolute; top: 98px; width: 285px;
						-webkit-transform: rotate(-90deg);
						-moz-transform: rotate(-90deg);
						-ms-transform: rotate(-90deg);
						-o-transform: rotate(-90deg);
						transform: rotate(-90deg);
					}
						button#bath_out { width:40px; height:40px; position:absolute; right:-3px; top:-1px; border:0; padding:0; background-color:transparent }
				div.stilfinder { position:absolute; width:993px; height:507px; left:30px; top:-223px; padding:15px; outline:1px solid #000; display:none; background-color:#fff; }
					div.stilfinder div.num img { background:transparent url(/assets/Styles/img/num-grey.png) no-repeat left top scroll; margin:3px }
						div.stilfinder div.num img.num_active { background:transparent url(/assets/Styles/img/num-red.png) no-repeat left top scroll; }
						div.num {  }
						div.style_level { position:absolute; left:0; bottom:90px; padding:0 0 2px 8px; background-color:#fff; display:none }
						div.level_active { display:block }
							div.desc { padding:0 0 40px 0 }
							div.big_img { float:left; background:transparent url(/assets/Styles/img/bg-big.png) repeat-x left top scroll }
							div.big_img img { padding:23px }
							div.big_img img.active_big_img { outline:1px solid red }
						button#out { width:40px; height:40px; position:absolute; right:20px; top:20px; border:0; padding:0; background-color:transparent }
						button#next { position:absolute; right:20px; bottom:40px; border:0; padding:0; background-color:transparent }
			div#social_network	{ position:absolute; left:3px; bottom:11px; width:27px; border-top:1px solid #b1b3b4; border-bottom:1px solid #b1b3b4 }

			div#social-media-mobile { display:none; padding:0.66em 1em; }
			div#social-media-mobile a { display:block; float:left; width:50px; height:50px; line-height:50px; margin:0 1em; padding:0; background-color:#bf1323; text-align:center; overflow:hidden; }
			div#social-media-mobile a img { max-height:32px; width:auto; vertical-align:middle; }
				img#facebook { display:block; width:9px; height:17px; margin:8px 0 8px 5px; }
				div#social_network hr { height:1px; border:none; background-color:#b1b3b4 }
				img#twitter { display:block; width:10px; height:13px; margin:8px 0 8px 7px; }
				div.style_result { display:none }

h1			{ font-size:140%; }
h2			{ font-size:1em; font-weight:normal; color:#d10119 }
h3			{ font-size:100%; }
hr			{ border:3px solid #ececec; border-left:none; border-right:none }
a:link		{ color:#00f; }
a:visited	{ color:#009; }
a img		{ border:none; text-decoration:none; }
th 			{ text-align:left; }
textarea,
input,
select		{ font-family:Verdana,Helvetica,sans-serif; font-size:100%; }
form 		{ display:inline; }
textarea { overflow:auto; resize:none }

.uc-card-header{ 
background-color:#e2001a!important;}

#bto-path-1, #fingerprint, #ico_button_close-b{ 
fill: #e2001a!important;}

.usercentrics-button .layout-1 .uc-button-bl .uc-banner-1 .uc-modal-1 .injected-styles, .uc-btn.uc-btn-primary.uc-save-settings-and-close-button, .uc-btn.uc-btn-primary { 
background-color: #e2001a!important;}


.usercentrics-button .uc-corner-modal .uc-card-footer .uc-save-settings-button{ 
background-color: #e2001a!important;}

.uc-nav.uc-nav-tabs, .uc-dropdown-menu.lan-opened{ 
background-color: #4f6a84!important;}

/*#usercentrics-button #uc-banner-modal .uc-banner-content {
 background-color: #4f6a84!important;
}
/* Classes */

/*Elastic video*/
.video-wrapper {
	width: 600px;
	max-width: 100%;
}
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* form error classes used by µCMS and shop module */
div.error-formfield,
p.error-formfield { color:#d13d1b; font-weight:bold; display:none; }
input.error-formfield, textarea.error-formfield, select.error-formfield { border:1px inset #000; background-color:#fcdfb2; }
table.error-formfield td, td.error-formfield { background-color:#fcdfb2; }
.error-message { color:#f00;font-weight:bold; }

/* form field formatting */
.txtinput			{ border:1px inset #999; }
.txtbtn				{ border:1px outset #999; }

/* bot trap -- hide fields with this class */
input.bcheck		{ position:absolute; left:-20000px }

/* defined for fckstyles.xml */
img.image_right		{ float:right; margin:0 0 0.33em 0.99em; }
img.image_left		{ float:left; margin:0 0.99em 0.33em 0; }

.clearfix			{ clear:both; font-size:0; }

/* language navigation */
a.langavail00,
a.langavail01,
a.langavail10		{ display:none }

a.langavail00 img,
a.langavail01 img,
a.langavail10 img		{ display:none }

/* Scrollable */
.scrollable {
  /* required settings */
  position:relative;
  overflow:hidden;
  width:100%;
  height:285px;
  margin-left:42px;
  box-sizing:border-box;
}
.scrollable .items {
  /* this cannot be too large */
  width:20000em;
  position:absolute;
}
a.disabled { display:none !important }
a.browse { display:block; position:absolute; top:140px; z-index:2; width:40px; height:40px }
a.prev { left:0; background:transparent url(/assets/Styles/img/arrow-left.png) no-repeat left top scroll }
a.next { right:0; background:transparent url(/assets/Styles/img/arrow-right.png) no-repeat left top scroll }

/* MODULE STYLES ======================================================================================================= */
/* guestbook */
.gb_entry { background-color:#f3ede2; border:1px dotted #401f01; margin:1em 0; padding: 0.8em; }
.gb_date {
	float: right;
	width: 5.5em;
	text-align: center;
	line-height: 180%;
	color:#c4bfb7;
	border-left:1px solid silver;
	border-bottom:1px solid silver;
	margin:-0.8em -0.8em 1em 1em;
	padding-bottom: 0.4em;
}
.gb_date .day 	{ margin:0; padding:0; font-family:Georgia, serif; font-size:2.3em; font-weight:bold; }
.gb_date .month	{ margin:0; padding:0; font-family:Georgia, serif; font-size:1.3em; font-weight:bold; }
.gb_date .year	{ margin:0; padding:0; font-family:Georgia, serif; font-size:1.0em; line-height:0.9em; }
.gb_header 		{ font-weight:bold; }
.gb_comment 	{ background-color:#efe5d2; margin:1em -0.8em -0.8em -0.8em; clear:both; }

table.centered td { text-align:center; }

/* breakpoints  */
@media only screen and (max-width:1024px) {
	body	{ font-size: 1em; }
	div#container {
		background: #fff none;
		padding: 0 31px 0 25px;
	}
	div#content {
		margin-top: 23px;
		padding: 0px 0 200px;
		border:none; 
	}
	#bath_style,
	#bground,
	#social_network {
		display:none;
	}
	img#logo {
		right: 31px;
	}
	div#menu-overlay {
		width:100%;
	}
	div#footer_right	{ float:left; width:auto; padding-left:1em; margin:0 auto; }
	div#footer_left { display:none; }

}
@media only screen and (max-width:768px) {
	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { display: block; }
	thead { position: absolute; top: -9999px; left: -9999px; }
	tbody td { text-align: left !important; width: 100% !important; }
	tr { margin-bottom: 0.66em; clear:both; }
	td.centered { text-align: center !important; }
	table.centered td { text-align:center !important; }
	img { max-width:100% !important; height:auto; }

	div#container { padding:0 1em; }
	div#content { padding-bottom:calc(50px + 1em); }
	div#header { margin-top:50px; padding-top:0; height:auto; }
	#navbtn { display:block; float:left; }
	#navigation { margin:0 !important; display:none; height:auto; position:absolute; left:0; width:100%; z-index:2; background:#e2091c none; }
	#navigation ul { display:block; margin:0 !important; padding:5px 0 5px 10px !important; background: transparent none !important; position:static !important; width: auto !important; }
	#navigation > ul { padding:8px 0 0 0 !important; }
	#navigation:before { content:''; position:absolute; width:16px; height:8px; top:0; left:26px; border-top: 8px solid #fff; border-left: 8px solid transparent; border-right: 8px solid transparent; box-sizing:border-box; }
	#navigation li { position:static !important; display:block !important; float:none !important; }
	#navigation li a { display:block; color:#fff !important; margin:0 !important; padding:10px !important; background:transparent none !important; }
	#navigation > ul > li > a { border-bottom:1px solid #fff; padding:10px !important; }
	#navigation li > ul { border-bottom:1px solid #fff; }
	div#social-media-mobile { display:block; }
	div#social_network { display:block !important; position:absolute; bottom:0; width:100%; border:none; border-top:6px solid #ececec; text-align:center; }
	div#social_network hr { display:none !important; }
	div#social_network a { display:inline-block !important; padding:0 1em; margin:0.33em; }
	div#social_network a img { display:inline-block; }
	img#logo { right:1em; top:10px; }
	div#menu-overlay,
	#bubbles,
	div#footer_right,
	div#foot_wrapper,
	a[href*=bath_style],
	a[onclick*=finder] { display:none !important; }
}