body {
    margin: 0px;

        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

            background-color: #f5f5f5;

                color: #333;
}

header {
    background-color: #2c3e50;

        color: #fff;

            padding: 20px;

                text-align: center;
}

main {
    display: flex;

        min-height: 100vh;
}

.sidebar {
    width: 250px;

        background-color: #34495e;

            color: #fff;

                padding: 20px;
}

.sidebar ul {
    margin-bottom: 15px;
}

.sidebar a {
    color: #ecf0f1;

        text-decoration: none;

            display: block;

                transition: background 0.3s;

                    padding: 8px 12px;

                        border-radius: 5px;
}

.sidebar a:hover {
    background-color: #2c3e50;
}

.content {
    flex: 1px;

        padding: 30px;
}

section {
    background-color: #3c6288;
    
        color: #fff;
        
            text-align: center;
}

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

        color: #fff;

            border: none;

                padding: 0.4rem 0.8rem;

                    border-radius: 4px;

                        cursor: pointer;

                            font-size: 0.9rem;

                                transition: background-color 0.3s;
}

.delete-btn:hover {
    background-color: #c82333;
}

#task-list li {
    background-color: #b8b5b5;

        padding: 0.75rem;

            margin-bottom: 1rem;

                border-radius: 15px;

                    display: flex;

                        justify-content: space-between;

                            align-items: center;
}