/* class selector */
.avatar {
    width: 250px;
    height: 250px;
    /* Chống méo hình */
    object-fit: cover;

    /* Tạo hình tròn */
    border-radius: 50%;
}

h1 {
    /* Chuyển thành chữ hoa hết */
    text-transform: uppercase;
}

.bold {
    /* chữ đậm */
    font-weight: bold;
    color: rgb(198, 85, 142)
}

/* type selector */
/* Đặc trưng là tên thẻ */
h2 {
    font-size: 24px;
    /* Tạo đường gạch dưới */
    text-decoration: underline;
}

/* Khoảng trắng giữa img và .family đọc là nằm trong */
/* Chọn thẻ img nằm trong class family để định dạng */
.family img {
    width: 200px;
    height: 200px;
    /* Sửa lỗi méo hình */
    object-fit: cover;
    border-radius: 5px;
}

/* class family và hobby có cùng định dạng */
.family,
.hobby {
    /* justify-content phải đi chung với display:flex */
    display: flex;
    /* Giản các hình bằng nhau theo chiều ngang */
    justify-content: space-evenly;
    /* Cột sẽ xuống dòng nếu không đủ chỗ */
    flex-wrap: wrap;
}


.hobby img {
    width: 200px;
    height: 200px;
    /* Bo tròn  */
    border-radius: 50%;
    /* Fix lỗi méo hình */
    object-fit: cover;
}

body {
    /* Chữ/hình nằm giữa */
    text-align: center;
}

img {
    border: 1px solid grey;
}

figcaption {
    color: rgb(65, 13, 236);
}

hr {
    /* Tắt hết tất cả border 4 hướng: top/left/bottom/right */
    border: none;

    border-top: 1px solid grey;
}