Cód.: 0005
<script>
$(window).scroll(function() {
var $height = $(window).scrollTop();
if ($height >= 1280) {
console.log('cheguei em 1600');
$('.celular2-frente').addClass('slideright');
$('.celular2').addClass('slideleft');
//$('#header').addClass('active');
} else {
if ($height <= 900) {
$('.celular2-frente').removeClass('slideright');
$('.celular2').removeClass('slideleft');
}
//$('#header').removeClass('active');
}
});
</script>
<style type="text/css">body {
padding: 0;
margin: 0;
}
.d-flex-align-center {
align-items: center;
display: flex;
}
.parallax {
color: #fff !important;
}
.parallax .container-fluid {
padding-right: 90px;
padding-left: 90px;
}
.section-1 {
background: rgb(0, 105, 233)!important;
background: -moz-linear-gradient(212deg, rgba(0, 105, 233, 1) 0%, rgba(0, 182, 246, 1) 56%, rgba(0, 182, 246, 1) 100%)!important;
background: -webkit-linear-gradient(212deg, rgba(0, 105, 233, 1) 0%, rgba(0, 182, 246, 1) 56%, rgba(0, 182, 246, 1) 100%)!important;
background: linear-gradient(212deg, rgba(0, 105, 233, 1) 0%, rgba(0, 182, 246, 1) 56%, rgba(0, 182, 246, 1) 100%)!important;
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#0069e9", endColorstr="#00b6f6", GradientType=1)!important;
}
.section-1::before {
content: url('https://www.redmobile.com.br/image/catalog/-manual/wave1.png');
position: absolute;
top: 0;
width: 100%;
background: rgb(0, 0, 0);
background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=1);
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-right: 240px;
padding-top: 140px;
}
.section h1 {
font-size: 5.3em !important;
letter-spacing: 5px !important;
color: #FFF !important;
font-family: 'Titillium Web', sans-serif !important;
}
.section-1 p {
font-size: 3em !important;
letter-spacing: 3px !important;
color: #FFF;
font-family: 'Titillium Web', sans-serif !important;
margin-top: 30px !important;
line-height: 50px !important;
}
.parallax .item {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
height: 600px !important;
width: 100% !important;
}
.section .item-center {
height: 400px !important;
justify-content: center !important;
align-items: center !important;
display: flex !important;
}
.section .item-center .item {
flex: 0 !important;
padding: 10px !important;
z-index: 1 !important;
}
.section .item-center .item p {
width: 400px !important;
font-family: 'Titillium Web', sans-serif !important;
}
.section .btn-red {
background-color: #E30000 !important;
padding: 15px 40px !important;
border-radius: 5px !important;
border: 2px solid #fff !important;
color: #fff !important;
font-size: 26px !important;
font-weight: bold !important;
text-transform: uppercase !important;
letter-spacing: 3px !important;
}
.section .btn-red:hover {
background-color: #B70303 !important;
transition: all ease 0.5s !important;
border: 2px solid #fff !important;
color: #fff !important;
}
.section .text-center {
color: #000 !important;
text-transform: uppercase !important;
}
.parallax .bottom {
display: flex !important;
flex-direction: column !important;
justify-content: end !important;
height: 100vh !important;
width: 100 !important;
}
.parallax-window {
min-height: 400px !important;
background: transparent !important;
}
.section {
position: relative !important;
overflow: hidden !important;
}
.section {
font-family: 'Titillium Web', sans-serif !important;
color: #FFFFFF !important;
display: flex;
align-items: center;
}
.section .efeito {
left: 0px !important;
top: 0px !important;
position: absolute !important;
overflow: hidden !important;
/*z-index: -999998;*/
margin: 0px !important;
padding: 0px !important;
width: 100% !important;
text-align: center;
height: 100%;
}
.section img {}
.section-1 {
/*background: rgb(0, 13, 29) !important;
background: linear-gradient(180deg, rgba(0, 13, 29, 1) 0%, rgba(0, 107, 225, 1) 100%) !important;
*/
height: 600px;
}
.ajd-4 {
position: relative;
height: 100%;
min-height: 600px;
}
/* @keyframes fitslideleft {
from {
right: 150px;
}
to {
right: 50px;
}
}
*/
.celular1 {
position: absolute;
top: 40px;
}
.celular3 {
position: absolute;
top: 10px;
z-index: 10;
}
.celular2,
.celular2-frente {
position: absolute;
right: 180px;
/*z-index: 10;*/
width: 38%;
transition: all 1s ease;
}
.celular2 {
opacity: 0;
width: 38%;
top: 20px;
}
.celular2-frente {
top: 0;
}
img.img-fluid.celular2.slideleft {
right: 240px;
opacity: 1;
}
img.img-fluid.celular2-frente.slideright {
right: 50px;
}
.slideleft,
.slideright {
animation-duration: 3s;
}
.section-1 .efeito img {
position: relative;
margin: 0px;
padding: 0px;
border: none;
z-index: -999999;
width: 100%;
left: 0;
top: 0px;
}
.section-2 {
background: rgb(0, 182, 247);
background: -moz-linear-gradient(145deg, rgba(0, 182, 247, 1) 0%, rgba(0, 104, 234, 1) 100%);
background: -webkit-linear-gradient(145deg, rgba(0, 182, 247, 1) 0%, rgba(0, 104, 234, 1) 100%);
background: linear-gradient(145deg, rgba(0, 182, 247, 1) 0%, rgba(0, 104, 234, 1) 100%);
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#00b6f7", endColorstr="#0068ea", GradientType=1);
height: 600px !important;
}
.section-2::before {
content: url('https://www.redmobile.com.br/image/catalog/-manual/wave1.png');
position: absolute;
top: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-left: 240px;
padding-top: 0;
}
.section-3::before {
content: url('https://www.redmobile.com.br/image/catalog/-manual/wave3.png');
position: absolute;
top: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-left: 0;
padding-top: 0;
margin-left: -90px;
}
.section-3 .progressbar {
position: absolute;
width: 10px;
height: 3px;
border: 0px solid red;
top: 50%;
background: #0069dd;
align-content: baseline;
left: 50%;
margin-left: -20px;
margin-top: 2px;
}
.section-2 h1,
.section-3 h1,
.section-4 h1,
.section-5 h1 {
font-size: 3.3em !important;
letter-spacing: 2px !important;
}
.section-2 p,
.section-3 p,
.section-4 p,
.section-5 p {
font-size: 26px !important;
line-height: 33px;
letter-spacing: 2px !important;
font-weight: 300;
}
.section-3 {
background: rgb(0, 104, 234) !important;
background: linear-gradient(162deg, rgba(0, 104, 234, 1) 0%, rgba(0, 154, 242, 1) 100%) !important;
min-height: 600px !important;
}
.section-4 {
background: url(https://www.redmobile.com.br/image/catalog/-manual/menina-skate.jpg)!important;
background-attachment: fixed!important;
background-size: 100%;
background-position: center center!important;
min-height: 600px !important;
}
.section-4 .small-text {
font-size: 16px!important;
position: absolute;
bottom: -170px;
}
.section-5 {
background: rgb(0, 181, 246) !important;
background: linear-gradient(180deg, rgba(0, 181, 246, 1) 0%, rgba(0, 105, 234, 1) 100%) !important;
height: 600px !important;
overflow: hidden;
}
.section-3 h1 {
font-size: 2.8em !important;
}
.section-5 p {
font-size: 2em !important;
letter-spacing: 2px !important;
line-height: 33px;
}
.section-5 img {
width: auto !important;
height: 100%;
margin-left: 80px;
}
.section-5 .efeito {
text-align: center !important;
}
.section-5 .efeito img {
width: auto !important;
margin-left: 0;
height: auto;
position: absolute;
bottom: -110px;
left: 0;
}
.section-5 .container .row {
display: flex;
align-items: center;
}
#tab-description .section-6 h1 {
font-size: 2.5em !important;
color: #666666 !important;
text-align: center !important;
text-transform: uppercase !important;
}
.card1,
.card2,
.card3,
.card4,
.card5,
.card6 {
/*position: absolute;*/
}
.section-7 {
background: rgb(69, 50, 132) !important;
background: linear-gradient(90deg, rgba(69, 50, 132, 1) 0%, rgba(173, 186, 231, 1) 100%) !important;
min-height: 250px !important;
}
.section-7 .price {
text-align: center !important;
}
.section-7 h1 {
font-size: 2.5em !important;
}
.section-7 img {
width: 100%;
margin-left: 30px;
margin-top: -110px;
}
body {
zoom: unset !important;
height: unset !important;
}
.section-3 .efeito img {
height: 500px;
margin-left: -120px;
}
.section-4 img {
height: 100%;
}
.box-produto-especificacoes {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
@media only screen and (max-width: 768px) {
.section {
overflow: hidden!important;
}
.efeito img {
width: 100% !important;
}
.section img {
width: 100%;
}
.section-1 {
min-height: 240px !important;
display: block;
}
.section-1 .efeito {
min-height: 240px !important;
}
.section-1 .efeito img {
left: -140px;
width: 180% !important;
}
.section-1 p {
font-size: 17px !important;
letter-spacing: 2px !important;
line-height: 24px !important;
text-align: left;
margin-left: 0px;
}
.section-2 {
flex-direction: column !important;
min-height: 280px !important;
}
.section-2 .efeito {
position: relative !important;
}
.section-2 .efeito img {
margin-left: 30% !important;
}
.section-2 h1 {
font-size: 2em !important;
text-align: center;
}
.section-3 {
min-height: 410px !important;
flex-direction: column;
}
.section-3 .efeito {
position: relative !important;
min-height: 300px !important;
}
.section-3 .efeito img {
margin-left: -70%;
height: auto;
margin-top: 30px;
}
.section-3 h1 {
font-size: 18px !important;
text-align: center;
}
.section-2 p,
.section-3 p,
.section-4 p,
.section-5 p {
text-align: center;
font-size: 17px !important;
letter-spacing: 2px !important;
line-height: 22px;
}
.section-4 {
min-height: 480px !important;
flex-direction: column;
}
.section-4 .efeito {
position: relative !important;
}
.section-4 img {
height: auto;
margin-left: 80px;
}
.section-4 h1 {
font-size: 22px !important;
text-align: center;
}
.section-5 {
min-height: 535px !important;
flex-direction: column-reverse;
}
.section-5 .efeito {
position: relative !important;
}
.section-5 .efeito img {
position: relative !important;
width: auto !important;
margin-left: -380px;
height: auto;
bottom: 0;
left: 0;
}
.section-5 h1 {
font-size: 22px !important;
text-align: center;
}
.parallax .container-fluid {
padding-left: 0;
padding-right: 0;
}
.section-7 {
min-height: 280px !important;
}
.section-7 img {
width: 100%;
margin-left: 30px;
margin-top: 200px;
}
.logo-fit {
margin-top: 0;
width: 210px !important;
margin-left: 0;
}
.section-5 .container .row {
flex-direction: column-reverse;
}
.section-5 img {
width: auto;
height: 320px;
margin-left: 0;
}
.section p br {
display: none;
}
.section-6 h1 {
font-size: 20px !important;
}
.section-6 {
height: auto !important;
}
.box-produto-especificacoes {
display: grid;
grid-template-columns: 1fr 1fr;
}
.section-7 h1 {
font-size: 20px !important;
margin-top: 0;
}
.section .btn-red {
padding: 5px 20px !important;
font-size: 21px !important;
}
/* */
.section-1 {
height: 300px;
}
.section-1::before {
padding-right: 0;
padding-top: 140px;
}
.section-1 p {
font-size: 2em !important;
line-height: 25px !important;
}
.ajd-4 {
position: relative;
height: unset;
align-items: center;
min-height: 202px;
}
.celular1 {
position: relative;
top: unset;
}
img.img-fluid.celular2.slideleft {
right: 60px;
opacity: 1;
width: 80px;
top: 5px;
}
img.img-fluid.celular2-frente.slideright {
right: 0;
width: 80px;
}
.section-2 {
height: 280px !important;
}
#tab-description .section {
justify-content: center;
}
.celular3 {
position: relative;
}
.section-3::before {
margin-left: 0;
}
.section-4 {
background-position-x: -650px!important;
}
.small-text {
width: 100%;
text-align: center;
left: 0;
}
#tab-description .parallax .container-fluid {
padding-right: 0;
padding-left: 0;
width: 100%;
}
}
/* tablet e celular deitado */
@media only screen and (min-width: 800px) and (max-width: 1030px) {
.section img {
width: 100%;
}
.section-1 .efeito img {
width: 195%;
left: -400px;
}
.box-produto-especificacoes {
grid-template-columns: 1fr 1fr 1fr;
}
.section-2 .efeito img {
margin-top: 60px;
margin-left: 50px;
}
.section-3 .efeito img {
margin-left: -50px;
margin-top: 60px;
}
}
@media only screen and (min-width: 500px) and (max-width: 799px) {
.logo-fit {
margin-top: 150px;
}
.section-1 {
min-height: 410px !important;
}
.section-1 img {
width: 90% !important;
}
.section-1 .efeito img {
width: 180% !important;
left: -240px !important;
}
.section-1 p {
font-size: 27px !important;
line-height: 34px !important;
}
.section-2 {
min-height: auto !important;
padding: 0 30px 30px 30px;
}
.section-2 .efeito img {
width: 100%;
margin-left: 20px;
}
.section-2 h1,
.section-3 h1,
.section-4 h1,
.section-5 h1 {
font-size: 30px !important;
letter-spacing: 2px !important;
}
.section p br {
display: none;
}
.section-2 p,
.section-3 p,
.section-4 p,
.section-5 p {
font-size: 22px !important;
line-height: 33px;
letter-spacing: 2px !important;
font-weight: 300;
}
.section-3 .efeito img {
margin-top: 30px;
}
.section-3 {
min-height: 530px !important;
}
.section-5 {
min-height: 530px !important;
}
.section-4 {
min-height: auto !important;
padding: 0 30px 30px 30px;
}
.section-4 img {
height: auto;
margin-left: 120px;
}
.section-6 h1 {
font-size: 20px !important;
}
.box-produto-especificacoes {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}
.section-7 h1 {
font-size: 30px !important;
margin-top: 0;
padding: 20px;
}
.section .btn-red {
padding: 5px 20px !important;
font-size: 21px !important;
}
}
@media only screen and (max-width: 360px) {
.section-1 .efeito img {
left: -180px;
width: 210% !important;
}
.logo-fit {
margin-top: 70px;
width: 150px !important;
margin-left: -10px;
}
.section-2 {
min-height: 370px !important;
}
.section-3 .efeito {
min-height: 220px !important;
}
.section-4 img {
margin-left: 50px;
}
.oculta-mobile {
display: none !important;
}
.section-4 {
min-height: 440px !important;
}
.section-7 h1 {
padding: 20px !important;
}
.section-6 {
height: 440px !important;
}
}
@media only screen and (max-width: 320px) {
.logo-fit {
margin-top: 50px !important;
width: 113px !important;
margin-left: -10px !important;
}
.section-1 .efeito img {
left: -225px !important;
width: 245% !important;
}
.section-2 {
min-height: 360px !important;
}
.section-3 .efeito {
min-height: 190px !important;
}
.section-4 img {
margin-left: 50px;
}
.section-4 {
min-height: 410px !important;
}
.oculta-mobile {
display: none !important;
}
.section-6 h1 {
font-size: 20px !important;
}
.box-produto-especificacoes {
display: grid;
grid-template-columns: 1fr 1fr;
}
.section-7 h1 {
font-size: 20px !important;
margin-top: 0;
}
.section .btn-red {
padding: 5px 20px !important;
font-size: 21px !important;
}
.section-6 {
height: 440px !important;
}
}
</style>
<section class="section-1 section">
<div class="container ">
<div class="row d-flex-align-center">
<div class="col-md-6 col-md-offset-1 col-xs-8">
<div class="item "><img class="img-fluid logo-fit " data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-delay="50" src="https://redmobile.com.br/image/catalog/landing-produtos/logo-fit2.png " />
<p class="text" data-aos="fade-up" data-aos-delay="100">Suas músicas preferidas<br />
em grande estilo</p>
</div>
</div>
<div class="col-sm-4 col-xs-12 ajd-4"><img class="img-fluid celular1" data-1050="top: 40px;" data-1300="top: -20px;" data-aos="fade-up" data-aos-delay="1000" data-aos-duration="1000" src="https://www.redmobile.com.br/image/catalog/-manual/celular-red.png" /></div>
</div>
<!-- row --></div>
<!-- container --></section>
<section class="section-2 section">
<div class="container ">
<div class="row d-flex-align-center">
<div class="col-sm-6 col-md-6 ajd-4 col-xs-12"><img class="img-fluid celular2" src="https://www.redmobile.com.br/image/catalog/-manual/celular-fit-fundo.png" /> <img class="img-fluid celular2-frente" src="https://www.redmobile.com.br/image/catalog/-manual/celular-fit-frente.png" /></div>
<div class="col-sm-6 col-md-6 col-xs-12 ">
<div class="item ">
<h1 data-aos="fade-in" data-aos-duration="2000">TECLADO MULTIMÍDIA</h1>
<p class="text " data-aos="fade-in" data-aos-delay="100" data-aos-duration="2000">Botões de acesso rápido integrados:<br />
mais facilidade e experiência na<br />
navegação.</p>
</div>
</div>
</div>
</div>
<!-- container --></section>
<section class="section-3 section ">
<div class="container">
<div class="row d-flex-align-center">
<div class="col-sm-6 col-md-6 col-xs-8 col-md-offset-1 col-sm-offset-1">
<div class="item ">
<h1 data-aos="fade-up">MAIS CONECTIVIDADE E PRATICIDADE PARA VOCÊ</h1>
<p class="text " data-aos="fade-up">Use fones sem fio, caixas de som<br />
externas e faça transferência de<br />
arquivos entre dispositivos.</p>
</div>
</div>
<div class="col-sm-5 col-md-5 col-xs-4 ajd-4"><img class="img-fluid celular3" src="https://www.redmobile.com.br/image/catalog/-manual/celular3.png" /></div>
</div>
<!-- row --></div>
<!-- container -->
<div class="progressbar" data-1990="width: 10px;" data-2240="width: 230px;"> </div>
</section>
<section class="section-4 section ">
<div class="container ">
<div class="row ">
<div class="col-xs-12 ">
<div class="col-md-6 col-sm-6 oculta-mobile "> </div>
<div class="col-md-6 col-sm-6 ">
<div class="item ">
<h1 data-aos="fade-up" data-aos-duration="2000">MEMÓRIA EXPANSIVA<br />
DE ATÉ 32 GB*</h1>
<p class="text " data-aos="fade-up" data-aos-delay="100" data-aos-duration="2000">Mais espaço de armazenamento<br />
para guardar suas fotos e músicas.</p>
<p class="small-text" data-aos="fade-up" data-aos-duration="2000">* Cartão MicroSD não incluso</p>
</div>
</div>
</div>
<!-- col-md-12 --></div>
<!-- row --></div>
<!-- container --></section>
<section class="section-5 section " id="section-5 ">
<div class="efeito "><img alt=" " data-3300="transform: translateY(0px) " data-3500="transform: translateY(-50px); " src="https://redmobile.com.br/image/catalog/Layout/bars.png " /></div>
<div class="container " id="section-3 ">
<div class="row ">
<div class="col-md-6 col-sm-6 col-sm-offset-1 col-md-offset-1">
<div class="item ">
<h1 data-aos="fade-up" data-aos-duration="1500">RÁDIO WIRELESS</h1>
<p class="text " data-aos="fade-up" data-aos-delay="100" data-aos-duration="1500">Mais liberdade para você ouvir suas<br />
músicas preferidas, sem fone de ouvido.</p>
</div>
</div>
<div class="col-md-5 col-sm-5 "><img class="img-responsive " data-aos="fade-left" data-aos-delay="300" data-aos-duration="2000" src="https://redmobile.com.br/image/catalog/Layout/celular-wifi.png " /></div>
</div>
<!-- row --></div>
<!-- container --></section>
<section class="parallax section-6 section ">
<div class="container-fluid ">
<div class="row ">
<div class="col-xs-12 ">
<div class="col-md-12 ">
<div class="item ">
<h1>Outras especificações</h1>
<div class="box-produto-especificacoes "><img class="img-responsive card1" data-aos="zoom-in" data-aos-delay="100" src="https://redmobile.com.br/image/catalog/-manual/dual-chip.png " /> <img class="img-responsive card2" data-aos="zoom-in" data-aos-delay="300" src="https://redmobile.com.br/image/catalog/-manual/camera.png " /> <img class="img-responsive card3" data-aos="zoom-in" data-aos-delay="500" src="https://redmobile.com.br/image/catalog/-manual/led.png " /> <img class="img-responsive card4" data-aos="zoom-in" data-aos-delay="700" src="https://redmobile.com.br/image/catalog/-manual/bluetooth.png " /> <img class="img-responsive card5" data-aos="zoom-in" data-aos-delay="900" src="https://redmobile.com.br/image/catalog/-manual/fmwireless.png " /> <img class="img-responsive card6" data-aos="zoom-in" data-aos-delay="1100" src="https://redmobile.com.br/image/catalog/-manual/ate32gb.png " /></div>
</div>
</div>
</div>
<!-- col-md-12 --></div>
<!-- row --></div>
<!-- container --></section>
Frete Grátis
10x de
R$ 333,79 no cartão
ou R$ 2.999,90 à vista
Receba R$ 150,00 (5% de volta)
