/*-- required & default rules --*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}

body {
background: #ddd;
font: normal 62.5% Tahoma, Arial, sans-serif;
text-align: center;
margin: 20px;
padding: 0;
}

#okvir {
width: 700px;
height: 370px;
top: 50%;
left: 50%;
margin-top: -195px;
margin-left: -360px;
position: absolute;
background: #fff;
border: 10px solid #eee;
}

#head {
float: right;
width: 700px;
height: 40px;
}

a.main_logo {
float: left;
width: 160px;
height: 40px;
}

h1 {
float: left;
width: 160px;
height: 40px;
background: url(images/logo.gif) no-repeat;
text-indent: -9999px;
}

h2 {
float: left;
width: 390px;
padding: 10px 10px 0 0;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
text-align: right;
color: #000;
}

h3 {
float: left;
width: 390px;
padding: 5px 0 0 5px;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
text-decoration: underline;
font-weight: normal;
text-align: left;
color: #000;
}

#nav {
float: left;
width: 340px;
height: 26px;
margin: 14px 0 0 0;
padding: 0;
list-style-type: none;
font-family:"Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size: 1.2em;
font-weight: bold;
}

#nav li {
margin: 0;
padding: 0;
float: right;
}

#nav a, #nav a.onama, #nav a.usluge, #nav a.klijenti, #nav a.kontakt, #nav a.faq {
float: left;
margin: 0 0 0 1px;
padding: 2px 5px 0px 5px;
text-align: center;
color: #000;
text-decoration: none;
line-height: 1.5;
}

#nav a.onama {
border-bottom: 5px solid #df6400;	
}

#nav a.usluge {
border-bottom: 5px solid #4b91ac;	
}

#nav a.klijenti {
border-bottom: 5px solid #60932c;	
}

#nav a.kontakt {
border-bottom: 5px solid #a3170a;	
}

#nav a.faq {
border-bottom: 5px solid #712788;	
}

#nav a.onama:hover {
background: #fff;
color: #df6400;
border-bottom: 5px solid #df6400;	
}

#nav a.usluge:hover {
background: #fff;
color: #4b91ac;
border-bottom: 5px solid #4b91ac;	
}

#nav a.klijenti:hover {
background: #fff;
color: #60932c;
border-bottom: 5px solid #60932c;	
}

#nav a.kontakt:hover {
background: #fff;
color: #a3170a;
border-bottom: 5px solid #a3170a;	
}

#nav a.faq:hover {
background: #fff;
color: #6e3cb9;
border-bottom: 5px solid #712788;	
}


#nav a.activ {
background: #ddd;
color: #000;
border-bottom: 5px solid #000;
}

div.servisi {
float: right;
width: 200px;
height: 30px;
padding: 10px 0 0 0;
background: #fff;
}

div.kontakt_map {
float: left;
width: 380px;
height: 275px;
margin: 10px 0 0 0;
padding: 0 10px;
}

div.kontakt_form {
float: left;
width: 380px;
height: 275px;
margin: 10px 0 0 0;
padding: 0 9px;

}

#content {
float: right;
width: 700px;
height: 330px;
background: #dcd;
font-family: Tahoma,Arial,sans-serif;
}

#onama_main, #usluge_main, #klijenti_main, #kontakt_main, #faq_main {
float: left;
width: 400px;
height: 330px;
padding: 0 0 0 100px;
background: #fff url(images/main.jpg) left no-repeat;
}

#usluge_main {
background: #fff url(images/usluge.jpg) left no-repeat;
color: #4b91ac;
}

#klijenti_main {
background: #fff url(images/klijenti.jpg) left no-repeat;
}

#kontakt_main {
background: #fff url(images/kontakt.jpg) left no-repeat;
}

#faq_main {
background: #fff url(images/faq.jpg) left no-repeat;
}

p.text, p.center, p.centerx {
float: left;
width: 380px;
padding: 0px 5px;
margin: 10px 0 0 0;
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: justify;
line-height: 18px;
color: #555;
}

p.center {
margin: 0px;
text-align: center;
}

p.centerx {
width: 200px;
margin-top: 40px;
text-align: left;
}

img.upit, img.upitx {
margin: 10px 0 0 0;
}

img.upitx {
float: left;
margin: 5px 0 0 70px;
}

ul.klijenti_lista {
float: left;
width: 350px;
list-style-type: none;
padding: 0px 10px;
margin: 10px 0 0 0;
font: 12px Tahoma,Arial,sans-serif;
line-height: 150%;
text-align: left;
color: #555;
}

ul.klijenti_lista li {
margin: 0;
padding: 0 0 0 20px;
width: 100%;
height: 19px;
float: left;
background-image: url(images/x.gif); 
background-repeat: no-repeat;
background-position: 0 center;
}

ul.klijenti_lista a:link, ul.klijenti_lista a:visited {
color: #555;
text-decoration: underline;
}

ul.klijenti_lista a:hover, ul.klijenti_lista a:active {
color: #555;
text-decoration: none;
}

ul.usluge_pitanja, ul.faq {
float: left;
width: 350px;
list-style-type: none;
padding: 0px 10px;
margin: 10px 0 0 0;
font: 12px Tahoma,Arial,sans-serif;
line-height: 150%;
text-align: left;
}

ul.usluge_pitanja li, ul.faq li {
margin: 0;
padding: 0 0 0 20px;
width: 100%;
height: 19px;
float: left;
background-image: url(images/u.gif); 
background-repeat: no-repeat;
background-position: 0 center;
}

ul.faq li {
background-image: url(images/f.gif); 
}

#sub_onama, #sub_usluge, #sub_klijenti, #sub_kontakt, #sub_faq {
float: right;
width: 180px;
padding: 0 10px;
height: 330px;
background: #df6400;	
font-family: Helvetica;
}

#sub_usluge {
background: #4b91ac url(images/usluge.gif) bottom right no-repeat;		
}

#sub_klijenti {
background: #60932c url(images/klijenti.gif) bottom right no-repeat;		
}

#sub_kontakt {
background: #a3170a url(images/kontakt.gif) bottom right no-repeat;		
}

#sub_faq {
background: #712788 url(images/kontakt.gif) bottom right no-repeat;		
}

ul.sub {
float: right;
width: 180px;
margin: 10px 0 0 0;
padding: 0;
list-style-type: none;
font-size: 1.2em;
}

ul.sub li {
margin: 0;
padding: 0;
width: 100%;
float: right;
}

ul.sub a.onama, ul.sub.onama a:hover, ul.sub a.usluge, ul.sub.usluge a:hover, ul.sub a.klijenti, ul.sub.klijenti a:hover, ul.sub a.kontakt, ul.sub.kontakt a:hover, ul.sub a.faq, ul.sub.faq a:hover {
float: left;
width: 170px;
margin: 0;
padding: 5px 10px 5px 0;
text-align: right;
color: #fff;
text-decoration: none;
line-height: 1.5;
font-weight: bold;
border-bottom: 1px solid #ff7a0f;
}

ul.sub a.onama:hover {
background: #e66700;
}

ul.sub a.usluge, ul.sub.usluge a:hover {
border-bottom: 1px solid #5db4d6;
}

ul.sub a.usluge:hover {
background: #519cb9;
}

ul.sub a.klijenti, ul.sub.klijenti a:hover {
border-bottom: 1px solid #79b937;
}

ul.sub a.klijenti:hover {
background: #679d2f;
}

ul.sub a.kontakt, ul.sub.kontakt a:hover {
border-bottom: 1px solid #d21e0d;
}

ul.sub a.kontakt:hover {
background: #b2190b;
}

ul.sub a.faq, ul.sub.faq a:hover {
border-bottom: 1px solid #9b36bb;
}

ul.sub a.faq:hover {
background: #7c2b96;
}

ol.kontakt_data {
float: left;
width: 400px;
margin: 20px 0 0 0;
padding: 0;
font: 12px Tahoma,Arial,sans-serif;
list-style: none; 
text-align: left;
line-height: 200%;
color: #555;
}

ol.kontakt_data label {
float: left;
width: 170px;
margin: 0;
padding: 0 5px 0 0;
font-weight: bold;
text-align: right;
}

strong {
font-weight: bold;
}

fieldset.kontakt {
float: none;
width: 380px;
margin: 0 0 0 0;
padding: 0 0 5px 0;
border: 1px solid #ccc;
background: #fff;
font: 12px Tahoma,Arial,sans-serif;
color: #555;
}

fieldset.submit {
float: none;
width: auto;
margin: 0 0 0 0;
padding: 10px 0 10px 0px;
border: 0px solid #fff;
}

fieldset ol {
margin: 0px 1px 0 1px;
padding: 0;
list-style: none; 
background: #caa;
}

fieldset li {
float: left;
clear: left;
width: 100%;
margin: 0 0 2px 0;
padding-bottom: 0px;
background: #fff;
}

legend {
margin-left: 10px;
color: #a3170a;
font: 13px Arial,sans-serif;
font-weight: bold;
}

label {
float: left;
width: 120px;
margin-right: 5px;
padding: 4px 0 4px 5px;
border-right: 0;
text-align: right;
}

fieldset.kontakt input.text {
width: 226px;
padding: 2px;
font: 12px Tahoma,Arial,sans-serif;
color: #a3170a;
background: #eee;
border: 1px solid #ddd;	
}

fieldset.kontakt textarea {
width: 226px;
padding: 2px;
height: 60px;
font: 12px Tahoma,Arial,sans-serif;
color: #a3170a;
background: #eee;
border: 1px solid #ddd;	
}

.button {
border: 1px solid #ccc;
background: #eee;
color: #a3170a;
width: 78px;
}

.button:hover {
border: 1px solid #000;
background: #a3170a;
color: #fff;
}

a.link:link, a.link:visited {
text-decoration: underline;	
color: #000;
}

a.link:hover, a.link:active {
text-decoration: none;	
color: #000;
}

label.red {
color: #c00;
}

div.upit_note {
float: left;
width: 382px;
padding: 0 9px;
}

p.bed, p.good {
float: left;
width: 370px;
padding: 5px;
margin: 5px 0 0 0;
border: 1px solid #b2190b;
background: #b2190b;
color: #dff;
font: 12px Helvetica,sans-serif;
font-weight: bold;
}

p.good {
border: 1px solid #679d2f;
background: #679d2f;	
}