body {
    background-color: #336699;
    color: #ffffff;
    font-family: 'Lato', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Lato', sans-serif;
}

.pinnumber {
    font-size: 2.5rem;
    height: auto;
    text-align: center;
    letter-spacing: 1rem;
}

    .pinnumber::-webkit-inner-spin-button,
    .pinnumber::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

.scaninput {
    background-color: transparent;
    border: none;
    color: #336699;
    box-shadow: none;
}

    .scaninput:active {
        background-color: transparent;
        border: none;
        color: #336699;
        box-shadow: none;
    }

    .scaninput:focus {
        background-color: transparent;
        border: none;
        color: #336699;
        box-shadow: none;
    }

.ticket {
    margin-bottom: 2rem;
    border-bottom: dashed 1px #000000;
}

    .ticket .ticketinfo {
        padding: 0 1rem;
    }

        .ticket .ticketinfo h1, .ticket .ticketinfo h2, .ticket .ticketinfo h3, .ticket .ticketinfo label {
            color: #ffffff;
        }

        .ticket .ticketinfo label {
            margin-top: 1.5rem;
            font-size: 1.2rem;
        }

    .ticket .qrcode {
        padding: 1rem;
    }

@media screen and (max-width: 39.99875em) {
    h2 {
        font-size: 3.5rem;
    }

    h3 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 0em), screen and (min-width: 40em) {
}