/* css-reset */
header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}


*{margin:0;padding:0;border:0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;}

*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;}

  /* WORKSANS ---------------------------- */

  @font-face {
      font-family: 'worksans'; /* Light */
      src: url('fonts/worksans/WorkSans-Light.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-Light.woff') format('woff'),
           url('fonts/worksans/WorkSans-Light.ttf') format('truetype');
      font-weight: 300;
      font-style: normal;
  }

  @font-face {
      font-family: 'worksans'; /* Light Italic*/
      src: url('fonts/worksans/WorkSans-LightItalic.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-LightItalic.woff') format('woff'),
           url('fonts/worksans/WorkSans-LightItalic.ttf') format('truetype');
      font-weight: 300;
      font-style: italic;
  }

  @font-face {
      font-family: 'worksans'; /* Normal */
      src: url('fonts/worksans/WorkSans-Regular.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-Regular.woff') format('woff'),
           url('fonts/worksans/WorkSans-Regular.ttf') format('truetype');
      font-weight: 400; /* entspricht font-weight: normal */
      font-style: normal;
  }

  @font-face {
      font-family: 'worksans'; /* Regular Italic */
      src: url('fonts/worksans/WorkSans-Italic.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-Italic.woff') format('woff'),
           url('fonts/worksans/WorkSans-Italic.ttf') format('truetype');
      font-weight: 400; /* entspricht font-weight: normal */
      font-style: italic;
  }

  @font-face {
      font-family: 'worksans'; /* Bold */
      src: url('fonts/worksans/WorkSans-Bold.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-Bold.woff') format('woff'),
           url('fonts/worksans/WorkSans-Bold.ttf') format('truetype');
      font-weight: 700;  /* entspricht font-weight: bold */
      font-style: normal;
  }

  @font-face {
      font-family: 'worksans'; /* Bold Italic */
      src: url('fonts/worksans/WorkSans-BoldItalic.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-BoldItalic.woff') format('woff'),
           url('fonts/worksans/WorkSans-BoldItalic.ttf') format('truetype');
      font-weight: 700;  /* entspricht font-weight: bold */
      font-style: italic;
  }

  @font-face {
      font-family: 'worksans'; /* Semi Bold */
      src: url('fonts/worksans/WorkSans-Semibold.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-Semibold.woff') format('woff'),
           url('fonts/worksans/WorkSans-Semibold.ttf') format('truetype');
      font-weight: 600;
      font-style: normal;
  }

  @font-face {
      font-family: 'worksans'; /* Semi Bold Italic */
      src: url('fonts/worksans/WorkSans-SemiboldItalic.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-SemiboldItalic.woff') format('woff'),
           url('fonts/worksans/WorkSans-SemiboldItalic.ttf') format('truetype');
      font-weight: 600;
      font-style: italic;
  }

  @font-face {
      font-family: 'worksans'; /* Extra Bold */
      src: url('fonts/worksans/WorkSans-ExtraBold.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-ExtraBold.woff') format('woff'),
           url('fonts/worksans/WorkSans-ExtraBold.ttf') format('truetype');
      font-weight: 800;
      font-style: normal;
  }

  @font-face {
      font-family: 'worksans'; /* Extra Bold Italic */
      src: url('fonts/worksans/WorkSans-ExtraBoldItalic.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-ExtraBoldItalic.woff') format('woff'),
           url('fonts/worksans/WorkSans-ExtraBoldItalic.ttf') format('truetype');
      font-weight: 800;
      font-style: italic;
  }

  @font-face {
      font-family: 'worksans'; /* Black */
      src: url('fonts/worksans/WorkSans-Black.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-Black.woff') format('woff'),
           url('fonts/worksans/WorkSans-Black.ttf') format('truetype');
      font-weight: 900;
      font-style: normal;
  }

  @font-face {
      font-family: 'worksans'; /* Black Italic */
      src: url('fonts/worksans/WorkSans-BlackItalic.woff2') format('woff2'),
           url('fonts/worksans/WorkSans-BlackItalic.woff') format('woff'),
           url('fonts/worksans/WorkSans-BlackItalic.ttf') format('truetype');
      font-weight: 900;
      font-style: italic;
  }


/* VARIABLEN */
:root {  --colorblack: #000000;}
:root {  --colordark: #666666;}
:root {  --colorlight: #FFFFFF;}
:root {  --color01: #eb5938;}

:root {  --hover-opacity: 0.5;} 

:root {  --side-space01: 20px;} 
:root {  --space-below01: 15px;} 
:root {  --space-below02: 30px;} 
:root {  --space-below03: 60px;} 


body {font-family:'worksans', Helvetica, Arial, Verdana, sans-serif;line-height:1.4;font-size: 16px;font-weight: 400;text-align: left; color: var(--colordark);background-color: var(--colorblack);background-repeat: no-repeat;background-position: center center;background-attachment: fixed;background-size: cover;}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {display: block;}

ul {list-style-type:none;}
p {margin-bottom: var(--space-below02);}
a {text-decoration:none;color: var(--color01);outline: 0;}
a:hover {text-decoration:none;opacity: var(--hover-opacity);}
strong {font-weight: 700;}
.clear{clear:both;}
.invisible{display:none;}

h1 {background: var(--color01);color: var(--colorlight);text-transform: uppercase;font-weight: 700;}
h1 {font-size: 36px;line-height: 40px;}
h2, h3 {font-size: 21px;line-height: inherit;font-weight:500;color: var(--color01);margin-bottom: 0;}
h1,h2,h3,h4,h5 {margin-top: 0;}

.inside {width: 100%; max-width: 800px;margin-left: auto;margin-right: auto;}

#header {background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgb(0, 0, 0) 100%);}
#header #logo {display: block;width: 80px;margin: 0 auto;padding: 40px 0 20px 0;}
#header #logo img {display: block;width: 100%;height: auto;}
#header #pagetitle {text-align: center;margin-bottom: 50px;}
#header #pagetitle h1 {color: var(--colorlight);display: inline;padding: 0;}

#container {margin: 0 var(--side-space01);}

#main ul {list-style: disc;margin-left: 20px;}

#main .block {background: var(--colorlight);box-shadow: 3px 3px 15px var(--colorblack);padding: 15px var(--side-space01);margin-bottom: var(--space-below02);}
#main .block .date {background: var(--color01);color: var(--colorlight);text-transform: uppercase;font-weight: 700;font-size: 24px;line-height: 28px;display: inline-block;padding: 0 5px; margin-bottom: var(--space-below02);margin-left: -25px;}
#main .block :is(strong, em, a) {display: block;}
#main .block a {text-decoration: underline;}
#main .block a::before {content: '» ';}

#footer {text-align: center;background: var(--colorblack);padding: var(--side-space01);}
#footer a, span {color: var(--colorlight);padding: 0 10px;}

@media screen and (max-width: 767px) {
    h1 {font-size: 23px;line-height: 1.1;}
}

