/*CESTA*/
.base-conteudo-geral{
	width: 100%;
	margin: 0 auto;
	padding: 0 16px;
	box-sizing: border-box;
	display: table;
}

.bg-cesta{
	background-color: #F8F8F8;
	display: table;
}

.coluna-valores{
	float: left;
	width: 50%;
	padding: 12px;
	box-sizing: border-box;
	height: 76px;
}

.btn-cesta{
	background-color: #00CB00;
	text-align: center;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	font-size: .8em; 
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border: 0;
	width: 100%;
	height: 50px;
	margin-top: 16px;
}

.btn-cesta:hover{
	cursor: pointer;
	background-color: #00A200;
}

.btn-cesta-adicionar{
	background-color: #00CB00;
	text-align: center;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	font-size: .8em; 
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	border: 0;
	width: 100%;
	height: 50px;
	margin-top: 16px;
    margin-bottom: 10px;
}

.btn-cesta-adicionar:hover{
	cursor: pointer;
	background-color: #00A200;
}


.btn-escolher-mais{
	background-color: #fff;
	text-align: center;
	color: #00CB00;
	border: 1px solid #00CB00;
	font-weight: 600;
	text-transform: uppercase;
	font-size: .8em; 
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	width: 100%;
	height: 50px;
	margin-top: 16px;
}

.btn-escolher-mais:hover{
	cursor: pointer;
	background-color: #B3EFB3;
	border: 1px solid #00CB00;
}

.base-cesta{
	width: 100%;
	display: table;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	-moz-border-radius: 4px;
	border: 1px solid #E2E2E2;
	background-color: #fff;
	margin: 10px 0;
	padding:16px;
	box-sizing: border-box;

}

.bg-valores{
	background-color:#F8F8F8;
	border-top: 1px solid #DBDBDB;
	border-bottom: 1px solid #DBDBDB;
}

.base-valor-cesta{
	width: 100%;
	display: table;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	-moz-border-radius: 4px;
	background-color: #fff;
	border: 1px solid #E2E2E2;
	padding: 16px;
	margin: 10px 0;
	box-sizing: border-box;
}

.base-frete{
	width: 100%;
	display: inline-table;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	background-color: #F8F8F8;
	border: 1px solid #DBDBDB;
	font-size:.8em;
	padding:8px;
	box-sizing: border-box;


}

.produtos-cesta{width: 45%; margin-bottom: 10px;}
.quantidade-cesta{width: 55%}

.input-cesta{
	width: 35%;
	float: left;
	height: 36px;
	padding:8px;
	box-sizing: border-box; 
	margin: 0 8px; 
	background-color: #fff;
	border: 1px solid #DBDBDB;
    border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	font-size: .8em;
	color: #939393;
}

.btn-ok{
	float: left;
	width: 42px;
	height: 36px;
	background-color: #00B3F5;
	color: #fff;
	border: 0;
    border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	font-size: .8em
}

.txt-calcule{
	float: left;
	width: 35%;
	margin-left: 20px;
	margin-top: 8px;
	font-size: 1.2em
}

.txt-peso{display: none;}





.foto-cesta{
	float: left;
	width: 30px;
	height: 30px;
	margin-top: 20px;
	margin-right: 4px;
}

.desc-cesta{
	float: left;
	width: 75%;
	font-size: .8em;
}

.produtos-cesta{
	float: left;
	padding:16px 8px;
	box-sizing: border-box;
	border-bottom: 1px solid #E5E5E5; 
	height:130px;
	width: 60%;
	/*border: 1px solid green;*/
}
.quantidade-cesta{
	float: left;
	padding:0px 28px;
	padding-bottom: 2px;
	box-sizing: border-box;
	height:auto;
	width: 40%;
	/*border: 1px solid green;*/
}

.botao-mais-menos{
	background-color: transparent;
	color: #FF2582;
	font-size:1em;
	text-align: center;
	float: left;
	padding: 5px;
	padding-top: 15px;
	font-weight: 600;
	border: 0;
	cursor: pointer;
}

.contanier-qtd{
	border: 1px solid #DBDBDB;
	float: left;
	display: table;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	box-sizing: border-box;
	margin-top: 16px;
	float: left;
	border: 1px solid red;
}

.input-qtd{
	float: left;
	width: 30px;
	height: 42px;
	border: 0;
	text-align: center;
	color: #939393;
	font-size: .8em;
	padding: 4px;
	box-sizing: border-box;
}

.btn-lixeira{
	border: 1px solid #DBDBDB;
	float: left;
	margin-left: 15px;
	background-color: #fff;
	cursor: pointer;
	width: 37px;
	height: 37px;
	padding: 8px;
	box-sizing: border-box;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-o-border-radius: 4px;
	box-sizing: border-box;
	margin-top: 10px;
	background-image: url(../../media/imagens/icone-lixeira.svg);
	background-repeat: no-repeat;
	background-position: left 50% top 50%;
	border: 1px solid red;
}

.btn-lixeira:hover{
	background-color: #E6E6E6;
}

	/*CESTA*/




/*BASE DOS BANNERS detalhe*/

/*PRODUTOS detalhe*/
.base-produtos-detalhe{
	float: left;
	width: 23%;
	border:1px solid #E3E3E3;
	border-radius: 4px;
	display: table;
	padding: 0 24px;
	box-sizing: border-box;
	text-align: left;
	margin-right: 36px;
	margin-left: 0;
	margin-top: 32px;
	
}
.base-produtos-detalhe:last-child{margin-right: 0}


.estrelas:last-child{margin-right: 0;}

.txt-produtos-detalhe a{
	color: #1F1F1F;
	font-size: .8em;
	text-decoration: none;
	height: 70px;
	display: block;
	margin: 16px 0;
}


/*CESTA*/

/*PRODUTOS DETALHE*/


.base-produtos-detalhe{
float: left;
width: 47%;
border:1px solid #E3E3E3;
border-radius: 4px;
display: table;
padding: 0 24px;
box-sizing: border-box;
text-align: left;
margin-right: 5px;
margin-left: 5px;
margin-top: 32px;

}


.base-produtos-detalhe:hover{
	-webkit-box-shadow: 3px 4px 5px 0px rgba(0,0,0,0.12);
	-moz-box-shadow: 3px 4px 5px 0px rgba(0,0,0,0.12);
	box-shadow: 3px 4px 5px 0px rgba(0,0,0,0.12);
	cursor: pointer;
}



.base-estrela{
	width: 130px;
	margin: 0 auto;
}
.estrelas{
	float: left;
	width: 20px;
	margin-right: 4px;
}

.estrelas:last-child{margin-right: 0;}

.txt-produtos-detalhe a{
	color: #1F1F1F;
	font-size: .8em;
	text-decoration: none;
	height: 50px;
	display: block;
	margin: 16px 0;
}

.txt-precos-detalhe{
	margin:16px 0 0 0;
}
.preco-de{
	color: #707070;
	font-size: .7em;
	text-decoration: line-through;
	padding-top: 10px;
}
.preco-por{
	color: #FF2582;
	font-size: 1.3em;
	font-weight: 500;
}

.txt-ecomomize{
	color: #707070;
	font-size: .7em;
	font-weight: 500;
	margin-bottom: 0px;
}

.txt-compre-tb{
	font-weight: 600;
	color: #FF2582;
	font-size: 1.2em;
	text-align: left;
	margin-top: 64px;
}

.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}

.sidenav-mobile{
	display: none;
}

.fechar_mobile{
	display: block;
}

.fechar_desktop{
	display: none;
}

@media (min-width: 1300px) {

	/*CESTA*/
	.bg-cesta{
	background-color: #F8F8F8;

	}

	.base-conteudo-geral{
		width: 100%;
		margin: 0 auto;
		}

  	.base-cesta{
  		float: left;
  		width: 100%;

  	}

  	.base-valor-cesta{
  		float: left;
  		width: 100%;
  		margin-left: 0;
        font-size: 0.8rem;
        padding: 8px;
  	}



  	.base-frete{
  		width: 100%;
  		border-radius: 4px;
  		-webkit-border-radius: 4px;
  		-moz-border-radius: 4px;
  		-o-border-radius: 4px;
  		background-color: #F8F8F8;
  		border: 1px solid #DBDBDB;
  		font-size:.8em;
  	}

  	.input-cesta{
  		width: 75%;
  		float: left;
  		height: 36px;
  		padding:16px;
  		box-sizing: border-box; 
  		margin: 0 10px; 
  		background-color: #fff;
  		border: 1px solid #DBDBDB;
        border-radius: 4px;
  		-webkit-border-radius: 4px;
  		-moz-border-radius: 4px;
  		-o-border-radius: 4px;
  		font-size: .8em;
  		color: #939393;
  	}

  	.btn-ok{
  		float: left;
  		width: 42px;
  		height: 36px;
  		background-color: #00B3F5;
  		color: #fff;
  		border: 0;
        border-radius: 4px;
  		-webkit-border-radius: 4px;
  		-moz-border-radius: 4px;
  		-o-border-radius: 4px;
  		font-size: .8em
  	}

  	.txt-calcule{
  		float: left;
  		width: 100%;
  		margin-top: 8px;
  		font-size: 1em;
  		margin-left:0;
		padding-left: 12px;
		font-weight: 700;
  	}

  	.txt-peso{
  		float: left; 
  		width: 210px;
  		margin-top: 8px;
		padding-left: 12px;
  		display: block;
  	}

  	.produtos-cesta{width: 70%;	}
  	.quantidade-cesta{width: 30%}
  		
  

  	.produtos-cesta,.quantidade-cesta{
  		float: left;
  		padding: 8px 4px;
  		box-sizing: border-box;
  		border-bottom: 1px solid #E5E5E5; 
  		height:86px;
        /*border: 1px solid red;*/
  	}

  	.botao-mais-menos{
		background-color: transparent;
		color: #FF2582;
		font-size:1em;
		text-align: center;
		float: left;
		padding: 4px;
		font-weight: 600;
		border: 0;
	}

	.contanier-qtd{
		border: 1px solid #DBDBDB;
		float: left;
		display: table;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		-o-border-radius: 4px;
		box-sizing: border-box;
        font-size: 0.8rem;
		margin-top: 4px;
	}

	.input-qtd{
		float: left;
		width: 35px;
		height: 30px;
		border: 0;
		text-align: center;
		color: #939393;
		font-size: .7em;
		padding: 4px;
		box-sizing: border-box;
	}

	.btn-lixeira{
		border: 1px solid #DBDBDB;
		float: left;
		margin-left: 20px;
		background-color: #fff;
		cursor: pointer;
		width: 30px;
		height: 30px;
		padding: 4px;
		box-sizing: border-box;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		-o-border-radius: 4px;
		box-sizing: border-box;
		margin-top: 6px;
        margin-bottom: 6px;
		background-image: url(../../media/imagens/icone-lixeira.svg);
		background-repeat: no-repeat;
		background-position: left 50% top 50%;
	}

	.btn-lixeira:hover{
		background-color: #E6E6E6;
	}

	.foto-cesta{
		float: left;
		width: 10%;
		margin-top: 0;
	}
    
    .desc-cesta{
    float: left;
    width: 75%;
    font-size: .6em;
    margin-top: 0;
    }

  	/*CESTA*/

	


	/*BASE DOS BANNERS detalhe*/

	/*PRODUTOS detalhe*/
	.base-produtos-detalhe{
		float: left;
		width: 23%;
		border:1px solid #E3E3E3;
		border-radius: 4px;
		display: table;
		padding: 0 24px;
		box-sizing: border-box;
		text-align: left;
		margin-right: 36px;
		margin-left: 0;
		margin-top: 32px;
		
	}
	.base-produtos-detalhe:last-child{margin-right: 0}


	.estrelas:last-child{margin-right: 0;}

	.txt-produtos-detalhe a{
		color: #1F1F1F;
		font-size: .8em;
		text-decoration: none;
		height: 70px;
		display: block;
		margin: 16px 0;
	}

    .sidenav {
        height: 100%;
        width: 0;
        position: fixed;
        z-index: 10;
        top: 0;
        right: 0;
        background-color: #f8f8f8;
        overflow-x: hidden;
        transition: 0.5s;
        padding-top: 4px;
      }
      
      .sidenav a {
        padding: 8px 8px 8px 32px;
        text-decoration: none;
        font-size: 25px;
        color: black;
        display: block;
        transition: 0.3s;
      }
      
      .sidenav a:hover {
        color: red;
      }
      
      .sidenav .closebtn {
        position: absolute;
        top: 0px;
        right: 25px;
        font-size: 36px;
        margin-left: 50px;
      }
      
	/*PRODUTOS detalhe*/	

	.sidenav-mobile{
		display: none;
	}

	.fechar_mobile{
		display: none;
	}
	
	.fechar_desktop{
		display: block;
	}

}	

@media (max-width: 375px) {

	.base-cesta{
		width: 100%;
	}

}