@font-face {font-family:c; src: url(/fontovi/Candara.ttf); font-display: swap}	
@font-face {font-family:c; src: url(/fontovi/Candarab.ttf);font-weight: bold;	font-display: swap}	
@font-face {font-family:c; src: url(/fontovi/Candarai.ttf);font-style: italic; font-display: swap}									
html{scroll-behavior: smooth; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}
*, *:before, *:after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}
a:visited, a:hover, a:active, a:link{color:#52412F}
body{width:100vw; height:auto; display:block; box-sizing: border-box; 
	border:none; padding:0; 
	margin:0; color:black; font-family:Tahoma, sans-serif; font-size:1em; 
	background-color:white; overflow-x:hidden;  }	
header{
	position: fixed; top:-6em; left: 0;
	height:4em; width: 100vw; 
	z-index:999;}
	#header_logo{
		font-size: 1rem;
		position: fixed;
		top:-.1em;	left: calc(50vw - (6em / 2));
		width:6em; height:auto;
		margin:0; padding:0;
		cursor: pointer;}
	header nav{margin-left:calc(50vw - 35em); 
			width:70em; height:100%;
			clip-path: polygon(0 0, 100% 0, 100% 65%, 98% 100%, 2% 100%, 0 65%);
			background-color: #A3FFFC;
			border-bottom:.1rem solid #7D5B38; 
			box-shadow: 0 0 .5rem rgba(0,0,0,.5);
		 	padding: 0 4em;}
		.nav_polovica{display: flex; 
					align-items: center; justify-content:  space-between; 
					width: 50%; height: 100%; float: left;
					box-sizing: border-box; }
		.nav_polovica:first-of-type{padding-right:7rem;}	
		.nav_polovica:last-of-type{padding-left:7rem;}			
		header nav a{text-decoration: none; 
					font-family:'c', sans-serif;  font-size: 1.25em;
					display:block; color:#52412F; transition: .12s;
					height: 100%;
					cursor: pointer;
					display: flex; justify-content: center; 
					align-items: center; align-content: center;
					flex-wrap: wrap;}								
		header nav a:after{display: block; transition: .35s;
						content: ''; 
						height: .05em; width:0%; 
						background-color: #3c3126; 
						margin: 0; margin-top: -.5em;
						margin-left:0%;}
		header nav a:hover{color:#3c3126; }					
		header nav a:hover:after{margin-left: 0; width:100%;}							
		#header_a_aktivan{pointer-events: none; font-weight: normal;}
		#header_a_aktivan:after{display: block; transition: .35s;
			content: ''; 
			height: .05em; width:100%; 
			background-color: #3c3126; 
			margin: 0; margin-top: -.5em;
			margin-left:0%;}
		#jezici{width:7em; display: flex; height: 100%;
				align-items: center; justify-content: space-between;}	
			#jezici	a{display:flex; width:2em; height:2em;
					background-color: #3c3126;
					align-items: center; justify-content:center;
					color:#A3FFFC; font-size: 1rem;
					clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);}
			#jezici	a:hover{color:#ffffff; }	
			#jezici a:hover:after{display: none;}			
@media only screen and (max-width:70em) {
	header{height:4em; position: fixed;}
		#header_logo{height:5em; width: auto;
					max-width:calc(100vw - 4em - 1em);
					left:calc(50vw - 2.5em);
					transition: .6s;}
		header nav{cursor: pointer; position: fixed;
				height:4em; width:100vw;
				left:0; 
				padding: 0; margin:0;
				background-image:url(/slike/MOBITEL_navigator_OTVARANJE.svg);
				background-size:2rem auto;
				background-position:calc(100% - 2em) 1em;
				background-repeat: no-repeat;
				overflow: hidden; 
				clip-path: none}
			.nav_polovica{
						display: block;
						height:auto;
						position: fixed;
						top:4rem; left:-50vw; 
						width:50vw; clear: both; 
						height:auto; padding: 0;
						margin: 0; 
						background-color:white;
						text-align: right;}
			.nav_polovica:first-of-type{padding-right:0rem;}	
			.nav_polovica:last-of-type{left:100vw; text-align: left;padding-left:0rem;}			
			header nav a{display:block;
				width:100%; float:right; clear: both;
				height: auto; padding:1em;
			}
			#jezici{height:4.35em; padding:0 1em ; width:9em}
			#jezici	a{height:2.5em; font-size: 1rem;}
		header nav a:after{display: none;}	
		#header_a_aktivan{text-decoration: underline;}
		#header_a_aktivan:after{display: none;}
	} 		
main{width:100%; box-sizing:border-box; padding:0; margin:0; font-size:1em; 
	/*background-image:url(/slike/main-bg.svg);
	background-position:center; 
	background-size:30em auto; 
	background-attachment:fixed; 
	background-repeat:repeat;*/}	
SECTION, footer{margin:0; padding:5em 0; padding-top: 0;
	height:auto; width:100%; clear:both; /*border-top:.35rem solid #7D5B38;*/}
SECTION:before, footer:before{content: ''; width: 100%; height:.35rem; display: block;
			background-color: #7D5B38; margin-bottom: 5rem;}	
.emblem:before, .emblem2:before, .emblem3:before{/*ponštava gornji*/
		content: ''; width: 100%; height:5rem; display: block;
		background-image:url(/slike/emblem.svg); 
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
		background-color: transparent;
		margin-bottom:0rem; 
		margin-top: 3em;}
.emblem2:before{	background-image:url(/slike/emblem2.svg); }
.emblem3:before{	background-image:url(/slike/emblem3.svg); }
article{ height:auto; width:100%; margin:0; padding:0; 
	box-sizing:border-box;/* padding:calc(50vw - 35em);*/}
h1, h2, h3, h4, h5, h6 {font-family:'c', sans-serif; width:100%; display: block;}	

h5~p{text-align: center; margin-bottom: 2rem; margin-top: -.7rem;}			
.bordered {padding:.5em;
		border: .25rem solid #7D5B38;}
.cover{object-fit: cover; object-position: center;}
.contain{object-fit: contain; object-position: center;}
.naslov{font-size:5em; color:#7D5B38}

#opis_za_SEO{font-size:1em; height:.000001rem; width:100%; padding: 0;
	margin: 0; top:0; left:0; overflow: hidden; position: fixed;}
.pocetna{width:100vw; height:100vh;  display: block; 
	margin:0em; padding:0;  overflow:hidden;
	color: black; 
	background-image: url(/galerija_slika/Ursaria-75.webp);
	background-size: cover;
	background-position: center;}
	.pocetna:before{display: none;}
	.pocetna video{width: 100vw; height: 100vh;
				object-fit: cover; object-position: center;}			
	#pocetna_txt{position: absolute;
				top: 0; left: 0;
				height: 100vh; width: 100vw;
				display: flex;
				justify-content: center;
				align-items: flex-end; align-content: flex-end;
				flex-wrap: wrap;
				font-family: 'Smooch', cursive;
				font-size: 5em; text-align: center;
				padding:0 1rem;
				padding-bottom:10vh;
				color: white;;}
		#pocetna_txt p{line-height: 80%;}		
		#crta_ispod_pocetna_txt{display: block; content: '';
							width:100%; height:1.5rem;
							background-image: url(/slike/pocetna_crta.svg);
							background-size: contain;
							background-repeat: no-repeat;
							background-position: center;
							opacity:0;
							margin-top: -.5rem;}								
.proizvod{height:24em; object-position: right;}
	.sirok{height:18em; }
		
/* GALERIJA SLIKA */
	#galerija_slika {display:flex; justify-content:flex-start; 
				align-content:flex-start; align-items:flex-start; 
				flex-wrap:wrap;
				box-sizing:border-box; margin-top:0rem;
				width: 100%; height: auto;}
		#galerija_slika img{width:25%; height:15rem; 
							object-fit:cover; 
							object-position: center; 
							border:.25rem solid white;
							cursor: pointer; transition:.1s;
							box-sizing: border-box; outline:none}
		#galerija_slika img:hover{border:0rem solid white; }					
		#galerija_slika_navigator{height:2em; width:100%; display:flex; 
								justify-content:center;  
									align-items:center; clear:both;	
									box-sizing:border-box; margin-top: 1rem;}
			#galerija_slika_navigator button {height:1em; width:1em; 
											border-radius:1em; 
											border:.1em solid #7D5B38;
											 padding:0; box-sizing:border-box; 
											 margin:0 .3em; cursor:pointer; 
											 font-size:1em; 
											 background-color:white}
			#galerija_slika_navigator button:hover{border:.13em solid #7D5B38;}
			#galerija_slika_navigator button:disabled{border:.1em double #7D5B38; 
										cursor: default; background-color:#7D5B38}								
			
/* UVEĆANA SLIKA IZ GALERIJE*/			
	#galerija_detalji{position:fixed; width:100vw; height:100vh; overflow:hidden;
			top:100vh; left:0vw; transition:.5s; box-sizing:border-box; 
			z-index:3000000000; 
			padding:0em; background-color:rgba(255,255,255,.9);
			background-size:contain; background-repeat:no-repeat; 
			background-position:center;}	
		#galerija_detalji button{cursor:pointer; border:none; 	
						background-image:url(/slike/galerija_strelica.svg); background-repeat:no-repeat; 
						background-size:4em auto; background-position:6em calc(50% + 0em); 
							padding:0; margin:0; background-color:rgba(255,255,255,0); 
							box-sizing:border-box; float:left; transition:.1s;
						height:calc(100% - 10em); width:50%; margin-right:0; }
		#galerija_detalji button:hover{background-size:4.5em auto;}										
		#galerija_detalji button:disabled{cursor:default; background-size:4em auto; opacity:.25}										
		#galerija_detalji button:disabled:hover{background-color:rgba(255,255,255,0); filter:grayscale(100%); }										
		#galerija_detalji button:nth-of-type(1){width:100%; clear:left; height:10em; background-position:center;
									background-image:url(/slike/galerija_zatvori.svg);  }	
		#galerija_detalji button:nth-of-type(3){transform:rotate(180deg); }	
footer{background:linear-gradient(0deg, rgba(255,255,255,0.5) 0%, rgba(163,255,252,0.75) 100%), url(/galerija_slika/Ursaria-1006.webp);
		background-size:cover, cover;
		background-attachment:fixed, fixed;
		padding-bottom: 2em;}
footer address a{
			font-style:normal; text-decoration:none; 
			font-family: 'c', sans-serif;
			display:flex; 
			align-items: center; align-content: center;
			width:auto; height:auto; 
			min-height: 2em;
			background-position:left ; 
			background-repeat:no-repeat; 
			background-size:auto 3rem;
			box-sizing:border-box; 
			font-size:1.5rem; 
			text-align:left; 
			color:#52412F;
			box-sizing: content-box;
			padding-left:3.5rem; margin:1em 0;
			line-height: 110%;}	
footer address a:hover{color:#3c3126; text-decoration:underline;  }		
#pero{display:block; color:rgba(0,0,0,0); width:2.5em; 
	height:2.5em; border-radius:100em;
	background-image:url(/slike/pero.svg); background-size:cover; 
	margin:0em auto; overflow:hidden; margin-top: 3em;
	clear:both; filter:none; clear:both; transition:.25s;}		
	#pero:hover{box-shadow:0rem 0rem .5rem gray;}