/*
Theme Name:     MSI Engineers
Theme URI:      https://welldressedwalrus.com/
Template:       kadence
Author:         Well Dressed Walrus
Author URI:     https://welldressedwalrus.com/
Description:    A Custom Theme from Well Dressed Walrus for your website.
Version:        1.2
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kadence-child
*/

/* Theme customization starts here
-------------------------------------------------------------- */

/************************************ Everything *************************************/

/************************************ Header *************************************/

/************************************ Footer *************************************/
#menu-footer-menu {
  display: flex;
  flex-wrap: wrap; /* Allows items to wrap to the next line */
  list-style: none; /* Removes bullet points */
  padding: 0; /* Removes default padding */
  margin: 0; /* Removes default margin */
  /* Adjust this width as needed for your layout */
  max-width: 400px; /* Example width to encourage two columns */
}

#menu-footer-menu li {
  flex: 1 1 50%; /* Each item takes up roughly 50% of the available width */
  box-sizing: border-box; /* Include padding and border in the element's total width and height */
  padding: 5px 10px; /* Example padding for list items */
}
/************************************ Homepage *************************************/
.hp-bullet {
  list-style: none; /* Removes the default bullet points */
  padding: 0;       /* Removes default padding that can offset the custom bullet */
  margin: 0;
}
.hp-bullet li {
  background-image: url('/wp-content/uploads/2025/06/icon_Chevron.png');
  background-repeat: no-repeat;
  background-position: 0 50%; /* Adjust this to position the image vertically */
  background-size: 25px 25px;  /* Adjust size as needed, or remove if you want original size */
  padding-left: 40px; /* Adjust this to make space for the image */
}

/* Existing CSS for .four-col */
.four-col {
  display: flex;
  flex-wrap: wrap; /* Allows items to wrap to the next line */
  justify-content: space-between; /* Distributes items evenly with space between them */
  list-style: none; /* Removes default bullet points */
  padding: 0; /* Removes default padding */
  margin: 0; /* Removes default margin */
}

.four-col li {
  /* Flexbox specific for column distribution */
  flex: 0 0 calc(25% - 15px); /* Each item takes up 25% width minus some margin for spacing */
  margin-bottom: 20px;       /* Space between rows */
  /* Adjust the '15px' in calc() to account for desired spacing between columns */
}

/* Media Query for smaller screens (e.g., mobile) */
@media (max-width: 768px) {
  .four-col li {
    /* For screens up to 768px wide, make items take up 50% width */
    flex: 0 0 calc(50% - 10px); /* Each item takes up 50% width minus some margin */
    /* Adjust '10px' for desired spacing between two columns on mobile */
  }
}

/* Optional: Media Query for even smaller screens (e.g., very small phones) */
@media (max-width: 480px) {
  .four-col li {
    /* For very small screens, make items take up 100% width (one column) */
    flex: 0 0 100%;
    margin-bottom: 10px; /* Adjust spacing for single column */
  }
}

.wpv-view-wrapper .wpv-custom-search-loading-overlay {
	background: var(--global-pallete9) !important; }

.wpv-view-wrapper .wpv-custom-search-loading-overlay {
	top: 223px !important; }


/************************************ Contact Us *************************************/
select.gfield_select option {
	color: white !important;
}
select.gfield_select option:hover,
select.gfield_select option:checked {
	color: white !important;
	background-color: var(--global-palette2) !important;
}
/************************************ Subpage *************************************/

/************************************ Subpage *************************************/

/************************************ Mobile *************************************/
@media only screen and (max-width: 768px) {
	h1 {font-size: 40px !important; line-height: 1.2em !important;}
	h2 {font-size: 28px !important; line-height: 1.2em !important; text-transform: none !important;}
	h3 {font-size: 23px !important;}
}

/************************************ ADA *************************************/