@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700;900&display=swap');

p {
   margin: 0;
}

.empir-btn {
   border: 1px solid #c39335;
   color: #c39335;
   font-family: 'Raleway', sans-serif;
   text-transform: uppercase;
   text-decoration: none;
   font-size: 15px;
   font-weight: 500;
   border-radius: 0;
}

.empir-btn:hover {
   background-color: #c39335;
   border: 1px solid #c39335;
   color: white;
}

.container {
   max-width: 1550px;
}

.navbar {
   background: transparent !important;
}

.navbar-wrapper {
   position: relative !important;
   background-color: #080808 !important;
   padding-bottom: 15px;
}

.navbar-toggler {
   font-size: 32px;
   color: white;
}

.navbar-toggler:focus {
   box-shadow: none;
}

.navbar-nav .nav-link {
   color: white;
   text-align: center;
   font-family: 'Open Sans', sans-serif;
   text-transform: uppercase;
   font-size: 13px;
   font-weight: 700;
}

.navbar-nav .nav-link:hover {
   color: #c39335;
}

.navbar-nav .nav-link>.facebook,
.navbar-nav .nav-link>.tiktok,
.navbar-nav .nav-link>.instagram {
   margin-left: 10px;
   margin-right: 10px;
   font-size: 22px;
   color: white;
}

.navbar-nav .nav-link>.facebook:hover,
.navbar-nav .nav-link>.tiktok:hover,
.navbar-nav .nav-link>.instagram:hover {
   color: #c39335;
}

.navbar-nav .nav-link.active,
.navbar-nav .nav-link.show {
   color: white !important;
   font-family: 'Open Sans', sans-serif;
   color: #c39335 !important;
}

.dropdown-item:focus, .dropdown-item:hover {
    background-color: #c39335;
    color: white;
}

.ticket-btn {
   border: 1px solid white;
}

.ticket-btn:hover,
.ticket-btn.active {
   border: 1px solid #c39335;
}

.head-title {
   position: relative;
   width: 100%;
   height: 800px;
}

.head-title>img {
   width: 100%;
   max-width: 100%;
   max-height: 800px;
   object-fit: cover;
}

.head-title .head-title-row {
   width: 100%;
   position: absolute;
   text-align: center;
   top: 55%;
}

.head-title .head-title-row h1 {
   text-transform: uppercase;
   font-weight: 700;
   font-family: 'Raleway', sans-serif;
   font-size: 45px;
   color: white;
}

.head-title .head-title-row .label {
   font-weight: 400;
   font-family: 'Open Sans', sans-serif;
   font-size: 20px;
   color: white;
   text-transform: uppercase;
}

.head-title .head-title-layer {
   position: absolute;
   width: 100%;
   height: 405px;
   top: 0;
   left: 0;
   background: url(../frontend/images/head_layer.png);
   background-repeat: repeat-x;

}

.carousel-caption {
   text-align: center;
   top: 50%;
   transform: translateY(-20%);
   bottom: initial;
}

.carousel-caption a {
    text-decoration: none;
}

.carousel-caption h1 {
   font-weight: 400;
   font-family: 'Kaushan Script', cursive;
   font-size: 45px;
   color: #c39335;
}

.carousel-caption h2 {
   text-transform: uppercase;
   font-weight: 900;
   font-family: 'Raleway', sans-serif;
   font-size: 45px;
   color: white;
}

.carousel-caption p {
   font-weight: 400;
   font-family: 'Open Sans', sans-serif;
   font-size: 20px;
   color: white;
   text-transform: uppercase;
}

.carousel-indicators {
   margin-bottom: 3rem;
}

.carousel-indicators [data-bs-target] {
   width: 10px;
   height: 10px;
   background-color: transparent;
   border: 1px solid white;
   opacity: 1;
   margin-left: 6px;
   margin-right: 6px;
}

.carousel-indicators .active {
   background-color: #c39335;
   border: 1px solid #c39335;
}

main {
   width: 100%;
}

.foods .header {
   width: 100%;
   min-height: 340px;
}

.foods .header>.layer {
   width: 100%;
   background: url(../frontend/images/head_bg_layer.png);
   background-position: left bottom;
   background-repeat: repeat-x;
}

.foods .header>.layer h1 {
   text-transform: uppercase;
   font-weight: 700;
   font-family: 'Raleway', sans-serif;
   font-size: 45px;
   color: white;
}

.foods .header>.layer .label {
   text-transform: uppercase;
   font-weight: 400;
   font-family: 'Raleway', sans-serif;
   font-size: 14px;
   color: white;
}

.foods .foods-container {
   max-width: 1920px;
   margin-left: auto;
   margin-right: auto;
}

.foods .food-list-row {
   padding-top: 15px;
   padding-bottom: 15px;
}

.foods .food-list>.item {
   padding-top: 15px;
   padding-bottom: 15px;
}

.foods .food-list>.item>.titles>.title {
   line-height: 0;
   background: url(../frontend/images/dots.png);
   background-repeat: repeat-x;
   background-position: left bottom;
}

.foods .food-list>.item>.titles>.title h5 {
   display: inline-block;
   background: white;
   margin-bottom: -4px;
   padding-top: 5px;
   padding-bottom: 0;
   padding-right: 8px;
   text-transform: uppercase;
   font-weight: 600;
   font-family: 'Raleway', sans-serif;
   font-size: 18px;
   color: #080808;
}

.foods .food-list>.item>.titles .subtitles {
   margin-top: 10px;
   text-transform: uppercase;
   font-weight: 500;
   font-family: 'Raleway', sans-serif;
   font-size: 10px;
   color: #080808;
}

.foods .food-list>.item>.price {
   margin-left: 15px;
}

.foods .food-list>.item>.price span {
   font-family: 'Open Sans', sans-serif;
   font-weight: 700;
   font-size: 15px;
   color: white;
   padding: 7px 15px;
   background-color: #caa459;
   border-radius: 5px;
}

.top-foods {
   overflow: hidden;
}

.top-food-body {
   max-width: 384px;
}

.top-food-body img {
   max-width: 100%;
   object-fit: cover;
   transition: transform .2s;
}

.top-food-body .layer {
   visibility: hidden;
   position: absolute;
   background: rgba(0, 0, 0, 0);
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   transition: 0.3s;
}

.top-food-body .top-food-img .layer>span {
   font-family: 'Open Sans', sans-serif;
   font-weight: 700;
   font-size: 15px;
   color: white;
   padding: 7px 15px;
   background-color: #caa459;
   border-radius: 5px;
   transition: 0.3s;
   opacity: 0;
}

.top-food-body .top-food-img:hover>img {
   transform: scale(1.3);
}

.top-food-body .top-food-img:hover .layer {
   visibility: visible;
   background: rgba(0, 0, 0, 0.7);
}

.top-food-body .top-food-img:hover .layer span {
   opacity: 1;
}

.top-food-body .top-food-title {
   padding-top: 18px;
   padding-bottom: 18px;
   padding-left: 15px;
   padding-right: 15px;
}

.top-food-body .top-food-title h5 {
   margin-bottom: 0;
   text-transform: uppercase;
   font-weight: 600;
   font-family: 'Raleway', sans-serif;
   font-size: 16px;
   color: #080808;
}

.top-food-body .top-food-title .label {
   margin-top: 5px;
   text-transform: uppercase;
   font-weight: 500;
   font-family: 'Raleway', sans-serif;
   font-size: 10px;
   color: #080808;
}

.post {
   max-width: 1920px;
   margin-left: auto;
   margin-right: auto;
   padding-top: 100px;
   padding-bottom: 100px;
}

.events {
   width: 100%;
   min-height: 620px;
   background: url(../frontend/images/block_bg_01.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: right center;
}

.post .content {
   max-width: 830px;
   background-color: rgba(255, 255, 255, 1);
}

.events .content h1 {
   font-weight: 400;
   font-family: 'Kaushan Script', cursive;
   font-size: 45px;
   color: #c39335;
}

.events .content h2 {
   text-transform: uppercase;
   font-weight: 400;
   font-family: 'Raleway', sans-serif;
   font-size: 55px;
   color: #1b1b1b;
}

.events .content .text {
   line-height: 28px;
   font-weight: 300;
   font-family: 'Open Sans', sans-serif;
   font-size: 14px;
   color: #1b1b1b;
}

footer {
   width: 100%;
   background-color: #2f2e2e;
}

footer .footer-col h5 {
   margin-top: 15px;
   margin-bottom: 15px;
   padding-top: 20px;
   padding-bottom: 20px;
   border-bottom: 1px solid #424141;
   text-transform: uppercase;
   font-weight: 600;
   font-family: 'Raleway', sans-serif;
   font-size: 20px;
   color: #c39335;
}

.footer-text {
   padding-top: 5px;
   padding-bottom: 15px;
   line-height: 28px;
   font-weight: 400;
   font-family: 'Raleway', sans-serif;
   font-size: 14px;
   color: white;
}

.footer-nav {
   list-style: none;
   padding-left: 0;
}

.footer-nav .footer-nav-item {
   padding-top: 15px;
   padding-bottom: 15px;
}

.footer-nav .footer-nav-item:first-child {
   padding-top: 7px;
}

.footer-nav .footer-nav-item>a {
   text-decoration: none;
   text-transform: uppercase;
   font-weight: 400;
   font-family: 'Raleway', sans-serif;
   font-size: 16px;
   color: white;
}

.footer-nav .footer-nav-item>a:hover {
   color: #c39335;
}

.footer-contact-block {
   position: relative;
   text-transform: uppercase;
   font-weight: 400;
   font-family: 'Raleway', sans-serif;
   font-size: 16px;
   color: white;
}

.footer-contact-block .address {
   margin-top: 20px;
   margin-bottom: 25px;
}

.footer-col .map {
   position: relative;
}

.footer-col .map>img {
   width: 100% !important;
   max-width: 100% !important;
}

.footer-contact-block .tel {
   margin-bottom: 25px;
}

.footer-navbar {
   background-color: #2c2b2b;
   padding-top: 25px;
   padding-bottom: 25px;
   font-family: 'Open Sans', sans-serif;
   color: white;
   text-transform: uppercase;
   font-size: 12px;
}

.footer-navbar a {
   text-decoration: none;
   font-family: 'Open Sans', sans-serif;
   text-transform: uppercase;
   color: white;
   font-size: 12px;
}

.footer-navbar a:hover {
   color: #c39335;
}

.footer-instagram,
.footer-facebook,
.footer-tiktok {
   margin-left: 10px;
   margin-right: 10px;
   font-size: 22px;
   color: white;
}

.footer-instagram:hover,
.footer-tiktok:hover,
.footer-facebook:hover {
   color: #c39335;
}

.food-main-categories {
   background-color: #e9e9e9;
   padding-top: 45px;
   padding-bottom: 45px;
}

.food-category {
   background-color: #e9e9e9;
   transition: 0.3s;
   opacity: 1;
}

.food-category:hover {
   border-radius: 5px;
   background-color: #caa459;
   opacity: 1;
}

.food-category:hover img {
   border-radius: 5px;
}

.food-category-title h5 {
   padding-left: 30px;
   padding-right: 30px;
   text-transform: uppercase;
   font-family: 'Raleway', sans-serif;
   font-weight: 700;
   font-size: 25px;
   color: #262626
}

.content {
   padding-top: 70px;
   padding-bottom: 60px;
}

.content .content-wrapper {
   padding-left: 15px;
   padding-right: 15px;
   line-height: 28px;
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   font-size: 16px;
   color: #262626
}

.gallery-col .card-title{
    text-decoration: none;
    font-family: 'Raleway', sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #262626;
}

.gallery-col .card-title a{
    text-decoration: none;
    color: #262626;
}

.breadcrumb-item a{
    font-family: 'Raleway', sans-serif;
    text-decoration: none;
    color: black;
}

.breadcrumb-item a:hover{
    color: #c39335;
}

.gallery .card{
    border-color: black;
}

.gallery-col:hover .card,
.gallery-box:hover .card{
    border: 3px solid #c39335;
}

.category-alert{
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    background-color: #c39335;
    color: white;
}

.products-title{
    text-align: center;
    border-top: 1px solid #d1d1d1;
    border-bottom: 1px solid #d1d1d1;
    padding-top: 19px;
    padding-bottom: 19px;
}
.products-title > h1{
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 0;
    margin-left: 23px;
    margin-right: 23px;
}

@media screen and (max-width: 991px) {
   .carousel-item>img {
      width: auto !important;
      max-height: 500px;
      object-fit: cover;
   }

   .navbar-collapse {
      margin-top: -4px;
      background: rgb(0, 0, 0);
      background: linear-gradient(180deg, rgba(0, 0, 0, 0.7987570028011204) 10%, rgba(0, 0, 0, 0.7441351540616247) 54%, rgba(0, 0, 0, 0.5914740896358543) 92%, rgba(0, 0, 0, 0.15309873949579833) 100%);
   }

   .navbar-collapse .navbar-nav {
      padding-top: 15px;
   }

   .navbar-nav .nav-link {
      padding-left: 8px;
      padding-right: 8px;
   }

   .ticket-btn {
      margin-top: 5px;
      margin-bottom: 5px;
   }

   .top-food-body {
      max-width: 384px;
      width: 50%;
   }

   .events {
      background-size: cover !important;
      background-position: center !important;
      padding-top: 12px;
      padding-bottom: 12px;
   }

   .post .content {
      background-color: rgba(255, 255, 255, 0.9);
   }

   .foods .header>.layer h1 {
      font-size: 26px;
   }

}

@media screen and (max-width: 640px) {
   .navbar-nav .nav-link {
      font-size: 17px;
   }

   .foods .food-list>.item>.titles>.title {
      background: none;
   }

   .foods .food-list>.item {
      border-bottom: 1px dotted black;
   }

   .foods .food-list>.item:last-child {
      border: 0;
   }

   .footer-contact-block,
   footer .footer-col h5,
   .footer-nav .footer-nav-item {
      text-align: center;
   }

   .head-title {
      height: 500px;
   }

    .top-food-body .top-food-title h5,
    .top-food-body .top-food-title .label{
        text-align: center;
    }

    .head-title .head-title-row h1 {
        font-size: 35px;
    }

    .events .content h1 {
        font-size: 35px;
    }

    .events .content h2 {
        font-size: 40px;
    }
}