/* PRODUTOS CSS */
html, body {
font-weight: 500;
letter-spacing: 0.01em;
font-size: 14px;
background-color: #FFFFFA;
margin: 0;
padding: 0;
}
.bg-color{ color: #FFFFFA; }
.m-color { color: #8B4513; }
.bod {
display: flex;
flex-direction: row;
justify-content: center;
width: 100%;
height: 100%;
background-color: lightcyan;
background-color: transparent;
}
.wrap {
display: flex;
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
width: 100%;
height:1000px;
background-color: red
background-color: transparent;
align-items: top;
}
.box {
display:flex;
flex-direction: column;
width: 400px;
font-size: 15px;
color: white;
}
.box-a {
height:470px;
background-color: lightsteelblue;
background-color: transparent;
}
.box-b {
height:550px;
background-color: lightpink;
background-color: transparent;
}
/* -------------------- MEDIA QUERY - DESK ----------*/
@media (min-width: 1200px) {
.wrap{ height:550px };
}
/* -------------------- MEDIA QUERY - NOTE BOOK ----------*/
@media (min-width: 992px) {
.wrap{ height:550px };
}
/* ------------------- TABLET ---------------------------- */
@media (min-width: 768px) {
.bt-comprar, .bt-adicionar, .bt-vitrine { width:150px; }
}
/* ------------------- SMART ---------------------------- */
@media (min-width: 576px) {
.bt-comprar, .bt-adicionar, .bt-vitrine { width:150px; }
}
/* ------------- SMART MINI DEFAULT ---------------------------- */
.produto-image {
width: 400px;
align-items: center;
justify-content: center;
padding-left: 5px;
background-color: lightgray;
background-color: transparent;
}
.produto-titulo {
width: 400px;
text-align: left;
padding-left: 10px;
font-weight: 400;
font-size: 20px;
letter-spacing: 0px;
}
.produto-sku {
padding-left: 10px;
font-size: 12px;
font-weight: 400;
color:#888;
margin-top:-8px;
margin-bottom : 15px
}
.produto-valor-anterior {
padding-left: 10px;
font-weight: 500;
font-size: 15px;
text-decoration: line-through;
}
.produto-valor-atual {
padding-left: 10px;
font-weight: 400;
font-size: 22px;
margin-top: -5px;
}
.produto-parcelamento {
padding-left: 10px;
font-weight: 500;
font-size: 15px;
margin-top: -5px;
}
.descricao-titulo {
width: 400px;
margin-bottom: 10px;
font-weight: 500;
font-size: 20px;
color: #333;
text-decoration: none;
text-align: left;
padding-left: 10px;
}
#descricao-texto{
width: 400px;
margin-bottom: 20px;
font-weight: 500;
font-size: 15px;
text-decoration: none;
text-align: left;
padding-left: 10px;
}
.qtd-container {
display: flex;
width: 90px;
min-width:90px;
height: 30px;
border: 1px solid #D2691E;
border-radius: 4px;
padding-left: 0px;
margin-left: 10px;
}
.qtd-minus-plus {
height: 28px;
width: 28px;
cursor: pointer;
opacity: 1;
}
.qtd-dial {
width: 31px;
font-weight: 500;
font-size: 15px;
line-height: 22px;
text-align: center;
margin-top: 3px;
}
#div-botoes {
width: 350px;
margin-left: 10px;
}
.bt-adicionar, .bt-comprar, .bt-vitrine {
display:flex;
width: 370px;
height: 40px;
min-height: 40px;
margin-top: 10px;
margin-left: 10px;
background-color: #196909;
color:white;
font-weight: 500;
font-size: 15px;
justify-content: center;
align-items: center;
text-align: center;
border-radius: 5px;
cursor: pointer;
}
.bt-adicionar:hover { background-color: #8B4513; }
.bt-comprar:hover { background-color: #8B4513; }
.bt-adicionar, .bt-comprar { display:none; }
.bt-vitrine {
background-color: transparent;
border: 2px solid #8B4513;
color: #8B4513;
padding-left: 10px;
}
.bt-vitrine:hover {
background-color: #8B4513;
color: white;
padding-left: 10px;
}
.cep-frame {
display: flex;
width:240px;
min-width:240px;
height: 30px;
min-height: 30px;
margin-left: 30px;
margin-top: 0px;
/* border:none;*/
border: 1px solid #D2691E;
border-radius: 3px;
justify-content: right;
align-items: center;
text-align: center;
visibility: visible;
font-size: 15px;
}
.input-cep {
width: 100px;
margin-left:10px;
border:0px;
outline:none;
padding-block: 0px;
padding-inline: 0px;
}
.btn-cep {
width: 70px;
height: 22px;
line-height: 22px;
font-size: 15px;
padding-top:0px;
border-radius: 3px;
color:white;
background-color: #196909;
margin-right:8px;
cursor: pointer;
}
.btn-cep:hover { background-color: #8B4513; }
.div-info {
width:400px;
padding:10px;
margin-top:30px;
font-size: 15px;
padding-left: 10px;
}
.card-info {
width:400px;
padding:0px;
margin-top:15px;
font-size: 15px;
border:none;
padding-left: 10px;
text-align: left;
color: #8B4513;
background-color: transparent;
}
#descricao-main {
width: 400px;
justify-content: center;
align-items: center;
text-align: left;
font-weight: 500;
font-style: normal;
font-size: 15px;
padding: 20px;
margin-left: 40px;
}
.swiper { width: 380px; }
.main {
align-items: center;
height: auto;
justify-content: center;
background-color: transparent;
}
.swiper-slide img {
display: block;
width: 100%;
height: 100%;
}
.swiper-slide {
font-size: 18px;
display: flex;
justify-content: center;
align-items: center;
background-size: cover;
background-position: center;
}
.swiper-img {
height: 370px;
width: 370px;
align-items: center;
margin-right: 70px;
}
.swiper-thumbs {
height: 90px;
width: 370px;
box-sizing: border-box;
padding-top: 8px;
margin-right: 70px;
}
.swiper-thumbs .swiper-slide {
width: 0%;
height: 100%;
opacity: 1;
}
.swiper-thumbs .swiper-slide-thumb-active {
opacity: 1;
}
/*
.produto-image {
width: 400px;
margin-top: 0px;
margin-right: 0px;
align-items: center;
justify-content: center;
}
.main-coluna1-detalhe {
height:800px;
min-height: 100%;
align-items: center;
justify-content: center;
background-color: transparent;
}
.main-coluna2-detalhe {
height:800px;
min-height: 100%;
padding-left: 30px;
background-color: transparent;
}
.div-coluna1-detalhe-image {
margin-top: 0px;
margin-right: 0px;
}
.image-detalhe {
width: 380px;
height: 380px;
}
.produto-detalhe-titulo {
width: 400px;
font-weight: 400;
font-size: 20px;
letter-spacing: 0px;
margin-bottom : 0px;
}
.sku {
font-size: 12px;
font-weight: 400;
color:#888;
margin-top:-8px;
margin-bottom : 15px
}
.div-coluna1-detalhe-valor-anterior {
font-weight: 500;
font-size: 15px;
text-decoration: line-through;
letter-spacing: 0px;
}
.div-coluna1-detalhe-valor-atual {
font-weight: 400;
font-size: 22px;
margin-top: -5px;
}
.div-coluna1-detalhe-valor-cartao {
font-weight: 500;
font-size: 15px;
margin-top: -5px;
}
.div-coluna2-detalhe {
margin-left: 50px;
}
.sp10{ width: 300px; height: 10px; min-height: 10px; background-color: #FFFFFA; }
.sp15{ width: 300px; height: 15px; min-height: 15px; background-color: #FFFFFA; }
.sp20{ width: 300px; height: 20px; min-height: 20px; background-color: #FFFFFA; }
.sp30{ width: 300px; height: 30px; min-height: 30px; background-color: #FFFFFA; }
.sp40{ width: 300px; height: 40px; min-height: 40px; background-color: #FFFFFA; }
img { vertical-align: top; }
.qtd-container {
display: flex;
width: 90px;
min-width:90px;
height: 30px;
border: 1px solid #D2691E;
border-radius: 4px;
}
.qtd-minus-plus {
height: 28px;
width: 28px;
cursor: pointer;
opacity: 1;
}
.qtd-dial {
width: 31px;
font-weight: 500;
font-size: 15px;
line-height: 22px;
text-align: center;
margin-top: 3px;
}
#div-botoes {
width: 350px;
margin-left: 0px;
}
.bt-adicionar, .bt-comprar, .bt-vitrine
{
display:flex;
width: 370px;
height: 40px;
min-height: 40px;
margin-top: 10px;
background-color: #196909;
color:white;
font-weight: 500;
font-size: 15px;
justify-content: center;
align-items: center;
text-align: center;
border-radius: 5px;
cursor: pointer;
}
.bt-adicionar:hover { background-color: #8B4513; }
.bt-comprar:hover { background-color: #8B4513; }
.bt-adicionar, .bt-comprar { display:none; }
.bt-vitrine {
background-color: transparent;
border: 2px solid #8B4513;
color: #8B4513;
}
.bt-vitrine:hover {
background-color: #8B4513;
color: white;
}
.cep-frame {
display: flex;
width:240px;
min-width:240px;
height: 30px;
min-height: 30px;
margin-left: 20px;
margin-top: 0px;
padding: 0px;
border: 1px solid #D2691E;
border-radius: 4px;
justify-content: center;
align-items: center;
text-align: center;
visibility: visible;
font-size: 15px;
}
.input-cep
{
width: 100px;
margin-left:10px;
border:0px;
outline:none;
padding-block: 0px;
padding-inline: 0px;
}
.btn-cep {
width: 50px;
height: 20px;
line-height: 20px;
font-size: 12px;
padding-top:0px;
border-radius: 3px;
color:white;
background-color: #196909;
margin-left:10px;
cursor: pointer;
}
.btn-cep:hover { background-color: #8B4513; }
.div-info {
width:400px;
padding:0px;
margin-top:30px;
font-size: 15px;
}
#card-info {
width:400px;
padding:0px;
margin-top:10px;
font-size: 15px;
border:none;
}
#descricao-main {
width: 400px;
justify-content: center;
align-items: center;
text-align: left;
font-weight: 500;
font-style: normal;
font-size: 15px;
padding: 20px;
margin-left: 40px;
}
.descricao-titulo {
width: 400px;
font-weight: 500;
font-size: 20px;
color: #333;
text-decoration: none;
text-align: left;
margin-bottom: 10px;
}
#descricao-texto{
width: 400px;
font-weight: 500;
font-size: 15px;
text-decoration: none;
text-align: left;
margin-bottom: 20px;
}
@media screen and (min-width: 992px)
{
.dsk-container-detalhe { display:flash; }
.smt-container-detalhe { display:none; }
.bt-comprar, .bt-adicionar, .bt-vitrine { width:370px; }
}
@media screen and (max-width: 991.98px)
{
.main-coluna1-detalhe,
.main-coluna2-detalhe,
.produto-detalhe-image,
.produto-detalhe-titulo,
.sku,
#descricao-main,
.descricao-titulo,
#descricao-texto { width: 350px; }
.image-detalhe { width: 350px; height: 350px; }
.input-cep { width: 90px; margin-left:0px; }
#div-condicoes-de-venda,
#div-condicoes-de-entrega { width:340px;}
.dsk-container-detalhe { display:flash; }
.smt-container-detalhe { display:none; }
.bt-comprar, .bt-adicionar, .bt-vitrine { width:150px; }
.main-coluna1-detalhe { background-color: #999; }
.main-coluna2-detalhe { background-color: #ddd; }
.swiper { background-color: #ff9; }
}
@media screen and (max-width: 575.78px)
{
.dsk-container-detalhe { display:none; }
.smt-container-detalhe { display:flash; }
.bt-comprar, .bt-adicionar, .bt-vitrine { width:150px; }
.main-coluna1-detalhe { background-color: #999; }
.main-coluna2-detalhe { background-color: #ddd; }
.swiper { background-color: lightgoldenrodyellow; }
}
*/