.input-div{
	position:relative;
	display:inline-block;
	width:270px;
	height:auto;
	margin:10px 0;
	background-color:var(--white);
	border:1px solid var(--skillflow-base-font-color);
	overflow:hidden;
}

input[name='myname'],
input[name='mypassword'],
input[name='copytext']
{
	width:227px;
	height:15px;
	background-color:var(--white);
	color:var(--black) !important;
	margin-bottom: 0 !important;
}

.delete-input, 
.look{
	position:relative;
	right:-30px;
	display:inline-block;
	padding:5px;
	cursor:pointer;
	color:var(--red) !important;
	font-weight:600;
	transition: right .5s;
}
.look{
	right:0;
	color:var(--black) !important;
	transition: none;
}

.delete-input-show{
	right:-5px;
	transition: right .5s;
}

/* START::: Open Close Menue */

.menue-wrapper{
	width:250px;
	height:250px;
	margin:10px auto;
	padding:10px;
	border:1px solid rgba(112,175,4,1);
	overflow:hidden;
}

.menue{
	position:relative;
	right:-247px;
	width:200px;
	height:160px;
	margin:10px auto;
	padding:10px;
	border:1px solid white;	
	transition: right .5s;
}

	.menue-show{
		right:10px;
		transition: right .5s;
	}

.open-close-wrapper{
	position:relative;
	height:19px;
	padding:10px;
	border-bottom:1px solid rgba(112,175,4,1);
	cursor:pointer;
}

.open-close{
    position: relative;
    top: -8px;
    width: 30px;
    height: 24px;
}

.before{
	position:absolute;
	top: 0px;
	left:0;
	width:30px;
	height:2px;
	background-color:white;
	transform: rotate(0deg);
	transition: transform .5s, top .5s;
}
	.before-show{
		top:11px;
		transform: rotate(45deg);
		transition: transform .5s, top .5s;
	}

.half{
	position: absolute;
	top: 11px;
	width:15px;
	height:2px;
	background-color:white;
	transition: width .5s;
}
	.half-show{
		width:0;
		transition: width .5s;
	}

.after{
	position:absolute;
	bottom: 0px;
	left:0;
	width:30px;
	height:2px;
	background-color:white;
	transform: rotate(0deg);
	transition: transform .5s, top .5s;
}
	.after-show{
		bottom:11px;
		transform: rotate(-45deg);
		transition: transform .5s, bottom .5s;
	}



/* Ende::: Open Close Menue */

/* START::: Du Mensch? */
.output-mensch{
	width:300px;
	height:25px;
	border:1px solid white;
	padding: 5px;
}

input[name='mensch']{
    width: 200px !important;
    height: 15px !important;
    background-color: var(--white);
    color: var(--black) !important;
    margin-bottom: 0 !important;
}

.incorrect{
	color:red !important;
}

.correct{
	color:rgba(112, 175, 4, 1) !important;
}

/* ENDE::: Du Mensch? */

#target.copy-text{
    text-align: left !important;
	padding:10px !important;
}