/*
Theme Name: KJK Theme
Author: Nils Rogavac
Author URI: https://www.nilsrogavac.de/

Bordeaux Rot: #982F58
Rot hell: #FFDAD1
Schwarz: #000000

*/

* {
	margin: 0;
	padding: 0;
}

body,
html {
	font-family: 'Inter', sans-serif;
	color: #000;
	scroll-behavior: smooth;
	font-weight: 400;
	line-height: 1.8;
	font-size: 16px;
}

.clearfix::after,
.row::after {
  content: "";
  clear: both;
  display: table;
}

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

.flex-vertical {
  display: flex;
  align-items: center;
}

img {
	max-width: 100%;
	height: auto;
}

/* Typographie */

/* inter-regular - latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/inter-v12-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/inter-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/inter-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/inter-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/inter-v12-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/inter-v12-latin-regular.svg#Inter') format('svg'); /* Legacy iOS */
}
/* inter-500 - latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/inter-v12-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/inter-v12-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/inter-v12-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/inter-v12-latin-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/inter-v12-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/inter-v12-latin-500.svg#Inter') format('svg'); /* Legacy iOS */
}

h1 {
	font-size: 33px;
    line-height: 1.4;
}

h2 {
	font-size: 30px;
}

h2,
h3,
h4 {
	line-height: 1.4;
	font-weight: 400;
}

p {
	line-height: 1.8;
	font-size: 16px;
}

.overlay ul {
	margin-left: 15px;
}

::selection,
.bg {  
  background-color: #FFDAD1;  
}  

.content a {
	color: #000;
	padding-bottom: 1px;
}

.content a:hover,
.content a:active,
.content a:focus {
	color: #000;
	text-decoration: none;
	transition: 0.2s all;
	border-bottom: 1px solid #000;
}

.content ul,
.content ol {
	margin-left: 20px;
}

.page-template-default h1 {
	margin-bottom: 30px;
}

/* Navigation */

nav li {
	float: left;
	list-style: none;
	margin-right: 20px;
}

nav li:last-child {
	margin-right: 0;
}

nav a {
	color: #000;
	padding-bottom: 1px;
}

nav a:hover,
nav a:active,
nav a:focus {
	color: #000;
	text-decoration: none;
	transition: 0.2s all;
	border-bottom: 1px solid #000;
}

nav .right {
	float: right;
}

.side-menu-container {
	background: #982F58;
    transform: rotate(180deg);
	position: fixed;
	right: 0;
	top: 0;
	height: 100vh;
	writing-mode: vertical-lr;
	padding: 8px;
	z-index: 999;
}

.side-menu ul {
	margin: 0;
}

.side-menu li {
	margin-right: 0;
	margin-top: 20px;
}

.side-menu a {
	color: #fff;
}

.side-menu a:hover,
.side-menu a:active,
.side-menu a:focus {
	color: #fff;
	border-bottom: none;
	border-left: 1px solid #fff;
}

/* Header */

.logo {
	max-width: 125px;
}

/* Content */

.content {
	margin: 70px 0;
}

.image-aussen {
	height: 650px;
	background: url(https://www.kjk-viersen.de/wp-content/uploads/2022/08/20220726_141956-scaled.jpg) no-repeat bottom;
	background-size: cover;
	margin: 50px 0;
}

#team {
	margin-top: 50px;
}

#team img {
	margin-bottom: 10px;
} 

#team h4 {
	margin-bottom: 0;
} 

#team .dropped {
	margin-top: 50px;
}

#einrichtung {
	margin: 40px 0 50px;
}

.galleria-counter {
	display: none;
}

.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-right {
    right: 43% !important;
}

.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-left {
	left: 43% !important;
}

.galleria-theme-nextgen_pro_slideshow .galleria-thumb-nav-left, 
.galleria-theme-nextgen_pro_slideshow .galleria-thumb-nav-right, 
.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-left, 
.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-right {
    background-image: none !important; 
    opacity: 1;
	height: auto !important;
}

.galleria-theme-nextgen_pro_slideshow .galleria-thumb-nav-left::before,
.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-left::before,
.galleria-theme-nextgen_pro_slideshow .galleria-thumb-nav-right::before,
.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-right::before {
	font-family: 'Font Awesome 6 Free';
    font-weight: 900;
	-webkit-font-smoothing: antialiased;
    display: var(--fa-display, inline-block);
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto;
	color: #fff;
	font-size: 30px;
}

.galleria-theme-nextgen_pro_slideshow .galleria-thumb-nav-left::before,
.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-left::before {
	content: "\f177";
}

.galleria-theme-nextgen_pro_slideshow .galleria-thumb-nav-right::before,
.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-right::before {
	content: "\f178";
}

.galleria-theme-nextgen_pro_slideshow .galleria-image-nav {
    margin-top: 0;
    bottom: 0;
	top: auto;
}

/* Kontakt */

/* Effects */
.overlay-slideright {
	visibility: hidden;
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
	-webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s;
	transition: transform 0.4s ease-in-out, visibility 0s 0.4s;
	color: #fff;
}

.overlay-slideright.open {
	visibility: visible;
	-webkit-transform: translateX(0%);
	transform: translateX(0%);
	-webkit-transition: -webkit-transform 0.4s ease-in-out;
	transition: transform 0.4s ease-in-out;
}

/* Overlay style */
.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #982F58;
	z-index: 9999;
}

/* Overlay closing cross */
.overlay .overlay-close {
	width: 25px;
	height: 25px;
	position: absolute;
	right: 20px;
	top: 20px;
	overflow: hidden;
	border: none;
	background: url(img/cross.png) no-repeat center center;
	text-indent: 200%;
	color: transparent;
	outline: none;
	background-size: contain;
	z-index: 100;
	cursor: pointer;
}

.map {
	height: 300px;
	background: url(https://www.kjk-viersen.de/wp-content/uploads/2022/09/map.jpg);
	background-size: cover;
}

.button {
	background: #FFDAD1;
    padding: 10px 20px !important;
    color: #000;
	border: 0;
}

.button:hover,
.button:active,
.button:focus {
	background: #982F58;
	border: 0 !important;
	transition: 0.2s all;
}

.overlay a {
	color: #fff;
	padding-bottom: 1px;
}

.overlay a:hover,
.overlay a:active,
.overlay a:focus {
	color: #fff;
	text-decoration: none;
	transition: 0.2s all;
	border-bottom: 1px solid #fff;
}

/* Footer */

footer {
	background: #FFDAD1;
	font-size: 14px;
	padding: 30px 0;
}

footer p,
footer ul {
	margin: 0;
}

/* Media Queries */

@media (min-width: 768px) { /* Ab Small */
	
	#trigger-overlay,
	.overlay-slidedown {display: none;}
	
}

@media (max-width: 767px) { /* Small */
	
	.stellenangebote-slider p,
	.stellenangebote-slider ul {
		font-size: 14px;
		line-height: 1.2;
	}
	
	#team .dropped {
		margin-top: 0;
	}
    
    #team .mitarbeiter {
		margin-bottom: 20px;
	}
	
	.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-right {
		right: 40% !important;
	}

	.galleria-theme-nextgen_pro_slideshow .galleria-image-nav-left {
		left: 40% !important;
	}
	
	.galleria-theme-nextgen_pro_slideshow .galleria-image-nav {
		height: 40px;
	}
	
	header nav {display: none;}
	
	footer p {
		text-align: center;
	}
	
	footer nav .right {
		float: none;
		margin: 20px auto 0;
		display: table;
	}
	
	.fullscreen-menu li {
		margin-right: 0;
	}
	
	.fa-bars:before {
		float: right;
	}
	
	#trigger-overlay {
		width: 100%;
		font-size: 40px;
		color: #982F58;
		z-index: 9999;
	}

	#trigger-overlay:hover,
	#trigger-overlay:active,
	#trigger-overlay:focus {
		color: #FFDAD1;
		transition: 0.2s all;
	}

	/* Menu style */
	.overlay-slidedown nav {
		text-align: center;
	}

	.overlay-slidedown ul {
		list-style: none;
		padding: 0;
		margin: 0 auto;
		display: inline-block;
		height: 100%;
		position: relative;
		float: none;
	}

	.overlay-slidedown ul li {
		display: block;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		float: none;
	}

	.overlay-slidedown ul li a {
		font-size: 35px;
		font-weight: 300;
		display: block;
		color: #fff;
		-webkit-transition: color 0.2s;
		transition: color 0.2s;
		border-bottom: 2px solid #982F58;
	}

	.overlay-slidedown ul li a:hover,
	.overlay-slidedown ul li a:focus,
	.overlay-slidedown ul li a:active {
		border-bottom: 2px solid #fff;
		text-decoration: none;
	}

	/* Effects */
	.overlay-slidedown {
		visibility: hidden;
		-webkit-transform: translateY(-100%);
		transform: translateY(-100%);
		-webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s;
		transition: transform 0.4s ease-in-out, visibility 0s 0.4s;
	}

	.overlay-slidedown.open {
		visibility: visible;
		-webkit-transform: translateY(0%);
		transform: translateY(0%);
		-webkit-transition: -webkit-transform 0.4s ease-in-out;
		transition: transform 0.4s ease-in-out;
	}

	.overlay-slidedown nav {
		font-size: 34px;
	}
	
}

@media (max-width: 575px) { /* Ab Small */
	
	body {
		padding-right: 40px;
	}
	
	.galleria-theme-nextgen_pro_slideshow .galleria-image-nav {
		display: none;
	}
	
}