@font-face {font-family: armata; src: url('armata.ttf'), url('armata.eot');}

@media screen and (min-width: 681px) {
body {background-color: #fff; margin: 20px 0 0 0; padding: 0; font-size: 16px; font-family: "armata", Verdana, sans-serif;}
a:link {text-decoration: none; color: #666;}
a:visited {text-decoration: none; color: #666;}
a:hover {text-decoration: none; color: #fff; background: #666;}
a:link.piros {text-decoration: none; color: #f00;}
a:visited.piros {text-decoration: none; color: #f00;}
a:hover.piros {text-decoration: none; color: #000;}

#header {width: 600px; margin: auto; margin-bottom: 0; padding-top: 0; padding-bottom: 0;}
#header p {margin: 0; padding: 0; line-height: 0; text-align: center;}
#header img {border: none; padding: 0; margin: 0; max-width: 100%;}

#article {width: 600px; margin: auto; margin-bottom: 20px; padding-top: 0; padding-bottom: 0;}
#article.slct {-webkit-user-select: none; -ms-user-select: none; user-select: none;}
h3 {font-size: 22px; font-weight: bold; color: #000; text-align: center;}
h4 {font-size: 20px; font-weight: bold; color: #000; text-align: center;}
p {color: #000; margin: 0 0 15px 0; padding: 0; line-height: 125%; font-variant:small-caps;}
p.index {font-size: 20px; color: #000; margin: 20px 0 20px 0; padding: 0; line-height: 150%; font-variant:small-caps; text-align: center;}
strong {color: #000;}

#footer {width: 600px; margin: auto; margin-bottom: 120px;}
#footer p {color: #aaa; margin: 0 0 10px 0; padding: 0; line-height: 150%; font-variant:small-caps; font-size: 15px; text-align: right;}
#footer a:link {text-decoration: none; color: #aaa;}
#footer a:visited {text-decoration: none; color: #aaa;}
#footer a:hover {text-decoration: none; color: #fff; background: #666;}

p.logo {text-align: center; padding-top: 15px; border-top: #000 1px solid; line-height: 150%;}
p.center {text-align: center;}
}

@media screen and (max-width: 680px) {
body {background-color: #fff; margin: 10px 10px 10px 10px; font-family: "armata", Verdana, sans-serif; font-size: 85%;}
a:link {text-decoration: none; color: #666;}
a:visited {text-decoration: none; color: #666;}
a:hover {text-decoration: none; color: #fff; background: #666;}
a:link.piros {text-decoration: none; color: #f00;}
a:visited.piros {text-decoration: none; color: #f00;}
a:hover.piros {text-decoration: none; color: #000;}

#header p {margin: 0; padding: 0; line-height: 0; text-align: center;}
#header img {border: none; padding: 0; margin: 0; max-width: 100%;}

#article {width: 100%;}
#article.slct {-webkit-user-select: none; -ms-user-select: none; user-select: none;}
h3 {font-size: 150%; font-weight: bold; color: #000; text-align: center;}
h4 {font-size: 120%; font-weight: bold; color: #000; text-align: center;}
p {font-size: 100%; color: #000; margin: 0 0 10px 0; padding: 0; line-height: 120%; font-variant:small-caps;}
p.index {font-size: 125%; color: #000; margin: 20px 0 0 20px; padding: 0; line-height: 100%; text-align: center; font-variant:small-caps;}
strong {color: #000;}

#footer {width: 100%;}
#footer p {color: #aaa; margin: 20px 40px 60px 0; padding: 0; line-height: 150%; font-variant:small-caps; font-size: 90%; text-align: right;}
#footer a:link {text-decoration: none; color: #888;}
#footer a:visited {text-decoration: none; color: #888;}
#footer a:hover {text-decoration: none; color: #fff; background: #888;}

p.logo {text-align: center; padding-top: 10px; border-top: #000 1px solid;}
p.center {text-align: center;}
}