@CHARSET "UTF-8";

:root {
	--hek-colsize: 400px;
	--hek-colsize-small: 200px;
	--hek-detail-colsize: 300px;
	--button-width: 250px;
	--team-bg: #556c7a;
	--grid-head-bg-a: #4d606e;
	--grid-head-bg-b: #475462;
	--detail-bg-size: 80% auto;
	--detail-bg-blur: 4px;
	--detail-bg-filter:blur(5px) brightness(0.6);
	--detail-bg-opacity: 0.6;
	/* background:#393b3a!important; */ /* CH */
}

/*
 * Kategorie Ansicht alle Girls
 */

@media all

{

/* Category */
.items-row.rechts, .items-row.links {border:1px solid #f4f4f4; margin:20px 0;   }
.items-row.rechts a, .items-row.rechts a:hover, .items-row.rechts a:focus, .items-row.links a { text-decoration:none;}
.items-row.links { width:48%; float:left;}
.items-row.rechts { width:49%; float: right;}

.mailme { margin:5px 0 ;}

.capver {
	font-size: large;
}

.picbox_cat  { position:relative; text-align:center; margin:5px; }

.picbox_cat a, .picbox_cat a:hover, .picbox_cat a:active, .picbox_cat a:focus { background:none; }

.statusbox_cat{ position:absolute; bottom:3px; left:0;  width:265px;   padding:.2em 0 0 0;  height:2em; text-align:center; z-index:100; }

em, blockquote {
	color: #afafaf;
}

.girlsdesc {
	text-align:center;
	background:#f4f4f4;
	padding:10px;

	}

.cat_termine { color:#999; margin-top:.2em; }
.cat_mehrinfo { margin-top:.5em;}

.aghdr .hek-card-body {
	background-color: unset !important;
	margin-left: 5%;
	margin-right: 5%;
	margin-bottom: 2%;
	height: 100px;
	align-content: center;
	padding: 5px;
	border: 2px solid #a1895e;
}
.aghdr .hek-card-title {
	padding: 20px;
}
.aghdr .hek-card-body a {
	color: white!important;
}

.cat_art { position:absolute; bottom:4px; background:#e5ce84; padding:0.1em .5em; color:#000;}

/*


 * Status Farben

 */


.statusbox_cat.status1{ color:#000; }


.catbild { width:100%; max-width:695px;  }

.cat-titel h3 { color:#eeeeee; margin:0;text-transform:uppercase;}
.mailme .fa.fa-envelope-o { margin-right:.5em;}

.hek-wrapper {
	max-width: var(--hek-colsize);
	min-width: var(--hek-colsize-small);
}
.hek-wrapper-small {
	max-width: var(--hek-colsize-small);
}

.hek-video-wrapper {
	max-width: var(--hek-colsize);
}

.hek-image {
	transform: scale(0.95); 
	/* backdrop-filter: blur(5px);  */          /* blur effect */
	/* -webkit-backdrop-filter: blur(10px); */    /* Safari support */
	border-radius: 30px;
	cursor: pointer;
	transition: transform 0.3s ease;
	box-shadow:
			0 0 0 2px rgba(175, 159, 89, 0.7),
			0 0 0 6px rgba(175, 159, 89, 0.4),
			0 0 15px rgba(175, 159, 89, 0.3);
	align-items: center;
	box-sizing: border-box;
}
.hek-image::before {
	content: "";
	position: absolute;
	inset: 10px;
	border-radius: 20px;
	border: 1px solid rgba(175, 159, 89, 0.8);
	pointer-events: none;
}

.hek-small-text {
	font-size: small;
}

.hek-wrapper p,div {
	color: #d0d0d0;
}
/*

 * Detailansicht 

*/
.uk-accordion-title	{
	color: #dddddd!important;
	display: inline-block!important;
	transition: transform 0.3s ease!important;
}
.uk-accordion-title:hover	{
	color:  rgb(255, 226, 132)!important;
	transform: scale(1.2)!important;
}

.hek-card, .hek-card-default {
	padding-bottom:10px;
	padding-top:10px;
}
.uk-grid {
	padding-top:5px!important;
	padding-bottom:5px!important;
}
.uk-grid-margin {
	margin-top:0!important;
	margin-bottom:2px!important;
}
.uk-container {
	position:relative;
	z-index:1;
}
.uk-link a {
	color:#dddddd!important;
}
.uk-container h4 {
	color:#eeeeee!important;
}
.uk-section-default {
	background: var(--team-bg) !important;
}
.kontakthgdet {
/*	margin:2em 0; */
}

.anwesenheits_wrapper {
/* background:#f6f6f6; */
	width: var(--hek-detail-colsize);
    border: 3px solid rgba(175, 159, 89, 0.7);
    margin:1em 0 2em 0;
    padding:1em .5em;
    height: 220px;
}

.anwesenheits_wrapper a { color:#1C1C1C;}

	.termindetail {}
.infohgdet {}
.text_block {
	display:none!important;
}
.text_block.showit {
	display: block!important;
}
.toggle_area {
	cursor: pointer;
}
.mehranzeigen {}
.mehranzeigen.hide { display:none;}

.wenigeranzeigen { display:none;}
.wenigeranzeigen.show { display: block;}

.ym-grid.girlsdetail { margin-bottom:10px;}

.picbox_profil { position:relative; text-align:center; max-width:500px}

.picbox_profil h3 {
	color: #eeeeee;
	font-size: larger;
	font-weight: bolder;
}
.picbox_profil h4 {
		color: #eeeeee;
	font-size: 16px;
}

.beschreibung_kurz {
	margin-bottom: 20px;
}

.statusbox_profil{ position:absolute; bottom:10px; left:5px; background-color:#e5ac03; color:#fff; padding:0 3px;}

.eigenschaft-titel {
	font-size: 18px;
	color: #dddddd;
}

.slogan, .alter-titel {  margin:1em 0 2em 0;
  font-family: Verdana, sans-serif;
  font-variant: normal;
  font-weight:bold;
}

.eigenschaft {
	color: #cccccc;
	text-align: center;
	padding-top:15px;
	font-size: 16px;
}
.eigenschaft a {
		color: #dddddd;
}

.eigenschaft a:hover {
	color: #ffffff;
}


.resizable-video {
	transition: all 0.5s ease;
}

.alter-titel { margin:0; font-size:24px; }


.slogan h4 {
	font-variant:normal;
	font-weight:normal;
	color:#dddddd;
	font-size:16px;
}

.hek-video-wrapper h4 {color:#dddddd;}


.paginationbild { width:200px;}

.nobglink a, .nobglink a:hover, .nobglink a:active, .nobglink a:focus { background:none;}

.bilder-galerie { padding:0 10px;}

.galeriebild { margin-right:5px; max-width:800px;}

.profilbild {
	width:var(--hek-colsize);
}

.profilbild1 {
	height: 450px;
	width: 100%;
	object-fit: cover;
	display: block;
}
 /* Video */
 .video-container {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.button_agenda, .button_beschreibung, .button_service, .button_blog {
	color:#cccccc; cursor: pointer;
	font-size: 1.2em;
	border: 2px solid rgba(175, 159, 89, 0.7);
	background: rgba(175, 159, 89, 0.7);
	text-transform: uppercase;
	padding:5px;
	margin: 1em auto;
	width:var(--button-width);
	text-align:center;
	transition: transform 0.2s ease;
}
.button_agenda:hover, .button_beschreibung:hover, .button_service:hover {
	transform: scale(1.05);
}

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

.button_beschreibung {

  color:#cccccc; cursor: pointer;

  font-size: 1.2em;
  border: 2px solid rgba(175, 159, 89, 0.7);
  text-transform: uppercase;
  padding:5px;
  margin-top:1em;
}
	.button_beschreibung.mehranzeigen{color:#eeeeee;}
.div_beschreibung { visibility:hidden; height:0;}
.div_beschreibung.showme {
	visibility:visible;
	height:auto;
	border: 2px solid rgba(175, 159, 89, 0.7);
	padding:2em;
}


/*

 * Moregirls

 */

.paginationbild {zoom: 1; opacity: 0.4;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40);-moz-opacity:0.4; }

.paginationbild:hover, .paginationbild:focus, .paginationbild:active {zoom: 1; opacity: 1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40);-moz-opacity:1; }

.paginationbild.active {zoom: 1; opacity: 1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40);-moz-opacity:1; }


.label-moregirls { position:relative; bottom:30px; left:0; width:100%; text-align:center; }

.label-moregirls.active span { font-weight:bold; }

.label-moregirls .girlname {margin:2px 0;  font-size:12px; color:#fff;}

.moregirls { border-bottom:3px solid #e5ddd3; margin-top:2em;}



/*

 * Modul Formatierung

 */

/* Tiny Navigation */

.tinynav { display: none }

/* Anwesenheiten */
.bold { font-weight:bold; }
.bold.green { color:#166834; }
.fa.fa-check-circle.green { margin-right:10px;}
.fa.fa-check-circle { color:#2CAD4B;}
.tableanwesenheit { border:none; width:100% ; }
.tableanwesenheit td { text-align:center; }
.anwesend-head {  border-top:none;}
.anwesend-head th { color:#666; font-weight:normal; border-bottom:none; text-align:center;}
.tableanwesenheit tbody tr:hover td { background:#f2f2f2;}
.tableanwesenheit tbody tr:hover td.tdset { background:#e2e2e2; }

/* Detail */
.anw-det-table { width:100%; }
tbody .anw-det-tr:hover td { background:#e9e9e9; color: #1f1f1f;   }
.an-det-term { text-align:right;}

#termin.anwesenheits_wrapper { padding:1em; background:none;  }
.anwesenheit-detail { padding-top:0.3em; margin-top:.5em; max-width:calc(var(--hek-colsize)*4); margin-right:10px; font-size: smaller; }
.anwesenheit-titel h4 { font-size: smaller; color: #eeeeee;}
.anwesenheit-titel {
	padding-top:1em; }
	/*end all */

}
.clear_all {clear: both;}
.symbole {text-align: center; float: right; margin:0 1em;}
.symbole_wrapper {float: right; padding-bottom: 2em; }
.terminboxen { font-size:11px; }
/* Tablet */

@media screen and (max-width: 768px) {
	.items-row.rechts, .items-row.links { float:none; width:100%;}
	.terminbox {
		display:none;
	}
}

/* mobile phones, small tablets and very small screens */

@media screen and (max-width: 529px) {
.galeriebild { width:100%;}
.picbox_mod {  }
.modbild { }
.boxmoregirls {
	width:100%;
	left:50%;
	margin-left:-50%;
}
.uk-flex-between {
	justify-content: center!important;
}
}

/* Text in Bild */
.image-container {
	position: relative;
	width: 300px;
	overflow: hidden;
	font-family: sans-serif;
	cursor: pointer;
}
.image-container4, .image-container5, .image-container6, .image-container7, .image-container8 {
	position: relative;
	width: 300px;
	height: 200px;
	overflow: hidden;
	font-family: sans-serif;
	cursor: pointer;
}

.image-container img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	color: white;
	box-sizing: border-box;
	padding: 20px;
	transition: all 0.4s ease;
}

.overlay-detail {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	color: white;
	box-sizing: border-box;
	padding: 20px;
	transition: all 0.4s ease;
	align-items: center;
}

.overlay-detail4, .overlay-detail5, .overlay-detail6, .overlay-detail7, .overlay-detail8, .overlay-detail9 {
	position: absolute;
	bottom: 0;
	left: 10px;
	width: 95%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	color: white;
	box-sizing: border-box;
	padding: 20px;
	transition: all 0.4s ease;
}
@media (max-width: 768px) {
	.text-wrapper {
		max-height: 550px; /* just enough for title initially */
	}
}
@media (min-width:769px) {
	.text-wrapper {
		max-height: 30px; /* just enough for title initially */
	}
	.text-wrapper-detail {
		max-height: 30px; /* just enough for title initially */
	}
}

.text-wrapper {
	max-height: 30px; /* just enough for title initially */
	overflow: hidden;
	transition: max-height 0.4s ease;
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: rgba(0, 0, 0, 0.6);;
	border-radius: 10px;
}
.text-wrapper-detail {
	position: absolute;
	bottom: 50px;
	overflow: hidden;
	transition: max-height,opacity 0.4s ease;
	display: flex;
	visibility: hidden;
	flex-direction: column;
	gap: 10px;
	background: rgba(0, 0, 0, 0.6);;
	border-radius: 10px;
	margin-left:10%;
	margin-right:10%;
}
.text-wrapper-detail4, .text-wrapper-detail5, .text-wrapper-detail6, .text-wrapper-detail7, .text-wrapper-detail8, .text-wrapper-detail9  {
	max-height: 30px; /* just enough for title initially */
	overflow: hidden;
	transition: max-height 0.4s ease;
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: rgba(0, 0, 0, 0.6);;
	border-radius: 10px;
}
@media (max-width: 768px) {
	.image-container .text-wrapper {
		max-height: 550px; /* allow room for text and title */
	}
}
@media (min-width:769px) {
	.image-container:hover .text-wrapper {
		max-height: 550px; /* allow room for text and title */
	}
}
.image-detail-container h3 {
	font-size: 25px;
	text-transform: uppercase;
}

.image-detail-container:hover .text-wrapper-detail {
	max-height: 550px; /* allow room for text and title */
	visibility: visible;
	opacity: 1;
}

.image-detail-container4:hover .text-wrapper-detail4 {
	max-height: 550px; /* allow room for text and title */
}
.image-detail-container5:hover .text-wrapper-detail5 {
	max-height: 550px; /* allow room for text and title */
}
.image-detail-container6:hover .text-wrapper-detail6 {
	max-height: 550px; /* allow room for text and title */
}
.image-detail-container7:hover .text-wrapper-detail7 {
	max-height: 550px; /* allow room for text and title */
}
.image-detail-container8:hover .text-wrapper-detail8 {
	max-height: 550px; /* allow room for text and title */
}
.image-detail-container9:hover .text-wrapper-detail9 {
	max-height: 550px; /* allow room for text and title */
}

.title {
	font-size: 20px;
	z-index: 2;
}

.text {
	opacity: 0;
	transform: translateY(20px);
	transition: all 0.4s ease;
}
.text1 {
	transition: all 0.4s ease;
}

@media (max-width: 768px) {
	.image-container .text {
		opacity: 1;
		transform: translateY(0);
	}

}
@media (min-width:769px) {
	.image-container:hover .text {
		opacity: 1;
		transform: translateY(0);
	}
}

.image-detail-container:hover .text, .image-detail-container4:hover .text, .image-detail-container5:hover .text, .image-detail-container6:hover .text, .image-detail-container7:hover .text, .image-detail-container8:hover .text {
	opacity: 1;
	transform: translateY(0px);
}

.twitter-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.twitter-link {
	text-decoration: none;
	color: inherit;
}

.twitter-link i {
	margin-right: 4px;
}

.gridanwesenheit {
	display: grid;
	grid-template-columns: 200px repeat(7, minmax(55px, 1fr)); /* Prevent collapse */
	/* grid-template-columns: repeat(9, 1fr); */
	gap: 4px;
	margin-bottom: 1em;
	align-items: stretch;
	min-width: 855px; /* 9 columns × 95px */
}

.grid-cell a {
	color: #e0e0e0;
	word-break: break-word;
	overflow-wrap: break-word; /* modern equivalent */
	white-space: normal;
	display: inline-block;
	text-align: center; /* optional: keep it centered */
}

.grid-head {
	padding: 8px;
	border: 1px solid rgba(175, 159, 89, 0.8);
	text-align: center;
	height: 40px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.grid-cell {
	padding: 8px;
	border: 1px solid rgba(175, 159, 89, 0.8);
	text-align: center;
	height: auto; /* 80px; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	word-wrap: break-word;      /* legacy but widely supported */
	overflow-wrap: break-word;  /* modern standard */
	word-break: break-word;     /* Safari/Chrome quirks */
	hyphens: auto;              /* optional, adds hyphenation */
}

.grid-head {
	font-weight: bold;
	background-color: var(--grid-head-bg-a);
}

.grid-cell img.anwbild {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}

.tdsetb {
	background:var(--grid-head-bg-b);
}
.tdseta {
	background:var(--grid-head-bg-a);
}
.tdset1 {
	background:var(--grid-head-bg-b);
}

.grid-scroll {
	overflow-x: auto;
	width: 100%;
}

.grid-head,
.grid-cell {
	font-size: 14px;
}

/* Medium screens (e.g., tablets) */
@media (max-width: 1024px) {
	.grid-head,
	.grid-cell {
		font-size: 12px;
	}
}

/* Small screens (e.g., phones) */
@media (max-width: 600px) {
	.grid-head,
	.grid-cell {
		font-size: 11px;
	}
}
@media (max-width: 412px) {
	.grid-head,
	.grid-cell {
		font-size: 10px;
	}
}

@media (max-width: 768px) {
	.gridanwesenheit {
		display: grid;
		grid-template-columns: 100px repeat(7, minmax(70px, 70px)); /* Prevent collapse */
		/* grid-template-columns: repeat(9, 1fr); */
		gap: 3px;
		margin-bottom: 1em;
		align-items: stretch;
		min-width: 768px;
	}
	.gridanwesenheit h4 {
		font-size: 16px;
	}
}
@media (max-width: 440px) {
	.gridanwesenheit {
		display: grid;
		grid-template-columns: 80px repeat(7, minmax(43px, 43px)); /* Prevent collapse */
		gap: 1px;
		margin-bottom: 1em;
		align-items: stretch;
		min-width: 415px;
	}
	.gridanwesenheit h4 {
		font-size: 16px;
	}
}

@media (max-width: 412px) {
	.gridanwesenheit {
		display: grid;
		grid-template-columns: 80px repeat(7, minmax(40px, 40px)); /* Prevent collapse */
		gap: 1px;
		margin-bottom: 1em;
		align-items: stretch;
		min-width: 400px;
	}
	.gridanwesenheit h4 {
		font-size: 16px;
	}
}

@media (max-width: 393px) {
	.gridanwesenheit {
		display: grid;
		grid-template-columns: 80px repeat(7, minmax(40px, 40px)); /* Prevent collapse */
		gap: 1px;
		margin-bottom: 1em;
		align-items: stretch;
		min-width: 380px;
	}
	.gridanwesenheit h4 {
		font-size: 16px;
	}
}


