@font-face {
	font-family: 'open_sansregular';
	src: url('inc/fonts/opensans_regular/OpenSans-Regular-webfont.eot');
	src: url('inc/fonts/opensans_regular/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('inc/fonts/opensans_regular/OpenSans-Regular-webfont.woff') format('woff'), url('inc/fonts/opensans_regular/OpenSans-Regular-webfont.ttf') format('truetype'), url('inc/fonts/opensans_regular/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

*, html, body, div, p, blockquote, #content p, strong, em, ul li, li, a, cite {
	font-family: 'open_sansregular', Verdana, sans-serif;
	font-weight: normal;
	text-decoration: none;
	color: #111111;
	/* fast schwarz*/
	/*letter-spacing: 0.5px; / 170%;   ?????? 
word-spacing: 170%;
line-height: 170%; */
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
	box-sizing: border-box;
}

@-ms-viewport {
	width: device-width;
	zoom: 1;
}

@-o-viewport {
	width: device-width;
	zoom: 1;
}

@viewport {
	width: device-width;
	zoom: 1;
}

html, body {
	background-color: #eee;
	/*#999999;*/
}

body {
	padding: 10px;
}

h1, h3, h5, h2, h4, h6,
[data-toolti], p {
	-webkit-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}

/* FONT-SIZE  AND COLOR */

html {
	font-size: 62.5%;
}

body, p, #content p, strong, em, ul li, li, a, cite {
	font-size: 14px;
	font-size: 1.4rem;
}

h1 {
	font-size: 36px;
	font-size: 3.6rem;
}

.home {
	height: 36px;
	height: 3.6rem;
	width: auto;
	vertical-align: middle;
}

h2 {
	font-size: 28px;
	font-size: 2.8rem;
}

h3, li a {
	font-size: 24px;
	font-size: 2.4rem;
}

h4 {
	font-size: 20px;
	font-size: 2.0rem;
}

.zentrieren {
	text-align: center;
	margin: 0;
	padding: 0;
}

.smaller {
	font-size: smaller;
}

/* ??? */

.ic {
	color: #5b5b5b;
	font-style: normal;
}

.ic:hover {
	color: #1f1f1f;
	font-style: normal;
}

a, a:link, a:visited {
	color: #595959;
	text-decoration: none;
}

a:focus, a:hover, a:active {
	color: #b3b3b3;
	text-decoration: none;
}



#content a, #content a:link, #content a:visited {
	color: #701f29;
	text-decoration: none;
}

#content a:focus, #content a:hover, a:active {
	color: #B22222;
	text-decoration: none;
}




/* vorher container statt content wegwn safari slider */

#container, #conshop {
	max-width: 1300px;
	/* ueberlegen */
	margin: 20px auto;
	padding: 20px;
	text-align: center;
	background-color: white;
	/*#ccc;*/
	border: 1px solid black;
	/*letter-spacing: 0.5px;  170%; Fehler bei SLIDER 
word-spacing: 170%;*/
	line-height: 170%;
	border-radius: 10px;
	box-shadow: 5px 5px 5px #444444;
}

#conshop {
	max-width: 1300px;
	margin: 20px auto;
	background-color: white;
}

/* ANFANG TOP */

#oben, #kugeln, #kugeln2 {
	text-align: center;
}

h1#oben {
	font-size: 25px;
	line-height: 30px;
}

#top {
	margin: auto;
	text-align: center;
}

/* Navigation kugeln und 2 kugeln zentrieren */

.topnavi, .smartbox, #kugeln2, .fb {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	/* horizontale reihe */
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	/* wrap mehrere zeilen */
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	/* sicheres Fallback navigation zentrieren */
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	/* V-Achse */
	-ms-flex-line-pack: stretch;
	align-content: stretch;
	/* bei 2 Zeilen V-Achse */
	margin: 10px auto;
	margin: 1rem auto;
	text-align: center;
}

/* platz um 2 kugeln */

#kugeln2, .fb {
	-ms-flex-pack: distribute;
	justify-content: space-around;
	-webkit-box-pack: space-evenly;
	-ms-flex-pack: space-evenly;
	justify-content: space-evenly
}

/* bildkreis definiert kugeln */

.bildkreis {
	border-radius: 50%;
	width: 50px;
	height: 50px;
	width: 5.6vw;
	height: 5.6vw;
	margin: 10px;
	box-shadow: 5px 5px 5px #999999;
}

.bildkreis:hover {
	box-shadow: 5px 5px 5px #444444;
}

.topnavi a, .smartbox a {
	text-align: center;
	border-radius: 10px;
}

.topnavi a:hover {
	box-shadow: 3px 3px 3px #999999;
}

/* ENDE TOP */

/* GHOST BUTTON */

.ghost-btn {
	color: #5b5b5b;
	background: #fff;
	border: 1px solid black;
	/*#5b5b5b;*/
	/*font-size: 17px;*/
	padding: 8px;
	/*7px 12px;*/
	font-weight: normal;
	margin: 8px;
	/* 6px 0; */
	/*margin-right: 12px;*/
	min-width: 100px;
	/* 120px;*/
	display: inline;
	display: inline-block;
	text-decoration: none;
	cursor: pointer;
	border-radius: 10px;
}

.ghost-btn:hover {
	-webkit-transition: 0.2s ease;
	-o-transition: 0.2s ease;
	transition: 0.2s ease;
	box-shadow: 2px 2px 2px #1f1f1f;
}

.ghost-btn:focus {
	outline: none;
}

/* ENDE GHOSTBUTTON */

/* ANFANG TOOLTIP 

a.tooltip {
	position: relative;
}

a.tooltip:before {
	content: attr(data-tooltip);
	font-size: 1.5vw;
	color: #333;
	position: absolute;
	z-index: 999;
	white-space: nowrap;
	bottom: 9999px;
	left: 0;
	top: 0;
	background: #eee;
	padding: 3px 8px;
	opacity: 0;
	height: 2vw;
	line-height: 2vw;
	border: 0.5px grey solid;
	border-radius: 5px;
	margin: auto;
}

a.tooltip:hover::before {
	opacity: 0.7;
	top: 0px;
	
}

a.tooltip:hover::after {
	content: "";
	opacity: 0.7;
	width: 0;
	height: 0;

	position: absolute;
	white-space: nowrap;
	
}
*/
/* ENDE TOOLTIP  */


/**
 * Tooltip Styles
 */

/* Add this attribute to the element that needs a tooltip */
[data-tooltip] {
  position: relative;
  z-index: 2;
  cursor: pointer;
}

/* Hide the tooltip content by default */
[data-tooltip]:before,
[data-tooltip]:after {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

/* Position tooltip above the element */
[data-tooltip]:before {
  position: absolute;
  bottom: 7vw;
  left: 50%;
  margin-bottom: 5px;
  margin-left: -50%; /* -80px; */
  padding: 7px;
  /* width: 160px; */
  border-radius: 5px;
  background-color: #eee;
  border: 1px solid transparent;
  color: #999;
  content: attr(data-tooltip);
  text-align: center;
  font-size: 1.3vw;
  line-height: 1vw;
}

/* Triangle hack to make tooltip look like a speech bubble */
[data-tooltip]:after {
  position: absolute;
   bottom: 7vw;
  left: 50%;
  margin-left: -5px;
  width: 0;
  border-top: 10px solid #eee;
 
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
  content: " ";
  font-size: 0;
  line-height: 0;
}

/* Show tooltip content on hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after {
  visibility: visible;;
  opacity: 1;
  
  width: intrinsic;           /* Safari/WebKit uses a non-standard name */
  width: -moz-max-content;    /* Firefox/Gecko */
  width: -webkit-max-content; /* Chrome */
  width: max-content;

 
}









/* ANFANG  RUNDE BILDER UND TEXTE */

.bildrund, .bildrund2 {
	margin: 1% auto;
	max-width: 90%;
	height: auto;
	border-radius: 10px;
	transition: transform 0.7s;
}

/* Schatten fuer bildrund */

.bildrund {
	box-shadow: 5px 5px 5px #999999;
}

.bildrund:hover, .bildrund2:hover {
	transform: scale(1.1, 1.1);
	box-shadow: 5px 5px 5px #444444;
}

.textrund {
	min-width: 0;
	display: inline-block;
	margin: 1%;
	height: auto;
	border-radius: 10px;
	/* CSS3 */
	box-shadow: 5px 5px 5px #aaaaaa;
	color: #111111;
	background-color: #ffffff;
	/*weiss*/
	background-color: #eeeeee;
	/*#dcdcdc;*/
	text-align: left;
	/*NEW*/
}

.textrund h3, .textrund p {
	margin: 1%;
	padding: 1%;
}

.textrund:hover {
	box-shadow: 5px 5px 5px #999999;
}

.textzentriert
/* WO */

	{
	height: 140px;
	display: table-cell;
	vertical-align: middle;
}

/* ENDE RUNDE BILDER UND TEXTE */

/* neue galerie */

.containerwrap {
	margin: 0 auto;
	max-width: 80%;
	padding: 10px;
}

.containerwrap img {
	border: 1px solid #000;
	border-radius: 10px;
	transition: transform 0.7s;
	margin-bottom: 10px;
	/* 20 this did the trick! */
	box-shadow: 5px 5px 5px #999999;
}

.containerwrap img:hover {
	transform: scale(1.025);
	box-shadow: 5px 5px 5px #444444;
}

.columns {
	display: inline-block;
	/* chrome ? */
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	table-layout: fixed;  /*für IE 11 */
	width: 100%;  /*für IE 11 */
	overflow-y: auto;  /* safari */
	overflow-x: hidden;  /* firefox */
}

.columns2 {
	display: inline-block;
	/* chrome ? */
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-count: 2;
	table-layout: fixed;  /*für IE 11 */
	width: 100%;  /*für IE 11 */
	overflow-y: auto;  /* safari */
	overflow-x: hidden;  /* firefox */
}

.columns3 {
	display: inline-block;
	/* chrome ? */
	-webkit-column-count: 3;
	-moz-column-count: 3;
	column-count: 3;
	table-layout: fixed;  /*für IE 11 */
	width: 100%;  /*für IE 11 */
	overflow-y: auto;  /* safari */
	overflow-x: hidden;  /* firefox */
}

.columns4 {
	display: inline-block;
	/* chrome ? */
	-webkit-column-count: 4;
	-moz-column-count: 4;
	column-count: 4;
	table-layout: fixed;  /*für IE 11 */
	width: 100%;  /*für IE 11 */
	overflow-y: auto;  /* safari */
	overflow-x: hidden;  /* firefox */
	/*
 -webkit-column-fill: balance-all;
 -moz-column-fill: balance-all;
 column-fill: balance-all; */
}

.columns img, .columns2 img, .columns3 img, .columns4 img {
	/* chrome ? 
   display: inline-block;  
  position: relative;
   max-width: 100%;
  */
	width: 100%;
	height: auto;
	max-width: 95%;
	border: 1px solid #000;
	border-radius: 10px;
	page-break-inside: avoid; // Firefox   
	column-break-inside: avoid; // Chrome, Opera, Safari
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	/* eigentlich braucht der edge das */
	break-inside: avoid;
}

@media only screen and (min-width: 1001px) {
	.columns {
		-moz-column-count: 4;
		-webkit-column-count: 4;
		column-count: 4;
	}
}

@media only screen and (max-width: 1000px) {
	.columns, .columns4 {
		-moz-column-count: 3;
		-webkit-column-count: 3;
		column-count: 3;
	}
}

@media only screen and (max-width: 800px) {
	.columns, .columns3, .columns4 {
		-moz-column-count: 2;
		-webkit-column-count: 2;
		column-count: 2;
	}
}

@media only screen and (max-width: 500px) {
	.columns, .columns3, .columns4 {
		-moz-column-count: 1;
		-webkit-column-count: 1;
		column-count: 1;
	}
}

/* ende GALLERY  GALLERY  GALLERY GALLERY GALLERY  */

/* NEUE GALLERY */

/* nowrap (default): all flex items will be on one line */

.gallery-nowrap-space-between {
	display: -webkit-box;
	display: -ms-flexbox;
	 display: flex;
	
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;  /* horizontale reihe */
	
	-webkit-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;  /* eine zeilen */
	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start; /* V-Achse */
	
	-ms-flex-line-pack: start;
	align-content: flex-start;   /* bei 2 Zeilen V-Achse */
}

.gallery-nowrap-space-between img,
.gallery-wrap-space-between img
 {
	vertical-align: top;
	max-width: 95%;
   height auto; /* default */
}

.fbnowrap4 a {
   margin: 1%;
   -webkit-box-flex: 1;
   -ms-flex: 1 1 20%;
   flex: 1 1 20%;
}

.fbnowrap3 a {
	 /* display: inline-block; FALLBACK IE 6 7 */
	/* display: table-row;  FALLBACK < IE 9 */
	margin: 1%;
   -webkit-box-flex: 1;
   -ms-flex: 1 1 27%;
   flex: 1 1 27%;
}

.fbnowrap2 a {
   margin: 1%;
	-webkit-box-flex: 1;
	-ms-flex: 1 1 35%;
	flex: 1 1 35%;
}

.fbnowrap2 a:first-child, .fbnowrap3 a:first-child, .fbnowrap4 a:first-child {
	margin-left: 0px;	
}

.fbnowrap2 a:last-child, .fbnowrap3 a:last-child, .fbnowrap4 a:last-child {
	margin-right: 0px;
	
	/* border: 1px green solid; */
}

a.w10 {flex: 1 1 10%;}
a.w11 {flex: 1 1 11%;}
a.w12 {flex: 1 1 12%;}

a.w15 {flex: 1 1 15%;}

a.w18 {flex: 1 1 18%;}
a.w19 {flex: 1 1 19%;}
a.w20 {flex: 2 2 20%;}

a.w22 {flex: 2 2 22%;}
a.w23 {flex: 2 2 23%;}
a.w24 {flex: 2 2 24%;}
a.w25 {flex: 2 2 25%;}
a.w26 {flex: 2 2 26%;}

a.w28 {flex: 2 2 28%;}
a.w29 {flex: 2 2 29%;}
a.w30 {flex: 3 3 30%;}

a.w32 {flex: 3 3 32%;}

a.w35 {flex: 3 3 35%;}
a.w36 {flex: 3 3 36%;}

a.w39 {flex: 3 3 39%;}
a.w40 {flex: 4 4 40%;}

a.w42 {flex: 4 4 42%;}

a.w45 {flex: 4 4 45%;}

a.w48 {flex: 4 4 48%;}

a.w50 {flex: 5 5 50%;}

a.w60 {flex: 6 6 60%;}

a.w70 {flex: 7 7 70%;}

a.w73 {flex: 7 7 73%;}

a.w75 {flex: 7 7 75%;}
a.w76 {flex: 7 7 76%;}

a.w80 {flex: 8 8 80%;}

a.w100 {flex: 10 10 100%;}

/* multiple lines */

.gallery-wrap-space-between {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	/* horizontale reihe */
	
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap; /* wrap mehrere zeilen */
	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start; /* V-Achse */
	
	-ms-flex-line-pack: start;
	align-content: flex-start; /* bei 2 Zeilen V-Achse */
	
	
}

.fbwrap a {
   margin: 1%;
   width: 22%;
}

.fbwrap3 a {
   margin: 1%;
   width: 30%;
  } 
.fbwrap4 a {
   margin: 1%;
   width: 22%;

}


@media only screen and (max-width: 500px) {
	.gallery-wrap-space-between,
	 .gallery-nowrap-space-between {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.containerwrap {
		max-width: 90%;
	}
	
	.fbwrap a, .fbwrap3 a, .fbwrap4 a,
	 .fbnowrap2 a, .fbnowrap3 a, .fbnowrap4 a {
		width: 100%;
	}
	
	
	
	.gallery-wrap-space-between img, .gallery-nowrap-space-between img, .w20, .w30, .w40 {
		max-width: 95% !important;
	}
}

/* NEW */

#footer, #footer p {
	text-align: center;
	margin-top: 40px;
	padding: 0;
}

.share-buttons
/* share buttons  WO */

	{
	list-style: none;
}

.share-buttons li {
	display: inline;
}

/*MEDIA QUERIES AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA */

@media only screen and (min-width:200px) and (max-width:599px) {
	/* FONT-SIZE  */
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 12px;
		font-size: 1.2rem;
	}
	h1 {
		font-size: 26px;
		font-size: 2.6rem;
	}
	.home {
		height: 26px;
		height: 2.6rem;
		width: auto;
	}
	h2 {
		font-size: 22px;
		font-size: 2.2rem;
	}
	h3, li a {
		font-size: 18px;
		font-size: 1.8rem;
	}
	h4 {
		font-size: 14px;
		font-size: 1.4rem;
	}
	.flexibel, .col a, .col a img, .col img {
		/*height: 50px;*/
		width: 100%;
		height: auto;
	}
	/*  links deaktivieren   urspr nur bei 400 - 600 */
	.col>a {
		pointer-events: none;
		cursor: default;
	}
	#content {
		margin-top: 0;
	}
	/* fuer portfolio */
	.bildrund {
		width: 100%;
		height: auto;
		margin: 10px;
		margin: 1rem;
		padding: 0;
	}
	.bildrund2 {
		width: 100%;
		/*80%;*/
		height: auto;
		margin: 10% auto;
	}
	.bildrund:hover, #content .bildrund2:hover {
		transform: scale(1, 1);
	}
	/* verbergen des tooltips*/
	a.tooltip::before, a.tooltip:hover::before, a.tooltip:hover::after {
		display: none;
	}
	/*  links deaktivieren */
	#gallery>a {
		pointer-events: none;
		cursor: default;
	}
}

@media only screen and (min-width:100px) and (max-width: 500px) {
	/* FONT-SIZE  */
	/* NEU Schriften AUf IPAD kleiner */
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 12px;
		font-size: 1.2rem;
	}
	h1 {
		font-size: 20px;
		font-size: 2.0rem;
	}
	.home {
		height: 20px;
		height: 2.0rem;
		width: auto;
	}
	h2 {
		font-size: 16px;
		font-size: 1.6rem;
	}
	h3, li a {
		font-size: 14px;
		font-size: 1.4rem;
	}
	h4 {
		font-size: 13px;
		font-size: 1.3rem;
	}
	.containerwrap img {
		margin-bottom: 20px;
	}
	[data-aos] {
		display: inline-block;
		opacity: 1;
		transform: translateY(0em);
	}
}

@media only screen and (min-width:501px) and (max-width:599px) {
	.flexibel, .col, .col a, .col a img, .col img img {
		max-width: 99%;
		height: auto;
	}
	/* links deaktivieren */
	.col>a {
		pointer-events: none;
		cursor: default;
	}
}

@media only screen and (min-width:600px) and (max-width:849px) {
	/* FONT-SIZE  */
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 13px;
		font-size: 1.3rem;
	}
	h1 {
		font-size: 27px;
		font-size: 2.7rem;
	}
	.home {
		height: 27px;
		height: 2.7rem;
		width: auto;
	}
	h2 {
		font-size: 23px;
		font-size: 2.3rem;
	}
	h3, li a {
		font-size: 17px;
		font-size: 1.7rem;
	}
	h4 {
		font-size: 15px;
		font-size: 1.5rem;
	}
	.flexibel {
		height: 100px;
	}
}

@media only screen and (min-width:720px) and (max-width:849px) {
	.textzentriert, .flexibel {
		height: 120px;
	}
}

@media only screen and (min-width:850px) and (max-width:1024px) {
	/* FONT-SIZE  */
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 14px;
		font-size: 1.4rem;
	}
	h1 {
		font-size: 28px;
		font-size: 2.8rem;
	}
	.home {
		height: 28px;
		height: 2.8rem;
		width: auto;
	}
	h2 {
		font-size: 24px;
		font-size: 2.4rem;
	}
	h3, li a {
		font-size: 20px;
		font-size: 2.0rem;
	}
	h4 {
		font-size: 16px;
		font-size: 1.6rem;
	}
	.textzentriert, .flexibel {
		height: 140px;
	}
}

@media only screen and (min-width:1025px) and (max-width:1199px) {
	/* FONT-SIZE  */
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 16px;
		font-size: 1.6rem;
	}
	h1 {
		font-size: 32px;
		font-size: 3.2rem;
	}
	.home {
		height: 32px;
		height: 3.2rem;
		width: auto;
	}
	h2 {
		font-size: 26px;
		font-size: 2.6rem;
	}
	h3, li a {
		font-size: 22px;
		font-size: 2.2rem;
	}
	h4 {
		font-size: 18px;
		font-size: 1.8rem;
	}
	.textzentriert, .flexibel {
		height: 160px;
	}
}

@media only screen and (min-width:1200px) and (max-width:1399px) {
	/* FONT-SIZE  */
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 16px;
		font-size: 1.6rem;
	}
	h1 {
		font-size: 40px;
		font-size: 4.0rem;
	}
	.home {
		height: 40px;
		height: 4.0rem;
		width: auto;
	}
	h2 {
		font-size: 32px;
		font-size: 3.2rem;
	}
	h3, li a {
		font-size: 24px;
		font-size: 2.4rem;
	}
	h4 {
		font-size: 20px;
		font-size: 2.0rem;
	}
	.textzentriert, .flexibel {
		height: 200px;
	}
}

@media only screen and (min-width:1400px) {
	/* FONT-SIZE  */
	body, p, #content p, strong, em, ul li, li, a, .linktd {
		font-size: 22px;
		font-size: 2.2rem;
	}
	h1 {
		font-size: 48px;
		font-size: 4.8rem;
	}
	.home {
		height: 48px;
		height: 4.8rem;
		width: auto;
	}
	h2 {
		font-size: 36px;
		font-size: 3.6rem;
	}
	h3, li a {
		font-size: 28px;
		font-size: 2.8rem;
	}
	h4 {
		font-size: 24px;
		font-size: 2.4rem;
	}
	.textzentriert, .flexibel {
		height: 225px;
	}
}

/* ENDE MEDIA QUERIES  */

/* PRINT STYLE SHEET */

@media only print {
	#kugeln2, .share42init {
		display: none;
	}
	body, #container, #footer, #footer .share42init, .share42init {
		margin: 0;
		padding: 0;
		border: 0;
	}
	/* FONT-SIZE  */
	html {
		font-size: 62.5%;
	}
	body, p, #content p, strong, em, ul li, li, a {
		font-size: 13px;
		font-size: 1.3rem;
	}
	h1 {
		font-size: 27px;
		font-size: 2.7rem;
	}
	.home {
		height: 27px;
		height: 2.67rem;
		width: auto;
	}
	h2 {
		font-size: 23px;
		font-size: 2.3rem;
	}
	h3, li a {
		font-size: 17px;
		font-size: 1.7rem;
	}
	h4 {
		font-size: 15px;
		font-size: 1.5rem;
	}
	.flexibel {
		height: 100px;
	}
}

/* ENDE  PRINT STYLE SHEET */

/* versteckt fuer Browser ab 480 Pixel */

.ipad, .toptopsmart, .ipad .toptopsmart a img {
	display: none;
	text-align: center;
	margin: auto;
}

.home {
	display: none;
}

/* Styling the Box */

@media only screen and (max-width:599px) {
	.home {
		display: inline;
		vertical-align: middle;
	}


/* IE sieht das und die anderen auch */

/* IPAD  */

/* Styling the Box */


	#container {
		margin: auto;
	}
	.ipad, .toptopsmart, .ipad .toptopsmart a img {
		display: inline-block;
		/*  sichtbar */
		text-align: center;
	}
	/* */
	#smartbox1, #smartbox2, #smartbox3 {
		display: none;
		max-width: 100%;
		text-align: center;
		margin: auto;
	}
	.smartbox {
		max-width: 100%;
		display: none;
		/* By Default the box is hidden */
	}
	/* This selector selects the box currently targeted */
	.smartbox:target {
		min-height: 0;
		display: inline;
		display: inline-block;
		width: 27%;
		margin: 1%;
		text-align: center;
	}
	.toptopsmart a .bildkreis, .toptopsmart .bildkreis {
		width: 100%;
		/* gleiche Breite wie */
		height: auto;
		/* Hoehe angeben damit es ein Kreis wird */
	}
}

/* ENDE IE sieht das und die anderen auch */

/* ende max width 479 *//*
 * FancyBox - jQuery Plugin
 * Simple and fancy lightbox alternative
 *
 * Examples and documentation at: http://fancybox.net
 * 
 * Copyright (c) 2008 - 2010 Janis Skarnelis
 * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
 * 
 * Version: 1.3.4 (11/11/2010)
 * Requires: jQuery v1.3+
 *
 * Dual licensed under the MIT and GPL licenses:
 *   http://www.opensource.org/licenses/mit-license.php
 *   http://www.gnu.org/licenses/gpl.html
 */

#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	margin-left: -20px;
	cursor: pointer;
	overflow: hidden;
	z-index: 1104;
	display: none;
}

#fancybox-loading div {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 480px;
	background-image: url('fancybox.png');
}

#fancybox-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1100;
	display: none;
}

#fancybox-tmp {
	padding: 0;
	margin: 0;
	border: 0;
	overflow: auto;
	display: none;
}

#fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	padding: 20px;
	z-index: 1101;
	outline: none;
	display: none;
}

#fancybox-outer {
	position: relative;
	width: 100%;
	height: 100%;
	background: #fff;
	
	-moz-border-radius:10px 10px 10px 10px !important; 
   border-radius:10px 10px 10px 10px !important; 
   -webkit-border-radius: 10px 10px 10px 10px !important; 
	 border-radius: 10px; /* NEW */
   box-shadow: 5px 5px 5px #444444; */ NEW */
}

#fancybox-content {
	width: 0;
	height: 0;
	padding: 0;
	outline: none;
	position: relative;
	overflow: hidden;
	z-index: 1102;
	border: 0px solid #fff;

   -moz-border-radius:10px 10px 10px 10px;
   border-radius:10px 10px 10px 10px;
   -webkit-border-radius: 10px 10px 10px 10px; 
}

#fancybox-hide-sel-frame {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: 1101;
}

#fancybox-close {
	position: absolute;
	top: -15px;
	right: -15px;
	width: 30px;
	height: 30px;
	background: transparent url('fancybox.png') -40px 0px;
	cursor: pointer;
	z-index: 1103;
	display: none;
}

#fancybox-error {
	color: #444;
	font: normal 12px/20px Arial;
	padding: 14px;
	margin: 0;
}

#fancybox-img {
	width: 100%;
	height: 100%;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	line-height: 0;
	vertical-align: top;
}

#fancybox-frame {
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

#fancybox-left, #fancybox-right {
	position: absolute;
	bottom: 0px;
	height: 100%;
	width: 35%;
	cursor: pointer;
	outline: none;
	background: transparent url('blank.gif');
	z-index: 1102;
	display: none;
}

#fancybox-left {
	left: 0px;
}

#fancybox-right {
	right: 0px;
}

#fancybox-left-ico, #fancybox-right-ico {
	position: absolute;
	top: 50%;
	left: -9999px;
	width: 30px;
	height: 30px;
	margin-top: -15px;
	cursor: pointer;
	z-index: 1102;
	display: block;
}

#fancybox-left-ico {
	background-image: url('fancybox.png');
	background-position: -40px -30px;
}

#fancybox-right-ico {
	background-image: url('fancybox.png');
	background-position: -40px -60px;
}

#fancybox-left:hover, #fancybox-right:hover {
	visibility: visible; /* IE6 */
}

#fancybox-left:hover span {
	left: 20px;
}

#fancybox-right:hover span {
	left: auto;
	right: 20px;
}

.fancybox-bg {
	position: absolute;
	padding: 0;
	margin: 0;
	border: 0;
	width: 20px;
	height: 20px;
	z-index: 1001;
}

#fancybox-bg-n {
	top: -20px;
	left: 0;
	width: 100%;
	background-image: url('fancybox-x.png');
}

#fancybox-bg-ne {
	top: -20px;
	right: -20px;
	background-image: url('fancybox.png');
	background-position: -40px -162px;
}

#fancybox-bg-e {
	top: 0;
	right: -20px;
	height: 100%;
	background-image: url('fancybox-y.png');
	background-position: -20px 0px;
}

#fancybox-bg-se {
	bottom: -20px;
	right: -20px;
	background-image: url('fancybox.png');
	background-position: -40px -182px; 
}

#fancybox-bg-s {
	bottom: -20px;
	left: 0;
	width: 100%;
	background-image: url('fancybox-x.png');
	background-position: 0px -20px;
}

#fancybox-bg-sw {
	bottom: -20px;
	left: -20px;
	background-image: url('fancybox.png');
	background-position: -40px -142px;
}

#fancybox-bg-w {
	top: 0;
	left: -20px;
	height: 100%;
	background-image: url('fancybox-y.png');
}

#fancybox-bg-nw {
	top: -20px;
	left: -20px;
	background-image: url('fancybox.png');
	background-position: -40px -122px;
}

#fancybox-title {
	font-family: Helvetica;
	font-size: 12px;
	z-index: 1102;
}

.fancybox-title-inside {
	padding-bottom: 10px;
	text-align: center;
	color: #333;
	background: #fff;
	position: relative;
}

.fancybox-title-outside {
	padding-top: 10px;
	color: #fff;
}

.fancybox-title-over {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #FFF;
	text-align: left;
}

#fancybox-title-over {
	padding: 10px;
	background-image: url('fancy_title_over.png');
	display: block;
}

.fancybox-title-float {
	position: absolute;
	left: 0;
	bottom: -20px;
	height: 32px;
}

#fancybox-title-float-wrap {
	border: none;
	border-collapse: collapse;
	width: auto;
}

#fancybox-title-float-wrap td {
	border: none;
	white-space: nowrap;
}

#fancybox-title-float-left {
	padding: 0 0 0 15px;
	background: url('fancybox.png') -40px -90px no-repeat;
}

#fancybox-title-float-main {
	color: #FFF;
	line-height: 29px;
	font-weight: bold;
	padding: 0 0 3px 0;
	background: url('fancybox-x.png') 0px -40px;
}

#fancybox-title-float-right {
	padding: 0 0 0 15px;
	background: url('fancybox.png') -55px -90px no-repeat;
}

/* IE6 */

.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png', sizingMethod='scale'); }

.fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png', sizingMethod='scale'); }

.fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; }
.fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png', sizingMethod='scale'); }
.fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png', sizingMethod='scale'); }

.fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame {
	height: expression(this.parentNode.clientHeight + "px");
}

#fancybox-loading.fancybox-ie6 {
	position: absolute; margin-top: 0;
	top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px');
}

#fancybox-loading.fancybox-ie6 div	{ background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png', sizingMethod='scale'); }

/* IE6, IE7, IE8 */

.fancybox-ie .fancybox-bg { background: transparent !important; }

.fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png', sizingMethod='scale'); }
.fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }