.search-container
	height: 100%
	display: flex
	flex-direction: column
	align-items: center
	justify-content: space-evenly
	.input-container
		margin-top: 45px
		input[type=text]
			width: 360px
			padding: 10px
			border-radius: 4px
			border: 1px solid rgba(0,0,0,0)
			background: #ccc
			transition: all 0.3s
			box-shadow: 2px 2px 10px rgba(0,0,0, 0.3)
			&:hover,
			&:focus
				box-shadow: 3px 4px 16px rgba(0,0,0,0.49)
			&:focus
				border: 1px solid rgba(0,0,0,0.3)
	.button-container
		margin: 45px auto
		width: fit-content
		.btn
			text-align: center

.search-container
	height: 100%
	display: flex
	flex-direction: column
	align-items: center
	justify-content: space-evenly
	.input-container
		input[type=text]
			width: 360px
			padding: 10px
			border-radius: 4px
			border: 1px solid rgba(0,0,0,0)
			background: #ccc
			transition: all 0.3s
			box-shadow: 2px 2px 10px rgba(0,0,0, 0.3)
			&:hover,
			&:focus
				box-shadow: 3px 4px 16px rgba(0,0,0,0.49)
			&:focus
				border: 1px solid rgba(0,0,0,0.3)
	.button-container
		width: fit-content
		.btn
			text-align: center

	@media (max-width: 400px)
		.input-container
			margin: 15px 0
		.button-container
			margin: 12px 0

Add media screen for search in mobile
Add media screen for search in mobile
