#note-creation input, 
#note-creation textarea, 
#note-creation select, 
#note-creation button {
    width: 98%;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-size: 16px;
}

#note-creation select,
#note-creation button {
	width:25%;
}

div.note-description {
	font-family: hroman;
	font-size: 16px;
	color: #000000;
}

div#notetext {
	font-family: hroman;
	font-size: 16px;
	color: #000000;
}

#note-creation {
	background-color: #ffffff;
	padding: 20px;
	margin: 20px;
	border-radius: 5px;
	box-shadow: 0px 2px 8px rgba(0,0,0,0.2);
}

#notes-list {
	padding: 20px;
}

.note {
	background-color: #ffffff;
	padding: 20px;
	margin-bottom: 10px;
	border-radius: 5px;
	box-shadow: 0px 2px 8px rgba(0,0,0,0.2);
	position: relative;
}

.note textarea {
    width: 98%;
}

.note-content {
	display: none;
	margin-top: 10px;
	padding: 10px;
	border-radius: 5px;
	border: 1px solid #ccc;
	font-family: monospace;
}

.show-btn, .delete-btn {
	margin-top: 10px;
	padding: 5px 10px;
	border-radius: 5px;
	border: none;
	cursor: pointer;
}

.show-btn {
	background-color: #007bff;
	color: white;
}

.delete-btn {
	background-color: #dc3545;
	color: white;
}

.time-to-remove {
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 12px;
	color: #888;
}