/*
Theme Name: St. Vincenz Kliniken
Theme URI: https://www.vincenz.de/
Author: Luca Weischenberg, Jan Naerger
Description: Theme für die St. Vincenz-Kliniken GmbH 2025
Version: 1.4.0
Tags: Sidebar, Volle Breite, Seitentemplates, Bootstrap
*/

@font-face { font-display: swap; font-family: 'Quicksand'; src: url('fonts/Quicksand-Regular.ttf') format('truetype'); }
@font-face { font-display: swap; font-family: 'Quicksand'; font-weight: 700; src: url('fonts/Quicksand-Bold.ttf') format('truetype'); }
@font-face { font-display: swap; font-family: 'Caveat'; src:url('fonts/Caveat.ttf') format('truetype'); }

:root
{
	--vincenz-01: #00534C;
	--vincenz-02: #007367;
	--vincenz-03: #9AB9AD;
	--vincenz-04: #009A44;
	--vincenz-05: #A8AD00;
	--vincenz-06: #A39584;
	--vincenz-font-100: #525252;
	--vincenz-font-90: #5C5C5C;
	--vincenz-font-80: #666;
	--vincenz-font-70: #707070;
	--vincenz-font-60: #7A7A7A;
	--vincenz-font-50: #8F8F8F;
	--vincenz-font-40: #A3A3A3;
	--vincenz-font-30: #B8B8B8;
	--vincenz-font-20: #CCC;
	--vincenz-font-10: #E0E0E0;
	--vincenz-font-05: #EDEDED;
	--vincenz-font-0: #F5F5F5;
	--vincenz-font-white: #FFF;
	--vincenz-danger: #CF2E2E;
	--vincenz-beige: #E8E4E0;
	--vincenz-white: #FFF;
	--vincenz-black: #000;
}

body
{
	margin: 0;
	padding: 0;
	height: 100%;
	color: var(--vincenz-font-100);
	font-size: 1rem;
	font-family: 'Quicksand', sans-serif;
	line-height: 1.5;
	scroll-behavior: smooth;
}

a
{
	color: var(--vincenz-02);
	text-decoration: none;
	transition: all .2s ease-in-out;
}

a:hover
{
	color: var(--vincenz-04);
}

.bg-light,
.has-vincenz-beige-background-color
{
	background-color: var(--vincenz-beige) !important;
}

.highlight
{
	text-align: center;
}

.highlight::after
{
	content: "";
	display: block;
	width: 10%;
	height: 3px;
	font-weight: 700;
	background: var(--vincenz-03);
	margin: 20px auto 40px auto;
	border-radius: 2px;
}

.bg-vincenz-01,
.has-vincenz-01-background-color
{
	color: var(--vincenz-font-white);
	background: var(--vincenz-01);
}

.bg-vincenz-01 a,
.bg-vincenz-02 a,
a.bg-vincenz-01:hover,
a.bg-vincenz-02:hover,
.has-vincenz-01-background-color a,
.has-vincenz-02-background-color a
{
	color: var(--vincenz-font-white);
}

.bg-vincenz-02,
.has-vincenz-02-background-color
{
	color: var(--vincenz-font-white);
	background: var(--vincenz-02);
}

.bg-vincenz-03,
.has-vincenz-03-background-color
{
	color: var(--vincenz-font-white);
	background: var(--vincenz-03);
}

.bg-vincenz-04,
.has-vincenz-04-background-color
{
	color: var(--vincenz-font-white);
	background: var(--vincenz-04);
}

.bg-vincenz-05,
.has-vincenz-05-background-color
{
	color: var(--vincenz-font-white);
	background: var(--vincenz-05);
}

.bg-vincenz-06,
.has-vincenz-06-background-color
{
	color: var(--vincenz-font-white);
	background: var(--vincenz-06);
}

.has-vincenz-grey-background-color
{
	background: var(--vincenz-font-0);
}

.has-vincenz-red-background-color
{
	background: var(--vincenz-danger);
}

.text-vincenz-01
{
	color: var(--vincenz-01);
}

.text-vincenz-02
{
	color: var(--vincenz-02);
}

.has-vincenz-white-background-color
{
	background: var(--vincenz-white);
}

.has-vincenz-black-background-color
{
	background: var(--vincenz-black);
}

.vincenz-border
{
	border-bottom: 5px solid;
	border-image: linear-gradient(90deg, var(--vincenz-01) 0%, var(--vincenz-01) 30%, var(--vincenz-06) 30%, var(--vincenz-06) 40%, var(--vincenz-03) 40%, var(--vincenz-03) 45%, var(--vincenz-05) 45%, var(--vincenz-05) 65%, var(--vincenz-04) 65%, var(--vincenz-04) 75%, var(--vincenz-02) 75%, var(--vincenz-02) 100%) 1;
}

header
{
	z-index: 100;
}

.jl_logo
{
	min-height: 79px;
	max-height: 80px;
}

.searchbar input[type=search]
{
	padding-right: 20px;
	border-radius: 20px !important;
	background: var(--vincenz-font-10);
}

.searchbar button.btn
{
	margin-left: -45px !important;
}

.jl_secondNav > li
{
	display: inline-block;
}

.jl_secondNav > li > a
{
	font-size: .9rem;
	padding: .75rem 1rem;
	color: var(--vincenz-font-90);
}

.jl_secondNav > li > a:hover,
.jl_secondNav > li.current-menu-item > a,
.jl_secondNav > li.current-menu-parent > a,
.jl_secondNav > li.current-page-ancestor a
{
	color: var(--vincenz-01);
}

.jl_secondNav > li.jl_notfallBtn > a
{
	margin-left: 1.5rem;
	background: var(--vincenz-danger);
	color: var(--vincenz-font-white) !important;
	padding: 12px 20px;
	font-weight: 700;
	border-radius: 3px;
}

.jl_secondNav > li.jl_notfallBtn > a:hover,
.jl_secondNav > li.jl_notfallBtn.current-menu-item > a
{
	background: #910200;
}


.jl_primaryNav
{
	margin: 6px 0 0;
}

.jl_primaryNav > li
{
	display: inline-block;
	transition: all .2s ease-in-out;
}

.jl_primaryNav > li > a
{
	display: block;
	font-size: 1.1rem;
	font-weight: 700;
	padding: .75rem 1.25rem;
	color: var(--vincenz-01);
}

.jl_primaryNav > li:hover > a,
.jl_primaryNav > li.current-menu-item > a,
.jl_primaryNav > li.current-menu-ancestor > a
{
	background: var(--vincenz-01);
	color: var(--vincenz-font-white);
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
}

ul.jl_primaryNav > li > ul.sub-menu
{
	display: none;
}

/* Navigation Drop down Window */
ul.jl_primaryNav > li:hover > ul.sub-menu
{
	z-index: 100;
	display: block;
	list-style-type: none;
	position: absolute;
	left: 0;
	width: 100%;
	padding: 20px 35px 0;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .35);
	border-bottom-right-radius: .2rem;
	border-bottom-left-radius: .2rem;
	background: var(--vincenz-font-white);
	border-top: 5px solid var(--vincenz-01);
}

ul.jl_primaryNav > li.menu-item-has-children > a::after
{
	position: relative;
	display: inline-block;
	content: '';
	margin-left: 10px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid var(--vincenz-01);
	border-bottom: 5px solid transparent;
}

/* Unter Leistungen 2. Spaltenüberschrift unsichtbar */
#menu-item-4562 > a
{
	color: var(--vincenz-font-white);
}

ul.jl_primaryNav > li.menu-item-has-children:hover > a::after,
ul.jl_primaryNav > li.menu-item-has-children.current-menu-ancestor > a::after
{
	border-top: 5px solid var(--vincenz-font-white);
}

ul.jl_primaryNav > li > ul.sub-menu > li
{
	padding: 10px;
	vertical-align: top;
	display: inline-block;
	width: calc(25% - 4px);
}

ul.jl_primaryNav > li > ul.sub-menu > li > ul.sub-menu
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	padding-bottom: 30px;
}

/*
 * Unterpunkte
 */
ul.jl_primaryNav > li > ul.sub-menu > li > ul.sub-menu > li > a
{
	display: block;
	color: var(--vincenz-font-70);
	padding: 5px 0;
	border-bottom: 2px solid var(--vincenz-font-05);
	transition: .2s ease-in-out;
}

ul.jl_primaryNav > li > ul.sub-menu > li > ul.sub-menu > li:hover > a,
ul.jl_primaryNav > li > ul.sub-menu > li > ul.sub-menu > li.current-menu-item > a,
ul.jl_primaryNav > li > ul.sub-menu > li > ul.sub-menu > li.current-page-ancestor a
{
	border-bottom: 2px solid var(--vincenz-02);
}

/* 
 * Überschriften der Spalten
 */
ul.jl_primaryNav > li > ul.sub-menu > li > a
{
	display: block;
	padding-bottom: 10px;
	font-weight: 700;
	font-size: 1.3rem;
	color: var(--vincenz-01);
}



/*
 * Breadcrumbs
 */
.jlBreadcrumb
{
	margin: 1em 0;
	font-size: 0.9em;
}

.jlBreadcrumb ul
{
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
}

.jlBreadcrumb i
{
	color: var(--vincenz-font-50);
}

.jlBreadcrumb span
{
	color: var(--vincenz-font-80);
}



/*
 * Content
 */
.jl_slider
{
	background-size: cover;
	background-repeat: no-repeat;
	height: 0;
	padding-top: 31.25%; /* img-height / img-width * container-width */
	border-bottom: 20px solid;
	border-image: linear-gradient(90deg, var(--vincenz-01) 0%, var(--vincenz-01) 30%, var(--vincenz-06) 30%, var(--vincenz-06) 40%, var(--vincenz-03) 40%, var(--vincenz-03) 45%, var(--vincenz-05) 45%, var(--vincenz-05) 65%, var(--vincenz-04) 65%, var(--vincenz-04) 75%, var(--vincenz-02) 75%, var(--vincenz-02) 100%) 1;
	/*animation: thumbnail-fade .75s ease-out forwards;*/
}

.jl_slider div.container
{
	margin-top: -25%;
	animation: thumbnail-textmove 1.2s ease-out forwards;
}

.jl_slider div.thumbnail-text span
{
	display: inline-block;
	/*max-width: 400px;*/
	margin: 2px 0;
	padding: 4px 12px;
	background-color: var(--vincenz-white);
	font-size: 1.5rem;
}

.jl_slider div.thumbnail-text span.title
{
	margin-bottom: 5px;
	font-size: 2rem;
	font-weight: 700;
	padding: 5px 12px;
	color: var(--vincenz-white);
	background-color: var(--vincenz-01);
}

@keyframes thumbnail-textmove
{
	from {transform: translateY(0); opacity: 0;}
	to {transform: translateY(20px); opacity: 1;}
}

@keyframes thumbnail-fade
{
	from {opacity: 0.25;}
	to {opacity: 1;}
}

.signature
{
	color: var(--vincenz-01);
	font-family: Caveat;
	font-weight: 700;
	font-size: 22px;
}

.sidebar-navigation-title
{
	margin-top: 2rem;
}

ul.sidebar-navigation
{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

ul.sidebar-navigation li
{
	padding: 0;
}

ul.sidebar-navigation li a
{
	display: block;
	margin-bottom: 1px;
	padding: 10px 15px;
	background: var(--vincenz-02);
}

ul.sidebar-navigation li a:hover
{
	color: inherit;
	background: var(--vincenz-05);
}

ul.sidebar-navigation li::before
{
	content: none;
}

.no-gap
{
	gap: 0;
}

/* Link-Liste untereinander (z.B. UC SK) */
.linkliste a
{
	display: block;
	padding: 15px;
	color: var(--vincenz-white);
	background: var(--vincenz-06);
}

.linkliste p:last-child
{
	margin-bottom: 0;
}

.linkliste a:hover
{
	background: var(--vincenz-02);
}



footer
{
	padding: 20px;
	background: var(--vincenz-01);
}

footer .jl_footerNav
{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

footer .jl_footerNav li
{
	display: inline-block;
}

footer .jl_footerNav li a
{
	display: block;
	padding: 10px 15px;
	font-weight: 700;
	color: var(--vincenz-font-white);
}

footer .jl_footerNav li:hover a,
footer .jl_footerNav li.current-menu-item 
{
	border-radius: 3px;
	background: var(--vincenz-02);
}


/* WordPress Overrides */
/* Bildunterschrift */
figcaption.wp-element-caption
{
	font-style: italic !important;
	color: rgba(0, 0, 0, .5) !important;
}

/* Buttons */
.wp-block-button a.wp-block-button__link
{
	background: var(--vincenz-01);
}

.wp-block-button a.wp-block-button__link:hover
{
	color: var(--vincenz-white);
	background: var(--vincenz-02);
}

/* Tabellen */
table td
{
	border: none !important;
}

.table-border table td
{
	border: solid 2px !important;
}

/* Blockquotes/Zitate */
blockquote.wp-block-quote
{
	border-left: 5px solid var(--vincenz-01);
	padding: 10px 10px 1px 1rem;
	font-style: italic;
}

/* Block Presse auf Frontpage */
ul.wp-block-latest-posts__list
{
	display: flex;
	gap: 2rem;
}

.wp-block-latest-posts.wp-block-latest-posts__list li
{
	position: relative;
	padding-bottom: 80px;
	box-shadow: var(--bs-box-shadow) !important;
}

.wp-block-latest-posts__featured-image a
{
	display: block;
}

ul.wp-block-latest-posts__list div.wp-block-latest-posts__featured-image img
{
	min-width: 100%;
	max-height: 200px !important;
	object-fit: cover;
	border-bottom: 5px solid;
	border-image: linear-gradient(90deg, var(--vincenz-01) 0%, var(--vincenz-01) 30%, var(--vincenz-06) 30%, var(--vincenz-06) 40%, var(--vincenz-03) 40%, var(--vincenz-03) 45%, var(--vincenz-05) 45%, var(--vincenz-05) 65%, var(--vincenz-04) 65%, var(--vincenz-04) 75%, var(--vincenz-02) 75%, var(--vincenz-02) 100%) 1;
}

ul.wp-block-latest-posts__list a.wp-block-latest-posts__post-title
{
	display: block;
	margin: 20px;
	font-weight: 700;
}

ul.wp-block-latest-posts__list time.wp-block-latest-posts__post-date,
ul.wp-block-latest-posts__list div.wp-block-latest-posts__post-excerpt
{
	margin: 0 20px;
}


ul.wp-block-latest-posts__list a.wp-block-latest-posts__read-more
{
	position: absolute;
	bottom: 20px;
	display: block;
	width: calc(100% - 40px);
	padding: 10px;
	font-weight: 700;
	text-align: center;
	color: var(--vincenz-font-white);
	background: var(--vincenz-01);
}

ul.wp-block-latest-posts__list a.wp-block-latest-posts__read-more:hover
{
	background: var(--vincenz-02);
}

ul.wp-block-latest-posts__list li
{
	flex-grow: 1;
	flex-basis: 0;
	background: var(--vincenz-white);
}

.profilbild
{
	height: 170px;
	font-size: 120px;
	line-height: 170px;
	text-align: center;
	background: var(--vincenz-font-10) no-repeat center center;
	background-size: cover;
	border-bottom: 5px solid;
	border-image: linear-gradient(90deg, var(--vincenz-01) 0%, var(--vincenz-01) 30%, var(--vincenz-06) 30%, var(--vincenz-06) 40%, var(--vincenz-03) 40%, var(--vincenz-03) 45%, var(--vincenz-05) 45%, var(--vincenz-05) 65%, var(--vincenz-04) 65%, var(--vincenz-04) 75%, var(--vincenz-02) 75%, var(--vincenz-02) 100%) 1;
}


/* Bootstrap Overrides */
h1
{
	font-size: 2rem !important;
}

h2
{
	font-size: 1.8rem !important;
}

h3
{
	font-size: 1.6rem !important;
}

h4
{
	font-size: 1.4rem !important;
}

h1, h2, h3, h4
{
	margin-bottom: 1.2rem;
}

.btn-primary
{
	border-color: var(--vincenz-02) !important;
	background-color: var(--vincenz-02) !important;
}

.btn-primary:hover
{
	border-color: var(--vincenz-01) !important;
	background-color: var(--vincenz-01) !important;
}

.btn-outline-primary
{
	color: var(--vincenz-02) !important;
	border-color: var(--vincenz-02) !important;
}

.btn-outline-primary:hover
{
	color: var(--vincenz-white) !important;
	border-color: var(--vincenz-01) !important;
	background-color: var(--vincenz-01) !important;
}

.wp-block-list
{
	list-style: none;
	padding-left: 1rem;
}

.wp-block-list li
{
	position: relative;
	padding-left: 1.5rem;
}

.wp-block-list li::before
{
	content: "\f054";
	font-family: "Font Awesome 5 Free"; 
	font-weight: 700;
	color: var(--vincenz-font-60);
	position: absolute;
	left: 0;
	top: 0;
}

.bg-vincenz-01 .wp-block-list li::before,
.bg-vincenz-02 .wp-block-list li::before,
.has-vincenz-01-background-color .wp-block-list li::before,
.has-vincenz-02-background-color .wp-block-list li::before
{
	color: var(--vincenz-white);
}

.form-control:focus,
.form-check-input:focus,
.accordion-button:focus
{
	border-color: var(--vincenz-01);
	box-shadow: 0 0 0 0.25rem rgba(0, 83, 76, .25);
}

ul.pagination li a.page-link
{
	color: var(--vincenz-font-default);
}

ul.pagination li span.current
{
	border-color: var(--vincenz-01);
	background: var(--vincenz-01);
}

/* Accordion Start */
.accordion-header
{
	margin-bottom: 1px;
}

.accordion-button
{
	font-weight: 700;
}

.accordion-button:not(.collapsed)
{
	color: var(--vincenz-white);
	background-color: var(--vincenz-01);
}

.accordion-button
{
	color: var(--vincenz-white);
	background-color: var(--vincenz-beige);
}

.accordion-button:not(.collapsed):after
{
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
}

.accordion-item,
.accordion-button
{
	color: inherit;
	border-radius: unset !important;
	border-color: var(--vincenz-beige);
}
/* Accordion Ende */



/* Jobs */
div#cjb-list table td.headtd
{
	background: var(--vincenz-font-0);
}

div#cjb-list a.subscriptionbutton
{
	cursor: pointer;
}

div#cjb-list span#hd_Stellenangebot span.headerlink
{
	display: inline-block;
	padding: 10px 20px;
	color: var(--vincenz-white);
	background: var(--vincenz-01);
}

div#cjb-list div#concludis div.wrapper
{
	max-width: unset;
}

div.stellensum
{
	margin: 20px 0 10px 0;
}

div#hd_Stellenangebot
{
	display: none;
}

div.stellen
{
	width: 100% !important;
}

div.stellenlst div.stellen div
{
	cursor: pointer;
	padding: 10px;
	margin-bottom: 10px;
	color: var(--vincenz-white);
	background: var(--vincenz-01);
	transition: all .2s ease-in-out;
}

div.stellenlst div.stellen div:hover
{
	background: var(--vincenz-02);
}

div.stellenlst div.stellen div span.headerlink
{
	color: var(--vincenz-white);
	font-weight: 700;
}


/* Speiseplan */
.speise-container
{
	color: var(--vincenz-white);
}

.speise0
{
	background: var(--vincenz-01);
}

.speise1
{
	background: var(--vincenz-02);
}

.speise2
{
	background: var(--vincenz-05);
}

.speise-more
{
	display: block;
	padding: 15px;
	color: var(--vincenz-white);
	border-top: 1px solid rgba(255,255,255,0.3);
	text-align: center;
}

.speise-more:hover
{
	color: var(--vincenz-white);
	background: rgba(255,255,255,0.2);
}

.speise-kcal-gesamt
{
	color: var(--vincenz-white);
	background: rgba(255,255,255,0.2);
	text-align: center;
}

.speise-container .collapse
{
	border-top: 1px solid rgba(255,255,255,0.3);
}

.speise-zusatz
{
	background: rgba(255,255,255,0.1);
}

.speise-zusatz ul
{
	margin: 0;
	padding-left: 18px;
}



/*
 * Azubi Page
 */
.node-container
{
	transition: transform 0.3s ease;
}

.node-container:hover
{
	transform: scale(1.1);
}

.azubiPage-circle
{
	width: 40px;
	height: 40px;
	background-color: var(--vincenz-02);
	border-radius: 50%;
	border: 3px solid var(--vincenz-font-white);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.azubiPage-content
{
	margin-top: 10px;
	background-color: var(--vincenz-font-white);
	padding: 20px;
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	width: 200px;
	text-align: center;
}

.azubiPage-content h3
{
	margin-bottom: 10px;
	font-size: 1.1rem !important;
	font-weight: 700;
}


@media (max-width: 990px)
{
	div#jn_header
	{
		padding: 0;
	}

	.jl_logo
	{
		min-height: 50px;
		max-height: 51px;
	}

	div#mainmenu
	{
		position: absolute;
		left: 0;
		width: 100%;
		min-height: 100vh;
		background: var(--vincenz-white);
	}

	ul.jl_primaryNav
	{
		float: none !important;
		height: calc(100vh - 200px);
		overflow-y: auto;
		padding: 1rem;
	}

	ul.jl_primaryNav > li
	{
		display: block;
		margin-bottom: 1px;
	}

	ul.jl_primaryNav > li:hover > ul.sub-menu
	{
		position: relative;
	}

	ul.jl_primaryNav > li > ul.sub-menu > li
	{
		display: block;
		width: 100%;
	}

	ul.jl_primaryNav > li > ul.sub-menu
	{
		display: none !important;
	}

	ul.jl_primaryNav > li.open > ul.sub-menu
	{
		display: block !important;
	}

	.jl_primaryNav > li.menu-item-has-children > a::after
	{
		content: "▼";
		float: right;
		transform: rotate(0deg);
		transition: .2s;
		border: none;
		margin: 10px 0 0 10px;
	}

	.jl_primaryNav > li.open > a::after
	{
		margin-top: 6px;
		transform: rotate(180deg);
	}

	ul.jl_secondNav
	{
		padding: 0;
		font-weight: 700;
		text-align: center;
	}

	body.menu-open
	{
		overflow: hidden;
		padding-top: 0;
		width: 100%;
	}

	ul.wp-block-latest-posts__list
	{
		display: block;
	}

	ul.wp-block-latest-posts__list li
	{
		margin-bottom: 1rem;
	}
}