/* Stylesheet for the two Hungarian casino pages only. The old site's main.css is deliberately
   NOT loaded here: it positions #banner / #content / #leftnav absolutely at fixed pixel widths,
   which cannot reflow on a phone. The typography below restates main.css's look (Verdana 12px,
   white ground, dotted hairlines, grey table headers) on a flowing, responsive layout, so the
   new pages read as part of the same site without touching a single old file. */

body {
  background: #fff;
  color: #000;
  font: 12px verdana, geneva, lucida, arial, sans-serif;
  margin: 0;
  padding: 5px;
}

.wrap { max-width: 760px; margin: 0 auto; }

#banner img { display: block; max-width: 100%; height: auto; }

#nav {
  margin: 10px 0 18px;
  padding-bottom: 10px;
  border-bottom: 1px dotted #000;
  font-size: 11px;
}
#nav a { margin-right: 14px; white-space: nowrap; }

h1 { font: 18px verdana, geneva, lucida, arial, sans-serif; margin: 18px 0 10px; }
h2 { font: 15px verdana, geneva, lucida, arial, sans-serif; margin: 26px 0 8px; }
h3 { font: 13px verdana, geneva, lucida, arial, sans-serif; margin: 18px 0 6px; }

p, li { line-height: 150%; }
ul, ol { padding-left: 22px; }
li { margin: 4px 0; }

.small { font-size: 11px; }
.bld { font-weight: 700; }
.ital { font-style: italic; }

/* Same dotted-box idiom as main.css's .box */
.box {
  padding: 10px;
  border: 1px dotted #000;
  margin: 16px 0;
}

.toc { font-size: 11px; }
.toc ol { margin: 6px 0; }

/* Tables keep main.css's grey header row (.bg td). Wrapped in .tablewrap so a wide table
   scrolls inside itself on a phone instead of pushing the page sideways. */
.tablewrap { overflow-x: auto; margin: 14px 0; }
table { border-collapse: collapse; width: 100%; font-size: 11px; }
th, td { border: 1px solid #999; padding: 6px 8px; text-align: left; vertical-align: top; }
th { background: #ccc; font-weight: 700; }
caption { font-size: 11px; text-align: left; padding-bottom: 6px; font-style: italic; }

.pros, .cons { margin: 6px 0; }
.pros li { list-style: square; }
.cons li { list-style: circle; }

dl.faq dt { font-weight: 700; margin-top: 14px; }
dl.faq dd { margin: 4px 0 0 0; }

hr { border: 0; border-top: 1px dotted #000; margin: 26px 0; }

#felelos { border: 1px dotted #000; padding: 10px; margin: 24px 0 0; font-size: 11px; }
#felelos h2 { margin-top: 0; font-size: 13px; }

.updated { font-size: 11px; color: #444; }

@media (max-width: 520px) {
  body { padding: 8px; }
  h1 { font-size: 16px; }
  #nav a { display: inline-block; margin: 0 12px 6px 0; }
}
