@charset "UTF-8"; /* Project: Loja Base VTEX Author: e-can Version: 1.2 */ /************************************ //COMO ESCREVER E ORGANIZAR O CÓDIGO --- CLASSES --- Seguir modelo lowerCamelCase ex: nomeClassTeste --- ORDENAÇÃO DAS PROPRIEDADES --- .item { // Position position: absolute; top: 50%; // Block display: block; border: 1px solid #000; box-shadow: 1px 1px #000; border-radius: 6px; // Cores background-color: #fff; color: #000; // Text font: 14px arial, sans-serif #fff; text-align: center; } --- REGRAS IMPORTANTES --- 1. Tab com 4 espaços; 2. Propriedades em linhas separadas, espaço entre o valor da propriedade e os ":" e vírgula depois do último valor. Ex certo: body { background-color: #fff; color: #000; } Ex errado: body{background-color: #fff;color: #000} 3. Usar sempre aspas duplas Ex certo: a[href$=".com"] background-image: url("/images/image.png"); content: ""; Ex errado: a[href$=.com] background-image: url('/images/image.png'); content: ''; 4. Evitar repetição de propriedades; Ex certo: margin: 10px 0 5px; Ex errado: margin-top: 10px; margin-bottom: 5px; ************************************/ @import url("https://fonts.googleapis.com/css?family=Nanum+Pen+Script&display=swap"); html { box-sizing: border-box; } *, *::after, *::before { box-sizing: inherit; } /*reset*/ 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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, dd, dt, dl { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; list-style: none; } *, *:after, *:before { box-sizing: border-box; outline: none; } input, textarea { outline: none; } input[type="radio"] { margin: 3px 3px 3px 0; } div:after, ol:after, form:after, ul:after, dl:after, section:after { content: ""; display: block; clear: both; height: 0; overflow: hidden; } a, a:hover { cursor: pointer; text-decoration: none; } label { display: inline-block; } /*slider*/ /*float header*/ /*Básico, com clique*/ /* ========================================================================== imports base ========================================================================== */ /*buttons*/ /*forms*/ /*titles*/ /*fonts*/ @font-face { font-family: "optoculosfonticon"; src: url("/arquivos/optoculosfonticon.eot.css?8cp9xb"); src: url("/arquivos/optoculosfonticon.eot.css?8cp9xb#iefix") format("embedded-opentype"), url("/arquivos/optoculosfonticon.ttf.css?8cp9xb") format("truetype"), url("/arquivos/optoculosfonticon.woff.css?8cp9xb") format("woff"), url("/arquivos/optoculosfonticon.svg.css?8cp9xb#optoculosfonticon") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: "oculosbw"; src: url("/arquivos/oculosbw.eot.css"); src: url("/arquivos/oculosbw.eot.css#iefix") format("embedded-opentype"), url("/arquivos/oculosbw.ttf.css") format("truetype"), url("/arquivos/oculosbw.woff.css") format("woff"), url("/arquivos/oculosbw.svg.css#oculosbw") format("svg"); font-weight: normal; font-style: normal; } [class^="ico-"], [class*=" ico-"] { font-family: "optoculosfonticon" !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #4e4e4e; font-size: 20px; } [class^="icon-"], [class*=" icon-"] { font-family: "oculosbw" !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ico-arrow_thin:before { content: "\e900"; } .ico-small-view:before { content: "\e901"; } .ico-large-view:before { content: "\e902"; } .ico-amex:before { content: "\e903"; } .ico-clerk:before { content: "\e904"; } .ico-formato-aviador:before { content: "\e905"; } .ico-bag:before { content: "\e906"; } .ico-boleto:before { content: "\e907"; } .ico-box:before { content: "\e908"; } .ico-truck:before { content: "\e909"; } .ico-card:before { content: "\e90a"; } .ico-check:before, body.catalog .filterOptions fieldset label:before { content: "\e90b"; } .ico-diners:before { content: "\e90d"; } .ico-ecan:before { content: "\e90e"; } .ico-ball:before { content: "\e90f"; } .ico-elo:before { content: "\e910"; } .ico-formato-esportivo:before { content: "\e911"; } .ico-facebook:before { content: "\e912"; } .ico-medal:before { content: "\e913"; } .ico-change:before { content: "\e914"; } .ico-formato-gatinho:before { content: "\e915"; } .ico-mobile-small-view:before { content: "\e916"; } .ico-hipercard:before { content: "\e917"; } .ico-instagram:before { content: "\e918"; } .ico-trash:before { content: "\e919"; } .ico-formato-mascara:before { content: "\e91a"; } .ico-master:before { content: "\e91b"; } .ico-medalha:before { content: "\e91c"; } .ico-menu:before { content: "\e91d"; } .ico-mobile-large-view:before { content: "\e91e"; } .ico-formato-quadrado:before { content: "\e91f"; } .ico-formato-redondo:before { content: "\e920"; } .ico-formato-retangular:before { content: "\e921"; } .ico-search:before { content: "\e922"; } .ico-arrow:before, body.catalog .filterOptions fieldset h5:before, .ico-expand:before { content: "\e923"; } .ico-money-medal:before { content: "\e924"; } .ico-visa:before { content: "\e925"; } .ico-vtex:before { content: "\e932"; } .ico-close:before, body.catalog .filterOptions fieldset.active h5:before { content: "\e927"; } .ico-youtube:before { content: "\e928"; } .icon-oculos-borboleta:before { content: "\e900"; } .icon-oculos-wayfarer:before { content: "\e901"; } /* ========================================================================== imports componentes ========================================================================== */ /* ========================================================================== Footer - Skeleton ========================================================================== */ .pageFooter .topFooter h3 { float: left; display: block; margin-right: 0.7633587786%; width: 28.427480916%; float: none; display: inline-block; vertical-align: middle; } .pageFooter .topFooter h3:last-child { margin-right: 0; } .pageFooter .topFooter fieldset { float: left; display: block; margin-right: 0.7633587786%; width: 70.6106870229%; float: none; display: inline-block; vertical-align: middle; } .pageFooter .topFooter fieldset:last-child { margin-right: 0; } .pageFooter .middleFooter { background-color: #f2f2f2; } .bottomFooter { background-color: #f2f2f2; } .phone { margin-top: 1em; margin-bottom: 3em; } .pageFooter .bottomFooter .powerCol { padding-top: 10px; text-align: right; float: right; display: block; margin-right: 0.763359%; width: 24.4275%; } .bloco-redes { display: flex; justify-content: space-between; } .pageFooter .middleFooter .socialCol .paymentCol ul li { display: inline-block; vertical-align: middle; padding: 1px; font-size: 1.4375rem; line-height: normal; background-position: center; /* Center the image */ background-repeat: no-repeat; /* Do not repeat the image */ background-size: cover; } .pageFooter .middleFooter .socialCol .paymentCol ul li img { width: 58px; } @media screen and (max-width: 1024px) { .pageFooter .topFooter h3 { display: block; width: 100%; margin-left: 0; margin-right: 0; } .pageFooter .topFooter fieldset { display: block; width: 100%; margin-left: 0; margin-right: 0; } } .pageFooter .middleFooter .socialCol { float: left; display: block; margin-right: 2%; width: 20.2290076336%; margin-left: 3%; } .pageFooter .middleFooter .socialCol:last-child { margin-right: 0; } .pageFooter .middleFooter .phoneCol { float: left; display: block; margin-right: 0.7633587786%; width: 20.2290076336%; } .pageFooter .middleFooter .phoneCol:last-child { margin-right: 0; } .pageFooter .middleFooter .institutionalCol { float: left; display: block; margin-right: 2%; width: 13.229008%; } .pageFooter .middleFooter .institutionalCol:last-child { margin-right: 0; } .pageFooter .middleFooter .contactCol { float: left; display: block; margin-right: 0.7633587786%; width: 13.0305%; } .pageFooter .middleFooter .contactCol:last-child { margin-right: 0; } body.notMobile .pageFooter .middleFooter .contactCol:last-child { width: 26%; } body.notMobile .middleFooter .contactCol ul{ display: grid; grid-template-columns: 1fr 1fr; } .pageFooter .middleFooter .supportCol { float: left; display: block; margin-right: 2%; width: 14.0305%; } .pageFooter .middleFooter .supportCol:last-child { margin-right: 0; } .pageFooter-whatsapp { position: fixed; width: 60px; height: 60px; bottom: 10px; left: 40px; background: #25d366; color: #fff; border-radius: 50px; text-align: center; font-size: 40px; box-shadow: 1px 1px 2px #888; z-index: 1000; } @media screen and (max-width: 1024px) { .pageFooter .middleFooter .socialCol { width: 100%; margin-left: 0; margin-right: 0; float: none; } .pageFooter .middleFooter .phoneCol { float: left; display: block; margin-right: 1.1494252874%; width: 24.1379310345%; } .pageFooter .middleFooter .phoneCol:last-child { margin-right: 0; } .pageFooter .middleFooter .institutionalCol { float: left; display: block; margin-right: 2%; width: 24.1379310345%; } .pageFooter .middleFooter .institutionalCol:last-child { margin-right: 0; } .pageFooter .middleFooter .contactCol { float: left; display: block; margin-right: 1.1494252874%; width: 24.1379310345%; } .pageFooter .middleFooter .contactCol:last-child { margin-right: 0; } .pageFooter .middleFooter .supportCol { float: left; display: block; margin-right: 1.76336%; width: 22.137931%; } .pageFooter .middleFooter .supportCol:last-child { margin-right: 0; } } @media screen and (max-width: 720px) { .pageFooter .middleFooter .footerLinks>div { width: 100%; margin-right: 0; margin-left: 0; float: none; clear: both; text-align: center; } } .pageFooter .bottomFooter .paymentCol { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; margin-left: 8.3969465649%; } .pageFooter .bottomFooter .paymentCol:last-child { margin-right: 0; } .pageFooter .bottomFooter .safeCol { float: left; display: block; margin-right: 0.7633587786%; width: 24.427480916%; } .pageFooter .bottomFooter .safeCol:last-child { margin-right: 0; } .pageFooter .bottomFooter .powerCol { float: right; display: block; margin-right: 0.7633587786%; width: 24.427480916%; } .pageFooter .bottomFooter .powerCol:last-child { margin-right: 0; } @media screen and (max-width: 1024px) { .pageFooter .bottomFooter .paymentCol { float: left; display: block; margin-right: 1.1494252874%; width: 36.7816091954%; margin-left: 6.3218390805%; } .pageFooter .bottomFooter .paymentCol:last-child { margin-right: 0; } .pageFooter .bottomFooter .safeCol { float: left; display: block; margin-right: 1.1494252874%; width: 30.4597701149%; margin-left: 12.6436781609%; margin-right: 0; } .pageFooter .bottomFooter .safeCol:last-child { margin-right: 0; } .pageFooter .bottomFooter .powerCol { width: 100%; margin-left: 0; margin-right: 0; float: none; clear: both; } } @media screen and (max-width: 720px) { .pageFooter .bottomFooter .footerItem { width: 100%; margin-right: 0; margin-left: 0; float: none; clear: both; text-align: center; } } /* ========================================================================== Footer ========================================================================== */ .pageFooter { background: #fff; margin-top: 120px; } .img-responsive { max-width: 65px; } .pageFooter .middleFooter .socialCol ul li { display: inline-block; vertical-align: middle; padding: 0 150px; font-size: 1.4375rem; line-height: normal; } @media screen and (max-width: 720px) { .pageFooter { margin-top: 40px; } } .pageFooter .topFooter { background: rgb(149, 96, 164); padding: 15px 0px; } .pageFooter .topFooter h3 { color: #fff; font-size: 18px; font-weight: 600; text-transform: uppercase; text-align: center; line-height: 22px; } .pageFooter .topFooter fieldset .campos { display: table; width: 100%; /* Firefox 18- */ /* Firefox 18- */ /* Firefox 19+ */ /* Firefox 19+ */ } .pageFooter .topFooter fieldset .campos>div { display: table-cell; vertical-align: middle; } .pageFooter .topFooter fieldset .campos .inputName { width: 30%; padding-right: 10px; } .pageFooter .topFooter fieldset .campos .inputEmail { width: 30%; padding: 0 10px; } .pageFooter .topFooter fieldset .campos .inputGender { width: 40%; padding: 0 3px; line-height: 1.8; } .pageFooter .topFooter fieldset .campos .inputButton { width: 25%; padding-left: 10px; } .pageFooter .topFooter fieldset .campos input[type="text"] { display: block; width: 80%; height: 38px; padding: 0px 0px; padding-left: 8px; border: 0; background: #fff; color: #3c3c3b; font-size: 0.8125rem; font-family: "Montserrat", sans-serif; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; border: solid 1px rgb(67, 198, 204); } .pageFooter .topFooter fieldset .campos input[type="text"]:active, .pageFooter .topFooter fieldset .campos input[type="text"]:focus { color: #43c6cc; } .pageFooter .topFooter fieldset .campos input[type="radio"] { display: inline-block; vertical-align: middle; width: 15px; height: 15px; margin: 0 5px 0 0; top: -1px; border: 0; background: #fff; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; border: solid 1px rgb(67, 198, 204); } .pageFooter .topFooter fieldset .campos input[type="radio"]:checked { background: #3c3c3b; -moz-box-shadow: inset 0 0 0 4px #fff; -webkit-box-shadow: inset 0 0 0 4px #fff; box-shadow: inset 0 0 0 4px #fff; } .pageFooter .topFooter fieldset .campos input[type="radio"]+label { display: inline-block; vertical-align: middle; margin-bottom: 0; color: #3c3c3b; font-size: 0.8125rem; font-family: "Montserrat", sans-serif; font-weight: bold; line-height: normal; text-transform: uppercase; cursor: pointer; margin-right: 4px; } .pageFooter .topFooter fieldset .campos input[type="text"]::-webkit-input-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="password"]::-webkit-input-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="text"]:-moz-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="password"]:-moz-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="text"]::-moz-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="password"]::-moz-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="text"]:-ms-input-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset .campos input[type="password"]:-ms-input-placeholder { color: #989898; font-weight: 300; } .pageFooter .topFooter fieldset #ButtonOK-News { background: rgb(67, 198, 204) !important; width: 100%; padding: 11px 10px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; } .pageFooter .topFooter fieldset #ButtonOK-News:hover { background: rgba(154, 91, 179, 0.8); } .pageFooter .topFooter fieldset .erro { display: none; text-align: center; color: #fff; } .pageFooter .topFooter fieldset .erro a { background: #9a5bb3; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; max-width: 300px; display: block; margin: 10px auto; } .pageFooter .topFooter fieldset .erro a:hover { background: rgba(154, 91, 179, 0.8); } .pageFooter .topFooter fieldset .success { color: #fff; font-size: 0.8125rem; text-align: center; } .pageFooter .topFooter fieldset .success strong { font-size: 0.9375rem; display: block; font-weight: 600; } @media screen and (max-width: 1024px) { .pageFooter .topFooter h3 { margin-bottom: 15px; font-size: 20px; } .pageFooter .topFooter h3 span { font-size: 0.9375rem; } .pageFooter .topFooter fieldset .campos { display: block; } .pageFooter .topFooter fieldset .campos .inputName { float: left; display: block; margin-right: 1.1494252874%; width: 36.7816091954%; margin-left: 12.6436781609%; margin-right: 0; margin-bottom: 15px; } .pageFooter .topFooter fieldset .campos .inputName:last-child { margin-right: 0; } .pageFooter .topFooter fieldset .campos .inputEmail { float: left; display: block; margin-right: 1.1494252874%; width: 36.7816091954%; margin-right: 0; margin-bottom: 15px; padding-right: 0; } .pageFooter .topFooter fieldset .campos .inputEmail:last-child { margin-right: 0; } .pageFooter .topFooter fieldset .campos .inputGender { display: block; width: 100%; margin-bottom: 15px; clear: both; text-align: center; } .pageFooter .topFooter fieldset .campos .inputGender br { display: none; } .pageFooter .topFooter fieldset .campos .inputGender input[type="radio"]:not(:first-child) { margin-left: 20px; } .pageFooter .topFooter fieldset .campos .inputButton { display: block; width: 100%; text-align: center; } .pageFooter .topFooter fieldset .campos .inputButton #ButtonOK-News { max-width: 230px; } } @media screen and (max-width: 720px) { .pageFooter .topFooter { padding: 15px 0; } .pageFooter .topFooter fieldset .campos .inputName { width: 100%; padding-right: 0; margin-left: 0; margin-right: 0; float: none; } .pageFooter .topFooter fieldset .campos .inputEmail { width: 100%; padding-left: 0; margin-left: 0; float: none; } .pageFooter .topFooter fieldset .campos .inputButton #ButtonOK-News { max-width: 320px; } } .pageFooter .middleFooter { background: #f2f2f2; padding: 45px 0; color: #43c6cc; } @media screen and (max-width: 720px) { .pageFooter .middleFooter { padding: 20px 0; } } .pageFooter .middleFooter a { color: #fff; } .pageFooter .middleFooter a:hover { text-decoration: none; } .pageFooter .middleFooter .socialCol {} .pageFooter .middleFooter .socialCol .hideDesk { display: none; } .pageFooter .middleFooter .socialCol ul { margin: 35px 0 0; padding: 0; } .pageFooter .middleFooter .socialCol ul li { display: inline-block; vertical-align: middle; padding: 0 150px; font-size: 1.4375rem; line-height: normal; } @media screen and (max-width: 1024px) { .pageFooter .middleFooter .socialCol { text-align: center; margin-bottom: 45px; } .pageFooter .middleFooter .socialCol .hideDesk { display: inline-block; } .pageFooter .middleFooter .socialCol .hideMobile { display: none; } .pageFooter .middleFooter .socialCol img { vertical-align: middle; } .pageFooter .middleFooter .socialCol ul { display: inline-block; vertical-align: middle; margin-top: 0; margin-left: 30px; } } @media screen and (max-width: 720px) { .pageFooter .middleFooter .socialCol { margin-bottom: 20px; } .pageFooter .middleFooter .socialCol ul { margin-left: 20px; } .pageFooter .middleFooter .socialCol ul li { padding: 0 10px; } } .pageFooter .middleFooter .phoneCol .itemContent p { color: #fff; font-size: 1.4375rem; font-weight: 900; text-transform: uppercase; /* line-height: 1.5; */ } .pageFooter .middleFooter .phoneCol .itemContent .optatende a { font-size: 0.8rem; font-weight: 300; text-transform: none; color: #fff; text-decoration: underline; } .pageFooter .middleFooter .phoneCol .itemContent .optatende a:hover { color: #3cb6f7; } .pageFooter .middleFooter .phoneCol .itemContent p em { font-size: 20px; text-transform: none; font-weight: 600; color: #4f4f4f; } .pageFooter .middleFooter .phoneCol .itemContent span { display: block; font-size: 0.8rem; font-weight: 300; text-transform: none; line-height: 0.5rem; margin: 0 0 20px 0; } .pageFooter .middleFooter .phoneCol .itemContent a { display: block; padding: 0px 0px 10px; color: #43c6cc; font-size: 25px; text-align: left; line-height: 1; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .pageFooter .middleFooter .phoneCol .itemContent a:hover { /* padding-left: 0; border: 1px solid #3cb6f7; */ color: #3cb6f7; } @media screen and (max-width: 1024px) { .pageFooter .middleFooter .phoneCol .itemContent p { font-size: 1.125rem; } .pageFooter .middleFooter .phoneCol .itemContent a { max-width: 150px; } } @media screen and (max-width: 720px) { .pageFooter .middleFooter .phoneCol { text-align: center; } .pageFooter .middleFooter .phoneCol h3 { margin-bottom: 0px; text-align: center; } .pageFooter .middleFooter .phoneCol .itemContent a { margin: 10px auto; max-width: 100%; text-align: center; } } .pageFooter .middleFooter .itemContent li { margin-bottom: 5px; line-height: normal; } .pageFooter .middleFooter .itemContent a { display: block; padding: 3px 0; font-size: 0.75rem; color: #4f4f4f; -webkit-transition: all 0.18s ease; /* Safari */ transition: all 0.18s ease; } .pageFooter .middleFooter .itemContent a:hover { padding-left: 3px; } .pageFooter .bottomFooter { padding: 35px 0; margin-top: -1em; } .pageFooter .bottomFooter h3 { color: #989898; } .pageFooter .bottomFooter li { display: inline-block; vertical-align: middle; margin-bottom: 20px; } .pageFooter .bottomFooter li.ebit #seloEbit { width: 70px; } .pageFooter .bottomFooter li.ebit #seloEbit img { width: 70px; } .pageFooter .bottomFooter li:not(:last-child) { margin-right: 20px; } .pageFooter .bottomFooter .paymentCol { color: #989898; } .pageFooter .bottomFooter .paymentCol .ico-master { font-size: 1.5rem; } .pageFooter .bottomFooter .paymentCol .ico-visa { font-size: 0.875rem; } .pageFooter .bottomFooter .paymentCol .ico-amex { font-size: 0.625rem; } .pageFooter .bottomFooter .paymentCol .ico-diners { font-size: 1.6875rem; } .pageFooter .bottomFooter .paymentCol .ico-hipercard { font-size: 1.375rem; } .pageFooter .bottomFooter .paymentCol .ico-elo { font-size: 1.6875rem; } .pageFooter .bottomFooter .paymentCol .ico-boleto { font-size: 1.125rem; } .pageFooter .bottomFooter .powerCol { padding-top: 10px; text-align: right; } .pageFooter .bottomFooter .powerCol li { margin-bottom: 0; display: inline-block; } .pageFooter .bottomFooter .powerCol li img { width: 100%; } .pageFooter .bottomFooter .powerCol li a { font-size: 0; color: #989898; } .pageFooter .bottomFooter .powerCol li a i { font-size: 1.5rem; } .pageFooter .bottomFooter .powerCol li a i.ico-vtex { font-size: 2.125rem; } @media screen and (max-width: 1024px) { .pageFooter .bottomFooter { padding-bottom: 10px; } .pageFooter .bottomFooter .footerItem h3 { margin: 0 0 20px 0; } .pageFooter .bottomFooter .paymentCol ul { text-align: center; } .pageFooter .bottomFooter .powerCol { text-align: center; } .pageFooter .bottomFooter .powerCol:last-child { padding-top: 10px; } } .pageFooter .addressRow { padding: 20px 0; color: #989898; font-size: 0.625rem; text-align: center; text-transform: uppercase; } .pageFooter .addressRow span, .pageFooter .addressRow address { display: inline-block; vertical-align: middle; } @media screen and (max-width: 1024px) { .pageFooter .addressRow { padding-top: 0; width: 70%; margin: 0 auto; } } @media screen and (max-width: 720px) { .pageFooter .addressRow { width: 100%; } } .pageFooter .footerItem h3 { position: relative; margin: 0 0 15px 0; font-size: 0.8125rem; font-weight: 900; text-transform: uppercase; line-height: normal; } .pageFooter .footerItem h3 i { display: none; position: absolute; top: 5px; right: 0; color: #989898; font-size: 0.375rem; -webkit-transform: rotate(90deg) scale(1); -moz-transform: rotate(90deg) scale(1); -ms-transform: rotate(90deg) scale(1); -o-transform: rotate(90deg) scale(1); transform: rotate(90deg) scale(1); } .pageFooter .itemContent-selo img { margin-right: 10px; } @media screen and (max-width: 720px) { .pageFooter .footerItem h3 { margin: 15px 0 20px 0; cursor: pointer; } .pageFooter .footerItem h3 i { display: block; } .pageFooter .footerItem h3.active i { -webkit-transform: rotate(90deg) scale(-1); -moz-transform: rotate(90deg) scale(-1); -ms-transform: rotate(90deg) scale(-1); -o-transform: rotate(90deg) scale(-1); transform: rotate(90deg) scale(-1); } .pageFooter .footerItem.toggle .itemContent { display: none; height: 0; } .pageFooter .footerItem.toggle .itemContent.active { display: none; height: auto; } } .pageFooter .itemContent ul { margin: 0; padding: 0; } .pageFooter .itemContent li { margin: 0; line-height: normal; } /* ========================================================================== Footer Toggle ========================================================================== */ body.notMobile .middleFooter .itemContent { display: block !important; width: 100%; } body.notMobile .middleFooter .itemContent ul { margin: 0 !important; } /* ========================================================================== Header - Skeleton ========================================================================== */ .pageHeader .menu-mobile-toggle { display: none; vertical-align: middle; } .pageHeader .logo { float: left; display: block; margin-right: 0.7633587786%; width: 11.2290076336%; float: none; display: inline-block; vertical-align: middle; } .pageHeader .logo:last-child { margin-right: 0; } .pageHeader .navigation { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; float: none; display: inline-block; vertical-align: middle; } .pageHeader .navigation:last-child { margin-right: 0; } .pageHeader .toggleButtons { float: left; display: block; margin-right: 0.7633587786%; width: 29.6259541985%; float: none; display: inline-block; vertical-align: middle; } .pageHeader .toggleButtons:last-child { margin-right: 0; } @media screen and (max-width: 1280px) { .pageHeader .logo { float: left; display: block; margin-right: 0.7633587786%; width: 11.427481%; float: none; display: inline-block; } .pageHeader .logo:last-child { margin-right: 0; } .pageHeader .navigation { float: left; display: block; margin-right: 0.7633587786%; width: 53.8167938931%; float: none; display: inline-block; } .pageHeader .navigation:last-child { margin-right: 0; } .pageHeader .toggleButtons { float: left; display: block; margin-right: 0.7633587786%; width: 27.2290076336%; float: none; display: inline-block; } .pageHeader .toggleButtons:last-child { margin-right: 0; } } @media screen and (max-width: 1024px) { .pageHeader .menu-mobile-toggle { float: left; display: block; margin-right: 1.1494252874%; width: 30.4597701149%; float: none; display: inline-block; } .pageHeader .menu-mobile-toggle:last-child { margin-right: 0; } .pageHeader .logo { float: left; display: block; margin-right: 1.1494252874%; width: 36.7816091954%; float: none; display: inline-block; } .pageHeader .logo:last-child { margin-right: 0; } .pageHeader .toggleButtons { float: left; display: block; margin-right: 1.1494252874%; width: 30.4597701149%; float: none; display: inline-block; } .pageHeader .toggleButtons:last-child { margin-right: 0; } } @media screen and (max-width: 720px) { .pageHeader .menu-mobile-toggle { width: 25px; margin-right: 10px; } .pageHeader .logo { width: 120px; margin-right: 10px; } .pageHeader .toggleButtons { width: calc(100% - 165px); } } /* ========================================================================== Header - Custom ========================================================================== */ .pageHeader { position: relative; background: #fff; width: 100%; -moz-box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.1); box-shadow: 0 5px 20px -3px rgba(0, 0, 0, 0.1); } .pageHeader .menu-mobile-toggle { font-size: 15px; cursor: pointer; } .pageHeader .logo a { display: block; line-height: 0; } .pageHeader .logo a img { width: 100%; height: auto; max-width: 185px; } .pageHeader .toggleButtons { text-align: right; } .pageHeader .toggleButtons .userLinks { margin-bottom: 15px; } .pageHeader .toggleButtons .userLinks ul { padding: 0; margin: 0; display: inline-block; } .pageHeader .toggleButtons .userLinks li { display: inline-block; vertical-align: middle; line-height: 1; padding: 0 15px; text-align: left; } .pageHeader .toggleButtons .userLinks li:last-child { padding-right: 0; max-width: 160px; } .pageHeader .toggleButtons .userLinks li span { display: block; color: #989898; font-size: 0.75rem; line-height: 1.4; text-overflow: ellipsis; /* will make [...] at the end */ white-space: nowrap; /* paragraph to one line */ overflow: hidden; /* older browsers */ } .pageHeader .toggleButtons .userLinks li span+a { display: block; margin-top: 3px; font-size: 0.5625rem; text-decoration: underline; } .pageHeader .toggleButtons .userLinks li a { font-size: 0.75rem; color: #989898; text-transform: uppercase; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } .pageHeader .toggleButtons .userLinks li a:hover { color: #43c6cc; } .pageHeader .toggleButtons .userLinks li:active a { color: #43c6cc; } .pageHeader .toggleButtons .userLinks li:active .hideContent { -webkit-transform: translate(0%, 15px); -moz-transform: translate(0%, 15px); -ms-transform: translate(0%, 15px); -o-transform: translate(0%, 15px); transform: translate(0%, 15px); } .pageHeader .toggleButtons .userLinks li .hideContent { width: 170px; padding: 20px; right: 0; background: #fff; text-align: left; } .pageHeader .toggleButtons .userLinks li .hideContent a { display: block; padding: 5px 0; color: #989898; font-size: 0.625rem; -webkit-transition: all 0.18s ease-out; /* Safari */ transition: all 0.18s ease-out; } .pageHeader .toggleButtons .userLinks li .hideContent a:hover { color: #3c3c3b; padding-left: 3px; } .pageHeader .toggleButtons .userLinks li .hideContent .welcomeMsg a { color: #43c6cc; } .pageHeader .toggleButtons .toggleSearch { display: inline-block; padding-bottom: 7px; margin-right: 40px; line-height: 0; } .pageHeader .toggleButtons .toggleSearch span { display: none; } .pageHeader .toggleButtons .toggleSearch i { color: #3c3c3b; font-size: 1.6875rem; cursor: pointer; } .pageHeader .toggleButtons .toggleSearch .ico-close, .pageHeader .toggleButtons .toggleSearch body.catalog .filterOptions fieldset.active h5, body.catalog .filterOptions fieldset.active .pageHeader .toggleButtons .toggleSearch h5 { display: none; } .pageHeader .toggleButtons .toggleSearch.active i { color: #43c6cc; } @media screen and (max-width: 1024px) { .pageHeader .toggleButtons .toggleSearch.active .ico-search { display: none; } .pageHeader .toggleButtons .toggleSearch.active .ico-close, .pageHeader .toggleButtons .toggleSearch.active body.catalog .filterOptions fieldset.active h5, body.catalog .filterOptions fieldset.active .pageHeader .toggleButtons .toggleSearch.active h5 { display: block; } } .pageHeader .toggleButtons .header-cart { display: inline-block; vertical-align: bottom; } @media screen and (max-width: 1024px) { .pageHeader .logo { padding: 15px 0; text-align: center; } .pageHeader .logo a img { max-width: 150px; } .pageHeader .toggleButtons .userLinks { display: none; } } @media screen and (max-width: 720px) { .pageHeader .logo a img { max-width: 110px; } .pageHeader .toggleButtons .toggleSearch { margin-right: 20px; } .pageHeader .toggleButtons .toggleSearch i { font-size: 26px; } } .modalSearch { display: none; } .modalSearch .searchOverlay { position: fixed; left: 0; width: 100%; height: 100%; background: rgba(60, 60, 59, 0.5); z-index: 98; } .modalSearch .modalSearchBody { position: fixed; left: 0; width: 100%; padding: 35px 0 20px; background: white; z-index: 99; -moz-box-shadow: inset 0 5px 20px -3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 5px 20px -3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 5px 20px -3px rgba(0, 0, 0, 0.1); } .modalSearch .modalSearchBody .closeModal { display: block; margin-bottom: 20px; color: #3c3c3b; font-size: 0.625rem; text-align: right; text-transform: uppercase; cursor: pointer; padding-right: 80px; } .modalSearch .modalSearchBody .closeModal i { display: inline-block; vertical-align: middle; margin-right: 5px; font-size: 0.75rem; } .modalSearch .modalSearchBody .searchBox legend, .modalSearch .modalSearchBody .searchBox label, .modalSearch .modalSearchBody .searchBox select { display: none; } .modalSearch .modalSearchBody .searchBox fieldset { position: relative; width: 100%; max-width: 1035px; margin: auto; } .modalSearch .modalSearchBody .searchBox fieldset .fulltext-search-box { width: 100%; padding: 25px 0; border: 0; border-bottom: 1px solid #c8c8c8; color: #c8c8c8; font-family: "Montserrat", sans-serif; font-size: 1.875rem; font-weight: 300; text-align: center; letter-spacing: 2px; text-transform: uppercase; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .modalSearch .modalSearchBody .searchBox fieldset .fulltext-search-box:focus { color: #3c3c3b; } .modalSearch .modalSearchBody .searchBox fieldset .btn-buscar { display: none; position: absolute; top: 25px; right: 0; width: 20px; height: 20px; border: 0; font-size: 0; background-color: transparent; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } @media screen and (max-width: 1024px) { .modalSearch .modalSearchBody .closeModal { display: none; } .modalSearch .modalSearchBody .searchBox fieldset:before { display: block; } .modalSearch .modalSearchBody .searchBox fieldset:after { display: none; } .modalSearch .modalSearchBody .searchBox fieldset .fulltext-search-box { padding: 10px; margin: 0; font-size: 1.375rem; } .modalSearch .modalSearchBody .searchBox fieldset .btn-buscar { display: block; } .modalSearch .modalSearchBody .searchBox .ui-autocomplete .searchTerm { display: none; } } @media screen and (max-width: 720px) { .modalSearch .modalSearchBody .searchBox fieldset .fulltext-search-box { font-size: 0.625rem; } } .modalSearch .ui-autocomplete { position: relative; padding-top: 20px; top: 0 !important; left: 0 !important; width: 100% !important; font-family: "Montserrat", sans-serif; max-height: 600px; } .modalSearch .ui-autocomplete>.ui-menu-item { position: relative; width: 100%; max-width: 1024px; margin: auto; } .modalSearch .ui-autocomplete>.ui-menu-item a { display: block; padding: 10px 0; color: #989898; font-size: 0.75rem; font-weight: 700; letter-spacing: 2px; } .modalSearch .ui-autocomplete .searchTerm { background: transparent; width: 100%; padding: 15px 5px; border: 0; color: #9a5bb3; border: 1px solid #9a5bb3; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; width: 35%; margin: 0 auto; display: block; } .modalSearch .ui-autocomplete .searchTerm:hover { background: rgba(154, 91, 179, 0.8); color: white; } .modalSearch .ui-autocomplete .product-found { float: left; display: block; margin-right: 0.7633587786%; width: 66.4122137405%; margin-left: 16.7938931298%; float: none; } .modalSearch .ui-autocomplete .product-found:last-child { margin-right: 0; } .modalSearch .ui-autocomplete .product-found li { float: left; display: block; margin-right: 0.7633587786%; width: 24.427480916%; padding: 20px 10px; } .modalSearch .ui-autocomplete .product-found li:last-child { margin-right: 0; } .modalSearch .ui-autocomplete .product-found li:nth-child(4) { margin-right: 0; } .modalSearch .ui-autocomplete .product-found li:nth-child(n+5) { display: none; } .modalSearch .ui-autocomplete .product-found li a { text-align: center; display: block; } .modalSearch .ui-autocomplete .product-found li a img { width: 100%; height: auto; } .modalSearch .ui-autocomplete .product-found li a span { display: block; width: 100%; height: 32px; margin-top: 20px; color: #989898; font-family: "Montserrat", sans-serif; font-size: 0.75rem; font-weight: 700; letter-spacing: 2px; overflow: hidden; /* older browsers */ } @media screen and (max-width: 1024px) { .modalSearch .ui-autocomplete .product-found { width: 100%; margin: 0 auto !important; overflow: auto; } .modalSearch .ui-autocomplete .product-found li { width: 100%; padding: 5px 0px; margin-right: 0; } .modalSearch .ui-autocomplete .product-found li:nth-child(n+6) { display: block; } .modalSearch .ui-autocomplete .product-found li a { display: table; width: 100%; text-align: left; } .modalSearch .ui-autocomplete .product-found li a img { display: table-cell; width: 60px; } .modalSearch .ui-autocomplete .product-found li a span { display: table-cell; vertical-align: middle; width: 100%; padding-left: 10px; height: auto; } } @media screen and (max-width: 720px) { .modalSearch .ui-autocomplete .product-found { max-width: 630px; max-height: 400px; } } .navigation .navOverlay { display: none; position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); z-index: 900; top: 145px; left: 0; } @media screen and (max-width: 1024px) { .navigation { position: inherit; width: 0 !important; margin-right: 0 !important; } .navigation .navOverlay { top: 0; } } .pageNav .navHead { display: none; position: relative; padding: 20px 0; } .pageNav .navHead i.ico-close { position: absolute; right: 15px; font-size: 0.6875rem; cursor: pointer; } .pageNav .navHead .welcomeMsg { font-size: 0.75rem; color: #9a5bb3; padding: 0 20px; } .pageNav .navHead .welcomeMsg a { color: #9a5bb3; display: block; } .pageNav .navHead .welcomeMsg.userLogged a { text-decoration: underline; margin-top: 10px; font-size: 12px; } .pageNav .navHead .accountMobileNav { display: none; } .pageNav .navHead .accountMobileNav.userLogged { display: block; margin-top: 20px; } .pageNav .navHead .accountMobileNav.userLogged .content { display: flex; flex-direction: column; width: 100%; } .pageNav .navHead .accountMobileNav.userLogged .content a { font-size: 11px; text-transform: uppercase; padding: 20px; background-color: #f8f8f8; color: #989898; } .pageNav .navHead .accountMobileNav.userLogged .content a:first-child { padding-bottom: 0; } .pageNav .menu-departamento { margin: auto; width: 100%; display: table; } .pageNav .menu-departamento>h3 { display: none; margin: 0; font-size: 0.75rem; vertical-align: middle; line-height: normal; } .pageNav .menu-departamento>h3 a { display: block; padding: 55px 10px 40px 10px; color: #3c3c3b; text-align: center; text-transform: uppercase; font-weight: bold; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } .pageNav .menu-departamento>h3 a:hover { color: #43c6cc; text-decoration: none; } .pageNav .menu-departamento>h3 i { display: none; } .pageNav .menu-departamento .submenu { display: none; position: absolute; width: 100%; min-height: 270px; top: 92%; left: 0; background: #fff; padding: 45px 0; -moz-box-shadow: inset 0 5px 20px -3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 5px 20px -3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 5px 20px -3px rgba(0, 0, 0, 0.1); z-index: 999; } .pageNav .menu-departamento .submenu#lentes-de-contato { max-width: 232px; left: 47%; border-radius: 0 0px 5px 5px; min-height: auto; padding: 20px 10px; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories { float: left; display: block; margin-right: 0.7633587786%; width: 41.2213740458%; float: none; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories:last-child { margin-right: 0; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul { display: block; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul li { display: block; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul a { display: block; text-align: left; color: #3c3c3b; font-size: 0.875rem; text-transform: capitalize; margin: 10px 0; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul a:hover { color: #43c6cc; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul a span { display: block; } @media screen and (max-width: 1024px) { .pageNav .menu-departamento .submenu#lentes-de-contato { position: relative; min-height: 0; top: 0; background: #43c6cc; padding: 25px 20px 20px 35px; left: 0; max-width: 100%; border-radius: none; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories { width: 100%; display: block; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul { display: block; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul li { display: block; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul li:not(:last-child) { margin-bottom: 20px; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul li img { display: none; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul a { text-align: left; color: #fff; font-size: 0.625rem; text-transform: uppercase; margin: 0; } .pageNav .menu-departamento .submenu#lentes-de-contato .categories ul a:hover { color: #fff; } } .pageNav .menu-departamento .submenu .submenuWrap a { -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } .pageNav .menu-departamento .submenu .submenuWrap a:hover { text-decoration: none; } .pageNav .menu-departamento .submenu .submenuWrap .categories { float: left; display: block; margin-right: 0.7633587786%; width: 35.2214%; float: none; display: inline-block; vertical-align: middle; } .pageNav .menu-departamento .submenu .submenuWrap .categories:last-child { margin-right: 0; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul { padding: 0; margin: 0px; width: 100%; display: table; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul li { display: table-cell; vertical-align: middle; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul a { display: block; text-align: center; color: #989898; font-size: 0.8125rem; text-transform: uppercase; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul a:hover { color: #43c6cc; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul a span { display: block; } .pageNav .menu-departamento .submenu .submenuWrap .filters { float: left; display: block; margin-right: 0.7633587786%; width: 64.0153%; margin-left: -4px; float: none; display: inline-block; vertical-align: middle; } .pageNav .menu-departamento .submenu .submenuWrap .filters:last-child { margin-right: 0; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format, .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand { display: block; padding: 20px 0; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format ul, .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand ul { padding: 0; margin: 0px; width: 100%; display: table; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand ul{ margin: 0px 0px 10px; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand ul + ul{ margin: 10px 0px 0px; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format ul li, .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand ul li { display: table-cell; vertical-align: middle; } @media screen and (min-width: 1280px) { .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand { padding-bottom: 0; } } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format a { display: block; color: #989898; text-align: center; text-transform: uppercase; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format a:hover { color: #43c6cc; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format a i { font-size: 1.25rem; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-format a span { display: block; margin: 8px 0; font-size: 0.625rem; } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand a { display: block; text-align: center; opacity: 0.3; -moz-opacity: 0.3; filter: alpha(opacity=30); } .pageNav .menu-departamento .submenu .submenuWrap .filters .filter-brand a:hover { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } @media screen and (max-width: 1024px) { .pageNav { position: fixed; background: white; width: 310px; top: 0; left: -320px; height: 100vh; overflow-y: auto; margin: 0; z-index: 999; -webkit-transition: all 0.5s ease-in-out; /* Safari */ transition: all 0.5s ease-in-out; -moz-box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.15); box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.15); } .pageNav.open { left: 0; } .pageNav .navHead { display: block; } .pageNav .menu-departamento { display: block; padding-bottom: 70px; } .pageNav .menu-departamento>h3 { position: relative; display: block !important; width: 100%; font-size: 0.625rem; text-align: left; } .pageNav .menu-departamento>h3 a { display: block; padding: 15px 20px; text-align: left; } .pageNav .menu-departamento>h3 a:hover { color: #3c3c3b; } .pageNav .menu-departamento>h3 i { display: block; position: absolute; top: 20px; right: 0; font-size: 0.375rem; -webkit-transition: all 0.1s ease-in-out; /* Safari */ transition: all 0.1s ease-in-out; -webkit-transform: rotate(90deg) scale(1); -moz-transform: rotate(90deg) scale(1); -ms-transform: rotate(90deg) scale(1); -o-transform: rotate(90deg) scale(1); transform: rotate(90deg) scale(1); } .pageNav .menu-departamento>h3 i:before { padding: 20px 15px; } .pageNav .menu-departamento>h3 i.active { color: #43c6cc; -webkit-transform: rotate(90deg) scale(-1); -moz-transform: rotate(90deg) scale(-1); -ms-transform: rotate(90deg) scale(-1); -o-transform: rotate(90deg) scale(-1); transform: rotate(90deg) scale(-1); } .pageNav .menu-departamento .submenu { position: relative; min-height: 0; top: 0; background: #43c6cc; padding: 25px 20px 20px 35px; } .pageNav .menu-departamento .submenu .submenuWrap { padding-left: 0 !important; padding-right: 0 !important; } .pageNav .menu-departamento .submenu .submenuWrap .categories { width: 100%; display: block; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul { display: block; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul li { display: block; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul li:not(:last-child) { margin-bottom: 20px; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul li img { display: none; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul a { text-align: left; color: #fff; font-size: 0.625rem; } .pageNav .menu-departamento .submenu .submenuWrap .categories ul a:hover { color: #fff; } .pageNav .menu-departamento .submenu .submenuWrap .filters { display: none !important; } } /* Float Header ========================================================================== */ body.floatElement { padding-top: 110px; } body.floatElement .pageHeader { top: -110px; width: 100%; position: fixed; left: 0; -webkit-transition: all 0.4s ease-out; /* Safari */ transition: all 0.4s ease-out; z-index: 90; } body.floatElement .pageHeader.floatHeader { top: 0; z-index: 3; } @media screen and (max-width: 1024px) { body, body.floatElement { padding-top: 95px; } body .pageHeader, body.floatElement .pageHeader { top: 0px; width: 100%; position: fixed; left: 0; -webkit-transition: all 0.4s ease-out; /* Safari */ transition: all 0.4s ease-out; z-index: 90; } body .pageHeader .logo a, body.floatElement .pageHeader .logo a { text-align: center; } body .pageHeader .logo img, body.floatElement .pageHeader .logo img { max-width: 193px; } } @media screen and (max-width: 720px) { body, body.floatElement { padding-top: 70px; } } .header-cart .hidden { display: none; } .header-cart .openCart { position: relative; display: block; color: #3c3c3b; font-size: 1.75rem; line-height: normal; } .header-cart .openCart:hover, .header-cart .openCart:active { text-decoration: none; } .header-cart .openCart i { float: left; } .header-cart .openCart span { display: block; float: right; background: #43c6cc; margin-left: -8px; margin-top: 3px; width: 22px; height: 22px; color: #fff; font-size: 11px; line-height: 22px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } @media screen and (max-width: 720px) { .header-cart .openCart { font-size: 22px; } .header-cart .openCart span { width: 18px; height: 18px; font-size: 9px; line-height: 18px; } } .sta-cart-overlay, .sta-cart-comfirm-overlay { display: none; width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: 9999; background: rgba(0, 0, 0, 0.5); } .sta-cart-container { position: fixed; width: 430px; height: 100%; top: 0; right: -515px; background: white; z-index: 9999999999; } @media screen and (max-width: 1024px) { .sta-cart-container { width: 350px; } } @media screen and (max-width: 720px) { .sta-cart-container { width: 100%; } } .sta-cart-container button { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; cursor: pointer; background: white; color: #3c3c3b; font-family: "Montserrat", sans-serif; margin: 0; padding: 0; border: 0; } .sta-cart-container .sta-cart-title { position: relative; padding: 55px 60px; } @media screen and (max-width: 1024px) { .sta-cart-container .sta-cart-title { padding: 30px 20px 20px; } } @media screen and (max-width: 720px) { .sta-cart-container .sta-cart-title { padding: 30px 10px; } } .sta-cart-container .sta-cart-title .sta-cart-close { display: inline-block; vertical-align: middle; margin-right: 40px; line-height: 1; } @media screen and (max-width: 720px) { .sta-cart-container .sta-cart-title .sta-cart-close { margin-right: 20px; } } .sta-cart-container .sta-cart-title .sta-cart-close i { font-size: 1rem; } @media screen and (max-width: 720px) { .sta-cart-container .sta-cart-title .sta-cart-close i { font-size: 0.8125rem; } } .sta-cart-container .sta-cart-title h3 { display: inline-block; vertical-align: middle; margin: 0; color: #3c3c3b; font-size: 0.75rem; font-weight: 600; text-align: center; text-transform: uppercase; line-height: normal; letter-spacing: 1px; } .sta-cart-container .sta-cart-items { padding: 0 20px; height: calc(100vh - 325px); overflow: auto; } @media screen and (max-width: 1024px) { .sta-cart-container .sta-cart-items { padding: 0; height: calc(100vh - 250px); } } .sta-cart-container .sta-cart-items ul { margin: 0 0 0 0; } .sta-cart-container .sta-cart-items li { line-height: normal; } .sta-cart-container .sta-cart-items>ul>li { display: table; width: 100%; padding: 0 10px; margin-bottom: 30px; } @media screen and (max-width: 1024px) { .sta-cart-container .sta-cart-items>ul>li { padding: 0; margin-bottom: 0; } } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-image { display: table-cell; vertical-align: middle; width: 80px; line-height: 0; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-image img { display: block; margin: auto; width: 70px; height: 80px; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info { position: relative; display: table-cell; vertical-align: middle; padding-left: 10px; } @media screen and (max-width: 1024px) { .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info { padding: 10px; } } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info h4 { display: block; margin: 0 0 0 0; font-size: 0.75rem; font-weight: 600; line-height: normal; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info .sta-cart-pdt-other-info { clear: both; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info .sta-cart-pdt-other-info p { margin: 5px 0; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info .sta-cart-pdt-other-info .bestPrice { font-size: 0.875rem; font-weight: 600; color: #43c6cc; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-info .sta-cart-pdt-other-info .listPrice { color: #989898; font-size: 0.75rem; } .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-action { display: table-cell; vertical-align: middle; width: 80px; text-align: center; line-height: 80px; } @media screen and (max-width: 720px) { .sta-cart-container .sta-cart-items>ul>li .sta-cart-pdt-action { width: 40px; } } .sta-cart-container .sta-cart-resume { padding: 20px 70px; } @media screen and (max-width: 1024px) { .sta-cart-container .sta-cart-resume { padding: 20px 10px; } } .sta-cart-container .sta-cart-resume .sta-cart-sub { display: block; margin-bottom: 30px; color: #3c3c3b; font-size: 0.9375rem; text-transform: uppercase; } .sta-cart-container .sta-cart-resume .sta-cart-sub em { font-style: normal; font-weight: 600; } .sta-cart-container .sta-cart-resume .sta-cart-sub strong { color: #43c6cc; font-weight: 700; } .sta-cart-container .sta-cart-resume .sta-cart-freight, .sta-cart-container .sta-cart-resume .sta-cart-discount, .sta-cart-container .sta-cart-resume .sta-cart-total { display: none !important; } .sta-cart-container .sta-cart-resume .cartLink { background: #9560a4 !important; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; display: block; padding: 15px 10px; margin-bottom: 10px; } .sta-cart-container .sta-cart-resume .cartLink:hover { background: rgba(67, 198, 204, 0.8); } .sta-cart-container .sta-cart-resume .checkoutLink { display: block; padding: 15px 10px; color: #3c3c3b; font-size: 0; text-align: center; text-transform: uppercase; font-weight: bold; text-decoration: underline; } .sta-cart-container .sta-cart-resume .checkoutLink:before { content: "VER DETALHES DO CARRINHO"; font-size: 0.75rem; } .sta-cart-comfirm { display: none; width: 855px; height: 435px; position: fixed; top: 0; right: 0; bottom: 0; left: 0; margin: auto; padding: 30px 0; background: #fff; text-align: center; z-index: 9999999999; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .sta-cart-comfirm .close { position: absolute; top: 10px; right: 10px; color: #3c3c3b; font-size: 10px; cursor: pointer; } .sta-cart-comfirm h3 { color: #989898; font-family: "Nanum Pen Script", cursive; font-size: 1.375rem; margin-bottom: 40px; } .sta-cart-comfirm .sta-product-img { float: left; display: block; margin-right: 1.5384615385%; width: 32.3076923077%; margin-left: 16.9230769231%; } .sta-cart-comfirm .sta-product-img:last-child { margin-right: 0; } .sta-cart-comfirm .sta-product-img img { width: 100%; height: auto; line-height: 0; } .sta-cart-comfirm .sta-product-info { float: left; display: block; margin-right: 1.5384615385%; width: 32.3076923077%; } .sta-cart-comfirm .sta-product-info:last-child { margin-right: 0; } .sta-cart-comfirm .sta-product-info .productName { height: 35px; margin-bottom: 20px; color: #3c3c3b; font-size: 0.875rem; overflow: hidden; } .sta-cart-comfirm .sta-product-info .price { margin-bottom: 20px; text-align: center; } .sta-cart-comfirm .sta-product-info .price .listPrice { display: inline-block; vertical-align: middle; margin-right: 5px; font-size: 0.875rem; text-decoration: line-through; } .sta-cart-comfirm .sta-product-info .price .bestPrice { display: inline-block; vertical-align: middle; color: #989898; font-size: 1.125rem; font-weight: 900; } .sta-cart-comfirm .sta-product-info .dimensions { margin-bottom: 20px; } .sta-cart-comfirm .sta-product-info .dimensions .topic { display: inline-block; vertical-align: middle; } .sta-cart-comfirm .sta-product-info .dimensions .topic li { display: inline-block; vertical-align: middle; min-width: 28px; height: 28px; border: 1px solid #cccccc; margin: 0 5px; padding: 0 5px; color: #3c3c3b; font-size: 0.75rem; text-transform: uppercase; text-align: center; line-height: 28px; cursor: pointer; } .sta-cart-comfirm .sta-product-info .dimensions .topic li.sku-picked { border: 1px solid #c8c8c8; -moz-box-shadow: 0 0 0 1px #c8c8c8; -webkit-box-shadow: 0 0 0 1px #c8c8c8; box-shadow: 0 0 0 1px #c8c8c8; } .sta-cart-comfirm .sta-product-info .dimensions .topic.Cor li { font-size: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .sta-cart-comfirm .sta-product-info .dimensions .topic.Tamanho li { -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; } .sta-cart-comfirm .sta-product-info .sta-confirm-action a { display: block; padding: 10px 20px; } .sta-cart-comfirm .sta-product-info .sta-confirm-action a.sta-finishShop { margin-bottom: 10px; } @media screen and (max-width: 1024px) { .sta-cart-comfirm { width: 740px; } } @media screen and (max-width: 720px) { .sta-cart-comfirm { width: 300px; } .sta-cart-comfirm .sta-product-img { display: none; } .sta-cart-comfirm .sta-product-info { width: 100%; margin: auto; margin-left: auto; float: none; } } /* ========================================================================== Lightbox ========================================================================== */ .lightboxOverlay, #TB_overlay, #publishUserReview .footer { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.85); padding-top: 0.6em; text-align: left; z-index: 99; } .lightboxOverlay { opacity: 0; -webkit-transition: opacity 0.25s ease; /* Safari */ transition: opacity 0.25s ease; visibility: hidden; } .lightboxOverlayInner { position: fixed; top: 0; right: 0; bottom: 0; left: 0; top: 0; left: 0; width: 100%; height: 100%; z-index: 90; } .lightboxClose, .formUserComment .close a { position: absolute; top: -37px; right: 0; cursor: pointer; color: #fff; } #TB_closeWindowButton { position: absolute; top: -37px; right: 0; left: 45%; } .lightboxBlock, #publishUserReview .header { -webkit-transition: opacity 0.25s ease; /* Safari */ transition: opacity 0.25s ease; background: transparent; border-radius: 0; z-index: 99; } .lightboxOverlay.open { opacity: 1; visibility: visible; } #TB_window { width: 100% !important; left: 0 !important; margin-left: 0 !important; background: white; } #TB_window iframe { width: 800px !important; height: 500px !important; display: block; margin: 0 auto; } /* ========================================================================== Slider ========================================================================== */ .fullGallery { background: url("/arquivos/optoculos-loading.gif") no-repeat center center; background-color: #fff; overflow: hidden; height: 100px; -webkit-transition: height 0.3s ease; /* Safari */ transition: height 0.3s ease; } .fullGallery .box-banner { opacity: 0; position: absolute; } .fullGallery.slick-initialized { background: none; overflow: inherit; height: auto; } .fullGallery.slick-initialized .box-banner { opacity: 1; position: relative; transition: opacity 0.2s ease-in; } .fullGallery.slick-initialized.bgImage .box-banner a { display: block; } .fullGallery.slick-initialized.bgImage .box-banner a:before { content: ""; display: block; padding-top: 25.5%; } .fullGallery .slick-prev, .fullGallery .slick-next { position: absolute; display: block; top: 45%; border: none; background: transparent; color: white; font-size: 0; cursor: pointer; outline: none; z-index: 2; } .fullGallery .slick-prev:after, .fullGallery .slick-next:after { font-family: "optoculosfonticon" !important; content: ""; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-size: 3.625rem; } .fullGallery .slick-prev { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); left: 30px; } .fullGallery .slick-next { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); right: 30px; } .fullGallery .slick-prev, .fullGallery .slick-next { -webkit-transition: all 0.2s ease; /* Safari */ transition: all 0.2s ease; } .fullGallery .slick-prev:hover, .fullGallery .slick-next:hover { padding-right: 20px; } @media screen and (max-width: 720px) { .fullGallery .slick-prev:after, .fullGallery .slick-next:after { font-size: 1.125rem; } .fullGallery .slick-prev { left: 10px; } .fullGallery .slick-next { right: 10px; } } .fullGallery .slick-dots { text-align: center; margin-top: 15px; } .fullGallery .slick-dots li { display: inline-block; vertical-align: middle; margin: 10px; } .fullGallery .slick-dots li button { padding: 0; border: none; font-size: 0; width: 12px; height: 12px; background: transparent; border-radius: 50%; border: 0 solid transparent; } .fullGallery .slick-dots li.slick-active button {} .fullGallery .slick-dots { position: absolute; width: 10px; height: 100%; top: 0; right: 30px; bottom: 0px; margin: auto; display: flex !important; align-items: center; flex-direction: column; justify-content: center; } .fullGallery .slick-dots li { display: block; width: auto; float: none; line-height: 0; margin: 5px 0px; } .fullGallery .slick-dots button { width: 8px !important; height: 8px !important; } @media screen and (max-width: 1024px) { .fullGallery .slick-dots { bottom: 20px; } .fullGallery .slick-dots li button { width: 15px !important; height: 15px !important; } } .shelfCarousel { position: relative; } .mainProductImage .apresentacao #show .thumbs .slick-list .slick-track { display: flex; flex-direction: column; height: 100% !important; } @media screen and (max-width: 720px) { .mainProductImage .apresentacao #show .thumbs .slick-list .slick-track { /*display: block;*/ flex-direction: row; } body.product .mainProductImage .thumbs.slick-initialized { display: block; position: relative !important; left: 0px !important; } } .topImageproduct { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } @media screen and (max-width: 720px) { .topImageproduct { left: 0; } .topImageproduct .brand-badge { width: 100px; } } .topImageproduct::after { display: none; } .topImageproduct .product-espelho-vitrine button { padding-top: 0; } .topImageproduct .brand-badge { width: 100px; } .brandimage { width: 28%; } .shelfCarousel .slick-prev, .shelfCarousel .slick-next { position: absolute; display: block; top: 50%; border: none; background: transparent; color: #989898; font-size: 0; cursor: pointer; outline: none; z-index: 2; } .shelfCarousel .slick-prev:after, .shelfCarousel .slick-next:after { font-family: "optoculosfonticon" !important; content: ""; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-size: 4rem; display: none; } .shelfCarousel .slick-prev { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); left: -16px; } .shelfCarousel .slick-next { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); right: -16px; } @media screen and (max-width: 720px) { .shelfCarousel .slick-prev, .shelfCarousel .slick-next { position: absolute; display: block; top: 50%; border: none; background: transparent; color: #989898; font-size: 0; cursor: pointer; outline: none; z-index: 2; } .shelfCarousel .slick-prev:after .shelfCarousel .slick-next:after { font-family: "optoculosfonticon" !important; content: ""; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-size: 2rem; } .shelfCarousel .slick-prev { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); left: -16px; } .shelfCarousel .slick-next { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); right: -16px; } } .shelfCarousel .shelf>ul { background: url("/arquivos/optoculos-loading.gif") no-repeat center center; overflow: hidden; height: 100px; padding: 0 0px; -webkit-transition: height 0.3s ease; /* Safari */ transition: height 0.3s ease; } .shelfCarousel li { opacity: 0; position: absolute; } .shelfCarousel ul.slick-slider.slick-initialized { position: inherit; background: none; overflow: inherit; height: auto; } .shelfCarousel ul.slick-initialized li { opacity: 1; position: relative; transition: opacity 0.2s ease-in; } .shelfCarousel .slick-prev, .shelfCarousel .slick-next { padding: 0; } .shelfCarousel .shelf li.slick-slide { margin: 10px; } @media screen and (max-width: 1024px) { .shelfCarousel .slick-prev { left: 0px; } .shelfCarousel .slick-next { right: 0px; } .shelfCarousel .shelf>ul { padding: 0; } } .thumbs .slick-prev, .thumbs .slick-next { display: block; border: none; padding: 0; margin: 10px auto; position: relative; background: transparent; color: #989898; font-size: 0; cursor: pointer; outline: none; z-index: 2; } .thumbs .slick-prev:after, .thumbs .slick-next:after { font-family: "optoculosfonticon" !important; content: "\e900"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-size: 0.625rem; } .thumbs .slick-prev { -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); } .thumbs .slick-next { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } @media screen and (max-width: 720px) { .thumbs .slick-dots { text-align: center; margin-top: 15px; } .thumbs .slick-dots li { display: inline-block; vertical-align: middle; margin: 10px; } .thumbs .slick-dots li button { padding: 0; border: none; font-size: 0; width: 10px; height: 10px; background: white; border-radius: 50%; border: 1px solid black; } .thumbs .slick-dots li.slick-active button { background: #43c6cc; } .thumbs .slick-dots { position: relative; width: 100%; margin-bottom: 15px; } .thumbs .slick-dots li { width: auto; float: none; line-height: 0; margin: 0px 3px; } .thumbs .slick-dots li button { margin: 5px; } .thumbs .slick-dots li.slick-active button { border: none; } } /* ========================================================================== Shelf ========================================================================== */ .shelf { /* Shelf Common ========================================================================== */ } .shelf h2 { display: block; margin-bottom: 20px; color: rgb(79, 79, 79); font-size: 30px; font-weight: 700; letter-spacing: 0.27px; text-transform: uppercase; display: none; } @media screen and (max-width: 1024px) { .shelf h2 { font-size: 2.125rem; } } @media screen and (max-width: 720px) { .shelf h2 { font-size: 1.375rem; text-align: center; } } .shelf li .productBrands { display: none !important; } .shelf li .flagGroup { position: absolute; right: 15px; top: 15px; z-index: 2; width: 93%; } .shelf li .flagGroup .flagDiscount { display: block; box-sizing: border-box; height: 24.8px; width: 65px; border-radius: 0px; border: none; color: #fff; background: #ea5e46; letter-spacing: 0.13px; text-align: center; line-height: 24px; font-weight: 400!iportant; float: right; } /* .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.frete-gratis { z-index: 999; position: absolute; top: 51px; box-sizing: border-box; height: 30px; width: 100px; border-radius: 2px; border: 1px solid #EB5D40; color: #EB5D40; letter-spacing: 0.13px; text-align: center; background-color: #fff; line-height: 27px; right: 15px; font-weight: 700; } */ .flagGroup-highlight { margin-top: 5px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.frete-gratis { display: none; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.novidades { background-image: url(/arquivos/optoculos-tag-lançamento-v2.png); background-repeat: no-repeat; background-position: left; background-size: contain; color: transparent; height: 28px; z-index: 999999999; position: absolute; top: 12px; width: 130px; left: 0px; left: 15px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.desatiivada_mais-vendidos { display: none; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.bestseller { background-image: url(/arquivos/optoculos-tag-bestseller-v2.png); background-repeat: no-repeat; background-position: left; background-size: contain; color: transparent; height: 28px; z-index: 999999999; position: absolute; top: 12px; width: 130px; left: 15px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.outlet { background-image: url(/arquivos/optoculos-tag-outlet-V2.png); background-repeat: no-repeat; background-position: left; background-size: contain; color: transparent; height: 28px; z-index: 999999999; position: absolute; top: 12px; width: 130px; left: 0px; left: 15px; } @media (max-width: 1100px) { .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.novidades { background-image: url(/arquivos/optoculos-tag-lançamento-v2.png); background-repeat: no-repeat; background-position: left; background-size: contain; color: transparent; height: 28px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.bestseller { background-image: url(/arquivos/optoculos-tag-bestseller-v2.png); background-repeat: no-repeat; background-position: left; background-size: contain; color: transparent; height: 28px; z-index: 999999999; position: absolute; top: 18px; width: 104px; left: 0px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.outlet { background-image: url(/arquivos/optoculos-tag-outlet-V2.png); background-repeat: no-repeat; background-position: left; background-size: contain; color: transparent; height: 28px; z-index: 999999999; position: absolute; top: 18px; width: 104px; left: 0px; } } /*.shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.novidades { z-index: 999; box-sizing: border-box; height: 30px; width: 100px; border-radius: 2px; border: 1px solid #EB5D40; color: #EB5D40; letter-spacing: 0.13px; text-align: center; background-color: #fff; line-height: 27px; font-weight: 700; }*/ .shelf .flagGroup-highlight .flagGroup-highlight-discount p.flag.infantil { position: absolute; top: 45px; z-index: 999; box-sizing: border-box; height: 30px; width: 100px; border-radius: 2px; border: 1px solid #eb5d40; color: #eb5d40; letter-spacing: 0.13px; text-align: center; background-color: #fff; line-height: 27px; font-weight: 700; margin-top: 10px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.oculos-de-sol { position: absolute; top: 45px; z-index: 999; box-sizing: border-box; height: 30px; width: 100px; border-radius: 2px; border: 1px solid #eb5d40; color: #eb5d40; letter-spacing: 0.13px; text-align: center; background-color: #fff; line-height: 27px; font-weight: 700; width: 120px; margin-top: 10px; } .shelf .flagGroup-highlight .flagGroup-highlight-discount p.femininos { display: block; box-sizing: border-box; height: 21.8px; width: 65px; border-radius: 0px; border: none; color: #fff; background: #ea5e46; letter-spacing: 0.13px; text-align: center; line-height: 23px; font-weight: 400!iportant; margin-top: 6px; font-size: 12px; } .shelf li .flagGroup .flagDiscount strong { font-size: 12px; } .shelf li .flagGroup .flagDiscount.active { display: block; font-weight: 400; } .shelf li .productImage { /* position: relative;*/ } .shelf li .productImage a { display: block; line-height: 0; } .shelf li .productImage img { display: block; width: 100%; max-width: 400px; height: auto; margin: auto; } .shelf li .productImage .firstImage { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } .shelf li .productImage .secondImage { position: absolute; top: 0; left: 0; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } .shelf li:hover { -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08); -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08); } .shelf li:hover .productImage .firstImage { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } .shelf li:hover .productImage .secondImage { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } .shelf li:hover .buyShelf { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } @media screen and (max-width: 1024px) { .shelf li:hover { -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); } .shelf li:hover .productImage .secondImage { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } .shelf li:hover .buyShelf { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } } .shelf li .buyShelf { padding: 20px; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s linear; /* Safari */ transition: all 0.3s linear; } @media screen and (max-width: 1024px) { .shelf li .buyShelf { display: none; } } .shelf li .buyShelf a { display: block; background: #43c6cc; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; font-size: 14px; font-weight: 700; } .shelf li .buyShelf a:hover { background: rgba(67, 198, 204, 0.8); } .shelf li .buyShelf a i { margin-right: 5px; } .shelf li .productPrice a { display: block; line-height: 1; } .shelf li .productPrice a .oldPrice { display: block; color: #989898; } .shelf li .productPrice a .bestPrice { display: block; color: #43c6cc; font-weight: 600; } .shelf li .productPrice a .installment { display: block; color: #989898; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] { position: relative; margin-bottom: 20px; padding: 10px; background: #fff; transition: 0.3s; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productImage { width: 85%; margin: auto; margin-top: 30px; /* position: relative;*/ } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productImage a { display: block; line-height: 0; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productImage img { display: block; width: 100%; max-width: 400px; height: auto; margin: auto; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productImage .secondImage { position: absolute; top: 0; left: 0; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover { -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover .buybuttom { visibility: visible; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover .productImage .secondImage { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover .buyShelf { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } @media screen and (max-width: 1024px) { .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover { -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover .productImage .secondImage { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"]:hover .buyShelf { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .buyShelf { padding: 20px; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s linear; /* Safari */ display: none !important; transition: all 0.3s linear; position: relative; top: -50px; } @media screen and (max-width: 1024px) { .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .buyShelf { display: none; } } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .buyShelf a { display: block; background: #43c6cc; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; font-size: 14px; font-weight: 700; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .buyShelf a:hover { background: rgba(67, 198, 204, 0.8); } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .buyShelf a i { margin-right: 5px; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productInfo .shelfProductName { margin-bottom: 15px; text-align: center; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productInfo .shelfProductName a { display: block; height: 55px; overflow: hidden; color: #3c3c3b; font-size: 0.875rem; font-weight: 600; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productPrice a { text-align: center; font-size: 0.8125rem; height: auto; /* height: 60px; */ overflow: hidden; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productPrice a .oldPrice { display: block; margin-bottom: 10px; font-size: 15px; vertical-align: middle; margin-left: 5px; margin-right: 5px; text-decoration: line-through; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productPrice a .bestPrice { display: block; vertical-align: middle; margin-left: 5px; font-size: 25px; margin-right: 5px; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productPrice a .installment { margin-top: 15px; font-size: 0.75rem; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productPrice a .installment:before { content: "ou em até"; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .soldOut { text-align: center; height: 60px; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .soldOut p { display: table; margin: auto; padding: 5px 15px; background: #ff613b; color: #fff; font-size: 0.6875rem; font-weight: 600; text-transform: uppercase; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; } /* ========================================================================== imports pages ========================================================================== */ /* ========================================================================== Common ========================================================================== */ body { background: #fff !important; color: #3c3c3b; font-size: 0.875rem; font-family: "Montserrat", sans-serif !important; line-height: normal; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -ms-font-smoothing: antialiased; font-smoothing: antialiased; -moz-text-shadow: 0 0 1px rgba(0, 0, 0, 0); -ms-text-shadow: 0 0 1px rgba(0, 0, 0, 0); text-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-text-stroke: 1px transparent; -moz-text-stroke: 1px transparent; -ms-text-stroke: 1px transparent; text-stroke: 1px transparent; text-rendering: optimizeLegibility; } @media screen and (max-width: 1024px) { body.menuOpen { overflow: hidden; } } body.hidden { overflow: hidden; } body a:hover { text-decoration: none; } .wrapper, .pageNav .menu-departamento .submenu .submenuWrap { max-width: 1600px; margin-left: auto; margin-right: auto; padding-left: 50px; padding-right: 50px; } .wrapper::after, .pageNav .menu-departamento .submenu .submenuWrap::after { clear: both; content: ""; display: table; } @media screen and (max-width: 720px) { .wrapper, .pageNav .menu-departamento .submenu .submenuWrap { padding-left: 10px; padding-right: 10px; } } .right { text-align: right; } .seoStoreName { display: none; } #ajaxBusy { position: absolute; top: 5px; left: 5px; } /*breadcrumb*/ .bread-crumb { margin-bottom: 15px; } .bread-crumb li { color: #989898; display: inline-block; vertical-align: middle; } .bread-crumb li:after { content: ""; display: inline-block; margin: 0 5px 0 5px; } .bread-crumb li.last a { color: #43c6cc; } .bread-crumb li.last:after { display: none; } .bread-crumb li a { color: #989898; } .bread-crumb li a:hover { text-decoration: underline; } .bread-crumb { padding: 20px 0 25px; margin-bottom: 0; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; } .bread-crumb li a:hover { text-decoration: none; } .bread-crumb li:after { display: inline-block; vertical-align: middle; width: 4px; height: 4px; background: #43c6cc; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .bread-crumb li:first-child a { font-size: 0; } .bread-crumb li:first-child a:before { content: "Home"; display: inline-block; font-size: 0.75rem; } @media screen and (max-width: 1024px) { .bread-crumb { padding: 10px 0; font-size: 0.6875rem; } .bread-crumb li:first-child a:before { font-size: 0.6875rem; } } /*Dropdown*/ .dropdown { display: table; position: relative; overflow: hidden; } .dropdown .hideContent { position: absolute; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.18s ease-out 0.18s; /* Safari */ transition: all 0.18s ease-out 0.18s; -webkit-transform: translate(0%, 15px); -moz-transform: translate(0%, 15px); -ms-transform: translate(0%, 15px); -o-transform: translate(0%, 15px); transform: translate(0%, 15px); -webkit-transform-origin: top; -moz-transform-origin: top; -ms-transform-origin: top; -o-transform-origin: top; transform-origin: top; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } .dropdown.active { overflow: visible; } .dropdown.active .hideContent { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); -webkit-transform: translate(0%, 10px); -moz-transform: translate(0%, 10px); -ms-transform: translate(0%, 10px); -o-transform: translate(0%, 10px); transform: translate(0%, 10px); z-index: 1; } .dropdown .select { line-height: normal; } #news-modal { position: fixed; top: 0; z-index: 5003; width: 100%; height: 100%; transition: 300ms all ease-in-out; } #news-modal fieldset { display: flex; align-items: center; width: 100%; padding: 5px; } #news-modal fieldset.send { width: 50%; } @media screen and (max-width: 720px) { #news-modal fieldset.send { width: 100%; } } #news-modal input { background-color: #fff; color: #000; appearance: none; border: 0; font-size: 16px; width: 50%; padding: 13px; /* border: 1px solid #c0bfbf; */ border-radius: 30px; text-align: center; margin-bottom: 30px; } #news-modal input::placeholder { color: #c0bfbf; } #news-modal button { background-color: #9561a4; border: 0; padding: 10px; width: 50%; color: #fff; font-weight: bold; font-size: 14px; border-radius: 30px; cursor: pointer; height: 45px; } #news-modal-copiado { margin-bottom: 20px; color: #fff; font-size: 20px; } #news-modal .text { margin-top: 45%; margin-bottom: 5%; } #news-modal .text .title { font-size: 60px; font-weight: 900; text-transform: uppercase; text-align: center; color: #fff; line-height: 40px; } @media screen and (max-width: 720px) { #news-modal .text .title { font-size: 16px; line-height: 24px; } } #news-modal .text p { font-size: 20px; text-transform: uppercase; line-height: 75px; color: #fff; text-align: center; } @media screen and (max-width: 720px) { #news-modal .text p { font-size: 20px; line-height: 39px; } } #news-modal .text p span { font-size: 23px; line-height: 25px; display: block; } @media screen and (max-width: 720px) { #news-modal .text p span { font-size: 13px; line-height: 13px; } } #news-modal .gender { margin: 15px 0; } #news-modal .gender input { width: 20px; cursor: pointer; } #news-modal .gender label { color: #3c3c3b; text-transform: uppercase; font-size: 12px; margin-right: 5px; vertical-align: text-top; position: relative; padding-left: 35px; cursor: pointer; } #news-modal .gender label input { position: absolute; opacity: 0; cursor: pointer; top: 0; left: 15px; z-index: 999; } #news-modal .gender .checkmark { position: absolute; top: 0; left: 15px; height: 13px; width: 13px; background-color: #eee; border-radius: 50%; border: 1px solid #c0bfbf; } #news-modal .gender label:hover input~.checkmark { background-color: #ccc; } #news-modal .gender label input:checked~.checkmark { background-color: white; } #news-modal .gender .checkmark:after { content: ""; position: absolute; display: none; } #news-modal .gender label input:checked~.checkmark:after { display: block; } #news-modal .gender label .checkmark:after { top: 2px; left: 2px; width: 7px; height: 7px; border-radius: 50%; background: #43c6cc; } #news-modal .news-modal-overlay { position: fixed; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); text-align: left; z-index: 99; } #news-modal .news-modal-close { color: #fff; font-size: 10px; text-transform: uppercase; cursor: pointer; } #news-modal .news-modal-content { position: absolute; top: 0; left: 0; right: 0; width: 655px; height: 755px; /* background-color: #fff; */ background: url(/arquivos/fundo-popup.png); background-repeat: no-repeat; background-size: contain; z-index: 100; /* border-radius: 50%; */ } #news-modal .news-modal-content:after { display: none; } @media screen and (max-width: 720px) { #news-modal .news-modal-content { width: 320px; height: auto; min-height: 320px; max-width: 95%; max-height: 95%; border-radius: 10px; } } #news-modal .news-modal-head { position: absolute; right: 50px; top: 110px; padding: 10px; cursor: pointer; z-index: 100; } .news-modal-head i { color: #fff; } @media screen and (max-width: 720px) { #news-modal .news-modal-head { right: 0px; top: -30px; } } #news-modal .news-modal-body { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; height: 100%; padding: 40px; } #news-modal .news-modal-body:after { display: none; } #news-modal .news-modal-body .banner-news { width: 560px; } @media screen and (max-width: 720px) { #news-modal .news-modal-body { padding: 10px; flex-wrap: wrap; } #news-modal .news-modal-body .banner-news { order: 1; width: 100%; } #news-modal .news-modal-body .left { order: 2; } } #news-modal .news-modal-img-left { position: absolute; left: 20px; width: 21%; top: 10px; } @media screen and (max-width: 720px) { #news-modal .news-modal-img-left { display: none; } } #news-modal .news-modal-img-right { position: absolute; right: 5px; top: 45px; width: 25%; } @media screen and (max-width: 720px) { #news-modal .news-modal-img-right { display: none; } } #news-modal .form-modal-news { display: flex; flex-wrap: wrap; flex-direction: column; align-items: center; width: 80%; margin-top: 40px; } #news-modal .form-modal-news:after { display: none; } @media screen and (max-width: 720px) { #news-modal .form-modal-news { width: 100%; margin-top: 20px; } } #news-modal .news-modal-sucess { display: none; flex-wrap: wrap; flex-direction: column; align-items: center; width: 100%; margin-top: 60px; text-align: center; } @media screen and (max-width: 720px) { #news-modal .news-modal-sucess { margin-top: 20px; } } #news-modal .news-modal-sucess p { color: #3c3c3b; font-size: 15px; margin-bottom: 50px; width: 55%; line-height: 20px; } #news-modal .news-modal-sucess p span { font-weight: bold; font-size: 16px; } @media screen and (max-width: 720px) { #news-modal .news-modal-sucess p { font-size: 13px; line-height: 16px; width: 85%; margin-bottom: 30px; } #news-modal .news-modal-sucess p span { font-size: 14px; } } #news-modal .news-modal-sucess button { background-color: #3c3c3b; border: 0; padding: 10px; width: 40%; color: #fff; font-weight: bold; font-size: 14px; border-radius: 30px; cursor: pointer; height: 45px; } @media screen and (max-width: 720px) { #news-modal .news-modal-sucess button { width: 100%; } } #returnToTop { display: none; position: fixed; bottom: 70px; right: 20px; } #returnToTop a { border: 1px solid #9a5bb3; font-family: "Nanum Pen Script", cursive; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-direction: normal; -webkit-box-orient: vertical; -moz-box-direction: normal; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; align-items: center; width: 70px; height: 70px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; text-align: center; color: #9a5bb3; background-color: rgba(255, 255, 255, 0.7); } #returnToTop a i { position: relative; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); font-size: 10px; } #returnToTop a span { margin-top: 7px; font-size: 16px; line-height: 0.8; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); -ms-transform: rotate(-5deg); -o-transform: rotate(-5deg); transform: rotate(-5deg); text-transform: uppercase; } #returnToTop a:hover { border: 1px solid #3ba5a8; color: #3ba5a8; } /* ========================================================================== Home ========================================================================== */ body.home .fullGallery .slick-slide a img { width: 100%; height: auto; } body.home .fullGallery#tvMobile, #mainContent .showMobile { display: none; } #mainContent .showDesk { display: block; } .bannerHorizontalHome { width: 100%; height: auto; margin-bottom: 2em; } .bannerHorizontallateral { height: auto; width: 50%; margin-top: 2em; margin-bottom: 2em; display: inline-block; } .bannerHorizontallateral2 { height: auto; width: 50%; margin-top: 2em; margin-bottom: 2em; display: inline-block; } .bannerHorizontallateral3 { height: auto; width: 50%; margin-top: 2em; margin-bottom: 2em; display: inline-block; } .spacedtitle { display: block; margin-bottom: 16px; color: rgb(79, 79, 79); font-size: 26px; font-weight: 700; letter-spacing: 0.27px; text-transform: uppercase; margin-top: 1em; } .featuredCollection { padding: 70px 0; width: 50%; display: inline-block; } @media screen and (max-width: 720px) { #mainContent{ /*margin-top: 55px;*/ } body.home .fullGallery#tvDesktop, #mainContent .showDesk { display: none; } body.home .fullGallery#tvMobile, #mainContent .showMobile { display: block; } } body.home .featuredBanner .box-banner a { display: block; line-height: 0; font-size: 0; text-align: center; } body.home .featuredBanner .box-banner img { width: 100%; height: auto; font-size: 0; line-height: 0; } body.home .featuredProducts { padding: 40px 0; } .featuredCollection { padding: 70px 0; width: 50%; display: inline-block; } @media screen and (max-width: 1024px) { body.home .featuredProducts { padding: 40px 0; } } @media screen and (max-width: 720px) { body.home .featuredProducts { padding: 30px 0; } } body.home .collectionHighlight { margin-top: 4%; } body.home .collectionHighlight .box-banner { width: 25%; float: left; padding: 1% 0.5%; } @media screen and (max-width: 720px) { body.home .collectionHighlight .box-banner { width: 100%; padding: 2% 0; } } body.home .bannerHighlight .box-banner { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; } body.home .bannerHighlight .box-banner:last-child { margin-right: 0; } @media screen and (max-width: 1024px) { body.home .bannerHighlight .box-banner { float: left; display: block; margin-right: 1.1494252874%; width: 32.5118390805%; } body.home .bannerHighlight .box-banner:last-child { margin-right: 0; } } @media screen and (max-width: 720px) { body.home .bannerHighlight .box-banner { width: 100%; margin-left: 0; margin-right: 0; margin-top: 2%; padding-left: 0; padding-right: 0; } } body.home .bannerHorizontalHome .box-banner { margin-top: 10px; } body.home .formatCarousel { margin: 70px 0; } body.home .formatCarousel h2 { display: block; margin-bottom: 20px; color: #989898; font-size: 3.75rem; font-weight: 900; text-transform: uppercase; } @media screen and (max-width: 1024px) { body.home .formatCarousel h2 { font-size: 2.125rem; } } @media screen and (max-width: 720px) { body.home .formatCarousel h2 { font-size: 1.375rem; text-align: center; } } body.home .formatCarousel ul li { float: left; display: block; margin-right: 0.7633587786%; width: 13.5114503817%; } body.home .formatCarousel ul li:last-child { margin-right: 0; } body.home .formatCarousel ul li a { display: block; color: #989898; font-size: 0.875rem; text-transform: uppercase; text-align: center; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.home .formatCarousel ul li a:hover { color: #43c6cc; } body.home .formatCarousel ul li i { font-size: 2.25rem; } body.home .formatCarousel ul li span { display: block; margin: 10px 0 0; line-height: 1.2; } @media screen and (max-width: 1024px) { body.home .formatCarousel { margin: 40px 0; } body.home .formatCarousel ul li a { font-size: 0.75rem; } body.home .formatCarousel ul li i { font-size: 1.5rem; } } @media screen and (max-width: 720px) { body.home .formatCarousel { display: none; } } @media screen and (max-width: 720px) { body.home .bannerHorizontalHome { display: none; } } body.home .benefitsBar { margin: 70px 0 0; } body.home .benefitsBar li { float: left; display: block; margin-right: 0.7633587786%; width: 19.3893129771%; text-align: center; } body.home .benefitsBar li:last-child { margin-right: 0; } body.home .benefitsBar p { display: block; width: 148px; height: 148px; margin: auto; padding: 35px 0; color: #fff; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } body.home .benefitsBar p i { display: block; font-size: 2.375rem; } body.home .benefitsBar p span { display: block; margin-top: 10px; font-size: 0.875rem; font-weight: 700; text-transform: uppercase; line-height: 1; } body.home .benefitsBar p.delivery { background-color: #43c6cc; } body.home .benefitsBar p.freight { background-color: #9a5bb3; } body.home .benefitsBar p.installment { background-color: #ff613b; } body.home .benefitsBar p.truth { background-color: #3cb6f7; } body.home .benefitsBar p.callcenter { background-color: #0dd0ae; } @media screen and (max-width: 1024px) { body.home .benefitsBar { margin: 40px 0 0; } body.home .benefitsBar p { width: 120px; height: 120px; padding: 22px 0; } body.home .benefitsBar p span { font-size: 0.75rem; } body.home .benefitsBar p:after { display: none !important; } } @media screen and (max-width: 720px) { body.home .benefitsBar { display: none; } } body.home .youtubr-footer { margin-top: 60px; } body.home .youtubr-footer .slick-slide { padding: 0 10px; } .youtubr-footer .slick-next { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); right: -16px; } .youtubr-footer .slick-prev { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); left: -16px; } .youtubr-footer .slick-prev, .youtubr-footer .slick-next { position: absolute; display: block; top: 30%; border: none; background: transparent; color: #989898; font-size: 0; cursor: pointer; outline: none; z-index: 2; } .youtubr-footer .slick-prev:after, .youtubr-footer .slick-next:after { font-family: "optoculosfonticon" !important; content: ""; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; font-size: 4rem; } body.home .instaFeed h2, body.home .youtubr-footer h2 { display: block; margin-bottom: 20px; color: rgb(79, 79, 79); font-size: 30px; font-weight: 700; letter-spacing: 0.27px; text-transform: uppercase; margin-top: 1em; } @media screen and (max-width: 1024px) { body.home .instaFeed h2, body.home .youtubr-footer h2 { font-size: 2.125rem; } } @media screen and (max-width: 720px) { body.home .instaFeed h2, body.home .youtubr-footer h2 { font-size: 1.375rem; text-align: center; } } body.home .instaFeed #instagram { display: block; width: 100%; } body.home .instaFeed #instagram:after {} body.home .instaFeed .instaItem { float: left; display: block; margin-right: 0.7633587786%; width: 19.3893129771%; background-position: center center; background-repeat: no-repeat; background-size: cover; overflow: hidden; } body.home .instaFeed .instaItem:last-child { margin-right: 0; } body.home .instaFeed .instaItem a { display: block; line-height: 0; font-size: 0; } body.home .instaFeed .instaItem a:before { content: ""; display: block; padding-top: 100%; } @media screen and (max-width: 1024px) { body.home .instaFeed {} } /* ========================================================================== Product - skeleton ========================================================================== */ body.product .mainProductInfo { position: relative; border-left: 1px solid #ddd; } body.product .mainProductImage { display: block; width: 45.4198473282%; } @media screen and (max-width: 375px) { body.product .mainProductInfo { padding: 30px 0px; } body.product .mainProductInfo { border-left: none; } } body.product .mainProductImage:last-child { margin-right: 0; } body.product .mainProductImage #include { display: block; width: 74.6153846154%; margin-right: 0; order: 1; } body.product .mainProductImage #include:last-child { margin-right: 0; } @media screen and (max-width: 720px) { body.product .mainProductImage #include { display: none; } } body.product .mainProductImage .thumbs { display: block; margin-right: 1.5384615385%; } body.product .mainProductImage .thumbs:last-child { margin-right: 0; } body.product .mainProductInfo { float: left; display: block; margin-right: 0.7633587786%; width: 39.1221374046%; margin-left: 4.1984732824%; } body.product .mainProductInfo:last-child { margin-right: 0; padding: 30px 20px; } /* ========================================================================== Product - Custom ========================================================================== */ body.product .productSectionTitle, body.product .mainProductInfo .moreColors .similar h2, body.product .mainProductInfo .shipping #calculoFrete .header h2 { margin-bottom: 15px; color: #4f4f4f; font-size: 0.6875rem; text-transform: uppercase; } body.product .productSectionTitle:before, body.product .mainProductInfo .moreColors .similar h2:before, body.product .mainProductInfo .shipping #calculoFrete .header h2:before { content: ""; display: inline-block; vertical-align: middle; margin-right: 8px; width: 6px; height: 6px; background: #3cb6f7; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; display: none; } body.product .mainProduct { display: flex; margin-bottom: 15px; border-radius: 10px; box-shadow: 1px 2px 8px 1px rgb(0 0 0 / 50%); padding: 30px; } @media screen and (max-width: 720px) { body.product .mainProduct { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-bottom: 30px; padding: 20px 10px; } } body.product .mainProductImage { position: relative; } body.product .mainProductImage .cloneImage { display: none; } body.product .mainProductImage .cloneImage img { width: 100%; height: auto; } body.product .mainProductImage #image { position: relative; } body.product .mainProductImage #image #image-main { display: block; width: 100%; } body.product .mainProductImage .zoomPup { cursor: crosshair; background: rgba(255, 255, 255, 0); z-index: 5002; } body.product .mainProductImage .zoomWindow { overflow: hidden; background: #fff; width: 100%; height: 100%; z-index: 2; left: 0 !important; top: 0 !important; } body.product .mainProductImage .zoomWindow .zoomWrapperTitle { display: none !important; } body.product .mainProductImage .thumbs { padding: 0; display: none; height: 100px; } /* @media screen and (max-width: 1024px) { body.product .mainProductImage .thumbs { } } */ a.buy-button.comprar-com-lente { color: #9560a4 !important; width: 50%; padding: 15px 5px; border: 1px solid #9560a4 !important; background: white !important; font-size: 0.875rem; font-family: "Montserrat", sans-serif; text-align: center; font-weight: 600; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; } body.product .mainProductImage .thumbs.slick-initialized { display: block; } body.product .mainProductImage .thumbs li { margin-bottom: 10px; /* width: 120px !important; */ } body.product .mainProductImage .thumbs .slick-slide { width: 120px; min-height: auto!important; } @media screen and (max-width: 1440px) { body.product .mainProductImage .thumbs .slick-slide { margin-bottom: 10px; width: 100px !important; } } @media screen and (max-width: 600px) { body.product .mainProductImage .thumbs .slick-slide { width: 405px !important; } body.product .mainProductImage .thumbs { height: auto; } } @media screen and (max-width: 600px) { body.product .mainProductImage .thumbs .slick-slide { width: 395px !important; } } @media screen and (max-width: 375px) { body.product .mainProductImage .thumbs .slick-slide { width: 355px !important; } } @media screen and (max-width: 320px) { body.product .mainProductImage .thumbs .slick-slide { width: 300px !important; } } body.product .mainProductImage .thumbs li a { display: block; width: 100%; height: 100%; border: 1px solid #fff; overflow: hidden; line-height: 0; opacity: 0.3; -moz-opacity: 0.3; filter: alpha(opacity=30); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 3%; } body.product .mainProductImage .thumbs li a.ON { border: 1px solid #43c6cc; opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } body.product .mainProductImage .thumbs li img { width: 100%; height: auto; margin: auto; line-height: 0; } @media screen and (min-width: 1025px) { body.product .mainProductImage .thumbs li img { max-width: 100px; } } @media screen and (max-width: 1024px) { body.product .mainProductImage { width: 50%; margin: 0; } } @media screen and (max-width: 720px) { body.product .mainProductImage { min-height: 200px; float: none; margin: 0; width: 100%; } body.product .mainProductImage .thumbs { padding: 0 0px; float: none; width: 100%; } body.product .mainProductImage .thumbs.slick-initialized { background: none; } body.product .mainProductImage .thumbs ul { position: relative; } body.product .mainProductImage .thumbs li { margin-bottom: 0; } body.product .mainProductImage .thumbs a { opacity: 1 !important; } body.product .mainProductImage .thumbs a.ON { border: none !important; border-radius: none; } } @media screen and (max-width: 1024px) { body.product .mainProductInfo { margin: 0; width: 40%; float: right; } } @media screen and (max-width: 720px) { body.product .mainProductInfo { width: 100%; float: none; margin: 0; } } body.product .mainProductInfo .productTitle { display: block; margin-bottom: 15px; color: #828282; font-size: 1.5625rem; font-weight: 900; text-transform: uppercase; } @media screen and (max-width: 720px) { body.product .mainProductInfo .productTitle { font-size: 1.0625rem; margin: 0; } } body.product .mainProductInfo h6.productReference { color: #989898; font-size: 0.6875rem; text-transform: uppercase; } @media screen and (max-width: 720px) { body.product .mainProductInfo h6.productReference { font-size: 0.625rem; } } body.product .mainProductInfo h6.productReference div { display: inline-block; vertical-align: text-bottom; } body.product .mainProductInfo .priceProduct { position: relative; } body.product .mainProductInfo .priceProduct .plugin-preco { padding: 20px 0 0; line-height: 1.2; } body.product .mainProductInfo .priceProduct .plugin-preco .preco-a-vista, body.product .mainProductInfo .priceProduct .plugin-preco .economia-de { display: none !important; } body.product .mainProductInfo .priceProduct .plugin-preco .descricao-preco .valor-de { color: #989898; font-size: 1rem; text-decoration: line-through; } @media screen and (max-width: 720px) { body.product .mainProductInfo .priceProduct .plugin-preco .descricao-preco .valor-de { font-size: 0.75rem; } } body.product .mainProductInfo .priceProduct .plugin-preco .descricao-preco .valor-por { color: #43c6cc; font-size: 30px; font-weight: 600; } @media screen and (max-width: 720px) { body.product .mainProductInfo .priceProduct .plugin-preco .descricao-preco .valor-por { font-size: 1.125rem; } } body.product .mainProductInfo .priceProduct .plugin-preco .descricao-preco .valor-dividido { color: #3c3c3b; } @media screen and (max-width: 720px) { body.product .mainProductInfo .priceProduct .plugin-preco .descricao-preco .valor-dividido { font-size: 0.625rem; } } body.product .mainProductInfo .priceProduct .other-payment-method { position: relative; } body.product .mainProductInfo .priceProduct .other-payment-method .titulo-parcelamento, body.product .mainProductInfo .priceProduct .other-payment-method .see-other-payment-method-link { display: none; } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle { display: block; margin-top: -18px; text-align: right; position: relative; padding-right: 15px; margin-left: 230px; } @media screen and (max-width: 720px) { body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle { margin-top: -18px; } } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle span { color: #3c3c3b; font-size: 0.75rem; text-decoration: underline; cursor: pointer; } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle span:hover { color: #9a5bb3; } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle span:hover i { border-top: 5px solid #9a5bb3; } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle span.active { color: #9a5bb3; } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle span i { position: absolute; top: 7px; font-size: 0; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #3c3c3b; -webkit-transition: all 0.1s ease-in-out; /* Safari */ transition: all 0.1s ease-in-out; } body.product .mainProductInfo .priceProduct .other-payment-method .installmentToggle span i.active { transform: rotate(180deg); border-top: 5px solid #9a5bb3; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul { display: none; position: absolute; width: 240px; top: calc(100% + 10px); right: 0px; padding: 20px; background: #9a5bb3; z-index: 2; overflow: initial !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2); } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul:before { content: ""; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #9a5bb3; position: absolute; right: 25px; top: -7px; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul .close { position: absolute; right: 10px; top: 10px; color: white; font-size: 0.5rem; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul h6 { margin-bottom: 10px; color: white; font-size: 0.75rem; font-weight: 500; text-transform: uppercase; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul li { display: flex; color: white; font-size: 0.6875rem; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul li:not(:last-child) { margin-bottom: 5px; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul li.Express-à span.a-vista { margin-right: auto; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul li span { vertical-align: middle; } body.product .mainProductInfo .priceProduct .other-payment-method .other-payment-method-ul li strong { margin-left: auto; } body.product .mainProductInfo .buyProduct { padding: 30px 0; } body.product .mainProductInfo .buyProduct .buy-button { background: #9560a4; width: 50%; padding: 15px 5px; border: 0; font-weight: 600; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; } body.product .mainProductInfo .buyProduct .buy-button:hover { background: #9a5bb3; } body.product .mainProductInfo .buyProduct.comprar-com-lente .buyProductButton { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } body.product .mainProductInfo .buyProduct.comprar-com-lente .buy-button { width: calc(50% - 10px); } @media screen and (max-width: 1024px) { body.product .mainProductInfo .buyProduct.comprar-com-lente .buy-button { width: 100%; margin-bottom: 10px; } body.product .mainProductInfo .buyProduct.comprar-com-lente .buy-button.comprar-com-lente { order: 2; } } body.product .mainProductInfo .buyProduct.comprar-com-lente .portal-notify-me-ref { width: 100%; } body.product .mainProductInfo .buyProduct.comprar-com-lente .buyProductButton:after { display: none; } body.product .mainProductInfo .moreColors .similar ul { display: flex; margin-bottom: 15px; } body.product .shipping-badge { text-align: center; } @media screen and (min-width: 1024px) { body.product .shipping-badge { text-align: center; position: absolute; right: 0; top: 13vh; } body.product .shipping-badge img { width: 200px; } } body.product .mainProductInfo .shipping #popupCalculoFreteWrapper { display: none; } body.product .mainProductInfo .shipping #calculoFrete .header h1 { display: none; } body.product .mainProductInfo .shipping #calculoFrete .header .close { display: none; } body.product .mainProductInfo .shipping #calculoFrete .footer { display: none; } body.product .mainProductInfo .shipping #calculoFrete fieldset .prefixo { font-size: 0; width: 100%; max-width: 250px; min-width: 180px; } @media screen and (max-width: 1024px) { body.product .mainProductInfo .shipping #calculoFrete fieldset .prefixo { max-width: 210px; } } @media screen and (max-width: 375px) { body.product .mainProductInfo .shipping #calculoFrete fieldset .prefixo { max-width: 200px; } } body.product .mainProductInfo .shipping #calculoFrete fieldset .prefixo input { width: 100%; height: 30px; border: 0; border: 1px solid #43c6cc; padding: 10px; color: #989898; font-size: 14px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; font-family: "Montserrat", sans-serif; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; margin-left: 5px; } body.product .mainProductInfo .shipping #calculoFrete fieldset .quantity { display: none; } body.product .mainProductInfo .shipping #calculoFrete fieldset .frete-calcular { display: inline-block; vertical-align: top; } body.product .mainProductInfo .shipping #calculoFrete fieldset .frete-calcular input[type="button"] { padding: 0px 20px; height: 30px; background: #43c6cc; border: 1px solid #43c6cc; color: #fff; font-size: 10px; text-align: center; text-transform: uppercase; cursor: pointer; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 3px; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; } @media screen and (max-width: 720px) { body.product .mainProductInfo .shipping #calculoFrete fieldset .frete-calcular input[type="button"] { font-size: 9px; } } body.product .mainProductInfo .shipping #calculoFrete fieldset .frete-calcular input[type="button"]:hover { background: #9a5bb3; border: 1px solid #9a5bb3; color: #fff; } body.product .mainProductInfo .shipping #calculoFrete fieldset .cep-busca { display: block; width: 100%; margin: 5px 0; } body.product .mainProductInfo .shipping #calculoFrete fieldset .cep-busca a { color: #989898; font-size: 10px; text-decoration: underline; } body.product .mainProductInfo .shipping #calculoFrete .freight-values { position: relative; } body.product .mainProductInfo .shipping #calculoFrete .freight-values .close-shipping { position: absolute; right: 10px; top: 10px; font-size: 0.5rem; } body.product .mainProductInfo .shipping #calculoFrete .freight-values .close-shipping a { color: #3c3c3b; } body.product .mainProductInfo .shipping #calculoFrete .freight-values .cep-invalido { margin: 10px 0; font-size: 11px; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table { display: block; margin-top: 10px; border-collapse: collapse; padding: 20px 15px; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table thead { text-transform: uppercase; color: #9a5bb3; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table thead th { padding: 5px 10px; text-align: left; border-bottom: 1px solid #9a5bb3; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table thead th:first-child { width: 150px; font-size: 0; text-align: center; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table thead th:first-child:before { content: "Valor do frete"; display: block; font-size: 0.75rem; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table thead th:last-child { font-size: 0; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table thead th:last-child:before { content: "Prazo de envio"; display: block; font-size: 0.75rem; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table tbody tr td { padding: 15px 10px; vertical-align: middle; color: #989898; font-size: 0.75rem; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table tbody tr td:first-child { color: #3c3c3b; text-align: center; font-weight: 600; } body.product .mainProductInfo .shipping #calculoFrete .freight-values table tbody tr td:last-child { display: none; } body.product .mainProductInfo .advantageBox { padding: 20px 0; display: none; justify-content: flex-start; align-items: center; } body.product .mainProductInfo .advantageBox:after { display: none; } @media screen and (max-width: 1024px) { body.product .mainProductInfo .advantageBox { flex-direction: column; justify-self: center; } } body.product .mainProductInfo .advantageBox ul { display: inline-block; vertical-align: middle; width: 50%; margin-right: 15px; } @media screen and (max-width: 720px) { body.product .mainProductInfo .advantageBox ul { width: 100%; margin-right: 0; margin-bottom: 5px; } } body.product .mainProductInfo .advantageBox ul li { position: relative; float: left; width: 33.333%; text-align: center; cursor: pointer; } body.product .mainProductInfo .advantageBox ul li p.stage, body.product .mainProductInfo .advantageBox ul li p.hover { -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 10px 0; } body.product .mainProductInfo .advantageBox ul li .stage { width: 70px; height: 70px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; background: #f8f8f8; color: #c2c2c2; } body.product .mainProductInfo .advantageBox ul li .stage i { font-size: 20px; } body.product .mainProductInfo .advantageBox ul li .stage span { display: block; margin-top: 5px; font-size: 8px; text-transform: uppercase; } body.product .mainProductInfo .advantageBox ul li .hover { position: absolute; left: 0; top: 0; width: 70px; height: 70px; background: #989898; padding: 15px 0; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.product .mainProductInfo .advantageBox ul li .hover i { display: block; font-size: 14px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } body.product .mainProductInfo .advantageBox ul li .hover span { display: block; margin-top: 10px; font-size: 8px; text-transform: uppercase; } body.product .mainProductInfo .advantageBox ul li:hover .stage { opacity: 0; -moz-opacity: 0; filter: alpha(opacity=0); } body.product .mainProductInfo .advantageBox ul li:hover .hover { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); } body.product .mainProductInfo .advantageBox ul .troca p.hover { background: #9a5bb3; } body.product .mainProductInfo .advantageBox ul .troca p.hover i { color: #43c6cc; } body.product .mainProductInfo .advantageBox ul .troca p.hover span { color: #fff; } body.product .mainProductInfo .advantageBox ul .original p.hover { background: #ffd01e; } body.product .mainProductInfo .advantageBox ul .original p.hover i { color: #9a5bb3; } body.product .mainProductInfo .advantageBox ul .original p.hover span { color: #3c3c3b; } body.product .mainProductInfo .advantageBox ul .preco p.hover { background: #ff613b; } body.product .mainProductInfo .advantageBox ul .preco p.hover i { color: #3c3c3b; } body.product .mainProductInfo .advantageBox ul .preco p.hover span { color: #fff; } body.product .mainProductInfo .advantageBox .rules { display: inline-block; vertical-align: middle; color: #989898; font-size: 10px; text-transform: uppercase; } body.product .productBuyTogether { float: left; display: block; margin-right: 0.7633587786%; width: 83.2061068702%; margin-left: 8.3969465649%; float: none; margin-bottom: 150px; } body.product .productBuyTogether:last-child { margin-right: 0; } @media screen and (max-width: 1024px) { body.product .productBuyTogether { width: 100%; float: none; margin: 0; margin-bottom: 50px; } } @media screen and (max-width: 720px) { body.product .productBuyTogether { width: 100%; float: none; margin: 0; margin-bottom: 50px; } } body.product .productBuyTogether h4 { display: block; margin-bottom: 30px; color: #989898; font-size: 1.875rem; font-weight: 900; text-transform: uppercase; } @media screen and (max-width: 720px) { body.product .productBuyTogether h4 { font-size: 1.1875rem; } } body.product .productBuyTogether hr { display: none; opacity: 0; } body.product .productBuyTogether table { width: 100%; text-align: center; } body.product .productBuyTogether table td.itemA, body.product .productBuyTogether table td.itemB { max-width: 250px; } @media screen and (max-width: 1280px) { body.product .productBuyTogether table td.itemA, body.product .productBuyTogether table td.itemB { max-width: 200px; } } @media screen and (max-width: 1024px) { body.product .productBuyTogether table td.itemA, body.product .productBuyTogether table td.itemB { max-width: 150px; } } @media screen and (max-width: 720px) { body.product .productBuyTogether table td.itemA, body.product .productBuyTogether table td.itemB { max-width: 120px; } } body.product .productBuyTogether table td.plus { font-size: 0; vertical-align: middle; margin: 0 auto; } body.product .productBuyTogether table td.plus:before { content: ""; background-image: url("/arquivos/+.png"); background-size: 100% 100%; display: block; width: 80px; height: 80px; } @media screen and (max-width: 1024px) { body.product .productBuyTogether table td.plus:before { width: 70px; height: 70px; } } @media screen and (max-width: 720px) { body.product .productBuyTogether table td.plus:before { width: 35px; height: 35px; margin: 0 auto; } } body.product .productBuyTogether table td.equal { font-size: 0; vertical-align: middle; margin: 0 auto; } body.product .productBuyTogether table td.equal:before { content: ""; background-image: url("/arquivos/=.png"); background-size: 100% 100%; display: block; width: 80px; height: 80px; } @media screen and (max-width: 1024px) { body.product .productBuyTogether table td.equal:before { width: 70px; height: 70px; } } @media screen and (max-width: 720px) { body.product .productBuyTogether table td.equal:before { width: 35px; height: 35px; margin: 0 auto; } } body.product .productBuyTogether table td.buy { vertical-align: middle; min-width: 230px; color: #43c6cc; padding: 10px; } body.product .productBuyTogether table td.buy:before { content: "COMPRE JUNTO POR"; font-size: 15px; color: #989898; display: block; font-weight: bold; margin-bottom: 30px; } body.product .productBuyTogether table td.buy .comprar-junto { margin-top: 20px; background: #43c6cc; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; } body.product .productBuyTogether table td.buy .comprar-junto:hover { background: rgba(67, 198, 204, 0.8); } body.product .productBuyTogether table td.buy .comprar-junto a { color: white; font-size: 0.9375rem; } @media screen and (max-width: 720px) { body.product .productBuyTogether table td.buy .comprar-junto a { font-size: 0.8125rem; } } body.product .productBuyTogether table td.buy p.more { display: none; opacity: 0; } body.product .productBuyTogether table img { height: 250px; width: 250px; } @media screen and (max-width: 1280px) { body.product .productBuyTogether table img { width: 200px; height: 200px; } } @media screen and (max-width: 1024px) { body.product .productBuyTogether table img { width: 150px; height: 150px; } } @media screen and (max-width: 720px) { body.product .productBuyTogether table img { width: 120px; height: 120px; } } body.product .productBuyTogether table h3 a { color: #3c3c3b; font-size: 14px; } @media screen and (max-width: 720px) { body.product .productBuyTogether table h3 a { font-size: 11px; } } body.product .productDetails { float: left; display: block; margin-right: 0.7633587786%; width: 83.2061068702%; margin-left: 8.3969465649%; float: none; margin-bottom: 80px; margin-top: 80px; } body.product .productDetails:last-child { margin-right: 0; } @media screen and (max-width: 1024px) { body.product .productDetails { width: 100%; float: none; margin: 0; margin-bottom: 50px; } } body.product .productDetails h6 { display: none; margin-bottom: 30px; color: #989898; font-size: 1.875rem; font-weight: 900; text-transform: uppercase; } @media screen and (max-width: 720px) { body.product .productDetails h6 { font-size: 1.1875rem; } } body.product .productDetails .productDescription { color: #989898; } body.product .shelfCarousel .shelf>ul { position: relative; } @media screen and (max-width: 720px) { body.product .shelfCarousel .shelf h2 { font-size: 1.1875rem; text-align: left; margin: 0; } } .x-large-Carousel { width: 60%; } @media screen and (max-width: 1024px) { .x-large-Carousel { width: 80%; } } body.product .notifyme-title { font-size: 0; text-align: center; } body.product .notifyme-title:before { content: "ESSE PRODUTO ESTÁ INDISPONÍVEL"; font-size: 1.3125rem; color: #9a5bb3; text-transform: uppercase; } body.product .notifyme-form p { font-size: 0; text-align: center; max-width: 400px; margin: 10px auto; } body.product .notifyme-form p:before { content: "Preencha os campos abaixo para ser avisado quando esta peça voltar ao estoque."; font-size: 0.875rem; color: #989898; text-transform: uppercase; } body.product .notifyme-client-name, body.product .notifyme-client-email { width: 100%; border-radius: 30px; padding: 15px; border: 1px solid #c8c8c8; color: #c8c8c8; margin-bottom: 10px; } body.product .notifyme-client-name::placeholder, body.product .notifyme-client-email::placeholder { color: #c8c8c8; } body.product .notifyme-button-ok { background: #9a5bb3; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; margin: 0 auto 10px; display: block !important; font-weight: 500; } body.product .notifyme-button-ok:hover { background: rgba(154, 91, 179, 0.8); } body.product .notifyme-error { color: #989898; } body.product .notifyme-loading-message, body.product .notifyme-success { color: #989898; display: block; text-align: center; text-transform: uppercase; font-size: 0.875rem; margin: 10px 0; } @media screen and (max-width: 1024px) { body.product .notifyme-title:before { font-size: 1rem; } body.product .notifyme-form p:before { font-size: 0.75rem; } body.product .notifyme-loading-message, body.product .notifyme-success, body.product .notifyme-error { font-size: 0.75rem; } } body.product.unavailable .buy-button.comprar-com-lente { display: none !important; } /* ========================================================================== Catalog ========================================================================== */ body.catalog .topBanner a { display: block; line-height: 0; } body.catalog .topBanner img { width: 100%; height: auto; } body.catalog .navBar { background-color: #f2f2f2; } body.catalog .searchDisplay { margin-bottom: 1px; } body.catalog .searchDisplay p { text-align: center; } body.catalog .searchDisplay p.search-string { margin-bottom: 10px; color: #3c3c3b; font-size: 1.25rem; } body.catalog .searchDisplay p.search-string span { font-size: 1.5625rem; text-transform: uppercase; color: #9a5bb3; } body.catalog .searchDisplay p.number-result { color: #989898; font-size: 0.9375rem; } body.catalog .searchDisplay p.number-result span { color: #9a5bb3; } @media screen and (max-width: 1024px) { body.catalog .searchDisplay { margin: 10px 0 20px; } body.catalog .searchDisplay p.search-string { font-size: 0.875rem; margin-bottom: 5px; } body.catalog .searchDisplay p.search-string span { font-size: 1.125rem; } body.catalog .searchDisplay p.number-result { color: #989898; font-size: 0.875rem; } } @media screen and (max-width: 720px) { body.catalog .searchDisplay p.search-string { font-size: 0.75rem; } body.catalog .searchDisplay p.search-string span { font-size: 1rem; display: block; } body.catalog .searchDisplay p.number-result { color: #989898; font-size: 0.75rem; } } body.catalog .navBar { display: flex; justify-content: space-between; align-items: center; } body.catalog .navBar:after { display: none; } @media screen and (max-width: 1024px) { body.catalog .navBar { display: flex !important; width: 100%; } } body.catalog .navBar.floatNavBar { justify-content: space-around; position: fixed; top: 145px; z-index: 999; width: 100%; background-color: #f8f8f8; left: 0; -webkit-transition: all 0.4s ease-out; /* Safari */ transition: all 0.4s ease-out; z-index: 999; padding: 8px 0; } body.catalog .navBar.floatNavBar .navTopbar { flex: none; } body.catalog .navBar.floatNavBar .shelfInteraction { display: none; } @media screen and (max-width: 1024px) { body.catalog .navBar.floatNavBar { display: none !important; } } body.catalog .navTopbar { display: flex; flex: 1; align-content: center; padding: 1em; } body.catalog .navTopbar .navTopbarHead { display: none; } body.catalog .navTopbar .menu-navegue { display: none; } body.catalog .navTopbar .filterChoosed { display: none; } @media screen and (max-width: 1024px) { body.catalog .navTopbar { display: block; flex: initial; position: fixed; background: white; width: 310px; top: 0; left: -320px; height: 100vh; overflow-y: auto; margin: 0; z-index: 10; -webkit-transition: all 0.5s ease-in-out; /* Safari */ transition: all 0.5s ease-in-out; } body.catalog .navTopbar .navTopbarHead { display: flex; align-items: center; font-size: 0.75rem; padding: 20px; width: 100%; border-bottom: 1px solid #efefef; } body.catalog .navTopbar .navTopbarHead p { flex: 1; color: #9a5bb3; } body.catalog .navTopbar .navTopbarHead i { display: block; cursor: pointer; } body.catalog .navTopbar.open { left: 0; z-index: 9999; } body.catalog .navTopbar .filterChoosed { display: flex; position: absolute; bottom: 0; left: 0; width: 100%; } body.catalog .navTopbar .filterChoosed a { display: none; width: 50%; padding: 10px; color: #3c3c3b; font-size: 12px; font-weight: bold; text-align: center; text-transform: uppercase; cursor: pointer; background: white; border: 1px solid #3c3c3b; border-radius: 25px; margin: 5px; } body.catalog .navTopbar .filterChoosed a i { display: none; } body.catalog .navTopbar .filterChoosed .filter { display: none !important; } body.catalog .navTopbar .filterChoosed .filter+a { display: block; } body.catalog .navTopbar .filterChoosed .filter+a+a { display: block; } } body.catalog .search-multiple-navigator { display: flex; justify-content: space-between; align-content: center; position: relative; z-index: 1; } body.catalog .search-multiple-navigator>h3, body.catalog .search-multiple-navigator>h4, body.catalog .search-multiple-navigator .bt-refinar { display: none; } @media screen and (max-width: 1024px) { body.catalog .search-multiple-navigator { display: block; } } body.catalog .search-single-navigator { position: relative; z-index: 1; } body.catalog .filterOptions fieldset { display: block; position: relative; margin-right: 10px; padding: 0 20px 0 5px; font-weight: bold; font-size: 22px; color: #828282; } body.catalog .filterOptions fieldset.active { border: none; background-color: #f8f8f8; } @media screen and (max-width: 1024px) { body.catalog .filterOptions fieldset.active { background-color: transparent; } } body.catalog .filterOptions fieldset.active h5 { color: #43c6cc; } body.catalog .filterOptions fieldset.active h5:before { font-size: 0.5rem; font-weight: bold; -webkit-transition: all 0.3s ease-in-out; /* Safari */ transition: all 0.3s ease-in-out; } body.catalog .filterOptions fieldset a { color: #3c3c3b; } body.catalog .filterOptions fieldset h5 { display: flex; width: 100%; color: #828282; font-size: 0.6875rem; text-transform: uppercase; cursor: pointer; line-height: 30px; min-width: 100px; } body.catalog .filterOptions fieldset h5:before { order: 2; font-family: "optoculosfonticon" !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #43c6cc; font-size: 0.375rem; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; line-height: 30px; position: absolute; right: 5px; } body.catalog .filterOptions fieldset>div { display: none; width: 100%; padding: 10px 0; background: #f8f8f8; border-top: 0; position: absolute; top: 30px; left: 0; padding: 10px; } body.catalog .filterOptions fieldset a { display: block; margin: 5px 0; color: #3c3c3b; font-size: 0.6875rem; text-transform: uppercase; } body.catalog .filterOptions fieldset label { position: relative; display: block; margin: 10px 0; padding-left: 25px; color: #3c3c3b; font-size: 0.6875rem; cursor: pointer; text-transform: uppercase; } body.catalog .filterOptions fieldset label:before { font-family: "optoculosfonticon" !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position: absolute; display: block; top: -2px; left: 0; width: 18px; height: 18px; background: white; border: 1px solid #c8c8c8; font-size: 0; text-align: center; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.catalog .filterOptions fieldset label input { display: none; } body.catalog .filterOptions fieldset label.sr_selected { color: #3c3c3b; } body.catalog .filterOptions fieldset label.sr_selected:before { background: #9a5bb3; color: white; font-size: 6px; line-height: 16px; } body.catalog .filterOptions fieldset.filtro_cor { width: 80px; } body.catalog .filterOptions fieldset.filtro_cor label { display: inline-block; vertical-align: middle; width: 12px; height: 12px; border: 1px solid #c8c8c8; font-size: 0; margin-top: 5px; margin-bottom: 0px; margin-left: 0; padding-left: 0; } body.catalog .filterOptions fieldset.filtro_cor label:before { display: none !important; } body.catalog .filterOptions fieldset.filtro_cor label:not(:last-child) { margin-right: 5px; } body.catalog .filterOptions fieldset.filtro_cor label.sr_selected { border-color: #3c3c3b; } body.catalog .filterOptions fieldset.filtro_icones-descritivos { display: none; } @media screen and (max-width: 1024px) { body.catalog .filterOptions .navigation { width: 100% !important; } body.catalog .filterOptions fieldset { width: 100%; margin-right: 0px; padding: 0; border: none; } body.catalog .filterOptions fieldset.filtro_cor { width: 100%; } body.catalog .filterOptions fieldset h5 { justify-content: space-between; padding: 10px 20px; } body.catalog .filterOptions fieldset h5:before { right: 15px; } body.catalog .filterOptions fieldset>div { position: initial; padding: 10px 20px; background: #f8f8f8; -moz-box-shadow: inset 0 8px 13px -4px rgba(0, 0, 0, 0.05); -webkit-box-shadow: inset 0 8px 13px -4px rgba(0, 0, 0, 0.05); box-shadow: inset 0 8px 13px -4px rgba(0, 0, 0, 0.05); } body.catalog .filterOptions fieldset a { display: block; margin: 10px 0; color: #c8c8c8; font-size: 0.75rem; } body.catalog .filterOptions fieldset.filtro_cor label { width: 20px; height: 20px; } } body.catalog .filterMobileToggle { display: none; } @media screen and (max-width: 1024px) { body.catalog .filterMobileToggle { display: flex; border: 1px solid #c8c8c8; align-items: center; line-height: 30px; padding: 0 10px; } body.catalog .filterMobileToggle a { color: #3c3c3b; font-size: 0.6875rem; text-transform: uppercase; } body.catalog .filterMobileToggle i { color: #43c6cc; font-size: 0.375rem; margin-left: 15px; } } body.catalog .catalog-options { width: 180px; margin-left: 20px; } body.catalog .catalog-options .orderby-toggle { position: relative; border: 1px solid #c8c8c8; } body.catalog .catalog-options .orderby-toggle a { display: table; width: 100%; text-transform: uppercase; cursor: pointer; line-height: 30px; padding: 0 10px; } body.catalog .catalog-options .orderby-toggle a span { display: table-cell; width: 100%; color: #3c3c3b; font-size: 0.6875rem; text-transform: uppercase; } body.catalog .catalog-options .orderby-toggle a em { display: none; } body.catalog .catalog-options .orderby-toggle a i { display: table-cell; vertical-align: middle; color: #43c6cc; font-size: 0.375rem; transform: rotate(90deg); } body.catalog .catalog-options .orderby-toggle a .ico-close, body.catalog .catalog-options .orderby-toggle a .filterOptions fieldset.active h5, body.catalog .filterOptions fieldset.active .catalog-options .orderby-toggle a h5 { display: none; font-size: 0.5rem; } body.catalog .catalog-options .orderby-toggle.active { border: none; background-color: #f8f8f8; } body.catalog .catalog-options .orderby-toggle.active a span { color: #43c6cc; } body.catalog .catalog-options .orderby-toggle.active .orderby-lightbox { display: block; } body.catalog .catalog-options .orderby-toggle.active .ico-close, body.catalog .catalog-options .orderby-toggle.active .filterOptions fieldset.active h5, body.catalog .filterOptions fieldset.active .catalog-options .orderby-toggle.active h5 { display: table-cell; } body.catalog .catalog-options .orderby-toggle.active .ico-arrow, body.catalog .catalog-options .orderby-toggle.active .filterOptions fieldset h5, body.catalog .filterOptions fieldset .catalog-options .orderby-toggle.active h5 { display: none; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox { display: none; position: absolute; width: 100%; top: 30px; left: 0; z-index: 5; padding: 0; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content { position: relative; background: #f8f8f8; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content-head { display: none; color: #3c3c3b; font-size: 12px; padding: 5px 10px; border-bottom: 1px solid #e0e0e0; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content-body a { color: #3c3c3b; font-size: 11px; padding: 0 10px; text-transform: uppercase; cursor: pointer; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content-body a:hover { text-decoration: underline; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content-body a.active { color: #3c3c3b; text-decoration: underline; } @media screen and (max-width: 1024px) { body.catalog .catalog-options { position: relative; width: 300px; } body.catalog .catalog-options .orderby-toggle { position: initial; margin-right: 0px; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox { display: none; position: absolute; width: 100%; top: 100%; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } body.catalog .catalog-options .orderby-toggle .orderby-lightbox-content-body { text-align: left; } } @media screen and (max-width: 720px) { body.catalog .catalog-options { display: none; width: 100%; margin: 0; border: none; } body.catalog .catalog-options .orderby-toggle { border: none; } body.catalog .catalog-options .orderby-toggle a { padding: 5px 15px 5px 20px; } body.catalog .catalog-options .orderby-lightbox-content-body { padding: 10px; } } body.catalog .shelfInteraction { display: flex; align-items: center; } body.catalog .shelfInteraction .selectView { width: 90px; } body.catalog .shelfInteraction .selectView-title { font-size: 0.6875rem; margin-right: 10px; } @media screen and (max-width: 720px) { body.catalog .shelfInteraction .selectView-title { display: none; } } body.catalog .shelfInteraction .device { justify-content: space-between; align-items: center; } body.catalog .shelfInteraction .device.desktop { display: flex; } body.catalog .shelfInteraction .device.tablet { display: none; } body.catalog .shelfInteraction .device.mobile { display: none; } body.catalog .shelfInteraction .device:after { display: none; } body.catalog .shelfInteraction .device span { font-size: 0.9375rem; color: #e0e0e0; line-height: 1; cursor: pointer; } body.catalog .shelfInteraction .device span.smallView { margin-right: 5px; } body.catalog .shelfInteraction .device span.active i { color: #43c6cc; } @media screen and (max-width: 1024px) { body.catalog .shelfInteraction .device { justify-content: initial; text-align: center; padding: 10px 0; } body.catalog .shelfInteraction .device span { margin: 0 10px; font-size: 1rem; } body.catalog .shelfInteraction .device.desktop { display: none; } body.catalog .shelfInteraction .device.tablet { display: block; } body.catalog .shelfInteraction .device.mobile { display: none; } } @media screen and (max-width: 720px) { body.catalog .shelfInteraction .device.desktop { display: none; } body.catalog .shelfInteraction .device.tablet { display: none; } body.catalog .shelfInteraction .device.mobile { display: block; } } @media screen and (max-width: 1024px) { body.catalog .shelfInteraction { width: 100%; justify-content: flex-end; } } body.catalog .pageContent { display: block; width: 100%; clear: both; position: relative; z-index: 0; } body.catalog .pageContent #pageContent_title, body.catalog .pageContent .searchResultsTime, body.catalog .pageContent .sub, body.catalog .pageContent .pager { display: none !important; } body.catalog .pageContent .filterChoosed { margin: 20px 0; display: flex; align-items: center; } body.catalog .pageContent .filterChoosed .filter { color: #989898; margin-right: 10px; font-size: 0.6875rem; font-weight: 400; cursor: pointer; } body.catalog .pageContent .filterChoosed .filter+.btnClean { display: inline-block; } body.catalog .pageContent .filterChoosed .filter i { font-size: 0.4375rem; color: #3c3c3b; font-weight: bold; padding: 0 5px; } body.catalog .pageContent .filterChoosed .btnClean { display: none; padding: 5px 8px; color: #3c3c3b; font-size: 0.5625rem; font-weight: 400; text-transform: uppercase; cursor: pointer; border: 1px solid #3c3c3b; border-radius: 12.5px; } @media screen and (max-width: 1024px) { body.catalog .pageContent .filterChoosed { display: none; } } body.catalog .pageContent .main { max-width: 1600px; margin-left: auto; margin-right: auto; padding-top: 20px; } @media screen and (max-width: 720px) { body.catalog .pageContent .main { padding-top: 0px; } .productList[id^="ResultItems"]>.shelf.productList { padding-top: 0px; } } body.catalog .pageContent .main::after { clear: both; content: ""; display: table; } body.catalog #scrollLoading { display: table; margin: auto; } body.catalog .btn-load-more { background: transparent; width: 100%; padding: 15px 5px; border: 0; color: #9a5bb3; border: 1px solid #9a5bb3; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; width: 100%; max-width: 320px; margin: 30px auto; font-size: 0; } body.catalog .btn-load-more:hover { background: rgba(154, 91, 179, 0.8); color: white; } body.catalog .btn-load-more:before { content: "VER MAIS PRODUTOS"; font-size: 0.75rem; font-weight: bold; } body.catalog.department .bread-crumb { display: none; } @media screen and (max-width: 1024px) { body.catalog.department #pageContent_title { text-align: center; padding: 25px 0; font-size: 1.25rem; color: #989898; text-transform: uppercase; font-weight: 100; background-color: #f8f8f8; letter-spacing: 1px; } } body.department .topBanner img { width: 100%; height: auto; } .productList[id^="ResultItems"]>.shelf.productList { padding-top: 10px; } .productList[id^="ResultItems"][view-grid="large"] { float: left; display: block; margin-right: 0.7633587786%; width: 100%; } .productList[id^="ResultItems"][view-grid="large"]:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li { display: inline-block; vertical-align: top; margin-right: 0.7633587786%; width: 16.0305343511%; margin-bottom: 40px; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li .flagGroup .flagDiscount.active, .productList[id^="ResultItems"][view-grid="large"] .shelf ul li .flagGroup-highlight .flag { width: 90px; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:nth-child(6n) { margin-right: 0; } @media screen and (max-width: 1024px) { .productList[id^="ResultItems"][view-grid="large"] { float: left; display: block; margin-right: 1.1494252874%; width: 100%; margin-left: 0%; } .productList[id^="ResultItems"][view-grid="large"]:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li { float: left; display: block; margin-right: 1.1494252874%; width: 31.724137931%; margin-left: 0%; margin-bottom: 40px; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:nth-child(3n) { margin-right: 0; } } @media screen and (max-width: 720px) { .productList[id^="ResultItems"][view-grid="large"] { float: left; display: block; margin-right: 2.3255813953%; width: 100%; margin-left: 0%; } .productList[id^="ResultItems"][view-grid="large"]:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li { float: left; display: block; /*margin-right: 2.3255813953%; width: 48.8372093023%;*/ margin-right: 0px; width: 100%; margin-left: 0%; margin-bottom: 40px; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li .flagGroup { display: none; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:nth-child(3n+1) { margin-left: 0%; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:nth-child(3n) { float: left; display: block; /*margin-right: 2.3255813953%; width: 48.8372093023%;*/ margin-right: 0px; width: 100%; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:nth-child(3n):last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="large"] .shelf ul li:nth-child(2n) { margin-right: 0; } } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li { /*float: left;*/ display: inline-block; vertical-align: top; margin-right: 0.7633587786%; /*width: 24.427480916%;*/ margin-bottom: 40px; width: 32.82%; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li:nth-child(3n) { margin-right: 0; } @media screen and (max-width: 1024px) { .productList[id^="ResultItems"][view-grid="small"] { float: left; display: block; margin-right: 1.1494252874%; width: 100%; margin-left: 0%; } .productList[id^="ResultItems"][view-grid="small"]:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li { float: left; display: block; margin-right: 1.1494252874%; width: 49.4252873563%; margin-left: 0%; margin-bottom: 40px; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li:nth-child(2n) { margin-right: 0; } } @media screen and (max-width: 720px) { .productList[id^="ResultItems"][view-grid="small"] .shelf ul li { float: left; display: block; margin-right: 2.3255813953%; width: 100%; margin-left: 0%; margin-bottom: 40px; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li:last-child { margin-right: 0; } .productList[id^="ResultItems"][view-grid="small"] .shelf ul li:nth-child(1n) { margin-right: 0; } } body.emptySearch .box-emptySearch-content { display: flex; flex-direction: column; align-items: center; justify-content: center; background-image: url("/arquivos/optoculos-bg-emptySearch.png"); background-repeat: no-repeat; background-position: center; background-size: contain; min-height: 624px; margin: 30px 0; /* display: block; */ /* width: 100%; */ } body.emptySearch .box-emptySearch-content .termBox { text-align: center; margin-bottom: 30px; } body.emptySearch .box-emptySearch-content .termBox h3 { text-transform: uppercase; color: #9a5bb3; font-size: 1.9375rem; font-weight: 700; margin: 0 auto; width: 75%; margin-bottom: 10px; } body.emptySearch .box-emptySearch-content .termBox p { color: #3c3c3b; font-size: 1.25rem; } body.emptySearch .box-emptySearch-content .termBox p em, body.emptySearch .box-emptySearch-content .termBox p span { color: #43c6cc; font-weight: 700; } body.emptySearch .box-emptySearch-content .tipsBox { color: #989898; font-size: 0.875rem; } body.emptySearch .box-emptySearch-content .tipsBox ul li { margin-bottom: 10px; position: relative; } body.emptySearch .box-emptySearch-content .tipsBox ul li:before { content: ""; display: inline-block; vertical-align: middle; width: 4px; height: 4px; background: #9a5bb3; border-radius: 50%; position: absolute; left: -10px; top: 7px; } @media screen and (max-width: 1024px) { body.emptySearch .box-emptySearch-content { margin: 20px 0; min-height: 524px; } body.emptySearch .box-emptySearch-content .termBox h3 { font-size: 1.75rem; } body.emptySearch .box-emptySearch-content .termBox p { font-size: 1.125rem; } body.emptySearch .box-emptySearch-content .tipsBox { font-size: 0.8125rem; } } @media screen and (max-width: 720px) { body.emptySearch .box-emptySearch-content { min-height: 324px; background-size: cover; } body.emptySearch .box-emptySearch-content .termBox { margin-bottom: 10px; } body.emptySearch .box-emptySearch-content .termBox h3 { font-size: 1.1875rem; width: 95%; } body.emptySearch .box-emptySearch-content .termBox p { font-size: 0.875rem; } body.emptySearch .box-emptySearch-content .tipsBox { font-size: 0.625rem; } } .filtro_cor label[title="Amarelo"] { background-color: #ffd700; } .filtro_cor label[title="Azul"] { background-color: #0000ff; } .filtro_cor label[title="Vermelho"] { background-color: #ff0000; } .filtro_cor label[title="Preto"] { background-color: #000000; } .filtro_cor label[title="Branco"] { background-color: #ffffff; } .filtro_cor label[title="Verde"] { background-color: #008000; } .filtro_cor label[title="Laranja"] { background-color: #ffa500; } .filtro_cor label[title="Rosa"] { background-color: #ff1493; } .filtro_cor label[title="Cinza"] { background-color: #a9a9a9; } .filtro_cor label[title="Roxo"] { background-color: #ba55d3; } .filtro_cor label[title*="Hologr"] { background-color: #dcdcdc; } .filtro_cor label[title="Kraft"] { background-color: #deb887; } .filtro_cor label[title="Amarelo"] { background-color: #ffff00; } .filtro_cor label[title="Azul"] { background-color: #1e90ff; } .filtro_cor label[title="Vermelho"] { background-color: #ff0000; } .filtro_cor label[title="Verde"] { background-color: #3cb371; } .filtro_cor label[title="Laranja"] { background-color: #ff7f50; } .filtro_cor label[title="Marrom"] { background-color: #a0522d; } body.page-error #mainContent { padding: 70px 0; } body.page-error #mainContent .wrapper, body.page-error #mainContent .pageNav .menu-departamento .submenu .submenuWrap, .pageNav .menu-departamento .submenu body.page-error #mainContent .submenuWrap { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } @media screen and (max-width: 720px) { body.page-error #mainContent .wrapper, body.page-error #mainContent .pageNav .menu-departamento .submenu .submenuWrap, .pageNav .menu-departamento .submenu body.page-error #mainContent .submenuWrap { display: block; } } body.page-error .errorMsg { width: 480px; text-align: center; } body.page-error .errorMsg .bigSignal { font-size: 13.125rem; line-height: 1; } body.page-error .errorMsg p { font-size: 1rem; letter-spacing: 2px; text-transform: uppercase; } body.page-error .errorMsg p strong { font-weight: 600; } @media screen and (max-width: 720px) { body.page-error .errorMsg { width: 100%; margin-bottom: 20px; } body.page-error .errorMsg .bigSignal { font-size: 9.375rem; } body.page-error .errorMsg p { font-size: 0.875rem; } } body.page-error .errorTips li { color: #c8c8c8; } body.page-error .errorTips li:before { content: "\2022"; display: inline-block; vertical-align: middle; margin-right: 5px; color: #f26304; font-size: 20px; } body.page-error .errorTips a { display: table; padding: 15px 5px; margin-top: 25px; width: 100%; max-width: 300px; letter-spacing: 2px; -moz-box-shadow: inset 0 0 0 1px #000; -webkit-box-shadow: inset 0 0 0 1px #000; box-shadow: inset 0 0 0 1px #000; } @media screen and (max-width: 720px) { body.page-error .errorTips { text-align: center; } body.page-error .errorTips a { margin: 25px auto; } } body.colection .catalog-options { display: none; } /* ========================================================================== Institutional - Esqueleto ========================================================================== */ body.institutional #mainContent .wrapper, body.institutional #mainContent .pageNav .menu-departamento .submenu .submenuWrap, .pageNav .menu-departamento .submenu body.institutional #mainContent .submenuWrap { max-width: 1060px; } body.institutional .navSidebar { float: left; display: block; margin-right: 1.1494252874%; width: 24.1379310345%; } body.institutional .navSidebar:last-child { margin-right: 0; } body.institutional .pageContent { float: left; display: block; margin-right: 1.1494252874%; width: 69.6551724138%; margin-left: 5.0574712644%; } body.institutional .pageContent:last-child { margin-right: 0; } @media screen and (max-width: 720px) { body.institutional .navSidebar { width: 100%; float: none; } body.institutional .pageContent { width: 100%; float: none; margin-left: 0%; } } /* ========================================================================== Institutional - Customização ========================================================================== */ body.institutional { /* ========================================================================== A MARCA ========================================================================== */ } body.institutional .titulo-sessao { display: block; padding: 80px 0; color: #43c6cc; font-size: 5rem; font-weight: 900; text-transform: uppercase; text-align: center; } @media screen and (max-width: 1024px) { body.institutional .titulo-sessao { padding: 60px 0; font-size: 4.0625rem; } } @media screen and (max-width: 720px) { body.institutional .titulo-sessao { padding: 30px 0; font-size: 1.875rem; } } body.institutional h3.selected { display: none; background: #9a5bb3; border: 0; padding: 10px 15px; color: white; font-size: 1rem; text-align: center; text-transform: uppercase; font-weight: 700; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; border-radius: 50px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.institutional h3.selected i { display: inline-block; vertical-align: middle; float: right; margin-top: 6px; font-size: 0.5rem; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } body.institutional .navSidebar ul { clear: both; } body.institutional .navSidebar a.close { display: none; } body.institutional .navSidebar li { display: block; margin-bottom: 10px; } body.institutional .navSidebar li a { display: block; width: 100%; padding: 10px 0; border: 1px solid #9a5bb3; background: #fff; color: #9a5bb3; font-size: 1rem; font-weight: 700; text-align: center; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; border-radius: 50px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.institutional .navSidebar li a.current { background: #9a5bb3; color: #fff; } body.institutional .navSidebar li a:hover { opacity: 0.8; -moz-opacity: 0.8; filter: alpha(opacity=80); } body.institutional .pageContent h2 { padding-bottom: 10px; margin-bottom: 15px; /* border-bottom: 1px solid #3c3c3b; */ font-size: 1.25rem; font-weight: 600; text-transform: uppercase; } body.institutional .pageContent article { margin: 20px 0 10px; } body.institutional .pageContent article h5 { margin-bottom: 5px; font-weight: 600; text-transform: uppercase; } body.institutional .pageContent article h6 { color: #43c6cc; font-weight: 600; text-transform: uppercase; } body.institutional .pageContent article p, body.institutional .pageContent article ul { margin-bottom: 10px; color: #989898; line-height: 1.5; } body.institutional .pageContent article strong { font-weight: 700; } body.institutional .pageContent article ul { padding-left: 5px; } body.institutional .pageContent article li { position: relative; padding-left: 15px; margin-bottom: 10px; } body.institutional .pageContent article li:before { content: ""; display: block; position: absolute; top: 5px; left: 0; width: 6px; height: 6px; background: #43c6cc; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } body.institutional .pageContent form { /* Firefox 18- */ /* Firefox 18- */ /* Firefox 19+ */ /* Firefox 19+ */ } body.institutional .pageContent form.hide { display: none; } body.institutional .pageContent form label { display: block; margin-bottom: 10px; color: #989898; font-family: "Montserrat", sans-serif; font-size: 0.8125rem; line-height: 1; } body.institutional .pageContent form label.radio { color: #989898; } body.institutional .pageContent form input[type="text"], body.institutional .pageContent form textarea, body.institutional .pageContent form input[type="email"], body.institutional .pageContent form input[type="date"] { display: block; width: 100%; margin-bottom: 15px; border: 1px solid #c8c8c8; color: #3c3c3b; font-size: 1rem; font-family: "Montserrat", sans-serif; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.institutional .pageContent form input[type="text"]:active, body.institutional .pageContent form input[type="text"]:focus, body.institutional .pageContent form textarea:active, body.institutional .pageContent form textarea:focus, body.institutional .pageContent form input[type="email"]:active, body.institutional .pageContent form input[type="email"]:focus, body.institutional .pageContent form input[type="date"]:active, body.institutional .pageContent form input[type="date"]:focus { border: 1px solid #0dd0ae; color: #0dd0ae; } body.institutional .pageContent form input[type="text"].error, body.institutional .pageContent form textarea.error, body.institutional .pageContent form input[type="email"].error, body.institutional .pageContent form input[type="date"].error { border: 1px solid #ff613b; } body.institutional .pageContent form input[type="text"].error:active, body.institutional .pageContent form input[type="text"].error:focus, body.institutional .pageContent form textarea.error:active, body.institutional .pageContent form textarea.error:focus, body.institutional .pageContent form input[type="email"].error:active, body.institutional .pageContent form input[type="email"].error:focus, body.institutional .pageContent form input[type="date"].error:active, body.institutional .pageContent form input[type="date"].error:focus { border: 1px solid #0dd0ae; } body.institutional .pageContent form input[type="text"], body.institutional .pageContent form input[type="date"], body.institutional .pageContent form input[type="email"] { height: 40px; padding: 0px 15px; } body.institutional .pageContent form input[type="radio"] { display: inline-block; vertical-align: middle; margin-right: 5px; margin-bottom: 8px; } body.institutional .pageContent form input[type="radio"]+label { display: inline-block; vertical-align: middle; margin-right: 15px; } body.institutional .pageContent form textarea { padding: 20px; min-height: 150px; resize: none; } body.institutional .pageContent form select { display: block; width: 100%; height: 40px; padding: 0 10px; margin-bottom: 10px; border: 1px solid #c8c8c8; color: #3c3c3b; font-size: 1rem; font-family: "Montserrat", sans-serif; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.institutional .pageContent form select:active, body.institutional .pageContent form select:focus { border: 1px solid #0dd0ae; color: #0dd0ae; } body.institutional .pageContent form select.error { border: 1px solid #ff613b; } body.institutional .pageContent form select.error:active, body.institutional .pageContent form select.error:focus { border: 1px solid #0dd0ae; } body.institutional .pageContent form input[type="checkbox"]+label { display: inline-block; vertical-align: middle; margin-top: 3px; margin-left: 3px; font-size: 0.75rem; } body.institutional .pageContent form input[type="text"]::-webkit-input-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="password"]::-webkit-input-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="text"]:-moz-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="password"]:-moz-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="text"]::-moz-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="password"]::-moz-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="text"]:-ms-input-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form input[type="password"]:-ms-input-placeholder { color: #989898; font-weight: 300; } body.institutional .pageContent form h3 { padding: 20px 0 10px; font-weight: 600; text-transform: uppercase; } body.institutional .pageContent form .row { clear: both; } body.institutional .pageContent form .col { float: left; display: block; margin-right: 1.5384615385%; width: 49.2307692308%; } body.institutional .pageContent form .col:last-child { margin-right: 0; } body.institutional .pageContent form #submit { background: #9a5bb3; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; float: right; max-width: 320px; } body.institutional .pageContent form #submit:hover { background: rgba(154, 91, 179, 0.8); } @media screen and (max-width: 720px) { body.institutional .pageContent form #submit { max-width: 100%; } } @media screen and (max-width: 720px) { body.institutional .pageContent form .col { width: 100%; margin-left: 0; margin-right: 0; } } body.institutional .pageContent p.success { max-width: 400px; padding: 40px 20px; margin: auto; margin-top: 40px; font-size: 1rem; color: #989898; text-align: center; -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3); } body.institutional .pageContent p.success strong { display: block; color: #43c6cc; font-size: 1.25rem; font-weight: 700; text-transform: uppercase; } body.institutional #modalLojas .overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 98; } body.institutional #modalLojas .mapa { -moz-box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.3); box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.3); display: none; } body.institutional #modalLojas .mapa, body.institutional #modalLojas iframe { width: 800px; height: 400px; position: fixed; top: 0%; left: 0%; right: 0; bottom: 0; margin: auto; background-color: #fff; background-image: url("/arquivos/optoculos-loading.gif"); background-position: center center; background-repeat: no-repeat; z-index: 99; } @media screen and (max-width: 1024px) { body.institutional #modalLojas .mapa, body.institutional #modalLojas iframe { width: 70%; max-width: 800; } } @media screen and (max-width: 720px) { body.institutional #modalLojas .mapa, body.institutional #modalLojas iframe { width: 90%; max-width: 700; } } body.institutional #modalLojas .closeModal { position: absolute; padding: 5px 10px; right: 0; top: -30px; line-height: 1; color: #fff; cursor: pointer; } body.institutional #modalLojas .closeModal i { font-size: 0.625rem; } @media screen and (max-width: 720px) { body.institutional h3.selected { display: block; } body.institutional .navSidebar .institutionalLinks { position: absolute; left: 0; width: 100%; padding: 30px; background: #fff; z-index: 20; -moz-box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.2); } body.institutional .navSidebar .institutionalLinks.active { display: none; } body.institutional .pageContent { margin-top: 40px; } body.institutional .pageContent .stores .item { width: 100%; float: none; } } body.institutional h3.optatende-subtitle { color: #3c3c3b; margin: 30px 0; text-transform: uppercase; } body.institutional ul.optatende-ico-list li { display: inline; } @media screen and (max-width: 720px) { body.institutional ul.optatende-ico-list li img { max-width: 70px; } } body.institutional.a-marca #mainContent .wrapper, body.institutional.a-marca #mainContent .pageNav .menu-departamento .submenu .submenuWrap, .pageNav .menu-departamento .submenu body.institutional.a-marca #mainContent .submenuWrap { max-width: 1350px; } body.institutional.a-marca .a-marca-top { width: 100%; position: relative; /* display: flex; */ flex-direction: row-reverse; min-height: 636px; /* margin-top: 40px; */ } body.institutional.a-marca .a-marca-top .box-title { position: absolute; /* background-image: url("/arquivos/a-marca-banner-title.png"); */ background-repeat: no-repeat; height: 100%; width: 100%; max-height: 279px; max-width: 443px; top: 0; left: 0; padding: 35px; display: flex; align-items: flex-end; } body.institutional.a-marca .a-marca-top .box-title h1 { font-size: 3.1875rem; color: white; font-weight: 900; text-transform: uppercase; line-height: 61px; } body.institutional.a-marca .a-marca-top .box-title img { display: none; } body.institutional.a-marca .a-marca-top .box-banner { width: 100%; } body.institutional.a-marca .a-marca-top .box-banner img { width: 100%; margin-bottom: 50px; } body.institutional.a-marca .a-marca-top .box-text { display: flex; align-items: flex-start; width: 100%; /* padding: 0 30px 30px 0; */ flex-direction: column; justify-content: flex-end; } body.institutional.a-marca .a-marca-top .box-text h2 { color: #3c3c3b; font-weight: 600; font-size: 2rem; text-align: left; text-transform: uppercase; padding-bottom: 10px; width: 100%; } body.institutional.a-marca .a-marca-top .box-text p { color: #989898; font-size: 1rem; text-align: justify; line-height: 20px; margin-bottom: 15px; } body.institutional.a-marca .a-marca-mid { width: 100%; margin: 20px 0; } body.institutional.a-marca .a-marca-mid .box-banner img { width: 100%; } body.institutional.a-marca .a-marca-bot { width: 100%; margin-top: 30px; align-items: center; display: flex; justify-content: center; min-height: 400px; height: 400px; overflow: hidden; } body.institutional.a-marca .a-marca-bot+.a-marca-bot .box-historia { margin-left: 15px; margin-right: 0px; order: 2; } body.institutional.a-marca .a-marca-bot+.a-marca-bot .box-banner { margin-right: 15px; margin-left: 0px; order: 1; } body.institutional.a-marca .a-marca-bot .img-main { object-fit: cover; width: 100%; } body.institutional.a-marca .a-marca-bot .box-historia { /* margin-right: 20px; */ padding: 50px; background-color: #43c6cc; color: white; width: 50%; height: 100%; justify-content: center; display: flex; flex-direction: column; margin-right: 15px; } body.institutional.a-marca .a-marca-bot .box-banner { width: 50%; margin-left: 15px; } body.institutional.a-marca .selo-viva { margin: 65px auto; display: block; } body.institutional.a-marca .a-marca-bot .box-historia h2 { font-size: 1.75rem; margin-bottom: 20px; } body.institutional.a-marca .a-marca-bot .box-historia p { font-size: 1rem; text-align: justify; margin-bottom: 20px; } body.institutional.a-marca .a-marca-bot .box-banner .img-tablet { display: none; } @media screen and (max-width: 1024px) { body.institutional.a-marca .a-marca-top { min-height: auto; flex-direction: column; } body.institutional.a-marca .a-marca-top .box-banner { width: 100%; } body.institutional.a-marca .a-marca-top .box-banner img { width: 100%; float: right; } body.institutional.a-marca .a-marca-top .box-text { width: 90% !important; margin: 20px auto; padding: 0; } body.institutional.a-marca .a-marca-bot { flex-direction: column; height: auto; } body.institutional.a-marca .a-marca-bot+.a-marca-bot .box-historia { margin-left: 15px; margin-right: 0px; order: 1; } body.institutional.a-marca .a-marca-bot+.a-marca-bot .box-banner { margin-right: 15px; margin-left: 0px; order: 2; } body.institutional.a-marca .a-marca-bot .box-historia { margin: 0 0 20px 0; width: 90%; height: auto; margin: 10px 0 !important; min-height: 300px; } body.institutional.a-marca .a-marca-bot .box-banner { width: 90%; margin: 15px 0 !important; } body.institutional.a-marca .a-marca-bot .box-banner img { width: 100%; } body.institutional.a-marca .a-marca-bot .box-banner img.img-tablet { display: block; } body.institutional.a-marca .a-marca-bot .box-banner img.img-main { display: none; } } @media screen and (max-width: 720px) { body.institutional.a-marca .a-marca-top { min-height: auto; flex-direction: column; margin-top: 20px; } body.institutional.a-marca .a-marca-top .box-title { position: relative; padding: 0; max-width: 100%; max-height: 100%; } body.institutional.a-marca .a-marca-top .box-title h1 { font-size: 2.1875rem; position: absolute; left: 30px; bottom: 20px; } body.institutional.a-marca .a-marca-top .box-title img { display: block; width: 100%; } body.institutional.a-marca .a-marca-top .box-banner { /* display: none; */ } body.institutional.a-marca .a-marca-top .box-text { padding: 0; width: 100%; margin-top: 20px; } body.institutional.a-marca .a-marca-top .box-text p { font-size: 0.8125rem; margin-bottom: 10px; } body.institutional.a-marca .a-marca-mid { margin: 10px 0; } body.institutional.a-marca .a-marca-bot { flex-direction: column; margin: 0; } body.institutional.a-marca .a-marca-bot .box-historia { margin: 0 0 10px 0; padding: 40px 20px; } body.institutional.a-marca .a-marca-bot .box-historia h2 { font-size: 1.5625rem; margin-bottom: 20px; } body.institutional.a-marca .a-marca-bot .box-historia p { font-size: 0.8125rem; margin-bottom: 10px; } body.institutional.a-marca .a-marca-bot .box-banner img { width: 100%; } body.institutional.a-marca .a-marca-bot .box-banner img.img-tablet { display: none; } body.institutional.a-marca .a-marca-bot .box-banner img.img-main { display: block; } } body.institutional .atendimento-texto { color: #989898; margin: 40px 0 30px; text-align: justify; font-size: 0.9375rem; } body.institutional .atendimento-telefone { color: #3c3c3b; font-size: 1.5625rem; font-weight: 900; } @media screen and (max-width: 720px) { body.institutional .atendimento-telefone { text-align: center; } } body.institutional .atendimento-horario { font-size: 0.875rem; margin-bottom: 30px; } @media screen and (max-width: 720px) { body.institutional .atendimento-horario { text-align: center; } } /* ========================================================================== 404 ========================================================================== */ body.page-not-found .pageError { padding-top: 80px; text-align: center; } body.page-not-found .pageError h1 { color: #fff; font-size: 7.5rem; font-weight: 900; line-height: 1; } body.page-not-found .pageError h1 span { display: inline-block; width: 185px; background: #000; padding: 32px 36px; margin-right: 5px; -webkit-border-radius: 250px; -moz-border-radius: 250px; -ms-border-radius: 250px; border-radius: 250px; } body.page-not-found .pageError h1 span.green { background: #0dd0ae; } body.page-not-found .pageError h1 span.blue { background: #3cb6f7; } body.page-not-found .pageError h1 span.red { background: #ff613b; } body.page-not-found .pageError h4 { margin: 15px 0; font-size: 1.5rem; font-weight: 600; text-transform: uppercase; } body.page-not-found .pageError ul { display: table; margin: auto; padding-left: 5px; color: #989898; text-align: left; } body.page-not-found .pageError li { position: relative; padding-left: 15px; margin-bottom: 10px; } body.page-not-found .pageError li:before { content: ""; display: block; position: absolute; top: 5px; left: 0; width: 6px; height: 6px; background: #9a5bb3; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } body.page-not-found .pageError a { background: #9a5bb3; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; width: 250px; display: block; margin: 10px auto; } body.page-not-found .pageError a:hover { background: rgba(154, 91, 179, 0.8); } @media screen and (max-width: 720px) { body.page-not-found .pageError h1 { font-size: 4.6875rem; } body.page-not-found .pageError h1 span { width: auto; background: #000; padding: 0px 11px; } body.page-not-found .pageError h4 { font-size: 1.125rem; } } .nossas-lojas .box-banner img { width: 100%; } .nossas-lojas .stores { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; flex-direction: column; } .nossas-lojas .stores .item { width: 100%; padding: 40px 0px; /* min-height: 150px; */ /* margin-bottom: 20px; */ border-top: solid 2px #ceccc4; display: flex; } .nossas-lojas .stores .item .box-info { width: 50%; } .nossas-lojas .stores .item .box-click { display: flex; align-items: flex-start; width: 50%; justify-content: flex-end; } .nossas-lojas .stores #modalLojas { /* display: block!important; */ } .nossas-lojas .stores .item p { color: #989898; } .nossas-lojas .stores .item p a { color: #989898; } .nossas-lojas .stores .item .box-click a { margin: 0 8px; } .nossas-lojas .stores .item>a, .nossas-lojas .stores .item .box-click .bt-enviar { display: table; background: #fff; /* margin-top: 20px; */ padding: 10px 25px; border: 1px solid #9a5bb3; color: #9a5bb3; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; } .nossas-lojas .stores .item>a:hover { color: #fff; background: #9a5bb3; } @media screen and (max-width: 720px) { .busca-banner { height: 280px !important; } .busca-banner h3 { font-size: 1rem !important; padding: 0 0 10px 0 !important; } .busca-banner .input-select { width: 90% !important; margin: 8px 0 !important; } .busca-banner .line-box { flex-direction: column; } .busca-banner .input-select label { padding: 14px 10px !important; font-size: 0.6rem !important; } .busca-banner p { font-size: 0.6rem !important; padding: 10px 0 0 0 !important; } .nossas-lojas .stores .item .box-info { width: 70%; } .nossas-lojas .stores .item .box-click { display: block; width: 30%; text-align: center; } .nossas-lojas .stores .item>a, .nossas-lojas .stores .item .box-click .bt-enviar { padding: 10px 5px; width: 100%; margin: 0; margin-bottom: 10px; } } /* ========================================================================== account ========================================================================== */ body.account { /*poup*/ /*perfil*/ /*enderecos*/ } body.account .content { position: relative; } body.account .content>.span4, body.account .content>.span6, body.account .content>.span3 { margin: 0; } body.account .row { margin: 0; } body.account #mainContent h4 { margin-bottom: 30px; font-size: 0.875rem; font-weight: 600; text-transform: uppercase; } body.account .nav-account { margin: 0px 0 30px; } body.account .nav-account ul { margin: 0; padding: 0; font-size: 1rem; letter-spacing: 1px; font-weight: 600; text-align: center; } body.account .nav-account li { display: inline-block; line-height: normal; text-transform: uppercase; } body.account .nav-account li:not(:last-child) { margin-right: 50px; } body.account .nav-account h2 { margin: 0; color: #43c6cc !important; font-size: 1rem; line-height: normal; text-align: center; text-decoration: underline; } body.account .nav-account a { color: #989898; text-align: center; text-decoration: none; } body.account #edit-data-link, body.account .new-address-link .address-update, body.account .orders-link a, body.account .btn-myOrders { background: #9a5bb3; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; padding: 10px 10px; margin: 10px 0 20px; text-decoration: none !important; display: table; } body.account #edit-data-link:hover, body.account .new-address-link .address-update:hover, body.account .orders-link a:hover, body.account .btn-myOrders:hover { background: rgba(154, 91, 179, 0.8); } body.account .modal-footer .btn-primary { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; background: #3cb6f7; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; margin: 10px 0 20px; text-decoration: none !important; text-shadow: none; box-shadow: none; display: table; } body.account .modal-footer .btn-primary:hover { background: rgba(60, 182, 247, 0.8); } body.account .modal-footer .btn-link { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; background: #3cb6f7; width: 100%; padding: 15px 5px; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; margin: 10px 0 20px; text-decoration: none !important; display: table; } body.account .modal-footer .btn-link:hover { background: rgba(60, 182, 247, 0.8); } body.account .modal { max-width: 560px; height: 560px; } body.account .modal #accountAjaxBusy { position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; width: 180px; height: 64px; font-size: 0; /* background: url("/arquivos/optoculos-loading.gif") no-repeat center; */ } body.account .modal .modal-header { background: #f1f1f1; border-bottom: 1px dotted #bebebe; } body.account .modal .modal-header h3 { font-size: 1.125rem; font-weight: 700; margin-bottom: 0; color: #3c3c3b; text-transform: uppercase; line-height: 1.2; } body.account .modal .modal-header button { display: none !important; } body.account .modal .modal-body { /* Firefox 18- */ /* Firefox 18- */ /* Firefox 19+ */ /* Firefox 19+ */ max-height: 450px; overflow: auto; } body.account .modal .modal-body label { display: block; margin-bottom: 10px; color: #989898; font-family: "Montserrat", sans-serif; font-size: 0.8125rem; line-height: 1; } body.account .modal .modal-body label.radio { color: #989898; } body.account .modal .modal-body input[type="text"], body.account .modal .modal-body textarea, body.account .modal .modal-body input[type="email"], body.account .modal .modal-body input[type="date"] { display: block; width: 100%; margin-bottom: 15px; border: 1px solid #c8c8c8; color: #3c3c3b; font-size: 1rem; font-family: "Montserrat", sans-serif; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.account .modal .modal-body input[type="text"]:active, body.account .modal .modal-body input[type="text"]:focus, body.account .modal .modal-body textarea:active, body.account .modal .modal-body textarea:focus, body.account .modal .modal-body input[type="email"]:active, body.account .modal .modal-body input[type="email"]:focus, body.account .modal .modal-body input[type="date"]:active, body.account .modal .modal-body input[type="date"]:focus { border: 1px solid #0dd0ae; color: #0dd0ae; } body.account .modal .modal-body input[type="text"].error, body.account .modal .modal-body textarea.error, body.account .modal .modal-body input[type="email"].error, body.account .modal .modal-body input[type="date"].error { border: 1px solid #ff613b; } body.account .modal .modal-body input[type="text"].error:active, body.account .modal .modal-body input[type="text"].error:focus, body.account .modal .modal-body textarea.error:active, body.account .modal .modal-body textarea.error:focus, body.account .modal .modal-body input[type="email"].error:active, body.account .modal .modal-body input[type="email"].error:focus, body.account .modal .modal-body input[type="date"].error:active, body.account .modal .modal-body input[type="date"].error:focus { border: 1px solid #0dd0ae; } body.account .modal .modal-body input[type="text"], body.account .modal .modal-body input[type="date"], body.account .modal .modal-body input[type="email"] { height: 40px; padding: 0px 15px; } body.account .modal .modal-body input[type="radio"] { display: inline-block; vertical-align: middle; margin-right: 5px; margin-bottom: 8px; } body.account .modal .modal-body input[type="radio"]+label { display: inline-block; vertical-align: middle; margin-right: 15px; } body.account .modal .modal-body textarea { padding: 20px; min-height: 150px; resize: none; } body.account .modal .modal-body select { display: block; width: 100%; height: 40px; padding: 0 10px; margin-bottom: 10px; border: 1px solid #c8c8c8; color: #3c3c3b; font-size: 1rem; font-family: "Montserrat", sans-serif; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: all 0.3s ease; /* Safari */ transition: all 0.3s ease; } body.account .modal .modal-body select:active, body.account .modal .modal-body select:focus { border: 1px solid #0dd0ae; color: #0dd0ae; } body.account .modal .modal-body select.error { border: 1px solid #ff613b; } body.account .modal .modal-body select.error:active, body.account .modal .modal-body select.error:focus { border: 1px solid #0dd0ae; } body.account .modal .modal-body input[type="checkbox"]+label { display: inline-block; vertical-align: middle; margin-top: 3px; margin-left: 3px; font-size: 0.75rem; } body.account .modal .modal-body input[type="text"]::-webkit-input-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="password"]::-webkit-input-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="text"]:-moz-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="password"]:-moz-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="text"]::-moz-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="password"]::-moz-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="text"]:-ms-input-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body input[type="password"]:-ms-input-placeholder { color: #989898; font-weight: 300; } body.account .modal .modal-body h5 { margin: 10px 0; color: #43c6cc; font-size: 1rem; font-weight: 600; line-height: 1.5; text-transform: uppercase; } body.account .modal .modal-body a { color: #0dd0ae; font-size: 0.75rem; font-weight: 600; } body.account .modal .modal-body label.error { float: right; color: gray; } body.account .modal .modal-body .control-group { margin-bottom: 20px; } body.account .modal .modal-footer { background: #f1f1f1; border-top: 1px dotted #bebebe; } body.account .modal .modal-footer button { display: none !important; } body.account .modal .modal-footer .btn-primary { width: auto; float: right; margin: 0; padding: 10px 25px; } body.account .modal .modal-footer .btn-link { width: auto; float: left; margin: 0; padding: 10px 25px; } body.account .modal .profile-detail-form .form-personal-data-name { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; } body.account .modal .profile-detail-form .form-personal-data-name:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-surname { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-surname:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-nickname { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; } body.account .modal .profile-detail-form .form-personal-data-nickname:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-cpf { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; } body.account .modal .profile-detail-form .form-personal-data-cpf:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-date-of-birth { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-date-of-birth:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-contact-data-corporate-name, body.account .modal .profile-detail-form .form-contact-data-fancy-name, body.account .modal .profile-detail-form .form-contact-data-business-document, body.account .modal .profile-detail-form .form-contact-data-state-registration { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; } body.account .modal .profile-detail-form .form-contact-data-corporate-name:last-child, body.account .modal .profile-detail-form .form-contact-data-fancy-name:last-child, body.account .modal .profile-detail-form .form-contact-data-business-document:last-child, body.account .modal .profile-detail-form .form-contact-data-state-registration:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-contact-data-fancy-name, body.account .modal .profile-detail-form .form-contact-data-state-registration { margin-right: 0; } body.account .modal .profile-detail-form .form-personal-data-gender input { vertical-align: middle; } body.account .modal .profile-detail-form .form-personal-data-gender label { display: inline-block; margin-right: 10px; } body.account .modal .profile-detail-form .form-contact-data-telephone, body.account .modal .profile-detail-form .form-contact-data-cellphone { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; } body.account .modal .profile-detail-form .form-contact-data-telephone:last-child, body.account .modal .profile-detail-form .form-contact-data-cellphone:last-child { margin-right: 0; } body.account .modal .profile-detail-form .form-business-data-name { font-weight: bold; text-decoration: underline; } body.account .modal .profile-detail-form .form-business-data-name a { font-size: 0; display: block; } body.account .modal .profile-detail-form .form-business-data-name a:before { content: "Incluir dados de pessoa jurídica"; display: block; font-size: 12px; } body.account .modal .profile-detail-form .form-business-data-name a[data="on"]:before { content: "Não usar dados de pessoa jurídica"; } @media screen and (max-width: 720px) { body.account .modal .profile-detail-form .form-personal-data-name, body.account .modal .profile-detail-form .form-personal-data-surname, body.account .modal .profile-detail-form .form-personal-data-nickname, body.account .modal .profile-detail-form .form-personal-data-cpf, body.account .modal .profile-detail-form .form-personal-data-date-of-birth, body.account .modal .profile-detail-form .form-contact-data-corporate-name, body.account .modal .profile-detail-form .form-contact-data-fancy-name, body.account .modal .profile-detail-form .form-contact-data-business-document, body.account .modal .profile-detail-form .form-contact-data-state-registration, body.account .modal .profile-detail-form .form-contact-data-telephone, body.account .modal .profile-detail-form .form-contact-data-cellphone { width: 100%; float: none; margin-right: 0; } } body.account .modal .address-form .address-form-addressee { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; } body.account .modal .address-form .address-form-addressee:last-child { margin-right: 0; } body.account .modal .address-form .address-form-addressee:nth-child(2) { margin-right: 0; } body.account .modal .address-form .address-form-address-type { float: left; display: block; margin-right: 0.7633587786%; width: 66.4122137405%; } body.account .modal .address-form .address-form-address-type:last-child { margin-right: 0; } body.account .modal .address-form .address-form-cep { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; margin-right: 0; } body.account .modal .address-form .address-form-cep:last-child { margin-right: 0; } body.account .modal .address-form .row { clear: both; } body.account .modal .address-form .row .span4 { float: left; display: block; margin-right: 0.7633587786%; width: 74.8091603053%; } body.account .modal .address-form .row .span4:last-child { margin-right: 0; } body.account .modal .address-form .row .span4 input { width: 100% !important; } body.account .modal .address-form .row .span1 { float: left; display: block; margin-right: 0.7633587786%; width: 24.427480916%; } body.account .modal .address-form .row .span1:last-child { margin-right: 0; } body.account .modal .address-form .row .span1 input { width: 100% !important; } body.account .modal .address-form .row .span3 { float: left; display: block; margin-right: 0.7633587786%; width: 49.6183206107%; } body.account .modal .address-form .row .span3:last-child { margin-right: 0; } body.account .modal .address-form .row .span3 input { width: 100% !important; } body.account .modal .address-form .address-form-state { float: left; display: block; margin-right: 0.7633587786%; width: 24.427480916%; } body.account .modal .address-form .address-form-state:last-child { margin-right: 0; } body.account .modal .address-form .address-form-state #state { width: 100%; } body.account .modal .address-form .address-form-city { float: left; display: block; margin-right: 0.7633587786%; width: 74.8091603053%; } body.account .modal .address-form .address-form-city:last-child { margin-right: 0; } @media screen and (max-width: 720px) { body.account .modal .address-form .address-form-addressee, body.account .modal .address-form .address-form-address-type, body.account .modal .address-form .address-form-cep, body.account .modal .address-form .address-form-state, body.account .modal .address-form .address-form-city { width: 100%; float: none; margin-right: 0; } body.account .modal .address-form .row { clear: both; } body.account .modal .address-form .row .span4, body.account .modal .address-form .row .span1, body.account .modal .address-form .row .span3 { width: 100%; float: none; margin-right: 0; } } body.account .profile-detail-display { float: left; display: block; margin-right: 0.7633587786%; width: 28.6259541985%; margin-left: 20.9923664122%; border: 1px solid #c8c8c8; padding: 20px 30px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } body.account .profile-detail-display:last-child { margin-right: 0; } @media screen and (max-width: 1280px) { body.account .profile-detail-display { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; margin-left: 16.7938931298%; } body.account .profile-detail-display:last-child { margin-right: 0; } } @media screen and (max-width: 1024px) { body.account .profile-detail-display { float: left; display: block; margin-right: 1.1494252874%; width: 43.1034482759%; margin-left: 6.3218390805%; } body.account .profile-detail-display:last-child { margin-right: 0; } } @media screen and (max-width: 720px) { body.account .profile-detail-display { float: left; display: block; margin-right: 2.3255813953%; width: 100%; margin-right: 0; float: none !important; margin: 0 auto; margin-top: 25px; } body.account .profile-detail-display:last-child { margin-right: 0; } } body.account .profile-detail-display .edit-profile-link a { width: 100%; max-width: 300px; } body.account .profile-detail-display h5 { color: #989898; font-size: 0.875rem; font-weight: 600; text-overflow: ellipsis; /* will make [...] at the end */ white-space: nowrap; /* paragraph to one line */ overflow: hidden; /* older browsers */ } body.account .profile-detail-display .profile-detail-display-email { color: #989898; font-size: 0.875rem; text-overflow: ellipsis; /* will make [...] at the end */ white-space: nowrap; /* paragraph to one line */ overflow: hidden; /* older browsers */ } body.account .profile-detail-display .profile-detail-display-info { margin-top: 15px; } body.account .profile-detail-display .profile-detail-display-info span { color: #989898; font-size: 0.875rem; line-height: 1.5; } body.account .profile-detail-display .profile-detail-display-info span.title { margin-right: 5px; font-weight: 600; } body.account .address-display-block { float: left; display: block; margin-right: 0.7633587786%; width: 28.6259541985%; border: 1px solid #c8c8c8; padding: 20px 30px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } body.account .address-display-block:last-child { margin-right: 0; } @media screen and (max-width: 1280px) { body.account .address-display-block { float: left; display: block; margin-right: 0.7633587786%; width: 32.8244274809%; } body.account .address-display-block:last-child { margin-right: 0; } } @media screen and (max-width: 1024px) { body.account .address-display-block { float: left; display: block; margin-right: 1.1494252874%; width: 43.1034482759%; } body.account .address-display-block:last-child { margin-right: 0; } } @media screen and (max-width: 720px) { body.account .address-display-block { float: left; display: block; margin-right: 2.3255813953%; width: 100%; margin-right: 0; margin-top: 25px; } body.account .address-display-block:last-child { margin-right: 0; } } body.account .address-display-block #address-remove, body.account .address-display-block #address-edit { display: none; } body.account .address-display-block .address-display-unit { width: 100%; padding: 15px; margin: 0 15px 15px 0; } body.account .address-display-block .address-display-unit h5 { font-size: 0.875rem; font-weight: 600; word-wrap: break-word; } body.account .address-display-block .address-display-unit .edit-address-link { margin-bottom: 10px; margin-left: -5px; color: #989898; } body.account .address-display-block .address-display-unit .edit-address-link a { padding: 5px; color: #989898; font-size: 0.6875rem; text-decoration: underline; } body.account .address-display-block .address-display-unit .address-display-unit-info { font-size: 0.75rem; } .busca-banner { background: #9a5bb3 url("/arquivos/busca-loja.jpg") no-repeat center; background-size: cover; width: 100%; height: 390px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; margin-bottom: 50px; } .busca-banner h3 { font-size: 1.3rem; font-weight: 700; padding: 0 0 30px 0; } .busca-banner .line-box { width: 90%; display: flex; justify-content: center; align-items: center; } .busca-banner .input-select { display: flex; width: 60%; margin: 0 2%; } .busca-banner .estado { width: 40%; margin: 0 2%; } .busca-banner .estado label { width: 50% !important; } .busca-banner .estado select.select-city { width: 50% !important; padding: 10px 0px !important; -webkit-border-radius: 25px !important; -moz-border-radius: 25px !important; -ms-border-radius: 25px !important; border-radius: 0 25px 25px 0 !important; } .busca-banner .input-select label { background: #43c6cc; width: 40%; padding: 5px 10px; font-weight: 600; border-radius: 25px 0 0 25px; text-transform: uppercase; font-size: 0.8rem; } .busca-banner .input-select select.select-city { width: 100%; display: table; background: #fff; padding: 10px 0px; border: none; color: #43c6cc; font-size: 0.875rem; font-family: "Montserrat", sans-serif; font-weight: 700; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; text-shadow: none; } .busca-banner p { font-size: 0.8rem; padding: 50px 0 0 0; } .busca-banner p a { color: #fff; text-decoration: underline; } /* PAGINA MEDIDAD DNP */ .medidas-dnp .pageContent { width: 100%; /* padding-right: 30px; */ } .medidas-dnp .pageContent p, .medidas-dnp .pageContent article p { color: #a2a2a2 !important; font-size: 15px; margin-bottom: 20px !important; } .medidas-dnp .pageContent article { margin: 35px 0 10px !important; } .medidas-dnp .pageContent article img { width: 100%; } .medidas-dnp .pageContent article h5 { font-size: 17px; margin-bottom: 15px; } .medidas-dnp .pageContent article strong { color: #a2a2a2; } .medidas-dnp .pageContent .center { text-align: center; } .medidas-dnp .pageContent article a { background: #43c6cc; padding: 10px 30px; border-radius: 3000px; color: #fff; font-weight: 600; margin: 30px 10px 0 10px; display: inline-block; } .medidas-dnp .pageContent article a+a { background: #a2a2a2; } @media only screen and (max-width: 720px) { .medidas-dnp .pageContent .selected { display: none; } .medidas-dnp .pageContent { margin-top: 0; } .medidas-dnp .pageContent h2 { font-size: 14px; padding: 0 20% 0 0; } .medidas-dnp .pageContent p, .medidas-dnp .pageContent article p { color: #a2a2a2; font-size: 13px; } .medidas-dnp .pageContent article img { width: 100%; } .medidas-dnp .pageContent article strong { color: #a2a2a2; } } .medidas-dnp .popup { position: fixed; top: 0; left: 0px; z-index: 9999; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.6); display: block; display: none; } .medidas-dnp .stap-one { display: block; } .medidas-dnp .stap-two { display: none; } .medidas-dnp label { color: black !important; font-size: 16px !important; font-weight: bold; } .medidas-dnp .popup-content { width: 600px; /* height: 700px; */ min-height: 500px; background: #fff; position: absolute; top: 50%; left: 50%; margin: -325px 0 0 -300px; padding: 50px; } .medidas-dnp .popup-content .bt-fechar { position: absolute; color: #43c6cc; font-size: 1.6rem; right: 4%; top: 3%; z-index: 99999999; cursor: pointer; } .medidas-dnp .popup-content input { border: solid 1px #959595 !important; padding: 15px !important; font-size: 13px !important; margin-bottom: 14px !important; width: 100% !important; border-radius: 0 !important; height: auto !important; font-family: "Montserrat", sans-serif !important; } .medidas-dnp .popup-content input::placeholder { color: black !important; font-weight: 500 !important; } .medidas-dnp .popup-content button { background: linear-gradient(82deg, rgba(65, 183, 244, 1) 0%, rgba(61, 209, 187, 1) 100%); border: none; color: white; margin: 0 auto; display: block; padding: 15px 40px; font-size: 24px; font-weight: 700; text-transform: uppercase; } .medidas-dnp .popup-content form img { width: 100px !important; margin-bottom: 30px; } .medidas-dnp .popup-content .first-pop { position: relative; } .medidas-dnp .popup-content .first-pop input { opacity: 0; position: absolute; height: 100% !important; } .medidas-dnp .popup-content .first-pop h2 { margin-top: 0; text-align: center; font-size: 1rem; font-weight: 500; padding: 0 4%; margin-bottom: 20px; text-transform: none; position: relative; z-index: 100; } .medidas-dnp .popup-content .first-pop h2 span { font-weight: 700; font-size: 1rem; text-transform: none; } .medidas-dnp canvas { width: 100px; height: 80px; margin-bottom: 30px; } .medidas-dnp .box-camera { position: relative; /* overflow: hidden; */ } .medidas-dnp .popup-content .first-pop img { position: absolute; width: auto; height: 80%; top: 50%; left: 50%; margin: -35% 0px 0px -25%; z-index: 99; padding-top: 5px; } .medidas-dnp .popup-content .first-pop #video { min-height: 400px; background: #ccc; } .medidas-dnp .popup-content .first-pop a img { text-align: center; width: 60px; margin: 0 auto; display: flex; margin-top: -37px; position: relative; z-index: 9999; top: inherit; left: inherit; } @media only screen and (max-width: 720px) { .medidas-dnp .popup-content .first-pop img { width: auto; margin: -56% 0px 0px -44%; } .medidas-dnp .popup-content .first-pop h2 span { font-size: 0.9rem; } .medidas-dnp .popup-content .first-pop h2 { font-size: 0.87rem; } .medidas-dnp .popup-content { width: auto; top: 0; left: 0; margin: 50px 20px; padding: 40px 30px; } .medidas-dnp #camera-feed { width: 100% !important; /* height: 300px!important; */ } .medidas-dnp #camera-feed video {} #camera-result .button-bar { margin-top: -57px; } #takePic { /* top: 30px!important; */ } .medidas-dnp canvas { width: 80px; height: 100px; } .medidas-dnp .pageContent article a { padding: 15px 40px; } .medidas-dnp label { font-size: 14px !important; } .medidas-dnp .popup-content input { padding: 10px !important; font-size: 13px !important; margin-bottom: 16px !important; } .medidas-dnp .popup-content button { padding: 13px 40px; font-size: 18px; } #camera-result .button-bar .btn { font-size: 0.8rem; padding: 13px 15px; } .medidas-dnp .popup-content form img { margin-bottom: 20px; } .medidas-dnp .popup-content .bt-fechar { font-size: 1.2rem; } } .medidas-dnp #takepic { background: url(/arquivos/camera-select.png) no-repeat; text-indent: -99999px; background-size: 100%; height: 100px; margin-top: -65px; position: relative; z-index: 9999999999; cursor: pointer; } #takePic { bottom: -20px; left: 50%; margin-left: -40px; cursor: pointer; width: 80px !important; height: 80px !important; background: transparent !important; padding: 0px !important; position: absolute !important; } #takePic img { position: relative !important; width: 80px !important; height: 80px !important; top: 0 !important; left: 0 !important; margin: 0 !important; } #camera-result { position: relative; z-index: 100; } #camera-result .button-bar .btn { font-size: 0.8rem; } #camera-result .button-bar { display: flex; } .medidas-dnp .alert-success { height: 300px; width: 100%; display: flex; text-align: center; align-items: center; justify-content: center; font-size: 1.8rem; color: rgb(67, 198, 204); font-weight: 700; } /* TIPO DE ROSTO */ body.tipo-de-rosto .navSidebar{ display: none!important; } body.tipo-de-rosto .pageContent { margin-right: 0px!important; width: 100%!important; margin-left: 0px!important; } body.tipo-de-rosto .titulo-sessao { display: none!important; } body.tipo-de-rosto h3.selected{ display: none!important; } .oculos-rosto .slick-slider { width: 95%; margin: 0px auto; padding: 0 0 70px 0; } .oculos-rosto { margin: 65px 0 50px; text-align: center; } .oculos-rosto h2 { padding-bottom: 10px; margin-bottom: 15px; font-size: 1.8rem; font-weight: 600; text-transform: uppercase; } .oculos-rosto p { color: #a2a2a2!important; font-size: 15px; margin-bottom: 50px; padding: 0 10%; } .oculos-rosto .center .slick-slide img { width: 70%; margin: 0 auto; opacity: 0.3; } .oculos-rosto .center h3{ opacity: 0.3; color:#43c6cc; font-size: 1rem; } .oculos-rosto .escolha{ text-align: center; } .oculos-rosto .escolha h2 { padding-bottom: 10px; margin-bottom: 15px; font-size: 1.2rem; font-weight: 600; text-transform: uppercase; color: #31b7b6; } .oculos-rosto .slick-slide { padding-bottom: 35px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; } .oculos-rosto .center .slick-center img { -moz-transform: scale(1.4); -ms-transform: scale(1.4); -o-transform: scale(1.4); -webkit-transform: scale(1.4); opacity: 1; transform: scale(1.4); } .oculos-rosto .center .slick-center h3{ font-size: 1.3rem; opacity: 1; font-weight: 500; border: solid 1px #43c6cc; display: inline-block; background: #fff; padding: 3px 20px; position: relative; top: 31px; } .oculos-rosto .center .bt-next, .center .bt-prev { font-size: 0; line-height: 0; position: absolute; z-index:100; top: 42%; display: block; width: 17px; width: 25px!important; padding: 0; -webkit-transform: translate(0,-50%); -ms-transform: translate(0,-50%); transform: translate(0,-50%); cursor: pointer; color: transparent; border: none; outline: 0; background: 0 0; } .oculos-rosto .bt-next{ right:-20px; } .oculos-rosto .bt-prev{ left:-20px; } .oculos-rosto .bt-next:before, .bt-prev:before { font-size: 25px; line-height: 1; opacity: .75; color: #fff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .oculos-rosto .negativo { display: none; position: relative; bottom: -50px; z-index: 99; } .oculos-rosto .negativo p, .oculos-rosto .positivo p { color:#9e9d9e; margin-bottom: 20px; } .oculos-rosto .positivo-icon{ position: relative; bottom: -50px; z-index: 99; } .oculos-rosto .positivo .luckyglass{ background: #43c6cc; display: none; } .oculos-rosto .negativo .luckyglass{ background: #d8d8d8; cursor: default; } .oculos-rosto .luckyglass{ color: #fff; padding: 17px 40px; margin-top: 10px; border-radius: 300px; text-decoration: none; font-weight: 700; text-transform: uppercase; display: inline-block; } .oculos-rosto .bt-radio{ display: inline-block; padding: 7px 20px; background: #31b7b6; color: #fff; border-radius: 110px; margin: 5px; } .oculos-rosto .selecionar-radio{ padding: 10px 0 50px; } .oculos-rosto input[type=radio], .oculos-rosto input[type=checkbox]{ opacity: 0; position: absolute; } .oculos-rosto input[type=radio] + label, .oculos-rosto input[type=checkbox] + label{ display: inline-block; height: 20px; padding: 0 0 0 25px; margin: 0; background-image: url(https://optoculos.vteximg.com.br/arquivos/ico-master.png); background-repeat: no-repeat; background-position: 0 0; color: #fff!important; font-size: 15px; font-weight: 700; text-transform: uppercase; } .oculos-rosto input[type=radio] + label + input + label{ margin:0 0px 0 0; } .oculos-rosto input[type=checkbox] + label{ background-position:0 -60px; /* Muda a posição do background só no checkbox */ } .oculos-rosto input[type=radio]:checked + label{ background-position:0 -30px; } .oculos-rosto input[type=checkbox]:checked + label { background-position:0 -90px; } .oculos-rosto .slick-dots li.slick-active button:before { color: #31b7b6!important; } .oculos-rosto .slick-dots li button:before { color: #dddddd!important; font-size: 70px!important; } .oculos-rosto .slick-dots { bottom: inherit!important; margin-top: 25px!important; } .oculos-rosto .tipo-rosto .slick-list, .oculos-rosto .tipo-rosto .slick-track { height: 360px; } .oculos-rosto .tipo-oculos .slick-list, .oculos-rosto .tipo-oculos .slick-track { height: 250px; } .oculos-rosto .tipo-oculos .center .slick-center h3{ top: -12px; } .oculos-rosto .slick-track { left: -3%!important; } .oculos-rosto .slick-current { width: 370px!important; position: relative; z-index: 100; } .oculos-rosto .slick-slide::after{ display: none!important; } .oculos-rosto .slick-current::before{ display: none!important; } .oculos-rosto .slick-slide::before{ content: ' '; display: block; background: rgb(255,255,255); background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 27%, rgba(255,255,255,0) 100%); width: 100%; height: 100%; position: absolute; z-index: 99; } .oculos-rosto .slick-current + .slick-slide::before{ background: linear-gradient(270deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 27%, rgba(255,255,255,0) 100%); } @media only screen and (max-width: 720px) { /*.content{ width: 100%; }*/ .oculos-rosto .tipo-rosto { margin: 15px auto 30px; } .oculos-rosto .tipo-oculos { margin: 15px auto 0; } .oculos-rosto{ margin: 40px 0 50px; } .oculos-rosto .center .slick-slide img { width: 65%; } .oculos-rosto .luckyglass { font-size: 0.8rem; padding: 14px 24px; } .oculos-rosto h2 { font-size: 1.2rem; margin-bottom: 5px; padding: 0 10%; } .oculos-rosto p { font-size: 13px; margin-bottom: 50px; padding: 0px 10%; } .oculos-rosto .escolha h2{ font-size: 0.8rem!important; padding-bottom: 0!important; } .oculos-rosto .slick-current { width: 230px!important; } .oculos-rosto .slick-track { left: -17%!important; } .oculos-rosto .tipo-rosto .slick-list, .oculos-rosto .tipo-rosto .slick-track { height: 230px; } .oculos-rosto .tipo-oculos .slick-list, .oculos-rosto .tipo-oculos .slick-track { height: 160px; } .oculos-rosto .center .slick-center h3 { top: 20px; } .oculos-rosto .center h3 { font-size: 0.8rem; } .oculos-rosto .center .slick-center h3 { font-size: 1rem; } .oculos-rosto .positivo img, .negativo img { width: 32px; } .oculos-rosto .center .bt-next, .center .bt-prev{ width: 10px!important; } .oculos-rosto input[type=radio] + label, .oculos-rosto input[type=checkbox] + label{ margin:0 20px 0 0; } .oculos-rosto .negativo, .oculos-rosto .positivo-icon{ bottom: -35px; } } .banner-full { margin: 70px 0 0; } .banner-full img { width: 100%; height: auto; } @media only screen and (max-width: 720px) { .banner-full { margin: 10px 0 0 0; } } /*CSS CBYKONNE*/ .box-banner a img { height: auto; max-width: 100%; } .slick-loading .slick-list { background: #fff url("./ajax-loader.gif") center center no-repeat; } /* Icons */ @font-face { font-family: "slick"; font-weight: normal; font-style: normal; src: url("./fonts/slick.eot"); src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg"); } /* Arrows */ .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; z-index: 999; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; display: none; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; display: none; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; } .slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; opacity: 0.75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: none; } .slick-prev { left: -25px; } [dir="rtl"] .slick-prev { right: -25px; left: auto; } .slick-prev:before { content: "←"; display: none; } [dir="rtl"] .slick-prev:before { content: "→"; display: none; } .slick-next { right: -25px; } [dir="rtl"] .slick-next { right: auto; left: -25px; } .slick-next:before { content: "→"; } [dir="rtl"] .slick-next:before { content: "←"; } /* Dots */ .slick-dotted.slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; bottom: -14px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { font-family: "slick"; font-size: 48px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: "•"; text-align: center; color: #bdbdbd; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { color: #43c6cc; } .buybuttom { visibility: hidden; text-align: center; margin: 20px 0px; } .buybuttom .btn-add-buy-button-asynchronous { cursor: pointer; color: white !important; display: block; text-transform: uppercase; background-color: #31b7b6 !important; font-weight: 600 !important; font-size: 20px !important; width: 80% !important; /* line-height: 28px; */ /* padding: 10px; */ text-decoration: none; border-radius: 33px !important; text-align: center; margin: auto; padding: 15px 5px; } .buybuttom .btn-add-buy-button-asynchronous:hover { background-color: #389595 !important; } .topo-nav { background-color: #43c6cc; padding: 5px 0px; font-family: "Montserrat", sans-serif; } @media screen and (max-width: 1024px) { .topo-nav { max-height: 55px; } } .topo-nav .wrapper { visibility: hidden; } .header-nav { display: flex; } .header-nav-top { text-align: center; width: 85%; padding-left: 5%; } .header-nav-top h2 { font-size: 20px; font-weight: normal !important; padding-top: 5px; } .header-nav-top .slick-track { display: flex; align-items: center; justify-content: center; } @media screen and (max-width: 1024px) { .header-nav-top h2 { font-size: 15px; } } .header-nav-top h2 img { display: inline !important; padding-right: 20px; } .text-nav { /* float: left; */ width: 60%; /* text-align: right; */ font-weight: 700; text-transform: uppercase; color: white; /* padding-top: 3px; */ } #nav-busca { width: 5%; float: right; border-radius: 20px; border: none; padding: 5px; padding-left: 10px; } @media screen and (min-width: 1024px) { #mobile-cart { display: none; } .pageHeader .toggleButtons { margin-top: 15px; } .pageHeader .toggleButtons .toggleSearch { /* display: inline-block;*/ display: none; } } .showonmobileonly { display: none; } @media (max-width: 750px) { .footerItem.toggle { background-color: #43c6cc; color: white; padding-top: 4px; margin-bottom: 6px; } .pageFooter .middleFooter .itemContent.active a { color: white; } .pageFooter .footerItem h3 i { right: 22px; color: white; font-size: 0.475rem; } .pageFooter .middleFooter .socialCol { margin-bottom: 0px !important; } .infoblock { margin-bottom: 2em; } .showonmobileonly { display: block; } .redes-sociais { display: none; } .pageFooter .topFooter fieldset .campos input[type="text"] { width: 100%; } .pageFooter .bottomFooter .powerCol li{ width: 15%; } } @media (max-width: 1100px) { .featuredCollection, .bannerHorizontallateral, .bannerHorizontallateral2, .bannerHorizontallateral3 { width: 100%; display: block; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productInfo { margin-top: 0; } .shelf li[layout="1c725695-1f6c-4434-b5e1-b250f30aac96"] .productPrice a .bestPrice { font-size: 18px; } /*.topo-nav{ display: none; }*/ #nav-busca { display: none; } .text-nav { width: 100%; font-size: 12px; text-align: center; padding-top: 0px; } .paymentCol.footerItem.toggle { display: none; } .buybuttom { visibility: visible !important; } } .installmentToggle { display: block; margin-top: -40px; /* text-align: right; */ position: relative; padding-right: 15px; margin-left: 230px; } .footerLinks_pagamento { display: flex; } .footerLinks_pagamento .paymentCol { width: 45%; } .footerLinks_pagamento .paymentCol ul { display: flex; } .footerLinks_pagamento .paymentCol ul li img { max-width: 500px; } .mainProductImage .product-espelho-vitrine { display: none; } /* CSS CBYK - Danilo Medeiros */ .product-espelho-vitrine-shelf { display: none; text-align: center; margin-bottom: 1em; float: left; margin-top: 30px; left: -10px; position: relative; } .mainProductImage>img { top: 8em !important; } .product-espelho-vitrine button, .product-espelho-vitrine-shelf button { background: transparent; border: 0; color: white; font-size: 0.875rem; font-family: "Montserrat", sans-serif; text-align: center; text-transform: uppercase; line-height: 1; cursor: pointer; appearance: none; border-radius: 25px; box-shadow: none; text-shadow: none; font-weight: 700; } h4.group.Oculos-de-Sol, th.name-field.Estilo, th.name-field.Material, th.name-field.Cor, th.name-field.Genero, th.name-field.Tipo-Lente, td.value-field.Estilo, td.value-field.Material, td.value-field.Cor, td.value-field.Genero, td.value-field.Tipo-Lente, th.name-field.Descricao { display: none; } #show { display: flex; } .trustvox-certificate__fixed-seal { width: 110px!important; height: 110px!important; }