/* -----------------------------------*/
/* ---------->>> CSS RESET <<<--------*/
/* -----------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img { border:0; }
address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}
ol, ul { list-style:none; }
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
/* -----------------------------------*/
/* ---------->>> GLOBAL <<<-----------*/
/* -----------------------------------*/
body {
	background-color: #f1faff;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 100%;
}
a:link, a:active, a:visited {
	text-decoration: none;
	color: #0f21a5;
	text-decoration: none;
}
a:hover {
	color: #5f5f5f;
	text-decoration: underline;
}
h1 { margin-left: 20px; }
h2 {
	margin-left: 20px;
	color: #213a67;
	font-family: Georgia, "Times New Roman", Times, serif;
	letter-spacing: 0.8px;
	padding-bottom: 5px;
}
p { margin-left: 20px; }
ul { margin-left: 20px; }
.overclear {
	width: 100%;
	overflow: hidden;
}
/* -----------------------------------*/
/* ---------->>> LAYOUT <<<-----------*/
/* -----------------------------------*/
div.outer {
	width: 988px;
	margin: 0 auto 10px;
	background: #f1faff url(../images/side-shadow.png) repeat-y center center;
}
#wrapper {
	width: 960px;
	margin: 0 auto 10px;
	background-color: #fff;
}
#header {
	height: 99px;
	background: url(../images/header.jpg) no-repeat;
}
#header img { margin-left: 10px; }
#nav {
	height: 34px;
	width: 960px;
	background: url(../images/nav-bgrd.jpg) repeat-x;
}
#primary {
	height: 316px;
	background: url(../images/into-bgrd.png) no-repeat;
	float: left;
}
#content div.text {
	float: left;
	width: 950px;
	margin-bottom: 30px;
}
#content div.slike {
	float: right;
	width: 350px;
	margin-top: 50px;
	margin-right: 10px;
}
#content div.slike img {
	margin-left: 15px;
	margin-bottom: 15px;
}
#content h1 {
	font: bold 22px Georgia, "Times New Roman", Times, serif;
	color: #1c48a0;
	border-bottom: 1px solid #B5D6EA;
	margin: 25px 10px 5px 20px;
}
#content h2 {
	font: bold 20px Georgia, "Times New Roman", Times, serif;
	margin-top: 25px;
	margin-bottom: 5px;
	color: #1c48a0;
	border-bottom: 1px solid #B5D6EA;
}
#content div.text p {
	margin-bottom: 6px;
	line-height: 20px;
	color: #333;
	padding-right: 10px;
	font-size: 15px
}
#content div.text p strong {
	color: #1c48a0;
	font-weight: bold;
}
#secondary {
	height: 300px;
	float: left;
	width: 960px;
	background: url(../images/secondary-senka.jpg) no-repeat;
}
#tertiary {
	width: 960px;
	background: #319bd6 url(../images/tertiary-bgrd.jpg) no-repeat;
}
#footer {
	width: 960px;
	margin: 0 auto 15px;
	text-align: center;
}
#footer p, #footer p a {
	margin-left: 0;
	color: #003c5f;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 1px;
}
#footer p a:hover { color: #1f6b98; }
/* -----------------------------------*/
/* ---------->>> HOME <<<-----------*/
/* -----------------------------------*/
div.intro {
	width: 460px;
	float: left;
}
div.intro h1 {
	padding-top: 30px;
	margin-bottom: 15px;
	font-size: 22px;
	color: #fff;
	text-indent: -9999px;
	background: url(../images/naslov-pocetna.jpg) no-repeat bottom left;
	width: 378px;
	height: 24px;
}
div.intro h1.lat {background: url(../images/lat-naslov-pocetna.jpg) no-repeat bottom left;}
div.intro p {
	color: #fff;
	font-size: 16px;
	margin-bottom: 15px;
	margin-right: 15px;
	letter-spacing: 0.8px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}
div.intro p strong { font-weight: bold; }
div.intro p.button { margin-top: 20px; }
div.slideshow {
	background: url(../images/slide-bgrd.jpg);
	width: 466px;
	height: 283px;
	float: right;
	margin-top: 20px;
	margin-right: 20px;
}
#secondary p {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 16px;
	line-height: 20px;
}
div.usluge, div.mastersistem, div.proizvodi {
	float: left;
	width: 300px;
}
div.mastersistem, div.proizvodi { margin-left: 17px; }
#secondary h2 {
	font-weight: bold;
	font-size: 21px;
	margin-top: 20px;
	border-bottom: 1px solid #b5d6ea;
	margin-bottom: 10px;
	padding-left: 33px;
}
div.usluge h2 { background: url(../images/bullet-usluge.jpg) no-repeat 0 3px; }
div.mastersistem h2 { background: url(../images/bullet-mastersistem_01.jpg) no-repeat 0 3px; }
div.mastersistem img {
	float: left;
	width: 117px;
	margin-left: 20px;
	margin-right: 3px;
}
div.proizvodi h2 { background: url(../images/bullet-proizvodi.jpg) no-repeat 0 3px; }
div.proizvodi img {
	margin-left: 20px;
	margin-top: 3px;
}
div.usluge ul li {
	padding-left: 20px;
	background: url(../images/bullet-usluge.png) no-repeat 0 3px;
	padding-bottom: 5px;
	letter-spacing: 0.6px;
}
div.usluge ul li a, div.usluge a:link, div.usluge a:visited { color: #000; }
div.usluge ul li a:hover {
	color: #5f5f5f;
	text-decoration: underline;
}
div.mastersistem p span a, div.proizvodi p span a, div.vesti p a {
	color: #267cae;
	padding-right: 10px;
	background: url(../images/strelica.png) no-repeat 100% 60%;
	font-size: 14px;
	letter-spacing: 1px;
}
div.vesti p a { background: url(../images/strelica-bela.png) no-repeat 100% 60%; }
div.vesti {
	float: left;
	width: 620px;
}
div.vesti h2 {
	margin-top: 15px;
	font-size: 20px;
	border-bottom: 1px solid #77b4d8;
	color: #fff;
	font-weight: bold;
	letter-spacing: 1px;
	font-variant: small-caps
}
div.vesti h3 {
	margin-top: 5px;
	padding-left: 20px;
	color: #fff;
	font-size: 18px;
}
div.vesti h3 a { color: #fff; font-variant:small-caps; letter-spacing: 0.8px;}
div.vesti img {
	float: left;
	margin: 5px 5px 5px 20px;
}
div.vesti p {
	margin-top: 5px;
	color: #fff;
}
div.vesti p a { color: #daeef9; }
div.vesti p.detaljnije {
	margin-top: 0;
	margin-bottom: 15px;
}
div.baneri {
	float: left;
	width: 330px;
}
div.baneri img {
	margin-left: 35px;
}
div.baneri img.petko { margin-top: 20px;}
div.baneri img.silkon { margin-top: 5px;}
div.baneri p.facebook {
	margin: 10px auto 20px 35px;
}
p.facebook a { color: #fff;}
div.baneri p.facebook img {
	margin-left: 0;
}
#vesti div.text div img {
	float: left;
	margin: 10px 30px 10px 20px;
	clear: both;
}
#vesti div.text hr {
	clear: both;
	border-bottom: 1px dotted #ccc;
	margin: 10px 15px 30px;
	padding: 0;
	padding-top: 20px;
}
/* -----------------------------------*/
/* ---------->>> Usluge <<<-------*/
/* -----------------------------------*/
#usluge div.text { min-height: 520px; }
#usluge div.text h1 {
	margin-top: 25px;
	margin-bottom: 5px;
	color: #1c48a0;
	width: 500px;
	letter-spacing: 0.8px;
}
#usluge div.text h2 { }
#usluge div.text img {
	float: right;
	margin: 7px 5px 5px 10px;
}
#usluge div.text div { clear: both; }
#usluge div.text div img {
	float: left;
	margin: 7px 25px 20px 0;
}
/* -----------------------------------*/
/* ---------->>> proizvodi <<<-------*/
/* -----------------------------------*/
#proizvodi div.text { clear: both; }
img.cisa, img.cisa_proizvodi {
	float: left;
	margin-right: 40px;
	margin-left: 20px;
}
img.cisa_proizvodi { margin-top: -28px; }
#proizvodi div.text h2 {
	font: bold 20px Georgia, "Times New Roman", Times, serif;
	margin-top: 25px;
	margin-bottom: 5px;
	color: #1c48a0;
	border-bottom: 1px solid #B5D6EA;
	margin: 25px auto 5px 360px;
}
div.text hr {
	clear: both;
	padding-top: 20px;
	margin-left: 20px;
	border: none
}
#vesti div.text h2 {
	font: bold 20px Georgia, "Times New Roman", Times, serif;
	color: #1c48a0;
	margin: 25px 10px 5px 20px;
	border:none;
}
#vesti div.text { min-height: 600px; }
#vesti div.text p { margin: 15px 25px 10px 15px;}
#kontakt div.text {
	float: left;
	width: 400px;
}
#kontakt #content img {
	float: right;
	margin: 30px 20px;
	border: 2px solid #ccc;
}
#o-nama div.text { width: 550px; }
/* -----------------------------------*/
/* ---------->>> s3slider <<<-----------*/
/* -----------------------------------*/
#s3slider {
	width: 446px; /* important to be same as image width */
	height: 265px; /* important to be same as image height */
	position: relative; /* important */
	overflow: hidden; /* important */
	margin-top: 7px;
	margin-left: 8px;
}
#s3sliderContent {
	width: 446px; /* important to be same as image width or wider */
	position: absolute; /* important */
	top: 0; /* important */
	margin-left: 0; /* important */
}
.s3sliderImage {
	float: left; /* important */
	position: relative; /* important */
	display: none; /* important */
}
.s3sliderImage span {
	position: absolute; /* important */
	left: 0;
	font: 14px/16px Arial, Helvetica, sans-serif;
	padding: 5px 13px 10px 13px;
	width: 420px; /* important to be same as image width MINUS PADDING! */
	background-color: #2b607d;
	filter: alpha(opacity=70); /* here you can set the opacity of box with text */
	-moz-opacity: 0.7; /* here you can set the opacity of box with text */
	-khtml-opacity: 0.7; /* here you can set the opacity of box with text */
	opacity: 0.7; /* here you can set the opacity of box with text */
	color: #fff;
	display: none; /* important */
	bottom: 0;
	text-align: center;/*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}
.clear { clear: both; }