@import url('theater2017.css');

html, body {
 font-size: 16px;
}
body {
  color: var(--main-color);
  font-family: var(--main-font);
}
#main, #header {
	background-color: var(--color-white);
}
h1 a, h2 a, h3 a, h4 a, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h1 a:active, h2 a:active, h3 a:active, h4 a:active {
  color: var(--highlight);
  text-decoration: none;
}

h1, h2, h3, h4, a.eloadascim, ul.musor .idopont.nap, .bemutatok td .eloadas .cim, article .lead, .cikklista h2 a {
  font-weight: 600;
}

h1.internaltitle {
	font-size: 2em;
	text-transform: uppercase;
	margin: 2em 0 1em;
	border-bottom: 1px solid var(--color-verylightgrey);
	padding-bottom: 2px;
	padding-left: .5em;
}

article.static-page > h1 {
	display: none;
}

.region img {
	max-width: 100%;
}

#headerwrapper {
  background: none;
  border-bottom: 1px solid var(--color-black);
}
#header {
	display: flex;
	flex-direction: row;
	align-items: center;
}
#header ul.menutype-mainmenu.sm li:first-child {
  display: none;
}

#header .logo {
  margin: 1em 2em 1em 0;
}
.logo a {
	display: block;
	width: 180px;
	height: 100px;
	background-image: url('/images/partners/jokai/logo-2025.svg');
	background-size: contain;
	background-repeat: no-repeat;
	margin: 0 1em;
}
#footer .logo a {
	background-image: url('/images/partners/jokai/logo-2025-inverse.svg');
	margin: 0 1em 1em 0;
	width: 150px;
	height: 80px;
}
#footer .logo.munkacsynegyed {
	text-align: right;
}
#footer .logo.munkacsynegyed a {
	background-image: url('/images/partners/jokai/munkacsy-negyed-inverse.svg');
	width: 280px;
	display: inline-block;
}
#footer h4 {
	text-transform: uppercase;
	font-size: 1em;
	margin-bottom: 1.5em;
}
#footer .menu {
	list-style: none;
	margin: 0;
	padding: 0;
}
#footer .menu li {
	margin-bottom: 1rem;
}


.fomenu ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	justify-content: flex-start;
}*/
.fomenu ul li {
  padding: 0;
  margin: 0;
  /*width: 190px;*/
  background-color: var(--color-menubackground);
  border-top: var(--menu-top-border-width) solid var(--menu-top-border-color);
}
.fomenu > ul > li {
	position: relative;
	padding: 2px 0px;
}
/*
.fomenu ul.menu > li:first-child  {
  border-top: 0;
}*/
.fomenu ul li a, .fomenu ul li span {
  color: #000;
  text-transform: none;
  padding: 4px 7px;
  display: block;
  font-size: 1em;
}

.fomenu ul li span {
  color: #666;
}
.fomenu ul li ul li a, .fomenu ul li ul li span {
  padding-left: 5px;
}
.fomenu ul li ul {
	display: none;
	position: absolute;
	background-color: var(--color-menubackground);
	list-style: none;
	margin: 0x;
	padding: 0;
	/* border-width: 0 1px 1px 0; */
	/* border-color: var(--color-black); */
	/* border-style: solid; */
	z-index: 10;
	border-right: 0;
	box-sizing: border-box;
	min-width: 100%;
	top: 100%;
	left: 0;
}
.fomenu ul li:hover ul, .fomenu ul li.is-open ul {
  display: block;
}
.fomenu ul li.actual {
  background: var(--color-menuhoverbackground);
}
.fomenu ul li.actual > a, .fomenu ul li.actual > .menu-item-wrapper  > a {
  font-weight: 600;
}
.fomenu ul li.actual:hover {
	background-color: var(--color-menubackground);
}
/*
.fomenu ul li.actual ul {
  display: block;
}
*/
.fomenu ul li.actual > a, .fomenu ul li:hover > a, .fomenu ul li:hover > .menu-item-wrapper > a {
  color: var(--brand-color);
}
.fomenu .submenu.menulevel2 {
	display: none;
}


.responsive-menu-container {
	padding: 0;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	position: relative;
	width: 100%;
}

.menu.menutype-mainmenu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: nowrap; 
    /*overflow: hidden;*/
    justify-content: space-between;
    gap: 2px;
}
.menu.menutype-mainmenu > li:first-child {
	display: none;
}
.menu.menutype-mainmenu li {
	white-space: nowrap;
	border-bottom: 1px solid transparent;
	text-align: var(--menu-top-text-align);
	flex: 1 1 0;
}
.menu.menutype-mainmenu li:hover {
    border-bottom-color: var(--menu-hover-bottom-border-color);
    border-bottom-width: var(--menu-hover-bottom-border-width);
}
.menu.menutype-mainmenu .submenu li {
    text-align: left;
    padding: 0;
}

.menu.menutype-mainmenu a {
	display: block;
	padding: 8px 5px;
	text-decoration: none;
	color: var(--color-black);
	margin-right: 0;
	transition: background-color 0.3s ease;
	font-size: 1.3em;
	font-weight: 400;
}
.menu.menutype-mainmenu .menu-item-wrapper a {
	flex: 1 1 0;
}

/*
.menu.menutype-mainmenu a:hover {
    background-color: var(--color-grey);
}*/

/* More menu styles */
.more-menu-wrapper {
	position: relative;
	margin-left: 0px;
	padding: 9px 1em;
	background: var(--color-menubackground);
	border-top: var(--menu-border-top-width) solid var(--menu-border-top-color);
	margin-left: 2px;
}

.more-toggle {
	background-color: transparent;
	color: white;
	border: none;
	padding: 8px;
	cursor: pointer;
	font-size: 1em;
	display: none;
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path d="M352 128C352 110.3 337.7 96 320 96C302.3 96 288 110.3 288 128L288 288L128 288C110.3 288 96 302.3 96 320C96 337.7 110.3 352 128 352L288 352L288 512C288 529.7 302.3 544 320 544C337.7 544 352 529.7 352 512L352 352L512 352C529.7 352 544 337.7 544 320C544 302.3 529.7 288 512 288L352 288L352 128z"/></svg>');
	width: 1.2em;
	height: 1.2em;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
/*
.more-toggle:hover {
    background-color: var(--color-grey);
}*/

.fomenu ul.more-items-list {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: calc(100% + 5px); /* Position below the toggle button */
    right: 0;
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    min-width: 150px;
    z-index: 1000;
    display: none; /* Hidden by default */
    flex-direction: column; /* Stack items vertically */
}

.fomenu ul.more-items-list.visible {
    display: flex; /* Show when 'visible' class is added by JS */
}

.fomenu .more-items-list li {
    width: 100%; /* Ensure each dropdown item takes full width */
    padding: 5px 0;
}

.more-items-list a {
    display: block;
    padding: 10px 20px;
    text-decoration: none;
    color: var(--color-black);
    transition: background-color 0.3s ease;
    /* border-bottom: 1px solid #555; /* Separator for dropdown items */
    white-space: nowrap;
    font-size: 1em;
    font-weight: 600;
}

.more-items-list li:last-child a {
    border-bottom: none; /* No border for the last item */
}

.menu-item-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav-link {
  flex-grow: 1; /* Fills space so text is easily clickable */
  padding: 0.75rem 1.25rem;
  color: #cbd5e1;
  text-decoration: none;
}
.menu li .menu-item-wrapper button {
	border: 0;
    background-color: transparent;
    display: none;
}
.fomenu ul.more-items-list .submenu-toggle {
    display: none;
}
.fomenu ul.more-items-list li ul {
    display: block;
    position: static;
}

@media (pointer: coarse) and (hover: none) {
.submenu-toggle {
  background: transparent;
  border: none;
  color: #cbd5e1;
  padding: 0rem 1.25rem; /* Large touch target for finger taps */
  cursor: pointer;
}
.menu li .menu-item-wrapper button {
	display: block;
}
.arrow {
  display: inline-block;
  transition: transform 0.2s ease;
  transform: scale(2);
}

/* Rotate arrow when open */
.has-submenu.is-open .arrow {
  transform: rotate(90deg) scale(2);
}


/* Show submenu when active */
.has-submenu.is-open .submenu {
  display: block;
}
}





.menu.menutype-mainmenu li a {
	font-size: .9em;
	font-weight: 600;
}
.menu.menutype-mainmenu > li:not(:last-child) > a::after {
	content: "/";
	margin-left: 1em;
}
#footer #socialmenu {
	text-align: center;
}
#footer a.sociallogo {
	color: transparent;
	min-width: 50px;
	aspect-ratio: 1;
}

h3#current-month {
	font-size: 1em;
	margin-bottom: 0;
	flex-grow: 1;
	padding: 0 1em;
}
table.calendar-month.oneline {
	display: block;
	max-height: unset;
}
table.calendar-month.oneline tbody {
	display: block;
}
table.calendar-month.oneline tr {
	display: flex;
	justify-content: space-between;
}
table.calendar-month.oneline .other-month {
	display: none;
}
table.calendar-month.oneline td {
	padding: 0;
	width: 2em;
	height: 2em;
	display: flex;
	justify-content: center;
	align-items: center;
}
table.calendar-month.oneline td.clickable {
	cursor: pointer;
}
table.calendar-month.oneline td.hasEvent {
	border-radius: 50%;
	background-color: var(--brand-color);
	border :none;
	color: var(--color-offwhite);
}
table.calendar-month.oneline td span {
	height: .85em;
	line-height: .75em;
}
#naptar .prev-month, #naptar .next-month {
	width: 15px;
	height: 20px;
	margin: 0;
	float: none;
}
#naptar .next-month {
	
}
#naptar .paging {
	display: flex;
	justify-content: space-between;
	margin-bottom: .5em;
}
#naptar .paging .next-month {
	order: 3;
}
.icon.mini {
	width: 15px;
	height: 15px;
	border-width: 10px;
}

@media (max-width: 768px) {
  .row {
	margin-left: 0;
	margin-right: 0;
  }
  h1.internaltitle, ul.aktualis-eloadasok, #slider {
	margin-left: -15px;
	margin-right: -15px;
  }
  #naptar .paging {
	max-width: 300px;
	margin: 0 auto 10px;
  }
  table.calendar-month.oneline {
        display: block;
        max-height: unset;
  }
  table.calendar-month.oneline tr {
	display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(7,1fr);
	max-width: 300px;
	grid-gap: 5px;
	margin: 0 auto;
  }
  table.calendar-month.oneline .other-month {
        display: block;
  }
  ul.aktualis-eloadasok li:nth-child(3) {
	margin-right: 0;
  }
  .aktualis-eloadasok li:nth-child(n+4) {
	display: none;
  }
}
@media (max-width: 512px) {
  ul.aktualis-eloadasok li:nth-child(2) {
	margin-right: 0;
  }
  .aktualis-eloadasok li:nth-child(n+3) {
	display: none;
  }
  #header {
	flex-direction: column;
  }
}


.ui-widget {
	font-family: var(--main-font);
	font-size: 1em;
}
.ui-widget-header {
	border: 1px solid var(--brand-color);
	background: none var(--brand-color-medium);
	color: var(--color-black);
	font-weight: 600;
	font-size: 1.1em;
}
.ui-widget.ui-widget-content {
	border: 1px solid var(--brand-color);
}
.ui-widget-content a.cim {
	color: var(--color-black);
	font-weight: 600;
}
.ui-dialog-titlebar-close::after {
	content: '✖';
	color: var(--brand-color);
	position: absolute;
	top: -1px;
	left: 1px;
	line-height: 1em;
}

.ui-tooltip.calendar-tooltip {
	background-color: var(--color-black);
	color: white;
	border-radius: var(--border-radius);
	border-color: var(--color-black);
	box-shadow: none;
	font-size: .8em;
}
.calendar-tooltip .helyszin {
  display: none;
}
.calendar-tooltip .megjegyzes {
	display: block;
	padding-left: 1em;
	font-size: .85em;
}
.calendar-tooltip .cim {
	font-weight: 500;
}

.cikklista.imagetop ul.hirek {
	gap: 3em;
}
.cikklista.imagetop ul.hirek > li {
	/*min-height: 22.6em;*/
	box-shadow: 2px 2px 4px #666;
	/* margin-right: 4em; */
	/*flex: 1 1 calc((100% - 8em) / 3);*/
	padding: 0;
	box-sizing: border-box;
	border-radius: var(--border-radius);
	overflow: hidden;
}
.cikklista.imagetop ul.hirek > li:last-child {
	margin-right: 0;
}
.cikklista.imagetop .texts {
	margin: 1em;
}

.fejleckepek {
	border-radius: var(--border-radius);
	overflow: hidden;
}
.fejleckepek img {
	max-width: 100%;
}
.cycle-pager {
	display: none;
}
#naptar {
	padding: .5em;
	box-shadow: 0px 4px 5px #eee;
	margin-bottom: 1.5em;
	width: 100%;
}
.region.col-md-12 {
	padding-left: 0;
	padding-right: 0;
}
.region.top.row {
	flex-direction: column;
}

/* Aktuális előadások */
ul.aktualis-eloadasok {
	list-style: none;
	margin: 0;
	display: flex;
	space-between: space-between;
	background-color: #ddd;
	padding: .5em;
}
ul.aktualis-eloadasok li {
	border: 1px solid #eee;
	text-transform: uppercase;
	flex: 1 1 18%;
	margin-right: 1em;
	padding: .5em;
	background-color: var(--color-offwhite);
	border-radius: var(--border-radius);
	display: flex;
	flex-direction: column;
}
ul.aktualis-eloadasok li:nth-child(4) {
	margin-right: 0;
}
.aktualis-eloadasok li:nth-child(n+5) {
	display: none;
}
ul.aktualis-eloadasok li .idopont {
	display: block;
}
ul.aktualis-eloadasok li .idopont:last-child {
	border-bottom: 1px solid #eee;
}
ul.aktualis-eloadasok li .idopont.nap {
	font-size: 2.8em;
	line-height: .9em;
}
ul.aktualis-eloadasok li .helyszin,
ul.aktualis-eloadasok li .megjegyzes {
	display: none;
}
.aktualis-eloadasok li a.eloadascim {
	font-size: 1em;
	margin-bottom: .5em;
	border-top: 1px solid #eee;
	flex: 1 1 2em;
	padding: 2px 0;
	display: block;
}
a.jegyvasarlas {
	padding: 3px 15px;
	margin: 10px 0 5px;
	display: block;
	text-align: center;
	/* border-color: var(--main-color); */
	border-style: none;
	border-width: 1px;
	background: var(--brand-color);
	font-weight: bold;
	font-size: .9em;
	color: var(--color-offwhite);
	float: right;
	border-radius: var(--border-radius);
}
.hirlevelformcont {
	width: 100%;
	border-style: solid;
	border-width: 2px 0;
	border-color: var(--color-offwhite);
	align-items: center;
	padding: 1em 0 1.5em;
}
.hirlevelformcont h1 {
	border-bottom: none;
	margin-top: 1em;
}
#hirlevelformbox h1 {
	display: none;
}
#hirlevelform .label {
	display: block;
	margin-bottom: 0;
	text-transform: uppercase;
	font-weight: 600;
	font-size: .9em;
}
#hirlevelform .button.elkuld, .sorozatajanlo .button {
	background-color: var(--brand-color);
	border: 0;
	color: var(--color-white);
	text-transform: uppercase;
	font-weight: 600;
	font-size: .9em;
	padding: 4px 30px;
	border-radius: var(--border-radius);
}
form#hirlevelform {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
}
form#hirlevelform > div {
	flex: 1 1 40%;
}
#hirlevelform > div:nth-child(3) {
	display: flex;
	gap: 1em;
}
#hirlevelform input[type="text"] {
	width: 100%;
}
#hirlevelform > div:nth-child(3) > .radiocont {
	display: flex;
	gap: .5em;
	align-items: center;
}
#hirlevelform > div:nth-child(4) {
	text-align: center;
}

#footer #lablecmenu {
	margin: 0;
}
.eloadaslista .eloadasok .row {
	gap: var(--grid-gap);
}
.eloadaslista .eloadasok .eloadas {
	background-color: white;
	border-radius: 10px;
	overflow: hidden;
	display: block;
	padding: 0;
	box-shadow: 2px 2px 10px var(--color-verylightgrey);
	display: flex;
	flex-direction: column;
}
.eloadaslista .eloadasok .eloadas .felirat {
	font-weight: 500;
	padding: 10px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	flex-grow: 1;
}
.eloadaslista .eloadasok .eloadas .felirat .mufaj {
	text-transform: lowercase;
	text-wrap: nowrap;
	background: var(--color-lightgrey);
	padding: .2em 1em;
	color: var(--color-white);
	border-radius: var(--border-radius);
	margin: 0;
	height: 1.8em;
	align-self: flex-end;
}
.eloadaslista .eloadasok .eloadas .felirat .mufaj:empty {
	background: transparent;
}

.eloadaslista .eloadasok .eloadas .felirat .szerzo {
	float: none;
	clear: both;
	margin-bottom: 2px;
}

.eloadaslista .eloadasok .eloadas .felirat .cim {
	font-size: 1.5em;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1em;
	margin: .05em 0;
}

.eloadas .eloadasfejlec .kepfolott,
.eloadas .eloadasfejlec .kepalatt {
	display: flex;
	justify-content: space-between;
	width: 100%;
}
.eloadas .eloadasfejlec .kepfolott h1 {
	font-size: 1.2rem;
	text-transform: uppercase;
	margin-bottom: 0;
}
.eloadas .eloadasfejlec .kepfolott h1 .szerzo {
	display: block;
	font-weight: 400;
}
.eloadas .eloadasfejlec .kepfolott > div {
	text-align: right;
}
.eloadas .eloadasfejlec .kiemeltkepcont {
	border-radius: 1em;
	overflow: hidden;
	aspect-ratio: 16/9;
	margin: 10px 0;
}
.eloadas .eloadasfejlec .kiemeltkepcont img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.eloadas .eloadasfejlec .bemutato label {
	margin-bottom: 0;
}
.eloadas .eloadasfejlec .bemutato label::after, .eloadas .eloadasfejlec h1 .szerzo::after {
	content: ": ";
}

.eloadas .eloadasfejlec .kepalatt h4 {
	text-transform: uppercase;
	font-size: .8em;
	font-weight: 400;
}
.eloadas .eloadasfejlec .kepalatt .tarsulatok {
	text-transform: uppercase;
	font-weight: 500;
}

.eloadas h2, .szemely h2 {
	text-transform: uppercase;
	padding-top: 1em;
	border-top: 1px solid var(--color-verylightgrey);
	margin-top: 2em;
	color: var(--color-lightgrey);
	font-weight: 500;
}
.eloadas .bemutato label {
	text-transform: uppercase;
}
.eloadas .sorozatajanlo .kepek {
	display: flex;
	gap: 1em;
	margin-bottom: 1em;
	position: relative;
}
.eloadas .media {
	display: block;
}
.eloadas .sorozatajanlo .imagewrapper {
	margin-bottom: 0.3em;
	border-radius: .5em;
	overflow: hidden;
	aspect-ratio: 3/2;
	flex: 0 0 28%;
}
.eloadas .sorozatajanlo .imagewrapper:first-child {
	margin-left: 0;
	flex: 1 0 32%;
}
.eloadas .sorozatajanlo .imagewrapper:nth-child(4) {
	display: none;
}
.eloadas .sorozatajanlo .imagewrapper img {
	cursor: default;
	object-fit: cover;
	width: 100%;
	height: auto;
	aspect-ratio: 3/2;
	border-radius: 1em;
}
.szereposztas .label .nev {
	font-weight: 500;
	text-tranfsorm: none;
}
.szereposztas .label::after {
	content: " - ";
	font-weight: 600;
}
.szereposztas li:not(.email) .szemely a {
	font-weight: 600;
	text-transform: none;
}

div.lapozo {
	display: flex;
	flex-direction: row;
	width: 100%;
	justify-content: center;
	margin-bottom: 1em;
}
.lapozo h2 {
	display: flex;
	gap: 2em;
}
.lapozo h2 > * {
	background-color: var(--color-offwhite);
	padding: 8px 14px;
	border-radius: 1.1em;
	font-size: 1.1rem;
}
.lapozo h2 a {
	color: var(--main-color);
}
.lapozo h2 a svg {
	fill: var(--main-color);
}
.lapozo h2 a:hover {
	color: var(--brand-color);
}
.lapozo h2 a:hover svg {
	fill: var(--brand-color);
}
.lapozo h2 span {
	padding-left: 2em;
	padding-right: 2em;
}

.fullwidth {
	width: 1640px;
	max-width: calc(100% - 30px);
	margin: 0 auto;
}
article.col-md-10 {
	max-width: 1080px;
}
@media (min-width: 768px) {
.col-md-4 {
	-ms-flex: 1 0 calc(33.333333% - var(--grid-gap) * 2);
	flex: 1 0 calc(33.333333% - var(--grid-gap) * 2);
	max-width: 33.333333%;
}
}

@media (min-width: 576px) {
.container, .container-sm {
	max-width: 98%;
}
}
@media (min-width: 1500px) {
.container, .container-lg, .container-md, .container-sm, .container-xl {
	max-width: 1440px;
}
}

@media (min-width: 1700px) {
.container, .container-lg, .container-md, .container-sm, .container-xl {
	max-width: 1640px;
}
}

h1.pagetitle {
	letter-spacing: 0;
	text-align: left;
}
.cikklista h2 a {
	text-transform: none;
	font-size: 1rem;
	color: var(--color-black);
}
.titleline-menu {
	list-style: none;
	display: block;
	padding-left: 0;
}
.titleline-menu li {
  /* float: left; */
  display: inline-block;
}
.titleline-menu li:not(:last-child)::after {
	content: '/';
	display: inline-block;
	padding: 0 10px;
}
.titleline-menu li a {
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  color: var(--main-color);
}
.titleline-menu li.actual a {
  font-weight: bold;
  color: var(--highlight);
}


.tarsulat ul {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(300px,1fr));
  grid-gap: 2em;
  padding: 1em;
}
.tarsulat h1 {
  display: none;
}
.tarsulat ul li .kep, .eloadas .media .szereplok li .kep {
	width: 100%;
	aspect-ratio: 2/3;
	background-color: var(--color-offwhite);
	background-size: cover;
	border-radius: var(--border-radius);
	overflow: hidden;
}
.tarsulat ul li .kep img, .eloadas .media .szereplok li .kep img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tarsulat ul li .nev {
  font-size: 1.1em;
  text-transform: uppercase;
  font-weight: 600;
  margin-top: .5em;
}
.tarsulatok .elnevezes {
  text-transform: uppercase;
  margin-bottom: 1em;
  display: block;
  font-size: 1.1em;
  font-weight: bold;
}


ul.musor {
	display: block;
}
ul.musor > li {
	display: flex;
}
ul.musor > li > .day::after {
	content: "";
}

ul.musor > li > .day {
	font-weight: 600;
	font-size: 1em;
	text-transform: capitalize;
	white-space: nowrap;
	flex: 0 0 140px;
}
ul.musor > li > .day > .dayname {
	display:block;
	font-weight: 500;
}
ul.musor li li {
	display: flex;
	justify-content: space-between;
	gap: 1em;
}
ul.musor > li > * {
	display: block;
	padding: 10px 0;
	border-top: 0px solid #666;
}
ul.musor li li:not(:last-child) {
	margin-bottom: 1.5em;
}
ul.musor li li .cim-mufaj {
	display: flex;
	flex-direction: column;
}
ul.musor li li .cim-mufaj a.eloadascim {
	text-transform: uppercase;
	font-size: 1em;
}
ul.musor li li .cim-mufaj .mufaj {
	text-transform: lowercase;
}
ul.musor li li .idopont.ido {
	display: block;
	background: var(--color-offwhite);
	padding: 2px 10px;
	border-radius: var(--border-radius);
	align-self: flex-start;
}
ul.musor li li .cim-mufaj {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
ul.musor li li  .jegylink {
	flex: 0 0 120px;
}
ul.musor li li  .jegylink a.jegyvasarlas {
	margin: 0;
}
ul.musor li li .megjegyzes, ul.musor li li .helyszin {
	display: block;
	flex: 0 0 150px;
}


/* ===== Havi műsor ===== */
ul.musor {
  --musor-cols:
    [nap]  minmax(140px, max-content)
    [ido]  max-content
    [cim]  minmax(12em, 1fr)
    [megj] 150px
    [hely] 150px
    [jegy] max-content;
  display: grid;
  grid-template-columns: var(--musor-cols);
  column-gap: 1em;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* egy nap */
ul.musor > li {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: subgrid;
  align-items: start;
  padding: 10px 0;
  border-top: 1px solid #666;
}
ul.musor > li > .day {
  grid-column: nap;
  font-weight: 600;
  text-transform: capitalize;
  white-space: nowrap;
}
ul.musor > li > .day::after { content: none; }
ul.musor > li > .day > .dayname { display: block; font-weight: 500; }

/* a nap előadásai */
ul.musor > li > ul {
  grid-column: ido / -1;
  display: grid;
  grid-template-columns: subgrid;
  row-gap: 1.5em;
  margin: 0;
  padding: 0;
  list-style: none;
}
ul.musor li li {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: subgrid;
  align-items: start;
}
ul.musor li li > .ido {
  grid-column: ido;
  background: var(--color-offwhite);
  padding: 2px 10px;
  border-radius: var(--border-radius);
}
ul.musor li li > .cim-mufaj {
  grid-column: cim;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
ul.musor li li .eloadascim { text-transform: uppercase; }
ul.musor li li .mufaj      { text-transform: lowercase; }
ul.musor li li > .megjegyzes { grid-column: megj; }
ul.musor li li > .helyszin   { grid-column: hely; }
ul.musor li li > .jegylink   { grid-column: jegy; }
ul.musor li li .jegyvasarlas { margin: 0; }

/* Széles: a 4. és 5. oszlop is nyúlik */
@media (min-width: 1200px) {
  ul.musor {
    --musor-cols:
      [nap]  minmax(140px, max-content)
      [ido]  max-content
      [cim]  minmax(14em, 2fr)
      [megj] minmax(150px, 1fr)
      [hely] minmax(150px, 1fr)
      [jegy] max-content;
  }
}

/* Kisebb: cím / megjegyzés / helyszín egy cellában, 3 sorban */
@media (max-width: 991.98px) {
  ul.musor {
    --musor-cols: [nap] max-content [ido] max-content [cim] minmax(0, 1fr) [jegy] max-content;
  }
  ul.musor > li > ul { row-gap: 1em; }
  ul.musor li li { row-gap: .15em; }
  ul.musor li li > .ido,
  ul.musor li li > .jegylink   { grid-row: 1 / span 3; }
  ul.musor li li > .cim-mufaj  { grid-row: 1; }
  ul.musor li li > .megjegyzes { grid-column: cim; grid-row: 2; }
  ul.musor li li > .helyszin   { grid-column: cim; grid-row: 3; }
  ul.musor li li > :empty      { display: none; }
}

/* Nagyon kicsi: a jegylink is alá kerül, a nap fejlécként felülre */
@media (max-width: 575.98px) {
  ul.musor { --musor-cols: [ido] max-content [cim] minmax(0, 1fr); }
  ul.musor > li > .day { grid-column: 1 / -1; margin-bottom: .4em; }
  ul.musor > li > .day > .dayname { display: inline; margin-left: .4em; }
  ul.musor > li > ul { grid-column: 1 / -1; }
  ul.musor li li > .ido      { grid-row: 1 / span 4; }
  ul.musor li li > .jegylink { grid-column: cim; grid-row: 4; margin-top: .4em; }
  ul.musor li li .eloadascim { overflow-wrap: anywhere; }

  .lapozo h2 { gap: .75em; }
  .lapozo h2 span { padding-left: 1em; padding-right: 1em; }
}

.tarsulateloadaslista .eloadas {
	margin-bottom: 1em;
}
.tarsulateloadaslista .eloadas .label {
	padding: 0;
}
.tarsulateloadaslista .eloadas .szerzo {
	font-size: .9em;
}
.tarsulateloadaslista .eloadas .cim {
	font-weight: 500;
	font-size: 1em;
	text-transform: uppercase;
}
.tarsulateloadaslista .eloadas .tarsulat, .tarsulateloadaslista .eloadas .evad, .tarsulateloadaslista .eloadas .rendezo {
	display: inline-block;
}
.tarsulateloadaslista .eloadas .tarsulat::after {
	content: ' - ';
}
.tarsulateloadaslista .eloadas .rendezo {
	font-style: italic;
}
.tarsulateloadaslista .eloadas .rendezo::before {
	content: ' (';
}
.tarsulateloadaslista .eloadas .rendezo::after {
	content: ')';
}
.tarsulateloadaslista .eloadas .szerep > span:not(:last-child)::after {
	content: '; ';
	color: black;
}
.tarsulateloadaslista .eloadas .szerep .leiras::before {
	content: ', ';
}
.tarsulateloadaslista .eloadas .szerep .nev {
	font-variant: small-caps;
}
.szemely .kovetkezoeloadasok .eloadascim {
	text-transform: uppercase;
	font-weight: 500;
	color: var(--color-black);
	font-size: 1.3em;
	margin-top: 1em;
	display: block;
}
.szemely .kovetkezoeloadasok ul.idopontok {
	list-style: none;
	margin: 0;
	padding-left: .5em;
}
.szemely .kovetkezoeloadasok ul.idopontok .megjegyzes {
	display: block;
	margin-left: 2em;
	font-size: .9em;
	text-transform: none;
}
.szemely .kovetkezoeloadasok ul.idopontok li {
	text-transform: uppercase;
}

/* Boxmenu */
.boxmenu-list {
	gap: var(--grid-gap);
	padding: 1em;

}
.boxmenu-item::before {
	content: "";
	width: 100%;
	aspect-ratio: 3/2;
	display: block;
	background-color: var(--color-background);
	margin-bottom: 0.5em;
	background-image: url(/images/partners/jokai/favicon.svg);
	background-blend-mode: color-dodge;
	background-repeat: no-repeat;
	background-size: 40%;
	background-position: center;
}
.boxmenu-item.menuid-29::before {
	background-image: url(/images/partners/jokai/boxmenu/menu29.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-9::before {
	background-image: url(/images/partners/jokai/boxmenu/menu9.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-10::before {
	background-image: url(/images/partners/jokai/boxmenu/menu10.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-11::before {
	background-image: url(/images/partners/jokai/boxmenu/menu11.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-30::before {
	background-image: url(/images/partners/jokai/boxmenu/menu30.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-31::before {
	background-image: url(/images/partners/jokai/boxmenu/menu31.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-32::before {
	background-image: url(/images/partners/jokai/boxmenu/menu32.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-33::before {
	background-image: url(/images/partners/jokai/boxmenu/menu33.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item.menuid-34::before {
	background-image: url(/images/partners/jokai/boxmenu/menu34.jpg);
	background-blend-mode: unset;
	background-size: cover;
}
.boxmenu-item {
	list-style: none;
	padding: 0;
	box-shadow: 2px 2px 10px var(--color-verylightgrey);
	border-radius: var(--border-radius);
	overflow: hidden;
}
.boxmenu-item a {
	margin: 1em;
	display: block;
	font-weight: 600;
}

/* Képgaléria */
#galleryprojector .kepBox .kep img {
	position: static;
	max-height: unset;
}
#galleryprojector .kepBox .kep {
	padding-top: 0;
	aspect-ratio: 3/2;
	background-color: transparent;
}
#galleryprojector div.lapozo {
	left: 15px;
	margin-bottom: 0;
}
#galleryprojector .kepalairas {
	display: flex;
	justify-content: space-between;
	margin: 0 30px !important;
}
#galleryprojector .kepalairas .refname{
	display: none;
}
.sorozatajanlo .button {
	position: absolute;
	bottom: 1em;
	right: 1em;
}
.sorozatajanlowrapper {
	background-color: transparent;
}
.sorozatajanlowrapper.square .imagewrapper > div {
	padding-top: 0;
	background-color: var(--color-background);
}
.sorozatajanlo li .imagewrapper > div > a {
	position: static;
	aspect-ratio: 3/2;
	display: block;
}
.sorozatajanlo li .imagewrapper > div > a > img {
	max-height: auto;
}
.sorozatajanlowrapper.square .info {
	/* position: static; */
	/* background: transparent; */
	width: 100%;
	text-shadow: none;
	bottom: 7%;
	left: 0;
	padding: 3%;
	background-color: rgba(40,40,40,.8);
	color: var(--color-white);
}
.square .sorozatajanlo a.szinhaznev, .square .sorozatajanlo a.eloadascim, .square .sorozatajanlo .label span, .square .sorozatajanlo .label::after, .square .sorozatajanlo .rendezo, .sorozatajanlowrapper.square .info a {
	color: var(--color-white);
	text-shadow: none;
	font-size: 1em;
}
.sorozatajanlowrapper.square .info a {
	font-size:1.1em;
}
.imagewrapper > div > a:hover > img, .leadkepcont > div > a:hover > img {
	transform: none;
}
.sorozatajanlowrapper.square .sorozatajanlo {
	gap: var(--grid-gap);
}
.sorozatajanlo .imagewrapper {
	margin-bottom: 0;
}
.sorozatajanlowrapper.square .sorozatajanlo li {
	margin-bottom: 0px;
	/* box-shadow: 2px 2px 10px var(--color-verylightgrey); */
	border-radius: 1em;
	overflow: hidden;
	padding: 0;
}
.sorozatajanlowrapper:not(.fourImages) .sorozatajanlo li:nth-child(-n+4), .sorozatajanlowrapper.square .sorozatajanlo li {
	margin-bottom: 0;
}
/* ==========================================================
   Repeating 6-box gallery
   Grid module: 7 columns × 5 rows per group of 6 boxes

   cols:  1  2  3  4  5  6  7
   row1: [ 1  1  1][ 2  2][ 3  3]
   row2: [ 1  1  1][ 2  2][ 3  3]
   row3: [ 1  1  1]   .  [ 6  6  6]
   row4: [ 4  4][ 5  5]  [ 6  6  6]
   row5: [ 4  4][ 5  5]  [ 6  6  6]

   Only columns and row-spans are set; "dense" auto-placement
   puts every box in the right row, so the pattern repeats for
   boxes 7–12, 13–18, … without any per-group rules.
   ========================================================== */

.gallery-container {
  --gap: clamp(12px, 2.5vw, 28px);
  --row: clamp(36px, 6.5vw, 64px);   /* height of one row unit */

  display: grid;
  grid-template-columns: repeat(7, 1fr);
  /*grid-auto-rows: var(--row);*/
  grid-auto-flow: row dense;          /* key to the repeating layout */
  gap: var(--gap);
}

.gallery-box {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  background: #222;
}

/* Box 1 – large, top left */
.gallery-box:nth-child(6n + 1) { grid-column: 1 / span 3; grid-row: span 3; }
/* Box 2 – small, top middle */
.gallery-box:nth-child(6n + 2) { grid-column: 4 / span 2; grid-row: span 2; }
/* Box 3 – small, top right */
.gallery-box:nth-child(6n + 3) { grid-column: 6 / span 2; grid-row: span 2; }
/* Box 4 – small, bottom left */
.gallery-box:nth-child(6n + 4) { grid-column: 1 / span 2; grid-row: span 2; }
/* Box 5 – small, bottom middle */
.gallery-box:nth-child(6n + 5) { grid-column: 3 / span 2; grid-row: span 2; }
/* Box 6 – large, bottom right (starts one row higher than 4 & 5) */
.gallery-box:nth-child(6n + 6) { grid-column: 5 / span 3; grid-row: span 3; }

/* ---------- Content inside a box (optional) ---------- */
.gallery-box img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.gallery-box:hover img { transform: scale(1.04); }

/* Dark caption band at the bottom, like in the design */
.gallery-box .caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 12%;
  padding: .5em 1em;
  background: rgba(0, 0, 0, .6);
  color: #fff;
  font-size: clamp(10px, 1vw, 13px);
  line-height: 1.3;
}
.gallery-box .caption strong {
  display: block;
  text-transform: uppercase;
  font-weight: 700;
}

/* ---------- Mobile: simple 2-column fallback ---------- */
@media (max-width: 768px) {
  .gallery-container {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: auto;
    grid-auto-flow: row;
  }
  .gallery-box:nth-child(n) {
    grid-column: auto;
    grid-row: auto;
    aspect-ratio: 3 / 2;
  }
  .gallery-box:nth-child(6n + 1),
  .gallery-box:nth-child(6n + 6) {
    grid-column: 1 / -1;
    aspect-ratio: 16 / 9;
  }
}

@media (max-width: 512px) {
  .gallery-container {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    grid-auto-flow: row;
  }
  .gallery-box:nth-child(n) {
    grid-column: auto;
    grid-row: auto;
    aspect-ratio: 3 / 2;
  }
  .gallery-box:nth-child(6n + 1),
  .gallery-box:nth-child(6n + 6) {
    /*grid-column: 1 / -1;*/
    aspect-ratio: 3 / 2;
  }
}



#galleryprojector .kepBox .kep img {
	border-radius: 2em;
}

.hirlapozo {
	display: flex;
	gap: 1em;
	justify-content: center;
	margin-top: 2em;
}
.hirlapozo.ui-helper-clearfix::after, .hirlapozo.ui-helper-clearfix::before,
.videogaleria .thumbnails.ui-helper-clearfix::after, .videogaleria .thumbnails.ui-helper-clearfix::before {
	display: none;
}

.videogaleria .youtubevideocontainer {
	border-radius: 25px;
	overflow: hidden;
}
.videogaleria .thumbnails {
	display: flex;
	gap: var(--grid-gap);
	margin: var(--grid-gap) 0;
}
.videogaleria .thumbnails .youtubeThumbnail {
	position: relative;
	cursor: pointer;
}
.videogaleria .thumbnails .youtubeThumbnail img[alt="Thumbnail"] {
	border-radius: 20px;
}
.videogaleria .thumbnails .title {
	display: none;
}
