/*------------------------------------*\ #SETTINGS \*------------------------------------*/ /*------------------------------------*\ #MIXINS \*------------------------------------*/ @import url("https://fonts.googleapis.com/css?family=Zilla+Slab:300,500,500i"); @import url("https://fonts.googleapis.com/css?family=Montserrat:700,900"); @font-face { font-family: testament; src: url("/Paginas/osteoporose/assets/fonts/testament.eot"); src: url("/Paginas/osteoporose/assets/fonts/testament.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/testament.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/testament.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/testament.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/testament.svg#testament") format("svg"); font-weight: 400; font-style: bold; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: testament; src: url("/Paginas/osteoporose/assets/fonts/testament.svg#testament") format("svg"); } } @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-r.eot"); src: url("/Paginas/osteoporose/assets/fonts/roboto-r.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/roboto-r.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/roboto-r.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/roboto-r.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/roboto-r.svg#roboto-r") format("svg"); font-weight: 200; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-r.svg#roboto-r") format("svg"); } } @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-l.eot"); src: url("/Paginas/osteoporose/assets/fonts/roboto-l.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/roboto-l.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/roboto-l.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/roboto-l.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/roboto-l.svg#roboto-r") format("svg"); font-weight: 200; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-l.svg#roboto-r") format("svg"); } } @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-b.eot"); src: url("/Paginas/osteoporose/assets/fonts/roboto-b.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/roboto-b.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/roboto-b.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/roboto-b.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/roboto-b.svg#roboto-r") format("svg"); font-weight: 400; font-style: bold; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-b.svg#roboto-r") format("svg"); } } @font-face { font-family: laCompa; src: url("/Paginas/osteoporose/assets/fonts/laCompa.eot"); src: url("/Paginas/osteoporose/assets/fonts/laCompa.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/laCompa.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/laCompa.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/laCompa.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/laCompa.svg#laCompa") format("svg"); font-weight: 200; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: laCompa; src: url("/Paginas/osteoporose/assets/fonts/laCompa.svg#laCompa") format("svg"); } } /*------------------------------------*\ #VENDOR \*------------------------------------*/ /*------------------------------------*\ #Default Theme Settings \*------------------------------------*/ body { -webkit-overflow-scrolling: touch; } .topbar { background-color: #005599; height: 67px; position: fixed; width: 100%; z-index: 10; } .topbar a { text-decoration: none; } .topbar .-flex { display: flex; justify-content: center; align-items: center; } .topbar #logo-mobile { display: none; } @media screen and (max-width: 63.9375em) { .topbar #logo-mobile { display: block; } .topbar #logo-desktop { display: none; } } .menu-mobile { display: none; } .footer { background-color: #1c1b1b; } footer { width: 100%; display: inline-block; font-size: 2vw; font-family: FuturaRegular; font-weight: 200; padding: 5em 0px; } @media screen and (min-width: 64em) { footer { padding: 1.1em 0px; } } footer .-flex { flex-wrap: nowrap; justify-content: center; } @media screen and (max-width: 63.9375em) { footer .-flex { flex-direction: column; } } footer .info { width: 100%; } @media screen and (max-width: 63.9375em) { footer .info { order: 2; } } @media screen and (min-width: 64em) { footer .info { width: 35%; max-width: 786px; } } footer .links { width: 65%; } @media screen and (max-width: 63.9375em) { footer .links { order: 1; width: 100%; } } @media screen and (min-width: 64em) { footer .links { max-width: 798px; } } footer .menu-wrapper { display: block; } @media screen and (max-width: 39.9375em) { footer .site-link { width: 50%; } } @media screen and (min-width: 64em) { footer .site-link { width: 18%; } } footer .assinatura { float: left; clear: both; } footer .menu { font-size: 1vw; color: white; align-items: center; justify-content: center; display: flex; } @media screen and (max-width: 63.9375em) { footer .menu { display: none; } } @media screen and (min-width: 90em) { footer .menu { font-size: 22px; } } footer .menu li { cursor: pointer; margin: 0px 0.5em; } @media screen and (min-width: 64em) { footer .menu li { margin: 0px 1em; } } footer .menu .sub-button { display: none; } @media screen and (max-width: 63.9375em) { footer .button-link { display: none; } } footer a { color: white; text-transform: uppercase; font-family: bebas; font-weight: 400; text-decoration: none; font-size: 1.2em; } * { box-sizing: border-box; } @media screen and (max-width: 63.9375em) { html { -webkit-overflow-scrolling: touch; } } html, body { height: 100%; float: left; width: 100%; margin: 0px; padding: 0px; } html { background-color: #f4f4f4; } body { text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; font-family: source-r; font-weight: 200; height: 100%; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out"; -webkit-transition-delay: 9999s; } .container { width: 88%; margin: 0 auto; max-width: 1520px; height: 100%; position: relative; } @media screen and (min-width: 64em) { .container { width: 93%; } } .container.-flex { display: flex; flex-wrap: wrap; } .container.-flex.-center { justify-content: center; align-items: center; } .container.-flex.-space { justify-content: space-between; } .container.-flex.-end { justify-content: center; } @media screen and (min-width: 64em) { .container.-flex.-end { justify-content: flex-end; } } ul { list-style-type: none; margin: 0px; padding: 0px; } a { outline: none; cursor: pointer; } figure { margin: 0; } img { display: block; max-width: 100%; } .button-link { text-decoration: none; font-family: bebas; font-weight: 400; text-transform: uppercase; display: inline-block; padding: 0.8em 1.2em 0.6em; font-size: 20px; transition: all 0.4s; cursor: pointer; } @media screen and (min-width: 87.5em) { .button-link { font-size: 28px; } } .button-link:hover { box-shadow: 850px 0 0 0 rgba(0, 0, 0, 0.3) inset; } .button-link.-branco-verde { background-color: white; color: #507736; } .button-link.-branco-verde:hover { box-shadow: 650px 0 0 0 rgba(80, 119, 54, 0.3) inset; } .button-link.-verde-branco { background-color: #507736; color: white; } .button-link.-marrom-branco { background-color: #be9144; color: white; } .button-link.-gold-branco { background-color: #ecb744; color: white; } .input-field { font-family: source-r; font-weight: 200; border-radius: 0px; box-shadow: none; outline: none; padding: 1.3em 1em 0.95em; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 20px; } .input-field.-select { background-image: url("/Paginas/osteoporose/assets/images/select_triangle.png"); background-position: center right 25px; background-repeat: no-repeat; } .input-field.-gold-cinza { border: 1px solid #ecb744; color: #666; } .input-field.-gold-cinza ::-webkit-input-placeholder { color: #666; } .input-field.-gold-cinza :-moz-placeholder { color: #666; } .input-field.-gold-cinza ::-moz-placeholder { color: #666; } .input-field.-gold-cinza :-ms-input-placeholder { color: #666; } .wpcf7-not-valid-tip { display: none !important; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* ====== Zoom effect ====== */ .mfp-zoom-in, .mfp-wrap { /* start state */ /* animate in */ /* animate out */ } .mfp-zoom-in .mfp-with-anim, .mfp-zoom-in .mfp-iframe-scaler, .mfp-zoom-in .mfp-inline-holder, .mfp-wrap .mfp-with-anim, .mfp-wrap .mfp-iframe-scaler, .mfp-wrap .mfp-inline-holder { opacity: 0; transition: all 0.2s ease-in-out; transform: scale(0.8); } .mfp-zoom-in.mfp-bg, .mfp-wrap.mfp-bg { opacity: 0; transition: all 0.3s ease-out; } .mfp-zoom-in.mfp-ready .mfp-with-anim, .mfp-zoom-in.mfp-ready .mfp-iframe-scaler, .mfp-zoom-in.mfp-ready .mfp-inline-holder, .mfp-wrap.mfp-ready .mfp-with-anim, .mfp-wrap.mfp-ready .mfp-iframe-scaler, .mfp-wrap.mfp-ready .mfp-inline-holder { opacity: 1; transform: scale(1); } .mfp-zoom-in.mfp-ready.mfp-bg, .mfp-wrap.mfp-ready.mfp-bg { opacity: 0.8; } .mfp-zoom-in.mfp-removing .mfp-with-anim, .mfp-zoom-in.mfp-removing .mfp-iframe-scaler, .mfp-zoom-in.mfp-removing .mfp-inline-holder, .mfp-wrap.mfp-removing .mfp-with-anim, .mfp-wrap.mfp-removing .mfp-iframe-scaler, .mfp-wrap.mfp-removing .mfp-inline-holder { transform: scale(0.8); opacity: 0; } .mfp-zoom-in.mfp-removing.mfp-bg, .mfp-wrap.mfp-removing.mfp-bg { opacity: 0; } .mfp-content { max-width: 500px; } .mfp-content .close-magnific { margin-top: 10px; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; filter: alpha(opacity=80); } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; border: 0; -webkit-appearance: none; display: block; outline: none; z-index: 1046; -webkit-box-shadow: none; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { background-image: url(/Paginas/osteoporose/assets/images/button_close.png); background-position: right center; background-repeat: no-repeat; background-color: transparent; height: 50px; width: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; filter: alpha(opacity=65); padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 18px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 60px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; filter: alpha(opacity=65); margin: 0; padding: 0; font-size: 30px; color: white; text-transform: uppercase; background-color: transparent; font-family: testament; border: 2px solid white !important; padding: 0.5em 1em; height: 61px; border-radius: 50px; -webkit-tap-highlight-color: transparent; bottom: 0px; } @media screen and (min-width: 1024px) { .mfp-arrow { bottom: 50%; margin-bottom: -290px; } } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0%; } @media screen and (min-width: 1024px) { .mfp-arrow-left { left: 50%; margin-left: -350px; } } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0%; } @media screen and (min-width: 1024px) { .mfp-arrow-right { right: 50%; margin-right: -350px; } } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 700px; height: 400px; } .mfp-iframe-holder .mfp-close { top: -50px; } .mfp-iframe-scaler { width: 100%; overflow: hidden; height: 100%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .mfp-ie7 .mfp-img { padding: 0; } .mfp-ie7 .mfp-bottom-bar { width: 600px; left: 50%; margin-left: -300px; margin-top: 5px; padding-bottom: 5px; } .mfp-ie7 .mfp-container { padding: 0; } .mfp-ie7 .mfp-content { padding-top: 44px; } .mfp-ie7 .mfp-close { top: 0; right: 0; padding-top: 0; } .noscroll { overflow: hidden !important; } button.mfp-close { position: fixed; } img { height: auto; } img.zoom { cursor: zoom-in; } .zoom-icon { cursor: zoom-in; font-size: 3rem; float: right; margin-bottom: -2em; margin-right: 0.5em; position: relative; color: white; top: 2vw; width: 1em; text-align: center; background: rgba(0, 0, 0, 0.3); opacity: 0.9; border-radius: 0.2em; height: 1em; line-height: 1em; } .-minusbottom { margin-bottom: 0 !important; } .-minustop { margin-top: -3% !important; } .single { margin-top: 67px; font-family: roboto-r; font-weight: 200; background-color: #ececea; overflow: hidden; } .single strong { font-weight: 400; } .single.menopausa { background-color: #ffe9ea; color: #311847; } .single.gravidez { background-color: #ffffff; } .single.endometriose { background-color: #f8fff3; color: #333333; } .single.hormonios-femininos { background-color: #ffffff; } .single.fibromialgia { background: -moz-linear-gradient(top, #fef8f2 50%, rgba(254, 248, 242, 0.98) 52%, rgba(229, 178, 101, 0.87) 63%, rgba(253, 182, 100, 0.68) 83%, rgba(0, 0, 224, 0.51) 100%); background: -webkit-linear-gradient(top, #fef8f2 50%, rgba(254, 248, 242, 0.98) 52%, rgba(229, 178, 101, 0.87) 63%, rgba(253, 182, 100, 0.68) 83%, rgba(0, 0, 224, 0.51) 100%); background: linear-gradient(to bottom, #fef8f2 50%, rgba(254, 248, 242, 0.98) 52%, rgba(229, 178, 101, 0.87) 63%, rgba(253, 182, 100, 0.68) 83%, rgba(0, 0, 224, 0.51) 100%); font-family: 'Zilla Slab', serif; font-weight: 300; } .single.depressao { background-color: #f2f2f2; font-family: 'Zilla Slab', serif; font-weight: 300; } .single.sindrome-do-ovario-policistico, .single.osteoporose, .single.infeccao-urinaria, .single.anticoncepcionais { font-family: 'Zilla Slab', serif; font-weight: 500; background-color: #ffffff; } @media screen and (max-width: 63.9375em) { .single.sindrome-do-ovario-policistico .full-img img, .single.osteoporose .full-img img, .single.infeccao-urinaria .full-img img, .single.anticoncepcionais .full-img img { min-width: 100%; } } @media screen and (max-width: 39.9375em) { .single.sindrome-do-ovario-policistico .full-img:last-child, .single.osteoporose .full-img:last-child, .single.infeccao-urinaria .full-img:last-child, .single.anticoncepcionais .full-img:last-child { margin-top: -10.5%; } } @media screen and (min-width: 64em) { .single.sindrome-do-ovario-policistico .responsive-folder, .single.osteoporose .responsive-folder, .single.infeccao-urinaria .responsive-folder, .single.anticoncepcionais .responsive-folder { margin-bottom: 0px; padding-bottom: 3%; } } .ctnr { margin: 0 auto; height: 100%; position: relative; width: 88%; } @media screen and (max-width: 39.9375em) { .ctnr { margin-bottom: 32px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .ctnr { margin-bottom: 6%; } } @media screen and (min-width: 64em) { .ctnr { width: 93%; opacity: 0; margin-bottom: 3%; } } .ctnr.-flex { display: flex; justify-content: space-between; max-width: 1020px; flex-wrap: wrap; } @media screen and (max-width: 39.9375em) { .ctnr.-flex div { margin-bottom: 3%; } } .ctnr.-flex span { background-color: #4c71a8; padding: 0.4em 2.5em; width: 100%; display: block; text-align: center; border-radius: 30px; font-weight: bold; font-size: 28px; margin-bottom: 1.5em; } .ctnr.-flex ul { list-style-type: decimal; padding: 0 3em; } .ctnr.-flex li { line-height: 1.8em; } .ctnr.-mask-footer { margin-top: -10%; } @media screen and (max-width: 39.9375em) { .ctnr.-mask-footer { margin-top: 0px; } } .ctnr.-mais-eficiente img { width: 30%; } .ctnr.-mais-eficiente img:first-child { margin-right: 2%; } @media screen and (max-width: 39.9375em) { .ctnr.-mais-eficiente img:first-child { margin-right: 0px; } } @media screen and (max-width: 39.9375em) { .ctnr.-mais-eficiente img { width: 51%; margin: 0 auto; } } .ctnr.-menos-eficiente img { width: 34%; } .ctnr.-menos-eficiente img:first-child { margin-right: 2%; } @media screen and (max-width: 39.9375em) { .ctnr.-menos-eficiente img:first-child { margin-right: 0px; } } .ctnr.-menos-eficiente img:last-child { display: block; margin: -55px auto 0; } @media screen and (max-width: 39.9375em) { .ctnr.-menos-eficiente img:last-child { display: inline-block; width: 51%; margin: 0px; } } @media screen and (max-width: 39.9375em) { .ctnr.-menos-eficiente img { width: 51%; margin: 0 auto; } } .single-title { font-family: testament; font-weight: 400; max-width: 775px; text-align: center; text-transform: uppercase; font-size: 65px; } @media screen and (min-width: 64em) { .single-title { font-size: 6.75vw; } } @media screen and (min-width: 75em) { .single-title { font-size: 5.50vw; } } @media screen and (min-width: 90em) { .single-title { font-size: 6.25vw; } } .single-title.-orange { color: #fe6b55; } .single-title.-purple { color: #a01a7d; } .single-title.-purple2 { color: #88599c; } .single-title.-palepurple { color: #ac67a3; } .single-title.-lightpurple { color: #655fe3; } .single-title.-white { color: #ffffff; } .single-title.-blue { color: #273773; } .single-title.-blue2 { color: #2f5d85; } .single-title.-babyblue { color: #4c71a8; } .single-title.-paleblue { color: #1989db; } .single-title.-vinho { color: #761a38; } .single-title.-vinho2 { color: #611420; } .single-title.-monteblack { font-family: 'Montserrat', sans-serif; font-weight: 900; font-size: 4vw; } @media screen and (max-width: 39.9375em) { .single-title.-monteblack { font-size: 7vw; } } .-laranja { background-color: darkorange; } .connect-title { font-family: testament; font-weight: 400; max-width: 1000px; text-align: center; text-transform: uppercase; position: relative; font-size: 45px; } @media screen and (min-width: 64em) { .connect-title { font-size: 4.75vw; } } @media screen and (min-width: 75em) { .connect-title { font-size: 3.50vw; } } @media screen and (min-width: 90em) { .connect-title { font-size: 4.25vw; } } .connect-title.-rounded { background-color: #e7a84d; color: white; border-radius: 50px; padding: 0.2em 0 0.1em; } .grid-topicos { display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 800px; } .grid-topicos .topico { width: 100%; display: flex; align-items: center; flex-direction: column; margin-bottom: 5%; font-size: 18px; } @media screen and (max-width: 39.9375em) { .grid-topicos .topico { margin-bottom: 14.5%; text-align: center; } } @media screen and (min-width: 40em) { .grid-topicos .topico { width: 48%; font-size: 20px; } } @media screen and (min-width: 64em) { .grid-topicos .topico { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .grid-topicos .topico { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .grid-topicos .topico { font-size: 1.25vw; } } @media screen and (max-width: 39.9375em) { .grid-topicos img { max-width: 70px; max-height: 100px; } } .grid-topicos .title { font-size: 1.4em; } .bgblock { color: white; padding-top: 5%; padding-bottom: 6%; position: relative; } @media screen and (max-width: 39.9375em) { .bgblock { margin-bottom: 32px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .bgblock { margin-bottom: 6%; } } @media screen and (min-width: 75em) { .bgblock { margin-bottom: 3%; } } .bgblock.-grdorange { background: #ed4d63; background: -moz-linear-gradient(top, #ed4d63 0%, #ef5d60 100%); background: -webkit-linear-gradient(top, #ed4d63 0%, #ef5d60 100%); background: linear-gradient(to bottom, #ed4d63 0%, #ef5d60 100%); } .bgblock.-petalas { background-color: #212959; background-size: cover; background-position: center; } .bgblock.-yellowpurple { background-position: center; background-size: cover; background: #dbb666; } @media screen and (max-width: 63.9375em) { .bgblock.-yellowpurple { background-image: none !important; } } @media screen and (min-width: 64em) { .bgblock.-yellowpurple { background: -webkit-linear-gradient(bottom left, #dbb666 0%, #a358ae 100%); background: -o-linear-gradient(bottom left, #dbb666 0%, #a358ae 100%); background: linear-gradient(to top right, #dbb666 0%, #a358ae 100%); } } .normal-p { max-width: 775px; line-height: 1.5em; font-size: 18px; } @media screen and (min-width: 40em) { .normal-p { font-size: 20px; } } @media screen and (min-width: 64em) { .normal-p { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .normal-p { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .normal-p { font-size: 1.25vw; } } .normal-p.-white { color: white; } .normal-p.-custom-sop { color: #2f6200; text-transform: uppercase; font-weight: bold; margin-bottom: 0; font-size: 5vw; } @media screen and (min-width: 64em) { .normal-p.-custom-sop { font-size: 2vw; } } @media screen and (min-width: 75em) { .normal-p.-custom-sop { font-size: 1.75vw; } } @media screen and (min-width: 90em) { .normal-p.-custom-sop { font-size: 1.50vw; } } .normal-p.-extend { max-width: 1000px; } .normal-p.-center { text-align: center; } .normal-p.-center img, .normal-p.-center span { display: inline-block; height: auto; } @media screen and (max-width: 39.9375em) { .normal-p.-center span { max-width: 100%; } } .normal-p.-italic { font-style: italic; } .normal-p.-blue { color: #467bc7; } .normal-p.-purple { color: #88599c; } .normal-p.-tit { font-size: 2em; font-weight: bold; font-family: 'Montserrat' !important; font-weight: 700 !important; } @media screen and (max-width: 39.9375em) { .normal-p.-tit { font-size: 1em; } } .normal-p .-pink { color: #bb81b8; } @media screen and (min-width: 64em) { .normal-p .-pink { font-size: 2.00vw; } } @media screen and (min-width: 75em) { .normal-p .-pink { font-size: 1.75vw; } } @media screen and (min-width: 90em) { .normal-p .-pink { font-size: 1.50vw; } } .normal-p .-pink2 { color: #fea4f7; text-decoration: underline; } @media screen and (min-width: 64em) and (max-width: 74.9375em) { .normal-p.-smallimg-medium img { width: 30%; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .normal-p.-smallimg-medium img { width: 30%; } } @media screen and (max-width: 39.9375em) { .normal-p.-smallimg img { width: 50%; } } @media screen and (max-width: 39.9375em) { .normal-p.-smallgif img { width: 70%; } } #remedio, #mascara { transform: translateX(-21%); } @media screen and (max-width: 39.9375em) { #remedio, #mascara { max-width: 50%; } } #calendar { transform: translateX(-13%); } @media screen and (max-width: 39.9375em) { #calendar { max-width: 50%; } } .full-img { margin-bottom: 3%; position: relative; } @media screen and (max-width: 39.9375em) { .full-img { overflow-x: hidden; } } .full-img img { height: auto; } @media screen and (max-width: 39.9375em) { .full-img .img-d { display: none; } } @media screen and (min-width: 40em) { .full-img .img-m { visibility: hidden; opacity: 0; height: 0; display: block; } } .addon-infec-video { padding: 0; margin: 0; margin-top: -2px; margin-bottom: -5px; background-color: #88599c; width: 100%; } .addon-infec-video > img { width: 100%; } @media (max-width: 550px) { .addon-infec-video { display: none; } } .blocked-topics { max-width: 775px; } .blocked-topics.-gradeyellowpurple span { background: #dbb666; background: -moz-linear-gradient(45deg, #dbb666 0%, #a358ae 100%); background: -webkit-linear-gradient(45deg, #dbb666 0%, #a358ae 100%); background: linear-gradient(45deg, #dbb666 0%, #a358ae 100%); } .blocked-topics.-gradegreenblue span { background: #49e05e; background: -moz-linear-gradient(45deg, #49e05e 0%, #3aadc9 100%); background: -webkit-linear-gradient(45deg, #49e05e 0%, #3aadc9 100%); background: linear-gradient(45deg, #49e05e 0%, #3aadc9 100%); } .blocked-topics span { margin-bottom: 4%; border-radius: 10px; padding: 1em 2em; display: block; width: 100%; color: white; font-weight: bold; } .two-flex-text { max-width: 1000px; display: flex; justify-content: space-between; } @media screen and (max-width: 63.9375em) { .two-flex-text { flex-direction: column-reverse; align-items: center; } } @media screen and (min-width: 40em) { .two-flex-text { flex-direction: row; } } @media screen and (max-width: 39.9375em) { .two-flex-text.-max-h100 img { max-height: 100px; } } .two-flex-text.-left-bordered { max-width: 550px; } @media screen and (min-width: 40em) { .two-flex-text.-left-bordered { flex-direction: row-reverse; } } @media screen and (min-width: 40em) { .two-flex-text.-left-bordered .img { margin-right: 10%; } } .two-flex-text.-left-bordered p { border-left: 4px solid #f15a2d; padding: 2% 0px 2% 6%; } .two-flex-text.-right-bordered { max-width: 550px; } @media screen and (min-width: 40em) { .two-flex-text.-right-bordered .img { margin-left: 10%; } } @media screen and (max-width: 39.9375em) { .two-flex-text.-right-bordered p { border-left: 4px solid #f15a2d; padding: 2% 0px 2% 6%; } } @media screen and (min-width: 40em) { .two-flex-text.-right-bordered p { text-align: right; border-right: 4px solid #f15a2d; padding: 2% 6% 2% 0px; } } .two-flex-text.-custom-osteo { flex-direction: row-reverse; max-width: 600px; align-items: center; color: #2f5d85; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-osteo { flex-direction: column-reverse; } } @media screen and (max-width: 39.9375em) and (min-width: 64em) { .two-flex-text.-custom-osteo .img { max-width: 65%; } } .two-flex-text.-custom-osteo h4 { text-transform: uppercase; margin-top: 0; margin-bottom: 1em; font-size: 18px; font-weight: 300; margin-left: 1em; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-osteo h4 { font-size: 16px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .two-flex-text.-custom-osteo h4 { font-size: 24px; } } .two-flex-text.-custom-osteo h4 strong { font-weight: 600; } .two-flex-text.-custom-infec { max-width: 600px; align-items: center; color: #3d6c8f; } @media screen and (min-width: 40em) { .two-flex-text.-custom-infec { flex-direction: row-reverse; } } @media screen and (min-width: 40em) { .two-flex-text.-custom-infec .img { margin-right: 10%; } } .two-flex-text.-custom-sop { flex-direction: row-reverse; justify-content: space-around; max-width: 600px; align-items: center; color: #2f6200; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-sop { flex-direction: column-reverse; } } @media screen and (max-width: 39.9375em) and (min-width: 64em) { .two-flex-text.-custom-sop .img { max-width: 65%; } } .two-flex-text.-custom-sop h3 { font-family: 'Montserrat', sans-serif; font-weight: 500; text-transform: uppercase; margin-top: 0; margin-bottom: 0; font-size: 1.5vw; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-sop h3 { font-size: 6vw; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .two-flex-text.-custom-sop h3 { font-size: 3vw; } } .two-flex-text.-custom-sop span { font-size: 0.9em; } .two-flex-text.-custom-sop .-black { color: #000; font-weight: 600; } @media screen and (max-width: 39.9375em) { .two-flex-text.-large-text-column .img { width: 30%; } } @media screen and (min-width: 64em) { .two-flex-text.-large-text-column .text { width: 70%; } } .two-flex-text .img img { height: auto; } .two-flex-text .text { width: 100%; font-size: 18px; } @media screen and (min-width: 40em) { .two-flex-text .text { width: 55%; font-size: 20px; } } @media screen and (min-width: 64em) { .two-flex-text .text { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .two-flex-text .text { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .two-flex-text .text { font-size: 1.25vw; } } .two-flex-text .text.-right { text-align: right; } .two-flex-text .text.-block { background-color: white; padding: 5%; } .two-flex-text .-top { margin-bottom: 2%; } .two-flex-text .divider { max-width: 1000px; } .divider { height: 3px; max-width: 392px; } .divider.-waterblue { background-color: #a8dadc; } .divider.-yellow { background-color: #ffcc4e; } .block-citacao { line-height: 1.5em; box-shadow: -12px 12px 40px rgba(0, 0, 0, 0.18); color: white; border-radius: 20px; font-size: 18px; overflow: auto; } @media screen and (max-width: 39.9375em) { .block-citacao { padding: 16px; font-size: 20px; } } @media screen and (min-width: 40em) { .block-citacao { font-size: 20px; } } @media screen and (min-width: 64em) { .block-citacao { font-size: 1.75vw; padding: 1% 6.5%; } } @media screen and (min-width: 75em) { .block-citacao { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .block-citacao { font-size: 1.25vw; } } .block-citacao.-orange { max-width: 775px; background-color: #fe6b55; padding: 1% 6.5%; } .block-citacao.-blue { max-width: 985px; background-color: #467bc7; padding: 1% 6.5%; } .block-citacao.-cblueblack { max-width: 985px; background-color: #467bc7; padding: 1% 6.5%; } .block-citacao.-cblueblack h4 { color: #78b3ca; } .block-citacao.-cblueblack p { color: black; } .block-citacao.-cpurple { color: #9159a7; } .block-citacao.-white { max-width: 775px; background-color: #fff; padding: 1% 6.5%; } .block-citacao.-corange { color: #f15a2d; } .block-citacao.-cpink { color: #bb81b8; } .block-citacao.-cpink p { font-size: 1.2em; } .block-citacao.-pink { background-color: #fea4f7; color: #5c3968; max-width: 775px; padding: 1% 6.5%; text-align: center; } .block-citacao.-black { color: #333; } .block-citacao.-black strong { font-weight: bold; } .block-citacao.-darkblue { max-width: 985px; background-color: #273773; padding: 1% 6.5%; } .block-citacao.-bigblue { max-width: 775px; background-color: #467bc7; text-align: center; font-weight: bold; font-size: 22px; } @media screen and (min-width: 40em) { .block-citacao.-bigblue { font-size: 24px; } } @media screen and (min-width: 64em) { .block-citacao.-bigblue { font-size: 2.75vw; } } @media screen and (min-width: 75em) { .block-citacao.-bigblue { font-size: 2.50vw; } } @media screen and (min-width: 90em) { .block-citacao.-bigblue { font-size: 2.25vw; } } .block-citacao.-grdorange { background: #ef5d60; background: -moz-linear-gradient(45deg, #ef5d60 0%, #ec4067 100%); background: -webkit-linear-gradient(45deg, #ef5d60 0%, #ec4067 100%); background: linear-gradient(45deg, #ef5d60 0%, #ec4067 100%); padding: 1% 6.5%; max-width: 1014px; color: white; border-radius: 0; overflow: initial; } .block-citacao.-grdorange .border { position: absolute; border: 3px solid #ffcc4e; top: 0; bottom: 0; left: 0; right: 0; transform: translateX(15px) translateY(15px); } .block-citacao.-grdpurple { background: #5b1e7e; background: -moz-linear-gradient(45deg, #5b1e7e 0%, #9e1292 100%); background: -webkit-linear-gradient(45deg, #5b1e7e 0%, #9e1292 100%); background: linear-gradient(45deg, #5b1e7e 0%, #9e1292 100%); padding: 1% 6.5%; max-width: 1014px; color: white; border-radius: 0; overflow: initial; } .block-citacao.-grdpurple .border { position: absolute; border: 3px solid #ffcc4e; top: 0; bottom: 0; left: 0; right: 0; transform: translateX(15px) translateY(15px); } .block-citacao.-border-orange { border-left: 6px solid #f15a2d; color: #f15a2d; } .block-citacao.-mgtop { margin-top: -7%; } .citacao { max-width: 775px; line-height: 1.5em; font-size: 22px; } @media screen and (min-width: 40em) { .citacao { font-size: 24px; } } @media screen and (min-width: 64em) { .citacao { font-size: 2.75vw; } } @media screen and (min-width: 75em) { .citacao { font-size: 2.50vw; } } @media screen and (min-width: 90em) { .citacao { font-size: 2.25vw; } } .citacao p { margin: 0; } .citacao.-mcenter { text-align: center; } .citacao.-blue { color: #467bc7; } .citacao.-blue2 { color: #3d6c8f; } .citacao.-blue2 .-pink { color: #dc7bb2; font-weight: 600; } .citacao.-purple { color: #a01a7d; } .citacao.-orange { color: #e63617; } .citacao.-pink { color: #bb81b8; } @media screen and (min-width: 40em) { .citacao.-pink { font-size: 20px; } } @media screen and (min-width: 64em) { .citacao.-pink { font-size: 2.25vw; } } @media screen and (min-width: 75em) { .citacao.-pink { font-size: 2.00vw; } } @media screen and (min-width: 90em) { .citacao.-pink { font-size: 1.75vw; } } .citacao.-pink2 { color: #cc7bbc; } .citacao.-center { text-align: center; } .citacao.-compact { line-height: 1.2em; margin-top: 20px; } .citacao.-custom-sop { max-width: 600px; color: #2f6200; } .citacao.-custom-sop h3 { font-family: 'Montserrat', sans-serif; font-weight: 500; margin: 0; font-size: 0.8em; line-height: 1em; text-transform: uppercase; } .citacao .-cpurple { color: #88599c; } .feature-divider { color: #a01a7d; font-size: 24px; max-width: 775px; text-align: center; } @media screen and (min-width: 40em) { .feature-divider { font-size: 28px; } } @media screen and (min-width: 64em) { .feature-divider { font-size: 3.75vw; } } @media screen and (min-width: 75em) { .feature-divider { font-size: 3.25vw; } } @media screen and (min-width: 90em) { .feature-divider { font-size: 3vw; } } .feature-divider .divider { max-width: 1000px; } .feature-divider h4 { margin: 0.7em 0; } .block-color { max-width: 985px; padding: 3.5% 6.5% 4%; line-height: 1.5em; font-size: 18px; } @media screen and (min-width: 40em) { .block-color { font-size: 20px; } } @media screen and (min-width: 64em) { .block-color { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .block-color { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .block-color { font-size: 1.25vw; } } .block-color.-yellow { background-color: #f3d174; } .block-color.-orange { background-color: #ff5c40; color: white; } .block-color.-navy { background-color: #273773; color: white; } .block-color.-white { background-color: #f9efe4; } .block-color .-monteblack { font-size: 3vw; line-height: 1.2em; } @media screen and (max-width: 39.9375em) { .block-color .-monteblack { font-size: 6vw; } } @media screen and (max-width: 39.9375em) { .block-color.-margintop { margin-top: 20px; } } .block-color ul { list-style-type: disc; padding-left: 1em; font-weight: bold; } .topic-list { margin-bottom: 4%; max-width: 775px; } @media screen and (max-width: 39.9375em) { .topic-list { margin-bottom: 32px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .topic-list.-smallimgs img { width: 15%; } } @media screen and (max-width: 39.9375em) { .topic-list.-imgtop img { float: none; margin: 0 auto; } } @media screen and (max-width: 39.9375em) { .topic-list.-imgtop li { text-align: center; } } .topic-list li { display: inline-block; margin-bottom: 4%; width: 100%; } .topic-list li:last-child { margin-bottom: 0; } .topic-list img { float: left; } @media screen and (max-width: 39.9375em) { .topic-list img { float: left; max-height: 80px; width: auto; } } @media screen and (min-width: 40em) { .topic-list img { margin-right: 4%; } } .topic-list p { font-size: 18px; } @media screen and (min-width: 40em) { .topic-list p { font-size: 20px; } } @media screen and (min-width: 64em) { .topic-list p { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .topic-list p { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .topic-list p { font-size: 1.25vw; } } .topic-list.-transp { color: #467bc7; } .topic-list.-transp li { line-height: 2.4em; } @media screen and (max-width: 39.9375em) { .topic-list.-transp img { margin-right: 15px; } } .topic-list.-flex { max-width: 775px; } .topic-list.-flex ul { padding: 0px; } .topic-list.-flex li { display: flex; align-items: center; } @media screen and (max-width: 39.9375em) { .topic-list.-flex li { flex-direction: column; text-align: center; } } @media screen and (min-width: 40em) { .topic-list.-flex div { width: 75%; } } @media screen and (min-width: 40em) { .topic-list.-flex .thumb { width: 25%; display: flex; margin-right: 5%; justify-content: center; } } .topic-list.-flex h3 { font-size: 2em; } @media screen and (max-width: 39.9375em) { .topic-list.-flex h3 { margin: 0.5em 0 0; } } @media screen and (min-width: 40em) { .topic-list.-flex h3 { margin: 0; } } .topic-list.-flex p { margin-bottom: 0; } @media screen and (max-width: 39.9375em) { .topic-list.-flex p { margin: 0; } } @media screen and (max-width: 39.9375em) { .topic-list.-topic-fibro { text-align: center; } } @media screen and (max-width: 39.9375em) { .topic-list.-topic-fibro img { float: none; } } .topic-list.-blue { max-width: 1218px; background-color: #467bc7; color: white; padding: 5% 19.5%; border-radius: 20px; font-size: 16px; padding-left: 7.5%; box-shadow: -12px 12px 40px rgba(0, 0, 0, 0.18); } @media screen and (max-width: 39.9375em) { .topic-list.-blue { padding: 32px; } } .topic-list.-blue li { margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .topic-list.-blue li { margin-bottom: 16px; } } .topic-list.-purple { font-size: 16px; color: purple; } @media screen and (max-width: 39.9375em) { .topic-list.-purple { padding: 32px; } } .topic-list.-purple img { width: 80px; } @media screen and (max-width: 39.9375em) { .topic-list.-purple img { float: none; } } .topic-list.-purple p { font-size: 1.4em; line-height: 15px; } @media screen and (max-width: 39.9375em) { .topic-list.-purple p { line-height: normal; } } .topic-list.-purple li { margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .topic-list.-purple li { margin-bottom: 16px; display: block; text-align: center; } } .topic-list.-black-to-list li { text-align: center; } .topic-list.-black-to-list p { font-size: 1.5vw; text-align: left; } @media screen and (max-width: 39.9375em) { .topic-list.-black-to-list p { font-size: 6.5vw; } } .topic-list.-black-to-list strong { margin-bottom: 4%; font-weight: 600; display: inline-block; } @media screen and (max-width: 39.9375em) { .topic-list.-black-to-list img { float: none; } } .topic-list.-gif { font-size: 20px; } .topic-list.-gif img { width: 200px; } @media screen and (max-width: 39.9375em) { .topic-list.-gif img { font-size: 18px; display: none; } } .topic-list.-gif .center-in-image { margin-top: 120px; } @media screen and (max-width: 39.9375em) { .topic-list.-gif .center-in-image { margin-top: 0px; } } .topic-list.-gif li { margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .topic-list.-gif li { margin-bottom: 16px; } } .double-list { max-width: 740px; display: flex; flex-wrap: wrap; justify-content: space-between; list-style-type: disc; } .double-list li { width: 42%; margin-bottom: 4%; font-size: 18px; margin-left: 5%; } @media screen and (max-width: 63.9375em) { .double-list li { width: 100%; } } .number-list { max-width: 775px; } .number-list li { display: flex; width: 100%; margin-bottom: 4%; } .number-list .nimg { margin-right: 4%; } .number-list strong { font-size: 175%; } .overlap-img { max-width: 975px; position: relative; } .overlap-img .img-ab-block { position: relative; } .overlap-img .text-block { background-color: rgba(255, 255, 255, 0.7); padding: 1em; position: absolute; bottom: 0; left: 200px; right: 0px; font-size: 230%; line-height: 1.4em; display: inline-block; } @media screen and (max-width: 63.9375em) { .overlap-img .text-block { left: 3%; font-size: 120%; } } .week-timeline { max-width: 1008px; } @media screen and (min-width: 40em) { .week-row .-onlym { display: none; } } @media screen and (max-width: 63.9375em) { .week-row .-onlyd { display: none; } } .week-half { width: 50%; float: left; } .week { text-align: center; display: flex; flex-direction: column; align-items: center; width: 100%; margin-bottom: 16%; } .week .week-title { background-color: #761a38; padding: 0.6em 2.5em; color: white; display: inline-block; border-radius: 30px; font-size: 130%; z-index: 3; } .week .week-title:before { position: absolute; width: 16px; height: 16px; border-radius: 10px; background-color: #898989; left: 49.1%; border: 1px solid white; } @media screen and (min-width: 64em) { .week .week-title:before { content: ''; } } .week .week-img { display: inline-block; z-index: 3; height: 300px; width: 300px; } @media screen and (max-width: 63.9375em) { .week .week-img { width: 60%; height: 60%; } } .week .week-text { font-size: 1em; line-height: 1.6em; z-index: 3; background-color: white; } @media screen and (max-width: 63.9375em) { .week .week-text { font-size: 1.2em; } } .author-footer { max-width: 910px; text-align: center; padding: 2% 6%; } @media screen and (max-width: 39.9375em) { .author-footer { padding: 16px; } } .author-footer.-gray { background-color: #e4e4e2; } .author-footer.-yellow { background-color: #ffd063; } .author-footer.-navy { background-color: #abcbeb; } .author-footer > .title { font-size: 20px; margin-bottom: 2%; display: inline-block; } .author-footer > ul { display: flex; justify-content: space-between; align-items: center; list-style-type: none; margin: 0; font-size: 14px; } @media screen and (max-width: 39.9375em) { .author-footer > ul { flex-direction: column; } } .author-footer > ul.-center { justify-content: center; } .author-footer > ul.-between { justify-content: space-between; } .author-footer-dois { max-width: 910px; text-align: center; padding: 2% 6%; } @media screen and (max-width: 39.9375em) { .author-footer-dois { padding: 16px; } } .author-footer-dois .title { font-size: 14px; margin-bottom: 2%; display: inline-block; } .author-footer-dois .colaboradores { font-weight: bolder; font-size: 15px; } img { display: inline-block; } .bg-depoimento { background-position: center; background-repeat: no-repeat; background-size: cover; } .bg-depoimento .ctnr { max-width: 800px; text-align: center; } .bg-depoimento .title { font-weight: bold; color: white; font-size: 1.5em; margin-bottom: 0; } .bg-depoimento .cargo { font-weight: bold; color: white; font-size: 1.5em; margin-top: 0; } .bg-depoimento .baloon { background-color: white; font-size: 1.6em; color: #454545; padding: 2em; font-style: italic; border-radius: 20px; box-shadow: 0px 8px 20px 9px #0000002e; } .bg-depoimento .img { max-width: 150px; border-radius: 200px; border: 4px solid white; box-shadow: 0 8px 20px 9px #0000002e; } .depoimento-free { max-width: 700px; text-align: center; } .depoimento-free .title { font-weight: bold; font-size: 1.3em; margin-bottom: 0; text-align: left; } .depoimento-free .baloon { font-size: 1.6em; font-style: italic; text-align: left; } .depoimento-free .img { max-width: 150px; border-radius: 200px; border: 4px solid white; margin-bottom: 25px; } .depoimento-free.-orange { color: #f15a2d; } .depoimento-free.-blue { color: #005598; } .depoimento-free.-blue2 { color: #78b3ca; } .responsive-folder { max-width: 750px; } .responsive-folder picture { text-align: center; } .qa-medico { max-width: 775px; } .qa-medico .pergunta { font-weight: bolder; margin-bottom: 5%; font-family: 'Montserrat'; font-weight: 600; color: #333; font-size: 22px; } @media screen and (min-width: 64em) { .qa-medico .pergunta { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .qa-medico .pergunta { font-size: 2vw; } } @media screen and (min-width: 90em) { .qa-medico .pergunta { font-size: 1.5vw; } } .qa-medico .resposta { display: flex; justify-content: space-between; align-items: flex-start; } @media screen and (max-width: 39.9375em) { .qa-medico .resposta { flex-direction: column; } } @media screen and (min-width: 40em) { .qa-medico .conteudo { width: calc(95% - 150px); } } .qa-medico .baloon { font-size: 1.2em; color: #005598; max-width: 600px; font-style: italic; font-weight: bold; } .qa-medico .img { max-width: 150px; border-radius: 200px; } @media screen and (max-width: 39.9375em) { .qa-medico .img { margin-bottom: 24px; } } .qa-medico .title { font-weight: bold; color: #005598; font-size: 1em; margin-bottom: 0; } .absolute-ctnr { position: relative; height: 0px; display: none; } @media screen and (min-width: 75em) { .absolute-ctnr { display: block; } } .absolute-imgs { position: absolute; z-index: 1; } @media screen and (max-width: 74.9375em) { .absolute-imgs { opacity: 0; } } @media screen and (min-width: 75em) { .absolute-imgs { width: 20%; height: auto; display: block; } } @media screen and (min-width: 112.5em) { .absolute-imgs { width: auto; } } .absolute-imgs.-left { left: 0px; } .absolute-imgs.-right { right: 0px; } #rosa-e, #rosa-d { top: 36vw; } #sabao { top: 140vw; } #colhetor { top: 25vw; } #regua { top: 90vw; } #absorvente { top: 40vw; } #remedio { top: 110vw; } #toalha { top: 150vw; } #creme { top: 20vw; } #chocolate { top: 67vw; } #esteto { top: 28vw; } #esteto2 { top: 10vw; } #relogio { top: 137vw; } #ampulheta { top: -72vw; } #maca { top: 55vw; } #peso { top: 30vw; } #bola { top: -3vw; } #bebe { top: 3vw; } #frauda { top: -26vw; } #return-to-top { position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; display: block; text-decoration: none; z-index: 4; } #return-to-top path { fill: #059; } @media screen and (max-width: 63.9375em) { header.topbar { position: fixed !important; background-image: url("/Paginas/osteoporose/assets/images/button_menu.png"); background-repeat: no-repeat; background-position: right 20px center; background-size: 48px; padding-right: 68px; z-index: 9999; } header.topbar.-expanded { background-image: url("/Paginas/osteoporose/assets/images/button_menu_close.png"); } header.topbar.-orange { background-color: #fe6b55; } header.topbar.-orange span { color: #fe6b55; } header.topbar.-purple { background-color: #a01a7d; } header.topbar.-purple span { color: #a01a7d; } header.topbar.-palepurple { background-color: #ac67a3; } header.topbar.-palepurple span { color: #ac67a3; } header.topbar.-lightpurple { background-color: #655fe3; } header.topbar.-lightpurple span { color: #655fe3; } header.topbar.-blue { background-color: #273773; } header.topbar.-blue span { color: #273773; } header.topbar.-babyblue { background-color: #4c71a8; } header.topbar.-babyblue span { color: #4c71a8; } header.topbar.-paleblue { background-color: #1989db; } header.topbar.-paleblue span { color: #1989db; } header.topbar.-vinho { background-color: #761a38; } header.topbar.-vinho span { color: #761a38; } } .float-mobile-menu { position: fixed; height: calc(100vh - 67px); overflow-y: scroll; top: 67px; left: 0; right: 0; font-family: roboto-r; font-weight: 200; bottom: 0; transition: 0.2s ease-out; opacity: 0; visibility: hidden; display: flex; flex-direction: column; } @media screen and (min-width: 64em) { .float-mobile-menu { display: none; } } .float-mobile-menu .title { padding-left: 1em; } .float-mobile-menu .target { display: none; text-decoration: none; align-items: center; width: 100%; background-color: white; border-bottom: 1px solid lightgray; max-height: 90px; min-height: 60px; flex-grow: 1; } .float-mobile-menu .target span { line-height: 1em; padding: 0 1em; color: #4c71a8; } .float-mobile-menu .target.voltar { font-weight: bold; margin-bottom: 40px; } .float-mobile-menu.-expanded { background-color: white !important; opacity: 1; visibility: visible; } .float-mobile-menu.-expanded .title { display: none; } .float-mobile-menu.-expanded .target { display: flex; } .float-mobile-menu.-fixed { position: fixed; top: 0px; } .float-menu { position: fixed; top: 0; bottom: 0; margin: auto; display: flex; flex-direction: column; align-items: flex-end; font-family: roboto-r; font-weight: 200; right: 1em; z-index: 9999; } @media screen and (max-width: 63.9375em) { .float-menu { display: none; } } @media screen and (max-width: 63.9375em) { .float-menu.-orange { background-color: #fe6b55; } } .float-menu.-orange span { background-color: #fe6b55; } .float-menu.-orange:after { border: 2px solid #fe6b55; } .float-menu.-orange a.active::after { background-color: #fe6b55; border-color: #ffc3ba; } @media screen and (max-width: 63.9375em) { .float-menu.-purple { background-color: #a01a7d; } } .float-menu.-purple span { background-color: #a01a7d; } .float-menu.-purple:after { border: 2px solid #a01a7d; } .float-menu.-purple a.active::after { background-color: #a01a7d; border-color: #e040b6; } @media screen and (max-width: 63.9375em) { .float-menu.-palepurple { background-color: #ac67a3; } } .float-menu.-palepurple span { background-color: #ac67a3; } .float-menu.-palepurple:after { border: 2px solid #ac67a3; } .float-menu.-palepurple a.active::after { background-color: #ac67a3; border-color: #d0a9cb; } @media screen and (max-width: 63.9375em) { .float-menu.-lightpurple { background-color: #655fe3; } } .float-menu.-lightpurple span { background-color: #655fe3; } .float-menu.-lightpurple:after { border: 2px solid #655fe3; } .float-menu.-lightpurple a.active::after { background-color: #655fe3; border-color: #b9b6f2; } @media screen and (max-width: 63.9375em) { .float-menu.-blue { background-color: #273773; } } .float-menu.-blue span { background-color: #273773; } .float-menu.-blue:after { border: 2px solid #273773; } .float-menu.-blue a.active::after { background-color: #273773; border-color: #415cbf; } @media screen and (max-width: 63.9375em) { .float-menu.-babyblue { background-color: #4c71a8; } } .float-menu.-babyblue span { background-color: #4c71a8; } .float-menu.-babyblue:after { border: 2px solid #4c71a8; } .float-menu.-babyblue a.active::after { background-color: #4c71a8; border-color: #8ea7cc; } @media screen and (max-width: 63.9375em) { .float-menu.-paleblue { background-color: #1989db; } } .float-menu.-paleblue span { background-color: #1989db; } .float-menu.-paleblue:after { border: 2px solid #1989db; } .float-menu.-paleblue a.active::after { background-color: #1989db; border-color: #6cb7ee; } @media screen and (max-width: 63.9375em) { .float-menu.-vinho { background-color: #761a38; } } .float-menu.-vinho span { background-color: #761a38; } .float-menu.-vinho:after { border: 2px solid #761a38; } .float-menu.-vinho a.active::after { background-color: #761a38; border-color: #ca2c60; } .float-menu a { padding: 1em 0.5em; border-radius: 20px; color: white; text-decoration: none; display: flex; align-items: center; position: relative; } .float-menu a span { background-color: gray; line-height: 3em; padding: 0 1em; border-radius: 50px; transform: scaleX(0) translateX(50px); transform-origin: right; opacity: 0; display: inline-block; position: absolute; white-space: pre; right: 40px; } .float-menu a:after { content: ''; background-color: white; display: inline-block; border-radius: 50px; width: 20px; height: 20px; border: 2px solid gray; margin-left: 1em; transition: all 0.2s ease-out; } .float-menu a:hover span { transition: 0.4s ease-in-out; transform: scaleX(1) translateX(0px); opacity: 1; } .topbar { position: absolute !important; } .already-visible.ctnr, .showup.ctnr { transition: all 500ms ease-in-out; transition-delay: 250ms; opacity: 1; } .painel-tratamento { max-width: 800px; position: relative; margin: 0 auto 50px; padding: 60px; } @media screen and (max-width: 39.9375em) { .painel-tratamento { max-width: 775px; padding: 20px; } } .painel-tratamento:before { content: ""; position: absolute; border: 2px solid #9159a7; top: 0; bottom: 0; left: 5%; right: 5%; border-radius: 10px; }/*------------------------------------*\ #SETTINGS \*------------------------------------*/ /*------------------------------------*\ #MIXINS \*------------------------------------*/ @import url("https://fonts.googleapis.com/css?family=Zilla+Slab:300,500,500i"); @import url("https://fonts.googleapis.com/css?family=Montserrat:700,900"); @font-face { font-family: testament; src: url("/Paginas/osteoporose/assets/fonts/testament.eot"); src: url("/Paginas/osteoporose/assets/fonts/testament.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/testament.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/testament.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/testament.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/testament.svg#testament") format("svg"); font-weight: 400; font-style: bold; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: testament; src: url("/Paginas/osteoporose/assets/fonts/testament.svg#testament") format("svg"); } } @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-r.eot"); src: url("/Paginas/osteoporose/assets/fonts/roboto-r.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/roboto-r.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/roboto-r.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/roboto-r.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/roboto-r.svg#roboto-r") format("svg"); font-weight: 200; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-r.svg#roboto-r") format("svg"); } } @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-l.eot"); src: url("/Paginas/osteoporose/assets/fonts/roboto-l.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/roboto-l.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/roboto-l.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/roboto-l.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/roboto-l.svg#roboto-r") format("svg"); font-weight: 200; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-l.svg#roboto-r") format("svg"); } } @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-b.eot"); src: url("/Paginas/osteoporose/assets/fonts/roboto-b.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/roboto-b.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/roboto-b.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/roboto-b.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/roboto-b.svg#roboto-r") format("svg"); font-weight: 400; font-style: bold; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: roboto-r; src: url("/Paginas/osteoporose/assets/fonts/roboto-b.svg#roboto-r") format("svg"); } } @font-face { font-family: laCompa; src: url("/Paginas/osteoporose/assets/fonts/laCompa.eot"); src: url("/Paginas/osteoporose/assets/fonts/laCompa.eot?#iefix") format("embedded-opentype"), url("/Paginas/osteoporose/assets/fonts/laCompa.woff") format("woff"), url("/Paginas/osteoporose/assets/fonts/laCompa.woff2") format("woff2"), url("/Paginas/osteoporose/assets/fonts/laCompa.ttf") format("truetype"), url("/Paginas/osteoporose/assets/fonts/laCompa.svg#laCompa") format("svg"); font-weight: 200; font-style: normal; } @media screen and (-webkit-min-device-pixel-ratio: 0) { @font-face { font-family: laCompa; src: url("/Paginas/osteoporose/assets/fonts/laCompa.svg#laCompa") format("svg"); } } /*------------------------------------*\ #VENDOR \*------------------------------------*/ /*------------------------------------*\ #Default Theme Settings \*------------------------------------*/ body { -webkit-overflow-scrolling: touch; } .topbar { background-color: #005599; height: 67px; position: fixed; width: 100%; z-index: 10; } .topbar a { text-decoration: none; } .topbar .-flex { display: flex; justify-content: center; align-items: center; } .topbar #logo-mobile { display: none; } @media screen and (max-width: 63.9375em) { .topbar #logo-mobile { display: block; } .topbar #logo-desktop { display: none; } } .menu-mobile { display: none; } .footer { background-color: #1c1b1b; } footer { width: 100%; display: inline-block; font-size: 2vw; font-family: FuturaRegular; font-weight: 200; padding: 5em 0px; } @media screen and (min-width: 64em) { footer { padding: 1.1em 0px; } } footer .-flex { flex-wrap: nowrap; justify-content: center; } @media screen and (max-width: 63.9375em) { footer .-flex { flex-direction: column; } } footer .info { width: 100%; } @media screen and (max-width: 63.9375em) { footer .info { order: 2; } } @media screen and (min-width: 64em) { footer .info { width: 35%; max-width: 786px; } } footer .links { width: 65%; } @media screen and (max-width: 63.9375em) { footer .links { order: 1; width: 100%; } } @media screen and (min-width: 64em) { footer .links { max-width: 798px; } } footer .menu-wrapper { display: block; } @media screen and (max-width: 39.9375em) { footer .site-link { width: 50%; } } @media screen and (min-width: 64em) { footer .site-link { width: 18%; } } footer .assinatura { float: left; clear: both; } footer .menu { font-size: 1vw; color: white; align-items: center; justify-content: center; display: flex; } @media screen and (max-width: 63.9375em) { footer .menu { display: none; } } @media screen and (min-width: 90em) { footer .menu { font-size: 22px; } } footer .menu li { cursor: pointer; margin: 0px 0.5em; } @media screen and (min-width: 64em) { footer .menu li { margin: 0px 1em; } } footer .menu .sub-button { display: none; } @media screen and (max-width: 63.9375em) { footer .button-link { display: none; } } footer a { color: white; text-transform: uppercase; font-family: bebas; font-weight: 400; text-decoration: none; font-size: 1.2em; } * { box-sizing: border-box; } @media screen and (max-width: 63.9375em) { html { -webkit-overflow-scrolling: touch; } } html, body { height: 100%; float: left; width: 100%; margin: 0px; padding: 0px; } html { background-color: #f4f4f4; } body { text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; font-family: source-r; font-weight: 200; height: 100%; } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out"; -webkit-transition-delay: 9999s; } .container { width: 88%; margin: 0 auto; max-width: 1520px; height: 100%; position: relative; } @media screen and (min-width: 64em) { .container { width: 93%; } } .container.-flex { display: flex; flex-wrap: wrap; } .container.-flex.-center { justify-content: center; align-items: center; } .container.-flex.-space { justify-content: space-between; } .container.-flex.-end { justify-content: center; } @media screen and (min-width: 64em) { .container.-flex.-end { justify-content: flex-end; } } ul { list-style-type: none; margin: 0px; padding: 0px; } a { outline: none; cursor: pointer; } figure { margin: 0; } img { display: block; max-width: 100%; } .button-link { text-decoration: none; font-family: bebas; font-weight: 400; text-transform: uppercase; display: inline-block; padding: 0.8em 1.2em 0.6em; font-size: 20px; transition: all 0.4s; cursor: pointer; } @media screen and (min-width: 87.5em) { .button-link { font-size: 28px; } } .button-link:hover { box-shadow: 850px 0 0 0 rgba(0, 0, 0, 0.3) inset; } .button-link.-branco-verde { background-color: white; color: #507736; } .button-link.-branco-verde:hover { box-shadow: 650px 0 0 0 rgba(80, 119, 54, 0.3) inset; } .button-link.-verde-branco { background-color: #507736; color: white; } .button-link.-marrom-branco { background-color: #be9144; color: white; } .button-link.-gold-branco { background-color: #ecb744; color: white; } .input-field { font-family: source-r; font-weight: 200; border-radius: 0px; box-shadow: none; outline: none; padding: 1.3em 1em 0.95em; background-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 20px; } .input-field.-select { background-image: url("/Paginas/osteoporose/assets/images/select_triangle.png"); background-position: center right 25px; background-repeat: no-repeat; } .input-field.-gold-cinza { border: 1px solid #ecb744; color: #666; } .input-field.-gold-cinza ::-webkit-input-placeholder { color: #666; } .input-field.-gold-cinza :-moz-placeholder { color: #666; } .input-field.-gold-cinza ::-moz-placeholder { color: #666; } .input-field.-gold-cinza :-ms-input-placeholder { color: #666; } .wpcf7-not-valid-tip { display: none !important; } /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; left: 0; top: 0; display: block; } .slick-track:before, .slick-track:after { content: ""; display: table; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { float: left; height: 100%; min-height: 1px; display: none; } [dir="rtl"] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* ====== Zoom effect ====== */ .mfp-zoom-in, .mfp-wrap { /* start state */ /* animate in */ /* animate out */ } .mfp-zoom-in .mfp-with-anim, .mfp-zoom-in .mfp-iframe-scaler, .mfp-zoom-in .mfp-inline-holder, .mfp-wrap .mfp-with-anim, .mfp-wrap .mfp-iframe-scaler, .mfp-wrap .mfp-inline-holder { opacity: 0; transition: all 0.2s ease-in-out; transform: scale(0.8); } .mfp-zoom-in.mfp-bg, .mfp-wrap.mfp-bg { opacity: 0; transition: all 0.3s ease-out; } .mfp-zoom-in.mfp-ready .mfp-with-anim, .mfp-zoom-in.mfp-ready .mfp-iframe-scaler, .mfp-zoom-in.mfp-ready .mfp-inline-holder, .mfp-wrap.mfp-ready .mfp-with-anim, .mfp-wrap.mfp-ready .mfp-iframe-scaler, .mfp-wrap.mfp-ready .mfp-inline-holder { opacity: 1; transform: scale(1); } .mfp-zoom-in.mfp-ready.mfp-bg, .mfp-wrap.mfp-ready.mfp-bg { opacity: 0.8; } .mfp-zoom-in.mfp-removing .mfp-with-anim, .mfp-zoom-in.mfp-removing .mfp-iframe-scaler, .mfp-zoom-in.mfp-removing .mfp-inline-holder, .mfp-wrap.mfp-removing .mfp-with-anim, .mfp-wrap.mfp-removing .mfp-iframe-scaler, .mfp-wrap.mfp-removing .mfp-inline-holder { transform: scale(0.8); opacity: 0; } .mfp-zoom-in.mfp-removing.mfp-bg, .mfp-wrap.mfp-removing.mfp-bg { opacity: 0; } .mfp-content { max-width: 500px; } .mfp-content .close-magnific { margin-top: 10px; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; filter: alpha(opacity=80); } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; border: 0; -webkit-appearance: none; display: block; outline: none; z-index: 1046; -webkit-box-shadow: none; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { background-image: url(/Paginas/osteoporose/assets/images/button_close.png); background-position: right center; background-repeat: no-repeat; background-color: transparent; height: 50px; width: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; filter: alpha(opacity=65); padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 18px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 60px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; filter: alpha(opacity=65); margin: 0; padding: 0; font-size: 30px; color: white; text-transform: uppercase; background-color: transparent; font-family: testament; border: 2px solid white !important; padding: 0.5em 1em; height: 61px; border-radius: 50px; -webkit-tap-highlight-color: transparent; bottom: 0px; } @media screen and (min-width: 1024px) { .mfp-arrow { bottom: 50%; margin-bottom: -290px; } } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0%; } @media screen and (min-width: 1024px) { .mfp-arrow-left { left: 50%; margin-left: -350px; } } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0%; } @media screen and (min-width: 1024px) { .mfp-arrow-right { right: 50%; margin-right: -350px; } } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 700px; height: 400px; } .mfp-iframe-holder .mfp-close { top: -50px; } .mfp-iframe-scaler { width: 100%; overflow: hidden; height: 100%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .mfp-ie7 .mfp-img { padding: 0; } .mfp-ie7 .mfp-bottom-bar { width: 600px; left: 50%; margin-left: -300px; margin-top: 5px; padding-bottom: 5px; } .mfp-ie7 .mfp-container { padding: 0; } .mfp-ie7 .mfp-content { padding-top: 44px; } .mfp-ie7 .mfp-close { top: 0; right: 0; padding-top: 0; } .noscroll { overflow: hidden !important; } button.mfp-close { position: fixed; } img { height: auto; } img.zoom { cursor: zoom-in; } .zoom-icon { cursor: zoom-in; font-size: 3rem; float: right; margin-bottom: -2em; margin-right: 0.5em; position: relative; color: white; top: 2vw; width: 1em; text-align: center; background: rgba(0, 0, 0, 0.3); opacity: 0.9; border-radius: 0.2em; height: 1em; line-height: 1em; } .-minusbottom { margin-bottom: 0 !important; } .-minustop { margin-top: -3% !important; } .single { margin-top: 67px; font-family: roboto-r; font-weight: 200; background-color: #ececea; overflow: hidden; } .single strong { font-weight: 400; } .single.menopausa { background-color: #ffe9ea; color: #311847; } .single.gravidez { background-color: #ffffff; } .single.endometriose { background-color: #f8fff3; color: #333333; } .single.hormonios-femininos { background-color: #ffffff; } .single.fibromialgia { background: -moz-linear-gradient(top, #fef8f2 50%, rgba(254, 248, 242, 0.98) 52%, rgba(229, 178, 101, 0.87) 63%, rgba(253, 182, 100, 0.68) 83%, rgba(0, 0, 224, 0.51) 100%); background: -webkit-linear-gradient(top, #fef8f2 50%, rgba(254, 248, 242, 0.98) 52%, rgba(229, 178, 101, 0.87) 63%, rgba(253, 182, 100, 0.68) 83%, rgba(0, 0, 224, 0.51) 100%); background: linear-gradient(to bottom, #fef8f2 50%, rgba(254, 248, 242, 0.98) 52%, rgba(229, 178, 101, 0.87) 63%, rgba(253, 182, 100, 0.68) 83%, rgba(0, 0, 224, 0.51) 100%); font-family: 'Zilla Slab', serif; font-weight: 300; } .single.depressao { background-color: #f2f2f2; font-family: 'Zilla Slab', serif; font-weight: 300; } .single.sindrome-do-ovario-policistico, .single.osteoporose, .single.infeccao-urinaria, .single.anticoncepcionais { font-family: 'Zilla Slab', serif; font-weight: 500; background-color: #ffffff; } @media screen and (max-width: 63.9375em) { .single.sindrome-do-ovario-policistico .full-img img, .single.osteoporose .full-img img, .single.infeccao-urinaria .full-img img, .single.anticoncepcionais .full-img img { min-width: 100%; } } @media screen and (max-width: 39.9375em) { .single.sindrome-do-ovario-policistico .full-img:last-child, .single.osteoporose .full-img:last-child, .single.infeccao-urinaria .full-img:last-child, .single.anticoncepcionais .full-img:last-child { margin-top: -10.5%; } } @media screen and (min-width: 64em) { .single.sindrome-do-ovario-policistico .responsive-folder, .single.osteoporose .responsive-folder, .single.infeccao-urinaria .responsive-folder, .single.anticoncepcionais .responsive-folder { margin-bottom: 0px; padding-bottom: 3%; } } .ctnr { margin: 0 auto; height: 100%; position: relative; width: 88%; } @media screen and (max-width: 39.9375em) { .ctnr { margin-bottom: 32px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .ctnr { margin-bottom: 6%; } } @media screen and (min-width: 64em) { .ctnr { width: 93%; opacity: 0; margin-bottom: 3%; } } .ctnr.-flex { display: flex; justify-content: space-between; max-width: 1020px; flex-wrap: wrap; } @media screen and (max-width: 39.9375em) { .ctnr.-flex div { margin-bottom: 3%; } } .ctnr.-flex span { background-color: #4c71a8; padding: 0.4em 2.5em; width: 100%; display: block; text-align: center; border-radius: 30px; font-weight: bold; font-size: 28px; margin-bottom: 1.5em; } .ctnr.-flex ul { list-style-type: decimal; padding: 0 3em; } .ctnr.-flex li { line-height: 1.8em; } .ctnr.-mask-footer { margin-top: -10%; } @media screen and (max-width: 39.9375em) { .ctnr.-mask-footer { margin-top: 0px; } } .ctnr.-mais-eficiente img { width: 30%; } .ctnr.-mais-eficiente img:first-child { margin-right: 2%; } @media screen and (max-width: 39.9375em) { .ctnr.-mais-eficiente img:first-child { margin-right: 0px; } } @media screen and (max-width: 39.9375em) { .ctnr.-mais-eficiente img { width: 51%; margin: 0 auto; } } .ctnr.-menos-eficiente img { width: 34%; } .ctnr.-menos-eficiente img:first-child { margin-right: 2%; } @media screen and (max-width: 39.9375em) { .ctnr.-menos-eficiente img:first-child { margin-right: 0px; } } .ctnr.-menos-eficiente img:last-child { display: block; margin: -55px auto 0; } @media screen and (max-width: 39.9375em) { .ctnr.-menos-eficiente img:last-child { display: inline-block; width: 51%; margin: 0px; } } @media screen and (max-width: 39.9375em) { .ctnr.-menos-eficiente img { width: 51%; margin: 0 auto; } } .single-title { font-family: testament; font-weight: 400; max-width: 775px; text-align: center; text-transform: uppercase; font-size: 65px; } @media screen and (min-width: 64em) { .single-title { font-size: 6.75vw; } } @media screen and (min-width: 75em) { .single-title { font-size: 5.50vw; } } @media screen and (min-width: 90em) { .single-title { font-size: 6.25vw; } } .single-title.-orange { color: #fe6b55; } .single-title.-purple { color: #a01a7d; } .single-title.-purple2 { color: #88599c; } .single-title.-palepurple { color: #ac67a3; } .single-title.-lightpurple { color: #655fe3; } .single-title.-white { color: #ffffff; } .single-title.-blue { color: #273773; } .single-title.-blue2 { color: #2f5d85; } .single-title.-babyblue { color: #4c71a8; } .single-title.-paleblue { color: #1989db; } .single-title.-vinho { color: #761a38; } .single-title.-vinho2 { color: #611420; } .single-title.-monteblack { font-family: 'Montserrat', sans-serif; font-weight: 900; font-size: 4vw; } @media screen and (max-width: 39.9375em) { .single-title.-monteblack { font-size: 7vw; } } .-laranja { background-color: darkorange; } .connect-title { font-family: testament; font-weight: 400; max-width: 1000px; text-align: center; text-transform: uppercase; position: relative; font-size: 45px; } @media screen and (min-width: 64em) { .connect-title { font-size: 4.75vw; } } @media screen and (min-width: 75em) { .connect-title { font-size: 3.50vw; } } @media screen and (min-width: 90em) { .connect-title { font-size: 4.25vw; } } .connect-title.-rounded { background-color: #e7a84d; color: white; border-radius: 50px; padding: 0.2em 0 0.1em; } .grid-topicos { display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 800px; } .grid-topicos .topico { width: 100%; display: flex; align-items: center; flex-direction: column; margin-bottom: 5%; font-size: 18px; } @media screen and (max-width: 39.9375em) { .grid-topicos .topico { margin-bottom: 14.5%; text-align: center; } } @media screen and (min-width: 40em) { .grid-topicos .topico { width: 48%; font-size: 20px; } } @media screen and (min-width: 64em) { .grid-topicos .topico { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .grid-topicos .topico { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .grid-topicos .topico { font-size: 1.25vw; } } @media screen and (max-width: 39.9375em) { .grid-topicos img { max-width: 70px; max-height: 100px; } } .grid-topicos .title { font-size: 1.4em; } .bgblock { color: white; padding-top: 5%; padding-bottom: 6%; position: relative; } @media screen and (max-width: 39.9375em) { .bgblock { margin-bottom: 32px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .bgblock { margin-bottom: 6%; } } @media screen and (min-width: 75em) { .bgblock { margin-bottom: 3%; } } .bgblock.-grdorange { background: #ed4d63; background: -moz-linear-gradient(top, #ed4d63 0%, #ef5d60 100%); background: -webkit-linear-gradient(top, #ed4d63 0%, #ef5d60 100%); background: linear-gradient(to bottom, #ed4d63 0%, #ef5d60 100%); } .bgblock.-petalas { background-color: #212959; background-size: cover; background-position: center; } .bgblock.-yellowpurple { background-position: center; background-size: cover; background: #dbb666; } @media screen and (max-width: 63.9375em) { .bgblock.-yellowpurple { background-image: none !important; } } @media screen and (min-width: 64em) { .bgblock.-yellowpurple { background: -webkit-linear-gradient(bottom left, #dbb666 0%, #a358ae 100%); background: -o-linear-gradient(bottom left, #dbb666 0%, #a358ae 100%); background: linear-gradient(to top right, #dbb666 0%, #a358ae 100%); } } .normal-p { max-width: 775px; line-height: 1.5em; font-size: 18px; } @media screen and (min-width: 40em) { .normal-p { font-size: 20px; } } @media screen and (min-width: 64em) { .normal-p { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .normal-p { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .normal-p { font-size: 1.25vw; } } .normal-p.-white { color: white; } .normal-p.-custom-sop { color: #2f6200; text-transform: uppercase; font-weight: bold; margin-bottom: 0; font-size: 5vw; } @media screen and (min-width: 64em) { .normal-p.-custom-sop { font-size: 2vw; } } @media screen and (min-width: 75em) { .normal-p.-custom-sop { font-size: 1.75vw; } } @media screen and (min-width: 90em) { .normal-p.-custom-sop { font-size: 1.50vw; } } .normal-p.-extend { max-width: 1000px; } .normal-p.-center { text-align: center; } .normal-p.-center img, .normal-p.-center span { display: inline-block; height: auto; } @media screen and (max-width: 39.9375em) { .normal-p.-center span { max-width: 100%; } } .normal-p.-italic { font-style: italic; } .normal-p.-blue { color: #467bc7; } .normal-p.-purple { color: #88599c; } .normal-p.-tit { font-size: 2em; font-weight: bold; font-family: 'Montserrat' !important; font-weight: 700 !important; } @media screen and (max-width: 39.9375em) { .normal-p.-tit { font-size: 1em; } } .normal-p .-pink { color: #bb81b8; } @media screen and (min-width: 64em) { .normal-p .-pink { font-size: 2.00vw; } } @media screen and (min-width: 75em) { .normal-p .-pink { font-size: 1.75vw; } } @media screen and (min-width: 90em) { .normal-p .-pink { font-size: 1.50vw; } } .normal-p .-pink2 { color: #fea4f7; text-decoration: underline; } @media screen and (min-width: 64em) and (max-width: 74.9375em) { .normal-p.-smallimg-medium img { width: 30%; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .normal-p.-smallimg-medium img { width: 30%; } } @media screen and (max-width: 39.9375em) { .normal-p.-smallimg img { width: 50%; } } @media screen and (max-width: 39.9375em) { .normal-p.-smallgif img { width: 70%; } } #remedio, #mascara { transform: translateX(-21%); } @media screen and (max-width: 39.9375em) { #remedio, #mascara { max-width: 50%; } } #calendar { transform: translateX(-13%); } @media screen and (max-width: 39.9375em) { #calendar { max-width: 50%; } } .full-img { margin-bottom: 3%; position: relative; } @media screen and (max-width: 39.9375em) { .full-img { overflow-x: hidden; } } .full-img img { height: auto; } @media screen and (max-width: 39.9375em) { .full-img .img-d { display: none; } } @media screen and (min-width: 40em) { .full-img .img-m { visibility: hidden; opacity: 0; height: 0; display: block; } } .addon-infec-video { padding: 0; margin: 0; margin-top: -2px; margin-bottom: -5px; background-color: #88599c; width: 100%; } .addon-infec-video > img { width: 100%; } @media (max-width: 550px) { .addon-infec-video { display: none; } } .blocked-topics { max-width: 775px; } .blocked-topics.-gradeyellowpurple span { background: #dbb666; background: -moz-linear-gradient(45deg, #dbb666 0%, #a358ae 100%); background: -webkit-linear-gradient(45deg, #dbb666 0%, #a358ae 100%); background: linear-gradient(45deg, #dbb666 0%, #a358ae 100%); } .blocked-topics.-gradegreenblue span { background: #49e05e; background: -moz-linear-gradient(45deg, #49e05e 0%, #3aadc9 100%); background: -webkit-linear-gradient(45deg, #49e05e 0%, #3aadc9 100%); background: linear-gradient(45deg, #49e05e 0%, #3aadc9 100%); } .blocked-topics span { margin-bottom: 4%; border-radius: 10px; padding: 1em 2em; display: block; width: 100%; color: white; font-weight: bold; } .two-flex-text { max-width: 1000px; display: flex; justify-content: space-between; } @media screen and (max-width: 63.9375em) { .two-flex-text { flex-direction: column-reverse; align-items: center; } } @media screen and (min-width: 40em) { .two-flex-text { flex-direction: row; } } @media screen and (max-width: 39.9375em) { .two-flex-text.-max-h100 img { max-height: 100px; } } .two-flex-text.-left-bordered { max-width: 550px; } @media screen and (min-width: 40em) { .two-flex-text.-left-bordered { flex-direction: row-reverse; } } @media screen and (min-width: 40em) { .two-flex-text.-left-bordered .img { margin-right: 10%; } } .two-flex-text.-left-bordered p { border-left: 4px solid #f15a2d; padding: 2% 0px 2% 6%; } .two-flex-text.-right-bordered { max-width: 550px; } @media screen and (min-width: 40em) { .two-flex-text.-right-bordered .img { margin-left: 10%; } } @media screen and (max-width: 39.9375em) { .two-flex-text.-right-bordered p { border-left: 4px solid #f15a2d; padding: 2% 0px 2% 6%; } } @media screen and (min-width: 40em) { .two-flex-text.-right-bordered p { text-align: right; border-right: 4px solid #f15a2d; padding: 2% 6% 2% 0px; } } .two-flex-text.-custom-osteo { flex-direction: row-reverse; max-width: 600px; align-items: center; color: #2f5d85; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-osteo { flex-direction: column-reverse; } } @media screen and (max-width: 39.9375em) and (min-width: 64em) { .two-flex-text.-custom-osteo .img { max-width: 65%; } } .two-flex-text.-custom-osteo h4 { text-transform: uppercase; margin-top: 0; margin-bottom: 1em; font-size: 18px; font-weight: 300; margin-left: 1em; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-osteo h4 { font-size: 16px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .two-flex-text.-custom-osteo h4 { font-size: 24px; } } .two-flex-text.-custom-osteo h4 strong { font-weight: 600; } .two-flex-text.-custom-infec { max-width: 600px; align-items: center; color: #3d6c8f; } @media screen and (min-width: 40em) { .two-flex-text.-custom-infec { flex-direction: row-reverse; } } @media screen and (min-width: 40em) { .two-flex-text.-custom-infec .img { margin-right: 10%; } } .two-flex-text.-custom-sop { flex-direction: row-reverse; justify-content: space-around; max-width: 600px; align-items: center; color: #2f6200; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-sop { flex-direction: column-reverse; } } @media screen and (max-width: 39.9375em) and (min-width: 64em) { .two-flex-text.-custom-sop .img { max-width: 65%; } } .two-flex-text.-custom-sop h3 { font-family: 'Montserrat', sans-serif; font-weight: 500; text-transform: uppercase; margin-top: 0; margin-bottom: 0; font-size: 1.5vw; } @media screen and (max-width: 39.9375em) { .two-flex-text.-custom-sop h3 { font-size: 6vw; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .two-flex-text.-custom-sop h3 { font-size: 3vw; } } .two-flex-text.-custom-sop span { font-size: 0.9em; } .two-flex-text.-custom-sop .-black { color: #000; font-weight: 600; } @media screen and (max-width: 39.9375em) { .two-flex-text.-large-text-column .img { width: 30%; } } @media screen and (min-width: 64em) { .two-flex-text.-large-text-column .text { width: 70%; } } .two-flex-text .img img { height: auto; } .two-flex-text .text { width: 100%; font-size: 18px; } @media screen and (min-width: 40em) { .two-flex-text .text { width: 55%; font-size: 20px; } } @media screen and (min-width: 64em) { .two-flex-text .text { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .two-flex-text .text { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .two-flex-text .text { font-size: 1.25vw; } } .two-flex-text .text.-right { text-align: right; } .two-flex-text .text.-block { background-color: white; padding: 5%; } .two-flex-text .-top { margin-bottom: 2%; } .two-flex-text .divider { max-width: 1000px; } .divider { height: 3px; max-width: 392px; } .divider.-waterblue { background-color: #a8dadc; } .divider.-yellow { background-color: #ffcc4e; } .block-citacao { line-height: 1.5em; box-shadow: -12px 12px 40px rgba(0, 0, 0, 0.18); color: white; border-radius: 20px; font-size: 18px; overflow: auto; } @media screen and (max-width: 39.9375em) { .block-citacao { padding: 16px; font-size: 20px; } } @media screen and (min-width: 40em) { .block-citacao { font-size: 20px; } } @media screen and (min-width: 64em) { .block-citacao { font-size: 1.75vw; padding: 1% 6.5%; } } @media screen and (min-width: 75em) { .block-citacao { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .block-citacao { font-size: 1.25vw; } } .block-citacao.-orange { max-width: 775px; background-color: #fe6b55; padding: 1% 6.5%; } .block-citacao.-blue { max-width: 985px; background-color: #467bc7; padding: 1% 6.5%; } .block-citacao.-cblueblack { max-width: 985px; background-color: #467bc7; padding: 1% 6.5%; } .block-citacao.-cblueblack h4 { color: #78b3ca; } .block-citacao.-cblueblack p { color: black; } .block-citacao.-cpurple { color: #9159a7; } .block-citacao.-white { max-width: 775px; background-color: #fff; padding: 1% 6.5%; } .block-citacao.-corange { color: #f15a2d; } .block-citacao.-cpink { color: #bb81b8; } .block-citacao.-cpink p { font-size: 1.2em; } .block-citacao.-pink { background-color: #fea4f7; color: #5c3968; max-width: 775px; padding: 1% 6.5%; text-align: center; } .block-citacao.-black { color: #333; } .block-citacao.-black strong { font-weight: bold; } .block-citacao.-darkblue { max-width: 985px; background-color: #273773; padding: 1% 6.5%; } .block-citacao.-bigblue { max-width: 775px; background-color: #467bc7; text-align: center; font-weight: bold; font-size: 22px; } @media screen and (min-width: 40em) { .block-citacao.-bigblue { font-size: 24px; } } @media screen and (min-width: 64em) { .block-citacao.-bigblue { font-size: 2.75vw; } } @media screen and (min-width: 75em) { .block-citacao.-bigblue { font-size: 2.50vw; } } @media screen and (min-width: 90em) { .block-citacao.-bigblue { font-size: 2.25vw; } } .block-citacao.-grdorange { background: #ef5d60; background: -moz-linear-gradient(45deg, #ef5d60 0%, #ec4067 100%); background: -webkit-linear-gradient(45deg, #ef5d60 0%, #ec4067 100%); background: linear-gradient(45deg, #ef5d60 0%, #ec4067 100%); padding: 1% 6.5%; max-width: 1014px; color: white; border-radius: 0; overflow: initial; } .block-citacao.-grdorange .border { position: absolute; border: 3px solid #ffcc4e; top: 0; bottom: 0; left: 0; right: 0; transform: translateX(15px) translateY(15px); } .block-citacao.-grdpurple { background: #5b1e7e; background: -moz-linear-gradient(45deg, #5b1e7e 0%, #9e1292 100%); background: -webkit-linear-gradient(45deg, #5b1e7e 0%, #9e1292 100%); background: linear-gradient(45deg, #5b1e7e 0%, #9e1292 100%); padding: 1% 6.5%; max-width: 1014px; color: white; border-radius: 0; overflow: initial; } .block-citacao.-grdpurple .border { position: absolute; border: 3px solid #ffcc4e; top: 0; bottom: 0; left: 0; right: 0; transform: translateX(15px) translateY(15px); } .block-citacao.-border-orange { border-left: 6px solid #f15a2d; color: #f15a2d; } .block-citacao.-mgtop { margin-top: -7%; } .citacao { max-width: 775px; line-height: 1.5em; font-size: 22px; } @media screen and (min-width: 40em) { .citacao { font-size: 24px; } } @media screen and (min-width: 64em) { .citacao { font-size: 2.75vw; } } @media screen and (min-width: 75em) { .citacao { font-size: 2.50vw; } } @media screen and (min-width: 90em) { .citacao { font-size: 2.25vw; } } .citacao p { margin: 0; } .citacao.-mcenter { text-align: center; } .citacao.-blue { color: #467bc7; } .citacao.-blue2 { color: #3d6c8f; } .citacao.-blue2 .-pink { color: #dc7bb2; font-weight: 600; } .citacao.-purple { color: #a01a7d; } .citacao.-orange { color: #e63617; } .citacao.-pink { color: #bb81b8; } @media screen and (min-width: 40em) { .citacao.-pink { font-size: 20px; } } @media screen and (min-width: 64em) { .citacao.-pink { font-size: 2.25vw; } } @media screen and (min-width: 75em) { .citacao.-pink { font-size: 2.00vw; } } @media screen and (min-width: 90em) { .citacao.-pink { font-size: 1.75vw; } } .citacao.-pink2 { color: #cc7bbc; } .citacao.-center { text-align: center; } .citacao.-compact { line-height: 1.2em; margin-top: 20px; } .citacao.-custom-sop { max-width: 600px; color: #2f6200; } .citacao.-custom-sop h3 { font-family: 'Montserrat', sans-serif; font-weight: 500; margin: 0; font-size: 0.8em; line-height: 1em; text-transform: uppercase; } .citacao .-cpurple { color: #88599c; } .feature-divider { color: #a01a7d; font-size: 24px; max-width: 775px; text-align: center; } @media screen and (min-width: 40em) { .feature-divider { font-size: 28px; } } @media screen and (min-width: 64em) { .feature-divider { font-size: 3.75vw; } } @media screen and (min-width: 75em) { .feature-divider { font-size: 3.25vw; } } @media screen and (min-width: 90em) { .feature-divider { font-size: 3vw; } } .feature-divider .divider { max-width: 1000px; } .feature-divider h4 { margin: 0.7em 0; } .block-color { max-width: 985px; padding: 3.5% 6.5% 4%; line-height: 1.5em; font-size: 18px; } @media screen and (min-width: 40em) { .block-color { font-size: 20px; } } @media screen and (min-width: 64em) { .block-color { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .block-color { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .block-color { font-size: 1.25vw; } } .block-color.-yellow { background-color: #f3d174; } .block-color.-orange { background-color: #ff5c40; color: white; } .block-color.-navy { background-color: #273773; color: white; } .block-color.-white { background-color: #f9efe4; } .block-color .-monteblack { font-size: 3vw; line-height: 1.2em; } @media screen and (max-width: 39.9375em) { .block-color .-monteblack { font-size: 6vw; } } @media screen and (max-width: 39.9375em) { .block-color.-margintop { margin-top: 20px; } } .block-color ul { list-style-type: disc; padding-left: 1em; font-weight: bold; } .topic-list { margin-bottom: 4%; max-width: 775px; } @media screen and (max-width: 39.9375em) { .topic-list { margin-bottom: 32px; } } @media screen and (min-width: 40em) and (max-width: 63.9375em) { .topic-list.-smallimgs img { width: 15%; } } @media screen and (max-width: 39.9375em) { .topic-list.-imgtop img { float: none; margin: 0 auto; } } @media screen and (max-width: 39.9375em) { .topic-list.-imgtop li { text-align: center; } } .topic-list li { display: inline-block; margin-bottom: 4%; width: 100%; } .topic-list li:last-child { margin-bottom: 0; } .topic-list img { float: left; } @media screen and (max-width: 39.9375em) { .topic-list img { float: left; max-height: 80px; width: auto; } } @media screen and (min-width: 40em) { .topic-list img { margin-right: 4%; } } .topic-list p { font-size: 18px; } @media screen and (min-width: 40em) { .topic-list p { font-size: 20px; } } @media screen and (min-width: 64em) { .topic-list p { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .topic-list p { font-size: 1.50vw; } } @media screen and (min-width: 90em) { .topic-list p { font-size: 1.25vw; } } .topic-list.-transp { color: #467bc7; } .topic-list.-transp li { line-height: 2.4em; } @media screen and (max-width: 39.9375em) { .topic-list.-transp img { margin-right: 15px; } } .topic-list.-flex { max-width: 775px; } .topic-list.-flex ul { padding: 0px; } .topic-list.-flex li { display: flex; align-items: center; } @media screen and (max-width: 39.9375em) { .topic-list.-flex li { flex-direction: column; text-align: center; } } @media screen and (min-width: 40em) { .topic-list.-flex div { width: 75%; } } @media screen and (min-width: 40em) { .topic-list.-flex .thumb { width: 25%; display: flex; margin-right: 5%; justify-content: center; } } .topic-list.-flex h3 { font-size: 2em; } @media screen and (max-width: 39.9375em) { .topic-list.-flex h3 { margin: 0.5em 0 0; } } @media screen and (min-width: 40em) { .topic-list.-flex h3 { margin: 0; } } .topic-list.-flex p { margin-bottom: 0; } @media screen and (max-width: 39.9375em) { .topic-list.-flex p { margin: 0; } } @media screen and (max-width: 39.9375em) { .topic-list.-topic-fibro { text-align: center; } } @media screen and (max-width: 39.9375em) { .topic-list.-topic-fibro img { float: none; } } .topic-list.-blue { max-width: 1218px; background-color: #467bc7; color: white; padding: 5% 19.5%; border-radius: 20px; font-size: 16px; padding-left: 7.5%; box-shadow: -12px 12px 40px rgba(0, 0, 0, 0.18); } @media screen and (max-width: 39.9375em) { .topic-list.-blue { padding: 32px; } } .topic-list.-blue li { margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .topic-list.-blue li { margin-bottom: 16px; } } .topic-list.-purple { font-size: 16px; color: purple; } @media screen and (max-width: 39.9375em) { .topic-list.-purple { padding: 32px; } } .topic-list.-purple img { width: 80px; } @media screen and (max-width: 39.9375em) { .topic-list.-purple img { float: none; } } .topic-list.-purple p { font-size: 1.4em; line-height: 15px; } @media screen and (max-width: 39.9375em) { .topic-list.-purple p { line-height: normal; } } .topic-list.-purple li { margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .topic-list.-purple li { margin-bottom: 16px; display: block; text-align: center; } } .topic-list.-black-to-list li { text-align: center; } .topic-list.-black-to-list p { font-size: 1.5vw; text-align: left; } @media screen and (max-width: 39.9375em) { .topic-list.-black-to-list p { font-size: 6.5vw; } } .topic-list.-black-to-list strong { margin-bottom: 4%; font-weight: 600; display: inline-block; } @media screen and (max-width: 39.9375em) { .topic-list.-black-to-list img { float: none; } } .topic-list.-gif { font-size: 20px; } .topic-list.-gif img { width: 200px; } @media screen and (max-width: 39.9375em) { .topic-list.-gif img { font-size: 18px; display: none; } } .topic-list.-gif .center-in-image { margin-top: 120px; } @media screen and (max-width: 39.9375em) { .topic-list.-gif .center-in-image { margin-top: 0px; } } .topic-list.-gif li { margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .topic-list.-gif li { margin-bottom: 16px; } } .double-list { max-width: 740px; display: flex; flex-wrap: wrap; justify-content: space-between; list-style-type: disc; } .double-list li { width: 42%; margin-bottom: 4%; font-size: 18px; margin-left: 5%; } @media screen and (max-width: 63.9375em) { .double-list li { width: 100%; } } .number-list { max-width: 775px; } .number-list li { display: flex; width: 100%; margin-bottom: 4%; } .number-list .nimg { margin-right: 4%; } .number-list strong { font-size: 175%; } .overlap-img { max-width: 975px; position: relative; } .overlap-img .img-ab-block { position: relative; } .overlap-img .text-block { background-color: rgba(255, 255, 255, 0.7); padding: 1em; position: absolute; bottom: 0; left: 200px; right: 0px; font-size: 230%; line-height: 1.4em; display: inline-block; } @media screen and (max-width: 63.9375em) { .overlap-img .text-block { left: 3%; font-size: 120%; } } .week-timeline { max-width: 1008px; } @media screen and (min-width: 40em) { .week-row .-onlym { display: none; } } @media screen and (max-width: 63.9375em) { .week-row .-onlyd { display: none; } } .week-half { width: 50%; float: left; } .week { text-align: center; display: flex; flex-direction: column; align-items: center; width: 100%; margin-bottom: 16%; } .week .week-title { background-color: #761a38; padding: 0.6em 2.5em; color: white; display: inline-block; border-radius: 30px; font-size: 130%; z-index: 3; } .week .week-title:before { position: absolute; width: 16px; height: 16px; border-radius: 10px; background-color: #898989; left: 49.1%; border: 1px solid white; } @media screen and (min-width: 64em) { .week .week-title:before { content: ''; } } .week .week-img { display: inline-block; z-index: 3; height: 300px; width: 300px; } @media screen and (max-width: 63.9375em) { .week .week-img { width: 60%; height: 60%; } } .week .week-text { font-size: 1em; line-height: 1.6em; z-index: 3; background-color: white; } @media screen and (max-width: 63.9375em) { .week .week-text { font-size: 1.2em; } } .author-footer { max-width: 910px; text-align: center; padding: 2% 6%; } @media screen and (max-width: 39.9375em) { .author-footer { padding: 16px; } } .author-footer.-gray { background-color: #e4e4e2; } .author-footer.-yellow { background-color: #ffd063; } .author-footer.-navy { background-color: #abcbeb; } .author-footer > .title { font-size: 20px; margin-bottom: 2%; display: inline-block; } .author-footer > ul { display: flex; justify-content: space-between; align-items: center; list-style-type: none; margin: 0; font-size: 14px; } @media screen and (max-width: 39.9375em) { .author-footer > ul { flex-direction: column; } } .author-footer > ul.-center { justify-content: center; } .author-footer > ul.-between { justify-content: space-between; } .author-footer-dois { max-width: 910px; text-align: center; padding: 2% 6%; } @media screen and (max-width: 39.9375em) { .author-footer-dois { padding: 16px; } } .author-footer-dois .title { font-size: 14px; margin-bottom: 2%; display: inline-block; } .author-footer-dois .colaboradores { font-weight: bolder; font-size: 15px; } img { display: inline-block; } .bg-depoimento { background-position: center; background-repeat: no-repeat; background-size: cover; } .bg-depoimento .ctnr { max-width: 800px; text-align: center; } .bg-depoimento .title { font-weight: bold; color: white; font-size: 1.5em; margin-bottom: 0; } .bg-depoimento .cargo { font-weight: bold; color: white; font-size: 1.5em; margin-top: 0; } .bg-depoimento .baloon { background-color: white; font-size: 1.6em; color: #454545; padding: 2em; font-style: italic; border-radius: 20px; box-shadow: 0px 8px 20px 9px #0000002e; } .bg-depoimento .img { max-width: 150px; border-radius: 200px; border: 4px solid white; box-shadow: 0 8px 20px 9px #0000002e; } .depoimento-free { max-width: 700px; text-align: center; } .depoimento-free .title { font-weight: bold; font-size: 1.3em; margin-bottom: 0; text-align: left; } .depoimento-free .baloon { font-size: 1.6em; font-style: italic; text-align: left; } .depoimento-free .img { max-width: 150px; border-radius: 200px; border: 4px solid white; margin-bottom: 25px; } .depoimento-free.-orange { color: #f15a2d; } .depoimento-free.-blue { color: #005598; } .depoimento-free.-blue2 { color: #78b3ca; } .responsive-folder { max-width: 750px; } .responsive-folder picture { text-align: center; } .qa-medico { max-width: 775px; } .qa-medico .pergunta { font-weight: bolder; margin-bottom: 5%; font-family: 'Montserrat'; font-weight: 600; color: #333; font-size: 22px; } @media screen and (min-width: 64em) { .qa-medico .pergunta { font-size: 1.75vw; } } @media screen and (min-width: 75em) { .qa-medico .pergunta { font-size: 2vw; } } @media screen and (min-width: 90em) { .qa-medico .pergunta { font-size: 1.5vw; } } .qa-medico .resposta { display: flex; justify-content: space-between; align-items: flex-start; } @media screen and (max-width: 39.9375em) { .qa-medico .resposta { flex-direction: column; } } @media screen and (min-width: 40em) { .qa-medico .conteudo { width: calc(95% - 150px); } } .qa-medico .baloon { font-size: 1.2em; color: #005598; max-width: 600px; font-style: italic; font-weight: bold; } .qa-medico .img { max-width: 150px; border-radius: 200px; } @media screen and (max-width: 39.9375em) { .qa-medico .img { margin-bottom: 24px; } } .qa-medico .title { font-weight: bold; color: #005598; font-size: 1em; margin-bottom: 0; } .absolute-ctnr { position: relative; height: 0px; display: none; } @media screen and (min-width: 75em) { .absolute-ctnr { display: block; } } .absolute-imgs { position: absolute; z-index: 1; } @media screen and (max-width: 74.9375em) { .absolute-imgs { opacity: 0; } } @media screen and (min-width: 75em) { .absolute-imgs { width: 20%; height: auto; display: block; } } @media screen and (min-width: 112.5em) { .absolute-imgs { width: auto; } } .absolute-imgs.-left { left: 0px; } .absolute-imgs.-right { right: 0px; } #rosa-e, #rosa-d { top: 36vw; } #sabao { top: 140vw; } #colhetor { top: 25vw; } #regua { top: 90vw; } #absorvente { top: 40vw; } #remedio { top: 110vw; } #toalha { top: 150vw; } #creme { top: 20vw; } #chocolate { top: 67vw; } #esteto { top: 28vw; } #esteto2 { top: 10vw; } #relogio { top: 137vw; } #ampulheta { top: -72vw; } #maca { top: 55vw; } #peso { top: 30vw; } #bola { top: -3vw; } #bebe { top: 3vw; } #frauda { top: -26vw; } #return-to-top { position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; display: block; text-decoration: none; z-index: 4; } #return-to-top path { fill: #059; } #cta-agende { position: fixed; bottom: 17px; right: 85px; display: block; text-decoration: none; z-index: 4; } @media screen and (max-width: 63.9375em) { header.topbar { position: fixed !important; background-image: url("/Paginas/osteoporose/assets/images/button_menu.png"); background-repeat: no-repeat; background-position: right 20px center; background-size: 48px; padding-right: 68px; z-index: 9999; } header.topbar.-expanded { background-image: url("/Paginas/osteoporose/assets/images/button_menu_close.png"); } header.topbar.-orange { background-color: #fe6b55; } header.topbar.-orange span { color: #fe6b55; } header.topbar.-purple { background-color: #a01a7d; } header.topbar.-purple span { color: #a01a7d; } header.topbar.-palepurple { background-color: #ac67a3; } header.topbar.-palepurple span { color: #ac67a3; } header.topbar.-lightpurple { background-color: #655fe3; } header.topbar.-lightpurple span { color: #655fe3; } header.topbar.-blue { background-color: #273773; } header.topbar.-blue span { color: #273773; } header.topbar.-babyblue { background-color: #4c71a8; } header.topbar.-babyblue span { color: #4c71a8; } header.topbar.-paleblue { background-color: #1989db; } header.topbar.-paleblue span { color: #1989db; } header.topbar.-vinho { background-color: #761a38; } header.topbar.-vinho span { color: #761a38; } } .float-mobile-menu { position: fixed; height: calc(100vh - 67px); overflow-y: scroll; top: 67px; left: 0; right: 0; font-family: roboto-r; font-weight: 200; bottom: 0; transition: 0.2s ease-out; opacity: 0; visibility: hidden; display: flex; flex-direction: column; } @media screen and (min-width: 64em) { .float-mobile-menu { display: none; } } .float-mobile-menu .title { padding-left: 1em; } .float-mobile-menu .target { display: none; text-decoration: none; align-items: center; width: 100%; background-color: white; border-bottom: 1px solid lightgray; max-height: 90px; min-height: 60px; flex-grow: 1; } .float-mobile-menu .target span { line-height: 1em; padding: 0 1em; color: #4c71a8; } .float-mobile-menu .target.voltar { font-weight: bold; margin-bottom: 40px; } .float-mobile-menu.-expanded { background-color: white !important; opacity: 1; visibility: visible; } .float-mobile-menu.-expanded .title { display: none; } .float-mobile-menu.-expanded .target { display: flex; } .float-mobile-menu.-fixed { position: fixed; top: 0px; } .float-menu { position: fixed; top: 0; bottom: 0; margin: auto; display: flex; flex-direction: column; align-items: flex-end; font-family: roboto-r; font-weight: 200; right: 1em; z-index: 9999; } @media screen and (max-width: 63.9375em) { .float-menu { display: none; } } @media screen and (max-width: 63.9375em) { .float-menu.-orange { background-color: #fe6b55; } } .float-menu.-orange span { background-color: #fe6b55; } .float-menu.-orange:after { border: 2px solid #fe6b55; } .float-menu.-orange a.active::after { background-color: #fe6b55; border-color: #ffc3ba; } @media screen and (max-width: 63.9375em) { .float-menu.-purple { background-color: #a01a7d; } } .float-menu.-purple span { background-color: #a01a7d; } .float-menu.-purple:after { border: 2px solid #a01a7d; } .float-menu.-purple a.active::after { background-color: #a01a7d; border-color: #e040b6; } @media screen and (max-width: 63.9375em) { .float-menu.-palepurple { background-color: #ac67a3; } } .float-menu.-palepurple span { background-color: #ac67a3; } .float-menu.-palepurple:after { border: 2px solid #ac67a3; } .float-menu.-palepurple a.active::after { background-color: #ac67a3; border-color: #d0a9cb; } @media screen and (max-width: 63.9375em) { .float-menu.-lightpurple { background-color: #655fe3; } } .float-menu.-lightpurple span { background-color: #655fe3; } .float-menu.-lightpurple:after { border: 2px solid #655fe3; } .float-menu.-lightpurple a.active::after { background-color: #655fe3; border-color: #b9b6f2; } @media screen and (max-width: 63.9375em) { .float-menu.-blue { background-color: #273773; } } .float-menu.-blue span { background-color: #273773; } .float-menu.-blue:after { border: 2px solid #273773; } .float-menu.-blue a.active::after { background-color: #273773; border-color: #415cbf; } @media screen and (max-width: 63.9375em) { .float-menu.-babyblue { background-color: #4c71a8; } } .float-menu.-babyblue span { background-color: #4c71a8; } .float-menu.-babyblue:after { border: 2px solid #4c71a8; } .float-menu.-babyblue a.active::after { background-color: #4c71a8; border-color: #8ea7cc; } @media screen and (max-width: 63.9375em) { .float-menu.-paleblue { background-color: #1989db; } } .float-menu.-paleblue span { background-color: #1989db; } .float-menu.-paleblue:after { border: 2px solid #1989db; } .float-menu.-paleblue a.active::after { background-color: #1989db; border-color: #6cb7ee; } @media screen and (max-width: 63.9375em) { .float-menu.-vinho { background-color: #761a38; } } .float-menu.-vinho span { background-color: #761a38; } .float-menu.-vinho:after { border: 2px solid #761a38; } .float-menu.-vinho a.active::after { background-color: #761a38; border-color: #ca2c60; } .float-menu a { padding: 1em 0.5em; border-radius: 20px; color: white; text-decoration: none; display: flex; align-items: center; position: relative; } .float-menu a span { background-color: gray; line-height: 3em; padding: 0 1em; border-radius: 50px; transform: scaleX(0) translateX(50px); transform-origin: right; opacity: 0; display: inline-block; position: absolute; white-space: pre; right: 40px; } .float-menu a:after { content: ''; background-color: white; display: inline-block; border-radius: 50px; width: 20px; height: 20px; border: 2px solid gray; margin-left: 1em; transition: all 0.2s ease-out; } .float-menu a:hover span { transition: 0.4s ease-in-out; transform: scaleX(1) translateX(0px); opacity: 1; } .topbar { position: absolute !important; } .already-visible.ctnr, .showup.ctnr { transition: all 500ms ease-in-out; transition-delay: 250ms; opacity: 1; } .painel-tratamento { max-width: 800px; position: relative; margin: 0 auto 50px; padding: 60px; } @media screen and (max-width: 39.9375em) { .painel-tratamento { max-width: 775px; padding: 20px; } } .painel-tratamento:before { content: ""; position: absolute; border: 2px solid #9159a7; top: 0; bottom: 0; left: 5%; right: 5%; border-radius: 10px; } @media screen and (max-width: 39.9375em) { .painel-tratamento:before { display: none; } } .painel-tratamento .-left, .painel-tratamento .-right { display: inline-block; width: 100%; margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .painel-tratamento .-left .imagem, .painel-tratamento .-right .imagem { text-align: center; float: none; margin-left: 0; } } .painel-tratamento .-left .imagem img, .painel-tratamento .-right .imagem img { width: 350px; z-index: 3; position: relative; } @media screen and (max-width: 39.9375em) { .painel-tratamento .-left .imagem img, .painel-tratamento .-right .imagem img { width: 200px; float: none; margin: 0; } } .painel-tratamento .-left .texto h2, .painel-tratamento .-right .texto h2 { color: purple; font-size: 30px; font-family: 'Montserrat'; font-weight: 600; text-transform: uppercase; } .painel-tratamento .-left .texto ul, .painel-tratamento .-right .texto ul { text-align: left; list-style: none; } .painel-tratamento .-left .texto li, .painel-tratamento .-right .texto li { margin: 10px; font-size: 18px; } @media screen and (min-width: 40em) { .painel-tratamento .-left .texto li, .painel-tratamento .-right .texto li { font-size: 20px; } } .painel-tratamento .-left .texto li:before, .painel-tratamento .-right .texto li:before { content: ''; width: 15px; height: 15px; background-image: url("/Paginas/osteoporose/assets/images/Shape-2.png"); background-repeat: no-repeat; display: inline-block; margin-right: 10px; vertical-align: middle; } @media screen and (min-width: 40em) { .painel-tratamento .-left .imagem { float: left; margin-left: -100px; } } .painel-tratamento .-left .imagem img { margin-right: 40px; } @media screen and (min-width: 40em) { .painel-tratamento .-right .imagem { float: right; margin-right: -100px; } } .painel-tratamento .-right .imagem img { margin-left: 40px; } .abertura-sessao { position: relative; margin-top: calc(3% + 51px); padding-top: 3%; padding-bottom: 1%; } .abertura-sessao.-ice { background-color: #f9efe4; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-ice .responsive-folder { margin-bottom: 0px; } } .abertura-sessao.-ice .full-img { margin-top: -3.5%; } .abertura-sessao.-grdblue { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#acd1da+10,f2f2f2+100 */ background: #acd1da; /* Old browsers */ background: -moz-linear-gradient(top, #acd1da 10%, #f2f2f2 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #acd1da 10%, #f2f2f2 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #acd1da 10%, #f2f2f2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#acd1da', endColorstr='#f2f2f2', GradientType=0); /* IE6-9 */ } .abertura-sessao.-ripped:before { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_ripped-top.png"); top: -51px; width: 100%; background-size: cover; height: 51px; } .abertura-sessao.-ripped2 { background-color: #f9e0c3; padding-bottom: 3%; margin-bottom: 20%; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-ripped2 { margin-bottom: 21%; } } .abertura-sessao.-ripped2:before { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_ripped-bege-top.png"); top: -51px; width: 100%; background-size: cover; height: 51px; } .abertura-sessao.-ripped2:after { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_ripped-bege-bottom.png"); bottom: -51px; width: 100%; background-size: cover; height: 51px; } .abertura-sessao.-dripped { background-color: #88599c; padding-bottom: 3%; margin-bottom: 0%; margin-top: calc(3% + 200px); } .abertura-sessao.-dripped:before { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_dripped-purple-top.png"); top: -296px; width: 100%; background-size: cover; height: 297px; } .abertura-sessao.-customsop-bg { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+11,ffffff+11,fcdad0+11,fcdad0+90,ffffff+90 */ background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 6%, #fcdad0 6%, #fcdad0 94%, #ffffff 94%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 6%, #fcdad0 6%, #fcdad0 94%, #ffffff 94%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 6%, #fcdad0 6%, #fcdad0 94%, #ffffff 94%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0); /* IE6-9 */ } .abertura-sessao.-greenpattern { background-color: #3ebcae; background-image: url("/Paginas/osteoporose/assets/images/bg_greenpattern.png"); background-repeat: repeat; margin-top: 0px !important; padding-bottom: 15%; } .abertura-sessao.-greenpattern .full-img { margin-top: -3.5%; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-greenpattern { padding-bottom: 11%; } } .abertura-sessao.-mask-footer { margin-top: 0px; padding-top: 3%; margin-top: -15%; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-mask-footer { margin-top: -3%; } } .flex-icons { display: flex; justify-content: space-between; max-width: 680px; } .flex-icons .column { width: 30%; display: flex; flex-direction: column; align-items: center; text-transform: uppercase; font-size: 1.2em; color: #2f5d85; font-family: 'Montserrat', sans-serif; } .paragrafo { text-align: left; font-size: 18px; } @media screen and (max-width: 39.9375em) { .paragrafo { font-size: 18px; } } @media screen and (min-width: 40em) { .paragrafo { font-size: 20px; } } @media screen and (min-width: 64em) { .paragrafo { font-size: 18px; } } .painel-tratamento h1 { text-align: center; font-size: 5vw; font-weight: 900; font-family: 'Montserrat'; text-transform: uppercase; margin-top: -10px; } @media screen and (max-width: 39.9375em) { .painel-tratamento h1 { font-size: 6vw; } } @media screen and (min-width: 64em) { .painel-tratamento h1 { font-size: 3.4vw; } } .block-paragrafo { color: purple; font-size: 24px; box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.1); margin-top: 70px; margin-bottom: 70px; padding: 10px; border-radius: 10px; background-color: #fff; } @media screen and (max-width: 39.9375em) { .block-paragrafo { font-size: 20px; } } .lista-tratamento { margin-bottom: 50px; } .topico-title { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 1.5em; } @media screen and (max-width: 39.9375em) { .topico-title { font-size: 1.2em; } } .topico-paragrafo { font-size: 1.2em; } @media screen and (max-width: 39.9375em) { .topico-paragrafo { font-size: 18px; } } @media screen and (min-width: 75em) { .topico-paragrafo { font-size: 20px; } } .topico-paragrafo.-purple { color: #7b4791; } #video-viewport { position: relative; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1; margin-bottom: 100px; } @media (max-width: 1025px) { #video-viewport { display: none; } } video { display: block; width: 100%; height: auto; } .fullsize-video-bg { height: 100%; overflow: hidden; z-index: 0; } #imagem-viewport-tablet img { display: none; width: 100%; height: auto; } @media only screen and (max-width: 1024px) and (min-width: 551px) { #imagem-viewport-tablet img { display: block; } } #imagem-viewport img { display: none; width: 100%; height: auto; } @media (max-width: 550px) { #imagem-viewport img { display: block; } } @media screen and (max-width: 39.9375em) { .painel-tratamento:before { display: none; } } .painel-tratamento .-left, .painel-tratamento .-right { display: inline-block; width: 100%; margin-bottom: 4%; } @media screen and (max-width: 39.9375em) { .painel-tratamento .-left .imagem, .painel-tratamento .-right .imagem { text-align: center; float: none; margin-left: 0; } } .painel-tratamento .-left .imagem img, .painel-tratamento .-right .imagem img { width: 350px; z-index: 3; position: relative; } @media screen and (max-width: 39.9375em) { .painel-tratamento .-left .imagem img, .painel-tratamento .-right .imagem img { width: 200px; float: none; margin: 0; } } .painel-tratamento .-left .texto h2, .painel-tratamento .-right .texto h2 { color: purple; font-size: 30px; font-family: 'Montserrat'; font-weight: 600; text-transform: uppercase; } .painel-tratamento .-left .texto ul, .painel-tratamento .-right .texto ul { text-align: left; list-style: none; } .painel-tratamento .-left .texto li, .painel-tratamento .-right .texto li { margin: 10px; font-size: 18px; } @media screen and (min-width: 40em) { .painel-tratamento .-left .texto li, .painel-tratamento .-right .texto li { font-size: 20px; } } .painel-tratamento .-left .texto li:before, .painel-tratamento .-right .texto li:before { content: ''; width: 15px; height: 15px; background-image: url("/Paginas/osteoporose/assets/images/Shape-2.png"); background-repeat: no-repeat; display: inline-block; margin-right: 10px; vertical-align: middle; } @media screen and (min-width: 40em) { .painel-tratamento .-left .imagem { float: left; margin-left: -100px; } } .painel-tratamento .-left .imagem img { margin-right: 40px; } @media screen and (min-width: 40em) { .painel-tratamento .-right .imagem { float: right; margin-right: -100px; } } .painel-tratamento .-right .imagem img { margin-left: 40px; } .abertura-sessao { position: relative; margin-top: calc(3% + 51px); padding-top: 3%; padding-bottom: 1%; } .abertura-sessao.-ice { background-color: #f9efe4; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-ice .responsive-folder { margin-bottom: 0px; } } .abertura-sessao.-ice .full-img { margin-top: -3.5%; } .abertura-sessao.-grdblue { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#acd1da+10,f2f2f2+100 */ background: #acd1da; /* Old browsers */ background: -moz-linear-gradient(top, #acd1da 10%, #f2f2f2 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #acd1da 10%, #f2f2f2 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #acd1da 10%, #f2f2f2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#acd1da', endColorstr='#f2f2f2', GradientType=0); /* IE6-9 */ } .abertura-sessao.-ripped:before { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_ripped-top.png"); top: -51px; width: 100%; background-size: cover; height: 51px; } .abertura-sessao.-ripped2 { background-color: #f9e0c3; padding-bottom: 3%; margin-bottom: 20%; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-ripped2 { margin-bottom: 21%; } } .abertura-sessao.-ripped2:before { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_ripped-bege-top.png"); top: -51px; width: 100%; background-size: cover; height: 51px; } .abertura-sessao.-ripped2:after { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_ripped-bege-bottom.png"); bottom: -51px; width: 100%; background-size: cover; height: 51px; } .abertura-sessao.-dripped { background-color: #88599c; padding-bottom: 3%; margin-bottom: 0%; margin-top: calc(3% + 200px); } .abertura-sessao.-dripped:before { position: absolute; content: ''; background-image: url("/Paginas/osteoporose/assets/images/bg_dripped-purple-top.png"); top: -296px; width: 100%; background-size: cover; height: 297px; } .abertura-sessao.-customsop-bg { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+11,ffffff+11,fcdad0+11,fcdad0+90,ffffff+90 */ background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 6%, #fcdad0 6%, #fcdad0 94%, #ffffff 94%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 6%, #fcdad0 6%, #fcdad0 94%, #ffffff 94%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 6%, #fcdad0 6%, #fcdad0 94%, #ffffff 94%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0); /* IE6-9 */ } .abertura-sessao.-greenpattern { background-color: #3ebcae; background-image: url("/Paginas/osteoporose/assets/images/bg_greenpattern.png"); background-repeat: repeat; margin-top: 0px !important; padding-bottom: 15%; } .abertura-sessao.-greenpattern .full-img { margin-top: -3.5%; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-greenpattern { padding-bottom: 11%; } } .abertura-sessao.-mask-footer { margin-top: 0px; padding-top: 3%; margin-top: -15%; } @media screen and (max-width: 39.9375em) { .abertura-sessao.-mask-footer { margin-top: -3%; } } .flex-icons { display: flex; justify-content: space-between; max-width: 680px; } .flex-icons .column { width: 30%; display: flex; flex-direction: column; align-items: center; text-transform: uppercase; font-size: 1.2em; color: #2f5d85; font-family: 'Montserrat', sans-serif; } .paragrafo { text-align: left; font-size: 18px; } @media screen and (max-width: 39.9375em) { .paragrafo { font-size: 18px; } } @media screen and (min-width: 40em) { .paragrafo { font-size: 20px; } } @media screen and (min-width: 64em) { .paragrafo { font-size: 18px; } } .painel-tratamento h1 { text-align: center; font-size: 5vw; font-weight: 900; font-family: 'Montserrat'; text-transform: uppercase; margin-top: -10px; } @media screen and (max-width: 39.9375em) { .painel-tratamento h1 { font-size: 6vw; } } @media screen and (min-width: 64em) { .painel-tratamento h1 { font-size: 3.4vw; } } .block-paragrafo { color: purple; font-size: 24px; box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.1); margin-top: 70px; margin-bottom: 70px; padding: 10px; border-radius: 10px; background-color: #fff; } @media screen and (max-width: 39.9375em) { .block-paragrafo { font-size: 20px; } } .lista-tratamento { margin-bottom: 50px; } .topico-title { font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 1.5em; } @media screen and (max-width: 39.9375em) { .topico-title { font-size: 1.2em; } } .topico-paragrafo { font-size: 1.2em; } @media screen and (max-width: 39.9375em) { .topico-paragrafo { font-size: 18px; } } @media screen and (min-width: 75em) { .topico-paragrafo { font-size: 20px; } } .topico-paragrafo.-purple { color: #7b4791; } #video-viewport { position: relative; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1; margin-bottom: 100px; } @media (max-width: 1025px) { #video-viewport { display: none; } } video { display: block; width: 100%; height: auto; } .fullsize-video-bg { height: 100%; overflow: hidden; z-index: 0; } #imagem-viewport-tablet img { display: none; width: 100%; height: auto; } @media only screen and (max-width: 1024px) and (min-width: 551px) { #imagem-viewport-tablet img { display: block; } } #imagem-viewport img { display: none; width: 100%; height: auto; } @media (max-width: 550px) { #imagem-viewport img { display: block; } }