@charset "UTF-8"; @font-face { font-family: "Nespresso-ExtraBold"; font-style: normal; font-weight: normal; src: url("../fonts/Nespresso-ExtraBold.eot?#iefix") format("embedded-opentype"), url("../fonts/Nespresso-ExtraBold.woff2") format("woff2"), url("../fonts/Nespresso-ExtraBold.woff") format("woff"), url("../fonts/Nespresso-ExtraBold.ttf") format("truetype"), url("../fonts/Nespresso-ExtraBold.svg#Nespresso-ExtraBold") format("svg"); } @font-face { font-family: "Nespresso-Bold"; font-style: normal; font-weight: normal; src: url("../fonts/Nespresso-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Nespresso-Bold.woff2") format("woff2"), url("../fonts/Nespresso-Bold.woff") format("woff"), url("../fonts/Nespresso-Bold.ttf") format("truetype"), url("../fonts/Nespresso-Bold.svg#Nespresso-Bold") format("svg"); } @font-face { font-family: "Nespresso-Regular"; font-style: normal; font-weight: normal; src: url("../fonts/Nespresso-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Nespresso-Regular.woff2") format("woff2"), url("../fonts/Nespresso-Regular.woff") format("woff"), url("../fonts/Nespresso-Regular.ttf") format("truetype"), url("../fonts/Nespresso-Regular.svg#Nespresso-Regular") format("svg"); } @font-face { font-family: "Nespresso-Light"; font-style: normal; font-weight: normal; src: url("../fonts/Nespresso-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Nespresso-Light.woff2") format("woff2"), url("../fonts/Nespresso-Light.woff") format("woff"), url("../fonts/Nespresso-Light.ttf") format("truetype"), url("../fonts/Nespresso-Light.svg#Nespresso-Light") format("svg"); } body { font-family: "Nespresso-Regular", Arial, sans-serif; font-size: 17px; } @media(max-width: 480px) { body { font-size: 12px; line-height: 18px; } } * { margin: 0; padding: 0; } a { text-decoration: none; } a, button, input, textarea { outline: none; } strong { font-family: "Nespresso-Bold", Arial, sans-serif; } body #banner .machines .machine, body #video .thumbnail a, body #machines, body #machines::before, body #machines #machines-slider .slick-dots li button, body #receitas .gridD .tabs .tab, body #informacoes .boxes .box, body #capsules .beneficios .title, body #capsules .beneficios .title::after, body #capsules .circle .bgs .bg, body #clube-nespresso .boxes .box { -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .circle { border-top-left-radius: 50%; border-top-right-radius: 50%; border-bottom-left-radius: 50%; border-bottom-right-radius: 50%; } .gridE, .gridD, .gridF { margin-left: auto; margin-right: auto; } .gridE { width: 90%; } .gridD { max-width: 1000px; } .gridF { width: 996px; } .loader { height: 100%; width: 100%; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #ffffff; z-index: 3000; } .loader .iconLoad { height: 50px; width: 50px; position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -25px; border: 8px solid rgba(0, 0, 0, 0.1); border-top: 8px solid #333452; border-radius: 50%; -webkit-animation: iconLoad 0.5s linear infinite; -moz-animation: iconLoad 0.5s linear infinite; animation: iconLoad 0.5s linear infinite; } @-webkit-keyframes iconLoad { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); } } @-moz-keyframes iconLoad { 0% { -moz-transform: rotate(0deg); } 100% { -moz-transform: rotate(359deg); } } @keyframes iconLoad { 0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); -moz-transform: rotate(359deg); -ms-transform: rotate(359deg); -o-transform: rotate(359deg); transform: rotate(359deg); } } .title h2 { font-size: 26px; color: #ffffff; text-align: center; text-transform: uppercase; line-height: 45px; font-weight: 400; } @media(max-width: 480px) { .title h2 { font-size: 13.996px; line-height: 16.8px; } } .title p { color: #000000; text-align: center; text-transform: uppercase; line-height: 28px; } .title.black h2 { color: #000000; } .after-btn { position: relative; } .after-btn::after { content: ""; display: block; position: absolute; bottom: -22.5px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); height: 45px; width: 45px; z-index: 2; background: url("../img/icons/after-btn.png") center center no-repeat; } @media(max-width: 480px) { .after-btn::after { display: none; } } .wow { visibility: hidden; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .icon { background-image: url("../img/icons/sprite-icons.png"); display: block; } .icon-time { height: 24px; width: 24px; background-position: 0 -3px; } .icon-difficulty { height: 29px; width: 30px; background-position: -37px 0; } .icon-capsule { height: 29px; width: 29px; } .icon-capsule.fortissio-lungo { background-position: -80px 0; } .icon-capsule.livanto { background-position: -122px 0; } body { /** * VERSÃO GERAL */ } body #banner-promo { position: relative; height: 300px; width: 100%; } body #banner-promo a { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: 100%; width: 100%; background: url("../img/banner-promo/banner-desktop.jpg") center center no-repeat; background-size: auto 100%; } body #banner-promo a img { display: none; } @media(max-width: 992px) { body #banner-promo { height: 230px; } } @media(max-width: 768px) { body #banner-promo { height: 180px; } } @media(max-width: 480px) { body #banner-promo { height: 118px; } body #banner-promo img { display: block; width: 100%; } } body #banner { height: 698px; background: url("../img/mesa.jpg") center top no-repeat; } @media(max-width: 480px) { body #banner { background: url("../img/mesa-mobile.jpg") center top; height: 345px; } } body #banner .logo-nespresso { padding-top: 40px; z-index: 1; } body #banner .logo-nespresso img { display: block; margin-right: auto; margin-left: auto; } @media(max-width: 480px) { body #banner .logo-nespresso img { width: 172px; } } body #banner .logo-machine { padding-top: 30px; } @media(max-width: 480px) { body #banner .logo-machine { padding-top: 15px; } } body #banner .logo-machine img { display: block; margin-right: auto; margin-left: auto; } @media(max-width: 480px) { body #banner .logo-machine img { width: 132px; } } body #banner .logo-machine p { font-size: 27.4px; color: #ffffff; text-align: center; padding-top: 38px; } body #banner .logo-machine p br { display: none; } @media(max-width: 480px) { body #banner .logo-machine p { font-size: 15.24px; padding-top: 24px; } body #banner .logo-machine p br { display: block; } } body #banner .machines { margin-top: 37px; padding-left: 55px; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -moz-box-align: end; box-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; -ms-align-items: flex-end; -o-align-items: flex-end; align-items: flex-end; -ms-flex-align: end; position: relative; } @media(max-width: 480px) { body #banner .machines { max-width: 320px; padding-left: 0; margin-right: auto; margin-left: auto; margin-top: 25px; } } body #banner .machines.machine1 { margin-left: -12px; } body #banner .machines .machine { position: relative; top: 0; } body #banner .machines .machine:hover { top: -10px; } @media(max-width: 480px) { body #banner .machines .machine { -webkit-box-ordinal-group: 2; -moz-box-ordinal-group: 2; box-ordinal-group: 2; -webkit-order: 2; -moz-order: 2; order: 2; -ms-flex-order: 2; } body #banner .machines .machine img { max-width: 100%; } } body #banner .machines .capsule { position: absolute; z-index: 2; } body #banner .machines .capsule.volluto { left: 192px; } @media(max-width: 480px) { body #banner .machines .capsule.volluto { left: 145px; } body #banner .machines .capsule.volluto img { width: 24px; } } body #banner .machines .capsule.linizio { left: 625px; } @media(max-width: 480px) { body #banner .machines .capsule.linizio { left: auto; right: -15px; } body #banner .machines .capsule.linizio img { width: 22px; } } body #banner .machines .copos { margin-left: 60px; } @media(max-width: 480px) { body #banner .machines .copos { margin-left: 0; -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; box-ordinal-group: 1; -webkit-order: 1; -moz-order: 1; order: 1; -ms-flex-order: 1; } body #banner .machines .copos img { max-width: 100%; } } body #video { background: url("../img/bg-video.jpg") center top no-repeat; padding-top: 5px; } body #video .thumbnail { height: 557px; width: 100%; background: url("../img/thumb-video.jpg") center center no-repeat; position: relative; } body #video .thumbnail a { height: 189px; width: 189px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; background: url("../img/icons/play.png") center center no-repeat; z-index: 2; } body #video .thumbnail a:hover { opacity: 0.7; } @media(max-width: 480px) { body #video .thumbnail a { height: 43px; width: 43px; background-size: 100%; } } body #video .video { background: #000000; } body #machines { position: relative; background: #4e918a; padding-top: 55px; } @media(max-width: 480px) { body #machines { padding-top: 33px; } } body #machines::before { content: ""; display: block; height: 100%; width: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url("../img/assets/green-light.png") center center no-repeat; } body #machines.orange { background: #db8f3e; } body #machines.orange::before { background-image: url("../img/assets/orange-light.png"); } body #machines .title { position: relative; z-index: 3; } body #machines .title h2 { max-width: 402px; margin-right: auto; margin-left: auto; } body #machines #machines-slider { margin-bottom: 0; } body #machines #machines-slider .slick-dots { position: absolute; bottom: 55px; } @media(max-width: 480px) { body #machines #machines-slider .slick-dots { bottom: 33px; } } body #machines #machines-slider .slick-dots li button { padding: 0; height: 16px; width: 16px; border: 1px solid #ffffff; background: transparent; border-radius: 50%; } body #machines #machines-slider .slick-dots li button::before { content: none; } body #machines #machines-slider .slick-dots li.slick-active button { background: #ffffff; } body #machines #machines-slider .slick-dots li:hover button { background: #ffffff; } body #machines #machines-slider .item { background-position: center center; background-repeat: no-repeat; height: 730px; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -moz-box-align: end; box-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; -ms-align-items: flex-end; -o-align-items: flex-end; align-items: flex-end; -ms-flex-align: end; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; outline: none; } @media(max-width: 480px) { body #machines #machines-slider .item { background-size: 200% auto; height: 365px; background-position: top center; } } body #machines #machines-slider .item.item1 { background-image: url("../img/machines/machine1.png"); } body #machines #machines-slider .item.item2 { background-image: url("../img/machines/machine2.png"); } body #machines #machines-slider .item.item3 { background-image: url("../img/machines/machine3.png"); } body #machines #machines-slider .item.item4 { background-image: url("../img/machines/machine4.png"); } body #machines #machines-slider .item .txt { text-align: center; padding-bottom: 105px; } @media(max-width: 480px) { body #machines #machines-slider .item .txt { padding-bottom: 70px; } } body #machines #machines-slider .item .txt h3 { font-family: "Nespresso-ExtraBold", Arial, sans-serif; font-size: 20px; color: #ffffff; } @media(max-width: 480px) { body #machines #machines-slider .item .txt h3 { font-size: 14px; } } body #machines #machines-slider .item .txt p { font-size: 16px; color: #ffffff; line-height: 25px; } @media(max-width: 480px) { body #machines #machines-slider .item .txt p { font-size: 12px; line-height: 1.2em; } } body #modelo { background: url("../img/bg-cores.jpg") center center no-repeat #000000; height: 876px; } @media(max-width: 480px) { body #modelo { background-image: url("../img/bg-cores-mobile.jpg"); height: 480px; } } body #modelo .gridD { height: 100%; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -moz-box-orient: vertical; box-orient: vertical; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: column; -moz-flex-direction: column; flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: justify; -moz-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -o-justify-content: space-between; justify-content: space-between; -ms-flex-pack: justify; } body #modelo .title { padding-top: 29px; } body #modelo .title h2 br { display: none; } @media(max-width: 480px) { body #modelo .title h2 br { display: block; } } body #modelo .text-bottom { padding-bottom: 164px; text-align: center; } @media(max-width: 480px) { body #modelo .text-bottom { padding-bottom: 185px; } } body #modelo p { font-size: 18px; color: #ffffff; line-height: 25px; } @media(max-width: 480px) { body #modelo p { font-size: 11px; line-height: 14px; max-width: 227px; margin-right: auto; margin-left: auto; } body #modelo p br { display: none; } } body #aeroccino { background: url("../img/aeroccino.png") center center no-repeat; height: 595px; margin-top: -110px; } @media(max-width: 480px) { body #aeroccino { background-image: url("../img/aeroccino-mobile.png"); background-color: #000000; height: 320px; margin-top: -145px; } } body #aeroccino .gridD { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; height: 100%; } body #aeroccino .txt { max-width: 450px; margin-left: 40px; } @media(max-width: 480px) { body #aeroccino .txt { margin-left: 0; max-width: 254px; margin-right: auto; margin-left: auto; text-align: center; } } body #aeroccino .txt h3 { font-size: 25px; color: #ffffff; line-height: 40px; margin-bottom: 55px; text-transform: uppercase; } @media(max-width: 480px) { body #aeroccino .txt h3 { font-size: 16px; line-height: 20px; text-align: center; margin-bottom: 195px; } body #aeroccino .txt h3 br { display: none; } } body #aeroccino .txt p { font-size: 16px; color: #ffffff; } @media(max-width: 480px) { body #aeroccino .txt p { font-size: 12px; line-height: 15px; } } body #receitas { padding-top: 72px; padding-bottom: 78px; } @media(max-width: 480px) { body #receitas { padding-top: 50px; padding-bottom: 30px; } } body #receitas .title { padding-bottom: 70px; } @media(max-width: 480px) { body #receitas .title { padding-bottom: 50px; } } body #receitas .gridD .tabs { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; max-width: 955px; margin-right: auto; margin-left: auto; height: 40px; } body #receitas .gridD .tabs .tab { height: 100%; width: 50%; border: 1px solid tranparent; border-bottom: 1px solid #000000; color: #000000; height: 100%; width: 100%; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; cursor: pointer; } body #receitas .gridD .tabs .tab:last-child { border-left: none; } body #receitas .gridD .tabs .tab:hover { font-family: "Nespresso-Bold", Arial, sans-serif; border: 1px solid #000000; border-left: none; } body #receitas .gridD .tabs .tab:hover:first-child { border-left: 1px solid #000000; } body #receitas .gridD .tabs .tab.current { border: 1px solid #000000; border-bottom: 1px solid transparent; font-family: "Nespresso-Bold", Arial, sans-serif; } @media(max-width: 480px) { body #receitas .gridD .tabs .tab { font-size: 9px; } } body #receitas .gridD .tab-content { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; margin-right: auto; margin-left: auto; border: 1px solid #000000; border-top: none; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; padding-top: 30px; padding-bottom: 34px; max-width: 953px; display: none; } @media(max-width: 480px) { body #receitas .gridD .tab-content { -webkit-box-orient: vertical; -moz-box-orient: vertical; box-orient: vertical; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: column; -moz-flex-direction: column; flex-direction: column; -ms-flex-direction: column; padding-bottom: 10px; } } body #receitas .gridD .tab-content.current { display: flex !important; } body #receitas .gridD .tab-content .image { height: auto; width: 504px; display: block; } @media(max-width: 510px) { body #receitas .gridD .tab-content .image { width: calc(100% - 20px); margin-right: auto; margin-left: auto; } } body #receitas .gridD .tab-content .image img { display: block; max-width: 100%; } body #receitas .gridD .tab-content .image .infos { height: 53px; width: 100%; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; background: #000000; } body #receitas .gridD .tab-content .image .infos .info { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; } body #receitas .gridD .tab-content .image .infos .info.difficulty { margin-right: 50px; margin-left: 50px; } body #receitas .gridD .tab-content .image .infos .icon { margin-right: 10px; } body #receitas .gridD .tab-content .image .infos p { color: #ffffff; font-family: "Nespresso-Bold", Arial, sans-serif; text-transform: uppercase; font-size: 12.53px; } @media(max-width: 480px) { body #receitas .gridD .tab-content .image .infos p { font-size: 7.36px; } } body #receitas .gridD .tab-content .description { max-width: 352px; margin-left: 39px; } @media(max-width: 480px) { body #receitas .gridD .tab-content .description { width: calc(100% - 20px); margin-right: auto; margin-left: auto; max-width: 100%; margin-top: 14px; } } body #receitas .gridD .tab-content .description h5 { font-size: 17px; font-family: "Nespresso-Bold", Arial, sans-serif; color: #000000; } @media(max-width: 480px) { body #receitas .gridD .tab-content .description h5 { font-size: 12px; } } body #receitas .gridD .tab-content .description ul { margin-bottom: 34px; } @media(max-width: 480px) { body #receitas .gridD .tab-content .description ul { margin-bottom: 20px; } } body #receitas .gridD .tab-content .description ul li { list-style: none; font-size: 17px; color: #000000; font-family: "Nespresso-Regular", Arial, sans-serif; } @media(max-width: 480px) { body #receitas .gridD .tab-content .description ul li { font-size: 12px; } } body #receitas .gridD .descubra { height: 62px; width: 100%; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; border: 1px solid #000000; max-width: 953px; margin-top: 35px; margin-right: auto; margin-left: auto; } @media(max-width: 480px) { body #receitas .gridD .descubra { height: 46px; width: calc(100% - 26px); } } body #receitas .gridD .descubra p { color: #000000; font-size: 17px; text-align: center; } body #receitas .gridD .descubra p br { display: none; } @media(max-width: 480px) { body #receitas .gridD .descubra p { font-size: 12px; } body #receitas .gridD .descubra p br { display: block; } } body #receitas .gridD .descubra p a { text-decoration: underline; color: #000000; } body #informacoes { background: url("../img/bg-informacoes.jpg") center top no-repeat #000000; height: 619px; } @media(max-width: 480px) { body #informacoes { background-image: url("../img/bg-informacoes-mobile.jpg"); height: 364px; } } body #informacoes .title { padding-top: 70px; } body #informacoes .boxes { max-width: 565px; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; margin-top: 61px; margin-right: auto; margin-left: auto; position: relative; left: 12px; } @media(max-width: 480px) { body #informacoes .boxes { max-width: 204px; left: 39px; margin-top: 40px; } } body #informacoes .boxes .btn-show { display: none; } @media(max-width: 480px) { body #informacoes .boxes .btn-show { background: url("../img/icons/btn-show.png") center center no-repeat; height: 25px; width: 25px; display: block; position: absolute; top: 50%; right: -14px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); margin-top: 2px; z-index: 2; } } body #informacoes .boxes .box { height: 140.5px; width: 25%; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -moz-box-orient: vertical; box-orient: vertical; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: column; -moz-flex-direction: column; flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: justify; -moz-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -o-justify-content: space-between; justify-content: space-between; -ms-flex-pack: justify; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; } @media(max-width: 480px) { body #informacoes .boxes .box { height: 88px; width: 50%; } } body #informacoes .boxes .box .icon { height: 42px; width: 42px; margin-right: auto; margin-left: auto; margin-top: 18px; } @media(max-width: 480px) { body #informacoes .boxes .box .icon { background-image: url("../img/icons/sprite-mobile.png"); margin-top: 9px; height: 35px; } } body #informacoes .boxes .box p { font-size: 13.54px; color: #ffffff; text-align: center; margin-bottom: 14px; } @media(max-width: 480px) { body #informacoes .boxes .box p { font-size: 8.59px; line-height: 1.2em; } } @media(max-width: 480px) { body #informacoes .boxes .box.box1 { display: none; } } body #informacoes .boxes .box.box1 .icon { background-position: -3px -40px; } @media(max-width: 480px) { body #informacoes .boxes .box.box1 .icon { background-position: -112px -86px; width: 23px; } } @media(max-width: 480px) { body #informacoes .boxes .box.box2 { display: none; } } body #informacoes .boxes .box.box2 .icon { background-position: -52px -41px; } @media(max-width: 480px) { body #informacoes .boxes .box.box2 .icon { background-position: -140px -84px; width: 27px; } } body #informacoes .boxes .box.box3 .icon { background-position: -106px -41px; } @media(max-width: 480px) { body #informacoes .boxes .box.box3 .icon { background-position: -115px -5px; width: 17px; } } body #informacoes .boxes .box.box3 p { margin-bottom: 25px; } body #informacoes .boxes .box.box4 .icon { background-position: -155px -45px; } @media(max-width: 480px) { body #informacoes .boxes .box.box4 .icon { background-position: -141px -5px; width: 24px; } } @media(max-width: 480px) { body #informacoes .boxes .box.box5 { display: none; } } body #informacoes .boxes .box.box5 .icon { background-position: -4px -101px; } @media(max-width: 480px) { body #informacoes .boxes .box.box5 .icon { background-position: -119px -123px; width: 9px; } } @media(max-width: 480px) { body #informacoes .boxes .box.box6 { display: none; } } body #informacoes .boxes .box.box6 .icon { background-position: -53px -99px; } @media(max-width: 480px) { body #informacoes .boxes .box.box6 .icon { background-position: -142px -127px; width: 24px; } } body #informacoes .boxes .box.box7 .icon { background-position: -108px -100px; } @media(max-width: 480px) { body #informacoes .boxes .box.box7 .icon { background-position: -117px -40px; width: 13px; } } body #informacoes .boxes .box.box8 .icon { background-position: -156px -101px; } @media(max-width: 480px) { body #informacoes .boxes .box.box8 .icon { background-position: -142px -42px; width: 23px; } } body #informacoes .boxes .box.box8 p { margin-bottom: 25px; } body #informacoes .boxes:hover .box { opacity: 0.5; } body #informacoes .boxes:hover .box:hover { opacity: 1; } @media(max-width: 480px) { body #informacoes .boxes:hover .box { opacity: 1; } } body #capsules { padding-top: 75px; padding-bottom: 65px; } body #capsules .title h2 { padding-bottom: 44px; } @media(max-width: 480px) { body #capsules .title h2 { max-width: 170px; margin-right: auto; margin-left: auto; padding-bottom: 35px; } body #capsules .title h2 br { display: none; } } body #capsules .title p { padding-bottom: 55px; } @media(max-width: 480px) { body #capsules .title p { padding-bottom: 30px; max-width: 285px; margin-right: auto; margin-left: auto; } body #capsules .title p br { display: none; } } body #capsules p { text-align: center; } @media(max-width: 480px) { body #capsules p { max-width: 286px; margin-right: auto; margin-left: auto; } } body #capsules .prices { height: 67px; width: 820px; border: 1px solid #000000; position: relative; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; margin-right: auto; margin-left: auto; } @media(max-width: 480px) { body #capsules .prices { height: 47px; width: calc(100% - 26px); } } body #capsules .prices::before { content: ""; display: block; height: 47px; width: 66px; background: url("../img/icons/capsules.png") center center no-repeat #ffffff; position: absolute; top: -23.5px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } @media(max-width: 480px) { body #capsules .prices::before { height: 24px; width: 34px; background-size: 100% auto; top: -17.5px; } } body #capsules .prices br { display: none; } @media(max-width: 480px) { body #capsules .prices br { display: block; } } body #capsules .beneficios { max-width: 820px; margin-right: auto; margin-left: auto; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; margin-top: 50px; } @media(max-width: 480px) { body #capsules .beneficios { max-width: calc(100% - 46px); } } body #capsules .beneficios .title { border-top-left-radius: 20px; border-top-right-radius: 20px; border: 1px solid #569b94; background: #569b94; height: 57px; padding-top: 0; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; position: relative; cursor: pointer; } body #capsules .beneficios .title::before { content: ""; display: block; height: 32px; width: 57px; background: url("../img/icons/sprite-icons.png") 0 -158px; margin-left: 21px; } @media(max-width: 480px) { body #capsules .beneficios .title::before { margin-left: 18px; } } body #capsules .beneficios .title::after { content: ""; display: block; height: 10px; width: 18px; background: url("../img/icons/sprite-icons.png") -77px -169px; position: absolute; top: 50%; right: 25px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } body #capsules .beneficios .title.closed { border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; } body #capsules .beneficios .title.closed::after { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); margin-top: -5px; } body #capsules .beneficios .title h4 { font-size: 18.28px; color: #ffffff; text-transform: uppercase; padding-left: 15px; } body #capsules .beneficios .title h4 br { display: none; } @media(max-width: 480px) { body #capsules .beneficios .title h4 { font-size: 12px; line-height: 16px; padding-left: 10px; } body #capsules .beneficios .title h4 br { display: block; } } body #capsules .beneficios .content { border: 1px solid #569b94; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; padding: 37px 28px; } body #capsules .beneficios .content p { text-align: left; } body #capsules .circle { position: relative; height: 689px; width: 1008px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin-top: 65px; margin-bottom: 65px; } @media(max-width: 480px) { body #capsules .circle { height: 407px; width: 320px; margin-right: auto; margin-left: auto; } } body #capsules .circle img.mobile { display: none; } @media(max-width: 480px) { body #capsules .circle img.desktop { display: none; } body #capsules .circle img.mobile { display: block; max-width: 100%; } } body #capsules .circle .links .link { position: absolute; top: 0; left: 0; cursor: pointer; z-index: 2; } body #capsules .circle .links .link.link1 { height: 180px; width: 240px; top: 95px; left: 175px; } @media(max-width: 480px) { body #capsules .circle .links .link.link1 { height: 110px; width: 110px; top: 0; left: 0; } } body #capsules .circle .links .link.link2 { height: 150px; width: 180px; top: 10px; left: 420px; } @media(max-width: 480px) { body #capsules .circle .links .link.link2 { height: 85px; width: 110px; top: 0; left: 110px; } } body #capsules .circle .links .link.link3 { height: 300px; width: 300px; top: 125px; left: 605px; } @media(max-width: 480px) { body #capsules .circle .links .link.link3 { height: 180px; width: 85px; top: 17px; left: 220px; } } body #capsules .circle .links .link.link4 { height: 180px; width: 240px; top: 425px; left: 525px; } @media(max-width: 480px) { body #capsules .circle .links .link.link4 { height: 92px; width: 119px; top: 196px; left: 174px; } } body #capsules .circle .links .link.link5 { height: 180px; width: 215px; top: 465px; left: 305px; } @media(max-width: 480px) { body #capsules .circle .links .link.link5 { height: 80px; width: 132px; top: 220px; left: 40px; } } body #capsules .circle .links .link.link6 { height: 190px; width: 240px; top: 275px; left: 75px; } @media(max-width: 480px) { body #capsules .circle .links .link.link6 { height: 115px; width: 75px; top: 108px; left: 10px; } } body #capsules .circle .bgs { height: 100%; width: 100%; position: absolute; top: 0; left: 0; } body #capsules .circle .bgs .bg { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 1; opacity: 0; } @media(max-width: 480px) { body #capsules .circle .bgs .bg { background-size: 100% auto !important; } } body #capsules .circle .bgs .bg.current { opacity: 1; } body #capsules .circle .bgs .bg.bg1 { background: url("../img/circle/bg1.png") center center no-repeat; } @media(max-width: 480px) { body #capsules .circle .bgs .bg.bg1 { background-image: url("../img/circle/mobile/bg1.png"); } } body #capsules .circle .bgs .bg.bg2 { background: url("../img/circle/bg2.png") center center no-repeat; } @media(max-width: 480px) { body #capsules .circle .bgs .bg.bg2 { background-image: url("../img/circle/mobile/bg2.png"); } } body #capsules .circle .bgs .bg.bg3 { background: url("../img/circle/bg3.png") center center no-repeat; } @media(max-width: 480px) { body #capsules .circle .bgs .bg.bg3 { background-image: url("../img/circle/mobile/bg3.png"); } } body #capsules .circle .bgs .bg.bg4 { background: url("../img/circle/bg4.png") center center no-repeat; } @media(max-width: 480px) { body #capsules .circle .bgs .bg.bg4 { background-image: url("../img/circle/mobile/bg4.png"); } } body #capsules .circle .bgs .bg.bg5 { background: url("../img/circle/bg5.png") center center no-repeat; } @media(max-width: 480px) { body #capsules .circle .bgs .bg.bg5 { background-image: url("../img/circle/mobile/bg5.png"); } } body #capsules .circle .bgs .bg.bg6 { background: url("../img/circle/bg6.png") center center no-repeat; } @media(max-width: 480px) { body #capsules .circle .bgs .bg.bg6 { background-image: url("../img/circle/mobile/bg6.png"); } } body #onde-comprar { background: url("../img/bg-onde-comprar.jpg") center top no-repeat #000000; padding-top: 215px; padding-bottom: 80px; } @media(max-width: 480px) { body #onde-comprar { padding-bottom: 0; } } body #onde-comprar .title { padding-bottom: 65px; } @media(max-width: 480px) { body #onde-comprar .title { padding-bottom: 40px; } } body #onde-comprar .title h2 { font-size: 20px; color: #c2a572; line-height: 35px; } @media(max-width: 480px) { body #onde-comprar .title h2 { max-width: 220px; margin-right: auto; margin-left: auto; font-size: 16px; line-height: 20px; } body #onde-comprar .title h2 br { display: none; } } body #onde-comprar .columns { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; } @media(max-width: 480px) { body #onde-comprar .columns { -webkit-box-lines: multiple; -moz-box-lines: multiple; box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } body #onde-comprar .columns .column { width: 25%; } @media(max-width: 480px) { body #onde-comprar .columns .column { width: 50%; margin-bottom: 45px; } } body #onde-comprar .columns .column .icon { height: 50px; width: 49px; margin-right: auto; margin-left: auto; } body #onde-comprar .columns .column .icon.icon1 { background-position: -127px -149px; } body #onde-comprar .columns .column .icon.icon2 { background-position: -186px -150px; width: 29px; } body #onde-comprar .columns .column .icon.icon3 { background-position: -228px -149px; } body #onde-comprar .columns .column .icon.icon4 { background-position: -285px -148px; width: 30px; } body #onde-comprar .columns h4 { font-size: 17.33px; color: #c2a572; text-transform: uppercase; text-align: center; margin-top: 30px; } @media(max-width: 480px) { body #onde-comprar .columns h4 { font-size: 10.79px; line-height: 14.56px; margin-top: 18px; } } body #onde-comprar .columns h4 a { color: inherit; text-decoration: underline; } body #onde-comprar .columns h4::after { content: ""; display: block; height: 2px; width: 49px; margin: 18px auto 20px; background: #ffffff; } @media(max-width: 480px) { body #onde-comprar .columns h4::after { margin: 11px auto 10px; } } body #onde-comprar .columns p { color: #ffffff; font-size: 13.86px; text-align: center; line-height: 23px; } @media(max-width: 480px) { body #onde-comprar .columns p { font-size: 12px; line-height: 14.56px; } } body #onde-comprar .columns p a { color: inherit; text-decoration: underline; } body #clube-nespresso { background: url("../img/bg-club.jpg") center top no-repeat #000000; padding-top: 68px; padding-bottom: 65px; } @media(max-width: 480px) { body #clube-nespresso { background-image: url("../img/bg-club-mobile.jpg"); } } body #clube-nespresso .title { max-width: 667px; margin-left: auto; padding-bottom: 80px; } @media(max-width: 480px) { body #clube-nespresso .title { max-width: 320px; margin-right: auto; margin-left: auto; } } body #clube-nespresso .title h2 { color: #c2a572; text-align: left; padding-bottom: 30px; } @media(max-width: 480px) { body #clube-nespresso .title h2 { max-width: 210px; margin-right: auto; margin-left: auto; text-align: center; } body #clube-nespresso .title h2 br { display: none; } } body #clube-nespresso .title p { color: #ffffff; font-size: 18px; text-align: left; text-transform: none; } @media(max-width: 480px) { body #clube-nespresso .title p { font-size: 12.08px; max-width: 150px; margin-right: 15px; margin-left: auto; } } body #clube-nespresso .title p a { text-decoration: underline; color: #ffffff; } body #clube-nespresso .boxes { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -moz-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -o-justify-content: space-between; justify-content: space-between; -ms-flex-pack: justify; max-width: 836px; margin-right: auto; margin-left: auto; } @media(max-width: 480px) { body #clube-nespresso .boxes { -webkit-box-lines: multiple; -moz-box-lines: multiple; box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 296px; } } body #clube-nespresso .boxes .box { height: 270px; width: 261px; background: url("../img/border-box.png") center center no-repeat; margin-bottom: 28px; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; box-pack: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -o-justify-content: center; justify-content: center; -ms-flex-pack: center; -webkit-box-align: center; -moz-box-align: center; box-align: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -o-align-items: center; align-items: center; -ms-flex-align: center; -webkit-box-orient: vertical; -moz-box-orient: vertical; box-orient: vertical; -webkit-box-direction: normal; -moz-box-direction: normal; box-direction: normal; -webkit-flex-direction: column; -moz-flex-direction: column; flex-direction: column; -ms-flex-direction: column; text-align: center; } @media(max-width: 480px) { body #clube-nespresso .boxes .box { background-image: url("../img/border-box-mobile.png"); height: 149px; width: 140px; -webkit-box-pack: start; -moz-box-pack: start; box-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; -o-justify-content: flex-start; justify-content: flex-start; -ms-flex-pack: start; padding-top: 22px; margin-bottom: 15px; } } body #clube-nespresso .boxes .box .icon { height: 79px; width: 79px; margin-right: auto; margin-bottom: 25px; margin-left: auto; } @media(max-width: 480px) { body #clube-nespresso .boxes .box .icon { height: 42px; width: 42px; background-image: url("../img/icons/sprite-mobile.png"); margin-bottom: 15px; } } body #clube-nespresso .boxes .box.box1 .icon { background-position: -10px -220px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box.box1 .icon { background-position: 0 0; width: 42px; } } body #clube-nespresso .boxes .box.box2 .icon { background-position: -114px -225px; width: 91px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box.box2 .icon { background-position: -51px -8px; height: 26px; width: 49px; } } body #clube-nespresso .boxes .box.box3 .icon { background-position: -230px -230px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box.box3 .icon { background-position: -5px -58px; height: 29px; width: 33px; } } body #clube-nespresso .boxes .box.box4 .icon { background-position: -12px -335px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box.box4 .icon { background-position: -62px -59px; height: 28px; width: 28px; } } body #clube-nespresso .boxes .box.box5 .icon { background-position: -121px -335px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box.box5 .icon { background-position: -2px -100px; height: 28px; width: 38px; } } body #clube-nespresso .boxes .box.box6 .icon { background-position: -233px -340px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box.box6 .icon { background-position: -63px -96px; height: 35px; width: 26px; } } body #clube-nespresso .boxes .box h5 { font-family: "Nespresso-Bold", Arial, sans-serif; font-size: 17.38px; text-transform: uppercase; color: #ffffff; } @media(max-width: 480px) { body #clube-nespresso .boxes .box h5 { font-size: 10.77px; } } body #clube-nespresso .boxes .box p { color: #ffffff; font-size: 14.48px; line-height: 24px; padding-right: 21px; padding-left: 21px; } @media(max-width: 480px) { body #clube-nespresso .boxes .box p { font-size: 9.79px; line-height: 12.93px; padding-right: 4px; padding-left: 4px; } body #clube-nespresso .boxes .box p br { display: none; } } body #clube-nespresso .boxes:hover .box { opacity: 0.5; } body #clube-nespresso .boxes:hover .box:hover { opacity: 1; } body footer { height: 32px; background: #000000; } @media(max-width: 480px) { body footer { background: #252525; } } body footer img { display: block; margin-right: auto; margin-left: auto; position: relative; top: -45px; } body footer img.mobile { display: none; } @media(max-width: 480px) { body footer img { top: -19px; } body footer img.mobile { display: block; } body footer img.desktop { display: none; } } /*# sourceMappingURL=style.css.map */