html, body {
	height:100%;
}
body
{
	margin:0px;
	padding: 0px;
	text-align: left;
	min-height: 100%;
	font-family: 'Roboto', sans-serif;
	}
	
.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}
.cf:after {
    clear: both;
}
/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf { *zoom: 1;}

/* apply a natural box layout model to all elements */
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }
h1, h2, p {
	/*font-family: 'Open Sans', sans-serif;*/
	margin:0;
}
h1 {
	font-size: 36px;
	letter-spacing: -2px;
	line-height: 100%;

}
a{
	text-decoration:none;
}
h1.title {
	font-size: 46px;
	font-weight: 700;
	color: #6a6a6a;
}
h2 {
	font-size: 24px;
}
p {
	line-height:22px;
}
a img, img{
	border:none;
	vertical-align: middle;
}
.lefty{
	float:left;
}

ul{
	list-style-type: none;
	margin:0px;
	padding:0px;
	text-align: left;
}


.homeBg{
	background:#898a8e;
	}
#main-Wrapper{
	position: fixed;
	left:50%;
	margin-left: -600px;
	/*margin:0 auto;*/
	width: 1201px;
	min-height: 720px;
	background: white;
	border-right:1px solid white;
	}
	.head-wrap{
		width:100%;
		height:120px;
		background:#ffc10e; /* žuta */
		
		border-bottom:1px solid white;
		}
		img.drop-Icon{
			float:left;
			width:121px;
			height:120px;
			border-left:1px solid white;
			border-right:1px solid white;
			}
		.head-wrap a{
			float:left;
			}
			.head-wrap a.logo{
				width:445px;
				height: auto;
				padding:20px 0 0px 30px;
				
				}

		.main-Nav{
			float:right;
			width:50%;
			height:100%;
			background: black;
			/*border-right:1px solid white;*/
			}
			.main-Nav li{
				position:relative;
				float:left;
				width:20%;
				height:auto;
				background:#ffc10e;
				border-left:1px solid white;
				}
				.main-Nav li a{
					display:block;
					min-width: 120px;
					min-height: 120px;
					font-size:14px;
					border-bottom:1px solid white;
					color:white;
					text-transform: uppercase;
					font-weight: 500;
					padding:90px 0 0 10px;
					}
					.main-Nav li a:hover{
						border-top:10px black solid;
						height:110px;
						padding-top:80px;
						/*transition: all .3s linear;*/

						}
					.main-Nav li a.active{
						display:block;
						min-width: 120px;
						height:110px;
						border-top:10px black solid;
						color:black;
						text-transform: uppercase;
						font-weight: 500;
						padding:80px 0 0 10px;
						color:black;
						}




		.homeImg{
			width:100%;
			height:480px;
			background: white;
			}

		.grid-Wrap{
			position: relative;
			width:100%;
			height:480px;
			}
			.grid-Wrap li{
				float:left;
				width:10%;
				height:auto;
				
				}
				.grid-Wrap li span.empty{
						display:block;
						position: relative;
						min-width: 120px;
						min-height: 120px;
						text-transform: uppercase;
						font-weight: 500;
						background:rgba(255,193,14, 1);/*ovo ide van na kraju*/
						border-left:1px solid white;
						border-bottom:1px solid white;
						}
				.grid-Wrap li a{
					display:block;
					position: relative;
					min-width: 120px;
					min-height: 120px;
					text-transform: uppercase;
					font-weight: 500;
					background:rgba(255,193,14, 0.6);/*ovo ide van na kraju*/
					border-left:1px solid white;
					border-bottom:1px solid white;
					}
					
					.grid-Wrap li a img{
						width: 100%;
						height: auto;
						z-index: 100;
						}
						.grid-Wrap li a img.more{
							position:absolute;
							width:10px;
							height: 10px;
							z-index: 300;
							bottom:5px;
							right:5px;
						}
						.grid-Wrap li a span.work-overlay{
							position:absolute;
							display:block;
							background:rgba(255,193,14, 0.6);	
							z-index: 200;
							width: 119px;
							height: 119px;
							top:0;
							left:0;
							
							}
							.grid-Wrap li a span:hover {
								background: none !important;
								}
					.grid-Wrap li a.sub{
						background:rgba(255,193,14,1);
						padding:8px 8px 8px 0;
						color:white;
						font-weight: 500;
						text-transform: uppercase;
						text-align: right;
						font-size: 14px;
						letter-spacing: 0px;
						}
						.grid-Wrap li a.sub:hover{
							color:white;
							background-image: url(../images/bg/sub_border.jpg);
							background-position: left bottom;
							background-repeat: repeat-x;
							}
							.grid-Wrap li a.active{
								background:rgba(255,193,14,1);
								padding:8px 8px 0px 0;
								color:black;
								font-weight: 500;
								text-transform: uppercase;
								text-align: right;
								font-size: 14px;
								letter-spacing: 0px;
								background-image: url(../images/bg/sub_border.jpg);
								background-position: left bottom;
								background-repeat: repeat-x;	
								}

			.footer-left{
				float:left;
				width: 120px;
				height:120px;
				padding:15px;
				border-right:2px solid #898B8D;
				}
				.footer-left li{
					float:left;
					width: 32px;
					height:32px;
					margin:5px;
					}
				.footer-left a{
					display: block;
					width: 32px;
					height: 32px;
					background-position: top left;
					background-repeat:no-repeat;
					
					}
					.footer-left a:hover{
						background-position: bottom left;
						}

					.footer-left a.face{
						background-image: url(../images/bg/face.svg) ;
						background-size: 32px 64px;
						}
					.footer-left a.twitter{
						background-image: url(../images/bg/twitter.svg);
						background-size: 32px 64px;
						}
					.footer-left a.google{
						background-image: url(../images/bg/google.svg);
						background-size: 32px 64px;
						}
					.footer-left a.youtube{
						background-image: url(../images/bg/youtube.svg);
						background-size: 32px 64px;
						}

			.footer-right{
				float:right;
				width: 360px;
				height:120px;
				padding:15px;
				border-left:2px solid #898B8D;
				}
				.footer-right img{
					width:270px;
					height:auto;
					margin:20px 0 0 20px;
					}



.text-30{
	position:absolute;
	width:360px;
	height:360px;
	background: white;
	padding: 20px;
	z-index: 400;
	top:-1px;

	}
	.text-30 p{
		font-size:15px;
		color:black;
		font-weight: 400;
		margin:0;
		}
		.text-30 p strong{
			font-weight: 500;
			}

	.uvod{
		/*display:none;*/
		left:600px;
		background-image: url(../images/bg/arrow.png);
		background-position: 15px 0;
		background-repeat: no-repeat;

		}
	.ziri{
		/*display:none;*/
		left:720px;
		background-image: url(../images/bg/arrow.png);
		background-position: 15px 0;
		background-repeat: no-repeat;
		}
	.nagrade{
		/*display:none;*/
		left:840px;
		background-image: url(../images/bg/arrow.png);
		background-position: 15px 0;
		background-repeat: no-repeat;
		}
	.glasovi{
		/*display:none;*/
		right:0px;
		background-image: url(../images/bg/arrow.png);
		background-position: 255px 0;
		background-repeat: no-repeat;
		}

		.main-Nav li a.lnk-uvod:hover + .uvod, .main-Nav li a.lnk-ziri:hover + .ziri, .main-Nav li a.lnk-nagrade:hover + .nagrade, .main-Nav li a.lnk-glasovi:hover + .glasovi{
			display: block;
			}
		

/*radovi*/
.radBg{
	background: #333;
}

.work-wrap{
	width:1000px;
	background:white;
	position: relative;
	padding:35px 35px 15px 35px;
	margin: 0 auto;
	}
	.work-left{
		float:left;
		width:65%;
		/*background: #eaeaea;*/
		padding-right:20px;
		}
		.work-left iframe, .work-left img {
			width: 100%;
			height:auto;
			margin:0 0 20px 0;
			}
			.work-left iframe{
				min-height: 320px;
			}




	.work-right{
		float:left;
		width:35%;
		/*background: red;*/
		border-top:3px solid black;
		padding:10px 0 10px 0;
		}

		label.title{
			display: block;
			font-size: 15px;
			color: black;
			padding:0 0 10px 0;
			text-transform: uppercase;
			}
			h1.title{
				font-size: 30px;
				color: #666;
				font-weight: 500;
				padding:0 0 10px 0;
				border-bottom:1px solid black;
				}

			.redni-broj, .broj-glasova{
				float:left;
				padding:10px 0 10px 0;
				background-image: url(../images/bg/small_border.png);
				background-repeat: no-repeat;
				background-position: bottom left;
				}
				.redni-broj{
					min-width: 80px;
				}

				/*broj glasova mario*/
				/*.broj-glasova{
					position: relative;
					float:right;
					border-bottom:1px solid black;
					padding-right:70px;
					background-image:none;
					}*/
				/*broj glasova Latin*/
				.broj-glasova{
					position: relative;
					display: block;
					width:100%;
					border-bottom:1px solid black;
					padding-right:70px;
					background-image:none;
					clear: both;
					}
					.vote{
						position:absolute;
						top:15px;
						right:0;
						}
						.vote img{
							width:40px;
							height: auto;
						}
					label.sub{
						display: block;
						font-size: 13px;
						color: black;
						padding:5px 0 4px 0;
						font-weight: 300px;
						text-transform: uppercase;
						}
					h2.sub{
						font-size: 15px;
						color: black;
						font-weight: 400px;
						padding:0 0 0px 0;
						}

				.data-wrap{
					display:block;
					padding:12px 0 15px 0;
					/*border-bottom:1px solid black;*/
					clear:both;
					background-image: url(../images/bg/small_border.png);
					background-repeat: no-repeat;
					background-position: bottom left;
					}
			
			.work-right p{
				padding:15px 0 15px 0;
				}




/*lightbox*/
#colorbox{
	top: 70px !important;
	}
/*#cboxLoadedContent{
	overflow:hidden !important;
	}*/

.zoom { 
	display: block;
	width: 1200px; 
	height: 480px; 
	background-image: url(../images/zoom.png); 
	background-size: 200% auto; 
	background-position: 80% center; 
	transition: 300ms; 

	-webkit-cursor: url(../images/cursor_zoom.png), auto; 
	-moz-cursor: url(../images/cursor_zoom.png), auto; 
	cursor: url(../images/cursor_zoom.png), auto; 

	image-rendering: -moz-crisp-edges;
  	image-rendering: -webkit-crisp-edges;
  	image-rendering: pixelated;
  	image-rendering: crisp-edges;
}
.zoom.state-1 { 
	background-size: 200% auto; 
}
.zoom.state-2 { 
	background-size: 100% auto; 
}


.text-cloud{
	position: absolute;
	top:60px;
	left: 870px;
	width: 280px;
	height: 358px;
	background-image: url(../images/dobar.png);
	background-position: top left;	
	z-index: 900;
	padding:265px 0 0 60px;
	}
	.text-cloud span{
		color:black;
		font-size: 25px;
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: -1px;
		line-height: 28px;
		}
		.text-cloud a{
			color:black;
			}
		.text-cloud a:hover{
			color:#ffc10e; /* žuta */
			text-decoration: underline
			}



.noborder{
	display: none;
}

#form1{
	display:block;
	}
	input{
		background-color: none;
		background: none;
	}
	input.forma{
		background-color: #eaeaea;
		border:none;
		font-size: 15px;
		padding:5px;
		display:block;
		border-radius: 3px;
		margin: 5px 0 5px 0;
	}

		.glasaj_forma_button{
			width:40px;
			height: 40px;
			background-image: url(../images/vote.svg);
			background-size: 40px 40px;
			background-repeat: no-repeat;
			border:none;
			background-color: none !important;
			}

.notify{
	display:block;
}
.notify span{
	color:red;
	}






@media only screen and (max-width:480px) {

}


@media (-webkit-min-device-pixel-ratio: 2){ 

		.head-Wrap a.logo{
			background-image: url(../images/logo@2x.png);	
			background-repeat: no-repeat;
			background-size:400px;
			}

    }

@media (-webkit-min-device-pixel-ratio: 3){ 

		.head-Wrap a.logo{
			background-image: url(../images/logo@3x.png);	
			background-repeat: no-repeat;
			background-size:400px;
			}

    }