/* CSS document for homework2.html 
Author: Andrew Addens
*/

/* ID that centers the validation text */
#validation {
    text-align: center;
}

/* add a margin around the entire footer */
footer {
    margin:50px;
}

body {
    background-color: rgb(18, 177, 124);
}

h1 {
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}

#container {
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}

#container2 {
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}

/* Class to create a text box */
.box {
    width: 300px;            /* Set width of the box */
    padding: 20px;           /* Add space inside the box */
    margin: 20px auto;       /* Center the box and add margin */
    border: 2px solid #110101;  /* Add a light border */
    border-radius: 8px;      /* Round the corners */
    background-color: #0a5e44;  /* Set a light background color */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);  /* Add a subtle shadow */
    text-align: center;      /* Center the text inside the box */
  }


/* Class to style the button */
.button {
    padding: 10px 20px;           /* Add space inside the button */
    background-color: #06412e;    /* Sets background color*/
    color: rgb(0, 0, 0);          /* Set text color to Black */
    font-size: 20px;               /* Set font size */
    font-weight: bold;             /* Bold font */
    border: none;                 /* Remove default border */
    border-radius: 8px;           /* Round the corners */
    cursor:crosshair;              /* Change cursor to a crosshair when hovered */
    transition: background-color 0.3s ease; /* transition effect */
  }
  
  /* Change the button color when hovering */
  .button:hover {
    background-color: #3f6656;  
  }