/*
@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400&display=swap');
*/
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
.my-1 { margin-top: 1em; margin-bottom: 1em; }
.my-2 { margin-top: 2em; margin-bottom: 2em; }
.my-3 { margin-top: 3em; margin-bottom: 3em; margin-left:3em; margin-right:1em; }
.my-4 { margin-top: 4em; margin-bottom: 4em; }
.my-5 { margin-top: 5em; margin-bottom: 5em; }
.mt-5 { margin-top: 5em; }
.mt-4 { margin-top: 4em; }
.pd-1 { padding: 1em; }
.pdr-2 { padding-right: 2em; }
.pdl-2 { padding-left: 2em; }
.mb-8 { margin-bottom: 8em; }
.pl-2 { padding-left: 2em; padding-bottom: 1em; }
.pl-3 { padding-left: 3em; }
.pi-s { padding-inline-start: 1em; }
.pi-e { padding-inline-end: 1em; }
.ml-3 { margin-left: 3em; }
.px-1 { padding-right: 1em; padding-left: 1em; }
.px-2 { padding-right: 2em; padding-left: 2em; }
.py-1 { padding-top: 1em; padding-bottom: 1em; }
.py-2 { padding-top: 2em; padding-bottom: 2em; }
.white { color: #fff; }
.black { color: #000; !important; }
.silver { color: silver; }
.gray { color: #3C3D4D; }
.brown { color: #C77A46; }
.bold { font-weight: bold; }
.italic { font-style: italic; }
.inline-block { display: inline-block; }
body, p, h1, h2, h3, ul, li{ color: #3C3D4D; }
html, body { font-family: "Outfit"; }
p { font-size: 1.2rem; }
#top { position: relative; }
#slides { z-index: 0; }
/* Small only */
@media screen and (max-width: 39.9375em) {
  .extra-h1 { font-size: 3em; }
  #top{ height: 100vh; background: url('../img/slides/surque1.jpg')no-repeat  center; background-size: cover; }
  .icon-surque-txt { position: absolute; bottom: 0; right: 0; max-height: 250px; z-index: 6; }  
}
/* Medium and up */
@media screen and (min-width: 40em) {
  .extra-h1 { font-size: 5em; }
  .icon-surque-txt { position: absolute; bottom: 2em; right: 4em; max-height: 250px; z-index: 4; }
  .m-pl-3 { padding-left: 3em; }
  .m-ml-3 { margin-left: 3.5em; }
}
.logo { max-height:100px; }
#menu { position: absolute; width: 100%; height: 100%; max-height: 500px; z-index: 5; top: 0; }
.li-res {  border:solid 1px #C77A46; border-left: none; margin-top: 1em; }
.li-res:hover {  background: #F97316; }
.li-res:hover a { color: #fff; }
#collapsing-tabs, .tabs-content { border:none;  }
.tabs-title { float:none !important; display:inline-block; }
.tabs-title a { font-size: 1em; text-transform: uppercase; background: none!important; }
li.is-active { border-bottom: solid 1px #C77A46; }
.tabs { text-align:center; }
.hr { border-width: 5px; width: 50px; border-color: #C77A46;  }
.box-prop { background: url('../img/bgs/surco.jpg') no-repeat; background-size: cover; padding-top: 8em; padding-bottom: 2em; margin-top: -20px; }
.box-prop h3 { line-height: 2em; text-shadow: 0px 0px 6px black; }
.box-menu { background-color: #E6E9E5; background-size: cover; padding-top: 8em; padding-bottom: 2em; }
.social-menu li { display: inline-block; margin: 0 10px 0 10px; }
.social-menu li img { max-height: 70px; }
.icon-surco { max-height: 150px; margin-top: -50px; }
.icon-reserva { max-height: 200px; }
#capital { font-size:200%; float:left; padding-right:10px; line-height: 1; }
.bg-dinner { background-color: #f5f5f5fa; }


.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
.leeq { padding: 1em 3em; }






.nav-container li {
  list-style: none;
}

.nav-container a {
  text-decoration: none;
  color: #0e2431;
  font-weight: 500;
  font-size: 1.1rem;
}

.nav-container a:hover{
    font-weight: bolder;
}

.nav-container {
  /*display: block;
  position: relative;
  height: 60px;
  margin: -1.5em;*/
  display: block;
  position: absolute;
  height: 60px;
  margin: 0;
  top: 0;
  right: 0;
}

.nav-container .checkbox {
  position: absolute;
  display: block;
  height: 32px;
  width: 32px;
  top: 20px;
  right: 20px;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}

.nav-container .hamburger-lines {
  display: block;
  height: 26px;
  width: 32px;
  position: absolute;
  top: 17px;
  right: 20px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.nav-container .hamburger-lines .line {
  display: block;
  height: 4px;
  width: 100%;
  border-radius: 10px;
  background: #bbb;
}

.nav-container .hamburger-lines .line1 {
  transform-origin: 0% 0%;
  transition: transform 0.4s ease-in-out;
}

.nav-container .hamburger-lines .line2 {
  transition: transform 0.2s ease-in-out;
}

.nav-container .hamburger-lines .line3 {
  transform-origin: 0% 100%;
  transition: transform 0.4s ease-in-out;
}

.menu-items {
  border-left: solid 1px silver;
  position: absolute;
  top: 0;
  right: 0;
  width: 300px;
  height: 100vh;
  z-index: 1;
  background: white;
  transform: translate(300px);
  display: none;
  transition: opacity 2s ease-out;
  opacity: 0;
}

.menu-items ul { margin-left: 0; }
.menu-items li {
  font-size: 1.5rem;
  font-weight: 500;
  padding: 0.5em 1.5em;
}

.nav-container input[type="checkbox"]:checked ~ .menu-items {
  -webkit-animation: open_drawer 300ms ease-in-out;
  -webkit-animation-fill-mode: forwards;
  -webkit-transform: translateX(0);
  opacity: 1;
  display: block;
}


.nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line1 {
  transform: rotate(45deg);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line2 {
  transform: scaleY(0);
}

.nav-container input[type="checkbox"]:checked ~ .hamburger-lines .line3 {
  transform: rotate(-45deg);
}

.nav-container input[type="checkbox"]:checked ~ .logo{
  display: none;
}

@-webkit-keyframes open_drawer {
    to {
        -webkit-transform: translateX(0);
    }
}
.menu-d { padding: 1.5em; }
.mpl1 { padding-left: 20px; }
@media screen and (max-width: 39.9375em) {
  .reservations { font-size: .8em; }
  .menu-d { padding: 1.5em .5em; }
}