/* latin */
@font-face {
  font-family: 'Neuton';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/neuton/v22/UMBRrPtMoH62xUZCyrg4Wi_XBLM4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Neuton';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/neuton/v22/UMBQrPtMoH62xUZKAKkvfQr4LLkw6A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Neuton';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/neuton/v22/UMBQrPtMoH62xUZKZKovfQr4LLkw6A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Neuton';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/neuton/v22/UMBTrPtMoH62xUZCz4g6UCj1Bg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Neuton';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/neuton/v22/UMBQrPtMoH62xUZKdK0vfQr4LLkw6A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Neuton';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/neuton/v22/UMBQrPtMoH62xUZKaK4vfQr4LLkw6A.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

* {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
	font-family: 'Neuton', serif  !important;
	font-weight: 300 !important;
	letter-spacing:1px;
	background-color: #000;
	color: #fff;
	letter-spacing: 0.03vw;
	margin: 0;
	padding: 0;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

#wrapper {
	margin: 0 auto;
	max-width: 1280px;
	margin-top: 1vw;
	/*
	border: 3px solid white;
	*/
}

a {
	text-decoration: none;
	color: #cf0;
}

a:hover {
	color: #fff;
}

#left {
	float: left;
	width: 30%;
}

#logo {
	margin: 2vw 0 0 0;
	padding: 0;
	height: auto;
	width: 90%;
}

#logo img {
	margin: 0;
	padding: 0;
	max-width: 100%;
	height: auto;
	display: block;
}

.logoMobil {
	display: none;
}

.frauenpartyMobil {
	display: none;
}

a.menu-link img {
	display: none;
}

#teaser {
	margin: 2vw 0 .75em 7%;
}

#teaser .adr-mobil {
	display: none;
}

ul.nav-mobile {
	display: none;
}

.menu {
	clear: both;

	position: relative;
	padding: 0;
	margin: 0;
	background-color: #000;
}

.line1 {
	padding: 2% 0 0 0;
	margin: 0 0 0 1.5%;
	width: 55%;
}

.line1 img.lineGruen {
	transform: rotate(-7.5deg);
	margin: 0;
	padding: 0;
	display: block;
	width: 100%;
	border-top: 1px solid #cf0;
}


.menu ul {
	background-color: #000;
	list-style-type: none;
	margin: .5em 0 .5em 2%;
	padding: .5em 0;
	width: 50%;
}

.menu li {
	list-style-type: none;
	background-color: #000;
	margin: 5% 0 0 10%;
	padding: 0;
}

.menu a {
	margin: 0;
	padding: 0;
	color: #cf0;
	text-decoration: none;
}

.menu a:hover {
	color: #fff;
}

.menu a.on {
	color: #fff;
}

.line2 {
	padding: 0;
	margin: 0 0 0 1.5%;
	width: 55%;
}

.line2 img.lineViola {
	transform: rotate(-7.5deg);
	margin: 0;
	padding: 0;
	display: block;
	width: 100%;
	border-top: 1px solid #96f;
}

#more {
	margin: 1.5vw 0 0 8%;
}

#more a.more {
	text-decoration: none;
	color: #96f;
}

#more a.more:hover {
	color: #fff;
}

#more img.facebook {
	width: 10%;
	height: auto;
	margin-top: 1vw;
}

#more img.instagram {
	width: 10%;
	height: auto;
	margin-top: 1vw;
}

.moreMobil {
	display: none;
}

#right {
	margin-left: 3%;
	float: right;
	width: 65%;
}

.sliderMobil {
	display: none;
}

.holderTop {
	display: flex;
	justify-content: flex-end;
	float: right;
	padding: 2vw 5% 0 0;
}

.exil {
	margin-right: 5%;
}

.exil a {
	text-decoration: none;
	color: #cf0;
	margin: 0;
	padding: 0;
}

.exil a:hover {
	color: #fff;
}

.exil .nobr {
	white-space: nowrap;
}

#content {
	clear: both;
	width: 80%;
}

/*nl*/
#content #headline h2 {
	padding: 1vw 0 .5vw 0;
	margin: 0;
}

#content ul {
	margin-left: 5%;
}

#text {
	width: 100%;
	padding-bottom: 2vw;
}

#headlineWelcome h2 {
	padding: 1vw 0 1vw 0;
	margin: 0;
}

#text #headline h2 {
	padding: 1vw 0 .5vw 0;
	margin: 0;
}

#textWelcome {
	padding-top: .5vw;
	padding-bottom: 2vw;
}

#text h3 {
	padding: 1.5vw 0 0.5vw 0;
}

#text p {
	padding-bottom: .5vw;
}

#textWelcome p {
	padding-top: .5vw;
}

#text li {
	padding-bottom: .5vw;
}


/*-------slider----------*/

.outside {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

#slideshow {
	width: 1200%;
	height: auto;
	position: relative;
	animation: 30s slideranimation infinite;

}

@keyframes slideranimation {
	0% {
		left: 0;
	}

	5% {
		left: 0;
	}

	10% {
		left: -120%;
	}

	15% {
		left: -120%;
	}

	20% {
		left: -240%;
	}

	25% {
		left: -240%;
	}

	30% {
		left: -360%;
	}

	35% {
		left: -360%;
	}

	40% {
		left: -480%;
	}

	45% {
		left: -480%;
	}

	50% {
		left: -600%;
	}

	55% {
		left: -600%;
	}

	60% {
		left: -720%;
	}

	65% {
		left: -720%;
	}

	70% {
		left: -840%;
	}

	75% {
		left: -840%;
	}

	80% {
		left: -960%;
	}

	85% {
		left: -960%;
	}

	90% {
		left: -1080%;
	}

	95% {
		left: -1080%;
	}

	100% {
		left: -1080%;
	}
}

#slideshow .slide {
	display: flex;
}


#slideshow .slide .img-holder {
	display: block;
	height: auto;
	width: 55%;
}

#slideshow .slide .img-holder img {
	margin: 0;
	padding: 0;
	max-width: 100%;
	height: auto;
	display: block;
}

/*-------ende slider-----*/



.galerieliste {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.galerieliste .foto-uebersicht {
	display: block;
	width: 29%;
	margin: 0 1em 1em 0;
	padding: 0;
	border: 1px solid #c3c3c3;
}

.galerieliste .foto-uebersicht .bild {
	width: 100%;
}

.galerieliste .foto-uebersicht .bild img {
	max-width: 100%;
}

.galerieliste .foto-uebersicht .datum {
	background-color: black;
	color: white;
	padding: .25em 0 .25em .25em;
}

/*-------galerie - u s. lightbox.css---------*/

#galerie {
	width: 100%;
}

#galerie .box {
	width: 100%;
	height: 100%;
}

#galerie .box .image {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

#galerie .box .image img {
	width: 100px;
	height: 100px;
	margin: 0 .5em .5em 0;
	max-width: 100%;
	border: 1px solid #c3c3c3;
}

/*-------ende galerie----*/

/*-------newsletter form----*/
#newsletterForm {
	margin-top: 2em;
}


#newsletterForm #Mail label.email,
#newsletterForm #Mail input.email,
#newsletterForm #Dropdown label.dropdown,
#newsletterForm #Dropdown input.dropdown,
#newsletterForm #Policy label.policy,
#newsletterForm #Policy input.policy{
	display: block;
	margin: 0;
	padding:0;
	font-size:24px;
}

#newsletterForm #Mail input.email {
	background-color:black;
	color:white;
	font-family: 'Neuton', serif  !important;
	font-weight: 300 !important;
	border-radius: 0;
	width: 40%;
	margin: 0 0 1em 0;
	padding: 3px 0 5px 5px;
	border: 1px solid #96f;
}

#newsletterForm select.dropdown {
	font-size:16px;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	appearance: none;
	outline: 0 none;
	width: 41%;
	margin: 0 0 1em 0;
	padding: 3px 0 5px 5px;
	font-family: 'Neuton', serif  !important;
	font-weight: 300 !important;
	border-radius: 0;
	background-image: url("https://www.tanzleila.ch/cms/upload/design/tl_pfeilSelect.gif");
	background-position: right;
	background-repeat: no-repeat;
}

#newsletterForm #Policy {
}

#newsletterForm #Policy label.policy {
	display: flex;
	align-items: first baseline;
	line-height:135%;
}

#newsletterForm #Policy label.policy div.policy {
	margin-left:1%;
}

#newsletterForm input.submit,
#newsletterForm select.dropdown {
	font-family: 'Neuton', serif  !important;
	font-weight: 300 !important;
	font-size:24px;
	color: white;
	padding: 3px 0 5px 5px;
	border-radius: 0;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	appearance: none;
	outline: 0 none;
	background-color:black;
	border: 1px solid #96f;	
}


#newsletterForm input:hover,
#newsletterForm input:focus,
#newsletterForm select:hover,
#newsletterForm select:focus {
	border: 1px solid rgb(255, 255, 255);
}

#newsletterForm input[type="submit"] {
	font-size:24px;
	text-align: left;
	clear: both;
	width: auto;
	width: 40%;
	color: #96f;
	margin: 1em 0 1em 0;
}

#newsletterForm input[type="submit"]:hover {
	color: white;
}

/*-------ende newsletter form---------*/


@media screen and (min-width:2560px) {
	body {
		font-size: 1.5rem;
		line-height: 120%;
	}

	#wrapper {
		max-width: 1280px;
		/*
		border:4px solid aqua;		
		*/
	}

}

@media screen and (min-width:1920px) and (max-width:2560px) {
	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	#wrapper {
		max-width: 1280px;	
		/*	
		border:4px dashed orange;	
		*/
		
	}

	.left {
		width: 40%;
	}


	.right {
		width: 50%;
	}

	.content {
		width: 70%;
	}

}

@media only screen and (min-width:1600px) and (max-width:1920px) {

	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	#wrapper {	
		/*			
			border:4px dotted yellow;	
			*/		
	}

}



@media only screen and (min-width:1280px) and (max-width:1600px) {
	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	#wrapper {	
		/*	
			border:4px dashed red;		
			*/	
	}

	#left {
		padding-left: 2%;
	}

	#more img.facebook {
		margin-top: 1vw;
	}

}


/*macbook 13"*/
@media only screen and (min-width:1024px) and (max-width:1280px) {

	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	#wrapper {		
		/*
			border:5px dotted aqua;		
		*/	
	}

	#left {
		padding-left: 2%;
	}

	#more img.facebook {
		margin-top: 1vw;
	}

}


/*iPad quer*/
@media only screen and (min-width:769px) and (max-width:1024px) {
	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	#wrapper {
		/*
			border:4px solid pink;	
		*/			
	}

	#left {
		padding-left: 2%;
	}

	#more img.facebook {
		margin-top: 1vw;
	}

	.galerieliste {
		width: 110%;
	}

	.galerieliste h3 {
		width: 27%;
	}

}


/*iPad hoch / iphone 12 cb*/
@media only screen and (max-width:768px) {
	* {
		box-sizing: border-box;
	}

	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	#wrapper {
		margin: 0;
		padding: 0;
		width: 100%;
		/*
		border: 3px dashed rgb(36, 154, 251)	
		*/
		
	}

	#left {
		float: none;
		width: 100%;
	}

	#logo {
		display: none;
	}


	.holderMobil {
		display: flex;
		width: 100%;
		margin: 0;
		padding: 0;
	}


	.holderMobil .logoMobil {
		position: relative;
		z-index: 10;
		display: block;
		margin: 0 -10% 0 0 !important;
		padding: 0;
		height: auto;
		width: 50% !important;
	}

	.holderMobil .logoMobil img {
		margin: 0;
		padding: 4% 0 0 2%;
		max-width: 100%;
		height: auto;
		display: block;
	}

	/*slider*/
	#slider {
		display: none;
	}

	.outside {
		display: none;
	}

	.holderMobil .sliderMobil {
		display: block;
		padding: 0;
		margin: 0;
		width: 70%;
	}

	.holderMobil .sliderMobil .outside-mobile {
		display: block;
		margin: 0;
		padding: 0;
		width: 100%;
		overflow: hidden;
	}

	.holderMobil .sliderMobil .outside-mobile #slideshow-mobile {
		width: 1200%;
		height: auto;
		position: relative;
		top: 0;
		right: 0;
		animation: 30s slideranimation infinite;

	}

	.holderMobil .sliderMobil .outside-mobile #slideshow-mobile .slide {
		display: flex;
	}

	.holderMobil .sliderMobil .outside-mobile #slideshow-mobile .slide .img-holder {
		display: block;
		height: auto;
		width: 55%;
	}

	.holderMobil .sliderMobil .outside-mobile #slideshow-mobile .slide .img-holder img {
		margin: 0;
		padding: 0;
		max-width: 100%;
		height: auto;
		display: block;
	}

	ul.nav-mobile {
		display: none;
	}

	#navigation {
		width: 100%;
		margin: 0;
		padding: 0;
	}

	a.menu-link {
		display: block;
		float: left;
		background: url("https://www.tanzleila.ch/cms/upload/design/tzToggle.png") no-repeat;
		background-size: 100%;
		margin: 5% 0 0 2.5%;
		padding: 5%;
	}

	.menu {
		margin: 0 0 0 2%;
		padding: 0;
		/*zugeklappt*/
		overflow: hidden;
		/*wichtig!*/
		line-height: 0;
		max-height: 0;
		width: 100%;

	}

	#teaser {
		display: block;
		line-height: 140%;
		margin: 0;
		padding: 1em 0 1em 2%;
	}

	#teaser .adr-mobil {
		display: block;
	}

	.menu .line1 {
		clear: both;
		width: 30%;
		margin: 0;
		padding: 0 0 2em 0;
	}

	/*Menusymbol*/
	.menu.active,
	/*Navigation*/
	.menu>ul ul.active {
		max-height: 200vh !important;
		/*
		border: 3px dotted orange;
		*/
	}

	.menu ul {
		margin: 0;
		padding: 0 0 1vw 0;
		width: 85% !important;
	}

	.menu li {
		list-style-type: none;
		margin: 0 0 0 2% !important;
		padding: 0;
	}

	.menu ul li a {
		line-height: 140%;
		margin: 0;
		padding: 0;
	}

	.menu .line2 {
		clear: both;
		margin: 0;
		width: 30%;
		padding: .5em 0 2em 0;
	}

	.menu #more {
		display: block;
		clear: both;
		width: 85%;
		margin: 0 0 0 2%;
	}

	.menu #more a.more {
		line-height: 140%;
		margin: 0;
		padding: 0;
		text-decoration: none;
		color: #96f;
	}

	.menu #more a.more:hover {
		color: #fff;
	}

	.menu #more img.facebook {
		width: 5%;
		height: auto;
		margin-top: 1em;
		margin-bottom: 1em;
	}

	.menu #more img.instagram {
		width: 5%;
		height: auto;
		margin-top: 0;
		margin-bottom: 1em;
	}


	#right {
		float: none;
		width: 100%;
		margin: 2% 0 0 0;
		max-width: 100%;
	}

	.exil {
		display: none;
		border: none;
	}

	.frauenparty {
		display: none;
	}

	#content {
		margin: 0;
		padding: 0 5% 5% 4%;
		width: 90%;
	}

	#content #headlineWelcome h2,
	#content #headline h2,
	#text #headline h2 {
		padding: 3vw 0 .5vw 0;
		margin: 0;
	}

	img.djanes {
		display: none;
	}

	.standbildHolder {
		display: block;
		float: right;
		margin-right: 1vw;
		width: 60%;
		height: auto;
	}

	.standbildHolder img.standbildMobil {
		max-width: 100%;
		height: auto;
	}

	.galerieliste {
		width: 120%;
		width: 110%;
	}

	.galerieliste h3 {
		width: 27%;
	}

}

/*Samsung quer u iPhone 6s quer Galerie*/

@media screen and (max-width:736px) {

	#wrapper {		
		/*
			border: 5px dashed rgb(131, 252, 131);	
		*/		
	}

	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	/*Menusymbol*/
	.menu.active,
	/*Navigation*/
	.menu>ul ul.active {
		max-height: 300vh !important;
		display:block;
	}
		

	#newsletterForm select.dropdown,
	#newsletterForm #Mail input.email,
	#newsletterForm input[type="submit"]  {
		width: 85%;
	}

}


/*iphone 5s quer*/

@media screen and (max-width:640px) {
	#wrapper {
		/*						
		border: 10px solid rgb(210, 169, 4);	
		*/		
	}

	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	/*Menusymbol*/
	.menu.active,
	/*Navigation*/
	.menu>ul ul.active {
		max-height: 200vh !important;
	}
}


/*iphone 4s quer*/

@media screen and (max-width:480px) {
	#wrapper {
		/*
		border: 2px solid rgb(208, 208, 208);	
		*/			
	}

	body {
		font-size: 1.3rem;
		line-height: 140%;
	}

	h2 {
		padding-bottom: 1em;
	}

	h3 {
		padding-bottom: .5em;
	}

	.menu.active img,
	.menu>ul ul.active img{
		display:block !important;
	}

	#more {
		height: auto !important;
	}

	.facebook {
		display: block !important;
		width: 30px !important;
		height: 30px !important;
		padding: 1em 0 0 0;
		margin: 0 0 1em 0;
	}

	.facebook img {
		display: block !important;
		width: 30px !important;
		height: 30px !important;
		padding: 0;
	}

	.instagram {
		display: block !important;
		width: 30px !important;
		height: 30px !important;
		padding: 0;
		margin-top: 3em !important;
	}

	.instagram img {
		display: block !important;
		width: 30px !important;
		height: 30px !important;
		padding: 0;
	}

	.galerieliste {
		display: block;
	}

	.galerieliste .foto-uebersicht {
		display: block;
		width: 90%;
		margin: 0 0 1em 0;
		padding: 0;
		border: 1px solid #c3c3c3;
	}
	
	#galerie {
		display: block;
		width:360px;
		margin:0;
		padding:0;
	}
	
	#galerie .box {
		width:360px;
		margin:0;
		padding:0;
	}
	}

	#galerie .box .image img {
		width: 100px;
		height: 100px;
		padding: 0;
		margin: 0 .35em .25em 0;
	}

}


/*iphone hoch*/

@media screen and (max-width:380px) {

	#wrapper {
	/*
		border: 2px dashed rgb(195, 0, 163);
	*/		
	}

	body {
		font-size: 1.5rem;
		line-height: 140%;
	}

	.galerieliste {
		display: block;
	}

	.galerieliste .foto-uebersicht {
		display: block;
		width: 90%;
		margin: 0 0 1em 0;
		padding: 0;
		border: 1px solid #c3c3c3;
	}
	
	#galerie {
		display: block;
		width:360px;
		margin:0;
		padding:0;
	}
	
	#galerie .box {
		width:360px;
		margin:0
		padding:0;
	}

	#galerie .box .image img {
		width: 100px;
		height: 100px;
		padding: 0;
		margin: 0 .35em .25em 0;
	}
}

/*
	.CMS_LINK_EDIT,
	.CMS_LINK_SAVE,
	.CMS_LINK_EDIT img,
	.CMS_LINK_SAVE img  {
		border: 1px solid red;
		position:relative;	
		z-index: 10000000;
	}
	
	.CMS_LINK_EDIT img,
	.CMS_LINK_SAVE img  {
		padding: 0px !important; 
		margin:0;	
		border: 1px solid aqua;		
	}
*/