/* global */
body, html {
margin: 0;
padding: 0;
height: 100%;
//overflow-x: hidden; /* Zabrání horizontálnímu scrollování */
}
html {
scroll-behavior: smooth;
}
body {
font-family: "Poppins", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
color: #141516;
background-color: #FFF;
}
a, a:hover {
text-decoration: none;
}
ul li::marker {
color: #7D9E3E;
}
.container-1900 {
max-width: 1900px;
margin-left: auto;
margin-right: auto;
}
.container-1400 {
max-width: 1400px;
margin-left: auto;
margin-right: auto;
}
.container-1000 {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
img.alignright {
float:right;
padding-top:30px;
padding-right:25px;
padding-bottom:30px;
}
/* header + nav */
header {
}
header .custom-navbar .navbar-toggler {
border: none;
padding: 0;
background: transparent;
width: 40px;
}
header .custom-navbar .navbar-toggler img {
width: 35px;
height: auto;
display: block;
margin: 0 auto;
}
header .custom-navbar .collapsed img {
width: 35px;
}
header .custom-navbar a.navbar-brand {
padding: 0;
margin: 26px 38px 24px 0;
//width: 75px;
}
header .custom-navbar .right-group {
display: flex;
gap: 25px;
}
header .custom-navbar a.link-eshop-mobile {
background: #7D9E3E;
padding: 6px 11px 6px 11px;
}
header .custom-navbar {
display: flex;
align-items: center;
justify-content: space-between;
background: #141516;
padding: 0 18px 0 18px;
}
header .custom-navbar .navbar-collapse {
padding: 1px 0 0 0;
}
header .custom-navbar .main-menu {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
header .custom-navbar .links {
align-items: center;
white-space: nowrap;
}
header .custom-navbar ul.main-menu {
padding: 0 25px;
}
header .custom-navbar .navbar-collapse ul li.nav-item {
border-top: 1px solid #FFFFFF;
}
header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link {
font-size: 16px;
line-height: 44px;
color: #FFF;
font-weight: 700;
padding: 6px 0;
text-align: center;
text-decoration: none;
display: inline-block;
position: relative;
}
header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link img {
padding-left: 5px;
}
/* header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link:hover,
header .custom-navbar .navbar-collapse ul li.nav-item a.active {
text-decoration: underline;
text-decoration-color: #FFF;
text-decoration-thickness: 3px;
text-underline-offset: 10px;
} */
header .custom-navbar .navbar-nav .dropdown-menu {
background: #141516;
border: none;
padding: 7px 30px;
border-top: 1px solid #FFFFFF;
border-radius: 0;
}
header .custom-navbar .navbar-nav .dropdown-item {
color: #fff;
padding: 7px 0;
font-size: 16px;
line-height: 44px;
}
header .custom-navbar .links .link-eshop {
padding: 10px 19px;
width: 133px;
height: 53px;
background: #7D9E3E;
font-weight: 700;
font-size: 18px;
line-height: 33px;
color: #FFF;
margin: 0 20px;
}
header .custom-navbar .links .link-eshop img {
margin: -2px 8px 0 0;
}
header .custom-navbar .links .link-phone {
padding: 10px 20px;
height: 53px;
font-weight: 400;
font-size: 18px;
line-height: 33px;
color: #FFF;
margin: 0;
}
header .custom-navbar .links .link-phone img {
margin: -2px 8px 0 0;
}
header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link-phone {
font-weight: 400;
}
header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link-phone img {
margin: -2px 8px 0 0;
}
.custom-carousel .carousel-indicators {
bottom: auto;
margin-top: 56px;
margin-bottom: 0;
}
.custom-carousel .carousel-indicators button {
width: 8px;
height: 8px;
border-radius: 4px;
background: #838383;
border: 4px;
margin-right: 11px;
margin-left: 11px;
}
.custom-carousel .carousel-indicators button.active {
background: #FFF;
}
.custom-carousel .carousel-inner .carousel-item {
height: 610px;
}
.custom-carousel .carousel-inner .carousel-item img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption {
bottom: auto;
top: 103px;
padding: 0;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption h2 {
font-weight: 700;
font-size: 60px;
line-height: 75px;
margin: 0 0 24px 0;
padding: 0;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption p {
font-weight: 700;
font-size: 18px;
line-height: 26px;
margin: 0 0 44px 0;
padding: 0;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption a.more {
font-weight: 700;
font-size: 16px;
line-height: 33px;
margin: 0;
background: #FFFFFF;
border: 1px solid #FFFFFF;
padding: 10px;
width: 113px;
text-align: center;
color: #000000;
display: inline-block;
}
@media (min-width: 1200px) {
header .custom-navbar .navbar-collapse {
display: flex;
justify-content: center;
}
header .custom-navbar {
padding: 0 38px 0 38px;
}
header .custom-navbar a.link-eshop-mobile {
display: none;
}
header .custom-navbar .navbar-collapse {
flex: 1;
padding: 0;
}
header .custom-navbar ul.main-menu {
padding: 0;
}
header .custom-navbar .navbar-collapse ul li.nav-item {
border-top: 0;
}
header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link {
font-size: 18px;
line-height: 33px;
padding: 10px;
margin: 0 10px;
}
header .custom-navbar .navbar-collapse ul li.nav-item a.nav-link:hover::after,
header .custom-navbar .navbar-collapse ul li.nav-item.active a::after {
content: "";
position: absolute;
left: -2%;
bottom: 0;
width: 104%;
height: 3px;
background-color: #FFF;
}
header .custom-navbar .navbar-nav .dropdown:hover .dropdown-menu {
display: block;
margin-top: 0;
}
header .custom-navbar .navbar-nav .dropdown-menu {
background: #141516;
border: none;
padding: 7px 30px;
border: 1px solid #D9D9D9;
border-radius: 0;
}
header .custom-navbar .navbar-nav .dropdown-item {
color: #fff;
padding: 7px 0;
font-size: 16px;
line-height: 33px;
}
header .custom-navbar .navbar-nav .dropdown-item:hover {
text-decoration: underline;
background: #141516;
}
.custom-carousel .carousel-indicators {
margin-top: 100px;
}
.custom-carousel .carousel-inner .carousel-item {
height: 850px;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption {
top: 169px;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption h2 {
font-weight: 700;
font-size: 80px;
line-height: 100px;
margin: 0 0 24px 0;
padding: 0;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption p {
font-size: 22px;
line-height: 35px;
}
}
/* main */
main {
}
/* categories */
section.categories {
padding: 30px 0 0 0;
}
section.categories.services {
padding: 30px 0 60px 0;
}
section .section-title {
text-align: center;
margin-bottom: 42px;
}
section .section-title h2 {
font-weight: 700;
font-size: 21px;
line-height: 31px;
text-align: center;
display: inline-block;
position: relative;
}
section .section-title h2::after {
content: "";
position: absolute;
left: 50%;
bottom: -14px;
transform: translateX(-50%);
width: 90px;
height: 3px;
background-color: #CB9E65;
}
section.categories .categories-grid {
display: flex;
flex-wrap: wrap;
gap: 40px;
}
section.categories .categories-grid .category-item {
flex: 1 1 100%;
border: 2px solid #F1F5EB;
width: 680px;
background-color: #F1F5EB;
margin: 0 20px;
}
section.categories .categories-grid #category-write-us.category-item {
margin: 0;
}
section.categories .categories-grid #category-2.category-item {
border: 2px solid #F9F5EF;
background-color: #F9F5EF;
}
section.categories .categories-grid #category-3.category-item {
border: 2px solid #F3F3F3;
background-color: #F3F3F3;
}
section.categories .categories-grid #category-write-us.category-item {
border: 0;
padding: 61px 41px 61px 41px;
background: #141516 url("../images/bg-category-write-us-mobile.png") no-repeat bottom right;
}
section.categories .categories-grid #category-write-us.category-item h3 {
font-weight: 700;
font-size: 21px;
line-height: 31px;
color: #FFFFFF;
margin-bottom: 18px;
}
section.categories .categories-grid #category-write-us.category-item p {
font-weight: 400;
font-size: 12px;
line-height: 25px;
color: #FFFFFF;
margin-bottom: 43px;
max-width: 360px;
}
section.categories .categories-grid #category-write-us.category-item a {
font-weight: 700;
font-size: 12px;
line-height: 25px;
color: #FFFFFF;
padding: 15px 20px;
width: 110px;
height: 40px;
background: #7D9E3E;
text-decoration: none;
}
section.categories .categories-grid .category-item .header {
background-color: #FFF;
display: flex;
align-items: flex-start;
gap: 30px;
padding: 41px;
position: relative;
}
section.categories .categories-grid .category-item .category-services::after {
content: "";
position: absolute;
width: 34px;
height: 34px;
left: 49px; /* můžeš upravit podle potřeby */
top: -28px; /* aby šipka seděla přesně na hraně */
background: #FFFFFF;
transform: rotate(-45deg);
z-index: 2; /* aby byla nad pozadím */
}
section.categories .categories-grid .category-item .no-arrow::after {
content: none;
}
section.categories .categories-grid .category-item .header .image {
display: flex;
align-items: flex-start;
}
section.categories .categories-grid .category-item .header .title {
}
section.categories .categories-grid .category-item .header .title h3 {
font-weight: 700;
font-size: 21px;
line-height: 31px;
margin-bottom: 3px;
}
section.categories .categories-grid .category-item .header .title p {
font-weight: 400;
font-size: 14px;
line-height: 29px;
margin: 0;
}
section.categories .categories-grid .category-item .category-services {
padding: 22px;
margin-top: 10px;
position: relative;
}
section.categories .categories-grid .category-item .category-services .service {
padding: 22px 0;
border: 1px solid #F1F5EB;
position: relative;
}
section.categories .categories-grid #category-2.category-item .category-services .service {
border: 1px solid #F9F5EF;
}
section.categories .categories-grid #category-3.category-item .category-services .service {
border: 1px solid #F3F3F3;
}
section.categories .categories-grid .category-item .category-services .service:hover {
border: 1px solid #D8E2C5;
background: rgba(125, 158, 62, 0.1);
}
section.categories .categories-grid #category-2.category-item .category-services .service:hover {
border: 1px solid #ECDBC6;
background: rgba(203, 158, 101, 0.1);
}
section.categories .categories-grid #category-3.category-item .category-services .service:hover {
border: 1px solid #CECECE;
background: rgba(151, 151, 151, 0.1);
}
section.categories .categories-grid .category-item .category-services .service + .service::before {
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
height: 1px;
background: #D8E2C5;
}
section.categories .categories-grid #category-2.category-item .category-services .service + .service::before {
background: #ECDBC6;
}
section.categories .categories-grid #category-3.category-item .category-services .service + .service::before {
background: #CECECE;
}
section.categories .categories-grid .category-item .category-services .service:hover::before {
display: none;
}
section.categories .categories-grid .category-item .category-services .service:hover + .service::before {
display: none;
}
section.categories .categories-grid .category-item .category-services .service h4 {
font-weight: 700;
font-size: 17px;
line-height: 26px;
color: #7D9E3E;
margin: 0;
}
section.categories .categories-grid #category-2.category-item .category-services .service h4 {
color: #CB9E65;
}
section.categories .categories-grid #category-3.category-item .category-services .service h4 {
color: #5B5B5B;
}
section.categories .categories-grid .category-item .category-services .service p {
font-size: 12px;
line-height: 22px;
margin: 0;
}
section.categories .categories-grid .category-item .category-services .service .service-links {
margin: 8px 0 0 0;
}
section.categories .categories-grid .category-item .category-services .more-button {
display: flex;
margin: 18px 0 0 0;
}
section.categories .categories-grid .category-item .category-services .more-button a {
padding: 15px;
background: #141516;
font-weight: 700;
font-size: 16px;
line-height: 33px;
padding: 10px;
text-decoration: none;
color: #FFFFFF;
}
section.categories .categories-grid .category-item .category-services .service.extra {
display: none;
}
section.categories .categories-grid .category-item .category-services .service a {
font-weight: 700;
font-size: 12px;
line-height: 25px;
text-decoration-line: underline;
color: #141516;
}
section.categories .categories-grid .category-item .category-services .service .news {
font-weight: 500;
font-size: 12px;
line-height: 22px;
color: #FFFFFF;
background: #7D9E3E;
border-radius: 5px;
padding: 0px 8px;
margin-bottom: 8px;
display: inline-block;
}
section.categories .categories-grid #category-2.category-item .category-services .service .news {
background: #CB9E65;
}
section.categories .categories-grid #category-3.category-item .category-services .service .news {
background: #5B5B5B;
}
header .header-title {
text-align: center;
background: url('../images/bg-header-title.png') no-repeat;
height: 202px;
padding: 51px 0 0 0;
}
header .header-title h1 {
font-weight: 700;
font-size: 21px;
line-height: 31px;
text-align: center;
display: inline-block;
position: relative;
margin-bottom: 34px;
}
header .header-title h1::after {
content: "";
position: absolute;
left: 50%;
bottom: -14px;
transform: translateX(-50%);
width: 90px;
height: 3px;
background-color: #CB9E65;
}
header .header-title p {
font-weight: 400;
font-size: 12px;
line-height: 22px;
}
@media (min-width: 1400px) {
section.categories {
padding: 50px 0 0 0;
}
section .section-title {
margin-bottom: 82px;
}
section .section-title h2 {
font-size: 28px;
line-height: 41px;
}
section .section-title h2::after {
width: 120px;
}
section.categories .categories-grid .category-item {
flex: 1 1 calc(50% - 40px);
margin: 0;
}
section.categories .categories-grid .category-item .category-services .service.extra {
display: block;
}
section.categories .categories-grid .category-item .category-services .more-button {
display: none;
}
header .custom-navbar .links {
display: flex;
align-items: center;
white-space: nowrap;
}
section.categories .categories-grid .category-item .header .title h3 {
font-size: 28px;
line-height: 41px;
}
section.categories .categories-grid .category-item .header .title p {
font-size: 16px;
line-height: 33px;
}
section.categories .categories-grid .category-item .header::after {
width: 45px;
height: 45px;
left: 49px;
top: 130px;
}
section.categories .categories-grid .category-item .category-services .service {
padding: 22px 30px;
}
section.categories .categories-grid .category-item .category-services .service + .service::before {
left: 30px;
right: 30px;
}
section.categories .categories-grid .category-item .category-services .service h4 {
font-size: 22px;
line-height: 35px;
}
section.categories .categories-grid .category-item .category-services .service p {
font-size: 14px;
line-height: 29px;
}
section.categories .categories-grid .category-item .category-services .service a {
font-size: 16px;
line-height: 33px;
}
section.categories .categories-grid .category-item .category-services .service .news {
font-size: 12px;
line-height: 29px;
}
section.categories .categories-grid #category-write-us.category-item h3 {
font-size: 28px;
line-height: 41px;
margin-bottom: 24px;
}
section.categories .categories-grid #category-write-us.category-item p {
font-size: 16px;
line-height: 33px;
margin-bottom: 58px;
max-width: 360px;
}
section.categories .categories-grid #category-write-us.category-item a {
font-size: 16px;
line-height: 33px;
padding: 15px 20px;
width: 146px;
height: 53px;
}
section.categories .categories-grid #category-write-us.category-item {
border: 0;
padding: 82px 51px 41px 51px;
background: #000 url("../images/bg-category-write-us.png") no-repeat;
}
header .header-title {
text-align: center;
background: url('../images/bg-header-title.png') no-repeat;
height: 222px;
padding: 51px 0 0 0;
}
header .header-title h1 {
font-size: 28px;
line-height: 41px;
}
header .header-title h1::after {
width: 120px;
}
header .header-title p {
font-size: 16px;
line-height: 33px;
}
}
/* about us */
section.about-us {
padding: 30px 35px 30px 35px;
text-align: center;
}
section.about-us p {
font-weight: 400;
font-size: 12px;
line-height: 25px;
color: #141516;
max-width: 900px;
margin: 0 auto;
margin-bottom: 27px;
}
section.about-us a {
font-weight: 700;
font-size: 12px;
line-height: 25px;
color: #FFFFFF;
padding: 15px 20px;
background: #7D9E3E;
text-decoration: none;
}
@media (min-width: 1400px) {
section.about-us {
padding: 50px 0 30px 0;
text-align: center;
}
section.about-us p {
font-size: 16px;
line-height: 33px;
margin-bottom: 36px;
}
section.about-us a {
font-size: 16px;
line-height: 33px;
}
}
/* default */
section a {
text-decoration: underline;
color: #7D9E3E;
}
section a:hover {
text-decoration: none;
}
section.default {
padding: 30px 20px 0 20px;
}
section.default.blog {
padding-bottom:60px;
}
section.default h2 {
font-weight: 700;
font-size: 32px;
line-height: 40px;
margin-bottom: 16px;
}
section.default h3 {
font-weight: 700;
font-size: 28px;
line-height: 31px;
margin-bottom: 16px;
}
section.default h4 {
font-weight: 700;
font-size: 24px;
line-height: 31px;
margin-bottom: 16px;
}
section.default p {
font-weight: 400;
font-size: 12px;
line-height: 25px;
}
section.default .ask-question {
background: rgba(125, 158, 62, 0.1);
display: flex;
align-items: center;
gap: 40px;
padding: 36px 43px;
position: relative;
margin: 56px 0;
}
section.default .ask-question .image {
display: flex;
align-items: flex-start;
}
section.default .ask-question .title {
}
section.default .ask-question .title h3 {
font-weight: 700;
font-size: 21px;
line-height: 31px;
margin: 0;
}
section.default .ask-question .title p {
font-weight: 400;
font-size: 12px;
line-height: 25px;
margin: 0;
}
section.default .ask-question a {
font-weight: 700;
font-size: 12px;
line-height: 25px;
text-align: center;
color: #FFFFFF;
padding: 15px 20px;
background: #7D9E3E;
text-decoration: none;
margin-left: auto;
}
section.default ul {
margin-bottom: 40px;
}
section.default ul li {
font-weight: 400;
font-size: 12px;
line-height: 25px;
}
section.default.about {
padding-bottom: 0px;
}
section.default.galerie-page {
padding-bottom: 60px;
}
@media (min-width: 1400px) {
section.default {
padding: 50px 0 0 0;
}
section.default h2 {
font-size: 28px;
line-height: 35px;
}
section.default h3 {
font-size: 24px;
line-height: 35px;
}
section.default h3 {
font-size: 22px;
line-height: 35px;
}
section.default p {
font-size: 16px;
line-height: 33px;
}
section.default .ask-question .title h3 {
font-size: 22px;
line-height: 35px;
}
section.default .ask-question .title p {
font-size: 16px;
line-height: 33px;
}
section.default .ask-question a {
font-size: 16px;
margin-left: auto;
}
section.default ul {
margin-bottom: 56px;
}
section.default ul li {
font-size: 16px;
line-height: 33px;
}
}
@media (max-width: 567px) {
section.default .ask-question {
background: rgba(125, 158, 62, 0.1);
display: flex;
align-items: center;
gap:20px;
padding: 36px 43px;
position: relative;
margin: 56px 0;
flex-direction:column;
}
section.default .ask-question .image {
display: flex;
align-items: flex-start;
}
section.default .ask-question a {
margin-left: 0;
}
section.default .ask-question .title p {
text-align:center;
}
}
/* blog */
section.default .blog-layout {
display: flex;
gap: 40px;
align-items: flex-start;
flex-direction: column;
}
section.default .blog-content {
flex: 1;
min-width: 0;
}
section.default .blog-sidebar {
flex: 1;
width: 100%;
}
section.default .blog-sidebar-box {
background: #fff;
padding: 0;
margin-bottom: 24px;
}
section.default .blog-sidebar-box h3 {
margin: 0 0 24px 0;
font-weight: 700;
font-size: 22px;
line-height: 35px;
color: #141516;
}
section.default .blog-categories {
margin: 0;
display: flex;
flex-direction: column;
gap: 16px;
margin-bottom: 30px;
}
section.default .blog-categories .category {
display: flex;
padding: 25px 40px;
border: 2px solid #F1F5EB;
min-height: 118px;
gap: 25px;
}
section.default .blog-categories .category .category-img {
display: flex;
justify-content: center;
align-items: center;
}
section.default .blog-categories .category .category-img img {
width: 60px;
}
section.default .blog-categories .category .category-link {
display: flex;
justify-content: center;
align-items: center;
}
section.default .blog-categories .category .category-link a {
font-weight: 700;
font-size: 18px;
line-height: 29px;
color: #141516;
text-decoration: none;
}
section.default .blog-categories .category .category-link a:hover {
text-decoration: underline;
}
section.default .blog-post-box {
border: 1px solid rgba(20, 21, 22, 0.1);
padding: 26px 30px;
gap: 30px;
}
section.default .blog-post-box h3 {
margin: 0 0 30px 0;
font-weight: 700;
font-size: 22px;
line-height: 35px;
color: #141516;
}
section.default .blog-posts {
display: flex;
flex-direction: column;
gap: 60px;
}
section.default .blog-posts .blog-post {
display: flex;
align-items: center;
gap: 24px;
position: relative;
}
section.default .blog-posts .blog-post + .blog-post::before {
content: "";
position: absolute;
top: -30px;
left: 0;
right: 0;
height: 1px;
background: #C4C4C4;
}
section.default .blog-posts .blog-post:first-of-type {
border-top: 0;
padding-top: 0;
}
section.default .blog-posts .blog-post-thumb img {
width: 128px;
height: 128px;
object-fit: cover;
display: block;
}
section.default .blog-posts .blog-post-title {
display: inline-block;
font-weight: 400;
font-size: 18px;
line-height: 29px;
color: #141516;
text-decoration: underline;
}
section.default .blog-posts .blog-post-title:hover {
text-decoration: none;
}
section.default p.category {
font-weight: 400;
font-size: 14px;
line-height: 29px;
color: rgba(20, 21, 22, 0.5);
}
section.default p.category img {
margin: -3px 10px 0 0;
}
section.default .blog-content-posts {
display: flex;
flex-direction: column;
gap: 110px;
}
section.default .blog-content-posts .blog-content-post {
display: flex;
gap: 40px;
position: relative;
flex-direction: column;
}
section.default .blog-content-posts .blog-content-post + .blog-content-post::before {
content: "";
position: absolute;
top: -55px;
left: 0;
right: 0;
height: 1px;
background: #C4C4C4;
}
section.default .blog-content-posts .blog-content-post:first-of-type {
border-top: 0;
padding-top: 0;
}
section.default .blog-content-posts .blog-content-post-thumb img {
object-fit: cover;
display: block;
width: 100%;
height: auto;
}
section.default .blog-content-posts .blog-content-post-meta {
display: flex;
flex-direction: column;
margin-top: 16px;
}
section.default .blog-content-posts .blog-content-post .blog-content-post-meta .blog-content-post-title {
display: inline-block;
font-weight: 700;
font-size: 22px;
line-height: 35px;
color: #141516;
text-decoration: underline;
}
section.default .blog-content-posts .blog-content-post .blog-content-post-meta .blog-content-post-title:hover {
text-decoration: none;
}
section.default .blog-content-posts .blog-content-post .blog-content-post-meta p.blog-content-post-category {
display: inline-block;
font-weight: 400;
font-size: 14px;
line-height: 29px;
color: rgba(20, 21, 22, 0.5);
padding: 13px 0;
margin: 0;
}
section.default .blog-content-posts .blog-content-post .blog-content-post-meta p.blog-content-post-category img {
margin: -3px 10px 0 0;
width:20px;
}
section.default .blog-content-posts .blog-content-post .blog-content-post-meta p.blog-content-post-perex {
display: inline-block;
font-weight: 400;
font-size: 16px;
line-height: 33px;
color: #141516;
}
@media (min-width: 1400px) {
section.default .blog-layout {
flex-direction: unset;
gap: 100px;
}
section.default .blog-sidebar {
flex: 0 0 450px;
}
section.default .blog-categories {
margin-bottom: 60px;
}
section.default .blog-content-posts .blog-content-post {
flex-direction: row;
}
section.default .blog-content-posts .blog-content-post-thumb img {
width: 255px;
height: 255px;
}
}
/*****Pavel******/
/*****Galerie**********/
.galerie {
padding:60px 0 60px 0;
}
.galerie h2 {
font-size:16px;
line-height:33px;
color:#141516;
font-weight:bold;
text-align:center;
}
.galerie .filter-list {
display:flex;
align-items:center;
justify-content:center;
padding:10px 0 55px 0;
}
.galerie .filter-list button {
color:#000;
font-size:14px;
line-height:26px;
border-radius:5px;
background: rgba(20, 21, 22, 0.05);
padding:10px 15px;
border:none;
margin:10px;
font-weight:bold;
}
.galerie .filter-list button.active {
color:#fff;
font-size:14px;
line-height:26px;
border-radius:5px;
background: #141516;
padding:10px 15px;
border:none;
margin:10px;
}
.galerie .filter-block {
margin-bottom:30px;
}
/*****Kontakt**********/
.contact-block{
background: #fff;
padding: 30px 0 40px;
}
/* horní 3 boxy */
.contact-top{
padding: 10px 0 40px;
}
.contact-card{
background: transparent;
padding: 10px 10px 0;
}
.contact-ico{
margin: 0 auto 10px;
display:flex;
align-items:center;
justify-content:center;
font-size: 18px;
opacity: .75;
}
.contact-title{
display: inline-block;
font-weight: 700;
font-size: 22px;
line-height:35px;
color: #404653;
text-decoration: none;
}
.contact-title:hover{
text-decoration: underline;
}
.contact-desc{
margin: 8px 0 0;
color: #404653;
font-size: 14px;
line-height: 28px;
}
/* mapa */
.contact-map-wrap{
position: relative;
height: 404px;
width: 100%;
overflow: hidden;
background: #fff;
}
.contact-map{
width: 100%;
height: 100%;
border: 0;
display: block;
filter: saturate(.95);
}
.contact-map-btn{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background: #6f7f2b; /* olivová jako na náhledu */
color: #fff;
text-decoration: none;
padding: 12px 18px;
font-weight: 700;
font-size: 13px;
border-radius: 0;
box-shadow: 0 10px 25px rgba(0,0,0,.25);
}
.contact-map-btn:hover{
color:#fff;
filter: brightness(.95);
}
/* firemní údaje dole */
.contact-company{
padding: 40px 0 40px;
}
.company-title{
font-weight: 700;
font-size: 22px;
line-height:35px;
color: #404653;
margin-bottom: 6px;
}
.company-line{
font-size: 16px;
line-height:33px;
color: #404653;
font-weight:300;
}
@media (max-width: 576px){
.contact-block{ padding-top: 28px; }
.contact-map-wrap{ height: 280px; }
}
/******FAQ************/
.faq {
padding:60px 0 60px 0;
}
.faq .accordion-button::after {
width: 28px;
height: 28px;
background-size: 28px;
}
.faq .accordion-button::after {
background: url('../images/arrow-down.svg') center center no-repeat;
}
/* rotace při otevření */
.faq .accordion-button:not(.collapsed)::after {
transform: rotate(180deg);
}
.faq .accordion-item {
background: #ffffff;
border: 1px solid #e7e8e8;
border-radius: 0;
margin-bottom: 12px;
}
/* Hlavička */
.faq .accordion-header {
background: #ffffff;
}
.faq .accordion-header h3 {
background: #ffffff;
}
/* Tlačítko otázky */
.faq .accordion-button {
background: #ffffff;
color: #000;
font-size: 22px;
font-weight: 700;
padding: 18px 20px;
}
/* Aktivní stav – pořád bílý */
.faq .accordion-button:not(.collapsed) {
background: #ffffff;
color: #000;
box-shadow: none;
}
/* Odebrání default Bootstrap efektů */
.faq .accordion-button:focus {
box-shadow: none;
}
/* Šipka */
.faq .accordion-button::after {
filter: grayscale(1);
}
/* Tělo odpovědi */
.faq .accordion-body {
background: #ffffff;
// border-top: 1px solid #e7e8e8;
font-size: 16px;
line-height: 29px;
padding: 18px 20px;
}
@media (max-width: 767px) {
.faq .accordion-button {
font-size: 18px;
}
.faq .accordion-body {
font-size: 14px;
line-height: 22px;
}
img.alignright {
float:none;
margin:0 auto;
padding-top:30px;
padding-right:px;
padding-bottom:30px;
text-align: center;
display:block;
}
}
/*****Drobečkova navigace******/
.breadcrumbs {
color:#000;
font-size:12px;
margin-bottom:10px;
}
.breadcrumbs a {
color:#000;
}
.breadcrumbs a:hover {
color:#000;
text-decoration: underline;
}
header .header-title.water {
background: url('../images/zahrada-voda.jpg') no-repeat;
}
header .header-title.isolation {
background: url('../images/stavba.jpg') no-repeat;
}
header .header-title.products {
background: url('../images/produkty.jpg') no-repeat;
}
/******************/
section.categories .categories-grid #category-write-us.category-item a:hover {
background: #768f2f;
}
.custom-carousel .carousel-inner .carousel-item .carousel-caption a.more:hover {
background:#f1f1f1;
}
section.about-us a:hover{
background: #768f2f;
}
section.default .ask-question a:hover {
background: #768f2f;
}
header .custom-navbar .links .link-eshop:hover {
background: #768f2f;
}
.dropdown-toggle::after {
display: none;
}
.dropdown-item:focus, .dropdown-item:hover {
background:none;
}
/*****Formulář***********/
.form-home {
padding:60px 0 60px 0;
background:#fff url(../images/form-bg.jpg) center center no-repeat;
background-size: cover;
position:relative;
}
.form-home::after {
content: "";
position: absolute;
inset: 0;
background: rgba(39, 51, 14, 0.9); /* #27330E + 90% */
z-index: 1;
}
/* aby obsah byl NAD overlayem */
.form-home > * {
position: relative;
z-index: 2;
}
.form-home h2 {
font-size:28px;
line-height:41px;
color:#fff;
font-weight:700;
text-align:center;
margin-bottom:60px;
}
.form-home h2::after {
content: "";
position: absolute;
text-align: center;
margin-top: 55px;
left: 50%;
margin-left: -60px;
height: 3px;
width: 120px;
background: #c59e65;
}
/* --- LABELY --- */
.form-home .form-label {
color: #fff;
font-weight: 400;
margin-bottom: 6px;
font-size:16px;
display: block;
}
/* --- INPUTY --- */
.form-home .form-input {
background:#fff;
// border: 1px solid rgba(255, 255, 255, 0.3);
padding: 11px 15px;
font-weight: 600;
color: #333;
border-radius: 3px;
box-shadow: inset 0 4px 12px rgba(0,0,0,0.27); /* <<< INNER SHADOW */
}
.form-home input[type="file"] {
color:#fff;
}
/* placeholdery jako světlejší */
.form-home .form-input::placeholder {
color: #333;
opacity: 0.4;
}
/* SELECT */
.form-home .form-select {
background-color: rgba(255, 255, 255, 1);
//border: 1px solid rgba(255, 255, 255, 0.4);
color: #2d1d18;
font-weight: 600;
/* INNER SHADOW – stejný jako input */
box-shadow: inset 0 4px 12px rgba(0,0,0,0.27);
/* vypnutí defaultní šipky */
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
/* spacing pro šipku */
padding-right: 55px;
/* vlastní šipka */
background-image: url("../images/select-green.png");
background-repeat: no-repeat;
// background-size: 42px auto; /* uprav podle designu */
background-position: right 0px center;
}
/* Fokus */
.form-home .form-select:focus {
border-color: rgba(255, 255, 255, 0.8);
outline: none;
box-shadow:
inset 0 4px 12px rgba(0,0,0,0.27),
0 0 0 2px rgba(255,255,255,0.25);
}
/* Pro lepší zarovnání textu */
.form-home .form-select option {
font-weight: 500;
}
/* Stylování vybraného checkboxu */
.form-home .souhlas input[type="checkbox"] {
width:20px;
height:20px;
border:none;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
border: 1px solid #DDDDF2;
float:left;
margin-right:10px;
margin-top:3px;
background: #fff ;
border-radius:6px;
}
.form-home .souhlas {
display: flex;
align-items: center;
//justify-content: center;
font-style: normal;
font-weight: 400;
font-size: 17px;
color: #473E7A;
}
.form-home .souhlas a {
color: #fff;
margin-left:0px;
font-size:14px;
}
.form-home .souhlas a:hover {
color: #fff;
margin-left:0px;
text-decoration: none;
}
.form-home .souhlas input[type="checkbox"]:checked {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
width: 20px;
height: 20px;
background: #fff url(../images/check2.png) center center no-repeat;
outline: none;
}
/* --- TLAČÍTKO --- */
.form-home .btn-submit {
background-color: #7d9e3e;
color: #fff;
font-weight: 700;
border-radius: 0;
border: none;
transition: 0.2s;
font-size:16px;
height:53px;
width:210px;
}
.btn-submit:hover {
background-color: #768f2f;
}
/* --- CHECKBOX ALIGN --- */
.form-check-input {
width: 18px;
height: 18px;
}
@media (max-width: 767px) {
.form-home h2 {
font-size:21px;
line-height:32px;
}
.form-home .form-label {
font-size:12px;
}
.form-home .form-input {
font-size:12px;
}
.form-home .btn-submit {
font-size:12px;
height:40px;
width:156px;
}
.text-end {
text-align: left !important;
}
.form-home .souhlas a {
color: #fff;
margin-left:0px;
font-size:11px;
}
}
/*****Reference********/
.references-home {
padding:30px 0 60px 0;
}
.references-home h2 {
font-size:28px;
line-height:41px;
color:#141516;
font-weight:700;
text-align:center;
margin-bottom:60px;
}
.references-home h2::after {
content: "";
position: absolute;
text-align: center;
margin-top: 55px;
left: 50%;
margin-left: -60px;
height: 3px;
width: 120px;
background: #c59e65;
}
.references-home .owl-carousel img.stars {
height:14px;
}
.references-home .owl-carousel .item {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.references-home .owl-carousel .item .text {
color:#141516;
font-size:14px;
line-height:29px;
margin-top:45px;
margin-bottom:25px;
text-align:center;
}
.references-home .owl-carousel .item .name {
color:#141516;
font-size:16px;
line-height:33px;
font-weight:bold;
}
.references-home .owl-carousel .owl-nav .owl-prev {
display:block;
position:absolute;
color:#fff;
display:block;
left:-80px;
top:43%;
background:#fff url(../images/left.png) center center no-repeat;
}
.references-home .owl-carousel .owl-nav .owl-prev span {
display:none;
}
.references-home .owl-theme .owl-nav .owl-prev:hover {
background:#fff url(../images/left.png) center center no-repeat
}
.references-home .owl-carousel .owl-nav .owl-next {
display:block;
position:absolute;
color:#fff;
display:block;
right:-80px;
top:43%;
background:#fff url(../images/right.png) center center no-repeat;
}
.references-home .owl-carousel .owl-nav .owl-next span {
display:none;
}
.references-home .owl-theme .owl-nav .owl-next:hover {
background:#fff url(../images/right.png) center center no-repeat;
}
.references-home .more {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top:50px;
}
.references-home .more a{
font-size:16px;
width:150px;
height:53px;
background:#7d9e3e;
font-weight:bold;
text-align:center;
line-height:53px;
color:#fff;
margin-top:35px;
text-decoration:none;
}
.references-home .more a:hover{
background: #768f2f;
}
.references-home .more img.google{
margin-top:30px;
}
@media (max-width: 1400px) {
.references-home .owl-carousel .owl-nav .owl-prev {
left:0px;
top:43%;
}
.references-home .owl-carousel .owl-nav .owl-next {
right:0px;
top:43%;
}
.references-home .owl-carousel .item .text {
padding: 0 60px;
}
}
@media (max-width: 767px) {
.references-home .more a{
font-size:12px;
width:113px;
height:40px;
line-height:40px;
}
.form-row {
padding-left: 25px;
padding-right: 25px;
}
.references-home {
padding:0px 0 60px 0;
}
.references-home .more {
margin-top:0px;
}
.references-home .owl-carousel .owl-nav .owl-prev {
left:0px;
top:43%;
}
.references-home .owl-carousel .owl-nav .owl-next {
right:0px;
top:43%;
}
.references-home .owl-carousel .item .text {
text-align:center;
}
.references-home h2 {
font-size:21px;
line-height:32px;
}
.references-home .owl-carousel .item .text {
font-size:12px;
line-height:24px;
}
}
/** Galerie ***/
/* nastavíme Bootstrap gutter na 35px */
.gallery-row {
--bs-gutter-x: 35px;
--bs-gutter-y: 35px;
}
/* vyrušíme negativní margin řádku */
.gallery-home .gallery-row {
margin-left: 20px !important;
margin-right: 20px !important;
}
/* dorovnáme padding container-fluid */
.gallery-home .container-fluid {
padding-left: 0 !important;
padding-right: 0 !important;
}
/* stejná výška obrázků */
.gallery-home .gallery-img {
width: 100%;
height: 397px;
object-fit: cover;
display: block;
}
/* CTA panel stejná výška */
.gallery-home .gallery-cta {
height: 397px;
background: #141516;
}
.gallery-home .gallery-cta h3{
font-size:28px;
line-height:41px;
font-weight:bold;
text-align:center;
}
.gallery-home .gallery-cta a.desktop {
font-size:16px;
width:169px;
height:53px;
background:#7d9e3e;
font-weight:bold;
text-align:center;
line-height:53px;
color:#fff;
margin-top:35px;
display:inline-block;
text-decoration:none;
}
.gallery-home .gallery-cta a.desktop:hover{
background: #768f2f;
}
.gallery-home .gallery-cta a.mobile{
display:none;
}
@media (max-width: 767px) {
/* stejná výška obrázků */
.gallery-home .gallery-img {
width: 100%;
height: 160px;
object-fit: cover;
display: block;
}
/* CTA panel stejná výška */
.gallery-home .gallery-cta {
height: 160px;
background: #141516;
}
.gallery-home .gallery-row {
margin-left: -20px !important;
margin-right: -20px !important;
}
/* 2. řádek › bude až po 3. */
.row-2-item {
order:3;
}
/* 3. řádek › bude nahoře */
.row-3-item {
order: 2;
}
.row-4-item {
order: 1;
}
.row-5-item {
order: 5;
}
.row-6-item {
order: 6;
}
.gallery-row {
--bs-gutter-x: 20px;
--bs-gutter-y: 20px;
}
.gallery-home .gallery-cta h3{
font-size:12px;
line-height:16px;
font-weight:bold;
text-align:center;
}
.gallery-home .gallery-cta a.desktop{
display:none;
}
.gallery-home .gallery-cta a.mobile{
display:block;
}
.gallery-home .container-fluid,
.gallery-home .row{
padding-left: 0 !important;
padding-right: 0 !important;
}
/* Obrázky se MUSÍ chovat správně */
.gallery-home img {
width: 100%;
height: auto;
display: block;
}
/* CTA panel aby nepřetékal doprava */
.gallery-cta {
width: 100%;
box-sizing: border-box;
}
.gallery-home .container-fluid{
padding-left: 0 !important;
padding-right: 0 !important;
}
/* nastav mezery (gutter) mezi sloupci i řádky */
.gallery-home .gallery-row{
--bs-gutter-x: 20px; /* mezera mezi sloupci = 12px (tj. 6+6) */
--bs-gutter-y: 20px; /* mezera mezi řádky */
}
/* tohle odstraní horizontální scroll způsobený zápornými marginy row */
.gallery-home{
overflow-x: clip; /* když by nešlo, dej hidden */
}
@supports not (overflow: clip) {
.gallery-home{ overflow-x: hidden; }
}
.gallery-home .container-fluid {
padding-left: 0;
padding-right: 0;
}
/* řádek – záporný margin vyruší padding sloupců */
.gallery-home .gallery-row {
margin-left: -10px;
margin-right: -10px;
}
/* sloupce – vnitřní mezery */
.gallery-home .gallery-row > [class*="col-"] {
padding-left: 10px;
padding-right: 10px;
margin-bottom: 0px; /* mezera POD sebou */
}
/* obrázky */
.gallery-home img {
display: block;
width: 100%;
height: auto;
}
/* CTA panel */
.gallery-home .gallery-cta {
width: 100%;
box-sizing: border-box;
}
}
/****Formular hlasky*********/
div.wpcf7 {
margin: 0;
padding: 0;
}
div.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
width: 1px;
margin: 0;
padding: 0;
border: 0;
}
div.wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #ff0000;
}
div.wpcf7-mail-sent-ok {
border: 2px solid #398f14;
color:#fff;
}
div.wpcf7-mail-sent-ng,
div.wpcf7-aborted {
border: 2px solid #ff0000;
color:#fff;
}
div.wpcf7-spam-blocked {
border: 2px solid #ffa500;
color:#fff;
}
div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
border: 2px solid #f7e700;
color:#fff;
}
.wpcf7-form-control-wrap {
position: relative;
}
span.wpcf7-not-valid-tip {
color: #f00;
font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip span.wpcf7-not-valid-tip {
position: absolute;
top: 20%;
left: 20%;
z-index: 100;
border: 1px solid #ff0000;
background: #fff;
padding: .2em .8em;
}
span.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
span.wpcf7-list-item-label::before,
span.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-display-none {
display: none;
}
div.wpcf7 .ajax-loader {
visibility: hidden;
display: inline-block;
background-image: url('../../images/ajax-loader.gif');
width: 16px;
height: 16px;
border: none;
padding: 0;
margin: 0 0 0 4px;
vertical-align: middle;
}
div.wpcf7 .ajax-loader.is-active {
visibility: visible;
}
div.wpcf7 div.ajax-error {
display: none;
}
div.wpcf7 .placeheld {
color: #888;
}
div.wpcf7 .wpcf7-recaptcha iframe {
margin-bottom: 0;
}
div.wpcf7 input[type="file"] {
cursor: pointer;
}
div.wpcf7 input[type="file"]:disabled {
cursor: default;
}
div.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
/* footer */
footer {
background: #000;
padding:60px 0 100px 0;
}
footer h3 {
font-size: 22px;
line-height: 35px;
font-weight: 700;
margin-bottom: 20px;
color:#979797;
}
footer .footer-offices {
padding-right:45px;
}
footer .footer-offices .text {
font-size: 14px;
line-height: 24px;
font-weight: 400;
color:#979797;
margin-bottom: 20px;
}
footer .footer-offices .big-text {
font-size: 16px;
line-height: 33px;
font-weight: 400;
color:#fff;
margin-bottom: 20px;
}
footer .footer-offices .big-text a {
color:#fff;
}
footer .footer-offices .title {
font-size: 16px;
line-height: 33px;
font-weight: 700;
margin-bottom: 20px;
color:#fff;
}
footer .footer-offices .title.bottom {
margin-top: 55px;
}
footer .footer-offices ul {
margin:15px 0 0 0;
padding:0px;
}
footer .footer-offices ul li {
list-style-type: none;
padding:0px;
}
footer .footer-offices ul li a {
color:#fff;
font-weight:bold;
font-size:16px;
line-height:33px;
}
footer .footer-offices ul li a:hover {
text-decoration:underline;
}
footer .footer-offices .open {
font-size: 16px;
line-height: 33px;
font-weight: 700;
margin-bottom: 20px;
color:#fff;
}
footer .footer-offices .open span {
font-weight:bold;
margin-left:10px;
}
footer .google-reference a {
border:1px solid #747474;
border-radius:29px;
padding:40px;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
footer .google-reference a {
border:1px solid #747474;
border-radius:29px;
padding:40px;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
footer .google-reference .title-ref {
font-size:14px;
line-height:24px;
color:#979797;
margin-bottom:15px;
}
footer .google-reference .title-text {
font-size:13px;
line-height:24px;
color:#fff;
font-weight:bold;
margin-bottom:15px;
margin-top:10px;
}
footer .google-reference img.google{
height:40px;
}
footer .google-reference img.stars{
height:14px;
}
@media (max-width: 767px) {
.references-home .more a{
font-size:12px;
}
.footer-row {
padding-left: 25px;
padding-right: 25px;
}
footer {
background: #000;
padding:35px 0 40px 0;
}
footer h3 {
font-size: 16px;
line-height: 26px;
font-weight: 700;
margin-bottom: 20px;
color: #979797;
}
footer .footer-offices .text {
font-size:11px;
line-height:18px;
margin-bottom:10px;
}
footer .footer-offices .title {
font-size: 12px;
line-height: 24px;
margin-bottom:10px;
}
footer .footer-offices .open {
font-size: 12px;
line-height: 24px;
margin-bottom:10px;
}
footer .footer-offices .big-text {
font-size: 12px;
line-height: 24px;
margin-bottom:10px;
}
footer .footer-offices .title.bottom {
margin-top: 30px;
}
footer .separator {
height: 3px;
width: 90px;
background: #c59e65;
display:block;
margin-top:30px;
margin-bottom:30px;
}
footer .footer-offices ul li a {
color:#fff;
font-weight:bold;
font-size:12px;
line-height:24px;
}
footer .google-reference .title-ref {
font-size:11px;
line-height:18px;
color:#979797;
margin-bottom:15px;
}
footer .google-reference .title-text {
font-size:11px;
line-height:18px;
}
footer .google-reference img.google{
height:40px;
}
footer .google-reference img.stars{
height:14px;
}
footer .google-reference a {
padding:25px 30px;
margin-top:40px;
}
footer .footer-offices ul {
margin:0px;
}
}