/*-------- css code for responsive layout  --------*/

@media screen and (max-width: 1366px) {
    h1, h2, h3, h4, h5, h6, p {
        margin: 0;
        padding: 0;
    }
}


/*  1 - media screen and (max-width: 1199px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 1199px) {
    .profile_image {
        width: 20%;
    }

    .profile_content {
        padding: 0px 25px;
        width: 30%;
    }

    .profile_content p {
        margin: 0;
    }

    .profile_data {
        padding: 0 25px;
        width: 50%;
        margin-top: 20px;
    }
    .sticky-button 
    {
      padding: 22px; /* Smaller size of the button */
      font-size: 30px; /* Slightly smaller icon */
      right:100px;
    }
    .sticky-button i {
      font-size: 32px; /* Adjust icon size */ /* Adjust icon size */
    }
}


/*  2 - media screen and (max-width: 991px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 991px) {
    .bgCream {
        padding: 0 15px;
    }

    .profile_image {
        width: 20%;
        padding: 0px 10px;
    }

    .profile_content {
        padding: 0px 10px;
        width: 30%;
    }

    .profile_content h3 a {
        font-size: 16px;
    }

    .profile_content p {
        margin: 0;
        font-size: 14px;
    }

    .profile_data {
        padding: 0 10px;
        width: 50%;
        margin-top: 10px;
    }

    .profile_data a p {
        padding: 0;
        margin: 0;
        line-height: 14px;
        vertical-align: top;
        font-size: 12px;
    }
    .sticky-button 
    {
      padding: 20px; /* Further reduce the size of the button */
      font-size: 28px; /* Adjust icon size */
      right:50px;
    }
    .sticky-button i 
    {
      font-size: 30px; /* Adjust icon size */
    }
}


/*  3 - media screen and (max-width: 767px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 767px) {
    .body-content {
        display: inline-table;
    }

    .search-right {
        float: right;
        width: 100%;
    }

    .search-content {
        width: 100%;
    }

    .profile_image {
        width: 40%;
    }

    .profile_image img {
        max-width: 100px;
    }

    .profile_content {
        width: 60%;
    }

    .profile_data {
        width: 100%;
        margin-top: 30px;
    }

    .funeral-list-items ul li .profile_info {
        display: block !important;
    }
    
     
    /* Hide all page items by default */
    li.page-item {
        display: none;
    }
    
    /* Show the first, last, and active page items */
    .page-item:first-child,
    .page-item:last-child,
    .page-item.active,
    .page-item.first,
    .page-item.last {
        display: block;
    }
    
    .sticky-button 
    {
      padding: 18px; /* Reduce size even more for small screens */
      font-size: 24px; /* Adjust icon size */
      right:70px;
    }
    .sticky-button i {
        font-size: 24px; /* Adjust icon size */
    }
    
}


/*  4 - media screen and (max-width: 580px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 580px) {}


/*  1 - media screen and (max-width: 480px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 480px) {
  
.sticky-button 
{
      padding: 15px; /* Even smaller button */
      font-size: 20px; /* Adjust icon size */
      right:40px;
  }
  .sticky-button i {
      font-size: 20px; /* Adjust icon size */
  }
}


/*  1 - media screen and (max-width: 420px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 420px) {}


/*  1 - media screen and (max-width: 375px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 375px) {}