:root {
--tel: url('data:image/svg+xml,');
--mejl: url('data:image/svg+xml,');
--pin: url('data:image/svg+xml,');
--bank: url('data:image/svg+xml,');
}
.kk-star-ratings {
margin: 20px 0;
}
.navi {
padding: 20px;
background: var(--szary);
display: flex;
flex-direction: column;
gap: 20px;
margin: 40px -20px;
}
.navi_a {
color: #000;
display: flex;
justify-content: flex-start;
align-items: center;
gap: 20px;
text-decoration: unset;
}
.navi_d {
justify-content: flex-end;
text-align: right;
}
.navi_f {
font-size: 30px;
}
.navi_a:hover {
color: var(--granatowy);
}
.pod {
margin-top: 40px;
}
.pod_p {
font-weight: bold;
font-size: 120%;
}
.pod_flex {
display: flex;
gap: 20px;
overflow-x: auto;
margin: 0 -20px;
padding: 20px;
}
.pod_a {
display: block;
color: inherit;
text-decoration: none;
padding: 10px;
box-shadow: var(--cien-20);
border-radius: var(--radius);
flex: 0 0 250px;
}
.pod_fota {
height: 150px;
overflow: hidden;
margin-bottom: 20px;
}
.pod_fota_produkt .pod_img {
height: 100%;
width: auto;
}
.pod_t {
display: block;
font-weight: var(--font-bold);
text-align: center;
}
.pagi {
list-style: none;
margin: 0;
padding: 40px 0;
display: flex;
gap: 20px;
justify-content: center;
flex-wrap: wrap;
}
.pagi li {
border: var(--border);
border-color: var(--kolor-zielony);
color: var(--kolor-zielony);
}
li.pagi_n {
border: 0;
color: inherit;
}
.pagi a {
color: inherit;
display: block;
border: 1px solid var(--zielony);
padding: 3px 10px;
text-decoration: none;
}
.pagi a:hover,
.pagi .active a {
background: var(--kolor-zielony);
color: #fff;
}
.wooNavi.ulAff {
display: flex;
gap: 20px;
justify-content: center;
margin: var(--o-x2) 0;
}
.aSzukaj_form {
display: flex;
flex-wrap: wrap;
margin: 40px auto;
gap: 20px;
width: 500px;
max-width: 100%;
justify-content: center;
align-items: center;
}
.aSzukaj_form_label {
width: 380px;
max-width: 100%;
}
.aSzukaj_form_submit {
width: 100px !important;
}
footer {
content-visibility: auto;
margin-top: 40px;
padding: 50px 20px 100px;
background: var(--szary-ciemny);
color: #fff;
}
.foo_zaH3 {
margin-bottom: 10px;
font-weight: bold;
font-size: 110%;
}
.fooBox a {
color: inherit;
display: block;
}
.footerP {
font-weight: bold;
width: 100%;
line-height: 1.2;
}
.fooFlex {
max-width: var(--szerokosc);
margin: auto;
display: flex;
flex-wrap: wrap;
gap: 40px;
line-height: 2;
}
.fooBox {
width: 280px;
}
.foo_spol {
display: flex;
gap: 20px;
margin-top: 40px;
align-items: center;
}
.foo_kontakt {
display: flex;
flex-direction: column;
}
.foo_adres,
.foo_bank {
margin: 0 0 10px 23px;
position: relative;
}
.foo_bank {
margin: 10px 0 0 23px;
}
.fooBox .foo_tel,
.fooBox .foo_mejl {
display: flex;
align-items: center;
text-decoration: unset;
}
.foo_bank::before,
.foo_adres::before,
.foo_tel::before,
.foo_mejl::before {
content: '';
background-color: #fff;
width: 16px;
height: 16px;
display: block;
margin-right: 5px;
mask-size: cover;
}
.foo_tel::before {
mask-image: var(--tel);
}
.foo_mejl::before {
mask-image: var(--mejl);
}
.foo_bank::before,
.foo_adres::before {
mask-image: var(--pin);
width: 20px;
height: 20px;
position: absolute;
left: -24px;
top: 7px;
}
.foo_bank::before {
mask-image: var(--bank);
}
.fooLinki {
display: flex;
gap: 10px 20px;
margin: 50px 0;
justify-content: center;
flex-wrap: wrap;
}
footer a:hover {
color: #f1f1f1;
text-decoration-color: transparent;
}
.foo_copy {
display: flex;
justify-content: center;
gap: 20px;
margin: 60px 0;
flex-wrap: wrap;
text-align: center;
}
.foo_copy a {
color: inherit;
}
.foo_copy_span {
display: none;
}
.loga {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
max-width: var(--szerokosc);
margin: auto;
flex-wrap: wrap;
}
.loga img {
margin: 0;
width: auto;
max-height: 28px;
}
@media (min-width: 800px) {
.navi {
margin: 40px 0;
}
.pod_a {
flex: 1;
}
.fooLinki {
gap: 50px;
}
.foo_copy_span {
display: block;
}
}
@media (min-width: 900px) {
.fooFlex {
justify-content: center;
}
.fooBox {
flex: 0 0 250px;
}
}