/* Librerías */
@import url("bulma/bulma.min.css");
@import url("AnimateCSS.css");

/* Fuentes */
@font-face {
    font-family: 'elegist';
    src: url('fonts/Elegist.woff');
    font-weight: 600;
}
@font-face {
    font-family: 'la-luxes-serif';
    src: url('fonts/La-Luxes-Serif.woff');
}
@font-face {
    font-family: 'fahkwang regular';
    src: url('fonts/Fahkwang-Regular.woff');
}
@font-face {
    font-family: 'fahkwang light';
    src: url('fonts/Fahkwang-Light.woff');
    font-weight: lighter;
}
.nowrap { white-space: nowrap !important; }
.lt-sp-5 { letter-spacing: 5px; }
/* .is-size-1.f1.is-uppercase {  } */
.italic { font-style: italic; }
.f1 { font-family: 'elegist'; line-height: normal; }
.f2 { font-family: 'la-luxes-serif'; letter-spacing: 1px; }
.f3 { font-family: 'fahkwang regular'; }
.f3l { font-family: 'fahkwang light'; }

/* Colores */
:root {
    --color1: #7c8a6d;
    --color2: #556b52;
    --color3: #7b8a6d;
    --color4: #f9f5ec;
}
.transparent { color: transparent; }
.cWhite { color: white; }
.cBlack { color: black; }
.c1 { color: var(--color1); }
.bC1 { background-color: var(--color1); }
.c2 { color: var(--color2); }
.bC2 { background-color: var(--color2); }
.c3 { color: var(--color3); }
.bC3 { background-color: var(--color3); }
.c4 { color: var(--color4); }
.bC4 { background-color: var(--color4); }

/* Estructura */
body { background-color: var(--color2); }
.relative { position: relative; }
.absolute { position: absolute; }
.hvh100 { height: 100vh; }
.hvh90 { min-height: 90vh; }
.center-elem { margin: 0 auto; }
.hr.standar { max-width: 20vw; margin: 1.5rem auto; }

/* Botones */
.pointer { cursor: pointer; }
.bt1, .bt1:visited { color: var(--color4); background-color: var(--color2); border: none; border-radius: 10px; font-family: 'fahkwang light'; }
.bt1:hover { background-color: var(--color3); color: var(--color4); font-style: italic; }
.bt2, .bt2:visited { color: var(--color4); background-color: var(--color3); border: none; border-radius: 10px; font-family: 'fahkwang light'; }
.bt2:hover { background-color: var(--color2); color: var(--color4); font-style: italic; }
.bt1.rsvp, .bt1.rsvp:visited { letter-spacing: 5px; font-family: 'elegist'; }
.bt1.rsvp:hover { background-color: var(--color2); }
.lk1 { color: var(--color2) !important; }
.lk1:hover, .lk1:visited { color: var(--color1); }

/* Selectores */
.selectores div.border { border-bottom: 2px solid var(--color1); }

/* Raíz */
.raiz { background-image: url('../img/raiz/background.jpg'); background-repeat: no-repeat; background-size: cover; background-position: right center; min-height: 90vh; }
.raiz img { max-width: 35vw; }

/* Menu */
.menu { padding-left: 15vw; padding-right: 15vw; background-color: var(--color1); position: fixed; width: 100vw; transition: 0.5s; z-index: 10; }
.menu figure.logo { max-width: 64px; }
.menu .options a.link { color: var(--color4); opacity: 0.8; font-family: 'elegist'; letter-spacing: 3px; }
.menu .options a.link:hover { opacity: 1; }
.menu .options .subMenu { min-width: 18vw; left: 50%; top: 3rem; transform: translate(-50%, 0); }
.menu .options .subMenu > div { background-color: #768771; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
.menu .options .subMenu a.sublink { color: var(--color4); opacity: 0.5; transition: 0.5s; font-family: 'fahkwang regular'; }
.menu .options .subMenu a.sublink:hover { color: var(--color4); opacity: 1; }
/* Menu Mobile */
.menu.has-open { background-color: var(--color4); max-height: 100vh; overflow: auto; }
.menu.has-open .options a.link { color: var(--color1); opacity: 1; }
.menu.has-open .options a.sublink { color: var(--color1); opacity: 0.7; }
/* Ghost menu */
.gmenu { padding-left: 15vw; padding-right: 15vw; }
.gmenu .logo { max-width: 64px; opacity: 0; }

/* Contador */
.contador { background-image: url('../img/countdown/background-countdown.jpg'); background-repeat: no-repeat; background-position: right top; background-size: cover; }
div.contador { min-height: 90vh; }
div.contador img { max-width: 40vw; }
div.contador .countdown { border-color: var(--color4); border-width: 2px; border-style: solid; border-radius: 15px; width: max-content; margin-left: auto; margin-right: auto; }
div.contador .countdown p.is-size-3-tablet.is-size-4-mobile { color: var(--color4); font-family: 'fahkwang light'; letter-spacing: 5px; }
div.contador .countdown p.is-size-7 { color: var(--color4); font-family: 'fahkwang regular'; }
div.contador .countdown p.is-size-7.transparent { color: transparent; }

/* Itinerario */
.itinerario { background-color: var(--color4); }
.itinerario > .columns { min-height: 90vh; }
.itinerario .column.is-narrow { min-height: 90vh; min-width: 1vw; }
.itinerario .column.photo { background-image: url("../img/itinerary/dog.jpg"); background-size: cover; min-height: 90vh; background-repeat: no-repeat; }
.itinerario .column.border { border-left: 2px solid var(--color2); }
.itinerario img.icono { max-width: 18vh; }
/* .itinerario .columns > .column.has-text-centered.bC4.py-5 { background-image: url('../img/icons/cup-right.svg'), url('../img/icons/cup-left.svg'); background-position: 90% 0%, 15% 0%; background-size: 125px, 100px; background-repeat: no-repeat; } */

/* Dress Code */
.dress-code > .columns { min-height: 90vh; }
.dress-code hr { background-color: var(--color2); max-width: 20vw; margin: 1.5rem auto; }

/* Registry */
.registry { background-color: var(--color2); }
.registry > .columns { min-height: 90vh; }
.registry .column.photo { background-image: url("../img/registry/gift.jpg"); background-size: cover; min-height: 90vh; background-repeat: no-repeat; background-position: center center; }
.registry hr { background-color: var(--color4); max-width: 20vw; margin: 2rem auto; }
.registry .qr { background-image: url('../img/registry/qr-zelle.svg'); background-repeat: no-repeat; background-position: center bottom; background-size: 200px; }

/* acommodation */
.accommodation .bt1, bt2 { padding-left: 0rem !important; padding-right: 0rem !important; min-width: 160px; }
.accommodation > .m-0.columns.is-tablet.is-centered.is-multiline.p-0 > .column.is-align-self-stretch { background-image: url('../img/icons/key-2.svg'); background-repeat: no-repeat; background-position: 100% 10%; background-size: 135px; }
.accommodation > .m-0.columns.is-tablet.is-centered.is-multiline.bC1.p-0 { background-image: url('../img/icons/key-1.svg'); background-repeat: no-repeat; background-position: 5% 10%; background-size: 150px; }

/* night life */
.night-life .column.is-12.has-text-centered.pt-6.pb-3.is-align-self-stretch.px-2 { background-image: url('../img/icons/cup-other.svg'); background-repeat: no-repeat; background-size: 150px; background-position: 15% 50%; }

/* restaurants */
.restaurants .column.is-12.has-text-centered.pt-6.pb-3.is-align-self-stretch.px-2 { background-image: url('../img/icons/spaguetti.svg'); background-repeat: no-repeat; background-size: 250px; background-position: 15% 50%; }

/* beauthy salons */
.beauthy-salons { background-image: url('../img/icons/makeup.svg'); background-repeat: no-repeat; background-size: 200px; background-position: 5% 95%; }

/* RSVP */
div.rsvp { background-color: var(--color4); }
div.rsvp > .columns { min-height: 90vh; }
div.rsvp .column.is-narrow { min-height: 90vh; min-width: 1vw; }
div.rsvp .column.photo { background-image: url("../img/rsvp/rsvp.jpg"); background-position: 90% center; background-size: cover; min-height: 90vh; background-repeat: no-repeat; }
div.rsvp .column.border { border-right: 2px solid var(--color2); }
div.rsvp .column.has-text-centered.bC4 .py-6 { padding-left: 6rem; padding-right: 6rem; }
div.rsvp .field.entrada { padding-left: 3rem; padding-right: 3rem; }

/* Form */
.label { font-weight: normal !important; }
input[type=radio] { display: none; }

input[type=radio] + label { background: url('../img/rsvp/radio-no-check.svg'); background-repeat: no-repeat; background-position: left center; background-size: 24px 24px; padding: 4px 0px 4px 35px; }
input[type=radio]:checked + label { background-image: url('../img/rsvp/radio-check.svg'); }

input.input.wBorder { color: var(--color1); background-color: transparent; border: 0px; box-shadow: 0px 0px; border-radius: 0px; border-bottom: 2px solid var(--color1); text-align: center; }
input.input.wBorder::placeholder { color: var(--color1); text-align: center; background-color: transparent; text-transform: uppercase; }

/* Mobile */
@media only screen and ( max-width: 768px) {
    /* Estructuras */
    .hr.standar { max-width: 40vw; }
    .has-text-left-mobile { text-align: left !important; }
    .is-align-self-flex-end-mobile { align-self: flex-end; }

    /* Raíz */
    .raiz img { max-width: none; }

    /* Menu */
    .menu { padding-left: 1rem; padding-right: 1rem; }
    .menu.has-open { height: 100vh; align-items: flex-start; }
    .gmenu { padding-left: 1rem; padding-right: 1rem; }
    .bt1, .bt2 { min-width: 55vw; }

    /* Contador */
    .contador { background-position: 75% 50%; }
    div.contador img { max-width: none; }
    div.contador .countdown { padding: 0.5rem 1rem !important; }
    div.contador .countdown p.is-size-3-tablet.is-size-4-mobile { letter-spacing: 1px; }

    /* Itinerario */
    .itinerario figure.image.photo { max-width: none; }
    .itinerario .column.border { border-left: none; border-top: 2px solid var(--color2); }
    .itinerario .column.is-narrow { min-height: 0px; min-width: 0px; }
    .itinerario .column.photo { min-height: 0px; }
    /* .itinerario .columns > .column.has-text-centered.bC4.py-5 { background-size: 100px, 75px; background-position: 100% 65%, 0% 15%; } */

    /* Dress Code */
    .dress-code hr { max-width: 40vw; }

    /* Registry */
    .registry figure.image.photo { max-width: none; }
    .registry .column.photo { min-height: 0px; }
    .registry hr { max-width: 40vw; }
    .registry .qr { background-image: none; padding-top: 2rem; }

    /* acommodation */
    .accommodation > .m-0.columns.is-tablet.is-centered.is-multiline.p-0 > .column.is-align-self-stretch { background-image: none; }
    .accommodation > .m-0.columns.is-tablet.is-centered.is-multiline.bC1.p-0 { background-image: none; }

    /* night life */
    .night-life .column.is-12.has-text-centered.pt-6.pb-3.is-align-self-stretch.px-2 { background-image: none; }

    /* restaurants */
    .restaurants .column.is-12.has-text-centered.pt-6.pb-3.is-align-self-stretch.px-2 { background-image: none; }

    /* beauthy salons */
    .beauthy-salons { background-image: none; }

    /* rsvp */
    div.rsvp figure.image.photo { max-width: none; }
    div.rsvp .column.border { border-right: none; border-bottom: 2px solid var(--color2); }
    div.rsvp .column.is-narrow { min-height: 0px; min-width: 0px; }
    div.rsvp .column.photo { min-height: 0px; }
    div.rsvp .column.has-text-centered.bC4 .py-6 { padding-left: 1rem; padding-right: 1rem; }
    div.rsvp .field.entrada { padding-left: 0; padding-right: 0; }

    /* Form */
    .field.is-grouped>.control:not(:last-child) { margin-right: 0px; }
    .radio+.radio { margin-left: 0; }
    .radio+.radio span { padding-left: 2.25rem; }

}
/* Tablet */
@media only screen and (min-width: 769px) and (max-width: 1023px) {
    /* rsvp */
    div.rsvp .column.has-text-centered.bC4 .py-6 { padding-left: 1rem; padding-right: 1rem; }
} 
/* Desktop */
@media only screen and (min-width: 1024px) and (max-width: 1215px) {
    /* rsvp */
    div.rsvp .column.has-text-centered.bC4 .py-6 { padding-left: 2rem; padding-right: 2rem; }
} 
/* Widescreen */
@media only screen and (min-width: 1216px) and (max-width: 1407px) {
    
    /*menu*/
    .menu .options .subMenu { min-width: 25vw; }

    /* rsvp */
    div.rsvp .column.has-text-centered.bC4 .py-6 { padding-left: 4rem; padding-right: 4rem; }
    
    /* restaurants */
    .restaurants .column.is-12.has-text-centered.pt-6.pb-3.is-align-self-stretch.px-2 { background-position: 5% 50%; }
}
/* HD */
@media only screen and (min-width: 1408px) /*and (max-width: 1920px)*/ {

}
/* 2K 
@media only screen and (min-width: 1921px) {
    
}*/