body,ul,h1,h2,h3,h4,h5,p,pre,input,th,td,fieldset,legend, button, textarea, blockquote {margin:0; padding:0} table{border-collapse:collapse;border-spacing:0} ul{list-style-type: none; padding: 0} img,fieldset{border: none} *{outline: none} header,section,article,section{display: block} a{text-decoration: none; cursor: pointer; outline:0 none} a:hover{text-decoration: underline} html, body { height: 100% } body { background-color: #fff; color: #333; } body, p, ol, ul, td { font-size: 13px; line-height: 18px; } pre { background-color: #eee; padding: 10px; font-size: 11px; } a { color: #000; } a:visited { color: #666; } div.field, div.actions { margin-bottom: 10px; } #notice { color: green; } .field_with_errors { padding: 2px; background-color: red; display: table; } #error_explanation { width: 450px; border: 2px solid red; padding: 7px; padding-bottom: 0; margin-bottom: 20px; background-color: #f0f0f0; } #error_explanation h2 { text-align: left; font-weight: bold; padding: 5px 5px 5px 15px; font-size: 12px; margin: -7px; margin-bottom: 0px; background-color: #c00; color: #fff; } #error_explanation ul li { font-size: 12px; list-style: square; } /* @import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600); */ /* 300 */ @font-face { font-family: 'source_sans_prolight'; src: url(/stylesheets/fonts/sourcesanspro-light-webfont.eot?1578503741); src: url('/stylesheets/fonts/sourcesanspro-light-webfont.eot?#iefix') format('embedded-opentype'), url('/stylesheets/fonts/sourcesanspro-light-webfont.woff2') format('woff2'), url(/stylesheets/fonts/sourcesanspro-light-webfont.woff?1578503741) format('woff'), url(/stylesheets/fonts/sourcesanspro-light-webfont.ttf?1578503741) format('truetype'), url('/stylesheets/fonts/sourcesanspro-light-webfont.svg#source_sans_prolight') format('svg'); font-weight: normal; font-style: normal; } /* 400 */ @font-face { font-family: 'source_sans_proregular'; src: url(/stylesheets/fonts/sourcesanspro-regular-webfont.eot?1578503741); src: url('/stylesheets/fonts/sourcesanspro-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/stylesheets/fonts/sourcesanspro-regular-webfont.woff2') format('woff2'), url(/stylesheets/fonts/sourcesanspro-regular-webfont.woff?1578503741) format('woff'), url(/stylesheets/fonts/sourcesanspro-regular-webfont.ttf?1578503741) format('truetype'), url('/stylesheets/fonts/sourcesanspro-regular-webfont.svg#source_sans_proregular') format('svg'); font-weight: normal; font-style: normal; } /* 600 */ @font-face { font-family: 'source_sans_prosemibold'; src: url(/stylesheets/fonts/sourcesanspro-semibold-webfont.eot?1578503741); src: url('/stylesheets/fonts/sourcesanspro-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('/stylesheets/fonts/sourcesanspro-semibold-webfont.woff2') format('woff2'), url(/stylesheets/fonts/sourcesanspro-semibold-webfont.woff?1578503741) format('woff'), url(/stylesheets/fonts/sourcesanspro-semibold-webfont.ttf?1578503741) format('truetype'), url('/stylesheets/fonts/sourcesanspro-semibold-webfont.svg#source_sans_prosemibold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: "GelPen"; src: url(../stylesheets/fonts/gelpen-webfont.eot?1578503741); src: url('fonts/gelpen-webfont.eot?#iefix') format('embedded-opentype'), url(../stylesheets/fonts/gelpen-webfont.woff?1578503741) format('woff'), url(../stylesheets/fonts/gelpen-webfont.ttf?1578503741) format('truetype'), url('fonts/gelpen-webfont.svg#GelPen') format('svg'); font-weight: normal; font-style: normal; } body, p, ol, ul, td, input, button { font-family: 'source_sans_proregular', sans-serif; font-weight: normal; } .blog-widget-textarea { font-family: Helvetica, Arial, sans-serif; } .gelpen, .media-type-title { font-family: "GelPen"; font-weight: normal; letter-spacing:1px; } .about-page .press blockquote { font-family: Georgia, Times, "Times New Roman", serif; } .tweet-text { font-family: 'Georgia'; font-style: italic; } .voice-info > h4 > .more-button {font-weight: 100} .media-type-info > a {font-weight: 800} .media-type-info > em {font-style: normal} .cite-text {font-weight: 100} .cite-author {font-style: normal} .tweet-author {font-style: normal} .infoboxes-wall .infobox .chart-data {font-weight: 600} /* font-weight: normal */ .news-ticker > li .voice-time, .voice-description > h2 {font-weight: normal} /* font-weight: bold */ .bold, .slider-values, .voices-count > span, .voice-count-tooltip, .voice-description > .time-ago, .news-ticker > li > a { font-weight: bold; } /* light */ .cv-timeline-element__title, .voice-content-type-wrapper .time-ago, .cv-backstory-overlay__info-date, .cv-link-gallery .error-message__non-compatible-protocol .default-text { font-family: 'source_sans_prolight', sans-serif; font-weight: normal; } /* semi-bold */ h1, h2, h3, h4, h5, .create-voice .cv-button, .home-cover__title, .voice-box > .voice-cont > h3, .cv-timeline-fixed-buttons .cv-button--small, .cv-timeline-month__label--upper, .cv-timeline-view-button, .voice-unmoderated .flag-div a, .post > .post-button > input[type='submit'], #current_date .year-label, .cv-timeline-breadcrum__point-item, .cv-backstory-overlay__info-title, .cv-overlay-title, .cv-media-gallery .info-wrapper, .blog-widget-subtitle, .post-media-tooltip-header .title, .cv-tooltip .tooltip-label, .video-post-media-tooltip .cv-tooltip-inner, .link-post-media-tooltip .normal .cv-tooltip-inner, .moderator-mode-tooltip .title, .voice-header > .voice-info h3, .voice-footer a, .widget-modal .close, .notification-bar .close-message, .tweets-sidebar .close, .top-left-navigation.active .menu-item.active:after, .menu-item .menu-link, .cv-link-gallery .error-message__non-compatible-protocol .primary-text, .blog-widget-title, .follow-widget-tooltip .title { font-family: 'source_sans_prosemibold', sans-serif; font-weight: normal; } @font-face { font-family: 'icomoon'; src:url('/stylesheets/fonts/icomoon.eot?-cbnb24'); src:url('/stylesheets/fonts/icomoon.eot?#iefix-cbnb24') format('embedded-opentype'), url('/stylesheets/fonts/icomoon.woff?-cbnb24') format('woff'), url('/stylesheets/fonts/icomoon.ttf?-cbnb24') format('truetype'), url('/stylesheets/fonts/icomoon.svg?-cbnb24#icomoon') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"], [class*=" icon-"] { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-warning:before { content: "\f071"; } .icon-arrow-back:before { content: "\e600"; } .icon-arrow-left-light:before { content: "\e601"; } .icon-arrow-left-small:before { content: "\e602"; } .icon-arrow-left:before { content: "\e603"; } .icon-arrow-right-light:before { content: "\e604"; } .icon-arrow-right-small:before { content: "\e605"; } .icon-arrow-right:before { content: "\e606"; } .icon-backstory:before { content: "\e607"; } .icon-facebook:before { content: "\e608"; } .icon-flag:before { content: "\e609"; } .icon-gear:before { content: "\e60a"; } .icon-image:before { content: "\e60b"; } .icon-infographics:before { content: "\e60c"; } .icon-link:before { content: "\e60d"; } .icon-map-pin:before { content: "\e60e"; } .icon-play:before { content: "\e60f"; } .icon-rss:before { content: "\e610"; } .icon-sad-face:before { content: "\e611"; } .icon-search:before { content: "\e612"; } .icon-star:before { content: "\e613"; } .icon-thumbs-down:before { content: "\e614"; } .icon-thumbs-up:before { content: "\e615"; } .icon-twitter:before { content: "\e616"; } .icon-video:before { content: "\e617"; } .icon-voice:before { content: "\e618"; } .icon-x:before { content: "\e619"; } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html, body { height: 100%; overflow: hidden; } .scroll-primary, .scroll-secondary { width: 100%; height: 100%; position: relative; overflow-x: hidden; overflow-y: auto; } .avoid-scrolling-content .scroll-primary, .avoid-scrolling-content .scroll-secondary { overflow-y: hidden !important; pointer-events: none; } /* Main Container */ .main-container { position: relative; height: 100%; z-index: 0; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .main-container--inner { -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .main-container--disable-overlay { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5; cursor: pointer; background: rgba(255, 255, 255, .5); } .sidebar-state__open .main-container { margin-left: 250px; } .mobile-logo-header { display: none; height: 32px; width: 100%; z-index: 2; } .mobile-logo-header a { display: inline-block; margin-top: 3px; } .mobile-logo-header .crowdvoice-logo { float: none; } .mobile-logo-header .crowdvoice-custom-slogan { margin-top: 4px; } .mobile-menu__list { display: none; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .mobile-menu__list:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0} .layout-app .mobile-menu__list-item { float: left; position: relative; } .layout-page .mobile-menu__list-item.home-link { display: none; } .layout-app .mobile-menu__list-item.home-link { display: block; width: 60%; } .mobile-menu__list-item.home-link:after { content: "."; position: absolute; top: 15px; right: 0; width: 1px; height: 10px; background-color: #666; } .mobile-menu__list-item.home-link .crowdvoice-logo { float: none; display: inline-block; width: 130px; height: 16px; background: url(/images/crowdvoice-logo@2x.png?1578503741); background-size: 130px auto; background-repeat: no-repeat; } .layout-app .mobile-menu__list-item.about-link { width: 40%; } a.mobile-menu__list-item-anchor { display: block; font-size: 12px; line-height: 20px; padding: 10px; border-bottom-width: 1px; } .hgroup-current-image {border-bottom-width: 0; float: left; width: 100%} .gaza-header.top {background-position: 16px 8px; height: 63px; width: 267px; float: right} .gaza-header.bottom {background-position: -1px bottom} .clear {clear: both} .crowdvoice-custom-about {float: left; height: 18px; width: 18px; margin-top: 3px;position: absolute;right: 0;top: 0} .panel-padding {margin-left: 16px; clear:both} .voice-info-tools > li { float: left; } .voice-info-tools > li + li { margin-left: .6em; } .voice-info-tools > .info-tool .icon { font-size: 11px; display: inline-block; vertical-align: top; color: #fff; opacity: 0.8; } .voice-info-tools .pin-icon { margin-top: 3px; } .voice-info-tools .gear-icon { margin-top: 3px; } .voice-info-tools .rss-icon { margin-top: 3px; } .voice-info-tools .info-tool-link.map.active { height: 33px; background-color: #f2f2f2; box-shadow: none; border-color: transparent; } .widget-height, .widget-scope {margin-right: 6px} .rtl-checkbox {margin-right: 6px} .sweeper {position: relative; overflow: hidden; clear: both} .widget {position: relative} .sponsor-padding {padding-right: 440px} .hiden-input {display: none} .flag-tip .media-type-info {padding: 7px 9px} .flag-tip .media-type-info > .media-type-title {width: 130px} .flag-tip .media-type-info > .flag-tooltip {text-align:center} .flag-tooltip .flagged { line-height: 2.9em; } .header-sponsor {position: absolute; top: 0; right: 0; padding-top: 22px; width: 143px; margin-right: 10px; height: 128px; padding-left: 7px} .header-sponsor > img {margin: 13px auto 0 auto; display: block; max-width:105px} .header-sponsor > a > img {margin: 13px auto 0 auto; display: block; max-width:105px;} .header-sponsor > span {font-size: 12px; width: 96px; margin: 15px auto; display: block; padding-left: 9px} #more_loader_spinner { position: absolute; margin: 2px 0 0 120px; } .overlay-mask {position: absolute;left:0;right:0;top:0;bottom: 0;z-index: 1;} /* Messages Styles */ .flash-message { position: relative; z-index: 2; } .message { padding: 9px 8px 8px 15px; } .message:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0} .message p {font-size: 14px} .close-message { position: absolute; top: 14px; right: 14px; font-size: 9px; } /*loading wrapper MEDIAFEED */ .image-bg-patter {position: absolute; height: 100%; width: 100%; top: 0; left: 0; z-index: 1;} .loading-wrapper {width: 150px; position: absolute; top: 40%; left: 50%; margin: -18px 0 0 -75px; display: block;} .spinner { width: 150px; float: left; padding: 0 0 7px; border-style: solid; border-width: 1px; text-align: center; font-weight: bold; font-size: 13px; border-radius: 5px } .spinner > img {float: left; margin: 12px 0 0 10px} .spinner > p {float: left; margin: 10px 0 0 10px; } @media all and (min-width: 769px) { .visible-on-large-view {display: block !important} .hidden-on-large-view {display: none !important} .sidebar-always-visible-on-large-view .main-container {margin-left: 250px} } @media all and (max-width: 768px) { .visible-on-medium-view {display: block !important} .hidden-on-medium-view {display: none !important} .mobile-logo-header { display: block; } .logo-header { display: none; } hgroup.gaza { display: block; } .main-container { width: 100%; } .sidebar-state__open .main-container { margin-left: 0; -webkit-transform: translateX(250px); -ms-transform: translateX(250px); transform: translateX(250px); } /* when the sidebar is open disable interaction */ .sidebar-state__open .main-container--disable-overlay { display: block; } .sidebar-state__open .main-container--inner { pointer-events: none; } } @media all and (max-width: 460px) { .visible-on-small-view {display: block !important} .hidden-on-small-view {display: none !important} } /* Temp */ .install {float: left; height: 18px; width: 18px; margin-top: 3px} /* Responsive stuff */ @media all and (max-width: 768px) { .panel-padding { margin-left: 0; } } * { -webkit-tap-highlight-color: rgba(0,0,0,0); } body {background: #d9d9d9 url(/images/v3/about/noise.png?1578503741) 0 0 repeat} .opacity--40 {opacity: .4} .scroll-primary { -webkit-overflow-scrolling: touch; scrollbar-base-color: #999; scrollbar-3dlight-color: #999; scrollbar-highlight-color: #999; scrollbar-track-color: #c0c0c0; scrollbar-arrow-color: #666; scrollbar-shadow-color: #999; } .not-touch .scroll-primary::-webkit-scrollbar {width: 6px; height: 6px} .not-touch .scroll-primary::-webkit-scrollbar-track {background-color: transparent;} .not-touch .scroll-primary::-webkit-scrollbar-track-piece {background-color: transparent;} .not-touch .scroll-primary::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.28); -webkit-border-radius: 3px; } .scroll-secondary { -webkit-overflow-scrolling: touch; scrollbar-base-color: #888; scrollbar-3dlight-color: #888; scrollbar-highlight-color: #888; scrollbar-track-color: #595959; scrollbar-arrow-color: #333; scrollbar-shadow-color: #888; } .not-touch .scroll-secondary::-webkit-scrollbar {width: 6px; height: 6px} .not-touch .scroll-secondary::-webkit-scrollbar-track {background-color: transparent;} .not-touch .scroll-secondary::-webkit-scrollbar-track-piece {background-color: transparent;} .not-touch .scroll-secondary::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.4); -webkit-border-radius: 3px; } .js-scroll-light .jspVerticalBar { width: 6px; right: 3px; } .js-scroll-light .jspTrack { background: none; } .js-scroll-light .jspDrag { background: rgba(0,0,0,0.2); box-shadow: none; } /* NEW COLOR CLASSES, self-explanatory */ /******** backgrounds **********/ .yellow ._skin-bg { background: #EBC91C; } .orange ._skin-bg { background: #EC9415; } .blue ._skin-bg { background: #4DB5FF; } .red ._skin-bg { background: #F10F2A; } .green ._skin-bg { background: #50B347; } /******** font-color **********/ .yellow ._skin-font { color: #EBC91C; } .orange ._skin-font { color: #EC9415; } .blue ._skin-font { color: #4DB5FF; } .red ._skin-font { color: #F10F2A; } .green ._skin-font { color: #50B347; } /* main sections */ .main-container { -webkit-transition: margin-left 300ms linear, -webkit-transform 300ms linear; -ms-transition: margin-left 300ms linear, -ms-transform 300ms linear; transition: margin-left 300ms linear, transform 300ms linear; will-change: margin-left, transform; } .mobile-logo-header { background-color: #1A1A1A; text-align: center; } a.mobile-menu__list-item-anchor { color: #fff; background-color: #222; border-bottom-style: solid; border-bottom-color: #333; text-decoration: none; } a.mobile-menu__list-item-anchor:hover { background-color: #333; color: #fff; } hgroup {background-color: #121212; border-top-style: solid; border-top-color: #595959; box-shadow: -1px 0 0 rgba(255, 255, 255, 0.1) inset} .gaza-header {background: url(/images/bg/gaza-header.png?1578503741) no-repeat} .flag-tip .media-type-info > .flag-tooltip {color: #404040;} .media-type-title, .grab-blog-widget {color: #404040} .media-type-subtitle {color: #404040; border-top-style: dotted; border-top-color: #aaaaaa} .media-type-link {color: #50b347} .blog-widget-textarea { border-radius: 4px; } .header-sponsor {background: url(/images/bg/sponsor_header.png?1578503741) top center no-repeat} .header-sponsor > span {font-size: 12px; color: #fff;} .side-tab {background: url(/images/side-tab.png) no-repeat} .jspScrollable > .jspContainer > .jspPane > .voice-all > li a {color: #4c4c4c} .clear-search {background: url(/images/bg/sprites/clear-search.png?1578503741) left top no-repeat} .clear-search:hover {background-position: left bottom} .invisible { opacity: 0; cursor: text; } .overlay-mask {background: rgba(0,0,0,0.8)} /* Messages Styles */ .flash-message { background: #fff; box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.05); -webkit-transition: left 300ms linear; transition: left 300ms linear; } .message { border-bottom: 1px solid rgba(178, 134, 0, 0.75); background-color: #ffedb8; background-image: -webkit-linear-gradient(top, #fdefc4, #fce7ac); background-image: linear-gradient(to bottom, #fdefc4, #fce7ac); } .message p a { text-decoration: underline; } .message p a:hover { color: #bf8f00; } .close-message { cursor: pointer; color: #bf8f00; } .message, .message p a, .close-message:hover { color: #806000; } /* loading wrapper MEDIAFEED */ .image-bg-patter {background: transparent url(/images/bg/load-pattern.png?1578503741) repeat;} .spinner { background: #a5a5a5 url(/images/bg/more-noise.png?1578503741) 100% 100% repeat-x; color: #000000; text-shadow: 0 1px 0 #cacaca; border-color: #505759; -moz-box-shadow: 0 0 10px #000000; -webkit-box-shadow: 0 0 10px #000000; box-shadow: 0 0 10px #000000 } .corner-all2 { border-radius: 2px } /* Temp */ .install {text-indent: -999em; background: url(/images/bg/sprites/crowdvoice_about.png?1578503741) no-repeat 0 0} .install:hover {background-position: 0 -18px} .fm-admin-overlay { position: absolute; display: none; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; } .fm-admin-overlay img { position: absolute; top: 50%; left: 50%; margin: -16px 0 0 -16px; } .crowdvoice-custom-slogan { text-align: center; font-size: 20px; font-weight:bold; font-family: Helvetica; color: #BFBFBF; text-shadow: 0 -1px 4px rgba(0, 0, 0, 0.6); } /* Viewport navigation */ #sidebar-toggler { border-right: 1px solid #6f6f6f; } .menu-item:hover:not(.active) { background-color: #262626; } .menu-item.idle:hover { background-color: transparent; } #sidebar-toggler:hover { background-color: #333333; } .menu-item .menu-link { font-size: 12px; line-height: 12px; color: #ffffff; text-decoration: none; text-transform: uppercase; border-radius: 2px 2px 0 0; box-shadow: none; } .menu-item .menu-link:active { box-shadow: none; } .top-left-navigation .menu-item.active .menu-link { background-color: #f2f2f2; color: #4c4c4c; } .menu-item .menu-lines, .menu-lines:after, .menu-lines:before { background: none repeat scroll 0 0 #CCCCCC; } #sidebar-toggler.menu-item.active { background-color: #000000; } #sidebar-toggler.menu-item.active:after { background-color: #595959; } .menu-item.active:hover .menu-lines, .menu-item.active:hover .menu-lines:before, .menu-item.active:hover .menu-lines:after { background-color: #fff; } .map-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5; overflow: hidden; background: #000; opacity: 0; visibility: hidden; -webkit-transition: all 400ms; transition: all 400ms; } .map-overlay.active { opacity: 1; visibility: visible; } .map-overlay > iframe { overflow-y: auto; border: none; } .map-container { position: absolute !important; top: 0; left: 0; width:100%; height:100%; z-index: 5; opacity: 0; display: none; background-color: rgb(42, 43, 44); } .map-container.shown { opacity: 1; display: block; } .map-container .loader { position: absolute; width: 100%; top: 50%; margin-top: -28px; } .main-map-widget { height: 100%; } .map-container .map-overlay { top: 41px; } .map-container__header { position: relative; z-index: 6; height: 41px; padding: 0 14px; background-color: #262626; box-shadow: inset 0 -4px 0 0 #000; } .map-container__header:before { content: ''; position: absolute; left: 0; bottom: -5px; height: 5px; width: 100%; background-color: rgba(0,0,0,0.2); } .map-container__header-rainbow { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background-image: linear-gradient(to right, #66b3ff 0%, #66b3ff 20%, #3c9b2e 20%, #3c9b2e 40%, #d6b406 40%, #d6b406 60%, #d57a05 60%, #d57a05 80%, #dd071d 80%, #dd071d 100%); box-shadow: inset 0 1px 0 0 rgba(255,255,255,0.3), 0 1px 0 0 rgba(0,0,0,0.25); } .map-container__header-title { font-size: 16px; line-height: 1; padding: 10px 0 0 10px; color: #b2b2b2; } .map-container__header-filters { padding: 9px 0 0 0; } .map-container__header-filters-title { font-size: 12px; padding: 0 10px 0 0; color: #808080; } .map-container__header-filters .cv-inline-block { position: relative; padding: 0 10px 0 0; } .map-container__header-filters .cv-inline-block:last-child { padding: 0; } .map-container__header-filters .cv-button { border: 1px solid #000; } .map-container__header-filters .cv-button:active { padding-top: 3px; } .map-container__header-filters .cv-button--arrow { margin-left: .4em; } .map-container__header-filters .cv-tooltip { } .map-container__header-filters .cv-tooltip-inner { top: 10px; padding: 0.6em 0.8em; } .map-container__filter-region .cv-tooltip { left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .map-container__filter-region .cv-tooltip__arrow { left: 2.2em; } .map-container__filter-theme .cv-tooltip { left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .map-container__filter-theme .cv-tooltip__arrow { left: 2em; } .map-container__filter-features .cv-tooltip { left: initial; right: 0; -webkit-transform: translateX(0); transform: translateX(0); } .map-container__filter-features .cv-tooltip__arrow { left: auto; right: 2em; } .map-container__header .cv-tooltip label { font-size: 12px; display: block; white-space: nowrap; margin: 0 0 .3em; } .map-container__header .cv-tooltip label input { margin-right: .25em; } /* map overlay labels */ .map-voices li { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .map-voices a { display: block; } /* Variable Grid System. Learn more ~ http://www.spry-soft.com/grids/ Based on 960 Grid System - http://960.gs/ Licensed under GPL and MIT. */ /* Containers ----------------------------------------------------------------------------------------------------*/ .container_8 { margin-left: auto; margin-right: auto; width: 1000px; } /* Grid >> Global ----------------------------------------------------------------------------------------------------*/ .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8 { display:inline; float: left; position: relative; margin-left: 10px; margin-right: 10px; } /* Grid >> Children (Alpha ~ First, Omega ~ Last) ----------------------------------------------------------------------------------------------------*/ .alpha { margin-left: 0; } .omega { margin-right: 0; } /* Grid >> 8 Columns ----------------------------------------------------------------------------------------------------*/ .container_8 .grid_1 { width:105px; } .container_8 .grid_2 { width:230px; } .container_8 .grid_3 { width:355px; } .container_8 .grid_4 { width:480px; } .container_8 .grid_5 { width:605px; } .container_8 .grid_6 { width:730px; } .container_8 .grid_7 { width:855px; } .container_8 .grid_8 { width:980px; } /* Prefix Extra Space >> 8 Columns ----------------------------------------------------------------------------------------------------*/ .container_8 .prefix_1 { padding-left:125px; } .container_8 .prefix_2 { padding-left:250px; } .container_8 .prefix_3 { padding-left:375px; } .container_8 .prefix_4 { padding-left:500px; } .container_8 .prefix_5 { padding-left:625px; } .container_8 .prefix_6 { padding-left:750px; } .container_8 .prefix_7 { padding-left:875px; } /* Suffix Extra Space >> 8 Columns ----------------------------------------------------------------------------------------------------*/ .container_8 .suffix_1 { padding-right:125px; } .container_8 .suffix_2 { padding-right:250px; } .container_8 .suffix_3 { padding-right:375px; } .container_8 .suffix_4 { padding-right:500px; } .container_8 .suffix_5 { padding-right:625px; } .container_8 .suffix_6 { padding-right:750px; } .container_8 .suffix_7 { padding-right:875px; } /* Push Space >> 8 Columns ----------------------------------------------------------------------------------------------------*/ .container_8 .push_1 { left:125px; } .container_8 .push_2 { left:250px; } .container_8 .push_3 { left:375px; } .container_8 .push_4 { left:500px; } .container_8 .push_5 { left:625px; } .container_8 .push_6 { left:750px; } .container_8 .push_7 { left:875px; } /* Pull Space >> 8 Columns ----------------------------------------------------------------------------------------------------*/ .container_8 .pull_1 { left:-125px; } .container_8 .pull_2 { left:-250px; } .container_8 .pull_3 { left:-375px; } .container_8 .pull_4 { left:-500px; } .container_8 .pull_5 { left:-625px; } .container_8 .pull_6 { left:-750px; } .container_8 .pull_7 { left:-875px; } /* Containers ----------------------------------------------------------------------------------------------------*/ .container_6 { margin-left: auto; margin-right: auto; width: 960px; } /* Grid >> Global ----------------------------------------------------------------------------------------------------*/ .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6 { display:inline; float: left; position: relative; margin-left: 10px; margin-right: 10px; } /* Grid >> Children (Alpha ~ First, Omega ~ Last) ----------------------------------------------------------------------------------------------------*/ .alpha { margin-left: 0; } .omega { margin-right: 0; } /* Grid >> 6 Columns ----------------------------------------------------------------------------------------------------*/ .container_6 .grid_1 { width:140px; } .container_6 .grid_2 { width:300px; } .container_6 .grid_3 { width:460px; } .container_6 .grid_4 { width:620px; } .container_6 .grid_5 { width:780px; } .container_6 .grid_6 { width:940px; } /* Prefix Extra Space >> 6 Columns ----------------------------------------------------------------------------------------------------*/ .container_6 .prefix_1 { padding-left:160px; } .container_6 .prefix_2 { padding-left:320px; } .container_6 .prefix_3 { padding-left:480px; } .container_6 .prefix_4 { padding-left:640px; } .container_6 .prefix_5 { padding-left:800px; } /* Suffix Extra Space >> 6 Columns ----------------------------------------------------------------------------------------------------*/ .container_6 .suffix_1 { padding-right:160px; } .container_6 .suffix_2 { padding-right:320px; } .container_6 .suffix_3 { padding-right:480px; } .container_6 .suffix_4 { padding-right:640px; } .container_6 .suffix_5 { padding-right:800px; } /* Push Space >> 6 Columns ----------------------------------------------------------------------------------------------------*/ .container_6 .push_1 { left:160px; } .container_6 .push_2 { left:320px; } .container_6 .push_3 { left:480px; } .container_6 .push_4 { left:640px; } .container_6 .push_5 { left:800px; } /* Pull Space >> 6 Columns ----------------------------------------------------------------------------------------------------*/ .container_6 .pull_1 { left:-160px; } .container_6 .pull_2 { left:-320px; } .container_6 .pull_3 { left:-480px; } .container_6 .pull_4 { left:-640px; } .container_6 .pull_5 { left:-800px; } /* Containers ----------------------------------------------------------------------------------------------------*/ .container_3 { margin-left: auto; margin-right: auto; width: 960px; } /* Grid >> Global ----------------------------------------------------------------------------------------------------*/ .grid_1, .grid_2, .grid_3 { display:inline; float: left; position: relative; margin-left: 10px; margin-right: 10px; } /* Grid >> Children (Alpha ~ First, Omega ~ Last) ----------------------------------------------------------------------------------------------------*/ .alpha { margin-left: 0; } .omega { margin-right: 0; } /* Grid >> 3 Columns ----------------------------------------------------------------------------------------------------*/ .container_3 .grid_1 { width:300px; } .container_3 .grid_2 { width:620px; } .container_3 .grid_3 { width:940px; } /* Prefix Extra Space >> 3 Columns ----------------------------------------------------------------------------------------------------*/ .container_3 .prefix_1 { padding-left:320px; } .container_3 .prefix_2 { padding-left:640px; } /* Suffix Extra Space >> 3 Columns ----------------------------------------------------------------------------------------------------*/ .container_3 .suffix_1 { padding-right:320px; } .container_3 .suffix_2 { padding-right:640px; } /* Push Space >> 3 Columns ----------------------------------------------------------------------------------------------------*/ .container_3 .push_1 { left:320px; } .container_3 .push_2 { left:640px; } /* Pull Space >> 3 Columns ----------------------------------------------------------------------------------------------------*/ .container_3 .pull_1 { left:-320px; } .container_3 .pull_2 { left:-640px; } /* Clear Floated Elements ----------------------------------------------------------------------------------------------------*/ /* http://sonspring.com/journal/clearing-floats */ .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } /* http://perishablepress.com/press/2009/12/06/new-clearfix-hack/ */ /* new clearfix */ .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } * html .clearfix { zoom: 1; } /* IE6 */ *:first-child+html .clearfix { zoom: 1; } /* IE7 */ /* * 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: 0; width: 11px; height: 100%; } .jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 16px; } .jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; } .jspCap { display: none; } .jspHorizontalBar .jspCap { float: left; } .jspTrack { position: relative; background: #bdbdbd; background: -moz-linear-gradient(left, #bdbdbd 0%, #e0e0e0 41%, #e3e3e3 44%, #e9e9e9 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,#bdbdbd), color-stop(41%,#e0e0e0), color-stop(44%,#e3e3e3), color-stop(100%,#e9e9e9)); background: -webkit-linear-gradient(left, #bdbdbd 0%,#e0e0e0 41%,#e3e3e3 44%,#e9e9e9 100%); background: -o-linear-gradient(left, #bdbdbd 0%,#e0e0e0 41%,#e3e3e3 44%,#e9e9e9 100%); background: -ms-linear-gradient(left, #bdbdbd 0%,#e0e0e0 41%,#e3e3e3 44%,#e9e9e9 100%); background: linear-gradient(to right, #bdbdbd 0%,#e0e0e0 41%,#e3e3e3 44%,#e9e9e9 100%); } .jspDrag {position: relative; top: 0; left: 0; cursor: pointer; background-color: #c1c1c1; background-image: -moz-linear-gradient(left, #c8c8c8, #a4a4a4); background-image: -ms-linear-gradient(left, #c8c8c8, #a4a4a4); background-image: -o-linear-gradient(left, #c8c8c8, #a4a4a4); background-image: -webkit-gradient(linear, left top, right top, from(#c8c8c8), to(#a4a4a4)); background-image: -webkit-linear-gradient(left, #c8c8c8, #a4a4a4); background-image: linear-gradient(left, #c8c8c8, #a4a4a4); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#c8c8c8', EndColorStr='#a4a4a4'); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -moz-box-shadow:inset 0px 0px 0px 1px #989898; /* FF3.5+ */ -webkit-box-shadow:inset 0px 0px 0px 1px #989898; /* Saf3.0+, Chrome */ box-shadow:inset 0px 0px 0px 1px #989898; /* Opera 10.5, IE9, Chrome 10+ */ } .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: 16px; 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; } .cv-branding--arrow { position: relative; display: inline-block; vertical-align: top; height: 52px; margin-right: 2em; padding: 1em 1em 0; } .cv-branding--arrow:before, .cv-branding--arrow:after { content: ''; position: absolute; width: 1px; height: 53%; top: 0; right: 0; background-color: #4c4c4c; } .cv-branding--arrow:before { transform-origin: 0 0; transform: rotate(-20deg); } .cv-branding--arrow:after { transform-origin: 0 100%; transform: rotate(20deg); top: initial; bottom: 0; } .cv-branding--arrow .logo { margin: 2px 5px 0 0; } .cv-uppercase { text-transform: uppercase; } .cv-underline { text-decoration: underline; } .cv-block { display: block; width: 100%; } .cv-inline-block { display: inline-block; vertical-align: top; } .cv-pull-left { float: left; } .cv-pull-right { float: right; } .cv-center { text-align: center; } .cv-vertical-align { vertical-align: middle; } .cv-table { display: table; width: 100%; height: 100%; } .cv-cell { display: table-cell; } /* DYNAMIC TEXT COLOR */ .green .cv-dynamic-text-color, .green .active .cv-dynamic-active-text-color, .green .cv-dynamic-hover-text-color:hover, .green .cv-dynamic-hover-text-color:hover .icon, .green a.cv-dynamic-hover-text-color:hover .icon { color: #50b347; } .blue .cv-dynamic-text-color, .blue .active .cv-dynamic-active-text-color, .blue .cv-dynamic-hover-text-color:hover, .blue .cv-dynamic-hover-text-color:hover .icon, .blue > a.cv-dynamic-hover-text-color:hover .icon { color: #4db5ff; } .yellow .cv-dynamic-text-color, .yellow .active .cv-dynamic-active-text-color, .yellow .cv-dynamic-hover-text-color:hover, .yellow .cv-dynamic-hover-text-color:hover .icon, .yellow > a.cv-dynamic-hover-text-color:hover .icon { color: #ebc91c; } .red .cv-dynamic-text-color, .red .active .cv-dynamic-active-text-color, .red .cv-dynamic-hover-text-color:hover, .red .cv-dynamic-hover-text-color:hover .icon, .red > a.cv-dynamic-hover-text-color:hover .icon { color: #f10f2a; } .orange .cv-dynamic-text-color, .orange .active .cv-dynamic-active-text-color, .orange .cv-dynamic-hover-text-color:hover, .orange .cv-dynamic-hover-text-color:hover .icon, .orange > a.cv-dynamic-hover-text-color:hover .icon { color: #ec9415; } /* DYNAMIC BACKGROUND COLOR */ .green .cv-dynamic-background-color { background-color: #50b347; } .blue .cv-dynamic-background-color { background-color: #4db5ff; } .yellow .cv-dynamic-background-color { background-color: #ebc91c; } .red .cv-dynamic-background-color { background-color: #f10f2a; } .orange .cv-dynamic-background-color { background-color: #ec9415; } /* DYNAMIC BORDER COLORS */ .green .cv-dynamic-border-color, .green .cv-dynamic-active-border-color.active { border-color: #50b347; } .blue .cv-dynamic-border-color, .blue .cv-dynamic-active-border-color.active { border-color: #4db5ff; } .yellow .cv-dynamic-border-color, .yellow .cv-dynamic-active-border-color.active { border-color: #ebc91c; } .red .cv-dynamic-border-color, .red .cv-dynamic-active-border-color.active { border-color: #f10f2a; } .orange .cv-dynamic-border-color, .orange .cv-dynamic-active-border-color.active { border-color: #ec9415; } /* DYNAMIC ARROW COLORS */ .green .cv-dynamic-horizontal-arrow { border-color: transparent #50b347; } .blue .cv-dynamic-horizontal-arrow { border-color: transparent #4db5ff; } .yellow .cv-dynamic-horizontal-arrow { border-color: transparent #ebc91c; } .red .cv-dynamic-horizontal-arrow { border-color: transparent #f10f2a; } .orange .cv-dynamic-horizontal-arrow { border-color: transparent #ec9415; } /* hover misc */ .cv-hover-twitter-brand-color:hover, .cv-hover-twitter-brand-color:hover .icon { color: #55acee; } .cv-hover-facebook-brand-color:hover, .cv-hover-facebook-brand-color:hover .icon { color: #3b5998; } .cv-hover-danger-brand-color:hover, .cv-hover-danger-brand-color:hover .icon { color: #dd0017; } .cv-button, .cv-button:visited { cursor: pointer; color: #d9d9d9; text-shadow: 0 1px 2px rgba(0,0,0,0.3); background-color: #4d4d4d; text-align: center; text-decoration: none; border-radius: 3px; box-shadow: inset 0 -3px 0 #363636; border-width: 0; display: inline-block; font-size: 11px; height: 25px; padding: 2px 10px 4px; } .cv-button:hover { background-color: #595959; text-decoration: none; } .cv-button:active, .cv-button.active { padding-top: 4px; padding-bottom: 2px; box-shadow: inset 0 3px 0 #363636; } .cv-button.disabled { pointer-events: none; opacity: 0.5; } /** * Sizes **/ .cv-button--small, .cv-button--small:visited { position: relative; display: inline-block; vertical-align: text-bottom; padding: 0em .5em 0; height: 19px; font-size: 10px; text-decoration: none; text-transform: uppercase; border-radius: 3px; box-shadow: inset 0 -1px 0 #000; } .cv-button--small:active, .cv-button--small.active { padding-top: 0; } .cv-button--medium { font-size: 18px; padding: .45em 1em .35em; height: auto; } .cv-button--medium:active, .cv-button--medium.active { padding-top: .5em; padding-bottom: .3em; } /** * Colors */ .cv-button--trans, .cv-button--trans:visited { background-color: rgba(0,0,0,.2); color: #fff; border: 1px solid rgba(255,255,255,.5); background-clip: padding-box; } .cv-button--trans:hover { text-decoration: none; background-color: #000; border-color: rgba(255,255,255,.7); } /* light color */ .cv-button--light, .cv-button--light:visited { background-color: #fafafa; border: 1px solid rgba(0,0,0,0.2); text-shadow: none; box-shadow: inset 0 -2px 0 rgba(0,0,0,0.1); } .cv-button--light:hover { background-color: #fff; text-decoration: none; } .cv-button--light:active, .cv-button--light.active, .cv-button--light.selected { box-shadow: inset 0 2px 0 rgba(0,0,0,0.1); } .green .cv-button--light.dynamic { color: #50b347; } .blue .cv-button--light.dynamic { color: #4db5ff; } .yellow .cv-button--light.dynamic { color: #ebc91c; } .red .cv-button--light.dynamic { color: #f10f2a; } .orange .cv-button--light.dynamic { color: #ec9415; } /* dynamic background color */ .cv-button--dynamic-color { box-shadow: inset 0 -3px 0 rgba(0,0,0,.1); text-shadow: none; } .cv-button--dynamic-color:active { box-shadow: inset 0 3px 0 rgba(0,0,0,.1); } .green .cv-button--dynamic-color { background-color: #50b347; color: #fff; } .green .cv-button--dynamic-color:hover { background-color: #32bb25; } .blue .cv-button--dynamic-color { background-color: #4db5ff; color: #fff; } .blue .cv-button--dynamic-color:hover { background-color: #66bfff; } .yellow .cv-button--dynamic-color { background-color: #ebc91c; color: #fff; } .yellow .cv-button--dynamic-color:hover { background-color: #edcf35; } .red .cv-button--dynamic-color { background-color: #f10f2a; color: #fff; } .red .cv-button--dynamic-color:hover { background-color: #f33047; } .orange .cv-button--dynamic-color { background-color: #ec9415; color: #fff; } .orange .cv-button--dynamic-color:hover { background-color: #ee9d2b; } /* * variations */ .cv-button--arrow, .cv-button--arrow-top { position: relative; display: inline-block; vertical-align: top; top: 7px; margin-left: .4em; border-width: .3em .3em 0; border-style: solid; border-color: #999 transparent; } .cv-button--arrow-top { border-width: 0 .3em .3em; } .cv-button.with-arrow.active .cv-button--arrow, .cv-button.with-arrow:hover .cv-button--arrow { border-width: 0 .3em .3em; } .cv-button.with-arrow.active .cv-button--arrow-top, .cv-button.with-arrow:hover .cv-button--arrow-top { border-width: .3em .3em 0; } .cv-input { padding: 0 1em; border: 1px solid #b2b2b2; border-radius: .25em; box-shadow: inset 0 2px 0 rgba(0,0,0,.1); } /* ===== Sizes ===== */ .cv-input--small { height: 21px; } .cv-input--medium { font-size: 15px; height: 35px; } /* ===== Style Options ===== */ .cv-input.error { border-color: #d90000 !important; background-color: #fffcfc; box-shadow: inset 0 2px 0 rgba(0,0,0,.1), 0 0 5px rgba(255, 0, 0, .2) !important; } .cv-input--small.cv-input--rounded { border-radius: 11px; } .green .cv-input--dynamic-color:focus { border-color: #50b347; box-shadow: inset 0 2px 0 rgba(0,0,0,.1), 0 0 5px rgba(80, 179, 71, .5); } .blue .cv-input--dynamic-color:focus { border-color: #4db5ff; box-shadow: inset 0 2px 0 rgba(0,0,0,.1), 0 0 5px rgba(77, 181, 255, .5); } .yellow .cv-input--dynamic-color:focus { border-color: #ebc91c; box-shadow: inset 0 2px 0 rgba(0,0,0,.1), 0 0 5px rgba(235, 201, 28, .5); } .red .cv-input--dynamic-color:focus { border-color: #f10f2a; box-shadow: inset 0 2px 0 rgba(0,0,0,.1), 0 0 5px rgba(241, 15, 42, .5); } .orange .cv-input--dynamic-color:focus { border-color: #ec9415; box-shadow: inset 0 2px 0 rgba(0,0,0,.1), 0 0 5px rgba(236, 148, 21, .5); } .has-cv-tooltip { position: relative; } .has-cv-tooltip:hover .cv-tooltip, .cv-tooltip.active { display: block; opacity: 1; } .cv-tooltip { display: none; opacity: 0; position: absolute; z-index: 100; transition: all 300ms; } .cv-tooltip__arrow { position: absolute; left: 50%; margin-left: -5px; } .cv-tooltip__arrow-item { display: block; width: 0; height: 0; border: 5px solid transparent; } .cv-tooltip__arrow-item:after { content: ''; position: absolute; top: 0; left: 0; width: 0; height: 0; border-width: 6px; border-style: inherit; z-index: 1; } .cv-tooltip-inner { position: relative; top: 10px; padding: .6em 1em; border: 1px solid rgba(0,0,0,0.3); background-color: #fff; border-radius: 4px; box-shadow: 0px 2px 10px rgba(0, 0, 0, .4); } /* == positioning_options == */ /* -- bottom -- */ .cv-tooltip--bottom { top: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin-top: -5px; } .cv-tooltip--bottom .cv-tooltip__arrow-item { border-color: transparent; border-bottom-color: rgba(0,0,0,0.3); } .cv-tooltip--bottom .cv-tooltip__arrow-item:after { top: 1px; left: -1px; border-color: transparent; border-bottom-color: #fff; } /* -- top -- */ .cv-tooltip--top { bottom: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: -5px; } .cv-tooltip--top > .cv-tooltip__arrow { bottom: 0; } .cv-tooltip--top .cv-tooltip__arrow-item { border-color: transparent; border-top-color: rgba(0,0,0,0.3); } .cv-tooltip--top .cv-tooltip__arrow-item:after { top: -1px; left: -1px; border-color: transparent; border-top-color: #fff; } .cv-tooltip--top .cv-tooltip-inner { top: 0; margin-bottom: 10px; } /* -- right -- */ .cv-tooltip--right { left: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); margin-left: -5px; } .cv-tooltip--right > .cv-tooltip__arrow { left: 0; top: 50%; margin-left: 0; margin-top: -5px; } .cv-tooltip--right .cv-tooltip__arrow-item { border-color: transparent; border-right-color: rgba(0,0,0,0.3); } .cv-tooltip--right .cv-tooltip__arrow-item:after { left: 1px; top: -1px; border-color: transparent; border-right-color: #fff; } .cv-tooltip--right .cv-tooltip-inner { top: 0; left: 10px; } /* == utils_options == */ .cv-tooltip--nowrap { white-space: nowrap; } /* == custom_tooltips == */ .tooltip > .tooltip-positioner > .media-type-info, .tooltip-positioner > form > .grab-blog-widget { border-color: rgba(0,0,0,.3); border-style: solid; background-color: #fff; border-radius: 5px; box-shadow: 0px 2px 10px rgba(0, 0, 0, .4); } .cv-simple-tooltip { position: absolute; padding: 6px 7px; font-size: 11px; line-height: 1em; white-space: nowrap; z-index: 2; border-radius: 3px; background: rgba(0, 0, 0, 1); color: rgba(255, 255, 255, 1); z-index: 3; display: none; } .cv-simple-tooltip.active { display: block; } .cv-simple-tooltip:before { content: ""; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-top: 5px solid rgba(0, 0, 0, 1); } .mediafeed-sprite { display: inline-block; width: 24px; height: 24px; background: url(/images/v4/sprite-media-feed.png?1578503741) no-repeat; } .mediafeed-sprite.twitter { width: 14px; height: 13px; background-position: 0 0; } .mediafeed-sprite.facebook { width: 7px; height: 14px; background-position: -24px 0; } .mediafeed-sprite.link-icon, .mediafeed-sprite.link-type-icon, .mediafeed-sprite.image-icon, .mediafeed-sprite.image-type-icon, .mediafeed-sprite.video-icon, .mediafeed-sprite.video-type-icon { width: 16px; height: 16px; } .mediafeed-sprite.link-icon { background-position: 0 -24px; } .mediafeed-sprite.image-icon { background-position: -48px -24px; } .mediafeed-sprite.video-icon { background-position: -24px -24px; } .mediafeed-sprite.link-type-icon { background-position: 0 -72px; } .mediafeed-sprite.image-type-icon { background-position: -48px -72px; } .mediafeed-sprite.video-type-icon { background-position: -24px -72px; } .mediafeed-sprite.flag { width: 14px; height: 15px; background-position: -48px 0; } .mediafeed-sprite.flag:hover, .mediafeed-sprite.flag-pressed { width: 14px; height: 15px; background-position: -120px 0; } .mediafeed-sprite.allow-post { width: 12px; height: 19px; background-position: 0 -48px; } .mediafeed-sprite.deny-post { width: 12px; height: 19px; background-position: -24px -48px; } .mediafeed-sprite.pin-icon { width: 7px; height: 11px; background-position: -48px -48px; } .mediafeed-sprite.gear-icon { width: 11px; height: 11px; background-position: -72px -48px; } .mediafeed-sprite.rss-icon { width: 9px; height: 9px; background-position: -96px -48px; } .mediafeed-sprite.search-icon { width: 10px; height: 10px; background-position: -120px -48px; } .mediafeed-sprite.right-arrow, .mediafeed-sprite.left-arrow { width: 8px; height: 13px; } .mediafeed-sprite.left-arrow { background-position: -72px -24px; } .mediafeed-sprite.right-arrow { background-position: -97px -24px; } .mediafeed-sprite.back-arrow { width: 14px; height: 12px; background-position: -120px -24px; } .mediafeed-sprite.logo { width: 20px; height: 21px; background-position: -72px -72px; } .mediafeed-sprite.play-icon { width: 47px; height: 47px; background-position: -96px -72px; } .mediafeed-sprite.play-icon--small { width: 23px; height: 23px; background-position: -96px -120px; } /* hidden */ .sidebar-wrapper { position: absolute; left: 0; top: 0; bottom: 0; width: 250px; z-index: 3; -webkit-transform: translateX(-250px); -ms-transform: translateX(-250px); transform: translateX(-250px); -webkit-backface-visibility: hidden; } .sidebar-state__open .sidebar-wrapper { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } /* Fix sidebar items rendering issue on safari 5.1.7 && 6.0.5 */ .sidebar-wrapper .sidebar-scroller { -webkit-transform: translate3d(0,0,0); } hgroup { width: 250px; border-top-width: 3px; display: block; position: relative; } hgroup::after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0} .voice { width: 250px; } .logo-header {margin-top:10px;} .logo-custom-header {margin-top:8px; text-align: center} .logo-custom-header a:hover {text-decoration: none } .logo-container {display:block; clear:both; width:100%; margin-bottom: 8px} .logo-container a {display: inline-block; vertical-align: top} .crowdvoice-logo {float: left; width: 169px; height: 25px} .crowdvoice-logo.gaza {float: left; width: 176px; height: 25px; margin-right:4px} .crowdvoice-about {height: 18px; width: 18px; margin-top: 3px} .about-link-wrapper {position: relative; display: inline-block} .crowdvoice-slogan { width: 220px; white-space: nowrap; font-size: 14px; line-height: 12px; padding: 0 0 10px; margin: 0 auto; overflow: hidden; text-overflow: ellipsis; } .create-voice { padding: 7px 7px 15px; position: relative; z-index: 2; } .touch .create-voice { display: none; } .create-voice li { display: inline-block; position: relative; } .create-voice li > a { margin: 0 2px; } .create-voice .tooltip-positioner {left: -30%} .create-voice .tooltip-arrow {left: 29%} .create-voice .media-type-info { padding: 5px 15px 5px 12px; width: 170px; overflow: hidden; } .create-voice > .view-video { height: 27px; text-align: center; } .create-voice > .view-video li { float: none; display: inline-block; vertical-align: top; } /* Side Bar Register/Login */ .user-form {display: none;} .register-sec {overflow: hidden} .login-sec {overflow: hidden} .install-sec {overflow: hidden} .form-label {width: 68px} .forgot-pass {height:20px !important} .register-login {width: 240px; margin: 5px auto} .register-login > tbody > tr {margin-bottom: 10px; height: 42px} .register-login > tbody > .error {height: 14px} .register-login > tbody > tr > td > label {font-size: 12px; line-height: 11px} .register-login > tbody > tr > td > input {width: 145px; height: 24px; border-width: 1px 0 0 0; font-size: 12px; padding: 0 5px} .register-login > tbody > tr > td > .error { border-width: 1px; border-style: solid; width: 158px; height: 23px;} .user-form > ul {margin: 8px 0px 21px 78px; display: block; float: left} .user-form > ul > li {float: left; margin: 0 13px 0 0} .user-form > ul > .cancel {padding:6px 0} .user-form > ul > .cancel > a {font-size: 11px} .signup-btn {float: left} .signup-btn > input {float: left; font-size: 12px;} /* Side Bar Search Area */ .voice-search { height: 43px; position: relative; z-index: 1; } .voice-search .search { position: relative; width: 75%; height: 24px; display: inline-block; vertical-align: top; padding: 0 25px 0 27px; margin-top: 9px; margin-left: 10px; border-width: 1px 0 0 0; font-size: 12px; } .voice-search .icon-search { color: #bbb; position: absolute; left: 18px; top: 15px; font-size: 12px; } .voice-search > ul { display: inline-block; vertical-align: top; } .voice-search > ul > li > .map-btn {height: 25px; width: 25px; display: block; border-width: 1px;} .map-btn .icon { display: inline-block; font-size: 14px; margin-top: 4px; color: #ccc; } /*.tooltip-map {top: 29px}*/ .mapit { position: relative; margin: 9px 0 0 15px; } .mapit > .tooltip > .tooltip-positioner > .media-type-info {padding: 6px 10px; text-align:center} .mapit > .tooltip > .tooltip-positioner > .media-type-info > .media-type-title {width:174px; padding:0px; font-size: 13px} .clear-search {width:13px; height:13px; position:absolute; right: 60px; top: 15px; cursor:pointer; display:none; z-index:2} /* Side Bar Scroll Voice Area */ .sidebar-scroller { height: 1000px; z-index: 0; } .sidebar-scroller .jspPane { width: 100% !important; } .sidebar-scroller .jspVerticalBar { right: 5px; width: 6px; } .searchable { cursor: pointer; width: 250px; } .searchable > ul > li {position: relative} .sidebar-scroller__list-item {font-size: 13px} .sidebar-scroller__list-item.last a {border-width: 0} /* Side Bar Custom Scroll Voice Area */ .sprite-sidebar { display: inline-block; width: 32px; height: 32px; } .tab-controller .sprite-sidebar, .info-tab-controller .sprite-sidebar {width: 5px; height: 7px; position: absolute; top: 50%; left: 4px;} .notification .sprite-sidebar {width: 10px; height: 14px; margin: 6px 0 0 8px} .sidebar-scroller__accordion-toggler { border-width: 1px 0; font-size: 12px; font-weight: normal; margin: 0; padding: 2px 10px 0; height: 20px; display: block; width: 100%; } .sidebar-scroller__accordion-toggler:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0} .sidebar-scroller__accordion-arrow { display: inline-block; vertical-align: top; margin: 1px 5px 0 0; width: 10px; height: 10px; text-indent: -999em; } .sidebar-scroller__accordion-toggler > h2 { display: inline-block; vertical-align: top; font-size: 9px; line-height: 14px; } .sidebar-scroller__list-item {border-left-width: 2px} .sidebar-scroller__list-item-anchor { display:block; font-size: 13px; line-height: 17px; padding: 12px 12px 10px 12px; } .sidebar-scroller .is_infographic .sidebar-scroller__list-item-anchor, .sidebar-scroller .backstory .sidebar-scroller__list-item-anchor {padding-right: 37px} .sidebar-scroller .is_infographic.backstory .sidebar-scroller__list-item-anchor {padding-right: 49px} .sidebar-scroller__list-item .anchor { position: absolute !important; top: 12px; right: 10px; display: inline-block; vertical-align: top; font-size: 12px; } .sidebar-scroller__list-item .anchor + .anchor { right: 30px; } .tab-controller { display: none; position: absolute; top: 0; right: -16px; width: 16px; height: 100%; z-index: -1; } .sidebar-tooltip { font-size: 12px; left: 23px; margin-top: -18px; padding: 5px 15px; position: fixed; text-align: center; top: 50%; width: 100px; z-index: 10; } .sidebar-tooltip:after{ height: 0; left: -14px; margin-top: -8px; position: absolute; top: 50%; width: 0; } .sidebar-tooltip:before { height: 0; left: -15px; margin-top: -8px; position: absolute; top: 50%; width: 0; } .hamburger-menu { display: none; margin-top: 10px; } .hamburger-menu .icon-bar { display: block; margin: 0 auto; width: 18px; height: 2px; } .hamburger-menu .icon-bar + .icon-bar { margin-top: 3px; } @media all and (min-width: 769px) { .sidebar-always-visible-on-large-view .sidebar-wrapper { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @media only screen and (max-device-width: 1024px){ .panel-padding { margin-left: 0; } .hamburger-menu { display: block; } .create-voice, .voice-search > ul, .tab-controller .sprite-sidebar { display: none; } .voice-search .search { width: 91%; } .clear-search { right: 20px; } .tab-controller { -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); display: block; width: 40px; height: 32px; left: 250px; } } @media only screen and (max-width: 768px) { .hamburger-menu { display: block; } .create-voice, .voice-search > ul, .tab-controller .sprite-sidebar { display: none; } .voice-search .search { width: 91%; } .clear-search { right: 20px; } div.tab-controller { display: block; width: 40px; height: 32px; left: 254px; top: 15px; background-color: transparent; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } div.tab-controller:hover { background-color: transparent; } .view__homepage .tab-controller { top: 0px; } } @media only screen and (max-width: 480px), only screen and (max-device-width: 480px) { div.tab-controller { top: 0; } } .sidebar-wrapper { -webkit-transition: -webkit-transform 300ms linear, left 300ms linear; -ms-transition: -ms-transform 300ms linear, left 300ms linear; transition: transform 300ms linear, left 300ms linear; } .logo-container {text-align: center} .crowdvoice-logo {text-indent: -999em; background: url(/images/icons/sidebar-sprite.png?1578503741) no-repeat 0 -138px} .crowdvoice-logo.gaza {text-indent: -999em; background: url(/images/bg/gaza-logo.png?1578503741) no-repeat 0 0 !important} .crowdvoice-about {text-indent: -999em; background: url(/images/bg/sprites/crowdvoice_about.png?1578503741) no-repeat 0 0} .crowdvoice-about:hover {background-position: 0 -18px} .crowdvoice-custom-about {text-indent: -999em; background: url(/images/bg/sprites/crowdvoice_about.png?1578503741) no-repeat 0 0} .crowdvoice-custom-about:hover {background-position: 0 -18px} .crowdvoice-slogan { color: #cccccc; text-align: center; text-transform: uppercase; } /* Side Bar Custom Scroll Voice Area */ .sprite-sidebar { background: transparent url(/images/icons/sidebar-sprite.png?1578503741) 0 0 no-repeat; } .searchable .select .sprite-sidebar { background: none; } .map-btn .sprite-sidebar {background-position: 0 -64px} .tab-controller .sprite-sidebar, .info-tab-controller .sprite-sidebar {background-position: -32px -64px} .tab-controller.close-control .sprite-sidebar, .info-tab-controller.close-control .sprite-sidebar {background-position: -64px -64px} .notification.red .sprite-sidebar {background-position: 0 -96px} .notification.green .sprite-sidebar {background-position: -160px -64px} .notification.blue .sprite-sidebar {background-position: -96px -64px} .notification.yellow .sprite-sidebar {background-position: -128px -64px} .notification.orange .sprite-sidebar {background-position: -192px -64px} .voice:not(.admin-sidebar-row) {background-color: #121212; box-shadow: -1px 0 0 rgba(255, 255, 255, 0.1) inset} /* Side Bar Register/Login */ .user-form {background-color: #262626} .register-login > tbody > .error > td > span {font-size: 10px; color: #e43d3d; font-weight: normal;} .register-login > tbody > tr > td > label {color: #999999} .register-login > tbody > tr > td > input { color: #BBBBBB; border-top-style: solid; border-top-color: #666666; border-radius: 3px; background: #666666; } .register-login > tbody > tr > td > input:focus { background-color: #fff; color: #444444; border-color: #4c4c4c; } .register-login > tbody > tr > td > .error {border-color: #ff0000; background:#fff5f5} .user-form > ul > .cancel > a {color: #999999} .create-voice { text-align: center; } .create-voice .voicebtn { opacity: 0.6; } .create-voice .voicelogin { opacity: 1; } .create-voice .cv-button { font-size: 12px; } .forgot-pass a {color: #fff} .forgot-pass a:hover {text-decoration: underline} /* Side Bar Search Area */ .voice-search { border-bottom: 1px solid #1C1C1C; background: #2f2f2f; background: -moz-linear-gradient(top, #2f2f2f 0%, #292929 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2f2f2f), color-stop(100%,#292929)); background: -webkit-linear-gradient(top, #2f2f2f 0%,#292929 100%); background: -o-linear-gradient(top, #2f2f2f 0%,#292929 100%); background: -ms-linear-gradient(top, #2f2f2f 0%,#292929 100%); background: linear-gradient(to bottom, #2f2f2f 0%,#292929 100%); } .voice-search .search { border-top-style: solid; border-top-color: #090909; color: #BBBBBB; border-radius: 13px; background-color: #4d4d4d; transition: background-color 400ms; } .voice-search .search:focus { background-color: #fff; color: #444444; border-color: #4c4c4c; transition: background-color 200ms; } .voice-search > ul > li > .map-btn { text-align: center; color: #e5e5e5; background-color: #626262; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#626262), to(#454545)); background-image: -webkit-linear-gradient(#626262, #454545); background-image: -moz-linear-gradient(#626262, #454545); background-image: -o-linear-gradient(#626262, #454545); background-image: linear-gradient(#626262, #454545); border-style: solid; border-color: #333; box-shadow: inset 0 1px 0 rgba(255,255,255,0.2), inset 0 0 0 1px rgba(255,255,255,0.1); border-radius: 15px; background-clip: padding-box; } .voice-search > ul > li > .map-btn:hover { color: #e5e5e5; background-color: #777; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7F7F7F), to(#686868)); background-image: -webkit-linear-gradient(#7F7F7F, #686868); background-image: -moz-linear-gradient(#7F7F7F, #686868); background-image: -o-linear-gradient(#7F7F7F, #686868); background-image: linear-gradient(#7F7F7F, #686868); } .voice-search > ul > li > .map-btn:active, .voice-search > ul > li > .map-btn.map-active { color: #999; background-color: #555555; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5a5a5a), to(#727272)); background-image: -webkit-linear-gradient(#5a5a5a, #727272); background-image: -moz-linear-gradient(#5a5a5a, #727272); background-image: -o-linear-gradient(#5a5a5a, #727272); background-image: linear-gradient(#5a5a5a, #727272); box-shadow: none; text-shadow: 0 -1px 0 rgba(255,255,255,0.1); } /* Side Bar Scroll Voice Area */ .sidebar-scroller { background-color: #474747; } .sidebar-scroller .jspTrack { background: none; } .sidebar-scroller .jspDrag { background-color: rgba(255, 255, 255, 0.4); background-image: none; box-shadow: 0 0 6px rgba(0, 0, 0, 0.3); } .sidebar-scroller__list { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } .sidebar-scroller__accordion-toggler { cursor: pointer; border-bottom-color: #1C1C1C; border-bottom-style: solid; border-top-color: rgba(163, 163, 163, 0.2); border-top-style: solid; box-shadow: inset -1px 0 0 rgba(163, 163, 163, 0.1); color: #8C8C8C; opacity: 1; background: #3a3a3a; background: -moz-linear-gradient(top, #3a3a3a 0%, #343434 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3a3a3a), color-stop(100%,#343434)); background: -webkit-linear-gradient(top, #3a3a3a 0%,#343434 100%); background: -o-linear-gradient(top, #3a3a3a 0%,#343434 100%); background: -ms-linear-gradient(top, #3a3a3a 0%,#343434 100%); background: linear-gradient(to bottom, #3a3a3a 0%,#343434 100%); } .sidebar-scroller__accordion-toggler > h2 { color:#8c8c8c; text-transform: uppercase; } .sidebar-scroller__accordion-arrow { background: url(/images/icons/side_arrows.png?1578503741) no-repeat; background-position: 2px 3px; } .sidebar-scroller__accordion-arrow.down-arrow { background-position: 2px -5px; } .sidebar-scroller__list-item { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); border-left-style: solid; border-left-color: transparent; border-bottom: 1px solid rgba(57, 57, 57, 0.5); background-color: #474747; } .sidebar-scroller__list-item:hover { background-color: #383838; } .sidebar-scroller__list-item .anchor { color: #fff; opacity: .4; text-decoration: none; } .sidebar-scroller__list-item .anchor:hover { opacity: 1; text-decoration: none; } .sidebar-scroller__list-item.select, .sidebar-scroller__list-item.select:hover {background-color: #383838} .sidebar-scroller__list-item.select a {color: #ffffff} .sidebar-scroller__list-item.select.blue {border-left-color: #4cb5ff; background: #4cb5ff;} .sidebar-scroller__list-item.select.yellow {border-left-color: #ebc91c; background: #ebc91c;} .sidebar-scroller__list-item.select.green {border-left-color: #50b347; background: #50b347;} .sidebar-scroller__list-item.select.orange {border-left-color: #ec9415; background: #ec9415;} .sidebar-scroller__list-item.select.red {border-left-color: #f10f2a; background: #f10f2a;} .sidebar-scroller__list-item.red:hover {border-left-color: #f10f2a} .sidebar-scroller__list-item.blue:hover {border-left-color: #4cb5ff} .sidebar-scroller__list-item.yellow:hover {border-left-color: #ebc91c} .sidebar-scroller__list-item.green:hover {border-left-color: #50b347} .sidebar-scroller__list-item.orange:hover {border-left-color: #ec9415} a.sidebar-scroller__list-item-anchor, a.sidebar-scroller__list-item-anchor:hover {color: #d9d9d9; text-decoration:none} .sidebar-scroller__list.voice-gaza > .select.red, .sidebar-scroller__list.voice-gaza > .select.orange, .sidebar-scroller__list.voice-gaza > .select.blue, .sidebar-scroller__list.voice-gaza > .select.yellow, .sidebar-scroller__list.voice-gaza > .select.green {background: #50b347} .sidebar-scroller__list.voice-gaza > .select.blue, .sidebar-scroller__list.voice-gaza > .select.yellow, .sidebar-scroller__list.voice-gaza > .select.green, .sidebar-scroller__list.voice-gaza > .select.orange, .sidebar-scroller__list.voice-gaza > .select.red {border-left-color: #f10f2a} .sidebar-scroller__list.voice-gaza > .select a {color: #fff} .sidebar-scroller__list.voice-gaza > .select .sprite-sidebar {background-position: -192px -32px} .tab-controller { cursor: pointer; } .tab-controller, .info-tab-controller { background-color: #1A1A1A; } .tab-controller:hover, .info-tab-controller:hover { background-color: #222222; } .sidebar-tooltip { background: none repeat scroll 0 0 #1A1A1A; border-radius: 3px 3px 3px 3px; color: #EDEDED; border: 1px solid #4F4F4F; } .sidebar-tooltip:after{ border-color: transparent #1A1A1A transparent transparent; border-style: solid; border-width: 7px; content: ""; } .sidebar-tooltip:before { border-color: transparent #4F4F4F transparent transparent; border-style: solid; border-width: 7px; content: ""; } .hamburger-menu .icon-bar { background-color: #f5f5f5; border-radius: 1px; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi) { .crowdvoice-logo { background-image: url(/images/crowdvoice-logo@2x.png?1578503741); background-position: 0 0; background-size: 169px; } } /* new tooltips */ .simple-tooltip[data-tooltip-text] { position: relative; } .simple-tooltip::before { content: ""; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; position: absolute; left: 50%; margin-left: -5px; } .simple-tooltip::after { position: absolute; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); padding: 6px 7px; font-size: 11px; line-height: 1em; white-space: nowrap; z-index: 2; } .simple-tooltip[data-tooltip-position*="right"]::after { left: auto; right: 10%; -webkit-transform: translateX(10%); -ms-transform: translateX(10%); transform: translateX(10%); } .simple-tooltip[data-tooltip-position*="top"]::after, .simple-tooltip[data-tooltip-position*="top"]::before { bottom: 145%; } .simple-tooltip[data-tooltip-position*="top"]:hover::before, .simple-tooltip[data-tooltip-position*="top"]:hover::after { bottom: 135%; } .simple-tooltip[data-tooltip-position*="top"]::before { border-top: 5px solid rgba(0, 0, 0, 1); margin-bottom: -4px; } /* new tooltips */ .simple-tooltip::after { content: attr(data-tooltip-text); border-radius: 3px; background: rgba(0, 0, 0, 1); color: rgba(255, 255, 255, 1); visibility: hidden; } .simple-tooltip[data-tooltip-text]::before, .simple-tooltip[data-tooltip-text]::after { opacity: 0; } .simple-tooltip[data-tooltip-text]:hover::before, .simple-tooltip[data-tooltip-text]:hover::after { visibility: visible; opacity: 1; } /* Default styles */ .main-header { border-bottom-width: 1px; display: inline-block; position: relative; width: 100%; } .voice-info { border-bottom-width: 1px; padding-top: 0; position: relative; width: 100%; } .voice-info:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .nav-bar { height: 35px; width: 100%; position: relative; } .top-left-navigation { float: left; padding: .5em 0 0 2em; } .menu-item { display: inline-block; margin: 0 4px; padding: 0; position: relative; top: 0; } .menu-item .menu-link { float: left; padding: .7em 1em .5em; border-bottom-width: 2px; max-height: 28px; } .menu-item .menu-link > .icon { font-size: 13px; line-height: 14px; vertical-align: middle; } .menu-item .menu-link .text { display: inline-block; vertical-align: middle; padding-left: .2em; } .top-right { left: auto; position: absolute; right: 0; margin: 5px 5px 5px 0; } .hgroup-theme-image { border-bottom-width: 1px; position: absolute; top: 0; width: 100%; } .theme-image { height: 3px; width: 100%; } .theme-image > .top-line.gaza, .theme-image > .top-line { border-width: 0; height: 3px; } .voice-title { display: inline-block; position: relative; font-size: 20px; line-height: 32px; padding: .8em .25em .5em 1.7em; } .description-wrapper { position: relative; display: inline-block; } .post-and-actions { height: 48px; padding-top: 1em; position: relative; width: 100%; } .post-width { left: 28px; position: absolute; right: 97px; width: auto; } .new-post { height: 35px; width: 100%; } .post { float: left; height: 35px; position: relative; width: 100%; } .post > input[type="text"]{ min-width: 224px; height: 35px; } .post > .post-button { border-width: 1px; position:absolute; left: auto; right: -84px; } .post > .post-button > input[type='submit'] { font-size: 18px; padding:0 18px; width: 85px; height: 35px; } .post > .post-button .cv-tooltip.notice { width: 200px; right: 0; left: initial; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .post > .post-button .cv-tooltip.notice .cv-tooltip__arrow { left: initial; right: 35px; } .post > .post-button .cv-tooltip.notice .media-type-info { padding: .6em 1em; } .post > .post-paceholder, .empty-msg { font-size: 15px; left: 11px; line-height: 1em; top: 9px; position: absolute; } .post > .post-paceholder > span { position: relative; z-index: 4; } .post > .post-paceholder > .cover { height:20px; position: absolute; width:30px; z-index: 4; } .post > .post-paceholder > input[type=file] { margin-left: -30px; position: absolute; z-index: 2; width: 120px; } .post > .post-type { position: absolute; right: 0; top: 5px; height: 29px; padding: 5px 0 0 20px; background-image: -webkit-linear-gradient(left, rgba(255,255,255,0) 0, #ffffff 12px); background-image: linear-gradient(to right, rgba(255,255,255,0) 0, #ffffff 12px); } .post-type > .media { float: left; margin-right: 1em; position: relative; } .post-type > .media > .media-type { display: block; } .media-type .icon { font-size: 16px; vertical-align: top; display: inline-block; color: #ccc; } .post-type > .media > .cv-tooltip { color: #333; } .media-type-info { position: relative; border-width: 1px; padding: 15px 11px; } .media-type-title { font-size: 15px; display: block; padding: 0 7px; width: 233px; line-height: 22px; } .media-type-subtitle { font-size: 12px; display: block; line-height: 1.3em; margin-top: 9px; border-top-width: 1px; padding: 13px 7px 0; } .media-type-link { font-size: 13px; display: block; line-height: 1; padding: 6px 7px 0; } .post-button > .tooltip > .tooltip-positioner { position: relative; top: 0; left: -50%; } .filters-and-mode .tooltip-arrow, .post-button > .tooltip > .tooltip-positioner > .tooltip-arrow { position: absolute; width: 16px; height: 12px; top: 0; left: 50%; z-index: 40; } .post-button > .tooltip > .tooltip-positioner > .tooltip-arrow > span { position: relative; width: 16px; height: 12px; top: 0; left: -50%; display: block; } .post-button > .tooltip > .tooltip-positioner > .media-type-info { position: relative; top: 10px; left: -65px; width:185px; border-width: 2px; padding: 15px 11px; z-index: 30; } .post-button > .tooltip > .tooltip-positioner > .media-type-info > .media-type-title { font-size: 15px; display: block; padding: 0 7px; width: 233px; line-height: 22px; } .post-button > .tooltip > .tooltip-positioner > .media-type-info > p { font-size: 15px; display: block; padding: 0 7px; font-weight: bold; line-height: 22px; } .tool-link .media-type-info { left: -9px; width: 204px; } .filters-and-mode { float: left; padding-bottom: 10px; padding-left: 28px; padding-top: 10px; width: 100%; } .form-right { float: right !important; margin-right:12px; } .filters-and-mode > form, .filters, .mode, .filters > p, .filters > label, .mode > p, .mode > ul, .mode > ul > .mode-button { float: left; } .mode-button { position:relative; overflow: hidden; } .filters-and-mode .mode-button { overflow: visible; } .filters-and-mode .mode-button.selected:hover .cv-tooltip { display: none; } .info-tags__tooltip .mode-button .dismiss-tooltip { display: none; } .info-tags__tooltip .voice-tags li { padding: 0; } .info-tags__tooltip .voice-tags label { cursor: pointer; display: block; padding: 3px 0; } .filters, .mode { font-size: 14px; } .filters > p { padding-right: 6px; font-size: 12px; margin-top: -1px; } .filters > p, .filters > label { padding-top: 1px; } .filters .search-input-wrapper { position: relative; float: left; margin-left: 5px; } .filters .search-input-wrapper i { position: absolute; top: 6px; left: 10px; } .filters .search-input-wrapper .cv-input { padding: 0 5.8em 0 2.3em; width: 236px; } .search-input-wrapper .results-feedback { position: absolute; top: .3em; right: 2.5em; font-size: 10px; color: #a6a6a6; padding: 0 0 0 1em; } .search-input-wrapper .results-feedback em { font-style: normal; } .search-input-wrapper .search-clear { position: absolute; top: 0; right: 0; padding: .15em .7em .5em .3em; cursor: pointer; color: #a6a6a6; } .mode > p { font-size: 12px; padding: 1px 10px 0 0; } .filters > label { padding-right: 10px; font-size: 12px; } .filters > label > input[type='checkbox'] { margin-right: 4px; } .mode-button:first-child { border-width: 1px 0 1px 1px; } .mode-button:first-child + .mode-button { border-width: 1px 1px 1px 0; } .mode-button:first-child > .button { border-width: 1px 0 1px 1px; float: left; padding: 2px; } .mode-button:first-child + .mode-button > .button { float: left; padding: 2px; } .mode-button > .button > a { padding: 2px 10px 1px; font-size: 11px; line-height: 11px; float: left; } .mode-button.selected:first-child > .button { border-width: 1px; padding: 0; } .mode-button.selected:first-child > .button > a { border-width: 1px; padding: 4px 10px 3px 11px; } .mode-button:first-child + .mode-button.selected > .button { border-width: 1px; padding: 0; } .mode-button:first-child + .mode-button.selected > .button > a { border-width: 1px; padding: 4px 11px 3px 10px; } .js-voice-map { margin: 0; padding: 0; height: 100%; } .js-voice-map .loader { position: absolute; width: 100%; top: 50%; margin-top: -28px; } .voice-map-wrapper { position: fixed; top: 98px; left: 0; right: 0; bottom: 0; z-index: 5; border-top: 1px solid #b2b2b2; visibility: hidden; } .voice-map-wrapper:before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; box-shadow: inset 0 2px 0 rgba(0,0,0,.1); z-index: 6; } .voice-map-wrapper.active { visibility: visible; } /* < 768 */ @media only screen and (max-width: 768px), only screen and (max-device-width: 768px) { .voice-title { padding-left: 50px; } .top-left-navigation { padding-left: 46px; } .backstory-menu-item, .info-tool.maps, .info-tool.widget, .info-tool.rss, .post-and-actions, .filters-and-mode .form-right { display: none; } .voices-scroller { width: 100% !important; } } @media only screen and (max-width: 615px) { .search-input-wrapper { display: none; } } /* < 460 */ @media only screen and (max-width: 480px), only screen and (max-device-width: 480px) { .voice-info { margin: 0; padding: 15px 0; margin-top: 35px; } .nav-bar { position: fixed; top: 0; left: 0; background-color: #000; -webkit-transform: translateZ(0px); -ms-transform: translateZ(0px); transform: translateZ(0px); z-index: 1; } .top-left-navigation { left: 50%; margin-left: -90px; padding: 0; position: relative; width: 180px; cursor: pointer; } .top-left-navigation .menu-item { display: none; text-align: center; position: static; } .top-left-navigation.active .menu-item:not(.active) { pointer-events: auto; } .top-left-navigation .menu-item.active { pointer-events: none; display: inline-block; margin: 0; width: 100%; } .top-left-navigation .menu-item.active .menu-link, .menu-item .menu-link { background-color: transparent; color: #fff; width: 100%; } .top-left-navigation .menu-item.active .menu-link { padding-top: 11px; } /* for toggle behavior */ .top-left-navigation.active { height: 70px; left: 0; line-height: 12px; margin: 0; padding: 0; padding-top: 35px; position: absolute; right: 0; top: 0; width: 100%; z-index: 1; } .top-left-navigation.active .menu-item:not(.backstory-menu-item) { display: inline-block; margin: 0; width: 100%; float: left; } .menu-item .menu-link > .icon { display: none; } .top-left-navigation.active .menu-item.active:after { content: attr(name); height: 23px; left: 0; right: 0; padding-top: 12px; position: fixed; top:0; text-transform: uppercase; font-size: 12px; padding-left: 2.40000009536743px; } .menu-item.active .menu-link:after { display: block; } .top-right { cursor: pointer; height: 0; margin: 0; overflow: hidden; padding-top: 31px; width: 45px; z-index: 3; } .top-right.active { overflow: visible; } .top-right .info-tool { float: none; width: 110px; padding: 5px; text-align: center; margin: 0 0 0 -65px; } .top-right .info-tool iframe { width: 85px !important; } .voice-title { max-width: 240px; float: none; display: inline; padding: 0 10px; } .filters-and-mode { bottom: 0; position: fixed; top: auto; padding: 7px 5px 5px 5px; height: 39px; z-index: 2; } /*div.cv-tooltip.info-tags__tooltip { bottom: 0; left: 0; margin: 0; padding: 0; position: absolute; right: 0; top: 28px; }*/ /*div.cv-tooltip.info-tags__tooltip .cv-tooltip-inner { width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-shadow: none; border-radius: 0; } .info-tags__tooltip .voice-tags { left: 0; overflow: auto; position: absolute; right: 0; top: 0; bottom: 40px; }*/ .tag-tooltip-trigger { height: 25px; line-height: 25px; padding: 0 .6em; } .info-tags__tooltip .voice-tags li { font-size: 14px; } .info-tags__tooltip .voice-tags label { padding: 8px 0; } .info-tags__tooltip .voice-tags input { margin: 0 10px 0 13px; } .info-tags__tooltip .mode-button { bottom: 0; position: absolute; text-align: center; top: auto; width: 100%; } .info-tags__tooltip.tooltip .mode-button .button { display: inline-block; float: none; width: 40%; } .info-tags__tooltip .mode-button .dismiss-tooltip { display: inline-block; } .info-tags__tooltip .mode-button > .button > a { float: none; line-height: 20px; } div.tooltip-mediafeed-tweets, .search-input-wrapper { display: none; } .filters-and-mode { margin: 0; } .filters-and-mode .filters { padding: 0; position: absolute; left: 60px; right: 5px; } .filters-and-mode .filters p { display: none; } .filters-and-mode .filters label { display: inline-block; float: left; margin: 0; line-height: 1.15em; padding: 6px 5px 4px; position: relative; text-align: center; width: auto; } .filters > label > input[type="checkbox"] { margin-right: 7px; } .filters-and-mode .filters .tweets-label { float: right; } } /* < 320 */ @media only screen and (max-width: 320px), only screen and (max-device-width: 320px) { .filters-and-mode .tags-container { height: auto; padding: 0; margin: 0; } .filters-and-mode .filters label { font-size: 11px; max-width: 27%; max-height: 24px; padding: 2px; line-height: 1.8em; } .filters > label > input[type="checkbox"] { height: 12px; margin-right: 3px; margin-top: 2px; float: left; } } /* float: left; Default styles < 460 */ /* Default styles */ .main-header { background-color: #f2f2f2; border-bottom-style: solid; border-bottom-color: rgba(0,0,0,0.3); } .voice-info { background-color: #000; color: #fff; background-size: 100%; background-position: 50%; } .voice-info:before { background: rgba(0,0,0,.7); } .nav-bar { } .menu-item .menu-link { border-bottom-style: solid; border-bottom-color: rgba(0,0,0,.1); } .menu-item.active .menu-link { border-bottom-color: transparent; } .filters-and-mode { box-shadow: 0 1px 2px rgba(0,0,0,0.05); } .nav-bar { } .hgroup-theme-image { border-bottom-style: solid; border-bottom-color: #333333; } .theme-image { background: url(/images/bg/top_theme_image.jpg?1578503741) repeat-x 0 3px; } .theme-image.black { background-color: #1a1a1a; } .top-line { background-color: #e2e2e2; border-style: solid none; border-color: #c9c9c9 transparent #ebebeb; } body .top-line.gaza { background:#fcfcfc url(/images/bg/gaza_top_line.png?1578503741) repeat-x !important; } .voice-info.gaza { background: #E3E5E2 url(/images/bg/gaza_flag.jpg?1578503741) no-repeat scroll -22px -2px; border-bottom-color: #b8b9b8; border-bottom-style: solid; } .post > .post-paceholder {color: #b2b2b2} .post > .post-paceholder > .cover {background: #FFF} .post > .post-paceholder > input[type=file] {float: right; cursor: pointer; opacity: 0; } .post > .post-paceholder > a:hover {text-decoration:underline} body.green .post > .post-paceholder > a {color: #50b347} body.red .post > .post-paceholder > a { color: #f10f2a; } .post > .post-paceholder > a { text-decoration: none; } #post_image:hover + a { text-decoration: underline; } body.orange .post > .post-paceholder > a {color: #ec9415} body.yellow .post > .post-paceholder > a {color: #ebc91c} body.blue .post > .post-paceholder > a {color: #4cb5ff} .post > .post-button > input[type='submit'] { cursor: pointer; color: #fff; border-radius: 0 4px 4px 0; text-transform: uppercase; text-shadow: none; } .filters > p, .mode > p { color: #a6a6a6; } .mode-button:first-child > a { border-top-right-radius: 0; border-bottom-right-radius: 0; } .mode-button:last-child > a { border-top-left-radius: 0; border-bottom-left-radius: 0; } .mode-button.selected > a { background-color: #b6b6b6; color: #fff !important; box-shadow: inset 0 2px 0 rgba(0,0,0,0.1); } .moderate-tooltip {color: #595959} /* < 460 */ @media only screen and (max-width: 480px), only screen and (max-device-width: 480px) { .top-left-navigation .menu-item.active { background: transparent none; } .top-left-navigation.active .menu-item { background-color: #262626; border-bottom: solid 1px #414141; } .top-left-navigation.active .menu-link:hover { color: #FFFFFF; background-color: #2D2D2D; } .top-left-navigation.active .menu-link:active { background-color: #1D1D1D; } .top-left-navigation.active .menu-item.active:after { color: #FFFFFF; } ul .menu-item.active .menu-link:after { background: url(/images/icons/sidebar-sprite.png?1578503741) no-repeat scroll -267px -123px rgba(0, 0, 0, 0); content: ""; } ul.active .menu-item.active .menu-link:after { background: url(/images/icons/sidebar-sprite.png?1578503741) no-repeat scroll -287px -123px rgba(0, 0, 0, 0); content: ""; } .top-right { background-image: url(/images/icons/sidebar-sprite.png?1578503741); background-position: -186px -134px; } .top-right.active { background-color: #000000; background-position: -236px -134px; } .top-right .info-tool { background-color: rgba(0,0,0,0.5); } .filters-and-mode { background-color: rgba(242, 242, 242, 0.97); border-top: 1px solid rgba(0, 0, 0, 0.3); } .info-tags__tooltip .voice-tags li { border-bottom: 1px solid rgba(0,0,0,0.2); } .info-tags__tooltip .voice-tags li:last-child { border-bottom: 0; } } .cv-tooltip.more-about-cv-tooltip { width: 150px; top: 100%; } .cv-tooltip.more-about-cv-tooltip .cv-tooltip__arrow { top: 19px; } .cv-tooltip.add-a-voice-tooltip { width: 170px; } .cv-tooltip.add-a-voice-tooltip { left: 6px; -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .cv-tooltip.add-a-voice-tooltip .cv-tooltip__arrow { left: 40px; } .add-a-voice-tooltip .pencil { width: 29px; height: 26px; margin-top: 7px; background: url(/images/pencil.png?1578503741) no-repeat; } .cv-tooltip.voice-description-tooltip { width: 635px; color: #404040; } .cv-tooltip.voice-description-tooltip .cv-tooltip-inner { font-size: 14px; line-height: 25px; padding: 1.5em 2.2em; } .public-mode-tooltip { font-weight: bold; } .moderator-mode-tooltip { width: 233px; left: initial; right: 0; -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } .moderator-mode-tooltip .cv-tooltip__arrow { left: initial; right: 38px; } .moderator-mode-tooltip .cv-tooltip-inner { padding: 1em; } .moderator-mode-tooltip .title { font-size: 15px; margin-bottom: .5em; } .moderator-mode-tooltip .description { color: #a6a6a6; } .filters .tweets-label { padding-right: 0; } .tooltip-mediafeed-tweets { position: relative; display: inline-block; float: left; font-size: 13px; padding: 0 10px 0 5px; } .tooltip-hoverable-area { cursor: pointer; color: #a6a6a6; } .mediafeed-tweets-tooltip { width: 300px; } .cv-tooltip.follow-widget-tooltip { width: 402px; color: #404040; } .follow-widget-tooltip .cv-tooltip-inner { padding: 0; } .follow-widget-tooltip .title { font-size: 20px; line-height: 1; display: block; padding: 0; } .follow-widget-tooltip .headline { border-bottom: 1px solid #ccc; padding: .9em 1em; } .follow-widget-tooltip .info-wrapper { padding: 1em 2em 2.2em; } .follow-widget-tooltip .options-group { position: relative; padding-bottom: 20px; } .follow-widget-tooltip .radio-options-group label { float: left; width: 14.26%; text-align: center; } .follow-widget-tooltip .radio-options-group .radio-options-label { display: block; line-height: 14px; } .follow-widget-tooltip .small-text { font-size: 13px; line-height: 1.5em; color: #999999; } .follow-widget-tooltip .error-email { display: none; position: absolute; bottom: 0; font-size: 11px; color: #cc0000; } .follow-widget-tooltip .success-message { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 2.5em; background-color: #fff; text-align: center; } .follow-widget-tooltip .success-message .table { display: table; height: 100%; } .follow-widget-tooltip .success-message .cell { display: table-cell; vertical-align: middle; } .follow-widget-tooltip .success-message .title { padding-bottom: 1em; } .follow-widget-tooltip .success-message .js-ok-button { margin: 1em 0 0 0; } .cv-tooltip.embeddable-widget-tooltip { width: 666px; right: 0; left: initial; transform: translateX(150px); } .cv-tooltip.embeddable-widget-tooltip .cv-tooltip__arrow { left: initial; right: 157px; } .cv-tooltip.embeddable-widget-tooltip .cv-tooltip-inner { padding: 0; } .blog-widget-title { font-size: 20px; line-height: 1; display: block; padding: .9em 1em; border-bottom: 1px solid #ccc; } .grab-blog-widget .info-wrapper { padding: 1em 2em 2.2em; } .grab-blog-widget .info, .grab-blog-widget .preview { float: left; display: inline-block; vertical-align: top; } .cv-tooltip.embeddable-widget-tooltip .info { width: 282px; margin-right: 50px; } .grab-blog-widget .options-container { margin-bottom: 1.8em; } .blog-widget-subtitle { font-size: 15px; margin: 0 0 .5em; } .blog-widget-label {} .options-container > p > .blog-widget-label { display: block; margin-bottom: .5em; } .blog-widget-label + .blog-widget-label { padding-left: 20px; } .cv-tooltip.embeddable-widget-tooltip .preview { width: 280px; } .cv-tooltip.embeddable-widget-tooltip .preview > .preview-placeholder { background: #d9d9d9; min-height: 310px; border-radius: 4px; } .preview > .preview-placeholder > iframe { display: block; } .cv-tooltip.embeddable-widget-tooltip .preview > p { font-size: 11px; margin: .8em 0 0; color: #a6a6a6; } .grab-blog-widget .code-output { } .grab-blog-widget .code-output .cv-input { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .grab-blog-widget .code-output .cv-button { position: relative; margin-top: -.3em; border-top-left-radius: 0; border-top-right-radius: 0; } textarea.blog-widget-textarea { font-size: 10px; line-height: 14px; width: 100%; height: 96px; padding: 7px 11px; overflow: hidden; line-height: 15px; color: #a6a6a6; } .post-media-tooltip-header { padding: 1em 1.5em; border-bottom: 1px solid #ccc; } .post-media-tooltip-header .tooltip-close-btn { font-size: 13px; line-height: 19px; text-decoration: underline; color: #a6a6a6; } .post-media-tooltip-header .tooltip-close-btn:hover { color: #b3b3b3; } .post-media-tooltip-header .title { font-size: 20px; } .cv-tooltip .tooltip-label { font-size: 15px; color: #333; margin-bottom: .5em; } .cv-tooltip .light { color: #a6a6a6; } .post-media-tooltip-content label { display: block; margin: 0 0 1.5em; } /** * Image Type */ .default > .image-post-media-tooltip { width: 245px; left: 50%; } .default > .image-post-media-tooltip .cv-tooltip__arrow { left: 50%; } .image-post-media-tooltip { width: 415px; left: -30px; } .image-post-media-tooltip .cv-tooltip__arrow { left: 245px; } .image-post-media-tooltip .cv-tooltip-inner { padding: 0; } .image-post-media-tooltip .post-media-tooltip-content { padding: 1.5em 1.5em; } .image-post-media-tooltip textarea { height: 116px; padding: .7em 1em; } .image-post-media-tooltip .post-media-tooltip-footer { font-size: 13px; line-height: 19px; padding: 1.3em 1.5em 1.5em; border-top: 1px solid #ccc; } /** * Video Type */ .video-post-media-tooltip { width: 290px; } .video-post-media-tooltip .cv-tooltip-inner { font-size: 15px; line-height: 20px; padding: 1em 1.2em; } /** * Link Type */ .link-post-media-tooltip { width: 220px; } .link-post-media-tooltip .normal .cv-tooltip-inner { font-size: 15px; line-height: 20px; padding: 1em 1.2em; } .link-post-media-tooltip .carousel { display: none; width: 400px; margin-left: -180px !important; } .link-post-media-tooltip .carousel .tooltip-arrow { left: 72%; } .link-post-media-tooltip .carousel .cv-tooltip-inner { padding: 0; } .link-post-media-tooltip .post-media-tooltip-content { padding: 1.5em; } .carousel-image { display: inline-block; width: 160px; height: 120px; overflow: hidden; border: 1px solid #b3b3b3; border-radius: 3px; text-align: center; background-color: #f2f2f2; } .carousel-image img { position: relative; max-width: 158px; vertical-align: top; top: 50%; transform: translateY(-50%); } .carousel-arrows { overflow: hidden; margin-bottom: 1.5em; } .carousel-arrows-inner { display: inline-block; vertical-align: top; border: 1px solid #b3b3b3; border-radius: 4px; } .carousel-arrows-inner > .carousel-arrow { width: 30px; height: 17px; display: block; vertical-align: top; float: left; cursor:pointer; background-color: #fafafa; border-bottom: 1px solid #cccccc; text-align: center; } .carousel-arrows-inner > .carousel-arrow:hover { background-color: #fff; } .carousel-arrows-inner > .carousel-arrow:active { background-color: #ededed; } .carousel-arrows-inner > .carousel-arrow > .arrow { display: inline-block; width: 0; height: 0; border-width: 4px; border-style: solid; position: relative; top: -1px; } .carousel-arrows-inner > .left-arrow > .arrow { border-left-width: 0; } .carousel-arrows-inner > .right-arrow > .arrow { border-right-width: 0; } .carousel-arrows-inner > .left-arrow { border-right: 1px solid #b3b3b3; border-radius: 4px 0 0 4px; } .carousel-arrows-inner > .right-arrow { border-left: 1px solid #b3b3b3; border-radius: 0 4px 4px 0; } .carousel-arrows-inner > .carousel-counter { font-size: 12px; width: 98px; height: 17px; float: left; background-color: #ededed; color: #a6a6a6; text-align: center; } .link-post-media-tooltip .description-link { font-size:12px; margin:5px 0; } .link-post-media-tooltip textarea { height: 116px; padding: .7em 1em; } .loader, .loader--hide { display: none; } .loader--show { display: block; } .loader__inner { display: inline-block; padding: 10px 20px; margin: 0 auto; } .loader__image { display: inline-block; width: 32px; height: 32px; } .voice-wrapper .loader--dark { position: absolute; left: 50%; top: 50%; margin: -26px 0 0 -36px; } /* Usage: just add this class and position the target element as relative, it puts this clear-colored spinner right in the middle for both X & Y */ .fetcher-spinner:after { bottom: 0; display: block; position: absolute; top: 0; width: 100%; } .loader { text-align: center; } .loader__inner { border-radius: 3px; } .loader--dark .loader__inner { background: rgba(0,0,0,.9); } .loader--dark .loader__image { background: transparent url(/images/ajax-loader.gif?1578503741) 0 0 no-repeat; } /* Usage: just add this class and position the target element as relative, it puts this clear-colored spinner right in the middle for both X & Y */ .fetcher-spinner:after { background: url(/images/loader.gif?1578503741) no-repeat scroll 50% 50% #F5F5F5; content: ""; } .progressjs-inner { width: 0; } .progressjs-progress { z-index: 9999999; } /* blue theme, like iOS 7 progress bar */ .progressjs-theme .progressjs-inner { height: 6px; -webkit-transition: all 10s ease-out; -moz-transition: all 10s ease-out; -o-transition: all 10s ease-out; transition: all 10s ease-out; } .progressjs-theme .progressjs-percent { display: none; } .progressjs-theme.shown { opacity : 1; } .progressjs-theme { opacity : 0; } /* Infoboxes */ .main-container, .right-pane-container {height: 100%} .infobox-wall-container {height: 100%; width: 100%; overflow: hidden} .infobox-header {height: 47px} .infobox-header .color-line, .voice-headline-holder .color-line {height: 4px} .infobox-header .ribbon-title {display: block; font-size: 18px; margin: 10px 0 0 25px; float: left; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 54%} .infobox-header .voice-info-tools {margin-top: 8px} .infobox-header .info-tool.facebook-like-button {width:95px;} .infobox-header .view-all {float: right; margin: 10px 7px 0 0; padding: 5px} .infobox-wall { padding: 28px 0 10px; overflow: auto; height: 100%; width: 100%; -webkit-overflow-scrolling: touch; } .infobox-wall .infobox-pane { margin: 0 0 0 10px; top: -10px; -webkit-transform: translate3d(0,0,0); } .infobox-wall .infobox.no-caption {overflow: visible; padding: 0} .infobox.no-caption .graphic {margin: 20px 25px 0 25px} .infobox.no-caption .divline { display: block; margin: 12px 25px; width: auto; } .infobox.no-caption .voice-info-tools {margin: 23px 0 0 25px; float: none} .infobox.no-caption .description {margin: 0 25px 10px; width: auto} .infobox { display: block; position: relative; width: 290px; margin: 10px; border-width: 1px; overflow: hidden; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .infobox .primary-btn {padding: 4px 10px 5px; font-size: 11px; line-height: 12px; display: inline-block} .sources-list-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transform: translateZ(0) translateY(-100%); -ms-transform: translateZ(0) translateY(-100%); transform: translateZ(0) translateY(-100%); } .sources-list-wrapper.show { -webkit-transform: translateZ(0) translateY(0); -ms-transform: translateZ(0) translateY(0); transform: translateZ(0) translateY(0); } /*.sources-list-wrapper .scroll {width: auto; height: auto; overflow: hidden; position: relative;}*/ .sources-list-wrapper .scroll .jspHorizontalBar {display: none !important} .sources-list-wrapper .header {padding: 8px 14px 7px; border-bottom-width: 1px} .sources-list-wrapper .header::after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0} .sources-list-wrapper .title {font-size: 17px; line-height: 24px; display: inline} .sources-list-wrapper .header button {float: right} .sources-list-wrapper .list {border-bottom-width: 1px; display: block} .sources-list-wrapper .list-item {border-width: 1px 0; display: block} .sources-list-wrapper .list-item:first-child {border-top-width: 0} .sources-list-wrapper .list-item a {padding: 12px 14px; display: block; font-size: 11px; line-height: 17px; word-wrap: break-word; overflow: hidden} .sources-list-wrapper .view-all-source {margin: 20px 0} .infobox-padding {display: block; padding: 20px 25px; border-bottom-width: 1px} .infobox-padding:hover {text-decoration: none} .infobox .graphic {height: auto} .infobox .graphic p {margin: 0} .infobox .caption { height: auto; margin: 20px 0 0 0; font-size: 17px; line-height: 24px; } .infobox .divline { height: 2px; margin: 12px 0; display: inline-block; } .infobox .description { height: auto; font-size: 13px; line-height: 21px; margin-top: 0; } .infobox .tagbox { border-top-width: 1px; font-size: 12px; margin: 0; padding: 7px 10px 8px 30px; text-align: left; } .infobox .tag { display: inline-block; padding: 1px 1px 1px 0; } .infobox .sources { position: relative; border-top-width: 1px; padding: 8px 0; overflow: hidden; } .infobox .sources:before { content: ''; position: absolute; top: -5px; left: 5%; width: 90%; height: 4px; z-index: 0; } .infobox .sources .primary-btn { position: relative; padding-left: 20px; padding-right: 20px; } .infobox .description, .infobox .divline, .graphic-top .graphic, .graphic-top .caption {width: 100%} .graphic-left .graphic {padding-right: 48px} .graphic-top .graphic img {max-width: 140px; max-height: 140px} .graphic-left .graphic img {max-width: 90px; max-height: 90px} .number-graphic-top .graphic img {max-width: 140px; max-height: 140px} .collapsed .graphic {width:90px; max-height: 90px; float: left} .collapsed .caption { width: 60%; float: right; font-size: 13px; line-height: 17px; margin: 0; } .area-chart-key {padding: 0 0 0 20px} .number-top .caption {margin-top: 15px; text-align: center} .number-top .graphic {line-height: 58px; font-size: 58px; word-wrap: break-word} .number-graphic-top .graphic, .number-graphic-top .graphic-number {line-height: 58px; font-size: 55px; word-wrap: break-word} .number-graphic-top .graphic-number.smaller-number {font-size: 48px} .number-graphic-top .graphic-number, .number-graphic-top p {line-height: 58px; font-size: 57px; word-wrap: break-word; margin: 0} .number-graphic-top .graphic-number.smaller-number {font-size: 48px} .chart-data-list {font-size: 13px; text-align: left; margin-bottom: 15px; width: 100%} .chart-data-item {line-height: 20px; padding: 0 0 10px 20px; text-align: left} .chart-bullet {float: left; height: 14px; margin: 3px 6px 3px -20px; width: 14px} .percent {font-weight: normal; font-size: 12px} .no-caption {padding: 20px 25px} .no-caption .graphic {line-height: 38px; font-size: 27px} .no-caption .voice-info-tools {margin-top: 23px} .infobox.chart-bottom, .chart-bottom .infobox-padding, .expanded.chart-bottom .infobox-complete {display: block} .infobox-pane .infobox.chart-bottom .infobox-padding {display: table} .chart-bottom .graphic {display: table-row-group} .chart-bottom .chart {display: inline; margin-top: 20px} .chart-bottom .caption {display: table-header-group} .chart-bottom .caption:after {content: ""; display: table-row; clear: both; height: 10px} .chart-bottom .graphic .highcharts-container, .chart-top .graphic .highcharts-container {margin: auto} .chart-left .graphic, .graphic-left .graphic {display: table-cell; text-align: left; width: 140px; height: 90px; padding-right: 0; text-align: center; vertical-align: middle} .chart-left .caption, .graphic-left .caption {display: table-cell; vertical-align: middle; margin: 0; width: 55%} .chart-top .caption, .chart-bottom .caption, .number-graphic-top .caption {margin-top: 10px; text-align: center} .chart-top .graphic.chart-radial {width: 140px; height: 140px; margin: auto} .chart-bottom .graphic.chart-radial {display: table-cell; width: 29%; height: 140px} .chart-left .graphic.chart-radial {width: 140px; height: 90px; margin: auto} .chart-top .graphic .chart {margin: auto} .infobox .chart-bullet .ie-rounded-corner-mask {height: 14px; width: 14px} /* Infographic sidebar */ .preload-mask {width: 100%; height: 100%; position: relative} .preload-mask .loading-wrapper {margin-left: -75px} .initial-state .info-sidebar { opacity: 0} .info-sidebar {position: absolute; left: 0; width: 285px; height: 100%; z-index: 2} .info-sidebar.closed {left: -285px;} .info-sidebar .wrapper {float: right; height: 100%; width: 285px; position: relative} .info-sidebar .scroll-mask {bottom: 0; overflow: hidden; padding: 10px 0; position: absolute; top: 0; width: 280px} .info-sidebar .infobox {min-height: 54px} .info-sidebar .voice-headline-holder {float: right; min-height: 107px; height: auto; margin-right: -5px; min-width: 335px; width: 267px} .info-sidebar .voice-headline {font-size: 21px; font-weight: normal; padding: 13px 13px 0} .info-sidebar .tooltip-positioner {left: -14%} .info-sidebar .tooltip-arrow {left: 14%} .info-sidebar .infobox {margin: 0 0 0 7px; position: relative; width: 263px} .info-sidebar .infobox-padding {display: block; padding: 10px 25px} .chart-bottom.expanded .infobox-padding {display: table} .info-sidebar .tagbox {clear: both; padding: 4px 0 4px 35px} .info-sidebar .jspPane {width: 280px; min-height: 99%} .infobox.collapsed {clear: both; padding: 10px 10px 0 0; cursor: pointer} .collapsed.no-caption .graphic {font-size: 20px; line-height: 30px; padding: 0 0 0 10px; width: auto} .collapsed.number-graphic-top .graphic-number {line-height: 20px} .collapsed.number-graphic-top .graphic {float: left; width: 45%} .collapsed.number-top .graphic {display: none} .collapsed.number-top .graphic-number {display: table-cell; vertical-align: middle; font-size: 25px; max-width: 123px; padding: 0 5px; word-wrap: break-word} .collapsed.number-top .caption {margin: 0} .collapsed .graphic {text-align: center} .collapsed .highcharts-container {margin: auto; cursor: pointer} .collapsed .graphic img {max-width: 90px; max-height: 90px} .collapsed .caption {margin: 0} .collapsed .caption, .collapsed.number-graphic-top .graphic-number {text-align: left; width: 55%} .collapsed .infobox-extract {display: table; padding: 0 0 10px 0; width: 100%} .collapsed .graphic, .collapsed .caption {display: table-cell; vertical-align: middle; float: none} .infobox-extract .graphic.chart-radial {height: auto} .collapsed.number-graphic-top .caption, .collapsed.number-graphic-top .graphic-number {float: right; display: block} .collapsed.number-graphic-top .graphic {float: left; display: block} .collapsed .tagbox {display: none} .collapsed.chart-left .graphic, .collapsed.graphic-left .graphic {height: auto; padding-right: 0; width: auto;} .collapsed.chart-bottom {display: block} .collapsed.chart-bottom .caption:after{ display: none; opacity: 0; height: 0; clear: none} .expanded .infobox-complete .caption {padding: 0 5px} .info-tab-controller { height: 100%; position: absolute; top: 0; right: -10px; width: 10px; z-index: 4; } .info-tab-controller .tab-icon {position: absolute;height: 45px;margin-top: -125px; top:50%;width: 10px;left: -2px;} .collapsed .infobox-complete {display: none} .expanded .infobox-extract {display: none} /* Filters and mode bar on main header */ .filters-and-mode .tag-container {max-width: 205px; display: block; float: left; margin: 3px 0 -4px 10px; height: auto} .tag-container .tag-label {display: inline-block; float: left; margin: 0 10px 5px 0; padding: 3px 8px 3px 4px} .tag-label .erase-me {display: block; float: left; height: 12px; margin: 2px 5px 0 0; width: 12px} /* Chart tooltip */ /* LOADING overlay */ .info-wall-overlay, .info-wall-overlay .overlay { width: 100%; height: 100%; z-index: 2; position: absolute; top: 0; left: 0} .info-wall-overlay .loading-wrapper {z-index: 3; top: 50%} .info-wall-overlay .loading-wrapper .spinner {width: 115px} /* < 768 */ @media all and (max-width: 1024px) { .info-sidebar{ display: none; } } @media all and (max-width: 460px) { .infobox-wall .infobox-pane { margin: 0; } } /* Infoboxes */ /*correction needed for isotope wall positioning*/ .right-pane-container .isotope, .right-pane-container .isotope .isotope-item {-webkit-transition-duration: 0; -moz-transition-duration: 0; transition-duration: 0} .right-pane-container .isotope {-webkit-transition-property: none; -moz-transition-property: none; transition-property: none} .right-pane-container .isotope .isotope-item {-webkit-transition-property: none; -moz-transition-property: none; transition-property: none} .right-pane-container { background-color: #4c4c4c; } .infobox-header {background: #303030; border-bottom: solid 1px rgba(0,0,0,0.2); box-shadow: 0 0 3px #222222} .infobox-header .color-line, .voice-headline-holder .color-line {} .infobox-header .ribbon-title {color: #53B74A; text-shadow: 0px -1px 0px #000000} .infobox-header .view-all {color: #888888; text-decoration: none; border: 1px solid #0e0e0e; box-shadow: 0 0 0 1px #353535 inset; background: #373737; border-radius: 4px; text-shadow: 0px -1px 0px #000000; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-image: -moz-linear-gradient(top, #333333, #262626); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #333333), color-stop(1.0, #262626)); background-image: -webkit-linear-gradient(#333333, #262626); background-image: linear-gradient(top, #333333, #262626) } .infobox-header .view-all:hover {color: #AAAAAA} .infobox { text-align: center; border-style: solid; border-color: rgba(0,0,0,.7); border-radius: 3px; background-clip: padding-box; background-color: #333333; background-image: -webkit-linear-gradient(top, #373737, #303030); background-image: linear-gradient(to bottom, #373737, #303030); } .info-sidebar .infobox { border-color: #4c4c4c #2c2c2c #101010; border-radius: 0; } .infobox .info:last-child { -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px; -webkit-background-clip: padding-box; background-clip: padding-box; } .infobox:hover { background: #363636; background: -moz-linear-gradient(top, #363636 0%, #2f2f2f 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#363636), color-stop(100%,#2f2f2f)); background: -webkit-linear-gradient(top, #363636 0%,#2f2f2f 100%); background: -o-linear-gradient(top, #363636 0%,#2f2f2f 100%); background: -ms-linear-gradient(top, #363636 0%,#2f2f2f 100%); background: linear-gradient(to bottom, #363636 0%,#2f2f2f 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#363636', endColorstr='#2f2f2f',GradientType=0 ); } .infobox-padding {border-bottom-color: #202020; border-bottom-style: solid} .highlight .infobox-padding {border-bottom-color: #151515} .infobox .primary-btn { font-family: Arial, Helvetica, sans-serif; cursor: pointer; color: #999999; border: 1px solid #191919; box-shadow: inset 0 1px 0 0 #454545, inset 0 0 0 1px #383838; background: #373737; border-radius: 4px; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.6); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-image: -moz-linear-gradient(top, #333333, #282828); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #333333), color-stop(1.0, #282828)); background-image: -webkit-linear-gradient(#333333, #282828); background-image: linear-gradient(top, #333333, #282828) } .infobox .primary-btn:hover {color: #aaaaaa; text-decoration: none} .infobox .primary-btn:active {position: relative; top: 1px} .infobox.highlight {box-shadow: 0 0 6px #000000; background-image: -moz-linear-gradient(top, #2a2a2a, #242424); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #2a2a2a), color-stop(1.0, #242424)); background-image: -webkit-linear-gradient(#2a2a2a, #242424); background-image: linear-gradient(top, #2a2a2a, #242424); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a2a2a', endColorstr='#242424',GradientType=0 ); } .infobox .divline {background-color: #53b74a} .infobox .description { color: #b2b2b2; text-align: left; } .infobox .graphic, .infobox .graphic-number, .infobox .caption {color: #cccccc; text-shadow: 0 -1px 1px #000000} .infobox .tagbox { border-top-color: #393939; border-top-style: solid; background: url(../images/bg/sprites/infographics-tagbox.png?1578503741) no-repeat; background-position: 10px -13px; background-repeat: no-repeat; } .infobox .sources { background-color: #282828; background-color: rgba(0, 0, 0, 0.2); border-top-color: #171717; border-top-style: solid; } .infobox .sources:before { -webkit-box-shadow: 0 1px 10px black; box-shadow: 0 1px 10px black; -webkit-border-radius: 50%; border-radius: 50%; } .sources-list-wrapper { background-color: #2e2e2e; -webkit-transition: -webkit-transform 200ms linear; transition: transform 200ms linear; } .sources-list-wrapper .header {text-align: left; background-color: #282828; border-bottom-color: #171717; border-bottom-style: solid} .sources-list-wrapper .title {color: #cccccc} .sources-list-wrapper .list {border-bottom-style: solid; border-bottom-color: #393939} .sources-list-wrapper .list-item {text-align: left; border-style: solid none; border-color: #393939 transparent #202020} .sources-list-wrapper .list-item a {color: #888888; text-decoration: none} .sources-list-wrapper .list-item a:hover {color: #aaa} .highlight .tagbox {border-top-color: #2E2E2E} .infobox .tag { color: #53b74a; text-shadow: 0 -1px 1px #000000; } .infobox .tag:after { content: ','; } .infobox .tag:last-child:after { content: ''; } .infobox .tag a, .infobox .tag a:hover { color: #6aeb5e; text-decoration: none} .chart-bullet {background-color: #5ccc52} .chart-data-list {color: #cccccc} .percent {color: #888888} .chart-bullet {border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } .no-caption .graphic {color: #53B74A} .infobox .chart-bullet .ie-rounded-corner-mask { background: url(../images/bg/ie_rounded_corner_normal.png?1578503741) no-repeat} .infobox.highlight .chart-bullet .ie-rounded-corner-mask { background: url(../images/bg/ie_rounded_corner_highlight.png?1578503741) no-repeat} /* Infographic sidebar */ .preload-mask {background: url(../images/bg/load-pattern.png?1578503741) repeat scroll 0 0 transparent} .preload-mask .image-bg-patter {background: url(../images/bg/load-pattern.png?1578503741) repeat scroll 0 0 #212121} .info-sidebar { background-color: #363636; -webkit-transition: left 300ms linear; -moz-transition: left 300ms linear; -ms-transition: left 300ms linear; -o-transition: left 300ms linear; transition: left 300ms linear; } .info-tab-controller {cursor: pointer; border-right: none; border-left: solid 5px #777777; background: none;} .info-tab-controller:hover { border-right: none; border-left: solid 5px #777777; background: none;} .info-tab-controller .tab-icon { background-image: url(/images/icons/sidebar-sprite.png?1578503741); background-repeat: no-repeat; background-color: transparent; background-position: -123px -1px; } .info-tab-controller:hover .tab-icon { background-position: -133px -1px; } .info-tab-controller.close-control .tab-icon { background-position: -143px -1px; } .info-tab-controller.close-control:hover .tab-icon{ background-position: -153px -1px; } .info-sidebar .voice-headline-holder {background-color: #303030; border-bottom: solid 1px #1f1f1f} .info-sidebar .voice-headline a {color: #e6e6e6} .info-sidebar .voice-headline a:hover {color: #ffffff; text-decoration: none} .info-sidebar .infobox {box-shadow: none; border-left-color: #53B74A} .info-sidebar .infobox:hover {background-image: -moz-linear-gradient(top, #444444, #303030); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #444444), color-stop(1.0, #303030)); background-image: -webkit-linear-gradient(#444444, #303030); background-image: linear-gradient(top, #444444, #303030); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#303030',GradientType=0 )} body .infobox.collapsed.infobox {border-left-color: #2C2C2C} .collapsed.number-graphic-top .graphic-number {color: #bcbcbc; font-size: 19px} .collapsed .caption {color: #aaa; font-weight: normal} body .infobox.collapsed .divline {background: none} /* Dark sidebar scroller */ .tags-container .jspTrack, .info-sidebar .jspTrack, .infobox-wall .jspTrack, .infobox-preview .jspTrack { background: #191919; background: -moz-linear-gradient(left, #191919 0%, #1f1f1f 41%, #202020 44%, #1f1f1f 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,#191919), color-stop(41%,#1f1f1f), color-stop(44%,#202020), color-stop(100%,#1f1f1f)); background: -webkit-linear-gradient(left, #191919 0%,#1f1f1f 41%,#202020 44%,#1f1f1f 100%); background: -o-linear-gradient(left, #191919 0%,#1f1f1f 41%,#202020 44%,#1f1f1f 100%); background: -ms-linear-gradient(left, #191919 0%,#1f1f1f 41%,#202020 44%,#1f1f1f 100%); background: linear-gradient(to right, #191919 0%,#1f1f1f 41%,#202020 44%,#1f1f1f 100%); } .tags-container .jspDrag, .info-sidebar .jspDrag, .infobox-wall .jspDrag, .infobox-preview .jspDrag {box-shadow: 0 0 0 1px #212121 inset; background-image: -moz-linear-gradient(left, rgba(118,118,118,1) 0%, rgba(84,84,84,1) 50%, rgba(74,74,74,1) 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(118,118,118,1)), color-stop(50%,rgba(84,84,84,1)), color-stop(100%,rgba(74,74,74,1))); background-image: -webkit-linear-gradient(left, rgba(118,118,118,1) 0%,rgba(84,84,84,1) 50%,rgba(74,74,74,1) 100%); background-image: linear-gradient(to right, rgba(118,118,118,1) 0%,rgba(84,84,84,1) 50%,rgba(74,74,74,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#767676', endColorstr='#4a4a4a',GradientType=0 )} /* Filters and mode bar on main header */ .filters-and-mode .tag-label {color: #c7c7c7; border: 1px solid #4d4d4d; box-shadow: 0 0 0 1px rgba(116,116,116,0.5) inset, 0 0 0 1px rgba(255,255,255,0.3); background: #373737; border-radius: 4px; text-shadow: 0px -1px 0px #333333; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-image: -moz-linear-gradient(top, #626262, #3a3a3a); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #626262), color-stop(1.0, #3a3a3a)); background-image: -webkit-linear-gradient(#626262, #3a3a3a); background-image: linear-gradient(top, #626262, #3a3a3a)} .tag-label .erase-me {background: url(../images/icons/delete-tag.png?1578503741) no-repeat 0 0 transparent; font-size: 13px} /* Theme color schemes */ /* Blue */ .blue .infobox-header .color-line, .blue .voice-headline-holder .color-line {background-color: #4cb5ff} .blue .infobox .divline, .blue .chart-bullet {background-color: #4cb5ff} .blue .info-sidebar .infobox {border-left-color: #4cb5ff} .blue .infobox .tag, .blue .infobox .tag a, .blue .infobox .tag a:hover, .blue .no-caption .graphic, .blue .infobox-header .ribbon-title {color: #4cb5ff} /* Red */ .red .infobox-header .color-line, .red .voice-headline-holder .color-line {background-color: #f10f2a} .red .infobox .divline, .red .chart-bullet {background-color: #f10f2a} .red .info-sidebar .infobox {border-left-color: #f10f2a} .red .infobox .tag, .red .infobox .tag a, .red .infobox .tag a:hover, .red .no-caption .graphic, .red .infobox-header .ribbon-title {color: #f10f2a} /* Orange */ .orange .infobox-header .color-line, .orange .voice-headline-holder .color-line {background-color: #ec9415} .orange .infobox .divline, .orange .chart-bullet {background-color: #ec9415} .orange .info-sidebar .infobox {border-left-color: #ec9415} .orange .infobox .tag, .orange .infobox .tag a, .orange .infobox .tag a:hover, .orange .no-caption .graphic, .orange .infobox-header .ribbon-title {color: #ec9415} /* Yellow */ .yellow .infobox-header .color-line, .yellow .voice-headline-holder .color-line {background-color: #ebc91c} .yellow .infobox .divline, .yellow .chart-bullet {background-color: #ebc91c} .yellow .info-sidebar .infobox {border-left-color: #ebc91c} .yellow .infobox .tag, .yellow .infobox .tag a, .yellow .infobox .tag a:hover, .yellow .no-caption .graphic, .yellow .infobox-header .ribbon-title {color: #ebc91c} /* Loading overlay */ .info-wall-overlay .overlay {background: url(../images/bg/ig-wall-bg.png?1578503741) repeat scroll 0 0 #3D3D3D} /*highcharts tooltiop -*/ .highcharts-tooltip tspan {fill: #939393} /* Info box */ .infobox-wall-container .voice-info:after { content: ''; position: relative; display: block; background: #f2f2f2; height: 6px; border-bottom: 1px solid rgba(0,0,0,.15); box-shadow: 0 2px 0 rgba(0,0,0,.1); } .infobox-wall-container .voice-info .voice-title { color: #ffffff; } /* Overlay Styles */ .vide-overlay-container {display:none; position: absolute;} .overlay-container > .arrows {float: left; margin-left: -2px; z-index: 15; position: relative; width: 31px} .arrows > .voice-arrow {width: 31px; height: 64px; display: block} .arrows > .tooltip-arrow {position: absolute; margin-top:-70px} .arrows > .tooltip-arrow > img {border-width: 8px; min-height: 60px} .arrows > .tooltip-arrow > .over-arrow {width: 12px; height: 10px; margin-top: -3px; margin-left: 55px} .arrows > .tooltip-arrow > .right-tip-arrow {width: 12px; height: 10px; margin-top: -3px; margin-left: 15px !important} .arrows > .tooltip-arrow.left {left: -67px} .arrows > .tooltip-arrow.right {right: -69px} .vide-overlay-container .video-container {border-width: 1px; float: left; position: relative; z-index: 20; padding:15px} .voice-container {border-width: 1px; float: left; position: relative; z-index: 20} .voice-container > .voice-over-info {padding: 0; width: auto; /*min-width:310px*/} .voice-container > .voice-over-info > div {text-align: center;} .voice-over-info > h2 {width: 75%; font-size: 18px; float: left; margin:14px 0; padding-left: 20px;} .voice-over-info > .external-link {float: left} .voice-over-info > .external-link > li {float: left; border-width: 1px; margin-left: 10px} .voice-over-info > .external-link > li > a {display: block; font-size: 13px; padding: 4px 12px; border-width: 1px; float: left} .voice-over-info > ul {font-size: 18px; float: right} .vide-overlay-container .close-voice-container {margin: -30px} .close-voice-container {width: 33px; height: 33px; float: right; display: block; position: relative; margin: -19px} .voice-container > .voice-coment-zone {clear: both; height: 173px; border-width: 1px 0px} .voice-coment-zone > .show-comment-arrow {height: 7px; width: 16px; float:right; margin: -7px 33px 0 0; display:none} .fbc-container-box {height:173px; overflow:auto; overflow-x:hidden} .voice-container > .share-voice-container {clear: both; overflow: hidden; padding: 6px 10px 6px 15px} .voice-container > .share-voice-container > p {font-size: 11px; float: left; margin-top: 7px} .share-voice-container > .actions {float: right} .share-voice-container > .actions > li {float:left; margin-right: 5px} .share-voice-container > .actions > li > a {display:block; width: 25px; height: 25px} .share-voice-container > .actions > .flag-div {width: 31px; margin-right: 0} .share-voice-container > .actions > li > .flag {float: right} .voice-over-info > .comments {float: right; margin: 15px 0} .voice-over-info > .comments > li {font-size: 12px; font-weight: bold; height: 16px; width: 30px; line-height: 19px; padding-left: 20px} /* .link-base-container > .back-to-voice { position:relative; width:160px; height:30px; margin:0px auto -4px; z-index: 4; padding-top: 1px; } .link-base-container > .back-to-voice > span { font-size: 13px; padding-left: 10px; display: block; padding-top:13px; } .back-to-voice > ul { overflow:hidden; width:50px; margin: 0 auto; } .back-to-voice > ul > li {display:block; float:left; height:40px} .back-to-voice > ul > .prev {border-width:0 1px 0 0; float:left} .back-to-voice > ul > .next {border-width:0 0 0 1px; float:right} .back-to-voice > ul > li > a {width:14px; height:19px; display:block; cursor:pointer; margin-top:10px} .back-to-voice > ul > li > .prev {margin-right: 10px} .back-to-voice > ul > li > .next {margin-left: 10px} .touch .copy-url { display: none; } @media all and (max-width: 500px) { .overlay-container > .arrows { display: none; } .close-voice-container { position: fixed; top: 25px; right: 25px; } .overlay-container > .voice-container { float: none; width: 100%!important; position: relative; max-width: 100%; height: 100%; } .overlay-container > .voice-container .voice-over-info img { max-width: 100%; } .voice-over-info > h2 { width: 100%; padding: 0 10px; } .link-base-border > .link-base-action > ul > li > a { font-size: 11px; padding: 2px 6px; } .link-base-action > .right-action > span { display: none; } } @media all and (max-width: 400px) { .link-base-border > .link-base-action > ul > li.copy-url { display: none; } } */ /* Overlay Styles */ .arrows > .tooltip-arrow {display: none} .arrows > .tooltip-arrow > img {border-style: solid; border-color: #FFF;} .arrows > .tooltip-arrow > .over-arrow {background: url(/images/bg/over_arrow.png?1578503741) no-repeat} .arrows > .left > .over-arrow {background-position: top left} .arrows > .right > .over-arrow {background-position: top right} .arrows > .voice-arrow {background: url(/images/bg/overlaw-arrows.png?1578503741) no-repeat} .arrows > .left {background-position: 0 0;} .arrows > .right {background-position: 0 -64px;} .arrows > .voice-arrow:active {opacity: .5} .vide-overlay-container .video-container { background: #d9d9d9; border-color: transparent; border-style: solid; background: url(/images/bg/video_container.png?1578503741) repeat 0 0; border-radius:4px; box-shadow: 0 0 0 3px rgba(0, 0, 0, .2); } .overlay-container > .voice-container { background: #d9d9d9; border-color: transparent; border-style: solid; background: #EEEEEE; border-radius:0px 0px 4px 4px; box-shadow: 0 0 0px 3px rgba(0, 0, 0, .2); } .voice-over-info > h2 {color: #262626} .voice-over-info > .external-link > li { border-style: solid; border-color: #262522; border-radius: 4px } .voice-over-info > .external-link > li > a { background: #58554b; text-decoration: none; color: #d9d9d9; border-style: solid; border-color: #757269 #6b685f #5f5d54 #6b685f; font-weight: normal; border-radius: 4px; background-image: -moz-linear-gradient(top, #636057, #4f4c43); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #636057), color-stop(1.0, #4f4c43)); background-image: -webkit-linear-gradient(#636057, #4f4c43); background-image: linear-gradient(top, #636057, #4f4c43); } .close-voice-container { background: url(/images/icons/sidebar-sprite.png?1578503741) transparent no-repeat; background-position: -213px 0; float: right; display: block; position: relative; } .close-voice-container:hover { background-position: -213px -33px; } .voice-container > .voice-coment-zone { background: #ededed; border-color: #bababa; border-style: solid} .voice-container > .voice-coment-zone > .show-comment-arrow {background: url(/images/bg/comment-arrow.png?1578503741) no-repeat; background-position:0 0} .voice-container > .share-voice-container > p {color: #807c73} .share-voice-container > .actions > .flag-div {background: url(/images/bg/divider_dots.png?1578503741) 0 0 no-repeat} .share-voice-container > .actions > li > a {background: url(/images/bg/sprites/box_actions.png?1578503741) no-repeat} .share-voice-container > .actions > li > .facebook {background-position: 0 0} .share-voice-container > .actions > li > .twitter {background-position: -24px 0} .share-voice-container > .actions > li > .flag {background-position: -48px 0} .share-voice-container > .actions > li > .facebook:hover {background-position: 0 -25px} .share-voice-container > .actions > li > .twitter:hover {background-position: -24px -25px} .share-voice-container > .actions > li > .flag:hover {background-position: -48px -25px} .voice-over-info > .comments {background: url(/images/icons/comments.png?1578503741) no-repeat; background-position:0 0} .voice-over-info > .comments > li { color: #1b181a}