/********************************************** 
partsearchbar-1
**********************************************/

/* config */
.partSearchBar                      {height: 60px;}
	.searchBarInput                   {padding-right: 60px; padding-left: 20px; font-family: inherit; font-size: 18px;}
	.searchBarButton, .searchBarReset {width: 60px;} 

	.searchBarInput                   {border:solid 1px #999; background-color:#fff; color: #000;}
	.searchBarInput::placeholder      {color:#999;}

	.searchBarReset                   {border:none; background-color:transparent;}
		.searchBarReset svg               {width: 10px; height: 10px; fill: #000; transition: fill 0.3s;}

	.searchBarButton                  {border: none; background-color: #6c207f}  
	.searchBarButton:hover  			{background-color: #fff;}
	.searchBarButton:hover svg			{fill:#6c207f;}
		.searchBarButton svg              {width: 22px; height: 22px; fill: #fff;}

/* fundementals */
.partSearchBar                      {display:flex;} 
	.searchBarContainer                {flex: 1 1 auto; position: relative; display:flex;}

		.searchBarInput                 {width:100%; height:100%; background-color: transparent;}
		
		.searchBarButton 				{transition: box-shadow .15s ease-in-out;}
		.searchBarInput					{transition: box-shadow .15s ease-in-out;}
		.searchBarInput:focus, .searchBarButton:focus	{box-shadow: 0 0 0 0.2rem rgba(0,0,0,.1);}

		.partSearchBar .searchBarReset                   		{position:absolute; top:0; right:0; height: 100%; display: flex; align-items: center; justify-content: center; visibility: hidden; opacity: 0; transition: opacity 0.15s ease-in-out; cursor:pointer;}  
		.searchBarReset:hover svg, .searchBarReset:focus svg	{fill:#E74B3B;}
		.searchBarReset.active            	{visibility: visible; opacity: 1;}

		.searchBarButton                  	{flex: 0 0 auto; height:100%; display: flex; align-items: center; justify-content: center; cursor:pointer;}  

/* form reset */
.partSearchBar input[type=search], .partSearchBar button            {-webkit-appearance: none; border-radius:0; outline: none;}
.partSearchBar input[type=search]::-ms-clear                        {display: none;}
.partSearchBar input[type=search]::-webkit-search-cancel-button    	{-webkit-appearance: none;}