.searchBox {
	width: auto;
	height: 38px;
	padding-left: 20px;
	display: flex;
	align-items: center;
	/* border: 1px solid #ccc; */
	border-radius: 30px;
}

.searchBox input {
	width: 170px;
    height: 36px;
    border: none;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: transparent;
    outline: none;
    border-right: none;
    padding: 0px 10px;
    color: #757575;
    background-color: #eeeeee;
}

input::-webkit-input-placeholder {color:#7c7c7c;}

.searchBox p {
	width: 60px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #eeeeee;
	border-radius: 0 5px 5px 0;
}

.searchBox p img {
	width: 24px;
	height: 24px;
	cursor: pointer
}

@media screen and (max-width:960px) {
	.right {
		display: flex
	}

	.searchBox {
		width: 100%;
		height: 100vh;
		background-color: #fff;
		position: absolute;
		right: 0;
		top: 60px;
		z-index: 99999;
		align-content: flex-start;
		align-items: flex-start;
		padding-top: 50px;
		transition: all 0.5s;
		display: none;
		border-radius: 0px;
		border: none;
	}

	header {
		overflow-x: hidden
	}

	.searchBox input{
		width: 80%;
		border: 1px solid #ccc;
		border-right: 0;
		border: none;
	}
	.searchBox p{
		border-radius: 0;
		border-radius: 0 10px 10px 0;
	}
}