.mb-50{margin-bottom: 30px;}
.mb-20{margin-bottom: 20px;}
@media (min-width:992px){
    .mb-50{margin-bottom: 50px;}
}
/* aboutsection css start */
.aboutplayvideodiv{max-width: 105px; background: var(--web-lightblue);border-radius: 10px;padding: 10px 15px;color: var(--web-white);font-size: 12px;line-height: 16px;text-align: left; margin-left: auto; margin-top:15px;}
.aboutplayvideodiv .playvideoicondiv img{width: 24px;}
.aboutplayvideodiv .playvideoicondiv{gap:10px; margin-bottom: 10px;font-weight: 700;}
.aboutimagesmaindiv .abouticon{position: absolute; left: 0; top: 0;}
.aboutimagesmaindiv .abouticon img{max-width: 92px;}
.aboutimagesmaindiv .aboutimg1{width: calc(100% - 34%);text-align: right; margin-left: auto;}
.aboutimagesmaindiv .aboutimg1 img{border-radius: 30px; width: 100%;}
.aboutimagesmaindiv .aboutimg2{width: calc(100% - 34%);position: absolute;top: 120px;}
.aboutimagesmaindiv .aboutimg2 img{border-radius: 0 0 0px 30px; width: 100%;}
.abouttitle{margin-top: 10px;margin-bottom: 10px;}
.aboutlist {display: grid; grid-template-columns: 1fr 1fr; gap: 10px;}
.aboutbtn{margin-top: 20px;}
#videopopup .btn-close{    position: absolute;top: -34px; right: 0;filter: invert(100%) brightness(200%);opacity: 1;}
#videopopup .modal-body{padding: 0px;}
#videopopup .modal-content{border: none;border-radius: 0;}
.redrequestquote{font-size: 16px !important;line-height: 24px  !important;font-weight: 900;text-align: center;text-transform: uppercase;background: var(--red-color);}
.contactbottomiconimg.aboutplayvideodiv{background: none;padding: 0;margin-top: 10px;}
@media (min-width:576px){
  .aboutimagesmaindiv .aboutimg1{width: calc(100% -42%);}
  .aboutimagesmaindiv .aboutimg2{width: calc(100% - 42%);top: 200px;}
  .aboutplayvideodiv{    padding: 20px 10px;max-width: 190px;}
  .aboutplayvideodiv .playvideoicondiv img{width: auto;}
  .aboutimagesmaindiv .abouticon img{    max-width: 164px;}
  .aboutplayvideodiv{margin-top: 30px;}
}
@media (min-width:768px){
  .redrequestquote{font-size: 22px !important;line-height: 30px  !important;}
  .aboutbtn{margin-top: 40px;}
  .abouttitle{margin-top: 20px; margin-bottom: 20px;}
  .aboutplayvideodiv{    padding: 40px 20px;max-width: 190px;}  
 
  .aboutplayvideodiv{font-size: 16px;line-height: 25px;}
  .aboutimagesmaindiv .aboutimg1{width: calc(100% -37%);}
  .aboutimagesmaindiv .aboutimg2{width: calc(100% - 37%);}
}
@media (min-width:992px){
  .aboutimagesmaindiv .aboutimg1{width: calc(100% -45%);}
  .aboutimagesmaindiv .aboutimg2{width: calc(100% - 45%);}
}
@media (min-width:1200px){
  .aboutimagesmaindiv .aboutimg1{width: calc(100% - 40%);}
  .aboutimagesmaindiv .aboutimg2{width: calc(100% - 40%);}
}
@media (min-width:1400px){
  .aboutimagesmaindiv .aboutimg1{width: calc(100% - 37%);}
  .aboutimagesmaindiv .aboutimg2{width: calc(100% - 37%);}
}
@media (max-width:400px){
  .aboutimagesmaindiv .aboutimg1{width: calc(100% - 120px);}
  .aboutimagesmaindiv .aboutimg2{width: calc(100% - 120px);}
}
/* aboutsection css end */

/* searchsubarb section css */
.searchmapsection{background: var(--web-blue);border-radius: 20px;padding: 30px;}
.searchsubarbtitle{font-family: var(--web-titlefont-family1);font-size: 42px;line-height: 42px;font-weight: 800;color: var(--web-white); margin-bottom: 25px;}
.searchsubarbsubtitle{font-family: var(--web-titlefont-family1); font-size: 24px; font-weight: 400; line-height: 28px;color: var(--web-white);margin-bottom: 25px;}
.searchbuttongroup{margin-top: 25px;display: flex; align-items: center;justify-content: space-between;font-family: var(--web-titlefont-family1); font-size: 28px;
  font-weight: 400; line-height: 28px; color: var(--web-white); }
.searchbuttongroup .btn{font-family: var(--web-titlefont-family1); font-size: 17px; font-weight: 500; line-height: 20px; letter-spacing: -0.03em;
  text-align: left;padding: 19px 30px;text-align: center;  }
 .searchbuttongroup .btn.btnblue:hover, .searchbuttongroup .btn.btnblue:active, .searchbuttongroup .btn.btnblue:focus, .searchbuttongroup .btn.btnblue:not(:disabled):not(.disabled):active, .searchbuttongroup .btn.btnblue:not(:disabled):not(.disabled):active:focus{background: var(--web-white);color: var(--web-blue); border-color: var(--web-white);}
.searchbuttongroup .btn.btncontact{background: #0BBAFB;text-decoration: underline; color: var(--red-color);}
.searchbuttongroup .btn.btncontact:hover, .searchbuttongroup .btn.btncontact:active, .searchbuttongroup .btn.btncontact:focus, .searchbuttongroup .btn.btncontact:not(:disabled):not(.disabled):active, .searchbuttongroup .btn.btncontact:not(:disabled):not(.disabled):active:focus{background: var(--web-white);color: var(--web-blue); border-color: var(--web-white);}
@media (min-width:768px){
  .searchbuttongroup .btn{min-width: 190px;}
  .searchsubarbtitle{font-size: 58px;line-height: 58px;}
  .searchsubarbsubtitle{font-size: 28px;line-height: 32.76px;}
  .searchmapsection{padding: 75px;}
}
/* searchsubarb section css end */


/* contact form autosuggetion css */
.page-template-contact-us .bannerbottomsection .wpcf7-form{position:relative;}
/* Suggestions container */
#suggestions-container {
    position: absolute; /* Ensure it's positioned relative to the input field */
    background: white; /* White background for suggestions */
    border: 1px solid #ccc; /* Light gray border */
    border-radius: 8px; /* Smooth rounded corners */
    max-height: 250px; /* Limit height to prevent it from overflowing */
    overflow-y: auto; /* Add scrollbar if results exceed max height */
    z-index: 10; /* Ensure it appears above other elements */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
    display: none; /* Hidden by default until suggestions are shown */
    margin-top: 5px; /* Spacing between input field and suggestions box */
    padding: 0; /* Remove default padding */
    width: 100%; /* Match the input field width */
}

/* Each suggestion item */
.suggestion-item {
    padding: 12px 16px; /* Add spacing around each suggestion */
    cursor: pointer; /* Show pointer cursor for clickable items */
    border-bottom: 1px solid #f0f0f0; /* Add a light divider between items */
    transition: background-color 0.2s ease; /* Smooth hover effect */
}

/* Remove the border for the last suggestion */
.suggestion-item:last-child {
    border-bottom: none;
}

/* Hover effect for suggestion items */
.suggestion-item:hover {
    background-color: #f7f7f7; /* Light gray background on hover */
}

/* Links inside suggestion items */
.suggestion-item a {
    text-decoration: none; /* Remove underline from links */
    color: #333; /* Dark text color */
    font-weight: 500; /* Slightly bolder text */
}
