#btnMenu {
    display: flex;
    position: fixed;
    z-index: 102;
    right:0; top:0;
    width:4.5em;
    height:4.5em;
    padding:1.65em 1.25em;
    background-color: var(--gold-color);
    border:none;
    transform:translate3d(100%,0,0);
    transition: transform .35s, background-color .35s;
    cursor: pointer;
}
#btnMenu .middle {
    position: relative;
    width:100%;
    height:100%
}

#btnMenu.fixed, #btnMenu.active, #btnMenu.fixed.active {
    transform:translate3d(0,0,0);
}
#btnMenu:hover {
    background-color: var(--light-gold-color);
}

#btnMenu span {
    position:absolute;
    top:0; right:0;
    width:0;
    height:2px;
    background-color:white
}
#btnMenu span:nth-child(2) {
    top:50%;
    transform:translate3d(0,-50%,0);
}
#btnMenu span:nth-child(3) {
    top:auto;
    bottom:0;
}

#btnMenu.fixed span, #btnMenu.active span {width:100%;}

#btnMenu span:nth-child(1) {
    transition: .25s .1s;
}
#btnMenu span:nth-child(2) {
    transition: .25s .15s;
}
#btnMenu span:nth-child(3) {
    transition: .25s .2s;
}

#closeMenu {
    position:fixed;
    z-index: 103;
    right:1.25em; top:1.25em;
    color: white;
    background: none;
    border: none;
    font-size: 1.25em;
    line-height: 0;
    cursor: pointer;
}
#fullscreenMenu {
    opacity: 0;
    visibility: hidden;
    position: fixed;
    z-index: 102;
    width:100%;
    height:100vh;
    transition: opacity .25s, visibility .25s;
}
#btnMenu.active + #fullscreenMenu {
    opacity: 1;
    visibility: visible;
}

#fullscreenMenu .right {
    display: flex;
    z-index: 2;
    align-items: center;
    position: absolute;
    right: 0;
    height: 100vh;
    width: 30%;
    min-width:22em;
    padding: 3em;
    transform:translate3d(100%,0,0);
    background: var(--gunmetal-color);
}
#fullscreenMenu .left {
    display: flex;
    z-index: 1;
    align-items: center;
    position: absolute;
    left: 0;
    height: 100vh;
    width: 70%;
    transform:translate3d(-100%,0,0);
    background: var(--gunmetal-color);
}

#fullscreenMenu .background {
    opacity: .125;
    background-size: cover;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    z-index: -1;
}
#fullscreenMenu .logo {
    position: absolute;
    width: clamp(8.5em, 5em + 4vw, 10em);
    top: 2em;
    left: 2em;
}

#fullscreenMenu .right.animate, #fullscreenMenu .left.animate {
    transition:transform .35s cubic-bezier(0,0,0.3,1);
}

#btnMenu.active + #fullscreenMenu .right, #btnMenu.active + #fullscreenMenu .left {
    transform:translate3d(0,0,0);
}
#fullscreenMenu .main a {    
    opacity: 0;
    display: block;
    color: white;
    text-transform: uppercase;
    font-size: clamp(1.625rem, 1rem + 1vw, 1.875rem);
    font-weight: 300;
    letter-spacing: .05em;
    margin-bottom: .5em;
    transform:translate3d(25%,0,0);
    transition: color .35s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .main a:last-child {
    margin-bottom: 0;
}
#fullscreenMenu .main a.active {color:var(--gold-color)}
#fullscreenMenu .main a:hover {color:var(--gold-color)!important}

#fullscreenMenu .main:hover a {
    color:white
}


#fullscreenMenu .right.animate a{
    transition:transform .25s .1s cubic-bezier(0,0,0.3,1), opacity .35s .1s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .right.animate a:nth-child(2){
    transition:transform .25s .15s cubic-bezier(0,0,0.3,1), opacity .35s .15s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .right.animate a:nth-child(3){
    transition:transform .25s .2s cubic-bezier(0,0,0.3,1), opacity .35s .2s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .right.animate a:nth-child(4){
    transition:transform .25s .25s cubic-bezier(0,0,0.3,1), opacity .35s .25s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .right.animate a:nth-child(5){
    transition:transform .25s .3s cubic-bezier(0,0,0.3,1), opacity .35s .3s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .right.animate a:nth-child(6){
    transition:transform .25s .35s cubic-bezier(0,0,0.3,1), opacity .35s .35s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .right.animate .sub {
    transition:transform .25s .4s cubic-bezier(0,0,0.3,1), opacity .35s .4s cubic-bezier(0,0,0.3,1);
}

#btnMenu.active + #fullscreenMenu .main a, #btnMenu.active + #fullscreenMenu .sub {
    opacity: 1;
    transform: translate3d(0,0,0);
}

#fullscreenMenu .sub {
    position: absolute;
    opacity: 0;
    transform:translate3d(25%,0,0);
    margin-top: clamp(3rem, 2rem + 2vw, 4rem);
}
#fullscreenMenu .sub p {
    margin:0;
    font-size:clamp(1rem, .5rem + .75vw, 1.125rem);
    font-weight: 300;
}
#fullscreenMenu .sub b {
    color:var(--gold-color);
    font-weight: 900;
    margin-right: .5em;
}
#fullscreenMenu .sub a {
    color:white;
}
#fullscreenMenu .sub a.instagram {
    display: inline-block;
    margin-top:2em;
    font-size: calc(1em + .25vw);
}
#fullscreenMenu .sub i {
    color:var(--gold-color)}

#fullscreenMenu [class^="panel_"] {
    opacity:0;
    position: absolute;
    left:0;top:0;
    height:100vh;
    width:100%;
    transform:scale(1.1);
    transition:transform .35s cubic-bezier(0,0,0.3,1), opacity .35s cubic-bezier(0,0,0.3,1);
}

#fullscreenMenu [class^="panel_"].active {
    opacity: 1;
    z-index: 3;
    transform:none;
}

.panel-container {
    display: flex;
    align-items: center;
    position: relative;
    height:100%;
    width:100%;
    padding: 0 10%
}

#fullscreenMenu h2 {
    font-size: clamp(1.5rem, 1rem + 1.25vw, 2rem);
    font-weight: 500;
    color:white;
    margin-bottom: .5em;
}
#fullscreenMenu h2 + p { 
    color:white;
    font-size: clamp(.9375rem, .5rem + .5vw, 1rem);
    line-height: 2;
    margin:0;
    max-width: 35em;
}

/* INICIO */
#fullscreenMenu .contact-address {
    margin-top: 4em;
}
#fullscreenMenu .contact-address h2 {
    font-size: clamp(1.25rem, 1rem + .85vw, 1.75rem);
}

#fullscreenMenu .contact-address p {
    font-size: clamp(1.05rem, .5rem + .75vw, 1.125rem);
    color:white;
    line-height: 1.8;
    margin:0;
}
#fullscreenMenu .contact-address p:last-of-type{
    margin-top:3em
}

#fullscreenMenu a.send_message {
    position: relative;
    font-weight: 700;
    color:white;
}

#fullscreenMenu .phoneNumber {
    display: block;
    margin-top:.5em;
    color:var(--gold-color);
    font-size: clamp(1.25rem, 1rem + .5vw, 1.5rem);
}


#fullscreenMenu .panel_1 .arrowButton{
    position: absolute;
    right: 3em;
    bottom: 3.5em;
}
#fullscreenMenu .arrowButton b {
    color:white;
}
#fullscreenMenu .arrowButton span::before {
    border-top: 2px solid white;
    border-right: 2px solid white;
}

/* EXPERIENCIAS */
#fullscreenMenu .panel_2 .center {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 7em;
    width: 100%;}
#fullscreenMenu .panel_2 nav {
    display: flex;
    flex-direction: column;
    line-height: 2;
    min-width: 25em;
}
#fullscreenMenu .panel_2 nav a {
    font-family: var(--font-header);
    position: relative;
    font-size: clamp(1.5rem, .85rem + 1vw, 1.85rem);
    line-height: 2.25;
    font-weight: 500;
    color:white;
    transition: padding .35s cubic-bezier(0,0,0.3,1), color .35s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .panel_2 nav a::before {
    content: "";
    display: inline-block;
    position: absolute;
    top:calc(50% + 2px); left:0;
    height:1px;
    width:0;
    background-color:var(--gold-color);
    transform:translate3d(0,-50%,0);
    transition:width .35s cubic-bezier(0,0,0.3,1);
}

#fullscreenMenu .panel_2 nav a:hover:before {
    width:1.5em;
}
#fullscreenMenu .panel_2 nav a:hover {
    color:var(--gold-color);
    padding-left:2em;
}

#link_images {
    display: flex;
    position: relative;
    width:325px;
    height:430px;
}
#fullscreenMenu .panel_2 img {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: auto;
    transform: translate3d(0,-50%,0);
    transition: opacity .35s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .panel_2 img.active {opacity: 1;}


/* DESTINOS */
#fullscreenMenu .panel_3 .center {
    flex-direction: column;
    color:white;
    margin-top:11em;
    width: 100%;
}

#fullscreenMenu .panel_3 h2:last-child {
    text-align: right;
}
#fullscreenMenu .continents {
    display: flex;
    justify-content: flex-start;
    align-items: start;
    flex-wrap: wrap;
    gap: 0 2em;
}
#fullscreenMenu .continents p {
    display: inline-block;
    line-height: 2.25;
    margin:0;
}
#fullscreenMenu .continents span {
    color:var(--gold-color);
    font-weight: 400;
    margin-left: .25em;
}

#fullscreenMenu .continent_images {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    margin: clamp(1.5em, 1em + 1vw, 2em) 0 0;
    gap: .75em
}

#fullscreenMenu .panel_3 a {
    display: flex;
    justify-content: center;
    position: relative;
    overflow: hidden;
    flex-basis:calc(25% - .57em);
}

#fullscreenMenu .panel_3 a > h3 {
    position: absolute;
    top:50%;
    left:0; right:0;
    transform:translate3d(0,-50%,0);
    color:white;
    text-align: center;
    font-size: clamp(.85rem, .5rem + .5vw, .9375rem);
    text-transform: uppercase;
    letter-spacing: 0.125em;
    font-weight: 800;
    margin:0 1.5em;
    transition: opacity .35s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .panel_3 a:hover > h3 {
    opacity: 0;
}

#fullscreenMenu .panel_3 a::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left:0; right:0;
    top:0;
    background-color: hsla(0,0%,0%,.25);
    transition: background-color .35s cubic-bezier(0,0,0.3,1);
}
#fullscreenMenu .panel_3 a:hover::before {
    background-color:transparent;
}

#fullscreenMenu .panel_3 figcaption {
    position: absolute;
    z-index: 2;
    bottom: .75em;
    left: 1em;
    text-align: center;
    font-family: "playfair display";
    font-size: 1.425em;
}

#fullscreenMenu .panel_3 img {
    width:100%;
    min-width: 18em;
    height:auto;
}


/* TESTIMONIOS */
#fullscreenMenu .panel_4 .center {margin-top:9em}
#fullscreenMenu .testimonials {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .75em;
    margin-top: clamp(1.5em, 1em + 1vw, 2em);
}
#fullscreenMenu .testimonials figure {
    position: relative;
    flex-basis: calc(33.33% - .5em);
}
#fullscreenMenu .testimonials img {
    width:100%;
    height: auto;
}
#fullscreenMenu .testimonials figure:after {
    opacity:.45;
    content:"";
    position: absolute;
    top: 0;
    left: 0;
    height:100%;
    width:100%;
    background:black   
}
#fullscreenMenu .testimonials figcaption {
    display: flex;
    flex-direction: column;
    justify-content: end;
    position: absolute;
    z-index: 1;
    top:0; left:0;
    padding:10%;
    height:100%;
    color:white;
    text-align: left;
}
#fullscreenMenu .testimonials figcaption h3 {
    font-size: clamp(1.05rem, .5rem + .75vw, 1.175rem);
    font-weight: 700;
    margin: 0;
}

#fullscreenMenu .testimonials img {
    width:100%}


/* THE TEAM */
#fullscreenMenu .panel_6 .center {
    width:100%;
    margin-top: 7em;}
#fullscreenMenu .panel_6 .text {max-width:40em}
#fullscreenMenu .partnerships {
    display: flex;
    align-items: center;
    position: absolute;
    right: 3.5em;
    bottom: 3.5em;
}
#fullscreenMenu .partnerships a {
    margin-right: 2.5em;
}

#fullscreenMenu .partnerships a:last-child {margin:0;}
#fullscreenMenu .partnerships img {height:calc(.5vw + 5.25em)}
#fullscreenMenu .partnerships img.serendipians {
    height: calc(.5vw + 2.25em);
  }
#fullscreenMenu .staff {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1.25em;
  margin-top: clamp(1.5em, 1.5em + 1.5vw, 3em);
}
#fullscreenMenu .staff a {
    flex-basis: calc(33.33% - .84em);
    max-width: 13em;
}
#fullscreenMenu .staff figure {
    position: relative;
    border-radius: 50%;
    overflow:hidden
}
#fullscreenMenu .staff img {
    width:100%;
    height: auto;
}

#fullscreenMenu .staff figcaption {
    opacity: 0;
    visibility: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top:0; left:0;
    height:100%;
    width:100%;
    font-family: var(--font-header);
    font-size: clamp(1.25rem, 1rem + 1vw, 1.5rem);
    font-weight: 500;
    color: white;
    text-align: center;    
    background-color: var(--gold-color);
    transition: opacity .35s ease, visibility .35s ease;
}
#fullscreenMenu a:hover figcaption {
    opacity: 1;
    visibility: visible;
}

/* Contact */
#fullscreenMenu .panel_7 .center {
    flex-basis:calc(100% - 9em);
    margin-top: 7em;
    max-width: 35em;
    margin-right: 7.5%;
}
#fullscreenMenu .panel_7 .arrowButton .arrow {
    width:50px;
}
#fullscreenMenu .panel_7 .arrowButton:hover .arrow::before {
    left: 55%;
}
#fullscreenMenu .panel_7 .panel-container {padding-right: 5%;}
#fullscreenMenu form {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    margin-top: clamp(2em, 1.5em + 1.5vw, 3em);
}
#fullscreenMenu .input-wrap {
    flex-basis: calc(50% - .5em);
    margin-bottom: 2em;
}
#fullscreenMenu .input-wrap:nth-child(2n) {margin-right: 1em;}

#fullscreenMenu .textarea {flex-basis:100%; margin: 0!important;}
#fullscreenMenu input,#fullscreenMenu textarea {
    width: 100%;
    border: none;
    border-bottom:1px solid white;
    background: transparent;
    color: white;
    padding: .25em;
    padding-left: 0;
}
#fullscreenMenu .empty, #fullscreenMenu .invalid {border-color:hsl(0, 52.2%, 49.2%) !important}
#fullscreenMenu .panel_7 .arrowButton.success::before, #fullscreenMenu .valid {border-color: hsl(85.1, 91.7%, 37.8%) !important}

#fullscreenMenu .panel_7 .arrowButton.success:hover::before {background-color:hsl(85.1, 91.7%, 37.8%)}

#fullscreenMenu .panel_7 .arrowButton.error::before {border-color:hsl(0, 52.2%, 49.2%)}
#fullscreenMenu .panel_7 .arrowButton.error:hover::before {background-color:hsl(0, 52.2%, 49.2%)}


#fullscreenMenu  .empty + span, #fullscreenMenu  .invalid + span {
	display:block;
	opacity:1;
	width:100%;
	padding:.625em .125em;
	color: hsl(0, 75%, 60.8%)
}

#fullscreenMenu .empty + span::before, #fullscreenMenu .empty + span::before{content:attr(data-empty)!important;}
#fullscreenMenu .invalid + span::before, #fullscreenMenu .invalid + span::before {content:attr(data-invalid);}



#fullscreenMenu textarea {height:6em}

#sendButton b::before {content:attr(data-prompt);}
#sendButton.sending b::before {content:attr(data-sending);}
#sendButton.success b::before {content:attr(data-success);}
#sendButton.error b::before {content:attr(data-error);}

#fullscreenMenu .button {margin-top:2em; min-width:16em}
#fullscreenMenu .arrowButton::before {
    border: 2px solid var(--gold-color);}



@media screen and (max-width:85em) {
    #fullscreenMenu .panel_2 .panel-container {padding-right: 5%;}

}

@media screen and (max-width:80em) {
    #fullscreenMenu .panel_3 a {
        flex-basis: calc(33.33% - .5em);}
    
}

@media screen and (max-width:73.125em) {

    #fullscreenMenu .left {width:calc(100% - 22em)}

        /*TESTIMONIAL*/
        #fullscreenMenu .testimonials figure:last-child {display: none;}
        #fullscreenMenu .testimonials figure {
            flex-basis: calc(50% - .375em);
        }

}
@media screen and (max-width:70em) {
    #link_images {display: none;}
}
@media screen and (max-width:64em) {
    #btnMenu {
        transform:translate3d(0,0,0);
    }
    #btnMenu span {width:100%}

    #fullscreenMenu .left {
        display: none;
    }
    #fullscreenMenu .right {
        width: 100%;
        padding-left: 5%;
        padding-right: 10%;
        min-width: 0;
        justify-content: center;
    }
    #fullscreenMenu .sub {position: relative}
}