@import url(fontawesome-all.min.css);
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,400italic,600italic|Roboto+Slab:400,700");


.hero-section {
    /* 1. Set the background image */
    background-image: url('https://www.pennympt.com/assets/images/patient.png'); 

    /* 2. Control image display and size */
    background-repeat: repeat-y; /*Should allow it to repeat only verically */
    background-size: cover; /* Ensures the image covers the entire section while maintaining aspect ratio */
    background-position: center; /* Centers the image within the section */
    opacity: 0.3;

    /* 3. Ensure the section has a defined size so the image is visible */
    height: 100vh; /* Example: Makes the section fill the entire vertical height of the viewport */
    /* Add padding/margin for content spacing as needed */
    padding: 20px;

   
}