
  /* Box sizing rules */

  /* Prevent font size inflation */

  /* Remove default margin in favour of better control in authored CSS */

  /* Remove list styles on ul, ol elements with a list role */

  /* Set core body defaults */

  /* Set shorter line heights on headings and interactive elements */

  /* Balance text wrapping on headings */

  /* A elements that don't have a class get default styles */

  /* Make images easier to work with */

  /* Improve media defaults */

  /* Inherit fonts for inputs and buttons */

  /* Make sure textareas without a rows attribute are not tiny */

  /* Anything that has been anchored to should have extra scroll margin */

  /* Remove all animations, transitions and smooth scroll for people that prefer not to see them */

  /* Modern focus management */

  /* Remove built-in form typography styles */

  /* Fix button defaults */

  /* Remove default fieldset styles */

  /* Make sure hidden elements are actually hidden */

  /* Improve table defaults */

  /* Modern scrollbar styling (webkit browsers) */

  /* Firefox scrollbar styling */
@custom-selector :--heading h1, h2, h3, h4, h5, h6;
/* Reset styles */
/*.stranica main > *:not(.context-nav) {
		grid-area:content;
grid-row:auto;
		}*/
/*.naslov {
			margin: 1rem 0;
		}*/
/* Header state for hiding */
/* Shrunk state */
/* Base popover styles - keeping your existing styles */
/* Enhanced main menu container */
/* Enhanced submenu styles for multiple levels */
/* Active submenu state */
/* Menu level specific styling */
/* Continue pattern for more levels as needed */
/* Button styles - keeping your existing styles */
/* Enhanced back button for multiple levels */
/* Enhanced menu item styles */
/* Parent menu items with submenus */
/* Active parent items */
/* Submenu headers */
/* Animation states for showing/hiding submenus */
/* Level indicator for deep nesting */
/* Social networks menu - keeping your existing styles */
/*CONTEXT MENU*/
/* external links */
/* emails */
/* jpgs */
/* a[href$=".jpg"] {
        padding-right: 18px;
        background-color: #f00;
        background: url('acrobat.png') no-repeat center rightright;
    } */
/*a[href="https://zluk.hr"] {*/
/* link to specific website */
/*}*/
/* pdfs */
/* emails */
/* pdfs */
/* Normal state logo styling */
/* Different styling for shrunk logo */
/* PRIKAZ LUKE */
/* Popis luka */
/* Dropdown odabri luka */
/* Alternative custom dropdown styles */
/* Minimal style */
/*.search {
      position: absolute;
      top: 50%;
      left: 50%;
      transform:  translate(-50%,50%);
      background: #2f3640;
      height: 40px;
      border-radius: 40px;
      padding: 10px;

  }*/
/*
		.close-button:after {
			content: "";
			width: calc(2.5 * var(--iconSize));
			height: calc(2.5 * var(--iconSize));
			background-color: var(--color-white);
			--svg: url("https://api.iconify.design/famicons/close-circle-outline.svg");
			mask-image: var(--svg);
			mask-repeat: no-repeat;
			mask-size: 100% 100%;
		}

		.close-button:hover {
			animation: pulsate-menu 0.5s ease-in-out both;
			background-color: oklch(from var(--color-darkblue) l c h / 0.2);
			transition: text-indent 0.2s linear;
			gap: var(--iconGap);
			text-indent: 0px;
		}*/
/* Naslovnica user bar  */
/*AKCIJE NA NASLOVNICI */
/* PRIKAZ PREVIEW OBJAVA */
/* PRIKAZ DOKUMENATA NA STRANICAMA */
/*@media (--viewport-medium) {
	grid-template-columns: 1fr 1fr 1fr;
	}
	@media (--viewport-large) {
	grid-template-columns: 1fr 1fr 1fr 1fr;
	}


	.grid.stupaca-1 {
	grid-template-columns: 1fr;
	}

	.grid.stupaca-2 {
	@media (--viewport-small) {
	grid-template-columns: 1fr 1fr;
	}
	}

	.grid.stupaca-3 {
	@media (--viewport-large) {
	grid-template-columns: 1fr 1fr 1fr 1fr;
	}

	}
*/
/* vremenska prognoza */
/* ------ZAGLAVLJE ------------------------------------ */
/* Creative background shape with animation */
/* ------------------------------------------------------------- */
@property --x {
		syntax: "<percentage>";
		inherits: false;
		initial-value: 50%;
	}
@property --y {
		syntax: "<percentage>";
		inherits: false;
		initial-value: 50%;
	}
@property --dd {
		syntax: "<percentage>";
		inherits: false;
		initial-value: 80%;
	}
@property --dl {
		syntax: "<percentage>";
		inherits: false;
		initial-value: 100%;
	}
@property --deg {
		syntax: "<angle>";
		inherits: false;
		initial-value: -45deg;
	}
/*.my-gallery a:first-child {
			position: relative;
			height: 400px;
			clip-path: inset(0);
		}*/
/* grupa dokumenata */
/*Tekst + slika */
/* Povezani sadrzaj*/
/*Dokumenti */
/* Javna nabava */
/* sadrzaj stranica upravno vijece */
/* zaposljavanje */
/* FORMULARI */
/*.asset-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.asset-item {
    border: 1px solid #ddd;
    padding: 1rem;
    border-radius: 4px;
    background: #fff;
}

.asset-img {
    width: 100%;
    height: auto;
    border-radius: 4px;
}

.asset-pagination .asset-page-btn {
    padding: 0.5rem 1rem;
    border: 1px solid #ddd;
    background: white;
    border-radius: 4px;
    cursor: pointer;
}

.asset-page-current {
    padding: 0.5rem 1rem;
    background: #007bff;
    color: white;
    border-radius: 4px;
    border: 1px solid #007bff;
}*/
/* --------------POZADINE SADRZAJA------------------------------- */
/* ----------------------------------------------
 * Generated by Animista on 2025-2-24 22:34:52
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
		 * ----------------------------------------
		 * animation jello-horizontal
		 * ----------------------------------------
		 */
@keyframes jello-horizontal {
			0% {
				transform: scale3d(1, 1, 1);
			}
			30% {
				transform: scale3d(1.25, 0.75, 1);
			}
			40% {
				transform: scale3d(0.75, 1.25, 1);
			}
			50% {
				transform: scale3d(1.15, 0.85, 1);
			}
			65% {
				transform: scale3d(0.95, 1.05, 1);
			}
			75% {
				transform: scale3d(1.05, 0.95, 1);
			}
			100% {
				transform: scale3d(1, 1, 1);
			}
		}
/**
		 * ----------------------------------------
		 * animation pulsate-fwd
		 * ----------------------------------------
		 */
@keyframes pulsate-fwd {
			0% {
				transform: scale(1);
			}
			50% {
			opacity:0.3;
				transform: scale(1.2);
			}
			100% {
			opacity:1;
				transform: scale(1);
			}
		}
@keyframes bounce {
			0% {
				transform: translateY(0px);
			}
			80% {
			transform: translateY(-3px);
			}

			100% {
			transform: translateY(0px);
			}
		}
@keyframes blijed {
			0% {
				opacity:1;
				transform: scale(1);
			}
			50% {
				opacity:0.6;
				transform: scale(1.1);
			}
			60% {
				opacity:1;
				transform: scale(0.95);
			}
			100% {
				opacity:1;
				transform: scale(1);
			}
		}
/* animacija butona menu i zatvori s prikazom teksta na hover */
@keyframes pulsate-menu {
			0% {
				text-indent: -600%;
				transform: scale(1);
			}
			50% {
				transform: scale(1.1);
			}
			100% {
				text-indent: 0px;
				transform: scale(1);
			}
		}
@keyframes fade-out-a {
			0% {
				opacity: 1;
				filter: blur(0px);
				transform: translateX(0%);
			}

			100% {
				opacity: 0.2;
				filter: blur(50px);
				transform: translateX(-3000%);
			}
		}
@keyframes fade-in-a {
			0% {
				display: none;
			}
			1% {
				display: block;
				opacity: 0.2;
				transform: translateX(-3000%);
				filter: blur(50px);
			}
			100% {
				opacity: 1;
				filter: blur(0px);
				transform: translateX(0%);
			}
		}
@keyframes to-top {
			0% {
				position: relative;
				/* transform: scale(1); */
				order: inherit;
				filter: blur(0px);
			}
			1% {
				/* position: absolute; */
				/* transform: scale(5); */
				order: -1;
				top: 50%;
				filter: blur(30px);
			}
			99% {
				/* transform: scale(1); */
			}
			100% {
				/* position: absolute; */
				top: 0;
				margin-top: 0;
				margin-bottom: auto;
				filter: blur(0px);
				/* transform: translateX(0%); */
			}
		}
/* Float animation for background shape */
@keyframes float {
			0% {
				clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 80%);
				transform: translate(0, -4%);
			}
			25% {
				transform: translate(0, 0%);
			}
			50% {
				clip-path: polygon(0 0, 100% 0, 100% 80%, 0% 100%);
			}
			75% {
				transform: translate(0, -8%);
			}
			100% {
				clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 80%);
				transform: translate(0, -4%);
			}
		}
@keyframes floatslow {
			0% {
				/* clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 97%); */
				transform: translate(0, -1%);
			}
			25% {
				transform: translate(0, 0%);
			}
			50% {
				/* clip-path: polygon(0 0, 100% 0, 100% 97%, 0% 100%); */
			}
			75% {
				transform: translate(0, -2%);
			}
			100% {
				/* clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 97%); */
				transform: translate(0, -1%);
			}
		}
@keyframes animate-fade {
			0% {
				opacity: 0.5;
			}
			100% {
				opacity: 1;
			}
		}
/* ----------------------------------------------
 * Generated by Animista on 2025-3-14 0:8:24
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
		 * ----------------------------------------
		 * animation heartbeat
		 * ----------------------------------------
		 */
@keyframes heartbeat {
			from {
				transform: scale(1);
				transform-origin: center center;
				animation-timing-function: ease-out;
			}
			10% {
				transform: scale(0.91);
				animation-timing-function: ease-in;
			}
			17% {
				transform: scale(1.4);
				animation-timing-function: ease-out;
			}
			33% {
				transform: scale(0.7);
				animation-timing-function: ease-in;
			}
			45% {
				transform: scale(1);
				animation-timing-function: ease-out;
			}
		}
/* ----------------------------------------------
  * Generated by Animista on 2025-3-19 21:50:38
  * Licensed under FreeBSD License.
  * See http://animista.net/license for more info.
  * w: http://animista.net, t: @cssanimista
  * ---------------------------------------------- */
/**
		 * ----------------------------------------
		 * animation fade-in
		 * ----------------------------------------
		 */
@keyframes fade-in {
			0% {
				opacity: 0;
			}
			100% {
				opacity: 1;
			}
		}
/* Import the reset first */
/* Modern CSS Reset - Based on Andy Bell's Modern CSS Reset + 2025 updates */
/* Box sizing rules */
*,
  *::before,
  *::after {
    box-sizing: border-box;
  }
/* Prevent font size inflation */
html {
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
    /* Smooth scrolling for modern browsers */
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: rgba(156, 157, 171, 0.3) transparent;
  }
/* Remove default margin in favour of better control in authored CSS */
body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  figure,
  blockquote,
  dl,
  dd {
    margin: 0;
  }
/* Remove list styles on ul, ol elements with a list role */
ul[role="list"],
  ol[role="list"] {
    list-style: none;
  }
/* Set core body defaults */
body {
    min-height: 100vh;
    line-height: 1.5;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    font-optical-sizing: auto; /* Modern font rendering */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
/* Set shorter line heights on headings and interactive elements */
h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  button,
  input,
  label {
    line-height: 1.1;
  }
/* Balance text wrapping on headings */
h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    text-wrap: balance;
  }
/* A elements that don't have a class get default styles */
a:not([class]) {
    -webkit-text-decoration-skip: ink;
            text-decoration-skip-ink: auto;
    color: currentColor;
  }
/* Make images easier to work with */
img,
  picture,
  video,
  canvas,
  svg {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    font-style: italic;
    background-repeat: no-repeat;
    background-size: cover;
    shape-margin: 0.75rem;
    display: block;
  }
/* Improve media defaults */
/* Inherit fonts for inputs and buttons */
input,
  button,
  textarea,
  select {
    font: inherit;
    color: inherit;
    background-color: transparent;
    border: none;
    margin: 0;
    padding: 0;
  }
/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
    min-height: 10em;
  }
/* Anything that has been anchored to should have extra scroll margin */
:target {
    scroll-margin-block: 5ex;
  }
/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
/* Modern focus management */
:focus-visible {
    outline: 2px solid;
    outline-offset: 2px;
  }
:focus:not(:focus-visible) {
    outline: none;
  }
/* Remove built-in form typography styles */
/* Fix button defaults */
button {
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    color: inherit;
    -webkit-text-decoration: none;
    text-decoration: none;
  }
button:disabled {
    cursor: not-allowed;
  }
/* Remove default fieldset styles */
fieldset {
    margin: 0;
    padding: 0;
    border: none;
  }
/* Make sure hidden elements are actually hidden */
[hidden]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    display: none !important;
  }
/* Improve table defaults */
table {
    border-collapse: collapse;
    border-spacing: 0;
  }
/* Modern scrollbar styling (webkit browsers) */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
::-webkit-scrollbar-track {
    background: transparent;
  }
::-webkit-scrollbar-thumb {
    background: rgba(156, 157, 171, 0.3);
    border-radius: 4px;
  }
::-webkit-scrollbar-thumb:hover {
    background: rgba(97, 98, 111, 0.5);
  }
/* Firefox scrollbar styling */
/*@import-normalize;*/
/* Base styles - foundational design tokens and typography */
:root:not(#\#):not(#\#):not(#\#):not(#\#) {
			/* osnovne boje */
			--color-cyan-95: rgb(221, 242, 255);
			--color-cyan-75: rgb(78, 186, 243);
			--color-cyan: rgb(0, 139, 194);
			--color-cyan-50: rgb(0, 107, 151);
			--color-cyan-25: rgb(0, 37, 55);

			--color-darkblue-95: rgb(226, 240, 255);
			--color-darkblue-75: rgb(132, 179, 226);
			--color-darkblue-50: rgb(59, 102, 146);
			--color-darkblue: rgb(0, 48, 87);
			--color-darkblue-25: rgb(0, 35, 65);

			--color-orange: rgb(250, 180, 15);
			--color-orange-95: rgb(255, 236, 205);
			--color-orange-75: rgb(225, 161, 0);

			--color-green: rgb(86, 194, 113);
			--color-green-90: rgb(143, 250, 166);
			--color-green-50: rgb(0, 120, 51);

			--color-red: rgb(215, 15, 32);
			--color-red-50: rgb(188, 0, 23);
			--color-red-70: rgb(255, 100, 91);

			--color-white: rgb(255, 255, 255);
			--color-grayscale-90: rgb(222, 222, 222);
			--color-grayscale-75: rgb(174, 174, 174);
			--color-grayscale-50: rgb(99, 99, 99);
			--color-grayscale-25: rgb(34, 34, 34);
			--color-black: rgb(0, 0, 0);

			--cyan: var(--color-cyan);
			/* --darkblue: var(--color-cyan-200); */
			--darkblue: var(--color-darkblue);


			--mainColor: var(--color-darkblue);
			--linkColor: var(--color-darkblue25);
			--linkHoverColor: var(--color-cyan-75);

			--iconLinkColor: var(--color-cyan);
			--iconLinkHoverColor: var(--color-cyan-25);

			--negativeColor: var(--color-cyan-25);
			--themebg: rgb(248, 252, 255);
			--themeDarkBg: var(--color-darkblue-25);
			--bgColorMainContainer: rgba(255, 255, 255, 0.9);
			/* --footerBgColor: var(--color-white); */
			--footerBgColor: var(--color-cyan-95);
			--footerTextColor: var(--color-grayscale-25);
			--footerLinkColor: var(--color-cyan);
			--footerLinkHooverColor: var(--color-cyan-50);

			--menuBgColor: var(--color-cyan);
			--userBarMainColor: var(--color-darkblue);

			/*Gradienti*/
			--mainBgGradient: radial-gradient(
			    farthest-side circle at top left in oklch,
				oklch(from var(--color-cyan) l c h / 0.4) 0%,
				oklch(from var(--color-cyan) l c h / 0.1) 30%,
				oklch(from var(--color-cyan) l c h / 0.2) 90%,
				oklch(from var(--color-darkblue-75) l c h / 1) 120%
			);


	  --hdr-gradient: conic-gradient(
    at 50% 50% in oklch,
    var(--color-orange) 0%, var(--color-cyan) 25%, var(--color-red) 50%, var(--color-green) 75%, var(--color-orange) 100%
  );

            --sjena-soft: 0 4px 25px oklch(from var(--color-black) l c h / 0.05);
            --sjena-hard: 0 4px 25px oklch(from var(--color-black) l c h / 0.2);

            /*--logoHeightBigMobile: 150px; /* Visina logotip na naslovnici na mobitelima */
			--logoHeightBig: 120px; /* Visina logotip na naslovnici */
			--logoHeight: 110px; /* Visina logotipa u headeru - smanjenog */
			--ui-padding: 1rem 2rem;
			--ui-h-padding: 0rem 1rem;
			--contentPadding: 2rem;
			--contentPaddingMin: 1rem;
			--vertical-space: 1rem;
			--maxContentWidth: 1200px;
			--maxObjavaWidth: 900px;
			--maxStranicaWidth: 900px;
			--iconSize: 1rem;
			--iconGap: 0.2rem; /* razmak ikone od teksta linka */
			--borderRadius: 1.5rem;
			--borderRadiumS: 0.8rem;
			--borderRadiusS: 0.8rem;
			--bannerGap: 1rem;
			--gridGap: 2rem;
			--galleryGap: 1rem;
			--formGap: 0.5rem;

			/* velicina fontova heading */
			--fontSizeH1: max(2rem, min(calc(2rem + ((1vw - 0.48rem) * 1.9972)), 3.438rem));

			--fontSizeH2: 1.8rem;
			/* --fontSizeH2: clamp(1.55rem, calc(1.55rem + ((1vw - 0.48rem) * 1.25)), 2.25rem); */

			--fontSizeH3: 1.3rem;
			/* --fontSizeH3: clamp(1.4rem, calc(1.4rem + ((1vw - 0.48rem) * 0.8333)), 2rem); */

			 --fontSizeH4: 1.2rem;
			/*--fontSizeH4: clamp(
				1.175rem,
				calc(1.175rem + ((1vw - 0.48rem) * 0.4514)),
				1.5rem
			);*/

			/* --fontSizeH5: 1.125rem; */
			/* --fontSizeH5: clamp(1rem, calc(1rem + ((1vw - 0.48rem) * 0.1736)), 1.125rem); */
			--fontSizeH5: 0.9rem;
			--fontSizeH6: 0.875rem;

			--linija: dotted 1px oklch(from var(--color-cyan) l c h / 0.4);

		}
@supports (color: color(display-p3 0 0 0%)){
:root:not(#\#):not(#\#):not(#\#):not(#\#) {
			--color-cyan-95: rgb(221, 242, 255);
			--color-cyan: rgb(0, 139, 194);
			--color-cyan-50: rgb(0, 107, 151);
			--color-cyan-25: rgb(0, 37, 55);

			--color-darkblue-95: rgb(226, 240, 255);
			--color-darkblue-25: rgb(0, 35, 65);
			--color-orange-95: rgb(255, 236, 205);
			--color-orange-75: rgb(225, 161, 0);
			--color-green-50: rgb(0, 120, 51);
			--color-red-50: rgb(188, 0, 23);
			--color-red-70: rgb(255, 100, 91);
			--themebg: rgb(248, 252, 255);

		}
}
/* Reset styles */
*:not(#\#):not(#\#):not(#\#):not(#\#) {
			margin: 0;
			padding: 0;
			box-sizing: border-box;
		}
html:not(#\#):not(#\#):not(#\#):not(#\#),
		body:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: 14px;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			-webkit-text-size-adjust: 100%;
			font-family: "Bespoke Sans", sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
		}
html:not(#\#):not(#\#):not(#\#):not(#\#) {
			/*background-color: var(--themebg);
			background: radial-gradient(
				circle farthest-corner at center top,
				oklch(from var(--color-white) l c h / 0.9) 0%,
				oklch(from var(--color-cyan-75) l c h / 0.1) 80%
			);
			background: var(--mainBgGradient);*/
			background-color: var(--themebg);
			background-size: cover;
			background-attachment: fixed;
			background-position: center top;
			width: 100%;
			height: 100%;
		}
body:not(#\#):not(#\#):not(#\#):not(#\#) {
			height: 100%;
			margin: 0;
			padding: 0;
			color: var(--mainColor);
			font-weight: 300;
		}
a:not(#\#):not(#\#):not(#\#):not(#\#),
		a:link:not(#\#):not(#\#):not(#\#):not(#\#),
		a:visited:not(#\#):not(#\#):not(#\#):not(#\#),
		a:active:not(#\#):not(#\#):not(#\#):not(#\#) {
		transform-origin: center center;
			color: var(--linkColor);
			-webkit-text-decoration:underline;
			text-decoration:underline;
			text-decoration-thickness: 1px;
			text-underline-offset: 0.3rem;
			text-decoration-color: oklch(from currentColor l c h / 0.1);
			transition: all linear 0.1s;
		}
a:link:hover:not(#\#):not(#\#):not(#\#):not(#\#) {
				color: var(--linkHoverColor);
				text-underline-offset: 0.4rem;
				text-decoration-color: oklch(from currentColor l c h / 0.5);
				/*animation: pulsate-fwd 0.3s ease-in-out;*/
			}
a:visited:hover:not(#\#):not(#\#):not(#\#):not(#\#) {
				color: var(--linkHoverColor);
				text-underline-offset: 0.4rem;
				text-decoration-color: oklch(from currentColor l c h / 0.5);
				/*animation: pulsate-fwd 0.3s ease-in-out;*/
			}
a:active:hover:not(#\#):not(#\#):not(#\#):not(#\#) {
				color: var(--linkHoverColor);
				text-underline-offset: 0.4rem;
				text-decoration-color: oklch(from currentColor l c h / 0.5);
				/*animation: pulsate-fwd 0.3s ease-in-out;*/
			}
a:not(.does-not-exist):hover:not(#\#):not(#\#):not(#\#):not(#\#) {
				color: var(--linkHoverColor);
				text-underline-offset: 0.4rem;
				text-decoration-color: oklch(from currentColor l c h / 0.5);
				/*animation: pulsate-fwd 0.3s ease-in-out;*/
			}
p:not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-bottom: 1rem;
		}
strong:not(#\#):not(#\#):not(#\#):not(#\#),
		b:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-weight: 500;
		}
h1:not(#\#):not(#\#):not(#\#):not(#\#), h2:not(#\#):not(#\#):not(#\#):not(#\#), h3:not(#\#):not(#\#):not(#\#):not(#\#), h4:not(#\#):not(#\#):not(#\#):not(#\#), h5:not(#\#):not(#\#):not(#\#):not(#\#), h6:not(#\#):not(#\#):not(#\#):not(#\#) {
		font-weight: 500;
			font-style: normal;
			color: var(--color-darkblue-90);
		}
:--heading:not(#\#):not(#\#):not(#\#):not(#\#) {
		font-weight: 500;
			font-style: normal;
			color: var(--color-darkblue-90);
		}
h1:not(#\#):not(#\#):not(#\#):not(#\#) strong, h2:not(#\#):not(#\#):not(#\#):not(#\#) strong, h3:not(#\#):not(#\#):not(#\#):not(#\#) strong, h4:not(#\#):not(#\#):not(#\#):not(#\#) strong, h5:not(#\#):not(#\#):not(#\#):not(#\#) strong, h6:not(#\#):not(#\#):not(#\#):not(#\#) strong, h1:not(#\#):not(#\#):not(#\#):not(#\#) b, h2:not(#\#):not(#\#):not(#\#):not(#\#) b, h3:not(#\#):not(#\#):not(#\#):not(#\#) b, h4:not(#\#):not(#\#):not(#\#):not(#\#) b, h5:not(#\#):not(#\#):not(#\#):not(#\#) b, h6:not(#\#):not(#\#):not(#\#):not(#\#) b {
			font-weight: 700;
			}
:--heading:not(#\#):not(#\#):not(#\#):not(#\#) strong,:--heading:not(#\#):not(#\#):not(#\#):not(#\#) b {
			font-weight: 700;
			}
h1:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: var(--fontSizeH1);
			line-height: 1.4em;
			letter-spacing: -0.02em;
			margin-bottom: 2rem;
			font-weight: 300;
			-webkit-text-decoration:underline;
			text-decoration:underline;
			text-decoration-thickness: 4px;
			text-underline-offset: 0.7rem;
			/*text-decoration-color: oklch(from currentColor l c h / 0.1);*/
			/*text-decoration-color: var(--themebg);*/
			text-decoration-color: oklch(from var(--color-orange) l c h / 0.7);
		}
h2:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: var(--fontSizeH2);
			line-height: 102%;
			/* identical to box height, or 45px */
			letter-spacing: -0.02em;
			margin-bottom: 1.5rem;
			margin-top: 1.5rem;
		}
h3:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: var(--fontSizeH3);
			line-height: 105%;
			/* identical to box height, or 34px */
			letter-spacing: -0.02em;
			margin-bottom: 1.3rem;
			margin-top: 1.3rem;
		}
h4:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: var(--fontSizeH4);
			line-height: 105%;
			/* or 25px */
margin-bottom: 1.2rem;
margin-top: 1.2rem;
			letter-spacing: -0.02em;
		}
h5:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: var(--fontSizeH5);
			line-height: 110%;
			/* identical to box height, or 20px */
margin-bottom: 1rem;
			letter-spacing: -0.02em;
		}
h6:not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: var(--fontSizeH6);
			line-height: 110%;
			/* or 15px */
			margin-bottom: 1rem;
			letter-spacing: -0.02em;
			text-transform: uppercase;
		}
ul:not(#\#):not(#\#):not(#\#):not(#\#),
		ol:not(#\#):not(#\#):not(#\#):not(#\#) {
			padding-left: 1rem;
			margin-bottom: 0.75rem;
		}
li:not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-bottom: 0.5rem;
		}
hr:not(#\#):not(#\#):not(#\#):not(#\#) {
	 border: 0;
    border-bottom: 1px dotted var(--color-cyan-75);
		margin-top: var(--contentPadding);
		margin-bottom: var(--contentPadding);
		}
body:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: flex;
			flex-direction: column;
			justify-content: space-between; /* da footer ide na dno stranice kad je malo sadržaja */
		}
body:has(#popmenu:popover-open):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		    overflow: hidden;
			filter: blur(10px);
		}
#modal:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			animation: jello-horizontal 0.9s both;
		}
.container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .full-width {
			padding: 0;
		}
.background-shape:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):after {
    content: '';
    display: block;
    min-height: calc(var(--logoHeightBig) + 40px);
    background: linear-gradient(180deg, var(--color-green)10% , oklch(from var(--color-cyan-75) l c h / 0.24) 60%, oklch(from var(--color-white) l c h / 0) 90%);
}
main:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/*margin: calc(var(--logoHeightBig) + 40px) auto 2rem auto;*/
		margin:0 auto auto auto;
		}
.naslovnica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
			width: 100%;
			/* max-width:var(--maxContentWidth); */
			display: grid;
			grid-template-columns: 1fr minmax(auto, var(--maxContentWidth)) 1fr;

			grid-template-areas:
				"slider slider slider"
				"hero hero hero"
				"user user user"
				"objave objave objave"
				"sadrzaj sadrzaj sadrzaj";
		}
.stranica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
			width: 100%;
			background-color: var(--bgColorMainContainer);
			max-width: var(--maxStranicaWidth);
			padding: var(--contentPadding);
			position:relative;
			/*display:grid;*/
			/*grid-template-columns: 3fr 1fr;*/
			/*grid-template-areas:
				"content context"
				"content context";*/

		}
/*.stranica main > *:not(.context-nav) {
		grid-area:content;
grid-row:auto;
		}*/
.context-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		float:right;
		position:relative;
		/*top:0;
		right:0;*/
		margin-left:2rem;
		max-width:250px;
		/*transform: translateX(50%);*/
		display:none;
		}
.stranica-objave:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
			max-width: var(--maxContentWidth);

		}
/*.naslov {
			margin: 1rem 0;
		}*/
.objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
			width: 100%;
			max-width: var(--maxContentWidth);
			display: grid;
			grid-template-columns: 1fr minmax(auto, var(--maxObjavaWidth)) 1fr;
			grid-gap: var(--gridGap);
			gap: var(--gridGap);
		}
.objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .datum {
				font-size: 1rem;
			}
.preview-slika:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-column: 2 / 3;
			grid-row: 1;
		}
.zaglavlje-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-column: 2 / 3;
			grid-row: 2;
		}
.uvod:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			font-size: 1.2em;
			margin-bottom: var(--contentPadding);
		}
.sadrzaj-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-column: 2 / 3;
			grid-row: 3;
		}
.navigacija-objave:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		grid-column: 2 / 3;
		grid-row: 4;
		}
.naslovnica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h1 {
			-ms-grid-row: 1;
			-ms-grid-column: 1;
			grid-area: naslov;
		}
.sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		grid-row:auto;
		    grid-column: 2/3;
			/*grid-area: sadrzaj;*/
			margin: var(--contentPadding);
			background-color: var(--bgColorMainContainer);
		}
.swiper:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {

		grid-row:auto;
		height:40vh;
		grid-column: 2/3;
			margin-bottom: var(--contentPadding);
			/*grid-area: slider;*/
			background-color: var(--bgColorMainContainer);
		}
.hero:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		    grid-row:auto;
			grid-column: 2/3;
			/*grid-area: hero;*/
			display: grid;
			grid-template-columns: 1fr;
			grid-gap: var(--gridGap);
			gap: var(--gridGap);
			padding: var(--contentPadding);
			margin: var(--contentPadding);
			background-color: var(--bgColorMainContainer);
		}
.user-bar:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/*grid-area: user;*/
			grid-row:auto;
			grid-column: 1/4;
		}
.preview-objave-grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/*grid-area: objave;*/
			grid-row:auto;
			    grid-column: 2/3;
		}
.akcije:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    /*grid-area: user;*/
  		grid-row:auto;
		grid-column: 2/3;
}
/* Base popover styles - keeping your existing styles */
#popmenu[popover]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			margin: 0;
			height: 100vh;
			height: 100vb;
			width: 90%;
			left: auto;
			left: initial;
			right: 0;
			background: var(--menuBgColor);
			border: 0;
		}
#popmenu:popover-open:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			clip-path: polygon(0% 0, 100% 0, 100% 100%, 2% 100%);
			display: grid;
			grid-template-columns: 1fr;
			grid-template-rows: auto 1fr auto;
			overflow: hidden; /* Prevent scrollbars during animations */
		}
#popmenu[popover]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::backdrop {
			background: black;
		}
@supports (color: lab(from red l 1 1% / calc(alpha + 0.1))){
#popmenu[popover]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::backdrop {
			background: oklch(from var(--color-black) l c h / 0.2);
		}
}
/* Enhanced main menu container */
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			position: relative;
			padding: var(--ui-padding);
			transition:
				transform 0.3s ease-in-out, opacity 0.3s ease-in-out;
			width: 100%;
			height: 100%;
		}
/* Enhanced submenu styles for multiple levels */
.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			align-self: start;
			position: absolute;
			top: 0;
			left: -120%;
			width: 100%;
			height: 100%;
			display: flex;
			box-sizing: border-box;
			padding: var(--ui-padding);
			transition:
				left 0.3s ease-in-out, opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			opacity: 1;
		}
.active-submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .submenu {
			left: -120%;
		}
/* Active submenu state */
.submenu.active-submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/* left: 0; */
			/* opacity: 1;
	transform: translateX(100%);*/
			z-index: 2;
		}
/* Menu level specific styling */
.submenu[data-level="1"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			background: var(--menuBgColor);
		}
.active-submenu[data-level="1"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			transform: translateX(120%);
		}
.submenu[data-level="2"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			left: -120%;
			background: var(--menuBgColor);
			filter: brightness(0.95);
		}
.active-submenu[data-level="2"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			transform: translateX(240%);
		}
.submenu[data-level="3"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			background: var(--menuBgColor);
			filter: brightness(0.9);
		}
.submenu[data-level="4"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			background: var(--menuBgColor);
			filter: brightness(0.85);
		}
/* Continue pattern for more levels as needed */
.submenu[data-level="5"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			background: var(--menuBgColor);
			filter: brightness(0.8);
		}
/* Button styles - keeping your existing styles */
.menu-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			background: oklch(from var(--color-white) l c h / 0);
			display: flex;
			text-indent: -6000px;
			overflow: hidden;
			align-items: center;
			justify-items: center;
			border: none;
			color: white;
			padding: 0.5rem;
			margin: 1.5rem 1rem 3rem;
			font-size: 1rem;
			cursor: pointer;
			gap: var(--iconGap);
			border-radius: 10px;
			box-shadow:
				-12px -12px 18px oklch(from var(--color-darkblue-25) l c h / 0.2),
				12px 12px 18px oklch(from var(--color-darkblue-50) l c h / 0.2);
		}
.menu-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):after {
			content: "";
			width: calc(2.5 * var(--iconSize));
			height: calc(2.5 * var(--iconSize));
			background-color: var(--color-white);
			--svg: url("https://api.iconify.design/famicons/menu.svg");
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
		}
.menu-button:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			animation: pulsate-menu 0.5s ease-in-out both;
			background-color: oklch(from var(--color-darkblue-95) l c h / 0.2);
		}
.close-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			justify-self: center;
			align-self: center;
			background: oklch(from var(--color-white) l c h / 0);
			display: flex;
			text-indent: -6000px;
			overflow: hidden;
			align-items: center;
			justify-items: center;
			border: none;
			color: white;
			padding: 0.5rem;
			margin: 2rem 1rem;
			font-size: 1rem;
			cursor: pointer;
			border-radius: 10px;
			box-shadow:
				-6px -6px 10px oklch(from var(--color-cyan-75) l c h / 0.2),
				6px 6px 10px oklch(from var(--color-darkblue) l c h / 0.2);
		}
.close-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):after {
			content: "";
			width: calc(2.5 * var(--iconSize));
			height: calc(2.5 * var(--iconSize));
			background-color: var(--color-white);
			--svg: url("https://api.iconify.design/famicons/close-circle-outline.svg");
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
		}
.close-button:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			animation: pulsate-menu 0.5s ease-in-out both;
			background-color: oklch(from var(--color-darkblue) l c h / 0.2);
			transition: text-indent 0.2s linear;
			gap: var(--iconGap);
			text-indent: 0px;
		}
/* Enhanced back button for multiple levels */
.back-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			justify-self: center;
			align-self: center;
			background: oklch(from var(--color-white) l c h / 0);
			display: flex;
			text-indent: -6000px;
			overflow: hidden;
			align-items: center;
			justify-items: center;
			border: none;
			color: white;
			padding: 0.5rem;
			margin: 1rem 1rem;
			font-size: 1rem;
			cursor: pointer;
		}
.back-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):after {
			content: "";
			width: calc(2.5 * var(--iconSize));
			height: calc(2.5 * var(--iconSize));
			background-color: var(--color-white);
			--svg: url("https://api.iconify.design/famicons/chevron-down-circle-outline.svg");
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
			transform: rotate(90deg);
		}
.back-button:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			animation: pulsate-menu 0.5s ease-in-out both;
			background-color: oklch(from var(--color-darkblue) l c h / 0.2);
			transition: text-indent 0.2s linear;
			gap: var(--iconGap);
			text-indent: 0px;
		}
/* Enhanced menu item styles */
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
			font-size: 1.4rem;
			color: var(--color-white);
			-webkit-text-decoration: none;
			text-decoration: none;
			margin: 0.5rem 0;
			transition: all 0.3s ease;
		}
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:hover,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:hover {
			animation: pulsate-fwd 0.5s ease-in-out both;
		}
/* Parent menu items with submenus */
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent {
			cursor: pointer;
			display: flex;
			align-items: center;
			justify-items: center;
			border: none;
			position: relative;
			order: inherit;
			padding-left: calc(2 * var(--iconSize));
		}
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent::after,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent::after {
			content: "";
			width: calc(2 * var(--iconSize));
			height: calc(2 * var(--iconSize));
			background-color: oklch(from var(--color-white) l c h / 0.8);
			--svg: url("https://api.iconify.design/famicons/chevron-down-circle-outline.svg");
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
			transition: all 0.3s ease;
		}
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent:hover::after,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent:hover::after {
			background-color: oklch(from var(--color-white) l c h / 1);
			--svg: url("https://api.iconify.design/famicons/chevron-down-circle.svg");
		}
/* Active parent items */
.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent.active::after,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a.parent.active::after {
			transform: rotate(180deg);
		}
/* Submenu headers */
.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h2 {
			color: oklch(from var(--color-white) l c h / 0.5);
			margin-bottom: 2rem;
			font-size: 1.5rem;
		}
/* Animation states for showing/hiding submenus */
.showing-submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .main-menu-container > a:not(.active) {
			animation: fade-out-a 0.2s linear both;
		}
/* Level indicator for deep nesting */
.submenu[data-level]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before {
			content: attr(data-level);
			position: absolute;
			top: 1rem;
			right: 1rem;
			background: oklch(from var(--color-white) l c h / 0.1);
			color: oklch(from var(--color-white) l c h / 0.5);
			padding: 0.25rem 0.5rem;
			border-radius: 0.25rem;
			font-size: 0.75rem;
			display: none; /* Hide by default, enable for debugging */
		}
/* Social networks menu - keeping your existing styles */
.sn-menu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: none;
			align-items: center;
			justify-items: center;
			gap: var(--iconGap);
		}
.sn-fb:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			--svg: url("https://api.iconify.design/famicons/logo-facebook.svg");
		}
.sn-ig:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			--svg: url("https://api.iconify.design/famicons/logo-instagram.svg");
		}
header:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .sn-menu a {
			padding: 0.5rem;
			margin: 1.5rem 0.2rem 3rem;
		}
.sn-menu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
			font-size: 1rem;
			text-indent: -6000px;
			overflow: hidden;
			color: currentcolor;
			background-color: currentcolor;
			cursor: pointer;
			width: calc(1.5 * var(--iconSize));
			height: calc(1.5 * var(--iconSize));
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
		}
.sn-menu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:hover {
			animation: pulsate-fwd 0.3s ease-in both;
			background-color: currentcolor;
		}
/*CONTEXT MENU*/
.context-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    /*margin: 1rem auto;*/
    font-size: 0.9em;
    padding:1rem;
    border-bottom-left-radius: var(--borderRadius);
    -webkit-backdrop-filter: blur(5px);
            backdrop-filter: blur(5px);
background-color: oklch(from var(--color-darkblue-75) l c h / 0.2);
}
.context-nav.ugridu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    /*order:4;*/
    grid-row:1;
    grid-column: 4 / span 1;
    max-width: 100%;
    margin:0;
}
.context-nav-link.active:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    /*text-decoration-color: oklch(from currentColor l c h / 0.8);*/
    font-weight: 500;
    /*color: var(--color-green);*/
    text-decoration-thickness: 2px;
    text-decoration-color: var(--color-orange);
}
.cta:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: block;
			margin: var(--vertical-space) inherit;
		}
.cta:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
				display: inline-block;
				padding: var(--ui-padding);
				border: 1px solid #000;
			}
.slikasadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/* border: 5px solid #eee; */
		margin: 0;}
.slika-original:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: block;
			margin: 0;
		}
/*.my-gallery a:first-child {
			position: relative;
			height: 400px;
			clip-path: inset(0);
		}*/
.text:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		margin-bottom: var(--contentPadding);
		}
.my-gallery:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-bottom: var(--contentPadding);
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
			grid-gap: var(--galleryGap);
			gap: var(--galleryGap);
		}
.slike:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    margin-bottom: var(--contentPadding);
  }
.slike:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) img {
        margin-bottom: var(--galleryGap);
    }
.banner:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: flex;
			flex-direction: column;
			color: var(--color-white);
			-webkit-text-decoration: none;
			text-decoration: none;
			text-transform: uppercase;
		}
.banner:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) span {
				font-size: 0.8em;
			}
.banner:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#){
		animation: blijed 0.5s ease-in-out;
		}
.banner:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
			max-width: 100%;
			max-height: 60px;
				height: 75px;
		}
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .banneri-zaglavlje {
			display: none;
		}
.dokumenti:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-bottom: var(--contentPadding);
			}
/* grupa dokumenata */
.grupa-dokumenata.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .dokumenti {
    padding: calc(var(--contentPadding) / 2);
  }
.dokumenti-grupa:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		margin: 0 0 var(--contentPadding) 0;

  }
.dokumenti-grupa h3 {
      margin: 0 0 0.5rem 0 !important;
    }
.dokumenti-grupa:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .datum {
      margin-bottom: 0.5rem;
    }
/*Tekst + slika */
.tekst-slika:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {

      margin-bottom: var(--contentPadding);
  }
/* Povezani sadrzaj*/
.povezaniSadrzaj:not(:last-of-type):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    margin-bottom: var(--contentPadding);
    /*padding-bottom: var(--contentPadding);*/
    border-bottom: 1px dotted oklch(from var(--color-orange) l c h / 0.7);
}
.povezaniSadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .sadrzaj-title {
    font-size: var(--fontSizeH2);
			letter-spacing: -0.02em;
			margin-bottom: 2rem;
			font-weight: 300;
			-webkit-text-decoration:underline;
			text-decoration:underline;
			text-decoration-thickness: 4px;
			text-underline-offset: 0.7rem;
			text-decoration-color: oklch(from var(--color-orange) l c h / 0.7);
}
.povezaniSadrzajPreview:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .sadrzaj-subtitle {
      font-size: var(--fontSizeH2);
      margin-bottom: 0.5rem;
    }
.povezaniSadrzajPreview:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .readmore {
        margin:0;
    }
.povezaniSadrzajPreview:not(:last-child):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    margin-bottom: var(--contentPadding);
    padding-bottom: var(--contentPadding);
    border-bottom: 1px dotted oklch(from var(--color-orange) l c h / 0.7);
}
.povezaniSadrzajLink:not(:last-child):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    margin-bottom: var(--contentPadding);
    /*padding-bottom: var(--contentPadding);*/
    border-bottom: 1px dotted oklch(from var(--color-orange) l c h / 0.7);
}
/*Dokumenti */
.document-size:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		flex-shrink:0;
		}
.grupa-dokumenata.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokumenti,

		.dokumenti.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokument {

			padding: calc(var(--contentPadding) / 2);
			border-radius: var(--borderRadius);
		}
.grupa-dokumenata.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokumenti .document-size,.dokumenti.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokument .document-size {
			flex-shrink:0;
			}
/* Javna nabava */
.stranica-nadmetanja:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h1 {
						font-size: var(--fontSizeH2);
						margin-left:0;
						text-decoration-thickness: 2px;
						}
.stranica-nadmetanja:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .stranica-nadmetanja-povezani {
					margin-top: 4rem;
					padding-top: 2rem;
					border-top: 1px dotted var(--color-cyan);
					}
.stranica-nadmetanja:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h2 {
					font-size: var(--fontSizeH3);
					margin-left:0;
					}
.nadmetanje-header:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {

		display: inline-flex;
		gap: var(--bannerGap);
		align-items:center;
		flex-wrap: wrap;
		padding: 1rem;
		margin-bottom: var(--contentPadding);
		border: 1px dotted var(--color-cyan-95);
		border-radius: var(--borderRadius);
		}
.nadmetanje-header:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .datum {
		margin:0;
		}
.nadmetanje-header:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .nazivluke {
		margin:0;
		padding-left: var(--bannerGap);
		border-left: 1px dotted var(--color-cyan);
		}
.nadmetanje-nabava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#), .nadmetanje-koncesija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		padding: calc(var(--contentPadding) / 2);
		border-radius: var(--borderRadius);
			background: linear-gradient(
				45deg,
				oklch(from var(--color-cyan-95) l c h / 0.2) 30%,
				oklch(from var(--color-white) l c h / 0.7) 70%
			);
				-webkit-backdrop-filter: blur(10px);
				        backdrop-filter: blur(10px);
				border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.5);
			}
/* sadrzaj stranica upravno vijece */
/* zaposljavanje */
.oglas:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		padding: var(--ui-padding);
		margin-bottom: var(--contentPadding);
		border: 1px dotted oklch(from var(--color-orange) l c h / 0.2);
		}
.oglas:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) p.datum {
		font-size: 1.2rem;
		color: var(--color-deepblue);
		font-weight: 500;
		}
.oglas:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h3 {
		margin:0;
		margin-bottom:0.5rem;
		}
.oglas:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .dokumenti {
		margin:0;
		}
/* FORMULARI */
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		    /*padding:var(--contentPadding);*/
						overflow:hidden;
						margin-bottom: var(--contentPadding);

		}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h2 {
						padding:var(--contentPadding);
						margin-left:0;
						background-color: var(--color-orange);
						margin-top:0;
						}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa {
						padding:var(--contentPadding);

						}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa:not(:first-of-type) {

						border-top: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.5);
						}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div {
						display: grid;
						margin-bottom: 1rem;
						grid-gap: var(--formGap);
						gap: var(--formGap);
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div.forma-prilozi:not(:last-of-type) {
						    padding-bottom: 1rem;
							border-bottom: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.3);
						}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div.forma-privole:not(:last-of-type) {
						    padding-bottom: 1rem;
							border-bottom: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.3);
						}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-opaska {
			    font-size: 0.9rem;
				margin-bottom: 1rem;
				padding-bottom: 1rem;
				border-bottom: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.3);
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-dodatni-opis{
			font-size: 0.9rem;
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) label {
			    margin-bottom:0.5rem;
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input,.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) textarea,.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) select {
				justify-self: start;
				border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.8);
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check {
   align-self: end;

			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check label {
    display: flex;
    font-weight: 700;
			text-transform:uppercase;
    flex-direction:row;
    align-items: center;
    grid-gap: var(--iconGap);
    font-size:0.9rem;

}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check label:before {
        order: 2;
        content: '';
        width:2rem;
        height:2rem;
        display:block;
        border: 1px solid oklch(from var(--color-cyan-75) l c h / 0.8);
    }
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check label:hover:before {
        background-color:var(--color-orange);
    }
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check input {
    display:none;
}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check input:checked + label:before {
        background-color:var(--color-green);
    				content: "";
				/*width: var(--iconSize);
				height: var(--iconSize);
				min-width: 14px;*/
				/*background-color: var(--iconLinkColor);*/
				/* Add mask image, use variable to reduce duplication */
				-webkit-mask-image: var(--svg);
				        mask-image: var(--svg);
				-webkit-mask-repeat: no-repeat;
				        mask-repeat: no-repeat;
				-webkit-mask-size: 100% 100%;
				        mask-size: 100% 100%;
				/*margin-top:3px;*/
        --svg: url("https://api.iconify.design/ri/checkbox-fill.svg");
    }
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .check input:checked + label:after {
        content:'';
        display:block;
        z-index:10;
        position:absolute;
      left: 10px;
      top: 0px;
      width: 8px;
      height: 10px;
      border: solid white;
      border-width: 0 1px 5px 0;
      transform: rotate(45deg);
    }
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input[type=file]{
			    height: inherit;
				border:none;
				margin-top:0.5rem;
				background-color: oklch(from var(--color-cyan-95) l c h / 0.3);
				display: flex;
				align-items: center;
				justify-content: center;
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input[type=file]::file-selector-button {
				border: 2px solid var(--color-white);
				padding: 0.5rem 1rem;
				border-radius: .2em;
				background-color: transparent;
				transition: all linear 0.3s;
			}
@supports (color: lab(from red l 1 1% / calc(alpha + 0.1))){
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input[type=file]::file-selector-button {
				border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.8);
			}
}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input[type=file]::file-selector-button:hover {
    background-color: var(--color-green);
			color: var(--color-white);
}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input,.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) select {
							height:2.5rem;
						}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) button {
			font-weight: 700;
			text-transform:uppercase;
			padding: var(--ui-padding);
			background-color: var(--color-green);
			color: var(--color-white);

			border: 2px solid var(--color-white);
			box-shadow: var(--sjena-hard);
			transitions: all linear 0.2s;
			}
.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) button:hover {
			background-color: var(--color-orange);
			color: var(--color-white);
			box-shadow: var(--sjena-soft);
			}
input:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) + .form-help {
            font-size: 0.9rem;
            display:none;
		}
input:not(:focus):invalid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) + .form-help {
            margin-top: 0.5rem;
            display: block;
            color: var(--color-red);
		}
/*.asset-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.asset-item {
    border: 1px solid #ddd;
    padding: 1rem;
    border-radius: 4px;
    background: #fff;
}

.asset-img {
    width: 100%;
    height: auto;
    border-radius: 4px;
}

.asset-pagination .asset-page-btn {
    padding: 0.5rem 1rem;
    border: 1px solid #ddd;
    background: white;
    border-radius: 4px;
    cursor: pointer;
}

.asset-page-current {
    padding: 0.5rem 1rem;
    background: #007bff;
    color: white;
    border-radius: 4px;
    border: 1px solid #007bff;
}*/
.asset-ellipsis:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    padding: 0.5rem;
}
/* external links */
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-bottom: 0.5rem;
		}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
				display: flex;
				align-items: start;
				gap: var(--iconGap);
				-webkit-text-decoration:none;
				text-decoration:none;
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:before {
				content: "";
				width: var(--iconSize);
				height: var(--iconSize);
				min-width: 14px;
				background-color: var(--iconLinkColor);
				/* Add mask image, use variable to reduce duplication */
				-webkit-mask-image: var(--svg);
				        mask-image: var(--svg);
				-webkit-mask-repeat: no-repeat;
				        mask-repeat: no-repeat;
				-webkit-mask-size: 100% 100%;
				        mask-size: 100% 100%;
				margin-top:3px;
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .datum-dokument {
				padding-left: calc(var(--iconSize) + var(--iconGap));
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:hover:before {
				animation: heartbeat 1.5s ease-in-out infinite both;
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href^="http://"] {
				padding-right: 13px;
			}
/* emails */
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href^="mailto:"] {
				padding-right: 20px;
				/* email link */
				--svg: url("https://api.iconify.design/ri/mail-send-line.svg");

			}
/* jpgs */
/* a[href$=".jpg"] {
        padding-right: 18px;
        background-color: #f00;
        background: url('acrobat.png') no-repeat center rightright;
    } */
/*a[href="https://zluk.hr"] {*/
/* link to specific website */
/*}*/
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href^="/"],.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href^=".."] {
				/* internal relative link */
				--svg: url("https://api.iconify.design/ri/link-m.svg");
			}
/* pdfs */
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".pdf"] {
				/*--svg: url("https://api.iconify.design/simple-icons/adobe.svg");*/
				--svg: url("https://api.iconify.design/ri/file-pdf-2-line.svg");
				--iconLinkColor: var(--color-red-70);
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".doc"],.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".docx"] {
			/* Microsoft Word document */
			--svg: url("https://api.iconify.design/ri/file-text-line.svg");
				/*--svg: url("https://api.iconify.design/ri/link-m.svg");*/
				--iconLinkColor: var(--color-cyan-75);
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".xls"],.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".xlsx"] {
				--svg: url("https://api.iconify.design/ri/file-excel-line.svg");
				/* Microsoft Word document */
				--iconLinkColor: var(--color-green);
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".csv"] {
				--svg: url("https://api.iconify.design/ri/table-view.svg");
				/* CSV */
				--iconLinkColor: var(--color-orange);
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".mp3"] {
				/* Music file */
				--svg: url("https://api.iconify.design/ri/music-2-fill.svg");
			}
.dokument:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a[href$=".zip"] {
				/* Archive file */
				--svg: url("https://api.iconify.design/ri/file-zip-line.svg");
				--iconLinkColor: var(--color-grayscale-50);
			}
a.link:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: inline-flex;
			align-items: start;
			margin-right: 0.5rem;
			gap: var(--iconGap);
			/*text-decoration:none;*/
		}
a.link:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
			content: "";
			width: var(--iconSize);
			height: var(--iconSize);
			min-width: 14px;
			background-color: var(--iconLinkColor);
			/* Add mask image, use variable to reduce duplication */
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
			margin-top:3px;
		}
a.link:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
			animation: heartbeat 1.5s ease-in-out infinite both;
		}
a.link[href^="http://"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			padding-right: 13px;
		}
/* emails */
.link.email:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			padding-right: 20px;
			--svg: url("https://api.iconify.design/ri/mail-send-line.svg");
		}
.link.webpage:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/* internal relative link */
			--svg: url("https://api.iconify.design/ri/link-m.svg");
		}
/* pdfs */
a.link[href$=".pdf"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/*--svg: url("https://api.iconify.design/simple-icons/adobe.svg");*/
			--svg: url("https://api.iconify.design/ri/file-pdf-2-line.svg");
			--iconLinkColor: var(--color-red-70);
		}
a.link[href$=".doc"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#),
		a.link[href$=".docx"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/* Microsoft Word document */
		--svg: url("https://api.iconify.design/ri/file-text-line.svg");
			/*--svg: url("https://api.iconify.design/ri/link-m.svg");*/
			--iconLinkColor: var(--color-cyan-75);

		}
a.link[href$=".xls"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#),
		a.link[href$=".xlsx"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			--svg: url("https://api.iconify.design/ri/file-excel-line.svg");
			/* Microsoft Word document */
			--iconLinkColor: var(--color-green);
		}
a.link[href$=".csv"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			--svg: url("https://api.iconify.design/ri/table-view.svg");
			/* CSV */
			--iconLinkColor: var(--color-orange);
		}
a.link[href$=".mp3"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/* Music file */
			--svg: url("https://api.iconify.design/ri/music-2-fill.svg");
		}
a.link[href$=".zip"]:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/* Archive file */
			--svg: url("https://api.iconify.design/ri/file-zip-line.svg");
			--iconLinkColor: var(--color-grayscale-50);
		}
header:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     transition:
         transform 0.4s ease, box-shadow 0.3s ease;
     z-index: 1000;
     padding: var(--ui-padding);
 }
/* Header state for hiding */
header.hide:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
     transform: translateY(-100%);
     box-shadow: none;
 }
.header-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: grid;
			grid-template-columns: 1fr 1fr 2fr;
			height: 100%;
			width: 100%;
			max-width: var(--maxContentWidth);
			margin: 0 auto;
			position: relative;
		}
.header-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h1 {
				margin: 0px;
			}
.header-butoni:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-column: 3;
			display: flex;
			align-items: center;
			justify-content: flex-end;
		}
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .header-container {
			justify-content: flex-end;
		}
.logo:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			position: absolute;
			top: 15px;
			left: 50%;
			transform: translateX(-50%);
			z-index: 1001;
			transition: all 0.3s ease;
		}
.logo:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
				margin: 0;
				padding: 0;
			}
.logo:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
			animation: fade-in 1.2s cubic-bezier(0.39, 0.575, 0.565, 1) both;
			height: var(--logoHeightBig);
			width: auto;
			transition: all 0.3s ease;
			transform-origin: top left; /* Transform from top left corner */
		}
/* Shrunk state */
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo {
			top: -5px;
		}
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo svg {
			height: var(--logoHeight);
		}
nav:not(.sn-menu):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-left: auto; /* Push nav to the right */
		}
nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) ul {
			display: flex;
			list-style: none;
		}
nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) ul li {
			margin-left: 20px;
		}
.content:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			padding: 120px 5% 40px; /* Adjusted to account for fixed header */
			min-height: 2000px; /* To enable scrolling */
		}
.banneri-zaglavlje:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: grid;
			/* min-height: 60px; */
			grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
			grid-template-rows: repeat(auto-fill, 40px);
			grid-gap: 5px var(--bannerGap);
			gap: 5px var(--bannerGap);
		}
.header-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			color: var(--color-white);

		}
.logotext:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: none;
		}
/* Normal state logo styling */
.logo-full:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo-text {
			fill: var(--mainColor);
			transition: opacity 0.3s ease;
		}
.logo-full:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
					filter: drop-shadow(1px 1px 20px oklch(from var(--color-cyan-75) l c h / 0.3));
		}
.logo-full:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo-bg {
			fill: #fff;
			opacity: 1;
			filter: blur(0px);

		}
/* Different styling for shrunk logo */
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo-text {
			fill: #000;
			opacity: 0;
		}
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo-bg {
			fill: var(--darkblue);
			opacity: 0.2;
			filter: blur(5px);
		}
.shrink:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .logo-logo {
			opacity: 1;
		}
nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) ul li a {
			-webkit-text-decoration: none;
			text-decoration: none;
			color: #333;
		}
footer:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			/*background-color: var(--footerBgColor);*/
			/*position:relative;*/
			margin-top:2rem;
			display: grid;
			color: var(--footerTextColor);
			font-size: 0.9em;
		}
.footer-content:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: flex;
			flex-wrap: wrap;
			/*display: grid;*/
			/*grid-auto-columns: minmax(max-content, 4fr) minmax(max-content, 1fr);*/
			/*grid-template-columns: repeat(auto-fit, minmax(max-content, 1fr));*/
			grid-auto-columns: minmax(max-content, 2fr);
			gap: var(--gridGap);
			justify-content: space-between;
			align-items: start;
			padding: var(--ui-padding);
			padding-top:2rem;
			max-width: var(--maxContentWidth);
			margin: 0 auto;
			width:100%;
		}
footer:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
			color: var(--footerLinkColor);
			text-underline-offset: 0.3em;
text-decoration-thickness: 2px;
text-decoration-color: oklch(from currentColor l c h / 0.1);
transition: all linear 0.2s;
		}
footer:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:hover {
				color: var(--footerLinkHooverColor);
				text-decoration-color: oklch(from currentColor l c h / 0.7);
				text-underline-offset: 0.5em;
			}
/* ----------------------------------------------
 * Generated by Animista on 2025-2-24 22:34:52
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
		 * ----------------------------------------
		 * animation jello-horizontal
		 * ----------------------------------------
		 */
/**
		 * ----------------------------------------
		 * animation pulsate-fwd
		 * ----------------------------------------
		 */
/* animacija butona menu i zatvori s prikazom teksta na hover */
/* Float animation for background shape */
/* ----------------------------------------------
 * Generated by Animista on 2025-3-14 0:8:24
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info.
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
		 * ----------------------------------------
		 * animation heartbeat
		 * ----------------------------------------
		 */
/* ----------------------------------------------
  * Generated by Animista on 2025-3-19 21:50:38
  * Licensed under FreeBSD License.
  * See http://animista.net/license for more info.
  * w: http://animista.net, t: @cssanimista
  * ---------------------------------------------- */
/**
		 * ----------------------------------------
		 * animation fade-in
		 * ----------------------------------------
		 */
/* --------------POZADINE SADRZAJA------------------------------- */
.content-white:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		background: rgba(255, 255, 255, 0.8);
		box-shadow: var(--sjena-soft);
		-webkit-backdrop-filter: blur(10px);
		        backdrop-filter: blur(10px);
	}
@supports (color: lab(from red l 1 1% / calc(alpha + 0.1))){
.content-white:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		background: oklch(from var(--color-white) l c h / 0.8);
	}
}
.content-trans-white-70:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		background: oklch(from var(--color-white) l c h / 0.7);
		box-shadow: var(--sjena-soft);
		-webkit-backdrop-filter: blur(10px);
		        backdrop-filter: blur(10px);
		border: 1px solid oklch(from var(--color-white) l c h / 0.8);
	}
.content-trans-white:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	position: relative;
	/*overflow: hidden;*/
	}
.content-trans-white:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
			z-index: -1;
			content: "";
			position: absolute;

			width: 100%;
			height: 100%;
			background: linear-gradient(
				0deg,
				oklch(from var(--color-white) l c h / 0.95) 0%,
				oklch(from var(--color-white) l c h / 0.9) 80%
			);

			border-color: var(--color-white)
				oklch(from var(--color-cyan-75) l c h / 0.1) var(--color-white)
				oklch(from var(--color-cyan-95) l c h / 0.5);
			border-style: solid;
			border-width: 1px;
			/*box-shadow: var(--sjena-soft);*/
			-webkit-backdrop-filter: blur(10px);
			        backdrop-filter: blur(10px);
		}
.content-trans-white:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):after {
			content: "";
			position: absolute;
			z-index: -2;
			width: 96%;
			height: 90%;
			transform: translateX(2%) translateY(5%);
			background: var(--hdr-gradient);
			border-radius: var(--borderRadius);
			filter: blur(2rem);
			opacity:0.4;
		}
.content-dotted-border:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		-webkit-backdrop-filter: blur(10px);
		        backdrop-filter: blur(10px);
		border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.5);
	}
.doc-bg:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#),
.dokumenti.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokument,
.grupa-dokumenata.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokumenti {
	background: linear-gradient(
		45deg,
		oklch(from var(--color-white) l c h / 0.1) 30%,
		oklch(from var(--color-white) l c h / 0.4) 70%
	);
		-webkit-backdrop-filter: blur(10px);
		        backdrop-filter: blur(10px);
		border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.5);
	}
.rounded-all:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	border-radius: var(--borderRadius);

	}
.rounded-bottom:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	border-radius: 0 0 var(--borderRadius) var(--borderRadius);
	}
.content-trans-white.rounded-all:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
	border-radius: var(--borderRadius);
	}
/* Pozadine sadržaja */
/* PRIKAZ LUKE */
#map:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			height: 60vh;
			max-height: 800px;
		}
.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
			width: 100%;
			max-width: var(--maxContentWidth);
			padding: var(--contentPadding);
			display: grid;
			grid-gap: var(--gridGap);
			gap: var(--gridGap);
			grid-template-columns: 1fr;
			grid-template-areas:
				"naslov"
				"text"
				"mapa"
				"izbornik";
		}
.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main #map {
				-ms-grid-row: 5;
				-ms-grid-column: 1;
				border-radius: var(--borderRadiumS);
				grid-area: mapa;
				margin-bottom: var(--contentPadding);
			}
.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .naslov {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				grid-area: naslov;
			}
.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .text {
				-ms-grid-row: 3;
				-ms-grid-column: 1;
				grid-area: text;
			}
.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .luke-izbornik {
				-ms-grid-row: 7;
				-ms-grid-column: 1;
				grid-area: izbornik;
			}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
		/*background-color: var(--bgColorMainContainer);*/
			margin-left: auto;
			margin-right: auto;
			width: 100%;
			max-width: var(--maxStranicaWidth);
			padding: var(--contentPadding);
		}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .luka-hero {
				display: grid;
				grid-gap: var(--gridGap);
				gap: var(--gridGap);
				/* grid-template-columns: 1fr 1fr 1fr; */
				grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
				margin-bottom: var(--contentPadding);
			}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .lokacija-kontakt {
				/* grid-column: 2 /span 2; */

				padding: var(--contentPadding);
			}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .preview-slika {
				margin-bottom: var(--galleryGap);
			}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main aside {
				display: grid;
				grid-gap: var(--galleryGap);
				gap: var(--galleryGap);
				grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
				margin-bottom: var(--contentPadding);
			}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main aside #map {
					min-height: 300px;
				}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .luka-sadrzaj {
				/* grid-area: naslov; */
				margin-bottom: var(--contentPadding);
			}
.stranica-luka:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .luka-lokacija {
				/* grid-area: orto; */
				margin-bottom: var(--contentPadding);
			}
.luka-sadrzaj222:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: grid;
			grid-template-columns: 2fr 1fr;
			grid-gap: var(--gridGap);
		}
.luka-ortofoto-projekt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			padding: var(--ui-padding);
			border: 1px solid var(--color-cyan);
			border-radius: var(--borderRadiusS);
			margin: 1rem 0;
			-webkit-text-decoration: none;
			text-decoration: none;
			color: var(--color-cyan);
			font-weight: bold;
			transition: all 0.3s linear;
		}
.luka-ortofoto-projekt:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
				transition: all 0.3s linear;
				color: var(--color-cyan-50);
			}
/* Popis luka */
.popis-luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			padding: var(--contentPaddingMin);
			align-self: start;
		}
.popis-luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .popis-luke-lista {
				display: grid;
				grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
				grid-gap: var(--bannerGap);
				gap: var(--bannerGap);
				margin-bottom: var(--contentPadding);
			}
.popis-luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h3 {
				/*font-size: 1em;*/
				color: var(--color-cyan);
				/*margin-top:3rem;*/
				margin-bottom:2rem;
			}
.popis-luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
				-webkit-text-decoration: none;
				text-decoration: none;
				text-transform: uppercase;
				font-size: 0.85em;
				/*animation: 3s infinite alternate pulsate-fwd;*/
				display:inline-block;
				font-weight:500;
				line-height:1.1rem;
				/*text-wrap: balance;*/
				text-wrap-style: pretty;
			}
.popis-luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a:hover {
				/*animation: 2s infinite alternate pulsate-fwd;*/
				/*animation: pulsate-fwd 2s linear;*/
					/*font-weight: bold;*/
					animation: bounce 0.3s ease-in;

				}
/* Dropdown odabri luka */
.luke-izbornik:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display: grid;
			grid-gap: var(--gridGap);
			gap: var(--gridGap);
			grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
			align-items: center;
			justify-content: center;
			margin: 4rem auto var(--contentPadding) auto;
			max-width: var(--maxStranicaWidth);
			padding: var(--contentPadding);
		}
.luke-izbornik:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .dropdown-container {
				text-align: center;
			}
.luke-izbornik:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h2 {
				color: #333;
				margin-bottom: 0px;
				text-align: center;
				font-weight: 300;
				font-size: 24px;
			}
.select-wrapper:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			position: relative;
			display: inline-block;
			width: 300px;
		}
.styled-select:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			width: 100%;
			padding: 15px 20px;
			font-size: 16px;
			font-family: inherit;
			color: #333;
			background: #fff;
			border: 2px solid #e0e0e0;
			border-radius: 10px;
			appearance: none;
			-webkit-appearance: none;
			-moz-appearance: none;
			cursor: pointer;
			transition: all 0.3s ease;
			outline: none;
		}
.styled-select:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			border-color: #667eea;
			box-shadow: 0 5px 15px rgba(102, 126, 234, 0.2);
			transform: translateY(-2px);
		}
.styled-select:focus:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			border-color: #667eea;
			box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.2);
			transform: translateY(-2px);
		}
.select-wrapper:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after {
			content: "▼";
			position: absolute;
			top: 50%;
			right: 20px;
			transform: translateY(-50%);
			color: #667eea;
			font-size: 12px;
			pointer-events: none;
			transition: transform 0.3s ease;
		}
.styled-select:focus:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) + .select-wrapper::after {
			transform: translateY(-50%) rotate(180deg);
		}
.styled-select:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) option {
			padding: 10px;
			font-size: 16px;
			background: #fff;
			color: #333;
		}
.styled-select:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) option:hover {
			background: #f5f5f5;
		}
.styled-select:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) option:checked {
			background: #667eea;
			color: #fff;
		}
/* Alternative custom dropdown styles */
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			margin-top: 40px;
		}
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select {
			background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
			color: white;
			border: none;
			box-shadow: 0 5px 15px rgba(102, 126, 234, 0.3);
		}
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select:hover {
			transform: translateY(-3px);
			box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4);
		}
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select:focus {
			box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.3);
		}
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .select-wrapper::after {
			color: white;
		}
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select option {
			background: #667eea;
			color: white;
		}
.dropdown-alt:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select option:hover {
			background: #5a6fd8;
		}
/* Minimal style */
.dropdown-minimal:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select {
			border: none;
			border-bottom: 2px solid #e0e0e0;
			border-radius: 0;
			background: transparent;
			padding: 10px 30px 10px 0;
		}
.dropdown-minimal:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select:hover,
		.dropdown-minimal:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .styled-select:focus {
			border-bottom-color: #667eea;
			transform: none;
			box-shadow: none;
		}
.dropdown-minimal:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .select-wrapper::after {
			right: 10px;
		}
.search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		justify-self: center;
		align-items:center;
		color: var(--color-white);
		padding: var(--contentPadding);
		display: flex;
		flex-direction:column;
		}
/*.search {
      position: absolute;
      top: 50%;
      left: 50%;
      transform:  translate(-50%,50%);
      background: #2f3640;
      height: 40px;
      border-radius: 40px;
      padding: 10px;

  }*/
.search-bar:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      display:flex;
      align-items:center;
  }
.search-bar:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .searchInput {
      width: 240px;
      padding: 0 6px;
      border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.5);
  }
.searchInput:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::-moz-placeholder {
      color: #fff;
  }
.searchInput:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::placeholder {
      color: #fff;
  }
.search-bar:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .search-button {
    background: white;
    color : #2f3640;
  }
.search-button:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			justify-self: center;
			align-self: center;
			background: oklch(from var(--color-white) l c h / 0);
			display: flex;
			text-indent: -6000px;
			overflow: hidden;
			align-items: center;
			justify-items: center;
			border: none;
			color: white;
			padding: 0.5rem;
			margin: 2rem 1rem;
			font-size: 1rem;
			width: calc(4 * var(--iconSize));
			height: calc(4 * var(--iconSize));
			cursor: pointer;
			border-radius: 10px;
			box-shadow:
				-6px -6px 10px oklch(from var(--color-cyan-75) l c h / 0.2),
				6px 6px 10px oklch(from var(--color-darkblue) l c h / 0.2);
		}
/*
		.close-button:after {
			content: "";
			width: calc(2.5 * var(--iconSize));
			height: calc(2.5 * var(--iconSize));
			background-color: var(--color-white);
			--svg: url("https://api.iconify.design/famicons/close-circle-outline.svg");
			mask-image: var(--svg);
			mask-repeat: no-repeat;
			mask-size: 100% 100%;
		}

		.close-button:hover {
			animation: pulsate-menu 0.5s ease-in-out both;
			background-color: oklch(from var(--color-darkblue) l c h / 0.2);
			transition: text-indent 0.2s linear;
			gap: var(--iconGap);
			text-indent: 0px;
		}*/
.searchButton:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      color: white;
      float: right;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: #2f3640;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: 0.4s;
  }
.searchInput:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      border:none;
      background: none;
      outline:none;
      float:left;
      padding: 0;
      color: white;
      font-size: 16px;
      transition: 0.4s;
      line-height: 40px;
      width: 0px;

  }
.stranica-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .search {
      color: var(--mainColor);
  }
.stranica-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .search .search-button {
          background-color: var(--color-orange);
          color: var(--color-white);
      }
.stranica-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .search .searchInput {
color: var(--color-cyan-50);
      }
.stranica-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .search .searchInput::-moz-placeholder {
          color: var(--color-cyan);
      }
.stranica-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .search .searchInput::placeholder {
          color: var(--color-cyan);
      }
.results-count:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    padding: var(--contentPadding);
    border-radius: var(--borderRadius);
    border: 1px dotted oklch(from var(--color-cyan-75) l c h / 0.5);
    margin-bottom:2rem;
}
.result-type:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      font-size:0.9rem;
      color: var(--color-cyan);
  }
.result-query:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      color: var(--color-cyan);
  }
.stranica-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) article {
      margin-bottom:1rem;
  }
/* Define the layer hierarchy for the entire project */
/* Naslovnica user bar  */
.user-bar:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		--mainColor: var(--color-cyan-75);
		--negativeColor: var(--color-darkblue);
		width: 100%;
		min-height: 400px;
		display: grid;
		/*grid-template-columns: 1fr minmax(auto, var(--maxContentWidth)) 1fr;*/
		grid-template-columns: 1fr;
		margin-bottom: var(--contentPadding);
		margin-top: var(--contentPadding);
		background-size: cover;
		animation: floatslow 5s ease-in-out infinite;
		/* clip-path: polygon(0 0, 100% 0, 100% var(--dl), 0% var(--dd)); */
	}
.user-bar:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
		content: "";
		height: 100%;
		width: 100%;
		grid-column: 1 / 4;
		grid-row: 1;
		background: linear-gradient(
			90deg,
			oklch(from var(--color-darkblue) l c h / 0.8) 0%,
			oklch(from var(--color-darkblue) l c h / 0) 100%
		);
	}
.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/*grid-column: 2 / 3;*/
		grid-row: 1;
		align-self: center;
		width: 100%;
		display: grid;
		/* grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); */
		grid-template-columns: 1fr 1fr;
		grid-template-areas: "text text"
		"webcam ." "vezovi brodskelinije";
		/* align-content: center; */
		grid-gap: var(--bannerGap);
		gap: var(--bannerGap);
		overflow: hidden;
		padding: var(--contentPadding);
	}
.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .webcam {
		-ms-grid-row: 3;
		-ms-grid-column: 1;
		grid-area: webcam;
		}
.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .zahtjev-vez {
		-ms-grid-row: 5;
		-ms-grid-column: 1;
		grid-area: vezovi;
		}
.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .brodskelinije {
		-ms-grid-row: 5;
		-ms-grid-column: 3;
		grid-area: brodskelinije;
		}
.user-bar-uvodni-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		-ms-grid-row: 3;
		-ms-grid-column: 1;
		color: var(--color-white);
		font-size: 1.5em;
		align-self: center;
		grid-area: text;
	}
.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .user-bar-uvodni-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		-ms-grid-row: 1;
		-ms-grid-column: 1;
		-ms-grid-column-span: 3;
	}
.user-bar2:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/* padding: var(--contentPadding); */
		width: 100%;
		/* padding-top:calc(var(--logoHeightBig) + 15px); */

		display: grid;
		/* grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); */
		grid-template-columns: 1fr 1fr 2fr;
		align-content: center;
		grid-gap: var(--gridGap);
		gap: var(--gridGap);
		overflow: hidden;
	}
.user-bar-content:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/*align-self: start;*/
text-align:center;
		/* & > * {
        position:relative;
        padding: var(--contentPadding);
    } */
		/* & > *:after {
    content:'';
    position:absolute;
    top:0;
    left:calc(-1 * (var(--gridGap)/2));
    width:1px;
    height:100vh;
    background-color: hsla(var(--color-cyan-80)/ 0.5);
    } */
	}
.zahtjev-vez:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#),
	.webcam:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#),
	.brodskelinije:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		padding: var(--bannerGap);
		display: flex;
		flex-direction:column;
			align-items: center;
			justify-content: center;
		/*gap: var(--bannerGap);*/
		position: relative;
	}
.zahtjev-vez:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
		max-width: 110px;
		/*max-width: 50%;*/
	}
.webcam:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
		/*height: 130px;*/
		max-width: 70px;
		/*max-width: 60%;*/
	}
.brodskelinije:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
		/*height: 130px;*/
		max-width: 130px;
		/*max-width: 70%;*/
	}
.svg-boja1:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		fill: var(--color-darkblue);
		fill-rule: nonzero;
		stroke: var(--color-darkblue);
		stroke-width: 0px;
	}
.svg-boja2:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/* fill:url(#Gradient1); */
		fill: none;
		fill-rule: nonzero;
		stroke: var(--color-darkblue);
		stroke-width: 4px;
	}
.svg-boja3:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		fill: oklch(from var(--color-darkblue) l c h / 0.2);
		fill-rule: nonzero;
		stroke: var(--color-darkblue);
		stroke-width: 0px;
	}
.stop1:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		stop-color: oklch(from var(--color-cyan) l c h / 0);
	}
.stop2:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		stop-color: var(--color-darkblue);
	}
.stop3:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		stop-color: oklch(from var(--color-cyan) l c h / 0);
	}
/*AKCIJE NA NASLOVNICI */
.akcije:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	margin: 3rem auto;
	width:100%;
    max-width: var(--contentWidth);
    display:grid;
    align-items: center;
    justify-content:center;
    grid-template-columns: repeat(auto-fit, minmax(250px,1fr));
    padding-top: 3rem;
    border-top: var(--linija);
	}
/* PRIKAZ PREVIEW OBJAVA */
.preview-objave-grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/*grid-area: objave;*/
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: masonry;
		grid-gap: var(--gridGap);
		gap: var(--gridGap);
		margin: var(--contentPadding);
	}
.preview-objave-hero:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/* grid-area: objave-hero; */
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: masonry;
		grid-gap: var(--gridGap);
		gap: var(--gridGap);
	}
.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		overflow: hidden;
		padding-bottom: var(--contentPadding);
		/* transition: transform 0.3s ease; */
		/* border: 5px solid hsl(var(--color-cyan-50)); */
		/* &:hover {
        transform: translateY(-5px);
    } */
		transition: transform 0.3s ease;
	}
.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)  > *:not(.slika) {
			padding: var(--ui-h-padding);
		}
.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .datum {
			margin-top: 1rem;
			margin-bottom: 0.5rem;
		}
.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
		margin: 0;
		padding:0;
		-webkit-text-decoration:none;
		text-decoration:none;
		}
.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h3,.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a h3 {
			margin-top: 0rem;
			font-weight: normal;
		}
.preview-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .opisni-tekst {
			margin-top: 1rem;
			/* font-size:0.9em; */
		}
.preview-objava:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			transform: translateY(-5px);
			box-shadow: 0 20px 50px rgba(0, 0, 0, 0.14);
		}
/* PRIKAZ DOKUMENATA NA STRANICAMA */
.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: masonry;
  grid-gap: calc(var(--gridGap) / 2);
  gap: calc(var(--gridGap) / 2);
}
/*@media (--viewport-medium) {
	grid-template-columns: 1fr 1fr 1fr;
	}
	@media (--viewport-large) {
	grid-template-columns: 1fr 1fr 1fr 1fr;
	}


	.grid.stupaca-1 {
	grid-template-columns: 1fr;
	}

	.grid.stupaca-2 {
	@media (--viewport-small) {
	grid-template-columns: 1fr 1fr;
	}
	}

	.grid.stupaca-3 {
	@media (--viewport-large) {
	grid-template-columns: 1fr 1fr 1fr 1fr;
	}

	}
*/
.sjednica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		padding: calc(var(--contentPadding) / 2);
		transition: transform 0.3s ease;
	}
.sjednica h3 {
			margin: 0 0 0.5rem 0 !important;
		}
.sjednica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .datum {
			margin-bottom: 0.5rem;
		}
.sjednica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
			margin-bottom: 0.5rem;
			-webkit-text-decoration: none;
			text-decoration: none;
		}
.sjednica:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			transform: translateY(-5px);
		}
/* vremenska prognoza */
.weather-widget:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		/* padding: var(--ui-padding); */
		/* max-width: 400px; */
		width: 100%;
		text-align: center;

		transition: transform 0.3s ease;
		position: relative;
	}
.weather-widget:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			transform: translateY(-5px);
		}
.readmore:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		margin-top: 1rem;
		color: var(--iconLinkColor);
		-webkit-text-decoration: none;
		text-decoration: none;
		gap: 0.25rem;
		/* border: 1px solid hsl(var(--iconLinkColor));
border-radius: var(--borderRadius); */
	}
.readmore:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
			content: "";
			width: var(--iconSize);
			height: var(--iconSize);
			background-color: var(--iconLinkColor);
			/* Add mask image, use variable to reduce duplication */
			--svg: url("https://api.iconify.design/ic/baseline-read-more.svg");
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
		}
.readmore:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
			animation: heartbeat 1.5s ease-in-out infinite both;
		}
.datum:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		display: flex;
		align-items: center;
		/* justify-content: flex-end; */
		/* margin-top: 1rem; */
		color: var(--iconLinkColor);
		-webkit-text-decoration: none;
		text-decoration: none;
		gap: 0.25rem;
	}
.datum:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
			content: "";
			width: var(--iconSize);
			height: var(--iconSize);
			background-color: var(--iconLinkColor);
			/* Add mask image, use variable to reduce duplication */
			--svg: url("https://api.iconify.design/lets-icons/date-today-duotone.svg");
			-webkit-mask-image: var(--svg);
			        mask-image: var(--svg);
			-webkit-mask-repeat: no-repeat;
			        mask-repeat: no-repeat;
			-webkit-mask-size: 100% 100%;
			        mask-size: 100% 100%;
		}
.document-size:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	color: var(--color-cyan);
	font-size:0.9rem;
	}
.navigacija-objave:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--bannerGap);
	/*gap:10px;*/
	margin: 2rem auto;
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--bannerGap);
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .datum {
			margin:0.5rem 0 0 0;
					}
.navigacija-objava:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
		animation: heartbeat 1.5s ease-in-out infinite both;
	}
.navigacija-objava-label:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	font-size: 0.9rem;
	text-transform: uppercase;
	color: var(--color-cyan);
	margin:0;
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .lijevo {
	text-align:left;
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .desno {
	text-align:right;
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .desno .datum {
	justify-content:flex-end;
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h4 {
	font-size: 1.2rem;
	max-width:250px;
	text-wrap: balance;
	text-wrap-style: balance;
	word-wrap: break-word;
	}
.navigacija-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) svg {
	width:2rem;
	height:2rem;
	color: var(--color-cyan);
	}
.objave-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#), .dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	display:flex;
	align-items:center;
	justify-content:center;
	}
.paginacija-info:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	padding:3px 5px;
	border: 1px solid var(--color-cyan);
	border-radius: 5px;
	margin:1rem;
	color: var(--color-cyan);
	font-weight: 500;
	display: flex;
	align-items: center;
	}
.paginacija-info:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) input {
	background-color: oklch(from var(--color-cyan-95) l c h / 0.6);
	padding:3px;
	}
.paginacija-info:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) p {
	margin:0;
	}
.pag-strelica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
	display: flex;
	justify-content: center;
	align-items: center;
	}
.paginacija-nove:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before,
	.paginacija-prva:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before,
	.paginacija-stare:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after,
	.paginacija-zadnja:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after{
	content: "";
	width: 2rem;
	height: 2rem;
	min-width: 14px;
	background-color: var(--iconLinkColor);
	/* Add mask image, use variable to reduce duplication */
	-webkit-mask-image: var(--svg);
	        mask-image: var(--svg);
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	        mask-size: 100% 100%;
	margin:3px;
  }
.dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .paginacija-nove {
          margin-right:1.5rem;
      }
.dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .paginacija-stare {
          margin-left:1.5rem;
      }
.dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .paginacija-nove::before,.dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .paginacija-prva::before,.dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .paginacija-stare::after,.dokumenti-paginacija:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .paginacija-zadnja::after {
         width: 1.3rem;
         height: 1.2rem;
    }
.pag-broj-stranice:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      padding:0.1rem 0.2rem;
      font-size:1rem;
      margin:0.1rem;
      width: 1.8rem;
      height: 1.8rem;
      align-self: center;
      display: flex
  ;
      justify-content: center;
      align-items: center;
  }
.pag-broj-stranice:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      cursor: pointer;
      animation: heartbeat 1.5s ease-in-out infinite both;
  }
.pag-broj-stranice.aktivni:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
      font-size: 1.1rem;
      font-weight: 500;
      padding:0.2rem 0.5rem;

      border: 1px solid oklch(from var(--color-cyan) l c h / 0.6);
      border-radius: 1rem;
  }
.paginacija-prva:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before,
  .paginacija-nove:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before,
  .paginacija-stare:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after,
  .paginacija-zadnja:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after
  {
	animation: heartbeat 1.5s ease-in-out infinite both;
	}
.paginacija-prva:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before {
    --svg: url("https://api.iconify.design/ri/skip-back-line.svg");
}
.paginacija-nove:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before {
    --svg: url("https://api.iconify.design/ri/play-reverse-large-line.svg");
}
.paginacija-stare:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after {
    --svg: url("https://api.iconify.design/ri/play-large-line.svg");
}
.paginacija-zadnja:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after {
    --svg: url("https://api.iconify.design/ri/skip-forward-line.svg");
}
.asset-search-input:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   padding:0.5rem 1rem; width:100%; max-width:400px; border:1px solid #ddd; border-radius:4px;
   margin-bottom:1.5rem;
}
.dokumenti:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) + .dokumenti-sprig {
    padding-top: var(--contentPadding);
    border-top: 1px dotted var(--color-orange);
}
#oglasna-ploca-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .asset-search {
    z-index:99;


}
#oglasna-ploca-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .asset-search input {
        background-color: #fff;
        margin-bottom:0;
    }
#oglasna-ploca-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) #asset-results {
    margin-top:1.5rem;

}
#oglasna-ploca-search #asset-results #results {
        margin-bottom:0 !important;
    }
#oglasna-ploca-search:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) #asset-results:has(section) {
    margin-top:-0.5rem;
    padding: var(--contentPadding);
    border: 1px dotted var(--color-orange);
    border-radius: var(--borderRadius);
    border-top-left-radius: 0;
}
/* ------ZAGLAVLJE ------------------------------------ */
/* Creative background shape with animation */
.zaglavlje:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
		content: "";
		display: block;
		/*  needed for firefox to have a valid output */
		--x: 50%;
		--y: 50%;
		--deg: -45deg;
		--dl: 100%;
		--dd: 80%;

		position: absolute;
		top: 0px;
		right: -0px;
		width: 100%;
		height: 100%;
		/* border-radius: 50%; */
		filter: blur(3px);
		z-index: 0;
		animation: float 5s ease-in-out infinite;
		clip-path: polygon(0 0, 100% 0, 100% var(--dl), 0% var(--dd));
		transition:
			--x 5s, --y 0.5s, --deg 2s, --dl 1s, --dl 1s;
		background: conic-gradient(
			from var(--deg) at var(--x) var(--y),
			var(--color-cyan) 15deg,
			var(--color-cyan-50) 115deg,
			var(--color-cyan-25) 195deg,
			var(--color-cyan-25) 265deg,
			var(--color-cyan) 360deg
		);
	}
.zaglavlje.hovered:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):before {
		--x: 50%;
		--y: 300%;
		--deg: 195deg;
		/* --deg: calc(195deg + 360deg); */
		--dd: 100%;
		--dl: 80%;
	}
/* ------------------------------------------------------------- */
@media (min-width: 649px){
    :root:not(#\#):not(#\#):not(#\#):not(#\#) {
      --logoHeightBig: 150px;
    }
		.sn-menu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			display:flex;
		}
			.grupa-dokumenata.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokumenti a,.dokumenti.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokument a{
			flex-direction:column;
			}
			.grupa-dokumenata.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokumenti .datum-dokument,.dokumenti.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .dokument .datum-dokument {
    padding-left: 0;
			}

	.grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    grid-template-columns: repeat(auto-fit, minmax(184px, 1fr));
}
		.preview-objave-hero:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-template-columns: 1fr 1fr;
		}
}
@media (min-width: 768px){
  /*.preview-objave-hero {
    grid-template-columns: 1fr 1fr;
  }*/
		:root:not(#\#):not(#\#):not(#\#):not(#\#){
		--logoHeightBig:200px;
		}
			h1:not(#\#):not(#\#):not(#\#):not(#\#) {
				color: var(--color-cyan-75);
				animation-duration: 1s;
				animation-name: animate-fade;
				/* animation-delay: 0.5s; */
				animation-fill-mode: backwards;
				/* animation-timeline: scroll(self); */
				animation-timeline: view();
			}
			.context-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			    display: block;
				margin-right:0px;
			}
		.swiper:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			height: auto;
		}

		.hero:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-template-columns: 2fr 1fr;
		}
		.main-menu-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a,
		.submenu:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) a {
			font-size: 2rem;
		}
    .tekst-slika:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
        display: grid;
        grid-gap: var(--gridGap);
        grid-template-columns: 1fr;
        grid-template-columns: 1fr 1fr;
    }
    .tekst-slika-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
        align-self: center;
    }
        .tekst-slika.pozicijaslika1:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .tekst-slika-tekst {
            grid-row:1;
            grid-column:2;
        }
        .tekst-slika.pozicijaslika1:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .tekst-slika-slika {
            grid-row:1;
            grid-column:1;
        }

		    .formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div {
						    grid-template-columns: 1fr 3fr;
			}
							.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div.forma-privole {
							    grid-template-columns: 5fr 1fr;
							}
							.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div.forma-prilozi {
							    grid-template-columns: 2fr 2fr;
							}
							.formular:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .forma-grupa > div .form-help {
							    grid-column: 2;
							}

 .header-container:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-template-columns: 2fr calc(var(--logoHeightBig) + 2rem) 2fr;
		}
			.banneri-zaglavlje:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
				grid-template-rows: repeat(auto-fill, 60px);
			}
		.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
			grid-template-columns: 2fr 1fr;
			grid-template-areas:
				"naslov naslov"
				"text text"
				"mapa izbornik";
		}
		.naslovnica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) h1 {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
		}
		.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main #map {
				-ms-grid-row: 5;
				-ms-grid-column: 1;
		}
		.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .naslov {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
		}
		.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .text {
				-ms-grid-row: 3;
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
		}
		.luke:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main .luke-izbornik {
				-ms-grid-row: 5;
				-ms-grid-column: 3;
		}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		grid-template-columns: 1fr 1fr 1fr 1fr;
		grid-template-areas: "text text text ."". webcam vezovi brodskelinije";
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .text {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .webcam {
				-ms-grid-row: 2;
				-ms-grid-column: 2;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .zahtjev-vez {
				-ms-grid-row: 2;
				-ms-grid-column: 3;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .brodskelinije {
				-ms-grid-row: 2;
				-ms-grid-column: 4;
	}
		.user-bar-uvodni-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
				-ms-grid-row: 3;
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
		}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .user-bar-uvodni-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				-ms-grid-column-span: 3;
	}
  /*.preview-objave-hero {
    grid-template-columns: 1fr 1fr;
  }*/
  .preview-objave-grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
    grid-template-columns: 1fr 1fr;
  }
}
@media (min-width: 980px){
		/* .user-bar {
   grid-template-columns: 1fr 1fr 1fr;
} */
			.stranica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main h1,
		.stranica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main h2 {
				margin-left: -4rem;
			}
			.context-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
   margin-right:-60px;
   max-width:300px;
			}

		.zaglavlje-objava:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-column: 1 / 4;
			padding:0 var(--contentPadding);
		}
			.naslovnica222:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) main {
				/* grid-template-columns: 2fr 1fr; */
				grid-template-areas:
					". slider ."
					". hero ."
					"user user user"
					". objave ."
					". sadrzaj .";
			}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
		grid-template-areas: "text text . webcam vezovi brodskelinije";
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .text {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				-ms-grid-column-span: 2;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .webcam {
				-ms-grid-row: 1;
				-ms-grid-column: 4;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .zahtjev-vez {
				-ms-grid-row: 1;
				-ms-grid-column: 5;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .brodskelinije {
				-ms-grid-row: 1;
				-ms-grid-column: 6;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .user-bar-uvodni-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
				-ms-grid-row: 1;
				-ms-grid-column: 1;
				-ms-grid-column-span: 2;
	}

	.weather-widget:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			align-self: center;
	}
		.preview-objave-grid:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
			grid-template-columns: 1fr 1fr 1fr;
		}
		.naslovnica:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .preview-objave-grid {
			grid-template-columns: 1fr 1fr 1fr 1fr;
		}
}
@media (min-width: 1200px){
			.context-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
max-width:330px;
				margin-right:-200px;
				margin-bottom:2rem;
			}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
		grid-template-areas: ". text text . webcam vezovi brodskelinije .";
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .text {
				-ms-grid-row: 1;
				-ms-grid-column: 2;
				-ms-grid-column-span: 2;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .webcam {
				-ms-grid-row: 1;
				-ms-grid-column: 5;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .zahtjev-vez {
				-ms-grid-row: 1;
				-ms-grid-column: 6;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .brodskelinije {
				-ms-grid-row: 1;
				-ms-grid-column: 7;
	}

	.user-bar-sadrzaj:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .user-bar-uvodni-tekst:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
				-ms-grid-row: 1;
				-ms-grid-column: 2;
				-ms-grid-column-span: 2;
	}
}
@media screen and (max-width: 620px){
.search-bar:hover:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) > .searchInput {
    width: 150px;
    padding: 0 6px;
}
}
@media (color-gamut: p3){
:root:not(#\#):not(#\#):not(#\#):not(#\#) {
			--color-cyan-95: color(display-p3 0.8786 0.94766 1);
			--color-cyan: color(display-p3 0.23678 0.53625 0.74102);
			--color-cyan-50: color(display-p3 0.09324 0.41633 0.61462);
			--color-cyan-25: color(display-p3 0 0.14327 0.23525);

			--color-darkblue-95: color(display-p3 0.89403 0.9411 1);
			--color-darkblue-25: color(display-p3 0.01005 0.12986 0.27101);
			--color-orange-95: color(display-p3 1 0.92508 0.78729);
			--color-orange-75: color(display-p3 0.85598 0.63541 0.15043);
			--color-green-50: color(display-p3 0.17249 0.46881 0.21199);
			--color-red-50: color(display-p3 0.69553 0.0643 0.09848);
			--color-red-70: color(display-p3 0.97043 0.38391 0.34126);
			--themebg: color(display-p3 0.9759 0.98959 1);

		}
}
@media (prefers-reduced-motion: reduce){
    html {
      scroll-behavior: auto;
    }

    *:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#),
    *:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::before,
    *:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)::after {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }
}
