/* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */
html, body {height:100%; margin:0; padding:0;}
/* Menu es tartalom egy oldalon, frameset nelkul. */
#layout {display:flex; min-height:100%; box-sizing:border-box; padding:10px; gap:10px; background:url(bg.jpg) center center/cover no-repeat fixed;}
/* a menu es a tartalom feher, atlatszo panel a kep felett, hogy a szoveg olvashato legyen; a menu kevesbe atlatszo es alul tobbet margozik, igy kulonbozik a tartolmatol */
#menu {flex:0 0 23%; max-width:23%; background-color:rgba(255,255,255,0.9); border-radius:12px; padding:10px 6px 20px; box-sizing:border-box;}
#content {flex:1 1 auto; height: 97vh; overflow:hidden; min-width:0; display:flex; flex-direction:column; background-color:rgba(255,255,255,0.7); border-radius:12px; padding:10px; box-sizing:border-box;}
/* a gorgetheto doboz a #content paddingjan belul van, igy gorgetes kozben sem er a tartalom a lekerekitett szelig */
#contentscroll {flex:1 1 auto; overflow-y:auto; display:flex; flex-direction:column;}
table.contenttable {width:100%; flex:1 1 auto; border-collapse:collapse;}
td.contentcell {vertical-align:middle; text-align:center;}
/* mobil menu: felulre kerul, a felso savra kattintva nyilik ki */
#menuchk {display:none;}
#menubtn {display:none; cursor:pointer; padding:8px 10px;}
#menubtn span {display:block; width:26px; height:3px; margin:5px 0; background-color:#000000;}
div.menulevel1 {cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;}
div.menulevel1disabled {color:#808080;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;}
div.menulevel1new {cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;color:#000066;}
a.menulevel1 {cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:inherit;}
a.menulevel1new {cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:#000066;}
a.menulevel1selected {background-color:#8dbef1;cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:inherit;}
a.menulevel1newselected {background-color:#8dbef1;cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:#000066;}
div.simplecontent {letter-spacing:2px;font-size:16px;font-family:sans-serif;font-weight:bold;text-align:left;}
a.menulevel2new {cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:16px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:#000066;}
a.menulevel2newselected {background-color:#8dbef1;cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:16px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:#000066;}
a.menulevel2 {cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:16px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;}
a.menulevel2selected {background-color:#8dbef1;cursor:pointer;margin-top:7px;margin-left:4px;letter-spacing:2px;font-size:16px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;}
a.menulevel3new {cursor:pointer;margin-top:5px;margin-left:0px;letter-spacing:1.3px;font-size:12px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:#000066;}
a.menulevel3newselected {background-color:#8dbef1;cursor:pointer;margin-top:5px;margin-left:0px;letter-spacing:1.3px;font-size:12px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;color:#000066;}
a.menulevel3 {cursor:pointer;margin-top:5px;margin-left:0px;letter-spacing:1.3px;font-size:12px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;}
a.menulevel3selected {background-color:#8dbef1;cursor:pointer;margin-top:5px;margin-left:0px;letter-spacing:1.3px;font-size:12px;font-family:sans-serif;font-weight:bold;text-align:center;text-decoration:none;}
td.menuborderleft {width:16px; padding:0; margin:1px;}
td.menuborderright {width:17px; padding:0;}
div.centerborderdecor {padding:0; width:100%; border:none; margin-top:1px; text-align: center;}
div.leftborderdecor {padding:0; width:17px; border:none; margin-top:1px;}
table.menuitem {border-collapse: collapse; padding:0; width:100%;}
table.menu {border-collapse: collapse; padding:0; width:100%; }
table.centercontent {border-collapse: collapse; padding:0; width:100%; }
table.decoration {border-collapse: collapse; padding:0; margin-left:5px;}
table.photos {border-collapse: collapse; width:100%; height:100%; border:0px ridge; margin-bottom:35px; }
table.photos tr {border-collapse: collapse; padding:4px; width:100%;}
table.photos td {border-collapse: collapse; padding:4px; width:100%; vertical-align:middle; border: 0px ridge; }
td.centered { text-align:center; }
div.afterleftdecor {margin-left:20px;}
table.description {border-collapse: collapse; padding:0; margin-left:25%; margin-right:25%; margin-bottom:0px;}
/* a terkep a szabad szelesseget veszi fel, de max. a regi 425 px; a magassag az aranyat tartja */
iframe.map {width:100%; max-width:425px; aspect-ratio:425/350; height:auto;}
td.sidemenu {padding:0; width:5%; }
td.simplecontent {letter-spacing:2px;font-size:16px;font-family:sans-serif;text-align:left;}
td.simplecontentcentered {letter-spacing:2px;font-size:16px;font-family:sans-serif;text-align:center;}
.none {display: none;}
div.submenu {text-align: center; width: 90%; margin-left:6%;}
img.photo_orig { width:570px; height:380px; border: none; cursor:pointer; margin-top: 8px; }
img.photo2 { width:360px; height:240px; border: none; cursor:pointer; margin-top: 8px; }
img.photo { width:380px; height:285px; border: none; cursor:pointer; margin-top: 0px; }
img.photowide { width:380px; height:210px; border: none; cursor:pointer; margin-top: 0px; }
img.photowide2 { width:660px; height:330px; border: none; cursor:pointer; margin-top: 0px; }
img.photowide5 { width:660px; height:130px; border: none; cursor:pointer; margin-top: 0px; }
img.photowide3 { width:660px; height:230px; border: none; cursor:pointer; margin-top: 0px; }
img.photoportrait { height:380px; width:285px; border: none; margin-top:0px; }
img.photoportrait_orig { height:570px; width:430px; border: none;}
img.menulevel1 { height:15px; border: none; margin-right: 4px; }
img.menulevel2 { height:10px; border: none; margin-right: 2px; }
img.menulevel3 { height:8px; border: none; margin-right: 2px; }
ul.props { letter-spacing:2px;font-size:14px;font-family:sans-serif;font-weight:normal;text-align:left; margin-bottom: 0px; }
li.important { list-style-type: none; margin-left: -18px; background: url(small-star.gif) no-repeat left 0px; padding-left: 18px; }
li.nodisc { list-style-type: none; margin-left: -14px; }
h1.default { letter-spacing:2px;font-size:28px;font-family:sans-serif;font-weight:bold;text-align:center;}
h2.level2 { letter-spacing:2px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;}
h2.mottoheader { letter-spacing:8px;font-size:20px;font-family:sans-serif;font-weight:bold;text-align:center;}
h1.motto { letter-spacing:8px;font-size:58px;font-family:sans-serif;font-weight:bold;font-style:italic;text-align:center;margin-top: 0px;/new}
/* fixed + translate: a zoomolt doboz mindig a kepernyo kozepen van, a scrollozas nem mozgatja el */
div.zoomdiv {position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:10;}
/* sotito reteg: kinyulik a dobozon, igy a teljes lapot sotitja, a kep elotte marad */
div.zoomdiv::before {content:""; position:absolute; inset:-100vmax; z-index:-1; background:rgba(0,0,0,0.6);}
/* a zoomolt kep a sajat aranyat tartja, csak a kepernyobe ferobe nagyitunk; a 60px a keret es a tavolsag */
img.zoomimg {max-width:calc(100vw - 60px); max-height:calc(100vh - 60px); cursor:pointer;}
table.zoomtable {border-collapse: separate; background-color: white; padding:2px; border-color:gray; border:4px ridge;border-spacing: 4px;}
table.zoominctable {width:100%; height:100%;}
/* a keptar nyilai: gombok a zoomolt kep bal es jobb szelen */
.zoomnav {position:absolute; top:50%; transform:translateY(-50%); z-index:11; cursor:pointer; user-select:none; color:rgba(255,255,255,0.55); background:rgba(0,0,0,0.2); font-size:42px; line-height:1; padding:10px 14px; border-radius:10px;}
.zoomnav:hover {color:rgba(255,255,255,0.9); background:rgba(0,0,0,0.4);}
#zprev {left:8px;}
#znext {right:8px;}
scrollbarbutton[sbattr="scrollbar-up-top"],
scrollbarbutton[sbattr="scrollbar-down-bottom"]{
display: none !important;
}
/* asztali kep: a menu kulon gorul a tartalom mellett, a pontok kozepre vannak igazitva, a logo a feher atlatszo panel mogott latszik */
@media (min-width: 769px) {
  /* a #menu nem latszik, csak a gorgetes helye; a feher teglalap a #menuitems */
  #menu {position:sticky; top:10px; height:calc(100vh - 20px); overflow-y:auto; display:flex; flex-direction:column; padding:0; background:none;}
  /* a feher teglalap a pontok korul hugodik; felul es alul a kepernyo magassaganak 12%-a, a feher hatter a padding ala is kiterjed */
  #menuitems {margin:auto 0; padding-top:26px; padding-bottom:26px; padding-left:6px; padding-right:6px; border-radius:12px; background:linear-gradient(rgba(255,255,255,0.7),rgba(255,255,255,0.7)), url(logo.png) center center/auto 50% no-repeat; margin-top:12vh; margin-bottom: 12vh; height:76vh; overflow-y: auto;}
}
/* mobil kepernyo: menu felul, lenyithato */
@media (max-width: 768px) {
  #layout {flex-direction:column;}
  #menu {flex:none; width:100%; max-width:100%; padding:0;}
  #menubtn {display:block;}
  #menuitems {display:none; padding-bottom: 20px;}
  #menuchk:checked ~ #menuitems {display:block;;}
  #content {justify-content:flex-start; padding:5px; height:89vh;}
  /* mobilon a motta 58 px-en kilog a kepernyobol, ezert kisebb betumeret kell */
  h1.motto {font-size:34px; letter-spacing:4px;}
  /* mobilon a szoveges tablak teljes szelesseguek */
  table.decoration, table.description {width:100%; margin-left:0; margin-right:0;}
  td.simplecontent, div.simplecontent {overflow-wrap:break-word;}
  img.photo, img.photo2, img.photo_orig, img.photowide, img.photowide2, img.photowide3, img.photowide5, img.photoportrait, img.photoportrait_orig {width:100%; height:auto;}
}