3890 lines
201 KiB
HTML
3890 lines
201 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<!--[if lt IE 7]><html class="no-js lt-ie10 lt-ie9 lt-ie8 lt-ie7 "> <![endif]-->
|
||
|
|
<!--[if IE 7]><html class="no-js lt-ie10 lt-ie9 lt-ie8"> <![endif]-->
|
||
|
|
<!--[if IE 8]><html class="no-js lt-ie10 lt-ie9"> <![endif]-->
|
||
|
|
<!--[if IE 9]><html class="no-js lt-ie10"> <![endif]-->
|
||
|
|
<!--[if gt IE 8]><!-->
|
||
|
|
<html class="no-js">
|
||
|
|
<!--<![endif]-->
|
||
|
|
|
||
|
|
<head>
|
||
|
|
|
||
|
|
<!-- Basic Page Needs -->
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>Be</title>
|
||
|
|
<meta name="description" content="">
|
||
|
|
<meta name="author" content="">
|
||
|
|
|
||
|
|
<!-- Mobile Specific Metas -->
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||
|
|
|
||
|
|
<!-- Favicons -->
|
||
|
|
<link rel="shortcut icon" href="images/favicon.ico">
|
||
|
|
|
||
|
|
<!-- FONTS -->
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Roboto:100,300,400,400italic,700'>
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Patua+One:100,300,400,400italic,700'>
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Lato:100,100,300,400,400italic,700'>
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Lora:100,300,400,400italic,500,700,700italic'>
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Pompiere:400'>
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Exo:400'>
|
||
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Old+Standard+TT:400'>
|
||
|
|
|
||
|
|
<!-- CSS -->
|
||
|
|
<link rel='stylesheet' href='../css/global.css'>
|
||
|
|
<link rel='stylesheet' href='css/structure.css'>
|
||
|
|
<link rel='stylesheet' href='css/betheme.css'>
|
||
|
|
<link rel='stylesheet' href='css/custom.css'>
|
||
|
|
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body class="color-custom style-default layout-full-width no-content-padding header-plain header-fw minimalist-header sticky-header sticky-white ab-hide subheader-both-center menuo-last menuo-right mm-vertical mobile-tb-hide mobile-mini-mr-ll">
|
||
|
|
<div id="Wrapper">
|
||
|
|
<div id="Header_wrapper">
|
||
|
|
<header id="Header">
|
||
|
|
<div class="header_placeholder"></div>
|
||
|
|
<div id="Top_bar">
|
||
|
|
<div class="container">
|
||
|
|
<div class="column one">
|
||
|
|
<div class="top_bar_left clearfix">
|
||
|
|
<div class="logo">
|
||
|
|
<span id="logo"><img class="logo-main scale-with-grid" src="images/theme.png" alt="theme"><img class="logo-sticky scale-with-grid" src="images/theme.png" alt="theme"><img class="logo-mobile scale-with-grid" src="images/theme.png" alt="theme"><img class="logo-mobile-sticky scale-with-grid" src="images/theme.png" alt="theme"></span>
|
||
|
|
</div>
|
||
|
|
<div class="menu_wrapper">
|
||
|
|
<nav id="menu" class="menu-main-menu-container">
|
||
|
|
<ul id="menu-main-menu" class="menu">
|
||
|
|
<li>
|
||
|
|
<a href="index.html"><span>Home</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="about.html"><span>Pages</span></a>
|
||
|
|
<ul class="mfn-megamenu">
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="about.html"><span><i class="icon-info"></i> About</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="careers.html"><span><i class="icon-heart-empty-fa"></i> Careers</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="contact.html"><span><i class="icon-address"></i> Contact</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="under-construction.html"><span><i class="icon-traffic-cone"></i> Under Construction</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="error.html"><span><i class="icon-traffic-cone"></i> Error 404</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="features.html"><span><i class="icon-star-empty"></i> Features</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="gallery.html"><span><i class="icon-picture"></i> Gallery</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blank-page.html"><span><i class="icon-doc"></i> Blank Page</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="help-center.html"><span><i class="icon-lifebuoy"></i> Help Center</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="how-it-works.html"><span><i class="icon-graduation-cap"></i> How it works?</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="our-team.html"><span><i class="icon-users"></i> Our team</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="features.html"><span><i class="icon-comment-fa"></i> Features</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="press.html"><span><i class="icon-newspaper"></i> Press</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="pricing.html"><span><i class="icon-money-line"></i> Pricing</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="sidebar.html"><span><i class="icon-list-add"></i> Sidebar</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="dual-sidebars.html"><span><i class=" icon-pause"></i> Dual Sidebars</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li class="current_page_item">
|
||
|
|
<a href="typography.html"><span>Shortcodes</span></a>
|
||
|
|
<ul class="mfn-megamenu">
|
||
|
|
<li class="hide-border">
|
||
|
|
<a class="mfn-megamenu-title" href="typography.html"><span>Typography</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#alert"><span>Alert</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#basic"><span>Basic</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#tooltip"><span>Blockquote</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#buttons"><span>Buttons</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#columns"><span>Columns</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#contentlink"><span>Content Link</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#divider"><span>Divider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#dropcap"><span>Dropcap</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#fancylink"><span>Fancy Link</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#googlefont"><span>Google Font</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#dropcap"><span>Highlight</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#divider"><span>Hr</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#icons"><span>Icons</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#iconbar"><span>Icon Bar</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#iconblock"><span>Icon Block</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#idea"><span>Idea</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#image"><span>Image</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#lists"><span>Lists & Bullets lists</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#popup"><span>Popup</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#iconblock"><span>Progress Icons</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#popup"><span>Share Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#table"><span>Table</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#tooltip"><span>Tooltip</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="typography.html#tooltip"><span>Tooltip Image</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="gallery.html"><span>Gallery</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="boxes-infographics.html"><span>Boxes & Infographics</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#articlebox"><span>Article box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#beforeafter"><span>Before After</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#chart"><span>Chart</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#countdown"><span>Countdown</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#counter"><span>Counter</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#featurebox"><span>Feature Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#flatbox"><span>Flat Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#hoverbox"><span>Hover Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#iconbox"><span>Icon Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#photobox"><span>Photo Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#progressbar"><span>Progress Bars</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#promobox"><span>Promo Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#quickfact"><span>Quick Fact</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#slidingbox"><span>Sliding Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#storybox"><span>Story Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#trailerbox"><span>Trailer Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="boxes-infographics.html#zoombox"><span>Zoom Box</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="content-blocks.html"><span>Content blocks</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#accordion"><span>Accordion</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#faq"><span>FAQ</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#helper"><span>Helper</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#list"><span>List</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#pricingitem"><span>Pricing Item</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#slider"><span>Slider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-blocks.html#tabs"><span>Tabs</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="content-elements.html"><span>Content elements</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#calltoaction"><span>Call to Action</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#contactbox"><span>Contact Box</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#fancydivider"><span>Fancy Divider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#fancyheading"><span>Fancy Heading</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#features-list"><span>Features List</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#hovercolor"><span>Hover Color</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#howitworks"><span>How It Works</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#contactbox"><span>Infobox</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#mapbig"><span>Map</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#contactbox"><span>Opening Hours</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#ourteam"><span>Our Team</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#ourteamlist"><span>Our Team List</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#timeline"><span>Timeline</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="content-elements.html#video"><span>Video</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="loops.html"><span>Loops</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#blog-item"><span>Blog</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#blognews"><span>Blog News</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#blogslider"><span>Blog Slider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#clients"><span>Clients</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#clientsslider"><span>Clients Slider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#offerslider"><span>Offer Slider Full</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#offersliderthumb"><span>Offer Slider Thumb</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#portfolio-item"><span>Portfolio</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#portfoliogrid"><span>Portfolio Grid</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#portfoliophoto"><span>Portfolio Photo</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#portfolioslider"><span>Portfolio Slider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#shopslider"><span>Shop Slider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#testimonials-item"><span>Testimonials</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="loops.html#testimonialslist"><span>Testimonials List</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-classic.html"><span>Blog</span></a>
|
||
|
|
<ul class="mfn-megamenu">
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="blog-classic-fullwidth.html"><span>Full width</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="blog-classic-fullwidth.html"><span>Classic</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-timeline-fullwidth.html"><span>Timeline</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-photo-fullwidth.html"><span>Photo</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-masonry-style-fullwidth.html"><span>Masonry Blog Style</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-masonry-tiles-fullwidth.html"><span>Masonry Tiles</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-grid-fullwidth.html"><span>Grid</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="blog-classic.html"><span>With Sidebar</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="blog-classic.html"><span>Classic</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-timeline.html"><span>Timeline</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-photo.html"><span>Photo</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-masonry-style.html"><span>Masonry Blog Style</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-masonry-tiles.html"><span>Masonry Tiles</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="blog-grid.html"><span>Grid</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li class="hide-border">
|
||
|
|
<a class="mfn-megamenu-title" href="content-builder-for-posts.html"><span>Single Post</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="content-builder-for-posts.html"><span>Content builder for posts</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="post-with-vertical-photo.html"><span>Post with vertical photo</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-single-1.html"><span>Blockquote</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="post-with-slider.html"><span>Post with Slider</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="post-with-youtube-vimeo.html"><span>Post with youtube / vimeo</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="post-with-html5-video.html"><span>Post with HTML5 Video</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="single-post-1.html"><span>Intro Header – Full screen</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-post-2.html"><span>Intro Header</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a target="_blank" href="http://be.beantownthemes.com/html/content/blogger2/item-6.html"><span>Post with Header Image <i class="icon-forward"></i></span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-post-3.html"><span>Single Post 3</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-post-4.html"><span>Single Post 4</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-post-5.html"><span>Single Post 5</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-post-6.html"><span>Single Post 6</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-flat-fullwidth.html"><span>Portfolio</span></a>
|
||
|
|
<ul class="mfn-megamenu">
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="portfolio-flat-fullwidth.html"><span>Full width</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-flat-fullwidth.html"><span>Flat</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-grid-fullwidth.html"><span>Grid</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-list-fullwidth.html"><span>List</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-masonry-blog-style-fullwidth.html"><span>Masonry Blog Style</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a target="_blank" href="http://be.beantownthemes.com/html/content/minimal/the-artwork.html"><span>Masonry Minimal <i class="icon-forward"></i></span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-masonry-flat-fullwidth.html"><span>Masonry Flat</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-masonry-hover-details-fullwidth.html"><span>Masonry Hover Details</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-exposure.html"><span>Exposure</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a class="mfn-megamenu-title" href="portfolio-flat.html"><span>With Sidebar</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-flat.html"><span>Flat</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-grid.html"><span>Grid</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-list.html"><span>List</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-masonry-blog-style.html"><span>Masonry Blog Style</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-masonry-flat.html"><span>Masonry Flat</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="portfolio-masonry-hover-details.html"><span>Masonry Hover Details</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li class="hide-border">
|
||
|
|
<a class="mfn-megamenu-title" href="content-builder-for-portfolio.html"><span>Single Project</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="content-builder-for-portfolio.html"><span>Content Builder for portfolio</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-1.html"><span>Single Project 1</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-2.html"><span>Single Project 2</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-3.html"><span>Single Project 3</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-4.html"><span>Single Project 4</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-5.html"><span>Single Project 5</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-6.html"><span>Single Project 6</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-7.html"><span>Single Project 7</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-8.html"><span>Single Project 8</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-9.html"><span>Single Project 9</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="single-project-10.html"><span>Single Project 10</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li class="last">
|
||
|
|
<a href="shop.html"><span>Shop</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="shop.html"><span>Grid 3 Columns</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="shop-4-columns.html"><span>Grid 4 Columns</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="shop-list.html"><span>List</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="shop-masonry.html"><span>Masonry</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="product_page.html"><span>Single Product</span></a>
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
<a href="product_page.html"><span>Single Product 1</span></a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a target="_blank" href="http://be.beantownthemes.com/html/content/biker/product2.html"><span>Single Product 2 <i class="icon-forward"></i></span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="cart.html"><span>Cart</span></a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</nav><a class="responsive-menu-toggle" href="#"><i class="icon-menu-fine"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="secondary_menu_wrapper"></div>
|
||
|
|
<div class="banner_wrapper"></div>
|
||
|
|
<div class="search_wrapper">
|
||
|
|
<form method="get" id="searchform" action="#">
|
||
|
|
<i class="icon_search icon-search-fine"></i><a href="#" class="icon_close"><i class="icon-cancel-fine"></i></a>
|
||
|
|
<input type="text" class="field" name="s" id="s" placeholder="Enter your search">
|
||
|
|
<input type="submit" class="submit" value="" style="display:none">
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="top_bar_right">
|
||
|
|
<div class="top_bar_right_wrapper">
|
||
|
|
<a href="http://bit.ly/1M6lijQ" class="button button_theme button_js action_button " target="_blank"><span class="button_label">Buy now</span></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
</div>
|
||
|
|
<div id="Content">
|
||
|
|
<div class="content_wrapper clearfix">
|
||
|
|
<div class="sections_group">
|
||
|
|
<div class="entry-content">
|
||
|
|
<div class="section mcb-section bg-cover" style="padding-top:80px; padding-bottom:60px; background-color:#0e1b27; background-image:url(images/home_betheme_subheader_shortcodes.png); background-repeat:no-repeat; background-position:center top; background-attachment:fixed">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_column column-margin-0px">
|
||
|
|
<div class="column_attr clearfix align_center">
|
||
|
|
<h2 style="color:#fff">200+ shortcodes & items
|
||
|
|
<br>
|
||
|
|
with 2 unique styles for unlimited possibilities</h2>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 40px">
|
||
|
|
<h1 class="themecolor">Typography</h1>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section section-border-bottom " style="padding-top:45px; padding-bottom:0px; background-color:#eaeaea">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_column column-margin-30px">
|
||
|
|
<div class="column_attr clearfix align_center">
|
||
|
|
<div class="demo-switch">
|
||
|
|
<h3><span class="title">Choose global style for all shortcodes:</span><a href="#" class="default" data-style="default">Classic</a><a href="#" class="simple" data-style="simple">Simple</a></h3>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="basic" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Basic typography</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<p class="big">Praesent nec magna ac pede. Mauris suscipit mauris. Nam quis erat id tortor. Phasellus at nibh nulla nulla, egestas quam eu tortor orci, id eros. Mauris neque. Pellentesque dolor. Mauris in est. <a href="#">Vivamus lacus sed justo</a>. Aenean ac dignissim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla augue a.</p>
|
||
|
|
|
||
|
|
<p>Lorem ipsum dolor sit amet augue. <strong>Sed eu sem urna elit</strong>, non odio. Aenean lacus tellus quis ante. Fusce enim. <strike>Aliquam ultricies</strike> porta. Aenean ac eros sed arcu. Mauris nunc posuere cubilia Curae, Nullam et ipsum. Aliquam quis elit. Pellentesque habitant morbi <u>tristique commodo</u>. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam hendrerit eget, bibendum a, bibendum tempus. <i>Pellentesque ac ipsum</i>. Vestibulum non sem. Mauris purus. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed.</p>
|
||
|
|
|
||
|
|
<h1>H1 Heading</h1>
|
||
|
|
<h2>H2 Heading</h2>
|
||
|
|
<h3>H3 Heading</h3>
|
||
|
|
<h4>H4 Heading</h4>
|
||
|
|
<h5>H5 Heading</h5>
|
||
|
|
<h6>H6 Heading</h6>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p class="big">
|
||
|
|
Praesent nec magna ac pede. Mauris suscipit mauris. Nam quis erat id tortor. Phasellus at nibh nulla nulla, egestas quam eu tortor orci, id eros. Mauris neque. Pellentesque dolor. Mauris in est. <a href="#">Vivamus lacus sed justo</a>. Aenean ac dignissim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla augue a.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p>
|
||
|
|
Lorem ipsum dolor sit amet augue. <strong>Sed eu sem urna elit</strong>, non odio. Aenean lacus tellus quis ante. Fusce enim. <strike>Aliquam ultricies</strike> porta. Aenean ac eros sed arcu. Mauris nunc posuere cubilia Curae, Nullam et ipsum. Aliquam quis elit. Pellentesque habitant morbi <u>tristique commodo</u>. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam hendrerit eget, bibendum a, bibendum tempus. <i>Pellentesque ac ipsum</i>. Vestibulum non sem. Mauris purus. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h1>H1 Heading</h1>
|
||
|
|
<p>
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
|
||
|
|
</p>
|
||
|
|
<h2>H2 Heading</h2>
|
||
|
|
<p>
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
|
||
|
|
</p>
|
||
|
|
<h3>H3 Heading</h3>
|
||
|
|
<p>
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h4>H4 Heading</h4>
|
||
|
|
<p>
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
|
||
|
|
</p>
|
||
|
|
<h5>H5 Heading</h5>
|
||
|
|
<p>
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
|
||
|
|
</p>
|
||
|
|
<h6>H6 Heading</h6>
|
||
|
|
<p style="margin: 0;">
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="dropcap" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Dropcap</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates a nice looking segment of text, where one letter is featured.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<p>
|
||
|
|
<span class="dropcap size-2"> A </span> ellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis eges tas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet ante. Donec eu libero sit amet quam egestas semper.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
<span class="dropcap dropcap_circle size-1" style="background-color:#eee; color:#444"> E </span> issim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla au us volutpat, velit in leo ultrices gue netus et malesuada fames ac turpis egestas.
|
||
|
|
</p>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p>
|
||
|
|
<span class="dropcap size-2"> A </span> ellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis eges tas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet ante. Donec eu libero sit amet quam egestas semper.
|
||
|
|
</p>
|
||
|
|
<p style="margin: 0;">
|
||
|
|
<span class="dropcap dropcap_circle size-1" style="background-color:#eee; color:#444;"> E </span> issim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla au us volutpat, velit in leo ultrices gue netus et malesuada fames ac turpis egestas.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Highlight</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
This item creates text with a nice highlight effect.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
Pellentesque <span class="highlight">suspendisse sapien</span> tristique commodo.
|
||
|
|
|
||
|
|
Donec <span class="highlight" style="background-color:#444; color:#fff">enim luctus diam</span> eu mauris
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p class="big">
|
||
|
|
Pellentesque <span class="highlight">suspendisse sapien</span> tristique commodo. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam <span class="highlight">hendrerit eget bibendum</span> a, bibendum tempus. Pellentesque ac ipsum. Vestibulum non sem. Mauris purus.
|
||
|
|
</p>
|
||
|
|
<p style="margin: 0;">
|
||
|
|
Aenean ac dignissim nibh donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec <span class="highlight" style="background-color:#444; color:#fff;">enim luctus diam</span> eu mauris. Pellentesque facilisis. Nulla augue a. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="tooltip" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Tooltip <span style="color:#ccc; font-size: 18px; margin-left: 10px;">Tooltip Image</span></h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates a small box under regular text in which you can rollover additional information.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
habitant <span class="tooltip tooltip-txt" data-tooltip="Lorem ipsum dolor sit">tooltip</span> senectus
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p class="big">
|
||
|
|
Pellentesque habitant <span class="tooltip tooltip-txt" data-tooltip="Lorem ipsum dolor sit">tooltip</span> senectus et netus et malesuada fames ac turpis egestas, ultricies eget, tempor sit amet.
|
||
|
|
</p>
|
||
|
|
<p style="margin: 0;">
|
||
|
|
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, <span class="tooltip tooltip-img"><span class="tooltip-content"><img src="images/home_betheme_blog_classic_1.jpg" alt="" width="400px" height="">Phasellus fermentum in dolor. Pellentesque facilisis tristique senectus et netus</span>tooltip with image</span> ante. Donec eu libero sit amet quam egestas semper.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Blockquote</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<blockquote>
|
||
|
|
Vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor...
|
||
|
|
</blockquote>
|
||
|
|
<p class="author">
|
||
|
|
<i class="icon-user"></i>
|
||
|
|
<a href="#" target="_blank">Thomas McKenzie</a>
|
||
|
|
</p>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<div class="blockquote">
|
||
|
|
<blockquote>
|
||
|
|
Vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In in leo ultrices posuere ante viverra ipsum ...
|
||
|
|
</blockquote>
|
||
|
|
<p class="author">
|
||
|
|
<i class="icon-user"></i><a href="#" target="_blank">Thomas McKenzie</a>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="buttons" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Buttons</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates buttons in many different styles. A button can link to another page/subpage or it can be the download button. It can also have an icon on the left or right-hand side.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<a class="button button_size_2 button_js" href="#">
|
||
|
|
<span class="button_label">Default button</span>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
<a class="button button_left button_size_2 button_js" href="#">
|
||
|
|
<span class="button_icon"><i class="icon-layout" ></i></span>
|
||
|
|
<span class="button_label">Button with icon</span>
|
||
|
|
</a>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a class="button button_size_2 button_js" href="#"><span class="button_label">Default button</span></a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_left button_size_2 button_js" href="#"> <span class="button_icon"><i class="icon-layout"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_right button_size_2 button_js" href="#"> <span class="button_icon"><i class="icon-basket" ></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 40px">
|
||
|
|
<a class="button button_size_2 button_theme button_js" href="#"> <span class="button_label">Default button</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_left button_size_2 button_theme button_js" href="#"> <span class="button_icon"><i class="icon-layout"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_right button_size_2 button_theme button_js" href="#"> <span class="button_icon"><i class="icon-basket"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column button-flat">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a class="button button_size_2 button_js" href="#" target="_blank"> <span class="button_label">Default button</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_left button_size_2 button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-layout"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_right button_size_2 button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-basket"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 40px">
|
||
|
|
<a class="button button_size_2 button_theme button_js" href="#" target="_blank"> <span class="button_label">Default button</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_left button_size_2 button_theme button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-layout"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_right button_size_2 button_theme button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-basket"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column button-stroke">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a class="button button_size_2 button_grey button_js" href="#" target="_blank"> <span class="button_label">Default button</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_left button_size_2 button_grey button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-layout"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_right button_size_2 button_grey button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-basket"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 40px">
|
||
|
|
<a class="button button_size_2 button_theme button_js" href="#" target="_blank"> <span class="button_label">Default button</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_left button_size_2 button_theme button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-layout"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
<br>
|
||
|
|
<a class="button button_right button_size_2 button_theme button_js" href="#" target="_blank"> <span class="button_icon"><i class="icon-basket"></i></span> <span class="button_label">Button with icon</span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="fancylink" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Fancy link</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Great shortcode with different variations on hover.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<a class="mfn-link mfn-link-1" href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-2" href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-3" href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-4" href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-5" href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-6" href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-7" href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
|
||
|
|
<a class="mfn-link mfn-link-8" href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-1 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-1 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-1 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-2 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-2 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-2 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-3 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-3 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-3 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-4 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-4 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-4 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-5 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-5 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-5 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-6 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-6 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-6 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-7 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-7 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-7 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<center>
|
||
|
|
<a class="mfn-link mfn-link-8 " href="#" data-hover="Phasellus" ontouchstart="this.classList.toggle('hover');"><span data-hover="Phasellus">Phasellus</span></a>
|
||
|
|
<a class="mfn-link mfn-link-8 " href="#" data-hover="Aliquam" ontouchstart="this.classList.toggle('hover');"><span data-hover="Aliquam">Aliquam</span></a>
|
||
|
|
<a class="mfn-link mfn-link-8 " href="#" data-hover="Quisque" ontouchstart="this.classList.toggle('hover');"><span data-hover="Quisque">Quisque</span></a>
|
||
|
|
</center>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="image" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Image</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
This item is a useful option for embedding images onto a page. Images can have links or be zoomed.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<div class="image_frame image_item scale-with-grid aligncenter has_border">
|
||
|
|
<div class="image_wrapper">
|
||
|
|
<a href="images/img-lg.jpg" rel="prettyphoto">
|
||
|
|
<div class="mask"></div>
|
||
|
|
<img class="scale-with-grid" src="images/img-sm.jpg" alt="img">
|
||
|
|
</a>
|
||
|
|
<div class="image_links">
|
||
|
|
<a href="images/img-lg.jpg" class="zoom" rel="prettyphoto"><i class="icon-search"></i></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_image">
|
||
|
|
<div class="image_frame image_item scale-with-grid aligncenter has_border">
|
||
|
|
<div class="image_wrapper">
|
||
|
|
<a href="images/home_betheme_blog_masonry_1.jpg" rel="prettyphoto"> <div class="mask"></div><img class="scale-with-grid" src="images/home_betheme_blog_masonry_1.jpg" alt="home_betheme_blog_masonry_1" width="960" height="960" /> </a>
|
||
|
|
<div class="image_links ">
|
||
|
|
<a href="images/home_betheme_blog_masonry_1.jpg" class="zoom" rel="prettyphoto"><i class="icon-search"></i></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column two-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p>
|
||
|
|
<span class="big">Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Nulla imperdiet sit amet magna. Vestibulum dapibus.</span>
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellentesque facilisis. Nulla imperdiet sit amet magna. Vestibulum dapibus, mauris nec malesuada fames ac turpis velit, rhoncus eu, luctus et interdum adipiscing wisi. Aliquam erat ac ipsum. Integer aliquam purus. Quisque lorem tortor fringilla sed, vestibulum id, eleifend justo vel.
|
||
|
|
</p>
|
||
|
|
<p style="margin: 0;">
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper. Maecenas ullamcorper est vitae sem ornare interdum. Cum sociis natoque penatibus et magnis dis parturient
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column two-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<p>
|
||
|
|
<span class="big">Tempor diam pede cursus vitae, ultricies eu, faucibus quis, porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper quam. Nullam viverra consectetuer. Quisque cursus et, porttitor risus. Aliquam sem. In hendrerit nulla quam nunc, accumsan congue. Lorem ipsum primis in nibh vel risus. Sed vel lectus.</span>
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Cum sociis natoque penatibus et ultrices volutpat. Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis, porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper quam. Nullam viverra consectetuer. Nulla imperdiet sit amet magna. Vestibulum dapibus.
|
||
|
|
</p>
|
||
|
|
<p style="margin: 0;">
|
||
|
|
Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper. Maecenas ullamcorper est vitae sem ornare interdum. Cum sociis natoque penatibus et magnis dis parturient
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_image if-overlay">
|
||
|
|
<div class="image_frame image_item scale-with-grid aligncenter has_border">
|
||
|
|
<div class="image_wrapper">
|
||
|
|
<a href="images/home_betheme_blog_classic_1.jpg" rel="prettyphoto"> <div class="mask"></div><img class="scale-with-grid" src="images/home_betheme_blog_classic_1.jpg" alt="home_betheme_blog_classic_1" width="1200" height="1000" /> </a>
|
||
|
|
<div class="image_links ">
|
||
|
|
<a href="images/home_betheme_blog_classic_1.jpg" class="zoom" rel="prettyphoto"><i class="icon-search"></i></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis, porttitor eros cursus lectus, pellentesque eget, bibendum a, gravida ullamcorper quam. Nullam viverra consectetuer. Nulla imperdiet sit amet magna. Vestibulum dapibus. Curabitur sit amet magna quam. Praesent in libero vel turpis pellentesque egestas sit amet vel nunc. Nunc lobortis dui neque, quis accumsan dolor. Aenean aliquet dignissim semper. Maecenas ullamcorper est vitae sem ornare interdum.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_placeholder">
|
||
|
|
<div class="placeholder">
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_image ">
|
||
|
|
<div class="image_frame image_item no_link scale-with-grid aligncenter has_border">
|
||
|
|
<div class="image_wrapper"><img class="scale-with-grid" src="images/home_betheme_blog_masonry_8.jpg" alt="home_betheme_blog_masonry_8" width="960" height="1200" />
|
||
|
|
</div>
|
||
|
|
<p class="wp-caption-text">
|
||
|
|
Praesent in libero vel turpis pellen
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="lists" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Ordered, Unordered & Definition Lists</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<ul>
|
||
|
|
<li>Aliquam tincidunt cons ectetuer mauris eu risus</li>
|
||
|
|
<li>Vestibulum auctor dapibus con sectet uer neque</li>
|
||
|
|
<li>Suspendisse a pellentesque dui, non felis</li>
|
||
|
|
</ul>
|
||
|
|
|
||
|
|
<ol>
|
||
|
|
<li>Aliquam tincidunt cons ectetuer mauris eu risus</li>
|
||
|
|
<li>Vestibulum auctor dapibus con sectet uer neque</li>
|
||
|
|
<li>Suspendisse a pellentesque dui, non felis</li>
|
||
|
|
</ol>
|
||
|
|
|
||
|
|
<dl>
|
||
|
|
<dt>Magna comodo</dt>
|
||
|
|
<dd>Consectetur adipisicing elit, sed do</dd>
|
||
|
|
<dt>Nullam wisi eu</dt>
|
||
|
|
<dd>Quisque lorem tortor fringilla sed.</dd>
|
||
|
|
<dt>Auctor dapibus</dt>
|
||
|
|
<dd> Ut enim ad minim veniam, quis nostru</dd>
|
||
|
|
</dl>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<ul>
|
||
|
|
<li>
|
||
|
|
Lorem ipsum dolor sit amet, consecte cons ectetuer tuer adipi sit amet magna scing elit
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Aliquam tincidunt cons ectetuer mauris eu risus
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Vestibulum auctor dapibus con sectet uer neque
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Suspendisse a pellentesque dui, non felis
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<ol>
|
||
|
|
<li>
|
||
|
|
Lorem ipsum dolor sit amet, consecte cons ectetuer tuer adipi sit amet magna scing elit
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Aliquam tincidunt cons ectetuer mauris eu risus
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Vestibulum auctor dapibus con sectet uer neque
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Suspendisse a pellentesque dui, non felis
|
||
|
|
</li>
|
||
|
|
</ol>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<dl>
|
||
|
|
<dt>
|
||
|
|
Magna comodo
|
||
|
|
</dt>
|
||
|
|
<dd>
|
||
|
|
Consectetur adipisicing elit, sed do
|
||
|
|
</dd>
|
||
|
|
<dt>
|
||
|
|
Nullam wisi eu
|
||
|
|
</dt>
|
||
|
|
<dd>
|
||
|
|
Quisque lorem tortor fringilla sed.
|
||
|
|
</dd>
|
||
|
|
<dt>
|
||
|
|
Auctor dapibus
|
||
|
|
</dt>
|
||
|
|
<dd>
|
||
|
|
Ut enim ad minim veniam, quis nostru
|
||
|
|
</dd>
|
||
|
|
</dl>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="bullets" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Bullets lists</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Useful to present something within the list. We prepared several types of lists.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
List check
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<ul class="list_check">
|
||
|
|
<li>List item 1</li>
|
||
|
|
<li>List item 2</li>
|
||
|
|
</ul>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
|
||
|
|
<p class="big">
|
||
|
|
List star
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<ul class="list_star">
|
||
|
|
<li>List item 1</li>
|
||
|
|
<li>List item 2</li>
|
||
|
|
</ul>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
|
||
|
|
<p class="big">
|
||
|
|
List idea
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<ul class="list_idea">
|
||
|
|
<li>List item 1</li>
|
||
|
|
<li>List item 2</li>
|
||
|
|
</ul>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
|
||
|
|
<p class="big">
|
||
|
|
List mixed
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<ul class="list_mixed">
|
||
|
|
<li class="list_check">List item 1</li>
|
||
|
|
<li class="list_star">List item 2</li>
|
||
|
|
<li class="list_idea">List item 3</li>
|
||
|
|
</ul>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<p>
|
||
|
|
Each of these lists has a <b>different class</b> type. To change the type of the list, simply change the name of class
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<ul class="list_check">
|
||
|
|
<li>
|
||
|
|
Suspendisse a pellentesque dui, non felis.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Quisque lorem tortor fringilla sed.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Quisque cursus et, porttitor risus.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Nulla ipsum dolor lacus, suscipit adipiscing.
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<ul class="list_star">
|
||
|
|
<li>
|
||
|
|
Suspendisse a pellentesque dui, non felis.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Quisque lorem tortor fringilla sed.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Quisque cursus et, porttitor risus.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Nulla ipsum dolor lacus, suscipit adipiscing.
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<ul class="list_idea">
|
||
|
|
<li>
|
||
|
|
Suspendisse a pellentesque dui, non felis.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Quisque lorem tortor fringilla sed.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Quisque cursus et, porttitor risus.
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
Nulla ipsum dolor lacus, suscipit adipiscing.
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<ul class="list_mixed">
|
||
|
|
<li class="list_check">
|
||
|
|
Suspendisse a pellentesque dui, non felis.
|
||
|
|
</li>
|
||
|
|
<li class="list_star">
|
||
|
|
Quisque lorem tortor fringilla sed.
|
||
|
|
</li>
|
||
|
|
<li class="list_idea">
|
||
|
|
Quisque cursus et, porttitor risus.
|
||
|
|
</li>
|
||
|
|
<li class="list_check">
|
||
|
|
Nulla ipsum dolor lacus, suscipit adipiscing.
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="iconblock" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Icon block</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates icon as block element.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<span class="single_icon icon_center themecolor">
|
||
|
|
<i class="icon-camera"></i>
|
||
|
|
</span>
|
||
|
|
</pre>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix align_center">
|
||
|
|
<span class="single_icon icon_center themecolor"> <i style="font-size: 40px; line-height: 40px" class="icon-camera"></i> </span>
|
||
|
|
|
||
|
|
<span class="single_icon icon_center"> <i style="font-size: 90px; line-height: 90px; color:#aaa" class="icon-picture"></i> </span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Progress icons</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Animated colored progress icons.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<div class="progress_icons" data-active="5" data-color="">
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<div class="progress_icons" data-active="5" data-color="">
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-heart-line"></i></span>
|
||
|
|
</div>
|
||
|
|
<div class="progress_icons" data-active="6" data-color="">
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-thumbs-up"></i></span>
|
||
|
|
</div>
|
||
|
|
<div class="progress_icons" data-active="7" data-color="#AAAAAA">
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
<span class="progress_icon"><i class="icon-light-up"></i></span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="contentlink" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Content link</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates links with icon and content inside.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<a class="content_link" href="#">
|
||
|
|
<span class="icon"><i class="icon-picture"></i></span>
|
||
|
|
<span class="title">Vitae adipiscing</span>
|
||
|
|
</a>
|
||
|
|
<a class="content_link" href="#">
|
||
|
|
<span class="icon"><i class="icon-calendar"></i></span>
|
||
|
|
<span class="title">Quisque lorem</span>
|
||
|
|
</a><a class="content_link" href="#">
|
||
|
|
<span class="icon"><i class="icon-users"></i></span>
|
||
|
|
<span class="title">Fusce velit</span>
|
||
|
|
</a>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix align_center">
|
||
|
|
<a class="content_link" href="#"> <span class="icon"><i class="icon-picture"></i></span> <span class="title">Vitae adipiscing</span> </a>
|
||
|
|
<a class="content_link" href="#"> <span class="icon"><i class="icon-calendar"></i></span> <span class="title">Quisque lorem</span> </a><a class="content_link" href="#"> <span class="icon"><i class="icon-users"></i></span> <span class="title">Fusce velit</span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="iconbar" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Icon bar</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<a href="#" class="icon_bar icon_bar_large">
|
||
|
|
<span class="t"><i class="icon-picture"></i></span>
|
||
|
|
<span class="b"><i class="icon-picture"></i></span>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large">
|
||
|
|
<span class="t"><i class="icon-calendar"></i></span>
|
||
|
|
<span class="b"><i class="icon-calendar"></i></span>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large">
|
||
|
|
<span class="t"><i class="icon-users"></i></span>
|
||
|
|
<span class="b"><i class="icon-users"></i></span>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large">
|
||
|
|
<span class="t"><i class="icon-comment-fa"></i></span>
|
||
|
|
<span class="b"><i class="icon-comment-fa"></i></span>
|
||
|
|
</a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large">
|
||
|
|
<span class="t"><i class="icon-heart-fa"></i></span>
|
||
|
|
<span class="b"><i class="icon-heart-fa"></i></span>
|
||
|
|
</a>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a href="#" class="icon_bar icon_bar_large"> <span class="t"><i class="icon-picture"></i></span> <span class="b"><i class="icon-picture"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large"> <span class="t"><i class="icon-calendar"></i></span> <span class="b"><i class="icon-calendar"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large"> <span class="t"><i class="icon-users"></i></span> <span class="b"><i class="icon-users"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large"> <span class="t"><i class="icon-comment-fa"></i></span> <span class="b"><i class="icon-comment-fa"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_large"> <span class="t"><i class="icon-heart-fa"></i></span> <span class="b"><i class="icon-heart-fa"></i></span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a href="#" class="icon_bar icon_bar_small"> <span class="t"><i class="icon-picture"></i></span> <span class="b"><i class="icon-picture"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_small"> <span class="t"><i class="icon-calendar"></i></span> <span class="b"><i class="icon-calendar"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_small"> <span class="t"><i class="icon-users"></i></span> <span class="b"><i class="icon-users"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_small"> <span class="t"><i class="icon-comment-fa"></i></span> <span class="b"><i class="icon-comment-fa"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_small"> <span class="t"><i class="icon-heart-fa"></i></span> <span class="b"><i class="icon-heart-fa"></i></span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a href="#" class="icon_bar icon_bar_facebook icon_bar_large"> <span class="t"><i class="icon-facebook"></i> </span><span class="b"><i class="icon-facebook"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_google icon_bar_large"> <span class="t"><i class="icon-gplus"></i></span> <span class="b"><i class="icon-gplus"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_twitter icon_bar_large"> <span class="t"><i class="icon-twitter"></i></span> <span class="b"><i class="icon-twitter"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_vimeo icon_bar_large"> <span class="t"><i class="icon-vimeo"></i></span> <span class="b"><i class="icon-vimeo"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_youtube icon_bar_large"> <span class="t"><i class="icon-play"></i></span> <span class="b"><i class="icon-play"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_flickr icon_bar_large"> <span class="t"><i class="icon-flickr"></i></span> <span class="b"><i class="icon-flickr"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_linkedin icon_bar_large"> <span class="t"><i class="icon-linkedin"></i></span> <span class="b"><i class="icon-linkedin"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_pinterest icon_bar_large"> <span class="t"><i class="icon-pinterest"></i></span> <span class="b"><i class="icon-pinterest"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_dribbble icon_bar_large"> <span class="t"><i class="icon-dribbble"></i></span> <span class="b"><i class="icon-dribbble"></i></span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a href="#" class="icon_bar icon_bar_facebook icon_bar_small"> <span class="t"><i class="icon-facebook"></i></span> <span class="b"><i class="icon-facebook"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_google icon_bar_small"> <span class="t"><i class="icon-gplus"></i></span> <span class="b"><i class="icon-gplus"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_twitter icon_bar_small"> <span class="t"><i class="icon-twitter"></i></span> <span class="b"><i class="icon-twitter"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_vimeo icon_bar_small"> <span class="t"><i class="icon-vimeo"></i></span> <span class="b"><i class="icon-vimeo"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_youtube icon_bar_small"> <span class="t"><i class="icon-play"></i></span> <span class="b"><i class="icon-play"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_flickr icon_bar_small"> <span class="t"><i class="icon-flickr"></i></span> <span class="b"><i class="icon-flickr"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_linkedin icon_bar_small"> <span class="t"><i class="icon-linkedin"></i></span> <span class="b"><i class="icon-linkedin"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_pinterest icon_bar_small"> <span class="t"><i class="icon-pinterest"></i></span> <span class="b"><i class="icon-pinterest"></i></span> </a>
|
||
|
|
<a href="#" class="icon_bar icon_bar_dribbble icon_bar_small"> <span class="t"><i class="icon-dribbble"></i></span> <span class="b"><i class="icon-dribbble"></i></span> </a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="divider" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Divider <span style="color:#ccc; font-size: 18px; margin-left: 10px;">Hr</span></h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates spaces between elements. It also aligns a single line, with boxes located underneath. You can choose different styles of this item.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<hr class="hr_narrow">
|
||
|
|
<hr class="hr_narrow hr_color">
|
||
|
|
<hr>
|
||
|
|
<hr class="hr_color">
|
||
|
|
<div class="hr_wide">
|
||
|
|
<hr>
|
||
|
|
</div>
|
||
|
|
<div class="hr_wide hr_color">
|
||
|
|
<hr>
|
||
|
|
</div>
|
||
|
|
<div class="hr_dots">
|
||
|
|
<span></span><span></span><span></span>
|
||
|
|
</div>
|
||
|
|
<div class="hr_zigzag">
|
||
|
|
<i class="icon-down-open"></i><i class="icon-down-open"></i><i class="icon-down-open"></i>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<hr class="hr_narrow" style="margin:0 auto 30px">
|
||
|
|
<hr class="hr_narrow hr_color" style="margin: 0 auto 30px">
|
||
|
|
<hr style="margin: 0 auto 30px">
|
||
|
|
<hr class=" hr_color" style="margin:0 auto 30px">
|
||
|
|
<div class="hr_wide" style="margin: 0 auto 30px">
|
||
|
|
<hr>
|
||
|
|
</div>
|
||
|
|
<div class="hr_wide hr_color" style="margin: 0 auto 30px">
|
||
|
|
<hr>
|
||
|
|
</div>
|
||
|
|
<div class="hr_dots" style="margin: 0 auto 30px">
|
||
|
|
<span></span><span></span><span></span>
|
||
|
|
</div>
|
||
|
|
<div class="hr_zigzag" style="margin: 0 auto 30px">
|
||
|
|
<i class="icon-down-open"></i><i class="icon-down-open"></i><i class="icon-down-open"></i>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="googlefont" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Google font</h4>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix align_center">
|
||
|
|
<div class="google_font" style="font-family:'Pompiere',Arial,Tahoma,sans-serif;font-size:80px;line-height:80px;font-weight:400;;">
|
||
|
|
Quisque lorem tortor fringilla sed
|
||
|
|
</div>
|
||
|
|
<br>
|
||
|
|
<div class="google_font" style="font-family:'Exo',Arial,Tahoma,sans-serif;font-size:40px;line-height:40px;font-weight:400;;">
|
||
|
|
Praesent in libero vel turpis pellentesque
|
||
|
|
</div>
|
||
|
|
<br>
|
||
|
|
<div class="google_font" style="font-family:'Old Standard TT',Arial,Tahoma,sans-serif;font-size:23px;line-height:23px;font-weight:400;;">
|
||
|
|
Cum sociis natoque penatibus et ultrices volutpat. Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="alert" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Alert</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
This item allows you to add alerts which can be closed.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<div class="alert alert_warning">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-lamp"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Warning message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="alert alert_error">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-alert"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Error message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="alert alert_info">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-help"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Info message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="alert alert_success">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-check"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Success message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<div class="alert alert_warning">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-lamp"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Warning message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="alert alert_error">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-alert"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Error message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="alert alert_info">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-help"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Info message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
<div class="alert alert_success">
|
||
|
|
<div class="alert_icon">
|
||
|
|
<i class="icon-check"></i>
|
||
|
|
</div>
|
||
|
|
<div class="alert_wrapper">
|
||
|
|
Success message. This is a <a href="#">sample link</a>
|
||
|
|
</div><a href="#" class="close"><i class="icon-cancel"></i></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="idea" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Idea</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Creates a nice box with text inside.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<div class="idea_box">
|
||
|
|
<div class="icon">
|
||
|
|
<i class="icon-lamp"></i>
|
||
|
|
</div>
|
||
|
|
<div class="desc">
|
||
|
|
Nulla imperdiet sit <a href="#">amet magna</a>. Vestibulum dapibus. Curabitur sit amet magna quam. Praesent in libero vel turpis <strong>pellentesque egestas sit amet vel nunc.</strong>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<div class="idea_box">
|
||
|
|
<div class="icon">
|
||
|
|
<i class="icon-lamp"></i>
|
||
|
|
</div>
|
||
|
|
<div class="desc">
|
||
|
|
Nulla imperdiet sit <a href="#">amet magna</a>. Vestibulum dapibus. Curabitur sit amet magna quam. Praesent in libero vel turpis <strong>pellentesque egestas sit amet vel nunc.</strong>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="popup" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Popup</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Open a popup on click.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<a href="#popup-1" rel="prettyphoto" class="popup-link button button_js">
|
||
|
|
<span class="button_label">Click to open Popup</span>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
<div id="popup-1" class="popup-content">
|
||
|
|
<div class="popup-inner">
|
||
|
|
<div class="image_frame image_item no_link scale-with-grid alignnone has_border">
|
||
|
|
<div class="image_wrapper">
|
||
|
|
<img class="scale-with-grid" src="images/img.jpg" alt="img">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<hr class="no_line">
|
||
|
|
Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellen tesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<a href="#popup-58b3436e557b2" rel="prettyphoto" class="popup-link button button_js"><span class="button_label">Click to open Popup</span></a>
|
||
|
|
<div id="popup-58b3436e557b2" class="popup-content">
|
||
|
|
<div class="popup-inner" style="padding:20px;">
|
||
|
|
<div class="image_frame image_item no_link scale-with-grid alignnone has_border">
|
||
|
|
<div class="image_wrapper">
|
||
|
|
<img class="scale-with-grid" src="images/home_betheme_blog_classic_1.jpg" alt="">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 20px">
|
||
|
|
Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellen tesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix" style=" padding:10px 0 0;">
|
||
|
|
<a href="#popup-58b3436e55e45" rel="prettyphoto" class="popup-link">Click to open Popup</a>
|
||
|
|
<div id="popup-58b3436e55e45" class="popup-content">
|
||
|
|
<div class="popup-inner" style="padding:20px;">
|
||
|
|
<div class="image_frame image_item no_link scale-with-grid alignnone has_border">
|
||
|
|
<div class="image_wrapper">
|
||
|
|
<img class="scale-with-grid" src="images/home_betheme_blog_classic_1.jpg" alt="">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 20px">
|
||
|
|
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor. Pellen tesque facilisis.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="wrap mcb-wrap one-second valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Share Box</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Share box powered by sharethis.com.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column column-margin- __web-inspector-hide-shortcut__">
|
||
|
|
<div class="column_attr clearfix" style="">
|
||
|
|
<div class="share_wrapper share_item">
|
||
|
|
<span class="st_facebook_vcount" displaytext="Facebook" st_processed="yes"><span style="text-decoration:none;color:#000000;display:inline-block;cursor:pointer;" class="stButton">
|
||
|
|
<div>
|
||
|
|
<div class="stBubble" style="display: block;">
|
||
|
|
<div class="stBubble_count">
|
||
|
|
2
|
||
|
|
</div>
|
||
|
|
</div><span class="stMainServices st-facebook-counter" style="background-image: url("http://w.sharethis.com/images/2017/facebook_counter.png");"> </span>
|
||
|
|
</div></span></span><span class="st_twitter_vcount" displaytext="Tweet" st_processed="yes"><span style="text-decoration:none;color:#000000;display:inline-block;cursor:pointer;" class="stButton">
|
||
|
|
<div>
|
||
|
|
<div class="stBubble" style="display: block;">
|
||
|
|
<div class="stBubble_count">
|
||
|
|
1
|
||
|
|
</div>
|
||
|
|
</div><span class="stMainServices st-twitter-counter" style="background-image: url("http://w.sharethis.com/images/2017/twitter_counter.png");"> </span>
|
||
|
|
</div></span></span><span class="st_pinterest_vcount" displaytext="Pinterest" st_processed="yes"><span style="text-decoration:none;color:#000000;display:inline-block;cursor:pointer;" class="stButton">
|
||
|
|
<div>
|
||
|
|
<div class="stBubble" style="display: block;">
|
||
|
|
<div class="stBubble_count">
|
||
|
|
0
|
||
|
|
</div>
|
||
|
|
</div><span class="stMainServices st-pinterest-counter" style="background-image: url("http://w.sharethis.com/images/2017/pinterest_counter.png");"> </span>
|
||
|
|
</div></span></span><script src="http://w.sharethis.com/button/buttons.js"></script>
|
||
|
|
<script>
|
||
|
|
stLight.options({
|
||
|
|
publisher : "1390eb48-c3c3-409a-903a-ca202d50de91",
|
||
|
|
doNotHash : false,
|
||
|
|
doNotCopy : false,
|
||
|
|
hashAddressBar : false
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="table" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Table</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Styling for HTML tables.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<table>
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th>Employee</th>
|
||
|
|
<th>Salary</th>
|
||
|
|
<th>Bonus</th>
|
||
|
|
<th>Supervisor</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td>Stephen C. Cox</td>
|
||
|
|
<td>$300</td>
|
||
|
|
<td>$50</td>
|
||
|
|
<td>Bob</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
|
||
|
|
|
||
|
|
<table>
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th class="clear"></th>
|
||
|
|
<th>Salary</th>
|
||
|
|
<th>Bonus</th>
|
||
|
|
<th>Supervisor</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<th>Stephen C. Cox</th>
|
||
|
|
<td>$300</td>
|
||
|
|
<td>$50</td>
|
||
|
|
<td>Bob</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<table>
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th>Employee</th>
|
||
|
|
<th>Salary</th>
|
||
|
|
<th>Bonus</th>
|
||
|
|
<th>Supervisor</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td>Stephen C. Cox</td>
|
||
|
|
<td>$300</td>
|
||
|
|
<td>$50</td>
|
||
|
|
<td>Bob</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Josephin Tan</td>
|
||
|
|
<td>$150</td>
|
||
|
|
<td>-</td>
|
||
|
|
<td>Annie</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Joyce Ming</td>
|
||
|
|
<td>$200</td>
|
||
|
|
<td>$35</td>
|
||
|
|
<td>Andy</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>James A. Pentel</td>
|
||
|
|
<td>$175</td>
|
||
|
|
<td>$25</td>
|
||
|
|
<td>Annie</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<table>
|
||
|
|
<thead>
|
||
|
|
<tr>
|
||
|
|
<th class="clear"></th>
|
||
|
|
<th>Salary</th>
|
||
|
|
<th>Bonus</th>
|
||
|
|
<th>Supervisor</th>
|
||
|
|
</tr>
|
||
|
|
</thead>
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<th>Stephen C. Cox</th>
|
||
|
|
<td>$300</td>
|
||
|
|
<td>$50</td>
|
||
|
|
<td>Bob</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<th>Josephin Tan</th>
|
||
|
|
<td>$150</td>
|
||
|
|
<td>-</td>
|
||
|
|
<td>Annie</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<th>Joyce Ming</th>
|
||
|
|
<td>$200</td>
|
||
|
|
<td>$35</td>
|
||
|
|
<td>Andy</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<th>James A. Pentel</th>
|
||
|
|
<td>$175</td>
|
||
|
|
<td>$25</td>
|
||
|
|
<td>Annie</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="icons" style="padding-top:50px; padding-bottom:0px">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Icons</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Large variety of retina ready icons, choose your icon below.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<i class="icon-acrobat"></i>
|
||
|
|
<i class="icon-address"></i>
|
||
|
|
<i class="icon-adjust"></i>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-acrobat"></i><span class="i-name">icon-acrobat</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-address"></i><span class="i-name">icon-address</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-adjust"></i><span class="i-name">icon-adjust</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-aim"></i><span class="i-name">icon-aim</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-air"></i><span class="i-name">icon-air</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-alert"></i><span class="i-name">icon-alert</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-amazon"></i><span class="i-name">icon-amazon</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-android"></i><span class="i-name">icon-android</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-angellist"></i><span class="i-name">icon-angellist</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-appnet"></i><span class="i-name">icon-appnet</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-appstore"></i><span class="i-name">icon-appstore</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-archive"></i><span class="i-name">icon-archive</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-arrow-combo"></i><span class="i-name">icon-arrow-combo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-arrows-ccw"></i><span class="i-name">icon-arrows-ccw</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-attach"></i><span class="i-name">icon-attach</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-attach-line"></i><span class="i-name">icon-attach-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-attention"></i><span class="i-name">icon-attention</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-back"></i><span class="i-name">icon-back</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-back-in-time"></i><span class="i-name">icon-back-in-time</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bag"></i><span class="i-name">icon-bag</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-basket"></i><span class="i-name">icon-basket</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-battery"></i><span class="i-name">icon-battery</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-beaker-line"></i><span class="i-name">icon-beaker-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-behance"></i><span class="i-name">icon-behance</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bell"></i><span class="i-name">icon-bell</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bitbucket"></i><span class="i-name">icon-bitbucket</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bitcoin"></i><span class="i-name">icon-bitcoin</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-block"></i><span class="i-name">icon-block</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-blogger"></i><span class="i-name">icon-blogger</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-book"></i><span class="i-name">icon-book</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-book-open"></i><span class="i-name">icon-book-open</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bookmark"></i><span class="i-name">icon-bookmark</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bookmarks"></i><span class="i-name">icon-bookmarks</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-box"></i><span class="i-name">icon-box</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-briefcase"></i><span class="i-name">icon-briefcase</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-brush"></i><span class="i-name">icon-brush</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-bucket"></i><span class="i-name">icon-bucket</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-buffer"></i><span class="i-name">icon-buffer</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-calendar"></i><span class="i-name">icon-calendar</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-calendar-line"></i><span class="i-name">icon-calendar-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-call"></i><span class="i-name">icon-call</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-camera"></i><span class="i-name">icon-camera</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-camera-line"></i><span class="i-name">icon-camera-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cancel"></i><span class="i-name">icon-cancel</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cancel-circled"></i><span class="i-name">icon-cancel-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cancel-squared"></i><span class="i-name">icon-cancel-squared</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cart"></i><span class="i-name">icon-cart</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc"></i><span class="i-name">icon-cc</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-by"></i><span class="i-name">icon-cc-by</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-nc"></i><span class="i-name">icon-cc-nc</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-nc-eu"></i><span class="i-name">icon-cc-nc-eu</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-nc-jp"></i><span class="i-name">icon-cc-nc-jp</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-nd"></i><span class="i-name">icon-cc-nd</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-pd"></i><span class="i-name">icon-cc-pd</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-remix"></i><span class="i-name">icon-cc-remix</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-sa"></i><span class="i-name">icon-cc-sa</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-share"></i><span class="i-name">icon-cc-share</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cc-zero"></i><span class="i-name">icon-cc-zero</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-ccw"></i><span class="i-name">icon-ccw</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cd"></i><span class="i-name">icon-cd</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cd-line"></i><span class="i-name">icon-cd-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-chart-area"></i><span class="i-name">icon-chart-area</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-chart-bar"></i><span class="i-name">icon-chart-bar</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-chart-line"></i><span class="i-name">icon-chart-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-chart-pie"></i><span class="i-name">icon-chart-pie</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-chat"></i><span class="i-name">icon-chat</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-check"></i><span class="i-name">icon-check</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-chrome"></i><span class="i-name">icon-chrome</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-clipboard"></i><span class="i-name">icon-clipboard</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-clock"></i><span class="i-name">icon-clock</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-clock-line"></i><span class="i-name">icon-clock-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cloud"></i><span class="i-name">icon-cloud</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cloud-line"></i><span class="i-name">icon-cloud-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cloud-thunder"></i><span class="i-name">icon-cloud-thunder</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cloudapp"></i><span class="i-name">icon-cloudapp</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-code"></i><span class="i-name">icon-code</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cog"></i><span class="i-name">icon-cog</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cog-line"></i><span class="i-name">icon-cog-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-comment-empty-fa"></i><span class="i-name">icon-comment-empty-fa</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-comment-fa"></i><span class="i-name">icon-comment-fa</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-comment-line"></i><span class="i-name">icon-comment-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-compass"></i><span class="i-name">icon-compass</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-credit-card"></i><span class="i-name">icon-credit-card</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cup"></i><span class="i-name">icon-cup</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cup-line"></i><span class="i-name">icon-cup-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-cw"></i><span class="i-name">icon-cw</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-database"></i><span class="i-name">icon-database</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-database-line"></i><span class="i-name">icon-database-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-db-shape"></i><span class="i-name">icon-db-shape</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-delicious"></i><span class="i-name">icon-delicious</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-desktop-line"></i><span class="i-name">icon-desktop-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-diamond-line"></i><span class="i-name">icon-diamond-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-digg"></i><span class="i-name">icon-digg</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-direction"></i><span class="i-name">icon-direction</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-disqus"></i><span class="i-name">icon-disqus</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-doc"></i><span class="i-name">icon-doc</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-doc-landscape"></i><span class="i-name">icon-doc-landscape</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-doc-line"></i><span class="i-name">icon-doc-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-doc-text"></i><span class="i-name">icon-doc-text</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-doc-text-inv"></i><span class="i-name">icon-doc-text-inv</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-docs"></i><span class="i-name">icon-docs</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dot"></i><span class="i-name">icon-dot</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dot-2"></i><span class="i-name">icon-dot-2</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dot-3"></i><span class="i-name">icon-dot-3</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down"></i><span class="i-name">icon-down</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-bold"></i><span class="i-name">icon-down-bold</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-circled"></i><span class="i-name">icon-down-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-dir"></i><span class="i-name">icon-down-dir</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-open"></i><span class="i-name">icon-down-open</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-open-big"></i><span class="i-name">icon-down-open-big</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-open-mini"></i><span class="i-name">icon-down-open-mini</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-down-thin"></i><span class="i-name">icon-down-thin</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-download"></i><span class="i-name">icon-download</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dribbble"></i><span class="i-name">icon-dribbble</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dribbble-circled"></i><span class="i-name">icon-dribbble-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-drive"></i><span class="i-name">icon-drive</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dropbox"></i><span class="i-name">icon-dropbox</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-droplet"></i><span class="i-name">icon-droplet</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-drupal"></i><span class="i-name">icon-drupal</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-duckduckgo"></i><span class="i-name">icon-duckduckgo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-dwolla"></i><span class="i-name">icon-dwolla</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-ebay"></i><span class="i-name">icon-ebay</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-email"></i><span class="i-name">icon-email</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-erase"></i><span class="i-name">icon-erase</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-eventasaurus"></i><span class="i-name">icon-eventasaurus</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-eventbrite"></i><span class="i-name">icon-eventbrite</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-eventful"></i><span class="i-name">icon-eventful</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-evernote"></i><span class="i-name">icon-evernote</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-export"></i><span class="i-name">icon-export</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-eye"></i><span class="i-name">icon-eye</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-eye-line"></i><span class="i-name">icon-eye-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-facebook"></i><span class="i-name">icon-facebook</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-facebook-circled"></i><span class="i-name">icon-facebook-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-facebook-squared"></i><span class="i-name">icon-facebook-squared</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-fast-backward"></i><span class="i-name">icon-fast-backward</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-fast-forward"></i><span class="i-name">icon-fast-forward</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-feather"></i><span class="i-name">icon-feather</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-fire-line"></i><span class="i-name">icon-fire-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-fivehundredpx"></i><span class="i-name">icon-fivehundredpx</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flag"></i><span class="i-name">icon-flag</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flash"></i><span class="i-name">icon-flash</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flashlight"></i><span class="i-name">icon-flashlight</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flattr"></i><span class="i-name">icon-flattr</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flickr"></i><span class="i-name">icon-flickr</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flickr-circled"></i><span class="i-name">icon-flickr-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flight"></i><span class="i-name">icon-flight</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-floppy"></i><span class="i-name">icon-floppy</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flow-branch"></i><span class="i-name">icon-flow-branch</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flow-cascade"></i><span class="i-name">icon-flow-cascade</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flow-line"></i><span class="i-name">icon-flow-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flow-parallel"></i><span class="i-name">icon-flow-parallel</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-flow-tree"></i><span class="i-name">icon-flow-tree</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-folder"></i><span class="i-name">icon-folder</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-food-line"></i><span class="i-name">icon-food-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-forrst"></i><span class="i-name">icon-forrst</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-forward"></i><span class="i-name">icon-forward</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-foursquare"></i><span class="i-name">icon-foursquare</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-gauge"></i><span class="i-name">icon-gauge</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-github"></i><span class="i-name">icon-github</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-github-circled"></i><span class="i-name">icon-github-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-globe"></i><span class="i-name">icon-globe</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-globe-line"></i><span class="i-name">icon-globe-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-gmail"></i><span class="i-name">icon-gmail</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-google"></i><span class="i-name">icon-google</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-google-circles"></i><span class="i-name">icon-google-circles</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-googleplay"></i><span class="i-name">icon-googleplay</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-gowalla"></i><span class="i-name">icon-gowalla</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-gplus"></i><span class="i-name">icon-gplus</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-gplus-circled"></i><span class="i-name">icon-gplus-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-graduation-cap"></i><span class="i-name">icon-graduation-cap</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-graduation-cap-line"></i><span class="i-name">icon-graduation-cap-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-grooveshark"></i><span class="i-name">icon-grooveshark</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-guest"></i><span class="i-name">icon-guest</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-hackernews"></i><span class="i-name">icon-hackernews</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-heart-empty-fa"></i><span class="i-name">icon-heart-empty-fa</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-heart-fa"></i><span class="i-name">icon-heart-fa</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-heart-line"></i><span class="i-name">icon-heart-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-help"></i><span class="i-name">icon-help</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-help-circled"></i><span class="i-name">icon-help-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-home"></i><span class="i-name">icon-home</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-hourglass"></i><span class="i-name">icon-hourglass</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-html5"></i><span class="i-name">icon-html5</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-ie"></i><span class="i-name">icon-ie</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-inbox"></i><span class="i-name">icon-inbox</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-inbox-line"></i><span class="i-name">icon-inbox-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-infinity"></i><span class="i-name">icon-infinity</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-info"></i><span class="i-name">icon-info</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-info-circled"></i><span class="i-name">icon-info-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-instagram"></i><span class="i-name">icon-instagram</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-install"></i><span class="i-name">icon-install</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-instapaper"></i><span class="i-name">icon-instapaper</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-intensedebate"></i><span class="i-name">icon-intensedebate</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-itunes"></i><span class="i-name">icon-itunes</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-key"></i><span class="i-name">icon-key</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-key-line"></i><span class="i-name">icon-key-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-keyboard"></i><span class="i-name">icon-keyboard</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-klout"></i><span class="i-name">icon-klout</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lamp"></i><span class="i-name">icon-lamp</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-language"></i><span class="i-name">icon-language</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lanyrd"></i><span class="i-name">icon-lanyrd</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lastfm"></i><span class="i-name">icon-lastfm</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lastfm-circled"></i><span class="i-name">icon-lastfm-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-layout"></i><span class="i-name">icon-layout</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-leaf"></i><span class="i-name">icon-leaf</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left"></i><span class="i-name">icon-left</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-bold"></i><span class="i-name">icon-left-bold</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-circled"></i><span class="i-name">icon-left-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-dir"></i><span class="i-name">icon-left-dir</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-open"></i><span class="i-name">icon-left-open</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-open-big"></i><span class="i-name">icon-left-open-big</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-open-mini"></i><span class="i-name">icon-left-open-mini</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-left-thin"></i><span class="i-name">icon-left-thin</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lego"></i><span class="i-name">icon-lego</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-level-down"></i><span class="i-name">icon-level-down</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-level-up"></i><span class="i-name">icon-level-up</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lifebuoy"></i><span class="i-name">icon-lifebuoy</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-light-down"></i><span class="i-name">icon-light-down</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-light-up"></i><span class="i-name">icon-light-up</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lightbulb-line"></i><span class="i-name">icon-lightbulb-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-link"></i><span class="i-name">icon-link</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-linkedin"></i><span class="i-name">icon-linkedin</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-linkedin-circled"></i><span class="i-name">icon-linkedin-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-list"></i><span class="i-name">icon-list</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-list-add"></i><span class="i-name">icon-list-add</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lkdto"></i><span class="i-name">icon-lkdto</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-location"></i><span class="i-name">icon-location</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-location-line"></i><span class="i-name">icon-location-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lock"></i><span class="i-name">icon-lock</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lock-line"></i><span class="i-name">icon-lock-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-lock-open"></i><span class="i-name">icon-lock-open</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-login"></i><span class="i-name">icon-login</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-logo-db"></i><span class="i-name">icon-logo-db</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-logout"></i><span class="i-name">icon-logout</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-loop"></i><span class="i-name">icon-loop</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-macstore"></i><span class="i-name">icon-macstore</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-magnet"></i><span class="i-name">icon-magnet</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mail"></i><span class="i-name">icon-mail</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mail-line"></i><span class="i-name">icon-mail-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-map"></i><span class="i-name">icon-map</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-meetup"></i><span class="i-name">icon-meetup</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-megaphone"></i><span class="i-name">icon-megaphone</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-megaphone-line"></i><span class="i-name">icon-megaphone-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-menu"></i><span class="i-name">icon-menu</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mic"></i><span class="i-name">icon-mic</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-minus"></i><span class="i-name">icon-minus</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-minus-circled"></i><span class="i-name">icon-minus-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-minus-squared"></i><span class="i-name">icon-minus-squared</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mixi"></i><span class="i-name">icon-mixi</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mobile"></i><span class="i-name">icon-mobile</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mobile-line"></i><span class="i-name">icon-mobile-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-money-line"></i><span class="i-name">icon-money-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-monitor"></i><span class="i-name">icon-monitor</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-moon"></i><span class="i-name">icon-moon</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mouse"></i><span class="i-name">icon-mouse</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-music"></i><span class="i-name">icon-music</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-music-line"></i><span class="i-name">icon-music-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-mute"></i><span class="i-name">icon-mute</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-myspace"></i><span class="i-name">icon-myspace</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-network"></i><span class="i-name">icon-network</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-newspaper"></i><span class="i-name">icon-newspaper</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-ninetyninedesigns"></i><span class="i-name">icon-ninetyninedesigns</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-note"></i><span class="i-name">icon-note</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-note-beamed"></i><span class="i-name">icon-note-beamed</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-note-line"></i><span class="i-name">icon-note-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-openid"></i><span class="i-name">icon-openid</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-opentable"></i><span class="i-name">icon-opentable</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-palette"></i><span class="i-name">icon-palette</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-paper-plane"></i><span class="i-name">icon-paper-plane</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-paper-plane-line"></i><span class="i-name">icon-paper-plane-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-params-line"></i><span class="i-name">icon-params-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pause"></i><span class="i-name">icon-pause</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-paypal"></i><span class="i-name">icon-paypal</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pencil"></i><span class="i-name">icon-pencil</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pencil-line"></i><span class="i-name">icon-pencil-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-phone"></i><span class="i-name">icon-phone</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-photo-line"></i><span class="i-name">icon-photo-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-picasa"></i><span class="i-name">icon-picasa</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-picture"></i><span class="i-name">icon-picture</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pinboard"></i><span class="i-name">icon-pinboard</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pinterest"></i><span class="i-name">icon-pinterest</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pinterest-circled"></i><span class="i-name">icon-pinterest-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-plancast"></i><span class="i-name">icon-plancast</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-play"></i><span class="i-name">icon-play</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-plurk"></i><span class="i-name">icon-plurk</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-plus"></i><span class="i-name">icon-plus</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-plus-circled"></i><span class="i-name">icon-plus-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-plus-squared"></i><span class="i-name">icon-plus-squared</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-pocket"></i><span class="i-name">icon-pocket</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-podcast"></i><span class="i-name">icon-podcast</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-popup"></i><span class="i-name">icon-popup</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-posterous"></i><span class="i-name">icon-posterous</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-print"></i><span class="i-name">icon-print</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-progress-0"></i><span class="i-name">icon-progress-0</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-progress-1"></i><span class="i-name">icon-progress-1</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-progress-2"></i><span class="i-name">icon-progress-2</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-progress-3"></i><span class="i-name">icon-progress-3</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-publish"></i><span class="i-name">icon-publish</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-qq"></i><span class="i-name">icon-qq</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-quora"></i><span class="i-name">icon-quora</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-quote"></i><span class="i-name">icon-quote</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-rdio"></i><span class="i-name">icon-rdio</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-rdio-circled"></i><span class="i-name">icon-rdio-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-record"></i><span class="i-name">icon-record</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-reddit"></i><span class="i-name">icon-reddit</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-renren"></i><span class="i-name">icon-renren</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-reply"></i><span class="i-name">icon-reply</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-reply-all"></i><span class="i-name">icon-reply-all</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-resize-full"></i><span class="i-name">icon-resize-full</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-resize-small"></i><span class="i-name">icon-resize-small</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-retweet"></i><span class="i-name">icon-retweet</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right"></i><span class="i-name">icon-right</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-bold"></i><span class="i-name">icon-right-bold</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-circled"></i><span class="i-name">icon-right-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-dir"></i><span class="i-name">icon-right-dir</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-open"></i><span class="i-name">icon-right-open</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-open-big"></i><span class="i-name">icon-right-open-big</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-open-mini"></i><span class="i-name">icon-right-open-mini</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-right-thin"></i><span class="i-name">icon-right-thin</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-rocket"></i><span class="i-name">icon-rocket</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-rss"></i><span class="i-name">icon-rss</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-scribd"></i><span class="i-name">icon-scribd</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-search"></i><span class="i-name">icon-search</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-search-line"></i><span class="i-name">icon-search-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-share"></i><span class="i-name">icon-share</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-shareable"></i><span class="i-name">icon-shareable</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-shop-line"></i><span class="i-name">icon-shop-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-shuffle"></i><span class="i-name">icon-shuffle</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-signal"></i><span class="i-name">icon-signal</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-sina-weibo"></i><span class="i-name">icon-sina-weibo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-skype"></i><span class="i-name">icon-skype</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-skype-circled"></i><span class="i-name">icon-skype-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-smashing"></i><span class="i-name">icon-smashing</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-smashmag"></i><span class="i-name">icon-smashmag</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-songkick"></i><span class="i-name">icon-songkick</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-sound"></i><span class="i-name">icon-sound</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-sound-line"></i><span class="i-name">icon-sound-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-soundcloud"></i><span class="i-name">icon-soundcloud</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-spotify"></i><span class="i-name">icon-spotify</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-spotify-circled"></i><span class="i-name">icon-spotify-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-stackoverflow"></i><span class="i-name">icon-stackoverflow</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-star"></i><span class="i-name">icon-star</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-star-empty"></i><span class="i-name">icon-star-empty</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-star-line"></i><span class="i-name">icon-star-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-statusnet"></i><span class="i-name">icon-statusnet</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-steam"></i><span class="i-name">icon-steam</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-stop"></i><span class="i-name">icon-stop</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-stripe"></i><span class="i-name">icon-stripe</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-stumbleupon"></i><span class="i-name">icon-stumbleupon</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-stumbleupon-circled"></i><span class="i-name">icon-stumbleupon-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-suitcase"></i><span class="i-name">icon-suitcase</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-sweden"></i><span class="i-name">icon-sweden</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-switch"></i><span class="i-name">icon-switch</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-t-shirt-line"></i><span class="i-name">icon-t-shirt-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tag"></i><span class="i-name">icon-tag</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tag-line"></i><span class="i-name">icon-tag-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tape"></i><span class="i-name">icon-tape</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-target"></i><span class="i-name">icon-target</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-thermometer"></i><span class="i-name">icon-thermometer</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-thumbs-down"></i><span class="i-name">icon-thumbs-down</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-thumbs-up"></i><span class="i-name">icon-thumbs-up</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-thumbs-up-line"></i><span class="i-name">icon-thumbs-up-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-ticket"></i><span class="i-name">icon-ticket</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-to-end"></i><span class="i-name">icon-to-end</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-to-start"></i><span class="i-name">icon-to-start</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tools"></i><span class="i-name">icon-tools</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-traffic-cone"></i><span class="i-name">icon-traffic-cone</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-trash"></i><span class="i-name">icon-trash</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-trash-line"></i><span class="i-name">icon-trash-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-trophy"></i><span class="i-name">icon-trophy</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-truck-line"></i><span class="i-name">icon-truck-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tumblr"></i><span class="i-name">icon-tumblr</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tumblr-circled"></i><span class="i-name">icon-tumblr-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-tv-line"></i><span class="i-name">icon-tv-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-twitter"></i><span class="i-name">icon-twitter</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-twitter-circled"></i><span class="i-name">icon-twitter-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up"></i><span class="i-name">icon-up</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-bold"></i><span class="i-name">icon-up-bold</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-circled"></i><span class="i-name">icon-up-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-dir"></i><span class="i-name">icon-up-dir</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-open"></i><span class="i-name">icon-up-open</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-open-big"></i><span class="i-name">icon-up-open-big</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-open-mini"></i><span class="i-name">icon-up-open-mini</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-up-thin"></i><span class="i-name">icon-up-thin</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-upload"></i><span class="i-name">icon-upload</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-upload-cloud"></i><span class="i-name">icon-upload-cloud</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-user"></i><span class="i-name">icon-user</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-user-add"></i><span class="i-name">icon-user-add</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-user-line"></i><span class="i-name">icon-user-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-users"></i><span class="i-name">icon-users</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-vcard"></i><span class="i-name">icon-vcard</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-viadeo"></i><span class="i-name">icon-viadeo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-video"></i><span class="i-name">icon-video</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-videocam-line"></i><span class="i-name">icon-videocam-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-vimeo"></i><span class="i-name">icon-vimeo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-vimeo-circled"></i><span class="i-name">icon-vimeo-circled</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-vk"></i><span class="i-name">icon-vk</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-vkontakte"></i><span class="i-name">icon-vkontakte</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-volume"></i><span class="i-name">icon-volume</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-w3c"></i><span class="i-name">icon-w3c</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-wallet-line"></i><span class="i-name">icon-wallet-line</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-water"></i><span class="i-name">icon-water</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-weibo"></i><span class="i-name">icon-weibo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-wikipedia"></i><span class="i-name">icon-wikipedia</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-window"></i><span class="i-name">icon-window</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-windows"></i><span class="i-name">icon-windows</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-wordpress"></i><span class="i-name">icon-wordpress</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-xing"></i><span class="i-name">icon-xing</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-yahoo"></i><span class="i-name">icon-yahoo</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-yelp"></i><span class="i-name">icon-yelp</span>
|
||
|
|
</div>
|
||
|
|
<div class="the-icons span3">
|
||
|
|
<i class="icon-youtube"></i><span class="i-name">icon-youtube</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="section mcb-section" id="columns" style="padding-top:50px; padding-bottom:40px;">
|
||
|
|
<div class="section_wrapper mcb-section-inner">
|
||
|
|
<div class="wrap mcb-wrap one valign-top clearfix">
|
||
|
|
<div class="mcb-wrap-inner">
|
||
|
|
<div class="column mcb-column one column_helper">
|
||
|
|
<div class="helper">
|
||
|
|
<div class="helper_header">
|
||
|
|
<h4 class="title">Columns</h4>
|
||
|
|
<div class="links">
|
||
|
|
<a class="link link-1 toggle" href="#" data-rel="1"><i class="icon-code"></i> Example Code</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="helper_content">
|
||
|
|
<div class="item item-1">
|
||
|
|
<p>
|
||
|
|
Split your content into columns.
|
||
|
|
</p>
|
||
|
|
<hr>
|
||
|
|
<p class="big">
|
||
|
|
Example Code:
|
||
|
|
</p>
|
||
|
|
<pre class="brush: xml;">
|
||
|
|
<div class="column mcb-column two-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>2/3</h5> Lorem ipsum dolor sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</pre>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/1</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi sit amet sem consequat eget ultricies nisi tincidunt. Donec dictum posuere commodo. Curabitur sollicitudin dictum urna quis molestie. Proin eget massa quis lorem hendrerit consequat interdum eget tortor.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/2</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi consequat eget ultricies nisi tincidunt sit amet sem consequat eget adipiscing ultricies nisi tincidunt.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-second column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/2</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi consequat eget ultricies nisi tincidunt sit amet sem consequat eget adipiscing ultricies nisi tincidunt.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column two-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>2/3</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi sit amet sem conse quat eget ultricies nisi tincidunt. Donec dictum posuere commodo. Curabitur soll dictum icitudin dictum dolor sit amet, consectetur adipiscing elit.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/3</h5> Lorem ipsum dolor sit amet, consectetur adipi scing elit. Vestibulum laoreet mi sit amet. amet sem conse.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/3</h5> Lorem ipsum dolor sit amet, consectetur adipi scing elit. Vestibulum laoreet mi sit amet. amet sem conse.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/3</h5> Lorem ipsum dolor sit amet, consectetur adipi scing elit. Vestibulum laoreet mi sit amet. amet sem conse.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-third column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/3</h5> Lorem ipsum dolor sit amet, consectetur adipi scing elit. Vestibulum laoreet mi sit amet. amet sem conse.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column three-fourth column_column ">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>3/4</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi sit amet sem consequat eget ultricies nisi tincidunt. Donec dictum posuere commodo. Curabitur sollicitudin dictum urna quis molestie. Proin eget massa quis lorem hendrerit consequat interdum eget.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/4</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing elit vesti bulum.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/4</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing elit vesti bulum.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/4</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing elit vesti bulum.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/4</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing elit vesti bulum.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fourth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/4</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing elit vesti bulum.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column three-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>3/5</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi sit amet sem consequat eget ultricies nisi tincidunt. Donec dictum posuere commodo. Curabitur sollicitudin dictum urna quis molestie.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column four-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>4/5</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi sit amet sem consequat eget ultricies nisi tincidunt. Donec dictum posuere commodo. Curabitur sollicitudin dictum urna quis molestie. Proin eget massa quis lorem hendrerit consequat interdum eget tortor.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-fifth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/5</h5> Lorem ipsum dolor eget consequat sit amet, conse ctetur adipiscing.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one column_divider">
|
||
|
|
<hr class="no_line">
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column five-sixth column_column ">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>5/6</h5> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum laoreet mi sit amet sem consequat eget ultricies nisi tincidunt. Donec dictum posuere commodo. Curabitur sollicitudin dictum urna quis molestie. Proin eget massa quis lorem hendrerit consequat interdum eget tortor.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="column mcb-column one-sixth column_column">
|
||
|
|
<div class="column_attr clearfix">
|
||
|
|
<h5>1/6</h5> Lorem ipsum dolor eget consequat sit amet.
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<footer id="Footer" class="clearfix">
|
||
|
|
<div class="widgets_wrapper" style="padding:100px 0 290px">
|
||
|
|
<div class="container">
|
||
|
|
<div class="column one">
|
||
|
|
<aside id="text-9" class="widget widget_text">
|
||
|
|
<div class="textwidget">
|
||
|
|
<div style="text-align: center">
|
||
|
|
<h1 style="font-weight: 300">Creating with BeTheme is super fast and easy
|
||
|
|
<br>
|
||
|
|
Start your website today!</h1>
|
||
|
|
<hr class="no_line" style="margin: 0 auto 50px">
|
||
|
|
<div class="button-stroke">
|
||
|
|
<a class="button button_size_4 button_theme button_js" href="http://bit.ly/1M6lijQ" target="_blank"><span class="button_label">BUY NOW</span></a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</aside>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="footer_copy">
|
||
|
|
<div class="container">
|
||
|
|
<div class="column one">
|
||
|
|
<a id="back_to_top" class="button button_left button_js" href="#"><span class="button_icon"><i class="icon-up-open-big"></i></span></a>
|
||
|
|
<div class="copyright">
|
||
|
|
© 2017 BeTheme. Muffin group - HTML by <a target="_blank" rel="nofollow" href="http://bit.ly/1M6lijQ">BeantownThemes</a>
|
||
|
|
</div>
|
||
|
|
<ul class="social"></ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- JS -->
|
||
|
|
<script src="../js/jquery-2.1.4.min.js"></script>
|
||
|
|
|
||
|
|
<script src="../js/mfn.menu.js"></script>
|
||
|
|
<script src="../js/jquery.plugins.js"></script>
|
||
|
|
<script src="../js/jquery.jplayer.min.js"></script>
|
||
|
|
<script src="../js/animations/animations.js"></script>
|
||
|
|
<script src="../js/translate3d.js"></script>
|
||
|
|
<script src="../js/scripts.js"></script>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
jQuery(window).load(function() {
|
||
|
|
var retina = window.devicePixelRatio > 1 ? true : false;
|
||
|
|
if (retina) {
|
||
|
|
var retinaEl = jQuery("#logo img.logo-main");
|
||
|
|
var retinaLogoW = retinaEl.width();
|
||
|
|
var retinaLogoH = retinaEl.height();
|
||
|
|
retinaEl.attr("src", "images/retina-theme.png").width(retinaLogoW).height(retinaLogoH);
|
||
|
|
var stickyEl = jQuery("#logo img.logo-sticky");
|
||
|
|
var stickyLogoW = stickyEl.width();
|
||
|
|
var stickyLogoH = stickyEl.height();
|
||
|
|
stickyEl.attr("src", "images/retina-theme.png").width(stickyLogoW).height(stickyLogoH);
|
||
|
|
var mobileEl = jQuery("#logo img.logo-mobile");
|
||
|
|
var mobileLogoW = mobileEl.width();
|
||
|
|
var mobileLogoH = mobileEl.height();
|
||
|
|
mobileEl.attr("src", "images/retina-theme.png").width(mobileLogoW).height(mobileLogoH);
|
||
|
|
var mobileStickyEl = jQuery("#logo img.logo-mobile-sticky");
|
||
|
|
var mobileStickyLogoW = mobileStickyEl.width();
|
||
|
|
var mobileStickyLogoH = mobileStickyEl.height();
|
||
|
|
mobileStickyEl.attr("src", "images/retina-theme.png").width(mobileStickyLogoW).height(mobileStickyLogoH);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<!-- SYNTAX HIGHLIGHTER SCRIPT FOR DEMO CODE -->
|
||
|
|
<link rel="stylesheet" href="css/syntaxHighlighter/sh.css">
|
||
|
|
<script src="css/syntaxHighlighter/sh.js"></script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|