/*
*/
/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/open-sans-v18-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v18-latin-300.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v18-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/open-sans-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v18-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('./fonts/open-sans-v18-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v18-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v18-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v18-latin-600.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v18-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v18-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/open-sans-v18-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v18-latin-700.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v18-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v18-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: url('./fonts/open-sans-v18-latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/open-sans-v18-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/open-sans-v18-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/open-sans-v18-latin-800.woff') format('woff'), /* Modern Browsers */
       url('./fonts/open-sans-v18-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/open-sans-v18-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}


/* Basics */
i, textarea								{-webkit-transition: 0s; transition: 0s;}
*::-moz-selection						{color: #e5007d;}
*::selection							{color: #e5007d;}
.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;}


/* Inhalt */
body									{font-family: 'Open Sans', sans-serif; background-color: #ffffff;}
body.noverflow							{overflow: hidden;}
.follow									{position: absolute; left: 0; top: 0; width: 20px; height: 20px; margin-top: -10px; margin-left: -10px; border-radius: 100%; transition: transform .1s ease; /*background-color: #f0d647;*/ border: 5px solid #ffed00;}

article									{width: 100%;}

article .branding						{color: #009ee3; position: absolute; font-weight: 900; font-size: 2em; top: 50px; left: 50px; text-transform: uppercase;}
article .branding img					{height: 60px;}
article .opener							{position: absolute; font-weight: 400; font-size: 1em; line-height: 1.5em; left: 50%; top: 50%; transform: translate(-50%, -50%);}
article .opener p						{padding: 10px 0px 10px 0px; font-weight: 300; font-size: 0.75em; color: #2c2c2c;}
article .opener ul						{margin-top: 20px;}
article .opener ul li					{display: block;}
article .opener a						{font-weight: 700; font-size: 1.25em; line-height: 1.5em; color: #e5007d;}
article .opener a:hover					{color: #a5027d;}
article .opener span					{color: #e5007d; text-decoration: underline;}
article .opener span:hover				{color: #009ee3;}
article .legal							{position: absolute; bottom: 50px; right: 50px;}
article .legal a						{display: inline-block; color: #cccccc; margin-left: 10px;}
article .legal a:hover					{text-decoration: underline;}

.legalzwei								{display: block; position: fixed; bottom: 30px; right: 30px;}
.legalzwei a							{display: inline-block; color: #cccccc; margin-left: 10px;}
.legalzwei a:hover						{color: #e5007d;}

small									{font-size: 0.5em; text-transform: uppercase;}

article .content						{width: 80%; max-width: 700px; margin: 250px auto;}
article .content h1						{font-weight: 700; font-size: 3em; line-height: 1.5em; color: #e5007d;}
article .content h2						{font-weight: 700; font-size: 2em; line-height: 1.5em; margin-bottom: 15px; color: #009ee3;}
article .content p						{font-weight: 400; font-size: 1.3em; line-height: 1.5em; margin-bottom: 15px; text-align: justify;}
article .content ul, article .content ol{margin-left: 50px; margin-bottom: 25px;}
article .content li						{font-weight: 400; font-size: 1.1em; line-height: 1.25em; margin-bottom: 15px;}
article .content li li					{font-size: 1em;}
article .content a						{color: #e5007d; font-weight: 700;}
article .content a:hover				{color: #a5027d;}
article .content b						{font-weight: 800;}

.menuopener								{position: absolute; top: 50px; right: 50px; display: block; font-size: 2em; color: #000000; font-weight: 800; text-transform: uppercase;}
.menuopener:hover						{font-size: 2.15em;}

.menu									{display: none; position: fixed; top: 0; width: 100vw; height: 100vh; background-color: #f8f8f8; z-index: 666;}
.menu nav								{display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.menu nav ul							{color: #000000; text-align: center;}
.menu nav ul li							{margin: 30px;}
.menu nav ul li a						{font-size: 3em; margin-left: 10px; font-weight: 800; color: #000000; text-transform: uppercase;}
.menu nav ul li a:hover					{color: #009ee3;}
.menu .legal							{position: absolute; bottom: 80px; right: 50px;}
.menu .legal a							{display: inline-block; font-size: 0.8em; margin-left: 10px; font-weight: 700; color: #888888; text-transform: uppercase;}
.menu .legal a:hover					{color: #e5007d;}

.menu .menucloser						{display: none; position: fixed; top: 50px; right: 50px; display: block; font-size: 5em; color: #000000; font-weight: 800; text-transform: uppercase; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease;}
.menu .menucloser:hover					{color: #e5007d; transform: rotate(180deg);}


/* Responsive */
@media (max-width: 1560px)
{
iframe									{height: 400px;}
}

@media (max-width: 1000px)
{
article .opener							{}

article .content h1						{font-size: 2.5em;}
article .content h2						{font-size: 2em;}
article .content p						{font-size: 1.15em;}
article .content ul, article .content ol{}
}


@media (max-width: 600px)
{
article .opener							{position: relative; left: 0px; padding-left: 25px; padding-right: 25px; padding-bottom: 250px; top: 250px; transform: none;}

.menuopener								{font-size: 4em;}
.menuopener:hover						{font-size: 4em;}
.menuopener span						{display: none;}

iframe									{height: 250px;}

.legalzwei								{top: 30px; max-height: 100px; bottom: auto;}
}


@media (max-width: 500px)
{
article .content h1						{font-size: 2em;}
article .content h2						{font-size: 1.5em;}
article .content p						{font-size: 1em;}
article .content ul, article .content ol{}
}


/* Druckansicht */
@media print
{

}

