
body {
    font-family: Roboto;
    font-weight: 400;
    background-color: #fffff7;
    color: #000;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Questrial";
    color: #2a4d9c;
}

h1 {
  font-size: 2.25rem;  /* 36px */
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 1rem;
}

h2 {
  font-size: 1.875rem; /* 30px */
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 0.875rem;
}

h3 {
  font-size: 1.5rem;   /* 24px */
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 0.75rem;
}

h4 {
  font-size: 1.25rem;  /* 20px */
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 0.6rem;
}

h5 {
  font-size: 1.125rem; /* 18px */
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

h6 {
  font-size: 1rem;     /* 16px */
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 0.4rem;
}


.lucille-background {
    background: url("../images/MCH.webp") no-repeat center center;
    background-size: contain;
    height: 200px; /* Adjust height as needed */
    }


.card .card-header {
    border-radius: 3px;
    padding: 1rem 15px;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: -30px;
    border: 0;
    background: linear-gradient(90deg, #0b3c5d,#328cc1); 


    color: #fff;
    font-family: Questrial;
    font-weight: 400;
}    

.gradient-button {
      background: linear-gradient(60deg, #0b3c5d,#328cc1); 
      color:#fff;
      
}

.card-title,
.title,
.info-title {
    font-family: "Questrial";
    font-weight: 400;
}

  /* Visions Homes */

    .grayhope {
        color: #999;
    }
    
    .romeo {
        text-align: center;
    }
    
    .rookie {
        font-size: 1.6em;
    }
    
    .smaller {
        color: #999;
        font-size: 0.7em;
    }
    
    card-text {
        font-weight: 500;
        font-size:1.7em;
    }
    
    /* Parent Wrapper */
    .wrapper {
        display: flex;
        /* Aligns containers side by side */
        justify-content: center;
        /* Centers them horizontally */
        gap: 20px;
        /* Adds spacing between circles */
        padding: 20px;
    }
    
    /* Circular Containers */
    .circle {
        width: 400px;
        height: 400px;
        background-size: contain;
        /* Ensures full image is visible */
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 50%;
        /* Makes it circular */
        border: 5px solid #333;
        /* Optional: Border for visibility */
    }
    
    /* Background Images */
    .circle-1 {
        background-image: url("../images/visions-homes/img-1121.jpg");
        /* Replace with your image */
        background-size: contain;
        height: 400px;
    }
    
    .circle-2 {
        background-image: url("../images/visions-homes/Screenshot-2023-03-18.jpg");
        /* Replace with another image */
        height: 400px;
        background-size: contain;
    }
    
    /* Responsive Fix for Smaller Screens */
    @media (max-width: 850px) {
        .wrapper {
            flex-direction: column;
            /* Stack circles on smaller screens */
            align-items: center;
        }
    }

 
/* Style for thumbnails */
.gallery-thumbnail {
  width: 160px;
  height: auto;
  border-radius: 6px;
}

.gradient-button {
      background: linear-gradient(60deg, #0b3c5d,#328cc1); 
      color:#fff;
      
}

/*for screen readers */

.screen-reader-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap; /* prevent line breaks */
  border: 0;
}