/*
Add this to HTML file's section
*/
body {
font-family: 'Creepster', cursive; /* A fun Gothic font */
color: purple; /* Purple text color */
}
h1 {
font-size: 30px;
text-align: center; /* Center the h1 text */
}
button {
display: block; /* lay out as block element (put on own line) */
margin: 10px auto; /* Center the button horizontally with some space around */
background-color: orange; /* Orange background color */
border: 1px solid purple; /* Thin purple border */
border-radius: 10px; /* Rounded corners */
padding: 10px 20px; /* top/bottom left/right */
cursor: pointer;
font-size: 16px;
font-family: 'Creepster', cursive; /* button elements are elements that don't inherit font styles */
color: purple;
}
button:hover {
background-color: darkorange; /* Darker orange on hover */
}