@charset "utf-8";
/* CSS Document */

@font-face {
  font-family:'Franklin Gothic';
  font-weight:500;
  font-style:normal;
  font-display:swap;
  src:url('https://cdn.suedkurier.de/content/fonts/franklingothic-med-webfont.woff2') format('woff2'),
      url('https://cdn.suedkurier.de/content/fonts/franklingothic-med-webfont.woff') format('woff');
}
html {
  box-sizing:border-box;
}
*,
*::before,
*::after {
  box-sizing:inherit;
}
body {
	margin:0px;
	font-family:'Franklin Gothic';
	font-size:16px;
  font-weight: normal;
  font-style: normal;
  color:#4b4b4d;
}
img {
	top:0px;
	left:0px;
	z-index:10;
}
#canvas {
	width:300px;
	height:250px;
	border:1px solid #4b4b4d;
	display:block;
	background-image:url(../img/logo.jpg);
	background-repeat:no-repeat;
	background-position:center;
  background-color:#fff;
	position:relative;
	overflow:hidden;
}
#canvas * {
	display:none;
	position:absolute;
}
#text {
	color:#4b4b4b;
	top:30px;
	left:50%;
  transform:translateX(-50%);
	z-index:20;
	width:280px;
  text-align:center;
}
#logo {
	width:180px;
	height:111px;
	z-index:20;
	top:50%;
	left:50%;
  transform:translate(-50%, -50%);
  background-size:contain;
  background-repeat:no-repeat;
}
#button {
	top:50%;
	left:50%;
  transform:translate(-50%, -50%);
	background-color:#c9242c;
	color:#fff;
	padding:15px 32px;
	z-index:30;
  border-radius:2px;
  box-shadow:0 2px 5px 0 rgba(0, 0, 0, 0.26);
  height:48px;
  min-width:165px;
  font-size:16px;
  font-weight:500;
  line-height:1;
}