@charset "utf-8";

#eproduto { float: left; width: 100%; margin: 31px 0;}
#eproduto .coluna1 { float: left; width: 40%;}
#eproduto .coluna2 { float: right; width: 60%; padding: 0 0 0 20px;}
#eproduto .imagens { float: left; width: 100%; outline: 1px solid rgb(90 90 90 / 10%);}
#eproduto .imagens .fundo { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; background-color: rgb(90 90 90 / 8%);}
#eproduto .nome h1 { font-weight: bold; font-size: 1.8em;}
#eproduto .nome h2 { font-size: 1.1em;}
#eproduto .nome h3 { font-size: 1em;}
#eproduto .preco h2 { font-weight: bold; font-size: 1.5em; line-height: 1;}
#eproduto .preco h3 { opacity: 0.7; font-size: 1em;}
#eproduto .frete .ico { position: absolute; width: 40px; height: 40px; top: 50%; right: 0; margin:-20px 0 0; background: url('../img/eproduto-frete-ico.png?v5') #DDD 50% no-repeat;}
#eproduto .frete .str { padding: 0 50px 0 0;}
#eproduto .frete .calcular { float: left;}
#eproduto .frete .calcular .cep { float: left; width: 120px; height: 35px; padding: 10px;}
#eproduto .frete .calcular .submit { float: left; height: 35px; padding: 0 10px; margin: 0 0 0 5px; background-color: rgb(60 80 120);}
#eproduto .frete .calcular .submit:hover { background-color: rgb(45 60 90);}
#eproduto .frete .resultado { padding: 5px 0;}
#eproduto .quantidade { display: flex; align-items: center; float: left; width: 280px;}
#eproduto .quantidade .qtd { width: 40px; height: 40px; margin: 0 5px; outline: 1px solid rgb(90 90 90 / 30%); text-align: center;}
#eproduto .quantidade .ico { float: left; width: 25px; height: 25px;}
#eproduto .quantidade .ico.menos { background: url('../img/eproduto-quantidade-menos.png?v3') #DDDDDD 50% no-repeat;}
#eproduto .quantidade .ico.mais { background: url('../img/eproduto-quantidade-mais.png?v3') #DDDDDD 50% no-repeat;}
#eproduto .disponivel { position: absolute; top: 50%; right: 0; padding: 10px 0; margin: -10px 0 0; opacity: 0.7; line-height: 0;}
#eproduto .botoes .lk { width: 280px; padding: 25px 10px; margin: 5px 0 0; font-size: 1.1em;}
#eproduto .botoes .lk.comprar { float: left; background-color: rgb(0 150 130); color: rgb(250 250 250);}
#eproduto .botoes .lk.comprar:hover { background-color: rgb(0 170 100);}
#eproduto .botoes .lk.carrinho { float: left; background-color: rgb(90 90 90 / 20%);}
#eproduto .botoes .lk.carrinho:hover { background-color: rgb(90 90 90 / 30%);}
#eproduto .botoes .lk.finalizar { float: left; padding: 15px 0; text-transform: uppercase; text-align: center; font-size: 0.9em; line-height: 0;}
#eproduto .botoes .lk.zap { background-image: url('../img/eproduto-botoes-zap.png'); background-repeat: no-repeat; background-position: 10px 50%;}
#eproduto .separacao { margin: 11px 0; border-top: 1px solid rgb(90 90 90 / 20%);}

@media only screen and (max-width: 800px){
  #eproduto { margin: 21px 0;}
}
@media only screen and (max-width: 700px){
  #eproduto .coluna1 { width: 100%; margin: 0;}
  #eproduto .coluna2 { width: 100%; padding: 11px 0 0;}
  #eproduto .nome h1 { font-size: 1.2em;}
  #eproduto .botoes .lk { width: 100%;}
}