/* * CSS Styles that are needed by jScrollPane for it to operate correctly. * * Include this stylesheet in your site or copy and paste the styles below into your stylesheet - jScrollPane * may not operate correctly without them. */ .jspContainer { overflow: hidden; position: relative; } .jspPane { position: absolute; } .jspVerticalBar { position: absolute; top: 0; right: 3px; width: 9px; height: 100%; background: red; } .jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 9px; background: red; } .jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; } .jspCap { display: none; } .jspHorizontalBar .jspCap { float: left; } .jspTrack { background: #E6E6E6; position: relative; } .jspDrag { background: #939AA4; position: relative; top: 0; left: 0; cursor: pointer; } .jspDrag:hover { background: #89909a; } .jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag { float: left; height: 100%; } .jspArrow { background: #50506d; text-indent: -20000px; display: block; cursor: pointer; } .jspArrow.jspDisabled { cursor: default; background: #80808d; } .jspVerticalBar .jspArrow { height: 16px; } .jspHorizontalBar .jspArrow { width: 9px; float: left; height: 100%; } .jspVerticalBar .jspArrow:focus { outline: none; } .jspCorner { background: #eeeef4; float: left; height: 100%; } /* Yuk! CSS Hack for IE6 3 pixel bug :( */ * html .jspCorner { margin: 0 -3px 0 0; } /* Slider */ .slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } /** * Owl Carousel v2.2.1 * Copyright 2013-2017 David Deutsch * Licensed under () */ /* * Owl Carousel - Core */ .owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; /* position relative and z-index fix webkit rendering fonts issue */ position: relative; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; cursor: hand; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-loaded { display: block; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } /* No Js */ .no-js .owl-carousel { display: block; } /* * Owl Carousel - Animate Plugin */ .owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { transition: height 500ms ease-in-out; } /* * Owl Carousel - Lazy Load Plugin */ .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } /* * Owl Carousel - Video Plugin */ .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("owl.video.play.png") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } /* Variables for styles */ /* Breakpoints */ /* Font */ /* sizes */ /* Font sizes */ /* colors */ /* Header variables */ /* Main menu variables*/ /* Slide variables */ /* Topic variables */ /* Tellmap side */ /* Country side */ /* Cartogram page */ /* zoom slider */ /* popup */ /* languages */ /* embed */ /* TextBox */ * { margin: 0 0 0 0; padding: 0 0 0 0; border-width: 0px; border-style: solid; border-color: transparent; box-sizing: border-box; } body { font-family: 'Open Sans', sans-serif; line-height: 1.5; font-size: 16.8px; color: #000; background-color: #fff; } @media (min-width: 768px) { body { font-size: 14px; } } h1 { font-size: 24px; font-weight: 300; margin: 5px 0px 25px 0px; } h2, h3, h4 { font-size: 15px; } p { margin-bottom: 24px; } ul, ol { margin: 0px 0px; padding-left: 21px; } li { margin-bottom: 5px; } a { color: #000; text-decoration: underline; } a:hover { color: #000; text-decoration: none; } @media (min-width: 768px) { .mobile { display: none !important; } } @media (min-width: 961px) { .fluid { display: none !important; } } @media (max-width: 767px) { .fluid { display: none !important; } } .styleOfBoxShadow { -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } .listStyleOfBoxShadow { -webkit-box-shadow: 0px 2px 2px 1px #aaa; -moz-box-shadow: 0px 2px 2px 1px #aaa; -ms-box-shadow: 0px 2px 2px 1px #aaa; -o-box-shadow: 0px 2px 2px 1px #aaa; box-shadow: 0px 2px 2px 1px #aaa; } .centerBlock { width: 100%; max-width: 1010px; position: relative; margin: 0px auto; padding: 0px 25px; } .clearAfter:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .clear { display: block; width: 100%; height: 1px; clear: both; } #mc_embed_signup .clear { height: auto; } .invertText { color: #fff; background-color: #000; display: inline-block; padding: 0px 7px; } .blockHoverEffect:hover { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .loading { background: url('../assets/loading.gif') center center no-repeat; } .country-rank { display: inline-block; width: 20px; margin-right: 5px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank::-ms-track { width: 20px; height: 10px; border: none; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank::-moz-range-track { width: 20px; height: 10px; border: none; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank::-webkit-slider-runnable-track { width: 20px; height: 10px; border: none; border-radius: 0px; background-color: #efefef; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank::-ms-thumb { display: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank::-moz-range-thumb { display: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank::-webkit-slider-thumb { display: block; width: 3px; height: 10px; position: relaitve; background-color: #000; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; } .country-rank:-moz-focusring { outline: none; } .country-rank:focus { outline: none; } .customSelect { font-size: 15px; } .hasCustomSelect { width: 100% !important; max-width: 300px; height: 100% !important; z-index: 1; cursor: pointer; } .chosen-single:hover { -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .customSelect, .chosen-single { position: relative; display: inline-block; width: 100% !important; height: auto; min-height: 31px; line-height: 1; background-color: #efefef; padding: 5px 38px 5px 22px; margin-bottom: 0px; cursor: pointer; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } @media (min-width: 768px) { .customSelect, .chosen-single { max-width: 300px; } } .customSelect:focus, .chosen-single:focus { outline: 0; } .customSelect:after, .chosen-single:after { content: ''; display: block; width: 12px; height: 8px; position: absolute; top: 50%; right: 13px; margin-top: -4px; background: url('../assets/select_arrow.jpg') center center no-repeat; } .customSelectInner, .chosen-singleInner, .customSelect > span, .chosen-single > span { display: inline-block; font-size: 15px; width: 100% !important; height: auto; min-height: 21px; line-height: 1.2; padding: 1px 3px 2px 0px; border-right: 1px solid #868685; } .customSelect.tellmap--side--dataset--cs, .chosen-single.tellmap--side--dataset--cs { max-width: 300px; } .chosen-container { position: relative; width: 100% !important; } @media (min-width: 768px) { .chosen-container { max-width: 300px; } } .chosen-container .jspContainer { width: 100% !important; } .chosen-container .jspPane { width: 100% !important; position: relative; } .chosen-container .jspVerticalBar { width: 12px; right: 1px; right: -3px; background-color: transparent; } .chosen-container .jspTrack { width: 6px; background-color: #efefef; } .chosen-container .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; background-repeat: repeat; } .chosen-drop { display: none; width: 100%; max-height: 250px; position: absolute; margin: 0 0; padding: 0 0; background-color: #fff; list-style: none; border: 2px solid #efefef; -webkit-box-shadow: 0px 2px 2px 1px #aaa; -moz-box-shadow: 0px 2px 2px 1px #aaa; -ms-box-shadow: 0px 2px 2px 1px #aaa; -o-box-shadow: 0px 2px 2px 1px #aaa; box-shadow: 0px 2px 2px 1px #aaa; z-index: 2; } .chosen-drop .chosen-search { display: none; } .chosen-drop ul, .chosen-drop li { list-style: none; margin: 0 0 0 0; padding: 0 0 0 0; } .chosen-drop.jspScrollable ul { padding-right: 15px; } .chosen-drop li { min-height: 32px; padding: 12px 10px 7px 20px; font-size: 16px; line-height: 1.2; font-style: italic; text-decoration: none; } .chosen-drop li[data-option-array-index] { min-height: 32px; padding: 7px 10px 7px 20px; font-size: 15px; line-height: 1.2; text-decoration: none; font-style: normal; color: #060606; cursor: pointer; } .chosen-drop li[data-option-array-index].result-selected, .chosen-drop li[data-option-array-index]:hover { color: #fff; background-color: #000; display: inline-block; padding: 0px 7px; display: block; cursor: pointer; padding: 7px 10px 7px 20px; } .chosen-with-drop .chosen-drop { display: block; width: 100% !important; } .chosen-with-drop .chosen-single > span { border-right-width: 0; } .chosen-with-drop .chosen-single:after { display: none; } .row:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .row--col { width: 50%; float: left; padding: 0px 10px; position: relative; } @media (max-width: 767px) { .row--col { width: 100%; padding: 0px 0px; float: none; } } .row--col:first-child { padding-left: 0px; } .row--col:last-child { padding-right: 0px; } .cartogram-switcher { display: block; min-height: 22px; line-height: 1.5; position: relative; padding: 0px 0px 0px 0px; cursor: pointer; text-transform: uppercase; font-size: 1.1em; font-weight: 700; } .cartogram-switcher:before { content: ''; display: none; width: 0; height: 0; border-width: 6px 7px 6px 0; border-color: transparent #000 transparent transparent; border-style: solid; margin-right: 15px; } .cartogram-switcher:after { content: ''; display: inline-block; width: 0; height: 0; border-width: 6px 0 6px 7px; border-color: transparent transparent transparent #000; border-style: solid; margin-left: 15px; } .cartogram-switcher.on:before { display: inline-block; } .cartogram-switcher.on:after { display: none; } .cartogram-switcher.off:before { display: none; } .cartogram-switcher.off:after { display: inline-block; } .fontSettings { font-size: 16px; line-height: 1.5; text-align: left; } @media (min-width: 768px) { .fontSettings { font-size: 14px; } } .flex { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; } .flexImportant { -webkit-display: box !important; display: -webkit-box !important; display: -webkit-flex !important; display: -ms-flexbox !important; display: flexbox !important; display: flex !important; } .flexVertical { -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .spinner { margin: 25px 0; width: 100px !important; } .alt-html-text { padding: 12px; } @media (min-width: 960px) { .alt-html-text { margin-top: 8px; margin-bottom: 8px; padding-left: 22px; } } .alt-html-text p { margin-right: 10px; margin-bottom: 15px; font-size: 17.6px; font-weight: 400; } @media (min-width: 768px) { .alt-html-text p { font-size: 15.4px; } } @media (min-width: 960px) { .alt-html-text p { margin-right: 0px; } } .alt-html-text a { font-size: 16px; } @media (min-width: 768px) { .alt-html-text a { font-size: 14px; } } .suggested { padding: 12px; } @media (min-width: 960px) { .suggested { margin-top: 8px; padding-left: 22px; } } .suggested--header { display: inline-block; margin-right: 10px; margin-bottom: 15px; font-size: 15.4px; font-weight: 400; } @media (min-width: 960px) { .suggested--header { display: block; margin-right: 0px; } } .suggested--list { display: inline-block; list-style: none; padding-left: 0px; } @media (min-width: 960px) { .suggested--list { margin-left: -7px; display: block; } } .suggested--list .invertText { -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } @media (max-width: 959px) { .suggested--item { display: inline-block; margin-right: 10px; } } .suggested--link { display: inline-block; color: #fff; text-decoration: none; font-size: 14px; padding: 3px 5px; margin-bottom: 1px; line-height: 1.5; font-weight: 400; } .suggested--link.invertText { font-size: 14px; font-weight: 400; margin-right: 5px; margin-top: 3px; background-color: #000; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } .suggested--link.invertText:hover { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .more-info { padding: 12px; } @media (min-width: 960px) { .more-info { margin-top: 8px; padding-left: 22px; } } .more-info--header { display: inline-block; margin-right: 10px; margin-bottom: 15px; font-size: 15.4px; font-weight: 400; } @media (min-width: 960px) { .more-info--header { display: block; margin-right: 0px; } } .more-info--list { display: block; list-style: none; padding-left: 0px; margin-left: -5px; } @media (max-width: 959px) { .more-info--item { display: inline-block; margin-right: 10px; } } .more-info--link { display: inline-block; color: #fff; text-decoration: none; font-size: 14px; padding: 3px 5px; margin-bottom: 1px; line-height: 1.5; font-weight: 400; } .more-info--link.invertText { font-size: 14px; font-weight: 400; margin-right: 5px; margin-top: 3px; background-color: #000; } .more-info--link.invertText:hover { color: #fff; background-color: #000; } .download { position: relative; margin-bottom: 12px; margin-top: 25px; overflow: hidden; min-height: 31px; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } .download:hover { -webkit-box-shadow: 0px 0px 0px 2px #efefef; -moz-box-shadow: 0px 0px 0px 2px #efefef; -ms-box-shadow: 0px 0px 0px 2px #efefef; -o-box-shadow: 0px 0px 0px 2px #efefef; box-shadow: 0px 0px 0px 2px #efefef; } @media print { .download { display: none; } } .download--header { min-height: 31px; position: relative; display: block; line-height: 22px; font-size: 15px; text-decoration: none; font-weight: 400; background-color: #efefef; padding: 4px 45px 5px 22px; cursor: pointer; } @media (max-width: 959px) { .download--header { white-space: nowrap; } } .download--header:after { content: ''; display: block; width: 35px; height: 30px; background: url('../assets/shared.png') 12px 6px no-repeat; position: absolute; top: 50%; right: 9px; margin-top: -15px; border-left: 1px solid #868685; } .download--content { height: 0px; overflow: hidden; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } .download--content ul { list-style: none; padding: 12px 10px; } @media (min-width: 768px) { .download--content ul { padding: 12px 0px 12px 21px; } } @media (max-width: 767px) { .download--content li { display: table-cell; width: 1%; padding: 6px; text-align: center; } } .download--content a { cursor: pointer; } .download .downloadMap { display: block; margin-right: 10px; } .download .downloadMap.waiting { background: url('../images/ajax-loader.gif') right center no-repeat; background-size: auto 100%; } .share { width: 100%; position: fixed; left: 0; bottom: 0; z-index: 5; padding: 0px 0px; background-color: #efefef; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } @media print { .share { display: none; } } @media (min-width: 768px) { .share { margin: 12px 0px; position: relative; width: auto; } } @media (min-width: 960px) { .share { padding: 5px 12px 0px 22px; margin: 0 0; background-color: transparent; -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } } .share--header { padding: 0 0; } .share--header ul { padding: 6px 0px; } @media (min-width: 960px) { .share--header ul { padding: 15px 0px 0px 0px; } } .share--header li { display: table-cell; width: 1%; height: 30px; vertical-align: middle; line-height: 1; margin: 0 0 0 0; padding: 0px 10px; border-right: 1px solid #000; text-align: center; white-space: nowrap; } .share--header li:last-child { border-right: 0; } .share--header li > span { display: none; } @media (min-width: 375px) { .share--header li > span { display: inline-block; } } @media (min-width: 768px) { .share--header li { width: auto; text-align: left; } } @media (min-width: 960px) { .share--header li { padding: 0px 10px 0px 0px; border-right: 0; height: auto; text-transform: uppercase; } } .share--header span { display: inline-block; height: 25px; position: relative; top: -2px; line-height: 25px; margin-right: 10px; font-weight: 400; font-size: 15.4px; } @media (min-width: 768px) { .share--header span { font-size: 14px; font-weight: 300; } } .share--header a { display: block; position: relative; height: 25px; line-height: 25px; margin: 0px 0px; text-decoration: none; font-size: 15.4px; font-weight: 400; cursor: pointer; top: 2px; } @media (min-width: 768px) { .share--header a { font-size: 14px; } } @media (min-width: 960px) { .share--header a { top: 0; } .share--header a.invertText:hover { color: #fff; } } .share--header a.share--link { margin-right: 5px; display: inline-block; top: 4px; } @media (min-width: 960px) { .share--header a.share--link { margin-right: 0; display: block; top: 0; } } .share--link { width: 25px; height: 25px; margin: 0 0 0 0; background: url('../assets/social.png') 0 0 no-repeat; text-indent: -1000000px; } .share--link.facebook { background-position: 0 0; } .share--link.twitter { background-position: -25px 0; } .share--link.linkedin { background-position: -50px 0; } .share--link.gplus { background-position: -75px 0; } .share--content { display: block; box-sizing: content-box; width: 100%; padding: 1px 0; height: 0; overflow: hidden; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } .share--content > div { padding: 1px 0; } .share--content--title { padding: 6px; margin: 5px 10px; } @media (min-width: 960px) { .share--content--title { margin: 5px; } } .share--content--title a { cursor: pointer; } .share--content .textarea { display: block; width: auto; height: auto; overflow: auto; resize: none; margin: 5px 10px 10px 10px; padding: 5px; border: 1px solid #868685; background-color: #fff; word-wrap: break-word; } @media (min-width: 960px) { .share--content .textarea { margin: 5px; background-color: transparent; } } .select-placeholder { position: relative; display: inline-block; width: 100%; height: auto; min-height: 31px; line-height: 1.2; background-color: #efefef; padding: 6px 41px 7px 22px; margin-bottom: 0px; font-size: 15px; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } @media (min-width: 768px) { .select-placeholder { max-width: 300px; } } /* Export */ .mapExportLoading { display: none; text-align: center; padding-top: 60px; } .mapExportLoading.active { display: block; position: relative; width: 100%; height: 250px; background: url('../images/ajax-loader.gif') center center no-repeat; } .mapExportWrapper.active { display: block; position: absolute; top: 0; left: 0; z-index: -2; } .header { width: 100%; height: auto; background-color: #efefef; } .header--watermark { display: block; height: 70px; position: absolute; top: 0; left: 50%; transform: translate(-50%, 0); z-index: 2; transition: left 250ms; } @media (min-width: 768px) { .header--watermark { display: block; height: auto; } } @media (min-width: 920px) { .header--watermark { left: 56%; } } .header--banner { min-height: 12px; } .header--block { height: auto; padding: 20px 20px 12px 20px; width: 100%; max-width: 1010px; position: relative; margin: 0px auto; padding: 0px 25px; } .header--block:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .header--block__padding { padding-top: 12px; padding-bottom: 12px; } @media (min-width: 768px) { .header--block__padding { padding-top: 42px; } } @media (min-width: 768px) { .header--block__watermark { padding-bottom: 42px; } } .header--logo { display: inline-block; max-width: 60%; float: none; position: relative; top: -3px; z-index: 2; } @media (min-width: 550px) { .header--logo { max-width: 75%; } } @media (min-width: 768px) { .header--logo { float: left; top: 0; } } .header--logo a { display: inline-block; text-decoration: none; } .header--logo img { display: block; width: auto; height: 35px; float: left; margin-right: 12px; } @media (min-width: 768px) { .header--logo img { height: auto; } } .header--logo h2 { font-weight: 400; font-size: 18px; cursor: pointer; line-height: 1.2; margin-bottom: 10px; margin-top: 12px; float: left; } @media (min-width: 550px) { .header--logo h2 { font-size: 22px; } } @media (min-width: 768px) { .header--logo h2 { font-size: 25px; } } .header--logo h2.header--note { position: relative; top: -3px; left: -6px; font-weight: 300; font-style: italic; margin-top: 0; margin-bottom: 0; } @media (min-width: 550px) { .header--logo h2.header--note { top: -6px; left: 0; } } .header--right { display: inline-block; float: right; clear: right; padding-top: 12px; z-index: 2; position: relative; } @media (min-width: 768px) { .header--right { display: block; clear: none; padding-top: 17px; } } .header--right.no-banner { padding-top: 5px; } @media (min-width: 768px) { .header--right.no-banner { padding-top: 17px; } } .header--right h2 { display: none; font-weight: 400; } @media (min-width: 768px) { .header--right h2 { display: inline-block; } } .header--right ul { display: inline-block; list-style: none; margin-left: 6px; padding-left: 10px; } .header--right li { display: inline-block; } .header--social { float: none; margin-right: 35px; } @media (min-width: 768px) { .header--social { float: right; margin-right: 0px; } } .header--social a { display: block; width: 21px; height: 21px; text-align: left; text-indent: -1000000px; margin-left: 3px; } .header--social a.facebook { background: url('../assets/social.jpg') 0px 0px no-repeat; } .header--social a.twitter { background: url('../assets/social.jpg') -21px 0px no-repeat; } .header--languages { float: right; } .header--languages li:after { content: ''; display: inline-block; } .header--languages a { text-decoration: none; text-transform: uppercase; color: #848181; } .header--languages a.active, .header--languages a:hover { color: #000; text-decoration: none; text-transform: uppercase; } /* Main menu */ .linePart { display: block; width: 26px; height: 4px; background-color: #000; } .menu-button { display: block; width: 30px; height: 22px; position: relative; top: 0px; right: 0px; z-index: 11; float: right; text-align: left; cursor: pointer; } .menu-button:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .menu-button .line { display: block; width: 26px; height: 4px; background-color: #000; position: relative; left: 2px; top: 8px; text-indent: -1000000px; } .menu-button .line:before, .menu-button .line:after { content: ''; display: block; width: 26px; height: 4px; background-color: #000; position: absolute; left: 0px; } .menu-button .line:before { top: -8px; } .menu-button .line:after { top: 8px; } @media (min-width: 768px) { .menu-button { display: none; } } .menu { width: 100%; height: 0px; position: fixed; top: 0px; left: 0px; overflow: hidden; background-color: #064171; padding: 0 0 0 0; z-index: 21; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } @media (min-width: 768px) { .menu { position: relative; height: auto; background-color: #efefef; margin-bottom: -1px; padding: 0 25px; overflow: visible; z-index: 1; } } @media (min-width: 768px) { .menu--around { background-color: #efefef; } } @media (min-width: 768px) { .menu--wrapper { width: 100%; max-width: 1010px; margin: 0px auto; position: relative; } } .menu--block { position: relative; } .menu--block:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .menu--list { float: none; list-style: none; padding-left: 0px; margin-left: 0px; } @media (min-width: 768px) { .menu--list { float: left; position: relative; top: 1px; margin-left: -23px; } } .menu--item { display: block; margin-bottom: 0px; border-bottom: 1px solid #fff; } @media (min-width: 768px) { .menu--item { display: inline-block; margin-right: 4px; padding-right: 0px; border-bottom-width: 0; } } .menu--link { display: block; width: auto; height: 56px; min-height: 0px !important; line-height: 1; color: #fff; font-size: 26px; font-weight: 300; text-decoration: none; padding: 15px 0px 15px 23px; border-width: 0px 1px; border-style: solid; border-color: transparent; position: relative; z-index: auto; } @media (min-width: 768px) { .menu--link { display: inline-block; height: 31px; padding: 0px 23px 0px 23px; line-height: 31px; text-decoration: underline; font-size: 15px; font-weight: 400; color: #000; z-index: 11; } } .menu--link:hover, .menu--link.active { background-color: #fff; color: #000; border-color: #fff; text-decoration: none; } .menu--link::first-letter { text-transform: uppercase; } .menu--link.show-submenu { padding-left: 23px; } .menu--link.show-submenu.active { position: relative; color: #000; border-color: #fff; background-color: #fff; } @media (min-width: 768px) { .menu--link.show-submenu.active { color: #fff; border-color: #064171; background-color: #064171; -webkit-box-shadow: 5px 5px 10px -5px #000; -moz-box-shadow: 5px 5px 10px -5px #000; -ms-box-shadow: 5px 5px 10px -5px #000; -o-box-shadow: 5px 5px 10px -5px #000; box-shadow: 5px 5px 10px -5px #000; } } .menu--link.show-submenu.active:after { content: ''; display: none; width: 100%; height: 7px; position: absolute; top: 30px; left: -1px; border-width: 0px 1px; border-style: solid; border-color: #064171; background-color: #064171; } @media (min-width: 768px) { .menu--link.show-submenu.active:after { display: block; } } .menu--second-list { position: relative; top: 1px; float: none; margin-top: -1px; margin-right: 0px; padding-left: 0px; border-top: 0px; list-style: none; } @media (min-width: 768px) { .menu--second-list { float: right; margin-right: -4px; margin-top: 0px; border-top-width: 0; } } .menu--second-item { display: block; margin-bottom: 0px; border-bottom: 1px solid #fff; } @media (min-width: 768px) { .menu--second-item { display: inline-block; margin-left: 4px; padding-right: 0px; border-bottom-width: 0; } } .menu--second-link { position: relative; display: block; width: auto; height: 56px; padding: 12px 0px 12px 23px; border-width: 0px 1px; border-style: solid; border-color: transparent; background-color: #064171; font-size: 26px; font-weight: 300; line-height: 1; text-align: left; text-decoration: none; color: #fff; z-index: auto; } @media (min-width: 768px) { .menu--second-link { display: inline-block; height: 31px; padding: 0 5px 0 5px; background-color: transparent; line-height: 31px; text-decoration: underline; font-size: 0.9em; font-weight: 400; color: #000; cursor: pointer; } } .menu--second-link:hover, .menu--second-link.active { background-color: #efefef; border-color: #efefef; text-decoration: none; color: #000; } @media (min-width: 768px) { .menu--second-link:hover, .menu--second-link.active { background-color: #fff; border-color: #fff; text-decoration: none; color: #000; } } .submenu { display: none; position: fixed; top: 2.5vh; left: 2.5vw; width: 95vw; height: 95vh; z-index: 21; padding: 15px 15px 15px 23px; color: #000; border: 1px solid #fff; background-color: #fff; -webkit-box-shadow: 0px 0px 23px 3px #000; -moz-box-shadow: 0px 0px 23px 3px #000; -ms-box-shadow: 0px 0px 23px 3px #000; -o-box-shadow: 0px 0px 23px 3px #000; box-shadow: 0px 0px 23px 3px #000; } .submenu:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } @media (min-width: 768px) { .submenu { position: absolute; top: 37px; left: 2px; height: auto; width: 99%; color: #fff; background-color: #064171; border: 1px solid #064171; -webkit-box-shadow: 5px 5px 10px -5px #000; -moz-box-shadow: 5px 5px 10px -5px #000; -ms-box-shadow: 5px 5px 10px -5px #000; -o-box-shadow: 5px 5px 10px -5px #000; box-shadow: 5px 5px 10px -5px #000; z-index: 18; } } .submenu--close { position: absolute; top: 0px; right: 0px; display: block; width: 40px; height: 40px; text-indent: -1000000px; z-index: 13; cursor: pointer; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background-color: #fff; } @media (min-width: 768px) { .submenu--close { display: none; } } .submenu--close:before, .submenu--close:after { content: ''; display: block; width: 30px; height: 4px; position: absolute; left: 4px; top: 18px; background-color: #2e6b9e; } .submenu--close:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .submenu--close:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .submenu--title { padding: 10px 0px 5px 12px; font-size: 18px; } @media (min-width: 768px) { .submenu--title { padding: 15px 0 5px; font-weight: 700; font-style: normal; font-size: 14px; } } .submenu--move { position: relative; width: 95% !important; height: 100%; } .submenu--move.jspScrollable .jspVerticalBar { width: 12px; right: 18px; background-color: transparent; } .submenu--move.jspScrollable .jspTrack { width: 6px; background-color: #2e6b9e; } .submenu--move.jspScrollable .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#2e6b9e 3px, #fff 4px); background-position: left top; background-size: 12px 4px; background-repeat: repeat; } .submenu--list { position: relative; width: 100%; list-style: none; padding-left: 7px; } @media (min-width: 768px) { .submenu--list { position: static; width: 100%; height: auto; margin: 0 0 0 0; padding: 0 0 15px 0; } } @media (min-width: 768px) { .submenu--list { column-count: 2; column-gap: 30px; } } @media (min-width: 880px) { .submenu--list { position: relative; display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; column-count: auto; column-gap: normal; } } .submenu--item { display: block; margin-bottom: 10px; width: 100%; float: none; line-height: 1; } @media (min-width: 768px) { .submenu--item { display: inline-block; float: none; margin-bottom: 0; padding: 1px 1px 1px 1px; } } @media (min-width: 880px) { .submenu--item { flex: 0 0 19.5%; display: block; line-height: 1; } } .submenu--number { display: inline-block; padding-left: 10px; color: #000; } @media (min-width: 768px) { .submenu--number { color: #2e6b9e; } } .submenu--link { display: block; position: relative; padding: 5px 0 5px 5px; text-decoration: none; color: #000; } @media (min-width: 768px) { .submenu--link { left: -5px; padding: 10px 5px 10px 5px; color: #fff; } } @media (min-width: 880px) { .submenu--link { left: 0; margin-left: -1px; padding: 0 0 0 0; line-height: 2; } } .submenu--link:hover { color: #2e6b9e; background-color: #efefef; } @media (min-width: 768px) { .submenu--link:hover { background-color: transparent; } } @media (min-width: 768px) { .side-menu--select { display: none !important; } } .side-menu--list { display: none; list-style: none; padding-left: 0px; } @media (min-width: 768px) { .side-menu--list { display: block; } } .side-menu--link { display: block; padding: 5px 10px; font-size: 15px; text-decoration: none; } .side-menu--link.active, .side-menu--link:hover { background-color: #efefef; } .body { min-height: 350px; max-width: 100%; background-color: #fff; width: 100%; max-width: 1010px; position: relative; margin: 0px auto; padding: 0px 25px; padding-top: 20px; padding-bottom: 45px; } .body:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .notify-message { display: none; width: 100%; height: 100%; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; position: absolute; top: 0px; left: 0px; background: rgba(255, 255, 255, 0.7); text-align: center; font-size: 1.1rem; z-index: 16; } .notify-message.active { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; } .layout-content, .layout-map { position: relative; height: 0px; overflow: hidden; } .layout-content.active, .layout-map.active { height: auto; overflow: visible; } .layout-content.active:after, .layout-map.active:after { content: ''; display: block; clear: both; } .footer { width: 100%; height: auto; min-height: 100px; background-color: #efefef; } .footer.tellmap { padding-bottom: 45px; } @media (min-width: 768px) { .footer.tellmap { padding-bottom: 0; } } .footer--block { height: auto; width: 100%; max-width: 1010px; position: relative; margin: 0px auto; padding: 0px 25px; padding-top: 12px; padding-bottom: 12px; } @media (min-width: 768px) { .footer--block { height: auto; } } .footer--block ul { list-style: none; font-size: 0px; } .footer--block li { display: inline-block; padding-right: 8px; padding-left: 8px; position: relative; } .footer--block li:after { content: ''; display: block; width: 1px; height: 12px; background-color: #545452; position: absolute; top: 6px; right: 0px; } .footer--block li:first-child { padding-left: 0px; } .footer--block li:last-child:after { display: none; } .footer--block li a { font-size: 13px; line-height: 1; color: #1d1d1b; text-decoration: none; } .footer--block p { margin-bottom: 6px; font-size: 14px; } @media (min-width: 768px) { .footer--block p { font-size: 11.9px; } } .homepage { min-height: 50px; } .homepage--content h2 { font-size: 26px; font-weight: 400; line-height: 1.2; margin: 0 0 20px 0; text-align: center; } .homepage--container { margin: 48px 0 0 0; } @media (max-width: 767px) { .homepage--container:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } } .homepage--entries-header { text-align: center; } .homepage--entries-header p { margin-bottom: 3px; } .homepage--entries { position: relative; } @media (min-width: 768px) { .homepage--entries .homepage--entr-table { margin: 30px auto 0; } } .homepage--entry { padding: 0px 10px; text-align: center; vertical-align: top; font-size: 16px; line-height: 1.5; text-align: left; } @media (min-width: 768px) { .homepage--entry { font-size: 14px; } } @media (min-width: 960px) { .homepage--entry { padding: 0px 0px; } } .homepage--entry.profile a, .homepage--entry.atlas a, .homepage--entry.tellmap a { display: block; text-decoration: none; cursor: pointer; padding: 12px 20px; margin: 0 auto; } @media (min-width: 550px) { .homepage--entry.profile a, .homepage--entry.atlas a, .homepage--entry.tellmap a { max-width: 190px; padding: 12px 0px; } } .homepage--entry.profile a:hover, .homepage--entry.atlas a:hover, .homepage--entry.tellmap a:hover { background-color: #fafafa; } .homepage--entry.profile h3, .homepage--entry.atlas h3, .homepage--entry.tellmap h3 { font-weight: 400; text-decoration: none; cursor: pointer; } .homepage--entry.profile h3.invertText, .homepage--entry.atlas h3.invertText, .homepage--entry.tellmap h3.invertText { padding: 4px 8px; margin-bottom: 6px; line-height: 1; } .homepage--entry.profile h3.invertText:hover, .homepage--entry.atlas h3.invertText:hover, .homepage--entry.tellmap h3.invertText:hover { color: #fff; } .homepage--entry.profile img, .homepage--entry.atlas img, .homepage--entry.tellmap img { display: block; width: 100%; height: auto; margin: 0 auto; } .homepage--entry.profile div, .homepage--entry.atlas div, .homepage--entry.tellmap div { margin: 10px 0px 5px 0px; } @media (min-width: 550px) { .homepage--entry.profile a { max-width: 290px; } } .homepage--entry.profile h3.invertText { padding: 8px 12px; } .homepage--entry.profile div { line-height: 1.75; margin: 10px 0px 20px; } .no-slider.homepage--entries { font-size: 0; line-height: 1; text-align: center; } .no-slider.homepage--entries.type-profile, .no-slider.homepage--entries.type-tellmap, .no-slider.homepage--entries.type-atlas { text-align: center; } @media (min-width: 550px) { .no-slider.homepage--entries.type-profile, .no-slider.homepage--entries.type-tellmap, .no-slider.homepage--entries.type-atlas { text-align: center; } } .no-slider.homepage--entries.type-profile .homepage--entr-table, .no-slider.homepage--entries.type-tellmap .homepage--entr-table, .no-slider.homepage--entries.type-atlas .homepage--entr-table { display: inline-block; width: auto; margin: 30px auto 0; } @media (min-width: 550px) { .no-slider.homepage--entries.type-profile .homepage--entr-table, .no-slider.homepage--entries.type-tellmap .homepage--entr-table, .no-slider.homepage--entries.type-atlas .homepage--entr-table { display: table; width: 100%; margin: 30px auto 0; } } @media (min-width: 768px) { .no-slider.homepage--entries.type-profile .homepage--entr-table, .no-slider.homepage--entries.type-tellmap .homepage--entr-table, .no-slider.homepage--entries.type-atlas .homepage--entr-table { margin: 30px auto 0px; } } .no-slider.homepage--entries.type-profile .homepage--entry, .no-slider.homepage--entries.type-tellmap .homepage--entry, .no-slider.homepage--entries.type-atlas .homepage--entry { width: 100%; float: none; max-width: 250px; padding: 0 10px; margin: 30px auto; } @media (min-width: 550px) { .no-slider.homepage--entries.type-profile .homepage--entry, .no-slider.homepage--entries.type-tellmap .homepage--entry, .no-slider.homepage--entries.type-atlas .homepage--entry { display: table-cell; width: 1%; float: none; max-width: none; padding: 0 10px; margin: 0 0 0; } } @media (min-width: 768px) { .no-slider.homepage--entries.type-profile .homepage--entry, .no-slider.homepage--entries.type-tellmap .homepage--entry, .no-slider.homepage--entries.type-atlas .homepage--entry { max-width: 250px; padding: 0 10px; } } .no-slider.homepage--entries.type-profile .homepage--entry { max-width: 300px; } @media (min-width: 768px) { .no-slider.homepage--entries.type-profile .homepage--entry { max-width: 300px; } } .no-slider.homepage--entry { display: inline-block; width: 100%; position: relative; margin: 12px auto 0 auto; } @media (min-width: 768px) { .no-slider.homepage--entry { margin: 24px 0 0 0; } } .slick-slider .slick-button { display: block !important; width: 37px; height: 37px; position: absolute; top: 66%; margin-top: -17px; background-color: rgba(255, 255, 255, 0.5); font-size: 0; cursor: pointer; } .slick-slider .slick-button:before { content: ''; display: block; position: absolute; top: 11px; width: 15px; height: 15px; border-width: 2px 2px 0px 0px; border-style: solid; border-color: #1d1d1b; } .slick-slider .slick-prev { left: 11px; z-index: 5; } .slick-slider .slick-prev:before { left: 13px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); } .slick-slider .slick-next { right: 11px; z-index: 5; } .slick-slider .slick-next:before { right: 13px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .slick-slider .slick-disabled { display: none !important; } .topic { font-size: 0px; margin: 0px -16px; min-height: 100px; } .topic .topic { margin: 0 0 0 0; } .topic--header { float: left; } .topic--select { float: left; width: 100%; position: relative; max-width: 300px; margin-top: 5px; margin-bottom: 9px; } .topic--select .active-result:hover { background-color: #064171; } .topic--atlas { padding: 0 0 0 16px; font-weight: 400; font-size: 24px; margin-top: 20px; } .topic--item { display: inline-block; width: 25%; vertical-align: top; padding: 16px 16px 6px; font-size: 16.8px; } @media (min-width: 768px) { .topic--item { font-size: 14px; } } @media (max-width: 880px) { .topic--item { width: 33%; } } @media (max-width: 767px) { .topic--item { width: 50%; max-width: none; } } @media (max-width: 600px) { .topic--item { width: 100%; } } .topic--item:hover { background-color: #fafafa; } .topic--item:hover .topic--item--header a { background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .topic--item--header { margin: 0px 4px; margin-bottom: 12px; } .topic--item--header a { display: inline-block; color: #fff; background-color: #000; font-weight: 400; padding: 3px 5px; line-height: 1.3; text-decoration: none; font-size: 14px; -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } .topic--item--text { margin: 0px 4px; } .topic--item--text p { font-size: 14px; line-height: 1.75; margin-bottom: 0px; } .topic--item--text a { text-decoration: none; cursor: pointer; } .topic--item--image-link { display: none; line-height: 1; margin: 6px 4px; } @media (min-width: 768px) { .topic--item--image-link { display: block; } } .topic--item--image-link img { display: block; width: 100%; max-width: 100%; height: auto; margin: 0px auto; } .topic--item--dataset { overflow: hidden; padding: 4px; margin-top: 4px; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } .topic--item--dataset-link { display: block; line-height: 1.5; padding: 4px 7px; background-color: #efefef; text-decoration: none; margin-bottom: 14px; font-size: 12px; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; -webkit-transition: background-color 300ms; -moz-transition: background-color 300ms; -ms-transition: background-color 300ms; -o-transition: background-color 300ms; transition: background-color 300ms; } .topic--item--dataset-link:hover { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } @media (min-width: 768px) { .topic--item--dataset-link { margin-bottom: 7px; } } .topic--item--more-span { display: block; min-height: 37px; line-height: 1.5; padding: 9px 7px; } @media (min-width: 768px) { .topic--item--more-span { min-height: 0; } } .topic--item--more-span.topic--mobile--more-link { cursor: pointer; fonty-size: 14px; } .topic--item--more-span a { cursor: pointer; font-size: 14px; } .info { position: relative; } .info--header, .info--content { width: auto; float: none; } @media (min-width: 768px) { .info--header, .info--content { width: 66%; float: left; } } .info--header { margin-bottom: 12px; } .info--block { background-color: #fff; background-color: rgba(255, 255, 255, 0.5); border: 0px solid #dbdbdb; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; padding: 12px; margin: 0px 0px 12px 0px; } @media (min-width: 768px) { .info--block { border-width: 1px; -webkit-box-shadow: 3px 1px 8px -3px #aaa; -moz-box-shadow: 3px 1px 8px -3px #aaa; -ms-box-shadow: 3px 1px 8px -3px #aaa; -o-box-shadow: 3px 1px 8px -3px #aaa; box-shadow: 3px 1px 8px -3px #aaa; } } .info--side { width: auto; float: none; padding: 0px 0px; margin: 12px 0px 24px 0px; } @media (min-width: 768px) { .info--side { width: 31%; float: right; padding: 0px 12px; margin-bottom: 12px; } } .info--side { position: relative; } .info--side--promo--header { display: block; } @media (min-width: 768px) { .info--side--promo--header { display: none; } } .info--side--contact-pane { display: none; } @media (min-width: 768px) { .info--side--contact-pane { display: block; } } .info--content { position: relative; } .portraits--cont { margin: 0px -16px; } .portraits--list { position: relative; padding: 0 0 0 0; font-size: 0px; } .portraits--item { display: inline-block; width: 25%; vertical-align: top; padding: 16px 16px 16px; font-size: 16.8px; } @media (min-width: 768px) { .portraits--item { font-size: 14px; } } @media (max-width: 880px) { .portraits--item { width: 33%; } } @media (max-width: 767px) { .portraits--item { width: 50%; max-width: none; } } @media (max-width: 600px) { .portraits--item { width: 100%; } } .portraits--item:hover { background-color: #fafafa; } .portraits--item a { display: block; position: relative; text-decoration: none; cursor: pointer; } .portraits--item a:hover h3 { background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .portraits--item h3 { margin: 0px 4px; margin-bottom: 12px; display: inline-block; color: #fff; background-color: #000; font-weight: 400; padding: 3px 5px; line-height: 1.3; font-size: 14px; -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } .portraits--item img { display: block; width: auto; max-width: 100%; height: auto; margin: 0 auto; } .portraits--text { margin: 0px 4px 12px; } .portraits--text p { font-size: 14px; line-height: 1.75; margin-bottom: 0px; } .portraits--text a { text-decoration: none; cursor: pointer; } .map--profile-places { width: 100%; } @media (min-width: 768px) { .map--profile-places { width: 66%; float: left; } } .profile-places--list { padding: 20px 0; list-style: none; } .profile-places--item { padding: 0 0 10px 0; } .profile-places--header { display: flex; justify-content: space-between; align-items: stretch; cursor: pointer; } .profile-places--header--image { width: 24%; flex-basis: 24%; } .profile-places--header--image img { width: auto; max-width: 100%; height: auto; } .profile-places--header--text { width: 64%; flex-basic: 64%; padding: 0 2.8%; } .profile-places--header--text h3 { font-weight: 400; font-style: italic; } .profile-places--header--open { width: 12%; flex-basis: 12%; position: relative; text-decoration: none; cursor: pointer; } .profile-places--header--open:before { content: ''; display: block; width: 15px; height: 1px; background: #000; position: absolute; top: 33%; left: 50%; margin: 0px auto auto -7px; } .profile-places--header--open:after { content: ''; display: block; width: 1px; height: 15px; background: #000; position: absolute; top: 33%; left: 50%; margin: -7px auto auto 0px; -webkit-transition: transform 300ms; -moz-transition: transform 300ms; -ms-transition: transform 300ms; -o-transition: transform 300ms; transition: transform 300ms; } .profile-places--header--open.active:after { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .profile-places--content { height: 0px; padding: 0 0; overflow: hidden; position: relative; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } .profile-places--content > div { padding: 10px 0 1px 0; } .profile-places--content > div:after { content: ''; display: block; clear: both; } .profile-places--content img.left { margin-right: 20px; } .profile-places--content img.right { margin-left: 20px; } .profile-places--content figure { display: block !important; width: auto !important; } .profile-places--content figure.right { margin-left: 20px; } @media (max-width: 767px) { .profile-places--content figure.right { float: none !important; } } .profile-places--content figure.left { margin-right: 20px; } @media (max-width: 767px) { .profile-places--content figure.left { float: none !important; } } .profile-places--content figure img { display: block; width: auto; max-width: 100%; height: auto; } .profile-places--content figure figcaption { width: auto; padding-top: 2px; font-size: 13px; line-height: 1.5; } .profile-places--content figure figcaption a { color: #666; } .profile-places--content figure figcaption p { width: auto; margin-bottom: 12px; font-size: 13px; line-heigth: 1.5; } .teacher--block { font-size: 0px; margin: 0px -16px; } .teacher--select { float: left; width: 100%; position: relative; max-width: 300px; margin-top: 5px; margin-bottom: 9px; } .teacher--select .active-result:hover { background-color: #064171; } .teacher--item { display: inline-block; width: 25%; position: relative; vertical-align: top; padding: 16px 16px 6px; margin: 0 0 6px 0; font-size: 16.8px; } @media (min-width: 768px) { .teacher--item { font-size: 14px; } } @media (max-width: 880px) { .teacher--item { width: 33%; } } @media (max-width: 767px) { .teacher--item { width: 50%; max-width: none; } } @media (max-width: 600px) { .teacher--item { width: 100%; } } .teacher--item:hover { background-color: #fafafa; } .teacher--item:hover .teacher--item--head a { background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .teacher--item--head { margin: 0px 4px; margin-bottom: 12px; } .teacher--item--head a { display: inline-block; color: #fff; background-color: #000; font-weight: 400; padding: 3px 5px; line-height: 1.3; text-decoration: none; font-size: 14px; -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } .teacher--item--subhead { line-height: 1.2; font-weight: 400; margin: 0 0 12px 0; } .teacher--item--image-link { display: block; margin: 0 0 6px 0; } .teacher--item--image-link img { width: auto; max-width: 100%; height: auto; } .teacher--item--xls { display: block; text-decoration: none; cursor: pointer; font-size: 12px; } .teacher--item--xls:before { content: ''; display: inline-block; width: 20px; height: 19px; background: url('../assets/excel.png') center center no-repeat; margin-right: 10px; position: relative; top: 6px; } .map--text { width: 100%; float: none; clear: both; line-height: 2 !important; } @media (min-width: 768px) { .map--text { float: left; clear: none; } } @media (min-width: 960px) { .map--text { min-height: 10px; } } @media (min-width: 960px) { .map--text.first { width: 66%; } } @media (min-width: 768px) { .map--text.second { width: 66%; } } .map--text .narrative-menu { padding: 0 0 0 0; list-style: none; } @media print { .map--text .narrative-menu { display: none; } } .map--text .narrative-menu li { display: inline-block; padding: 7px 25px 7px 5px; } .map--text .narrative-tab { text-decoration: none; font-weight: 400; font-size: 15.4px; cursor: pointer; } .map--text .narrative-tab:hover, .map--text .narrative-tab.active { font-weight: 700; } .map--text .narrative-content { display: none; } .map--text .narrative-content.active { display: block; } .map--text--charts img, .map--text--narrative img { max-width: 100%; height: auto; } .map--text--charts > .subjectText, .map--text--narrative > .subjectText { width: auto; } @media (min-width: 768px) { .map--text--charts > p.subjectText, .map--text--narrative > p.subjectText { width: 66%; } } @media (min-width: 768px) { .map--text--charts > p > img.right, .map--text--narrative > p > img.right, .map--text--charts > .subjectText > img.right, .map--text--narrative > .subjectText > img.right { margin-right: -50%; } } .map--text--charts > p, .map--text--narrative > p, .map--text--charts > .subjectText > p, .map--text--narrative > .subjectText > p, .map--text--charts > div > p, .map--text--narrative > div > p, .map--text--charts > .subjectText > div > p, .map--text--narrative > .subjectText > div > p, .map--text--charts > ul, .map--text--narrative > ul, .map--text--charts > .subjectText > ul, .map--text--narrative > .subjectText > ul, .map--text--charts > div > ul, .map--text--narrative > div > ul, .map--text--charts > .subjectText > div > ul, .map--text--narrative > .subjectText > div > ul { width: 100%; } @media (min-width: 768px) { .map--text--charts > p, .map--text--narrative > p, .map--text--charts > .subjectText > p, .map--text--narrative > .subjectText > p, .map--text--charts > div > p, .map--text--narrative > div > p, .map--text--charts > .subjectText > div > p, .map--text--narrative > .subjectText > div > p, .map--text--charts > ul, .map--text--narrative > ul, .map--text--charts > .subjectText > ul, .map--text--narrative > .subjectText > ul, .map--text--charts > div > ul, .map--text--narrative > div > ul, .map--text--charts > .subjectText > div > ul, .map--text--narrative > .subjectText > div > ul { width: 66%; } } .map--text--charts *, .map--text--narrative *, .map--text--charts > .subjectText *, .map--text--narrative > .subjectText *, .map--text--charts > div *, .map--text--narrative > div *, .map--text--charts > .subjectText > div *, .map--text--narrative > .subjectText > div * { font-size: 16px !important; color: #000 !important; line-height: inherit; } .map--text--charts *.selected, .map--text--narrative *.selected, .map--text--charts > .subjectText *.selected, .map--text--narrative > .subjectText *.selected, .map--text--charts > div *.selected, .map--text--narrative > div *.selected, .map--text--charts > .subjectText > div *.selected, .map--text--narrative > .subjectText > div *.selected { color: #fff !important; } @media (min-width: 768px) { .map--text--charts *, .map--text--narrative *, .map--text--charts > .subjectText *, .map--text--narrative > .subjectText *, .map--text--charts > div *, .map--text--narrative > div *, .map--text--charts > .subjectText > div *, .map--text--narrative > .subjectText > div * { font-size: 14px !important; } } @media (max-width: 767px) { .map--text--charts img, .map--text--narrative img, .map--text--charts > .subjectText img, .map--text--narrative > .subjectText img, .map--text--charts > div img, .map--text--narrative > div img, .map--text--charts > .subjectText > div img, .map--text--narrative > .subjectText > div img { float: none !important; display: block; max-width: 100%; height: auto; } } .map--text--charts img.right, .map--text--narrative img.right, .map--text--charts > .subjectText img.right, .map--text--narrative > .subjectText img.right, .map--text--charts > div img.right, .map--text--narrative > div img.right, .map--text--charts > .subjectText > div img.right, .map--text--narrative > .subjectText > div img.right { margin-left: 20px; } @media (min-width: 768px) { .map--text--charts img.right, .map--text--narrative img.right, .map--text--charts > .subjectText img.right, .map--text--narrative > .subjectText img.right, .map--text--charts > div img.right, .map--text--narrative > div img.right, .map--text--charts > .subjectText > div img.right, .map--text--narrative > .subjectText > div img.right { margin-right: -50%; } } .map--text--charts img.left, .map--text--narrative img.left, .map--text--charts > .subjectText img.left, .map--text--narrative > .subjectText img.left, .map--text--charts > div img.left, .map--text--narrative > div img.left, .map--text--charts > .subjectText > div img.left, .map--text--narrative > .subjectText > div img.left { margin-right: 20px; } .map--text--charts .mw-chart-wrapper, .map--text--narrative .mw-chart-wrapper { position: relative; width: auto; margin-bottom: 25px; } .map--text--charts .mw-chart-wrapper .chart-wrapper, .map--text--narrative .mw-chart-wrapper .chart-wrapper { height: auto !important; } .map--text--charts figure, .map--text--narrative figure { display: block !important; width: auto !important; } .map--text--charts figure.right, .map--text--narrative figure.right { margin-left: 15px; } @media (max-width: 767px) { .map--text--charts figure.right, .map--text--narrative figure.right { float: none !important; } } .map--text--charts figure.left, .map--text--narrative figure.left { margin-right: 15px; } @media (max-width: 767px) { .map--text--charts figure.left, .map--text--narrative figure.left { float: none !important; } } .map--text--charts figure img, .map--text--narrative figure img { display: block; max-width: 100%; height: auto; } .map--text--charts figure figcaption, .map--text--narrative figure figcaption { width: auto; padding-top: 2px; font-size: 13px !important; line-height: 1.5 !important; } .map--text--charts figure figcaption a, .map--text--narrative figure figcaption a { color: #666; } .map--text--charts figure figcaption p, .map--text--narrative figure figcaption p, .map--text--charts figure figcaption p.caption, .map--text--narrative figure figcaption p.caption { width: auto; margin-bottom: 12px; font-size: 12px !important; line-height: 1.4 !important; font-style: italic; } @media (min-width: 768px) { .map--text--charts figure figcaption p, .map--text--narrative figure figcaption p, .map--text--charts figure figcaption p.caption, .map--text--narrative figure figcaption p.caption { font-size: 12px !important; } } .map--text--charts figure figcaption p a, .map--text--narrative figure figcaption p a, .map--text--charts figure figcaption p.caption a, .map--text--narrative figure figcaption p.caption a { font-size: 12px !important; } .map--text--charts .map-tooltip, .map--text--narrative .map-tooltip { font-size: 15px !important; font-family: 'Open Sans', sans-serif; } .tellmap.hidden, .profile.hidden, .cartogram.hidden { width: 0px; min-width: 0px; height: 0px; min-height: 0px; overflow: hidden; clear: none; border-width: 0px; padding: 0 0 0 0; } .tellmap.hidden > .share, .profile.hidden > .share, .cartogram.hidden > .share { display: none; } .topic-loading { height: 0px; overflow: hidden; z-index: 999; } .topic-loading .topic-spinner { background-image: url(../images/ajax-loader.gif); background-position: center center; background-repeat: no-repeat; } .topic-loading.spinner-container { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.75); z-index: 999; } .topic-spinner { margin-top: 100px; height: 50px; } .map { position: relative; } @media (min-width: 960px) { .map:after { display: none; } } .map--header { display: inline-block; width: auto; float: none; margin-top: 0px; margin-bottom: 0px; font-size: 1.1em; font-weight: 400; } @media (min-width: 768px) { .map--header { max-width: 66%; position: absolute; top: 0px; left: 0px; z-index: 17; } } .map--header .invertText { padding: 8px; margin-bottom: 6px; line-height: 1; } .map--header--link { display: inline-block; padding: 8px; margin-right: 5px; margin-bottom: 6px; background-color: #efefef; line-height: 1; text-decoration: none; cursor: pointer; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } .map--mobile-subnav { font-size: 0px; padding: 12px 0px; position: relative; } .map--mobile-subnav.fixed { position: fixed; top: 0px; left: 0px; width: 100%; background-color: #fff; padding: 6px 0px; z-index: 11; } .map--mobile-subnav.fixed .map--mobile-subnav--link { padding: 6px 12px; width: 33%; text-align: center; } .map--mobile-subnav--wrapper { display: block; height: 39px; } @media (min-width: 768px) { .map--mobile-subnav--wrapper { display: none; } } .map--mobile-subnav--link { display: inline-block; padding: 0px 12px; border-right: 1px solid #000; font-size: 15.4px; line-height: 1; text-decoration: none; cursor: pointer; } .map--mobile-subnav--link:last-child { border-right-width: 0px; } .map--mobile-subnav--link.active { font-weight: 700; } .map--side { width: 100%; position: relative; float: none; margin-bottom: 12px; } @media (min-width: 768px) { .map--side { display: inline-block; width: 33%; position: absolute; top: 0px; right: 0px; z-index: 17; } } @media (min-width: 960px) { .map--side { display: block; float: right; max-width: 300px; min-height: 0px; position: relative; top: auto; right: auto; z-index: inherit; } } .map--side--helper { position: relative; } .map--side--title { position: relative; top: 10px; padding: 25px 0px 0px 22px; font-size: 1.1em; font-weight: 400; } .map--side-cont { width: 100%; position: relative; float: none; } @media (min-width: 960px) { .map--side-cont { width: 30%; float: right; } } .map--map { position: relative; width: 100%; min-height: 150px; float: none; clear: both; margin: 0 0 12px; } .map--map:after { content: ''; display: block; clear: left; } @media (min-width: 768px) { .map--map.second { width: 66%; float: none; clear: none; } } .map--map .zoom-slider { position: absolute; background-color: #ebebeb; border: 1px solid #fff; width: 10px; height: 125px; left: 10px; bottom: 40px; top: auto !important; z-index: 7; } @media (max-width: 767px) { .map--map .zoom-slider { width: 23px; height: 49px; background-color: transparent; border-width: 0px; display: flex; flex-direction: column; } } @media (max-width: 767px) { .map--map .zoom-in { order: 1; } .map--map .zoom-in:after { content: ''; display: block; width: 6%; height: 40%; position: absolute; top: 30%; left: 47%; background-color: #000; } } @media (max-width: 767px) { .map--map .zoom-out { margin-bottom: 3px; order: 2; } } .map--map .slider-handle { text-align: center; -webkit-user-select: none; -moz-user-select: none; width: 12px; height: 16px; background-color: #000; background-image: linear-gradient(0deg, #000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; margin-left: -2px; } @media (max-width: 767px) { .map--map .slider-handle { display: none; } } .map--map .slider-button { display: block; width: 23px; height: 23px; position: relative; background-color: #c6c5c3; border: 1px solid #fff; cursor: pointer; } @media (min-width: 768px) { .map--map .slider-button { display: none; } } .map--map .slider-button:before { content: ''; display: block; width: 40%; height: 6%; position: absolute; top: 47%; left: 30%; background-color: #000; } .map--map .slider-button-disabled:before, .map--map .slider-button-disabled:after { background-color: #8e8e8e; } .map--map.google-map .zoom-slider { width: 23px; height: 49px; background-color: transparent; border-width: 0px; display: flex; flex-direction: column; } .map--map.google-map .zoom-out { margin-bottom: 3px; order: 2; } .map--map.google-map .zoom-in { order: 1; } .map--map.google-map .zoom-in:after { content: ''; display: block; width: 6%; height: 40%; position: absolute; top: 30%; left: 47%; background-color: #000; } .map--map.google-map .slider-button { display: block; width: 23px; height: 23px; position: relative; background-color: #c6c5c3; border: 1px solid #fff; cursor: pointer; } .map--map.google-map .slider-button:before { content: ''; display: block; width: 40%; height: 6%; position: absolute; top: 47%; left: 30%; background-color: #000; } .map--map.google-map .slider-button-disabled:before, .map--map.google-map .slider-button-disabled:after { background-color: #8e8e8e; } .map--map.google-map .slider-handle { display: none; } @media (min-width: 960px) { .map--map.first { width: 66%; float: left; clear: none; } } .map--controls { display: block; position: relative; width: auto; max-width: 300px; height: 30px; font-size: 0; line-height: 1; padding: 5px 0px; margin: 10px 0; } @media (min-width: 768px) { .map--controls { float: none; margin: 8px 0 20px 0; } } @media (min-width: 960px) { .map--controls { display: none; } } @media print { .map--controls { display: none; } } .map--controls.fixed { position: fixed; top: 0px; left: 0px; width: 100%; max-width: none; height: 40px; margin: 0 0; background-color: #efefef; z-index: 20; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } .map--controls.fixed a { display: table-cell; width: 1%; height: 30px; line-height: 31px; text-align: center; } .map--controls a { cursor: pointer; display: inline-block; height: 20px; line-height: 21px; font-size: 15.4px; text-decoration: none; padding: 0px 12px; border-right: 1px solid #000; } .map--controls a:last-child { border-right-width: 0px; } .map--controls a.active { font-weight: 700; } .map--options { width: 100%; float: left; position: relative; top: 3px; } @media (min-width: 960px) { .map--options:after { display: none; } } @media (min-width: 768px) and (max-width: 959px) { .map--options { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; flex-basis: 0; } } @media (min-width: 960px) { .map--options { top: 0px; margin-left: 0px; padding-left: 5px; } } .map--options--legend { display: block; width: 100%; height: auto; position: relative; float: none; padding: 12px 15px 0 0; overflow: hidden; z-index: 1; cursor: pointer; } @media (min-width: 768px) and (max-width: 959px) { .map--options--legend { order: 1; } } @media (min-width: 768px) { .map--options--legend { width: auto; min-width: 110px; height: auto; display: inline-block; } } @media (min-width: 960px) { .map--options--legend { width: 40%; float: left; padding: 12px 0 0 0; } } .map--options--legend:after { content: ''; display: block; clear: left; } .map--options--legend.empty { display: none; } .map--options--legend .map-legend { overflow: hidden; } @media (min-width: 960px) { .map--options--legend .map-legend { max-width: 115px; } } .map--options--legend .map-legend-item { display: block; width: 16.66666667%; max-width: 17px; height: 19px; border-right: 2px solid #fff; overflow: hidden; line-height: 17px; float: left; } .map--options--legend .map-legend-item:nth-child(1n+6) { width: 0%; display: none; } .map--options--legend .map-legend-item:nth-child(1n+6) .map-legend-swatch { display: none; } .map--options--legend .map-legend-swatch { display: inline-block; width: 17px; height: 17px; margin-right: 2px; margin-bottom: 2px; float: left; } .map--options--year { display: block; width: 100%; float: none; position: relative; padding: 1px 0; white-space: nowrap; } @media (min-width: 960px) { .map--options--year:after { display: none; } } @media (min-width: 768px) and (max-width: 959px) { .map--options--year { order: 3; width: 100%; max-width: 250px; } } @media (min-width: 960px) { .map--options--year { width: 60%; float: left; } } .map--options--year.wide { width: auto; } .map--options--year.wide .year-slider { width: 80%; } .map--options--year.wide .year-slider:before { left: -20%; } @media (min-width: 768px) and (max-width: 959px) { .map--options--year.wide { width: 100%; } } @media (min-width: 960px) { .map--options--year.wide { width: 100%; } } .map--options--year .value { display: inline-block; float: left; height: 28px; line-height: 28px; padding: 0px 8px; font-size: 15px; } @media (min-width: 960px) { .map--options--cartogram { clear: left; } } .map--options--cartogram div { display: block; width: auto; position: relative; padding: 18px 0px 8px 8px; clear: both; } @media (min-width: 768px) and (max-width: 959px) { .map--options--cartogram div { order: 2; clear: none; foat: left; padding-top: 0; } } .map--options.active .map--options--legend { display: block; padding: 6px 8px 1px; } @media (min-width: 960px) { .map--options.active .map--options--legend:after { display: none; } } @media (min-width: 768px) { .map--options.active .map--options--legend { width: 250px; } } @media (min-width: 960px) { .map--options.active .map--options--legend { width: auto; float: none; } } .map--options.active .map--options--legend .map-legend { width: 100%; height: auto; overflow: visible; } @media (min-width: 960px) { .map--options.active .map--options--legend .map-legend { max-width: none; } } .map--options.active .map--options--legend .map-legend-item { width: 50%; max-width: none; height: auto; min-height: 19px; margin-bottom: 10px; float: left; font-size: 0.95em; } @media (min-width: 960px) { .map--options.active .map--options--legend .map-legend-item:after { display: none; } } .map--options.active .map--options--legend .map-legend-item:nth-child(odd) { clear: left; } .map--options.active .map--options--legend .map-legend-item:nth-child(1n+6) { width: 50%; display: block; } .map--options.active .map--options--legend .map-legend-item:nth-child(1n+6) .map-legend-swatch { display: inline-block; } .map--options.active .map--options--legend .map-legend-swatch { position: relative; top: 3px; width: 10px; height: 10px; margin-right: 5px; } .map--options.active .map--options--year { width: 100%; } .map--options.active .map--options--year .year-slider { width: 80%; } .map--options.active .map--options--year .year-slider:before { left: -20%; } .map--rank { width: 100%; clear: both; padding: 0px 5px 0px 6px; margin-bottom: 38px; } @media (min-width: 768px) { } @media (min-width: 960px) { } @media print { .map--rank { display: none; } } .map--rank--text { padding: 5px 0 10px 3px; position: relative; } .map--rank--text .crossref { vertical-align: super; font-style: italic; font-size: smaller; } .map--rank--text span > span { display: block; position: relative; left: 0px; line-height: 1; font-size: 34px; font-weight: 300; } @media (min-width: 960px) { .map--rank--text span > span { left: -5px; } } .map--rank--text em { display: inline-block; position: relative; top: -4px; left: 9px; line-height: 1; font-size: 0.9em; font-weight: 400; } @media (min-width: 960px) { .map--rank--text em { left: 0px; } } .map--rank--header { width: 100%; padding: 0 0 12px 0; border-collapse: separate; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; } .map--rank--header > a, .map--rank--header > span { display: table-cell; width: 59%; height: 25px; font-weight: 700; font-size: 0.9em; vertical-align: middle; text-decoration: none; cursor: pointer; padding: 3px 5px; -webkit-flex: 1 1 auto; flex: 1 1 auto; } @media (min-width: 960px) { .map--rank--header > a, .map--rank--header > span { width: 59%; } } .map--rank--header > a a, .map--rank--header > span a { text-decoration: none; cursor: pointer; } .map--rank--header > a.space, .map--rank--header > span.space { width: 1%; padding: 3px; background-color: transparent; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .map--rank--header > a:last-child, .map--rank--header > span:last-child { width: 40%; } @media (min-width: 960px) { .map--rank--header > a:last-child, .map--rank--header > span:last-child { width: 40%; } } .map--rank--header > a .disable, .map--rank--header > span .disable { color: #aaa; } .map--rank--header span::first-letter { text-transform: uppercase; } .map--rank--header .sort-separator { cursor: auto; } .map--rank--content { padding: 0 0 0 3px; height: auto; width: 100% !important; } @media (min-width: 960px) { .map--rank--content { height: 215px; padding: 0 11px 0 6px; } } .map--rank--content .ranking--table { display: table; border-collapse: collapse; width: 100%; } .map--rank--content .ranking--row { display: table-row; text-decoration: none; cursor: pointer; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; } .map--rank--content .ranking--row:hover { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } @media (max-width: 959px) { .map--rank--content .ranking--row { font-size: 15.4px; } .map--rank--content .ranking--row:nth-child(even) { background-color: #efefef; } .map--rank--content .ranking--row:nth-child(even):hover { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } } .map--rank--content .ranking--row:hover, .map--rank--content .ranking--row.highlight { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .map--rank--content .ranking--row--no-data { color: #969696; } .map--rank--content .ranking--row--no-data:hover, .map--rank--content .ranking--row--no-data.highlight { color: #fff; } .map--rank--content .ranking--cell { width: 60%; vertical-align: top; padding: 2px 3px 2px 2px; font-size: 0.9em; -webkit-flex: 1 1 auto; flex: 1 1 auto; } .map--rank--content .ranking--cell:last-child { width: 40%; padding: 2px 2px 2px 6px; } .map--rank--content .ranking--cell .percentage { display: none; } .map--rank--content .ranking--cell .crossref { vertical-align: super; font-style: italic; font-size: smaller; } .map--rank--content .jspContainer { width: 100% !important; } .map--rank--content .jspPane { width: 100% !important; left: 0px !important; position: relative; } .map--rank--content .jspVerticalBar { width: 12px; right: 1px; right: -3px; background-color: transparent; } .map--rank--content .jspTrack { width: 6px; background-color: #efefef; } .map--rank--content .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; background-repeat: repeat; } .map--other { width: 100%; float: none; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } @media (min-width: 960px) { } .map--info-point { text-align: right; } .map--info-point--link { display: inline-block; position: relative; top: -10px; font-size: 0.85em; text-decoration: none; cursor: pointer; } @media (min-width: 960px) { .map .clearAfter:after { display: none; } } .map--indicator-menu { padding: 0px 8px; } @media (min-width: 768px) and (max-width: 959px) { .map--indicator-menu { max-width: 300px; } } .map--indicator-menu .menu-pulldown { margin-left: -22px; margin-right: -8px; margin-bottom: 12px; } .map--indicator-menu .menu-submenu { overflow: hidden; max-height: 0; } .map--indicator-menu .menu-submenu.active { max-height: 550px; } .map--indicator-menu .menu-title { margin-bottom: 10px; } .map--indicator-menu .menu-title.no-margin { margin-bottom: 0; } .map--indicator-menu--title { display: inline-block; margin-right: 15px; margin-bottom: 0; text-decoration: none; font-size: 0.95em; cursor: pointer; } .map--indicator-menu--title:after { display: block; content: attr(data-title); font-weight: 700; height: 1px; color: transparent; overflow: hidden; visibility: hidden; margin-bottom: -1px; } .map--indicator-menu--title:hover, .map--indicator-menu--title.active { font-weight: 700; } .map--indicator-menu--title.disabled { display: none; } .map--indicator-menu--content { overflow: hidden; height: auto; max-height: 0; } .map--indicator-menu--content.active { max-height: 550px; } .map--indicator-menu--content.disabled { display: none; } .map--indicator-menu .chosen-drop { max-height: none; } .map--arrow-switcher { display: none; } .map--arrow-switcher--geo { margin: 0 0 0 0; padding: 5px 0 0 0; font-weight: 400; font-size: 20px; } .map--arrow-switcher--list { display: flex; justify-content: flex-start; margin: 0 0 0 0; padding: 0 0 0 0; list-style: none; } .map--arrow-switcher--item { margin: 0 0 0 0; padding: 0 25px 20px 0; } .map--arrow-switcher--link { text-decoration: none; font-size: 0.8rem; cursor: pointer; } .map--arrow-switcher--link:hover, .map--arrow-switcher--link.active { font-weight: 700; } #map-container { position: relative; } #map-container, #map-container > .map-wrapper { min-height: 150px; } .hide-this { display: none !important; } .cartogram--text { display: none; float: right; width: 50%; height: auto; padding: 0 15px 0 45px; } @media (min-width: 768px) { .cartogram--text { display: block; } } @media (min-width: 960px) { .cartogram--text { width: 33%; padding: 0 15px; float: left; } } .cartogram--controls { display: block; width: 100%; text-align: center; padding: 5px 0px; } @media print { .cartogram--controls { display: none; } } .cartogram--controls.disabled { display: none; } .cartogram--controls ul, .cartogram--controls li { list-style: none; margin: 0 0 0 0; padding: 0 0 0 0; } .cartogram--controls li { display: inline-block; } .cartogram--controls--link { text-transform: uppercase; display: inline-block; position: relative; margin: 0px 7px; text-decoration: none; cursor: pointer; font-weight: 700; } .cartogram--controls--link.arr-left { padding-left: 15px; } .cartogram--controls--link.arr-left:before { content: ''; display: block; width: 0px; height: 0px; border-style: solid; border-width: 7px 7px 7px 0px; border-color: transparent #1d1d1b transparent transparent; position: absolute; top: 4px; left: 0px; } .cartogram--controls--link.arr-right { padding-right: 15px; } .cartogram--controls--link.arr-right:before { content: ''; display: block; width: 0px; height: 0px; border-style: solid; border-width: 7px 0px 7px 7px; border-color: transparent transparent transparent #1d1d1b; position: absolute; top: 4px; right: 0px; } .cartogram--controls--link.disabled { cursor: default; color: #d3d3d3; } .cartogram--controls--link.disabled:hover { color: #d3d3d3; } .cartogram--controls--link.disabled.arr-left:before { border-color: transparent #d3d3d3 transparent transparent; } .cartogram--controls--link.disabled.arr-right:before { border-color: transparent transparent transparent #d3d3d3; } .cartogram--menu { width: 100%; position: relative; } @media (min-width: 960px) { .cartogram--menu { float: right; position: relative; width: 33%; max-width: 300px; } } .cartogram--selector .component--pulldown-wrapper { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; } @media (min-width: 768px) { .cartogram--selector .component--pulldown-wrapper { -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; } } @media (min-width: 960px) { .cartogram--selector .component--pulldown-wrapper { -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; } } .cartogram--selector .component--pulldown-wrapper > * { max-width: 300px; } .cartogram--submenu { width: 100%; padding: 16px 28px 8px; } @media (min-width: 960px) { .cartogram--submenu { width: auto; max-width: 300px; padding: 0 0; } } .cartogram--submenu ul { padding: 0 0; list-style: none; position: relative; } @media (min-width: 960px) { .cartogram--submenu ul { padding: 8px 0; } } .cartogram--submenu li { padding: 2px 0; margin-bottom: 0px; } @media (min-width: 960px) { .cartogram--submenu li { padding: 0 0 5px 0; margin-bottom: 5px; } } .cartogram--submenu a { display: block; padding: 2px 0px 2px 22px; font-weight: 400; text-decoration: none; cursor: pointer; } .cartogram--submenu a.active, .cartogram--submenu a:hover { font-weight: 700; text-decoration: none; cursor: pointer; } .cartogram--submenu .slick-slide a { padding: 2px 10px; } .cartogram--submenu .cartogram--slick-prev { display: block; width: 26px; height: 100%; position: absolute; top: 0px; left: -28px; padding: 0 0 0 0; margin: 0 0 0 0; border-right: 1px solid #868685; cursor: pointer; } .cartogram--submenu .cartogram--slick-prev:before { content: ''; display: block; width: 9px; height: 12px; background: url('../assets/arrows.jpg') 0px 0px no-repeat; position: absolute; top: 50%; margin-top: -6px; left: 0px; } .cartogram--submenu .cartogram--slick-prev.slick-disabled { display: none; } .cartogram--submenu .cartogram--slick-next { display: block; width: 26px; height: 100%; position: absolute; top: 0px; right: -28px; padding: 0 0 0 0; margin: 0 0 0 0; border-left: 1px solid #868685; cursor: pointer; } .cartogram--submenu .cartogram--slick-next:before { content: ''; display: block; width: 9px; height: 12px; background: url('../assets/arrows.jpg') -9px 0px no-repeat; position: absolute; top: 50%; margin-top: -6px; right: 0px; } .cartogram--submenu .cartogram--slick-next.slick-disabled { display: none; } .cartogram .map--header { position: relative; margin-top: 15px; margin-bottom: 15px; float: none; } @media (min-width: 768px) { .cartogram .map--header { float: left; margin-top: 15px; margin-bottom: 0; } } @media (min-width: 960px) { .cartogram .map--header { position: absolute; top: 0; left: 0; } } .cartogram .map--map { clear: none; } .cartogram .map--rank { clear: none; width: 100%; float: left; padding: 0 15px; } @media (min-width: 768px) { .cartogram .map--rank { width: 50%; } } .cartogram .map--other { display: none; width: 50%; clear: right; float: right; margin-top: 25px; padding: 0 15px 0 45px; } @media (min-width: 768px) { .cartogram .map--other { display: block; } } @media (min-width: 960px) { .cartogram .map--other { width: 50%; clear: none; margin-top: 0; } } .cartogram .map--text { width: 0; } .cartogram .map--side { display: inline-block; } @media (min-width: 960px) { .cartogram .map--side-cont { width: 66%; } } .cartogram .map--controls { display: none; } @media (min-width: 960px) { .cartogram .download { margin-top: 0; } } .cartogram .download--header { white-space: normal; } .cartogram .download--content ul { padding: 12px 0px 12px 21px; } .cartogram .download--content li { display: list-item; width: auto; padding: 0; text-align: left; } .cartogram .download .downloadMap { display: block; margin-right: 10px; } .cartogram .download .downloadMap.waiting { background: url('../images/ajax-loader.gif') right center no-repeat; background-size: auto 100%; } .cartogram .suggested--header { display: block; } .cartogram .suggested--list { display: block; } .layout-map.cartogram .share { position: relative; width: auto; padding: 5px 12px 0px 22px; margin: 0 0; background-color: transparent; -webkit-box-shadow: 0 0 0 0 transparent; -moz-box-shadow: 0 0 0 0 transparent; -ms-box-shadow: 0 0 0 0 transparent; -o-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent; } .layout-map.cartogram .share--header ul { padding: 15px 0px 0px 0px; } .layout-map.cartogram .share--header li { width: auto; text-align: left; padding: 0px 10px 0px 0px; border-right: 0; height: auto; text-transform: uppercase; } .layout-map.cartogram .share--header li > span { display: inline-block; } .layout-map.cartogram .share--header span { font-size: 14px; font-weight: 300; } .layout-map.cartogram .share--header a { font-size: 14px; top: 0; } .layout-map.cartogram .share--header a.invertText:hover { color: #fff; } .layout-map.cartogram .share--header a.share--link { margin-right: 0; display: block; top: 0; } .layout-map.cartogram .share--content .textarea { margin: 5px 10px 10px 0; } .tellmap--map--country-url { padding: 5px 0 0 0; text-align: center; } .tellmap--map--country-url a { cursor: pointer; } .map--drilldown > div { display: flex; justify-content: space-between; flex-wrap: wrap; } .map--drilldown a { display: block; padding: 5px 0px; font-weight: 400; font-size: 13px; text-decoration: none; text-align: center; cursor: pointer; } .map--drilldown a:hover, .map--drilldown a.inactive { text-decoration: none; cursor: pointer; font-weight: 700; } .map--drilldown #editionButtons { padding: 10px 0; } /* Country profiles */ .map--profile-datasets { width: 100%; float: left; position: relative; } @media (min-width: 768px) { .map--profile-datasets { width: 66%; } } .map--profile-datasets .country--cs.hasCustomSelect { left: 0px; right: auto; } .map--profile-datasets .cs-category--wrapper { position: relative; margin-top: 12px; margin-bottom: 12px; } .map--profile-datasets h2 { margin-top: 24px; margin-bottom: 12px; } .map--cs { width: 100%; max-width: 300px; } .map--cs--wrapper { position: relative; width: auto; margin-bottom: 12px; } @media (min-width: 768px) { .map--cs--wrapper { width: 33%; max-width: 300px; float: right; } } .map--cs.hasCustomSelect { left: 0px; } .map--profile-side { float: none; width: 100%; position: relative; z-index: 1; clear: right; } @media (min-width: 768px) { .map--profile-side { float: right; width: 33%; max-width: 300px; } } .map--profile-side .slick-dots { padding-left: 0; line-height: 1; text-align: center; padding-top: 3px; } .map--profile-side .slick-dots li { display: inline-block; position: relative; list-style: none; margin: 0 5px 0; width: 8px; height: 8px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; background-color: #969696; cursor: pointer; } .map--profile-side .slick-dots li:hover, .map--profile-side .slick-dots li.slick-active { background-color: #000; } .map--profile-side .slick-dots button { opacity: 0; } .profile--carousel:focus, .profile--carousel *:focus { outline: none; } .profile--photo { width: 100%; } .profile--photo img { width: auto; max-width: 100%; height: auto; display: block; margin: 0 auto; } @media (min-width: 768px) { .profile--photo img { max-width: 240px; } } .profile--photo div { line-height: 1; margin: 0 auto; } .profile--photo div:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } @media (min-width: 768px) { .profile--photo div { max-width: 240px; } } .profile--photo--title { display: inline-block; float: left; line-height: 1.2; padding: 5px 0 0 0; font-size: 12.6px; color: #666; } .profile--photo--author { display: inline-block; float: right; line-height: 1.2; padding: 5px 0 0 0; } .profile--photo--author a { text-decoration: none; font-size: 12.6px; color: #969696; cursor: pointer; } .profile--photo--author a:hover { text-decoration: none; color: #666; } .profile--values { margin: 12px 0; width: 100%; } @media (min-width: 768px) { .profile--values { max-width: 240px; margin: 12px auto; } } .profile--values td { vertical-align: top; padding-bottom: 5px; font-size: 12.6px; } .profile--values td:first-child { padding-right: 5px; } .profile--values td:last-child { text-align: right; white-space: nowrap; } .profile--textbox { margin: 12px 0; width: 100%; font-size: 12.6px; } @media (min-width: 768px) { .profile--textbox { max-width: 240px; margin: 12px auto; } } .profile--textbox p { margin-bottom: 12px; } .profile--content { float: none; width: 100%; position: relative; clear: both; } @media (min-width: 960px) { .profile--content { width: 66%; float: left; clear: left; } } .profile--tables { margin-bottom: 36px; } .profile--rank { -webkit-appearance: none; width: 100px; margin: 0; display: block; } .profile--rank:focus { outline: none; } .profile--rank::-webkit-slider-runnable-track { width: 100px; height: 12px; background: #efefef; } .profile--rank::-webkit-slider-thumb { height: 12px; width: 5px; background: #000; -webkit-appearance: none; margin-bottom: -6px; } .profile--rank:focus::-webkit-slider-runnable-track { background: #efefef; } .profile--rank::-moz-range-track { width: 100px; height: 12px; background: #efefef; } .profile--rank::-moz-range-thumb { height: 12px; width: 5px; background: #000; margin-bottom: -6px; } .profile--rank::-ms-track { width: 100px; height: 12px; background: transparent; color: transparent; } .profile--rank::-ms-fill-lower { background: #efefef; } .profile--rank::-ms-fill-upper { background: #efefef; } .profile--rank::-ms-thumb { height: 12px; width: 5px; background: #000; margin-bottom: -6px; } .profile--rank:focus::-ms-fill-lower { background: #efefef; } .profile--rank:focus::-ms-fill-upper { background: #efefef; } .profile--rank-wrapper { overflow: hidden; -webkit-transition: 300ms height; -moz-transition: 300ms height; -ms-transition: 300ms height; -o-transition: 300ms height; transition: 300ms height; } .profile--show-more { display: inline-block; text-decoration: none; cursor: pointer; margin-top: 12px; margin-bottom: 12px; } .profile--ranks { width: 100%; position: relative; border: 1px solid #fff; border-collapse: separate; border-spacing: 14px 0px; } .profile--ranks--link { text-decoration: none; cursor: pointer; padding: 3px 7px; line-height: 1.2; } .profile--ranks--sort { text-decoration: underline; cursor: pointer; } .profile--ranks th { border-bottom: 1px solid #8e8e8d; text-align: left; font-weight: 400; white-space: nowrap; padding: 0px 10px 0px 0px; } .profile--ranks td { font-size: 12.6px; vertical-align: top; padding-top: 5px; padding-bottom: 5px; } .profile--ranks td:nth-child(1), .profile--ranks td:nth-child(3) { white-space: nowrap; } .profile--ranks td .invertText { font-size: 14px; font-weight: 400; margin-right: 5px; margin-top: 3px; background-color: #000; } .profile--ranks td .invertText:hover { color: #fff; background-color: #000; } .profile--ranks td:last-child a { text-decoration: none; cursor: pointer; } .profile--ranks td:last-child a:hover { color: #fff; } .profile--ranks td a { cursor: pointer; } .profile--share { width: auto; position: relative; padding: 0 0; margin: 0 0 24px; } @media (min-width: 768px) { .profile--share { max-width: 240px; margin: 0 auto 24px; } } .profile--share--header { padding: 0 0; } .profile--share--header ul { padding: 15px 0px 0px 0px; } .profile--share--header li { display: table-cell; vertical-align: middle; line-height: 1; margin: 0 0 0 0; padding: 0px 10px; text-align: left; white-space: nowrap; padding: 0px 10px 0px 0px; border-right: 0; height: auto; text-transform: uppercase; } .profile--share--header span { display: inline-block; height: 25px; position: relative; top: -2px; line-height: 25px; margin-right: 10px; font-size: 14px; font-weight: 300; } .profile--share--header a { display: block; position: relative; height: 25px; line-height: 25px; margin: 0px 0px; text-decoration: none; font-size: 14px; font-weight: 300; cursor: pointer; top: 0px; } .profile--share--header a.share--link { display: block; } .profile--share--link { width: 25px; height: 25px; margin: 0 0 0 0; background: url('../assets/social.png') 0 0 no-repeat; text-indent: -1000000px; } .profile--share--link.facebook { background-position: 0 0; } .profile--share--link.twitter { background-position: -25px 0; } .profile--share--link.linkedin { background-position: -50px 0; } .profile--share--link.gplus { background-position: -75px 0; } .profile--share--content { display: block; box-sizing: content-box; width: 100%; padding: 1px 0; height: 0; overflow: hidden; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } .profile--share--content .textarea { display: block; width: auto; height: auto; overflow: auto; resize: none; margin: 5px 0px; padding: 8px; border: 1px solid #868685; word-wrap: break-word; } .profile--datasets:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .profile--datasets--line { position: relative; padding-bottom: 7px; min-height: 39px; } .profile--datasets--line:after { content: ''; display: block; width: 100%; height: 1px; clear: both; } .profile--datasets--line:first-child span { text-align: left; font-weight: 400; white-space: nowrap; } .profile--datasets--line:first-child span:after { content: ''; display: block; width: 100%; height: 1px; background-color: #8e8e8d; } .profile--datasets--line span { display: block; position: relative; border-width: 0 7px 1px; border-style: solid; border-color: transparent; float: left; font-size: 12.6px; } .profile--datasets--line span:nth-child(1) { width: 33%; } .profile--datasets--line span:nth-child(2) { width: 18%; } .profile--datasets--line span:nth-child(3) { width: 18%; } .profile--datasets--line span:nth-child(4) { width: 30%; } .profile--datasets--line .invertText { font-size: 14px; font-weight: 400; margin-right: 5px; margin-top: 0px; margin-bottom: 3px; background-color: #000; } .profile--datasets--line .invertText:hover { color: #fff; background-color: #000; } .profile--datasets--line .profile--rank { width: 100%; max-width: 100px; } .profile--datasets--no-rank span:nth-child(1) { width: 51%; } .profile--datasets--no-rank span:nth-child(2) { width: 18%; } .profile--datasets--no-rank span:nth-child(3) { width: 30%; } .profile--datasets-loading { height: 0px; overflow: hidden; z-index: 999; } .profile--datasets-loading.active { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.75); background-image: url(../images/ajax-loader.gif); background-position: center 200px; background-repeat: no-repeat; z-index: 999; } .map-label-layer { width: 100%; height: 100%; pointer-events: none; overflow: hidden; } .map-label-layer .active { display: none !important; } .map-label { background-color: #000; color: #fff; transform: translate(-50%, -10px); white-space: nowrap; height: 16px; line-height: 12px; border-radius: 2px; padding: 2px; font-size: 10px; } .map-label[data-size="0"] { display: none !important; } .map-label[data-size="1"]:before { content: attr(data-label); } #map-container:after, #map-container > #dataowner { position: absolute; right: 5px; bottom: 5px; font-size: 11px; color: #969696; } #map-container:after a, #map-container > #dataowner a { cursor: pointer; } #map-container:after, #map-container > #dataownernote { display: none; background-color: #000; -webkit-box-shadow: rgba(0, 0, 0, 0.6) 2px 2px 4px; -moz-box-shadow: rgba(0, 0, 0, 0.6) 2px 2px 4px; box-shadow: rgba(0, 0, 0, 0.6) 2px 2px 4px; padding: 6px 12px 6px 12px; border: none; width: 350px; max-width: 100%; position: absolute; right: 5px; bottom: 30px; font-size: 12px; color: #fff; } #map-container:after:before, #map-container > #dataownernote:before { content: ""; position: absolute; bottom: -11px; right: 0px; border-style: solid; border-width: 8px 8px 0 0; border-color: #000 transparent transparent transparent; } #map-container:after a, #map-container > #dataownernote a { cursor: pointer; } #map-container:after { content: attr(caption); } #map-container { position: relative; width: 100%; height: 0px; padding-top: 57.1%; } #map-container .map-wrapper { position: absolute !important; top: 0px; left: 0px; width: 100% !important; height: 100% !important; } #map-container .map-container { width: 100%; height: 100% !important; } #map-container > #dataowner { z-index: 1; margin-bottom: 0; } #map-container > #dataowner.hovered { cursor: default; } #map-container > #dataownernote { z-index: 19; margin-bottom: 0; } #map-container > #dataowner:hover { color: #89909a; } #map-container > #dataowner:hover + #dataownernote { display: block; } #disclaimer { width: 60%; float: left; font-size: 8px; } #disclaimer + a { display: block; position: absolute; bottom: 0; right: 0; max-width: 39%; float: right; color: #969696; text-decoration: none; cursor: pointer; } .zoom-slider { position: absolute; background-color: #ebebeb; border: 1px solid #fff; width: 10px; height: 125px; left: 10px; bottom: 25px; z-index: 7; } .slider-handle { text-align: center; -webkit-user-select: none; -moz-user-select: none; width: 12px; height: 16px; background-color: #000; background-image: linear-gradient(0deg, #000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; margin-left: -2px; } .map-highlight-layer { width: 100%; } @media (min-width: 960px) { .map-highlight-layer { width: calc(300%); } } .map-tooltip { z-index: 19; pointer-events: none; background-color: #000; -webkit-box-shadow: rgba(0, 0, 0, 0.6) 2px 2px 4px; -moz-box-shadow: rgba(0, 0, 0, 0.6) 2px 2px 4px; box-shadow: rgba(0, 0, 0, 0.6) 2px 2px 4px; padding: 6px 12px 6px 12px; min-width: 75px; max-width: 330px; display: table; -webkit-transition: left,top; -moz-transition: left,top; -o-transition: left,top; -ms-transition: left,top; transition: left,top; border: none; line-height: 1.6; font-size: 15px; } @media (min-width: 768px) { .map-tooltip { font-size: 13px; } } @-moz-document url-prefix() { .map-tooltip { display: block; width: 100%; max-width: -moz-max-content; } } .map-tooltip .label, .map-tooltip .value, .map-tooltip .info { line-height: 16px; max-width: 220px; color: #fff; } .map-tooltip .value { white-space: nowrap; } .map-tooltip .crossref { vertical-align: super; font-style: italic; font-size: smaller; } .map-tooltip .connector { position: absolute; left: 0; top: 60px; z-index: -1; border-left: #000 1px dashed; } .map-tooltip .key { line-height: 12px; font-size: 10px; color: #fff; padding: 2px 5px; position: absolute; left: 0; width: 42px; margin-left: -17px; margin-top: 33px; /* IE fallback */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#6f7277', EndColorStr='#b1b1b1'); /* IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#6f7277', EndColorStr='#b1b1b1')"; /* IE8 */ background-color: #000; z-index: 8; } @media (max-width: 767px) { .first .map-tooltip.anchor-right { transform: translate(-100%, 0); } } @media (max-width: 767px) { .first .map-tooltip.anchor-right .map-tooltip-tip { left: auto; right: 0; } .first .map-tooltip.anchor-right .map-tooltip-tip:before { border-width: 8px 0 0 8px; transform: translate(-100%, 0); } } @media (max-width: 767px) { .first .map-tooltip.anchor-right .key, .first .map-tooltip.anchor-right .v-connector { left: auto; right: 0; } } @media (max-width: 767px) { .first .map-tooltip.anchor-right .key { transform: translate(50%, 0); } } @media (max-width: 767px) { .first .embed-tooltip-update .map-tooltip.anchor-right { transform: translate(-100%, 0); } } @media (max-width: 767px) { .first .embed-tooltip-update .map-tooltip.anchor-right .map-tooltip-tip { left: auto; right: 0; } .first .embed-tooltip-update .map-tooltip.anchor-right .map-tooltip-tip:before { border-width: 8px 0 0 8px; transform: translate(-100%, 0); } } @media (max-width: 767px) { .first .embed-tooltip-update .map-tooltip.anchor-right .key, .first .embed-tooltip-update .map-tooltip.anchor-right .v-connector { left: auto; right: 0; } } @media (max-width: 767px) { .first .embed-tooltip-update .map-tooltip.anchor-right .key { transform: translate(50%, 0); } } @media (max-width: 767px) { } @media (max-width: 767px) { } .map-hidden-tooltip { display: none; } .map-tooltip-anchor { position: absolute; bottom: -15px; left: 0; } .map-tooltip-tip { position: absolute; bottom: 0; left: 0; } .map-tooltip-tip:before { position: absolute; content: ""; border-style: solid; border-width: 8px 8px 0 0; border-color: #000 transparent transparent transparent; } /* edges */ .embed-tooltip-update .map-tooltip.anchor-top { top: 0px !important; } .embed-tooltip-update .map-tooltip.anchor-top .map-tooltip-tip, .embed-tooltip-update .map-tooltip.anchor-right .map-tooltip-tip { display: none; } .map-wrapper .map-tooltip-tip { -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000'); box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6); } .pin { width: 20px; height: 24px; background: url(../images/infopoint_v2.png) center center no-repeat; margin-left: -10px; margin-top: -24px; } .pin:hover { background-image: url(../images/infopoint_hover.png); } .place { box-sizing: border-box; width: 16px; height: 16px; border-radius: 50%; border: 1px solid #fff; margin-left: -8px; margin-top: -8px; background-color: #e94e1b; cursor: pointer; } @media (min-width: 768px) { .place { width: 10px; height: 10px; margin-left: -5px; margin-top: -5px; } } .place:hover { background-color: #b22d09; } .placelabel { display: none; } .city { width: 8px; height: 8px; border-radius: 4px; border: 1px solid #434861; margin-left: -4px; margin-top: -4px; background-color: white; } .citylabel { position: relative; color: white; margin: 0; margin-left: -50%; padding: 0; font-size: 13px; line-height: 1.25; text-shadow: 1px 1px 0 #434861, -1px 1px 0 #434861, -1px -1px 0 #434861, 1px -1px 0 #434861; -moz-text-shadow: 1px 1px 0 #434861, -1px 1px 0 #434861, -1px -1px 0 #434861, 1px -1px 0 #434861; -webkit-text-shadow: 1px 1px 0 #434861, -1px 1px 0 #434861, -1px -1px 0 #434861, 1px -1px 0 #434861; filter: glow(color=#434861, strength=1); } #busy { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9; background: url(../images/ajax-loader.gif) no-repeat center center; } .year-slider { position: relative; height: 1px; width: 85%; float: right; background: #8e8e8d; margin: 28px 0 10px; -webkit-transition: width 300ms; -moz-transition: width 300ms; -ms-transition: width 300ms; -o-transition: width 300ms; transition: width 300ms; } @media (min-width: 768px) { .year-slider { margin: 20px 0 10px; } } @media (min-width: 960px) { .year-slider { width: 75%; } } .year-slider:before { content: attr(data-value); position: absolute; top: -11px; left: -20%; -webkit-transition: left 300ms; -moz-transition: left 300ms; -ms-transition: left 300ms; -o-transition: left 300ms; transition: left 300ms; } @media (min-width: 960px) { .year-slider:before { left: -33%; } } .year-slider:after { content: ''; display: block; clear: both; } .year-slider .slider-button { display: none; } .year-slider .slider-labels { display: none; } .year-slider .slider-handle { width: 9px; height: 9px; background: #1d1d1b; border-radius: 50%; margin-top: -4px; } @media (max-width: 960px) { .year-slider .slider-handle { width: 21px; height: 21px; margin-top: -10px; } } .year-slider .slider-handle:hover, .year-slider .slider-handle:active { width: 15px; height: 15px; margin-top: -7px; } @media (max-width: 960px) { .year-slider .slider-handle:hover, .year-slider .slider-handle:active { width: 21px; height: 21px; margin-top: -10px; } } .year-slider .slider-value { display: none; position: relative; top: -25px; left: -100%; width: 300%; text-align: center; z-index: 1; } @media (min-width: 768px) { .year-slider .slider-value { top: -19px; } } .map-info-layer { z-index: 1; } /* Place's tooltip */ .map-tooltip-place { display: flex; align-items: center; width: auto; margin: -6px -12px; } .map-tooltip-place--text { color: #fff; padding: 5px 10px; } .map-tooltip-place--text p, .map-tooltip-place--text h4 { margin: 0 0 0 0; color: #fff; font-size: 12px; line-height: 1.5; } .map-tooltip-place--image img { display: block; width: 100px; height: 100px; } .mw-chart-wrapper { clear: both; } .mw-chart-wrapper:after { content: ''; display: block; clear: both; } .mw-chart-title { font-size: 16px; font-weight: bold; } .mw-chart-title p { margin-bottom: 0px; } .mw-chart { width: 100%; padding: 10px; } .tellmap--text .mw-chart-wrapper > .mw-chart { font-size: 0px !important; } @media (min-width: 768px) { .mw-chart .chart-wrapper { height: 200px !important; } } @media (min-width: 768px) { .mw-chart[data-chart-type="bubble"] .chart-wrapper { height: 300px !important; } } .mw-chart .map-tooltip { min-width: 110px; max-width: none; float: left; } .mw-chart .map-tooltip .label { max-width: none; line-height: 1.5; } @media (min-width: 550px) { .mw-chart .map-tooltip .label { white-space: nowrap; } } .mw-chart .map-tooltip .v-connector { position: absolute; left: 0; top: 60px; z-index: -1; border-left: #000 1px dashed; } .mw-chart .map-tooltip .key { width: 45px; line-height: 1.2; font-size: 12px !important; margin-left: -22px; text-align: center; } .mw-chart .chart-wrapper .map-tooltip { color: #fff !important; } .mw-chart .chart-wrapper .map-tooltip * { color: #fff !important; } .chart-container { width: 100%; height: auto; } @media (min-width: 768px) { .chart-container { width: 60%; float: left; } } .chart-wrapper .chart-container .highcharts-container * { font-size: 10px !important; } .chart-container * { font-family: 'Open Sans', sans-serif !important; } .chart-wrapper:before { position: absolute; left: 80px; bottom: -15px; z-index: 1; font-size: 8pt; } .chart-wrapper[data-x-axis-title], .chart-wrapper[data-z-axis-title] { border-bottom: 15px solid transparent; } .chart-wrapper[data-x-axis-title][data-z-axis-title] { border-bottom: 30px solid transparent; } .chart-wrapper[data-x-axis-title]:before { content: attr(data-x-axis-title); } .chart-wrapper[data-z-axis-title]:before { content: "Area: " attr(data-z-axis-title); } .chart-wrapper[data-y-axis-title][data-z-axis-title]:before { white-space: pre; bottom: -30px; line-height: 15px; content: "Axis: " attr(data-x-axis-title) "\a" "Area: " attr(data-z-axis-title); } .chart-wrapper:after { left: 0; top: 100%; content: attr(data-y-axis-title); position: absolute; font-size: 8pt; width: 100%; text-align: center; -webkit-transform: rotate(-90deg); -webkit-transform-origin: -20px 0; -moz-transform: rotate(-90deg); -moz-transform-origin: -20px 0; transform: rotate(-90deg); transform-origin: -20px 0; } .chart-legend { width: 100%; height: auto; margin-top: 24px; position: relative; } @media (min-width: 768px) { .chart-legend { width: 40%; height: 190px; float: right; text-align: right; } } .mw-chart[data-chart-type="bubble"] .chart-legend { height: 290px; } .chart-legend-items { overflow-y: auto; max-height: 100%; /*160px;*/ } .mw-chart[data-chart-type="bubble"] .chart-legend-items { max-height: 260px; } .chart-legend-item, .chart-legend-interactive { padding-left: 20px; padding-right: 20px; margin-bottom: 8px; position: relative; line-height: 1 !important; } .chart-legend-item > * { display: inline-block; } .chart-legend-label { width: 92%; min-width: 140px; max-width: 500px; padding-left: 5px !important; margin-left: 15px; position: relative; top: 4px; font-size: 13px; line-height: 1.4 !important; overflow: hidden; text-overflow: ellipsis; color: #000; } @media (min-width: 768px) { .chart-legend-label { max-width: none; margin-left: 0px; text-align: left; top: 2px; } } .chart-legend-swatch { position: absolute; width: 12px; margin-right: 10px; top: 11px; left: 18px; } .chart-series-column.chart-legend-swatch, .chart-series-bar.chart-legend-swatch { border-top: 12px solid; } .chart-series-line.chart-legend-swatch { height: 2px; border-top: 2px solid; } .chart-series-pie.chart-legend-swatch, .chart-series-bubble.chart-legend-swatch { border-radius: 5px; border: 5px solid; width: 0; height: 0; } .chart-legend-input { border: none; background-color: #eee; outline: none; top: 0px; padding: 2px; } .chart-legend-action { width: 16px; height: 16px; position: relative; text-align: center; cursor: pointer; } .chart-legend-add:before { font-size: 120%; color: #777; content: "+"; } .chart-legend .chart-legend-add { position: absolute; top: 2px; right: 0; } .chart-legend .chart-legend-remove { position: absolute; top: 4px; right: 0; } .chart-legend-remove:before { content: "x"; } .chart-legend-suggest { position: absolute; min-width: 135px; width: 75%; z-index: 1; max-height: 145px; overflow-x: hidden; padding: 0; margin: 0 0 0 0; right: 16px; border: 1px solid #c1c1c1; background-color: #fff; text-align: left; } .chart-indicators .chart-legend-suggest { width: 75%; left: 0; min-width: 135px; max-width: 500px; text-align: left; } @media (min-width: 768px) { .chart-indicators .chart-legend-suggest { right: 0; left: auto; width: 180px; } } .chart-legend-suggest li { width: 100%; white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; background-color: #fff; padding: 0; } .chart-legend-suggest li:hover, .chart-legend-suggest .selected { background-color: #000; color: #fff !important; } .chart-legend-suggest li:hover .chart-suggest-label, .chart-legend-suggest .selected .chart-suggest-label { color: #fff !important; } .chart-suggest-label { color: #000; padding: 4px 4px 0; cursor: pointer; } .chart-suggest-owner { color: #bbb; padding: 0 4px 4px; cursor: pointer; } .geoitems .chart-suggest-owner { display: none; } .chart-wrapper .year-slider { width: 135px; clear: right; position: relative; height: 1px; background: #E6E6E6; margin: 28px 0 10px; -webkit-transition: width 300ms; -moz-transition: width 300ms; -ms-transition: width 300ms; -o-transition: width 300ms; transition: width 300ms; } .chart-wrapper .year-slider:before { content: attr(data-value); position: absolute; top: -13px; left: -20%; -webkit-transition: left 300ms; -moz-transition: left 300ms; -ms-transition: left 300ms; -o-transition: left 300ms; transition: left 300ms; } @media (min-width: 960px) { .chart-wrapper .year-slider:before { left: -33%; } } .chart-wrapper .year-slider:after { content: ''; display: block; clear: both; } .chart-wrapper .year-slider .slider-button { display: none; } .chart-wrapper .year-slider .slider-labels { display: none; } .chart-wrapper .year-slider .slider-handle { width: 9px; height: 9px; background: #939AA4; border-radius: 50%; margin-top: -4px; } @media (max-width: 960px) { .chart-wrapper .year-slider .slider-handle { width: 21px; height: 21px; margin-top: -10px; } } .chart-wrapper .year-slider .slider-handle:hover, .chart-wrapper .year-slider .slider-handle:active { width: 15px; height: 15px; margin-top: -7px; } @media (max-width: 960px) { .chart-wrapper .year-slider .slider-handle:hover, .chart-wrapper .year-slider .slider-handle:active { width: 21px; height: 21px; margin-top: -10px; } } .mw-donut-chart .mw-chart .chart-legend-item { margin-bottom: 0; padding-bottom: 8px; } @media (min-width: 768px) { .mw-donut-chart .mw-chart .chart-container { width: 33%; } } .mw-donut-chart .mw-chart .chart-legend-swatch { top: 10px; } @media (min-width: 768px) { .mw-donut-chart .mw-chart .chart-legend-swatch { top: 7px; } } @media (min-width: 768px) { .mw-donut-chart .mw-chart .chart-legend { width: 66%; } } .mw-donut-chart .mw-chart .chart-legend-label { padding-left: 15px !important; } @media (min-width: 768px) { .mw-donut-chart .mw-chart .chart-legend-label { width: 96%; } } .mw-donut-chart .mw-chart .chart-legend-interactive { display: none; } .chart-title-right { position: relative; float: right; } .mw-editor-autosuggest { line-height: 24px !important; padding: 2px 4px 2px 4px; } .mw-editor-selector { position: absolute; left: 0; top: 28px; overflow: hidden; padding: 0 0 0 0; margin: 0 0 0 0; width: 100%; height: auto; max-height: 250px; background-color: #fff; list-style: none; border: 2px solid #efefef; z-index: 1; } .mw-editor-selector .jspVerticalBar { background: transparent; } .mw-editor-selector .jspTrack { position: relative; right: -3px; width: 6px; background: #efefef; } .mw-editor-selector .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#000 3px, #808080 4px); background-position: left top; background-size: 14px 4px; background-repeat: repeat; } .mw-editor-selector li { line-height: 1.4 !important; margin-right: 3px; font-weight: 400; } .mw-editor-selector li:hover, .mw-editor-selector li:hover *, .mw-editor-selector li.selected, .mw-editor-selector li.selected * { background: #000; color: #fff !important; } .flowTable { position: relative; width: 100%; height: auto; } .flowTable th, .flowTable td { display: block; width: 100%; position: relative; vertical-align: top; } @media (min-width: 600px) { .flowTable th, .flowTable td { display: table-cell; width: 50%; } } .flowTable p { margin-bottom: 0; } .flowTable .datatable { width: 100%; } .flowTable .datatable tr { cursor: pointer; } .flowTable .datatable th, .flowTable .datatable td { display: table-cell; width: auto; } .flowTable .datatable td { padding: 3px 5px; } .flowTable .datatable .numeric { text-align: right; white-space: nowrap; } .keyBox { line-height: 1.5; } .keyBox p { margin-bottom: 0; } .keyBox th div, .keyBox th p { font-size: 16px !important; } .keyBox .keyBoxHead p { font-size: 18px !important; } .keyBox .Dataset { vertical-align: top; text-align: left; } .keyBox .DatasetValue { text-align: center; padding-left: 15px; padding-right: 15px; } /* textbox from textbox narrative plugin feel free to add custom classes, list is managed in: - ckeditor settings - editor.textbox object - ckeditor_div.css - styles for editor, add dashed border for better manipulation */ #page .map--text .TextBox { width: 210px !important; float: right !important; margin: 5px 0 5px 0 !important; padding: 10px 0 !important; background: #009fe3 !important; line-height: 1.5 !important; font-style: normal !important; font-size: 11px !important; color: white !important; } #page .map--text .TextBox p a { color: yellow !important; } #page .map--text .TextBox .TextBoxHeader p, #page .map--text .TextBox .TextBoxContent p { margin: 0 !important; width: 176px !important; } #page .map--text .TextBox .TextBoxHeader { margin: 7px 17px 0 17px !important; font-size: 14px !important; } #page .map--text .TextBox .TextBoxHeader, #page .map--text .TextBox .TextBoxHeader p { color: #fff !important; } #page .map--text .TextBox .TextBoxContent { margin: 7px 17px 7px 17px !important; } #page .map--text .TextBox .TextBoxContent, #page .map--text .TextBox .TextBoxContent p { color: #fff !important; font-size: 11px !important; } #page .map--text .TextBox.leftAlign { float: left !important; margin-right: 20px !important; } #page .map--text .TextBox.TBoxStyleItalicEmpty { background: transparent !important; font-style: italic !important; color: #434861 !important; } #page .map--text .TextBox.TBoxStyleItalicEmpty p a { color: #434861 !important; text-decoration: underline; font-size: 11px !important; } #page .map--text .TextBox.TBoxStyleItalicEmpty p a:hover { color: #434861 !important; text-decoration: none; } #page .map--text .TextBox.TBoxStyleItalicEmpty .TextBoxHeader, #page .map--text .TextBox.TBoxStyleItalicEmpty .TextBoxHeader p { color: #1d71b8 !important; font-style: normal !important; } #page .map--text .TextBox.TBoxStyleItalicEmpty .TextBoxContent, #page .map--text .TextBox.TBoxStyleItalicEmpty .TextBoxContent p { color: #434861 !important; } /* embed styles */ .embed { position: relative; padding: 5px; font-size: 14px; } .embed .header { background: transparent; } .embed .header__content { border-style: solid; border-color: #c1c1c1; border-width: 1px 1px 0 1px; } .embed .header__content--padding { padding: 8px 10px 4px 10px; } .embed .header__link { text-decoration: none; cursor: pointer; } .embed .header__title { line-height: 1.2; padding-bottom: 4px; } .embed .header__banner { margin-bottom: 5px; line-height: 0; } .embed .header__banner img { width: 100%; height: auto; } .embed .embed-menu { display: block; overflow: hidden; height: 0px; } .embed .embed-menu__top { position: relative; -webkit-display: box; display: box; display: flexbox; display: flex; justify-content: space-between; align-items: center; } .embed .embed-menu__title { display: block; width: 100%; position: relative; padding: 4px 4px 4px 35px; cursor: pointer; } .embed .embed-menu__title:before { content: ''; display: block; position: absolute; width: 25px; height: 25px; top: 50%; left: 5px; margin-top: -12px; background: url(../assets/topic-menu.png) center center no-repeat; } .embed .embed-menu__info { display: block; padding: 4px 10px 4px 6px; text-decoration: none; cursor: pointer; color: #848181; transition: 300ms color; } .embed .embed-menu__info:hover { color: #000; } .embed .embed-menu__list-wrapper { position: relative; } .embed .embed-menu__list { list-style: none; padding: 1px 0; } .embed .embed-menu__item { margin: 0 0 5px 0; padding: 0 10px 0 0; } .embed .embed-menu__item--header { margin: 15px 0 5px 0; font-weight: 700; padding: 3px 15px; } .embed .embed-menu__link { display: block; padding: 3px 15px; text-decoration: none; cursor: pointer; } .embed .embed-menu__link:hover, .embed .embed-menu__link.active { color: #fff; background-color: #000; display: inline-block; padding: 0px 7px; display: block; padding: 3px 15px; } .embed .page { border-style: solid; border-color: #c1c1c1; border-width: 1px 1px 1px 1px; } .embed .footer { min-height: 0; padding: 8px 10px; background: transparent; border-style: solid; border-color: #c1c1c1; border-width: 0 1px 1px 1px; } .embed .footer:after { content: ''; display: block; clear: both; } .embed .footer.hidden { display: none; } .embed .footer a { display: block; text-decoration: none; cursor: pointer; } .embed .footer a img { display: block; float: left; margin-right: 15px; max-height: 50px; } .embed .footer #disclaimer { display: none; } .embed .footer--spec { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; flex-direction: row; justify-content: space-between; align-items: stretch; } .embed .footer--spec:after { display: none; } .embed .footer--spec__link { font-size: 0.9em; } .embed .footer--spec__embed { color: #848181; transition: 300ms color; } .embed .footer--spec__embed:hover { color: #000; } .embed .footer__bm-embed { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .embed .footer__bm-embed__data { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .embed .footer__bm-embed__share { margin: 0px 10px 0px 5px; } .embed .footer .bm__share li { margin: 0px 5px; } .embed .footer .bm__share .share--link { margin-right: 0px; } .embed .embed-popup { display: none; width: calc(100% - 10px); height: calc(100% - 10px); position: absolute; top: 5px; left: 5px; z-index: 99; border: 1px solid #c1c1c1; background: #fff; } .embed .embed-popup__close { display: block; width: 12px; height: 12px; position: absolute; top: 9px; right: 20px; cursor: pointer; background: url(../assets/embed_close.jpg) center center no-repeat; background-size: 100%; z-index: 99; } .embed .embed-popup__title { height: 30px; line-height: 30px; padding-left: 5px; border-bottom: 1px solid #c1c1c1; } .embed .embed-popup__code { position: relative; margin: 30px 25px; padding: 10px; background: #efefef; word-wrap: break-word; white-space: pre-wrap; } .embed .embed-popup__content { max-height: 100%; position: relative; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; flex-direction: column; align-items: stretch; } .embed .embed-popup__content .info-content-wrapper { position: relative; } .embed .embed-popup__content .info-content { padding: 25px; } .embed .embed-popup .jspContainer { width: 100% !important; } .embed .embed-popup .jspPane { width: 100% !important; left: 0px !important; position: relative; } .embed .embed-popup .jspVerticalBar { width: 12px; right: 1px; right: 0px; background-color: transparent; } .embed .embed-popup .jspTrack { width: 6px; background-color: #efefef; } .embed .embed-popup .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; background-repeat: repeat; } .embed .index-text { display: none; position: absolute; width: calc(100% + 2px); margin: 0 -1px; padding: 5px 0; min-height: 100px; background: #fff; border: 1px solid #c1c1c1; z-index: 9; } .embed .index-text.active { display: block; } .embed .index-text__wrapper { position: relative; height: 100%; } .embed .index-text__content { padding: 20px 25px; } .embed .index-text p { margin-bottom: 12px; } .embed .index-text .jspContainer { width: 100% !important; } .embed .index-text .jspPane { width: 100% !important; left: 0px !important; position: relative; } .embed .index-text .jspVerticalBar { width: 12px; right: 1px; right: 0px; background-color: transparent; } .embed .index-text .jspTrack { width: 6px; background-color: #efefef; } .embed .index-text .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; background-repeat: repeat; } .embed .map--map { margin-bottom: 0; } .embed .map--options { width: 100%; max-width: none; float: none; clear: both; padding: 8px 10px; border-style: solid; border-color: #c1c1c1; border-width: 1px 0 0 0; } .embed .map--options.active .map--options--legend { width: auto; padding: 0 0 0 0; } .embed .map--options.active .map--options--legend .map-legend-item { display: inline-block; width: auto; margin: 0 25px 0 0; font-size: 14px; float: none; clear: none; } .embed .map--options--year { padding: 8px 15px 8px 10px; webkit-order: 0; order: 0; max-width: none; border-style: solid; border-color: #c1c1c1; border-width: 0 0 1px 0; } @media (min-width: 575px) { .embed .map--options--year { border-width: 0 1px 0 0; } } .embed .map--options--year:after { content: ''; display: block; clear: both; } .embed .map--options--year .year-slider { margin: 10px 0; } .embed .map--options--year .year-slider:before { left: -18%; } @media (min-width: 575px) { .embed .map--options--year .year-slider:before { left: -19%; } } @media (min-width: 960px) { .embed .map--options--year .year-slider:before { left: -24%; } } .embed .map--options--year .year-slider .slider-handle { width: 9px; height: 9px; margin-top: -4px; } .embed .map--options--cartogram { padding: 8px 10px; } .embed .map--options--share { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; padding: 8px 10px; border-style: solid; border-color: #c1c1c1; border-width: 1px 0 0 0; } .embed .map--options--share__data { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .embed .map--options--share__share { margin: 0px 10px 0px 5px; text-decoration: none; cursor: pointer; } .embed .map--options--share__share li { margin: 0px 5px; } .embed .map--options--share__share .share--link { margin-right: 0px; } .embed .map--options--share .bm__share { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-around; -moz-justify-content: space-around; -ms-justify-content: space-around; justify-content: space-around; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .embed .map--options--share .bm__share li { margin: 0px 5px; } .embed .map--indicator-menu { display: none; } .embed .flex-box { border-style: solid; border-color: #c1c1c1; border-width: 1px 0 0 0; } @media (min-width: 575px) { .embed .flex-box { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; } } .embed .flex-box--fill { position: relative; } @media (min-width: 575px) { .embed .flex-box--fill { flex-wrap: wrap; align-items: stretch; } } @media (min-width: 575px) { .embed .flex-box--fill > div { width: 50%; } } .embed #map-container > #dataowner { left: 5px; text-align: right; } .embed #map-container > #dataowner #disclaimer { text-align: left; } /* Popup styles */ .popup { display: none; width: 100%; position: absolute; top: 0; left: 0; padding: 1px 0; z-index: 19; } .popup.active { display: block; } .popup--top { z-index: 1000; } .popup--bck { display: block; position: fixed; top: 0px; left: 0px; width: 100%; height: 100vh; background-color: rgba(255, 255, 255, 0.75); cursor: pointer; } .popup--close { display: block; width: 20px; height: 20px; position: absolute; top: 15px; right: 15px; text-decoration: none; cursor: pointer; } .popup--content { display: block; width: 75vw; min-height: 300px; max-width: 720px; position: relative; margin: 5vh auto 0 auto; padding: 40px 15px 15px; background-color: #ffffff; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; } @media (min-width: 768px) { .popup--content { padding: 50px 25px 25px; } } .popup--small { position: fixed; top: 50%; left: 50%; min-height: 0; margin: auto; transform: translate(-50%, -50%); } .popup--side-menu--menu { margin: 0 0 0 0; padding: 0 0 0 0; list-style: none; } .popup--side-menu--menu-item { display: inline-block; margin: 0 7px 0 0; padding: 0 0 0 0; } .popup--side-menu--menu-link { display: block; padding: 3px; text-decoration: none; font-weight: 400; font-size: 1.1em; cursor: pointer; } .popup--side-menu--menu-link:hover, .popup--side-menu--menu-link.active { font-weight: 700; } .popup--side-menu--content { padding: 25px 0 0 0; } .popup--side-menu--content-item { display: none; } .popup--side-menu--content-item.active { display: block; } .popup--side-menu--content-item h2 { font-size: 24px; font-weight: 300; margin: 0px 0px 12px 0px; } .popup--side-menu--content-item p { margin-bottom: 18px; } .popup .footnotes { border-collapse: collapse; } .popup .footnotes td { vertical-align: top; padding: 5px 7px; } .popup .footnotes--key { white-space: nowrap; } .popup .footnotes--note { font-style: italic; font-size: 0.9em; } .search { display: block; float: right; margin: 0 -6px 0 0; } .search--label { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; background: #fff; } .search--icon { display: block; width: 21px; height: 21px; position: relative; cursor: pointer; } .search--icon:before { content: ''; display: block; width: 9px; height: 9px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; border: 1px solid #000; position: absolute; top: 4px; left: 4px; } .search--icon:after { content: ''; display: block; width: 6px; height: 2px; position: absolute; bottom: 3px; right: 4px; background: #000; transform: rotate(45deg); transform-origin: right center; } .search--input { display: block; height: 21px; width: 100px; margin: 0 0 0 0; padding: 2px 5px 2px 0; border: none; background: #fff; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; line-height: 17px; font-family: 'Open Sans', sans-serif; } .search--input, .search--input:focus { border: none; outline: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .search-popup { display: none; width: 90vw; max-width: 900px; min-height: 80vh; position: absolute; top: 70px; left: 50%; background: #064171; transform: translate(-50%, 0); -webkit-box-shadow: 0 0 25px #000; -moz-box-shadow: 0 0 25px #000; -ms-box-shadow: 0 0 25px #000; -o-box-shadow: 0 0 25px #000; box-shadow: 0 0 25px #000; color: #fff; z-index: 19; } .search-popup--active { display: block; } .search-popup__close { display: block; width: 20px; height: 20px; position: absolute; top: 15px; right: 15px; } .search-popup__close:before { content: ''; display: block; width: 20px; height: 2px; position: absolute; top: 50%; left: 0; background: #fff; transform: translate(-50%, -50%) rotate(45deg); transform-origin: center center; } .search-popup__close:after { content: ''; display: block; width: 20px; height: 2px; position: absolute; top: 50%; left: 0%; background: #fff; transform: translate(-50%, -50%) rotate(-45deg); transform-origin: center center; } .search-popup__content { position: relative; } .search-popup__title { display: block; padding: 20px 25px 10px; font-weight: 400; font-size: 17px; } .search-popup__table { width: 100%; border-collapse: collapse; } .search-popup__row { border-width: 1px 0; border-style: solid; border-color: #2e6b9e; } .search-popup__row:first-child { border-top-width: 0px; } .search-popup__row--link { cursor: pointer; } .search-popup__row--link:hover { background: #f6fbff; color: #064171; } .search-popup__h-topic { padding: 15px 15px 15px 25px; font-weight: 700; text-align: left; } .search-popup__h-edition { padding: 15px 25px 15px 15px; font-weight: 700; text-align: left; } .search-popup__topic { padding: 15px 15px 15px 25px; font-weight: 400; text-align: left; } .search-popup__edition { padding: 15px 25px 15px 15px; font-weight: 400; text-align: left; font-style: italic; } .quiz { display: block; width: 100%; padding: 24px; margin: 24px 0; background: #efefef; } @media (min-width: 768px) { .quiz { width: 66%; } } .quiz__question { font-weight: 700; padding-bottom: 6px; } .quiz__answers { padding: 0 0; } .quiz__validate { padding-top: 6px; font-weight: 700; } .map--text .quiz__validate.correct { color: green !important; } @media (min-width: 768px) { .map--text .quiz__validate.correct { font-size: 15px !important; } } .map--text .quiz__validate.wrong { color: red !important; } @media (min-width: 768px) { .map--text .quiz__validate.wrong { font-size: 15px !important; } } .quiz__list { margin: 0 0 0 0; padding: 0 0 0 0; list-style: none; } .quiz__item { margin: 0 0 0 0; padding: 0 0 0 0; } .quiz__item label { display: block; } @media (min-width: 768px) { .map--text .quiz__item label { font-size: 13px !important; } } .quiz__item input { display: inline-block; position: relative; top: 2px; } .quiz__item input + span { display: inline-block; margin-right: 5px; } .quiz__select { display: block; position: relative; padding-bottom: 5px; } .quiz__select .chart-legend-input { background: #fff; } .quiz__selected { display: block; padding-bottom: 0; } /* Bouncy Maps */ /* Bouncy Maps */ /* Font styles for Bouncy Maps */ .bouncy-maps { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; align-items: stretch; height: auto; min-height: 100vh; } .bouncy-maps .header { flex: 0 0 auto; background: #fff; border-width: 0 0 0px 0; border-style: solid; border-color: #000; padding: 16px 20px 8px; } @media (min-width: 768px) { .bouncy-maps .header { padding: 16px 20px 6px; } } .bouncy-maps .header__content { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -webkit-align-items: stretch; -moz-align-items: stretch; -ms-align-items: stretch; align-items: stretch; max-width: 960px; margin: 0 auto; } .bouncy-maps .header__menu { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; position: relative; padding: 0 5px; } .bouncy-maps .header__menu__btn { min-width: 0; max-width: 100%; min-height: 30px; position: relative; padding: 6px 12px; font-weight: 700; line-height: 16px; cursor: pointer; } @media (min-width: 550px) { .bouncy-maps .header__menu__btn { min-height: 30px; } } .bouncy-maps .header__menu__btn .hamburger { position: relative; display: inline-block; width: 10px; height: 10px; margin: 0 0.6em 0 0; border-width: 2px 0; border-color: #fff; border-style: solid; } .bouncy-maps .header__menu__btn .hamburger:before { content: ''; display: block; width: 100%; height: 2px; background: #fff; margin: 2px 0; } .bouncy-maps .header__title { width: 33%; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; padding: 0 0px; } .bouncy-maps .header__title h1 { margin: 0 0 0 0; text-transform: uppercase; font-weight: 400; font-size: 1em; line-height: 1.2; color: #000; } @media (min-width: 550px) { .bouncy-maps .header__title h1 { font-size: 26px; } } .bouncy-maps .header__right { width: 33%; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: stretch; -moz-align-items: stretch; -ms-align-items: stretch; align-items: stretch; } .bouncy-maps .header__about { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .bouncy-maps .header__about__link { display: block; width: 23px; height: 23px; background: url(../assets/bm_info_icon.jpg) center center no-repeat; background-size: contain; text-indent: -1000000px; cursor: pointer; } .bouncy-maps .body { width: 100%; max-width: none; flex: 1 1 auto; padding: 15px 0px 25px; } @media (min-width: 550px) { .bouncy-maps .body { padding: 0px 0px 1px; } } .bouncy-maps .map--map { margin: 12px auto; } @media (min-width: 550px) { .bouncy-maps .map--map { width: 100%; max-width: 800px; padding: 1px 25px; } } @media (min-height: 780px) { .bouncy-maps .map--map { max-width: 1010px; } } .bouncy-maps .map--rank--text { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; padding: 0 0 0 0; margin: 18px auto 34px; } .bouncy-maps .map--rank--text span { position: relative; } .bouncy-maps .map--rank--text span span { left: 0px; } .bouncy-maps .map--rank--text em { display: block !important; position: absolute !important; text-align: left !important; top: auto !important; left: 50% !important; text-transform: none !important; white-space: nowrap !important; -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); transform: translate(-50%); } .bouncy-maps .map--rank--header { padding-bottom: 8px; } @media (min-width: 960px) { .bouncy-maps .map--rank--header { padding: 0 11px 8px 6px; } } .bouncy-maps .map--rank--header > a, .bouncy-maps .map--rank--header > span { font-size: 0.9em; font-weight: 400; } .bouncy-maps .map--rank--header .sort-country { padding-left: 0px; } @media (min-width: 768px) { .bouncy-maps .map--rank--header .sort-part { display: inline-block; width: 49%; } .bouncy-maps .map--rank--header .sort-part.disable { color: #000; } } @media (min-width: 768px) { .bouncy-maps .map--rank--header .sort-separator { display: none; } } @media (min-width: 960px) { .bouncy-maps .map--rank--content { height: auto; } } .bouncy-maps .map--rank--content .ranking--cell { padding: 4px 3px 4px 2px; } @media (min-width: 768px) { .bouncy-maps .map--rank--content .ranking--cell .value, .bouncy-maps .map--rank--content .ranking--cell .percentage { display: inline-block !important; width: 49%; padding-left: 5px; padding-right: 5px; } } .bouncy-maps .map--rank--content .ranking--row { background-color: #fff; border-bottom: 1px solid #000; } .bouncy-maps .map--rank--content .ranking--row:last-child { border-bottom-width: 0px; } .bouncy-maps .map--rank--content .ranking--row.highlight { color: #000; font-weight: 700; } .bouncy-maps .map--rank--content .ranking--row:hover { color: #000; font-weight: 700; background-color: #fff; } .bouncy-maps .footer { flex: 0 0 auto; min-height: 0; background: #fff; padding: 5px 10px 20px; text-align: center; } @media (min-width: 550px) { .bouncy-maps .footer { padding: 10px 20px 30px; } } .bouncy-maps .map--rank--text { margin-top: 0px; } .bouncy-maps .map--rank--text > span em { display: block; text-align: center; top: 4px; left: 0px; } .bouncy-maps #dataowner { display: none; } /* Bouncy Maps - Menu */ .bm__menu { position: relative; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-around; -moz-justify-content: space-around; -ms-justify-content: space-around; justify-content: space-around; -webkit-align-items: stretch; -moz-align-items: stretch; -ms-align-items: stretch; align-items: stretch; flex-wrap: wrap; padding: 0 15px 0 0; } .bm__menu__edition { width: 100%; max-width: 320px; margin: 0 0 24px 0; } .bm__menu__edition h2 { font-size: 1.4em; font-weight: 400; text-transform: uppercase; margin: 0 0 14px 0; } .bm__menu__categories { list-style: none; margin: 0 0 0 0; padding: 0 0 0 0; } .bm__menu__category { margin: 0 0 0 0; padding: 0 0 0 0; border-bottom: 1px solid #000; } .bm__menu__category:first-child { border-top: 1px solid #000; } .bm__menu__link { display: block; padding: 5px 0; line-height: 1.2; font-size: 1.1em; text-decoration: none; cursor: pointer; } .bm__menu__link:active, .bm__menu__link:focus { outline: none; } .bm__menu__link:hover, .bm__menu__link.active { font-weight: 700; } /* Bouncy Maps - Info */ .bm__info { display: block; position: relative; max-height: 100%; padding: 0 15px 0 0; } .bm__info h2 { margin: 0.5rem 0 0.75rem 0; font-size: 1.25rem; font-weight: 700; } .bm__info h3 { margin: 0.5rem 0 0.75rem 0; font-size: 1.125rem; font-weight: 700; } .bm__info h4 { margin: 0.5rem 0 0.75rem 0; font-size: 1rem; font-weight: 700; } .bm__info__menu { list-style: none; padding: 0 0 7px 0; margin: 0 0 0 0; border-bottom: 1px solid #cbcbcb; } .bm__info__item { display: inline-block; margin: 0 0 0 0; padding: 0 25px 0 0; } .bm__info__link { display: block; padding: 5px 5px 5px 5px; font-size: 1.2em; text-decoration: none; cursor: pointer; } .bm__info__link:hover, .bm__info__link.active { font-weight: 700; } .bm__info__link:focus, .bm__info__link:active { outline: none; } .bm__info__wrapper { flex: 1 1 auto; } .bm__info__content { display: none; padding: 15px 0 0 0; } .bm__info__content.active { display: block; } .bm__info__content:after { content: ''; display: table; clear: both; } /* Bouncy Maps - PopUp */ .bm__popup { display: none; width: 100%; height: 100vh; position: fixed; top: 0px; left: 0px; background: rgba(255, 255, 255, 0.75); z-index: 99; } .bm__popup.active { display: block; } .bm__popup__close { display: block; width: 26px; height: 26px; position: absolute; top: 10px; right: 10px; cursor: pointer; background-size: 100%; z-index: 99; } .bm__popup__close:before, .bm__popup__close:after { content: ''; display: block; width: 100%; height: 2px; position: absolute; top: 12px; left: 0px; background: #000; } .bm__popup__close:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .bm__popup__close:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .bm__popup__content { display: block; width: 90%; height: 94vh; max-width: 960px; position: relative; top: 3vh; margin: 0px auto; padding: 40px 20px 35px 30px; background: #fff; border: 1px solid #cbcbcb; } @media (min-width: 550px) { .bm__popup__content { height: 90vh; top: 5vh; padding: 35px 40px 35px 30px; } } .bm__popup__inset { display: block; position: relative; height: 100%; } .bm__popup .jspContainer { width: 100% !important; } .bm__popup .jspPane { width: 100% !important; position: relative; } .bm__popup .jspVerticalBar { width: 12px; right: 1px; right: -3px; background-color: transparent; } .bm__popup .jspTrack { width: 6px; background-color: #efefef; } .bm__popup .jspDrag { width: 12px; margin-left: -3px; background-image: linear-gradient(#000 3px, #808080 4px); background-position: left top; background-size: 12px 4px; background-repeat: repeat; } .bm__content-text { width: 100%; max-width: 1010px; margin: 0 auto; padding: 1px 10px; line-height: 1.7; text-align: center; } @media (min-width: 550px) { .bm__content-text { width: 75%; max-width: 640px; padding: 1px 25px; } } .bm__action-btns { width: 100%; max-width: 1010px; margin: 0 auto; } @media (min-width: 550px) { .bm__action-btns { padding: 1px 25px; } } .bm__action-btns--top .bm__buttons { margin-top: 0px; } .bm__c-controls { width: 100%; max-width: 1010px; margin: 0 auto; } @media (min-width: 550px) { .bm__c-controls { padding: 1px 25px; } } .bm__share { list-style: none; padding: 1px 0; margin: 0 0 0 0; text-align: center; } .bm__share li { display: inline-block; margin: 5px 5px; } .bm__share a { display: block; position: relative; height: 25px; line-height: 25px; margin: 0px 0px; text-decoration: none; font-size: 15.4px; font-weight: 400; cursor: pointer; top: 2px; } @media (min-width: 768px) { .bm__share a { font-size: 14px; } } @media (min-width: 960px) { .bm__share a { top: 0; } .bm__share a.invertText:hover { color: #fff; } } .bm__share a.share--link { margin-right: 5px; display: inline-block; top: 4px; } @media (min-width: 960px) { .bm__share a.share--link { margin-right: 0; display: block; top: 0; } } .bm__h-social { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; margin: 0 0 0 0; padding: 0 0 0 0; list-style: none; } .bm__h-social__item { margin: 0 0 0 0; padding: 0 0 0 10px; } .bm__h-social__link { display: block; width: 25px; height: 25px; background-image: url(../assets/social.png); text-indent: -1000000px; cursor: pointer; } .bm__h-social__link.facebook { background-position: 0px 0px; } .bm__h-social__link.twitter { background-position: -25px 0px; } .bm__c-menu .owl-stage { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; padding: 5px; margin: 0 auto; } .bm__c-menu .owl-item { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; } .bm__c-menu .owl-prev, .bm__c-menu .owl-next { display: block; width: 33px; height: 33px; position: absolute; top: 50%; margin-top: -17px; font-size: 0; cursor: pointer; } .bm__c-menu .owl-prev:before, .bm__c-menu .owl-next:before { content: ''; display: block; position: absolute; top: 11px; width: 11px; height: 11px; border-width: 2px 2px 0px 0px; border-style: solid; border-color: #1d1d1b; } .bm__c-menu .owl-prev.disabled, .bm__c-menu .owl-next.disabled { display: none !important; } .bm__c-menu .owl-prev { left: -40px; z-index: 5; } .bm__c-menu .owl-prev:before { left: 13px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -ms-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); } .bm__c-menu .owl-next { right: -40px; z-index: 5; } .bm__c-menu .owl-next:before { right: 13px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .bm__c-menu__categories { padding: 0 0px; } @media (min-width: 768px) { .bm__c-menu__categories { padding: 0 45px; } } .bm__c-menu__categories ul { list-style: none; margin: 0 0 0 0; padding: 0 0 0 0; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .bm__c-menu__categories ul.slick-slider { display: block; } .bm__c-menu__categories .owl-stage { padding: 0 0; } .bm__c-menu__categories .owl-item:before { content: ''; display: block; width: 1px; height: 90%; position: absolute; top: 5%; left: 0px; background: #7c7c7c; z-index: 9; } .bm__c-menu__categories .owl-item:first-child:before { display: none; } .bm__c-menu__items { padding: 0 0px; margin: 12px 0px 0px 0px; border: 0px solid #000; } @media (min-width: 768px) { .bm__c-menu__items { padding: 0 45px; margin: 6px 0px 0px 0px; } } .bm__c-menu__items ul { list-style: none; margin: 0 0 0 0; padding: 0 0 0 0; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: stretch; -moz-align-items: stretch; -ms-align-items: stretch; align-items: stretch; } .bm__c-menu__items ul.slick-slider { display: block; } .bm__c-menu__item { padding: 5px 5px; text-align: center; } .bm__c-menu__item--categories { position: relative; background: #fff; margin: 0 0 0 0; padding: 0px 0px 0px 2px; } .bm__c-menu__item--categories:before { content: ''; display: block; width: 1px; height: 90%; position: absolute; top: 5%; left: 0px; background: #7c7c7c; } .bm__c-menu__item--categories a { display: block; padding: 2px 20px; font-weight: 400; font-size: 15.4px; text-decoration: none; cursor: pointer; color: #7a7a79; white-space: nowrap; } @media (min-width: 768px) { .bm__c-menu__item--categories a { font-size: 14px; } } .bm__c-menu__item--categories a:hover, .bm__c-menu__item--categories a.active { font-weight: 400; text-decoration: none; color: #000; } .bm__c-menu__item--categories a:focus { outline: none; } .bm__c-menu__item--categories:first-child:before { display: none; } .bm__c-menu__item--categories:last-child { padding: 0 2px 0 2px; } .owl-item .bm__c-menu__item--categories { padding: 0 0 0 0; } .bm__c-menu__item--items { -webkit-display: box !important; display: -webkit-box !important; display: -webkit-flex !important; display: -ms-flexbox !important; display: flexbox !important; display: flex !important; position: relative; width: 150px; margin: 0 0 0 0; padding: 2px 5px; } .bm__c-menu__item--items a { width: 140px; padding: 8px 15px; margin: 0 0 0 0; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; text-align: center; border-width: 0px 0px 0px 0px; border-style: solid; border-color: #000; background: #efefef; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; text-decoration: none; line-height: 1.2; font-size: 14.3px; cursor: pointer; } @media (min-width: 768px) { .bm__c-menu__item--items a { font-size: 13px; } } .bm__c-menu__item--items a.active, .bm__c-menu__item--items a:hover { background: #000; color: #fff; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } .bm__c-menu__item--items a:focus { outline: none; } .owl-item .bm__c-menu__item--items { padding: 0 0 0 0; } .bm__c-menu__item a.active { font-weight: 400; } .bm__c-toggle__wrapper { width: auto; max-width: 500px; margin: 10px auto; padding: 0 10px; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; text-transform: uppercase; font-size: 0.85em; } @media (min-width: 768px) { .bm__c-toggle__wrapper { padding: 0 0 0 0; font-size: 1em; } } .bm__c-toggle__type { cursor: pointer; } .bm__c-toggle__btn { display: inline-block; margin: 0 14px; position: relative; width: 50px; height: 20px; border: 1px solid #000; background: #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; cursor: pointer; } @media (min-width: 768px) { .bm__c-toggle__btn { width: 70px; height: 30px; } } .bm__c-toggle__switch { display: inline-block; position: absolute; left: -1px; top: -1px; width: 25px; height: 20px; border: 1px solid #000; background: #000; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; -webkit-transition: left 300ms; -moz-transition: left 300ms; -ms-transition: left 300ms; -o-transition: left 300ms; transition: left 300ms; } @media (min-width: 768px) { .bm__c-toggle__switch { width: 35px; height: 30px; } } .bm__c-toggle__switch.active { left: 25px; } @media (min-width: 768px) { .bm__c-toggle__switch.active { left: 34px; } } .bm__buttons { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; flex-wrap: wrap; margin: 20px auto 0px auto; } .bm__buttons__content { width: 100%; max-width: 420px; margin: 0 auto 20px; display: block; height: 0px; overflow: hidden; -webkit-transition: height 300ms; -moz-transition: height 300ms; -ms-transition: height 300ms; -o-transition: height 300ms; transition: height 300ms; } .bm__buttons__content .share--content--title { margin-top: 0px; } .bm__buttons__content .textarea { border: 1px solid #000; margin: 0 10px; padding: 10px; word-wrap: break-word; } .bm__button { display: block; flex: 0 0 auto; border: 1px solid #000; background: #000; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; min-width: 90px; width: auto; text-decoration: none; cursor: pointer; color: #fff; text-align: center; padding: 6px 10px; margin: 5px; font-weight: 700; font-size: 14px; text-transform: uppercase; } @media (min-width: 550px) { .bm__button { min-width: 120px; margin: 10px; } } .bm__button:hover { color: #fff; } /* MB - Rank table */ .bm__rank { width: 90%; max-width: 520px; margin: 0px auto; padding: 0px 10px; } @media (min-width: 550px) { .bm__rank { padding: 0px 0px; } } .bm__rank .map--rank--header { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -webkit-align-items: baseline; -moz-align-items: baseline; -ms-align-items: baseline; align-items: baseline; } .bm__rank .map--rank--header .sort-country { width: auto; flex: 1 1 auto; } .bm__rank .map--rank--header .space { display: block; flex: 0 0 1%; } .bm__rank .map--rank--header .sort-bar { display: block; width: 20%; flex: 0 0 20%; } .bm__rank .map--rank--header .sort-separator:before, .bm__rank .map--rank--header .sort-separator:after { content: ""; display: inline-block; padding: 0 1px 0 0; } .bm__rank .map--rank--header .sort-value { width: 28%; flex: 0 0 28%; position: relative; padding-left: 0px; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; -ms-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: baseline; -moz-align-items: baseline; -ms-align-items: baseline; align-items: baseline; flex-wrap: wrap; height: auto; } @media (min-width: 768px) { .bm__rank .map--rank--header .sort-value { width: 38%; flex: 0 0 38%; padding-left: 5px; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; } } .bm__rank .map--rank--header .sort-value [data-target="value"] { white-space: nowrap; } @media (min-width: 768px) { .bm__rank .map--rank--header .sort-value [data-target="value"] { width: 60%; flex: 0 0 60%; } } @media (min-width: 768px) { .bm__rank .map--rank--header .sort-value [data-target="percentage"] { width: 38%; flex: 0 0 38%; padding-left: 5px; } } .bm__rank .ranking--row { -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; align-items: center; } .bm__rank .ranking--row .ranking--cell { display: block; } .bm__rank .ranking--row .rankCountry { width: auto; flex: 1 1 auto; } .bm__rank .ranking--row .rankBar { display: block; width: 20%; flex: 0 0 20%; align-self: stretch; position: relative; } .bm__rank .ranking--row .rankBar__bar { display: block; min-width: 1px; height: calc(100% + 2px); background: #000; padding: 0 0 0 1px; border-top: 1px solid #efefef; border-bottom: 1px solid #efefef; margin: -1px 0; } .bm__rank .ranking--row .space { width: 1%; flex: 0 0 1%; padding: 3px; } .bm__rank .ranking--row .rankValue { width: 28%; flex: 0 0 28%; position: relative; } @media (min-width: 768px) { .bm__rank .ranking--row .rankValue { width: 38%; flex: 0 0 38%; -webkit-display: box; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flexbox; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; -webkit-align-items: baseline; -moz-align-items: baseline; -ms-align-items: baseline; align-items: baseline; } } @media (min-width: 768px) { .bm__rank .ranking--row .rankValue .value { width: 60%; flex: 0 0 60%; } } @media (min-width: 768px) { .bm__rank .ranking--row .rankValue .percentage { width: 39%; flex: 0 0 35%; } } /* create Map Image */ /** * Style for createMapImage.jsp */ .create-map-image .map--export { width: 100%; clear: both; } .create-map-image .map--export ul { display: block; list-style: none; padding: 15px 0 0 0; margin: 0 0 0 0; } .create-map-image .map--export li { display: inline-block; margin: 0 10px 0 0; padding: 0 0 0 0; } .create-map-image .map--side { min-height: 50px; } .create-map-image .button { display: block; line-height: 1.5; padding: 4px 7px; background-color: #efefef; text-decoration: none; margin: 0px 0px 14px 0px; font-size: 12px; -webkit-box-shadow: 0px 0px 2px 1px #aaa; -moz-box-shadow: 0px 0px 2px 1px #aaa; -ms-box-shadow: 0px 0px 2px 1px #aaa; -o-box-shadow: 0px 0px 2px 1px #aaa; box-shadow: 0px 0px 2px 1px #aaa; -webkit-transition: background-color 300ms; -moz-transition: background-color 300ms; -ms-transition: background-color 300ms; -o-transition: background-color 300ms; transition: background-color 300ms; } .create-map-image .button:hover { color: #fff; background-color: #000; -webkit-box-shadow: 0px 0px 0px 0px transparent; -moz-box-shadow: 0px 0px 0px 0px transparent; -ms-box-shadow: 0px 0px 0px 0px transparent; -o-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; } @media (min-width: 768px) { .create-map-image .button { margin-bottom: 7px; } } /* local css */ .zipparis .homepage--entries-header { font-size: 20px; font-style: italic; } .zipparis .mw-donut-chart .chart-legend-remove { display: none; } .iea .header--banner { padding-top: 20px; position: relative; margin: 0 -25px; } .iea .header--right { padding-top: 20px; padding-bottom: 10px; } .iea__banner { position: relative; width: 100%; height: 0; padding: 68px 0 0 0; background: url(../assets/iea_banner.jpg) right center no-repeat; background-size: auto; } @media (min-width: 550px) { .iea__banner { padding: 12.45% 0 0 0; background-size: 100% auto; } } .iea__banner-link { display: block; position: absolute; top: 50%; left: 0px; height: 40px; margin-top: -20px; background-color: #45454c; color: #4eb846; padding: 0px 25px; line-height: 40px; text-decoration: none; cursor: pointer; } @media (min-width: 768px) { .iea__banner-link { height: 50px; margin-top: -25px; line-height: 50px; font-size: 28px; } } .iea__banner-link:hover { color: #4eb846; } /* * Special styles for UIS */ .uis .header--banner { position: relative; height: 130px; overflow: hidden; } .uis .header--banner img { display: block; width: 960px; } .uis .header--banner a { display: block; height: 130px; position: absolute; padding: 5px; display: flex; align-items: center; } .uis .header--banner a img { width: auto; max-width: 100%; height: auto; max-height: 128px; } .uis .header--block__padding { padding-top: 0px; }