Загрузка...
Адаптивный макет дашборда с боковой панелью иконок. Отображает карточки сообщества: популярные, недавние. Идеален для соцсетей и контент-приложений.
<div class="flex w-full max-w-[600px] max-h-[600px] bg-[radial-gradient(circle_at_top,var(--tw-gradient-stops))] from-[#2E335A]/60 to-[#1C1B33]/20 border-slate-50/5 border rounded-lg mt-40 mr-auto mb-40 ml-auto backdrop-blur-xl overflow-hidden">
<!-- Left icon rail -->
<aside class="sticky top-0 hidden h-[100dvh] w-20 flex-col gap-3 xl:flex bg-white/5 border-white/10 rounded-l-lg border-t border-r pt-5 pr-3 pb-5 pl-3 backdrop-blur items-center">
<div class="absolute top-3 left-3 flex items-center gap-1.5">
<div class="w-3 h-3 bg-red-500 rounded-full"></div>
<div class="w-3 h-3 bg-yellow-500 rounded-full"></div>
<div class="w-3 h-3 bg-emerald-500 rounded-full"></div>
</div>
<div class="flex mt-8 mb-2 items-center justify-center">
<div class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="sparkles" class="lucide lucide-sparkles size-5 text-indigo-300"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z" class=""></path><path d="M20 2v4" class=""></path><path d="M22 4h-4" class=""></path><circle cx="4" cy="20" r="2" class=""></circle></svg>
</div>
</div>
<nav class="flex flex-col gap-2 space-y-4 items-center">
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="home" class="lucide lucide-home size-5"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" class=""></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" class=""></path></svg>
<span class="absolute -right-3 -top-3 inline-flex h-6 items-center text-[10px] font-medium bg-indigo-500/90 rounded-full pr-1.5 pl-1.5 shadow">New</span>
</button>
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="music" class="lucide lucide-music size-5"><path d="M9 18V5l12-2v13" class=""></path><circle cx="6" cy="18" r="3" class=""></circle><circle cx="18" cy="16" r="3" class=""></circle></svg>
</button>
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="gamepad-2" class="lucide lucide-gamepad-2 size-5 w-[24px] h-[24px]" data-icon-replaced="true" style="width: 24px; height: 24px; color: rgb(226, 232, 240);"><line x1="6" x2="10" y1="11" y2="11" class=""></line><line x1="8" x2="8" y1="9" y2="13" class=""></line><line x1="15" x2="15.01" y1="12" y2="12" class=""></line><line x1="18" x2="18.01" y1="10" y2="10" class=""></line><path d="M17.32 5H6.68a4 4 0 0 0-3.978 3.59c-.006.052-.01.101-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 0 0 3 3c1 0 1.5-.5 2-1l1.414-1.414A2 2 0 0 1 9.828 16h4.344a2 2 0 0 1 1.414.586L17 18c.5.5 1 1 2 1a3 3 0 0 0 3-3c0-1.545-.604-6.584-.685-7.258-.007-.05-.011-.1-.017-.151A4 4 0 0 0 17.32 5z" class=""></path></svg>
</button>
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="graduation-cap" class="lucide lucide-graduation-cap size-5"><path d="M21.42 10.922a1 1 0 0 0-.019-1.838L12.83 5.18a2 2 0 0 0-1.66 0L2.6 9.08a1 1 0 0 0 0 1.832l8.57 3.908a2 2 0 0 0 1.66 0z" class=""></path><path d="M22 10v6" class=""></path><path d="M6 12.5V16a6 3 0 0 0 12 0v-3.5" class=""></path></svg>
</button>
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="globe" class="lucide lucide-globe size-5"><circle cx="12" cy="12" r="10" class=""></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20" class=""></path><path d="M2 12h20" class=""></path></svg>
</button>
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="clapperboard" class="lucide lucide-clapperboard size-5"><path d="M20.2 6 3 11l-.9-2.4c-.3-1.1.3-2.2 1.3-2.5l13.5-4c1.1-.3 2.2.3 2.5 1.3Z" class=""></path><path d="m6.2 5.3 3.1 3.9" class=""></path><path d="m12.4 3.4 3.1 4" class=""></path><path d="M3 11h18v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2Z" class=""></path></svg>
</button>
<button class="group relative inline-flex size-11 hover:from-white/20 hover:to-white/10 text-slate-200 bg-gradient-to-b from-white/10 to-white/5 border-slate-50/5 border rounded-full items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="users" class="lucide lucide-users size-5"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" class=""></path><path d="M16 3.128a4 4 0 0 1 0 7.744" class=""></path><path d="M22 21v-2a4 4 0 0 0-3-3.87" class=""></path><circle cx="9" cy="7" r="4" class=""></circle></svg>
</button>
</nav>
<div class="mt-auto flex flex-col items-center gap-2">
<button class="inline-flex size-11 items-center justify-center rounded-xl border border-white/10 bg-white/5 hover:bg-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="settings" class="lucide lucide-settings size-5"><path d="M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" class=""></path><circle cx="12" cy="12" r="3" class=""></circle></svg>
</button>
<button class="inline-flex size-11 items-center justify-center rounded-xl border border-white/10 bg-white/5 hover:bg-white/10">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="plus" class="lucide lucide-plus size-5"><path d="M5 12h14" class=""></path><path d="M12 5v14" class=""></path></svg>
</button>
</div>
</aside>
<!-- Left nav -->
<!-- Main content -->
<main class="flex-1 md:px-6 lg:px-8 bg-[radial-gradient(circle_at_top,var(--tw-gradient-stops))] from-[#ffffff]/5 to-[#1C1B33]/50 pt-6 pr-4 pb-6 pl-4">
<!-- Featured -->
<section class="mb-8">
<div class="flex mb-4 items-end justify-between">
<h2 class="text-2xl font-semibold tracking-tight text-slate-100">Featured Community</h2>
<a href="#" class="text-sm font-medium text-indigo-300 hover:text-indigo-200">See all</a>
</div>
<div class="grid gap-4 sm:grid-cols-2"><!-- Card --><a href="#" class="group relative overflow-hidden transition hover:bg-white/10 min-h-[180px] max-h-[200px] flex items-end bg-white/5 border-white/10 border rounded-2xl backdrop-blur-xl">
<div class="relative w-full bg-slate-50/5 border-white/10 rounded-t-xl border-t pt-5 pr-5 pb-5 pl-5 backdrop-blur-lg">
<div class="flex items-start justify-between">
<div class="">
<h3 class="text-lg font-semibold text-slate-100 tracking-tight mb-1">Virtual Reality</h3>
<p class="text-sm text-slate-300/90">A community for VR and novices alike...</p>
</div>
<div class="inline-flex size-10 absolute -top-5 right-4 bg-[conic-gradient(from_270deg,var(--tw-gradient-stops))] from-[#ffffff]/20 via-[#3b3a69]/20 to-purple-400/0 border-slate-50/25 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="headset" class="lucide lucide-headset size-5 text-indigo-200"><path d="M3 11h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5Zm0 0a9 9 0 1 1 18 0m0 0v5a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3Z" class=""></path><path d="M21 16v2a4 4 0 0 1-4 4h-5" class=""></path></svg>
</div>
</div>
</div>
</a><a href="#" class="group relative overflow-hidden transition hover:bg-white/10 min-h-[180px] max-h-[200px] flex items-end bg-white/5 border-white/10 border rounded-2xl backdrop-blur-xl">
<div class="relative w-full bg-slate-50/5 border-white/10 rounded-t-xl border-t pt-5 pr-5 pb-5 pl-5 backdrop-blur-lg">
<div class="flex items-start justify-between">
<div class="">
<h3 class="text-lg font-semibold text-slate-100 tracking-tight mb-1">Gane Play</h3>
<p class="text-sm text-slate-300/90">Always a new challenge. Great place...</p>
</div>
<div class="inline-flex size-10 absolute -top-5 right-4 bg-[conic-gradient(from_270deg,var(--tw-gradient-stops))] from-[#ffffff]/20 via-[#3b3a69]/20 to-purple-400/0 border-slate-50/25 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="headset" class="lucide lucide-headset size-5 text-indigo-200"><path d="M3 11h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5Zm0 0a9 9 0 1 1 18 0m0 0v5a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3Z" class=""></path><path d="M21 16v2a4 4 0 0 1-4 4h-5" class=""></path></svg>
</div>
</div>
</div>
</a><!-- Card --></div>
</section>
<!-- Popular -->
<section class="">
<div class="flex mb-4 items-end justify-between">
<h2 class="text-2xl font-semibold text-slate-100 tracking-tight">Popular Right Now</h2>
<a href="#" class="text-sm font-medium text-indigo-300 hover:text-indigo-200">See all</a>
</div>
<div class="grid gap-4 md:grid-cols-2 h-36">
<a href="#" class="group relative overflow-hidden transition hover:bg-white/10 bg-center max-h-[110px] bg-white/5 rounded-2xl backdrop-blur-xl" style="">
<div class="absolute inset-0 flex">
<div class="w-2/6"></div>
<div class="w-4/6 flex pt-0 pr-0 pb-0 pl-0 items-center justify-center">
<div class="w-full h-full bg-white/5 border-white/10 border rounded-2xl pt-4 pr-5 pb-4 pl-7 backdrop-blur-2xl">
<div class="flex gap-4 items-start">
<div class="inline-flex size-10 absolute top-8 -left-5 bg-[conic-gradient(from_180deg,var(--tw-gradient-stops))] from-[#fafeff]/20 via-[#5b5181]/20 to-[#ffffff]/20 border-slate-50/20 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="shapes" class="lucide lucide-shapes size-6 text-sky-200"><path d="M8.3 10a.7.7 0 0 1-.626-1.079L11.4 3a.7.7 0 0 1 1.198-.043L16.3 8.9a.7.7 0 0 1-.572 1.1Z" class=""></path><rect x="3" y="14" width="7" height="7" rx="1" class=""></rect><circle cx="17.5" cy="17.5" r="3.5" class=""></circle></svg>
</div>
<div class="min-w-0">
<h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">3D Art</h3>
<p class="text-xs text-slate-300/90">A great place to discuss art.</p>
</div>
</div>
</div>
</div>
</div>
</a>
<a href="#" class="group relative overflow-hidden transition hover:bg-white/10 bg-center bg-white/5 rounded-2xl backdrop-blur-xl max-h-[110px]">
<div class="absolute inset-0 flex">
<div class="w-2/6"></div>
<div class="w-4/6 flex pt-0 pr-0 pb-0 pl-0 items-center justify-center">
<div class="w-full h-full bg-white/5 border-white/10 border rounded-2xl pt-4 pr-5 pb-4 pl-7 backdrop-blur-xl">
<div class="flex gap-4 items-start">
<div class="inline-flex size-10 absolute top-8 -left-5 bg-[conic-gradient(from_180deg,var(--tw-gradient-stops))] from-[#fafeff]/20 via-[#5b5181]/20 to-[#ffffff]/20 border-slate-50/20 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="globe" class="lucide lucide-globe lucide-shapes size-6 w-[24px] h-[24px]" data-icon-replaced="true" style="width: 24px; height: 24px; color: rgb(186, 230, 253);"><circle cx="12" cy="12" r="10" class=""></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20" class=""></path><path d="M2 12h20" class=""></path></svg>
</div>
<div class="min-w-0">
<h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">NFT</h3>
<p class="text-xs text-slate-300/90">An NFT community so...</p>
</div>
</div>
</div>
</div>
</div>
</a>
</div>
</section>
<!-- Recent Add -->
<section class="">
<div class="flex mb-4 items-end justify-between">
<h2 class="text-2xl font-semibold tracking-tight text-slate-100">Recent Add</h2>
<a href="#" class="text-sm font-medium text-indigo-300 hover:text-indigo-200">See all</a>
</div>
<div class="grid gap-4 md:grid-cols-3">
<a href="#" class="group relative overflow-hidden transition hover:bg-white/10 min-h-[200px] flex items-end bg-white/5 border-white/10 border rounded-2xl backdrop-blur-xl">
<div class="relative w-full bg-slate-50/5 border-white/10 border-t pt-5 pr-5 pb-5 pl-5 backdrop-blur-lg rounded-t-xl">
<div class="flex items-start justify-between">
<div class="">
<h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">Movie recapped</h3>
<p class="text-xs text-slate-300/90">Discuss your favourite movies and TV serie here.</p>
</div>
<div class="inline-flex size-10 absolute -top-5 right-4 bg-[conic-gradient(from_270deg,var(--tw-gradient-stops))] from-[#ffffff]/20 via-[#3b3a69]/20 to-purple-400/0 border-slate-50/25 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-tv size-5" style="color: rgb(199, 210, 254);"><rect width="20" height="15" x="2" y="7" rx="2" ry="2" class=""></rect><polyline points="17 2 12 7 7 2" class=""></polyline></svg>
</div>
</div>
</div>
</a><a href="#" class="group relative overflow-hidden transition hover:bg-white/10 min-h-[200px] flex items-end bg-white/5 border-white/10 border rounded-2xl backdrop-blur-xl">
<div class="relative w-full bg-slate-50/5 border-white/10 border-t pt-5 pr-5 pb-5 pl-5 backdrop-blur-lg rounded-t-xl">
<div class="flex items-start justify-between">
<div class="">
<h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">Movie recapped</h3>
<p class="text-xs text-slate-300/90">Discuss your favourite movies and TV serie here.</p>
</div>
<div class="inline-flex size-10 absolute -top-5 right-4 bg-[conic-gradient(from_270deg,var(--tw-gradient-stops))] from-[#ffffff]/20 via-[#3b3a69]/20 to-purple-400/0 border-slate-50/25 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-tv size-5" style="color: rgb(199, 210, 254);"><rect width="20" height="15" x="2" y="7" rx="2" ry="2" class=""></rect><polyline points="17 2 12 7 7 2" class=""></polyline></svg>
</div>
</div>
</div>
</a><a href="#" class="group relative overflow-hidden transition hover:bg-white/10 min-h-[200px] flex items-end bg-white/5 border-white/10 border rounded-2xl backdrop-blur-xl">
<div class="relative w-full bg-slate-50/5 border-white/10 border-t pt-5 pr-5 pb-5 pl-5 backdrop-blur-lg rounded-t-xl">
<div class="flex items-start justify-between">
<div class="">
<h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">Movie recapped</h3>
<p class="text-xs text-slate-300/90">Discuss your favourite movies and TV serie here.</p>
</div>
<div class="inline-flex size-10 absolute -top-5 right-4 bg-[conic-gradient(from_270deg,var(--tw-gradient-stops))] from-[#ffffff]/20 via-[#3b3a69]/20 to-purple-400/0 border-slate-50/25 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-tv size-5" style="color: rgb(199, 210, 254);"><rect width="20" height="15" x="2" y="7" rx="2" ry="2" class=""></rect><polyline points="17 2 12 7 7 2" class=""></polyline></svg>
</div>
</div>
</div>
</a>
<a href="#" class="group relative overflow-hidden transition hover:bg-white/10 min-h-[200px] flex items-end bg-white/5 border-white/10 border rounded-2xl backdrop-blur-xl">
<img src="https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/f049a336-286b-4154-ac50-0ee6ee06aa54_800w.jpg" alt="" class="absolute inset-0 h-full w-full object-cover" style="">
<div class="relative w-full bg-slate-50/5 border-white/10 border-t pt-5 pr-5 pb-5 pl-5 backdrop-blur-lg rounded-t-xl">
<div class="flex items-start justify-between">
<div class="">
<h3 class="text-base font-semibold text-slate-100 tracking-tight mb-1">Space</h3>
<p class="text-xs text-slate-300/90">A community for the space enthusiast.</p>
</div>
<div class="inline-flex size-10 absolute -top-5 right-4 bg-[conic-gradient(from_90deg,var(--tw-gradient-stops))] from-purple-400/20 via-cyan-500/40 to-purple-400/80 border-slate-50/10 border rounded-full pr-3 pl-3 items-center justify-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-orbit size-5 text-slate-200/90"><path d="M20.341 6.484A10 10 0 0 1 10.266 21.85" class=""></path><path d="M3.659 17.516A10 10 0 0 1 13.74 2.152" class=""></path><circle cx="12" cy="12" r="3" class=""></circle><circle cx="19" cy="5" r="2" class=""></circle><circle cx="5" cy="19" r="2" class=""></circle></svg>
</div>
</div>
</div>
</a>
</div>
</section>
</main>
<!-- Right sidebar -->
</div>