.headerbox-search-form {
	display: flex;
	width: 100%;
	flex-direction: row;
	justify-content: end;
}

.headerbox-search-form input[type="search"] {
	width: 100%;
	height: 100%;
	margin: 0;
	font-size: 15px;
	text-indent: 5px;
}

.headerbox-search-form input[type="search"]::placeholder {
	font-size: 15px;
}

.panel-header .mobile-nav .headerbox-search-form{
	max-width: 200px;
}
.panel-header .mobile-nav .headerbox-search-form input[type="search"] {
	background-color: #f7efd8;
	border: none;
	box-shadow: none;
	font-family: "open-sans", sans-serif;
	font-size: 17px;
	font-weight: 600;
	color: #919191;
	letter-spacing: 0.68px;
}

.panel-header .mobile-nav .headerbox-search-form input[type=search]::-webkit-input-placeholder {
    color: #919191;
    font-size: inherit;
}

.panel-header .mobile-nav .headerbox-search-form input[type=search]:-moz-placeholder {
    /* Firefox 18- */
    color: #919191;
    font-size: inherit;
}

.panel-header .mobile-nav .headerbox-search-form input[type=search]::-moz-placeholder {
    /* Firefox 19+ */
    color: #919191; 
    font-size: inherit;
}

.panel-header .mobile-nav .headerbox-search-form input[type=search]:-ms-input-placeholder {
   	color: #919191;
   	font-size: inherit;
}

.panel-header .mobile-nav .headerbox-search-form button {
	width: 40px;
	padding: 0;
	margin: 0;
	flex-shrink: 0;
	background-color: #f1e7c7;
	font-size: 18px;
	color: #be3312;
}

.panel-header .mobile-nav .headerbox-search-form button i{
	color: inherit;
}

@media screen and (min-width: 40em) {
	.panel-header .mobile-nav .headerbox-search-form{
		width: 50%;
		max-width: none;
	}
}

.headerbox-search-form button:hover {
	background-color: #f1e7c7;
	color: #be3312;
}

@media screen and (min-width: 1200px) {
	.search-cont {
		/*position: relative;*/
	}

	.search-cont .search-button {
		width: 47px;
		height: calc(42px + (47 - 42) * ((100vw - 1200px) / (1400 - 1200)));
		padding: 0 58px 0 15px;
		margin: 0;
		background: #8e7959;
	}

	.search-cont .search-button:focus {
		outline: none
	}
	.search-cont.active .search-button {
		background: #bfb4a3;
	}
	.search-cont .search-button .close {
		display: none;
		font-family: "open-sans", sans-serif;
	    font-size: 20px;
	    font-weight: 600;
	}

	.search-cont.active .search-button .open {
		display: none;
	}

	.search-cont.active .search-button .close {
		display: block;
	}

	.search-cont .headerbox-search-form {
		opacity: 0;
	    pointer-events: none;
	    position: absolute;
	    right: 0;
	    top: 100%;
	    width: 100%;
	    height: 109px;
	    z-index: 25;
	    transition: opacity 200ms ease-in-out;
	    display: flex;
	    align-items: center;
	    background: #d7cfc2;
	    padding: 0 0 0 19px;
	    min-width: 375px;
	}

	.search-cont.active .headerbox-search-form {
		opacity: 1;
		pointer-events: all;
	}


	.search-cont .headerbox-search-form input[type="search"] {
		height: auto;
		box-shadow: none;
		background: transparent;
		border: none;
		border-bottom: 1px solid #FFF;

		font-family: "open-sans", sans-serif;
		font-size: 17px;
		letter-spacing: 0.68px;
		color: #333333;
		font-weight: 600;
		padding-left: 0px;
	}
	.search-cont .headerbox-search-form input[type="search"]:focus {
		box-shadow: none;
	}
	.search-cont .headerbox-search-form input[type=search]::-webkit-input-placeholder {
	    color: #333333;
	    font-size: inherit;
	}

	.search-cont .headerbox-search-form input[type=search]:-moz-placeholder {
	    /* Firefox 18- */
	    color: #333333;
	    font-size: inherit;

	}

	.search-cont .headerbox-search-form input[type=search]::-moz-placeholder {
	    /* Firefox 19+ */
	    color: #333333; 
	    font-size: inherit;
	}

	.search-cont .headerbox-search-form input[type=search]:-ms-input-placeholder {
	   	color: #333333;
	   	font-size: inherit;
	}

	.search-cont .headerbox-search-form button {
		width: 40px;
		height: 40px;
		padding: 0;
		margin: 0;
		background: transparent;
		position: relative;
    	right: 30px;
	}
	.search-cont .headerbox-search-form button i{
		color: #be3312;
		font-size: 18px;
	}
	.search-cont .headerbox-search-form button:hover{
		background: transparent;
	}
}

@media screen and (min-width: 1350px) {
	.search-cont .search-button {
		height: 47px;
	}
}