/*

Theme Name: My theme

Author: Nlandgraf

Description: My theme custom theme

Version: 0.0.1

*/



:root {

  --greenish: #aee10b;

  --orange: #ff461b;

  --ligh-gray: #eeecee;

}



:focus {

  outline: none;

}

::-moz-focus-inner {

  border: 0;

}

button:focus {

  outline: none;

}

button::-moz-focus-inner {

  border: 0;

}

html {

  scroll-behavior: smooth;

}

#main {

  margin-top: 66px;

}

html,

body {

  font-family: "Mabry Pro", helvetica, Arial;

  margin: 0;

  line-height: 1.2em;

  color: #000;

}

h3 {

  margin: 0 0 2px;

  font-size: 30px;

  font-weight: 500;

}

p {

  font-size: 22px;

  color: #000;

  margin: 0 0 10px;

  font-weight: 300;

  line-height: 1.2em;

}

.container {

  max-width: 1080px;

  width: 90%;

  margin: 0 auto;

}

h1,

h2,

h3 {

  margin: 0 0 30px;

  line-height: 1.2em;

}

h4,

h5,

p {

  margin: 0 0 15px;

  line-height: 1.2em;

}

div {

  box-sizing: border-box;

}

/********* MENU **************/

.logo-menu {

  display: flex;

}

.site-logo img {

  width: 220px;

  display: flex;

}

.logo-menu {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding-top: 15px;

}

.burguer-holder {

  display: none;

}

nav .menu {

  display: flex;

  gap: 30px;

  list-style: none;

  padding: 0;

}

nav .menu li a {

  color: #000;

  text-decoration: none;

  font-weight: 400;

  font-size: 16px;

}

.burguer-holder {

  display: none;

}

header {

  z-index: 3;

  position: fixed;

  width: 100%;

  top: 0;

  left: 0;

  background-color: #fff;

}



.menu-opener {

  position: relative;

  display: inline-block;

  text-align: right;

  height: 100%;

  width: 25px;

  float: right;

  cursor: pointer;

  z-index: 3333;

}

.line-burguer {

  height: 3px;

  width: 27px;

  background-color: #000;

  display: inline-block;

  top: calc(50% - 1px);

  position: absolute;

  right: 0;

  -webkit-transition: all 0.2s;

  -o-transition: all 0.2s;

  transition: all 0.2s;

}

.line-burguer::after {

  bottom: 9px;

}

.line-burguer::before,

.line-burguer::after {

  content: "";

  height: 3px;

  width: 27px;

  background-color: #000;

  display: inline-block;

  position: absolute;

  right: 0;

  -webkit-transition: all 0.2s;

  -o-transition: all 0.2s;

  transition: all 0.2s;

}

.line-burguer::before {

  top: 9px;

}

.menu-active .line-burguer::before,

.menu-active .line-burguer::after {

  background-color: #000;

}

.menu-active .line-burguer {

  background-color: transparent;

}

.menu-active .line-burguer::before {

  -webkit-transform: rotate(-45deg);

  -ms-transform: rotate(-45deg);

  transform: rotate(-45deg);

  top: -1px;

  height: 4px;

}

.menu-active .line-burguer::after {

  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  transform: rotate(45deg);

  bottom: 0;

  height: 4px;

}

.burguer-holder {

  height: 40px;

}

#mobile-menu li {

  list-style: none;

}

#mobile-menu {

  display: none;

}

#mobile-menu .sub-menu {

  display: block;

  position: relative;

  top: 0;

  left: 0;

  opacity: 1;

  pointer-events: all;

  width: auto;

  padding-top: 0;

  background-color: transparent;

}

@media (max-width: 980px) {

  .nav-booking {

    display: block;

  }

  .nav-menu .lang-holder,

  .nav-menu .header-booking {

    display: flex;

    justify-content: center;

  }

  .lang-holder a {

    color: var(--gris-oscuro);

    font-size: 19px;

  }

  .lang-holder .lang-item {

    border-color: var(--gris-oscuro);

  }

  .lang-holder {

    margin-bottom: 5px;

    margin-top: 5px;

  }

  .nav-menu > div {

    width: 100%;

  }

  nav .menu {

    gap: 12px;

  }

  .header-booking {

    display: none;

  }

  .top-menu {

    display: none;

  }

  .logo-menu .container {

    padding: 0;

  }

  #main {

    margin-top: 73px;

  }

  header {

    position: fixed;

    top: 0;

    left: 0;

  }

  .admin-bar header {

    top: 32px;

  }

  .nav-menu {

    display: none;

  }

  .logo-menu {

    padding: 10px 0;

    z-index: 33333;

  }

  .burguer-holder {

    display: block;

    z-index: 333333;

    margin-left: 10px;

  }

  .menu-icons-holder {

    display: flex;

    align-items: center;

    z-index: 33333333;

  }

  #site-logo {

    z-index: 33333;

  }

  .menu-active #mobile-menu {

    right: 0;

  }

  .nav-menu ul li a {

    color: var(--celeste);

    font-weight: 600;

    line-height: 1.2em;

    margin: 0 auto;

    font-size: 17px;

    padding: 7px 0;

    width: 100%;

  }

  .nav-menu .sub-menu li a {

    font-size: 16px;

    line-height: 1em;

    padding: 6px 0;

    border-bottom: 1px solid rgba(0, 0, 0, 0.1);

    opacity: 1;

  }

  .nav-menu .sub-menu li:last-child a {

    border-bottom: none;

  }

  .nav-menu li.btn-item.menu-item {

    margin-top: 5px;

  }

  .nav-menu ul.sub-menu li {

    line-height: 1.6em;

    border: none;

  }

  .nav-menu .menu {

    padding: 0;

    text-align: left;

    flex-basis: 100%;

    flex-direction: column;

  }

  .nav-holder {

    flex-direction: column;

    flex-basis: 100%;

    align-items: center;

  }

  .nav-holder > div {

    flex-basis: 100%;

    width: 100%;

  }

  .nav-menu {

    position: fixed;

    top: -100vh;

    left: 0;

    width: 100%;

    height: auto;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    flex-direction: column;

    background-color: #fff;

    padding: 83px 5% 30px;

    gap: 10px;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    box-sizing: border-box;

    -webkit-transition: top 0.6s;

    -o-transition: top 0.6s;

    transition: top 0.6s;

    overflow-y: scroll;

    max-height: 100vh;

  }

  .admin-bar .nav-menu {

    padding: 115px 5% 30px;

  }

  .menu-active .nav-menu {

    top: 0;

  }

  .nav-menu ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    list-style: none;

    margin: 0;

    padding: 0 0;

  }

  .nav-menu ul li {

    margin: 0;

    text-align: left;

    width: 100%;

    padding: 0;

    line-height: 2em;

  }

  .nav-menu .menu-main-menu-container {

    width: 100%;

  }

  .nav-menu ul.sub-menu {

    padding-bottom: 9px;

    display: flex;

    flex-direction: column;

    display: none;

    transition: none;

  }

  .logo-menu img {

    width: 150px;

    margin: 7px 0;

  }

  .header-redes {

    margin-left: auto;

    gap: 10px;

    margin-right: 10px;

    z-index: 333;

  }

  .logo-menu .header-redes img {

    width: 25px;

    margin: 0;

  }

  .nav-menu ul li.menu-item-has-children {

    position: relative;

  }

  .logo-menu::before {

    content: "";

    width: 100%;

    height: 100%;

    position: absolute;

    left: 0;

    top: 0;

    background-color: #fff;

    z-index: 333;

  }

  .sub-menu-toggle {

    padding: 0 10px;

    height: 100%;

    position: absolute;

    right: 0;

  }

  .nav-menu ul li.menu-item-has-children > a::after {

    content: none;

  }

  .nav-menu .turn-off ul.sub-menu {

    display: block;

    padding-left: 13px;

  }

}



/********* MENU END ***********/