@charset "utf-8";
/* CSS Document */
body{
	margin:0 auto;
	padding:0;
	font-family: 'Pathway Gothic One', sans-serif;
	background: url(../slike/galerija/back.jpg);
	background-size:cover;
}
header{
	height:5vw;
	width: 100%;	
	background: rgba(0, 0, 0, 0.73);
	overflow:hidden;
	margin-bottom:1vw;
	top:0;
	border-bottom: 1px solid grey;
	position:fixed;
}
#firma{
	margin:0;
}
.nosee{
	color:rgba(0, 0, 0, 0.0);
}
#google_translate_element{
	padding:0;
	margin:0;
	position:absolute;
	top:0;
	right:0;
}
#firma h1{
	color:white;
	background: rgba(0,0,0,0.9);
	text-align: center;
	width: 64vw;
	text-transform: uppercase;
	font-weight: bold;
	border: 1px solid grey;
	border-top-right-radius: 3vw;
	border-top-left-radius: 3vw;
	display: block;
	margin: auto;
	font-size: 2.5vw;	
}
.uppercase{
	text-transform:uppercase;
	letter-spacing:0.2vw;
	background: rgba(255,255,255,0.05);
	margin-right:5vw;
	margin-left:4vw;
	text-align:center;	
	color:white;	
}
#proizvodnja{
	text-align:center;
	height:14vw;
	margin-top: 6vw;
}
#proizvodnja ul{
	list-style-type:none;
	transition:all 300ms ease;
}
#proizvodnja li{
	display:inline-block;
	position:relative;
	width: 13vw;
}
#proizvodnja a{
	color: white;
	background: rgba(0,0,0,0.74);
	font-size: 1.1vw;
	text-decoration: none;
	padding: 0.4vw;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	border: 1px solid grey;
	transition: all 300ms ease;
	margin-right: 1vw;
	text-transform: uppercase;
	letter-spacing: 0.1vw;
	display: block;
	height:1.2vw;

}
#proizvodnja img{
	width: 12vw;
}
#proizvodnja ul ul a{
	margin:0;
	padding:0;
	height:5vw;
	background:none;
	border:none;
	position:absolute;
	left:0;	
}
#proizvodnja ul a:hover{
	background:rgba(189,24,27,0.87);
	color:rgba(0,0,0,0.76);
}
#proizvodnja ul li:hover a{
	background:rgba(189,24,27,0.87);
	color:rgba(0,0,0,0.76);
}
#proizvodnja h1{
	width:20vw;	
}
#proizvodnja ul ul{
	opacity:0;
}
#proizvodnja ul li:hover>ul{
	opacity:1;
	transition:all 500ms ease;	
}
#logo{
	height:5vw;
	width:19.05vw;
	float:left;
}
#logo img{	
	height:5vw;
}
nav{
	float:left;	
}
nav ul{
	margin:0;
	padding:0;
	list-style:none;
}
nav ul li {
	float:left;
	border-right: 1px solid grey;
	padding: 1.98vw;
	transition:all 200ms ease;
	display:block;
}
nav ul li {
	text-decoration: none;	
	font-size:1.3vw;
	text-transform:uppercase;
	color:white;
	transition:all 300ms ease;
}
nav ul li:hover {
	background: rgba(255,255,255,0.31);
	color: rgba(0,0,0,0.90);
}
nav ul li a{
	transition:all 500ms ease;	
}
#onama{
	width: 74vw;
	padding-left: 2vw;
	font-size: 1.3vw;
	background: rgba(0, 0, 0, 0.9);
	padding-top: 2vw;
	border: 1px solid grey;
	border-bottom-left-radius: 1vw;
	border-bottom-right-radius: 1vw;
	margin: 1vw auto;
	color:white;
	text-align: center;
	letter-spacing: 0.02vw;
}
.onama1 a{
	text-decoration: none;
	color: rgba(213,36,39,0.85);
	text-transform: uppercase;
	letter-spacing: 0.2vw;
	font-size: 1.3vw;
	margin-top: 0.4vw;
	padding: 0.1vw;
	transition:300ms ease all;
}
#onama a:hover{
	background: rgba(255,255,255,0.59);
	color:rgba(255,33,36,1.00);
	border:1px solid rgba(140,140,140,1.00);
	border-bottom-left-radius:1vw;
	border-bottom-right-radius:1vw;
	border-top-left-radius:1vw;
	border-top-right-radius:1vw;
}
#onama h1,p {
	margin:0;
	padding:0;	
}
#telefon{
	padding-left: 2vw;
	font-size: 1.3vw;
	width: 40vw;
	margin-left: 1vw;
	color: grey;
	padding-top: 1vw;
	margin-top: 6vw;
}
#telefon h2{
	background: rgba(0,0,0,0.75);
	display: block;
	border: 1px solid grey;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	text-align: center;
	text-transform: uppercase;
	font-weight: 500;
	padding-left: 2vw;
	padding-right: 2vw;	
	margin-top: 0;
}
.telefon{
	font-size: 1.3vw;
	color: rgba(210, 56, 56, 0.55);
	text-align: center;
	width: 16vw;	
}
.paragrafi{
	background: rgba(0,0,0,0.70);
	border: 1px solid grey;
	border-bottom-left-radius: 1vw;
	border-bottom-right-radius: 1vw;
	width: 29.9vw;
	padding-left: 5vw;
	padding-right: 5vw;
	height: 13vw;
}
.p1{
	float:left;	
}
.p2{
	float:right;
}
footer{
	width:100vw;
	height:1.5vw;
	clear:both;
	position:fixed;
	bottom:0;
	text-align:center;
	padding: 0.5vw;
	transition:200ms linear all;
}
footer a{
	padding-right:1vw;
	text-decoration:none;
	color:rgba(0,0,0,1.00);
	text-transform:uppercase;
	display:inline-block;
}
footer img{
	height:1.5vw;
	width:1.5vw;
	transition:300ms linear all;
	padding-right:0.4vw;
	padding-left:0.4vw;
}
footer a{
	border-right:1px solid black;	
}
#iframe{
	padding-left:2vw;
	text-align:center;	
	margin-top: 6vw;
}
iframe{
	width: 76vw;
	height: 33vw;	
}
#iframe h2{
	background: rgba(0, 0, 0, 0.72) none repeat scroll 0% 0%;
	width: 87vw;
	color: grey;
	border: 1px solid grey;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	text-align: center;
	padding: 0.4vw;
	text-transform: uppercase;
	letter-spacing: 0.1vw;
	margin-left: 5vw;
	font-size: 2vw;	
	margin-bottom: 0.5vw;
}#iframe h3{
	background: rgba(0, 0, 0, 0.72) none repeat scroll 0% 0%;
	width: 87vw;
	color: grey;
	border: 1px solid grey;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	text-align: center;
	padding: 0.4vw;
	text-transform: uppercase;
	letter-spacing: 0.1vw;
	margin-left: 5vw;
	font-size: 2vw;	
	margin-top: 0.5vw;
	margin-bottom: 0;
}
footer a:hover img{
	transform: scale(1.6); 
	transition:200ms linear all;
}
#ponuda{
	margin-right:1vw;	
	margin-top: 6vw;
}
#meni-ponuda{
	float: left;
	width: 17.05vw;
	height: 41vw;
	background: rgba(0, 0, 0, 0.73);
	margin-left: 0.5vw;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	border: 1px solid grey;
	color:grey;
	position:fixed;
}
#meni-ponuda h2{
	text-align: center;
	font-weight: 500;
	font-size: 1.5vw;
	padding: 0;
	margin: 0.5vw;
	color: grey;
	border-bottom: 1px solid grey;	
}
#meni-ponuda ul{
	margin-left:1vw;
	margin-right:1vw;
	padding:0;
	list-style:none;	
}
#meni-ponuda ul a{
	text-decoration: none;
	color: rgb(135, 128, 128);
	text-transform: uppercase;
	font-size: 1.4vw;
	display: block;
	transition: all 300ms ease;				
}
#meni-ponuda li a:hover{
	background: rgba(255,255,255,0.31);
	color: rgba(0,0,0,0.90);
}
#meni-ponuda ul ul{
	margin: 0;
	padding: 0;
	margin-left: 0.5vw;
}
#galerija{
	float:right;
	width: 80vw;
	height:40vw;
	margin-bottom: 1vw;
	background: rgba(0, 0, 0, 0.74);
	border-top-left-radius: 1vw;
	padding-top: 1vw;
	border-top-right-radius: 1vw;
	border: 1px solid grey;
}
#galerija img{
	width: 11vw;
	transition:300ms all ease;
}
#galerija img:hover{
	width:12.5vw;	
}
#galerija h3{
	margin: 0;
	padding: 0;
	border: 1px solid;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	background: rgba(0, 0, 0, 0.84);
	color:grey;
}
#galerija1{
	float:right;
	width: 80vw;
	margin-bottom: 1vw;
	background: rgba(0, 0, 0, 0.74);
	border-top-left-radius: 1vw;
	padding-top: 1vw;
	border-top-right-radius: 1vw;
	border: 1px solid grey;
}
#galerija1 img{
	width: 11vw;
	transition:300ms all ease;
}
#galerija1 img:hover{
	width:12.5vw;	
}
#galerija1 h3{
	margin: 0;
	padding: 0;
	border: 1px solid;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	background: rgba(0, 0, 0, 0.84);
	color:grey;
}
.frame{
	width:12.5vw;
	float: left;
	display: block;	
	text-align:center;
	font-weight:600;
	font-size:0.9vw;
	text-transform:uppercase;
	margin-bottom: 1vw;
	height:23vw;
	margin-left: 17.5vw;
	
}
.frame:nth-of-type(1n){
	margin-left:0.7vw;	
}
.ponuda{
	width: 21vw;
	float: left;
	display: block;
	text-align: center;
	font-weight: 600;
	font-size: 1vw;
	text-transform: uppercase;
	margin-left:2vw;
}
.ponuda img{
	width:19vw;	
	transition:all 500ms ease;	
}
.ponuda h2{
	padding: 0;
	margin: 0;
	background: rgba(0, 0, 0, 0.84);
	padding-left: 1vw;
	border: 1px solid;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	color:grey;
}
.ponuda img:hover{
	width:21vw;	
}
#izbor{
	width:81vw;
	background:#64706c;
	float:left;
	height: 39.5vw;	
}
#izbor img{
	width:24vw;
	float:left;	
}
#izbor h2{
	margin:0;
	padding:0;
	font-size:1.5vw;
	border: 1px solid;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	background: rgba(0, 0, 0, 0.84);
	color:grey;		
}
#izbor a:hover{
	opacity:0.8;	
}
.frame2{
	width:12.5vw;
	float: left;
	display: block;	
	text-align:center;
	font-weight:600;
	font-size:1vw;
	text-transform:uppercase;
	margin-left: 0.7vw;
	height: 9vw;
}
#galerija2{
	width: 80vw;
	float: right;
	margin-bottom: 1vw;
	background: rgba(0, 0, 0, 0.74);
	border-top-left-radius: 1vw;
	padding-top: 1vw;
	border-top-right-radius: 1vw;
	border: 1px solid grey;
}
#galerija2 img{
	width:11vw;
	transition:300ms all ease;		
}
#galerija2 img:hover{
	width:12.5vw;	
}
#galerija2 h3{
	margin: 0;
	padding: 0;
	border: 1px solid;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	background: rgba(0, 0, 0, 0.84);
	color:grey;
}
#galerija3{
	width:80vw;
	float:right;
	height: 40vw;
	color: #868686;
	margin-bottom: 1vw;
	background: rgba(0, 0, 0, 0.74);
	border-top-left-radius: 1vw;
	padding-top: 1vw;
	border-top-right-radius: 1vw;
	border: 1px solid grey;
}
#galerija3 img{
	width: 35vw;
	transition:all 300ms ease;
}
#galerija3 h3{
	margin: 0;
	padding: 0;
	border: 1px solid;
	border-top-left-radius: 1vw;
	border-top-right-radius: 1vw;
	background: rgba(0, 0, 0, 0.84);
	color:grey;
}
#galerija3 img:hover{
	width:37vw;	
}
.frame3{
	width: 37vw;
	float: left;
	display: block;	
	text-align:center;
	font-weight:600;
	font-size:2vw;
	text-transform:uppercase;
	margin-bottom: 1vw;	
	margin-left: 1vw;
}
#galerija4{
	background: rgba(0, 0, 0, 0.74);
	border-top-left-radius: 1vw;
	padding-top: 1vw;
	border-top-right-radius: 1vw;
	height: 40vw;
	width: 80vw;
	border: 1px solid grey;
	float: right;
}