@path: "/novosite"; /*Fontes*/ @import url('https://fonts.googleapis.com/css?family=Fjalla+One&display=swap'); @font-face { font-family: 'Helvetica Neue'; src: url('../fonts/HelveticaNeue.eot'); src: url('../fonts/HelveticaNeue.eot?#iefix') format('embedded-opentype'), url('../fonts/HelveticaNeue.woff2') format('woff2'), url('../fonts/HelveticaNeue.woff') format('woff'), url('../fonts/HelveticaNeue.ttf') format('truetype'), url('../fonts/HelveticaNeue.svg#HelveticaNeue') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Fjalla One'; font-style: normal; font-weight: 400; font-display: swap; src: local('Fjalla One'), local('FjallaOne-Regular'), url(https://fonts.gstatic.com/s/fjallaone/v7/Yq6R-LCAWCX3-6Ky7FAFrO96kigt.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* latin */ @font-face { font-family: 'Fjalla One'; font-style: normal; font-weight: 400; font-display: swap; src: local('Fjalla One'), local('FjallaOne-Regular'), url(https://fonts.gstatic.com/s/fjallaone/v7/Yq6R-LCAWCX3-6Ky7FAFrOF6kg.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /*Variáveis*/ @fjalla: 'Fjalla One', sans-serif; @helvetica: 'Helvetica Neue'; @normal: 400; @semibold: 600; @bold: 800; @preto-titulo: #303539; @preto-titulo2: #424242; @preto-texto: #888888; @preto-lista: #666666; @cinza: #F6F6F6; @cinza-icone: #b4b4b4; @verde: #155E67; @vermelho: #A51E36; @checksim: #155E67; @checknao: #A51E36; @checkacessorio: #303539; *{ padding: 0; margin: 0; box-sizing: border-box; outline: none; } body{ font-size: 16px; margin: 0; font-family: @helvetica, sans-serif; font-weight: normal; font-style: normal; } html, body { height: 100%; } html{ scroll-behavior: smooth; } main#main{ padding-top: 25px; } h1, h2, h3, h4, h5, h6{ font-family: @fjalla, @helvetica, sans-serif; text-transform: uppercase; color: @preto-titulo; } p{ font-family: @helvetica; color: @preto-texto; line-height: 1.5em; font-size: 1em; opacity: 1; margin: 10px 0px; } h1{ font-size: 60px; margin: 15px 0px; } h2{ font-size: 50px; margin: 40px 0px; } h3{ font-size: 30px; margin: 15px 0px; } h4{ color:@preto-lista ; font-size: 20px; margin: 15px 0px; } a{ &:hover{ -webkit-transition: 0.5s; -moz-transition: 0.5s; transition: 0.5s; } } span.verde{ color:@verde; } ul.lista-green { padding: 0; margin: 10px 0px 20px 0px; list-style: none; li { padding-left: 1.3em; padding-bottom: 5px; color: #888888; &:before { content: "\f069"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: @verde; display: inline-block; margin-left: -1.3em; width: 2.3em; font-size: 11px; } } } .titulo-produto { border-bottom: .5px solid #666; margin-bottom: 50px; h5{ color:@preto-lista; text-transform: uppercase; font-size: 16px; } } .produtos .carousel { margin-top: 20px; .carousel-item{ img{ margin-left: auto; margin-right: auto; display: block; } } } .produtos ol.carousel-indicators { position: relative; margin-top: 15px; } .produtos .carousel-indicators .active { background-color: @preto-titulo; } .produtos .carousel-indicators li { border: 1px solid @preto-titulo; width: 10px; height: 10px; border-radius: 10px; } section#SolucoesIntegradas, section#Seguranca, section#VarejoInteligente, section#NossosClientes, section#AcesseBlogHome, section#atendimento{ margin-bottom: 40px; p{ //text-align: left; //font-size: 14px; } .produtos:nth-child(odd) { background-image: url('/images/bg-produtos.png'); background-repeat: no-repeat; background-position: center center; min-height: 530px; background-size: contain; padding: 60px 0px 0px 50px; } .produtos:nth-child(even) { background-image: url('/images/bg-produto-left.svg'); background-repeat: no-repeat; background-position: center center; min-height: 530px; background-size: contain; padding: 0px 0px 0px 0px; } } .box-varejo-inteligente { background-image: url('/images/varejo.jpg'); background-position: left; background-repeat: no-repeat; background-color: #F6F6F6; h2 { margin: 80px 0px 0px 0px; font-size: 55px; } h5 { font-size: 25px; margin-bottom: 30px; } p{ margin-bottom: 40px; } a { margin-bottom: 30px; } } .varejo-inteligente-cinza { background-color: #F6F6F6 } .imagem-esquerda { margin-left: auto; margin-right: auto; margin-top: 50px; } ol.carousel-indicators.home { margin-left: 0px; } ol.carousel-indicators.home-esquerda { text-align: left; } .text-produtos-home { margin-top: 185px; h4 { font-size: 25px } p { margin-bottom: 20px; } } .padding-produtos-home { margin: 85px 0px; } .btn-padrao { border: solid 1px @vermelho; border-radius: 0px; background-color: transparent; color: @vermelho; font-weight: bold; font-family: @helvetica; text-transform: uppercase; text-align: center; padding: 10px; transition: all 0.4s; cursor: pointer; } .btn-padrao:hover { color: @vermelho; text-decoration: none; } .btn-proposta { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; &::before{ content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: @vermelho; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } i{ margin-left: 10px; } &:hover{ color: #fff; background-color: @vermelho; &::before{ -webkit-transform: scaleX(1); transform: scaleX(1); } } } .btn-padrao-branco { border: solid 1px #ffffff; border-radius: 0px; background-color: transparent; color: #ffffff; font-weight: bold; font-family: @helvetica; text-transform: uppercase; text-align: center; padding: 10px; transition: all 0.4s; cursor: pointer; } .btn-padrao-branco:hover { color: #ffffff; text-decoration: none; } .btn-proposta-branco { margin-top: 15px; display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; &::before{ content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #ffffffd1; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } i{ margin-left: 10px; } &:hover{ color: @verde; background-color: transparent; &::before{ -webkit-transform: scaleX(1); transform: scaleX(1); } } } .btn-saibamais { position: relative; border: none; width: 100%; max-width: 150px; svg { position: absolute; left: 0; top: 0; height: 45px; width: 100%; } rect { fill: none; stroke: @vermelho; stroke-width: 2; stroke-dasharray: 422, 0; transition: all 0.35s linear; } &:hover { font-weight: 900; letter-spacing: 1px; rect { stroke-width: 2; stroke-dasharray: 15, 310; stroke-dashoffset: 48; transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1); } } } footer { .logo-footer { margin-bottom: 40px; img{ max-width: 215px; width: 215px; } } h4{ font: @fjalla; color: @preto-titulo; font-size: 20px; opacity: 1; } p{ color:@preto-texto; font-size: 14px; opacity: 1; line-height: 20px; } .footer-sobre{ background-color: @cinza; padding: 60px 0; } .footer-develop{ padding: 10px 0; font-size: 12px; line-height: 2em; } .redes-sociais{ a{ color: @preto-texto; font-size: 14px; margin-bottom: 20px; display: inline-block; &:hover{ color: @preto-titulo; text-decoration: none; } } a.btn.btn-padrao.btn-proposta { &:hover{ color: #fff; background-color: @vermelho; &::before{ -webkit-transform: scaleX(1); transform: scaleX(1); } } } } .enderecos{ p{ margin-bottom: 25px; } } } .container-fluid { padding-right: 200px; //250px; padding-left: 200px; //250px; margin-right: auto; margin-left: auto; } .topo-desk{ display: block; position: fixed; width: 100%; top: 0; z-index: 100; background: #FFF; .institucional{ position: relative; width: 100%; padding: 1em 0; } .produtos{ background: @cinza; display: block; //padding: 1em 0; } } .topo-mobile{ display: block; padding: 1em 0; z-index: 10; img { height: 55px; } } #conteudo{ display: block; position: relative; margin-top: 117px; overflow-x: hidden; } .bar-rss{ float: right; margin-top: 5px; a{ color: @preto-titulo; padding: 5px; &:hover{ color: @verde; } } } /*Menu Institucional Desktop*/ ul#menu_institucional{ margin-bottom: 0; float: right; margin-top: 5px; li.current-menu-item a { color: @verde; } li{ margin-right: 0.5em; padding: 0px 10px 10px 10px; display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; overflow: hidden; &:before{ content: ""; position: absolute; z-index: -1; left: 51%; right: 51%; bottom: 0; background: @verde; height: 4px; -webkit-transition-property: left, right; transition-property: left, right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } &:hover:before, &:focus:before, &:active:before { left: 0; right: 0; } a{ color: @preto-texto; text-transform: uppercase; font-family: @fjalla; &:hover{ color: @verde; text-decoration: none; } } } } .form-control { border: 0px; box-shadow: none; border-bottom: 1px solid @preto-titulo2; border-radius: 0px; &:focus { border-bottom: 1px solid @vermelho; } } /*Menu Produtos Desktop*/ ul#menu_produtos{ margin-bottom: 0; display: flex; li.current-menu-item a { color: @verde; } li{ padding: 15px 10px; flex-grow: 1; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; overflow: hidden; &:before { content: ""; position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; top: 0; border-color: @verde; border-width: 0; border-style: solid; -webkit-transition-property: border width; transition-property: border width; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } &:hover:before, &:focus:before, &:active:before { border-width: 0px 0px 2px 0px; -webkit-transform: translateY(0); transform: translateY(0); } a{ color: @preto-titulo; text-transform: uppercase; font-weight: lighter; font-size: 1em; font-family: @fjalla; &:hover{ color: @verde; text-decoration: none; } } } } /*Menu Mobile*/ .logo-mobile { max-width: 215px; height: auto; } .botao-header{ display: inline-block; color: @verde; &:hover{ color: @vermelho !important; text-decoration: none; transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; } i{ font-size: 2.5em; padding: 5px; } } .side-nav { z-index: 9999; height: 100%; width: 100%; background-color: @verde; /*color: #CCC;*/ -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; position: absolute; top: 0; left: 0; overflow: auto; } .side-nav img{ margin-left: 50px; margin-top: 15px; margin-bottom: 15px; } .side-nav .close-aside { position: absolute; top: 15px; right: 20px; cursor: pointer; color: #FFF; padding-top: 8px; background: @verde; border-radius: 5px; font-size: 2em; width: 40px; height: 45px; text-align: center; } .side-nav .menu > li { overflow: hidden; cursor: pointer; } .side-nav .menu > li > a{ color: #FFF; text-transform: uppercase; text-decoration: none; padding: 10px 10px 10px 10px; margin-left: 40px; /*border-radius: 5px;*/ display: block; } /*Aplica fonte diferente aos elementos institucionais*/ .side-nav .menu > li:nth-child(9) > a{ font-family: @fjalla; //margin-top: 15px; } .side-nav .menu > li:nth-child(10) > a{ font-family: @fjalla; } .side-nav .menu > li:nth-child(11) > a{ font-family: @fjalla; } .side-nav .menu > li:nth-child(12) > a{ font-family: @fjalla; } .side-nav .menu > li:nth-child(13) > a{ font-family: @fjalla; } .side-nav .menu > li:nth-child(14) > a{ font-family: @fjalla; } .side-nav .menu > li.current-menu-item{ background: #FFF; a{ color: @verde; } } .side-nav .menu > li.roxos.opend > a{ background: green; } .side-nav .menu > li.internas{ background: #FFF; border-radius: 5px; } .side-nav .menu > li.internas > a{ color: blue; text-decoration: none; padding: 10px 40px 10px 20px; margin-left: 35px; background: #FFF; border-radius: 5px; display: block; } /* Start dropdown menu .side-nav .menu .sub-menu { padding-top: 10px; padding-bottom: 5px; margin-left: 35px; padding-left: 20px; background: #F1F1F1; list-style: none; display: none; } .side-nav .menu .sub-menu > li{ list-style: none; margin-bottom: 15px; } .side-nav .menu .sub-menu > li:before{ content: "\2022"; color: yellow; display: inline-block; margin-right: 5px; } .side-nav .menu .sub-menu > li > a { color: gray; text-decoration: none; width: 100%; word-break: break-word; } End dropdown menu */ .show-side-btn { border: none; cursor: pointer; } .show-side-nav { -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); } /*Banner Principal*/ article, aside, dialog, figcaption, figure, footer, header, hgroup, legend, main, nav, section { display: block } main#main, main#news-article { min-height: 250px } div.banner-principal main#main { /*min-height: 1000px*/ } div.banner-principal #news-list { margin-top: 0 } body.page-template-news .revolver-hold { margin-bottom: 100px } .revolver-hold, .revolver-hold .bullet-video { transition-delay: 0s; transition-property: all; transition-timing-function: cubic-bezier(.86, 0, .07, 1); overflow: hidden } .revolver-hold { width: 100%; background-size: cover; background-position: center; position: relative; transition-duration: .2s } .revolver-hold .bullet-video { width: 100%; opacity: 0; transition-duration: 1.1s } .revolver-hold .bullet-video.show, .revolver-hold .container.full #revolver .revolver-chamber .bullet-image .banner-body { opacity: 1 } .revolver-hold .bullet-video iframe { width: 100%; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; pointer-events: none; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%) } #revolver, #revolver .revolver-nav, #revolver .revolver-nav .rev-dir-hold { position: relative } .revolver-hold .container { height: auto; transition-delay: .5s; transition-duration: .5s; transition-property: all; transition-timing-function: cubic-bezier(.86, 0, .07, 1) } #revolver, #revolver .revolver-nav, #revolver .revolver-nav .rev-dir-hold:after { transition-delay: 0; transition-timing-function: cubic-bezier(.86, 0, .07, 1); transition-property: all } .revolver-hold .container.full { max-width: 100%; padding: 0 30px; height: 600px } .revolver-hold .container.full #revolver { margin: 0 } .revolver-hold .container.full #revolver .revolver-chamber, .revolver-hold .container.full #revolver .revolver-chamber .bullet-image { height: 600px } .revolver-hold .container.full #revolver .revolver-chamber .bullet-body { opacity: 0 } #revolver { width: 100%; display: flex; margin: 50px 0px; transition-duration: 250ms } #revolver.rev-go-up .bullet.visible-hidden { transform: rotate(-40deg) } #revolver.rev-go-down .bullet.visible-hidden { transform: rotate(40deg) } #revolver .revolver-nav { display: flex; flex-direction: column; height: 120px; width: 30px; justify-content: space-between; margin: auto 50px auto -50px; transition-duration: .5s } #revolver .revolver-nav.hide { opacity: 0; width: 0 } #revolver .revolver-nav .rev-dir-hold:after { position: absolute; height: 3px; border-color: #e83e33; border-style: solid; left: 7px; opacity: 0; pointer-events: none; transition-duration: .2s } #revolver .revolver-nav .rev-dir-hold:hover { cursor: pointer; } #revolver .revolver-nav .rev-dir-hold:hover:after { width: 40px; height: 40px; left: -5px; top: -10px; opacity: 1 } #revolver .revolver-nav .rev-up { width: 31px; height: 18px; transform: scale(.8) } #revolver .revolver-nav .rev-down { width: 31px; height: 18px; transform: rotate(180deg) scale(.8) } #revolver .revolver-nav .rev-count { display: flex; position: absolute; bottom: -70px; width: 100%; justify-content: center; color: #707070 } #revolver .revolver-chamber { flex-grow: 10; position: relative; height: 550px; display: flex; justify-content: flex-start; align-items: flex-start } #revolver .bullet { position: absolute; width: 100%; transform-origin: 110% 250%; transition-delay: .5s; transition-duration: .5s; transition-property: all; transition-timing-function: cubic-bezier(.86, 0, .07, 1); border-radius: 500px } #revolver .bullet.takeover .bullet-image { width: 100%; border-radius: 0 } #revolver .bullet.bullet-1 { display: block } #revolver .bullet.hidden-next { display: block; transform: rotate(40deg) } #revolver .bullet.hidden-next:hover { transition-delay: 0s } #revolver .bullet.hidden-next:hover .bullet-image { transition-delay: 0s; opacity: 1 } #revolver .bullet.hidden-next.loop-top { transform: rotate(-320deg) } #revolver .bullet.hidden-next .bullet-body { opacity: 0; transform: translateX(50px) } #revolver .bullet.hidden-next .bullet-image { opacity: .5; box-shadow: 0 0 0 #44423c; //animation: pulse 2s infinite } #revolver .bullet.hidden-prev { transform: rotate(-40deg) } #revolver .bullet.hidden { transition-duration: 0s; transform: rotate(100deg) } #revolver .bullet.hidden.hidden-away { transition-duration: .5s } #revolver .bullet.hidden .bullet-image { opacity: .5 } #revolver .bullet.visible-hidden { transform: rotate(-40deg) } #revolver .bullet.visible-hidden .bullet-body { opacity: 0; transform: translateX(50px); } #revolver .bullet.visible.fade-pic { transition-delay: 0s } #revolver .bullet.visible.fade-pic .bullet-image { transition-delay: 0s; opacity: .7 } #revolver .bullet.visible .bullet-body { transition-delay: 1s; opacity: 1; transform: translateX(0); z-index: 0; } #revolver .bullet .bullet-image { width: 550px; height: 550px; overflow: hidden; border-radius: 50% 50% 0% 50%; flex: 0 0 350px; opacity: 1; background-color: #fff; background-size: 1px; background-repeat: no-repeat; transition-delay: .5s; transition-duration: .5s; transition-property: all; transition-timing-function: cubic-bezier(.86, 0, .07, 1); z-index: 0; } #revolver .hidden-next .bullet-image, #revolver .hidden-prev .bullet-image { background: none; } #revolver .bullet .bullet-image .banner-body { margin: 0 auto; padding-left: 100px; height: 100%; display: flex; flex-direction: column; justify-content: center; opacity: 0; transition-delay: 0; transition-duration: .5s; transition-property: all; transition-timing-function: linear } #live-search.navscreen-search, #revolver .bullet .bullet-body { transition-property: all; transition-timing-function: cubic-bezier(.86, 0, .07, 1); } #revolver .bullet .bullet-body { position: absolute; top: 0; width: 550px; height: 550px; padding: 100px; opacity: 0; display: flex; flex-direction: column; justify-content: center; transition-delay: 0s; transition-duration: 550ms; } #revolver .bullet .bullet-body.hide { transition-delay: 0s; opacity: 0 } #revolver .bullet .bullet-body .bullet-cat { color: @vermelho; font-size: 14px; font-weight: 300 } #revolver .bullet .bullet-body .bullet-title { font-size: 60px; font-weight: 600; margin: 0; h3 { font-size: 60px; color: @preto-titulo; margin: 0; } } #revolver .bullet .bullet-body .bullet-author { margin: 10px 0 0; color: #818181; h4 { font-size: 20px; color: @preto-titulo; margin: 0px; } } #revolver .bullet .bullet-body .bullet-arrow, #revolver .bullet .bullet-body .bullet-desc { display: none } .bullet-desc { display: block !important; margin: 30px 0px; font-size: 15px; font-family: 'Helvetica Neue'; color: #888; } #revolver .bullet .bullet-body .bullet-link { position: absolute; width: 110px; height: 110px; background: @vermelho; border-radius: 50% 50% 0 50%; padding: 5px; bottom: 0; right: 0; text-align: center; color: #FFF; font-size: 12px; display: flex; justify-content: center; align-items: center; text-transform: uppercase; font-weight: 500; z-index: 150; cursor: pointer; } #revolver .bullet .bullet-body .bullet-link .dot-link { float: left } #revolver .bullet .bullet-body .bullet-link .dot-link .link-text { color: #E83030; font-weight: 300 } #revolver .revolver-mobile-count, #revolver .revolver-mobile-nav { display: none } #revolver .revolver-dots { position: absolute; width: 450px; bottom: -30px; left: 0; margin-left: 30px; display: flex; align-items: center; justify-content: center } #revolver .revolver-dots .revolver-dot { width: 11px; height: 11px; border-radius: 100%; border: 1px solid #707070; margin: 0 5px; background: #FFF } #revolver .revolver-dots .revolver-dot.active { background: @vermelho; border-color: @vermelho } @-webkit-keyframes pulse { 0% { -webkit-box-shadow: 0 0 0 0 rgba(68, 66, 60, .6) } 70% { -webkit-box-shadow: 0 0 0 15px rgba(68, 66, 60, 0) } 100% { -webkit-box-shadow: 0 0 0 0 rgba(68, 66, 60, 0) } } @keyframes pulse { 0% { -moz-box-shadow: 0 0 0 0 rgba(68, 66, 60, .6); box-shadow: 0 0 0 0 rgba(68, 66, 60, .6) } 70% { -moz-box-shadow: 0 0 0 15px rgba(68, 66, 60, 0); box-shadow: 0 0 0 15px rgba(68, 66, 60, 0) } 100% { -moz-box-shadow: 0 0 0 0 rgba(68, 66, 60, 0); box-shadow: 0 0 0 0 rgba(68, 66, 60, 0) } } @media only screen and (max-width:1200px) { .revolver-hold .container { height: auto } #revolver .revolver-chamber { display: flex; justify-content: center; align-items: center } #revolver .revolver-dots { width: 350px } #revolver .bullet .bullet-body, #revolver .bullet .bullet-image { width: 350px; height: 350px } #revolver .bullet .bullet-title { font-size: 28px } #revolver .bullet .bullet-body .bullet-link { width: 60px; height: 60px; bottom: 20px; right: 20px } } @media only screen and (max-width:850px) { #revolver .revolver-dots, #revolver .revolver-nav, .revolver-hold .bullet-video, .revolver-hold .bullet-video.show { display: none } #revolver .bullet .bullet-body .bullet-title { h3 { font-size: 30px; } } #revolver .bullet .bullet-body .bullet-author { h4 { font-size: 18px; } } .bullet-desc { font-size: 12px; } body.page-template-news .revolver-hold { margin-bottom: 50px } .revolver-hold { background: #FFF!important; //min-height: 90vh height: 380px !important; } .revolver-hold .container { height: 100% } #revolver { //margin: 30px 0 90px margin: 30px 0px; } #revolver .revolver-chamber { margin: 0 20px; height: 60vw; display: block } #revolver .revolver-mobile-count { position: absolute; top: 0; right: 0; width: 100%; height: 100%; align-items: flex-end; //justify-content: flex-end; display: flex } #revolver .revolver-mobile-count .rev-count { display: flex; color: #707070 } #revolver .revolver-mobile-nav { position: absolute; width: 100%; height: 100vw; display: flex; //justify-content: space-between; padding: 0; margin: -20px 0 0; align-items: flex-end; } #revolver .revolver-mobile-nav .nav-left, #revolver .revolver-mobile-nav .nav-right { width: 30px; height: 30px; border-radius: 100%; display: flex; justify-content: center; align-items: center; //background: #FFF; z-index: 100 } #revolver .revolver-mobile-nav .nav-left { margin-left: 0px; } #revolver .revolver-mobile-nav .nav-left svg { width: 15px } #revolver .revolver-mobile-nav .nav-right { margin-right: -20px } #revolver .revolver-mobile-nav .nav-right svg { width: 15px; transform: rotate(180deg) } #revolver .bullet .bullet-image { position: relative; background-size: cover; width: 100%; height: 100%; display: block } #revolver .bullet .bullet-body { //position: relative; padding: 60px; margin: 0; width: 100%; height: auto } #revolver .bullet .bullet-body .bullet-desc { display: block; margin: 15px 0; padding: 0; font-size: 15px; } #revolver .bullet .bullet-body .bullet-author { display: none } #revolver .bullet .bullet-body .bullet-arrow { margin: 25px 0 0 } } #revolver .revolver-nav .rev-dir-hold:after, footer#footer .col.social a:after { content: ''; width: 3px; border-radius: 50%; border-width: 1px; top: 6px } .visible { visibility: visible!important } /*Fim Banner Principal*/ //WhatsApp .btn-whatsapp { position:fixed; width:60px; height:60px; bottom:15px; left:20px; background-color:#25d366; color:#FFF; border-radius:50px; text-align:center; font-size:30px; box-shadow: 1px 1px 2px #888; z-index:1000; } /*Responsivo*/ /* @media (max-width: 480px) { }*/ @media (max-width: 767px) { .container-fluid { padding-right: 15px; padding-left: 15px; } #conteudo{ margin-top: 0px; } .text-produtos-home { margin-top: auto } h1{ font-size: 50px; margin: 15px 0px; } h2{ font-size: 40px; margin: 40px 0px; } h3{ font-size: 30px; margin: 15px 0px; } h4{ color:@preto-lista ; font-size: 25px; margin: 15px 0px; } .icone-quemsomos { padding-top: 20px; } .quemsomos-mobile h3 { font-size: 38px; } } @media (min-width: 768px) and (max-width: 991px) { .container-fluid { padding-right: 15px; padding-left: 15px; } ul#menu_produtos, ul#menu_institucional{ li{ a{ font-size: 0.7em; } } } } @media (min-width: 992px) and (max-width: 1200px) { .container-fluid { padding-right: 60px; padding-left: 60px; } ul#menu_produtos, ul#menu_institucional{ li{ a{ font-size: 0.7em; } } } } @media (min-width: 1201px) and (max-width: 1400px) { .container-fluid { padding-right: 120px; padding-left: 120px; } ul#menu_produtos, ul#menu_institucional{ li{ a{ font-size: 0.8em; } } } } @media (min-width: 1401px) and (max-width: 1600px) { .container-fluid { padding-right: 120px; padding-left: 120px; } ul#menu_produtos, ul#menu_institucional{ li{ a{ font-size: 1em; } } } } @media(min-width:1200px){ section#AcesseBlogHome{ position: relative; &::before { content: ''; width: 75%; height: 80%; background: #f0f0f0; position: absolute; top: 110px; right: 0; z-index: -1; } } } .box-cinza { background: #F6F6F6; padding-top: 30px; padding-bottom: 20px; margin-top: 30px; margin-bottom: 30px; } /*Página Design*/ .titulo-h2-design { padding-bottom: 20px; } .titulo-h2-design h2 { font-size: 25px; } /*section.design .row, section.servicos .row{ margin-bottom: 50px; } .icone-design { width: 65%; }*/ .linha-horizotal { border-bottom: 0px solid #ebebeb; margin-top: 40px; margin-bottom: 40px; } .box-confira-tambem { margin: 0px 0px 60px 0px; } .box-confira-tambem h2 { font-size: 60px; line-height: 1.4; } .box-confira-tambem h4{ font-size: 25px; margin: 0px; } .box-confira-tambem p { font-size: 16px; min-height: 68px; } /*Página Serviços*/ .checklist-servicos { margin-top: 20px; margin-bottom: 20px; } .icone-servicos-check { float: left; padding: 0px 10px 45px 0px; } .texto-servico-checklist { color: #155E67; font-weight: bold; } .container-itens-tabs { background-color: #F6F6F6; margin: 30px 0px; } .itens-tabs::-webkit-scrollbar { display: none;} .itens-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; .item-tab { flex: 0 0 auto; flex-grow: 1; justify-content: center; align-items: center; text-align: center; width: 125px; height: auto; padding-top: 20px; cursor: pointer; -webkit-transition: all 0.1s 0.1s ease-in-out; -moz-transition: all 0.1s 0.1s ease-in-out; -o-transition: all 0.1s 0.1s ease-in-out; transition: all 0.1s 0.1s ease-in-out; .iconefiltro{ min-height: 65px; svg.fill{ margin: 5px; width: 50px; height: 50px; path, rect, circle, line{ fill: @cinza-icone; stroke: none; } } svg.stroke{ margin: 5px; width: 50px; height: 50px; stroke-width: 2; path, rect, circle, ellipse, line, polyline{ stroke: @cinza-icone; fill: none; } } svg.stroke-2{ margin: 5px; width: 50px; height: 50px; stroke-width: 1; path, rect, circle, ellipse, line, polyline{ stroke: @cinza-icone; fill: none; } } } img { margin: 5px; max-width: 50px; height: 50px; } p { font-size: 13px; padding: 0px 20px; } &:hover, &.active{ background-color: #FFF; .iconefiltro{ svg.fill{ rect, circle, path{ fill: @verde; } } svg.stroke{ path, rect, circle, ellipse, line, polyline{ stroke: @verde; } } svg.stroke-2{ path, rect, circle, ellipse, line, polyline{ stroke: @verde; } } } p{ color: #155E67; font-weight: bold; } } } } section.box-inovacao-protecao { background: #F6F6F6; margin: 50px 0px; padding-bottom: 50px; padding-top: 30px; } .box-confira-tambem-cadeados { border-top: 1px solid #ebebeb; h2 { margin: 65px 0px 40px 0px; } } /*Página Varejo*/ .titulo-produto-varejo { margin-bottom: 50px; } .titulo-h2-varejo { padding-bottom: 50px; padding-top: 20px; } .titulo-h2-varejo h2 { font-size: 25px; } /*Fim Página Varejo*/ /*Página Smart*/ button.botao-modal { color: #e6e6e6; text-decoration: none; letter-spacing: 10px; background-color: transparent; border: none; } button.botao-modal:hover { border: 1px solid white; padding: 5px 30px; } .texto-smart-circle p { color: #888888; margin: 20px 0px; } section.background-video { background-image: url('/images/background.png'); text-align: center; min-height: 380px; } section.container-checklist { background: #F6F6F6; padding: 45px 0px; } .checklist-smart-circle { display: block; margin-top: 1em; float: left; width: 100%; } .ckecklist-img { float: left; padding: 10px; } .checklist-iten { margin-top: 0px; margin-left: 45px; } .checklist-iten h3 { font-size: 25px; } .checklist-iten h4 { font-size: 16px; } section.box-cta { background: #4C8289; padding: 45px 0px; margin-bottom: 60px; } .box-cta-heading{ h2 { color: #ffffff; margin: 0px; font-size: 60px; } h3 { color: #ffffff; font-size: 25px; } } /*Fim Página Smart*/ /*Página Quem Somos*/ section.text-quem-somos { p { margin: 20px 0px; } h4 { font-size: 16px; margin-bottom: 30px; } } .coluna-texto { padding-bottom: 30px; } .coluna-imagem { bottom: 0px; position: absolute; } section.box-solucoes-varejo { background-color: #F6F6F6; margin: 0px 0px; padding: 40px 0px; } .bg-verde { background-image: url("/images/background-verde.png"); p { color: #ffffff; } h2 { color:#ffffff } h5 { color:#ffffff; margin-bottom: 30px; } .text-center { text-align: center; padding: 20px 0px; } .btn-padrao { border: solid 1px #ffffff; border-radius: 0px; background-color: transparent; color: #ffffff; font-weight: bold; font-family: @helvetica; text-transform: uppercase; text-align: center; padding: 10px; transition: all 0.4s; cursor: pointer; } .btn-padrao:hover { color: #ffffff; text-decoration: none; } .btn-proposta { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; &::before{ content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #ffffffd1; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } i{ margin-left: 10px; } &:hover{ color: @verde; background-color: transparent; &::before{ -webkit-transform: scaleX(1); transform: scaleX(1); } } } } section.text-green { margin: 55px 0px; h3{ font-size: 58px; } } /*Fim Página Quem Somos*/ /*Página Contato*/ .text-contato { margin-bottom: 30px; a { color: #888; font-size: 14px; margin-bottom: 5px; display: inline-block; text-decoration: none; } a:hover { color: @vermelho; text-decoration: none; } h3{ font-size: 30px } h4 a { margin-bottom: 30px; font-size: 23px; } } .botao-contato { .btn-padrao { border: solid 1px #ffffff; background-color: @verde; color: #ffffff; font-weight: bold; font-family: @helvetica; text-transform: uppercase; padding: 10px 40px 10px 40px; margin: 30px 0px; } } section.box-contato { margin-bottom: 40px; h4{ font-size: 16px; } } section.box-mapa { margin-bottom: 30px; } i.fab.fa-facebook-square.redes.sociais { font-size: 16px; color: black; } i.fab.fa-linkedin-in { font-size: 16px; color: black; } /*Fim Página Contato*/ /*Página Contato Enviado*/ section.pg-contato-enviado { background-color: @verde; padding: 100px 0px; .row { text-align: center; } p { padding: 0px 30px 60px 30px; text-align: center; color: #ffffff; font-size: 20px; } h1{ padding: 10px 0px; text-align: center; color: #ffffff } .btn-padrao { border: solid 1px #ffffff; border-radius: 0px; background-color: transparent; color: #ffffff; font-weight: bold; font-family: @helvetica; text-transform: uppercase; text-align: center; padding: 10px; transition: all 0.4s; cursor: pointer; } .btn-padrao:hover { color: #ffffff; text-decoration: none; } .btn-proposta { margin-top: 15px; display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; &::before{ content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #ffffffd1; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } i{ margin-left: 10px; } &:hover{ color: @verde; background-color: transparent; &::before{ -webkit-transform: scaleX(1); transform: scaleX(1); } } } } /*Fim Página Contato Enviado*/ /*Página Erro*/ .pag-erro { padding: 100px 0px; background: #8F1028; text-align: center; p { padding: 30px 30px 0px 30px; color: @cinza; font-size: 25px; } h1{ padding: 10px 0px; color: #ffffff } h2{ color: #ffffff } h3 { color: #ffffff } .btn-padrao { margin-top: 30px; border: solid 1px #ffffff; background-color: transparent; color: #ffffff; font-weight: bold; font-family: @helvetica; text-transform: uppercase; } } /*Fim Página Erro*/ /*Página Antenas*/ .checksim{ color: @checksim;} .checknao{ color: @checknao;} .checkacessorio{ color: @checkacessorio;} .checksim, .checknao, .checkacessorio { font-size: 15px; margin: 0px 5px; } .table.table-borderless { th { border-bottom: 0px; border-top: 0px; } td { font-size: 14px; border-top: 0px } } .antenas{ thead { border-bottom: 1px solid #efefef; tr:hover{ background: @cinza; cursor: pointer; } tr:after { content: "\f0d7"; float: right; font-family: "Font Awesome 5 Free"; font-weight: 900; padding-top: 10px; } } } .fas.fa-asterisk { font-size: 12px; color: #1c5b64; margin-right: 10px; /* text-align: center; */ margin-bottom: auto; } /*Fim Página Antenas*/ /*Página Cases*/ .box-cases { background: #F6F6F6; padding: 30px 30px; margin-right: 70px; margin-bottom: 30px; p{ margin: 25px 0px; } h3 { font-size: 25px } } /*Fim Página Cases*/ /*Página Acessórios EAS*/ .img-centro-acessorio { text-align: center; } /*Fim Página */ /*Página Materiais*/ .materiais-margin { margin-bottom: 50px; } /*Fim Página Materiais*/ .linha-produtos { border-bottom: 1px solid #ebebeb; padding-bottom: 50px; margin-bottom: 50px; } #breadcrumbs { color: #666666; text-transform: uppercase; letter-spacing: 2px; margin-top: 40px; margin-bottom: 0px; font-size: 12px; a{ color: #666666; text-decoration: none; } } /*Home*/ .noticias-home { border-bottom: 1px solid @cinza-icone; padding-bottom: 20px; margin-bottom: 40px; &:nth-of-type(2){ border-bottom: none; } a { color: @preto-titulo; text-decoration: none; } a:hover { color: @vermelho; text-decoration: none; } h3 { font-size: 25px; } .btn-saibamais{ margin: 20px 0px; color: @vermelho; } } .noticia-destaque-home { background: white; -webkit-box-shadow: 3px 6px 14px 6px rgba(240,240,240,1); -moz-box-shadow: 3px 6px 14px 6px rgba(240,240,240,1); box-shadow: 3px 6px 14px 6px rgba(240,240,240,1); .img-fluid { width: 100%; } h3 { margin: 40px 25px 15px 25px; font-size: 25px; } a { color: @preto-titulo; text-decoration: none; } a:hover { color: @vermelho; text-decoration: none; } p { margin: 10px 25px; } .btn-saibamais{ margin: 30px; color: @vermelho; } } .carousel-slider .carousel-slider__item img { border: 1px solid #dadada; #id-905.arrows-outside .owl-next { right: -70px; opacity: 1; border: 1px solid #303539; border-radius: 50px; } #id-905.arrows-outside .owl-prev { right: -70px; opacity: 1; border: 1px solid #303539; border-radius: 50px; } } /*Fim Home*/ .artigos-lista { background-color: #F6F6F6; padding: 30px 30px; margin: 10px 20px 10px 0px; min-height: 730px; h2 { font-size: 25px; margin-top: 0px; min-height: 82px; } a { color: @preto-titulo2; text-decoration: none; } a:hover { color: @vermelho !important; text-decoration: none; } img { width: 100%; height: 230px; } .descricao { padding: 15px 0px; min-height: 222px; } .data, .categoria { padding-top: 25px; } } #subirTopo { text-decoration: none; background: @vermelho; bottom: 85px; right: 24px; color: #fff; text-align: center; cursor: pointer; padding: 10px 15px; font-size: 15px; font-weight: bold; text-transform: uppercase; position: fixed; border: 1px solid @vermelho; border-radius: 5px; font-family: "Font Awesome 5 Free"; opacity: .8; } #subirTopo:hover { opacity:1; } /*Blog*/ .artigo { margin-bottom: 50px; h1 { font-size: 30px; margin: 15px 0px 35px 0px; } h2 { font-size: 20px; color: @preto-titulo2; margin: 25px 0px; } h3 { font-size: 20px; color: @preto-titulo2; margin: 25px 0px; } h4 { font-size: 18px; color: @preto-titulo2; margin: 20px 0px; } h5 { font-size: 16px; color: @preto-titulo2; margin: 20px 0px; } h6 { font-size: 15px; color: @preto-titulo2; margin: 20px 0px; } p { font-size: 15px; } span.data { margin-right: 30px; } a { color: @preto-texto; text-decoration: none; } a:hover { color: @verde; text-decoration: none; } ul { font-family: 'Helvetica Neue'; color: #888; line-height: 1.5em; font-size: 1em; opacity: 1; margin: 15px 25px; } } .article-img { margin: 20px 0px; } .w-100.paginacao.text-center.text-sm-left { font-size: 16px; color: #888888; margin: 27px 0px; /* padding-left: 10px; */ } span.page-numbers.current { padding-right: 15px; } a.prev.page-numbers { color: #424242; text-decoration: none; background-color: transparent; border: 1px solid #424242; border-radius: 50px; padding: 2px 6px; margin: 10px; } a.page-numbers { color: #888888; text-decoration: none; background-color: transparent; } a.next.page-numbers { color: #424242; text-decoration: none; background-color: transparent; border: 1px solid #424242; border-radius: 50px; padding: 2px 6px; margin: 10px; /* border-radius: 50%; */ } /* Sidebar */ #sidebar { .widget { margin-bottom: 50px; h3 { font-size: 25px; color: @preto-titulo; } a { color: #6F6F6F; text-decoration: none; } a:hover { color: @verde; } li { padding: 10px 0px; font-size: 14px; } ul { margin-left: 20px; } } } input#s { border: 1px solid #EBEBEB; width: 80%; padding: 5px; } button#searchsubmit { background: #FFF; border: 1px solid #EBEBEB; color: #717171; padding: 5px; } .glyphicon { position: relative; top: 1px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .glyphicon-search:before { content: "\e003"; position: relative; top: 1px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .box-materiais { border: 1px solid #B4B4B4; border-radius: 8px; margin: 15px 0px; padding: 0px; img { width: 100%; } h4 { margin: 15px 20px; min-height: 100px; } p { margin: 20px 20px 50px 20px; } } .loadbutton { display: none; } //Formulário// span.wpcf7-form-control-wrap.url { display: none; } input#url { display: none; } // Página de Busca // .search { h2 { font-size: 35px; margin: 30px 0px; } a { color: @preto-titulo; text-decoration: none; background-color: transparent; } a:hover { color: @vermelho; text-decoration: none; } .categoria { a { color: @preto-lista; text-decoration: none; background-color: transparent; } a:hover { color: @vermelho; text-decoration: none; } } }