@import"../css/reset.css";@import"../css/skeleton.css";@import"../css/superfish.css";@import"../css/flexslider.css";@import"../css/forms.css";@import"../css/reset1.css";@import"../css/cycle2.css";
body{background: #F8F8FF; font:12px/20px Arial, Helvetica, sans-serif;color:#7c7876;position:relative;min-width:320px;}
/*background:#e7e7e7 url(../images/bg-light.png) 50% 0 no-repeat; url(../images/background_DG1.png) 50% 0 no-repeat*/
/*background: #F8F8FF;font:12px/20px Arial, Helvetica, sans-serif;color:#7c7876;position:relative;min-width:320px;*/
html,body{height:100%;}
p{padding-bottom:20px}
a{color:#000000;outline:none;cursor:pointer;text-decoration:none;} /*#04c7d0*/
a:hover{text-decoration: underline;}
/*  Header styles */
h1,h2,h3,h4,h5,h6{line-height:1.2em;color:#382c27; font-weight:normal; font-family:Arial, Helvetica, sans-serif;}
h1{font-size:30px;}
h2{font-size:25px;}
h3{font-size:23px;} 
h4{font-size:20px; padding-bottom:15px;}  
h5{font-size:18px;}
h6{font-size:14px;}
/* Global Structure---------------------------------------- */
.bg{ width:100%; padding:0; background:url(../images/bg-content.png) 0 0 repeat;}
.ft{ font-size: 0px; width:100%; padding:0; background: url(../images/bg-content.jpg) 0 0 repeat;}
/*----- txt,links,lines,titles -----*/
.clear{clear:both;line-height:0;font-size:0;overflow:hidden;height:0;width:100%;}
.wrapper{width:100%;overflow:hidden;position:relative;}
.extra-wrap{overflow:hidden;display:block;}
.fleft{float:left}
.fright{float:right}
.alignright{text-align:right}
.aligncenter{text-align:center}
.alignmiddle *{vertical-align:middle}
.it{ font-style:italic !important;}
.color1{color:#0461d0;} /*#04c7d0*/
.text1{ font:16px/20px Arial, Helvetica, sans-serif; color:#7c7977; padding-bottom:17px;}
	.text1 a{ color:#7c7977;}
.text2{ font:16px/20px Arial, Helvetica, sans-serif; color:#7c7977; padding-bottom:17px;}
.und{ text-decoration:underline;}
.und:hover{ text-decoration:none;}
/*********************************header*************************************/
header{ position:relative; z-index:99; padding-bottom:39px;}
header.padheader{ padding-bottom:37px;}
header h1{ padding:61px 0 0 0;}
	header h1 a{ display:block; background:url(../images/logo.png) 0 0 no-repeat; width:256px; height:77px; text-indent:100px;}
/********************** Content ************************/
section{ position:relative; z-index:1;}
.box-img{ display:inline-block; background:#fff; padding:0; position:relative; overflow:hidden;}
	.box-img img{ max-width:100%; height:auto;}
	a.box-img span{ display:block; background:url(../images/box-hover.png) 0 0 repeat; color:#fff; width:114px; height:103px; position:absolute; top:10px; left:10px; padding:10px 5px 10px 10px; opacity:0;
	-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
	a.box-img span strong{ display:block; text-transform:uppercase;}
	a.box-img:hover span{ opacity:1;}
	a.box-img:hover{ text-decoration:none;}
.icons{ position:relative; overflow:hidden;}
	.icons li{ float:left; margin-right:3px;}
	.icons li a img{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
	.icons li a:hover img{ opacity:.7;}
	.icons.icons2{ padding:3px 0 0 0;}
	.icons.icons2 li{ float:left; margin-right:1px;}
.dropcap{ font:30px/36px Arial, Helvetica, sans-serif; color:#0461d0; float:left; padding:2px 8px 0 5px;} /*#04c7d0*/
.list1 li{ background:url(../images/marker.png) 0 7px no-repeat; padding:0 0 5px 20px;}
	.list1 li a{color:#7c7876; text-transform:uppercase;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
	.list1 li a:hover{color:#1459d0; text-decoration:none;}/*5cbe00*/
	.list1.list1-2 li a{ text-transform:none;}
	.list1.list1-2 li a span{ text-transform: uppercase;}
.list2{ list-style-position:inside; color:#453834; padding-bottom:40px;}
	.list2 li{font-size:12px; font-style:italic; padding:5px 0 0 0;}
	.list2 li a{ color:#7f7c7a; padding-left:2px;}
.list3{ padding-bottom:2px;}
	.list3 li{ font-weight:bold; background:url(../images/marker2.jpg) 0 7px no-repeat; padding:0 0 5px 15px;}
	.list3 ul{ padding:4px 0 0 0;}
	.list3 li li{ font-weight:normal; background:none; padding:0 0 2px 14px; font:12px/14px Arial, Helvetica, sans-serif;}
	.list3 li li a{color:#5b5755;}
.list4{ padding:16px 0 0 0;}
	.list4 li a{color:#7c7876; text-decoration:underline;}
	.list4 li a:hover{ text-decoration:none;}
.list5 li{ background:url(../images/krug2.png) 0 7px no-repeat; padding:0 0 5px 20px;}
	.list5 li a{color:#7c7876; text-transform:uppercase;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
	.list5 li a:hover{color:#1459d0; text-decoration:none;}
	.list5.list5-2 li a{ text-transform:none;}
	.list5.list5-2 li a span{ text-transform: uppercase;}
.box{ position:relative; overflow:hidden; padding:33px 0 6px;}
	.box img{ float:left; margin:5px 10px 0 0;}
	.box p{ overflow:hidden; padding-bottom:0;}
.box2 p{ padding-bottom:15px;}
	.box2 .fleft{ width:79px;}
	.box2 a{ margin-top:8px;}
.contacts{ font-style:normal;}
	.contacts span{ display:inline-block; width:70px;}
	.contacts p:first-child{ text-transform:uppercase; padding-bottom:25px;}
	.contacts a{ text-decoration:underline; color:#0461d0;}
	.contacts a:hover{ text-decoration:none;}
.map{ box-shadow:0 0 2px rgba(0,0,0,.1); margin:4px 0 6px 0;}
	.map iframe{ width:390px; height:312px;}
/*  Buttons */
.button{display:inline-block; font:italic 16px/24px Arial, Helvetica, sans-serif;color:#fff;padding:13px 13px 12px; border-radius:5px 5px 0 0;
	background: #1459d0;/*#03d0d9....024da6..a9d0fe....tamno plava 024da3...#0259bf*/
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#9bb2db), to(#1459d0 ));/*(#5ba7fd, #024da3 )*/
	background: -webkit-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: -moz-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: -ms-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: -o-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	-pie-background: linear-gradient(#9bb2db, #1459d0 );}/*(#5ba7fd, #024da3 )*/
	.button:hover{ text-decoration:none; background:#212020;-pie-background: linear-gradient(#212020, #212020);}
.button1{ display:inline-block;font:italic 15px/18px Arial, Helvetica, sans-serif; color:#1d1d1d;
	-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
	.button1:hover{ text-decoration:none; color:#1459d0;}/*03d1da*/
.link1{ text-transform:uppercase;color:#7c7876; }
/******************** Footer ******************/
footer{ padding:20px 0 20px; max-width:950px; margin:0 auto; text-align:center;}
footer.padfooter{ padding-top:41px;}
	footer a{color:#7c7876; margin:1px;}
.link{ display:inline-block; margin:3px 8px 0 0;}
	.link img{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;}
	.link:hover img{ opacity:.8;}
/* padding */
.padtop5{ padding-top:25px;}
.padtop{ padding:26px;}
.padtop3{ padding-top:38px;}
.padtop33{ padding-top:34px;}
.padtop22{ padding-top:43px;}
.padtop2{ padding-top:49px;}
.padtop23{ padding-top:56px;}
.padbot4{ padding-bottom:14px; padding-right:40px;}
.padbot{ padding-bottom:23px;}
.padbot2{ padding-bottom:25px;}
.padbot3{ padding-bottom:27px;}
.padbot32{ padding-bottom:30px;}
.padbot22{ padding-bottom:43px;}
.padbot6{ padding-bottom:62px;}
.padbot7{ padding-bottom:8px;}
.pad{ padding:17px 0 12px 0;}
.pad2{ padding:2px 0 28px 0;}
.pad3{ padding: 2px 0 0 0;}
.imgindent{ margin:5px 0 0 10px;}
/*==========================================*/
@media only screen and (min-width: 768px) and (max-width: 995px) {
	header h1 a{ width:156px;}
	.box-img{ display:block;}
	.padbot4{ padding-right:0;}
	.padbot22{ padding-bottom:63px;}
	.padbot23{ padding-bottom:42px;}
	.map iframe{ width:290px;}
	.icons2 li a img{ width:40px; height:auto;}
}
@media only screen and (max-width: 767px) {
	header{ padding-bottom:30px;}
	header h1.fleft{ float:none; padding-bottom:20px;}
	.img1 img{ width:320px;}
	.col1{ width:140px !important; float:left;}
	.marg,.marg2{ margin-right:20px;}
	.box-img{ display:block;}
	.hide{ display:block;}
	.hide2{ display:none !important;}
	.col3{ float:left; width:130px !important;}
	.col3.col3-2{ float:none; width:100% !important;}
	.col3 .box-img{ display:block;}
	.col3 .box-img span{ width:95px; height:90px; padding-top:5px;}
	.col4{ float:left;width:130px !important;}
	.map iframe{ width:300px;}
	.padbot3{ padding-bottom:0;}
	.padRT{ padding-bottom:30px;}
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.img1 img{ width:420px;}
	.col1,.col2{ width:200px !important; float:left;}
	.marg{ margin-right:20px;}
	.marg2{ margin-right:0px;}
	.box-img{ display:inline-block;}
	.hide{ display:none;}
	.col3,.col3.col3-2{ float:left; width:120px !important;}
	.col3 .box-img{ display:block;}
	.col3 .box-img span{ width:85px; height:75px; padding-top:10px;}
	.col4{ float:none;width:120px !important;}
	.map iframe{ width:420px;}
	.contacts p{ float:left; margin-right:50px; padding-bottom:0;}
}
/* Project specifics =========================================================== */


/* Pour some CSS below ========================================================= */
/*==================boxes====================*/
.fox {font:italic 16px/24px Arial, Helvetica, sans-serif; 
	background:url(../images/box-bg.gif) 0 100% repeat-x #1459d0;padding:24px 18px 40px 20px;border-radius:10px 10px 10px 10px;
	background: #1459d0;/*#03d0d9....024da6..a9d0fe....tamno plava 024da3...#0259bf*/
	background: -webkit-gradient(linear, 0 0, 0 bottom, from(#9bb2db), to(#1459d0 ));/*(#5ba7fd, #024da3 )*/
	background: -webkit-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: -moz-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: -ms-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: -o-linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	background: linear-gradient(#9bb2db, #1459d0 );/*(#5ba7fd, #024da3 )*/
	-pie-background: linear-gradient(#9bb2db, #1459d0 );behavior:url(../js/PIE.htc);position:relative;color:#fff}
	.fox h2 {color:#FFFFFF;background:url(../images/bd_bot.gif) 0 50% repeat-x;padding-bottom:20px;margin-bottom:20px;line-height:30px;letter-spacing:-1px}
	.fox h3 {font-weight:normal;color:#000;font-size:16px;line-height:22px;text-transform:none}
		.fox h3 a {color:#000}
.address {float:left;margin:0 30px 10px 0}
.address.last {margin-right:0}
	.address dt {margin-bottom:4px;text-transform:uppercase}
	.address dd {clear:both}
		.address dd span {float:left;padding-right:25px}
		.address dd a {color:#c0c0c0}
/* Accordion */
.accordion dt {font-size:16px;line-height:1.2em;color:#000;position:relative;padding:10px 0 5px 40px;height:1%}
	.accordion dt img {position:absolute;left:0;top:10px}
	.accordion dt a {color:#fff}
.accordion dd {display:none;padding:0 0 0 40px}
/*================boxes====================*/
.box3 {font: 14px/24px Arial, Helvetica, sans-serif; color:#7c7977; /*border:1px solid black; background:#fff; */
	padding:0px 18px 40px 0px; border-radius:10px 10px 10px 10px;
	behavior:url(js/PIE.htc);position:relative;color:#000;
	}
	.box3 h2 {font-size:18px; color:#000000;background:url(../images/marker3.png) 0 100% repeat-x;padding-bottom:20px;margin-bottom:0px;line-height:0px;letter-spacing:-1px}
	.box3 h3 {font-weight:normal;color:#000;font-size:16px;line-height:22px;text-transform:none}
		.box3 h3 a {color:#000; text-decoration:none;}
/* Accordion */
.accordion1 dt {font-size:16px;color:#000;position:relative;padding:10px 0 5px 20px;height:10%;  margin:0px; /*border-bottom: 1px dotted black;*/}
	.accordion1 dt img {position:absolute;left:0;top:14px; /*background-image: url(../images/arrow-d.png);*/}
	.accordion1 dt a {color:#000;}
	.accordion1 dt img1 {position:absolute;left:0;top:15px; content:url(../images/blueButtons-PDFx16.png);} 
	.accordion1 dt:hover{background: #EBEBF0;
				
				-moz-box-shadow: 3px 3px 4px #888;
				-webkit-box-shadow: 3px 3px 4px #888;
				box-shadow: 3px 3px 4px #888;
				
				/* For IE 8 */
				-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888')";
				/* For IE 5.5 - 7 */
				filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#888888');
				cursor: pointer; cursor: hand; padding:12px 0 5px 20px; text-decoration: none; }
.accordion1 dd {font-size:14px;display:none; padding:0 0 0 10px;}
	.accordion1 dd a {color:#1459d0;}
	.accordion1 dd a:hover{color:#1459d0;}
/* ====================Google Map===============*/
#map_canvas { margin: 0; padding: 0; height: 100% }

/* ====================News ticker===============*/
* { margin:0; padding:0; }

#newsticker-demo { 
width:310px; 

font-family:Arial, Helvetica, Sans-Serif;
font-size:14px;

}

#newsticker-demo a { text-decoration:none; }
#newsticker-demo img { border: 2px solid #FFFFFF; }

#newsticker-demo .title {
text-align:center;
font-size:14px;
font-weight:bold;
padding:5px;
}

.newsticker-jcarousellite { width:630px; }
.newsticker-jcarousellite ul li{ list-style:none; display:block;}
.newsticker-jcarousellite .thumbnail { float:left; width:155px; height:150px;}
.newsticker-jcarousellite .info { float:right; width:450px; }
.newsticker-jcarousellite .info span.cat { display: block; font-size:12px; color:#7c7977; }

.clear { clear: both; }

/*=============== news ticker - liScroll styles ==========================*/

.tickercontainer { /* the outer div with the black border */
border: 1px solid #000;
background: #fff; 
width: 738px; 
height: 27px; 
margin: 0; 
padding: 0
overflow: hidden; 
}
.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
position: relative;
left: 10px;
top: 8px;
width: 718px;
overflow: hidden;
}
ul.newsticker { /* that's your list */
position: relative;
left: 750px;
font: bold 10px Verdana;
list-style-type: none;
margin: 0;
padding: 0;

}
ul.newsticker li {
float: left; /* important: display inline gives incorrect results when you check for elem's width */
margin: 0;
padding: 0;
background: #fff;
}
ul.newsticker a {
white-space: nowrap;
padding: 0;
color: #ff0000;
font: bold 10px Verdana;
margin: 0 50px 0 0;
} 
ul.newsticker span {
margin: 0 10px 0 0;
} 
/* ====================Popup slike===============*/
.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 2px;
left: -1000px;
border: 1px black;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 100;
left: 60px; /*position where enlarged image should offset horizontally */

}

/* ====================Footer===============*/

/*-----------------------------------------------------------------------------------*/
/*	5.	SLIDERS
/*-----------------------------------------------------------------------------------*/

/* CYCLE */

#cycle-wrapper {
	position: relative;
	width:960px;
	height: 300px;
	margin: 0 auto 90px;
}

#sliderholder-cycle {
	width:960px;
	height: 300px;
	overflow: hidden;
	background:transparent;
	-moz-box-shadow: 0px 1px 3px #8e8e8e;
	-webkit-box-shadow: 0px 1px 3px #8e8e8e;
	box-shadow: 0px 1px 3px #8e8e8e;
}

.slidernav {
	padding: 0;
	margin: 18px 0 0 0;
	list-style: none;
	text-align: center;
}

.slidernav a {
	cursor: pointer;
	background-color: #cbcbcb; 
	overflow: hidden;
	width: 10px;
	height: 10px;
	margin: 0 3px;
	text-indent: -99999px;
	display: inline-block;
}

.slidernav a:hover, .slidernav .activeSlide {
	background-color: #8c8c8c;
}

.sliderprev, .slidernext {
	display:block;
	width:35px;
	height:35px;
	background:url(images/slider-arrows.jpg) no-repeat;
	text-indent:-9999px;
	border:0;
	cursor: pointer;
	position: absolute;
	-moz-box-shadow: 0px 1px 2px #888;
	-webkit-box-shadow: 0px 1px 2px #888;
	box-shadow: 0px 1px 2px #888;
}

.slidernext {
	background-position: right top;
	right: -60px;
	top: 46%;
}

.slidernext:hover {
	background-position: right bottom;
}

.sliderprev {
	background-position: left top;
	left: -60px;
	top: 46%;
}

.sliderprev:hover {
	background-position: left bottom;
}