.roulsback {
width:550px;
background-color:#dcdcce;
padding:8px;
}

.roulshead1{
font-family: 'Big Shoulders Stencil Text', cursive;
font-size:20pt;
text-align:center;
color:#d8d6cb;
text-transform:uppercase;
transform:rotate(270deg);
}

.roulshead1back{
background-color:#cd4b62;
}

.roulshead2{
font-family: 'Big Shoulders Stencil Text', cursive;
font-size:20pt;
text-align:center;
background-color:#cd4b62;
color:#d8d6cb;
text-transform:uppercase;
display:block;
}

.roulshead3{
font-family: 'Roboto Condensed', sans-serif;
font-size:13pt;
text-align:center;
background-color:#e0717d;
color:#d8d6cb;
font-weight:light;
text-transform:uppercase;
display:block;
}

.roulsbox{
 width:auto;
height:800px;
overflow:auto;
}

.roulstext{
width:auto;
height:auto;
font-family: 'Roboto Condensed', sans-serif;
color: #5e202b;
font-size:11pt;
text-align:justify;
padding:10px;
}

.roulstext a{
font-family: 'Roboto Condensed', sans-serif;
color: #5e202b;
text-decoration:none;
text-transform:uppercase;
}

.roulsaufgabe{
width:450px;
height:100px;
overflow:auto;
}

.roulsaufgabe quest{
 background-color:#e03d72;
width:210px;
padding:5px;
font-family: 'Roboto Condensed', sans-serif;
color:#d8d6cb;
font-size:9pt;
text-transform:uppercase;
text-align:center;
float:left;
margin:2px;
}

.roulsbox::-webkit-scrollbar {
background-color: #d8d6cb;
border:1px solid #e15974;
  width: 5px;
}

.roulsbox::-webkit-scrollbar-thumb {
    background-color: #e15974 !important;
}