MediaWiki:Common.css
Nota: Após publicar, você pode ter que limpar o "cache" do seu navegador para ver as alterações.
- Firefox / Safari: Pressione Shift enquanto clica Recarregar, ou pressione Ctrl-F5 ou Ctrl-R (⌘-R no Mac)
- Google Chrome: Pressione Ctrl-Shift-R (⌘-Shift-R no Mac)
- Internet Explorer/Edge: PressioneCtrl enquanto clica Recarregar, ou Pressione Ctrl-F5
- Opera: Pressione Ctrl-F5.
/** o código CSS colocado aqui será aplicado a todos os temas */ @import url("https://fonts.googleapis.com/css?family=Roboto:400,500,700,900"); @import url("https://fonts.googleapis.com/css?family=Exo:400,600,700,800"); * { margin: 0; padding: 0; border: none; outline: none; box-sizing: border-box } h1, h2, h3, h4, h5, h6, p, a { line-height: 1em } a { text-decoration: none } ul, ol { list-style: none } figure>figcaption { display: none } figure>img { width: 100% } .form-box-heading .form-box-heading-title, .banner-title, .post-preview.huge .post-preview-title, .post-open .post-open-title.big, .error-display .error-title, .streamer-overview .streamer-info .streamer-info-name, .contact-section .contact-section-title, .sponsors-title, .order-result-banner .order-result-banner-title, .post-open .post-open-title, .banner .banner-title, .post-preview.picture.big .post-preview-overlay .post-preview-title, .post-preview.large .post-preview-title, .post-open .post-open-title.small, .reviews-wrap .reviews-header .reviews-header-title, .post-preview.big .post-preview-title, .topic-comment .topic-comment-content .topic-comment-quote:before, .widget-team-vs .widget-team-vs-item .team-score, .match-stats .match-score, .widget-stat-info-wrap .widget-stat-info-number, .countdown-text, .topic-wrap .topic-header .topic-title, .reviews-wrap .reviews-body .reviews-body-title, .post-preview.landscape.big .post-preview-title, .post-preview.medium .post-preview-title, .promo-banner .promo-banner-info .promo-banner-title, .section-slider-bg .section-slider-title, .stats-info-item .stats-info-item-value, .form-box-heading .form-box-heading-subtitle, .product-open .product-name, .post-preview-title, .error-display .error-subtitle, .post-preview.video.no-hover .post-preview-title, .post-comment .post-comment-username, .video-info-slider-items .video-info-slider-item .video-info-slider-title, .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-username, .profile-user .profile-user-name, .user-review .user-review-title, .order-result-banner .order-result-banner-text, .post-open .quote-text, .subscribe-section .subscribe-section-title, .sponsor-info .sponsor-info-title, .faq-item .faq-item-trigger .faq-item-title, .widget-medals .widget-medals-info .widget-medals-title, .badge-item .badge-item-title, .post-open .post-open-text.bold, .skill-loot-list .skill-loot-item-info .skill-loot-item-title, .badge-info, .page-navigation .page-navigation-item, .timestamp-tag, .filter-heading .filter-heading-text, .account-info-wrap .account-info-name, .ban-list-wrap .ban-list-title, .character-selection-list .character-selection-list-text, .ticket-wrap .ticket-info .ticket-title, .ticket-wrap .ticket-teams .ticket-teams-text, .ticket-wrap .ticket-buy-button, .order-item .order-header .order-header-item, .sponsor-item .sponsor-item-link, .faq-item .faq-item-footer .faq-item-footer-text, .bubble-ornament .bubble-ornament-info, .bubble-ornament .bubble-ornament-text, .tag-quantity .tag-quantity-text, .button-replay, .decorated-link, .link-text-form, .inventory-bag-preview .items-in-inventory, .inventory-bag-preview .inventory-subtotal, .dropdown-simple-wrap .dp-option-text, .widget-title-wrap .widget-title, .widget-title-wrap .widget-text.bold, .widget-title-wrap .stats-reference .stat-reference .stat-reference-text, .widget-overflow-wrap .widget-overflow-list .widget-overflow-list-text, .widget-match-box-item .widget-match-box-link, .widget-info-box .widget-info-box-item .widget-info-title, .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title, .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value, .widget-simple-stat .widget-simple-stat-header .widget-simple-stat-header-title, .events-preview .event-preview-header .event-preview-header-text, .team-score-boxes-title-wrap .team-score-box-title, .team-score-boxes .team-score-box .team-score-box-text, .table.order-overview .table-row-item .product-category, .table-row-header-item .table-row-header-title, .table-row-item .table-text.bold, .table-row-item .table-text-link, .match-stats .match-link, .product-open .product-category-wrap .product-stock, .product-open .product-info-list .product-info-list-item, .product-feature .product-feature-info .product-feature-title, .arc-rate-wrap .arc-rate-stat, .countdown-text-wrap .countdown-text-heading, .bar-progress-info, .bar-progress-text, .xm-tooltip .xm-tooltip-text, .calendar .calendar-header .calendar-header-bottom .calendar-week-day, .promo-banner .promo-banner-info .promo-banner-text, .option-list .option-list-item, .user-dropdown .user-dropdown-header .user-dropdown-header-text, .topic-comment .topic-comment-user .topic-comment-user-text, .profile-user .profile-user-info, .notification-item .notification-item-text, .user-review .user-review-info, .inventory-open-header .inventory-open-header-title, .information-header .information-header-title, .inventory-compare .inventory-compare-title, .contact-info-preview .contact-info-preview-email-wrap .contact-info-preview-email, .shortcode-section .shortcode-section-title, .shortcode-color .shortcode-color-code, .team-info-wrap .team-info .team-name, .information-rows .information-row .information-row-item .information-row-item-text, .button-social, .dropdown-inner-list .dropdown-inner-list-item .dropdown-inner-list-item-title, .dropdown-inner-list .dropdown-inner-list-item .dropdown-inner-list-item-value, .mobile-dropdown-item>.mobile-dropdown-item-link, .widget-match-result .widget-match-result-actions .widget-match-result-action, .widget-match-result .widget-match-result-item .match-score, .widget-match-result .widget-match-result-item .match-datetime, .mvp-stats .mvp-stat .mvp-stat-title, .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title, .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value, .widget-stat-info-wrap .widget-stat-info .widget-stat-info-title, .events-preview .event-preview-item .event-preview-item-timestamp, .events-preview .event-preview-item .event-preview-item-content .event-preview-item-title, .table-row-item .table-text.bolder, .featured-info .featured-info-text, .arc-stats-wrap .arc-stats-info .arc-stats-stat, .promo-banner .promo-banner-info .promo-banner-pre-title, .forum-category-wrap .forum-category-subcategories .forum-category-subcategory, .forum-post-link, .forum-category-text, .inventory-open-action .inventory-open-row-text, .inventory-open-total .inventory-open-row-text, .information-box .information-box-message, .information-box .information-box-action, .featured-stat-wrap .featured-stat-title, .order-item .order-body .order-body-item .order-body-item-title, .bio-item .bio-item-title, .stats-info-item .stats-info-item-description .stats-info-item-description-title, .contact-item .contact-item-text, .form-box-wrap .tab-form-buttons .tab-form-button, .widget-top-player .top-player-info-wrap .top-player-info .top-player-name, .tweets-preview-widget-item .tweets-prevew-widget-item-user, .comment-preview .comment-preview-title, .poll-widget .poll-widget-title, .stream-preview .stream-preview-streamer .stream-preview-streamer-name, .team-score-boxes .team-score-box .team-points, .medal-list .medal-list-item .medal-list-item-title, .overview-info-wrap .overview-info-item .overview-info-item-text, .table.order-overview .table-row-item .product-name, .post-preview.video.tiny .post-preview-title, .post-preview.video.large .post-preview-overlay .post-preview-overlay-info .post-preview-text, .post-preview.tiny .post-preview-title, .product-open .product-category-wrap .product-category, .product-feature .product-feature-info .product-feature-text, .progress-bar .progress-bar-text, .tab-wrap .tab-header .tab-header-item .tab-header-item-text, .calendar .calendar-header .calendar-header-top .calendar-month-year, .topic-wrap .topic-footer .topic-footer-info .topic-footer-text, .topic-comment .topic-comment-content .topic-comment-quote .topic-comment-quote-user .topic-comment-quote-user-name, .topic-comment-reply-user .topic-comment-reply-name, .topic-link-item .topic-link-item-title, .user-link-item .user-link-item-title, .activity-item .activity-item-row .activity-item-title, .notification-item.medium .notification-item-text, .reviews-wrap .reviews-header .reviews-header-rating .reviews-header-rating-text, .rating-block .rating-block-title, .contact-info-preview .contact-info-preview-sign .contact-info-preview-sign-text, .shortcode-font .shortcode-font-family, .shortcode-font .shortcode-font-weight, .mobile-menu-item>.mobile-menu-item-link, .product-preview-title, .account-info-wrap .account-info-username, .account-info-wrap .account-info-stats .account-info-stat .account-info-stat-value, .player-preview .player-preview-info .player-preview-nickname, .widget-top-player .top-player-stats .top-player-stat .top-player-stat-title, .live-news-widget .live-news-widget-title-wrap .live-news-widget-title, .widget-slider-items .widget-slider-item .widget-slider-item-title, .widget-calendar-row .calendar-row-wrap .calendar-row-items .calendar-row-item .calendar-row-item-day, .post-preview.video .post-preview-title, .post-preview.small .post-preview-title, .forum-category-wrap .forum-category-title, .topic-wrap .topic-scroll-wrap .topic-scroll .topic-scroll-info .topic-scroll-counter, .post-preview.picture.short .post-preview-overlay .post-preview-title, .user-avatar-wrap .user-avatar-text, .user-avatar-wrap .user-avatar-decoration .user-avatar-decoration-text, .widget-top-player .top-player-info-wrap .top-player-info .top-player-flag, .stream-start-counter, .account-info-wrap .account-info-stats .account-info-stat .account-info-stat-title, .ticket-wrap .ticket-info .ticket-text, .table-row-item .table-text, .match-stats .match-time, .calendar .calendar-body .calendar-day .event-list .event-item, .text-heading, .post-open .post-open-subtitle, .post-open .feature-list .feature-list-item .feature-title, .post-open .review-wrap .review-score-wrap .review-score-number, .post-open .review-wrap .review-score-wrap .review-score-text, .section-title-wrap .section-title, .shortcode-font .shortcode-font-demo { display: block; font-family: "Exo", sans-serif; font-weight: 700; text-transform: uppercase; line-height: 1em } .form-box-heading .form-box-heading-title { font-size: 5.375em } .error-display .error-title, .streamer-overview .streamer-info .streamer-info-name, .contact-section .contact-section-title, .sponsors-title, .order-result-banner .order-result-banner-title { font-size: 3.25em } .banner-title, .post-preview.huge .post-preview-title, .post-open .post-open-title.big { font-size: 3.125em; line-height: 1.04em } .banner .banner-title { font-size: 2.5em } .post-open .post-open-title { font-size: 2.5em; line-height: 1.15em } .post-preview.picture.big .post-preview-overlay .post-preview-title, .post-preview.large .post-preview-title, .post-open .post-open-title.small, .reviews-wrap .reviews-header .reviews-header-title { font-size: 2.25em; line-height: 1.1666666667em } .topic-comment .topic-comment-content .topic-comment-quote:before { font-size: 2em } .post-preview.big .post-preview-title { font-size: 1.875em; line-height: 1.1333333333em } .stats-info-item .stats-info-item-value, .form-box-heading .form-box-heading-subtitle, .product-open .product-name { font-size: 1.75em } .post-preview.landscape.big .post-preview-title, .post-preview.medium .post-preview-title, .promo-banner .promo-banner-info .promo-banner-title, .section-slider-bg .section-slider-title { font-size: 1.625em; line-height: 1.2307692308em } .widget-stat-info-wrap .widget-stat-info-number, .countdown-text, .topic-wrap .topic-header .topic-title, .reviews-wrap .reviews-body .reviews-body-title { font-size: 1.5em } .widget-team-vs .widget-team-vs-item .team-score, .match-stats .match-score { font-size: 1.375em } .subscribe-section .subscribe-section-title, .sponsor-info .sponsor-info-title, .faq-item .faq-item-trigger .faq-item-title, .widget-medals .widget-medals-info .widget-medals-title, .badge-item .badge-item-title { font-size: 1.125em } .post-open .post-open-text.bold { font-size: 1.125em; line-height: 1.6666666667em } .post-preview-title, .error-display .error-subtitle, .post-preview.video.no-hover .post-preview-title, .post-comment .post-comment-username, .video-info-slider-items .video-info-slider-item .video-info-slider-title, .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-username, .profile-user .profile-user-name, .user-review .user-review-title, .order-result-banner .order-result-banner-text { font-size: 1em; line-height: 1.375em } .post-open .quote-text { font-size: 1em; line-height: 1.75em } .product-preview-title, .account-info-wrap .account-info-username, .account-info-wrap .account-info-stats .account-info-stat .account-info-stat-value, .player-preview .player-preview-info .player-preview-nickname, .widget-top-player .top-player-stats .top-player-stat .top-player-stat-title, .live-news-widget .live-news-widget-title-wrap .live-news-widget-title, .widget-slider-items .widget-slider-item .widget-slider-item-title, .widget-calendar-row .calendar-row-wrap .calendar-row-items .calendar-row-item .calendar-row-item-day, .post-preview.video .post-preview-title, .post-preview.small .post-preview-title, .forum-category-wrap .forum-category-title, .topic-wrap .topic-scroll-wrap .topic-scroll .topic-scroll-info .topic-scroll-counter { font-size: .875em; line-height: 1.4285714286em } .post-preview.picture.short .post-preview-overlay .post-preview-title { font-size: .875em; line-height: 1.2857142857em } .error-display .error-text, .post-open .post-open-text, .post-comment .post-comment-text { font-size: .875em; line-height: 1.8571428571em } .mobile-menu-item>.mobile-menu-item-link { font-size: .8125em } .featured-stat-wrap .featured-stat-title, .order-item .order-body .order-body-item .order-body-item-title, .bio-item .bio-item-title, .stats-info-item .stats-info-item-description .stats-info-item-description-title, .contact-item .contact-item-text, .form-box-wrap .tab-form-buttons .tab-form-button, .widget-top-player .top-player-info-wrap .top-player-info .top-player-name, .tweets-preview-widget-item .tweets-prevew-widget-item-user, .comment-preview .comment-preview-title, .poll-widget .poll-widget-title, .stream-preview .stream-preview-streamer .stream-preview-streamer-name, .team-score-boxes .team-score-box .team-points, .medal-list .medal-list-item .medal-list-item-title, .overview-info-wrap .overview-info-item .overview-info-item-text, .table.order-overview .table-row-item .product-name, .post-preview.video.tiny .post-preview-title, .post-preview.video.large .post-preview-overlay .post-preview-overlay-info .post-preview-text, .post-preview.tiny .post-preview-title, .product-open .product-category-wrap .product-category, .product-feature .product-feature-info .product-feature-text, .progress-bar .progress-bar-text, .tab-wrap .tab-header .tab-header-item .tab-header-item-text, .calendar .calendar-header .calendar-header-top .calendar-month-year, .topic-wrap .topic-footer .topic-footer-info .topic-footer-text, .topic-comment .topic-comment-content .topic-comment-quote .topic-comment-quote-user .topic-comment-quote-user-name, .topic-comment-reply-user .topic-comment-reply-name, .topic-link-item .topic-link-item-title, .user-link-item .user-link-item-title, .activity-item .activity-item-row .activity-item-title, .notification-item.medium .notification-item-text, .reviews-wrap .reviews-header .reviews-header-rating .reviews-header-rating-text, .rating-block .rating-block-title, .contact-info-preview .contact-info-preview-sign .contact-info-preview-sign-text, .shortcode-font .shortcode-font-family, .shortcode-font .shortcode-font-weight { font-size: .75em; line-height: 1.3333333333em } .team-info-wrap .team-info .team-name, .information-rows .information-row .information-row-item .information-row-item-text, .button-social, .dropdown-inner-list .dropdown-inner-list-item .dropdown-inner-list-item-title, .dropdown-inner-list .dropdown-inner-list-item .dropdown-inner-list-item-value, .mobile-dropdown-item>.mobile-dropdown-item-link, .widget-match-result .widget-match-result-actions .widget-match-result-action, .widget-match-result .widget-match-result-item .match-score, .widget-match-result .widget-match-result-item .match-datetime, .mvp-stats .mvp-stat .mvp-stat-title, .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title, .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value, .widget-stat-info-wrap .widget-stat-info .widget-stat-info-title, .events-preview .event-preview-item .event-preview-item-timestamp, .events-preview .event-preview-item .event-preview-item-content .event-preview-item-title, .table-row-item .table-text.bolder, .featured-info .featured-info-text, .arc-stats-wrap .arc-stats-info .arc-stats-stat, .promo-banner .promo-banner-info .promo-banner-pre-title, .forum-category-wrap .forum-category-subcategories .forum-category-subcategory, .forum-post-link, .forum-category-text, .inventory-open-action .inventory-open-row-text, .inventory-open-total .inventory-open-row-text, .information-box .information-box-message, .information-box .information-box-action { font-size: .6875em } .skill-loot-list .skill-loot-item-info .skill-loot-item-title, .badge-info, .page-navigation .page-navigation-item, .timestamp-tag, .filter-heading .filter-heading-text, .account-info-wrap .account-info-name, .ban-list-wrap .ban-list-title, .character-selection-list .character-selection-list-text, .ticket-wrap .ticket-info .ticket-title, .ticket-wrap .ticket-teams .ticket-teams-text, .ticket-wrap .ticket-buy-button, .order-item .order-header .order-header-item, .sponsor-item .sponsor-item-link, .faq-item .faq-item-footer .faq-item-footer-text, .bubble-ornament .bubble-ornament-info, .bubble-ornament .bubble-ornament-text, .tag-quantity .tag-quantity-text, .button-replay, .decorated-link, .link-text-form, .inventory-bag-preview .items-in-inventory, .inventory-bag-preview .inventory-subtotal, .dropdown-simple-wrap .dp-option-text, .widget-title-wrap .widget-title, .widget-title-wrap .widget-text.bold, .widget-title-wrap .stats-reference .stat-reference .stat-reference-text, .widget-overflow-wrap .widget-overflow-list .widget-overflow-list-text, .widget-match-box-item .widget-match-box-link, .widget-info-box .widget-info-box-item .widget-info-title, .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title, .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value, .widget-simple-stat .widget-simple-stat-header .widget-simple-stat-header-title, .events-preview .event-preview-header .event-preview-header-text, .team-score-boxes-title-wrap .team-score-box-title, .team-score-boxes .team-score-box .team-score-box-text, .table.order-overview .table-row-item .product-category, .table-row-header-item .table-row-header-title, .table-row-item .table-text.bold, .table-row-item .table-text-link, .match-stats .match-link, .product-open .product-category-wrap .product-stock, .product-open .product-info-list .product-info-list-item, .product-feature .product-feature-info .product-feature-title, .arc-rate-wrap .arc-rate-stat, .countdown-text-wrap .countdown-text-heading, .bar-progress-info, .bar-progress-text, .xm-tooltip .xm-tooltip-text, .calendar .calendar-header .calendar-header-bottom .calendar-week-day, .promo-banner .promo-banner-info .promo-banner-text, .option-list .option-list-item, .user-dropdown .user-dropdown-header .user-dropdown-header-text, .topic-comment .topic-comment-user .topic-comment-user-text, .profile-user .profile-user-info, .notification-item .notification-item-text, .user-review .user-review-info, .inventory-open-header .inventory-open-header-title, .information-header .information-header-title, .inventory-compare .inventory-compare-title, .contact-info-preview .contact-info-preview-email-wrap .contact-info-preview-email, .shortcode-section .shortcode-section-title, .shortcode-color .shortcode-color-code { font-size: .625em } .account-info-wrap .account-info-stats .account-info-stat .account-info-stat-title, .ticket-wrap .ticket-info .ticket-text, .table-row-item .table-text, .match-stats .match-time, .calendar .calendar-body .calendar-day .event-list .event-item { font-size: .5625em } .user-avatar-wrap .user-avatar-text, .user-avatar-wrap .user-avatar-decoration .user-avatar-decoration-text, .widget-top-player .top-player-info-wrap .top-player-info .top-player-flag, .stream-start-counter { font-size: .5em } .post-preview-title { color: #363636 } .product-preview-title { color: #363636; line-height: 1em } .layout-content-1 { padding: 60px 0 100px; grid-template-areas: 'body sidebar'; position: relative } .layout-content-1 .layout-body { grid-area: body } .layout-content-1 .layout-sidebar { grid-area: sidebar } .layout-content-2 { padding: 60px 0; grid-template-areas: 'sidebar1 body sidebar2'; position: relative } .layout-content-2 .layout-sidebar1 { grid-area: sidebar1 } .layout-content-2 .layout-body { grid-area: body } .layout-content-2 .layout-sidebar2 { grid-area: sidebar2 } .layout-content-3 { padding: 60px 0; grid-template-areas: 'body1 body2 body3'; justify-content: center } .layout-content-3 .layout-body1 { grid-area: body1 } .layout-content-3 .layout-body2 { grid-area: body2 } .layout-content-3 .layout-body3 { grid-area: body3 } .layout-content-4 { padding: 60px 0 100px; grid-template-areas: 'sidebar body' } .layout-content-4 .layout-body { grid-area: body } .layout-content-4 .layout-sidebar { grid-area: sidebar } .layout-content-4.v2 { padding: 0 } .layout-content-5 { padding-top: 60px; grid-template-areas: 'sidebar body' } .layout-content-5 .layout-body { grid-area: body } .layout-content-5 .layout-sidebar { grid-area: sidebar } .layout-content-full { padding: 60px 0 100px } .layout-content-full.v2 { padding: 60px 0 0 } .layout-item, .layout-item-1-1-1, .layout-item-1-1-1_2, .layout-item-1-2-1, .layout-item-1-3, .layout-item-1-2, .layout-item-2-1, .layout-item-3-1 { display: grid; grid-gap: 30px; align-content: flex-start } .layout-item.centered, .layout-item-1-1-1.centered, .layout-item-1-1-1_2.centered, .layout-item-1-2-1.centered, .layout-item-1-3.centered, .layout-item-1-2.centered, .layout-item-2-1.centered, .layout-item-3-1.centered { justify-content: center } .layout-item.no-padding-bottom, .layout-item-1-1-1.no-padding-bottom, .layout-item-1-1-1_2.no-padding-bottom, .layout-item-1-2-1.no-padding-bottom, .layout-item-1-3.no-padding-bottom, .layout-item-1-2.no-padding-bottom, .layout-item-2-1.no-padding-bottom, .layout-item-3-1.no-padding-bottom { padding-bottom: 0 } .layout-item.padded-bottom, .layout-item-1-1-1.padded-bottom, .layout-item-1-1-1_2.padded-bottom, .layout-item-1-2-1.padded-bottom, .layout-item-1-3.padded-bottom, .layout-item-1-2.padded-bottom, .layout-item-2-1.padded-bottom, .layout-item-3-1.padded-bottom { padding-bottom: 100px } .layout-item.padded, .layout-item-1-1-1.padded, .layout-item-1-1-1_2.padded, .layout-item-1-2-1.padded, .layout-item-1-3.padded, .layout-item-1-2.padded, .layout-item-2-1.padded, .layout-item-3-1.padded { padding-top: 30px } .layout-item.padded-mid, .layout-item-1-1-1.padded-mid, .layout-item-1-1-1_2.padded-mid, .layout-item-1-2-1.padded-mid, .layout-item-1-3.padded-mid, .layout-item-1-2.padded-mid, .layout-item-2-1.padded-mid, .layout-item-3-1.padded-mid { padding-top: 45px } .layout-item.padded-big, .layout-item-1-1-1.padded-big, .layout-item-1-1-1_2.padded-big, .layout-item-1-2-1.padded-big, .layout-item-1-3.padded-big, .layout-item-1-2.padded-big, .layout-item-2-1.padded-big, .layout-item-3-1.padded-big { padding-top: 60px } .layout-item.padded-large, .layout-item-1-1-1.padded-large, .layout-item-1-1-1_2.padded-large, .layout-item-1-2-1.padded-large, .layout-item-1-3.padded-large, .layout-item-1-2.padded-large, .layout-item-2-1.padded-large, .layout-item-3-1.padded-large { padding: 80px 0 } .layout-item.padded-larger, .layout-item-1-1-1.padded-larger, .layout-item-1-1-1_2.padded-larger, .layout-item-1-2-1.padded-larger, .layout-item-1-3.padded-larger, .layout-item-1-2.padded-larger, .layout-item-2-1.padded-larger, .layout-item-3-1.padded-larger { padding: 100px 0 } .layout-item.gutter-medium, .layout-item-1-1-1.gutter-medium, .layout-item-1-1-1_2.gutter-medium, .layout-item-1-2-1.gutter-medium, .layout-item-1-3.gutter-medium, .layout-item-1-2.gutter-medium, .layout-item-2-1.gutter-medium, .layout-item-3-1.gutter-medium { grid-gap: 40px } .layout-item.gutter-big, .layout-item-1-1-1.gutter-big, .layout-item-1-1-1_2.gutter-big, .layout-item-1-2-1.gutter-big, .layout-item-1-3.gutter-big, .layout-item-1-2.gutter-big, .layout-item-2-1.gutter-big, .layout-item-3-1.gutter-big { grid-gap: 60px; padding-bottom: 100px; } .layout-item.gutter-large, .layout-item-1-1-1.gutter-large, .layout-item-1-1-1_2.gutter-large, .layout-item-1-2-1.gutter-large, .layout-item-1-3.gutter-large, .layout-item-1-2.gutter-large, .layout-item-2-1.gutter-large, .layout-item-3-1.gutter-large { grid-gap: 80px } .layout-item.gutter-larger, .layout-item-1-1-1.gutter-larger, .layout-item-1-1-1_2.gutter-larger, .layout-item-1-2-1.gutter-larger, .layout-item-1-3.gutter-larger, .layout-item-1-2.gutter-larger, .layout-item-2-1.gutter-larger, .layout-item-3-1.gutter-larger { grid-gap: 100px } .layout-item.own-grid, .layout-item-1-1-1.own-grid, .layout-item-1-1-1_2.own-grid, .layout-item-1-2-1.own-grid, .layout-item-1-3.own-grid, .layout-item-1-2.own-grid, .layout-item-2-1.own-grid, .layout-item-3-1.own-grid { display: block } .layout-item-1-1-1 { grid-template-columns: repeat(3, 270px) } .layout-item-1-1-1_2 { grid-template-columns: repeat(3, 370px) } .layout-item-1-2-1 { grid-template-columns: 270px 570px 270px } .layout-item-2-1 { grid-template-columns: 570px 270px } .layout-item-1-2 { grid-template-columns: 270px 570px } .layout-item-3-1 { grid-template-columns: 870px 270px } .layout-item-1-3 { grid-template-columns: 270px 870px } @media screen and (max-width: 1260px) { .layout-content-1 { grid-template-columns: 100%; grid-template-areas: 'body' 'sidebar' } .layout-content-1.search-pad { padding-top: 100px } .layout-content-1 .page-navigation { justify-content: center; margin-bottom: 40px } .layout-content-2 { grid-template-columns: 870px; justify-content: center; grid-template-areas: 'body' 'sidebar1' 'sidebar2' } .layout-content-3 { grid-template-areas: 'body1 body2' 'body3 body3' } .layout-content-4 { grid-template-areas: 'sidebar' 'body'; grid-template-columns: 100% } .layout-content-4 .layout-sidebar { display: block } .layout-content-5 { display: block } .layout-item-1-1-1_2 { grid-template-columns: repeat(2, 370px) } .layout-sidebar, .layout-sidebar2 { display: none } .layout-sidebar1 .post-preview-showcase { grid-template-columns: repeat(3, 270px) } } @media screen and (max-width: 960px) { .layout-content-2, .layout-item, .layout-item-1-1-1, .layout-item-2-1, .layout-item-3-1 { grid-template-columns: 100% } .layout-content-2.load-more-wrap, .layout-item.load-more-wrap, .layout-item-1-1-1.load-more-wrap, .layout-item-2-1.load-more-wrap, .layout-item-3-1.load-more-wrap { grid-template-columns: auto } .layout-sidebar1 .post-preview-showcase { grid-template-columns: 100% } .layout-content-3 { grid-template-areas: 'body1' 'body2' 'body3' } .layout-item-1-1-1_2 { grid-template-columns: 370px } } @media screen and (max-width: 480px) { .layout-item-1-1-1_2 { grid-template-columns: 100% } } .grid-limit { max-width: 1170px; width: 95%; margin: 0 auto } .grid3-1col, .grid2-2col, .grid2-1col, .grid-6col_1, .grid-5col_1, .grid-4col, .grid-4col_1, .grid-3col, .grid-3col_1, .grid-2col, .grid-2col_1, .grid-2col_3, .grid-1col, .grid-1col_1, .grid-1col_2, .grid-1col_3, .grid1col-2col { display: grid; grid-gap: 30px } .grid3-1col.centered, .grid2-2col.centered, .grid2-1col.centered, .grid-6col_1.centered, .grid-5col_1.centered, .grid-4col.centered, .grid-4col_1.centered, .grid-3col.centered, .grid-3col_1.centered, .grid-2col.centered, .grid-2col_1.centered, .grid-2col_3.centered, .grid-1col.centered, .grid-1col_1.centered, .grid-1col_2.centered, .grid-1col_3.centered, .grid1col-2col.centered { justify-content: center } .grid3-1col.gutter-mid, .grid2-2col.gutter-mid, .grid2-1col.gutter-mid, .grid-6col_1.gutter-mid, .grid-5col_1.gutter-mid, .grid-4col.gutter-mid, .grid-4col_1.gutter-mid, .grid-3col.gutter-mid, .grid-3col_1.gutter-mid, .grid-2col.gutter-mid, .grid-2col_1.gutter-mid, .grid-2col_3.gutter-mid, .grid-1col.gutter-mid, .grid-1col_1.gutter-mid, .grid-1col_2.gutter-mid, .grid-1col_3.gutter-mid, .grid1col-2col.gutter-mid { grid-row-gap: 40px } .grid3-1col.gutter-small, .grid2-2col.gutter-small, .grid2-1col.gutter-small, .grid-6col_1.gutter-small, .grid-5col_1.gutter-small, .grid-4col.gutter-small, .grid-4col_1.gutter-small, .grid-3col.gutter-small, .grid-3col_1.gutter-small, .grid-2col.gutter-small, .grid-2col_1.gutter-small, .grid-2col_3.gutter-small, .grid-1col.gutter-small, .grid-1col_1.gutter-small, .grid-1col_2.gutter-small, .grid-1col_3.gutter-small, .grid1col-2col.gutter-small { grid-row-gap: 12px } .grid3-1col.gutter-medium, .grid2-2col.gutter-medium, .grid2-1col.gutter-medium, .grid-6col_1.gutter-medium, .grid-5col_1.gutter-medium, .grid-4col.gutter-medium, .grid-4col_1.gutter-medium, .grid-3col.gutter-medium, .grid-3col_1.gutter-medium, .grid-2col.gutter-medium, .grid-2col_1.gutter-medium, .grid-2col_3.gutter-medium, .grid-1col.gutter-medium, .grid-1col_1.gutter-medium, .grid-1col_2.gutter-medium, .grid-1col_3.gutter-medium, .grid1col-2col.gutter-medium { grid-row-gap: 20px } .grid3-1col.gutter-big, .grid2-2col.gutter-big, .grid2-1col.gutter-big, .grid-6col_1.gutter-big, .grid-5col_1.gutter-big, .grid-4col.gutter-big, .grid-4col_1.gutter-big, .grid-3col.gutter-big, .grid-3col_1.gutter-big, .grid-2col.gutter-big, .grid-2col_1.gutter-big, .grid-2col_3.gutter-big, .grid-1col.gutter-big, .grid-1col_1.gutter-big, .grid-1col_2.gutter-big, .grid-1col_3.gutter-big, .grid1col-2col.gutter-big { grid-row-gap: 60px } .grid3-1col.gutter-large, .grid2-2col.gutter-large, .grid2-1col.gutter-large, .grid-6col_1.gutter-large, .grid-5col_1.gutter-large, .grid-4col.gutter-large, .grid-4col_1.gutter-large, .grid-3col.gutter-large, .grid-3col_1.gutter-large, .grid-2col.gutter-large, .grid-2col_1.gutter-large, .grid-2col_3.gutter-large, .grid-1col.gutter-large, .grid-1col_1.gutter-large, .grid-1col_2.gutter-large, .grid-1col_3.gutter-large, .grid1col-2col.gutter-large { grid-row-gap: 80px } .grid3-1col.no-gutter, .grid2-2col.no-gutter, .grid2-1col.no-gutter, .grid-6col_1.no-gutter, .grid-5col_1.no-gutter, .grid-4col.no-gutter, .grid-4col_1.no-gutter, .grid-3col.no-gutter, .grid-3col_1.no-gutter, .grid-2col.no-gutter, .grid-2col_1.no-gutter, .grid-2col_3.no-gutter, .grid-1col.no-gutter, .grid-1col_1.no-gutter, .grid-1col_2.no-gutter, .grid-1col_3.no-gutter, .grid1col-2col.no-gutter { grid-gap: 0 } .grid1col-2col { grid-template-columns: 270px 570px } .grid3-1col { grid-template-columns: 870px } .grid2-2col { grid-template-columns: repeat(2, 570px) } .grid2-1col { grid-template-columns: 570px } .grid-6col_1 { grid-template-columns: repeat(6, 170px) } .grid-5col_1 { grid-template-columns: repeat(5, 170px) } .grid-4col_1 { grid-template-columns: repeat(4, 170px) } .grid-3col_1 { grid-template-columns: repeat(3, 170px) } .grid-2col_1 { grid-template-columns: repeat(2, 170px) } .grid-1col_1 { grid-template-columns: 170px } .grid-4col { grid-template-columns: repeat(4, 270px) } .grid-3col { grid-template-columns: repeat(3, 270px) } .grid-2col { grid-template-columns: repeat(2, 270px) } .grid-2col_3 { grid-template-columns: repeat(2, 420px) } .grid-1col_3 { grid-template-columns: 420px } .grid-1col_2 { grid-template-columns: 300px } .grid-1col { grid-template-columns: 270px } @media screen and (max-width: 1260px) { .grid-4col { grid-template-columns: repeat(3, 270px) } .grid2-2col { grid-template-columns: 570px } .grid2-2col.full { grid-template-columns: 100% } .grid-6col_1, .grid-5col_1 { grid-template-columns: repeat(4, 170px) } } @media screen and (max-width: 960px) { .grid-4col, .grid-3col { grid-template-columns: repeat(2, 270px) } .grid-2col_3 { grid-template-columns: 420px } .grid3-1col, .grid1col-2col { grid-template-columns: 100% } .grid-6col_1, .grid-5col_1, .grid-4col_1 { grid-template-columns: repeat(3, 170px) } } @media screen and (max-width: 680px) { .grid-4col, .grid-3col, .grid-2col { grid-template-columns: 270px } .grid2-2col, .grid2-1col { grid-template-columns: 100% } .grid-6col_1, .grid-5col_1, .grid-4col_1, .grid-3col_1 { grid-template-columns: repeat(2, 170px) } } @media screen and (max-width: 480px) { .grid-1col_3, .grid-2col_3, .grid-1col_2 { grid-template-columns: 100% } .grid-6col_1, .grid-5col_1, .grid-4col_1, .grid-3col_1, .grid-2col_1 { grid-template-columns: 170px } } @font-face { font-family: "simple-line-icons"; src: url("/public/font/siege/simple-line-icons/Simple-Line-Iconsb26c.eot?v=2.4.0"); src: url("/public/font/siege/simple-line-icons/Simple-Line-Iconsb26c.eot?v=2.4.0#iefix") format("embedded-opentype"), url("/public/font/siege/simple-line-icons/Simple-Line-Iconsb26c.woff2?v=2.4.0") format("woff2"), url("/public/font/siege/simple-line-icons/Simple-Line-Iconsb26c.ttf?v=2.4.0") format("truetype"), url("/public/font/siege/simple-line-icons/Simple-Line-Iconsb26c.woff?v=2.4.0") format("woff"), url("/public/font/siege/simple-line-icons/Simple-Line-Iconsb26c.svg?v=2.4.0#simple-line-icons") format("svg"); font-weight: normal; font-style: normal } .icon-user, .icon-people, .icon-user-female, .icon-user-follow, .icon-user-following, .icon-user-unfollow, .icon-login, .icon-logout, .icon-emotsmile, .icon-phone, .icon-call-end, .icon-call-in, .icon-call-out, .icon-map, .icon-location-pin, .icon-direction, .icon-directions, .icon-compass, .icon-layers, .icon-menu, .icon-list, .icon-options-vertical, .icon-options, .icon-arrow-down, .icon-arrow-left, .icon-arrow-right, .icon-arrow-up, .icon-arrow-up-circle, .icon-arrow-left-circle, .icon-arrow-right-circle, .icon-arrow-down-circle, .icon-check, .icon-clock, .icon-plus, .icon-minus, .icon-close, .icon-event, .icon-exclamation, .icon-organization, .icon-trophy, .icon-screen-smartphone, .icon-screen-desktop, .icon-plane, .icon-notebook, .icon-mustache, .icon-mouse, .icon-magnet, .icon-energy, .icon-disc, .icon-cursor, .icon-cursor-move, .icon-crop, .icon-chemistry, .icon-speedometer, .icon-shield, .icon-screen-tablet, .icon-magic-wand, .icon-hourglass, .icon-graduation, .icon-ghost, .icon-game-controller, .icon-fire, .icon-eyeglass, .icon-envelope-open, .icon-envelope-letter, .icon-bell, .icon-badge, .icon-anchor, .icon-wallet, .icon-vector, .icon-speech, .icon-puzzle, .icon-printer, .icon-present, .icon-playlist, .icon-pin, .icon-picture, .icon-handbag, .icon-globe-alt, .icon-globe, .icon-folder-alt, .icon-folder, .icon-film, .icon-feed, .icon-drop, .icon-drawer, .icon-docs, .icon-doc, .icon-diamond, .icon-cup, .icon-calculator, .icon-bubbles, .icon-briefcase, .icon-book-open, .icon-basket-loaded, .icon-basket, .icon-bag, .icon-action-undo, .icon-action-redo, .icon-wrench, .icon-umbrella, .icon-trash, .icon-tag, .icon-support, .icon-frame, .icon-size-fullscreen, .icon-size-actual, .icon-shuffle, .icon-share-alt, .icon-share, .icon-rocket, .icon-question, .icon-pie-chart, .icon-pencil, .icon-note, .icon-loop, .icon-home, .icon-grid, .icon-graph, .icon-microphone, .icon-music-tone-alt, .icon-music-tone, .icon-earphones-alt, .icon-earphones, .icon-equalizer, .icon-like, .icon-dislike, .icon-control-start, .icon-control-rewind, .icon-control-play, .icon-control-pause, .icon-control-forward, .icon-control-end, .icon-volume-1, .icon-volume-2, .icon-volume-off, .icon-calendar, .icon-bulb, .icon-chart, .icon-ban, .icon-bubble, .icon-camrecorder, .icon-camera, .icon-cloud-download, .icon-cloud-upload, .icon-envelope, .icon-eye, .icon-flag, .icon-heart, .icon-info, .icon-key, .icon-link, .icon-lock, .icon-lock-open, .icon-magnifier, .icon-magnifier-add, .icon-magnifier-remove, .icon-paper-clip, .icon-paper-plane, .icon-power, .icon-refresh, .icon-reload, .icon-settings, .icon-star, .icon-symbol-female, .icon-symbol-male, .icon-target, .icon-credit-card, .icon-paypal, .icon-social-tumblr, .icon-social-twitter, .icon-social-facebook, .icon-social-instagram, .icon-social-linkedin, .icon-social-pinterest, .icon-social-github, .icon-social-google, .icon-social-reddit, .icon-social-skype, .icon-social-dribbble, .icon-social-behance, .icon-social-foursqare, .icon-social-soundcloud, .icon-social-spotify, .icon-social-stumbleupon, .icon-social-youtube, .icon-social-dropbox, .icon-social-vkontakte, .icon-social-steam { font-family: "simple-line-icons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .icon-user:before { content: "\e005" } .icon-people:before { content: "\e001" } .icon-user-female:before { content: "\e000" } .icon-user-follow:before { content: "\e002" } .icon-user-following:before { content: "\e003" } .icon-user-unfollow:before { content: "\e004" } .icon-login:before { content: "\e066" } .icon-logout:before { content: "\e065" } .icon-emotsmile:before { content: "\e021" } .icon-phone:before { content: "\e600" } .icon-call-end:before { content: "\e048" } .icon-call-in:before { content: "\e047" } .icon-call-out:before { content: "\e046" } .icon-map:before { content: "\e033" } .icon-location-pin:before { content: "\e096" } .icon-direction:before { content: "\e042" } .icon-directions:before { content: "\e041" } .icon-compass:before { content: "\e045" } .icon-layers:before { content: "\e034" } .icon-menu:before { content: "\e601" } .icon-list:before { content: "\e067" } .icon-options-vertical:before { content: "\e602" } .icon-options:before { content: "\e603" } .icon-arrow-down:before { content: "\e604" } .icon-arrow-left:before { content: "\e605" } .icon-arrow-right:before { content: "\e606" } .icon-arrow-up:before { content: "\e607" } .icon-arrow-up-circle:before { content: "\e078" } .icon-arrow-left-circle:before { content: "\e07a" } .icon-arrow-right-circle:before { content: "\e079" } .icon-arrow-down-circle:before { content: "\e07b" } .icon-check:before { content: "\e080" } .icon-clock:before { content: "\e081" } .icon-plus:before { content: "\e095" } .icon-minus:before { content: "\e615" } .icon-close:before { content: "\e082" } .icon-event:before { content: "\e619" } .icon-exclamation:before { content: "\e617" } .icon-organization:before { content: "\e616" } .icon-trophy:before { content: "\e006" } .icon-screen-smartphone:before { content: "\e010" } .icon-screen-desktop:before { content: "\e011" } .icon-plane:before { content: "\e012" } .icon-notebook:before { content: "\e013" } .icon-mustache:before { content: "\e014" } .icon-mouse:before { content: "\e015" } .icon-magnet:before { content: "\e016" } .icon-energy:before { content: "\e020" } .icon-disc:before { content: "\e022" } .icon-cursor:before { content: "\e06e" } .icon-cursor-move:before { content: "\e023" } .icon-crop:before { content: "\e024" } .icon-chemistry:before { content: "\e026" } .icon-speedometer:before { content: "\e007" } .icon-shield:before { content: "\e00e" } .icon-screen-tablet:before { content: "\e00f" } .icon-magic-wand:before { content: "\e017" } .icon-hourglass:before { content: "\e018" } .icon-graduation:before { content: "\e019" } .icon-ghost:before { content: "\e01a" } .icon-game-controller:before { content: "\e01b" } .icon-fire:before { content: "\e01c" } .icon-eyeglass:before { content: "\e01d" } .icon-envelope-open:before { content: "\e01e" } .icon-envelope-letter:before { content: "\e01f" } .icon-bell:before { content: "\e027" } .icon-badge:before { content: "\e028" } .icon-anchor:before { content: "\e029" } .icon-wallet:before { content: "\e02a" } .icon-vector:before { content: "\e02b" } .icon-speech:before { content: "\e02c" } .icon-puzzle:before { content: "\e02d" } .icon-printer:before { content: "\e02e" } .icon-present:before { content: "\e02f" } .icon-playlist:before { content: "\e030" } .icon-pin:before { content: "\e031" } .icon-picture:before { content: "\e032" } .icon-handbag:before { content: "\e035" } .icon-globe-alt:before { content: "\e036" } .icon-globe:before { content: "\e037" } .icon-folder-alt:before { content: "\e039" } .icon-folder:before { content: "\e089" } .icon-film:before { content: "\e03a" } .icon-feed:before { content: "\e03b" } .icon-drop:before { content: "\e03e" } .icon-drawer:before { content: "\e03f" } .icon-docs:before { content: "\e040" } .icon-doc:before { content: "\e085" } .icon-diamond:before { content: "\e043" } .icon-cup:before { content: "\e044" } .icon-calculator:before { content: "\e049" } .icon-bubbles:before { content: "\e04a" } .icon-briefcase:before { content: "\e04b" } .icon-book-open:before { content: "\e04c" } .icon-basket-loaded:before { content: "\e04d" } .icon-basket:before { content: "\e04e" } .icon-bag:before { content: "\e04f" } .icon-action-undo:before { content: "\e050" } .icon-action-redo:before { content: "\e051" } .icon-wrench:before { content: "\e052" } .icon-umbrella:before { content: "\e053" } .icon-trash:before { content: "\e054" } .icon-tag:before { content: "\e055" } .icon-support:before { content: "\e056" } .icon-frame:before { content: "\e038" } .icon-size-fullscreen:before { content: "\e057" } .icon-size-actual:before { content: "\e058" } .icon-shuffle:before { content: "\e059" } .icon-share-alt:before { content: "\e05a" } .icon-share:before { content: "\e05b" } .icon-rocket:before { content: "\e05c" } .icon-question:before { content: "\e05d" } .icon-pie-chart:before { content: "\e05e" } .icon-pencil:before { content: "\e05f" } .icon-note:before { content: "\e060" } .icon-loop:before { content: "\e064" } .icon-home:before { content: "\e069" } .icon-grid:before { content: "\e06a" } .icon-graph:before { content: "\e06b" } .icon-microphone:before { content: "\e063" } .icon-music-tone-alt:before { content: "\e061" } .icon-music-tone:before { content: "\e062" } .icon-earphones-alt:before { content: "\e03c" } .icon-earphones:before { content: "\e03d" } .icon-equalizer:before { content: "\e06c" } .icon-like:before { content: "\e068" } .icon-dislike:before { content: "\e06d" } .icon-control-start:before { content: "\e06f" } .icon-control-rewind:before { content: "\e070" } .icon-control-play:before { content: "\e071" } .icon-control-pause:before { content: "\e072" } .icon-control-forward:before { content: "\e073" } .icon-control-end:before { content: "\e074" } .icon-volume-1:before { content: "\e09f" } .icon-volume-2:before { content: "\e0a0" } .icon-volume-off:before { content: "\e0a1" } .icon-calendar:before { content: "\e075" } .icon-bulb:before { content: "\e076" } .icon-chart:before { content: "\e077" } .icon-ban:before { content: "\e07c" } .icon-bubble:before { content: "\e07d" } .icon-camrecorder:before { content: "\e07e" } .icon-camera:before { content: "\e07f" } .icon-cloud-download:before { content: "\e083" } .icon-cloud-upload:before { content: "\e084" } .icon-envelope:before { content: "\e086" } .icon-eye:before { content: "\e087" } .icon-flag:before { content: "\e088" } .icon-heart:before { content: "\e08a" } .icon-info:before { content: "\e08b" } .icon-key:before { content: "\e08c" } .icon-link:before { content: "\e08d" } .icon-lock:before { content: "\e08e" } .icon-lock-open:before { content: "\e08f" } .icon-magnifier:before { content: "\e090" } .icon-magnifier-add:before { content: "\e091" } .icon-magnifier-remove:before { content: "\e092" } .icon-paper-clip:before { content: "\e093" } .icon-paper-plane:before { content: "\e094" } .icon-power:before { content: "\e097" } .icon-refresh:before { content: "\e098" } .icon-reload:before { content: "\e099" } .icon-settings:before { content: "\e09a" } .icon-star:before { content: "\e09b" } .icon-symbol-female:before { content: "\e09c" } .icon-symbol-male:before { content: "\e09d" } .icon-target:before { content: "\e09e" } .icon-credit-card:before { content: "\e025" } .icon-paypal:before { content: "\e608" } .icon-social-tumblr:before { content: "\e00a" } .icon-social-twitter:before { content: "\e009" } .icon-social-facebook:before { content: "\e00b" } .icon-social-instagram:before { content: "\e609" } .icon-social-linkedin:before { content: "\e60a" } .icon-social-pinterest:before { content: "\e60b" } .icon-social-github:before { content: "\e60c" } .icon-social-google:before { content: "\e60d" } .icon-social-reddit:before { content: "\e60e" } .icon-social-skype:before { content: "\e60f" } .icon-social-dribbble:before { content: "\e00d" } .icon-social-behance:before { content: "\e610" } .icon-social-foursqare:before { content: "\e611" } .icon-social-soundcloud:before { content: "\e612" } .icon-social-spotify:before { content: "\e613" } .icon-social-stumbleupon:before { content: "\e614" } .icon-social-youtube:before { content: "\e008" } .icon-social-dropbox:before { content: "\e00c" } .icon-social-vkontakte:before { content: "\e618" } .icon-social-steam:before { content: "\e620" } @keyframes translate-from-bottom { 0% { -o-transform: translate(0, 50%); -moz-transform: translate(0, 50%); -ms-transform: translate(0, 50%); -webkit-transform: translate(0, 50%); transform: translate(0, 50%); opacity: 0 } 100% { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1 } } @keyframes translate-from-right { 0% { -o-transform: translate(30%, 0); -moz-transform: translate(30%, 0); -ms-transform: translate(30%, 0); -webkit-transform: translate(30%, 0); transform: translate(30%, 0); opacity: 0 } 100% { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1 } } @keyframes spin { 0% { -o-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0) } 100% { -o-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg) } } body { background-color: #fff; overflow-x: hidden } h1, h2, h3, h4, h5, h6 { color: #363636; font-family: "Exo", sans-serif; font-weight: 700; text-transform: uppercase } p { color: #777; font-family: "Roboto", sans-serif; font-size: .8125em; line-height: 1.6923076923em } p.light { color: #8b8b8b } p.small { font-size: .6875em } a { font-family: "Roboto", sans-serif } ::selection { color: #fff; background-color: #1e1f20 } ::-moz-selection { color: #fff; background-color: #1e1f20 } .title { color: #363636; font-family: "Exo", sans-serif; font-size: 1em; line-height: 1.375em; font-weight: 700; text-transform: uppercase } .user-avatar-wrap { position: relative } .user-avatar-wrap .user-avatar-text { padding: 2px 2px 0; background-color: #363636; color: #fff; position: absolute; bottom: 6px; right: 2px } .user-avatar-wrap .user-avatar-text.blue { background-color: #107df8 } .user-avatar-wrap .user-avatar-text.red { background-color: #f30a5c } .user-avatar-wrap .user-avatar-decoration { width: 16px; height: 16px; border-radius: 50%; background: #f30a5c; position: absolute; top: -6px; right: -6px } .user-avatar-wrap .user-avatar-decoration .user-avatar-decoration-text { color: #fff; line-height: 16px; text-align: center } .user-avatar-wrap+.skill-loot-list { margin-left: 6px } .user-avatar { width: 60px; height: 60px; border-radius: 50% } .user-avatar.big { width: 100px; height: 100px } .user-avatar.medium { width: 80px; height: 80px } .user-avatar.small { width: 50px; height: 50px } .user-avatar.smaller { width: 34px; height: 34px } .user-avatar.tiny { width: 26px; height: 26px } .user-avatar.micro { width: 20px; height: 20px } .user-avatar.character { width: 44px; height: 44px; padding: 2px; border: 2px solid #363636 } .user-avatar.character.v2 { padding: 0; border: 4px solid #363636; border-radius: 6px } .user-avatar.character.small { width: 30px; height: 30px; border: 3px solid #363636 } .user-avatar.character.blue { border-color: #107df8 } .user-avatar.character.yellow { border-color: #dee807 } .user-avatar.character.red { border-color: #f30a5c } .skill-loot-list { display: flex; flex-flow: row wrap; justify-content: center; align-items: center } .skill-loot-list.vertical { flex-direction: column; justify-content: flex-start } .skill-loot-list.vertical .skill-loot-item { margin-right: 0 } .skill-loot-list.vertical .skill-loot-item:last-child { margin-bottom: 0 } .skill-loot-list.medium .skill-loot-item { margin: 0 10px 0 0 } .skill-loot-list.medium .skill-loot-item:last-child { margin-right: 0 } .skill-loot-list .skill-loot-item { margin: 0 4px 4px 0 } .skill-loot-list .skill-loot-item:last-child { margin-right: 0 } .skill-loot-list .skill-loot-item-info .skill-loot-item-title { color: #363636 } .skill-loot-list .skill-loot-item-info .skill-loot-item-text { margin-top: 3px; color: #8b8b8b; font-size: .5625em; line-height: 1em } .skill-loot-img { width: 20px; height: 20px; border-radius: 4px } .skill-loot-img.small { width: 16px; height: 16px } .skill-loot-img.medium { width: 30px; height: 30px } .hexagon { visibility: hidden; overflow: hidden; -o-transform: rotate(120deg); -moz-transform: rotate(120deg); -ms-transform: rotate(120deg); -webkit-transform: rotate(120deg); transform: rotate(120deg) } .hexagon-wrap { width: 44px; height: 48px; background-color: #363636 } .hexagon-wrap.small { width: 28px; height: 30px } .hexagon-wrap.small .inner-hexagon { width: 22px; height: 24px; top: 3px } .hexagon-wrap.team-blue .hexagon-wrap { background-color: #107df8 } .hexagon-wrap.team-yellow .hexagon-wrap { background-color: #dee807 } .hexagon-wrap.light .hexagon-wrap { background-color: #f9f9f9 } .hexagon-wrap.cyan .hexagon-wrap { background-color: #00e3d0 } .hexagon-wrap.red .hexagon-wrap { background-color: #f30a5c } .hexagon-wrap.blue .hexagon-wrap { background-color: #1c95f3 } .hexagon-wrap.violet .hexagon-wrap { background-color: #7442ce } .hexagon-wrap.gray .hexagon-wrap { background-color: #dbdbdb } .hexagon-wrap .inner-hexagon { width: 36px; height: 40px; margin: 0 auto; position: relative; top: 4px } .hexagon-wrap .plus-icon, .hexagon-wrap .tower-icon { fill: #fff; position: absolute; left: 50%; margin-left: -8px } .hexagon-wrap .plus-icon { top: 12px } .hexagon-wrap .tower-icon { top: 10px } .hexagon-in1, .hexagon-in2, .hexagon-area { width: 100%; height: 100%; -o-transform: rotate(-60deg); -moz-transform: rotate(-60deg); -ms-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); transform: rotate(-60deg) } .hexagon-in1 { overflow: hidden } .hexagon-in2 { visibility: visible } .avatar-badge { width: 16px; height: 16px; border-radius: 50%; background-color: #363636; position: relative } .avatar-badge.team-blue { background-color: #107df8 } .avatar-badge.team-yellow { background-color: #dee807 } .avatar-badge.team-red { background-color: #f30a5c } .avatar-badge.red { background-color: #f30a5c } .avatar-badge .check-icon, .avatar-badge .cross-cb-icon { fill: #fff; position: absolute; left: 50%; margin-left: -4px } .avatar-badge .cross-cb-icon { width: 8px; height: 8px; top: 4px } .avatar-badge .check-icon { width: 8px; height: 7px; top: 5px } .play-button { width: 40px; height: 40px; border-radius: 50%; border: 4px solid #00e3d0; background-color: rgba(0, 0, 0, 0.5); padding: 9px 0 0 11px } .play-button.tiny { width: 26px; height: 26px; border: 3px solid #00e3d0; padding: 0 } .play-button.big { width: 80px; height: 80px; border: 8px solid #00e3d0; padding: 18px 0 0 22px } .text-heading { color: #363636; font-size: .6875em } .badge-info { color: #363636; text-align: center } .logo:after { content: ''; display: table; clear: both } .logo.negative .logo-text .logo-title { color: #fff } .logo.negative .logo-text .logo-info { color: #8b8b8b } .logo .logo-img { float: left; width: 153px; height: 41px; margin-right: 12px } .logo .logo-text { float: left; margin-top: 5px } .logo .logo-text .logo-title { font-family: "Roboto", sans-serif; font-size: 1.375em } .logo .logo-text .logo-title .highlight { color: #1c95f3; font-family: "Exo", sans-serif } .logo .logo-text .logo-info { font-size: .6875em } .line-separator { width: 100%; height: 1px; background-color: #dbdbdb } .line-separator.negative { background-color: #383838 } .line-separator+.post-preview { margin-top: 16px } .streamer-avatars { display: flex; flex-flow: row wrap } .streamer-avatars .streamer-avatar { margin-right: 36px } .streamer-avatars .streamer-avatar:last-child { margin-right: 0 } .streamer-avatars.centered { justify-content: center; margin: 40px 0 } .streamer-avatar { width: 80px; height: 89px; position: relative } .streamer-avatar .pp-hexagon { position: absolute; top: 0; left: 0 } .streamer-avatar .streamer-avatar-img-wrap { width: 80px; position: absolute; bottom: 6px; left: 0; text-align: center; pointer-events: none } .streamer-avatar .streamer-avatar-img { display: inline-block } .pp-hexagon { position: relative } .pp-hexagon.active .hexagon-icon.hexagon-border, .pp-hexagon:hover .hexagon-icon.hexagon-border { fill: #7442ce } .pp-hexagon .hexagon-icon.hexagon-border { transition: all .3s ease-in-out } .pp-hexagon .hexagon-icon.hexagon-fill { position: absolute; top: 6px; left: 6px } .page-navigation { display: flex; flex-flow: row wrap } .page-navigation.spaced { margin-top: 60px } .page-navigation.center { justify-content: center } .page-navigation.right { justify-content: flex-end } .page-navigation>* { margin-right: 12px } .page-navigation>*:last-child { margin-right: 0 } .page-navigation.blue .page-navigation-item.active { color: #1c95f3 } .page-navigation.blue .slider-control { background-color: #1c95f3 } .page-navigation.red .page-navigation-item.active { color: #f30a5c } .page-navigation.red .slider-control { background-color: #f30a5c } .page-navigation.green .page-navigation-item.active { color: #58d819 } .page-navigation.green .slider-control { background-color: #58d819 } .page-navigation.yellow .page-navigation-item.active { color: #ffb400 } .page-navigation.yellow .slider-control { background-color: #ffb400 } .page-navigation.violet .page-navigation-item.active { color: #7442ce } .page-navigation.violet .slider-control { background-color: #7442ce } .page-navigation.cyan .page-navigation-item.active { color: #00e3d0 } .page-navigation.cyan .slider-control { background-color: #00e3d0 } .page-navigation .page-navigation-item { width: 40px; height: 40px; border: 1px solid #dbdbdb; border-radius: 4px; line-height: 40px; color: #363636; text-align: center } .timestamp-tag { color: #fff; padding: 8px 10px; background-color: rgba(0, 0, 0, 0.5) } .timestamp-tag.tiny { font-size: .5em; padding: 6px } .bullet-list { padding-left: 30px } .bullet-list-item { display: flex; flex-flow: row wrap; margin-bottom: 30px } .bullet-list-item:last-child { margin-bottom: 0 } .bullet-list-item .bullet-list-item-icon { margin-right: 12px } .bullet-list-item .bullet-list-item-icon .check-icon { fill: #1c95f3; position: relative; top: 2px } .bullet-list-item .bullet-list-item-text { font-size: .875em } .blur-bg-wrap { position: relative; overflow: hidden } .blur-bg-wrap .blur-bg { width: 100%; height: 100%; position: absolute; top: 0; left: 0; -webkit-filter: blur(5px); filter: blur(5px); z-index: 1 } .blur-bg-wrap .blur-bg-img { width: 74%; margin: 0 auto; position: relative; z-index: 9999 } .text-tag { position: relative } .text-tag:before, .text-tag:after { content: ''; margin-left: 8px; padding: 1px 4px; border-radius: 2px; background-color: #363636; color: #fff; font-family: "Exo", sans-serif; font-size: 8px; font-weight: 700; line-height: 1em; text-transform: uppercase; position: relative; top: -3px } .text-tag:before { display: none; margin-left: 0; margin-right: 8px } .text-tag.red { color: #fff; background-color: #f30a5c } .text-tag.live:after { display: none } .text-tag.live:before { display: inline; content: 'Live'; padding: 0 2px; background-color: #f30a5c; font-size: .75em; font-weight: 800; letter-spacing: 0.05em; top: -1px } .text-tag.live.bottom:before { padding: 2px; margin: 0; position: absolute; top: 14px; left: 8px } .text-tag.hot:after { content: 'Hot!'; border-radius: 200px; background-color: #00e3d0; top: -2px } .text-tag.new:after { content: 'New'; border-radius: 200px; background-color: #1c95f3; top: -2px } .text-tag.author:after { content: 'Author' } .text-tag.staff:after { content: 'Staff' } .text-tag.original-poster:after { content: 'Original Poster'; background-color: #1c95f3 } .text-tag.moderator:after { content: 'Moderator'; background-color: #7442ce } .review-block { display: flex; flex-flow: row wrap; justify-content: space-between } .filter-heading { border-bottom: 1px solid #dbdbdb; padding-bottom: 14px } .filter-heading.multiple-items { min-height: 40px; padding: 0; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center } .filter-heading.no-border { border-bottom: none } .filter-heading.spaced { margin-top: 14px } .filter-heading.bottom-spaced { margin-bottom: 26px } .filter-heading .filter-heading-text { color: #363636 } .filter-heading .filter-heading-text.red .highlight { color: #f30a5c } .filter-heading .filter-heading-text .highlight { color: #1c95f3 } .filter-heading .filter-heading-actions { display: flex; flex-flow: row wrap } .filter-heading .filter-heading-actions .dropdown-simple-wrap { margin-right: 40px } .filter-heading .filter-heading-actions .dropdown-simple-wrap:last-child { margin-right: 0 } .filter-heading .filter-heading-actions .display-change-actions { display: flex; flex-flow: row wrap } .filter-heading .filter-heading-actions .display-change-actions .display-change-action { height: 40px; margin-right: 26px; padding-top: 10px; cursor: pointer } .filter-heading .filter-heading-actions .display-change-actions .display-change-action.selected .grid-icon, .filter-heading .filter-heading-actions .display-change-actions .display-change-action.selected .list-icon { fill: #7442ce } .filter-heading .filter-heading-actions .display-change-actions .display-change-action:last-child { margin-right: 0 } .filter-heading+.post-preview-showcase { margin-top: 26px } .error-display { padding-top: 430px; text-align: center; position: relative } .error-display .error-img { width: 391px; height: 374px; position: absolute; top: 40px; left: 50%; margin-left: -132px } .error-display .error-title { margin-top: 50px; color: #363636 } .error-display .error-subtitle { margin-top: 26px; color: #8b8b8b; line-height: 1em } .error-display .error-text { width: 570px; margin: 46px auto 0 } .error-display .error-text .highlight { color: #1c95f3; font-weight: 500 } .error-display+.section-actions { margin-top: 70px } .section-actions { display: flex; flex-flow: row wrap; justify-content: center } .section-actions .button { width: 220px; text-align: center } .section-actions .button+.button { margin-left: 20px } .avatar-change { width: 100px; height: 100px; margin-top: 26px; position: relative } .avatar-change .avatar-change-action { position: absolute; top: -6px; right: -6px } .account-info-wrap .user-avatar { display: block; margin: 0 auto } .account-info-wrap .account-info-username { margin-top: 14px; color: #363636; line-height: 1em; text-align: center } .account-info-wrap .account-info-name { margin-top: 8px; color: #8b8b8b; text-align: center } .account-info-wrap .account-info-stats { width: 270px; margin: 36px auto 0; display: flex; flex-flow: row wrap; justify-content: space-evenly } .account-info-wrap .account-info-stats .account-info-stat { text-align: center } .account-info-wrap .account-info-stats .account-info-stat .account-info-stat-title { margin-top: 8px; color: #8b8b8b; font-weight: 400 } .account-info-wrap .account-info-stats .account-info-stat .account-info-stat-value { color: #363636; line-height: 1em } .account-info-wrap .dropdown-list { margin: 40px auto 0 } .team-logo { width: 56px; height: 56px } .team-logo.mid { width: 45px; height: 45px } .team-logo.small { width: 30px; height: 30px } .team-logo.medium { width: 66px; height: 66px } .team-logo.big { width: 182px; height: 182px } .team-info-wrap { display: flex; flex-flow: row wrap; position: relative } .team-info-wrap.v3 { height: 162px } .team-info-wrap.v3 .team-logo-wrap { width: 190px; height: 162px; background-color: #363636; position: relative; overflow: hidden } .team-info-wrap.v3 .team-logo-wrap:before, .team-info-wrap.v3 .team-logo-wrap:after { content: ''; height: 162px; position: absolute; top: 0; -o-transform: skew(20deg); -moz-transform: skew(20deg); -ms-transform: skew(20deg); -webkit-transform: skew(20deg); transform: skew(20deg) } .team-info-wrap.v3 .team-logo-wrap:before { width: 10px; right: 32px; background-color: #363636; z-index: 3 } .team-info-wrap.v3 .team-logo-wrap:after { width: 80px; right: -35px; background-color: #fff; z-index: 2 } .team-info-wrap.v3 .team-logo-wrap .team-logo { width: 180px; height: 180px; position: absolute; top: -10px; left: -20px; z-index: 1 } .team-info-wrap.v3 .team-info { margin: 66px 0 0 78px } .team-info-wrap.v3 .team-info .team-name { font-size: .75em; text-align: right } .team-info-wrap.v3 .team-info .team-country { margin-top: 6px; font-size: .625em; text-align: right } .team-info-wrap.v3.inverted .team-logo-wrap { order: 2 } .team-info-wrap.v3.inverted .team-logo-wrap:before, .team-info-wrap.v3.inverted .team-logo-wrap:after { -o-transform: skew(-20deg); -moz-transform: skew(-20deg); -ms-transform: skew(-20deg); -webkit-transform: skew(-20deg); transform: skew(-20deg); right: auto } .team-info-wrap.v3.inverted .team-logo-wrap:before { left: 32px } .team-info-wrap.v3.inverted .team-logo-wrap:after { left: -35px } .team-info-wrap.v3.inverted .team-logo-wrap .team-logo { left: 28px } .team-info-wrap.v3.inverted .team-info { order: 1; margin: 66px 78px 0 0 } .team-info-wrap.v3.inverted .team-info .team-name, .team-info-wrap.v3.inverted .team-info .team-country { text-align: left } .team-info-wrap.v3.blue .team-logo-wrap { background-color: #107df8 } .team-info-wrap.v3.blue .team-logo-wrap:before { background-color: #107df8 } .team-info-wrap.v3.yellow .team-logo-wrap { background-color: #dee807 } .team-info-wrap.v3.yellow .team-logo-wrap:before { background-color: #dee807 } .team-info-wrap.v2 { height: 162px } .team-info-wrap.v2 .team-logo-wrap { order: 2; width: 134px; height: 162px; margin: 0 0 0 40px; background-color: #363636; position: relative; -o-transform: skew(20deg); -moz-transform: skew(20deg); -ms-transform: skew(20deg); -webkit-transform: skew(20deg); transform: skew(20deg); overflow: hidden } .team-info-wrap.v2 .team-logo-wrap:before, .team-info-wrap.v2 .team-logo-wrap:after { content: ''; height: 162px; position: absolute; top: 0 } .team-info-wrap.v2 .team-logo-wrap:before { width: 10px; background-color: #363636; left: 0; z-index: 2 } .team-info-wrap.v2 .team-logo-wrap:after { width: 4px; background-color: #fff; left: 10px; z-index: 2 } .team-info-wrap.v2 .team-logo-wrap .team-logo { width: 180px; height: 180px; position: absolute; top: -10px; left: -14px; z-index: 1; -o-transform: skew(-20deg); -moz-transform: skew(-20deg); -ms-transform: skew(-20deg); -webkit-transform: skew(-20deg); transform: skew(-20deg) } .team-info-wrap.v2 .team-info { margin: 68px 0 0; order: 1 } .team-info-wrap.v2 .team-info .team-name { font-size: .75em; text-align: right } .team-info-wrap.v2 .team-info .team-country { margin-top: 6px; font-size: .625em; text-align: right } .team-info-wrap.v2.inverted .team-logo-wrap { margin: 0 40px 0 0; order: 1; -o-transform: skew(-20deg); -moz-transform: skew(-20deg); -ms-transform: skew(-20deg); -webkit-transform: skew(-20deg); transform: skew(-20deg) } .team-info-wrap.v2.inverted .team-logo-wrap:before { left: auto; right: 0 } .team-info-wrap.v2.inverted .team-logo-wrap:after { left: auto; right: 10px } .team-info-wrap.v2.inverted .team-logo-wrap .team-logo { -o-transform: skew(20deg); -moz-transform: skew(20deg); -ms-transform: skew(20deg); -webkit-transform: skew(20deg); transform: skew(20deg); left: -22px } .team-info-wrap.v2.inverted .team-info { margin: 68px 0 0; order: 2 } .team-info-wrap.v2.inverted .team-info .team-name, .team-info-wrap.v2.inverted .team-info .team-country { text-align: left } .team-info-wrap.v2.blue .team-logo-wrap { background-color: #107df8 } .team-info-wrap.v2.blue .team-logo-wrap:before { background-color: #107df8 } .team-info-wrap.v2.yellow .team-logo-wrap { background-color: #dee807 } .team-info-wrap.v2.yellow .team-logo-wrap:before { background-color: #dee807 } .team-info-wrap.inverted { justify-content: flex-end } .team-info-wrap.inverted .user-avatar-wrap { order: 3 } .team-info-wrap.inverted .user-avatar-wrap+.skill-loot-list { margin: 0 6px 0 0 } .team-info-wrap.inverted .team-logo, .team-info-wrap.inverted .user-avatar, .team-info-wrap.inverted .hexagon, .team-info-wrap.inverted .skill-loot-list { order: 2 } .team-info-wrap.inverted .team-info { order: 1; margin: 6px 10px 0 0; text-align: right } .team-info-wrap.inverted.medium .skill-loot-list+.team-info { margin: 10px 12px 0 0 } .team-info-wrap.tiny .team-info .team-name { font-size: .5625em } .team-info-wrap.centered { display: block } .team-info-wrap.centered .team-logo { display: block; margin: 0 auto } .team-info-wrap.centered .team-info { margin-left: 0 } .team-info-wrap.centered .team-info .team-name, .team-info-wrap.centered .team-info .team-country { text-align: center } .team-info-wrap.small .team-info { margin-top: 10px } .team-info-wrap.mid .hexagon+.team-info { margin-left: 16px } .team-info-wrap.mid .team-info { margin-top: 12px } .team-info-wrap.mid .team-info .team-name { font-size: .75em } .team-info-wrap.mid .team-info .team-country { margin-top: 4px; font-size: .625em } .team-info-wrap.medium .team-info { margin-top: 18px } .team-info-wrap.medium .team-info .team-name { font-size: .75em } .team-info-wrap.medium .skill-loot-list+.team-info { margin: 10px 0 0 12px } .team-info-wrap.medium .skill-loot-list+.team-info .team-country { margin-top: 4px; font-size: .625em } .team-info-wrap.medium .user-avatar+.team-info { margin-top: 10px } .team-info-wrap.medium .user-avatar+.team-info .team-country { margin-top: 4px } .team-info-wrap.medium .avatar-badge { position: absolute; top: 28px; left: 28px } .team-info-wrap .user-avatar+.team-info { margin-top: 3px } .team-info-wrap .user-avatar.character.small+.team-info { margin: 5px 0 0 8px } .team-info-wrap .bullet-icon, .team-info-wrap .tower-icon, .team-info-wrap .shield-icon, .team-info-wrap .plus-icon { margin-top: 6px } .team-info-wrap .rank-img { width: 28px; height: 23px; position: relative; top: 4px } .team-info-wrap .rank-img+.team-info .team-country { text-transform: uppercase } .team-info-wrap .team-info { margin: 6px 0 0 10px } .team-info-wrap .team-info .team-name { color: #363636 } .team-info-wrap .team-info .team-name .highlight.team-blue { color: #107df8 } .team-info-wrap .team-info .team-name .highlight.team-yellow { color: #dee807 } .team-info-wrap .team-info .team-name .highlight.red { color: #f30a5c } .team-info-wrap .team-info .team-country { margin-top: 2px; color: #8b8b8b; font-size: .5625em; line-height: 1em } .featured-stat-wrap-list { display: flex; flex-flow: row wrap } .featured-stat-wrap-list .featured-stat-wrap { margin-right: 38px } .featured-stat-wrap-list .featured-stat-wrap:last-child { margin-right: 0 } .featured-stat-wrap.center .featured-stat-title, .featured-stat-wrap.center .featured-stat-text { text-align: center } .featured-stat-wrap.center .user-avatar { display: block; margin: 0 auto } .featured-stat-wrap.right .featured-stat-title, .featured-stat-wrap.right .featured-stat-text { text-align: right } .featured-stat-wrap.regular .featured-stat-text { text-transform: none } .featured-stat-wrap.multiple-items { display: flex; flex-flow: row wrap; align-items: center } .featured-stat-wrap.multiple-items.inverted .featured-stat-title { order: 1 } .featured-stat-wrap.multiple-items.inverted .featured-stat-icon { order: 2; margin: 0 0 0 8px } .featured-stat-wrap.multiple-items .featured-stat-icon { margin: 0 8px 0 0 } .featured-stat-wrap.medium .featured-stat-title { font-size: .875em } .featured-stat-wrap.medium .user-avatar+.featured-stat-text { margin-top: 6px } .featured-stat-wrap.medium .featured-stat-text { font-size: .5625em; margin-top: 15px } .featured-stat-wrap .icon-sl { display: block; margin-bottom: 8px; color: #7442ce } .featured-stat-wrap .featured-stat-title { color: #363636; line-height: 1em } .featured-stat-wrap .featured-stat-title.void .highlight:nth-child(1), .featured-stat-wrap .featured-stat-title.void .highlight:nth-child(2), .featured-stat-wrap .featured-stat-title.void .highlight:nth-child(3) { color: #8b8b8b } .featured-stat-wrap .featured-stat-title .highlight:nth-child(1) { color: #7442ce } .featured-stat-wrap .featured-stat-title .highlight:nth-child(2) { color: #00e3d0 } .featured-stat-wrap .featured-stat-title .highlight:nth-child(3) { color: #777 } .featured-stat-wrap .featured-stat-title .like-icon, .featured-stat-wrap .featured-stat-title .dislike-icon { margin-left: 4px; font-size: 12px; font-weight: 700 } .featured-stat-wrap .featured-stat-title .like-icon { color: #00e3d0 } .featured-stat-wrap .featured-stat-title .dislike-icon { color: #f30a5c } .featured-stat-wrap .featured-stat-text { margin-top: 4px; color: #8b8b8b; font-size: .625em; line-height: 1em; text-transform: uppercase } .ban-list-wrap { display: flex; flex-flow: row wrap; align-items: center } .ban-list-wrap.inverted .ban-list-title { order: 2; margin: 0 0 0 20px } .ban-list-wrap.inverted .ban-list { order: 1 } .ban-list-wrap .ban-list-title { margin-right: 20px; color: #363636 } .ban-list-wrap .ban-list { display: flex; flex-flow: row wrap } .ban-list-wrap .ban-list .ban-list-item { margin-right: 12px } .ban-list-wrap .ban-list .ban-list-item:last-child { margin-right: 0 } .character-selection-list { height: 86px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center } .character-selection-list .character-selection-list-text { color: #8b8b8b } .character-list { display: flex; flex-flow: row wrap } .character-list.hoverable .user-avatar { opacity: 0.2; cursor: pointer; transition: all .3s ease-in-out } .character-list.hoverable .user-avatar.active { opacity: 1 } .character-list.hoverable .user-avatar:hover { opacity: 1 } .character-list .user-avatar { margin-right: 20px } .character-list .user-avatar:last-child { margin-right: 0 } .award-cup-img { width: 20px; height: 20px } .ticket-wrap { width: 270px; height: 130px; padding: 18px 78px 0 20px; position: relative; overflow: hidden } .ticket-wrap:before { content: ''; width: 270px; height: 128px; border: 1px solid #dbdbdb; position: absolute; top: 0; left: 0; z-index: 1 } .ticket-wrap .ticket-corner { width: 40px; height: 40px; border-radius: 50%; background-color: #fff; border: 1px solid #dbdbdb; position: absolute; z-index: 3 } .ticket-wrap .ticket-corner.top { top: -20px } .ticket-wrap .ticket-corner.bottom { bottom: -20px } .ticket-wrap .ticket-corner.left { left: -20px } .ticket-wrap .ticket-corner.right { right: -20px } .ticket-wrap .ticket-info .ticket-title { color: #363636; text-align: center } .ticket-wrap .ticket-info .ticket-text { margin-top: 4px; color: #8b8b8b; text-align: center } .ticket-wrap .ticket-info .ticket-text .bold { color: #363636 } .ticket-wrap .ticket-teams { margin-top: 14px; display: flex; flex-flow: row wrap; justify-content: space-between } .ticket-wrap .ticket-teams .ticket-teams-text { margin-top: 12px; color: #363636 } .ticket-wrap .ticket-buy-button { width: 130px; height: 50px; line-height: 50px; border: 1px solid #dbdbdb; border-top: 1px dashed #dbdbdb; background-color: #f9f9f9; color: #363636; text-align: center; position: absolute; top: 40px; right: -40px; z-index: 2; -o-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg) } .ticket-wrap .ticket-buy-button.sold-out { color: #bfbfbf } .tournament-banner { width: 270px; height: 150px } .map-wrap { width: 100% } .map-wrap.small { height: 150px } .map-wrap.medium { height: 480px } .map-wrap.big { height: 560px } .filters-row { min-height: 40px; margin-bottom: 26px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; position: relative } .filters-row.no-space { margin-bottom: 0 } .filters-row .forum-home-link { position: relative; top: -10px } .filters-row .dropdown-simple-wrap { margin-right: 40px } .filters-row .dropdown-simple-wrap:last-child { margin-right: 0 } .filters-row .forum-actions { position: absolute; top: -10px; right: 0 } .order-item { border-bottom: 1px solid #dbdbdb } .order-item.v2 { border-bottom: none } .order-item.v2 .order-body { padding: 0 } .order-item.v2 .order-body .order-body-item { width: 200px; margin: 0 100px 30px 0 } .order-item.v2 .order-body .order-body-item:last-child { width: 270px; margin-right: 0 } .order-item.v2 .order-body .order-body-item .order-body-item-title { margin-bottom: 40px; font-size: .875em } .order-item.v2 .order-body .order-body-item .order-body-item-text { font-size: .875em } .order-item .order-header { height: 40px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; align-items: center } .order-item .order-header .order-header-item { width: 200px; color: #8b8b8b } .order-item .order-header .order-header-item .highlight { color: #363636 } .order-item .order-header .order-header-item .highlight.blue { color: #1c95f3 } .order-item .order-header .order-header-item .highlight.red { color: #f30a5c } .order-item .order-header .order-header-item:last-child { margin-left: auto; text-align: right } .order-item .order-body { padding: 40px 0 10px; display: flex; flex-flow: row wrap } .order-item .order-body .order-body-item { width: 170px; margin: 0 30px 30px 0 } .order-item .order-body .order-body-item:last-child { width: 200px; margin-right: 0 } .order-item .order-body .order-body-item .order-body-item-title { margin-bottom: 30px; color: #363636; line-height: 1em } .order-item .order-body .order-body-item .order-body-item-text .highlight, .order-item .order-body .order-body-item .order-body-item-text.bold { color: #363636 } .order-item .order-body .order-body-item .order-body-item-text.spaced { margin-bottom: 20px } .bio-items .bio-item { margin-bottom: 18px } .bio-items .bio-item:last-child { margin-bottom: 0 } .bio-item .bio-item-title { color: #363636; line-height: 1em } .bio-item .bio-item-text { margin-top: 16px } .player-preview { width: 218px; position: relative } .player-preview .player-preview-img-wrap { width: 100%; height: 340px; background: url("../img/teams/roster-bg.jpg") no-repeat center, linear-gradient(75deg, #1c59f3, #00d8ff); background-size: cover; position: relative } .player-preview .player-preview-img-wrap:hover .player-preview-img { -o-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1) } .player-preview .player-preview-img-wrap .player-preview-img { position: absolute; bottom: 0; left: 0; transition: transform .3s ease-in-out } .player-preview .button-more-info { width: 26px; height: 26px; border-radius: 50%; background-color: #363636; position: absolute; top: 10px; right: 10px; z-index: 2 } .player-preview .button-more-info .plus-cc-icon { fill: #fff; position: absolute; top: 8px; left: 50%; margin-left: -5px; pointer-events: none } .player-preview .player-preview-info { width: 160px; padding: 20px; margin: 0 auto; background-color: #fff; position: relative; top: -28px; text-align: center } .player-preview .player-preview-info .player-preview-nickname { color: #363636; line-height: 1em } .player-preview .player-preview-info .player-preview-name { margin-top: 10px; color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase } .player-preview .social-links { position: relative; top: -28px } .player-overview { position: relative } .player-overview .player-overview-img-wrap { width: 300px; height: 320px; background: url("../img/teams/player-bg.jpg") no-repeat center, linear-gradient(75deg, #1c59f3, #00d8ff); background-size: cover; position: relative } .player-overview .player-overview-img-wrap .player-overview-img { position: absolute; bottom: 0; left: 0 } .player-overview .overview-info-wrap { width: 900px; height: 264px; padding: 40px 0 0 30px; background-color: #fff; position: absolute; top: 28px; right: 0 } .stats-info .stats-info-item { margin-bottom: 36px } .stats-info .stats-info-item:last-child { margin-bottom: 0 } .stats-info-item { display: flex; flex-flow: row wrap; justify-content: flex-end } .stats-info-item .stats-info-item-value { margin-right: 14px; color: #363636 } .stats-info-item .stats-info-item-value .percent { font-size: 20px } .stats-info-item .stats-info-item-value .highlight:nth-child(1) { color: #7442ce } .stats-info-item .stats-info-item-value .highlight:nth-child(2) { color: #00e3d0 } .stats-info-item .stats-info-item-value .highlight:nth-child(3) { color: #777 } .stats-info-item .stats-info-item-description { width: 100px; margin-top: 1px } .stats-info-item .stats-info-item-description .stats-info-item-description-title { color: #363636; line-height: 1em } .stats-info-item .stats-info-item-description .stats-info-item-description-text { margin-top: 2px; color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase } .streamer-overview { border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; position: relative } .streamer-overview .streamer-overview-img-wrap { width: 500px; height: 442px } .streamer-overview .streamer-info { height: 364px; padding: 54px 0 0 56px; position: absolute; top: 39px; left: 470px; background-color: #fff } .streamer-overview .streamer-info .streamer-info-name { color: #363636 } .streamer-overview .streamer-info .streamer-info-description { margin-top: 12px; line-height: 1em } .streamer-overview .streamer-info .social-links { margin-top: 30px } .streamer-overview .streamer-info .overview-info-wrap { margin-top: 56px } .character-switch-list.left .character-switch-list-item { border-top-left-radius: 6px; border-bottom-left-radius: 6px } .character-switch-list.right .character-switch-list-item { border-top-right-radius: 6px; border-bottom-right-radius: 6px } .character-switch-list.hoverable .user-avatar { opacity: 0.2; cursor: pointer; transition: all .3s ease-in-out } .character-switch-list.hoverable .user-avatar.active { opacity: 1 } .character-switch-list.hoverable .user-avatar:hover { opacity: 1 } .character-switch-list .character-switch-list-item { width: 70px; height: 76px; margin-bottom: 12px; background-color: #fff; display: flex; flex-flow: row wrap; align-items: center; justify-content: center } .character-switch-list .character-switch-list-item:last-child { margin-bottom: 0 } .event-banner-img { display: block; width: 870px; height: 260px; margin: 0 auto 26px } .event-information-text { margin-top: 30px; font-size: .875em; line-height: 1.8571428571em } .information-rows { border-top: 1px solid #dbdbdb } .information-rows .information-row { height: 50px; border-bottom: 1px solid #dbdbdb; background-color: #f9f9f9; display: flex; flex-flow: row wrap; align-items: center } .information-rows .information-row .information-row-item { width: 45% } .information-rows .information-row .information-row-item .information-row-item-text { color: #777 } .information-rows .information-row .information-row-item:first-child { padding-left: 16px } .information-rows .information-row .information-row-item:last-child { width: 55% } .information-rows .information-row .information-row-item:last-child .information-row-item-text { color: #363636 } .information-rows .information-row .information-row-item:last-child .information-row-item-text.blue { color: #1c95f3 } .information-rows .information-row:nth-child(even) { background-color: #fff } .information-rows+.map-wrap { margin-top: 26px } .contact-section-wrap { background-color: #fff } .contact-section { background-color: #fff; padding-top: 100px; position: relative; top: -160px } .contact-section:before { content: ''; width: 100%; height: 480px; position: absolute; top: 0; left: 0; -webkit-box-shadow: 0px -60px 30px 0px rgba(0, 0, 0, 0.06); -moz-box-shadow: 0px -60px 30px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px -60px 30px 0px rgba(0, 0, 0, 0.06); pointer-events: none } .contact-section .contact-section-title { color: #363636; text-align: center } .contact-section .contact-section-text { width: 430px; margin: 16px auto 0; text-align: center } .contact-section .social-links { margin-top: 100px } .contact-section .contact-items { margin-top: 80px } .contact-section .contact-section-form { width: 65%; margin: 100px auto 0 } .contact-section .contact-section-form .section-title-wrap { margin-bottom: 26px } .contact-items { display: flex; flex-flow: row wrap; justify-content: space-around } .contact-item { text-align: center } .contact-item .contact-item-icon { color: #1c95f3; font-size: 34px } .contact-item .contact-item-title { margin-top: 46px; color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase } .contact-item .contact-item-text { margin-top: 10px; color: #363636; line-height: 1em } .subscribe-section-wrap { background: url("../img/other/newsletter_left.png") no-repeat left bottom, url("../img/other/newsletter_right.png") no-repeat right top, #f9f9f9; position: relative } .subscribe-section { height: 220px; padding: 50px 0 } .subscribe-section .subscribe-section-img { position: absolute; bottom: 0; left: 16% } .subscribe-section .subscribe-section-info { padding-left: 36% } .subscribe-section .subscribe-section-title { color: #363636 } .subscribe-section .subscribe-section-text { margin-top: 10px } .subscribe-section .submit-input { width: 450px; margin-top: 24px } .sponsors-title { margin-top: 40px; color: #363636; text-align: center } .sponsors-title .highlight { color: #1c95f3 } .sponsors-text { width: 430px; margin: 16px auto 0; text-align: center } .sponsors-text+.sponsor-items { margin-top: 100px } .sponsor-items { display: flex; flex-flow: row wrap; margin: 0 auto } .sponsor-items .sponsor-item { border-top: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb } .sponsor-items .sponsor-item:nth-child(3n+3) { border-right: none } .sponsor-items .sponsor-item:nth-child(1), .sponsor-items .sponsor-item:nth-child(2), .sponsor-items .sponsor-item:nth-child(3) { border-top: none } .sponsor-items+.sponsor-info { margin-top: 100px } .sponsor-item { width: 390px; height: 320px; overflow: hidden } .sponsor-item:hover .sponsor-item-img, .sponsor-item:hover .sponsor-item-text, .sponsor-item:hover .social-links, .sponsor-item:hover .sponsor-item-link { opacity: 1; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); visibility: visible } .sponsor-item .sponsor-item-img, .sponsor-item .sponsor-item-text, .sponsor-item .social-links, .sponsor-item .sponsor-item-link { -o-transform: translate(0, 76px); -moz-transform: translate(0, 76px); -ms-transform: translate(0, 76px); -webkit-transform: translate(0, 76px); transform: translate(0, 76px); transition: all .4s ease-in-out } .sponsor-item .sponsor-item-text, .sponsor-item .social-links, .sponsor-item .sponsor-item-link { opacity: 0; visibility: hidden } .sponsor-item .sponsor-item-img { display: block; margin: 26px auto 0; opacity: 0.2 } .sponsor-item .sponsor-item-text { width: 280px; margin: 26px auto 0; text-align: center } .sponsor-item .social-links { margin-top: 20px } .sponsor-item .sponsor-item-link { margin-top: 30px; color: #363636; text-align: center } .sponsor-info .sponsor-info-title { color: #363636; text-align: center } .sponsor-info .sponsor-info-text { margin-top: 20px; text-align: center } .sponsor-info .sponsor-info-text a { color: #1c95f3; font-weight: 500 } .faq-items { width: 770px; margin: 0 auto } .faq-items .faq-item { border-bottom: 1px solid #dbdbdb } .faq-item.selected .faq-item-trigger .faq-item-decoration { background-color: #f30a5c } .faq-item.selected .faq-item-trigger .faq-item-decoration .plus-cc-icon { display: none } .faq-item.selected .faq-item-trigger .faq-item-decoration .minus-cc-icon { display: block } .faq-item .faq-item-trigger { height: 96px; display: flex; flex-flow: row wrap; align-items: center; cursor: pointer } .faq-item .faq-item-trigger .faq-item-title { color: #363636 } .faq-item .faq-item-trigger .faq-item-decoration { margin-left: 16px; width: 18px; height: 18px; border-radius: 50%; background-color: #1c95f3; display: flex; flex-flow: row wrap; justify-content: center; align-items: center } .faq-item .faq-item-trigger .faq-item-decoration .plus-cc-icon, .faq-item .faq-item-trigger .faq-item-decoration .minus-cc-icon { fill: #fff; pointer-events: none } .faq-item .faq-item-trigger .faq-item-decoration .minus-cc-icon { display: none } .faq-item .faq-item-text { margin-top: 30px; font-size: .875em; line-height: 1.8571428571em } .faq-item .faq-item-text:first-child { margin-top: 0 } .faq-item .faq-item-img { width: 700px; height: 420px; margin-top: 40px } .faq-item .faq-item-img+.faq-item-text { margin-top: 36px } .faq-item .faq-item-footer { height: 84px; margin-top: 30px; border-top: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .faq-item .faq-item-footer .faq-item-footer-item { display: flex; flex-flow: row wrap; align-items: center } .faq-item .faq-item-footer .faq-item-footer-text { color: #363636 } .faq-item .faq-item-footer .faq-item-footer-text .light { color: #8b8b8b } .faq-item .faq-item-footer .faq-item-actions { margin-left: 24px; display: flex; flex-flow: row wrap } .faq-item .faq-item-footer .faq-item-actions .faq-item-action { margin-right: 16px } .faq-item .faq-item-footer .faq-item-actions .faq-item-action:last-child { margin-right: 0 } @media screen and (max-width: 1500px) { .subscribe-section .subscribe-section-img { display: none } .subscribe-section .subscribe-section-info { padding-left: 26% } } @media screen and (max-width: 1260px) { .team-info-wrap.v3 .team-info { margin-left: 0 } .team-info-wrap.v3.inverted .team-info { margin-right: 0 } .order-item.v2 .order-body { justify-content: center } .order-item.v2 .order-body .order-body-item { width: 200px; margin: 0 0 40px 0; padding-right: 30px } .order-item.v2 .order-body .order-body-item:last-child { width: 200px } .order-item .order-header .order-header-item { width: auto; margin-right: 30px } .order-item .order-header .order-header-item:last-child { margin-right: 0 } .order-item .order-body { justify-content: center } .player-overview .player-overview-img-wrap { margin: 0 auto } .player-overview .overview-info-wrap { width: 100%; height: auto; position: static; justify-content: space-evenly } .player-overview .overview-info-wrap .overview-info, .player-overview .overview-info-wrap .stats-info { margin: 0 0 30px 0 } .player-overview .overview-info-wrap .overview-info { width: auto; margin-right: 20px } .streamer-overview .streamer-overview-img-wrap { margin: 0 auto } .streamer-overview .streamer-info { height: auto; padding: 54px 0 10px; position: static; text-align: center } .streamer-overview .streamer-info .streamer-info-name { font-size: 2.875em } .streamer-overview .streamer-info .social-links { justify-content: center } .streamer-overview .streamer-info .overview-info-wrap { margin-top: 40px; justify-content: center } .streamer-overview .streamer-info .overview-info-wrap .overview-info { margin-bottom: 26px } .filters-row { padding: 0 20px; justify-content: center } .filters-row .forum-home-link { position: static; width: 200px; margin: 0 10px 20px 0; padding: 0; text-align: center } .filters-row .dropdown-simple-wrap { order: 1; margin-bottom: 20px } .filters-row .option-list { width: 100%; margin-top: 10px; order: 3; justify-content: center } .filters-row .forum-actions { order: 2; position: static } .contact-section .contact-section-form { width: 80% } .subscribe-section-wrap { background: #f9f9f9 } .subscribe-section-wrap .subscribe-section-info { padding: 0; text-align: center } .subscribe-section-wrap .submit-input { margin: 24px auto 0 } .sponsor-items { width: 780px } .sponsor-items .sponsor-item:nth-child(3n+3) { border-right: 1px solid #dbdbdb } .sponsor-items .sponsor-item:nth-child(2n+2) { border-right: none } .sponsor-items .sponsor-item:nth-child(3) { border-top: 1px solid #dbdbdb } .faq-items { width: 100% } } @media screen and (max-width: 960px) { .character-selection-list { display: block; height: auto; padding: 26px 0 } .character-selection-list .character-list { justify-content: center } .character-selection-list .character-selection-list-text { margin: 26px 0; text-align: center } .team-info-wrap.v2 .team-info, .team-info-wrap.v3 .team-info { display: none } .filters-row .dropdown-simple-wrap .form-wrap { width: 270px } .filter-heading.multiple-items { display: block; min-height: 40px; padding-top: 16px } .event-banner-img { width: 435px; height: 130px } .sponsor-items { width: 390px } .sponsor-items .sponsor-item { border: none } .sponsor-items .sponsor-item:nth-child(3n+3) { border: none } .sponsor-item .sponsor-item-img, .sponsor-item .sponsor-item-text, .sponsor-item .social-links, .sponsor-item .sponsor-item-link { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0); transition: all .4s ease-in-out } .sponsor-item .sponsor-item-img, .sponsor-item .sponsor-item-text, .sponsor-item .social-links, .sponsor-item .sponsor-item-link { opacity: 1; visibility: visible } .sponsor-item .sponsor-item-text { width: 90% } .faq-item .faq-item-img { width: 350px; height: 210px } } @media screen and (max-width: 680px) { .bullet-list { padding: 0 } .bullet-list-item { display: block; text-align: center } .bullet-list-item-text { width: 80%; margin: 20px auto 0 } .error-display { padding-top: 246px } .error-display .error-img { width: 216px; height: 207px; margin-left: -80px } .error-display .error-text { width: 90% } .error-display+.section-actions { margin-top: 40px } .section-actions { flex-direction: column; align-items: center } .section-actions .button { display: inline-block } .section-actions .button+.button { margin: 20px 0 0 } .team-info-wrap.v2 .team-logo-wrap { width: 100px } .team-info-wrap.v2.inverted .team-logo-wrap .team-logo { left: -60px } .team-info-wrap.v3 .team-logo-wrap { width: 140px } .team-info-wrap.v3.inverted .team-logo-wrap .team-logo { left: 0 } .streamer-overview .streamer-overview-img-wrap { width: 100% } .event-banner-img { display: none } .contact-section .contact-section-title { font-size: 2.5em } .contact-section .contact-section-text { width: 90% } .contact-section .contact-section-form { width: 90% } .contact-section .contact-items { justify-content: center } .contact-section .contact-items .contact-item { width: 100%; margin-bottom: 40px } .contact-section .social-links { margin-top: 40px } .subscribe-section-wrap .submit-input { width: 90% } .sponsors-title { margin-top: 20px; font-size: 2.5em } .sponsors-text { width: 90% } .sponsors-text+.sponsor-items { margin-top: 60px } .sponsor-items { width: 270px } .sponsor-items .sponsor-item { width: 270px } .faq-item .faq-item-trigger .faq-item-title { font-size: .875em } } @media screen and (max-width: 480px) { .page-navigation { justify-content: center } .page-navigation.right { justify-content: center } .page-navigation .slider-control.big { width: 30px; height: 30px } .page-navigation .slider-control.big .arrow-icon { top: 10px } .page-navigation .page-navigation-item { width: 30px; height: 30px; line-height: 30px } } .s-icon { color: #1e1f20 } .play-button-icon { width: 12px; height: 14px; fill: #fff } .play-button-icon.tiny { width: 8px; height: 10px } .play-button-icon.big { width: 24px; height: 28px } .bullet-icon, .tower-icon, .shield-icon, .plus-icon { width: 16px; height: 20px; fill: #363636 } .bullet-icon.big, .tower-icon.big, .shield-icon.big, .plus-icon.big { width: 22px; height: 28px } .shield-icon.big { width: 24px } .plus-icon { height: 16px } .plus-icon.rate-up { fill: #00e3d0; width: 6px; height: 6px } .plus-icon.big { width: 28px } .rating-ornament-icon { width: 10px; height: 9px } .arrow-icon { width: 3px; height: 5px } .arrow-icon.big { width: 9px; height: 15px } .arrow-icon.medium { width: 6px; height: 10px } .cross-icon.big { width: 15px; height: 15px } .cross-icon.small { width: 10px; height: 10px } .cross-cb-icon { fill: #fff; width: 16px; height: 16px } .cross-cb-icon.small { width: 8px; height: 8px } .search-icon, .inventory-icon, .inventory-close-icon { fill: #363636; width: 24px; height: 24px } .search-icon.small { width: 16px; height: 16px } .inventory-icon-points { fill: #afafaf } .inventory-icon-points-light { fill: #f1f1f1 } .plus-cc-icon, .minus-cc-icon { fill: #363636; width: 8px; height: 8px } .plus-cc-icon.medium, .minus-cc-icon.medium { width: 10px; height: 10px } .minus-cc-icon.rate-down { fill: #f30a5c; width: 6px; height: 6px } .plus-cc-2-icon { width: 12px; height: 12px } .hexagon-icon.hexagon-border { fill: #dbdbdb; width: 80px; height: 86px } .hexagon-icon.hexagon-fill { fill: #2c2f3c; width: 68px; height: 74px } .menu-pull-icon { fill: #fff; width: 22px; height: 14px } .facebook-icon, .twitter-icon, .instagram-icon, .twitch-icon, .gplus-icon, .youtube-icon { fill: #fff } .facebook-icon { width: 12px; height: 12px } .facebook-icon.big { width: 14px; height: 14px } .twitter-icon { width: 12px; height: 10px } .twitter-icon.big { width: 16px; height: 13px } .instagram-icon { width: 12px; height: 12px } .instagram-icon.big { width: 14px; height: 14px } .twitch-icon { width: 12px; height: 13px } .twitch-icon.big { width: 14px; height: 15px } .gplus-icon { width: 15px; height: 9px } .gplus-icon.big { width: 18px; height: 12px } .youtube-icon { width: 14px; height: 12px } .live-icon { display: inline-block; width: 5px; height: 5px; background-color: #f30a5c; border-radius: 50% } .check-icon { width: 16px; height: 13px } .check-icon.medium { width: 20px; height: 16px } .exclamation-icon { width: 6px; height: 20px } .bars-icon { width: 11px; height: 10px } .skull-icon.blue, .pliers-icon.blue, .explosion-icon.blue, .stopwatch-icon.blue { fill: #57a9ee } .skull-icon.yellow, .pliers-icon.yellow, .explosion-icon.yellow, .stopwatch-icon.yellow { fill: #e5bf65 } .skull-icon { width: 22px; height: 22px } .pliers-icon { width: 22px; height: 22px } .explosion-icon { width: 30px; height: 30px } .stopwatch-icon { width: 22px; height: 22px } .featured-corner-icon { width: 24px; height: 24px; fill: #dbdbdb } .role-top-icon, .role-jungler-icon, .role-middle-icon, .role-adcarry-icon, .role-support-icon { width: 20px; height: 20px; fill: #d6d6d6 } .calendar-icon { width: 24px; height: 24px } .baron-icon, .dragon-icon, .inhibitor-icon, .rift-herald-icon, .tower-icon { width: 20px; height: 20px; fill: #363636 } .baron-icon.red, .dragon-icon.red, .inhibitor-icon.red, .rift-herald-icon.red, .tower-icon.red { fill: #f30a5c } .baron-icon.blue, .dragon-icon.blue, .inhibitor-icon.blue, .rift-herald-icon.blue, .tower-icon.blue { fill: #107df8 } .track-icon { width: 10px; height: 10px; fill: #363636 } .close-icon { width: 24px; height: 24px; color: #363636 } .grid-icon, .list-icon { fill: #dbdbdb; width: 10px; height: 10px } .tag-ornament { display: inline-block; padding: 0 10px; background-color: #252627; color: #fff; font-family: "Roboto", sans-serif; font-size: .625em; line-height: 20px; font-weight: 900; text-transform: uppercase } .tag-ornament.bold { font-weight: 700 } .tag-ornament.blue { background-color: #1c95f3 } .tag-ornament.red { background-color: #f30a5c } .tag-ornament.green { background-color: #58d819 } .tag-ornament.yellow { background-color: #ffb400 } .tag-ornament.cyan { background-color: #00e3d0 } .tag-ornament.violet { background-color: #7442ce } .rating-ornament { padding: 2px 6px 4px; background-color: rgba(0, 0, 0, 0.75) } .rating-ornament:after { content: ''; display: table; clear: both } .rating-ornament.void { background-color: transparent } .rating-ornament.small .rating-ornament-icon { width: 8px; height: 8px } .rating-ornament.medium .rating-ornament-icon { width: 12px; height: 12px } .rating-ornament.yellow .rating-ornament-icon { fill: #ffd800 } .rating-ornament.yellow .rating-ornament-icon.empty { fill: #dbdbdb } .rating-ornament .rating-ornament-item { float: left; margin-right: 3px } .rating-ornament .rating-ornament-item.empty { fill: #b8b8b8 } .rating-ornament .rating-ornament-item:last-child { margin-right: 0 } .bubble-ornament { display: inline-block; width: 30px; height: 30px; border-radius: 50%; background-color: #dbdbdb; text-align: center; cursor: pointer; position: relative } .bubble-ornament.no-link { cursor: auto } .bubble-ornament>* { position: relative; z-index: 6666 } .bubble-ornament .bubble-ornament-info, .bubble-ornament .bubble-ornament-text { color: #fff } .bubble-ornament .hover-replace { opacity: 0; visibility: hidden; position: absolute; top: 29px; left: 60px } .bubble-ornament.big { width: 55px; height: 55px; padding-top: 10px } .bubble-ornament.big.smaller { width: 48px; height: 48px } .bubble-ornament.big.smaller .hover-replace { top: 27px } .bubble-ornament.big.smaller .bubble-ornament-text { font-size: .5625em } .bubble-ornament.big.smaller .facebook-icon, .bubble-ornament.big.smaller .twitter-icon, .bubble-ornament.big.smaller .instagram-icon, .bubble-ornament.big.smaller .twitch-icon { top: 0; margin-bottom: 1px } .bubble-ornament.big.smaller .gplus-icon { top: 4px; margin-bottom: 3px } .bubble-ornament.big:after { border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 14px solid transparent } .bubble-ornament.big .heart-icon, .bubble-ornament.big .tag-icon, .bubble-ornament.big .reply-icon, .bubble-ornament.big .share-icon, .bubble-ornament.big .report-icon, .bubble-ornament.big .like-icon, .bubble-ornament.big .dislike-icon { line-height: 1em } .bubble-ornament.big .cross-cb-icon { top: 0 } .bubble-ornament.big .facebook-icon, .bubble-ornament.big .twitter-icon, .bubble-ornament.big .instagram-icon, .bubble-ornament.big .twitch-icon { top: 2px; margin-bottom: 3px } .bubble-ornament.big .gplus-icon { width: 19px; height: 12px; top: 5px; margin-bottom: 6px } .bubble-ornament.big .youtube-icon { width: 16px; height: 14px; top: 2px; margin-bottom: 4px } .bubble-ornament.big .bubble-ornament-text { margin-top: 4px } .bubble-ornament.medium { width: 50px; height: 50px } .bubble-ornament.medium .heart-icon, .bubble-ornament.medium .tag-icon, .bubble-ornament.medium .reply-icon, .bubble-ornament.medium .share-icon, .bubble-ornament.medium .report-icon, .bubble-ornament.medium .like-icon, .bubble-ornament.medium .dislike-icon, .bubble-ornament.medium .bubbles-icon { color: #fff; font-size: 24px; line-height: 50px } .bubble-ornament.medium .heart-icon, .bubble-ornament.medium .tag-icon, .bubble-ornament.medium .reply-icon, .bubble-ornament.medium .share-icon, .bubble-ornament.medium .report-icon, .bubble-ornament.medium .like-icon, .bubble-ornament.medium .dislike-icon { font-size: 20px } .bubble-ornament.medium .cross-cb-icon { width: 16px; height: 16px; top: 16px } .bubble-ornament.medium .facebook-icon, .bubble-ornament.medium .twitter-icon, .bubble-ornament.medium .instagram-icon, .bubble-ornament.medium .twitch-icon, .bubble-ornament.medium .gplus-icon, .bubble-ornament.medium .youtube-icon { top: 16px } .bubble-ornament.medium .facebook-icon, .bubble-ornament.medium .twitter-icon, .bubble-ornament.medium .instagram-icon, .bubble-ornament.medium .twitch-icon { width: 16px; height: 16px } .bubble-ornament.medium .twitter-icon { width: 18px; height: 18px; top: 18px } .bubble-ornament.medium .gplus-icon { width: 20px; height: 20px; top: 18px } .bubble-ornament.medium .youtube-icon { width: 20px; height: 20px } .bubble-ornament.medium .bubble-ornament-info { font-size: 1.25em; line-height: 50px } .bubble-ornament.small { width: 24px; height: 24px } .bubble-ornament.small .bubble-ornament-info { line-height: 24px } .bubble-ornament.small .cross-cb-icon { top: 3px } .bubble-ornament.tiny { width: 22px; height: 22px } .bubble-ornament.tiny .cross-cb-icon { width: 8px; height: 8px; top: 1px } .bubble-ornament.tiny .heart-icon, .bubble-ornament.tiny .tag-icon, .bubble-ornament.tiny .dislike-icon { line-height: 24px } .bubble-ornament.tiny .reply-icon, .bubble-ornament.tiny .share-icon { font-size: 11px; line-height: 22px } .bubble-ornament.tiny .heart-icon, .bubble-ornament.tiny .like-icon, .bubble-ornament.tiny .dislike-icon { font-size: 10px } .bubble-ornament.tiny .tag-icon { font-size: 11px } .bubble-ornament.tiny .report-icon { font-size: 12px; line-height: 22px } .bubble-ornament.tiny .like-icon { line-height: 22px } .bubble-ornament:after { content: ''; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 12px solid transparent; position: absolute; bottom: -2px; left: -2px; -o-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg) } .bubble-ornament.cyan { background-color: #00e3d0 } .bubble-ornament.cyan:after { border-top-color: #00e3d0 } .bubble-ornament.blue { background-color: #1c95f3 } .bubble-ornament.blue:after { border-top-color: #1c95f3 } .bubble-ornament.violet { background-color: #7442ce } .bubble-ornament.violet:after { border-top-color: #7442ce } .bubble-ornament.red { background-color: #f30a5c } .bubble-ornament.red:after { border-top-color: #f30a5c } .bubble-ornament.green { background-color: #58d819 } .bubble-ornament.green:after { border-top-color: #58d819 } .bubble-ornament.pink { background-color: #f9288a } .bubble-ornament.pink:after { border-top-color: #f9288a } .bubble-ornament.black { background-color: #363636 } .bubble-ornament.black:after { border-top-color: #363636 } .bubble-ornament.fb { background-color: #4153b3 } .bubble-ornament.fb:after { border-top-color: #4153b3 } .bubble-ornament.twt { background-color: #10caff } .bubble-ornament.twt:after { border-top-color: #10caff } .bubble-ornament.insta { background-color: #f9288a } .bubble-ornament.insta:after { border-top-color: #f9288a } .bubble-ornament.twitch { background-color: #7442ce } .bubble-ornament.twitch:after { border-top-color: #7442ce } .bubble-ornament.gplus { background-color: #ffb400 } .bubble-ornament.gplus:after { border-top-color: #ffb400 } .bubble-ornament.youtube { background-color: #eb1940 } .bubble-ornament.youtube:after { border-top-color: #eb1940 } .bubble-ornament.hoverable { background-color: #dbdbdb; transition: all .3s ease-in-out } .bubble-ornament.hoverable:after { border-top-color: #dbdbdb; transition: all .3s ease-in-out } .bubble-ornament.hoverable:hover.cyan { background-color: #00e3d0 } .bubble-ornament.hoverable:hover.cyan:after { border-top-color: #00e3d0 } .bubble-ornament.hoverable:hover.blue { background-color: #1c95f3 } .bubble-ornament.hoverable:hover.blue:after { border-top-color: #1c95f3 } .bubble-ornament.hoverable:hover.violet { background-color: #7442ce } .bubble-ornament.hoverable:hover.violet:after { border-top-color: #7442ce } .bubble-ornament.hoverable:hover.red { background-color: #f30a5c } .bubble-ornament.hoverable:hover.red:after { border-top-color: #f30a5c } .bubble-ornament.hoverable:hover.pink { background-color: #f9288a } .bubble-ornament.hoverable:hover.pink:after { border-top-color: #f9288a } .bubble-ornament.hoverable:hover.black { background-color: #363636 } .bubble-ornament.hoverable:hover.black:after { border-top-color: #363636 } .bubble-ornament.hoverable:hover.fb { background-color: #4153b3 } .bubble-ornament.hoverable:hover.fb:after { border-top-color: #4153b3 } .bubble-ornament.hoverable:hover.twt { background-color: #10caff } .bubble-ornament.hoverable:hover.twt:after { border-top-color: #10caff } .bubble-ornament.hoverable:hover.insta { background-color: #f9288a } .bubble-ornament.hoverable:hover.insta:after { border-top-color: #f9288a } .bubble-ornament.hoverable:hover.twitch { background-color: #7442ce } .bubble-ornament.hoverable:hover.twitch:after { border-top-color: #7442ce } .bubble-ornament.hoverable:hover.gplus { background-color: #ffb400 } .bubble-ornament.hoverable:hover.gplus:after { border-top-color: #ffb400 } .bubble-ornament.hoverable:hover.youtube { background-color: #eb1940 } .bubble-ornament.hoverable:hover.youtube:after { border-top-color: #eb1940 } .bubble-ornament .heart-icon, .bubble-ornament .tag-icon, .bubble-ornament .reply-icon, .bubble-ornament .share-icon, .bubble-ornament .report-icon, .bubble-ornament .like-icon, .bubble-ornament .dislike-icon { color: #fff } .bubble-ornament .track-icon { fill: #fff; margin-top: 10px } .bubble-ornament .heart-icon, .bubble-ornament .tag-icon, .bubble-ornament .dislike-icon { line-height: 32px } .bubble-ornament .reply-icon, .bubble-ornament .share-icon { font-size: 14px; line-height: 30px } .bubble-ornament .heart-icon, .bubble-ornament .like-icon, .bubble-ornament .dislike-icon { font-size: 12px } .bubble-ornament .tag-icon { font-size: 13px; position: relative; right: 1px } .bubble-ornament .report-icon { font-size: 15px; line-height: 30px } .bubble-ornament .like-icon { line-height: 30px } .bubble-ornament .cross-cb-icon { fill: #fff; width: 10px; height: 10px; position: relative; top: 6px } .bubble-ornament .facebook-icon, .bubble-ornament .instagram-icon, .bubble-ornament .youtube-icon { position: relative; top: 8px } .bubble-ornament .twitter-icon, .bubble-ornament .gplus-icon { position: relative; top: 7px } .bubble-ornament .twitch-icon { position: relative; top: 9px } .bubble-ornament .plus-cc-2-icon { fill: #fff; position: relative; top: 7px } .tag-quantity { height: 16px; padding: 4px 6px 0; background-color: #363636 } .tag-quantity .tag-quantity-text { color: #fff; text-transform: none } .social-links { display: flex; flex-flow: row wrap } .social-links .social-link { margin-right: 26px } .social-links .social-link:last-child { margin-right: 0 } .social-links .social-link .facebook-icon, .social-links .social-link .twitter-icon, .social-links .social-link .instagram-icon, .social-links .social-link .twitch-icon, .social-links .social-link .gplus-icon, .social-links .social-link .youtube-icon { width: 14px; height: 14px; fill: #dbdbdb; transition: .2s fill ease-in-out } .social-links .social-link .gplus-icon { position: relative; top: 2px } .social-links .social-link:hover .facebook-icon { fill: #4153b3 } .social-links .social-link:hover .twitter-icon { fill: #10caff } .social-links .social-link:hover .instagram-icon { fill: #f9288a } .social-links .social-link:hover .twitch-icon { fill: #7442ce } .social-links .social-link:hover .gplus-icon { fill: #ffb400 } .social-links .social-link:hover .youtube-icon { fill: #eb1940 } .social-links .bubble-ornament { margin-right: 14px } .social-links .bubble-ornament:last-child { margin-right: 0 } .social-links.medium .bubble-ornament { margin-right: 16px } .social-links.medium .bubble-ornament:last-child { margin-right: 0 } .social-links.aligned { align-items: center } .social-links.centered { justify-content: center } .social-links.vertical { width: auto; flex-direction: column } .social-links.vertical .bubble-ornament { margin-right: 0; margin-bottom: 16px } .social-links.vertical .bubble-ornament:last-child { margin-bottom: 0 } .social-links .bubble-ornament { transition: all .3s ease-in-out } .social-links .bubble-ornament:hover { -o-transform: translate(0, -5px); -moz-transform: translate(0, -5px); -ms-transform: translate(0, -5px); -webkit-transform: translate(0, -5px); transform: translate(0, -5px) } .social-links.animated { overflow: hidden } .social-links.animated .bubble-ornament .bubble-ornament-text { transition: all .3s ease-in-out } .social-links.animated .bubble-ornament:hover { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .social-links.animated .bubble-ornament:hover .bubble-ornament-text { opacity: 0; visibility: hidden } .social-links.animated .bubble-ornament:hover .bubble-ornament-text.hover-replace { visibility: visible; opacity: 1; -o-transform: translate(-49px, 0); -moz-transform: translate(-49px, 0); -ms-transform: translate(-49px, 0); -webkit-transform: translate(-49px, 0); transform: translate(-49px, 0) } .social-links.animated .bubble-ornament:hover.big.smaller .bubble-ornament-text.hover-replace { -o-transform: translate(-50px, 0); -moz-transform: translate(-50px, 0); -ms-transform: translate(-50px, 0); -webkit-transform: translate(-50px, 0); transform: translate(-50px, 0) } .tag-list { display: flex; flex-flow: row wrap } .tag-list .tag-item { margin: 0 6px 10px 0 } .tag-list .tag-item:last-child { margin-right: 0 } .tag-list .tag-ornament { margin-right: 8px } .tag-list.violet .tag-item:hover { background-color: #7442ce; border-color: #7442ce } .tag-item { display: inline-block; height: 25px; padding: 0 12px; border: 1px solid #dbdbdb; border-radius: 200px; color: #777; font-family: "Roboto", sans-serif; font-size: .75em; line-height: 25px } .tag-item:hover { color: #fff; font-weight: 700; background-color: #1c95f3; border-color: #1c95f3 } .photo-list { display: grid; grid-template-columns: repeat(4, 60px); grid-gap: 10px; justify-content: center; position: relative; min-height: 120px } .photo-list .loader { position: absolute; top: 30px; left: 50%; margin-left: -20px } .photo-list .loader-error { width: 100%; position: absolute; top: 30px } .photo-item-wrap { display: inline-block; width: 60px; height: 60px; position: relative; animation: translate-from-bottom .5s ease-in-out } .photo-item-wrap:hover .photo-item-overlay { opacity: 1; visibility: visible } .photo-item-wrap:hover .plus-cc-icon { -o-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1) } .photo-item-wrap .photo-item { width: 100%; height: 100% } .photo-item-wrap .plus-cc-icon { width: 20px; height: 20px; fill: #fff; position: absolute; top: 20px; left: 20px; -o-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); transition: all .3s ease-in-out } .photo-item-wrap .photo-item-overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(249, 40, 138, 0.8); opacity: 0; visibility: hidden; transition: all .3s ease-in-out } .button { display: inline-block; height: 46px; border-radius: 200px; padding: 0 68px 0 34px; background-color: #363636; color: #fff; font-family: "Exo", sans-serif; font-size: .6875em; font-weight: 800; line-height: 46px; text-transform: uppercase; cursor: pointer; transition: background-color .2s ease-in-out; position: relative } .button.no-decoration { padding: 0 34px; text-align: center } .button.full { width: 100%; padding: 0; text-align: center } .button.big { height: 55px; padding: 0 92px 0 52px; font-size: .875em; line-height: 55px } .button.big .button-ornament { width: 43px; height: 43px } .button.big .arrow-icon { top: 14px; left: 19px } .button.big .cross-icon { top: 14px; margin-left: -7px } .button.small { height: 34px; padding: 0 24px; font-size: .625em; line-height: 34px } .button.tiny { height: 27px; padding: 0 32px 0 14px; font-size: .5625em; line-height: 27px } .button.tiny.disabled .cross-icon { width: 9px; height: 9px } .button.tiny .button-ornament { width: 21px; height: 21px; top: 3px; right: 3px } .button.tiny .arrow-icon { top: 8px; left: 10px } .button.tiny .cross-icon { top: 6px } .button.tiny:hover .arrow-icon { -o-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg) } .button.disabled { color: #8b8b8b; background-color: #363636; pointer-events: none } .button.disabled .button-ornament { background-color: #777 } .button.disabled .arrow-icon { display: none } .button.disabled .cross-icon { display: block } .button.disabled:hover { background-color: #363636 } .button.disabled:hover .button-ornament { background-color: #777 } .button.blue.disabled, .button.red.disabled, .button.green.disabled, .button.violet.disabled, .button.yellow.disabled, .button.cyan.disabled, .button.gray.disabled { color: #8b8b8b; background-color: #363636 } .button.blue.disabled .button-ornament, .button.red.disabled .button-ornament, .button.green.disabled .button-ornament, .button.violet.disabled .button-ornament, .button.yellow.disabled .button-ornament, .button.cyan.disabled .button-ornament, .button.gray.disabled .button-ornament { background-color: #777 } .button.blue.disabled .arrow-icon, .button.red.disabled .arrow-icon, .button.green.disabled .arrow-icon, .button.violet.disabled .arrow-icon, .button.yellow.disabled .arrow-icon, .button.cyan.disabled .arrow-icon, .button.gray.disabled .arrow-icon { display: none } .button.blue.disabled .cross-icon, .button.red.disabled .cross-icon, .button.green.disabled .cross-icon, .button.violet.disabled .cross-icon, .button.yellow.disabled .cross-icon, .button.cyan.disabled .cross-icon, .button.gray.disabled .cross-icon { display: block } .button.blue.disabled:hover, .button.red.disabled:hover, .button.green.disabled:hover, .button.violet.disabled:hover, .button.yellow.disabled:hover, .button.cyan.disabled:hover, .button.gray.disabled:hover { background-color: #363636 } .button.blue.disabled:hover .button-ornament, .button.red.disabled:hover .button-ornament, .button.green.disabled:hover .button-ornament, .button.violet.disabled:hover .button-ornament, .button.yellow.disabled:hover .button-ornament, .button.cyan.disabled:hover .button-ornament, .button.gray.disabled:hover .button-ornament { background-color: #777 } .button.blue { background-color: #1c95f3 } .button.blue .button-ornament { background-color: #0270c5 } .button.blue:hover { background-color: #3ca4f5 } .button.red { background-color: #f30a5c } .button.red .button-ornament { background-color: #bd0244 } .button.red:hover { background-color: #f52d73 } .button.green { background-color: #58d819 } .button.green .button-ornament { background-color: #37a800 } .button.green:hover { background-color: #70de39 } .button.violet { background-color: #7442ce } .button.violet .button-ornament { background-color: #4d2498 } .button.violet:hover { background-color: #885dd5 } .button.cyan { background-color: #00e3d0 } .button.cyan .button-ornament { background-color: #00ab9d } .button.cyan:hover { background-color: #24e7d7 } .button.yellow { background-color: #ffb400 } .button.yellow .button-ornament { background-color: #ee7c00 } .button.yellow:hover { background-color: #ffbf24 } .button.gray { background-color: #dbdbdb } .button.gray .button-ornament { background-color: #b2b2b2 } .button.gray:hover { background-color: #1c95f3 } .button.gray:hover .button-ornament { background-color: #0270c5 } .button.fb { background-color: #4153b3 } .button.twt { background-color: #10caff } .button.gplus { background-color: #ffb400 } .button:hover .arrow-icon { -o-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg) } .button .button-ornament { width: 34px; height: 34px; border-radius: 50%; background-color: #777; position: absolute; top: 6px; right: 6px } .button .track-icon { fill: #fff } .button .arrow-icon { fill: #fff; position: absolute; top: 12px; left: 15px; transition: transform .3s ease-in-out } .button .cross-icon { fill: #fff; position: absolute; top: 12px; left: 50%; margin-left: -5px; display: none } .button-social { width: 220px; height: 46px; border-radius: 200px; color: #fff; line-height: 46px; text-align: center } .button-social.big { width: 278px } .button-social.fb { background-color: #4153b3 } .button-social.twt { background-color: #10caff } .button-social.gplus { background-color: #ffb400 } .button-social .facebook-icon { position: relative; top: 2px; margin-right: 6px } .button-social .twitter-icon { position: relative; top: 1px; margin-right: 8px } .button-social .gplus-icon { position: relative; top: 2px; margin-right: 6px } .button-social-list { display: flex; flex-flow: row wrap } .button-social-list.big .button-social { margin-right: 18px } .button-social-list .button-social { margin-right: 20px } .button-social-list .button-social:last-child { margin-right: 0 } .button-replay { color: #363636; cursor: pointer } .button-replay:hover { color: #7442ce } .button-replay .play-button-icon { fill: #7442ce; position: relative; top: 1px; margin-right: 6px } .decorated-link { color: #363636; cursor: pointer } .decorated-link:hover { color: #7442ce } .decorated-link.red { color: #f30a5c } .decorated-link .bars-icon { fill: #7442ce; margin-right: 6px } .link-text-form { color: #8b8b8b; transition: all .15s ease-in-out } .link-text-form.blue:hover { color: #1c95f3 } .link-text-form.red:hover { color: #f30a5c } .link-text-form.yellow:hover { color: #ffb400 } .link-text-form.green:hover { color: #58d819 } .link-text-form.violet:hover { color: #7442ce } .link-text-form.cyan:hover { color: #00e3d0 } .button-popup-demo { display: block; width: 200px; margin: 40px auto 80px; text-align: center } label { display: block; color: #363636; font-family: "Exo", sans-serif; font-size: .6875em; text-transform: uppercase } label.required:after { content: '*'; position: relative; left: 2px } label.blue.required:after { color: #1c95f3 } label.red.required:after { color: #f30a5c } label.green.required:after { color: #58d819 } label.yellow.required:after { color: #ffb400 } label.violet.required:after { color: #7442ce } label.cyan.required:after { color: #00e3d0 } label+input, label+textarea, label+.submit-input, label+.select-block, label+.counter { margin-top: 12px } .rl-label { font-weight: 700 } ::-webkit-input-placeholder { opacity: .4 } :-ms-input-placeholder { opacity: .4 } ::-ms-placeholder { opacity: .4 } input[type="text"].blue:focus, input[type="password"].blue:focus, input[type="email"].blue:focus, textarea.blue:focus { border-color: #1c95f3 } input[type="text"].red:focus, input[type="password"].red:focus, input[type="email"].red:focus, textarea.red:focus { border-color: #f30a5c } input[type="text"].green:focus, input[type="password"].green:focus, input[type="email"].green:focus, textarea.green:focus { border-color: #58d819 } input[type="text"].violet:focus, input[type="password"].violet:focus, input[type="email"].violet:focus, textarea.violet:focus { border-color: #7442ce } input[type="text"].yellow:focus, input[type="password"].yellow:focus, input[type="email"].yellow:focus, textarea.yellow:focus { border-color: #ffb400 } input[type="text"].cyan:focus, input[type="password"].cyan:focus, input[type="email"].cyan:focus, textarea.cyan:focus { border-color: #00e3d0 } input[type="text"], input[type="password"], input[type="email"], textarea, select { width: 100%; border: 1px solid #dbdbdb; background-color: #fff; color: #363636; font-family: "Roboto", sans-serif; font-size: .8125em; transition: border-color .2s ease-in-out } input[type="text"]:disabled, input[type="password"]:disabled, input[type="email"]:disabled, textarea:disabled, select:disabled { background-color: #dbdbdb; pointer-events: none } input[type="text"], input[type="password"], input[type="email"], select { height: 46px; padding: 0 20px; border-radius: 200px } input[type="text"].input-line, input[type="password"].input-line, input[type="email"].input-line { border-radius: 0; border: none; border-bottom: 1px solid rgba(255, 255, 255, 0.4); background-color: transparent; color: #fff } textarea { min-height: 160px; padding: 12px 20px; border-radius: 24px } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer } input[type="checkbox"], input[type="radio"] { display: none } input[type="checkbox"]:checked+.checkbox-box { border-color: #363636; background-color: #363636 } input[type="checkbox"]:checked+.checkbox-box.blue { border-color: #1c95f3; background-color: #1c95f3 } input[type="checkbox"]:checked+.checkbox-box.red { border-color: #f30a5c; background-color: #f30a5c } input[type="checkbox"]:checked+.checkbox-box.green { border-color: #58d819; background-color: #58d819 } input[type="checkbox"]:checked+.checkbox-box.violet { border-color: #7442ce; background-color: #7442ce } input[type="checkbox"]:checked+.checkbox-box.yellow { border-color: #ffb400; background-color: #ffb400 } input[type="checkbox"]:checked+.checkbox-box.cyan { border-color: #00e3d0; background-color: #00e3d0 } input[type="checkbox"]:checked+.checkbox-box .cross-cb-icon { display: block } input[type="checkbox"]:disabled+.checkbox-box { border-color: #dbdbdb; background-color: #dbdbdb } input[type="checkbox"]:disabled+.checkbox-box .cross-cb-icon { display: block; fill: #8b8b8b } input[type="radio"]:checked+.radio-circle { border: 5px solid #363636 } input[type="radio"]:checked+.radio-circle.blue { border: 5px solid #1c95f3 } input[type="radio"]:checked+.radio-circle.red { border: 5px solid #f30a5c } input[type="radio"]:checked+.radio-circle.green { border: 5px solid #58d819 } input[type="radio"]:checked+.radio-circle.violet { border: 5px solid #7442ce } input[type="radio"]:checked+.radio-circle.yellow { border: 5px solid #ffb400 } input[type="radio"]:checked+.radio-circle.cyan { border: 5px solid #00e3d0 } input[type="radio"]:disabled+.radio-circle { border: 5px solid #dbdbdb; background-color: #8b8b8b } .check-item-list, .radio-item-list { display: flex; flex-flow: column wrap } .check-item-list .radio-item, .check-item-list .checkbox-item, .radio-item-list .radio-item, .radio-item-list .checkbox-item { margin-top: 16px } .check-item-list .radio-item:nth-child(1), .check-item-list .checkbox-item:nth-child(1), .radio-item-list .radio-item:nth-child(1), .radio-item-list .checkbox-item:nth-child(1) { margin-top: 0 } .checkbox-item, .radio-item { display: inline-block; height: 16px; position: relative } .checkbox-item .checkbox-box, .checkbox-item .radio-circle, .radio-item .checkbox-box, .radio-item .radio-circle { position: absolute; top: 0; left: 0; pointer-events: none } .checkbox-item .rl-label, .radio-item .rl-label { padding: 2px 0 0 26px; font-size: .625em; cursor: pointer } .checkbox-item.disabled .rl-label, .radio-item.disabled .rl-label { cursor: auto } .radio-item.starred { position: relative } .radio-item.starred .rating-ornament { position: absolute; top: -4px; left: 18px; pointer-events: none } .radio-item.starred .rl-label { padding-left: 96px; white-space: nowrap } .checkbox-box, .radio-circle { width: 16px; height: 16px; border: 1px solid #dbdbdb } .checkbox-box { border-radius: 2px; position: relative } .checkbox-box .cross-cb-icon { position: absolute; top: 3px; left: 50%; margin-left: -4px; display: none } .radio-circle { border-radius: 50% } .select-block { position: relative } .select-block .arrow-icon { position: absolute; top: 20px; right: 20px; pointer-events: none; -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .select-block.small .arrow-icon { top: 16px } .form-row { margin-top: 22px } .form-row:after { content: ''; display: table; clear: both } .form-row.small-space { margin-top: 12px } .form-row:first-child { margin-top: 0 } .form-row .form-item { margin-top: 12px } .form-row .form-item:first-child { margin-top: 0 } .form-row .form-item.half { width: 48%; margin-top: 0 } .form-row .form-item.half:first-child { float: left } .form-row .form-item.half:last-child { float: right } .form-row+.check-radio-list { margin-top: 26px } .form-row+.check-radio-list.multiple-items { margin-top: 26px } .form-item.blue .rl-label.required:after { color: #1c95f3 } .form-item.blue input[type="text"]:focus, .form-item.blue input[type="password"]:focus, .form-item.blue select:focus, .form-item.blue textarea:focus { border-color: #1c95f3 } .form-item.red .rl-label.required:after { color: #f30a5c } .form-item.red input[type="text"]:focus, .form-item.red input[type="password"]:focus, .form-item.red select:focus, .form-item.red textarea:focus { border-color: #f30a5c } .form-item.green .rl-label.required:after { color: #58d819 } .form-item.green input[type="text"]:focus, .form-item.green input[type="password"]:focus, .form-item.green select:focus, .form-item.green textarea:focus { border-color: #58d819 } .form-item.yellow .rl-label.required:after { color: #ffb400 } .form-item.yellow input[type="text"]:focus, .form-item.yellow input[type="password"]:focus, .form-item.yellow select:focus, .form-item.yellow textarea:focus { border-color: #ffb400 } .form-item.violet .rl-label.required:after { color: #7442ce } .form-item.violet input[type="text"]:focus, .form-item.violet input[type="password"]:focus, .form-item.violet select:focus, .form-item.violet textarea:focus { border-color: #7442ce } .form-item.cyan .rl-label.required:after { color: #00e3d0 } .form-item.cyan input[type="text"]:focus, .form-item.cyan input[type="password"]:focus, .form-item.cyan select:focus, .form-item.cyan textarea:focus { border-color: #00e3d0 } .form-item.small input[type="text"], .form-item.small input[type="password"], .form-item.small select { height: 34px } .form-item .form-item-message { margin-top: 14px; padding-left: 20px; color: #bfbfbf; font-size: .75em; line-height: 1em } .form-item .form-item-message .highlight { color: #1c95f3 } .submit-input { position: relative } .submit-input.blue .submit-input-button { background-color: #1c95f3 } .submit-input.blue .submit-input-message { color: #1c95f3 } .submit-input.red .submit-input-button { background-color: #f30a5c } .submit-input.red .submit-input-message { color: #f30a5c } .submit-input.violet .submit-input-button { background-color: #7442ce } .submit-input.violet .submit-input-message { color: #7442ce } .submit-input.yellow .submit-input-button { background-color: #ffb400 } .submit-input.yellow .submit-input-message { color: #ffb400 } .submit-input.green .submit-input-button { background-color: #58d819 } .submit-input.green .submit-input-message { color: #58d819 } .submit-input.cyan .submit-input-button { background-color: #00e3d0 } .submit-input.cyan .submit-input-message { color: #00e3d0 } .submit-input.medium input[type="text"], .submit-input.medium input[type="email"] { height: 46px } .submit-input.medium .submit-input-button { top: 6px; right: 6px } .submit-input.full .submit-input-button { width: 40px; height: 40px; top: 0; right: 0 } .submit-input.tall input[type="text"], .submit-input.tall input[type="email"] { height: 46px } .submit-input.tall .submit-input-button { width: 46px; height: 46px } .submit-input input[type="text"], .submit-input input[type="email"] { height: 40px; font-size: .75em } .submit-input input[type="text"]::-webkit-input-placeholder, .submit-input input[type="email"]::-webkit-input-placeholder { color: #b8b8b8; opacity: 1 } .submit-input input[type="text"]:-ms-input-placeholder, .submit-input input[type="email"]:-ms-input-placeholder { color: #b8b8b8; opacity: 1 } .submit-input input[type="text"]::-ms-placeholder, .submit-input input[type="email"]::-ms-placeholder { color: #b8b8b8; opacity: 1 } .submit-input .submit-input-button { width: 34px; height: 34px; border-radius: 50%; background-color: #363636; cursor: pointer; position: absolute; top: 3px; right: 3px } .submit-input .submit-input-button .arrow-icon { fill: #fff; position: absolute; top: 12px; left: 15px } .submit-input .submit-input-button .check-icon { fill: #fff; position: absolute; top: 9px; left: 8px } .submit-input .submit-input-button .cross-cb-icon { position: absolute; top: 9px; left: 9px } .submit-input .submit-input-button .search-icon { fill: #fff } .submit-input .submit-input-message { margin-top: 8px; font-size: .75em; line-height: 1em } .submit-button-wrap { margin-top: 40px; text-align: left } .submit-button-wrap.right { text-align: right } .submit-button-wrap .submit-button { display: inline-block } .counter { height: 34px; padding-top: 10px; border-radius: 200px; border: 1px solid #dbdbdb; position: relative } .counter.small { width: 120px } .counter.medium { height: 46px; padding: 15px } .counter.medium .counter-value { font-size: .8125em } .counter.medium .counter-control { top: 18px } .counter .counter-control { width: 8px; height: 8px; position: absolute; top: 13px; cursor: pointer } .counter .counter-control .counter-control-icon { pointer-events: none; position: absolute; top: 0; left: 0 } .counter .counter-control.substract { left: 18px } .counter .counter-control.add { right: 18px } .counter .counter-value { color: #363636; font-size: .75em; line-height: 1em; text-align: center; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; user-select: none } .check-radio-list { margin-top: 30px; display: flex; flex-flow: row wrap } .check-radio-list .checkbox-item, .check-radio-list .radio-item { width: 176px; margin-bottom: 26px } .check-radio-list .checkbox-item.starred, .check-radio-list .radio-item.starred { width: 100% } .check-radio-list .checkbox-item:last-child, .check-radio-list .radio-item:last-child { margin-bottom: 0 } .check-radio-list.multiple-items { margin-top: 0 } .check-radio-list.multiple-items .checkbox-item, .check-radio-list.multiple-items .radio-item { width: 50%; margin: 26px 0 0 } .check-radio-list.multiple-items .checkbox-item:nth-child(1), .check-radio-list.multiple-items .checkbox-item:nth-child(2), .check-radio-list.multiple-items .radio-item:nth-child(1), .check-radio-list.multiple-items .radio-item:nth-child(2) { margin-top: 0 } .check-radio-list+.button { margin-top: 26px } .form-actions { margin-top: 40px; display: flex; flex-flow: row wrap } .form-actions.full { display: block } .form-actions.full .button { margin-right: 0 } .form-actions.right { justify-content: flex-end } .form-actions .button { margin-right: 12px } .form-actions .button:last-child { margin-right: 0 } .form-box-wrap { display: flex; flex-flow: row nowrap; max-width: 800px; width: 95%; margin: 0 auto; background-color: #fff; position: relative } .form-box-wrap.shadowed { box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08) } .form-box-wrap .form-box-body { width: 430px } .form-box-wrap .form-box-body .form-box { width: 100% } .form-box-wrap .tab-form-buttons { width: 430px; display: flex; flex-flow: row wrap } .form-box-wrap .tab-form-buttons .tab-form-button { width: 50%; height: 58px; border-top: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb; color: #bfbfbf; line-height: 58px; text-align: center; cursor: pointer } .form-box-wrap .tab-form-buttons .tab-form-button.selected { color: #363636 } .form-box-wrap .tab-form-buttons .tab-form-button:last-child { border-right: none } .form-box-heading { padding: 26px 30px 34px; display: flex; flex-flow: column wrap; justify-content: space-between } .form-box-heading.login { background: url("../img/section/login-bg.jpg") no-repeat center, linear-gradient(45deg, #1c59f3, #00d8ff); background-size: cover } .form-box-heading.register { background: url("../img/section/register-bg.jpg") no-repeat center, linear-gradient(45deg, #420ed9, #ff055d); background-size: cover } .form-box-heading .form-box-heading-title { color: #fff; line-height: 76px; word-break: break-all } .form-box-heading .form-box-heading-subtitle { width: 220px; margin-top: 30px; color: #fff; line-height: 32px } .form-box-heading .form-box-heading-text { color: #fff } .form-box-heading .form-box-heading-text a { color: #fff; font-weight: 700; font-style: italic } .form-box { max-width: 430px; width: 95%; padding: 34px 30px; border-radius: 6px; margin: 0 auto; background-color: #fff; position: relative } .form-box.medium { max-width: 770px } .form-box.big { max-width: 930px } .form-box.shadowed { box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08) } .form-box .character-selection-list { display: none } .form-box .character-switch-list { position: absolute; top: 68px } .form-box .character-switch-list.left { left: -70px } .form-box .character-switch-list.right { right: -70px } .form-box .section-title-wrap { margin-bottom: 30px } .form-box .button-close { width: 40px; height: 40px; border-radius: 50%; background-color: #363636; cursor: pointer; position: absolute; top: -20px; right: -20px } .form-box .button-close.blue { background-color: #1c95f3 } .form-box .button-close.red { background-color: #f30a5c } .form-box .button-close.yellow { background-color: #ffb400 } .form-box .button-close.green { background-color: #58d819 } .form-box .button-close.violet { background-color: #7442ce } .form-box .button-close.cyan { background-color: #00e3d0 } .form-box .button-close .cross-icon { fill: #fff; position: absolute; top: 15px; left: 50%; margin-left: -5px; pointer-events: none } .form-box .social-buttons { width: 100%; display: flex; flex-flow: row wrap } .form-box .social-buttons .button-social { width: 48%; margin: 20px 0 } .form-box .social-buttons .button-social:last-child { margin-left: auto } .form-box .form-info-text { width: 80%; text-align: center; margin: 26px auto 0 } .form-confirm-row { margin-top: 26px; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center } .quick-form-wrap { background-color: #fff } .quick-form { padding: 34px 0 } .quick-form .section-title-wrap { margin-bottom: 26px } @media screen and (max-width: 1260px) { .form-box .character-selection-list { display: flex; flex-flow: row wrap } .form-box .character-switch-list { display: none } } @media screen and (max-width: 960px) { .form-box-wrap { max-width: 430px } .form-box-wrap .form-box-heading { display: none } .form-box-wrap .form-box-body { margin: 0 auto } .form-box-wrap .form-box-body .tab-form-buttons { width: 100% } .form-box .character-selection-list { display: block } } @media screen and (max-width: 680px) { .form-row .form-item.half { width: 100% } .form-row .form-item.half:first-child, .form-row .form-item.half:last-child { float: none } .form-row .form-item.half:last-child { margin-top: 22px } .submit-button-wrap { text-align: center } .submit-button-wrap.right { text-align: center } .form-actions { display: block } .form-actions.full .button { margin: 0 } .form-actions .button { width: 100%; margin: 0 0 16px 0 } .form-actions .button:last-child { margin-bottom: 0 } } .search-popup { width: 100%; height: 100%; padding-top: 300px; background-color: rgba(28, 149, 243, 0.94); position: fixed; top: 0; left: 0; z-index: 99999; overflow: hidden; opacity: 0; visibility: hidden; transition: all .4s ease-in-out } .search-popup.open { opacity: 1; visibility: visible } .search-popup .close-button { position: absolute; top: 50px; right: 50px; cursor: pointer } .search-popup .cross-icon { fill: #fff } .search-popup .search-popup-form { width: 850px; margin: 0 auto } .search-popup .input-line, .search-popup .search-popup-text { color: #fff } .search-popup .input-line { height: auto; padding: 0 0 32px; font-family: "Exo", sans-serif; font-size: 3.5em; font-weight: 700; text-transform: uppercase } .search-popup .input-line::-webkit-input-placeholder { color: #fff; opacity: 1; text-align: center } .search-popup .input-line:-ms-input-placeholder { color: #fff; opacity: 1; text-align: center } .search-popup .input-line::-ms-placeholder { color: #fff; opacity: 1; text-align: center } .search-popup .input-line.animate { animation: translate-from-bottom .4s ease-in 1 forwards } .search-popup .search-popup-text { margin-top: 30px; font-size: .75em; text-align: center; -o-transform: translate(30%, 0); -moz-transform: translate(30%, 0); -ms-transform: translate(30%, 0); -webkit-transform: translate(30%, 0); transform: translate(30%, 0); opacity: 0 } .search-popup .search-popup-text.animate { animation: translate-from-right .6s ease-in 1 forwards; animation-delay: .25s } .popup-wrap { display: none } .popup-wrap.full { width: 100% } .popup-wrap.mid { width: 770px } .popup-wrap.medium { width: 800px } .popup-wrap.big { width: 930px } .popup-wrap .form-box, .popup-wrap .form-box-wrap { width: 100% } @media screen and (max-width: 960px) { .search-popup { padding-left: 20px; padding-right: 20px } .search-popup .search-popup-form { width: 100% } .search-popup .search-popup-form .input-line { font-size: 2.5em } .popup-wrap.medium { width: 430px } .popup-wrap.mid, .popup-wrap.big { width: 95% } } @media screen and (max-width: 680px) { .search-popup .search-popup-form .input-line { font-size: 1.375em } } @media screen and (max-width: 480px) { .popup-wrap { width: 95% } .popup-wrap.medium { width: 95% } } .navigation-wrap { background-color: #fff; position: relative } .navigation-wrap.void { background-color: transparent } .navigation-wrap.void .navigation:before, .navigation-wrap.void .navigation:after { display: block } .navigation-wrap.stick-on-top { width: 100%; position: absolute; top: 50px; z-index: 6666 } .navigation { height: 92px; background-color: #fff; overflow: hidden } .navigation:before, .navigation:after { content: ''; width: 60px; height: 92px; background-color: #fff; position: absolute; top: 0; display: none } .navigation:before { left: 50%; margin-left: -645px } .navigation:after { right: 50%; margin-right: -645px } .navigation .logo { float: left; margin-top: 25px } .navigation .search-button, .navigation .inventory-button, .navigation .main-menu { float: right } .navigation .search-button, .navigation .inventory-button { height: 100%; cursor: pointer; position: relative } .navigation .search-button { width: 80px } .navigation .search-button .search-icon { position: absolute; top: 33px; left: 50%; margin-left: -12px } .navigation .inventory-button { width: 50px } .navigation .inventory-button .inventory-icon, .navigation .inventory-button .inventory-close-icon { position: absolute; top: 33px; left: 50%; margin-left: -12px } .navigation .inventory-button .inventory-close-icon { visibility: hidden } .navigation .inventory-button .inventory-item-quantity-wrap { width: 20px; height: 20px; border-radius: 50%; background-color: #1c95f3; position: absolute; top: 23px; right: 0 } .navigation .inventory-button .inventory-item-quantity-wrap .inventory-item-quantity { color: #fff; font-family: "Exo", sans-serif; font-size: .625em; font-weight: 900; line-height: 21px; text-align: center } .main-menu:after { content: ''; display: table; clear: both } .main-menu .main-menu-item { float: left } .main-menu .main-menu-item:hover .main-menu-item-link { background-color: #f5f9fc } .main-menu .main-menu-item:hover .main-menu-item-link:before { opacity: 1; left: 0 } .main-menu .main-menu-item:hover .submenu { visibility: visible; opacity: 1; pointer-events: auto; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .main-menu .main-menu-item:hover>.dropdown { visibility: visible; opacity: 1; pointer-events: auto; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .main-menu .main-menu-item .dropdown { top: 92px; margin-top: 4px } .main-menu .main-menu-item .dropdown:before { content: ''; width: 100%; height: 4px; background-color: transparent; position: absolute; top: -4px; left: 0 } .main-menu .main-menu-item-link { display: block; padding: 0 32px; background-color: #fff; color: #363636; font-family: "Exo", sans-serif; font-size: .8125em; font-weight: 700; line-height: 92px; transition: all .3s ease-in-out; position: relative; overflow: hidden } .main-menu .main-menu-item-link:before { content: ''; width: 100%; height: 4px; background-color: #1c95f3; position: absolute; top: 0; left: -100%; opacity: 0; transition: all .3s ease-in-out } .main-menu .main-menu-item-link .arrow-icon { margin-left: 5px; position: relative; top: -2px; -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .submenu { width: 100%; margin-top: 4px; background-color: #fff; position: absolute; top: 92px; left: 0; z-index: 99999; box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08); visibility: hidden; opacity: 0; pointer-events: none; -o-transform: translate(-25%, 0); -moz-transform: translate(-25%, 0); -ms-transform: translate(-25%, 0); -webkit-transform: translate(-25%, 0); transform: translate(-25%, 0); transition: all .45s ease-in-out } .submenu:after { content: ''; display: table; clear: both } .submenu:before { content: ''; width: 100%; height: 4px; background-color: transparent; position: absolute; top: -4px; left: 0 } .submenu.void { width: 1170px; background-color: transparent; left: 50%; margin-left: -585px; box-shadow: none } .submenu.void .submenu-item { box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08) } .submenu .submenu-item { padding: 32px 0 40px; background-color: #fff } .submenu .submenu-item:after { content: ''; display: table; clear: both } .submenu .submenu-item.padded { padding: 32px 30px } .submenu .submenu-item.not-padded { padding: 0 } .submenu .submenu-item.v2 { float: right; padding: 0 } .submenu .submenu-item .line-separator { margin: 32px 0 } .submenu .news-items-preview { display: grid; grid-template-columns: repeat(4, 255px); grid-gap: 30px } .submenu .news-items-preview .post-preview { width: 255px } .link-sections-wrap { float: left; margin-right: 30px } .link-sections-wrap:last-child { margin-right: 0 } .link-sections-wrap .link-sections { margin-bottom: 22px } .link-sections-wrap .link-sections:last-child { margin-bottom: 0 } .link-sections { display: flex; flex-flow: row wrap; justify-content: space-between; position: relative } .link-sections.padded { padding: 32px 0 24px } .link-section:after { content: ''; display: table; clear: both } .link-section.full { width: 100% } .link-section .link-list { float: left; margin: 18px 30px 0 0 } .link-section .link-list:last-child { margin-right: 0 } .link-section .post-preview-showcase { margin-top: 26px } .link-section .widget-match-box { width: 270px } .link-list { width: 160px } .link-list.small { width: 120px } .link-list.medium { width: 170px } .link-list.v2 .link-list-item a { font-weight: 700; line-height: 28px } .link-list.v2 .link-list-item a .arrow-icon { transition: all .2s ease-in-out } .link-list.v2 .link-list-item a:hover { color: #1c95f3 } .link-list.v2 .link-list-item a:hover .arrow-icon { margin-left: 4px } .link-list.negative .link-list-item a { color: #fff } .link-list.negative .link-list-item a .arrow-icon { fill: #fff; margin-right: 4px } .link-list-item a { display: inline-block; color: #777; font-family: "Roboto", sans-serif; font-size: .75em; line-height: 32px } .link-list-item a:hover { color: #363636; font-weight: 700 } .news-section-options-wrap { border-bottom: 1px solid #dbdbdb } .news-section-options:after { content: ''; display: table; clear: both } .news-section-options .news-section-option { float: left } .news-section-option { width: 234px; height: 57px; padding-top: 24px; text-align: center; cursor: pointer; position: relative } .news-section-option:after { content: ''; width: 100%; height: 3px; position: absolute; bottom: 0; left: 0; z-index: 9999 } .news-section-option.active.blue:after { background-color: #1c95f3 } .news-section-option.active.red:after { background-color: #f30a5c } .news-section-option.active.green:after { background-color: #58d819 } .news-section-option.active.violet:after { background-color: #7442ce } .news-section-option.active.yellow:after { background-color: #ffb400 } .news-section-option.active.cyan:after { background-color: #00e3d0 } .news-section-option.active .news-section-option-title { color: #363636 } .news-section-option .news-section-option-title { color: #bfbfbf; font-size: .75em } .news-section-slider { position: absolute; top: 32px; right: 0 } .news-section-slider .slider-controls { position: absolute; top: 0; left: -56px } .news-section-slider .slider-controls .slider-control { position: absolute; left: 0 } .news-section-slider .slider-controls .slider-control.control-previous { top: 40px } .news-section-slider .slider-controls .slider-control.control-next { top: 0 } .news-section-items-wrap { height: 294px; overflow: hidden } .news-section-items-wrap .news-section-items .post-preview { width: 270px } .news-section-categories-wrap { height: 362px } .news-section-categories .link-sections { width: 1170px; background-color: #fff } .dropdown-inner-list { padding: 30px 0; border-top: 1px solid #dbdbdb } .dropdown-inner-list .dropdown-inner-list-item { margin-bottom: 26px; padding-right: 16px; display: flex; flex-flow: row wrap; justify-content: space-between; cursor: pointer } .dropdown-inner-list .dropdown-inner-list-item:last-child { margin-bottom: 0 } .dropdown-inner-list .dropdown-inner-list-item .dropdown-inner-list-item-title, .dropdown-inner-list .dropdown-inner-list-item .dropdown-inner-list-item-value { color: #8b8b8b } .dropdown-list { width: 270px; box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08) } .dropdown-list.void { box-shadow: none; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb } .dropdown-list.void .dropdown-list-item>.dropdown-list-item-link { padding-left: 0 } .dropdown-list.accordion { box-shadow: none; border-bottom: 1px solid #dbdbdb } .dropdown-list.accordion .dropdown-list-item>.dropdown-list-item-link { padding-left: 0; color: #363636 } .dropdown-list.centered { margin: 0 auto } .dropdown-list.violet .dropdown-list-item>.dropdown-list-item-link { color: #363636 } .dropdown-list.violet .dropdown-list-item>.arrow-icon { fill: #363636 } .dropdown-list.violet .dropdown-list-item:hover>.dropdown-list-item-link { color: #fff; background-color: #7442ce } .dropdown-list.violet .dropdown-list-item:hover>.arrow-icon { fill: #fff } .dropdown-list .dropdown-list-item { border-bottom: 1px solid #dbdbdb; position: relative } .dropdown-list .dropdown-list-item:last-child { border-bottom: none } .dropdown-list .dropdown-list-item.active>.dropdown-list-item-link, .dropdown-list .dropdown-list-item:hover>.dropdown-list-item-link { color: #363636 } .dropdown-list .dropdown-list-item.active>.arrow-icon, .dropdown-list .dropdown-list-item:hover>.arrow-icon { fill: #363636 } .dropdown-list .dropdown-list-item.selected .accordion-action { -o-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg) } .dropdown-list .dropdown-list-item>.dropdown-list-item-link { display: block; height: 57px; padding: 0 30px; background-color: #fff; color: #bfbfbf; font-family: "Exo", sans-serif; font-size: .75em; font-weight: 700; text-transform: uppercase; line-height: 57px; cursor: pointer; transition: all .2s ease-in-out } .dropdown-list .dropdown-list-item>.arrow-icon { fill: #bfbfbf; position: absolute; top: 23px; right: 27px; pointer-events: none; transition: all .2s ease-in-out } .dropdown-list .dropdown-list-item .accordion-action { position: absolute; top: 18px; right: 16px; -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); transition: all .3s ease-in-out; pointer-events: none } .dropdown { position: absolute; z-index: 9999; visibility: hidden; opacity: 0; pointer-events: none; -o-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); transition: all .4s ease-in-out } .dropdown .dropdown-list-item:hover>.dropdown { visibility: visible; opacity: 1; pointer-events: auto; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .dropdown .dropdown-list-item .dropdown { margin-top: 0; top: 0; left: 100%; z-index: -1 } .submenu-slider:after { content: ''; display: table; clear: both } .submenu-slider .submenu-slider-options { border-right: 1px solid #dbdbdb; float: left; box-shadow: none } .submenu-slider .submenu-slider-items-wrap { float: right; width: 730px; height: 405px } .submenu-slider .submenu-slider-items .submenu-slider-item { width: 730px; height: 405px; padding: 32px 150px 32px 30px; background-color: #fff } .submenu-slider .submenu-slider-items .submenu-slider-item:after { content: ''; display: table; clear: both } .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-1, .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-4, .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-7 { background: url("../img/dropdown/bg-01.png") no-repeat 100% 0 } .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-2, .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-5 { background: url("../img/dropdown/bg-02.png") no-repeat 100% 0 } .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-3, .submenu-slider .submenu-slider-items .submenu-slider-item.submenu-slider-item-6 { background: url("../img/dropdown/bg-03.png") no-repeat 100% 0 } .submenu-slider .submenu-slider-items .submenu-slider-item .product-preview { float: left } .submenu-slider .submenu-slider-items .submenu-slider-item .link-sections { float: right } .inventory-bag-preview { width: 406px; height: 100%; padding: 26px; border-left: 1px solid #dbdbdb; position: absolute; top: 0; right: -406px; overflow: hidden scroll; z-index: 99999; background-color: #fff; transition: transform .3s ease-in-out } .inventory-bag-preview .inventory-close-button { position: absolute; top: 20px; right: 26px; cursor: pointer } .inventory-bag-preview .items-in-inventory, .inventory-bag-preview .inventory-subtotal { color: #363636 } .inventory-bag-preview .items-in-inventory { margin-bottom: 14px } .inventory-bag-preview .inventory-items-preview { margin: 32px 0 100px } .inventory-bag-preview .inventory-subtotal { line-height: 40px } .inventory-bag-preview .inventory-subtotal:after { content: ''; display: table; clear: both } .inventory-bag-preview .inventory-subtotal .subtotal-text { float: left } .inventory-bag-preview .inventory-subtotal .subtotal-value { float: right } .inventory-bag-preview .inventory-subtotal .subtotal-value .currency { margin-right: 3px } .inventory-bag-preview .inventory-actions { margin-top: 32px } .inventory-bag-preview .inventory-actions .button { margin-bottom: 20px } .inventory-bag-preview .inventory-actions .button:last-child { margin-bottom: 0 } .inventory-items-preview { width: 340px; display: flex; flex-flow: row wrap } .inventory-items-preview .inventory-item-preview { margin: 26px 26px 0 0 } .inventory-items-preview .inventory-item-preview:nth-child(1), .inventory-items-preview .inventory-item-preview:nth-child(2), .inventory-items-preview .inventory-item-preview:nth-child(3) { margin-top: 0 } .inventory-items-preview .inventory-item-preview:nth-child(3n+3) { margin-right: 0 } .inventory-items-preview .inventory-item-preview .inventory-icon { fill: #e5e5e5; display: block; margin: 35px auto 0 } .inventory-items-preview .inventory-item-preview.selected .product-preview.small .product-preview-img-wrap { border-width: 6px } .inventory-items-preview .inventory-item-preview.selected .product-preview.small .product-preview-img { height: 84px } .inventory-item-preview.empty { width: 96px; height: 96px; border: 1px solid #dbdbdb; background-color: #f9f9f9 } .window-overlay { width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); position: fixed; top: 0; left: 0; z-index: 33333; opacity: 0; visibility: hidden; overflow: hidden; transition: all .3s ease-in-out } .window-overlay.open { opacity: 1; visibility: visible } .mobile-menu-wrap { width: 290px; height: 100%; padding-top: 92px; background-color: #fff; position: absolute; top: 0; left: -290px; z-index: 66666; opacity: 0; visibility: hidden; overflow: hidden scroll; transition: all .4s ease-in-out } .mobile-menu-wrap.open { left: 0; opacity: 1; visibility: visible } .mobile-menu-wrap .search-popup-open { position: absolute; top: 33px; right: 70px; cursor: pointer } .mobile-menu-wrap .mobile-menu-close { position: absolute; top: 37px; right: 20px; cursor: pointer } .mobile-menu-wrap .logo-img { width: 52px; height: 41px; position: absolute; top: 22px; left: 20px } .mobile-menu { margin-bottom: 220px } .mobile-menu-item { border-bottom: 1px solid #dbdbdb; position: relative } .mobile-menu-item:hover>.mobile-menu-item-link, .mobile-menu-item.active>.mobile-menu-item-link { color: #fff; background-color: #1c95f3 } .mobile-menu-item:hover>.mobile-menu-item-link .quantity, .mobile-menu-item.active>.mobile-menu-item-link .quantity { color: #fff } .mobile-menu-item:hover>.arrow-icon, .mobile-menu-item.active>.arrow-icon { fill: #fff } .mobile-menu-item.active>.arrow-icon { -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .mobile-menu-item>.mobile-menu-item-link { display: block; padding-left: 30px; background-color: #fff; color: #363636; line-height: 58px; text-transform: none; cursor: pointer; transition: all .2s ease-in-out } .mobile-menu-item>.mobile-menu-item-link .user-avatar { position: relative; margin-right: 6px; top: 6px } .mobile-menu-item>.mobile-menu-item-link .quantity { color: #1c95f3; transition: all .2s ease-in-out } .mobile-menu-item>.arrow-icon { position: absolute; top: 24px; right: 18px; pointer-events: none; transition: all .2s ease-in-out } .mobile-menu-item>.mobile-dropdown { border-top: 1px solid #dbdbdb; padding: 14px 0 } .mobile-dropdown { display: none } .mobile-dropdown-item { position: relative } .mobile-dropdown-item.active>.arrow-icon { -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .mobile-dropdown-item>.mobile-dropdown-item-link { padding-left: 34px; color: #363636; line-height: 34px; cursor: pointer } .mobile-dropdown-item>.arrow-icon { position: absolute; top: 11px; right: 16px; transition: all .2s ease-in-out } .mobile-dropdown-item>.mobile-dropdown { margin-bottom: 10px } .mobile-dropdown-item>.mobile-dropdown .mobile-dropdown-item .mobile-dropdown-item-link { color: #777; font-family: "Roboto", sans-serif; font-size: .75em; font-weight: 400; text-transform: none } .mobile-menu-pull { display: none; height: 40px; padding-top: 13px; background-color: #252627; text-align: center; cursor: pointer } .mobile-menu-pull .menu-pull-icon { display: inline-block } .dropdown-simple-wrap .dp-current-option { display: flex; flex-flow: row wrap; height: 40px; align-items: center; cursor: pointer } .dropdown-simple-wrap .dp-current-option .arrow-icon { margin: 0 0 0 10px; -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .dropdown-simple-wrap .current-option { cursor: pointer } .dropdown-simple-wrap .dp-options { padding: 10px 0; border: 1px solid #dbdbdb; border-radius: 4px; background-color: #fff; box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08); visibility: hidden; opacity: 0 } .dropdown-simple-wrap .dp-options.small { min-width: 120px } .dropdown-simple-wrap .dp-options.medium { padding: 16px } .dropdown-simple-wrap .dp-options.big { min-width: 280px } .dropdown-simple-wrap .dp-options.no-padding-bottom { padding-bottom: 0 } .dropdown-simple-wrap .dp-options .dp-options-form { padding: 12px 16px } .dropdown-simple-wrap .dp-options .dp-options-form .check-radio-list:first-child { margin-top: 0 } .dropdown-simple-wrap .dp-options .dp-option { cursor: pointer } .dropdown-simple-wrap .dp-options .dp-option:hover .dp-option-text { color: #7442ce } .dropdown-simple-wrap .dp-options .dp-option .dp-option-text { padding: 8px 16px } .dropdown-simple-wrap .dp-option-text { color: #363636; line-height: 16px; white-space: nowrap } @media screen and (max-width: 1260px) { .navigation-wrap.void { background-color: #fff } .navigation-wrap.void .navigation:before, .navigation-wrap.void .navigation:after { display: none } .navigation-wrap.stick-on-top { position: static } .navigation .main-menu, .navigation .search-button { display: none } .mobile-menu-pull { display: block } } @media screen and (max-width: 680px) { .inventory-bag-preview { width: 290px; right: -290px } .inventory-bag-preview .inventory-close-button { display: block } .inventory-bag-preview .inventory-items-preview { width: 218px } .inventory-bag-preview .inventory-items-preview .inventory-item-preview:nth-child(3) { margin-top: 26px } .inventory-bag-preview .inventory-items-preview .inventory-item-preview:nth-child(3n+3) { margin-right: 26px } .inventory-bag-preview .inventory-items-preview .inventory-item-preview:nth-child(2n+2) { margin-right: 0 } } .widget-title-wrap { height: 40px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .widget-title-wrap.no-border { border-bottom: none } .widget-title-wrap.margin-top { margin-top: 26px } .widget-title-wrap.border-top { height: 66px; padding-top: 20px; border-top: 1px solid #dbdbdb } .widget-title-wrap.full { display: block; height: auto; padding: 20px 0; border-top: 1px solid #dbdbdb; text-align: center; position: relative } .widget-title-wrap.full .widget-title, .widget-title-wrap.full .widget-text { line-height: 1em } .widget-title-wrap.full .widget-text { margin-top: 6px } .widget-title-wrap.full .calendar-icon { position: absolute; top: 20px; right: 0; cursor: pointer } .widget-title-wrap .widget-title-item { display: flex; flex-flow: row wrap } .widget-title-wrap .widget-title-item.small { width: 320px } .widget-title-wrap .widget-title-item.medium { width: 470px; justify-content: space-between } .widget-title-wrap .widget-title-item.medium .widget-title-text { margin-left: 0 } .widget-title-wrap .widget-title-item.full { display: block } .widget-title-wrap .widget-title-item.full .widget-title, .widget-title-wrap .widget-title-item.full .widget-text { line-height: 1em } .widget-title-wrap .widget-title-item.full .widget-title+.widget-text { margin-left: 0 } .widget-title-wrap .widget-title-item.full .widget-text { margin-top: 6px } .widget-title-wrap .widget-title-item .widget-title+.widget-text { margin-left: 12px } .widget-title-wrap .widget-title-item .dropdown-simple-wrap .dp-current-option-value .dp-option-text { line-height: 40px } .widget-title-wrap .widget-title { color: #363636; line-height: 40px } .widget-title-wrap .widget-title .highlight.violet { color: #7442ce } .widget-title-wrap .widget-text { color: #8b8b8b; font-size: .625em; line-height: 40px } .widget-title-wrap .widget-text.bold { color: #363636; line-height: 40px } .widget-title-wrap .widget-text.spaced { margin-right: 8px } .widget-title-wrap .widget-text .highlight.violet { color: #7442ce } .widget-title-wrap .stats-reference { display: flex; flex-flow: row wrap } .widget-title-wrap .stats-reference .stat-reference { margin-right: 24px; position: relative } .widget-title-wrap .stats-reference .stat-reference:last-child { margin-right: 0 } .widget-title-wrap .stats-reference .stat-reference:before { content: ''; width: 5px; height: 5px; border-radius: 50%; position: absolute; top: 17px; left: -12px } .widget-title-wrap .stats-reference .stat-reference.blue:before { background-color: #107df8 } .widget-title-wrap .stats-reference .stat-reference.yellow:before { background-color: #dee807 } .widget-title-wrap .stats-reference .stat-reference.violet:before { background-color: #7442ce } .widget-title-wrap .stats-reference .stat-reference.cyan:before { background-color: #00e3d0 } .widget-title-wrap .stats-reference .stat-reference.blue-lighter:before { background-color: #00d1f7 } .widget-title-wrap .stats-reference .stat-reference.red-light:before { background-color: #f30a36 } .widget-title-wrap .stats-reference .stat-reference .stat-reference-text { color: #363636; line-height: 40px } .widget-title-wrap+.widget-team-stats, .widget-title-wrap+.chart-wrap { margin-top: 26px } .widget-overflow-wrap { overflow: auto; position: relative } .widget-overflow-wrap.item-stats, .widget-overflow-wrap.rune-stats { height: 70px } .widget-overflow-wrap.match-rounds { height: 176px } .widget-overflow-wrap.match-rounds .dropdown-simple-wrap { width: 85px } .widget-overflow-wrap.skill-stats { height: 268px } .widget-overflow-wrap.tournament-results { height: 570px } .widget-overflow-wrap.tournament-results .widget-tournament-results { position: absolute; top: 0; left: 0 } .widget-overflow-wrap .widget-match-box { width: auto; position: absolute; top: 0; left: 0 } .widget-overflow-wrap .widget-overflow-list-wrap { position: absolute; top: 0; left: 0 } .widget-overflow-wrap .widget-overflow-list { height: 50px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; flex-wrap: nowrap; align-items: center } .widget-overflow-wrap .widget-overflow-list .widget-overflow-list-text { color: #363636 } .widget-overflow-wrap .widget-overflow-list .widget-overflow-list-text, .widget-overflow-wrap .widget-overflow-list .skill-loot-list { margin-right: 16px } .widget-overflow-wrap .widget-overflow-list .widget-overflow-list-text:last-child, .widget-overflow-wrap .widget-overflow-list .skill-loot-list:last-child { margin-right: 0 } .widget-overflow-wrap .widget-overflow-list .skill-loot-list { flex-wrap: nowrap } .widget-overflow-wrap .widget-overflow-list .skill-loot-list .skill-loot-item-title, .widget-overflow-wrap .widget-overflow-list .skill-loot-list .skill-loot-item-text { white-space: nowrap } .widget-match-result { width: 240px; height: 130px; padding-top: 24px } .widget-match-result:hover { background-color: #f4f4f4 } .widget-match-result.hoverable { position: relative } .widget-match-result.hoverable:hover .widget-match-result-actions { display: block } .widget-match-result.hoverable:hover .widget-match-result-item .match-score, .widget-match-result.hoverable:hover .widget-match-result-item .match-datetime { display: none } .widget-match-result .widget-match-result-actions { position: absolute; top: 29px; left: 120px; display: none } .widget-match-result .widget-match-result-actions .widget-match-result-action { color: #363636; cursor: pointer } .widget-match-result .widget-match-result-actions .widget-match-result-action:last-child { margin-top: 36px } .widget-match-result .widget-match-result-actions .widget-match-result-action .bars-icon, .widget-match-result .widget-match-result-actions .widget-match-result-action .play-button-icon { fill: #7442ce } .widget-match-result .widget-match-result-actions .widget-match-result-action .bars-icon { margin-right: 8px } .widget-match-result .widget-match-result-actions .widget-match-result-action .play-button-icon { position: relative; left: 2px; margin-right: 10px } .widget-match-result .widget-match-result-actions .widget-match-result-action:hover { color: #7442ce } .widget-match-result .widget-match-result-item { display: flex; flex-flow: row wrap } .widget-match-result .widget-match-result-item+.widget-match-result-item { margin-top: 18px } .widget-match-result .widget-match-result-item .team-info-wrap { width: 80px; padding-left: 16px } .widget-match-result .widget-match-result-item .match-score { width: 90px; text-align: center } .widget-match-result .widget-match-result-item .match-datetime { width: 70px } .widget-match-result .widget-match-result-item .match-score, .widget-match-result .widget-match-result-item .match-datetime { margin-top: 6px; color: #363636 } .widget-match-result .widget-match-result-item .match-datetime.light { color: #8b8b8b } .widget-match-result .widget-match-result-item .match-datetime.live { width: auto; height: 10px; padding: 2px; background-color: #f30a5c; color: #fff; font-size: .5em; font-weight: 800; letter-spacing: 0.05em; line-height: 1em } .widget-match-box-wrap { display: flex; flex-flow: row wrap } .widget-match-box-wrap .widget-match-box:nth-child(1) .widget-title-wrap, .widget-match-box-wrap .widget-match-box:nth-child(1) .widget-match-box-row { padding-right: 70px } .widget-match-box-wrap .widget-match-box:nth-child(1), .widget-match-box-wrap .widget-match-box:nth-child(3) { width: 35% } .widget-match-box-wrap .widget-match-box:nth-child(2) { width: 30% } .widget-match-box { width: 100% } .widget-match-box+.countdown-text-wrap { margin-top: 20px } .widget-match-box.small { width: 270px } .widget-match-box.multiple-items { display: flex; flex-flow: row wrap; justify-content: space-between; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb } .widget-match-box.multiple-items .widget-team-vs { width: 670px; padding: 0 36px; border-bottom: none } .widget-match-box.multiple-items .widget-team-vs.medium { padding: 0 36px } .widget-match-box.multiple-items .widget-media { margin: 16px 26px 0 0 } .widget-match-box.multiple-items .widget-info-box { padding: 24px 16px 0 0; text-align: right } .widget-match-box.multiple-items .widget-info-box .countdown-text, .widget-match-box.multiple-items .widget-info-box .countdown-text-heading { text-align: right } .widget-match-box.multiple-items.inverted .widget-team-vs { order: 2 } .widget-match-box.multiple-items.inverted .widget-info-box { order: 1; padding: 24px 0 0 16px; text-align: left } .widget-match-box.skill-stats .widget-title-wrap { flex-wrap: nowrap; justify-content: flex-start } .widget-match-box.skill-stats .widget-title-wrap .team-score-boxes-title-wrap { flex-wrap: nowrap } .widget-match-box.skill-stats .widget-title, .widget-match-box.skill-stats .skill-loot-list { width: 85px } .widget-match-box.skill-stats .skill-loot-list { justify-content: flex-start; align-items: center } .widget-match-box.match-rounds .widget-title-wrap { flex-wrap: nowrap; justify-content: flex-start } .widget-match-box.match-rounds .widget-title-wrap .team-score-boxes-title-wrap { flex-wrap: nowrap } .widget-match-box.match-rounds .widget-team-vs .widget-team-vs-item { justify-content: flex-start } .widget-match-box.match-rounds .widget-team-vs .widget-team-vs-item .team-info-wrap { margin-left: 0; padding-left: 14px } .widget-match-box.match-rounds .round-dropdown, .widget-match-box.match-rounds .team-info-wrap { width: 85px } .widget-match-box.hoverable .widget-match-box-item { display: none } .widget-match-box.hoverable:hover .widget-match-box-item { display: block } .widget-match-box.hoverable:hover .widget-team-vs { display: none } .widget-match-box.bordered { border: 1px solid #dbdbdb } .widget-match-box.bordered .widget-title-wrap { padding: 0 14px } .widget-match-box.bordered .widget-team-vs .widget-team-vs-item .team-info-wrap { margin-left: 16px } .widget-match-box.bordered .widget-team-vs .widget-team-vs-item .team-score { margin-right: 26px } .widget-match-box.bordered .widget-team-vs .widget-team-vs-item:last-child { border-bottom: none } .widget-match-box.bordered .widget-team-vs .widget-team-vs-item:last-child:before { left: 40px } .widget-match-box.bordered>*:last-child { border-bottom: none } .widget-match-box .widget-match-box-row { height: 78px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center } .widget-match-box .widget-match-box-row.padded-right { padding-right: 56px } .widget-match-box .widget-match-box-row.padded-right-small { padding-right: 26px } .widget-match-box .widget-match-box-row.big { height: 163px } .widget-match-box .widget-match-box-row.big .match-stats { margin: 0 80px } .widget-match-box .widget-match-box-row.centered { justify-content: center } .widget-match-box .widget-match-box-row .medal-list { width: 100%; padding: 0; border: none } .widget-match-box .widget-match-box-items { display: flex; flex-flow: row wrap; flex-flow: nowrap } .widget-match-box .widget-match-box-items .widget-team-vs { width: 53%; border-right: 1px solid #dbdbdb } .widget-match-box .widget-match-box-items .widget-match-box-item-wrap { width: 47% } .widget-match-box .widget-match-box-items .widget-match-box-item-wrap .widget-match-box-item { border-bottom: none } .widget-match-box .medal-list { padding: 16px 0; border-bottom: 1px solid #dbdbdb } .widget-match-box-item { height: 58px; border-bottom: 1px solid #dbdbdb; cursor: pointer } .widget-match-box-item:hover .widget-match-box-link { color: #7442ce } .widget-match-box-item .widget-match-box-link { display: block; color: #363636; line-height: 58px; text-align: center } .widget-match-box-item .widget-match-box-link .play-button-icon, .widget-match-box-item .widget-match-box-link .bars-icon { fill: #7442ce; position: relative; top: 1px; margin-right: 6px } .widget-mvp .widget-mvp-item { height: 60px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .widget-mvp .widget-mvp-item .team-info-wrap { margin-top: 16px } .widget-mvp .widget-mvp-item .mvp-stats { margin: 18px 16px 0 0 } .mvp-stats { display: flex; flex-flow: row wrap } .mvp-stats .mvp-stat { margin-right: 24px; text-align: center } .mvp-stats .mvp-stat:last-child { margin-right: 0 } .mvp-stats .mvp-stat .mvp-stat-title { color: #363636 } .mvp-stats .mvp-stat .mvp-stat-text { margin-top: 4px; color: #8b8b8b; font-size: .5625em; line-height: 1em } .widget-team-vs.tiny .widget-team-vs-item { height: 52px } .widget-team-vs.one-team .widget-team-vs-item:before { display: none } .widget-team-vs.small .widget-team-vs-item { height: 58px } .widget-team-vs.small .widget-team-vs-item .team-info-wrap { margin: 11px 0 0 4px } .widget-team-vs.small .widget-team-vs-item .team-info-wrap.inverted { margin: 11px 4px 0 0 } .widget-team-vs.small .widget-team-vs-item .team-score { font-size: .75em; margin: 23px 16px 0 auto } .widget-team-vs.small .widget-team-vs-item:last-child:before { margin-left: 0; left: 30px } .widget-team-vs.v3.big .widget-team-vs-item { height: 120px } .widget-team-vs.v3.big .team-info-wrap { margin-left: 40px } .widget-team-vs.v3.big .team-info-wrap.medium .team-logo { width: 66px; height: 66px; margin-top: 10px } .widget-team-vs.v3.big .team-info-wrap.medium .team-info { margin: 34px 0 0 36px } .widget-team-vs.v3.big .team-info-wrap.medium .team-info .team-name { font-size: .75em } .widget-team-vs.v3.big .team-info-wrap.medium .team-info .team-country { margin-top: 4px } .widget-team-vs.v3 .widget-team-vs-item:last-child:before { display: none } .widget-team-vs.v3 .team-info-wrap { margin-left: 10px } .widget-team-vs.v3 .team-info-wrap.medium .team-logo { width: 46px; height: 46px; margin-top: 4px } .widget-team-vs.v2 { display: flex; flex-flow: row wrap; justify-content: space-between; border-bottom: 1px solid #dbdbdb } .widget-team-vs.v2.filled { background-color: #f9f9f9 } .widget-team-vs.v2.filled .team-info-wrap { margin-left: 10px } .widget-team-vs.v2.filled .team-info-wrap.inverted { margin-right: 10px } .widget-team-vs.v2 .widget-team-vs-item { border-bottom: none } .widget-team-vs.v2 .widget-team-vs-item:last-child:before { display: none } .widget-team-vs.v2 .match-stats .match-score.small { margin-top: 30px } .widget-team-vs.v2 .match-stats .match-score.medium { margin-top: 42px; font-size: 2em } .widget-team-vs.v2 .match-stats .match-score.medium.solo { margin-top: 50px } .widget-team-vs.v2 .match-stats .match-score.medium.match-vs { margin-top: 36px } .widget-team-vs.v2 .match-stats .match-score.medium.match-vs+.match-time { margin-top: 4px } .widget-team-vs.v2 .match-stats .match-time.medium { margin-top: 8px; font-size: .625em; line-height: 16px } .widget-team-vs.v2 .match-stats .match-time.big { margin-top: 34px; font-size: .75em } .widget-team-vs.v2 .match-stats .match-stat-text { margin-top: 4px; color: #8b8b8b; font-size: .625em } .widget-team-vs.v2.small .match-stats .match-score.smaller { margin-top: 18px } .widget-team-vs.v2.small .match-stats .match-time { margin-top: 3px } .widget-team-vs.v2.medium { height: 138px; padding: 0 52px } .widget-team-vs.v2.medium .team-info-wrap { margin-top: 30px } .widget-team-vs.v2.medium .team-info-wrap.medium .team-info .team-name { font-size: .75em } .widget-team-vs.v2.medium .team-info-wrap .team-info { margin-top: 26px } .widget-team-vs.v2.medium .team-info-wrap .team-info .team-country { margin-top: 6px } .widget-team-vs.v2.medium.centered { height: 162px; padding: 0; justify-content: center } .widget-team-vs.v2.medium.centered .team-info-wrap { margin-top: 44px } .widget-team-vs.v2.medium.centered .team-info-wrap .team-logo { order: 2 } .widget-team-vs.v2.medium.centered .team-info-wrap .team-info { order: 1; margin: 26px 30px 0 0; text-align: right } .widget-team-vs.v2.medium.centered .team-info-wrap.inverted .team-logo { order: 1 } .widget-team-vs.v2.medium.centered .team-info-wrap.inverted .team-info { order: 2; margin: 26px 0 0 30px; text-align: left } .widget-team-vs.v2.medium.centered .match-stats { margin: 14px 80px 0 } .widget-team-vs.v2.big { width: 470px; height: 188px; padding: 0 16px } .widget-team-vs.v2.big .team-info-wrap { display: block; margin-top: 32px; text-align: center } .widget-team-vs.v2.big .team-info-wrap.inverted .team-info { text-align: center } .widget-team-vs.v2.big .team-info-wrap .team-info { margin: 16px 0 0 } .widget-team-vs.v2.big .team-info-wrap .team-info .team-name { font-size: .75em } .widget-team-vs.v2.big .team-info-wrap .team-info .team-country { margin-top: 6px } .widget-team-vs .widget-team-vs-item { height: 86px; border-bottom: 1px solid #dbdbdb; position: relative; display: flex; flex-flow: row wrap; justify-content: space-between } .widget-team-vs .widget-team-vs-item .team-info-wrap { margin-top: 14px } .widget-team-vs .widget-team-vs-item .team-info-wrap.medium .team-info .team-name { font-size: .6875em } .widget-team-vs .widget-team-vs-item .team-score { color: #363636; margin: 32px 22px 0 0 } .widget-team-vs .widget-team-vs-item .team-score.light { color: #8b8b8b } .widget-team-vs .widget-team-vs-item .award-cup-img { margin: 18px 18px 0 0 } .widget-team-vs .widget-team-vs-item:last-child:before { content: 'vs'; width: 34px; background-color: #fff; color: #363636; font-family: "Exo", sans-serif; font-size: .625em; font-weight: 700; text-transform: uppercase; text-align: center; position: absolute; top: -7px; left: 50%; margin-left: -17px } .widget-media-wrap.large .widget-media-r iframe, .widget-media-wrap.large .widget-media-r img { width: 100%; height: 460px } .widget-media-wrap.huge .widget-media-r iframe, .widget-media-wrap.huge .widget-media-r img { width: 100%; height: 582px } .widget-media-wrap.popup-display { max-width: 1170px; width: 100% } .widget-media-wrap.popup-display .button-close { width: 40px; height: 40px; border-radius: 50%; background-color: #363636; cursor: pointer; position: absolute; top: -20px; right: -20px; z-index: 99999 } .widget-media-wrap.popup-display .button-close.blue { background-color: #1c95f3 } .widget-media-wrap.popup-display .button-close.red { background-color: #f30a5c } .widget-media-wrap.popup-display .button-close.yellow { background-color: #ffb400 } .widget-media-wrap.popup-display .button-close.green { background-color: #58d819 } .widget-media-wrap.popup-display .button-close.violet { background-color: #7442ce } .widget-media-wrap.popup-display .button-close.cyan { background-color: #00e3d0 } .widget-media-wrap.popup-display .button-close .cross-icon { fill: #fff; position: absolute; top: 15px; left: 50%; margin-left: -5px; pointer-events: none } .widget-media-wrap.popup-display .widget-media-r iframe, .widget-media-wrap.popup-display .widget-media-r img { width: 100%; height: 660px } .widget-media-wrap.big .widget-media-r iframe, .widget-media-wrap.big .widget-media-r img { width: 85%; height: 400px } .widget-media { width: 294px; height: 156px } .widget-media.small { width: 270px; height: 160px } .widget-media.large { width: 100%; height: 460px } .widget-media iframe { width: 100%; height: 100% } .widget-team-builds-header { display: flex; flex-flow: row wrap; justify-content: space-between; padding: 0 16px 18px } .widget-team-builds-header .button { margin-top: 5px } .widget-team-builds-header .team-logo { width: 46px; height: 46px } .widget-team-builds-header .team-info-wrap.medium .team-info { margin-top: 14px } .widget-team-stats.bottom-spaced { padding-bottom: 30px; border-bottom: 1px solid #dbdbdb } .widget-team-stats.bottom-border { border-bottom: 1px solid #dbdbdb } .widget-team-stats.full { display: flex; flex-flow: row wrap; justify-content: space-between; padding: 0 28px } .widget-team-stats.full.small-space { padding: 0 16px 20px } .widget-team-stats .progress-stat-wrap { margin-bottom: 24px } .widget-team-stats .progress-stat-wrap:last-child { margin-bottom: 0 } .widget-info-box .widget-info-box-item { margin-top: 16px } .widget-info-box .widget-info-box-item:first-child { margin-top: 0 } .widget-info-box .widget-info-box-item .widget-info-title { color: #363636 } .widget-info-box .widget-info-box-item .widget-info-text { margin-top: 4px; color: #8b8b8b; font-size: .625em; line-height: 1em } .widget-stat-rows .widget-stat-row { border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .widget-stat-rows .widget-stat-row .progress-stat-wrap { margin: 22px 0 24px } .widget-stat-rows .widget-stat-row .progress-stat-wrap:first-child { margin-left: 30px } .widget-stat-rows .widget-stat-row .progress-stat-wrap:last-child { margin-right: 30px } .widget-stat-rows .widget-stat-row .arc-stats-wrap { margin: 16px 0 } .widget-stat-rows .widget-stat-row .arc-stats-wrap:first-child { margin-left: 16px } .widget-stat-rows .widget-stat-row .widget-stat-info-wrap { margin-top: 28px } .widget-stat-rows .widget-stat-row .widget-stat-info-wrap:last-child { margin-right: 32px } .widget-simple-stats { display: flex; flex-flow: row wrap } .widget-simple-stats.border-top { border-top: 1px solid #dbdbdb } .widget-simple-stats .widget-simple-stat:first-child .widget-simple-stat-rows .widget-simple-stat-row { padding-right: 26px } .widget-simple-stats.v2 .widget-simple-stat-header { padding: 0 } .widget-simple-stats.v2 .widget-simple-stat:nth-child(2n+2) .widget-simple-stat-rows { border-left: 1px solid #dbdbdb } .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row { height: 45px } .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title, .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value { line-height: 45px } .widget-simple-stats.small .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .team-info-wrap { margin-top: 8px } .widget-simple-stat { width: 100%; background-color: #fff } .widget-simple-stat.half { width: 50% } .widget-simple-stat .widget-simple-stat-header { border-bottom: 1px solid #dbdbdb; padding: 0 16px } .widget-simple-stat .widget-simple-stat-header.no-padding { padding: 0 } .widget-simple-stat .widget-simple-stat-header .widget-simple-stat-header-title { color: #363636; line-height: 40px } .widget-simple-stat .widget-simple-stat-header .team-info-wrap { margin: 12px 0 } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row { height: 50px; padding: 0 16px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row:nth-child(odd) { background-color: #f9f9f9 } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row.border-top { border-top: 1px solid #dbdbdb } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title, .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value { color: #363636; line-height: 50px } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-title.light { color: #777 } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .widget-simple-stat-value.link { color: #7442ce } .widget-simple-stat .widget-simple-stat-rows .widget-simple-stat-row .team-info-wrap { margin-top: 10px } .widget-stat-info-wrap { display: flex; flex-flow: row wrap } .widget-stat-info-wrap .widget-stat-info-number { color: #363636 } .widget-stat-info-wrap .widget-stat-info { margin-left: 12px } .widget-stat-info-wrap .widget-stat-info .widget-stat-info-title { color: #363636 } .widget-stat-info-wrap .widget-stat-info .widget-stat-info-text { margin-top: 2px; color: #8b8b8b; font-size: .5625em; line-height: 1em } .widget-top-player { width: 270px; height: 111px; border-bottom: 1px solid #dbdbdb; padding-left: 100px; position: relative } .widget-top-player .top-player-team-img, .widget-top-player .top-player-img { position: absolute; top: 0 } .widget-top-player .top-player-team-img { width: 80px; height: 80px; opacity: .1; left: 4px; z-index: 1 } .widget-top-player .top-player-img { left: 0; z-index: 2 } .widget-top-player .top-player-team-logo { position: absolute; bottom: 2px; left: 0; z-index: 3 } .widget-top-player .top-player-team-logo.top-right { bottom: auto; left: auto; top: -8px; right: 0 } .widget-top-player .top-player-info-wrap { display: flex; flex-flow: row wrap; justify-content: space-between } .widget-top-player .top-player-info-wrap .top-player-info { margin-top: 14px } .widget-top-player .top-player-info-wrap .top-player-info .top-player-flag { color: #363636 } .widget-top-player .top-player-info-wrap .top-player-info .top-player-flag.featured { color: #7442ce } .widget-top-player .top-player-info-wrap .top-player-info .top-player-name { margin-top: 1px; color: #363636; line-height: 1em } .widget-top-player .top-player-info-wrap .top-player-info .top-player-team { margin-top: 2px; font-size: .625em; color: #8b8b8b; line-height: 1em } .widget-top-player .top-player-stats { display: flex; flex-flow: row wrap; justify-content: flex-end; margin-top: 18px; padding-right: 12px } .widget-top-player .top-player-stats .top-player-stat { text-align: center; margin-right: 16px } .widget-top-player .top-player-stats .top-player-stat:last-child { margin-right: 0 } .widget-top-player .top-player-stats .top-player-stat .top-player-stat-title { color: #363636; line-height: 1em } .widget-top-player .top-player-stats .top-player-stat .top-player-stat-title .highlight:nth-child(1) { color: #7442ce } .widget-top-player .top-player-stats .top-player-stat .top-player-stat-title .highlight:nth-child(2) { color: #00e3d0 } .widget-top-player .top-player-stats .top-player-stat .top-player-stat-title .highlight:nth-child(3) { color: #777 } .widget-top-player .top-player-stats .top-player-stat .top-player-stat-text { margin-top: 4px; font-size: .5625em; line-height: 1em } .progress-bar-wrap { margin: 0 auto } .tweets-preview-widget { display: grid; grid-row-gap: 16px; overflow: hidden; position: relative; min-height: 120px } .tweets-preview-widget .loader { position: absolute; top: 60px; left: 50%; margin-left: -20px } .tweets-preview-widget .loader-error { width: 100%; position: absolute; top: 60px } .tweets-preview-widget.negative .tweets-preview-widget-item .tweets-preview-widget-item-text { color: #777 } .tweets-preview-widget.v2 .tweets-preview-widget-item { padding-left: 52px } .tweets-preview-widget-item { padding-left: 46px; position: relative; animation: translate-from-bottom .5s ease-in-out } .tweets-preview-widget-item .bubble-ornament { position: absolute; top: 3px; left: 0 } .tweets-preview-widget-item .tweets-preview-widget-item-profile-img { width: 40px; height: 40px; position: absolute; top: 0; left: 0 } .tweets-preview-widget-item .tweets-prevew-widget-item-user { color: #363636; margin: 4px 0 } .tweets-preview-widget-item .tweets-preview-widget-item-text { color: #b8b8b8; font-size: .75em; line-height: 1.6666666667em } .tweets-preview-widget-item .tweets-preview-widget-item-text .highlighted { color: #10caff; font-weight: 700 } .tweets-preview-widget-item .tweets-preview-widget-item-timestamp { margin-top: 4px; color: #8b8b8b; font-size: .625em } .live-news-widget-wrap { position: relative } .live-news-widget-wrap:before, .live-news-widget-wrap:after { content: ''; width: 50%; height: 40px; position: absolute; top: 0; z-index: -1 } .live-news-widget-wrap:before { left: 0; background-color: #f30a5c } .live-news-widget-wrap:after { right: 0; background-color: #1c95f3 } .live-news-widget { height: 40px; padding: 0 135px; background-color: #252627; position: relative; overflow: hidden } .live-news-widget .live-news-widget-stairs { position: absolute; top: 0; z-index: 3333 } .live-news-widget .live-news-widget-stairs.left { left: 0 } .live-news-widget .live-news-widget-stairs.right { right: -1px; -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg) } .live-news-widget .live-news-widget-stairs.red .live-news-widget-stair { background-color: #f30a5c } .live-news-widget .live-news-widget-stairs.blue .live-news-widget-stair { background-color: #1c95f3 } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(1) { width: 170px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(2) { width: 165px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(3) { width: 160px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(4) { width: 155px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(5) { width: 150px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(6) { width: 145px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(7) { width: 140px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(8) { width: 135px } .live-news-widget .live-news-widget-stair { height: 5px } .live-news-widget .live-news-widget-title-wrap { padding: 3px 0 0 28px; position: absolute; top: 8px; left: 9px; z-index: 6666 } .live-news-widget .live-news-widget-title-wrap .live-news-widget-icon { position: absolute; top: 0; left: 0 } .live-news-widget .live-news-widget-title-wrap .live-news-widget-title { color: #fff } .live-news-widget .live-news-widget-text-wrap { height: 40px } .live-news-widget .live-news-widget-text { color: #8b8b8b; font-size: .75em; line-height: 40px } .live-news-widget .live-news-widget-text .link { color: #fff } .live-news-widget .live-news-widget-text .separator { margin: 0 12px; color: #ffb400; font-weight: 700 } .widget-item .section-title-wrap { margin-bottom: 26px } .widget-item .section-title-wrap.no-space { margin-bottom: 0 } .widget-item .section-title-wrap.small-space { margin-bottom: 10px } .widget-sidebar .section-title-wrap { margin-bottom: 26px } .widget-sidebar .section-title-wrap.no-space { margin-bottom: 0 } .widget-sidebar .section-title-wrap.small-space { margin-bottom: 10px } .widget-sidebar .sidebar-search-form { width: 270px; position: static } .widget-sidebar .widget-team-vs { width: 100% } .loader { width: 40px; height: 40px; border: 4px solid #dbdbdb; border-top: 4px solid transparent; border-radius: 50%; animation: spin 1s linear infinite forwards } .loader.blue { border-top-color: #1c95f3 } .loader.red { border-top-color: #f30a5c } .loader.green { border-top-color: #58d819 } .loader.yellow { border-top-color: #ffb400 } .loader.violet { border-top-color: #7442ce } .loader.cyan { border-top-color: #00e3d0 } .loader-error { color: #f30a5c; font-size: .875em; font-weight: 700; text-align: center } .comment-preview { padding: 2px 0 0 70px; position: relative } .comment-preview .user-avatar { position: absolute; top: 0; left: 0 } .comment-preview .comment-preview-title { color: #363636 } .comment-preview .comment-preview-link { font-size: .6875em; font-weight: 700 } .comment-preview .comment-preview-link.blue { color: #1c95f3 } .comment-preview .comment-preview-link.red { color: #f30a5c } .comment-preview .comment-preview-link.yellow { color: #ffb400 } .comment-preview .comment-preview-link.green { color: #58d819 } .comment-preview .comment-preview-link.violet { color: #7442ce } .comment-preview .comment-preview-link.cyan { color: #00e3d0 } .comment-preview .comment-preview-text { margin-top: 4px; font-size: .75em; line-height: 1.6666666667em } .poll-widget { width: 270px; margin: 0 auto } .poll-widget .poll-widget-title { color: #363636 } .poll-widget .poll-widget-form { margin-top: 24px } .poll-widget .poll-widget-form .poll-widget-form-actions { margin-top: 34px; display: flex; flex-flow: row wrap } .poll-widget .poll-widget-form .poll-widget-form-actions .button { width: 120px; padding: 0 } .poll-widget .poll-widget-form .poll-widget-form-actions .button:nth-child(1) { margin-right: 10px } .poll-widget .poll-results-wrap { margin-top: 44px } .poll-widget .poll-results-wrap .progress-bar { margin-bottom: 40px } .poll-widget .poll-results-wrap .progress-bar:last-child { margin-bottom: 0 } .stream-preview .stream-preview-streamer { min-height: 70px; padding: 14px 100px 12px 20px; position: relative } .stream-preview .stream-preview-streamer.stream-preview-streamer-1 { background: url("../img/streamers/streambox-01.jpg") no-repeat center; background-size: cover } .stream-preview .stream-preview-streamer.stream-preview-streamer-2 { background: url("../img/streamers/streambox-02.jpg") no-repeat center; background-size: cover } .stream-preview .stream-preview-streamer.stream-preview-streamer-3 { background: url("../img/streamers/streambox-03.jpg") no-repeat center; background-size: cover } .stream-preview .stream-preview-streamer .stream-preview-streamer-img { position: absolute; top: 0; right: 0 } .stream-preview .stream-preview-streamer .stream-preview-streamer-name { color: #fff; line-height: 1em } .stream-preview .stream-preview-streamer .stream-preview-streamer-topic { margin-top: 4px; color: #fff; font-size: .5625em; line-height: 1em } .stream-preview .stream-preview-streamer .stream-start-counter { margin-top: 10px; color: #fff } .stream-start-counter { padding-left: 8px; position: relative } .stream-start-counter:before { content: ''; width: 4px; height: 4px; border-radius: 50%; background-color: #00e3d0; position: absolute; top: 1px; left: 0 } .stream-start-counter.live:before { background-color: #f30a5c } .stream-start-counter.offline:before { background-color: #b8b8b8 } .stream-start-counter .highlighted { color: #00fee9 } .stream-start-counter .timer-text-hours:after, .stream-start-counter .timer-text-minutes:after { content: ':' } .post-preview-set { display: flex; flex-flow: row wrap } .post-preview-set .post-preview-set-left .post-preview, .post-preview-set .post-preview-set-right .post-preview { width: 100% } .post-preview-set .post-preview-set-left { width: 570px } .post-preview-set .post-preview-set-right { width: 300px; display: flex; flex-flow: column wrap } .events-preview.full .event-preview-item { padding-right: 160px } .events-preview.full .event-preview-item .button { padding: 0 34px; position: absolute; top: 26px; right: 0 } .events-preview .event-preview-header { height: 40px; border-bottom: 1px solid #dbdbdb } .events-preview .event-preview-header .event-preview-header-text { line-height: 40px } .events-preview .event-preview-item { padding: 22px 0 22px 90px; border-bottom: 1px solid #dbdbdb; position: relative } .events-preview .event-preview-item .event-preview-item-decoration { width: 14px; height: 14px; border-radius: 50%; background-color: #363636; position: absolute; top: 24px; left: 0 } .events-preview .event-preview-item .event-preview-item-decoration.blue { background-color: #1c95f3 } .events-preview .event-preview-item .event-preview-item-decoration.green { background-color: #58d819 } .events-preview .event-preview-item .event-preview-item-decoration.red { background-color: #f30a5c } .events-preview .event-preview-item .event-preview-item-decoration.violet { background-color: #7442ce } .events-preview .event-preview-item .event-preview-item-decoration.yellow { background-color: #ffb400 } .events-preview .event-preview-item .event-preview-item-decoration.cyan { background-color: #00e3d0 } .events-preview .event-preview-item .event-preview-item-decoration:before { content: ''; width: 6px; height: 6px; border-radius: 50%; background-color: #fff; position: absolute; top: 4px; left: 4px } .events-preview .event-preview-item .event-preview-item-timestamp { color: #363636; position: absolute; top: 26px; left: 22px } .events-preview .event-preview-item .event-preview-item-content .event-preview-item-title { display: inline-block; margin-bottom: 6px; color: #363636 } .events-preview .event-preview-item .event-preview-item-content .event-preview-item-text { font-size: .6875em; line-height: 1.2727272727em } .team-score-boxes-title-wrap { display: flex; flex-flow: row wrap } .team-score-boxes-title-wrap.big .team-score-box-title { width: 82px } .team-score-boxes-title-wrap.large .team-score-box-title { width: 92px } .team-score-boxes-title-wrap.large .team-score-box-title:last-child { width: 100px } .team-score-boxes-title-wrap .team-score-box-title { width: 52px; color: #363636; line-height: 40px; text-align: center } .team-score-boxes { display: flex; flex-flow: row wrap } .team-score-boxes.fill-end .team-score-box:last-child { border-right: 1px solid #dbdbdb } .team-score-boxes.large .team-score-box { width: 92px; height: 120px } .team-score-boxes.large .team-score-box.final { width: 100px } .team-score-boxes.large .team-score-box.final .team-points { font-size: 2em } .team-score-boxes.large .team-score-box .team-points { font-size: 1.75em; line-height: 120px } .team-score-boxes.large .team-score-box .featured-corner-icon { width: 24px; height: 24px } .team-score-boxes.big .team-score-box { width: 82px; height: 86px } .team-score-boxes.big .team-score-box.final .team-points { font-size: 1.625em } .team-score-boxes.big .team-score-box .featured-corner-icon { width: 24px; height: 24px } .team-score-boxes.big .team-score-box .team-points { font-size: 1.375em; line-height: 86px } .team-score-boxes.medium .team-score-box { width: 52px } .team-score-boxes.small .team-score-box { width: 52px; height: 52px } .team-score-boxes.small .team-score-box .team-score-box-text { line-height: 52px } .team-score-boxes .team-score-box { width: 42px; height: 58px; border-left: 1px solid #dbdbdb; position: relative } .team-score-boxes .team-score-box .featured-corner-icon { width: 18px; height: 18px; position: absolute; top: 0; right: 0 } .team-score-boxes .team-score-box.filled { background-color: #f9f9f9; border-bottom: 1px solid #dbdbdb } .team-score-boxes .team-score-box.win .team-points { font-weight: 600; opacity: 1 } .team-score-boxes .team-score-box.final .team-points { color: #363636; font-weight: 700; opacity: 1 } .team-score-boxes .team-score-box.final.win .featured-corner-icon { fill: #ffb400 } .team-score-boxes .team-score-box .team-points { color: #8b8b8b; font-weight: 400; line-height: 58px; text-align: center; opacity: 0.6 } .team-score-boxes .team-score-box .team-score-box-text { color: #8b8b8b; line-height: 58px; text-align: center } .team-score-boxes .team-score-box .team-score-icon { margin-top: 17px; text-align: center } .team-score-boxes .team-score-box .team-score-icon.explosion { margin-top: 13px } .widget-characters { width: 100%; } .widget-characters .widget-characters-header { height: 62px; padding: 18px 0 0 16px; border-bottom: 1px solid #dbdbdb } .widget-characters-list { display: flex; flex-flow: row wrap } .widget-characters-list .widget-characters-list-item { width: 20%; height: 76px; padding: 16px 0 0 16px; border-right: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb } .widget-characters-list .widget-characters-list-item:nth-child(5n+5) { border-right: none } .widget-characters-list .widget-characters-list-item .team-info-wrap.medium .team-info { margin: 16px 0 0 12px } .widget-slider-wrap { width: 270px; height: 310px; padding-bottom: 20px; border-bottom: 1px solid #dbdbdb; position: relative; overflow: hidden } .widget-slider-wrap .widget-slider { width: 100%; height: 100% } .widget-slider-wrap .widget-slider-controls .control-next, .widget-slider-wrap .widget-slider-controls .control-previous { position: absolute; top: 100px; z-index: 9999 } .widget-slider-wrap .widget-slider-controls .control-next { right: 10px } .widget-slider-wrap .widget-slider-controls .control-previous { left: 10px } .widget-slider-items { width: 100%; height: 100% } .widget-slider-items .widget-slider-item { width: 100%; height: 100%; padding-top: 20px } .widget-slider-items .widget-slider-item .widget-slider-item-img { display: block; margin: 0 auto } .widget-slider-items .widget-slider-item .widget-slider-item-title { margin-top: 30px; color: #363636; line-height: 1em; text-align: center } .widget-slider-items .widget-slider-item .widget-slider-item-text { margin-top: 10px; color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase; text-align: center } .widget-medals { padding-bottom: 26px; border-bottom: 1px solid #dbdbdb } .widget-medals.multiple-items { display: flex; flex-flow: row wrap } .widget-medals .medal-list { margin-top: 20px } .widget-medals .widget-medals-img { margin-right: 16px } .widget-medals .widget-medals-info { margin-top: 16px } .widget-medals .widget-medals-info:last-child { margin-left: auto } .widget-medals .widget-medals-info:last-child .widget-medals-title, .widget-medals .widget-medals-info:last-child .widget-medals-text { text-align: right } .widget-medals .widget-medals-info .widget-medals-title { color: #363636 } .widget-medals .widget-medals-info .widget-medals-text { margin-top: 8px; color: #8b8b8b; font-size: .625em; text-transform: uppercase; line-height: 1em } .medal-list { display: flex; flex-flow: row wrap; justify-content: space-around } .medal-list.landscape { justify-content: space-between } .medal-list.landscape .medal-list-item { display: flex; flex-flow: row wrap } .medal-list.landscape .medal-list-item .medal-list-item-img { margin: 0 10px 0 0 } .medal-list.landscape .medal-list-item .medal-list-item-title, .medal-list.landscape .medal-list-item .medal-list-item-text { text-align: left } .medal-list .medal-list-item .medal-list-item-img { margin-bottom: 16px } .medal-list .medal-list-item .medal-list-item-title, .medal-list .medal-list-item .medal-list-item-text { line-height: 1em; text-align: center } .medal-list .medal-list-item .medal-list-item-title { color: #363636 } .medal-list .medal-list-item .medal-list-item-text { margin-top: 6px; color: #8b8b8b; font-size: .625em; text-transform: uppercase } .widget-row { height: 42px; padding: 0 16px; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .widget-row.filled { background-color: #f9f9f9 } .widget-row.mobile { display: none } .widget-combined-stat .arc-rate-wrap { margin-bottom: 64px } .widget-overall-stats { display: flex; flex-flow: row wrap; padding-top: 18px; border-bottom: 1px solid #dbdbdb } .widget-overall-stats.small { width: 270px } .widget-overall-stats.small .widget-overall-stat { margin-right: 21px } .widget-overall-stats.small .widget-overall-stat:nth-child(8n+8) { margin-right: 21px } .widget-overall-stats.small .widget-overall-stat:nth-child(3n+3) { margin-right: 0 } .widget-overall-stats .widget-overall-stat { margin: 0 23px 18px 0 } .widget-overall-stats .widget-overall-stat:nth-child(8n+8) { margin-right: 0 } .widget-tournament-results { display: flex; flex-flow: row wrap; flex-wrap: nowrap } .widget-tournament-results .widget-tournament-result-wrap { margin-right: 30px } .widget-tournament-results .widget-tournament-result-wrap:first-child .widget-tournament-result .widget-match-box:before { display: none } .widget-tournament-results .widget-tournament-result-wrap:last-child { margin-right: 0 } .widget-tournament-results .widget-tournament-result-wrap:last-child .widget-tournament-result .widget-match-box:after { display: none } .widget-tournament-results .widget-tournament-result { position: relative } .widget-tournament-results .widget-tournament-result.tier-2, .widget-tournament-results .widget-tournament-result.tier-3 { margin-bottom: 26px } .widget-tournament-results .widget-tournament-result.tier-2:after, .widget-tournament-results .widget-tournament-result.tier-3:after { content: ''; width: 1px; background-color: #dbdbdb; position: absolute; right: -16px } .widget-tournament-results .widget-tournament-result.tier-2:last-child, .widget-tournament-results .widget-tournament-result.tier-3:last-child { margin-bottom: 0 } .widget-tournament-results .widget-tournament-result.tier-0 { padding: 244px 0 246px } .widget-tournament-results .widget-tournament-result.tier-0 .widget-match-box:before { top: 29px } .widget-tournament-results .widget-tournament-result.tier-1 { padding: 216px 0 } .widget-tournament-results .widget-tournament-result.tier-2 { padding: 72px 0 } .widget-tournament-results .widget-tournament-result.tier-2:nth-child(odd):after { top: 130px } .widget-tournament-results .widget-tournament-result.tier-2:nth-child(even):after { display: none } .widget-tournament-results .widget-tournament-result.tier-2:after { height: 289px } .widget-tournament-results .widget-tournament-result.tier-3:after { height: 145px; top: 58px } .widget-tournament-results .widget-tournament-result.tier-3 .widget-match-box { margin-bottom: 26px } .widget-tournament-results .widget-tournament-result.tier-3 .widget-match-box:last-child { margin-bottom: 0 } .widget-tournament-results .widget-tournament-result .widget-match-box { position: relative } .widget-tournament-results .widget-tournament-result .widget-match-box:before, .widget-tournament-results .widget-tournament-result .widget-match-box:after { content: ''; width: 16px; height: 1px; background-color: #dbdbdb; position: absolute; top: 57px } .widget-tournament-results .widget-tournament-result .widget-match-box:before { left: -16px } .widget-tournament-results .widget-tournament-result .widget-match-box:after { right: -16px } .widget-tickets .ticket-wrap { margin-bottom: 24px } .widget-tickets .ticket-wrap:last-child { margin-bottom: 0 } .widget-display { padding: 18px 0; border-bottom: 1px solid #dbdbdb } .widget-display.multiple-items { display: flex; flex-flow: row wrap; justify-content: space-between } .widget-display.multiple-items.space-around { justify-content: space-around } .widget-display.spaced-items { justify-content: flex-start; padding: 18px 0 0 } .widget-display.spaced-items.medium { padding: 24px 0 0 } .widget-display.spaced-items.medium .featured-stat-wrap { margin-bottom: 24px } .widget-display.spaced-items .featured-stat-wrap { margin: 0 60px 18px 0 } .widget-display.spaced-items .featured-stat-wrap:last-child { margin-right: 0 } .widget-display.medium { padding: 24px 0 } .widget-display.align-left { justify-content: space-between; padding-right: 114px } .widget-display.center { justify-content: center; text-align: center } .widget-display.no-border { border: none } .widget-team-list { display: flex; flex-flow: row wrap } .widget-team-list .widget-team-list-item { width: 45px; height: 57px; border-right: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: center; align-items: center } .widget-team-list .widget-team-list-item:nth-child(6n+6) { border-right: none } .widget-team-list .widget-team-list-item.eliminated .team-logo { opacity: 0.2 } .widget-team-list .widget-team-list-item .cross-icon { fill: #dbdbdb } .widget-player-preview { display: flex; flex-flow: row wrap; justify-content: center; margin: 0 auto } .widget-player-preview .player-preview { margin-right: 20px } .widget-player-preview .player-preview:nth-child(5n+5) { margin-right: 0 } .widget-team-overview { padding: 42px 40px 55px } .overview-info-wrap { display: flex; flex-flow: row wrap } .overview-info-wrap .overview-info { width: 200px } .overview-info-wrap .stats-info { margin-left: auto } .overview-info-wrap .overview-info-item { margin-bottom: 30px } .overview-info-wrap .overview-info-item:last-child { margin-bottom: 0 } .overview-info-wrap .overview-info-item .overview-info-item-title { color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase } .overview-info-wrap .overview-info-item .overview-info-item-text { margin-top: 12px; color: #363636; line-height: 1em } .overview-info-wrap .overview-info-item .overview-info-item-text.centered { display: flex; flex-flow: row wrap; align-items: center } .overview-info-wrap .overview-info-item .overview-info-item-text .team-logo { width: 20px; height: 20px; margin-right: 6px } .overview-info-wrap .overview-info-item .overview-info-item-text img { margin-right: 4px } .team-overview { display: flex; flex-flow: row wrap } .team-overview .team-logo { margin: 0 76px 0 10px } .team-overview .overview-info-wrap { padding-top: 10px } .team-overview .arc-rate-wrap { margin: 4px 0 0 auto } .widget-calendar-row { border-bottom: 1px solid #dbdbdb; position: relative } .widget-calendar-row .calendar-row-wrap { height: 66px; position: relative; overflow: hidden } .widget-calendar-row .calendar-row-wrap .calendar-row-items-wrap { width: 1170px; position: absolute; top: 0; left: 50%; margin-left: -585px } .widget-calendar-row .calendar-row-wrap .calendar-row-items { height: 66px; display: flex; flex-flow: row nowrap; align-items: center; justify-content: center } .widget-calendar-row .calendar-row-wrap .calendar-row-items .calendar-row-item { width: 60px; text-align: center } .widget-calendar-row .calendar-row-wrap .calendar-row-items .calendar-row-item .calendar-row-item-month { color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase } .widget-calendar-row .calendar-row-wrap .calendar-row-items .calendar-row-item .calendar-row-item-day { margin-top: 6px; color: #363636; line-height: 1em } .widget-calendar-row .calendar-row-wrap .calendar-row-items .calendar-row-item .calendar-row-item-day.active { color: #7442ce } .widget-calendar-row .slider-controls .control-next, .widget-calendar-row .slider-controls .control-previous { position: absolute; bottom: 20px } .widget-calendar-row .slider-controls .control-next { right: 0 } .widget-calendar-row .slider-controls .control-previous { left: 0 } @media screen and (max-width: 1260px) { .widget-sidebar .sidebar-search-form { width: 870px; position: absolute; top: 30px; left: 50%; margin-left: -435px } .widget-row.full { display: none } .widget-row.mobile { display: flex; flex-flow: row wrap } .widget-media-wrap.popup-display .widget-media-r, .widget-media-wrap.big .widget-media-r, .widget-media-wrap.large .widget-media-r, .widget-media-wrap.huge .widget-media-r { height: 0; padding-bottom: 43%; position: relative } .widget-media-wrap.popup-display .widget-media-r iframe, .widget-media-wrap.popup-display .widget-media-r img, .widget-media-wrap.big .widget-media-r iframe, .widget-media-wrap.big .widget-media-r img, .widget-media-wrap.large .widget-media-r iframe, .widget-media-wrap.large .widget-media-r img, .widget-media-wrap.huge .widget-media-r iframe, .widget-media-wrap.huge .widget-media-r img { height: 100%; position: absolute } .widget-media-wrap.popup-display.popup-wrap { width: 95% } .widget-player-preview { width: 694px } .widget-player-preview .player-preview:nth-child(5n+5) { margin-right: 20px } .widget-player-preview .player-preview:nth-child(3n+3), .widget-player-preview .player-preview:last-child { margin-right: 0 } .widget-team-overview { padding-left: 0; padding-right: 0 } .team-overview { justify-content: center } .team-overview .overview-info { width: 170px } .team-overview .arc-rate-wrap { display: none } } @media screen and (max-width: 960px) { .live-news-widget { padding: 0 115px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(1) { width: 150px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(2) { width: 145px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(3) { width: 140px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(4) { width: 135px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(5) { width: 130px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(6) { width: 125px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(7) { width: 120px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(8) { width: 115px } .widget-sidebar .sidebar-search-form { width: 100%; position: absolute; top: 30px; left: 0; margin-left: 0 } .post-preview-set .post-preview-set-left, .post-preview-set .post-preview-set-right { width: 100% } .post-preview-set .post-preview-set-right { flex-direction: row } .post-preview-set .post-preview-set-right .post-preview { width: 33.3333333333% } .widget-stat-rows .widget-stat-row { display: block } .widget-stat-rows .widget-stat-row .progress-stat-wrap { margin: 22px 0 24px } .widget-stat-rows .widget-stat-row .progress-stat-wrap:first-child { margin-left: 0 } .widget-stat-rows .widget-stat-row .progress-stat-wrap:last-child { margin-right: 0 } .widget-stat-rows .widget-stat-row .arc-stats-wrap { margin: 16px 0; justify-content: center } .widget-stat-rows .widget-stat-row .arc-stats-wrap:first-child { margin-left: 0 } .widget-stat-rows .widget-stat-row .widget-stat-info-wrap { margin-top: 28px; justify-content: center } .widget-stat-rows .widget-stat-row .widget-stat-info-wrap:last-child { margin-right: 0; margin-bottom: 30px } .widget-match-box-wrap { display: block } .widget-match-box-wrap .widget-match-box .widget-match-box-row.padded-right, .widget-match-box-wrap .widget-match-box .widget-match-box-row.padded-right-small { padding-right: 0 } .widget-match-box-wrap .widget-match-box .widget-match-box-row .featured-stat-wrap .featured-stat-title, .widget-match-box-wrap .widget-match-box .widget-match-box-row .featured-stat-wrap .featured-stat-text, .widget-match-box-wrap .widget-match-box .widget-match-box-row .featured-stat-wrap.right .featured-stat-title, .widget-match-box-wrap .widget-match-box .widget-match-box-row .featured-stat-wrap.right .featured-stat-text { text-align: center } .widget-match-box-wrap .widget-match-box:nth-child(1) .widget-title-wrap, .widget-match-box-wrap .widget-match-box:nth-child(1) .widget-match-box-row { padding-right: 0 } .widget-match-box-wrap .widget-match-box:nth-child(2) .widget-match-box-row { padding: 0 30px } .widget-match-box-wrap .widget-match-box:nth-child(1), .widget-match-box-wrap .widget-match-box:nth-child(2), .widget-match-box-wrap .widget-match-box:nth-child(3) { width: 270px; margin: 0 auto } .widget-match-box.multiple-items, .widget-match-box.multiple-items.inverted { display: block } .widget-match-box.multiple-items .widget-team-vs, .widget-match-box.multiple-items.inverted .widget-team-vs { width: auto } .widget-match-box.multiple-items .widget-team-vs.medium, .widget-match-box.multiple-items .widget-team-vs.big, .widget-match-box.multiple-items.inverted .widget-team-vs.medium, .widget-match-box.multiple-items.inverted .widget-team-vs.big { padding: 0 52px } .widget-match-box.multiple-items .widget-info-box, .widget-match-box.multiple-items.inverted .widget-info-box { padding: 0; margin-bottom: 30px; text-align: center } .widget-match-box.multiple-items .widget-info-box .countdown-text-heading, .widget-match-box.multiple-items .widget-info-box .countdown-text, .widget-match-box.multiple-items.inverted .widget-info-box .countdown-text-heading, .widget-match-box.multiple-items.inverted .widget-info-box .countdown-text { text-align: center } .widget-match-box.multiple-items .widget-info-box .progress-bar, .widget-match-box.multiple-items.inverted .widget-info-box .progress-bar { margin: 8px auto 0 } .widget-match-box.multiple-items .widget-media, .widget-match-box.multiple-items.inverted .widget-media { margin: 16px auto 30px } .widget-title-wrap .widget-title-item.medium { width: 100% } .widget-title-wrap .widget-title-item.no-mobile { display: none } .team-score-boxes-title-wrap.large .team-score-box-title { width: 82px } .team-score-boxes-title-wrap.large .team-score-box-title:last-child { width: 82px } .widget-team-vs.v3.big .team-info-wrap { margin-left: 20px } .team-score-boxes.large .team-score-box { width: 82px } .team-score-boxes.large .team-score-box.final { width: 82px } .widget-characters { width: 522px; margin: 0 auto } .widget-characters .widget-characters-list .widget-characters-list-item:nth-child(5n+5) { border-right: 1px solid #dbdbdb } .widget-characters .widget-characters-list .widget-characters-list-item:nth-child(3n+3) { border-right: none } .widget-overall-stats.full { width: 555px; margin: 0 auto } .widget-overall-stats.full .widget-overall-stat:nth-child(8n+8) { margin-right: 23px } .widget-overall-stats.full .widget-overall-stat:nth-child(5n+5) { margin-right: 0 } .widget-player-preview { width: 456px } .widget-player-preview .player-preview:nth-child(3n+3) { margin-right: 20px } .widget-player-preview .player-preview:nth-child(even) { margin-right: 0 } .widget-team-overview { padding-left: 0; padding-right: 0 } .team-overview { display: block } .team-overview .team-logo { display: block; margin: 0 auto } .team-overview .team-logo.big { width: 100px; height: 100px } .team-overview .overview-info-wrap { justify-content: space-evenly; padding-top: 40px } .team-overview .overview-info { width: auto } } @media screen and (max-width: 680px) { .live-news-widget { padding: 0 45px } .live-news-widget .live-news-widget-title-wrap { display: none } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(1) { width: 80px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(2) { width: 75px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(3) { width: 70px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(4) { width: 65px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(5) { width: 60px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(6) { width: 55px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(7) { width: 50px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(8) { width: 45px } .post-preview-set .post-preview-set-right .post-preview { width: 100% } .widget-simple-stats { display: block } .widget-simple-stats.v2 .widget-simple-stat:nth-child(2n+2) .widget-simple-stat-rows { border-left: none } .widget-simple-stats .widget-simple-stat.half { width: 100% } .widget-simple-stats .widget-simple-stat:first-child .widget-simple-stat-rows .widget-simple-stat-row { padding-right: 16px } .widget-match-box.multiple-items .widget-team-vs.v2.medium, .widget-match-box.multiple-items .widget-team-vs.v2.big { padding: 20px 16px 10px } .widget-match-box.multiple-items .widget-team-vs.v2.medium .match-time.big, .widget-match-box.multiple-items .widget-team-vs.v2.big .match-time.big { margin-top: 10px } .widget-match-box.multiple-items .widget-info-box, .widget-match-box.multiple-items .widget-media { margin-top: 40px } .widget-match-box .widget-match-box-items { display: block } .widget-match-box .widget-match-box-items .widget-team-vs { width: 100%; border-bottom: 1px solid #dbdbdb; border-right: none } .widget-match-box .widget-match-box-items .widget-match-box-item-wrap { width: 100% } .widget-match-box .widget-match-box-row.big .match-stats { margin: 0 40px } .widget-match-box .widget-match-box-row.big .match-stats .match-score.big { font-size: 1.375em } .widget-team-vs.v2.medium, .widget-team-vs.v2.big { height: auto; padding: 20px 16px 10px } .widget-team-vs.v2.medium.centered, .widget-team-vs.v2.big.centered { height: auto; padding-top: 20px } .widget-team-vs.v2.medium.centered .match-stats, .widget-team-vs.v2.big.centered .match-stats { margin: 0 40px } .widget-team-vs.v2.medium.centered .team-info-wrap .team-info, .widget-team-vs.v2.big.centered .team-info-wrap .team-info { text-align: center } .widget-team-vs.v2.medium .team-info-wrap.medium, .widget-team-vs.v2.big .team-info-wrap.medium { display: block; margin-top: 0; text-align: center } .widget-team-vs.v2.medium .team-info-wrap.medium.inverted .team-info, .widget-team-vs.v2.big .team-info-wrap.medium.inverted .team-info { margin: 6px 0 0 0; text-align: center } .widget-team-vs.v2.medium .team-info-wrap.medium .team-logo, .widget-team-vs.v2.big .team-info-wrap.medium .team-logo { width: 30px; height: 30px } .widget-team-vs.v2.medium .team-info-wrap.medium .team-info, .widget-team-vs.v2.big .team-info-wrap.medium .team-info { margin: 6px 0 0 0 } .widget-team-vs.v2.medium .team-info-wrap.medium .team-info .team-country, .widget-team-vs.v2.big .team-info-wrap.medium .team-info .team-country { margin-top: 3px } .widget-team-vs.v2.medium .match-stats .match-score.medium, .widget-team-vs.v2.big .match-stats .match-score.medium { margin-top: 20px; font-size: 1.375em } .widget-team-vs.v3.big .widget-team-vs-item { height: 86px } .widget-team-vs.v3.big .team-info-wrap { margin: 14px 0 0 10px } .widget-team-vs.v3.big .team-info-wrap.medium .team-logo { width: 30px; height: 30px; margin-top: 10px } .widget-team-vs.v3.big .team-info-wrap.medium .team-info { margin: 18px 0 0 10px } .widget-team-vs.v3.big .team-info-wrap.medium .team-info .team-name { font-size: .6875em } .team-score-boxes-title-wrap.no-title-mobile { display: none } .team-score-boxes.big .team-score-box, .team-score-boxes.large .team-score-box { width: 58px; height: 86px } .team-score-boxes.big .team-score-box:last-child, .team-score-boxes.large .team-score-box:last-child { width: 58px } .team-score-boxes.big .team-score-box .team-points, .team-score-boxes.large .team-score-box .team-points { font-size: 1.125em; line-height: 86px } .team-score-boxes.big .team-score-box.final .team-points, .team-score-boxes.large .team-score-box.final .team-points { font-size: 1.375em } .widget-team-builds-header { position: relative; padding-bottom: 90px } .widget-team-builds-header .button { width: 220px; padding: 0; text-align: center; position: absolute; top: 60px; left: 50%; margin-left: -110px } .widget-team-builds-header .team-logo { width: 30px; height: 30px } .widget-team-builds-header .team-info-wrap.medium .team-info { margin-top: 8px } .widget-characters { width: 270px } .widget-characters .widget-characters-list .widget-characters-list-item { width: 135px } .widget-characters .widget-characters-list .widget-characters-list-item:nth-child(3n+3) { border-right: 1px solid #dbdbdb } .widget-characters .widget-characters-list .widget-characters-list-item:nth-child(2n+2) { border-right: none } .widget-overall-stats.full { width: 421px } .widget-overall-stats.full .widget-overall-stat:nth-child(5n+5) { margin-right: 23px } .widget-overall-stats.full .widget-overall-stat:nth-child(4n+4) { margin-right: 0 } .widget-display.align-left { padding-right: 0; padding-bottom: 0; justify-content: space-evenly } .widget-display.align-left .featured-stat-wrap { margin: 0 30px 24px 0 } .widget-display.align-left .featured-stat-wrap:last-child { margin-right: 0 } .widget-player-preview { width: 218px } .widget-player-preview .player-preview { margin-right: 0 } .widget-player-preview .player-preview:nth-child(3n+3) { margin-right: 0 } .events-preview.full .event-preview-item { padding-right: 16px } .events-preview.full .event-preview-item .button { position: static; margin-top: 16px } } @media screen and (max-width: 480px) { .live-news-widget { padding: 0 5px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(1) { width: 40px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(2) { width: 35px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(3) { width: 30px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(4) { width: 25px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(5) { width: 20px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(6) { width: 15px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(7) { width: 10px } .live-news-widget .live-news-widget-stairs .live-news-widget-stair:nth-child(8) { width: 5px } .team-score-boxes.big .team-score-box, .team-score-boxes.large .team-score-box { width: 42px } .team-score-boxes.big .team-score-box:last-child, .team-score-boxes.large .team-score-box:last-child { width: 42px } .widget-overall-stats.full { width: 200px } .widget-overall-stats.full .widget-overall-stat:nth-child(4n+4) { margin-right: 23px } .widget-overall-stats.full .widget-overall-stat:nth-child(2n+2) { margin-right: 0 } } .table { display: table; width: 100%; border-bottom: 1px solid #dbdbdb } .table.mobile { display: none } .table.order-overview .table-row-item { padding: 26px 0 } .table.order-overview .table-row-item .product-name { color: #363636; line-height: 1em } .table.order-overview .table-row-item .product-category { margin-top: 4px; color: #8b8b8b } .table.order-overview .table-row-item .rating-ornament { padding: 0 } .table.forum-categories .table-row-item .table-text { margin-bottom: 20px } .table.forum-categories+.table.forum-topics { margin-top: 10px } .table.forum-messages .table-row-item { padding: 26px 0 } .table.forum-messages .table-row-item.padded-big { padding: 0 20px } .table.forum-messages .table-row-item .rl-label { padding: 0 0 0 30px; font-size: .75em } .table.forum-messages .table-row-item:first-child { padding-left: 16px } .table.forum-topics .table-row-item { padding: 32px 0 } .table.forum-topics .table-row-item.padded-big { padding: 0 20px } .table.forum-topics .table-row-item .forum-post-link { width: 470px } .table.forum-topics .table-row-item:first-child { padding-left: 30px } .table.records .table-rows .table-row-item:first-child { padding-left: 16px } .table.game-overview .table-rows .table-row-item:first-child .team-info-wrap { margin-left: 24px } .table.game-overview+.table.game-overview { margin-top: 10px } .table.lineups.mobile .table-row-header-item:first-child { width: 250px } .table.lineups.mobile+.table.lineups.mobile { margin-top: 30px } .table.lineups.full-stats+.widget-row { border-top: none } .table.lineups.game-leaders+.table.lineups.game-leaders .table-row-header .table-row-header-item { border-top: none } .table.lineups.game-leaders .table-rows .table-row-item:last-child .team-logo { display: block; margin: 0 auto } .table.lineups.most-played+.table.lineups.most-played .table-row-header .table-row-header-item { border-top: none } .table.lineups.most-played .table-row-item .table-text { position: relative } .table.lineups.most-played .table-row-item .table-text .rate-up, .table.lineups.most-played .table-row-item .table-text .rate-down { position: absolute; top: -14px; left: 50%; margin-left: -3px } .table.lineups .table-text .highlight:nth-child(1) { color: #7442ce } .table.lineups .table-text .highlight:nth-child(2) { color: #00e3d0 } .table.lineups .table-text .highlight:nth-child(3) { color: #777 } .table.lineups .table-row-header-item { vertical-align: middle } .table.lineups .table-row-header-item.left .table-row-header-title { margin-left: 16px } .table.lineups .table-row-header-item.right .table-row-header-title { margin-right: 16px } .table.lineups .table-row-header-item .team-info-wrap { margin: 0 0 14px 16px } .table.lineups .table-row-header-item .team-info-wrap.inverted { margin: 0 16px 14px 0 } .table.lineups .table-row-item .team-info-wrap { margin: 0 0 0 16px } .table.lineups .table-row-item .team-info-wrap .hexagon+.hexagon { margin: 0 0 0 12px } .table.lineups .table-row-item .team-info-wrap .hexagon+.team-info { margin: 12px 0 0 16px } .table.lineups .table-row-item .team-info-wrap.medium .team-country { text-transform: uppercase } .table.lineups .table-row-item .team-info-wrap.inverted { margin: 0 16px 0 0 } .table.lineups .table-row-item .team-info-wrap.inverted .hexagon { order: 3 } .table.lineups .table-row-item .team-info-wrap.inverted .hexagon+.hexagon { order: 2; margin: 0 12px 0 0 } .table.lineups .table-row-item .team-info-wrap.inverted .hexagon+.team-info { order: 1; margin: 12px 16px 0 0 } .table.lineups .table-row-item .skill-loot-list:first-child { margin-top: 8px } .table.matches .team-info-wrap { padding: 0 0 0 20px } .table.matches .team-info-wrap.inverted { padding: 0 20px 0 0 } .table.matches.hoverable .match-stats { margin-top: 10px } .table.matches.hoverable .match-score { transition: all .3s ease-in-out } .table.matches.hoverable .match-link { opacity: 0; visibility: hidden; position: relative; top: 0; transition: all .3s ease-in-out } .table.matches.hoverable .table-row:hover .match-score { opacity: 0; visibility: hidden } .table.matches.hoverable .table-row:hover .match-link { opacity: 1; visibility: visible; top: -10px } .table.top-players, .table.ranked-stats, .table.champion-stats, .table.champion-rates, .table.player-roles { width: 270px } .table.champion-rates .table-row-item .progress-bar { margin: 17px 0 0 auto } .table-row-header { display: table-header-group } .table-row-header.colored { background-color: #f9f9f9 } .table-row-header.big .table-row-header-item { height: 42px } .table-row-header.bordered .table-row-header-item { border-top: 1px solid #dbdbdb } .table-row-header-item { display: table-cell; height: 40px; vertical-align: middle } .table-row-header-item.padded { padding: 0 10px } .table-row-header-item.padded-big { padding: 0 20px } .table-row-header-item.padded-large { padding: 0 60px } .table-row-header-item.position .table-row-header-title, .table-row-header-item.left .table-row-header-title { text-align: left } .table-row-header-item.right .table-row-header-title { text-align: right } .table-row-header-item .table-row-header-title { color: #363636; text-align: center } .table-rows { display: table-row-group } .table-rows .table-row:nth-child(odd) { background-color: #f9f9f9 } .table-rows .table-row:nth-child(odd).void { background-color: #fff } .table-rows.no-color .table-row:nth-child(odd) { background-color: #fff } .table-row { display: table-row; height: 56px } .table-row.filled { background-color: #f9f9f9 } .table-row.big { height: 76px } .table-row.large .table-row-item .table-text { font-size: .6875em } .table-row.no-border-top .table-row-item { border-top: none } .table-row-item { display: table-cell; border-top: 1px solid #dbdbdb; vertical-align: middle } .table-row-item.centered { text-align: center } .table-row-item.position { display: flex; flex-flow: row wrap } .table-row-item.position .table-text { margin-left: 10px; line-height: 56px } .table-row-item.position .team-info-wrap { margin: 10px 0 0 10px } .table-row-item.left .table-text { text-align: left } .table-row-item.padded { padding: 0 10px } .table-row-item.padded-big { padding: 0 20px } .table-row-item.padded-large { padding: 0 60px } .table-row-item .table-text { color: #8b8b8b; font-weight: 400; text-align: center } .table-row-item .table-text.bold { color: #363636 } .table-row-item .table-text.bold.light { color: #8b8b8b } .table-row-item .table-text.bolder { color: #363636 } .table-row-item .table-text.bolder.light { color: #8b8b8b } .table-row-item .table-text .highlight:nth-child(1) { color: #7442ce } .table-row-item .table-text .highlight:nth-child(2) { color: #00e3d0 } .table-row-item .table-text .highlight:nth-child(3) { color: #777 } .table-row-item .table-text-link { color: #363636; font-weight: 700; text-align: center; cursor: pointer } .table-row-item .table-text-link .play-button-icon { fill: #7442ce; position: relative; top: 1px; margin-right: 6px } .table-row-item .table-text-link:hover { color: #7442ce } .table-row-item .match-stats .match-score, .table-row-item .match-stats .match-link { margin-top: 0 } .featured-info { display: flex; flex-flow: row wrap } .featured-info.small .featured-info-img { margin-right: 10px } .featured-info.small .featured-info-text { font-size: .625em } .featured-info .featured-info-img { margin-right: 16px } .featured-info .featured-info-img.hexagon+.featured-info-text { margin-top: 10px } .featured-info .featured-info-text { margin-top: 4px; color: #363636 } .match-stats { text-align: center } .match-stats .match-score { margin-top: 20px; color: #363636 } .match-stats .match-score.big { font-size: 2em } .match-stats .match-score.small { font-size: .75em } .match-stats .match-score.smaller { font-size: .625em } .match-stats .match-score.tiny { font-size: .5625em } .match-stats .match-score .light { color: #8b8b8b } .match-stats .match-score .team-yellow { color: #dee807 } .match-stats .match-score .team-blue { color: #107df8 } .match-stats .match-link { margin-top: 3px; color: #363636 } .match-stats .match-link.light { color: #777; font-size: .5625em } .match-stats .match-link:hover { color: #7442ce } .match-stats .match-time { margin-top: 6px; color: #363636 } .match-stats .match-time.medium { margin-top: 10px; font-size: .625em } .team-lineups-header { height: 50px; padding: 0 16px; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center } .team-lineups-header.mobile { display: none } .team-lineups-header.medium { height: 85px } @media screen and (max-width: 1260px) { .table.full { display: none } .table.mobile { display: table } .table.forum-categories .table-row-header-item:last-child, .table.forum-categories .table-row-item:last-child { display: none } .table.forum-categories .forum-category-wrap { width: auto } .table.forum-topics .table-row-header-item:first-child, .table.forum-topics .table-row-item:first-child { padding-left: 0 } .table.forum-topics .table-row-header-item:nth-child(3), .table.forum-topics .table-row-item:nth-child(3) { display: none } .team-lineups-header.full { display: none } .team-lineups-header.mobile { display: flex; flex-flow: row wrap } } @media screen and (max-width: 960px) { .table.records .featured-info .featured-info-img { display: none } .table.records .featured-info .featured-info-img.hexagon+.featured-info-text { margin-top: 0 } .table.records .featured-info .featured-info-text { margin-top: 0; line-height: 16px } .table.records .table-text { line-height: 16px } .table.game-overview .table-rows .table-row-item:first-child .team-info-wrap { margin-left: 0 } .table.game-overview .table-rows .table-row-item .team-info { display: none } .table.lineups.game-leaders .table-rows .table-row.big { height: 160px } .table.lineups.game-leaders .table-rows .table-row .table-row-item .team-info-wrap .team-info { text-align: center } .table.matches.hoverable .match-stats { margin-top: 4px } .table.matches.hoverable .match-link { margin-top: 4px; opacity: 1; visibility: visible; position: static } .table.matches.hoverable .table-row:hover .match-score { opacity: 1; visibility: visible } .table.matches .team-info { display: none } .table.matches .table-text-link .play-button-icon { margin-right: 0 } .table.matches .table-text-link .link-text { display: none } .table.hero-stats .table-row-item .featured-stat-wrap { display: none } .table.hero-stats .table-row-item .featured-stat-wrap:nth-child(1), .table.hero-stats .table-row-item .featured-stat-wrap:nth-child(2) { display: block } .table.hero-stats .table-row-item .featured-stat-wrap:nth-child(2) { margin-right: 0 } .table.forum-topics .table-row-header-item:nth-child(4), .table.forum-topics .table-row-header-item:nth-child(5), .table.forum-topics .table-row-item:nth-child(4), .table.forum-topics .table-row-item:nth-child(5) { display: none } .table.forum-topics .table-row-item .forum-post-link, .table.forum-topics .table-row-item .forum-post-description-preview { width: auto; padding-right: 30px } .table.forum-topics .table-row-item .forum-category-text { width: 120px } } @media screen and (max-width: 680px) { .table.most-played .table-row-header-item:nth-child(2), .table.most-played .table-row-header-item:last-child, .table.most-played .table-row-item:nth-child(2), .table.most-played .table-row-item:last-child { display: none } .table.most-played .table-row-item .team-info { display: none } .table.lineups.full-stats.mobile .table-row-item:nth-last-child(2), .table.lineups.full-stats.mobile .table-row-item:last-child, .table.lineups.full-stats.mobile .table-row-header-item:nth-last-child(2), .table.lineups.full-stats.mobile .table-row-header-item:last-child { display: none } .table.order-overview .table-row-header-item:nth-child(2), .table.order-overview .table-row-item:nth-child(2) { display: none } .table.forum-categories .table-row-header-item.padded-large, .table.forum-categories .table-row-item.padded-large { padding: 0 40px } .table.forum-categories .table-row-header-item.left .table-row-header-title, .table.forum-categories .table-row-item.left .table-row-header-title { text-align: center } .table.forum-categories .forum-category-wrap { width: auto; padding-left: 0 } .table.forum-categories .forum-category-wrap .forum-category-img { position: static; display: block; margin: 0 auto 20px } .table.forum-categories .forum-category-wrap .forum-category-title, .table.forum-categories .forum-category-wrap .forum-category-description { text-align: center } .table.forum-categories .forum-category-wrap .forum-category-subcategories { margin-left: 10px } .table.forum-messages .table-row-header-item:nth-child(2), .table.forum-messages .table-row-item:nth-child(2) { display: none } .table.forum-topics .forum-post-link.pin-tag, .table.forum-topics .forum-post-link.spoiler-tag { padding-left: 0 } .table.forum-topics .forum-post-link.pin-tag:before, .table.forum-topics .forum-post-link.spoiler-tag:before { display: none } .team-lineups-header.mobile .team-info-wrap.mid .team-logo { width: 30px; height: 30px } .team-lineups-header.mobile .team-info-wrap.mid .team-info { margin-top: 6px } .team-lineups-header.mobile .team-info-wrap.mid .team-info .team-name { font-size: .6875em } .team-lineups-header.mobile .featured-stat-wrap { display: none } .team-lineups-header.mobile .featured-stat-wrap:first-child, .team-lineups-header.mobile .featured-stat-wrap:last-child { display: block } } @media screen and (max-width: 480px) { .table.standings.mobile .team-info-wrap .team-info { display: none } } .post-author-info-wrap:after { content: ''; display: table; clear: both } .post-author-info-wrap .user-avatar { float: left; margin-right: 8px } .post-author-info-wrap.negative .post-author-info { color: #fff } .post-author-info { line-height: 26px } .post-author-info .post-author, .post-author-info .post-comment-count { font-weight: 700 } .post-author-info .separator { margin: 0 5px } .post-open-author-wrap { display: flex; flex-flow: row wrap } .post-open-author-wrap .user-avatar { width: 45px; height: 45px; margin-right: 14px } .post-open-author-wrap .post-open-author, .post-open-author-wrap .post-open-timestamp, .post-open-author-wrap .post-open-comment-count, .post-open-author-wrap .post-open-comment-text { color: #8b8b8b; font-size: .75em; line-height: 1em } .post-open-author-wrap .post-open-author, .post-open-author-wrap .post-open-comment-count { font-size: .8125em } .post-open-author-info { margin-right: 40px } .post-open-author-info .post-open-author { margin: 6px 0 } .post-open-author-info .post-open-author .post-open-author-name { font-weight: 700 } .post-open-comment-info { position: relative; padding-left: 46px } .post-open-comment-info .post-open-comment-icon { position: absolute; top: 4px; left: 0 } .post-open-comment-info .post-open-comment-icon.icon-bubbles { color: #dbdbdb; font-size: 36px } .post-open-comment-info .post-open-comment-count { display: inline-block; margin: 6px 0; font-weight: 700 } .post-preview { position: relative } .post-preview+.line-separator { margin-top: 10px } .post-preview .post-preview-st-video { width: 270px; height: 160px; margin-bottom: 16px } .post-preview .post-preview-st-video iframe { width: 100%; height: 100% } .post-preview .post-preview-img { transition: transform .3s ease-in-out } .post-preview:hover .post-preview-img { transform: scale(1.1) } .post-preview:hover .post-preview-title { color: #111 } .post-preview .post-preview-title .highlight, .post-preview .post-preview-text .highlight { color: #1c95f3 } .post-preview .review-rating { position: absolute; top: 8px; right: 10px; pointer-events: none } .post-preview .timestamp-tag { position: absolute; bottom: 0; right: 0 } .post-preview.gaming-news .tag-ornament.video, .post-preview.geeky-news .tag-ornament.video, .post-preview.movie-news .tag-ornament.video, .post-preview.game-review .tag-ornament.video, .post-preview.e-sport .tag-ornament.video { background-color: #00e3d0 } .post-preview.gaming-news .rating-ornament-icon { fill: #1c95f3 } .post-preview.gaming-news .tag-ornament { background-color: #1c95f3 } .post-preview.gaming-news .post-author, .post-preview.gaming-news .post-comment-count { color: #1c95f3 } .post-preview.gaming-news.picture .loading-line { background-color: #1c95f3 } .post-preview.geeky-news .rating-ornament-icon { fill: #ffb400 } .post-preview.geeky-news .tag-ornament { background-color: #ffb400 } .post-preview.geeky-news .post-author, .post-preview.geeky-news .post-comment-count { color: #ffb400 } .post-preview.geeky-news.picture .loading-line { background-color: #ffb400 } .post-preview.movie-news .rating-ornament-icon { fill: #58d819 } .post-preview.movie-news .tag-ornament { background-color: #58d819 } .post-preview.movie-news .post-author, .post-preview.movie-news .post-comment-count { color: #58d819 } .post-preview.movie-news.picture .loading-line { background-color: #58d819 } .post-preview.game-review .rating-ornament-icon { fill: #f30a5c } .post-preview.game-review .tag-ornament { background-color: #f30a5c } .post-preview.game-review .post-author, .post-preview.game-review .post-comment-count { color: #f30a5c } .post-preview.game-review.picture .loading-line { background-color: #f30a5c } .post-preview.e-sport .rating-ornament-icon { fill: #7442ce } .post-preview.e-sport .tag-ornament { background-color: #7442ce } .post-preview.e-sport .post-author, .post-preview.e-sport .post-comment-count { color: #7442ce } .post-preview.e-sport.picture .loading-line { background-color: #7442ce } .post-preview .post-preview-img-wrap { margin-bottom: 16px; position: relative; overflow: hidden } .post-preview .tag-ornament { position: absolute; top: 120px; left: 0; z-index: 9999 } .post-preview .rating-ornament { position: absolute; top: 0; right: 0; pointer-events: none } .post-preview .rating-ornament-icon.empty { fill: #b8b8b8 } .post-preview .post-preview-img { height: 140px } .post-preview .post-preview-text { margin-top: 2px } .post-preview .post-preview-overlay { width: 100%; height: 100%; padding: 0 14px; background-color: rgba(0, 0, 0, 0.4); position: absolute; top: 0; left: 0; overflow: hidden } .post-preview .post-preview-overlay:hover .play-button, .post-preview .post-preview-overlay:hover .post-preview-overlay-info { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .post-preview .post-preview-overlay .play-button { margin: 12px auto 0; transition: all .6s ease-in-out; -o-transform: translate(0, 48px); -moz-transform: translate(0, 48px); -ms-transform: translate(0, 48px); -webkit-transform: translate(0, 48px); transform: translate(0, 48px) } .post-preview .post-preview-overlay .post-preview-overlay-info { transition: all .5s ease-in-out; -o-transform: translate(0, 150%); -moz-transform: translate(0, 150%); -ms-transform: translate(0, 150%); -webkit-transform: translate(0, 150%); transform: translate(0, 150%) } .post-preview .post-preview-overlay .post-preview-title, .post-preview .post-preview-overlay .post-preview-text { color: #fff } .post-preview.landscape { height: 160px; padding: 5px 0 0 286px } .post-preview.landscape .post-preview-text { margin-top: 10px } .post-preview.landscape .post-preview-img-wrap { margin-bottom: 0; position: absolute; top: 0; left: 0 } .post-preview.landscape .post-preview-img { width: 270px; height: 160px } .post-preview.landscape .tag-ornament { top: 140px } .post-preview.landscape.big { height: 270px; padding: 40px 0 0 390px } .post-preview.landscape.big .post-preview-img { width: 370px; height: 270px } .post-preview.landscape.big .tag-ornament { bottom: auto; top: 8px; left: 390px } .post-preview.landscape.big .review-rating { top: 14px; right: 16px } .post-preview.picture.short { overflow: hidden; position: relative } .post-preview.picture.short .post-preview-img { height: 102px; box-shadow: inset 0px -100px 190px -60px rgba(0, 0, 0, 0.85) } .post-preview.picture.short .overlay { width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0; left: 0; z-index: 6666; cursor: pointer; transition: all .5s ease-in-out } .post-preview.picture.short .loading-line { height: 2px } .post-preview.picture.short.active .overlay { opacity: 0; visibility: hidden } .post-preview.picture.medium .post-preview-img { height: 360px; box-shadow: inset 0px -310px 370px -150px rgba(0, 0, 0, 0.85) } .post-preview.picture.medium .tag-ornament { position: static } .post-preview.picture.medium .post-preview-overlay { padding: 0 30px; margin-bottom: 26px } .post-preview.picture.medium .post-preview-overlay .post-preview-title { margin-top: 16px; font-size: 1.5em } .post-preview.picture.large .post-preview-img-wrap { margin-bottom: 0 } .post-preview.picture.large .post-preview-img { height: 720px; box-shadow: inset 0px -460px 370px -150px rgba(0, 0, 0, 0.85) } .post-preview.picture.large .tag-ornament { position: static } .post-preview.picture.large .post-preview-overlay { padding: 0 180px 0 60px; margin-bottom: 50px } .post-preview.picture.large .post-preview-overlay .post-preview-title { font-size: 2.5em; margin-top: 20px } .post-preview.picture.large .post-preview-overlay .post-preview-text { margin-top: 10px; display: block; width: 405px; font-size: .875em; line-height: 1.7142857143em } .post-preview.picture.big.shorter .post-preview-img { height: 360px } .post-preview.picture.big.shorter .post-preview-overlay .post-preview-title { width: 450px } .post-preview.picture.big .review-rating { top: 20px; right: 24px } .post-preview.picture.big .post-preview-img { height: 510px; box-shadow: inset 0px -310px 370px -150px rgba(0, 0, 0, 0.85) } .post-preview.picture.big .tag-ornament { position: static } .post-preview.picture.big .post-preview-overlay { padding: 0 30px; margin-bottom: 26px } .post-preview.picture.big .post-preview-overlay .post-preview-title { margin-top: 14px } .post-preview.picture.big .post-preview-overlay .post-preview-text { display: block; width: 340px; font-size: .8125em; line-height: 1.6923076923em } .post-preview.picture.big .loading-line { height: 4px } .post-preview.picture.active .loading-line { transition: transform 5s ease-in-out; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .post-preview.picture.active.halted .loading-line { transition: none } .post-preview.picture .review-rating { top: 8px; right: 10px } .post-preview.picture .loading-line { width: 100%; position: absolute; bottom: 0; left: 0; z-index: 6665; -o-transform: translate(-100%, 0); -moz-transform: translate(-100%, 0); -ms-transform: translate(-100%, 0); -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0) } .post-preview.picture .post-preview-img-wrap { margin-bottom: 0 } .post-preview.picture .post-preview-img { height: 170px; box-shadow: inset 0px -100px 190px -60px rgba(0, 0, 0, 0.85) } .post-preview.picture .post-preview-img-overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.6) } .post-preview.picture .tag-ornament { bottom: auto; top: 0; z-index: 1 } .post-preview.picture .post-preview-overlay { width: 100%; height: auto; margin-bottom: 16px; background-color: transparent; top: auto; bottom: 0 } .post-preview.picture .post-preview-overlay .post-preview-text { display: none } .post-preview.video .post-preview-img-wrap { margin-bottom: 0 } .post-preview.video .post-preview-img { height: 160px } .post-preview.video .post-preview-title { margin-top: 8px } .post-preview.video .post-preview-text { font-size: .75em; line-height: 1.6666666667em } .post-preview.video.no-hover .post-preview-img-wrap { margin-bottom: 16px } .post-preview.video.no-hover .post-preview-title { margin-top: 0 } .post-preview.video.no-hover .post-preview-text { font-size: .8125em; line-height: 1.6923076923em } .post-preview.video.no-hover .tag-list { margin-bottom: 12px } .post-preview.video.no-hover .tag-list .tag-ornament { position: static } .post-preview.video.tiny { padding-left: 108px } .post-preview.video.tiny .post-preview-img-wrap, .post-preview.video.tiny .post-preview-img { width: 100px; margin-bottom: 0 } .post-preview.video.tiny .post-preview-title { margin-top: 2px } .post-preview.video.tiny .post-preview-overlay { padding: 0 } .post-preview.video.tiny .post-preview-overlay .play-button { margin: 22px auto 0; padding: 2px 0 0 7px; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .post-preview.video.tiny.negative .post-preview-title { color: #fff } .post-preview.video.tiny.no-hover .post-preview-overlay:hover .play-button { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .post-preview.video.large { height: 460px } .post-preview.video.large .post-preview-overlay .play-button { margin: 120px auto 0 } .post-preview.video.large .post-preview-overlay .post-preview-overlay-info .post-preview-title { text-align: center } .post-preview.video.large .post-preview-overlay .post-preview-overlay-info .post-preview-text { color: #00e3d0; text-align: center; margin-top: 6px } .post-preview.video.large .post-preview-video-wrap { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #1e1f20; visibility: hidden } .post-preview.video.large .post-preview-video { width: 100%; height: 100% } .post-preview.video.no-hover { cursor: pointer } .post-preview.video.no-hover .post-preview-overlay:hover .play-button { -o-transform: translate(0, 48px); -moz-transform: translate(0, 48px); -ms-transform: translate(0, 48px); -webkit-transform: translate(0, 48px); transform: translate(0, 48px) } .post-preview.video.no-hover .post-preview-overlay:hover .post-preview-overlay-info { -o-transform: translate(0, 150%); -moz-transform: translate(0, 150%); -ms-transform: translate(0, 150%); -webkit-transform: translate(0, 150%); transform: translate(0, 150%) } .post-preview.huge { width: 630px } .post-preview.huge.centered { text-align: center } .post-preview.huge.centered .post-author-info-wrap, .post-preview.huge.centered .post-author-info { display: inline-block } .post-preview.huge.centered .post-preview-text { margin: 16px auto 0 } .post-preview.huge .tag-ornament { position: static; margin-bottom: 18px } .post-preview.huge .post-author-info, .post-preview.huge .post-preview-title, .post-preview.huge .post-preview-text { color: #fff } .post-preview.huge .post-author-info-wrap { margin-top: 22px } .post-preview.huge .post-author-info { font-size: .75em; text-shadow: 0px 0px 12px #020102 } .post-preview.huge .post-preview-title { text-shadow: 0px 0px 20px #020102 } .post-preview.huge .post-preview-text { width: 460px; margin-top: 16px; font-size: .875em; line-height: 1.7142857143em; text-shadow: 0px 0px 10px #020102 } .post-preview.huge .button { margin-top: 42px } .post-preview.large .post-preview-img-wrap { margin-bottom: 26px } .post-preview.large .post-preview-img { height: 460px } .post-preview.large .tag-ornament { top: 440px } .post-preview.large .post-author-info-wrap { margin: 12px 0 18px } .post-preview.large .post-preview-text { font-size: .875em; line-height: 1.8571428571em } .post-preview.big .review-rating { top: 14px; right: 18px } .post-preview.big .post-preview-img { height: 300px } .post-preview.big .tag-ornament { top: 280px } .post-preview.big .post-author-info-wrap { margin: 12px 0 18px } .post-preview.medium.tall-img-1 .post-preview-img { height: 620px } .post-preview.medium.tall-img-1 .tag-ornament { top: 600px } .post-preview.medium.tall-img-2 .post-preview-img { height: 540px } .post-preview.medium.tall-img-2 .tag-ornament { top: 520px } .post-preview.medium.tall-img-3 .post-preview-img { height: 480px } .post-preview.medium.tall-img-3 .tag-ornament { top: 460px } .post-preview.medium.tall-img-4 .post-preview-img { height: 420px } .post-preview.medium.tall-img-4 .tag-ornament { top: 400px } .post-preview.medium.tall-img-5 .post-preview-img { height: 380px } .post-preview.medium.tall-img-5 .tag-ornament { top: 360px } .post-preview.medium.short-img-1 .post-preview-img { height: 240px } .post-preview.medium.short-img-1 .tag-ornament { top: 220px } .post-preview.medium .post-preview-img-wrap { margin-bottom: 22px } .post-preview.medium .post-preview-img { height: 280px } .post-preview.medium .tag-ornament { top: 260px } .post-preview.medium .post-author-info-wrap { margin: 12px 0 18px } .post-preview.tiny { height: 70px; padding-left: 78px; position: relative } .post-preview.tiny.featured { padding: 6px 0 0 62px } .post-preview.tiny.no-img { width: 230px; padding-left: 0 } .post-preview.tiny.no-img .post-preview-img-wrap { display: none } .post-preview.tiny.padded { padding-left: 84px } .post-preview.tiny .review-rating { top: 11px; left: 11px } .post-preview.tiny .post-preview-img-wrap, .post-preview.tiny .post-preview-img { width: 70px; height: 70px } .post-preview.tiny .post-preview-img-wrap { position: absolute; top: 0; left: 0 } .post-preview.tiny .bubble-ornament.small { position: absolute; top: -6px; left: 52px; pointer-events: none } .post-preview.tiny .bubble-ornament.medium { position: absolute; top: 0; left: 0 } .post-preview.tiny .rating-ornament { width: 70px; padding: 0 6px 2px 7px; top: auto; bottom: 0 } .post-preview.tiny .rating-ornament-item { margin-right: 4px } .post-preview.tiny .rating-ornament-item:last-child { margin-right: 0 } .post-preview.tiny .rating-ornament-icon { width: 8px; height: 8px } .post-preview.negative .post-preview-title { color: #fff } .post-preview-showcase+.button { margin-top: 20px } .post-preview-showcase.border-top { padding-top: 26px; border-top: 1px solid #dbdbdb } @media screen and (max-width: 960px) { .post-preview.img-toggle { padding-top: 30px } .post-preview.img-toggle .post-preview-img-wrap { display: none } .post-preview.img-toggle .tag-ornament { top: 0 } .post-preview.landscape, .post-preview.landscape.big { width: 100%; height: auto; padding: 0 } .post-preview.landscape .post-preview-img-wrap, .post-preview.landscape.big .post-preview-img-wrap { margin-bottom: 16px; position: static } .post-preview.landscape .post-preview-img, .post-preview.landscape.big .post-preview-img { width: 100% } .post-preview.landscape.big .tag-ornament { top: 250px; left: 0 } } @media screen and (max-width: 680px) { .post-preview.huge, .post-preview.huge.centered { width: auto; padding: 0 6px } .post-preview.huge .tag-ornament, .post-preview.huge.centered .tag-ornament { position: static; margin-bottom: 18px } .post-preview.huge .post-author-info-wrap, .post-preview.huge.centered .post-author-info-wrap { margin-top: 22px } .post-preview.huge .post-author-info, .post-preview.huge.centered .post-author-info { font-size: .6875em } .post-preview.huge .post-preview-title, .post-preview.huge.centered .post-preview-title { font-size: 2.25em; line-height: 1.1666666667em } .post-preview.huge .post-preview-text, .post-preview.huge.centered .post-preview-text { width: auto; font-size: .8125em; line-height: 1.6923076923em } .post-preview.huge .button, .post-preview.huge.centered .button { margin-top: 42px } .post-preview.large .post-preview-img { height: 280px } .post-preview.large .tag-ornament { top: 260px } .post-preview.picture.big.shorter .post-preview-overlay .post-preview-title { width: 100% } } @media screen and (max-width: 480px) { .post-preview.picture.big .post-preview-overlay .post-preview-text { width: 100% } } .post-open.negative .post-open-title, .post-open.negative .post-open-text { color: #fff } .post-open.gaming-news .tag-ornament { background-color: #1c95f3 } .post-open.gaming-news .tag-ornament.video { background-color: #00e3d0 } .post-open.gaming-news .post-open-quote:before { background-color: #1c95f3 } .post-open.gaming-news .post-author, .post-open.gaming-news .post-comment-count { color: #1c95f3 } .post-open.gaming-news .quote-text .highlight { color: #1c95f3 } .post-open.gaming-news .feature-list .feature-list-item .feature-info.highlight { color: #1c95f3 } .post-open.gaming-news .rating-ornament .rating-ornament-icon { fill: #1c95f3 } .post-open.gaming-news .rating-ornament .rating-ornament-icon.empty { fill: #dbdbdb } .post-open.gaming-news .review-info-wrap .review-info-list-wrap .review-info-list.pros .review-info-list-icon { background-color: #1c95f3 } .post-open.gaming-news .post-open-author-wrap .post-open-author-name, .post-open.gaming-news .post-open-author-wrap .post-open-comment-count { color: #1c95f3 } .post-open.gaming-news .post-open-text.bold .highlight { color: #1c95f3 } .post-open.game-review .tag-ornament { background-color: #f30a5c } .post-open.game-review .tag-ornament.video { background-color: #00e3d0 } .post-open.game-review .post-open-quote:before { background-color: #f30a5c } .post-open.game-review .post-author, .post-open.game-review .post-comment-count { color: #f30a5c } .post-open.game-review .quote-text .highlight { color: #f30a5c } .post-open.game-review .feature-list .feature-list-item .feature-info.highlight { color: #f30a5c } .post-open.game-review .rating-ornament .rating-ornament-icon { fill: #f30a5c } .post-open.game-review .rating-ornament .rating-ornament-icon.empty { fill: #dbdbdb } .post-open.game-review .review-info-wrap .review-info-list-wrap .review-info-list.pros .review-info-list-icon { background-color: #f30a5c } .post-open.game-review .post-open-author-wrap .post-open-author-name, .post-open.game-review .post-open-author-wrap .post-open-comment-count { color: #f30a5c } .post-open.game-review .post-open-text.bold .highlight { color: #f30a5c } .post-open.movie-news .tag-ornament { background-color: #58d819 } .post-open.movie-news .tag-ornament.video { background-color: #00e3d0 } .post-open.movie-news .post-open-quote:before { background-color: #58d819 } .post-open.movie-news .post-author, .post-open.movie-news .post-comment-count { color: #58d819 } .post-open.movie-news .quote-text .highlight { color: #58d819 } .post-open.movie-news .feature-list .feature-list-item .feature-info.highlight { color: #58d819 } .post-open.movie-news .rating-ornament .rating-ornament-icon { fill: #58d819 } .post-open.movie-news .rating-ornament .rating-ornament-icon.empty { fill: #dbdbdb } .post-open.movie-news .review-info-wrap .review-info-list-wrap .review-info-list.pros .review-info-list-icon { background-color: #58d819 } .post-open.movie-news .post-open-author-wrap .post-open-author-name, .post-open.movie-news .post-open-author-wrap .post-open-comment-count { color: #58d819 } .post-open.movie-news .post-open-text.bold .highlight { color: #58d819 } .post-open.geeky-news .tag-ornament { background-color: #ffb400 } .post-open.geeky-news .tag-ornament.video { background-color: #00e3d0 } .post-open.geeky-news .post-open-quote:before { background-color: #ffb400 } .post-open.geeky-news .post-author, .post-open.geeky-news .post-comment-count { color: #ffb400 } .post-open.geeky-news .quote-text .highlight { color: #ffb400 } .post-open.geeky-news .feature-list .feature-list-item .feature-info.highlight { color: #ffb400 } .post-open.geeky-news .rating-ornament .rating-ornament-icon { fill: #ffb400 } .post-open.geeky-news .rating-ornament .rating-ornament-icon.empty { fill: #dbdbdb } .post-open.geeky-news .review-info-wrap .review-info-list-wrap .review-info-list.pros .review-info-list-icon { background-color: #ffb400 } .post-open.geeky-news .post-open-author-wrap .post-open-author-name, .post-open.geeky-news .post-open-author-wrap .post-open-comment-count { color: #ffb400 } .post-open.geeky-news .post-open-text.bold .highlight { color: #ffb400 } .post-open.e-sport .tag-ornament { background-color: #7442ce } .post-open.e-sport .tag-ornament.video { background-color: #00e3d0 } .post-open.e-sport .post-open-quote:before { background-color: #7442ce } .post-open.e-sport .post-author, .post-open.e-sport .post-comment-count { color: #7442ce } .post-open.e-sport .quote-text .highlight { color: #7442ce } .post-open.e-sport .feature-list .feature-list-item .feature-info.highlight { color: #7442ce } .post-open.e-sport .rating-ornament .rating-ornament-icon { fill: #7442ce } .post-open.e-sport .rating-ornament .rating-ornament-icon.empty { fill: #dbdbdb } .post-open.e-sport .review-info-wrap .review-info-list-wrap .review-info-list.pros .review-info-list-icon { background-color: #7442ce } .post-open.e-sport .post-open-author-wrap .post-open-author-name, .post-open.e-sport .post-open-author-wrap .post-open-comment-count { color: #7442ce } .post-open.e-sport .post-open-text.bold .highlight { color: #7442ce } .post-open .post-open-header-wrap { background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../img/posts/16_flat.jpg") no-repeat center; background-size: cover } .post-open .post-open-header { min-height: 600px; margin-bottom: 80px; padding-top: 160px; text-align: center; position: relative } .post-open .post-open-header .review-rating { position: absolute; top: 36px; right: 0; text-align: left; pointer-events: none } .post-open .post-open-header .post-open-title { width: 550px; margin: 18px auto 0 } .post-open .post-open-header .post-open-title, .post-open .post-open-header .post-author-info-wrap { text-shadow: 0px 0px 20px #020102 } .post-open .post-open-header .post-author-info-wrap, .post-open .post-open-header .post-author-info { display: inline-block } .post-open .post-open-header .social-links { margin: 40px auto 0 } .post-open .post-open-content { display: grid; grid-template-areas: 'sidebar body'; grid-template-columns: 70px 770px; grid-gap: 30px } .post-open .post-open-content.v7 { display: block; padding: 80px 0 70px } .post-open .post-open-content.v7 .post-open-title, .post-open .post-open-content.v7 .post-open-subtitle, .post-open .post-open-content.v7 .post-open-text { padding: 0 200px } .post-open .post-open-content.v7 .post-open-media-wrap { padding: 0 150px } .post-open .post-open-content.v7 .post-open-text.bold { margin-top: 40px } .post-open .post-open-content.v2 { grid-template-areas: 'body'; grid-template-columns: 870px; justify-content: center } .post-open .post-open-content.v2 .post-open-body>*:first-child { margin-top: 0 } .post-open .post-open-content.v2 .post-open-subtitle, .post-open .post-open-content.v2 .post-open-text, .post-open .post-open-content.v2 .post-open-text-wrap, .post-open .post-open-content.v2 .feature-list, .post-open .post-open-content.v2 .review-block { padding: 0 150px } .post-open .post-open-content.v2 .bullet-list { padding: 0 150px 0 180px } .post-open .post-open-content.v2 .post-open-text-wrap .post-open-text { padding: 0 } .post-open .post-open-content.v3 { grid-template-columns: 70px 800px; grid-gap: 0; justify-content: center } .post-open .post-open-content.v3>.post-open-sidebar .user-avatar { display: inline-block } .post-open .post-open-content.v3>.post-open-sidebar .social-links { margin-top: 12px } .post-open .post-open-content.v4 { grid-template-columns: 100px 670px; grid-gap: 30px } .post-open .post-open-content.v4 .post-open-body>*:first-child { margin-top: 40px } .post-open .post-open-content.v4 .post-open-sidebar .user-avatar, .post-open .post-open-content.v4 .post-open-sidebar .social-links { display: none } .post-open .post-open-content.v4 .post-open-sidebar .feature-list { margin-top: 48px } .post-open .post-open-content.v5 { grid-template-areas: 'body'; grid-template-columns: 1fr } .post-open .post-open-content.v5 .tag-list:first-child { margin-top: 0 } .post-open .post-open-content.v6 { grid-template-areas: 'body'; grid-template-columns: 100% } .post-open .post-open-content.v6 .post-open-body>.tag-list { margin-top: 0; justify-content: center } .post-open .post-open-content.v6 .post-open-body .section-title-wrap { margin-bottom: 26px } .post-open .post-open-content.v6 .post-open-body .section-title-wrap.small-space { margin-bottom: 10px } .post-open .post-open-content.v6 .post-open-body .widget-match-box { width: auto } .post-open .post-open-content.v6 .post-open-title { width: 770px; margin: 0 auto; font-size: 3.125em; line-height: 1.04em; text-align: center } .post-open .post-open-content.v6 .post-open-img { height: 600px } .post-open .post-open-content.v6 .post-open-subtitle, .post-open .post-open-content.v6 .post-open-text, .post-open .post-open-content.v6 .post-open-text-wrap, .post-open .post-open-content.v6 .post-open-quote, .post-open .post-open-content.v6 .review-block { padding: 0 300px } .post-open .post-open-content.v6 .post-open-text-wrap .post-open-text { padding: 0 } .post-open .post-open-content.v6 .post-open-media-wrap, .post-open .post-open-content.v6 .button-social-list { padding: 0 150px } .post-open .post-open-content.v6 .post-comment, .post-open .post-open-content.v6 .post-open-tags, .post-open .post-open-content.v6 .widget-match-box, .post-open .post-open-content.v6 .section-title-wrap { margin-left: 150px; margin-right: 150px } .post-open .post-open-content.v6 .button-social-list { margin-top: 40px } .post-open .post-open-body { grid-area: body } .post-open .post-open-body .social-links { margin-top: 24px } .post-open .post-open-sidebar { grid-area: sidebar } .post-open .post-open-sidebar .social-links { margin-top: 32px } .post-open .post-open-author-wrap { margin-bottom: 40px } .post-open .section-title-wrap { margin-top: 40px } .post-open .progress-bar-block { margin: 50px 0 46px } .post-open .review-block { margin-top: 55px } .post-open .slideshow { margin-top: 50px } .post-open .button-social-list { margin-bottom: 20px } .post-open .button-social-list .button-social { margin-bottom: 20px } .post-open .button-social-list+.author-info { margin-top: 0 } .post-open .button-social-list+.post-comment { margin-top: 20px } .post-open .post-open-img-wrap { margin-bottom: 30px; position: relative } .post-open .post-open-img-wrap>.tag-ornament { position: absolute; bottom: 0; left: 0 } .post-open .post-open-img-wrap+.post-open-text { margin-top: 80px } .post-open .post-comment { margin-top: 40px } .post-open .post-open-img { height: 460px } .post-open .tag-list { margin: 32px 0 18px } .post-open .post-open-title { color: #363636 } .post-open .post-open-title.negative { color: #fff } .post-open .post-open-title+.post-author-info-wrap { margin-top: 24px } .post-open .post-open-title+.post-open-text.bold { margin: 16px 0 26px } .post-open .post-open-subtitle { margin-top: 50px; color: #363636; font-size: 1.5em } .post-open .post-open-subtitle.small { font-size: 1.25em } .post-open .post-open-subtitle+.post-open-text, .post-open .post-open-subtitle+.post-open-text-wrap { margin-top: 30px } .post-open .post-open-subtitle+.progress-bar-block { margin-top: 72px } .post-open .post-open-text-wrap { margin-top: 30px } .post-open .post-open-text-wrap:after { content: ''; display: table; clear: both } .post-open .post-open-text-wrap.half .post-open-text { width: 48%; margin-top: 0 } .post-open .post-open-text-wrap.half .post-open-text:first-child { float: left } .post-open .post-open-text-wrap.half .post-open-text:last-child { float: right } .post-open .post-open-text { margin-top: 30px } .post-open .post-open-text .video-length { color: #00e3d0; font-family: "Exo", sans-serif; font-weight: 700; margin-right: 12px } .post-open .post-open-text.bold { margin-bottom: 40px; text-transform: none; color: #363636 } .post-open .post-open-quote { margin: 40px 0 } .post-open .post-open-quote:before { content: url("../img/icons/quote-icon.png"); display: block; box-sizing: border-box; width: 60px; height: 60px; border-radius: 50%; margin: 0 auto 30px; padding: 20px 0 0 18px; background-color: #363636 } .post-open .quote-text { width: 72%; margin: 0 auto; text-transform: none; color: #363636; text-align: center } .post-open .bullet-list { margin-top: 40px } .post-open .bullet-list+.post-open-subtitle { margin-top: 50px } .post-open .bullet-list+.post-open-text { margin-top: 40px } .post-open .post-open-media-wrap { margin: 45px 0 } .post-open .post-open-media-wrap:first-child { margin-top: 0 } .post-open .post-open-media-wrap .post-open-media iframe { width: 100%; height: 460px } .post-open .post-open-media-wrap .post-open-media.small iframe { height: 380px } .post-open .post-open-media-wrap .post-open-media-info { margin-top: 30px; font-size: .8125em; text-align: center } .post-open .post-open-tags { margin-top: 45px; padding: 26px 0 16px; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb } .post-open .post-open-tags .tag-list { margin: 0 } .post-open .feature-list { margin-top: 50px } .post-open .feature-list:after { content: ''; display: table; clear: both } .post-open .feature-list.v2 { display: flex; flex-flow: row wrap; justify-content: center; margin: 40px 0 30px } .post-open .feature-list.v2 .feature-list-item { margin-right: 80px; text-align: center } .post-open .feature-list.v2 .feature-list-item:last-child { margin-right: 0 } .post-open .feature-list .feature-list-block { width: 48% } .post-open .feature-list .feature-list-block:first-child { float: left } .post-open .feature-list .feature-list-block:last-child { float: right } .post-open .feature-list .feature-list-block .feature-list-item .feature-title { display: inline } .post-open .feature-list .feature-list-block .feature-list-item .feature-info { display: inline; margin: 0 0 0 5px; font-size: .875em } .post-open .feature-list .feature-list-item { margin-bottom: 20px; font-size: 1em; line-height: 1em } .post-open .feature-list .feature-list-item:last-child { margin-bottom: 0 } .post-open .feature-list .feature-list-item .feature-title { color: #363636; font-size: .75em } .post-open .feature-list .feature-list-item .feature-info { display: block; color: #8b8b8b; font-size: .75em; margin-top: 5px } .post-open .feature-list .feature-list-item .feature-info.highlight { color: #363636; font-weight: 700 } .post-open .review-wrap { margin: 50px 0 20px; padding: 50px 0 34px; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb } .post-open .review-wrap:after { content: ''; display: table; clear: both } .post-open .review-wrap .review-score-wrap { float: left; width: 170px; text-align: center } .post-open .review-wrap .review-score-wrap .review-score-number, .post-open .review-wrap .review-score-wrap .review-score-text { color: #363636 } .post-open .review-wrap .review-score-wrap .review-score-number { font-size: 4.25em } .post-open .review-wrap .review-score-wrap .review-score-text { font-size: .75em } .post-open .review-wrap .review-score-wrap .rating-ornament { display: inline-block; margin: 20px 0 10px; padding: 0 } .post-open .review-wrap .review-info-wrap { float: right; width: 440px; padding-right: 26px } .post-open .review-wrap .review-info-wrap .review-info-text { font-size: .875em; line-height: 1.8571428571em } .post-open .review-wrap .review-info-wrap .review-info-text .highlight { color: #363636; font-weight: 700 } .post-open .review-wrap .review-info-wrap .review-info-list-wrap { margin-top: 20px; display: flex; flex-flow: row wrap } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list { width: 170px; margin-right: 30px } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list:last-child { margin-right: 0 } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list .review-info-list-item { display: flex; flex-flow: row wrap; margin-bottom: 16px } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list .review-info-list-icon { width: 14px; height: 14px; border-radius: 50%; margin-right: 10px; background-color: #8b8b8b; position: relative } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list .review-info-list-icon .plus-icon { width: 6px; height: 6px; fill: #fff; position: absolute; top: 4px; left: 4px } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list .review-info-list-icon .minus-cc-icon { width: 6px; height: 6px; fill: #fff; position: absolute; top: 4px; left: 4px } .post-open .review-wrap .review-info-wrap .review-info-list-wrap .review-info-list .review-info-list-item-text { font-size: .875em; line-height: 1em } @media screen and (max-width: 1260px) { .post-open .post-open-content { grid-template-areas: 'sidebar' 'body'; grid-template-columns: 1fr } .post-open .post-open-content.v7 .post-open-title, .post-open .post-open-content.v7 .post-open-subtitle, .post-open .post-open-content.v7 .post-open-text, .post-open .post-open-content.v7 .post-open-media-wrap { padding: 0 } .post-open .post-open-content.v3, .post-open .post-open-content.v4 { grid-template-columns: 1fr } .post-open .post-open-content.v3>.post-open-sidebar { display: none } .post-open .post-open-content.v4 .post-open-sidebar { padding-top: 20px } .post-open .post-open-content.v4 .post-open-sidebar .user-avatar { display: inline-block; margin-right: 16px } .post-open .post-open-content.v4 .post-open-sidebar .social-links.vertical { display: inline-block; margin-top: 0 } .post-open .post-open-content.v4 .post-open-sidebar .feature-list { margin-top: 30px } .post-open .post-open-content.v4 .post-open-body>*:first-child { margin-top: 0 } .post-open .post-open-content.v6 { padding-top: 40px } .post-open .post-open-content.v6 .post-open-title { width: 90% } .post-open .post-open-content.v6 .post-open-body .widget-match-box { width: 100% } .post-open .post-open-content.v6 .post-open-subtitle, .post-open .post-open-content.v6 .post-open-text, .post-open .post-open-content.v6 .post-open-text-wrap, .post-open .post-open-content.v6 .post-open-quote, .post-open .post-open-content.v6 .post-open-media-wrap, .post-open .post-open-content.v6 .button-social-list, .post-open .post-open-content.v6 .review-block { padding: 0 } .post-open .post-open-content.v6 .post-comment, .post-open .post-open-content.v6 .post-open-tags, .post-open .post-open-content.v6 .widget-match-box, .post-open .post-open-content.v6 .section-title-wrap { margin-left: 0; margin-right: 0 } .post-open .post-open-content .post-open-body .tag-list { margin-top: 0 } .post-open .post-open-content .post-open-sidebar .social-links.vertical { flex-direction: row } .post-open .post-open-content .post-open-sidebar .social-links.vertical .bubble-ornament { margin-bottom: 0 } .post-open .social-links.vertical.medium .bubble-ornament { margin-right: 16px } .post-open .social-links.vertical .bubble-ornament { margin-right: 14px } .post-open .post-open-media-wrap .post-open-media { height: 0; padding-bottom: 43%; position: relative } .post-open .post-open-media-wrap .post-open-media iframe { height: 100%; position: absolute } .post-open .post-open-media-wrap .post-open-media.small { height: 0; padding-bottom: 43%; position: relative } .post-open .post-open-media-wrap .post-open-media.small iframe { height: 100%; position: absolute } } @media screen and (max-width: 960px) { .post-open .post-open-header { padding-bottom: 120px } .post-open .post-open-header .post-open-title { width: 100% } .post-open .post-open-content.v2 { grid-template-columns: 1fr } .post-open .post-open-content.v2 .post-open-subtitle, .post-open .post-open-content.v2 .post-open-text, .post-open .post-open-content.v2 .post-open-text-wrap, .post-open .post-open-content.v2 .feature-list, .post-open .post-open-content.v2 .review-block { padding: 0 } .post-open .post-open-content.v2 .bullet-list { padding: 0 0 0 30px } .post-open .widget-team-stats.full { display: block; padding: 0 0 26px } .post-open .review-wrap .review-score-wrap { width: 100%; margin-bottom: 30px } .post-open .review-wrap .review-info-wrap { width: 100%; padding: 0 } } @media screen and (max-width: 680px) { .post-open .post-open-text-wrap.half .post-open-text { width: 100% } .post-open .post-open-text-wrap.half .post-open-text:first-child { float: none } .post-open .post-open-text-wrap.half .post-open-text:last-child { float: none; margin-top: 30px } .post-open .review-block { display: block } .post-open .review-block .arc { margin: 60px auto 0 } .post-open .feature-list.v2 .feature-list-item { margin-right: 40px } .post-open .feature-list .feature-list-block { width: 100% } .post-open .feature-list .feature-list-block:first-child { float: none } .post-open .feature-list .feature-list-block:first-child .feature-list-item:last-child { margin-bottom: 30px } .post-open .feature-list .feature-list-block:last-child { float: none } .post-open .feature-list .feature-list-block .feature-list-item { margin-bottom: 30px; text-align: center } .post-open .feature-list .feature-list-block .feature-list-item:last-child { margin-bottom: 0 } .post-open .feature-list .feature-list-block .feature-list-item .feature-title { display: block; margin-bottom: 5px } } .post-comment { border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; padding: 46px 0 40px 100px; position: relative } .post-comment+.post-comment { border-top: none } .post-comment .user-avatar { position: absolute; top: 36px; left: 0 } .post-comment .post-comment-username { display: inline-block; color: #363636; line-height: 1em } .post-comment .post-comment-timestamp, .post-comment .report-button { margin-left: 8px; display: inline-block; color: #8b8b8b; font-size: .6875em; line-height: 1em } .post-comment .report-button:hover { color: #f30a5c } .post-comment .post-comment-text { margin-top: 20px } .post-comment .post-comment-actions { margin-top: 20px } .post-comment .post-comment-actions .social-links { width: 206px; margin-top: 4px } .post-comment .post-comment-actions .like-button { margin-left: 8px } .post-comment .post-comment-actions .likes-count { margin-left: 6px; display: inline-block; color: #8b8b8b; font-size: .6875em; line-height: 1em } .post-comment>.post-comment { border-bottom: none; padding-bottom: 0; margin-top: 40px } .post-comment>.post-comment:before { content: ''; display: block; position: absolute; top: -1px; left: -100px; width: 100%; height: 1px; background-color: #dbdbdb } @media screen and (max-width: 960px) { .post-comment { padding-left: 10px } .post-comment>.post-comment { padding-left: 30px } .post-comment>.post-comment:before { left: 0px } .post-comment .user-avatar { display: none } .post-comment .post-comment-username { display: block; margin-bottom: 10px } .post-comment .post-comment-timestamp { margin-left: 0 } } .product-preview { width: 270px; position: relative } .product-preview.centered { text-align: center } .product-preview.centered:hover .add-to-bag { left: 50%; margin-left: -60px } .product-preview.centered .product-preview-info { display: inline-block } .product-preview.centered .product-price-wrap { text-align: center } .product-preview.centered .product-price-wrap .product-preview-price { float: none; display: inline-block } .product-preview.centered .product-price-wrap .product-preview-price.before { margin-left: 5px } .product-preview.list { width: auto; height: 280px; padding: 16px 20px 0 300px } .product-preview.list:hover .product-price-wrap .product-preview-price { opacity: 1; visibility: visible } .product-preview.list .product-preview-img-wrap { width: 270px; position: absolute; top: 0; left: 0 } .product-preview.list .bubble-ornament { visibility: visible; opacity: 1; -o-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); right: auto } .product-preview.list .bubble-ornament.favourites, .product-preview.list .bubble-ornament.tag { top: 230px } .product-preview.list .bubble-ornament.favourites { left: 436px } .product-preview.list .bubble-ornament.tag { left: 482px } .product-preview.list .product-preview-title { display: inline-block; margin-top: 0; font-size: 1.125em } .product-preview.list .product-preview-info { margin-top: 14px } .product-preview.list .product-preview-description { margin-top: 18px } .product-preview.list .product-preview-features { margin-top: 30px } .product-preview.list .product-preview-features:after { content: ''; display: table; clear: both } .product-preview.list .product-preview-features .product-preview-feature { float: left; margin-right: 36px; color: #8b8b8b; font-family: "Exo", sans-serif; font-size: .625em; font-weight: 700; line-height: 1em; text-transform: uppercase } .product-preview.list .product-preview-features .product-preview-feature:last-child { margin-right: 0 } .product-preview.list .product-preview-features .product-preview-feature .value { color: #363636 } .product-preview.list .product-preview-features .product-preview-feature .value.warning { color: #7442ce } .product-preview.list .product-preview-features .product-preview-feature .value.error { color: #f30a5c } .product-preview.list .product-price-wrap { margin-top: 0; position: absolute; top: 16px; right: 0 } .product-preview.list .product-price-wrap .product-preview-price { line-height: 1em } .product-preview.list .product-price-wrap .product-preview-price.before { margin: 4px 6px 0 0 } .product-preview.list .add-to-bag { position: absolute; top: 228px; left: 300px; opacity: 1; visibility: visible; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .product-preview.short { width: 170px } .product-preview.short:hover .product-price-wrap .product-preview-price { opacity: 1; visibility: visible } .product-preview.short .bubble-ornament { opacity: 1; visibility: visible; -o-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1) } .product-preview.short .bubble-ornament.remove, .product-preview.short .bubble-ornament.tag { right: -10px } .product-preview.short .bubble-ornament.remove { top: -8px } .product-preview.short .bubble-ornament.tag { top: 32px } .product-preview.short .product-preview-img-wrap { border: 1px solid #dbdbdb } .product-preview.short .product-preview-img { height: 168px } .product-preview.short .product-preview-title { font-size: .75em; margin-top: 16px } .product-preview.short .product-price-wrap { height: auto } .product-preview.short .product-price-wrap .product-preview-price { line-height: 1em } .product-preview.short .product-price-wrap .product-preview-price.before { margin: 2px 6px 0 0 } .product-preview.short .product-preview-info { margin-top: 0 } .product-preview.short .product-preview-info .product-preview-category, .product-preview.short .product-preview-info .rating-ornament { float: none } .product-preview.short .product-preview-info .rating-ornament { top: -2px; left: 0 } .product-preview.short .product-preview-price.current { font-size: .75em } .product-preview.short .product-preview-price.before { font-size: .625em } .product-preview.short .counter { margin-top: 14px } .product-preview.short .add-to-bag { margin-top: 16px; position: static; opacity: 1; visibility: visible; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .product-preview.negative .product-preview-title { color: #fff } .product-preview.negative .product-preview-price.current { color: #fff } .product-preview.negative .rating-ornament-icon.empty { fill: #4d4d4d } .product-preview.small { width: 96px } .product-preview.small:hover .product-price-wrap .product-preview-price { opacity: 1; visibility: visible } .product-preview.small .product-preview-img-wrap { border: 1px solid #dbdbdb } .product-preview.small .product-preview-img { height: 94px } .product-preview.small .bubble-ornament { -o-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); opacity: 1; visibility: visible } .product-preview.small .bubble-ornament.remove { top: -8px; right: -10px } .product-preview.small .tag-quantity { position: absolute; top: 80px; right: 0; pointer-events: none } .product-preview.small .product-preview-info { margin-top: 0 } .product-preview.small .product-preview-info .rating-ornament { position: static } .product-preview.small .product-preview-title { margin-top: 10px; font-size: .625em; line-height: 12px } .product-preview.small .product-price-wrap { height: auto; margin-top: 4px } .product-preview.small .product-price-wrap .product-preview-price { font-size: .625em; line-height: 1em } .product-preview.small .product-price-wrap .product-preview-price .currency { margin-right: 2px } .product-preview.tiny { height: 70px; padding: 4px 0 0 78px; position: relative } .product-preview.tiny:hover .product-price-wrap .product-preview-price { opacity: 1; visibility: visible } .product-preview.tiny .bubble-ornament, .product-preview.tiny .sticker-ornament, .product-preview.tiny .button { display: none } .product-preview.tiny .product-preview-img-wrap { position: absolute; top: 0; left: 0 } .product-preview.tiny .product-preview-img { width: 70px; height: 70px } .product-preview.tiny .product-preview-title { margin-top: 0; font-size: .75em } .product-preview.tiny .product-preview-info { margin-top: 0 } .product-preview.tiny .product-preview-info .product-preview-category, .product-preview.tiny .product-preview-info .rating-ornament { float: none } .product-preview.tiny .product-preview-info .rating-ornament { top: -2px; left: 0 } .product-preview.tiny .add-to-bag { width: 100px } .product-preview.tiny .product-price-wrap { height: auto; margin-top: 4px } .product-preview.tiny .product-price-wrap .product-preview-price { line-height: 1em } .product-preview.tiny .product-price-wrap .product-preview-price.before { margin: 2px 6px 0 0 } .product-preview.tiny .product-preview-price { font-size: .75em } .product-preview.tiny .product-preview-price .currency { margin-right: 3px } .product-preview.tiny .product-preview-price.before { font-size: .625em } .product-preview .product-preview-img { height: 280px } .product-preview .bubble-ornament { position: absolute; right: 14px; z-index: 9999; -o-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); opacity: 0; visibility: hidden; transition: all .3s ease-in-out } .product-preview .bubble-ornament.favourites { top: 16px } .product-preview .bubble-ornament.tag { top: 60px } .product-preview .sticker-ornament { position: absolute; top: 16px; left: 14px } .product-preview .product-preview-title { margin-top: 26px } .product-preview .product-preview-info { margin-top: 10px } .product-preview .product-preview-info:after { content: ''; display: table; clear: both } .product-preview .product-preview-info .product-preview-category { float: left } .product-preview .product-preview-info .rating-ornament { float: left; position: relative; top: -6px; left: 10px } .product-preview .product-preview-category { color: #8b8b8b; font-family: "Exo", sans-serif; font-size: .625em; font-weight: 700; line-height: 1em; text-transform: uppercase } .product-preview .rating-ornament { padding: 0 } .product-preview .product-price-wrap { height: 34px; margin-top: 6px; position: relative } .product-preview .product-price-wrap:after { content: ''; display: table; clear: both } .product-preview .product-price-wrap .product-preview-price { float: left; line-height: 34px; transition: all .4s ease-in-out } .product-preview .product-price-wrap .product-preview-price.before { margin: 12px 0 0 10px } .product-preview .product-preview-price { color: #363636; font-size: 1.125em; font-weight: 700; line-height: 1em } .product-preview .product-preview-price .currency { margin-right: 4px } .product-preview .product-preview-price.before { color: #8b8b8b; font-size: .75em; font-weight: 400; line-height: 1em; position: relative } .product-preview .product-preview-price.before .currency { margin-right: 3px } .product-preview .product-preview-price.before:after { content: ''; width: 100%; height: 1px; background-color: #8b8b8b; position: absolute; bottom: 3px; left: 0 } .product-preview .add-to-bag { width: 120px; padding: 0; text-align: center; position: absolute; bottom: 0; left: 0; opacity: 0; visibility: hidden; -o-transform: translate(100%, 0); -moz-transform: translate(100%, 0); -ms-transform: translate(100%, 0); -webkit-transform: translate(100%, 0); transform: translate(100%, 0); transition: all .3s ease-in-out } .product-preview:hover .bubble-ornament.favourites, .product-preview:hover .bubble-ornament.tag { visibility: visible; -o-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); opacity: 1 } .product-preview:hover .bubble-ornament.tag { transition-delay: .15s } .product-preview:hover .product-price-wrap .product-preview-price { opacity: 0; visibility: hidden } .product-preview:hover .add-to-bag { opacity: 1; visibility: visible; -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .product-preview-slider { height: 280px; position: relative; overflow: hidden } .product-preview-slider .product-preview-slider-roster-wrap { width: 100%; position: absolute; bottom: 14px; z-index: 9999 } .product-preview-slider .product-preview-slider-roster:after { content: ''; display: table; clear: both } .product-preview-slider .product-preview-slider-roster .product-preview-slider-roster-item { float: left; margin-right: 8px } .product-preview-slider .product-preview-slider-roster .product-preview-slider-roster-item:last-child { margin-right: 0 } .product-preview-slider-item { width: 270px } .product-preview-slider-roster-wrap { text-align: center } .product-preview-slider-roster { display: inline-block } .product-preview-slider-roster-item { width: 6px; height: 6px; border-radius: 50%; background-color: #363636; opacity: .2; cursor: pointer } .product-preview-slider-roster-item.active { opacity: 1 } .sticker-ornament { width: 40px; height: 40px; padding-top: 11px; border-radius: 50%; background-color: #f30a5c; pointer-events: none } .sticker-ornament .sticker-ornament-text { color: #fff; font-family: "Exo", sans-serif; font-size: .625em; font-weight: 900; text-transform: uppercase; line-height: 1em; text-align: center } .grid-1col .product-preview.list, .grid-2col .product-preview.list, .grid-3col .product-preview.list, .grid-4col .product-preview.list, .grid2-1col .product-preview.list, .grid2-2col .product-preview.list { height: auto; padding: 300px 0 62px } .grid-1col .product-preview.list .product-preview-img-wrap, .grid-2col .product-preview.list .product-preview-img-wrap, .grid-3col .product-preview.list .product-preview-img-wrap, .grid-4col .product-preview.list .product-preview-img-wrap, .grid2-1col .product-preview.list .product-preview-img-wrap, .grid2-2col .product-preview.list .product-preview-img-wrap { width: 270px; left: 50%; margin-left: -135px } .grid-1col .product-preview.list .bubble-ornament.favourites, .grid-1col .product-preview.list .bubble-ornament.tag, .grid-2col .product-preview.list .bubble-ornament.favourites, .grid-2col .product-preview.list .bubble-ornament.tag, .grid-3col .product-preview.list .bubble-ornament.favourites, .grid-3col .product-preview.list .bubble-ornament.tag, .grid-4col .product-preview.list .bubble-ornament.favourites, .grid-4col .product-preview.list .bubble-ornament.tag, .grid2-1col .product-preview.list .bubble-ornament.favourites, .grid2-1col .product-preview.list .bubble-ornament.tag, .grid2-2col .product-preview.list .bubble-ornament.favourites, .grid2-2col .product-preview.list .bubble-ornament.tag { top: auto; bottom: 10px } .grid-1col .product-preview.list .bubble-ornament.favourites, .grid-2col .product-preview.list .bubble-ornament.favourites, .grid-3col .product-preview.list .bubble-ornament.favourites, .grid-4col .product-preview.list .bubble-ornament.favourites, .grid2-1col .product-preview.list .bubble-ornament.favourites, .grid2-2col .product-preview.list .bubble-ornament.favourites { left: 10px } .grid-1col .product-preview.list .bubble-ornament.tag, .grid-2col .product-preview.list .bubble-ornament.tag, .grid-3col .product-preview.list .bubble-ornament.tag, .grid-4col .product-preview.list .bubble-ornament.tag, .grid2-1col .product-preview.list .bubble-ornament.tag, .grid2-2col .product-preview.list .bubble-ornament.tag { left: 60px } .grid-1col .product-preview.list .add-to-bag, .grid-2col .product-preview.list .add-to-bag, .grid-3col .product-preview.list .add-to-bag, .grid-4col .product-preview.list .add-to-bag, .grid2-1col .product-preview.list .add-to-bag, .grid2-2col .product-preview.list .add-to-bag { top: auto; left: auto; bottom: 8px; right: 0 } .grid-1col .product-preview.list .product-preview-title, .grid-2col .product-preview.list .product-preview-title, .grid-3col .product-preview.list .product-preview-title, .grid-4col .product-preview.list .product-preview-title, .grid2-1col .product-preview.list .product-preview-title, .grid2-2col .product-preview.list .product-preview-title { margin-bottom: 40px } .grid-1col .product-preview.list .product-price-wrap, .grid-2col .product-preview.list .product-price-wrap, .grid-3col .product-preview.list .product-price-wrap, .grid-4col .product-preview.list .product-price-wrap, .grid2-1col .product-preview.list .product-price-wrap, .grid2-2col .product-preview.list .product-price-wrap { right: auto; top: 330px; left: 10px } @media screen and (max-width: 960px) { .product-preview.list { height: auto; padding: 300px 10px 62px } .product-preview.list .product-preview-img-wrap { width: 270px; left: 50%; margin-left: -135px } .product-preview.list .bubble-ornament.favourites, .product-preview.list .bubble-ornament.tag { top: auto; bottom: 10px } .product-preview.list .bubble-ornament.favourites { left: 10px } .product-preview.list .bubble-ornament.tag { left: 60px } .product-preview.list .add-to-bag { top: auto; left: auto; bottom: 8px; right: 0 } .product-preview.list .product-preview-title { margin-bottom: 40px } .product-preview.list .product-price-wrap { right: auto; top: 330px; left: 10px } } .product-open-wrap { display: flex; flex-flow: row wrap; justify-content: space-between } .product-open { width: 570px; padding-top: 26px } .product-open.inventory { width: 770px; padding: 16px 0 0 400px; position: relative } .product-open.inventory .product-img { width: 370px; height: 380px; position: absolute; top: 0; left: 0 } .product-open.inventory .product-name { font-size: 1.375em; line-height: 26px } .product-open.inventory .product-category-wrap { margin-top: 4px } .product-open.inventory .product-category-wrap .product-category { font-size: .625em } .product-open.inventory .product-price { margin-top: 20px; font-size: 1.125em } .product-open.inventory .product-description { margin-top: 20px; font-size: .8125em; line-height: 1.6923076923em } .product-open.inventory .product-features { margin-top: 40px } .product-open.inventory .product-open-row { margin-top: 70px; display: flex; flex-flow: row wrap; justify-content: space-between } .product-open.inventory .product-open-row .form-row { width: 270px } .product-open.inventory .product-open-row .product-features { margin-top: 34px } .product-open.inventory .inventory-remove-item { width: 370px; position: absolute; bottom: 0; left: 0 } .product-open .product-name { color: #363636; line-height: 30px } .product-open .product-category-wrap { margin-top: 8px; display: flex; flex-flow: row wrap; align-items: center } .product-open .product-category-wrap .product-category { color: #8b8b8b } .product-open .product-category-wrap .rating-ornament { margin-left: 6px } .product-open .product-category-wrap .product-stock { margin-left: 4px; color: #363636 } .product-open .product-category-wrap .product-stock .highlight { color: #7442ce } .product-open .product-price { margin-top: 30px; color: #363636; font-size: 1.5em; font-weight: 700; line-height: 1em } .product-open .product-price .currency { margin-right: 6px } .product-open .product-description { margin-top: 30px; font-size: .875em; line-height: 1.8571428571em } .product-open .product-features { display: flex; flex-flow: row wrap; margin-top: 50px } .product-open .product-features .product-feature { display: flex; flex-flow: row wrap; margin-right: 60px } .product-open .product-features .product-feature:last-child { margin-right: 0 } .product-open .product-open-form { width: 360px; margin-top: 55px } .product-open .product-actions { display: flex; flex-flow: row wrap; margin-top: 60px } .product-open .product-actions .button { width: 200px; padding-left: 50px } .product-open .product-actions .social-links { margin: 15px 0 0 16px } .product-open .product-info-list { display: flex; flex-flow: row wrap; margin-top: 50px } .product-open .product-info-list .product-info-list-item { margin-right: 26px; color: #8b8b8b } .product-open .product-info-list .product-info-list-item:last-child { margin-right: 0 } .product-open .product-info-list .product-info-list-item .highlight { color: #363636 } .product-open .product-info-list .product-info-list-item a.highlight:hover { color: #7442ce } .product-feature .product-feature-icon { margin-right: 22px; color: #363636; font-size: 24px; font-weight: 700 } .product-feature .product-feature-info .product-feature-title { color: #8b8b8b; line-height: 1em } .product-feature .product-feature-info .product-feature-title.right { text-align: right } .product-feature .product-feature-info .product-feature-text { margin-top: 4px; color: #363636; line-height: 1em } .product-feature .product-feature-info .product-feature-text.price { font-family: "Roboto", sans-serif; font-size: 1.125em } .product-feature .product-feature-info .product-feature-text.price .currency { margin-right: 4px } @media screen and (max-width: 1260px) { .product-open-wrap { display: block } .product-open-wrap .product-slider-wrap { margin: 0 auto } .product-open-wrap .product-open { width: 100%; padding-top: 40px } .product-open-wrap .product-open.inventory { width: 100%; padding-left: 0 } .product-open-wrap .product-open.inventory .product-img { position: static } .product-open-wrap .product-open.inventory .product-open-row { justify-content: flex-start } .product-open-wrap .product-open.inventory .product-open-row .form-row { margin-right: 30px } .product-open-wrap .product-open.inventory .inventory-remove-item { width: 270px; position: static; margin-top: 40px } } .arc.negative .arc-progress-text { color: #363636; text-shadow: none } .arc.big .arc-progress-text { font-size: 3.125em; line-height: 170px } .arc.medium .arc-progress-text { font-size: 2em; line-height: 112px } .arc.small .arc-progress-text { font-size: 1.125em; line-height: 64px } .arc.tiny .arc-progress-text { font-size: .875em; line-height: 48px } .arc.stats .arc-progress-text { font-size: .875em; line-height: 46px } .arc.rate .arc-progress-text { font-size: 2.5em; line-height: 160px } .arc.rate .arc-progress-text .arc-progress-unit { font-size: .8em } .arc.rate.small .arc-progress-text { font-size: .875em } .arc.rate.tiny .arc-progress-text { font-size: .625em } .arc .arc-progress-text { color: #fff; font-family: "Exo", sans-serif; font-size: 1.625em; line-height: 90px; font-weight: 700; text-align: center; text-transform: uppercase; text-shadow: 0px 0px 14px #020102 } .arc-rate-wrap { width: 160px; height: 160px; margin: 0 auto; position: relative } .arc-rate-wrap.half { width: 90px; height: 64px } .arc-rate-wrap.half .arc.rate .arc-progress-text { font-size: .75em; line-height: 68px } .arc-rate-wrap.half .arc.rate .arc-progress-text .arc-progress-unit { font-size: 1em } .arc-rate-wrap.half .arc-rate-info { font-size: .5625em; bottom: 0 } .arc-rate-wrap.tiny { width: 48px; height: 48px } .arc-rate-wrap.tiny .arc.rate .arc-progress-text { line-height: 42px } .arc-rate-wrap.tiny .arc-rate-info { font-size: .5625em; text-transform: none; bottom: 12px } .arc-rate-wrap .arc.rate .arc-progress-text { line-height: 140px } .arc-rate-wrap .arc-rate-icon { position: absolute; top: 44px; left: 50%; margin-left: -11px } .arc-rate-wrap .arc-rate-icon.shield-icon { margin-left: -12px } .arc-rate-wrap .arc-rate-icon.plus-icon { margin-left: -14px } .arc-rate-wrap .arc-rate-stat, .arc-rate-wrap .arc-rate-info { width: 100%; text-align: center; line-height: 1em; text-transform: uppercase; position: absolute } .arc-rate-wrap .arc-rate-stat { color: #363636; bottom: 58px } .arc-rate-wrap .arc-rate-info { color: #8b8b8b; font-size: .625em; bottom: 44px } .arc-stats-wrap.landscape { display: flex; flex-flow: row wrap } .arc-stats-wrap.landscape .arc-stats { margin: 0 } .arc-stats-wrap.landscape .arc-stats-info { margin: 12px 0 0 20px; text-align: left } .arc-stats-wrap .arc-stats { margin: 0 auto; position: relative } .arc-stats-wrap .arc-stats .s-icon { font-size: 18px; font-weight: 700; position: absolute; top: 13px; left: 14px } .arc-stats-wrap .arc-stats .icon-shield { top: 14px; left: 15px } .arc-stats-wrap .arc-stats-info { margin-top: 8px; text-align: center } .arc-stats-wrap .arc-stats-info .arc-stats-stat { color: #363636 } .arc-stats-wrap .arc-stats-info .arc-stats-measure { color: #8b8b8b; font-size: .5625em } .countdown-arc { width: 318px; display: flex; flex-flow: row wrap; justify-content: space-between } .countdown-arc .counter-wrap .counter-text { margin-top: 10px; color: #fff; font-size: .5625em; text-align: center } .countdown-arc .arc-progress-text { color: #fff; font-family: "Exo", sans-serif; font-size: 1.375em; line-height: 66px; font-weight: 700; text-align: center; text-transform: uppercase } .countdown-text-wrap.small .countdown-text-heading { margin-bottom: 8px } .countdown-text-wrap.small .countdown-text { font-size: .875em } .countdown-text-wrap.small .progress-bar { margin-top: 8px } .countdown-text-wrap.bordered { padding-bottom: 24px; border-bottom: 1px solid #dbdbdb } .countdown-text-wrap .countdown-text-heading { margin-bottom: 20px; color: #363636; text-align: center } .countdown-text-wrap .countdown-text { text-align: center } .countdown-text-wrap .countdown-text-info { margin-top: 10px; color: #8b8b8b; font-size: .625em; line-height: 1em; text-align: center } .countdown-text-wrap .countdown-text-info .countdown-text-info-separator { margin: 0 3px } .countdown-text-wrap .progress-bar { margin: 22px auto 0 } .countdown-text { color: #363636 } .countdown-text .timer-text-days:after, .countdown-text .timer-text-hours:after, .countdown-text .timer-text-minutes:after { content: ':'; margin: 0 5px } .bar-progress-wrap, .bar-progress-info { position: absolute; top: -20px } .bar-progress-wrap.bubble { width: 34px; height: 34px; border-radius: 50%; background-color: #363636; top: -40px } .bar-progress-wrap.bubble:before { content: ''; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 10px solid #363636; position: absolute; bottom: -1px; left: -1px; -o-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg) } .bar-progress-wrap.bubble.tiny { width: 28px; height: 28px } .bar-progress-wrap.bubble.tiny .bar-progress-text { line-height: 30px } .bar-progress-wrap.bubble.tiny.static { top: -6px; right: -40px } .bar-progress-wrap.bubble.static { top: -11px; right: -46px } .bar-progress-wrap.bubble .bar-progress-text { color: #fff; line-height: 34px; text-align: center } .bar-progress-info, .bar-progress-text { color: #363636 } .bar-progress-info.medium { font-size: .75em } .bar-progress-wrap { right: 0 } .bar-progress-info { left: 1px } .progress-stat-wrap.medium .bar-progress-info, .progress-stat-wrap.medium .bar-progress-text { font-size: .6875em } .progress-stat-wrap.bottom-spaced { padding-bottom: 24px; border-bottom: 1px solid #dbdbdb } .progress-stat-wrap .bar-progress-info { margin-bottom: 12px; text-align: center; position: static } .progress-stat-wrap .bar-progress-wrap { top: -2px } .progress-stat-wrap .bar-progress-wrap.left { left: -24px } .progress-stat-wrap .bar-progress-wrap.right { right: -24px } .progress-badge-wrap .badge-info { position: relative; top: -20px } .progress-bar.medium { margin-top: 16px } .progress-bar.medium+.progress-bar.medium { margin-top: 60px } .progress-bar.large { margin-top: 34px } .progress-bar+.progress-bar { margin-top: 22px } .progress-bar+.progress-bar.large { margin-top: 34px } .progress-bar.link-full { margin-top: 22px } .progress-bar.link-full.centered { margin: 22px auto 0 } .progress-bar.link-full.violet .bar-progress-text { color: #7442ce } .progress-bar.link-full.red .bar-progress-text { color: #f30a5c } .progress-bar.link-center { margin-top: 20px } .progress-bar.link-center .bar-progress-info { width: 100%; text-align: center } .progress-bar.link-left { margin-top: 16px } .progress-bar.link-left .bar-progress-wrap { top: -16px; right: auto; left: 0 } .progress-bar.link-left .bar-progress-wrap .bar-progress-text { font-size: .6875em } .progress-bar.link-left.big-text .bar-progress-wrap .bar-progress-text { font-size: .75em } .progress-bar.spaced-units .bar-progress-unit { margin-left: 2px } .progress-bar.captioned { padding: 14px 0 8px } .progress-bar.captioned.small { margin-top: 20px; padding: 0 } .progress-bar .progress-bar-caption { color: #8b8b8b; font-size: .5625em; line-height: 1em; text-transform: uppercase } .progress-bar .progress-bar-text { color: #8b8b8b; line-height: 1em; text-align: center; position: relative; top: -34px } .progress-bar .progress-bar-text.small { font-size: .625em } .progress-bar .progress-bar-text.left, .progress-bar .progress-bar-text.right { position: absolute; top: -20px } .progress-bar .progress-bar-text.left { left: 0 } .progress-bar .progress-bar-text.right { right: 0 } .progress-bar .progress-bar-text.bold, .progress-bar .progress-bar-text .pg-text { color: #363636 } .tab-wrap.border-bottom { border-bottom: 1px solid #dbdbdb } .tab-wrap .tab-header { display: flex; flex-flow: row wrap } .tab-wrap .tab-header.border-top { border-top: 1px solid #dbdbdb } .tab-wrap .tab-header.items-2 .tab-header-item { width: 50% } .tab-wrap .tab-header.items-3 .tab-header-item { width: 33.3333333333% } .tab-wrap .tab-header.items-4 .tab-header-item { width: 25% } .tab-wrap .tab-header.items-5 .tab-header-item { width: 20% } .tab-wrap .tab-header.items-6 .tab-header-item { width: 16.6666666667% } .tab-wrap .tab-header .tab-header-item { height: 58px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; position: relative; cursor: pointer } .tab-wrap .tab-header .tab-header-item .logo-game { opacity: 0.2; margin-right: 10px } .tab-wrap .tab-header .tab-header-item.active { border-top-left-radius: 6px; border-top-right-radius: 6px } .tab-wrap .tab-header .tab-header-item.active .logo-game { opacity: 1 } .tab-wrap .tab-header .tab-header-item.active.red { background-color: #f30a5c } .tab-wrap .tab-header .tab-header-item.active.blue { background-color: #1c95f3 } .tab-wrap .tab-header .tab-header-item.active.violet { background-color: #7442ce } .tab-wrap .tab-header .tab-header-item.active.green { background-color: #58d819 } .tab-wrap .tab-header .tab-header-item.active.cyan { background-color: #00e3d0 } .tab-wrap .tab-header .tab-header-item.active.yellow { background-color: #ffb400 } .tab-wrap .tab-header .tab-header-item.active .tab-header-item-text { color: #fff } .tab-wrap .tab-header .tab-header-item.active:after { display: block } .tab-wrap .tab-header .tab-header-item.selected .logo-game { opacity: 1 } .tab-wrap .tab-header .tab-header-item.selected .tab-header-item-text { color: #363636 } .tab-wrap .tab-header .tab-header-item.selected:after { display: block } .tab-wrap .tab-header .tab-header-item.red:after { background-color: #f30a5c } .tab-wrap .tab-header .tab-header-item.blue:after { background-color: #1c95f3 } .tab-wrap .tab-header .tab-header-item:after { content: ''; width: 100%; height: 3px; background-color: #7442ce; position: absolute; bottom: 0; left: 0; display: none } .tab-wrap .tab-header .tab-header-item .tab-header-item-text { color: #bfbfbf; text-align: center; transition: all .15s ease-in-out } .tab-wrap .tab-body .tab-item { padding-top: 10px } .tab-wrap .tab-body .tab-item.spaced { padding-top: 60px } @media screen and (max-width: 680px) { .tab-wrap .tab-header { display: block } .tab-wrap .tab-header.items-2 .tab-header-item, .tab-wrap .tab-header.items-3 .tab-header-item, .tab-wrap .tab-header.items-4 .tab-header-item, .tab-wrap .tab-header.items-5 .tab-header-item, .tab-wrap .tab-header.items-6 .tab-header-item { width: 100% } } .slider-controls.blue .slider-control { background-color: #1c95f3 } .slider-controls.blue .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-controls.red .slider-control { background-color: #f30a5c } .slider-controls.red .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-controls.green .slider-control { background-color: #58d819 } .slider-controls.green .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-controls.yellow .slider-control { background-color: #ffb400 } .slider-controls.yellow .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-controls.violet .slider-control { background-color: #7442ce } .slider-controls.violet .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-controls.cyan .slider-control { background-color: #00e3d0 } .slider-controls.cyan .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-controls.hover-yellow .slider-control { transition: background-color .2s ease-in-out } .slider-controls.hover-yellow .slider-control:hover { background-color: #ffb400 } .slider-controls.hover-yellow .slider-control.disabled { cursor: auto } .slider-controls.hover-yellow .slider-control.disabled:hover { background-color: #dbdbdb } .slider-control { width: 26px; height: 26px; border-radius: 2px; background-color: #8b8b8b; cursor: pointer; position: relative } .slider-control.disabled { background-color: #dbdbdb; cursor: auto } .slider-control.big { width: 40px; height: 40px; border-radius: 4px } .slider-control.big .arrow-icon { top: 15px } .slider-control .arrow-icon { fill: #fff; position: absolute; top: 8px; left: 50%; margin-left: -3px } .slider-control.control-previous .arrow-icon { -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg) } .postslide-wrap .slider-controls { margin-top: 20px; display: none } .postslide-wrap .slider-controls .slider-control.control-previous { margin-right: 30px } .postslide { width: 870px; height: 510px; overflow: hidden } .postslide:after { content: ''; display: table; clear: both } .postslide .news-preview { float: left; width: 570px } .postslide .news-preview .post-preview { width: 100% } .postslide .news-preview .post-preview .loading-line { display: none } .postslide .news-roster { float: right; width: 300px } .postslide .news-roster .post-preview { cursor: pointer } .carousel { width: 870px; height: 294px; margin: 0 auto; overflow: hidden } .carousel.big { width: 1170px } .carousel.st-video { height: 522px } .carousel.st-video .carousel-items .post-preview:last-child { margin-top: 30px } .carousel.video { height: 345px } .carousel.video .carousel-items .post-preview:last-child { margin-top: 30px } .carousel.video.full { height: 460px } .carousel.video.full .carousel-items .post-preview { width: 870px } .carousel.video.full .carousel-items .post-preview:last-child { margin-top: 0 } .carousel .carousel-items .post-preview { width: 270px } .carousel-controls:after { content: ''; display: table; clear: both } .carousel-controls .slider-control { float: left; margin-right: 12px } .carousel-controls .slider-control:last-child { margin-right: 0 } .banner-slider { height: 720px; overflow: hidden; position: relative } .banner-slider.v2 .slider-item-wrap { padding: 190px 0 0 } .banner-slider.v2 .slider-item { box-shadow: inset 0px -310px 370px -150px rgba(0, 0, 0, 0.85) } .banner-slider.v2 .banner-slider-controls { position: relative } .banner-slider.v2 .banner-slider-controls .arrow-icon { fill: #fff } .banner-slider.v2 .banner-slider-controls .control-previous, .banner-slider.v2 .banner-slider-controls .control-next { position: absolute; top: 12px; cursor: pointer } .banner-slider.v2 .banner-slider-controls .control-previous { left: -96px; -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg) } .banner-slider.v2 .banner-slider-controls .control-next { right: -96px } .banner-slider.v3 { height: 640px; position: relative } .banner-slider.v3:after { content: ''; display: table; clear: both } .banner-slider.v3 .post-preview { width: 33.3333333333%; height: 640px } .banner-slider.v3 .post-preview .post-preview-img-overlay { transition: opacity .3s ease-in-out } .banner-slider.v3 .post-preview:hover .post-preview-img-overlay { opacity: 0 } .banner-slider.v3 .post-preview:hover .tag-ornament { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .banner-slider.v3 .post-preview:hover .post-preview-overlay .post-preview-title, .banner-slider.v3 .post-preview:hover .post-preview-overlay .post-preview-text { -o-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -webkit-transform: translate(0, 0); transform: translate(0, 0) } .banner-slider.v3 .post-preview .post-preview-img { height: 640px; box-shadow: inset 0px -310px 370px -40px rgba(0, 0, 0, 0.85) } .banner-slider.v3 .post-preview .tag-ornament { -o-transform: translate(0, 106px); -moz-transform: translate(0, 106px); -ms-transform: translate(0, 106px); -webkit-transform: translate(0, 106px); transform: translate(0, 106px); transition: transform .3s ease-in-out } .banner-slider.v3 .post-preview .post-preview-overlay { margin-bottom: 44px; overflow: hidden } .banner-slider.v3 .post-preview .post-preview-overlay .post-preview-title, .banner-slider.v3 .post-preview .post-preview-overlay .post-preview-text { -o-transform: translate(0, 106px); -moz-transform: translate(0, 106px); -ms-transform: translate(0, 106px); -webkit-transform: translate(0, 106px); transform: translate(0, 106px); transition: transform .3s ease-in-out } .banner-slider.v3 .post-preview .post-preview-overlay .post-preview-text { margin-top: 10px } .banner-slider.v3 .banner-slider-controls .arrow-icon { fill: #363636 } .banner-slider.v3 .banner-slider-controls .control-previous, .banner-slider.v3 .banner-slider-controls .control-next { width: 42px; height: 38px; background-color: #fff; position: absolute; top: 270px; z-index: 9999; cursor: pointer } .banner-slider.v3 .banner-slider-controls .control-previous .arrow-icon, .banner-slider.v3 .banner-slider-controls .control-next .arrow-icon { position: absolute; top: 14px } .banner-slider.v3 .banner-slider-controls .control-previous { left: 0 } .banner-slider.v3 .banner-slider-controls .control-previous .arrow-icon { -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); right: 20px } .banner-slider.v3 .banner-slider-controls .control-next { right: 0 } .banner-slider.v3 .banner-slider-controls .control-next .arrow-icon { left: 20px } .banner-slider .slider-items { width: 100% } .banner-slider .slider-item { width: 100%; height: 720px } .banner-slider .slider-item-1 { background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../img/posts/13.jpg") no-repeat center; background-size: cover } .banner-slider .slider-item-2 { background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../img/posts/16.jpg") no-repeat center; background-size: cover } .banner-slider .slider-item-3 { background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../img/posts/07.jpg") no-repeat center; background-size: cover } .banner-slider .slider-item-4 { background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)), url("../img/posts/37.jpg") no-repeat center; background-size: cover } .banner-slider .slider-item-wrap { max-width: 1170px; margin: 0 auto; width: 95%; padding: 220px 0 0 70px } .banner-slider .banner-slider-roster { width: 80px; position: absolute; bottom: 28px; left: 50%; margin-left: -40px; z-index: 9999 } .banner-slider .banner-slider-preview-wrap { position: absolute; bottom: 26px; left: 50%; margin-left: -491px; z-index: 9999 } .banner-slider .banner-slider-preview { width: 982px; height: 70px } .banner-slider .banner-slider-preview-roster:after { content: ''; display: table; clear: both } .banner-slider .banner-slider-preview-roster .post-preview { opacity: .6; transition: .3s opacity ease-in-out; cursor: pointer } .banner-slider .banner-slider-preview-roster .post-preview.active { opacity: 1 } .banner-slider .post-preview.centered { margin: 0 auto } .banner-slider-roster:after { content: ''; display: table; clear: both } .banner-slider-roster .banner-slider-roster-item { float: left; margin-right: 16px } .banner-slider-roster .banner-slider-roster-item:last-child { margin-right: 0 } .banner-slider-roster-item { width: 8px; height: 8px; border-radius: 50%; background-color: #fff; opacity: 0.3; transition: all .3s ease-in-out; cursor: pointer } .banner-slider-roster-item.active { opacity: 1 } .slideshow { width: 100%; position: relative } .slideshow.v2 .slider-item-1 .slider-item-img, .slideshow.v2 .slider-item-1 .slider-blur-bg { background: url("../img/posts/19.jpg") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-2 .slider-item-img, .slideshow.v2 .slider-item-2 .slider-blur-bg { background: url("../img/posts/29.png") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-3 .slider-item-img, .slideshow.v2 .slider-item-3 .slider-blur-bg { background: url("../img/posts/27.jpg") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-4 .slider-item-img, .slideshow.v2 .slider-item-4 .slider-blur-bg { background: url("../img/posts/22.jpg") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-5 .slider-item-img, .slideshow.v2 .slider-item-5 .slider-blur-bg { background: url("../img/posts/18.jpg") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-6 .slider-item-img, .slideshow.v2 .slider-item-6 .slider-blur-bg { background: url("../img/posts/23.jpg") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-7 .slider-item-img, .slideshow.v2 .slider-item-7 .slider-blur-bg { background: url("../img/posts/21.jpg") no-repeat center; background-size: cover } .slideshow.v2 .slider-item-img { width: 84.8275862069% } .slideshow.v2 .slider-footer { height: 120px; background-color: transparent; position: relative } .slideshow.v2 .slider-footer .slider-roster { display: grid; grid-template-columns: repeat(7, 80px); grid-gap: 20px; justify-content: center; margin-top: 20px } .slideshow.v2 .slider-footer .slider-roster-item { padding: 0; cursor: pointer; position: relative } .slideshow.v2 .slider-footer .slider-roster-item.active .slider-roster-item-img-border { border: 4px solid #ffb400 } .slideshow.v2 .slider-footer .slider-roster-item .slider-roster-item-img-border { width: 80px; height: 80px; border: 4px solid transparent; position: absolute; top: 0; left: 0; transition: border-color .4s ease-in-out } .slideshow.v2 .slider-footer .slider-roster-item .slider-roster-item-img { width: 80px; height: 80px } .slideshow.v2 .slider-footer .slider-control { top: 20px; right: auto } .slideshow.v2 .slider-footer .slider-control.control-previous { left: 0 } .slideshow.v2 .slider-footer .slider-control.control-next { right: 0 } .slideshow .slider-content { height: 460px } .slideshow .slider-item-1 .slider-item-img, .slideshow .slider-item-1 .slider-blur-bg { background: url("../img/posts/29.png") no-repeat center; background-size: cover } .slideshow .slider-item-2 .slider-item-img, .slideshow .slider-item-2 .slider-blur-bg { background: url("../img/posts/19.jpg") no-repeat center; background-size: cover } .slideshow .slider-item-3 .slider-item-img, .slideshow .slider-item-3 .slider-blur-bg { background: url("../img/posts/18.jpg") no-repeat center; background-size: cover } .slideshow .slider-item-4 .slider-item-img, .slideshow .slider-item-4 .slider-blur-bg { background: url("../img/posts/21.jpg") no-repeat center; background-size: cover } .slideshow .slider-item-5 .slider-item-img, .slideshow .slider-item-5 .slider-blur-bg { background: url("../img/posts/02.jpg") no-repeat center; background-size: cover } .slideshow .slider-items { width: 100%; height: 460px } .slideshow .slider-item { width: 100%; overflow: hidden } .slideshow .slider-item-img { width: 70.3448275862%; height: 460px; margin: 0 auto; position: relative; z-index: 9999 } .slideshow .slider-blur-bg { width: 100%; height: 460px; position: absolute; top: 0; left: 0; -webkit-filter: blur(5px); filter: blur(5px) } .slideshow .slider-footer { width: 100%; height: 84px; background-color: #252627 } .slideshow .slider-footer .slider-control { position: absolute; top: 22px; z-index: 9999 } .slideshow .slider-footer .slider-control.control-previous { right: 78px } .slideshow .slider-footer .slider-control.control-next { right: 26px } .slideshow .slider-footer .slider-roster { width: 100% } .slideshow .slider-footer .slider-roster-item { padding: 24px 144px 0 26px } .slideshow .slider-footer .slider-footer-title { color: #fff; font-size: .875em } .slideshow .slider-footer .slider-footer-text { color: #8b8b8b; font-size: .75em; line-height: 1em; margin-top: 8px } .sponsors-slider-wrap { position: relative } .sponsors-slider-wrap .sponsors-slider-controls .control-previous, .sponsors-slider-wrap .sponsors-slider-controls .control-next { position: absolute; top: 45px; cursor: pointer; z-index: 6666 } .sponsors-slider-wrap .sponsors-slider-controls .control-previous .arrow-icon, .sponsors-slider-wrap .sponsors-slider-controls .control-next .arrow-icon { fill: #fff } .sponsors-slider-wrap .sponsors-slider-controls .control-previous { left: -70px; -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg) } .sponsors-slider-wrap .sponsors-slider-controls .control-next { right: -70px } .sponsors-slider { width: 410px; height: 100px } .sponsors-slider .sponsors-slider-item { width: 110px; height: 100px; display: flex; flex-flow: row nowrap; justify-content: center; align-items: center } .sponsors-slider .sponsors-slider-item .sponsor-img { opacity: .1 } .carousel-match-result-wrap { border: 1px solid #dbdbdb; border-right: none; border-left: none; position: relative; padding: 0 46px } .carousel-match-result-wrap.full { display: flex; flex-flow: row nowrap; padding: 0 25px 0 0 } .carousel-match-result-wrap.full .match-selector { width: 192px; flex-shrink: 0; text-align: center; padding: 46px 0 0 36px } .carousel-match-result-wrap.full .control-next, .carousel-match-result-wrap.full .control-previous { width: 26px; height: 130px; border-left: 1px solid #dbdbdb; padding-top: 56px; cursor: pointer; text-align: center; position: absolute; top: 0 } .carousel-match-result-wrap.full .control-next.disabled, .carousel-match-result-wrap.full .control-previous.disabled { fill: #dbdbdb } .carousel-match-result-wrap.full .control-next { right: 0 } .carousel-match-result-wrap.full .control-previous { left: 164px } .carousel-match-result-wrap.full .control-previous .arrow-icon { -o-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg) } .carousel-match-result-wrap .slider-controls { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2 } .carousel-match-result-wrap .slider-controls .control-next, .carousel-match-result-wrap .slider-controls .control-previous { position: absolute; top: 52px } .carousel-match-result-wrap .slider-controls .control-next { right: 0 } .carousel-match-result-wrap .slider-controls .control-previous { left: 0 } .carousel-match-result { width: 100%; height: 130px; border-right: 1px solid #dbdbdb; border-left: 1px solid #dbdbdb; margin: 0 auto; overflow: hidden } .carousel-match-result .carousel-match-result-items .carousel-match-result-item { border-right: 1px solid #dbdbdb } .shop-banner-slider-wrap .shop-banner-slider-roster { margin-top: 26px } .shop-banner-slider { height: 320px; border: 1px solid #dbdbdb; overflow: hidden } .shop-banner-slider-roster { display: flex; flex-flow: row wrap; justify-content: center } .shop-banner-slider-roster .shop-banner-slider-roster-item { margin-right: 10px; cursor: pointer } .shop-banner-slider-roster .shop-banner-slider-roster-item .bar-progress-info { color: #bfbfbf } .shop-banner-slider-roster .shop-banner-slider-roster-item canvas:last-child { display: none } .shop-banner-slider-roster .shop-banner-slider-roster-item.active .bar-progress-info { color: #363636 } .shop-banner-slider-roster .shop-banner-slider-roster-item.active canvas:last-child { display: block } .shop-banner-slider-roster .shop-banner-slider-roster-item:last-child { margin-right: 0 } .product-slider-wrap { width: 570px } .product-slider-wrap .product-slider-roster-items { margin-top: 20px } .product-slider { height: 590px; overflow: hidden } .product-slider .product-slider-items { width: 100%; height: 100% } .product-slider .product-slider-item { width: 100%; height: 100% } .product-slider .product-slider-item img { width: 100%; height: 100% } .product-slider-roster-items { display: flex; flex-flow: row wrap; justify-content: center } .product-slider-roster-items .product-slider-roster-item { width: 98px; height: 98px; margin-right: 20px; cursor: pointer; opacity: 0.2; transition: .3s opacity ease-in-out } .product-slider-roster-items .product-slider-roster-item:last-child { margin-right: 0 } .product-slider-roster-items .product-slider-roster-item.active { opacity: 1 } @media screen and (max-width: 1260px) { .banner-slider.v2 .banner-slider-preview-wrap { width: 80px; margin-left: -40px; bottom: 80px } .banner-slider.v2 .banner-slider-preview-wrap .banner-slider-preview { display: none } .banner-slider.v2 .banner-slider-preview-wrap .banner-slider-controls .control-previous { left: 0 } .banner-slider.v2 .banner-slider-preview-wrap .banner-slider-controls .control-next { right: 0 } .banner-slider.v3 .post-preview { width: 50% } .carousel.big { width: 870px } .shop-banner-slider-wrap { display: none } } @media screen and (max-width: 960px) { .banner-slider .slider-item-wrap { padding-left: 32px } .banner-slider.v3 .post-preview { width: 100% } .postslide-wrap .slider-controls { display: flex; flex-flow: row wrap; justify-content: center } .postslide { width: 100% } .postslide .news-preview { width: 100% } .postslide .news-preview .post-preview .loading-line { display: block } .postslide .news-roster { display: none } .slideshow.v2 .slider-footer { height: auto } .slideshow.v2 .slider-footer .slider-roster { text-align: none; grid-template-columns: repeat(4, 80px) } .slideshow.v2 .slider-footer .slider-roster .slider-roster-item { width: auto; display: block; padding: 0 } .slideshow.v2 .slider-footer .slider-controls { width: auto; position: static; top: 0; left: 0; margin-left: 0 } .slideshow.v2 .slider-footer .slider-controls .slider-control { top: 40px } .slideshow .slider-footer { height: 134px } .slideshow .slider-footer .slider-roster { text-align: center } .slideshow .slider-footer .slider-roster .slider-roster-item { width: 100%; display: inline-block; padding: 24px 20px 0 } .slideshow .slider-footer .slider-roster .slider-roster-item .slider-footer-title { line-height: 1.2857142857em } .slideshow .slider-footer .slider-roster .slider-roster-item .slider-footer-text { display: none } .slideshow .slider-footer .slider-controls { width: 92px; position: absolute; top: 70px; left: 50%; margin-left: -46px } .slideshow .slider-footer .slider-controls .slider-control { top: 0 } .slideshow .slider-footer .slider-controls .slider-control.control-previous { left: 0 } .slideshow .slider-footer .slider-controls .slider-control.control-next { right: 0 } .carousel { width: 570px } .carousel.big { width: 570px } .carousel.video.full .carousel-items .post-preview { width: 570px } } @media screen and (max-width: 680px) { .banner-slider .slider-item-wrap { padding-left: 0 } .sponsors-slider { width: 270px } .slideshow.v2 .slider-footer { height: 70px } .slideshow.v2 .slider-footer .slider-roster { display: none } .slideshow.v2 .slider-footer .slider-controls { width: 92px; position: absolute; top: 30px; left: 50%; margin-left: -46px } .slideshow.v2 .slider-footer .slider-controls .slider-control { top: 0 } .slideshow.v2 .slider-footer .slider-controls .slider-control.control-previous { left: 0 } .slideshow.v2 .slider-footer .slider-controls .slider-control.control-next { right: 0 } .carousel { width: 270px } .carousel.big { width: 270px } .carousel.video.full { height: 160px } .carousel.video.full .carousel-items .post-preview { width: 270px; height: 160px } .carousel.video.full .carousel-items .post-preview .post-preview-img { height: 160px } .carousel.video.full .carousel-items .post-preview .play-button { margin: 0 auto } .carousel.video.full .carousel-items .post-preview .post-preview-overlay-info { display: none } .product-slider-wrap { width: 100% } .product-slider-wrap .product-slider { width: 285px; height: 295px; margin: 0 auto } } @media screen and (max-width: 480px) { .sponsors-slider { width: 110px } .postslide { height: 450px } .postslide .news-preview .post-preview .post-preview-img { height: 450px } .postslide .news-preview .post-preview .post-preview-overlay .post-preview-title { font-size: 1.625em } .slideshow .slider-content { height: 380px } .slideshow .slider-items { height: 380px } .slideshow .slider-items .slider-item .slider-blur-bg, .slideshow .slider-items .slider-item .slider-item-img { height: 380px } } .xm-tooltip { padding: 8px 12px; border: 1px solid #dbdbdb; border-radius: 4px; background-color: #fff; box-shadow: 0px 10px 28.8px 1.2px rgba(0, 0, 0, 0.08) } .xm-tooltip .xm-tooltip-text { color: #363636; line-height: 16px } .xm-tooltip.v2 { padding: 2px 10px; border-color: #363636; background-color: #363636 } .xm-tooltip.v2.right:after { left: -10px; top: 50%; margin-left: 0; margin-top: -3px; -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .xm-tooltip.v2.red { border-color: #f30a5c; background-color: #f30a5c } .xm-tooltip.v2.red:after { border-top-color: #f30a5c } .xm-tooltip.v2.medium .xm-tooltip-text { font-size: 12px; text-align: center } .xm-tooltip.v2 .xm-tooltip-text { color: #fff; font-size: 9px } .xm-tooltip.v2 .xm-tooltip-text .inner-text { display: block; font-size: 8px; text-align: center } .xm-tooltip.v2:after { content: ''; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #363636; position: absolute; bottom: -6px; left: 50%; margin-left: -6px } .calendar { width: 870px; margin: 0 auto } .calendar .calendar-header .calendar-header-top { height: 60px; border-bottom: 1px solid #dbdbdb; position: relative } .calendar .calendar-header .calendar-header-top .calendar-month-year { color: #363636; line-height: 60px; text-align: center } .calendar .calendar-header .calendar-header-top .calendar-month-year .calendar-month { margin-right: 3px } .calendar .calendar-header .calendar-header-top .calendar-controls .slider-control { position: absolute; top: 16px } .calendar .calendar-header .calendar-header-top .calendar-controls .slider-control.control-previous { left: 2px } .calendar .calendar-header .calendar-header-top .calendar-controls .slider-control.control-next { right: 2px } .calendar .calendar-header .calendar-header-bottom { height: 41px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap } .calendar .calendar-header .calendar-header-bottom .calendar-week-day { width: 124px; color: #363636; line-height: 40px; text-align: center } .calendar .calendar-header .calendar-header-bottom .calendar-week-day:first-child, .calendar .calendar-header .calendar-header-bottom .calendar-week-day:last-child { width: 125px } .calendar .calendar-body { display: flex; flex-flow: row wrap } .calendar .calendar-body .calendar-day { width: 124px; height: 131px; padding: 50px 10px 0 19px; border-bottom: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb; position: relative } .calendar .calendar-body .calendar-day .calendar-day-number { display: block; color: gray; font-size: .75em; line-height: 1em; position: absolute; top: 18px; right: 19px } .calendar .calendar-body .calendar-day .event-list .event-item { color: #363636; line-height: 1.2em; margin-bottom: 12px; position: relative } .calendar .calendar-body .calendar-day .event-list .event-item:last-child { margin-bottom: 0 } .calendar .calendar-body .calendar-day .event-list .event-item:before { content: ''; width: 5px; height: 5px; margin-right: 6px; border-radius: 50%; background-color: #363636; position: absolute; top: 2px; left: -10px } .calendar .calendar-body .calendar-day .event-list .event-item.blue:before { background-color: #1c95f3 } .calendar .calendar-body .calendar-day .event-list .event-item.green:before { background-color: #58d819 } .calendar .calendar-body .calendar-day .event-list .event-item.violet:before { background-color: #7442ce } .calendar .calendar-body .calendar-day:first-child, .calendar .calendar-body .calendar-day:nth-child(8n+8), .calendar .calendar-body .calendar-day:nth-child(7n+7) { width: 125px } .calendar .calendar-body .calendar-day:nth-child(7n+7) { border-right: none } .calendar .calendar-body .calendar-day.disabled .calendar-day-number { color: #d2d2d2; font-weight: 700 } .calendar .calendar-body .calendar-day.current .calendar-day-number { font-weight: 700 } .calendar .calendar-body .calendar-day.current.event .calendar-day-number { color: #fff } .calendar .calendar-body .calendar-day.event .calendar-day-number { width: 30px; height: 30px; border-radius: 50%; background-color: #363636; color: #fff; font-weight: 700; text-align: center; line-height: 30px; top: 8px; right: 10px } .calendar .calendar-body .calendar-day.event-popup .event-list { width: 160px; position: absolute; top: 36px; left: 0; z-index: 9999; padding: 18px 28px; background-color: #fff; border: 1px solid #dbdbdb; border-radius: 4px; opacity: 0; visibility: hidden; transition: all .3s ease-in-out } .calendar .calendar-body .calendar-day.event-popup:hover .event-list { opacity: 1; visibility: visible } .calendar.blue .calendar-body .calendar-day.current .calendar-day-number { color: #1c95f3 } .calendar.blue .calendar-body .calendar-day.current.event .calendar-day-number { color: #fff } .calendar.blue .calendar-body .calendar-day.event .calendar-day-number { background-color: #1c95f3 } .calendar.small { width: 270px } .calendar.small .calendar-header .calendar-header-top { height: 40px; border-bottom: none } .calendar.small .calendar-header .calendar-header-top .calendar-month-year { line-height: 40px } .calendar.small .calendar-header .calendar-header-top .calendar-controls .slider-control { top: 7px } .calendar.small .calendar-header .calendar-header-bottom { height: 30px; border-bottom: none } .calendar.small .calendar-header .calendar-header-bottom .calendar-week-day { width: 38px; line-height: 30px } .calendar.small .calendar-header .calendar-header-bottom .calendar-week-day:first-child, .calendar.small .calendar-header .calendar-header-bottom .calendar-week-day:last-child { width: 40px } .calendar.small .calendar-body { display: flex; flex-flow: row wrap } .calendar.small .calendar-body .calendar-day { width: 38px; height: 30px; padding: 0; border: none } .calendar.small .calendar-body .calendar-day .calendar-day-number { margin: 0 auto; line-height: 30px; text-align: center; position: static } .calendar.small .calendar-body .calendar-day:first-child, .calendar.small .calendar-body .calendar-day:nth-child(8n+8), .calendar.small .calendar-body .calendar-day:nth-child(7n+7) { width: 40px } @media screen and (max-width: 960px) { .calendar { width: 560px } .calendar .calendar-header .calendar-header-bottom .calendar-week-day { width: 80px } .calendar .calendar-header .calendar-header-bottom .calendar-week-day:first-child, .calendar .calendar-header .calendar-header-bottom .calendar-week-day:last-child { width: 80px } .calendar .calendar-body .calendar-day { width: 80px; height: 87px } .calendar .calendar-body .calendar-day .event-list { display: none } .calendar .calendar-body .calendar-day:first-child, .calendar .calendar-body .calendar-day:nth-child(8n+8), .calendar .calendar-body .calendar-day:nth-child(7n+7) { width: 80px } .calendar.small .calendar-body .calendar-day .event-list { display: block } } @media screen and (max-width: 680px) { .calendar { width: 270px; margin: 30px auto } .calendar .calendar-header .calendar-header-top { height: 40px; border-bottom: none } .calendar .calendar-header .calendar-header-top .calendar-month-year { line-height: 40px } .calendar .calendar-header .calendar-header-top .calendar-controls .slider-control { top: 7px } .calendar .calendar-header .calendar-header-bottom { height: 30px; border-bottom: none } .calendar .calendar-header .calendar-header-bottom .calendar-week-day { width: 38px; line-height: 30px } .calendar .calendar-header .calendar-header-bottom .calendar-week-day:first-child, .calendar .calendar-header .calendar-header-bottom .calendar-week-day:last-child { width: 40px } .calendar .calendar-body { display: flex; flex-flow: row wrap } .calendar .calendar-body .calendar-day { width: 38px; height: 30px; padding: 0; border: none } .calendar .calendar-body .calendar-day .calendar-day-number { margin: 0 auto; line-height: 30px; text-align: center; position: static } .calendar .calendar-body .calendar-day:first-child, .calendar .calendar-body .calendar-day:nth-child(8n+8), .calendar .calendar-body .calendar-day:nth-child(7n+7) { width: 40px } } .header-wrap { background-color: #252627 } .header { height: 50px; display: flex; flex-flow: row wrap; justify-content: space-between } .header .widget-selectables { display: flex; flex-flow: row wrap } .header .widget-selectables .widget-options-wrap { margin-right: 30px } .header .widget-selectables .widget-options-wrap:last-child { margin-right: 0 } .header .widget-selectables .log-button { margin-top: 12px } .widget-options-wrap { cursor: pointer } .widget-options-wrap .widget-option-text { float: left; color: #fff; font-family: "Roboto", sans-serif; font-size: .6875em } .widget-options-wrap .widget-option-img { float: left; margin-right: 10px } .widget-options-wrap .widget-option-icon { float: left; margin-right: 8px; color: #1c95f3; font-size: 14px; line-height: 50px } .widget-options-wrap .current-option:after { content: ''; display: table; clear: both } .widget-options-wrap .current-option>.widget-option-text { line-height: 50px; margin-right: 3px } .widget-options-wrap .current-option .current-option-value { float: left } .widget-options-wrap .current-option .arrow-icon { float: left; margin: 23px 0 0 9px; fill: #fff; -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .widget-options-wrap .current-option-value:after { content: ''; display: table; clear: both } .widget-options-wrap .current-option-value.highlighted .widget-option-text { color: #1c95f3 } .widget-options-wrap .current-option-value .widget-option-img { margin-top: 19px } .widget-options-wrap .current-option-value .widget-option-img.user-avatar { margin-top: 15px } .widget-options-wrap .current-option-value .widget-option-text { line-height: 50px } .widget-options { width: 180px; visibility: hidden } .widget-options.linkable .widget-option .widget-option-text { color: #8b8b8b; transition: all .15s ease-in-out } .widget-options.linkable .widget-option:hover .widget-option-text { color: #fff } .widget-options.short .widget-option .widget-option-text { line-height: 32px } .widget-options.small { width: 110px } .widget-options.small .widget-option { padding-left: 10px } .widget-options .widget-option-heading, .widget-options .widget-option { background-color: #252627; border-bottom: 1px solid #424242 } .widget-options .widget-option-heading:after, .widget-options .widget-option:after { content: ''; display: table; clear: both } .widget-options .widget-option-heading { padding-left: 12px; border-left: 3px solid #fff; cursor: auto } .widget-options .widget-option-heading.blue { border-left-color: #1c95f3 } .widget-options .widget-option-heading.red { border-left-color: #f30a5c } .widget-options .widget-option-heading .widget-option-text { font-family: "Exo", sans-serif; font-size: .625em; font-weight: 700; line-height: 40px; text-transform: uppercase } .widget-options .widget-option { display: block; padding-left: 20px } .widget-options .widget-option:last-child { border-bottom: none } .widget-options .widget-option .widget-option-img { float: left; margin-top: 12px } .widget-options .widget-option .widget-option-text { float: left; line-height: 35px } @media screen and (max-width: 1260px) { .header .widget-selectables .currency-text-info { display: none } .header .widget-selectables:last-child .widget-options-wrap { display: none } } @media screen and (max-width: 680px) { .header .widget-selectables .widget-option-img { display: none } } .banner-wrap { background-color: #363636 } .banner-wrap.gaming-news { background: url("../img/banners/gaming-news-banner.jpg") no-repeat center, linear-gradient(45deg, #1c59f3, #00d8ff); background-size: cover } .banner-wrap.game-review { background: url("../img/banners/game-reviews-banner.jpg") no-repeat center, linear-gradient(45deg, #420ed9, #ff055d); background-size: cover } .banner-wrap.movie-reviews { background: url("../img/banners/movie-news-banner.jpg") no-repeat center, linear-gradient(45deg, #3a8800, #60ec1b); background-size: cover } .banner-wrap.geeky-news { background: url("../img/banners/geeky-news-banner.jpg") no-repeat center, linear-gradient(45deg, #f60, #ffde00); background-size: cover } .banner-wrap.e-sport { background: url("/public/img/frontend/siege/top-banner.jpg") no-repeat center, linear-gradient(45deg, #21149e, #8314ff); background-size: cover } .banner-wrap.pixel-videos { background: url("../img/banners/pixel-videos-banner.jpg") no-repeat center, linear-gradient(45deg, #0088af, #00ffea); background-size: cover } .banner-wrap.forum-banner { background: url("../img/banners/pixel-banner.jpg") no-repeat center, linear-gradient(45deg, #f30a5c, #1c95f3); background-size: cover } .banner-wrap.shop-banner { background: url("../img/banners/shop-banner.jpg") no-repeat center, linear-gradient(45deg, #420ca2, #00d8ff); background-size: cover } .banner { min-height: 260px; padding: 102px 0 90px } .banner .banner-title { color: #fff; text-align: center } .banner .banner-sections { margin-top: 16px; color: #fff; font-size: .75em; line-height: 1em; text-align: center } .banner .banner-sections .arrow-icon { fill: #fff; margin: 0 6px; position: relative; top: -1px } .banner-top-slider { padding-top: 60px } .promo-banner { min-height: 130px; background: url("../img/banners/live-play-banner.jpg") no-repeat 0 0; background-size: cover; position: relative } .promo-banner .promo-banner-img { position: absolute; top: 35px; left: 30px } .promo-banner .tag-ornament { position: absolute; bottom: 0; left: 0 } .promo-banner .promo-banner-info { position: absolute; top: 36px; left: 226px } .promo-banner .promo-banner-info .promo-banner-pre-title { color: #fff; margin-bottom: 4px } .promo-banner .promo-banner-info .promo-banner-pre-title .live-icon { margin: 0 8px; position: relative; top: -2px } .promo-banner .promo-banner-info .promo-banner-title { color: #fff; margin-bottom: 6px } .promo-banner .promo-banner-info .promo-banner-text { color: #f4f4f4; text-transform: none; font-weight: 400 } .promo-banner .countdown-arc { position: absolute; top: 24px; right: 48px } .promo-advert { width: 270px; height: 270px; border: 1px solid #dbdbdb; margin: 0 auto; position: relative } .promo-advert .promo-advert-img { width: 250px; height: 250px; position: absolute; top: 9px; left: 9px } .banner-post { display: flex; flex-flow: row wrap } .banner-post .banner-post-item { display: flex; flex-flow: row wrap; width: 50%; height: 360px } .banner-post>.banner-post-item { height: 720px } .banner-post>.banner-post-item .post-preview { width: 100% } .banner-post>.banner-post-item .post-preview.large .post-preview-overlay .post-preview-title { width: 510px } .banner-post>.banner-post-item .post-preview.big .post-preview-img { height: 360px } .banner-post>.banner-post-item .post-preview.big .post-preview-overlay .post-preview-title { width: 450px } .banner-display-separator { height: 60px; background-color: #fff } @media screen and (max-width: 1260px) { .banner-post { display: block } .banner-post .banner-post-item { display: block; width: 100% } .banner-post>.banner-post-item { height: auto } .banner-post>.banner-post-item .post-preview { width: 100% } .banner-post>.banner-post-item .post-preview.large .post-preview-img { height: 360px } .banner-post>.banner-post-item .post-preview.large .post-preview-overlay { padding: 0 30px; margin-bottom: 26px } .banner-post>.banner-post-item .post-preview.large .post-preview-overlay .post-preview-title { width: 100%; font-size: 2.25em; margin-top: 14px } .banner-post>.banner-post-item .post-preview.large .post-preview-overlay .post-preview-text { font-size: .8125em; line-height: 1.6923076923em } .banner-post>.banner-post-item .post-preview.big .post-preview-img { height: 360px } .banner-post>.banner-post-item .post-preview.big .post-preview-overlay .post-preview-title { width: 100% } } @media screen and (max-width: 960px) { .promo-banner { padding: 40px } .promo-banner .promo-banner-img, .promo-banner .promo-banner-info, .promo-banner .countdown-arc { position: static } .promo-banner .tag-ornament { top: 0; bottom: auto } .promo-banner .promo-banner-img { display: block; margin: 0 auto } .promo-banner .promo-banner-info { margin: 20px auto 0; text-align: center } .promo-banner .countdown-arc { margin: 40px auto 0 } } @media screen and (max-width: 480px) { .promo-banner .countdown-arc { width: 160px } .promo-banner .countdown-arc .counter-wrap:nth-last-child(1), .promo-banner .countdown-arc .counter-wrap:nth-last-child(2) { margin-top: 20px } } .section-title-wrap { position: relative } .section-title-wrap.blue .section-title-separator:before { background-color: #1c95f3 } .section-title-wrap.blue-light .section-title-separator:before { background-color: #10caff } .section-title-wrap.red .section-title-separator:before { background-color: #f30a5c } .section-title-wrap.green .section-title-separator:before { background-color: #58d819 } .section-title-wrap.yellow .section-title-separator:before { background-color: #ffb400 } .section-title-wrap.violet .section-title-separator:before { background-color: #7442ce } .section-title-wrap.cyan .section-title-separator:before { background-color: #00e3d0 } .section-title-wrap.negative .section-title { color: #fff } .section-title-wrap.negative .section-title-separator { background-color: #383838 } .section-title-wrap.small-space { margin-bottom: 10px } .section-title-wrap.small-space+.filter-heading { margin-top: 0 } .section-title-wrap .section-title { font-size: 1em } .section-title-wrap .section-title.medium { font-size: 1.125em } .section-title-wrap .section-title.small { font-size: .875em } .section-title-wrap .section-title-separator { width: 100%; height: 1px; margin-top: 16px; background-color: #dbdbdb; position: relative } .section-title-wrap .section-title-separator:before { content: ''; width: 70px; height: 3px; background-color: #363636; position: absolute; top: -2px; left: 0 } .section-title-wrap+.streamer-avatars { margin-top: 43px } .section-title-wrap+.widget-overflow-wrap.tournament-results { margin-top: 40px } .section-title-wrap+.widget-title-wrap { margin-top: 12px } .section-title-wrap+.post-preview-showcase, .section-title-wrap+.carousel, .section-title-wrap+.filter-heading { margin-top: 26px } .section-title-wrap+.post-comment-form, .section-title-wrap+.account-settings-form { margin-top: 30px } .section-title-wrap+.post-comment { border-top: none } .section-title-wrap+.carousel-match-result-wrap { border-top: none } .section-title-wrap+.widget-team-builds-header { margin-top: 30px } .section-title-wrap+.form-row { margin-top: 30px } .section-title-wrap .checkbox-item { position: absolute; top: 0; right: 0 } .section-title-wrap .slider-controls { position: absolute; top: -4px; right: 0 } .section-title-wrap .decorated-link { position: absolute; top: 4px; right: 0 } .section-title-wrap .dropdown-simple-wrap { position: absolute; top: 0; right: 0 } .section-title-wrap .dropdown-simple-wrap .dp-current-option .arrow-icon { margin-top: 4px } .section-bg { background: #1e1f20 url("../img/section/bg1.jpg") no-repeat center; background-size: cover } .section-slider-bg { background: #7442ce url("../img/section/bg2.jpg") no-repeat center; background-size: cover; padding: 180px 0 200px } .section-slider-bg .section-slider-title { width: 240px; padding: 6px 0 0 10px; border-left: 6px solid #363636; color: #fff } .section-slider-bg .section-slider-title.cyan { border-left-color: #00e3d0 } .section-slider-bg .section-slider-title .highlight { display: inline-block; margin-top: 4px; font-size: 46px } .section-slider-wrap { position: relative } .section-slider-wrap .video-slider-wrap { width: 100%; height: 460px; position: absolute; top: -16px; left: 300px } .video-info-slider { width: 240px; height: 240px; margin: 60px 0 30px; overflow: hidden } .video-info-slider-items .video-info-slider-item { width: 240px } .video-info-slider-items .video-info-slider-item .video-info-slider-title { color: #fff } .video-info-slider-items .video-info-slider-item .social-links { margin-top: 30px } .video-info-slider-items .video-info-slider-item .video-info-slider-text { margin-top: 18px; color: #fff } .video-slider { width: 100%; height: 100% } .video-slider-items .video-slider-item { width: 870px; height: 460px } .video-slider-items .video-slider-item iframe { width: 100%; height: 100% } @media screen and (max-width: 1260px) { .section-slider-bg { display: none } } .option-list { display: flex; flex-flow: row wrap } .option-list .option-list-item { height: 40px; padding: 0 20px; color: #bfbfbf; line-height: 40px; cursor: pointer } .option-list .option-list-item.selected { color: #363636; border-bottom: 3px solid #7442ce } .forum-actions { display: flex; flex-flow: row wrap } .forum-actions .dropdown-simple-wrap { margin-right: 10px } .forum-actions .dropdown-simple-wrap .form-wrap { width: 320px } .forum-actions>* { margin-right: 10px } .forum-actions>*:last-child { margin-right: 0 } .user-dropdown { width: 224px } .user-dropdown .user-dropdown-header { padding: 4px 0 12px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .user-dropdown .user-dropdown-header .user-dropdown-header-text { margin-top: 4px; color: #363636 } .user-dropdown .user-dropdown-header .user-dropdown-header-actions .user-dropdown-header-action { margin-right: 8px } .user-dropdown .user-dropdown-header .user-dropdown-header-actions .user-dropdown-header-action .icon-envelope, .user-dropdown .user-dropdown-header .user-dropdown-header-actions .user-dropdown-header-action .icon-settings { color: #363636; font-size: 16px; font-weight: 700 } .user-dropdown .user-dropdown-header .user-dropdown-header-actions .user-dropdown-header-action:last-child { margin-right: 0 } .user-dropdown .user-dropdown-body { padding: 20px 0 16px; border-bottom: 1px solid #dbdbdb } .user-dropdown .user-dropdown-body .notification-item { margin-bottom: 14px } .user-dropdown .user-dropdown-body .notification-item:last-child { margin-bottom: 0 } .forum-category-wrap { width: 370px; padding: 40px 0 40px 100px; position: relative } .forum-category-wrap .forum-category-img { position: absolute; top: 34px; left: 6px } .forum-category-wrap .forum-category-title { color: #363636; line-height: 1em } .forum-category-wrap .forum-category-description { margin-top: 12px } .forum-category-wrap .forum-category-subcategories { margin-top: 16px; padding: 10px 0 10px 8px; border-left: 1px solid #dbdbdb } .forum-category-wrap .forum-category-subcategories .forum-category-subcategory { margin-bottom: 14px; color: #363636 } .forum-category-wrap .forum-category-subcategories .forum-category-subcategory:last-child { margin-bottom: 0 } .forum-post-links .forum-post-link-wrap { margin-bottom: 20px } .forum-post-links .forum-post-link-wrap:last-child { margin-bottom: 0 } .forum-post-link-wrap { display: flex; flex-flow: row wrap; align-items: center } .forum-post-link { color: #363636; line-height: 18px } .forum-post-link+.forum-post-timestamp { margin: 0 0 2px 6px } .forum-post-link+.forum-post-description-preview, .forum-post-link+.forum-post-tags { margin-top: 10px } .forum-post-link.medium { font-size: .75em } .forum-post-link.pin-tag { font-size: .875em; padding-left: 34px; position: relative } .forum-post-link.pin-tag:before { content: url("../img/icons/pinned-icon.png"); margin-right: 10px; position: absolute; top: -4px; left: 0 } .forum-post-link.pin-tag:after { content: 'Pinned'; color: #1c95f3; font-size: 10px; margin-left: 8px } .forum-post-link.spoiler-tag { font-size: .75em; padding-left: 34px; position: relative } .forum-post-link.spoiler-tag:before { content: url("../img/icons/spoiler-icon.png"); margin-right: 10px; position: absolute; top: -4px; left: 0 } .forum-post-link.spoiler-tag:after { content: 'Spoilers'; color: #f30a5c; font-size: 10px; margin-left: 8px } .forum-post-timestamp { color: #8b8b8b; font-size: .75em; line-height: 1em } .forum-category-text { color: #777 } .forum-category-text:before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; border: 2px solid #363636; margin-right: 6px } .forum-category-text.blue:before { border-color: #1c95f3 } .forum-category-text.red:before { border-color: #f30a5c } .forum-category-text.violet:before { border-color: #7442ce } .forum-category-text.green:before { border-color: #58d819 } .forum-category-text.cyan:before { border-color: #00e3d0 } .forum-category-text.yellow:before { border-color: #ffb400 } .forum-user-list { display: flex; flex-flow: row wrap } .forum-user-list>* { margin-right: 8px } .forum-user-list>*:last-child { margin-right: 0 } .forum-post-tags { display: flex; flex-flow: row wrap } .forum-post-tags>* { margin-right: 6px } .forum-post-tags>*:last-child { margin-right: 0 } .forum-tag-button { height: 24px; padding: 0 12px; border-radius: 200px; background-color: #363636; color: #fff; font-size: .625em; line-height: 24px } .forum-tag-button.red { background-color: #f30a5c } .forum-tag-button.cyan { background-color: #00e3d0 } .topic-wrap { position: relative } .topic-wrap .topic-scroll-wrap { position: absolute; top: 0; left: 1030px } .topic-wrap .topic-scroll-wrap .topic-scroll-date-start, .topic-wrap .topic-scroll-wrap .topic-scroll-date-end, .topic-wrap .topic-scroll-wrap .topic-scroll-date-current { color: #8b8b8b; font-size: .75em; line-height: 1em } .topic-wrap .topic-scroll-wrap .topic-action { margin-top: 22px } .topic-wrap .topic-scroll-wrap .topic-scroll { height: 220px; padding-left: 20px; margin: 14px 0; border-left: 1px solid #dbdbdb; position: relative } .topic-wrap .topic-scroll-wrap .topic-scroll .topic-scroll-info { -o-transform: translate(0, 46px); -moz-transform: translate(0, 46px); -ms-transform: translate(0, 46px); -webkit-transform: translate(0, 46px); transform: translate(0, 46px); position: relative } .topic-wrap .topic-scroll-wrap .topic-scroll .topic-scroll-info:before { content: ''; display: block; width: 3px; height: 40px; border-radius: 200px; background-color: #1c95f3; position: absolute; top: 3px; left: -22px } .topic-wrap .topic-scroll-wrap .topic-scroll .topic-scroll-info .topic-scroll-counter { color: #363636; line-height: 1em } .topic-wrap .topic-scroll-wrap .topic-scroll .topic-scroll-info .topic-scroll-date-current { margin-top: 6px } .topic-wrap .topic-header { width: 83% } .topic-wrap .topic-header .topic-title { color: #363636; line-height: 28px } .topic-wrap .topic-header .forum-category-text { margin-top: 16px } .topic-wrap .topic-header .topic-info { margin-top: 16px; padding: 24px 16px 0; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; align-items: center } .topic-wrap .topic-header .topic-info>* { margin: 0 50px 24px 0 } .topic-wrap .topic-header .topic-info>*:last-child { margin-right: 0 } .topic-wrap .topic-body { width: 83% } .topic-wrap .topic-body .topic-comment { display: grid; grid-template-columns: 15% 85% } .topic-wrap .topic-footer { padding: 60px 0 30px; border-bottom: 1px solid #dbdbdb } .topic-wrap .topic-footer .topic-footer-info { display: flex; flex-flow: row wrap; align-items: center } .topic-wrap .topic-footer .topic-footer-info .topic-footer-icon { margin-right: 10px } .topic-wrap .topic-footer .topic-footer-info .topic-footer-text { color: #363636 } .topic-wrap .topic-footer .topic-footer-actions { display: flex; flex-flow: row wrap; margin-top: 60px } .topic-wrap .topic-footer .topic-footer-actions .button { padding: 0 50px 0 30px; margin: 0 8px 30px 0 } .topic-wrap .topic-footer .topic-footer-actions .button .action-icon { margin-right: 12px; font-size: 14px; position: relative; top: 2px } .topic-wrap .topic-footer .topic-footer-actions .button:last-child { margin-right: 0 } .topic-comment { padding-top: 36px; border-bottom: 1px solid #dbdbdb } .topic-comment .topic-comment-user { width: 80px; margin-left: 20px } .topic-comment .topic-comment-user .topic-comment-user-text { margin-top: 12px; color: #363636; text-align: center } .topic-comment .topic-comment-user .badge-list { margin: 14px auto 0 } .topic-comment .topic-comment-content { padding: 12px 0 40px } .topic-comment .topic-comment-content .topic-comment-content-header { display: flex; flex-flow: row wrap; justify-content: space-between } .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-username { color: #363636; line-height: 1em } .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-info { display: flex; flex-flow: row wrap } .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-info .topic-comment-reply-user { position: relative; top: -6px } .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-info .topic-comment-timestamp { color: #8b8b8b; font-size: .75em; line-height: 1em } .topic-comment .topic-comment-content .topic-comment-content-header+.topic-comment-text { margin-top: 34px } .topic-comment .topic-comment-content .topic-comment-text { margin-top: 40px; font-size: .875em; line-height: 1.8571428571em } .topic-comment .topic-comment-content .topic-comment-quote { margin-top: 36px; padding: 30px 34px; background-color: #f4f4f4; position: relative } .topic-comment .topic-comment-content .topic-comment-quote:before { content: '"'; width: 20px; height: 18px; padding-top: 2px; background-color: #f30a5c; color: #fff; text-align: center; position: absolute; top: 0; left: 0 } .topic-comment .topic-comment-content .topic-comment-quote .topic-comment-quote-user { display: flex; flex-flow: row wrap; align-items: center } .topic-comment .topic-comment-content .topic-comment-quote .topic-comment-quote-user .user-avatar { margin-right: 8px } .topic-comment .topic-comment-content .topic-comment-quote .topic-comment-quote-user .topic-comment-quote-user-name { color: #363636; line-height: 1em } .topic-comment .topic-comment-content .topic-comment-quote .topic-comment-quote-text { margin-top: 22px; font-size: .875em; line-height: 1.8571428571em } .topic-comment .topic-comment-content .widget-media-wrap { margin-top: 40px } .topic-comment .topic-comment-actions { padding: 26px 0 0; border-top: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .topic-actions { display: flex; flex-flow: row wrap } .topic-actions .topic-action { display: flex; flex-flow: row wrap; align-items: center; margin: 0 20px 26px 0 } .topic-actions .topic-action.inverted .topic-action-icon { order: 2 } .topic-actions .topic-action.inverted .topic-action-text { margin: 0 12px 0 0; order: 1 } .topic-actions .topic-action:last-child { margin-right: 0 } .topic-actions .topic-action .topic-action-text { margin: 0 0 0 12px; color: #8b8b8b; font-size: .6875em; line-height: 1em } .topic-comment-reply-user { display: flex; flex-flow: row wrap; align-items: center } .topic-comment-reply-user+.form-wrap { margin-top: 30px } .topic-comment-reply-user .topic-comment-reply-icon { margin-right: 10px; color: #dbdbdb; font-size: 14px } .topic-comment-reply-user .user-avatar { margin-right: 8px } .topic-comment-reply-user .topic-comment-reply-name { margin-right: 16px; color: #363636; line-height: 1em } .badge-list { display: flex; flex-flow: row wrap } .badge-list>* { margin: 0 10px 10px 0 } .badge-list>*:last-child { margin-right: 0 } .badge-list.small { width: 66px; justify-content: space-between } .badge-list.small>* { margin: 0 0 6px 0 } .badge-item { padding: 0 16px; position: relative } .badge-item>.badge-img { position: absolute; top: 52px; right: 57px } .badge-item.hoverable .badge-img-wrap .badge-img.unlocked { opacity: 0; visibility: hidden } .badge-item.hoverable:hover .badge-img-wrap .badge-img.locked { opacity: 0; visibility: hidden } .badge-item.hoverable:hover .badge-img-wrap .badge-img.unlocked { opacity: 1; visibility: visible } .badge-item .badge-img-wrap { height: 130px; position: relative } .badge-item .badge-img-wrap .badge-img { position: absolute; top: 0; left: 50%; margin-left: -40px; transition: all .3s ease-in-out } .badge-item .badge-item-title { color: #363636; text-align: center } .badge-item .badge-item-text { margin-top: 30px; text-align: center } .badge-item .progress-badge-wrap { width: 160px; margin: 54px auto 0 } @media screen and (max-width: 1260px) { .topic-wrap .topic-scroll-wrap { display: none } .topic-wrap .topic-header { width: 100% } .topic-wrap .topic-body { width: 100% } .topic-wrap .topic-body .topic-comment { display: block } .topic-wrap .topic-body .topic-comment .topic-comment-user { width: 100%; margin-left: 0 } .topic-wrap .topic-body .topic-comment .topic-comment-user .topic-comment-user-text { width: 80px } .topic-wrap .topic-body .topic-comment .topic-comment-user .badge-list { justify-content: flex-start } .topic-wrap .topic-body .topic-comment .topic-comment-user .badge-list>* { margin-right: 8px } .topic-wrap .topic-body .topic-comment .topic-comment-user .badge-list>*:last-child { margin-right: 0 } .topic-wrap .topic-body .topic-comment .topic-comment-user .badge-list.small { width: 100% } } @media screen and (max-width: 960px) { .topic-comment .topic-comment-content .topic-comment-content-header { display: block } .topic-comment .topic-comment-content .topic-comment-content-header .topic-comment-info { margin-top: 20px } } .profile-header { min-height: 126px; padding-bottom: 26px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .profile-header>.button { padding: 0 34px; margin-top: 26px } .profile-user { padding-left: 116px; position: relative } .profile-user .user-avatar { position: absolute; top: 0; left: 0 } .profile-user .profile-user-name { margin-top: 6px; color: #363636; line-height: 1em } .profile-user .profile-user-info { margin-top: 8px; color: #363636 } .profile-user .profile-user-info .highlight { color: #8b8b8b } .profile-user .badge-list { margin-top: 20px } .topic-link-items .topic-link-item { margin-bottom: 20px } .topic-link-items .topic-link-item:last-child { margin-bottom: 0 } .topic-link-item .topic-link-item-info { display: flex; flex-flow: row wrap } .topic-link-item .topic-link-item-info .topic-link-item-timestamp { line-height: 1em } .topic-link-item .topic-link-item-info .topic-link-item-stat { line-height: 1em } .topic-link-item .topic-link-item-info .topic-link-item-stat .like-icon, .topic-link-item .topic-link-item-info .topic-link-item-stat .dislike-icon, .topic-link-item .topic-link-item-info .topic-link-item-stat .reply-icon { margin: 0 8px 0 12px; font-size: 12px; font-weight: 700 } .topic-link-item .topic-link-item-info .topic-link-item-stat .like-icon { color: #00e3d0 } .topic-link-item .topic-link-item-info .topic-link-item-stat .dislike-icon { color: #f30a5c } .topic-link-item .topic-link-item-info .topic-link-item-stat .reply-icon { color: #1c95f3 } .topic-link-item .topic-link-item-title { margin-top: 12px; color: #363636 } .user-link-items .user-link-item { margin-bottom: 16px } .user-link-items .user-link-item:last-child { margin-bottom: 0 } .user-link-item { height: 60px; padding: 8px 0 0 76px; position: relative } .user-link-item .user-avatar { position: absolute; top: 0; left: 0 } .user-link-item .user-link-item-title { color: #363636; line-height: 1em } .user-link-item .user-link-item-stat { margin-top: 12px; line-height: 1em } .user-link-item .user-link-item-stat .like-icon, .user-link-item .user-link-item-stat .dislike-icon, .user-link-item .user-link-item-stat .reply-icon { margin-right: 8px; font-size: 12px; font-weight: 700 } .user-link-item .user-link-item-stat .like-icon { color: #00e3d0 } .user-link-item .user-link-item-stat .dislike-icon { color: #f30a5c } .user-link-item .user-link-item-stat .reply-icon { color: #1c95f3 } .activity-items .activity-item:last-child { border-bottom: 1px solid #dbdbdb } .activity-item { padding: 26px 0 30px 72px; border-top: 1px solid #dbdbdb; position: relative } .activity-item .activity-item-dropdown-button { width: 10px; height: 20px; position: absolute; top: 28px; right: 0; cursor: pointer } .activity-item .activity-item-dropdown-button .arrow-icon { -o-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg) } .activity-item>.user-avatar { position: absolute; top: 26px; left: 0 } .activity-item .activity-item-row { padding-right: 26px; display: flex; flex-flow: row wrap; justify-content: space-between } .activity-item .activity-item-row .activity-item-title { margin-top: 4px; color: #363636 } .activity-item .activity-item-row .activity-item-title .highlight.red { color: #f30a5c } .activity-item .activity-item-row .activity-item-timestamp { margin-top: 4px; color: #8b8b8b; font-size: .75em; line-height: 1em } .activity-item .forum-category-text { display: inline-block; margin-top: 10px } .activity-item .activity-item-text { margin-top: 20px } .activity-item .activity-item-text .highlight.red { color: #f30a5c } .activity-item .activity-item-stat { margin-top: 18px; display: flex; flex-flow: row wrap; align-items: center } .activity-item .activity-item-stat .like-icon, .activity-item .activity-item-stat .dislike-icon, .activity-item .activity-item-stat .reply-icon { margin-right: 8px; font-size: 12px; font-weight: 700 } .activity-item .activity-item-stat .like-icon { color: #00e3d0 } .activity-item .activity-item-stat .dislike-icon { color: #f30a5c } .activity-item .activity-item-stat .reply-icon { color: #1c95f3 } .notification-items.bordered .notification-item { border-top: 1px solid #dbdbdb } .notification-items.bordered .notification-item:last-child { border-bottom: 1px solid #dbdbdb } .notification-items.padded .notification-item { padding-top: 36px; padding-bottom: 36px } .notification-items.padded .notification-item .notification-item-icon { top: 34px } .notification-item { padding-left: 22px; position: relative } .notification-item.medium { padding-left: 40px } .notification-item.medium .notification-item-icon { left: 6px; font-size: 18px } .notification-item .notification-item-icon { color: #1c95f3; font-size: 14px; font-weight: 700; line-height: 1em; position: absolute; top: 0; left: 0 } .notification-item .notification-item-icon.read { color: #dbdbdb } .notification-item .notification-item-text { color: #8b8b8b; line-height: 14px } .notification-item .notification-item-text .highlight { color: #363636 } .more-items-loader { display: block; width: 100%; height: 38px; display: flex; flex-flow: row wrap; justify-content: center; align-items: center } .more-items-loader .square { width: 2px; height: 2px; background-color: #363636; margin-right: 4px } .more-items-loader .square:last-child { margin-right: 0 } .more-items-loader.medium { height: 124px } .more-items-loader.medium .square { width: 4px; height: 4px } .profile-messages-actions { padding-bottom: 16px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; justify-content: space-between } .profile-messages-actions .action-wrap { display: flex; flex-flow: row wrap } .profile-messages-actions .action-wrap .button { padding: 0 34px; margin-right: 8px } .profile-messages-actions .action-wrap .button:last-child { margin-right: 0 } @media screen and (max-width: 680px) { .profile-header { display: block; padding-bottom: 30px; text-align: center } .profile-header .profile-user { padding: 0 } .profile-header .profile-user .user-avatar { display: block; margin: 0 auto; position: static } .profile-header .profile-user .profile-user-name, .profile-header .profile-user .profile-user-info { text-align: center; margin-top: 12px } .profile-header .profile-user .badge-list { justify-content: center } .profile-header>.button { display: inline-block } .activity-item { padding-left: 0 } .activity-item>.user-avatar { position: static } .activity-item .activity-item-row .activity-item-title { margin-top: 10px } .activity-item .activity-item-row .activity-item-timestamp { margin-top: 10px } .activity-item .forum-category-text { margin-top: 16px } } .reviews-wrap { padding: 80px 200px } .reviews-wrap .reviews-header { position: relative } .reviews-wrap .reviews-header .reviews-header-title { color: #363636; line-height: 1em } .reviews-wrap .reviews-header .reviews-header-rating { margin-top: 20px; display: flex; flex-flow: row wrap; align-items: center } .reviews-wrap .reviews-header .reviews-header-rating .rating-ornament { padding: 0 } .reviews-wrap .reviews-header .reviews-header-rating .reviews-header-rating-text { margin-left: 10px; color: #8b8b8b; line-height: 1em } .reviews-wrap .reviews-header .button { position: absolute; top: 0; right: 0 } .reviews-wrap .reviews-header .rating-blocks { margin-top: 50px } .reviews-wrap .reviews-body { margin-top: 80px } .reviews-wrap .reviews-body .reviews-body-title { color: #363636 } .reviews-wrap .reviews-body .user-reviews { margin-top: 40px } .reviews-wrap .reviews-body .load-more-wrap { margin-top: 60px } .rating-blocks { display: flex; flex-flow: row wrap; justify-content: space-between } .rating-block .rating-block-title { margin-bottom: 60px; color: #363636; line-height: 1em } .rating-block-bars .progress-bar { margin-bottom: 40px } .rating-block-bars .progress-bar:last-child { margin-bottom: 0 } .user-reviews { border-top: 1px solid #dbdbdb } .user-reviews .user-review { border-bottom: 1px solid #dbdbdb } .user-review { min-height: 346px; padding: 46px 310px 46px 100px; position: relative } .user-review .user-avatar { position: absolute; top: 36px; left: 0 } .user-review .user-review-title { color: #363636 } .user-review .rating-ornament { padding: 0; position: absolute; top: 46px; right: 198px } .user-review .user-review-info { margin-top: 10px; color: #8b8b8b } .user-review .user-review-info .highlight { color: #363636 } .user-review .user-review-text { margin-top: 30px; font-size: .875em; line-height: 1.8571428571em } .user-review .rating-block-bars { position: absolute; top: 100px; right: 0 } .user-review .user-review-row { margin-top: 36px; display: flex; flex-flow: row wrap } .user-review .user-review-timestamp, .user-review .user-review-button { color: #8b8b8b; font-size: .6875em; line-height: 1em } .user-review .user-review-button { margin-left: 16px } .user-review .user-review-button:hover { color: #f30a5c } .specifications-wrap { padding: 80px 200px } .inventory-open .inventory-checkout-button { display: flex; flex-flow: row wrap; justify-content: flex-end; margin-top: 60px } .inventory-open-header { height: 40px; margin-bottom: 32px; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap } .inventory-open-header .inventory-open-header-title { color: #363636; line-height: 40px } .inventory-open-header .inventory-open-header-title:first-child { width: 400px } .inventory-open-header.no-space { margin-bottom: 0 } .inventory-open-body { display: flex; flex-flow: row wrap; justify-content: space-between; padding-bottom: 32px; border-bottom: 1px solid #dbdbdb } .inventory-open-row { display: flex; flex-flow: row wrap; justify-content: space-between } .inventory-open-row .inventory-open-actions { width: 900px } .inventory-open-row .inventory-open-totals { width: 270px } .inventory-open-action { height: 76px; display: flex; flex-flow: row wrap; align-items: center; border-bottom: 1px solid #dbdbdb } .inventory-open-action.medium { height: 82px } .inventory-open-action>.button { margin-left: 16px } .inventory-open-action>.button:first-child { margin-left: 0 } .inventory-open-action .inventory-open-row-text { color: #363636 } .inventory-open-action .inventory-open-row-text .amount { margin-left: 45px; font-family: "Roboto", sans-serif; font-size: 14px } .inventory-open-action .inventory-open-row-text .amount .currency { margin-right: 4px } .inventory-open-action .form-item { width: 635px; margin-left: 14px; display: flex; flex-flow: row wrap } .inventory-open-action .form-item.multiple-items input[type="text"] { width: 160px } .inventory-open-action .form-item.multiple-items .select-block { width: 220px } .inventory-open-action .form-item>* { margin-left: 16px } .inventory-open-action .form-item>*:first-child { margin-left: 0 } .inventory-open-total { height: 76px; display: flex; flex-flow: row wrap; justify-content: flex-end; align-items: center; border-bottom: 1px solid #dbdbdb } .inventory-open-total.small { height: 64px } .inventory-open-total.medium { height: 82px } .inventory-open-total .inventory-open-row-text { color: #363636 } .inventory-open-total .inventory-open-row-text .amount { margin-left: 45px; font-family: "Roboto", sans-serif; font-size: 14px } .inventory-open-total .inventory-open-row-text .amount .currency { margin-right: 4px } .information-header { padding: 16px 0; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; text-align: center } .information-header .information-header-title { color: #363636 } .information-header .information-header-title a { color: #7442ce } .information-header .information-header-text { margin-top: 6px; color: #8b8b8b; font-size: .625em; line-height: 1em } .payment-methods .payment-method { border-bottom: 1px solid #dbdbdb } .payment-method { padding-top: 32px } .payment-method .radio-item { margin-bottom: 28px } .payment-method .radio-item .rl-label { font-size: .75em; padding-top: 0 } .payment-method .payment-method-content { padding: 0 26px 26px } .order-result-banner .order-result-banner-img { width: 358px; height: 256px; margin: 0 auto } .order-result-banner .order-result-banner-title { margin-top: 50px; color: #363636; line-height: 58px; text-align: center } .order-result-banner .order-result-banner-text { margin-top: 20px; color: #8b8b8b; text-align: center } .order-result-banner .order-result-banner-text .highlight { color: #363636 } .wishlist-items { padding-bottom: 32px; border-bottom: 1px solid #dbdbdb } .wishlist-item-preview { width: 170px; height: 170px; border: 1px solid #dbdbdb; background-color: #f9f9f9; display: flex; flex-flow: row wrap; justify-content: center; align-items: center } .wishlist-item-preview .wishlist-icon { color: #dbdbdb; font-size: 30px } .inventory-compare-wrap { height: 916px; position: relative; overflow: auto hidden } .inventory-compare-wrap .inventory-compare { position: absolute; top: 0; left: 0 } .inventory-compare { display: flex; flex-flow: row nowrap } .inventory-compare .inventory-compare-title { color: #363636 } .inventory-compare .inventory-compare-title.medium { font-size: .75em } .inventory-compare .inventory-compare-title.v2 { font-family: "Roboto", sans-serif; font-size: .875em } .inventory-compare .inventory-compare-title.v2 .currency { margin-right: 4px } .inventory-compare .inventory-compare-title.v2 .before { margin-right: 6px; color: #8b8b8b; font-size: 12px; font-weight: 400; position: relative } .inventory-compare .inventory-compare-title.v2 .before:before { content: ''; width: 100%; height: 1px; background: #8b8b8b; position: absolute; bottom: 6px; left: 0 } .inventory-compare .inventory-compare-title.light { color: #8b8b8b } .inventory-compare .inventory-compare-title.violet { color: #7442ce } .inventory-compare .inventory-compare-title.red { color: #f30a5c } .inventory-compare .rating-ornament { padding: 0 } .inventory-compare .counter { width: 120px } .inventory-compare-header-item { width: 90px; height: 42px; padding-top: 16px; border-bottom: 1px solid #dbdbdb } .inventory-compare-header-item.medium { height: 70px } .inventory-compare-header-item.big { height: 154px } .inventory-compare-header-item.large { height: 280px } .inventory-compare-body { display: flex; flex-flow: row nowrap } .inventory-compare-item { width: 270px; border-left: 1px solid #dbdbdb } .inventory-compare-item .inventory-compare-item-row { height: 42px; padding: 0 16px; border-bottom: 1px solid #dbdbdb; display: flex; flex-flow: row wrap; align-items: center } .inventory-compare-item .inventory-compare-item-row.medium { height: 70px } .inventory-compare-item .inventory-compare-item-row.big { height: 154px } .inventory-compare-item .inventory-compare-item-row.large { height: 280px } .inventory-compare-item .inventory-compare-item-row.centered { justify-content: center } .inventory-compare-item .inventory-compare-item-row .inventory-compare-img { width: 236px; height: 246px } @media screen and (max-width: 1260px) { .reviews-wrap { padding: 80px 0 } .reviews-wrap .reviews-header .button { position: static; margin-top: 20px } .reviews-wrap .reviews-header .rating-blocks { justify-content: flex-start } .reviews-wrap .reviews-header .rating-blocks .rating-block:first-child { margin-right: 40px } .specifications-wrap { padding: 80px 0 } .inventory-open .inventory-open-header .inventory-open-header-title:first-child { width: 100% } .inventory-open .inventory-open-header .inventory-open-header-title:nth-child(2) { display: none } .inventory-open .inventory-open-body { display: block } .inventory-open .inventory-open-body .inventory-items-preview { margin: 0 auto } .inventory-open-row { display: block } .inventory-open-row .inventory-open-actions { width: 100% } .inventory-open-row .inventory-open-totals { width: 100% } .inventory-open-total, .inventory-open-action { height: auto; padding: 20px 0 } .inventory-open-action { display: block } .inventory-open-action .form-item { width: 100%; margin: 16px 0 } .inventory-open-action .form-item.multiple-items input[type="text"] { width: 100% } .inventory-open-action .form-item.multiple-items .select-block { width: 100% } .inventory-open-action .form-item>* { margin: 0 0 16px 0 } .inventory-open-action .form-item>*:last-child { margin-bottom: 0 } .inventory-open-action .form-item+.button { margin-left: 0 } } @media screen and (max-width: 960px) { .reviews-wrap .reviews-header .rating-blocks { display: block } .reviews-wrap .reviews-header .rating-blocks .rating-block:first-child { margin: 0 0 40px 0 } .user-review { padding: 46px 0 } .user-review .user-avatar { position: static; margin-bottom: 20px } .user-review .rating-ornament { position: static; margin-top: 4px } .user-review .rating-block-bars { position: static; margin-top: 60px } } @media screen and (max-width: 680px) { .order-result-banner .order-result-banner-img { width: 268.5px; height: 192px } .order-result-banner .order-result-banner-title { font-size: 2.5em } } .contact-info-preview.negative .contact-info-preview-text { color: #b8b8b8 } .contact-info-preview.negative .contact-info-preview-text .highlighted { color: #fff } .contact-info-preview.negative .contact-info-preview-sign .contact-info-preview-sign-text { color: #fff } .contact-info-preview.negative .contact-info-preview-email-wrap .contact-info-preview-email { color: #fff } .contact-info-preview .contact-info-preview-text { font-size: .75em; line-height: 1.8333333333em } .contact-info-preview .contact-info-preview-sign { height: 50px; margin-top: 22px; padding: 12px 80px 0 62px; position: relative } .contact-info-preview .contact-info-preview-sign .bubble-ornament { position: absolute; top: 0; left: 0 } .contact-info-preview .contact-info-preview-form { margin-top: 20px } .contact-info-preview .contact-info-preview-email-wrap { margin-top: 24px; padding: 1px 0 0 56px; position: relative } .contact-info-preview .contact-info-preview-email-wrap .email-icon { color: #58d819; font-size: 24px; position: absolute; top: 0; left: 12px } .contact-info-preview .contact-info-preview-email-wrap .contact-info-preview-email { display: inline-block } .footer-top-wrap { background-color: #252627 } .footer-top-brand { padding: 40px 0 40px; display: flex; flex-flow: row wrap; justify-content: space-between } .footer-top-brand .logo { margin-top: 34px } .footer-top-brand .social-links { margin-top: 40px } .footer-top-widgets { padding: 60px 0 70px } .footer-top-widget .post-preview-showcase, .footer-top-widget .product-preview-showcase { margin-top: 26px } .footer-top-widget .link-section .link-list { margin-top: 22px } .footer-top-widget .contact-info-preview { margin-top: 22px } .footer-top-widget .tweets-preview-widget { margin-top: 23px } .footer-top-widget .tweets-preview-widget .loader { border-bottom-color: #8b8b8b; border-right-color: #8b8b8b; border-left-color: #8b8b8b } .footer-bottom-wrap { background-color: #1e1f20 } .footer-bottom { min-height: 70px; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center } .footer-bottom .footer-bottom-text { color: #b8b8b8; font-size: .75em } .footer-bottom .footer-bottom-text a { color: #b8b8b8 } .footer-bottom .footer-bottom-text .brand { color: #fff } .footer-bottom .footer-bottom-text .brand .highlighted { color: #1c95f3 } .footer-bottom .footer-bottom-text .separator { margin: 0 8px } @media screen and (max-width: 1260px) { .footer-top-brand { flex-direction: column; align-items: center } .footer-top-brand .sponsors-slider-wrap { order: 2; margin-top: 30px } } @media screen and (max-width: 680px) { .footer-bottom { min-height: 100px; flex-direction: column; justify-content: space-evenly } .footer-bottom .footer-bottom-text:first-child { order: 1 } } .information-box { width: 100%; height: 60px; padding: 0 26px 0 70px; border: 1px solid #dbdbdb; border-radius: 200px; position: relative; display: flex; flex-flow: row wrap; justify-content: space-between } .information-box.alert .information-box-icon { background-color: #1c95f3 } .information-box.alert .information-box-message .highlight { color: #1c95f3 } .information-box.error .information-box-icon { background-color: #f30a5c } .information-box.error .information-box-message .highlight { color: #f30a5c } .information-box.success .information-box-icon { background-color: #00e3d0 } .information-box.success .information-box-message .highlight { color: #00e3d0 } .information-box .information-box-icon { width: 48px; height: 48px; border-radius: 50%; background-color: #363636; position: absolute; top: 6px; left: 6px } .information-box .information-box-icon .check-icon, .information-box .information-box-icon .cross-cb-icon, .information-box .information-box-icon .exclamation-icon { fill: #fff; position: absolute } .information-box .information-box-icon .check-icon { top: 16px; left: 15px } .information-box .information-box-icon .cross-cb-icon { top: 16px; left: 16px } .information-box .information-box-icon .exclamation-icon { top: 14px; left: 21px } .information-box .information-box-message, .information-box .information-box-action { line-height: 60px } .information-box .information-box-message { color: #363636 } .information-box .information-box-action { color: #1c95f3 } @media screen and (max-width: 1260px) { .information-box { display: block; height: auto; padding: 45px 40px 30px; border-radius: 24px } .information-box .information-box-icon { top: -24px; left: 50%; margin-left: -24px } .information-box .information-box-message, .information-box .information-box-action { display: block; text-align: center } .information-box .information-box-message { line-height: 16px } .information-box .information-box-action { margin-top: 20px; line-height: 1em } } .shortcode-section { margin-bottom: 76px } .shortcode-section:last-child { margin-bottom: 0 } .shortcode-section .shortcode-section-title { margin-bottom: 36px; color: #363636 } .shortcode-section .shortcode-section-title.bottom-space { margin-bottom: 16px } .shortcode-section .shortcode-section-items { display: flex; flex-flow: row wrap; justify-content: space-around } .shortcode-section .shortcode-section-items.between { justify-content: space-between } .shortcode-section .shortcode-section-items .shortcode-color, .shortcode-section .shortcode-section-items .button, .shortcode-section .shortcode-section-items .shortcode-font, .shortcode-section .shortcode-section-items .information-box { margin-top: 20px } .shortcode-section .shortcode-section-items .shortcode-form { margin-top: 40px } .shortcode-color { width: 90px; height: 90px; border-radius: 50%; padding: 14px 0 0 14px } .shortcode-color.color-black-lighter { background-color: #363636 } .shortcode-color.color-gray-dark { background-color: #777 } .shortcode-color.color-gray { background-color: #8b8b8b } .shortcode-color.color-white-darker { background-color: #dbdbdb } .shortcode-color.color-violet { background-color: #7442ce } .shortcode-color.color-blue { background-color: #1c95f3 } .shortcode-color.color-cyan { background-color: #00e3d0 } .shortcode-color.color-green { background-color: #58d819 } .shortcode-color.color-yellow { background-color: #ffb400 } .shortcode-color.color-red { background-color: #f30a5c } .shortcode-color .shortcode-color-code { width: 62px; height: 62px; border-radius: 50%; background-color: #fff; color: #363636; line-height: 62px; text-align: center } .shortcode-font.extrabold .shortcode-font-demo, .shortcode-font.extrabold .shortcode-font-family, .shortcode-font.extrabold .shortcode-font-weight { font-weight: 800 } .shortcode-font.bold .shortcode-font-demo, .shortcode-font.bold .shortcode-font-family, .shortcode-font.bold .shortcode-font-weight { font-weight: 700 } .shortcode-font.regular .shortcode-font-demo, .shortcode-font.regular .shortcode-font-family, .shortcode-font.regular .shortcode-font-weight { font-weight: 400 } .shortcode-font.medium .shortcode-font-demo, .shortcode-font.medium .shortcode-font-family, .shortcode-font.medium .shortcode-font-weight { font-weight: 500 } .shortcode-font.roboto .shortcode-font-demo, .shortcode-font.roboto .shortcode-font-family, .shortcode-font.roboto .shortcode-font-weight { font-family: "Roboto", sans-serif; text-transform: none } .shortcode-font .shortcode-font-demo { color: #363636; font-size: 6.875em; text-transform: none } .shortcode-font .shortcode-font-family { margin-top: 16px; color: #363636 } .shortcode-font .shortcode-font-weight { color: #8b8b8b } .shortcode-form { width: 270px } .shortcode-form.medium { width: 570px } .shortcode-form .check-radio-items { display: flex; flex-flow: row wrap; justify-content: space-between } .shortcode-form .check-item-list, .shortcode-form .radio-item-list { margin-top: 36px } @media screen and (max-width: 1260px) { .shortcode-section .shortcode-section-items .information-box { margin-top: 44px } .shortcode-section .shortcode-section-items .information-box:first-child { margin-top: 20px } } /*# sourceMappingURL=style.min.css.map */