/* Hello, guys!! :) CSS desenvolvido pela bs.agency em 2024. Façam bom uso :) */ /* clean CSS */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}body {line-height: 1;}ol, ul {list-style: none;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}table {border-collapse: collapse;border-spacing: 0;} html {background: var(--secundaria) url('../images/loading.svg') no-repeat center; width: 100%; height: 100%; min-height: 100%; overflow-x: hidden;} body {display: block; font-family: "Montserrat", sans-serif; box-sizing: border-box; background: var(--secundaria); color: var(--secundaria); font-size: 16px; font-weight: 300; line-height: 1.3rem; height: 100%; min-height: 100% !important;} /* Variaveis: */ :root { --principal: #F0CF28; /* Amarelo */ --secundaria: #262262; /* Azul Escuro */ --branco: #FFF; --rosa: #D70F5F; --widthEsquerda: 420px; --widthDireita: 330px; --marginEsq: 10%; --marginDir: 18%; --tempo: 400ms; --radius: 20px; } /* Variaveis: */ /* Seleção: */ ::selection {background: var(--principal); color:#FFF; text-shadow: 0px 2px 1px rgba(0,0,0,0.2);} ::-webkit-selection {background: var(--principal); color:#FFF; text-shadow: 0px 2px 1px rgba(0,0,0,0.2);} ::-moz-selection {background: var(--principal); color:#FFF; text-shadow: 0px 2px 1px rgba(0,0,0,0.2);} /* Seleção: */ /* Efeitos de transição: */ a, header nav a, .button, .slick-dots li {-webkit-transition: all var(--tempo); -moz-transition: all var(--tempo); -ms-transition: all var(--tempo); -o-transition: all var(--tempo); transition: all var(--tempo);} /* :Efeitos de transição */ /* Animações: */ @-webkit-keyframes float { from, to {transform: translate3d(0, 0, 0);} 50% {transform: translate3d(0, -20px, 0);}} @keyframes float { from, to {transform: translate3d(0, 0, 0);} 50% {transform: translate3d(0, -20px, 0);}} /* :Animações */ /* Elementos: */ h1, h2, h3, h5 {font-family: "Montserrat", sans-serif; display: block; font-weight: 700;} h3 {} h4 {} i {display: inline-block;} p {font-size: 1rem; line-height: 1.3rem;} strong {font-weight: 700;} br {clear: both; display: block;} a {color: var(--principal); text-decoration: none;} img {display: block; outline: none;} section {position: relative;} article {position: relative; width: 100%; box-sizing: border-box;} article:after {content: ''; display: block; clear: both;} .Iconografia {position: absolute; display: block; z-index: 1;} /* :Elementos */ /* Botões: */ .Btn {display: inline-block; text-transform: lowercase; color: var(--branco); font-size: 14px; border: 1px solid var(--branco); position: relative; font-weight: 600; box-sizing: border-box; padding: 8px 16px; border-radius: 20px; cursor: pointer; margin: 40px 0 0; text-align: center;} .Btn:hover {background: var(--secundaria); color: var(--branco);} .slick-dots li button:before {content: '' !important;} /* :Botões */ /* Backgrounds: */ .fullscreen-bg {width: 100%; height: 100%; background: no-repeat center center; background-size: cover;} /* :Backgrounds */ /* Header: */ header {} header nav a {} header nav a.SessaoAtual {} header nav a:hover {} .Logo {display: block; width: 90px; position: absolute; left: 30px; top: 30px; z-index: 10;} #Central {position: fixed; z-index: 2; display: block;} #ModalLeite {position: fixed; display: none; top: 0; left: 0; background: var(--rosa); color: var(--branco); z-index: 20;} #LogoLeiteRosasEsquerda {} #DireitaLeite {} .Bloco1 .FichaTecnica a img {width: 7px; margin-left: 10px; display: inline-block;} #mc_embed_shell {} #mc_embed_signup form {margin: 0 !important;} #mc_embed_shell input, #mc_embed_shell textarea {box-sizing: border-box; width: 100%; background: var(--secundaria); border: 1px solid var(--branco); padding: 10px 15px; margin: 5px 0; border-radius: 15px; color: var(--principal); font-size: 16px;} #mc_embed_shell .button {width: initial; float: right; display: inline-block; color: var(--branco); font-size: 14px; border: 1px solid var(--branco); position: relative; font-weight: 600; box-sizing: border-box; padding: 8px 16px; border-radius: 20px; cursor: pointer; margin: 15px 0 0; text-align: center;} #mc_embed_shell .button:hover {background: var(--branco); color: var(--secundaria);} .Voltar {font-size: 20px; width: 35px; height: 35px; background: var(--branco); color: var(--rosa); border-radius: 50%; display: block; text-align: center; line-height: 35px; margin-top: 20px;} /* :Header */ /* Footer: */ footer {background: var(--principal); color: var(--secundaria);} #Bloco3Rodape a {color: var(--secundaria) !important;} /* :Footer */ /* Página Home: */ #PrimeiraSessao {} .slick-dots li {border-radius: 50%; background: var(--branco); color: transparent;} .slick-dots li.slick-active {background: var(--secundaria);} #QuintaSessao {height: 100% !important; min-height: auto;} /* :Página Home */ /* Página: */ /* :Página */ /* -------------------------------- Versionamento Desktop: -------------------------------- */ @media screen and (min-width: 901px) { .DesktopItem {display: inline-block !important;} .MobileItem {display: none !important;} /* Elementos Desktop: */ h1 {font-size: 48px; line-height: 50px;} h2 {} h3 {font-size: 70px; line-height: 80px; font-weight: 800; text-transform: uppercase;} h4 {} h5 {} .primeirasessao { height: 100% } .primeirasessao .slick-dots { bottom: 50px } .centeredimgwrapper { position: absolute!important; top: 0!important; left: 0!important; width: 100vw!important; height: 100vh!important; display: flex!important; align-items: center; justify-content: center; z-index: 1; } .centeredimg { height: 402px } .centeredimgwrapper.segundawrapper { margin-top: -60px } .centeredimgwrapper.terceirawrapper { margin-top: -60px } .centeredimgwrapper.quartawrapper { margin-top: -60px } /* .centeredimgwrapper.sextawrapper { margin-top: -110px } */ .centeredimgwrapper.footerwrapper { margin-top: -38px } /* :Elementos Desktop */ /* Header Desktop: */ header nav {position: fixed; right: 0; width: 220px; top: 50%; margin-top: -133px; z-index: 30;} header nav a {display: block; clear: both; padding: 8px 16px; border-radius: 20px; border: 1px solid transparent; float: left; cursor: pointer; text-transform: uppercase; font-size: 14px; color: var(--branco); font-weight: 400} nav a.SessaoAtual {border: 1px solid #FFF; font-weight: 700;} #Central {width: 132px; left: 50%; top: 50%; margin-left: -66px; margin-top: -201px;} #LogoLeiteRosasEsquerda {width: 200px; top: 50%; margin-top: -65px; left: 25%; display: block; position: absolute;} #DireitaLeite {position: absolute; left: 50%; width: var(--widthDireita); top: 50%; margin-top: -190px;} #DireitaLeite p {font-size: 18px; line-height: 25px; font-weight: 500;} /* :Header Desktop */ /* Footer Desktop: */ footer {width: 100%; height: 100%; position: relative;} footer article {padding: 0;} footer #Bloco1Rodape {padding: 150px 0 0;} footer #Bloco1Rodape h4 {position: relative; left: var(--marginEsq); width: var(--widthEsquerda); font-size: 40px; line-height: 45px; font-weight: 700;} footer #Bloco1Rodape p {position: absolute; right: var(--marginDir); width: var(--widthDireita); font-size: 18px; line-height: 21px; font-weight: 500;} footer #Bloco2Rodape {margin-top: 40px; position: relative; left: var(--marginEsq);} footer #Bloco2Rodape h5 {font-size: 20px; line-height: 25px; font-weight: 700; width: 330px;} footer #Bloco2Rodape img {float: right; width: 120px; margin-left: 50px;} #Bloco2Rodape .Btn {color: var(--secundaria); border-color: var(--secundaria); z-index: 2;} #Bloco2Rodape .Btn:hover {color: var(--branco) !important; border-color: var(--branco);} footer #Bloco3Rodape {display: block; margin-top: 150px; clear: both; position: relative; left: var(--marginEsq);} footer #Bloco3Rodape div {float: left; display: block; line-height: 15px; font-size: 10px; width: 160px; margin-right: 40px;} footer #Bloco3Rodape div strong {font-weight: 700;} footer #Bloco3Rodape div p {font-size: 10px; line-height: 15px; font-weight: 500;} .SocialLinks {position: absolute; right: var(--marginDir); width: var(--widthDireita); margin-top: 40px; z-index: 2;} .SocialLinks a {color: var(--secundaria); font-size: 20px; margin-right: 20px} /* :Footer Desktop */ /* Página Home Desktop: */ .Home {} #PrimeiraSessao {overflow: hidden; margin-bottom: 0 !important;} #PrimeiraSessao:before {content: ''; display: block; background: var(--principal); width: 45%; height: 100%; position: absolute;} #PrimeiraSessao:after {content: ''; display: inline-block; position: absolute; width: 0; height: 0; top: 0; left: 45%; border-left: 0 solid transparent; border-right: 150px solid transparent; border-top: 900px solid var(--principal);} .chamada {} .chamada h3 {width: var(--widthEsquerda); /*height: 320px;*/ left: var(--marginEsq); display: block; position: relative; margin-top: 160px;} .chamada p {position: relative; font-size: 40px; line-height: 45px; font-weight: 700; left: var(--marginEsq); width: 380px; margin-top: 24px;} .chamada img {position: absolute; top: 0; left: 45%;} .slick-dots {z-index: 20; bottom: 100px; text-align: initial; left: var(--marginEsq);} .slick-prev, .slick-next { z-index: 10; } .Bloco1 {width: var(--widthEsquerda); left: var(--marginEsq); display: block; position: relative; padding-top: 160px; color: var(--principal); text-align: right; z-index: 2;} .Bloco1 .FichaTecnica a {color: var(--branco); font-size: 10px; text-transform: uppercase; display: inline-block; line-height: 38px; margin-right: 10px;} .Bloco1 .Btn {cursor: default; margin-left: 10px;} .Bloco1 h2 {font-size: 70px; line-height: 80px; font-weight: 700; margin: 40px 0 10px; text-transform: uppercase;} .Bloco1 h2:before {content: 'barla'; font-size: 20px; display: block;} .Bloco2 {position: absolute; right: var(--marginDir); width: var(--widthDireita); top: 207px;} .Bloco2 p {font-size: 40px; line-height: 50px; font-weight: 700; color: var(--principal);} .Bloco2 i { font-size: 24px; font-weight: 300; color: #f0cf28; z-index: 21; position: absolute; cursor: pointer; bottom: 98px; left: 175px; } .Bloco2 i.slick-disabled { opacity: .5; } .Bloco2 i.fa-chevron-right { left: 205px; } .Bloco2 .slick-dots li { border: 1px solid #fff; background: transparent; } .Bloco2 .slick-dots li.slick-active { border: 1px solid transparent; } #QuartaSessao {} #BlocoEsquerda {width: 50%; display: block; position: relative;} #ImagemHomem {position: absolute; right: 0;} #ImagemMulher {position: relative; left: 50px; top: 105px;} #QuartaSessao .Bloco2 {} #QuartaSessao .Bloco2 h6 {font-size: 40px; line-height: 50px; font-weight: 700; height: 220px; color: var(--principal);} #QuartaSessao .Btn {opacity: 0.3; cursor: default; margin-top: 100px;} #QuartaSessao .Btn.ativo {background: var(--principal); color: var(--secundaria); border-color: var(--principal); opacity: 1;} #QuartaSessao .slick-dots { left: initial } #QuartaSessao .slick-dots li { border: 1px solid #fff; background: transparent } #QuartaSessao .slick-dots li.slick-active {background: var(--principal);} #QuintaSessao {background-image: url('../images/img-run-desk.jpg');} #QuintaSessao:before {content: ''; display: block; position: absolute; left: 5%; top: 70px; width: 700px; height: 500px; border: 2px solid var(--principal); -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg);} #QuintaSessao div {width: var(--widthEsquerda); left: var(--marginEsq); display: block; position: relative; top: 160px; color: var(--principal);} #QuintaSessao p {font-size: 30px; line-height: 35px; font-weight: 700; color: var(--secundaria);} #SextaSessao {text-align: left;} #SextaSessao div {color: var(--branco); text-align: left;} #SextaSessao .Bloco2 {top:160px; z-index: 2;} #SextaSessao h7 {font-weight: 700; font-size: 20px; line-height: 25px; display: block; clear: both; margin-bottom: 20px; color: var(--principal) !important;} #SextaSessao strong {font-size: 30px; line-height: 35px; font-weight: 700; margin: 20px 0; display: block;} #SextaSessao p {font-size: 20px; line-height: 25px; padding-right: 30px;} /* :Página Home Desktop */ } /* -------------------------------- Versionamento Desktop: -------------------------------- */ /* -------------------------------- Versionamento Mobile: --------------------------------- */ @media screen and (max-width: 900px) { .DesktopItem {display: none !important;} .MobileItem {display: inline-block !important;} body {overflow-x: hidden;} /* Elementos Mobile: */ h1, h2, h3 {font-size: 30px; line-height: 35px; font-weight: 700; text-transform: uppercase;} h4 {} h5 {font-size: 96px; line-height: 100px;} :root { --margin: 150px; } .fullscreen-bg {height: auto; min-height: 100%; box-sizing: border-box;} /* :Elementos Mobile */ /* Header Mobile: */ header {} #AbrirMenu, #FecharMenu, #FecharLeite {font-size: 30px; color: var(--branco); padding: 20px; z-index: 4; position: fixed; right: 0; top: 0;} #FecharMenu {color: var(--secundaria) !important} header nav {position: fixed; margin-top: 0; background: var(--principal); width: 100%; height: 100%; z-index: 10; display: none; box-sizing: border-box; left: 0; top: 0; padding: 100px 30px 40px; text-align: center;} header nav a {display: block; clear: both; padding: 10px; font-size: 18px; font-weight: 600; color: var(--secundaria); text-transform: uppercase;} #FecharMenu {margin-top: 0;} header nav.MenuAberto {margin-top: 0;} .Logo {z-index: 20; display: none;} .Logo.MenuAberto {position: fixed !important; display: block;} #Central {width: 97px; left: 24px; top: 65px;} .ImagemPrincipalSessao {width: 97px !important; height: 296px !important; top: 60px; left: 24px; position: absolute;} #ImagemUm {top: -750px; position: relative !important;} #ImagemQuartaSessao {top: 350px;} #ImagemSessaoCinco {top: 150px;} #LogoLeiteRosasEsquerda {width: 150px; display: block; margin: 30px auto 0;} #DireitaLeite {width: 100%; padding: 30px; box-sizing: border-box;} #DireitaLeite p {font-size: 18px; line-height: 25px; font-weight: 500;} /* :Header Mobile */ /* Footer Mobile: */ footer {padding: 60px 40px 0; padding-left: var(--margin);} footer #Bloco1Rodape h4 {font-size: 20px; line-height: 30px; font-weight: 700; margin-bottom: 20px; display: block;} footer #Bloco1Rodape p {font-size: 15px; line-height: 20px; font-weight: 500;} footer #Bloco2Rodape {margin-top: 40px;} footer #Bloco2Rodape h5 {font-size: 20px; line-height: 25px; font-weight: 700;} footer #Bloco2Rodape img {width: 120px; margin-bottom: 20px; display: block;} #Bloco2Rodape .Btn {color: var(--secundaria); border-color: var(--secundaria); margin-top:20px;} footer #Bloco3Rodape {display: block; margin-top: 50px; clear: both; position: relative;} footer #Bloco3Rodape div {display: block; padding-bottom: 20px;} footer #Bloco3Rodape div strong {font-weight: 700; line-height: 15px; font-size: 12px;} footer #Bloco3Rodape div p {font-size: 12px; line-height: 15px; font-weight: 500;} .SocialLinks {padding: 0 0 30px;} .SocialLinks a {color: var(--secundaria); font-size: 20px; margin-right: 20px} #Copyright {} /* :Footer Mobile */ /* Página Home Mobile: */ .Home {} #PrimeiraSessao {overflow: hidden; margin-bottom: 0 !important;} #PrimeiraSessao:before {content: ''; display: block; background: var(--principal); width: 100%; height: 450px; position: absolute; left: 150px} #PrimeiraSessao:after {content: ''; display: inline-block; position: absolute; width: 0; height: 0; top: 0; left: 51px; border-right: 0 solid transparent; border-left: 100px solid transparent; border-bottom: 450px solid var(--principal);} .chamada {overflow-x: hidden;} .chamada h3 {width: 180px; height: 140px; left: var(--margin); display: block; position: relative; margin-top: 100px;} .chamada p {position: relative; font-size: 25px; line-height: 30px; font-weight: 700; left: var(--margin); width: 180px; height: 90px; margin-top: 24px;} .chamada img {width: 100%; margin-top: 96px; margin-left: 10%} .slick-dots {z-index: 5; bottom: initial; top: 380px; text-align: initial; left: var(--margin);} #SegundaSessao {margin-top: -270px !important;} .Bloco1 {padding: 60px 40px 0; padding-left: var(--margin); color: var(--principal); box-sizing: border-box; z-index: 2;} .Bloco1 .FichaTecnica a {color: var(--branco); font-size: 10px; font-weight: 500; text-transform: uppercase; display: block; line-height: 38px; margin-right: 10px;} .Bloco1 .Btn {cursor: default; margin: 0; margin-right: 10px;} .Bloco1 h2 {font-size: 35px; line-height: 35px; font-weight: 700; margin: 15px 0; text-transform: uppercase;} .Bloco1 h2:before {content: 'barla'; font-size: 20px; display: block;} .Bloco2 {padding: 30px 40px 0; padding-left: var(--margin); box-sizing: border-box;} #QuartaSessao .Bloco2 {padding: 30px 0 0; padding-left: var(--margin); } .Bloco2 p {font-size: 27px; box-sizing: border-box; line-height: 35px; font-weight: 700; color: var(--principal);} #mc_embed_shell .button {float: none; margin-bottom: 60px;} #ImagemHomem {margin-left: -30px; max-width: 90%;} #ImagemMulher {position: absolute; right: -30px; top: 105px; max-width: 50%;} #QuartaSessao .Bloco2 {} #QuartaSessao .Bloco2 h6 {font-size: 30px; line-height: 35px; font-weight: 700; height: 175px; color: var(--principal);} #QuartaSessao .Btn {opacity: 0.3; cursor: default; margin-top: 20px;} #QuartaSessao .Btn.ativo {background: var(--principal); color: var(--secundaria); border-color: var(--principal); opacity: 1;} #QuartaSessao .slick-dots {top: initial; bottom: -40px; left: var(--margin);} #QuartaSessao .slick-dots li.slick-active {background: var(--principal); border: 1px solid transparent} #QuartaSessao .slick-dots li { border: 1px solid #fff; background: transparent; } #QuartaSessao, #TerceiraSessao {min-height: 120%;} #ImagemTalcoRodape {left: -130px;} #QuintaSessao {color: var(--branco) !important; background-image: url('../images/img-run-mobile.jpg');} /*#QuintaSessao:before {content: ''; display: block; position: absolute; left: 0; top: 70px; width: 700px; height: 500px; border: 2px solid var(--principal); -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg);}*/ #QuintaSessao div {position: relative; top: 160px; padding: 30px 10px 0; padding-left: var(--margin);} #QuintaSessao p {font-size: 20px; line-height: 25px; font-weight: 700; margin-top: 20px;} #SextaSessao {text-align: left;} #SextaSessao div {color: var(--branco); text-align: left;} #SextaSessao h7 {font-weight: 700; font-size: 20px; line-height: 25px; display: block; clear: both; margin-bottom: 20px; color: var(--principal) !important;} #SextaSessao strong {font-size: 20px; line-height: 25px; font-weight: 700; margin: 20px 0; display: block;} #SextaSessao p {font-size: 16px; line-height: 20px; font-weight: 500;} /* :Página Home Mobile */ } @media screen and (max-width: 330px) { /* correções para o Iphone 5/SE */ /* Elementos Mobile: */ h1, h2, h3 {font-size: 20px; line-height: 25px; font-weight: 700; text-transform: uppercase;} h4 {} h5 {font-size: 96px; line-height: 100px;} :root { --margin: 150px; } .fullscreen-bg {height: auto; min-height: 130%; box-sizing: border-box;} /* :Elementos Mobile */ /* Header Mobile: */ header {} #AbrirMenu, #FecharMenu, #FecharLeite {font-size: 30px; color: var(--branco); padding: 20px; z-index: 4; position: fixed; right: 0; top: 0;} #FecharMenu {color: var(--secundaria) !important} header nav {position: fixed; margin-top: 0; background: var(--principal); width: 100%; height: 100%; z-index: 10; display: none; box-sizing: border-box; left: 0; top: 0; padding: 100px 30px 40px; text-align: center;} header nav a {display: block; clear: both; padding: 10px; font-size: 18px; font-weight: 600; color: var(--secundaria); text-transform: uppercase;} #FecharMenu {margin-top: 0;} header nav.MenuAberto {margin-top: 0;} .Logo {z-index: 20; display: none;} .Logo.MenuAberto {position: fixed !important; display: block;} #Central {width: 97px; left: 24px; top: 65px;} #LogoLeiteRosasEsquerda {width: 150px; display: block; margin: 30px auto 0;} #DireitaLeite {width: 100%; padding: 30px; box-sizing: border-box;} #DireitaLeite p {font-size: 12px; line-height: 18px; font-weight: 500;} /* :Header Mobile */ /* Footer Mobile: */ footer {padding: 60px 40px 0; padding-left: var(--margin);} footer #Bloco1Rodape h4 {font-size: 20px; line-height: 30px; font-weight: 700; margin-bottom: 20px; display: block;} footer #Bloco1Rodape p {font-size: 15px; line-height: 20px; font-weight: 500;} footer #Bloco2Rodape {margin-top: 40px;} footer #Bloco2Rodape h5 {font-size: 20px; line-height: 25px; font-weight: 700;} footer #Bloco2Rodape img {width: 120px; margin-bottom: 20px; display: block;} #Bloco2Rodape .Btn {color: var(--secundaria); border-color: var(--secundaria);} footer #Bloco3Rodape {display: block; margin-top: 50px; clear: both; position: relative;} footer #Bloco3Rodape div {display: block; padding-bottom: 20px;} footer #Bloco3Rodape div strong {font-weight: 700; line-height: 15px; font-size: 12px;} footer #Bloco3Rodape div p {font-size: 12px; line-height: 15px; font-weight: 500;} .SocialLinks {padding: 0 0 30px;} .SocialLinks a {color: var(--secundaria); font-size: 20px; margin-right: 20px} #Copyright {} /* :Footer Mobile */ /* Página Home Mobile: */ .Home {} #PrimeiraSessao {overflow: hidden; margin-bottom: 0 !important;} #PrimeiraSessao:before {content: ''; display: block; background: var(--principal); width: 100%; height: 450px; position: absolute; left: 150px} #PrimeiraSessao:after {content: ''; display: inline-block; position: absolute; width: 0; height: 0; top: 0; left: 50px; border-right: 0 solid transparent; border-left: 100px solid transparent; border-bottom: 450px solid var(--principal);} .chamada {overflow-x: hidden;} .chamada h3 {width: 120px; height: 100px; left: var(--margin); display: block; position: relative; margin-top: 100px;} .chamada p {position: relative; font-size: 15px; line-height: 20px; font-weight: 700; left: var(--margin); width: 120px; height: 60px; margin-top: 24px;} .chamada img {width: 100%; margin-top: 166px; margin-left: 10%} .slick-dots {z-index: 5; bottom: initial; top: 350px; text-align: initial; left: var(--margin);} .Bloco1 {padding: 60px 40px 0; padding-left: var(--margin); color: var(--principal); box-sizing: border-box} .Bloco1 .FichaTecnica a {color: var(--branco); font-size: 10px; text-transform: uppercase; display: inline-block; line-height: 38px; margin-right: 10px;} .Bloco1 .Btn {cursor: default; margin: 5px 0;} .Bloco1 h2 {font-size: 25px; line-height: 40px; font-weight: 700; margin: 30px 0; text-transform: uppercase;} .Bloco1 h2:before {content: 'barla'; font-size: 15px; display: block;} .Bloco2 {padding: 30px 10px 0; padding-left: var(--margin); box-sizing: border-box;} .Bloco2 p {font-size: 20px; box-sizing: border-box; line-height: 30px; font-weight: 700; color: var(--principal);} #mc_embed_shell .button {float: none; margin-bottom: 60px;} #ImagemHomem {margin-left: -30px; max-width: 90%;} #ImagemMulher {position: absolute; right: -30px; top: 105px; max-width: 50%;} #TerceiraSessao {min-height: 120%; margin-top: -200px;} #QuartaSessao {min-height: 150% !important;} #QuartaSessao .Bloco2 {} #QuartaSessao .Bloco2 h6 {font-size: 20px; line-height: 25px; font-weight: 700; height: 100px; color: var(--principal);} #QuartaSessao .Btn {opacity: 0.3; cursor: default; margin-top: 70px; font-size: 10px;} #QuartaSessao .Btn.ativo {background: var(--principal); color: var(--secundaria); border-color: var(--principal); opacity: 1;} #QuartaSessao .slick-dots {top: initial; bottom: 50px; left: var(--margin);} #QuartaSessao .Bloco2 .slick-dots li {width: 10px; height: 10px; } #QuartaSessao .slick-dots li.slick-active {background: var(--principal);} #QuartaSessao .slick-dots { border: 1px solid #fff; background: transparent } /*#QuintaSessao:before {content: ''; display: block; position: absolute; left: 0; top: 70px; width: 700px; height: 500px; border: 2px solid var(--principal); -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg);}*/ #QuintaSessao div {position: relative; top: 160px; padding: 30px 10px 0; padding-left: var(--margin);} #QuintaSessao p {font-size: 15px; line-height: 20px; font-weight: 700; margin-top: 20px;} #SextaSessao {text-align: left;} #SextaSessao div {color: var(--branco); text-align: left;} #SextaSessao h7 {font-weight: 700; font-size: 20px; line-height: 25px; display: block; clear: both; margin-bottom: 20px; color: var(--principal) !important;} #SextaSessao strong {font-size: 15px; line-height: 20px; font-weight: 700; margin: 20px 0; display: block;} #SextaSessao p {font-size: 12px; line-height: 15px;} /* :Página Home Mobile */ } /* -------------------------------- :Versionamento Mobile --------------------------------- */ .link-loja { display: inline-flex; border: 1px solid var(--principal); border-radius: 18px; padding: 8px 16px; margin-bottom: 30px; font-weight: 400; } @media (max-width: 768px) { .link-loja { font-size: 13px; padding: 6px 10px; } }