@charset "UTF-8";

body.wrapper-fluid .site-grid {
    grid-gap: 0 2em;
    grid-template-columns: [full-start] minmax(0,1fr) [main-start] minmax(0,15%) repeat(2,minmax(0,35%)) minmax(0,15%) [main-end] minmax(0,1fr) [full-end];
}

.site-grid {
    grid-gap: 0 1em;
    grid-template-columns: [full-start] minmax(0, 1fr)[main-start] repeat(4, minmax(0, 22.875rem))[main-end] minmax(0, 1fr)[full-end];
}

.grid-child {
    width: 100%;
    max-width: 1512px;
    display: flex;
}

/*!
 * Parts of Bootstrap  v5.3.8 (https://getbootstrap.com/)
 * which may be overridden in this template
 * Copyright 2011-2025 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 *
 * Presumably without the need for adjustment
 */
:root, [data-bs-theme="light"] {
    --primary                   : #010156;
    --secondary                 : #6d757e;
    --success                   : #448344;
    --info                      : #30638d;
    --warning                   : #ad6200;
    --danger                    : #a51f18;
    --light                     : #f9fafb;
    --dark                      : #353b41;
    --primary-rgb               : 1, 1, 86;
    --secondary-rgb             : 109, 117, 126;
    --success-rgb               : 68, 131, 68;
    --info-rgb                  : 48, 99, 141;
    --warning-rgb               : 173, 98, 0;
    --danger-rgb                : 165, 31, 24;
    --light-rgb                 : 249, 250, 251;
    --dark-rgb                  : 53, 59, 65;
    --primary-text-emphasis     : #002;
    --secondary-text-emphasis   : #2c2f32;
    --success-text-emphasis     : #1b351b;
    --info-text-emphasis        : #132838;
    --warning-text-emphasis     : #452700;
    --danger-text-emphasis      : #420c09;
    --light-text-emphasis       : #484f56;
    --dark-text-emphasis        : #484f56;
    --primary-bg-subtle         : #ccd;
    --secondary-bg-subtle       : #e2e3e5;
    --success-bg-subtle         : #dae6da;
    --info-bg-subtle            : #d6e0e8;
    --warning-bg-subtle         : #efe0cc;
    --danger-bg-subtle          : #edd2d1;
    --light-bg-subtle           : #fcfcfd;
    --dark-bg-subtle            : #ced4da;
    --primary-border-subtle     : #99b;
    --secondary-border-subtle   : #c5c8cb;
    --success-border-subtle     : #b4ceb4;
    --info-border-subtle        : #acc1d1;
    --warning-border-subtle     : #dec099;
    --danger-border-subtle      : #dba5a2;
    --light-border-subtle       : #eaedf0;
    --dark-border-subtle        : #adb5bd;
    --white-rgb                 : 255, 255, 255;
    --black-rgb                 : 0, 0, 0;
    --gradient                  : linear-gradient(180deg, #ffffff26, #fff0);
    --body-line-height          : 1.5;
    --code-color                : #e93f8e;
    --highlight-color           : #22262a;
    --highlight-bg              : #fbeea8;
    --border-width              : 1px;
    --border-style              : solid;
    --border-radius             : .25rem;
    --border-radius-sm          : .2rem;
    --border-radius-lg          : .3rem;
    --border-radius-xl          : .3rem;
    --border-radius-xxl         : 2rem;
    --border-radius-2xl         : var(--border-radius-xxl);
    --border-radius-pill        : 50rem;
    --box-shadow                : 0 .5rem 1rem #00000026;
    --box-shadow-sm             : 0 .125rem .25rem #00000013;
    --box-shadow-lg             : 0 1rem 3rem #0000002d;
    --box-shadow-inset          : inset 0 1px 2px #00000013;
    --focus-ring-width          : .25rem;
    --focus-ring-opacity        : .25;
    --focus-ring-color          : #01015640;
    --form-valid-color          : #448344;
    --form-valid-border-color   : #448344;
    --form-invalid-color        : #a51f18;
    --form-invalid-border-color : #a51f18;
}

/*!
 * Base color definitions for this client
 */
:root {
    --primary-bg               : rgb(89 157 202);
    --primary-bg-hover         : rgb(89 157 202);
    --primary-color            : rgb(223 223 223);
    --primary-color-hover      : rgb(42 123 177);
    --secondary-bg             : rgb(58 133 182);
    --secondary-bg-hover       : rgb(58 133 182);
    --secondary-color          : rgb(254 254 254);
    --secondary-color-hover    : rgb(254 254 254);
    --third-bg                 : rgb(89 157 202 / 0.23);
    --third-bg-hover           : rgb(89 157 202 / 0.44);
    --third-color              : rgb(254 254 254);
    --third-color-hover        : rgb(254 254 254);
    --border-color-translucent : rgb(0 0 0 / 0.18);
}

/*!
 * These settings may be overridden by template settings at back end
 */
:root {
    --body-color       : rgb(23 23 23);
    --body-bg          : rgb(233 237 240);
    --btnbg            : var(--primary-bg);
    --btnbgh           : var(--primary-color-hover);
    --btncolor         : var(--primary-color);
    --btncolorh        : var(--primary-color);
    --footercolor      : var(--body-color);
    --footerbg         : var(--body-bg);
    --headercolor      : var(--body-color);
    --headerbg         : var(--body-bg);
    --link-color       : var(--secondary-bg);
    --link-hover-color : rgb(52 119 163);
    --body-font-size   : 1.1rem;
    --h1size           : 2.3rem;
    --h2size           : 1.7rem;
    --h3size           : 1.5rem;
}

/* Other bs stuff, has to be sorted out where to reside */
:root {
    --body-bg-rgb           : 233, 237, 240;
    --emphasis-color        : #000;
    --emphasis-color-rgb    : 0, 0, 0;
    --secondary-color       : #22262abf;
    --secondary-color-rgb   : 34, 38, 42;
    --secondary-bg          : #eaedf0;
    --secondary-bg-rgb      : 234, 237, 240;
    --tertiary-color        : #22262a80;
    --tertiary-color-rgb    : 34, 38, 42;
    --tertiary-bg           : #f9fafb;
    --tertiary-bg-rgb       : 249, 250, 251;
    --heading-color         : inherit;
    --link-color-rgb        : 34, 79, 170;
    --link-decoration       : underline;
    --link-hover-color-rgb  : 66, 64, 119;
}

:root {
    --body-color-second  : var(--body-bg);
    --btnbg-second       : var(--btnbg);
    --btnbgh-second      : var(--primary-color-hover);
    --btncolor-second    : var(--primary-color);
    --btncolorh-second   : var(--primary-color);
    --bordercolor        : var(--primary-bg);
    --card-color         : var(--body-color);
    --card-cap-color     : var(--body-color-second);
    --card-cap-bg        : var(--primary-bg);
    --card-border-color  : var(--primary-bg);
    --form-select-bg-img : url(../../cassiopeia/images/select-bg.svg?v=5ebba0) !important;
}

:root {
    --card-cap-padding-x : 0.8rem;
    --card-cap-padding-y : 0.8rem;
    --card-border-width  : 1px;
    --card-spacer-x      : 0.5rem;
    --card-spacer-y      : 0.5rem;
    --border-radius-top  : 0.5rem 0.5rem 0 0;
}

h1, .h1, h2, .h2, h3, .h3, h4 {
    color            : var(--body-color-second);
    margin           : 0.6rem 0 0.3rem 0;
    padding          : 0.6rem 0;
    text-align       : center;
    background-color : var(--primary-bg);
    border-radius    : var(--border-radius-top);
}

h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a {
    color           : var(--body-color-second);
    text-decoration : none;
}

h1 a:not([class]), .h1 a:not([class]), h2 a:not([class]), .h2 a:not([class]), h3 a:not([class]), .h3 a:not([class]), h4 a:not([class]) {
    text-decoration : none;
}

dt {
    display : none;
}

dd {
    display       : inline-block;
    font-size     : 0.8rem;
    margin-bottom : 0;
}

dd:last-child {
    margin-bottom : 0.5rem;
}

.table {
    margin-top    : 0.8rem;
    --table-color : var(--body-color);
}

thead {
    background-color : var(--primary-bg);
}

thead a {
    color : var(--body-color-second);
}

.table thead th {
    color               : var(--body-color-second);
    background-color    : var(--primary-bg);
    border-bottom-width : var(--border-width);
    box-shadow          : inset 0 0 0 9999px var(--table-bg-state, var(--table-bg-type, var(--table-accent-bg)));
    padding             : .5rem;
}

.table > :not(caption) > * > * {
    color : var(--table-color);
}

p.readmore {
    margin-top : 0.5rem;
}

.navbar-nav {
    --navbar-color          : var(--body-color);
    --navbar-hover-color    : var(--primary-color);
    --navbar-disabled-color : var();

}

.navbar-brand {
    width      : 100%;
    text-align : center;
}

.navbar-brand a {
    display    : block;
    width      : 100%;
    text-align : center;
}

.navbar-nav .nav-link,
.navbar-nav .nav-link.active,
.navbar-nav .nav-link.show {
    color : var(--body-color);
}

.btn-outline-primary {
    --btn-color        : var(--btncolor-second);
    --btn-bg           : var(--btnbg-second);
    --btn-border-color : var(--btncolor-second);
}

.btn-secondary {
    --btn-color        : var(--btncolor-second);
    --btn-bg           : var(--btnbg-second);
    --btn-border-color : var(--bordercolor);
    --btn-hover-color  : var(--btncolorh-second);
    --btn-hover-bg     : var(--btnbgh-second);
}

.btn-outline-secondary {
    --btn-bg: var(--third-bg);
}
.btn-light {
    --btn-color        : #000;
    --btn-bg           : var(--body-color-second);
    --btn-border-color : var(--body-color-second);
}

.container-component nav.navbar-expand-lg {
    padding       : 0.6rem;
    border-radius : 0.5rem 0.5rem 0 0 !important;
}

main {
    padding          : 0 1.0rem 0.3rem 1.0rem;
    margin-top       : 0.6rem;
    border           : var(--border-width) solid var(--bordercolor);
    border-bottom    : 0.6rem solid var(--bordercolor);
    border-radius    : 0.5rem;
    background-color : var(--body-color-second);
}

.card {
    --card-border-color  : var(--primary-bg);
    --card-border-radius : 0.5rem;;
    --card-cap-bg        : rgba(var(--body-color-rgb), .03);
    --card-bg            : var(--body-color-second);
    padding-bottom       : 0.6rem;
    border-bottom        : 0.6rem solid var(--card-border-color);
}

.card-header {
    color            : var(--body-color-second);
    margin           : 0 0 1.0rem 0;
    text-align       : center;
    background-color : var(--primary-bg);
    border-radius    : var(--border-radius-top);
}

.footer a:not(.btn),
.footer .btn-link {
    color : var(--link-color);
}

.footer a:not(.btn):hover,
.footer a:not(.btn):focus,
.footer .btn-link:hover,
.footer .btn-link:focus {
    color : var(--link-color);
}

.bg-light {
    color            : var(--body-color);
    background-color : var(--third-bg)!important;
}

.bg-light-bw {
    color            : var(--body-color);
    background-color : var(--third-bg);
}

.back-to-top-link {
    color            : var(--btncolor-second);
    background-color : var(--btnbg-second);
    border           : 2px solid var(--bordercolor);
}

.back-to-top-link:hover,
.back-to-top-link:focus {
    color            : var(--btncolorh-second);
    background-color : var(--btnbgh-second);
    border-color     : var(--bordercolor);
}

.page-header h1 {
    margin  : 0 -1.0rem 0.6rem -1.0rem;
    padding : 0.6rem;
}


label.finder {
    display : none;
}

.container-header .grid-child:first-child {
    padding       : 0 .5em;
    margin-bottom : -1.5rem;
}

.container-header .container-nav {
    border-bottom : 0.3rem solid var(--btnbg);
    padding       : 0 0.5rem;
    margin-bottom : 1rem;
}

.container-header .mod-menu > li {
    background    : var(--btnbg);
    color         : var(--btncolor-second);
    font-weight   : bold;
    padding       : 0.6rem 0.5rem;
    border-radius : 0.3rem 0.3rem 0 0;
    transition    : all .2s, background-color .2s;
    display       : block;
}

.container-header .mod-menu > li + li {
    margin-left : 0.5rem;
}

.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span {
    color : var(--body-color-second);
}

.container-header .mod-menu a {
    color : var(--link-color);
}

.container-header .container-search {
    margin-top : -0.5em;
}

#searchHeader button,
#search h2 button {
    color            : var(--body-color-second);
    margin           : 0 0 1.0rem 0;
    padding          : 0.8rem;
    text-align       : center;
    background-color : var(--primary-bg);
    border-radius    : var(--border-radius-top);
    border-bottom    : 0;
}

.float-start h1 {
    padding-left  : 0.5rem;
    padding-right : 0.5rem;
}

.form-check-input {
    --form-check-bg       : var(--third-bg);
    background-color      : var(--form-check-bg);
    background-image      : var(--form-check-bg-image);
    border                : var(--border-width) solid var(--bordercolor);
    background-position   : 50%;
}

.form-check-input:checked {
    background-color: var(--primary-bg);
    border-color: var(--primary-bg);
}

.form-check-input:checked[type="checkbox"] {
    --form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='hsl%280, 0%, 100%%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.form-select[multiple] option:checked,
[multiple].custom-select option:checked {
    color            : var(--body-bg);
    background-color : var(--primary-bg) !important;
}

/*
 * Module OsDonate
*/
#osdonatestatic ul li,
#osdonatestatic p {
    text-align : left;
}

.osdonate-wrapper {
    text-align : center;
}

/*
 * Module top A
*/
.top-a {
    border  : 0;
    padding : 0;
    margin  : 0;
}

.top-a .card-body {
    padding : 0;
}

/*
 * Module breadcrumb
*/
.mod-breadcrumbs {
    border-radius : 0.5rem;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
    background-color: var(--light);
}

/*
 * Contact form
*/
.control-group:has(label#jform_contact_email_copy-lbl),
.control-label:has(label#jform_contact_email_copy-lbl) {
    display : inline;
}

.form-check.form-check-inline {
    display: inline!important;
}

.controls:has(input#jform_contact_email_copy) {
    display : inline;
}

#jform_contact_email_copy {
    --form-check-bg : #ffffff;
    width           : 1.5em;
    height          : 1.5em;
    margin  : 0 0.5rem 0 0.5rem;
}

/*
 * Kunena
*/
main:has(#kunena) {
    padding: 0 0 0.3rem 0;
}

.form-select[style],
.custom-select[style],
#kunena.layout select.form-select,
#kunena.layout select.custom-select {
    --form-select-bg-img : url(../../cassiopeia/images/select-bg.svg?v=5ebba0) !important;
    width                : 100%;
    color                : var(--body-color);
    appearance           : none;
    background-color     : var(--third-bg)!important;
    background-image     : var(--form-select-bg-img), var(--form-select-bg-icon, none)!important;
    border               : var(--border-width) solid var(--bordercolor);
    border-radius        : var(--border-radius);
    background-position  : right 0 center!important;
    background-repeat    : no-repeat!important;
    background-size      : 80rem!important;
    padding              : .3rem 3rem .3rem 0.5rem;
    font-size            : 1rem;
    font-weight          : 400;
    line-height          : 1.5;
    transition           : border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    display              : block;
}

#kunena.layout select#categorylist {
    color                : var(--body-color);
    background-color     : transparent!important;
    background-image     : none!important;
    border               : var(--border-width) solid var(--bordercolor);
    border-radius        : var(--border-radius);
    background-position  : right 0 center!important;
    background-repeat    : no-repeat!important;
    background-size      : 300rem!important;
    padding              : 0.5rem;
    margin-bottom        : 0.5rem;
}

input[type=checkbox] {
    width  : 1.5em;
    height : 1.5em;
    margin : 0 0.5rem 0 0.5rem;
}


/*
 * Virtuemart
*/
.quantity-controls {
    background-color : var(--third-bg);
    /*background-image: var(--form-select-bg-img), var(--form-select-bg-icon,none);*/
    border           : var(--border-width) solid var(--third-bg);
    border-radius    : var(--border-radius);
}

.vm-addtocart-button-wrapper {
    padding-left : 3.0rem;
    width        : 20.0rem;
}

.addtocart-button {
    color            : var(--body-color);
    background-color : var(--third-bg);
}

.vm-product-title a {
    color : var(--body-color-second) !important;
}

h1.vm-page-title,
h1.vm-category-title,
h1.vm-payment-header-select {
    margin : 0 -1.0rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

h1.vm-payment-header-select {
    margin-bottom : 1.0rem;
}

h2.vm-product-title {
    margin : 0 -1.5rem 1rem -1.5rem!important;
}

#tabs {
    border-bottom: var(--border-width) solid var(--bordercolor)!important;
}

#tabs > li {
    background-color: var(--primary-bg)!important;
    color: var(--primary-color)!important;
        border-radius: var(--border-radius-top);
}

#tabs > li.current {
    background-color: var(--primary-bg-hover)!important;
}