body { 
  color:darkblue; margin:0; padding:0; font-size:18px; min-width:400px;
  font-family:'Open Sans', sans-serif; font-weight:300;
}

b { font-weight:600; }

.body {
  background:transparent url(napsugarak.jpg) no-repeat center bottom; background-size:cover;
  padding:20px;
}
.body-frame { max-width:1000px; margin:0 auto; }
.body-frame:after { content:''; display:block; clear:both; }

footer { background:transparent url(kavicsok.jpg) no-repeat center center; background-size:cover; padding:40px 20px; }
.footer { max-width:1000px; margin:0 auto; }

a { color:inherit; text-decoration:none; font-weight:bolder; display:inline-block; border:1px solid transparent; padding:0 2px; }
a:hover, a:focus { color:#7f0000; }
* { box-sizing:border-box; }

h1 { font-size:1.5em; margin-bottom:2em; }
h2 { font-size:1.2em; }
hr { margin-top:2em; border:0; border-bottom:1px solid darkblue; }

table { margin:0 auto; font-weight:400; }
table td { padding:.5em; }
table tr td:last-child { text-align:right; }

.title, .profile, .menu a, .content, .footer {
   background-color:rgba(255,255,255,.7); box-shadow:0 0 5px #000;
}

.title { font-size:1.5em; font-weight:bold; padding:.5em 1em; margin-bottom:20px; text-align:center; }

.profile { width:25%; float:left; text-align:center; position:relative; margin-bottom:20px; max-width:400px; }
.profile img { width:100%; height:auto; vertical-align:top; }
.profile span { position:absolute; bottom:0; width:100%; display:block; background-color:rgba(255,255,255,.6); font-weight:600; }

.magamrol .profile, .elerhetosegek .profile {
  background:#fff url(kis-tamas-2.jpg) no-repeat center center; background-size:cover;
}
.magamrol .profile img, .elerhetosegek .profile img { visibility:hidden; }

.right-col { width:75%; float:right; padding-left:20px; }

ul.menu { 
  list-style:none; padding:0; margin:-5px -5px 15px -5px; display:table; text-align:center;
}
.menu li { display:table-cell; padding:5px; }
.menu a {
  text-decoration:none; display:block; padding:0 .4em; border:1px solid transparent;
  text-transform:uppercase; line-height:2.5em; height:3em vertical-align:middle; font-weight:600;
}
.menu a:hover, .menu a:focus { box-shadow:none; border-color:darkblue; }
.menu a span { display:inline-block; line-height:1.25em; vertical-align:middle;   font-size:.7em; }

.content { padding:1.5em; margin-bottom:20px;  text-align:justify; }
.content h1 { text-align:center; }

.footer { padding:1em; text-align:center; }
.footer .row1 { font-size:2em; text-transform:uppercase; }

body.index .menu a.index,
body.magamrol .menu a.magamrol,
body.tanacsadas .menu a.tanacsadas,
body.felvilagositas .menu a.felvilagositas,
body.arak .menu a.arak,
body.elerhetosegek .menu a.elerhetosegek {
 font-weight:700; color:#7F0000;
}

body.index .content p { text-align:center; font-size:1.2em; font-weight:bold; }
body.arak .content p { text-align:center; }

@media (max-width: 900px) {
  .right-col { float:none; width:100%; padding:0; }
  .menu { width:calc(100% + 10px); }
  .content { float:right; width:calc(75% - 20px); }
}

@media (max-width: 700px) {
  .menu li { display:inline-block; max-width:8em; }
  .content { float:none; width:100%; }
  .profile { float:none; width:100%; margin:20px auto; }
  footer { font-size:.7em; }
}

@media (max-width: 450px) {
  .content { text-align:left; }
}