@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@100;200;300;400;500;600;700&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css");
:root {
  --body-font-size: 1rem;
  --body-line-height: 1.5;
  --black: #202020; --cassiopeia-color-primary: #202020;
  --white: #f5f5f5;
  --white2: #fff; --body-bg: #fff;
  --blue: #5fa2a9;
  --blue-dark: #34445c;
  --brown: #a9615f;
  --brown-light: #a9745f;  
  --grey: #c8d3d9;
  --grey-dark: #404040;
  --yellow: #ecc73e;
  --yellow-light: #f1d777;
  --green: #5fa966;
  --green-light: #aae386;
  --green-medium: #5fa99e;
  --green-dark: #349082; --cassiopeia-color-link: #349082; --cassiopeia-color-hover: #349082;
  --dust: #d9cec8;
  --purple: #a362d4;
}

/* MAIN MENU */
.container-nav { padding-bottom: 0.5rem !important; }
.container-nav ul.maximenuck { background: transparent !important; }
.container-nav ul.maximenuck li.level1.parent > a:after { display: none !important; }
.container-nav li.maximenuck.level1 { border: none !important; border-radius: 0.2rem !important; padding: 0 !important; margin-right: 0.15rem !important; }
.container-nav li.maximenuck.level1 .titreck { text-transform: uppercase !important; font-size: 1em !important; font-weight: 500 !important; color: var(--white) !important; }
.container-nav li.maximenuck.level1 a { padding: 0.5rem !important; }
.container-nav li.maximenuck.level1 a:hover { text-decoration: none !important; }
.container-nav li.maximenuck.level1:hover,
.container-nav li.maximenuck.level1.active { background: var(--yellow) !important;}
.container-nav li.maximenuck.level1.active .titreck { color: var(--black) !important; }

/* EVENT BOOKING */
.eb-columns-layout-container .eb-event-wrapper { margin: 0 !important; }

/* GENEREL */
body { font-family: 'Open Sans', serif; background-color: var(--white); }
a { text-decoration: none !important;}
a:focus, a:hover { text-decoration: underline !important;}
h2, .h2 { font-size; 1.8rem; }
h3, .h3 { font-size: 1.4rem; }
.lead { font-weight: 400; }
.horizontal-line { display: block; border: 1px solid var(--grey); margin: 1rem 0; }

/* BACK TO TOP */
.back-to-top-link:focus, .back-to-top-link:hover { background-color: var(--grey); border-color: var(--black); color: var(--black); }

/* TAGS (BADGE) */
.text-bg-light { background-color: #c8d3d9; }
.badge { padding: 0.4rem 0.7rem; font-size: 0.9rem; margin-left: 0.2rem; margin-bottom: 0.4rem; }

/* RATIO (centers instead of left-align) */
.ratio { width: auto; }
.ratio>* { left: auto; }

/* CARD */
.card { border: 0.01rem solid var(--grey); border-radius: unset; width: 100%; }
.card-header { padding: 0.75rem 1rem; }
.card-header:first-child { border-radius: unset; }
.card-footer { background: #fff; border: none; }
.card-title { padding: 0 0.5rem; font-size: 1.8rem; }

/* IMAGES */
.img-max { max-height: 100%; max-width: 100%; }
.img-zoom { height: 100%; max-height: 100%; width: 100%; max-width: 100%; object-fit: cover !important; }
.img-max-50 { max-height: 50px; width: auto; }
.img-max-100 { max-height: 100px; width: auto; }
.img-max-200 { max-height: 200px; width: auto; }

/* BUTTONS */
button { border: none; background: none; padding: 0; }
.btn { padding: 0.35rem 0.8rem; -webkit-transition: all .3s ease-in-out; font-weight: 500; border-radius: 0.2rem; }
.btn-primary, .btn-primary a { background-color: var(--yellow); border-color: var(--yellow); color: var(--black) !important; }
.btn-primary:focus, .btn-primary:focus a, .btn-primary:hover, .btn-primary:hover a { background-color: var(--yellow-light); border-color: var(--yellow-light); color: var(--black) !important; }
.btn-secondary { background-color: var(--green-dark); border-color: var(--green-dark); color: var(--white); }
.btn-secondary:focus, .btn-secondary:hover { background-color: var(--green-medium); border-color: var(--green-medium); color: var(--white) !important; }
.btn, .btn:focus, .btn:hover, .btn a, .btn a:focus, .btn a:hover,
.btn-primary, .btn-primary:focus, .btn-primary:hover, .btn-primary a, .btn-primary a:focus, .btn-primary a:hover,
.btn-secondary, .btn-secondary:focus, .btn-secondary:hover, .btn-secondary a, .btn-secondary a:focus, .btn-secondary a:hover { text-decoration: none !important; color: var(--white); }
.btn-info { background-color: var(--grey); border-color: var(--blue-dark); color: var(--black) !important; }
.btn-info:focus, .btn-info:hover { background-color: var(--green-dark); border-color: var(--blue-dark); color: var(--white) !important; }

/* TAGS */
.tags .list-inline-item { margin: .1rem .1rem .4rem 0.1rem; }
.tags dl, ol, ul { margin-bottom: 0; }

/* FIELDS */
ul.fields-container { padding-left: 0; }
li.field-entry { list-style: none; }

/* FRONTEND TABS IN ARTICLE EDIT */
joomla-tab[view=tabs]>div[role=tablist] { background-color: var(--grey); }
joomla-tab button[role=tab][aria-expanded=true] { background-color: var(--grey-dark); color: var(--white); }

/* ARTICLES ONLY */
.com-content-article a { font-weight: 800 !important; }

/* SIDEBAR */
.sidebar-right > .mod-custom { padding: 0.25rem 0.75rem !important; }

/* SIDE MENU */
.sidebar-right ul.maximenuck { padding-left: 0 !important; background: var(--grey) !important; }
.sidebar-right li.maximenuck.level1 { border: 0.01rem solid var(--white) !important; border-radius: 0.2rem !important; padding: 0.5rem !important; margin-bottom: 0.25rem !important; }
.sidebar-right li.maximenuck.level1 .titreck { text-transform: uppercase !important; font-size: 1rem !important; font-weight: 500 !important; color: var(--black) !important; }
.sidebar-right li.maximenuck.level1.current,
.sidebar-right li.maximenuck.level1:active,
.sidebar-right li.maximenuck.level1:focus,
.sidebar-right li.maximenuck.level1:hover,
.sidebar-right li.maximenuck.level1.active { border: 0.01rem solid var(--grey-dark) !important; background: var(--blue-dark) !important; color: var(--white) !important; }
.sidebar-right li.maximenuck.level1:active .titreck,
.sidebar-right li.maximenuck.level1:focus .titreck,
.sidebar-right li.maximenuck.level1:hover .titreck,
.sidebar-right li.maximenuck.level1.active .titreck { color: var(--white) !important; }
.sidebar-right li.maximenuck.level1 a:hover { text-decoration: none !important; }

/* MOBILE MENU */
div#maximenuck133 { display: none !important; }  /* Fjerner menu id 133 i den normale menupos, så der ikke vises "dobbelt menu" i den normale menupos */
.mobilemenuck-title, .mobilemenuck-bar-title, .mobilemenuck-button, .mobilemenuck-bar-button { background: var(--blue-dark) !important; color: var(--white) !important; }
.mobilemenuck-title, .mobilemenuck-bar-title { font-size: 1.25rem !important; height: 2.75rem !important; }
.mobilemenuck-button, .mobilemenuck-bar-button { font-size: 2rem !important; }
.mobilemenuck-button { padding-top: 0.15rem !important; }
.mobilemenuck a { font-size: 1.15rem !important; }
.mobilemenuck-item > .level1 { background: var(--green-medium) !important; }
.mobilemenuck-item > .level1 a { color: var(--white) !important; }
.mobilemenuck-item > .level1:hover, .mobilemenuck-item > .level2:hover { background: var(--yellow) !important; }
.mobilemenuck-item > .level1 a:hover { color: var(--black) !important; text-decoration: none !important; }
.mobilemenuck-item > .level2 { background: var(--grey) !important; }
.mobilemenuck-item > .level2 a:hover { color: var(--black) !important; text-decoration: none !important; }
.mobilemenuck-item > .level3 { background: var(--blue-dark) !important; }
.mobilemenuck-item > .level3 a:hover { color: var(--white) !important; text-decoration: none !important; }
@media (max-width: 1160px) {
  .container-nav ul.maximenuck { margin-top: 0.15rem !important; }
  .container-nav li.maximenuck.level1 { padding: 0.4rem 0.6rem 0 0.3rem !important; margin-right: 0.05rem !important; }
  .titreck { font-size: 0.9rem !important; }
  .card-body { padding: 0.5rem !important; }
  .sidebar-left li.maximenuck.level1 a { padding-left: 0.5rem !important; }
  .sidebar-left li.maximenuck.level1 .titreck { font-size: 0.9rem !important; }
}

/* SEARCH FIELD */
.container-search { margin-top: 0 !important; margin-right: 0.5rem; }
.container-search .form-control { border: 1px solid var(--white); color: var(--black); line-height: 0; padding: 0.5rem 0.5rem; }
@media (max-width: 1160px) {
  .container-search { margin-top: 0.15rem !important; margin-left: 0.5rem !important; }
  .container-search .form-control { font-size: 0.9rem !important; }
}

/* LOGO */
.navbar-brand img { }
@media (min-width: 992px) { .navbar-brand { width: 70% } }

/* HEADER */
.container-header, .navbar-brand { padding: 0; }
.container-header .grid-child { padding: 0; }
.container-header { background-image: linear-gradient( 180deg, hsl(171deg 30% 52%) 0%, hsl(171deg 38% 45%) 50%, hsl(171deg 47% 38%) 100%); }

/* FOOTER */
.container-footer { background-image: linear-gradient( 180deg, hsl(171deg 30% 52%) 0%, hsl(171deg 38% 45%) 50%, hsl(171deg 47% 38%) 100%); }

.footer .grid-child { display: unset; }
.footer a { color: var(--white); }
.footer a:focus, .footer a:active, .footer a:hover { color: var(--grey); text-decoration: none !important; }

/* COLORS */
.black { color: var(--black) !important; }					.bg-black { background: var(--black) !important; }
.white { color: var(--white) !important; }					.bg-white { background: var(--white) !important; }
.white2 { color: var(--white2) !important; }				.bg-white2 { background: var(--white2) !important; }
.blue { color: var(--blue) !important; }					.bg-blue { background: var(--blue) !important; }
.blue-dark { color: var(--blue-dark) !important; }			.bg-blue-dark { background: var(--blue-dark) !important; }
.brown { color: var(--brown) !important; }					.bg-brown { background: var(--brown) !important; }
.brown-light { color: var(--brown-light) !important; }		.bg-brown-light { background: var(--brown-light) !important; }
.grey { color: var(--grey) !important; }					.bg-grey { background: var(--grey) !important; }
.grey-dark { color: var(--grey-dark) !important; }			.bg-grey-dark { background: var(--grey-dark) !important; }
.yellow { color: var(--yellow) !important; }				.bg-yellow { background: var(--yellow) !important; }
.green { color: var(--green) !important; }					.bg-green { background: var(--green) !important; }
.green-light { color: var(--green-light) !important; }		.bg-green-light { background: var(--green-light) !important; }
.green-medium { color: var(--green-medium) !important; }	.bg-green-medium { background: var(--green-medium) !important; }
.green-dark { color: var(--green-dark) !important; }		.bg-green-dark { background: var(--green-dark) !important; }
.dust { color: var(--dust) !important; }					.bg-dust { background: var(--dust) !important; }
.purple { color: var(--purple) !important; }				.bg-purple { background: var(--purple) !important; }