.play-ground{
	/*border:1px solid red;*/
}

#eingabe-wrapper{
	width:100%;
	height:auto;
	/*text-align:center;*/
	/*border:1px solid green;*/
}

label {
    display: inline-block;
    width: 35px;
    /* height: 18px; */
    padding: 2px 5px;
    line-height: 19px;
    font-size: 13px;
    cursor: pointer;
    /* border: 1px solid white;*/
}

input[type='text']{
    width: 30px;
    height: 10px;
    font-size: 16px;
    background-color: var(--white);
    color: var(--black) !important;
    margin-bottom: 0 !important;
    text-align: center;
}

input#hex-input{
	width: 100px;
}

#steuereinheit{
	text-align:left;
	margin:10px 0;
	padding:10px 0;
	/*border:1px solid yellow;*/
}

.flex-left {
    justify-content: left;
    /*border: 1px solid green;*/
}

/* START::: range */
#range-wrapper{
	margin-left:10px;
}

.range-wrapper{
	text-align:center;
}

/* Der Slider-Track (Linie) */
input[type="range"]{
    width: 350px;
}

/* ENDE::: range */

.ausgabe-wrapper{
	width: 60%;
    margin-top: 16px;
    /*border: 1px solid green;	*/
}

#rgb-ausgabe-wrapper{
	margin-top:20px;
}

.bundle-rgb{
	margin: 10px 10px 10px 0px;
    padding: 10px;
    text-align: center;
    /*border: 1px solid white !important;*/
}

.rgbOutput{
	/*width: 160px;*/
    padding: 7px;
    font-weight: 600;
    border-radius: 5px;
    border: 1px solid var(--white);
}

#rgba-output{
	width: 160px;
}

#show-div{
	width: 250px;
    height: 50px;
    margin: 0 auto;
    background-color: #FFFFFF;
    /*border: 1px solid blue;*/
}

.copy-button{
	font-size:13px;
	width:auto;
	height:auto;
	padding:3px 5px;
	background-color:var(--white);
	cursor:pointer;
}

input.red{
	color:var(--red) !important;
}
input.green{
	color:var(--skillflow-base-font-color) !important;
}