@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@400;600&family=Newsreader:wght@400;700&display=swap'); /* Sneak peek — reduce overlap so truncated content stays visible above the paywall box. The plugin default (-120px) buries short snippets completely; -60px leaves enough room. */ .iteras-paywall-box { margin-top: -60px !important; } .iteras-paywall-box .iteras-fade-bar { height: 60px; } .iteras-box-content { padding: 40px 20px 50px; text-align: center; } .sl-paywall-box { max-width: 560px; margin: 0 auto; } .sl-paywall-box::before { content: "\1F512"; display: block; font-size: 32px; margin-bottom: 16px; } .sl-paywall-box h2, .sl-paywall-box h3 { font-family: 'Newsreader', serif; font-size: 28px; line-height: 1.2; color: #000000; margin: 0 0 16px; } .sl-paywall-box p { font-family: 'Figtree', sans-serif; font-size: 16px; line-height: 1.6; color: #333333; margin: 0 0 28px; } .sl-paywall-box .sl-paywall-btn { display: inline-block; background-color: #7A0017; color: #ffffff; font-family: 'Newsreader', serif; font-weight: 700; font-size: 18px; line-height: 18px; padding: 19px 50px 15px; border-radius: 4px; text-decoration: none; margin-top: 28px; margin-bottom: 28px; } .sl-paywall-box .sl-paywall-btn:hover { background-color: #5e0012; color: #ffffff; } .sl-paywall-login-link { margin: 8px 0 0; font-family: 'Figtree', sans-serif; font-size: 14px; color: #666666; } .sl-paywall-box .sl-paywall-login-link a { color: #7A0017; text-decoration: underline; } .sl-paywall-box .sl-paywall-login-link a:hover { color: #5e0012; } .sl-paywall-box iframe { width: 100%; border: none; display: block; } .sl-paywall-forms { margin-top: 8px; } .sl-paywall-signup-wrap, .sl-paywall-login-wrap { margin: 0 auto; } .sl-paywall-login-toggle { margin: 0; font-family: 'Figtree', sans-serif; font-size: 14px; color: #666666; } .sl-paywall-box .sl-paywall-login-toggle a { color: #7A0017; text-decoration: underline; } .sl-paywall-box .sl-paywall-login-toggle a:hover { color: #5e0012; } .sl-paywall-login-wrap { margin-top: 24px; } .sl-paywall-forms [hidden] { display: none !important; } .sl-iteras-login-toggle .sl-iteras-login, .sl-iteras-login-toggle .sl-iteras-logout { display: none; } .sl-iteras-login-toggle[data-state="in"] .sl-iteras-logout, .sl-iteras-login-toggle[data-state="out"] .sl-iteras-login { display: inline; } /* Linkki seuraa ympäröivän tekstin väriä (Elementor-headerin tekstiväri) sen sijaan että käyttäisi teeman -oletusta (joka voi olla valkoinen). !important tarvitaan koska Elementorin/teeman a-selektoreilla on korkeampi spesifisyys tai ne ladataan tämän jälkeen. */ .sl-iteras-login-toggle a { color: inherit !important; text-decoration: none; } .sl-iteras-login-toggle a:hover, .sl-iteras-login-toggle a:focus { text-decoration: underline; opacity: 0.8; } /* Header-valikon menu-itemit Iteras-kirjautumistilan mukaan. Piilotettu kunnes JS resolvoi . display: revert palauttaa Elementorin/WP:n kaskaadin mukaisen näyttötavan (list-item / flex / inline-block jne.) ilman että sitä tarvitsee arvata. */ .sl-iteras-login, .sl-iteras-logout { display: none !important; } html[data-iteras-state="out"] .sl-iteras-login { display: revert !important; } html[data-iteras-state="in"] .sl-iteras-logout { display: revert !important; } @media (max-width: 767px) { .iteras-box-content { padding: 30px 16px 40px; } .sl-paywall-box h2, .sl-paywall-box h3 { font-size: 24px; } .sl-paywall-box .sl-paywall-btn { font-size: 16px; padding: 16px 36px 13px; } /* Piilota [sl-iteras-login-toggle] kokonaan mobiilissa: sekä toggle-span että ympäröivä Elementor-widget, jotta widgetin marginit eivät jätä tyhjää tilaa headeriin. */ .sl-iteras-login-toggle, .elementor-widget-shortcode:has(.sl-iteras-login-toggle) { display: none !important; } }