/* Submenu dropdown */
.category-dropdown {
  display: block;
  position: relative;
  font-family: sans-serif;
  width: 40% !important;
  z-index: 100;
}
.category-dropdown-input {
  padding: 10px 16px;
  font-size: 16px;
  width: 100%;
  border: 1px solid #000 !important;
  border-radius: 6px;
}
.category-dropdown-menu {
  list-style: none;
  margin: 0;
  position: absolute;
  background-color: #fff;
	font-family:open sans;
	font-size:1.1em;
	color:#666;
  z-index: 1000;
  display: none;
  overflow-y: auto;
  padding: 10px !important;
  padding-top: 30px !important;
  width: 95% !important;
}
.category-dropdown-menu li {
  position: relative;
  border-bottom: 1px solid #eee;
  width: 49% !important;
}
.category-dropdown-menu li:last-child {
  border-bottom: none;
}
.category-dropdown-menu li a,
.toggle-submenu {
  align-items: left;
  padding: 5px 9px;
  text-decoration: none;
  color: #333;
  font-size: 13px;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
}
.toggle-submenu::after {
  content: "▼";
  margin-left: auto;
  color: #555;
  font-size: 12px;
  transition: transform 0.2s;
}

.toggle-submenu.open::after {
  content: "▲";
}
.category-dropdown-menu li a:hover{
  background-color: #f0f0f0;
}
.submenu {
  display: none;
  padding-left: 20px;
}
.submenu li {
  width: 100% !important;
}
.submenu li a:hover {
  background-color: #fff;
}
.submenu.open {
  display: block;
}
.searchlocation {
  width: 30% !important;
}
.searchformmain .bi,.searchformmain .fas,.searchformmain .fa-solid,.searchformmain .fa-brands{ 
	color:#666 !important;
	font-size: 22px;
	margin-right: 10px;
	position: relative;
	top: 3px;
}
#suggestionsDiv{
	width: 480px!important;
	border-radius:15px 15px 0 0!important;
}
.categorySuggestions{
	width: 480px!important;
	border-radius:0 0 15px 15px!important;
}
/* Location Sugestions style*/
.autocomplete-container {
  position: relative;
  margin: 5px;
}
.autocomplete-container input {
	width: 95% !important;
	border: 1px solid #000 !important;
	border-radius: 6px;
	font-size: 16px;
}
#suggestions {
  width: 100%;
  position: absolute;
  border: 1px solid #ccc;
  max-height: 300px;
  overflow-y: auto;
  display: none;
  border-radius: 3px;
}

.suggestion-item {
  padding: 10px;
  cursor: pointer;
  color: #000;
  border-bottom: 1px solid #c0c0c0;
  background-color: #fff;
}

.suggestion-item:hover {
  background-color: #f0f0f0;
}

.category-dropdown-input {
  border: none !important;
  outline: none !important;
  font-family:Open Sans;
}
.category-input-container {
  display: flex;
  flex-direction: row;
  border-right: 1px solid #ccc;
  border-radius: 6px 0 0 6px;
}
.search-icon-div {
  padding: 1px 5px;
  color:rgb(100, 100, 100);
}
.searchlocation {
  margin: 0 !important;
}
.location-input-container {
  display: flex;
  flex-direction: row;
  border-radius: 0;
}
.location-input-container p {
  color:rgb(100, 100, 100);
  margin: 0 !important;
  font-size: 16px;
  padding-left: 6px;
  padding-top: 4px;
}
.autocomplete-container {
  margin: 0 !important;
}
.autocomplete-container input {
  border: none !important;
}
.separate-div {
  width: 2px;
  background-color:rgb(170, 170, 170);
  /*border: 1px solid #000;
  border-right: none !important;
  border-left: none !important;*/
	display:none;
}
.location {
  outline: none !important;
}
#searchme {
	padding:23px 15px;
	border-radius: 0 6px 6px 0 !important;
	background-color:#852153;
	width: 100%;
	float:right;
	border:medium none;
	cursor:pointer;
	font-family:'Open Sans', Arial;
	font-size:1.2em;
	font-weight: 600;
	color:#fff;	
}
#searchme .fa{
	display: none;
}
#submitsearch {
  margin: 0 !important;
}
#searchform {
  width: 80%;
}
@media only all and (max-width: 767px) and (min-width: 320px){
	#searchform {
	  width: 100% !important;
	  padding: 0;
	} 
	.header_image_wrapper .searchheader #searchform ul li.category-dropdown{
		width: 55% !important;
	}
	.category-dropdown-menu{
		width: 100% !important;
	}
	.header_image_wrapper .category-dropdown-menu {
		width: 180% !important;
	  }
	.category-input-container,.location-input-container{
		padding: 15px 10px;
	}
	.category-input-container .search-icon-div{
		display: none!important;
	}
	.header_image_wrapper .searchheader #searchform ul li.searchlocation{
		width: 35% !important;
	}
	#searchform input{
		font-size:12px; 
	}
	.header_image_wrapper #searchform ul li#submitsearch{
		width: 10%!important;
	}
	.location-input-container p{
		padding-top: 0;
		font-size:12px; 
		color: #000;
	}
	#searchme {
 		 padding: 20px 15px;
	}
	#searchme .fa{
	    display: block;
		position: relative;
    	left: -4px;
	}
	.searchbutton{
		display: none;
	}
	.search_list {
 		 width: 100% !important;
	}
	.slideshow_main .search_list{
		display: block !important;
	}
	.slideshow_main .category-dropdown,
	.slideshow_main .searchlocation,
	.slideshow_main #searchform ul li#submitsearch{
     width: 100% !important;
   }
	.slideshow_main .category-input-container,
	.slideshow_main .location-input-container,
	.slideshow_main #searchme{
		border-radius: 6px!important;
	}
	.slideshow_main #searchme .fa{display: none!important;}
	.slideshow_main .searchbutton{display: block!important;}
	.slideshow_main .category-input-container .search-icon-div{display: block!important;}
	.slideshow_main #searchform input {font-size: 15px!important;font-weight: 500!important;}
	.slideshow_main .search-icon{font-size: 15px;margin-right: 0;}
}
@media only all and (max-width: 1540px) and (min-width:1300px ){
	#searchform{
		width: 100% !important;
	}
}
#searchlocation, #submitsearch {
  height: 100%;
}
.searchformmain {
  display: flex !important;
  align-items: center !important;
}
.search_list {
  width: 90%;
  align-items: left !important;
  justify-content: left !important;
  display: flex;
}
.categorySuggestions {
  border: 1px solid #ccc;
  max-height: 200px;
  overflow-y: auto;
  background: #fff;
  position: relative;
  z-index: 10;
  display: none;
  list-style: none;
  width: 95% !important;
  color: #333;
  padding: 10px !important;
  overflow-x: hidden;
}
.categorySuggestions li {
  width: 95% !important;
  border-bottom: 1px solid #eee;
}
.categorySuggestions li:hover {
  background-color: #eee;
}
.categoryTitle {
  padding: 4px 8px;
  display: none; 
  position: absolute; 
  z-index: 10000; 
  width: 90%;
  background-color: #fff;
}
.clean-icon {
  display: none;
  padding: 1px 5px;
    color:rgb(100, 100, 100);
  cursor: pointer;
  font-size: 16px;
}
.supplierContainer {
  border-bottom: none !important;
}