body {
    height: 100vh;
    display: flex !important;
    flex-direction: column !important;
}

.footer-padding {
    padding-top: 1.3rem;
    padding-bottom: 1.3rem;
}

.image.is-19x19 {
    height: 19px;
    width: 19px;
}

/* The section videos. width/height were set inline on all 14 elements, which
   overrode the 650px below and meant every page carried an inline style - the
   one thing keeping 'unsafe-inline' in the style-src CSP. Same rendering, now
   declared once. */
.img-main {
    padding-top: 15px;
    width: 100%;
    height: 100%;
    filter: drop-shadow(4px 4px 6px #000000);
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.reset-button-pos {
    float: right;
    margin-top: 12px;
    margin-right: 12px;
}

.function-card-inner {
    min-height: 90px;
}

.feature-img {
    height: 117px;
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.feature-img.medium {
    height: 200px;
}

.feature-img.large {
    height: 250px;
}

.functionImg {
    width: 350px;
}

.feature-height {
    height: 100%
}

.wrapper {
    background: lightblue;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.main {
    background: yellow;
    flex: 1;
}

.notification-container {
    position: absolute;
    bottom: 50px;
    right: 15px;
    width: 400px;
}

.text-wrap-off {
    text-wrap: nowrap;
}

.panel-block.no-flex {
    display: block;
}

.panel-min-height {
    min-height: 270px;
}

.box-width-small {
    width: 500px;
}

.box-shadow {
    --bulma-box-shadow: 0px;
}

.box-background-color {
    --bulma-box-background-color: #faf8fc;
}

.card-content.min-height {
    min-height: 850px;
    overflow: hidden;
}

.modal-card.narrow {
    width: 500px;
}

.navbar-background-color {

    --bulma-navbar-background-color: none;

}

.memu-background-color {
    --bulma-menu-item-background-l-delta: none;
}

.hr-height {
    height: 1px;
}

.card-override {
    --bulma-card-background-color: #faf8fc;
    box-shadow: 0px 2px 4px 0px #00000026;

}

.click-table tbody tr {
    cursor: pointer;
}


.card-color-2 {
    --bulma-card-background-color: rgb(39, 39, 41)
}

.price-button-cycle {
    width: 115px;
}

.price-button-qty {
    width: 80px;
}

.shop-button-sub {
    width: 120px;
}

.shop-input-agents {
    width: 65px;
}

.subscription-table {

    border-collapse: collapse;
    border-style: none;
    --bulma-table-cell-border-style: none;
    --bulma-table-background-color: none;
}

.subscription-table tr {
    display: flex;
    justify-content: center;
    align-items: center;
}

.subscription-table td,
th {
    flex: 1;
}

.subscription-table td:first-child,
th:first-child {
    flex-grow: 1.5;
}

.subscription-table tr {
    position: relative;
    z-index: 1;
}

.subscription-table tbody tr {
    background: white;
    box-shadow: var(--bulma-card-shadow);
    border-radius: var(--bulma-card-radius);
}

.subscription-media {
    align-items: center;
}


.card-download-width {
    width: 320px;

}

.menu-item-background-color {
    --bulma-menu-item-background-l-delta: ;
}
/* Email addresses vary wildly in length - keep the account button from
   pushing the rest of the navbar around. */
.nav-account-email {
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Cookie consent banner - pinned to the bottom so it never covers the nav,
   and above Bulma's modal layer so it stays reachable on the store pages. */
.cookie-consent {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 45;
    padding: 1rem 1.5rem;
    background-color: var(--bulma-scheme-main-ter);
    border-top: 1px solid var(--bulma-border);
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.25);
}

/* SHA256 digests are long and have no spaces - let them wrap inside the card
   rather than forcing the table wider than the card. */
.sha256-cell {
    word-break: break-all;
}

/* Bullet icons sit in a .media-left figure. An inline img rests on the text
   baseline, so the figure keeps a few pixels of descender space below it and
   the icon rides above the centre of its own box - visible once the icons are
   small enough not to fill the row. Blocking them out removes that gap so
   mt-auto/mb-auto centres the icon itself against the text. */
.media-left img {
    display: block;
}

/* Home function cards.

   Bulma stretches .column to the height of its row, but the .card inside is
   only as tall as its own copy - so cards in a row ended up different heights
   whenever one had more text, and the difference moved around as the window
   was resized and the text rewrapped. Making the card and its wrappers fill
   the column ties every card in a row to the tallest one, at any width. */
.function-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.function-card > .content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

.function-card .card-content {
    flex: 1 1 auto;
}

/* The "More" links inside the function cards were falling back to Bulma's
   default link colour, an indigo that sits awkwardly next to the icon blue.
   Use the icon blue instead so the card reads as one palette. */
.function-card-inner a {
    color: #4A90D9;
}

.function-card-inner a:hover {
    color: #6BA6E3;
    text-decoration: underline;
}

/* Card icons were vertically centred inside each card, so they sat at a
   different height in every card depending on how much copy it had. The
   headings are top-aligned, so align the icons the same way - they then line
   up across the row, and stay lined up as the text rewraps. */
.card-icon {
    align-self: flex-start;
    margin-top: 0.35rem;
}

/* Contact form honeypot. Kept off-screen rather than display:none - some bots
   skip fields that are explicitly hidden, but fill in anything they can see in
   the markup. Real visitors never reach it: it is out of the tab order and
   marked aria-hidden. */
.hp-field {
    position: absolute;
    left: -9999px;
    top: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
