/* Resets */
body,html,ul,ol,li,h1,h2,h3,h4,table,form,p{margin:0;padding:0;}img{border:0;}
textarea {font-family: inherit;font-size: inherit;}
*:focus {outline: 0;}
/*------------------------------------------------------------------*/
/* Default Styles													*/
/*------------------------------------------------------------------*/

/* Prevent scrolling when side menu is open css section */
html.menu-open, body.menu-open {overflow: hidden;height: 100%;}

.clr {clear:both;}


@font-face {
    font-family: 'Inter Regular';
    src: url('Inter-Regular.woff2') format('woff2'),
        url('Inter-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OpenSans Regular';
    src: url('OpenSans-Regular.woff2') format('woff2'),
        url('OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Antonio Bold';
    src: url('Antonio-Bold.woff2') format('woff2'),
        url('Antonio-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat Regular';
    src: url('Montserrat-Regular.woff2') format('woff2'),
        url('Montserrat-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat SemiBold';
    src: url('Montserrat-SemiBold.woff2') format('woff2'),
        url('Montserrat-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat Bold';
    src: url('Montserrat-Bold.woff2') format('woff2'),
        url('Montserrat-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}




:root {
  --primary-color: #00acb2;
  --secondary-color: #edb27e;
  --third-color: #92b5dd;
  --fourth-color: #d1def0;
  --fifth-color: #993921;
}


body {background-color:var(--fourth-color);font-family: "Inter Regular", Verdana, sans-serif;font-size: 16px;color:#777;margin: 0px;padding: 0px;}



/* default buttons */
.vc_btn3-shape-rounded {background: url(../images/icon_foot.svg) left 8px center / 50px 50px no-repeat!important;font-family: "Montserrat Bold", Verdana, sans-serif;font-weight:bold;font-weight:bolder;font-size:26px!important;padding:15px 0 15px 0!important;border:none!important;background-color:var(--primary-color)!important;color:#fff!important;transition: 0.3s;border-radius:34px!important;}
.vc_btn3-shape-rounded:hover {opacity:0.8;}

.rounded-top img {border-top-left-radius:8px!important;border-top-right-radius:8px!important;}

.alt01 .vc_general {background-color:var(--secondary-color)!important;}
.alt02 .vc_general {background-image:none!important;font-size:20px!important;}

.vc_box_rounded img {border-radius:10px!important;}

/*------------------------------------------------------------------*/
/* Layout Styles													*/
/*------------------------------------------------------------------*/

.wrap {width: 800px;margin: auto;position:relative;}

#header {height:80px;background-color:#fff;}
#header h1 {width: 180px;height: 28px;top:24px;position:relative;z-index:3;left:0;right:0;margin:auto;}
#header h1 a {background: url(../images/logo_barefoot.png) no-repeat;text-indent: -1000em;display: block;width: 100%;height: 100%;background-size:180px 28px;}

#header #grip-container {position:absolute;top:30px;right:23px;z-index:2;font-size:14px;}
#header #grip-container ul {list-style:none;text-transform:uppercase;}
#header #grip-container ul li {display:inline;color:#fff;margin-right:30px;}
#header #grip-container ul li a {text-decoration:none;color:#fff;transition: 0.3s;}
#header #grip-container ul li a:hover {opacity:0.7;}

#header #grip {display:block;cursor:pointer;float:left;width: 22px;height: 15px;position: relative;margin: 3px 0 0 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition: .5s ease-in-out;transition: .5s ease-in-out;}
#header #grip span {display: block;position: absolute;height: 2px;width: 100%;background: var(--fifth-color);border-radius: 0;opacity: 1;left: 0;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;}
#header #grip span:nth-child(1) {top: 0px;-webkit-transform-origin: left center;-moz-transform-origin: left center;-o-transform-origin: left center;transform-origin: left center;}
#header #grip span:nth-child(2) {top: 6px;-webkit-transform-origin: left center;-moz-transform-origin: left center;-o-transform-origin: left center;transform-origin: left center;}
#header #grip span:nth-child(3) {top: 12px;-webkit-transform-origin: left center;-moz-transform-origin: left center;-o-transform-origin: left center;transform-origin: left center;}
#header #grip.open span:nth-child(1) {-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);top: -3px;left: 3px;}
#header #grip.open span:nth-child(2) {width: 0%;opacity: 0;}
#header #grip.open span:nth-child(3) {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);top: 12px;left: 3px;}

#mobilemenu {
  display: flex;
  overflow-y: auto;
  flex-direction: column;
  position: fixed;
  top: 0;
  right: 0;
  width: min(490px, 100vw);
  height: 100vh;
  box-sizing: border-box;
  background: var(--primary-color);
  
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  
  z-index: 2;

  box-shadow: -12px 0 20px rgba(255,255,255,0.2);

  transform: translateX(100%);
  opacity: 0;
  transition: transform 0.8s ease, opacity 0.8s ease;
  /*background-image: url(../images/bg_mobilemenu01.jpg)!important;*/
}


#mobilemenu.visible {transform: translateX(0);opacity: 1;}

#mobilemenu a {color:#fff;text-decoration:none;display:inline;float:none;}
#mobilemenu a:hover {opacity:0.8;}
#mobilemenu ul {margin:0 0 0 0;color:#fff;text-align: center;width:100%;}
#mobilemenu ul li {list-style:none;padding:0 0 15px 0;float:none;font-size:24px;font-weight:normal;}


.menu-main-container {padding: 130px 0 50px 0px; box-sizing: border-box; flex: 0 1 auto;}
.menu-main-container #logoinmenu {}

#bottom-menu-slidein {margin-top: auto;width:100%;display:block;background-color:var(--third-color);visibility:hidden;}

#bottom-menu-slidein .social {box-sizing:border-box;padding:20px 0 20px 0;display: flex;align-items: center;gap: 12px;justify-content: center;}
#bottom-menu-slidein .social a {display: inline-flex;align-items: center;}
#bottom-menu-slidein .social img {display: block;}
#bottom-menu-slidein .social .social-email {color:var(--secondary-color);}

.qdc-gallery {border-radius:20px!important;overflow:hidden;}


#content {line-height:24px;}
#content .wrap {box-sizing:border-box;padding:0 50px 0 50px;background-color:#fff;}
#content .wrap h1 {font-size:42px;color:#010101;line-height:50px;font-weight:normal;margin:30px 0 20px 0;}
#content .wrap h2 {font-family: "Montserrat Bold", Verdana, sans-serif;font-weight:bold;margin:17px 0 17px 0;font-size:40px;color:var(--primary-color);line-height:47px;}
#content .wrap h3 {font-family: "Montserrat Bold", Verdana, sans-serif;font-weight:bold;color:var(--primary-color);margin:14px 0 14px 0;line-height:28px;font-size:26px;}
#content .wrap h4 {font-weight:normal;margin:14px 0 14px 0;font-size:22px;}
#content .wrap p {margin:0 0 14px 0;line-height:20px;}
#content .wrap a {color:var(--primary-color);text-decoration:none;}
#content .wrap a:hover {color:var(--secondary-color);text-decoration:none;}

#content .wrap ul {margin:14px 0 14px 18px;}
#content .wrap ul li {}


/* food menu intro */

.restaurant-highlights {width: min(100%, 560px);margin: 0 auto;container-type: inline-size;}
.highlight-item {position: relative;width: 100%;height: 31cqw;margin-bottom: 12cqw;}
/* orange pill */
.highlight-item::before {content: "";position: absolute;top: 4cqw;bottom: 4cqw;background: var(--secondary-color);border-radius: 999px;z-index: 1;}
.highlight-item.image-left::before {left: 15cqw;right: 3cqw;}
.highlight-item.image-right::before {left: 3cqw;right: 15cqw;}
/* circle image */
.highlight-item img {position: absolute;top: 0;width: 31cqw;height: 31cqw;object-fit: cover;border-radius: 50%;z-index: 3;box-shadow: 0 0.6cqw 1.5cqw rgba(0,0,0,0.18);}
.highlight-item.image-left img {left: 0;}
.highlight-item.image-right img {right: 0;}
/* text block */
.highlight-content {position: absolute;top: 50%;transform: translateY(-50%);z-index: 2;text-align: center;}
.highlight-item.image-left .highlight-content {left: 31cqw;right: 7cqw;}
.highlight-item.image-right .highlight-content {left: 7cqw;right: 31cqw;}
.highlight-content h4 {font-family: "Montserrat Bold", Verdana, sans-serif;font-weight:bold;margin: 0 0 4px 0!important;font-size: 24px!important;line-height: 0.95;color: #fff;}
.highlight-content p {margin: 0!important;font-size: 16px!important;line-height: 1.08;color: #333;}
.highlight-content a {display: inline-block;margin-top: 0.5cqw;font-size: 18px!important;line-height: 1;font-weight: 700;color: #0076bd!important;text-decoration: none;}
.highlight-content a:hover {text-decoration: underline;}


/* food menu */

.foodmenumainstyle .menu-item {display: grid;grid-template-columns: minmax(0, 1fr) auto;gap: 30px;align-items: start;padding: 28px 0 0 0;xborder-bottom: 2px solid rgba(75, 36, 27, 0.18);}
.foodmenumainstyle .menu-item:first-child {padding-top: 0;}
.menu-text {min-width: 0;}
.menu-text h3 {font-size: clamp(16px, 1.25vw, 20px)!important;margin: 0 0 6px 0!important;color:#000!important;line-height: 1.2!important;font-weight: 800;letter-spacing: 0;}
.menu-text p {font-size: clamp(10px, 1.25vw, 20px)!important;margin: 0;line-height: 1.6!important;color: #000;}
.menu-price {font-size: clamp(10px, 1.25vw, 20px)!important;background: none;color: #000;padding: 7px 12px 6px 12px;line-height: 1;white-space: nowrap;font-family: "Montserrat Regular", Verdana, sans-serif!important;font-weight:normal;}

.foodmenutitle {z-index:999;position:relative;}


/* reviews  on homepage */
.on-review-slider {
  position: relative;
  min-height: 480px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.on-review-track {
  position: relative;
  width: 100%;
  max-width: 960px;
  min-height: 280px;
  box-sizing: border-box;
  text-align: center;
  overflow: hidden;
  background-color: var(--primary-color);
  border-radius: 18px;
}

.on-review-slide {
  position: absolute;
  top: 50%;
  left: 120px;
  right: 120px;
  opacity: 0;
  transform: translateY(-50%) translateX(0);
  pointer-events: none;
  box-sizing: border-box;
}

.on-review-slide.is-active {opacity: 1;pointer-events: auto;}
/* Next/right arrow animation */
.on-review-slide.slide-in-right {animation: aovSlideInRight .55s ease forwards;}
.on-review-slide.slide-out-left {animation: aovSlideOutLeft .55s ease forwards;}
/* Previous/left arrow animation */
.on-review-slide.slide-in-left {animation: aovSlideInLeft .55s ease forwards;}
.on-review-slide.slide-out-right {animation: aovSlideOutRight .55s ease forwards;}

@keyframes aovSlideInRight {
  from {
    opacity: 0;
    transform: translateY(-50%) translateX(80px);
  }
  to {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
}

@keyframes aovSlideOutLeft {
  from {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
  to {
    opacity: 0;
    transform: translateY(-50%) translateX(-80px);
  }
}

@keyframes aovSlideInLeft {
  from {
    opacity: 0;
    transform: translateY(-50%) translateX(-80px);
  }
  to {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
}

@keyframes aovSlideOutRight {
  from {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
  to {
    opacity: 0;
    transform: translateY(-50%) translateX(80px);
  }
}
.on-review-slide p {color: #fff;font-size: 16px;line-height: 20px;margin: 0;font-weight:normal;}
.on-review-slide h4 {font-family: "Antonio Bold", Georgia, serif;color: #fff;font-size: 18px;line-height: 27px!important;margin: 0;font-weight:bold;}
.on-review-arrow {position: absolute;top: 50%;transform: translateY(-50%);width: 68px;height: 68px;border-radius: 50%;border: none;background-color: rgba(255,255,255,0);opacity:0.7;background-repeat: no-repeat;background-position: center center;background-size: 22px auto;cursor: pointer;z-index: 2;padding: 0;transition: background-color .25s ease, opacity .25s ease;}
.on-review-arrow:hover {background-color: rgba(255,255,255,0);opacity:1;}
.on-review-prev {left: 40px;background-image: url(../images/arrow03_left.svg);background-position: calc(50% - 2px) 50%;}
.on-review-next {right: 40px;background-image: url(../images/arrow03_right.svg);background-position: calc(50% + 2px) 50%;}


/* image gallery */

.qdc-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

.qdc-gallery a {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #fff;
  text-decoration: none;
}

.qdc-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* White transparent layer */
.qdc-gallery a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.55);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
}

/* Overlay text container */
.qdc-overlay-text {
  position: absolute;
  inset: 0;
  z-index: 2;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  width: 100%;
  max-width: 80%;
  margin: 0 auto;

  text-align: center;
  text-transform: uppercase;
  color: #4b241b;

  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

/* Main title: SOUPS, SEAFOOD, WINE, etc. */
.qdc-title {
  display: block;
  font-family: "Inter Regular", Verdana, sans-serif;
  font-size: clamp(20px, 2.5vw, 44px)!important;
  font-weight: bolder!important;
  line-height: 1.05;
  letter-spacing: 0px;
  padding-top:25px;
}

/* Smaller subtitle */
.qdc-subtitle {
  display: block;
  max-width: 150px;
  margin-top: 6px;

  font-family: "Inter Regular", Verdana, sans-serif;
  font-size: clamp(12px, 1.2vw, 28px)!important;
  font-weight: normal;
  line-height: 1.15;
  letter-spacing: 0.5px;

  white-space: normal;
}

/* Desktop hover only */
@media (hover: hover) and (pointer: fine) {
  .qdc-gallery a:hover img {
    opacity: 0.45;
    transform: scale(1.03);
  }

  .qdc-gallery a:hover::before,
  .qdc-gallery a:hover .qdc-overlay-text {
    opacity: 1;
  }
}







/* contact page */
#contact-page {background-color:var(--primary-color);color:#fff!important;}
#contact-page #wpcf7-f8-p2-o1 input, #contact-page #wpcf7-f8-p2-o1 textarea {color:var(--primary-color)!important;border:none!important;border-radius:10px;background-color:#a5dadc;box-sizing:border-box;width:100%;padding:10px 24px;font-size:20px;}
#contact-page #wpcf7-f8-p2-o1 input.wpcf7-submit {cursor:pointer;padding:20px 0 20px 0!important;color: var(--primary-color)!important;}
#contact-page #wpcf7-f8-p2-o1 input.wpcf7-submit:hover {background-color:var(--secondary-color);color:#fff!important;}
#contact-page h3 {color:#fff!important;}





.scrollToTop{
	text-indent:-2000em;
	width:45px; 
	height:45px;
	text-align:center; 
	text-decoration: none;
	position:fixed;
	bottom:14px;
	left:14px;
	display:none;
	background: url(../images/icon_top.svg) no-repeat center center var(--secondary-color);
	background-size: 25px 25px;
	opacity:0.7;
	-webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
	box-sizing:border-box;
	z-index:999;
}
.scrollToTop:hover{	opacity:1;}


#footer {background-color:var(--primary-color);font-size:18px;box-sizing:border-box;padding:24px 0 10px 0;}
#footer a {color:#fff;text-decoration:none;}
#footer .wrap {box-sizing:border-box;padding:30px;}

#footer .wrap h3 {font-size:24px;color:#fff;margin:0 0 7px 0;font-weight:bold;letter-spacing:-1px;}

#footer .wrap ul {font-size:18px;}
#footer .wrap li {font-weight:bold;margin:0 0 6px 0;list-style:none;padding:0 0 0 33px;}

#footer .wrap li.time {background: url(../images/icon_time.svg) no-repeat 0 1px;background-size:22px 22px;}
#footer .wrap li.location {background: url(../images/icon_location.svg) no-repeat 0 1px;background-size:22px 22px;}
#footer .wrap li.phone {background: url(../images/icon_phone.svg) no-repeat 0 1px;background-size:22px 22px;}

#footer .social .social-icons {padding:20px 0 0 0;}
#footer .social .social-email {display:none;}

.footer-info {float:left;}

.footer-tripadvisor {text-align:right;float:right;}
.footer-tripadvisor img {width:100px;height:100px;}



/*------------------------------------------------------------------*/
/* media queries													*/
/*------------------------------------------------------------------*/

@media only screen and (min-width: 220px) and (max-width: 800px) { 

.wrap {width:100%;box-sizing:border-box;}


.qdc-gallery {border-radius:0!important;}

#content .wrap {box-sizing:border-box;padding:0 7px 0 7px;}

#abouttext p {max-width:340px;}
#content .wrap #homesplash p {max-width: 300px; margin: auto!important;}

.qdc-gallery {grid-template-columns: repeat(3, 1fr);}
.qdc-gallery a::before {opacity: 1;background: rgba(255, 255, 255, 0.35);}
.qdc-overlay-text {opacity: 1;max-width: 85%;}
.qdc-title {font-size: 22px;}
.qdc-subtitle {font-size: 12px;max-width: 120px;}

.footer-tripadvisor img {width:60px;height:60px;}

  .on-review-slider {
    min-height: 460px;
  }

  .on-review-track {
    min-height: 260px;
    border-radius: 12px;
  }

  .on-review-slide {
    left: 75px;
    right: 75px;
  }

  .on-review-slide h4 {
    font-size: 18px;
    line-height: 20px;
    margin-bottom: 12px;
  }

  .on-review-slide p {
    font-size: 15px;
    line-height: 21px;
  }

  .on-review-prev {
    left: 8px;
  }

  .on-review-next {
    right: 8px;
  }

  .on-review-arrow {
    width: 56px;
    height: 56px;
    background-size: 18px auto;
  }

}

/* Small mobile */
@media (max-width: 320px) {
.qdc-gallery {grid-template-columns: 1fr;}
.qdc-title {font-size: 24px;}
.qdc-subtitle {font-size: 13px;max-width: 130px;}
}
