a,
input,
textarea,
body,
img,
h1,
h2,
h3,
h4 {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: #2e2e2e;
  font-family: "Gantari", sans-serif;
  font-weight: 400;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background: #f9f1e7;
}

a:visited {
  color: #2e2e2e;
  text-decoration: none;
}

.main {
  max-width: 1920px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  background: #e6d5bf;
}

.inner {
  max-width: 1920px;
  padding: 0 40px;
  margin: 0 auto;
  position: relative;
}
@media (max-width: 960px) {
  .inner {
    padding: 0 10px;
  }
}

.top-bg-wrapper {
  position: relative;
  margin: -120px 0 0 0;
  height: min(44vw, 840px);
  width: 100%;
  overflow: hidden;
  z-index: 1;
}
@media (max-width: 760px) {
  .top-bg-wrapper {
    height: 360px;
  }
}
.top-bg-wrapper .top-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 2;
  filter: sepia(0.05) contrast(1.1);
}
@media (max-width: 560px) {
  .top-bg-wrapper .top-bg {
    top: 2rem;
  }
}
.top-bg-wrapper .top-bg-overlay {
  background: #f5f1ec;
  opacity: 0.15;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 3;
}

.btn {
  background: #2e2e2e;
  padding: 0.5rem 1rem;
  color: #ffffff !important;
  cursor: pointer;
  text-align: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  font-family: inherit;
  position: relative;
  display: block;
}

.btn::before {
  position: absolute;
  height: 100%;
  width: 0%;
  left: 0%;
  top: 0%;
  z-index: 1;
  opacity: 0.13;
  transition: all 0.33s ease;
  background: #fff;
  content: " ";
}

.btn:hover::before {
  width: 100%;
}

@media (max-width: 960px) {
  .logo img {
    width: 100px;
    height: auto;
    -o-object-fit: contain;
       object-fit: contain;
  }
}

.nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5rem;
  padding: 0 0;
}
@media (max-width: 1200px) {
  .nav {
    gap: 1.5rem;
  }
}
@media (max-width: 960px) {
  .nav {
    display: none;
  }
}
.nav .nav-item {
  color: #ffffff;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 8px;
  position: relative;
  font-weight: 500;
}
@media (max-width: 1100px) {
  .nav .nav-item {
    text-align: center;
  }
}
.nav .rez {
  font-size: 16px;
  padding: 0.75rem 1.5rem;
}
.nav .nav-item::after {
  position: absolute;
  height: 1px;
  width: 0%;
  background: #fff;
  bottom: -0.5rem;
  content: " ";
  left: -3px;
  transition: all 0.33s ease;
}
.nav .nav-item:hover::after {
  width: 100%;
}

.header {
  display: flex;
  width: 100%;
  height: 120px;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 2;
}
@media (max-width: 960px) {
  .header {
    height: 80px;
  }
}

.header-subpage-wrapper {
  background: #f9f1e7;
  color: #2e2e2e;
  width: 100%;
}
.header-subpage-wrapper .nav-item {
  color: #2e2e2e;
}
.header-subpage-wrapper .nav-item::after {
  background: #2e2e2e;
}

.title-block-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  height: 0px;
  width: 100%;
}
@media (max-width: 560px) {
  .title-block-wrapper {
    width: calc(100% - 20px);
    margin: 0 auto;
  }
}

.title-block {
  position: absolute;
  align-self: center;
  margin: -8rem auto 0 auto;
  background: #ffffff;
  padding: 52px 76px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 828px;
  z-index: 4;
}
@media (max-width: 1280px) {
  .title-block {
    width: 560px;
    max-width: unset;
    padding: 25px 30px;
    margin: -4rem auto 0 auto;
  }
}
@media (max-width: 760px) {
  .title-block {
    margin: 0rem auto 0 auto;
    width: 420px;
  }
}
@media (max-width: 560px) {
  .title-block {
    width: -moz-fit-content;
    width: fit-content;
    padding: 1rem 0 1rem 0;
  }
}
.title-block .subtitle-wrapper {
  position: relative;
  margin: 2.25rem auto 1.25rem auto;
  width: calc(94% - 4rem);
}
@media (max-width: 760px) {
  .title-block .subtitle-wrapper {
    padding: 0 2rem;
  }
}
@media (max-width: 560px) {
  .title-block .subtitle-wrapper {
    padding: 0 1rem;
    margin: 1rem auto;
  }
}
.title-block .subtitle-wrapper .line {
  position: absolute;
  top: 50%;
  height: 1px;
  background: #2e2e2e;
  z-index: 1;
  width: 100%;
  left: 0;
}
.title-block .subtitle-wrapper .subtitle {
  z-index: 2;
  color: #2e2e2e;
  background: #ffffff;
  padding: 0 1rem 0 1.5rem;
  font-size: 14px;
  letter-spacing: 8px;
  text-transform: uppercase;
  position: relative;
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
@media (max-width: 560px) {
  .title-block .subtitle-wrapper .subtitle {
    letter-spacing: 2px;
  }
}

h2 {
  font-family: "Noto Serif Display";
  font-weight: 200;
  font-size: min(58px, 3vw);
  line-height: min(58px, 3vw);
  text-transform: uppercase;
}
@media (max-width: 1280px) {
  h2 {
    font-size: 32px;
    line-height: 32px;
    font-weight: 300;
  }
}

h3 {
  font-family: "Noto Serif Display";
  font-weight: 200;
  font-size: min(32px, 2.2vw);
  line-height: min(34px, 2.2vw);
  text-transform: uppercase;
  margin: 0 0 1.5rem 0;
}
@media (max-width: 1280px) {
  h3 {
    font-size: 24px;
    line-height: 24px;
    font-weight: 300;
  }
}

.bigtitle {
  font-family: "Noto Serif Display";
  color: #2e2e2e;
  font-weight: 200;
  font-size: min(3.6vw, 58px);
  line-height: min(4vw, 78px);
  text-transform: uppercase;
  text-align: center;
}
@media (max-width: 1280px) {
  .bigtitle {
    padding: 0.5rem;
  }
}
@media (max-width: 760px) {
  .bigtitle {
    font-size: 32px;
    line-height: 40px;
  }
}

.smalltitle {
  font-family: "Noto Serif Display";
  font-weight: 200;
  font-size: min(58px, 3vw);
  line-height: min(58px, 3vw);
  text-transform: uppercase;
}
@media (max-width: 1280px) {
  .smalltitle {
    font-size: 32px;
    line-height: 38px;
    font-weight: 300;
  }
}

.homepage-sluzby {
  background: #f9f1e7;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.homepage-sluzby .circle {
  position: absolute;
  width: 40vw;
  height: 40vw;
  top: -10vw;
  left: -10vw;
  z-index: 1;
}
.homepage-sluzby .diva {
  position: relative;
  grid-column-end: -1;
  grid-row: span 4;
  justify-self: center;
}
@media (max-width: 860px) {
  .homepage-sluzby .diva {
    display: none;
  }
}
.homepage-sluzby .diva img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.homepage-sluzby .sluzby-grid {
  grid-template-columns: 1fr 1fr 1fr;
  padding: 10rem 0 3rem 0;
  grid-auto-flow: row dense;
  gap: 40px;
  display: grid;
  margin: 0 auto;
  max-width: 1380px;
  position: relative;
  z-index: 3;
}
@media (max-width: 1200px) {
  .homepage-sluzby .sluzby-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}
@media (max-width: 960px) {
  .homepage-sluzby .sluzby-grid {
    max-width: unset;
    width: 100%;
    gap: 1rem;
  }
}
.homepage-sluzby .sluzby-grid h2 {
  grid-row: span 1;
}
.homepage-sluzby .sluzby-grid .sluzba {
  display: flex;
  flex-direction: column;
  grid-column: span 1;
  grid-row: span 2;
  width: -moz-fit-content;
  width: fit-content;
  justify-content: start;
  align-items: start;
  gap: 20px;
  cursor: pointer;
}
@media (max-width: 760px) {
  .homepage-sluzby .sluzby-grid .sluzba {
    grid-row: span 1;
  }
}
@media (max-width: 460px) {
  .homepage-sluzby .sluzby-grid .sluzba {
    gap: 1rem;
    width: 160px;
  }
}
.homepage-sluzby .sluzby-grid .sluzba .sluzba-title {
  font-size: min(34px, 2.5vw);
  line-height: min(34px, 2.5vw);
  color: #2e2e2e;
}
@media (max-width: 560px) {
  .homepage-sluzby .sluzby-grid .sluzba .sluzba-title {
    font-size: 24px;
    line-height: 28px;
  }
}
@media (max-width: 460px) {
  .homepage-sluzby .sluzby-grid .sluzba .sluzba-title {
    font-size: 18px;
    line-height: 24px;
  }
}
.homepage-sluzby .sluzby-grid .sluzba .sluzba-title .arrow {
  margin: 0.5rem 0;
}
.homepage-sluzby .sluzby-grid .sluzba .sluzba-image {
  width: 100%;
  max-height: 340px;
  overflow: hidden;
}
@media (max-width: 960px) {
  .homepage-sluzby .sluzby-grid .sluzba .sluzba-image {
    max-height: unset;
    width: 320px;
    height: 100%;
  }
}
@media (max-width: 760px) {
  .homepage-sluzby .sluzby-grid .sluzba .sluzba-image {
    width: 100%;
  }
}
.homepage-sluzby .sluzby-grid .sluzba .sluzba-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.66s ease;
  filter: sepia(0.13) contrast(1.1);
}
.homepage-sluzby .sluzby-grid .sluzba:hover .sluzba-image img {
  filter: sepia(0) contrast(1);
}
.homepage-sluzby .sluzby-grid .sluzba:hover .sluzba-title .arrow {
  width: 150px;
}
.homepage-sluzby .sluzby-grid .sluzba.small {
  flex-direction: row;
  grid-row: span 1;
}
@media (max-width: 860px) {
  .homepage-sluzby .sluzby-grid .sluzba.small {
    flex-direction: column;
  }
}
.homepage-sluzby .sluzby-grid .sluzba.small .sluzba-image {
  width: 215px;
  height: 100%;
}
@media (max-width: 760px) {
  .homepage-sluzby .sluzby-grid .sluzba.small .sluzba-image {
    width: 100%;
  }
}
.homepage-sluzby .sluzby-grid .sluzba.small .sluzba-title {
  width: 180px;
  margin: auto 0 0 0;
  align-self: end;
}
@media (max-width: 860px) {
  .homepage-sluzby .sluzby-grid .sluzba.small .sluzba-title {
    align-self: start;
  }
}

.arrow {
  width: 120px;
  height: 15px;
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  transition: all 0.33s ease;
}
.arrow .arrow-hrline {
  position: absolute;
  height: 1px;
  width: 100%;
  transform-origin: right;
  background: #2e2e2e;
}
.arrow .arrow-vrline1 {
  height: 1px;
  width: 7px;
  transform-origin: right;
  background: #2e2e2e;
  position: absolute;
  right: 0;
  transform: rotate(45deg) translate(0px, 0px);
}
.arrow .arrow-vrline2 {
  height: 1px;
  width: 7px;
  transform-origin: right;
  background: #2e2e2e;
  position: absolute;
  right: 0;
  transform: rotate(-45deg) translate(0px, 0px);
}

.homepage-salony {
  padding: 2rem 0;
  background: #f9f1e7;
}
@media (max-width: 760px) {
  .homepage-salony {
    padding: 0 0 2rem 0;
  }
}
.homepage-salony .salony-wrapper {
  display: flex;
  align-items: start;
  justify-content: space-between;
  position: relative;
}
@media (max-width: 1280px) {
  .homepage-salony .salony-wrapper {
    flex-direction: column;
    justify-content: center;
    gap: 2rem;
  }
}
.homepage-salony .salony-wrapper .line {
  height: 1px;
  background: #e6d5bf;
  width: 100%;
  top: 13rem;
  z-index: 1;
  position: absolute;
}
.homepage-salony .salony-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  position: relative;
  z-index: 2;
}
@media (max-width: 1280px) {
  .homepage-salony .salony-list {
    margin: 0 auto;
  }
}
@media (max-width: 560px) {
  .homepage-salony .salony-list {
    grid-template-columns: 1fr;
  }
}
.homepage-salony .salony-list .salon {
  position: relative;
  width: min(760px, 38vw);
  height: min(460px, 24vw);
  overflow: hidden;
  transition: all 0.66s ease;
}
@media (max-width: 1440px) {
  .homepage-salony .salony-list .salon {
    overflow: unset;
  }
}
@media (max-width: 960px) {
  .homepage-salony .salony-list .salon {
    width: 300px;
    height: 240px;
  }
}
@media (max-width: 1100px) {
  .homepage-salony .salony-list .salon.wide {
    grid-column: 1/3;
    width: 80vw;
    height: 320px;
  }
}
.homepage-salony .salony-list .salon .bg-img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  filter: sepia(0.13) contrast(1.1);
}
.homepage-salony .salony-list .salon .bg-img.map {
  filter: unset;
}
.homepage-salony .salony-list .salon .street-icon {
  position: absolute;
  bottom: 120px;
  left: 40px;
  padding: 12px;
  border-radius: 11px;
  box-shadow: rgba(159, 149, 135, 0.6) 0px 4px 10px;
  z-index: 1;
  background: #fff;
  font-size: 24px;
  font-weight: 500;
}
@media (max-width: 1440px) {
  .homepage-salony .salony-list .salon .street-icon {
    transform: scale(0.6);
  }
}
.homepage-salony .salony-list .salon .street-icon img {
  position: absolute;
  right: -190px;
  bottom: -90px;
  width: 240px;
  height: 240px;
  -o-object-fit: contain;
     object-fit: contain;
}
.homepage-salony .salony-list .salon .salon-label {
  background: #ffffff;
  font-size: 16px;
  padding: 1.2rem;
  position: absolute;
  z-index: 2;
  right: 2rem;
  bottom: 2rem;
}
@media (max-width: 1440px) {
  .homepage-salony .salony-list .salon .salon-label {
    bottom: -1rem;
    right: -1rem;
    width: 220px;
  }
}
@media (max-width: 1280px) {
  .homepage-salony .salony-list .salon .salon-label {
    bottom: -1rem;
    right: -1rem;
    width: 190px;
  }
}
@media (max-width: 560px) {
  .homepage-salony .salony-list .salon .salon-label {
    width: 160px;
  }
}
.homepage-salony .salony-list .salon .salon-label .salon-title {
  font-weight: 500;
  text-transform: uppercase;
  font-size: 22px;
}
@media (max-width: 960px) {
  .homepage-salony .salony-list .salon .salon-label .salon-title {
    font-size: 18px;
  }
}
@media (max-width: 760px) {
  .homepage-salony .salony-list .salon .salon-label .salon-description p {
    font-size: 12px;
    margin: 0.5rem 0;
  }
}
.homepage-salony .salony-list .salon .salon-label .tel {
  margin: 0.5rem 0 0 0;
}
.homepage-salony .salony-list .salon .salon-label .btn {
  width: -moz-fit-content;
  width: fit-content;
  margin: 1rem 0 0 0;
  padding: 0.5rem 1.5rem;
}

.kontakt-section {
  width: 100%;
  background: #255ba6;
  padding: 0 0 0 0;
  border-bottom: 1px solid #fff;
  position: relative;
  background: #e6d5bf;
  margin: -8rem 0 0 0;
}
.kontakt-section .kontakt-wrapper {
  display: flex;
  align-items: start;
  gap: 3rem;
  flex-direction: column;
  justify-content: center;
  padding: 24rem 0 2rem 0;
}
@media (max-width: 960px) {
  .kontakt-section .kontakt-wrapper {
    padding: 16rem 0 2rem 0;
  }
}
.kontakt-section .title-decor {
  z-index: 1;
}
.kontakt-section .title-decor .title {
  color: #fff;
}
.kontakt-section .title-decor .decor-line .stripes {
  border: 1px solid #fff;
  background-image: linear-gradient(107deg, #fff 4.55%, transparent 4.55%, transparent 50%, #fff 50%, #fff 54.55%, transparent 54.55%, transparent 100%);
  background-size: 11.5px 37.62px;
}
.kontakt-section .title-decor .decor-line .line {
  background: #fff;
}
.kontakt-section .bg-marble {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.kontakt-section .bg-marble img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 1;
}

.form-container {
  width: 900px;
  z-index: 5;
  align-self: center;
  margin: 1rem auto;
  position: relative;
  top: -1rem;
}
@media (max-width: 1280px) {
  .form-container {
    width: 700px;
    top: 1rem;
    margin: 2rem auto;
  }
}
@media (max-width: 720px) {
  .form-container {
    width: 100%;
  }
}
@media (max-width: 560px) {
  .form-container {
    top: 2rem;
  }
}
.form-container .agree {
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.form-container .form-row {
  display: flex;
  gap: 1rem;
  width: 100%;
  position: relative;
  margin: 0.75rem 0 0 0;
}
.form-container .box {
  width: 13px;
  height: 13px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #2e2e2e;
  top: 0.25rem;
  content: " ";
}
.form-container .box .box-inside {
  width: 9px;
  height: 9px;
  position: absolute;
  background: transparent;
  transition: all 0.66s ease;
}
.form-container label {
  font-size: 14px;
  line-height: 17px;
  cursor: pointer;
  width: calc(100% - 3rem);
}
@media (max-width: 660px) {
  .form-container label {
    font-size: 12px;
  }
}
.form-container .agree:checked + .box > .box-inside {
  background: #2e2e2e;
}
.form-container .line {
  width: 100%;
  position: relative;
}
.form-container .line .label {
  margin: 0 0 0.5rem 1rem;
  font-weight: 500;
}
.form-container input {
  padding: 1rem 1rem;
  width: 100%;
  min-height: 40px;
  background: #f9f1e7;
  position: relative;
  color: #2e2e2e;
  font-size: 18px;
  line-height: 24px;
  margin: 0 0 1.5rem 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  outline: none;
  z-index: 1;
  border: 1px solid #e6d5bf;
  text-align: center;
}
@media (max-width: 660px) {
  .form-container input {
    display: block;
  }
}
.form-container textarea {
  padding: 1rem 1rem;
  width: 100%;
  position: relative;
  min-height: 250px;
  color: #2e2e2e;
  font-size: 18px;
  line-height: 24px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  outline: none;
  z-index: 1;
  background: #f9f1e7;
  border: 1px solid #e6d5bf;
  text-align: center;
}
@media (max-width: 760px) {
  .form-container textarea {
    min-height: 160px;
  }
}
.form-container .line-decor {
  position: absolute;
  left: 0;
  height: 70px;
  width: 10px;
  z-index: 2;
  background-image: linear-gradient(30deg, #ffffff 8.33%, transparent 8.33%, transparent 50%, #ffffff 50%, #ffffff 58.33%, transparent 58.33%, transparent 100%);
  background-size: 12px 6.93px;
  border: 1px solid #fff;
}
.form-container ::-moz-placeholder {
  color: #2e2e2e;
  opacity: 0.75;
}
.form-container ::placeholder {
  color: #2e2e2e;
  opacity: 0.75;
}
.form-container input:-webkit-autofill {
  background: #f9f1e7;
}
.form-container input:autofill {
  background: #f9f1e7;
}
.form-container input:-webkit-autofill:active {
  background: #f9f1e7;
}
.form-container .btn {
  width: 200px;
  padding: 0.75rem 1rem;
  letter-spacing: 1px;
  align-self: center;
  margin: 1rem auto 0 auto;
  text-align: center;
}

footer {
  padding: 2rem 0 0 0;
  background: #fff;
}
footer .footer-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
  padding: 0 0 1rem 0;
}
footer .col {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
}
footer .footer-link {
  padding: 0 0 1rem 0;
  text-transform: uppercase;
  font-size: 18px;
}
footer .footer-title {
  font-family: "Noto Serif Display";
  font-size: 24px;
  text-decoration: underline;
  margin: 0 0 1rem 0;
}
footer .salon {
  margin: 0 0 1.25rem 0;
}
footer .salon .salon-title {
  text-transform: uppercase;
}
footer .salon .salon-description {
  margin: 0.5rem 0 0.5rem 0;
}
footer .salon .salon-description p {
  margin: 0;
}
footer a {
  color: #2e2e2e;
}

.otv-table .otv-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  min-width: 220px;
  max-width: 320px;
  margin: 0 0 0.25rem 0;
}

.creat {
  border-top: 1px solid #2e2e2e;
  width: 100%;
  padding: 1rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}

/* The container must be positioned relative: */
.custom-select {
  position: relative;
  margin: 0 0 1.5rem 0 !important;
  text-align: center;
  border: 1px solid #e6d5bf;
}

.custom-select select {
  display: none; /*hide original SELECT element: */
}

.select-selected {
  background-color: #f9f1e7;
}

/* Style the arrow inside the select element: */
.select-selected:after {
  position: absolute;
  content: "";
  top: 1.25rem;
  right: 1rem;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #2e2e2e transparent transparent transparent;
  opacity: 0.75;
}

/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
  border-color: transparent transparent #2e2e2e transparent;
  top: 0.8rem;
}

/* style the items (options), including the selected item: */
.select-items div,
.select-selected {
  color: #2e2e2e;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
}

.select-selected {
  padding: 1rem;
}

/* Style items (options): */
.select-items {
  position: absolute;
  background-color: #f9f1e7;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/* Hide the items when the select box is closed: */
.select-hide {
  display: none;
}

.select-items div:hover,
.same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}

.sluzby-page {
  background: #f9f1e7;
  width: 100%;
}
.sluzby-page .sluzby-page-text {
  max-width: 860px;
  font-size: 18px;
}
.sluzby-page .smalltitle {
  padding: 1rem 0;
}

.sluzby-grid {
  grid-template-columns: 1fr 1fr 1fr 1fr;
  padding: 3rem 0 3rem 0;
  grid-auto-flow: row dense;
  gap: 40px;
  display: grid;
  margin: 0 auto;
  max-width: 100%;
  position: relative;
  z-index: 3;
}
@media (max-width: 1860px) {
  .sluzby-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media (max-width: 1380px) {
  .sluzby-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}
@media (max-width: 960px) {
  .sluzby-grid {
    max-width: unset;
    width: 100%;
    gap: 1rem;
  }
}
.sluzby-grid h2 {
  grid-row: span 1;
}
.sluzby-grid .sluzba {
  display: flex;
  flex-direction: column;
  grid-column: span 1;
  grid-row: span 2;
  width: -moz-fit-content;
  width: fit-content;
  justify-content: start;
  align-items: start;
  gap: 20px;
  cursor: pointer;
}
@media (max-width: 760px) {
  .sluzby-grid .sluzba {
    grid-row: span 1;
  }
}
@media (max-width: 460px) {
  .sluzby-grid .sluzba {
    gap: 1rem;
    width: 160px;
  }
}
.sluzby-grid .sluzba .sluzba-title {
  font-size: min(34px, 2.5vw);
  line-height: min(34px, 2.5vw);
  color: #2e2e2e;
}
@media (max-width: 560px) {
  .sluzby-grid .sluzba .sluzba-title {
    font-size: 24px;
    line-height: 28px;
  }
}
@media (max-width: 460px) {
  .sluzby-grid .sluzba .sluzba-title {
    font-size: 18px;
    line-height: 24px;
  }
}
.sluzby-grid .sluzba .sluzba-title .arrow {
  margin: 0.5rem 0;
}
.sluzby-grid .sluzba .sluzba-image {
  width: 100%;
  max-height: 340px;
  overflow: hidden;
}
@media (max-width: 960px) {
  .sluzby-grid .sluzba .sluzba-image {
    max-height: unset;
    width: 320px;
    height: 100%;
  }
}
@media (max-width: 760px) {
  .sluzby-grid .sluzba .sluzba-image {
    width: 100%;
  }
}
.sluzby-grid .sluzba .sluzba-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: all 0.66s ease;
  filter: sepia(0.13) contrast(1.1);
}
.sluzby-grid .sluzba:hover .sluzba-image img {
  filter: sepia(0) contrast(1);
}
.sluzby-grid .sluzba:hover .sluzba-title .arrow {
  width: 150px;
}
.sluzby-grid .sluzba.small {
  flex-direction: row;
  grid-row: span 1;
}
@media (max-width: 860px) {
  .sluzby-grid .sluzba.small {
    flex-direction: column;
  }
}
.sluzby-grid .sluzba.small .sluzba-image {
  width: 215px;
  height: 100%;
}
@media (max-width: 760px) {
  .sluzby-grid .sluzba.small .sluzba-image {
    width: 100%;
  }
}
.sluzby-grid .sluzba.small .sluzba-title {
  width: 180px;
  margin: auto 0 0 0;
  align-self: end;
}
@media (max-width: 860px) {
  .sluzby-grid .sluzba.small .sluzba-title {
    align-self: start;
  }
}

strong {
  font-weight: 600;
}

.universal-page {
  padding: 2rem 0;
  width: 100%;
  background: #f9f1e7;
}
.universal-page .universal-page-inner-wrapper {
  max-width: 1060px;
  margin: 0 auto;
}

.sluzba-page {
  background: #f9f1e7;
  width: 100%;
  padding: 5rem 0 2rem 0;
}
.sluzba-page .sluzba-page-inner-wrapper {
  max-width: 1060px;
  margin: 0 auto;
  padding: 4rem 0 2rem 0;
}
.sluzba-page .sluzba-description {
  display: flex;
  gap: 3rem;
  font-size: 18px;
  line-height: 24px;
  justify-content: space-between;
}
@media (max-width: 960px) {
  .sluzba-page .sluzba-description {
    flex-direction: column;
  }
}
.sluzba-page .description {
  padding: 0 0 2rem 0;
}
.sluzba-page .left {
  max-width: 48%;
}
@media (max-width: 960px) {
  .sluzba-page .left {
    max-width: 100%;
  }
}
.sluzba-page .right {
  max-width: 48%;
}
@media (max-width: 960px) {
  .sluzba-page .right {
    max-width: 100%;
  }
}
.sluzba-page ol {
  margin: 0 0 1.5rem 0;
  padding: 0 0 0 1.5rem;
}
.sluzba-page ol li {
  margin: 0 0 1rem 0;
}
.sluzba-page p {
  margin: 0 0 1rem 0;
}
@media (max-width: 560px) {
  .sluzba-page p {
    margin: 0 0 1rem 0;
  }
}
.sluzba-page .sluzba-smalltitle {
  font-size: 32px;
  margin: 0 0 2.5rem 0;
}
.sluzba-page ::marker {
  font-weight: 600;
}

.vysledky-container {
  width: calc(100% - 80px);
  margin: 3rem auto 3rem auto;
}
.vysledky-container .vysledky-swiper {
  width: min(520px, 30vw);
  margin: 0 auto;
}
@media (max-width: 560px) {
  .vysledky-container .vysledky-swiper {
    width: 90%;
    height: 400px;
  }
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide {
  opacity: 0.5;
  transition: all 0.66s ease;
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container {
  position: relative;
  width: min(520px, 30vw);
  height: min(760px, 40vw);
}
@media (max-width: 560px) {
  .vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container {
    width: 100%;
    height: 400px;
  }
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .beforeimage,
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .afterimage {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 90%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: left;
     object-position: left;
  transition: all 0.86s ease;
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .afterimage {
  z-index: 1;
  left: unset;
  right: 0;
  -o-object-position: right;
     object-position: right;
  width: 100%;
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .line {
  z-index: 3;
  position: absolute;
  width: 20px;
  background: transparent;
  height: min(760px, 40vw);
  left: calc(90% - 10px);
  transition: all 0.86s ease;
  cursor: grab;
}
@media (max-width: 560px) {
  .vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .line {
    height: 400px;
  }
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .line .divider {
  position: absolute;
  width: 2px;
  left: 50%;
  height: 100%;
  background: #fff;
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .beforelabel,
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .afterlabel {
  position: absolute;
  background: #2e2e2e;
  color: #fff;
  font-size: 18px;
  line-height: 18px;
  padding: 0rem 0.25rem;
  top: 45%;
  z-index: 4;
  left: 1rem;
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide .image-container .afterlabel {
  right: 1rem;
  left: unset;
}
.vysledky-container .vysledky-swiper .swiper-wrapper .swiper-slide-active {
  opacity: 1;
}

.kontra-container .kontra-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin: 2rem 0 1rem 0;
}
@media (max-width: 960px) {
  .kontra-container .kontra-wrapper {
    flex-direction: column;
    width: 100%;
  }
}
.kontra-container .kontra-col {
  position: relative;
  width: 480px;
}
@media (max-width: 960px) {
  .kontra-container .kontra-col {
    width: 100%;
  }
}
@media (max-width: 560px) {
  .kontra-container .kontra-col {
    padding: 2rem 0 0 0;
  }
}
.kontra-container .kontra-col .kontra-text {
  padding: 1rem 0 1rem 0;
  font-size: 16px;
}
.kontra-container .kontra-col .kontra-text p {
  margin: 0;
}
.kontra-container .kontra-col .kontra-intro-text {
  padding: 2rem 0;
}
.kontra-container .kontra-col .kontra {
  padding: 1.75rem;
  background: #fff;
  transition: all 0.66s ease;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 2rem 0;
}
@media (max-width: 560px) {
  .kontra-container .kontra-col .kontra {
    flex-direction: column;
    gap: 1rem;
    padding: 1.1rem;
  }
}
.kontra-container .kontra-col .kontra-title {
  text-decoration: underline;
  text-transform: uppercase;
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 0rem 0;
}
.kontra-container .kontra-col .kontra-alert-text {
  color: #ff4f4f;
  height: 0;
  visibility: hidden;
  width: 100%;
  opacity: 0;
  transition: all 0.26s ease;
  position: relative;
}
.kontra-container .kontra-col .kontra-alert-text a {
  color: #ff4f4f;
}
.kontra-container .kontra-col .kontra-alert-text.alert {
  visibility: visible;
  opacity: 1;
  height: -moz-fit-content;
  height: fit-content;
}
.kontra-container .kontra-col fieldset {
  border: unset;
  padding: 0rem;
  margin: unset;
  display: flex;
  gap: 1.25rem;
  justify-content: space-between;
  align-self: start;
  margin: 2rem 0 0 0;
}
@media (max-width: 560px) {
  .kontra-container .kontra-col fieldset {
    margin: 0.5rem 0 0 0;
  }
}
.kontra-container .kontra-col fieldset input {
  display: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 0;
  height: 0;
}
.kontra-container .kontra-col .yes,
.kontra-container .kontra-col .no {
  width: 72px;
  height: 36px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: rgba(159, 149, 135, 0.6) 0px 4px 10px;
  transition: all 0.66s ease;
  cursor: pointer;
}
.kontra-container .kontra-col .no {
  background: #5bd06e;
}
.kontra-container .kontra-col .yes {
  background: #ff4f4f;
}
.kontra-container .kontra-col .notselected {
  opacity: 0.5;
  pointer-events: none;
}
.kontra-container .form-container {
  top: unset;
  padding: 0 0 3rem 0;
  max-width: 480px;
}
@media (max-width: 1280px) {
  .kontra-container .form-container {
    max-width: 480px;
  }
}
@media (max-width: 560px) {
  .kontra-container .form-container {
    width: 96%;
  }
}
.kontra-container .form-container input {
  background: #fff;
  text-align: left;
}
.kontra-container .form-container textarea {
  background: #fff;
  text-align: left;
}
.kontra-container .form-container .btn {
  font-size: 16px;
  margin: 2rem 0 0 auto;
  padding: 1.25rem 3.75rem;
  letter-spacing: unset;
  text-align: center;
  width: unset;
}
@media (max-width: 1280px) {
  .kontra-container .form-container .btn {
    padding: 0.5rem 1.25rem;
    margin: 2rem auto 0 auto;
  }
}
.kontra-container .form-container ::-moz-placeholder {
  color: #e6d5bf;
}
.kontra-container .form-container ::placeholder {
  color: #e6d5bf;
}
.kontra-container .overlay {
  position: absolute;
  overflow: hidden;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 7;
}
.kontra-container .overlay .overlay-blur {
  background: transparent;
  filter: blur(10px);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-backdrop-filter: blur(2px);
          backdrop-filter: blur(2px);
}
.kontra-container .overlay .overlay-text {
  display: flex;
  font-size: 48px;
  text-transform: uppercase;
  z-index: 9;
  position: relative;
  text-align: center;
}
@media (max-width: 760px) {
  .kontra-container .overlay .overlay-text {
    font-size: 28px;
    line-height: 32px;
  }
}

.salon-page {
  background: #f9f1e7;
  padding: 8rem 0 2rem 0;
  font-size: 18px;
}
@media (max-width: 760px) {
  .salon-page {
    font-size: 14px;
  }
}
.salon-page p {
  font-size: 18px;
  margin: 0;
}
@media (max-width: 760px) {
  .salon-page p {
    font-size: 14px;
  }
}
.salon-page .salon-wrapper {
  display: flex;
  gap: 40px;
}
@media (max-width: 1080px) {
  .salon-page .salon-wrapper {
    flex-direction: column;
  }
}
.salon-page .salon-info-wrapper {
  display: flex;
  flex-direction: column;
  max-width: 860px;
}
.salon-page .smalltitle {
  margin: 0 0 1.5rem 0;
}
.salon-page .salon-info {
  display: flex;
  padding: 0 0 2.5rem 0;
  border-bottom: 1px solid #2e2e2e;
  max-width: 860px;
  justify-content: start;
  align-items: start;
  gap: 1.5rem;
}
@media (max-width: 560px) {
  .salon-page .salon-info {
    flex-direction: column;
    padding: 0 0 1rem 0;
  }
}
@media (max-width: 560px) {
  .salon-page .sluzby-grid {
    padding: 1.5rem 0 3rem 0;
  }
}
.salon-page .divide-line {
  height: 160px;
  margin: 2rem 2rem 0 2rem;
  width: 1px;
  background: #2e2e2e;
}
@media (max-width: 560px) {
  .salon-page .divide-line {
    display: none;
  }
}
.salon-page .map-container {
  width: min(920px, 45vw);
  height: min(520px, 27vw);
  -o-object-fit: contain;
     object-fit: contain;
  overflow: hidden;
  filter: grayscale(1) sepia(0.13);
}
@media (max-width: 1080px) {
  .salon-page .map-container {
    width: 100%;
    height: 280px;
  }
}
@media (max-width: 560px) {
  .salon-page .map-container {
    height: 240px;
  }
}
.salon-page .map {
  width: min(920px, 46vw);
  height: min(520px, 27vw);
  -o-object-fit: contain;
     object-fit: contain;
}
@media (max-width: 1080px) {
  .salon-page .map {
    width: 100%;
    height: 280px;
  }
}
@media (max-width: 560px) {
  .salon-page .map {
    height: 240px;
  }
}
.salon-page .salon-description {
  padding: 3rem 0 2rem 0;
}
@media (max-width: 560px) {
  .salon-page .salon-description {
    padding: 1rem 0;
  }
}
.salon-page .otv-bottom {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 2rem;
}
@media (max-width: 560px) {
  .salon-page .otv-bottom {
    flex-direction: column;
  }
}
.salon-page .otv-bottom .btn {
  padding: 0.65rem 1.75rem;
}
@media (max-width: 560px) {
  .salon-page .otv-bottom .btn {
    padding: 0.5rem 1.2rem;
  }
}
.salon-page .salon-sluzby {
  padding: 4rem 0 2rem 0;
}
@media (max-width: 560px) {
  .salon-page .salon-sluzby {
    padding: 2rem 0 0 0;
  }
}
.salon-page .galeria {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-auto-flow: row dense;
  gap: 40px;
  margin: 1rem auto;
}
@media (max-width: 1280px) {
  .salon-page .galeria {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: unset;
    grid-auto-rows: 1fr;
  }
}
@media (max-width: 560px) {
  .salon-page .galeria {
    gap: 1rem;
    grid-template-columns: repeat(2, 1fr);
  }
}
.salon-page .big {
  grid-column: span 2;
  grid-row: span 2;
}
@media (max-width: 560px) {
  .salon-page .big {
    grid-column: span 1;
    grid-row: span 1;
  }
}
.salon-page .tall {
  grid-column: span 1;
  grid-row: span 2;
}
.salon-page .galeria-label {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  grid-column-start: 3;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 2;
  width: 100%;
  height: 100%;
}
@media (max-width: 560px) {
  .salon-page .galeria-label {
    grid-column-start: 2;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 1;
  }
}
.salon-page .galeria-item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.mid-title {
  font-size: 24px;
  line-height: 30px;
  font-weight: 500;
  text-transform: uppercase;
  margin: 0 0 0.9rem 0;
}

.info-item {
  color: #2e2e2e;
  font-size: min(48px, 2.2vw);
}
@media (max-width: 760px) {
  .info-item {
    font-size: 24px;
  }
}

.kontakt-page {
  background: #f9f1e7;
  padding: 2rem 0;
  font-size: 18px;
}
@media (max-width: 760px) {
  .kontakt-page {
    padding: 0 0 2rem 0;
  }
}
.kontakt-page .select-selected {
  background-color: #fff;
}
.kontakt-page .select-items {
  background-color: #fff;
}
.kontakt-page .fade-overlay {
  position: absolute;
  opacity: 0.35;
  background: #f9f1e7;
  z-index: 2;
  width: 50%;
  height: 100%;
  right: 0;
  top: 0;
}
@media (max-width: 1280px) {
  .kontakt-page .fade-overlay {
    display: none;
  }
}
.kontakt-page p {
  font-size: 18px;
  margin: 1rem 0;
}
.kontakt-page .map-container {
  width: min(860px, 45vw);
  height: min(500px, 27vw);
  -o-object-fit: contain;
     object-fit: contain;
  overflow: hidden;
  filter: grayscale(1) sepia(0.13);
}
@media (max-width: 1080px) {
  .kontakt-page .map-container {
    width: 100%;
    height: 280px;
  }
}
@media (max-width: 560px) {
  .kontakt-page .map-container {
    height: 240px;
  }
}
.kontakt-page .map {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.kontakt-page .kontakt-top-wrapper {
  position: relative;
  width: 100%;
  padding: 3rem 0;
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
  align-items: center;
  overflow: hidden;
}
@media (max-width: 1280px) {
  .kontakt-page .kontakt-top-wrapper {
    flex-direction: column;
    gap: 3rem;
    justify-content: start;
    padding: 3rem 0;
  }
}
.kontakt-page .kontakt-top-wrapper .bg-marble {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 1;
}
.kontakt-page .kontakt-top-wrapper .bg-marble img {
  opacity: 0.9;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.kontakt-page .kontakt-top-wrapper .col {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 2;
  width: 40vw;
}
@media (max-width: 1280px) {
  .kontakt-page .kontakt-top-wrapper .col {
    width: 100%;
  }
}
.kontakt-page .kontakt-top-wrapper .col .form-container {
  max-width: 600px;
  width: unset;
  top: unset;
  margin: 0 auto;
}
@media (max-width: 1280px) {
  .kontakt-page .kontakt-top-wrapper .col .form-container {
    max-width: 560px;
  }
}
@media (max-width: 560px) {
  .kontakt-page .kontakt-top-wrapper .col .form-container {
    width: 96%;
  }
}
.kontakt-page .kontakt-top-wrapper .col .form-container input {
  background: #fff;
  text-align: left;
}
.kontakt-page .kontakt-top-wrapper .col .form-container textarea {
  background: #fff;
  text-align: left;
}
.kontakt-page .kontakt-top-wrapper .col .form-container .btn {
  font-size: 16px;
  margin: 2rem 0 0 auto;
  padding: 1.35rem 1rem;
  letter-spacing: unset;
  width: 240px;
}
@media (max-width: 1280px) {
  .kontakt-page .kontakt-top-wrapper .col .form-container .btn {
    padding: 0.5rem 1.25rem;
    margin: 2rem auto 0 auto;
    width: 180px;
  }
}
.kontakt-page .kontakt-top-wrapper .col .form-container ::-moz-placeholder {
  color: #e6d5bf;
}
.kontakt-page .kontakt-top-wrapper .col .form-container ::placeholder {
  color: #e6d5bf;
}
.kontakt-page .kontakt-top-wrapper .col .kontakt-box {
  border: 2px solid #2e2e2e;
  display: flex;
  justify-content: center;
  align-items: start;
  padding: min(2.5vw, 4rem) min(2.5rem, 1.5vw);
  gap: 2rem;
}
@media (max-width: 1280px) {
  .kontakt-page .kontakt-top-wrapper .col .kontakt-box {
    padding: 2rem;
  }
}
@media (max-width: 660px) {
  .kontakt-page .kontakt-top-wrapper .col .kontakt-box {
    flex-direction: column;
  }
}
.kontakt-page .kontakt-top-wrapper .col .kontakt-item {
  display: flex;
  flex-direction: column;
}
.kontakt-page .smalltitle {
  margin: 0 0 1rem 0;
}
.kontakt-page .info-item {
  font-size: 24px;
}
.kontakt-page h3 {
  font-size: 22px;
  font-weight: 500;
}
.kontakt-page .salon-list {
  width: 100%;
  display: flex;
  justify-content: space-around;
  align-items: start;
  margin: 2rem 0 0 0;
}
@media (max-width: 1280px) {
  .kontakt-page .salon-list {
    flex-direction: column;
  }
}
.kontakt-page .mid-title {
  font-size: 32px;
  font-weight: unset;
}
@media (max-width: 1440px) {
  .kontakt-page .mid-title {
    font-size: 24px;
  }
}
.kontakt-page .address-text {
  padding: 1.6rem 0 0 0;
}
@media (max-width: 560px) {
  .kontakt-page .address-text {
    padding: 0.75rem 0;
  }
}
.kontakt-page .salon-info-wrapper {
  width: min(45vw, 860px);
  padding: 2rem 0 0 0;
}
@media (max-width: 1280px) {
  .kontakt-page .salon-info-wrapper {
    width: 100%;
  }
}
.kontakt-page .salon-info-wrapper h2 {
  font-size: 58px;
  line-height: 78px;
}
@media (max-width: 1440px) {
  .kontakt-page .salon-info-wrapper h2 {
    font-size: 48px;
    line-height: 68px;
  }
}
@media (max-width: 560px) {
  .kontakt-page .salon-info-wrapper h2 {
    font-size: 32px;
    line-height: 40px;
    margin: 0 0 1rem 0;
  }
}
.kontakt-page .salon-info-wrapper .salon-info {
  display: flex;
  padding: 2.5rem 0 2.5rem 0;
  border-bottom: 1px solid #e6d5bf;
  max-width: 860px;
  justify-content: space-evenly;
  align-items: start;
  gap: 1.5rem;
}
@media (max-width: 860px) {
  .kontakt-page .salon-info-wrapper .salon-info {
    flex-wrap: wrap;
  }
}
@media (max-width: 560px) {
  .kontakt-page .salon-info-wrapper .salon-info {
    flex-direction: column;
    padding: 0 0 1rem 0;
  }
}
.kontakt-page .salon-info-wrapper .salon-info .btn {
  width: -moz-fit-content;
  width: fit-content;
  margin: 2rem auto 0 0;
  font-size: 16px;
  padding: 0.6rem 1.75rem;
}
.kontakt-page .salon-info-wrapper .salon-info .otv-bottom {
  padding: 1.6rem 0 0 0;
  font-size: 22px;
}
@media (max-width: 560px) {
  .kontakt-page .salon-info-wrapper .salon-info .otv-bottom {
    padding: 0.75rem 0 0 0;
  }
}
.kontakt-page .salon-info-wrapper .salon-info .otv-bottom .otv-row {
  flex-direction: column;
  align-items: start;
  gap: 0.25rem;
}
.kontakt-page .salon-info-wrapper .salon-info .otv-bottom .otv-row div:nth-child(2) {
  font-weight: 600;
}
.kontakt-page .salon-info-wrapper .salon-minigallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-flow: column dense;
  padding: 2rem 0;
  width: 100%;
  gap: 20px;
}
@media (max-width: 560px) {
  .kontakt-page .salon-info-wrapper .salon-minigallery {
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: row;
  }
}
.kontakt-page .salon-info-wrapper .salon-minigallery .big {
  grid-column: span 2;
  grid-row: span 2;
}
@media (max-width: 560px) {
  .kontakt-page .salon-info-wrapper .salon-minigallery .big {
    grid-column: span 1;
    grid-row: span 1;
  }
}
.kontakt-page .salon-info-wrapper .salon-minigallery .tall {
  grid-column: span 1;
  grid-row: span 2;
}
@media (max-width: 560px) {
  .kontakt-page .salon-info-wrapper .salon-minigallery .tall {
    grid-column: span 1;
    grid-row: span 1;
  }
}
.kontakt-page .salon-info-wrapper .salon-minigallery .gal-item {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  cursor: pointer;
}
.kontakt-page .salon-info-wrapper .address {
  max-width: 220px;
}
.kontakt-page .salon-info-wrapper .salon-description {
  display: flex;
  flex-direction: column;
  padding: 2rem 0 1rem 0;
  border-bottom: 1px solid #e6d5bf;
}
.kontakt-page .salon-info-wrapper .salon-description .mid-title {
  font-size: 24px;
  margin: 0;
}
.kontakt-page .salon-info-wrapper .divide-line {
  background: #e6d5bf;
  margin: 0 auto;
}
.kontakt-page .divide-line {
  height: 160px;
  width: 1px;
  background: #2e2e2e;
  margin: min(2rem, 1.3vw) min(2rem, 1.3vw);
}
@media (max-width: 660px) {
  .kontakt-page .divide-line {
    display: none;
  }
}
.kontakt-page .big-divide-line {
  position: relative;
  width: 1px;
  background: #2e2e2e;
  align-self: stretch;
  margin: 3rem auto;
}
@media (max-width: 1280px) {
  .kontakt-page .big-divide-line {
    display: none;
  }
}

/* mobile menu */
@media (max-width: 560px) {
  body {
    height: 100vh;
  }
}
body.open {
  overflow: hidden;
}

.wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  padding: 1em;
  overflow: hidden;
  border-radius: 3px;
  background-color: #e6d5bf;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.menu-icon-toggle {
  display: none;
  width: 30px;
  height: 30px;
  position: absolute;
  z-index: 999;
  top: 1rem;
  right: 1rem;
}
@media (max-width: 960px) {
  .menu-icon-toggle {
    display: block;
  }
}
.home .menu-icon-toggle {
  top: 50px;
  position: absolute;
  right: 20px;
  top: 20px;
}
.menu-icon-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  top: 50%;
  background-color: #fff;
  transform: translate(0, -50%);
  transition: opacity 0.3s 0.3s;
}
.home:not(.open) .menu-icon-toggle span {
  background-color: #fff;
}
.menu-icon-toggle::before, .menu-icon-toggle::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  position: absolute;
  background-color: #fff;
  transition: transform 0.3s, top 0.3s 0.3s, bottom 0.3s 0.3s;
}
.menu-icon-toggle::before {
  top: 6px;
}
.menu-icon-toggle::after {
  bottom: 6px;
}
.open .menu-icon-toggle span {
  opacity: 0;
  transition: opacity 0.3s;
}
.open .menu-icon-toggle::before, .open .menu-icon-toggle::after {
  background-color: #e6d5bf;
}
.open .menu-icon-toggle::before {
  top: calc(50% - 1px);
  transform: rotate(45deg);
}
.open .menu-icon-toggle::after {
  bottom: calc(50% - 1px);
  transform: rotate(-45deg);
}
.open .menu-icon-toggle::before, .open .menu-icon-toggle::after {
  transition: top 0.3s, bottom 0.3s, transform 0.3s 0.3s;
}

.menu-background {
  visibility: hidden;
  width: 300%;
  height: 100vh;
  position: absolute;
  left: -130%;
  background-color: #e6d5bf;
  transition: background-position 0.5s, transform 0.5s 0.5s, visibility 0.5s 1s;
  z-index: 998;
}
.open .menu-background {
  visibility: visible;
  transition: background-position 0.5s, transform 0.5s 0.5s;
}
.menu-background.top {
  transform: rotate(-45deg) translateY(-150%);
  background: linear-gradient(to top, #e6d5bf 50%, #fff 50%);
  background-size: 100% 200%;
  background-position: -100% 100%;
}
.open .menu-background.top {
  transform: rotate(-45deg) translateY(-49%);
  background-position: 0 0;
}
.menu-background.middle {
  transform: rotate(-45deg) translateY(50%) scaleY(0);
  background: #fff;
}
.open .menu-background.middle {
  transform: rotate(-45deg) translateY(50%) scaleY(1);
}
.menu-background.bottom {
  transform: rotate(-45deg) translateY(250%);
  background: linear-gradient(to bottom, #fff 50%, #e6d5bf 50%);
  background-size: 100% 200%;
  background-position: 0 -100%;
}
.open .menu-background.bottom {
  transform: rotate(-45deg) translateY(149%);
  background-position: 0 0;
}

.menu {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
  list-style-type: none;
  margin: 0;
  padding: 0;
  z-index: 99999;
}
.open .menu {
  visibility: visible;
}
.menu li {
  opacity: 0;
  margin-bottom: 5px;
  transform: translateX(20px);
  transition: all 0.3s;
}
.menu li:nth-child(5) {
  transition-delay: 0.1s;
}
.menu li:nth-child(5) span {
  transition-delay: 0.1s;
}
.menu li:nth-child(4) {
  transition-delay: 0.2s;
}
.menu li:nth-child(4) span {
  transition-delay: 0.2s;
}
.menu li:nth-child(3) {
  transition-delay: 0.3s;
}
.menu li:nth-child(3) span {
  transition-delay: 0.3s;
}
.menu li:nth-child(2) {
  transition-delay: 0.4s;
}
.menu li:nth-child(2) span {
  transition-delay: 0.4s;
}
.menu li:nth-child(1) {
  transition-delay: 0.5s;
}
.menu li:nth-child(1) span {
  transition-delay: 0.5s;
}
.open .menu li {
  opacity: 1;
  transform: translateX(0);
  backface-visibility: hidden;
}
.open .menu li:nth-child(1) {
  transition-delay: 1.1s;
}
.open .menu li:nth-child(1) span {
  transition-delay: 1.1s;
}
.open .menu li:nth-child(2) {
  transition-delay: 1.2s;
}
.open .menu li:nth-child(2) span {
  transition-delay: 1.2s;
}
.open .menu li:nth-child(3) {
  transition-delay: 1.3s;
}
.open .menu li:nth-child(3) span {
  transition-delay: 1.3s;
}
.open .menu li:nth-child(4) {
  transition-delay: 1.4s;
}
.open .menu li:nth-child(4) span {
  transition-delay: 1.4s;
}
.open .menu li:nth-child(5) {
  transition-delay: 1.5s;
}
.open .menu li:nth-child(5) span {
  transition-delay: 1.5s;
}
.open .menu li:nth-child(6) {
  transition-delay: 1.6s;
}
.open .menu li:nth-child(6) span {
  transition-delay: 1.6s;
}
.open .menu li:nth-child(7) {
  transition-delay: 1.7s;
}
.open .menu li:nth-child(7) span {
  transition-delay: 1.7s;
}
.menu a {
  position: relative;
  font-size: 24px;
  text-decoration: none;
  color: #2e2e2e;
  font-family: "Noto Serif Display";
  font-size: 28px;
  line-height: 40px;
}
.menu a::before {
  content: "";
  display: block;
  height: 2px;
  width: 0;
  position: absolute;
  left: -30px;
  top: 50%;
  background-color: #e6d5bf;
  transform: translateY(-50%);
  transition: width 0.3s;
}
.menu a:hover::before {
  width: 15px;
}

.menu-wrapper .menu {
  top: 15vh;
  left: 20vw;
  transform: translate(0, 0);
}
.menu-wrapper .menu .logo-item {
  margin: 0 0 3rem 0;
  display: block;
  position: relative;
}
.menu-wrapper .menu .extra-top-margin {
  display: block;
  position: relative;
  margin: 2rem 0 0 0;
}

.content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  color: #fff;
  transition: all 0.3s 1s;
}
.open .content {
  opacity: 0;
  transition: all 0.3s;
}

.text ol {
  margin: 0 0 1rem 0;
  padding: 0 0 0 1.5rem;
}
.text ol li {
  margin: 0 0 1rem 0;
}
.text p {
  margin: 0 0 1rem 0;
}
@media (max-width: 560px) {
  .text p {
    margin: 0 0 1rem 0;
  }
}

.matrix {
  width: 100%;
  padding: 1rem 0;
}
.matrix h2 {
  margin: 0 0 2rem 0;
}
.matrix p {
  line-height: 1.3em;
}
.matrix.text ol {
  margin: 0 0 1rem 0;
  padding: 0 0 0 1.5rem;
}
.matrix.text ol li {
  margin: 0 0 1rem 0;
  padding: 0 0 0 0.25rem;
}
.matrix.text ul {
  margin: 0 0 1rem 0;
  padding: 0 0 0 1.5rem;
}
.matrix.text ul li {
  margin: 0 0 1rem 0;
  padding: 0 0 0 0.25rem;
}
.matrix.text p {
  margin: 0 0 1rem 0;
}
@media (max-width: 560px) {
  .matrix.text p {
    margin: 0 0 1rem 0;
  }
}
.matrix.sobrazkom {
  display: flex;
  gap: 4rem;
  padding: 1rem 0 5rem 0;
}
@media (max-width: 660px) {
  .matrix.sobrazkom {
    gap: 2rem;
    flex-direction: column;
    padding: 1rem 0 3rem 0;
  }
}
.matrix.sobrazkom .text {
  display: flex;
  flex-direction: column;
  order: 2;
}
@media (max-width: 660px) {
  .matrix.sobrazkom .text {
    order: 1;
  }
}
.matrix.sobrazkom .obrazok {
  width: min(33vw, 560px);
  height: auto;
  max-height: 400px;
  -o-object-fit: contain;
     object-fit: contain;
  order: 1;
  display: flex;
  cursor: pointer;
}
@media (max-width: 660px) {
  .matrix.sobrazkom .obrazok {
    width: 100%;
    order: 2;
  }
}
.matrix.svideom {
  justify-content: center;
  align-items: center;
}
@media (max-width: 800px) {
  .matrix.svideom {
    gap: 2rem;
    flex-direction: column;
    padding: 1rem 0 3rem 0;
  }
}
.matrix.svideom .youtube {
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: 16/9;
}
.matrix.svideom .youtube iframe {
  width: 100%;
  height: 100%;
}
.matrix.svideom > * {
  flex: 1 1 0;
}
@media (max-width: 800px) {
  .matrix.svideom > * {
    flex: auto;
  }
}
.matrix.sobrazkom.pravo .text {
  order: 1;
}
@media (max-width: 660px) {
  .matrix.sobrazkom.pravo .text {
    order: 1;
  }
}
.matrix.sobrazkom.pravo .obrazok {
  order: 2;
}
@media (max-width: 660px) {
  .matrix.sobrazkom.pravo .obrazok {
    order: 2;
  }
}
.matrix.obrazok .obrazok {
  width: min(75vw, 1280px);
  height: auto;
  margin: 1rem auto;
  -o-object-fit: contain;
     object-fit: contain;
  order: 1;
  cursor: pointer;
}
.matrix.faq .question,
.matrix.faq .ans {
  position: absolute;
  top: 0.65rem;
  left: 0.65rem;
  width: 16px;
  height: 30px;
  -o-object-fit: contain;
     object-fit: contain;
}
.matrix.faq .ans {
  width: 22px;
  height: 28px;
}
.matrix.faq .otazka {
  font-weight: 600;
  font-style: italic;
  margin: 0 0 1rem 0;
  background: #fffaf4;
  padding: 0.5rem 0.5rem 0.5rem 2.5rem;
  position: relative;
  overflow: hidden;
  min-height: 38px;
}
.matrix.faq .odpoved {
  margin: 0 0 1rem 0;
  padding: 0.5rem 0.5rem 0.5rem 2.5rem;
  position: relative;
  overflow: hidden;
  min-height: 38px;
  background: #fffaf4;
}
.matrix.gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
  padding: 2rem 0;
}
.matrix.gallery .gallery-item {
  -o-object-fit: cover;
     object-fit: cover;
  cursor: pointer;
  width: 320px;
  height: auto;
}
@media (max-width: 760px) {
  .matrix.gallery .gallery-item {
    width: 140px;
  }
}
.matrix.cennik table {
  border: 1px solid #000;
  margin: 0 0 2rem 0;
  border-collapse: collapse;
  width: 100%;
}
.matrix.cennik table td {
  padding: 0.5rem 0.5rem 0.5rem 1rem;
}
.matrix.cennik table td:nth-child(1) {
  width: 70%;
}
.matrix.cennik table tr {
  border-bottom: 1px solid #000;
}
.matrix.cennik table tr:hover {
  background: #2e2e2e;
  color: #fff;
  cursor: pointer;
  transition: all 0.33s ease;
}

.captcha {
  margin: 1rem auto 0 0;
}
@media (max-width: 760px) {
  .captcha {
    margin: 1rem auto 0 auto;
    width: -moz-fit-content;
    width: fit-content;
  }
}

.service-widget .step {
  background-color: #e6d5bf;
}

.service-widget .widget-categories .category .category {
  background-color: #e6d5bf;
  border-radius: unset;
  max-width: 280px;
  font-size: 12px;
}

.service-widget .choose-service .widget-services .service.selected {
  border-color: #e6d5bf;
  border-radius: unset;
}

.fa,
.fas {
  color: #e6d5bf;
}

.service-widget .choose-worker .widget-workers .worker .worker-item .name.classic {
  color: #e6d5bf;
}

.ui-calendar .ui-datepicker .ui-datepicker-calendar thead {
  color: #e6d5bf;
}

.ui-calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
  background-color: #e6d5bf;
}

.service-widget .date-time .choose-date-time .widget-time .times .title {
  color: #e6d5bf;
}

.ui-calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-next {
  border-bottom-right-radius: 6px;
  border-top-right-radius: 6px;
  background-color: #e6d5bf;
}

.ui-calendar .ui-datepicker .ui-datepicker-header .ui-datepicker-prev {
  border-bottom-left-radius: 6px;
  border-top-left-radius: 6px;
  background-color: #e6d5bf;
}

.scroll_down {
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  height: 30px;
  width: 18px;
  bottom: -50px;
  background-color: transparent;
  border: 1px solid #2e2e2e;
  border-radius: 20px;
  cursor: pointer;
  outline: none;
}
@media (max-width: 560px) {
  .scroll_down {
    bottom: -75px;
  }
}

.scroll_down:before {
  position: absolute;
  top: 10px;
  left: 50%;
  content: "";
  width: 6px;
  height: 6px;
  margin-left: -3px;
  background-color: #2e2e2e;
  border-radius: 100%;
  animation: scroll_down_btn-animation 2s infinite;
  box-sizing: border-box;
}

@keyframes scroll_down_btn-animation {
  0% {
    transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    transform: translate(0, 16px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}/*# sourceMappingURL=main.css.map */