static/style.css

*{
  padding: 0%;
  margin: 0%;
}
body {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50vh; 
  background-color:#001C30;
         /* Add some margin around the body */
  }
  .all {
    background-color: #7895CB;
    border-radius: 20px;
    border: none;
  }
  
  h1 {
    background-color: #7895CB; /* Light blue background */
    color: #001C30;               /* Dark text color for readability */
    padding: 10px 20px;
    border-radius: 5px;
    margin: 10px;
    
     display: flex;
    justify-content: center;
    text-align: center;   
          /* Rounded corners */
  }
  .login {
    border: none; /* Add a border to the login form */
    padding: 10px;         /* Add some padding inside the form */
    border-radius: 3px;    /* Add rounded corners to the form */
  }
  
  .mb-3 {
    margin-bottom: 1rem;  /* Class for spacing between form elements */
  }
  
  .form-label {
    display: flex;        /* Make labels appear on separate lines */
    margin-bottom: 5px;
    border: none;
      /* Add space below labels */
  }
  
  .btn-primary {
    background-color: #3C5B6F; /* Set blue color for button */
    color: #001C30;             /* Set white text color for button */
    border: none;            /* Remove button border */
    padding: 10px 20px;       /* Add padding to the button */
    border-radius: 5px;  
    border-color: #001C30;
    display: flex;
    justify-content: center;
    text-align: center;    /* Add rounded corners to button */
  }
  select {
    width: 100%;  /* Make select boxes fill full width */
  }
  
  input[type="number"] {
    width: 50%;  /* Set width for number input fields */
  }
  h2 {
    display: flex;
    justify-content: center;
    text-align: center;  /* Center align the prediction result */
    color: #001C30;       /* Set green color for the prediction */
  }
  legend {
    font-size: 1.5rem;  /* Adjust font size as needed */
    padding: 5px;        /* Adjust padding for spacing */
  }