@font-face { font-family: "NespressoLucas-ExtraBold"; font-style: normal; font-weight: normal; src: url("../fonts/NespressoLucas-XtraBd.eot?#iefix") format("embedded-opentype"), url("../fonts/NespressoLucas-XtraBd.woff2") format("woff2"), url("../fonts/NespressoLucas-XtraBd.woff") format("woff"), url("../fonts/NespressoLucas-XtraBd.ttf") format("truetype"), url("../fonts/NespressoLucas-XtraBd.svg#NespressoLucas-ExtraBold") format("svg"); } @font-face { font-family: "NespressoLucas-Bold"; font-style: normal; font-weight: normal; src: url("../fonts/NespressoLucas-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/NespressoLucas-Bold.woff2") format("woff2"), url("../fonts/NespressoLucas-Bold.woff") format("woff"), url("../fonts/NespressoLucas-Bold.ttf") format("truetype"), url("../fonts/NespressoLucas-Bold.svg#NespressoLucas-Bold") format("svg"); } @font-face { font-family: "NespressoLucas-Regular"; font-style: normal; font-weight: normal; src: url("../fonts/NespressoLucas-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/NespressoLucas-Regular.woff2") format("woff2"), url("../fonts/NespressoLucas-Regular.woff") format("woff"), url("../fonts/NespressoLucas-Regular.ttf") format("truetype"), url("../fonts/NespressoLucas-Regular.svg#NespressoLucas-Regular") format("svg"); } @font-face { font-family: "NespressoLucas-Light"; font-style: normal; font-weight: normal; src: url("../fonts/NespressoLucas-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/NespressoLucas-Light.woff2") format("woff2"), url("../fonts/NespressoLucas-Light.woff") format("woff"), url("../fonts/NespressoLucas-Light.ttf") format("truetype"), url("../fonts/NespressoLucas-Light.svg#NespressoLucas-Light") format("svg"); } body { font-family: "NespressoLucas-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: "NespressoLucas-Bold", Arial, sans-serif; } #loader, #loader .left-top, #loader .left-bottom, #loader .right-top, #loader .right-bottom, 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; } body #sustentabilidade .items::after { content: "."; display: block; clear: both; height: 0; line-height: 0; font-size: 0; visibility: hidden; overflow: hidden; } .gridE { width: 90%; } .gridD { max-width: 1000px; } .gridF { width: 996px; } #loader { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; 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; -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: #ffffff; } #loader .left-top { position: absolute; top: 50%; right: 50%; bottom: 0; left: 0; background: url("../img/loader/left-top.jpg") center center no-repeat; opacity: 0.5; } #loader .left-bottom { position: absolute; top: 0; right: 50%; bottom: 50%; left: 0; background: url("../img/loader/left-bottom.jpg") center center no-repeat; opacity: 0.5; } #loader .right-top { position: absolute; top: 50%; right: 0; bottom: 0; left: 50%; background: url("../img/loader/right-top.jpg") center center no-repeat; opacity: 0.5; } #loader .right-bottom { position: absolute; top: 0; right: 0; bottom: 50%; left: 50%; background: url("../img/loader/right-bottom.jpg") center center no-repeat; opacity: 0.5; } #loader .logo { position: relative; z-index: 2; -webkit-transition: 0.2s all linear; -moz-transition: 0.2s all linear; transition: 0.2s all linear; -webkit-animation: fadeInOut 1s infinite; -moz-animation: fadeInOut 1s infinite; animation: fadeInOut 1s infinite; } #loader.active { z-index: -2; } #loader.active .left-top { top: 100%; right: 100%; } #loader.active .left-bottom { bottom: 100%; right: 100%; } #loader.active .right-top { left: 100%; top: 100%; } #loader.active .right-bottom { left: 100%; bottom: 100%; } #loader.active .logo { opacity: 0; -webkit-animation: none; -moz-animation: none; animation: none; } @-webkit-keyframes fadeInOut { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeInOut { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeInOut { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } .title h2 { font-size: 26px; letter-spacing: 2px; 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 #banner-promo { position: relative; height: 313px; 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: 695px; background: url("../img/banner.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: #000000; 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 #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/caracteristicas/maquina01.png"); } body #machines #machines-slider .item.item2 { background-image: url("../img/caracteristicas/maquina02.png"); } body #machines #machines-slider .item.item3 { background-image: url("../img/caracteristicas/maquina03.png"); } body #machines #machines-slider .item.item4 { background-image: url("../img/caracteristicas/maquina04.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: "NespressoLucas-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: 70px; } 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/bg-aeroccino.jpg") center center no-repeat; padding-top: 75px; height: 940px; } body #aeroccino .title { margin-bottom: 20px; } body #aeroccino p { font-size: 20px; text-align: center; } body #aeroccino h3 { font-size: 14.66px; color: #ffffff; text-transform: uppercase; letter-spacing: 2.5px; background: url("../img/aeroccino/bg-title.png") left center no-repeat; padding-left: 33px; padding-top: 4px; padding-bottom: 5px; padding-left: 33px; width: 100%; } body #aeroccino .infos { 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; max-width: 450px; margin-left: 148px; margin-top: 112px; } body #aeroccino .info { margin-right: 15px; margin-left: 15px; 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-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-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; height: 138px; } body #aeroccino .info.first { margin-left: 24px; } body #aeroccino .info.thirty { margin-left: 24px; } body #aeroccino .info img { display: block; margin-right: auto; margin-bottom: 5px; margin-left: auto; } body #aeroccino .info p { font-size: 14.66px; color: #ffffff; } body #boxes { padding-top: 72px; height: calc(660px - 72px); background: url("../img/boxes/bg-boxes.jpg") center center no-repeat; } body #boxes .txt { max-width: 630px; margin-right: 20px; margin-left: auto; } body #boxes .images { margin-top: 25px; margin-bottom: 15px; display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -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 #boxes .title { margin-bottom: 10px; } body #boxes .title h2 { text-align: left; } body #boxes p { font-size: 20px; } body #solucoes { background: #000000; padding-top: 50px; padding-bottom: 30px; } body #solucoes p, body #solucoes ul, body #solucoes li { font-size: 16px; color: #ffffff; text-align: center; display: block; margin-bottom: 15px; } body #solucoes .title { margin-bottom: 50px; } body #solucoes .columns { display: -webkit-box; display: -moz-box; display: box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -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 #solucoes .columns .column { height: 795px; width: 49%; background: rgba(255, 255, 255, 0.1); 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-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-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; } 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: "NespressoLucas-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: "NespressoLucas-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: "NespressoLucas-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: "NespressoLucas-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: "NespressoLucas-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 #table { padding-top: 70px; padding-bottom: 90px; background: url("../img/tabela/overlay.png") center top no-repeat #000000; } @media(max-width: 480px) { body #table { padding-top: 50px; } } body #table .table-mobile { display: none; } body #table .title { text-transform: uppercase; color: #ffffff; text-align: center; display: block; padding-bottom: 70px; z-index: 1; } @media(max-width: 480px) { body #table .title { font-size: 15px; max-width: 220px; margin-right: auto; margin-left: auto; padding-bottom: 50px; } } body #table .table-desktop { padding-top: 20px; background: #ffffff; } @media(max-width: 480px) { body #table .table-desktop { display: none; } } body #table .table-desktop table { width: 100%; border-collapse: collapse; text-align: center; } body #table .table-desktop table tr { height: 100%; } body #table .table-desktop table tr td { font-size: 11px; height: 100px; } body #table .table-desktop table tr td strong { text-transform: uppercase; } body #table .table-desktop table tr td:first-child { width: 180px; } body #table .table-desktop table tr:nth-child(odd) { background: #F8F8F8; } body #table .table-desktop table tr img { max-width: 110px; } body #table .table-mobile { display: none; } @media(max-width: 480px) { body #table .table-mobile { display: block; } } body #table .table-mobile .slick-list { height: 840px; } body #table .table-mobile .slick-table .slick-dots li { width: 10px; height: 10px; line-height: 10px; cursor: pointer; } body #table .table-mobile .slick-table .slick-dots li button { text-indent: -999px; width: 100%; height: 100%; padding: 0; border: 1px solid #fff; background: #000; border-radius: 100%; cursor: pointer; } body #table .table-mobile .slick-dots li button::before { content: none; } body #table .table-mobile .slick-table .slick-dots li.slick-active button { background: #fff; } body #table .table-mobile .machine { margin: 0 10px; width: 260px; top: 20px; transition: 0.4s all linear; position: relative; } body #table .table-mobile .machine h3 { font-family: "nespressoExtBol", Arial, Sans-serif; font-size: 12px; color: #000; text-transform: uppercase; margin-top: -10px; padding-bottom: 20px; text-align: center; } body #table .table-mobile .machine.slick-active { top: 0; } body #table .table-mobile .machine.slick-active .gridI { padding: 20px 0; } body #table .table-mobile .machine .gridI { transition: 0.4s all linear; border-radius: 10px; background: #fff; margin-left: auto; margin-right: auto; } body #table .table-mobile .machine .items .item { height: 80px; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 12px; } body #table .table-mobile .machine .items .item img { display: inline-block; margin-top: 5px; width: 18px; } body #table .table-mobile .machine .items .item span { padding-top: 5px; display: block; } body #table .table-mobile .machine .items .item .line { display: block; width: 18px; height: 1px; background: #000; margin: 15px auto; } body #table .table-mobile .machine .items .item .left, body #table .table-mobile .machine .items .item .right { float: left; width: 50%; } body #table .table-mobile .machine .items .item::after { content: ""; display: table; width: 0; height: 0; clear: both; } body #table .table-mobile .machine .items .item:nth-child(odd) { background: #F8F8F8; } 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 #sustentabilidade { padding-top: 70px; padding-bottom: 140px; background: url("../img/sustentabilidade/bg.jpg") center bottom no-repeat #000; } @media(max-width: 480px) { body #sustentabilidade { padding-top: 50px; padding-bottom: 180px; background-position: -890px bottom; } } body #sustentabilidade .title { text-transform: uppercase; text-align: center; padding-bottom: 84px; color: #c2a572; } @media(max-width: 480px) { body #sustentabilidade .title { font-size: 15px; padding-bottom: 50px; } } body #sustentabilidade .items { display: block; margin: 0 auto; max-width: 780px; padding-bottom: 130px; } body #sustentabilidade .items .item { float: left; width: calc(33.33% - 30px); padding: 0 15px; } @media(max-width: 480px) { body #sustentabilidade .items .item { padding: 0; width: 225px; margin: 15px auto 30px; float: none; } } body #sustentabilidade .items .item .image { display: block; width: 223px; height: 223px; border: 4px solid white; background-position: center center; background-repeat: no-repeat; margin: 0 auto 25px; border-radius: 50%; } body #sustentabilidade .items .item.item1 .image { background-image: url("../img/sustentabilidade/img1.jpg"); } body #sustentabilidade .items .item.item2 .image { background-image: url("../img/sustentabilidade/img2.jpg"); } body #sustentabilidade .items .item.item3 .image { background-image: url("../img/sustentabilidade/img3.jpg"); } body #sustentabilidade .items .item p { font-size: 12px; color: #fff; } body #sustentabilidade .conheca { max-width: 780px; margin: 0 auto; } body #sustentabilidade .conheca p { font-size: 16px; color: #c2a572; } @media(max-width: 480px) { body #sustentabilidade .conheca p { max-width: 250px; padding-left: 30px; font-size: 13px; } } @media(max-width: 480px) { body #sustentabilidade .conheca p br { display: none; } } body #sustentabilidade .conheca a { font-size: 16px; color: #c2a572; text-decoration: underline; } @media(max-width: 480px) { body #sustentabilidade .conheca a { font-size: 13px; } } 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: "NespressoLucas-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 */