a {
  color: inherit;
}

h1, h2, h3, h4 {
  margin: 0;
  margin-bottom: 10px;
  margin-top: 10px;
}

h1 {
  font-size: 3em;
}

.hidden {
visibility: hidden;
}

/* Font Awesome */
.fa {
    width: 20px;
    height: 20px;
}

.fa1 {
    width: 20px;
    height: 20px;
	font-size: inherent;
}

.hide{
	display:none;
}
.hideN {
	display:none;
}

.translateN {
	animation-name: drehbuch;
    animation-duration:0.5s;
    animation-iteration-count:1;
	animation-fill-mode:forwards;
}

.translateN1 {
	animation-name: zwei;
    animation-duration:2s;
    animation-iteration-count:1;
	animation-fill-mode:forwards;
}


.second {
    margin-left: 5%;
    width: 95% !important;
}


.PickAndPlacePict {
	background-repeat: no-repeat;
    background-size: contain;
    background-position-x: center;
    background-position-y: center;
    width: 100%;
    height: 50px;
    /*border: 1px solid red;*/
	margin-left: 200px;
	margin-top: 150px;
}

@keyframes drehbuch {
    0% {
        ;
    }
    100% {
		width:305px;
		height:40px;
		visibility: visible;
        transform: translate(-400px, 0);
    }
    }


@keyframes zwei {
    0% {
         ;
    }
    100% {
		 
		 
		 transform: translate(-400px, 10px) scale(1.5) ;
    }
    }

/* ori

@keyframes drehbuch {
    0% {
        background-color:mediumpurple;
    }
    20% {
        background-color:orange;
        transform: translate(180px, 0);
    }
    40% {
        background-color:yellowgreen;
        border-radius: 50%;
        transform: translate(180px, 180px);
    }
    60% {
        background-color:deepskyblue;
        transform: translate(0, 180px);
    }
    80% {
        background-color:deepskyblue;
        transform: translate(90px, 90px) scale(2.5) rotate(70deg);
        border-radius: 50%;
    }
    100% {
        background-color:mediumpurple;
    }
}
*/

#menu1a {
   
    visibility: collapse;
    margin-left: 190px;
	margin-top: -100px;
    width: 100%;

}

#menu2a {
   
    visibility: collapse;
    margin-left: 190px;
	margin-top: -100px;
    width: 100%;

}

#menu1 {
    
    margin-top: 119px;
    margin-left: -80px;
    margin-right: 50px;  
	
}

.nav1 {
	cursor:pointer;
}

.nav1 li {
    width: 100%;
    border: 2px solid;
    margin-bottom: 5px;
    border-color: #fff;
    font-family: Helvetica;
	font-style: italic;
    font-weight: 600;
    padding: 1em;
    font-size: 12px;
    background-color: #3E5776;
    color: #ddd;
    transition: .3s background-color ease-in-out,
              .3s color ease-in-out;			  	
}

.nav1 li:hover {
    background-color: #666;
    color: #fff;
}


[data-tooltip-right]::after {
        content: attr(data-tooltip-right);
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.5s;
        position: relative;
        top: -53px;
        left: 100px;
        padding: -10px, -8px;
		font-size:1rem;
		max-height:52px;
		max-width: calc(-4px +100%);
		line-height: 200%;
		display: block;  
        width: 10em;
        z-index: 3;
        color: white; 
        background-color: #323232;
}

[data-tooltip-right]:hover::after {
        opacity: 0.95;
}

[data-tooltip-left]::after {
        content: attr(data-tooltip-left);
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.5s;
        position: relative;
        top: -53px;
		padding: -10px, -8px;
		font-size:1rem;
		max-height:52px;
		max-width: calc(-4px +100%);
		line-height: 200%;
        left: -180px;
        background-color: #323232; 
        width: 10em;
        z-index: 3;
		display: block; 
        color: white;         
}

[data-tooltip-left]:hover::after {
        opacity: 0.95;
}

[data-tooltip-top]::after {
        content: attr(data-tooltip-top);
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.5s;
        position: relative;
        top: -180px;
        left: -100px;
        display: block;  
        width: 15em;
        z-index: 3;
        color: white; 
        background-color: #323232;
}

[data-tooltip-top]:hover::after {
        opacity: 0.95;
}

[data-tooltip-bottom]::after {
        content: attr(data-tooltip-bottom);
        pointer-events: none;
        opacity: 0;
		padding: -10px, -8px;
		max-width: calc(-4px +100%);
		max-height:52px;
		line-height: 200%;
		font-size:1rem;
        transition: opacity 0.5s;
        position: relative;
        top: 20px;
        left: -45px;
        display: block;  
        width: 10em;
        z-index: 3;
        color: white; 
        background-color: #323232;
}

[data-tooltip-bottom]:hover::after {
        opacity: 0.95;
}