* {
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   -webkit-box-sizing: border-box;
 }
 html, body {
   height: 100%;
   width: 100%;
   margin: 0;
   padding: 0;
 }
 body {
   font-family: 'Roboto Slab', serif;
   padding: 0px;
   margin: 0px;
   font-size: 14px;

 }
 h2 {
   font-size: 2rem;
   font-weight: 300;
   font-family: Russo One;
 }
 h3 {
   font-size: 1.2rem;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   h1 {
     font-size: 2rem
   }
 }
 ::selection {
   color: #fff;
   /* Цвет текста */
   background: #068ccd;
   /* Цвет фона */
 }
 ::-webkit-input-placeholder {
   color: #333;
 }
 :-moz-placeholder {
   /* Firefox 18- */
   color: #333;
 }
 ::-moz-placeholder {
   /* Firefox 19+ */
   color: #333;
 }
 :-ms-input-placeholder {
   color: #333;
 }

button:focus {
	outline:none !important;
}
 .bottom-block {
   position: absolute;
   z-index: 2;
   bottom: 10%;
   width: 100%;
 }
 .bottom-block a {
   color: #fff;
   display: inline-block;
   font-size: 3rem;
   opacity: 0.5;
   transition: all .3s ease;
 }
 .bottom-block a:hover {
   opacity: 1;
 }

 .baner {
  background: #ed1c24;
  padding: 24px 0;
 }

.title-big {
  color: #fff;
    text-shadow: 1px 4px rgba(0, 0, 0, 0.4);
    font-size: 2rem;
    font-weight: bold;
}


 /*-----loader-------*/

 .loader {
   display: flex;
   align-items: center;
   justify-content: center;
   position: fixed;
   width: 100%;
   height: 100vh;
   z-index: 1000;
   overflow: hidden;
   opacity: 1;
   transition: all .3s ease;
   background: #fff;
 }
 .load-text {
   position: absolute;
   text-align: center;
   width: 100%;
   z-index: 1;
   color: #000;
   display: block;
   animation: pulse .8s linear infinite;
 }
 @keyframes pulse {
   0% {
     opacity: 1
   }
   100% {
     opacity: 0
   }
 }
 
 @media (max-width: 786px) and (min-width: 100px) {
   .loader span {
     font-size: 6rem;
     padding-top: 100%;
   }
 }
  
 .loaded {
   overflow: auto;
 }
 .loaded .load-text {
   display: none;
 }
 /*-------section---------*/

 .wrapper {
   position: relative;
      overflow-x: hidden; 
 }
 .section {
   position: relative;
   width: 100%;
 }
 .section-content {
   overflow: hidden;
   min-height: 70vh;
 }
 /*-----videos-----*/

 .section-video {
   position: relative;
   width: 100%;
   min-height: 100vh;
   overflow: hidden;
   z-index: 0;
 }
 .section-video em {
   background: rgba(0, 0, 0, 0.2);
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   position: absolute;
   z-index: -1;
 }
 .video {
   position: fixed;
   width: 100%;
   height: 100%;
   z-index: -2
 }
 .video video {
   position: absolute;
   top: 50%;
   left: 50%;
   min-width: 100%;
   min-height: 100%;
   width: auto;
   height: auto;
   z-index: -1;
   transform: translateX(-50%) translateY(-50%);
 }
 /*----navigator---*/

 .navigator {
   padding: 15px 0;
   position: absolute;
   z-index: 15;
   width: 100%;
 }

  @media (max-width: 786px) and (min-width: 100px) {
 .navigator {
   padding: 5px 0;
 }
 }
  
 .fixed-menu .navigator {
   position: fixed;
   background: #000;
   z-index: 15;
 }
 .fixnavi .navigator {
   position: fixed;
   background: #000;
   z-index: 15;
 }
 .bredcrums {
   position: fixed;
   width: 100%;
   left: 0px;
   top: 50px;
   z-index: 15;
   background: rgba(0, 0, 0, 0.4);
   padding: 10px 0;
 }
 .bredcrums ul {
   margin: 0px;
   padding: 0px;
 }
 .bredcrums ul li {
   float: left;
   list-style: none;
   margin-right: 15px;
 }
 .bredcrums ul li a {
   color: #cecece;
 }
 .logo {
   float: left;
 }



  @media (max-width: 786px) and (min-width: 100px) {
 .logo img{
width: 87px;
    padding-top: 12px;
 }

 }

 .navi {
   position: fixed; 
  width: 30%;
  min-height: 100vh;
  right: -30%;
  top: 0px;
  z-index: 10;
  transition: all .3s ease-in-out;
  background: rgba(0,0,0,0.9);
  padding-top: 10%;
 }


 
 .navi ul {
   padding: 0px;
   margin: 0px;
   text-align: center;
   padding-top: 8px;
 }
 .navi ul li {
   display: block;
   list-style: initial;
   margin: 30px 15px;
 }
 .navi ul li a {
   color: #fff;
   font-weight: 500;
   font-size: 1rem;
   text-transform: uppercase;
   letter-spacing: 1px;
   position: relative;
 }
 .navi ul li a:hover {
   text-decoration: none;
 }
 .navi ul li .active:after {
   content: " ";
   position: absolute;
   bottom: -30px;
   left: 44%;
   width: 1px;
   height: 43px;
   overflow: hidden;
   transform: rotate(90deg);
   background: url(i/bg_menu.png) repeat;
 }

  @media (max-width: 786px) and (min-width: 100px) {
 .navi {
   width: 100%;
  right: -100%;
 }

 .navi ul li a {
  font-size: 0.8rem;
 }

 }

 .show_mobil_menu {
   position: relative;
  float: right;
   width: 40px;
   height: 39px;
   padding: 5px;
   border: none;
   display: flex;
   justify-content: center;
   flex-direction: column;
   cursor: pointer;
   margin-top: 6px;
   margin-right: 15px;
  transition: all .3s ease-in-out;
  background: #fff;
 
 }

 .bron {
  float: right;
 
}

.phone {
  float: right;
    margin-right: 60px;
}

   @media (max-width: 786px) and (min-width: 100px) {
 .show_mobil_menu {
   margin-right: 0px;
 }

 }


 .show_mobil_menu span {
   background: #c38b58;
   display: block;
   width: 100%;
   height: 1px;
   margin: 0px 0px 3px 0px;
   transition: all .3s ease;
 }

  
  .show_mobil_menu:hover > span{
   background: #c38b58;
  }
 
  .open_menu .navi {
    right: 0%
  }
 

  .open_menu .show_mobil_menu span:nth-child(1) {
     opacity: 0;
   }
  .open_menu .show_mobil_menu span:nth-child(2) {
     transform: rotate(45deg);
     transform-origin: center;
   }
  .open_menu .show_mobil_menu span:nth-child(3) {
     transform: rotate(-45deg);
     transform-origin: center;
     margin-top: -4px;
     margin-left: 0px;
   }

 /*-----introduction-----*/

 .introduction {
   padding-top: 10%;
 }
 .introduction h1 {
   color: #fff;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: 800;
   font-size: 3rem;
   z-index: 2;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .introduction {
     height: 100vh;
     padding-top: 30%;
   }
   .introduction h1 {
     font-size: 2rem;
   }
 }
 /*-----about-brewery------*/

 .about-brewery {
   position: absolute;
   width: 100%;
   padding: 15px;
   bottom: 0px;
   background: rgba(0, 0, 0, 0.7);
 }
 .item-about {
   border-right: 1px solid #666;
   overflow: hidden;
 }
 .item-about img {
   margin-right: 15px;
   float: left;
 }
 .text-item {
   padding-top: 10px;
 }
 .text-item p {
   color: #fff;
   font-size: 0.8rem;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: 900;
   padding: 0px;
   margin: 0px;
 }
 .text-item p span {
   color: #e9bd71;
   text-transform: none;
   font-weight: 600;
   font-size: 1.2rem
 }
 .no-border {
   border-right: none;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .about-brewery {
     position: relative;
   }
   .item-about img {
     margin-right: 15px;
     float: none;
   }
   .item-about {
     border-right: none;
     overflow: hidden;
     text-align: center;
   }
   .text-item {
     text-align: left;
   }
   .text-item p span {
     color: #e9bd71;
     text-transform: none;
     font-weight: 600;
     font-size: 0.8rem
   }
 }
 /*---little-about----*/

 .section-little-about {
   padding: 60px 0 0 0;
   background: #9c702a url(i/bg_beers.jpg) center/cover;
   background-attachment: fixed;
   color: #333;
   transition: all .6s ease;
 }
 .box-about {
   height: auto;
   position: relative;
   width: 100%;
   transition: all .6s ease;
   z-index: 0;
   background: url(i/bg_brewery_.png) bottom/cover;
   background-attachment: fixed;
 }
 .img-box-about {
   padding-top: 30%;
 }
 .section-little-about .text-box {
   padding: 30px;
 }
 .section-little-about p {
   line-height: 2;
   font-size: 1rem;
 }
 .big_string {
   font-size: 2rem;
   color: #9c3022;
   font-weight: 900
 }
 .img-box a span {
   width: 100%;
   height: 1px;
   background: #fff;
   display: block;
   margin-bottom: 8px;
   transition: all .3s ease;
 }
 .img-box a:hover>span {
   margin-bottom: 15px;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .section-little-about {
     padding: 60px 0;
     background: #9c702a url(i/bg_beers.jpg) repeat center;
   }
   .section-little-about .text-box {
     text-align: left !important;
     padding: 0px;
   }
   .img-box-about {
     padding-top: 0px;
   }
 }
 /*---mansory----*/

 .mansory-item {
   width: 50%;
 }

     .mansory-item-25 {
   width: 25%;
   }

 .mansory-item-30 {
   width: 33.333%;
 }
 .mansory-item-70 {
   width: 65%;
 }
 .mansory-item-100 {
   width: 100%;
 }
 .mansory-effect {
   background: #000;
   cursor: pointer;
   height: 100%;
   overflow: hidden;
   position: relative;
   width: 100%;
   z-index: 1;
 }
 .mansory-effect img {
   width: calc(100% + 50px);
   opacity: 1;
   -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
   transition: opacity 0.35s, transform 0.35s;
   max-width: none;
   position: relative;
   display: block;
   height: auto;
 }
 .mansory-effect .caption {
   position: absolute;
   bottom: 60px;
   left: 60px;
   color: #fff;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   z-index: 2;
 }
 .mansory-effect h2, .mansory-effect p {
   transform: translate3d(0, 40px, 0);
   -webkit-transform: translate3d(0, 40px, 0);
   -moz-transform: translate3d(0, 40px, 0);
   -ms-transform: translate3d(0, 40px, 0);
 }
 .mansory-effect h2 {
   transition: transform 0.35s;
   -webkit-transition: -webkit-transform 0.35s;
   font-size: 35px;
   line-height: normal;
 }
 .mansory-effect p {
   color: #fff;
   opacity: 0;
   -webkit-transition: opacity 0.2s, -webkit-transform 0.35s;
   transition: opacity 0.2s, transform 0.35s;
   font-size: 16px;
   margin-top: 5px;
 }

 .mansory-effect p span {
  display: block;
 }

 .mansory-effect .button {
   color: #fff;
   text-transform: uppercase;
   background: #9c3022;
   padding: 10px 40px;
   display: inline-block;
   font-size: 13px;
   cursor: pointer;
 }
 .mansory-effect:hover img {
   opacity: 0.5;
 }
 .mansory-effect:hover p {
   opacity: 1;
 }
 .pull-left .mansory-effect:hover img {
   transform: translate3d(-40px, 0, 0);
   -webkit-transform: translate3d(-40px, 0, 0);
   -moz-transform: translate3d(-40px, 0, 0);
   -ms-transform: translate3d(-40px, 0, 0);
 }
 .pull-right .mansory-effect:hover img {
   transform: translate3d(-30px, 0, 0);
   -webkit-transform: translate3d(-30px, 0, 0);
   -moz-transform: translate3d(-30px, 0, 0);
   -ms-transform: translate3d(-30px, 0, 0);
 }
 .mansory-effect:hover h2, .mansory-effect:hover p {
   transform: translate3d(0, 0, 0);
   -webkit-transform: translate3d(0, 0, 0);
   -moz-transform: translate3d(0, 0, 0);
   -ms-transform: translate3d(0, 0, 0);
 }
 .mansory-effect:hover p {
   -webkit-transition-delay: 0.05s;
   transition-delay: 0.05s;
   -webkit-transition-duration: 0.35s;
   transition-duration: 0.35s;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .mansory-item {
     width: 100%;
   }
   .mansory-item-70 {
     width: 100%;
   }
   .mansory-item-100 {
     width: 100%;
   }

    .mansory-item-25 {
   width: 100%;
   }

   .mansory-effect .caption {
     left: 10px;
     bottom: 10px;
   }
   .mansory-effect h2 {
     font-size: 16px;
   }
   .mansory-effect p {
     font-size: 12px;
   }
 }
 /*mansory-brewery*/

 .mansory-brewery {
   position: relative;
   overflow: hidden;
 }
 .item-abot-brewery {
   width: 100%;
   padding: 5px;
   margin-bottom: 30px;
 }
 .item-abot-brewery .w100 {
   width: 100%;
 }
 .item-abot-brewery50 {
   width: 48%;
 }
 .item-abot-brewery33 {
   width: 31%;
 }
 .item-abot-brewery25 {
   width: 23%;
 }
 .item-abot-brewery10 {
   width: 10%;
 }
 .text-block-brewery {
   background: #fff;
   color: #000;
   padding: 15px;
 }
 .text-block-brewery-dark {
   background: url(i/bg_footer.jpg);
   color: #fff;
 }
 .text-block-brewery-red {
   background: url(i/table-red.jpg);
   color: #fff;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .item-abot-brewery .w100 {
     width: 100%;
   }
   .item-abot-brewery50 {
     width: 100%;
   }
   .item-abot-brewery33 {
     width: 100%;
   }
   .item-abot-brewery25 {
     width: 100%;
     ;
   }
   .item-abot-brewery10 {
     width: 100%;
   }
   .mansory-brewery {
     position: relative;
     overflow: hidden;
     padding: 0;
     margin: 0;
   }
 }
 /*------section-footer-------*/

 .section-footer {
   background: url(i/bg_footer.jpg);
   color: #dad5b5;
   padding: 40px 0;
   position: relative;
   z-index: 1
 }
 .section-footer .text {
   margin-bottom: 15px;
 }
 .section-footer .text p {
   font-weight: 300px;
   font-size: 0.9rem;
   padding: 0px;
   margin: 0px;
 }
 .section-footer .text h4 {
   font-family: Russo One;
   font-size: 0.9rem;
   letter-spacing: 1px;
   font-weight: 100;
   padding: 0px;
   margin: 0px;
 }
 .copy {
   font-weight: 500;
   background: #0a0a0a;
   color: #fff;
   padding: 15px 0;
   font-size: 0.8rem;
 }
 .copy p {
   margin: 0px;
   padding: 0px;
   font-size: 0.7rem;
 }
 /*--instagram-row-----*/

 .Instagram {
   margin-bottom: 15px;
 }
 .instagram-row {
   display: block;
   padding: 0px;
   margin: 0px;
   overflow: hidden;
 }
 .instagram-row li {
   float: left;
   width: 25%;
   list-style: none;
   padding: 15px;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .instagram-row li {
     width: 50%;
   }
 }
 .instagram-row li a {
   display: block;
   text-align: center;
   position: relative;
   background: #333;
   overflow: hidden;
 }
 .instagram-row li a img {
   transition: all .3s ease;
   width: 100%;
 }
 .instagram-row li .user {
   position: absolute;
   top: 30%;
   left: 25%;
   opacity: 0;
   color: #fff;
   transition: all .3s ease;
   z-index: 1;
   font-size: 1.4rem;
   padding: 15px;
 }
 .instagram-row li .user i {
   margin-left: 15px;
 }
 .instagram-row li a:hover>.user {
   opacity: 1
 }
 .instagram-row li a:hover>img {
   opacity: 0.4;
   transform: scale(1.1);
 }
 /*PAGE BERR*/

 .beerpage .section-content {
   padding-top: 120px;
 }
 .section-beer {
   position: relative;
   background: url(i/bg_beers.jpg) bottom/cover;
   background-attachment: fixed;
   width: 100%;
   min-height: 90vh;
   padding-top: 5%;
   overflow: hidden;
 }
 .section-beer-bg {
   background: url(i/bar.jpg) top/cover;
   width: 100%;
   height: 20vh;
   background-attachment: fixed;
   z-index: 0;
 }
 .section-beer h1 {
   font-weight: 800;
   font-size: 2rem;
 }
 .icon-about-beer {
   text-align: center;
   padding: 0px;
   margin: 0px;
   margin-top: 10px;
 }
 .icon-about-beer li {
   display: inline-block;
   list-style: none;
   width: 24%;
   vertical-align: top;
   text-align: center;
   font-size: 0.8rem
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .section-beer h1 {
     font-weight: 800;
     font-size: 3rem;
   }
   .icon-about-beer li {
     width: 48%;
   }
 }
 .row-beer {
   text-align: left;
   margin: 0px;
   padding: 0px;
 }
 .row-beer .item-beer {
   padding: 15px;
   list-style: none;
   float: left;
   width: 25%;
   transition: all .3s linear;
   position: relative;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .row-beer .item-beer {
     width: 100%;
   }
   .row-beer {
     display: block;
     flex-direction: row;
   }
 }
 .item-beer-open {
   z-index: 2;
 }
 .description-action {
   z-index: 10;
   cursor: pointer;
   position: relative;
   top: 0px;
   transition: all .1s linear;
 }
 .description-action:after {
   content: "";
   position: absolute;
   width: 60%;
   right: 20%;
   height: 40px;
   border-radius: 50%;
   background: #333;
   bottom: 10px;
   z-index: -1;
   opacity: 0.2;
   filter: blur(9px);
   transition: all .1s linear;
 }
 .description-action img {
   z-index: 10;
 }
 .description-action:hover {
   top: -10px;
 }
 .description-action:hover:after {
   filter: blur(13px);
   bottom: -3px;
   height: 20px;
 }
 .bg-title {
   font-size: 3rem;
   font-weight: 800;
   opacity: 0;
   position: absolute;
   right: -39%;
   color: #333;
   font-family: Russo One;
   transition: all .3s linear;
   z-index: -1;
   white-space: nowrap;
   bottom: 10%;
 }
 .bg-title-left {
   right: auto;
   left: -10%
 }
 .description-action:hover>.bg-title {
   transition: all .3s linear;
   opacity: 0.1;
   bottom: 13%
 }
 .caption-beer {
   opacity: 0;
   position: absolute;
   z-index: -2;
   bottom: 20px;
  
   left: -150px;
   width: 400px;
   padding: 15px;
   height: auto;
   background: url(i/caption-beer.jpg) bottom/cover;
   box-shadow: 0px 10px 22px rgba(0, 0, 0, 0.1);
   transition: all .3s ease;
 }
 .caption-beer-r {
   left: -150px;
 }
 .caption-beer {
   color: #fff;
 }
 .item-beer-open .description-action {
   top: -10px;
 }
 .item-beer-open .caption-beer {
   opacity: 1;
   z-index: 15;
   bottom: 20px;
   left: -50px;
 }
 .item-beer-open .caption-beer-r {
   left: -50px;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .caption-beer {
     position: relative;
     left: 0px;
     bottom: 100px;
     width: 100%;
     opacity: 1;
     z-index: 1;
   }
   .item-beer-open .caption-beer {
     left: 0px;
     bottom: 100px;
   }
 }
 .price-list {
   padding-top: 80px;
 }
 .table-box {
   padding-top: 80px;
 }
 .bg_craft {
   background: url(i/table-red.jpg) repeat;
 }
 /*BREYWERY*/

 .section-brewery {
   position: relative;
   background: url(i/about_brewery.jpg) top/cover;
   background-attachment: fixed;
   height: 100vh;
   width: 100%;
   color: #fff;
   padding-top: 60px;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .section-brewery {
     height: auto;
   }
 }
 .section-brewery em {
   background: rgba(0, 0, 0, 0.5);
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   position: absolute;
   z-index: 0;
 }
 .section-brewery-history {
   position: relative;
   background: url(i/bg-brewery.jpg) bottom repeat;
   background-attachment: fixed;
   width: 100%;
   padding: 60px 0;
 }
 .block-history {
   background: url(i/table-red.jpg) repeat;
   color: #fff;
   padding: 15px;
   font-size: 1rem;
   line-height: 2;
   text-transform: uppercase;
   box-shadow: 0px 10px 22px rgba(0, 0, 0, 0.3);
   transition: all .3s ease;
   transform: rotate(-1deg);
   margin-bottom: 45px;
 }

.block-history-dark {
    background: none;
    display: inline-block; 
 box-shadow: 0px 10px 22px rgba(0, 0, 0, 0);
	   transform: rotate(0deg);
}

 .block-history p {
   padding: 0px;
   margin: 0px;
 }
 .border-img {
   border: 3px solid #fff;
   margin: 3px;
   box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
 }
 .border-img3 {
   transform: rotate(3deg);
 }
 .border-img-3 {
   transform: rotate(-3deg);
 }
 .btngo {
   background: url(i/table-red.jpg);
   color: #fff;
   display: inline-block;
   text-decoration: none;
   padding: 7px 30px;
   border: 1px solid #fff;
   box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
   transform: rotate(-2deg);
   margin-top: 30px;
 }
 .btngo:hover {
   text-decoration: none;
   color: #fff;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .border-img {
     border: 1px solid #fff;
     margin-bottom: 3px;
     box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
   }
 }
 /*HOTEL*/

 .section-hotel {
   position: relative;
   background-attachment: fixed;
   height: 100vh;
   width: 100%;
   padding-top: 60px;
 }

 .section-hotel2 {
   background: url(i/bg_hotel2.jpg) center/cover;
 }

 .section-info {
   position: relative;
   background: url(i/bg-brewery.jpg) bottom repeat;
   background-attachment: fixed;
   width: 100%;
   padding: 30px 0;
   overflow: hidden;
 }

.hotel-text {
  padding-top: 40px;

}

 .hotel-text p, .hotel-text li {
  line-height: 1.5;
  font-size: 1.2rem;
}

 .section-hotel em {
   background: rgba(0,0,0,0.2)  url(i/bg_em.png);
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px; 
   position: absolute;
   z-index: 2;
 }

 .slider {
   position: absolute;
   left: 0;
   top: 0;
   right: 0;
   bottom: 0;
   z-index: -1;
   overflow: hidden;
   -webkit-transition: all 0.9s ease-in-out;
 }
 .slide {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
 transform-origin: center;
   background-size: cover;
   background-position: center;
   transform: translate3d(1px, 0, 0) scale(1.1);
   opacity: 0;
   transition: opacity 0.7s ease, transform 1s ease-in-out;
   backface-visibility: hidden;
   perspective: 1000;
   }
 .slide.active {
   transform: translate3d(0, 0, 0);
   opacity: 1;
 }


 .hotel {
   padding: 10%;
   color: #fff;
   z-index: 3; 
   position: relative;

 }
 .booking {
   background: url(i/table-red.jpg);
   display: block;
   padding: 15px 0;
   color: #fff;
 }
 .booking h2 {
   font-size: 1.4rem;
 }
 /*BAR*/

 .section-bar {
 position: relative;
   background-attachment: fixed;
   height: 100vh;
   width: 100%;
   padding-top: 60px;
 }
 .section-bar em {
   background: rgba(0, 0, 0, 0.2);
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   position: absolute;
   z-index: 0;
 }
 #map {
   width: 100%;
   height: 97vh;
   margin-top: 40px;
   position: absolute;
   overflow: hidden;
   z-index: 1
 }
 .contact {
   position: absolute;
   top: 76px;
   left: 0px;
   width: 300px;
   padding: 15px;
   background: url(i/bg_menu.png);
   z-index: 2;
   color: #fff;
 }
 .contact a {
   color: #fff;
 }
 @media (max-width: 786px) and (min-width: 100px) {
   .contact {
     width: 100%;
     position: relative;
     top: 0px;
     left: 0px;
   }
 }


  /*BANKET*/

   .section-banket {
   position: relative;
   background-attachment: fixed;
   height: 100vh;
   width: 100%;
   padding-top: 60px;
 }
  

  .section-banket em {
   background: rgba(0, 0, 0, 0.2);
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   position: absolute;
   z-index: 0;
 }

 .item-photos {
  width: 50%;
  float: left;
 }

 .item-photos-100 {
width: 100%;
 }

 .item-photos-33 {
width: 33.3333%;
 }



  .item-photos a{
display: block;
overflow: hidden;
  }

    .item-photos a img {
      width: 100%;
      transition: all .3s ease;
        filter: grayscale(0);
    }

      .item-photos a:hover> img {
        filter: grayscale(1);
      }

 @media (max-width: 786px) and (min-width: 100px) {
  .item-photos a img {
      width: 100%;
      transition: all .3s ease;
        filter: grayscale(0);
    }

     .item-photos {
  width: 100%;
  float: left;
 }

 .item-photos--mob {
    width:50%;
 }


 }

   .section-spa {
   position: relative;
   background-attachment: fixed;
   height: 100vh;
   width: 100%;
   padding-top: 60px;
 }
  

  .section-spa em {
   background: rgba(0, 0, 0, 0.5);
   width: 100%;
   height: 100%;
   top: 0px;
   left: 0px;
   position: absolute;
   z-index: 0;
 }

 .owl-dots {
  text-align: center;
  position: relative;
  margin-top: 15px;
 }

 .owl-carousel button.owl-dot {
background: #ecbf71;
display: inline-block;
margin: 5px;
position: relative;
width: 12px;
height: 12px;
border-radius: 50%; 
vertical-align: middle;
transition: all .3s ease-in-out;
opacity: 0.7;
}

.owl-carousel button.owl-dot:hover {
  transform: scale(1.3);
  opacity: 1
}

 .owl-carousel button.active {
    transform: scale(1.3);
  opacity: 1

 }

 .section-apart {
  padding: 60px 0; 
 }

  .section-apart-mob {
   padding-top: 120px
 }


.appart {
  overflow: hidden;
}

.item-apart .img{
  padding: 30px;
  border: 1px solid #ecbf71;
}


 @media (max-width: 786px) and (min-width: 100px) { 
.item-apart .img{
  padding: 5px;
}


 .section-apart {
  padding: 15px 0; 
 
 }

 .section-apart-mob {
   padding-top: 60px
 }

 }

.rang {
margin: 0 auto;
}

.rang svg {
  width: 100px;
  height: 65px;
}

.rang path {
  fill: #fff;
}



.b-project-item {
   float: left;
   width: 25%;
   background: #000;
   position: relative;
   overflow: hidden;
 }

  @media (max-width: 786px) and (min-width: 100px) { 
.b-project-item {
   width: 50%;
 }
  }
 
 .b-project-item a {
   transition: all .5s ease-in-out;
   overflow: hidden;
 }
 .b-project-item a:before {
   content: " ";
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   background: rgba(0, 0, 0, 0.5);
   z-index: 2;
   opacity: 0;
   transition: all .5s ease-in-out;
 }
 .b-project-item a img {
   width: 100%;
   transform: scale(1.03);
   transition: all .5s ease-in-out;
 }
  
 .b-project-item a:hover>img {
   transform: scale(1.1);
   filter: sepia(1);
 }
 
 .b-project-item a:hover:before {
   opacity: 1;
 }

 .section-hotel-ruls {
  background: url(i/hotel/hotel-4.jpg) center/cover;
  padding: 0px;
  min-height: 100vh;
 }


.b-ruls {
  padding: 35px;
  background: rgba(0,0,0,0.9) url(i/bg_em.png);
  margin-left: -15px;
   min-height: 100vh;
}

  @media (max-width: 786px) and (min-width: 100px) { 
.b-ruls {
  margin-left: 0px;
 }
  }

.b-ruls * {
  color: #f1e6e0;
}

.b-form {
    padding: 100px;
}


  @media (max-width: 786px) and (min-width: 100px) { 
.b-form {
    padding: 15px;
}

  }


.sendbutton {
  cursor: pointer;
  color: #fff !important;
}


.datapic {
  position: relative;
}

.datapic i {
  position: absolute;
  right: 21px;
  top: 38px;
  font-size: 1.2rem;
}

.otherinfo {
  padding-top: 45px;
}

.b-form * {
  color: #333;
}

.b-form h2 {
    color: #fff;

}

.b-form label {
  color: #fff;
}

.section-feed {
  background: url(i/hotel/bg_booking.jpg) center/cover;
  padding: 0px;
  min-height: 100vh;
}

  @media (max-width: 786px) and (min-width: 100px) { 
.section-feed  {
    padding-top: 60px;
}

  }



.bron a, .phone  a {
  color: #fff;
  text-decoration: none;
    border: 1px solid #c38b58;
  padding: 8px;
  margin-top: 6px;
  margin-right: 10px;
 display: block;
 transition: all .3s ease-in-out
}

.phone  a { 
    border: 1px solid transparent;
}

.phone a i {
  font-size: 1.3rem;
}

  @media (max-width: 786px) and (min-width: 100px) {
 .phone a span {
   display: none;
 }

  .phone a {
    border: 1px solid #c38b58;
  }

  .bron {
    margin-right: 5px;
  }

  .phone {
    margin-right: 5px;
  }

     
 }

.bron a:hover {
   color: #c38b58;
   border: 1px solid #fff;
}

.book {
padding: 15px;
background: #e1e1e1;
}

.price p span {
  font-size: 1.2rem;
 color: #c38b58;
 font-weight: bold;
}

.b-form .errors {
color: #fff !important;
background: url(i/table-red.jpg) repeat;
}


.section-menu {
   padding: 100px 0 0 0;
   background: #9c702a url(i/bg-menu.jpg) center/cover;
   background-attachment: fixed;
 
 }
 
.section-menu em {
   background: rgba(0, 0, 0, 0.7);
 bottom: 0;
 right: 0;
   top: 0;
   left: 0;
   position: absolute;
   z-index: 0;
 }
 
 .section-menu *{
 	color:#fff;
 }
 
 .menus-header {
   padding-top: 5%;
      padding-bottom: 5%;
 }
 
 
  .section-menu td {
  font-size: 1.1rem;
   padding-top: 15px;
      padding-bottom: 15px;
  }
  
    .section-menu td small {
     font-size: 0.9rem;	
    }
    
     .section-menu h3 {
     	font-size:1.3rem;
     }
     
      .section-menu .table-responsive {
      	padding-bottom: 60px;
      }
      

.nav_meny {
	position: relative;
	overflow: hidden;
}

.nav_meny_item ul {
	display: block;
	position: relative;
		padding: 0;
	margin: 0;
}
 
 

.nav_meny_item  li {
	list-style: none;
	margin-bottom: 5px;
}

.nav_meny_item  li a {
	display: block;
	border: 1px solid #fff;
	padding: 5px;
}

.nav_meny_item li a:hover {
color: #fff
}

.section-contact {
	min-height: 100vh;
}