.gallery{
	color: red;
}
.btn-pro{
  width:204px;
  margin-top:1em;
}
*{
	box-sizing:border-box;
}
    html{
        font-family: "Poppins", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: large;
    }
#div{
  color:white;
}
:root{
        --page_width:1480px;
        --black:#222222;
        --white:#ffffff;
        --brown:#ac8c6a;
        --orange:#e6810d;
        --darkBrown:#281f14;
        --blue:#0c71b7;
        --lightBrown:#d1c7bb;
        --gray:#636466;
        --lightGray:#b5b5b5;
        --darkGray:#505050;
    }
.flex{
  display:flex;
}
.full{
  width:100%
}
.full_img{
  object-fit:contain;
  width:100%;
}
.flex-vertical{
  display:flex;
  flex-direction: column;
}
.align-items-center{
  align-items: center;
}
.justify-content-center{
  justify-content: center;
}
.justify-content-space-between{
  justify-content: space-between;
}
.justify-content-flex-start{
  justify-content: flex-start;
}
.justify-content-flex-end{
  justify-content: flex-end;
}
.w-100{
  width:100% !important;
}
.w-85{
  width:85%;
}
.w-80{
  width:80%;
}
.w-70{
  width:70%;
}
.w-50{
  width:50%;
}
.w-45{
  width:45%;
}
.w-40{
  width:40%;
}
.w-30{
  width:30%;
}
.w-25{
  width:25%;
}
.w-20{
  width:20%
}
.w-15{
  width:15%;
}
.h-50{
  height:50%
}
.h-80{
  height:80%;
}
.h-100{
  height:100%
}
.border{
    border: 1px solid var(--black)
}
.border-radius-s{
  border-radius:12px;
}
.border-radius-m{
  border-radius:27px;
}
.border-radius-l{
  border-radius:100px;
}
.m-0{
  margin:0 !important;
}
.m-1{
  margin:1em;
}
.m-2{
  margin:2em;
}
.mt-1{
  margin-top:1em;
}
.mt-2{
  margin-top:2em;
}
.mt-3{
  margin-top: 3em;
}
.mt-5{
  margin-top: 5em;
}
.mt-10{
  margin-top:10em;
}
.mb-1{
  margin-bottom: 1em;
}
.mb-2{
  margin-bottom:2em;
}
.mb-3{
  margin-bottom: 3em;
}
.mb-5{
  margin-bottom:5em;
}
.mb-10{
  margin-bottom:10em;
}
.mr-1{
  margin-right:1em;
}
.ml-1{
  margin-left:1em;
}
.mr-2{
  margin-right:2em;
}
.ml-2{
  margin-left:2em;
}
.mr-3{
  margin-right:3em;
}
.ml-3{
  margin-left:3em;
}
.p-0{
  padding:0 !important;
}
.p-1{
  padding:1em;
}
.p-2{
  padding:2em;
}
.p-5{
  padding:5em;
}
.pt-3{
  padding-top: 3em;
}
.pb-3{
  padding-bottom: 3em;
}
.pr-1{
    padding-right: 1em;
}
.bg-black{
  background-color: var(--black);
}
.bg-white{
  background-color: var(--white);
}
.bg-brown{
  background-color: var(--brown);
}
.bg-lightbrown{
  background-color: var(--lightBrown);
}
.bg-darkgray{
  background-color: var(--darkGray);
}
.bg-lightgray{
  background-color: var(--lightGray);
}
.bg-offwhite{
  background-color:#f8f7f5;
}
.uppercase{
  text-transform:uppercase;
}
.text-decoration-none{
  text-decoration: none;
}
.text-white{
  color: var(--white);
}
.text-white a{
  color: var(--white);
}
.text-brown{
  color: var(--brown);
}
.text-black{
  color: var(--black)
}
.font-size-2{
  font-size:2em;
}
.page-width{
  max-width:1480px;
}
.btn{
  color: var(--white);
  text-decoration: none;
  text-transform: uppercase;
  background-color: var(--brown);
  padding: 1em;
  border-radius: 27px;
  transition: 300ms;
}
.btn:hover {
  background-color: var(--lightBrown);
  color: var(--darkBrown);
  transition: 300ms;
}
.btn-circle{
  border-radius:100%;
  width: 60px;
  height: 60px;
  font-size: 2em;
  color: var(--white);
  text-decoration: none;
  justify-content: center;
  align-items: center;
  display: flex;
  transition: 300ms;
}
.btn-circle:hover {
  background-color: var(--lightBrown);	
  color: var(--darkBrown);
  transition: 300ms;
}
.videoFilter {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: -90;
  opacity: 1;
  transition: opacity 1.25s ease;
  background: #262626;
  background: linear-gradient(180deg, rgba(38, 38, 38, .85), rgba(38, 38, 38, .6));
}
.videoWrapper video {
  height: 360%;
  top: -140%;
  position: absolute;
  left: 0;
  width: 100%;
  z-index: -100;
}
.videoWrapper {
  height: 100vh;
  position: absolute;
  right: 0;
  left: 0;
  overflow: hidden;
}
.content{
	opacity: 1;
    z-index: 2;
}
.menu{
	height: 6em;
  z-index: 100;
  position: sticky;
  top: 0;
  width: auto;
  box-shadow: 0 5px 4px rgba(0, 0, 0, 0.2);
}
.menu-logo{
  height:100%;
  width:auto;
}
.menu-height{
  height: 6em;
}
.btn-menu {
  display: flex;
  height: 100%;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  transition: 400ms;
  color: var(--white);
}
.btn-menu:hover{
  border-bottom: 6px solid var(--white);
  transition: 300ms;
}
.menu-support {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 1.5em;
  width: 100%;
  background-color: var(--black);
  margin-right: 1em;
  transition: 300ms;
  color: var(--white);
  margin-right: 1em;
  margin-left: 1em;
  transition: 300ms;
}
.menu-support-B {
  width: 65%;
  background-color: var(--orange);
}
.menu-support:hover {
  color: var(--darkBrown);
  background-color: var(--lightBrown);
  transition: 300ms;
}
.menu-contacts-tel {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 92%;
  height: 100%;
  color: var(--white);
  text-decoration: none;
}
.menu-contacts-tel-B {
    width: 75%;
}
.menu-contacts-tel-image{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.menu-contacts-tel-image img {
  height: 65%;
  object-fit: contain;
  margin-right: 0.2em;
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(285deg) brightness(111%) contrast(101%);
  transition: 150ms;
}
.menu-contacts-tel b {
    padding-left: 0.4em;
}
.menu-contacts-tel:hover img {
  filter: brightness(0) saturate(100%) invert(70%) sepia(40%) saturate(5592%) hue-rotate(355deg) brightness(92%) contrast(96%);
  transition: 150ms;
}
.menu-contacts-tel:hover b {
    text-decoration: underline;
}
.contacts a{
	text-decoration:none;
}
.contacts a:hover{
	text-decoration:underline;
}
.tip-section{
  flex-direction: row;
  justify-content: space-between;
  margin-top: 5em;
  margin-bottom: 5em;
  padding-left: 3em;
  padding-right: 3em;
}
.border-bottom-white{
      border-bottom: 1px solid var(--white);
}
body{
  padding: 0;
  margin: 0;
}
strong{
  color: var(--brown);
  display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
}
.bg-image{
    background-size: 100%;
	background-image: url("/static/storage/0ab0e898f2e94124be583947b7c4eb55.jpg");
}
.menuBurgerButton{
  visibility: hidden;
  width: 0;
}
.barButton{
  margin-right: 0.8em;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 6em;
  width: 6em;
  justify-content: center;
  z-index: 3;
  opacity: 0.9;
}
.bar1{
  width: 90px;
  height: 12px;
  background-color: var(--white);
  border-radius: 10px;
  margin: 5px;
  transition: all 500ms;
}
.bar2{
  width: 90px;
  height: 12px;
  background-color: var(--white);
  border-radius: 10px;
  margin: 5px;
  transition: all 500ms;
}
.bar3{
  width: 90px;
  height: 12px;
  background-color: var(--white);
  border-radius: 10px;
  margin: 5px;
  transition: all 500ms;
}
.barButton.open .bar2{
  width: 0;
  transition: all 500ms;
}

.barButton.open .bar1{
  transform: translateY(22px) rotate(45deg);
  transition: all 500ms;
}

.barButton.open .bar3{
  transform: translateY(-22px) rotate(-45deg);
  transition: all 500ms;
}
.bar1{
    width: 90px;
    height: 12px;
    margin: 5px;
    transition: all 500ms;
}
.bar2{
    width: 90px;
    height: 12px;
    margin: 5px;
    transition: all 500ms;
}
.bar3{
    width: 90px;
    height: 12px;
    margin: 5px;
    transition: all 500ms;
}
.barButton.open .bar2{
    width: 0;
    transition: all 500ms;
}

.barButton.open .bar1{
    transform: translateY(22px) rotate(45deg);
    transition: all 500ms;
}

.barButton.open .bar3{
    transform: translateY(-22px) rotate(-45deg);
    transition: all 500ms;
}

.bar1, .bar2, .bar3 {
  width: 45px;
  height: 6px;
  margin: 2.5px;
  transition: all 500ms;
}

.barButton.open .bar2 {
  width: 0;
  transition: all 500ms;
}

.barButton.open .bar1 {
  transform: translateY(11px) rotate(45deg);
  transition: all 500ms;
}

.barButton.open .bar3 {
  transform: translateY(-11px) rotate(-45deg);
  transition: all 500ms;
}
.pro_wrapper{
  width: 100%;
  height: auto;
  position: relative;
  right: 0;
  left: 0;
  overflow: hidden;
  display: flex;
  justify-content: center;
}
.pro_filter {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  opacity: 1;
  transition: opacity 1.25s ease;
  background: #262626;
  background: linear-gradient(180deg, rgba(38, 38, 38, .85), rgba(38, 38, 38, .6));
}
.promo-container{
    padding: 7em 2em 0 2em;
}
.storage{
    padding: .25rem
}
.storage_list{
    list-style-type: none;
}
.about-us-text{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
  @media only screen and (max-width: 1300px) {
    .section-content {
      padding-left: 3em;
      padding-right: 3em;
    }
    .videoWrapper video {
      width: 120%;
    }
    .menu-logo-box{
      width:20%;
    }
    .menu-box{
      width:80%;
    }
}
    @media only screen and (max-width: 1000px) {
      .section-content {
        padding-left: 1em;
        padding-right: 1em;
    }
      .menuBurgerButton{
        height: 6em;
        display: flex;
        flex-direction: row-reverse;
        width: 100%;
        visibility: visible;
        align-items: center;
	    }
      .videoWrapper video{
        height: 100%;
        top: 0;
        width: auto;
      }
      #menuBox{
        display: none;
      }
      .menuBox{
        width: 100%;
        background-color: var(--brown);
      }
      .menu-logo-box{
        height: 6em;
        position: fixed;
        width: 100%;
        padding: 0;
        justify-content: flex-start;
      }
      .menu-logo-box img{
        padding: 1em;
        width: auto;
      }
      .menuButtonBox{
        flex-direction: column;
        padding: 1em 0;
        width: 100%;
        border:none;
      }
      .menuContent{
        flex-direction: column;
      }
      .button_box{
     	flex-direction:column;
      }
      .menu-lang{
        width: 100%;
        height: 3em;
      }
      .menu-contacts-tel{
        width: auto;
      }
      .menuContacts{
        flex-direction: column;
        width: 100%;
        padding: 1em 3em;
      }
      .menu-support{
        width: auto;
        margin: 0.4em 0;
        padding: 0 1em
      }   
      .menu-contacts-tel{
          margin: 0.3em 0;
      }
      .social{
          padding: 0;
          width: 100%;
          height: 3em;
          justify-content: center;
      }
      .btn-menu:hover{
        border-bottom: 6px solid transparent
      }

      .menu-contacts-tel img{
          display: none;
      }
      .buttonWrap{
          flex-direction: column;
      }
      .socialButtonWrap{
          flex-direction: column;
      }
      .menuLine{
          display: none;
      }
      .about-us-text{
        width:100%
      }
      .about-us-image{
        width: 100%;
      }
      .about-us-box img{
        width: 25%;
      }
      .about-us-box{
        margin: 1em 0;
        border-radius: 40px;
        width: 100%;
        flex-direction: column;
      }
      .about-us{
        width: 100%;
        flex-direction: column;
      }

      .pros{
        flex-direction: column;
      }
      .pro{
        width: 100%;
        padding:0;
        margin:2em 0;
      }
      .flex-column-1000px{
        flex-direction: column
      }
      .w-100-1000px{
        width: 100%;
      }
      .font-size-2{
        font-size: 1.2em;
      }
      .map{
        height: 400px;
      }
      .gallery_grid{
        width: 100%;
        padding:2em 2em 0;
        margin: 0;
      }
      .vertical-1000px{
        flex-direction: column;
      }


}






























































































































