/* /css/mods/competitors/competitors.css (18.44 KB) */
/* /css/mods/competitors/orders.css (13.41 KB) */
/* /css/mods/competitors/charts.css (17.78 KB) */
/* /css/mods/competitors/table.css (12.23 KB) */
/* /css/mods/competitors/table.summary.css (2.87 KB) */
/* /css/mods/competitors/winTable.css (9.43 KB) */
html { background: #FFF; overflow-y: scroll; } body { background: #FFF; } #body { background: #FFF; } .title { text-align: unset; } #competitors { font-size: 14px; position: relative; z-index: unset; min-height: calc(100vh - 46px); } #competitors a { color: var(--color-bg-primary-1); text-decoration: none; } #competitors a:hover { text-decoration: underline; } #competitors > .header, #competitors > .menu, #competitors > .charts, #competitors > .table { padding: 0 16px; } #competitors > .header, #competitors > .menu { position: relative; z-index: 1; } #content [class*=icon-searcher-0-], #content .icon-google-color { width: 16px; height: 16px; } #content [class*=icon-searcher-0-], #win_competitors_orders_pay [class*=icon-searcher-0-] { color: #FF0000 !important; } #content .icon-google-color, #win_competitors_orders_pay .icon-google-color { background-size: 100%; } #competitors > .header { height: 64px; position: relative; display: flex; transition: background 0.2s; } #competitors > .header > .header-gradiend { background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 100%); padding: inherit; margin: 0 -16px; display: flex; justify-content: space-between; align-items: center; flex-grow: 1; } #competitors > .header > .header-gradiend > * { margin-right: 8px; order: 2; } #competitors > .header [data-top-popup] [class*=icon] { font-size: 16px; width: 16px; height: 16px; margin: 0 6px 2px 0; } .top-popup-wrapper.competitors_in_header .top-popup { margin: -5px 0 0 -8px; } #competitors > .header [data-top-popup="#popup_select_region_index"] { border-radius: 5px; background: #FFF; width: 9vw; height: 30px; padding: 0 10px; line-height: 30px; overflow: hidden; } #competitors > .header [data-top-popup="#popup_select_region_index"] > ul { pointer-events: none; padding: 0; margin: 0; list-style: none; } #competitors > .header [data-top-popup="#popup_select_region_index"] > ul > li { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display: none; } #competitors > .header [data-top-popup="#popup_select_region_index"] > ul > li > .a { padding: 0; } #popup_select_region_index .top-popup { min-width: 205px; } #popup_select_region_index .top-popup li { white-space: nowrap; } [data-top-icon="url"]:before { content: "\e90e"; font-family: "Topvisor"; } [data-top-icon="keyword"]:before { content: "\e92d"; font-family: "Topvisor"; } #competitors > .header .selector_query { width: 25vw; display: flex; position: relative; } #competitors > .header [data-top-popup="#popup_select_by_type"] { border-radius: 5px 0 0 5px; background: rgba(255, 255, 255, 0.9); width: 160px; height: 30px; padding: 0 10px 0 0; margin: 0; line-height: 30px; position: relative; } #competitors > .header [data-top-popup="#popup_select_by_type"]:after { content: " "; width: 1px; display: block; position: absolute; top: 5px; right: 0; bottom: 5px; } #competitors > .header [data-top-popup="#popup_select_by_type"] > i { display: none; } #popup_select_by_type .top-popup { min-width: 160px; white-space: nowrap; } #competitors > .header [data-top-popup="#popup_select_by_type"] [data-top-icon]:before { --top-icon-size: 16px; position: relative; bottom: -2px; } #competitors > .header input[name="query"] { border-radius: 0 5px 5px 0; border: none; width: 100%; height: 28px; padding: 1px 30px 1px 10px; } #competitors > .header input[name="query"].top-error { background: #ffebeb; transition: 0.3s; } #competitors > .header .loading { height: 100%; color: #C3C9CF; position: absolute; right: 30px; display: none; } #competitors > .header [data-action="query_clear"] { border-radius: 100%; background: var(--color-blue-l); width: 16px; height: 16px; color: var(--color-white); font-size: 16px; position: absolute; right: 7px; top: 7px; } #competitors > .header [data-action="query_clear"]:hover { background: var(--color-bg-primary-1); } #competitors > .header input[name="query"].is_loading { padding-right: 105px; } #competitors > .header input[name="query"].is_loading ~ .loading { display: flex; align-items: center; } #competitors > .header input[name="query"]:not(:valid) ~ .loading, #competitors > .header input[name="query"]:not(:valid) + [data-action="query_clear"] { display: none; } #competitors > .header .loading .animation_typing { margin-left: 2px; display: flex; align-items: center; } #competitors > .header .loading .animation_typing > i { border-radius: 100%; background: #D8DAD9; width: 3px; height: 3px; margin: 6px 2px 0 2px; display: inline-block; vertical-align: middle; animation: tickets-writing-circle 1.2s ease infinite; } #competitors > .header .loading .animation_typing > i:not(:first-child):not(:last-child) { animation-delay: 0.2s; } #competitors > .header .loading .animation_typing > i:last-child { animation-delay: 0.4s; } #competitors > .header [data-top-popup="#popup_select_date"] { pointer-events: unset; border-radius: 5px; background: #FFF; width: 110px; height: 30px; line-height: 30px; align-items: center; } #competitors > .header [data-top-popup="#popup_select_date"] > .date:empty:after { content: attr(title); } #competitors > .header [data-top-popup="#popup_select_date"][data-top-popup-disabled] { opacity: 0.5; } #competitors > .header [data-top-popup="#popup_select_date"] .preloader_circles { display: inline; } #competitors > .header [data-top-popup="#popup_select_date"] .preloader_circles > i { background: var(--color-bg-primary-1); } #popup_select_date .top-popup { min-width: 150px; } #competitors > .header .go { border-radius: 5px; width: 120px; white-space: nowrap; } #competitors > .menu { height: 50px; color: #FFF; font-weight: 600; display: flex; align-items: center; justify-content: space-between; transition: background 0.2s; } #competitors > .menu a { color: #FFF !important; } #competitors > .menu a:not(:hover):not(.top-active) { opacity: 0.6; } #competitors > .menu .selector_view { margin-right: 2%; display: flex; flex-grow: 1; } #competitors > .menu .selector_view > * { margin-right: 2%; } .competitors_selector_type { margin-left: 2%; display: flex; } .competitors_selector_type.disabled { pointer-events: none; opacity: 0.3; } .competitors_selector_type a { display: flex; align-items: center; order: 1; text-decoration: none !important; } .competitors_selector_type a + a { order: 3; } .competitors_selector_type .top-checkboxSwitcher_input { background: rgba(255, 255, 255, 0.4) !important; margin: 0; color: #FFF !important; } .competitors_selector_type .top-checkboxSwitcher-switcher-type { margin: 0 5px; order: 2; } .competitors_selector_type .top-checkboxSwitcher-switcher-type:not(.top-active) + a { opacity: 1 !important; } .competitors_selector_type .top-checkboxSwitcher-switcher-type.top-active + a + a { opacity: 1 !important; } .modal-header .competitors_selector_type a { color: var(--color-blue-dd) !important; font-size: 14px; font-weight: 400 !important; line-height: 16px; text-decoration: none !important; } .modal-header .competitors_selector_type a:not(:hover) { opacity: 0.6; } .modal-header .competitors_selector_type .top-checkboxSwitcher_input { background: var(--color-layer-primary-2) !important; color: var(--color-bg-primary-1) !important; } #competitors[data-by_type="url"] { } #competitors:not([data-by_type="url"]) .only-by-url { display: none !important; } #competitors[data-by_type="keyword"] { } #competitors:not([data-by_type="keyword"]) .only-by-keyword { display: none !important; } #competitors[data-view="keywords"] { } #competitors:not([data-view="keywords"]) .only-view-keywords { display: none !important; } #competitors:not([data-view="domains"]) .only-view-domains { display: none !important; } #competitors:not([data-view="structure"]) .only-view-structure { display: none !important; } #competitors:not([data-view="wordstat"]) .only-view-wordstat { display: none !important; } #competitors:not([data-view="leaders"]) .only-view-leaders { display: none !important; } #competitors:not([data-view="similar"]) .only-view-similar { display: none !important; } #competitors[data-type="serp"] { } #competitors:not([data-type="serp"]) .only-serp { display: none !important; } #competitors[data-type="serp"] > .header, #competitors[data-type="serp"] > .header [data-top-popup="#popup_select_by_type"]:after, #competitors[data-type="serp"] > .menu { background: var(--color-blue); } #competitors[data-type="serp"] > .header .go { background: #FC9C34; } #competitors[data-type="serp"].without-charts > .charts { border-color: var(--color-blue); background: var(--color-blue); } #competitors[data-type="serp"] > .table longlist_row.top-hover { background: #F7FBFE; } #competitors[data-type="serp"] .top-popup-wrapper, html[data-competitors-type="serp"] .top_table_filters { } #competitors[data-type="ads"] { } #competitors:not([data-type="ads"]) .only-ads { display: none !important; } #competitors[data-type="ads"] a { color: #FC8F34; } #competitors[data-type="ads"] ~ .top-popup-wrapper i.a.active, #competitors[data-type="ads"] .ui-autocomplete .ui-state-active { background-color: #FEF3EA; } #competitors[data-type="ads"] ~ .top-popup-wrapper i.a:hover { background-color: #FEF7F1; } #competitors[data-type="ads"] ~ .top-popup-wrapper i.a.active [class*=icon], #competitors[data-type="ads"] ~ .top-popup-wrapper i.a:hover [class*=icon] { color: #FC9C34; } #competitors[data-type="ads"] > .header, #competitors[data-type="ads"] > .header [data-top-popup="#popup_select_by_type"]:after, #competitors[data-type="ads"] > .header .preloader_circles > i { background: #FC9C34; } #competitors[data-type="ads"] > .header .go { background: var(--color-bg-primary-1); } #competitors[data-type="ads"] > .header [data-action="query_clear"] { background: var(--color-warning-350); } #competitors[data-type="ads"] > .header [data-action="query_clear"]:hover { background: var(--color-bg-warning-1); } #competitors[data-type="ads"] > .menu { background: #FC9C34; } #competitors[data-type="ads"].without-charts > .charts { border-color: #FC9C34; background: #FC9C34; } #competitors[data-type="ads"] .preloader .top-preloader-throbber { border-right-color: #FC9C34; border-bottom-color: #FC9C34; } html[data-competitors-type="ads"] .competitors_top_table longlist_row.top-hover > longlist_cell[data-open-type].is_not_paymented { border-color: #FED1AB; background: #FEF3EA; } html[data-competitors-type="ads"] .competitors_top_table longlist_cell[data-open-type].is_not_paymented > i.icon-lock { color: #FED1AB !important; } html[data-competitors-type="ads"] .top-radioSwitcher > i:hover { background: #FFFBF7; } html[data-competitors-type="ads"] .top-radioSwitcher > i.active { background: #FC9C34; } #competitors[data-type="ads"] > .table longlist_row.top-hover { background: #FFFBF7; } #competitors[data-type="ads"] .top-popup-wrapper, html[data-competitors-type="ads"] .top_table_filters { --top-forms-option-color: var(--color-text-warning); --top-forms-option-color-hover: var(--color-text-warning); } #competitors.order-blocked > .header .go i:nth-child(2) { display: none; } #competitors:not(.order-blocked) > .header .go { pointer-events: none; background: rgba(0, 0, 0, 0.2); } #competitors:not(.order-blocked) > .header .go i:nth-child(1) { display: none; } #competitors.order-blocked > :not(.header):not(.blank) { display: none; } #competitors:not(.order-blocked) > .blank { display: none; } #competitors > .blank { max-width: 500px; padding: var(--padding-default); margin: 5% auto; text-align: center; opacity: 0; transition: 1s 0.5s; } html[data-is_loaded="1"] #competitors > .blank { opacity: 1; } #competitors > .blank h2 { font-size: 20px; } .selector_intersection { border-radius: 4px; border: 1px solid #EDF5FE; min-width: 320px; max-width: calc(100% - 14px - 2px); padding: 4px 6px 4px 4px; display: flex; position: relative; } .selector_intersection:after { content: ""; border-radius: 1px; background: #EDF5FE; height: 2px; display: block; position: absolute; top: 14px; right: 20px; left: 4px; z-index: -2; } .selector_intersection * { box-sizing: content-box; } .selector_intersection > i { box-sizing: content-box; cursor: pointer; border-radius: 4px; width: 16px; height: 16px; margin: 3px 10px; color: var(--color-text-4); text-align: center; line-height: 16px; flex-grow: 1; position: relative; } .selector_intersection > i:last-of-type { width: 20px; } .selector_intersection > i:before { content: ""; width: 38px; height: 20px; margin: -2px 0 0 -10px; display: block; position: absolute; } .selector_intersection > i.active { background: var(--color-cyan); color: #FFF !important; } .selector_intersection > i.active, .selector_intersection > i.hover { padding: 3px 10px; margin: 0; } .selector_intersection > i.active:not(.is_paymented), .selector_intersection > i.hover:not(.is_paymented):hover { padding: 3px 15px 3px 10px; margin-right: -5px; } .selector_intersection > i.active:not(.is_paymented):after, .selector_intersection > i.hover:not(.is_paymented):hover:after { content: "K"; margin: 0 0 0 2px; color: #B6D7FE; font-family: Topvisor; font-size: 12px; position: absolute; } .selector_intersection > i.active:after { color: #FFF !important; } .selector_intersection > i:not(.active):not(.hover) { background: #FFF; } .selector_intersection > i > i.target { border: 6px solid transparent; border-bottom-color: var(--color-cyan); display: block; position: absolute; top: calc(50% + 4px); left: 5px; } .selector_intersection > i:last-of-type > i.target { margin-left: 3px; } .selector_intersection > i.active > i.target, .selector_intersection > i.hover > i.target { left: calc(5px + 10px); } .selector_intersection > i.active > i.target { top: calc(50% + 7px); } .selector_intersection > i.is_paymented { color: var(--color-cyan); } .selector_intersection > i.is_paymented:after { content: none !important; } .selector_intersection > i.hover_path { border: 1px dashed #B6D7FE; background: #EDF5FE !important; width: auto; height: 20px; margin: 0; position: absolute; top: 4px; bottom: 4px; left: 4px; z-index: -1; } .selector_intersection[data-is_paymented="0"] i.info_paymented, .selector_intersection[data-is_paymented="1"] + i.selector_intersection_go { display: none; } .selector_intersection_go { margin: 2px 0 2px 6px; line-height: 18px; } #win_export_keywords_to_project { max-width: 350px; min-width: 350px; min-height: 480px !important; } #win_export_keywords_to_project .more { display: none; } #win_export_keywords_to_project label { width: 100%; } #win_export_keywords_to_project .caption [name=project_site] { pointer-events: none; } #win_export_keywords_to_project .top-selectorGroup { flex-wrap: wrap; } #win_export_keywords_to_project .top-selectorGroup.disabled { pointer-events: none; opacity: 0.5; } #win_export_keywords_to_project .top-selectorGroup .top-selector { margin: 0 0 10px 0 !important; min-width: 100%; } #win_export_keywords_to_project .top-selectorGroup .top-selector:before { margin: 0; } #win_export_keywords_to_project .top-selectorGroup .top-selector:after, #win_export_keywords_to_project .top-selectorGroup .top-selector:before { display: none; } #win_export_keywords_to_project .from_to_wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; } #win_export_keywords_to_project .from_to_wrapper > .top-inputRange { width: 40%; flex-grow: 1; } #win_export_keywords_to_project .set_targets_wrapper { display: none; } #win_export_keywords_to_project .go { flex-grow: 1; } #win_export_keywords_to_project .modal-footer { color: var(--color-text-3); flex-wrap: wrap; } #win_export_keywords_to_project .modal-footer .count { margin: 0 0 0 6px; } @media only screen and (min-width: 900px) { #competitors[data-type="ads"] > .table .top_table.i-show-filters > .header > i.filter-bar-opener { color: #FC9C34; } } @media only screen and (max-width: 900px) { #competitors { } #competitors > .header, #competitors > .menu, #competitors > .table { padding: 0 12px; } #competitors > .header { height: 150px; z-index: 2; } #competitors > .header > .header-gradiend { padding-top: 16px; padding-bottom: 16px; margin: 0 -12px; flex-wrap: wrap; } #competitors > .header > .header-gradiend > * { margin: 0; } #competitors > .header [data-top-popup="#popup_select_region_index"] { width: 40%; flex-grow: 1; } #competitors > .header .selector_query { width: calc(100% - 170px); flex-grow: 1; order: 1; } #competitors > .header [data-top-popup="#popup_select_by_type"] { min-width: 14px; order: 1; overflow: hidden; } #competitors > .header input[name="query"] { max-width: calc(100% - 20px); flex-grow: 1; } #competitors > .header input[name="query"].is_loading { padding-right: 60px; } #competitors > .header .loading .animation > i { margin-top: 0; } #competitors > .header [data-top-popup="#popup_select_date"] { width: 40%; margin-left: 8px; } #competitors > .header .go { width: 100%; } #competitors > .header [data-top-popup="#popup_select_my_order"] { position: absolute; right: 12px; bottom: -25px; } #competitors > .menu { height: 66px; padding: 0; flex-wrap: wrap; align-items: flex-end; } #competitors > .menu > .selector_view { width: 100%; margin: 8px 0; white-space: nowrap; overflow-x: auto; order: 99; justify-content: space-between; align-items: center; scrollbar-width: none; } #competitors > .menu > .selector_view::-webkit-scrollbar { width: 0; height: 0; } #competitors > .menu > .selector_view > a { padding: 0 12px; margin: 0; flex-grow: 1; max-width: 190px; } #competitors > .menu > .selector_view > a:nth-child(2), #competitors > .menu > .selector_view > a:nth-child(5) { text-align: center; } #competitors > .menu > .selector_view > a:nth-child(3), #competitors > .menu > .selector_view > a:nth-child(6) { text-align: right; } #competitors > .menu > .selector_type { padding: 0 12px; margin: 0; } #competitors > .menu [data-top-popup="#popup_select_date"] { text-align: right; } #competitors[data-type="ads"] > .table .top_table.i-has-filters > .header > i.filter-bar-opener { color: #FC9C34; } #competitors.order-blocked > .header { padding-bottom: 40px; } #competitors.order-blocked > .header [data-top-popup="#popup_select_my_order"] { bottom: 20px; } .competitors_top_table .selector_intersection { width: 100%; max-width: 500px; } } #competitors > .header [data-top-popup="#popup_select_my_order"]{ margin: 0 0 0 auto; color: #FFF; font-weight: 600; text-align: right; white-space: nowrap; } #competitors > .header [data-top-popup="#popup_select_my_order"] [class*=icon]{ margin: 2px 0 0 5px; } #popup_select_my_order .top-popup{ user-select: none; width: 550px; max-width: unset; margin-right: -8px; } #popup_select_my_order .top-popup_header{ background: #FFF; } #popup_select_my_order .top-popup_header [class*=icon]{ font-size: 16px; } #popup_select_my_order .top-popup_header ul{ margin: 0; flex-grow: 1; } #popup_select_my_order ul.top-popup_content{ min-height: 100px; overflow-y: scroll; } #popup_select_my_order li{ line-height: 18px; } #popup_select_my_order .searcher{ margin-right: 36px; } #popup_select_my_order .query{ width: 0; margin: 0 auto 0 0; overflow: hidden; text-overflow: ellipsis; flex-grow: 1; } #popup_select_my_order .count, #popup_select_my_order .date{ width: 52px; padding: 0 0 0 6px; margin: 0 16px 0 0; } #popup_select_my_order .count{ text-align: right; } #popup_select_my_order .expire{ width: 35px; color: var(--color-text-3); font-size: 9px; } #popup_select_my_order .del{ margin: 0 0 0 8px !important; font-size: 14px; } #popup_select_my_order li.label{ margin-right: var(--scrollbar-width); font-size: 12px; color: var(--color-text-3); display: flex; align-items: center; } #popup_select_my_order li.label .selector{ cursor: pointer; width: 16px; height: 16px; margin-right: 14px; text-align: center; } #popup_select_my_order li.label .selector.searcher{ margin-right: 36px; } #popup_select_my_order li.label .selector > i{ display: block; } #popup_select_my_order li.label .selector > i:not(.active){ display: none; } #popup_select_my_order li.label .selector > i:first-child{ filter: grayscale(100%); opacity: 0.8; } #popup_select_my_order li.label .selector > i.active[data-by_type]{ color: var(--color-cyan); } #popup_select_my_order li.label input{ border: none; height: 28px; padding: 0 4px; margin: -4px; font-size: 12.5px; } #popup_select_my_order li.label .expire{ width: 56px; white-space: nowrap; } #popup_select_my_order li.label .sorter:after{ font-size: 12px; } #popup_select_my_order i.a{ white-space: nowrap; display: flex; justify-content: space-between; } #popup_select_my_order i.a .region_index{ color: var(--color-text-4); font-size: 8px; position: absolute; bottom: 4px; left: 35px; } #popup_select_my_order i.a img.top-favicon{ margin-right: 14px; transition: 0.3s; } #popup_select_my_order i.a .icon-search_a{ width: 16px; height: 16px; margin-right: 14px; font-size: 16px; } #win_competitors_orders_pay{ width: 900px !important; } #win_competitors_orders_pay .modal-layer-header{ border: none; } #win_competitors_orders_pay .modal-header .top-title{ font-size: 14px; justify-content: center; } #win_competitors_orders_pay .modal-header .top-title > i{ margin: 0 6px; } #win_competitors_orders_pay .modal-header .top-title > i *{ margin: 0 4px 0 0; } #win_competitors_orders_pay .modal-header .domain_label{ max-width: 50%; overflow: hidden; text-overflow: ellipsis; } #win_competitors_orders_pay .modal-header .domain_label img{ width: 16px; } #win_competitors_orders_pay .modal-header .region_label{ } #win_competitors_orders_pay .modal-header .date_label{ } #win_competitors_orders_pay .modal-header .date_label i{ color: var(--color-text-3); } #win_competitors_orders_pay .modal-footer{ flex-wrap: wrap; } #win_competitors_orders_pay .counters, #win_competitors_orders_pay .options_wrapper{ display: flex; } #win_competitors_orders_pay .counters{ border-radius: 8px; border: 1px solid var(--color-line-2); padding: 12px; flex-grow: 1; } #win_competitors_orders_pay .counters > i{ width: 25%; position: relative; } #win_competitors_orders_pay .counters > i:not(:last-child){ margin-right: 20px; } #win_competitors_orders_pay .counters > i.for_competitor:before{ content: 'K'; color: var(--color-line-2); font-size: 36px; font-family: Topvisor; line-height: 1; position: absolute; top: 0; left: 0; opacity: 0; transition: 0.3s; z-index: 1; } #win_competitors_orders_pay .counters > i:not(:last-child):after{ content: ''; background: var(--color-line-2); width: 1px; position: absolute; top: -3px; right: -10px; bottom: -3px; display: block; } #win_competitors_orders_pay .counters > i img{ width: 36px; height: 36px; position: absolute; top: 0; left: 0; transition: 0.3s; } #win_competitors_orders_pay .counters > i .value{ margin-left: calc(36px + 10px); font-size: 20px; line-height: 36px; display: block; height: 36px; } #win_competitors_orders_pay .counters > i .comment{ margin-top: 12px; line-height: 14px; display: block; } #win_competitors_orders_pay .counters > i .highlight{ pointer-events: none; box-shadow: rgba(0,0,0,0.1) 0 0 15px; border-radius: 4px; border: 1px dashed #D6D6D6; width: 474px; height: 130px; opacity: 0; display: block; position: absolute; top: 255px; right: 24px; transition: 0.3s; } #win_competitors_orders_pay .counters > i:hover .highlight{ border-radius: 10px; opacity: 1; } #win_competitors_orders_pay .counters > i.count_competitors_keywords .highlight{ right: 194px; } #win_competitors_orders_pay .counters > i.count_competitors_ads .highlight{ right: 366px; } #win_competitors_orders_pay .modal-body.has_scroll .counters > i .highlight, html.is_mobile #win_competitors_orders_pay .counters .counters > i .highlight{ display: none; } #win_competitors_orders_pay .error_message{ padding: 18px 0 0 0; text-align: center; } #win_competitors_orders_pay .header{ padding: 18px 0 0 0 !important; text-align: center; } #win_competitors_orders_pay .options_wrapper{ min-height: 210px; margin: 18px 0; } #win_competitors_orders_pay .options{ width: 55%; margin-right: 16px; height: 100%; display: flex; flex-direction: column; flex-wrap: wrap; } #win_competitors_orders_pay .options > .regular{ border-radius: 8px; border: 1px solid #DADADA; height: calc(100px - 20px); padding: 10px 16px; display: flex; align-items: center; flex-grow: 1; } #win_competitors_orders_pay .options > .regular:not(.disabled):hover, #win_competitors_orders_pay .options > .regular.active{ border-color: var(--color-cyan); background: #F6FCFF; } #win_competitors_orders_pay .options > .regular.disabled{ opacity: 1; } #win_competitors_orders_pay .options > .regular .icons{ display: none; } #win_competitors_orders_pay .options > .regular img{ width: 36px; height: 36px; margin-right: 10px; } #win_competitors_orders_pay .options > .regular .text{ margin-right: auto; } #win_competitors_orders_pay .options > .regular .text .comment{ display: block; } #win_competitors_orders_pay .options [data-is_payment="1"] .price{ display: none; } #win_competitors_orders_pay .options .text_payment{ color: var(--color-text-3); display: none; } #win_competitors_orders_pay .options [data-is_payment="1"] .text_payment{ display: block; } #win_competitors_orders_pay .options .selector_intersection_label, #win_competitors_orders_pay .options .selector_intersection{ margin-left: 25px; font-size: 13px; position: relative; } #win_competitors_orders_pay .options .selector_intersection > i.active:after, #win_competitors_orders_pay .options .selector_intersection > i.hover:hover:after{ content: ''; } #win_competitors_orders_pay .options .selector_intersection_label{ min-height: 22px; margin-bottom: 10px; color: var(--color-text-3); display: flex; align-items: center; } #win_competitors_orders_pay .options .selector_intersection_label .price{ margin-left: auto; margin-right: 18px; } #win_competitors_orders_pay .options .selector_intersection_label i[class*=icon]{ margin: 0 0 0 4px; color: var(--color-cyan); font-size: 12px; } #win_competitors_orders_pay .options .selector_intersection > .info{ margin-top: 10px; color: var(--color-text-3); position: absolute; top: 100%; right: 5px; left: 0; } #win_competitors_orders_pay .options .selector_intersection > .info .info_paymented{ float: right; } #win_competitors_orders_pay .options > label.top-checkbox-with_competitors:not(.top-active) .price, #win_competitors_orders_pay .options > label.top-checkbox-with_competitors:not(.top-active) ~ .selector_intersection_label, #win_competitors_orders_pay .options > label.top-checkbox-with_competitors:not(.top-active) ~ .selector_intersection, #win_competitors_orders_pay .options > label.top-checkbox-with_competitors:not(.top-active) ~ .selector_intersection_info{ opacity: 0.5; } #win_competitors_orders_pay .options > label.top-checkbox-with_competitors.top-disabled ~ .selector_intersection{ pointer-events: none; } #win_competitors_orders_pay .checklist{ padding-left: 16px; border-left: 1px solid #D8D8D8; } #win_competitors_orders_pay .checklist > i{ padding-left: 24px; margin-top: 12px; color: var(--color-black); font-size: 13px; white-space: nowrap; display: block; position: relative; } #win_competitors_orders_pay .checklist > i:first-child{ margin-top: 0; } #win_competitors_orders_pay .checklist > i:before, #win_competitors_orders_pay .checklist > i:after{ content: ''; width: 18px; height: 20px; margin-right: 6px; color: var(--color-cyan); text-align: center; font-size: 18px; font-family: Topvisor; line-height: 1; display: inline-block; vertical-align: middle; position: absolute; left: 0; transition: 0.2s ease-in; } #win_competitors_orders_pay .checklist > i:after{ content: 'K'; color: var(--color-line-2); opacity: 0; transform:scale(0); } #win_competitors_orders_pay[data-is_payment="1"] .checklist > i:not(.for_competitor):before{ color: var(--color-line-2); } #win_competitors_orders_pay:not([data-with_competitors="1"]) .counters > i.for_competitor:before{ opacity: 1; } #win_competitors_orders_pay:not([data-with_competitors="1"]) .counters > i.for_competitor img{ opacity: 0; } #win_competitors_orders_pay:not([data-with_competitors="1"]) .checklist > i.for_competitor:before, #win_competitors_orders_pay:not([data-with_competitors="1"]) .checklist > i.for_competitor:after{ transition: 0.2s ease-out; } #win_competitors_orders_pay:not([data-with_competitors="1"]) .checklist > i.for_competitor:before{ opacity: 0; transform:scale(1.8); } #win_competitors_orders_pay:not([data-with_competitors="1"]) .checklist > i.for_competitor:after{ opacity: 1; transform:scale(1); } #win_competitors_orders_pay .options .top-throbber{ order: 99; } #win_competitors_orders_pay .options .top-throbber ~ .price, #win_competitors_orders_pay .options input{ align-items: center; } #win_competitors_orders_pay .options label.top-checkbox-with_competitors.is_loading ~ .selector_intersection, #win_competitors_orders_pay .options label.top-checkbox-with_competitors.is_loading ~ .selector_intersection_info{ pointer-events: none; visibility: hidden; } #win_competitors_orders_pay .options .top-progressBar{ margin-left: 25px; } #win_competitors_orders_pay .modal-footer .price{ margin: 0 0 0 4px; font-weight: 600; } #win_competitors_orders_pay[data-can_payment="0"] .modal-footer .second_level{ opacity: 0.5; } #win_competitors_orders_pay[data-can_payment="0"] .modal-footer .go{ display: none; } #win_competitors_orders_pay[data-can_payment="1"] .modal-footer [data-action="top-dialog-close"]{ display: none; } @media only screen and (min-width: 900px){ #win_competitors_orders_pay .modal-header .top-title{ margin-right: -36px; } #win_competitors_orders_pay .modal-header .buttons{ display: none; } #win_competitors_orders_pay .modal-footer{ padding: 8px 0; } #win_competitors_orders_pay .modal-footer .btn{ width: 216px; margin: 0 auto; } } @media only screen and (max-width: 900px){ #win_competitors_orders_pay .counters > i .value{ font-size: 16px; } #win_competitors_orders_pay .options .selector_intersection_label, #win_competitors_orders_pay .options .selector_intersection{ width: 100%; margin-left: 0; } #popup_select_my_order .query, #popup_select_my_order .date{ font-size: 11px; } #popup_select_my_order li.label input{ font-size: 12px; } } @media only screen and (max-width: 600px){ #win_competitors_orders_pay .counters > i .value{ font-size: 20px; } #win_competitors_orders_pay .modal-header .top-title{ padding: 0; } #win_competitors_orders_pay .counters{ flex-direction: column; } #win_competitors_orders_pay .counters > i{ width: auto; height: 36px; display: flex; align-items: center; } #win_competitors_orders_pay .counters > i:not(:last-child){ margin-right: 0; margin-bottom: 20px; } #win_competitors_orders_pay .counters > i:not(:last-child):after{ width: auto; height: 1px; top: auto; right: -3px; bottom: -10px; left: -3px; } #win_competitors_orders_pay .counters > i .comment{ width: 125px; margin: 0 0 0 auto;} #win_competitors_orders_pay .options_wrapper{ flex-direction: column; } #win_competitors_orders_pay .options_wrapper > *{ width: 100%; } #win_competitors_orders_pay .options{ height: 180px; margin: 0; font-size: 12px; flex-direction: row; justify-content: space-between; } #win_competitors_orders_pay .options > .regular{ height: calc(60px - 24px); padding: 10px 12px; } #win_competitors_orders_pay .checklist{ border: none; width: auto; padding-left: 0; margin: 20px 0 0 0; } #win_competitors_orders_pay .checklist > i{ font-size: 12px; } #win_competitors_orders_pay .options .top-progressBar{ width: 100%; margin-left: 0; } } #competitors > .charts{ border-radius: 8px; border: 1px solid #D8DBDD; box-sizing: border-box; height: 40vh; min-height: 300px; max-height: 420px; padding: 16px 0; margin: 16px 16px 0 16px; position: relative; display: flex; z-index: 20; overflow: visible; transition: border 0.3s, background 0.3s, height 0.3s, margin 0.3s; } #competitors.without-charts > .charts, #competitors > .charts.in_transition{ z-index: 0; } #competitors > .charts > div{ display: flex; flex-direction: column; align-items: stretch; position: relative; transition: opacity 0.3s; } #competitors > .charts .title{ padding: 0 0 20px 0; font-size: 12px; display: block; } #competitors > .charts .title i[data-top-popup]{ font-size: 14px; } #competitors > .charts i.rect{ border-radius: 2px; width: 16px; height: 3px; margin-right: 6px; vertical-align: middle; display: inline-block; } #competitors > .charts .chart-wrapper{ border-right: 1px solid #D8DBDD; width: calc(75% - 28px - 1px); height: 100%; padding-right: 12px; flex-grow: 1; } #competitors > .charts .chart{ display: flex; flex-direction: column; flex-grow: 1; } #competitors > .charts .highcharts-wrapper{ height: 0; flex-grow: 1; overflow: visible !important; } #competitors > .charts .chart-wrapper > .title{ text-transform: uppercase; display: flex; align-items: flex-start; justify-content: space-between; } #competitors > .charts .chart-wrapper > .title .chart-type-selector{ width: 100%; } #competitors > .charts .chart-wrapper > .title .chart-type-selector .menu{ padding: 0 16px; display: flex; overflow-x: auto; scrollbar-width: none; } #competitors > .charts .chart-wrapper > .title .chart-type-selector a{ padding: 5px 0; margin-right: 2%; color: var(--color-blue-dd); flex-shrink: 0; } #competitors > .charts .chart-wrapper > .title .chart-type-selector a:not(:hover):not(.active){ color: var(--color-gray-l); } #competitors > .charts .chart-wrapper > .title .config{ cursor: pointer; font-size: 16px; } #competitors > .charts .chart-wrapper > .chart{ padding: 0 16px; display: none; position: relative; } #competitors > .charts .chart-wrapper > .chart.active{ display: flex; } #competitors > .charts .chart-small-wrapper{ width: calc(25% - 28px); max-width: 325px; padding: 0 16px 0 28px; } #competitors[data-type="ads"][data-view="structure"] > .charts .chart-small-wrapper{ display: none } #competitors > .charts .chart-small-wrapper > div{ display: flex; flex-direction: column; flex-grow: 1; } #competitors > .charts .chart-small-wrapper > div > .title{ text-transform: uppercase; } #competitors > .charts .chart-small-wrapper .items{ display: flex; position: relative; flex-wrap: wrap; flex-grow: 1; } #competitors > .charts .chart-small-wrapper .item{ width: 33%; display: flex; flex-direction: column; flex-grow: 1; } #competitors > .charts .chart-small-wrapper .item.bt{ border-top: 1px solid #D8DBDD; padding-top: 20px; } #competitors > .charts .chart-small-wrapper .item.br{ border-right: 1px solid #D8DBDD; padding-right: 20px; } #competitors > .charts .chart-small-wrapper .item.bb{ padding-bottom: 20px; } #competitors > .charts .chart-small-wrapper .item.bl{ padding-left: 20px; } #competitors > .charts .chart-small-wrapper .item .value{ font-size: 28px; } #competitors > .charts .chart-small-wrapper .item .delta{ font-size: 18px; text-align: center; vertical-align: top; } #competitors > .charts .chart-small-wrapper .item .delta.up{ color: #1ABC9C; } #competitors > .charts .chart-small-wrapper .item .delta.down{ color: #E74E3F; transform: rotate(180deg); } #competitors > .charts .chart-small-wrapper .item > .title{ padding: 0; color: var(--color-gray-l); text-transform: uppercase; } #competitors > .charts .chart-small-wrapper .item .chart{ flex-grow: 1; } #competitors > .charts .legend{ max-height: 80px; margin: 12px 0; color: var(--color-blue-dd); font-size: 12px; display: flex; justify-content: center; flex-wrap: wrap; overflow: auto; } #competitors > .charts .legend:hover{ color: #808D9B; } #competitors > .charts .legend > i{ cursor: pointer; padding: 0 6px; line-height: 20px; } #competitors > .charts .legend > i:hover{ color: var(--color-blue-dd); } #competitors > .charts .legend > i.off{ color: #808D9B; } #competitors > .charts .legend i.rect{ width: 28px; } #competitors > .charts .legend > i.off i.rect{ background: #D8DBDD; } #competitors > .charts .item[data-chart-small-type="elements"]{ width: 100%; } #competitors > .charts .item[data-chart-small-type="elements"] .chart{ flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; } #competitors > .charts .item[data-chart-small-type="elements"] .chart > i{ width: 16px; height: 16px; padding: 5px; font-size: 16px; } #competitors .highcharts-container{ font-family: "Open Sans", "Helvetica Neue", sans-serif; overflow: visible; } #competitors .highcharts-title{ display: none; } #competitors .highcharts-grid-line, #competitors .highcharts-axis-line{ stroke: #DBE0E3; stroke-dasharray: 1px, 4px; } #competitors .highcharts-plot-line{ stroke: #9013FE; stroke-dasharray: 1px; } #competitors .highcharts-axis-labels{ fill: var(--color-line-4); font-size: 10px; } #competitors .highcharts-axis-title{ fill: var(--color-line-3); font-size: 10px; } #competitors .highcharts-data-label text{ color: var(--color-blue-dd); font-size: 12px; text-shadow: rgba(255, 255, 255, 0.5) 0 0 1px; pointer-events: none; } #competitors [class*=" highcharts-color-"], #competitors .highcharts-color-0{ fill: #04ADEF; stroke: #04ADEF; background: #04ADEF; color: #04ADEF; border-color: #04ADEF; } #competitors .highcharts-color-1{ fill: #8DD743; stroke: #8DD743; background: #8DD743; color: #8DD743; border-color: #8DD743; } #competitors .highcharts-color-2{ fill: #FC8F34; stroke: #FC8F34; background: #FC8F34; color: #FC8F34; border-color: #FC8F34; } #competitors .highcharts-color-3{ fill: #AE00CB; stroke: #AE00CB; background: #AE00CB; color: #AE00CB; border-color: #AE00CB; } #competitors .highcharts-color-4{ fill: #F8CF15; stroke: #F8CF15; background: #F8CF15; color: #F8CF15; border-color: #F8CF15; } #competitors .highcharts-color-5{ fill: #4023BB; stroke: #4023BB; background: #4023BB; color: #4023BB; border-color: #4023BB; } #competitors .highcharts-color-6{ fill: #FF3E2A; stroke: #FF3E2A; background: #FF3E2A; color: #FF3E2A; border-color: #FF3E2A; } #competitors .highcharts-color-7{ fill: #22B1C1; stroke: #22B1C1; background: #22B1C1; color: #22B1C1; border-color: #22B1C1; } #competitors .highcharts-color-8{ fill: #EA39A0; stroke: #EA39A0; background: #EA39A0; color: #EA39A0; border-color: #EA39A0; } #competitors .highcharts-color-9{ fill: #9013FE; stroke: #9013FE; background: #9013FE; color: #9013FE; border-color: #9013FE; } #competitors .highcharts-color-10{ fill: #B8081C; stroke: #B8081C; background: #B8081C; color: #B8081C; border-color: #B8081C; } #competitors .highcharts-color-11{ fill: #008080; stroke: #008080; background: #008080; color: #008080; border-color: #008080; } #competitors .highcharts-color-12{ fill: #006FC5; stroke: #006FC5; background: #006FC5; color: #006FC5; border-color: #006FC5; } #competitors .highcharts-color-13{ fill: #33CFA5; stroke: #33CFA5; background: #33CFA5; color: #33CFA5; border-color: #33CFA5; } #competitors .highcharts-color-14{ fill: #FF86CC; stroke: #FF86CC; background: #FF86CC; color: #FF86CC; border-color: #FF86CC; } #competitors .highcharts-color-15{ fill: #B8081C; stroke: #B8081C; background: #B8081C; color: #B8081C; border-color: #B8081C; } #competitors .highcharts-color-16{ fill: #89D9FF; stroke: #89D9FF; background: #89D9FF; color: #89D9FF; border-color: #89D9FF; } #competitors .chart[data-highcharts-colors="top"] .highcharts-color-0{ fill: #9013FE; stroke: #9013FE; background: #9013FE; color: #9013FE; border-color: #9013FE; } #competitors .chart[data-highcharts-colors="top"] .highcharts-color-1{ fill: #04ADEF; stroke: #04ADEF; background: #04ADEF; color: #04ADEF; border-color: #04ADEF; } #competitors .chart[data-highcharts-colors="top"] .highcharts-color-2{ fill: #36D4B3; stroke: #36D4B3; background: #36D4B3; color: #36D4B3; border-color: #36D4B3; } #competitors .chart[data-highcharts-colors="top"] .highcharts-color-3{ fill: #FED416; stroke: #FED416; background: #FED416; color: #FED416; border-color: #FED416; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-0, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-11, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-22{ fill: #4FC5F3; stroke: #4FC5F3; background: #4FC5F3; color: #4FC5F3; border-color: #4FC5F3; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-1, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-12, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-23{ fill: #AED586; stroke: #AED586; background: #AED586; color: #AED586; border-color: #AED586; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-2, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-13, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-24{ fill: #FF887D; stroke: #FF887D; background: #FF887D; color: #FF887D; border-color: #FF887D; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-3, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-14, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-25{ fill: #FAA268; stroke: #FAA268; background: #FAA268; color: #FAA268; border-color: #FAA268; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-4, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-15, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-26{ fill: #FED553; stroke: #FED553; background: #FED553; color: #FED553; border-color: #FED553; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-5, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-16, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-27{ fill: #F074BC; stroke: #F074BC; background: #F074BC; color: #F074BC; border-color: #F074BC; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-6, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-17, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-28{ fill: #69A4FC; stroke: #69A4FC; background: #69A4FC; color: #69A4FC; border-color: #69A4FC; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-7, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-18, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-29{ fill: #7965CF; stroke: #7965CF; background: #7965CF; color: #7965CF; border-color: #7965CF; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-8, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-19, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-30{ fill: #C64CDA; stroke: #C64CDA; background: #C64CDA; color: #C64CDA; border-color: #C64CDA; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-9, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-20, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-31{ fill: #678EB4; stroke: #678EB4; background: #678EB4; color: #678EB4; border-color: #678EB4; } #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-10, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-21, #competitors .chart[data-highcharts-colors="pale"] .highcharts-color-32{ fill: #4CB398; stroke: #4CB398; background: #4CB398; color: #4CB398; border-color: #4CB398; } #competitors .highcharts-tooltip{ visibility: hidden; } #competitors .highcharts-tooltip > span{ box-shadow: 0 0 4px 0 rgba(52,73,94,0.2); border-radius: 10px; background: rgba(255,255,255,0.95); padding: 9px 0; color:var(--color-blue-dd); font-size: 12px; } #competitors .highcharts-tooltip .title{ border-bottom: 1px dotted #D8DBDD; padding: 3px 0 8px; margin: 0 12px 8px; font-weight: 600; word-break: break-word; } #competitors .highcharts-tooltip .table{ display: flex; } #competitors .highcharts-tooltip .col_left{ min-width: 0; } #competitors .highcharts-tooltip .col_right{ flex-shrink: 0; } #competitors .highcharts-tooltip .cell{ background: transparent !important; padding: 3px; text-overflow: ellipsis; white-space: nowrap; display: block; overflow: hidden; } #competitors .highcharts-tooltip .col_left .cell{ padding-left: 12px; } #competitors .highcharts-tooltip .col_right .cell{ padding-right: 12px; } #competitors .highcharts-tooltip .cell.header{ border-bottom: 1px dotted #D8DBDD; padding-bottom: 8px; margin-bottom: 8px; font-weight: 600; } #competitors .highcharts-tooltip .col_left .cell.header{ padding-left: 0; margin-left: 12px; } #competitors .highcharts-tooltip .col_right .cell.header{ padding-right: 0; margin-right: 12px; } #competitors .highcharts-tooltip .cell.highlighted{ background: rgba(4,173,239,0.06) !important; } #competitors .highcharts-container-spline .highcharts-series-group .highcharts-spline-series > .highcharts-point{ stroke: #fff; } #competitors .highcharts-container-spline .highcharts-xaxis text{ visibility: hidden; } #competitors .highcharts-container-spline .highcharts-tooltip .cell{ color:var(--color-blue-dd); } #competitors .highcharts-container-column .highcharts-series-group .highcharts-column-series > .highcharts-point{ rx: 5px; ry: 5px; stroke: #fff; transition: 0.3s; } #competitors .highcharts-container-column.highcharts-container-column-stacking .highcharts-series-group .highcharts-column-series > .highcharts-point{ rx: 2.5px; ry: 2.5px; } #competitors .highcharts-container-column .highcharts-series-group .highcharts-series-inactive{ opacity: 1; } #competitors .highcharts-container-column .highcharts-series-group .highcharts-series-inactive{ opacity: 1; } #competitors .highcharts-container-column .highcharts-series-group .highcharts-series-inactive > .highcharts-point{ opacity: 0.2; } #competitors .highcharts-container-column .highcharts-series-group .highcharts-series > .highcharts-point.highcharts-point-hover{ opacity: 1; } #competitors .highcharts-container-column .highcharts-xaxis text{ visibility: hidden; } #competitors .highcharts-container-column .highcharts-tooltip i.rect, #competitors .highcharts-container-column .highcharts-tooltip .cell.header{ display: none } #competitors .highcharts-container-column .highcharts-tooltip .col_left .cell{ font-weight: 600; } #competitors .highcharts-container-column .highcharts-tooltip .title{ text-align: center; } #competitors .highcharts-container-bubble .highcharts-series-group .highcharts-bubble-series:not(.highcharts-series-hover) .highcharts-halo{ visibility: hidden; } #competitors .highcharts-container-bubble .highcharts-series-group .highcharts-bubble-series .highcharts-point{ stroke-width: 0; } #competitors .highcharts-container-bubble .highcharts-series-group .highcharts-line-series .highcharts-graph{ stroke-width: 1px; stroke-dasharray: 1px; stroke-linecap: unset; stroke-linejoin: unset; } #competitors .highcharts-container-bubble .highcharts-series-group .highcharts-line-series.highcharts-markers{ visibility: hidden; } #competitors .highcharts-container-bubble .highcharts-tooltip .title{ text-align: center; } #competitors .highcharts-container-networkgraph .highcharts-point.without_keywords{ fill: #FFF; stroke-width: 2px; } #competitors .highcharts-container-networkgraph .highcharts-series-group .highcharts-networkgraph-series.highcharts-tracker{ stroke: #D8DBDD; } #competitors .highcharts-container-networkgraph .highcharts-data-label-hidden{ display: none; } #competitors .highcharts-container-packedbubble .highcharts-parentNode{ fill-opacity: 0.3; } #competitors .highcharts-container-packedbubble .highcharts-series-group .highcharts-halo{ visibility: hidden; } #competitors .highcharts-container-packedbubble .highcharts-series-group .highcharts-series-inactive{ opacity: 1; } #competitors .highcharts-container-packedbubble .highcharts-series-group .highcharts-series-inactive > .highcharts-point{ opacity: 0.2; } #competitors .highcharts-container-packedbubble .highcharts-series-group .highcharts-series > .highcharts-point:hover{ opacity: 1; } #competitors .highcharts-container-wordcloud .highcharts-series-group .highcharts-point{ cursor: pointer; } #competitors .highcharts-container-scatter .highcharts-point{ fill-opacity: 0.5; stroke: transparent; } #competitors .highcharts-container-scatter .highcharts-halo{ visibility: hidden; } #competitors .highcharts-container-scatter .highcharts-tooltip i.rect{ display: none; } #competitors.without-charts > .charts{ height: 420px; margin-top: -420px; margin-right: 0; margin-left: 0; } #competitors.without-charts > .charts > div{ opacity: 0; } #competitors .charts-opener{ background: url(../svg/circle.svg); } #competitors .charts-opener:hover, #competitors.without-charts .charts-opener{ filter:grayscale(100%); opacity: 0.5; } #competitors.without-charts .charts-opener:hover{ filter:grayscale(0%); opacity: 1; } @media only screen and (min-width: 900px){ .charts{ max-width: calc(100% - 16px - 16px) !important; } } @media only screen and (max-width: 900px){ #competitors > .charts{ border-radius: 0; border-right-color: transparent; border-left-color: transparent; border-top-color: transparent; margin-top: 0; margin-right: 0; margin-left: 0; margin-bottom: 6px; } #competitors > .charts .chart-wrapper{ border:none; width: 100%; padding-right: 0; } #competitors > .charts .chart-wrapper > .title .chart-type-selector .menu::-webkit-scrollbar{ width: 0; height: 0; } #competitors > .charts .chart-wrapper > .title .chart-type-selector a{ padding-right: 20px; margin-right: 0; font-size: 14px; } #competitors > .charts .chart-small-wrapper{ display: none; } #competitors > .charts .legend{ justify-content: left; } #competitors > .charts .legend i.rect{ width: 12px; } } #competitors > .table { background: #FFF; visibility: hidden; } .competitors_top_table:not(.top_table) { display: none; } .win_table .competitors_top_table { display: flex; } .competitors_top_table .preloader .preloader-window { top: 300px !important; } .competitors_top_table > .header > .title { flex-shrink: 100; } .competitors_top_table > .header > .total { margin: 0 5px; } #table_structure.competitors_top_table > .header > .filter-bar-opener:after, #table_structure_ads.competitors_top_table > .header > .filter-bar-opener:after, #table_domains_ads.competitors_top_table > .header > .filter-bar-opener:after { display: none } .competitors_top_table > .top_table_inner > .body { -webkit-overflow-scrolling: touch; } .competitors_top_table i a { cursor: pointer; } .competitors_top_table longlist.top_longlist_fixed_column { flex-grow: 0; } .competitors_top_table longlist_cell { position: relative; } .competitors_top_table longlist_cell[data-name].has_diff { text-align: right; } .competitors_top_table longlist_cell[data-name].has_diff > i.for_delta { padding-right: 15px; } .competitors_top_table longlist_cell[data-name].has_diff > i.diff { left: calc(100% - 25px); } .competitors_top_table longlist_cell[data-name="count_results"] { width: 130px; } .competitors_top_table longlist_cell[data-name="TRAFFIC()"], .competitors_top_table longlist_cell[data-name="TRAFFIC_VS()"] { width: 120px; } .competitors_top_table longlist_cell[data-name="MONTH_COST_RUB()"], .competitors_top_table longlist_cell[data-name="MONTH_COST_RUB_VS()"], .competitors_top_table longlist_cell[data-name="sum_month_cost_rub"] { width: 140px; } .competitors_top_table longlist_cell[data-name="keyword_name"], .competitors_top_table longlist_cell[data-name="elements"], .competitors_top_table longlist_cell[data-name^="domain"], .competitors_top_table longlist_cell[data-name^="url"], .competitors_top_table longlist_cell[data-name^="SNIPPET"], .competitors_top_table longlist_cell[data-name^="thematic_keyword_name"] { } .competitors_top_table longlist_cell[data-name="keyword_name"], .competitors_top_table longlist_cell[data-name="thematic_keyword_name"], .competitors_top_table longlist_cell[data-name^="domain"], .competitors_top_table longlist_cell[data-name^="url"] { width: 200px; white-space: normal; display: flex; } .competitors_top_table longlist_cell[data-name="keyword_name"] { width: 240px; } .competitors_top_table longlist_cell[data-name^="domain"] a, .competitors_top_table longlist_cell[data-name^="url"] a { max-width: 90%; max-height: 50px; word-break: break-all; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .competitors_top_table longlist_cell[data-name*="count_keywords"] { display: flex; align-items: center; } .competitors_top_table longlist_cell[data-name="count_keywords_exclusive"] { width: 120px; } .competitors_top_table longlist_cell[data-name="elements"], .competitors_top_table longlist_cell[data-name="BLOCK_POSITIONS()"], .competitors_top_table longlist_cell[data-name^="median_position"], .competitors_top_table longlist_cell[data-name^="avg_position_common"], .competitors_top_table longlist_cell[data-name^="median_position_common"] { width: 120px; } .competitors_top_table longlist_cell[data-name^="relevant"] { width: 150px; } .competitors_top_table longlist_cell[data-name="serp"] { text-align: center; text-transform: uppercase; } .competitors_top_table longlist longlist_cell[data-name] { background: inherit; } .competitors_top_table .on_hover_link { background: inherit; border-radius: 100%; padding: 5px; font-size: 12px; position: absolute; top: calc(50% - 10px); right: 0; filter: none; } .competitors_top_table .on_hover_link:hover { filter: none !important; } .competitors_top_table longlist_row:not(.top-hover) .on_hover_link { display: none; } .competitors_top_table.with-snippets .on_hover_link { top: 18px !important; } .competitors_top_table .on_hover_link > a { margin-left: 8px; } .competitors_top_table .diff { margin: -3px 0 0 3px; font-size: 10px; vertical-align: super; position: absolute; } .competitors_top_table .diff:before { margin: 0 1px 0 0; font-family: "Topvisor"; } .competitors_top_table .diff.up { color: #1ABC9C; } .competitors_top_table .diff.up:before { content: "\5b"; } .competitors_top_table .diff.down { color: #E74E3F; } .competitors_top_table .diff.down:before { content: "\78"; } .competitors_top_table .diff.in:before { content: "↑"; } .competitors_top_table .diff.out:before { content: "↓"; } #competitors:not(.without-charts) .competitors_top_table.chart_legend_enabled:not(.chart_legend_hidden) longlist_row { cursor: pointer; } .competitors_top_table .chart_legend { width: 16px; height: 16px; position: absolute; left: -16px; z-index: 1; display: block; } #competitors.without-charts .competitors_top_table .chart_legend, .competitors_top_table.chart_legend_hidden .chart_legend { display: none; } .competitors_top_table .chart_legend > i { border-radius: 100%; border: 1px solid #999; width: 6px; height: 6px; margin: 5px 0 5px 5px; display: inline-block; } .competitors_top_table .bar .chart_legend > i { border-color: #D8DBDD; } .competitors_top_table .chart_legend.active > i { border-width: 3px; } .competitors_top_table longlist_cell[data-name^="SNIPPET"] { width: 250px; max-width: 350px; flex-grow: 1; overflow: hidden; text-overflow: ellipsis; } .top_table_inner[data-has-scroll="1"] longlist_cell[data-name^="SNIPPET"] { max-width: 40vw; } .competitors_top_table.with-snippets longlist_row { align-items: flex-start; } .competitors_top_table.with-snippets .body longlist_cell { padding-top: 20px; align-items: flex-start; } .competitors_top_table.with-snippets .body longlist_cell[data-name^="SNIPPET"] { max-height: calc(100% + 15px); margin-top: -15px; overflow-y: auto; } .competitors_top_table .filter_bar longlist_cell[data-name^="SNIPPET"] { margin-left: auto; } .competitors_top_table .bar longlist_cell[data-name^="SNIPPET"], .competitors_top_table .body longlist_cell[data-name^="SNIPPET"] { padding-left: 10px; margin-left: auto; } .competitors_top_table .body longlist_cell[data-name="elements"], .competitors_top_table .body longlist_cell[data-name="BLOCK_POSITIONS()"] { white-space: normal; } .competitors_top_table .body longlist_cell[data-name="elements"] > a > i, .competitors_top_table .body longlist_cell[data-name="BLOCK_POSITIONS()"] > a > i { margin: 0 0 8px 8px; font-size: 16px; } .icon-serp-NULL { color: #CACFD5; } .icon-serp-object { color: #2A7DFB; } .icon-serp-calc { color: #008080; } .icon-serp-news { color: #04ADEF; } .icon-serp-map { color: #22B1C1; } .icon-serp-featuredSnippet { color: #FF5646; } .icon-serp-travel { color: #9013FE; } .icon-serp-videos { color: #BF02DF; } .icon-serp-images { color: #F91ECD; } .icon-serp-knowledge { color: #120B8F; } .icon-serp-definitions { color: #8CC453; } .icon-serp-relatedKeywords { color: #33CFA5; } .icon-serp-dictionary { color: #00936D; } .icon-serp-ads-top { color: #F97B28; } .icon-serp-ads-bottom { color: #B8081C; } .icon-serp-ads-goods { color: #FEC40A; } .icon-serp-media { color: #990066; } .icon-serp-menu { color: #1E90FF; } .icon-serp-recipe { color: #FF9900; } .icon-serp-health { color: #FA5787; } .icon-serp-food { color: #FF9900; } .icon-serp-yandex { color: #FF0000; } .icon-serp-interactive { color: #0CD6D5; } .icon-serp-consent { color: #FFE91B; } .icon-serp-goods { color: #6236FF; } #competitors .competitors_top_table[data-type="ads"] longlist_cell[data-name="count_keywords"] a { color: var(--color-bg-primary-1); } #competitors .competitors_top_table[data-type="serp"] longlist_cell[data-name="count_keywords_ads"] a { color: #FC8F34; } .competitors_top_table longlist_row.top-hover > .is_not_paymented { cursor: pointer; border-radius: 4px 0 0 4px; border: 1px dashed #B6D7FE; border-right: none; background: #EDF5FE; } .competitors_top_table longlist_row.top-hover > .is_not_paymented + .is_not_paymented { border-left: none; } .competitors_top_table longlist_row.top-hover > .is_not_paymented_last { border-radius: 0 4px 4px 0; border-right: 1px dashed #B6D7FE; } .competitors_top_table longlist_row > [data-open-type].is_not_paymented > i.icon-lock, .competitors_top_table longlist_row > [data-open-type].is_not_paymented > i.icon-serp-NULL { margin: 0 auto 0 8px; color: #ECEEEC; float: left; } .competitors_top_table longlist_row.top-hover > [data-open-type].is_not_paymented > i.icon-lock, .competitors_top_table longlist_row.top-hover > [data-open-type].is_not_paymented > i.icon-serp-NULL { margin-left: 7px; color: #B6D7FE; } .competitors_top_table longlist_row > [data-open-type].is_not_paymented + .is_not_paymented .icon-lock, .competitors_top_table longlist_row > [data-open-type].is_not_paymented + .is_not_paymented .icon-serp-NULL { display: none; } .competitors_top_table[data-type="ads"] longlist_row.top-hover longlist_cell.is_not_paymented + longlist_cell[data-name="count_keywords"] > .icon-serp-NULL { margin-left: 15px; } .competitors_top_table longlist_row longlist_cell[data-name="count_keywords_ads"] + longlist_cell[data-name="count_keywords"].is_not_paymented .icon-serp-NULL, .competitors_top_table longlist_row longlist_cell[data-name="count_keywords"] + longlist_cell[data-name="count_keywords_ads"].is_not_paymented .icon-serp-NULL { display: block !important; } .competitors_top_table longlist_row:not(.top-hover) > [data-open-type].is_not_paymented a { color: #808D9B !important; } .competitors_top_table[data-view="structure"] longlist_cell[data-name="url"] { width: 420px; } .competitors_top_table[data-intersection_is_paymented="0"] .popup_export .only_intersection { pointer-events: none; opacity: 0.5; } .competitors_top_table[data-intersection_is_paymented="0"] .popup_export .only_intersection [class*="icon"]:before { content: "K"; } .throbber-helix { transform: translateX(-50%); width: 150px; height: 150px; position: absolute; top: 0; left: 0; } .throbber-helix > .dot { width: 50%; position: absolute; top: 0; left: 0; transform-origin: 100%; backface-visibility: hidden; animation: helix-z-index 2s linear infinite; } .throbber-helix > .dot::after { content: ""; border-radius: 100%; background: var(--color-bg-primary-1); width: 8px; height: 8px; display: block; position: absolute; top: 50%; left: 0; backface-visibility: hidden; will-change: transform; animation: helix-dot 2s linear infinite; animation-delay: inherit; } .throbber-helix > .dot:nth-child(n + 37)::after { background: #FC9F3A; } @keyframes helix-dot { 0% { transform: translateY(-50%) translateX(0) scale(1); animation-timing-function: ease-in; } 25% { transform: translateY(-50%) translateX(100%) scale(1.2); animation-timing-function: ease-out; } 50% { transform: translateY(-50%) translateX(200%) scale(1); animation-timing-function: ease-in; border-radius: 0; opacity: 0.3; } 75% { transform: translateY(-50%) translateX(100%) scale(0.8); animation-timing-function: ease-out; } 100% { transform: translateY(-50%) translateX(0) scale(1); } } @keyframes helix-z-index { 0% { z-index: 1; } 49% { z-index: 1; } 50% { z-index: -1; } 100% { z-index: -1; } } @media only screen and (max-width: 900px) { #competitors > .table { padding: 0; } #competitors .top_table > .header > .filter-bar-opener:after { display: none } .competitors_top_table { margin: 12px 0 0 0; } .competitors_top_table:not(.fixed_float_active) { margin-top: -8px; } .competitors_top_table > .header > .title { display: none; } .competitors_top_table > .top_table_inner > .body.top-scroll-for-touch ~ .top-scroll-bar { display: none !important; } .competitors_top_table longlist_row { font-size: 12px; } .competitors_top_table .top_table_border { border-radius: 0 !important; border-right: none !important; border-left: none !important; } .competitors_top_table .top_table_border:before, .competitors_top_table .top_table_border:after { display: none; } .competitors_top_table .top-snippet-title { font-size: 13px; } .competitors_top_table .top-snippet-url { font-size: 12px; } .competitors_top_table .top-snippet-body { font-size: 10px; line-height: 15px; } } .competitors-table-big-bar { min-width: 450px; padding: 1px 0; margin: 0; display: flex; flex-wrap: nowrap; overflow-x: auto; } .competitors-table-big-bar::-webkit-scrollbar { width: 0; height: 4px; } .competitors-table-big-bar .title { margin: auto 10px auto 0; } .competitors-table-summary .top-radioSwitcher { margin-right: 10px; overflow: visible; justify-content: space-between; } .competitors-table-summary .top-radioSwitcher:last-child { margin-right: 0; } .competitors-table-summary .top-radioSwitcher > i { width: auto; } .competitors-table-summary .top-radioSwitcher > i.active > * { color: var(--white) !important; } .competitors-table-summary .top-radioSwitcher > i > *:first-child { margin: 0 6px 0 0; } .competitors-table-summary .dynamics { min-width: 225px; } .competitors-table-summary .tops { min-width: 335px; } .competitors-table-summary .coverage { min-width: 150px; } .top-radioSwitcher > i[data-metric="up"] > i:first-child { color: #36D4B3; } .top-radioSwitcher > i[data-metric="down"] > i:first-child { color: #E74E3F; } .top-radioSwitcher > i[data-metric="stay"] > i:first-child { color: #BDC3C7; } .top-radioSwitcher > i[data-metric="1-3"] > b { color: #9013FE; } .top-radioSwitcher > i[data-metric="1-10"] > b { color: #04ADEF; } .top-radioSwitcher > i[data-metric="11-30"] > b { color: #36D4B3; } .top-radioSwitcher > i[data-metric="31-50"] > b { color: #FED416; } .top-radioSwitcher > i[data-metric="in"] > i:first-child { color: #1289D9; } .top-radioSwitcher > i[data-metric="out"] > i:first-child { color: #AB47BC; } .top-radioSwitcher > i[data-metric="is_phrase"] > i:first-child { color: var(--color-bg-primary-1); } .top-radioSwitcher > i[data-metric="is_order"] > i:first-child { color: var(--color-cyan); } .top-radioSwitcher > i[data-metric="is_strict"] > i:first-child { color: var(--color-bg-negative-1); } .top-radioSwitcher > i[data-metric="is_question"] > i:first-child { color: var(--color-bg-positive-1); } .top-radioSwitcher.wordstat > i { text-indent: 4px; } @media only screen and (max-width: 900px) { .competitors_top_table .header > .title, #competitors > .table .header > .total { display: none; } .competitors_top_table.with-big-bar .header .filter-bar-opener { order: 0; } .competitors_top_table { --top-table-fixed-columns-width: 50vw !important; } .competitors_top_table longlist_cell[data-name="url"] { max-width: 50vw !important; } .competitors_top_table.with-big-bar .header .competitors-table-big-bar { margin: 0 0 -6px 0; padding-bottom: 4px; } .competitors_top_table.with-big-bar .header .competitors-table-big-bar::before, .competitors_top_table.with-big-bar .header .competitors-table-big-bar::after { display: none; } .competitors-table-big-bar { width: calc(100% + 12px); min-width: 0; order: 1 !important; } .competitors-table-big-bar:before { content: " "; min-width: 24px; } .competitors-table-big-bar:after { content: " "; min-width: 24px; } } .win_table { width: 1300px !important; max-width: 100vw; height: calc(100vh - 20px) !important; } .win_table .modal-body { max-height: 100%; } .win_table#win_table_domains_keywords { width: 1480px !important; } .win_table#win_table_leaders_keywords { width: 1040px !important; } .win_table#win_table_serp .competitors_top_table .header { display: none; } .win_table .competitors_top_table { overflow: hidden; } .win_table .competitors_top_table { height: 100% !important; margin: 0; } .win_table .competitors_top_table > .header > .top_table_border, .win_table .competitors_top_table > .footer { display: none; } .win_table .competitors_top_table > .top_table_inner { border: none; margin-bottom: 0; } .win_table .competitors_top_table > .top_table_inner [data-name^="DUMMY"] { border: none; } .win_table .competitors_top_table > .top_table_inner [data-name="DUMMY_VS()"] { flex-grow: 0 !important; } .win_table .competitors_top_table > .top_table_inner [data-name="DUMMY()"] ~ i, .win_table .competitors_top_table > .top_table_inner [data-name="DUMMY_VS()"] ~ i { flex-grow: 1; } .win_table .competitors_top_table .on_hover_link { background: #FFF; } .win_table .competitors_top_table.with_tabs_vs .header { border: none; } .win_table .competitors_top_table.with_tabs_vs [data-name^="url"] { width: 80px; text-align: center; justify-content: center; } .win_table .competitors_top_table.with_tabs_vs [data-name^="url"] a { margin-left: 4px; color: var(--color-text-3); } .win_table .competitors_top_table.with_tabs_vs [data-name^="SNIPPET"] { max-width: 1200px; } .win_table .competitors_top_table.with_tabs_vs [data-name^="SNIPPET"] > * { max-width: 350px; } .win_table .competitors_top_table.with_tabs_vs .filter_bar [data-name^="url"] > i { display: none; } .win_table .competitors_top_table.with_tabs_vs .body [data-name^="url"] { font-size: 14px; } .win_table .competitors_top_table .chart_legend { display: none !important; } .popup_domains_keywords_rel { min-width: 40%; } .popup_domains_keywords_rel ul li { flex-grow: 1; position: relative; } .popup_domains_keywords_rel ul [data-rel-vs] .logo { width: 16px; height: 16px; margin: 0 6px 0 0; display: inline-block; } .popup_domains_keywords_rel ul [data-rel-vs="exclusive_me"] .logo { background: url("../svg/exclusive_me.svg"); } .popup_domains_keywords_rel ul [data-rel-vs="me"] .logo { background: url("../svg/me.svg"); } .popup_domains_keywords_rel ul [data-rel-vs="common"] .logo { background: url("../svg/common.svg"); } .popup_domains_keywords_rel ul [data-rel-vs="competitor"] .logo { background: url("../svg/competitor.svg"); } .popup_domains_keywords_rel ul [data-rel-vs="exclusive_competitor"] .logo { background: url("../svg/exclusive_competitor.svg"); } .competitors_domains_keywords_legend { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .competitors_domains_keywords_legend > i { cursor: default; color: var(--color-blue-dd); font-size: 14px; } .competitors_domains_keywords_legend > i:first-child { margin: 0 20px 0 0; } .competitors_domains_keywords_legend > i:before { content: " "; border-radius: 2px; width: 20px; height: 4px; margin: 0 8px 0 0; background: #FED416; display: inline-block; vertical-align: middle; } .competitors_domains_keywords_legend .competitor:before { background: #93D24B; } .win_table .top-radioSwitcher { margin: 0 8px 0 0; } .win_table .competitors_top_table .switch_snippets i { border-radius: 3px; height: auto; padding: 5px; color: var(--color-text-4); font-size: 14px; } .win_table .competitors_top_table .switch_snippets.active i:first-child, .win_table .competitors_top_table .switch_snippets:not(.active) i:last-child { background: #F6FCFF; color: var(--color-cyan); } .win_table .competitors_top_table.with_tabs_vs .bar, .win_table .competitors_top_table.with_tabs_vs .filter_bar, .win_table .competitors_top_table.with_tabs_vs longlist_row { background: none; } .win_table .competitors_top_table.with_tabs_vs .body { background: inherit; } .win_table .competitors_top_table.with_tabs_vs.with_tabs_vs .top_table_fixed_column_cell, .win_table .competitors_top_table.with_tabs_vs.with_tabs_vs .top_longlist_fixed_column, .win_table .competitors_top_table.with_tabs_vs.with_tabs_vs .top_longlist_fixed_column_cell { background: #FFF; } .win_table .competitors_top_table.with_tabs_vs { --top-table-bar-height: 40px; } .win_table .with_tabs_vs .top_table_inner { background-attachment: local !important; } .win_table .with_tabs_vs .top_table_inner > .bar { height: var(--top-table-bar-height); margin-top: var(--top-table-bar-height); } .win_table .with_tabs_vs .top_table_inner > .filter_bar { background: #FFF; margin-top: var(--top-table-bar-height); } .win_table .with_tabs_vs .top_table_inner > .body { margin-top: calc(var(--top-table-bar-height) * 2); } .win_table .with_tabs_vs.i-show-filters .top_table_inner > .body { margin-top: calc(var(--top-table-bar-height) * 3) !important; } .win_table .top_table_inner > .bar_additional { cursor: default; background: #FFF; height: var(--top-table-bar-height); } .win_table .top_table_inner .bar_additional .title_wrapper { font-size: 14px; position: sticky; left: 0; z-index: 2; display: flex; align-items: center; white-space: nowrap; } .win_table .top_table_inner .bar_additional .title_wrapper > i { padding: 0 var(--top-table-cell-padding-h); } .win_table .top_table_inner .bar_additional .title_wrapper .filter-bar-opener { cursor: pointer; } .win_table .top_table_inner .bar_additional .title_wrapper .title { border-radius: 3px 3px 0 0; background: #fff; height: var(--top-table-bar-height); margin-right: auto; text-overflow: ellipsis; overflow: hidden; line-height: var(--top-table-bar-height); } .win_table .top_table_inner .bar_additional > .tab { border-radius: 8px 8px 0 0; height: var(--top-table-bar-height); color: #565656; font-size: 14px; font-weight: 400; text-align: center; line-height: var(--top-table-bar-height); text-overflow: ellipsis; overflow: hidden; z-index: 1; } .win_table .top_table_inner .bar_additional > .tab-me { background: #FFEF8A; } .win_table .top_table_inner .bar_additional > .tab-vs { background: #B8E986; margin: 0 0 0 1px; } .win_table .with_tabs_vs .top_table_inner .bar { border-top: 1px solid var(--color-line-2); } @media only screen and (min-width: 900px) { .win_table .modal-body { padding: 0; } .win_table .competitors_top_table > .header { padding: 30px 0; } [data-top-popup="#popup_domains_keywords_rel"], [data-top-popup="#popup_leaders_keywords_rel"] { display: none !important; } .popup_domains_keywords_rel { display: block; } .popup_domains_keywords_rel ul.top-popup_content { border-radius: 8px; border: 1px solid var(--color-line-2); padding: 4px; margin: 0 10px 0 0; font-size: 14px; list-style: none; display: flex; flex-direction: row; gap: 0; } .popup_domains_keywords_rel ul.top-popup_content [data-rel-vs] { cursor: pointer; border-radius: 6px; min-width: 50px; padding: 0 6px !important; margin: 0 1px; line-height: 20px !important;; display: flex; align-items: center; flex-grow: 1; } .popup_domains_keywords_rel ul.top-popup_content [data-rel-vs]:not(:last-child) { margin: 0 16px 0 0; } .popup_domains_keywords_rel ul.top-popup_content [data-rel-vs]:hover { background: #ECF5FF; } .popup_domains_keywords_rel ul.top-popup_content [data-rel-vs].active { background: var(--color-bg-primary-1) !important; color: #FFF !important; } .popup_domains_keywords_rel ul.top-popup_content [data-rel-vs].active .logo { filter: brightness(0) invert(100%); } } @media only screen and (max-width: 900px) { .popup_domains_keywords_rel ul [data-rel-vs] { white-space: nowrap; display: flex !important; } .popup_domains_keywords_rel ul [data-rel-vs] .logo { margin-right: 14px; vertical-align: top; } .popup_domains_keywords_rel ul [data-rel-vs] .title { max-width: 80%; overflow: hidden; text-overflow: ellipsis; } .popup_domains_keywords_rel ul .count { margin-left: auto; color: #94a5a6; } .popup_domains_keywords_rel ul [data-rel-vs] .count:before { content: "("; } .popup_domains_keywords_rel ul [data-rel-vs] .count:after { content: ")"; } .win_table .competitors_top_table { height: calc(100% + 12px); margin: 0; } .win_table .competitors_top_table .header { min-height: calc(50px + 30px); margin: 10px 0 5px 0; flex-wrap: wrap; } .win_table .competitors_top_table .header:before { display: none; } .win_table .competitors_top_table .header .filter-bar-opener { margin: 0 14px; order: 45; } [data-top-popup="#popup_domains_keywords_rel"], [data-top-popup="#popup_leaders_keywords_rel"] { border-radius: 16px; border: 1px solid var(--color-line-2); width: 100%; height: 32px; padding: 0 28px 0 14px; margin: 0 12px; position: relative; flex-grow: 1; order: 40 !important; } [data-top-popup="#popup_domains_keywords_rel"] > .label, [data-top-popup="#popup_leaders_keywords_rel"] > .label { width: 100%; height: 100%; font-size: 13px; line-height: 32px; display: block; overflow: hidden; text-overflow: ellipsis; } [data-top-popup="#popup_domains_keywords_rel"] > [class*="icon"], [data-top-popup="#popup_leaders_keywords_rel"] > [class*="icon"] { position: absolute; top: calc(50% - 4px); right: 14px; font-size: 12px !important; } }