/* @import '../style.css'; */
/* @import 'bootstrap.css'; */
/*
	theme style HTP23

	fonts titles: 'Play', 'Sono';
	fonts text: 'Open Sans';

	gruen: #d0ff94;
	lachs: #ff7aa1;
	tuerkis: #61ffcc;
	viola: #e76eff;

*/


/* bootstrappn */

/* grid */

.container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl {
  width: 100%;
  max-width: 980px;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; }

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px; }

.row::after {
  content: "";
  clear: both;
  display: table;
}

.sr-only { display: none; }
.fslightbox-open .sr-only { display: block; }

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}


div:not(#day-content) > [class*="col-"] { /* pretalx table shizzle */
    float: left;
    padding: 0 15px;
    border: none;
}

body { font-size: calc(10px + 0.390625vw); }

#HTP25_hashtag { font-size: 1rem; 
    transform-origin: center;
    transform-box: fill-box; 
    fill: rgb(var(--c-white)); 
    transition: all ease 2s; 
    font-family: system-ui;
    font-weight: 700;
  }
#objdate #HTP25_hashtag { display: none; }
body.active #HTP25_motto { transition: all ease-in-out .1s; translate: 0 -260px; }




#wrapper {
	/*

	[class*="col-"] {
  float: left;
  padding: 15px;
  border: none;
}
	min-height: 98vh;
	margin-bottom: -44px;
	 background-color: rgba(60,60,60,0.1);
	background: linear-gradient(135deg, rgba(0,0,0, 0.1) 25%, transparent 25%),
	linear-gradient(225deg, rgba(0,0,0, 0.1) 25%, transparent 25%),
	linear-gradient(315deg, rgba(0,0,0, 0.1) 25%, transparent 25%),
	linear-gradient(45deg, rgba(0,0,0, 0.1) 25%, transparent 25%);
	background-attachment: fixed;
	background-image: linear-gradient(to right, transparent 50%, rgba(0,0,0, 0.1) 50%),
	linear-gradient(to bottom, transparent 50%, rgba(0,0,0, 0.1) 50%);
	background-size: 20px 20px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: normal;
	align-content: normal;
	 */
}

#header { /*
	-moz-box-shadow: 0 3px 3px rgba(90,43,100,0.7);
	-webkit-box-shadow: 0 3px 3px rgba(90,43,100,0.7);
	box-shadow: 0 3px 3px rgba(90,43,100,0.7);
	position: relative; */
	height: var(--spacer-top);
	box-shadow: none;
	text-align: center;
	transition: all 0.42s;
	position: fixed;
	z-index: 1000;
	top: 0;
	width: 100%;
	background: #ffffff;
}

/*
#header::after {
	content: "";
	position: absolute;
	top: 10px;
	background: radial-gradient(ellipse at bottom, #ffffff 70%, #e76eff 70%);
	transform: rotate(45deg);
	filter: blur(10px);
	opacity: 0.5;
}


#header::after {
	display: block;
	content: '';
	background-image: url(/wp-content/themes/htp23_theme/assets/img/head-after-transp.svg);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	height: 70px;
	margin-top: -21px;
}
*/

#header #site-title { font-size: 2.3rem; }
#header a { text-decoration: none; }
#mobMenu { display: none; }

#htplogoprint, #htp_print_location, #htp_print_pageqr { display: none; }

#content_foot { display: inline-block;  margin: 0; padding: 2rem 1rem; text-align: center; z-index: -1; background-size: 102vw;
  position: fixed; bottom: 0; background-position: center top;}

.page-template-page-iframe #footer { position: inherit; }
.page-template-page-iframe #wrapper { overflow-y: hidden; }
.page-template-page-iframe #content { height: calc(100vh - 110px); }

.htp-subscription-form { margin: 1rem; padding: 1rem 0; }
.htp-subscription-form button.btn.glitch { width: 220px; }


body#htp_ptx,  {
	background-image: linear-gradient(to top, rgba(var(--c-green),0.2), rgba(var(--c-blue),0.15)) !important;
	background-attachment: fixed;
	position: absolute;
	padding-bottom: 70px !important;
	height: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: var(--text-font);
    background-color: #31009a; 
    color: rgb(var(--c-black));
    font-weight: 300;
    font-size: 1rem;
}
#htp_ptx .mx-auto { margin-left: 0 !important; }


#logo {
	background-image: url('img/HTP_logo.svg');
	background-repeat: no-repeat;
	background-size: contain;
	display: inline-block;
}
header.shrink #logo { position: fixed; right: 0; top: -4px; background-position: center center; height: 3vmax; width: 3vmax; }
header #logo { position: absolute; right: 3vw; top: 3vw; background-position: center center; height: 7vmax; width: 7vmax; }

header.shrink .logo { position: fixed; right: 0; top: -4px; background-position: center center; height: 3vmax; width: 3vmax; }
header .logo { position: absolute; right: 3vw; top: 3vw; background-position: center center; height: 7vmax; width: 7vmax; }


#mobile_menu { display: none; }

#sidebar {
	background: rgba(var(--ca-cyan),0.23);
	padding: 2rem 1rem;
	margin: 2rem 0;
}

/**/

.fa.fa-pull-left,.fas.fa-pull-left,.far.fa-pull-left,.fal.fa-pull-left,.fab.fa-pull-left {
    margin-right: .3em
}
.fa.fa-pull-right,.fas.fa-pull-right,.far.fa-pull-right,.fal.fa-pull-right,.fab.fa-pull-right {
    margin-left: .3em
}
.fa-clock:before {
    content: ""
}


#social { position: relative; z-index: 101; /* border-top: 1px inset #00ffff; background: rgba(var(--ca-green),0.23); background: linear-gradient(0deg, rgba(var(--ca-cyan),0.42) 0%, rgba(var(--ca-green),0.42) 100%); */ }
#social .channels { text-align: center; padding: 2em 0; display: flex; justify-content: space-evenly; }
#social .channels svg { height: 42px; width: 42px; fill: rgba(var(--c-white)); stroke: rgb(var(--c-red)); stroke-width: .1;}
#social .channels svg:hover { fill: rgb(var(--ca-pink)); stroke: rgb(var(--c-white)); stroke-width: .1;}
#social .channels li { display: flex; text-align: center; }
#social .channels a { color: rgba(var(--ca-pink),0.5); text-decoration: none; display: block; }
#social .channels a:hover, .channels a:focus { color: rgb(var(--ca-pink)); }
/* #social .channels a:hover svg {  filter: drop-shadow(3px 5px 6px rgba(var(--ca-cyan),0.5)); } */

.mstdn{
  display:inline-block;
  background-color:#282c37;
  color:#d9e1e8;
  text-decoration:none;
  padding:4px 10px 4px 30px;
  border-radius:4px;
  font-size:16px;
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2261.076954mm%22%20height%3D%2265.47831mm%22%20viewBox%3D%220%200%20216.4144%20232.00976%22%3E%3Cpath%20d%3D%22M211.80734%20139.0875c-3.18125%2016.36625-28.4925%2034.2775-57.5625%2037.74875-15.15875%201.80875-30.08375%203.47125-45.99875%202.74125-26.0275-1.1925-46.565-6.2125-46.565-6.2125%200%202.53375.15625%204.94625.46875%207.2025%203.38375%2025.68625%2025.47%2027.225%2046.39125%2027.9425%2021.11625.7225%2039.91875-5.20625%2039.91875-5.20625l.8675%2019.09s-14.77%207.93125-41.08125%209.39c-14.50875.7975-32.52375-.365-53.50625-5.91875C9.23234%20213.82%201.40609%20165.31125.20859%20116.09125c-.365-14.61375-.14-28.39375-.14-39.91875%200-50.33%2032.97625-65.0825%2032.97625-65.0825C49.67234%203.45375%2078.20359.2425%20107.86484%200h.72875c29.66125.2425%2058.21125%203.45375%2074.8375%2011.09%200%200%2032.975%2014.7525%2032.975%2065.0825%200%200%20.41375%2037.13375-4.59875%2062.915%22%20fill%3D%22%233088d4%22%2F%3E%3Cpath%20d%3D%22M177.50984%2080.077v60.94125h-24.14375v-59.15c0-12.46875-5.24625-18.7975-15.74-18.7975-11.6025%200-17.4175%207.5075-17.4175%2022.3525v32.37625H96.20734V85.42325c0-14.845-5.81625-22.3525-17.41875-22.3525-10.49375%200-15.74%206.32875-15.74%2018.7975v59.15H38.90484V80.077c0-12.455%203.17125-22.3525%209.54125-29.675%206.56875-7.3225%2015.17125-11.07625%2025.85-11.07625%2012.355%200%2021.71125%204.74875%2027.8975%2014.2475l6.01375%2010.08125%206.015-10.08125c6.185-9.49875%2015.54125-14.2475%2027.8975-14.2475%2010.6775%200%2019.28%203.75375%2025.85%2011.07625%206.36875%207.3225%209.54%2017.22%209.54%2029.675%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E');
  background-size:16px;
  background-repeat:no-repeat;
  background-position:top 50% left 8px;
  transition:all 0.5s;
}
.mstdn:hover{
  background-color:#484c56;
}
/*.mstdn::before{
  content:"@";
}*/
.mstdn > span{
  color:#9baec8;
  font-size:12px;
  padding-left:3px;
}
.mstdn > span:before{
  content:"@";
}
/*
.mastodon-follow {
	background-color: #3c99dc;
	color: white;
	border-radius: 5px;
	border: #888 solid 1px;
	font-size: 13pt;
	height: 32px;
	font-family: Arial, Helvetica, sans-serif;
}
*/
.mastodon-follow:hover {
	cursor: pointer;
	background-color: #2c89cc;
}

.mastodon-follow:active {
	background-color: #1c79bc;
}

.mastodon-follow-logo {
	color: white;
	width: 16px;
	margin-top: 2px;
}

#htp_lang_switch { position: fixed; right: 5rem; top: 13rem; z-index: 101; width: 80px; }
span.lang-flag { position: relative; top: -.3rem; }
.language-switcher { height: 10rem; width: 3rem; }

#opencall h2 { text-transform: uppercase; font-size: 3rem; padding: 0; margin: 0; line-height: 0.8; margin-left: 7px; }
.ctabox { text-align: center; position: relative; margin: 42px auto; display: inline-block; }

.box-opencall { text-align: center; margin: 2em auto; position: relative; }
/* .box-opencall::before, .box-opencall::after { content: url(img/trenner2.svg); height: 38px; width: 100%; display: block; } */

.box-event { position: relative; margin-bottom: var(--spacer);}
.cdchip { text-align: center; }
.cdchip #logo { position: absolute; right: -5vmax; margin: 0; background-position: top left; height: 12vmax; width: 12vmax; max-width: 200px; z-index: 502; }
.cdchip img { height: auto; }

.date {
	/* background-image: url('img/platinendingens_trenner.svg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;	 */
	top: 20vmax; /* box-event */
    position: relative;
    text-align: center;
    height: 23vh;
}
.date h2 {
    margin: auto;
    margin-top: -6px;
	font-size: 125px;
	font-weight: 600;
	line-height: 0.8;
	padding-left: 23px; }
/* .date h2.day {
	padding-bottom: 5vmax;
	background-image: url('img/platinendingens_trenner.svg');
	background-position: bottom center;
	background-repeat: no-repeat;
	background-size: contain;
.ct-preview p a:hover, .newsletter .content p a:hover, article p a:hover, #htp_ptx article p a:hover, article.category-kunst a.btn.glitch:hover { 
	color: rgb(var(--ca-pink)) !important; border-color: rgb(var(--c-white)) !important; }

} */

article { z-index: 99; position: relative; }

h1.preview { font-size: 3.2vmax; padding: 0; margin: 0; line-height: 1.23; margin-top: 8rem; }
h1.htp_festival, .newsletter h1.preview { 
	font-size: 2rem; line-height: 1.8; margin-top: 16vh; text-shadow: -2px -4px 3px #ffffff, -2px -1px 0 #ff000099, 3px 3px 10px #00ffff; position: relative; z-index: 500; }
#htp_ptx a { text-decoration: none; }
.newsletter .content p a, article a, #htp_ptx #htpx_canvas a, #htp_ptx #content a, .type-htpp .entry-meta a, article.category-kunst a.btn.glitch { 
	color: rgb(var(--c-white)); border-bottom: 1px dotted rgb(var(--ca-pink)); transition-timing-function: ease-in-out; transition: all 1s; 
	text-shadow: rgb(var(--c-lblue)) 0px 0px -1px; }

.newsletter .content p a:hover::before, article a:hover::before, #htp_ptx article a:hover::before { 
	color: rgb(var(--c--lblue)); 

	margin-left: -10px; margin-right: 0px;  }


#content h2 { background: #ffffff; padding: 0 1rem; margin-bottom: 1rem; }
#content a { color: rgb(var(--c-white)); text-decoration: none; }
#content a:hover { color: rgb(var(--c-white)); text-shadow: rgb(var(--ca-pink)) 1px 1px 30px; border-bottom: 2px solid rgb(var(--c-white)); }

.htp_schedule_table a,
.htpx_listing a,
.entry-meta-list a,
.htpx_speakers_box a { color: rgb(var(--c-dblue)) !important;  }

.htp_schedule_table a:hover,
.htpx_listing a:hover,
.entry-meta-list a:hover,
.htpx_speakers_box a:hover { color: rgb(var(--c-lblue)); border-bottom: 1px solid transparent !important; }
.htpx_speakers_text { font-family: var(--text-font); }

.page-template-page-newsletter .no-content { display: none !important; }
.page-template-page-newsletter article .header { margin-bottom:-15vh; }
.page-template-page-newsletter #article .header { margin-bottom: 0; }
.newsletter p.poweredby { text-align: right !important; margin-top: 3vh;}
.newsletter p.poweredby a, .newsletter .content p.poweredby a::before { content: none; margin: 0; border: none; text-decoration: none; }
.newsletter label, .newsletter .error span { font-size: 11pt; }
.newsletter .error span { display: none; }
.newsletter h1.preview { color: var(--c-red); margin-top: 0; }
.newsletter .required { width: 12em; }
.newsletter .attributename big { font-size: 100%; }
.newsletter .content { line-height: 1.43; padding-top: 0; }
.newsletter #footer { position: fixed; }
.newsletter #footer .col-6 { float: left; }
.newsletter #htplogosvg #htplbg { display: none; }
.newsletter #htplogosvg { position: absolute; top: 37px; right: 60px; z-index: 10000; max-width:25vmin; height: auto; }
.newsletter #wrapper { scroll-behavior: none; overflow-y:auto; top: 0; border: none; padding-top: 8vh; height: 100%; }
.newsletter #footer .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
.newsletter .container { max-width:1140px; margin: auto; width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}


.col-fix-schedule { width:80px; }




/* schedule layout */
.htpx-grslots { display:grid; gap:1rem; }
.htpx-grslot { display:flex; gap:1rem; align-items:flex-start; padding:1rem; border:1px solid #ddd; border-radius:8px; background:#fff; }
.htpx-grslot__qr { flex:0 0 auto; width:110px; }
.htpx-grslot__qr-img { width:100%; height:auto; display:block; border-radius:4px; }
.htpx-grslot__qr-placeholder { width:110px; height:110px; display:grid; place-items:center; background:#f3f3f3; color:#888; border-radius:4px; font-weight:600; }
.htpx-grslot__meta { flex:1 1 auto; min-width:0; }
.htpx-grslot__title { margin:0 0 .25rem; font-size:1.05rem; line-height:1.3; color: #000000;}
.htpx-grslot__slug { font-weight:700; opacity:.7; }
.htpx-grslot__time { color:#555; font-size:.95rem; }
@media (max-width:640px){
  .htpx-grslot { flex-direction:column; }
  .htpx-grslot__qr { width:140px; }
}


/*
.ct-preview p::before { content: ">"; color: rgb(var(--c-blue)); margin-left: -15px; margin-right: 5px; }
.ct-preview p:hover::before {  content: ">"; color: rgb(var(--c-red);) margin-left: -15px; margin-right: 5px;  }
h1.entry-title::before, #htp_ptx h1::before { content: ">"; color: rgb(var(--ca-cyan)); margin-left: -15px; margin-right: 5px; font-weight: 700; }
*/
.ct-preview p:first-child::before { content: none; margin: none; }
.ct-preview p:hover { font-weight: 300; }
.ct-preview p:hover strong, .ct-preview p:hover b { color: rgb(var(--c-black)); text-shadow: 0 0 15px rgb(var(--ca-cyan)); }
.ct-preview p:first-child { margin: 3em 0; }
a.no-border { border: none; }

.title-container { will-change: transform; backface-visibility: hidden; }
h1.entry-title, #htp_ptx h1 { 
	color: #ffffff; font-size: 2.3em; font-weight: bold; text-align: left; text-shadow: 2px 2px 2px rgb(var(--c-blue)), -5px -5px 5px rgb(var(--ca-pink));
	/*background: linear-gradient(90deg, rgb(var(--c-dblue)), transparent); 
	background: url(2025/objects2025-flyer.svg) no-repeat;
    background-size: 221%;
    background-position: -239px -121px; 
	border-image: linear-gradient(var(--angle), rgb(var(--c-red)), rgb(var(--c-dblue))) 1;
    border-width: 1px;
    border-style: solid;
    */

    
    line-height: 1.8;
    padding: .3rem .5rem;
    animation-name: angleRotate;
    animation-duration: 42s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;



	margin: -18rem 0 0rem -2rem; transform: skewy(-13deg); padding: 0 2rem 1rem; display: flex
; align-items: flex-end; height: 30rem; }
	/* text-shadow: rgb(var(--c-blue)) -1px 1px 0px, rgb(var(--ca-cyan)) 1px -1px 0px; margin: 0 1rem; } */
h1.entry-title a, #htp_ptx h1 a { border-bottom: 0 !important; }

.error404 #wrapper { overflow: hidden; }
.error404 .entry-content { background: none; }
.error404 .header h1.entry-title::before { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABIAQMAAABvIyEEAAAABlBMVEUAAABTU1OoaSf/AAAAAXRSTlMAQObYZgAAAENJREFUeF7tzbEJACEQRNGBLeAasBCza2lLEGx0CxFGG9hBMDDxRy/72O9FMnIFapGylsu1fgoBdkXfUHLrQgdfrlJN1BdYBjQQm3UAAAAASUVORK5CYII=) no-repeat 0px -30px;
    display: inline-block; content: ""; width: 33px; height: 42px; margin-right: 1rem; }
#site-description { background: rgb(var(--c-black)); color: rgb(var(--c-white)); text-align: left; }
#site-description span { line-height: 1.4rem; font-size: 1rem; font-weight: 700; }


p a.cta_link { line-height: 36px; font-weight: 300; }
p a.cta_link:hover, .newsletter .content p a:hover { border-color: rgb(var(--c-red)) color: rgb(var(--ca-cyan)); text-shadow: rgb(var(--c-black)) 1px 1px 1px}
p a.cta_link::before, .newsletter .content p a::before { content: ">"; margin-left: -15px; margin-right: 5px; font-weight: 700; color: rgb(var(--c-red)) }

#footer span { line-height: 60px; font-size: 12pt; }
.sponsoren { text-align: right; }
.sponsoren li { display: inline-block; }
.sponsoren img { margin-top: 8px; margin-bottom: -8px; vertical-align: inherit; }


/* Corner Effect */
.tla, .tra, .bla, .bra{
    width: 167px;
    height: 38px;
    position: absolute;
    background: url(img/trenner2.svg);
    background-size: contain;
    background-position: center center;
    transition-timing-function: ease-in-out;
    transition: background 1s;
    mask: url(img/trenner2.svg);
	mask-repeat: no-repeat;
	mask-position: center;
}
.tla {
	transform: rotate(180deg);
	left: 0;
    top: -1em;
}
.tra {
	transform: rotate(0deg);
	right: 0;
    top: -1em;
}
.bla {
	transform: rotate(180deg);
	left: 0;
	bottom: -1em;
}
.bra {
	transform: rotate(0deg);
	right: 0;
	bottom: -1em;
}

.tl, .tr, .bl, .br{
    width: 25px;
    height: 25px;
    position: absolute;
    background: url(img/pfeil2_grün.svg);
    background-size: contain;
    background-position: center center;
    transition-timing-function: ease-in-out;
    transition: background 1s;
    mask: url(img/pfeil2.svg);
	mask-repeat: no-repeat;
	mask-position: center;
}
.ctabox:hover .tl, .ctabox:hover .tr, .ctabox:hover .bl, .ctabox:hover .br{ background: url(img/pfeil2.svg); }

.tl{
    top: -25px;
    left: -25px;
	transform: rotate(270deg);
}
.tr{
    top: -25px;
    right: -25px;
	transform: rotate(0deg);
}
.bl{
    bottom: -25px;
    left: -25px;
 	transform: rotate(180deg);
}
.br{
    bottom: -25px;
    right: -25px;
	transform: rotate(90deg);
}

.error404 .header h1 { position: relative; z-index: 3; }
.anim404 { position: relative; width: 50vw; max-width: 500px; margin-left: 0; left: 50%; margin-top: -3vh; }
.anim404 svg { position: absolute; max-height: 50vh; z-index: 2;}
.anim404 #astronaut-v3-circle2 { fill: #ffffff; }
.anim404 #astronaut-v3-copy-of-circle { fill: #00ffff; }

.xoxo { display: table; }
.xoxo li { display: table-cell; margin: 0 auto; }

/* shapes */
.shape_htp {
	mask-image: url(img/HTP_logo.svg);
  	mask-size: cover;
  	mask-repeat: no-repeat;
	mask-position: center;
  	-webkit-mask-image: url(img/HTP_logo.svg);
  	-webkit-mask-size: cover;
  	-webkit-mask-repeat: no-repeat;
  	-webkit-mask-position: center;
}

.objmask { transition: all 0.23s; -webkit-mask-size: cover; -webkit-mask-repeat: no-repeat; -webkit-mask-position: inherit; mask-size: cover; mask-repeat: no-repeat; mask-position: revert-layer; }
.objmask:hover { -webkit-mask-image: none; mask-image: none; }
.obj_el0 { -webkit-mask-image: url(img/HTP_logo.svg); mask-image: url(img/HTP_logo.svg); }

.objmask.obj1_el0 { -webkit-mask-image: url(img/obj1/plat.obj1.svg); mask-image: url(img/obj1/plat.obj1.svg); }
.objmask.obj1_el1 { -webkit-mask-image: url(img/obj1/plat.obj2.svg); mask-image: url(img/obj1/plat.obj2.svg); }
.objmask.obj1_el2 { -webkit-mask-image: url(img/obj1/plat.obj3.svg); mask-image: url(img/obj1/plat.obj3.svg); }
.objmask.obj1_el3 { -webkit-mask-image: url(img/obj1/plat.obj4.svg); mask-image: url(img/obj1/plat.obj4.svg); }
.objmask.obj1_el4 { -webkit-mask-image: url(img/obj1/plat.obj5.svg); mask-image: url(img/obj1/plat.obj5.svg); }
.objmask.obj1_el5 { -webkit-mask-image: url(img/obj1/plat.obj6.svg); mask-image: url(img/obj1/plat.obj6.svg); }
.objmask.obj1_el6 { -webkit-mask-image: url(img/obj1/plat.obj7.svg); mask-image: url(img/obj1/plat.obj7.svg); }
.objmask.obj1_el7 { -webkit-mask-image: url(img/obj1/plat.obj8.svg); mask-image: url(img/obj1/plat.obj8.svg); }
.objmask.obj1_el8 { -webkit-mask-image: url(img/obj1/plat.obj9.svg); mask-image: url(img/obj1/plat.obj9.svg); }

.objmask.obj2_el0 { -webkit-mask-image: url(img/obj2/blue.obj1.svg); mask-image: url(img/obj2/blue.obj1.svg); }
.objmask.obj2_el1 { -webkit-mask-image: url(img/obj2/blue.obj2.svg); mask-image: url(img/obj2/blue.obj2.svg); }
.objmask.obj2_el2 { -webkit-mask-image: url(img/obj2/blue.obj3.svg); mask-image: url(img/obj2/blue.obj3.svg); }
.objmask.obj2_el3 { -webkit-mask-image: url(img/obj2/blue.obj4.svg); mask-image: url(img/obj2/blue.obj4.svg); }
.objmask.obj2_el4 { -webkit-mask-image: url(img/obj2/blue.obj5.svg); mask-image: url(img/obj2/blue.obj5.svg); }
.objmask.obj2_el5 { -webkit-mask-image: url(img/obj2/blue.obj6.svg); mask-image: url(img/obj2/blue.obj6.svg); }
.objmask.obj2_el6 { -webkit-mask-image: url(img/obj2/blue.obj7.svg); mask-image: url(img/obj2/blue.obj7.svg); }
.objmask.obj2_el7 { -webkit-mask-image: url(img/obj2/blue.obj8.svg); mask-image: url(img/obj2/blue.obj8.svg); }
.objmask.obj2_el8 { -webkit-mask-image: url(img/obj2/blue.obj9.svg); mask-image: url(img/obj2/blue.obj9.svg); }
.objmask.obj2_el9 { -webkit-mask-image: url(img/obj2/blue.obj10.svg); mask-image: url(img/obj2/blue.obj10.svg); }

.objback { transition: all 0.23s; background-size: cover; }
.objback.obj2_el0 { background-image: url(img/obj2/blue.obj1.svg); }
.objback.obj2_el1 { background-image: url(img/obj2/blue.obj2.svg); }
.objback.obj2_el2 { background-image: url(img/obj2/blue.obj3.svg); }
.objback.obj2_el3 { background-image: url(img/obj2/blue.obj4.svg); }
.objback.obj2_el4 { background-image: url(img/obj2/blue.obj5.svg); }
.objback.obj2_el5 { background-image: url(img/obj2/blue.obj6.svg); }
.objback.obj2_el6 { background-image: url(img/obj2/blue.obj7.svg); }
.objback.obj2_el7 { background-image: url(img/obj2/blue.obj8.svg); }
.objback.obj2_el8 { background-image: url(img/obj2/blue.obj9.svg); }
.objback.obj2_el9 { background-image: url(img/obj2/blue.obj10.svg); }

i.icon { width: 56px; height: 56px; display: inline-block; 
    mask-image: url(img/htpx/2024/HTP_logo.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center 87%;
    -webkit-mask-image: url(img/htpx/2024/HTP_logo.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center 87%;
    z-index: -1;
    position: absolute;
    left: -.5rem;
    top: -3px;
}

i.icon.art {background-image: url(img/icons/eye-solid.svg); width: 17px; height: 15px; display: inline-block;}


.maskkkkk {
	width: calc(100vw - 15px);
	height: 100vh;

	background-image: url(https://images.unsplash.com/photo-1528287942171-fbe365d1d9ac?ixlib=rb-1.2.1&q=85&fm=jpg&crop=entropy&w=1200&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;

	mask-image: url(img/HTP_logo.svg);
	mask-size: 100vmin;
	mask-repeat: no-repeat;
	mask-position: center;
}

.radio-inline { display: inline-block; margin-right: 3px; }

.htp-video-container {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.htp-video-container::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}

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

/* WP Artikel Formate */
.blog .masonry {
	display: grid;
	grid-template-rows: repeat(auto-fill, minmax(10%,1fr));
	grid-template-columns: repeat(auto-fill, minmax(30%,1fr));
	grid-auto-rows: 84px;
	grid-gap: 10px;
}
.blog article, .single article {
	/* background: rgba(var(--c-footer),0.1); */
	transition: all 0.23s;
}

.blog .wall {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(25vw, 1fr));
	grid-gap: 5px;
	grid-auto-rows: minmax(180px, auto);
	grid-auto-flex:	dense;
	padding: 5px;
}
.blog .wall article.span-2 { grid-column-end: span 2; grid-row-end: span 2; }
.blog .wall article.span-3 { grid-column-end: span 3; grid-row-end: span 3; }
.blog .wall article.span-4 { grid-column-end: span 4; grid-row-end: span 4; }

.blog article {
	border: 1px solid rgba(var(--c-footer),0.23);

}

span.entry-meta { background: rgb(var(--c-white)); border: 1px solid rgb(var(--c-footer)); border-bottom: none; padding: 3px 15px; margin-bottom:-5px; display: inline-block; }
article .post-edit-link { float: right; }
.page article .post-edit-link { position: relative; bottom: -12px; background: rgb(var(--c-white)); padding: 5px 14px 0; margin: -10px 0 0; color: rgb(var(--c-black)); font-weight: 700; }


/*
article.format-standard { border-color: #ff9900; }
article.format-quote { border-color: #f90440; }
article.format-video { border-color: #ff0540; }
article.format-audio { border-color: #96f000; }
article.format-status { border-color: #30fe56; }
article.format-gallery { border-color: #9fecd0; }
article.format-image { border-color: #cd00f9; }
article.format-aside { border-color: #9900ff; }
article.format-link { border-color: #99ff00; }

.format-standard .icon.htp_ptype { background-image: url(img/icons/postcard.svg); }
.format-quote .icon.htp_ptype { background-image: url(img/icons/quote.svg); }
.format-video .icon.htp_ptype { background-image: url(img/icons/play-btn.svg); }
.format-audio .icon.htp_ptype { background-image: url(img/icons/music-note-list.svg); }
.format-status .icon.htp_ptype { background-image: url(img/icons/chat-left-quote.svg); }
.format-gallery .icon.htp_ptype { background-image: url(img/icons/images.svg); }
.format-image .icon.htp_ptype { background-image: url(img/icons/card-image.svg); }
.format-aside .icon.htp_ptype { background-image: url(img/icons/triangle-fill.svg); }
.format-link .icon.htp_ptype { background-image: url(img/icons/link.svg); }


.blog article.format-video, .page-template-page-redirect article.format-video { padding: 0; min-width: 30vmax; }
.single article.format-video .header { height: auto; background: none #ffffff; }
.single article.format-video { background: none #ffffff; }
*/

.page-template-page-masonry #content .header { height: 10vh; }
.masonry {
	grid-template-rows: repeat(auto-fill, minmax(10%,4fr));
  	grid-template-columns: repeat(auto-fill, minmax(30%,4fr));
  	grid-gap: 1vmax;
  	flex-direction: row;
  	grid-auto-rows: 5vh;
  	display: grid;
  	min-height: 100vh;
  	max-width: 1600px;
  	margin: 0 auto;
  	padding: 0 15px 15px;
  }
.masonry .item {
	grid-row: auto;
	background-color: #f9f9f933;
}

.masonry .item:nth-child(7) { grid-row: span 2; }
.masonry .item:nth-child(12) { grid-column: span 2; }
.masonry article .entry-meta { width: 100%; background: rgba(255,255,255,0.42); }
.masonry .htp_cover { position: relative; }
.masonry .htp_cover .entry-meta { position: absolute; bottom: 0; }

.cat_article { border: 1px solid #ff9990; flex: auto; margin: 0.5rem; }

.header.htp_cover { background-size: contain; background-position: center center; height: 100%; }


/* Container for the gallery */
.gallery {
    column-count: 3; /* Number of columns, adjust as needed */
    column-gap: 1em; /* Gap between columns */
    max-width: 1200px; /* Adjust as needed */
    margin: 0 auto; /* Center the gallery */
}

/* Individual gallery items */
.gallery-item {
    display: inline-block;
    width: 100%;
    margin-bottom: 1em;
    break-inside: avoid;
}

.gallery-icon a {
    display: block;
    width: 100%;
}

.gallery-icon img {
    width: 100%;
    height: auto;
    display: block;
}




/* =Menu
----------------------------------------------- */

.main-navigation {
	clear: both;
	display: inline-block;
	width: 100%;
	/* border-width: 0 0 2px;
  	border-style: solid;
  	border-image: linear-gradient(to right, transparent, #61ffcc, #d0ff94, #61ffcc, transparent) 1; */
  	margin: 0 auto;

}
.main-navigation ul {
	list-style: none;
	margin: 0 auto;
	text-align: left;
}


.main-navigation li {
    display: block;
}
.main-navigation li:hover {

}
#header .main-navigation a {
	display: block;
	text-decoration: none;
	color: rgb(var(--c-black));
	padding: .8rem 1rem;
	text-shadow: #fff 0px 0px 13px;
	transition: all 0.7s ease-in-out;
	font-weight: 300;
	font-size: calc(0.8rem + 0.390625vw);
	height: 45px;
	white-space: nowrap;
	/*
	mask-image: url(img/HTP_logo.svg);
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: center 90%;
    -webkit-mask-image: url(img/HTP_logo.svg);
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center 90%; */
}

#header .main-navigation a:hover, #header .main-navigation a:focus, #header .main-navigation li.current_page_item > a, #header .main-navigation li.current_page_parent.current_page_ancestor > a  {
	color: rgb(var(--c-white));
	text-shadow: rgb(var(--ca-cyan)) 0px 0px 1px;
	font-weight: 700;
	background: rgb(var(--c-dblue));
}
#header .main-navigation a.glitch:hover:after, #header .main-navigation a.glitch:focus:after, #header .main-navigation li.current_page_item a.glitch:after { content: "attr(aria-label, '$% HackThePromise Festival &%')"; }

#optOutUsage {
	background: radial-gradient(circle, rgba(var(--c-dblue), 0.84) 0%, rgb(var(--c-lblue)) 100%);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    border-width: 0.23rem;
    border-image: linear-gradient(var(--angle), rgb(var(--ca-pink)), rgb(var(--c-dblue))) 1;
    box-shadow: inset 1px 1px 10px #00000033;
}
#optOutUsage h2 { display: inline-block; }
#optOutUsage a { color: rgb(var(--ca-pink));}
#optOutUsage li { margin: 0 0 .5rem; color: rgb(var(--c-white));}
#optOutUsage .btnline { display: inline-block; }
#optOutUsage .btn {     
    font-size: 1rem !important;
    white-space: nowrap;
    padding-top: 0;
    padding-bottom: 14px !important;
    margin-right: 2rem;
  }
#optOutUsage .btn.glitch  { box-shadow: inset 1px 1px 10px #ffffff; }
#optOutUsage .btn.glitch.negative { background-color: #ffffff; color: #000000 !important; text-shadow: 1px 1px 0 rgb(var(--ca-cyan)); z-index: 1; box-shadow: inset 1px 1px 7px #00000033;}
#optOutUsage .btn.glitch.negative::before {
    content: '';
    position: absolute;
    top: -4px;  /* Adjust as necessary for the border thickness */
    left: -4px;
    right: -4px;
    bottom: -4px;
    z-index: -1;  /* Keeps the pseudo-element behind the button */
    background: transparent;
    border: 4px solid rgb(var(--c-border)); /* Color of your border */
    mask-image: url(img/htpx/2024/HTP_logo.svg); /* Same mask as button */
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: center 87%;
    -webkit-mask-image: url(img/htpx/2024/HTP_logo.svg); /* Same mask for webkit browsers */
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center 87%;
}
#do_lang {

  align-items: center;
  gap: 8px;
}

#do_lang .lang-flag {
  display: flex;
  align-items: center;
}

#do_lang .lang-text {
  font-size: 0.9em;
}

#install-button { display: inline-block; }
#update-notification {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #f1c40f;
    color: #2c3e50;
    text-align: center;
    padding: 15px;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    z-index: 1000;
}

.update-content {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.btn {
    background-color: #e74c3c;
    color: white;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 16px;
}

.btn:hover {
    background-color: #c0392b;
}



/* Main menu container fixed at the top */
.main-menu-container {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;

}

/* Main menu */
.main-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.main-menu > li {
    position: relative;
    padding: 0 20px;
}
.main-menu > li:first-child { padding-left: 0; }

.main-menu > li > a {
    text-decoration: none;
    color: #333;
}

/* Active parent item */
.main-menu li.active > a {
    color: #0073aa;
}

/* Show dropdown when parent is active */
#menu-main-menu li.current-menu-parent > .sub-menu {
    display: block;
}

/* Dropdown menu 
.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
		background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0));
		box-shadow: 10px 0 10px -8px rgba(0, 0, 0, 0.1), -10px 0 10px -8px rgba(0, 0, 0, 0.1);
		-moz-box-shadow: 10px 0 10px -8px rgba(0,0,0,0.1), -10px 0 10px -8px rgba(0, 0, 0, 0.1);
		-webkit-box-shadow: 10px 0 10px -8px rgba(0,0,0,0.1), -10px 0 10px -8px rgba(0, 0, 0, 0.1);
    list-style: none;
    margin: 0;
    padding: 0;
}


#menu-main-menu .sub-menu {
		position: absolute;
    left: -12vw;
    width:100%;
    padding-top: 0;
    height: 100px;
    max-width: 1110px; 
    margin-left: -555px;
    top: calc( var(--spacer-top) + 0.5vmax); 
    z-index: 420;
    transition: all 2s;
}
*/



/*#menu-main-menu li.current-menu-parent .sub-menu a { background: none }
#menu-main-menu li.current-menu-parent .sub-menu a:hover { background: rgb(var(--c-white)); }
*/



/* Show dropdown on hover */
.main-menu li:hover > .sub-menu,
.main-menu li.active > .sub-menu {
    opacity: 1;
    visibility: visible;
    transition-delay: 1.2s; 
}

/* Active parent item */
.main-menu li.active > a {
    color: #0073aa;
}

/* Responsive behavior for tablets */
@media (hover: none) {
    .main-menu li.has-children > a::after {
        content: " ▼";
        font-size: 0.75em;
    }
    
    .main-menu li.has-children.active > .sub-menu {
        display: block;
    }
}

.menu-item {
    position: relative;
}

#menu-main-menu .sub-menu {
    display: none; /* Hide the sub-menu by default */
    position: absolute;
    top: 100%; /* Position the sub-menu directly below the parent */
    left: 0;
    z-index: 1000;
    background-color: #fff; /* Background color of sub-menu */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Add a shadow for depth */
    opacity: 0; /* Start with the sub-menu hidden */
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; /* Smooth fade-in/out */
}

/* Show the sub-menu on hover with a fade-in effect */
.menu-item:hover > .sub-menu {
    display: block; /* Ensure sub-menu is displayed */
    opacity: 1; /* Fade in the sub-menu */
    visibility: visible;
}

/* Style for the menu items in the sub-menu */
.sub-menu li {
    position: relative;
}

.sub-menu li a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    color: #333; /* Sub-menu link color */
}

.sub-menu li a:hover {
    background-color: #f0f0f0; /* Background color on hover */
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.main-navigation ul ul {
	/*-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	box-shadow: 0 3px 3px rgba(0,0,0,0.2);
	*/
	display: none;
	float: left;
	position: absolute;
		top: 1.5em;
		left: 0;
	z-index: 99999;
}
.main-navigation ul ul ul {
	left: 100%;
	top: 0;
}
.main-navigation ul ul a {
	min-width: 200px;
}
.main-navigation ul ul li {
}
.main-navigation li:hover > a {
}
.main-navigation ul ul :hover > a {
}
.main-navigation ul ul a:hover {
}
.main-navigation ul li:hover > ul {
	display: block;
}
.main-navigation li.current_page_item a,
.main-navigation li.current-menu-item a {
}

/* Small menu */
.menu-toggle {
	cursor: pointer;
}
.main-small-navigation .menu {
	display: none;
}


body.active #objdate #HTP25_do2, .no-anim #objdate #HTP25_do2 { opacity: 1 };



/* make the header stick once JS toggles the class */
article .header.is-stuck {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
}

/* smoother transform changes */
article .header h1 {
  will-change: transform, height, margin;
  transition: transform 0.12s linear, height 0.12s linear, margin 0.12s linear;
}




/* =Content
----------------------------------------------- */
article h3, article h4 { 
  padding-left: 1rem;
  border: 0;                              /* no other sides */
  border-bottom: 1px solid transparent;   /* enable bottom border */
  border-image: linear-gradient(90deg, 
  	rgb(var(--ca-pink)) 0%, 
  	rgb(var(--ca-pink)) 20%, 
  	rgb(var(--c-white)) 30%, 
  	rgb(var(--c-dblue)) 60%,
  	rgb(var(--c-dblue)) 100%
  ) 1; 
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}


h5 { font-style: italic;  }
fieldset { padding: 0 1rem; margin: 0 0 1rem; }

.sticky {
}
.hentry {

}
.entry-meta {
	clear: both;
	margin: 0 0 0.5rem 0;
	padding: 0.5rem 0;
	background: #ffffff42;
	border-top: 0px solid rgb(var(--ca-pink));
	border-bottom: 1px dashed rgb(var(--c-white));
}

.htp_title { font-weight: 600; }

.type-htpp .entry-content p, .entry-summary p, 
.page-template-page-ptx-program .entry-content p,
.page-template-page-ptx-talks .entry-content p,
.page-template-page-ptx-kunst .entry-content p,
.page-template-page-ptx-location .entry-content p,
.page-template-page-ptx-speakers .entry-content p,
.page .entry-content p { padding: 0 1rem; }



ul.htpx_listing { margin: 0; }
#day-list { width: 100%; position: sticky; top: 2rem; }

.single-htpp.polls #article { margin-top: 70vh; }
.poll-container { padding: 1rem 0; margin: 1rem; font-size: 1rem;  }
.poll-container p { padding: 0 !important; }
.poll-container button.btn { font-size: 1rem !important; min-height: 38px !important; line-height: 38px !important; }

.poll-container li { margin: 1rem 0 !important; border-bottom: 1px solid rgb(var(--c-red)); padding: 1rem 0 2rem; }
.poll-container li:last-child { border: 0; padding-bottom: 1rem; }
.poll-container ul { border-top: 1px solid #00ffff; border-bottom: 1px solid #00ffff; }

.single-htpp.onsites #wrapper { overflow: hidden; top: 0; height: 100%; }
.single-htpp.onsites #header { height: 0; }
.single-htpp.onsites #ObjHTP25 { 
    width: 200vw !important;
    height: 200vh !important;
    left: 22vw;
    top: -112vh;
    /* position: relative; */
    translate: -46% 25%;

/*	width: 200vw !important; height: 100vw !important; left: 22vw; top: -107vh; position: relative; */ }
.single-htpp.onsites #header .col-12, .single-htpp.onsites #mobile_menu { display: none; }

.page-template-page-art .entry-meta { margin-bottom:0; }
.page-template-page-art .entry-meta p { margin:0; }
.byline {
	display: none;
}
.single .byline,
.group-blog .byline {
	display: inline;
}

#content { padding-bottom: 0; min-height: 80vh;
	background-attachment: scroll;
	background-size: cover;
	background-position: center center;
	position: relative;
	z-index:50;

}
#content::before {
  content: "";
  position: fixed;
  width: 250%;
  height: 200%;
  top: -50%;
  left: -65%;
    background-image: url('2025/objects2025-flyer.svg');
    background-repeat: no-repeat;
    background-size: 200%; 
    background-position: center center;
    background-position: var(--random-x, 50%) var(--random-y, 50%);
    filter: opacity(0.6); /* or contrast(0.8), blur(2px), etc. */
  z-index: -1;
  /*
  animation-name: anglePulse;
  animation-duration: 23s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
	*/
}


.active #content { display: none; }
#wrapper {
  	/* animation: rotBord 4.2s linear infinite; */
  --angle: 0deg;
  --angle2: 360deg;
 	animation-name: angleRotate;
  animation-duration: 23s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
	border-width: 0.5vmax; border-style: solid;
	background-image: linear-gradient(to top, rgba(var(--ca-pink),0.2), rgba(var(--c-dblue),0.15)) ;
	background-attachment: fixed;
	background-size: contain;
	background-position: center center;
	position: fixed;
	overflow-y: auto;
	overflow-x: hidden;
	top: var(--spacer-top);
	width: 100%;
	height: calc(100% - var(--spacer-top));
	scroll-behavior: smooth;
	scrollbar-color: rgb(var(--ca-pink)) transparent;
	scrollbar-gutter: inherit;
}
#container { margin: 0 auto 3rem; }
.animation-container {

}


body.kunst-kultur #wrapper { background-image: url(img/htpx/tilebg-greys-23.png), linear-gradient(to top, rgba(var(--c-green),0.4), rgba(var(--c-blue),0.3)) ; }
body.kunst-kultur #content:before { background: url(img/htpx/tilebg-greys-23.png); }



.the-canvas { padding-top: 0; }
#objectHolder { height: 100vh; width: 130vw; }

#ObjHTP25 { border: 0px solid transparent; position: absolute; /* Or absolute */
    top: 0;
    left: calc(50% - 768px);
    bottom:0;
    margin-top: 0;
    z-index: -1; 
    pointer-events: none;
    width: 100%;
    height: 100%; }
#objdate { opacity: 0; display: none; }



 /* scrollbar space to middle article { left: 1.5rem; position: relative; z-index: 10; } */

.single article { width: 100%; height: 100%; }
article header { transition: all 0.23s; /* overflow: hidden; shift outside */ }
.error404 article .header,
.single article .header,
.page article .header,
.blog section.header { left: 0; position: absolute; margin-top: 0; background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 100; width:100%;}
.page article .header,
.single article .header,
.blog section.header { background-size: cover; background-repeat: no-repeat; background-color: transparent;  }
.single article .header .meta, .page article .header .meta { position: absolute; bottom: 0; border-bottom: 3px inset rgb(var(--c-footer)); line-height: 2rem; width: 100%; margin: auto auto 0; }
.error404 article .header { overflow: hidden; }


.preload #header { height: 0px; }

h2.entry-title {
  background: linear-gradient( 23deg, rgb(var(--ca-cyan)), rgb(var(--ca-green)), rgb(var(--c-green)), rgb(var(--ca-blue)),  rgb(var(--c-blue)), rgb(var(--c-green)), rgb(var(--ca-cyan))) no-repeat center center;
  text-shadow: 1px -1px 0px rgba(var(--c-black),0.3);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: animatedGradient 2s infinite ease;
  animation-direction: alternate;
 }




.entry-footer { margin: 1.5rem 1rem 50rem; }
.entry-content strong, .entry-content b { font-weight: 600; }
.entry-content strong, .entry-content b { color: rgb(var(--c-white)); text-shadow: 0px 0px 2px rgb(var(--ca-pink)); }
.entry-content,
.entry-summary {
	margin: 0 auto 2.5rem;
	/* padding: 15rem 0 1rem;  background: linear-gradient(110deg, rgba(255, 255, 255, .95) 23%, rgba(255, 255, 255, 0) 80%); */ border-radius: 5px; }
.entry-content ol { margin-bottom: 1rem; }

.entry-content {
    position: relative; /* Required to position the corners correctly */
}

.htp-corner {
    position: absolute;
    background-color: transparent;
    opacity: 0; /* Start invisible */
    transition: opacity 0.3s ease-in;
}

/* Keyframes for growing the lines */
@keyframes growCorner {
    0% {
        width: 1px;
        height: 1px;
        opacity: 0;
    }
    20% {
        opacity: 0.1;
    }
    100% {
        width: 23px;
        height: 1px;
        opacity: 1;
    }
}

/* Top-right corner 
.htp-top-right {
    border-bottom: 1px solid var(--c-corner);
    top: 0;
    right: 0;
    width: 1px; 
    height: 1px; 
    animation: growCorner 2.3s ease-in-out 2s forwards; 
}

.htp-top-right::after {
    border-left: 1px solid var(--c-corner);
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 1px; 
    animation: growCornerAfter 2.3s ease-in-out 2s forwards; 
}
*/

/* Bottom-right corner */
.htp-bottom-right {
    border-top: 1px solid var(--c-corner);
    bottom: 0;
    right: 0;
    width: 1px; /* Start small */
    height: 1px; /* Start small */
    animation: growCorner 2.3s ease-in-out 2s forwards; 
}
.htp-bottom-right::after {
    border-left: 1px solid var(--c-corner);
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 1px; /* Start small */
    height: 1px; /* Start small */
    animation: growCornerAfter 2.3s ease-in-out 2s forwards; /* Start animation after 2 seconds */
}

/* Bottom-left corner */
.htp-bottom-left {
    border-top: 1px solid var(--c-corner);
    bottom: 0;
    left: 0;
    width: 1px; /* Start small */
    height: 1px; /* Start small */
    animation: growCorner 2.3s ease-in-out 2s forwards; 
}
.htp-bottom-left::after {
    border-right: 1px solid var(--c-corner);
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 1px; /* Start small */
    height: 1px; /* Start small */
    animation: growCornerAfter 2.3s ease-in-out 2s forwards; /* Start animation after 2 seconds */
}

/* Keyframes for the pseudo-elements */
@keyframes growCornerAfter {
    0% {
        width: 1px;
        height: 1px;
        opacity: 0;
    }
    20% {
        opacity: 0.1;
    }
    100% {
        width: 1px; 
        height: 23px; 
        opacity: 1;
    }
}





/*
.htp-corner {
    position: absolute;
    background-color: var(--c-corner); 
}
.htp-top-right {
		border-bottom: 1px solid #00ffff;
    top: 0;
    right: 0;
    width: 23px;
    height: 1px;
    opacity: 1;
}
.htp-top-right::after {
		border-left: 1px solid #00ffff;
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 23px;
    opacity: 1;
    background-color: var(--c-corner);
}
.htp-bottom-right {
		border-top: 1px solid #00ffff;
    bottom: 0;
    right: 0;
    width: 23px;
    height: 1px;
    opacity: 1;
}
.htp-bottom-right::after {
		border-left: 1px solid #00ffff;
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 1px;
    height: 23px;
    opacity: 1;
    background-color: var(--c-corner);
}
.htp-bottom-left {
		border-top: 1px solid #00ffff;
    bottom: 0;
    left: 0;
    width: 23px;
    height: 1px;
    opacity: 1;
}
.htp-bottom-left::after {
		border-right: 1px solid #00ffff;
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 1px;
    height: 23px;
    opacity: 1;
    background-color: var(--c-corner);
}
*/


.entry-content blockquote, .entry-summary blockquote { padding: 2rem 0; margin: 1rem 0 2rem; border: 1px solid rgba(var(--ca-cyan),0.5);
background-color: rgba(var(--c-footer), 0.23);

    background-size: contain;
    background-position: center center;
    transition-timing-function: ease-in-out;

}
/* .entry-content p:first-letter { font-size: 3rem; margin: 7px 4px 0 -5px; display: block; line-height: 2.1rem; float: left; } */
.entry-content blockquote::before, .entry-summary blockquote::before {
  content: "";
  width: 50%;
  height: 100%;
  float: left;
  shape-outside: url('img/HTP_logo.svg');
  shape-margin: 7%; }

.entry-content blockquote p, .entry-summary blockquote p { margin: 0; padding: 0 6rem; text-align: center; font-style: italic; }
.entry-content blockquote p::before, .entry-summary blockquote p::before {
  content: "";
  width: 50%;
  height: 100%;
  float: right;
  shape-outside: url('img/HTP_logo.svg');
  shape-margin: 7%;
}

.entry-content ul, .entry-summary ul { padding: .5rem var(--sidespace); margin: 0 0 1rem; 
/*  background-image: linear-gradient(to bottom right, black 50%, blue 50%);
  background-clip: text;
  color: transparent; 
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
*/
}

.entry-content p, .entry-summary p,
.blog .entry-content p, .blog .entry-summary p { text-shadow: -1px 1px 1px #000000, 1px 4px 10px rgb(var(--ca-cyan)), -1px 1px 1px rgb(var(--c-green)); padding: 0 var(--sidespace) 2rem;}

p strong { -webkit-text-fill-color: inherit; }

.blog .entry-content p, .blog .entry-summary p,
.blog .entry-content ul, .blog .entry-summary ul { padding: 0; margin: 0 0 1rem; }

.ct-preview.entry-content p { padding: 0; }
.entry-content li, .entry-summary li { margin-left: calc(var(--spacer) + var(--spacer)); line-height: 1.37; margin-bottom: 0px; color: rgb(var(--ca-pink));}

.single-post .entry-content { margin: 2.5rem 0; padding: 1rem; }


hr { border-width: 0 0 2px; border-style: solid; clear: both;
    border-image: linear-gradient(to right, transparent, rgb(var(--c-dblue)), rgb(var(--c-lblue)), rgb(var(--ca-pink)), rgb(var(--c-lblue)), rgb(var(--c-dblue)), transparent) 1; }
        
        /* Custom HR with bottom glow only */
        .gradient-hr {
            position: relative;
            height: 4px;
            border: none;
            margin: 2.5rem 0;
            overflow: visible;
        }
        
        .gradient-hr::before {
            content: '';
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 2px;
            background: linear-gradient(to right, 
                transparent, 
                rgb(var(--c-dblue)), 
                rgb(var(--c-lblue)), 
                rgb(var(--ca-pink)), 
                rgb(var(--c-lblue)), 
                rgb(var(--c-dblue)), 
                transparent);
        }
        
        .gradient-hr::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: -5px;
            width: 100%;
            height: 3rem;
            background: radial-gradient(ellipse at bottom, 
                rgba(var(--c-dblue), 0.6) 0%, 
                rgba(var(--c-lblue), 0.4) 30%, 
                rgba(var(--ca-pink), 0.2) 60%, 
                transparent 80%);
            filter: blur(3px);
            z-index: -1;
        }

.page-links {
	clear: both;
	margin: 0 0 1.5rem;
}

.content .header {
	height: 42px;
}



input, textarea, #result, .post-password-form input[type="password"], #htpp-search-input {
  border-image: linear-gradient(var(--angle), rgb(var(--ca-pink)), rgb(var(--c-blue))) 1;
  line-height:1.8; padding: .3rem .5rem;
  border-radius: .5rem;
  animation-name: angleRotate;
  animation-duration: 42s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  border-width: 2px;
  border-style: solid;
  font-size: 1rem;
  margin: 0 .5rem .5rem 0;
}
.htp-subscription-form button, .htp-subscription-form input,
.post-password-form input[type="submit"] { min-width: 140px; width: 10vw; max-width: 100%; }
.htp-subscription-form input, input.search-submit, 
.post-password-form input[type="password"] { color: rgba(var(--c-white),1); font-style: italic;  background: rgba(var(--ca-pink),.5); }
.htp-subscription-form input:focus, .post-password-form input[type="password"]:focus { 
	background: rgba(var(--c-white),.5); font-style: normal; transition: all 1s; color: rgb(var(--c-black)); } 
#result { color: rgb(var(--c-white)); display: none; background: #ffffff33; padding: 1rem; }

.htp-subscription-form input::placeholder,
input.search-submit::placeholder,
.post-password-form input[type="password"]::placeholder {
    color: rgb(var(--c-white));
    opacity: .8; 
    font-style: italic; 
}



.error-message {
  display: none;
  font-weight: bold;
  color: var(--c-red);
}

/* To demonstrate that the validations only happen on blur, we apply this malpractice */
input:focus, textarea:focus {
  outline: none;
}

/* Only show invalid ring while not focused */
input:not(:focus):not(:placeholder-shown):invalid, textarea:not(:focus):not(:placeholder-shown):invalid  {
	border-image: none;
  border-color: var(--c-red);
  background-color: rgba(var(--c-red), .23);
  color: rgb(var(--c-white));
  font-weight: 700;
  font-style: normal;
}
input:not(:focus):not(:placeholder-shown):invalid ~ .error-message, textarea:not(:focus):not(:placeholder-shown):invalid ~ .error-message {
  display: block;
}

/* Only show valid ring while not focused and if a value is entered */
/* :empty won't work here as that targets elements that have no childeren. Therefore we abuse :placeholder-shown */
input:not(:focus):not(:placeholder-shown):valid, textarea:not(:focus):not(:placeholder-shown):valid {
  border-color: var(--c-green);
}


#sizeInfo p { color: #f9f9f9; }



/* =Asides
----------------------------------------------- */

.blog .format-aside .entry-title,
.archive .format-aside .entry-title,
img.no-script {
	display: none;
}

#htp_ptx #footer.afterload {
    position: fixed;
    bottom: 0.4vmax;
    left: 0.4vmax;
    right: 0.4vmax;
    width: calc(100% - 0.8vmax); }
#htp_ptx h1 { font-size: 2vmax; line-height: 1.7;  }
#htp_ptx h6 { line-height: 1.5; }
#htp_ptx #map { margin-bottom: 4rem; margin-top: -6vh; width: 50vw; }





.btn-group, .btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.page-template-page-ptx-program a.nav-link.btn {
    height: 52px;
    width: 130px;
    color: rgb(var(--c-black));
    border-color: rgb(var(--c-white)) !important;
}
.page-template-page-ptx-program a.btn.glitch { background: rgba(var(--c-dblue), 84) !important; color: rgb(var(--c-white)); border-color: rgb(var(--ca-pink)) !important; }
.page-template-page-ptx-program a.btn.glitch.active { 
	background: rgba(var(--ca-pink), 42) !important; 
	color: rgb(var(--c-white)) !important; 
	border-color: rgb(var(--c-white)) !important; 
}




/* Arrow or gradient to indicate scrolling */
.page-template-page-ptx-program .scroll-indicator {
    position: absolute;
    top: 0;
    right: -1rem;
    height: 100%;
    width: 30px;
    background: linear-gradient(to left, rgba(var(--c-red), 1), rgba(var(--c-red), 0));
    pointer-events: none;
    z-index: 1019;
}
.page-template-page-ptx-program .scroll-indicator::before {
    position: absolute;
    top: 150px;
    right: -55px;
    content: 'Mehr Räume';
    transform: translateY(-50%) rotate(90deg); /* Rotate the text 90 degrees clockwise */
    transform-origin: center; /* Ensure the rotation occurs from the center */
    font-size: .9rem; /* Adjust font size to fit within the indicator */
    color: #ffffff;
    font-weight: bold;
    pointer-events: none; /* Ensure the text doesn't interfere with scrolling */
    width:150px;
}


.entry-meta.htp_ethges, li.htp_ethges, .alert.htp_ethges, .bg-soft-htp_ethges, .htp_ethges .htp_badges .badge { /* "Ethik & Gesellschaft" */
	background-color: rgba(var(--htp-kultur),.42);
    border-color: rgba(var(--htp-kultur),.84);
}

.page-template-page-ptx-program td.alert.htp_kultur {
	background-color: rgba(var(--htp-kultur), 0);
	background-image: linear-gradient(
	  to bottom right,
	  rgba(var(--htp-kultur), 0.23),
	  rgba(var(--htp-kultur), 0.00)
	);
}




.htp_schedule_table { width: 100%; }
.tag-list-item { color: #fff; padding: 0.4em 0.8em; border-radius: 0.3em; font-weight: bold; font-size: 0.9em; }

.htpx-schedule-grid {
  display: grid;
  gap: 1rem;
}

/* Landscape: width > height — 3 columns */
@media (min-aspect-ratio: 4/3) {
  .htpx-schedule-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .lightbox-share-buttons { bottom: 45vh !important; }
}

/* Portrait: height > width — 1 column stacked */
@media (max-aspect-ratio: 3/4) {
  .htpx-schedule-grid {
    grid-template-columns: 1fr;
  }
}

.htp_schedule_table h1, .htp_schedule_table h2, .htp_schedule_table h3, .htp_schedule_table h4, .htp_schedule_table h5, .htp_schedule_table h6 {
    margin-bottom: .5rem;
    font-weight: 500;
    line-height: 1.2;
}
.htp_schedule_table p { margin-top: 0; }
table.htp_schedule_table thead th { border-bottom: 2px solid rgb(var(--c-pink)); vertical-align: middle; }
.htp_schedule_table th { text-align: inherit; text-align: -webkit-match-parent; font-family: var(--title-font); color: rgb(var(--c-dblue)); 
	background-image: radial-gradient(rgba(var(--ca-pink),.42), rgba(var(--c-lblue),.23)); background-attachment: fixed;}
a.htpx_talks_text { color: rgb(var(--c-dblue)); text-decoration: none; background-color: rgba(0, 0, 0, 0); }   

.justify-content-center { justify-content: center !important;}

.btn-group, .btn-group-vertical { position: relative; display: inline-flex; vertical-align: middle; }

ul.btn-group>li:not(:last-child)>.btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
ul.btn-group>li:not(:first-child)>.btn {
    margin-left: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}





#htpsignbg { transition: fill 1s ease, stroke 1s ease, stroke-width 1s ease; }
#htp_foot_slowanim { position: fixed; z-index:-1; top: 0; left: auto; right:0; height: 100%; width: 100%; pointer-events: none; }
#htp_foot_slowanim svg {
    position: absolute;
    top: -5vh;
    left:0;
    right: 0;
    translate: 0% -20%;
    transform-origin: center;
}


.bg-soft-htp_ethges {  }
.bg-soft-htp_kultur {  }
.bg-soft-htp_digisev {  }
.bg-soft-htp_andere {  }
.bg-soft-htp_error {  }


.htp_ethges .htp_badges {  }
.htp_kultur .htp_badges {  }
.htp_digisev .htp_badges {  }
.htp_andere .htp_badges {  }
.htp_error .htp_badges {  }

.htp_badges { text-align: right; }

/* Make the article take up 90% of the viewport height */
.htp-touchcount article {
    height: 90vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column; /* Center contents vertically */
}

/* Ensure the #htp-content div is centered within the article */
#htp-content {
    max-width: 100%; /* Prevent overflow */
    width: 80vw;
   /* display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;  Optional: add padding if needed */
}



.htpx_talks li, .htpx_talkslots li, .htpx_artists li { text-align: left; }

#TouchCount { display: none; }
.htp-touchcount #defaultCanvas0 { left: 0vw !important; }
.htp-touchcount #TouchCount{ display: block; width: 100%; }
.htp-touchcount section#article, .htp-touchcount #header, .htp-touchcount #mobile_menu { display: none !important; }
.htp-touchcount #wrapper { top: 0 !important; height: 100vh !important; overflow: hidden; }
.htp-touchcount #HTP25_footer { }



#touchcount-total {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 20px;
}






.touchcount-count {
    font-size: 1em;
    font-weight: bold;
    color: #333;
    margin-top: -40px;
    margin-left: -150px;
}



/* Style the content inside #htp-content if needed */
#htp-content .touchcount-protected,
#htp-content .touchcount-visible {
    width: 100%; /* Take full width */
    text-align: center; /* Center the text/content inside */
}



.touchcount-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

#touchcount-feedback {
		margin: 1rem 0;
    padding: 1rem;
    background-color: #4caf50; /* Green */
    color: white;
    border-radius: 5px;
    text-align: center;
    transition: all 2s; 
    display: none;
}

.touchcount-button-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 calc(33.333% - 10px); /* For 3 buttons */
}

.touchcount-button {
    padding: 10px 20px;
    background-color: #0073aa;
    color: #fff;
    border: none;
    cursor: pointer;
    text-align: center;
    transition: background-color 0.3s ease;
    width: 100%;
    margin-bottom: 10px;
}

.touchcount-button:hover {
    background-color: #005177;
}

	.touchcount-count { 
    font-size: 1.5em;
		margin-top: -40px;
	  margin-left: -66px;
	  border-left: 1px solid #00ffff;
	  border: 1px solid #00ffff;
	  text-shadow: 1px 1px 2px #ffffff;
	  padding: 10px 100px 10px 10px;
	  margin-bottom: 1rem;
	  background: #ffffff;
	  border-radius: .5rem;
	  width: 160px; }

	#touchcount-total {
        border-left: 1px solid #00ffff;
        border: 1px solid #00ffff;
        text-shadow: 1px 1px 2px #ffffff;
        padding: 10px;
        margin-bottom: 1rem;
        background: #ffffff;
        border-radius: .5rem;
        width: 100%; }



/* Adjust for more buttons */
@media (max-width: 768px) {
    .touchcount-button {
        flex: 1 1 calc(50% - 10px); /* For 2 buttons per row on smaller screens */
    }
    .touchcount-button-container {
        flex: 1 1 calc(50% - 10px); /* For 2 buttons per row on smaller screens */
    }
}

@media (max-width: 480px) {
    .touchcount-button {
        flex: 1 1 100%; /* Full width on very small screens */
    }
    .touchcount-button-container {
        flex: 1 1 100%; /* Full width on very small screens */
    }


.table th.col-title, .table td.col-title {
    width: 62px;
    min-width: 48px;
}
    th.col-title, td.col-title {
        font-size: 13px; /* Reduce font size for mobile */
        padding: 5px; /* Reduce padding for smaller screens */
        white-space: nowrap; /* Prevent text wrapping */
    }

}





/* topics blog post meta */
.htp-logo-grid { 
	display: inline-grid; /* https://css-tricks.com/snippets/css/complete-guide-grid/  */
	grid-template-columns: [lc1] 15% [lc2] 18.7% [lc3] 32% [lc4] 1.6% [lc5] 5% [lc6] 26.5% [lc7];
	/* grid-template-columns: [first] 40px [line2] 50px [line3] auto [col4-start] 50px [five] 40px [end]; */
  grid-template-rows: [lr1] 17.7% [lr2] 13% [lr3] 14.6% [lr4] 29.7% [lr5] 6.6% [lr6];
  color: #ffffff;
}

.entry-meta-topics {
	/* grid-template-rows: [lr1] 15% [lr2] auto [lr3] 23% [lr4]; */
  top: 0;
  position: relative;
  width: 300px;
  left: 35vw;
  font-family: 'SuperMarioBros';
}
.entry-meta-topics a { color: #ffffff; }
.entry-meta-topics .cat-links a { font-family: 'SuperMarioBros';}

.entry-meta-topics div { background: #000000; padding: 0.5em 1em; width: auto; display: inline-block; border: 1px solid rgb(var(--c-red)); text-align: center;}
.entry-meta-topics .mdate { 
	position: absolute;
	top: 0px;
	left: 50%;
	margin-left: -42%;
	height: 20px;
	width: auto;
	border-bottom: 0;
	font-size: 10px;
	vertical-align: middle;
	margin-bottom: -1px;
	z-index: 10;
}
.entry-meta-topics .cat-links { 
	position: absolute;
	top: 18px;
	height: 42px;
	width: 100%;
	z-index: 5;
	line-height: 22px;
	text-align: left;
}
.entry-meta-topics .author { 
	position: absolute;
	top: 60px;
	right: 0;
	height: 20px;
	width: 65%;
	border-top: 0;
	margin-top: -1px;
	z-index: 7;
	font-weight:600;
}

.entry-meta-topics .author span {
	  position: absolute;
    top: -5px;
    display: block;
    right: 10px;
}


/* =Media
----------------------------------------------- */

.site-header img,
.entry-content img,
.comment-content img,
.widget img {
	max-width: 100%; /* Fluid images for posts, comments, and widgets */
}
.site-header img,
.entry-content img,
img[class*="align"],
img[class*="wp-image-"] {
	height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */
}
.site-header img,
.entry-content img,
img.size-full {
	max-width: 100%;
	width: auto; /* Prevent stretching of full-size images with height and width attributes in IE8 */
}

.htpx_partner {text-align: center; }
.htpx_partner img.size-full { height: auto; max-height: 50px; }



.htpx_partner {
    display: grid;
    grid-gap: 1rem; /* Space between grid items */
    padding: 0;
    list-style: none !important; /* Remove default list styles */
     margin: 2rem 0rem 1rem; 
}

/* 1 column layout for screens smaller than 600px */
.htpx_partner {
    grid-template-columns: 1fr; /* 1 column */
}

/* 2 column layout for screens wider than 600px */
@media (min-width: 600px) {
    .htpx_partner {
        grid-template-columns: repeat(2, 1fr); /* 2 columns */
    }
}

/* 6 column layout for large screens */
@media (min-width: 1024px) {
    .htpx_partner {
        grid-template-columns: repeat(3, 1fr); /* 6 columns */
    }
	#Fri table.htp_schedule_table thead th.htp_room_schedule, #Fr table.htp_schedule_table thead th.htp_room_schedule { width: 860px; }
}


/* Styling for list items inside the ul .htpx_partner li { display: inline-block; max-width: 25%; margin: 0; } */
.htpx_partner { list-style: none; }
.htpx_partner li {
    padding: 1rem;
    border-radius: 5px;
    text-align: center;
    max-width: 300px;
    margin: auto;
}






img[class*="wp-image-"]{
	-webkit-mask-image: url(img/HTP_logo.svg);
    -webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: inherit;
	mask-image: url(img/HTP_logo.svg);
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: revert-layer;
}

#htp_map_bg {     
	display: inline-block;
    float: right;
    vertical-align: middle;
    background-position: 25%;
    background-size: cover;
    background-image: url('2025/objects2025-flyer.svg'); 
    margin-top: -160px;
    padding: 1rem 0;
    width: 500px;
    height: 500px;
    vertical-align: middle;
  }

 #htp_map_bg p { margin-top: -4rem;
    margin-left: 10rem;
    z-index: 100;
    position: relative; }

#mappppppppp,
#htp_backupmap { mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: revert-layer; 
  mask-image: url('2025/objects2025-flyer.svg');
  -webkit-mask-image: url('2025/objects2025-flyer.svg');
  filter: url('#shadow');
  border: 1px solid black; margin-right: 1rem;
  pointer-events: none;

  }

#htp_ptx #mapppppppp::before,
#htp_backupmap::before {
  content: "";
  position: absolute;
  width: 101%;
  top: -2px; /* Border width */
  left: -2px; /* Border width */
  right: -2px; /* Border width */
  bottom: -2px; /* Border width */
  mask-image: url('2025/objects2025-flyer.svg');
  -webkit-mask-image: url('2025/objects2025-flyer.svg');
  background: #00ffff; /* Border color */
  z-index: -1;mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: revert-layer; 
}



p > img[class*="wp-image-"].alignleft, #mappppp {
	-webkit-mask-image: url('2025/objects2025-flyer.svg');
	mask-image: url('2025/objects2025-flyer.svg');
}
p > img[class*="wp-image-"].alignright {
	-webkit-mask-image: url('2025/objects2025-flyer.svg');
	mask-image: url('2025/objects2025-flyer.svg');
}

figure img[class*="wp-image-"] { -webkit-mask-image: none; mask-image: none; }

.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}
.wp-caption {
	border: 1px solid #ccc;
	max-width: 100%;
}
.wp-caption.aligncenter,
.wp-caption.alignleft,
.wp-caption.alignright {
	margin-bottom: 1.5em;
}
.wp-caption img {
	display: block;
	margin: 1.2% auto 0;
	max-width: 98%;
}
.wp-caption-text {
	text-align: center;
}
.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}
.site-content .gallery {
	margin-bottom: 1.5em;
}
.gallery-caption {
}
.site-content .gallery a img {
	border: none;
	height: auto;
	max-width: 90%;
}
.site-content .gallery dd {
	margin: 0;
}
.site-content .gallery-columns-4 .gallery-item {
}
.site-content .gallery-columns-4 .gallery-item img {
}





/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}

#svg-container {
    -webkit-mask-image: url(img/HTP_logo.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: inherit;
    mask-image: url(img/HTP_logo.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: revert-layer;
    border-image: linear-gradient(var(--angle), rgb(var(--ca-green)), rgb(var(--c-blue))) 1;
    animation-name: angleRotate;
    animation-duration: 23s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border-width: 0.5vmax;
}
#svg-container::before {
		content: "";
		position: absolute;
		top: 10px;
    -webkit-mask-image: url(img/HTP_logo.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: inherit;
    mask-image: url(img/HTP_logo.svg);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: revert-layer;
    border-image: linear-gradient(var(--angle), rgb(var(--ca-green)), rgb(var(--c-blue))) 1;
    animation-name: angleRotate;
    animation-duration: 42s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    border-width: 1vmax;
}

.single-eternal #htpsignbg { display: none; }
#frame_eternal {
    /* Fallback for older browsers */
    background-color: #4a90e2;
    background: linear-gradient(to bottom right, #4a90e2, #9013fe);
    background: -webkit-linear-gradient(to bottom right, #4a90e2, #9013fe); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(to bottom right, #4a90e2, #9013fe);    /* For Firefox 3.6 to 15 */
    background: -o-linear-gradient(to bottom right, #4a90e2, #9013fe);      /* For Opera 11.1 to 12.0 */
    background: -ms-linear-gradient(to bottom right, #4a90e2, #9013fe);     /* For IE 10 */
    background: linear-gradient(to bottom right, #4a90e2, #9013fe);         /* Standard syntax */
    background-size: cover;
    border: 3px dashed #00ff00;
    box-shadow: inset 1px 1px 10px #00ffff, inset -1px -1px 1px #00ffff, inset 1px 1px 1px #ff0000, 1px 1px 20px #0000ff99;
}

.single-eternal #frame_eternal {
    display: flex;
    justify-content: center;      
    align-items: center;          
    height: calc(100vh - 500px);                
    width: 100%;                 
    margin: 0 auto;              
    position: relative; 
    border-radius: 3rem;
    z-index: 10;
}

.type-eternal #frame_eternal #jigsaw-puzzle-container {
    display: flex;          
    justify-content: center;     
    align-items: center;       
    width: auto;                
    height: auto;  
}

#jigsaw-puzzle-container svg { max-height: 400px; width: 100%; }

.no-js .type-eternal .abstract {
    top: -270px;
    position: relative;
    border-radius: 0;
    box-shadow: none;
    opacity: 0;
    z-index: -1;
    transition: none; /* Ensure no transition happens for no-js */
}

.type-eternal .abstract {
    top: -270px;
    position: relative;
    opacity: 0; 
    padding: 4rem 1rem 1rem;
    margin: -3rem 0.3rem 1rem;
    background: #ffffff;
    border-radius: 1rem;
    box-shadow: inset 1px 1px 10px #00ffff, inset -1px -1px 1px #00ffff, 
                inset 1px 1px 1px #ff0000, 1px 1px 20px #0000ff99;
    animation: slideEternalMetaIn 5s ease-in-out forwards; /* Apply animation */
}

/* Define the keyframe animation for sliding in */
@keyframes slideEternalMetaIn {
    0% {
        top: -270px;
        opacity: 0;
    }
    100% {
        top: 0;
        opacity: 1;
    }
}



.type-eternal .abstract li { min-height: 32px; padding: .5rem 0; }




/* =Navigation
----------------------------------------------- */

.site-content .site-navigation {
	margin: 0 0 1.5em;
	overflow: hidden;
}
.site-content .nav-previous {
	float: left;
	width: 50%;
}
.site-content .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}

li.nav-item { list-style: none; margin: 0 0.42vmax; }

/* =Comments
----------------------------------------------- TODO: why does it need overflow? */
#comments-list { overflow: hidden; }

.bypostauthor {
}

/* =Widgets
----------------------------------------------- */

.widget {
	margin: 0 0 1.5em;
}

/* Search widget */
#searchsubmit {
	display: none;
}

.sticky{}
.bypostauthor{}
.wp-caption{}
.wp-caption-text{}
.gallery-caption{}


/* Default WordPress Components */
.alignnone { margin: 5px 20px 20px 0; }

/* WP User Avatar */
.avatar.alignnone { margin: 0; }

.aligncenter, div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright, a img.alignright{
    float: right;
    margin: 5px var(--sidespace-gap) 21px 21px;
}

.alignleft, a img.alignleft {
    float: left;
    margin: 5px 21px 0 var(--sidespace-gap);
}
figure.alignright { margin-right: 0; }
figure.alignleft { margin-left: 0; }

.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.alignnone {
    margin: 5px 21px 21px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption-text {
	font-style: italic;
	font-size: 0.7em;
	text-align: center;
}



input[type="search"], input[type="text"], textarea {
	border: 1px solid rgba(var(--c-footer, 0.5));
	border-bottom-color: rgb(var(--c-black));
    padding: 0.375rem 0.75rem;
    border-radius: var(--radius);
    font-size: 1rem;
    line-height: 1.4; width: 100%; }
input[type="search"]:focus, input[type="text"]:focus {
	border: 1px rgb(var(--ca-green)) solid;
}


.btn, input[type="button"], input[type="submit"], input[type="reset"], input[type="password"], .newsletter form a {
  display: inline-block;
  font-weight: 400;
  color: rgb(var(--c-black));
  text-align: center;
  vertical-align: middle;
  user-select: none;
  background-color: transparent;
  border: 1px solid rgb(var(--c-black));
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: var(--radius);
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
  @media (prefers-reduced-motion: reduce) {
    .btn {
      transition: none; } }
  .btn:hover {
    color: rgb(var(--c-black));
    text-decoration: none; }
  .btn:focus, .btn.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
  .btn.disabled, .btn:disabled {
    opacity: 0.65; }
  .btn:not(:disabled):not(.disabled) {
    cursor: pointer; }

a.btn.disabled,
fieldset:disabled a.btn {
  pointer-events: none; }

.btn-primary {
  color: rgb(var(--c-black));
  background-color: rgba(var(--c-blue), 50%);
  border-color: rgb(var(--ca-blue)); }
  .btn-primary:hover {
    color: rgb(var(--c-black));
    background-color: #0069d9;
    border-color: #0062cc; }
  .btn-primary:focus, .btn-primary.focus {
    color: rgb(var(--c-black));
    background-color: #0069d9;
    border-color: #0062cc;
    box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5); }
  .btn-primary.disabled, .btn-primary:disabled {
    color: rgb(var(--c-black));
    background-color: #007bff;
    border-color: #007bff; }
  .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
  .show > .btn-primary.dropdown-toggle {
    color: rgb(var(--c-black));
    background-color: #0062cc;
    border-color: #005cbf; }
    .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-primary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5); }

.btn-secondary {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d; }
  .btn-secondary:hover {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62; }
  .btn-secondary:focus, .btn-secondary.focus {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
    box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5); }
  .btn-secondary.disabled, .btn-secondary:disabled {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d; }
  .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
  .show > .btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: #545b62;
    border-color: #4e555b; }
    .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-secondary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5); }


/* Styles for users who prefer dark mode at the OS level
@media (prefers-color-scheme: dark) {
	#logo { background-image: url('img/HTP_logo-neg.svg'); }
}

   display: flex;
   align-items: center;
   justify-content: center;


   background: radial-gradient(circle farthest-corner at center center, rgb(var(--ca-cyan)), rgb(var(--c-green))), no-repeat;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
*/

.newsletter input[type="submit"], .newsletter form a { font-size: 10pt; }
.newsletter form a { float: right; }
.newsletter .jumbotron { margin-bottom: 1em; width: 100%;}
.newsletter .jumbotron td { padding: 4px 0 4px 4px; }



#signage_screens { position: absolute; top: 0; left: 0; height: auto; max-height: 100vh; width: 100vw; z-index: 100; }
#signage_screens_portrait { position: absolute; top: 0; left: 0; height: 100vh; width: 100vw; z-index: 100; }
.onsites #header #htplogosvg { top: 0; right: 0; }
.arrow_right2top.onsites #header #htplogosvg, .arrow_top2right.onsites #header #htplogosvg { bottom: 0; top: auto; left: 0; }


#screen_arrows .arr_corner { display: none; }
.arrow_left2top #screen_arrows .corner_left2top.arr_corner { display: inline-block !important; }
.arrow_bottom2left #screen_arrows .corner_bottom2left.arr_corner { display: inline-block !important; }
.arrow_left2bottom #screen_arrows .corner_left2bottom.arr_corner { display: inline-block !important; }
.arrow_right2bottom #screen_arrows .corner_right2bottom.arr_corner { display: inline-block !important; }
.arrow_bottom2right #screen_arrows .corner_bottom2right.arr_corner { display: inline-block !important; }
.arrow_right2top #screen_arrows .corner_right2top.arr_corner { display: inline-block !important; }
.arrow_left2top #screen_arrows .corner_left2top.arr_corner { display: inline-block !important; }
.arrow_top2right #screen_arrows .corner_top2right.arr_corner { display: inline-block !important; }

.single-htpp.onsites.FullHD #ObjHTP25 { 
		right: -4412px;
    top: -1330px;
    translate: -16% 33%;
    z-index: -1;
    width: 4000px !important;
    height: 2000px !important;
    position: absolute;
}
.single-htpp.onsites.FullHD #container { max-width: 1800px; margin-top: -25px;  }
.single-htpp.onsites.FullHD .screen_rotate #container { max-width: 1000px; margin-top: -25px;  }
.FullHD  #header #htplogosvg { top: 0.3vmax; right: 0.3vmax; width: 220px; }
.FullHD h2 { font-size: 3rem; text-align: center; /* text-shadow: 2px 2px 0px rgb(var(--c-white)), 4px 4px 2px rgb(var(--ca-blue)), -5px -5px 5px rgb(var(--ca-cyan)); */
background: #ffffff; }

#htp_ptx.FullHD h2::before, #htp_ptx.FullHD h2::after { content: none !important; }

.FullHD .description.single-screen-content { padding: 1rem !important; }
.FullHD .has_schedule .description.single-screen-content { margin: 1rem 0; }
.FullHD .description.single-screen-content { margin: 1rem 0 0; }

a.schedule-name.glitch { font-size: 2rem; line-height: 2.8rem; padding: 1rem 2rem 2.5rem 2rem; margin-top: -5px; }

.htpx_listing.schedule_list .htp_ptx_qrcode { display: inline-block; margin: 0; max-width: 110px; }


/* Container UL styling */
.htpx_listing.schedule_list .submissions {
    display: flex;             /* Use flexbox to align items */
    align-items: flex-start;   /* Align items at the start of the container */
    gap: 0;                 /* Add some space between the image and the text */
    list-style: none;          /* Remove default list styling */
    padding: 0;                /* Remove padding */
    margin: 0;         
    font-size: 1.2rem;
    width: 100%;
}

.htpx_listing.schedule_list li p { font-size: 1.2rem; }
.htpx_listing.schedule_list .submissions .text-content { margin-top: .5rem; }

.htpx_listing.schedule_list .submissions .htp_list_qr {
    flex-shrink: 0;            /* Prevent the image from shrinking */
}

/* Flexbox column for the text */
.htpx_listing.schedule_list .submissions li { display: block; line-height: 1.6rem !important; }

.htpx_listing.schedule_list .submissions li:not(.htp_list_qr) {
    flex: 1;                  /* Allow these list items to take up available space */
}

.htpx_listing.schedule_list .htp_title {
    font-weight: bold;        /* Add bold to the title */
    margin-bottom: 5px;       /* Space below the title */
}

/* Optional: Adjust margins for other list items */
.htpx_listing.schedule_list .submissions li:not(.htp_list_qr):not(:first-child) {
    margin-top: 5px;          /* Space between list items */
}

.htpx_listing.schedule_list .description span { opacity: 0; height: 1px; transition: all 2s; }
.htpx_listing.schedule_list .htp_running .description span { opacity: 1; height: auto; margin: 1rem 0; }

.htpx_listing.schedule_list .htp_running .description img { margin-top: -4rem !important; margin-right: -4rem !important; margin-left: 0rem !important; }

.dark-mode .htpx_listing.schedule_list .htp_running { background-color: #ffffff66 !important };
.dark-mode h1.entry-title, .dark-mode h1 {
    color: rgb(var(--c-dblue));
    font-size: 2.3em;
    font-weight: bold;
    text-align: left;
    text-shadow: 2px 2px 2px rgb(var(--ca-pink)), -5px -5px 5px rgb(var(--ca-pink));
    margin: -18rem 0 0rem -2rem;
    transform: skewy(-13deg);
    padding: 0 2rem 1rem;
    display: flex
;
    align-items: flex-end;
    height: 30rem;
}

.single-htpp.onsites #digitalClock {
    opacity: 0;
    visibility: visible;
    transition: opacity 1s ease-in-out; /* Smooth transition */
}

.single-htpp.onsites #HTP25_Logo_Text {
    opacity: 1;
    transition: opacity 1s ease-in-out; /* Smooth transition */
}

.single-htpp.onsites #htpsignbg {
		opacity: 0;
    fill: inherit; /* Inherit original color */
    stroke: inherit; /* Inherit original stroke */
    stroke-width: inherit; /* Inherit original stroke width */
    transition: all 0.5s ease-in-out; /* Smooth transition */
}
.single-htpp.onsites #htpx_canvas { height: 80vh; margin: 0 auto; }
.single-htpp.onsites.active #location_names text {translate: 0% -40%; }
.schedule-item { padding: .5rem 1rem; margin: 0 0 2rem; }

.schedule-item .htp_onschedule { z-index: 9; position: relative; }




/* .htp_onsite_screens ul.speakers.htpx_talks, .htp_onsite_screens ul.speakers.htpx_artists { margin: 0 -1rem; padding: 10px 1rem 10px 7rem; } */
.htp_onsite_screens {  }

.htp_onsite_screens #HTP25_footer svg {
    transform: translate(0% 0%);
    width: 100%;
    height: 100%;
    opacity: 0.8;
    position: absolute;
    top: 20vh;
    left: 0;
    right: 0;
    translate: 0% -20%;
    transform-origin: center;
}


.has_schedule .htpx_listing > li { padding: 0; line-height: 1.6rem; }
.has_schedule .htpx_listing > li > a { padding: 5px 1rem 1.5rem; line-height: 1.6rem; }
.has_schedule ul { margin: .5rem 0 !important; }
.htp_rooms {
    padding: 0;
    text-align: left;
    /* background-image: linear-gradient(360deg, #00ffff, transparent); */
    border: 1px solid #ffffff;
}

.single-htpp img[class*="wp-image-"] { -webkit-mask-size: cover; mask-size: cover; }



	.dark-mode #header { background-color: rgb(var(--c-dblue)); }
	.dark-mode #header .main-navigation a:hover, 
	.dark-mode #header .main-navigation a:focus, 
	.dark-mode #header .main-navigation li.current_page_item > a, 
	.dark-mode #header .main-navigation li.current_page_parent.current_page_ancestor > a { color: #000000; }
	.dark-mode #header .main-navigation .sub-menu a { color: #000000; }
	.dark-mode .hamburger g { stroke: rgb(var(--c-pink)); }
	.dark-mode .no-anim #objdate #HTP25_do1 { opacity: 1; animation-name: fadeOut;
    animation-duration: 23s;
    animation-iteration-count: inherit;
    animation-timing-function: linear; }
	
	.dark-mode #objdate #HTP25_do2 { transition: opacity 3s ease-in-out; opacity: 1; }
	.dark-mode #HTP23_Logo_Shape_container, 
	.dark-mode #htplogosvg #HTP25_Logo_Container:hover #HTP25_Logo_Text, 
	.dark-mode #htplogosvg.site-preload #HTP25_Logo_Text, 
	.dark-mode #HTP25_Logo_Shape_container { fill: #e000c6; stroke: #ff0000; }
	.dark-mode #Datums_Objekt path { fill: #000000 !important; stroke: #ff0000 !important; }
	h1.htp_festival { text-shadow: 1px 1px #ff0000; }
	.dark-mode #htp_pagetitle text, #HTP25_motto { fill: #e000c6; }
	 #search-icon-mobile svg { fill: rgb(var(--c-blue)); }
	.dark-mode #search-icon-mobile svg { filter: drop-shadow(2px 0px 9px rgb(var(--ca-cyan))) drop-shadow(1px 1px 5px rgb(var(--c-white))) !important; }

	.dark-mode #HTP25_Logo_Text { fill: #000000 !important; }
	.dark-mode .entry-content p, 
	.dark-mode .entry-summary p, 
	.dark-mode .blog .entry-content p, 
	.dark-mode .blog .entry-summary p { text-shadow: none;  /* mix-blend-mode: difference; */ }
	.dark-mode .entry-content, 
	.dark-mode .entry-summary { background: linear-gradient(110deg, rgba(0, 255, 255, .15) 23%, rgba(255, 255, 255, .1) 80%); }
	.dark-mode button.glitch, 
	.dark-mode #htp_ptx .btn.glitch, 
	.dark-mode #htp_wp .btn.glitch, 
	.dark-mode article.category-kunst .btn.glitch, 
	.dark-mode .post-password-form input[type="submit"] { background: #00ffff33; color: #000000 !important; border-color: #000000 !important; }
	.dark-mode button.glitch:hover, 
	.dark-mode #htp_ptx .btn.glitch:hover, 
	.dark-mode #htp_wp .btn.glitch:hover, 
	.dark-mode article.category-kunst .btn.glitch:hover, 
	.dark-mode .post-password-form input[type="submit"]:hover{ color: #00ff00 !important; }
	.dark-mode #actioncontain, 
	.dark-mode #search-form-container { background: linear-gradient(110deg, rgba(0, 255, 255, .15) 23%, rgba(255, 255, 255, .1) 80%) !important; }
	.dark-mode #mobMenuNav.mainnav-mobile a { color: rgb(var(--c-white)) !important; }
	.dark-mode #filters .btn { text-shadow: 1px 1px 3px #000000;  }
	.dark-mode .htpx_partner li a { background-color: #ffffff33; display: block; padding:.5rem;}

	.dark-mode.FullHD h2 { text-shadow: none; background: #00ffff; color: #000000; }
	.dark-mode .htp_rooms { background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #00ffff66 50%, rgba(255, 255, 255, 0) 100%); }

/* It targets only the PWA used with a system icon in standalone mode */
@media only (display-mode: standalone) {
	.cdchip #logo { position:fixed; top: 0px; right: 0px; margin-top: 0px; height: 20vmax; width: 20vmax; z-index: 99999999999; }
	body { background: #00ffff33 !important; }
}


/* CSS3 animations and transition helpers */

@-webkit-keyframes fadeIn {
	0% {
	    opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.fade-in {
	visibility: visible;
	opacity: 1;
}

.fade-out {
	visibility: hidden;
	opacity: 0;
}

.fade {
	opacity: 0;
	-webkit-transition: opacity .15s linear;
	transition: opacity .15s linear;
}

.fade.in {
  opacity: 1;
}

.no-transition {
	-webkit-transition: none !important;
	-moz-transition: none    !important;
	transition: none         !important;
}


@keyframes gradientAnimation {
        0% {
            fill: url(#gradient1);
        }
        50% {
            fill: url(#gradient2);
        }
        100% {
            fill: url(#gradient1);
        }
    }


    @keyframes strokeAnimation {
        0% {
            stroke: #0000ff33; 
            stroke-width: .1rem;
        }
        25% {
            stroke: #00ff0066;
        }
        50% {
        	stroke: #00ffff99;
        }
        100% {
            stroke: #9013fe;
            stroke-width: 32.5rem;
        }
    }

    @keyframes strokeAnimationSingle {
        0% {
        		stroke-opacity: 1;
            stroke: #0000ff33; 
            stroke-width: .1rem;
        }
        25% {
            stroke: #00ff0066;
        }
        50% {
        	stroke: #00ffff99;
        }
        100% {
            stroke: #9013fe;
            stroke-width: 100vw;
            stroke-opacity: 0;
        }
    }
    @keyframes strokeAnimationTop {
        0% {
        	fill: #00ffff;
            stroke: #0000ff33; 
            stroke-width: .1rem;
        }
        25% {
            stroke: #00ff0066;
        }
        50% {
        	stroke: #00ffff99;
        }
        100% {
        	fill: #ffffff;
            stroke: #9013fe;
            stroke-width: 32.5rem;
            opacity: 0;
        }
    }




@media only screen and (min-width: 320px) and (min-height: 568px) and (orientation: portrait) {
  .home #ObjHTP25 {
    top: -85vh !important;
    height: calc(130vh + 308px) !important;
    position: fixed;
  }

  /* #ObjHTP25 { top: -110vh !important; } */
  #objdate {
    margin-top: -150px !important;
    margin-left: calc(19vw - 50%) !important;
    width: 130vw !important;
  }

  h1.htp_festival {
    font-size: 1.2rem !important;
  }
}

@media only screen and (min-width: 375px) and (max-height: 680px) {
  #objdate {
    width: 130vw !important;
  }

  h1.htp_festival {
    font-size: 1.2rem !important;
  }
}

@media only screen and (min-width: 390px) and (max-width: 486px) and (min-height: 840px) and (max-height: 959px) {

  /* header #objdate { margin-left: calc(-70% + 55vw) !important; } */
  .page-template-page-eventtop #article.container,
  .page-template-page-newsletter #article.container {
    margin-top: 0;
  }

  .page-template-page-eventtop h1.htp_festival,
  .page-template-page-newsletter h1.htp_festival {
    margin-top: -18vh;
  }
}

@media only screen and (max-width: 599px) {



  .col-sm-1 {
    width: 8.33%;
  }

  .col-sm-2 {
    width: 16.66%;
  }

  .col-sm-3 {
    width: 25%;
  }

  .col-sm-4 {
    width: 33.33%;
  }

  .col-sm-6 {
    width: 50%;
  }

  .col-sm-7 {
    width: 58.33%;
  }

  .col-sm-8 {
    width: 66.66%;
  }

  .col-sm-9 {
    width: 75%;
  }

  .col-sm-10 {
    width: 83.33%;
  }

  .col-sm-11 {
    width: 91.66%;
  }

  .col-sm-12 {
    width: 100%;
  }

  .anim404 {
    margin-top: 7vh;
  }

  #htp_lang_switch { top: 95px; opacity: 1; right: 2rem; }
  #htp_lang_switch .btn.glitch { color: var(--c-white) !important; }
  #htp_lang_switch .btn.glitch svg { width: 55px; }
  .language-menu .lang-text { opacity: 0; }

  .page-template-page-eventtop h1.htp_festival,
  .page-template-page-newsletter h1.htp_festival {
    margin-top: -155px;
    font-size: 1.3rem;
    text-align: center;
  }

  .htp-subscription-form form {
    text-align: center;
  }

  .htp-subscription-form button,
  .htp-subscription-form input {
    min-width: 200px;
    width: 80vw;
  }

  #content_foot {
    height: 14vh;
  }

  .right-contents {
    padding-bottom: 10vh !important;
  }

  .page-template-page-ptx-location .entry-content {
    text-align: center;
  }

  #htp25_footer svg {
    width: 600vh;
    height: 600vh;
  }

  .newsletter .content {
    padding-top: 0;
  }

  .page-template-page-eventtop #objdate {
    min-width: 200px;
    width: 140%;
    max-width: 512px;
    margin-left: -256px;
    margin-top: -10vh;
  }

  body.active #objdate {
    min-width: 240px;
  }

  #ObjHTP25 {
    left: -400px;
    top: -250px !important;
    /*width: 150% !important; */
  }

  .page-template-default #ObjHTP25 {
    left: 0;
    position: absolute;
  }

  #htp_ptx #map {
    margin-bottom: 4rem;
    margin-top: -10vh;
  }

  .hide-mobile {
    display: none;
  }

  #optOutUsage button.glitch,
  #optOutUsage .btn.glitch,
  #optOutUsage button.glitch:after {
    line-height: 15px;
    font-size: 13px;
    width: 50vw;
    padding-bottom: 1rem;
  }

  #htp_map_bg {
    float: none;
    margin: 0;
  }

  .page-template-page-ptx-location #article .header {
    z-index: 10;
  }

  #frame_eternal {
    padding: 1rem !important;
  }


  #site-description span {
    width: 60%;
    font-size: 0.5rem;
  }

  #mobile_menu {
    display: block;
    position: fixed;
    z-index: 1501;
    width: 100%;
    height: 1px;
  }

  .mobile-menu {
    -webkit-tap-highlight-color: transparent;
    background: transparent;
    border-radius: 50%;
    /* box-shadow: 0 0 4px 5px rgba(0, 0, 0, 0.2); */
    cursor: pointer;
    height: 150px;
    left: -87px;
    position: fixed;
    top: -87px;
    width: 150px;
  }

  #header #htplogosvg {
    top: 0;
    right: 0;
  }

  #content {
    position: relative;
    z-index: 499;
    height: calc(95vh - var(--spacer-top));
  }

.error404 article .header, .single article .header, .page article .header, .blog section.header {
	width: 100%; left: 0; position: absolute; }

  .header h1.entry-title {
    font-size: 1.8rem;
    text-align: left;
    margin: 0 -2rem 1rem;
    line-height: 1.8;
    height: auto;
    display: flex;
    align-items: flex-end;
    padding-bottom:1rem;
    transform: none;
  }

  .entry-content h2 {
    font-size: 1.1rem !important;
  }

  .entry-content h3 {
    font-size: 1rem;
  }

  .entry-content p,
  .entry-summary p {
    padding: 0;
    text-shadow: 0px 0px 1px rgba(var(--c-white),.4);
    font-weight: 300;
  }

  .entry-content blockquote p,
  .entry-summary blockquote p {
    padding: 0 1em;
    font-size: 1.1rem;
    text-shadow: 0px 0px 1px #ffffff;
  }

  .entry-content h2::before,
  .entry-summary h2::before,
  .entry-content h3::before,
  .entry-summary h3::before,
  .entry-content h4::before,
  .entry-summary h4::before,
  .entry-content h5::before,
  .entry-summary h5::before {
    margin-right: 5px;
  }

  .talk-box h3::before,
  .talk-box h3::after {
    content: "";
    margin: 0;
  }

  .entry-content ul,
  .entry-summary ul {
    padding: 0;
  }

  .entry-footer .mt-5 {
    text-align: center;
  }

  .col.col-6 {
    width: 100%;
  }

  #optOutUsage {
    width: 90%;
    margin: 0 -45%;
  }

  button.glitch,
  #htp_ptx .btn.glitch,
  button.glitch:after {
    max-width: 50vw;
    line-height: 24px;
    font-size: 2vmax;
    padding: 0 15px 0 5%;
  }

  .no-mobile,
  #header #menu {
    display: none;
  }

  .alignright,
  a img.alignright {
    min-width: 45vw;
    margin: -7vw -3vw -10px .5rem;
  }

  .alignleft,
  a img.alignleft {
    min-width: 45vw;
    margin: -7vw -3vw -10px .5rem;
  }

  .htp-presenter-avatar.alignright {
    margin: -7vw -3vw -2rem .5rem;
  }

  .fslightbox-container {
    z-index: 999 !important;
  }

  .htpx_listing .description img {
    margin-top: -4rem;
    margin-bottom: -3rem;
  }

  .page-template-page-ptx-kunst .htpx_listing .description img { margin-top: 0; }

  #wrapper {
    margin-bottom: 18px;
    margin-top: 0px;
  }

  .home .box-event,
  .newsletter .box-event {
    position: relative;
  }

  h1.preview {
    font-size: 1.4rem;
    margin: 0.5em 0;
    text-align: center;
  }

  .ct-preview p {
    margin-bottom: 1.84em;
    padding: 0 10px;
    font-size: 12pt;
  }

  .newsletter h1.preview {
    margin-bottom: 4vh;
  }

  #opencall h2 {
    font-size: 2.3rem;
    white-space: nowrap;
  }

  .date h2 {
    font-size: 80px;
  }

  .cdchip #logo {
    margin-right: 0;
    right: 0;
    margin-top: -10px;
    height: 20vmax;
    width: 20vmax;
  }

  .newsletter .cdchip #logo {
    margin-right: 0;
    right: 0;
    margin-top: 0px;
    height: 20vmax;
    width: 20vmax;
  }

  .cdchip {
    min-height: 50vh;
    margin: 0 auto;
    margin-left: -10vw;
  }

  .page-template-page-preview #htplogosvg {
    right: 0;
  }

  .page-template-page-preview #objdate {
    position: absolute;
    transition: all 3s ease;
    left: 50%;
    margin-left: -50vw;
  }

  .page-template-page-eventtop #article.container {
    margin-top: 140px;
  }

  .page-template-page-newsletter #article.container {
    margin-top: 0;
  }

  .home #objdate,
  .page-template-page-eventtop #objdate {
    margin: -10vh auto -2vh;
    left: 0;
    margin-left: calc(25vw - 50%) !important;
  }

  .box-event #objdate {
    top: 2rem;
    width: 45vmax;
    height: 45vmax;
  }

  .page-template-page-eventtop #htp_pagetitle {
    margin-top: -18vh;
  }

  #content [class*="col-"] {
    padding: 0 23px 23px
  }

  #content .table [class*="col-"] {
    padding: .75rem;
    z-index: 9999 !important;
  }

  .content {
    margin: 0 auto;
  }

  li.tag-list-item { font-size: .9rem !important; margin: 0; }

  #footer span {
    font-size: 9px;
    color: #ffffff;
  }

  .sponsoren li {
    display: inline-block;
    float: left;
    width: 50%;
  }

  .sponsoren img {
    margin-top: 16px;
    margin-bottom: -8px;
  }

  .newsletter label {
    font-size: 10pt;
  }

  .newsletter .required {
    width: 9em;
  }

  .newsletter input[type="text"] {
    width: 100%;
  }

  .newsletter input[type="submit"] {
    margin-right: -15px;
  }

  #htpobjpreload svg {
    margin: 23vh auto;
  }

  p>img[class*="wp-image-"].alignright,
  p>img[class*="wp-image-"].alignleft {
    shape-outside: none;
  }

  /* special mobile menu */
  .pie {
    -webkit-tap-highlight-color: transparent;
    background: #000;
    border-radius: 50%;
    box-shadow: 0 0 4px 5px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    height: 400px;
    left: -200px;
    position: absolute;
    top: -200px;
    width: 400px;
    transform: translateX(-200px) translateY(-200px);
    transition: transform 300ms;
  }

  /*
  .pie-color:hover {
    opacity: 0.85;
  }
  .pie-color:active {
    opacity: 0.7;
  }
  .pie1 {
    clip-path: polygon(200px 200px, 344px 450px, 0 450px);
    transition-delay: 30ms;
  }
  .pie2 {
    clip-path: polygon(200px 200px, 344px 450px, 450px 344px);
    transition-delay: 60ms;
  }
  .pie3 {
    clip-path: polygon(200px 200px, 450px 0, 450px 344px);
    transition-delay: 90ms;
  }
  .pie-color {
    width: 100%;
    height: 100%;
    border-radius: 50%;
  }
  .pie-color1 {
    background: linear-gradient(135deg, #f12711, #f5af19);
    clip-path: polygon(200px 200px, 344px 450px, 0 450px);
  }
  .pie-color2 {
    background: linear-gradient(135deg, #444, #7e84f9);
    clip-path: polygon(200px 200px, 344px 450px, 450px 344px);
  }
  .pie-color3 {
    background: linear-gradient(135deg, #444, #b7e13f);
    clip-path: polygon(200px 200px, 450px 0, 450px 344px);
  }
  .card {
    left: 216px;
    position: absolute;
    top: 300px;
    width: 46px;
  }
  .discount {
    left: 288px;
    position: absolute;
    top: 258px;
    width: 46px;
  }
  .cart {
    left: 324px;
    position: absolute;
    top: 188px;
    width: 46px;
  } */


}

@media only screen and (max-width: 767px) {
 	.no-mobile, .sr-only { display: none; }
	#social { opacity: 0 }
	.active #social {
	    opacity: 1;
	    position: relative;
	    z-index: 1001;
	    top: 74vh;
	}

	.htp-session-meta {
		/*margin-top: -3rem !important;*/
    	display: inline-block !important;
    	width: 100% !important;
    	margin-left: 0 !important;
    	text-align: right;
	}

	.entry-content .htpx_abstract .entry-meta-list.htp_slot { margin-top: 0 !important; padding-right: 0 !important; }

	.entry-meta-list .htp-session-meta { margin-top: 0; }
	.single-htpp .entry-meta-list .htp-gallery-item { margin: 0 auto !important; width:315px; height: 315px; display: block; }
	.single-htpp .floatthumb .htp-gallery-item { margin: 0 auto 1rem !important;}
	
	.slot_contain { margin-bottom: 0 !important; }

	.type-htpp h2 .mbl_title { width: 100% !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; }

	.entry-meta-list p.lang-label { width: 100% !important; }
	.entry-meta-list.htp_slot p { margin: 1rem 0 0 !important; }
	.entry-footer .entry-meta-list.htp_slot { margin-top: 6rem; }

	.page-template-page-ptx-speakers .entry-meta-list.htp_slot { position: relative !important; width: 100% !important}
	.page-template-page-ptx-speakers .entry-meta-list .htp-gallery-item { margin: 1rem auto 0 !important; width: 100% !important; }
	.page-template-page-ptx-speakers .htpx_actors .htp-session-meta { line-height: 2rem; }
	.page-template-page-ptx-speakers .entry-meta-list.htp_slot { background: rgb(var(--c-dblue)); margin-bottom: 50vh !important; }
	.htpx_actors .wp-image-htp { width: 100vw; max-width: 100% !important; }

	.slot_contain .glitch { height: auto; display: contents; }

	.type-htpp h1.entry-title {
	    margin: -5rem 0 1rem !important;
	    max-width: 33rem;
	    padding: 19rem 1.5rem 1rem; /* Keep original padding */
	    height: auto;
	    min-height: 25rem; /* Minimum height */
	    display: flex;
	    align-items: flex-end; /* This anchors to bottom */
	    position: relative;
	    font-size: 1.2rem;
	    border: none;
	}

	/* Create spacing using pseudo-element */
	.type-htpp h1.entry-title::before {
	    content: '';
	    position: absolute;
	    top: 0;
	    left: 0;
	    right: 0;
	    height: 10rem;
	    pointer-events: none;
	}

	h1#program.display-5 { display: none; }
	.table th, .table td { padding: .5rem; width: 60vw; }

    .syncscroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .htp_schedule_table, .font-weight-light, .font-weight-light a { font-size: .9rem !important; }
    .table th.col-space, .table td.col-space { min-width: 5px !important; width: 5px !important; }

    #day-list {
        position: sticky;
        top: 1rem;
        margin-top: 0;
        z-index: 1000;
        background-color: white;
        padding-top: 5px;
        padding-bottom: 5px;
        border-bottom: 1px solid #ddd;
        overflow: hidden;
        z-index: 10;
    }
    .page-template-page-ptx-program a.nav-link.btn { height: 42px; width: 110px; font-size: 1rem !important; line-height: 1.8rem !important; }
	.btn-group {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
    }
    th[scope="row"] {
        height: auto;
        line-height: 1.2;
    }
    thead th {
        font-size: 14px;
        padding: 8px;
    }

  .htp-touchcount #defaultCanvas0 {
    left: -68vw !important;
  }

  #touchcount-total,
  .touchcount-count {
    font-size: 2em;
  }

  .touchcount-count {
    margin-top: -50px;
    margin-left: -130px;
  }

  .touchcount-button {
    margin-right: -7rem !important;
  }

  .single-htpp.polls #article {
    margin-top: 100vh;
  }

  fieldset {
    padding: 0;
  }

  #htp25_hashtag {
    display: none;
  }

  .category-kunstinstallationen .htp-presenter-avatar.alignright {
    margin: 0 -3vw -25px .5rem;
  }

  .htpx_listing li a {
    background-size: auto;
    mask-position: center 10%;
    -webkit-mask-position: center 10%;
    line-height: 1.5rem;
    min-width: 75vw;
    padding-bottom: 1rem;
  }


  .page-template-page-ptx-speakers .htpx_listing li a { min-width: max-content; }
  .page-template-page-ptx-speakers .htp-time-badge { display: inline-block; }

  .htpx_partner li {
    display: inline-block;
    max-width: 100%;
    margin: .3rem 0;
  }

  .type-htpp .entry-meta ul {
    width: 100% !important;
  }

  .submissions {
    padding: .5rem 1rem !important;
    background: #ffffff66;
  }

  .submissions li {
    font-size: .9rem !important;
    width: 100% !important;
    padding: 0 !important;
  }

  .submissions.speakers li {
    padding: 0 !important;
  }


  .page-template-page-ptx-speakers .submissions,
  .page-template-page-ptx-talks .submissions,
  .page-template-page-ptx-kunst .submissions {
    padding: .5rem 1rem !important;
    margin: 0 -.5rem 0 !important;
  }
  #speakers-box { margin-bottom: 32px; }

  #filters {
    margin-bottom: 2rem;
    text-align: center;
  }

  #filters .btn {
    font-size: 1rem !important;
    min-width: inherit !important;
    margin: 0 1rem 1rem 0;
    min-width: 84px !important;
  }

  #filters i.icon {
    top: -12px;
  }

  .btn.htp_none {
    margin-left: -.5rem;
    letter-spacing: inherit !important;
    font-weight: 400 !important;
  }

  #htp_ptx #day-list.nav {
    margin-bottom: -206px !important;
  }

  #htp_ptx #fri td {
    width: 180px;
    min-width: 180px;
  }

  .single-eternal #frame_eternal {
    border-radius: 0;
    height: auto;
    margin: 1rem;
    width: calc(100% - 2rem);
  }

  .single-eternal .abstract {
    margin: -3rem 1.5rem 1rem !important;
  }

  .single-eternal #frame_eternal svg svg {
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
    animation: strokeAnimationSingle 3s ease-in-out;
  }

  .lightbox-close-btn {
    position: fixed;
    z-index: 10000;
    top: auto;
    bottom: 2rem;
    right: 2rem;
    font-size: 1rem !important;
    border: 2px inset rgba(var(--ca-cyan), 1) !important;
    padding: 1rem 2rem !important;
    border-radius: .5rem;
    text-shadow: rgb(var(--ca-cyan)) 2px 0px 9px, rgb(var(--c-white)) 1px 1px 5px !important;
  }

  .lightbox-close-btn:hover {
    background-color: rgba(var(--c-blue), 1) !important;
    border-color: rgba(var(--c-green), 1) !important;
  }

  .lightbox-close-btn::before {
    content: '';
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 0;
    z-index: 99;
    border-radius: 5px;
    box-shadow: -10px -10px 10px #00ffff;
  }

  #htp_foot_slowanim {
    position: fixed;
    z-index: -1;
    top: 100vh;
    left: auto;
    right: 0;
    height: 200vh;
  }

  #htp_foot_slowanim svg {
    position: absolute;
    /*height: 150vh; */
    top: -5vh;
    left: -5vw;
    right: auto;
  }

  .htp25_rand {
    animation: htp25_anim_mob 420s linear infinite;
    transform-origin: center;
  }

  #htp2k24_obj1,
  #htp2k24_obj2,
  #htp2k24_obj3,
  #htp2k24_obj4,
  #htp2k24_obj5,
  #htp2k24_obj6,
  #htp2k24_obj7,
  #htp2k24_obj8,
  #htp2k24_obj9,
  #htp2k24_obj10,
  #htp2k24_obj11,
  #htp2k24_obj12,
  #htp_foot_anim svg {
    width: 150vw;
    height: 150vh;
  }

  .htp25_rand,
  #htp_foot_anim path {
    transform-origin: center;
    position: absolute;
    top: 50%;
    left: -50%;
  }

  /* Ensure the overlay covers the entire screen */



  #search-overlay {
    display: none;
    align-items: flex-start;
    /* Align to the top */
    background: rgba(var(--c-white),.42);
    width: 100vw;
    height: calc(100vh - 16px);
    position: absolute;
    left: 0;
    top: 16px;
  }

  /* Fullscreen search form container */
  #search-form-container {
    width: calc(100% - 8px);
    max-width: none;
    height: calc(100vh - 55px);
    padding: 5rem 1rem 1rem;
    box-sizing: border-box;
    margin: 2rem 4px;
    transform: none;
  }

  /* Fullscreen suggestions container */
  #htpp-search-suggestions {
    position: relative !important;
    width: 100%;
    max-height: calc(100vh - 60px);
    /* Use available screen height minus some space */
    overflow-y: auto;
    margin: 10px 0;
    /* Space between form and suggestions */
    overflow: hidden;
  }

  /* Suggestion item */
  .htpp-suggestion {
    padding: 15px;
    font-size: 16px;
    /* Slightly larger text for better readability on mobile */
    cursor: pointer;
    text-decoration: none;
    color: #333;
    display: block;
  }

  .htpp-suggestion:hover,
  .htpp-suggestion:focus {
    background-color: #f0f0f0;
  }

  /* Adjust the close button for better visibility */
  #close-search {
    top: 10px;
    right: 10px;
    font-size: 25px;
  }

  /* Style the input to be more prominent on mobile */
  #htpp-search-input {
    width: 100%;
    padding: 15px;
  }

  #search-icon {
    display: none;
  }

  #search-icon-mobile {
    position: absolute;
    top: 2rem;
    left: 1rem;
    font-size: 24px;
    cursor: pointer;
    z-index: 10000;
    color: #333;
    width: 50px;
    height: 50px;
  }

  #search-icon-mobile svg {
    width: 2rem;
  }

  #anim_bg {
    margin-bottom: -100vh !important;
  }

  .entry-content h2::before,
  .entry-summary h2::before,
  .entry-content h3::before,
  .entry-summary h3::before,
  .entry-content h4::before,
  .entry-summary h4::before,
  #htp_ptx h4::before,
  #htp_ptx h2::before,
  .entry-content h5::before,
  .entry-summary h5::before,
  .htp_conf_box h5::before,
  .entry-content h2::after,
  .entry-summary h2::after,
  .entry-content h3::after,
  .entry-summary h3::after,
  .entry-content h4::after,
  .entry-summary h4::after,
  #htp_ptx h2::after,
  .entry-content h5::after,
  .entry-summary h5::after {
    display: none;
  }


  .alignright,
  a img.alignright {
    margin: 8px 0 8px 8px;
  }

  .alignleft,
  a img.alignleft {
    margin: 8px 8px 8px 0;
  }

  .aligncenter {
    margin: 8px auto 8px auto;
  }

  .entry-content { margin: 0 0 1rem !important; }

  .entry-content h4 {
    font-size: 1rem;
  }

  .entry-content h2,
  .entry-summary h2,
  .entry-content h3,
  .entry-summary h3,
  .entry-content h4,
  .entry-summary h4,
  .entry-content h5,
  .entry-summary h5 {
    padding: 0;
    margin: 0 0 .5rem;
  }

  .htpx_abstract h2 { display: none; }

  .entry-content p,
  .entry-summary p {
    padding: 0 1rem 1rem !important;
  }

  .entry-content blockquote p,
  .entry-summary blockquote p {
    padding: 0 1em;
  }

  .entry-footer {
    text-align: center;
    border-top: 1px dashed #ffffff;
    padding: 4vh 0;
    margin: 1.5rem 0;
  }

  .single .preload article .header,
  .page .preload article .header {}

  .single #article .header,
  .page #article .header {
    height: auto;
    padding-top: 0;
  }

  .home article .header {
    height: 35vh;
  }

  .page-template-page-eventtop #article header.header {
    margin-bottom: -220px;
  }

  #site-description {
    display: none;
  }

  #article {
    padding-bottom: 5vh;
  }

  #article.container {
    padding: 0 0 1rem;
  }

  .page-template-page-ptx-program #article.container {
    padding: 1rem 0;
    margin-top: 0;
  }
  .page-template .entry-meta.headimg, .page-template-default .entry-meta.headimg { }
  .page-template-page-ptx-program .entry-meta, .page-template .entry-meta.headimg, .page-template-default .entry-meta.headimg {
    	height: 41vh;
    	background-size: contain !important; 
    	background-position: center 11rem !important;
	}

  .page-template-page-ptx-program #day-list .btn {
    padding: 0 .6rem .3rem;
  }

  .htpx_listing p {
    padding: 0 0 1rem !important;
  }

  .htpx_listing>a {
    padding: .5rem 1rem !important;
  }

  #htp_ptx .hentry {
    margin: 0;
  }

  .submissions .htpx_program {
    font-size: .8rem;
  }

  .htpx_talks,
  .htpx_talkslots,
  .htpx_artists {
    margin: .5rem 0;
    font-size: .8rem;
  }

  .type-htpp .entry-meta {
    margin: 1rem 0;
    font-size: 1rem;
    line-height: 1.6rem;
    padding: 0;
    height: 80vh !important;
    background-position: center 30vh !important;
    /* background-size: auto !important; */
  }

  .type-htpp .entry-meta h3 {
    padding-left: 1rem;
    margin: 0;
    display: block;
  }

  .type-htpp span.htpx_program {
    width: auto;
    font-size: .8rem;
  }

  li.htpx_workshops {
    padding-top: 0;
    margin-top: 2rem !important;
  }

  ul.htpx_listing>li {
    margin: 1rem .5rem !important;
    padding: .5rem;
    font-size: .8rem;
  }

  .talk-box,
  .htpx_abstract {
    margin: 1rem 0;
  }

  #defaultCanvas0 {
    top: -63vh;
    position: fixed;
  }

  #htp_pagetitle {
    margin-bottom: 2vh;
    margin-top: 0;
  }

  #mobMenu {
    height: 100vh;
    width: 80%;
    position: relative;
  }

  #mobMenu .menu-main-menu-container {
    background-color: var(--c-footer);
  }

  #mobMenu .menu-main-menu-container a {
    color: #ffffff;
  }

  #mobMenu {
    height: 1px;
    width: 1px;
    position: relative;
    display: none;
  }

  body.active #mobMenu {
    display: block;
  }

  #mobMenuNav {
    transition: all 0.23s ease-in-out;
    opacity: 0;
    bottom: 2rem;
    margin-top: 100vh;
  }

  body.active #mobMenuNav {
    opacity: 1;
    height: 93vh;
    width: calc(100vw - 1rem);
    padding: 0 2em;
    margin: 7vh auto 0;
  }

  #mobMenuNav label {
    display: inline-block;
    width: 70%;
  }

  #mobMenuNav input.search-submit {
    background-color: rgba(var(--ca-cyan), 100%);
    border-color: #ffffff;
  }

  #mobMenuNav.mainnav-mobile a:hover,
  #mobMenuNav.mainnav-mobile a:focus,
  #mobMenuNav.mainnav-mobile li.current_page_item a {
    background: none;
  }

  #mobMenuNav.mainnav-mobile li {
    font-size: 1.2rem;
    line-height: 1.6;
    margin: 0 .1rem;
    display: block;
    padding: .3rem 0;
  }

  #mobMenuNav.mainnav-mobile li:hover {
    height: inherit;
    margin: 0;
  }

  #mobMenuNav.mainnav-mobile a {
    padding: 0;
    color: rgb(var(--c-white)) !important;
    text-shadow: rgb(var(--ca-pink)) 2px 0px 9px, rgb(var(--c-dblue)) 1px 1px 5px !important;
    font-size: 1.3rem;
  }

  #mobMenuNav.mainnav-mobile a:hover,
  #mobMenuNav.mainnav-mobile a:focus,
  #mobMenuNav.mainnav-mobile li.current_page_item>a {
    font-weight: 700;
  }

  #mobMenuNav .search {
    left: 0;
    bottom: -4rem;
    width: 100%;
    height: 4rem;
    position: absolute;
    transition: all 0.42s;
    opacity: 0;
    border-top: 1px solid rgb(var(--ca-pink));
  }

  body.active #mobMenuNav .search {
    left: 0;
    bottom: 0;
    opacity: 1;
    background-image: linear-gradient(to right, transparent, rgba(var(--ca-cyan), 0.3), rgb(var(--ca-cyan)), rgba(var(--ca-cyan), 0.3), transparent);
    border-top: 1px solid rgb(var(--c-red));
  }

  #mobMenuNav .search form {
    margin-top: 0.75rem;
  }

  #mobEvent #objdate {
    display: none;
    right: 0;
    transition: all 3s ease;
  }

  body.active .ct-preview #objdate {
    width: 70%;
    top: 0.5em;
    position: fixed;
    left: 50%;
    margin-left: -126px;
  }

  body.active #mobEvent #objdate {
    position: fixed;
    display: inline-block;
    width: 80vmin;
    height: 80vmin;
    top: 120vmin;
    left: 10vw;
  }

  #optOutUsage h2 {
    display: block;
    margin-top: 0;
    font-size: 1rem;
  }

  #optOutUsage a {
    font-size: 1rem !important;
  }

  #optOutUsage .btn {
    white-space: nowrap;
    padding-top: 0;
    padding-bottom: 14px !important;
    margin: auto !important;
    max-width: 50vw;

  }

  #optOutUsage .btnline {
    display: block;
    text-align: center;
  }

  #optOutUsage li {
    margin: 0 0 .5rem;
    height: 42px;
    vertical-align: middle;
  }


  #wrapper {
    position: absolute;
  }

  .main-navigation ul ul {
    position: relative;
    float: inherit;
  }

  .main-navigation ul ul ul {
    left: 100%;
    top: 0;
  }

  .main-navigation ul ul a {
    width: 100%;
  }

  #menu-main-menu-1 {
    display: inline-block;
    width: 100%;
    margin-top: 3vh;
  }

  .sub-menu {
    position: static;
    /* Position the sub-menu relative to the flow of the document */
    opacity: 1;
    visibility: visible;
    box-shadow: none;
    transition: none;
    margin: -20px 0 2rem !important;
  }

  /* Show the sub-menu when the parent is clicked */
  .current-menu-item .sub_menu {}

  .menu-item.active>.sub-menu {
    display: block;
    border-bottom: 1px solid rgb(var(--c-red));
  }

  .single-htpp .sub-menu {
    display: block;
  }


  /* Style for the parent menu items on mobile */
  .menu-item>a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    color: #333;
  }

  /* Ensure the sub-menu items are styled similarly to the main items */
  .sub-menu li a {
    padding-left: 30px;
    /* Indent sub-menu items for clarity */
  }

  /* Optional: Add a "burger" menu icon or adjust navigation */
  .menu-toggle {
    display: block;
    cursor: pointer;
    padding: 10px 15px;
    background-color: #333;
    color: #fff;
    text-align: right;
  }

  .menu-toggle:after {
    content: "\2630";
    /* Unicode for burger menu icon */
    font-size: 24px;
  }

  .nav-menu {
    display: none;
    /* Hide the menu by default */
  }

  .menu-open .nav-menu {
    display: block;
    /* Show the menu when toggled */
  }


  h1.htp_festival {
    margin-top: 40vh;
    font-size: 2rem;
    text-shadow: 1px 1px #ffffff;
  }

  #htp_ptx h1 {
    font-size: 3.5vmax;
    margin-bottom: 3rem;
    margin-top: 4rem !important;
  }

  .cdchip img {
    width: 100vw;
  }

  .newsletter #htplogosvg {
    top: 0px;
    right: 0px;
  }

  .page-template-default #ObjHTP25 {
    z-index: -1;
  }

  .header noscript img {
    margin-left: -25vw;
  }

  .page-template-page-ptx-location #defaultCanvas0 {
    top: -10vh;
    left: -25vw;
  }

  #content {
    left: 0;
    margin: 0 .2rem;
  }


  .page-template-page-eventtop #objdate {
    left: 50%;
    margin-left: -155px;
    width: 50vw;
  }

  #ObjHTP25 {
    left: 0;
    top: 0;
  }

  body.active h1.htp_festival,
  body.active .right-contents {
    display: none;
  }


  .anim404 {
    position: relative;
    width: 90vw;
    margin-left: -45vw;
    margin-top: 0vh;
  }

  a.post-edit-link {
    display: none;
  }

  span.entry-meta {
    float: right;
  }
}


/* iPad mini portrait */
@media only screen and (min-width: 766px) and (min-height: 1024px) and (orientation: portrait) {
  #objectHolder {
    top: -285px;
    left: 40vw;
  }
}

/* iPad Air portrait */
@media only screen and (min-width: 820px) and (min-height: 1180px) and (orientation: portrait) {
  #ObjHTP25 {
    left: 82vw;
    top: -30vh;
  }

  .objectHeader #objdate {
    margin-top: -140px;
  }

  .container,
  .container-sm,
  .container-md {
    max-width: 100%;
  }
}

/* iPad Air portrait, higher resolution */
@media only screen and (min-width: 1024px) and (min-height: 1366px) and (orientation: portrait) {
  .home #ObjHTP25 {
    left: 82vw;
    top: -38vh;
  }

  #ObjHTP25 {
    left: 75vw !important;
    top: -38vh;
  }

  .objectHeader #objdate {
    margin-top: -165px;
  }

  .container,
  .container-sm,
  .container-md {
    max-width: 100%;
  }
}

/* Targeting slightly larger screens */
@media only screen and (min-width: 599px) and (max-width: 1023px) and (orientation: portrait) {

  .page-template-page-eventtop #objdate,
  .page-template-page-newsletter #objdate {
    margin-top: -11vh;
    margin-left: -5vw;
    width: 50vw;
  }

  .page-template-page-eventtop #article.container,
  .page-template-page-newsletter #article.container {
    margin-top: 0vh;
  }
}

@media only screen and (min-width: 599px) and (max-width: 1023px) and (min-height: 1200px) and (orientation: portrait) {

  .page-template-page-eventtop #objdate,
  .page-template-page-newsletter #objdate {
    margin-top: -3vh !important;
  }
}

/* Tablet landscape mode */
@media only screen and (min-width: 768px) and (max-width: 820px) {
  #header #htplogosvg {
    top: 0px;
    right: 0px;
  }

  .page article .header {
    height: 27vh;
  }

  h1.htp_festival {
    margin-top: 100px;
    font-size: 1.4rem;
  }
}


@media only screen and (min-width: 980px) and (max-width: 1200px) and (orientation: landscape) {
  #site-description {
    padding-right: 0;
  }


  #header .main-navigation a {
    padding: 1rem 0.5rem;
  }

  .page-template-page-eventtop #objdate {
    width: 50vw;
    margin-top: -8vh;
  }

  h1.htp_festival {
    font-size: 1.6rem;
  }

  #objectHolder {
    width: 200%;
  }

  #ObjHTP25 {
    left: calc(50% - 700px);
    top: -6vh;
  }

  .page-template-default #ObjHTP25 {
    left: 37vw;
  }

  .page-template-page-eventtop #objdate,
  .page-template-page-newsletter #objdate {
    margin-top: -85px;
  }
}

@media only screen and (min-width: 980px) and (max-width: 1200px) and (orientation: portrait) {
  .page-template-page-eventtop #objdate {
    margin-top: 3vh;
  }
}

@media only screen and (min-width: 800px) and (max-width: 1024px) and (orientation: portrait) {

  .page-template-page-eventtop #article.container,
  .page-template-page-newsletter #article.container {
    margin-top: 5vh !important;
  }

  .page-template-page-eventtop #objdate,
  .page-template-page-newsletter #objdate {
    margin-top: 0 !important;
  }

  .page-template-page-eventtop h1.htp_festival,
  .home h1.htp_festival {
    margin-top: 13vh !important;
    font-size: 2rem !important;
  }

  #header .main-navigation a {
    font-size: 14px;
  }

  #ObjHTP25 {
    top: -7vh;
    left: calc(50% - 550px);
  }

  article .header {
    height: 26vh;
  }

  .single-htpp .htpx_abstract p {
    max-width: 100%;
  }
}

@media only screen and (min-width: 980px) {
  .col-laps {
    width: 43%;
  }



  #wrapper {
    margin-bottom: 0;
  }

  .home .box-event,
  .newsletter .box-event {
    position: fixed;
  }

  .newsletter input[type="submit"] {
    margin-left: 16.4em;
  }

  .page-template-page-preview #htplogosvg {
    right: 53%;
  }

  .page-template-page-preview #objdate {
    max-width: 500px;
    max-height: 500px;
  }

  #branding {
    margin-top: 20px;
  }

  #site-description {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1000;
    text-align: left;
  }

  body.active.home .box-event {
    position: relative;
  }

  body.active #mobEvent #objdate {
    width: 40vmin;
    height: 40vmin;
    margin-left: -20vmin;
  }
}

/*
  @media only screen and (min-width: 800px) and (min-height: 1100px) {
    #objectHolder { min-height: 50vh !important; }
    #article.container { margin-top: 50vh; }
    .page-template-page-eventtop #objdate { margin-left: 10vw !important; margin-top: -44vh; }
    h1.htp_festival { margin-top: 18vh; text-align: center; }

    .home  #ObjHTP25, .page-template-page-eventtop #ObjHTP25 { top: -8vh; left: -27vw; }
    #objdate { width: 200vw !important; height: 80vh !important; margin-bottom: -20vh; margin-top: -16vh !important; margin-left: -55vw !important;}
    .page-template-page-newsletter #objdate { margin-top: -41vh; margin-left: -9vw; }
    h1.htp_festival { font-size: 4rem; margin-top: 9vh; }
    .home #article.container, .page-template-page-eventtop #article.container { margin-top: 30vh; }

  } 
  */
@media only screen and (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media only screen and (min-width: 600px) and (max-width: 900px) {
  #header .container {
    max-width: 100%;
  }

  .page-template-page-eventtop #objdate {
    width: 30vw;
    margin-top: -54vh;
    margin-left: -2vw;
  }

  h1.htp_festival {
    font-size: 2rem;
    margin-top: 36vh;
    position: relative;
    left: -5vw;
  }
}

@media only screen and (min-width: 599px) and (max-width: 979px) {

  #objectHolder {
    width: 150%;
    position: absolute;
    top: 0;
    left: -10vw;
  }

  #ObjHTP25 {
    left: -14vw;
    top: -7vh;
  }

  .page-template-page-eventtop #objdate,
  .page-template-page-newsletter #objdate {
    margin-top: -9vh;
    margin-left: -12vw;
  }

  .home #article.container {
    margin-top: -10vh;
  }

  h1.htp_festival {
    font-size: 1.3rem;
    margin-top: -18vh;
    text-align: center;
  }

  #wrapper {
    margin-bottom: calc(0 - var(--spacer-top));
  }

  .page-template-page-preview #htplogosvg {
    right: 53%;
  }

  body.active .page-template-page-preview #htplogosvg {
    right: 0;
  }

  .newsletter .col-sm-12 {
    width: 100%;
  }

  #footer .container {
    max-width: 100%;
  }

  #footer .col-sm-12 {
    width: 50%;
  }

  #footer span {
    line-height: 64px;
    font-size: 0.7rem;
  }

  .home .box-event,
  .newsletter .box-event {
    position: relative;
  }

  .page-template-page-preview #objdate {
    left: 2vmax;
  }

  #header {
    height: var(--spacer-top);
  }

  #header .main-navigation a {
    font-size: smaller;
    padding: 1rem 0.5rem;
  }

  #opencall h2 {
    font-size: 2rem;
  }

  h1.preview {
    font-size: 1.1rem;
    margin-top: 5rem;
  }

  .tla {
    left: 5em;
  }

  .tra {
    right: 5em;
  }

  .bla {
    left: 5em;
  }

  .bra {
    right: 5em;
  }
}

@media only screen and (orientation: landscape) and (max-width: 640px) {
  #mobile_menu {
    display: block;
    position: fixed;
    z-index: 501;
    width: 100%;
    height: 60px;
  }

  .mobile-menu {
    -webkit-tap-highlight-color: transparent;
    background: transparent;
    border-radius: 50%;
    /* box-shadow: 0 0 4px 5px rgba(0, 0, 0, 0.2); */
    cursor: pointer;
    height: 150px;
    left: -80px;
    position: fixed;
    top: -80px;
    width: 150px;
  }

  .hamburger {
    cursor: pointer;
    height: 46px;
    left: 58%;
    position: relative;
    top: 58%;
    width: 46px;
  }

  #header {
    height: 45px;
  }

  #header .container {
    max-width: 100%;
  }

  h1.preview {
    margin: 0.5rem 0 2rem;
  }

  #opencall h2 {
    font-size: 2rem;
  }

  .mainnav-mobile li {
    text-align: left;
  }

  body.active #mobMenuNav {
    padding: 2rem 0;
    margin: 1rem auto;
  }

  body.active #mobEvent #objdate {
    right: 3vmin;
    left: auto;
  }

  .home .box-event,
  .newsletter .box-event {
    position: relative;
    height: 60vmin;
  }

  .home .box-event #objdate {
    max-height: 80vmin;
    max-width: 80vmin;
    max-height: 90vmin;
    max-width: 90vmin;
    right: 50%;
  }

  #footer .container {
    max-width: 100%;
  }

  #footer span {
    font-size: 0.7rem;
  }
}

@media only screen and (min-width: 768px) {

	.single-htpp .floatthumb .htp-gallery-item { display: inline-block; float: right; margin: 0 0 1rem 1rem;  }


  #htp_ptx .table th.col-title {
    width: 85px;
  }

  #search-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle, rgba(0, 0, 0, 0.93) 0%, #00ffff66 100%);
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: 9999;

  }

  /* Container for the search form */
  #search-form-container {
    border-radius: 1rem 5px;
    position: relative;
    top: 50%;
    /* Position in the middle of the page */
    left: 50%;
    /* Position in the middle of the page */
    transform: translate(-50%, -50%);
    /* Offset by half the width and height */
    background: #fff;
    padding: 20px;
    max-width: 600px;
    width: 80%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    box-sizing: border-box;
  }

  #htpp-search-suggestions {
    position: absolute;
    left: 1.2rem;
    right: 1.2rem;
    background-color: #fff;
    max-height: 30vh;
    /* Optional: Limit the height if there are many suggestions */
    z-index: 1000;
    box-sizing: border-box;
    padding: 0 1rem;
    margin: -2px 0 0;
  }

  #htpp-search-suggestions a {
    text-align: left;
    white-space: break-spaces !important;
    height: auto !important;
    display: block;
    border-bottom: 1px solid rgba(var(--c-footer), .42) !important;
    padding: .5rem;
    margin: .5rem 0;
  }

  .htpp-suggestion:focus-visible,
  .htpp-suggestion:hover {
    color: rgb(var(--c-red));
    outline-color: rgb(var(--ca-cyan));
    background: rgba(var(--c-footer), .1);
  }

  /* Close button */
  #close-search {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 30px;
    color: #fff;
    cursor: pointer;
  }

  /* Search icon styles */
  #search-icon {
    position: fixed;
    top: 0px;
    right: 0;
    font-size: 24px;
    cursor: pointer;
    z-index: 10000;
    color: rgb(var(--c-dblue));
    width: 50px;
    height: 50px;
  }

  #search-icon svg {
    margin: 0 0 0 .5rem;
    height: calc(1.6rem + 0.390625vw);
    padding: .8rem 1rem 0 0;
    width: 50px;
  }

  #search-icon svg:hover {
    fill: rgb(var(--c-red));
  }

  .container,
  .container-sm,
  .container-md {
    max-width: 720px;
  }

  .touchcount-count {
    margin-top: -50px;
    margin-left: -130px;
  }

  .type-htpp .entry-meta {
    padding: 0 1rem 0;
    margin: 0 1rem 1rem;
    mask-image: url(img/htpx/2024/HTP_logo.svg);
    mask-size: cover;
    mask-repeat: no-repeat;
    mask-position: center 13%;
    -webkit-mask-image: url(img/htpx/2024/HTP_logo.svg);
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center 13%;
  }

  #htp_foot_anim {
    position: fixed;
    top: 0;
    width: 120vw;
    height: 100vh;
    left: -20vw;
    z-index: -1;
    opacity: 1;
  }

  .page-template-page-ptx-speakers .submissions,
  .page-template-page-ptx-talks .submissions,
  .page-template-page-ptx-kunst .submissions {
    margin: 1rem -1rem -1rem !important;
    padding: 1rem !important;
  }
}

@media only screen and (min-width: 992px) {

  .container,
  .container-sm,
  .container-md,
  .container-lg {
    max-width: 960px;
  }
}

@media only screen and (min-width: 1200px) {
  #site-description {
    padding-right: 0;
  }

  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl {
    max-width: 1140px;
  }
}

@media only screen and (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }

  #objdate {
    position: absolute;
    margin-top: -11vh !important;
    margin-left: -5vw !important;
    width: 140%;
    height: 140%;
  }

  #ObjHTP25 {
    left: 0;
  }

  .page-template-page-eventtop #ObjHTP25,
  .page-template-page-newsletter #ObjHTP25 {
    left: -25vw !important;
  }

  /* .page-template-page-newsletter #objdate { margin-top: -27vh !important; margin-left: -18vw !important; } */
  .page-template-default #ObjHTP25 {
    left: auto;
    right: -91vw;
    top: -23vh;
  }

  .page-template-page-htpx_partner #ObjHTP25 {
    left: auto;
    right: -120vw;
    top: -23vh;
  }

  #map {
    height: 80vh;
    left: -3vw;
    top: -16vh;
  }

  #defaultCanvas0 {
    top: -230px !important;
    left: -23vw !important;
  }

  .newsletter #defaultCanvas0 {
    top: -8vh !important;
    left: 9vw !important;
  }
}

@media only screen and (min-width: 1201px) and (max-width: 2500px) {

  .page-template-page-newsletter #objdate,
  .page-template-page-eventtop #objdate {
    margin-top: -140px !important;
    margin-left: 0;
  }

  /* margin-top: -17vh !important;  */
  h1.htp_festival {
    font-size: 2.8rem;
    margin-top: 150px;
  }

  /* 11vh  */
}


/* Ultra-wide screens */
@media only screen and (min-width: 2500px) {
  .page-template-page-eventtop #ObjHTP25 {
    top: -8vh;
  }

  #objdate {
    width: 200vw !important;
    height: 80vh !important;
    margin-bottom: -20vh;
    margin-top: -16vh !important;
    margin-left: -12vw !important;
  }

  .page-template-page-newsletter #objdate {
    margin-top: -41vh;
    margin-left: -9vw;
  }

  h1.htp_festival {
    font-size: 4rem;
    margin-top: 9vh;
  }





}

@media only screen and (min-width: 320px) and (height: 568px) and (orientation: portrait) {

  /* SE  */
  .home #ObjHTP25 {
    top: -85vh !important;
    position: fixed;
  }

  /* #ObjHTP25 { top: -110vh !important; } */
  #objdate {
    margin-top: -150px !important;
    margin-left: calc(19vw - 50%) !important;
  }

  .home #htp_pagetitle,
  .page-template-page-eventtop #htp_pagetitle {
    margin-top: -105px;
  }

  .home h1.htp_festival,
  .page-template-page-eventtop h1.htp_festival {
    margin-top: -25vh;
  }
}