@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;700&display=swap');

a {
    box-sizing: border-box;
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font-size: inherit;
    line-height: 1em;
    outline: none;
    text-decoration: none;
    transition: 0.1s;
    vertical-align: top;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

a.logo {
    display: none;
}

b {
    font-weight: 400;
}

body {
    background: rgba(239, 239, 239, 1);
    color: rgba(47, 47, 47, 1);
    font-family: 'Oswald', sans-serif;
    font-size: 0;
    margin: 0;
    text-align: center;
}

body.unscrollable {
  height: 100%;
  overflow: hidden;
}

button {
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: 20px;
    outline: none;
    padding: 0;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

div {
    box-sizing: border-box;
    line-height: 1em;
    vertical-align: top;
}

div.buttons {
    padding: 16px 0 0;
}

div.buttons a.button {
    display: block;
    margin: 16px 32px 0;
}

div.buttons a.button.gray {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 24px;
    color: rgba(111, 111, 111, 1);
    font-size: 20px;
    font-weight: 300;
    height: 48px;
    line-height: 48px;
}

div.buttons a.button.gray:active,
div.buttons a.button.gray:hover {

}

div.buttons a.button.gray span.accent {
    font-weight: 500;
}

div.buttons a.button.green {
    background: linear-gradient(-45deg, rgba(63, 159, 95, 1) 0%, rgba(63, 159, 63, 1) 100%);
    border-radius: 32px;
    box-shadow: 0 0 16px rgba(63, 159, 63, 0.5);
    color: white;
    font-size: 24px;
    font-weight: 500;
    height: 64px;
    line-height: 64px;
    text-transform: uppercase;
}

div.buttons a.button.green:active,
div.buttons a.button.green:hover {

}

div.menu {
    bottom: -100vh;
    position: fixed;
    transition: 0.25s;
    width: 100%;
    z-index: 2;
}

div.menu button {
    color: rgba(47, 47, 47, 1);
    height: 64px;
    left: calc(50% - 32px);
    position: absolute;
    width: 64px;
}

div.menu button:active i {
    transform: rotate(180deg);
}

div.menu button i {
    font-size: 24px;
    line-height: 64px;
    transition: 0.25s;
}

div.menu button.hide {
    top: calc(100vh - 96px);
    z-index: 1;
}

div.menu button.show {
    background: white;
    border-radius: 32px 32px 32px 32px;
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.1);
    top: -96px;
    z-index: -1;
}

div.menu nav {
    background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.66) 100%);
    display: flex;
    height: 100vh;
    opacity: 0;
    transition: 0.25s;
}

div.menu nav ul {
    background: rgba(255, 255, 255, 1);
    align-self: flex-end;
    padding: 0 0 96px;
    width: 100%;
}

div.menu nav ul li a {
    color: rgba(47, 47, 47, 1);
    display: block;
    font-size: 24px;
    font-weight: 400;
    height: 64px;
    line-height: 64px;
}

div.menu nav ul li a:active {
    background: rgba(0, 0, 0, 0.05);
}

div.menu nav ul li a.active {
    background: rgba(47, 47, 47, 1);
    background: linear-gradient(-45deg, rgba(127, 63, 159, 1) 0%, rgba(255, 127, 0, 1) 100%);
    color: white;
    font-weight: 400;
}

form {
    padding: 16px 0 0;
}

form.order {

}

form.order button {
    background: linear-gradient(-45deg, rgba(63, 159, 95, 1) 0%, rgba(63, 159, 63, 1) 100%);
    border-radius: 24px;
    box-shadow: 0 0 16px rgba(63, 159, 63, 0.5);
    color: white;
    display: block;
    font-size: 20px;
    font-weight: 500;
    height: 48px;
    line-height: 48px;
    margin: 32px 16px 0;
    text-transform: uppercase;
    width: calc(100% - 32px);
}

form.order input {
    _border-radius: 24px;
    height: 48px;
    line-height: 48px;
    line-height: 48px;
    margin: 16px 0 0;
    padding: 0 16px;
    text-align: center;
    _width: calc(100% - 32px);
    width: 100%;
}

form.order p {

}

form.order p.notice {
    color: rgba(191, 191, 191, 1);
    font-size: 16px;
    font-weight: 300;
    padding: 16px 16px 0;
    text-align: center;
}

form.order select {
    height: 48px;
    line-height: 48px;
    margin: 16px 0 0;
    padding: 0 16px;
    text-align: center;
}

form.order select option {
    text-align: center;
}

h1 {
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 400;
    line-height: 1em;
    margin: 0;
}

h2 {
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 400;
    line-height: 1em;
    margin: 0;
}

h3 {
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 400;
    line-height: 1em;
    margin: 0;
}

img {
    box-sizing: border-box;
    vertical-align: bottom;
    width: 100%;
}

i {
    line-height: 1em;
}

input {
    background: white;
    color: inherit;
    box-sizing: border-box;
    border: none;
    display: block;
    font-family: inherit;
    font-size: 20px;
    outline: none;
    padding: 0;
}

p {
    box-sizing: border-box;
    line-height: 1em;
    margin: 0;
    font-size: 20px;
    font-weight: 400;
    text-align: left;
}

select {
    background: white;
    border: none;
    box-sizing: border-box;
    color: inherit;
    display: block;
    font-family: inherit;
    font-size: 20px;
    outline: none;
    width: 100%;
}

select option {
    box-sizing: border-box;
    color: inherit;
    display: block;
    font-family: inherit;
    font-size: 20px;
}

section._flex {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 64px 0;
    min-height: calc(100vh - 128px);
}

section._flex div._flex_container {
    width: 100%;
}

section.confirm {
    min-height: calc(100vh - 224px);
    padding: 64px 0 160px;
}

section.confirm h2 {
    font-size: 32px;
    padding: 16px 0 0;
}

section.confirm i {
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
}

section.confirm p {
    font-weight: 300;
    padding: 16px 16px 0;
}

section.contacts {
    background: linear-gradient(0deg, rgba(239, 239, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
    padding: 32px 0 160px;
}

section.contacts div.links {

}

section.contacts div.links a {
    margin: 0 8px;
}

section.contacts div.separator {
    background: rgba(0, 0, 0, 0.1);
    height: 2px;
    margin: 32px auto 0;
    width: 64px;
}

section.contacts i {
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
    padding: 32px 0 0;
}

section.contacts h2 {
    font-size: 32px;
    padding: 16px 0 0;
}

section.contacts p {
    font-weight: 300;
    padding: 16px 0 0;
    text-align: center;
}

section.contacts.cta {
    background: linear-gradient(-45deg, rgba(127, 63, 159, 1) 0%, rgba(255, 127, 0, 1) 100%);
}

section.contacts.cta div.links a,
section.contacts.cta i,
section.contacts.cta h2,
section.contacts.cta p {
    color: white;
}

section.contacts.cta div.separator {
    background: white;
}

section.content {
    background: linear-gradient(0deg, rgba(239, 239, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
    padding: 32px 0 64px;
}

section.content:last-child {
    padding: 32px 0 160px;
}

section.content article.specs {

}

section.content article.specs img {
    padding: 32px 0 0;
}

section.content article.specs h3 {
    font-size: 24px;
    padding: 16px 0 0;
}

section.content h2 {
    font-size: 32px;
    padding: 16px 0 0;
}

section.content i {
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
    padding: 32px 0 0;
}

section.content p {
    font-weight: 300;
    line-height: 1.25em;
    padding: 16px 16px 0;
}

section.features {
    background: linear-gradient(0deg, rgba(239, 239, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
    padding: 32px 0;
}

section.features div.feature {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding: 0 0 32px;
}

section.features div.feature:first-child {
    border: none;
}

section.features div.feature h2 {
    font-size: 32px;
    padding: 16px 0 0;
}

section.features div.feature i {
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
    padding: 32px 0 0;
}

section.features div.feature p {
    color: rgba(111, 111, 111, 1);
    font-weight: 300;
    line-height: 1.25em;
    padding: 16px 16px 0;
    text-align: justify;
}

section.features div.feature p a {
    color: rgba(127, 63, 159, 1);
    line-height: inherit;
    text-decoration: underline;
}

section.home {
    background: linear-gradient(0deg, rgba(239, 239, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
}

section.home h1 {
    font-weight: 500;
    font-size: 56px;
    padding: 0 0 32px;
}

section.home h2 {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    color: rgba(111, 111, 111, 1);
    font-weight: 300;
    font-size: 28px;
    padding: 32px 0;
    text-align: center;
}

section.home img {
    padding: 0 0 32px;
    width: 192px;
}

section.map {
    _background: linear-gradient(0deg, rgba(239, 239, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding: 32px 0 0;
}

section.map h2 {
    font-size: 32px;
    padding: 16px 0 32px;
}

section.map i {
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
    padding: 32px 0 0;
}

section.packages {
    background: linear-gradient(0deg, rgba(239, 239, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
    padding: 32px 0 64px;
}

section.packages article {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding: 0 0 32px;
}

section.packages article div.grid {
    padding: 0px 8px;
}

section.packages article div.grid div.entry {
    background: white;
    border-radius: 16px;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
    display: inline-block;
    margin: 48px 8px 0;
    width: calc(50% - 16px);
}

section.packages article div.grid div.entry div.circle {
    background: rgba(255, 127, 0, 1);
    background: linear-gradient(-45deg, rgba(127, 63, 159, 1) 0%, rgba(255, 127, 0, 1) 100%);
    border-radius: 32px;
    box-shadow: 0 0 16px rgba(127, 63, 159, 0.5);
    color: white;
    display: inline-block;
    font-size: 24px;
    font-weight: 500;
    height: 64px;
    line-height: 60px;
    margin: -32px 0 0;
    padding: 0 16px;
    _width: 64px;
}

section.packages article div.grid div.entry div.price {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
    font-weight: 500;
    line-height: 1em;
    margin: 16px 0 0;
    padding: 16px 0;
    text-align: center;
}

section.packages article div.grid div.entry div.price span.discount {
    color: rgba(191, 191, 191, 1);
    font-size: 20px;
    font-weight: 400;
    line-height: 1em;
    padding: 0 6px 0 0;
    text-decoration: line-through;
}

section.packages article div.grid div.entry div.price span.unit {
    color: rgba(191, 191, 191, 1);
    display: inline-block;
    font-size: 16px;
    line-height: 1em;
    text-decoration: none;
}

section.packages article div.grid div.entry ul {
    padding: 8px;
}

section.packages article div.grid div.entry ul li {
    color: rgba(111, 111, 111, 1);
    display: block;
    font-size: 20px;
    font-weight: 300;
    line-height: 1.0em;
    padding: 8px 4px 0;
    text-align: center;
}

section.packages article div.grid div.entry ul li:first-child {
    font-weight: 400;
}

section.packages article h3 {
    font-size: 24px;
    text-align: center;
    padding: 16px 0 0;
}

section.packages article img {
    padding: 32px 0 0;
}

section.packages article p {
     padding: 16px 16px 0;
}

section.packages article ul {
    padding: 16px 8px;
}

section.packages article ul li {
    color: rgba(191, 191, 191, 1);
    display: inline-block;
    font-size: 20px;
    font-weight: 300;
    padding: 0 8px;
}

section.packages h2 {
    font-size: 32px;
    padding: 16px 0 0;
}

section.packages i {
    color: rgba(127, 63, 159, 1);
    font-size: 32px;
    padding: 32px 0 0;
}

section.packages p.description {
    color: rgba(111, 111, 111, 1);
    font-weight: 300;
    line-height: 1.25em;
    padding: 16px 16px 0;
    text-align: justify;
}

section.packages p.note {
    color: rgba(191, 191, 191, 1);
    font-size: 16px;
    font-weight: 300;
    padding: 32px 16px 0;
    text-align: center;
}

ul {
    list-style: none;
    padding: 0;
}

ul.list {
    display: block;
    list-style: none;
    padding: 16px 16px 0;
}

ul.list li {
    display: block;
    font-size: 20px;
    font-weight: 300;
    line-height: 1.25em;
    list-style: none;
    padding: 0 0 4px 16px;
    position: relative;
    text-align: left;
    _z-index: -1;
}

ul.list li::before {
    color: black;
    content: "•";
    font-size: 16px;
    font-weight: 300;
    left: 0;
    position: absolute;
}

ul.list li:last-child {
    padding: 0 0 0 16px;
}

ul.list li a {

}

.item-video {
    padding: 8px 0 0;
}

@media(min-width: 1080px) {
    .item-video {
        padding: 8px 24px 0;
    }
}

.item-video iframe {
    width: 100%; /* Or a specific width */
    height: auto; /* Or let the browser calculate based on aspect-ratio */
    aspect-ratio: 1.5; /* Example for a 16:9 aspect ratio */
}

.swiper {

}

.swiper-slide {
    background: rgba(255,255,255,0) !important;
}

.swiper-slide iframe {
    box-sizing: border-box;
    _display: block;
    _height: 100%;
    _object-fit: cover;
    width: 100%;
}

.swiper-wrapper {
    padding: 0 0 32px;
}

.swiper div.swiper-button-next {
    background: rgba(255,255,255,0) !important;
    color: white;
    padding: 0;
}

.swiper div.swiper-button-prev {
    background: rgba(255,255,255,0) !important;
    color: white;
    padding: 0;
}

.swiper div.swiper-pagination {

}

.swiper span.swiper-pagination-bullet-active {
    background: rgba(127, 63, 159, 1);
}

@media(min-width: 1080px) {
    a.logo {
        display: inline-block;
        font-size: 20px;
        font-weight: 500;
        height: 64px;
        left: 32px;
        line-height: 64px;
        position: absolute;
    }

    a.logo img {
        display: inline-block;
        height: 32px;
        margin: 0 8px 0 0;
        position: relative;
        top: -16px;
        width: 32px;
    }

    div.buttons a.button {
        margin: 16px auto 0;
        width: 360px;
    }

    div.menu {
        background: white;
        bottom: auto;
        box-shadow: 0 0 64px rgba(0, 0, 0, 0.1);
        top: 0;
        z-index: 2;
    }

    div.menu button {
        display: none;
    }

    div.menu nav {
        bottom: auto;
        height: 64px;
        opacity: 1;
        top: 0;
    }

    div.menu nav ul {
        align-self: auto;
        padding: 0;
        position: absolute;
        right: 32px;
        width: auto;
    }

    div.menu nav ul li {
        display: inline-block;
    }

    div.menu nav ul li a {
        color: rgba(191, 191, 191, 1);
        display: inline-block;
        font-size: 20px;
        font-weight: 400;
        height: 64px;
        line-height: 64px;
        margin: 0 0 0 32px;
    }

    div.menu nav ul li a:active {
        background: transparent;
    }

    div.menu nav ul li a:hover {
        color: black;
    }

    div.menu nav ul li a.active {
        color: rgba(47, 47, 47, 1);
        background: none;
        border-top: 2px solid rgba(47, 47, 47, 1);
        line-height: 60px;
        font-weight: 400;
    }

    form.order {
        margin: 0 0 0;
    }

    form.order button.send {
        margin: 32px auto 0;
        width: 360px;
    }

    form.order input {
        border-radius: 24px;
        margin: 16px auto 0;
        width: 540px;
    }

    form.order select {
        border-radius: 24px;
        margin: 16px auto 0;
        width: 540px;
    }

    form.order p {
        max-width: 1080px;
    }

    section._flex_container {
        max-width: 1080px;
        margin: 0 auto;
    }

    section.confirm p {
        margin: 0 auto 0;
        max-width: 1080px;
        text-align: center;
    }

    section.contacts {
        padding: 32px 0 64px;
    }

    section.content {
        padding: 96px 0 64px;
    }

    section.content:last-child {
        padding: 96px 0 64px;
    }

    section.content article.specs {
        margin: 0 auto 0;
        max-width: 1080px;
    }

    section.content article.specs p {
        text-align: left;
    }

    section.content p {
        margin: 0 auto 0;
        max-width: 1080px;
        text-align: center;
    }

    section.features {

    }

    section.features div.feature {
        border: none;
        display: inline-block;
        width: 360px;
    }

    section.packages {

    }

    section.packages p.description {
        margin: 0 auto;
        max-width: 1080px;
        text-align: center;
    }

    section.packages img {
        max-width: 1080px;
    }

    section.packages article div.grid {
        max-width: 1080px;
        margin: 0 auto;
        padding: 0;
        text-align: center;
    }

    section.packages article div.grid div.entry {
        display: inline-block;
        margin: 48px 16px 0 0;
        padding: 0;
        width: 258px;
    }

    section.packages article div.grid div.entry:last-child {
        margin: 48px 0 0 0;
        padding: 0;
    }

    section.packages article ul {
        margin: 0 auto;
        max-width: 1080px;
    }

    .swiper {
        max-width: 1080px;
        z-index: 1;
    }

    .swiper div.swiper-button-next {
        background: black;
        padding: 0 40px 0 0;
    }

    .swiper div.swiper-button-prev {
        padding: 0 0 0 40px;
    }

}
