
/* Fonts */
@font-face {
    font-family: 'tgbold';
    src: url('./fonts/texgyreheros-bold-webfont.woff2') format('woff2'),
         url('./fonts/texgyreheros-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'tgregular';
    src: url('./fonts/texgyreheros-regular-webfont.woff2') format('woff2'),
         url('./fonts/texgyreheros-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


/* Basics */
i, textarea								{-webkit-transition: 0s; transition: 0s;}
*::-moz-selection						{color: #FFE209; background-color: #FF0078;}
*::selection							{color: #FFE209; background-color: #FF0078;}
.clear									{float: none; clear: both;}
a										{text-decoration: none; color: inherit; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
a:hover									{cursor: pointer;}
.fly									{opacity: 0; transition: all 600ms ease-in-out; transform: translateY(100px) scale(0.9) translate3d(0, 0, 0);}
.show-block								{opacity: 1; transform: translateY(0) scale(1) translate3d(0, 0, 0);}

/* Inhalt */
html									{font-family:"tgregular";}

.desktop								{display: block;}
.tablet									{display: none;}
.tabletB								{display: none;}
.mobile									{display: none;}
.nomobile								{display: block;}

nav										{width: 1200px; max-width: 90%; margin: auto; padding: 30px 0px;}
nav .logo								{float: left; height: 60px;}
nav .logo img							{height: 60px;}
nav .menu								{float: right; line-height: 60px;}
nav .menu a								{font-family:"tgbold"; border-radius: 30px; background-color: #FF0078; color: #FFE209; padding: 10px 20px;}
nav .menu a:hover						{padding: 10px 25px;}

header									{}
header img								{width: 100%; box-shadow: 0px 0px 10px #e6e6e6;}

article									{padding: 100px 0px;}
article article							{padding: 0px;}
article.gr								{background-color: #f8f8f8; box-shadow: 0px 0px 10px #e6e6e6;}
article.spl								{background-image: url('img/splash-bg-min.png'); background-size: cover; background-position: top; background-attachment: fixed;}

article .txt							{width: 700px; max-width: 90%; margin: auto;}
article .txt.wide						{width: 1200px; max-width: 90%;}
article .txt h1							{font-family:"tgbold"; line-height: 1.5em; font-size: 3em; color: #FF0078; margin-bottom: 20px; text-align: left;}
article .txt h2							{font-family:"tgbold"; line-height: 1.5em; font-size: 3em; color: #FF0078; margin-bottom: 30px; text-align: center;}
article .txt h3							{font-family:"tgbold"; line-height: 1.5em; font-size: 1.5em; color: #FF0078; margin-bottom: 10px; text-align: left;}
article .txt b							{font-family:"tgbold";}
article .txt p							{font-family:"tgbold"; line-height: 1.5em; font-size: 1.25em; color: #000000; margin-bottom: 1em;}
article .txt p.light					{font-family:"tgregular";}
article .txt p.small					{font-size: smaller;}
article .txt a							{color: #FF0078;}
article .txt a.cta						{border-radius: 30px; background-color: #FF0078; color: #FFE209; padding: 10px 20px;}
article .txt a.cta:hover				{padding: 10px 25px;}
article .txt a span						{text-transform: uppercase; font-size: 0.65em;}

article .news							{display: block; margin-bottom: 30px; padding: 25px; color: inherit;}
article .news:hover						{background-color: #f8f8f8;}
article .news .img						{width: 20%; float: left;}
article .news .img img					{width: 100%;}
article .news .text						{width: 80%; float: right;}
article .news .text .pad				{padding: 0px 15px;}
article .news .text h3					{font-family:"tgbold"; line-height: 1.25em; font-size: 1.55em; color: #FF0078; margin-bottom: 15px; text-align: left;}
article .news .text .datum				{font-family:"tgbold"; line-height: 1.25em; font-size: 1em; color: #000000; margin-bottom: 5px;}
article .news .text p					{font-family:"tgregular"; margin-bottom: 0px;}
article .news.full						{margin-bottom: 10px; text-align: center;}
article .news.full .text				{width: 100%; float: none; clear: both;}
article .news.full .text h3				{margin-bottom: 10px; text-align: center;}

article .termin							{display: block; text-align: center; margin-bottom: 10px; padding: 25px; color: inherit;}
article .termin:hover					{background-color: #f8f8f8;}
article .termin .infos					{width: 100%;}
article .termin .infos .infinf			{width: 100%;}
article .termin .bild					{display: none;}
article .termin .titel					{font-family:"tgbold"; text-align: center; line-height: 1.25em; font-size: 1.55em; color: #FF0078; margin-bottom: 15px;}
article .termin .datum					{font-family:"tgbold"; text-align: center; line-height: 1.25em; font-size: 1em; color: #000000; margin-bottom: 5px;}

article .icons							{text-align: center;}
article .icons a						{font-size: 6em; font-family:"tgbold";}
article .icons a:hover					{color: #000000;}

article .ctaD							{margin: 50px 0px; width: 100%; text-align: center;}
article .ctaD a							{display: inline-block; font-family:"tgbold"; font-size: 1.5em; border-radius: 30px; background-color: #FF0078; color: #FFE209; padding: 10px 20px;}
article .ctaD a:hover					{padding: 10px 25px;}

article .part							{}
article .part .img						{float: left; width: 50%;}
article .part .img img					{width: 100%;}
article .part .txt						{float: right; width: 50%;}
article .part .pad						{padding: 25px;}

article .videoholder					{padding: 15px; background-color: #ffffff;}

.image-gallery							{width: 1200px; max-width: 90%; display: flex; flex-wrap: wrap; justify-content: center; gap: 75px; margin: auto;}
.image-item								{flex: 1 1 15%; max-width: 15%;}
.image-item img							{width: 100%; height: auto; display: block;}

.kandidaten								{display: flex; flex-wrap: wrap; justify-content: center; gap: 25px;}
.kandidaten .kandidat					{width: 190px; padding: 15px; background-color: #ffffff; text-align: center;}
.kandidaten .kandidat .img				{width: 100%; height: 200px; background-size: cover; margin-bottom: 15px; background-position: center;}
.kandidaten .kandidat .name				{font-family:"tgbold"; line-height: 1.5em; font-size: 1.25em; margin-bottom: 15px;}
.kandidaten .kandidat .direkt			{line-height: 1.5em; font-size: 1em; margin-bottom: 15px;}
.kandidaten .kandidat .liste			{line-height: 1.5em; font-size: 1em; margin-bottom: 5px;}
.kandidaten .kandidat .links			{line-height: 1.5em; font-size: 1.25em;}
.kandidaten .kandidat .links a			{font-family:"tgbold"; color: #FF0078; font-size: 1.5em;}
.kandidaten .kandidat .links a:hover	{color: #000000;}

footer									{padding-top: 100px;}
footer .cta								{float: right; text-align: right; padding: 0px 75px 75px 0px;}
footer .cta a							{font-family:"tgbold"; border-radius: 30px; background-color: #FF0078; color: #FFE209; padding: 10px 20px;}
footer .cta a:hover						{padding: 10px 25px;}
footer .txt								{float: left; text-align: left; padding: 0px 0px 75px 75px; color: #acacac;}
footer .txt a							{margin-left: 10px;}
footer .txt a:hover						{color: #000000;}


/* Responsive (Portrait) */
@media (max-width: 1375px) {
.image-gallery							{gap: 50px;}
}
@media (max-width: 1250px) {
.desktop								{display: none;}
.tablet									{display: block;}
.tabletB								{display: none;}
.mobile									{display: none;}

}
@media (max-width: 1050px) {
.image-item								{flex: 30%; max-width: 30%;}
article.spl								{background-attachment: scroll;}
}
@media (max-width: 750px) {
article									{padding: 50px 0px;}

/*article.spl								{background-attachment: scroll;}*/
.kandidaten .kandidat					{display:none;}
.kandidaten .kandidat:nth-child(-n+6)	{display:block;}

.desktop								{display: none;}
.tablet									{display: none;}
.tabletB								{display: block;}
.mobile									{display: none;}

article .txt h1							{font-size: 2em; margin-bottom: 12px;}
article .txt h2							{font-size: 2em; margin-bottom: 20px;}
article .txt h3							{font-size: 1.25em; margin-bottom: 10px;}
article .news .text h3					{font-size: 1.25em; margin-bottom: 10px;}
article .termin .titel					{font-size: 1.25em; margin-bottom: 10px;}
article .termin .datum					{font-size: 1em; margin-bottom: 1em;}
article .txt p							{font-size: 1em; margin-bottom: 1em;}
article .icons a						{font-size: 4.5em;}

article .termin							{margin-bottom: 0px;}

article .ctaD							{margin: 20px 0px;}

footer .cta								{float: none; text-align: center; padding: 10px; margin-bottom: 20px;}
footer .txt								{float: none; text-align: center; padding: 10px;}
footer .txt a							{margin: 10px;}
}
@media (max-width: 650px) {
article .part .img						{float: none; width: 100%;}
article .part .txt						{float: none; width: 100%;}
article .part .pad						{padding: 25px 0px;}
}
@media (max-width: 600px) {
.desktop								{display: none;}
.tablet									{display: none;}
.tabletB								{display: none;}
.mobile									{display: block;}
.nomobile								{display: none;}

.image-gallery							{width: 90%; max-width: 300px;}
.image-item								{flex: 80%; max-width: 80%;}
}
@media (max-width: 550px) {
.kandidaten .kandidat					{width: 250px;}
.kandidaten .kandidat .img				{height: 250px;}
}


/* Responsive (Landscape) */
@media screen and (max-width: 855px) and (orientation: landscape) {

}

/* Druckansicht */
@media print {

}
