/*
--------------------------------------------------------------------------------------------
1. DEFAULT ELEMENTI - HTML, BODY, H1, H2, P...
--------------------------------------------------------------------------------------------
*/
html, body, div, 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: #999;
  background: #8c8c8c url('../images/background_pattern.jpg');
  font-family: Arial, 'Trebuchet MS', 'Times New Roman', Verdana;
  font-size: 12px;
  line-height: 1.7em;
}

h1{
  font-family: 'Arial';
  color: #999;
  font-size: 4.2em;
  font-weight: bolder;
  font-style: normal;
  padding-bottom: 14px;
  line-height: 0.8em;
  letter-spacing: -4px;
}
h2{
  color: #ffcc33;
  font-size: 1.2em;
  font-weight: normal;
  font-style: italic;
  padding-bottom: 8px;
}
h3{
  color: #ff6633;
  font-size: 1.2em;
  font-weight: bold;
  padding-bottom: 6px;
}
h3.white{
  color: #fff;
}
h4{
  color: #ff9933;
  font-family: 'Trebuchet MS';
  font-size: 1.2em;
}

a{
  color: #ff9933;
  text-decoration: none;
}
a:hover, a:focus, a.active{
  color: #ff6633;
  text-decoration: underline;
}

strong{
  color: #ff6633;
  font-size: 1.2em;
  font-weight: normal;
}
em{
  color: #ff9933;
  font-style: normal;
}

hr
{
  color: #ebebeb;
  background-color: #ebebeb;
  height: 1px;
  margin-top: 10px;
  margin-bottom: 10px;
}

p{padding-bottom:14px;line-height:1.7em}
p.right{
  float: right;
  text-align: right;
  padding-left: 20px;
}
p.link{
  line-height: 1.2em;
}
.border{
  background-color: #fff0e0;
  padding: 12px 14px;
}

ul{list-style-image:none;list-style:none}
#left ul{list-style-type:circle;padding:0 0 13px 30px}
#left ul li{padding:1px 0}

img.slika, img.slika_l, img.slika_r{
  padding: 4px;
  background-color: #fff;
  border: 0px solid #ebebeb;
}
a:hover img.slika, a:hover img.slika_l, a:hover img.slika_r, a:focus img.slika, a:focus img.slika_l, a:focus img.slika_r{
  border-color: #ff9933;
}
img.slika_l{
  float: left;
  margin-right: 10px;
}
img.slika_r{
  float: right;
  margin-left: 10px;
}

.float{
float:left;
width:50%;
padding: 5px 0 5px 0;
}
.clear{clear:both}



/*
-------------------------------------------------------------------------------------------
2. STRUKTURA STRANICE - WRAPPER, CONTAINER
-------------------------------------------------------------------------------------------
*/
#container_all{
  width: 978px;
  margin: 0 auto;
}
#left{
  float: left;
  width: 678px;
  padding-right: 11px;
}
#right{
  float: left;
  width: 289px;
}



/*
-------------------------------------------------------------------------------------------
3. HEADER STRANICE - TOP, HEADER
-------------------------------------------------------------------------------------------
*/
#header{
  color: #fff;
  padding-top: 20px;
}
#header #logotip{
  float: left;
  width: 319px;
  padding-left: 20px;
}
#header #links{
  float: left;
  width: 339px;
  text-align: right;
}
#header #links a{color:#fff}
#header #links a:hover, #header #links a:focus{color:#ff9933}
#header #location{
  clear: left;
  padding-left: 24px;
}



/*
-------------------------------------------------------------------------------------------
4. SREDINA STRANICA - BOX1, BOX2
-------------------------------------------------------------------------------------------
*/
#left .box1, #left .box2{
  width: 678px;
  margin-bottom: 15px;
  overflow: hidden;
}

#left .box1 .border_top{
  width: 678px;
  height: 23px;
  background: url('../images/mid_border_top.png') no-repeat;
  font-size: 2px;
}
#left .box1 .content{
  width: 628px;
  background-color: #fff;
  padding: 0 25px;
  overflow: hidden;
}
#left .box1 .border_bottom{
  width: 678px;
  height: 23px;
  background: url('../images/mid_border_bottom.png') no-repeat;
  font-size: 2px;
}

#left .box2 .border_top{
  width: 678px;
  height: 23px;
  background: url('../images/mid_border2_top.png') no-repeat;
  font-size: 2px;
}
#left .box2 .content{
  width: 628px;
  color: #fff;
  background: #6b6b6b url('../images/mid_border2_mid.gif') repeat-y;
  padding: 0 25px;
  overflow: hidden;
}
#left .box2 .border_bottom{
  width: 678px;
  height: 23px;
  background: url('../images/mid_border2_bottom.png') no-repeat;
  font-size: 2px;
}
#left .box2 .content p{
  padding-bottom: 18px;
}



/*
-------------------------------------------------------------------------------------------
5. DESNA NAVIGACIJA - BOX1, BOX2
-------------------------------------------------------------------------------------------
*/
#right .box1, #right .box2{
  margin-bottom: 15px;
}

#right .box1 .border_top{
  width: 289px;
  height: 23px;
  background: url('../images/column_border_top.png') no-repeat;
  font-size: 2px;
}
#right .box1 .content{
  width: 289px;
  background: #fff url('../images/column_border_mid.gif') repeat-y;
}
#right .box1 .border_bottom{
  width: 289px;
  height: 23px;
  background: url('../images/column_border_bottom.png') no-repeat;
  font-size: 2px;
}

#right .box2 .border_top{
  width: 289px;
  height: 23px;
  background: url('../images/column_border2_top.png') no-repeat;
  font-size: 2px;
}
#right .box2 .content{
  color: #fff;
  width: 289px;
  background: #3299ff url('../images/column_border2_mid.gif') repeat-y;
}
#right .box2 .border_bottom{
  width: 289px;
  height: 23px;
  background: url('../images/column_border2_bottom.png') no-repeat;
  font-size: 2px;
}

#right .box1 .back_proizvodi, #right .box1 .back_izdvojeno, #right .box2 .back_pretraga, #right .box1 .back_kontakt{
  width: 194px;
  background-position: bottom;
  background-repeat: no-repeat;
  padding: 0 70px 0 25px;
}
#right .box1 .back_proizvodi{background-image:url('../images/column_border_proizvodi.png')}
#right .box1 .back_izdvojeno{background-image:url('../images/column_border_izdvojeno.png')}
#right .box2 .back_pretraga{background-image:url('../images/column_border2_pretraga.png')}
#right .box1 .back_kontakt{background-image:url('../images/column_border_kontakt.png')}






/*
-------------------------------------------------------------------------------------------
6. OSTALI ELEMENTI STRANICE - TEXT, BUTTON...
-------------------------------------------------------------------------------------------
*/
fieldset{
  border: 1px solid #CCCC33;
  padding: 12px 20px;
  margin-bottom: 18px;
}
fieldset legend{
  color: #288B10;
  font-family: 'Trebuchet MS';
  font-size: 1.5em;
  font-weight: normal;
  padding: 0 5px;
}

label{
  display: block;
  font-style: italic;
  line-height: 1.2em;
  padding-bottom: 8px;
}
.button{
  color: #fff;
  background-color: #003366;
  border: 1px solid #fff;
  font-family: 'Trebuchet MS';
  font-size: 1.1em;
  font-weight: bold;
  padding: 6px 18px;
  cursor: pointer;
}
.button_main:hover, .button_main:focus{
  color: #fff;
  background-color: #fff;
  text-decoration: none;
}
.text{
  color: #000;
  background-color: #fff;
  border: 1px solid #003366;
  font-family: Arial;
  font-size: 1.2em;
  padding: 6px 8px;
}

p.ok{
  background: #e5fcd9 url('../images/icons/icon_message_ok.gif') 10px center no-repeat;
  border: 1px solid #67C058;
  padding: 6px 10px 6px 35px;
  margin-bottom: 18px;
}
p.error{
  background: #fceae3 url('../images/icons/icon_message_error.gif') 10px center no-repeat;
  border: 1px solid #E3775B;
  padding: 6px 10px 6px 35px;
  margin-bottom: 18px;
}