@charset "utf-8";

#exibicao .produto { float: left; width: 100%;}
#exibicao .produto .lado1 { float: left; width: 44%; margin: 31px 0 0 5%;}
#exibicao .produto .lado2 { float: right; width: 44%; margin: 31px 5% 0 0;}
#exibicao .produto .lado3 { float: left; width: 100%; margin: 0 0 21px;}
#exibicao .produto .separa { padding: 20px 0; border-top: 2px dashed rgb(90 90 90 / 20%);}
#exibicao .produto .galeria { float: left; width: 100%; min-height: 100px; position: relative;}
#exibicao .produto .galeria *::-webkit-scrollbar { width: 2px; height: 2px;}
#exibicao .produto .galeria .ajax { position: absolute; width: 85px; height: 100%; top: 0; left: 0; overflow: auto;}
#exibicao .produto .galeria .ajax .mini { float: left; width: 60px; height: 60px; margin: 5px; outline: 2px solid rgb(90 90 90); outline-offset: 1px; border: 5px solid rgb(250 250 250); position: relative; overflow: hidden;}
#exibicao .produto .galeria .ajax .mini img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover;}
#exibicao .produto .galeria .ajax .mini:hover { outline: 2px solid rgb(55 171 200) !important;}
#exibicao .produto .galeria .ajax .mini.ativo { outline: 2px solid rgb(55 171 200);}
#exibicao .produto .galeria .ajax:hover .mini.ativo { outline: 2px solid rgb(90 90 90);}
#exibicao .produto .galeria .zoom { float: right; background-color: rgb(90 90 90 / 10%); position: relative; overflow: hidden;}
#exibicao .produto .galeria .zoom .imagem { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#exibicao .produto .galeria .zoom .imagem img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover;}
#exibicao .produto .galeria .zoom .video { position: absolute; width: 90%; top: 23%; left: 5%; outline: 5px solid rgb(250 250 250);}
#exibicao .produto .galeria .zoom .video .iframe { position: relative; width: 100%; padding-bottom: 56%; overflow: hidden;}
#exibicao .produto .galeria .zoom .video .iframe iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#exibicao .produto .galeria .carregando { background-color: rgb(250 250 250 / 50%);}
#exibicao .produto .detalhes { float: left; width: 100%;}
#exibicao .produto .detalhes .titulo { float: left; width: 100%; margin: 0 0 20px;}
#exibicao .produto .detalhes .titulo h1 { float: left; width: 100%; font-weight: bold; font-size: 2em; line-height: 1;}
#exibicao .produto .detalhes .titulo h2 { float: left; width: 100%; margin: 10px 0 0; font-size: 1.1em;}
#exibicao .produto .detalhes .preco { float: left; width: 100%;}
#exibicao .produto .detalhes .preco h2 { float: left; width: 100%; font-weight: bold; font-size: 2em; line-height: 1;}
#exibicao .produto .detalhes .preco h5 { float: left; width: 100%; margin: 0 0 3px; text-decoration: line-through; font-size: 1em; line-height: 1;}
#exibicao .produto .frete { float: left; width: 100%;}
#exibicao .produto .frete .ico { float: left; width: 29px; height: 25px; margin: 4px 10px 0 0; background-image: url('../../imagens/loja/exibicao-produto-frete-ico.png'); background-position: 50%; background-repeat: no-repeat;}
#exibicao .produto .frete .cep { float: left; width: 130px; height: 30px; outline: 1px solid rgb(90 90 90 / 60%); outline-offset: -1px; text-align: center;}
#exibicao .produto .frete .ok { float: left; width: 30px; padding: 15px 0; margin: 0 10px 0 3px; background-color: rgb(47 167 101); text-align: center; font-weight: bold; font-style: normal; font-size: 0.9em; color: rgb(250 250 250); line-height: 0;}
#exibicao .produto .frete .ok:hover { background-color: rgb(42 131 82);}
#exibicao .produto .frete .prazo { float: left; padding: 15px 0; font-weight: normal; line-height: 0;}
#exibicao .produto .escolhas { float: left; width: 100%;}
#exibicao .produto .escolhas .cores { float: left; width: 100%;}
#exibicao .produto .escolhas .tamanho { float: left; width: 100%;}
#exibicao .produto .escolhas .quantidade { float: left; width: 100%;}
#exibicao .produto .escolhas .quantidade .ico { float: left; width: 50px; height: 40px; outline: 1px solid rgb(142 167 127); background-color: rgb(142 167 127 / 90%); background-position: 50%; background-repeat: no-repeat;}
#exibicao .produto .escolhas .quantidade .ico.mais { background-image: url('../../imagens/loja/exibicao-produto-escolhas-quantidade-mais.png');}
#exibicao .produto .escolhas .quantidade .ico.menos { background-image: url('../../imagens/loja/exibicao-produto-escolhas-quantidade-menos.png');}
#exibicao .produto .escolhas .quantidade .ico:hover { background-color: rgb(142 167 127);}
#exibicao .produto .escolhas .quantidade .campo { float: left; width: 80px; height: 40px; margin: 0 5px; outline: 1px solid rgb(90 90 90 / 60%); text-align: center;}
#exibicao .produto .escolhas .quantidade .disponivel { float: left; padding: 20px 0; margin: 0 0 0 10px; font-weight: normal; line-height: 0;}
#exibicao .produto .comprar { float: left; width: 100%;}
#exibicao .produto .comprar .comprando { float: left; width: 100%; font-size: 0.9em;}
#exibicao .produto .comprar .comprando strong { font-weight: normal;}
#exibicao .produto .comprar .comprando em { font-style: normal;}
#exibicao .produto .comprar .carrinho { float: left; width: 220px; padding: 30px; outline: 2px solid rgb(47 167 101); outline-offset: -2px; text-transform: uppercase; text-align: center; font-weight: bold; color: rgb(47 167 101); line-height: 0;}
#exibicao .produto .comprar .carrinho:hover { background-color: rgb(142 167 127 / 20%);}
#exibicao .produto .comprar .linha { float: left; width: 100%; height: 1px;}
#exibicao .produto .comprar .agora { float: left; width: 220px; padding: 30px; margin: 10px 0 0; background-color: rgb(47 167 101); text-transform: uppercase; text-align: center; font-weight: bold; color: rgb(250 250 250); line-height: 0;}
#exibicao .produto .comprar .agora:hover { background-color: rgb(42 131 82);}
#exibicao .produto .apresentacao { float: left; width: 90%; padding: 20px 5% 10px; margin: 21px 0; outline: 1px solid rgb(142 167 127 / 30%); background-color: rgb(142 167 127 / 20%)}
#exibicao .produto .apresentacao .nome { float: left; width: 100%;}
#exibicao .produto .apresentacao .nome h2 { float: left; width: 100%; font-weight: bold; font-size: 1.8em;}
#exibicao .produto .apresentacao .texto { float: left; width: 100%; font-size: 1em; line-height: 1.6;}
#exibicao .produto .apresentacao .texto h2 { font-weight: bold; font-size: 1.8em;}
#exibicao .produto .apresentacao .texto h3 { font-weight: bold; font-size: 1.3em;}
#exibicao .produto .apresentacao .texto a:hover { text-decoration: underline;}
#exibicao .produto .apresentacao .texto img { max-width: 100%;}
#exibicao .produto .apresentacao .texto iframe { max-width: 100%;}
#exibicao .produto .caracteristicas { float: left; width: 90%; margin: 21px 5%;}
#exibicao .produto .caracteristicas .nome { float: left; width: 100%;}
#exibicao .produto .caracteristicas .nome h2 { float: left; width: 100%; font-weight: bold; font-size: 1.8em;}
#exibicao .produto .caracteristicas .tab { float: left; width: 100%; padding: 20px 0; margin: 0 0 2px; background-color: rgb(142 167 127 / 20%); position: relative;}
#exibicao .produto .caracteristicas .tab .nome { position: absolute; width: 160px; height: 100%; top: 0; left: 0; background-color: rgb(142 167 127 / 20%);}
#exibicao .produto .caracteristicas .tab .nome b { position: absolute; width: 100%; height: 16px; top: 50%; left: 0; margin: -8px 5px 0; text-align: center; line-height: 1;}
#exibicao .produto .caracteristicas .tab .descricao { float: left; margin: 0 0 0 160px;}
#exibicao .produto .caracteristicas .tab .descricao b { float: left; margin: 0 20px; font-weight: normal;}
#exibicao .produto .adicionado { float: left; width: 90%; padding: 21px 5%; border-bottom: 1px solid rgb(90 90 90 / 20%); position: relative;}
#exibicao .produto .adicionado .emcima { float: left; width: 100%; text-align: center;}
#exibicao .produto .adicionado .emcima strong.ok { padding: 0 0 0 28px; background-image: url('../../imagens/loja/exibicao-produto-adicionado-ok.png?'); background-position: 0 50%; background-repeat: no-repeat; font-size: 1.5em; color: rgb(47 167 101); line-height: 1.7;}
#exibicao .produto .adicionado .emcima strong.detalhamento b { font-weight: normal;}
#exibicao .produto .adicionado .emcima strong.detalhamento em { font-style: normal;}
#exibicao .produto .adicionado .botoes { float: left; width: 100%; padding: 20px 0; margin: 20px 0 0; text-align: center;}
#exibicao .produto .adicionado .botoes a { padding: 20px 11px; text-transform: uppercase; text-align: center; font-weight: bold; line-height: 0;}
#exibicao .produto .adicionado .botoes a.ver { background-color: rgb(142 167 127 / 10%); outline: 1px solid rgb(142 167 127 / 40%); outline-offset: -1px; color: rgb(47 167 101);}
#exibicao .produto .adicionado .botoes a.ver:hover { background-color: rgb(142 167 127 / 20%);}
#exibicao .produto .adicionado .botoes a.finalizar { background-color: rgb(47 167 101); margin: 0 0 0 5px; color: rgb(250 250 250);}
#exibicao .produto .adicionado .botoes a.finalizar:hover { background-color: rgb(42 131 82);}

#exibicao .departamento { float: left; width: 100%; margin: 21px 0;}
#exibicao .departamento .lado1 { float: left; width: 20%;}
#exibicao .departamento .lado2 { float: right; width: 78%;}
#exibicao .departamento .listar { float: left; width: 100%; min-height: 50px; position: relative;}
#exibicao .departamento .listar .ajax { min-height: 100px;}
#exibicao .departamento .listar .carregando { float: left; height: 100px; position: relative;}
#exibicao .departamento .listar .mercadoria { float: left; width: 23%; margin: 10px 1%;}
#exibicao .departamento .listar .linha2 { display: none; float: left; width: 100%; height: 1px;}
#exibicao .departamento .listar .linha4 { float: left; width: 100%; height: 1px;}

@media only screen and (max-width: 1000px){
  #exibicao .produto { margin: 11px 0;}

  #exibicao .departamento { margin: 11px 0;}
  #exibicao .departamento .lado1 { width: 100%;}
  #exibicao .departamento .lado2 { width: 100%;}
}
@media only screen and (max-width: 800px){
  #exibicao .produto .lado1 { float: left; width: 90%; margin: 31px 5% 0;}
  #exibicao .produto .lado2 { float: left; width: 90%; margin: 31px 5% 0;}
  #exibicao .produto .detalhes .titulo h1 { font-size: 1.5em;}

  #exibicao .departamento .listar .mercadoria { width: 48%; margin: 10px 1%;}
  #exibicao .departamento .listar .linha2 { display: block;}
  #exibicao .departamento .listar .linha4 { display: none;}
}
@media only screen and (max-width: 600px){
  #exibicao .produto .galeria .ajax { width: 60px;}
  #exibicao .produto .galeria .ajax .mini { width: 40px; height: 40px; border: 3px solid rgb(250 250 250);}
}
@media only screen and (max-width: 500px){
  #exibicao .produto .adicionado .botoes a { font-size: 0.9em;}
}