@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,200..900;1,200..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik+Bubbles&display=swap');

* {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

body{
    position: relative;
    background: var(--color-10);
    direction: ltr;
    font-family: 'Crimson Pro', sans-serif !important;
    font-size: 17px;
    margin: 0;
    padding: 0px;
}

a {
    text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 0;
}

ul {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0;
    padding-inline-start: 0;
}

img {
    display: block;
}

button {
    font-family: inherit;
}

.no-scroll {
    overflow-y: hidden;
}

.link {
    text-decoration: none;
}

.link:hover,
.link:focus {
    cursor: pointer;
}

.list {
    list-style: none;
}

.title {
	color:#a62b00;
	font-size:22px;
	font-weight: 400;
  text-align: center;
  margin-bottom: 39px;
  text-transform: capitalize;
}
@media screen and (min-width: 576px) {
  .title {
    font-size: 36px;
  }
}  

.container-mb01 {
  padding-left: 15px;
  padding-right: 15px;
  margin-left: auto;
  margin-right: auto;
  max-width: 1200px !important;
}

@media screen and (min-width: 576px) and (max-width: 990px) {
  .container-mb01 {
      padding-left: 15px;
      padding-right: 15px;
  }
}

@media screen and (min-width: 991px) {
  .container-mb01 {
      padding-left: 15px;
      padding-right: 15px;
  }
}

:root {
  --color-1: #f6f6f1;
  --color-1a: #e4e7d2;
  --color-1b: #c7c5a5;

  --color-2: #f3f6f1;
  --color-2a: #dce7d2;
  --color-2b: #b5c7a5;

  --color-3: #f6f5f1;
  --color-3a: #e7e0d2;
  --color-3b: #c7baa5;

  --color-4: #f6f1f1;
  --color-4a: #e7dad2;
  --color-4b: #c7ada5;

  --color-5: #f2f7f3;
  --color-5a: #cff9db;
  --color-5b: #89cd95;

  --color-6: #f1f6f6;
  --color-6a: #d2e7e3;
  --color-6b: #a5c7c6;

  --color-7: #f1f4f6;
  --color-7a: #d2dfe7;
  --color-7b: #a5bac7;

  --color-8: #f3f1f6;
  --color-8a: #d2d3e7;
  --color-8b: #a5a6c7;

  --color-9: #f5f1f6;
  --color-9a: #dbd2e7;
  --color-9b: #b5a5c7;

  --color-10: #f6f1f3;
  --color-10a: #e7d2e0;
  --color-10b: #c7a5b7;
}

.priv-wow {
  overflow: hidden;
  word-break: break-all;
}
.mb01-btn1 {
 --color: var(--color-10b);
 font-family: inherit;
 display: inline-block;
 width: 8em;
 height: 2.6em;
 line-height: 2.5em;
 margin: 19px;
 position: relative;
 overflow: hidden;
 border: 1px solid var(--color);
 transition: color .5s;
 z-index: 1;
 font-size: 17px;
 border-radius: 3px;
 font-weight:900;
 color: #7a8075;
}

.mb01-btn1:before {
 content: "";
 position: absolute;
 z-index: -1;
 background: var(--color);
 height: 150px;
 width: 200px;
 border-radius: 50%;
}

.mb01-btn1:hover {
 color: #fff;
}

.mb01-btn1:before {
 top: 100%;
 left: 100%;
 transition: all .7s;
}

.mb01-btn1:hover:before {
 top: -30px;
 left: -30px;
}

.mb01-btn1:active:before {
 background: #3a0ca3;
 transition: background 0s;
}

.mb01-btn2 {
  font-size: 17px;
  letter-spacing: 2px;
  text-transform: uppercase;
  display: inline-block;
  text-align: center;
  font-weight: 900;
  padding: 14px 21px;
  border: 1px solid var(--color-10b);
  border-radius: 1px;
  position: relative;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.1);
  color: var(--color-10b);
  text-decoration: none;
  transition: 0.3s ease all;
  z-index: 1;
}

.mb01-btn2:before {
  transition: 0.5s all ease;
  position: absolute;
  top: 0;
  left: 50%;
  right: 50%;
  bottom: 0;
  opacity: 0;
  content: '';
  background-color: var(--color-10b);
  z-index: -1;
}

.mb01-btn2:hover, .mb01-btn2:focus {
  color: white;
}

.mb01-btn2:hover:before, .mb01-btn2:focus:before {
  transition: 0.5s all ease;
  left: 0;
  right: 0;
  opacity: 1;
}

.mb01-btn2:active {
  transform: scale(0.9);
}

.mb01-btn3 {
 padding: 12px 17px;
 border: 1px solid var(--color-10b);
 position: relative;
 overflow: hidden;
 background-color: transparent;
 text-align: center;
 text-transform: uppercase;
 font-size:  17px;
 transition: .3s;
 z-index: 1;
 font-family: inherit;
 color: #5c6b75;
}

.mb01-btn3::before {
 content: '';
 width: 0;
 height: 300%;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%) rotate(45deg);
 background: var(--color-10b);
 transition: .5s ease;
 display: block;
 z-index: -1;
}

.mb01-btn3:hover::before {
 width: 105%;
}

.mb01-btn3:hover {
 color: #111;
}

.mb01-btn4 {
  position: relative;
  height: 3.5em;
  border: 1px ridge var(--color-10b);
  outline: none;
  background-color: transparent;
  color: #a62b00;
  transition: 1s;
  border-radius: 5px;
  font-size: 17px;
  font-weight: 400;
  cursor: pointer;
}

.mb01-btn4::after {
  content: "";
  position: absolute;
  top: -10px;
  left: 3%;
  width: 95%;
  height: 40%;
  background-color: var(--color-10a);
  transition: 0.5s;
  transform-origin: center;
}

.mb01-btn4::before {
  content: "";
  transform-origin: center;
  position: absolute;
  top: 80%;
  left: 3%;
  width: 95%;
  height: 40%;
  background-color: var(--color-10a);
  transition: 0.5s;
}

.mb01-btn4:hover::before, .mb01-btn4:hover::after {
  transform: scale(0)
}

.mb01-btn4:hover {
  box-shadow: inset 0px 0px 21px var(--color-10b);
}

.mb01-btn5 {
  color: purple;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid purple;
  padding:12px 22px;
  font-size: 17px;
  font-weight: 900 ;
  background: transparent;
  position: relative;
  transition: all 1s;
  overflow: hidden;
}

.mb01-btn5:hover {
  color: #000;
}

.mb01-btn5::before {
  content: '';
  position: absolute;
  height: 100%;
  width: 0%;
  top: 0;
  left: -40px;
  transform: skewX(45deg);
  background-color: purple;
  z-index: -1;
  transition: all 1s;
}

.mb01-btn5:hover::before {
  width: 160%;
}

.header-mb01 {
  background: transparent;
  line-height: 119px;
  width: 100%;
  z-index: 500;
  -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.nav-inner-mb01 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.logo-link-mb01 {
  padding:  19px;
  display: flex;
  align-items: center;
  gap: 17px;
  color: #a62b00;
  text-transform: uppercase;
}

.menu-i {
  display: flex;
  border-radius: 50%;
  padding:7px;
  width: 32px;
}

@media screen and (min-width: 768px) {
  .menu-i {
    margin-top: 15px;
  }
}

.menu-i svg {
  color: #a62b00; 
}

@media screen and (min-width: 991px) {
  .menu-i {
      display: none;
  }
}

#burger:checked 
~ .mob-nav-bar-mb01 {
  display: block;
}

#burger:checked ~ .mob-nav-bar-mb01 > .mob-nav-bar-mb01__list {
  height: fit-content;
}

.nav-bar-mb01 {
  display: none;
}

@media screen and (min-width: 991px) {
  .nav-bar-mb01 {
      display: block;
  }
}

.mob-nav-bar-mb01 {
  height: 0;
  position: absolute;
  bottom: 40px;
  width: 96%;
  transition: height 0.35s ease;
}

.mob-nav-bar-mb01__list {
  position: relative;
  z-index: 800;
  display: flex;
  flex-wrap: wrap;
  overflow: auto !important;
  background: var(--color-10);
  float: right;
  width: 100%;
  height: 0;
  transition: height 0.35s ease;
}

.mob-nav-bar-mb01__item {
  line-height: 20px;
  width: 100% !important;
  white-space: nowrap;
  -webkit-transition: background 0.2s;
  transition: background 0.2s;
  position: relative;
  float: left;
}
.mob-nav-bar-mb01__item:first-child {
  border-top: 0 none;
}

.mob-nav-bar-mb01__link {
  color: #a62b00;
  font-size: 14px;
  font-weight:  400;
  display: block;
  text-align: center;
}

.mob-nav-bar-mb01__link:hover,
.mob-nav-bar-mb01__link:focus    {
  color:#4b423f;
  transition:.5s all;
  -webkit-transition:.5s all;
  -moz-transition:.5s all;
  -o-transition:.5s all;
  -ms-transition:.5s all;
} 

.nav-bar-mb01__list {
  display: flex;
  position: relative;
  gap: 22px;
}

.nav-bar-mb01__link {
  color: #a62b00;
  font-size: 14px;
  padding: 0  12px;
  border-left: 1px solid #a62b00;
}

.nav-bar-mb01__link:hover,
.nav-bar-mb01__link:focus,
.mob-nav-bar-mb01__link:hover,
.mob-nav-bar-mb01__link:focus {
  color: #d0218d;
  transition: .5s all;
  -webkit-transition: .5s all;
  -moz-transition: .5s all;
  -o-transition: .5s all;
  -ms-transition: .5s all;
}


.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  white-space: nowrap;
  clip-path: inset(100%);
  clip: rect(0 0 0 0);
  overflow: hidden;
  bottom: 0;
}

@media screen and (min-width: 768px) {
  .wellcome-mb01 {
    padding: 66px 0;
  }
}

.wellcome-mb01-flex {
  display: flex;
  flex-direction: column-reverse;
  gap:  30px;
}

@media screen and (min-width: 768px) {
  .wellcome-mb01-flex {
    flex-direction: row-reverse;
  }
}

.wellcome-mb01__item:first-child {
  flex: 60%;
  background-image: linear-gradient(to top, #35353599,#35353599), url(files/images/hero-bg-5LS70.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 51px 36px;
}

.wellcome-mb01__item:first-child h2 {
  text-align: center;
  color: #ffffff;
  font-size: 17px;
  font-weight: 400;
  position: relative;
  top: 50%;
}

@media screen and (min-width: 576px) {
  .wellcome-mb01__item:first-child h2 {
    font-size: 22px;
  }
}

@media screen and (min-width: 768px) {
  .wellcome-mb01__item:first-child h2 {
    font-size: 36px;
    transform: translateY(-50%);
  }
}

.wellcome-mb01__item:last-child {
  padding:  26px;
  flex: 40%;
  max-width: 500px;
  margin: 0 auto;
}

.wellcome-mb01__item:last-child a img {
  width: 100%;
  height: 345px;
  object-fit: cover;
}

.wellcome-mb01__item:last-child a.link {
  color: #a62b00;
  font-size:  22px;
  margin-top:21px;
  display: inline-block;
}

@media screen and (min-width: 768px) {
  .wellcome-mb01__item:last-child h3 {
    font-size: 21px;
  }
}

.wellcome-mb01__item:last-child > p {
  color: #000000;
  font-size:  15px;
}

.bottom-info {
  border-top: solid 1px #4e4e4e;
  margin-top: 19px;
  display: flex;
  justify-content: space-between;
}

@media screen and (min-width: 768px) {
  .bottom-info {
    padding-top: 15px;
  }
}

.viewers,
.likes {
  display: flex;
  gap: 7px;
  color: #000000;
  font-size: 14px;
}

.viewers svg {
  fill: #000;
  width: 19px;
}

.likes svg {
  color: #e84a43;
  width: 19px;
}

.main-articles {
  padding: 51px 0;

}

.main-articles__list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
}

.main-item {
  max-width: 290px;
}

@media screen and (min-width: 576px) {
  .main-item {
    flex: calc(100% / 2 - 30px);
  }
}

@media screen and (min-width: 768px) {
  .main-item {
    flex: calc(100% / 3 - 30px);
  }
}


.main-item img {
  width: 100%;
  height: 315px;
  object-fit: cover;
  margin-bottom: 21px;
}

.main-item div a {
  color: #a62b00;
  font-size: 22px;
}

.about {
  padding: 98px 0;
  direction: initial;
  background-image: linear-gradient(to bottom, var(--color-10) 50%, var(--color-10a) 50%);
}

.about .container-mb01 {
  position: relative;
}

.about-img-block {
  margin-left: auto;
}

@media screen and (min-width: 768px) {
  .about-img-block {
    width: 60%;
  }  
}

.about-img-block img {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
}

.about-txt-block {
  padding: 19px;
  background: var(--color-10);
}

@media screen and (min-width: 768px) {
  .about-txt-block {
    width: 60%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    padding: 19px 49px;
  }
}

.about-txt-block p {
  line-height: 1.7em;
  font-size: 17px;
  letter-spacing: 0.03em;
  text-indent: 3ch;
}

.gallery {
  padding: 98px 0;
  background-color: var(--color-10a);
}

.gallery_list {
  display: flex;
  flex-direction: column-reverse;
  gap: 19px;
  padding-bottom: 26px;
  border-bottom: 1px solid #2d3625;
}

@media screen and (min-width: 576px) {
  .gallery_list {
    flex-wrap: wrap;
    flex-direction: row-reverse;
  }
}

@media screen and (min-width: 991px) {
  .gallery_list {
    flex-wrap: nowrap;
  }
}

.gallery_item {
  max-width:315px;
  margin: 0 auto;
}

@media screen and (min-width: 576px) and (max-width: 767px) {
  .gallery_item {
    flex: calc(100% / 2 - 20px);
  }  
}

@media screen and (min-width: 768px) and (max-width: 990px) {
  .gallery_item {
    flex: calc(100% / 3 - 20px);
  }  
}

@media screen and (min-width: 991px) {
  .gallery_item {
    flex: 1;
  }  
}

.gallery_item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.newsletter {
  padding:  61px 0;
  display: flex;
}

.newsletter-mb01 {
  background-color: var(--color-10a);
  padding: 26px;
  flex: 80%;
}

.newsletter > div:last-child {
  display: none;
}

@media screen and (min-width: 576px) {
  .newsletter > div:last-child {
    display: block;
    flex: 30%;
  }
}

.newsletter-block {
  margin-left: auto;
  text-align: center;
}
@media screen and (min-width: 576px) {
  .newsletter-block {
    width: 70%;
  }
}

.newsletter-block form {
  display: flex;
  flex-direction: column;
}

@media screen and (min-width: 991px) {
  .newsletter-block form {
    flex-direction: row;
  }
}  

.newsletter_input {
  border: none;
    background: var(--color-10a);
    border-bottom: solid  1px #2d3625;
    padding: 12px 26px;
    margin-right: 26px;
    outline: none;
    flex: 1;
}

.footer {
  color: #4a0105;
  padding: 51px 0;
}

.footer-flex {
  display: flex;
  flex-direction: column;
  gap: 66px;
  justify-content: space-around;
  align-items: center;
}

@media screen and (min-width: 991px) {
  .footer-flex {
    flex-direction: row-reverse;
    align-items: baseline;
  }
}

.footer__item:last-child {
  display: flex;
  flex-direction: column-reverse;
  gap: 62px;
}

@media screen and (min-width: 576px) {
  .footer__item:last-child {
    flex-wrap: wrap;
    flex-direction: row-reverse;
    gap: 22px;

  }
}

@media screen and (min-width: 991px) {
  .footer__item:last-child {
    gap: 66px;
  }
}


.footer__item:last-child div {
  display: flex;
  align-items: center;
  text-align: center;
  gap: 15px;
  flex-direction: column-reverse;
}

.footer .logo-link-mb01,
.footer__item div a  {
  color: inherit;
}
.footer__item div a {
  font-size: 17px;
}
.flex-sectionHJ{
  display: flex;
  flex-direction: column-reverse;
}

.page-mb01 {
overflow: hidden;}

.page-mb01-container {
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  .page-mb01-container {
    width: max(740px, 70%);
  }  
}

.page-mb01 h2 {
  background: var(--color-10a);
  padding: 19px;
}

.page-img img {
  width: 100%;
}

@media screen and (min-width: 576px) {
  .page-img img {
    width: max(80%, 600px);
    margin: 0 auto;
  }
}

.page-mb01-price {
  width: 400%;
  background: var(--color-10a);
  padding: 0 19px;
  border: solid 1px #62704f;
}

@media screen and (min-width: 576px) {
  .page-mb01-price {
    position: absolute;
    bottom: 30%;
    left: 60%;
  }
}

.page-mb01-price p {
  font-size: 19px;
  font-weight: 400;
  color: #a62b00;
  text-indent: 3ch;
}

.page-item {
  position: relative;
  direction: initial;
}

.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
  color: #a62b00;
}

.content li {
  margin-left: 26px;
}

.page-mb01-container h3 {
  margin-top: 26px;
  color: #a62b00;
}

.page-mb01 .bottom-info {
  border-top: solid  1px #4a0105;
}

.page-mb01 .viewers,
.another-art .viewers  {
  gap: 15px;
}

.another-art .viewers  {
  font-size: 17px;
}

.page-form {
  padding: 79px 0;
}

.btn-telephone {
  background: var(--color-10a);
  padding: 39px;
  text-align: center;
    margin: 19px auto;
}

@media screen and (min-width: 768px) {
  .btn-telephone {
    width: max(80%, 400px);
  }
}

.form-wrapper {
  background: var(--color-10a);
  padding: 39px;
    margin: 0 auto;
}

@media screen and (min-width: 576px) {
  .form-wrapper {
    width: max(60%, 400px);
  }
}

.form-mb01 {
  display: flex;
  flex-direction: column;
}

.input-custom_box-section,
.textarea-custom_box-section,
.input-mb01,
.textarea-mb01,
.newsletter_input {
  padding:  12px;
  max-width: 100%;
  border: 0;
  font-size: 17px;
  font-weight:400;
  line-height: 19px;
  transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  background-color: transparent;
  border-bottom: 1px solid #2d3625;
  box-sizing: border-box;
  color: #2d3625;
  height: 39px;
  width: 100%;
  margin-bottom: 12px;
}

.textarea-custom_box-section,
.textarea-mb01 {
  height: 62px;
}

.input-custom_box-section:focus,
.textarea-custom_box-section:focus,
.input-mb01:focus,
.textarea-mb01:focus,
.newsletter_input:focus {
  background-color: #d6c7b0;
  border-bottom:1px solid #2d3625;
  outline: none;
}


.input-custom_box-section::placeholder,
.textarea-custom_box-section::placeholder,
.input-mb01::placeholder,
.textarea-mb01::placeholder,
.newsletter_input::placeholder {
  font-weight:900;
  font-size: 14px;
  line-height: 1.3;
  color: #777777;
}

.form-mb01 > label {
  display: block;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.3;
  margin: 0 0  5px 0;
  padding: 0;
  color: #a62b00;
}

.form-mb01-check {
  margin: 15px 0;
}

.form-mb01-check-label a {
  color: #4a0105;
}
.contact-list li a {
  word-break: break-all;
}
.btn-position {
  text-align: center;
}
.new-vov {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.title-wrapper {
  display: flex;
  justify-content: space-between;
}

.another-art .container-mb01 > div {
  max-width: 90%;
  margin: 0 auto;
}

.see-all {
  font-size: 14px;
  color: #4a0105;
}

.another-art ul {
  margin-top: 19px;
  display: flex;
  flex-direction: column-reverse;
  gap: 30px;
}

@media screen and (min-width: 576px) {
  .another-art ul {
    flex-direction: row-reverse;
  }
}

.another-art .main-item {
  max-width: unset;
  flex: calc(100% / 2 - 30px);
}

.another-art .main-item img {
  object-fit: cover;
}

.contact-section {
  padding: 79px 0;
}

.contact-section .container-mb01 > div {
  background: var(--color-10b);
}

.contact-top {
  display: flex;
  align-items: flex-end;
}
.pay-text,.content{
  word-break: break-word;
   p{ 
  text-indent: 3ch;
  }
  li{
      margin-left: 26px;
  }
  a,table{
    color: inherit;
    
  }
  ul, ol {
      margin-bottom: 15px;
  padding-left:  19px;
  list-style: inside;
  }
}
.contact-top div:first-child {
  width: 90%;
}
.mapboxJK{
  height:315px; 
  width: 100%; 
}

@media screen and (max-width: 575px) {
    .contact-top {
        display: none;
      }      
}


.vertical-text {
  writing-mode: vertical-lr;
  transform: rotate(-180deg);
  margin: 0;
  font-size: 22px;
}

.contact-bottom {
  padding:  39px 0;
}

.contact-bottom > p {
  margin: 0 51px;
  color: #4a0105;
}

.contact-list {
  border-top: #2d3625 solid 1px;
  border-bottom: #2d3625 solid 1px;
  padding: 30px;
  margin-top: 30px;
  background: var(--color-10a);
  display: flex;
  flex-direction: column-reverse;
  justify-content: space-between;
  gap: 35px;
}

@media screen and (min-width: 768px) {
    .contact-list {
        flex-direction: row-reverse;
    }
}

.contact-list li {
  flex: 1;
  text-align: center;
}

.contact-list li a {
  color: #4a0105;
}

.policy {
  background: var(--color-10a);
  color: #583333;
  padding: 79px 0;
}
