/* http://www.colorhexa.com */


/* Roboto Regular */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/static/Roboto-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* Roboto Bold */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/static/Roboto-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

/* Roboto Italic */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/static/Roboto-Italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
}

/* Roboto Bold Italic */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/static/Roboto-BoldItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic;
}

/* Roboto Medium (optional, falls du es hinzugefügt hast) */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/static/Roboto-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

/* Roboto Light (optional, falls du es hinzugefügt hast) */
@font-face {
  font-family: 'Roboto';
  src: url('../fonts/static/Roboto-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

/* Definiere die Schrift für den gesamten Body */
body {
  font-family: 'Roboto', sans-serif;
}

/* Beispiel für die Verwendung in verschiedenen Elementen */
h1 {
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}

h2 {
  font-family: 'Roboto', sans-serif;
  font-weight: normal;
}

em {
  font-family: 'Roboto', sans-serif;
  font-style: italic;
}

strong {
  font-family: 'Roboto', sans-serif;
  font-weight: bold;
}

p {
  font-family: 'Roboto', sans-serif;
}







body {
  font-size: 16px;
  background:#fff;
  padding-bottom:30px;
  color: #000;
  margin: auto;
  
  /* http://www.colorzilla.com/gradient-editor/ */
	background: rgb(255,255,255); /* Old browsers */
	background: radial-gradient(ellipse at center,  rgba(255,255,255,1) 10%,rgba(255,255,255,1) 30%,rgba(214,214,214,1) 100%); /* W3C */
}

h1 {
  font-size:24px;
  margin-top:30px;
  margin-bottom:20px;
  font-weight:normal;
}

h2 {
  font-size:20px;
  margin-top:26px;
  margin-bottom:20px;
  font-weight:normal;
}

form {
  margin-top:14px; 
}

p  {
  margin-top:8px;
  margin-bottom:0px;
  margin-left:0px;
  padding-bottom:6px;
  text-align: justify;
}

a:link, a:visited, a:active {
  color: #73e600;
  text-decoration: none;
}

a:hover {
  color: #66cc00;
}

/* brighter link color, according to transparency */
a:link .icontext, a:visited .icontext, a:active .icontext {
  color: #73e600;
}

a:hover .icontext {
  color: #73e600;
}


/* brighter link color, according to transparency */
a:link .icontext_visited, a:visited .icontext_visited, a:active .icontext_visited {
  color: #ffffff;
}

a:hover .icontext_visited {
  color: #ffffff;
}

#main p a:link, #main p a:visited, #main p a:active{
  font-size:16px;
  color: #333;
  text-decoration: none;
  /* Underline with space left and right + position fix margin */
  border-bottom: 1px solid #73e600;
  padding-left:1px;
  padding-right:1px;
  margin-left:-1px;
  margin-right:-1px;
}

#main p a:hover {
  color: #000;
  background: #73e600;
}

#main {
  line-height: 1.5;
  position:relative;
  width:100%;
  margin:auto;
  margin-left:auto;
  margin-right:auto;
  padding-bottom:0px;
  z-index:1;
}

#main::after {
  content: "";
  display: table;
  clear: both;
  height: 0;
  line-height: 0;
  font-size: 0;
}

@keyframes changeopacity {
    from { opacity: 0; }
    to { opacity: 1; }
}

#navi, #details, #menu, .detail, .showdescription {
  clear:left;
  text-align:center;
  position:relative;
  padding-top:4px;
  padding-bottom:4px;
  background-color:#222;
  color:#eee;
  overflow:hidden;
  background:#191919;
  background: linear-gradient(to bottom, #000, #333);
  margin-top:2px;
  margin-bottom:2px;
  animation-name: changeopacity;
  animation-duration: 0.8s;
}

#details, #menu { 
  text-align:left;
  padding-top:10px;
  padding-bottom:10px;
}

#details {
  padding-left:4%;
  padding-right:4%;
}

#menu { 
  display:none;
}

/* http://css3buttongenerator.com/ */

.button {
  background: #000;
  padding: 10px 35px 10px 35px;
  border: solid #222 1px;
  text-decoration: none;
}

.button:hover {
  background: #000;
  border: solid #777 1px;
  text-decoration: none;
}

#footer {
  z-index:5;
  clear:left;
  position:relative;
  top:0px;
  padding-top:12px;
  padding-bottom:12px;
  background:#191919;
  background:linear-gradient(to bottom, #000, #333);
  color:#ddd;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
  overflow:hidden;
}

.description {
  display:none;
  z-index:4;
}

.bold {
	font-weight: bold;
	margin: 0px;
	padding: 0px;
}

.button_no {
  background: #000;
  padding: 10px 35px 10px 35px;
  border: solid #222 1px;
  text-decoration: none;
}

#wurst {
	opacity:0.0;
	display:none;
}