body {
	background: rgb(255,164,0);
	background: linear-gradient(140deg, rgb(34, 34, 34) 0%, rgb(0, 0, 0) 100%);
	font-family: "Karla", sans-serif;
	background-size: cover;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	text-align: left;
	color: white;
}

#app-box {
	bottom: 60vh;
	width:auto;
	height:fit-content;
	background-color: #1e2a37;
	padding: 40px;
	border-radius: 25px;
	padding-left: 30px;
	padding-right: 30px;
	margin: auto auto;
}

h1 {
	font-family: "Karla", sans-serif;
	font-weight: 800;
}

p {
	color: #c5c5c5;
}

#len-text{
	margin-top: 30px;
	margin-bottom: 10px;
}

#greenstyle {
	color: #0fb980;
	display: flex;
	line-height: 0px;
	padding-bottom: 5px;
}

button {
	background-color: #0fb980;
	border: none;
	width: fit-content;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
	padding-bottom: 10px;

	color: white;
	border-radius: 5px;
	transition: 0.5s;
}

#len-input {
	background-color: #cacaca8c;
	border: none;
	width: 100px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
	padding-bottom: 10px;

	color: white;
	border-radius: 5px;
	transition: 0.5s;
}

#char-check {
	margin-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
}

button:hover {
	background-color: #32dfa5;
	
}

hr {
	border-color: #273648;
	margin-top: 40px;
	margin-bottom: 40px;
	background-color: rgba(255, 255, 255, 0);
}

.passbox {
    display: inline-flex;
    align-items: center;
    justify-content: center;
	margin-bottom: 20px;
    margin-right: 20px;
    height: 40px;
    border-radius: 10px;
    background-color: #273648;
    color: #28db9f;
    padding: 0 10px;
    line-height: 1;
	width: 250px;
	transition: 1s;
}

.passbox p {
	padding-left: 30px;
	padding-right: 30px;
	cursor: copy;
}

#copy {
	text-align: left;
	margin-top: -10px;
}

#signature {
	position: fixed;
	bottom: 0;
	right: 20;
	text-align: right;
}