body { padding: 0px; margin: 0px 25px; background-color: #FDFCFB; font-family: Verdana, Geneva, Tahoma, sans-serif; } /* HEADER I GLAVNI MENI */ .glavniMeniGore { height: 150px; background-color: white; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; padding-left:50px; } .logoNavigacija { width: 275px; height: 100px; } .okvirSlogan { padding-left: 25px; } .okvirMeni { flex-grow: 2; } .okvirMeniMobilnaVerzija { display:none; } .lista { display: flex; flex-wrap: wrap; justify-content: right; } .glavniMeniPoveznicaTekst { list-style-type: none; padding-right: 50px; } .glavniMeniPoveznicaTekstMobilna { text-align: right; margin-right: 10px; } .glavniMeniPoveznica{ text-decoration: none; color: #CD2653; font-size: 1.2rem; font-weight: 550; } .aktivnaStranica { text-decoration: underline #CD2653; } .aktivnaStranica:hover { text-decoration: none; } .ostaleStranice:hover { text-decoration: underline #CD2653; } /* GLAVNI DIO STRANICE*/ .okvirOpcenito { display: flex; justify-content: space-evenly; flex-wrap: wrap; } .naslovnaPrvaSekcija { margin-top: 50px; } .naslovnaElement { margin-top: 150px; width: 350px; height: 350px; border-radius: 25px; } .naslovnaPrvaSekcija .naslovnaPrviElement, .naslovnaPrvaSekcija .naslovnaDrugiElement { width: 550px; height: 350px; } .naslovnaPrviElementSlika { width: 500px; height: 350px; opacity: 0.8; } .naslovnaDrugiElement { background-color: #CFE4F1; display: flex; flex-wrap: wrap; flex-direction: column; align-items: center; justify-content: center; } .naslovnaPuce { margin-top: 50px; cursor: pointer; padding: 15px; border-radius: 15px; border: 1px solid black; font-size: 20px; } .naslovnaPuce:hover { background-color: #243D4E; color: white; } .drugaSekcija { margin-top: 200px; background-color: #001524; display: flex; flex-wrap: wrap; justify-content: space-around; } .drugaSekcijaIkona { height: 50px; } .drugaSekcijaElement { text-align: center; width:300px; padding: 20px; background-color: #243d4e; color: white; margin: 20px 0px; } .trecaSekcija { margin-top: 200px; } .trecaSekcijaElement { padding: 0px 20px 0px 20px; text-align: center; border-radius: 0px 0px 25px 25px; } .trecaSekcijaElement:hover { border: 1px solid blue; } .topProizvodiOkvir { display: flex; flex-wrap: wrap; justify-content: space-evenly; } .topProizvodiSlika { width: 300px; } .topProizvodiTekst { margin-bottom: 100px; padding: 50px; text-align: center; font-size: 50px; background-color: #cfe4f1; border-radius: 25px; } .topProizvodiPoveznica { text-decoration: none; color: black; } .topProizvodiPoveznica:hover { color: green; } /* POLITIKA PRIVATNOSTI */ .politikaPrivatnosti { width: 1800px; } .pPPrvaSekcija { margin-top: 150px; align-items: flex-end; justify-content: flex-end; } .pPOkvir { display: flex; flex-direction: column; align-items: center; padding: 25px; } /* KUKI */ .kukiOkvir { margin-top: 100px; background-color:rgb(219, 218, 218); display: flex; flex-direction: column; flex-wrap: wrap; } .kukiParagraf { padding: 20px; } .kukiPotvrda { width: 80px; height: 30px; margin-right: 30px; align-self: flex-end; margin-bottom: 20px; } #kukiOkvir.nestani { display:none; } /* DOSTAVA */ .dostavaPrvaSekcija { margin-top: 150px; } .dostavaOkvir { display: flex; justify-content: space-evenly; flex-wrap: wrap; } .dostavaSlika { height: 400px; width:400px; border-radius: 25px; } .dostavaDrugiElement { padding: 25px; height: 400px; width:400px; border-radius: 25px; background-color:#CFE4F1; } .dostavaTekst { text-align: center; } /* FOOTER */ .podnozje { background-color:#001524; margin-top: 150px; } .okvirPodnozje { display: flex; justify-content: space-evenly; align-items: center; flex-wrap: wrap; } .podnozjeH2{ color:white; } .logoPodnozje { width: 175px; height: 180px; margin-bottom: -30px; } .sviElementi { margin-top: 50px; text-align: center; margin-left: 15px; } .poveznicaPodnozje, .podnozjeParagraf{ text-decoration: none; color: #9DA5AA; line-height: 40px; } .poveznicaPodnozje:hover { color:rgb(45, 209, 45); } .izradaStranica { margin-top: 80px; color: #9DA5AA; text-align: center; border-top: white 1px solid; height:150px; } /* O NAMA *//* KONTAKT */ .oNamaGlavniOkvir { margin-top: 150px; display: flex; flex-wrap: wrap; justify-content: space-evenly; align-items: center; } .oNamaPrviElement { width: 30vw; text-align: center; } .oNamaPrvaSlika { width: 30vw; } .oNamaPrvaSlika, .kontaktMapa { border-radius: 50px; } .kontaktGlavniOkvir { margin-top: 150px; background-color: rgb(250, 246, 246); } .kontaktPrviElement { display: flex; justify-content: space-evenly; padding: 25px; } .kontaktOpcenito { padding-left: 25px; padding-right: 25px; } .kontaktIkone { padding-top: 20px; } .kontaktIkonaMobitel { width: 175px; } .kontaktMapa { margin-top:100px; } .kontaktDrugiElement { display:flex; justify-content: space-evenly; } .kontaktOpis { text-align: center; } /* RESPONSIVE */ @media screen and (max-width:1420px) { .drugaSekcijaElement { width: 420px; } .oNamaPrviElement { width: 50vw; } .oNamaPrvaSlika { margin-top: 50px; width: 50vw; } } @media screen and (max-width:1300px) { .glavniMeniGore { padding-left: 0px; } .okvirMeni { margin-top: 50px; } } @media screen and (max-width:900px) { .dostavaDrugiElement { margin-top: 50px; } } @media screen and (max-width:700px) { .kontaktGlavniOkvir, .oNamaGlavniOkvir { margin-top: 50px; } .kontaktPrviElement { display:flex; flex-direction: column; text-align: center; } .kontaktIkone { width:100px; } } @media screen and (max-width:600px) { .glavniMeniPoveznicaTekst { margin-left: -10px; } .oNamaPrviElement { width: 80vw; } .oNamaPrvaSlika { width: 80vw; border-radius:0px; } } @media screen and (max-width:580px) { .okvirMeniMobilnaVerzija { display: contents; } .listaMobilnaVerzija { display:flex; width: 100%; display: none; flex-direction: column; margin-top: 30px; margin-left: 350px; } .glavniMeniPoveznicaTekstMobilna { display:flex; text-align: left; margin-top: 20px; } .okvirMeni { display:none; } .okvirSlogan { margin-top: -50px; } .ikonaSlikaMobilni { width: 30px; height: 30px; margin-top: 100px; cursor: pointer; border-radius: 15px; } #listaMobilniId.prikazi { display:contents; display: flex; flex-direction: column; padding-right: 50px; } #goreId.gornji { margin-top: 350px; } .kontaktMapa { width: 400px; height: 250px; border-radius: 0px; } .dostavaSlika { width: 300px; height: 300px; margin-bottom: 50px; } .dostavaDrugiElement { width: 300px; height: 450px; } .topProizvodiTekst { font-size: 25px; } .naslovnaTekst { text-align: center; } .kukiPotvrda { width: 100px; } }