﻿/* http://www.rearbo.de - Webdesign, Suchmaschinenoptimierung, Grafikdesign, Printdesign */


/* RESETS */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, th, article, aside, canvas, content, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}article, aside, content, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}body{line-height: 1;}ol, ul{list-style: none;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after{content: '';content: none;}table{border-collapse: collapse;border-spacing: 0;}


/*DEFAULT */
body {
	background:#004fbf;
	font-family:"cagliostro",Verdana,Geneva,sans-serif;
	color:white;
}
	a, a:visited, a:link {
	text-decoration:none;
}

	h1 {font-size:2em;color:gold;font-variant:small-caps; text-shadow:1px 1px #003786;}
	h2 {font-size:1.675em;color:gold;font-variant:small-caps; text-shadow:1px 1px #003786;}
	h3 {font-size:1.25em;color:white;text-shadow:0 0 3px #003786;}
	h4, h5 {font-size:1.125em;color:white;text-shadow:0 0 3px #003786;}

		.symbol {font-family:"Entypo";}
		.and {font-family:Tahoma, Geneva, sans-serif;}
		.dhlarge {font-size:2.5em;}
		.left {float:left;}
		.right {float:right;}
		._clear {clear:both;}
		
	#header {
	width:100%;
	background:#075BBD;
	color:#EFF2F2;
}	
		#header .contactinfo a, #header .contactinfo a:link, #header .contactinfo a:visited {color:#eef2f2;} #header .contactinfo a:active, #header .contactinfo a:hover, #header .contactinfo a:focus {color:#c0c0c0;}
			#nav {width:95%;padding:0 2.5%;background-color:#1c38c0;font-size:1.125em;position:fixed;z-index:1;opacity:0.95;} #nav .right {width:70%;text-align:right;}
				#nav a {display:inline-block;padding:4.5% 4% 4.5%;color:gold;vertical-align:middle;} #nav a:active, #nav a:focus, #nav a:hover {background-color:#0020bf;color:white;} #nav .button {height:24px;}
				#nav ul {display:block;float:right;position:relative;}
				#nav .mobutton {display:block;padding:20px;font-size:1.25em;color:gold;}
				
		.sonnenstudio-info {width:100%;}
			#bannerpic {width:100%;}
			#slideshow {width:66.6666%;} #slideshow iframe {width:100%;height:100%;} #slider img {width:100%;}
			#opening-hours b {line-height:1.25;}
				.hline {font-size:1.375em;}
		
	  .solarium-headline, .aktuell {width:95%;padding:2.5%;text-align:center;overflow:hidden;}
	  		
			.container3 {color:white;width:95%;padding:2.5%;} .dr {text-align:center;color:white;} .dr img {width:96px;height:96px;} .dr p b {font-size:1.063em;}
			
			.imgblock {padding:1.75% 1.25%;margin:0.25%;color:#111;background:ivory;font-size:1.375em;z-index:0;font-variant:small-caps;letter-spacing:2;border-radius:16px;} .imgblock img {border:white 4px solid; transform:rotate(0deg);width:90%;z-index:-1;} .banner {width:95%;margin:0 auto;border-radius:16px;border:2px gold solid;}
	  .covid-19 {display:none;background:gold;color:black !important;width:95%;padding:2.5%;text-align:center;}
	  #opening-hours {background:#0020bf;padding:2.5%;}
	  .leistungen {width:100%;padding:0;background:#004fbf;color:white;text-align:center;overflow:hidden;} .leistungen h2 {color:white;}
	  		.iblock {width:75%;margin:2.5% auto;} .iblock h4 {display:block;width:95%;padding:2.5%;background:#0020bf;color:white;border-bottom:4px gold solid;} .iblock img {width:100%;margin:0;}
	  .aktuell {} 
	  .separator {width:95%;padding:2.5%;background:#333;color:ivory;font-size:1.125em;text-align:center;}
	  .sonnenbaenke {width:95%;padding:2.5%;text-align:center;}
	  		.sonnenbaenke #sunbeds .img {width:256px;height:222px;border:1px solid #f8f8f8;margin:-2px;background-size:cover;background-repeat:no-repeat;display:inline-block;overflow:hidden;} #sunbeds .img div {display:none;background:rgba(0,0,0,0.64);height:100%;} #sunbeds .img:hover div, #sunbeds .img:focus div {display:block;} #sunbeds .img a {color:gold;} #sunbeds .img a:hover, #sunbeds .img a:focus {background:gold;color:ivory;}
				#solarium_kabine1 {background-image:url(img/01_KBL_K9S.jpg);}
				#solarium_kabine2 {background-image:url(img/Sonnenstudio-Solarium-Sonnenbaenke.jpg);background-position:14.3% 0;}
				#solarium_kabine3 {background-image:url(img/08_megaSun_k6.jpg);}
				#solarium_kabine4 {background-image:url(img/Sonnenstudio-Solarium-Sonnenbaenke.jpg);background-position:42.9% 0;}
				#solarium_kabine5 {background-image:url(img/Sonnenstudio-Solarium-Sonnenbaenke.jpg);background-position:57.125% 0;}
				#solarium_kabine6 {background-image:url(img/Sonnenstudio-Solarium-Sonnenbaenke.jpg);background-position:28.6% 0;}
				#solarium_kabine7 {background-image:url(img/Sonnenstudio-Solarium-Sonnenbaenke.jpg);background-position:85.725% 0;}
				#solarium_kabine8 {}
				#solarium_kabine9 {background-image:url(img/Sonnenstudio-Solarium-Sonnenbaenke.jpg);background-position:0 0;}
			.span_green {color:#22ee33;font-weight:bold;} #sunbeds .img div p {color:white;text-align:left;margin:0.5% 5%;line-height:1.25;font-size:1.063em;text-shadow:#111111 1px 1px 1px;}
		.suncard {width:90%;padding:5%;text-align:center;background:#333;color:white;font-size:1.375em;} .suncard p {display:inline-block;margin-right:2.5%;} .suncard img {display:inline-block;margin-left:2.5%;}
		
		.bessersonnen {width:95%;padding:2.5%;text-align:center;color:white;text-shadow:4px 4px #003786;font-size:1.375em;} .bessersonnen img {border:white 4px solid;transform:rotate(5deg);}
		
		.map {width:100%;} .map img {display:block;width:100%;}
		
	#footer {width:96%;padding:2.5% 2%;background:#282828;color:white;text-align:left;overflow:hidden;line-height:1.125;}
		#footer ul {margin:1.25%;}
			#footer ul li {} #footer ul li a{color:ivory;} #footer ul li a:hover, #footer ul li a:focus {color:#aaa;} .partner img {height:32px;filter:brightness(3000%);} .kanaele img {margin-right:16px;} .partner img:hover, .partner img:focus, .kanaele img:hover, .kanaele img:focus {filter:brightness(80%);}
	#copy {width:95%;padding:0.625% 2.5%;background:#222;color:#aaa;overflow:hidden;font-size:0.75em;} #copy a {color:white;} #copy a:hover, #copy a:focus {color:#aaa;}
			


.sonnennav {width:95%;padding:5% 2.5%;background:#0020bf;text-align:center;} .sonnennav img {display:inline-block;margin:2.5%;width:25%;} .sonnennav img:hover, .sonnennav img:focus {opacity:0.64;border:ivory solid 4px;margin:calc(2.5% - 4px);}

.container2 {width:95%;padding:5% 2.5%;} .kab {display:inline-block;padding:16px;height:18px;background:white;color:black !important;font-variant:small-caps;font-size:1.25em;border:4px solid #ccc;border-right:none !important;} .num {display:inline-block;padding:16px;background:black;color:white !important;font-size:1.25em;font-family:Impact,Charcoal,sans-serif;border:3px solid #ccc;border-left:none !important;} .imgbox {width:45%;padding:2.5%;text-align:center;} .imgbox img {width:66.6%;border:white 4px solid;transform:rotate(-3deg);} .textbox {width:45%;padding:2.5%;text-align:center;} .textbox p {text-align:left;color:ivory;}

.kosmetik, .infothek {width:90%;padding:5%;text-align:center;} .kosmetik a, .infothek a {color:#aaccff;} .kosmetik a:hover, .kosmetik a:focus, .infothek a:hover, .infothek a:focus {color:ivory;} .kosmetik p, .infothek p {color:white;} .infothek h5 {color:gold;}

#about, #kontakt, #impressum, #sunbedvideo, .infoblock {width:95%;padding:10% 2.5% 5%;text-align:center;overflow:hidden;} #about img {width:96% !important;border:white 4px solid !important;transform:rotate(-3deg);}

#kontakt a, #kontakt a:link, #kontakt a:visited, #impressum a, #impressum a:link, #impressum a:visited, #dschutz a, #dschutz a:link, #dschutz a:visited, #sunbedvideo a, #sunbedvideo a:link, #sunbedvideo a:visited, .imgbox a, .imgbox a:link, .imgbox a:visited, .infoblock a, .infoblock a:link, .infoblock a:visited {color:gold;} 
#kontakt a:hover, #kontakt a:active, #kontakt a:focus, #impressum a:hover, #impressum a:active, #impressum a:focus, #dschutz a:hover, #dschutz a:active, #dschutz a:focus, #sunbedvideo a:focus, #sunbedvideo a:hover, #sunbedvideo a:active, .imgbox a:hover, .imgbox a:focus, .imgbox a:active, .infoblock a:hover, .infoblock a:focus, .infoblock a:active {color:ivory;}

#dschutz {width:90%;padding:5%;} #dschutz p {margin:16px auto;} #dschutz h3 {margin-top:16px;}

.k6link, .k6link:link, .k6link:visited {color:yellow;} .k6link:hover, .k6link:focus, .k6link:active {color:white;}

.diablockimg {display:block;}
.diablock {margin:0 auto;background-color:white;color:#333;font-family:Arial, Helvetica, sans-serif;font-size:1em;}
	.diatext {float:left;text-align:left;height:24px;vertical-align:middle;}
	.diagramm {float:left;margin-left:0;height:24px;}
	.diainfo {margin:0 auto;color:white;font-size:0.938em; line-height:1.063;text-align:left;}

.vhslink, .vhslink:link, .vhslink:visited {display:inline-block;font-weight:bold;padding:8px;color:gold;background:#0020c0;}
	.vhslink:hover, .vhslink:focus, .vhslink:active {display:inline-block;padding:8px;color:ivory;background:#0080ff;}

.k6_info {display:none;}




#cookiedingsbums a, #cookiedingsbums a:visited, #cookiedingsbums a:active {color:gold; text-decoration:none;}

#cookiedingsbums a:hover, #cookiedingsbums a:focus {text-decoration:underline;color:white;}

#cookiedingsbums div {padding:10px; padding-right:40px;}

#cookiedingsbums { 
   outline: 1px solid #7b92a9; 
   text-align:right; 
   border-top:1px solid #fff;
   background: #0020bf; 
   filter: progid:DXImageTransform.Microsoft.gradient(   startColorstr='#d6e0eb', endColorstr='#f2f6f9',GradientType=0 ); 
   position:fixed;
   bottom:0px; 
   z-index:10000; 
   width:100%; 
   font-size:12px; 
   line-height:16px;}

#cookiedingsbumsCloser {
   color: #777;
   font: 14px/100% arial, sans-serif;
   position: absolute;
   right: 5px;
   text-decoration: none;
   text-shadow: 0 1px 0 #fff;
   top: 5px;
   cursor:pointer;
   border-top:1px solid white; 
   border-left:1px solid white; 
   border-bottom:1px solid #7b92a9; 
   border-right:1px solid #7b92a9; 
   padding:4px;
   background: #ced6df; /* Old browsers */
   background: -moz-linear-gradient(top, #ced6df0%, #f2f6f9 100%); 
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ced6df), color-stop(100%,#f2f6f9)); 
   background: -webkit-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: -o-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: -ms-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: linear-gradient(to bottom, #ced6df0%,#f2f6f9 100%); 
   filter: progid:DXImageTransform.Microsoft.gradient(    startColorstr='#ced6df', endColorstr='#f2f6f9',GradientType=0 ); 
 }

#cookiedingsbumsCloser:hover {border-bottom:1px solid white; border-right:1px solid white; border-top:1px solid #7b92a9; border-left:1px solid #7b92a9;}

