*{
    margin: 0;
    padding:0;
    box-sizing: border-box;
}
.hhh{
    border: 2px solid rgb(33, 34, 33);
    border-radius: 10px;
   display: inline-block;
   
   align-items: center;
   padding: 20px;
   margin: 5px;
   background: linear-gradient(#f4f3f8,#63acff);
   opacity: 80%;
    margin: 15px;
    box-shadow: 0 5px 5px rgba(0,0,0,0.4);      
     cursor: pointer;
    
           
}
.hhh:hover{
    transform: scale(1.1);
    transition: transform 0.5s;
     /* Nhấc thẻ nổi lên trên 10px */
            transform: translateY(-12px);

            /* Tăng độ đậm và lan rộng của bóng mờ bên dưới */
            box-shadow: 0 20px 30px rgba(11, 11, 11, 0.2);

            /* Viền đổi sang màu xanh nổi bật */
            border-color: #24a8ff;
            background: linear-gradient(#f4f3f8,#3d77ff);
}
img{
    border-radius: 10px;
    box-shadow: 5px 5px 5px rgba(0,0,0,0.1)
}

a{
    text-decoration: none ;
    font-size: 100%;
    color: #131414;
}
       
body {
           
            background: linear-gradient(#fdfdff,#8cd5fc);
            opacity: 100%;
            margin: 0;
            padding: 40px 20px;
        }

        h2 {
            text-align: center;
            color: #2c3e50;
            font-size: 2.2rem;
            margin-bottom: 40px;
            text-transform: uppercase;
            letter-spacing: 1.5px;
        }

   
        .hhh:hover h3 a {
            color: #0098fd;
        }