/* Span color styling */
.highlight-green p {
    color: #007676;/* Green color */
}

.highlight-greener {
    color: #014444;/* Green color */
}

.highlight-yellow{
    color: #EFAF14;
}

 
 /*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widgets-container {
    margin: 40px 0 30px 0;
  }
  
  .widget-title {
    color: var(--heading-color);
    font-size: 20px;
    font-weight: 600;
    padding: 0 0 0 10px;
    margin: 0 0 20px 0;
    border-left: 4px solid var(--accent-color);
  }
  
  .widget-item {
    margin-bottom: 30px;
    background-color: color-mix(in srgb, #007676, transparent 98%);
    border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
    padding: 30px;
    border-radius: 5px;
  }
  
  .widget-item:last-child {
    margin-bottom: 0;
  }

  .blog-author-widget {
    text-align: center; /* Center-aligns all contents */
}
  
  .blog-author-widget img {
    max-width: 120px;
    margin-left: 30px;
  }
  
  .blog-author-widget h4 {
    font-weight: 600;
    font-size: 24px;
    margin-bottom: 0px;
    padding: 0;
    color: color-mix(in srgb, var(--default-color), transparent 20%);
  }

  /*--------------------------------------------------------------
# Image Container Widget Alignment
--------------------------------------------------------------*/
.image-container-widget {
  text-align: center;
  /* margin: 200px auto; */
  display: flex;
  justify-content: center;
  align-items: center;
}

.image-container-single-blog img {
  max-width: 100%; /* Let it take the full width of its container */
  height: auto;    /* Maintain aspect ratio */
  border-radius: 5px; /* Optional: Keep the rounded corners */
}

/* Optional: If you want to style the container similarly to the author widget */
.image-container-widget.widget-item {
  background-color: color-mix(in srgb, #007676, transparent 98%);
  border: 1px solid color-mix(in srgb, var(--default-color), transparent 90%);
  padding: 0px;
  border-radius: 5px;
}



.footer-social-icons-blog-page {
    display: flex; /* Ensures that the icons are displayed in a row */
    gap: 20px; /* Adjust spacing between icons as needed */
    justify-content: center; /* Aligns icons to the left or adjust to center if needed */
    margin-left: -1em;
    margin-top: 2.8em;
}

.footer-social-icons-blog-page a {
    display: flex; /* Ensures that the icon itself is centered */
    align-items: center;
    color: #000000; /* Icon color */
    text-decoration: none; /* Remove underline */
}

.footer-social-icons-blog-page i {
    font-size: 1.4em; /* Size of the icons */
    margin-right: 10px; /* Space between the icon and any accompanying text (if any) */
}

.footer-social-icons-blog-page a:hover i {
    color: #007676; /* Color change on hover */
}

/* bulleted list */
.custom-list li {
    list-style-type: none; /* Disable default numbering */
    position: relative; /* Allow positioning the bullet */
    padding-left: 20px; /* Add space for the bullet */
    margin-left: 2em;
    font-family: 'Garet', 'woff'; /* Apply the Garet-Thinner font */
    font-weight: 300; /* Use the extra light weight */
    letter-spacing: 2px; /* Apply the custom letter spacing */
}


.custom-list li::before {
    content: '•'; /* Unicode for bullet */
    position: absolute;
    left: 0;
    font-size: 1.2em;
    color: black; /* Customize bullet color */
}

@media (min-width: 359px) and (max-width: 766px) {
  .content p {
    text-align: justify; /* This will justify the text */
}
blockquote.highlight-green {
  padding: 7px 10px; 
  font-size: 15px; /* Adjust font size for readability on smaller screens */
  line-height: 1.5; /* Increase line height for readability */
  background-color: #e0f7e9; /* A soft green background to match the highlight-green class */
  border-left: 5px solid #007676; /* A left border to emphasize the blockquote */
  /* margin: 20px 0;  */
  border-radius: 5px; /* Soft border corners */
  text-align: justify; /* Justify the text for neat alignment */
}

blockquote.highlight-green p.garet-thinner {
  margin: 0; /* Ensure no additional margins on the paragraph inside the blockquote */
  font-size: 16px; /* Same font size as the blockquote for consistency */
  color: #333; /* Darker color for better contrast on smaller screens */
}

blockquote.highlight-green b.highlight-green {
  color: #007676; /* Highlight the bold text with a distinct green color */
}
.image-container-widget{
  margin-top: 3em;
}

.blog-author-widget img {
  max-width: 120px;
  margin: 0 auto;
}
.footer-social-icons-blog-page{
  justify-content: center;
}
}

/* Author Widget */
@media (min-width: 767px) and (max-width: 991px) {
  .blog-author-widget img {
    max-width: 120px;
    margin: 0 auto;
  }
  .footer-social-icons-blog-page{
    justify-content: center;
  }
  
  .image-container-widget{
    margin-top: 3em;
  }

}