html, body { height: auto; margin: 0; padding: 0; }
body { font-family: Tahoma, Arial, Helvetica, sans-serif; background: #fff url(../images/bg.png) repeat-x 50% 0; color: #474747; width: 100%; overflow: hidden; }
hr { display: none; }
img { vertical-align: middle; border: 0; }
p { margin: 0 0 20px 0; font-size: 14px; line-height: 140%; }
a { color: #21759B; text-decoration: underline; }
a:hover { color: #1F536C; }
h2 { margin: 0 0 5px 0; font-size: 28px; font-weight: normal; color: #21759B; }
h3 { margin: 0 0 25px 0; font-size: 18px; font-weight: bold; }
h4 { margin: 0 0 12px 0; font-size: 15px; font-weight: bold; }
h6 { font-size: 11px; font-weight: normal; margin: 0 0 30px 0; }
/* !/===> Layout */
#wrap { width: 998px; margin: 0 auto; overflow: hidden; position: relative; z-index: 2; background: url(../images/bg_main.png) repeat-y; }
#main { float: left; width: 735px; padding: 0 15px 0 30px; background: #fff url(../images/bg.png) repeat-x 0 -153px; }
aside { float: right; width: 218px; }
#bg2 { width: 50%; height: 100%; position: absolute; top: 0; left: 50%; background: transparent url(../images/bg_aside.png) repeat-x 0 153px; z-index: 1; }
/* !/===> Header */
header { height: 153px; background: url(../images/bg_header.png) no-repeat 50% 0; position: relative; z-index: 2; }
header .wrap { width: 998px; margin: 0 auto; position: relative; }
/* Logo */
header h1 { position: absolute; top: 0; left: 0; }
header h1 a { display: block; position: relative; width: 419px; height: 153px; background: url(../images/logo.png) no-repeat; text-indent: -9999em; z-index: 1; }
.lang-hr header h1 a { background-image: url(../images/logo_hr.png); }
.lang-en header h1 a { background-image: url(../images/logo_en.png); }
.lang-hu header h1 a { background-image: url(../images/logo_hu.png); }
/* Languages */
header .lang { position: absolute; top: 18px; right: 30px; margin: 0; padding: 0; list-style-type: none; }
header .lang li { float: left; margin-left: 8px; }
header .lang li a { float: left; width: 37px; height: 25px; overflow: hidden; position: relative; z-index: 1; text-indent: -9999em; }
header .lang li.hr a { background: url(../images/flag_hr.png) no-repeat; }
header .lang li.hu a { background: url(../images/flag_hu.png) no-repeat; }
header .lang li.en a { background: url(../images/flag_en.png) no-repeat; }
/* !/===> Footer */
footer { background: url(../images/bg_cfooter.png) repeat-x; padding-bottom: 20px; position: relative; z-index: 2; }
footer .wrap { width: 998px; margin: 0 auto; position: relative; z-index: 2; }
/* Partners */
footer .partners { height: 140px; margin: 0 0 15px 0; position: relative; background: url(../images/logo_cfooter.png) no-repeat 530px 5px; }
.lang-hu footer .partners { background: url(../images/logo_cfooter_hu.png) no-repeat 470px 5px; }
.lang-en footer .partners { background: url(../images/logo_cfooter_en.png) no-repeat 490px 5px; }
footer .partners h2 { font-size: 25px; color: #5b5b5b; border-bottom: 1px solid #ccc; width: 450px; padding: 10px 0 3px 0; margin: 0 0 8px 0; }
footer .partners ul { margin: 0; padding: 0; list-style-type: none; }
footer .partners li { margin: 0 10px 0 0; padding: 0; list-style-type: none; float: left; }
footer a.ipa { position: absolute; top: 0; right: 0; width: 150px; height: 150px; text-indent: -9999em; z-index: 2; }
.lang-en footer a.ipa { top: 28px; right: 0; background: #dadada url(../images/logo_ipa_en.png) no-repeat; width: 175px; height: 84px; }
.lang-hr footer a.ipa { top: 28px; right: 0; background: #dadada url(../images/logo_ipa_hr.png) no-repeat; width: 175px; height: 84px; }
.lang-hu footer a.ipa { top: 28px; right: 0; background: #dadada url(../images/logo_ipa_hu.png) no-repeat; width: 175px; height: 84px; }
/* Text */
footer p.eu { background: url(../images/eu.png) no-repeat; padding: 3px 0 8px 60px; font-size: 9px; color: #000; margin: 0 0 5px 0; }
footer p.disclaimer { font-size: 11px; color: #8b8b8b; margin: 0 0 20px 0; }
footer p.copy { font-size: 11px; color: #b0b0b0; margin: 0; padding: 6px 10px 0 0; float: right; width: 45%; text-align: right; }
footer p.copy a { color: #b0b0b0; }
footer p.copy a.alias-logo { color: #b0b0b0; float: right; width: 60px; height: 20px; text-indent: 9999em; background: url(../images/logo_alias.png) no-repeat 100% 0; position: relative; top: -6px; }
footer p.meta-nav { font-size: 11px; color: #b0b0b0; margin: 0; float: left; width: 45%; padding: 6px 0 0 0; }
footer p.meta-nav a { color: #b0b0b0; }
/* !/===> Navigation */
nav { width: 100%; overflow: hidden; margin: 0 0 15px 0; padding: 1px 0 0 0; font-family: Arial, Helvetica, sans-serif; position: relative; height: 60px; }
nav ul { width: 100%; overflow: hidden; margin: 0; padding: 0; list-style-type: none; }
nav li { float: left; font-size: 11px; text-transform: uppercase; margin: 0 2px 0 0; list-style-type: none; }
nav a, nav a:visited { color: #2d2f2f; text-decoration: none; float: left; padding: 10px 8px; }
nav li.on a { background: #fff; }
nav a:hover { color: #0051a1; }
/* Subnavigation */
nav ul ul { position: absolute; top: 30px; left: 0; }
nav ul ul li { text-transform: none; }
nav ul ul li.on a { color: #0051a1; }
/* !/===> Main */
#main { min-height: 930px; }
#main a.prijava { display: block; margin: 34px 0 24px 0; width: 218px; height: 79px; position: relative; z-index: 1; background: url(../images/btn_prijava.png) no-repeat; text-indent: -9999em; clear: both; }
.lang-en #main a.prijava { background-image: url(../images/btn_prijava_en.png); }
.lang-hu #main a.prijava { background-image: url(../images/btn_prijava_hu.png); }
/* !/=== ===> Slider */
#slider { width: 731px; height: 214px; position: relative; margin-bottom: 65px; }
#slider .nivo-controlNav { position: absolute; bottom: -30px; right: 22px; }
#slider .nivo-controlNav a { color: #444; text-decoration: none; float: left; width: 21px; height: 21px; line-height: 18px; font-size: 11px; font-weight: bold; text-align: center; background: url(../images/bg_slider_nav_off.png) no-repeat; margin: 0 0 0 4px; }
#slider .nivo-controlNav a.active { color: #fff; background: url(../images/bg_slider_nav_on.png) no-repeat; }
/* !/===> Article */
article { padding: 0 0 35px 0; }
article .image { display: block; margin: 0 0 15px 0; }
article .image img { padding: 2px; border: 1px solid #ccc; position: relative; top: 3px; }
article .image-left { float: left; margin-right: 13px; }
article .image-right { float: right; margin-left: 13px; }
article h2 { font-family: "Myriad Pro", Tahoma, Arial, Helvetica; font-size: 34px; font-weight: normal; color: #282828; border-bottom: 1px solid #ccc; padding: 0 0 6px 0; margin: 0 0 18px 0; }
article h2 a { text-decoration: none; }
article h2 a:hover { text-decoration: underline; }
article p { margin: 0 0 22px 0; }
article ul { margin-bottom: 22px; font-size: 13px; }
article li { margin: 0 0 4px 0; line-height: 135%; }
/* !/===> Form */
form .error { border: 1px solid #a00; background: #c00; padding: 5px 8px; margin: 0 0 16px 0; }
form .error p { margin: 0; padding: 0; color: #fff; font-size: 12px; }
form .msg { border: 1px solid #0a0; background: #0c0; padding: 5px 8px; margin: 0 0 16px 0; }
form .msg p { margin: 0; padding: 0; color: #fff; font-size: 12px; }
form ol { margin: 0 0 20px 0; padding: 0; list-style-type: none; }
form ol li:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
form ol li { zoom: 1; }
form ol li { margin: 0 0 10px 0; }
form ol li.btns { margin: 26px 0 0 0; padding-left: 200px; }
form ol label { float: left; width: 200px; font-size: 12px; cursor: pointer; position: relative; top: 2px; }
form ol input.txt { width: 300px; padding: 4px 6px; border: 1px solid #ccc; font-size: 12px; }
form ol textarea { width: 300px; height: 100px; padding: 4px 6px; border: 1px solid #ccc; font-size: 12px; }
form ol select { width: 312px; font-size: 11px; padding: 0 0 0 0; }
/* !/===> Aside */
aside { padding: 1px 0 0 0; }
aside section { margin: 0 10px 0 22px; }
/* Search */
aside .search { height: 30px; overflow: hidden; background: url(../images/bg_search.png) no-repeat 15px 2px; position: relative; margin: 0 0 36px 0; }
aside .search input { background: transparent; border: 0; padding: 0; margin: 0; position: absolute; top: 5px; left: 42px; width: 142px; font-size: 16px; color: #242424; font-family: Tahoma, Arial, Helvetica; }
/* Events */
aside .events { margin-bottom: 24px; font-family: Georgia, "Times New Roman", serif; }
aside .events h2 { font-size: 22px; font-weight: normal; color: #181818; margin: 0 0 20px; }
.lang-hu aside .events h2 { font-size: 20px; }
aside .events ul { margin: 0; padding: 0; list-style-type: none; }
aside .events li { margin: 0 0 14px 0; padding: 0; list-style-type: none; }
aside .events li h3, aside .events li h3 a { font-size: 11px; font-weight: bold; margin: 0 0 3px 0; color: #181818; text-transform: uppercase; text-decoration: none; }
aside .events li p { font-size: 11px; color: #666; margin: 0 0 6px 0; }
aside .events li p.date { font-size: 11px; font-weight: bold; margin: 0 0 3px 0; color: #181818; }
aside .events li a.more { font-size: 11px; font-weight: bold; color: #0051a1; text-decoration: none; }
aside .events li a.more:hover { text-decoration: underline; }
/* Events */
aside .map { margin-bottom: 24px; }
aside .map img { border: 1px solid #ccc; }
/* IPA */
aside .ipa { margin: 30px 0 20px 0; text-align: center; }
/* Banners */
aside .banners { margin-bottom: 24px; }
aside .banners a { display: block; margin: 0 0 5px 0; }
/*
* print styles
* inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/
*/
@media print {
* { background: transparent !important; color: #444 !important; text-shadow: none !important; }
a, a:visited { color: #444 !important; text-decoration: underline; }
a:after { content: " (" attr(href) ")"; }
abbr:after { content: " (" attr(title) ")"; }
.ir a:after { content: ""; } /* Don't show links for images */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
img { page-break-inside: avoid; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}
/*
* Media queries for responsive design
*/
@media all and (orientation:portrait) {
/* Style adjustments for portrait mode goes here */
}
@media all and (orientation:landscape) {
/* Style adjustments for landscape mode goes here */
}
/* Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android Chrome)
Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
#wrap { width: 92%; }
header nav li { font-size: 16px; }
aside { display: none; }
#main { float: none; width: 100%; }
.hdimg { display: none; }
article h2 { font-size: 32px; }
article h3 { font-size: 22px; }
article p { font-size: 14px; }
/* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you
j.mp/textsizeadjust
html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
}
/*
* jQuery Nivo Slider v2.1
* http://nivo.dev7studios.com
*
* Copyright 2010, Gilbert Pellegrom
* Free to use and abuse under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*
* March 2010
*/
/* The Nivo Slider styles */
.nivoSlider {
position:relative;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:60;
display:none;
}
/* The slices in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:50;
height:100%;
}
/* Caption styles */
.nivo-caption {
position:absolute;
left:0px;
bottom:0px;
background:#000;
color:#fff;
opacity:0.8; /* Overridden by captionOpacity setting */
width:100%;
z-index:89;
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-caption a {
display:inline !important;
}
.nivo-html-caption {
display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
position:absolute;
top:45%;
z-index:99;
cursor:pointer;
}
.nivo-prevNav {
left:0px;
}
.nivo-nextNav {
right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
position:relative;
z-index:99;
cursor:pointer;
}
.nivo-controlNav a.active {
font-weight:bold;
}
/* !====> Codeigniter Profiler */
#codeigniter_profiler { width: 960px; margin: 0 auto; display: none; font-family: "Helvetica Neue", Helvetica, Arial; line-height: 120%; }
#codeigniter_profiler fieldset { font-size: 12px; }
#codeigniter_profiler table { border-spacing: 3px; width: 938px; }
#codeigniter_profiler table td { padding: 1px 3px; }
#codeigniter_profiler code { font-family: "Courier New"; font-size: 11px; line-height: 14px; }