<!DOCTYPE html> <!-- Template: Sepia - Photography Portfolio HTML Website Template Author: Themetorium URL: https://themetorium.net --> <html lang="en"> <head> <!-- Title --> <title>Albums - Sepia - Photography Portfolio HTML Website Template</title> <!-- Meta --> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="description" content="Responsive Photography HTML5 Website Template"> <meta name="keywords" content="HTML5, CSS3, Bootsrtrap, Responsive, Photography, Portfolio, Template, Theme, Website, Themetorium" /> <meta name="author" content="themetorium.net"> <!-- Mobile Metas --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Favicon (http://www.favicon-generator.org/) --> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <link rel="icon" href="favicon.ico" type="image/x-icon"> <!-- Google Analytics (https://analytics.google.com/) --> <!-- Add your Google Analytics code here --> <!-- Google fonts (https://www.google.com/fonts) --> <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet"> <!-- Global font --> <!-- Bootstrap CSS (http://getbootstrap.com) --> <link rel="stylesheet" href="assets/vendor/bootstrap/css/bootstrap.min.css"> <!-- bootstrap CSS (http://getbootstrap.com) --> <!-- Libs and Plugins CSS --> <link rel="stylesheet" href="assets/vendor/animsition/css/animsition.min.css"> <!-- Animsition CSS (http://git.blivesta.com/animsition/) --> <link rel="stylesheet" href="assets/vendor/fontawesome/css/fontawesome-all.min.css"> <!-- Font Icons CSS (https://fontawesome.com) Free version! --> <link rel="stylesheet" href="assets/vendor/lightgallery/css/lightgallery.min.css"> <!-- lightGallery CSS (http://sachinchoolur.github.io/lightGallery) --> <link rel="stylesheet" href="assets/vendor/owl-carousel/css/owl.carousel.min.css"> <!-- Owl Carousel CSS (https://owlcarousel2.github.io/OwlCarousel2/) --> <link rel="stylesheet" href="assets/vendor/owl-carousel/css/owl.theme.default.min.css"> <!-- Owl Carousel CSS (https://owlcarousel2.github.io/OwlCarousel2/) --> <link rel="stylesheet" href="assets/vendor/ytplayer/css/jquery.mb.YTPlayer.min.css"> <!-- YTPlayer CSS (more info: https://github.com/pupunzi/jquery.mb.YTPlayer) --> <!-- Template master CSS --> <link rel="stylesheet" href="assets/css/helper.css"> <link rel="stylesheet" href="assets/css/theme.css"> <!-- Template dark style CSS (just uncomment line below to enable dark style) --> <!-- <link rel="stylesheet" href="assets/css/dark-style.css"> --> <!-- Template round style CSS (just uncomment line below to enable round style) --> <!-- <link rel="stylesheet" href="assets/css/round-style.css"> --> <!-- Template color skins CSS (just uncomment line below to enable color skin. One line at a time!) --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-red.css"> --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-green.css"> --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-blue.css"> --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-orange.css"> --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-purple.css"> --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-pink.css"> --> <!-- <link rel="stylesheet" href="assets/css/color-skins/skin-brown.css"> --> <!-- Template RTL mode CSS (just uncomment all 3 lines below to enable right to left mode) --> <!-- <link rel="stylesheet" href="assets/vendor/bootstrap/css/bootstrap-rtl/bootstrap-rtl.min.css"> --> <!-- <link rel="stylesheet" href="assets/css/rtl/theme-rtl.css"> --> <!-- <link rel="stylesheet" href="assets/css/rtl/helper-rtl.css"> --> <!-- HTML5 Shim and Respond.js 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="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]--> </head> <!-- =========== ///// Body ///// ================ * Use class "animsition" to enable page transition while page loads. * Use class "tt-boxed" to enable page boxed layout globally (affects all elements containing class "tt-wrap"). --> <body id="body" class="animsition"> <!-- ================= //// Begin header //// ====================== * Use class "header-show-hide-on-scroll" to hide header on scroll down and show on scroll up. * Use class "header-fixed-top" to set header to fixed position. * Use class "header-transparent" to set header to transparent. * Use class "menu-align-left" to align menu to left. * Use class "menu-align-right" to align menu to right. * Use class "menu-align-center" to align menu to center (do not use with header classes!). --> <header id="header" class="menu-align-right"> <!-- Begin header inner --> <div class="header-inner tt-wrap"> <!-- add/remove class "tt-wrap" to enable/disable element boxed layout (class "tt-boxed" is required in <body> tag! ) --> <!-- Begin logo ================ --> <div id="logo"> <a href="index.html" class="logo-dark"><img src="assets/img/logo-dark.png" alt="logo"></a> <a href="index.html" class="logo-light"><img src="assets/img/logo-light.png" alt="logo"></a> <!-- for small screens --> <a href="index.html" class="logo-dark-m"><img src="assets/img/logo-dark-m.png" alt="logo"></a> <a href="index.html" class="logo-light-m"><img src="assets/img/logo-light-m.png" alt="logo"></a> </div> <!-- End logo --> <!-- ==================== //// Begin main menu //// ===================== --> <nav class="tt-main-menu"> <!-- Begin mobile menu toggle button --> <div id="tt-m-menu-toggle-btn"> <span></span> </div> <!-- End mobile menu toggle button --> <!-- Begin menu tools ====================== --> <div class="tt-menu-tools"> <ul> <!-- Begin search --> <li> <a href="#" class="tt-clobal-search-trigger"><i class="fas fa-search"></i></a> <div class="tt-clobal-search"> <div class="tt-clobal-search-inner"> <span class="tt-clobal-search-title">Search</span> <form id="tt-clobal-search-form" class="form-btn-inside" method="get" action="search-results.html"> <input type="text" id="tt-clobal-search-input" name="search" placeholder="Type your keywords ..."> <button type="submit"><i class="fas fa-search"></i></button> </form> </div> <!-- /.tt-clobal-search-inner --> <div class="tt-clobal-search-close"><i class="tt-close-btn tt-close-light"></i></div> </div> <!-- /.tt-clobal-search --> </li> <!-- End search --> <!-- Begin tt-dropdown (languages) =================================== * Use class "tt-dropdown-dark" to enable dropdown dark style. --> <li class="tt-dropdown-wrap tt-dropdown-master tt-dropdown-dark tt-dropdown-right tt-tools-lang"> <a href="#0"><img src="assets/img/flags/gb.png" alt="English"> EN</a> <ul class="tt-dropdown"> <li><a href="" title="English"><img src="assets/img/flags/gb.png" alt="English"> EN</a></li> <li><a href="" title="French"><img src="assets/img/flags/fr.png" alt="French"> FR</a></li> <li><a href="" title="Deutsch"><img src="assets/img/flags/de.png" alt="Deutsch"> DE</a></li> </ul> <!-- /.tt-dropdown --> </li> <!-- End tt-dropdown --> <!-- Begin call to action button --> <li> <a href="https://themeforest.net/item/sepia-photography-portfolio-html-website-template/20195226?ref=Themetorium" class="tt-tools-button" target="_blank">Buy<span class="hide-from-sm"> This Theme</span>!</a> </li> <!-- End call to action button --> </ul> </div> <!-- End menu tools --> <!-- Collect the nav links for toggling ======================================== * Use class "tt-submenu-dark" to enable submenu dark style. --> <div class="tt-menu-collapse tt-submenu-dark"> <ul class="tt-menu-nav"> <!-- Begin submenu (submenu master) ==================================== --> <li class="tt-submenu-wrap tt-submenu-master"> <a href="#0">Home</a> <ul class="tt-submenu"> <li><a href="home-landing.html">Home Landing</a></li> <li><a href="home-intro-slideshow.html">Slideshow</a></li> <li><a href="albums-slideshow.html">Slideshow + Thumb.</a></li> <li><a href="home-intro-full-screen.html">Full Screen Slideshow</a></li> <li><a href="categories-carousel.html">Categories Carousel</a></li> <li><a href="home-intro-image.html">Static Image Intro</a></li> <li><a href="home-intro-video.html">Video Intro</a></li> <li><a href="home-intro-video-full-screen.html">Full Screen Video Intro</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu (sub-master) --> <!-- Begin submenu (submenu master) ==================================== --> <li class="tt-submenu-wrap tt-submenu-master"> <a href="#0">About</a> <ul class="tt-submenu"> <li><a href="about-me.html">About Me</a></li> <li><a href="about-me-fluid.html">About Me Fluid</a></li> <li><a href="about-me-2.html">About Me 2</a></li> <li><a href="about-me-2-fluid.html">About Me 2 Fluid</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu (sub-master) --> <!-- Begin submenu (submenu master) ==================================== --> <li class="tt-submenu-wrap tt-submenu-master"> <a href="#0">Portfolio</a> <ul class="tt-submenu"> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Albums</a> <ul class="tt-submenu"> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Grid</a> <ul class="tt-submenu"> <li><a href="albums-grid.html">Grid Default</a></li> <li><a href="albums-grid-2.html">Grid 2</a></li> <li><a href="albums-grid-fluid.html">Grid Fluid</a></li> <li><a href="albums-grid-fluid-2.html">Grid Fluid 2</a></li> <li><a href="albums-grid-fluid-3.html">Grid Fluid 3</a></li> <li><a href="albums-grid-fluid-4.html">Grid Fluid 4</a></li> <li><a href="albums-grid-no-crop.html">Grid No Crop</a></li> <li><a href="albums-grid-simple.html">Grid Simple</a></li> <li><a href="albums-grid-styles.html">Grid Item Styles</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Carousel</a> <ul class="tt-submenu"> <li><a href="albums-carousel.html">Albums Carousel</a></li> <li><a href="albums-carousel-no-crop.html">Carousel No Crop</a></li> <li><a href="albums-carousel-split.html">Carousel Split</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Archive</a> <ul class="tt-submenu"> <li><a href="albums-archive.html">Archive Default</a></li> <li><a href="albums-archive-fluid.html">Archive Fluid</a></li> <li><a href="albums-archive-fluid-2.html">Archive Fluid 2</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <li><a href="albums-one-column.html">One Column</a></li> <li><a href="albums-one-column-fluid.html">One Column Fluid</a></li> <li><a href="albums-slideshow.html">Slideshow + Thumb.</a></li> <li><a href="albums-thumbnails-list.html">Thumbnails List</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Gallery</a> <ul class="tt-submenu"> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Gallery Carousel</a> <ul class="tt-submenu"> <li><a href="gallery-single-carousel.html">Carousel Default</a></li> <li><a href="gallery-single-carousel-2.html">Carousel + Info</a></li> <li><a href="gallery-single-carousel-center.html">Carousel Center</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Gallery Grid</a> <ul class="tt-submenu"> <li><a href="gallery-single-grid.html">Grid Default</a></li> <li><a href="gallery-single-grid-2.html">Grid 2</a></li> <li><a href="gallery-single-grid-cropped.html">Grid Cropped</a></li> <li><a href="gallery-single-grid-fluid.html">Grid Fluid</a></li> <li><a href="gallery-single-grid-fluid-2.html">Grid Fluid 2</a></li> <li><a href="gallery-single-grid-fluid-2-cropped.html">Grid Fluid 2 Cropped</a></li> <li><a href="gallery-single-grid-fluid-3.html">Grid Fluid 3</a></li> <li><a href="gallery-single-grid-fluid-3-cropped.html">Grid Fluid 3 Cropped</a></li> <li><a href="gallery-single-grid-simple.html">Grid Simple</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Gallery + Sidebar</a> <ul class="tt-submenu"> <li><a href="gallery-single-sidebar-left.html">Sidebar Left</a></li> <li><a href="gallery-single-sidebar-left-simple.html">Sidebar Left Simple</a></li> <li><a href="gallery-single-sidebar-right.html">Sidebar Right</a></li> <li><a href="gallery-single-sidebar-right-simple.html">Sidebar Right Simple</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Gallery Styles</a> <ul class="tt-submenu"> <li><a href="gallery-single-grid-style-default.html">Default</a></li> <li><a href="gallery-single-grid-style-colored.html">Colored</a></li> <li><a href="gallery-single-grid-style-zoom-only.html">Zoom Only</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Categories</a> <ul class="tt-submenu"> <li><a href="categories-carousel.html">Carousel</a></li> <li><a href="categories-grid.html">Grid</a></li> <li><a href="categories-grid-fluid.html">Grid Fluid</a></li> <li><a href="categories-grid-fluid-2.html">Grid Fluid 2</a></li> <li><a href="categories-grid-fluid-3.html">Grid Fluid 3</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu (sub-master) --> <!-- Begin submenu (submenu master) ==================================== --> <li class="tt-submenu-wrap tt-submenu-master"> <a href="#0">Blog</a> <ul class="tt-submenu"> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Blog List</a> <ul class="tt-submenu"> <li><a href="blog-list-classic.html">Classic</a></li> <li><a href="blog-list-simple.html">Classic Simple</a></li> <li><a href="blog-list-grid.html">Grid</a></li> <li><a href="blog-list-grid-fluid.html">Grid Fluid</a></li> <li><a href="blog-list-grid-no-sidebar.html">Grid No Sidebar</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Blog Single Post</a> <ul class="tt-submenu"> <li><a href="blog-single.html">Default</a></li> <li><a href="blog-single-alter.html">Alternate</a></li> <li><a href="blog-single-simple.html">Simple</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Blog Archive</a> <ul class="tt-submenu"> <li><a href="blog-archive.html">Archive Default</a></li> <li><a href="blog-archive-2.html">Archive Classic</a></li> <li><a href="blog-archive-3.html">Archive Grid</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu (sub-master) --> <!-- Begin submenu (submenu master) ==================================== --> <li class="tt-submenu-wrap tt-submenu-master"> <a href="#0">Contact</a> <ul class="tt-submenu"> <li><a href="contact.html">Contact Default</a></li> <li><a href="contact-fluid.html">Contact Fluid</a></li> <li><a href="contact-simple.html">Contact Simple</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu (sub-master) --> <!-- Begin submenu (submenu master) ==================================== --> <li class="tt-submenu-wrap tt-submenu-master"> <a href="#0">More</a> <ul class="tt-submenu"> <!-- Begin submenu =================== --> <li class="tt-submenu-wrap"> <a href="#0">Dummy Pages</a> <ul class="tt-submenu"> <li><a href="page-dummy-classic.html">No Sidebar</a></li> <li><a href="page-dummy-classic-sidebar-left.html">Sidebar Left</a></li> <li><a href="page-dummy-classic-sidebar-right.html">Sidebar Right</a></li> <li><a href="page-dummy-modern.html">Modern</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu --> <li><a href="page-404.html">404 Error</a></li> <li><a href="page-404-2.html">404 Error 2</a></li> <li><a href="page-faq.html">FAQ</a></li> <li><a href="page-pricing.html">Pricing</a></li> <li><a href="search-results.html">Search Results</a></li> <li><a href="page-password.html">Password Protected</a></li> <li><a href="footer-styles.html">Footer Styles</a></li> </ul> <!-- /.tt-submenu --> </li> <!-- End submenu (sub-master) --> </ul> <!-- /.tt-menu-nav --> </div> <!-- /.tt-menu-collapse --> </nav> <!-- End main menu --> </div> <!-- End header inner --> </header> <!-- End header --> <!-- ************************************* *********** Begin body content *********** ************************************** --> <div id="body-content"> <!-- ================================= ///// Begin gallery list section ///// ================================== --> <section id="gallery-list-section" class="gallery-list-carousel"> <div class="gallery-list-carousel-inner tt-wrap"> <!-- add/remove class "tt-wrap" to enable/disable element boxed layout (class "tt-boxed" is required in <body> tag! ) --> <div class="gl-carousel-wrap no-padding"> <!-- Optional: add class "no-padding" to disable paddings --> <!-- Begin content carousel (https://owlcarousel2.github.io/OwlCarousel2/) ==================================================================== * Use class "nav-outside" for outside nav (requires boxed layout). * Use class "nav-outside-top" for outside top nav (requires enough space at the top of the carousel). * Use class "nav-bottom-right" for bottom right nav. * Use class "nav-rounded" for rounded nav. * Use class "nav-light" to enable nav light style. * Use class "dots-outside" for outside dots (requires enough space at the bottom of the carousel). * Use class "dots-left", "dots-right" or "dots-center-right" to align dots. * Use class "dots-rounded" for rounded dots. * Use class "owl-mousewheel" to enable mousewheel support. * Use class "cursor-grab" to enable cursor grab icon (no effect on links!). * Use class "cc-hover-light", "cc-hover-dark" or "cc-hover-zoom" to enable carousel items hover effect. * Use class "cc-height-1", "cc-height-2", "cc-height-3", "cc-height-4", "cc-height-5", "cc-height-6" or "cc-height-full" to set carousel height (do not use with data-autoheight="true"!!!). * Use class "cc-height-m" to set full height for small screens (do not use with data-autoheight="true"!!!). ================================================================ * Available carousel data attributes: data-items="5".......................(items visible on desktop) data-tablet-landscape="4"............(items visible on mobiles) data-tablet-portrait="3".............(items visible on mobiles) data-mobile-landscape="2"............(items visible on tablets) data-mobile-portrait="1".............(items visible on tablets) data-loop="true".....................(true/false) data-margin="10".....................(space between items) data-center="true"...................(true/false) data-start-position="0"..............(item start position) data-animate-in="fadeIn".............(fade-in animation) data-animate-out="fadeOut"...........(fade-out animation) data-mouse-drag="false"..............(true/false) data-touch-drag="false"..............(true/false) data-autoheight="true"...............(true/false) data-autoplay="true".................(true/false) data-autoplay-timeout="5000".........(milliseconds) data-autoplay-hover-pause="true".....(true/false) data-autoplay-speed="800"............(milliseconds) data-drag-end-speed="800"............(milliseconds) data-nav="true"......................(true/false) data-nav-speed="800".................(milliseconds) data-dots="false"....................(true/false) data-dots-speed="800"................(milliseconds) --> <div class="owl-carousel cc-height-full owl-mousewheel nav-bottom-right cc-hover-dark cc-hover-zoom" data-items="4" data-dots="false" data-nav="true" data-nav-speed="800" data-autoplay="true" data-autoplay-timeout="8000" data-autoplay-speed="800" data-autoplay-hover-pause="true" data-tablet-landscape="3" data-tablet-portrait="3" data-mobile-landscape="2" data-mobile-portrait="1"> <!-- Begin carousel item ========================= --> <a href="gallery-single-carousel-center.html" class="cc-item"> <!-- cc image --> <div class="cc-image bg-image" style="background-image: url(assets/img/gallery/gallery-list/striped/gallery-striped-8.jpg); background-position: 50% 50%;"></div> <!-- Begin caption =================== * Position classes: "top-left", "top-center", "top-right", "center-left", "center", "center-right", "bottom-left", "bottom-center", "bottom-right". * Size classes: "cc-caption-xs", "cc-caption-sm", "cc-caption-lg", "cc-caption-xlg", "cc-caption-xxlg". --> <div class="cc-caption cc-caption-lg bottom-left"> <!-- max width class is optional --> <div class="cc-category"><span>Fashion</span></div> <h2 class="cc-title">New Fashion <br>Collection</h2> </div> <!-- End caption --> </a> <!-- End carousel item --> <!-- Begin carousel item ========================= --> <a href="gallery-single-carousel-center.html" class="cc-item"> <!-- cc image --> <div class="cc-image bg-image" style="background-image: url(assets/img/gallery/gallery-list/striped/gallery-striped-9.jpg); background-position: 50% 50%;"></div> <!-- Begin caption =================== * Position classes: "top-left", "top-center", "top-right", "center-left", "center", "center-right", "bottom-left", "bottom-center", "bottom-right". * Size classes: "cc-caption-xs", "cc-caption-sm", "cc-caption-lg", "cc-caption-xlg", "cc-caption-xxlg". --> <div class="cc-caption cc-caption-lg bottom-left"> <!-- max width class is optional --> <div class="cc-category"><span>Technology</span></div> <h2 class="cc-title">Old Cars</h2> </div> <!-- End caption --> </a> <!-- End carousel item --> <!-- Begin carousel item ========================= --> <a href="gallery-single-carousel-center.html" class="cc-item"> <!-- cc image --> <div class="cc-image bg-image" style="background-image: url(assets/img/gallery/gallery-list/striped/gallery-striped-10.jpg); background-position: 50% 50%;"></div> <!-- Begin caption =================== * Position classes: "top-left", "top-center", "top-right", "center-left", "center", "center-right", "bottom-left", "bottom-center", "bottom-right". * Size classes: "cc-caption-xs", "cc-caption-sm", "cc-caption-lg", "cc-caption-xlg", "cc-caption-xxlg". --> <div class="cc-caption cc-caption-lg bottom-left"> <div class="cc-category"><span>Outdoor</span></div> <h2 class="cc-title">One Day Shoot <br> With Ordinary People</h2> </div> <!-- End caption --> </a> <!-- End carousel item --> <!-- Begin carousel item ========================= --> <a href="gallery-single-carousel-center.html" class="cc-item"> <!-- cc image --> <div class="cc-image bg-image" style="background-image: url(assets/img/gallery/gallery-list/striped/gallery-striped-11.jpg); background-position: 50% 50%;"></div> <!-- Begin caption =================== * Position classes: "top-left", "top-center", "top-right", "center-left", "center", "center-right", "bottom-left", "bottom-center", "bottom-right". * Size classes: "cc-caption-xs", "cc-caption-sm", "cc-caption-lg", "cc-caption-xlg", "cc-caption-xxlg". --> <div class="cc-caption cc-caption-lg bottom-left"> <!-- max width class is optional --> <div class="cc-category"><span>Nature</span></div> <h2 class="cc-title">Beautiful <br>Leaves</h2> </div> <!-- End caption --> </a> <!-- End carousel item --> <!-- Begin carousel item ========================= --> <a href="gallery-single-carousel-center.html" class="cc-item"> <!-- cc image --> <div class="cc-image bg-image" style="background-image: url(assets/img/gallery/gallery-list/striped/gallery-striped-5.jpg); background-position: 50% 50%;"></div> <!-- Begin caption =================== * Position classes: "top-left", "top-center", "top-right", "center-left", "center", "center-right", "bottom-left", "bottom-center", "bottom-right". * Size classes: "cc-caption-xs", "cc-caption-sm", "cc-caption-lg", "cc-caption-xlg", "cc-caption-xxlg". --> <div class="cc-caption cc-caption-lg bottom-left"> <!-- max width class is optional --> <div class="cc-category"><span>Nature</span></div> <h2 class="cc-title">Waterfall & <br>Woman</h2> </div> <!-- End caption --> </a> <!-- End carousel item --> <!-- Begin carousel item ========================= --> <a href="gallery-single-carousel-center.html" class="cc-item"> <!-- cc image --> <div class="cc-image bg-image" style="background-image: url(assets/img/gallery/gallery-list/striped/gallery-striped-6.jpg); background-position: 50% 50%;"></div> <!-- Begin caption =================== * Position classes: "top-left", "top-center", "top-right", "center-left", "center", "center-right", "bottom-left", "bottom-center", "bottom-right". * Size classes: "cc-caption-xs", "cc-caption-sm", "cc-caption-lg", "cc-caption-xlg", "cc-caption-xxlg". --> <div class="cc-caption cc-caption-lg bottom-left"> <!-- max width class is optional --> <div class="cc-category"><span>Nature</span></div> <h2 class="cc-title">Wild <br>Animals</h2> </div> <!-- End caption --> </a> <!-- End carousel item --> </div> <!-- End content carousel --> </div> <!-- /.gl-carousel-wrap --> </div> <!-- /.gallery-list-carousel-inner --> </section> <!-- End gallery list section --> <!-- ============================================ ///// Begin footer section (footer minimal) ///// ================================================= * Use class "footer-dark" to enable dark footer. * Use class "no-margin-top" if needed. --> <section id="footer" class="footer-minimal no-margin-top bg-transparent"> <div class="footer-inner"> <div class="footer-container tt-wrap"> <div class="row"> <div class="col-md-6 col-md-push-6"> <!-- Begin social buttons --> <div class="social-buttons"> <ul> <li><a href="https://www.facebook.com/themetorium" class="btn btn-social-min btn-default btn-link" title="Follow me on Facebook" target="_blank"><i class="fab fa-facebook-f"></i></a></li> <li><a href="https://twitter.com/Themetorium" class="btn btn-social-min btn-default btn-link" title="Follow me on Twitter" target="_blank"><i class="fab fa-twitter"></i></a></li> <li><a href="https://plus.google.com/+SiiliOnu" class="btn btn-social-min btn-default btn-link" title="Follow me on Google+" target="_blank"><i class="fab fa-google-plus-g"></i></a></li> <li><a href="https://www.pinterest.com/themetorium" class="btn btn-social-min btn-default btn-link" title="Follow me on Pinterest" target="_blank"><i class="fab fa-pinterest-p"></i></a></li> <li><a href="https://dribbble.com/Themetorium" class="btn btn-social-min btn-default btn-link" title="Follow me on Dribbble" target="_blank"><i class="fab fa-dribbble"></i></a></li> <li><a href="contact.html" class="btn btn-social-min btn-default btn-link" title="Drop me a line" target="_blank"><i class="fas fa-envelope"></i></a></li> </ul> </div> <!-- End social buttons --> </div> <!-- /.col --> <div class="col-md-6 col-md-pull-6"> <!-- Begin footer copyright --> <div class="footer-copyright"> <p>© Sepia 2017 / All rights reserved</p> <p>Design by: <a href="https://themeforest.net/item/sepia-photography-portfolio-html-website-template/20195226?ref=Themetorium" target="_blank">Themetorium</a></p> </div> <!-- End footer copyright --> </div> <!-- /.col --> </div> <!-- /.row --> </div> <!-- /.footer-container --> </div> <!-- /.footer-inner --> </section> <!-- End footer section --> </div> <!-- End body content --> <!-- ==================== ///// Scripts below ///// ===================== --> <!-- Core JS --> <script src="assets/vendor/jquery/jquery.min.js"></script> <!-- jquery JS (https://jquery.com) --> <script src="assets/vendor/bootstrap/js/bootstrap.min.js"></script> <!-- bootstrap JS (http://getbootstrap.com) --> <!-- Libs and Plugins JS --> <script src="assets/vendor/animsition/js/animsition.min.js"></script> <!-- Animsition JS (http://git.blivesta.com/animsition/) --> <script src="assets/vendor/jquery.easing.min.js"></script> <!-- Easing JS (http://gsgd.co.uk/sandbox/jquery/easing/) --> <script src="assets/vendor/isotope.pkgd.min.js"></script> <!-- Isotope JS (http://isotope.metafizzy.co) --> <script src="assets/vendor/imagesloaded.pkgd.min.js"></script> <!-- ImagesLoaded JS (https://github.com/desandro/imagesloaded) --> <script src="assets/vendor/owl-carousel/js/owl.carousel.min.js"></script> <!-- Owl Carousel JS (https://owlcarousel2.github.io/OwlCarousel2/) --> <script src="assets/vendor/jquery.mousewheel.min.js"></script> <!-- A jQuery plugin that adds cross browser mouse wheel support (https://github.com/jquery/jquery-mousewheel) --> <script src="assets/vendor/ytplayer/js/jquery.mb.YTPlayer.min.js"></script> <!-- YTPlayer JS (more info: https://github.com/pupunzi/jquery.mb.YTPlayer) --> <script src="assets/vendor/lightgallery/js/lightgallery-all.min.js"></script> <!-- lightGallery Plugins JS (http://sachinchoolur.github.io/lightGallery) --> <!-- Theme master JS --> <script src="assets/js/theme.js"></script> </body> </html>