.bannersmall{
	width: 100%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
.bigbanner{
	width: 100%;
	height: auto;
	display: none;
}
.banner{
	width: 100%;
	height: 500px;
	margin-top: 100px;
	display: none;
}

.container{
	width: 100%;
	height: auto;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-around;
}
.filtro{
	width: 100%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	margin-top: 150px;
	margin-bottom: 50px;
}
.titulobuscar{
	width: 100%;
	text-align: center;
}
.container .filtro form{
	width: 100%;
	height: 40px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
  	gap: 10px;
	position: absolute;
	z-index: 80;
	transform: translateY(-25px);
}
/*-------------------------texto con flexbox-----------------------------------*/
/*.container .filtro form{
	width: 100%;
	height: 40px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	position: absolute;
	z-index: 80;
	transform: translateY(-25px);
}*/

.container .filtro form select{
	width: 100%;
	max-width: 200px;
	height: 30px;
	margin: 3px;
	border: none;
	outline: none;
	cursor: pointer;
	text-align: center;
	background: #fff;
	color: #333;
	font-weight: 700 !important;
	-moz-appearance: none;
	-webkit-appearance: none;
	box-shadow: 0px 1px 3px #333;
	border-radius: 10px;
	transition: .3s;
	font-size: 14px;
}
.container .filtro form .agrandar:focus{
	height: 100px;
	color: #fff;
	z-index: 50;
}
.container .filtro form select:hover{
	background: #ea8511;
	box-shadow: 0px 2px 5px #333;
	color: #fff;
	transition: .3s;
}
option{
 	height: 20px;
 	padding-top: 5px;
 	background-color: #ea8511;
 	color: #fff;
 	transition: .3s;
 }
 option:hover{
 	background-color: #fff;
 	color: #000;
 	transition: .3s;
 }

.container .filtro form input[type="submit"]{
	width: 100%;
	max-width: 200px;
	height: 30px;
	margin: 3px;
	border: none;
	outline: none;
	cursor: pointer;
	font-weight: 700 !important;
	background: #ea8511;
	color: #fff;
	box-shadow: 0px 1px 3px #333;
	border-radius: 10px;
	font-size: 14px;
	transition: .5s;
}
.container .filtro form input[type="submit"]:hover{
	background: #01C4D5;
	transition: .5s;
	box-shadow: 0px 2px 5px #333;
}

.slider{
	width: 100%;
	height: auto;
	margin-top: 50px;
	margin-bottom: 50px;
	display: none;
}
/*----------------------inicio de los media---------------------------------------------*/
@media(min-width:  400px){
	.banner{
		display: block;
	}
	.container{
		display: flex;
	}
	.filtro{
		margin-top: 0;
	}
	.container .filtro form select{
		height: 40px;

	}
	.container .filtro form input[type="submit"]{
		height: 40px;
		
	}
}
@media(min-width:  1050px){
	.filtro{
		width: 80%;
		justify-content: center;
	}
	.container .filtro form{
		width: auto;
		transform: translateY(-35px);
	}
	.container .filtro form select{
		height: 60px;
		font-size: 16px;

	}
	.container .filtro form input[type="submit"]{
		height: 60px;
		font-size: 16px;

	}
	.slider{
		display: block;
	}
		.bannersmall{
    	width: 100%;
    	height: auto;
    	display: none;
    }
    .bigbanner{
    	width: 100%;
    	height: auto;
    	display: flex;
    	flex-wrap: wrap;
    	justify-content: space-around;
    }
}

@media(min-width:  1440px){
	.banner{
		width: 100%;
		height: 700px;
		margin-top: 100px;
	}
	.bannersmall{
    	width: 100%;
    	height: auto;
    	display: none;
    }
    .bigbanner{
    	width: 100%;
    	height: auto;
    	display: flex;
    	flex-wrap: wrap;
    	justify-content: space-around;
    }
}