.box1 {
    width: 350px; /* ขนาดกล่อง */
    background-color: #ffffff;
    border-radius: 5px;
    padding: 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
}

.box1:hover {
    transform: translateY(-5px);
}

.box1 h3 {
    margin-bottom: 10px; /* ระยะห่างของข้อความด้านล่าง */
    color: #000000; /* สีข้อความ */
}

.box1 p {
    color: #000000; /* สีข้อความ */
}
 
.box-img {
    width: 200px;
    height: 200px;
    border-radius: 15%; /* เพิ่มความโค้งของขอบรูปภาพ */
    overflow: hidden; /* ป้องกันรูปภาพเกินขอบของกล่อง */
    background-color: #f9f9f9; /* สีพื้นหลังของกล่อง */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* เพิ่มเงาให้กล่อง */
    display: flex; /* ให้เนื้อหาภายในกล่องเรียงตามแนวนอน */
    justify-content: center; /* จัดให้เนื้อหาอยู่ตรงกลางแนวนอน */
    align-items: center; /* จัดให้เนื้อหาอยู่ตรงกลางแนวตั้ง */
}

.box-img img {
    max-width: 100%; /* ให้รูปภาพเต็มขนาดกล่อง */
    max-height: 100%; /* ให้รูปภาพเต็มขนาดกล่อง */
}



.W1{
 margin-top: 10px;
}