:root {
  --kiddieland-cassiopeia-color-primary: #4b893f;
  --kiddieland-cassiopeia-color-link: #15496e;
  --kiddieland-cassiopeia-color-hover: #448344;
  --kiddieland-cassiopeia-header-background-image: url('../../../../../../media/templates/site/kiddieland-cassiopeia/images/header.png');
  --kiddieland-cassiopeia-header-background-position: bottom center;
  --kiddieland-cassiopeia-header-background-attachment: scroll;
  --kiddieland-cassiopeia-header-background-repeat: no-repeat;
  --kiddieland-cassiopeia-header-background-size: cover;
  --nav-text-color: black;
  --nav-bg-color: #4b893f;
  --mainmenu-nav-link-color: white;
  --accent-color-primary: #4b893f;
  --accent-color-secondary: #3f7235;
  --border: 5px;


  --blue: hsl(240, 98%, 17%);
  --indigo: hsl(263, 90%, 51%);
  --purple: hsl(261, 51%, 51%);
  --pink: hsl(332, 79%, 58%);
  --red: hsl(3, 75%, 37%);
  --orange: hsl(27, 98%, 54%);
  --yellow: hsl(34, 100%, 34%);
  --green: hsl(120, 32%, 39%);
  --teal: hsl(194, 66%, 61%);
  --cyan: hsl(207, 49%, 37%);
  --white: hsl(0, 0%, 100%);
  --gray-100: hsl(210, 17%, 98%);
  --gray-200: hsl(210, 16%, 93%);
  --gray-300: hsl(210, 14%, 89%);
  --gray-400: hsl(210, 14%, 83%);
  --gray-500: hsl(210, 11%, 71%);
  --gray-600: hsl(210, 7%, 46%);
  --gray-700: hsl(210, 9%, 31%);
  --gray-800: hsl(210, 10%, 23%);
  --gray-900: hsl(210, 11%, 15%);
  --primary: hsl(240, 98%, 17%);
  --secondary: hsl(210, 7%, 46%);
  --success: hsl(120, 32%, 39%);
  --info: hsl(207, 49%, 37%);
  --warning: hsl(34, 100%, 34%);
  --danger: hsl(3, 75%, 37%);
  --light: hsl(210, 17%, 98%);
  --dark: hsl(210, 10%, 23%);
  --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;
  --white-rgb: 255, 255, 255;
  --black-rgb: 0, 0, 0;
  --body-color-rgb: 34, 38, 42;
  --body-bg-rgb: 255, 255, 255;
  --font-sans-serif: -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";
  --font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --body-font-family: var(--kiddieland-cassiopeia-font-family-body, -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");
  --body-font-size: 1rem;
  --body-font-weight: 400;
  --body-line-height: 1.5;
  --body-color: hsl(210, 11%, 15%);
  --body-bg: hsl(0, 0%, 100%);
  --border-width: 1px;
  --border-style: solid;
  --border-color: hsl(210, 14%, 89%);
  --border-color-translucent: rgba(0, 0, 0, 0.175);
  --border-radius: 0.25rem;
  --border-radius-sm: 0.2rem;
  --border-radius-lg: 0.3rem;
  --border-radius-xl: 0.3rem;
  --border-radius-2xl: 0.3rem;
  --border-radius-pill: 50rem;
  --link-color: var(--kiddieland-cassiopeia-color-link);
  --link-hover-color: var(--kiddieland-cassiopeia-color-hover);
  --code-color: hsl(332, 79%, 58%);
  --highlight-bg: #fbeea8;
}

.btn-primary {
  --btn-color: hsl(0, 0%, 100%);
  --btn-bg: hsl(240, 98%, 17%);
  --btn-border-color: hsl(240, 98%, 17%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #010149;
  --btn-hover-border-color: #010145;
  --btn-focus-shadow-rgb: 39, 39, 111;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #010145;
  --btn-active-border-color: #010141;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(240, 98%, 17%);
  --btn-disabled-border-color: hsl(240, 98%, 17%);
}

.btn-secondary {
  --btn-color: --nav-text-color;
  --btn-bg: --nav-bg-color;
  --btn-border-color: hsl(210, 7%, 46%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #5d636b;
  --btn-hover-border-color: #575e65;
  --btn-focus-shadow-rgb: gray;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #575e65;
  --btn-active-border-color: #52585f;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(210, 7%, 46%);
  --btn-disabled-border-color: hsl(210, 7%, 46%);
}

.btn-success {
  --btn-color: hsl(0, 0%, 100%);
  --btn-bg: hsl(120, 32%, 39%);
  --btn-border-color: hsl(120, 32%, 39%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #3a6f3a;
  --btn-hover-border-color: #366936;
  --btn-focus-shadow-rgb: 96, 150, 96;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #366936;
  --btn-active-border-color: #336233;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(120, 32%, 39%);
  --btn-disabled-border-color: hsl(120, 32%, 39%);
}

.btn-info {
  --btn-color: hsl(0, 0%, 100%);
  --btn-bg: #31b0d5;
  --btn-border-color: #269abc;
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #269abc;
  --btn-hover-border-color: #31b0d5;
  --btn-focus-shadow-rgb: 79, 122, 158;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #269abc;
  --btn-active-border-color: #31b0d5;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(207, 49%, 37%);
  --btn-disabled-border-color: hsl(207, 49%, 37%);
}

.btn-warning {
  --btn-color: hsl(0, 0%, 100%);
  --btn-bg: hsl(34, 100%, 34%);
  --btn-border-color: hsl(34, 100%, 34%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #935300;
  --btn-hover-border-color: #8a4e00;
  --btn-focus-shadow-rgb: 185, 122, 38;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #8a4e00;
  --btn-active-border-color: #824a00;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(34, 100%, 34%);
  --btn-disabled-border-color: hsl(34, 100%, 34%);
}

.btn-danger {
  --btn-color: hsl(0, 0%, 100%);
  --btn-bg: hsl(3, 75%, 37%);
  --btn-border-color: hsl(3, 75%, 37%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #8c1a14;
  --btn-hover-border-color: #841913;
  --btn-focus-shadow-rgb: 179, 65, 59;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #841913;
  --btn-active-border-color: #7c1712;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(3, 75%, 37%);
  --btn-disabled-border-color: hsl(3, 75%, 37%);
}

.btn-light {
  --btn-color: hsl(0, 0%, 0%);
  --btn-bg: hsl(210, 17%, 98%);
  --btn-border-color: hsl(210, 17%, 98%);
  --btn-hover-color: hsl(0, 0%, 0%);
  --btn-hover-bg: #d4d5d5;
  --btn-hover-border-color: #c7c8c9;
  --btn-focus-shadow-rgb: 212, 213, 213;
  --btn-active-color: hsl(0, 0%, 0%);
  --btn-active-bg: #c7c8c9;
  --btn-active-border-color: #bbbcbc;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 0%);
  --btn-disabled-bg: hsl(210, 17%, 98%);
  --btn-disabled-border-color: hsl(210, 17%, 98%);
}

.btn-dark {
  --btn-color: hsl(0, 0%, 100%);
  --btn-bg: hsl(210, 10%, 23%);
  --btn-border-color: hsl(210, 10%, 23%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: #53585e;
  --btn-hover-border-color: #494f54;
  --btn-focus-shadow-rgb: 83, 88, 94;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: #5d6267;
  --btn-active-border-color: #494f54;
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(0, 0%, 100%);
  --btn-disabled-bg: hsl(210, 10%, 23%);
  --btn-disabled-border-color: hsl(210, 10%, 23%);
}

.btn-outline-primary {
  --btn-color: hsl(240, 98%, 17%);
  --btn-border-color: hsl(240, 98%, 17%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(240, 98%, 17%);
  --btn-hover-border-color: hsl(240, 98%, 17%);
  --btn-focus-shadow-rgb: 1, 1, 86;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(240, 98%, 17%);
  --btn-active-border-color: hsl(240, 98%, 17%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(240, 98%, 17%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(240, 98%, 17%);
  --gradient: none;
}

.btn-outline-secondary {
  --btn-color: hsl(210, 7%, 46%);
  --btn-border-color: hsl(210, 7%, 46%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(210, 7%, 46%);
  --btn-hover-border-color: hsl(210, 7%, 46%);
  --btn-focus-shadow-rgb: 109, 117, 126;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(210, 7%, 46%);
  --btn-active-border-color: hsl(210, 7%, 46%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(210, 7%, 46%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(210, 7%, 46%);
  --gradient: none;
}

.btn-outline-success {
  --btn-color: hsl(120, 32%, 39%);
  --btn-border-color: hsl(120, 32%, 39%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(120, 32%, 39%);
  --btn-hover-border-color: hsl(120, 32%, 39%);
  --btn-focus-shadow-rgb: 68, 131, 68;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(120, 32%, 39%);
  --btn-active-border-color: hsl(120, 32%, 39%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(120, 32%, 39%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(120, 32%, 39%);
  --gradient: none;
}

.btn-outline-info {
  --btn-color: hsl(207, 49%, 37%);
  --btn-border-color: hsl(207, 49%, 37%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(207, 49%, 37%);
  --btn-hover-border-color: hsl(207, 49%, 37%);
  --btn-focus-shadow-rgb: 48, 99, 141;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(207, 49%, 37%);
  --btn-active-border-color: hsl(207, 49%, 37%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(207, 49%, 37%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(207, 49%, 37%);
  --gradient: none;
}

.btn-outline-warning {
  --btn-color: hsl(34, 100%, 34%);
  --btn-border-color: hsl(34, 100%, 34%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(34, 100%, 34%);
  --btn-hover-border-color: hsl(34, 100%, 34%);
  --btn-focus-shadow-rgb: 173, 98, 0;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(34, 100%, 34%);
  --btn-active-border-color: hsl(34, 100%, 34%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(34, 100%, 34%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(34, 100%, 34%);
  --gradient: none;
}

.btn-outline-danger {
  --btn-color: hsl(3, 75%, 37%);
  --btn-border-color: hsl(3, 75%, 37%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(3, 75%, 37%);
  --btn-hover-border-color: hsl(3, 75%, 37%);
  --btn-focus-shadow-rgb: 165, 31, 24;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(3, 75%, 37%);
  --btn-active-border-color: hsl(3, 75%, 37%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(3, 75%, 37%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(3, 75%, 37%);
  --gradient: none;
}

.btn-outline-light {
  --btn-color: hsl(210, 17%, 98%);
  --btn-border-color: hsl(210, 17%, 98%);
  --btn-hover-color: hsl(0, 0%, 0%);
  --btn-hover-bg: hsl(210, 17%, 98%);
  --btn-hover-border-color: hsl(210, 17%, 98%);
  --btn-focus-shadow-rgb: 249, 250, 251;
  --btn-active-color: hsl(0, 0%, 0%);
  --btn-active-bg: hsl(210, 17%, 98%);
  --btn-active-border-color: hsl(210, 17%, 98%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(210, 17%, 98%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(210, 17%, 98%);
  --gradient: none;
}

.btn-outline-dark {
  --btn-color: hsl(210, 10%, 23%);
  --btn-border-color: hsl(210, 10%, 23%);
  --btn-hover-color: hsl(0, 0%, 100%);
  --btn-hover-bg: hsl(210, 10%, 23%);
  --btn-hover-border-color: hsl(210, 10%, 23%);
  --btn-focus-shadow-rgb: 53, 59, 65;
  --btn-active-color: hsl(0, 0%, 100%);
  --btn-active-bg: hsl(210, 10%, 23%);
  --btn-active-border-color: hsl(210, 10%, 23%);
  --btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --btn-disabled-color: hsl(210, 10%, 23%);
  --btn-disabled-bg: transparent;
  --btn-disabled-border-color: hsl(210, 10%, 23%);
  --gradient: none;
}

.btn-link {
  --btn-font-weight: 400;
  --btn-color: var(--link-color);
  --btn-bg: transparent;
  --btn-border-color: transparent;
  --btn-hover-color: var(--link-hover-color);
  --btn-hover-border-color: transparent;
  --btn-active-color: var(--link-hover-color);
  --btn-active-border-color: transparent;
  --btn-disabled-color: hsl(210, 7%, 46%);
  --btn-disabled-border-color: transparent;
  --btn-box-shadow: none;
  --btn-focus-shadow-rgb: 39, 39, 111;
  text-decoration: underline;
}
.btn-link:focus-visible {
  color: var(--btn-color);
}
.btn-link:hover {
  color: var(--btn-hover-color);
}

.btn-lg, .btn-group-lg > .btn {
  --btn-padding-y: 0.5rem;
  --btn-padding-x: 1rem;
  --btn-font-size: 1.25rem;
  --btn-border-radius: 0.3rem;
}

.btn-sm, .btn-group-sm > .btn {
  --btn-padding-y: 0.25rem;
  --btn-padding-x: 0.5rem;
  --btn-font-size: 0.875rem;
  --btn-border-radius: 0.2rem;
}
.header-top {
  background-image:var(--kiddieland-cassiopeia-header-background-image)!important;
}