/* font-family: 'Roboto', sans-serif; // Botões - Equivalente Helvetica do psd */
    
    

/* —————————————————————————————— clear.css —————————————————————————————— */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, textarea
{outline:0;	border-style: none;
	border-color: inherit;
	border-width: 0;
	margin: 0;
	padding: 0;
	font-size:12px;	font-weight:normal;	vertical-align:top;	background:transparent;	outline:none;
	text-align: left;
}
b {font-weight:bold;}
i {font-style:italic;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}
table {border-collapse:collapse;border-spacing:0;}
a, span {vertical-align:baseline;}




/* ---------------------------------------- */
/* Tags ----------------------------------- */



html{
	width: 100%;
	height: 100%;
}

body{
	width: 100%;
	height: 100%;
    overflow-x: hidden;
}

h1{
    font-family: 'Roboto', sans-serif;
    font-size: 40px;
    color: #000;
    font-weight: 800;
    margin-bottom: 10px;
}

h2{
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 54px;
    line-height: 54px;
    color: #000;
    font-weight: 100;
    text-shadow: 0px 0px 4px rgba(0,0,0, 0.5);
}
    
h2 span{
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 54px;
    color: #000;
    font-weight: 700;
}

.espaco50{
    height: 50px;
}

.espaco75{
    height: 75px;        
}
    
.espaco100{
    height: 100px;
}
    
.espaco150{
    height: 150px;
}

.espaco200{
    height: 200px;
}

    
a:link{
    text-decoration: none;
}
a:active{
    text-decoration: none;
}
a:visited{
    text-decoration: none;
}
a:hover{
    text-decoration: underline;
}

.frisoProduto{
    height: 10px;
    margin-top: 16px;
    margin-bottom: 20px;
    background-image: url(imagens/friso_chanfro_2000.png);
    background-position: center center;
    background-repeat: no-repeat;
}
    
.bD{
    font-weight: bold;
    color: darkblue;
    font-size: 100%;
    background-color: #ff8;
}







/* ---------------------------------------- */
/* Menu Loja ------------------------------ */
/* Configure aqui o topo com o visual da loja */
.menuLoja{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    padding: 20px;
    color: #000;
    min-height: 40px;
    position: relative;
    background-color: #000;
    margin-bottom: 20px;
}

.menuLoja_logo{
    position: absolute;
    top: 10px;
    left: 20px;
    display: table;
}

.menuLoja_logo img{
    width: 330px;
    transition-property: width;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: width;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}

.menuLoja_logoNav{
    position: absolute;
    top: 46px;
    right: 20px;
    display: table;
    text-align: right;
}
.menuLoja_logoNav a{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    font-size: 14px;
    margin-left: 10px;
    margin-right: 10px;
}
.menuLoja_logoNav a:link{
    color: #fff;
    font-size: 14px;
}
.menuLoja_logoNav a:active{
    color: #fff;
    font-size: 14px;
}
.menuLoja_logoNav a:visited{
    color: #fff;
    font-size: 14px;
}
.menuLoja_logoNav a:hover{
    color: #fff;
    font-size: 14px;
}






/* ---------------------------------------- */
/* Topo e Menu ---------------------------- */
 
.logo{
    transition-property: width;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: width;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}
    
.topo{
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: #000;
    color: #fff;
    text-align: center;
    width: 100%;
    padding: 25px 0px;
    z-index: 1000;
}

.logo_cotoficio{
    position: absolute;
    top: 10px;
    left: 10px;
    display: table;
}
    
.boxMenu{
    position: absolute;
    top: 0px;
    right: -300px;
    display: table;
    z-index: 10;
    background-color: #000;
    color: #fff;
    padding: 36px 20px 20px 20px;
    width: 240px;
    height: 100vh;
    text-align: center;
}

.boxMenu nav{
    margin-top: 40px;
    border-top: 2px solid #212121;
}

.boxMenu nav li{
    padding: 20px 4px;
    border-bottom: 2px solid #212121;
    background-color: #000;
    transition-property: background-color;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: background-color;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}

.boxMenu nav li:hover{
    background-color: #080808;
}

.boxMenu nav li a{
    color: #e8e8e8;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    transition-property: color;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}
.boxMenu nav li a:link{
    color: #e8e8e8;
}
.boxMenu nav li a:active{
    color: #e8e8e8;
}
.boxMenu nav li a:visited{
    color: #e8e8e8;
}
.boxMenu nav li a:hover{
    color: #fff;
}

.box_bt_menu{
    position: absolute;
    top: 0px;
    right: 0px;
    display: table;
    width: 150px;
    height: 100%;
    text-align: center;
    z-index: 10;
    cursor: pointer;
}
    
.box_bt_menu_meio{
    display: table-cell;
    width: 100%;
    height: 100%;
    color: #222;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    background-color: #eee;
    text-align: center;
    vertical-align: middle;
    font-size: 16px;
    transition-property: background-color color;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: background-color color;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}

.box_bt_menu_meio:hover{
    color: #000;
    background-color: #fff;
}

.menu_ico{
    position: absolute;
    top: 20px;
    right: 20px;
    width: 32px;
    height: 32px;
    display: none;
    background-image: url(imagens/ico_menu.png);
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0.85;
    z-index: 10;
    cursor: pointer;
    transition-property: opacity;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease;
}

.menu_ico:hover{
    opacity: 1;
}


.boxMenu_bt_fechar{
    position: absolute;
    top: 6px;
    right: 6px;
    width: 32px;
    height: 32px;
    background-image: url(imagens/bt_fechar.png);
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.8;
    cursor: pointer;
    transition-property: opacity;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}

.boxMenu_bt_fechar:hover{
    opacity: 1;
}


.setaSobe{
    position: fixed;
    bottom: 15px;
    right: -100px;
    display: table;
    background-color: #0e3e6a;
    border-radius: 5px;
    z-index: 1002;
    cursor: pointer;
}

.setaSobe img{
    opacity: 0.8;
    transition-property: opacity width;
    transition-duration: 0.25s;
    transition-timing-function: ease;
    -webkit-transition-property: opacity width;
    -webkit-transition-duration: 0.25s;
    -webkit-transition-timing-function: ease;
}

.setaSobe img:hover{
    opacity: 1;
}


    
    

/* ---------------------------------------- */
/* Home ----------------------------------- */
.pagHome{
    width: 100%;
    height: 100vh;
    position: relative;
}
    
.bannerFundo{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: #465d8d;
}

.banner_quadro{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
    
.home_login{
    position: absolute;
    top: 0px;
    left: 0px;
    display: table;
    width: 100%;
    height: 100%;
    z-index: 10;
    text-align: center;
}    

.home_login_middle{
    display: table-cell;
    width: 100%;
    height: 100%;
    text-align: center;
    vertical-align: middle;
}
    
.slogan_h1{
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 34px;
    color: #fff;
    text-shadow: 0px 0px 4px rgba(0,0,0, 0.5);
    transition-property: font-size;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    -webkit-transition-property: font-size;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease;
}

.slogan_h2{
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 39px;
    color: #fff;
    font-weight: bold;
    text-shadow: 0px 0px 4px rgba(0,0,0, 0.5);
    transition-property: font-size;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    -webkit-transition-property: font-size;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease;
}

.slogan_h3{
    font-family: 'Roboto', sans-serif;
    text-align: center;
    font-size: 54px;
    line-height: 54px;
    color: #fff;
    font-weight: 100;
    text-shadow: 0px 0px 4px rgba(0,0,0, 0.5);
    transition-property: font-size;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    -webkit-transition-property: font-size;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease;
}
    
.div_form{
    width: 50%;
    margin: 0 auto;
    margin-top: 0px;
    min-width: 800px;
    display: grid;
    grid-template-columns: 40% 40% 20%;
}
    
.div_form .item{
    text-align: center;
}


.div_form_alert{
    margin: 0 auto;
    width: 230px;
    padding: 10px;
    background-color: #ffa;
    font-size: 14px;
    font-style: italic;
    font-weight: bold;
    color: #444;
    text-align: left;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.div_form_alert2{
    opacity: 0;
}


    
/* ---------------------------------------- */
/* História ------------------------------- */
.historia{
    position: relative;
    display: table;
    width: 100%;
    height: 100vh;
    background-image: url(imagens/historia_fundo.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 100px;
}
    
.historia_box{
    position: absolute;
    top: 100px;
    left: 20%;
    width: 70%;
    background-color: rgba(255,255,255, 0.8);
    padding: 30px;
    color: #000;
}
    
.historia .textoDuplo{
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 24px;
    margin-top: 20px;
    column-count: 2;
    column-gap: 40px;
    -moz-column-count: 2;
    -moz-column-gap: 40px;
    -webkit-column-count: 2;
    -webkit-column-gap: 40px;
    -o-column-count: 2;
    -o-column-gap: 40px;
}

.historia .textoDuplo h4{
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    line-height: 24px;
    margin-top: 20px;
    font-weight: bold;
}

.logoAlbini{
    width: 90%;
    max-width: 400px;
    padding-top: 40px;
    padding-bottom:40px;
    transition-property: width;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: width;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}

    
    

/* ---------------------------------------- */
/* Contato -------------------------------- */
.contato{
    width: 100%;
    min-height: 100vh;
    box-sizing: border-box;
    padding-bottom: 40px;
}
    
.contato_area{
    margin: 0 auto;
    margin-top: 100px;
    width: 90%;
    max-width: 1000px;
    display: grid;
    grid-template-columns: 10% 40% 50%;
}

.contatoBoxTable{
    font-family: 'Roboto', sans-serif;
    display: table;
    width: 100%;
    height: 100%;
}

.contatoBoxCel{
    display: table-cell;
    width: 100%;
    height: 100%;
    text-align: left;
    vertical-align: middle;
    font-size: 20px;
    line-height: 36px;
}

.contatoBoxTable a:link{
    font-size: 20px;
    color: #444;
    transition-property: color;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.5s;
    -webkit-transition-timing-function: ease;
}
.contatoBoxTable a:active{
    font-size: 20px;
    color: #444;
}
.contatoBoxTable a:visited{
    font-size: 20px;
    color: #444;
}
.contatoBoxTable a:hover{
    font-size: 20px;
    color: #000;
}

.contatoFrame{
    width: 400px;
    height: 600px;
}
    



/* ---------------------------------------- */
/* Produtos  ------------------------------ */
.pagProduto{
    position: relative;
    display: table;
    width: 100%;
    min-height: 100vh;
    margin-top: 50px;
}

.produto_tab_pag{
    display: table;
    width: 100%;
    min-height: 100vh;
    background-image: url(imagens/historia_fundo.jpg);
    background-position: top;
    background-repeat: repeat-y;
    background-size: auto 100vh;
}

.produto_lista{
    display: block;
    padding-bottom: 60px;
    margin-bottom: 120px;
}

.produto_tab{
    display: table;
    width: 100%;
    height: 100vh;
}

.produto_cell{
    display: table-cell;
    width: 100%;
    height: 100%;
    text-align: center;
    vertical-align: middle;
}

.produto_pag_detalhes{
    position: relative;
    width: 90%;
    max-width: 1000px;
    min-width: 900px;
    margin: 0 auto;
    padding: 50px;
    border: 1px solid #000;
    background-color: rgba(255,255,255,0.7);
    box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
}

.produto_pag_fechar{
    position: absolute;
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
}

.produto_pag_fechar img{
    width: 100%;
    opacity: 0.7;
    cursor: pointer;
}

.produto_pag_fechar img:hover{
    opacity: 1;
}

.produto_busca{
    width: 90%;
    max-width: 900px;
    margin: 0 auto;
    padding: 50px;
    border: 1px solid #000;
    background-color: rgba(255,255,255,0.7);
    box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
}

.rotuloMiddle{
    display: inline-block;
    height: 40px;
    margin-right: 10px;
    font-family: 'Roboto', sans-serif;
}

.rotuloMiddle_cell{
    display: table-cell;
    height: 35px;
    padding-top: 12px;
    vertical-align: middle;
}
    
.produtos_areaBusca{
    text-align: right;
}

.produtos_box_grid{
    padding: 10px;
}

.produtos_box{
    display: inline-block;
    margin: 10px 20px 20px 20px;
}

.produtos_box img{
    width: 234px;
    border: 1px solid #000;
    margin-bottom: 10px;
}

.produtos_box_linha{
    display: grid;
    grid-template-columns: 65% 35%;
}

.produto_box_tit{
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    color: #000;
    font-weight: bold;
    text-transform: uppercase;
}

.produto_box_bt{
    text-align: right;
}

.produtos_layout_grid{
    display: grid;
    grid-template-columns: 30% 34% 32%;
    grid-column-gap: 2%;
}

.produtos_layout_grid .coluna3{
    position: relative;
}

.produtos_detalhes_bottom{
    margin-top: 64px;
    text-align: right;
}

.produto_titulo{
    display: table;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 18px;
    padding-bottom: 10px;
    margin-top: -2px;
    background-image: url(imagens/friso_chanfro_2000.png);
    background-position: center bottom;
    background-repeat: no-repeat;
}

.box_caracteristicas{
    margin-top: 20px;    
}

.box_caracteristicas .carac{
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #999;
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    font-size: 14px;
}

.box_caracteristicas .carac:last-child{
    border-bottom: 0px solid #555;
}

.box_caracteristicas span{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 16px;
}

.capaProduto{
    width: 100%;
    margin-bottom: 10px;
}

.produto_icones img{
    width: 15%;
}

.box_altura{
    height: 80px;
}

.produtos_layout_grid h1{
    display: table;
    font-size: 30px;
    padding-bottom: 10px;
    background-image: url(imagens/friso_chanfro_2000.png);
    background-position: center bottom;
    background-repeat: no-repeat;
}

.produtos_areaBusca{
    padding-top: 20px;
}

.produtos_areaCampos{
    margin-top: 10px;
    display: grid;
    grid-template-columns: 38% 62%;
}

.produtos_areaCampos_L{
    padding-left: 4px;
    padding-bottom: 10px;
}
.produtos_areaCampos_L:last-child{
    border-top: 2px solid #888;
    padding-top: 10px;
}

.produtos_areaCampos_R{
    text-align: right;
    padding-top: 0px;
    padding-bottom: 10px;
}
.produtos_areaCampos_R:last-child{
    border-top: 2px solid #888;
    padding-top: 10px;
}

.totalValor{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 24px;
    color: #444;
}

.totalValor_legenda{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 18px;
    color: #444;
}

.totalValor_legenda2{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #444;
}


.produtos_cesta_resumo{
    border-top: 1px solid #000;
    margin-top: 8px;
}

.produtos_cesta_resumo_linha{
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    font-size: 12px;
    color: #000;
    padding-left: 50px;
    padding-top: 8px;
    padding-bottom: 8px;
    background-position: left;
    background-repeat: no-repeat;
    background-size: 30px auto;
    border-bottom: 1px solid #000;
}

.produtos_cesta_resumo_linha span{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #000;
}

.carrinho{
    background-image: url(imagens/carrinho.png);    
}
.calculadora{
    background-image: url(imagens/calculadora.png);    
}

.spanLegenda{
    font-family: 'Roboto', sans-serif;
    color: #888;
    font-size: 14px;
}

.span-indisponivel{
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    color: #f00;
    font-weight: bold;
    padding: 10px 20px;
}

.span-indisponivel-mini{
    font-size: 12px;
    padding: 4px 0px;
}




/* Paginação =========================== */
.paginacao{
    font-family: 'Roboto', sans-serif;
    display: flex;
    width: 90%;
    margin: 0 auto;
    margin-bottom: 16px;
    max-width: 700px;
    box-sizing: border-box;
    text-align: center;
    justify-content: center;
    align-content: center;
    align-items: center;
    cursor: default;
}

.paginacao-title{
    font-size: 12px;
    color: #000;
    margin-right: 20px;
    font-weight: 600;    
}

.paginacao-item{
    font-size: 14px;
    color: #000;
    padding: 0px 50px;
    font-weight: 600;
}
 
.paginacao .svg_bt_min{
    margin-left: 20px;
    margin-right: 20px;
}

.bt_paginacao{
    min-width: 25px;
    font-size: 14px;
    color: #444;
    font-weight: 600;
    cursor: pointer;
    padding: 4px;
    border: 1px solid #aaa;
    border-radius: 4px;
    background-color: transparent;
    transition-property: color, border, background-color;
    transition-duration: 0.35s;
    transition-timing-function: ease;
    -webkit-transition-property: color, border, background-color;
    -webkit-transition-duration: 0.35s;
    -webkit-transition-timing-function: ease;
}

.bt_paginacao:hover{
    color: #000;
    border: 1px solid #888;
}

.paginacao-destaque .bt_paginacao{
    font-size: 14px;
    color: #aaa;
    font-weight: 700;
    border: 1px solid #555;
    background-color: #555;
    pointer-events: none;
}


.paginacao-select{
    padding: 10px 10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 4px;
    margin-bottom: 4px;
    font-size: 14px;
}


/* ----------------------------------- */








/* ---------------------------------------- */
/* pagCesta ------------------------------- */
.pagCesta{
    font-family: 'Roboto', sans-serif;
    margin: 0 auto;
    margin-top: 150px;
    margin-bottom: 50px;
    padding-bottom: 50px;
    background-color: #fff;
    width: 90%;
    max-width: 1200px;
}

.cesta_cabecalho{
    display: grid;
    grid-template-columns: 24% 24% 50%;    
    grid-column-gap: 1%;
    padding: 2px;
}


.cesta_bloco_titulo{
    background-color: #000;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 16px;
    padding: 6px;
    text-align: center;
}

.cesta_cabecalho_friso{
    margin-top: 12px;
    border: 1px solid #999;
}

.cesta_bloco_SUBtitulo{
    background-color: #000;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    font-size: 12px;
    padding: 6px;
    text-align: center;
}

.cesta_opcaoPagamento{
    padding: 20px 10px;;
}

.cesta_bloco_SUBtitulo a{
    color: #ffb400;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 12px;
}
.cesta_bloco_SUBtitulo a:hover{
    color: #ffb400;
    font-size: 12px;
}
.cesta_bloco_SUBtitulo a:active{
    color: #ffb400;
    font-size: 12px;
}
.cesta_bloco_SUBtitulo a:visited{
    color: #ffb400;
    font-size: 12px;
}
.cesta_bloco_SUBtitulo a:hover{
    color: #ffb400;
    font-size: 12px;
    text-decoration: underline;
}

   
.cesta_opcaoPagamento_radio{
    background-position: 20px 10px;
    background-repeat: no-repeat;
    background-size: 110px auto;
    padding: 16px 0px;
}

.boleto{
    background-image: url(imagens/operadora_boleto.png);
}
.marca_paypal{
    background-image: url(imagens/operadora_payPal.png);
}

.cesta_opcaoPagamento_friso{
    margin-left: 10px;
    margin-right: 10px;
    height: 2px;
    border-bottom: 1px solid #999;
}

.bandeiras{
    padding-left: 10px;
}

.cesta_bloco_endereco{
    border-left: 1px solid #ddd;
    border-left-width: 80%;
    padding: 10px;
    font-family: 'Roboto', sans-serif;
}

.cesta_linha_endereco{
    padding-top: 12px;
    padding-bottom: 3px;
    font-size: 12px;
    color: #989898;
    border-bottom: 1px solid #ddd;
}

.div_table_detalhesCompra{
    padding-left: 10px;
    border-left: 1px solid #ddd;
}

.table_detalhesCompra{
    margin: 0 auto;
    width: 90%;
}
    
.table_detalhesCompra td{
    font-family: 'Roboto', sans-serif;
    color: #838282;
    font-size: 16px;
    vertical-align: middle;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid #ddd;
}

.table_detalhesCompra tr .detalhe{
    color: #000;
    font-size: 14px
}


.table_detalhesCompra tr:last-child  td{
    border-bottom: 0px solid #ddd;
}

.table_detalhesCompra img{
    width: 30px;
}

.table_detalhesCompra tr .td_total{
    color: #838282;
    font-size: 25px;
    font-weight: bold;
}

.table_detalhesCompra_bts{
    margin: 0 auto;
    margin-top: 20px;
    padding-bottom: 10px;
    width: 90%;
    text-align: right;
}

.cesta_itens{
    margin-top: 12px;
}

.cesta_itens_linha{
    border: 1px solid #999; 
    padding: 8px;
    margin-bottom: 10px;
}

.cesta_itens_colunas{
    display: grid;
    grid-template-columns: 10% 40% 25% 25%;
}

.cesta_itens_linha_capa{
    width: 100%;
}

.cesta_itens_coluna_02{
    padding: 10px;
    padding-left: 20px;
}

.cesta_itens_coluna_02 h4{
    font-family: 'Roboto', sans-serif;
    color: #000;
    font-size: 24px;
    font-weight: bold;
}

.cesta_itens_table{
    width: 70%;
}

.cesta_itens_table td{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: #838282;
    padding-top: 4px;
    padding-bottom: 4px;
}

.cesta_itens_table tr .rotulo{
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #000;
}

.tab{
    display: table;
    width: 90%;
    margin: 0 auto;
    height: 100%;
}

.cell{
    display: table-cell;
    width: 100%;
    height: 100%;
    text-align: center;
    vertical-align: middle;
}

.rodulo_quantidade{
    text-align: center;
    font-weight: bold;
    margin-top: 10px;
    font-size: 14px;
    color: #000;
}

.cesta_itens_linha_total{
    color: #838282;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 10px;
}

.col04_interno{
    margin: 0 auto;
    width: 90%;
}

.cesta_informacoes_obs{
    padding-top: 10px;
    padding-bottom: 10px;
    display: grid;
    grid-template-columns: 25% 50% 25%;
}






/* ---------------------------------------- */
/* Resposta --------------------------------- */
.boxResposta{
    font-family: 'Roboto', sans-serif;
    background-color: rgba(255,255,255,0.95);
    padding: 40px;
    color: #000;
    line-height: 1.5;
    text-align: left;
    width: 60%;
    margin: 0 auto;
    max-width: 1000px;
    border-radius: 8px;
    box-shadow: 4px 4px 10px rgba(0,0,0,0.3);
}

.boxResposta_ok{
    display: table;
    float: right;
    margin-left: 20px;
}

.boxResposta .linhaTop{
    margin-top: 30px;
    padding-top: 30px;
    border-top: 2px solid #ddd;
}

.boxResposta .resposta_h1{
    color: #000;
    font-size: 30px;
    font-weight: bold;
    text-align: left;
}

.boxResposta .resposta_h2{
    color: #000;
    font-size: 24px;
    font-weight: bold;
    text-align: left;
}

.resposta_h3{
    color: #444;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #888;
    font-size: 16px;
    font-weight: normal;
    text-align: left;
}

.numeroPedido{
    font-size: 24px;
    font-weight: bold;
    color: #005;
}

.resposta_txt{
    margin-top: 20px;
    font-size: 14px;
    color: #444;
}

.resposta_txt a:link{
    padding: 5px;
    color: #004;
    font-weight: bold;
    font-size: 14px;
    background-color: #def;
}
.resposta_txt a:active{
    padding: 5px;
    color: #004;
    font-weight: bold;
    font-size: 14px;
    background-color: #def;
}
.resposta_txt a:visited{
    padding: 5px;
    color: #004;
    font-weight: bold;
    font-size: 14px;
    background-color: #def;
}
.resposta_txt a:hover{
    padding: 5px;
    color: #000;
    font-weight: bold;
    font-size: 14px;
    background-color: #bcd;
}

.agradecimento{
    margin-top: 10px;
    text-align: right;
    font-style: italic;
}





/* ---------------------------------------- */
/* Rodapé --------------------------------- */
footer{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    font-size: 14px;
    line-height: 28px;
    background-color: #000;
    padding: 50px 40px 60px 40px;
}
    
footer a{
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    color: #f0f0f0;
    transition-property: color;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}    
.footer a:link{
    color: #f0f0f0;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
}    
.footer a:active{
    color: #f0f0f0;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
}    
.footer a:visited{
    color: #f0f0f0;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;

}    
.footer a:hover{
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    color: #fff;
}
    

.rodape_colunas{
    display: grid;
    grid-template-columns: 33% 34% 33%;
}

.rodape_contato{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    font-size: 14px;
    display: grid;
    grid-template-columns: 55% 40%;
}
    
.rodape_contato ul a{
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    color: #f0f0f0;
    transition-property: color;
    transition-duration: 0.3s;
    transition-timing-function: ease;
    -webkit-transition-property: color;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}
.rodape_contato ul a:link{
    color: #f0f0f0;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}    
.rodape_contato ul a:active{
    color: #f0f0f0;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}    
.rodape_contato ul a:visited{
    color: #f0f0f0;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;

}    
.rodape_contato ul a:hover{
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    color: #fff;
}
    
.contato_rodape_frame{
    width: 240px;
    height: 300px;
}

.rodape_base{
    font-family: 'Roboto', sans-serif;
    background-color: #232323;
    padding: 30px 10px 20px 10px;
    color: #fff;
    font-size: 12px;
    text-align: center;
}

.frisoL{
    border-left: 1px solid #999;
}

    
    
    
    
/* ---------------------------------------- */
/* Formulário ------------------------------- */
.campo{
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
    font-size: 20px;
    padding: 16px;
    border: 1px solid #000;
    background-color: #fff;
}

.campoObsItem{
    width: 290px;
    max-width: 290px;
    font-size: 14px;
    padding: 10px;
    height: auto;
    margin-top: 5px;
    max-height: auto;
}



.campo_quantidade{
    width: 80%;
    font-family: Arial, Helvetica, sans-serif;
    color: #838282;
    font-size: 24px;
    font-weight: bold;
    padding: 8px;
    text-align: center;
    border: 1px solid #838282;
    background-color: #fff;
}

.campo_alerta{
    border: 1px solid #F00;
    background-color: #fDD;
}


.campo_buscar{
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
    font-size: 16px;
    padding: 12px 10px;
    border: 1px solid #000;
    background-color: #fff;
}

.campoOrdem{
    width: 126px;
}

.campoObs{
    width: 400px;
    font-size: 14px;
    padding: 8px;
    height: 56px;
}

.bt_form{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    text-align: center;
    font-size: 20px;
    padding: 16px;
    border: 1px solid #000;
    background-color: #000;
    min-width: 100px;
    cursor: pointer;
    transition-property: background-color color;
    transition-duration: 0.7s;
    transition-timing-function: ease;
    -webkit-transition-property: background-color color;
    -webkit-transition-duration: 0.7s;
    -webkit-transition-timing-function: ease;
}
.bt_form:hover{
    color: #fff;
    background-color: #111;
}

.bt_buscar{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    text-align: center;
    font-size: 16px;
    padding: 12px 10px;
    margin-left: 10px;
    border: 1px solid #000;
    background-color: #000;
    min-width: 100px;
    cursor: pointer;
    transition-property: background-color color;
    transition-duration: 0.7s;
    transition-timing-function: ease;
    -webkit-transition-property: background-color color;
    -webkit-transition-duration: 0.7s;
    -webkit-transition-timing-function: ease;
}
.bt_buscar:hover{
    color: #fff;
    background-color: #111;
}
 
.bt_shop{
    font-family: 'Roboto', sans-serif;
    color: #fff;
    text-align: center;
    font-size: 10px;
    padding: 6px 12px;
    border: 0px solid #000;
    background-color: #000;
    cursor: pointer;
    transition-property: background-color color;
    transition-duration: 0.7s;
    transition-timing-function: ease;
    -webkit-transition-property: background-color color;
    -webkit-transition-duration: 0.7s;
    -webkit-transition-timing-function: ease;
}
.bt_shop:hover{
    color: #fff;
    background-color: #111;
}

.bt_center{
    width: 100%;
    margin: 0 auto;
    margin-bottom: 10px;
    font-family: 'Roboto', sans-serif;
    color: #fff;
    text-align: center;
    font-size: 10px;
    padding: 6px 12px;
    border: 1px solid #000;
    background-color: #000;
    min-width: 100px;
    cursor: pointer;
    transition-property: background-color color;
    transition-duration: 0.7s;
    transition-timing-function: ease;
    -webkit-transition-property: background-color color;
    -webkit-transition-duration: 0.7s;
    -webkit-transition-timing-function: ease;
}
.bt_center:hover{
    color: #fff;
    background-color: #111;
}


.TL{
    text-align: left;
}
.TC{
    text-align: center;
}
.TR{
    text-align: right;
}

.campo_20{
	width: 20px;
}
.campo_30{
	width: 30px;
}
.campo_40{
	width: 40px;
}
.campo_50{
	width: 50px;
}
.campo_60{
	width: 60px;
}
.campo_70{
	width: 70px;
}
.campo_80{
	width: 80px;
}
.campo_90{
	width: 90px;
}
.campo_100{
	width: 100px;
}
.campo_120{
	width: 120px;
}
.campo_130{
	width: 130px;
}
.campo_140{
	width: 140px;
}
.campo_150{
	width: 150px;
}
.campo_160{
	width: 160px;
}
.campo_170{
	width: 170px;
}
.campo_180{
	width: 180px;
}
.campo_190{
	width: 190px;
}
.campo_200{
	width: 200px;
}
.campo_220{
	width: 220px;
}
.campo_240{
	width: 240px;
}
.campo_250{
	width: 250px;
}
.campo_280{
	width: 280px;
}
.campo_300{
	width: 300px;
}
.campo_350{
	width: 350px;
}
.campo_400{
	width: 400px;
}
.campo_500{
	width: 500px;
}
.campo_600{
	width: 600px;
}
.campo_700{
	width: 700px;
}
.campo_800{
	width: 800px;
}


.altura_50{
	height: 150px;
}
.altura_80{
	height: 80px;
}
.altura_100{
	height: 100px;
}
.altura_150{
	height: 150px;
}
.altura_200{
	height: 200px;
}
.altura_300{
	height: 300px;
}
.altura_400{
	height: 400px;
}

.msg_alert{
    padding: 4px;
    background-color: #fdd;
    border: 1px solid #f00;
    font-size: 14px;
    font-style: italic;
    color: #f00;
    font-family: 'Roboto', sans-serif;
    display: none;
}


    
#boxMensagem{
    font-family: 'Roboto', sans-serif;
	background-color: #008800;
	padding: 20px 0px;
	width: 100%;
	position: absolute;
	top: 100px;
	left: 0px;
	color: #ffffff;
	text-align: center;
    text-shadow: 1px 1px 1px #000;
	font-weight: bold;
	font-size: 18px;
	visibility: hidden;
    z-index: 1000;
}    



    
@media screen and (max-width: 1100px){

    
    /* ---------------------------------------- */
    /* Rodapé -------------------------------- */
    .rodape_colunas{
        display: grid;
        grid-template-columns: 100%;
    }
    
    .rodape_colunas .item{
        text-align: center;
    }

    .rodape_colunas .item img{
        margin-top: 40px;
        margin-bottom: 60px;
    }
    
    .contato_rodape_frame{
        width: 200px;
    }
    
}


    
@media screen and (max-width: 1000px){

    

    h2{
        font-size: 34px;
        line-height: 34px;
    }

    h2 span{
        font-size: 34px;
    }
    
    
    /* ---------------------------------------- */
    /* Home ----------------------------------- */
    .slogan_h1{
        font-size: 22px;
    }

    .slogan_h2{
        font-size: 24px;
    }

    .slogan_h3{
        font-size: 30px;
        line-height: 34px;
    }
    
    .div_form{
        margin: 0 auto;
        margin-top: 30px;
        width: 50%;
        min-width: 250px;
        grid-template-columns: 100%;
        grid-row-gap: 14px;
    }

    .div_form .item{
        text-align: center;
    }
    
    
    /* ---------------------------------------- */
    /* Formulário ------------------------------- */
    .campo{
        font-size: 16px;
        padding: 10px;
    }

    .bt_form{
        font-size: 16px;
        padding: 10px;
    }

    
}




@media screen and (max-width: 900px){

    .menuLoja_logoNav{
        width: 100%;
        margin: 0 auto;
        margin-top: 20px;
        padding: 0px;
        display: block;
        position: static;
        padding-top: 0px;
    }
    .menuLoja_logoNav a{
        font-size: 12px;
        display: block;
        width: 100%;
        margin: 0 auto;
        padding: 8px; 10px;
        text-align: center;
        margin-bottom: 10px;
    }
    .menuLoja_logoNav a:link{
        font-size: 12px;
    }
    .menuLoja_logoNav a:active{
        font-size: 12px;
    }
    .menuLoja_logoNav a:visited{
        font-size: 12px;
    }
    .menuLoja_logoNav a:hover{
        font-size: 12px;
    }

    .menuLoja_logo{
        margin: 0px;
        padding: 0px;
        position: static;
        width: 100%;
        display: block;
        top: 0px;
        left: 0px;
        position: inherit;
        text-align: center;
    }
    
    .menuLoja_logo img{
        width: 200px;
    }

}
    

    
@media screen and (max-width: 800px){
    
    /* ---------------------------------------- */
    /* Topo e Menu ---------------------------- */
    .topo{
        position: fixed;
    }
    
    .box_bt_menu{
        display: none;        
    }
    
    .menu_ico{
        display: block;
    }
    

    
    /* ---------------------------------------- */
    /* História ------------------------------- */
    .logoAlbini{
        width: 60%;
    }

    
    .historia{
        padding: 0px;
        padding-top: 100px;
        padding-bottom: 24px;
    }

    .historia_box{
        position: static;
        top: auto;
        left: auto;
        width: 80%;
        height: auto;
        margin: 0 auto;
    }
    
    
    /* ---------------------------------------- */
    /* Contato -------------------------------- */
    .contato{
        padding-bottom: 100px;
    }

    .contato_area{
        grid-template-columns: 100%;
    }

    .contato_area .item{
        text-align: center;
    }
    
    .contatoBoxCel{
        text-align: center;
    }

    .contatoFrame{
        margin: 0 auto;
    }
        
    /* ---------------------------------------- */
    /* Rodapé -------------------------------- */
    .rodape_contato{
        grid-template-columns: 100%;
    }
    .rodape_contato_item{
        text-align: center;
    }
    
    .rodape_contato_item ul{
        margin: 0 auto;
        padding-top: 50px;
        
    }
    
    .rodape_contato_item ul li{
        text-align: center;
    }
    
}
    
    



@media screen and (max-width: 600px){
    
    .logo{
        width: 50%;
    }

    .setaSobe img{
        width: 25px;
    }
    
    
    
    /* ---------------------------------------- */
    /* História ------------------------------- */
    .historia .textoDuplo{
        column-count: 1;
        column-gap: normal;
        -moz-column-count: 1;
        -moz-column-gap: normal;
        -webkit-column-count: 1;
        -webkit-column-gap: normal;
        -o-column-count: 1;
        -o-column-gap: normal;
    }
    

    /* ---------------------------------------- */
    /* Contato -------------------------------- */
    .contato{
        padding-bottom: 100px;
        display: none;
    }

    .contatoFrame{
        width: 80%;
    }    
    
    
    
}