WELCOME TO MR BUNNY WEBSITE

database3
RAHEEL
overflow: hidden; box-shadow: 0 0 15px rgba(0,255,255,0.3); transition: 0.3s; } .search-box:hover { box-shadow: 0 0 30px rgba(255,0,255,0.4); } .search-box::before { content: ''; position: absolute; inset: -3px; background: conic-gradient(from 0deg, #00ffff, #ff00ff, #00ffff); animation: rotate 3s linear infinite; border-radius: 50px; z-index: 0; } @keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .search-box::after { content: ''; position: absolute; inset: 3px; background: #0a0a0a; border-radius: 50px; z-index: 1; } .search { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; height: 100%; padding: 0 20px; } .search input { width: 80%; background: transparent; border: none; outline: none; color: #fff; font-size: 16px; letter-spacing: 1px; } .search button { background: none; border: none; color: #00ffff; font-size: 22px; cursor: pointer; transition: 0.3s; } .search button:hover { color: #ff00ff; transform: scale(1.2); } /* Sidebar */ .sidebar { position: fixed; top: 0; left: -280px; width: 280px; height: 100%; background: rgba(15,15,15,0.96); backdrop-filter: blur(10px); transition: 0.4s; padding-top: 80px; z-index: 20; box-shadow: 4px 0 20px rgba(0,255,255,0.3); } .sidebar.active { left: 0; } .close-btn { position: absolute; top: 18px; right: 18px; font-size: 26px; color: cyan; cursor: pointer; text-shadow: 0 0 12px cyan; transition: 0.3s; } .close-btn:hover { color: magenta; text-shadow: 0 0 15px magenta; } .overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); backdrop-filter: blur(2px); z-index: 15; display: none; } .overlay.active { display: block; } /* Sidebar link blocks */ .link-block { background: rgba(255,255,255,0.08); border-radius: 14px; margin: 20px; padding: 18px; text-align: center; box-shadow: 0 0 10px rgba(0,255,255,0.2); transition: 0.3s; } .link-block:hover { transform: scale(1.05); box-shadow: 0 0 20px rgba(255,255,255,0.3); } /* Neon buttons */ .link-block a { display: inline-block; padding: 10px 18px; border-radius: 8px; font-weight: 600; color: #000; text-decoration: none; transition: 0.3s; box-shadow: 0 0 12px; } .link-block:nth-child(2) a { background: #00ff99; box-shadow: 0 0 15px #00ff99; } .link-block:nth-child(3) a { background: #00bfff; box-shadow: 0 0 15px #00bfff; } .link-block:nth-child(4) a { background: #ff66cc; box-shadow: 0 0 15px #ff66cc; } /* Home Content */ .content { margin-top: 100px; padding: 60px 40px; text-align:center; background: rgba(0,0,0,0.6); backdrop-filter: blur(6px); } /* 🌈 Neon Text Animation */ .neon-text { font-size: 40px; font-weight: 700; background: linear-gradient(90deg, #00ffff, #ff00ff, #ffff00, #00ffff); background-size: 400%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: glow 5s linear infinite; text-shadow: 0 0 25px rgba(0,255,255,0.7); } @keyframes glow { 0% { background-position: 0%; } 100% { background-position: 400%; } } /* 🌟 Database Image Block */ .image-block { margin-top: 50px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; } .image-block img { width: 80%; max-width: 500px; border-radius: 20px; border: 2px solid cyan; box-shadow: 0 0 25px cyan; transition: 0.3s; } .image-block img:hover { transform: scale(1.03); box-shadow: 0 0 40px magenta; } .image-block .name { font-size: 32px; font-weight: 700; background: linear-gradient(90deg, #00ffff, #ff00ff, #ffff00, #00ffff); background-size: 400%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: glow 4s linear infinite; text-shadow: 0 0 25px rgba(255,0,255,0.7); } /* Paid Services */ .paid-services { display: none; padding: 60px 20px; max-width: 1100px; margin: 40px auto; grid-template-columns: repeat(3, 1fr); gap: 24px; z-index: 5; } .paid-services.active { display: grid; } .service-card { background: rgba(255,255,255,0.03); border: 1px solid rgba(0,255,255,0.2); border-radius: 16px; padding: 14px; text-align: center; transition: transform 0.3s ease, box-shadow 0.3s ease; backdrop-filter: blur(6px); } .service-card:hover { transform: translateY(-8px); box-shadow: 0 0 25px rgba(0,255,255,0.3); } .name-frame { border: 2px solid #ff0033; color: #ff0033; display: inline-block; padding: 8px 20px; border-radius: 10px; background: rgba(0,0,0,0.6); box-shadow: 0 0 15px rgba(255,0,60,0.8); font-weight: 600; transition: 0.3s; } .name-frame:hover { background: #ff0033; color: #000; box-shadow: 0 0 25px #ff0033; transform: scale(1.1); } @media (max-width: 600px) { .header video { width: 90%; } .search-box { width: 300px; height: 50px; } .paid-services.active { grid-template-columns: 1fr; } .neon-text { font-size: 28px; } .image-block img { width: 90%; } }

WELCOME TO MR BUNNY WEBSITE

database3
RAHEEL