@charset "UTF-8";/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace,monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b,strong {
    font-weight: bolder
}

code,kbd,samp {
    font-family: monospace,monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button,input,optgroup,select,textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,input {
    overflow: visible
}

button,select {
    text-transform: none
}

button,[type=button],[type=reset],[type=submit] {
    -webkit-appearance: button
}

button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none
}

:root {
    --blue-primary-0: #1c57cb;
    --blue-primary-1: #1647a8;
    --blue-accent-0: #48a9a6;
    --blue-accent-1: #3e9390;
    --blue-gray-0: #f6f7fb;
    --blue-gray-1: #a2a3b7;
    --blue-gray-2: #979797;
    --blue-text-color: rgb(22 24 75);
    --blue-danger-0: #fc3f3f;
    --blue-danger-1: #ca2c2c;
    --blue-success-0: #48a9a6;
    --blue-input-background-color: #e6e7ee
}

html {
    font-family: Avenir Next W01,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
    tab-size: 4;
    color: var(--blue-text-color)
}

html[lang=ar] {
    font-family: Segoe UI,Tahoma,Geneva,Verdana,sans-serif
}

* {
    box-sizing: border-box
}

.layout-generated-webpage {
    width: 100%;
    max-width: 500px;
    margin: auto;
    position: relative
}

.layout-box {
    padding: 0 1.5rem;
    margin: auto;
    max-width: 1280px
}

.layout-box.small {
    max-width: 800px
}

.layout-content-with-sidebar {
    display: grid;
    grid-gap: 10rem;
    grid-template-columns: 3fr 2fr;
    position: relative
}

.layout-content-with-sidebar.grid-gap-border:before {
    width: 5px;
    content: " ";
    position: absolute;
    top: 4rem;
    bottom: 0;
    background-color: #e5e7eb;
    border-radius: 4px;
    right: calc(40% + 1rem)
}

@media (max-width: 1400px) {
    .layout-content-with-sidebar.grid-gap-border:before {
        right:calc(40% + 4px)
    }
}

@media (max-width: 900px) {
    .layout-content-with-sidebar.grid-gap-border:before {
        display:none
    }
}

@media (max-width: 1400px) {
    .layout-content-with-sidebar {
        grid-gap:5rem
    }
}

@media (max-width: 900px) {
    .layout-content-with-sidebar {
        grid-gap:2rem
    }
}

@media (max-width: 750px) {
    .layout-content-with-sidebar {
        grid-template-columns:1fr
    }
}

.layout-gap {
    margin: 5rem 0
}

.layout-gap:after {
    content: "";
    display: block;
    overflow: hidden
}

img {
    max-width: 100%
}

.website-header {
    padding: 1rem 0
}

.website-header .header-content {
    display: flex;
    flex-direction: column
}

@media (min-width: 900px) {
    .website-header .header-content {
        flex-direction:row
    }
}

.website-header .logo {
    margin-right: 1rem
}

[dir=rtl] .website-header .logo {
    margin-right: 0;
    margin-left: 1rem
}

.website-header qrcg-language-picker {
    display: flex;
    align-items: center
}

.website-header qrcg-language-picker::part(link) {
    color: var(--blue-primary-0)
}

.website-header .push {
    flex: 1
}

.website-header .menu {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column
}

@media (min-width: 900px) {
    .website-header .menu {
        flex-direction:row
    }
}

.website-header .menu li a {
    padding: .625rem .875rem;
    display: block;
    color: var(--blue-text-color);
    text-decoration: none;
    border-radius: .5rem;
    font-weight: 400;
    margin: 0 .1rem
}

.website-header .menu li a:hover {
    background-color: var(--blue-gray-0)
}

@media (min-width: 900px) {
    .website-header .menu {
        align-items:center
    }
}

.website-header .call-to-actions {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0
}

.website-header .call-to-actions.hidden {
    display: none
}

@media (min-width: 900px) {
    .website-header .call-to-actions li:not(:last-child) .button,.website-header .call-to-actions li:not(:last-child) .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .website-header .call-to-actions li:not(:last-child) a {
        margin-right:1rem
    }

    [dir=rtl] .website-header .call-to-actions li:not(:last-child) .button,[dir=rtl] .website-header .call-to-actions li:not(:last-child) .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block [dir=rtl] .website-header .call-to-actions li:not(:last-child) a {
        margin-left: 1rem;
        margin-right: 0
    }
}

.website-header .open-btn,.website-header .close-btn {
    display: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation
}

@media (max-width: 900px) {
    .website-header .menu,.website-header .call-to-actions,.website-header qrcg-language-picker {
        display:none
    }

    .website-header .open-btn {
        display: flex;
        padding: 1rem;
        position: absolute;
        right: 0;
        top: 0;
        color: var(--blue-gray-1);
        cursor: pointer
    }

    .website-header .open-btn svg {
        width: 2rem;
        height: 2rem
    }

    .website-header.open {
        box-shadow: 2px 5px 15px 2px #0000001a;
        margin: 1rem auto;
        width: calc(100% - 2rem);
        box-sizing: border-box;
        padding: 1.5rem 0;
        position: absolute;
        left: 1rem;
        top: 1rem;
        z-index: 100;
        background-color: #fff;
        border-radius: .5rem
    }

    .website-header.open .menu,.website-header.open .call-to-actions,.website-header.open qrcg-language-picker {
        display: flex
    }

    .website-header.open qrcg-language-picker {
        margin: 2rem 0 0
    }

    .website-header.open .logo {
        display: none
    }

    .website-header.open .call-to-actions {
        margin-top: 2rem;
        display: grid;
        grid-gap: 1rem;
        grid-template-columns: 1fr 1fr
    }

    .website-header.open .call-to-actions.hidden,.website-header.open .open-btn {
        display: none
    }

    .website-header.open .close-btn {
        display: block;
        position: absolute;
        top: 1rem;
        right: 1rem;
        z-index: 2;
        color: var(--blue-gray-1);
        padding: 1rem;
        background-color: #fff;
        cursor: pointer
    }

    .website-header.open .close-btn svg {
        width: 2rem;
        height: 2rem
    }
}

.logo {
    text-decoration: none;
    display: flex;
    align-items: center
}

.logo img {
    max-width: 200px;
    max-height: 70px
}

.button,.qrcode-type-biolinks .link-block a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    border-radius: .5rem;
    border: 2px solid var(--blue-text-color);
    font-weight: 600;
    text-decoration: none;
    color: var(--blue-text-color);
    transition: all .2s cubic-bezier(.77,0,.175,1);
    text-align: center;
    touch-action: manipulation;
    user-select: none;
    -webkit-user-select: none;
    box-shadow: #0000 0 0,#0000 0 0,#0000001f 0 1px 1px,#3c425729 0 0 0 1px,#0000 0 0,#0000 0 0,#3c425714 0 2px 5px;
    cursor: pointer
}

.button[disabled],.qrcode-type-biolinks .link-block a[disabled] {
    pointer-events: none;
    opacity: .5
}

.button:hover,.qrcode-type-biolinks .link-block a:hover {
    color: #fff;
    background-color: var(--blue-text-color);
    box-shadow: #00000026 0 5px 10px 1px
}

.button.accent,.qrcode-type-biolinks .link-block a.accent {
    color: #fff;
    border-color: var(--blue-accent-0);
    background-color: var(--blue-accent-0)
}

.button.accent:hover,.qrcode-type-biolinks .link-block a.accent:hover {
    background-color: var(--blue-accent-1);
    border-color: var(--blue-accent-1)
}

.button.danger,.qrcode-type-biolinks .link-block a.danger {
    color: #fff;
    border-color: var(--blue-danger-0);
    background-color: var(--blue-danger-0)
}

.button.danger:hover,.qrcode-type-biolinks .link-block a.danger:hover {
    background-color: var(--blue-danger-1);
    border-color: var(--blue-danger-1)
}

.button.primary,.qrcode-type-biolinks .link-block a.primary {
    color: #fff;
    border-color: var(--blue-primary-0);
    background-color: var(--blue-primary-0)
}

.button.primary:hover,.qrcode-type-biolinks .link-block a.primary:hover {
    background-color: var(--blue-primary-1);
    border-color: var(--blue-primary-1)
}

.button.white,.qrcode-type-biolinks .link-block a.white {
    background-color: #fff;
    color: var(--blue-text-color);
    border-color: #fff
}

.button.circle,.qrcode-type-biolinks .link-block a.circle {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    border: 0
}

.button.circle svg,.qrcode-type-biolinks .link-block a.circle svg {
    width: 2rem;
    height: 2rem
}

.button.circle svg *,.qrcode-type-biolinks .link-block a.circle svg * {
    fill: currentColor
}

.website-footer {
    border-top: 1px solid rgb(229,231,235);
    padding-top: 2rem;
    line-height: 1.7
}

.website-footer qrcg-language-picker {
    margin: 3rem 0
}

.website-footer .socials {
    margin-top: 1rem;
    display: flex
}

.website-footer .socials a {
    margin-right: 1rem;
    color: var(--blue-gray-1);
    background-color: var(--blue-gray-0);
    text-decoration: none;
    display: flex;
    padding: .5rem;
    border-radius: .5rem
}

[dir=rtl] .website-footer .socials a {
    margin-right: 0;
    margin-left: 1rem
}

.website-footer .logo-block .logo {
    display: block
}

.website-footer .footer-wrapper {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    padding-bottom: 3rem
}

@media (max-width: 900px) {
    .website-footer .footer-wrapper {
        grid-template-columns:repeat(2,1fr)
    }
}

@media (max-width: 500px) {
    .website-footer .footer-wrapper {
        grid-template-columns:1fr
    }
}

.website-footer .list h3 {
    text-transform: uppercase;
    color: var(--blue-gray-1)
}

.website-footer .list ul {
    list-style: none;
    padding: 0
}

.website-footer .list li,.website-footer .list li a {
    text-decoration: none;
    color: var(--blue-text-color);
    line-height: 2.5
}

.website-footer .footer-copy {
    border-top: 1px solid rgb(229,231,235);
    color: var(--blue-gray-1);
    padding: 1rem 0;
    font-size: .8rem
}

@media (max-width: 500px) {
    .website-footer .footer-copy {
        font-size:.6rem
    }
}

body.modal-open {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.modal-content {
    display: none
}

.modal-target-clone {
    background-color: #000000b3;
    transition: all ease-in-out .4s;
    border-radius: .5rem
}

.modal-target-clone.maximized {
    background-color: var(--blue-gray-0);
    top: 0!important;
    left: 0!important;
    width: 100%!important;
    height: 100%!important;
    border-radius: 0;
    opacity: 1;
    overflow: auto;
    padding-bottom: 3rem;
    box-sizing: border-box
}

.modal-target-clone.maximized .modal-content {
    display: block;
    box-sizing: border-box
}

.modal-target-clone.maximized .close-btn {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    color: var(--blue-gray-1);
    z-index: 2;
    padding: 1rem;
    cursor: pointer
}

.modal-target-clone.maximized .close-btn svg {
    width: 3rem;
    height: 3rem
}

.modal-target-clone.maximized .heading {
    font-weight: 300;
    margin: 2rem 0;
    font-size: 3rem;
    animation: fade-in .3s .1s ease-in both;
    line-height: 1.7
}

@media (max-width: 900px) {
    .modal-target-clone.maximized .heading {
        font-size:1.5rem
    }
}

.modal-target-clone.maximized .sub-heading {
    font-size: 1.5rem;
    line-height: 1.7;
    animation: fade-in .3s .2s ease-in both;
    color: var(--blue-gray-1)
}

@media (max-width: 900px) {
    .modal-target-clone.maximized .sub-heading {
        font-size:1rem
    }
}

.modal-target-clone.maximized .animate-cascade:nth-child(1) {
    animation: slide-in .3s .05s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(2) {
    animation: slide-in .3s .1s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(3) {
    animation: slide-in .3s .15s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(4) {
    animation: slide-in .3s .2s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(5) {
    animation: slide-in .3s .25s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(6) {
    animation: slide-in .3s .3s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(7) {
    animation: slide-in .3s .35s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(8) {
    animation: slide-in .3s .4s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(9) {
    animation: slide-in .3s .45s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(10) {
    animation: slide-in .3s .5s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(11) {
    animation: slide-in .3s .55s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(12) {
    animation: slide-in .3s .6s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(13) {
    animation: slide-in .3s .65s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(14) {
    animation: slide-in .3s .7s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(15) {
    animation: slide-in .3s .75s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(16) {
    animation: slide-in .3s .8s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(17) {
    animation: slide-in .3s .85s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(18) {
    animation: slide-in .3s .9s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(19) {
    animation: slide-in .3s .95s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(20) {
    animation: slide-in .3s 1s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(21) {
    animation: slide-in .3s 1.05s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(22) {
    animation: slide-in .3s 1.1s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(23) {
    animation: slide-in .3s 1.15s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(24) {
    animation: slide-in .3s 1.2s ease-in both
}

.modal-target-clone.maximized .animate-cascade:nth-child(25) {
    animation: slide-in .3s 1.25s ease-in both
}

@keyframes slide-in {
    0% {
        opacity: 0;
        transform: translateY(15px)
    }

    50% {
        opacity: .3
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.image-gallery {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: repeat(5,1fr)
}

@media (max-width: 900px) {
    .image-gallery {
        grid-template-columns:repeat(3,1fr)
    }
}

@media (max-width: 500px) {
    .image-gallery {
        grid-template-columns:repeat(2,1fr)
    }
}

.image-gallery .image {
    background-color: #fff;
    padding: 1rem;
    border-radius: .5rem
}

input {
    -webkit-appearance: none;
    appearance: none;
    padding: 1rem;
    display: block;
    background-color: var(--blue-input-background-color);
    color: var(--blue-text-color);
    border: 0;
    outline: 0;
    border-radius: .5rem;
    font-weight: 600
}

input::placeholder {
    color: var(--blue-gray-1)
}

.input-wrapper {
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column
}

.input-wrapper label {
    font-size: 1.3rem;
    display: block;
    margin-bottom: .5rem;
    color: #fff;
    font-weight: 600
}

.card {
    background-image: url(/assets/images/qrcode-showcase-bg-1.png);
    background-size: cover;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000004d;
    padding: 2rem;
    color: #fff
}

.card.accent {
    background-image: url(/assets/images/qrcode-showcase-bg-2.png)
}

.card a {
    color: #fff
}

.card h2 {
    font-weight: 400;
    font-size: 1.5rem
}

.lds-ring {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px
}

.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid var(--blue-text-color);
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(.5,0,.5,1) infinite;
    border-color: var(--blue-text-color) transparent transparent transparent
}

.lds-ring div:nth-child(1) {
    animation-delay: -.45s
}

.lds-ring div:nth-child(2) {
    animation-delay: -.3s
}

.lds-ring div:nth-child(3) {
    animation-delay: -.15s
}

@keyframes lds-ring {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

#cookie-consent {
    position: fixed;
    text-align: center;
    z-index: 10;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    left: 1rem;
    bottom: 1rem;
    background-color: var(--blue-text-color);
    border-radius: .5rem;
    color: #fff;
    animation: fade-in-cookie-consent 1s 1s ease-in both
}

#cookie-consent.closing {
    animation: fade-out-cookie-consent .5s ease-out both
}

#cookie-consent.hidden-div {
    display: none
}

#cookie-consent a:not(.button) {
    color: #fff
}

#cookie-consent .main-text {
    margin-bottom: 1rem;
    line-height: 1.7
}

#cookie-consent .controls {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1rem
}

#cookie-consent .controls .full-width {
    grid-column: 1/span 2
}

#cookie-consent .controls .outline {
    border-color: #fff;
    color: #fff
}

@keyframes fade-in-cookie-consent {
    0% {
        opacity: 0;
        transform: scale(.95)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes fade-out-cookie-consent {
    0% {
        opacity: 1;
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.95)
    }
}

@media (max-width: 900px) {
    #cookie-consent {
        left:0;
        right: 0;
        bottom: 0
    }

    #cookie-consent .controls {
        grid-template-columns: 1fr
    }

    #cookie-consent .controls .full-width {
        grid-column: 1
    }
}

.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #00000080;
    z-index: 9999;
    display: none
}

.popup-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: #fff;
    padding: 1rem;
    border-radius: .5rem;
    line-height: 1.5;
    animation: fade-in-cookie-consent-popup .8s ease-in both
}

@keyframes fade-in-cookie-consent-popup {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.popup-content h3 {
    margin-top: 0;
    margin-bottom: .5rem
}

.popup-content hr {
    margin-bottom: 1rem
}

.popup-content .controls {
    display: flex
}

.popup-content .controls .button,.popup-content .controls .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .popup-content .controls a {
    margin-right: 1rem
}

.checkbox-label {
    display: block;
    margin-bottom: 10px;
    font-size: small
}

.hidden-div {
    display: none
}

.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    justify-content: center;
    align-items: center;
    background-color: #0009;
    z-index: 9999;
    overflow-y: auto;
    overflow-x: auto
}

.popup-content {
    width: 350px;
    background-color: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 8px #0000001a;
    font-family: Arial,sans-serif;
    overflow-y: auto;
    overflow-x: auto
}

.checkbox-label {
    display: flex;
    align-items: center;
    margin-bottom: 10px
}

.my-input-class[type=checkbox] {
    -webkit-appearance: checkbox;
    appearance: checkbox;
    margin-right: 10px
}

#popup-ok {
    margin-right: 10px
}

.my-input-class[type=checkbox] {
    -webkit-appearance: checkbox;
    appearance: checkbox;
    display: inline;
    align-items: center;
    padding: 1rem
}

.preload-image {
    display: none
}

.frontend-toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translate(-50%);
    background-color: var(--blue-success-0);
    color: #fff;
    padding: 1rem;
    font-weight: 700;
    font-size: 1.3rem;
    border-radius: .5rem;
    animation: frontend-toast-animation .5s ease both;
    z-index: 10000;
    width: max-content
}

.frontend-toast.closing {
    animation: frontend-toast-animation-leaving 1s ease both
}

@keyframes frontend-toast-animation-leaving {
    0% {
        transform: translate(-50%)
    }

    to {
        transform: translate(-50%) translateY(100%) scale(.9);
        opacity: 0
    }
}

@keyframes frontend-toast-animation {
    0% {
        opacity: 0;
        transform: translate(-50%) translateY(100%) scale(.9)
    }

    to {
        transform: translate(-50%)
    }
}

body.scroll-blocked {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    bottom: 0;
    right: 0;
    overflow: hidden
}

.share-on-whatsapp-container {
    display: flex
}

.share-on-whatsapp-container input {
    flex: 1;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    background-color: #fff
}

.share-on-whatsapp-container .icon {
    display: flex;
    padding: 0 1rem;
    box-sizing: border-box;
    background-color: #0bc144;
    border-radius: .5rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.share-on-whatsapp-container .icon svg {
    width: 2rem;
    color: #fff;
    fill: currentColor
}

section.informative-text {
    line-height: 2.3;
    font-size: 1.2rem
}

section.informative-text h2,section.informative-text h3,section.informative-text h4 {
    font-weight: 600
}

section.features-in-numbers {
    background-color: var(--blue-gray-0);
    position: relative
}

section.features-in-numbers:before {
    content: "";
    position: absolute;
    background-image: url(/assets/images/qrcode-pattern.png);
    background-size: contain;
    background-position: bottom;
    top: -370px;
    right: 0;
    width: 370px;
    height: 370px;
    display: none
}

section.features-in-numbers .wrapper {
    display: flex;
    position: relative;
    justify-content: space-around
}

section.features-in-numbers .number-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 20%;
    background-color: #fff;
    transform: translateY(30%);
    padding: 2rem 0;
    border-radius: .5rem
}

section.features-in-numbers .number-box .number {
    font-size: 2rem
}

section.features-in-numbers .number-box label {
    font-size: 1.5rem;
    margin-top: 1rem;
    color: var(--blue-gray-1)
}

@media (max-width: 900px) {
    section.features-in-numbers .wrapper {
        display:grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 1rem
    }

    section.features-in-numbers .number-box {
        width: initial;
        text-align: center
    }

    section.features-in-numbers .number-box label {
        font-size: 1rem
    }
}

section.qrcode-showcase {
    margin-top: 6rem
}

section.qrcode-showcase.accent .wrapper {
    background-image: url(/assets/images/qrcode-showcase-bg-2.png);
    background-position: top
}

section.qrcode-showcase .wrapper {
    background-color: var(--blue-primary-0);
    background-image: url(/assets/images/qrcode-showcase-bg-1.png);
    background-position: bottom;
    background-size: cover;
    border-radius: .5rem;
    padding: 2rem;
    color: #fff;
    position: relative
}

section.qrcode-showcase .wrapper>* {
    transition: all .3s cubic-bezier(.165,.84,.44,1)
}

section.qrcode-showcase .wrapper:hover>*:not(.overlay) {
    filter: blur(10px)
}

section.qrcode-showcase .wrapper:hover>.overlay {
    opacity: 1;
    pointer-events: all;
    cursor: pointer
}

section.qrcode-showcase .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000000b3;
    z-index: 1;
    border-radius: .5rem;
    opacity: 0;
    pointer-events: none;
    user-select: none;
    -webkit-user-select: none;
    color: #fff;
    text-decoration: none
}

section.qrcode-showcase .overlay-wrapper {
    font-size: 2rem;
    display: flex;
    align-items: center;
    font-weight: 300
}

section.qrcode-showcase .overlay-wrapper .text {
    margin-right: 2rem
}

[dir=rtl] section.qrcode-showcase .overlay-wrapper .text {
    margin-right: 0;
    margin-left: 2rem
}

section.qrcode-showcase .overlay-wrapper .arrow {
    font-size: 1.5rem;
    border-radius: 50%;
    background-color: #fff;
    color: var(--blue-text-color);
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center
}

[dir=rtl] section.qrcode-showcase .overlay-wrapper .arrow {
    transform: scaleX(-1)
}

@media (max-width: 900px) {
    section.qrcode-showcase .overlay-wrapper {
        font-size:1.2rem
    }
}

section.qrcode-showcase .tag {
    background-color: #fff;
    color: var(--blue-text-color);
    display: inline-block;
    border-radius: 1.5rem;
    padding: .5rem;
    margin: 0
}

section.qrcode-showcase .explainer {
    font-size: 2rem;
    margin: 0;
    line-height: 1.7;
    font-weight: 300;
    margin-top: 1rem
}

@media (max-width: 900px) {
    section.qrcode-showcase .explainer {
        font-size:1.5rem
    }
}

section.qrcode-showcase .images {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: repeat(5,1fr);
    grid-gap: 1rem
}

section.qrcode-showcase .images .image {
    padding: 1rem;
    border-radius: .5rem;
    display: flex;
    background-color: #fff
}

section.qrcode-showcase .images img {
    max-width: 100%
}

@media (max-width: 900px) {
    section.qrcode-showcase .images {
        grid-template-columns:1fr 1fr;
        grid-gap: 1rem
    }

    section.qrcode-showcase .images .image:last-child {
        display: none
    }
}

section.qrcode-types {
    margin-top: 7rem;
    text-align: center
}

section.qrcode-types .text-wrapper {
    max-width: 900px;
    margin: auto;
    text-align: center
}

section.qrcode-types .tag-line {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--blue-primary-0)
}

section.qrcode-types .section-title {
    font-size: 3rem;
    letter-spacing: 1px;
    font-weight: 600;
    margin: 2rem 0;
    line-height: 1.4
}

section.qrcode-types .explainer {
    font-weight: 300;
    line-height: 1.7;
    font-size: 1.5rem;
    padding: 0 2rem
}

@media (max-width: 900px) {
    section.qrcode-types .section-title {
        font-size:1.5rem
    }

    section.qrcode-types .tag-line {
        font-size: 1rem
    }

    section.qrcode-types .explainer {
        font-size: 1.2rem;
        padding: 0
    }
}

section.qrcode-types .boxes {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(4,1fr);
    border: 1px solid var(--blue-gray-0);
    border-radius: 1rem;
    overflow: hidden
}

section.qrcode-types .show-more {
    font-size: 1.3rem;
    margin: 2rem 0;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    color: var(--blue-gray-1);
    transition: color ease .2s
}

section.qrcode-types .show-more:hover {
    color: var(--blue-text-color)
}

.qrcode-types-show-all section.qrcode-types .show-more {
    display: none
}

section.qrcode-types .single-box {
    padding: 1rem;
    border: 1px solid var(--blue-gray-0)
}

section.qrcode-types .single-box:nth-child(5) {
    display: none;
    animation: single-box-animation .3s 0s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(5) {
    display: block
}

section.qrcode-types .single-box:nth-child(6) {
    display: none;
    animation: single-box-animation .3s .1s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(6) {
    display: block
}

section.qrcode-types .single-box:nth-child(7) {
    display: none;
    animation: single-box-animation .3s .2s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(7) {
    display: block
}

section.qrcode-types .single-box:nth-child(8) {
    display: none;
    animation: single-box-animation .3s .3s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(8) {
    display: block
}

section.qrcode-types .single-box:nth-child(9) {
    display: none;
    animation: single-box-animation .3s .4s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(9) {
    display: block
}

section.qrcode-types .single-box:nth-child(10) {
    display: none;
    animation: single-box-animation .3s .5s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(10) {
    display: block
}

section.qrcode-types .single-box:nth-child(11) {
    display: none;
    animation: single-box-animation .3s .6s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(11) {
    display: block
}

section.qrcode-types .single-box:nth-child(12) {
    display: none;
    animation: single-box-animation .3s .7s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(12) {
    display: block
}

section.qrcode-types .single-box:nth-child(13) {
    display: none;
    animation: single-box-animation .3s .8s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(13) {
    display: block
}

section.qrcode-types .single-box:nth-child(14) {
    display: none;
    animation: single-box-animation .3s .9s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(14) {
    display: block
}

section.qrcode-types .single-box:nth-child(15) {
    display: none;
    animation: single-box-animation .3s 1s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(15) {
    display: block
}

section.qrcode-types .single-box:nth-child(16) {
    display: none;
    animation: single-box-animation .3s 1.1s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(16) {
    display: block
}

section.qrcode-types .single-box:nth-child(17) {
    display: none;
    animation: single-box-animation .3s 1.2s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(17) {
    display: block
}

section.qrcode-types .single-box:nth-child(18) {
    display: none;
    animation: single-box-animation .3s 1.3s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(18) {
    display: block
}

section.qrcode-types .single-box:nth-child(19) {
    display: none;
    animation: single-box-animation .3s 1.4s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(19) {
    display: block
}

section.qrcode-types .single-box:nth-child(20) {
    display: none;
    animation: single-box-animation .3s 1.5s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(20) {
    display: block
}

section.qrcode-types .single-box:nth-child(21) {
    display: none;
    animation: single-box-animation .3s 1.6s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(21) {
    display: block
}

section.qrcode-types .single-box:nth-child(22) {
    display: none;
    animation: single-box-animation .3s 1.7s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(22) {
    display: block
}

section.qrcode-types .single-box:nth-child(23) {
    display: none;
    animation: single-box-animation .3s 1.8s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(23) {
    display: block
}

section.qrcode-types .single-box:nth-child(24) {
    display: none;
    animation: single-box-animation .3s 1.9s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(24) {
    display: block
}

section.qrcode-types .single-box:nth-child(25) {
    display: none;
    animation: single-box-animation .3s 2s ease-in both
}

.qrcode-types-show-all section.qrcode-types .single-box:nth-child(25) {
    display: block
}

@keyframes single-box-animation {
    0% {
        padding: 0;
        opacity: 0
    }

    to {
        padding: 1rem;
        opacity: 1
    }
}

section.qrcode-types .single-box .heading {
    font-size: 1.3rem;
    font-weight: 400;
    display: flex;
    justify-content: center
}

section.qrcode-types .single-box .heading svg {
    margin-right: .5rem
}

[dir=rtl] section.qrcode-types .single-box .heading svg {
    margin-right: 0;
    margin-left: .5rem
}

section.qrcode-types .single-box .badge {
    background-color: var(--blue-gray-0);
    margin: auto;
    width: min-content;
    color: var(--blue-gray-1);
    padding: .5rem;
    border-radius: 1.5rem
}

section.qrcode-types .single-box p {
    color: var(--blue-gray-1);
    line-height: 1.7
}

@media (max-width: 900px) {
    section.qrcode-types .boxes {
        grid-template-columns:1fr 1fr
    }
}

@media (max-width: 500px) {
    section.qrcode-types .boxes {
        grid-template-columns:1fr
    }
}

section.qrcode-stats {
    margin-top: 7rem
}

section.qrcode-stats .text-wrapper {
    max-width: 900px;
    margin: auto;
    text-align: center
}

section.qrcode-stats .tag-line {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--blue-primary-0)
}

section.qrcode-stats .section-title {
    font-size: 3rem;
    letter-spacing: 1px;
    font-weight: 600;
    margin: 2rem 0;
    line-height: 1.4
}

section.qrcode-stats .explainer {
    font-weight: 300;
    line-height: 1.7;
    font-size: 1.5rem;
    padding: 0 2rem
}

@media (max-width: 900px) {
    section.qrcode-stats .section-title {
        font-size:1.5rem
    }

    section.qrcode-stats .tag-line {
        font-size: 1rem
    }

    section.qrcode-stats .explainer {
        font-size: 1.2rem;
        padding: 0
    }
}

section.qrcode-stats .main-image {
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000004d;
    margin-top: 2rem
}

section.testimonials {
    margin-top: 7rem;
    background-color: var(--blue-gray-0);
    overflow: hidden
}

section.testimonials .main-testimonial {
    padding: 5rem 0;
    position: relative;
    text-align: center
}

section.testimonials .main-testimonial .text {
    position: relative;
    font-size: 2.5rem;
    line-height: 1.6;
    z-index: 1;
    font-weight: 300
}

section.testimonials .main-testimonial .heading {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 2rem 0;
    text-align: center;
    color: var(--blue-gray-1);
    text-transform: uppercase;
    letter-spacing: 1px
}

section.testimonials .main-testimonial .customer-name {
    display: inline-block;
    font-size: 1.5rem
}

section.testimonials .main-testimonial .details {
    margin: auto;
    font-weight: 300;
    font-size: 1.3rem
}

section.testimonials .main-testimonial .details label {
    font-weight: 500
}

section.testimonials .quote-image {
    position: absolute;
    bottom: 1rem;
    right: 2rem;
    z-index: 0;
    pointer-events: none;
    width: 15rem;
    opacity: .2
}

section.testimonials .testimonials-track {
    display: grid;
    grid-template-columns: repeat(8,1fr);
    grid-gap: 2rem;
    width: 3400px;
    animation: testimonial-slideshow 90s linear infinite alternate;
    margin-bottom: 5rem
}

[dir=rtl] section.testimonials .testimonials-track {
    animation: testimonial-slideshow-reverse 90s linear infinite alternate
}

@keyframes testimonial-slideshow {
    0% {
        transform: translate(0)
    }

    to {
        transform: translate(-50%)
    }
}

@keyframes testimonial-slideshow-reverse {
    0% {
        transform: translate(-50%)
    }

    to {
        transform: translate(0)
    }
}

section.testimonials .testimonials-track .testimonial-item {
    background-color: #fff;
    padding: 1.5rem 2rem;
    border-radius: 1rem;
    line-height: 1.7;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: var(--blue-gray-1)
}

section.testimonials .testimonials-track .testimonial-item p {
    margin: 0
}

@media (max-width: 900px) {
    section.testimonials .main-testimonial .text {
        font-size:1.5rem
    }

    section.testimonials .main-testimonial .heading {
        font-size: 1rem;
        font-weight: 600;
        margin: 2rem 0;
        text-align: center;
        color: var(--blue-gray-1);
        text-transform: uppercase;
        letter-spacing: 1px
    }

    section.testimonials .testimonials-track {
        width: 2200px
    }
}

@media (max-width: 500px) {
    section.testimonials .testimonials-track {
        animation-duration:40s;
        width: 3000px
    }
}

section.pricing {
    margin-top: 5rem
}

section.pricing .text-wrapper {
    max-width: 900px;
    margin: auto;
    text-align: center
}

section.pricing .tag-line {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--blue-primary-0)
}

section.pricing .section-title {
    font-size: 3rem;
    letter-spacing: 1px;
    font-weight: 600;
    margin: 2rem 0;
    line-height: 1.4
}

section.pricing .explainer {
    font-weight: 300;
    line-height: 1.7;
    font-size: 1.5rem;
    padding: 0 2rem
}

@media (max-width: 900px) {
    section.pricing .section-title {
        font-size:1.5rem
    }

    section.pricing .tag-line {
        font-size: 1rem
    }

    section.pricing .explainer {
        font-size: 1.2rem;
        padding: 0
    }
}

section.pricing .pricing-switch {
    display: flex;
    justify-content: center;
    align-items: center;
    user-select: none;
    touch-action: manipulation;
    -webkit-user-select: none
}

section.pricing .pricing-switch-box {
    display: flex;
    margin-bottom: 2rem;
    border-radius: .5rem;
    padding: .3rem;
    border: 2px solid rgb(229,231,235)
}

section.pricing .pricing-switch .switch-item {
    padding: .7rem 1rem;
    border-radius: .5rem;
    cursor: pointer
}

section.pricing .pricing-switch .switch-item:nth-child(1) {
    margin-right: .15rem
}

section.pricing .pricing-switch .switch-item:nth-child(2) {
    margin-left: .15rem
}

section.pricing .pricing-switch .switch-item:hover {
    background-color: var(--blue-gray-0)
}

section.pricing .pricing-switch .switch-item.active {
    background-color: #e5e7eb
}

section.pricing .immediate-hide {
    display: none!important
}

section.pricing .text-wrapper {
    margin-bottom: 4rem
}

section.pricing .blocks {
    display: grid;
    grid-template-columns: 1fr
}

section.pricing .items-wrapper,section.pricing .demo-wrapper {
    background-image: url(/assets/images/qrcode-showcase-bg-1.png);
    background-size: cover;
    color: #fff;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000004d;
    padding: 2rem 0
}

section.pricing .items-wrapper .items {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr
}

section.pricing .demo-wrapper {
    background-image: url(/assets/images/qrcode-showcase-bg-2.png);
    display: flex;
    flex-direction: column
}

section.pricing .demo-wrapper .items {
    display: flex;
    flex: 1
}

section.pricing .demo-wrapper .item {
    flex: 1
}

section.pricing .tag {
    background-color: #fff;
    color: var(--blue-text-color);
    font-weight: 600;
    font-size: 1.2rem;
    padding: .7rem 1rem;
    display: inline-block;
    margin-left: 2rem;
    border-radius: 1.5rem;
    margin-right: auto
}

[dir=rtl] section.pricing .tag {
    margin-left: auto;
    margin-right: 2rem
}

section.pricing .item {
    line-height: 2;
    padding: 0 2rem;
    display: flex;
    flex-direction: column;
    border-right: 1px solid rgba(255,255,255,.2)
}

section.pricing .item:last-child {
    border-right: 0
}

section.pricing .item .heading {
    font-weight: 400;
    margin: 2rem 0 0
}

section.pricing .item .price .number {
    font-size: 3rem;
    margin: 0 .5rem
}

section.pricing .item .price .sep {
    margin-right: .5rem
}

section.pricing .item .below-price {
    font-weight: 300
}

section.pricing .item .below-price span {
    font-weight: 500
}

section.pricing .item .text-list {
    list-style: none;
    padding: 0;
    margin: 0
}

section.pricing .item .icons-list {
    list-style: none;
    padding: 0;
    margin-bottom: 3rem
}

section.pricing .item .icons-list li:before {
    content: "\2713";
    color: var(--blue-accent-0);
    margin-right: 1rem;
    font-weight: 700
}

[dir=rtl] section.pricing .item .icons-list li:before {
    margin-right: 0;
    margin-left: 1rem
}

section.pricing .item .buy-button {
    margin-top: auto;
    line-height: 1
}

@media (max-width: 900px) {
    section.pricing .blocks {
        grid-template-columns:1fr
    }

    section.pricing .items-wrapper,section.pricing .demo-wrapper {
        padding-bottom: 0
    }

    section.pricing .items-wrapper .items,section.pricing .demo-wrapper .items {
        grid-template-columns: 1fr
    }

    section.pricing .items-wrapper .items .item,section.pricing .demo-wrapper .items .item {
        background-color: #00000080;
        padding: 2rem;
        margin: 1rem;
        border-radius: .5rem
    }

    section.pricing .items-wrapper .items .item:nth-child(2),section.pricing .demo-wrapper .items .item:nth-child(2) {
        margin-top: 0rem
    }
}

section.website-banner {
    position: relative;
    z-index: 1;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    line-height: 1.6;
    padding: 4rem 0
}

section.website-banner .background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    pointer-events: none
}

section.website-banner div.background {
    background-image: url(/assets/images/website-banner-bg.svg)
}

section.website-banner>*:not(.background):not(.c-group) {
    position: relative;
    z-index: 1
}

section.website-banner .control {
    min-height: 400px
}

section.website-banner qrcg-website-banner {
    animation: qrcg-website-banner-animation .5s ease both
}

section.website-banner h1,section.website-banner p {
    text-align: center
}

section.website-banner h1 {
    letter-spacing: 1.5px;
    font-weight: 400;
    margin: 0 0 2rem;
    font-size: 3rem;
    color: #fff
}

section.website-banner p {
    margin: 0 6rem 4rem;
    font-size: 1.3rem;
    font-weight: 300;
    color: #fff
}

@media (max-width: 900px) {
    section.website-banner h1 {
        font-size:2rem
    }

    section.website-banner p {
        font-size: 1rem;
        margin: 2rem
    }
}

section.inner-page-title {
    line-height: 1.7
}

section.inner-page-title h1 {
    margin: 5rem 0 3rem;
    font-weight: 500
}

section.inner-page-title p {
    font-size: 1.3rem;
    font-weight: 300
}

section.blog-list {
    line-height: 1.7
}

section.blog-list a {
    text-decoration: none;
    color: var(--blue-text-color);
    -webkit-tap-highlight-color: transparent
}

section.blog-list article {
    border-radius: 1rem;
    border: var(--blue-gray-1) 1px solid;
    padding: 2rem;
    margin: 4rem 0;
    box-shadow: #0000000d 0 27px 40px 30px
}

section.blog-list article h2 {
    font-size: 1.7rem
}

section.blog-list article:not(.has-image) h2 {
    margin-top: 0
}

section.blog-list article img {
    border-top-right-radius: .5rem;
    border-top-left-radius: .5rem
}

section.blog-list article p {
    margin-bottom: 0;
    font-size: 1.3rem;
    font-weight: 300
}

section.post {
    line-height: 1.7
}

section.post article {
    padding: 0;
    margin: 4rem 0
}

section.post article h2 {
    font-size: 1.7rem
}

section.post article img {
    border-radius: 1rem
}

section.post article .content {
    font-size: 1.3rem;
    line-height: 2.2
}

section.payment-result {
    text-align: center
}

section.payment-result h1 {
    font-size: 5rem;
    margin-bottom: 1rem
}

section.payment-result .text {
    padding: 5rem 0
}

section.payment-result p {
    font-size: 1.3rem;
    margin-bottom: 3rem
}

section.payment-result .button,section.payment-result .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block section.payment-result a {
    width: fit-content;
    margin: 2rem auto
}

section.free-trial-notice .text {
    display: flex;
    align-items: center;
    margin: 3rem 0;
    padding: 2rem;
    background-color: var(--blue-gray-0);
    border-radius: .5rem;
    font-size: 1.3rem
}

section.free-trial-notice svg {
    width: 2rem;
    height: 2rem;
    margin-right: 1rem
}

[dir=rtl] section.free-trial-notice svg {
    margin-right: 0;
    margin-left: 1rem
}

section.free-trial-notice svg * {
    fill: var(--blue-gray-1)
}

section.account-credit-pricing {
    margin-top: 5rem
}

section.account-credit-pricing .text-wrapper {
    max-width: 900px;
    margin: auto;
    text-align: center
}

section.account-credit-pricing .tag-line {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--blue-primary-0)
}

section.account-credit-pricing .section-title {
    font-size: 3rem;
    letter-spacing: 1px;
    font-weight: 600;
    margin: 2rem 0;
    line-height: 1.4
}

section.account-credit-pricing .explainer {
    font-weight: 300;
    line-height: 1.7;
    font-size: 1.5rem;
    padding: 0 2rem
}

@media (max-width: 900px) {
    section.account-credit-pricing .section-title {
        font-size:1.5rem
    }

    section.account-credit-pricing .tag-line {
        font-size: 1rem
    }

    section.account-credit-pricing .explainer {
        font-size: 1.2rem;
        padding: 0
    }
}

section.account-credit-pricing .blocks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem
}

section.account-credit-pricing .block-box {
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    padding: 2rem;
    border-radius: 2rem;
    color: #fff
}

section.account-credit-pricing .block-box .button,section.account-credit-pricing .block-box .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block section.account-credit-pricing .block-box a {
    border-radius: 5rem
}

section.account-credit-pricing .block-box .qrcode-type {
    font-weight: 700;
    margin-bottom: 1rem
}

section.account-credit-pricing .block-box p {
    line-height: 1.7;
    margin-bottom: 1rem
}

section.account-credit-pricing .block-box .price {
    display: flex
}

section.account-credit-pricing .block-box .price .amount {
    font-size: 5rem
}

section.account-credit-pricing .block-box .price .description {
    line-height: 1.4;
    display: flex;
    flex-direction: column;
    margin-left: 2rem;
    justify-content: center;
    font-size: 1.3rem
}

section.account-credit-pricing .block-box.static {
    background-image: url(/assets/images/qrcode-showcase-bg-2.png)
}

section.account-credit-pricing .block-box.dynamic {
    background-image: url(/assets/images/qrcode-showcase-bg-1.png)
}

section.account-credit-pricing .features-title {
    margin: 1rem 0;
    font-weight: 700
}

section.account-credit-pricing ul.features {
    list-style: none;
    padding: 0
}

section.account-credit-pricing ul.features.with-margin {
    margin-top: 3rem
}

section.account-credit-pricing ul.features svg {
    width: 1rem;
    height: 1rem;
    margin-right: 2rem
}

section.account-credit-pricing ul.features li {
    line-height: 1.7
}

section.account-credit-pricing ul.features .yes svg path {
    fill: var(--blue-accent-0)
}

section.account-credit-pricing ul.features .no svg path {
    fill: var(--blue-danger-0)
}

section.blog-short-list {
    line-height: 1.7
}

section.blog-short-list .text-wrapper {
    max-width: 900px;
    margin: auto;
    text-align: center
}

section.blog-short-list .tag-line {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--blue-primary-0)
}

section.blog-short-list .section-title {
    font-size: 3rem;
    letter-spacing: 1px;
    font-weight: 600;
    margin: 2rem 0;
    line-height: 1.4
}

section.blog-short-list .explainer {
    font-weight: 300;
    line-height: 1.7;
    font-size: 1.5rem;
    padding: 0 2rem
}

@media (max-width: 900px) {
    section.blog-short-list .section-title {
        font-size:1.5rem
    }

    section.blog-short-list .tag-line {
        font-size: 1rem
    }

    section.blog-short-list .explainer {
        font-size: 1.2rem;
        padding: 0
    }
}

section.blog-short-list .text-wrapper {
    margin-bottom: 2rem
}

section.blog-short-list .explore-more-container {
    display: flex;
    margin-top: 3rem;
    justify-content: center
}

section.blog-short-list .posts {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1rem
}

@media (max-width: 900px) {
    section.blog-short-list .posts {
        grid-template-columns:1fr
    }
}

section.blog-short-list .post {
    display: block;
    text-decoration: none;
    color: var(--blue-text-color);
    background-color: #fff;
    padding: 1rem;
    box-shadow: #0000000d 0 27px 40px 30px;
    border: 2px solid var(--blue-gray-0);
    border-radius: 1rem
}

section.blog-short-list .post img {
    border-top-right-radius: .5rem;
    border-top-left-radius: .5rem
}

section.blog-short-list .post .post-title {
    margin: .8rem 0
}

.sidebar.subscribe {
    background-image: url(/assets/images/qrcode-showcase-bg-1.svg);
    background-position: top;
    color: #fff;
    margin: 4rem 0;
    padding: 2rem;
    border-radius: 1rem;
    line-height: 1.7
}

.sidebar.subscribe h3 {
    margin: 0 0 1rem;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 1px
}

.sidebar.subscribe p {
    margin-bottom: 2rem;
    font-size: .9rem
}

.powered-by {
    text-align: center;
    margin: 1rem 0 2rem;
    color: var(--blue-gray-1)
}

.powered-by a {
    color: var(--blue-text-color);
    text-decoration: none
}

.social-icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.social-icons svg {
    pointer-events: none;
    width: 2rem;
    height: 2rem
}

.social-icons svg * {
    fill: orange
}

.social-icons a {
    display: flex;
    background-color: #fff;
    margin: .5rem 0;
    padding: .5rem;
    border-radius: 50%;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a
}

.social-icons a:not(:last-child) {
    margin-right: 1rem
}

.pincode-layout {
    box-shadow: none;
    text-align: center
}

.pincode-layout .main-details {
    padding: 1rem;
    margin-top: 30%;
    margin-bottom: 2rem
}

.pincode-layout .main-details:not(.loading) .loader {
    display: none
}

.pincode-layout .main-details.loading .pincode-input .fake-input {
    opacity: .5
}

.pincode-layout p {
    line-height: 1.7
}

.pincode-layout .hidden-input {
    position: fixed;
    top: -100000px
}

.pincode-layout .pincode-input {
    margin: 2rem auto;
    display: grid;
    grid-template-columns: repeat(5,1fr);
    grid-gap: .5rem;
    max-width: 350px
}

.pincode-layout .pincode-input .fake-input {
    background-color: var(--blue-input-background-color);
    font-size: 1.7rem;
    text-align: center;
    padding-bottom: 100%;
    border-radius: 50%;
    position: relative
}

.pincode-layout .pincode-input .fake-input .content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.pincode-layout .pincode-input .fake-input:not(.has-value) {
    color: transparent
}

.pincode-layout .submit-button-container {
    margin: 2rem 0 0
}

.pincode-layout .submit-button-container .button,.pincode-layout .submit-button-container .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .pincode-layout .submit-button-container a {
    width: 100%
}

.pincode-layout .error-message {
    color: var(--blue-danger-0)
}

.splash-screen {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background-color: #fff
}

.splash-screen img {
    max-width: 100%;
    height: auto;
    margin: auto;
    animation: splash-screen-animation .8s ease-in-out alternate infinite
}

@keyframes splash-screen-animation {
    0% {
        transform: scale(.9)
    }

    to {
        transform: scale(1)
    }
}

.lead-form .answer.choices .choice {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding: .5rem;
    background-color: #fff6;
    border-radius: .25rem;
    font-size: 1rem;
    cursor: pointer
}

.lead-form .answer.choices .choice .choice-number {
    padding: .15rem;
    background-color: #fff;
    color: #000;
    margin-right: 1rem;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    border-radius: .25rem;
    font-size: .8em
}

.lead-form .answer.choices .choice.checked {
    background-color: #fff;
    color: #000
}

.lead-form .answer.rating {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.lead-form .answer.rating .rating-number {
    width: 2.5rem;
    height: 2.3rem;
    text-align: center;
    margin: .8rem .8rem 0 0;
    background-color: #ffffff80;
    border-radius: .25rem;
    cursor: pointer;
    font-weight: 700;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center
}

.lead-form .answer.rating .rating-number.checked {
    background-color: #fff;
    color: #000
}

.lead-form .answer.stars .stars-container {
    display: flex;
    align-items: center;
    flex-wrap: wrap
}

.lead-form .answer.stars .star {
    flex: 1;
    position: relative;
    padding: .5rem;
    cursor: pointer;
    transition: .2s ease;
    --enabled-color: rgb(240, 240, 45)
}

.lead-form .answer.stars .star svg {
    width: 100%;
    height: auto
}

.lead-form .answer.stars .star svg path {
    fill: currentColor
}

.lead-form .answer.stars .star:hover {
    transform: scale(1.2)
}

.lead-form .answer.stars .star svg {
    display: block
}

.lead-form .answer.stars .star svg.complete {
    display: none
}

.lead-form .answer.stars .star.enabled svg.outlined {
    display: none
}

.lead-form .answer.stars .star.enabled svg.complete {
    display: block
}

.lead-form .answer.stars .star.enabled svg.complete path {
    fill: var(--enabled-color)
}

.lead-form .answer.stars .star-template {
    display: none
}

.lead-form .answer.text textarea,.lead-form .answer.text input,.lead-form .answer.textarea textarea,.lead-form .answer.textarea input {
    -webkit-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 0;
    outline: 0;
    border-bottom: 2px solid var(--blue-gray-1);
    border-radius: 0;
    padding: .5rem 0
}

.lead-form .answer.text textarea::placeholder,.lead-form .answer.text input::placeholder,.lead-form .answer.textarea textarea::placeholder,.lead-form .answer.textarea input::placeholder {
    color: var(--blue-gray-1);
    font-weight: 400
}

.lead-form .flash-animate {
    animation: flash-animation .4s ease both
}

@keyframes flash-animation {
    0% {
        opacity: 1
    }

    30% {
        opacity: .2
    }

    60% {
        opacity: 1
    }

    80% {
        opacity: .1
    }

    to {
        opacity: 1
    }
}

@keyframes lead-form-success-page-animation {
    0% {
        opacity: 0;
        transform: scale(.9) translateY(-10%)
    }

    70% {
        opacity: 1
    }

    to {
        transform: scale(1) translateY(0)
    }
}

.lead-form {
    display: none;
    z-index: 100
}

.lead-form .success-page {
    display: none;
    max-height: 0;
    overflow: hidden
}

.lead-form.success>*:not(.success-page) {
    display: none
}

.lead-form.success .success-page {
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    padding: 1rem;
    z-index: 100;
    max-height: 100vh;
    display: block
}

.lead-form.success .success-page-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    animation: lead-form-success-page-animation .5s ease-in both;
    line-height: 1.7
}

.lead-form.success .success-page-content h2 {
    font-size: 2rem
}

.lead-form.success .success-page-content p {
    margin-top: 0;
    font-size: 1.5rem
}

.lead-form.inline.measured {
    height: 0;
    overflow: hidden;
    border-radius: .5rem;
    pointer-events: none
}

.lead-form.inline.measured:not(.opened) .question-page>* {
    opacity: 0
}

.lead-form.inline.measured:not(.opened) .question-page-footer {
    opacity: 0
}

.lead-form.inline.measured:not(.opened) .lead-form-close-button {
    opacity: 0
}

.lead-form.inline.measured.opening {
    height: 100vh;
    height: var(--available-height);
    transition: .5s ease
}

.lead-form.inline.measured.closing {
    transition: .5s ease
}

.lead-form.inline.measured.closed {
    opacity: 0
}

.lead-form.inline.measured.opened {
    height: 100vh;
    height: var(--available-height);
    border-radius: 0;
    pointer-events: all
}

.lead-form.inline.measured.opened .question-page>* {
    transition: opacity .3s ease
}

.lead-form.inline.measured.opened .question-page-footer {
    transition: opacity .3s ease
}

.lead-form.full-page .lead-form-close-button {
    display: none
}

.lead-form .questions {
    overflow: hidden;
    height: 100%;
    background-color: #06044f
}

.lead-form .question-page {
    height: 100%;
    background-color: #06044f;
    color: #000;
    padding: 0 2rem 0 3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    transition: .5s ease;
    top: 0px
}

.lead-form .question-container {
    font-size: 1.5rem;
    line-height: 1.7
}

.lead-form .question-container input,.lead-form .question-container textarea,.lead-form .question-container,.lead-form .question-container .answer.text input,.lead-form .question-container .answer.text textarea,.lead-form .question-container .answer.text {
    color: #fff
}

.lead-form .question {
    margin-bottom: 2rem;
    position: relative
}

.lead-form .question .question-number {
    position: absolute;
    left: -1.5rem;
    font-size: 1rem;
    top: .35rem
}

.lead-form .question .question-description {
    margin-top: 1rem;
    font-size: 1rem
}

.lead-form *:not(input,textarea) {
    user-select: none
}

.lead-form .ok-button {
    margin-top: 2rem
}

.lead-form .ok-button .button,.lead-form .ok-button .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .lead-form .ok-button a {
    display: flex;
    align-items: center
}

.lead-form .ok-button svg {
    width: 24px;
    height: 24px;
    margin-left: .5rem
}

.lead-form .ok-button svg path {
    fill: currentColor
}

.lead-form .question-page-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 1rem;
    background-color: #00000080
}

.lead-form .button[disabled],.lead-form .qrcode-type-biolinks .link-block a[disabled],.qrcode-type-biolinks .link-block .lead-form a[disabled] {
    opacity: .5;
    pointer-events: none
}

.lead-form .navigation {
    display: flex
}

.lead-form .navigation .button,.lead-form .navigation .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .lead-form .navigation a {
    padding: .2rem
}

.lead-form .navigation .button:first-child,.lead-form .navigation .qrcode-type-biolinks .link-block a:first-child,.qrcode-type-biolinks .link-block .lead-form .navigation a:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.lead-form .navigation .button:nth-child(2),.lead-form .navigation .qrcode-type-biolinks .link-block a:nth-child(2),.qrcode-type-biolinks .link-block .lead-form .navigation a:nth-child(2) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.lead-form .navigation .button svg,.lead-form .navigation .qrcode-type-biolinks .link-block a svg,.qrcode-type-biolinks .link-block .lead-form .navigation a svg {
    width: 2rem;
    height: 2rem
}

.lead-form .navigation .button svg path,.lead-form .navigation .qrcode-type-biolinks .link-block a svg path,.qrcode-type-biolinks .link-block .lead-form .navigation a svg path {
    fill: currentColor
}

.lead-form .lead-form-close-button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 2rem;
    z-index: 3;
    color: #fff;
    box-sizing: content-box;
    cursor: pointer;
    transition: transform .2s ease;
    transform: scale(1)
}

.lead-form .lead-form-close-button:hover {
    transform: scale(1.3)
}

.lead-form .lead-form-close-button .inner-button {
    background-color: #000;
    padding: .5rem;
    border-radius: .25rem;
    width: 3rem;
    height: 3rem;
    display: flex;
    position: relative
}

.lead-form .lead-form-close-button svg {
    width: 100%;
    height: auto
}

.lead-form .lead-form-close-button svg path {
    fill: currentColor
}

@keyframes qrcode-type-slide-down {
    0% {
        opacity: 0;
        transform: translateY(-1rem)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes qrcode-type-slide-up {
    0% {
        margin-top: 0;
        opacity: 0;
        transform: scale(.95)
    }

    to {
        margin-top: -2rem;
        opacity: 1;
        transform: scale(1)
    }
}

.qrcode-type-business-profile {
    user-select: none;
    scrollbar-width: none
}

.qrcode-type-business-profile:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-business-profile .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-business-profile.loaded .loader {
    display: none
}

.qrcode-type-business-profile .bg-image {
    pointer-events: none;
    animation: qrcode-type-slide-down ease .5s both;
    position: fixed;
    top: 0;
    display: none
}

.qrcode-type-business-profile .bg-image-placeholder {
    pointer-events: none;
    opacity: 0
}

.qrcode-type-business-profile .bg-image-placeholder {
    opacity: 0;
    pointer-events: none
}

.qrcode-type-business-profile .details-container {
    border-radius: 1rem;
    margin-top: -2rem;
    position: relative;
    z-index: 1;
    padding: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    animation: qrcode-type-slide-up .3s ease both;
    margin-bottom: 2rem
}

.qrcode-type-business-profile .sep {
    margin: 1rem 0;
    padding: 1rem;
    position: relative
}

.qrcode-type-business-profile .sep:before {
    display: block;
    content: "";
    position: absolute;
    transform: translate(50%,-50%);
    right: 50%;
    top: 50%;
    background-color: #ffffff4d;
    height: 2px;
    width: 70%
}

.qrcode-type-business-profile .social-icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.qrcode-type-business-profile .social-icons svg {
    width: 2rem;
    height: 2rem
}

.qrcode-type-business-profile .social-icons svg * {
    fill: orange
}

.qrcode-type-business-profile .social-icons a {
    display: flex;
    background-color: #fff;
    margin: .5rem 0;
    padding: .5rem;
    border-radius: 50%;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a
}

.qrcode-type-business-profile .social-icons a:not(:last-child) {
    margin-right: 1rem
}

.qrcode-type-business-profile .white-card {
    background-color: #fff;
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    margin: 1rem 0
}

.qrcode-type-business-profile .white-card header {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--blue-gray-1)
}

.qrcode-type-business-profile .white-card header svg {
    width: 2rem;
    margin-right: 1.5rem
}

.qrcode-type-business-profile .white-card header svg * {
    fill: orange
}

.qrcode-type-business-profile .white-card .body {
    line-height: 1.7
}

.qrcode-type-business-profile .white-card .body p {
    margin: 0
}

.qrcode-type-business-profile .white-card .body a {
    color: var(--blue-text-color);
    text-decoration: none
}

.qrcode-type-business-profile .white-card .body .row {
    display: flex;
    justify-content: space-between
}

.qrcode-type-business-profile .white-card .body .vertical-item {
    position: relative
}

.qrcode-type-business-profile .white-card .body .vertical-item:not(:last-child) {
    padding-bottom: 1rem;
    margin-bottom: 1rem
}

.qrcode-type-business-profile .white-card .body .vertical-item:not(:last-child):after {
    display: block;
    content: "";
    position: absolute;
    left: -1rem;
    right: -1rem;
    height: 2px;
    background-color: #e6ebff;
    bottom: 0
}

.qrcode-type-business-profile .white-card .body .vertical-item .key {
    color: var(--blue-gray-1);
    font-weight: 700;
    text-transform: uppercase;
    font-size: .9rem
}

.qrcode-type-business-profile .white-card .body .vertical-item .value {
    font-weight: 700
}

.qrcode-type-business-profile::-webkit-scrollbar {
    display: none
}

.qrcode-type-business-profile .details-container {
    background-image: linear-gradient(135deg,orange,rgb(91,64,2))
}

.qrcode-type-business-profile .portfolio-title {
    color: var(--blue-text-color);
    text-align: center;
    margin: 2rem 0
}

.qrcode-type-business-profile .portfolio-image {
    border-radius: 1rem;
    background-color: #fff;
    text-align: center;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    position: relative
}

.qrcode-type-business-profile .portfolio-image a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.qrcode-type-business-profile .portfolio-image img {
    border-radius: .5rem
}

.qrcode-type-business-profile .portfolio-image .caption {
    display: block;
    margin-top: 1rem;
    font-weight: 700
}

.qrcode-type-business-profile .main-details {
    display: grid;
    grid-template-columns: 2fr 7fr;
    grid-gap: 1rem;
    color: #fff
}

.qrcode-type-business-profile .main-details h1 {
    margin-top: 0
}

.qrcode-type-business-profile .main-details p {
    line-height: 1.7rem
}

.qrcode-type-business-profile .main-details .button,.qrcode-type-business-profile .main-details .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .qrcode-type-business-profile .main-details a {
    width: fit-content
}

.qrcode-type-business-profile .main-details .business-logo-container {
    display: flex;
    align-items: flex-start;
    justify-content: center
}

.qrcode-type-business-profile .main-details .logo-circle {
    border-radius: 50%;
    background-color: #fff;
    width: 100%;
    padding-bottom: 100%;
    background-size: 80%;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a
}

.qrcode-type-business-profile .lead-form-trigger {
    margin: 1rem auto
}

.qrcode-type-vcard-plus {
    user-select: none;
    scrollbar-width: none
}

.qrcode-type-vcard-plus:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-vcard-plus .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-vcard-plus.loaded .loader {
    display: none
}

.qrcode-type-vcard-plus .bg-image {
    pointer-events: none;
    animation: qrcode-type-slide-down ease .5s both;
    position: fixed;
    top: 0;
    display: none
}

.qrcode-type-vcard-plus .bg-image-placeholder {
    pointer-events: none;
    opacity: 0
}

.qrcode-type-vcard-plus .bg-image-placeholder {
    opacity: 0;
    pointer-events: none
}

.qrcode-type-vcard-plus .details-container {
    border-radius: 1rem;
    margin-top: -2rem;
    position: relative;
    z-index: 1;
    padding: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    animation: qrcode-type-slide-up .3s ease both;
    margin-bottom: 2rem
}

.qrcode-type-vcard-plus .sep {
    margin: 1rem 0;
    padding: 1rem;
    position: relative
}

.qrcode-type-vcard-plus .sep:before {
    display: block;
    content: "";
    position: absolute;
    transform: translate(50%,-50%);
    right: 50%;
    top: 50%;
    background-color: #ffffff4d;
    height: 2px;
    width: 70%
}

.qrcode-type-vcard-plus .social-icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.qrcode-type-vcard-plus .social-icons svg {
    width: 2rem;
    height: 2rem
}

.qrcode-type-vcard-plus .social-icons svg * {
    fill: orange
}

.qrcode-type-vcard-plus .social-icons a {
    display: flex;
    background-color: #fff;
    margin: .5rem 0;
    padding: .5rem;
    border-radius: 50%;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a
}

.qrcode-type-vcard-plus .social-icons a:not(:last-child) {
    margin-right: 1rem
}

.qrcode-type-vcard-plus .white-card {
    background-color: #fff;
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    margin: 1rem 0
}

.qrcode-type-vcard-plus .white-card header {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--blue-gray-1)
}

.qrcode-type-vcard-plus .white-card header svg {
    width: 2rem;
    margin-right: 1.5rem
}

.qrcode-type-vcard-plus .white-card header svg * {
    fill: #1e4fb0
}

.qrcode-type-vcard-plus .white-card .body {
    line-height: 1.7
}

.qrcode-type-vcard-plus .white-card .body p {
    margin: 0
}

.qrcode-type-vcard-plus .white-card .body a {
    color: var(--blue-text-color);
    text-decoration: none
}

.qrcode-type-vcard-plus .white-card .body .row {
    display: flex;
    justify-content: space-between
}

.qrcode-type-vcard-plus .white-card .body .vertical-item {
    position: relative
}

.qrcode-type-vcard-plus .white-card .body .vertical-item:not(:last-child) {
    padding-bottom: 1rem;
    margin-bottom: 1rem
}

.qrcode-type-vcard-plus .white-card .body .vertical-item:not(:last-child):after {
    display: block;
    content: "";
    position: absolute;
    left: -1rem;
    right: -1rem;
    height: 2px;
    background-color: #e6ebff;
    bottom: 0
}

.qrcode-type-vcard-plus .white-card .body .vertical-item .key {
    color: var(--blue-gray-1);
    font-weight: 700;
    text-transform: uppercase;
    font-size: .9rem
}

.qrcode-type-vcard-plus .white-card .body .vertical-item .value {
    font-weight: 700
}

.qrcode-type-vcard-plus::-webkit-scrollbar {
    display: none
}

.qrcode-type-vcard-plus .custom-links {
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center
}

.qrcode-type-vcard-plus .custom-links .custom-link {
    margin-right: 1rem;
    margin-top: 1rem
}

.qrcode-type-vcard-plus .custom-links .custom-link:last-child {
    margin-right: 0
}

.qrcode-type-vcard-plus .faqs-card header {
    text-align: center;
    justify-content: center
}

.qrcode-type-vcard-plus .faqs-card .faq-items {
    line-height: 1.7
}

.qrcode-type-vcard-plus .faqs-card .faq-item {
    position: relative;
    border-bottom: 2px solid #e6ebff
}

.qrcode-type-vcard-plus .faqs-card .faq-title {
    margin: .5rem 0;
    display: flex;
    align-items: center
}

.qrcode-type-vcard-plus .faqs-card .faq-title svg {
    width: 2rem;
    height: 2rem;
    margin-left: auto;
    transition: .25s linear
}

.qrcode-type-vcard-plus .faqs-card .faq-title svg path {
    fill: var(--blue-gray-1)
}

.qrcode-type-vcard-plus .faqs-card .faq-item.active .faq-title svg {
    transform: rotate(90deg) scale(.9);
    opacity: .5
}

.qrcode-type-vcard-plus .faqs-card .faq-description {
    transition: all .5s ease;
    max-height: 700px;
    overflow: hidden;
    transform: scale(1);
    margin-bottom: 1rem
}

.qrcode-type-vcard-plus .faqs-card .faq-item:not(.active) .faq-description {
    max-height: 0;
    opacity: 0;
    transform: scale(.9);
    margin-bottom: 0
}

.qrcode-type-vcard-plus .social-icons a * {
    fill: #1e4fb0
}

.qrcode-type-vcard-plus .details-container {
    background-image: linear-gradient(135deg,rgb(245,244,255),rgb(151,151,151))
}

.qrcode-type-vcard-plus .details-container .gradient-bg {
    background-image: linear-gradient(135deg,rgb(102,211,211),rgb(3,78,78));
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 0;
    height: 60%;
    border-radius: 1rem 1rem 2rem 2rem
}

.qrcode-type-vcard-plus .details-container>*:not(.gradient-bg) {
    z-index: 1;
    position: relative
}

.qrcode-type-vcard-plus .qrcode-container {
    background-color: #fff;
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    width: 50vw;
    max-width: 300px;
    margin: 0 auto;
    margin-top: -10rem
}

.qrcode-type-vcard-plus .vertical-list {
    text-align: center;
    color: #fff;
    padding: 0 1rem
}

.qrcode-type-vcard-plus .vertical-list .name {
    font-size: 2.4rem
}

.qrcode-type-vcard-plus .vertical-list .company {
    margin-top: 0rem;
    font-size: 1.3rem;
    font-weight: 700
}

.qrcode-type-vcard-plus .vertical-list .designation {
    margin-bottom: .5rem
}

.qrcode-type-vcard-plus .vertical-list .short-bio {
    line-height: 2
}

.qrcode-type-vcard-plus .button.add-contact.floating,.qrcode-type-vcard-plus .qrcode-type-biolinks .link-block a.add-contact.floating,.qrcode-type-biolinks .link-block .qrcode-type-vcard-plus a.add-contact.floating {
    position: fixed;
    bottom: 3rem;
    z-index: 1;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a,0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    background-color: #7031d8;
    color: #fff;
    transition: none
}

.qrcode-type-vcard-plus .classic-add-to-contacts {
    margin: 2rem 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.qrcode-type-vcard-plus .classic-add-to-contacts .button,.qrcode-type-vcard-plus .classic-add-to-contacts .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .qrcode-type-vcard-plus .classic-add-to-contacts a {
    border: 0;
    background-color: #7031d8;
    color: #fff
}

.qrcode-type-vcard-plus .portfolio-title {
    color: var(--blue-text-color);
    text-align: center;
    margin: 2rem 0
}

.qrcode-type-vcard-plus .portfolio-image {
    border-radius: 1rem;
    background-color: #fff;
    text-align: center;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    position: relative
}

.qrcode-type-vcard-plus .portfolio-image a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.qrcode-type-vcard-plus .portfolio-image img {
    border-radius: .5rem
}

.qrcode-type-vcard-plus .portfolio-image .caption {
    display: block;
    margin-top: 1rem;
    font-weight: 700
}

.qrcode-type-vcard-plus .portfolio-image .description {
    margin-top: 1rem;
    line-height: 1.7
}

.qrcode-type-vcard-plus .lead-form-trigger {
    margin: 1rem auto
}

.qrcode-type-restaurant-menu {
    scrollbar-width: none
}

.qrcode-type-restaurant-menu:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-restaurant-menu .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-restaurant-menu.loaded .loader {
    display: none
}

.qrcode-type-restaurant-menu::-webkit-scrollbar {
    display: none
}

.qrcode-type-restaurant-menu * {
    user-select: none;
    -webkit-user-select: none
}

.qrcode-type-restaurant-menu .layout-generated-webpage {
    background-color: #1b0e55;
    color: #fff
}

.qrcode-type-restaurant-menu .layout-generated-webpage .main-page {
    padding-top: 2rem;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.qrcode-type-restaurant-menu .layout-generated-webpage .main-line {
    font-size: 3rem;
    color: #fffce6;
    margin-top: 1rem;
    margin-bottom: 0;
    padding: 0 1rem;
    text-align: center
}

.qrcode-type-restaurant-menu .layout-generated-webpage .restaurant-details {
    margin-top: 1rem;
    margin-bottom: 2rem;
    font-size: 1.1rem;
    color: #fffce6;
    text-align: center;
    font-weight: 700;
    line-height: 1.7;
    padding: 0 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .restaurant-details a {
    color: #fffce6;
    text-decoration: none
}

.qrcode-type-restaurant-menu .layout-generated-webpage .restaurant-details .social-icons {
    margin-top: 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .restaurant-details .social-icons svg path {
    fill: #1b0e55
}

.qrcode-type-restaurant-menu .layout-generated-webpage .logo {
    max-width: 80%;
    margin: auto auto 0
}

.qrcode-type-restaurant-menu .layout-generated-webpage .categories-container {
    margin-top: auto;
    overflow: hidden;
    width: 100%
}

.qrcode-type-restaurant-menu .layout-generated-webpage .categories {
    margin-top: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    transform: translateY(2rem)
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page {
    display: none;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page .serving-hours {
    padding: 0 1rem;
    margin-bottom: 1rem;
    text-align: center;
    color: #1b0e55
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.sub-category-active .menu-items .menu-item {
    transition: all ease .7s;
    max-height: 70vh;
    overflow: hidden
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.sub-category-active .menu-items .menu-item:not(.current-sub-category) {
    margin: 0;
    opacity: 0;
    max-height: 0!important;
    pointer-events: none;
    transform: scale(.97)
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page .sub-categories {
    margin: .5rem 0;
    display: flex;
    flex-wrap: wrap;
    padding: 0 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page .sub-categories .sub-category {
    padding: .6rem .8rem;
    background-color: #1b0e55;
    color: #fff;
    border-radius: .25rem;
    text-align: center;
    cursor: pointer;
    margin: .5rem 0;
    margin-left: 0;
    margin-right: .5rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    overflow: auto;
    scrollbar-width: none
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open::-webkit-scrollbar {
    display: none
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open.animated {
    transition: all ease .5s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open.closing {
    overflow: hidden;
    pointer-events: none;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open.closing>*:not(.category-page-title) {
    opacity: 0
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open.closing .close-button {
    display: none
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open .close-button {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    cursor: pointer;
    padding: 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open .close-button svg {
    display: block;
    width: 3rem;
    height: 3rem;
    pointer-events: none
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page.open .close-button svg path {
    fill: #1b0e55
}

.qrcode-type-restaurant-menu .layout-generated-webpage .category-page-title {
    font-size: 1.5rem;
    text-align: center;
    margin: 2rem 0 1rem;
    font-weight: 700
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category {
    color: #1b0e55;
    background-color: #ccdede;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem;
    text-align: center;
    padding: 2rem 0 4rem;
    font-size: 1.5rem;
    margin-top: -2rem;
    font-weight: 700;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    cursor: pointer;
    position: relative;
    transition: all .5s ease
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(1) {
    transition-delay: .05s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(2) {
    transition-delay: .1s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(3) {
    transition-delay: .15s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(4) {
    transition-delay: .2s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(5) {
    transition-delay: .25s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(6) {
    transition-delay: .3s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(7) {
    transition-delay: .35s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(8) {
    transition-delay: .4s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(9) {
    transition-delay: .45s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(10) {
    transition-delay: .5s
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category.hidden {
    transform: translateY(30vh)
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(2) {
    background-color: #fbed88
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(3) {
    background-color: #ffc3c3
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(4) {
    background-color: #d8ffdc
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(9) {
    z-index: 9
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(8) {
    z-index: 8
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(7) {
    z-index: 7
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(6) {
    z-index: 6
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(5) {
    z-index: 5
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(4) {
    z-index: 4
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(3) {
    z-index: 3
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(2) {
    z-index: 2
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(1) {
    z-index: 1
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-category:nth-child(0) {
    z-index: 0
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours {
    font-size: .9rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours .row {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours .row:not(.additional) {
    margin-top: .5rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours .row:not(.additional):not(:first-child) {
    border-top: 1px solid rgba(0,0,0,.3);
    padding-top: .5rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours .row:first-child {
    margin-top: 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours .key {
    width: 7rem;
    text-align: left
}

.qrcode-type-restaurant-menu .layout-generated-webpage .opening-hours .value {
    text-align: right
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-items {
    padding: 0 1rem;
    display: flex;
    flex-direction: column
}

.qrcode-type-restaurant-menu .layout-generated-webpage .food-allergens {
    display: flex;
    flex-wrap: wrap;
    margin: .5rem 0
}

.qrcode-type-restaurant-menu .layout-generated-webpage .food-allergens-item {
    display: flex;
    flex-direction: column;
    margin: .5rem .5rem .5rem 0
}

.qrcode-type-restaurant-menu .layout-generated-webpage .food-allergens-item-icon {
    width: 50px;
    height: 50px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat
}

.qrcode-type-restaurant-menu .layout-generated-webpage .food-allergens-item-name {
    font-size: .6rem;
    margin-top: .5rem;
    font-weight: 700;
    text-align: center
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item {
    color: #1b0e55
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item:not(:first-child) {
    margin-top: 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item img {
    border-radius: 1rem;
    display: block;
    margin: auto
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item-details {
    margin: 1rem 0;
    display: flex;
    align-items: flex-start;
    line-height: 1.7
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item-details .title-ingredients {
    padding-right: 1rem;
    flex: 1
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item-title {
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: .5rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item-price {
    font-size: 1.6rem;
    font-weight: 700
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item.horizontal {
    display: flex;
    align-items: flex-start;
    margin: 1rem 0
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item.horizontal .image-container {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100px;
    height: 80px;
    margin-right: 1rem;
    position: relative;
    border-radius: 1rem
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item.horizontal img {
    max-height: 100%
}

.qrcode-type-restaurant-menu .layout-generated-webpage .menu-item.horizontal .menu-item-details {
    flex: 1;
    margin-top: 0
}

.qrcode-type-restaurant-menu .powered-by {
    margin-top: 2rem
}

body.block-scroll {
    position: fixed;
    overflow: hidden;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%
}

.qrcode-type-product-catalogue {
    scrollbar-width: none
}

.qrcode-type-product-catalogue:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-product-catalogue .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-product-catalogue.loaded .loader {
    display: none
}

.qrcode-type-product-catalogue::-webkit-scrollbar {
    display: none
}

.qrcode-type-product-catalogue * {
    user-select: none;
    -webkit-user-select: none
}

.qrcode-type-product-catalogue .order-button {
    border: 0;
    width: fit-content;
    margin-top: 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage {
    background-image: linear-gradient(135deg,#c8beb7,rgb(72,64,58));
    color: #fff
}

.qrcode-type-product-catalogue .layout-generated-webpage .main-page {
    padding-top: 2rem;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center
}

.qrcode-type-product-catalogue .layout-generated-webpage .main-line {
    font-size: 3rem;
    color: #fffce6;
    margin-top: 1rem;
    margin-bottom: 0;
    padding: 0 1rem;
    text-align: center
}

.qrcode-type-product-catalogue .layout-generated-webpage .restaurant-details {
    margin-top: 1rem;
    margin-bottom: 2rem;
    font-size: 1.1rem;
    color: #fffce6;
    text-align: center;
    font-weight: 700;
    line-height: 1.7;
    padding: 0 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .restaurant-details a {
    color: #fffce6;
    text-decoration: none
}

.qrcode-type-product-catalogue .layout-generated-webpage .restaurant-details .social-icons {
    margin-top: 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .restaurant-details .social-icons svg path {
    fill: #1b0e55
}

.qrcode-type-product-catalogue .layout-generated-webpage .logo {
    max-width: 80%;
    margin: auto auto 0
}

.qrcode-type-product-catalogue .layout-generated-webpage .categories-container {
    margin-top: auto;
    overflow: hidden;
    width: 100%
}

.qrcode-type-product-catalogue .layout-generated-webpage .categories {
    margin-top: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    transform: translateY(2rem)
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page {
    display: none;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page .serving-hours {
    padding: 0 1rem;
    margin-bottom: 1rem;
    text-align: center;
    color: #1b0e55
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.sub-category-active .menu-items .menu-item {
    transition: all ease .7s;
    overflow: hidden
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.sub-category-active .menu-items .menu-item:not(.current-sub-category) {
    margin: 0;
    opacity: 0;
    max-height: 0!important;
    pointer-events: none;
    transform: scale(.97)
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page .sub-categories {
    margin: .5rem 0;
    display: flex;
    flex-wrap: wrap;
    padding: 0 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page .sub-categories .sub-category {
    padding: .6rem .8rem;
    background-color: #1b0e55;
    color: #fff;
    border-radius: .25rem;
    text-align: center;
    cursor: pointer;
    margin: .5rem 0;
    margin-left: 0;
    margin-right: .5rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    overflow: auto;
    scrollbar-width: none
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open::-webkit-scrollbar {
    display: none
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open.animated {
    transition: all ease .5s
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open.closing {
    overflow: hidden;
    pointer-events: none;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open.closing>*:not(.category-page-title) {
    opacity: 0
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open.closing .close-button {
    display: none
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open .close-button {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    cursor: pointer;
    padding: 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open .close-button svg {
    display: block;
    width: 3rem;
    height: 3rem;
    pointer-events: none
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page.open .close-button svg path {
    fill: #1b0e55
}

.qrcode-type-product-catalogue .layout-generated-webpage .category-page-title {
    font-size: 1.5rem;
    text-align: center;
    margin: 2rem 0 1rem;
    font-weight: 700
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category {
    color: #1b0e55;
    background-color: #ccdede;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem;
    text-align: center;
    padding: 2rem 0 4rem;
    font-size: 1.5rem;
    margin-top: -2rem;
    font-weight: 700;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    cursor: pointer;
    position: relative;
    transition: all .5s ease
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(1) {
    transition-delay: .05s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(2) {
    transition-delay: .1s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(3) {
    transition-delay: .15s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(4) {
    transition-delay: .2s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(5) {
    transition-delay: .25s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(6) {
    transition-delay: .3s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(7) {
    transition-delay: .35s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(8) {
    transition-delay: .4s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(9) {
    transition-delay: .45s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(10) {
    transition-delay: .5s
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category.hidden {
    transform: translateY(30vh)
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(2) {
    background-color: #fbed88
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(3) {
    background-color: #ffc3c3
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(4) {
    background-color: #d8ffdc
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(9) {
    z-index: 9
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(8) {
    z-index: 8
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(7) {
    z-index: 7
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(6) {
    z-index: 6
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(5) {
    z-index: 5
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(4) {
    z-index: 4
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(3) {
    z-index: 3
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(2) {
    z-index: 2
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(1) {
    z-index: 1
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-category:nth-child(0) {
    z-index: 0
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours {
    font-size: .9rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours .row {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours .row:not(.additional) {
    margin-top: .5rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours .row:not(.additional):not(:first-child) {
    border-top: 1px solid rgba(0,0,0,.3);
    padding-top: .5rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours .row:first-child {
    margin-top: 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours .key {
    width: 7rem;
    text-align: left
}

.qrcode-type-product-catalogue .layout-generated-webpage .opening-hours .value {
    text-align: right
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-items {
    padding: 0 1rem;
    display: flex;
    flex-direction: column
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item {
    color: #1b0e55
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item:not(:first-child) {
    margin-top: 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item img {
    border-radius: 1rem;
    display: block;
    margin: auto
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item-details {
    margin: 1rem 0;
    align-items: flex-start;
    line-height: 1.7
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item-details .title-ingredients {
    padding-right: 1rem;
    flex: 1
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item-title {
    font-weight: 700;
    font-size: 1.3rem;
    margin-bottom: .5rem;
    text-decoration: none
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item-price {
    font-size: 1.6rem;
    font-weight: 700
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item.horizontal {
    display: flex;
    align-items: flex-start;
    margin: 1rem 0
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item.horizontal .image-container {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100px;
    height: 80px;
    margin-right: 1rem;
    position: relative;
    border-radius: 1rem
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item.horizontal img {
    max-height: 100%
}

.qrcode-type-product-catalogue .layout-generated-webpage .menu-item.horizontal .menu-item-details {
    flex: 1;
    margin-top: 0
}

.qrcode-type-product-catalogue .powered-by {
    margin-top: 2rem
}

.dynamic-block .inner-block {
    --icon-width: 3rem
}

.dynamic-block .inner-block-boxed {
    background-color: #fff;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    border-radius: 1rem;
    margin-bottom: 2rem;
    padding: 1rem;
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: var(--icon-width) 1fr
}

.dynamic-block .inner-block-boxed.dynamic-block-image {
    display: flex
}

.dynamic-block .inner-block-boxed.no-icon {
    grid-template-columns: 1fr
}

.dynamic-block .inner-block.dynamic-block-image {
    max-width: 70%;
    margin: 0 auto 2rem;
    position: relative
}

.dynamic-block .inner-block.dynamic-block-image img {
    border-radius: .5rem
}

.dynamic-block .inner-block .icon {
    width: var(--icon-width);
    height: var(--icon-width);
    opacity: .6;
    display: flex;
    align-items: center;
    justify-content: center
}

.dynamic-block .inner-block .icon img {
    max-height: 100%
}

.dynamic-block .inner-block .details {
    overflow: hidden
}

.dynamic-block .inner-block .field-name {
    margin-top: .5rem;
    margin-bottom: .5rem;
    font-size: 1.3rem;
    text-transform: uppercase;
    text-overflow: ellipsis;
    overflow: hidden
}

.dynamic-block .inner-block .field-value {
    font-size: 1.3rem;
    color: var(--blue-gray-2);
    font-weight: 700;
    text-overflow: ellipsis;
    overflow: hidden
}

.paragraph-block .text {
    line-height: 1.7;
    text-align: center
}

.block.opening-hours-block {
    font-size: .9rem
}

.block.opening-hours-block .row {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.block.opening-hours-block .row:not(.additional) {
    margin-top: .5rem
}

.block.opening-hours-block .row:not(.additional):not(:first-child) {
    border-top: 1px solid rgba(0,0,0,.3);
    padding-top: .5rem
}

.block.opening-hours-block .row:first-child {
    margin-top: 1rem
}

.block.opening-hours-block .key {
    width: 7rem;
    text-align: left
}

.block.opening-hours-block .value {
    text-align: right
}

.block.opening-hours-block .white-card {
    background-color: #fff;
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    margin: 1rem 0
}

.block.opening-hours-block .white-card header {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--blue-gray-1)
}

.block.opening-hours-block .white-card header svg {
    width: 2rem;
    margin-right: 1.5rem
}

.block.opening-hours-block .white-card header svg * {
    fill: #000
}

.block.opening-hours-block .white-card .body {
    line-height: 1.7
}

.block.opening-hours-block .white-card .body p {
    margin: 0
}

.block.opening-hours-block .white-card .body a {
    color: var(--blue-text-color);
    text-decoration: none
}

.block.opening-hours-block .white-card .body .row {
    display: flex;
    justify-content: space-between
}

.block.opening-hours-block .white-card .body .vertical-item {
    position: relative
}

.block.opening-hours-block .white-card .body .vertical-item:not(:last-child) {
    padding-bottom: 1rem;
    margin-bottom: 1rem
}

.block.opening-hours-block .white-card .body .vertical-item:not(:last-child):after {
    display: block;
    content: "";
    position: absolute;
    left: -1rem;
    right: -1rem;
    height: 2px;
    background-color: #e6ebff;
    bottom: 0
}

.block.opening-hours-block .white-card .body .vertical-item .key {
    color: var(--blue-gray-1);
    font-weight: 700;
    text-transform: uppercase;
    font-size: .9rem
}

.block.opening-hours-block .white-card .body .vertical-item .value {
    font-weight: 700
}

.lead-form-block .lead-form-trigger {
    width: 100%
}

.qrcode-type-biolinks:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-biolinks .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-biolinks.loaded .loader {
    display: none
}

.qrcode-type-biolinks .layout-generated-webpage {
    display: flex;
    flex-direction: column;
    padding: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
    background-size: cover;
    background-position: center
}

.qrcode-type-biolinks .block {
    margin: 2rem 0
}

.qrcode-type-biolinks .logo-block {
    display: flex;
    align-items: center;
    padding: 0 1rem;
    justify-content: center;
    flex-direction: column
}

.qrcode-type-biolinks .logo-block img {
    width: 120px;
    height: auto;
    margin-bottom: 1.5rem
}

.qrcode-type-biolinks .title-block {
    text-align: center
}

.qrcode-type-biolinks .title-block h2 {
    margin: 0;
    text-transform: uppercase;
    font-size: 1.3rem
}

.qrcode-type-biolinks .image-grid-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1rem
}

.qrcode-type-biolinks .image-grid-block a {
    display: block;
    padding-bottom: 100%;
    background-size: cover;
    background-position: center
}

.qrcode-type-biolinks .link-block {
    display: flex;
    flex-direction: column
}

.qrcode-type-biolinks .link-block a {
    line-height: 1.7
}

.qrcode-type-biolinks .image-block {
    display: flex;
    flex-direction: column;
    text-align: center;
    position: relative
}

.qrcode-type-biolinks .image-block.has-border {
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    padding: 1rem;
    background-color: #fff;
    border-radius: 1rem
}

.qrcode-type-biolinks .image-block.has-border img {
    border-radius: .5rem
}

.qrcode-type-biolinks .image-block .caption {
    font-weight: 700;
    margin-top: 1rem;
    line-height: 1.5
}

.qrcode-type-biolinks .image-block a {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute
}

.qrcode-type-event {
    user-select: none;
    scrollbar-width: none
}

.qrcode-type-event:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-event .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-event.loaded .loader {
    display: none
}

.qrcode-type-event .bg-image {
    pointer-events: none;
    animation: qrcode-type-slide-down ease .5s both;
    position: fixed;
    top: 0;
    display: none
}

.qrcode-type-event .bg-image-placeholder {
    pointer-events: none;
    opacity: 0
}

.qrcode-type-event .bg-image-placeholder {
    opacity: 0;
    pointer-events: none
}

.qrcode-type-event .details-container {
    border-radius: 1rem;
    margin-top: -2rem;
    position: relative;
    z-index: 1;
    padding: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    animation: qrcode-type-slide-up .3s ease both;
    margin-bottom: 2rem
}

.qrcode-type-event .sep {
    margin: 1rem 0;
    padding: 1rem;
    position: relative
}

.qrcode-type-event .sep:before {
    display: block;
    content: "";
    position: absolute;
    transform: translate(50%,-50%);
    right: 50%;
    top: 50%;
    background-color: #ffffff4d;
    height: 2px;
    width: 70%
}

.qrcode-type-event .social-icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.qrcode-type-event .social-icons svg {
    width: 2rem;
    height: 2rem
}

.qrcode-type-event .social-icons svg * {
    fill: orange
}

.qrcode-type-event .social-icons a {
    display: flex;
    background-color: #fff;
    margin: .5rem 0;
    padding: .5rem;
    border-radius: 50%;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a
}

.qrcode-type-event .social-icons a:not(:last-child) {
    margin-right: 1rem
}

.qrcode-type-event .white-card {
    background-color: #fff;
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    margin: 1rem 0
}

.qrcode-type-event .white-card header {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--blue-gray-1)
}

.qrcode-type-event .white-card header svg {
    width: 2rem;
    margin-right: 1.5rem
}

.qrcode-type-event .white-card header svg * {
    fill: #1e4fb0
}

.qrcode-type-event .white-card .body {
    line-height: 1.7
}

.qrcode-type-event .white-card .body p {
    margin: 0
}

.qrcode-type-event .white-card .body a {
    color: var(--blue-text-color);
    text-decoration: none
}

.qrcode-type-event .white-card .body .row {
    display: flex;
    justify-content: space-between
}

.qrcode-type-event .white-card .body .vertical-item {
    position: relative
}

.qrcode-type-event .white-card .body .vertical-item:not(:last-child) {
    padding-bottom: 1rem;
    margin-bottom: 1rem
}

.qrcode-type-event .white-card .body .vertical-item:not(:last-child):after {
    display: block;
    content: "";
    position: absolute;
    left: -1rem;
    right: -1rem;
    height: 2px;
    background-color: #e6ebff;
    bottom: 0
}

.qrcode-type-event .white-card .body .vertical-item .key {
    color: var(--blue-gray-1);
    font-weight: 700;
    text-transform: uppercase;
    font-size: .9rem
}

.qrcode-type-event .white-card .body .vertical-item .value {
    font-weight: 700
}

.qrcode-type-event add-to-calendar-button:not(.qrcg-loaded) {
    display: none
}

.qrcode-type-event::-webkit-scrollbar {
    display: none
}

.qrcode-type-event .custom-links {
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap
}

.qrcode-type-event .custom-links .custom-link {
    margin-right: 1rem;
    margin-top: 1rem
}

.qrcode-type-event .faqs-card header {
    text-align: center;
    justify-content: center
}

.qrcode-type-event .faqs-card .faq-items {
    line-height: 1.7
}

.qrcode-type-event .faqs-card .faq-item {
    position: relative;
    border-bottom: 2px solid #e6ebff
}

.qrcode-type-event .faqs-card .faq-title {
    margin: .5rem 0;
    display: flex;
    align-items: center
}

.qrcode-type-event .faqs-card .faq-title svg {
    width: 2rem;
    height: 2rem;
    margin-left: auto;
    transition: .25s linear
}

.qrcode-type-event .faqs-card .faq-title svg path {
    fill: var(--blue-gray-1)
}

.qrcode-type-event .faqs-card .faq-item.active .faq-title svg {
    transform: rotate(90deg) scale(.9);
    opacity: .5
}

.qrcode-type-event .faqs-card .faq-description {
    transition: all .5s ease;
    max-height: 700px;
    overflow: hidden;
    transform: scale(1);
    margin-bottom: 1rem
}

.qrcode-type-event .faqs-card .faq-item:not(.active) .faq-description {
    max-height: 0;
    opacity: 0;
    transform: scale(.9);
    margin-bottom: 0
}

.qrcode-type-event .social-icons {
    margin-bottom: 1rem
}

.qrcode-type-event .social-icons a * {
    fill: #1e4fb0
}

.qrcode-type-event .details-container {
    background-image: linear-gradient(135deg,rgb(245,244,255),rgb(151,151,151))
}

.qrcode-type-event .details-container .gradient-bg {
    background-image: linear-gradient(135deg,#f9c184,rgb(255,208,1));
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 0;
    height: 60%;
    border-radius: 1rem 1rem 2rem 2rem
}

.qrcode-type-event .details-container>*:not(.gradient-bg) {
    z-index: 1;
    position: relative
}

.qrcode-type-event .qrcode-container {
    background-color: #fff;
    padding: .5rem;
    border-radius: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    width: 30vw;
    max-width: 300px;
    margin: 0 auto;
    margin-top: -10rem
}

.qrcode-type-event .date-card .time {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #e5e5e5;
    padding: .1rem .5rem;
    font-weight: 400;
    color: #000;
    border-radius: .5rem;
    margin-left: 1rem
}

.qrcode-type-event .date-card .time svg {
    width: 1rem;
    height: 1rem;
    margin-right: .5rem
}

.qrcode-type-event .date-card .time svg path {
    fill: currentColor
}

.qrcode-type-event .date-card .body .description {
    margin-top: .5rem
}

.qrcode-type-event .vertical-list {
    text-align: center;
    color: #49402f;
    padding: 0 1rem
}

.qrcode-type-event .vertical-list .name {
    font-size: 2.4rem
}

.qrcode-type-event .vertical-list .company {
    margin-top: 0rem;
    font-size: 1.3rem;
    font-weight: 700
}

.qrcode-type-event .vertical-list .designation {
    margin-bottom: .5rem
}

.qrcode-type-event .vertical-list .short-bio {
    line-height: 2
}

.qrcode-type-event .button.add-contact.floating,.qrcode-type-event .qrcode-type-biolinks .link-block a.add-contact.floating,.qrcode-type-biolinks .link-block .qrcode-type-event a.add-contact.floating {
    position: fixed;
    bottom: 3rem;
    z-index: 1;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a,0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    background-color: #382c00;
    color: #fff;
    transition: none
}

.qrcode-type-event .classic-add-to-contacts {
    margin: 2rem 0;
    display: flex;
    align-items: center;
    justify-content: center
}

.qrcode-type-event .classic-add-to-contacts .button,.qrcode-type-event .classic-add-to-contacts .qrcode-type-biolinks .link-block a,.qrcode-type-biolinks .link-block .qrcode-type-event .classic-add-to-contacts a {
    border: 0;
    background-color: #382c00;
    color: #fff
}

.qrcode-type-event .location-card .body a.get-directions {
    color: #13508c;
    text-decoration: underline;
    display: block;
    margin-top: 1rem
}

.qrcode-type-event .portfolio-title {
    color: var(--blue-text-color);
    text-align: center;
    margin: 2rem 0
}

.qrcode-type-event .portfolio-image {
    border-radius: 1rem;
    background-color: #fff;
    text-align: center;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 5px 7px 1px #0000001a,0 0 15px #0000001a;
    position: relative
}

.qrcode-type-event .portfolio-image a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0
}

.qrcode-type-event .portfolio-image img {
    border-radius: .5rem
}

.qrcode-type-event .portfolio-image .caption {
    display: block;
    margin-top: 1rem;
    font-weight: 700
}

.qrcode-type-event .lead-form-trigger {
    margin: 1rem auto
}

.qrcode-type-lead-form:not(.loaded)>*:not(.loader) {
    display: none
}

.qrcode-type-lead-form .loader {
    position: fixed;
    left: 50%;
    top: 40%;
    transform: translate(-50%,-50%)
}

.qrcode-type-lead-form.loaded .loader,.qrcode-type-lead-form .powered-by {
    display: none
}