/* --- barve področij --- */ .mipor-tile.mipor-zakon,.mipor-panel.mipor-zakon{--c:#FFC000} .mipor-tile.mipor-fin,.mipor-panel.mipor-fin{--c:#0070C0} .mipor-tile.mipor-hrana,.mipor-panel.mipor-hrana{--c:#7030A0} .mipor-tile.mipor-traj,.mipor-panel.mipor-traj{--c:#4EA72E} .mipor-tile.mipor-pamet,.mipor-panel.mipor-pamet{--c:#F44336} .mipor-tile.mipor-nacin,.mipor-panel.mipor-nacin{--c:#007355} .mipor-tile.mipor-predavatelji,.mipor-panel.mipor-predavatelji{--c:#007355} /* --- skriti radio gumbi (za odpiranje brez JavaScripta) --- */ .mipor-radio{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px} /* --- okvirčki: majhni, vsi v eni vrstici --- */ .mipor-tiles{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.6rem;margin:1rem 0 1.5rem} .mipor-tile{display:flex;align-items:center;justify-content:center;text-align:center; min-height:4.5rem;padding:.55rem .5rem;border-radius:.35rem;background:var(--c,#1F4E8C);color:#fff; font-size:.85rem;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.18);transition:transform .15s ease,filter .15s ease;position:relative} .mipor-tile:hover{transform:translateY(-2px);filter:brightness(1.07);color:#fff;text-decoration:none} .mipor-tile.mipor-zakon,.mipor-tile.mipor-zakon:hover{color:#222} .mipor-tile-title{display:block;overflow-wrap:anywhere;hyphens:auto} /* na ožjih zaslonih se okvirčki prelomijo v več vrstic */ @media (max-width:991px){.mipor-tiles{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}} /* --- vsebina: privzeto skrita, odpre se pod okvirčki --- */ .mipor-panel{display:none} #mt-zakon:checked ~ .mipor-panels #mp-zakon, #mt-fin:checked ~ .mipor-panels #mp-fin, #mt-hrana:checked ~ .mipor-panels #mp-hrana, #mt-traj:checked ~ .mipor-panels #mp-traj, #mt-pamet:checked ~ .mipor-panels #mp-pamet, #mt-nacin:checked ~ .mipor-panels #mp-nacin, #mt-predavatelji:checked ~ .mipor-panels #predavatelji{display:block} /* označen (odprt) okvirček: obroba + puščica navzdol proti vsebini */ #mt-zakon:checked ~ .mipor-tiles label[for="mt-zakon"], #mt-fin:checked ~ .mipor-tiles label[for="mt-fin"], #mt-hrana:checked ~ .mipor-tiles label[for="mt-hrana"], #mt-traj:checked ~ .mipor-tiles label[for="mt-traj"], #mt-pamet:checked ~ .mipor-tiles label[for="mt-pamet"], #mt-nacin:checked ~ .mipor-tiles label[for="mt-nacin"], #mt-predavatelji:checked ~ .mipor-tiles label[for="mt-predavatelji"]{outline:3px solid #222;outline-offset:2px} #mt-zakon:checked ~ .mipor-tiles label[for="mt-zakon"]::after, #mt-fin:checked ~ .mipor-tiles label[for="mt-fin"]::after, #mt-hrana:checked ~ .mipor-tiles label[for="mt-hrana"]::after, #mt-traj:checked ~ .mipor-tiles label[for="mt-traj"]::after, #mt-pamet:checked ~ .mipor-tiles label[for="mt-pamet"]::after, #mt-nacin:checked ~ .mipor-tiles label[for="mt-nacin"]::after, #mt-predavatelji:checked ~ .mipor-tiles label[for="mt-predavatelji"]::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%); border:.5rem solid transparent;border-top-color:var(--c)} /* dostopnost: obroba pri tipkovnični navigaciji */ .mipor-radio:focus-visible ~ .mipor-tiles .mipor-tile{outline-offset:2px} /* rumeni panel: povezave v temnejšem odtenku (rumena na beli slabo bere) */ .mipor-panel.mipor-zakon li a{color:#7a5c00 !important} /* panel "način izvajanja" */ .mipor-panel.mipor-nacin{margin-top:0} .mipor-panel.mipor-nacin .mipor-faq{margin-top:1.5rem} .mipor-panel.mipor-nacin li a{color:inherit} .mipor-panels{margin-top:1rem} /* ===== MIPOR – okvirčki v eni vrstici + vsebina pod njimi (v2) ===== Dodajte na konec obstoječega CSS. Če ste dodali prejšnji dodatek (v1), ga ODSTRANITE in uporabite samo tega. */ /* --- barve področij --- */ .mipor-tile.mipor-zakon,.mipor-panel.mipor-zakon{--c:#FFC000} .mipor-tile.mipor-fin,.mipor-panel.mipor-fin{--c:#0070C0} .mipor-tile.mipor-hrana,.mipor-panel.mipor-hrana{--c:#7030A0} .mipor-tile.mipor-traj,.mipor-panel.mipor-traj{--c:#4EA72E} .mipor-tile.mipor-pamet,.mipor-panel.mipor-pamet{--c:#F44336} .mipor-tile.mipor-nacin,.mipor-panel.mipor-nacin, .mipor-tile.mipor-predavatelji,.mipor-panel.mipor-predavatelji{--c:#007355} /* --- skriti radio gumbi (za odpiranje brez JavaScripta) --- */ .mipor-radio{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px} /* --- okvirčki: majhni, vsi v eni vrstici --- */ .mipor-tiles{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.6rem;margin:1rem 0 1.5rem} .mipor-tile{display:flex;align-items:center;justify-content:center;text-align:center; min-height:4.5rem;padding:.55rem .5rem;border-radius:.35rem;background:var(--c,#1F4E8C);color:#fff; font-size:.85rem;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.18);transition:transform .15s ease,filter .15s ease;position:relative} .mipor-tile:hover{transform:translateY(-2px);filter:brightness(1.07);color:#fff;text-decoration:none} .mipor-tile.mipor-zakon,.mipor-tile.mipor-zakon:hover{color:#222} .mipor-tile-title{display:block;overflow-wrap:anywhere;hyphens:auto} /* na ožjih zaslonih se okvirčki prelomijo v več vrstic */ @media (max-width:991px){.mipor-tiles{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}} /* --- vsebina: privzeto skrita, odpre se pod okvirčki --- */ .mipor-panel{display:none} #mt-zakon:checked ~ .mipor-panels #mp-zakon, #mt-fin:checked ~ .mipor-panels #mp-fin, #mt-hrana:checked ~ .mipor-panels #mp-hrana, #mt-traj:checked ~ .mipor-panels #mp-traj, #mt-pamet:checked ~ .mipor-panels #mp-pamet, #mt-nacin:checked ~ .mipor-panels #mp-nacin, #mt-predavatelji:checked ~ .mipor-panels #predavatelji{display:block} /* označen (odprt) okvirček: obroba + puščica navzdol proti vsebini */ #mt-zakon:checked ~ .mipor-tiles label[for="mt-zakon"], #mt-fin:checked ~ .mipor-tiles label[for="mt-fin"], #mt-hrana:checked ~ .mipor-tiles label[for="mt-hrana"], #mt-traj:checked ~ .mipor-tiles label[for="mt-traj"], #mt-pamet:checked ~ .mipor-tiles label[for="mt-pamet"], #mt-nacin:checked ~ .mipor-tiles label[for="mt-nacin"], #mt-predavatelji:checked ~ .mipor-tiles label[for="mt-predavatelji"]{outline:3px solid #222;outline-offset:2px} #mt-zakon:checked ~ .mipor-tiles label[for="mt-zakon"]::after, #mt-fin:checked ~ .mipor-tiles label[for="mt-fin"]::after, #mt-hrana:checked ~ .mipor-tiles label[for="mt-hrana"]::after, #mt-traj:checked ~ .mipor-tiles label[for="mt-traj"]::after, #mt-pamet:checked ~ .mipor-tiles label[for="mt-pamet"]::after, #mt-nacin:checked ~ .mipor-tiles label[for="mt-nacin"]::after, #mt-predavatelji:checked ~ .mipor-tiles label[for="mt-predavatelji"]::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%); border:.5rem solid transparent;border-top-color:var(--c)} /* dostopnost: obroba pri tipkovnični navigaciji */ .mipor-radio:focus-visible ~ .mipor-tiles .mipor-tile{outline-offset:2px} /* rumeni panel: povezave v temnejšem odtenku (rumena na beli slabo bere) */ .mipor-panel.mipor-zakon li a{color:#7a5c00 !important} /* panel "način izvajanja" */ .mipor-panel.mipor-nacin{margin-top:0} .mipor-panel.mipor-nacin .mipor-faq{margin-top:1.5rem} .mipor-panel.mipor-nacin li a{color:inherit} .mipor-panels{margin-top:1rem} /* --- panel Predavatelji --- */ .mipor-panel.mipor-predavatelji h2{font-size:1.1rem;line-height:1.35;margin:1.5rem 0 .6rem} .mipor-panel.mipor-predavatelji h2:first-child{margin-top:0} .mipor-panel.mipor-predavatelji p{margin:.5rem 0} /* gumb-label (npr. "Spoznajte naše predavatelje") */ label.mipor-btn{cursor:pointer} /* ===== MIPOR – okvirčki v eni vrstici + vsebina pod njimi (v2) ===== Dodajte na konec obstoječega CSS. Če ste dodali prejšnji dodatek (v1), ga ODSTRANITE in uporabite samo tega. */ /* --- barve področij --- */ .mipor-tile.mipor-zakon,.mipor-panel.mipor-zakon{--c:#FFC000} .mipor-tile.mipor-fin,.mipor-panel.mipor-fin{--c:#0070C0} .mipor-tile.mipor-hrana,.mipor-panel.mipor-hrana{--c:#7030A0} .mipor-tile.mipor-traj,.mipor-panel.mipor-traj{--c:#4EA72E} .mipor-tile.mipor-pamet,.mipor-panel.mipor-pamet{--c:#F44336} .mipor-tile.mipor-nacin,.mipor-panel.mipor-nacin, .mipor-tile.mipor-predavatelji,.mipor-panel.mipor-predavatelji{--c:#007355} /* --- skriti radio gumbi (za odpiranje brez JavaScripta) --- */ .mipor-radio{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px} /* --- okvirčki: majhni, vsi v eni vrstici --- */ .mipor-tiles{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.6rem;margin:1rem 0 1.5rem} .mipor-tile{display:flex;align-items:center;justify-content:center;text-align:center; min-height:4.5rem;padding:.55rem .5rem;border-radius:.35rem;background:var(--c,#1F4E8C);color:#fff; font-size:.85rem;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.18);transition:transform .15s ease,filter .15s ease;position:relative} .mipor-tile:hover{transform:translateY(-2px);filter:brightness(1.07);color:#fff;text-decoration:none} .mipor-tile.mipor-zakon,.mipor-tile.mipor-zakon:hover{color:#222} .mipor-tile-title{display:block;overflow-wrap:anywhere;hyphens:auto} /* na ožjih zaslonih se okvirčki prelomijo v več vrstic */ @media (max-width:991px){.mipor-tiles{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}} /* --- vsebina: privzeto skrita, odpre se pod okvirčki --- */ .mipor-panel{display:none} #mt-zakon:checked ~ .mipor-panels #mp-zakon, #mt-fin:checked ~ .mipor-panels #mp-fin, #mt-hrana:checked ~ .mipor-panels #mp-hrana, #mt-traj:checked ~ .mipor-panels #mp-traj, #mt-pamet:checked ~ .mipor-panels #mp-pamet, #mt-nacin:checked ~ .mipor-panels #mp-nacin, #mt-predavatelji:checked ~ .mipor-panels #predavatelji{display:block} /* označen (odprt) okvirček: obroba + puščica navzdol proti vsebini */ #mt-zakon:checked ~ .mipor-tiles label[for="mt-zakon"], #mt-fin:checked ~ .mipor-tiles label[for="mt-fin"], #mt-hrana:checked ~ .mipor-tiles label[for="mt-hrana"], #mt-traj:checked ~ .mipor-tiles label[for="mt-traj"], #mt-pamet:checked ~ .mipor-tiles label[for="mt-pamet"], #mt-nacin:checked ~ .mipor-tiles label[for="mt-nacin"], #mt-predavatelji:checked ~ .mipor-tiles label[for="mt-predavatelji"]{outline:3px solid #222;outline-offset:2px} #mt-zakon:checked ~ .mipor-tiles label[for="mt-zakon"]::after, #mt-fin:checked ~ .mipor-tiles label[for="mt-fin"]::after, #mt-hrana:checked ~ .mipor-tiles label[for="mt-hrana"]::after, #mt-traj:checked ~ .mipor-tiles label[for="mt-traj"]::after, #mt-pamet:checked ~ .mipor-tiles label[for="mt-pamet"]::after, #mt-nacin:checked ~ .mipor-tiles label[for="mt-nacin"]::after, #mt-predavatelji:checked ~ .mipor-tiles label[for="mt-predavatelji"]::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%); border:.5rem solid transparent;border-top-color:var(--c)} /* dostopnost: obroba pri tipkovnični navigaciji */ .mipor-radio:focus-visible ~ .mipor-tiles .mipor-tile{outline-offset:2px} /* rumeni panel: povezave v temnejšem odtenku (rumena na beli slabo bere) */ .mipor-panel.mipor-zakon li a{color:#7a5c00 !important} /* panel "način izvajanja" */ .mipor-panel.mipor-nacin{margin-top:0} .mipor-panel.mipor-nacin .mipor-faq{margin-top:1.5rem} .mipor-panel.mipor-nacin li a{color:inherit} .mipor-panels{margin-top:1rem} /* --- panel Predavatelji --- */ .mipor-panel.mipor-predavatelji h2{font-size:1.1rem;line-height:1.35;margin:1.5rem 0 .6rem} .mipor-panel.mipor-predavatelji h2:first-child{margin-top:0} .mipor-panel.mipor-predavatelji p{margin:.5rem 0} /* gumb-label (npr. "Spoznajte naše predavatelje") */ label.mipor-btn{cursor:pointer} /* --- v2c: panel Predavatelji se otvara i preko linka s # (npr. /izobrazevalni-programi#petra-loviscek) --- Radi samo dok nijedan okvirić nije kliknut; klik na okvirić preuzima kontrolu. */ .mipor-hub:not(:has(.mipor-radio:checked)) .mipor-panel:has(:target){display:block} .mipor-hub:not(:has(.mipor-radio:checked)):has(#predavatelji :target) .mipor-tile.mipor-predavatelji{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#predavatelji :target) .mipor-tile.mipor-predavatelji::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%); border:.5rem solid transparent;border-top-color:var(--c)} /* nakon skoka na predavatelja ostavi malo prostora iznad */ .mipor-panel.mipor-predavatelji a[id]{scroll-margin-top:6rem} /* --- v2d: link na bilo koji tab --- */ /* (1) link unutar teksta koji otvara drugi tab: */ label.mipor-tablink{color:var(--c);font-weight:600;text-decoration:underline;cursor:pointer} label.mipor-tablink:hover{text-decoration:none} /* (2) link s drugih stranica ili iz adresne trake: /izobrazevalni-programi#mp-fin (id panela) */ .mipor-hub:not(:has(.mipor-radio:checked)) .mipor-panel:target{display:block} .mipor-panel{scroll-margin-top:6rem} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-zakon:target, #mp-zakon :target) .mipor-tile.mipor-zakon{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-zakon:target, #mp-zakon :target) .mipor-tile.mipor-zakon::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-fin:target, #mp-fin :target) .mipor-tile.mipor-fin{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-fin:target, #mp-fin :target) .mipor-tile.mipor-fin::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-hrana:target, #mp-hrana :target) .mipor-tile.mipor-hrana{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-hrana:target, #mp-hrana :target) .mipor-tile.mipor-hrana::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-traj:target, #mp-traj :target) .mipor-tile.mipor-traj{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-traj:target, #mp-traj :target) .mipor-tile.mipor-traj::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-pamet:target, #mp-pamet :target) .mipor-tile.mipor-pamet{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-pamet:target, #mp-pamet :target) .mipor-tile.mipor-pamet::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-nacin:target, #mp-nacin :target) .mipor-tile.mipor-nacin{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#mp-nacin:target, #mp-nacin :target) .mipor-tile.mipor-nacin::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:not(:has(.mipor-radio:checked)):has(#predavatelji:target, #predavatelji :target) .mipor-tile.mipor-predavatelji{outline:3px solid #222;outline-offset:2px} .mipor-hub:not(:has(.mipor-radio:checked)):has(#predavatelji:target, #predavatelji :target) .mipor-tile.mipor-predavatelji::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} /* ===== MIPOR – okvirčki kao #linkovi (v8b) ===== */ /* --- boje područja --- */ .mipor-tile.mipor-zakon,.mipor-panel.mipor-zakon{--c:#FFC000} .mipor-tile.mipor-fin,.mipor-panel.mipor-fin{--c:#0070C0} .mipor-tile.mipor-hrana,.mipor-panel.mipor-hrana{--c:#7030A0} .mipor-tile.mipor-traj,.mipor-panel.mipor-traj{--c:#4EA72E} .mipor-tile.mipor-pamet,.mipor-panel.mipor-pamet{--c:#F44336} .mipor-tile.mipor-nacin,.mipor-panel.mipor-nacin, .mipor-tile.mipor-predavatelji,.mipor-panel.mipor-predavatelji{--c:#007355} /* --- okvirići: mali, u jednom redu --- */ .mipor-tiles{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.6rem;margin:1rem 0 1.5rem} .mipor-tile{display:flex;align-items:center;justify-content:center;text-align:center;position:relative; min-height:4.5rem;padding:.55rem .5rem;border-radius:.35rem;background:var(--c,#1F4E8C);color:#fff; font-size:.85rem;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.18);transition:transform .15s ease,filter .15s ease} .mipor-tile:hover,.mipor-tile:focus-visible{transform:translateY(-2px);filter:brightness(1.07);color:#fff;text-decoration:none} .mipor-tile.mipor-zakon,.mipor-tile.mipor-zakon:hover,.mipor-tile.mipor-zakon:focus-visible{color:#222} .mipor-tile-title{display:block;overflow-wrap:anywhere;hyphens:auto} @media (max-width:991px){.mipor-tiles{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}} /* --- paneli: skriveni; otvara ih link na njihov id (ili na sidro unutar njih, npr. #petra-loviscek) --- */ .mipor-panels{margin-top:1rem} .mipor-panel{display:none;scroll-margin-top:8rem} /* 8rem = razmak da okvirići ostanu vidljivi iznad panela; prilagodite zaglavlju templatea */ .mipor-panel:is(:target,:has(:target)){display:block} /* nevidljiva oznaka unutar panela: fiksirana u prozoru, pa klik na link NE pomiče stranicu */ .mipor-pin{position:fixed;top:0;left:0;width:1px;height:1px;opacity:0;pointer-events:none} /* oznaka "-gore": klik otvori panel i pomakne stranicu na sam vrh (za linkove u dnu dugog panela) */ .mipor-top{display:block;height:0;overflow:hidden;scroll-margin-top:10000px} .mipor-panel.mipor-predavatelji a[id]{scroll-margin-top:6rem} /* --- aktivni okvirić: obrub + strelica --- */ .mipor-hub:has(.mipor-panel.mipor-zakon:target, .mipor-panel.mipor-zakon :target) .mipor-tile.mipor-zakon{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-zakon:target, .mipor-panel.mipor-zakon :target) .mipor-tile.mipor-zakon::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:has(.mipor-panel.mipor-fin:target, .mipor-panel.mipor-fin :target) .mipor-tile.mipor-fin{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-fin:target, .mipor-panel.mipor-fin :target) .mipor-tile.mipor-fin::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:has(.mipor-panel.mipor-hrana:target, .mipor-panel.mipor-hrana :target) .mipor-tile.mipor-hrana{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-hrana:target, .mipor-panel.mipor-hrana :target) .mipor-tile.mipor-hrana::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:has(.mipor-panel.mipor-traj:target, .mipor-panel.mipor-traj :target) .mipor-tile.mipor-traj{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-traj:target, .mipor-panel.mipor-traj :target) .mipor-tile.mipor-traj::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:has(.mipor-panel.mipor-pamet:target, .mipor-panel.mipor-pamet :target) .mipor-tile.mipor-pamet{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-pamet:target, .mipor-panel.mipor-pamet :target) .mipor-tile.mipor-pamet::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:has(.mipor-panel.mipor-nacin:target, .mipor-panel.mipor-nacin :target) .mipor-tile.mipor-nacin{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-nacin:target, .mipor-panel.mipor-nacin :target) .mipor-tile.mipor-nacin::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} .mipor-hub:has(.mipor-panel.mipor-predavatelji:target, .mipor-panel.mipor-predavatelji :target) .mipor-tile.mipor-predavatelji{outline:3px solid #222;outline-offset:2px} .mipor-hub:has(.mipor-panel.mipor-predavatelji:target, .mipor-panel.mipor-predavatelji :target) .mipor-tile.mipor-predavatelji::after{content:"";position:absolute;left:50%;bottom:-.75rem;transform:translateX(-50%);border:.5rem solid transparent;border-top-color:var(--c)} /* --- posebnosti panela --- */ .mipor-panel.mipor-zakon li a{color:#7a5c00 !important} .mipor-panel.mipor-nacin .mipor-faq{margin-top:1.5rem} .mipor-panel.mipor-nacin li a{color:inherit} .mipor-panel.mipor-predavatelji h2{font-size:1.1rem;line-height:1.35;margin:1.5rem 0 .6rem} .mipor-panel.mipor-predavatelji h2:first-child{margin-top:0} .mipor-panel.mipor-predavatelji p{margin:.5rem 0} /* Forma padajući popis: potpuno stiliranje (Chrome/Edge 135+) */ #cf_1 select, #cf_1 select::picker(select){appearance:base-select} #cf_1 select::picker-icon{display:none} /* strelica na polju */ #cf_1 select option::checkmark{display:none} /* kvačica uz odabranu stavku */ #cf_1 select{padding:.5rem .8rem;border:1px solid #9aa;border-radius:.25rem;background:#fff} #cf_1 select::picker(select){border:1px solid #999;padding:0} /* naslov grupe: puna boja */ #cf_1 select optgroup{--g:#007355;--t:#fff;background:var(--g);color:var(--t);font-weight:700;padding:0} #cf_1 select optgroup[label*="zakon" i]{--g:#FFC000;--t:#222} #cf_1 select optgroup[label*="opismenjevanje" i]{--g:#0070C0} #cf_1 select optgroup[label*="prehrana" i]{--g:#7030A0} #cf_1 select optgroup[label*="trajnost" i]{--g:#4EA72E} #cf_1 select optgroup[label*="pametno" i]{--g:#F44336} /* stavke u grupi: svijetli ton boje grupe, hover/odabrana malo jača */ #cf_1 select option{background:color-mix(in srgb,var(--g,#007355) 10%,#fff);color:#222;font-weight:400;padding:.15rem .6rem .15rem 1rem;min-height:0} #cf_1 select option:hover, #cf_1 select option:focus, #cf_1 select option:checked{background:color-mix(in srgb,var(--g,#007355) 28%,#fff);color:#222}