| Server IP : 103.65.238.20 / Your IP : 10.0.0.10 Web Server : Apache System : Linux localhost.localdomain 3.10.0-1160.119.1.el7.x86_64 #1 SMP Tue Jun 4 14:43:51 UTC 2024 x86_64 User : www ( 1000) PHP Version : 7.3.32 Disable Function : passthru,exec,system,chroot,chgrp,chown,shell_exec,popen,proc_open,pcntl_exec,ini_alter,ini_restore,dl,openlog,syslog,readlink,symlink,popepassthru,pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,imap_open,apache_setenv MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : ON Directory : /www/wwwroot/jdih/frontend/web/libraria/ |
Upload File : |
<!DOCTYPE html>
<html lang="zxx">
<head>
<!-- Meta -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
<!-- Title -->
<title>..:: LIBRARIA ::..</title>
<!-- Favicon -->
<link href="images/favicon.ico" rel="icon" type="image/x-icon" />
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i%7CLato:100,100i,300,300i,400,400i,700,700i,900,900i" rel="stylesheet" />
<link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<!-- Mobile Menu -->
<link href="css/mmenu.css" rel="stylesheet" type="text/css" />
<link href="css/mmenu.positioning.css" rel="stylesheet" type="text/css" />
<!-- Stylesheet -->
<link href="style.css" rel="stylesheet" type="text/css" />
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="js/html5shiv.min.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- Start: Header Section -->
<header id="header-v1" class="navbar-wrapper inner-navbar-wrapper">
<div class="container">
<div class="row">
<nav class="navbar navbar-default">
<div class="row">
<div class="col-md-3">
<div class="navbar-header">
<div class="navbar-brand">
<h1>
<a href="index-2.html">
<img src="images/libraria-logo-v1.png" alt="LIBRARIA" />
</a>
</h1>
</div>
</div>
</div>
<div class="col-md-9">
<!-- Header Topbar -->
<div class="header-topbar hidden-sm hidden-xs">
<div class="row">
<div class="col-sm-6">
<div class="topbar-info">
<a href="tel:+61-3-8376-6284"><i class="fa fa-phone"></i>+61-3-8376-6284</a>
<span>/</span>
<a href="mailto:support@libraria.com"><i class="fa fa-envelope"></i>support@libraria.com</a>
</div>
</div>
<div class="col-sm-6">
<div class="topbar-links">
<a href="signin.html"><i class="fa fa-lock"></i>Login / Register</a>
<span>|</span>
<div class="header-cart dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
<i class="fa fa-shopping-cart"></i>
<small>0</small>
</a>
<div class="dropdown-menu cart-dropdown">
<ul>
<li class="clearfix">
<img src="images/header-cart-image-01.jpg" alt="cart item" />
<div class="item-info">
<div class="name">
<a href="#">The Great Gatsby</a>
</div>
<div class="author"><strong>Author:</strong> F. Scott Fitzgerald</div>
<div class="price">1 X $10.00</div>
</div>
<a class="remove" href="#"><i class="fa fa-trash-o"></i></a>
</li>
<li class="clearfix">
<img src="images/header-cart-image-02.jpg" alt="cart item" />
<div class="item-info">
<div class="name">
<a href="#">The Great Gatsby</a>
</div>
<div class="author"><strong>Author:</strong> F. Scott Fitzgerald</div>
<div class="price">1 X $10.00</div>
</div>
<a class="remove" href="#"><i class="fa fa-trash-o"></i></a>
</li>
<li class="clearfix">
<img src="images/header-cart-image-03.jpg" alt="cart item" />
<div class="item-info">
<div class="name">
<a href="#">The Great Gatsby</a>
</div>
<div class="author"><strong>Author:</strong> F. Scott Fitzgerald</div>
<div class="price">1 X $10.00</div>
</div>
<a class="remove" href="#"><i class="fa fa-trash-o"></i></a>
</li>
</ul>
<div class="cart-total">
<div class="title">SubTotal</div>
<div class="price">$30.00</div>
</div>
<div class="cart-buttons">
<a href="cart.html" class="btn btn-dark-gray">View Cart</a>
<a href="checkout.html" class="btn btn-primary">Checkout</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="navbar-collapse hidden-sm hidden-xs">
<ul class="nav navbar-nav">
<li class="dropdown active">
<a data-toggle="dropdown" class="dropdown-toggle disabled" href="index-2.html">Home</a>
<ul class="dropdown-menu">
<li><a href="index-2.html">Home V1</a></li>
<li><a href="home-v2.html">Home V2</a></li>
<li><a href="home-v3.html">Home V3</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle disabled" href="books-media-list-view.html">Books & Media</a>
<ul class="dropdown-menu">
<li><a href="books-media-list-view.html">Books & Media List View</a></li>
<li><a href="books-media-gird-view-v1.html">Books & Media Grid View V1</a></li>
<li><a href="books-media-gird-view-v2.html">Books & Media Grid View V2</a></li>
<li><a href="books-media-detail-v1.html">Books & Media Detail V1</a></li>
<li><a href="books-media-detail-v2.html">Books & Media Detail V2</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle disabled" href="news-events-list-view.html">News & Events</a>
<ul class="dropdown-menu">
<li><a href="news-events-list-view.html">News & Events List View</a></li>
<li><a href="news-events-detail.html">News & Events Detail</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle disabled" href="#">Pages</a>
<ul class="dropdown-menu">
<li><a href="cart.html">Cart</a></li>
<li><a href="checkout.html">Checkout</a></li>
<li><a href="signin.html">Signin/Register</a></li>
<li><a href="404.html">404/Error</a></li>
</ul>
</li>
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle disabled" href="blog.html">Blog</a>
<ul class="dropdown-menu">
<li><a href="blog.html">Blog Grid View</a></li>
<li><a href="blog-detail.html">Blog Detail</a></li>
</ul>
</li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
<div class="mobile-menu hidden-lg hidden-md">
<a href="#mobile-menu"><i class="fa fa-navicon"></i></a>
<div id="mobile-menu">
<ul>
<li class="mobile-title">
<h4>Navigation</h4>
<a href="#" class="close"></a>
</li>
<li>
<a href="index-2.html">Home</a>
<ul>
<li><a href="index-2.html">Home V1</a></li>
<li><a href="home-v2.html">Home V2</a></li>
<li><a href="home-v3.html">Home V3</a></li>
</ul>
</li>
<li>
<a href="books-media-list-view.html">Books & Media</a>
<ul>
<li><a href="books-media-list-view.html">Books & Media List View</a></li>
<li><a href="books-media-gird-view-v1.html">Books & Media Grid View V1</a></li>
<li><a href="books-media-gird-view-v2.html">Books & Media Grid View V2</a></li>
<li><a href="books-media-detail-v1.html">Books & Media Detail V1</a></li>
<li><a href="books-media-detail-v2.html">Books & Media Detail V2</a></li>
</ul>
</li>
<li>
<a href="news-events-list-view.html">News & Events</a>
<ul>
<li><a href="news-events-list-view.html">News & Events List View</a></li>
<li><a href="news-events-detail.html">News & Events Detail</a></li>
</ul>
</li>
<li>
<a href="#">Pages</a>
<ul>
<li><a href="cart.html">Cart</a></li>
<li><a href="checkout.html">Checkout</a></li>
<li><a href="signin.html">Signin/Register</a></li>
<li><a href="404.html">404/Error</a></li>
</ul>
</li>
<li>
<a href="blog.html">Blog</a>
<ul>
<li><a href="blog.html">Blog Grid View</a></li>
<li><a href="blog-detail.html">Blog Detail</a></li>
</ul>
</li>
<li><a href="services.html">Services</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
</nav>
</div>
</div>
</header>
<!-- End: Header Section -->
<!-- Start: Page Banner -->
<section class="page-banner services-banner">
<div class="container">
<div class="banner-header">
<h2>Books & Media Listing</h2>
<span class="underline center"></span>
<p class="lead">Proin ac eros pellentesque dolor pharetra tempo.</p>
</div>
<div class="breadcrumb">
<ul>
<li><a href="index-2.html">Home</a></li>
<li>Books & Media</li>
</ul>
</div>
</div>
</section>
<!-- End: Page Banner -->
<!-- Start: Products Section -->
<div id="content" class="site-content">
<div id="primary" class="content-area">
<main id="main" class="site-main">
<div class="books-full-width">
<div class="container">
<!-- Start: Search Section -->
<section class="search-filters">
<div class="filter-box">
<h3>What are you looking for at the library?</h3>
<form action="http://libraria.demo.presstigers.com/index.html" method="get">
<div class="col-md-4 col-sm-6">
<div class="form-group">
<input class="form-control" placeholder="Search by Keyword" id="keywords" name="keywords" type="text">
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="form-group">
<select name="catalog" id="catalog" class="form-control">
<option>Search the Catalog</option>
<option>Catalog 01</option>
<option>Catalog 02</option>
<option>Catalog 03</option>
<option>Catalog 04</option>
<option>Catalog 05</option>
</select>
</div>
</div>
<div class="col-md-3 col-sm-6">
<div class="form-group">
<select name="category" id="category" class="form-control">
<option>All Categories</option>
<option>Category 01</option>
<option>Category 02</option>
<option>Category 03</option>
<option>Category 04</option>
<option>Category 05</option>
</select>
</div>
</div>
<div class="col-md-2 col-sm-6">
<div class="form-group">
<input class="form-control" type="submit" value="Search">
</div>
</div>
</form>
</div>
<div class="clear"></div>
</section>
<!-- End: Search Section -->
<div class="filter-options margin-list">
<div class="row">
<div class="col-md-3 col-sm-3">
<select name="orderby">
<option selected="selected">Sort by Title</option>
<option>Sort by popularity</option>
<option>Sort by rating</option>
<option>Sort by newness</option>
<option>Sort by price</option>
</select>
</div>
<div class="col-md-3 col-sm-3">
<select name="orderby">
<option selected="selected">Sort by Author</option>
<option>Sort by popularity</option>
<option>Sort by rating</option>
<option>Sort by newness</option>
<option>Sort by price</option>
</select>
</div>
<div class="col-md-2 col-sm-3">
<select name="orderby">
<option selected="selected">Language</option>
<option>Sort by popularity</option>
<option>Sort by rating</option>
<option>Sort by newness</option>
<option>Sort by price</option>
</select>
</div>
<div class="col-md-2 col-sm-3">
<select name="orderby">
<option selected="selected">Publishing Date</option>
<option>Sort by popularity</option>
<option>Sort by rating</option>
<option>Sort by newness</option>
<option>Sort by price</option>
</select>
</div>
<div class="col-md-2 col-sm-12 pull-right">
<div class="filter-toggle">
<a href="books-media-gird-view-v2.html" class="active"><i class="glyphicon glyphicon-th-large"></i></a>
<a href="books-media-list-view.html"><i class="glyphicon glyphicon-th-list"></i></a>
</div>
</div>
</div>
</div>
<div class="booksmedia-fullwidth">
<ul>
<li>
<div class="book-list-icon blue-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-01.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail">
<i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon yellow-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-02.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon green-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-03.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon yellow-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-04.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon blue-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-05.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon red-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-06.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon green-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-07.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon light-green-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-07.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
<li>
<div class="book-list-icon red-icon"></div>
<figure>
<a href="books-media-detail-v2.html"><img src="images/books-media/layout-3/books-media-layout3-09.jpg" alt="Book"></a>
<figcaption>
<header>
<h4><a href="books-media-detail-v2.html">The Great Gatsby</a></h4>
<p><strong>Author:</strong> F. Scott Fitzgerald</p>
<p><strong>ISBN:</strong> 9781581573268</p>
</header>
<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. Pellentesque dolor turpis, pulvinar varius.</p>
<div class="actions">
<ul>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Add TO CART">
<i class="fa fa-shopping-cart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Like">
<i class="fa fa-heart"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Mail"><i class="fa fa-envelope"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Search">
<i class="fa fa-search"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Print">
<i class="fa fa-print"></i>
</a>
</li>
<li>
<a href="#" target="_blank" data-toggle="blog-tags" data-placement="top" title="Share">
<i class="fa fa-share-alt"></i>
</a>
</li>
</ul>
</div>
</figcaption>
</figure>
</li>
</ul>
</div>
<nav class="navigation pagination text-center">
<h2 class="screen-reader-text">Posts navigation</h2>
<div class="nav-links">
<a class="prev page-numbers" href="#."><i class="fa fa-long-arrow-left"></i> Previous</a>
<a class="page-numbers" href="#.">1</a>
<span class="page-numbers current">2</span>
<a class="page-numbers" href="#.">3</a>
<a class="page-numbers" href="#.">4</a>
<a class="next page-numbers" href="#.">Next <i class="fa fa-long-arrow-right"></i></a>
</div>
</nav>
</div>
<!-- Start: Staff Picks -->
<section class="team staff-picks">
<div class="container">
<div class="center-content">
<h2 class="section-title">Staff Picks</h2>
<span class="underline center"></span>
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
<div class="team-list">
<div class="team-member">
<figure>
<img src="images/books-media/staff-pick/staff-picks-01.jpg" alt="Staff Pick" />
</figure>
<div class="content-block">
<div class="member-info">
<div class="member-thumb">
<img src="images/books-media/staff-pick/gail.jpg" alt="Katherine">
</div>
<div class="member-content">
<span class="designation">Downtown & Business</span>
<h4>The Collector</h4>
<ul class="social">
<li>
<a href="#" target="_blank">
<i class="fa fa-linkedin"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-facebook-f"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-twitter"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-skype"></i>
</a>
</li>
</ul>
</div>
<p>The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here...</p>
<a class="btn btn-primary" href="#">Read More</a>
</div>
</div>
</div>
<div class="team-member">
<figure>
<img src="images/books-media/staff-pick/staff-picks-02.jpg" alt="Staff Pick" />
</figure>
<div class="content-block">
<div class="member-info">
<div class="member-thumb">
<img src="images/books-media/staff-pick/katherine.jpg" alt="Katherine">
</div>
<div class="member-content">
<span class="designation">Katherine, West End</span>
<h4>Mongolia</h4>
<ul class="social">
<li>
<a href="#" target="_blank">
<i class="fa fa-linkedin"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-facebook-f"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-twitter"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-skype"></i>
</a>
</li>
</ul>
</div>
<p>The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here...</p>
<a class="btn btn-primary" href="#">Read More</a>
</div>
</div>
</div>
<div class="team-member">
<figure>
<img src="images/books-media/staff-pick/staff-picks-03.jpg" alt="Staff Pick" />
</figure>
<div class="content-block">
<div class="member-info">
<div class="member-thumb">
<img src="images/books-media/staff-pick/chris.jpg" alt="Katherine">
</div>
<div class="member-content">
<span class="designation">Chris, East Liberty</span>
<h4>The Revolution</h4>
<ul class="social">
<li>
<a href="#" target="_blank">
<i class="fa fa-linkedin"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-facebook-f"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-twitter"></i>
</a>
</li>
<li>
<a href="#" target="_blank">
<i class="fa fa-skype"></i>
</a>
</li>
</ul>
</div>
<p>The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here...</p>
<a class="btn btn-primary" href="#">Read More</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End: Staff Picks -->
</div>
</main>
</div>
</div>
<!-- End: Products Section -->
<!-- Start: Social Network -->
<section class="social-network section-padding">
<div class="container">
<div class="center-content">
<h2 class="section-title">Follow Us</h2>
<span class="underline center"></span>
<p class="lead">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
<ul>
<li>
<a class="facebook" href="#" target="_blank">
<span>
<i class="fa fa-facebook-f"></i>
</span>
</a>
</li>
<li>
<a class="twitter" href="#" target="_blank">
<span>
<i class="fa fa-twitter"></i>
</span>
</a>
</li>
<li>
<a class="google" href="#" target="_blank">
<span>
<i class="fa fa-google-plus"></i>
</span>
</a>
</li>
<li>
<a class="rss" href="#" target="_blank">
<span>
<i class="fa fa-rss"></i>
</span>
</a>
</li>
<li>
<a class="linkedin" href="#" target="_blank">
<span>
<i class="fa fa-linkedin"></i>
</span>
</a>
</li>
<li>
<a class="youtube" href="#" target="_blank">
<span>
<i class="fa fa-youtube"></i>
</span>
</a>
</li>
</ul>
</div>
</section>
<!-- End: Social Network -->
<!-- Start: Footer -->
<footer class="site-footer">
<div class="container">
<div id="footer-widgets">
<div class="row">
<div class="col-md-4 col-sm-6 widget-container">
<div id="text-2" class="widget widget_text">
<h3 class="footer-widget-title">About Libraria</h3>
<span class="underline left"></span>
<div class="textwidget">
It is a long established fact that a reader will be distracted by the readable content of a page when looking.
</div>
<address>
<div class="info">
<i class="fa fa-location-arrow"></i>
<span>21 King Street, Melbourne, Victoria 3000 Australia</span>
</div>
<div class="info">
<i class="fa fa-envelope"></i>
<span><a href="mailto:support@libraria.com">support@libraria.com</a></span>
</div>
<div class="info">
<i class="fa fa-phone"></i>
<span><a href="tel:012-345-6789">+ 012-345-6789</a></span>
</div>
</address>
</div>
</div>
<div class="col-md-2 col-sm-6 widget-container">
<div id="nav_menu-2" class="widget widget_nav_menu">
<h3 class="footer-widget-title">Quick Links</h3>
<span class="underline left"></span>
<div class="menu-quick-links-container">
<ul id="menu-quick-links" class="menu">
<li><a href="#">Library News</a></li>
<li><a href="#">History</a></li>
<li><a href="#">Meet Our Staff</a></li>
<li><a href="#">Board of Trustees</a></li>
<li><a href="#">Budget</a></li>
<li><a href="#">Annual Report</a></li>
</ul>
</div>
</div>
</div>
<div class="clearfix hidden-lg hidden-md hidden-xs tablet-margin-bottom"></div>
<div class="col-md-2 col-sm-6 widget-container">
<div id="text-4" class="widget widget_text">
<h3 class="footer-widget-title">Timing</h3>
<span class="underline left"></span>
<div class="timming-text-widget">
<time datetime="2017-02-13">Mon - Thu: 9 am - 9 pm</time>
<time datetime="2017-02-13">Fri: 9 am - 6 pm</time>
<time datetime="2017-02-13">Sat: 9 am - 5 pm</time>
<time datetime="2017-02-13">Sun: 1 pm - 6 pm</time>
<ul>
<li><a href="#">Closings</a></li>
<li><a href="#">Branches</a></li>
</ul>
</div>
</div>
</div>
<div class="col-md-4 col-sm-6 widget-container">
<div class="widget twitter-widget">
<h3 class="footer-widget-title">Latest Tweets</h3>
<span class="underline left"></span>
<div id="twitter-feed">
<ul>
<li>
<p><a href="#">@TemplateLibraria</a> Sed ut perspiciatis unde omnis iste natus error sit voluptatem. <a href="#">template-libraria.com</a></p>
</li>
<li>
<p><a href="#">@TemplateLibraria</a> Sed ut perspiciatis unde omnis iste natus error sit voluptatem. <a href="#">template-libraria.com</a></p>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="sub-footer">
<div class="container">
<div class="row">
<div class="footer-text col-md-3">
<p><a target="_blank" href="https://www.templateshub.net">Templates Hub</a></p>
</div>
<div class="col-md-9 pull-right">
<ul>
<li><a href="index-2.html">Home</a></li>
<li><a href="books-media-list-view.html">Books & Media</a></li>
<li><a href="news-events-list-view.html">News & Events</a></li>
<li><a href="#">Kids & Teens</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="#">Research</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<!-- End: Footer -->
<!-- jQuery Latest Version 1.x -->
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<!-- jQuery UI -->
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<!-- jQuery Easing -->
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<!-- Bootstrap -->
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Mobile Menu -->
<script type="text/javascript" src="js/mmenu.min.js"></script>
<!-- Harvey - State manager for media queries -->
<script type="text/javascript" src="js/harvey.min.js"></script>
<!-- Waypoints - Load Elements on View -->
<script type="text/javascript" src="js/waypoints.min.js"></script>
<!-- Facts Counter -->
<script type="text/javascript" src="js/facts.counter.min.js"></script>
<!-- MixItUp - Category Filter -->
<script type="text/javascript" src="js/mixitup.min.js"></script>
<!-- Owl Carousel -->
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
<!-- Accordion -->
<script type="text/javascript" src="js/accordion.min.js"></script>
<!-- Responsive Tabs -->
<script type="text/javascript" src="js/responsive.tabs.min.js"></script>
<!-- Responsive Table -->
<script type="text/javascript" src="js/responsive.table.min.js"></script>
<!-- Masonry -->
<script type="text/javascript" src="js/masonry.min.js"></script>
<!-- Carousel Swipe -->
<script type="text/javascript" src="js/carousel.swipe.min.js"></script>
<!-- bxSlider -->
<script type="text/javascript" src="js/bxslider.min.js"></script>
<!-- Custom Scripts -->
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>