body
{
    background-size : cover;
    font-size       : 20px;
    line-height     : 1.8em;
}
/*
.lauftext
.wc-frame
.wc-map
.button
.vp-content
.wc-disable
.wc-canvas

#title
#wc-menue
#wc-menuemap
#vp-button
#vp-content

*/
/* Styles zur WORD-CLOUD */
.wc-canvas
{
    width:100%;
    height:100%;
}
.wc-frame
{
    position:fixed;
    padding:20px;
    display:block;
    max-height: 70%;
}
#vp-outside
{
    position:fixed;
/*    display:block;*/
/*    max-height:70%;*/
    overflow:auto;
    padding-right:20px;
}
.lauftext
{
    position:fixed;
    padding:10px;
    vertical-align: middle;
/*    top:200px; */
    width: 100%;
    font-size: 250%;
    display: inline-block;
    /*    padding-left: 105%;*/
    max-width: 100vw; /* iOS braucht das */
    white-space: nowrap;
    overflow: hidden;
}
marquee
{
    /* animation: marquee 120s linear infinite;*/
    text-shadow: 2px 2px 5px var(--color-bg3);
}
marquee:hover {
    animation-play-state: paused;
}

/* Make it move */
@keyframes marquee {
    0%   {transform: translate3d(0,0,0);}
    100% {transform: translate3d(-100%,0,0);}
}

.smaller
{
    display:inline;
    font-size: 60%;
}
.image_small
{
    max-width:24px;
    max-height:24px;
    border: none;
}
.button_small
{
    width:24px;
    height:24px;
    border: none;
    cursor:pointer;
}
.button
{
    width:48px;
    height:48px;
    border: none;
    cursor:pointer;
}
#vp-button
{
    position:fixed;
    /* damit sitzt der Button auf dem Rahmen des Menues */
    margin-top:-20px;
    margin-left:-20px;
}
.vp-content
{
    position:relative;
    border-radius: 30px;
    padding : 20px;
    margin:10px;
/*    max-height:500px; /* mit % funktioniert hier nicht ?? */
/*    overflow:auto; */

}
.embedded
{
    margin:10px;
/*    overflow: auto;*/
/*    max-height:80%; */
}
.wc-disable
{
    display:none;
}
/* Divv für Overlays */
.wc-map
{
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
/*    border: 2px ridge black; */
}
#wc-menue:hover
{
    z-index:200;
}
.wc-layer
{
    opacity:0.0;
    with:100%;
    height:100%;
}
area.active
{
    cursor:pointer;
}
.fade-in
{
    animation: fadeIn 1s;
}
@keyframes fadeIn {
    0% {
	opacity: 0;
/*	height: 0;*/
/*	width: 0;*/
    }
    100% {
	opacity: 1.0;
/*	height:70%;*/
/*	width:70%;*/
    }
}
.fancy
{
    position:relative;
    left:10%;
    width:70%;
    align:center;
/*    margin:50px; */
    padding:50px;
    font-size:120%;
/*    border-radius: 30px; */
}
a
{
    text-decoration: none;
    padding:6px;
}
.marker
{
    text-shadow: 2px 2px 5px var(--color-bg3);
    color: var(--color-high);
}