@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Arial", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

[x-cloak] {
  display: none !important;
}

html {
  scroll-behavior: smooth;
  scrollbar-gutter: auto;
}

body {
  color: #000;
  position: relative;
  overflow-x: hidden;
  width: 100%;
}
body.opened-menu {
  overflow-y: hidden;
}

img {
  max-width: 100%;
}


ul {
  list-style: none;
}

h1 {
  font-size: 3rem;
  font-weight: 400;
}

h2 {
  font-weight: normal;
  margin-bottom: 1rem;
  font-size: 2rem;
}

p {
  margin-bottom: 1rem;
  line-height: 1.5;
}

table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  text-align: left;
  border-bottom: 1px solid #ccc;
  padding: 0.5rem 0;
}

.container {
  max-width: 1420px;
  margin: 0 auto;
  padding: 0 1rem;
}

header {
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.04), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 0px 1px rgba(0, 0, 0, 0.04);
  background: #fff;
  position: relative;
  z-index: 2000;
  padding-bottom: 0.5rem;
}
@media (min-width: 620px) {
  header {
    padding: 0;
  }
}
header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media (min-width: 620px) {
  header .container {
    height: 80px;
  }
}




.navigation {
  order: 2;
}
@media screen and (min-width: 1200px) {
  .navigation {
    height: 100%;
  }
}
.navigation nav {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
  background: white;
  z-index: 10;
  padding: 1rem;
  padding-top: 4rem;
  overflow-y: auto;
}
@media screen and (min-width: 1200px) {
  .navigation nav {
    display: block !important;
    position: static;
    width: auto;
    background: none;
    padding: 0;
    overflow: visible;
    height: 100%;
  }
}
@media screen and (min-width: 1200px) {
  .navigation ul {
    display: flex;
    height: 100%;
  }
}
.navigation li {
  align-items: center;
}
@media screen and (min-width: 1200px) {
  .navigation li {
    display: flex;
  }
}
@media screen and (min-width: 1200px) {
  .navigation li a::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: #e6dc23;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.15s ease-in-out;
    position: relative;
    top: -30px;
  }
  .navigation li a:hover::after {
    transform: scaleX(1);
  }
}
.navigation li a span {
  display: none;
}
@media screen and (min-width: 1200px) {
  .navigation li a span {
    display: inline-flex;
    align-items: center;
  }
}
.navigation li svg {
  width: 1rem;
  height: 1rem;
}
.navigation a {
  padding: 0.75rem;
  padding-right: 0;
  text-decoration: none;
  color: #686de2;
  font-weight: bold;
  font-size: 1.1rem;
}
@media screen and (min-width: 1200px) {
  .navigation a {
    color: #000;
    font-size: 1rem;
    padding: 0.75rem 1rem;
  }
}
.navigation .has-submenu {
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
.navigation .has-submenu > a {
  display: none;
}
@media screen and (min-width: 1200px) {
  .navigation .has-submenu > a {
    display: block;
    position: relative;
  }
  .navigation .has-submenu > a span {
    transform: rotate(90deg);
  }
  .navigation .has-submenu > a span svg {
    width: 0.5rem;
    height: 0.5rem;
  }
  .navigation .has-submenu:hover > .submenu-container {
    display: block !important;
  }
}
.navigation .submenu-container {
  width: calc(100% + 2rem);
  margin: 0 -1rem;
  border-bottom: 1px solid #ccc;
  padding: 0 1rem;
  padding-bottom: 1rem;
}
.navigation .submenu-container::before {
  content: "";
  display: block;
  height: 10px;
  background: #fff;
  top: -5px;
  left: 0;
  position: absolute;
  width: 100%;
}
.navigation .submenu-container a {
  color: #000;
  font-weight: normal;
  font-size: 0.9rem;
}
.navigation .submenu-container a::after {
  display: none;
}
.navigation .submenu-container a span {
  display: inline-block;
}
@media screen and (min-width: 1200px) {
  .navigation .submenu-container {
    position: absolute;
    left: 0;
    top: 80px;
    width: 250px;
    margin: 0;
    border: 0;
    background-color: #fff;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.04), 0px 0px 2px rgba(0, 0, 0, 0.06), 0px 0px 1px rgba(0, 0, 0, 0.04);
    border-radius: 0px 0px 5px 5px;
    border-top: 1px solid rgba(0, 30, 70, 0.05);
    z-index: 100;
    padding: 0.5rem;
  }
  .navigation .submenu-container ul {
    display: block;
  }
  .navigation .submenu-container a {
    padding: 0.5rem 1rem;
  }
  .navigation .submenu-container a:hover {
    opacity: 0.7;
  }
}

.mobile-navigation {
  display: flex;
  font-size: 1rem;
  padding: 0.5rem;
  font-size: 0.85rem !important;
}
@media screen and (min-width: 1200px) {
  .mobile-navigation {
    display: none;
  }
}
.mobile-navigation img, .mobile-navigation svg {
  width: 30px;
  height: 30px;
}
.mobile-navigation a {
  font-weight: normal;

  text-align: center;
  padding: 0;
  color: #000;
  font-size: 0.85rem !important;
}
.mobile-navigation a span {
  display: block;
}

.mobileMenuButton {
  cursor: pointer;
  background: none;
  border: 0;
}
.mobileMenuButton span {
  display: block;
}

.openMenu {
  margin-left: 1rem;
}

.closeMenu {
  z-index: 11;
}

.toggleSubmenu {
  border: 0;
  background: none;
  padding: 0.5rem;
  display: flex;
  align-items: center;
}
.toggleSubmenu .fake-link {
  color: #0a78ff;
  display: block;
  font-size: 1.1rem;
  font-weight: 700;
}
.toggleSubmenu svg {
  stroke: #0a78ff;
  margin-left: 0.5rem;
}
.toggleSubmenu .submenu-opened {
  transform: rotate(180deg);
}
@media screen and (min-width: 1200px) {
  .toggleSubmenu {
    display: none;
  }
}

/* breadcrumps */
.breadcrumps {
  display: flex;
  color: rgba(142, 142, 142, 0.8980392157);
}
.breadcrumps li::after {
  content: "/";
  margin: 0 0.1rem;
}
.breadcrumps li:last-child::after {
  display: none;
}
.breadcrumps a {
  color: rgba(142, 142, 142, 0.8980392157);
  text-decoration: none;
}
.breadcrumps span {
  color: rgba(0, 0, 0, 0.8980392157);
}

/* DETAIL */
@media screen and (max-width: 960px) {
  .us_blok_hodnoceni_layout_1::before {
    display: none;
  }
  
     .banner__scroll {
    display: none;
  }
}





.homepage main {
  padding: 0;
}

/* CATEGORY */
#drobeckovanavigacenahore {
  font-size: 0.75rem;
}
#drobeckovanavigacenahore a {
  color: #8e8e8e;
}

#drobeckovanavigacenahore ul, #drobeckovanavigacedole ul {
  border: 0;
}

.category-headline {
  margin-bottom: 2rem;
}

/* MANSORY */
.grid {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.grid-sizer {
  width: 50%;
  height: 0;
  visibility: hidden;
  position: absolute;
}
@media screen and (min-width: 960px) {
  .grid-sizer {
    width: 20%;
  }
}

.grid-item {
  position: relative;
  background: #fff;
  padding: 5px;
  color: #000;
  display: block;
  width: 50%;
  min-height: 300px;
  height: 50vh;
  max-height: 400px;
  flex: 0 0 auto;
}
@media screen and (min-width: 480px) {
  .grid-item {
    min-height: 360px;
  }
}
@media screen and (min-width: 960px) {
  .grid-item {
    height: 50vh;
    width: 20%;
  }
}
.grid-item::before {
  content: "";
  display: block;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  position: absolute;
  left: 5px;
  top: 5px;
  background: #000;
  opacity: 0.05;
  z-index: 1;
  transform-origin: center;
  transition: all 0.1s;
}
.grid-item:hover::before {
  background: blue;
}

.grid-item-img {
  display: block;
  padding-bottom: 3rem;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 480px) {
  .grid-item-img {
    padding-bottom: 5rem;
  }
}
.grid-item-img img {
  height: 100%;
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.grid-item-big {
  width: 100%;
}
@media screen and (min-width: 960px) {
  .grid-item-big {
    min-height: 800px;
    width: 40%;
    height: 100vh;
  }
}

.grid-item-texts {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  display: block;
  text-align: center;
  width: calc(100% - 2rem);
}
@media screen and (min-width: 560px) {
  .grid-item-texts {
    bottom: 2rem;
    left: 2rem;
    width: calc(100% - 4rem);
  }
}
.grid-item-texts > span {
  display: block;
}

.grid-item-code {
  opacity: 0.7;
}

.swiper2 {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}

/*HOME PAGE*/
/*Homepage slider*/
/*Textové bloky*/
.search-container {
  order: 3;
  display: flex;
  align-items: center;
  width: 100%;
}
@media (min-width: 620px) {
  .search-container {
    position: relative;
    height: 100%;
    width: auto;
    padding: 0 1rem;
    order: 2;
    flex: 1;
  }
}
.search-container form {
  display: flex;
}
.search-container form input {
  padding: 8px;
  border-radius: 0;
  border: 1px solid #ccc;
  flex: 1;
}
.search-container button {
  background: #0a78ff;
  color: #fff;
  border: 0;
  padding: 8px;
}

.search-inner {
  width: 100%;
}
@media (min-width: 620px) {
  .search-inner {
    position: relative;
  }
}

.autocomplete-container {
  position: absolute;
  z-index: 200;
  top: 100%;
  left: 0;
  background: #fff;
  width: 100%;
  box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

.search-overlay {
  position: fixed;
  display: flex;
  background: rgba(0, 0, 0, 0.8);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 100;
}

#popup-hledani-zbozi {
  display: flex;
  flex-direction: column;
}

#vystupni_hlaska {
  font-weight: bold;
  padding: 0.5rem 1rem;
}

.polozka-zbozi a {
  display: flex;
  color: #000;
  text-decoration: none;
  align-items: center;
  padding: 0.5rem 1rem;
}
.polozka-zbozi a:hover {
  background: #F1F1FE;
}

.polozka-zbozi-img {
  display: block;
  width: 35px;
  margin-right: 0.5rem;
}
.polozka-zbozi-img img {
  display: block;
}

.download-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  margin-bottom: 2rem;
}

.download-item a {
  display: flex;
  align-items: center;
  text-decoration: none;
  font-size: 0.85rem;
  color: black;
}

.download-item-icon {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  position: relative;
  background: #F6DDD0;
  margin-right: 0.5rem;
}

.download-item-text span {
  display: block;
}

.download-item-title {
  font-weight: bold;
}

.download-item-code {
  color: #929292;
}/*# sourceMappingURL=main.css.map */