.hero-slider { width: 100%; height: 500px; display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; z-index: 0; margin-top: 100px; overflow:hidden; } @media only screen and (max-width: 1100px) { .hero-slider { margin-top: 0px; } } .slide-bg-image::before { position: absolute; content: ""; width: 100%; height: 100%; background: var(--lbluergba3); } @media (max-width: 991px) { .hero-slider { height: 500px; } } @media (max-width: 767px) { .hero-slider { height: 500px; } } .hero-slider .swiper-slide { overflow: hidden; color: var(--white); } .hero-slider .swiper-container { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .hero-slider .slide-inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center; display: flex; justify-content: center; align-items: center; text-align: left; } .hero-slider .swiper-button-prev, .hero-slider .swiper-button-next { background: transparent; width: 60px; height: 60px; line-height: 60px; padding:15px; margin-top: -30px; text-align: center; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; opacity:0; visibility:hidden; transition:all .3s ease; color:var(--white); } .hero-slider:hover .swiper-button-prev, .hero-slider:hover .swiper-button-next { transform:translateX(0); opacity:1; visibility:visible; } @media (max-width: 767px) { .hero-slider .swiper-button-prev, .hero-slider .swiper-button-next { display: none; } } .hero-slider .swiper-button-prev { left: 10px; transform:translateX(50px); } .hero-slider .swiper-button-next { right: 10px; transform:translateX(-50px); } .hero-slider .swiper-pagination-bullet { width: 15px; height: 15px; text-align: left; line-height: 15px; font-size: 15px; color: var(--black); opacity: 0.3; background:var(--white); transition:all .2s ease; } .hero-slider .swiper-pagination-bullet-active { opacity:1; } .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets, .hero-slider .swiper-pagination-custom, .hero-slider .swiper-pagination-fraction { bottom: 30px; } @media screen and (min-width: 992px) { .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets, .hero-slider .swiper-pagination-custom, .hero-slider .swiper-pagination-fraction { /* display: none; */ } } .swiper-pagination { text-align:left; } .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{ bottom:30px; max-width: 1400px; padding: 0 15px; margin: 0 auto; text-align: center !important; } @media (min-width: 767px) { .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{ bottom:30px; } } .hero-style { /*height: container;*/ transition:all .4s ease; } @media (max-width: 991px) { .hero-style { height: 500px; } } @media (max-width: 767px) { .hero-style{ height:500px; } } .container { position: relative; width: 100%; max-width: 1450px; padding: 0px 15px; margin: 0 auto; } .slideContent { display:block; width:100%; padding:15px; margin-left:75px; -webkit-backdrop-filter: saturate(100%) blur(5x); backdrop-filter: saturate(100%) blur(5px); background:var(--lbluergba5); text-align:left; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius:5px; } @media (max-width: 767px) { .slideContent{ margin-left:30px; } } .hero-style .slide-title h2 { font-size:36px; font-weight: bold; line-height: 1.1; color: var(--black); margin: 0px 0px 20px 0px; transition:all .4s ease; -webkit-font-smoothing: antialiased; text-shadow: 0px 5px 10px var(--lbluergba9); } @media (max-width: 1199px) { .hero-style .slide-title h2 { font-size:36px; } } @media (max-width: 991px) { .hero-style .slide-title h2 { font-size: 32px; } } @media (max-width: 767px) { .hero-style .slide-title h2 { font-size:32px; } } .hero-style .slide-text p { font-size: 18px !important; line-height: 1.1 !important; letter-spacing: normal; color:var(--lblue2); margin: 0px 0px 30px 0px; transition:all .4s ease; font-weight: normal; } @media (max-width: 767px) { .hero-style .slide-text p { font-weight: normal; margin: 0 0 30px; } } .hero-style .slide-btns > a:first-child { margin-right: 10px; } .slider-content{ padding: 20px 30px 20px 30px; } .slider-content a.rbt-moderbt-btn { color:var(--black); } .slider-content a.rbt-moderbt-btn svg{ } .slider-content a.rbt-moderbt-btn:hover{ color:var(--lblue2); } .slider-content a.rbt-moderbt-btn:hover svg{ color:var(--lblue2)!important; } .slidedesktop{ margin-top:100px; } .slidemobile { display: none; visibility: hidden; } @media only screen and (max-width: 1150px) { .slidedesktop{ margin-top:0px; } } @media only screen and (max-width: 840px) { .slidedesktop { display: none; visibility: hidden; } .slidemobile { display: block !important; visibility: visible !important; } } #sliderDesktop, #sliderMobile { width: 100%; margin-bottom: 30px; } #sliderDesktop .swiper, #sliderMobile .swiper { width: 100%; } #sliderMobile .swiper-mobile-prev, #sliderMobile .swiper-mobile-next, #sliderDesktop .swiper-desktop-prev, #sliderDesktop .swiper-desktop-next { position: absolute; top: 50%; bottom: auto; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border: none; background-color: transparent; color: var(--white); width: 50px; height: 50px; border: none; z-index: 10; cursor: pointer; background-image: none; margin-top: -25px; /*right: 30px;*/ left: auto; -webkit-transition: all 0.2s ease-out 0s; -moz-transition: all 0.2s ease-out 0s; -ms-transition: all 0.2s ease-out 0s; -o-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } #sliderMobile:hover .swiper-mobile-prev, #sliderMobile:hover .swiper-mobile-next, #sliderDesktop:hover .swiper-desktop-prev, #sliderDesktop:hover .swiper-desktop-next { transform: translateX(0); opacity: 1; visibility: visible; } #sliderMobile .swiper-mobile-prev, #sliderDesktop .swiper-desktop-prev { left: 10px; transform: translateX(50px); } #sliderMobile .swiper-mobile-next, #sliderDesktop .swiper-desktop-next { right: 10px; transform: translateX(-50px); } .cta-exit { background:var(--lblue2); padding:10px 15px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .cta-exit h3, .cta-exit p{ color:var(--white); line-height: 1.1; margin: 0px; padding: 0px; } .cta-exit-content p{ font-weight:bold; } .cta-modal-whatsapp { background:var(--Whats1); padding:25px 25px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; display:flex; align-items:center; } .cta-modal-whatsapp h3{ color:var(--white); line-height: 1.1; margin: 0px; padding: 0px; } .cta-modal-whatsapp svg{ position: relative; top: 0px; width:36px; height:36px; vertical-align: text-top; stroke-width: 0; fill: var(--white); transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .selo-revendedor { position: fixed; left: 15px; bottom: 50px; z-index: 9; width:175px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; overflow: hidden; background: var(--white); -webkit-box-shadow: 0px 10px 36px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 36px -5px var(--blackrgba3); box-shadow: 0px 10px 36px -5px var(--blackrgba3); padding: 10px; text-align:center; } .selo-revendedor p{ display:block; width:100%; margin-bottom:5px; font-size:11px !important; text-align:center; font-weight:bold; color:var(--black) } .selo-revendedor img{ padding: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } @media only screen and (max-width: 767px) { .selo-revendedor { width:120px; } } iframe { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .blur { -webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px); background-color: var(--whitergba6)!important } .blur-header { -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); } .cta-exit { background:var(--lblue2); padding:20px 15px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -moz-transform: skew(-15deg, 0deg); -webkit-transform: skew(-15deg, 0deg); -o-transform: skew(-15deg, 0deg); -ms-transform: skew(-15deg, 0deg); transform: skew(-15deg, 0deg); } .cta-exit h3, .cta-exit p{ color:var(--white); } .cta-exit-content p{ font-weight:bold; } .searchbox { margin-top:110px; -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); background-color: var(--whitergba5)!important; padding:25px; -webkit-box-shadow: 0px 5px 25px 0px var(--blackrgba2); -moz-box-shadow: 0px 5px 25px 0px var(--blackrgba2); box-shadow: 0px 5px 25px 0px var(--blackrgba2); } a.rbt-moderbt-btn { position: relative; height: 60px; line-height: 56px; transition: all 0.2s ease; padding: 0 26px; display: inline-block; z-index: 1; color: var(--gray1); font-weight:bold; text-transform:uppercase; } @media only screen and (max-width: 767px) { a.rbt-moderbt-btn { padding: 0 10px; } } a.rbt-moderbt-btn::before { content: ""; position: absolute; top: 0; left: 0; display: block; border-radius: 28px; background: var(--lblue2); opacity: 1; width: 56px; height: 56px; transition: all 0.3s ease; z-index: -1; } a.rbt-moderbt-btn svg{ position: relative; top: -2px; margin-left: 10px; transform: translateX(-5px); transition: all 0.3s ease; display: inline-block; width: 28px; height: 28px; fill: var(--gray1) !important; } a.rbt-moderbt-btn:hover { color: var(--white); } a.rbt-moderbt-btn:hover svg { transform: translateX(0); fill: var(--white) !important; } a.rbt-moderbt-btn:hover::before { width: 100%; background: var(--dblue2); opacity: 1; } .disabled, .rbt-btn:disabled, fieldset:disabled { pointer-events: none !important; opacity: 0.65 !important; } .rbt-btn { padding: 0 26px; background: var(--dblue2); height: 50px; line-height: 50px; color: var(--gray1); font-size: 16px; font-weight: bold; display: inline-block; position: relative; z-index: 1; transition: all 0.4s ease-in-out; /*border-radius: 6px;*/ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -moz-transform: skew(-10deg, 0deg); -webkit-transform: skew(-10deg, 0deg); -o-transform: skew(-10deg, 0deg); -ms-transform: skew(-10deg, 0deg); transform: skew(-10deg, 0deg); border: 0 none; outline: none; text-transform:uppercase; } .rbt-btn.btn-gradient { color: var(--white); background-size: 300% 100%; background-image: linear-gradient(to right, var(--lblue1), var(--lblue3), var(--lblue3), var(--lblue1)); } .rbt-btn.btn-gradient:hover { background-color: inherit; background-position: 102% 0; transition: all 0.4s ease-in-out; color:var(--white); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -moz-transform: skew(-10deg, 0deg); -webkit-transform: skew(-10deg, 0deg); -o-transform: skew(-10deg, 0deg); -ms-transform: skew(-10deg, 0deg); transform: skew(-10deg, 0deg); } .rbt-btn svg { padding-left: 6px; display: inline-block; top: -4px; position: relative; width: 28px; height: 28px; fill: var(--gray1) !important; } .rbt-btn.btn-gradient svg { padding-left: 6px; display: inline-block; top: -2px; position: relative; width: 28px; height: 28px; fill: var(--white) !important; } .rbt-btn.hover-icon-reverse .icon-reverse-wrapper { display: flex; align-items: center; justify-content: center; } .rbt-btn.hover-icon-reverse .btn-text { display: inline-block; transition: transform 0.6s 0.125s cubic-bezier(0.1, 0.75, 0.25, 1); margin-inline-start: -23px; } .rbt-btn.hover-icon-reverse .btn-icon { display: inline-block; transition: opacity 0.4s 0.25s, transform 0.6s 0.25s; transition-timing-function: cubic-bezier(0.1, 0.75, 0.25, 1); } .rbt-btn.hover-icon-reverse .btn-icon + .btn-icon { margin-inline-end: 0; margin-inline-start: 8px; display: inline-block; margin-inline-start: 0; margin-inline-end: 0; opacity: 0; transform: translateX(-10px); transition-delay: 0s; order: -2; } .rbt-btn.hover-icon-reverse .btn-icon + .btn-icon svg { padding-left: 0; padding-right: 6px; } .rbt-btn:hover { background-color: var(--syellow2); color: var(--gray1); transform: translate3d(0, -2px, 0); -webkit-box-shadow: 0px 5px 25px 0px var(--blackrgba1); -moz-box-shadow: 0px 5px 25px 0px var(--blackrgba1); box-shadow: 0px 5px 25px 0px var(--blackrgba1); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -moz-transform: skew(-10deg, 0deg); -webkit-transform: skew(-10deg, 0deg); -o-transform: skew(-10deg, 0deg); -ms-transform: skew(-10deg, 0deg); transform: skew(-10deg, 0deg); } .rbt-btn:hover.hover-icon-reverse .btn-text { transition-delay: 0.1s; transform: translateX(23px); } .rbt-btn:hover.hover-icon-reverse .btn-icon { opacity: 0; transition-delay: 0s; transform: translateX(10px); } .rbt-btn:hover.hover-icon-reverse .btn-icon + .btn-icon { opacity: 1; transform: translateX(0); transition-delay: 0.225s; } .bg-lblue-gradient { background: var(--lblue1); background: -moz-linear-gradient(left, var(--lblue1) 0%, var(--lblue3) 100%); background: -webkit-linear-gradient(left, var(--lblue1) 0%, var(--lblue3) 100%); background: linear-gradient(to right, var(--lblue1) 0%, var(--lblue3) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--lblue1)', endColorstr='var(--lblue3)', GradientType=1); } .bg-ececec{ background:var(--ececec); } .search-box-inner { position: relative; width: 100%; top: -75px; /*padding: 15px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px); background-color: var(--whitergba9) !important;*/ z-index: 10; /*-webkit-box-shadow: 0px 0px 25px 0px var(--blackrgba2); -moz-box-shadow: 0px 0px 25px 0px var(--blackrgba2); box-shadow: 0px 0px 25px 0px var(--blackrgba2);*/ } @media only screen and (max-width: 840px) { .search-box-inner { top: -15px; } } .select2-container { width: 100% !important; } .nav-item { background: transparent; color:var(--white); border: 0px !important; /*-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -webkit-border-bottom-right-radius: 0px; -webkit-border-bottom-left-radius: 0px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 0px; -moz-border-radius-bottomleft: 0px; border-top-left-radius:5px; border-top-right-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px;*/ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } @media only screen and (max-width: 575px) { .nav-tabs .nav-link { padding: 15px 25px 25px; } } .nav-tabs .nav-link { display: block; padding: 15px 45px 25px; border: 0px !important; font-weight:bold; font-size:14px; color: var(--white); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background:var(--dblue2); } @media only screen and (max-width: 575px) { .nav-tabs .nav-link { padding: 15px 25px 25px; } .rbt-btn.hover-icon-reverse .btn-text{ font-size:12px; } } .nav-link a, .nav-link a:hover, .nav-link a:focus{ color: var(--white); } .nav-tabs{ border:0px; } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { color: var(--dblue2); background: var(--white); border:0px; } .tab-content{ top:-10px; position:relative; padding: 15px 25px 10px 25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background: var(--white); -webkit-box-shadow: 0px 20px 25px 0px var(--blackrgba2); -moz-box-shadow: 0px 20px 25px 0px var(--blackrgba2); box-shadow: 0px 20px 25px 0px var(--blackrgba2); } .tab-content h3{ font-size:16px; font-weight:normal; } .tab-content h3 strong{ font-size:16px; font-weight:bold; color: var(--lblue2); } .top-4px svg { top:-4px !important; } /* .search-top{ width: 100%; height: auto; background: var(--dbluergba8); background:#fc0; padding:25px; margin-top: -100px; position: relative; z-index: 10; -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba3); box-shadow: 0px 10px 30px -5px var(--blackrgba3); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-backdrop-filter: saturate(150%) blur(7x); backdrop-filter: saturate(150%) blur(7px); } .search-top label{ font-weight: bold; font-size: 12px; text-transform: uppercase; color: var(--white); } */ .backdrop { position: fixed; top: 0; left: 0; width: 100%; height: 100%; /*background-color: var(--whitergba5)!important;*/ display: none; /*-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);*/ /*-webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px);*/ z-index: 2995; transition: all 0.4s cubic-bezier(.7, 1, .7, 1); } .show-backdrop{ visibility:visible; display:block; } .hidden-backdrop{ visibility:hidden; display:none; } .radius7{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; overflow:hidden; } /*SOCIAL*/ .social-icons li a { background: var(--lblue2); color: var(--white); } /*SOCIAL*/ .social-icons-gray li a { background: var(--f4f4f4); color: var(--gray4); } .color-white { color: var(--white)!important } .color-dblue { color: var(--dblue2); } .color-lblue { color: var(--lblue2); } .color-orange { color: var(--orange2); } .bg-white { background: var(--white); } .bg-dblue { background: var(--dblue2); } .bg-f4f4f4 { background: var(--f4f4f4); } .bg-f1f1f1{ background: var(--f1f1f1); } .bg-lblue { background: var(--lblue2); } .bg-orange { background: var(--orange2); } .bg-blackrgba1 { background: var(--blackrgba1); } .radius50 { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .btn { font-family:var(--theme-font); font-size: 16px; line-height: 1.4; font-weight: 700; padding: 12px 40px; text-align: center; text-transform: uppercase; color: var(--white); border: 2px solid var(--orange2); background-color: var(--orange2); box-sizing: border-box; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; -webkit-border-radius: 7px; -moz-border-radius:7px; border-radius:7px; -moz-transform: skew(-10deg, 0deg); -webkit-transform: skew(-10deg, 0deg); -o-transform: skew(-10deg, 0deg); -ms-transform: skew(-10deg, 0deg); transform: skew(-10deg, 0deg); } .btn:hover, .btn:focus { background-color: var(--gray5); border-color: var(--gray5); color: var(--white); } .btn.btn-center { margin: 0 auto; width: auto; min-width: 160px } .btn.btn-lg { padding: 16px 40px; font-size: 16px; } .btn.btn-lgp { padding: 12px 60px; font-size: 16px; } .btn.btn-md { padding: 8px 20px } .btn.btn-sm { padding: 5px 25px; } .btn.round { -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; } .btn.btn-mw { min-width: 190px } .btn-arrow { position: relative; } .btn-arrow span { display: inline-block; position: relative; -webkit-transition: all 300ms ease-out; -o-transition: all 300ms ease-out; transition: all 300ms ease-out; will-change: transform; } .btn-arrow:hover span, .btn-arrow:focus span { -webkit-transform: translate3d(-1rem, 0, 0); transform: translate3d(-1rem, 0, 0); } .btn-arrow i { position: absolute; width: 1.1em; right: 0px; right: 0rem; opacity: 0; top: 49%; font-size: 24px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 300ms ease-out; -o-transition: all 300ms ease-out; transition: all 300ms ease-out; will-change: right, opacity; } .btn-arrow:hover i, .btn-arrow:focus i { opacity: 1; right: -2rem; } .btn-arrow svg { position: absolute; width: 24px; height: 24px; right: 0px; right: 0rem; opacity: 0; top: 49%; font-size: 24px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 300ms ease-out; -o-transition: all 300ms ease-out; transition: all 300ms ease-out; will-change: right, opacity; vertical-align: text-top; stroke-width:0; fill:var(--orange2) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .btn:focus svg, .btn:hover svg{ fill:var(--white) !important; opacity: 1; right: -2rem; } .btn-orange { color: var(--white); border: 2px solid var(--orange2); background-color: var(--orange2); } .btn-orange:hover, .btn-orange:focus { background-color: var(--orange3); border-color: var(--orange3); color: var(--white) } .btn-lblue { color: var(--white); border: 2px solid var(--lblue2); background-color: var(--lblue2); } .btn-lblue:hover, .btn-lblue:focus { background-color: var(--lblue3); border-color: var(--lblue3); color: var(--white) } .btn-dblue { color: var(--white); border: 2px solid var(--dblue2); background-color: var(--dblue2); } .btn-dblue:hover, .btn-dblue:focus { background-color: var(--dblue3); border-color: var(--dblue3); color: var(--white) } .btn-whatsapp { color: var(--white); border: 2px solid var(--Whats1); background-color: var(--Whats1); } .btn-whatsapp:hover, .btn-whatsapp:focus { background-color: var(--Whats2); border-color: var(--Whats2); color: var(--white) } .image-bl, .image-bl img { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .site-heading h1, .site-heading h2, .site-heading h3 { display: inline-block; font-weight: 700; padding-bottom: 10px; margin-bottom: 0; position: relative; line-height: 1.2; color: var(--lblue2); } .site-heading-lblue h1, .site-heading-lblue h2, .site-heading-lblue h3 { color: var(--lblue2); } .site-heading span{ display:block; width:100%; margin: 0px 0px 5px 0px; font-weight: bold; font-size: 16px; color:var(--lblue2); line-height: 1.1; text-transform:uppercase; } .site-heading p { margin: 0; margin-top: 15px; font-weight: 600; font-size: 18px !important; line-height: 1.1; color: var(--orange2); } .site-heading h1::before, .site-heading h2::before, .site-heading h3::before { background: var(--dblue2) none repeat scroll 0 0; bottom: 0; content: ""; height: 5px; left: 50%; margin-left: -35px; position: absolute; width:35px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .site-heading-lblue h1::before, .site-heading-lblue h2::before, .site-heading-lblue h3::before { background: var(--lblue2) none repeat scroll 0 0; } .site-heading h1::after, .site-heading h2::after, .site-heading h3::after { background: var(--lblue2) none repeat scroll 0 0; bottom: 0; content: ""; height: 5px; left: 20px; margin-left:20px; position: absolute; width: 75px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .site-heading.text-left h1::before, .site-heading.text-left h2::before, .site-heading.text-left h3::before { left: 0; margin-left: 0; } .site-heading.text-left h1::after, .site-heading.text-left h2::after, .site-heading.text-left h3::after { left: 25px; margin-left: 0; } .product-block-one .inner-box{ position: relative; display: block; } .product-block-one .inner-box .image-box{ position: relative; display: block; overflow: hidden; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: 0px 3px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 3px 20px 0px var(--blackrgba1); box-shadow: 0px 3px 20px 0px var(--blackrgba1); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .product-block-one .inner-box:focus .image-box, .product-block-one .inner-box:hover .image-box { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba3); box-shadow: 0px 10px 30px -5px var(--blackrgba3); } .product-block-one .inner-box .image-box img{ -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; width: 100%; } .product-block-one .inner-box:hover .image-box img{ -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .product-block-one .inner-box:hover .inner, .product-block-one .inner-box:focus .inner{ background:var(--lblue2); -webkit-box-shadow: 0px 10px 50px 0px var(--blackrgba3); -moz-box-shadow: 0px 10px 50px 0px var(--blackrgba3); box-shadow: 0px 10px 50px 0px var(--blackrgba3); } .product-block-one .inner-box .lower-content{ position: relative; top:-15px; margin: 0px 0px; padding:15px; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; -webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px); background-color: var(--whitergba7)!important; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: 0px 3px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 3px 20px 0px var(--blackrgba1); box-shadow: 0px 3px 20px 0px var(--blackrgba1); } .product-block-one .inner-box:focus .lower-content, .product-block-one .inner-box:hover .lower-content { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba3); box-shadow: 0px 10px 30px -5px var(--blackrgba3); } .product-block-one .inner-box .lower-content .inner{ position: relative; /*background:var(--lblue2);*/ padding:20px 25px 20px 25px; margin-top: -25px; z-index: 1; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; -webkit-box-shadow: 0px 5px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 5px 20px 0px var(--blackrgba1); box-shadow: 0px 5px 20px 0px var(--blackrgba1); -webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px); background-color: var(--whitergba8)!important; } .product-block-one .inner-box:hover .inner, .product-block-one .inner-box:focus .inner{ background:var(--lblue2); -webkit-box-shadow: 0px 10px 50px 0px var(--blackrgba3); -moz-box-shadow: 0px 10px 50px 0px var(--blackrgba3); box-shadow: 0px 10px 50px 0px var(--blackrgba3); } .product-block-one .lower-content .name{ font-size: 16px; line-height: 1.1; color: var(--black); font-weight: 600; margin:5px 0 5px; } .product-block-one .lower-content .name a{ color:var(--orange2); } .product-block-one:hover .lower-content .name a{ color: var(--lblue2); } .product-block-one .lower-content ul { border-top: 0px solid var(--blackrgba2); margin-top:10px; margin-bottom:10px; margin-left: auto; margin-right: auto; overflow: hidden; padding: 0px 0px 0px 0px; } .product-block-one .lower-content li svg { position: relative; top:0px; width:18px; height:18px; vertical-align: text-top; stroke-width: 0; fill: var(--orange2) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .product-block-one .lower-content li { float: left; font-size: 14px; list-style: outside none none; padding: 7px 0px 7px 0px; margin-bottom: 0px; width: 100%; font-weight: normal; border-top: 1px solid var(--blackrgba1); } .product-block-one .lower-content li:first-child, .product-block-one .lower-content li:last-child { border-bottom: 0px solid var(--blackrgba2); } .product-block-one .inner-box .detail { position: absolute; top:0px; opacity:0; left: 15px; width: 150px; height:36px; display: flex; font-size:12px; justify-content: center; align-items: center; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; text-align:center; z-index:10; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius:3px; background:var(--lblue2); color:var(--white); } .product-block-one .inner-box .detail span{ position:relative; top:3px; padding-left:3px; color:var(--white); } .product-block-one .inner-box:focus .detail, .product-block-one .inner-box:hover .detail { opacity: 1; top: 20px; } .detail:focus, .detail:hover { background:var(--dblue2) !important; } .product-block-one .inner-box .detail svg { position: relative; top: 0px; width:20px; height:20px; vertical-align: text-top; stroke-width:0; fill:var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .product-block-one .lower-content .add-to-cart{ position: relative; display: block; line-height: 40px; text-align: center; display: block; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; } .form-product{ display: block; position: relative; width: 100%; } .form-product .collunform{ display: block; position: relative; float: left; margin: 0px 0px; width:40%; /*width: calc(40% - 10px);*/ } .form-product .collunformtwo{ display: block; position: relative; float: left; margin: 0px 0px; width:60%; /*width: calc(60% - 10px);*/ } .form-product .collunform .formQuantt{ display: block; padding:6px 10px 6px 10px !important; font-size: 15px; color: var(--orange2); width: 100%; height:40px; background-color: var(--white); outline: none !important; background-clip: padding-box; border: 1px solid var(--Whatsrgba2) !important; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } .form-product .collunform .formQuantt:focus, .form-product .collunform .formQuantt:hover { color: var(--gray2); background-color: var(--white); border-color: var(--blackrgba5); outline: 0; -webkit-box-shadow: 0px 0px 15px 0px var(--blackrgba1); -moz-box-shadow: 0px 0px 15px 0px var(--blackrgba1); box-shadow: 0px 0px 15px 0px var(--blackrgba1); } .form-product .collunformtwo .button { font-family: var(--theme-font); font-size: 14px; line-height: 1.0; font-weight: bold; padding: 9px 10px 8px; text-align: center !important; text-transform: uppercase; color: var(--white); border: 2px solid var(--green); background-color: var(--green); box-sizing: border-box; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; width:100%; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .form-product .button:hover, .form-product .button:focus { background-color: var(--greenhover); border-color: var(--greenhover); color: var(--white); -webkit-box-shadow: 0px 5px 15px 0px var(--Whatsrgba2); -moz-box-shadow: 0px 5px 15px 0px var(--Whatsrgba2); box-shadow: 0px 5px 15px 0px var(--Whatsrgba2); } .form-product .form-control::-webkit-input-placeholder { opacity: 0.6; color: var(--gray3); } .form-product .form-control::-moz-placeholder { opacity: 0.6; color: var(--gray3); } .form-product .form-control:-ms-input-placeholder { opacity: 0.6; color: var(--gray3); } .read-whatsapp { font-family: var(--theme-font); font-size: 12px; line-height: 1.0; font-weight: bold; padding: 9px 10px 8px 10px; text-align: center !important; text-transform: uppercase; color: var(--whatstx); border: 2px solid var(--whatstx); background-color: var(--whatsbg); box-sizing: border-box; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; width:100%; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; width:100%; display:block; } .read-whatsapp svg{ position: relative; top:-2px; width: 22px; right: 3px; height: 22px; vertical-align: text-top; stroke-width: 0; fill: var(--whatstx) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .read-whatsapp span{ position: relative; top:3px; } .read-whatsapp:hover svg, .read-whatsapp:focus svg{ fill: var(--whatsbg) !important; } .read-whatsapp:hover, .read-whatsapp:focus { background-color: var(--whatstx); border-color: var(--whatstx); color: var(--whatsbg); -webkit-box-shadow: 0px 5px 15px 0px var(--Whatsrgba2); -moz-box-shadow: 0px 5px 15px 0px var(--Whatsrgba2); box-shadow: 0px 5px 15px 0px var(--Whatsrgba2); } .shop-item{ position: relative; -webkit-box-shadow: 0px 0px 25px 0px var(--blackrgba1); -moz-box-shadow: 0px 0px 25px 0px var(--blackrgba1); box-shadow: 0px 0px 25px 0px var(--blackrgba1); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; overflow: hidden; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .shop-item:hover, .shop-item:focus{ -webkit-box-shadow: 0px 10px 35px -5px var(--blackrgba2); -moz-box-shadow: 0px 10px 35px -5px var(--blackrgba2); box-shadow: 0px 10px 35px -5px var(--blackrgba2); } .shop-item .inner-box{ position: relative; overflow: hidden; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .shop-item:hover .inner-box{ /*-webkit-box-shadow: 0px 0px 25px 0px var(--blackrgba2); -moz-box-shadow: 0px 0px 25px 0px var(--blackrgba2); box-shadow: 0px 0px 25px 0px var(--blackrgba2);*/ } .shop-item .inner-box .image-box{ position: relative; display: block; overflow: hidden; /*-webkit-box-shadow: 0px 3px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 3px 20px 0px var(--blackrgba1); box-shadow: 0px 3px 20px 0px var(--blackrgba1);*/ -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .shop-item .inner-box:focus .image-box, .shop-item .inner-box:hover .image-box { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); /*-webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba3); box-shadow: 0px 10px 30px -5px var(--blackrgba3);*/ } .shop-item .inner-box .image-box img{ -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; width: 100%; } .shop-item .inner-box:focus .image-box img, .shop-item .inner-box:hover .image-box img{ -moz-transform: scale(1.05); -webkit-transform: scale(1.05); -o-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .shop-item .inner-box .detail { position: absolute; top:0px; opacity:0; left: 15px; width: 150px; height:36px; display: flex; font-size:12px; justify-content: center; align-items: center; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; text-align:center; z-index:10; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius:3px; background:var(--lblue3); color:var(--white); } .shop-item .inner-box .detail span{ position:relative; top:0px; padding-left:7px; } .shop-item .inner-box:focus .detail, .shop-item .inner-box:hover .detail { opacity: 1; top: 20px; } .detail:focus, .detail:hover { background:var(--dblue2) !important; } .shop-item .inner-box .detail svg { position: relative; top: 0px; width:16px; height:16px; vertical-align: text-top; stroke-width:0; fill:var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .btn-detail-read { color: var(--white); text-align:center; font-size:12px; } .btn-detail-read:hover, .btn-detail-read:focus { color: var(--white); } .shop-item .inner-box .image{ position: relative; margin-bottom: 0; } .shop-item .inner-box .image img{ display: block; width: 100%; } .shop-item .lower-content{ position: relative; padding:15px 20px 25px; z-index: 0; -webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px); background-color: var(--whitergba7)!important; margin: 0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .shop-item:hover .lower-content{ margin-top: -80px; padding-bottom: 80px; } .shop-item .lower-content .name{ font-size: 15px; line-height: 1.1; color: var(--black); font-weight: 600; margin: 8px 0 3px; } .shop-item .lower-content .name a{ color:var(--orange2); } .shop-item:hover .lower-content .name a{ color: var(--black); } .shop-item .lower-content .add-to-cart{ position: absolute; display: block; width: calc(100% - 40px); height: 40px; line-height: 40px; text-align: center; display: block; font-size: 15px; font-weight: 600; border-radius: 7px; bottom:0px; opacity:0; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; } .shop-item .lower-content .add-to-cart span{ margin-right: 10px; } .shop-item .lower-content .add-to-cart:hover{ color: var(--white); } .shop-item:hover .add-to-cart{ opacity: 1; bottom:25px; -webkit-transition: all 0.3s ease, opacity 0.3s linear 0.15s, bottom 0.3s ease 0.15s; transition: all 0.3s ease, opacity 0.3s linear 0.15s, bottom 0.3s ease 0.15s; } .shop-item .lower-content .icon-item{ display: block; margin: auto; height:50px; width:50px; text-align: center; position: absolute; padding:10px; right: 15px; top:-25px; background:var(--lblue2); -webkit-box-shadow: 0px 5px 25px 0px var(--blackrgba1); -moz-box-shadow: 0px 5px 25px 0px var(--blackrgba1); box-shadow: 0px 5px 25px 0px var(--blackrgba1); -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } .shop-item .lower-content .icon-item img{ width: 100%; filter: invert(1); } .item-brand { /*display:flex; flex-wrap:wrap;*/ display: flex; flex-wrap: wrap; margin: 0 auto; max-width: 2000px; justify-content: flex-start; align-items: stretch; } .item-img { background:var(--white); margin:0px 15px 15px 0px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius:7px; -webkit-box-shadow: 0px 5px 25px 0px var(--blackrgba1); -moz-box-shadow: 0px 5px 25px 0px var(--blackrgba1); box-shadow: 0px 5px 25px 0px var(--blackrgba1); padding:15px; width: 160px; /*flex: 1 0 160px;*/ } .cta-item { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius:7px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; overflow:hidden; position:relative; background:var(--white); } .bg-cover-radius { position: relative; z-index: 1; background-position: center center; background-attachment: scroll; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-border-radius: 7px !important; -moz-border-radius:7px !important; border-radius:7px !important; overflow:hidden; } .bg-cover-radius:before { top: 0; left: 0; width: 100%; height: 100%; content: " "; position: absolute; background: var(--dbluergba7); -webkit-border-radius: 7px !important; -moz-border-radius:7px !important; border-radius:7px !important; overflow:hidden; } .cta-item .ot-heading { margin-bottom: 0; padding-left:25px; padding-right:25px; } .cta-item .ot-heading span { display:block; color: var(--white); font-size: 20px; font-weight: 600; text-transform: uppercase; margin-bottom: 30px; line-height:1.2 } .cta-item h3{ color: var(--white); font-size: 36px; line-height:1.1; /*letter-spacing:-1px;*/ text-transform:uppercase; margin-bottom: 30px; } .cta-item .ot-button { display:block; margin-top:20px; } .request-form{ position: relative; -webkit-box-shadow: 0px 0px 35px 0px var(--blackrgba1); -moz-box-shadow: 0px 0px 35px 0px var(--blackrgba1); box-shadow: 0px 0px 35px 0px var(--blackrgba1); padding: 40px 40px 20px; border-radius: 10px; background: var(--white); } .request-form .title{ position: relative; margin-bottom: 40px; } .request-form .title h4{ font-size: 28px; line-height: 1.4em; color: #000000; font-weight: 700; margin-bottom: 10px; } .request-form .row{ margin: 0 -10px; } .request-form .form-group{ position: relative; padding: 0 10px; margin-bottom: 20px; } .request-form .form-group input[type="text"], .request-form .form-group input[type="email"], .request-form .form-group input[type="url"], .request-form .form-group textarea, .request-form .form-group select{ position: relative; display: block; width: 100%; height: 50px; font-size: 16px; color: var(--gray3); line-height: 25px; padding:10px 15px !important; border:3px solid var(--f4f4f4); background-color: var(--white); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; font-weight: 400; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .request-form .form-group textarea{ height:75px; resize: none; } .request-form .form-group button{ padding-left: 36px; padding-right: 36px; margin-top: 10px; } .request-form .form-group input[type="email"]:focus, .request-form .form-group input[type="email"]:hover, .request-form .form-group input[type="url"]:focus, .request-form .form-group input[type="url"]:hover, .request-form .form-group textarea:focus, .request-form .form-group textarea:hover, .request-form .form-group select:focus, .request-form .form-group select:hover, .request-form .form-group input[type="text"]:focus, .request-form .form-group input[type="text"]:hover { color: var(--gray3); background-color: var(--white); border-color:var(--blackrgba5); outline: 0; -webkit-box-shadow: 0px 0px 25px 0px var(--blackrgba2); -moz-box-shadow: 0px 0px 25px 0px var(--blackrgba2); box-shadow: 0px 0px 25px 0px var(--blackrgba2); } .accordion-box{ position:relative; margin-bottom: 30px; } .accordion-box .block{ position: relative; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; border-top: 1px solid var(--f4f4f4); } .accordion-box .block .acc-btn{ position: relative; font-size:22px; font-weight: 600; line-height: 25px; cursor: pointer; padding: 20px 55px; padding-right: 15px; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; font-family: var(--special-font) !important; } .accordion-box .block .acc-btn.active{ color:var(--dblue2); } .accordion-box .block .acc-btn .icon{ position: absolute; left: 25px; top: 20px; line-height: 25px; font-size: 14px; color:var(--white); } .accordion-box .block .acc-btn .icon svg { position: relative; left:0px; top: -3px; width: 28px; height: 28px; vertical-align: text-top; stroke-width: 1.5; /*stroke: var(--white);*/ fill: var(--orange2); } .accordion-box .block .acc-btn.active .icon{ transform:scaleY(-1); color:var(--dblue2); } .accordion-box .block .acc-content{ position:relative; display:none; padding: 5px 25px 30px 25px; } .accordion-box .block .acc-content.current{ display:block; } .accordion-box .block .content .text{ position:relative; font-size: 16px; line-height: 1.1; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; color:var(--white) } .accordion-box .block .acc-content .text, .accordion-box .block .acc-content p{ color:var(--dblue2) !important; } .accordion-box.style-three .block .acc-btn{ padding: 20px 25px; padding-right: 35px; font-family: var(--special-font) !important; } .accordion-box.style-three .block .acc-btn .icon{ -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; left: auto; right: 25px; } .accordion-box.style-three .block .acc-btn .icon:before{ font-size: 32px; } .ctaOne { position: relative; padding-top: 65px; padding-bottom: 30px; /*background: var(--lblue2);*/ min-height: 600px; display: flex; align-items: center; background: var(--white); } .ctaOne:before { content: ""; position: absolute; bottom: 0px; right: -75%; width: 100%; height: 100%; /*height: calc(100% + 100px);*/ -moz-transform: skew(-20deg, 0deg); -webkit-transform: skew(-20deg, 0deg); -o-transform: skew(-20deg, 0deg); -ms-transform: skew(-20deg, 0deg); transform: skew(-20deg, 0deg); background: var(--dblue2); background-repeat: no-repeat; background-position: top left; transition: all 0.4s cubic-bezier(.7, 1, .7, 1); z-index: 2; background: var(--dblue1); background: -webkit-linear-gradient(140deg, var(--dblue1) 25%, var(--dblue3) 100%); background: -moz-linear-gradient(140deg, var(--dblue1) 25%, var(--dblue3) 100%); background: -ms-linear-gradient(140deg, var(--dblue1) 25%, var(--dblue3) 100%); background: -o-linear-gradient(140deg, var(--dblue1) 25%, var(--dblue3) 100%); background: linear-gradient(140deg, var(--dblue1) 25%, var(--dblue3) 100%); } @media only screen and (max-width: 767px) { .ctaOne:before { right: -95%; } } .contentCta { position: relative; z-index: 3; } .about-image-list { position: relative; z-index:10 } .about-images { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; overflow:hidden; -webkit-box-shadow: 0px 3px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 3px 20px 0px var(--blackrgba1); box-shadow: 0px 3px 20px 0px var(--blackrgba1); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .about-images:focus, .about-images:hover { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba3); box-shadow: 0px 10px 30px -5px var(--blackrgba3); } .about-images img { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; overflow:hidden; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; filter: grayscale(50%); -webkit-filter: grayscale(50%); } .about-images img:hover{ -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); filter: grayscale(0%); -webkit-filter: grayscale(0%); } .news-block .inner{ position: relative; display: block; } .news-block .image-box{ position: relative; display: block; background: var(--dblue3); -webkit-border-radius:7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: 0px 3px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 3px 20px 0px var(--blackrgba1); box-shadow: 0px 3px 20px 0px var(--blackrgba1); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; overflow: hidden; } .news-block:focus .image-box, .news-block:hover .image-box { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba3); box-shadow: 0px 10px 30px -5px var(--blackrgba3); } .news-block .image-box img{ display: block; width: 100%; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .news-block .inner:hover .image-box img{ -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .news-block .image-box a{ position: relative; display: block; } .news-block .image-box a:before{ content: ''; position: absolute; left: 50%; top: 50%; margin-top: -25px; margin-left: -1px; height: 50px; border-right: 3px solid var(--white); z-index: 1; transform: scaleY(0); transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; -webkit-border-radius:7px; -moz-border-radius: 7px; border-radius: 7px; } .news-block .image-box a:after{ content: ''; position: absolute; left: 50%; top: 50%; margin-top: -1px; margin-left: -25px; width: 50px; border-bottom: 3px solid var(--white); z-index: 1; transform: scaleX(0); transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; -webkit-border-radius:7px; -moz-border-radius: 7px; border-radius: 7px; } .news-block .inner:hover .image-box a:before, .news-block .inner:hover .image-box a:after{ transform: scale(1); transition:all 0.3s ease 300ms; -moz-transition:all 0.3s ease 300ms; -webkit-transition:all 0.3s ease 300ms; -ms-transition:all 0.3s ease 300ms; -o-transition:all 0.3s ease 300ms; } .news-block .lower-box{ position: relative; background:var(--white); padding:20px 15px 20px 15px; margin: -30px 0px 0px 0px; z-index: 1; -webkit-border-radius:7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; -webkit-box-shadow: 0px 5px 20px 0px var(--blackrgba1); -moz-box-shadow: 0px 5px 20px 0px var(--blackrgba1); box-shadow: 0px 5px 20px 0px var(--blackrgba1); } .news-block .image-box .category{ position: absolute; bottom:30px; right:15px; display: inline-block; vertical-align: top; font-size: 16px; text-transform: uppercase; line-height: 24px; padding: 5px 15px; color: var(--white); -webkit-border-radius:7px; -moz-border-radius: 7px; border-radius: 7px; background: var(--dbluergba7); z-index:20 } .news-block .image-box .category svg { position: relative; top: 0px; width: 16px; height:16px; vertical-align: text-top; stroke-width:0; fill:var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .news-block h3{ font-weight: 600; margin-bottom: 0px; color:var(--lblue2); font-size:20px; line-height:1.2 } .news-block .text p{ position: relative; padding-top: 12px; line-height:1.1 } .news-block h3 a:hover{ color:var(--lblue3) } .linking { position:relative; color: var(--lblue2); font-size: 15px; font-weight: bold; font-family:var(--theme-font) !important; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; text-transform:uppercase; } .linking:before { position: absolute; content: ""; bottom: -10px; left: 0; width: 0; height: 3px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius:7px; } .linking:hover:before { width: 100%; background: var(--lblue1); } .linking svg { position: relative; top: -2px; right: 30px; width: 24px; height: 24px; vertical-align: text-top; stroke-width: 0; fill: var(--lblue2); opacity: 0; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .linking:hover { color: var(--lblue1); } .linking:hover svg { opacity: 1; right: 0px; fill: var(--lblue1) !important; } .item-servicos{ margin:0px; padding-bottom:10px; text-align: center; width: 100%; display: block; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; background: var(--lblue2); -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba1); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba1); box-shadow: 0px 10px 30px -5px var(--blackrgba1); -webkit-transition: all 0.2s ease-out 0s; -moz-transition: all 0.2s ease-out 0s; -ms-transition: all 0.2s ease-out 0s; -o-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .item-servicos:focus, .item-servicos:hover{ -webkit-box-shadow: 0px 5px 35px 0px var(--lbluergba3); -moz-box-shadow: 0px 5px 35px 0px var(--lbluergba3); box-shadow: 0px 5px 35px 0px var(--lbluergba3); -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); background: var(--lblue1); -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); } .item-servicos-content{ display: block; width: 100%; padding-right: 20px; padding-left: 20px; margin-bottom: 10px; padding-bottom: 5px; } .item-servicos h1 { color:var(--dblue2); font-size: 18px; line-height: 1.1; font-weight: bold; position: relative; text-transform:uppercase; } .item-servicos .icon{ width:100%; padding:30px 30px 30px 30px; text-align: center; display: block ; } .item-servicos .icon svg{ position: relative; top: 3px; width: 150px; height: 150px; vertical-align: text-top; stroke-width: 0; fill: var(--dblue2) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } @media only screen and (max-width: 575px) { .item-servicos .icon svg{ width: 100%; height: auto; } } .item-servicos:focus .icon svg, .item-servicos:hover .icon svg{ fill: var(--orange2) !important; -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .item-servicos:focus h1, .item-servicos:hover h1{ color: var(--orange2) !important; } .item-servicos img { width:150px; margin:0px auto 10px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; /*filter: invert(100%);*/ } .card-item { padding:15px 15px 0px 15px; -webkit-box-shadow: 0px 5px 25px 0px var(--blackrgba1); -moz-box-shadow: 0px 5px 25px 0px var(--blackrgba1); box-shadow: 0px 5px 25px 0px var(--blackrgba1); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; overflow:hidden; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; background:var(--white) } .card-item img { margin:0px; width:100%; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .card-item:active, .card-item:focus, .card-item:hover { -webkit-box-shadow: 0px 5px 35px 0px var(--blackrgba2); -moz-box-shadow: 0px 5px 35px 0px var(--blackrgba2); box-shadow: 0px 5px 35px 0px var(--blackrgba2); -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); } #listCars .swiper-button-next, #listCars .swiper-button-prev { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size)/ 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(-1 * var(--swiper-navigation-size)/ 2); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--white); background-color: var(--dblue2); width: 50px; height: 50px; -webkit-border-radius: 50px; -moz-border-radius:50px; border-radius:50px; } #listCars .swiper-button-next img, #listCars .swiper-button-prev img { height: 15px; width: auto; display: block; } #listCars .swiper-button-next:hover, #listCars .swiper-button-prev:hover{ opacity: 1; border: none; } #listCars .swiper-button-prev { left: -20px; right: auto } #listCars .swiper-button-next { right: -20px; left: auto } #listCars .swiper-button-prev:hover{ border: none; background-color: var(--black); } #listCars .swiper-button-next:hover{ border: none; background-color: var(--black); } #listCars .swiper-button-next:active, #listCars .swiper-button-prev:active, #listCars .swiper-button-next:focus, #listCars .swiper-button-prev:focus{ border: none; } #listCars .swiper-button-next:active:hover, #listCars .swiper-button-prev:active:hover, #listCars .swiper-button-next:focus:hover, #listCars .swiper-button-prev:focus:hover{ border: none; } #listCars .swiper-button-next:after, #listCars .swiper-button-prev:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; line-height: 1; display:none; visibility:hidden; } .cd-popup { position: fixed; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--blackrgba7); opacity: 0; visibility: hidden; -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s; -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s; transition: opacity 0.3s 0s, visibility 0s 0.3s; z-index: 9999 } .cd-popup.is-visible { opacity: 1; visibility: visible; -webkit-transition: opacity 0.3s 0s, visibility 0s 0s; -moz-transition: opacity 0.3s 0s, visibility 0s 0s; transition: opacity 0.3s 0s, visibility 0s 0s; } .cd-popup-container { position: relative; width: 90%; max-width: 400px; margin: 4em auto; background: var(--white); border-radius: 0; text-align: center; box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); -webkit-transform: translateY(-40px); -moz-transform: translateY(-40px); -ms-transform: translateY(-40px); -o-transform: translateY(-40px); transform: translateY(-40px); /* Force Hardware Acceleration in WebKit */ -webkit-backface-visibility: hidden; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: 0px 5px 25px 0px var(--blackrgba2); -moz-box-shadow: 0px 5px 25px 0px var(--blackrgba2); box-shadow: 0px 5px 25px 0px var(--blackrgba2); overflow: hidden; } .cd-popup-container p { padding: 3em 1em; font-size: 18px; font-weight: 600; margin-bottom: 0px; color: var(--gray3); } .cd-popup-container .cd-buttons:after { content: ""; display: table; clear: both; } .cd-popup-container .cd-buttons li { float: left; width: 50%; list-style: none !important; } .cd-popup-container .cd-buttons a { display: block; height: 50px; line-height: 50px; text-transform: uppercase; color: var(--white); -webkit-transition: background-color 0.2s; -moz-transition: background-color 0.2s; transition: background-color 0.2s; } .cd-popup-container .cd-buttons li:first-child a { background: var(--lblue2); } .cd-popup-container .cd-buttons li:first-child a:hover, .no-touch .cd-popup-container .cd-buttons li:first-child a:hover { background-color: var(--lblue1) !important; color: var(--white) !important; } .cd-popup-container .cd-buttons li:last-child a { background: var(--dblue2); } .cd-popup-container .cd-buttons li:last-child a:hover, .no-touch .cd-popup-container .cd-buttons li:last-child a:hover { background-color: var(--dblue1) !important; color: var(--white) !important; } .cd-popup-container .cd-popup-close { position: absolute; top: 5px; right: 5px; width: 38px; height: 38px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } @media only screen and (min-width: 1170px) { .cd-popup-container { margin: 8em auto; } } .transparent50 { opacity: 0.5; filter: alpha(opacity=50); /* For IE8 and earlier */ } .table-hover tbody tr { transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; } .shopping-cart .dellcadlist { opacity: 1; color: var(--red) !important; font-size: 24px; transition: all 500ms ease; -moz-transition: all 500ms ease; -webkit-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; padding: 5px 10px; background: var(--cccccc); text-align: center; } .shopping-cart .dellcadlist:hover { color: var(--white) !important; background: var(--red); } /*Quantity Field Form*/ .shopping-cart .quantity-button { color: var(--gray3); width: 38px; height: 40px; padding: 5px; border: none; outline: none; cursor: pointer; font-size: 18px; background: var(--f4f4f4); text-align: center; font-weight: normal; white-space: nowrap; display: inline-block; background-image: none; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .shopping-cart .quantity-field { width: 60px; height: 40px; outline: none; margin: 0px; font-size: 18px; text-align: center; padding: 5px; display: inline-block; border: 0px solid #ccc; color: var(--gray3); font-weight: bold; background: var(--f4f4f4); -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .valido { border: 3px solid #1ec01e !important; } .invalido { border: 3px solid #c00 !important; } .quantity-button svg { position: relative; top: 0px; width: 24px; height: 24px; vertical-align: text-top; stroke-width:0; fill:var(--orange2) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .dellcadlist svg { position: relative; top:3px; width: 22px; height: 22px; vertical-align: text-top; stroke-width:0; fill:var(--orange2) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .dellcadlist:hover svg { fill:var(--white) !important; } .box-img-hover { -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; -webkit-box-shadow: 0px 3px 15px 0px var(--blackrgba1); -moz-box-shadow: 0px 3px 15px 0px var(--blackrgba1); box-shadow: 0px 3px 15px 0px var(--blackrgba1); overflow: hidden; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .box-img-hover:hover { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); -webkit-box-shadow: 0px 15px 35px 0px var(--blackrgba2); -moz-box-shadow: 0px 15px 35px 0px var(--blackrgba2); box-shadow: 0px 15px 35px 0px var(--blackrgba2); } .img-hover img { border: 0px solid var(--lblue2) !important; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; filter: grayscale(20%); -webkit-filter: grayscale(20%); cursor: pointer; } .img-hover img:after { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--white) !important; opacity: 0; -moz-transition: all .6s ease; -webkit-transition: all .6s ease; -o-transition: all .6s ease; transition: all .6s ease; } .img-hover:hover img { filter: grayscale(0); -webkit-filter: grayscale(0); -webkit-transform: scale(1.5) rotate(0deg); -moz-transform: scale(1.5) rotate(0deg); -o-transform: scale(1.5) rotate(0deg); -ms-transform: scale(1.5) rotate(0deg); transform: scale(1.5) rotate(0deg); } .img-hover span { display: block; overflow: hidden; position: relative; } .img-hover span:after { top: 0; left: 0; width: 100%; height: 100%; content: " "; position: absolute; border: 0px solid transparent; background: var(--lbluergba5); opacity: 0; filter: alpha(opacity=0); -webkit-transition: all .3s ease 0s; -moz-transition: all .3s ease 0s; -o-transition: all .3s ease 0s; -ms-transition: all .3s ease 0s; transition: all .3s ease 0s; } .img-hover span i { left: calc(50% - 28px); top: calc(80% - 29px); font-size: 56px; position: absolute; z-index: 2 !important; color: var(--white); opacity: 0; height: 58px; width: 56px; line-height: 56px; padding: 0px; margin: 0px; -webkit-transition: all 1.0s ease 0.3s; -moz-transition: all 1.0s ease 0.3s; -o-transition: all 1.0s ease 0.3s; -ms-transition: all 1.0s ease 0.3s; transition: all 1.0s ease 0.3s; } .img-hover:hover span i { top: calc(50% - 29px); opacity: 1; } .img-hover span svg { position: absolute; left: calc(50% - 24px); top: calc(-25% - 24px); width: 48px; height: 48px; stroke-width:0; fill:var(--white) !important; -webkit-transition: all 0.3s ease 0.3s; -moz-transition: all 0.3s ease 0.3s; -o-transition: all 0.3s ease 0.3s; -ms-transition: all 0.3s ease 0.3s; transition: all 0.3s ease 0.3s; z-index: 2 !important; opacity: 0; } .img-hover:hover span svg { top: calc(50% - 24px); opacity: 1; } .img-hover:hover span:after { opacity: 1.0; filter: alpha(opacity=100); } .img-hover img, .img-hover img, .img-hover span:after { transition: all 1.0s ease-in-out; } .pageTitle { margin-top: 95px; padding:80px 0 55px; position: relative; background-size: cover; top: 0px; z-index: 0; background-position: center center; background-repeat: no-repeat; overflow: hidden; } @media only screen and (max-width: 1100px) { .pageTitle { margin-top:0px; padding: 60px 0 30px; } } .pageTitle:before { left: 0; z-index: -1; top: 0; height: 100%; content: " "; position: absolute; width: 100%; /*background-color:rgba(155, 211, 174,.7);*/ background: linear-gradient(221deg, var(--lbluergba6), var(--lbluergba9), var(--lbluergba6)); background-size: 200% 200%; -webkit-animation: bg-gradient-animator-title 10s ease infinite; -moz-animation: bg-gradient-animator-title 10s ease infinite; -o-animation: bg-gradient-animator-title 10s ease infinite; animation: bg-gradient-animator-title 10s ease infinite; } @-webkit-keyframes bg-gradient-animator-title { 0% { background-position: 96% 0% } 50% { background-position: 5% 100% } 100% { background-position: 96% 0% } } @-moz-keyframes bg-gradient-animator-title { 0% { background-position: 96% 0% } 50% { background-position: 5% 100% } 100% { background-position: 96% 0% } } @-o-keyframes bg-gradient-animator-title { 0% { background-position: 96% 0% } 50% { background-position: 5% 100% } 100% { background-position: 96% 0% } } @keyframes bg-gradient-animator-title { 0% { background-position: 96% 0% } 50% { background-position: 5% 100% } 100% { background-position: 96% 0% } } .titlepageSite h1, .titlepageSite h2, .titlepageSite h3 { font-size: 24px; color: var(--white); margin-bottom: 25px; position: relative; z-index: 1; padding-left: 15px; text-transform: uppercase; } .titlepageSite h1 { font-size: 36px; line-height: 1.1 } .titlepageSite h2 { font-size: 30px; line-height: 1.1 } .titlepageSite h3 { font-size: 24px; line-height: 1.1 } .titlepageSite h1::before, .titlepageSite h2::before, .titlepageSite h3::before { position: absolute; content: ""; width: 0px; height: 100%; background: var(--dbluergba9); left: 0px; z-index: -1; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; overflow: hidden; } .pagination { display: inline-block; padding-left: 0; margin: 20px 0; border-radius: 0px; } .pagination > li { display: inline; } .pagination > li > a, .pagination > li > span { position: relative; float: left; padding: 0px 20px; margin: 1px; line-height: 50px; color: var(--white); height: 50px; text-decoration: none; background-color: var(--dblue2); border: 0px solid var(--white); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; outline: none !important; font-size: 16px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .pagination > li > span { font-size: 24px !important; padding-top: 12px; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { z-index: 2; color: var(--white); background-color: var(--dblue1); border-color: var(--white); } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 3; color: var(--white); cursor: default; background-color: var(--lblue2); border-color: var(--white); } .pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: var(--white); cursor: not-allowed; background-color: var(--gray3); border-color: var(--white); } .pagination svg { position: relative; top: -1px; width: 24px; height: 24px; vertical-align: text-top; stroke-width:0; fill:var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .pager li > a, .pager li > span { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; padding-top: 10px; padding-bottom: 10px; font-size: 14px; } .pager li > a, .pager li > span { color: var(--white); border-color: transparent !important; background: var(--gray3); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .pager li > a:hover, .pager li > span:hover { color: var(--white); background: var(--lblue2); border-color: transparent !important; } .content_post ul { display: inline-block; width: auto; padding: 10px; } .content_post ul > li { margin: 0px 5px; padding: 3px; font-weight: 600; cursor: pointer; font-size: 1rem; opacity: 1.0; transition: opacity .2s ease-in-out; list-style-type: disc; } .content_post ul > li:hover { opacity: 1.0; } .content_post ul:hover > li:not(:hover) { opacity: 0.8; } .sidebar-link { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; color: var(--white); background: var(--lblue2); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: none; padding: 7px 10px 6px 10px; position: relative; margin-bottom: 5px; display: block; width: 100%; z-index: 0; overflow: hidden; } .sidebar-link a { color: var(--white); } .sidebar-link span { font-weight: normal; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; font-size: 16px; padding-left: 0px; position: relative; z-index: 2; display: block; } .sidebar-link:focus, .sidebar-link:hover { color: var(--white); background: var(--dblue2); } .sidebar-link:focus span, .sidebar-link:hover span { padding-left: 5px; } .sidebar-link:before { position: absolute; content: ""; height: 100%; width: 0px; top: 0px; left: 0px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; background: var(--blackrgba1); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; z-index: 1; } .sidebar-link:hover:before, .sidebar-link:focus:before { width: 100%; background: var(--blackrgba2); } .sidebar-link svg { position: relative; top: 0px; width: 20px; height: 20px; vertical-align: text-top; stroke-width: 2; fill: var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .sidebar-link-two { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; color: var(--white); background: var(--lblue2); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: none; padding: 7px 10px 6px 10px; position: relative; margin-bottom: 5px; display: block; width: 100%; z-index: 0; overflow: hidden; } .sidebar-link-two a { color: var(--white); } .sidebar-link-two span { font-weight: normal; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; font-size: 16px; padding-left: 0px; position: relative; z-index: 2; display: block; } .sidebar-link-two:focus, .sidebar-link-two:hover { color: var(--white); background: var(--dblue2); } .sidebar-link-two:focus span, .sidebar-link-two:hover span { padding-left: 5px; } .sidebar-link-twoa-active { color: var(--white); background: var(--dblue2); } .sidebar-link-two:before { position: absolute; content: ""; height: 100%; width: 0px; top: 0px; left: 0px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; background: var(--blackrgba1); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; z-index: 1; } .sidebar-link-two:hover:before, .sidebar-link-two:focus:before { width: 100%; background: var(--blackrgba2); } .sidebar-link-two svg { position: relative; top: 0px; width: 20px; height: 20px; vertical-align: text-top; stroke-width: 2; fill: var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .sideList { padding: 5px 10px; margin-bottom: 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: var(--f4f4f4); margin-top: -5px; } .sideList li { position: relative; min-height: 36px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--orange2); font-size: 16px; line-height: 1.1; margin-bottom: 3px; border-bottom: 1px solid var(--blackrgba1); } .sideList li:last-child { border-bottom: 0px solid var(--blackrgba1); } .sideList li a { color: var(--orange2); font-size: 16px; line-height: 1.1; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .sideList li:hover a { color: var(--lblue2); } .sideListTwo { padding: 5px 10px; margin-bottom: 0px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: var(--f4f4f4); margin-top: -5px; } .sideListTwo li { position: relative; min-height: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--orange2); font-size: 16px; line-height: 1.1; margin-bottom: 3px; padding-left: 5px ; border-bottom: 1px solid var(--blackrgba1); } .sideListTwo li:last-child { border-bottom: 0px solid var(--blackrgba1); } .sideListTwo li a { color: var(--orange2); font-size: 15px; line-height: 1.1; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .sideListTwo li:hover a { color: var(--lblue2); } .product-description-list { width: 100%; display: block; margin: auto; padding: 0px; list-style: none; } .product-description-list .item { margin-top: 5px; margin-bottom: 5px; } .product-description-list li { list-style-position: inside; margin-bottom: 5px; padding: 10px 10px 10px 10px; border-bottom: 1px solid var(--f4f4f4); font-size: 16px; } .product-description-list li span { text-align: right; float: right; font-weight: bold } #product-detail .view-gallery { position: absolute; height: 50px; width: 50px; right: 15px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; bottom: 0px; text-align: center; font-size: 24px; z-index: 50; line-height: 50px; border: 2px solid var(--blackrgba1); background: var(--whitergba6); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } #product-detail .view-gallery:hover { border: 2px solid var(--blackrgba2); background: var(--f4f4f4); } #product-detail .img-box-client { padding-bottom: 0px; margin-bottom: 0px; padding-left: 5px; padding-right: 5px; } #product-detail .swiper { position: relative; width: 100%; height: 100%; overflow: hidden; } #product-detail .swiper-slide { background-position: center; background-size: cover; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; overflow: hidden; padding: 0px; } #product-detail .swiper-slide .itembig img { opacity: 0; visibility: hidden; display: none; } #product-detail .swiper-slide img { display: block; width: 100%; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } #product-detail .swiper-button-next, #product-detail .swiper-button-prev { color: var(--lblue2); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; padding: 15px !important; height: 48px; width: 48px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; background: var(--white) } #product-detail .swiper-button-next:after, #product-detail .swiper-button-prev:after { font-size: 28px; } #product-detail .swiper-button-next:hover, #product-detail .swiper-button-prev:hover { color: var(--dblue2); } #product-detail .view-gallery { position: absolute; height: 50px; width: 50px; right: 15px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; bottom: 0px; text-align: center; font-size: 24px; z-index: 5; line-height: 50px; border: 2px solid var(--blackrgba2); background: var(--white); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } #product-detail .view-gallery:hover { border: 2px solid var(--blackrgba3); background: var(--f4f4f4); } #product-detail .thumbProducts { height: 125px !important; box-sizing: border-box; padding: 10px 0; } #product-detail .thumbProducts .swiper-slide { width: 25%; height: 100%; opacity: 0.5; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; cursor: pointer; } #product-detail .thumbProducts .swiper-slide-thumb-active { opacity: 1; } #product-detail .swiper-pagination { padding:15px 0px 10px 0px; } #product-detail .swiper-pagination-bullet { width:12px; height:12px; display: inline-block; border-radius: 100%; background: var(--black); opacity: .3; margin: 0 3px; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } #product-detail .swiper-pagination-bullet-active{ background: var(--lblue2); opacity: 1; } .link-image-large { position: absolute; top: 30px; right: 30px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; font-size: 14px; font-weight: bold; color: var(--white) !important; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; padding: 5px 15px; cursor: pointer; background: var(--dblue2); } .link-image-large a { font-size: 14px; color: var(--white) !important; } .link-image-large:focus, .link-image-large:hover { background: var(--lblue3); } .link-image-large svg { position: relative; top: 0px; width: 18px; height: 18px; vertical-align: text-top; stroke-width:0; fill:var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .btn-whatsapp-prod { font-family:var(--theme-font); font-size: 16px; line-height: 1.4; font-weight: bold; padding: 12px 40px; text-align: center; text-transform: uppercase; box-sizing: border-box; transition: all 0.4s; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: var(--white); border: 2px solid var(--Whats1); background-color: var(--Whats1); -webkit-box-shadow: 0px 15px 18px -10px var(--Whatsrgba2); -moz-box-shadow: 0px 15px 18px -10px var(--Whatsrgba2); box-shadow: 0px 15px 18px -10px var(--Whatsrgba2); animation: pulsew 1s infinite; } .btn-whatsapp-prod:hover, .btn-whatsapp-prod:focus { -webkit-transform: translateY(-7px); -moz-transform: translateY(-7px); -ms-transform: translateY(-7px); -o-transform: translateY(-7px); transform: translateY(-7px); background-color: var(--Whats2); border-color: var(--Whats2); color: var(--white); -webkit-box-shadow: 0px 20px 18px -6px var(--Whatsrgba); -moz-box-shadow: 0px 20px 18px -6px var(--Whatsrgba); box-shadow: 0px 20px 18px -6px var(--Whatsrgba); } .btn-whatsapp-prod svg { position: relative; top: -2px; left: -5px; width: 24px; height: 24px; vertical-align: text-top; stroke-width:0; fill:var(--white); transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } @-webkit-keyframes pulsew { 0% { -webkit-box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5); } 70% { -webkit-box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } } @keyframes pulsew { 0% { -moz-box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5); } 70% { -moz-box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } } .product-add-box { position: relative; display: block; } .product-add-box .form-control { border: 0px; padding-right: 190px; font-size: 16px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; } .product-add-box .button { font-family: var(--theme-font); font-size: 16px; line-height: 1.1; font-weight: 700; padding: 12px 40px; text-align: center; text-transform: uppercase; color: var(--white); border: 2px solid var(--lblue2); background-color: var(--lblue2); box-sizing: border-box; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; -webkit-border-radius: 0px; -webkit-border-top-right-radius: 7px; -webkit-border-bottom-right-radius: 7px; -moz-border-radius: 0px; -moz-border-radius-topright: 7px; -moz-border-radius-bottomright: 7px; border-radius: 0px; border-top-right-radius: 7px; border-bottom-right-radius: 7px; } .product-add-box .button:hover, .product-add-box .button:focus { background-color: var(--dblue2); border-color: var(--dblue2); color: var(--white); } .product-add-box .form-control::-webkit-input-placeholder { opacity: 0.6; color: var(--gray3); } .product-add-box .form-control::-moz-placeholder { opacity: 0.6; color: var(--gray3); } .product-add-box .form-control:-ms-input-placeholder { opacity: 0.6; color: var(--gray3); } .product-add-box .form-control::-webkit-input-placeholder { opacity: 0.6; color: var(--gray3); } .product-add-box .form-control::-moz-placeholder { opacity: 0.6; color: var(--gray3); } .product-add-box .form-control:-ms-input-placeholder { opacity: 0.6; color: var(--gray3); } /*Contacts*/ .sidebar .contacts ul { width: 100%; float: left; list-style: none; margin: 0; padding: 0; } .sidebar .contacts li { color: var(--gray3); padding: 7px 0px 7px; border-bottom: 1px solid var(--f1f1f1); font-size: 15px; margin-bottom: 1px; width: auto; display: block; text-align: left; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; font-weight: bold; } .sidebar .contacts li:last-child { border-bottom: none !important; } .sidebar .contacts li:before, .sidebar .contacts li:after { content: " "; display: table; } .sidebar .contacts li:after { clear: both; } .sidebar .contacts li i { float: left; font-size: 20px; text-align: left; margin: 0px 3px 0 0; display: inline-block; width: 30px; line-height: 24px; color: var(--gray3); } .sidebar .contacts li p { margin-bottom: 0; color: var(--gray3); font-size: 14px; } .content-footer.contacts li { color: var(--gray3); font-size: 16px; } .sidebar .contacts li a { color: var(--gray3); font-size: 16px; line-height: 1.1 } .sidebar .contacts li a:hover { color: var(--lblue2); padding-left: 10px; border-color: var(--blackrgba1); } .sidebar .contacts svg { position: relative; top: 1px; width: 20px; height: 20px; vertical-align: text-top; stroke-width: 1.5; color: var(--lblue2); fill: var(--lblue2); margin-right: 7px; } .social-side-bar svg { position: relative; top: 5px; width: 20px; height: 20px; vertical-align: text-top; stroke-width: 1.5; color: var(--white); fill: var(--white); } .sidebar .heading h1, .sidebar .heading h2, .sidebar .heading h3 { color: var(--gray3); display: inline-block; font-weight: normal; padding-bottom: 10px; position: relative; text-transform: uppercase; margin-bottom: 20px; font-size: 24px; } .sidebar .heading h1::before, .sidebar .heading h2::before, .sidebar .heading h3::before { background: var(--lblue1) none repeat scroll 0 0; bottom: 5px; content: ""; height: 3px; left: 0; position: absolute; width: 55px; } .adress-item { padding:0px 0px 20px 0px; width:100%; display:block; position:relative; background:var(--f4f4f4); -webkit-box-shadow: 0px 10px 30px -5px var(--blackrgba1); -moz-box-shadow: 0px 10px 30px -5px var(--blackrgba1); box-shadow: 0px 10px 30px -5px var(--blackrgba1); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; text-align:center; } .adress-item:hover, .adress-item:focus { -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); background:var(--white); -webkit-box-shadow: 0px 10px 36px -5px var(--blackrgba3); -moz-box-shadow: 0px 10px 36px -5px var(--blackrgba3); box-shadow: 0px 10px 36px -5px var(--blackrgba3); } .adress-item p { margin: 0px; font-weight: bold; line-height: 1.1; font-size: 16px !important; color:var(--gray1) } .adress-item .img-loja{ position: relative; z-index:1; margin: -60px auto 0px; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; overflow: hidden; width: calc(100% - 60px); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; background: var(--white); -webkit-box-shadow: 0px 15px 35px 0px var(--blackrgba2); -moz-box-shadow: 0px 15px 35px 0px var(--blackrgba2); box-shadow: 0px 15px 35px 0px var(--blackrgba2); } .adress-item .icon{ margin: -75px auto 0px !important; position: relative; z-index:2; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; background: var(--f4f4f4); -webkit-box-shadow: 0px 15px 35px 0px var(--blackrgba2); -moz-box-shadow: 0px 15px 35px 0px var(--blackrgba2); box-shadow: 0px 15px 35px 0px var(--blackrgba2); width: 100px; height: 100px; -moz-border-radius:60px; -webkit-border-radius:60px; border-radius:60px; margin: -20px auto 0px; -webkit-backdrop-filter: saturate(150%) blur(5x); backdrop-filter: saturate(150%) blur(5px); background-color: var(--whitergba6) } .adress-item .icon svg { position: relative; top: 10px; width: 75px; height: 75px; vertical-align: text-top; stroke-width: 0; fill: var(--lblue2); transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .adress-item .social-icons li a{ height:50px; width:50px; line-height:50px; } .adress-item .social-icons li a svg { position: relative; top:0px; width: 28px; height: 28px; vertical-align: text-top; stroke-width: 0; fill: var(--white) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); } .radioform { padding-left:15px; padding-right:15px; min-width: 120px; height:50px; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px; -webkit-box-shadow: 0px 15px 35px 0px var(--blackrgba2); -moz-box-shadow: 0px 15px 35px 0px var(--blackrgba2); box-shadow: 0px 15px 35px 0px var(--blackrgba2); margin:5px 5px; font-weight:bold; } .radioform input[type="radio"] { -ms-transform: scale(1.5); -webkit-transform: scale(1.5); transform: scale(1.5); accent-color: var(--lblue3); } .radioform svg { position: relative; top:-2px; width: 24px; height: 24px; vertical-align: text-top; stroke-width: 0; fill: var(--dblue2) !important; transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1); }