body {
    font-family: Arial, sans-serif;
}

.hero {
    background-image: url('/img/dctor.jpg');
    background-size: cover;
    color: white;
    text-align: center;
    padding: 100px 0;
    position: relative;
}

    .hero::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
    }

    .hero .hero-content {
        position: relative;
        z-index: 2;
    }

.info-box {
    background: #007bff;
    color: white;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    transition: transform 0.3s ease-in-out;
}

    .info-box:hover {
        transform: scale(1.05);
    }

    .info-box i {
        font-size: 40px;
        margin-bottom: 10px;
    }