﻿@charset "utf-8";
body { margin:0; padding:0; width:100%; background:#e8e8e8; font:Calibri, Arial;}
html { padding:0; margin:0;}

.clr { clear:both;}

/* main */
.main {width:1024px; padding:0; margin:0 auto; }

/* header */
.header { float:left;width:1024px; margin:0px auto; padding:0px auto; height:200px; background:url("../images/newheader_bg.jpg") no-repeat;}
.header .naslov { font: normal bold 48px Calibri, Arial;	margin: 20px 0 0 20px; padding: 0px 0 5px 0; float: left; font-weight: normal; letter-spacing: 5pt;	line-height: 52px;}
.jezik {
	font: normal 14px Calibri, Arial;
	margin: 5px 5px 0 0;
	padding: 0px auto;
	float: right;
	font-weight: normal;
	color: #ffffff;
}
.jezik a { color:#d9231f; text-decoration:none;}
.jezik a:hover { color:red; text-decoration:underline;}
/* menu */
.menu { width:500px; height:80px;margin :0px auto; padding:0px auto; float:right; font: 14px Calibri, Arial;}
.menu ul { float: right; margin: 45px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style: none; height:80px;}
.menu li { float: left;	margin: 0px 0px 0px 0px; padding: 0px auto;	font-weight: bold 14px; color: #fff; float: left; }
.menu a {line-height: 16px;	float: left; font-weight: normal 14px; color: #fff; padding: 5px 5px 14px 5px;	margin: 0px auto; text-decoration: none; }
.menu a:hover  {color:#fff; background: #212121;  }
.menu a:hover div  {background: #6F6F6F;} 
.menu a.active {color:#fff; background: #d9231f;}
.menu a.active div {background: #6F6F6F;} 

/* scroller */
.scroller { float:left;width:1024px; margin:0px auto; padding:0px auto; height:120px;}
.text_left {background: transparent; width: 600px; margin: 0px auto; float: left; padding: 0px 0px 0px 20px; font-size: 12px; color: #ffffff; }
.text_left h1 {	margin: 10px auto; padding: 0px auto; font: normal 36px Calibri, Arial; color: #ffffff; line-height: 36px;}
.text_left p { margin:5px auto;font:normal 18px Calibri, Arial; color:#ffffff;}
.img_right { /*padding:10px 40px;*/ float:left;}

/* white */
.white { width:1024px; float:left; margin:0 auto; padding:0px auto; font: 12px Calibri, Arial; background:#fff url("../images/white_bg.gif") no-repeat; line-height:1.6em;}

.white .left { width:700px; float:left; margin:0 auto; padding:20px; color:#212121;}
.white .left h1 { margin:20px 0 0 0;font :normal 30px Calibri, Arial; color:#212121;}
.white .left h3 { margin:30px 0 0 0;font :normal 24px Calibri, Arial; color:#212121;}
.white .left h5 { font:italic 12px Calibri, Arial; color:#212121;}
.white .left a { color:#d9231f; text-decoration:none;}
.white .left a:hover { color:red; text-decoration:underline;}
.white .left .datum {width: 200px;	float: left;	margin: 20px 0px 0px 10px;	font: 11px Calibri, Arial;	color: #505050;}
.white .left2 { width:950px; float:left; margin:0 auto; padding:20px; color:#212121;}
.white .left2 h1 { margin:20px 0 0 0;font :normal 30px Calibri, Arial; color:#212121;}
.white .left2 h3 { margin:30px 0 0 0;font :normal 24px Calibri, Arial; color:#212121;}
.white .left2 h5 { font:italic 12px Calibri, Arial; color:#212121;}
.white .left2 a { color:#d9231f; text-decoration:none;}
.white .left2 a:hover { color:red; text-decoration:underline;}

.white .right { width:260px; float:right; margin: 20px 15px 0 0;}
.white .right a { color:#d9231f; text-decoration:none;}
.white .right a:hover { color:red; text-decoration:underline;}
.white .right h2 {font :normal 24px Calibri, Arial; color:#212121;}
.white .right p {
	margin: 10px auto;
	font : normal 12px Calibri, Arial;
	color: #000000;
}
.white .right ul {
	margin: 5px 0 0 0;
	padding: 5px 0 0 0;
	font : normal 12px Calibri, Arial;
	color: #CC0000;
}
.white .right li {
	margin: 5px auto;
}


.white .right img { float: right; padding:3px; border:3px solid #5a5a5a; margin:30px 40px 0 0;}

/* grey*/
.grey {
	width: 1024px;
	float: left;
	margin: 0 auto;
	padding: 0 auto;
	background: #1a1a1a url("../images/grey_bg.jpg");
	border-top: 3px solid #d9231f;
	line-height: 1.4em;
	
	font-size: 9pt;
}
.grey h3 {
	color: #FFFFff;
	margin: 0px 0 0 0;
	padding: 10px 0px 0px 10px;
	font: bold 10pt Calibri, Arial;
	width:auto ;
}
.grey a { color: #E8E8E8; 	text-decoration: none;}
.grey a:hover {	color: #ffffff;	text-decoration: underline;}
.grey p { color: #AFAFAF; margin:5px auto;padding :0px 0px 0px 10px;}
.grey .col1 {float:left; width:190px; margin-left:5px; padding:0px 0px !important; padding:0px 0px 0px 0px;}
.grey .col2 {float:left; width:130px; margin-left:5px; padding:0px 0px !important; padding:0px 0px 0px 0px;}

/* portfolio*/
.portfolio { 	width: 1024px;
	float: left;
	margin: 0 auto;
	padding: 0;
	background: #212121;
	font: 12px Calibri, Arial;
	color: #fff;
}
.portfolio .left { width:450px; float:left; margin:0 auto; padding:45px 0px 0px 50px; color:#6f6f6f;}
.portfolio .right {width:450px; float:right; margin:0 auto; padding:50px 15px 5px 0px;}
.portfolio h1 {font: italic bold 35px Calibri, Arial; color:#ffffff;  margin:0;}
.portfolio p {font: italic 16px Calibri, Arial; color:#a1a1a1; padding:0; margin:0;}

/* blog*/
.blog {
	width: 1024px;
	float: left;
	margin: 0 auto;
	padding: 0;
	background: #212121;
	font: 12px Calibri, Arial;
	color: #fff;
}
.blog .left { width:450px; float:left; margin:0 auto; padding:45px 0px 0px 50px; color:#6f6f6f;}
.blog .right {width:450px; float:right; margin:0 auto; padding:50px 15px 5px 0px;}
.blog h1 {font: italic bold 35px Calibri, Arial; color:#ffffff;  margin:0;}
.blog p {font: italic 16px Calibri, Arial; color:#a1a1a1; padding:0; margin:0;}

/* about*/
.about { width:1024px; float:left; margin:0 auto; padding:0; background:#212121; font: 12px Calibri, Arial; color:#fff;}
.about .left {width:450px; float:left; margin:0 auto; padding:45px 0px 0px 50px; color:#6f6f6f;}
.about .right {width:450px; float:right; margin:0 auto; padding:50px 15px 5px 0px;}
.about h1 {font: italic bold 35px Calibri, Arial; color:#ffffff;  margin:0;}
.about p {font: italic 16px Calibri, Arial; color:#a1a1a1; padding:0; margin:0;}

/* contacts*/
.contacts { width:1024px; float:left; margin:0 auto; padding:0; background:#212121; font: 12px Calibri, Arial; color:#fff;}
.contacts .left {width:400px; float:left; margin:0 auto; padding:0; color:#6f6f6f;}
.contacts .right {width:500px; float:right; margin:0 auto; padding:50px 15px 5px 15px;}
.contacts h1 {font: italic bold 35px Calibri, Arial; color:#e5e5e5; padding:45px 0 45px 90px; margin:0;}
.contacts p {font: italic 16px Calibri, Arial; color:#a1a1a1; padding:0; margin:0;}

/* columns_a*/
.columns_a { width:1024px; float:left; margin:0 auto; padding:0; background:#fff; font: 12px Calibri, Arial; color:#6f6f6f;}
.columns_a ul { list-style:none; padding:0 20px; margin:0;}
.columns_a li { border-bottom:1px solid #e7e7e7; line-height:2.5em; background:url("../images/ul.gif") no-repeat left center; padding:0 0 0 20px;}
.columns_a a {color:#30606c; text-decoration:underline;}
.columns_a h1 {font: italic bold 24px Calibri, Arial; color:#305f6b; line-height:0.5em;}
.columns_a .all_a { width:1024px; float:left; margin:0 auto; padding-top:15px; }
.columns_a .all_a .text { width:550px; float:left; margin:0 auto; padding:20px; }
.columns_a .all_a  p {padding-top:20px;}
.columns_a .all_a .left_a {width:600px; float:left; margin-top:20px; margin-right:10px; margin-bottom:15px; margin-left:20px; background:#fff; color:#6f6f6f; }
.columns_a h4 { font: italic 11px Calibri, Arial; color:#bbbaba;}
.columns_a .all_a .left_a .name_l { width:258px; height:190px; float:left; margin:15px; background:#dfdfdf; color:#999999; border:1px solid #d1d1d1; }
.columns_a .all_a .left_a .name_r { width:280px; height:190px; float:right; margin:15px; font: 12px Calibri, Arial; color:#6f6f6f; }
.columns_a .all_a .right_a { width:250px; float:right; margin-top:20px; margin-right:30px; margin-bottom:15px; padding:10px;}
.columns_a .all_a .right_a a { font:bold 12px Calibri, Arial; color:#6f6f6f; text-decoration:none;}
.columns_a .all_a .right_a a:hover { text-decoration:underline; color:#30606c;}
.columns_a .all_a .right_a a.active { text-decoration:underline; color:#30606c;}

/* columns*/
.columns { width:1024px; float:left; margin:0 auto; padding:0; background:#fff url("../images/white_bg.jpg"); font: 12px Calibri, Arial; color:#6f6f6f;}
.c_text {width:1004px; float:left; margin:0 auto; padding-left:20px; padding-top:20px; color:#4a4a4a;}
.c_text_r { float:right; padding:20px;}
.c_text_r div { float:right; width:100px; height:20px; background:#242424 url("../images/2_portfolio_top_right.gif") top right no-repeat;}
.c_text_r div div {width:100px; height:20px; background: url("../images/2_portfolio_top_left.gif") top left no-repeat;}
.c_text_r div div div {width:100px; height:20px;  background: url("../images/2_portfolio_bottom_left.gif") bottom left no-repeat;}
.c_text_r div div div div {width:100px; height:20px;  background: url("../images/2_portfolio_bottom_right.gif") bottom right no-repeat;}
.c_text_r a { font:12px Calibri, Arial; color:#fff; text-decoration:none; line-height:1.6em;}
.c_text_r a:hover { text-decoration:underline;}

.columns .all { width:1024px; float:left; margin:0 auto; padding-bottom:10px;border-bottom :1px solid #dfdfdf;  }
.columns h3 {
	font: italic bold 18px Calibri, Arial;
	color: #2f2f2f;
	padding-left: 20px;	
	margin-bottom:0px;
}
.columns p {padding:0px 0px 0px 20px; 	margin:0px 0px 5px 0px;font : 10pt Calibri, Arial;}
.columns .all .left {width:510px;  float:left; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px;  color:#999999;}
.columns .all .right {width:510px; float:left; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; color:#999999;}

/* columns_b*/
.columns_b { width:984px; float:left; margin:0 auto; padding:0; font: 12px Calibri, Arial; color:#6f6f6f; line-height:1.6em;}
.columns_b ul { list-style:none; padding:0 0px; margin:0;}
.columns_b li { border-bottom:1px solid #e7e7e7; line-height:1.7em; padding:0 0 0 5px;}
.columns_b a {color:#969696; text-decoration:underline;}
.columns_b h1 {font: italic bold 24px Calibri, Arial; color:#2f2f2f;}
.columns_b h2 {width: 600px;font : Calibri, Arial 14pt; color:#2f2f2f; float:left ;}

.columns_b .all_b { width:984px; float:left; margin:0 auto; }
.columns_b .all_b .left_b {width:720px; float:left; margin:0px 0px 0px 20px; color:#999999; }
.columns_b .all_b .left_b .name_l {
	width: 720px;
	float: left;
	margin: 20px 0px 0px 10px;
	font: 11px Calibri, Arial;
	color: #505050;
}
.columns_b .all_b a { text-decoration:none;}
.columns_b .all_b a:hover { text-decoration:underline;}
.columns_b .all_b .right_b {		width: 160px;
	float: right;
	margin: 5px 10px 0px 0px;
	padding: 0px;
	font: 12px Calibri, Arial	;
	color: #505050;
}
.columns_b .all_b .right_b a.active { text-decoration:underline; color:#30606c;}
.columns_b .all_b .left_b .name_r { width:200px;float:right; font : 10pt Calibri, Arial;color:#999999	; line-height:1.6em; }
.columns b .all_b .left_b .name_r .img { border-width:0px;}
.columns_b .all_b .left_b .name_l2 { width :550px;float :left; font : 10pt Calibri, Arial;color:#999999	; line-height:1.6em;}
.columns_b .all_b .left_b .name_r2 {  width:200px;float:right; font : 10pt  Calibri, Arial;color:#999999	; line-height:1.6em;}

/* button */
.button { width:100px; height:20px; background:#9f3700 url("../images/top_right.gif") top right no-repeat;}
.button div { width:100px; height:20px; background:url("../images/top_left.gif") top left no-repeat;}
.button div div { width:100px; height:20px; background:url("../images/bottom_left.gif") bottom left no-repeat;}
.button div div div { width:100px; height:20px; background:url("../images/bottom_right.gif") bottom right no-repeat;}
.button a { font: 12px Calibri, Arial; color:#fff; line-height:1.6em; text-decoration:none;}
.button a:hover {text-decoration:underline;}

#contactform { margin:0; padding:0x;}
#contactform * { font-family: Calibri, Arial;; font-size:12px; color:#6f6f6f;}
#contactform ol { margin:0; padding:0; list-style:none;}
#contactform li { margin:0 0 5px 0; padding:0px; background:none; border:none;}
#contactform li.buttons { margin:0; overflow:hidden;}
#contactform label { margin:0; width:150px; display:block; float:left; padding:2px 0; font:bold 12px Calibri, Arial; color:#6f6f6f;}
#contactform label span { font:normal 10px Calibri, Arial; color:#afafaf; margin:0; padding:0;}
#contactform input.text { width:280px; border:1px solid #dcdcdc; margin-bottom:0px; padding:5px 2px; height:16px; background:#f5f5f5;}
#contactform select.drop { width:480px;border:1px solid #dcdcdc; margin-bottom:0px; padding:0px 2px; height:36px; background:#f5f5f5;}

#contactform textarea { width:280px; border:1px solid #dcdcdc; padding:2px; background:#f5f5f5;}
#contactform li.buttons input { padding:3px 20px; margin:0 0 0 150px; background:#9f3700; border:1px solid #9f3700; color:#FFF; float:left;}
/* form style*/
.form_style { padding:0; margin:0;}
.form_style .text { font:bold 14px   Calibri, Arial; color:#6f6f6f; padding:10px 0 10px 40px; margin:0; width:150px; float:left;}
.form_style .form { width:380px; float:left; margin:0; padding:10px 0;}
.form_style .label2 { padding:0; margin:0px 0 0px 190px;}
.form_style .input2 { width:375px; border:1px solid #d6d6d6; background:#fff;}


	/* jQuery lightBox plugin - Gallery style */
	#gallery {
		background-color: #00;
		padding:0px 0px 0px 0px;
		float: left;
	}
	#gallery ul { list-style:none; margin:0px auto; padding:0px 0px 0px 20px; width:auto; float:left;}
	#gallery ul li { display: inline;}
	#gallery ul img {border: solid 1px #ccc;}
	#gallery ul a:hover img {
	border-color: ;
	border: 1px solid #FF9966;	
	color: #fff;
}
	#gallery ul a:hover { color: #ff; }

.photo {
	margin: 0px 1px;
	position: relative;
	width: auto;
	height: auto;
	float: left;
}
.photo img {
	background: #fff;
	border: solid 1px #ccc;
	padding: 5px;
}
.photo span {
	width: 20px;
	height: 18px;
	display: block;
	position: absolute;
	top: 12px;
	left: 12px;
	background: url("../images/digg-style.gif") no-repeat;
}
.sample3 span {
	width: 30px;
	height: 60px;
	display: block;
	position: absolute;
	top: -5px;
	left: -2px;
	background: url("../images/paper-clip.png") no-repeat;
}
 
.sample12 span {
	width: 77px;
	height: 27px;
	display: block;
	position: absolute;
	top: -12px;
	left: 50px;
	background: url("../images/tape.png") no-repeat;
}	

/* footer*/
.footer {
	width: 1004px;
	float: left;
	margin: 0 0 0 0;
	padding: 10px 10px 10px 10px;
	/*background: #1a1a1a;*/
	background-image:url(../images/footer_bg.jpg);
	font: 10pt;
	line-height: 1.6em;
	color: #E8E8E8;
	
}
.footer .l { width:452px; float:left; margin:40pt 0 0 0; padding:10px; color:#989898;}
.footer a { font: 10pt;  color:#989898; text-decoration:none;}
.footer a:hover { text-decoration:underline;}

#tonkarta {
	float:left;
	width:700px;
	}

#tonkarta li {
	float:left;
	padding:5px;
}
