diff --git a/stylesheet.css b/stylesheet.css index ed955b0..be8b260 100644 --- a/stylesheet.css +++ b/stylesheet.css @@ -492,4 +492,92 @@ footer p { max-width: 1100px; margin: 0 auto; padding: 3rem 1.5rem 5rem; +} + +/*menu receptov*/ + +/* kartice receptov */ +.recepti_jedi { + margin: 2rem; + padding: 1.5rem; + background-color: var(--barva-kartice); + border-radius:var(--zaobljenost); + box-shadow: var(--senca-kartice); +} + +.recepti_jedi h2 { + text-align:center; +} + +.recepti_grid { + display: grid; + grid-template-columns: repeat(2,minmax(0,1fr)); + align-items: stretch; + gap: 0.5rem; + +} + +.o_receptu { + display:flex; + flex-direction: column; +} + +.recepti_slika { + display: flex; + overflow: hidden; + flex-direction: column; + position:relative; + min-height: 350px; + flex-shrink: 0; + overflow: hidden; + margin:0; +} + +.recepti_slika img { + display: block; + width: 100%; + height: 100%; + object-fit: cover; + object-position: center; +} + +.recepti_slika figcaption { + display:none; +} + +.recepti_info ul { + display:flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; + gap: 0.35rem; + + margin: 0; + padding: 0; + list-style: none; +} + +.recepti_info li { + display: block; + text-align: center; + font-size: 0.95rem; + max-width: 10rem; +} + +.gumb_3 { + display: inline-block; + padding: 0.5rem 1rem; + border-radius: var(--zaobljenost); + color: var(--barva-besedilo-na-temnem); + font-weight: 500; + text-decoration: none; + background-color: var(--barva-besedilo); +} + + +.gumb_3:hover { + background-color: var(--barva-dodatna); + color: var(--barva-besedilo); + transition: 0.2s; + font-weight: 500; } \ No newline at end of file