/*Fonts*/

@font-face {
  font-family: BigNoodleTitling;
	src: url(../../../images/hope/fonts/big_noodle_titling.ttf) format("TrueType");}
	
	@import url(https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap);

/* tabstorys mit radio-Buttons */
.tabstorybed figure {
    display: block; 
   margin-left: 0; 
   clear: both;
   background-color:#474740;
 
}

.tabstorybed > input,
.tabstorybed figure > div {
 display: none;
 height:490px;
}

.tabstorybed figure>div {
  padding: 10px;
  width: 530px;
  background: #474740;
  line-height: 1.5em;
  color: #d0d8dc;
  height: 478px;
}

#tabstory1:checked ~ figure .tabstory1,
#tabstory2:checked ~ figure .tabstory2,
#tabstory3:checked ~ figure .tabstory3,
#tabstory4:checked ~ figure .tabstory4 {
	display: block;
}

navstory label {
   float: left;
   padding: 5px;
   background: #7a9577;
   color: #474740;
   width:23%;
   font-family: BigNoodleTitling;
   text-align:center;
   text-transform:uppercase;
   font-size:15pt;
}

navstory label:nth-child(1) {
}

navstory label:hover {
 background: #3d3d37; 
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	-o-transition: all ease 0.8s;
	transition: all ease 0.8s;
	text-decoration: none;
}

navstory label:active {
 background: #3d3d37;
}

#tabstory1:checked ~ navstory label[for="tabstory1"],
#tabstory2:checked ~ navstory label[for="tabstory2"],
#tabstory3:checked ~ navstory label[for="tabstory3"],
#tabstory4:checked ~ navstory label[for="tabstory4"] {
  background: #3d3d37;
  color: #d0d8dc;
  position: relative;
  width:23%;
  font-family: BigNoodleTitling;
  text-align:center;
}

#tabstory1:checked ~ navstory label[for="tabstory1"]:after,
#tabstory2:checked ~ navstory label[for="tabstory2"]:after,
#tabstory3:checked ~ navstory label[for="tabstory3"]:after,
#tabstory4:checked ~ navstory label[for="tabstory4"]:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  background: #3d3d37;
}

/*Allgemein*/
.storylinebox{
   width:550px;
   height: 572px;
   background-color:#474740;
}

.storylinehead{
font-family: BigNoodleTitling;
text-align:center;
font-size:30pt;
color:#a3bda8;
background-color:#585f5a;
padding: 20px;
}

.storylinehead2{
font-family: BigNoodleTitling;
text-align:center;
font-size:18pt;
color:#a3bda8;
background-color:#585f5a;
padding:10px;
}

.storylinetext1{color: #d0d8dc;
font-family: 'Anaheim', sans-serif;
font-size:11pt;
text-align:justify;
padding:5px;
height: 457px;
overflow:auto;}

.storylinetext2{
color: #d0d8dc;
font-family: 'Anaheim', sans-serif;
font-size:11pt;
text-align:justify;
padding:5px;
}

/*Zeitungsartikel*/

/*
.storyzeitback{background-image:url(https://hope-rpg.de/images/storyline/storyzeit1.png);
height: 450px;
width:450px;}

.storyzeithead{
color: #000;
text-align:center;
font-size:25pt;
font-family: 'UnifrakturMaguntia', cursive;
border-bottom:1px solid #000;
display:block;
margin:5px 10px;
padding-top:10px;
}

.storyzeithead2{
color: #000;
text-align:center;
font-size:15pt;
font-family: 'UnifrakturMaguntia', cursive;
display:block;
padding-top:5px;
}

.storyzeitsub{
font-family: 'Anaheim', sans-serif;
font-size:8pt;
text-align:right;
text-transform:uppercase;
color:#000;
padding-right:20px;
}

.storyzeittext{font-family: 'Anaheim', sans-serif;
font-size:10pt;
color:#000;
text-align:justify;
width:400px;
height: 335px;
overflow:auto;
padding:10px;
margin:5px 10px;}

.hopestorylineshortfact{
width:160px;
background:#7a9577;
margin:4px;
font-size:13pt;
line-height:20px;
text-align:center;
color:#474740;
text-transform:uppercase;
display:block;
float:left;
font-family:'Anaheim', sans-serif;
}

.hopestorylineshortfact a{
color:#474740;
}

.hopestorylineshortfact a:hover{
color:#3d3d37;
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	-o-transition: all ease 0.8s;
	transition: all ease 0.8s;
	text-decoration: none;
}

*/