﻿@import url('https://fonts.googleapis.com/css2?family=PT+Sans+Narrow:wght@700&family=PT+Sans:wght@700&display=swap&family=PT+Sans+Narrow&display=swap&family=Oswald:wght@300;400&display=swap');

:root {
    --red1: red;
    --red2: orange;
    --orange1: orangered;
    --green1: #13B999;
    --blue1: blue;
    --blue2: rgba(16, 137, 255, 0.8);
    --white: white;
    --white1: white;
    --white2: #eee;
    --gray1: gray;
    --black1: black;
    --font1: "Roboto", sans-serif;
    --font2: "Dancing Script", sans-serif;
    --font3: "PT Sans", sans-serif;
    --font4: "PT Sans Narrow",sans-serif;
    --font5: "Oswald", sans-serif;
}

input[type=radio] {
    color: var(--green1);
    background-color: var(--green1);
    border-color: var(--green1);
}

::-moz-selection {
    background: var(--black1);
    color: var(--white1);
}

::selection {
    background: var(--black1);
    color: var(--white1);
}

html {
    overflow-x: hidden;
}

body {
    font-family: var(--font1);
    color: var(--gray1);
    line-height: 1.7;
    font-weight: 300;
    font-size: 1.1rem;
}

h1, h2, h3, h4, h5,
.h1, .h2, .h3, .h4, .h5 {
    font-family: var(--font1);
    text-transform: uppercase;
    color: var(--green1);
}

h2, .h2 {
    font-size: 1.2em;
    font-family: var(--font5);
}

h3, .h3 {
    font-size: 3em;
    font-family: var(--font5);
}

a {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    color: var(--green1);
    font-weight: bold;
}

    a:hover {
        text-decoration: none;
    }

    a:not([href]) {
        color: var(--gray1);
        text-decoration: none;
    }

form {
    width: 100%;
    margin-left: 0px;
}

label {
    margin-bottom: .2rem;
}

.get-browser {
    font-weight: normal;
    text-decoration: none;
}

.site-section {
    padding: 2.5em 0;
    margin-top: 1.5rem;
}

    .site-section.site-section-sm {
        padding: 4em 0;
    }

@media (min-width: 768px) {
    .site-section {
        padding: 5em 0;
    }
}

.cursor-pointer {
    cursor: pointer
}

.header-top .js-sticky-header .logo {
    height: 70px;
    margin-top: 3px;
}

.header-top .d-block .logo {
    width: 130px;
}

.footer .logo {
    max-height: 100px;
}

.Basket {
    color: var(--green1);
}

.how-works {
    margin-top: 2.5rem;
}

.icon-menu {
    font-size: 200%;
    color: black;
}

.icon-share-alt {
    font-size: 170%;
    color: var(--green1);
    padding-right: .5rem;
}

.icon-sign-in,
.icon-sign-out,
.icon-google {
    font-size: 150%;
}

.icon-sign-in {
    color: var(--orange1) !important;
}

a.icon-sign-in {
    color: var(--blue1) !important;
}

.icon-sign-out {
    color: var(--green1) !important;
}

.icon-sign-out {
}

.icon-facebook-square,
.icon-facebook,
.icon-instagram {
    font-size: 130%;
    color: var(--white1) !important;
}

.icon-facebook {
    font-size: 140%;
    color: var(--white1) !important;
}

.footer .icon-facebook-square,
.footer .icon-instagram {
    font-size: 120%;
    color: var(--green1) !important;
}

.header-top .facebook,
.header-top .instagram {
}

.icon-info_outline {
    font-size: 135%;
}

.btn {
    text-transform: uppercase;
    font-size: 25px;
    letter-spacing: .1rem;
    font-family: var(--font1);
}

#accordion .btn p {
    font-size: 18px;
}

.btn-primary {
    color: var(--white1);
}

.btn-success {
    color: var(--white1);
    background-color: var(--green1);
    border-color: var(--green1);
}

.btn-google {
    color: var(--white1);
    background-color: var(--red1);
    border-color: var(--red1);
}

    .btn-google:hover {
        color: var(--white1);
    }

.btn-facebook {
    color: var(--white1);
    background-color: var(--blue1);
    border-color: var(--blue1);
}

    .btn-facebook:hover {
        color: var(--white1);
    }

.border-primary {
    border-color: var(--gray1) !important;
}

.page-link {
    color: var(--green1);
    font-weight: bold;
}

.page-item.active .page-link {
    background-color: var(--green1);
    border-color: var(--green1);
}

.full-time {
    white-space: nowrap;
}

.messageIsPiNetworkBrowser a {
    font-weight: normal;
}

.messageIsPiNetworkBrowser {
    margin-top: 7rem;
    margin-bottom: 1.5rem;
}

.notlanding .messageIsPiNetworkBrowser {
    margin-top: 1rem;
}

.order-total {
    color: var(--white1);
    font-size: 1.5rem;
    transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
    text-align: center;
}

    .order-total .total-price {
        font-weight: 700;
        font-size: 1.5rem;
        padding: .5rem;
    }

    .order-total .btn {
        margin-left: auto;
    }

.order-type-payed {
    color: var(--green1);
}

.order-type-free {
    color: var(--blue2);
}

.card {
    padding: 1rem;
}

.card-item {
    border-radius: 6px;
    font-weight: 100;
    margin-top: 1rem;
    position: relative;
    background: var(--white1);
    -webkit-box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.2);
}

    .card-item div.p-4 {
        background-color: var(--green1);
    }

    .card-item .title {
        font-weight: 700;
    }

    .card-item ul {
        padding: 0;
        margin: 0.4rem 0.6rem;
    }

    .card-item li {
        list-style-type: none;
        margin-left: 0rem;
        font-size: 0.8rem;
    }

    .card-item h3,
    .card-item span {
        font-weight: bold;
        font-size: .85rem;
        color: var(--white1);
    }

        .card-item h3.challenge-name {
            font-size: 1.5rem;
        }

        .card-item h3 a {
            color: var(--white1);
        }

    .card-item span {
        font-size: 1.1rem;
        color: var(--gray1);
    }

        .card-item span.price {
            color: var(--white);
        }

    .card-item .price > span {
        border-radius: 4px;
        padding: 5px 10px;
        color: var(--white1);
    }

.card-total {
    background-color: var(--green1);
    margin-top: 3rem;
}

    .card-total > div {
        padding: 1.5rem;
    }

.card-header {
    padding: 1rem .5rem 0rem .5rem;
}

    .card-header button {
        text-align: left;
    }

.empty-cart {
    text-align: center;
}

.max-reached {
    color: white;
}

.item-price {
    font-weight: 100;
}

.configureOrderPiNetwork .price {
    padding: 1rem;
}

.price {
    font-size: 120%;
    font-weight: bold;
}

.report-list {
    font-size: 60%;
}

    .report-list table,
    .report-list th,
    .report-list td {
        border: 1px solid var(--black1);
        border-collapse: collapse;
        padding: 5px;
    }

.delete-item {
    position: absolute;
    top: 0;
    right: 0;
    content: 'X';
    cursor: pointer;
    font-size: 1.5rem;
    font-weight: bold;
    padding-right: 1.3rem;
    color: var(--black1);
}

.approved {
    color: var(--green1);
    text-transform: lowercase;
}

.waiting {
    color: var(--orange1);
    font-weight: bold;
}

.track-order {
    box-shadow: 0 2px 4px rgba(0,0,0,0.4);
}

.track-order-title {
    background-color: var(--white2);
    padding: 1rem 0rem 1rem 1rem;
}

    .track-order-title h2 {
        font-family: var(--font1);
        color: var(--blue2);
        font-size: 1.3rem;
        font-weight: 300;
        text-transform: uppercase;
    }

.track-order-button {
    position: absolute;
    bottom: 0;
}

.track-order-details {
    padding: 1rem 0rem 1rem 1rem;
}

.track-orders {
    position: relative;
    box-shadow: 0 2px 4px rgba(0,0,0,0.4);
    margin-bottom: 2rem;
}

    .track-orders .col-4 {
        font-weight: bold;
    }

.track-orders-title {
    background-color: var(--white2);
    padding: 1rem 0rem 1rem 0rem;
}

.track-orders-empty {
    height: 5rem;
}

.orders-counter {
    font-weight: normal;
    font-size: 70%;
}

#CookieDeclarationIdentificator {
    font-size: 70%;
}

input[type=range] {
    -webkit-appearance: none;
    margin: 7.1px 0;
    height: 21px;
    border: 0;
}

    input[type=range]:focus {
        outline: none;
    }

    input[type=range]::-webkit-slider-runnable-track {
        width: 100%;
        height: 5.8px;
        cursor: pointer;
        box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
        background: #dcdcdc;
        border-radius: 1.3px;
        border: 0px solid #010101;
    }

    input[type=range]::-webkit-slider-thumb {
        box-shadow: 0.9px 0.9px 1px rgba(0, 0, 49, 0.43), 0px 0px 0.9px rgba(0, 0, 75, 0.43);
        border: 0px solid #00001e;
        height: 20px;
        width: 20px;
        border-radius: 10px;
        background: var(--green1);
        cursor: pointer;
        -webkit-appearance: none;
        margin-top: -7.1px;
    }

    input[type=range]:focus::-webkit-slider-runnable-track {
        background: #e1e1e1;
    }

    input[type=range]::-moz-range-track {
        width: 100%;
        height: 5.8px;
        cursor: pointer;
        box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
        background: #dcdcdc;
        border-radius: 1.3px;
        border: 0px solid #010101;
    }

    input[type=range]::-moz-range-thumb {
        box-shadow: 0.9px 0.9px 1px rgba(0, 0, 49, 0.43), 0px 0px 0.9px rgba(0, 0, 75, 0.43);
        border: 0px solid #00001e;
        height: 20px;
        width: 20px;
        border-radius: 10px;
        background: var(--blue2);
        cursor: pointer;
    }

    input[type=range]::-ms-track {
        width: 100%;
        height: 5.8px;
        cursor: pointer;
        background: transparent;
        border-color: transparent;
        color: transparent;
    }

    input[type=range]::-ms-fill-lower {
        background: #d7d7d7;
        border: 0px solid #010101;
        border-radius: 2.6px;
        box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
    }

    input[type=range]::-ms-fill-upper {
        background: #dcdcdc;
        border: 0px solid #010101;
        border-radius: 2.6px;
        box-shadow: 0px 0px 1px #000000, 0px 0px 0px #0d0d0d;
    }

    input[type=range]::-ms-thumb {
        box-shadow: 0.9px 0.9px 1px rgba(0, 0, 49, 0.43), 0px 0px 0.9px rgba(0, 0, 75, 0.43);
        border: 0px solid #00001e;
        height: 20px;
        width: 20px;
        border-radius: 10px;
        background: var(--blue2);
        cursor: pointer;
        margin-top: 0;
    }

.form-field {
    display: flex;
    margin: 0.5rem;
}

    .form-field > label {
        width: 8rem;
    }

    .form-field > div {
        flex-grow: 1;
    }

    .form-field input {
        width: 100%;
    }

.validation-message {
    color: var(--red1);
    font-size: 85%;
}

.validation-message-success {
    color: var(--green1);
}

.text-serif {
    font-family: var(--font2);
}

.text-black {
    color: #000 !important;
}

.bg-black {
    background: #000 !important;
}

.site-wrap:before {
    display: none;
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
    background: rgba(0, 0, 0, 0.6);
    content: "";
    position: absolute;
    z-index: 2000;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
}

.bg-image {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

    .bg-image.overlay {
        position: relative;
    }

        .bg-image.overlay:after {
            position: absolute;
            content: "";
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 0;
            width: 100%;
            background: rgba(19, 174, 144, 0.8);
        }

    .bg-image > .container {
        position: relative;
        z-index: 1;
    }

.site-navbar {
    z-index: 1999;
}

    .site-navbar .site-navigation .site-menu > li > a {
        font-family: var(--font3);
        font-size: 18px;
        text-transform: uppercase;
        letter-spacing: .05rem;
        font-weight: 900;
        padding: 20px 20px;
        color: var(--green1);
        display: inline-block;
        text-decoration: none !important;
    }

        .site-navbar .site-navigation .site-menu > li > a:hover {
            font-family: var(--font3);
            font-size: 18px;
            color: var(--white1);
            background: var(--green1);
        }

.site-mobile-menu {
    width: 210px;
    position: fixed;
    right: 0;
    z-index: 2000;
    padding-top: 1px;
    background: var(--white1);
    height: calc(100vh);
    -webkit-transform: translateX(110%);
    -ms-transform: translateX(110%);
    transform: translateX(110%);
    -webkit-box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
    box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
}

.offcanvas-menu .site-mobile-menu {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.site-mobile-menu .site-mobile-menu-header {
    width: 100%;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
}

    .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close {
        float: right;
        margin-top: 8px;
    }

        .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close span {
            font-size: 30px;
            display: inline-block;
            padding-left: 10px;
            padding-right: 0px;
            line-height: 1;
            cursor: pointer;
            -webkit-transition: .3s all ease;
            -o-transition: .3s all ease;
            transition: .3s all ease;
        }

            .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close span:hover {
                color: #25262a;
            }

    .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo {
        float: left;
        margin-top: 10px;
        margin-left: 0px;
    }

        .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a {
            display: inline-block;
            text-transform: uppercase;
        }

            .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a img {
                max-width: 70px;
            }

            .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a:hover {
                text-decoration: none;
            }

.site-mobile-menu .site-mobile-menu-body {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    position: relative;
    padding: 0 10px 10px 0px;
    height: calc(100vh - 52px);
    padding-bottom: 150px;
}

    .site-mobile-menu .site-mobile-menu-body .active {
        color: var(--green1) !important;
    }

.site-mobile-menu .site-nav-wrap {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}

    .site-mobile-menu .site-nav-wrap a {
        /*padding: 10px 20px;*/
        display: block;
        position: relative;
        color: var(--black1);
    }

        .site-mobile-menu .site-nav-wrap a:hover {
            color: var(--green1);
        }

    .site-mobile-menu .site-nav-wrap li {
        position: relative;
        display: block;
    }

        .site-mobile-menu .site-nav-wrap li.active > a {
            color: var(--gray1);
        }

    .site-mobile-menu .site-nav-wrap > li {
        display: block;
        position: relative;
        float: left;
        width: 100%;
    }

        .site-mobile-menu .site-nav-wrap > li > a {
            padding-left: 20px;
            font-size: 20px;
        }

.sticky-wrapper {
    position: absolute;
    z-index: 100;
    width: 100%;
    background: var(--white1);
}

@media (max-width: 991.98px) {
    .sticky-wrapper {
        display: none;
    }
}

.sticky-wrapper .site-navbar {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    background: #F8F9FA;
    border-top: 3px solid var(--green1);
}

    .sticky-wrapper .site-navbar .site-logo a {
        color: var(--black1);
    }

    .sticky-wrapper .site-navbar .site-menu > li {
        display: inline-block;
    }

        .sticky-wrapper .site-navbar .site-menu > li > a.active {
            color: var(--white1);
            background: var(--green1);
            position: relative;
        }

        .sticky-wrapper .site-navbar .site-menu > li.active > a {
            color: var(--white1);
            position: relative;
        }

            .sticky-wrapper .site-navbar .site-menu > li.active > a:before {
                content: "";
                position: absolute;
                bottom: 0;
                height: 2px;
                background: var(--white1);
            }

.sticky-wrapper.is-sticky .site-navbar {
    -webkit-box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2);
}

    .sticky-wrapper.is-sticky .site-navbar .site-logo a {
        color: var(--black1);
    }

    .sticky-wrapper.is-sticky .site-navbar .site-menu > li {
        display: inline-block;
    }

        .sticky-wrapper.is-sticky .site-navbar .site-menu > li > a {
            padding: 5px;
            margin-left: 15px;
            margin-right: 15px;
            display: inline-block;
            text-decoration: none !important;
        }

            .sticky-wrapper.is-sticky .site-navbar .site-menu > li > a:hover {
                color: var(--white1);
            }

            .sticky-wrapper.is-sticky .site-navbar .site-menu > li > a.active:after {
                background: var(--white1);
            }

        .sticky-wrapper.is-sticky .site-navbar .site-menu > li.active > a {
            color: var(--white1);
        }

.sticky-wrapper .shrink {
    padding-top: 8px !important;
    padding-bottom: 0px !important;
}
/* Blocks */
.intro-section {
    background-size: cover;
    position: relative;
}

    .intro-section, .intro-section .container .row {
        /*height: 100vh;*/
        height: 70vh;
        min-height: 350px;
    }

        .intro-section.innerpage, .intro-section.innerpage .container .row {
            height: 75vh;
            min-height: 500px;
        }

        .intro-section:before {
            content: "";
            position: absolute;
            height: 100%;
            width: 100%;
            background: #222;
            opacity: .3;
            border-bottom-right-radius: 0px;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }

@media (max-width: 991.98px) {
    .intro-section:before {
        width: 100%;
    }
}

.intro-section p {
    color: var(--black1);
    font-size: 1.1rem;
}

    .intro-section h1 > span:first-child,
    .intro-section p > span {
        font-family: var(--font5);
        background-color: var(--white1);
        padding: 6px 6px 6px 0px;
    }

    .intro-section p a {
        color: var(--black1);
        text-decoration: underline;
    }

.intro-section .btn {
    text-decoration: none;
}

.hero-slide {
    position: relative;
}

    .hero-slide h1 {
        font-family: var(--font5);
        font-size: 3rem;
        margin: 12rem 0rem 1rem 0rem;
        color: var(--black1);
    }

    .hero-slide .owl-nav {
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease;
        opacity: 0;
        visibility: hidden;
    }

@media (max-width: 991.98px) {
    .hero-slide .owl-nav {
        display: none;
    }
}

.hero-slide .owl-nav .owl-prev,
.hero-slide .owl-nav .owl-next {
    position: absolute;
    top: 50%;
    text-align: center;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: var(--white1);
}

    .hero-slide .owl-nav .owl-prev > span,
    .hero-slide .owl-nav .owl-next > span {
        font-size: 1.7rem;
        position: absolute;
        top: 50%;
        left: 50%;
        color: var(--black1);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .hero-slide .owl-nav .owl-prev:hover,
    .hero-slide .owl-nav .owl-next:hover {
        background: var(--blue2);
    }

        .hero-slide .owl-nav .owl-prev:hover > span,
        .hero-slide .owl-nav .owl-next:hover > span {
            color: var(--white1);
        }

.hero-slide .owl-nav .owl-prev {
    left: 10px;
}

.hero-slide .owl-nav .owl-next {
    right: 10px;
}

.hero-slide .owl-dots {
    position: absolute;
    bottom: 30px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    text-align: center;
}

    .hero-slide .owl-dots .owl-dot {
        display: inline-block;
    }

        .hero-slide .owl-dots .owl-dot > span {
            border-radius: 0%;
            display: inline-block;
            width: 18px;
            height: 4px;
            margin: 5px 5px -20px 5px;
            background: var(--white1);
        }

        .hero-slide .owl-dots .owl-dot.active > span {
            background: var(--blue2);
        }

.hero-slide:hover .owl-nav {
    opacity: 1;
    visibility: visible;
}

.footer {
    padding: 4rem 0;
    background: #000;
    font-size: 15px;
    color: var(--gray1);
}

    .footer .footer-heading {
        font-size: 16px;
        color: #000;
        margin-bottom: 30px;
        text-transform: uppercase;
    }

        .footer .footer-heading > span {
            border-bottom: 2px solid var(--green1);
        }

    .footer ul li {
        margin-bottom: 10px;
    }

    .footer a:hover {
        color: var(--blue2);
        text-decoration: underline;
    }

    .footer .copyright {
        padding-top: 7rem;
        text-align: center;
    }

.header-top > .container {
    padding-top: 5px;
    padding-bottom: 5px;
}

.header-top .signin,
.header-top .signout {
    font-family: var(--font4);
    font-size: 1em;
}

.header-top .language {
    padding-right: 1rem;
}

.header-top .useremail {
    color: var(--green1);
    font-size: .90rem;
    margin-top: .25rem;
    padding-right: 1rem;
}

.header-top .signin img,
.header-top .signout img,
.header-top .language img,
.header-top .facebook img,
.header-top .instagram img,
.header-top .basket img {
    width: 30px;
}

.header-top .language,
.header-top .facebook,
.header-top .instagram,
.header-top .singin {
    padding: 0rem .5rem 0rem .5rem;
}

.header-top .basket {
    padding-left: .45rem;
}

.header-top .language {
    cursor: pointer;
}

.header-top .Basket {
    padding: 0rem 0rem 0rem 1rem;
}

.header-top .shoppingBasketCounter {
    padding: 0rem .5rem 0rem .5rem;
}

.form-control:hover, .form-control:focus, .form-control:active {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.heading-92913 {
    position: relative;
    padding-bottom: 30px;
    margin-bottom: 30px;
}

    .heading-92913:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 50px;
        height: 2px;
        background: var(--green1);
    }

    .heading-92913.text-center:after {
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }

.testimony-39291 blockquote {
    border: 1px solid var(--white2);
    padding: 30px;
    border-radius: 4px;
    font-size: 16px;
    position: relative;
}

    .testimony-39291 blockquote:after {
        position: absolute;
        content: "\e244";
        font-family: "icomoon";
        right: 10px;
        bottom: 10px;
        font-size: 30px;
        color: var(--green1);
    }

    .testimony-39291 blockquote p {
        font-style: italic;
    }

        .testimony-39291 blockquote p:last-child {
            margin-bottom: 0;
        }

.testimony-39291 .pic img {
    border-radius: 50%;
    width: 50px;
    height: 50px;
}

.testimony-39291 .text {
    line-height: 1;
}

    .testimony-39291 .text strong {
        font-size: 15px;
        color: #000;
        margin-bottom: 4px;
    }

    .testimony-39291 .text span {
        font-size: 14px;
        color: var(--white2);
    }

@media only screen and (max-width: 40em) {
    .site-section.notlanding {
        padding: 0
    }

    .list-container {
        width: 92%;
    }

    .col-4, .col-8 {
        padding-right: 5px;
        padding-left: 5px;
    }

    .custom-select {
        margin-bottom: 1rem;
    }

    .intro-section, .intro-section .container .row {
        height: 65vh;
        min-height: 350px;
    }

        .intro-section h1 {
            font-size: 2.5rem;
            line-height: 140%;
        }

    .messageIsPiNetworkBrowser {
        margin-top: 7rem;
        margin-bottom: 1.5rem;
    }
}

@media only screen and (max-width: 30em) {
    .messageIsPiNetworkBrowser {
        margin-top: 1.5rem;
        margin-bottom: 1.5rem;
    }
}

#blazor-error-ui {
    background: var(--green1);
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.dialog-container {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2000;
    display: flex;
    animation: dialog-container-entry 0.2s;
}

@keyframes dialog-container-entry {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.dialog {
    align-self: center;
    margin: auto;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.components-reconnect-hide > div {
    display: none;
}

.components-reconnect-show > div,
.components-reconnect-failed > div,
.components-reconnect-rejected > div {
    display: flex;
}