body, html {
    font-family: Arial, sans-serif;
    margin: 20px;
    height: 100%
}
.container_father{ 
    display: flex; 
    flex-direction: column; 
    height: 100vh;
}
.top, .bottom { 
    padding: 5px; 
    text-align: center; 
} .mid {  
    align-items: center; 
}
.bottom { 
    margin-top: 10px;
    display: flex; 
    align-items: center; 
    justify-content: center; /* Canh giữa nút nộp bài */ 
}
.text-background { 
    background-color: #007bff;
    padding: 10px; 
    border-radius: 5px; 
    color: white; 
    text-align: center;
}
label { 
    color: blue;
}   
.question {
    margin-bottom: 10px; /* Giảm khoảng cách giữa các câu hỏi */
    color: blue;
    padding-left: 10px; /* Thêm khoảng cách lề trái */
}
.question img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 10px auto; /* Center the image horizontally */
}
.container {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}
.left, .middle, .right {
    width: 30%; 
    padding: 10px;
    border: 1px solid #000; 
    border-radius: 5px; 
}
.right { 
    display: flex; 
    flex-direction: column; /* Hiển thị các phần tử theo chiều dọc */ 
    justify-content: top; /* Canh giữa các phần tử theo chiều ngang */ 
    align-items: center; /* Canh trên các phần tử theo chiều dọc */ 
    gap: 20px; /* Khoảng cách giữa các phần tử */ }
.middle {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Align items to the start */
}
select, input[type="radio"] {
    color: black; /* Màu đen cho các mục chọn */
}
.question label {
    color: black; /* Màu đen cho các label trong câu hỏi */
    display: block; /* Display each label as a block to avoid wrapping issues */
    margin-top: 3px; /* Giảm khoảng cách giữa các tùy chọn */
}
.form-group {
    margin-top: 10px;
    display: flex;
    align-items: center; /* Canh giữa theo chiều dọc */
}
.form-group label {
    width: 150px; /* Đặt chiều rộng cố định cho nhãn */
    margin-left: 30px; /* Khoảng cách giữa nhãn và ô nhập liệu */
}
.form-group input, .form-group select {
    flex-basis: 100px; /* Đặt kích thước ban đầu cho các ô nhập liệu */ 
    flex-grow: 0.5; /* Tăng trưởng chỉ bằng một nửa */ 
    margin-left: 10px; /* Khoảng cách giữa nhãn và ô nhập liệu */
}
.right-result {
    margin-left: 20px;
}

.btn {
    display: flex;
    align-items: center;
    margin: 10px 0; /* Điều chỉnh khoảng cách nút */
    padding: 15px 25px;
    font-size: 16px;
    color: #fff;
    background: #007bff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.3s; /* Thêm hiệu ứng chuyển màu */
}
.btn:hover {
    background: #0056b3;
}