ekoetki/public/template/blog_read_more.html

1866 lines
124 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<meta content="IE=edge" http-equiv="X-UA-Compatible">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="Multipurpose, super flexible, powerful, clean modern responsive bootstrap 5 admin template"
name="description">
<meta content="admin template, ki-admin admin template, dashboard template, flat admin template, responsive admin template, web app"
name="keywords">
<meta content="la-themes" name="author">
<link href="../assets/images/logo/favicon.png" rel="icon" type="image/x-icon">
<link href="../assets/images/logo/favicon.png" rel="shortcut icon" type="image/x-icon">
<title>Blog Details | ki-admin - Premium Admin Template</title>
<!--font-awesome-css-->
<link href="../assets/vendor/fontawesome/css/all.css" rel="stylesheet">
<!-- Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect">
<link crossorigin href="https://fonts.gstatic.com" rel="preconnect">
<link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap"
rel="stylesheet">
<!-- tabler icons-->
<link href="../assets/vendor/tabler-icons/tabler-icons.css" rel="stylesheet" type="text/css">
<!--flag Icon css-->
<link href="../assets/vendor/flag-icons-master/flag-icon.css" rel="stylesheet" type="text/css">
<!-- glight css -->
<link href="../assets/vendor/glightbox/glightbox.min.css" rel="stylesheet">
<!-- Bootstrap css-->
<link href="../assets/vendor/bootstrap/bootstrap.min.css" rel="stylesheet" type="text/css">
<!-- simplebar css-->
<link href="../assets/vendor/simplebar/simplebar.css" rel="stylesheet" type="text/css">
<!-- slick css -->
<link href="../assets/vendor/slick/slick.css" rel="stylesheet">
<link href="../assets/vendor/slick/slick-theme.css" rel="stylesheet">
<!-- App css-->
<link href="../assets/css/style.css" rel="stylesheet" type="text/css">
<!-- Responsive css-->
<link href="../assets/css/responsive.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="app-wrapper">
<div class="loader-wrapper">
<div class="loader_24"></div>
</div>
<!-- Menu Navigation starts -->
<nav>
<div class="app-logo">
<a class="logo d-inline-block" href="index.html">
<img alt="#" src="../assets/images/logo/1.png">
</a>
<span class="bg-light-primary toggle-semi-nav d-flex-center">
<i class="ti ti-chevron-right"></i>
</span>
<div class="d-flex align-items-center nav-profile p-3">
<span class="h-45 w-45 d-flex-center b-r-10 position-relative bg-danger m-auto">
<img alt="avatar" class="img-fluid b-r-10" src="../assets/images/avatar/woman.jpg">
<span class="position-absolute top-0 end-0 p-1 bg-success border border-light rounded-circle"></span>
</span>
<div class="flex-grow-1 ps-2">
<h6 class="text-primary mb-0"> Ninfa Monaldo</h6>
<p class="text-muted f-s-12 mb-0">Web Developer</p>
</div>
<div class="dropdown profile-menu-dropdown">
<a aria-expanded="false" data-bs-auto-close="true" data-bs-placement="top" data-bs-toggle="dropdown"
role="button">
<i class="ti ti-settings fs-5"></i>
</a>
<ul class="dropdown-menu">
<li class="dropdown-item">
<a class="f-w-500" href="profile.html" target="_blank">
<i class="ph-duotone ph-user-circle pe-1 f-s-20"></i> Profile Details
</a>
</li>
<li class="dropdown-item">
<a class="f-w-500" href="setting.html" target="_blank">
<i class="ph-duotone ph-gear pe-1 f-s-20"></i> Settings
</a>
</li>
<li class="dropdown-item">
<div class="d-flex align-items-center justify-content-between">
<div>
<a class="f-w-500" href="blog_read_more.html#">
<i class="ph-duotone ph-detective pe-1 f-s-20"></i> Incognito
</a>
</div>
<div class="flex-shrink-0">
<div class="form-check form-switch">
<input class="form-check-input form-check-primary" id="incognitoSwitch"
type="checkbox">
</div>
</div>
</div>
</li>
<li class="dropdown-item">
<a class="mb-0 text-secondary f-w-500" href="sign_up.html" target="_blank">
<i class="ph-bold ph-plus pe-1 f-s-20"></i> Add account
</a>
</li>
<li class="app-divider-v dotted py-1"></li>
<li class="dropdown-item">
<a class="mb-0 text-danger" href="sign_in.html" target="_blank">
<i class="ph-duotone ph-sign-out pe-1 f-s-20"></i> Log Out
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="app-nav" id="app-simple-bar">
<ul class="main-nav p-0 mt-2">
<li class="menu-title">
<span>Dashboard</span>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#dashboard">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#home"></use>
</svg>
dashboard
<span class="badge bg-danger badge-dashboard badge-notification ms-2">New</span>
</a>
<ul class="collapse" id="dashboard">
<li><a href="index.html">Ecommerce</a></li>
<li><a href="project_dashboard.html">Project</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#apps">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#stack"></use>
</svg>
Apps
</a>
<ul class="collapse" id="apps">
<li><a href="calendar.html">Calender</a></li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#Profile-page">
Profile
</a>
<ul class="collapse" id="Profile-page">
<li><a href="profile.html">Profile</a></li>
<li><a href="setting.html">Setting</a></li>
</ul>
</li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#projects-page">
Projects Page
</a>
<ul class="collapse" id="projects-page">
<li><a href="project_app.html">projects</a></li>
<li><a href="project_details.html">projects Details</a></li>
</ul>
</li>
<li><a href="to_do.html">To-Do</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="api.html">API</a></li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#ticket-page">
Ticket
</a>
<ul class="collapse" id="ticket-page">
<li><a href="ticket.html">Ticket</a></li>
<li><a href="ticket_details.html">Ticket Details</a></li>
</ul>
</li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#email-page">
Email Page
</a>
<ul class="collapse" id="email-page">
<li><a href="email.html"> Email</a></li>
<li><a href="read_email.html">Read Email</a></li>
</ul>
</li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#e-shop">
E-shop
</a>
<ul class="collapse" id="e-shop">
<li><a href="cart.html">Cart</a></li>
<li><a href="product.html">Product</a></li>
<li><a href="add_product.html">Add Product</a></li>
<li><a href="product_details.html">Product-Details</a></li>
<li><a href="product_list.html">Product list</a></li>
<li><a href="orders.html">Orders</a></li>
<li><a href="orders_details.html">Orders Details</a></li>
<li><a href="orders_list.html">Orders List</a></li>
<li><a href="checkout.html">Check out</a></li>
<li><a href="wishlist.html">Wishlist</a></li>
</ul>
</li>
<li><a href="invoice.html">Invoice</a></li>
<li><a href="chat.html">Chat</a></li>
<li><a href="file_manager.html">File manager</a></li>
<li><a href="bookmark.html">Bookmark</a></li>
<li><a href="kanban_board.html">Kanban board</a></li>
<li><a href="timeline.html">Timeline</a></li>
<li><a href="faq.html">FAQS</a></li>
<li><a href="pricing.html">Pricing</a></li>
<li><a href="gallery.html">Gallery</a></li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#blog-page">
Blog Page
</a>
<ul class="collapse" id="blog-page">
<li><a href="blog.html">Blog</a></li>
<li><a href="blog_read_more.html">Blog Details</a></li>
<li><a href="add_blog.html">Add Blog</a></li>
</ul>
</li>
</ul>
</li>
<li class="no-sub">
<a href="widget.html">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#squares"></use>
</svg>
Widgets
</a>
</li>
<li class="menu-title"><span>Component</span></li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#ui-kits">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#briefcase"></use>
</svg>
UI kits
</a>
<ul class="collapse" id="ui-kits">
<li><a href="cheatsheet.html">Cheatsheet</a></li>
<li><a href="alert.html">Alert</a></li>
<li><a href="badges.html">Badges</a></li>
<li><a href="buttons.html">Buttons</a></li>
<li><a href="cards.html">Cards</a></li>
<li><a href="dropdown.html">Dropdown</a></li>
<li><a href="grid.html">Grid</a></li>
<li><a href="avatar.html">Avatar</a></li>
<li><a href="tabs.html">Tabs</a></li>
<li><a href="accordions.html">Accordions</a></li>
<li><a href="progress.html">Progress</a></li>
<li><a href="notifications.html">Notifications</a></li>
<li><a href="list.html">Lists</a></li>
<li><a href="helper_classes.html">Helper Classes</a></li>
<li><a href="background.html">Background</a></li>
<li><a href="divider.html">Divider</a></li>
<li><a href="ribbons.html">Ribbons</a></li>
<li><a href="editor.html">Editor </a></li>
<li><a href="collapse.html">Collapse</a></li>
<li><a href="footer-page.html">Footer</a></li>
<li><a href="shadow.html">Shadow</a></li>
<li><a href="wrapper.html">Wrapper</a></li>
<li><a href="bullet.html">Bullet</a></li>
<li><a href="placeholder.html">Placeholder</a></li>
<li><a href="alignment.html">Alignment Thing</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#advance-ui">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#briefcase-advance"></use>
</svg>
Advance UI
<span class=" badge rounded-pill bg-warning badge-notification ms-2">
12+
<span class="visually-hidden">unread messages</span>
</span>
</a>
<ul class="collapse" id="advance-ui">
<li><a href="modals.html">Modals</a></li>
<li><a href="offcanvas.html">Offcanvas Toggle</a></li>
<li><a href="sweetalert.html">Sweat Alert</a></li>
<li><a href="scrollbar.html">Scrollbar</a></li>
<li><a href="spinners.html">Spinners</a></li>
<li><a href="animation.html">Animation</a></li>
<li><a href="video_embed.html">Video Embed</a></li>
<li><a href="tour.html">Tour</a></li>
<li><a href="slick.html">Slider</a></li>
<li><a href="bootstrap_slider.html">Bootstrap Slider</a></li>
<li><a href="scrollpy.html">Scrollpy</a></li>
<li><a href="tooltips_popovers.html">Tooltip & Popovers</a></li>
<li><a href="ratings.html">Rating</a></li>
<li><a href="prismjs.html">Prismjs</a></li>
<li><a href="count_down.html">Count Down</a></li>
<li><a href="count_up.html"> Count up </a></li>
<li><a href="draggable.html">Draggable</a></li>
<li><a href="tree-view.html">Tree View</a></li>
<li><a href="block_ui.html">Block Ui </a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#icons">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#gift"></use>
</svg>
Icons
</a>
<ul class="collapse" id="icons">
<li><a href="fontawesome.html">Fontawesome</a></li>
<li><a href="flag_icons.html">Flag</a></li>
<li><a href="tabler-icons.html">Tabler</a></li>
<li><a href="weather_icon.html">Weather</a></li>
<li><a href="animated_icon.html">Animated</a></li>
<li><a href="iconoir_icon.html">Iconoir</a></li>
<li><a href="phosphor.html">Phosphor</a></li>
</ul>
</li>
<li class="no-sub">
<a href="misc.html">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#rectangle"></use>
</svg>
Misc
</a>
</li>
<li class="menu-title"><span>Map & Charts </span></li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#maps">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#location"></use>
</svg>
Map
</a>
<ul class="collapse" id="maps">
<li><a href="google-map.html">Google Maps</a></li>
<li><a href="leaflet-map.html">Leaflet map</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#chart">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#chart"></use>
</svg>
Chart
</a>
<ul class="collapse" id="chart">
<li><a href="chart_js.html">Chart js</a></li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#apexcharts-page">
Apexcharts
</a>
<ul class="collapse" id="apexcharts-page">
<li><a href="line.html">Line</a></li>
<li><a href="area_charts.html">Area</a></li>
<li><a href="column.html">Column</a></li>
<li><a href="bar.html">Bar</a></li>
<li><a href="mixed.html">Mixed</a></li>
<li><a href="timeline_range_charts.html">Timeline & Range-Bars</a></li>
<li><a href="candlestick_charts.html">Candlestick</a></li>
<li><a href="boxplot.html">Boxplot</a></li>
<li><a href="bubble.html">Bubble</a></li>
<li><a href="scatter.html">Scatter</a></li>
<li><a href="heatmap.html">Heatmap</a></li>
<li><a href="treemap.html">Treemap</a></li>
<li><a href="pie_charts.html">Pie</a></li>
<li><a href="radial_bar.html">Radial bar</a></li>
<li><a href="radar_chart.html">Radar</a></li>
</ul>
</li>
</ul>
</li>
<li class="menu-title"><span>Table & forms </span></li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#table">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#table"></use>
</svg>
Table
</a>
<ul class="collapse" id="table">
<li><a href="basic_table.html">BasicTable</a></li>
<li><a href="data_table.html">Data Table</a></li>
<li><a href="list_table.html">List Js</a></li>
<li><a href="advance_table.html">Advance Table</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#forms">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#wallet"></use>
</svg>
Forms elements
</a>
<ul class="collapse" id="forms">
<li><a href="form_validation.html">Form Validation</a></li>
<li><a href="base_inputs.html">Base Input</a></li>
<li><a href="checkbox_radio.html">Checkbox & Radio</a></li>
<li><a href="input_groups.html">Input Groups</a></li>
<li><a href="input_masks.html">Input Masks</a></li>
<li><a href="floating_labels.html">Floating Labels</a></li>
<li><a href="date_picker.html">Datetimepicker</a></li>
<li><a href="touch_spin.html">Touch spin</a></li>
<li><a href="select.html">Select2</a></li>
<li><a href="switch.html">Switch</a></li>
<li><a href="range_slider.html">Range Slider</a></li>
<li><a href="typeahead.html">Typeahead</a></li>
<li><a href="textarea.html">Textarea</a></li>
<li><a href="clipboard.html">Clipboard</a></li>
<li><a href="file_upload.html">File Upload</a></li>
<li><a href="dual_list_boxes.html">Dual List Boxes</a></li>
<li><a href="default_forms.html">Default Forms</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#ready_to_use">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#newspaper"></use>
</svg>
Ready to use
<span class="badge text-bg-success badge-notification ms-2">2</span>
</a>
<ul class="collapse" id="ready_to_use">
<li><a href="form_wizards.html">Form wizards</a></li>
<li><a href="form_wizard_1.html">Form wizards 1</a></li>
<li><a href="form_wizard_2.html">Form wizards 2</a></li>
<li><a href="ready_to_use_form.html">Ready To Use Form</a></li>
<li><a href="ready_to_use_table.html">Ready To Use Tables</a></li>
</ul>
</li>
<li class="menu-title"><span>Pages</span></li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#auth_pages">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#window"></use>
</svg>
Auth Pages
</a>
<ul class="collapse" id="auth_pages">
<li><a href="sign_in.html">Sign In</a></li>
<li><a href="sign_in_1.html">Sign In with Bg-image</a></li>
<li><a href="sign_up.html">Sign Up</a></li>
<li><a href="sign_up_1.html">Sign Up with Bg-image</a></li>
<li><a href="password_reset.html">Password Reset</a></li>
<li><a href="password_reset_1.html">Password Reset with Bg-image</a></li>
<li><a href="password_create.html">Password Create</a></li>
<li><a href="password_create_1.html">Password Create with Bg-image</a></li>
<li><a href="lock_screen.html">Lock Screen</a></li>
<li><a href="lock_screen_1.html">Lock Screen with Bg-image</a></li>
<li><a href="two_step_verification.html">Two-Step Verification</a></li>
<li><a href="two_step_verification_1.html">Two-Step Verification with Bg-image</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#error_pages">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#exclamation-circle"></use>
</svg>
Error Pages
</a>
<ul class="collapse" id="error_pages">
<li><a href="error_400.html">Bad Request </a></li>
<li><a href="error_403.html">Forbidden </a></li>
<li><a href="error_404.html">Not Found</a></li>
<li><a href="error_500.html">Internal Server</a></li>
<li><a href="error_503.html">Service Unavailable</a></li>
</ul>
</li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#other_pages">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#document"></use>
</svg>
Other Pages
</a>
<ul class="collapse" id="other_pages">
<li><a href="blank.html">Blank</a></li>
<li><a href="maintenance.html">Maintenance</a></li>
<li><a href="landing.html">Landing Page</a></li>
<li><a href="coming_soon.html">Coming Soon</a></li>
<li><a href="sitemap.html">Sitemap</a></li>
<li><a href="privacy_policy.html">Privacy Policy</a></li>
<li><a href="terms_condition.html">Terms &amp; Condition</a></li>
</ul>
</li>
<li class="menu-title"><span>Others</span></li>
<li>
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#level">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#arrow-down"></use>
</svg>
2 level
</a>
<ul class="collapse" id="level">
<li><a href="blog_read_more.html#">Blank</a></li>
<li class="another-level">
<a aria-expanded="false" data-bs-toggle="collapse" href="blog_read_more.html#level2">
Another level
</a>
<ul class="collapse" id="level2">
<li><a href="blank.html">Blank</a></li>
</ul>
</li>
</ul>
</li>
<li class="no-sub">
<a href="https://phpstack-1384472-5121645.cloudwaysapps.com/document/html/ki-admin/index.html">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#document-text"></use>
</svg>
Document
</a>
</li>
<li class="no-sub">
<a href="mailto:teqlathemes@gmail.com">
<svg stroke="currentColor" stroke-width="1.5">
<use xlink:href="../assets/svg/_sprite.svg#chat-bubble"></use>
</svg>
Support
</a>
</li>
</ul>
</div>
<div class="menu-navs">
<span class="menu-previous"><i class="ti ti-chevron-left"></i></span>
<span class="menu-next"><i class="ti ti-chevron-right"></i></span>
</div>
</nav>
<!-- Menu Navigation ends -->
<div class="app-content">
<div class="">
<!-- Header Section starts -->
<header class="header-main">
<div class="container-fluid">
<div class="row">
<div class="col-8 col-sm-6 d-flex align-items-center header-left p-0">
<span class="header-toggle ">
<i class="ph ph-squares-four"></i>
</span>
<div class="header-searchbar w-100">
<form action="blog_read_more.html#" class="mx-sm-3 app-form app-icon-form ">
<div class="position-relative">
<input aria-label="Search" class="form-control" placeholder="Search..."
type="search">
<i class="ti ti-search text-dark"></i>
</div>
</form>
</div>
</div>
<div class="col-4 col-sm-6 d-flex align-items-center justify-content-end header-right p-0">
<ul class="d-flex align-items-center">
<li class="header-language">
<div class="flex-shrink-0 dropdown" id="lang_selector">
<a aria-expanded="false" class="d-block head-icon ps-0"
data-bs-toggle="dropdown"
href="blog_read_more.html#">
<div class="lang-flag lang-en ">
<span class="flag rounded-circle overflow-hidden">
<i class=""></i>
</span>
</div>
</a>
<ul class="dropdown-menu language-dropdown header-card border-0">
<li class="lang lang-en selected dropdown-item p-2" data-bs-placement="top"
data-bs-toggle="tooltip" title="US">
<span class="d-flex align-items-center">
<i class="flag-icon flag-icon-usa flag-icon-squared rounded-circle f-s-20"></i>
<span class="ps-2">US</span>
</span>
</li>
<li class="lang lang-pt dropdown-item p-2" title="FR">
<span class="d-flex align-items-center">
<i class="flag-icon flag-icon-fra flag-icon-squared rounded-circle f-s-20"></i>
<span class="ps-2">France</span>
</span>
</li>
<li class="lang lang-es dropdown-item p-2" title="UK">
<span class="d-flex align-items-center">
<i class="flag-icon flag-icon-gbr flag-icon-squared rounded-circle f-s-20"></i>
<span class="ps-2">UK</span>
</span>
</li>
<li class="lang lang-es dropdown-item p-2" title="IT">
<span class="d-flex align-items-center">
<i class="flag-icon flag-icon-ita flag-icon-squared rounded-circle f-s-20"></i>
<span class="ps-2">Italy</span>
</span>
</li>
</ul>
</div>
</li>
<li class="header-apps">
<a aria-controls="appscanvasRights"
class="d-block head-icon bg-light-dark rounded-circle f-s-22 p-2"
data-bs-target="#appscanvasRights" data-bs-toggle="offcanvas"
href="blog_read_more.html#" role="button">
<i class="ph ph-bounding-box"></i>
</a>
<div aria-labelledby="appscanvasRightsLabel"
class="offcanvas offcanvas-end header-apps-canvas"
id="appscanvasRights"
tabindex="-1">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="appscanvasRightsLabel">Shortcut</h5>
<div class="app-dropdown flex-shrink-0">
<a aria-expanded="false" class=" p-1" data-bs-auto-close="outside"
data-bs-toggle="dropdown"
href="blog_read_more.html#"
role="button">
<i class="ph-bold ph-faders-horizontal f-s-20"></i>
</a>
<ul class="dropdown-menu mb-3">
<li class="dropdown-item">
<a href="setting.html" target="_blank">
Privacy Settings
</a>
</li>
<li class="dropdown-item">
<a href="setting.html" target="_blank">
Account Settings
</a>
</li>
<li class="dropdown-item">
<a href="setting.html" target="_blank">
Accessibility
</a>
</li>
<li class="dropdown-divider"></li>
<li class="dropdown-item border-0">
<a aria-expanded="false" data-bs-toggle="dropdown" href="blog_read_more.html#"
role="button">
More Settings
</a>
<ul class="dropdown-menu sub-menu">
<li class="dropdown-item">
<a href="setting.html" target="_blank">
Backup and Restore
</a>
</li>
<li class="dropdown-item">
<a href="setting.html" target="_blank">
<span>Data Usage</span>
</a>
</li>
<li class="dropdown-item">
<a href="setting.html" target="_blank">
<span>Theme</span>
</a>
</li>
<li class="dropdown-item d-flex align-items-center justify-content-between">
<a href="blog_read_more.html#">
<p class="mb-0">Notification</p>
</a>
<div class="flex-shrink-0">
<div class="form-check form-switch">
<input class="form-check-input form-check-primary"
id="notificationSwitch"
type="checkbox">
</div>
</div>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div class="offcanvas-body app-scroll">
<div class="row row-cols-3 g-2">
<div class="d-flex-center text-center">
<a class="text-light-primary w-100 rounded-3 py-3 px-2 "
href="product.html"
target="_blank">
<span>
<i class="ph-light ph-shopping-bag-open f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">E-shop</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-danger w-100 rounded-3 py-3 px-2 "
href="email.html"
target="_blank">
<span>
<i class="ph-light ph-envelope f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Email</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-success w-100 rounded-3 py-3 px-2 "
href="chat.html"
target="_blank">
<span>
<i class="ph-light ph-chat-circle-text f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Chat</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-warning w-100 rounded-3 py-3 px-2 "
href="project_app.html"
target="_blank">
<span>
<i class="ph-light ph-projector-screen-chart f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Project</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-info w-100 rounded-3 py-3 px-2 "
href="invoice.html"
target="_blank">
<span>
<i class="ph-light ph-scroll f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Invoice</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-dark w-100 rounded-3 py-3 px-2 "
href="blog.html"
target="_blank">
<span>
<i class="ph-light ph-notebook f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Blog</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-danger w-100 rounded-3 py-3 px-2 "
href="calendar.html"
target="_blank">
<span>
<i class="ph-light ph-calendar f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Calender</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-warning w-100 rounded-3 py-3 px-2 "
href="file_manager.html"
target="_blank">
<span>
<i class="ph-light ph-folder-open f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark txt-ellipsis-1">File
Manager</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-primary w-100 rounded-3 py-3 px-2 "
href="gallery.html"
target="_blank">
<span>
<i class="ph-light ph-google-photos-logo f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Gallery</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-success w-100 rounded-3 py-3 px-2 "
href="profile.html"
target="_blank">
<span>
<i class="ph-light ph-users-three f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Profile</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="text-light-secondary w-100 rounded-3 py-3 px-2 "
href="kanban_board.html"
target="_blank">
<span>
<i class="ph-light ph-selection-foreground f-s-30"></i>
</span>
<p class="mb-0 f-w-500 text-dark">Task Board</p>
</a>
</div>
<div class="d-flex-center text-center">
<a class="d-flex-center text-light-secondary w-100 h-100 rounded-3 p-2 dashed-1-secondary"
href="kanban_board.html"
target="_blank">
<span>
<i class="ph-light ph-plus f-s-30"></i>
</span>
</a>
</div>
</div>
</div>
</div>
</li>
<li class="header-cart">
<a aria-controls="cartcanvasRight"
class="d-block head-icon position-relative bg-light-dark rounded-circle f-s-22 p-2"
data-bs-target="#cartcanvasRight"
data-bs-toggle="offcanvas"
href="blog_read_more.html#" role="button">
<i class="ph ph-shopping-cart-simple"></i>
<span
class="position-absolute translate-middle badge rounded-pill bg-danger badge-notification">4</span>
</a>
<div aria-labelledby="cartcanvasRightLabel"
class="offcanvas offcanvas-end header-cart-canvas"
id="cartcanvasRight"
tabindex="-1">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="cartcanvasRightLabel">Cart</h5>
<button aria-label="Close" class="btn-close" data-bs-dismiss="offcanvas"
type="button"></button>
</div>
<div class="offcanvas-body app-scroll p-0">
<div class="head-container">
<div class="head-box">
<span class="b-1-light bg-light-primary h-45 w-45 d-flex-center b-r-6">
<img alt="cart" class="img-fluid p-1"
src="../assets/images/header/cart/01.png">
</span>
<div class="flex-grow-1 ms-2">
<a class="mb-0 f-w-600 f-s-16" href="product_details.html"
target="_blank"> Backpacks (3<i
class="ti ti-star-filled text-warning f-s-12"></i>)
</a>
<div>
<span class="text-dark"><span
class="text-secondary f-w-400">size</span> : M</span>
<span class="text-dark ms-2"><span
class="text-secondary f-w-400">color</span> :Pink</span>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<p class="text-muted f-w-500 mb-0">$600.50 x 1</p>
</div>
</div>
<div class="head-box">
<span class="b-1-light bg-light-primary h-45 w-45 d-flex-center b-r-6">
<img alt="cart" class="img-fluid p-1"
src="../assets/images/header/cart/05.png">
</span>
<div class="flex-grow-1 ms-2">
<a class="mb-0 f-w-600 f-s-16" href="product_details.html"
target="_blank"> Women's Watch (4<i
class="ti ti-star-filled text-warning f-s-12"></i>)</a>
<div>
<span class="text-dark"><span
class="text-secondary f-w-400">size</span> : S</span>
<span class="text-dark ms-2"><span
class="text-secondary f-w-400">color</span> :Rose Gold</span>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<p class="text-muted f-w-500 mb-0">$519.10 x 2</p>
</div>
</div>
<div class="head-box">
<span class="b-1-light bg-light-primary h-45 w-45 d-flex-center b-r-6">
<img alt="cart" class="img-fluid p-1"
src="../assets/images/header/cart/04.png">
</span>
<div class="flex-grow-1 ms-2">
<a class="mb-0 f-w-600 f-s-16" href="product_details.html"
target="_blank">Sandals (5 <i
class="ti ti-star-filled text-warning f-s-12"></i>)</a>
<div>
<span class="text-dark"><span
class="text-secondary f-w-400">size</span> : 8</span>
<span class="text-dark ms-2"><span
class="text-secondary f-w-400">color</span> :White</span>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<p class="text-muted f-w-500 mb-0">$390 x 2</p>
</div>
</div>
<div class="head-box ">
<span class="b-1-light bg-light-primary h-45 w-45 d-flex-center b-r-6">
<img alt="cart" class="img-fluid p-1"
src="../assets/images/header/cart/03.png">
</span>
<div class="flex-grow-1 ms-2">
<a class="mb-0 f-w-600 f-s-16" href="product_details.html"
target="_blank"> Jackets (3<i
class="ti ti-star-filled text-warning f-s-12"></i>)</a>
<div>
<span class="text-dark"><span
class="text-secondary f-w-400">size</span> : XL</span>
<span class="text-dark ms-2"><span
class="text-secondary f-w-400">color</span> :Blue</span>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<p class="text-muted f-w-500 mb-0">$300.00 x 2</p>
</div>
</div>
<div class="head-box ">
<span class="b-1-light bg-light-primary h-45 w-45 d-flex-center b-r-6">
<img alt="cart" class="img-fluid p-1"
src="../assets/images/header/cart/02.png">
</span>
<div class="flex-grow-1 ms-2">
<a class="mb-0 f-w-600 f-s-16" href="product_details.html"
target="_blank"> Shoes (3<i
class="ti ti-star-filled text-warning f-s-12"></i>)</a>
<div>
<span class="text-dark"><span
class="text-secondary f-w-400">size</span> : 9</span>
<span class="text-dark ms-2"><span
class="text-secondary f-w-400">color</span> :White</span>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<p class="text-muted f-w-500 mb-0">$450.00 x 1</p>
</div>
</div>
<div class="hidden-massage py-4 px-3">
<div>
<i class="ph-duotone ph-shopping-bag-open f-s-50 text-primary"></i>
<h6 class="mb-0">Your Cart is Empty</h6>
<p class="text-secondary mb-0">Add some items :)</p>
<a class="btn btn-light-primary btn-xs mt-2"
href="product_details.html">Shop
Now</a>
</div>
</div>
</div>
</div>
<div class="offcanvas-footer">
<div class="head-box-footer p-3">
<div class="mb-4">
<h6 class="text-muted f-w-600">Total <span
class="float-end text-primary">$3,468.00</span></h6>
</div>
<div class="header-cart-btn">
<a class="btn btn-primary" href="cart.html" role="button"
target="_blank">
<i class="ti ti-eye"></i> View Cart</a>
<a class="btn btn-success" href="checkout.html" role="button"
target="_blank">
Checkout <i class="ti ti-shopping-cart"></i></a>
</div>
</div>
</div>
</div>
</li>
<li class="header-dark">
<div class="sun-logo head-icon bg-light-dark rounded-circle f-s-22 p-2">
<i class="ph ph-moon-stars"></i>
</div>
<div class="moon-logo head-icon bg-light-dark rounded-circle f-s-22 p-2">
<i class="ph ph-sun-dim"></i>
</div>
</li>
<li class="header-notification">
<a aria-controls="notificationcanvasRight"
class="d-block head-icon position-relative bg-light-dark rounded-circle f-s-22 p-2"
data-bs-target="#notificationcanvasRight"
data-bs-toggle="offcanvas"
href="blog_read_more.html#"
role="button">
<i class="ph ph-bell"></i>
<span
class="position-absolute translate-middle p-1 bg-primary border border-light rounded-circle animate__animated animate__fadeIn animate__infinite animate__slower"></span>
</a>
<div aria-labelledby="notificationcanvasRightLabel"
class="offcanvas offcanvas-end header-notification-canvas"
id="notificationcanvasRight" tabindex="-1">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="notificationcanvasRightLabel">
Notification</h5>
<button aria-label="Close" class="btn-close" data-bs-dismiss="offcanvas"
type="button"></button>
</div>
<div class="offcanvas-body app-scroll p-0">
<div class="head-container">
<div class="notification-message head-box">
<div class="message-content-box flex-grow-1 pe-2">
<a class="f-s-15 text-dark mb-0"
href="read_email.html"><span
class="f-w-500 text-dark">Gene Hart</span> wants to
edit <span
class="f-w-500 text-dark">Report.doc</span></a>
<div>
<a class="d-inline-block f-w-500 text-success me-1"
href="blog_read_more.html#">Approve</a>
<a class="d-inline-block f-w-500 text-danger"
href="blog_read_more.html#">Deny</a>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<div>
<span class="badge text-light-primary"> sep 23 </span>
</div>
</div>
</div>
<div class="notification-message head-box">
<div class="message-content-box flex-grow-1 pe-2">
<a class="f-s-15 text-dark mb-0" href="read_email.html">Hey
<span
class="f-w-500 text-dark">Emery McKenzie</span>,
get ready: Your order from <span
class="f-w-500 text-dark">@Shopper.com</span></a>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<div>
<span class="badge text-light-primary"> sep 23 </span>
</div>
</div>
</div>
<div class="notification-message head-box">
<div class="message-content-box flex-grow-1 pe-2">
<a class="f-s-15 text-dark mb-0"
href="read_email.html"><span
class="f-w-500 text-dark">Simon Young</span> shared
a file called <span
class="f-w-500 text-dark">Dropdown.pdf</span></a>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<div>
<span class="badge text-light-primary"> 30 min</span>
</div>
</div>
</div>
<div class="notification-message head-box">
<div class="message-content-box flex-grow-1 pe-2">
<a class="f-s-15 text-dark mb-0"
href="read_email.html"><span
class="f-w-500 text-dark">Becky G. Hayes</span> has
added a comment to <span
class="f-w-500 text-dark">Final_Report.pdf</span></a>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<div>
<span class="badge text-light-primary"> 45 min</span>
</div>
</div>
</div>
<div class="notification-message head-box">
<div class="message-content-box flex-grow-1 pe-2">
<a class="f-s-15 text-dark mb-0 "
href="read_email.html"><span
class="f-w-600 text-dark">@Romaine</span>
invited you to a meeting
</a>
<div>
<a class="d-inline-block f-w-500 text-success me-1"
href="blog_read_more.html#">Join</a>
<a class="d-inline-block f-w-500 text-danger" href="blog_read_more.html#">Decline</a>
</div>
</div>
<div class="text-end">
<i class="ph ph-trash f-s-18 text-danger close-btn"></i>
<div>
<span class="badge text-light-primary"> 1 hour ago </span>
</div>
</div>
</div>
<div class="hidden-massage py-4 px-3">
<div>
<i class="ph-duotone ph-bell-ringing f-s-50 text-primary"></i>
</div>
<div>
<h6 class="mb-0">Notification Not Found</h6>
<p class="text-dark">When you have any notifications added
here,will
appear here.
</p>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</header>
<!-- Header Section ends -->
<!-- Body main section starts -->
<main>
<div class="container-fluid">
<!-- Breadcrumb start -->
<div class="row m-1">
<div class="col-12 ">
<h4 class="main-title">Blog Details</h4>
<ul class="app-line-breadcrumbs mb-3">
<li class="">
<a class="f-s-14 f-w-500" href="blog_read_more.html#">
<span>
<i class="ph-duotone ph-stack f-s-16"></i> Apps
</span>
</a>
</li>
<li>
<a class="f-s-14 f-w-500" href="blog_read_more.html#">Blog Page</a>
</li>
<li class="active">
<a class="f-s-14 f-w-500" href="blog_read_more.html#">Blog Details</a>
</li>
</ul>
</div>
</div>
<!-- Breadcrumb end -->
<!-- Blog Details start -->
<div class="row">
<div class="col-lg-8 col-xxl-9">
<div class="card">
<div class="card-body">
<div class="post-div mb-3">
<div class="row g-2">
<div class="col-12">
<video class="w-100 h-400 rounded" controls>
<source src="../assets/images/blog-app/video1.mp4" type="video/mp4">
<source src="https://phpstack-1384472-5121645.cloudwaysapps.com/template/html/ki-admin/template/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</div>
<div class="col-6 col-sm-3">
<a class="glightbox img-fluid" data-glightbox="type: image;"
href="../assets/images/blog-app/09.jpg">
<img alt="image" class="img-fluid"
src="../assets/images/blog-app/09.jpg">
</a>
</div>
<div class="col-6 col-sm-3">
<a class="glightbox img-fluid" data-glightbox="type: image;"
href="../assets/images/blog-app/05.jpg">
<img alt="image" class="img-fluid"
src="../assets/images/blog-app/05.jpg">
</a>
</div>
<div class="col-6 col-sm-3">
<a class="glightbox img-fluid" data-glightbox="type: image;"
href="../assets/images/blog-app/08.jpg">
<img alt="image" class="img-fluid"
src="../assets/images/blog-app/08.jpg">
</a>
</div>
<div class="col-6 col-sm-3">
<a class="glightbox img-fluid" data-glightbox="type: image;"
href="../assets/images/blog-app/04.jpg">
<img alt="image" class="img-fluid"
src="../assets/images/blog-app/04.jpg">
</a>
</div>
</div>
</div>
<h5 class="mb-3 text-dark f-w-600">Adjust your focus when life gets blurry.</h5>
<div class="mb-3">
<p class="text-secondary">
Photography is the art, application, and practice of creating images by
recording light, either
electronically by means of an image sensor, or chemically by means of a
light-sensitive material
such as photographic film.
</p>
<p class="text-secondary">
The word Photography literally means 'drawing with light', which derives
from the Greek photo,
meaning light and graph, meaning to draw. Photography is the process of
recording an image - a
photograph - on lightsensitive film or, in the case of digital photography,
via a digital
electronic or magnetic memory.
</p>
<div class="card card-light-secondary shadow-none my-3">
<div class="card-body">
<i class="ti ti-quote icon-bg"></i>
<p class="mb-2 text-dark f-w-700">
“I never stay in one country more than three months. Why? Because I
was interested in
seeing, and if I stay longer I become blind.”
</p>
<h6 class="text-secondary text-end"><cite>- Josef Koudelka.</cite></h6>
</div>
</div>
<p class="text-secondary mb-4">
In 1826, Phosphoric Niece first managed to fix an image that was captured
with a camera, but at
least eight hours or even several days of exposure in the camera were
required and the earliest
results were very crude. Niépce's associate Louis Daguerre went on to
develop the daguerreotype
process, the first publicly announced and commercially viable photographic
process. The
daguerreotype required only minutes of exposure in the camera, and produced
clear, finely
detailed results. The details were introduced to the world in 1839, a date
generally accepted as
the birth year of practical photography.The metal-based daguerreotype
process soon had some
competition from the paper-based calotype negative and salt print processes
invented by William
Henry Fox Talbot and demonstrated in 1839 soon after news about the
daguerreotype reached
Talbot. Subsequent innovations made photography easier and more versatile.
</p>
<div class="row mb-3">
<div class="col-md-6">
<h5 class="mb-3 text-dark f-w-600">List of photographers</h5>
<ul class="blog-list">
<li><span
class="text-dark f-w-500">Charlotte Abram (born 1993)</span>
- photographer and filmmaker
</li>
<li><span class="text-dark f-w-500">Jennifer Des (born 1975)</span>
- photographer
</li>
<li><span
class="text-dark f-w-500">Nathalie Gasses (born 1964)</span>
- writer, photographer
</li>
<li><span
class="text-dark f-w-500">Germaine Van Paras (1893 - 1983)</span>
- film director,
photographer, educator
</li>
<li><span
class="text-dark f-w-500">Katrin Vermeer (born 1979)</span>
-photographer, filmmaker
</li>
<li><span class="text-dark f-w-500">Stephanie Windings-rate (1939 - 2019)</span>
- artistic portrait
and animal photographer
</li>
<li><span
class="text-dark f-w-500">Claudia Andujar (born 1931)</span>
- Swiss-born Brazilian
photographer and photojournalist
</li>
<li><span
class="text-dark f-w-500">Brigida Baltar (born 1959)</span>
- visual artist and photographer
</li>
<li><span class="text-dark f-w-500">Alice Della (born 1987)</span> -
model, photographer
</li>
</ul>
</div>
<div class="col-md-6">
<a class="glightbox" data-glightbox="type: image; zoomable: true;"
href="../assets/images/blog-app/03.jpg">
<img alt="" class="w-100 rounded"
src="../assets/images/blog-app/03.jpg">
</a>
</div>
</div>
<p class="text-secondary">
The commercial introduction of computer-based electronic digital cameras in
the 1990s soon
revolutionized photography. During the first decade of the 21st century,
traditional film-based
photochemical methods were increasingly marginalized as the practical
advantages of the new
technology became widely appreciated and the image quality of moderately
priced digital cameras
was continually improved. Especially since cameras became a standard feature
on smartphones,
taking pictures (and instantly publishing them online) has become a
ubiquitous everyday practice
around the world.
</p>
</div>
<div class="app-divider-v mb-2"></div>
<div class="d-flex align-items-center flex-wrap ">
<div class="h-50 w-50 d-flex-center b-r-10 overflow-hidden">
<img alt="" class="bg-danger img-fluid" src="../assets/images/avatar/09.png">
</div>
<div class="flex-grow-1 ps-2 me-2">
<h6 class="mb-0 f-w-500 text-dark"> Bette Hagenes</h6>
<div class="text-muted f-s-12">26 Nov,2022</div>
</div>
<div>
<a class="btn btn-sm icon-btn b-r-5" href="blog_read_more.html#" role="button"> <i
class="ti ti-thumb-up f-s-20"></i></a>
<a class="btn btn-sm icon-btn b-r-5" href="blog_read_more.html#id1" role="button"> <i
class="ti ti-brand-hipchat f-s-20"></i></a>
<a class="btn btn-sm icon-btn b-r-5" href="blog_read_more.html#" role="button"> <i
class="ti ti-share f-s-20"></i></a>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h5>Comments</h5>
</div>
<div class="card-body">
<div class="blogcomment-box mb-3">
<div class="d-flex justify-content-between">
<div class="h-40 w-40 d-flex-center b-r-10 overflow-hidden comment-img">
<img alt="avatar" class="bg-warning img-fluid"
src="../assets/images/avatar/4.png">
</div>
<div class="commentdiv">
<h6 class="mb-0 text-dark f-w-600">Bette Hagenes <span
class="text-muted f-s-12"> 1 min</span></h6>
<p class="text-muted mb-0">
“Photography is the only language that can be understood anywhere in
the world.”
<span class="fs-6 d-inline-block text-secondary"><cite>- Bruno Barbey</cite></span>
</p>
<span class="badge text-light-secondary">lenora@gmail.com</span>
<span class="badge text-light-dark"> #beautiful</span>
</div>
<div>
<div class="btn-group dropdown-icon-none">
<a aria-expanded="false" class="icon-btn dropdown-toggle p-2"
data-bs-auto-close="true" data-bs-toggle="dropdown"
role="button">
<i class="ti ti-dots-vertical"></i>
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="blog_read_more.html#"><i
class="ti ti-share"></i> Share </a></li>
<li><a class="dropdown-item" href="blog_read_more.html#"><i class="ti ti-edit"></i>
Edit </a></li>
<li><a class="dropdown-item" href="blog_read_more.html#"><i
class="ti ti-trash"></i> Delete</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="blogcomment-box mb-3">
<div class="d-flex justify-content-between ">
<div class="h-40 w-40 d-flex-center b-r-10 overflow-hidden comment-img">
<img alt="avatar" class="bg-warning img-fluid"
src="../assets/images/avatar/4.png">
</div>
<div class="commentdiv">
<h6 class="mb-0 text-dark f-w-600">Bette Hagenes <span
class="text-muted f-s-12"> 1 min</span></h6>
<p class="text-muted mb-0">You're such a talented person with the
camera. I appreciate your work
,It's always good to work with a photographer who knows how to get
the job done. </p>
</div>
<div>
<div class="btn-group dropdown-icon-none">
<a aria-expanded="false" class="icon-btn dropdown-toggle p-2"
data-bs-auto-close="true" data-bs-toggle="dropdown"
role="button">
<i class="ti ti-dots-vertical"></i>
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="blog_read_more.html#"><i
class="ti ti-share"></i> Share </a></li>
<li><a class="dropdown-item" href="blog_read_more.html#"><i class="ti ti-edit"></i>
Edit </a></li>
<li><a class="dropdown-item" href="blog_read_more.html#"><i
class="ti ti-trash"></i> Delete</a></li>
</ul>
</div>
</div>
</div>
</div>
<h5 class="mb-3">Leave A Comment</h5>
<form class="app-form" id="id1">
<div class="row">
<div class="col-12">
<div class="mb-3">
<textarea class="form-control" placeholder="Enter Your Comment"
rows="3"></textarea>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<input class="form-control" placeholder="Enter Your Name"
type="text">
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<input class="form-control" placeholder="Enter Your Email"
type="email">
</div>
</div>
<div class="col">
<div class="text-end">
<button class="btn btn-primary" type="button">
<i class="ti ti-send"></i> Comment
</button>
</div>
</div>
</div>
</form>
</div>
</div>
<h5 class="mb-3">Related Posts</h5>
<div class="row">
<div class="col-md-6 col-xxl-4">
<div class="card blog-card overflow-hidden">
<a class="glightbox img-hover-zoom"
data-glightbox="type: image; zoomable: true;"
href="../assets/images/blog-app/01.jpg">
<img alt="..." class="card-img-top" src="../assets/images/blog-app/01.jpg">
</a>
<div class="tag-container">
<span class="badge">Lifestyle</span>
</div>
<div class="card-body">
<p class="text-body-secondary"><i class="ti ti-calendar-due"></i> 25.03.2022
</p>
<a class="bloglink" href="blog_read_more.html">
<h5 class="title-text mb-2">Photographs</h5>
</a>
<p class="card-text text-secondary">
“Photography is a way of feeling, of touching, of loving. What you have
caught on film…”
</p>
</div>
</div>
</div>
<div class="col-md-6 col-xxl-4">
<div class="card blog-card overflow-hidden">
<div class="img-hover-zoom">
<a class="glightbox img-hover-zoom"
data-glightbox="type: image; zoomable: true;"
href="../assets/images/blog-app/05.jpg">
<img alt="..." class="card-img-top"
src="../assets/images/blog-app/05.jpg">
</a>
</div>
<div class="tag-container">
<span class="badge text-light-secondary">Travel</span>
</div>
<div class="card-body">
<p class="text-body-secondary"><i class="ti ti-calendar-due"></i> 08.04.2022
</p>
<a class="bloglink" href="blog_read_more.html">
<h5 class="title-text mb-2">Living in the Moment</h5>
</a>
<p class="card-text text-secondary">
“I believe the happiness we feel in relation to animals is immensely...
</p>
</div>
</div>
</div>
<div class="col-md-6 col-xxl-4">
<div class="card blog-card overflow-hidden">
<div class="img-hover-zoom">
<a class="glightbox img-hover-zoom"
data-glightbox="type: image; zoomable: true;"
href="../assets/images/blog-app/04.jpg">
<img alt="..." class="card-img-top"
src="../assets/images/blog-app/04.jpg">
</a>
</div>
<div class="tag-container">
<span class="badge text-light-secondary">Travel</span>
</div>
<div class="card-body">
<p class="text-body-secondary"><i class="ti ti-calendar-due"></i> 25.03.2022
</p>
<a class="bloglink" href="blog_read_more.html">
<h5 class="title-text mb-2">Travel</h5>
</a>
<p class="card-text text-secondary">
Travel is the movement of people between distant geographical
locations.To travel ...
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-xxl-3">
<div class="row">
<!-- About Me start -->
<div class="col-12">
<div class="card">
<div class="card-header">
<h5>About Me</h5>
</div>
<div class="card-body">
<div class="text-secondary mb-3">
<p class="mb-3">
Hi! I am Aaliyah.
</p>
<p>
Over the last fifteen years of my career, I earned a sense of
creativity. I want to show the
beauty of life in a chaotic world.
</p>
<p>
In my first year as a photographer, I thought the photos I took
needed more spark. So I
enrolled in a graphic design class. I combined my photographs with
visual arts and finally
saw
what I was looking for. The spark!
</p>
</div>
<div class="">
<button class="btn btn-facebook icon-btn b-r-5" type="button">
<i class="ti ti-brand-facebook text-white"></i>
</button>
<button class="btn btn-whatsapp icon-btn b-r-5" type="button">
<i class="ti ti-brand-whatsapp text-white"></i>
</button>
<button class="btn btn-twitter icon-btn b-r-5" type="button">
<i class="ti ti-brand-twitter text-white"></i>
</button>
<button class="btn btn-github icon-btn b-r-5" type="button">
<i class="ti ti-brand-github text-white"></i>
</button>
</div>
</div>
</div>
</div>
<!-- About Me end -->
<!-- Categories start -->
<div class="col-md-6 col-lg-12">
<div class="card equal-card">
<div class="card-header">
<h5>Categories</h5>
</div>
<div class="card-body">
<ol class="list-group categories-list">
<li class="list-group-item d-flex justify-content-between align-items-start ">
<div class="me-auto categories-content">
<p class="text-primary f-w-600"><i
class="ti ti-chevron-right"></i> Fashion</p>
</div>
<span class="">[7]</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="me-auto categories-content">
<p class="text-secondary f-w-600"><i
class="ti ti-chevron-right"></i> Lifestyle</p>
</div>
<span class="">[10]</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="me-auto categories-content">
<p class="text-success f-w-600"><i
class="ti ti-chevron-right"></i> Food</p>
</div>
<span class="">[15]</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="me-auto categories-content">
<p class="text-warning f-w-600"><i
class="ti ti-chevron-right"></i> Travel</p>
</div>
<span class="">[20]</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="me-auto categories-content">
<p class="text-danger f-w-600"><i
class="ti ti-chevron-right"></i> Sports</p>
</div>
<span class="">[8]</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="me-auto categories-content">
<p class="f-w-600"><i class="ti ti-chevron-right"></i>
Technology</p>
</div>
<span class="">[10]</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-start">
<div class="me-auto categories-content">
<p class="text-info f-w-600"><i class="ti ti-chevron-right"></i>
Business</p>
</div>
<span class="">[25]</span>
</li>
</ol>
</div>
</div>
</div>
<!-- Categories end -->
<!-- Popular Blog Posts start -->
<div class="col-md-6 col-lg-12">
<div class="card">
<div class="card-header">
<h5>Popular Blog Posts</h5>
</div>
<div class="card-body popular-blog-list">
<div class="position-relative mb-3">
<div>
<div class="position-absolute">
<img alt="" class="w-40 h-40 bg-warning rounded"
src="../assets/images/avatar/5.png">
</div>
</div>
<div class="ms-5">
<p class="text-dark mb-0 f-w-500 f-s-14">There is a collage of large
headlines and pictures..</p>
<div class="text-secondary text-end text-end f-s-12">2 day ago</div>
</div>
</div>
<div class="position-relative mb-3">
<div>
<div class="position-absolute">
<img alt="" class="w-40 h-40 bg-danger rounded"
src="../assets/images/avatar/14.png">
</div>
</div>
<div class="ms-5">
<p class="text-dark mb-0 f-w-500 f-s-14">In addition, some
additional blog content is displayed..</p>
<div class="text-secondary text-end f-s-12">10 day ago</div>
</div>
</div>
<div class="position-relative mb-3">
<div>
<div class="position-absolute">
<img alt="" class="w-40 h-40 bg-primary rounded"
src="../assets/images/avatar/4.png">
</div>
</div>
<div class="ms-5">
<p class="text-dark mb-0 f-w-500 f-s-14">It also showcases the best
tech deals, helping people make. .</p>
<div class="text-secondary text-end f-s-12">1 day ago</div>
</div>
</div>
<div class="position-relative mb-3">
<div>
<div class="position-absolute">
<img alt="" class="w-40 h-40 bg-success rounded"
src="../assets/images/avatar/07.png">
</div>
</div>
<div class="ms-5">
<p class="text-dark mb-0 f-w-500 f-s-14">Further down the page, more
article headlines are sorted by the most..</p>
<div class="text-secondary text-end f-s-12">5min ago</div>
</div>
</div>
<div class="position-relative mb-3">
<div>
<div class="position-absolute">
<img alt="" class="w-40 h-40 bg-dark rounded"
src="../assets/images/avatar/09.png">
</div>
</div>
<div class="ms-5">
<p class="text-dark mb-0 f-w-500 f-s-14">The blog also does a great
job of emphasizing text readability..</p>
<div class="text-secondary text-end f-s-12">5min ago</div>
</div>
</div>
<div class="mt-3">
<a class="btn btn-md btn-primary w-100" href="blog.html" role="button"
target="_blank">
<i class="ti ti-plus"></i> View All
</a>
</div>
</div>
</div>
</div>
<!-- Popular Blog Posts end -->
<!-- Popular Blog Tags start -->
<div class="col-md-6 col-lg-12">
<div class="card">
<div class="card-header">
<h5>Popular Blog Tags</h5>
</div>
<div class="card-body">
<div class="blog-tags d-flex gap-2 f-s-16 flex-wrap">
<span class="badge text-light-dark">#Lifestyle</span>
<span class="badge text-light-secondary">#Blogging</span>
<span class="badge text-light-dark"> #beautiful</span>
<span class="badge text-light-secondary">#DesignBlogger</span>
<span class="badge text-light-dark"> #likeforlikes</span>
<span class="badge text-light-dark"> #vlog</span>
<span class="badge text-light-secondary"> #instafashion</span>
<span class="badge text-light-dark"> #lifestyleblogger</span>
<span class="badge text-light-secondary">#fashionista</span>
<span class="badge text-light-dark"> #blogueira</span>
<span class="badge text-light-dark">#bloggersofinstagram</span>
<span class="badge text-light-dark"> #news</span>
<span class="badge text-light-secondary"> #foodblogger</span>
<span class="badge text-light-dark"> #vlog</span>
<span class="badge text-light-secondary"> #instafashion</span>
<span class="badge text-light-dark">#beauty</span>
<span class="badge text-light-secondary"> #bloggerstyle</span>
</div>
</div>
</div>
</div>
<!-- Popular Blog Tags end -->
<div class="col-md-6 col-lg-12">
<div class="card">
<div class="card-header">
<h5>Subscribe</h5>
</div>
<div class="card-body">
<form class="app-form">
<div class="mb-3">
<label class="form-label f-w-500">Email</label>
<div class="input-group">
<input class="form-control form-control-sm"
placeholder="@gmail.com"
type="text">
<button class="btn btn-primary" type="button"><i
class="ti ti-mail-fast fs-5"></i></button>
</div>
</div>
<div class="mb-3">
<p class="text-success">Subscribe to our newsletter and stay
Updated</p>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Blog Details end -->
</div>
</main>
<!-- Body main section ends -->
<!-- tap on top -->
<div class="go-top">
<span class="progress-value">
<i class="ti ti-arrow-up"></i>
</span>
</div>
<!-- Footer Section starts-->
<footer>
<div class="container-fluid">
<div class="row">
<div class="col-md-9 col-12">
<p class="footer-text f-w-600 mb-0">Copyright © 2025 ki-admin. All rights reserved 💖
V1.0.0</p>
</div>
<div class="col-md-3">
<div class="footer-text text-end">
<a class="f-w-500 text-primary" href="mailto:teqlathemes@gmail.com"> Need Help <i
class="ti ti-help"></i></a>
</div>
</div>
</div>
</div>
</footer>
<!-- Footer Section ends-->
</div>
</div>
</div>
<!--customizer-->
<div id="customizer"></div>
<!-- latest jquery-->
<script src="../assets/js/jquery-3.6.3.min.js"></script>
<!-- Simple bar js-->
<script src="../assets/vendor/simplebar/simplebar.js"></script>
<!-- Bootstrap js-->
<script src="../assets/vendor/bootstrap/bootstrap.bundle.min.js"></script>
<!-- Glightbox js -->
<script src="../assets/vendor/glightbox/glightbox.min.js"></script>
<!-- phosphor js -->
<script src="../assets/vendor/phosphor/phosphor.js"></script>
<!-- slick-file -->
<script src="../assets/vendor/slick/slick.min.js"></script>
<!-- blog js -->
<script src="../assets/js/blog.js"></script>
<!-- App js-->
<script src="../assets/js/script.js"></script>
<!-- Customizer js-->
<script src="../assets/js/customizer.js"></script>
</body>
</html>