/*--------------------------------------------------------------------------------------------
1. DEFAULT ELEMENTI
--------------------------------------------------------------------------------------------*/

*{
  behavior: url(iepngfix.htc); 
}

html, body, div, span, form, textarea, input, img, label, table, tr, td, p, hr, h1, h2, h3, h4, h5, ul, li, dl, dt, dd{ 
  margin: 0;
  padding: 0;
  border: none;
}
body{
  color: #fff;
  background-color: #002239;
  font: 12px 'Trebuchet MS', Georgia, Arial, Verdana, 'Times New Roman';
  margin: 0;
  padding: 0;
}

h1{
  font: 2.6em Georgia;
  font-weight: normal;
}
h2{
  font: 1.5em Georgia;
  font-weight: normal;
  color: #cc9900;
  padding: 5px 0 10px;
}

a:link, a:visited, a:active{
  color: #cc9900;
  text-decoration: none;
}
a:hover{
  color: #cc9900;
  text-decoration: underline;
}

big{font-size:1.2em}
small{font-size:0.9em}

em{font-style:normal}

p{padding-bottom:14px;line-height:1.7em}
p.align_r{text-align:right}
p.align_c{text-align:center}
.float_l{float:left}
.float_r{float:right}
.padding_none{padding:0}
.padding_small{padding-bottom:6px}
.padding_big{padding-bottom:22px}
.justify{text-align:justify}

em.round{
  display: block;
  width: 82px;
  height: 27px;
  color: #003050;
  background: url('../images/date-rounded.png') no-repeat;
  font-family: Georgia;
  font-size: 0.9em;
  font-weight: bold;
  padding-top: 3px;
  text-align: center;
}

ul{list-style-image:none;list-style:none}
#main ul{list-style-type:circle;padding:0 0 18px 40px}

.clear{clear:both;width:100%;height:1px}




/*-------------------------------------------------------------------------------------------
2. STRUKTURA STRANICE - CONTAINERS
-------------------------------------------------------------------------------------------*/
#wrapper{
  width: 100%;
  min-width: 910px;
  background: #01416D url('../images/background-gradient.jpg') repeat-x;
}
#container{
  width: 910px;
  margin: 0 auto;
  background: url('../images/background-image.jpg') top center no-repeat;
}




/*-------------------------------------------------------------------------------------------
3. HEADER STRANICE - LOGOTIP I NOVOSTI
-------------------------------------------------------------------------------------------*/
#header{
  height: 190px;
  padding-top: 10px;
  overflow: hidden;
}
#logotip{
  float: left;
  width: 600px;
}

#logotip h1{padding:25px 0 20px}
#logotip h1 a{
  display: block;
  width: 210px;
  height: 90px;
  text-indent: -9999px;
  background: url('../images/prvi-maj-logotip.jpg') no-repeat;
}
#logotip p{padding-left:40px}
#news{
  float: right;
  width: 200px;
}




/*-------------------------------------------------------------------------------------------
4. NAVIGACIJA STRANICE
-------------------------------------------------------------------------------------------*/
#navigation ul{padding-left:25px}
#navigation ul li{
  display: block;
  float: left;
  padding-right: 4px;
}
#navigation ul li a, #navigation ul li a span, #navigation ul li a .left, #navigation ul li a .right{display:block;float:left}
#navigation ul li a{
  height: 52px;
  font-size: 0.9em;
  margin-right: 5px;
}
#navigation ul li a span{
  height: 44px;
  padding-top: 8px;
}
#navigation ul li a strong{
  color: #fff;
  font-size: 1.2em;
}
#navigation ul li a:hover, #navigation ul li a:focus{
  color: #fff;
  text-decoration: none;
}
#navigation ul li a.active span, #navigation ul li a:hover span, #navigation ul li a:focus span{
  background: url('../images/navigation-center.gif');
}
#navigation ul li .left, #navigation ul li .right{
  width: 18px;
  height: 52px;
}
#navigation ul li a.active .left, #navigation ul li a:hover .left, #navigation ul li a:focus .left{
  background: url('../images/navigation-left.png') left top no-repeat;
}
#navigation ul li a.active .right, #navigation ul li a:hover .right, #navigation ul li a:focus .right{
  background: url('../images/navigation-right.png') right top no-repeat;
}




/*-------------------------------------------------------------------------------------------
5. SREDINA STRANICE
-------------------------------------------------------------------------------------------*/
#main{
  padding: 30px 0 20px 40px;
}

a.program{
  display: block;
  float: left;
  width: 173px;
  color: #fff;
  background: url('../images/program_off.png') no-repeat;
  padding: 15px 10px 0 15px;
  margin-right: 26px;
}
a.program h2{color:#fff;padding-bottom:35px}
a.program:hover, a.program:active{
  background-image: url('../images/program_on.png');
  text-decoration: none;
}

.col_program_details{
  height: 52px;
  background: url('../images/h2_back1.png') repeat-x;
  padding: 32px 8px 0 15px;
}
.katalog_box{
  float: left;
  width: 285px;
  height: 154px;
  padding: 0 5px 30px 0;
  overflow: hidden;
}
.katalog_box .slika{
  float: left;
  width: 120px;
  height: 84px;
  color: #000;
  text-align: right;
  padding: 70px 6px 0 0;
}
.katalog_box .boje{
  height: 70px;
}
.katalog_box .info{
  height: 74px;
}
.katalog_box .link{
  float: left;
  width: 130px;
}
.katalog_box .katalog_right{
  float: left;
  width: 155px;
}


/*-------------------------------------------------------------------------------------------
6. FOOTER STRANICE
-------------------------------------------------------------------------------------------*/
#wrapper_footer{
  width: 100%;
  min-width: 910px;
  height: 210px;
  background: url('../images/footer-back.gif') repeat-x;
  overflow: hidden;
}
#container_footer{
  width: 870px;
  background: url('../images/footer-image-back.gif') right 83px no-repeat;
  padding-left: 40px;
  margin: 0 auto;
}
#footer_text{
  height: 210px;
  background: url('../images/footer-image-people.jpg') no-repeat;
  padding: 30px 0 0 240px;
}
#footer_text .float_l{
  padding-right: 50px;
}
#footer_text #footer_top{
  padding-bottom: 30px;
}
#footer_text #footer_top big{
  color: #002239;
  font-family: Georgia;
  font-size: 3.2em;
}
#footer_text #footer_top .float_r{
  padding: 15px 95px 0 0;
}





/*-------------------------------------------------------------------------------------------
6.2. OSTALI ELEMENTI STRANICE - TEXT, BUTTON...
-------------------------------------------------------------------------------------------*/
label{
  font-size: 1.1em;
}
p.button_align{
  padding-left: 111px;
}
.text, .text_select{
  color: #fff;
  background-color: #002239;
  border: 1px solid #ccc;
  padding: 5px 7px;
}
.text_select{padding:3px 5px}
.button{
  color: #fff;
  background-color: #002239;
  border: 1px solid #fff;
  font-family: 'Trebuchet MS';
  font-size: 1.2em;
  font-weight: bold;
  padding: 4px 15px;
}

p.ok, p.error, p.help{
  color: #000;
  background-position: 10px center;
  background-repeat: no-repeat;
  border-width: 1px;
  border-style: solid;
  padding: 8px 10px 8px 32px;
  margin-bottom: 18px;
}
p.ok{
  background-color: #e5fcd9;
  background-image: url('../images/icons/message-ok.gif');
  border-color: #67C058;
}
p.error{
  background-color: #fceae3;
  background-image: url('../images/icons/message-error.gif');
  border-color: #E3775B;
}
p.help{
  background-color: #e8f1fc;
  background-image: url('../images/icons/message-help.gif');
  border-color: #73A9E3;
}