<!doctype html>
<html lang="en">
<head>
<!-- Basic Page Needs
================================================== -->
<title>Simplest Social Network HTML Template</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Simplest is - Professional A unique and beautiful collection of UI elements">
<link rel="icon" href="assets/images/favicon.png">
<!-- CSS
================================================== -->
<link rel="stylesheet" href="assets/css/style.css">
<link rel="stylesheet" href="assets/css/uikit.css">
<link rel="stylesheet" href="assets/css/uikit.css">
<!-- icons
================================================== -->
<link rel="stylesheet" href="assets/css/icons.css">
<script src="https://kit.fontawesome.com/815e388c50.js" crossorigin="anonymous"></script>
<!-- Google font
================================================== -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet">
</head>
<body>
<!-- Wrapper -->
<div id="wrapper">
<!-- sidebar -->
<div class="main_sidebar">
<div class="side-overlay" uk-toggle="target: #wrapper ; cls: collapse-sidebar mobile-visible"></div>
<!-- sidebar header -->
<div class="sidebar-header">
<!-- Logo-->
<div id="logo">
<a href="feeds.html"> <img src="assets/images/logo-light.png" alt=""></a>
</div>
<span class="btn-close" uk-toggle="target: #wrapper ; cls: collapse-sidebar mobile-visible"></span>
</div>
<!-- sidebar Menu -->
<div class="sidebar">
<div class="sidebar_innr" data-simplebar>
<div class="sections">
<ul>
<li class="sl_side_post_fltr">
<a href="feeds.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#047cac" d="M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z"></path>
</svg>
News Feed </a>
</li>
<li class="active">
<a href="albums.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#8bc34a"
d="M22,16V4A2,2 0 0,0 20,2H8A2,2 0 0,0 6,4V16A2,2 0 0,0 8,18H20A2,2 0 0,0 22,16M11,12L13.03,14.71L16,11L20,16H8M2,6V20A2,2 0 0,0 4,22H18V20H4V6">
</path>
</svg> Albums </a>
</li>
<li>
<a href="pokes.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#009688"
d="M21,9A1,1 0 0,1 22,10A1,1 0 0,1 21,11H16.53L16.4,12.21L14.2,17.15C14,17.65 13.47,18 12.86,18H8.5C7.7,18 7,17.27 7,16.5V10C7,9.61 7.16,9.26 7.43,9L11.63,4.1L12.4,4.84C12.6,5.03 12.72,5.29 12.72,5.58L12.69,5.8L11,9H21M2,18V10H5V18H2Z">
</path>
</svg> Pokes </a>
</li>
<li>
<a href="popular-post.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#8d73cc"
d="M20 22H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1zm-1-2V4H5v16h14zM7 6h4v4H7V6zm0 6h10v2H7v-2zm0 4h10v2H7v-2zm6-9h4v2h-4V7z">
</path>
</svg> Popular Posts </a>
</li>
<li>
<a href="events.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#f25e4e"
d="M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1M17,12H12V17H17V12Z">
</path>
</svg> Events </a>
</li>
<li>
<a href="games.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#03A9F4"
d="M16.5,9L13.5,12L16.5,15H22V9M9,16.5V22H15V16.5L12,13.5M7.5,9H2V15H7.5L10.5,12M15,7.5V2H9V7.5L12,10.5L15,7.5Z">
</path>
</svg> Games </a>
</li>
<li>
<a href="offers.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#e91e63"
d="M5.5,7A1.5,1.5 0 0,1 4,5.5A1.5,1.5 0 0,1 5.5,4A1.5,1.5 0 0,1 7,5.5A1.5,1.5 0 0,1 5.5,7M21.41,11.58L12.41,2.58C12.05,2.22 11.55,2 11,2H4C2.89,2 2,2.89 2,4V11C2,11.55 2.22,12.05 2.59,12.41L11.58,21.41C11.95,21.77 12.45,22 13,22C13.55,22 14.05,21.77 14.41,21.41L21.41,14.41C21.78,14.05 22,13.55 22,13C22,12.44 21.77,11.94 21.41,11.58Z">
</path>
</svg> Offers </a>
</li>
<li>
<a href="explore.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#b2c17c"
d="M15.5,12C18,12 20,14 20,16.5C20,17.38 19.75,18.21 19.31,18.9L22.39,22L21,23.39L17.88,20.32C17.19,20.75 16.37,21 15.5,21C13,21 11,19 11,16.5C11,14 13,12 15.5,12M15.5,14A2.5,2.5 0 0,0 13,16.5A2.5,2.5 0 0,0 15.5,19A2.5,2.5 0 0,0 18,16.5A2.5,2.5 0 0,0 15.5,14M10,4A4,4 0 0,1 14,8C14,8.91 13.69,9.75 13.18,10.43C12.32,10.75 11.55,11.26 10.91,11.9L10,12A4,4 0 0,1 6,8A4,4 0 0,1 10,4M2,20V18C2,15.88 5.31,14.14 9.5,14C9.18,14.78 9,15.62 9,16.5C9,17.79 9.38,19 10,20H2Z">
</path>
</svg> Find friends </a>
</li>
<li>
<a href="explore.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#8BC34A"
d="M14.19,14.19L6,18L9.81,9.81L18,6M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,10.9A1.1,1.1 0 0,0 10.9,12A1.1,1.1 0 0,0 12,13.1A1.1,1.1 0 0,0 13.1,12A1.1,1.1 0 0,0 12,10.9Z">
</path>
</svg> Explore </a>
</li>
<li id="more-veiw" hidden="">
<a href="jobs.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#4caf50"
d="M10,2H14A2,2 0 0,1 16,4V6H20A2,2 0 0,1 22,8V19A2,2 0 0,1 20,21H4C2.89,21 2,20.1 2,19V8C2,6.89 2.89,6 4,6H8V4C8,2.89 8.89,2 10,2M14,6V4H10V6H14Z">
</path>
</svg> Jobs </a>
</li>
<li id="more-veiw" hidden="">
<a href="funding.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#673AB7"
d="M12.75,3.94C13.75,3.22 14.91,2.86 16.22,2.86C16.94,2.86 17.73,3.05 18.59,3.45C19.45,3.84 20.13,4.3 20.63,4.83C21.66,6.11 22.09,7.6 21.94,9.3C21.78,11 21.22,12.33 20.25,13.27L12.66,20.86C12.47,21.05 12.23,21.14 11.95,21.14C11.67,21.14 11.44,21.05 11.25,20.86C11.06,20.67 10.97,20.44 10.97,20.16C10.97,19.88 11.06,19.64 11.25,19.45L15.84,14.86C16.09,14.64 16.09,14.41 15.84,14.16C15.59,13.91 15.36,13.91 15.14,14.16L10.55,18.75C10.36,18.94 10.13,19.03 9.84,19.03C9.56,19.03 9.33,18.94 9.14,18.75C8.95,18.56 8.86,18.33 8.86,18.05C8.86,17.77 8.95,17.53 9.14,17.34L13.73,12.75C14,12.5 14,12.25 13.73,12C13.5,11.75 13.28,11.75 13.03,12L8.44,16.64C8.25,16.83 8,16.92 7.73,16.92C7.45,16.92 7.21,16.83 7,16.64C6.8,16.45 6.7,16.22 6.7,15.94C6.7,15.66 6.81,15.41 7.03,15.19L11.63,10.59C11.88,10.34 11.88,10.11 11.63,9.89C11.38,9.67 11.14,9.67 10.92,9.89L6.28,14.5C6.06,14.7 5.83,14.81 5.58,14.81C5.3,14.81 5.06,14.71 4.88,14.5C4.69,14.3 4.59,14.06 4.59,13.78C4.59,13.5 4.69,13.27 4.88,13.08C7.94,10 9.83,8.14 10.55,7.45L14.11,10.97C14.5,11.34 14.95,11.53 15.5,11.53C16.2,11.53 16.75,11.25 17.16,10.69C17.44,10.28 17.54,9.83 17.46,9.33C17.38,8.83 17.17,8.41 16.83,8.06L12.75,3.94M14.81,10.27L10.55,6L3.47,13.08C2.63,12.23 2.15,10.93 2.04,9.16C1.93,7.4 2.41,5.87 3.47,4.59C4.66,3.41 6.08,2.81 7.73,2.81C9.39,2.81 10.8,3.41 11.95,4.59L16.22,8.86C16.41,9.05 16.5,9.28 16.5,9.56C16.5,9.84 16.41,10.08 16.22,10.27C16.03,10.45 15.8,10.55 15.5,10.55C15.23,10.55 15,10.45 14.81,10.27V10.27Z">
</path>
</svg> Fundings </a>
</li>
</ul>
<a href="#" class="button secondary px-5 btn-more"
uk-toggle="target: #more-veiw; animation: uk-animation-fade">
<span id="more-veiw">See More <i class="icon-feather-chevron-down ml-2"></i></span>
<span id="more-veiw" hidden>See Less<i class="icon-feather-chevron-up ml-2"></i> </span>
</a>
</div>
<div class="sections">
<h3> Explore </h3>
<ul>
<li>
<a href="group.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#03A9F4"
d="M5 3A2 2 0 0 0 3 5H5M7 3V5H9V3M11 3V5H13V3M15 3V5H17V3M19 3V5H21A2 2 0 0 0 19 3M3 7V9H5V7M7 7V11H11V7M13 7V11H17V7M19 7V9H21V7M3 11V13H5V11M19 11V13H21V11M7 13V17H11V13M13 13V17H17V13M3 15V17H5V15M19 15V17H21V15M3 19A2 2 0 0 0 5 21V19M7 19V21H9V19M11 19V21H13V19M15 19V21H17V19M19 19V21A2 2 0 0 0 21 19Z">
</path>
</svg> Groups </a>
</li>
<li>
<a href="pages.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#f79f58" d="M14.4,6L14,4H5V21H7V14H12.6L13,16H20V6H14.4Z">
</path>
</svg> Pages </a>
</li>
<li>
<a href="market.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#7d8250"
d="M12,18H6V14H12M21,14V12L20,7H4L3,12V14H4V20H14V14H18V20H20V14M20,4H4V6H20V4Z">
</path>
</svg> Market </a>
</li>
<li>
<a href="blog.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#f35d4d"
d="M20,11H4V8H20M20,15H13V13H20M20,19H13V17H20M11,19H4V13H11M20.33,4.67L18.67,3L17,4.67L15.33,3L13.67,4.67L12,3L10.33,4.67L8.67,3L7,4.67L5.33,3L3.67,4.67L2,3V19A2,2 0 0,0 4,21H20A2,2 0 0,0 22,19V3L20.33,4.67Z">
</path>
</svg> Blog </a>
</li>
<li>
<a href="jobs.html">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#4caf50"
d="M10,2H14A2,2 0 0,1 16,4V6H20A2,2 0 0,1 22,8V19A2,2 0 0,1 20,21H4C2.89,21 2,20.1 2,19V8C2,6.89 2.89,6 4,6H8V4C8,2.89 8.89,2 10,2M14,6V4H10V6H14Z">
</path>
</svg> Jobs </a>
</li>
</ul>
</div>
<!-- Optional Footer -->
<div id="foot">
<ul>
<li> <a href="page-term.html"> About Us </a></li>
<li> <a href="page-setting.html"> Setting </a></li>
<li> <a href="page-privacy.html"> Privacy Policy </a></li>
<li> <a href="page-term.html"> Terms - Conditions </a></li>
</ul>
<div class="foot-content">
<p>© 2020 <strong>Simplest</strong>. All Rights Reserved. </p>
</div>
</div>
</div>
</div>
</div>
<!-- contents -->
<div class="main_content">
<!-- header -->
<div id="main_header">
<header>
<div class="header-innr">
<!-- Logo-->
<div class="header-btn-traiger is-hidden"
uk-toggle="target: #wrapper ; cls: collapse-sidebar mobile-visible">
<span></span></div>
<!-- Logo-->
<div id="logo">
<a href="feeds.html"> <img src="assets/images/logo.png" alt=""></a>
<a href="feeds.html"> <img src="assets/images/logo-light.png" class="logo-inverse"
alt=""></a>
</div>
<!-- form search-->
<div class="head_search">
<form>
<div class="head_search_cont">
<input value="" type="text" class="form-control"
placeholder="Search for Friends , Videos and more.." autocomplete="off">
<i class="s_icon uil-search-alt"></i>
</div>
<!-- Search box dropdown -->
<div uk-dropdown="pos: top;mode:click;animation: uk-animation-slide-bottom-small"
class="dropdown-search display-hidden">
<!-- User menu -->
<ul class="dropdown-search-list">
<li class="list-title"> Recent Searches </li>
<li> <a href="#">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
<p> Erica Jones <span> 2 hours ago </span> </p>
</a>
</li>
<li> <a href="#">
<img src="assets/images/avatars/avatar-3.jpg" alt="">
<p> Adrian Mohani <span> 13 days ago </span> </p>
</a>
</li>
<li> <a href="#">
<img src="assets/images/avatars/avatar-4.jpg" alt="">
<p> Mountain Riders <span> 3 days ago <span>Group</span> </span> </p>
</a>
</li>
<li> <a href="#">
<img src="assets/images/avatars/avatar-5.jpg" alt="">
<p> Coffee Addicts <span> 12 days ago <span> Page</span></span> </p>
</a>
</li>
<li class="menu-divider"></li>
<li class="list-footer"> <a href="your-history.html"> Searches History </a>
</li>
</ul>
</div>
</form>
</div>
<!-- user icons -->
<div class="head_user">
<!-- browse apps -->
<a href="#" class="opts_icon uk-visible@s"
uk-tooltip="title: Create ; pos: bottom ;offset:7">
<img src="assets/images/icons/apps.svg" alt="">
</a>
<!-- browse apps dropdown -->
<div uk-dropdown="mode:click ; pos: bottom-center ; animation: uk-animation-scale-up"
class="icon-browse display-hidden">
<a href="#" class="icon-menu-item">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#9c27b0"
d="M12,8H4A2,2 0 0,0 2,10V14A2,2 0 0,0 4,16H5V20A1,1 0 0,0 6,21H8A1,1 0 0,0 9,20V16H12L17,20V4L12,8M21.5,12C21.5,13.71 20.54,15.26 19,16V8C20.53,8.75 21.5,10.3 21.5,12Z">
</path>
</svg>
Create Ad </a>
<a href="#" class="icon-menu-item">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#009da0"
d="M18,20H6V18H4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V18H18V20M14,2H6A2,2 0 0,0 4,4V12H6V4H14V8H18V12H20V8L14,2M11,16H8V14H11V16M16,16H13V14H16V16M3,14H6V16H3V14M21,16H18V14H21V16Z">
</path>
</svg>
Create Blog </a>
<a href="#" class="icon-menu-item">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#f25e4e"
d="M19,19H5V8H19M16,1V3H8V1H6V3H5C3.89,3 3,3.89 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3H18V1M17,12H12V17H17V12Z">
</path>
</svg>
Create Event </a>
<a href="#" class="icon-menu-item">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#03A9F4"
d="M12,6A3,3 0 0,0 9,9A3,3 0 0,0 12,12A3,3 0 0,0 15,9A3,3 0 0,0 12,6M6,8.17A2.5,2.5 0 0,0 3.5,10.67A2.5,2.5 0 0,0 6,13.17C6.88,13.17 7.65,12.71 8.09,12.03C7.42,11.18 7,10.15 7,9C7,8.8 7,8.6 7.04,8.4C6.72,8.25 6.37,8.17 6,8.17M18,8.17C17.63,8.17 17.28,8.25 16.96,8.4C17,8.6 17,8.8 17,9C17,10.15 16.58,11.18 15.91,12.03C16.35,12.71 17.12,13.17 18,13.17A2.5,2.5 0 0,0 20.5,10.67A2.5,2.5 0 0,0 18,8.17M12,14C10,14 6,15 6,17V19H18V17C18,15 14,14 12,14M4.67,14.97C3,15.26 1,16.04 1,17.33V19H4V17C4,16.22 4.29,15.53 4.67,14.97M19.33,14.97C19.71,15.53 20,16.22 20,17V19H23V17.33C23,16.04 21,15.26 19.33,14.97Z">
</path>
</svg>
Create Groups </a>
<a href="#" class="icon-menu-item">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#f79f58" d="M14.4,6L14,4H5V21H7V14H12.6L13,16H20V6H14.4Z"></path>
</svg>
Create Page </a>
<a href="#" class="icon-menu-item">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="#8bc34a"
d="M22,16V4A2,2 0 0,0 20,2H8A2,2 0 0,0 6,4V16A2,2 0 0,0 8,18H20A2,2 0 0,0 22,16M11,12L13.03,14.71L16,11L20,16H8M2,6V20A2,2 0 0,0 4,22H18V20H4V6">
</path>
</svg>
Albums </a>
<a href="#" class="more-app"> More Apps</a>
</div>
<!-- Message notificiation dropdown -->
<a href="#" class="opts_icon" uk-tooltip="title: Messages ; pos: bottom ;offset:7">
<img src="assets/images/icons/chat.svg" alt=""> <span>4</span>
</a>
<!-- Message notificiation dropdown -->
<div uk-dropdown="mode:click ; animation: uk-animation-slide-bottom-small"
class="dropdown-notifications display-hidden">
<!-- notification contents -->
<div class="dropdown-notifications-content" data-simplebar>
<!-- notivication header -->
<div class="dropdown-notifications-headline">
<h4>Messages</h4>
<a href="#">
<i class="icon-feather-settings"
uk-tooltip="title: Message settings ; pos: left"></i>
</a>
</div>
<!-- notiviation list -->
<ul>
<li>
<a href="#">
<span class="notification-avatar status-online">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Jonathan Madano</strong>
<p>Thanks for The Answer ... <span class="time-ago"> 2 h </span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-3.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Stella Johnson</strong>
<p> Alex will explain you how ... <span class="time-ago"> 3 h
</span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar status-online">
<img src="assets/images/avatars/avatar-1.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Alex Dolgove</strong>
<p> Alia just joined Messenger! <span class="time-ago"> 3 h </span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar status-online">
<img src="assets/images/avatars/avatar-4.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Adrian Mohani</strong>
<p>Thanks for The Answer ... <span class="time-ago"> 2 h </span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Jonathan Madano</strong>
<p>Thanks for The Answer ... <span class="time-ago"> 2 h </span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-3.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Stella Johnson</strong>
<p> Alex will explain you how ... <span class="time-ago"> 3 h
</span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-1.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Alex Dolgove</strong>
<p> Alia just joined Messenger! <span class="time-ago"> 3 h </span>
</p>
</div>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-4.jpg" alt="">
</span>
<div class="notification-text notification-msg-text">
<strong>Adrian Mohani</strong>
<p>Thanks for The Answer ... <span class="time-ago"> 2 h </span>
</p>
</div>
</a>
</li>
</ul>
</div>
<div class="dropdown-notifications-footer">
<a href="#"> See all in Messages</a>
</div>
</div>
<!-- notificiation icon -->
<a href="#" class="opts_icon" uk-tooltip="title: Notifications ; pos: bottom ;offset:7">
<img src="assets/images/icons/bell.svg" alt=""> <span>3</span>
</a>
<!-- notificiation dropdown -->
<div uk-dropdown="mode:click ; animation: uk-animation-slide-bottom-small"
class="dropdown-notifications display-hidden">
<!-- notification contents -->
<div class="dropdown-notifications-content" data-simplebar>
<!-- notivication header -->
<div class="dropdown-notifications-headline">
<h4>Notifications </h4>
<a href="#">
<i class="icon-feather-settings"
uk-tooltip="title: Notifications settings ; pos: left"></i>
</a>
</div>
<!-- notiviation list -->
<ul>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
</span>
<span class="notification-icon bg-gradient-primary">
<i class="icon-feather-thumbs-up"></i></span>
<span class="notification-text">
<strong>Adrian Moh.</strong> Like Your Comment On Video
<span class="text-primary">Learn Prototype Faster</span>
<br> <span class="time-ago"> 9 hours ago </span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-3.jpg" alt="">
</span>
<span class="notification-icon bg-gradient-danger">
<i class="icon-feather-star"></i></span>
<span class="notification-text">
<strong>Alex Dolgove</strong> Added New Review In Video
<span class="text-primary">Full Stack PHP Developer</span>
<br> <span class="time-ago"> 19 hours ago </span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-4.jpg" alt="">
</span>
<span class="notification-icon bg-gradient-success">
<i class="icon-feather-message-circle"></i></span>
<span class="notification-text">
<strong>Stella John</strong> Replay Your Comment in
<span class="text-primary">Adobe XD Tutorial</span>
<br> <span class="time-ago"> 12 hours ago </span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
</span>
<span class="notification-icon bg-gradient-primary">
<i class="icon-feather-thumbs-up"></i></span>
<span class="notification-text">
<strong>Adrian Moh.</strong> Like Your Comment On Video
<span class="text-primary">Learn Prototype Faster</span>
<br> <span class="time-ago"> 9 hours ago </span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-3.jpg" alt="">
</span>
<span class="notification-icon bg-gradient-warning">
<i class="icon-feather-star"></i></span>
<span class="notification-text">
<strong>Alex Dolgove</strong> Added New Review In Video
<span class="text-primary">Full Stack PHP Developer</span>
<br> <span class="time-ago"> 19 hours ago </span>
</span>
</a>
</li>
<li>
<a href="#">
<span class="notification-avatar">
<img src="assets/images/avatars/avatar-4.jpg" alt="">
</span>
<span class="notification-icon bg-gradient-success">
<i class="icon-feather-message-circle"></i></span>
<span class="notification-text">
<strong>Stella John</strong> Replay Your Comment in
<span class="text-primary">Adobe XD Tutorial</span>
<br> <span class="time-ago"> 12 hours ago </span>
</span>
</a>
</li>
</ul>
</div>
</div>
<!-- profile -image -->
<a class="opts_account" href="#"> <img src="assets/images/avatars/avatar-2.jpg" alt=""></a>
<!-- profile dropdown-->
<div uk-dropdown="mode:click ; animation: uk-animation-slide-bottom-small"
class="dropdown-notifications rounded display-hidden">
<!-- User Name / Avatar -->
<a href="timeline.html">
<div class="dropdown-user-details">
<div class="dropdown-user-cover">
<img src="assets/images/avatars/profile-cover.jpg" alt="">
</div>
<div class="dropdown-user-avatar">
<img src="assets/images/avatars/avatar-1.jpg" alt="">
</div>
<div class="dropdown-user-name"> James Lewis </div>
</div>
</a>
<ul class="dropdown-user-menu">
<li><a href="#"> <i class="fas fa-rocket"></i> Boost Posts </a> </li>
<li><a href="#"> <i class="fas fa-rocket"></i> Boost Pages </a> </li>
<li><a href="#"> <i class="fas fa-bullhorn"></i> Advertising </a></li>
<li><a href="#"> <i class="fas fa-user-edit"></i> General Settings</a></li>
<li><a href="#"> <i class="fas fa-user-cog"></i> Admi Area</a></li>
<li>
<a href="#" id="night-mode" class="btn-night-mode">
<i class="fas fa-moon"></i> Night mode
<span class="btn-night-mode-switch">
<span class="uk-switch-button"></span>
</span>
</a>
</li>
</li>
<li><a href="form-login.html"> <i class="fas fa-sign-out-alt"></i>Log Out</a>
</li>
</ul>
<hr class="m-0">
<ul class="dropdown-user-menu">
<li><a href="page-setting.html" class="bg-secondery"> <i class="uil-bolt"></i>
<div> Upgrade To Premium <span> Pro features give you complete control
</span>
</div>
</a>
</li>
</ul>
</div>
</div>
</div> <!-- / heaader-innr -->
</header>
</div>
<div class="main_content_inner">
<div id="spinneroverlay"> </div>
<h1> Photos </h1>
<div class="uk-flex uk-flex-between uk-flex-middle mb-4">
<ul class="uk-width-expand" uk-tab>
<li class="uk-active"><a href="#">Photos of you</a></li>
<li><a href="#"> Your photos</a></li>
<li class="uk-visible@s"><a href="#">Albums</a></li>
</ul>
<a href="#" class="button primary small circle uk-visible@s"> <i class="uil-plus"> </i>
Create New Album </a>
</div>
<div class="uk-child-width-1-4@m uk-child-width-1-3@s uk-child-width-1-2 uk-grid-collapse uk-overflow-hidden"
style="border-radius: 25px; overflow: hidd en;" uk-lightbox="animation: scale" uk-grid>
<div>
<a href="assets/images/post/img-1.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/post/img-1.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/post/img-3.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/post/img-3.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/post/img-2.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/post/img-2.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/post/img-4.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/post/img-4.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/img-1.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/img-1.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/img-2.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/img-2.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/img-3.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/img-3.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/img-4.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/img-4.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/listing-1.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/listing-1.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/listing-2.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/listing-2.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/listing-3.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/listing-3.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/listing-4.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/listing-4.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/listing-5.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/listing-5.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/events/listing-6.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/events/listing-6.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/category/img6.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/category/img6.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
<div>
<a href="assets/images/category/img5.jpg" data-caption="Image caption">
<div class="sl_photo_list" data-src="assets/images/category/img5.jpg" uk-img>
<div class="sl_photo_list-content">
<div>
<h4> Image description </h4>
<p> <span>Like </span>
<span> Comment </span>
<span> Share</span>
</p>
</div>
<div>
<span class="uil-cloud-download btn-down"></span>
</div>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- Chat sidebar -->
<a class="chat-plus-btn" href="#sidebar-chat" uk-toggle>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
<path fill="currentColor" d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z"></path>
</svg>
<!-- Chat -->
</a>
<div id="sidebar-chat" class="sidebar-chat px-3" uk-offcanvas="flip: true; overlay: true">
<div class="uk-offcanvas-bar">
<div class="sidebar-chat-head mb-2">
<div class="btn-actions">
<a href="#" uk-tooltip="title: Search ;offset:7"
uk-toggle="target: .sidebar-chat-search; animation: uk-animation-slide-top-small"> <i
class="icon-feather-search"></i> </a>
<a href="#" uk-tooltip="title: settings ;offset:7"> <i class="icon-feather-settings"></i> </a>
<a href="#"> <i class="uil-ellipsis-v"></i> </a>
<a href="#" class="uk-hidden@s"> <button class="uk-offcanvas-close uk-close" type="button" uk-close>
</button> </a>
</div>
<h2> Chats </h2>
</div>
<div class="sidebar-chat-search" hidden>
<input type="text" class="uk-input" placeholder="Search in Messages">
<span class="btn-close"
uk-toggle="target: .sidebar-chat-search; animation: uk-animation-slide-top-small"> <i
class="icon-feather-x"></i> </span>
</div>
<ul class="uk-child-width-expand sidebar-chat-tabs" uk-tab>
<li class="uk-active"><a href="#">Users</a></li>
<li><a href="#">Groups</a></li>
</ul>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-2.jpg" alt="">
<span class="online-dot"></span> </div>
<h5> Dennis Han</h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-1.jpg" alt="">
<span class="online-dot"></span> </div>
<h5> Erica Jones </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-7.jpg" alt="">
<span class="offline-dot"></span> </div>
<h5> Stella Johnson </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-5.jpg" alt="">
<span class="offline-dot"></span> </div>
<h5> Alex Dolgove </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-2.jpg" alt="">
<span class="online-dot"></span> </div>
<h5> Dennis Han</h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-4.jpg" alt="">
<span class="online-dot"></span> </div>
<h5> Erica Jones </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-3.jpg" alt="">
<span class="offline-dot"></span> </div>
<h5> Stella Johnson </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-5.jpg" alt="">
<span class="offline-dot"></span> </div>
<h5> Alex Dolgove </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-2.jpg" alt="">
<span class="online-dot"></span> </div>
<h5> Dennis Han</h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-4.jpg" alt="">
<span class="online-dot"></span> </div>
<h5> Erica Jones </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-3.jpg" alt="">
<span class="offline-dot"></span> </div>
<h5> Stella Johnson </h5>
</div>
</a>
<a href="#">
<div class="contact-list">
<div class="contact-list-media"> <img src="assets/images/avatars/avatar-5.jpg" alt="">
<span class="offline-dot"></span> </div>
<h5> Alex Dolgove </h5>
</div>
</a>
</div>
</div>
<div class="story-pop uk-animation-slide-bottom-small">
<div class="story-side uk-width-1-4@s">
<div class="uk-flex uk-flex-between uk-flex-middle mb-2">
<h2 class="mb-0" style="font-weight: 700">All Story</h2>
<a href="#" class="text-primary"> Setting</a>
</div>
<div class="story-side-innr" data-simplebar>
<h4 class="mb-1"> Your Story</h4>
<ul class="story-side-list">
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-1.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Stella Johnson </h5>
<p> Share a photo or video</p>
</div>
<div class="add-story-btn">
<i class="uil-plus"></i>
</div>
</a>
</li>
</ul>
<div class="uk-flex uk-flex-between uk-flex-middle my-3">
<h4 class="m-0"> Friends Story</h4>
<a href="#" class="text-primary"> See all</a>
</div>
<ul class="story-side-list"
uk-switcher="connect: #story-slider-switcher ; animation: uk-animation-slide-right-medium, uk-animation-slide-left-medium">
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-1.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Dennis Han </h5>
<p> <span class="story-count"> 2 new </span> <span class="story-time-ago"> 4hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Stella Johnson </h5>
<p> <span class="story-count"> 3 new </span> <span class="story-time-ago"> 1hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-4.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Erica Jones </h5>
<p> <span class="story-count"> 2 new </span> <span class="story-time-ago"> 3hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-7.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Adrian Mohani </h5>
<p> <span class="story-count"> 1 new </span> <span class="story-time-ago"> 4hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-5.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Alex Dolgove </h5>
<p> <span class="story-count"> 3 new </span> <span class="story-time-ago"> 7hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-1.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Stella Johnson </h5>
<p> <span class="story-count"> 2 new </span> <span class="story-time-ago"> 8hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-2.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Erica Jones </h5>
<p> <span class="story-count"> 3 new </span> <span class="story-time-ago"> 10hr ago
</span></p>
</div>
</a>
</li>
<li>
<a href="#">
<div class="story-user-media">
<img src="assets/images/avatars/avatar-5.jpg" alt="">
</div>
<div class="story-user-innr">
<h5> Alex Dolgove </h5>
<p> <span class="story-count"> 3 new </span> <span class="story-time-ago"> 14hr ago
</span></p>
</div>
</a>
</li>
</ul>
</div>
</div>
<div class="story-content">
<!-- close button-->
<span class="story-btn-close" uk-toggle="target: body ; cls: is-open"
uk-tooltip="title:Close story ; pos: left "></span>
<div class="story-content-innr">
<ul id="story-slider-switcher" class="uk-switcher">
<li>
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/post/img-1.jpg" alt="">
</div>
</li>
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-1.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div class="story-slider-image">
<img src="assets/images/post/img-3.jpg" alt="">
</div>
</li>
<li>
<div class="story-slider-image">
<img src="assets/images/avatars/avatar-lg-3.jpg" alt="">
</div>
</li>
<li>
<div class="story-slider-image">
<img src="assets/images/avatars/avatar-lg-2.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
<li>
<!-- slider navigation -->
<a href="#" uk-switcher-item="previous"
class="uk-position-center-left-out uk-position-medium slidenav-prev"></a>
<a href="#" uk-switcher-item="next"
class="uk-position-center-right-out uk-position-medium slidenav-next"></a>
<div class="uk-position-relative uk-visible-toggle" uk-slider>
<!-- navigation -->
<ul class="uk-slider-nav uk-dotnav story-slider-nav"></ul>
<!-- Story posted image -->
<ul class="uk-slider-items uk-child-width-1-1 story-slider">
<li>
<div
class="story-slider-image uk-animation-kenburns uk-animation-reverse uk-transform-origin-center-left">
<img src="assets/images/avatars/avatar-lg-4.jpg" alt="">
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- javaScripts
================================================== -->
<script src="assets/js/uikit.js"></script>
<script src="assets/js/simplebar.js"></script>
</body>
</html>