/*
Theme Name: Dmig 16
Theme URI: https://www.designmadeingermany.de
Description: Design made in Germany "Back to the Roots" 2002
Author: Martin Rack
Version: 16
Tags: -
*/




* {
margin: 0;
padding: 0;
border: none;
outline: none;
box-sizing: border-box;
-webkit-user-drag: none;
user-select: none;
}

::selection { background: rgba(0,0,0,0);}
*::selection { background: rgba(0,0,0,0);}
input::selection { background: rgba(0,0,0,0.1); }
textarea::selection { background: rgba(0,0,0,0.1); }

@media (prefers-color-scheme: light) {

:root {
--bgr1: #d4d4d4;
--bgr2: #d1d1d1;
--bgr3: #c9c9c9;
--bgr4: #c3c3c3;
--bgr5: #bebebe;
--border: rgb(0 0 0 / 09%);
--highlight: rgb(255 255 255 / 31%);
--shadow: rgba(0,0,0,0.025);
--text: rgba(0,0,0,0.8);
--embossed: rgba(0,0,0,0.2);
--textshadow: rgb(255 255 255 / 45%);
--input: #fff;
--neon: #fff;
}

.image img[alt]:after {
background-color: #fff;
box-shadow: inset 2px 2px 0 rgba(0,0,0,0.025);
}

.logo img {
filter: drop-shadow( 1px 1px 0 #eee);
opacity: 0.8;
}


.dark.list {
box-shadow: 1px 1px 0 rgb(255 255 255 / 15%);
}



.dark {
--bgr1: #222222;
--bgr2: #1c1c1c;
--bgr3: #1a1a1a;
--bgr4: #181818;
--bgr5: #161616;
--border: #141414;
--highlight: rgb(255 255 255 / 5%);
--shadow: rgb(0 0 0 / 9%);
--text: rgb(255 255 255);
--embossed: rgb(255 255 255 / 16%);
--textshadow: rgb(2 2 2 / 48%);
--input: #d7d7d7;
--neon: #ffb200;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.dark img[alt]:after {
background-color: #262626;
box-shadow: inset 2px 2px 0 rgba(0,0,0,0.035);
}

.dark .eintrag:visited .title, .dark .eintrag:visited .subtitle, .dark .eintrag.visited .title, .dark .eintrag.visited .subtitle {
color: #888 !important;
}



.dark .image .imagebackground, .dark .image video {  }

.dark .image:hover .imagebackground, .dark .image:hover video { transition: filter 300ms; }

.dark .image:hover .imagebackground[alt]:after { background: #a5a5a5; }


.dark .logo img {
filter: drop-shadow( 1px 1px 0 #777);
opacity: 0.49;
opacity: 1;
filter: invert(1);
}

.dark input, .dark textarea {
color: #333;
-webkit-font-smoothing: auto;
text-shadow: none !important;
}

.dark input[type=submit], .dark button {
color: var(--text);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.dark input[type=text]::placeholder, .dark input[type=email]::placeholder, .dark input[type=url]::placeholder, .dark textarea::placeholder {
color: #333;
text-shadow: none;
}

.dark input[type=text]:focus::placeholder, .dark input[type=email]:focus::placeholder, .dark input[type=url]:focus::placeholder, .dark textarea:focus::placeholder {
color: #aaa;
text-shadow: none;
}

.dark .subtitle {
color: rgba(255,255,255,0.5);
}

.dark .eintrag:hover .title, .dark .eintrag:hover .subtitle {
opacity: 1;
color: var(--text) !important;
}




}


@media (prefers-color-scheme: dark) {

:root {
--bgr1: #9b9b9b;
--bgr2: #999999;
--bgr3: #959595;
--bgr4: #919191;
--bgr5: #8e8e8e;
--border: rgba(0,0,0,0.1);
--highlight: rgba(255,255,255,0.13);
--shadow: rgba(0,0,0,0.025);
--text: rgba(0,0,0,0.8);
--embossed: rgba(0,0,0,0.2);
--textshadow: rgba(255,255,255,0.18);
--input: #ddd;
--neon: #efefef;
}

img[alt]:after {
background-color: #fff;
box-shadow: inset 2px 2px 0 rgba(0,0,0,0.025);
}

.eintrag:visited .title, .eintrag:visited .subtitle, .eintrag.visited .title, .eintrag.visited .subtitle {
color: #8a8d90 !important;
}

.image .imagebackground, .image video {  }

.image:hover .imagebackground, .image:hover video { transition: filter 300ms; }

.image:hover .imagebackground, .zoom .image:hover .imagebackground {
//background-color: var(--bgr3);
}

.image:hover .imagebackground[alt]:after { background: #959595; }



.logo img {
filter: drop-shadow( 1px 1px 0 var(--highlight));
opacity: 1;
filter: contrast(0.63);
}





.dark {
--bgr1: #222222;
--bgr2: #1c1c1c;
--bgr3: #1a1a1a;
--bgr4: #181818;
--bgr5: #161616;
--border: #141414;
--highlight: rgb(255 255 255 / 5%);
--shadow: rgb(0 0 0 / 9%);
--text: rgb(255 255 255);
--embossed: rgb(255 255 255 / 16%);
--textshadow: rgb(2 2 2 / 48%);
--input: #d7d7d7;
--neon: #ffb200;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.dark img[alt]:after {
background-color: #262626;
box-shadow: inset 2px 2px 0 rgba(0,0,0,0.035);
}

.dark .eintrag:visited .title, .dark .eintrag:visited .subtitle, .dark .eintrag.visited .title, .dark .eintrag.visited .subtitle {
color: #888 !important;
}


.dark .image .imagebackground, .dark .image video {  }

.dark .image:hover .imagebackground, .dark .image:hover video { transition: filter 300ms; }

.dark .image:hover .imagebackground[alt]:after { background: #a5a5a5; }


.dark .logo img {
filter: drop-shadow( 1px 1px 0 #777);
opacity: 0.49;
opacity: 1;
filter: invert(1);
}

.dark input, .dark textarea {
color: #333;
-webkit-font-smoothing: auto;
text-shadow: none !important;
}

.dark input[type=submit], .dark button {
color: var(--text);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.dark input[type=text]::placeholder, .dark input[type=email]::placeholder, .dark input[type=url]::placeholder, .dark textarea::placeholder {
color: #333;
text-shadow: none;
}

.dark input[type=text]:focus::placeholder, .dark input[type=email]:focus::placeholder, .dark input[type=url]:focus::placeholder, .dark textarea:focus::placeholder {
color: #aaa;
text-shadow: none;
}

.dark .subtitle {
color: rgba(255,255,255,0.5);
}

.dark .eintrag:hover .title, .dark .eintrag:hover .subtitle {
opacity: 1;
color: var(--text) !important;
}




}














::-webkit-scrollbar-thumb:vertical {
width: 18px;
background: #2e2e2e;
}

::-webkit-scrollbar {
width: 18px;
height: 18px;
background: #cacbcb;
box-shadow: inset 2px 2px 0 var(--shadow);
border-left: solid 1px var(--border);
border-top: none;
}



.dark::-webkit-scrollbar-thumb:vertical {
background: var(--bgr1);
    border: solid 1px var(--border);
    box-shadow: 2px 2px 0 var(--shadow), inset 1px 1px 0 var(--highlight);
}

.dark::-webkit-scrollbar {
background: #262728;
}

::-webkit-scrollbar:active {
background: var(--bgr4);
}




textarea::-webkit-scrollbar-thumb:vertical {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}

textarea::-webkit-scrollbar {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;

border-top: none;
}



html {
}


body {
text-shadow: 1px 1px 0 var(--textshadow);
font-family: 'title', arial, sans-serif !important;
font-size: 18px !important;
line-height: 1.3 !important;
margin: 0;
text-align: center;
overflow-y: scroll;
font-variant-numeric: tabular-nums !important;
letter-spacing: 0.04em !important;
overflow-x: hidden;
background: var(--bgr2) !important;
color: var(--text) !important;
border-top: solid 1px var(--border);
box-shadow: inset 0 1px 0 var(--highlight);
//font-feature-settings: "ss01";
}

body {
border-top: solid 20px #2e2e2e;
}

h1 {
font-size: 46px;
font-weight: normal;
}

h1 span {
font-size: 20px;
display: block;
}

h2 {
font-size: 20px;
font-weight: normal;
}


a {
text-decoration: none;
color: var(--text);
}

.text a {
border-bottom: solid 1px;
}

.text a:hover {
opacity: 0.5;
}

#paper {
padding: 0 20px;
max-width: 602px;
margin: 0 auto;
box-sizing: content-box;
}

.block {
max-width: 100%;
margin: 48px auto;
box-sizing: content-box;
}

.time.button {
float: left;
margin-right: 12px;
text-overflow: unset;
padding: 0 18px;
margin-top: 24px;
}


@media all and (max-width: 430px) {
.time.button { display: none; }
}

.tag.button {
float: right;
margin-left: 24px;
text-overflow: unset;
padding: 0 18px;
margin-top: 24px;
}






.love.button {
text-overflow: unset;
padding: 0;
text-align: center;
width: 50px;
display: grid;
align-items: center;
text-align: center;
border: solid 1px var(--border);
box-shadow: 2px 2px 0 var(--shadow), inset 1px 1px 0 var(--highlight);
background: var(--bgr1);
float: left;
display: none;
margin-top: 24px;
}

.love.button:first-child {
display: grid;
}

.love.button:first-child img {
margin-top: 2px;
}

.love.button:hover {
background: var(--bgr2);
box-shadow: 1px 1px 0 var(--highlight), inset 1px 1px 0 var(--highlight);
}

.love.button:active {
background: var(--bgr4);
box-shadow: 1px 1px 0 var(--highlight), inset 2px 2px 0 var(--shadow);
}

.love.button img {
filter: drop-shadow( 1px 1px 0 var(--textshadow));
display: inline-block;
margin: 0 auto;
opacity: 0.78;
width: 40px;
}


.dark .love.button img {
opacity: 0.7; filter: invert(1) drop-shadow( 1px 1px 0 rgba(0,0,0,0.3)) !important;
}

.love.button img.loved {
display: none;
}


@media all and (max-width: 555px) {
.lovebuttons {
display: none;
}
}


@media all and (min-width: 631px) {

}

.lovebuttons:hover .love.button { display: grid; }
.lovebuttons:hover .love.button:first-child { display: none; }
.lovebuttons {
float: left;
margin-right: 0;
display: none;
}
.love.button {
margin-right: 12px;
}


/*
@media all and (min-width: 800px) {
.block:hover .love.button { display: grid; }
.block:hover .love.button:first-child { display: none; }
.sidecontainer .lovebuttons { display: none !important; }
.lovebuttons {
position: absolute !important;
width: 98px;
top: 50% !important;
left: -98px !important;
margin-top: -182px !important;
height: 290px;
padding: 0 24px;
display: grid;
align-items: center;
text-align: center;
grid-template-columns: minmax(0, 1fr);
row-gap: 12px;
}
.love.button {
margin-right: 0;
}
.love.button:first-child {
display: grid;
margin-top: 2px;
}
}
*/



.side.container .love.button {
display: none;
}



input[type="checkbox"]:checked + .love.button img.loved {
display: block;
}

input[type="checkbox"]:checked + .love.button img.notloved {
display: none !important;
}

input[type="checkbox"]:checked + .love.button:after {
content: "";
position: absolute;
}



.categorytitle {
color: var(--text);
float: right;
}

@media all and (max-width: 850px) {
.categorytitle { display: none !important; }
}


.bullets {
	background: transparent;
text-align: left;
font-size: 30px;
word-spacing: -0.2em;
color: #ccc;
display: block;
position: absolute;
z-index: 3;
margin-top: -28px;
pointer-events: none;
margin-left: 22px;
transform: translate(0, -24px);
display: block;
}


.bullets span {
display: inline-block; width: 7px; border-radius: 5px; background: rgba(255,255,255,0.28); height: 7px; margin: 2px;
}

.bullets span.current {
background: rgba(255,255,255,1) !important; ;
}




#secondary .navigation, #tertiary .navigation { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }



.sidebar {
position: absolute;
width: 50px;
}



@media all and (max-width: 799px) {


#paper {
padding: 0 24px !important;
}


.left.sidebar {
display: none;
}

.right.sidebar {
display: none;
}

}

@media all and (min-width: 800px) {


#topnavigation { position: static; }

.block {
position: relative;
}


.left.sidebar {
left: 0;
margin-left: 25px;
}

.right.sidebar {
right: 0;
margin-right: 25px;
}

}

@media all and (min-width: 1166px) {

.left.sidebar {
left: 50%;
margin-left: -550px;
}

.right.sidebar {
right: 50%;
margin-right: -550px;;
}

}




@media all and (max-width: 500px) {

#paper {
padding: 0 11px !important;
}

}






.sidebar span, .sidebar a {
text-overflow: unset;
width: 50px;
}




.logo.block {
padding: 50px 0;
padding-bottom: 44px;
}

.logo a {
display: block;
width: 75px;
margin: 0 auto;
}





.newpostsplakette {
    position: absolute;
    background: #000000cc;
background: #ff3535de;
    color: #fff;
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
    text-shadow: none;
    min-width: 32px;
	padding: 0 11px;
	margin-top: -15px;
    right: 0;
    margin-right: -12px;
	font-weight: normal;
	font-size: 19px;
}



.dark .newpostsplakette {
background: #0276c0;
background: #f9e06b;
background: #ff3535de;
color: #fff;
text-shadow: none;
-webkit-font-smoothing: auto;
}

.button {
display: block;
padding: 0 10px;
line-height: 46px;
height: 49px;
ppadding-bottom: 60px;
text-align: center;
font-size: 20px;
text-decoration: none;
color: var(--text);
cursor: pointer;
background: var(--bgr1);
border-radius: 5px;
border: solid 1px var(--border);
box-shadow: 2px 2px 0 var(--shadow), inset 1px 1px 0 var(--highlight);
text-overflow: ellipsis;
white-space: nowrap;
z-index: 2;
position: relative;
}

@media all and (max-width: 555px) {

.button {
line-height: 56px;
height: 59px;
}
}

.link.button {
text-align: center;
margin-top: 24px;
padding: 0 18px;
}




.play.button {
position: absolute;
width: 50px;
height: 50px;
line-height: 50px;
font-size: 16px;
padding-left: 19px;
padding-top: 1px;
text-overflow: unset;
border-radius: 50%;
left: 50%;
top: 50%;
margin-top: -25px;
margin-left: -25px;
pointer-events: none;
overflow: visible;
background: var(--input);
filter: invert();
box-shadow: none;
border: none;
}

.big.button {
height: 100px;
line-height: 100px;
}


.low.button {
background: var(--bgr2);
box-shadow: 1px 1px 0 var(--highlight), inset 1px 1px 0 var(--highlight);
position: relative;
top: 1px !important;
left: 1px !important;
overflow: hidden;
}

.small.button {
font-size: 18px;
line-height: 42px;
height: 44px;
z-index: 2;
}

.button:hover, label.button, input[type=submit][disabled=disabled], .button.inactive {
background: var(--bgr2);
box-shadow: 1px 1px 0 var(--highlight), inset 1px 1px 0 var(--highlight);
position: relative; top: 1px; left: 1px;
}


.button.inactive {
pointer-events: none;
opacity: 1;
color: var(--embossed);
}



input[type=submit][disabled=disabled] {
pointer-events: none;
color: var(--embossed);
}

input[type="checkbox"]:checked + label:after {
content: " ✓";
font-family: system-ui, title, sans-serif;
font-size: 12px;
position: relative;
top: -2px;
right: -6px;
}

.button:active, form .button:focus, .button.active, .low.button:hover, label.button:hover, input[type="checkbox"]:checked + label {
background: var(--bgr3);
box-shadow: 1px 1px 0 var(--highlight), inset 2px 2px 0 var(--shadow);
position: relative; top: 1px; left: 1px;
overflow: hidden;
}

.button.active:hover, .button:focus:hover, .highlighted.button:focus:hover, low.button:active, input[type="checkbox"]:checked + label:hover, label.button:active {
background: var(--bgr4);
box-shadow: 1px 1px 0 var(--highlight), inset 2px 2px 0 var(--shadow);
position: relative; top: 1px; left: 1px;
}


input[type="checkbox"]:checked + label:active, .button.active:active {
background: var(--bgr5);
box-shadow: 1px 1px 0 var(--highlight), inset 2px 2px 0 var(--shadow);
position: relative; top: 1px; left: 1px;
}

input[type="submit"] {
-webkit-appearance: none;
}


img {
position: relative;
display: block;
width: 100%;
border-radius: 5px;
}

object {
width: 100%;
height: 100%;
border-radius: 5px;
display: block;
}






.videowrapper {
display: table;
width: auto;
position: relative;
width: 100%;
background: var(--bgr3);
border-radius: 0;
overflow: hidden;
}



.image {
display: block;
width: 100%;
margin-bottom: 0;
padding-bottom: 0;
position: relative;
}

.image::before {
height: 20px;
content: "";
display: block;
background: var(--bgr1);
border: solid 1px var(--border);
box-shadow: inset 1px 1px 0 var(--highlight), 2px 2px 0 var(--shadow);
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.image video {
display: block;
width: 100%;
height: auto;
border-radius: 0;
object-fit: cover;
}


.imageborder {
border-radius: 0;
//background-image: url(https://www.designmadeingermany.de/ddig/files/loading.svg?1);
//background-position: center;
//background-repeat: no-repeat;
//background-size: 90px;
background-color: transparent;
box-shadow: 2px 2px 0 var(--shadow);
border-left: 1px solid rgb(179 181 182);
border-right: 1px solid rgb(179 181 182);
border-bottom: 1px solid rgb(179 181 182);
}



.image.only .imageborder {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}


.image.only .imagebackground {
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}


.pdfattachment .imageborder {
border-radius: 0;
border-bottom: 0 solid var(--border);
}

.dark .imageborder {
background-color: var(--bgr3);
border-left: 1px solid rgb(30 32 32);
border-right: 1px solid rgb(30 32 32);
border-bottom: 1px solid rgb(30 32 32);
}


.dark .imageborder {
background: var(--bgr3);
}

.imageborder {
background: var(--bgr3);
background-color: #1e1e1e;
}

.image.only .imageborder {
background: var(--bgr3);
}


.imagebackground {
border-radius: 2px;
}


@media all and (max-width: 799px) {

.billboard {
display: none;
}

.imageborder {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}

}


.imagebackground {
background-color: #262626;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 0;
position: relative;
overflow: hidden;
}


.pdfattachment .imageborder .imagebackground {
border-radius: 0;
}

.imagebackground .button img {
opacity: 1;
margin-top: 17px;
border-radius: 0px;
opacity: 1;
opacity: 0.88;
width: 12px;
margin-left: 2px;
}


.imagebackground:hover .button {
display: none !important;
}

.externallinkicon.button {
position: absolute;
width: 28px;
height: 28px;
line-height: 28px;
font-size: 9px;
padding-left: 11px;
padding-top: 1px;
text-overflow: unset;
border-radius: 50%;
right: 15px;
top: 36px;
pointer-events: none;
overflow: visible;
background: var(--input);
filter: invert();
box-shadow: none;
border: none;
display: none;
}


.image .button img {
opacity: 1;
margin-top: 17px;
border-radius: 0px;
opacity: 1;
opacity: 0.88;
width: 12px;
margin-left: 2px;
}

.dark .image .button img {
filter: invert(0);
}


.image .externallinkicon.button img {
margin-top: 8px;
width: 8px;
margin-left: 0px;
display: block;
transform: rotate(312deg);
}


.image:hover .imagebackground, .zoom .image:hover .imagebackground {
//background-color: var(--bgr4);
}

.image img {
display: block;
width: 100%;
height: auto;
opacity: 0;
border-radius: 4px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
}

.image img[alt]:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  content: attr(alt);
  content: "Bild konnte nicht geladen werden";
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}


.currentslide { display: block; }
.preloadslide { display: block !important; position: fixed; bottom: -10px; left: -10px; width: 1px; height: 1px; outline: solic 10px red; opacity: 0.1; }
.hiddenslide { display: none; }


.searchsubmit {

}


.suchform {
width: 100%;
}

.inputborder {
border-radius: 5px;
margin-bottom: 24px;
border: solid 1px var(--border);
box-shadow: 1px 1px 0 var(--highlight);
position: relative;
top: 1px;
left: 1px;
}


input[type=text], input[type=email], input[type=number], input[type=url], select {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-variant-numeric: tabular-nums;
}

input[type=text], input[type=email], input[type=number], input[type=url], textarea, select {
background: var(--input);
font-size: 20px;
font-family: 'title', arial, sans-serif;
letter-spacing: 0.03em;
text-align: center;
display: block;
border: none;
outline: none;
padding: 11px 12px;
padding-bottom: 12px;
border-radius: 4px;
box-shadow: inset 2px 2px 0 var(--shadow);
text-shadow: 1px 1px 0 var(--textshadow);
width: 100%;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
}



textarea {
height: 133px;
resize: none;
font-variant-numeric: tabular-nums;
}

.suchformxxxxxxx input.button {
color: transparent;
background-size: 24px;
background-position: center;
background-repeat: no-repeat;
text-shadow: none;
width: 50px;
text-shadow: 1px 1px 0 var(--textshadow);
}

.searchsubmit a.button {
width: 100%;
}

input[type=submit], button {
font-family: 'title', arial, sans-serif !important;
font-size: 20px;
line-height: 1.4;
cursor: pointer;
text-shadow: 1px 1px 0 var(--textshadow);
width: 100%;
letter-spacing: 0.03em !important;
}

input[type=text]::placeholder, input[type=email]::placeholder, input[type=url]::placeholder, textarea::placeholder {
color: var(--text);
}

input[type=text]:focus::placeholder, input[type=email]:focus::placeholder, input[type=url]:focus::placeholder, textarea:focus::placeholder {
color: var(--border);
text-shadow: none;
}

input[type=radio], input[type=checkbox] {
margin-right: 5px;
position: absolute;
left: -500px;
}


label {
width: 100%;
display: block;
}

.list {
border: solid 1px var(--border);
box-shadow: 1px 1px 0 var(--highlight);
border-radius: 5px;
overflow: hidden;
font-weight: normal;
position: relative;
min-height: 48px;
}


.eintrag {
padding: 10px 0;
display: block;
border-bottom: solid 1px var(--border);
box-shadow: inset 2px 0 0 var(--shadow), inset 0 1px 0 var(--highlight);
}

.eintrag:first-child {
box-shadow: inset 2px 2px 0 var(--shadow);
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}

.eintrag:last-child {
border-bottom: none;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
}

.bold.eintrag .title, .bold.button {
font-weight: bold;
}

.eintrag:visited .title, .eintrag:visited .subtitle, .eintrag.visited .title, .eintrag.visited .subtitle {
color: #8a8d90;
}

.eintrag:hover .title, .eintrag:hover .subtitle {
color: inherit;
color: var(--text);
}

.eintrag:hover {
display: block;
background: var(--bgr4);
box-shadow: inset 2px 0 0 var(--shadow), inset 0 2px 0 var(--shadow);
position: relative;
}

.eintrag:hover:active {
background: var(--bgr5);
}

.title {
font-size: 23px;
text-align: center;
display: block;
position: relative;
}

.heute.title:after {
content: " Heute";
color: var(--embossed);
float: right;
position: absolute;
right: 15px;
}

.eintrag:hover .heute.title:after {
color: var(--text);
}

.neon.datum {
color: var(--text);
}

a:visited .neon.datum {
text-shadow: none;
}


.subtitle {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
display: block;
text-align: center;
font-size: 18px;
}



.hidden {
display: none !important;
}

.toggle:hover .shown {
opacity: 0;
transition: opacity 600ms;
}

.toggle:hover .hidden {
opacity: 1;
transition: opacity 600ms;
}




.dark.list {
text-shadow: 1px 1px 0 var(--textshadow);
}


.title.block {
margin: -24px auto;
margin-bottom: 72px;
margin-top: 75px;
margin-bottom: 35px;
font-family: text, title, sans-serif;
letter-spacing: 0em;
cursor: default;

}



header {
padding: 24px 0px;
margin-bottom: 12px;
}


@media all and (max-width: 520px) {
header { margin-bottom: 36px;}
}


@media all and (max-width: 650px) {
.title.block {

}
}



.textfont {
font-family: text, title, sans-serif;
letter-spacing: 0em;
cursor: default;
}

.textfont a {
border: none;
text-decoration: underline;
}

.title.block h1 {
font-weight: bold;
letter-spacing: -0.005em;
line-height: 1.2;
margin-bottom: 0.2em;
font-size: 40px;
    width: 80%;
    margin: 0 auto;
    margin-top: -48px;
}


.title.block h2 {
font-size: 19px;
}



.socialmediaicons {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
justify-items: stretch;
column-gap: 24px;
row-gap: 24px;

}


@media all and (min-width:520px) {
.socialmediaicons { margin-bottom: -24px; }
}



@media all and (min-width: 421px) {
.socialmediaicons { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
}

@media all and (max-width: 420px) {
.socialmediaicons { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}


.icon {
display: grid;
align-items: center;
text-align: center;
padding: 0;
font-size: 18px;
}


.icon img {
filter: drop-shadow( 1px 1px 0 var(--textshadow));
opacity: 0.78;
width: 21px;
height: auto;
margin: 0 auto;
pointer-events: none;
}



@media all and (max-width: 555px) {



#darkmodetoggle { display: none; }

.navigation {
display: block !important;
margin-bottom: 24px;
}

.navigation .button {
    margin-bottom: 12px;
    line-height: 54px;
    height: 59px;
}

.fiftyone { margin-bottom: 24px; }
.fiftytwo { }

}


@media all and (min-width: 556px) {

.navigation {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
column-gap: 24px;
row-gap: 24px;
position: relative;
}

.fiftyone { width: 50%; float: right; padding-left: 12px; }
.fiftytwo { width: 50%; float: left; padding-right: 12px; }

}



.dark .icon img {
opacity: 1; filter: invert(1) drop-shadow( 1px 1px 0 rgba(0,0,0,0.3)) !important;
}




.filter { float: left; width: 33.33%; padding-right: 16px; box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 24px; }

.submitbutton { float: right; width: 66.66%; padding-left: 8px; box-sizing: border-box; }

@media all and (max-width: 650px) {
.filter { float: none; width: 100%; padding-right: 0; margin-bottom: 24px; }

.submitbutton { float: none; width: 100%; padding-left: 0; margin-bottom: 24px; }
}








.feat {
background-color: #edd87b !important;
border-bottom: solid 1px #c3c0b7;
box-shadow: inset 2px 2px 0 var(--shadow), inset 2px 2px 0 var(--shadow);
}




.feat:hover {
background-color: #f7dd6a !important;
box-shadow: inset 2px 2px 0 var(--shadow);
}


.feat:active {
background-color: #f7dd6a !important;
}



.feat.job.eintrag:visited {
color: #b9a446 !important;
}

.xxxxxxx.feat.job.eintrag:nth-child(even):visited {
color: #bba859 !important;
}

.feat.job.eintrag:visited:hover {
color: var(--text) !important;
}




@media (prefers-color-scheme: dark) {


.feat {
border-bottom: solid 1px #b4b1a7;
}


}







.dark .feat.job.eintrag {
background-color: #1d293a !important;
border-bottom: inherit;
box-shadow: inset 2px 2px var(--shadow), inset 2px 2px var(--shadow), inset 2px 2px var(--shadow);
}


.dark .feat.job.eintrag:hover {
background-color: #17212e !important;
box-shadow: inset 2px 2px 0 var(--shadow);
}

.dark .feat.job.eintrag:active {
background-color: var(--bgr5) !important;
}

.dark .feat.job.eintrag:visited {
color: #997e00 !important;
}

.dark .feat.job.eintrag:visited:hover {
color: #111 !important;
background-color: var(--bgr4);
box-shadow: inset 2px 2px 0 var(--shadow);
}


.eintrag { z-index: 1; position: relative; padding: 10px 12px; background: var(--bgr3); }
.job.eintrag { padding: 0 6px; }






.partner {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
column-gap: 3%;
row-gap: 6%;
padding-top: 7% !important;
padding: 12% 0 !important;
}

.partner a {
display: grid;
align-items: center;
text-align: center;
height: 150px;
width: 100%;
}

.partner a img {
display: block;
margin: auto;
width: 80%;
height: auto;
max-height: 50px;
border-radius: 0;
}

.partner a i {
display: none;
}











/* Ab hier oben einfügen */



:root {
--bgr1: #ffffff0d;
    --bgr2: #00000000;
    --bgr3: #00000008;
    --bgr4: #0000000f;
    --bgr5: #00000014;
    --border: rgb(0 0 0 / 8%);
    --highlight: rgb(255 255 255 / 28%);
    --shadow: rgb(0 0 0 / 2%);
    --text: rgb(0 0 0 / 75%);
    --embossed: rgb(0 0 0 / 17%);
    --textshadow: rgb(255 255 255 / 45%);
    --input: #fff;
    --neon: #ffb200;
}



body {
background-color: rgb(208 209 209) !important;
}

@media all and (min-width: 500px) {
body, .container .block {
background-attachment: fixed !important;
background-size: 100%;
}
}

.eintrag { background: transparent; }
.eintrag:hover { background: var(--bgr3); }
.eintrag:active { background: var(--bgr4); }

h1 { color: rgb(43 43 43); }

.logo img {

filter: contrast(0.63) drop-shadow( 1px 1px 0 #e5e6e6) !important;
opacity: 1 !important;


}



@media (prefers-color-scheme: light) {

:root {
--bgr1: #ffffff0d;
    --bgr2: #00000000;
    --bgr3: #00000008;
    --bgr4: #0000000f;
    --bgr5: #00000014;
    --border: rgb(0 0 0 / 8%);
    --highlight: rgb(255 255 255 / 28%);
    --shadow: rgb(0 0 0 / 2%);
    --text: rgb(0 0 0 / 75%);
    --embossed: rgb(0 0 0 / 17%);
    --textshadow: rgb(255 255 255 / 45%);
    --input: #fff;
    --neon: #ffb200;
}



body {
background-color: rgb(208 209 209) !important;
}

@media all and (min-width: 500px) {
body, .container .block {
background-attachment: fixed !important;
background-size: 100%;
}
}

.eintrag { background: transparent; }
.eintrag:hover { background: var(--bgr3); }
.eintrag:active { background: var(--bgr4); }

h1 { color: rgb(42 42 42); }

.logo img { opacity: 0.8; }

}



@media (prefers-color-scheme: dark) {

body {
border-top: solid 20px #262626;
}

::-webkit-scrollbar-thumb:vertical {
background: #262626;
}

::-webkit-scrollbar {
background: #bcbebf;
}


:root {
    --bgr1: #ffffff0d;
    --bgr2: #00000000;
    --bgr3: #00000008;
    --bgr4: #0000000f;
    --bgr5: #00000014;
    --border: rgb(0 0 0 / 9%);
    --highlight: rgb(255 255 255 / 18%);
    --shadow: rgb(0 0 0 / 2%);
    --text: rgb(0 0 0 / 75%);
    --embossed: rgb(0 0 0 / 17%);
    --textshadow: rgb(255 255 255 / 38%);
    --input: #fff;
    --neon: #ffb200;
}

body {
background-color: rgb(194 196 197) !important;
}


@media all and (min-width: 500px) {
body, .container .block {
background-attachment: fixed !important;
background-size: 100%;
}
}


.eintrag { background: transparent; }
.eintrag:hover { background: var(--bgr3); }
.eintrag:active { background: var(--bgr4); }

h1 { color: rgb(43 43 43); }

.logo img {
filter: drop-shadow( 1px 1px 0 var(--textshadow));
opacity: 0.78;
}




}




.dark {
	--bgr1: #ffffff07;
    --bgr2: #00000000;
    --bgr3: #0000001c;
    --bgr4: #00000030;
    --bgr5: #0000004d;
    --bgr6: #0000005e;
    --border: #00000051;
    --highlight: rgb(255 255 255 / 5%);
    --shadow: rgb(0 0 0 / 5%);
    --text: rgb(255 255 255);
    --embossed: rgb(255 255 255 / 10%);
    --textshadow: rgb(2 2 2 / 48%);
    --input: #fff;
    --neon: #ffb200;
    -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.dark {
background-color: rgb(42 44 45) !important;
border-top: solid 20px #262728;
box-shadow: inset 0 1px 0 var(--highlight);
}

@media all and (min-width: 500px) {
.dark, .dark .container .block {
}
}


.dark .logo img {
opacity: 1; filter: invert(1) drop-shadow( 1px 1px 0 rgba(0,0,0,0.3)) !important;
}

.dark h1 { color: rgb(255,255,255); }

.dark .eintrag:visited .title, .dark .eintrag:visited .subtitle, .dark .eintrag.visited .title, .dark .eintrag.visited .subtitle {
color: #5f6168 !important;
}

.dark .job.eintrag:visited {
color: #5f6168 !important;
}

.dark .job.eintrag:visited:hover {
color: var(--text) !important;
}




.highlighted.button {
padding: 0; background: #f4d85f; border-radius: 5px;
}



.highlighted.button:hover {
background: #f2da6e !important;
}
.highlighted.button:active {
background: #ebd15e !important;
}

.dark .highlighted.button:hover {
background: var(--bgr2) !important;
}
.dark .highlighted.button:active {
background: var(--bgr3) !important;
}



.blue.button {
color: #fff; text-shadow: none;
}

@media (prefers-color-scheme: light) {

.blue.button {
padding: 0; background: #edd87b; border-radius: 5px;
background: #0866cb;
}
.blue.button:hover {
background: #0f60b7;
}
.blue.button:active {
background: #105299;
}

.imageborder {
border-left: 1px solid rgb(194 195 196);
border-right: 1px solid rgb(194 195 196);
border-bottom: 1px solid rgb(194 195 196);
}


}

@media (prefers-color-scheme: dark) {


.blue.button {
padding: 0; background: #DBC061; border-radius: 5px;
}
.blue.button:hover {
background: #d7bc5e;
}
.blue.button:active {
background: #d3b85c;
}

}


.dark .highlighted.button {
    color: #111;
    text-shadow: none;
    -webkit-font-smoothing: auto;
background: #eccf46;
    text-shadow: 1px 1px 0 rgb(255 255 255 / 38%);
}



.dark .highlighted.button:hover {
background: #ddc243 !important;
}
.dark .highlighted.button:active {
background: #f9e06b !important;
}




@media all and (max-width: 650px) {
.mobilehide { display: none !important; }
}

@media all and (min-width: 651px) {
.deskhide { display: none !important; }
}






.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 0;
  bottom: 0;
touch-action: manipulation;
display: hidden !important;


//cursor: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' xmlns:v='https://vecta.io/nano'%3E%3Cpath d='M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z'/%3E%3C/svg%3E") 16 16, pointer;


//touch-action: none;
}



/* Position the "next button" to the right */
.next {
    right: 1px;
    left: 1px;
    top: 22px;
bottom: 74px;
    width: auto;
}
.prev {
  left: -100px; width: 0px;
}

.pdfslides .next {
top: -2px;
}

.prev .button, .next .button {
width: 50px;
height: 50px;
text-decoration: none;
position: absolute;
top: 50%;
margin-top: -35px;
left: 25px;
}

.next .button, .next .button:hover {
position: absolute;
left: auto;
right: -74px;
}


@media all and (max-width: 799px) {
.prev .button, .next .button { display: none; }
.prev {display: none;}
.next {left: 0px; right: 1px; width: auto; }

}


.slideshow-container {
position: relative;
}

.mySlides {
  display:none;
}
.active-slide {
  display:block !important;
}

.preload-slide {
display:block !important;
position: absolute; height: 1px; width: 1px; opacity: 0.1;
left: -5100px;
}


.dots {
text-align: center;
margin-top: -56px;
margin-left: 44px;
position: absolute;
z-index: 100;
pointer-events: none;
}

.dot {
cursor:pointer;
height: 7px;
width: 7px;
padding: 0;
margin-right: 1px;
border-radius: 50%;
display: inline-block;
//transition: background-color 0.3s ease;
//background-color: rgba(255,255,255,0.18) !important;
display: none;
text-shadow: none;
color: #fff;
font-size: 12px;
}

.dot.active {
top: 0;
left: 0;
//background-color: rgba(255,255,255,0.88) !important;
display: block;
}

.holder::before {
height: 20px;
content: "";
display: block;
background: var(--bgr1);
border: solid 1px var(--border);
box-shadow: 2px 2px 0 var(--shadow), inset 1px 1px 0 var(--highlight);
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.canvas-wrapper {
margin: 0 auto;
margin-bottom: 24px;
border-radius: 7px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
background-image: url(https://www.designmadeingermany.de/ddig/files/loading.svg?1);
background-position: center;
background-repeat: no-repeat;
background-size: 90px;
position: relative;
overflow: hidden;
display: none;
box-shadow: 2px 2px 0 var(--shadow);
border-left: 1px solid rgb(187 188 188);
border-right: 1px solid rgb(187 188 188);
border-bottom: 1px solid rgb(187 188 188);
background-color: #fff;
}


.dark .canvas-wrapper {
background-color: var(--bgr3);
border-left: 1px solid rgb(30 32 32);
border-right: 1px solid rgb(30 32 32);
border-bottom: 1px solid rgb(30 32 32);
}





canvas {
display: block;
border-radius: 5px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
width: 100%;
pointer-events: none;
}

.canvas-wrapper:first-child { display: block; }

.pdfslides { position: relative; }

.pdfattachment { margin-bottom: -48px; }

.button.nolink { top: 50%; margin-top: -25px; }




.vcard div.vkunde { width: 29.75%; }
.vcard div.vleistung { width: 51.3%; float: right; }
@media all and (max-width: 650px) { .vcard div.vleistung { display: none; } }



.vcard {
background-color: #272828;
overflow: hidden;
color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-shadow: none;
text-align: left;
padding: 3px 18px;
padding-right: 0;
padding-top: 9px;
border-bottom: solid 1px #333;
font-size: 18px;
color: #ffffff45;
}

.container .vcard {
margin-top: -1px;
}


.dark .vcard {
background-color: #252728;
}


.vcard div {
float: left;
text-overflow: hidden;
}

.vcard b {
font-weight: normal;
font-size: 14px;
display: block;
line-height: 2.15;
color: #6a6a6a;
}

.vcard a {
color: #6a6a6a;
display: block;
transition: color 600ms;
display: inline-block;
}

.vkunde a {
display: inline;
}


.vcard:hover, .vcard:hover a, .vcard a:hover {
color: #65c4ff;
transition: color 0ms;
}


.vcard:hover a:hover {
color: #fff;
transition: color 0ms;
}

.vcard div.vcard-namewrapper {
color: #fff;
}

.vcard span.vcard-telefon {
color: #fff;
}


.vcard:hover .vcard-name {
color: #65c4ff;
}

.vcard:hover .vcard-name:hover {
color: #fff;
}



.vcard div.vcard-standorte {
mmax-height: 95px;
overflow: hidden;
color: #fff;
margin-left: -18px;
margin-right: 18px;
margin-bottom: 7px;
line-height: 1.44;
}

.vcard-line {
height: 25px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 90%;
}



@media all and (min-width: 0px) {

.vcard div {
width: 40%;
}

.vbild { display: none;}

.vcard-standorte {
text-align: right;
}

.vcard div.vcard-namewrapper {

}

.vcard div.vcard-namewrapper .vcard-name {

    display: block;
}

.vcard div.vcard-namewrapper, .vcard div.vkunde {
width: 60%;
display: block;
}

.vcard div.vcard-kontakt {
display: none;
}

.vcard div.vcard-website {
display: none;
}

.vcard div.vcard-socialmedia {
display: none;
}

}


@media all and (min-width: 521px) {

.vcard div {
width: 21.6%;
}



.vcard-standorte {
text-align: right;
}


.vcard div.vcard-namewrapper, .vcard div.vkunde {
width: 40%;
display: block;
}

.vcard div.vcard-namewrapper .vcard-name {
margin-bottom: 0;
display: inline;
}

.vcard div.vcard-kontakt {
width: 38.3%;
display: block;
}

.vcard div.vcard-website {
display: none;
}

.vcard div.vcard-socialmedia {
display: none;
}

}

@media all and (min-width: 650px) {

.vcard div {
width: 14.5%;
display: block;
}


.vcard-standorte {
text-align: right;
}

.vcard div.vcard-namewrapper, .vcard div.vkunde {
width: 34.2%;
display: block;
}

.vcard div.vcard-kontakt {
width: 33.7%;
display: block;
}

.vcard div.vcard-socialmedia {
width: 16.5%;
display: block;
text-align: right;
padding-right: 18px;
line-height: 1.44;
}

.vcard div.vcard-website {
display: none;
}

}


@media all and (min-width: 800px) {

.vbild { display: block;}

}

@media all and (min-width: 1050px) {

.vcard div {
width: 12.5%;
display: block;
}

.vcard-standorte {
text-align: left;

}

.vcard div.vcard-namewrapper, .vcard div.vkunde {
width: 36.2%;
display: block;
}

.vcard div.vcard-kontakt {
width: 26.3%;
display: block;
}

.vcard div.vcard-website {
width: 12.5%;
display: block;
margin-bottom: 11px;
line-height: 1.44;
}

.vcard div.vcard-socialmedia {
width: 12.5%;
display: block;
}

}



@media all and (min-width: 521px) {

.vcard span.vcard-name {
font-size: 20px;
height: 28px;
font-weight: normal;
line-height: 1.2;
padding-bottom: 2px;
max-width: 85%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: inline-block;
}

}


.vcard span.vcard-rechtsform {
font-size: 11px;
font-style: normal;
line-height: 1.8;
display: block;
}

.list::before {
    height: 20px;
    content: "";
    display: block;
    background: var(--bgr1);
    border-bottom: solid 1px var(--border);
    box-shadow: inset 1px 1px 0 var(--highlight);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.jjob .vcard {
padding: 14px 18px; font-size: 17px;
transition: background-color 300ms, color 300ms;
border: none;
box-shadow: inset 0 1px 0 #333, inset 2px 0 0 #00000009;
position: relative;
}


.list .jjob:first-child .vcard {
box-shadow: inset 2px 2px 0 #00000009;
}

.jjob .vcard:hover {
background-color: #333;
color: #fff;
transition: background-color 0ms, color 0ms;
z-index: 999;
}

.dark .jjob .vcard {
box-shadow: inset 0 1px 0 #2e3031, inset 2px 0 0 #00000009;
}

.dark .jjob .vcard:hover {
background-color: #2e3031;
box-shadow: inset 0 1px 0 #2e3031, inset 2px 0 0 #00000009;
}

.jjob .vcard.highlighted {
background-color: #0076c0;
box-shadow: inset 0 1px 0 #008ae177, inset 2px 0 0 #00000009;
}

.jjob .vcard.highlighted:hover {
background-color: #008ae1;
box-shadow: 0 1px 0 #008ae1, inset 2px 0 0 #00000009;
z-index: 999;
}

.jjob .vcard b { line-height: 23px;}

.jjob .vcard span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
display: block;
font-size: 18px;
line-height: 1.1;
}

.jjob:visited .vcard div.jdate span {
color: #ffffff52 !important;
}

.jjob .jtitle {
color: #fff;
transition: color 300ms;
}


.jjob .vstadt {
color: #fff;
transition: color 300ms;
}

.jjob:visited .jtitle, a:visited .vstadt {
color: #5e5e5e;
}

.jjob:visited .highlighted .jtitle, .jjob:visited .highlighted .vstadt {
color: #ffffff9e;
}

.jjob:hover .jtitle, a:hover .vstadt {
color: #fff;
transition: color 0ms;
}

.jjob:hover .highlighted .jtitle, .jjob:hover .highlighted .vstadt {
color: #fff;
transition: color 0ms;
}


@media all and (min-width: 0px) {

.jjob .vcard { padding-left: 0; }
.jjob .vcard div.jdate { display: none; }
.jjob .vcard div.jstadt { float: right; text-align: right; width: 38%; padding-right: 0; padding-left: 18px; }
.jjob .vcard div.jname { width: 62%; padding-left: 18px; }
.jjob .vcard div.jarbeitgeber { float: right; width: 18%; text-align: right; display: none; }

}


@media all and (min-width: 651px) {

.jjob .vcard { padding-left: 0; }
.jjob .vcard div.jdate { display: none; }
.jjob .vcard div.jstadt { text-align: left; float: left; width: 27.5%; padding-right: 18px; padding-left: 18px; display: block; }
.jjob .vcard div.jname { width: 53.5%; display: block; }
.jjob .vcard div.jarbeitgeber { float: right; width: 18%; text-align: right; display: block; }

}

@media all and (min-width: 940px) {

.jjob .vcard { padding-left: 145px; }
.jjob .vcard div.jdate { position: absolute; margin-left: -125px; display: block; }
.jjob .vcard div.jstadt { float: right; width: 23.5%; padding-left: 18px; display: block; padding-right: 0; }
.jjob .vcard div.jname { width: 53.5%; display: block; padding-left: 0; padding-right: 18px; }
.jjob .vcard div.jarbeitgeber { float: right; width: 23%; text-align: left; display: block; }

}

.jjob .vcard { border-radius: 0px; }

#ddig h1 { font-size: 38px !important; }
#ddig h2 { font-size: 35px !important; }



@media all and (max-width: 520px) {

.vtitle .vcard-standorte { display: none; }
.vtitle { margin-top: -25px; }
body { border-top: none; box-shadow: none; }

::-webkit-scrollbar-thumb:vertical {
width: 9px;
}

::-webkit-scrollbar {
width: 9px;
height: 9px;
}

.block { margin: 24px auto; }

.searchfilter .block { margin: 48px auto; }

.dots { margin-top: 8px !important; }



#ddig h2 { font-size: 28px !important; margin-top: 7px; }



}



.artikel ol, .artikel ul, .artikel li {
margin: 0;
padding: 0;
text-align: left;
}

.artikel ul, .artikel ol {
letter-spacing: 0;
padding: 0 100px;
padding-top: 2em;
margin: 0 auto;
overflow: hidden;
cursor: auto;
}

.artikel ol {
list-style: decimal-leading-zero;
}

.artikel li {
margin-left: 18px;
padding-left: 10px;
margin-bottom: 0.5em;
}


.artikel {
background-color: #fff;
margin-top: -1px;
position: relative;
padding-bottom: 100px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
text-shadow: none;
font-family: 'Text', Sans-Serif;
letter-spacing: 0;
color: #222;
cursor: auto;
}


.artikel *::selection {
background: rgb(148 148 148 / 27%);
}

.dark .artikel {
color: #bbb;
}

.artikel a {
text-decoration: underline;
color: rgb(0 107 255);
}

.dark .artikel a {
color: #65c4ff;
}

.artikel.closed a {
color: #222;
text-decoration: none;
}

.dark .artikel.closed a {
color: #bbb;
}

.artikel a:hover {
color: #222;
}

.dark .artikel a:hover {
color: #fff;
}

.artikel p {
text-align: left;
cursor: default;
letter-spacing: 0;
padding: 0 100px;
padding-top: 2em;
margin: 0 auto;
overflow: hidden;
cursor: auto;
}


.artikel.closed p, .artikel.closed ul, .artikel.closed h3, .artikel.closed h4 {
display: none;
}

.artikel.closed p:nth-of-type(1) {
display: block;
pointer-events: none;
}

.artikel p b, .artikel p strong {
font-size: 19px;
}

.dark .artikel p b, .dark .artikel p strong {
color: #eee;
}

.artikel img {
margin: 1em 0;
}

.artikel h1, .artikel h2, .artikel h3 {
padding: 0 100px;
color: #222;
}

.dark .artikel h1, .dark .artikel h2, .dark .artikel h3 {
color: #eee;
}

.artikel h1 {
padding-top: 100px;
margin-bottom: 24px;
font-weight: bold;
letter-spacing: -0.01em;
font-size: 50px;
line-height: 1.1;
}

.artikel h2 {
font-weight: normal;
padding-bottom: 60px;
font-size: 25px;
line-height: 1.2;
}

.artikel h3 {
font-size: 24px;
line-height: 1.38;
text-align: left;
font-weight: normal;
padding-top: 2em;
}

.artikel h3 b {
font-size: 25px;
line-height: 1.3;
}

.weiterlesenbutton {
margin-top: 90px;
display: none;
cursor: pointer;
text-align: center;
}

.artikel.closed .weiterlesenbutton {
display: inline-block;
}

.weiterlesenbutton span {
background: #222;
border-radius: 5px;
padding: 10px 15px;
color: #fff;
}

.dark .weiterlesenbutton span {
background: #eee;
color: #262728;
-webkit-font-smoothing: auto;
}


@media all and (max-width: 699px) {
.artikel {
padding-bottom: 65px;
}
.artikel p {
padding: 0 24px;
padding-top: 1em;
}
.artikel h1 {
padding: 0 24px;
padding-top: 50px;
font-size: 38px;
margin-bottom: 48px;
}

.artikel h2 {
padding: 0 24px;
padding-bottom: 30px;
font-size: 19px;
font-weight: bold;
}

.artikel h3 {
padding: 0 24px;
padding-top: 1em;

}



.weiterlesenbutton {
margin-top: 48px;
display: none;
cursor: pointer;
text-align: center;
}

}


@media all and (max-width: 499px) {

.artikel {
padding-bottom: 24px;
}

.artikel p {
font-size: 16px;
}

.artikel p b, .artikel p strong {
font-size: 17px;
}

.artikel h1 {
padding-top: 24px;
font-size: 28px;
text-align: left;
margin-bottom: 24px;
}

.artikel h2 {
font-size: 19px;
text-align: left;
padding-bottom: 8px;
}

.artikel h3 {
font-size: 19px;
line-height: 1.38;
text-align: left;
font-weight: normal;
padding-top: 1em;
}

.artikel h3 b {
font-size: 19px;
line-height: 1.3;
}


.artikel.closed .weiterlesenbutton {
display: block;
margin: 10px 24px;
margin-top: 28px;
text-align: left;
}


}


.neuersuchsubmitbutton {
    position: absolute;
    display: block;
    margin-top: -44px;
    height: 44px;
    width: 44px !important;
    right: 2px;
    background-color: transparent;
    background-image: url(https://www.designmadeingermany.de/ddig/files/lupe.png?4) !important;
    background-size: 45px !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    color: transparent !important;
    text-shadow: none !important;
    border-radius: 6px;
}



@media all and (max-width: 555px) {
input[type=text], input[type=email], input[type=number], input[type=url], select {
padding: 15px 12px;
}
.neuersuchsubmitbutton {
margin-top: -53px;
height: 52px;
width: 50px !important;
right: 4px;
}
}




@media all and (max-width: 1122px) {

#paper {
max-width: 902px;
padding: 0 100px;
}


}

@media all and (min-width: 1123px) {

#paper {
max-width: 902px;
}

}



.jobloadinganimation {
display: none; width: 100%; margin-top: 215px; height: 2313px; background-image: url(https://www.designmadeingermany.de/ddig/files/loading.svg); background-repeat: no-repeat; background-position: center top; background-size: 55px; filter: drop-shadow( 1px 1px 0 var(--textshadow));
}

.dark .jobloadinganimation {
filter: invert(1) drop-shadow( 1px 1px 0 rgba(0,0,0,0.3));
}






.job {
height: 49px;
line-height: 49px;
text-align: left;
font-size: 19px !important;
overflow: hidden;
}

.job:hover {
    text-align: left;
}






.job span {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
overflow: hidden;
padding: 0 12px;
display: inline-block;
}








.job.eintrag:visited {
color: #929598 !important;
}

.job.eintrag:visited:hover {
color: var(--text) !important;
}



@media all and (max-width: 817px) {
.job span { width: auto; }
span.jobtime { width: 100px; float: left; text-align: left; padding-right: 0; text-overflow: unset; }
span.jobtitle { width: calc(100% - 270px); text-overflow: ellipsis; text-align: left; }
span.jobstadt { width: 170px; float: right; padding: 0 12px; text-align: right; }
span.arbeitgeber { display: none; width: 170px; float: right; padding: 0 12px; text-align: right; }
}


@media all and (min-width: 818px) {
span.jobtime { width: 100px; float: left; text-align: left; padding-right: 0; text-overflow: unset; }
span.jobtitle { width: calc(100% - 460px); float: left; text-overflow: ellipsis; }
span.jobstadt { width: 180px; float: right; }
span.arbeitgeber { width: 180px; float: right; padding: 0 12px;  text-align: right; }
}


@media all and (max-width: 717px) {
.job span { width: auto; }
span.jobtime { width: 100px; float: left; text-align: left; padding-right: 0; text-overflow: unset; }
span.jobtitle { width: calc(100% - 100px) !important; text-overflow: ellipsis; text-align: center !important; }
span.jobstadt { display: none; float: right; padding: 0 12px; text-align: right; }
span.arbeitgeber { display: none; width: 170px; float: right; padding: 0 12px; text-align: right; }
}




@media all and (max-width: 555px) {

.job {
height: auto;
padding: 16px 0 !important;
padding-bottom: 10px !important;
line-height: 23px;
text-align: left;
}

span.jobtime { display: none !important; }

span.jobtitle {
text-overflow: ellipsis;
text-align: center !important;
font-size: 23px !important;
width: 100% !important;
}

span.jobstadt {
width: 100% !important;
padding: 0 12px !important;
text-align: center !important;
font-size: 17px !important;
float: none !important;
display: block !important;
}

}








.list { min-height: 70px; }


@media (prefers-color-scheme: light) {
.eintrag {
background: var(--bgr3);
position: relative;
z-index: 1;
}
.eintrag:hover {
background: var(--bgr4);
}
}



@media (prefers-color-scheme: dark) {
    .eintrag {
        background: var(--bgr3);
    }
    .eintrag:hover {
        background: var(--bgr4);
    }
}




span.arbeitgeber {
text-align: left;
}

.eintrag:first-child {
border-top-left-radius: 0;
border-top-right-radius: 0;
}

.jobtime span {
background: rgba(0,0,0,0.03);
    display: inline-block;
    width: auto;
    padding: 0;
    border-radius: 5px;
    width: 82px;
    text-align: center;
    top: 7px;
    position: relative;
    line-height: 1.6;
    padding-top: 1px;
    padding-bottom: 2px;
    left: -10px;
padding-left: 5px;

}

.jobtime span.heute {
background: rgb(236 216 123);
color: rgb(61 59 46);
box-shadow: 1px 1px 0 #0000000d;
padding-left: 0;
}

.dark .jobtime span.heute {
box-shadow: 1px 1px 0 rgb(27 28 29);
}

.feat.job.eintrag:hover span.heute {
box-shadow: 2px 2px 0 #bfbfbf;
}


.feat .jobtime span {
box-shadow: 1px 1px 0 rgb(4 3 3 / 9%), -1px -1px 0 var(--highlight);
}

.dark .feat .jobtime span {
box-shadow: 1px 1px 0 rgb(4 3 3 / 29%), -1px -1px 0 var(--highlight);
}

.dark .feat:hover .jobtime span {
color: #111 !important;
}







.dark .jobtime span.heute, .dark .feat.job.eintrag {
    background: #eccf46 !important;
    color: #111;
    text-shadow: none;
    -webkit-font-smoothing: auto;
 text-shadow: 1px 1px 0 rgb(255 255 255 / 38%);
}

.dark .jobtime span {
background: rgb(0 0 0 / 15%);
}

.dark .feat.job.eintrag:hover {
background-color: #ddc243 !important;
}


.highlighted.button {
background: #f9e06b;
}

.dark a {
color: #ccc;
}
.dark a:hover {
color: #fff;
}

.dark a:hover .jobtime span.heute {
color: #ddd !important;
}

.dark a:hover .jobtime span {
color: #ddd !important;
}






.nobefore::before{display:none;}
.blackhovercolor:hover{color:var(--text) !important;}
.dark .blackhovercolor {color: rgb(229 229 229) !important;}
.dark .blackhovercolor:hover{color:var(--text) !important;}


.galerie {
display: grid;
grid-template-columns: minmax(0, 1fr);
column-gap: 24px;
row-gap: 0;
margin-bottom: 0;
}

#swlcontent .galerie { row-gap: 12px; }


@media (min-width: 639px) {
.galerie {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
}

@media (min-width: 970px) {
.galerie {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
}


#next { display: none; }


#dwl { margin-bottom: 26px; }



#dwl .image.nobefore {
margin-bottom: 24px;
}


#dwl .image img { opacity: 0; position: absolute; width: 100%; height: 100%;  }



#dwl .image a.imagelink { box-shadow: 2px 2px 0 var(--shadow); display: block; border-radius: 5px; }

#dwl .imageborder, #dwl .imagebackground, #dwl .imagebackground img {
border-radius: 5px;
}



#dwl .imageborder {
border: 1px solid #b6b8b9;
background-color: #262626;
box-shadow: inset 1px 1px 0 #ffffff78;
border-radius: 6px;
}

.dark #dwl .imageborder {
border: 1px solid #1e2020;
}



#dwl .galerie a .imagebackground {
background-color: transparent;
opacity: 0.9;
transition: opacity 500ms;
position: relative;
filter: brightness(1);
}



#dwl .galerie a:hover .imagebackground {
opacity: 1;
transition: opacity 0ms;
filter: brightness(1);
}

.imagebar {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr)  minmax(0, 1fr)  minmax(0, 1fr);
column-gap: 24px;
    row-gap: 24px;
    padding: 24px 0;
    padding-bottom: 24px;
}

.imagebar a, .imagebar span {
width: auto;
display: inline-block;
float: right;
padding: 0 15px;
border-radius: 5px;
font-size: 18px;
height: 42px;
line-height: 37.5px;
color: var(--text);
}




.image-grid__item { width: 31.5%; float: left; }


.sourcebutton {
grid-column: 5 / 1;
}

.autorbutton {
grid-column: 1 / -1;
}

.autorbutton {
text-align: left;
}

.adminbutton {
    overflow: visible !important;
    white-space: break-spaces;
    text-align: center;
    padding: 0 !important;
    margin: 0 !important;
    height: 38.5px !important;
    line-height: 37.5px !important;
}

.imagebar a.autorbutton, .imagebar span {
float: left;
}




.firstthumbbbbb time {
background: #fa4e4b;
    text-shadow: none;
    color: #fff;
    padding: 2px 10px;
    border-radius: 14px;
    margin-right: -12px;
    margin-left: -12px;
    margin-top: -2px;
    margin-bottom: -2px;
min-height: 23px;
}


.transparentbgr {
    background-image: linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff), linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);
    background-color: #e0e0e0 !important;
    background-size: 21px 21px;
    background-position: 0 0, 10px 10px;
background-repeat: repeat;
padding-bottom: 100%;
}


#dwl .image .like.button {
width: 100%;
height: 42px;
grid-column: 1 / 1;
display: block;
    overflow: visible !important;
    white-space: break-spaces;
    text-align: center;
    padding: 0 !important;
    margin: 0 !important;
line-height: 38.5px;
border-radius: 5px;
}

#dwl .image .like.button:nth-child(1) {
grid-column: 3 / 1;
}


#dwl .image .like.button:nth-child(2) {
grid-column: 3 / -1;
}



#dwl .image .like.button.inactive {
cursor: not-allowed;
}




#dwl .image .like.button.active img {

}

#dwl .image .like.button img {
filter: contrast(55%) drop-shadow(1px 1px 0 var(--textshadow));
width: 20px;
position: static;
margin: 0 auto;
opacity: 1;
}

.dark #dwl .image .like.button img {
filter: contrast(80%) invert(1) drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.3)) !important;
}

#dwl .active { pointer-events: none; }



#dwl .galerie a .imageborder,
#dwl .galerie a .imagebackground {
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}

.image a .button {
font-size: 18px; height: 43px !important;
    line-height: 41px !important;
border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
box-shadow: inset 1px 1px 0 var(--highlight);
    padding: 0 16px;
    overflow: hidden;
}

.image a .button:hover {
top: 0; left: 0;
}

#dwl .image a.imagelink { border-radius: 5px !important; }

#dwl .image a.imagelink:hover {
box-shadow: 1px 1px 0 var(--highlight);
}

#dwl .image a.imagelink:hover .button {
background-color: var(--bgr2);
}

#dwl .image a.imagelink:active .button {
background-color: var(--bgr3);
box-shadow: inset 2px 2px 0 var(--shadow);
}




.confirmbox {
    margin: 48px 0;
	margin-top: 0;
    font-family: text, title, sans-serif;
    letter-spacing: 0em;
    border: solid 1px var(--border);
    border-radius: 5px;
    background-color: #b7d1b7;
    overflow: hidden;
    padding: 33px;
    box-shadow: 1px 1px 0 var(--highlight), inset 2px 2px 0 var(--shadow);
    text-align: center;
    box-sizing: content-box;
}

.dark .confirmbox {
background-color: var(--bgr3);
}

.confirmbox h3 { font-size: 25px; }
.confirmbox h4 {font-weight: normal; font-size: 20px; margin-top: 3px; }