
.conteudo{
	box-sizing: border-box;
}

.clear{
clear:both;
}

.niver{
text-align:center;
}

h1{
text-transform:uppercase;
text-align:left;
font-size:20px;
}

/*redimensionar imagem sem perder qulidade*/
/*image-rendering: (pixelated);*/

/*sombra na imagem*/
.sombra{
filter:drop-shadow(4px 4px 4px #121212);
}

.sombraAzul{
filter:drop-shadow(3px 3px 3px #bdb6b6);
}

.card {
  /* Add shadows to create the "card" effect */
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  width:100%;
  min-height:350px;
  padding:0 10px;
  box-sizing: border-box;
  /*background-color:#bdb6b6;*/
 
}

/* On mouse-over, add a deeper shadow */
.card:hover {
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

/* Add some padding inside the card container */
.container {
  padding: 2px 5px;
}

.item{
	flex:1;
	justify-content: center;
	margin: 0 10px;
	width:100%;
}

.foto{
	flex-grow: 1;
	padding:10px 10px 10px 3px;
}

.fotoExibe{
max-width:350px; 
height:auto; 
object-fit:cover; 
border-radius:15px;
}

.texto{
	flex-grow: 3;
	margin-left:15px;
}

.botao{
	border:none;
	color:#fff;
	border-radius:10px;
	background-color:#3367d6;
	margin:0;
	padding:15px 10px;
	width:97%;
	box-sizing: border-box;
	font-size:18px;
}

.botao a {
	border:none;
	text-decoration:none;
	padding:15px 10px;
	margin:0px;
	display:block;
	border-radius:10px;
	color:#fff;
	
}

.botao:link, .botao:visited{
	color:#000;
}

.botao:hover{
	padding:15px 10px;
	margin:0px;
	background-color:#bdb6b6;
	/*transform: scale(1.03);*/
	color:#000;
	 /*transform: scale(1.05);*/
	 cursor:pointer;
	/*font-weight:bold;*/
}


.controle{
	display:flex;
	flex-direction: wrap;
	justify-content: center;
	align-items: center; 
	min-height:350px;
	box-sizing: border-box;
}


.preco{
	font-size:28px;
	font-weight:bold;
	color: #a51e07;
}



@media screen and (max-width: 700px) {
  .controle {
  	display:flex;
  	flex-direction: column;
    width: 100%; /* The width is 100%, when the viewport is 800px or smaller */
    box-sizing: border-box;
    /*justify-content: center;*/
  }

  
  .controle img{
  	width:320px;
  	margin-top:15px;
  	padding:0px 10px;
  	height:auto;
  	text-align:center;
  }

  .card{
  	display:flex;
  	flex-direction:column;
  	justify-content: center;
  	width:100%;
  	height:auto;
  	padding: 15px 0px;
  	margin-top:-10px;
  	/*border:3px solid red;*/
  }

.fotoExibe{
width:100%; 
height:auto; 
object-fit:cover; 
border-radius:15px;
padding:0 5px;
box-sizing: border-box;
margin-top:-20px;
}

.foto{
	margin-top:-25px;
}


  h1{
  	width:97%;
  }


  button{
  	width:97%;
  }

}
