body {
    color: #fff;
    background-image: url('https://images.pexels.com/photos/5797899/pexels-photo-5797899.jpeg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    min-height: 100vh;
  }
  .navbar{
    background-color: rgb(250, 155, 155);
  }
  .navbar .navbar-brand{
    color: #000;
    font-weight: 900;
  }
  .card {
    background-color: rgb(255, 255, 255);
    border: none;
    border-radius: 16px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    transition: all 0.3s ease-in-out;
    margin-bottom: 20px;
  }
  
  .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.7);
  }
  
  .card-header {
    background-color: rgb(252, 133, 133);
    color: #fff;
  }
  
  .form-control {
    background-color: rgb(255, 255, 255); 
    color: #000000;
    border: none;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 2px 4px rgb(60, 0, 255);
  }
  
  .form-control:focus {
    box-shadow: 0 0 10px rgba(255, 0, 0, 0.722);
  }
  
  .form-control::placeholder {
    color: #484545;
  }
  
  .list-group-item {
    background-color: rgba(255, 255, 255, 0.3);
    box-shadow: 0 2px 4px 0 red;
    color: #333;
    border: none;
    transition: all 0.3s ease-in-out;
    margin: 10px;
    transform: translateY(0);
  }
  
  .list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-5px);
    transition: background-color 0.3s ease-in-out, transform 0.3s ease-in-out;
    
  }
  
  .list-group-item.checked {
    text-decoration: line-through;
    color: #999;
  }
  
  .btn-primary {
    background-color: #1900ff;
    transition: all 0.3s ease-in-out;
    color: #fff;
  }
  
  .btn-primary:hover {
    background-color: #1900ff;
    border-color: #102163;
  }
  
  .btn-danger {
    background-color: #ff0000;
    border-color: #ff0000;
    transition: all 0.3s ease-in-out;
    color: #fff;
  }
  
  .btn-danger:hover {
    background-color: #a81818;
    border-color: #8b2525;
  }