/* Prezentacija TS Stork Group Kula */
/* Eska Nikola Februar 2013*/

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------
:: Osnove
:: Page
:: Distributeri
:: Proizvodi
:: Footer
:: Kontakt
*/


/* -----------------------------------------
   Osnove
----------------------------------------- */

body {font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;}


#full-screen-background-image {
  z-index: -999;
  min-height: 100%;
  min-width: 1024px;
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
}


h1,h2,h3,h4,h5,h6 {font-family:'SourceSansProSemibold';}
.row h3 {text-align:right;text-shadow:1px 1px 0 #fff;}

.clear{clear: both;}
p img {float:left; padding:5px 10px 5px 0;}

ul#logo {position:fixed;top:0;left:0;z-index:10000;}
ul#logo li{ margin:0; padding:0px; display:inline; float:left; clear:both; color:#aaa; font:11px Helvetica, Arial, sans-serif; }
.start_big {width: 97.9999%;}
.start {margin:2% 2% 2% 0;width: 31.3333%;padding: 2% 0}
.start_with_slider {margin:10% 0 0 0;}


/* -----------------------------------------
   Language_bar
----------------------------------------- */

#language_bar{width:100%;height:15px;background:#2D6A89;position:fixed;top:0;z-index: 10000;float:left;}
#language_bar li {margin:0;padding:0 10px;float:right;display:block;line-height:12px;}
#language_bar li a{padding:0 5px;margin:0;color:#fff;line-height:12px;font-size:10px;font-family:Arial, Helvetica, sans-serif;text-transform:uppercase;font-weight:bold;}
#language_bar li a:hover{color:#F3EA19;text-shadow:0 0 10px #fff;}
.top-bar{margin-top:15px}

#language_bar p {margin:0;padding:0;line-height:0;text-align:center;color:#2D6A89;}

/* -----------------------------------------
   Page
----------------------------------------- */
.page {padding-bottom:20px;background:url(../img/transparent_bcg.png) repeat;
border:solid 1px #e7e7e7;
-webkit-border-radius: 0px 10px 10px 10px;
-moz-border-radius: 0px 10px 10px 10px;
border-radius: 0px 10px 10px 10px;
-webkit-box-shadow: 0px 5px 32px 11px #f8f7f7;
-moz-box-shadow: 0px 5px 32px 11px #f8f7f7;
box-shadow: 0px 5px 32px 11px #f8f7f7;
}

.page_opaque {background:#fff;}
.more_transparent {background:url(../img/transparent_bcg2.png) repeat;}
.wrapper{padding:10px 20px;}
.wrapper2{padding: 20px;}
.page .video{width:80%;margin:0 auto;z-index:1;}
.page h5 {margin-bottom:10px}
.dumb_div{width:100%;height:100px;display:block;float:left;}
ul.proces_proizvodnje{list-style-position: inside;display: block;margin: 5px 0;padding: 0;height: auto;}
ul.proces_proizvodnje li{margin: 0;padding: 0 0 0 5px;width: 100%;line-height: 1.6em;font-size:13px;}
ul.proces_proizvodnje li:hover{color:#111;}
ul.proces_proizvodnje ul{margin: 0;padding: 0 0 0 15px;width: 100%;height: auto;list-style-type: disc;}
p.galerija{margin:20px auto; width:900px;clear:left;}
.sa_linkom img , p.galerija img{width:18%;padding:4px;margin:5px;border:1px solid #eee;background:#fff;}
.sa_linkom  img {width:auto;margin-right:10px;}
.sa_linkom  img:hover ,p.galerija img:hover{background:#2D6A89;-webkit-transform: scale(1.05, 1.05);
-moz-transform: scale(1.05, 1.05);
-o-transform: scale(1.05, 1.05);
-webkit-transition: all linear 0.2s;
-moz-transition: all linear 0.2s;
-o-transition: all linear 0.2s;
-ms-transition: all linear 0.2s;
transition: all linear 0.2s;}

.underline{display: block;border-bottom: dotted 1px #dedede;}

ul.priznanja{margin-bottom:20px;}

ul.vesti {list-style:none;}
ul.vesti li{border-top:solid 1px #ddd;border-bottom:solid 1px #eee;margin:0;padding:0 0 5px 0;font-size:11px;}
ul.vesti li.prvi{border-top:none;}
ul.vesti li.zadnji{border-bottom:none;}
.vesti a {display:block;font-size:13px;color:#2D6A89;font-weight:bold;margin-top:10px;}
.vesti a:hover {text-decoration:underline;color:#000;}
.vesti span {clear:both;display:block;font-size:9px;color:#999;text-transform:uppercase;margin-bottom:5px;}

/*=======================================================================
DISTRIBUTERI
 ========================================================================*/

.distribucija{padding:20px}
.distribucija img{float:left;padding-right:20px}
.distribucija li{list-style:none;}
.distribucija li.zeleni{color:#7fd84b}
.distribucija li.zeleni span{background:url(../img/zeleni.png) no-repeat 0 0;padding-right:22px;}
.distribucija li.crveni{color:#d84b4b}
.distribucija li.crveni span{background:url(../img/crveni.png) no-repeat 0 0;padding-right:22px;}
.distribucija li.plavo{color:#12a9e0}
.distribucija li.plavo span{background:url(../img/plavo.png) no-repeat 0 0;padding-right:22px;}


ol.slats{list-style:none;}
ol.slats li{margin:0;padding:0 0 35px 0}
ol.slats.no_thumbs li{padding:0 0 10px 0}
ol.slats li:last-child{border-bottom:none;margin-bottom:20px;padding-bottom:20px}
ol.slats li h3{font-size:18px;font-weight:700;line-height:1.1;margin:15px 0 0 0;}
ol.slats li h3 a img{float:left;border:1px solid #eee;margin:0 10px 0 0;padding:4px}
ol.slats li h3 a:hover img{background:#eee}
ol.slats li p{line-height:1.4;margin:0 0 0 76px}
ol.slats li p strong{font-weight:normal;color:#000;padding-right:5px;}
ol.slats li span.meta{display:block;font-size:12px;color:#999;margin-bottom:20px;}
ol.slats.no_thumbs li span.meta{margin-bottom:0px;}
ol.slats.no_thumbs{margin-top:20px;}
ol.slats.no_thumbs li p{line-height:1.4;margin:0}	
ol.slats.no_thumbs li h5 { margin: 0px;line-height:1.1;}
ol.slats.no_thumbs a{border-bottom:dotted 1px #dedede;color:#999;}		
ol.slats.no_thumbs a:hover{border-bottom:dotted 1px #DA251D;color:#DA251D;}
span.tel{background:url(../img/phone.png) no-repeat 0 0;padding-right:22px;}
span.mail{background:url(../img/mail-back.png) no-repeat 0 0;padding-right:22px;}
p.broj_tel{color:#999;}


/*=======================================================================
PROIZVODI
 ========================================================================*/
#content{overflow:hidden;z-index:1}
.contentbox-wrapper{position:relative;left:0;width:30000px;height:auto}
.contentbox{width:620px;float:left;background:#fff;padding:10px}
.contentbox h3{margin:40px 0 10px 0px;letter-spacing:-0.02em;text-align:left;}
.contentbox .desno h3 span{color:#dedede;font-size:0.95em;}
.contentbox p{margin:10px 10px 20px 0px;}

#proizvodi_nav{margin-top: 10px;padding: 5px 10px}
#proizvodi_nav ul li{display:inline;margin-right:10px}
#proizvodi_nav ul li img{width:100px;}
#proizvodi_nav ul li img:hover{-webkit-transform: scale(1.10, 1.10);
-moz-transform: scale(1.10, 1.10);
-o-transform: scale(1.10, 1.10);-webkit-transition: all linear 0.2s;
-moz-transition: all linear 0.2s;
-o-transition: all linear 0.2s;
-ms-transition: all linear 0.2s;
transition: all linear 0.2s;}
#proizvodi_nav a.active{opacity:0.8}

#export_nav{margin-top: 10px;padding: 5px 10px}
#export_nav ul li{display:inline;margin-right:10px}
#export_nav ul li img{width:180px;}
#export_nav ul li img:hover{-webkit-transform: scale(1.10, 1.10);
-moz-transform: scale(1.10, 1.10);
-o-transform: scale(1.10, 1.10);-webkit-transition: all linear 0.2s;
-moz-transition: all linear 0.2s;
-o-transition: all linear 0.2s;
-ms-transition: all linear 0.2s;
transition: all linear 0.2s;}
#export_nav a.active{opacity:0.8}
.button.secondary {background-color: #E9E9E9;border: 1px solid #C3C3C3;color: #1D1D1D;}
.button.secondary:hover, .button.secondary:focus {background-color: #D0D0D0;}
.button {background: none repeat scroll 0 0 #2BA6CB;border: 1px solid #1E728C;box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;color: white;cursor: pointer;display: inline-block; font-family: inherit;font-size: 14px;font-weight: bold;line-height: 1;margin: 0; padding: 10px 20px 11px; position: relative;text-align: center;text-decoration: none;transition: background-color 0.15s ease-in-out 0s; width: auto;}

.sa_slikom{width:90%;height:auto;clear:left;display:block;padding:7px 10px;color:#565656;border:solid 1px #4d8fcb;background:#d1e4f3;margin-left:20px;}
.sa_slikom p{clear:left;display:block;background: url(../img/icon.png) no-repeat left center;height:30px;margin:0;padding-left:45px;line-height:2em;font-size:14px;font-family:Arial, Helvetica, sans-serif;font-weight:bold;text-transform:uppercase;}
.sa_slikom p span{font-weight:normal;text-transform:none;}

/* -----------------------------------------
   Footer
----------------------------------------- */

.video_klip{z-index:1;}
#footer{width:100%;height:67px;position:fixed;bottom:0;left:0;background:url(../img/footer_bcg.jpg) repeat-x left bottom;z-index:100;clear: both;}

ul.footer-main,ul.contentinfo{z-index:1000;zoom:1;padding:0;margin:0;}
.footer-main li {margin: 6px 0 4px 0;padding: 0;float: left;color: #fff;font-family:'SourceSansProBold',"Trebuchet MS", Arial, Helvetica, sans-serif ;z-index:100;}
.footer_logo img{width:50px;}
.footer-main li.first{list-style: none;}
.footer-main li a{padding:0px 10px;line-height:32px;font-size:18px;display:block;margin:0 18px 0 0px;color:#fff;letter-spacing:-0.05em;}
.footer-main li a:hover {color:#F3EA19;}

ul.footer-social {list-style:none;float:right;display:inline;padding:0;margin:0;}
.footer-social li {float:right;display:inline;margin: 6px 0 4px 0;padding: 0;color:#fff;line-height:32px;font-size:18px;font-family:'SourceSansProBold',"Trebuchet MS", Arial, Helvetica, sans-serif ;letter-spacing:-0.05em;}
.footer-social li a{width:26px;height:26px;display:block;margin:0 0 0 10px;padding:0; background:url(../img/icons_soc.png) no-repeat left top;text-indent: 500%;
white-space: nowrap;overflow: hidden;}
.footer-social li a.tw {background-position: right top;}
.footer-social li a:hover{background-position: left bottom;}
.footer-social li a.tw:hover{background-position: right bottom;}


.contentinfo{z-index:100;padding:0}
.contentinfo nav ul{list-style-type:disc;list-style-position:inside;margin-left:5px;}
.contentinfo nav ul li{display:inline;list-style:circle;list-style-position:inside;list-style-type:disc;margin:0 10px 0 0;padding:0 10px 0 0}

#footer p, .contentinfo nav ul li a {color:#fff;border-bottom:dotted 1px transparent;text-transform:uppercase;font-size: 9px;font-family:Arial, Helvetica, sans-serif;font-weight:normal;}
.contentinfo nav ul li a:hover {border-bottom:dotted 1px #fff;}
.contentinfo nav ul li:last-child {margin: 0;padding: 0;border: none;}

#footer p {text-align:right;margin: 5px 0;}	
#footer p a {color:#fff;}
#footer p a:hover {color:#2D6A89;}

.foot_img{position:absolute;right:0;bottom:0;width:300px;height:67px;}


/*=======================================================================
KONTAKT
 ========================================================================*/
ul.kontakt{list-style:none;margin:0 20px 20px 20px;}
.kontakt li {font-size:12px;line-height:1.6em;}


form{margin:0;padding:0}
table.kontakt {width:90%;background: none;border: none;margin:0 5% 0 0;}
table.kontakt tbody tr td {padding: 0px;}
table.kontakt tr{width:100%;}
tr,td,input,textarea{margin:0;padding:0;}
tr{background: none;}
td{padding:0 0 5px}
.error[generated=true]{color:#dc0000;font-size:16px;padding:5px 0 2px 5px}
tr.error td{padding:0}
label{display:none;}
input,textarea{border:1px solid #7a91a1;font:inherit;font-size:14px;line-height:24px;min-height:26px;padding:5px 10px}
input:focus,textarea:focus{outline:none;border-color:#2D6A89}
textarea{height:240px;resize:vertical}
input[type=submit]{margin-top:5px;background:#2D6A89;color:#FFF;font:inherit;width:auto;padding:2px 5px;font-weight:bold;font-size:12px;float:right;}
input[type=submit]:hover{color:#F3EA19;cursor:pointer;}
#response{margin:20px;padding:50px;text-align:center;}
#response .success{color:#08a300;background:url(../img/transparent_bcg.png) repeat;border:solid 1px #08a300;}
#response .failure{color:#dc0000;border:solid 1px #dc0000;}

.sec_code input,.sec_code img{float:left}
.sec_code img{padding: 5px;}

.error{color:#C00}


h3.trebovanje_title{text-align:center;float:none;}
.trebovanje label{display:inline;}
.trebovanje table{width:100%;}
.trebovanje table thead th{text-align:center;}
.trebovanje tr{background:#ECF2FE;}
.trebovanje tr.frutella{background:#F2F2F2;}
.trebovanje tr.osvezavajuci{background:#E3F3E9;}
.trebovanje tr.voda{background:#ECF2FE;}
.trebovanje tr.relaxi{background:#FFE3E3;}
.trebovanje tr.sirupi{background:#EDEDFF;}
.trebovanje tr:hover{background:#E1E1E1;}
.trebovanje td{width:33.33333%;vertical-align: middle;padding:2px 5px 0px 7px;}
.trebovanje tr.ukupno{background:none;}
.trebovanje tr.ukupno td{color:#2D6A89;font-weight:bold;font-size:14px;border-top: dashed 1px #D4D4D4;padding-top:10px;}

.trebovanje input[type="text"]{width:30%;margin: 0 auto;padding:3px 0;font-size:11px;line-height:16px;height:32px;text-align:center;font-weight:bold;outline:none;}
.trebovanje textarea{height:100px;}

.trebovanje .celom_sirinom input[type="text"]{width:100%;}



ul.mapa_sajta{width:300px;margin:0 auto;}
ul.mapa_sajta li{color:#2D6A89;}
ul.mapa_sajta li a{background:transparent;padding: 3px 7px;text-transform:uppercase;font-weight:bold;}
ul.mapa_sajta li a:hover{background: url(../img/transparent_bcg.png); color:#808080;}
ul.mapa_sajta ul li a{background:transparent;padding: 3px 7px;text-transform:none;}





.title h5{font-size:15px;font-family: 'SourceSansProBold', Arial, sans-serif;}
.accordion p{margin-bottom:5px;}
.accordion span{font-weight:bold;}



/* ============ TIMELINE ============= */

div#timelineContainer {
	border-left:2px solid #000;
	margin:20px auto;
	width:900px;
}

div.timelineToggle {
	float:right;
	margin-right:0;
	white-space:nowrap;
}

a.expandAll {
	color:#ccc;
	cursor:pointer;
	background:#000;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	font-size:12px;
	padding:3px 5px;
}

	a.expandAll:hover {
		color:#7DBADF;
		cursor:pointer;
	}

div.timelineMajor {
	clear:left;
	float:left;
	margin:0 0 12px;
	width:900px;
}

	.timelineMajor h2 {
		background:url(../img/timeline_century_tick.gif) left center no-repeat;
		font-family:Palatino,"Times New Roman", Times, serif;
		cursor: pointer;
		font-size:3em;
		font-weight:400;
		margin:0 0 10px;
		padding:4px 4px 4px 20px;
	}

	.timelineMajor h2 span {
		background:#ccc;
		-webkit-border-radius:4px;
		-moz-border-radius:4px;
		border-radius:4px;
		color:#131313;
		letter-spacing:.1em;
		line-height:1.7em;
		padding:3px 5px 1px;
	}

dl.timelineMinor {
	clear:left;
	float:left;
	margin:0 12px 0 0;
	padding:4px 4px 4px 0;
	position:relative;
	width:880px;
}

	.timelineMinor dt {
		background:url(../img/timeline_decade_tick.gif) left center no-repeat;
		clear:left;
		font-size:1.6em;
		list-style-type:none;
		line-height:1.2em;
		margin:0 0 12px;
		padding:0 0 0 24px;
		white-space:nowrap;
	}

		.timelineMinor dt a {
			color:#999;
			cursor:pointer;
		}

		.timelineMinor dt a.closed {
			color:#999;
			font-size:1em;
			margin-left:0;
		}

		.timelineMinor dt a.open {
			color:#7DBADF;
		}

		.timelineMinor dt a:hover {
			color:#7DBADF;
		}

	.timelineMinor dd {
		padding-left:24px;
		width:100%;
	}

		.timelineMinor dd h3 {
			color:#FFF;
			clear:both;
			float:left;
			font-size:1.5em;
			margin:0;
			white-space:nowrap;
		}

.timelineEvent p {
	clear:left;
	float:left;
	line-height:1.5em;
	margin:6px 0 10px;
	width:500px;
}

.timelineEvent h4 {
	clear:left;
	float:left;
	font-size:1.4em;
	font-weight:400;
	margin:10px 0 0;
	padding:0 0 0 20px;
}

.timelineEvent blockquote {
	border-left:2px solid #ccc;
	clear:left;
	float:left;
	font-size:1.8em;
	margin-left:0;
	padding:0 30px;
	width:400px;
}

.timelineEvent blockquote .attribution{
	font-size:0.7em;
	text-align: right;
}


.timelineEvent div.media {
	float:right;
	padding:0 0 12px;
	width:300px;
}

	.timelineEvent .media img {
		border:2px solid #000;
		margin:0;
	}

	.timelineEvent .media p {
		font-size:1.2em;
		margin:0;
		padding:0;
	}

	.timelineEvent .media a:link,.timelineEvent .media a:visited {
		color:#ab221b;
	}

	.timelineEvent .media a:hover {
		color:#7DBADF;
	}
@import url("colorbox.css");

@media only screen and (max-width: 801px) { ul#logo{display:none;} .smanji {width:50%;;margin:10% 0 0 0;}.smanji p{font-size:12px;} }

@media only screen and (max-width: 770px) { .start_with_slider {margin:10% 0 0 0;width:30%;}.contentbox{width:740px;margin:0 auto;}#language_bar2{width:100%;height:15px;background:#808080;position:fixed;top:55px;right:0;z-index: 1;float:left;} .page .video {width: auto;}p.galerija {width: auto;}ul.footer-social {
    display: none;
    float: right;
    list-style: none outside none;
    margin: 0;
    padding: 0;
}}