/* * Varcelona 1.8.6 — top refresh. * This file intentionally touches only the global header and the homepage block * rendered before the normal article loop. */ :root { --vc-top-bg: #030914; --vc-top-panel: #0b1827; --vc-top-panel-2: #101f30; --vc-top-border: rgba(139, 160, 188, .24); --vc-top-red: #d0004b; --vc-top-gold: #e8b83f; --vc-top-cream: #f7e6c5; } /* ========================= GLOBAL HEADER — DESKTOP ========================= */ @media (min-width: 1101px) { html body .vc-global-header { min-height: 90px !important; height: 90px !important; background: linear-gradient(90deg, rgba(165, 0, 68, .035), transparent 30%, transparent 72%, rgba(0, 77, 152, .04)), rgba(3, 9, 20, .985) !important; box-shadow: 0 10px 34px rgba(0, 0, 0, .28) !important; } html body .vc-global-header::after { height: 1px !important; background: rgba(208, 0, 75, .82) !important; } html body .vc-global-header__shell { display: grid !important; width: min(1490px, calc(100% - 40px)) !important; max-width: none !important; min-height: 89px !important; height: 89px !important; margin: 0 auto !important; padding: 0 !important; grid-template-columns: 270px minmax(0, 1fr) 126px !important; align-items: center !important; gap: 26px !important; } html body .vc-global-header__brand, html body .vc-global-header__brand .blog-over-site-branding { min-width: 0 !important; height: 89px !important; align-items: center !important; } html body .vc-global-header__brand .custom-logo-link { display: flex !important; height: 64px !important; align-items: center !important; line-height: 0 !important; } html body .vc-global-header__brand .custom-logo { width: auto !important; height: 60px !important; max-width: 255px !important; max-height: 60px !important; object-fit: contain !important; object-position: left center !important; } html body .vc-global-header__nav { display: flex !important; min-width: 0 !important; height: 89px !important; align-items: center !important; justify-content: center !important; justify-self: stretch !important; gap: clamp(15px, 1.4vw, 24px) !important; overflow: visible !important; white-space: nowrap !important; } html body .vc-global-header__nav .blog-over-primary-menu-container { display: block !important; min-width: 0 !important; width: auto !important; } html body .vc-global-header__nav ul, html body .vc-global-header__nav .menu, html body .vc-global-header__nav .nav-menu { display: flex !important; width: auto !important; margin: 0 !important; padding: 0 !important; align-items: center !important; justify-content: center !important; gap: clamp(14px, 1.35vw, 23px) !important; flex-wrap: nowrap !important; white-space: nowrap !important; } html body .vc-global-header__nav li { flex: 0 0 auto !important; } html body .vc-global-header__nav a { min-height: 42px !important; padding: 14px 0 12px !important; align-items: center !important; font-size: 14px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .014em !important; white-space: nowrap !important; } html body .vc-global-header__nav a::after { bottom: 5px !important; } html body .vc-global-header__nav .vc-real-nav-link, html body .vc-global-header__nav a[href*="real-madryt"], html body .vc-global-header__nav a[href*="real-madrid"], html body .vc-global-header__nav a[href*="po-bialej-stronie"] { position: relative !important; display: inline-flex !important; flex: 0 0 auto !important; margin: 0 !important; padding: 14px 0 12px 11px !important; align-items: center !important; color: #efc660 !important; text-decoration: none !important; text-transform: uppercase !important; } html body .vc-global-header__nav .vc-real-nav-link--standalone::before, html body .vc-global-header__nav .vc-real-nav-link__spark { content: ""; position: absolute; top: 50%; left: 0; width: 8px; height: 5px; background: linear-gradient(135deg, transparent 50%, #efc660 51%); transform: translateY(-52%); } html body .vc-global-header__nav .vc-real-nav-link::after, html body .vc-global-header__nav a[href*="real-madryt"]::after, html body .vc-global-header__nav a[href*="real-madrid"]::after, html body .vc-global-header__nav a[href*="po-bialej-stronie"]::after { right: 0 !important; left: 0 !important; background: #efc660 !important; } html body .vc-global-header__actions { display: flex !important; min-width: 126px !important; height: 89px !important; align-items: center !important; justify-content: flex-end !important; justify-self: end !important; gap: 9px !important; } /* The mockup uses compact icon controls. Account/language stay available from the mobile drawer, so the desktop bar remains one clean line. */ html body .vc-global-header__actions > .varcelona-language-switcher, html body .vc-global-header__account { display: none !important; } html body .vc-global-header__search, html body .vc-global-header__mobile-toggle, html body .vc-global-header__mobile-toggle .blog-over-mobile-toggle, html body .vc-global-header__mobile-toggle button { display: inline-flex !important; width: 40px !important; min-width: 40px !important; height: 40px !important; min-height: 40px !important; margin: 0 !important; padding: 0 !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(255, 255, 255, .13) !important; border-radius: 8px !important; background: rgba(4, 10, 21, .72) !important; color: #fff !important; box-shadow: none !important; } html body .vc-global-header__mobile-toggle { flex: 0 0 40px !important; } html body .vc-global-header__search:hover, html body .vc-global-header__mobile-toggle button:hover { border-color: rgba(239, 198, 96, .55) !important; color: #efc660 !important; } } @media (min-width: 1101px) and (max-width: 1360px) { html body .vc-global-header__shell { width: calc(100% - 28px) !important; grid-template-columns: 228px minmax(0, 1fr) 96px !important; gap: 16px !important; } html body .vc-global-header__brand .custom-logo { height: 54px !important; max-width: 218px !important; max-height: 54px !important; } html body .vc-global-header__nav { gap: 12px !important; } html body .vc-global-header__nav ul, html body .vc-global-header__nav .menu, html body .vc-global-header__nav .nav-menu { gap: 13px !important; } html body .vc-global-header__nav a, html body .vc-global-header__nav .vc-real-nav-link { font-size: 13px !important; font-weight: 900 !important; } } /* ========================= HOMEPAGE TOP ========================= */ body.varcelona-home .vc-dashboard--top-refresh { display: block !important; min-height: 0 !important; margin: 0 !important; padding: 20px 20px 6px !important; box-sizing: border-box !important; } body.varcelona-home .vc-shell--top-refresh { display: block !important; width: min(1420px, 100%) !important; max-width: 1420px !important; min-height: 0 !important; margin: 0 auto !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; } body.varcelona-home .vc-top-news-heading { display: flex !important; min-height: 28px !important; margin: 0 0 14px !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important; } body.varcelona-home .vc-top-news-heading h2, body.varcelona-home .vc-upcoming > h2 { margin: 0 !important; color: var(--vc-top-red) !important; font-size: clamp(22px, 1.8vw, 28px) !important; font-style: normal !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: -.015em !important; text-transform: uppercase !important; } body.varcelona-home .vc-top-news-heading > a, body.varcelona-home .vc-white-side__heading > a { display: inline-flex !important; align-items: center !important; gap: 10px !important; font-size: 12px !important; font-weight: 900 !important; letter-spacing: .035em !important; text-decoration: none !important; text-transform: uppercase !important; white-space: nowrap !important; } body.varcelona-home .vc-top-news-heading > a { color: var(--vc-top-red) !important; } body.varcelona-home .vc-news-grid--top-strip { display: grid !important; height: 324px !important; min-height: 0 !important; grid-template-columns: minmax(0, 2.12fr) repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news { position: relative !important; min-width: 0 !important; min-height: 0 !important; overflow: hidden !important; border: 1px solid rgba(151, 175, 205, .24) !important; border-radius: 9px !important; background: #07111f !important; box-shadow: none !important; isolation: isolate !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead { border-color: rgba(208, 0, 75, .72) !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__image, body.varcelona-home .vc-news-grid--top-strip .vc-news__image img { position: absolute !important; inset: 0 !important; display: block !important; width: 100% !important; height: 100% !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__image img { object-fit: cover !important; object-position: center 22% !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead .vc-news__image img { object-position: center 18% !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__shade { position: absolute !important; z-index: 1 !important; inset: 0 !important; background: linear-gradient(180deg, rgba(3, 10, 20, .02) 24%, rgba(3, 10, 20, .96) 100%) !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead .vc-news__shade { background: linear-gradient(90deg, rgba(3, 10, 20, .15) 0%, rgba(3, 10, 20, .05) 48%, rgba(3, 10, 20, .22) 100%), linear-gradient(180deg, rgba(3, 10, 20, .02) 23%, rgba(3, 10, 20, .96) 100%) !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__content { position: absolute !important; z-index: 2 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; padding: 15px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead .vc-news__content { padding: 16px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__eyebrow { display: flex !important; margin-bottom: 10px !important; align-items: center !important; gap: 11px !important; color: #e4e7ed !important; font-size: 12px !important; font-weight: 700 !important; text-transform: none !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__eyebrow span { padding: 5px 8px !important; border-radius: 4px !important; background: var(--vc-top-red) !important; color: #fff !important; font-size: 11px !important; font-weight: 900 !important; text-transform: uppercase !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead h1 { max-width: 84% !important; margin: 0 !important; color: #fff !important; font-size: clamp(25px, 2vw, 32px) !important; font-style: normal !important; font-weight: 900 !important; line-height: 1.06 !important; letter-spacing: -.015em !important; text-transform: uppercase !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead p { max-width: 78% !important; margin: 10px 0 0 !important; color: #d7dce4 !important; font-size: 13.5px !important; line-height: 1.45 !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--small h2 { margin: 0 !important; color: #fff !important; font-size: clamp(17px, 1.35vw, 21px) !important; font-style: normal !important; font-weight: 900 !important; line-height: 1.08 !important; letter-spacing: -.012em !important; text-transform: uppercase !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__time { position: absolute !important; z-index: 3 !important; top: 14px !important; left: 14px !important; color: rgba(255, 255, 255, .76) !important; font-size: 11px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__footer { display: flex !important; min-height: 20px !important; margin-top: 12px !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__category { min-width: 0 !important; overflow: hidden !important; color: var(--vc-top-red) !important; font-size: 11px !important; font-weight: 800 !important; line-height: 1 !important; text-overflow: ellipsis !important; text-transform: uppercase !important; white-space: nowrap !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news__comments, body.varcelona-home .vc-real-card footer span:last-child { display: inline-flex !important; flex: 0 0 auto !important; align-items: center !important; gap: 6px !important; } /* ========================= PO BIAŁEJ STRONIE ========================= */ body.varcelona-home .vc-white-side { margin-top: 20px !important; padding: 13px 14px 14px !important; overflow: hidden !important; border: 1px solid rgba(232, 184, 63, .9) !important; border-radius: 9px !important; background: radial-gradient(circle at 42% 10%, rgba(232, 184, 63, .055), transparent 32%), linear-gradient(135deg, rgba(9, 20, 36, .98), rgba(4, 12, 24, .99)) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .015) !important; } body.varcelona-home .vc-white-side__heading { display: flex !important; min-height: 48px !important; margin-bottom: 10px !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important; } body.varcelona-home .vc-white-side__brand { display: flex !important; min-width: 0 !important; align-items: center !important; gap: 12px !important; } body.varcelona-home .vc-white-side__mark { display: inline-flex !important; width: 42px !important; height: 42px !important; flex: 0 0 42px !important; align-items: center !important; justify-content: center !important; border: 2px solid #e8b83f !important; border-radius: 50% !important; background: #f8f5ea !important; color: #0a2852 !important; font-size: 19px !important; box-shadow: 0 0 0 3px rgba(232, 184, 63, .08) !important; } body.varcelona-home .vc-white-side__brand h2 { margin: 0 !important; color: #fff !important; font-size: 25px !important; font-style: normal !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: -.01em !important; text-transform: uppercase !important; } body.varcelona-home .vc-white-side__brand p { margin: 4px 0 0 !important; color: #e8b83f !important; font-size: 10px !important; font-weight: 800 !important; line-height: 1 !important; letter-spacing: .035em !important; text-transform: uppercase !important; } body.varcelona-home .vc-white-side__heading > a { color: #e8b83f !important; } body.varcelona-home .vc-white-side__grid { display: grid !important; height: auto !important; min-height: 258px !important; align-items: stretch !important; grid-template-columns: minmax(0, 2.25fr) minmax(280px, 1.35fr) minmax(250px, .95fr) !important; gap: 12px !important; } body.varcelona-home .vc-real-card { position: relative !important; min-width: 0 !important; min-height: 100% !important; overflow: hidden !important; border: 1px solid rgba(232, 184, 63, .55) !important; border-radius: 7px !important; background: #f2f2ef !important; color: #07111f !important; } body.varcelona-home .vc-real-card--lead { min-height: 258px !important; } body.varcelona-home .vc-real-card a { color: inherit !important; text-decoration: none !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image { position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; width: 58% !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image::after { content: "" !important; position: absolute !important; inset: 0 !important; background: linear-gradient(90deg, #f2f2ef 0%, rgba(242, 242, 239, .92) 9%, rgba(242, 242, 239, .2) 38%, transparent 64%) !important; pointer-events: none !important; } body.varcelona-home .vc-real-card__image img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image img { object-position: center 20% !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__content { position: relative !important; z-index: 2 !important; display: flex !important; width: 53% !important; min-height: 258px !important; height: auto !important; padding: 20px 18px 16px !important; box-sizing: border-box !important; flex-direction: column !important; justify-content: flex-start !important; } body.varcelona-home .vc-real-card__meta { display: flex !important; align-items: center !important; gap: 10px !important; color: #2c3441 !important; font-size: 11px !important; } body.varcelona-home .vc-real-card__meta > span { padding: 5px 8px !important; border-radius: 4px !important; background: #d7aa42 !important; color: #fff !important; font-size: 10px !important; font-weight: 900 !important; letter-spacing: .025em !important; } body.varcelona-home .vc-real-card--lead h3 { max-width: 360px !important; margin: 14px 0 0 !important; color: #0c1727 !important; font-size: clamp(22px, 1.7vw, 28px) !important; font-weight: 900 !important; line-height: 1.15 !important; letter-spacing: -.018em !important; text-transform: uppercase !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 4 !important; overflow: hidden !important; } body.varcelona-home .vc-real-card--lead p { max-width: 300px !important; margin: 12px 0 0 !important; color: #303a49 !important; font-size: 12.5px !important; line-height: 1.55 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 3 !important; overflow: hidden !important; flex: 0 0 auto !important; } body.varcelona-home .vc-real-card footer { display: flex !important; margin-top: auto !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; color: #b08a32 !important; font-size: 10px !important; font-weight: 800 !important; text-transform: uppercase !important; } body.varcelona-home .vc-white-side__mini-stack { display: grid !important; min-width: 0 !important; grid-template-rows: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; } body.varcelona-home .vc-real-card--mini { display: grid !important; min-height: 0 !important; grid-template-columns: 35% minmax(0, 1fr) !important; } body.varcelona-home .vc-real-card--mini .vc-real-card__image { position: relative !important; min-width: 0 !important; height: 100% !important; } body.varcelona-home .vc-real-card--mini .vc-real-card__content { display: flex !important; min-width: 0 !important; padding: 10px 12px !important; flex-direction: column !important; } body.varcelona-home .vc-real-card--mini .vc-real-card__meta { gap: 7px !important; font-size: 9.5px !important; } body.varcelona-home .vc-real-card--mini .vc-real-card__meta > span { padding: 4px 6px !important; font-size: 9px !important; } body.varcelona-home .vc-real-card--mini h3 { display: -webkit-box !important; margin: 8px 0 0 !important; overflow: hidden !important; color: #0c1727 !important; font-size: 15px !important; font-weight: 900 !important; line-height: 1.12 !important; letter-spacing: -.012em !important; text-transform: uppercase !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 3 !important; } body.varcelona-home .vc-real-card--mini footer { font-size: 9px !important; } body.varcelona-home .vc-white-side__shortcuts { display: flex !important; min-width: 0 !important; overflow: hidden !important; border: 1px solid rgba(232, 184, 63, .55) !important; border-radius: 7px !important; background: #f1f1ef !important; flex-direction: column !important; } body.varcelona-home .vc-white-side__shortcuts h3 { margin: 0 !important; padding: 12px 16px !important; background: #0b1626 !important; color: #e8b83f !important; font-size: 12px !important; font-weight: 900 !important; text-transform: uppercase !important; } body.varcelona-home .vc-white-side__shortcuts > a { display: flex !important; min-height: 35px !important; padding: 0 14px !important; align-items: center !important; gap: 12px !important; border-top: 1px solid rgba(10, 24, 42, .12) !important; color: #121b28 !important; font-size: 11px !important; font-weight: 700 !important; text-decoration: none !important; text-transform: uppercase !important; } body.varcelona-home .vc-white-side__shortcuts > a:first-of-type { border-top: 0 !important; } body.varcelona-home .vc-white-side__shortcuts > a i { width: 18px !important; color: #1a2636 !important; font-size: 14px !important; text-align: center !important; } body.varcelona-home .vc-white-side__shortcuts > a:hover { background: #fff !important; color: #b2852c !important; } /* ========================= UPCOMING MATCHES STRIP ========================= */ body.varcelona-home .vc-upcoming { margin-top: 22px !important; } body.varcelona-home .vc-upcoming > h2 { margin-bottom: 12px !important; } body.varcelona-home .vc-upcoming__grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(250px, .9fr) !important; gap: 10px !important; } body.varcelona-home .vc-upcoming-card, body.varcelona-home .vc-upcoming__all { min-height: 105px !important; border: 1px solid rgba(151, 175, 205, .18) !important; border-radius: 7px !important; background: rgba(8, 19, 34, .82) !important; text-decoration: none !important; } body.varcelona-home .vc-upcoming-card { display: flex !important; padding: 9px 12px 10px !important; box-sizing: border-box !important; flex-direction: column !important; color: #fff !important; } body.varcelona-home .vc-upcoming-card:hover { border-color: rgba(232, 184, 63, .46) !important; } body.varcelona-home .vc-upcoming-card__competition { margin-bottom: 4px !important; color: #a8b1bf !important; font-size: 10px !important; text-align: center !important; } body.varcelona-home .vc-upcoming-card__teams { display: grid !important; flex: 1 1 auto !important; grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr) !important; align-items: center !important; gap: 6px !important; } body.varcelona-home .vc-upcoming-team { display: flex !important; min-width: 0 !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 5px !important; text-align: center !important; } body.varcelona-home .vc-upcoming-team__badge { display: inline-flex !important; width: 38px !important; height: 38px !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(255, 255, 255, .18) !important; border-radius: 50% !important; background: #132134 !important; color: #dce3ed !important; font-size: 9px !important; font-weight: 900 !important; letter-spacing: .03em !important; } body.varcelona-home .vc-upcoming-team__badge.is-barca { border-color: rgba(237, 187, 0, .65) !important; background: linear-gradient(90deg, #a50044 0 50%, #004d98 50% 100%) !important; color: #fff !important; } body.varcelona-home .vc-upcoming-team strong { display: -webkit-box !important; max-width: 110px !important; overflow: hidden !important; color: #fff !important; font-size: 10px !important; line-height: 1.1 !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; } body.varcelona-home .vc-upcoming-card__date { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 4px !important; color: #fff !important; } body.varcelona-home .vc-upcoming-card__date b { font-size: 15px !important; line-height: 1 !important; } body.varcelona-home .vc-upcoming-card__date span { color: #d7dce4 !important; font-size: 12px !important; } body.varcelona-home .vc-upcoming__all { display: flex !important; align-items: center !important; justify-content: center !important; gap: 16px !important; border-color: rgba(208, 0, 75, .8) !important; color: var(--vc-top-red) !important; font-size: 13px !important; font-weight: 900 !important; letter-spacing: .02em !important; text-align: center !important; text-transform: uppercase !important; } body.varcelona-home .vc-upcoming__all:hover { background: rgba(208, 0, 75, .08) !important; } /* ========================= RESPONSIVE TOP ONLY ========================= */ @media (max-width: 1180px) { body.varcelona-home .vc-news-grid--top-strip { height: 310px !important; grid-template-columns: minmax(0, 1.85fr) repeat(3, minmax(0, 1fr)) !important; } body.varcelona-home .vc-white-side__grid { height: auto !important; grid-template-columns: minmax(0, 1.65fr) minmax(280px, 1fr) !important; } body.varcelona-home .vc-white-side__shortcuts { grid-column: 1 / -1 !important; display: grid !important; grid-template-columns: repeat(3, 1fr) !important; } body.varcelona-home .vc-white-side__shortcuts h3 { grid-column: 1 / -1 !important; } body.varcelona-home .vc-upcoming__grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } body.varcelona-home .vc-upcoming__all { min-height: 72px !important; grid-column: 1 / -1 !important; } } @media (max-width: 980px) { body.varcelona-home .vc-dashboard--top-refresh { padding: 16px 14px 6px !important; } body.varcelona-home .vc-news-grid--top-strip { height: auto !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news { min-height: 280px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead { min-height: 380px !important; grid-column: 1 / -1 !important; } body.varcelona-home .vc-white-side__grid { grid-template-columns: 1fr !important; } body.varcelona-home .vc-real-card--lead { min-height: 250px !important; } body.varcelona-home .vc-white-side__mini-stack { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; grid-template-rows: none !important; } body.varcelona-home .vc-real-card--mini { min-height: 128px !important; } body.varcelona-home .vc-white-side__shortcuts { grid-template-columns: repeat(2, 1fr) !important; } body.varcelona-home .vc-upcoming__grid { grid-template-columns: 1fr 1fr !important; } body.varcelona-home .vc-upcoming__all { grid-column: auto !important; } } @media (max-width: 640px) { body.varcelona-home .vc-dashboard--top-refresh { padding: 12px 10px 6px !important; } body.varcelona-home .vc-top-news-heading, body.varcelona-home .vc-white-side__heading { gap: 10px !important; } body.varcelona-home .vc-top-news-heading h2, body.varcelona-home .vc-upcoming > h2 { font-size: 19px !important; } body.varcelona-home .vc-top-news-heading > a, body.varcelona-home .vc-white-side__heading > a { font-size: 9px !important; } body.varcelona-home .vc-news-grid--top-strip { grid-template-columns: 1fr !important; gap: 10px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news, body.varcelona-home .vc-news-grid--top-strip .vc-news--lead { min-height: 275px !important; grid-column: auto !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead { min-height: 360px !important; } body.varcelona-home .vc-news-grid--top-strip .vc-news--lead h1, body.varcelona-home .vc-news-grid--top-strip .vc-news--lead p { max-width: 100% !important; } body.varcelona-home .vc-white-side { padding: 11px !important; } body.varcelona-home .vc-white-side__brand h2 { font-size: 19px !important; } body.varcelona-home .vc-white-side__brand p { display: none !important; } body.varcelona-home .vc-white-side__mark { width: 36px !important; height: 36px !important; flex-basis: 36px !important; } body.varcelona-home .vc-real-card--lead { min-height: 320px !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image { width: 100% !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image::after { background: linear-gradient(180deg, rgba(242, 242, 239, .08) 0%, rgba(242, 242, 239, .98) 62%) !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__content { justify-content: flex-end !important; width: 100% !important; padding: 16px !important; } body.varcelona-home .vc-real-card--lead h3 { max-width: 100% !important; font-size: 23px !important; } body.varcelona-home .vc-real-card--lead p { display: none !important; } body.varcelona-home .vc-white-side__mini-stack, body.varcelona-home .vc-white-side__shortcuts, body.varcelona-home .vc-upcoming__grid { grid-template-columns: 1fr !important; } body.varcelona-home .vc-real-card--mini { min-height: 132px !important; } body.varcelona-home .vc-white-side__shortcuts h3 { grid-column: auto !important; } body.varcelona-home .vc-upcoming__all { min-height: 78px !important; } } /* ========================= NAV DRAWER — 1.7.9 ========================= */ html body .vc-global-header__mobile-toggle .vc-drawer-toggle { display: inline-flex !important; width: 40px !important; min-width: 40px !important; height: 40px !important; min-height: 40px !important; margin: 0 !important; padding: 0 !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(255, 255, 255, .13) !important; border-radius: 8px !important; background: rgba(4, 10, 21, .72) !important; color: #fff !important; box-shadow: none !important; cursor: pointer !important; } html body .vc-global-header__mobile-toggle .vc-drawer-toggle:hover { border-color: rgba(239, 198, 96, .55) !important; color: #efc660 !important; } html body .blog-over-mobile-menu { position: fixed !important; z-index: 2147483001 !important; top: 0 !important; right: 0 !important; bottom: auto !important; left: auto !important; display: flex !important; width: min(390px, 92vw) !important; max-width: 390px !important; height: 100vh !important; height: 100dvh !important; margin: 0 !important; padding: 78px 26px 28px !important; flex-direction: column !important; overflow-x: hidden !important; overflow-y: auto !important; border: 0 !important; border-left: 1px solid rgba(232, 184, 63, .28) !important; border-radius: 0 !important; background: radial-gradient(circle at 100% 0%, rgba(0, 77, 152, .16), transparent 34%), linear-gradient(180deg, #07111f 0%, #040a13 100%) !important; color: #fff !important; box-shadow: -22px 0 60px rgba(0, 0, 0, .48) !important; opacity: 1 !important; visibility: hidden !important; pointer-events: none !important; transform: translate3d(104%, 0, 0) !important; transition: transform .24s ease, visibility 0s linear .24s !important; } html body.vc-nav-drawer-open .blog-over-mobile-menu { visibility: visible !important; pointer-events: auto !important; transform: translate3d(0, 0, 0) !important; transition: transform .24s ease, visibility 0s linear 0s !important; } html body .vc-nav-drawer-overlay { position: fixed !important; z-index: 2147483000 !important; inset: 0 !important; display: block !important; background: rgba(0, 4, 10, .68) !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; transition: opacity .2s ease, visibility 0s linear .2s !important; backdrop-filter: blur(1.5px); } html body.vc-nav-drawer-open .vc-nav-drawer-overlay { opacity: 1 !important; visibility: visible !important; pointer-events: auto !important; transition: opacity .2s ease, visibility 0s linear 0s !important; } html body.vc-nav-drawer-open { overflow: hidden !important; } html body .blog-over-mobile-menu .blog-over-mobile-close { position: absolute !important; top: 22px !important; right: 22px !important; display: inline-flex !important; width: 42px !important; height: 42px !important; margin: 0 !important; padding: 0 !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(255, 255, 255, .14) !important; border-radius: 8px !important; background: rgba(255, 255, 255, .035) !important; color: #fff !important; font-size: 28px !important; line-height: 1 !important; cursor: pointer !important; } html body .blog-over-mobile-menu .blog-over-mobile-close:hover { border-color: rgba(232, 184, 63, .58) !important; color: #efc660 !important; } html body .blog-over-mobile-menu ul, html body .blog-over-mobile-menu .menu, html body .blog-over-mobile-menu .nav-menu { display: flex !important; width: 100% !important; margin: 0 !important; padding: 0 !important; flex-direction: column !important; gap: 0 !important; list-style: none !important; } html body .blog-over-mobile-menu li { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, .075) !important; } html body .blog-over-mobile-menu li a, html body .blog-over-mobile-menu .vc-mobile-real-link { display: flex !important; width: 100% !important; min-height: 49px !important; margin: 0 !important; padding: 13px 4px !important; align-items: center !important; gap: 10px !important; color: rgba(255, 255, 255, .92) !important; background: transparent !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.25 !important; letter-spacing: .02em !important; text-decoration: none !important; text-transform: uppercase !important; } html body .blog-over-mobile-menu li a:hover { color: #efc660 !important; } html body .blog-over-mobile-menu .vc-mobile-real-link { margin-top: 10px !important; border-top: 1px solid rgba(232, 184, 63, .35) !important; border-bottom: 1px solid rgba(232, 184, 63, .35) !important; color: #efc660 !important; } html body .blog-over-mobile-menu .vc-mobile-real-link span { font-size: 8px !important; } html body .blog-over-mobile-menu .vc-mobile-account-actions { display: grid !important; width: 100% !important; margin-top: auto !important; padding-top: 24px !important; gap: 10px !important; } html body .blog-over-mobile-menu .vc-mobile-account-actions .varcelona-language-switcher { display: flex !important; margin: 0 0 6px !important; } html body .blog-over-mobile-menu .vc-mobile-account-actions > a { display: flex !important; min-height: 44px !important; padding: 11px 13px !important; align-items: center !important; gap: 10px !important; border: 1px solid rgba(255, 255, 255, .10) !important; border-radius: 7px !important; color: rgba(255, 255, 255, .9) !important; background: rgba(255, 255, 255, .025) !important; text-decoration: none !important; } html body .blog-over-mobile-menu .vc-mobile-account-actions > a:hover { border-color: rgba(232, 184, 63, .42) !important; color: #efc660 !important; } body.admin-bar .blog-over-mobile-menu, body.admin-bar .vc-nav-drawer-overlay { top: 32px !important; height: calc(100dvh - 32px) !important; } @media (max-width: 782px) { body.admin-bar .blog-over-mobile-menu, body.admin-bar .vc-nav-drawer-overlay { top: 46px !important; height: calc(100dvh - 46px) !important; } } /* ========================= DESKTOP ACCOUNT CONTROLS — 1.8.6 Restore the familiar PL/EN + search + account + logout row on wide screens. The hamburger drawer remains available on narrower layouts/mobile only. ========================= */ @media (min-width: 1280px) { html body .vc-global-header__shell { grid-template-columns: 250px minmax(0, 1fr) auto !important; gap: 20px !important; } html body .vc-global-header__actions { display: flex !important; width: auto !important; min-width: 0 !important; height: 89px !important; align-items: center !important; justify-content: flex-end !important; justify-self: end !important; gap: 9px !important; flex-wrap: nowrap !important; white-space: nowrap !important; } html body .vc-global-header__actions > .varcelona-language-switcher { display: inline-flex !important; min-height: 34px !important; height: 34px !important; margin: 0 !important; padding: 2px !important; align-items: center !important; flex: 0 0 auto !important; border: 1px solid rgba(255,255,255,.14) !important; border-radius: 8px !important; background: rgba(2,10,20,.62) !important; } html body .vc-global-header__actions .varcelona-language-option { display: inline-flex !important; min-width: 29px !important; height: 28px !important; padding: 0 6px !important; align-items: center !important; justify-content: center !important; border-radius: 6px !important; font-size: 11px !important; font-weight: 800 !important; line-height: 1 !important; } html body .vc-global-header__search { display: inline-flex !important; width: 40px !important; min-width: 40px !important; height: 40px !important; min-height: 40px !important; margin: 0 !important; padding: 0 !important; align-items: center !important; justify-content: center !important; flex: 0 0 40px !important; border: 1px solid rgba(255,255,255,.13) !important; border-radius: 50% !important; background: rgba(255,255,255,.055) !important; color: rgba(255,255,255,.9) !important; box-shadow: none !important; font-size: 16px !important; } html body .vc-global-header__account { display: flex !important; align-items: center !important; gap: 8px !important; flex: 0 0 auto !important; } html body .vc-global-header__login, html body .vc-global-header__register { display: inline-flex !important; min-height: 40px !important; height: 40px !important; margin: 0 !important; padding: 0 12px !important; align-items: center !important; justify-content: center !important; gap: 7px !important; border-radius: 7px !important; color: #fff !important; font-size: 11px !important; font-weight: 900 !important; line-height: 1 !important; text-decoration: none !important; text-transform: uppercase !important; white-space: nowrap !important; } html body .vc-global-header__login { border: 1px solid transparent !important; background: transparent !important; } html body .vc-global-header__login:hover { border-color: rgba(255,255,255,.14) !important; background: rgba(255,255,255,.045) !important; } html body .vc-global-header__register { border: 1px solid rgba(255,255,255,.08) !important; background: linear-gradient(135deg, #d1004d, #a50044) !important; box-shadow: 0 8px 22px rgba(165,0,68,.24) !important; } html body .vc-global-header__register:hover { background: linear-gradient(135deg, #e00054, #b8004b) !important; } html body .vc-global-header__mobile-toggle, html body .vc-global-header__mobile-toggle .vc-drawer-toggle, html body .vc-global-header__mobile-toggle .blog-over-mobile-toggle, html body .vc-global-header__mobile-toggle button { display: none !important; } } /* ========================= UPCOMING MATCHES REDESIGN — 1.8.6 ========================= */ body.varcelona-home .vc-upcoming { margin-top: 28px !important; } body.varcelona-home .vc-upcoming > h2 { margin: 0 0 16px !important; font-size: clamp(24px, 2vw, 36px) !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .01em !important; text-transform: uppercase !important; } body.varcelona-home .vc-upcoming__grid { gap: 14px !important; align-items: stretch !important; } body.varcelona-home .vc-upcoming-card, body.varcelona-home .vc-upcoming__all { min-height: 144px !important; border-radius: 12px !important; box-shadow: 0 10px 24px rgba(0, 0, 0, .22) !important; transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease !important; } body.varcelona-home .vc-upcoming-card { position: relative !important; overflow: hidden !important; padding: 14px 16px 16px !important; border-color: rgba(151, 175, 205, .22) !important; background: linear-gradient(180deg, rgba(11, 27, 46, .96), rgba(7, 18, 31, .98)) !important; } body.varcelona-home .vc-upcoming-card::before { content: "" !important; position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: 3px !important; background: linear-gradient(90deg, rgba(237, 187, 0, .95), rgba(208, 0, 75, .9)) !important; } body.varcelona-home .vc-upcoming-card:hover, body.varcelona-home .vc-upcoming__all:hover { transform: translateY(-3px) !important; box-shadow: 0 16px 30px rgba(0, 0, 0, .28) !important; } body.varcelona-home .vc-upcoming-card:hover { border-color: rgba(237, 187, 0, .42) !important; } body.varcelona-home .vc-upcoming-card__competition { margin-bottom: 10px !important; color: var(--vc-gold) !important; font-size: 10.5px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; text-align: center !important; } body.varcelona-home .vc-upcoming-card__teams { grid-template-columns: minmax(0, 1fr) 82px minmax(0, 1fr) !important; gap: 12px !important; } body.varcelona-home .vc-upcoming-team { gap: 8px !important; } body.varcelona-home .vc-upcoming-team__badge { display: grid !important; width: 60px !important; height: 60px !important; padding: 6px !important; place-items: center !important; overflow: hidden !important; border: 1px solid rgba(255, 255, 255, .72) !important; border-radius: 14px !important; background: #fff !important; box-shadow: 0 7px 18px rgba(0,0,0,.3), inset 0 0 0 1px rgba(10,27,47,.08) !important; color: #fff !important; font-size: 11px !important; line-height: 1 !important; } body.varcelona-home .vc-upcoming-team__badge img { display: block !important; width: 100% !important; height: 100% !important; margin: 0 !important; object-fit: contain !important; filter: drop-shadow(0 2px 2px rgba(0,0,0,.18)) !important; } body.varcelona-home .vc-upcoming-team__badge.is-fallback { border-color: rgba(237,187,0,.5) !important; background: linear-gradient(145deg, #1c3a63, #10233e) !important; font-weight: 900 !important; letter-spacing: .04em !important; } body.varcelona-home .vc-upcoming-team strong { max-width: 126px !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1.2 !important; } body.varcelona-home .vc-upcoming-card__date { min-height: 68px !important; padding: 10px 8px !important; border: 1px solid rgba(255, 255, 255, .09) !important; border-radius: 10px !important; background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important; } body.varcelona-home .vc-upcoming-card__date b { font-size: 20px !important; font-weight: 900 !important; letter-spacing: -.02em !important; } body.varcelona-home .vc-upcoming-card__date span { color: #dfe5ee !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .04em !important; } body.varcelona-home .vc-upcoming__all { padding: 18px 22px !important; border-color: rgba(208, 0, 75, .72) !important; background: linear-gradient(180deg, rgba(10, 23, 40, .96), rgba(8, 19, 34, .98)) !important; color: #fff !important; font-size: 14px !important; letter-spacing: .05em !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03), 0 10px 24px rgba(0,0,0,.22) !important; } body.varcelona-home .vc-upcoming__all i { color: var(--vc-top-red) !important; font-size: 15px !important; } body.varcelona-home .vc-upcoming__all:hover { border-color: rgba(208, 0, 75, .96) !important; background: linear-gradient(180deg, rgba(18, 31, 48, .98), rgba(10, 24, 40, .98)) !important; } @media (max-width: 1180px) { body.varcelona-home .vc-upcoming__grid { gap: 12px !important; } body.varcelona-home .vc-upcoming__all { min-height: 88px !important; } } @media (max-width: 980px) { body.varcelona-home .vc-upcoming > h2 { margin-bottom: 14px !important; font-size: 24px !important; } body.varcelona-home .vc-upcoming__grid { grid-template-columns: 1fr 1fr !important; } body.varcelona-home .vc-upcoming__all { grid-column: 1 / -1 !important; min-height: 80px !important; } } @media (max-width: 640px) { body.varcelona-home .vc-upcoming > h2 { margin-bottom: 12px !important; font-size: 21px !important; } body.varcelona-home .vc-upcoming__grid { grid-template-columns: 1fr !important; } body.varcelona-home .vc-upcoming-card, body.varcelona-home .vc-upcoming__all { min-height: 112px !important; } body.varcelona-home .vc-upcoming-card { padding: 13px 14px 14px !important; } body.varcelona-home .vc-upcoming-card__teams { grid-template-columns: minmax(0, 1fr) 76px minmax(0, 1fr) !important; gap: 10px !important; } body.varcelona-home .vc-upcoming-team strong { max-width: 105px !important; font-size: 11px !important; } body.varcelona-home .vc-upcoming-card__date { min-height: 62px !important; padding: 8px 6px !important; } body.varcelona-home .vc-upcoming-card__date b { font-size: 18px !important; } body.varcelona-home .vc-upcoming-card__date span { font-size: 10px !important; } body.varcelona-home .vc-upcoming__all { justify-content: center !important; font-size: 13px !important; } } /* ========================= MOBILE REAL SECTION FIX — 1.8.6 ========================= */ @media (max-width: 768px) { body.varcelona-home .vc-white-side { padding: 12px !important; border-radius: 12px !important; } body.varcelona-home .vc-white-side__heading { min-height: 0 !important; margin-bottom: 12px !important; gap: 12px !important; align-items: center !important; } body.varcelona-home .vc-white-side__heading > a { flex: 0 0 auto !important; font-size: 11px !important; white-space: nowrap !important; } body.varcelona-home .vc-white-side__grid { height: auto !important; grid-template-columns: 1fr !important; gap: 12px !important; } body.varcelona-home .vc-real-card, body.varcelona-home .vc-white-side__shortcuts { border-radius: 12px !important; } body.varcelona-home .vc-real-card--lead { min-height: 260px !important; background: #091523 !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__image::after { background: linear-gradient(180deg, rgba(7, 18, 31, .08) 0%, rgba(7, 18, 31, .48) 26%, rgba(7, 18, 31, .92) 72%, rgba(7, 18, 31, .98) 100%) !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__content { width: 100% !important; height: 100% !important; padding: 14px 14px 12px !important; justify-content: flex-end !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__meta, body.varcelona-home .vc-real-card--lead .vc-real-card__meta time { color: rgba(255,255,255,.86) !important; } body.varcelona-home .vc-real-card--lead h3 { max-width: 100% !important; margin-top: 12px !important; color: #fff !important; font-size: clamp(18px, 5.7vw, 31px) !important; line-height: 1.08 !important; text-shadow: 0 2px 10px rgba(0,0,0,.3) !important; } body.varcelona-home .vc-real-card--lead p { display: none !important; } body.varcelona-home .vc-real-card--lead footer { margin-top: 12px !important; color: #e8b83f !important; } body.varcelona-home .vc-real-card--lead footer span:last-child { color: #f2f2ef !important; } body.varcelona-home .vc-white-side__mini-stack { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; } body.varcelona-home .vc-real-card--mini { min-height: 118px !important; grid-template-columns: 34% minmax(0, 1fr) !important; } body.varcelona-home .vc-real-card--mini .vc-real-card__content { padding: 10px 12px !important; } body.varcelona-home .vc-real-card--mini h3 { font-size: 13px !important; -webkit-line-clamp: 3 !important; } body.varcelona-home .vc-real-card--mini footer { margin-top: auto !important; } body.varcelona-home .vc-white-side__shortcuts { display: grid !important; grid-template-columns: 1fr 1fr !important; } body.varcelona-home .vc-white-side__shortcuts h3 { grid-column: 1 / -1 !important; } body.varcelona-home .vc-white-side__shortcuts > a { min-height: 42px !important; padding: 0 12px !important; font-size: 10px !important; } } @media (max-width: 480px) { body.varcelona-home .vc-white-side__brand { gap: 10px !important; } body.varcelona-home .vc-white-side__brand h2 { font-size: 17px !important; } body.varcelona-home .vc-white-side__heading > a { font-size: 10px !important; } body.varcelona-home .vc-real-card--lead { min-height: 232px !important; } body.varcelona-home .vc-real-card--lead .vc-real-card__content { padding: 13px 13px 11px !important; } body.varcelona-home .vc-real-card--lead h3 { font-size: 17px !important; } body.varcelona-home .vc-real-card--mini { min-height: 110px !important; grid-template-columns: 36% minmax(0, 1fr) !important; } body.varcelona-home .vc-real-card--mini .vc-real-card__meta { font-size: 9px !important; } body.varcelona-home .vc-real-card--mini h3 { font-size: 12px !important; } body.varcelona-home .vc-white-side__shortcuts { grid-template-columns: 1fr !important; } } /* ========================= MOBILE NAV DRAWER HARD FIX — 1.11.0 Prevent parent-theme desktop menu rules from leaking into the mobile drawer. ========================= */ @media (max-width: 900px) { html body .blog-over-mobile-menu { width: 360px !important; max-width: calc(100vw - 28px) !important; min-width: 0 !important; padding: 74px 18px calc(22px + env(safe-area-inset-bottom, 0px)) !important; box-sizing: border-box !important; overflow-x: hidden !important; overscroll-behavior: contain !important; } html body .blog-over-mobile-menu .blog-over-primary-menu-container, html body .blog-over-mobile-menu .menu-primary-container, html body .blog-over-mobile-menu nav, html body .blog-over-mobile-menu .main-navigation { display: block !important; position: static !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; transform: none !important; overflow: visible !important; } html body .blog-over-mobile-menu ul, html body .blog-over-mobile-menu .menu, html body .blog-over-mobile-menu .nav-menu { display: block !important; position: static !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; transform: none !important; columns: auto !important; column-count: 1 !important; } html body .blog-over-mobile-menu li, html body .blog-over-mobile-menu .menu-item { display: block !important; position: relative !important; float: none !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; inset: auto !important; transform: none !important; text-align: left !important; } html body .blog-over-mobile-menu li > a, html body .blog-over-mobile-menu .menu-item > a { display: flex !important; position: static !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 50px !important; margin: 0 !important; padding: 13px 8px !important; align-items: center !important; justify-content: flex-start !important; box-sizing: border-box !important; transform: none !important; white-space: normal !important; overflow-wrap: anywhere !important; text-align: left !important; } /* Keep nested desktop dropdowns from escaping horizontally. */ html body .blog-over-mobile-menu li ul, html body .blog-over-mobile-menu .sub-menu { position: static !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; margin: 0 !important; padding: 0 0 0 12px !important; transform: none !important; box-shadow: none !important; } html body .blog-over-mobile-menu .vc-mobile-account-actions { width: 100% !important; min-width: 0 !important; } } /* Dual upcoming: one Barca + one Real + their fixtures */ body.varcelona-home .vc-upcoming__grid--dual { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 14px !important; align-items: stretch !important; } body.varcelona-home .vc-upcoming-block { display: flex !important; min-width: 0 !important; flex-direction: column !important; gap: 10px !important; } body.varcelona-home .vc-upcoming-block__club { display: block !important; color: rgba(255,255,255,.72) !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; } body.varcelona-home .vc-upcoming-block.is-real .vc-upcoming-block__club { color: #e8b83f !important; } body.varcelona-home .vc-upcoming-block.is-barca .vc-upcoming-block__club { color: #ff4b7d !important; } /* 1.17.4 — the site header scrolls normally and the drawer has its own icon. */ html body .vc-global-header, html body.admin-bar .vc-global-header { position: relative !important; top: auto !important; } html body .vc-global-header__mobile-toggle .vc-drawer-toggle::before { content: "" !important; display: block !important; width: 20px !important; height: 14px !important; border: 0 !important; border-radius: 1px !important; background: linear-gradient( to bottom, currentColor 0 2px, transparent 2px 6px, currentColor 6px 8px, transparent 8px 12px, currentColor 12px 14px ) !important; box-shadow: none !important; transform: none !important; } html body .vc-global-header__mobile-toggle .vc-drawer-toggle::after { content: none !important; } /* 1.17.5 — language tiles use their national flags. */ html body .varcelona-language-option--en, html body .varcelona-language-option--pl { color: #fff !important; opacity: .72; text-shadow: 0 1px 3px rgba(0, 0, 0, .95), 0 0 2px rgba(0, 0, 0, .9) !important; transition: opacity .18s ease, filter .18s ease, box-shadow .18s ease !important; } html body .varcelona-language-option--en { background-image: linear-gradient(rgba(1, 9, 20, .3), rgba(1, 9, 20, .3)), url('../images/flag-gb.svg') !important; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } html body .varcelona-language-option--pl { background-image: linear-gradient(rgba(1, 9, 20, .2), rgba(1, 9, 20, .2)), url('../images/flag-pl.svg') !important; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } html body .varcelona-language-option--en:hover, html body .varcelona-language-option--en:focus-visible, html body .varcelona-language-option--pl:hover, html body .varcelona-language-option--pl:focus-visible, html body .varcelona-language-option--en.is-active, html body .varcelona-language-option--pl.is-active { color: #fff !important; opacity: 1; filter: saturate(1.12) brightness(1.06); box-shadow: 0 0 0 1px rgba(255, 255, 255, .42), 0 3px 10px rgba(0, 0, 0, .3) !important; } body.varcelona-home .vc-upcoming-block .vc-upcoming-card, body.varcelona-home .vc-upcoming-block .vc-upcoming__all { width: 100% !important; } body.varcelona-home .vc-upcoming-block .vc-upcoming__all { justify-content: center !important; min-height: 48px !important; } @media (max-width: 900px) { body.varcelona-home .vc-upcoming__grid--dual { grid-template-columns: 1fr !important; } }