/* ##################################################### 320 PX ##################################################### */
/* ################################################################################################################## */

	@media screen and (min-width: 320px) {


		.vagas-gupy { padding: 25px 0 0 0; }
		.vagas-gupy-form { overflow: hidden; position: relative; background-color: rgba(0, 15, 64, .8); display: block; width: 100%; margin: auto; }
		.vagas-gupy-campo { width: 100%; height: 55px; padding: 0 15px 0 50px; font-family: DasaRegular, sans-serif; color: white; font-size: 1rem; border: none; background: transparent; border: 2px solid #A6E1FF; position: relative; background-image: url(../img/lupa-gupy-branca.svg); background-repeat: no-repeat; background-size: 20px auto; background-position: 20px center }
		.vagas-gupy-campo::placeholder { opacity: .5; color: white; }

		.vagas-gupy-campo:focus { color: #000F40; background-color: white; background-image: url(../img/lupa-gupy-azul.svg); }
		.vagas-gupy-campo:focus.vagas-gupy-campo::placeholder { color: #000F40; }


		.vagas-gupy-resultados { width: 100%; position: absolute; }
		.vagas-gupy-resultados-link { color: white; min-height: 55px; display: flex; align-items: center; justify-content: space-between; padding: 10px 40px 10px 10px; border: 2px solid #A6E1FF; text-align: left; position: relative; background-color: #000F40 !important }
		.vagas-gupy-resultados-link:hover { color: #000F40 !important; background-color: #A6E1FF !important  }
		.vagas-gupy-resultados-link::after { content: ''; position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; background-color: #FF4E33; background-image: url(../img/sprite.svg); background-repeat: no-repeat; background-size: 300px auto; background-position: 2px -59px; border-radius: 2.5px; }
		.vagas-gupy-resultados-carregar { display: flex; align-items: center; justify-content: center; background-color: #FF4E33; color: white; font-family: DasaBold, sans-serif; font-size: 1rem; max-width: 240px; padding: 0 15px; margin: 30px auto; height: 50px; border-radius: 5px; }
		.vagas-gupy-resultados-nenhum { padding: 30px 0; text-align: center; color: white; font-size: 1.12rem; }
		.vagas-gupy-resultados-nenhum span { font-size: 1.5rem; font-family: DasaBold, sans-serif; display: block; color: #A6E1FF; }
		/*#campo_busca { background-image: url(../img/loading.gif) no-repeat calc(100% - 20px) center; background-size: 40px auto; }*/

	}

/* ##################################################### 540 PX ##################################################### */
/* ################################################################################################################## */

	@media screen and (min-width: 540px) {


	}

/* ##################################################### 1024 PX ##################################################### */
/* ################################################################################################################## */

	@media screen and (min-width: 940px) {

		.vagas-gupy-form { display: block; width: 820px; margin: auto; }
		.vagas-gupy-resultados { margin: 0 auto; transform: translate(50%); left:-50% }
		.vagas-gupy-resultados-link { transition: .2s all; width: 820px; margin: auto; }
		.vagas-gupy-resultados-link::after { right: 10px; }
		.vagas-gupy-resultados-link:hover { color: #000F40; background-color: #A6E1FF; }

		.vagas-gupy-form, .vagas-gupy-campo, .vagas-gupy-resultados-link { border-radius: 10px; }


	}

/* ##################################################### 1280 PX ##################################################### */
/* ################################################################################################################## */

	@media screen and (min-width: 1200px) {


	}


/* ##################################################### 1440 PX ##################################################### */
/* ################################################################################################################## */

	@media screen and (min-width: 1360px) {


	}


/* ##################################################### 1600 PX ##################################################### */
/* ################################################################################################################## */

	@media screen and (min-width: 1560px) {


	}



/* ###################################################### FINAL ##################################################### 

	FERNANDO PAZZINI
	contato@fpazzini.com.br