/* @override 
	http://www.ev-akademie-thueringen.de/workspace/css/screen.css?* */



@charset 'utf-8';

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */

a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none}html{overflow-y:scroll}body{background-color:#fff}b,strong{font-weight:700}em,i{font-style:italic}h1,h2,h3,h4,h5,h6{font-weight:400}.ie7 address{font-style:normal}.hideme{position:absolute;left:-999em;top:-999em}button,input[type=button],input[type=submit],label{cursor:pointer}q:lang(de){quotes:'„' '“' '‚' '‘'}q:lang(en){quotes:'“' '”' "‘" "’"}abbr[title]{border-bottom:1px dotted #888!important;cursor:help}a abbr{cursor:pointer!important}.clearfix:after{clear:both;content:".";display:block;height:0;visibility:hidden}* html .clearfix{height:1%}.clearfix{display:block}img{-ms-interpolation-mode:bicubic}

/* 

      :::::::::::::       :::::::::::::::::::
      ::::::::::::         ::::::::::::::::::
      :::::::::::           :::::::::::::::::
      ::::::::::             :::::::::
      ::::::::::::::::        ::::::::
      :::::::::::::::::        :::::::
      :::::::                   ::::::
      ::::::                     :::::
      :::::::::::::::::::.        ::::
      ::::::::::::::::::::.        :::
      
      Evangelische Akademie Thüringen      

*/

@font-face {
font-family: 'Profile';
src: url("../fonts/ProfileWeb-Light.woff") format("woff");
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Profile';
src: url("../fonts/ProfileWeb-Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
}

@font-face {
font-family: 'Profile';
src: url("../fonts/ProfileWeb-LightItalic.woff") format("woff");
font-weight: normal;
font-style: italic;
}

@font-face {
font-family: 'Profile';
src: url("../fonts/ProfileWeb-BoldItalic.woff") format("woff");
font-weight: bold;
font-style: italic;
}

/* Safari Medievalziffern für Light m( */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) {@media{
  @font-face {
  font-family: 'Profile';
  src: url("../fonts/ProfileScWeb-Light.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  unicode-range: U+30-39;
  }
}}





a,
input[type=submit],
.flickity-prev-next-button .arrow,
span.dok,
ul.startthemen li a img,
ul.publikationen li > a:hover,
ul.publikationen li > a.leer,
a *,
button,
svg g.logo {
-webkit-transition: all 250ms ease-in;
-moz-transition: all 250ms ease-in;
transition: all 250ms ease-in;
}

::selection {
background: rgb(250,200,30);
color: white;
}

::-moz-selection {
background: rgb(250,200,30);
color: white;
}

img {
-moz-user-select: text;
-webkit-user-select: text;
user-select: text;
-moz-user-drag: none;
-webkit-user-drag: none;
user-drag: none;
}

.klar {
clear: both;
}

body,
input {
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: none;
font-family: 'Profile', Candara, Verdana;
font-size: 16px;
line-height: 20px;
font-variant: oldstyle-nums common-ligatures;
-webkit-font-variant-numeric: oldstyle-nums common-ligatures;
-moz-font-feature-settings: "liga=1, onum";
-ms-font-feature-settings: "liga", "onum";
-webkit-font-feature-settings: "liga", "onum";
font-feature-settings: "liga", "onum";
-webkit-hyphenate-limit-before: 4;
-webkit-hyphenate-limit-after: 4;
-ms-hyphenate-limit-chars: 8 4 4;
hyphenate-limit-chars: 8 4 4;
-webkit-hyphenate-limit-lines: 4;
-ms-hyphenate-limit-lines: 4;
hyphenate-limit-lines: 4;
}

body {
background-color: rgb(240,240,240);
background-image: url('../img/grauweiss.png');
background-size: 100%;
image-rendering: -moz-crisp-edges;         /* Firefox */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: crisp-edges;
-ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
}

body.start {
background: white;
}

.start section {
position: relative;
margin: 29px auto;
}

header div, section, #social {
width: 1044px;
margin: 0 auto;
}

header {
position: relative;
display: block;
box-sizing: border-box;
background: white;
box-shadow: 0 0 24px rgba(0,0,0,0.2);
z-index: 100;
}

header h1 {
display: inline-block;
width: 848px;
}

h1 span {
display: none;
}

h1 a {
display: inline-block;
width: 252px;
height: 54px;
border-width: 8px 8px 6px 8px;
border-style: solid;
border-color: transparent;
margin: 16px 0 14px -8px;
}

h1 a:hover {
background: white;
border-color: white;
/* box-shadow: 0 0 16px rgba(0,0,0,0.1); */
}

h1 a svg {
width: 252px;
height: 54px;
}

h1 a svg g.logo {
fill: rgb(250,200,30);
}

h1 a:hover svg g.logo {
fill: rgb(210,170,30);
}

header form {
position: relative;
display: inline-block;
vertical-align: bottom;
width: 196px;
margin: 0 0 24px 0;
padding: 0;
}

header form label {
width: 100%;
}

header form input {
background: rgb(240,240,240);
border-radius: 2px;
border: none;
box-sizing: border-box;
margin: 0;
padding: 0;
}

header form input[type=text] {
width: 100%;
height: 24px;
padding-left: 28px;
color: rgb(43,41,44);
}

header form input[type=text]:focus {
background-color: rgb(250,200,30);
outline: none;
}

header form input[type=submit] {
position: absolute;
top: 0;
left: 0;
width: 24px;
height: 24px;
font-size: 0;
line-height: 0;
background-color: rgb(250,200,30);
background-image: url('../img/suche.svg');
}

header form input[type=submit]:hover {
background-color: rgb(240,240,240);
}

header form label span {
display: none;
}

nav,
article,
div.text,
div.quader,
article aside {
display: inline-block;
vertical-align: top;
}

nav {
position: relative;
width: 204px;
padding: 56px 0 64px 0;
box-sizing: border-box;
z-index: 10;
}

a.navon,
a.navoff,
svg.navicon {
display: none;
}

.start nav {
display: block;
}

.start nav svg.navicon {
display: none;
}

nav > ul {
float: right;
box-sizing: border-box;
}

.start nav > ul {
float: none;
}

nav > ul.main {
width: 188px;
margin: 0 16px 0 0;
}

nav > ul.main.aktiv {
height: 1044px;
}

.start nav > ul.main {
width: 196px;
min-height: 196px;
border-top: 1px solid rgb(240,180,0);
padding: 12px 0 0 0;
}

.start nav ul li.aktiv ul {
width: 196px;
font-weight: normal;
padding: 0;
margin: 0 0 8px 0;
border: none;
}

.start nav ul li.aktiv ul a {
font-weight: normal;
}

nav > ul.footer {
width: 188px;
margin: 0 16px 0 0;
clear: both;
}

.start nav > ul.footer {
position: relative;
width: 196px;
height: 196px;
/* background: yellow; */
}

.start nav > ul.footer li,
.start nav > ul.footer li:first-child {
border-top: none;
}

nav > ul.footer li:first-child,
.start nav > ul.footer {
padding-top: 12px;
}

nav > ul.footer li:first-child {
border-top: 2px solid rgba(0,0,0,0.1);
}

.start nav > ul.footer {
border-top: 1px solid rgb(43,41,44);
}

nav > ul.footer li.aktiv:first-child {
border-top-color: transparent;
}

/* Fußnavi an die Hauptnavi klemmen wenn der Schirm nicht hoch genug ist */
@media only screen and (min-height: 1024px) and (min-width: 875px) {
  nav > ul.main {
  margin-bottom: 160px;
  }
  nav > ul.footer {
  position: fixed;
  bottom: 16px;
  }
  nav > ul.footer li:first-child {
  border-top: 1px solid rgb(43,41,44);
  }
}

nav > ul.main > li  {
border-top: 1px solid black;
}

nav > ul.main > li > a.sub,
nav > ul.main > li > a {
padding: 12px 0;
display: block;
}

.start nav > ul.main > li > a.sub,
.start nav > ul.main > li > a {
padding: 0;
}

nav > ul.main > li > a.sub,
.js nav > ul.main > li.aktiv > a.sub {
font-style: italic;
font-weight: bold;
pointer-events: none;
}

.js nav > ul.main > li > a.sub {
font-style: normal;
font-weight: normal;
pointer-events: all;
}

.js nav > ul.main > li.aktiv > a.sub.aktiv {
font-style: normal;
font-weight: bold;
pointer-events: all;
}

nav > ul.main > li > a:active {
font-weight: bold;
}

nav > ul.main > li.aktiv > a {
padding: 0;
}

.start nav > ul.main > li,
.start nav > ul.main > li.aktiv {
border-top: none;
padding: 0 0 4px 0;
}

nav > ul.footer > li a {
display: block;
}

nav > ul.footer > li {
margin: 0 0 8px 0;
}

.start nav > ul.footer > li {
margin: 0;
padding: 0 0 4px 0;
}

nav > ul.main > li:first-child  {
border-top: none;
}

nav ul h3 {
font-style: italic;
border-top: 1px solid rgba(0,0,0,.2);
padding-top: 4px;
margin-top: 4px;
}

nav ul li a {
color: black;
}

nav > ul.footer > li a {
color: rgb(43,41,44);
}

nav ul ul li.aktiv > a,
nav ul a:hover,
nav > ul.footer > li a:hover {
color: rgb(240,180,0);
}

nav ul li > a.aktiv {
font-weight: bold;
font-style: normal;
}

nav ul ul li {
margin: 4px 0 0 0;
padding-left: 12px;
text-indent: -12px;
}

nav ul ul li:before {
content: '› ';
display: block;
float: left;
width: 10px;
margin-left: 2px;
color: black;
}

.js nav ul li ul,
.js nav ul li h3 {
display: none;
}

nav > ul > li.aktiv,
nav ul li.aktiv ul {
display: block;
background-color: white;
box-sizing: border-box;
padding: 0 16px;
width: calc(100% + 35px);
margin-left: -19px;
border-left: 3px solid rgb(240,180,0);
border-top: none;
border-bottom: none;
}

nav ul li.aktiv h3 {
display: block;
}

.start nav > ul > li.aktiv {
padding: 0 16px;
width: auto;
margin-left: 0;
border-left: none;
background-color: transparent;
}

.start nav ul li.aktiv ul {
background-color: transparent;
}

nav > ul > li.aktiv {
padding-top: 12px;
padding-bottom: 12px;
}

nav > ul > li.aktiv + li {
border-top: none;
}

nav > ul > li > ul {
margin-top: -8px;
padding-bottom: 12px;
}

nav ul > li.aktiv ul {
margin-top: 4px;
}

nav ul > li.aktiv ul + ul li:first-child {
border-top: 2px solid rgba(0, 0, 0, 0.1);
margin-top: 8px;
padding-top: 8px;
}

article {
background-color: white;
padding-top: 56px;
padding-bottom: 16px;
box-shadow: 0 200px 0 white, 0 400px 0 white, 0 600px 0 white, 0 800px 0 white, 0 1000px 0 white, 0 1200px 0 white;
}

div.text,
div.quader {
width: 612px;
margin: 0 16px;
}

div.text.agb {
box-sizing: border-box;
padding: 32px 16px;
}

div.text hr {
border: none;
height: 2px;
margin: 16px 0;
background: rgba(0,0,0,0.1);
}

div.text ol {
list-style-type: decimal;
padding-left: 24px;
}

div.text ul > li {
margin: 0 0 5px 0;
padding-left: 12px;
text-indent: -12px;
}

div.text ul.downloads > li {
padding-left: 0;
text-indent: 0;
}

div.text ol > li {
margin: 0 0 5px 0;
padding-left: 4px;
}

div.text > ul.galerie > li,
div.text > ul.veranstaltungen > li,
div.text > ul.publikationen > li {
padding-left: 0;
text-indent: 0;
}

div.text ul > li:before {
content: '› ';
display: block;
float: left;
width: 10px;
margin-left: 2px;
color: black;
}

div.text > ul.galerie > li:before,
div.text ul.downloads li:before,
div.text ul.veranstaltungen li:before,
div.text ul.publikationen li:before {
content: '';
}

div.text > ul.galerie,
div.text > ul.galerie li,
div.text figure img,
div.text div.pub img {
width: 100%;
height: auto;
}

div.text figure {
margin: 8px 0 20px 0;
}

div.pub img {
box-shadow: 0 0 12px rgba(0,0,0,0.2);
}

.veranstaltungen div.text figure,
.publikationen div.text div.pub {
display: inline-block;
vertical-align: top;
width: 196px;
margin: 0 16px 8px 0;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

.veranstaltungen div.text figure + div.einzug,
.publikationen div.text div.pub + div.einzug {
display: inline-block;
vertical-align: top;
width: calc(100% - 196px - 16px);
}

h2 + ul.galerie figure {
margin-top: 0;
}

div.text figcaption {
font-size: 14px;
line-height: 18px;
font-style: italic;
margin: 4px 8px 8px 0;
}

div.text p,
aside p,
div.text ul,
div.text ol {
margin: 0 0 10px 0;
}

div.text h2 {
font-size: 22px;
line-height: 28px;
font-weight: bold;
color: rgb(240,180,0);
margin: -4px 0 20px -1px;
}

article.team div.text h2 {
margin: -2px 0 8px 0;
}

div.text * + h2,
article.team div.text * + h2 {
margin-top: 32px;
border-bottom: 2px solid rgb(240,180,0);
padding-bottom: 4px;
}

.veranstaltungen div.text * + h2,
.publikationen div.text * + h2 {
margin: 64px 0 0 0;
border-bottom: none;
}

div.text h3,
ul.team > li h5 {
font-size: 18px;
line-height: 22px;
font-weight: bold;
font-style: normal;
border-bottom: 2px solid rgb(240,180,0);
margin: 16px 0 12px 0;
padding: 0 0 10px 0;
}

.veranstaltungen div.text p.datum,
.publikationen div.text p.reihe {
border-top: 2px solid rgb(240,180,0);
padding: 8px 0 0 0;
}

.veranstaltungen div.text h3,
.publikationen div.text h3 {
border-bottom: none;
margin: 0 0 12px 0;
padding: 0;
color: rgb(240,180,0);
}

div.text h3.subtitel {
font-size: 16px;
line-height: 20px;
font-style: italic;
border-bottom: none;
margin: -8px 0 8px 0;
padding: 0;
color: black;
}

div.text h3.subtitel + p.typ {
margin: -8px 0 8px 0;
}

ul.blog div.text h3 {
margin: -5px 0 12px 0;
}

.blog div.text h3 a {
font-size: 20px;
line-height: 24px;
color: rgb(240,180,0);
border-bottom: none;
}

.blog div.text h3 a:hover {
color: rgb(43,41,44);
}

.themen-und-projekte div.text h3 a {
float: right;
font-size: 16px;
font-weight: normal;
color: rgb(240,180,0);
border-bottom-color: white;
}

.themen-und-projekte div.text h3 a:hover {
color: black;
border-bottom-color: rgb(240,180,0);
}

div.text h4 {
font-weight: bold;
margin: 15px 0 5px 0;
}

div.text ul.team li h4 {
margin: 0 0 12px 0;
color: rgb(240,180,0);
}

div.text h5 {
font-weight: bold;
font-style: italic;
margin: 15px 0 0 0;
}

div.text h6 {
font-style: italic;
margin: 15px 0 0 0;
}

div.text p.nr {
font-style: italic;
margin: 10px 0;
}

div.text ul + p.nr {
margin-top: 16px;
}

div.text * a,
article aside * a,
ul.publikationen p a {
color: black;
border-bottom: 1px solid rgb(240,180,0);
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
}

div.text.agb * a {
border-bottom: none;
}

div.text * a:hover,
article aside * a:hover,
ul.publikationen p a:hover {
color: rgb(240,180,0);
border-bottom: 1px solid transparent;
}

div.text * a:active,
article aside * a:active,
ul.publikationen p a:active {
color: white;
background-color: rgb(240,180,0);
padding: 4px;
margin: -4px;
border-radius: 2px;
}

article aside {
width: 196px;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

article div.aside {
margin: 0 0 24px 0;
}

article.veranstaltungen div.aside {
margin: 24px 0 24px 0;
}

a[href^="mailto:"] {
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}

article aside h3 {
border-bottom: 2px solid rgb(240,180,0);
margin: 1px 0 9px 0;
padding: 0 0 8px 0;
font-weight: bold;
}

article.veranstaltungen div.aside h3,
article.veranstaltungen div.text h4,
article.publikationen div.aside h3,
article.publikationen div.text h4 {
font-size: 16px;
line-height: 20px;
padding: 8px 0 4px 0;
color: black;
border-bottom: 2px solid rgba(0,0,0,0.1);
}

article.publikationen div.text div.reihe h4 {
border-bottom: none;
padding-bottom: 0;
}

article aside.filter {
margin-top: 16px;
}

article aside.filter div {
width: 100%;
}

article aside.filter h3 {
border-bottom: none;
margin: 1px 0 7px 0;
padding: 0;
/* font-weight: normal; */
}

article aside * + h3 {
margin-top: 32px;
}

article aside h4 {
font-weight: bold;
}

article aside h4 a {
border-bottom: none;
}

article aside p.typ {
font-style: italic;
}

article aside ul.events li {
margin: 0 0 10px 0;
}

article aside ul.downloads li {
margin: 0 0 8px 0;
}

article aside img.portrait,
article .aside img.portrait {
float: left;
width: 52px;
height: 52px;
margin: 4px 8px 4px 0;
}

span.dok {
color: white;
background-color: rgb(250,200,30);
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 1px;
padding: 2px 4px 1px 5px;
margin: 0 4px 0 0;
}

p.programm {
background: rgb(243,243,244);
padding: 8px 8px 8px 8px;
}

article aside ul.downloads a:hover span.dok {
padding: 2px 4px 1px 5px;
background-color: black;
}

ul.filter {
margin: 0 0 24px 0;
}

ul.filter li a {
position: relative;
display: block;
background: rgb(243,243,244);
border-bottom: none;
padding: 4px 8px;
}

ul.tp li h4 {
padding: 4px 8px;
font-style: italic;
color: white;
background: rgba(0,0,0,0.2);
}

.js div.text h4.aufklapp {
position: relative;
display: block;
border-top: 1px solid black;
border-bottom: 1px solid black;
padding: 8px 0;
margin: 15px 0 0 0;
}

.js div.text h4.aufklapp + div + h4.aufklapp {
border-top: none !important;
margin: 0;
}

.js div.text h4.aufklapp + div + h4.aufklapp.offen {
margin: 0;
}

.js div.text h4.aufklapp:hover {
background: rgb(250,200,30);
color: white;
margin: 15px -8px 0 -8px;
padding: 8px;
cursor: pointer;
border-color: rgb(250,200,30);
}

.js div.text h4.aufklapp + div + h4.aufklapp:hover {
margin: 0 -8px 0 -8px;
}

div.text * a.anmeldung {
display: inline-block;
color: white;
background-color: rgb(250,200,30);
border-color: rgb(250,200,30);
font-weight: bold;
padding: 4px 8px;
margin: 0 0 12px 0;
}

div.einzug div + a.anmeldung {
margin-top: 16px;
}

div.text * a.anmeldung:hover {
color: white;
background-color: rgb(43,41,44);
border-color: rgb(43,41,44);
}

.js h4.aufklapp + div {
border-bottom: 1px solid black;
padding-top: 8px;
}

.js h4.aufklapp + div *:first-child {
margin-top: 0;
}

.js div.text h4.aufklapp.offen {
border-bottom-color: transparent;
color: rgb(240,180,0);
}

.js div.text h4.aufklapp.offen:hover {
color: white;
}

ul.filter li a svg,
h4.aufklapp svg,
a.anmeldung svg {
position: absolute;
top: 2px;
top: calc(50% - 12px);
right: 0;
fill: none;
stroke: rgb(43,41,44);
stroke-width: 2;
stroke-linecap: round;
}

a.anmeldung:hover svg,
h4.aufklapp:hover svg {
right: 8px;
stroke: white;
}

ul.filter li a:hover,
ul.filter li.aktiv a:hover,
ul.filter li.aktiv.mini a:hover {
background: rgb(250,200,30);
color: white;
}

ul.filter li a:hover svg,
ul.filter li a:active svg,
ul.filter li.aktiv a svg,
ul.filter li.aktiv.mini a:hover svg {
stroke: white;
}

ul.filter li a:active,
ul.filter li.aktiv a {
background: rgb(43,41,44);
color: white;
padding: 4px 8px;
margin: 0;
border-radius: 0;
}

ul.filter li.aktiv a {
padding: 4px 20px 4px 8px;
}

ul.filter li.aktiv.mini a {
background: rgb(243,243,244);
color: black;
}

ul.filter li.aktiv.mini a svg {
stroke: rgb(43,41,44);
}

ul.filter li.aktiv a svg polyline {
-webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
transition: all 200ms ease-in;
}

ul.filter li.aktiv.mini a svg polyline#one,
ul.filter li.aktiv.mini a svg polyline#two {
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}

ul.filter li.aktiv a svg polyline#one {
-webkit-transform: translate(0, 7px);
-moz-transform: translate(0, 7px);
-ms-transform: translate(0, 7px);
transform: translate(0, 7px);
}

ul.filter li.aktiv a svg polyline#two {
-webkit-transform: translate(0, -7px);
-moz-transform: translate(0, -7px);
-ms-transform: translate(0, -7px);
transform: translate(0, -7px);
}

h4.aufklapp svg line {
-webkit-transform: scale(0.5) translate(0, 4px);
-moz-transform: scale(0.5) translate(0, 4px);
-ms-transform: scale(0.5) translate(0, 4px);
transform: scale(0.5) translate(0, 4px);
-webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
transition: all 200ms ease-in;
stroke-width: 4;
}

h4.aufklapp svg line#eins {
-webkit-transform-origin: 7.4px 7.4px;
-moz-transform-origin: 7.4px 7.4px;
-o-transform-origin: 7.4px 7.4px;
-ms-transform-origin: 7.4px 7.4px;
transform-origin: 7.4px 7.4px;
}

h4.aufklapp svg line#zwei {
-webkit-transform-origin: 16.6px 7.4px;
-moz-transform-origin: 16.6px 7.4px;
-o-transform-origin: 16.6px 7.4px;
-ms-transform-origin: 16.6px 7.4px;
transform-origin: 16.6px 7.4px;
}

h4.aufklapp.offen svg line#eins,
h4.aufklapp.offen svg line#zwei {
-webkit-transform: scale(1) translate(0, 0);
-moz-transform: scale(1) translate(0, 0);
-ms-transform: scale(1) translate(0, 0);
transform: scale(1) translate(0, 0);
stroke-width: 2;
}

ul.startgalerie,
ul.startgalerie li {
display: block;
width: 408px;
height: 408px;
}

.start ul.startgalerie {
background-color: rgb(243,243,244);
}

ul.startgalerie li {
position: relative;
}

ul.startgalerie li a:hover img {
filter: saturate(1.5);
}

ul.startgalerie li h3 {
position: absolute;
top: 16px;
left: 16px;
font-size: 20px;
line-height: 26px;
font-weight: bold;
color: white;
text-shadow: 0 0 28px rgba(0,0,0,0.5);
margin-right: 12px;
}

ul.veranstaltungen,
div.text ul.veranstaltungen,
div.text ul.publikationen {
margin-right: -16px;
}

ul.startthemen li,
ul.startevents li,
ul.startblog li,
ul.veranstaltungen li {
position: relative;
display: block;
width: 196px;
height: 196px;
}

ul.startthemen li a,
ul.startevents li a,
ul.startblog li a,
ul.veranstaltungen li a {
display: block;
width: 196px;
height: 196px;
border-bottom: none;
}

ul.veranstaltungen li a.leer {
box-sizing: border-box;
padding: 12px 16px;
}

ul.startthemen li a {
background-color: rgba(0,0,0,0.8);
}

ul.startthemen li a:hover {
background-color: rgba(0,0,0,1);
}

ul.startevents li a,
ul.veranstaltungen li a {
background-color: rgb(250,200,30);
}

ul.veranstaltungen li.aktiv a {
background-color: rgba(0,0,0,0.2);
}

ul.startevents li a:hover,
ul.veranstaltungen li a:hover {
background-color: rgba(0,0,0,0.8);
border-bottom: none;
}

ul.startblog li a {
background-color: rgb(20,150,110);
}

ul.startblog li a:hover {
background-color: rgba(0,0,0,0.8);
}

ul.startthemen li a img {
position: absolute;
top: 0;
left: 0;
-ms-filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
opacity: 0.6;
}

ul.startevents li a img,
ul.startblog li a img,
ul.veranstaltungen li a img {
position: absolute;
top: 0;
left: 0;
opacity: 0;
}

ul.veranstaltungen li.aktiv a img {
-ms-filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}

ul.veranstaltungen li a img {
opacity: 0.2;
}

ul.startevents li p.datum,
ul.veranstaltungen li p.datum {
font-weight: bold;
color: white;
margin: 0;
}

ul.startblog li div * {
color: white;
}

ul.startevents li p,
ul.veranstaltungen li p {
color: black;
}

ul.startevents li h3,
ul.veranstaltungen li h3 {
font-size: 16px;
line-height: 20px;
font-weight: bold;
color: black;
margin: 0;
padding: 0;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
border-bottom: none;
}

ul.startevents li a:hover p,
ul.startevents li a:hover h3,
ul.veranstaltungen li a:hover p,
ul.veranstaltungen li a:hover h3 {
color: white;
}


ul.startthemen li a:hover imgg {
opacity: 0.4;
}

ul.startevents li a:hover img,
ul.veranstaltungen li a:hover img,
ul.startblog li a:hover img {
opacity: 0.6;
}

ul.startthemen li div,
ul.startevents li div,
ul.veranstaltungen li div,
ul.startblog li div {
position: absolute;
top: 14px;
left: 16px;
margin-right: 12px;
overflow: hidden;
}

ul.startthemen li p {
color: rgb(250,200,30);
font-weight: bold;
}

ul.startthemen li h3 {
color: white;
text-shadow: 0 0 16px rgba(0,0,0,0.6);
font-weight: bold;
padding-bottom: 8px;
}

ul.startthemen li p:after {
content: ' › › ›';
display: inline;
}

ul.startblog li h3 {
font-weight: bold;
}

.grid-item,
.start nav > ul.main,
.start nav > ul.footer,
ul.startgalerie,
ul.startthemen li,
ul.startevents li,
ul.startblog li {
margin: 0 0 16px 0;
}

ul.veranstaltungen li,
div.text ul.veranstaltungen > li {
display: inline-block;
margin: 0 12px 8px 0;
}

div.text > ul.team > li:before,
div.text ul.ansprechpartner > li:before {
content: '';
}

div.text > ul.team > li {
position: relative;
text-indent: 0;
margin: 0;
padding: 16px 0 4px 0;
clear: both;
}

div.text ul.ansprechpartner > li {
position: relative;
text-indent: 0;
margin: 0;
padding: 0;
clear: both;
}

div.text ul.ansprechpartner > li + li {
border-top: 1px solid rgba(0,0,0,0.1);
padding-top: 8px;
}

div.text > ul.team > li:target {
background: rgba(250,200,30,0.1);
padding: 16px 16px 4px 16px;
margin: 0 -16px;
border-top: none;
}

div.text > ul.team > li:target + li {
border-top: none;
}

div.text > ul.team > li + li {
border-top: 2px solid rgba(0,0,0,0.1);
}

div.text > ul.kontakt > li:last-child {
border-bottom: none;
}

div.text > ul.team > li img.portrait,
div.text > ul.team > li div.portrait,
article.team div.text img.portrait,
article.team div.text div.portrait {
float: left;
width: 196px;
height: 196px;
margin: 4px 16px 16px 0; 
}

ul.team > li div.text,
article.team div.text div.text {
width: calc(100% - 196px - 16px);
margin: 0;
}

div.quader div.text {
width: 100%;
margin: 0;
}

.grau {
color: rgba(0,0,0,.5);
}

/* 
div.text > ul.kontakt > li {
display: block;
padding: 1px 0 16px 0;
}
 */

ul.team > li h3,
ul.team > li h5,
ul.team > li p {
border-bottom: none;
margin: 0 32px 0 0;
padding: 0;
}

ul.team > li h3 a,
ul.team > li h5 a {
border-bottom: none;
}

ul.team div.mehr {
display: none;
}

ul.team div.mehr h4 {
margin-top: 0;
}

ul.team button {
position: absolute;
top: 20px;
right: 0;
margin: 0;
padding: 0;
width: 24px;
height: 24px;
border: none;
border-radius: 2px;
background-color: rgb(250,200,30);
}

ul.team button svg {
fill: none;
stroke: white;
stroke-width: 3;
stroke-linecap: round;
position: absolute;
top: 0;
left: 0;
-webkit-transition: all 500ms ease-in;
-moz-transition: all 500ms ease-in;
-ms-transition: all 500ms ease-in;
transition: all 500ms ease-in;
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
}

ul.team button:hover {
background-color: rgb(43,41,44);
}

ul.team button.offen svg {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}

ul.blog {
width: calc(100% - 204px);
display: inline-block;
vertical-align: top;
}

ul.blog li + li {
padding-top: 4px;
}

ul.blog li + li article.blog {
padding-top: 32px;
}

ul.blog li.pagina {
padding: 0 16px;
}

span.ellipsis {
margin: 0 8px 0 0;
}

ul.pagination {
padding: 8px 0 24px 0;
}

ul.pagination li {
display: inline-block;
margin: 0 8px 4px 0;
}

ul.pagination li a {
display: inline-block;
text-align: center;
padding: 0;
width: 24px;
height: 24px;
line-height: 24px;
border: none;
border-radius: 2px;
font-weight: bold;
color: white;
background-color: rgb(250,200,30);
}

ul.pagination li a.disabled {
pointer-events: none;
background-color: rgba(250,200,30,0.2);
}

ul.pagination li a.selected {
pointer-events: none;
background-color: rgb(43,41,44);
}

ul.pagination li a:hover {
background-color: rgb(43,41,44);
}

a.back {
color: black;
display: block;
margin-bottom: 16px;
}

a.back:hover {
color: rgb(240,180,0);
}

a.back + h2 {
margin-top: 16px;
}

a.knopf {
font-weight: bold;
color: white !important;
background: rgb(250,200,30);
padding: 4px 8px;
}

a.knopf:hover {
background: rgb(43,41,44);
}

div.text p a.knopf {
display: inline-block;
border-bottom: none;
}

ul.publikationen {
margin-bottom: 24px;
margin-right: -16px;
}

ul.publikationen.txt {
border-top: 2px solid rgb(240,180,0);
margin-right: 0;
}

ul.publikationen.txt li {
display: block;
width: auto;
height: auto;
border-bottom: 1px solid black;
background: transparent;
margin: 0;
}

ul.publikationen.txt li > a,
ul.publikationen.txt li div {
background: transparent;
position: static;
display: block;
padding: 12px 0;
border: none;
width: auto;
height: auto;
opacity: 1;
}

ul.publikationen li > a {
position: absolute;
top: 0;
left: 0;
width: 100%;
min-height: 100%;
box-sizing: border-box;
padding: 12px 16px;
color: black;
background: rgba(250,200,30,0.93);
opacity: 0;
z-index: 99;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
-webkit-transition: none;
-moz-transition: none;
transition: none;
}

ul.publikationen li > a:hover,
ul.publikationen li > a.leer {
opacity: 1;
color: black;
}

ul.publikationen li > a:active {
padding: 12px 16px;
margin: 0;
border-radius: 0;
}

ul.publikationen li > a.leer:hover {
background: rgb(43,41,44);
color: white;
}

ul.publikationen.txt li > a:hover h3 {
color: rgb(250,200,30);
}

ul.publikationen.txt li > a:hover h3 i,
ul.publikationen.txt li > a:hover h3.subtitel {
color: black;
}

ul.publikationen li h3 {
font-size: 16px;
font-weight: bold;
margin: 0;
padding: 0;
border-bottom: 0;
}

ul.publikationen li p.preis,
div.pub p.preis {
font-weight: bold;
}

div.pub p.preis {
margin: 16px 0 0 0;
}

div.reihe {
font-style: italic;
color: rgba(0,0,0,0.6);
border-top: 1px solid rgba(0, 0, 0, 0.2);
padding-top: 0;
margin-top: 16px;
}

ul.publikationen li h3.subtitel,
ul.publikationen li h3 i {
font-weight: normal;
}

ul.publikationen.txt li img {
display: none;
}

ul.publikationen li img {
position: relative;
height: 180px;
margin: 8px auto;
display: block;
z-index: 1;
}

ul.publikationen.txt li div,
ul.publikationen.txt li > a {
display: inline-block;
vertical-align: top;
width: 50%;
width: calc(50% - 8px);
}

ul.publikationen li div {
display: none;
}

ul.publikationen.txt li > a + div {
margin-left: 16px;
}

ul.publikationen li,
div.text ul.publikationen > li {
position: relative;
display: inline-block;
vertical-align: top;
width: 196px;
height: 196px;
background: rgba(0,0,0,0.05);
margin: 0 12px 12px 0;
}

button#img,
button#txt {
position: relative;
display: inline-block;
font-size: 0;
line-height: 0;
color: transparent;
border: none;
width: 24px;
height: 24px;
margin: 0 0 0 8px;
float: right;
border-radius: 2px;
}

h2 button#img,
h2.txt button#txt {
background: rgb(250,200,30);
}

h2.txt button#img,
h2 button#txt {
background: rgba(0,0,0,0.1);
}

button#img:hover,
button#txt:hover,
h2.txt button#img:hover,
h2.txt button#txt:hover {
background: rgb(43,41,44);
}

button#img svg,
button#txt svg {
position: absolute;
top: 0;
left: 0;
}

button#img svg rect {
fill: white;
}

button#txt svg line {
stroke: white;
stroke-width: 3;
stroke-linecap: round;
}

button#txt svg circle {
fill: white;
stroke-width: 0;
}

article.suche p.url {
padding-left: 12px;
}

article.suche p strong {
font-weight: normal;
background: rgba(250,200,30,0.4);
}

div.text ul.suche li {
border-bottom: 1px solid rgb(220,220,220);
padding-bottom: 4px;
}

div.text ul.suche li:last-child {
border-bottom: none;
}

div.text ul.suche p.url:before {
content: '@ ';
color: rgb(240,180,0);
}

div.excerpt * {
color: grey;
}

div.anmeldung {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(240,180,0,0.8);
z-index: 1000;
box-sizing: border-box;
padding: 64px 32px 32px 32px;
cursor: pointer;
}

div.anmeldung iframe {
position: relative;
width: 100%;
height: 100%;
z-index: 2000;
}

div.anmeldung svg#zu {
fill: none;
stroke: rgb(43,41,44);
stroke-width: 3;
stroke-linecap: round;
margin: 4px;
position: absolute;
top: 16px;
right: 32px;
}

div.anmeldung svg#zu:hover {
stroke: white;
}

div.anmeldung svg#logo {
fill: white;
stroke-linecap: round;
width: 20%;
height: 20%;
position: absolute;
top: 40%;
right: 40%;
z-index: 1500;
}

div.anmeldung svg#logo {
animation: warten ease-out 1.5s;
animation-iteration-count: infinite;
transform-origin: 50% 50%;
-webkit-animation: warten ease-out 1.5s;
-webkit-animation-iteration-count: infinite;
-webkit-transform-origin: 50% 50%;
-moz-animation: warten ease-out 1.5s;
-moz-animation-iteration-count: infinite;
-moz-transform-origin: 50% 50%;
-o-animation: warten ease-out 1.5s;
-o-animation-iteration-count: infinite;
-o-transform-origin: 50% 50%;
-ms-animation: warten ease-out 1.5s;
-ms-animation-iteration-count: infinite;
-ms-transform-origin: 50% 50%;
}

@keyframes warten {
0% {transform: scaleX(1) scaleY(1);}
50% {transform: scaleX(0.8) scaleY(0.8);}
100% {transform: scaleX(1) scaleY(1);
}
}

@-moz-keyframes warten {
0% {-moz-transform: scaleX(1) scaleY(1);}
50% {-moz-transform: scaleX(0.8) scaleY(0.8);}
100% {-moz-transform: scaleX(1) scaleY(1);}
}

@-webkit-keyframes warten {
0% {-webkit-transform: scaleX(1) scaleY(1);}
50% {-webkit-transform: scaleX(0.8) scaleY(0.8);}
100% {-webkit-transform: scaleX(1) scaleY(1);}
}

@-o-keyframes warten {
0% {-o-transform: scaleX(1) scaleY(1);}
50% {-o-transform: scaleX(0.8) scaleY(0.8);}
100% {-o-transform: scaleX(1) scaleY(1);}
}

@-ms-keyframes warten {
0% {-ms-transform: scaleX(1) scaleY(1);}
50% {-ms-transform: scaleX(0.8) scaleY(0.8);}
100% {-ms-transform: scaleX(1) scaleY(1);}
}







/* Flickity v1.1.0 http://flickity.metafizzy.co  */

.flickity-enabled {
position: relative;
}

.flickity-enabled:focus { outline: none; }

.flickity-viewport {
overflow: hidden;
position: relative;
height: 100%;
}

.flickity-slider {
position: absolute;
width: 100%;
height: 100%;
}

/* draggable */

.flickity-enabled.is-draggable {
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
-webkit-user-select: none;
 -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
cursor: move;
cursor: -webkit-grab;
cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
cursor: -webkit-grabbing;
cursor: grabbing;
}

/* ---- previous/next buttons ---- */

.flickity-prev-next-button {
position: absolute;
bottom: 24px;
width: 12px;
height: 12px;
border: none;
background: transparent;
cursor: pointer;
}

.flickity-prev-next-button:focus {
outline: none;
box-shadow: 0 0 0 5px #09F;
}

.flickity-prev-next-button:active {
filter: alpha(opacity=60); /* IE8 */
opacity: 0.6;
}

.flickity-prev-next-button.previous {right: 12px;}
.flickity-prev-next-button.next {right: 0;}
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
left: auto;
right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
right: auto;
left: 10px;
}

.flickity-prev-next-button:disabled {
filter: alpha(opacity=30); /* IE8 */
opacity: 0.3;
cursor: auto;
}

.flickity-prev-next-button svg {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}

.flickity-prev-next-button .arrow {
/* fill: rgb(240,180,0); */
fill: black;
}

.flickity-prev-next-button:hover .arrow { 
fill: black;
}

/* color & size if no SVG - IE8 and Android 2.3 */
.flickity-prev-next-button.no-svg {
color: #333;
font-size: 26px;
}

/* ---- page dots ---- */

.flickity-page-dots {
position: absolute;
width: 100%;
bottom: 12px;
right: 16px;
padding: 0;
margin: 0;
list-style: none;
text-align: right;
line-height: 1;
}

.flickity-page-dots .dot {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 0 0 8px;
background-color: white;
border-radius: 50%;
cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
background-color: rgb(250,200,30);
}

div.text .flickity-enabled figcaption {
margin-right: 32px;
}

/* ENDE Flickity */





/* ############# Screens über 1299px ############# */
@media only screen and (min-width: 1299px) {

  header div,
  section,
  #social {
  width: 1256px;
  }

  ul.blog li.pagina {
  padding: 0 16px 0 32px;
  }  
  
  header h1 {width: 880px;}
  header form {width: 376px;}
  .start header form,
  header.veranstaltungen form {width: 408px;}
  .start header h1,
  header.veranstaltungen h1 {width: 848px;}
  
  div.text,
  div.quader {
  margin: 0 32px;
  }
  
  .veranstaltungen div.quader,
  .publikationen div.quader {
  width: 820px;
  margin: 0 18px;
  }
  
  .veranstaltungen div.quader div.text,
  .publikationen div.quader div.text {
  /* max-width: 612px; */
  }
  
  article aside {
  width: 376px;
  }

  article.veranstaltungen aside,
  article.publikationen aside {
  width: 196px;
  }

}


/* ############# Screens unter 1088px ############# */
@media only screen and (max-width: 1087px) {

  header div,
  section, #social {
  width: 832px;
  }
  
  header h1 {
  width: 636px;
  }
  
  article {
  width: 628px;
  }
  
  div.text,
  div.quader {
  width: 596px;
  margin: 0 16px;
  }
  
  article aside {
  width: 596px;
  margin: 16px 16px 0 16px;
  }
  
  article.veranstaltungen,
  article.publikationen {
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: inline-flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  }
  
  article.veranstaltungen aside,
  article.publikationen aside {
  -webkit-order: 2;
  -moz-order: 2;
  -ms-order: 2;
  order: 2;
  }
  
  article.veranstaltungen div.quader,
  article.publikationen div.quader {
  -webkit-order: 3;
  -moz-order: 3;
  -ms-order: 3;
  order: 3;
  }
  
  article aside.filter {
  margin: 0 16px 16px 16px;
  }
  
  article aside.filter div {
  display: inline-block;
  vertical-align: top;
  width: calc(50% - 8px);
  }
  
  article aside.filter div:nth-child(even) {
  margin: 0 0 0 16px;
  }
  
  ul.veranstaltungen li,
  ul.veranstaltungen li a,
  ul.veranstaltungen li a img,
  ul.publikationen li,
  div.text ul.publikationen > li,
  ul.publikationen li a {
  width: 190px;
  height: 190px;
  }
  
  ul.publikationen li img {
  margin: 5px auto;
  }
  
}


/* ############# Screens unter 876px ############# */
/* ################ Einklappnavi ################# */
@media only screen and (max-width: 875px) {

  body {
  background-color: white;
  background-image: none;
  }

  header div,
  section, #social {
  width: 620px;
  padding-left: 32px;
  }
  
/* 
  .start header div,
  .start section {
  padding-left: 0;
  }
 */
  
  header h1 {
  width: 424px;
  }
 
  nav,
  .start nav {
  display: inline-block;
  position: fixed;
  top: 0;
  left: -240px;
  display: block;
  width: 272px;
  height: 100vh;
  padding-top: 16px;
  background-color: rgb(240,240,240);
  -webkit-transition: all 250ms ease-out;
  -moz-transition: all 250ms ease-out;
  transition: all 250ms ease-out;
  z-index: 100;
  overflow-y: auto;
  overflow-x: hidden;
  -ms-overflow-style: none;
  }
  
  nav::-webkit-scrollbar,
  .start nav::-webkit-scrollbar { width: 0 !important }
  
  .start nav > ul {
  float: right;
  box-sizing: border-box;
  display: inline;
  }
  
  nav > ul.main,
  nav > ul.footer {
  margin: 0 48px 0 0;
  }
  
  .start nav > ul.main,
  .start nav > ul.footer {
  position: static !important;
  width: 188px;
  margin: 0 48px 0 0;
  border-top: none;
  font-weight: bold;
  padding: 0;
  font-weight: normal;
  }
  
  .start nav > ul.main > li {
  border-top: 1px solid rgb(0, 0, 0);
  }
  
  .start nav > ul.main > li {
  padding: 0;
  }
  
  .start nav > ul.main > li.aktiv {
  padding: 12px 16px;
  }
  
  .start nav > ul.main > li:first-child {
  border-top: none;
  }
  
  .start nav > ul.footer li:first-child {
  border-top: 2px solid rgba(0,0,0,0.1);
  }
  
  .start nav > ul.footer li:first-child {
  padding-top: 12px;
  }
  
  .start nav ul > li.aktiv ul + ul li:first-child {
  border-top: 2px solid rgba(0,0,0,0.1);
  }
  
  .start nav > ul.footer > li {
  padding: 0;
  margin: 0 0 8px 0;
  }
  
  .start nav > ul.main > li > a,
  .start nav > ul.main > li > a.sub {
  padding: 12px 0;
  display: block;
  }
  
  .start nav > ul > li.aktiv,
  .start nav > ul > li.aktiv > ul {
  display: block;
  background-color: rgb(255, 255, 255);
  box-sizing: border-box;
  padding: 0 16px;
  width: calc(100% + 35px);
  margin-left: -19px;
  border-left: 3px solid rgb(240,180,0);
  border-top: none;
  border-bottom: none;
  }
  
  .start nav > ul > li.aktiv + li {
  border-top: none;
  }
  
  .start nav > ul.main > li.aktiv > a {
  padding: 0;
  }
  
  nav a.navon,
  nav:target a.navoff {
  display: block;
  }
  
  nav:target {
  left: 0;
  border-width: 0;
  -webkit-box-shadow: 32px 0 16px rgba(0,0,0,0.2);
  -moz-box-shadow: 32px 0 16px rgba(0,0,0,0.2);
  box-shadow: 32px 0 16px rgba(0,0,0,0.2);
  }
  
  nav:target a.navon,
  nav a.navoff {
  display: none;
  }
  
  a.navon,
  a.navoff {
  position: absolute;
  top: 0;
  left: 240px;
  content: ' ';
  width: 32px;
  height: 100vh;
  font-size: 0;
  color: transparent;
  -webkit-transition: all 250ms ease-out;
  -moz-transition: all 250ms ease-out;
  transition: all 250ms ease-out;
  }
  
  a.navon,
  a.navoff {
  background-color: rgb(250,200,30);
  box-shadow: 0 100vh rgb(250,200,30);
  }
  
  a.navon:hover,
  a.navoff:hover {
  background-color: rgb(43,41,44);
  box-shadow: 0 100vh rgb(43,41,44);
  }
  
  a.navon svg,
  a.navoff svg {
  fill: none;
  stroke: rgb(43,41,44);
  stroke-width: 3;
  stroke-linecap: round;
  margin: 4px;
  position: absolute;
  top: 33px;
  left: 0;
  }
  
  a.navon:hover svg,
  a.navoff:hover svg {
  stroke: white;
  }
  
  nav > ul.footer,
  .start nav > ul.footer {
  position: static;
  }
  
  article {
  padding-top: 24px;
  width: 100%;
  }
  
  article aside, div.text, div.quader {
  width: 100%;
  }
  
  article aside {
  margin: 16px 0 0 0;
  }
  
  article aside.filter {
  margin: 0 0 16px 0;
  }
  
  div.text, div.quader {
  margin: 0;
  }
  
  ul.blog {
  width: 100%;
  }
  
  ul.veranstaltungen li,
  ul.veranstaltungen li a,
  ul.veranstaltungen li a img,
  ul.publikationen li,
  ul.publikationen li a {
  width: 196px;
  height: 196px;
  }
  
  ul.publikationen li a img {
  margin: 8px auto;
  }
  
  ul.veranstaltungen li,
  div.text ul.veranstaltungen > li,
  ul.publikationen li,
  div.text ul.publikationen > li {
  margin: 0 16px 16px 0;
  }
  
  ul.blog li.pagina {
  padding: 0;
  }  
  
}


/* ############# Screens unter 664px ############# */
@media only screen and (max-width: 663px) {

  body {
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  }

  header div,
  section, #social {
  width: 408px;
  }
  
  .start section {
  margin: 16px auto 17px auto;
  }
  
  header h1 {
  width: 280px;
  }
  
  header form {
  width: 128px;
  }
  
  nav > ul.main.aktiv,
  .start nav > ul.main {
  height: auto;
  min-height: auto;
  }
  
  nav ul > li.aktiv ul + ul li:first-child {
  border-top: none;
  }
  
  ul.startgalerie li h3 {
  font-size: 16px;
  line-height: 20px;
  }
  
  ul.team > li div.text,
  article.team div.text div.text {
  width: auto;
  }
  
  .veranstaltungen div.text figure,
  .publikationen div.text div.pub {
  width: 128px;
  float: left;
  border-right: 16px solid white;
  margin-right: 0;
  }
  
  .veranstaltungen div.text figure img {
  width: 128px;
  }
  
  .veranstaltungen div.text figure figcaption {
  font-size: 12px;
  line-height: 16px;
  margin: 0;
  }
  
  .veranstaltungen div.text figure + div.einzug,
  .publikationen div.text figure + div.einzug,
  .publikationen div.text div.pub + div.einzug {
  display: block;
  width: 100%;
  }
  
  .publikationen h2 span {
  display: block;
  }
  
  h2.txt button#img,
  h2 button#txt,
  h2.txt button#txt,
  h2 button#img {
  float: none;
  margin: 0 8px 0 0;
  }
  
  div.anmeldung {
  padding: 64px 16px 16px 16px;
  }
  
  .flickity-prev-next-button {

  }

}


/* ############# Screens unter 440px FLÜSSIG ############# */
@media only screen and (max-width: 439px) {

  header {
  box-shadow: none;
  }

  header div,
  section,
  .start section, #social {
  width: auto;
  margin: 0 16px;
  }

  header form {
  width: 100%;
  margin: 0 0 12px 0;
  }
  
  h1 a {
  margin: 8px 0 8px -8px;
  }
  
  a.navon svg, a.navoff svg {
  top: 24px;
  }
    
  ul.startgalerie,
  ul.startgalerie li,
  ul.startgalerie li img {
  width: calc(100vw - 64px);
  height: calc(100vw - 64px);
  line-height: 0;
  }
  
  ul.startthemen li, ul.startevents li, ul.veranstaltungen li, ul.startblog li {
  width: calc(100vw - 64px);
  height: 108px;
  overflow: hidden;
  }
  
  ul.startthemen li a, ul.startevents li a, ul.veranstaltungen li a, ul.startblog li a {
  width: 100%;
  height: 100%;
  }
  
  ul.startthemen li a img, ul.startevents li a img, ul.veranstaltungen li a img, ul.startblog li a img {
  width: 100%;
  height: auto;
  }
  
  article.veranstaltungen {
  padding-top: 0;
  }
  
  ul.veranstaltungen {
  width: 100%;
  }
  
  article aside.filter {
  margin: 16px 0 0 0;
  }
  
  article aside.filter div {
  display: block;
  width: 100%;
  }
  
  article aside.filter div:nth-child(even) {
  margin: 0;
  }
  
  ul.publikationen.txt li div, 
  ul.publikationen.txt li > a {
  display: block;
  width: 100%;
  }
  
  ul.publikationen.txt li > a + div {
  margin-left: 0;
  padding: 0 0 12px 0;
  }
  
  .themen-und-projekte div.text h3 a {
  float: none;
  white-space: nowrap;
  }

}



/* ############# Screens unter 376px —> iPhone 6 hochkant ############# */
@media only screen and (max-width: 375px) {

  header {
  box-shadow: none;
  }

  header h1 {
  width: 72px;
  }
  
  .start nav {
  padding: 0;
  }

  h1 a {
  width: 72px;
  margin: 8px 0 -2px -8px;
  }
  
  h1 a svg g.typo {
	display: none;
	}
	
	h1 a svg.jubi {
	margin-bottom: .5em;
	}
  
  header form {
  width: calc(100% - 72px);
  }
  
  .veranstaltungen div.text figure {
  width: 100%;
  }
  
  .veranstaltungen div.text figure img {
  width: 196px;
  }
  
  .publikationen div.text div.pub {
  width: 100%;
  }
  
  .publikationen div.text div.pub img {
  width: 128px;
  }
  
  div.einzug {
  clear: both;
  }
  
  .veranstaltungen div.text p.datum {
  border-top: none;
  }
  
  .veranstaltungen div.text h2 {
  border-bottom: 2px solid rgb(240,180,0);
  }

}

/*Socials */

#social {
	display: block;
	margin-top: 30px;
	margin-bottom: 30px;
}
.socials {
	display: inline-block;
	width: 25px;
	height: 25px;
	background: no-repeat left top;
	background-size: auto;
	margin-right: 25px;
	text-indent: -9999px;
}

.socials a {
	display: block;
	width: 25px;
	height: 25px;
}

.youtube {
	background-image: url('../img/social/youtube.svg');
}
.facebook {
	background-image: url('../img/social/facebook.svg');
}
.twitter {
	background-image: url('../img/social/twitter.svg');
}
.instagram {
	background-image: url('../img/social/instagram.svg');
}

.blog-link {
	display: inline-block;
	background-color: rgb(250,200,30);
	padding: 1px 6px 2px;

}

.blog-link a {
	color: white;
	font-weight: bold;
}