@font-face {font-family:Kaushan; src: url(/fontovi/KaushanScript-Regular.ttf);	font-display: swap}			
html{scroll-behavior: smooth;}
a{text-decoration:none; }
a:visited{color:default }
button{cursor:pointer;}
body{border:none; padding:0; box-sizing:border-box; margin:0; font-size:1em; font-family:'Trebuchet MS', sans-serif;
	overflow-x:hidden; background-attachment: fixed; 
	background-image:url(/slike/štorije-iz-kažuna.webp); background-size:cover; background-position:center;}

header{position:fixed; width:100vw; height:auto; border:none;  left:0; font-size:1em;
	box-shadow:none; z-index:1000; padding:0; transition:.7s; margin:0; 
	top:calc(50vh - 12em); padding-top: 1em;
	display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center;
	background: linear-gradient(180deg, rgba(114,156,37,1) 0%, rgba(114,156,37,0) 80%); background-size: 100% 0%; background-repeat: no-repeat;
	background-position:top center;  }
	header img{width:auto; height:12em; transition:inherit;  }					
	header nav{height:5em; width:auto; transition:inherit; margin-top: 2em; flex-wrap: nowrap;
				display:flex; justify-content:center; align-content:center; box-sizing:border-box; }
		header nav a{font-size:1em; 
					color:rgba(255,255,255,0); text-decoration:none; display:block; margin:0; cursor:pointer; 
					padding:0.5em; transition:.3s; text-align: center;
					border-top-left-radius: .75em; border-bottom-right-radius: .75em;
					border:.25rem solid white; line-height:100%;
					height:4.5em; width:4.5em; margin:0em .65em;
					background-size:4em auto; background-color:none; background-repeat:no-repeat;
					background-position:center; overflow: hidden;
					display: flex; align-items: center; justify-content: center; box-sizing:border-box;}	
		header nav a:visited{color:white}	

main{width:100vw; border:none; box-sizing:border-box; font-size:1em; 
	height:AUTO; padding:0;  margin:0; }	
section{width:100vw; box-sizing:border-box; margin:0;  position:static; overflow:hidden; }
article{padding:7em calc(50vw - 35em); font-size:1em; }		
article p{text-align:center; line-height:150%; padding:0; color:#2B1D19; font-size: 1.3rem;}		
h1{font-size:1em !important; font-weight:bold !important; margin:0; margin-bottom:-1em !important;
	text-align:center;  text-transform:uppercase; color:#FEF8E5}
h2{font-size:9rem !important; color:#2B1D19;  width:100%; text-align:center; font-weight:normal; font-weight:bold;
	font-family:'Kaushan', cursive; padding:1rem 0; margin:0;}
h3{font-size:4rem !important; color:#2B1D19; margin: 0;}	
h4{font-size:1.25em !important; color:black;  width:100%; text-align:center; font-weight:bold; text-transform:uppercase;
	padding:2em 10em; box-sizing:border-box; letter-spacing:1px; }
/* ------------ POČETNA -------------------------*/	
.Home{padding-top:0; width:100vw; height:100vh; overflow:hidden; margin-top:0}
	.Home video{width:100vw; height:100vh; object-fit:cover; object-position:center; }		
/* ------------ ABOUT -------------------------*/	
.About-us{border-top: .5em solid #739D25;box-sizing:border-box; padding-bottom:0; color:white; padding-top:0; }
	.About-us div{height:27rem;}
		.About-us_img{float: left; width:55%; height:100%; object-fit: cover; object-position: right;
					 border-bottom-right-radius: 2rem; border-top-left-radius: 2rem; }
		.About-us p{float: left; width:45%;  height: auto; padding:0; padding-left: 2rem; box-sizing: border-box;
					text-align: left; font-size: 1.3rem; margin: .5rem 0;  font-style: italic;}
	.slika_180{clear: both; width: 100vw; height: 32.8vw; margin-top:2em; margin-bottom:0;
			border-top:.5em solid #739D25; border-bottom:.5em solid #739D25; box-shadow: 0 0 1.5rem rgba(0,0,0,.5);
			object-fit: cover; box-sizing: border-box; }
/* ------------ MENU -------------------------*/	
.Menu{box-sizing:border-box; overflow-x: hidden; margin:0; margin-top: -1em; padding: 0;
	background-image: url(/slike/menu-bg.webp); background-size:auto 100%; background-repeat: repeat-x; 
	width:100vw; height:auto;}
	.Menu article{padding: 0; padding-top: 5rem; padding-bottom: 5rem; text-shadow: 0 0 1rem #85583B;}
	.Menu h2{padding:0em calc(50vw - 30rem); box-sizing: border-box;}
	.Menu article>p{font-style: italic; margin-top: -1.5rem; padding:0 calc(50vw - 35em); margin-bottom: 2rem; }
	.dishes_container{height:30rem;}
		.dish{width: 100vw; font-size: 1.3rem !important; height: 100%; padding:0.5em calc(50vw - 35rem) !important; box-sizing: border-box;}
			.dish img{height:100%; width: auto !important; margin-right:0; box-shadow: -.5rem .5rem 1rem rgba(0,0,0,.5); border-radius: 100%;
						float: left;}
			.dish div{height: 100% !important; width:auto; max-width:30rem; float: left; position: static !important;
					display:flex !important; justify-content:flex-start !important; align-items: center !important; align-content: center !important;
					flex-wrap: wrap;}
				.dish h3, .dish p{width: 100%; text-align: left; padding: 0; color:#221714}
				.dish h3{font-weight: bold !important; line-height: 90%;}
				.dish p{font-size: 1.3rem !important; }
				.dish_a{display:inline-block; height:auto; width: auto; padding:1rem; padding-left: 3.75rem; background-color:#2B1D19; 
						border-radius: .5em; box-shadow: 0rem 0rem .7rem rgba(0,0,0,1); color: white;transition: .25s;
						background-image:url(/slike/menu.svg); background-repeat: no-repeat; background-size:auto 80%; background-position:.5rem center;
						margin-bottom: 2rem;}	
				.dish_a:hover{ padding:1rem 1.25rem 1rem 4rem; color:white !important}		
		.carousel-control-next{justify-content: flex-end !important; padding-right:1rem !important;}	 
		.carousel-control-prev{justify-content: flex-start !important;padding-left:1rem !important;}	
	.offcanvas{text-shadow: none; background-image:url(/slike/štorije-iz-kažuna.webp); background-size:cover; background-position:center; height: 100vh; }	
		.offcanvas-header{background-color:#2B1D19; box-shadow: 0rem 0rem .7rem rgba(0,0,0,1); color: white;
						background-image:url(/slike/menu.svg); background-repeat: no-repeat; background-size:auto 3rem; background-position:.5rem center;
						padding-left:3.75rem !important;}
		.offcanvas-body{overflow: hidden !important;}							
		
/* ------------ GALERIJA -------------------------*/
.Gallery{border-top:.5em solid #739D25; }
	#galerija_slika{width:100%; height:auto; display:flex; justify-content:center; vertical-align:flex-start; flex-wrap: wrap;
					padding-top:2em; clear:both}
		#galerija_slika img{height:15em; width:25%; border:.3em solid rgba(255, 255, 255, 0); box-sizing:border-box;
								background-size:cover; cursor:pointer; background-position:center; 
								display:block; padding:0; overflow:hidden; font-size:1em; margin:0; transition:.1s;
								margin-bottom:0em; object-fit:cover; display:block;
								border-bottom-right-radius: 2rem; border-top-left-radius: 2rem; }
		#galerija_slika img:hover{border:0.12em solid white;}					
			
		#galerija_slika_navigator{height:3em; width:100%; display:flex; justify-content:center;  
									align-items:center; clear:both;	box-sizing:border-box; }
			#galerija_slika_navigator button {height:1.5rem; width:1.5rem; border-radius:3em; border:.25rem solid #739D25; padding:0;
												background-color:white; box-sizing:border-box; margin:0 .35em; cursor:pointer;}
			#galerija_slika_navigator button:hover{background-color:#739D25;}
			#galerija_slika_navigator button:disabled{cursor: default; background-color:#739D25;}											
@media only screen and (max-width: 70em) { /* MOBITEL VERZIJA */
#galerija_slika{height:auto; margin-top:1em; padding-top:1em}
		#galerija_slika img{width:50%; margin-bottom:0; height:40vw;}
		#galerija_slika img:hover{border:0.1em solid white;}	
		/*#galerija_slika_navigator{}*/
			#galerija_slika_navigator button {height:2em; width:2em; margin:0 .15em;}
			/*#galerija_slika_navigator button:hover{}
			#galerija_slika_navigator button:disabled{}*/
	}	
/*-------*/	
#galerija_detalji{position:fixed; width:100vw; height:100vh; overflow:hidden;
		top:100vh; left:0vw; transition:ease-in .35s; box-sizing:border-box; z-index:300000; 
		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:4.25em 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;outline: none;
					height:calc(100% - 10em); width:50%; margin-right:0; }
	#galerija_detalji button:hover{background-size:5em auto; border:none; outline: none}										
	#galerija_detalji button:active{border:none; outline: none}										
	#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); }	
@media only screen and (max-width: 70em) { /* MOBITEL VERZIJA */
	#galerija_detalji button{height:calc(100vh - 40vw); background-position:5vw center; }
	#galerija_detalji button:nth-of-type(1){height:40vw;  background-position:bottom; }	
	#galerija_detalji button:hover{background-size:4.25em auto;}			
	}				
/* ------------ CONTACT -------------------------*/
footer{clear:both; height:auto; width:100vw; z-index:-10; box-sizing:border-box; border-top:.5em solid #739D25; 
	background:linear-gradient(180deg, #fef8e5 0%, #fef8e5 10%,#fef8e570 100%), url(/galerija_slika/restaurant-kiwi-1072.webp); 
	background-repeat:no-repeat, no-repeat; background-size:cover, cover;
	background-attachment:fixed, fixed; text-shadow: 0 0 1em white; }		
	.Contact{padding:6em calc(50vw - 35em); padding-bottom:0;}
	.Contact h2{font-size: 8.5rem; margin-bottom: 2rem;}
	.Contact:after{content:''; display:block; width:100%; height:.00001em; background-color:rgba(255, 255, 255, 0); clear:both}
		#goooooogle{float:left; width:60%; height:24rem; box-sizing:border-box; padding-right:1em}
			#goooooogle iframe{width:100%; height:100%; transition:.5s; border-bottom-right-radius: 0.5rem; border-top-left-radius: .5rem; /*filter: sepia(20%);*/}
	footer address{float:left; width:40%; height:24rem; font-style:normal; text-decoration:none; 
					font-size: 1.5rem;
					padding:0; padding-left:1em; box-sizing:border-box; color:#2B1D19; flex-wrap:wrap;
					display:flex; align-content:center;  align-items:center; justify-content:flex-start}				
		footer address a{font-style:normal; text-decoration:none; display:block; width:100%; 
						height:auto; background-position:left; 
						background-repeat:no-repeat; background-size:auto 1.8em;
						box-sizing:border-box; text-align:left; color:#2B1D19;
						padding:.4em 0; margin:.4em 0; padding-left:2.3em; line-height:130%;}	
		#facebook_follow{width:10em; height: 2.8em; }	
		#facebook_follow:hover{filter:hue-rotate(-130deg)}		
		footer address a:hover{color:#739D25}					
.pravne_napomene{width:100%; text-align:center; padding-top:0; clear:both; height:calc(7em + 5vw); padding-top:5vw; box-sizing:border-box;
				display:flex; justify-content:center; align-items:center; align-content:center;
				background:url(/slike/about_us.webp); background-size:cover; background-position:top; border:none;
				margin-top:-2em; color:black}
		#pero{display:inline-block; color:rgba(0,0,0,0); width:2.5em; height:2.5em; border-radius:100em;
			background-image:url(/slike/pero.svg); background-size:80%; background-repeat:no-repeat; background-position:center;
			margin-left:1em; overflow:hidden; clear:both; transition:.25s;  }	
		#pero:hover{background-size:100%;}