/*
 * @Author: sherrinford
 * @Date: 2023-10-27 09:20:30
 * @LastEditors: 
 * @LastEditTime: 2023-11-2 14:07:16
 * @Description: index page css
*/

.header {
    height: 32vh;
    /* 根据实际需要调整高度 */
    background-image: url('');
    background-size: cover;
    /* 让背景图片完全覆盖整个div */
    background-repeat: no-repeat;
    background-position: center center;
    /* 让背景图片在div中居中 */
    display: flex;
    align-items: center;
    /* 垂直居中 */
    justify-content: center;
    /* 水平居中 */
    color: #fff;
    /* 文字颜色，根据需要调整 */
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    /* 为文字添加阴影以增加可读性 */
}

.container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}

.card {
    /* width: 300px;
    height: 250px; */
    display: flex;
    /* width: 75vw; */
    width: 36vw;
    height: 7vh;
    border: 1px solid #ccc;
    border-radius: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
    text-align: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    margin: 18px;
}

.card:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
}

.card img {
    /* width: 50%; */
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 15px 15px 0 0;
}

.card .text {
    display: flex;
    width: 50%;
    height: auto;
    margin: 0;
    font-size: 20px;
    color: rgba(247, 244, 230);
    background: rgba(130, 159, 128, 0.664);
    font-weight: 500;
    align-items: center;
    justify-content: center;
    text-align: left;
}