html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em,
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup,
menu, footer, header, nav, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
}
article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
display: block;
}
a img {border: 0;}
a { color:#40b3e5; text-decoration:none;}
a:hover { text-decoration: underline;}
ul { list-style-type:none;}
/* Typography presets
------------------ */
h1, h2, h3, h4 {font-family: 'PT Sans', sans-serif; font-weight:700;}
h1 {
font-size: 68px;
line-height: 72px;
letter-spacing: -1px;
}
h2 {
font-size: 21px;
line-height: 32px;
color:#2483b3;
}
h2 a{color:#2483b3; text-decoration:none;}
h2 a:hover{color:#395888; text-decoration:none;}
h3 {
font-size: 18px;
line-height: 30px;
}
h4 {
font-size: 16px;
line-height: 24px;
}
body {
font: 13px/22px Arial, Helvetica, sans-serif;
}
.right {float: right;}
.left {float: left;}
/* BOTUNI */
.small, small {
font-size: 13px;
line-height: 18px;
}
.button, .button:visited {
background: #222;
display: inline-block;
padding: 5px 10px 6px;
color: #fff;
text-decoration: none;
-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.3 );
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.3);
text-shadow: 0 1px 1px rgba(0,0,0,0.25);
border-bottom: 1px solid rgba(0,0,0,0.25);
position: relative;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
cursor: pointer;
}
.button:hover {
background-color: #111;
color: #fff;
}
.button:active { top: 1px }
.small.button, .small.button:visited { font-size: 11px; padding: 4px 10px 5px; margin: 8px 10px 8px 0;}
.button, .button:visited, .medium.button, .medium.button:visited {
font-size: 13px;
font-weight: bold;
line-height: 1;
text-shadow: 0 1px 1px rgba(0,0,0,0.55);
}
.large.button, .large.button:visited {
font-size: 14px;
padding: 8px 14px 9px;
}
.super.button, .super.button:visited {
font-size: 34px;
padding: 8px 14px 9px;
}
.zuti.button, .green.button:visited {background: url(main-nav-bg.png) repeat-x 0px -74px; color:#222; }
.zuti.button:hover { background: url(main-nav-bg.png) repeat-x 0px -112px; color:#fff; text-decoration:none;}
.blue.button, .blue.button:visited {background: url(main-nav-bg.png) repeat-x 0px -3px; }
.blue.button:hover { background: url(main-nav-bg.png) repeat-x 0px -112px; text-decoration:none; }
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
display: inline;
float: left;
margin-left: 10px;
margin-right: 10px;
}
.alpha {
margin-left: 0;
}
.omega {
margin-right: 0;
}
.container-12 .grid_1 {
width: 60px;
}
.container-12 .grid_2 {
width: 140px;
}
.container-12 .grid_3 {
width: 220px;
}
.container-12 .grid_4 {
width: 300px;
}
.container-12 .grid_5 {
width: 380px;
}
.container-12 .grid_6 {
width: 460px;
}
.container-12 .grid_7 {
width: 540px;
}
.container-12 .grid_8 {
width: 620px;
}
.container-12 .grid_9 {
width: 700px;
}
.container-12 .grid_10 {
width: 780px;
}
.container-12 .grid_11 {
width: 860px;
}
.container-12 .grid_12 {
width: 940px;
}
/* Selection colours (easy to forget) */
::selection {background: rgb(201,232,60);}
::-moz-selection {background: rgb(201,232,60);}
img::selection {background: transparent;}
img::-moz-selection {background: transparent;}
body {-webkit-tap-highlight-color: rgb(201,232,60);}
#breadcrumb {
font-size: 11px;
color: #8ab12d;
background:#fff;
display:block;
width:100%;
margin-top:-10px;
padding-left:10px;
border-bottom:1px solid #ececec; height:20px;
}
#breadcrumb a {
margin: 0 5px;
text-decoration: none;
color: #999;
}
#breadcrumb a:first-child {
margin-left: 0;
}
#breadcrumb a:hover,
#breadcrumb a:focus {
color: #8ab12d;
}
#breadcrumb a:active {
color: #8ab12d;
}
#breadcrumb strong {
margin-left: 5px;
font-weight: bold;
color: #333;
}
.addthis_toolbox { float:right; display:block; width:130px;}
/* Default Layout: 992px.
Gutters: 24px.
Outer margins: 48px.
Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols 1 2 3 4 5 6 7 8 9 10
px 68 160 252 344 436 528 620 712 804 896 */
body {
background: rgb(248,247,247) url(body-bg.png) repeat-x;
color: rgb(60,60,60);
-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
}
.container-12 {
width: 964px;
margin:0 auto;
position:relative;
}
.header {
width: 960px;
margin:0 auto;
padding:0px 2px;
height:120px;
position:relative;
z-index:100;
}
.shadow {
width: 964px;
background: url(top-shadow.png) no-repeat center bottom;
height:10px;
position:absolute;
top:110px;
z-index:100;
left:0;
}
.header .logo {
width: 208px;
background: url(logo.png) no-repeat center bottom;
height:99px;
position:absolute;
top:10px;
z-index:100;
left:0;
}
.top-menu { position:absolute; top:12px; left:230px;}
.top-menu li {
float: left;
font-size: 11px;
border-right: 1px solid #ddd;
line-height:14px;
}
.top-menu li:last-child,
.top-menu li.last-child {
border-right: none;
}
.top-menu li a {
float: left;
padding: 0 10px;
text-decoration: none;
color: #747475;
}
.top-menu li a:hover,
.top-menu li a:focus {
color: #333;
}
.top-menu li a:active {
color: #666;
}
.top-menu li a.on {
font-weight: bold;
color: #333;
}
.jezici {
position:absolute;
top:5px;
right:5px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background:url(jezici-bg.png) repeat-x;
height:19px;
padding:8px 10px 0px 10px;
border:1px solid #dddddd;
}
.jezici li {
float: left;
font-size: 11px;
border-right: 1px solid #1c75a5;
line-height:12px;
}
.jezici li:last-child,
.jezici li.last-child {
border-right: none;
}
.jezici li a {
float: left;
padding: 0 5px;
text-decoration: none;
color: #1c75a5;
}
.jezici li a:hover,
.jezici li a:focus {
color: #333;
}
.jezici li a:active {
color: #666;
}
.jezici li a.on {
font-weight: bold;
color: #333;
}
.main-nav { position: absolute; top:84px; left:240px; font-family: 'PT Sans', Arial, Helvetica, sans-serif;}
/*
LEVEL ONE
*/
.main-nav ul { position: relative; }
.main-nav ul li { float: left;margin: 0 1px 0 0;font-size: 14px; }
.main-nav ul a:hover { background-position: 0px -2px;}
.main-nav ul a:active {background: #888; }
.main-nav ul li a { display: block; padding: 5px 12px 3px 12px;text-decoration: none;color: #fff;text-shadow: 0 1px 2px rgba(0,0,0,0.15);}
.main-nav ul li a {
background: url(main-nav-bg.png) repeat-x 0px -38px;
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
border-left:1px solid #dddddd;
border-top:1px solid #dddddd;
border-right:1px solid #dddddd;
text-shadow: 0 1px 2px rgba(0,0,0,0.15);
font-weight:700;}
.main-nav ul li a.current{
color: #fff;
background-position: 0px -2px;
}
.main-nav ul li.hover,
.main-nav ul li:hover { color:#fff; position: relative; z-index:10000;}
.main-nav ul li.hover a { color:#333; background-position: 0px -74px; z-index:10000;}
/*
LEVEL TWO
*/
.main-nav ul ul { width: 200px; padding-top:6px; visibility: hidden; position: absolute; top: 100%; left: 1px; z-index:1000;}
.main-nav ul ul li { font-weight: normal; background: #5885a8; color: #000; float: none; }
.main-nav ul ul li:hover { color:#fff; position: relative; }
/* IE 6 & 7 Needs Inline Block */
.main-nav ul ul li a { border-right: none; width: 100%; display: inline-block; height:18px; line-height:18px; padding: 3px 8px; background-image:none; background-color:#fff; color:#000;
-webkit-border-top-left-radius: 0px;
-webkit-border-top-right-radius: 0px;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 0px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-left:0px solid #dddddd;
border-top:0px solid #dddddd;
border-right:0px solid #dddddd;
text-shadow: 0 0px 0px rgba(0,0,0,0.15);
font-weight:400;
font-size:12px;
}
.main-nav ul ul li a:hover, .main-nav ul ul li a.current { border-right: none; width: 100%; display: inline-block; height:18px; line-height:18px; padding: 3px 8px; background-image:none; background-color:#222; color:#fff; }
/*
LEVEL THREE
*/
.main-nav ul ul ul { left: 100%; top: 0; }
.main-nav ul li:hover > ul { visibility: visible; }
.content {
width: 960px;
margin:0 auto;
background: url(container.png) no-repeat left top;
padding:1px 2px 30px 2px;
position:relative;
overflow:hidden;
}
.left-column { overflow:hidden; height:auto; position:relative; padding:0px 0; }
.left-column .box{
width:189px;
height:auto;
padding:10px 15px;
float:right;
margin:10px 0 0 0;
color:#fff;
font-size:13px;
-webkit-border-bottom-left-radius: 3px;
-webkit-border-bottom-right-radius: 3px;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-bottomright: 3px;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;}
.left-column .box h3{ font-size:18px; }
.left-column .box li.title { color:#222;}
.left-column .box li a{ font-size:13px; color:#fff; text-decoration: none; font-weight:bold; display:block; width:100%; position:relative;}
.left-column .box li a:hover{ font-size:13px; color:#222; text-decoration: underline;}
.left-column .box.orange{ background:url(orange.png) no-repeat;}
.left-column .box.zuti{ background:url(zuti.png) no-repeat;}
.left-column .box.plavi{ background:url(blue.png) no-repeat;}
.main-column { height:auto; position:relative; padding:15px 0; }
.main-column h2{ font-weight:400; min-height:48px; margin-top:0px; font-size:32px;}
.grid_3.box h2{ font-weight:400; min-height:64px; font-size:21px;}
.main-column h3{ font-weight:400; min-height:32px; margin-top:18px; font-size:24px;}
.main-column .box{ background:url(sjena-box.png) no-repeat center bottom; padding-bottom:15px; margin-bottom:10px; float:left; }
.main-column .box img{ background:url(sjena-img.png) no-repeat center bottom; padding-bottom:8px; float:left;}
.main-column .box p, .main-column .box h2{ float:left;}
.sadrzaj{ padding:10px 0 10px 10px; }
.main-column ul { padding-left:10px; margin-left:10px;}
.main-column ul li{ list-style-type:disc; padding-left:0px;}
.external { background:url(external-link.png) no-repeat left 5px; padding-left:15px;}
.external:hover { background:url(external-link.png) no-repeat left -25px;}
.sadrzaj p{ text-align: left; margin-bottom:10px;}
blockquote {
text-align:center;
background: #fff;
padding: 8px 15px;
margin:8px 0;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border-right:solid 1px #dcdcdc;
border-bottom:solid 1px #dcdcdc;
color: #2381b1;
font-size:16px;
font-style:italic;
width: 290px;
}
.sadrzaj blockquote p{ margin-bottom:0px;}
.w-100{ width:100%;}
.footer {
padding: 15px 21px 25px 21px;
font-size: 12px;
border-top: 1px solid #ddd;
float:left;
}
.footer ul li {
display: block;
margin: 0 10px 0 0;
padding: 0 10px 0 0;
font-weight: normal;
/*border-right: 1px solid #ccc;*/
color:#949495;
}
.footer ul li:last-child {
margin: 0;
padding: 0;
border: none;
}
.footer p {
margin: 10px 0;
color:#989898;
}
.footer a { color:#8ab12d; text-decoration:none;}
.footer a:hover { color:#8ab12d; text-decoration: underline;}
/* Showcase
-------------*/
#awOnePageButton .view-slide
{
display: none;
}
/* This class is removed after the showcase is loaded */
/* Assign the correct showcase height to prevent loading jumps in IE */
.showcase-load
{
height: 279px; /* Same as showcase javascript option */
overflow: hidden;
}
/* Container when content is shown as one page */
.showcase-onepage
{
/**/
}
/* Container when content is shown in slider */
.showcase
{
position: relative;
margin: auto;
height: 279px; /* Same as showcase javascript option */
overflow: hidden;
}
.showcase-content-container
{
}
/* Navigation arrows */
.showcase-arrow-previous, .showcase-arrow-next
{
display:none;
}
.showcase-arrow-previous
{
left: -60px;
}
.showcase-arrow-previous:hover
{
background-position: 0px -34px;
}
.showcase-arrow-next
{
right: -56px;
background-position: -34px 0;
}
.showcase-arrow-next:hover
{
background-position: -34px -34px;
}
/* Content */
.showcase-content
{
background-color: #fff;
text-align: right;
height: 279px;
overflow:hidden;
}
.showcase-content-wrapper
{
text-align: center;
height: 279px;
width: 940px;
display: table-cell;
vertical-align: middle;
overflow:hidden;
}
/* Styling the tooltips */
.showcase-plus-anchor
{
background-image: url('../images/plus.png');
background-repeat: no-repeat;
}
.showcase-plus-anchor:hover
{
background-position: -32px 0;
}
div.showcase-tooltip
{
background-color: #fff;
color: #000;
text-align: left;
padding: 5px 8px;
background-image: url(../images/white-opacity-80.png);
}
/* Styling the caption */
.showcase-caption
{
color: #000;
padding: 8px 15px;
text-align: left;
position: absolute;
bottom: 0px; left: 0px; top: 0px;
display: none;
width:211px;
height:249px;
padding:20px 30px 10px 10px;
background: url(caption-bg.png) no-repeat;
}
.showcase-caption h2 { color:#fff; font-size:21px; line-height:26px; margin-bottom:8px; }
.showcase-caption p { color:#fff; font-size:13px; line-height:1.6;}
.showcase-onepage .showcase-content
{
margin-bottom: 10px;
}
/* Button Wrapper */
.showcase-button-wrapper
{
clear: both;
margin-top: 0px;
text-align: center;
position:absolute;
top:255px;
left:231px;
}
.showcase-button-wrapper span
{
margin-right: 2px;
padding: 2px 0px 0px 5px;
cursor: pointer;
font-size: 18px;
color: #fff;
}
.showcase-button-wrapper span.active
{
color: #9abe0c;
}
/* Hide button text */
.showcase-thumbnail-button-forward span span,
.showcase-thumbnail-button-backward span span
{
display: none;
}
table.cjenik{font-size: 12px; width:100%;}
table.cjenik tr td {
text-align:center;
background-color: #fff;
padding: 8px;
display: table-cell;
/*width: 100px; */
vertical-align: middle;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
text-align: center;
border-right:solid 1px #ececec;
border-bottom:solid 1px #dcdcdc;
}
tr.row-cjenik td {color: #77a154; font-weight: bold;}
table.cjenik tr td strong{color: #77a154; font-weight: bold;}
table.cjenik thead td {background-color:#cfcfcf; color: #545455; font-weight: bold; border:none;}
tr.row-period td {}
.main-column table.cjenik ul li { list-style-type:none; text-align:left;}
.osnovni_gal { float: right; width:337px; background:url(gallery-bg.png) no-repeat center top; height:auto; margin-bottom:25px; padding:6px; display:inline; overflow:hidden;}
.pikachoose {width: 343px; margin: 0 auto;}
/* Style the thumbnails */
.pika-thumbs{ padding: 0 0px;}
.pika-thumbs li{ height: 44px; width: 63px; overflow: hidden;float: left; list-style-type: none; padding: 0px; margin: 0 0px; cursor: pointer;}
.pika-thumbs li:last {margin: 0;}
.pika-thumbs li .clip {position:relative;height:100%;text-align: center; vertical-align: center; overflow: hidden;}
/* The stage is the wrapper. The image fills 100% the height of the stage */
.pika-stage, .pika-textnav { width: 337px;}
.pika-stage {position: relative; /*background: #fafafa; border: 1px solid #e5e5e5;*/ padding: 0px; text-align:center; width: 337px; height: 232px; overflow:hidden;}
.pika-stage img{height:100%;}
.pika-stage .caption {position: absolute; background: #000; background: rgba(0,0,0,0.45); border: none; font-size: 10px;
color: #ececec; padding:0px 5px; text-align: right; bottom: 5px; left: 5px;}
.pika-stage .caption p {padding: 0; margin: 0; line-height: 10px;}
/* Ths play, pause, prev and next buttons */
.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
.pika-imgnav a.previous {background: url(prev.png) no-repeat left 45%; height: 45px; width: 50px; top: 93px; left: 0px;cursor:pointer;}
.pika-imgnav a.next {background: url(next.png) no-repeat right 45%; height: 45px; width: 50px; top: 93px; right: 0px;cursor:pointer;}
.pika-imgnav a.play {background: url(play.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}
.pika-imgnav a.pause {background: url(pause.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display:none;cursor:pointer;}
/* The previous and next textual buttons */
.pika-textnav {overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}
.pika-textnav a {font-size: 12px; text-decoration: none; color: #333; padding: 4px;}
.pika-textnav a.previous {float: left; width: auto; display: none;}
.pika-textnav a.next {float: right; width: auto; display: none;}
/*for the tool tips*/
.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);border:3px solid black;}
.pika-counter{position: absolute;bottom: 45px;left:15px;color:white;background:rgba(0,0,0,0.7);font-size:11px;padding:3px;-moz-border-radius: 5px;border-radius:5px; display:none;}
/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */
.pika-loader{ background:url(loading.gif) 3px 3px no-repeat #000; background-color:rgba(0,0,0,0.9); color:white; width:60px; font-size:11px; padding:5px 3px;
text-align:right; position:absolute; top:15px; right:15px; }
/* jCarousel Styles */
/*if you're not using the carousel you can delete everything below this */
.jcarousel-skin-pika .jcarousel-container-horizontal { padding: 5px 0px; overflow:hidden;}
.jcarousel-skin-pika .jcarousel-clip-horizontal {height: 46px; width: 307px;}
.jcarousel-skin-pika .jcarousel-item-horizontal { margin:0 4px 0 1px;}