@import url('https://fonts.googleapis.com/css2?family=Tenor+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');

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

body{
    position: relative;
    background: var(--color-8);
    direction: ltr;
    font-family: 'Tenor Sans', 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:25px;
	font-weight: 700;
  text-align: center;
  margin-bottom: 37px;
  text-transform: capitalize;
}
@media screen and (min-width: 576px) {
  .title {
    font-size: 28px;
  }
}  

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

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

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

: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-8b);
 font-family: inherit;
 display: inline-block;
 width: 8em;
 height: 2.6em;
 line-height: 2.5em;
 margin: 18px;
 position: relative;
 overflow: hidden;
 border: 2px solid var(--color);
 transition: color .5s;
 z-index: 1;
 font-size: 17px;
 border-radius: 5px;
 font-weight:800;
 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: 800;
  padding: 14px 24px;
  border: 2px solid var(--color-8b);
  border-radius: 2px;
  position: relative;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.1);
  color: var(--color-8b);
  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-8b);
  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: 14px 17px;
 border: 2px solid var(--color-8b);
 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-8b);
 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: 2px ridge var(--color-8b);
  outline: none;
  background-color: transparent;
  color: #a62b00;
  transition: 1s;
  border-radius: 6px;
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
}

.mb01-btn4::after {
  content: "";
  position: absolute;
  top: -10px;
  left: 3%;
  width: 95%;
  height: 40%;
  background-color: var(--color-8a);
  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-8a);
  transition: 0.5s;
}

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

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

.mb01-btn5 {
  color: purple;
  text-transform: uppercase;
  text-decoration: none;
  border: 2px solid purple;
  padding:14px 25px;
  font-size: 17px;
  font-weight: 800 ;
  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: 149px;
  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:  18px;
  display: flex;
  align-items: center;
  gap: 17px;
  color: #a62b00;
  text-transform: uppercase;
}

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

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

.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-8);
  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:  700;
  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: 25px;
}

.nav-bar-mb01__link {
  color: #a62b00;
  font-size: 14px;
  padding: 0  14px;
  border-left: 2px 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: 99px 0;
  }
}

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

@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(photo/pictures_header_6818e3b74a9a03.86483657.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 55px 28px;
}

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

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

@media screen and (min-width: 768px) {
  .wellcome-mb01__item:first-child h2 {
    font-size: 28px;
    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:  25px;
  margin-top:22px;
  display: inline-block;
}

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

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

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

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

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

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

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

.main-articles {
  padding: 55px 0;

}

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

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

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

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


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

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

.about {
  padding: 88px 0;
  direction: initial;
  background-image: linear-gradient(to bottom, var(--color-8) 50%, var(--color-8a) 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: 18px;
  background: var(--color-8);
}

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

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

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

.gallery_list {
  display: flex;
  flex-direction: column-reverse;
  gap: 18px;
  padding-bottom: 26px;
  border-bottom: 2px 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:381px;
  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:  65px 0;
  display: flex;
}

.newsletter-mb01 {
  background-color: var(--color-8a);
  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-8a);
    border-bottom: solid  2px #2d3625;
    padding: 14px 26px;
    margin-right: 26px;
    outline: none;
    flex: 1;
}

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

.footer-flex {
  display: flex;
  flex-direction: column;
  gap: 99px;
  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: 54px;
}

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

  }
}

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


.footer__item:last-child div {
  display: flex;
  align-items: center;
  text-align: center;
  gap: 16px;
  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-8a);
  padding: 18px;
}

.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-8a);
  padding: 0 18px;
  border: solid 2px #62704f;
}

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

.page-mb01-price p {
  font-size: 18px;
  font-weight: 700;
  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  2px #4a0105;
}

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

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

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

.btn-telephone {
  background: var(--color-8a);
  padding: 40px;
  text-align: center;
    margin: 18px auto;
}

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

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

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

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

.input-control__box__element,
.textarea-control__box__element,
.input-mb01,
.textarea-mb01,
.newsletter_input {
  padding:  14px;
  max-width: 100%;
  border: 0;
  font-size: 17px;
  font-weight:700;
  line-height: 18px;
  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: 2px solid #2d3625;
  box-sizing: border-box;
  color: #2d3625;
  height: 37px;
  width: 100%;
  margin-bottom: 14px;
}

.textarea-control__box__element,
.textarea-mb01 {
  height: 54px;
}

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


.input-control__box__element::placeholder,
.textarea-control__box__element::placeholder,
.input-mb01::placeholder,
.textarea-mb01::placeholder,
.newsletter_input::placeholder {
  font-weight:800;
  font-size: 14px;
  line-height: 1.5;
  color: #777777;
}

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

.form-mb01-check {
  margin: 16px 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: 18px;
  display: flex;
  flex-direction: column-reverse;
  gap: 29px;
}

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

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

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

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

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

.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: 12px;
  padding-left:  18px;
  list-style: inside;
  }
}
.contact-top div:first-child {
  width: 90%;
}
.mapboxJK{
  height:381px; 
  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: 20px;
}

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

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

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

@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-8a);
  color: #583333;
  padding: 64px 0;
}
