/* DEFINIÇÕES TÉCNICAS DO SITE (Início) */ * { margin: 0 auto; padding: 0; list-style-type: none; } html, body { display: block; height: 100%; font: inherit; border: 0; vertical-align: baseline; font-family: 'proxima_nova_rgregular'; } body { overflow-x: hidden; font-size: 100%; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; background: #fff; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; font-size: 0; } .clearfix { display: inline-block; *zoom: 1; } * html .clearfix { height: 1%; } .clearfix { display: block; } /* DEFINIÇÕES TÉCNICAS DO SITE (Final) */ /* DEFINIÇÕES DE FONTES (Início) */ @font-face { font-family: 'klavika_bdbold'; src: url('../fontes/klavika-bold-webfont.woff2') format('woff2'), url('../fontes/klavika-bold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'klavikalight'; src: url('../fontes/klavika-light-webfont.woff2') format('woff2'), url('../fontes/klavika-light-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'klavikamedium'; src: url('../fontes/klavika-medium-webfont.woff2') format('woff2'), url('../fontes/klavika-medium-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'klavika_rgregular'; src: url('../fontes/klavika-regular-webfont.woff2') format('woff2'), url('../fontes/klavika-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'proxima_nova_rgregular'; src: url('../fontes/proxima-nova-5890c8a35305b-webfont.woff2') format('woff2'), url('../fontes/proxima-nova-5890c8a35305b-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'proxima_novablack'; src: url('../fontes/proxima-nova-black-5890c8c8cd6fe-webfont.woff2') format('woff2'), url('../fontes/proxima-nova-black-5890c8c8cd6fe-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'proxima_nova_rgbold'; src: url('../fontes/proxima-nova-bold-5890c8d1c44e2-webfont.woff2') format('woff2'), url('../fontes/proxima-nova-bold-5890c8d1c44e2-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'proxima_novaextrabold'; src: url('../fontes/proxima-nova-extrabold-5890c8bfb1390-webfont.woff2') format('woff2'), url('../fontes/proxima-nova-extrabold-5890c8bfb1390-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'proxima_novalight'; src: url('../fontes/proxima-nova-light-5890c8b61e1c6-webfont.woff2') format('woff2'), url('../fontes/proxima-nova-light-5890c8b61e1c6-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'proxima_novasemibold'; src: url('../fontes/proxima-nova-semibold-5890c90c7f553-webfont.woff2') format('woff2'), url('../fontes/proxima-nova-semibold-5890c90c7f553-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } /* DEFINIÇÕES DE FONTES (Final) */ /* DEFINIÇÕES DO HOTSITE (Início) */ #ingresso-gillette-ligadajustica header { padding: 15px 0; width: 100%; background: rgba(0, 0, 0, 1); } #ingresso-gillette-ligadajustica header a { float: left; margin-left: 35px; } #ingresso-gillette-ligadajustica header .ingresso-logo { display: block; width: 223px; height: 34px; border: none; } #ingresso-gillette-ligadajustica section { width: 100%; color: #fff; background: #00355f; /* Old browsers */ background: -moz-linear-gradient(top, #00355f 0%, #001220 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #00355f 0%,#001220 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #00355f 0%,#001220 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00355f', endColorstr='#001220',GradientType=0 ); /* IE6-9 */ } #ingresso-gillette-ligadajustica section .imagem-destaque-desktop { width: 100%; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-portrait { display: none; width: 100%; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-landscape { display: none; width: 100%; } #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 50px auto 45px auto; font-family: 'klavika_rgregular'; font-size: 3.5em; font-weight: 100; text-transform: uppercase; letter-spacing: 2px; text-align: center; } #ingresso-gillette-ligadajustica section ul { padding-bottom: 50px; width: 90%; border-bottom: 1px solid #3c79a8; } #ingresso-gillette-ligadajustica section ul li { display: inline-block; float: left; list-style-type: none; font-size: 0.8em; font-weight: normal; text-align: center; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao { width: 13.3%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { width: 22%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { font-size: 1.3em; line-height: 22px; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-seta { margin-top: 55px; width: 4%; } #ingresso-gillette-ligadajustica section article { clear: both; margin-top: 50px; width: 50%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 1.125em; letter-spacing: 1px; text-transform: uppercase; text-align: left; font-weight: 800; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 20px 0 40px 0; font-size: 1em; line-height: 27px; text-align: left; font-weight: 100; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-link { color: #7dd4ff; text-decoration: none; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-link:hover { color: #0091d8; } #ingresso-gillette-ligadajustica section article .a { display: block; margin: 50px auto 80px auto; padding: 18px 0; width: 350px; color:#25b8ff; font-family: 'klavika_rgregular'; font-size: 1.7em; text-transform: uppercase; text-decoration: none; text-align: center; border: 1px solid #25b8ff; } #ingresso-gillette-ligadajustica section article .a:hover { border-color:#0091d8; } #ingresso-gillette-ligadajustica footer { background: #001220; } #ingresso-gillette-ligadajustica footer .legal-line { font-size: 0.8em; color: #777; text-align: center; letter-spacing: 1px; } #ingresso-gillette-ligadajustica footer .footer-imagem { width: 100%; } /* DEFINIÇÕES DO HOTSITE (Final) */ /* DEFINIÇÕES DO HOTSITE - MEDIA QUERY (Início) */ @media all and (max-width: 1600px) { #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 30px auto 35px auto; font-size: 3em; } #ingresso-gillette-ligadajustica section ul { padding-bottom: 35px; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { width: 20%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { font-size: 1.175em; line-height: 20px; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-seta { margin-top: 40px; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-seta .imagem-setas { width: 55%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 1.075em; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 15px 0 40px 0; font-size: 0.925em; line-height: 25px; } #ingresso-gillette-ligadajustica section article .a { margin: 50px auto 80px auto; padding: 15px 0; width: 320px; font-size: 1.5em; } #ingresso-gillette-ligadajustica footer .legal-line { font-size: 0.75em; letter-spacing: 0.5px; } } @media all and (max-width: 1440px) { #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 30px auto 35px auto; font-size: 2.5em; } #ingresso-gillette-ligadajustica section ul { padding-bottom: 25px; width: 96%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { width: 26%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { font-size: 1em; line-height: 17px; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-seta { margin-top: 35px; } #ingresso-gillette-ligadajustica section article { margin-top: 35px; width: 70%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 0.95em; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 10px 0 30px 0; font-size: 0.85em; line-height: 22px; } #ingresso-gillette-ligadajustica section article .a { margin: 50px auto 80px auto; padding: 15px 0; width: 280px; font-size: 1.3em; } #ingresso-gillette-ligadajustica footer .legal-line { font-size: 0.7em; line-height: 20px; } } @media all and (max-width: 1280px) { html, body { font-family: 'proxima_novalight'; } #ingresso-gillette-ligadajustica section .imagem-destaque-desktop { display: none; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-portrait { display: none; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-landscape { display: block; } #ingresso-gillette-ligadajustica header { padding: 10px 0; } #ingresso-gillette-ligadajustica header a { margin-left: 20px; } #ingresso-gillette-ligadajustica header .ingresso-logo { width: 181px; height: 28px; } #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 20px auto; width: 90%; text-align: left; font-size: 2.8em; } #ingresso-gillette-ligadajustica section ul { width: 90%; } #ingresso-gillette-ligadajustica section ul li { text-align: left; margin: 10px 0; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao { width: 100%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { float: left; margin: 0 1.5% 0 0; width: 3%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { margin: 3px 0 10px 1.5%; width: 91%; font-size: 1.9em; line-height: 30px; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-seta { display: none; } #ingresso-gillette-ligadajustica section article { width: 90%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 1.2em; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 10px 0 30px 0; font-size: 1.15em; line-height: 27px; } #ingresso-gillette-ligadajustica section article .a { margin: 50px auto 80px auto; padding: 15px 0; width: 350px; font-size: 1.7em; } #ingresso-gillette-ligadajustica footer .legal-line { font-size: 0.85em; letter-spacing: 1px; } } @media all and (max-width: 1280px) and (orientation: portrait) { #ingresso-gillette-ligadajustica section .imagem-destaque-desktop { display: block; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-portrait { display: none; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-landscape { display: none; } #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 20px auto; font-size: 2.3em; } #ingresso-gillette-ligadajustica section ul { width: 90%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao { width: 100%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { margin: 0 1.5% 0 0; width: 5%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { margin: 5px 0 10px 1.5%; width: 89%; font-size: 1.9em; line-height: 30px; } #ingresso-gillette-ligadajustica section article { width: 90%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 1.2em; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 10px 0 30px 0; font-size: 1.15em; line-height: 27px; } #ingresso-gillette-ligadajustica section article .a { margin: 50px auto 80px auto; padding: 15px 0; width: 350px; font-size: 1.6em; } } @media all and (max-width: 700px) and (orientation: portrait) { #ingresso-gillette-ligadajustica section .imagem-destaque-desktop { display: none; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-portrait { display: block; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-landscape { display: none; } #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 10px auto 5px auto; width: 90%; font-size: 1.25em; letter-spacing: 0; } #ingresso-gillette-ligadajustica section ul { width: 90%; } #ingresso-gillette-ligadajustica section ul li { margin: 10px 0; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { padding-bottom: 25px; width: 6%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { margin: 1px 0 0 1.5%; width: 91%; font-size: 1.3em; line-height: 20px; } #ingresso-gillette-ligadajustica section article { width: 90%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 0.85em; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 10px 0 30px 0; font-size: 0.85em; line-height: 20px; } #ingresso-gillette-ligadajustica section article .a { margin: 40px auto 50px auto; padding: 10px 0; width: 200px; font-size: 1em; } #ingresso-gillette-ligadajustica footer .legal-line { font-size: 0.45em; line-height: 12px; letter-spacing: 0; } } @media all and (max-width: 700px) and (orientation: landscape) { #ingresso-gillette-ligadajustica section .imagem-destaque-desktop { display: none; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-portrait { display: none; } #ingresso-gillette-ligadajustica section .imagem-destaque-mobile-landscape { display: block; } #ingresso-gillette-ligadajustica section .como-resgatar-seu-promocode { margin: 15px auto 5px auto; width: 90%; font-size: 1.5em; letter-spacing: 0; } #ingresso-gillette-ligadajustica section ul { width: 90%; } #ingresso-gillette-ligadajustica section ul li { margin: 3px 0; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao img { padding-bottom: 5px; width: 4%; } #ingresso-gillette-ligadajustica section ul .como-resgatar-seu-promocode-informacao p { margin: 3px 0 0 1.5%; width: 91%; font-size: 1.3em; line-height: 20px; } #ingresso-gillette-ligadajustica section article { width: 90%; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes { font-size: 0.85em; } #ingresso-gillette-ligadajustica section article .termos-e-condicoes-texto { margin: 10px 0 30px 0; font-size: 0.85em; line-height: 20px; } #ingresso-gillette-ligadajustica section article .a { margin: 40px auto 50px auto; padding: 12px 0; width: 230px; font-size: 1.2em; } #ingresso-gillette-ligadajustica footer .legal-line { font-size: 0.45em; line-height: 12px; letter-spacing: 0; } } /* DEFINIÇÕES DO HOTSITE - MEDIA QUERY (Final) */ /* DEFINIÇÕES ANIMAÇÕES (Início) */ .animacao-0-3-seg { visibility: visible !important; -webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; animation-delay: 0.3s; } .animacao-0-4-seg { visibility: visible !important; -webkit-animation-delay: 0.4s; -moz-animation-delay: 0.4s; animation-delay: 0.4s; } .animacao-0-5-seg { visibility: visible !important; -webkit-animation-delay: 0.5s; -moz-animation-delay: 0.5s; animation-delay: 0.5s; } .animacao-0-6-seg { visibility: visible !important; -webkit-animation-delay: 0.6s; -moz-animation-delay: 0.6s; animation-delay: 0.6s; } .animacao-0-7-seg { visibility: visible !important; -webkit-animation-delay: 0.7s; -moz-animation-delay: 0.7s; animation-delay: 0.7s; } .animacao-0-8-seg { visibility: visible !important; -webkit-animation-delay: 0.8s; -moz-animation-delay: 0.8s; animation-delay: 0.8s; } .animacao-0-9-seg { visibility: visible !important; -webkit-animation-delay: 0.9s; -moz-animation-delay: 0.9s; animation-delay: 0.9s; } .animacao-1-seg { visibility: visible !important; -webkit-animation-delay: 1s; -moz-animation-delay: 1s; animation-delay: 1s; } .animacao-1-3-seg { visibility: visible !important; -webkit-animation-delay: 1.3s; -moz-animation-delay: 1.3s; animation-delay: 1.3s; } .animacao-1-5-seg { visibility: visible !important; -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; animation-delay: 1.5s; } .animacao-1-7-seg { visibility: visible !important; -webkit-animation-delay: 1.7s; -moz-animation-delay: 1.7s; animation-delay: 1.7s; } .animacao-2-seg { visibility: visible !important; -webkit-animation-delay: 2s; -moz-animation-delay: 2s; animation-delay: 2s; } .animacao-2-3-seg { visibility: visible !important; -webkit-animation-delay: 2.3s; -moz-animation-delay: 2.3s; animation-delay: 2.3s; } .animacao-2-5-seg { visibility: visible !important; -webkit-animation-delay: 2.5s; -moz-animation-delay: 2.5s; animation-delay: 2.5s; } .animacao-2-7-seg { visibility: visible !important; -webkit-animation-delay: 2.7s; -moz-animation-delay: 2.7s; animation-delay: 2.7s; } .animacao-3-seg { visibility: visible !important; -webkit-animation-delay: 3s; -moz-animation-delay: 3s; animation-delay: 3s; } /* DEFINIÇÕES ANIMAÇÕES (Final) */