/* Theme Name: Mapfre Theme URI: - Author: Plus Two Version: 1.0 License: GNU General Public License v2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html Description: Theme for Arauco Website */ .grid { list-style: none; margin: 0; padding: 0; margin-left: -25px; } .grid__item { display: inline-block; padding-left: 25px; vertical-align: top; position: relative; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .grid--rev { direction: rtl; text-align: left; } .grid--rev > .grid__item { direction: ltr; text-align: left; } .grid--full { margin-left: 0; } .grid--full > .grid__item { padding-left: 0; } .grid--right { text-align: right; } .grid--right > .grid__item { text-align: left; } .grid--center { text-align: center; } .grid--center > .grid__item { text-align: left; } .grid--middle > .grid__item { vertical-align: middle; } .grid--bottom > .grid__item { vertical-align: bottom; } .grid--narrow { margin-left: -12.5px; } .grid--narrow > .grid__item { padding-left: 12.5px; } .grid--wide { margin-left: -100px; } .grid--wide > .grid__item { padding-left: 100px; } @media only screen and (min-width: 950px) { .desk--grid--wide { margin-left: -100px; } .desk--grid--wide > .grid__item { padding-left: 100px; } } .visible { display: inline-block; } .hidden { display: none; } .one-whole { width: 100%; } .five-tenths, .four-eighths, .one-half, .six-twelfths, .three-sixths, .two-quarters { width: 50%; } .four-twelfths, .one-third, .two-sixths { width: 33.333%; } .eight-twelfths, .four-sixths, .two-thirds { width: 66.666%; } .one-quarter, .three-twelfths, .two-eighths { width: 25%; } .nine-twelfths, .six-eighths, .three-quarters { width: 75%; } .one-fifth, .two-tenths { width: 20%; } .four-tenths, .two-fifths { width: 40%; } .six-tenths, .three-fifths { width: 60%; } .eight-tenths, .four-fifths { width: 80%; } .one-sixth, .two-twelfths { width: 16.666%; } .five-sixths, .ten-twelfths { width: 83.333%; } .one-eighth { width: 12.5%; } .three-eighths { width: 37.5%; } .five-eighths { width: 62.5%; } .seven-eighths { width: 87.5%; } .one-tenth { width: 10%; } .three-tenths { width: 30%; } .seven-tenths { width: 70%; } .nine-tenths { width: 90%; } .one-twelfth { width: 8.333%; } .five-twelfths { width: 41.666%; } .seven-twelfths { width: 58.333%; } .eleven-twelfths { width: 91.666%; } @media only screen and (max-width: 680px) { .palm--visible { display: inline-block; } .palm--hidden { display: none; } .palm--one-whole { width: 100%; } .palm--five-tenths, .palm--four-eighths, .palm--one-half, .palm--six-twelfths, .palm--three-sixths, .palm--two-quarters { width: 50%; } .palm--four-twelfths, .palm--one-third, .palm--two-sixths { width: 33.333%; } .palm--eight-twelfths, .palm--four-sixths, .palm--two-thirds { width: 66.666%; } .palm--one-quarter, .palm--three-twelfths, .palm--two-eighths { width: 25%; } .palm--nine-twelfths, .palm--six-eighths, .palm--three-quarters { width: 75%; } .palm--one-fifth, .palm--two-tenths { width: 20%; } .palm--four-tenths, .palm--two-fifths { width: 40%; } .palm--six-tenths, .palm--three-fifths { width: 60%; } .palm--eight-tenths, .palm--four-fifths { width: 80%; } .palm--one-sixth, .palm--two-twelfths { width: 16.666%; } .palm--five-sixths, .palm--ten-twelfths { width: 83.333%; } .palm--one-eighth { width: 12.5%; } .palm--three-eighths { width: 37.5%; } .palm--five-eighths { width: 62.5%; } .palm--seven-eighths { width: 87.5%; } .palm--one-tenth { width: 10%; } .palm--three-tenths { width: 30%; } .palm--seven-tenths { width: 70%; } .palm--nine-tenths { width: 90%; } .palm--one-twelfth { width: 8.333%; } .palm--five-twelfths { width: 41.666%; } .palm--seven-twelfths { width: 58.333%; } .palm--eleven-twelfths { width: 91.666%; } } @media only screen and (min-width: 681px) and (max-width: 949px) { .lap--visible { display: inline-block; } .lap--hidden { display: none; } .lap--one-whole { width: 100%; } .lap--five-tenths, .lap--four-eighths, .lap--one-half, .lap--six-twelfths, .lap--three-sixths, .lap--two-quarters { width: 50%; } .lap--four-twelfths, .lap--one-third, .lap--two-sixths { width: 33.333%; } .lap--eight-twelfths, .lap--four-sixths, .lap--two-thirds { width: 66.666%; } .lap--one-quarter, .lap--three-twelfths, .lap--two-eighths { width: 25%; } .lap--nine-twelfths, .lap--six-eighths, .lap--three-quarters { width: 75%; } .lap--one-fifth, .lap--two-tenths { width: 20%; } .lap--four-tenths, .lap--two-fifths { width: 40%; } .lap--six-tenths, .lap--three-fifths { width: 60%; } .lap--eight-tenths, .lap--four-fifths { width: 80%; } .lap--one-sixth, .lap--two-twelfths { width: 16.666%; } .lap--five-sixths, .lap--ten-twelfths { width: 83.333%; } .lap--one-eighth { width: 12.5%; } .lap--three-eighths { width: 37.5%; } .lap--five-eighths { width: 62.5%; } .lap--seven-eighths { width: 87.5%; } .lap--one-tenth { width: 10%; } .lap--three-tenths { width: 30%; } .lap--seven-tenths { width: 70%; } .lap--nine-tenths { width: 90%; } .lap--one-twelfth { width: 8.333%; } .lap--five-twelfths { width: 41.666%; } .lap--seven-twelfths { width: 58.333%; } .lap--eleven-twelfths { width: 91.666%; } } @media only screen and (max-width: 949px) { .portable--visible { display: inline-block; } .portable--hidden { display: none; } .portable--one-whole { width: 100%; } .portable--five-tenths, .portable--four-eighths, .portable--one-half, .portable--six-twelfths, .portable--three-sixths, .portable--two-quarters { width: 50%; } .portable--four-twelfths, .portable--one-third, .portable--two-sixths { width: 33.333%; } .portable--eight-twelfths, .portable--four-sixths, .portable--two-thirds { width: 66.666%; } .portable--one-quarter, .portable--three-twelfths, .portable--two-eighths { width: 25%; } .portable--nine-twelfths, .portable--six-eighths, .portable--three-quarters { width: 75%; } .portable--one-fifth, .portable--two-tenths { width: 20%; } .portable--four-tenths, .portable--two-fifths { width: 40%; } .portable--six-tenths, .portable--three-fifths { width: 60%; } .portable--eight-tenths, .portable--four-fifths { width: 80%; } .portable--one-sixth, .portable--two-twelfths { width: 16.666%; } .portable--five-sixths, .portable--ten-twelfths { width: 83.333%; } .portable--one-eighth { width: 12.5%; } .portable--three-eighths { width: 37.5%; } .portable--five-eighths { width: 62.5%; } .portable--seven-eighths { width: 87.5%; } .portable--one-tenth { width: 10%; } .portable--three-tenths { width: 30%; } .portable--seven-tenths { width: 70%; } .portable--nine-tenths { width: 90%; } .portable--one-twelfth { width: 8.333%; } .portable--five-twelfths { width: 41.666%; } .portable--seven-twelfths { width: 58.333%; } .portable--eleven-twelfths { width: 91.666%; } } @media only screen and (min-width: 950px) { .desk--visible { display: inline-block; } .desk--hidden { display: none; } .desk--one-whole { width: 100%; } .desk--five-tenths, .desk--four-eighths, .desk--one-half, .desk--six-twelfths, .desk--three-sixths, .desk--two-quarters { width: 50%; } .desk--four-twelfths, .desk--one-third, .desk--two-sixths { width: 33.333%; } .desk--eight-twelfths, .desk--four-sixths, .desk--two-thirds { width: 66.666%; } .desk--one-quarter, .desk--three-twelfths, .desk--two-eighths { width: 25%; } .desk--nine-twelfths, .desk--six-eighths, .desk--three-quarters { width: 75%; } .desk--one-fifth, .desk--two-tenths { width: 20%; } .desk--four-tenths, .desk--two-fifths { width: 40%; } .desk--six-tenths, .desk--three-fifths { width: 60%; } .desk--eight-tenths, .desk--four-fifths { width: 80%; } .desk--one-sixth, .desk--two-twelfths { width: 16.666%; } .desk--five-sixths, .desk--ten-twelfths { width: 83.333%; } .desk--one-eighth { width: 12.5%; } .desk--three-eighths { width: 37.5%; } .desk--five-eighths { width: 62.5%; } .desk--seven-eighths { width: 87.5%; } .desk--one-tenth { width: 10%; } .desk--three-tenths { width: 30%; } .desk--seven-tenths { width: 70%; } .desk--nine-tenths { width: 90%; } .desk--one-twelfth { width: 8.333%; } .desk--five-twelfths { width: 41.666%; } .desk--seven-twelfths { width: 58.333%; } .desk--eleven-twelfths { width: 91.666%; } } @media only screen and (min-width: 950px) and (max-width: 1400px) { .deskstrict--visible { display: inline-block; } .deskstrict--hidden { display: none; } .deskstrict--one-whole { width: 100%; } .deskstrict--five-tenths, .deskstrict--four-eighths, .deskstrict--one-half, .deskstrict--six-twelfths, .deskstrict--three-sixths, .deskstrict--two-quarters { width: 50%; } .deskstrict--four-twelfths, .deskstrict--one-third, .deskstrict--two-sixths { width: 33.333%; } .deskstrict--eight-twelfths, .deskstrict--four-sixths, .deskstrict--two-thirds { width: 66.666%; } .deskstrict--one-quarter, .deskstrict--three-twelfths, .deskstrict--two-eighths { width: 25%; } .deskstrict--nine-twelfths, .deskstrict--six-eighths, .deskstrict--three-quarters { width: 75%; } .deskstrict--one-fifth, .deskstrict--two-tenths { width: 20%; } .deskstrict--four-tenths, .deskstrict--two-fifths { width: 40%; } .deskstrict--six-tenths, .deskstrict--three-fifths { width: 60%; } .deskstrict--eight-tenths, .deskstrict--four-fifths { width: 80%; } .deskstrict--one-sixth, .deskstrict--two-twelfths { width: 16.666%; } .deskstrict--five-sixths, .deskstrict--ten-twelfths { width: 83.333%; } .deskstrict--one-eighth { width: 12.5%; } .deskstrict--three-eighths { width: 37.5%; } .deskstrict--five-eighths { width: 62.5%; } .deskstrict--seven-eighths { width: 87.5%; } .deskstrict--one-tenth { width: 10%; } .deskstrict--three-tenths { width: 30%; } .deskstrict--seven-tenths { width: 70%; } .deskstrict--nine-tenths { width: 90%; } .deskstrict--one-twelfth { width: 8.333%; } .deskstrict--five-twelfths { width: 41.666%; } .deskstrict--seven-twelfths { width: 58.333%; } .deskstrict--eleven-twelfths { width: 91.666%; } } @media only screen and (min-width: 1400px) { .bigdesk--visible { display: inline-block; } .bigdesk--hidden { display: none; } .bigdesk--one-whole { width: 100%; } .bigdesk--five-tenths, .bigdesk--four-eighths, .bigdesk--one-half, .bigdesk--six-twelfths, .bigdesk--three-sixths, .bigdesk--two-quarters { width: 50%; } .bigdesk--four-twelfths, .bigdesk--one-third, .bigdesk--two-sixths { width: 33.333%; } .bigdesk--eight-twelfths, .bigdesk--four-sixths, .bigdesk--two-thirds { width: 66.666%; } .bigdesk--one-quarter, .bigdesk--three-twelfths, .bigdesk--two-eighths { width: 25%; } .bigdesk--nine-twelfths, .bigdesk--six-eighths, .bigdesk--three-quarters { width: 75%; } .bigdesk--one-fifth, .bigdesk--two-tenths { width: 20%; } .bigdesk--four-tenths, .bigdesk--two-fifths { width: 40%; } .bigdesk--six-tenths, .bigdesk--three-fifths { width: 60%; } .bigdesk--eight-tenths, .bigdesk--four-fifths { width: 80%; } .bigdesk--one-sixth, .bigdesk--two-twelfths { width: 16.666%; } .bigdesk--five-sixths, .bigdesk--ten-twelfths { width: 83.333%; } .bigdesk--one-eighth { width: 12.5%; } .bigdesk--three-eighths { width: 37.5%; } .bigdesk--five-eighths { width: 62.5%; } .bigdesk--seven-eighths { width: 87.5%; } .bigdesk--one-tenth { width: 10%; } .bigdesk--three-tenths { width: 30%; } .bigdesk--seven-tenths { width: 70%; } .bigdesk--nine-tenths { width: 90%; } .bigdesk--one-twelfth { width: 8.333%; } .bigdesk--five-twelfths { width: 41.666%; } .bigdesk--seven-twelfths { width: 58.333%; } .bigdesk--eleven-twelfths { width: 91.666%; } } /*! locomotive-scroll v3.4.1 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */ html.has-scroll-smooth { overflow: hidden; } html.has-scroll-dragging { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .has-scroll-smooth body { overflow: hidden; } .has-scroll-smooth [data-scroll-container] { min-height: 100vh; } .c-scrollbar { position: absolute; right: 0; top: 0; width: 6px; height: 100vh; -webkit-transform-origin: center right; transform-origin: center right; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s; background-color: #e40520; z-index: 500; opacity: 1; } .c-scrollbar:hover { -webkit-transform: scaleX(2); transform: scaleX(2); } .c-scrollbar:hover, .has-scroll-dragging .c-scrollbar, .has-scroll-scrolling .c-scrollbar { opacity: 1; } .c-scrollbar_thumb { position: absolute; top: 0; right: 0; background-color: #ffffff; opacity: 1; width: 100%; margin: 0; cursor: -webkit-grab; cursor: grab; } .has-scroll-dragging .c-scrollbar_thumb { cursor: -webkit-grabbing; cursor: grabbing; } /*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */ .pswp { display: none; position: absolute; width: 100%; height: 100%; left: 0; top: 0; overflow: hidden; -ms-touch-action: none; touch-action: none; z-index: 1500; -webkit-text-size-adjust: 100%; -webkit-backface-visibility: hidden; outline: none; } .pswp * { -webkit-box-sizing: border-box; box-sizing: border-box; } .pswp img { max-width: none; } .pswp--animate_opacity { opacity: 0.001; will-change: opacity; -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--open { display: block; } .pswp--zoom-allowed .pswp__img { cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .pswp--zoomed-in .pswp__img { cursor: -webkit-grab; cursor: -moz-grab; cursor: grab; } .pswp--dragging .pswp__img { cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: grabbing; } .pswp__bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); opacity: 0; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; will-change: opacity; } .pswp__scroll-wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; } .pswp__container, .pswp__zoom-wrap { -ms-touch-action: none; touch-action: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .pswp__container, .pswp__img { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .pswp__zoom-wrap { position: absolute; width: 100%; -webkit-transform-origin: left top; transform-origin: left top; -webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1), -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp__bg { will-change: opacity; -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--animated-in .pswp__bg, .pswp--animated-in .pswp__zoom-wrap { -webkit-transition: none; transition: none; } .pswp__container, .pswp__zoom-wrap { -webkit-backface-visibility: hidden; } .pswp__item { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; } .pswp__img { position: absolute; width: auto; height: auto; top: 0; left: 0; } .pswp__img--placeholder { -webkit-backface-visibility: hidden; } .pswp__img--placeholder--blank { background: #222; } .pswp--ie .pswp__img { width: 100% !important; height: auto !important; left: 0; top: 0; } .pswp__error-msg { position: absolute; left: 0; top: 50%; width: 100%; text-align: center; font-size: 14px; line-height: 16px; margin-top: -8px; color: #ccc; } .pswp__error-msg a { color: #ccc; text-decoration: underline; } /*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */ .pswp__button { width: 44px; height: 44px; position: relative; background: none; cursor: pointer; overflow: visible; -webkit-appearance: none; display: block; border: 0; padding: 0; margin: 0; float: right; opacity: 0.75; -webkit-transition: opacity 0.2s; transition: opacity 0.2s; -webkit-box-shadow: none; box-shadow: none; } .pswp__button:focus, .pswp__button:hover { opacity: 1; } .pswp__button:active { outline: none; opacity: 0.9; } .pswp__button::-moz-focus-inner { padding: 0; border: 0; } .pswp__ui--over-close .pswp__button--close { opacity: 1; } .pswp__button, .pswp__button--arrow--left:before, .pswp__button--arrow--right:before { background: url(assets/photoswipe/default-skin.png) 0 0 no-repeat; background-size: 264px 88px; width: 44px; height: 44px; } @media (-webkit-min-device-pixel-ratio: 1.09375), (-webkit-min-device-pixel-ratio: 1.1), (min-resolution: 1.1dppx), (min-resolution: 105dpi) { .pswp--svg .pswp__button, .pswp--svg .pswp__button--arrow--left:before, .pswp--svg .pswp__button--arrow--right:before { background-image: url(assets/photoswipe/default-skin.svg); } .pswp--svg .pswp__button--arrow--left, .pswp--svg .pswp__button--arrow--right { background: none; } } .pswp__button--close { background-position: 0 -44px; } .pswp__button--share { background-position: -44px -44px; } .pswp__button--fs { display: none; } .pswp--supports-fs .pswp__button--fs { display: block; } .pswp--fs .pswp__button--fs { background-position: -44px 0; } .pswp__button--zoom { display: none; background-position: -88px 0; } .pswp--zoom-allowed .pswp__button--zoom { display: block; } .pswp--zoomed-in .pswp__button--zoom { background-position: -132px 0; } .pswp--touch .pswp__button--arrow--left, .pswp--touch .pswp__button--arrow--right { visibility: hidden; } .pswp__button--arrow--left, .pswp__button--arrow--right { background: none; top: 50%; margin-top: -50px; width: 70px; height: 100px; position: absolute; } .pswp__button--arrow--left { left: 0; } .pswp__button--arrow--right { right: 0; } .pswp__button--arrow--left:before, .pswp__button--arrow--right:before { content: ""; top: 35px; background-color: rgba(0, 0, 0, 0.3); height: 30px; width: 32px; position: absolute; } .pswp__button--arrow--left:before { left: 6px; background-position: -138px -44px; } .pswp__button--arrow--right:before { right: 6px; background-position: -94px -44px; } .pswp__counter, .pswp__share-modal { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .pswp__share-modal { display: block; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; top: 0; left: 0; padding: 10px; position: absolute; z-index: 1600; opacity: 0; -webkit-transition: opacity 0.25s ease-out; transition: opacity 0.25s ease-out; -webkit-backface-visibility: hidden; will-change: opacity; } .pswp__share-modal--hidden { display: none; } .pswp__share-tooltip { z-index: 1620; position: absolute; background: #fff; top: 56px; border-radius: 2px; display: block; width: auto; right: 44px; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); -webkit-transform: translateY(6px); transform: translateY(6px); -webkit-transition: -webkit-transform 0.25s; transition: -webkit-transform 0.25s; transition: transform 0.25s; transition: transform 0.25s, -webkit-transform 0.25s; -webkit-backface-visibility: hidden; will-change: transform; } .pswp__share-tooltip a { display: block; padding: 8px 12px; color: #000; text-decoration: none; font-size: 14px; line-height: 18px; } .pswp__share-tooltip a:hover { text-decoration: none; color: #000; } .pswp__share-tooltip a:first-child { border-radius: 2px 2px 0 0; } .pswp__share-tooltip a:last-child { border-radius: 0 0 2px 2px; } .pswp__share-modal--fade-in { opacity: 1; } .pswp__share-modal--fade-in .pswp__share-tooltip { -webkit-transform: translateY(0); transform: translateY(0); } .pswp--touch .pswp__share-tooltip a { padding: 16px 12px; } a.pswp__share--facebook:before { content: ""; display: block; width: 0; height: 0; position: absolute; top: -12px; right: 15px; border: 6px solid transparent; border-bottom-color: #fff; -webkit-pointer-events: none; -moz-pointer-events: none; pointer-events: none; } a.pswp__share--facebook:hover { background: #3e5c9a; color: #fff; } a.pswp__share--facebook:hover:before { border-bottom-color: #3e5c9a; } a.pswp__share--twitter:hover { background: #55acee; color: #fff; } a.pswp__share--pinterest:hover { background: #ccc; color: #ce272d; } a.pswp__share--download:hover { background: #ddd; } .pswp__counter { position: absolute; left: 0; top: 0; height: 44px; font-size: 13px; line-height: 44px; color: #fff; opacity: 0.75; padding: 0 10px; } .pswp__caption { position: absolute; left: 0; bottom: 0; width: 100%; min-height: 44px; } .pswp__caption small { font-size: 11px; color: #bbb; } .pswp__caption__center { text-align: left; max-width: 420px; margin: 0 auto; font-size: 13px; padding: 10px; line-height: 20px; color: #ccc; } .pswp__caption--empty { display: none; } .pswp__caption--fake { visibility: hidden; } .pswp__preloader { width: 44px; height: 44px; position: absolute; top: 0; left: 50%; margin-left: -22px; opacity: 0; -webkit-transition: opacity 0.25s ease-out; transition: opacity 0.25s ease-out; will-change: opacity; direction: ltr; } .pswp__preloader__icn { width: 20px; height: 20px; margin: 12px; } .pswp__preloader--active { opacity: 1; } .pswp__preloader--active .pswp__preloader__icn { background: url(assets/photoswipe/preloader.gif) 0 0 no-repeat; } .pswp--css_animation .pswp__preloader--active { opacity: 1; } .pswp--css_animation .pswp__preloader--active .pswp__preloader__icn { -webkit-animation: clockwise 500ms linear infinite; animation: clockwise 500ms linear infinite; } .pswp--css_animation .pswp__preloader--active .pswp__preloader__donut { -webkit-animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; } .pswp--css_animation .pswp__preloader__icn { background: none; opacity: 0.75; width: 14px; height: 14px; position: absolute; left: 15px; top: 15px; margin: 0; } .pswp--css_animation .pswp__preloader__cut { position: relative; width: 7px; height: 14px; overflow: hidden; } .pswp--css_animation .pswp__preloader__donut { -webkit-box-sizing: border-box; box-sizing: border-box; width: 14px; height: 14px; border: 2px solid #fff; border-radius: 50%; border-left-color: transparent; border-bottom-color: transparent; position: absolute; top: 0; left: 0; background: none; margin: 0; } @media screen and (max-width: 1024px) { .pswp__preloader { position: relative; left: auto; top: auto; margin: 0; float: right; } } @-webkit-keyframes clockwise { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes clockwise { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes donut-rotate { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 50% { -webkit-transform: rotate(-140deg); transform: rotate(-140deg); } to { -webkit-transform: rotate(0); transform: rotate(0); } } @keyframes donut-rotate { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 50% { -webkit-transform: rotate(-140deg); transform: rotate(-140deg); } to { -webkit-transform: rotate(0); transform: rotate(0); } } .pswp__ui { -webkit-font-smoothing: auto; visibility: visible; opacity: 1; z-index: 1550; } .pswp__top-bar { position: absolute; left: 0; top: 0; height: 44px; width: 100%; } .pswp--has_mouse .pswp__button--arrow--left, .pswp--has_mouse .pswp__button--arrow--right, .pswp__caption, .pswp__top-bar { -webkit-backface-visibility: hidden; will-change: opacity; -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); } .pswp--has_mouse .pswp__button--arrow--left, .pswp--has_mouse .pswp__button--arrow--right { visibility: visible; } .pswp__caption, .pswp__top-bar { background-color: rgba(0, 0, 0, 0.5); } .pswp__ui--fit .pswp__caption, .pswp__ui--fit .pswp__top-bar { background-color: rgba(0, 0, 0, 0.3); } .pswp__ui--idle .pswp__top-bar { opacity: 0; } .pswp__ui--idle .pswp__button--arrow--left, .pswp__ui--idle .pswp__button--arrow--right { opacity: 0; } .pswp__ui--hidden .pswp__button--arrow--left, .pswp__ui--hidden .pswp__button--arrow--right, .pswp__ui--hidden .pswp__caption, .pswp__ui--hidden .pswp__top-bar { opacity: 0.001; } .pswp__ui--one-slide .pswp__button--arrow--left, .pswp__ui--one-slide .pswp__button--arrow--right, .pswp__ui--one-slide .pswp__counter { display: none; } .pswp__element--disabled { display: none !important; } .pswp--minimal--dark .pswp__top-bar { background: none; } a, abbr, acronym, address, applet, big, blockquote, body, button, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, html, iframe, input, ins, kbd, label, legend, li, object, ol, p, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, td, textarea, tfoot, th, thead, tr, tt, ul, var { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; padding: 0; vertical-align: top; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; outline: none; } @media only screen and (-webkit-min-device-pixel-ratio: 1.25), only screen and (-webkit-min-device-pixel-ratio: 2.0833333333333335), only screen and (min-device-pixel-ratio: 1.25), only screen and (min-resolution: 1.25dppx), only screen and (min-resolution: 200dpi) { a, abbr, acronym, address, applet, big, blockquote, body, button, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, html, iframe, input, ins, kbd, label, legend, li, object, ol, p, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, td, textarea, tfoot, th, thead, tr, tt, ul, var { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } } blockquote, body, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, img, li, p, ul { border: 0px none; margin: 0px; padding: 0px; } html { height: 100%; } body { font-family: "Aaux ProRegular", Helvetica, Arial, sans-serif; font-weight: 400; font-size: 20px; line-height: 30px; text-align: left; border: 0; color: #858389; background: #ffffff; height: 100%; } body.ready { background: #ffffff; } body.admin-bar .topheader { top: 32px; } @media only screen and (min-width: 950px) { body.admin-bar .topheader { top: 32px; } } @media only screen and (max-width: 949px) and (min-width: 681px) { body.admin-bar .topheader { top: 46px; } } @media only screen and (max-width: 680px) { #wpadminbar { position: fixed !important; } } a { text-decoration: none; border-style: none; color: #00abec; position: relative; z-index: 3; cursor: pointer; } a img { border: none; } a:hover { text-decoration: underline; border-style: none; } em { font-style: italic; } sub, sup { font-size: 14.4px; } sup { top: 5px; left: 2px; } sub { top: 18px; left: 5px; } p { padding: 0; margin: 0 0 30px 0; z-index: 1; position: relative; color: #000000; -webkit-box-sizing: border-box; box-sizing: border-box; } img { border: 0; border-style: none; max-width: 100%; height: auto; font-size: 18px; position: relative; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; } img.topreload { background-color: #544b45; opacity: 1; min-height: 360px; } @media only screen and (max-width: 680px) { img.topreload { min-height: 180px; } } img.topreload.fullwidth { min-height: 600px; } @media only screen and (max-width: 680px) { img.topreload.fullwidth { min-height: 300px; } } iframe { max-width: 100%; } dl, ol, ul { position: relative; margin: 0; padding: 0; } iframe { border: 0px; } b, strong { font-weight: bold; position: relative; font-family: "Aaux ProBold", "Aaux ProRegular", Helvetica, Arial, sans-serif; } hr { width: 100%; height: 1px; margin: 30px auto; margin-bottom: 29px; text-align: left; padding: 0; border: 0px; display: block; clear: both; position: relative; background: #858389; } hr.nomargin { margin: 0 auto; } ol, ul { margin: 0 0 30px 18px; padding: 0; } ul { list-style: none; list-style-position: outside; } @media only screen and (max-width: 949px) { ul { font-size: 18px; line-height: 28px; } } ul > li { position: relative; } ul > li:before { content: ""; display: inline-block; background-position: left top; background-repeat: no-repeat; background-size: contain; background-color: #abb8c3; width: 8px; height: 8px; position: absolute; left: -18px; top: 10px; border-radius: 3px; } ul.list-big > li { font-size: 24px; line-height: 33px; margin-bottom: 30px; } ol > li, ul > li { margin-bottom: 30px; } ul > li > ul { margin: 15px 0 0 5px; padding-bottom: 10px; } ul > li > ul > li { margin-left: 25px; padding-left: 3px; font-size: 18px; } ul > li > ul > li:before { content: "–"; top: -1px; font-weight: bold; font-size: 16px; margin-left: -0.5em; left: -8px; background-color: transparent; width: auto; height: auto; background-image: none; } ul.list-big > li > ul > li { font-size: 20px; line-height: 30px; margin-bottom: 0; } ol { list-style-position: outside; } @media only screen and (max-width: 949px) { ol { font-size: 18px; line-height: 28px; } } ol > li > ol { margin-left: 25px; } h1, h2, h3, h4, h5, h6 { font-family: "Aaux ProRegular", Helvetica, Arial, serif; font-weight: 400; margin: 0 auto 30px; padding: 0; position: relative; z-index: 2; height: auto; clear: both; } h1 b, h1 bold, h1 strong, h2 b, h2 bold, h2 strong, h3 b, h3 bold, h3 strong, h4 b, h4 bold, h4 strong, h5 b, h5 bold, h5 strong, h6 b, h6 bold, h6 strong { font-weight: bold; } h1 { font-size: 45px; line-height: 55px; margin-bottom: 60px; color: #544b45; } h2 { font-size: 35px; line-height: 45px; padding-top: 30px; font-weight: normal; color: #e40520; } h3 { font-size: 32px; line-height: 40px; font-weight: bold; padding-top: 30px; } h4 { font-size: 29px; line-height: 36px; font-weight: normal; margin-bottom: 15px; color: #e40520; } .buttonrow .button, .buttonrow .collapsable-block .collapsable-button, .buttonrow .sidemenu .menu-item a, .collapsable-block .buttonrow .collapsable-button, .sidemenu .menu-item .buttonrow a { background-color: #000 !important; } .buttonrow .button:hover, .buttonrow .collapsable-block .collapsable-button:hover, .buttonrow .sidemenu .menu-item a:hover, .collapsable-block .buttonrow .collapsable-button:hover, .sidemenu .menu-item .buttonrow a:hover { background-color: #00516f !important; } .buttonrow .button:active, .buttonrow .collapsable-block .collapsable-button:active, .buttonrow .sidemenu .menu-item a:active, .collapsable-block .buttonrow .collapsable-button:active, .sidemenu .menu-item .buttonrow a:active { background-color: #e40520 !important; } .buttonrow .button:focus, .buttonrow .collapsable-block .collapsable-button:focus, .buttonrow .sidemenu .menu-item a:focus, .collapsable-block .buttonrow .collapsable-button:focus, .sidemenu .menu-item .buttonrow a:focus { background-color: #e40520 !important; } .buttonrow .button.selected, .buttonrow .collapsable-block .selected.collapsable-button, .buttonrow .sidemenu .menu-item a.selected, .collapsable-block .buttonrow .selected.collapsable-button, .sidemenu .menu-item .buttonrow a.selected { background-color: #e40520 !important; } .button, .button a, .collapsable-block .collapsable-button, .collapsable-block .collapsable-button a, .sidemenu .menu-item a, .wp-block-button a, button, input[type="button"] { text-decoration: none; display: inline-block; background-color: #e40520; height: 48px; line-height: 48px; text-align: center; text-transform: uppercase; padding: 0 25px; color: #ffffff; font-size: 20px; font-weight: 500; position: relative; top: 0; border: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; -webkit-transform: rotate3d(0, 0, 0, 0); transform: rotate3d(0, 0, 0, 0); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; border-radius: 0 !important; } @media only screen and (max-width: 680px) { .button, .button a, .collapsable-block .collapsable-button, .collapsable-block .collapsable-button a, .sidemenu .menu-item a, .wp-block-button a, button, input[type="button"] { display: block; width: 100%; } } .button a:hover, .button:hover, .collapsable-block .collapsable-button a:hover, .collapsable-block .collapsable-button:hover, .sidemenu .menu-item a:hover, .wp-block-button a:hover, button:hover, input[type="button"]:hover { background-color: #e40520; text-decoration: none; } .button a.hollow, .button.hollow, .collapsable-block .collapsable-button a.hollow, .collapsable-block .hollow.collapsable-button, .sidemenu .menu-item a.hollow, .wp-block-button a.hollow, .wp-block-button.is-style-outline a, button.hollow, input[type="button"].hollow { background-color: transparent; border: 3px solid #abb8c3; color: #abb8c3; font-weight: 500; line-height: 46px; } .button a.hollow:after, .button.hollow:after, .collapsable-block .collapsable-button a.hollow:after, .collapsable-block .hollow.collapsable-button:after, .sidemenu .menu-item a.hollow:after, .wp-block-button a.hollow:after, .wp-block-button.is-style-outline a:after, button.hollow:after, input[type="button"].hollow:after { content: ""; width: 0%; height: 4px; position: absolute; left: 0; bottom: 0; background-color: #ffffff; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; } .button a.hollow:active:after, .button a.hollow:hover:after, .button.hollow:active:after, .button.hollow:hover:after, .collapsable-block .collapsable-button a.hollow:active:after, .collapsable-block .collapsable-button a.hollow:hover:after, .collapsable-block .hollow.collapsable-button:active:after, .collapsable-block .hollow.collapsable-button:hover:after, .sidemenu .menu-item a.hollow:active:after, .sidemenu .menu-item a.hollow:hover:after, .wp-block-button a.hollow:active:after, .wp-block-button a.hollow:hover:after, .wp-block-button.is-style-outline a:active:after, .wp-block-button.is-style-outline a:hover:after, button.hollow:active:after, button.hollow:hover:after, input[type="button"].hollow:active:after, input[type="button"].hollow:hover:after { width: 100%; } .wp-block-buttons { position: relative; } @media only screen and (max-width: 680px) { .wp-block-buttons .wp-block-button { display: block !important; width: auto; } } @media only screen and (max-width: 949px) { .wp-block-columns { display: block !important; } .wp-block-columns .wp-block-column { margin: 0 !important; } } figure { margin-left: 0; } .wp-block-image.fullwidth img { width: 100%; } figcaption { font-size: 18px; line-height: 28px; } .thumbnail-wrapper { background-color: transparent; position: relative; overflow: hidden; z-index: 0; } .thumbnail-wrapper .carouselimage, .thumbnail-wrapper .thumbnail { height: 100%; width: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; position: absolute; top: 0; left: 0; background-color: transparent; z-index: 50; } .thumbnail-wrapper .carouselimage .spinner, .thumbnail-wrapper .thumbnail .spinner { position: absolute; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; font-size: 0; color: #fff; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .thumbnail-wrapper .carouselimage .spinner > div, .thumbnail-wrapper .thumbnail .spinner > div { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; display: inline-block; float: none; background-color: currentColor; border: 0 solid currentColor; } .thumbnail-wrapper .carouselimage .spinner, .thumbnail-wrapper .thumbnail .spinner { width: 80px; height: 80px; } .thumbnail-wrapper .carouselimage .spinner > div, .thumbnail-wrapper .thumbnail .spinner > div { position: absolute; top: 0; left: 0; width: 80px; height: 80px; border-radius: 100%; opacity: 0; -webkit-animation: ball-scale-multiple 1s 0s linear infinite; animation: ball-scale-multiple 1s 0s linear infinite; } .thumbnail-wrapper .carouselimage .spinner > div:nth-child(2), .thumbnail-wrapper .thumbnail .spinner > div:nth-child(2) { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } .thumbnail-wrapper .carouselimage .spinner > div:nth-child(3), .thumbnail-wrapper .thumbnail .spinner > div:nth-child(3) { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; } @-webkit-keyframes ball-scale-multiple { 0% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } 5% { opacity: 0.75; } to { opacity: 0; -webkit-transform: scale(1); transform: scale(1); } } @keyframes ball-scale-multiple { 0% { opacity: 0; -webkit-transform: scale(0); transform: scale(0); } 5% { opacity: 0.75; } to { opacity: 0; -webkit-transform: scale(1); transform: scale(1); } } .thumbnail-wrapper .carouselimage .spinner div, .thumbnail-wrapper .thumbnail .spinner div { background-color: #ffffff; } .thumbnail-wrapper .carouselimage.loaded, .thumbnail-wrapper .thumbnail.loaded { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .thumbnail-wrapper .carouselimage.loaded .spinner, .thumbnail-wrapper .thumbnail.loaded .spinner { display: none; } .image-wrapper { position: relative; } .nopadding { padding-top: 0; padding-bottom: 0; } .nopadding-top { padding-top: 0; } .nopadding-bottom { padding-bottom: 0; } .nomargin { margin-top: 0; margin-bottom: 0; } .nomargin-top { margin-top: 0; } .nomargin-bottom { margin-bottom: 0; } .relative-container { position: relative; } .text-centered { text-align: center; } .text-right { text-align: right; } .text-inv { color: #fff; } .text-highlight { color: #abb8c3; } .text-copybigger, .text-large, p.has-large-font-size { font-size: 24px; line-height: 33px; } @media only screen and (max-width: 949px) and (min-width: 681px) { .text-copybigger, .text-large, p.has-large-font-size { font-size: 21.6px; line-height: 29.7px; } } @media only screen and (max-width: 680px) { .text-copybigger, .text-large, p.has-large-font-size { font-size: 21.6px; line-height: 29.7px; } } p.has-large-font-size { margin-bottom: 30px; } .text-copysmaller, .text-small, p.has-small-font-size { font-size: 18px; line-height: 28px; } @media only screen and (max-width: 949px) { [data-scroll-speed] { -webkit-transform: none !important; transform: none !important; } } html.has-scroll-smooth main { overflow: hidden; } html.has-scroll-smooth .main-scrollablearea { overflow: hidden; } html.has-scroll-smooth .c-scrollbar { display: block; } .c-scrollbar { display: none; } body .hide { display: none; } .hide.tab { display: none; } body.page-template-lossrecordnew .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table.is-content-justification-center.hide.tab { display: none; } .content { max-width: 1600px; margin: 0; padding: 0 40px; position: relative; width: 100%; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } @media only screen and (max-width: 680px) { .content { padding: 0 30px; } } .content.full { padding-left: 0; padding-right: 0; } .grid { height: 100%; } .grid .grid__item { height: 100%; } .main-scrollablearea { position: relative; height: auto; padding-left: 58px; padding-bottom: 90px; -webkit-box-sizing: border-box; box-sizing: border-box; } @media only screen and (min-width: 1400px) { .main-scrollablearea { padding-left: 298px; } } .main-scrollablearea.login { padding-left: 0; } .navbar { position: fixed; top: 0; left: 0; height: 100%; width: 300px; background: #abb8c3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 60px 75px 40px 30px; z-index: 100; -webkit-transform: translate(-240px, 0); transform: translate(-240px, 0); -webkit-box-sizing: border-box; box-sizing: border-box; } @media only screen and (min-width: 1400px) { .navbar { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } .navbar > * { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-sizing: border-box; box-sizing: border-box; } .navbar .logo-arauco { height: 60px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .navbar .logo-arauco svg { width: 70%; height: auto; min-width: 120px; } .navbar .toggle-navbar { position: absolute; top: 15px; width: 40px; height: 40px; left: 12.5px; -webkit-transition: margin 0.2s ease; transition: margin 0.2s ease; -webkit-transform: translate(240px, 0); transform: translate(240px, 0); } @media only screen and (min-width: 1400px) { .navbar .toggle-navbar { left: 12.5px; margin-left: -7px; -webkit-transform: translate(0, 0); transform: translate(0, 0); } } .navbar .toggle-navbar svg { width: 70%; height: auto; position: relative; left: -10px; } .navbar .toggle-navbar svg line { stroke: #e40520; } .navbar .toggle-navbar svg #burgermenu_bar1 { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-transform-origin: 100% 0%; transform-origin: 100% 0%; } .navbar .toggle-navbar svg #burgermenu_bar2 { -webkit-transition: all 0.1s ease; transition: all 0.1s ease; -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; opacity: 1; } .navbar .toggle-navbar svg #burgermenu_bar3 { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } .navbar:not(.closed) .toggle-navbar { margin-left: -15px; } .navbar:not(.closed) .toggle-navbar svg #burgermenu_bar1 { -webkit-transform: rotate(-37deg) scale(0.5, 1); transform: rotate(-37deg) scale(0.5, 1); } .navbar:not(.closed) .toggle-navbar svg #burgermenu_bar2 { opacity: 0; -webkit-transform: scale(0.1, 1); transform: scale(0.1, 1); } .navbar:not(.closed) .toggle-navbar svg #burgermenu_bar3 { -webkit-transform: rotate(34deg) scale(0.5, 1); transform: rotate(34deg) scale(0.5, 1); } .navbar.closed .toggle-navbar { margin-left: 0px; } .navbar.closed .toggle-navbar svg #burgermenu_bar1 { -webkit-transform: rotate(0deg) scale(1, 1); transform: rotate(0deg) scale(1, 1); } .navbar.closed .toggle-navbar svg #burgermenu_bar2 { opacity: 1; -webkit-transform: scale(1, 1); transform: scale(1, 1); } .navbar.closed .toggle-navbar svg #burgermenu_bar3 { -webkit-transform: rotate(0deg) scale(1, 1); transform: rotate(0deg) scale(1, 1); } .navbar .sociallinks-wrapper { margin-top: 30px; height: 90px; } @media only screen and (max-height: 850px) { .navbar .sociallinks-wrapper { margin-top: 0; } } .navbar .logo-wtw { display: block; height: 45px; width: 100%; text-align: right; margin-left: auto; -webkit-box-align: right; -ms-flex-align: right; align-items: right; } @media only screen and (min-width: 1400px) { .navbar .logo-wtw { width: 100%; } } .navbar .logo-wtw svg { width: 100%; height: auto; max-width: 140px; } .footer { position: absolute; width: 100%; bottom: 0; right: 0; text-align: right; padding-bottom: 30px; padding-left: 300px; pointer-events: none; z-index: 50; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -webkit-box-sizing: border-box; box-sizing: border-box; } .footer .catchphrase { display: inline-block; height: 60px; padding-left: 25px; padding-right: 25px; position: relative; left: 25px; background-color: #ffffff; font-size: 34px; line-height: 60px; color: #858389; } @media only screen and (max-width: 949px) { .footer .catchphrase { font-size: 3vw; } } .footer .catchphrase span { color: #e40520; } .footer .catchphrase b { font-weight: normal; font-family: "Aaux ProRegular", Helvetica, Arial, sans-serif; color: #00abec; } section { position: relative; padding-top: 60px; padding-bottom: 60px; overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; } section.maincontent { min-height: 300px; } section.hero { padding-top: 0; padding-bottom: 0; height: 240px; margin-bottom: 0; } @media only screen and (min-width: 1400px) { section.hero { margin-bottom: 60px; } } section.hero .thumbnail-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } section.hero .logo { position: absolute; right: 40px; top: 60px; height: 45px; z-index: 100; } section.hero .logo svg { height: 100%; width: auto; } section.login { height: 100%; } section.login .content { margin: 0 auto; } section.login .logo { position: absolute; left: 40px; top: 30px; height: 30px; z-index: 100; } section.login .logo svg { height: 100%; width: auto; } section.loginfooter { position: absolute; bottom: 0; left: 0; width: 100%; padding-top: 0; padding-bottom: 30px; color: #fff; text-align: center; font-size: 14.4px; line-height: 23.75px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.8); } section.loginfooter .content { margin: 0 auto; } section.loginfooter .loginfooter-upper { width: 100%; border-bottom: 1px solid #fff; margin-bottom: 30px; } section.loginfooter .loginfooter-upper p { margin-bottom: 15px; text-align: center; color: #fff; } section.loginfooter .loginfooter-lower { width: 100%; } section.loginfooter .loginfooter-lower p { margin: 0; color: #fff; } section.loginfooter .loginfooter-lower .wtwlogo { text-align: right; font-weight: bold; } section.loginfooter .loginfooter-lower .wtwlogo svg { height: 15px; width: auto; } @media only screen and (min-width: 1400px) { section.loginfooter .loginfooter-lower .wtwlogo svg { height: 18px; } } .pagetitle { position: relative; padding-left: 37.5px; width: 50%; max-width: 450px; min-height: 150px; margin: 0 0 30px 0; border-left: 2px solid #858389; } @media only screen and (min-width: 1400px) { .pagetitle { width: 40%; } } @media only screen and (max-width: 949px) { .pagetitle { width: 80%; font-size: 35px; line-height: 45px; max-width: 400px; } } .pagetitle.floating { margin-top: 60px; position: absolute; z-index: 1; } .pagetitle.wider { width: 100%; max-width: 700px; } @media only screen and (min-width: 1400px) { .pagetitle.wider { width: 60%; } } .pagetitle h1 { top: -10px; left: -6px; margin-bottom: 15px; } .pagetitle .backlink { position: relative; bottom: 0; left: 0; text-transform: uppercase; color: #858389; text-decoration: none; font-size: 20px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; } .pagetitle .backlink:before { content: "< "; position: relative; left: 0; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .pagetitle .backlink:hover:before { left: -6px; } .pagetitle .backlink.absolute { position: absolute; left: 37.5px; } .pagetitle .subtitle { color: #00abec; font-weight: bold; font-family: "Aaux ProBold", "Aaux ProRegular", Helvetica, Arial, sans-serif; font-size: 24px; line-height: 33px; margin-bottom: 30px; margin-top: -15px; text-transform: uppercase; } .button a.enter, .button.enter, .collapsable-block .collapsable-button a.enter, .collapsable-block .enter.collapsable-button, .sidemenu .menu-item a.enter, .wp-block-button a.enter, button.enter, input[type="button"].enter { background-color: #e40520; color: #ffffff; font-size: 24px; padding: 0 5%; min-width: 500px; } @media only screen and (min-width: 1400px) { .button a.enter, .button.enter, .collapsable-block .collapsable-button a.enter, .collapsable-block .enter.collapsable-button, .sidemenu .menu-item a.enter, .wp-block-button a.enter, button.enter, input[type="button"].enter { left: -140px; } } @media only screen and (max-width: 949px) and (min-width: 681px) { .button a.enter, .button.enter, .collapsable-block .collapsable-button a.enter, .collapsable-block .enter.collapsable-button, .sidemenu .menu-item a.enter, .wp-block-button a.enter, button.enter, input[type="button"].enter { font-size: 20px; min-width: 400px; } } .button a.enter:hover, .button.enter:hover, .collapsable-block .collapsable-button a.enter:hover, .collapsable-block .enter.collapsable-button:hover, .sidemenu .menu-item a.enter:hover, .wp-block-button a.enter:hover, button.enter:hover, input[type="button"].enter:hover { background-color: #e40520; color: #858389; } .button a.absolute, .button.absolute, .collapsable-block .absolute.collapsable-button, .collapsable-block .collapsable-button a.absolute, .sidemenu .menu-item a.absolute, .wp-block-button a.absolute, button.absolute, input[type="button"].absolute { position: absolute; } @media only screen and (max-width: 680px) { .button a.absolute, .button.absolute, .collapsable-block .absolute.collapsable-button, .collapsable-block .collapsable-button a.absolute, .sidemenu .menu-item a.absolute, .wp-block-button a.absolute, button.absolute, input[type="button"].absolute { width: auto; } } .button a.absolute.topright, .button.absolute.topright, .collapsable-block .absolute.topright.collapsable-button, .collapsable-block .collapsable-button a.absolute.topright, .sidemenu .menu-item a.absolute.topright, .wp-block-button a.absolute.topright, button.absolute.topright, input[type="button"].absolute.topright { top: 0; right: 40px; } .button a.absolute.topright.onmap, .button.absolute.topright.onmap, .collapsable-block .absolute.topright.onmap.collapsable-button, .collapsable-block .collapsable-button a.absolute.topright.onmap, .sidemenu .menu-item a.absolute.topright.onmap, .wp-block-button a.absolute.topright.onmap, button.absolute.topright.onmap, input[type="button"].absolute.topright.onmap { top: 60px; } .button a.withicon, .button.withicon, .collapsable-block .collapsable-button a.withicon, .collapsable-block .withicon.collapsable-button, .sidemenu .menu-item a.withicon, .wp-block-button a.withicon, button.withicon, input[type="button"].withicon { padding-left: 65px; } @media only screen and (max-width: 949px) and (min-width: 681px) { .button a.withicon, .button.withicon, .collapsable-block .collapsable-button a.withicon, .collapsable-block .withicon.collapsable-button, .sidemenu .menu-item a.withicon, .wp-block-button a.withicon, button.withicon, input[type="button"].withicon { font-size: 18px; min-width: unset; } } .button a.withicon .icon, .button.withicon .icon, .collapsable-block .collapsable-button a.withicon .icon, .collapsable-block .withicon.collapsable-button .icon, .sidemenu .menu-item a.withicon .icon, .wp-block-button a.withicon .icon, button.withicon .icon, input[type="button"].withicon .icon { display: block; position: absolute; left: 10px; top: 0; width: 45px; height: 100%; background-size: auto 60%; background-position: center 40%; background-repeat: no-repeat; } .button a.withicon .icon.download, .button a.withicon .icon.file, .button.withicon .icon.download, .button.withicon .icon.file, .collapsable-block .collapsable-button a.withicon .icon.download, .collapsable-block .collapsable-button a.withicon .icon.file, .collapsable-block .withicon.collapsable-button .icon.download, .collapsable-block .withicon.collapsable-button .icon.file, .sidemenu .menu-item a.withicon .icon.download, .sidemenu .menu-item a.withicon .icon.file, .wp-block-button a.withicon .icon.download, .wp-block-button a.withicon .icon.file, button.withicon .icon.download, button.withicon .icon.file, input[type="button"].withicon .icon.download, input[type="button"].withicon .icon.file { background-image: url(assets/svgs/icon-file.svg); } .wp-block-button { position: relative; } .welcometext { width: 100%; text-align: right; font-size: 50px; color: #e40520; padding-top: 120px; } .linkcenter { display: block; margin-top: 30px; text-align: center; width: 100%; color: #858389; } @media only screen and (min-width: 1400px) { .linkcenter { font-size: 24px; } } @media only screen and (min-width: 1400px) { .result-value span { float: right; } } .column-withline { padding-bottom: 60px; } .column-withline:before { content: ""; position: absolute; top: 0; left: 50px; height: 100%; width: 1px; background-color: #858389; } @media only screen and (max-width: 949px) and (min-width: 681px) { .column-withline:before { content: none; } } .is-style-photoswipe a { overflow: hidden; display: inline-block; } .is-style-photoswipe a:before { content: ""; position: absolute; bottom: 0; right: 0; width: 0; height: 0; border-width: 0 0 50px 50px; border-style: solid; border-color: transparent transparent rgba(133, 131, 137, 0.9) transparent; z-index: 1; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .is-style-photoswipe a:after { content: ""; position: absolute; bottom: 0; right: 0; width: 50px; height: 50px; background-image: url(assets/svgs/icon-zoom.svg); background-repeat: no-repeat; background-position: right 5px bottom 5px; background-size: 40% auto; z-index: 2; -webkit-transform: scale(1) translate(0px, 0px); transform: scale(1) translate(0px, 0px); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .is-style-photoswipe a:hover:before { opacity: 0.7; border-width: 0 0 80px 80px; } .is-style-photoswipe a:hover:after { -webkit-transform: scale(1.4) translate(-10px, -10px); transform: scale(1.4) translate(-10px, -10px); } .chart-lossrecord .label { opacity: 0; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; } .chart-lossrecord .label.visible { opacity: 1; } .chart-lossrecord .bar { -webkit-transition: all 0.15s ease; transition: all 0.15s ease; opacity: 0.8; } .chart-lossrecord .bar.highlighted { opacity: 1; } .page-background { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .page-background .thumbnail-wrapper { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #858389; } .page-background .thumbnail-wrapper .carouselimage { -webkit-transition: opacity 0.8s linear; transition: opacity 0.8s linear; } .chartcolgreen .bartotal { background-color: #257b00 !important; } .chartcollightblue .bartotal { background-color: #00abec !important; } .chartcolorange .bartotal { background-color: #ef7b00 !important; } .chartcoldarkblue .bartotal { background-color: #00516f !important; } .chartcolred .bartotal { background-color: #e40520 !important; } .ch-col:nth-child(2) .label { border-left-width: 1px; border-left-style: solid; border-left-color: #00abec; } .legend { position: relative; } .legend .legblk { color: #fff; text-align: center; min-height: 34px; width: 120px; margin: auto; display: inline-block; font-size: 14px; line-height: 120%; position: relative; padding-top: 10px; padding-bottom: 10px; } .legend .legblk .legtxt { margin: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; padding-left: 10px; padding-right: 10px; width: calc(100% - 20px); } .ch-wrap { display: table; } .ch-wrap .ch-col { display: table-cell; vertical-align: bottom; font-size: 13px; color: #000000; } .ch-wrap .ch-col.svgline { position: absolute; left: 0px; top: -2px; margin-left: 95px; z-index: 2; pointer-events: none; width: 100%; } .ch-wrap .ch-col .index { margin-bottom: 10px; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: #fff; width: 80px; } .ch-wrap .ch-col .index.lft { border-right-width: 2px; border-right-style: solid; border-right-color: #000; } .ch-wrap .ch-col .index.lft span { right: 0px; padding-right: 10px; } .ch-wrap .ch-col .index.rgt { border-left-width: 2px; border-left-style: solid; border-left-color: #000; } .ch-wrap .ch-col .index.rgt span { left: 0px; padding-left: 10px; } .ch-wrap .ch-col .index .indexpoint { font-weight: bold; vertical-align: bottom; text-align: center; margin: auto; position: relative; display: block; } .ch-wrap .ch-col .index .indexpoint span { display: block; position: absolute; top: 0px; line-height: 100%; margin-top: -5px; } .ch-wrap .ch-col .bar { margin-bottom: 10px; border-bottom-width: 2px; border-bottom-style: solid; border-bottom-color: #000000; vertical-align: bottom; } .ch-wrap .ch-col .bar .barbg { background-color: rgba(0, 81, 111, 0.1); margin-left: 1px; margin-right: 0px; vertical-align: bottom; bottom: 0px; position: relative; width: 30px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .ch-wrap .ch-col .bar a:hover .barbg { background-color: rgba(0,81,111,0.2); } .ch-wrap .ch-col .bar a:before { position:absolute; width:30px; height:100px; background-color: #e40520; content:'> Show Track'; color:#fff; writing-mode: vertical-rl; text-orientation: mixed; padding-top: 10px; margin-left: 1px; margin-top: 1px; text-transform: uppercase; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .ch-wrap .ch-col .bar a:hover:before { background-color: #000; } .ch-wrap .ch-col .bar .barbg .bartotal { background-color: #000; vertical-align: bottom; bottom: 0px; position: absolute; width: 100%; } .ch-wrap .ch-col .bar .barbg .bartotal.aline { width: 6px; height: 6px; border-radius: 6px; margin-bottom: -3px; background-color: white !important; z-index: 9; } .ch-wrap .ch-col .bar .barbg .bartotal.aline:hover { z-index: 10 !important; } .ch-wrap .ch-col .bar .barbg .bartotal:hover span { visibility: visible; z-index: 101 !important; position: absolute; } .ch-wrap .ch-col .bar .barbg .bartotal span { visibility: hidden; width: auto; background-color: black; color: #fff; text-align: center; line-height: 100%; border-radius: 5px; padding: 4px; margin: 2px; position: absolute; bottom: 0px; } .ch-wrap .ch-col .ch-legend { line-height: 110%; text-align: right; padding-right: 10px; font-weight: bold; } .ch-wrap .ch-col .label { overflow: hidden; line-height: 100%; margin: auto; text-align: center; } .ch-wrap .ch-col .label.labline { border-right-width: 1px; border-right-style: solid; border-right-color: #00abec; } .ch-wrap .ch-col .label .event { -webkit-writing-mode: tb-rl; -ms-writing-mode: tb-rl; writing-mode: tb-rl; text-align: right; vertical-align: bottom; -webkit-transform: rotate(-180deg); transform: rotate(-180deg); font-weight: bold; margin: auto; } .ch-wrap .ch-col .label .year { text-align: center; padding-top: 10px; min-height: 15px; font-size: 11px; font-weight: bold; } .table { display: table; width: 100%; margin-bottom: 25px; margin-top: 25px; border-radius: 15px; } .table .tr { clear: both; display: table-row; width: 100%; } .table .tr.head { background-color: #00516f; } .table .tr.head .td { font-weight: bold; border-bottom-color: #fff; color: #fff !important; } .table .tr.subhead { background-color: #00516f; } .table .tr.subhead .td { font-weight: bold; border-bottom-color: #fff; color: #fff !important; } .table .tr.total { background-color: #abb8c3; } .table .tr.total .td { font-weight: bold; border-bottom-color: #fff; color: #fff !important; } .table .tr.subtotal { background-color: #abb8c3; } .table .tr.subtotal .td { font-weight: bold; border-bottom-color: #fff; color: #fff !important; } .table .tr .td { display: table-cell; padding: 10px; width: 100px; border-bottom-color: #abb8c3; border-bottom-width: 1px; border-bottom-style: solid; font-size: 16px; line-height: 120%; } .table .tr .td.rgt { text-align: right; } .table .tr .td.smaller { width: 30px; } .table .tr .td.small { width: 60px; } .table .tr .td.long { width: 180px; } .table .tr .td.rhead { font-weight: bold; color: #544b45; } .mainmenu-wrapper { width: 100%; } .mainmenu-wrapper .menu-item { width: 100%; } .mainmenu-wrapper .menu-item a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; text-align: right; text-transform: uppercase; color: #fff; min-height: 37.5px; margin-bottom: 15px; line-height: 1.3; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .mainmenu-wrapper .menu-item a:hover { color: #ED1C2E; text-decoration: none; } @media only screen and (max-height: 850px) { .mainmenu-wrapper .menu-item a { min-height: 30px; } } .mainmenu-wrapper .menu-item.current-menu-item a { color: #e40520; cursor: default; } .mainmenu-wrapper .menu-item.current-menu-item a:after { content: ""; position: absolute; right: -50px; top: 50%; width: 20px; height: 4px; width: 30px; right: -75px; background-color: #e40520; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .single-area .mainmenu-wrapper #menu-item-2399 a:after { content: ""; position: absolute; right: -50px; top: 50%; width: 20px; height: 4px; width: 30px; right: -75px; background-color: #e40520; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .sociallinks-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 25px; } @media only screen and (max-width: 680px) { .sociallinks-wrapper { width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .sociallinks-wrapper .menu-item { -webkit-box-flex: 0; -ms-flex: 0 1 0px; flex: 0 1 0; position: relative; } .sociallinks-wrapper .menu-item:not(:last-child) { margin-right: 15px; } .sociallinks-wrapper .menu-item > a { display: block; width: 20px; height: 20px; padding: 10px 0; position: relative; background-repeat: no-repeat; background-position: center calc(50% - 0px); background-size: 90% auto; -webkit-box-shadow: 0 0 0 #000; box-shadow: 0 0 0 #000; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; } .sociallinks-wrapper .menu-item > a span { display: block; width: 0; height: 0; overflow: hidden; } @media only screen and (min-width: 681px) { .sociallinks-wrapper .menu-item > a:hover { background-position: center calc(50% - 6px); } } @media only screen and (max-width: 680px) { .sociallinks-wrapper .menu-item > a:active { -webkit-transform: scale(0.9); transform: scale(0.9); } } .sociallinks-wrapper .menu-item.linkedin a { background-image: url(assets/svgs/icon-linkedin.svg); } .sociallinks-wrapper .menu-item.facebook a { background-image: url(assets/svgs/icon-facebook.svg); background-size: 50% auto; } .sociallinks-wrapper .menu-item.twitter a { background-image: url(assets/svgs/icon-twitter.svg); } .sociallinks-wrapper .menu-item.instagram a { background-image: url(assets/svgs/icon-instagram.svg); } .sociallinks-wrapper .menu-item.youtube a { background-image: url(assets/svgs/icon-youtube.svg); } .sidemenu .menu-item { margin-bottom: 15px; } .sidemenu .menu-item a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 48px; width: 100%; background-color: #00516f; color: #ffffff; text-align: left; padding: 0 15px; line-height: 1.2; font-size: 18px; } @media only screen and (min-width: 1400px) { .sidemenu .menu-item a { font-size: 20px; } } .sidemenu .menu-item a:hover { background-color: #e40520; color: #ffffff; } @media only screen and (min-width: 1400px) { .sidemenu .menu-item a.withicon { padding-left: 65px; } .sidemenu .menu-item a.withicon .icon { display: block; position: absolute; left: 10px; top: 0; width: 45px; height: 100%; background-size: auto 60%; background-position: center 40%; background-repeat: no-repeat; } .sidemenu .menu-item a.withicon .icon.revenue { background-image: url(assets/svgs/icon-revenue.svg); } .sidemenu .menu-item a.withicon .icon.business { background-image: url(assets/svgs/icon-business.svg); } .sidemenu .menu-item a.withicon .icon.worldlocations { background-image: url(assets/svgs/icon-worldlocations.svg); } .sidemenu .menu-item a.withicon .icon.eco { background-image: url(assets/svgs/icon-eco.svg); } .sidemenu .menu-item a.withicon .icon.data { background-image: url(assets/svgs/icon-data.svg); } } .collapsable-block { width: 100%; } @media only screen and (min-width: 1400px) { .collapsable-block { } } .collapsable-block .collapsable-button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 48px; width: 100%; background-color: #ffffff; color: #000000; text-align: left; padding: 0 25px; line-height: 1.2; font-size: 18px; border-width: 1px; border-style: solid; border-color: #e40520; border-radius: 12px !important; } .collapsable-block .collapsable-button:after { content: "+"; position: absolute; right: 25px; top: 0; line-height: 1.1; font-weight: normal; color: #858389; font-size: 40px; -webkit-transition: color 0.15s ease; transition: color 0.15s ease; } .collapsable-block .collapsable-button:hover { color: #fff; } .collapsable-block .collapsable-button:hover:after { color: #fff; } .collapsable-block .collapsable-button.open:after { content: ""; height: 3px; width: 18px; top: 50%; background-color: #858389; } .collapsable-block .collapsable-button.open:hover:after { background-color: #fff; } .collapsable-block .collapsable-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; overflow: hidden; height: auto; padding: 0 25px; margin: 15px 0 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -webkit-box-sizing: border-box; box-sizing: border-box; } .collapsable-block .collapsable-content .collapsable-item { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; display: block; margin-bottom: 15px; font-size: 18px; line-height: 1.2; width: 100%; } @media only screen and (min-width: 1400px) { .collapsable-block .collapsable-content .collapsable-item { margin-bottom: 7.5px; } } .collapsable-block .collapsable-content .collapsable-item.link { display: block; color: #858389; text-decoration: none; } .collapsable-block .collapsable-content .collapsable-item.link:hover { color: #e40520; } .collapsable-block .collapsable-content .collapsable-item.total { font-weight: bold; font-size: 20px; } @media only screen and (min-width: 1400px) { .collapsable-block .collapsable-content .collapsable-item.total { margin-top: 7.5px; } } .collapsable-block .collapsable-content .collapsable-item span { display: block; } @media only screen and (min-width: 1400px) { .collapsable-block .collapsable-content .collapsable-item span { float: right; padding: 0; } } .collapsable-block .collapsable-content .collapsable-item:last-child { margin-bottom: 30px; } .list-simple { width: 100%; margin: 0 0 30px 0; } .list-simple .list-item { display: block; color: inherit; text-decoration: none; font-size: 29px; line-height: 36px; margin: 0 0 15px 0; width: 100%; } @media only screen and (min-width: 1400px) { .list-simple .list-item { font-size: 29px; line-height: 36px; } } .list-simple .list-item.selected { color: #00abec; font-weight: bold; } .list-simple .list-item span { float: right; } .list-simple .list-item#listareas-item-2474 { display: none; } .list-simple .list-item#listareas-item-2476 { display: none; } .list-simple a.list-item { cursor: default; } .list-simple a.list-item:not(.selected):hover { cursor: pointer; color: #e40520; } .list-simple a.list-item:hover { color: #e40520; } .list-simple.bigger .list-item { font-size: 32px; line-height: 40px; font-weight: bold; } @media only screen and (min-width: 1400px) { .list-simple.bigger .list-item { font-size: 35px; line-height: 45px; font-weight: bold; } } .list-anchorlinks { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .list-anchorlinks .list-item { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; margin-right: 12.5px; margin-bottom: 30px; text-decoration: none; border: 2px solid #e40520; color: #858389; padding: 12.5px; text-transform: uppercase; line-height: 1; font-size: 16px; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; } .list-anchorlinks .list-item:hover { text-decoration: none; background-color: #e40520; color: #fff; } .list-files { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 90%; margin: 0 auto 30px; } @media only screen and (min-width: 1400px) { .list-files { max-width: 90%; } } @media only screen and (max-width: 949px) { .list-files { max-width: 100%; } } .list-files .list-item { display: block; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 160px; height: 160px; margin: 0 25px 30px 0; text-align: center; line-height: 1.2; text-decoration: none; font-size: 18px; color: #858389; } @media only screen and (max-width: 949px) and (min-width: 681px) { .list-files .list-item { width: calc(33% - 25px); } } @media only screen and (max-width: 680px) { .list-files .list-item { width: calc(50% - 25px); } } .list-files .list-item:before { content: ""; width: 100%; height: 80px; display: block; margin-bottom: 10px; background-image: url(assets/svgs/icon-file2.svg); background-position: center center; background-size: contain; background-repeat: no-repeat; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-transform: scale(1); transform: scale(1); } .list-files .list-item:hover { text-decoration: none; } .list-files .list-item:hover:before { -webkit-transform: scale(1.1); transform: scale(1.1); } .graphdownloads { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media only screen and (min-width: 950px) { .graphdownloads { min-height: 840px; } } @media only screen and (max-width: 949px) { .graphdownloads { margin-top: 60px; } } .graphdownloads .list-files { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .graphdownloads .list-files .list-item { width: 100px; height: auto; margin: 0 0 30px 0; } @media only screen and (max-width: 949px) and (min-width: 681px) { .graphdownloads .list-files .list-item { width: 100px; } } @media only screen and (max-width: 680px) { .graphdownloads .list-files .list-item { width: 100px; } } .graphdownloads .list-files .list-item:before { width: 80%; height: 60px; } .legend, .legend-floating { min-width: 180px; display: block; padding: 15px 12.5px 15px 12.5px; margin-bottom: 30px; z-index: 50; -webkit-box-sizing: border-box; box-sizing: border-box; } .legend a, .legend-floating a { color: #fff; } @media only screen and (min-width: 1400px) { .legend, .legend-floating { padding: 15px 12.5px 15px 12.5px; } } .legend .download-item, .legend-floating .download-item { display: block; } .legend .download-item .icon.download, .legend-floating .download-item .icon.download { width: 45px; height: 45px; display: inline-block; vertical-align: middle; background-size: auto 60%; background-position: center 40%; background-repeat: no-repeat; background-image: url(assets/svgs/icon-file.svg); } .legend .legend-item .coltog, .legend-floating .legend-item .coltog { background-color: #00516f; width: 60px; height: 15px; display: inline-block; border-radius: 5px; vertical-align: middle; margin-right: 10px; margin-top: 3px; float: right; } .legend .legend-item.all .coltog, .legend-floating .legend-item.all .coltog { background-color: #276a81; } .legend .legend-item .coltog .togitem, .legend-floating .legend-item .coltog .togitem { height: 15px; width: 15px; display: block; float: left; border-radius: 5px; vertical-align: middle; } .legend .legend-item.riu .coltog .togitem, .legend-floating .legend-item.riu .coltog .togitem { background-color: navy; } .legend .legend-item.exe .coltog .togitem, .legend-floating .legend-item.exe .coltog .togitem { background-color: teal; } .legend .legend-item.gru .coltog .togitem, .legend-floating .legend-item.gru .coltog .togitem { background-color: aqua; } .legend .legend-item.ibe .coltog .togitem, .legend-floating .legend-item.ibe .coltog .togitem { background-color: orange; } .legend .legend-item.sol .coltog .togitem, .legend-floating .legend-item.sol .coltog .togitem { background-color: green; } .legend .legend-item.sen .coltog .togitem, .legend-floating .legend-item.sen .coltog .togitem { background-color: red; } .legend .legend-item.aro .coltog .togitem, .legend-floating .legend-item.aro .coltog .togitem { background-color: blue; } .legend .legend-item.fuej .coltog .togitem, .legend-floating .legend-item.fuej .coltog .togitem { background-color: indigo; } .legend .legend-item.fuem .coltog .togitem, .legend-floating .legend-item.fuem .coltog .togitem { background-color: violet; } .legend .legend-item.lop .coltog .togitem, .legend-floating .legend-item.lop .coltog .togitem { background-color: darkred; } .legend .legend-item.mart .coltog .togitem, .legend-floating .legend-item.mart .coltog .togitem { background-color: black; } .legend .legend-item.ohl .coltog .togitem, .legend-floating .legend-item.ohl .coltog .togitem { background-color: olive; } .legend .legend-item.prid .coltog .togitem, .legend-floating .legend-item.prid .coltog .togitem { background-color: purple; } .legend .legend-item.prim .coltog .togitem, .legend-floating .legend-item.prim .coltog .togitem { background-color: purple; } .legend .legend-item.sir .coltog .togitem, .legend-floating .legend-item.sir .coltog .togitem { background-color: brown; } .legend .legend-item.val .coltog .togitem, .legend-floating .legend-item.val .coltog .togitem { background-color: pink; } .legend .legend-item, .legend-floating .legend-item { display: block; margin-bottom: 7.5px; font-size: 18px; line-height: 1.3; text-transform: uppercase; position: relative; color: #858389; } @media only screen and (min-width: 1400px) { .legend .legend-item, .legend-floating .legend-item { font-size: 18px; } } .legend .legend-item .icon, .legend-floating .legend-item .icon { position: absolute; left: 15px; top: 0; height: 100%; width: 30px; } .legend .legend-foot, .legend-floating .legend-foot { margin-top: 25px; display: block; font-size: 13px; line-height: 1.3; } #legend-locationtypes { top: 0; right: 0; max-width: 250px; background-color: #276a81; color: #fff; } #legend-locationtypes .legend-item { padding-left: 10px; font-size: 16px; margin-bottom: 30px 0.5; padding-left: 0px; } #legend-areas { top: 160px; left: 0; max-width: 250px; background-color: #e40520; color: #fff; } #legend-areas .legend-item { padding-left: 10px; } .legend-floating { position: absolute; width: 23%; height: auto; } @media only screen and (min-width: 1400px) { .legend-floating { width: 24%; max-width: 250px; } } .legend-floating .legend-item { padding-left: 10px; } @media only screen and (min-width: 1400px) { .legend-floating .legend-item { padding-left: 0px; } } .legend-floating .legend-item.selected { color: #858389; } .legend-floating a.legend-item { color: #fff; text-decoration: none; vertical-align: middle; } .legend-floating a.legend-item:hover { color: #00abec; } .legend-floating a.legend-item.selected { pointer-events: none; } form.login .field { display: block; position: relative; margin: 0 auto 30px; width: 80%; -webkit-box-sizing: border-box; box-sizing: border-box; } form.login .field input { display: block; height: 60px; width: 100%; padding: 5px 5px 5px 60px; color: #fff; background: transparent; border: 2px solid #fff; -webkit-box-sizing: border-box; box-sizing: border-box; } form.login .field input::-webkit-input-placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input::-moz-placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input:-ms-input-placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input::-ms-input-placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input::placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input:-ms-input-placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input::-ms-input-placeholder { color: #fff; opacity: 0.5; text-transform: uppercase; } form.login .field input:-webkit-autofill, form.login .field input:-webkit-autofill:active, form.login .field input:-webkit-autofill:focus, form.login .field input:-webkit-autofill:hover, form.login .field input:active, form.login .field input:focus, form.login .field input:hover { background: transparent; border: 2px solid #fff; -webkit-transition: background-color 5000s; transition: background-color 5000s; -webkit-text-fill-color: #fff !important; } form.login .field:before { content: ""; position: absolute; left: 25px; top: 6px; z-index: 100; width: 75px; height: 48px; background-position: left center; background-size: auto 42%; background-repeat: no-repeat; } form.login .field.username:before { background-image: url(assets/svgs/field-user.svg); } form.login .field.password:before { background-image: url(assets/svgs/field-password.svg); } form.login input[type="submit"] { display: block; width: 80%; height: 60px; margin: 0 auto 30px; background-color: #e40520; color: #fff; text-align: center; text-transform: uppercase; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } form.login input[type="submit"]:hover { background-color: #e40520; } .formLinks { font-size: 18px; text-align: center; color: #fff; } .formLinks a { color: #fff; } .formResponse { background: #ffffff; color: #00abec; margin-bottom: 15px; font-size: 18px; line-height: 28px; } .loginbox { position: absolute; top: 50%; left: 50%; width: 40%; height: auto; min-width: 400px; max-width: 500px; padding: 30px 25px; background-color: rgba(38, 38, 38, 0.6); text-align: center; color: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .loginbox h1, .loginbox h2 { padding-top: 0; color: #fff; margin: 0; } .loginbox h3, .loginbox p { padding-top: 0; color: #fff; } body.area-template-default .footer, body.page-template-locations .footer { background: transparent; } body.area-template-default .footer .catchphrase, body.page-template-locations .footer .catchphrase { background-color: #858389; color: #fff; } body.area-template-default .pagetitle h1 { text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6); } .areamap { background-color: #00516f; padding-top: 0; padding-bottom: 0; height: calc(100% + 90px); min-height: 800px; z-index: 20; overflow: hidden; } .areamap .pagetitle a, .areamap .pagetitle h1 { color: #fff; } .areamap svg#areamap { position: absolute; top: -30px; left: 0; height: calc(100% + 30px); width: 100%; } .areamap svg#areamap text { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; } .areamap svg#areamap #riu .circle { fill: navy; } .areamap svg#areamap #exc .circle { fill: teal; } .areamap svg#areamap #gru .circle { fill: aqua; } .areamap svg#areamap #ibe .circle { fill: orange; } .areamap svg#areamap #sol .circle { fill: green; } .areamap svg#areamap #sen .circle { fill: red; } .areamap svg#areamap #aro .circle { fill: blue; } .areamap svg#areamap #fuej .circle { fill: indigo; } .areamap svg#areamap #fuem .circle { fill: violet; } .areamap svg#areamap #lop .circle { fill: darkred; } .areamap svg#areamap #mar .circle { fill: black; } .areamap svg#areamap #ohl .circle { fill: olive; } .areamap svg#areamap #prid .circle { fill: purple; } .areamap svg#areamap #prim .circle { fill: purple; } .areamap svg#areamap #sir .circle { fill: brown; } .areamap svg#areamap #val .circle { fill: pink; } .areamap svg#areamap .maplabel { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; } .areamap svg#areamap .maplabel.clickable { cursor: pointer; } .areamap svg#areamap .maplabel.clickable:hover .rectangle, .areamap svg#areamap .maplabel.clickable:hover .triangle { fill: #e40520; } .areamap svg#areamap .maplabel.clickable:hover .circle { fill: #1fabec !important; } .areamap svg#areamap .maplabel.clickable:hover .mapcountry path { fill: #1fabec; } .areamap svg#areamap .maplabel.clickable:hover .labeltext { fill: #1fabec; } .areamap svg#areamap .maplabel.playa { display: block; } .areamap svg#areamap .maplabel .circle, .areamap svg#areamap .maplabel .rectangle, .areamap svg#areamap .maplabel .triangle { -webkit-transition: all 0.15s ease; transition: all 0.15s ease; } .map { background-color: #00516f; padding-top: 0; padding-bottom: 0; height: calc(100% + 90px); z-index: 20; overflow: hidden; background-image: url(assets/svgs/map-locations-full.svg); background-repeat: no-repeat; background-position: 0px -140px; background-size: 1400px auto; } @media only screen and (min-width: 1400px) { .map { background-size: 1900px auto; } } @media only screen and (min-width: 1650px) { .map { background-size: 2230px auto; } } .map .pagetitle.floating { margin-left: 40px; border-left: 2px solid #fff; } .map .pagetitle.floating h1 { color: #fff; } .map .content { padding-left: 0; padding-right: 0px !important; max-width: 100%; } .map svg#worldmap { height: 100%; width: auto; max-width: 160%; min-width: 1400px; } .map svg#worldmap #areasmap { -webkit-filter: url(#dropshadow); filter: url(#dropshadow); } .map svg#worldmap .clickablearea { cursor: pointer; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .map svg#worldmap .clickablearea:hover { fill: #00abec !important; } .map svg#overviewmap { height: 100%; width: auto; } .map .maplabels { position: absolute; width: 100%; height: 100%; z-index: 40; pointer-events: none; } .map .maplabels #maplabel-total { bottom: 50px; left: 50px; width: auto; height: auto; text-align: left; } .map .maplabels #maplabel-total .loctitle { position: relative; top: auto; left: auto; -webkit-transform: none; transform: none; } .map .maplabels #maplabel-mexpac { top: 78px; left: 12px; } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-mexpac { top: 158px; left: 17px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-mexpac { top: 210px; left: 20px; } } .map .maplabels #maplabel-mexpac:hover .loccircle { background-color: rgba(0, 162, 27, 0.75); } .map .maplabels #maplabel-mexpac .loccircle { width: 125px; height: 125px; background-color: rgba(0, 162, 27, 0.5); } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-mexpac .loccircle { width: 170px; height: 170px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-mexpac .loccircle { width: 200px; height: 200px; } } .map .maplabels #maplabel-mexyuc { top: 110px; left: 342px; width: 250px; height: 250px; } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-mexyuc { top: 200px; left: 468px; width: 340px; height: 340px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-mexyuc { top: 260px; left: 550px; width: 400px; height: 400px; } } .map .maplabels #maplabel-mexyuc:hover .loccircle { background-color: rgba(0, 162, 27, 0.75); } .map .maplabels #maplabel-mexyuc .loccircle { width: 250px; height: 250px; background-color: rgba(0, 162, 27, 0.5); } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-mexyuc .loccircle { width: 340px; height: 340px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-mexyuc .loccircle { width: 400px; height: 400px; } } .map .maplabels #maplabel-usa { top: 10px; left: 525px; } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-usa { top: 64px; left: 714px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-usa { top: 100px; left: 840px; } } .map .maplabels #maplabel-usa:hover .loccircle { background-color: rgba(72, 193, 239, 0.75); } .map .maplabels #maplabel-usa .loccircle { width: 50px; height: 50px; background-color: rgba(72, 193, 239, 0.5); } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-usa .loccircle { width: 68px; height: 68px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-usa .loccircle { width: 80px; height: 80px; } } .map .maplabels #maplabel-jam { top: 216px; left: 568px; } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-jam { top: 344px; left: 773px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-jam { top: 430px; left: 910px; } } .map .maplabels #maplabel-jam:hover .loccircle { background-color: rgba(72, 193, 239, 0.75); } .map .maplabels #maplabel-jam .loccircle { width: 150px; height: 150px; background-color: rgba(72, 193, 239, 0.5); } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-jam .loccircle { width: 204px; height: 204px; background-color: rgba(72, 193, 239, 0.5); } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-jam .loccircle { width: 240px; height: 240px; background-color: rgba(72, 193, 239, 0.5); } } .map .maplabels #maplabel-bah { top: 96px; left: 600px; } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-bah { top: 183px; left: 816px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-bah { top: 240px; left: 960px; } } .map .maplabels #maplabel-bah:hover .loccircle { background-color: rgba(239, 123, 0, 0.75); } .map .maplabels #maplabel-bah .loccircle { width: 50px; height: 50px; background-color: rgba(239, 123, 0, 0.5); } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-bah .loccircle { width: 64px; height: 64px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-bah .loccircle { width: 75px; height: 75px; } } .map .maplabels #maplabel-dom { top: 210px; left: 700px; } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-dom { top: 336px; left: 952px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-dom { top: 420px; left: 1120px; } } .map .maplabels #maplabel-dom:hover .loccircle { background-color: rgba(12, 245, 180, 0.75); } .map .maplabels #maplabel-dom .loccircle { width: 155px; height: 155px; background-color: rgba(12, 245, 180, 0.5); } @media only screen and (min-width: 1400px) { .map .maplabels #maplabel-dom .loccircle { width: 212px; height: 212px; } } @media only screen and (min-width: 1650px) { .map .maplabels #maplabel-dom .loccircle { width: 250px; height: 250px; } } .map .maplabels .locationlabel { position: absolute; width: 188px; height: 188px; text-align: center; pointer-events: all; z-index: 10; } @media only screen and (min-width: 1400px) { .map .maplabels .locationlabel { width: 255px; height: 255px; } } @media only screen and (min-width: 1650px) { .map .maplabels .locationlabel { width: 300px; height: 300px; } } .map .maplabels .loctitle { padding: 0px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 11; font-weight: bold; font-size: 24px; line-height: 120%; color: #ffffff; width: 100%; text-shadow: 0px 5px 5px rgba(0, 0, 0, 0.4); } .map .maplabels .loctitle .subt { font-weight: normal; font-size: 18px; padding-left: 0px; } @media only screen and (min-width: 1400px) { .map .maplabels .loctitle { font-size: 35px; } } @media only screen and (min-width: 1650px) { .map .maplabels .loctitle { font-size: 35px; } } .map .maplabels .loccircle { padding: 0px; position: absolute; border-radius: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 10; } .map .maplabels a.maplabel { text-decoration: none; color: #ffffff; } .map .maplabels span { display: block; padding-left: 12.5px; } @media only screen and (min-width: 1400px) { .map .maplabels span { padding-left: 50px; } } .map .maplabels span sup { font-size: 11px; top: 10px; } .map .maplabels .title { text-transform: uppercase; font-weight: bold; font-size: 18px; } @media only screen and (min-width: 1400px) { .map .maplabels .title { font-size: 20px; } } .map .maplabels .icon { display: none; position: absolute; top: 12.5px; left: -37.5px; width: 31.25px; } @media only screen and (min-width: 1400px) { .map .maplabels .icon { display: block; } } .map .maplabels .icon svg { width: 100%; height: auto; } .map .maplabels .locations, .map .maplabels .value { font-size: 16px; } @media only screen and (min-width: 1400px) { .map .maplabels .locations, .map .maplabels .value { font-size: 18px; } } .map .maplabels .totalvalue { font-weight: bold; } .locationimage-wrapper { height: 300px; margin-bottom: 30px; } .locationimage-wrapper .thumbnail-wrapper { height: 100%; } .locationcontent-wrapper { max-width: 550px; } .locationcontent-wrapper h3, .locationcontent-wrapper h4, .locationcontent-wrapper p { color: #000000; } .locationcontent-wrapper h3 { padding-top: 0px; } .collapsable-block .locationbuttons-wrapper .collapsable-button, .locationbuttons-wrapper .button, .locationbuttons-wrapper .collapsable-block .collapsable-button, .locationbuttons-wrapper .sidemenu .menu-item a, .locationbuttons-wrapper button, .sidemenu .menu-item .locationbuttons-wrapper a { width: 100%; margin-bottom: 15px; text-align: left; border: 2px solid #e40520; background-color: transparent; } .locationextra-wrapper { margin-top: 60px; } @media only screen and (min-width: 1400px) { .locationextra-wrapper { margin-top: 0; } } .chart-wrapper { position: relative; } .chart-wrapper.pie { max-width: 500px; } .chart-wrapper.bars { margin-top: 90px; margin-bottom: 120px; } .chart-wrapper .label-mouseover { position: absolute; left: 50%; top: 50%; padding: 12.5px; padding-left: 62.5px; width: auto; width: 50%; min-height: 90px; background-color: #e40520; color: #858389; text-transform: uppercase; line-height: 1.3; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: none; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; pointer-events: none; z-index: 50; -webkit-box-sizing: border-box; box-sizing: border-box; } .chart-wrapper .label-mouseover.enabled { display: -webkit-box; display: -ms-flexbox; display: flex; } .chart-wrapper .label-mouseover .label-iconwrapper { position: absolute; left: 5px; top: 0; height: 100%; width: 50px; } .chart-wrapper .label-mouseover .label-iconwrapper .label-icon { width: 70%; height: 70%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: none; } .chart-wrapper .label-mouseover .label-iconwrapper .label-icon svg { width: 100%; height: 100%; } .chart-wrapper .label-mouseover .label-iconwrapper .label-icon.enabled { display: block; } .chart-wrapper .label-mouseover .label-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; text-align: left; } @media only screen and (max-width: 949px) { .chart-wrapper .label-mouseover .label-content { font-size: 16px; } } .chart-wrapper .label-mouseover span { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: block; } .chart-wrapper.bars .label-mouseover { min-height: 60px; width: 38%; top: 20%; max-width: 300px; position: absolute; } @media only screen and (min-width: 1400px) { .chart-wrapper.bars .label-mouseover { width: 34%; } } .chart-wrapper .chart-pie circle { opacity: 0.8; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; } .chart-wrapper .chart-pie circle.highlighted { opacity: 1; cursor: pointer; } .chart-wrapper .chart-icons { width: 100%; height: 100%; position: absolute; top: 0; left: 0; pointer-events: none; } .chart-wrapper .chart-icons .chart-icon { position: absolute; top: 50%; left: 50%; width: 32px; height: 32px; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .chart-wrapper .chart-icons .chart-icon svg { width: 100%; height: 100%; } .chart-wrapper .chart-icons .chart-icon svg path { stroke: #fff; } .chart-wrapper .chart-icons .chart-icon#icon-other svg path { stroke: transparent; fill: #fff; } .chart-wrapper .chart-icons .chart-icon.highlighted { -webkit-transform: translate(-50%, -50%) scale(1.2); transform: translate(-50%, -50%) scale(1.2); } .chart-wrapper .chart-bars-sections { height: 400px; width: 100%; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -ms-flex-wrap: nowrap; flex-wrap: nowrap; z-index: 10; } .chart-wrapper .chart-bars-sections .section { height: 100%; width: 30px; position: relative; background-color: #e0eaed; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; border-radius: 8px; } .chart-wrapper .chart-bars-sections .section .bar { position: absolute; bottom: 0; left: 0; width: 100%; height: 0%; opacity: 0.8; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; border-radius: 8px; } .chart-wrapper .chart-bars-sections .section .label { position: absolute; bottom: -75px; left: -50%; width: 200%; height: 60px; text-align: center; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-transform: scale(1); transform: scale(1); } .chart-wrapper .chart-bars-sections .section .label svg { width: 60%; height: 60%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .chart-wrapper .chart-bars-sections .section.highlighted { cursor: pointer; } .chart-wrapper .chart-bars-sections .section.highlighted .bar { opacity: 1; } .chart-wrapper .chart-bars-sections .section.highlighted .label { -webkit-transform: scale(1.15); transform: scale(1.15); } .chart-wrapper .chart-bars-grid { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .chart-wrapper .chart-bars-grid .line-h { position: absolute; left: 0; bottom: 0%; width: 100%; height: 1px; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23DDDDDDFF' stroke-width='2' stroke-dasharray='4%2c6' stroke-dashoffset='0' stroke-linecap='butt'/%3e%3c/svg%3e"); } .chart-wrapper .chart-bars-grid .line-h .value { position: absolute; left: 0; bottom: 5px; height: 30px; text-align: left; font-size: 18px; } .chart-wrapper.bars.lossrecord .chart-bars-sections { height: 600px; } .chart-wrapper.bars.lossrecord .chart-bars-sections .section .bar { background-color: #00abec; } .chart-wrapper.bars.lossrecord .chart-bars-sections .section .label { width: 300%; height: 120px; bottom: -142.5px; left: -100%; font-size: 16px; line-height: 1.2; text-align: center; } .chart-wrapper.bars.lossrecord .chart-bars-sections .section .label .period { display: block; font-size: 20px; margin-top: 22.5px; } #tab2, tab3, tab4, tab5 { display:none; }