/* ADD STYLE for my Manual Filter */

/* FONT ICON 2 (sablona crafty) *//*content: "\e905";*/
@font-face {
    font-family: myIkon1;
    font-display: swap;
  src: url('fonts/icomoon.woff') format('woff');
}

.myVmFilterBannerTitle2 {
  margin-top: 25px;
  font-size: 24px;
  line-height: 100%;
  font-weight: 700;
  margin-left: 20px;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
  width: fit-content;
  padding: 10px 17px;
  background-color: #837364;
  color: #fff;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  cursor: pointer;
}
.myVmFilterBannerTitle2::after {
  content: "\e903";
  font-family: myIkon1;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: all .3s ease-in-out;
  transform: rotate(90deg);
}
.myVmFilterBannerTitle2.myOpen::after {
  transform: rotate(-90deg);
}

.myVmFilterBannerCover {
  height: 1px;
  overflow: hidden;
  margin-bottom: 25px;
}
.myVmFilterBannerCover.myOpen {
  height: auto;
}


/* VM Filter */
.myVmFilterBanner {
  /*margin-top: 25px;*/
  /*margin-bottom: 25px;*/
  border: 1px solid #837364;
  /*padding: 16px 20px;*/
  padding: 25px;
  padding-top: 30px;
}
.myVmFilterBanner .myVmFilterBannerTitle {
  display: inline-block;
  /*padding: 7px 20px;*/
  /*padding-bottom: 0px;*/
  /*background-color: #f2f3f4;*/
  font-size: 24px;
  font-weight: 700;
  /*margin-left: 20px;*/
  /*border-top-left-radius: 14px;*/
  /*border-top-right-radius: 14px;*/
  margin-bottom: 20px;
}
.myVmFilterBanner form#myVmFilterForm {
  /*background-color: #f2f3f4;*/
  /*padding: 16px 20px;*/
  /*border-radius: 9px;*/
}
.myVmFilterBanner form#myVmFilterForm .myCover {
  display: flex;
  /*flex-direction: column;*/
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px 0px;
  /*margin: 0px -20px;*/
}
.myVmFilterBanner .myVmFilterBannerContent {
  /*min-width: calc(100% / 2);*/
  min-width: 100%;
  /*padding: 0px 20px;*/
  /* in 1 line */
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px 0px;
  border-bottom: 1px solid #837364;
  padding-bottom: 20px;
}
.myVmFilterBanner .myVmFilterBannerContentTitle {
  font-size: 18px;
  font-weight: 600;
  /*color: #1e4d94;*/
  line-height: 18px;
  width: 12%;
}
.myVmFilterBanner .mySelect.myVmFilterBannerContent {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  gap: 0px 8px;
}
.myVmFilterBanner select.myVmFilterBannerContentValues {
  width: auto;
  height: auto;
  padding: 7px 18px !important;
  padding-left: 7px !important;
  cursor: pointer;
}
.myVmFilterBanner ul.myVmFilterBannerContentValues {
  padding: 0px;
  list-style-type: none;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  /*gap: 15px 30px;*/
  gap: 15px 0px;
  line-height: 100%;
  /*margin-top: 8px;*/
  width: calc(100% - 12% + 30px);
  margin: 0px -15px;
}
.myVmFilterBanner ul.myVmFilterBannerContentValues li {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0px 7px;
  width: 25%;
  padding: 0px 15px;
}
.myVmFilterBanner ul.myVmFilterBannerContentValues li input {
  height: 18px;
  width: 18px;
  cursor: pointer;
}
.myVmFilterBanner ul.myVmFilterBannerContentValues li label {
  cursor: pointer;
}
.myVmFilterBanner .myVmFilterReset {
  text-align: right;
  margin-top: 20px;
}


/* Filtr Ceny */
.myVmFilterBanner .myFilterPrice {
  margin-top: 20px;
}
.myVmFilterBanner #slider {
  width: 100%;
  width: calc(100% - 110px);
  margin: auto;
  height: 10px;
  background: #ccc;
  position: relative;
  /*margin-top: 8px;*/
  margin-top: 35px;
  margin-bottom: 35px;
}
.myVmFilterBanner .range-bar {
  height: 10px;
  /*background: #1dacf3;*/
  background: #a99783;
  position: absolute;
  top: 0;
}
.myVmFilterBanner .handle {
  width: 20px;
  height: 20px;
  /*background: #1e4d94;*/
  background: #81664c;
  position: absolute;
  top: -5px;
  border-radius: 50%;
  cursor: pointer;
  margin-left: -10px;
}
.myVmFilterBanner .handle > span {
  display: block;
  position: absolute;
  top: 100%;
  left: 50%;
  visibility: hidden;
  white-space: nowrap;
}
.myVmFilterBanner .handle#handle-max > span {
  top: auto;
  bottom: 100%;
}
.myVmFilterBanner .myVal {
  margin-left: -50%;
  display: inline-block;
  visibility: visible;
  line-height: 100%;
}
