Bleea

baneris

LEEA baneri – visi varianti body{ margin:0; padding:24px; font-family:system-ui,Arial,sans-serif; background:#f6f9fc; } h1{font-size:20px; margin:20px 0} .grid{ display:grid; gap:20px; grid-template-columns:repeat(auto-fit,minmax(400px,1fr)); justify-items:center; } /* Pamata izmērs visiem */ .banner{ width:400px; height:200px; border-radius:14px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; overflow:hidden; position:relative; } .banner h2{ margin:0; font-size:20px; font-weight:700; } .logo{ width:120px; height:auto; } /* Numurs katram banerim */ .tag{ position:absolute; top:8px; left:8px; background:#fff; color:#111; font-size:12px; font-weight:600; padding:2px 8px; border-radius:8px; border:1px solid #ddd; opacity:0.9; } /* Animācijas */ @keyframes blink { 0%,100%{opacity:1} 50%{opacity:.15} } @keyframes pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.08)} } @keyframes floatY { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} } @keyframes typing { from{width:0} to{width:100%} } @keyframes caret { 0%,100%{border-color:transparent} 50%{border-color:#0072bc} } @keyframes fadeIn {from{opacity:0} to{opacity:1}} @keyframes slideIn {from{transform:translateY(40px);opacity:0} to{transform:translateY(0);opacity:1}} @keyframes zoomIn {from{transform:scale(1.2);opacity:.3} to{transform:scale(1);opacity:1}} @keyframes flash {0%,100%{opacity:1} 50%{opacity:.2}} /* ---------- 5 varianti bez fona ---------- */ .basic{ background:#fff; border:1px solid #ddd; } .v1 .logo{ animation:blink 1.2s infinite; } .v1 h2{ color:#0072bc; } .v2 h2{ color:#0072bc; animation:blink 1.5s infinite; } .v3 .logo{ animation:pulse 1.6s infinite; } .v3{ border:2px solid #0072bc; } .v4 .logo{ animation:blink 1.2s infinite; } .v4 h2{ color:#005b99; animation:floatY 3s ease-in-out infinite; } .v5 .logo{ animation:blink 1.4s infinite; } .v5 h2{ display:inline-block; white-space:nowrap; overflow:hidden; border-right:3px solid #0072bc; color:#0072bc; animation:typing 3s steps(28,end) 0.2s 1 both, caret .8s step-end infinite; max-width:100%; } /* ---------- 4 varianti ar fonu ---------- */ .with-bg{ background:url("https://leea.lv/images/logo500.jpg") center/cover no-repeat; color:#fff; } .overlay{ position:absolute; inset:0; background:rgba(0,0,0,.55); display:flex; justify-content:center; align-items:center; padding:20px; } .bg1 h2{ animation:fadeIn 2s ease-in-out infinite alternate; } .bg2 h2{ animation:slideIn 2s ease-in-out infinite alternate; } .bg3{ animation:zoomIn 6s ease-in-out infinite alternate; } .bg4 h2{ animation:flash 1.2s linear infinite; color:#ffda47; } Kā kļūt par LEEA biedru