*
{
 padding: 0;
 margin: 0;
 font-family: verdana, sans-serif;
 font-size: 10pt;
}

html
{
 overflow-y: scroll;
}

body
{
 background: #f8f3eb url(../img/alnyomat-logo.png) no-repeat center 0px;
}

.clr
{
 clear: both;
}

h1
{
 font-family: "times new roman", serif;
 font-size: 20pt;
 font-weight: normal;
 font-style: italic;
 color: #aa8f65;
 margin-bottom: .5em;
}

h1 a
{
 font-family: "times new roman", serif;
 font-size: 20pt;
 text-decoration: none;
 color: #aa8f65;
}

h2,
article h2 a
{
 font-size: 11pt;
 line-height: 15pt;
 font-weight: bold;
 color: #e49e87;
 margin-top: 1em;
 margin-bottom: 1em;
}

.container
{
 max-width: 980px;
 margin: 0 auto;
}

.float-right
{
 float: right;
}

header
{
 max-width: 980px;
 margin: 10px auto 0 auto;
}

header #motto
{
 width: 300px;
 margin-left: 10px;
 font-family: "times new roman", serif;
 font-size: 12px;
 font-style: italic;
}

header #fejlec
{
 margin: 0 auto 0 auto;
 width: 95%;
}

header #fejlec picture,
header #fejlec img
{
 width: 100%;
}

header #search
{
 float: right;
}

header #search input.searchbox
{
 width: 100px;
 padding: 2px;
 height: 16px;
 border: 0;
 outline: 0;
 vertical-align: top;
}

header #search input.searchbutton
{
 width: 20px;
 height: 20px;
 padding: 0;
 background: #fff url(../img/nagyito.png) right no-repeat;
 border: 0;
 margin: 0 0 0 -4px;
 outline: 0;
 vertical-align: top;
}

#headline-image img
{
 max-width: 100%;
}

#menu-h {display: none; cursor: pointer;}
#menu-h > svg {fill: #07518f;}
#menu-h:hover > svg {fill: #e49e87;}

#menu
{
 background-color: #e49e87;
 text-align: left;
 margin: 0 auto;
 max-width: 980px;
 height: 30px;
}

#menu > ul
{
 margin: 0;
 padding: 0;
 list-style: none;
}

#menu > ul > li
{
 float: left;
 width: 11.1111%;
 text-transform: uppercase;
 font-size: 12px;
 text-align: center;
}

#menu > ul > li > a,
#menu > ul > li > span
{
 font-family: "times new roman", serif;
 display: block;
 height: 22px;
 text-decoration: none;
 padding-top: 8px;
 color: #fff;
}

#menu > ul > li:hover > a,
#menu > ul > li:hover > span
{
 background-color: #aa8f65;
}

#menu > ul > li:hover > ul.submenu
{
 display: block;
}

#menu > ul ul.submenu
{
 padding: 10px;
 background-color: #aa8f65;
 list-style: none;
 display: none;
 position: absolute;
 z-index: 10;
}

#menu > ul ul.submenu li
{
 text-align: left;
 font-size: 12px;
 line-height: 22px;
 color: #fff;
 text-transform: uppercase;
}

#menu > ul > li:hover > ul.submenu > li:hover
{
 color: #000;
}

#menu > ul ul.submenu li a
{
 font-family: "times new roman", serif;
 color: #fff;
 text-decoration: none;
}

#menu > ul > li:hover > ul.submenu > li > a:hover
{
 color: #000;
}

#headline-container
{
 width: 100%;
 margin-top: 5px;
 background-color: #f4e2d7;
}

#headline
{
 max-width: 980px;
 position: relative;
 margin: 0 auto;
}

#headline > #sjc
{
 z-index: 9;
 position: absolute;
 left: -47px;
 top: 0;
 width: 106px;
 height: 169px;
 background-image: url(../img/headline-logo.png);
 cursor: pointer;
}

#headline img
{
 display: block;
 left: 0;
 top: 0;
}

#article-wrapper
{
 width: 100%;
 background-color: rgba(255,255,255,0.75);
}

#left
{
 padding: 80px 0 30px 0;
 width: 180px;
 float: left;
}

#left h2
{
 margin-top: 0;
 margin-bottom: 0.5em;
 font-family: "times new roman", serif;
 font-size: 14pt;
 line-height: 18pt;
 color: #aa8f65;
 font-style: italic;
}

#left p
{
 font-family: "times new roman", serif;
 margin-bottom: 0.5em;
 font-size: 14pt;
 line-height: 18pt;
 color: #999;
 font-style: italic;
}

article,
#content
{
 box-sizing: border-box;
 padding: 30px 0 30px 0;
 width: 100%;
 max-width: 540px;
 margin-left: 40px;
 float: left;
}

article iframe
{
 max-width: 100%;
}

article img
{
 max-width: 100%;
 height: auto;
}

article p,
#content p
{
 margin-bottom: .5em;
 font-size: 10pt;
 line-height: 14pt;
 color: #666;
}

article p.caption
{
 font-size: 8pt;
 font-style: italic;
 color: #e49e87;
 margin-bottom: 1.5em;
}

p.lead
{
 color: #e49e87;
 font-style: italic;
}

article ul,
article ol,
#content ul,
#content ol
{
 font-size: 10pt;
 line-height: 14pt;
 color: #666;
 padding-left: 1.5em;
 margin-bottom: .5em;
}

article .fb-like,
#content .fb-like
{
 margin-top: 1em;
}

#right
{
 padding: 80px 0 30px 0;
 width: 180px;
 float: left;
 margin-left: 40px;
}

#right h3
{
 font-family: "times new roman", serif;
 font-size: 14pt;
 font-weight: normal;
 font-style: italic;
 color: #aa8f65;
 margin-bottom: .5em;
 margin-left: 20px;
}

.news-item
{
 font-size: 9pt;
 padding-left: 20px;
 background: url(../img/hirek-bullet.png) no-repeat 0 24px;
 margin-bottom: 1em;
}

#index-content .news-item
{
 height: 85px;
}

.news-item a
{
 color: #333;
 text-decoration: none;
}

#footer
{
 width: 100%;
 margin: 1em 0 1em 0;
 box-sizing: border-box;
}

#footer a
{
 color: #333;
}

#footer ul
{
 list-style: none;
}

#footer ul li
{
 float: left;
 margin-right: 2em;
 font-family: verdana, arial, sans-serif;
 font-size: 7pt;
}

#footer ul li a,
#footer ul li span
{
 font-family: verdana, arial, sans-serif;
 text-decoration: none;
}

#index-bottom
{
 border-top: 1px solid #e49e87;
 margin-top: 1em;
 padding-top: 1em;
}

table.calendar
{
}

table.calendar td,
table.calendar th
{
 width: 23px;
 font-size: 8pt;
 text-align: center;
}

table.calendar th
{
 font-weight: bold;
 padding-top: .5em;
}

table.calendar th.date
{
 font-weight: normal;
 color: #aa8f65;
 padding-top: 0;
}

table.calendar td a
{
 display: block;
 background-color: #e49e87;
 text-decoration: none;
 color: #333;
}

/* index */

ul#index-images
{
 max-width: 980px;
 list-style: none;
 height: 120px;
}

ul#index-images > li
{
 float: left;
 width: 20%;
 height: 120px;
 text-align: center;
 line-height: 120px;
}

ul#index-images > li > img
{
 vertical-align: bottom;
}

ul#index-menu
{
 max-width: 980px;
 list-style: none;
 text-align: center;
}

ul#index-menu > li
{
 display: inline-block;
 vertical-align: top;
 margin-top: 10px;
 width: 20%;
 height: 260px;
 text-align: center;
 font-size: 10pt;
}

ul#index-menu > li > div.index-menu-image
{
 height: 120px;
 line-height: 120px;
}

ul#index-menu > li > div.index-menu-image > *
{
 vertical-align: bottom;
}

ul#index-menu > li > h3
{
 font-family: "times new roman", serif;
 font-size: 14pt;
 font-weight: normal;
 font-style: italic;
 color: #aa8f65;
 margin: 0 0 1em 0;
}

ul#index-menu > li > ul
{
 list-style: none;
 font-size: 10pt;
 line-height: 12pt;
}

ul#index-menu > li > ul > li
{
 font-size: 8pt;
 line-height: 11pt;
 margin-bottom: .5em;
 width: 100%;
}

ul#index-menu > li > ul > li > a
{
 font-size: 8pt;
 color: #075190;
 text-decoration: none;
}

ul#index-menu > li > ul > li span
{
 color: #e49e87;
 font-size: 8pt;
 line-height: 11pt;
}

#index-content h3
{
 font-family: "times new roman", serif;
 font-size: 14pt;
 font-weight: normal;
 font-style: italic;
 color: #aa8f65;
 margin-bottom: 1em;
 margin-left: 20px;
}

#index-content .news-item
{
 float: left;
 width: 225px;
 margin-right: 20px;
}

.gallery-list-item
{
 width: 120px;
 min-height: 50px;
 _height: 120px;
 text-align: center;
 margin: 0 10px 10px 0;
 margin: 0 10px 10px 0;
 vertical-align: top;
 display: inline-block;
 display: -moz-inline-stack;
 zoom: 1;
 *display: inline;

}

.gallery-list-item a
{
 text-decoration: none;
}

.gallery-image-list-item
{
 width: 120px;
 min-height: 50px;
 _height: 120px;
 text-align: center;
 margin: 0 10px 10px 0;
 vertical-align: top;
 display: inline-block;
 display: -moz-inline-stack;
 zoom: 1;
 *display: inline;
}

.people-list-item
{
 display: inline-block;
 vertical-align: top;
 width: 90px;
 height: 185px;
 margin: 0 9px 9px 9px;
 text-align: center;
}

.people-list-item img
{
 width: 90px;
 height: 120px;
 border: 1px solid #ccc;
}

.people-list-item a
{
 text-decoration: none;
}

.people-image
{
 float: left;
 margin: 0 20px 5px 0;
}

.news-date
{
 font-style: italic;
 font-size: 6pt;
}

.news-lead
{
 font-weight: bold;
}

.news-list-item > h1
{
 margin-bottom: 0;
 line-height: 16pt;
}

.news-list-item > h1 > a
{
 font-size: 14pt;
}

.news-list-item
{
 margin-bottom: 1.5em;
}

.news-list-item p
{
 font-size: 11pt;
 line-height: 15pt;
 color: #e49e87;
 margin-top: 0;
 margin-bottom: 0;
}

.news-list-item > p > a
{
 font-size: 8pt;
}

a
{
 color: #000080;
}

h3 > a
{
 font-family: "times new roman", serif;
 color: #aa8f65;
 font-size: 10pt;
 text-decoration: none;
}

#popup
{
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 z-index: 10000;
 background-color: #333;
 background-color: rgba(0, 0, 0, 0.8);
}

#popup-content
{
 position: relative;
 margin: 10% auto;
 width: 600px;
 max-width: 96%;
 box-sizing: border-box;
 color: #075190;
 background-color: #fff;
 padding: 20px;
}

#popup-content img
{
 max-width: 100%;
}

#popup-close
{
 color: #075190;
 margin: 1em auto 0 auto;
 cursor: pointer;
 text-align: center;
}

#calendar-right
{
 float: right;
}

/* MEDIA QUERIES */

@media all and (max-width: 980px)
{
 #headline > #sjc {display: none;}
 #menu-h {display: block; width: 35px; height: 35px; position: absolute; top: 5px; right: 10px;}
 #search {display: none;}

 nav#menu {position: static; width: 100%; top: 0px; right: 0; z-index: 1000; height: auto;}
 nav#menu > ul {display: none; list-style-type: none;}
 nav#menu > ul > li {float: none; clear: both; display: block; width: 100%; text-transform: uppercase; border-bottom: 1px solid #fff;}
 nav#menu > ul.visible {display: block;}
 nav#menu > ul > li > ul.submenu {padding: 10px 0;}
 nav#menu > ul > li > a, nav#menu > ul > li > span {padding: 10px 0; font-size: 14px;}
 nav#menu > ul > li > ul.submenu > li > a {display: inline-block; padding: 10px 0; width: 100%;}
 nav#menu > ul > li > ul.submenu > li {border-top: 1px solid #fff;}

 #menu > ul ul.submenu {position: relative;}
 #menu > ul > li:hover > ul.submenu > li {text-align: center;}
 span.submenu-open {display: inline-block;}

 #left {padding: 1em;  width: 100%; float: none; box-sizing: border-box;}
 #left img {display: none;}
 article, #content {margin-left: 0; padding: 1em; float: none; max-width: 100%;}
 article img {max-width: 100%; height: auto;}

 #right * {box-sizing: border-box;}
 #right {width: 100%; padding: 10px; margin: 0; box-sizing: border-box;}
 #right .news-item {float: none; width: 100%; padding-left: 10px; background: none;}

 #index-content .news-item {float: none; display: inline-block;}
 #index-bottom {padding: 10px;}

 ul#index-menu > li {float: none; display: inline-block; min-width: 150px;}
 ul#index-menu > li > img {max-width: 100%;}

 #footer {padding: 0 10px; box-sizing: border-box;}

 #right h3 {margin-left: 10px;}
}

@media all and (max-width: 480px)
{
 header #motto {width: 80%; display: block;}
 header #fejlec {margin: 10px auto 0 auto;}
 ul#index-menu > li {display: block; margin: 0 auto;}

 #calendar-right {float: none;}

}
