#gradient{
	position: relative;
	background-image: linear-gradient(to right, rgb(255, 255, 255), rgb(0, 0, 255));
	flex-wrap: left;
	font-family: 'Handlee', cursive;
	text-align: center;
	background-position: fixed;
    margin: 20px;

}
#h1{
	background-position: fixed;
	text-transform: uppercase;
	font-family: 'Spirax', cursive;
	text-shadow: 1px 2px 3px 4px;
	text-shadow: 4px 4px #eee;
	border-width: 10px;
	border-color: linear-gradient(to right, rgb(60, 184, 237), rgb(178, 125, 193));
	border-style: double;
	border-radius: 10px;
	font-size: 40px;

}
#h2{
	text-shadow: 2px 3px #FFFFFF;

}
#textArea{
	height: 100px;
	width: 200px;
	border: solid black;
	padding: 10px;
}
#RandomBtn{
	background-position: fixed;
    display: inline-block;
    width: 20%;
    border: none;
    background-color: rgb( 51, 104, 255 );
    color: white;
    padding: 18px 28px;
    font-size: 14px;
    cursor: pointer;

    border : solid black;
}

#RandomBtn:hover {
    background-color: #fff;
    color: black;
}

#copy{
	background-position: center;
    display: inline-block;
    width: 20%;
    border: none;
    background-color: rgb(51, 104, 255);
    color: white;
    padding: 18px 28px;
    font-size: 14px;
    cursor: pointer;
    border : solid black;
}
#copy:hover {
    background-color: #fff;
    color: black;
}

.color1 .color2{
	border :4px solid black;
}

#colorpad{
	padding: 5%;
	background-position: fixed;
	margin: 70px;

}