/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */
@media screen and (max-width: 1280px) {

	.wrap-conteudo-comofunciona {
	  width: 870px;
	}

	.titulo-pagina {
  		width: 830px;
  	}

  	.passos-comofunciona {
		background-image: url(../img/caminho-comofunciona.png);
		width: 830px;
	}

	.cep-cadastro {
  		width: 830px;
	}
}

@media screen and (max-width: 960px) {

	.wrap-conteudo-comofunciona {
	  	width: 740px;
	 	height: 745px;
	}

	.titulo-pagina {
  		width: 700px;
  	}

  	.passos-comofunciona {
		background-image: url(../img/caminho-comofunciona.png);
		width: 700px;
	}

	.passo1 {
		width: 323px;
	}

	p.texto-passo1 {
  		margin: -8px 0 0 0;
	}

	p.texto-passo2 {
		margin: -40px 0 0 27px;
  		float: left;
	}

	.passo3 {
  		width: 395px;
  		height: 177px;
  		margin: 79px 0px 0 77px;
	}

	p.texto-passo3 {
	  	margin: -90px -14px 0 0;
	}

	.passo4 {
	  	margin: -55px 3px 0 0px;
  		float: right;
	}

	p.texto-passo4 {
		margin: -76px 0 0 0px;
  		float: left;
	}

	.passo5 {
		margin: 170px 0 0 154px;
	}

	p.texto-passo5 {
 		margin: 118px -10px 0 0px;
  		float: right;
	}

	.passo1 img{
		width: 163px;
	}

	.passo2 img{
		width: 198px;
		float: right;
	}

	.passo3 img{
		width: 198px;
	}

	.passo4 img{
		width: 198px;
		float: right;
	}

	.passo5 img{
		width: 198px;
		float: left;
	}

	.cep-cadastro {
  		width: 700px;
	}

	.cep-bar {
  		width: 430px;
	}

	.pesquisa-cep {
		width: 430px;
	}

	.cep-bar strong {
		font-size: 3em;
	}

	input.pesquisa2 {
		width: 156px;
	}
}


@media screen and (max-width: 800px) {

	.wrap-conteudo-comofunciona {
	  width: 600px;
	  height: 1043px;
	  min-height: 1043px;
	}

	.titulo-pagina {
  		width: 560px;
  	}

  	.passos-comofunciona {
		background-image: url(../img/caminho-comofunciona2.png);
		width: 560px;
	}

	.passo3 {
  		width: 395px;
  		height: 177px;
  		margin: 79px 0px 0 7px;
	}

	p.texto-passo3 {
  		margin: 63px -14px 0 0;
	}

	.passo4 {
  		margin: -5px 3px 0 0px;
	}

	.passo5 {
  		margin: 170px 0 0 55px;
	}

	.cep-cadastro {
  		width: 560px;
	}

	.cep-bar {
  		width: 560px;
	}

	.pesquisa-cep {
  		width: 560px;
	}

	input.pesquisa2 {
  		width: 283px;
	}

	.link-cadastro {
  		display: none;
	}
}

@media screen and (max-width: 670px) {

	.wrap-conteudo-comofunciona {
	  width: 480px;
	  height: 1127px;
	  min-height: 1127px;	  
	}

	.titulo-pagina {
  		width: 440px;
  	}

  	.passos-comofunciona {
		background-image: url(../img/caminho-comofunciona3.png);
		width: 440px;
	}

	.passo5 {
  		margin: 170px 0 0 24px;
	}

	.cep-cadastro {
  		width: 440px;
  		height: 172px;
	}

	.pesquisa-cep {
  		width: 440px;
  		display: block;
  		float: none;
	}

	.cep-bar {
  		width: 440px;
  		margin-top: 0;
	}

	input.pesquisa2 {
  		width: 177px;
  		margin-left: 16px;
	}

	.link-cadastro {
  		display: block;
  		margin-right: 92px;
  		margin-top: 10px;
	}

 }

@media screen and (max-width: 568px) {
	
	.wrap-conteudo-comofunciona {
	  width: 380px;
	  height: 1530px;
	  min-height: 1530px;
	}

	.titulo-pagina {
  		width: 340px;
  	}

  	.passos-comofunciona {
		background-image: none;
		width: 340px;
		height: 1150px;
	}

	.passo1 {
  		width: 323px;
  		margin-left: 0;
  		display: block;
	}

	.passo2 {
		width: 332px;
	  	margin: 0 5px 0 0;
	  	display: block;
	}

	p.texto-passo2 {
  		margin: 5px 0 0 0;
	}

	.passo3 {
		width: 332px;
		margin: 229px 0px 0 7px;
		display: block;
	}

	p.texto-passo3 {
  		margin: -3px 0px 0 0;
	}

	.passo4 {
		width: 332px;
		display: block;
		margin-top: 53px;
	}

	p.texto-passo4 {
  		margin: -4px 0 0 0px;
  	}

	.passo5 {
		width: 332px;
		display: block;
		margin-top: 323px;
	}

	p.texto-passo5 {
  		margin: 0px 14px 0 0px;
	}

	.cep-cadastro {
  		width: 340px;
  		height: 225px;
  	}

  	.cep-bar {
  		width: 340px;
  		margin-top:0;
	}

	.pesquisa-cep {
  		width: 340px;
  		margin: 43px 0 0 0;
	}

	input.pesquisa2 {
  		width: 237px;
  		margin-left: 0;
	}

	.link-cadastro {
	  	display: block;
	  	margin-right: 42px;
	  	margin-top: 57px;
	}

}


@media screen and (max-width: 480px) {
	.wrap-conteudo-comofunciona {
	  width: 320px;
	  height: 1780px;
	  min-height: 1780px;
	}

	.titulo-pagina {
  		width: 280px;
  	}

  	.passos-comofunciona {
  		background-image: none;
  		width: 320px;
  		height: 1400px;
	}

	.passo1 {
  		width: 320px;
  		height: 220px;
  		margin: 0;
  	}

	.passo1 img {
  		width: 163px;
  		margin: 0 auto;
  		float: none;
  		display: block;
	}

	p.texto-passo1 {
  		margin: 0 auto;
  		float: none;
	}

	.passo2 {
  		width: 320px;
  		height: 200px;
  		margin: 0 auto;
  		margin-top: 75px;
  		display: block;
	}

	.passo2 img {
  		width: 198px;
  		margin: 0 auto;
  		display: block;
  		float: none;
	}

	p.texto-passo2 {
  		margin: 0 auto;
  		float: none;
  		margin-top: 15px;
	}

	.passo3 {
  		width: 320px;
  		height: 230px;
  		margin: 0 auto;
  		margin-top: 345px;
  		display: block;
  		float: none;
	}

	.passo3 img {
  		width: 198px;
  		margin: 0 auto;
  		display: block;
	}

	p.texto-passo3 {
  		margin: 0 auto;
  		display: block;
  		float: none;
  		margin-top: 15px;
	}

	.passo4 {
  		width: 320px;
  		height: 218px;
  		display: block;
  		margin-top: 75px;
	}

	.passo4 img {
 	 	width: 198px;
 	 	float: none;
  		margin: 0 auto;
  		display: block;
	}

	p.texto-passo4 {
  		margin: 0 auto;
  		float: none;
  		margin-top: 15px;
	}

	.passo5 {
  		width: 320px;
  		height: 230px;
  		display: block;
  		margin: 0 auto;
 	 	margin-top: 365px;
	}

	.passo5 img {
  		width: 198px;
  		float: none;
  		margin: 0 auto;
  		display: block;
	}

	p.texto-passo5 {
  		margin: 0 auto;
  		margin-top: 15px;
  		display: block;
  		float: none;
	}

	.cep-cadastro {
  		width: 280px;
  		height: 225px;
	}

	.cep-bar {
  		width: 280px;
  		margin-top: 0;
	}

	.pesquisa-cep {
 		width: 280px;
  	}

  	input.pesquisa2 {
  		width: 180px;
  	}

  	.link-cadastro {
  		display: block;
 	 	margin-right: 13px;
  		margin-top: 57px;
	}

}

@media screen and (max-width: 380px) {
	.wrap-conteudo-comofunciona {
	  width: 280px;
	  height: 1776px;
	  min-height: 1776px;
	}

	.titulo-pagina {
  		width: 240px;
  	}

  	.passos-comofunciona {
  		background-image: none;
  		width: 250px;
  		height: 1400px;
	}

	.passo1 {
  		width: 250px;
  	}

	.passo2 {
  		width: 250px;
	}

	.passo3 {
  		width: 250px;
  	}	

	.passo4 {
  		width: 250px;
	}

	.passo5 {
  		width: 250px;
	}

	.cep-cadastro {
  		width: 250px;
	}

	.cep-bar {
  		width: 250px;
	}

	.pesquisa-cep {
 		width: 250px;
  	}

  	input.pesquisa2 {
  		width: 150px;
  	}

  	.link-cadastro {
  		width: 250px;
  		display: block;
  		margin: 0 auto;
  		margin-top: 57px;
	}

}