tools

html, body{ margin:0; padding:0; background:#000 !important; font-family: Arial, sans-serif; color:#fff; -webkit-tap-highlight-color: transparent; } /* REMOVE BLOGGER FEEL */ .header, .navbar, .blog-header, .blog-title, #header, #navbar, #footer, .footer{ display:none !important; } /* MAIN APP AREA */ body{ overflow-x:hidden; } /* TOP BAR (APP STYLE) */ .top{ position:sticky; top:0; z-index:999; background:#0a0a0a; padding:14px; font-weight:bold; font-size:16px; text-align:center; border-bottom:1px solid #222; } /* GRID */ .grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:10px; } /* CARD (PRO LOOK) */ .card{ position:relative; height:170px; border-radius:16px; overflow:hidden; text-decoration:none; box-shadow:0 8px 20px rgba(0,0,0,0.6); transform:scale(1); transition:0.25s ease; } .card:active{ transform:scale(0.96); } /* IMAGE */ .card img{ width:100%; height:100%; object-fit:cover; filter:brightness(0.8); } /* GRADIENT OVERLAY */ .card::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,0.7), transparent 60%); } /* PLAY BUTTON */ .play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:50px; height:50px; border-radius:50%; background:rgba(0,0,0,0.6); display:flex; align-items:center; justify-content:center; font-size:20px; color:#fff; border:1px solid rgba(255,255,255,0.2); } /* INFO TEXT */ .info{ position:absolute; bottom:8px; left:8px; font-size:11px; background:rgba(0,0,0,0.5); padding:3px 6px; border-radius:6px; } /* APP STYLE SMOOTH SCROLL */ html{ scroll-behavior:smooth; } tools

Search This Blog

tools

Comments

Post a Comment

Popular posts from this blog