@media screen and (max-aspect-ratio: 85/100) {

	body:not(.home) .lijeva, body:not(.home) .desna, body:not(.home) .klas { display: none; }

	nav { max-width: 100%; margin-block: 3vh; margin-inline: 25px; gap: 10px;  }
	nav > a { width: 100px; z-index: 101; }
	nav > div { font-size: 1rem; }
	nav .nav { display: none; position: fixed; left: 0; top: 0; height: 100vh; width: 100%; background: url('images/background.jpg') center center / cover no-repeat; flex-direction: column; align-items: center; justify-content: center; z-index: 100; }
	nav .nav:before { content: ""; background: url('images/klas.svg') top center / cover no-repeat; height: 100%; width: 200%; opacity: .2; position: absolute; top: 50%; left: 9vw; transform: translateY(-50%) scaleX(-1); z-index: 1; }
	nav > div > a { font-size: 28px; color: #fff; font-weight: 500; z-index: 2 }
	nav > div > a:not(:last-child) { margin-bottom: 20px; }

	.nav-toggle { display: inline-block; position: relative; width: 34px; height: 28px; color: #fff; line-height: 50px; z-index: 101; }

	.nav-toggle .bar { position: absolute; display: block; width: 100%; height: 2px; background: #fff; transition: all 0.3s;}
	.nav-toggle .bar1 { left: 0; top: 0; }
	.nav-toggle .bar2 { top: 50%; transform: translateY(-50%); width: 100%; }
	.nav-toggle .bar3 { right: 0; bottom: 0; }

	.mobile-nav-active .nav-toggle .bar1 { top: 50%; transform: translateY(0) rotate(45deg); }
	.mobile-nav-active .nav-toggle .bar2 { opacity: 0; }
	.mobile-nav-active .nav-toggle .bar3 { top: 50%; bottom: auto; transform: translateY(0) rotate(-45deg); }

	.mobile-nav-active .nav { display: flex; }

	h1 { font-size: 2rem; }
	h2, h2.h1 { font-size: 1.6rem; }
	h3 { font-size: 1.45rem; }
	p, label, input { font-size: 1.1rem; }

	.content { width: 85vw; }

	.klas { top: 2vh; width: 150%; left: 16vw; }

	.naslov { width: 70vw; transform: translateX(-3vw); }

	.lijeva { top: 14vh; left: 69vw; transform: rotate(-40deg); z-index: 1; }
	.lijeva img { width: 60vw; }
	.lijeva:before,
	.lijeva:after { top: -8vh; left: 7vw; width: 60vw; height: calc(688 / 260 * 60vw); }

	.desna { position: absolute; top: 15vh; right: 72vw; transform: rotate(14deg); z-index: -1; }
	.desna img { position: relative; width: 16vw; height: auto; }
	.desna:before, .desna:after {content: ''; position: absolute; top: 1vh; left: 1vh; width: 16vw; height: calc(688 / 260 * 16vw); }

	.lijeva:before,
	.desna:before { background: url('images/sjena.webp') no-repeat center; background-size: cover; mix-blend-mode: multiply; -webkit-mix-blend-mode: multiply; opacity: .6; z-index: -2; }
	.lijeva:after,
	.desna:after { background: url('images/refrakcija.webp') no-repeat center; background-size: cover; mix-blend-mode: overlay; -webkit-mix-blend-mode: overlay; opacity: 1; z-index: -3; }

	.content-generator .intro { margin: 0 0 30px 0; }
	.content-generator label { margin-bottom: 1vw; }
	.content-generator input[type="text"] { width: 100%; padding: 2vw 3vw; border-radius: 5vw; margin: .4vw 0 6vw 0; }
	.content-generator input[type="submit"], .content-generator .btn { font-size: 6vw; width: 100%; padding: 2vw 6vw; border-radius: 6vw; }
	.content-generator hr { display: none; }

	.debtors { width: 100%; }
	.debtors tr td { font-size: 6vw; }

	.content { padding-bottom: 10vw; }

	.list { width: 100%; }

	footer { width: 100%; padding: 0 25px; }
	.footer-top img { width: 70px; height: auto; }
	.footer-bottom, .legal { flex-direction: column; }
	.footer-bottom-right { margin-top: 20px;}
	footer .footer-bottom { padding: 30px 0; }
}

@media screen and (max-aspect-ratio: 85/100) and (max-width: 600px) {
	
	footer .footer-top { height: 60px; padding-inline: 20px; }
	footer .footer-top > div { gap: 20px; }
	footer .footer-top .logo img { width: 50px; }
	footer .social { gap: 12px; }
	footer .footer-top a { font-size: 18px; }
	
}

