Porto Responsive Blogger Template

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<b:include data='blog' name='google-analytics'/>
<meta content='Keywords_Here' name='keywords'/>
<b:if cond='data:blog.pageType == "error_page"'>
<title>Sorry, Page Not Found !</title>
</b:if>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>
<meta content='Ar-themes' name='Author'/>
<meta content='index, follow' name='robots'/>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
<b:skin><![CDATA[/*
-----------------------------------------------
Type : Responsive Blogger Template Style
Name : Porto
Version : 1.0.0
Author : Ar-themes
URL : http://ar-themes.blogspot.com
----------------------------------------------- */
/* Variable definitions
=======================
<Group description="Page Text" selector="body">
<Variable name="body.font" description="Font" type="font"
default="normal normal 14px Open Sans" value="normal normal 14px Open Sans"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#333333" value="#333333"/>
</Group>
<Group description="Backgrounds" selector="body">
<Variable name="body.background.color" description="Outer Background" type="color" default="#F7F7F7" value="#F7F7F7"/>
<Variable name="content.background.color" description="Main Background" type="color" default="transparent" value="transparent"/>
<Variable name="header.border.color" description="Header Border" type="color" default="#E2E2E2" value="#E2E2E2"/>
</Group>
<Group description="Links" selector=".container">
<Variable name="link.color" description="Link Color" type="color" default="#0072FE" value="#0072FE"/>
<Variable name="link.visited.color" description="Visited Color" type="color" default="#888888" value="#888888"/>
<Variable name="link.hover.color" description="Hover Color" type="color" default="#0072FE" value="#0072FE"/>
</Group>
<Group description="Blog Title" selector=".header h1">
<Variable name="header.font" description="Font" type="font"
default="normal bold 30px Calibri" value="normal bold 30px Calibri"/>
<Variable name="header.text.color" description="Title Color" type="color" default="#333333" value="#333333"/>
</Group>
<Group description="Blog Description" selector=".header .description">
<Variable name="description.font" description="Font" type="font"
default="normal normal 14px Open Sans" value="normal normal 14px Open Sans"/>
<Variable name="description.text.color" description="Description Color" type="color"
default="#333333" value="#333333"/>
</Group>
<Group description="Navigation" selector="#navigation">
<Variable name="navigation.font" description="Font" type="font"
default="normal normal 14px Open Sans" value="normal normal 14px Open Sans"/>
<Variable name="navigation.text.color" description="Text Color" type="color"
default="#333333" value="#333333"/>
<Variable name="navigation.text.hover.color" description="Hover Text Color" type="color"
default="#0372FF" value="#0372FF"/>
</Group>
<Group description="Icons" selector="#search,#social">
<Variable name="icons.color" description="Color" type="color"
default="#0072FE" value="#0072FE"/>
<Variable name="icons.hover.color" description="Hover Color" type="color"
default="#333333" value="#333333"/>
<Variable name="icons.background.color" description="Background Hover Color" type="color"
default="#E1E1E1" value="#E1E1E1"/>
</Group>
<Group description="Mian Color" selector="div.clearfix">
<Variable name="main.color" description="Color" type="color"
default="#0072FE" value="#0072FE"/>
</Group>
<Group description="Sidebar" selector="aside">
<Variable name="sidebar.gadget.title.font" description="Title Font" type="font"
default="normal bold 16px Open Sans" value="normal bold 16px Open Sans"/>
<Variable name="sidebar.gadget.title.color" description="Title Color" type="color"
default="#333333" value="#333333"/>
<Variable name="sidebar.text.color" description="Text Color" type="color"
default="#333333" value="#333333"/>
</Group>
<Group description="Footer" selector="footer">
<Variable name="footer.text.color" description="Text Color" type="color"
default="#333333" value="#333333"/>
<Variable name="footer.border.color" description="Border Color" type="color"
default="#E1E1E1" value="#E1E1E1"/>
</Group>
<Group description="Footer Gadgets" selector="footer .section .widget h2:first-child">
<Variable name="footer.gadget.title.font" description="Title Font" type="font"
default="normal bold 21px Open Sans" value="normal bold 21px Open Sans"/>
<Variable name="footer.gadget.title.color" description="Title Color" type="color"
default="#333333" value="#333333"/>
</Group>
<Group description="Error Page Title" selector=".error-title">
<Variable name="error.title.font" description="Title Font" type="font"
default="normal bold 40px Open Sans" value="normal bold 40px Open Sans"/>
<Variable name="error.title.color" description="Title Color" type="color"
default="#ff0000" value="#ff0000"/>
</Group>
<Group description="Error Page Description" selector=".error-description">
<Variable name="error.description.font" description="Description Font" type="font"
default="normal normal 18px Open Sans" value="normal normal 18px Open Sans"/>
<Variable name="error.description.color" description="Description Color" type="color"
default="#333333" value="#333333"/>
</Group>
*/
/* Global
----------------------------------------------- */
body {
margin: 0;
padding: 0;
position: relative;
background-color: $(body.background.color);
font: $(body.font);
color: $(body.text.color);
}
.container {
margin-left: auto;
margin-right: auto;
max-width: 1170px;
padding-left: 15px;
padding-right: 15px;
background-color: $(content.background.color);
}
.clearfix:after {
clear: both;
}
.clearfix:after, .clearfix:before {
content: ".";
display: block;
overflow: hidden;
visibility: hidden;
font-size: 0px;
line-height: 0;
width: 0px;
height: 0px;
}
a {
text-decoration: none;
color: $(link.color);
}
a:visited {
color: $(link.visited.color);
}
a:hover {
color: $(link.hover.color);
}
ul {
list-style-type: none;
}
img {
max-width: 100%;
}
.left {
float: left;
margin-right: 15px;
margin-bottom: 5px;
}
.right {
float: right;
margin-left: 15px;
margin-bottom: 5px;
}
.center {
text-align: center;
margin-bottom: 5px;
}
#logo, #navigation, #search, #social {
display: inline-block;
margin-right: 2%;
}
body#layout .main-posts {
width: 66.5%;
float: left;
}
body#layout .sidebar {
width: 32%;
float: right;
}
body#layout .footer-section {
width: 33.33%;
float: left;
}
/* HEADER
----------------------------------------------- */
header {
position: relative;
margin: 0;
padding: 30px 0;
border-bottom: 3px solid $(header.border.color);
}
/* LOGO
----------------------------------------------- */
#logo {
width: 188px;
}
.header h1.title {
margin: 0;
font: $(header.font);
color: $(header.text.color);
}
.header .titlewrapper, .header .descriptionwrapper {
display: inline-block;
font: $(description.font);
color: $(description.text.color);
}
/* NAVIGATION
----------------------------------------------- */
#navigation {
width: 466px;
}
nav ul {
margin: 0;
padding: 0;
}
nav ul li {
display: inline-block;
}
nav ul li a {
font: $(navigation.font);
color: $(navigation.text.color);
padding: 44px 0;
border-bottom: 3px solid transparent;
margin: 0px 10px;
}
.active a, nav ul li:hover a {
color: $(navigation.text.hover.color);
border-bottom: 3px solid $(navigation.text.hover.color);
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
nav ul li:hover > ul {
display: block;
}
nav li ul {
display: none;
position: absolute;
top: 107px;
text-align: left;
background-color: #fff;
border: 1px solid #eee;
border-top: 3px solid $(navigation.text.hover.color);
z-index: 99;
min-width: 165px;
max-width: 195px;
}
nav li ul li {
display: block;
}
nav li ul li a {
color: $(navigation.text.color) !important;
margin: 0 20px;
display: block;
padding: 10px 0;
border-bottom: 1px solid #eee !important;
}
nav li ul li a:hover {
color: $(navigation.text.hover.color) !important;
border-bottom-width: 1px !important;
}
nav li ul li:last-child a, nav .sub li:last-child a:hover {
border-bottom-width: 0 !important;
}
.marrow {
color: $(navigation.text.color);
margin-left: 5px;
}
nav ul li:hover .marrow {
color: $(navigation.text.hover.color);
}
.m-button {
display: none;
text-align: right;
width: 93px;
font-size: 30px;
position: relative;
height: 20px;
}
.m-button i {
position: absolute;
right: 0px;
cursor: pointer;
color: $(navigation.text.color);
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
.m-button i:hover {
color: $(navigation.text.hover.color);
}
@media only screen and (max-width: 1000px) {
#navigation {
display: block;
position: absolute;
width: 100%;
text-align: center;
margin-bottom: 0px;
margin-right: 0px;
margin-top: 33px;
background-color: #FFF;
border: 1px solid #EEE;
border-top-width: 0;
box-sizing: border-box;
z-index: 99;
}
nav ul li, nav ul li ul {
display: block;
}
nav ul li {
margin: 0px 20px;
}
nav ul li a {
padding: 10px 0px;
border-bottom: 1px solid #eee;
display: block;
}
nav ul li:last-child a, nav ul li:hover:last-child a {
border-bottom-width: 0;
}
.active a, nav ul li:hover a {
border-bottom-width: 1px;
}
nav li ul {
position: relative;
top: -1px;
text-align: center;
min-width: 100%;
max-width: 100%;
border-width: 0;
background-color: #eee;
}
}
/* SEARCH
----------------------------------------------- */
#search {
margin-right: 0;
width: 271px;
}
#search .s-input {
background-color: #fff;
height: 30px;
width: 208px;
border: 2px solid $(header.border.color);
padding: 0 10px;
}
.s-submit {
height: 33px;
width: 35px;
color: $(icons.hover.color);
background-color: #FFF;
border: 2px solid $(header.border.color);
cursor: pointer;
padding: 0px 10px;
display: inline-block;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
content: "\f002";
}
.s-submit:hover {
color: $(icons.color);
background-color: $(icons.background.color);
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
/* SOCIAL
----------------------------------------------- */
#social {
margin-right: 0;
width: 186px;
}
#social a {
color: $(icons.color);
background-color: #FFF;
border: 2px solid $(header.border.color);
height: 21px;
display: inline-block;
padding: 4px;
width: 22px;
text-align: center;
}
#social a:hover {
background-color: $(icons.background.color);
color: $(icons.hover.color);
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
/* MAIN CONTENT
----------------------------------------------- */
.summary-outer img {
vertical-align: top;
}
.ads, .main-posts, aside {
margin-top: 30px;
}
.date-outer {
float: left;
margin-right: 30px;
margin-bottom: 30px;
}
.date-outer:nth-child(3n+3) {
margin-right: 0;
}
.main-posts {
width: 795px;
float: left;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.post {
margin-bottom: 0;
}
.post-body {
border-bottom-width: 0;
margin-bottom: 0;
padding-bottom: 0;
}
.summary-outer a {
position: relative;
display: block;
}
.overlay {
background-color: rgba(0, 0, 0, 0.8);
position: absolute;
top: 0;
width: 245px;
height: 245px;
text-align: center;
line-height: 270px;
opacity: 0;
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
.summary-outer a:hover .overlay {
opacity: 1;
}
.overlay i {
line-height: inherit;
color: $(main.color);
}
.loader {
display: none !important;
width: 100%;
left: 0;
position: fixed;
z-index: 90;
text-align: center;
bottom: 100px;
}
.trigger {
display: none !important;
width: 100%;
margin-bottom: 30px;
}
.trigger a {
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 2px solid #E1E1E1;
background-color: #E1E1E1;
display: block;
width: 100%;
padding: 8px 0px;
color: #9D9D9D;
font-size: 20px;
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
.trigger a:hover {
color: $(main.color);
border-color: #E1E1E1;
background-color: #FFF;
}
.popular-posts ul {
padding: 0;
}
[data-title]:before {
color: $(main.color);
border-bottom: 3px solid $(main.color);
}
[data-title]:after {
border-top: 5px solid $(main.color);
}
.post, .post-pager, #comments {
border-top: 3px solid $(main.color) !important;
}
h3.post-title span {
border-bottom: 3px solid $(main.color);
}
.status-msg-wrap {
border-left: 4px solid $(main.color) !important;
}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit:hover {
background-color: $(main.color);
}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit {
color: $(main.color);
}
.list-label-widget-content li span {
color: $(main.color);
}
.list-label-widget-content li span:first-child {
border: 1px solid $(main.color);
}
.list-label-widget-content li a:hover, #footer-nav .list-label-widget-content li a:hover {
background-color: $(main.color);
}
.label-size a:hover, .label-size:hover .label-count, .label-size:hover a {
background-color: $(main.color);
}
.cloud-label-widget-content .label-size span:first-child, .cloud-label-widget-content .label-size span:first-child span:nth-child(2) {
background-color: $(main.color);
}
blockquote:after, #toTop:hover {
color: $(main.color);
}
blockquote {
border-left: 3px solid $(main.color) !important;
}
.error-description .error-line2 a:hover {
background-color: $(main.color);
border: 2px solid $(main.color);
}
.error-title {
font: $(error.title.font);
color: $(error.title.color);
}
.error-description {
font: $(error.description.font);
color: $(error.description.color);
}
/* SIDEBAR
----------------------------------------------- */
aside {
color: $(sidebar.text.color);
width: 345px;
float: right;
margin-left: 30px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
aside .section .widget {
padding: 20px 20px;
margin-bottom: 20px;
background-color: #FFF;
border: 1px solid #eee;
}
aside .section .widget:first-child {
border-top: 3px solid $(main.color);
}
aside .section .widget h2:first-child {
margin: -5px 0px 22px;
padding-bottom: 10px;
border-bottom: 1px solid #EEE;
font: $(sidebar.gadget.title.font);
color: $(sidebar.gadget.title.color)
}
aside .section .widget h2:first-child span {
border-bottom: 3px solid $(main.color);
padding-bottom: 9px;
}
/* FOOTER
----------------------------------------------- */
footer {
padding-top: 30px;
border-top: 3px solid $(footer.border.color);
color: $(footer.text.color);
}
footer:before {
content: "" !important;
height: 35px !important;
width: 60px !important;
visibility: visible !important;
position: absolute;
left: 47.77%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin: -43px 0px 0px;
overflow: hidden !important;
background: url('http://3.bp.blogspot.com/-Kt9ha9xVNII/VAzPOe8cL3I/AAAAAAAACMw/Mhvp-hEKQFY/s1600/border.png') no-repeat scroll 0% 0% #F7F7F7;
}
footer .footer-section {
width: 30%;
margin-right: 5%;
float: left;
}
footer .section .widget h2:first-child {
font: $(footer.gadget.title.font);
color: $(footer.gadget.title.color);
}
footer #section-4 {
margin-right: 0;
}
footer .footer-rights {
margin-top: 30px;
border-top: 3px solid $(footer.border.color);
padding: 30px 0;
}
]]></b:skin>
<style type='text/css'>
/* TOOLTIPS
----------------------------------------------- */
[data-title] {
position: relative;
z-index: 2;
cursor: pointer;
}
[data-title]:before, [data-title]:after {
visibility: hidden;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
pointer-events: none;
z-index: 90;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
[data-title]:before {
position: absolute;
bottom: 134px;
left: 50%;
margin-bottom: 5px;
margin-left: -90px;
padding: 7px;
width: 180px;
background-color: #FFF;
content: attr(data-title);
text-align: center;
font-size: 14px;
line-height: 1.2;
}
[data-title]:after {
position: absolute;
bottom: 134px;
left: 50%;
margin-left: -5px;
width: 0;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
content: " ";
font-size: 0;
line-height: 0;
}
[data-title]:hover:before, [data-title]:hover:after {
visibility: visible;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
/* LABELS
----------------------------------------------- */
.list-label-widget-content ul, .list-label-widget-content li {
padding: 0;
list-style: none;
}
.list-label-widget-content li a {
background-color: #F3F3F3;
color: #525252;
border: 1px solid #E2E2E2;
border-radius: 3px;
float: left;
padding: 5px;
margin-bottom: 5px;
line-height: 16px;
line-height: 16px;
width: 83%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-size: 13px;
}
.list-label-widget-content li span {
background-color: #F3F3F3;
border-radius: 3px;
float: right;
padding: 5px;
margin-bottom: 5px;
text-align: center;
border: 1px solid #E2E2E2;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 15%;
line-height: 16px;
padding: 5px;
font-size: 13px;
}
.list-label-widget-content li span:first-child {
background-color: #F3F3F3;
border-radius: 3px;
border-right: 10px solid;
border-left: 10px solid;
width: 83% !important;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
float: left;
padding: 5px;
margin-bottom: 5px;
line-height: 16px;
width: 250px;
}
.list-label-widget-content li a:hover, #footer-nav .list-label-widget-content li a:hover {
color: #fff;
}
.cloud-label-widget-content .label-size {
font-size: 100%;
float: left;
}
.cloud-label-widget-content .label-size a {
color: #666;
float: left;
font-size: 12px;
margin: 0 5px 5px 0;
padding: 5px;
text-decoration: none;
border: 1px solid #E2E2E2;
border-radius: 3px;
}
.label-size a:hover, .label-size:hover .label-count, .label-size:hover a {
color: #FFF;
text-decoration: none;
transition: all 0.2s ease-out 0s;
}
.cloud-label-widget-content .label-size span {
color: #666;
float: left;
font-size: 12px;
margin: 0 5px 5px 0;
padding: 5px;
text-decoration: none;
border: 1px solid #E2E2E2;
border-radius: 3px;
}
.cloud-label-widget-content .label-size span:first-child, .cloud-label-widget-content .label-size span:first-child span:nth-child(2) {
color: #FFF;
}
/* EMAILS
----------------------------------------------- */
.FollowByEmail .follow-by-email-inner .follow-by-email-address {
background-color: #fff;
padding: 6px 10px;
border: 2px solid #e1e1e1;
width: 100%;
height: 38px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit {
background-color: #E1E1E1;
width: 62px;
margin: 0px;
border-radius: 0px;
height: 38px;
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit:hover {
color: #FFF;
}
/* PROFILE
----------------------------------------------- */
.profile-img {
margin: 0px 15px 5px 5px;
border: 3px solid #eee;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.profile-name-link.g-profile {
margin-bottom: 10px;
}
/* STATUS MESSAGE
----------------------------------------------- */
.status-msg-wrap {
margin: 0 auto 30px;
width: 100%;
border: 1px solid #eee;
box-sizing: border-box;
}
.status-msg-body {
margin: 8px 0px;
}
.status-msg-border {
border-width: 0px;
opacity: 1;
}
.status-msg-bg {
background-color: #FFF;
opacity: 1;
padding: 10px 0;
}
/* TO TOP
----------------------------------------------- */
#toTop {
position: fixed;
right: 10%;
z-index: 2000;
bottom: -100px;
width: 45px;
height: 45px;
color: #9D9D9D;
background-color: #E1E1E1;
border: 2px solid #E1E1E1;
line-height: 43.5px;
text-align: center;
box-sizing: border-box;
cursor: pointer;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
transition: all 0.6s ease;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#toTop:hover {
background-color: #fff;
}
.hide {
bottom: -100px !important;
}
.show {
bottom: -2px !important;
}
/* QUOTE
----------------------------------------------- */
blockquote:after {
content: "\f10d";
position: absolute;
top: 50%;
margin-top: -26px;
left: 40px;
margin-left: -18px;
width: 32px;
height: 42px;
display: inline-block;
font-family: FontAwesome;
font-size: 35px;
font-style: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
blockquote {
position: relative;
background: none repeat scroll 0% 0% #F9F9F9;
border: 1px solid #F1F1F1;
border-left: 3px solid $(main.color);
padding: 20px 20px 20px 75px;
color: #A7A7A8;
font-style: italic;
line-height: 1.3;
box-sizing: border-box;
}
/* COMMENTS
----------------------------------------------- */
#comments {
padding: 20px 50px;
background-color: #FFF;
border: 1px solid #eee;
}
#comments .user a {
color: #444;
font-style: normal;
font-size: 14px;
line-height: 26px;
}
#comments .datetime,
#comments .datetime a {
display: inherit;
margin-left: 0;
color: #A3A3A3;
text-decoration: none;
font-size: 12px;
margin: -4px 0 0;
}
#comments .datetime a {
margin:auto;
}
#comments .comment-actions a {
background: linear-gradient(to bottom,#2AACDB 0%,#1A79C5 100%) repeat scroll 0% 0% transparent;
border: 1px solid #1B95D0;
border-radius: 2px;
color: #FFF;
font-size: 11px;
line-height: 1.2em;
padding: 3px 9px 2px;
text-transform: uppercase;
text-decoration: none;
margin-right: 10px;
}
#comments .comment {
border-bottom: 1px solid #E5E5E5;
}
#comments .loadmore {
margin-top: 0;
}
.comment-replies .inline-thread {
background: none repeat scroll 0% 0% #F8F8FF;
border-width: 1px 1px 1px 3px;
border-style: solid;
border-color: #E2E2E2 #E2E2E2 #E2E2E2 #1B95D0;
}
#comment-editor {
height: 235px;
}
#comments .avatar-image-container img {
border:2px solid #EEE;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* RESPONSIVE
----------------------------------------------- */
@media only screen and (min-width: 1001px) and (max-width: 1220px) {
.container {
max-width: 960px;
}
#logo {
width: 50.2%;
}
#navigation {
text-align: right;
margin-right: 0px;
}
#navigation, #search, #social {
width: auto;
}
.main-posts {
width: 613px;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
.summary-outer .toptip img, .overlay {
width: 194px;
height: 194px;
}
[data-title]:before, [data-title]:after {
bottom: 119px;
}
.overlay {
line-height: 194px;
}
aside {
width: 332px;
margin-left: 15px;
}
}
@media only screen and (min-width: 1000px) {
#navigation {
display: inline-block !important;
}
}
@media only screen and (max-width: 1000px) {
#navigation {
display: none;
}
.m-button {
display: inline-block;
}
}
@media only screen and (min-width: 811px) and (max-width: 1000px) {
.container {
max-width: 765px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
aside {
margin: 0 0 30px;
}
footer .footer-section {
width: 48%;
margin-right: 4%;
}
footer #section-3 {
margin-right: 0px;
}
footer #section-4 {
width: 100%;
margin-top: 20px;
}
footer .footer-rights {
text-align: center;
}
}
@media only screen and (min-width: 661px) and (max-width: 810px) {
.container {
max-width: 612px;
}
#logo {
width: 100%;
}
#navigation {
margin-top: 67px;
}
.m-button {
width: 147px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
.summary-outer .toptip img, .overlay {
width: 194px;
height: 194px;
}
[data-title]:before, [data-title]:after {
bottom: 119px;
}
.overlay {
line-height: 194px;
}
aside {
margin: 0 0 30px;
}
footer .footer-section {
width: 48%;
margin-right: 4%;
}
footer #section-3 {
margin-right: 0px;
}
footer #section-4 {
width: 100%;
margin-top: 20px;
}
footer .footer-rights {
text-align: center;
}
}
@media only screen and (max-width: 660px) {
header {
text-align: center;
}
#logo, #search, #social {
width: 100%;
margin-bottom: 15px;
}
#search .s-input {
width: 80%;
box-sizing: border-box;
height: 34px;
}
.s-submit {
box-sizing: border-box;
}
#navigation {
margin-top: 155px;
}
.m-button {
text-align: center;
width: 100%;
}
.m-button i {
position: relative;
display: table;
margin: 0 auto;
}
.footer-section {
width: 100% !important;
margin-top: 20px;
margin-right: 0 !important;
}
footer .footer-rights {
text-align: center;
}
blockquote {
margin: 0;
}
.left-older-link {
margin-bottom: 30px;
}
.left-older-link, .right-newer-link {
width: 100% !important;
}
footer:before {
background: none repeat scroll 0% 0% transparent;
}
}
@media only screen and (min-width: 451px) and (max-width: 660px) {
.container {
max-width: 403px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 15px;
margin-bottom: 15px;
}
.date-outer:nth-child(3n+3) {
margin-right: 15px;
}
.date-outer:nth-child(2n+2) {
margin-right: 0px;
}
.summary-outer .toptip img, .overlay {
width: 194px;
height: 194px;
}
[data-title]:before, [data-title]:after {
bottom: 119px;
}
.overlay {
line-height: 194px;
}
aside {
margin: 0 0 30px;
}
}
@media only screen and (min-width: 309px) and (max-width: 450px) {
.container {
max-width: 245px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 0;
margin-bottom: 15px;
}
.date-outer:nth-child(3n+3) {
margin-right: 0;
}
.summary-outer .toptip img, .overlay {
width: 245px;
height: 245px;
}
aside {
margin: 0 0 30px;
}
h3.post-title span {
border-bottom-width: 0;
}
}
@media only screen and (max-width: 308px) {
.container {
max-width: 80%;
}
#logo, #search, #social {
margin-bottom: 11px;
}
#social a, .s-submit {
margin-top: 4px;
}
.main-posts, aside {
width: 100%;
}
.date-outer {
margin-right: 0;
margin-bottom: 15px;
}
.date-outer:nth-child(3n+3) {
margin-right: 0;
}
.summary-outer .toptip img, .overlay {
width: 100%;
height: 100%;
}
[data-title]:before, [data-title]:after {
bottom: 119px;
}
.overlay i {
display: none;
}
aside {
margin: 0 0 30px;
}
h3.post-title span {
border-bottom-width: 0;
}
}
@-moz-document url-prefix() {
nav li ul {
top: 108px;
}
}
</style>
<b:if cond='data:blog.url == data:blog.homepageUrl'><style>
.post {
border-top-width: 0 !important;
}
.loader {
display: block !important;
}
.trigger {
display: inline-block !important;
}
</style></b:if>
<b:if cond='data:blog.pageType == "item"'><style>
.date-outer {
margin-right: 0;
}
.post {
padding: 20px 50px;
background-color: #FFF;
border: 1px solid #eee;
}
/* POST PAGER
----------------------------------------------- */
.post-pager {
background-color: #FFF;
border: 1px solid #EEE;
padding: 20px 50px;
margin-bottom: 30px;
}
.left-older-link {
float: left;
text-align: left;
width: 49%;
}
.right-newer-link {
float: right;
text-align: right;
width: 49%;
}
.post-pager i {
font-size: 35px;
}
.left-older-link i {
float: left;
margin-right: 10px;
}
.right-newer-link i {
float: right;
margin-left: 10px;
}
.post-pager small, .post-pager span {
display: block;
}
</style></b:if>
<b:if cond='data:blog.pageType != "index"'><style>
.date-outer {
float: none;
clear: both;
}
.date-header {
background-color: #fff;
margin: 0;
padding: 10px 15px;
border: 1px solid #eee;
border-bottom-width: 0px;
}
.post {
margin-bottom: 30px;
}
h3.post-title {
margin: 0px 0px 30px;
padding-bottom: 20px;
border-bottom: 1px solid #E1E1E1;
}
h3.post-title span {
padding-bottom: 19px;
}
.post-body {
border-bottom: 3px solid #EEE;
margin-bottom: 30px;
padding-bottom: 20px;
}
.post-footer i {
margin-right: 6px;
}
.post-footer .timestamp-link, .post-footer .fn, .post-labels a:last-child {
margin-right: 10px;
}
.post-share-buttons i {
float: left;
margin: 4px 8px 0px 0px;
}
</style></b:if>
<b:if cond='data:blog.pageType == "index"'><style>
.post {
border-top-width: 0 !important;
}
</style></b:if>
<b:if cond='data:blog.pageType == "archive"'><style>
.post {
border-top-width: 0 !important;
}
.loader {
display: block !important;
}
.trigger {
display: inline-block !important;
}
.date-outer {
float: left;
clear: right;
}
.post {
margin-bottom: 0;
}
.post-body {
border-bottom-width: 0;
margin-bottom: 0;
padding-bottom: 0;
}
</style></b:if>
<b:if cond='data:blog.pageType == "static_page"'><style>
.date-outer {
margin-right: 0px;
}
.post.hentry {
margin-bottom: 30px;
}
.post.hentry {
padding: 20px 50px;
background-color: #FFF;
border: 1px solid #eee;
}
.post-title {
margin-bottom: 20px;
border-bottom: 3px solid #EEE;
padding-bottom: 20px;
}
.post-body {
margin-bottom: 20px;
border-bottom: 3px solid #EEE;
padding-bottom: 30px;
}
.post-icons {
display: none;
}
.post-share-buttons i {
float: left;
margin: 4px 8px 0px 0px;
}
</style></b:if>
<b:if cond='data:blog.pageType == "error_page"'><style>
.main-posts {
width: 100%;
float: none;
margin-top: 0;
}
.error-page {
padding: 65px 0;
text-align: center;
}
.error-title {
line-height: 40px;
margin: 0 0 40px;
text-transform: uppercase;
}
.error-description .error-line1 {
margin-bottom: 40px;
}
.error-description .error-line2 {
line-height: 45px;
}
.error-description .error-line2 a {
padding: 5px 15px;
border: 2px solid;
border-radius: 3px;
margin: 0 10px;
-webkit-transition: all 0.4s ease 0s;
-moz-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
}
.error-description .error-line2 a:hover {
color: #fff;
}
.error-description .error-line2 .search_icon {
float: none;
clear: both;
display: inline-block;
margin: 0 10px;
padding: 0;
width: 38px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
</style></b:if>
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js' type='text/javascript'/>

<script class='java' type='text/javascript'>
//<![CDATA[
// Infinite Scroll Modified By Ar-themes
// Copyright 2011/12 Paul Irish & Luke Shumard
// Licensed under the MIT license
(function($){'use strict';Date.now=Date.now||function(){return+new Date()};$.ias=function(g){var h=$.extend({},$.ias.defaults,g);var i=new $.ias.util();var j=new $.ias.paging(h.scrollContainer);var k=(h.history?new $.ias.history():false);var l=this;function init(){var d;j.onChangePage(function(a,b,c){if(k){k.setPage(a,c)}h.onPageChange.call(this,a,c,b)});reset();if(k&&k.havePage()){stop_scroll();d=k.getPage();i.forceScrollTop(function(){var a;if(d>1){paginateToPage(d);a=get_scroll_threshold(true);$('html, body').scrollTop(a)}else{reset()}})}return l}init();function reset(){hide_pagination();h.scrollContainer.scroll(scroll_handler)}function scroll_handler(){var a,scrThreshold;a=i.getCurrentScrollOffset(h.scrollContainer);scrThreshold=get_scroll_threshold();if(a>=scrThreshold){if(get_current_page()>=h.triggerPageThreshold){stop_scroll();show_trigger(function(){paginate(a)})}else{paginate(a)}}}function stop_scroll(){h.scrollContainer.unbind('scroll',scroll_handler)}function hide_pagination(){$(h.pagination).hide()}function get_scroll_threshold(a){var b,threshold;b=$(h.container).find(h.item).last();if(b.size()===0){return 0}threshold=b.offset().top+b.height();if(!a){threshold+=h.thresholdMargin}return threshold}function paginate(d,e){var f;f=$(h.next).attr('href');if(!f){if(h.noneleft){$(h.container).find(h.item).last().after(h.noneleft)}return stop_scroll()}if(h.beforePageChange&&$.isFunction(h.beforePageChange)){if(h.beforePageChange(d,f)===false){return}}j.pushPages(d,f);stop_scroll();show_loader();loadItems(f,function(a,b){var c=h.onLoadItems.call(this,b),curLastItem;if(c!==false){$(b).hide();curLastItem=$(h.container).find(h.item).last();curLastItem.after(b);$(b).fadeIn()}f=$(h.next,a).attr('href');$(h.pagination).replaceWith($(h.pagination,a));remove_loader();hide_pagination();if(f){reset()}else{stop_scroll()}h.onRenderComplete.call(this,b);if(e){e.call(this)}})}function loadItems(b,c,d){var e=[],container,startTime=Date.now(),diffTime,self;d=d||h.loaderDelay;$.get(b,null,function(a){container=$(h.container,a).eq(0);if(0===container.length){container=$(a).filter(h.container).eq(0)}if(container){container.find(h.item).each(function(){e.push(this)})}if(c){self=this;diffTime=Date.now()-startTime;if(diffTime<d){setTimeout(function(){c.call(self,a,e)},d-diffTime)}else{c.call(self,a,e)}}},'html')}function paginateToPage(a){var b=get_scroll_threshold(true);if(b>0){paginate(b,function(){stop_scroll();if((j.getCurPageNum(b)+1)<a){paginateToPage(a);$('html,body').animate({'scrollTop':b},400,'swing')}else{$('html,body').animate({'scrollTop':b},1000,'swing');reset()}})}}function get_current_page(){var a=i.getCurrentScrollOffset(h.scrollContainer);return j.getCurPageNum(a)}function get_loader(){var a=$('.loader');if(a.size()===0){a=$('<div class="loader">'+h.loader+'</div>');a.hide()}return a}function show_loader(){var a=get_loader(),el;if(h.customLoaderProc!==false){h.customLoaderProc(a)}else{el=$(h.container).find(h.item).last();el.after(a);a.fadeIn()}}function remove_loader(){var a=get_loader();a.remove()}function get_trigger(a){var b=$('.trigger');if(b.size()===0){b=$('<div class="trigger"><a href="">'+h.trigger+'</a></div>');b.hide()}$('a',b).off('click').on('click',function(){remove_trigger();a.call();return false});return b}function show_trigger(a){var b=get_trigger(a),el;el=$(h.container).find(h.item).last();el.after(b);b.fadeIn()}function remove_trigger(){var a=get_trigger();a.remove()}};$.ias.defaults={container:'.blog-posts',scrollContainer:$(window),item:'.date-outer',pagination:'#blog-pager',next:'#blog-pager-older-link a',loader:'<i class="fa fa-cog fa-4x fa-spin"></i>',loaderDelay:1000,triggerPageThreshold:2,trigger:'<i class="fa fa-chevron-down"></i>',thresholdMargin:-500,history:true,onPageChange:function(){},beforePageChange:function(){},onLoadItems:function(){},onRenderComplete:function(){ FB.XFBML.parse(); gapi.plusone.go(); twttr.widgets.load(); _gaq.push(['_trackPageview']); },customLoaderProc:false};$.ias.util=function(){var c=false;var d=false;var e=this;function init(){$(window).load(function(){c=true})}init();this.forceScrollTop=function(a){$('html,body').scrollTop(0);if(!d){if(!c){setTimeout(function(){e.forceScrollTop(a)},1)}else{a.call();d=true}}};this.getCurrentScrollOffset=function(a){var b,wndHeight;if(a.get(0)===window){b=a.scrollTop()}else{b=a.offset().top}wndHeight=a.height();return b+wndHeight}};$.ias.paging=function(){var c=[[0,document.location.toString()]];var d=function(){};var e=1;var f=new $.ias.util();function init(){$(window).scroll(scroll_handler)}init();function scroll_handler(){var a,curPageNum,curPagebreak,scrOffset,urlPage;a=f.getCurrentScrollOffset($(window));curPageNum=getCurPageNum(a);curPagebreak=getCurPagebreak(a);if(e!==curPageNum){scrOffset=curPagebreak[0];urlPage=curPagebreak[1];d.call({},curPageNum,scrOffset,urlPage)}e=curPageNum}function getCurPageNum(a){for(var i=(c.length-1);i>0;i--){if(a>c[i][0]){return i+1}}return 1}this.getCurPageNum=function(a){a=a||f.getCurrentScrollOffset($(window));return getCurPageNum(a)};function getCurPagebreak(a){for(var i=(c.length-1);i>=0;i--){if(a>c[i][0]){return c[i]}}return null}this.onChangePage=function(a){d=a};this.pushPages=function(a,b){c.push([a,b])}};$.ias.history=function(){var e=false;var f=false;function init(){f=!!(window.history&&history.pushState&&history.replaceState);f=false}init();this.setPage=function(a,b){this.updateState({page:a},'',b)};this.havePage=function(){return(this.getState()!==false)};this.getPage=function(){var a;if(this.havePage()){a=this.getState();return a.page}return 1};this.getState=function(){var a,stateObj,pageNum;if(f){stateObj=history.state;if(stateObj&&stateObj.ias){return stateObj.ias}}else{a=(window.location.hash.substring(0,7)==='/');if(a){pageNum=parseInt(window.location.hash.replace('/',''),10);return{page:pageNum}}}return false};this.updateState=function(a,b,c){if(e){this.replaceState(a,b,c)}else{this.pushState(a,b,c)}};this.pushState=function(a,b,c){var d;if(f){history.pushState({ias:a},b,c)}else{d=(a.page>0?'/'+a.page:'');}e=true};this.replaceState=function(a,b,c){if(f){history.replaceState({ias:a},b,c)}else{this.pushState(a,b,c)}}}})(jQuery);
// Posts and Thumb for Blogger version 1.3 By Ar-themes
// http://ar-themes.blogspot.com/
function removeHtmlTag(e,t){if(e.indexOf("<")!=-1){var n=e.split("<");for(var r=0;r<n.length;r++){if(n[r].indexOf(">")!=-1){n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length)}}e=n.join("")}t=t<e.length-1?t:e.length-2;while(e.charAt(t-1)!=" "&&e.indexOf(" ",t)!=-1)t++;e=e.substring(0,t-1);return e+""}function createSummaryAndThumb(e,t,n){var r=document.getElementById(e);var i=document.getElementById(n);var s=/\/s([01]?[0-5]?[0-9]?[0-9]|1600)[^0-9]/;var o='<a href="'+t+'" title=""><img alt="" src="#" width="'+iwh+'px" height="'+iwh+'px"/></a>';var u=r.getElementsByTagName("img");if(u.length>=1){o='<a class="toptip" href="'+t+'" data-title="'+n+'"><img alt="'+n+'" src="'+u[0].src.replace(s,"/s"+iwh+"-c/")+'" width="'+iwh+'px" height="'+iwh+'px"/><div class="overlay"><i class="fa fa-plus-circle fa-3x"></i></div></a>'}var a=o;r.innerHTML=a}var iwh=245
//]]>
</script>
</head>
<body>
<b:if cond='data:blog.pageType == "index"'>
<div itemscope='itemscope' itemtype='http://schema.org/Blog' style='display: none;'>
<meta expr:content='data:blog.title' itemprop='name'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' itemprop='description'/>
</b:if>
</div>
</b:if>

<div class='container'>

<header class='clearfix'>
<div id='logo'>
<b:section class='header' id='header' maxwidgets='1' showaddelements='no'>
<b:widget id='Header1' locked='true' title='PICTURE (Tiêu đề)' type='Header'>
<b:includable id='main'>
<b:if cond='data:useImage'>
<b:if cond='data:imagePlacement == "BEHIND"'>

<b:if cond='data:mobile'>
<div id='header-inner'>
<div class='titlewrapper' style='background: transparent'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
</div>
<b:include name='description'/>
</div>
<b:else/>
<div expr:style='"background-image: url(\"" + data:sourceUrl + "\"); " + "background-position: " + data:backgroundPositionStyleStr + "; " + data:widthStyleStr + "min-height: " + data:height + "_height: " + data:height + "background-repeat: no-repeat; "' id='header-inner'>
<div class='titlewrapper' style='background: transparent'>
<h1 class='title' style='background: transparent; border-width: 0px'>
<b:include name='title'/>
</h1>
</div>
<b:include name='description'/>
</div>
</b:if>
<b:else/>

<div id='header-inner'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
</a>

<b:if cond='data:imagePlacement == "BEFORE_DESCRIPTION"'>
<b:include name='description'/>
</b:if>
</div>
</b:if>
<b:else/>

<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>
<b:include name='title'/>
</h1>
</div>
<b:include name='description'/>
</div>
</b:if>
</b:includable>
<b:includable id='description'>
<div class='descriptionwrapper'>
<p class='description'><span><data:description/></span></p>
</div>
</b:includable>
<b:includable id='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
</b:widget>
</b:section>
</div>
<nav id='navigation'>
<ul>
<li class='active'><a href='/'>Home</a></li>
<li><a href='#'>Error 404</a></li>
<li><a href='#'>Archive</a>
<ul>
<li><a href='#'>Online Movies</a></li>
<li><a href='#'>Free Games</a></li>
<li><a href='#'>Live Car Races</a></li>
</ul>
</li>
<li><a href='#'>Labels</a></li>
<li><a href='#'>Post Sample</a></li>
<li><a href='#'>Page</a></li>
</ul>
</nav>
<div id='search'>
<form action='/search' method='get' role='search'>
<input class='s-input' name='q' placeholder='Enter Your Keyword' type='text' value=''/>
<button class='s-submit' type='submit'>
<i class='fa fa-search'/>
</button>
</form>
</div>
<div id='social'>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-youtube'/></a>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-google'/></a>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-dribbble'/></a>
</div>
<div class='m-button'>
<i class='fa fa-bars'/>
</div>
</header>


<div class='clearfix'>
<b:if cond='data:blog.pageType != "error_page"'>
<div class='ads'>
<b:section class='ads-section' id='section-0'>
<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
</div>
</b:if>
<div class='main-posts'>
<b:section class='main' id='main'>
<b:widget id='Blog1' locked='true' title='Bài đăng trên Blog' type='Blog'>
<b:includable id='main' var='top'>
<b:if cond='data:mobile == "false"'>

<b:if cond='data:blog.pageType == "error_page"'>
<b:include name='error-page'/>
</b:if>

<b:if cond='data:blog.pageType != "error_page"'>
<b:include data='top' name='status-message'/>
</b:if>

<div class='blog-posts hfeed'>
<data:defaultAdStart/>
<b:loop values='data:posts' var='post'>

<b:if cond='data:post.isFirstPost == "false"'>
</div></div>
</b:if>
<div class="date-outer">
<b:if cond='data:blog.pageType != "index"'>
<b:if cond='data:blog.pageType != "archive"'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>
</b:if>
</b:if>
<div class="date-posts">
<div class='post-outer'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "static_page"'>
<b:include data='post' name='comment_picker'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comment_picker'/>
</b:if>
</div>
<b:if cond='data:post.includeAd'>
<b:if cond='data:post.isFirstPost'>
<data:defaultAdEnd/>
<b:else/>
<data:adEnd/>
</b:if>
<div class='inline-ad'>
<data:adCode/>
</div>
<data:adStart/>
</b:if>
</b:loop>
<b:if cond='data:numPosts != 0'>
</div></div>
</b:if>
<data:adEnd/>
</div>

<b:if cond='data:blog.pageType != "item"'>
<b:include name='nextprev'/>
</b:if>
<b:if cond='data:top.showStars'>
<script src='//www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
google.load("annotations", "1", {"locale": "<data:top.languageCode/>"});
function initialize() {
google.annotations.setApplicationId(<data:top.blogspotReviews/>);
google.annotations.createAll();
google.annotations.fetch();
}
google.setOnLoadCallback(initialize);
</script>
</b:if>
<b:else/>
<b:include name='mobile-main'/>
</b:if>
<b:if cond='data:top.showDummy'>
<data:top.dummyBootstrap/>
</b:if>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'>
<span expr:class='"item-control " + data:backlink.adminClass'>
<a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
<img src='//www.blogger.com/img/icon_delete13.gif'/>
</a>
</span>
</b:includable>
<b:includable id='backlinks' var='post'>
<a name='links'/><h4><data:post.backlinksLabel/></h4>
<b:if cond='data:post.numBacklinks != 0'>
<dl class='comments-block' id='comments-block'>
<b:loop values='data:post.backlinks' var='backlink'>
<div class='collapsed-backlink backlink-control'>
<dt class='comment-title'>
<span class='backlink-toggle-zippy'> </span>
<a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
<b:include data='backlink' name='backlinkDeleteIcon'/>
</dt>
<dd class='comment-body collapseable'>
<data:backlink.snippet/>
</dd>
<dd class='comment-footer collapseable'>
<span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span>
<span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span>
</dd>
</div>
</b:loop>
</dl>
</b:if>
<p class='comment-footer'>
<a class='comment-link' expr:href='data:post.createLinkUrl' expr:id='data:widget.instanceId + "_backlinks-create-link"' target='_blank'><data:post.createLinkLabel/></a>
</p>
</b:includable>
<b:includable id='comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<h4 id='comment-post-message'>
<a expr:id='data:widget.instanceId + "_comment-editor-toggle-link"' href='javascript:void(0)'><data:postCommentMsg/></a></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>');
</script>
</div>
</b:includable>
<b:includable id='commentDeleteIcon' var='comment'>
<span expr:class='"item-control " + data:comment.adminClass'>
<b:if cond='data:showCmtPopup'>
<div class='goog-toggle-button'>
<div class='goog-inline-block comment-action-icon'/>
</div>
<b:else/>
<a class='comment-delete' expr:href='data:comment.deleteUrl' expr:title='data:top.deleteCommentMsg'>
<img src='//www.blogger.com/img/icon_delete13.gif'/>
</a>
</b:if>
</span>
</b:includable>
<b:includable id='comment_count_picker' var='post'>
<b:if cond='data:post.commentSource == 1'>
<span class='cmt_count_iframe_holder' expr:data-count='data:post.numComments' expr:data-onclick='data:post.addCommentOnclick' expr:data-post-url='data:post.url' expr:data-url='data:post.canonicalUrl'>
</span>
<b:else/>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:post.commentLabelFull/>:
</a>
</b:if>
</b:includable>
<b:includable id='comment_picker' var='post'>
<b:if cond='data:post.commentSource == 1'>
<b:include data='post' name='iframe_comments'/>
<b:else/>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:includable>
<b:includable id='comments' var='post'>
<div class='comments comst' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4><data:post.commentLabelFull/>:</h4>
<b:if cond='data:post.commentPagingRequired'>
<span class='paging-control-container'>
<b:if cond='data:post.hasOlderLinks'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
 
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
 
</b:if>
<data:post.commentRangeText/>
<b:if cond='data:post.hasNewerLinks'>
 
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
 
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
</b:if>
</span>
</b:if>
<div expr:id='data:widget.instanceId + "_comments-block-wrapper"'>
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p>
<data:comment.body/>
</p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
</div>
<b:if cond='data:post.commentPagingRequired'>
<span class='paging-control-container'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
<data:post.oldestLinkText/>
</a>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
<data:post.olderLinkText/>
</a>
 
<data:post.commentRangeText/>
 
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
<data:post.newerLinkText/>
</a>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
<data:post.newestLinkText/>
</a>
</span>
</b:if>
<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>
</b:if>
<b:if cond='data:showCmtPopup'>
<div id='comment-popup'>
<iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
</iframe>
</div>
</b:if>
<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>
<b:includable id='error-page'>
<div class='error-page'>
<div class='error-title'>
<i class='fa fa-trash-o'/> 404 - Page not found
</div>
<div class='error-description'>
<div class='error-line1'>The page you are looking for might have been removed,<br/>had its name changed, or is temporarily unavailable</div>
<div class='error-line2'>Go to <a expr:href='data:blog.homepageUrl'>Home</a> to check it again, Search For It or Just Contact Us</div>
</div>
</div>
</b:includable>
<b:includable id='feedLinks'>
<b:if cond='data:blog.pageType != "item"'> 
<b:if cond='data:feedLinks'>
<div class='blog-feeds'>
<b:include data='feedLinks' name='feedLinksBody'/>
</div>
</b:if>
<b:else/> 
<div class='post-feeds'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.allowComments'>
<b:if cond='data:post.feedLinks'>
<b:include data='post.feedLinks' name='feedLinksBody'/>
</b:if>
</b:if>
</b:loop>
</div>
</b:if>
</b:includable>
<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>
</b:includable>
<b:includable id='iframe_comments' var='post'>
<b:if cond='data:post.allowIframeComments'>
<script expr:src='data:post.iframeCommentSrc' type='text/javascript'/>
<div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/>
<b:if cond='data:post.embedCommentForm == "false"'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</b:includable>
<b:includable id='mobile-index-post' var='post'>
<div class='mobile-date-outer date-outer'>
<b:if cond='data:post.dateHeader'>
<div class='date-header'>
<span><data:post.dateHeader/></span>
</div>
</b:if>
<div class='mobile-post-outer'>
<a expr:href='data:post.url'>
<h3 class='mobile-index-title entry-title' itemprop='name'>
<data:post.title/>
</h3>
<div class='mobile-index-arrow'>&rsaquo;</div>
<div class='mobile-index-contents'>
<b:if cond='data:post.thumbnailUrl'>
<div class='mobile-index-thumbnail'>
<div class='Image'>
<img expr:src='data:post.thumbnailUrl'/>
</div>
</div>
</b:if>
<div class='post-body'>
<b:if cond='data:post.snippet'><data:post.snippet/></b:if>
</div>
</div>
<div style='clear: both;'/>
</a>
<div class='mobile-index-comment'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.allowComments'>
<b:if cond='data:post.numComments != 0'>
<b:include data='post' name='comment_count_picker'/>
</b:if>
</b:if>
</b:if>
</div>
</div>
</div>
</b:includable>
<b:includable id='mobile-main' var='top'>

<div class='blog-posts hfeed'>
<b:include data='top' name='status-message'/>
<b:if cond='data:blog.pageType == "index"'>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='mobile-index-post'/>
</b:loop>
<b:else/>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='mobile-post'/>
</b:loop>
</b:if>
</div>
<b:include name='mobile-nextprev'/>
</b:includable>
<b:includable id='mobile-nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<div class='mobile-link-button' id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'>&lsaquo;</a>
</div>
</b:if>
<b:if cond='data:olderPageUrl'>
<div class='mobile-link-button' id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'>&rsaquo;</a>
</div>
</b:if>
<div class='mobile-link-button' id='blog-pager-home-link'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</div>
<div class='mobile-desktop-link'>
<a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a>
</div>
</div>
<div class='clear'/>
</b:includable>
<b:includable id='mobile-post' var='post'>
<div class='date-outer'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>
<div class='date-posts'>
<div class='post-outer'>
<div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:post.thumbnailUrl'>
<meta expr:content='data:post.thumbnailUrl' itemprop='image_url'/>
</b:if>
<meta expr:content='data:blog.blogId' itemprop='blogId'/>
<meta expr:content='data:post.id' itemprop='postId'/>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title' itemprop='name'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<div class='post-header'>
<div class='post-header-line-1'/>
</div>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='articleBody'>
<data:post.body/>
<div style='clear: both;'/> 
</div>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</span>
<b:else/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<span itemprop='name'><data:post.author/></span>
</span>
</b:if>
</b:if>
</span>
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<meta expr:content='data:post.canonicalUrl' itemprop='url'/>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</span>
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comment_count_picker'/>
</b:if>
</b:if>
</b:if>
</span>
</div>
<div class='post-footer-line post-footer-line-2'>
<b:if cond='data:top.showMobileShare'>
<div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
<a href='javascript:void(0);'><data:shareMsg/></a>
</div>
</b:if>
<b:if cond='data:top.showDummy'>
<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>
</div>
</div>
</div>
<b:if cond='data:blog.pageType == "static_page"'>
<b:include data='post' name='comment_picker'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comment_picker'/>
</b:if>
</div>
</div>
</div>
</b:includable>
<b:includable id='nextprev'>
<div class='clear'/>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
<div class='clear'/>
</b:includable>
<b:includable id='nextprev-post'>
<div class='post-pager clearfix'>
<b:if cond='data:olderPageUrl'>
<a class='left-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'/>
<b:else/>
<div class='left-older-link'><small>Previous</small><span>This is the last post</span></div>
</b:if>
<b:if cond='data:newerPageUrl'>
<a class='right-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'/>
<b:else/>
<div class='right-newer-link'><small>Next</small><span>This is the most recent post</span></div>
</b:if>
<script class='java' type='text/javascript'>
//<![CDATA[
(function($){
var newerLink = $('a.right-newer-link');
var olderLink = $('a.left-older-link');
$.get(newerLink.attr('href'), function (data) {
newerLink.html('<i class="fa fa-angle-right"></i><small>Next</small><span>'+$(data).find('.post h3.post-title').text()+'</span>');
},"html");
$.get(olderLink.attr('href'), function (data2) {
olderLink.html('<i class="fa fa-angle-left"></i><small>Previous</small><span>'+$(data2).find('.post h3.post-title').text()+'</span>');
},"html");
})(jQuery);
//]]>
</script>
</div>
</b:includable>
<b:includable id='post' var='post'>
<div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
<b:if cond='data:post.firstImageUrl'>
<meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
</b:if>
<meta expr:content='data:blog.blogId' itemprop='blogId'/>
<meta expr:content='data:post.id' itemprop='postId'/>
<a expr:name='data:post.id'/>
<b:if cond='data:blog.pageType != "index"'>
<b:if cond='data:blog.pageType != "archive"'>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title' itemprop='name'>
<span>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<b:if cond='data:blog.url != data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</span>
</h3>
</b:if>
<div class='post-header'>
<div class='post-header-line-1'/>
</div>
</b:if>
</b:if>
<b:if cond='data:blog.metaDescription == ""'>

<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='description articleBody'>
<b:if cond='data:blog.pageType == "item"'>
<div class='image-layout'/>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div class='summary-outer' expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>

<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>","<data:post.url/>","<data:post.title/>");</script>
<div style='clear: both;'/>
</b:if>
</b:if>
<div style='clear: both;'/> 
</div>
<b:else/>
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id' itemprop='articleBody'>
<b:if cond='data:blog.pageType == "item"'>
<div class='image-layout'/>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div class='summary-outer' expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>","<data:post.url/>","<data:post.title/>");</script>
<div style='clear: both;'/>
</b:if>
</b:if>
<div style='clear: both;'/> 
</div>
</b:if>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
<b:if cond='data:blog.pageType != "index"'>
<b:if cond='data:blog.pageType != "archive"'>
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<i class='fa fa-user'/><data:top.authorLabel/>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</span>
<b:else/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<span itemprop='name'><data:post.author/></span>
</span>
</b:if>
</b:if>
</span>
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<i class='fa fa-clock-o'/><data:top.timestampLabel/>
<b:if cond='data:post.url'>
<meta expr:content='data:post.canonicalUrl' itemprop='url'/>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a>
</b:if>
</b:if>
</span>
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comment_count_picker'/>
</b:if>
</b:if>
</b:if>
</span>
<span class='post-icons'>

<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>

<b:include data='post' name='postQuickEdit'/>
</span>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<i class='fa fa-ticket'/><data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
</div>
<div class='post-footer-line post-footer-line-2'>
</div>
<div class='post-footer-line post-footer-line-3'>
<div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<i class='fa fa-share-alt'/><b:include data='post' name='shareButtons'/>
</b:if>
</div>
<span class='post-location'>
<b:if cond='data:top.showLocation'>
<b:if cond='data:post.location'>
<data:postLocationLabel/>
<a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
</b:if>
</b:if>
</span>
</div>
<b:if cond='data:post.authorAboutMe'>
<div class='author-profile' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<b:if cond='data:post.authorPhoto.url'>
<img expr:src='data:post.authorPhoto.url' itemprop='image' width='50px'/>
</b:if>
<div>
<a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</div>
<span itemprop='description'><data:post.authorAboutMe/></span>
</div>
</b:if>
</div>
</b:if>
</b:if>
</div>
<b:if cond='data:blog.pageType == "item"'>
<b:include name='nextprev-post'/>
</b:if>
</b:includable>
<b:includable id='postQuickEdit' var='post'>
<b:if cond='data:post.editUrl'>
<span expr:class='"item-control " + data:post.adminClass'>
<a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
<img alt='' class='icon-action' height='18' src='http://img2.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</b:if>
</b:includable>
<b:includable id='shareButtons' var='post'>
<b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' expr:title='data:top.emailThisMsg' target='_blank'><span class='share-button-link-text'><data:top.emailThisMsg/></span></a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, \"_blank\", \"height=270,width=475\"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'><span class='share-button-link-text'><data:top.blogThisMsg/></span></a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, \"_blank\", \"height=430,width=640\"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a></b:if><b:if cond='data:top.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + "&target=orkut"' expr:title='data:top.shareToOrkutMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToOrkutMsg/></span></a></b:if><b:if cond='data:top.showPinterestButton'><a class='goog-inline-block share-button sb-pinterest' expr:href='data:post.sharePostUrl + "&target=pinterest"' expr:title='data:top.shareToPinterestMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToPinterestMsg/></span></a></b:if><b:if cond='data:top.showDummy'><div class='goog-inline-block dummy-container'><data:post.dummyTag/></div></b:if>
</b:includable>
<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>
<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>');
</script>
</div>
</b:includable>
<b:includable id='threaded_comment_js' var='post'>
<script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
<script type='text/javascript'>
(function() {
var items = <data:post.commentJso/>;
var msgs = <data:post.commentMsgs/>;
var config = <data:post.commentConfig/>;
// <![CDATA[
var cursor = null;
if (items && items.length > 0) {
cursor = parseInt(items[items.length - 1].timestamp) + 1;
}
var bodyFromEntry = function(entry) {
if (entry.gd$extendedProperty) {
for (var k in entry.gd$extendedProperty) {
if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
return '<span class="deleted-comment">' + entry.content.$t + '</span>';
}
}
}
return entry.content.$t;
}
var parse = function(data) {
cursor = null;
var comments = [];
if (data && data.feed && data.feed.entry) {
for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
var comment = {};
// comment ID, parsed out of the original id format
var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
comment.id = id ? id[2] : null;
comment.body = bodyFromEntry(entry);
comment.timestamp = Date.parse(entry.published.$t) + '';
if (entry.author && entry.author.constructor === Array) {
var auth = entry.author[0];
if (auth) {
comment.author = {
name: (auth.name ? auth.name.$t : undefined),
profileUrl: (auth.uri ? auth.uri.$t : undefined),
avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
};
}
}
if (entry.link) {
if (entry.link[2]) {
comment.link = comment.permalink = entry.link[2].href;
}
if (entry.link[3]) {
var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
if (pid && pid[1]) {
comment.parentId = pid[1];
}
}
}
comment.deleteclass = 'item-control blog-admin';
if (entry.gd$extendedProperty) {
for (var k in entry.gd$extendedProperty) {
if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
} else if (entry.gd$extendedProperty[k].name == 'blogger.displayTime') {
comment.displayTime = entry.gd$extendedProperty[k].value;
}
}
}
comments.push(comment);
}
}
return comments;
};
var paginator = function(callback) {
if (hasMore()) {
var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
if (cursor) {
url += '&published-min=' + new Date(cursor).toISOString();
}
window.bloggercomments = function(data) {
var parsed = parse(data);
cursor = parsed.length < 50 ? null
: parseInt(parsed[parsed.length - 1].timestamp) + 1
callback(parsed);
window.bloggercomments = null;
}
url += '&callback=bloggercomments';
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
document.getElementsByTagName('head')[0].appendChild(script);
}
};
var hasMore = function() {
return !!cursor;
};
var getMeta = function(key, comment) {
if ('iswriter' == key) {
var matches = !!comment.author
&& comment.author.name == config.authorName
&& comment.author.profileUrl == config.authorUrl;
return matches ? 'true' : '';
} else if ('deletelink' == key) {
return config.baseUri + '/delete-comment.g?blogID='
+ config.blogId + '&postID=' + comment.id;
} else if ('deleteclass' == key) {
return comment.deleteclass;
}
return '';
};
var replybox = null;
var replyUrlParts = null;
var replyParent = undefined;
var onReply = function(commentId, domId) {
if (replybox == null) {
// lazily cache replybox, and adjust to suit this style:
replybox = document.getElementById('comment-editor');
if (replybox != null) {
replybox.height = '250px';
replybox.style.display = 'block';
replyUrlParts = replybox.src.split('#');
}
}
if (replybox && (commentId !== replyParent)) {
document.getElementById(domId).insertBefore(replybox, null);
replybox.src = replyUrlParts[0]
+ (commentId ? '&parentID=' + commentId : '')
+ '#' + replyUrlParts[1];
replyParent = commentId;
}
};
var hash = (window.location.hash || '#').substring(1);
var startThread, targetComment;
if (/^comment-form_/.test(hash)) {
startThread = hash.substring('comment-form_'.length);
} else if (/^c[0-9]+$/.test(hash)) {
targetComment = hash.substring(1);
}
// Configure commenting API:
var configJso = {
'maxDepth': config.maxThreadDepth
};
var provider = {
'id': config.postId,
'data': items,
'loadNext': paginator,
'hasMore': hasMore,
'getMeta': getMeta,
'onReply': onReply,
'rendered': true,
'initComment': targetComment,
'initReplyThread': startThread,
'config': configJso,
'messages': msgs
};
var render = function() {
if (window.goog && window.goog.comments) {
var holder = document.getElementById('comment-holder');
window.goog.comments.render(holder, provider);
}
};
// render now, or queue to render when library loads:
if (window.goog && window.goog.comments) {
render();
} else {
window.goog = window.goog || {};
window.goog.comments = window.goog.comments || {};
window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
window.goog.comments.loadQueue.push(render);
}
})();
// ]]>
</script>
</b:includable>
<b:includable id='threaded_comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<h4><data:post.commentLabelFull/>:</h4>
<div class='comments-content'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='threaded_comment_js'/>
</b:if>
<div id='comment-holder'>
<data:post.commentHtml/>
</div>
</div>
<p class='comment-footer'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='threaded-comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
</p>
<b:if cond='data:showCmtPopup'>
<div id='comment-popup'>
<iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
</iframe>
</div>
</b:if>
<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
<b:if cond='data:blog.pageType != "error_page"'>
<aside class='sidebar'>
<b:section class='sidebar-section' id='section-1'>
<b:widget id='Label3' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
<b:if cond='data:display == "list"'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='"label-size label-size-" + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == "false"'>
<b:if cond='data:showSnippets == "false"'>

<a expr:href='data:post.href'><data:post.title/></a>
<b:else/>

<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == "false"'>

<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
</div>
<div style='clear: both;'/>
<b:else/>

<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</div>
<div style='clear: both;'/>
</b:if>
</b:if>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
<b:widget id='HTML4' locked='false' title='Ads 300 x 250' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<b:if cond='data:team == "true"'> 
<ul>
<b:loop values='data:authors' var='i'>
<li><a class='profile-name-link g-profile' expr:href='data:i.userUrl' expr:style='"background-image: url(" + data:i.profileLogo + ");"'><data:i.display-name/></a></li>
</b:loop>
</ul>
<b:else/> 
<b:if cond='data:photo.url != ""'>
<a expr:href='data:userUrl'><img class='profile-img' expr:alt='data:photo.alt' expr:height='data:photo.height' expr:src='data:photo.url' expr:width='data:photo.width'/></a>
</b:if>
<dl class='profile-datablock'>
<dt class='profile-data'>
<a class='profile-name-link g-profile' expr:href='data:userUrl' expr:style='"background-image: url(" + data:profileLogo + ");"' rel='author'>
<data:displayname/>
</a>
<b:if cond='data:hasgoogleprofile'>
<br/>
<div class='g-follow' data-annotation='bubble' data-height='20' expr:data-href='data:userUrl'/>
</b:if>
</dt>
<b:if cond='data:showlocation == "true"'>
<dd class='profile-data'><data:location/></dd>
</b:if>
<b:if cond='data:aboutme != ""'><dd class='profile-textblock'><data:aboutme/></dd></b:if>
</dl>
<a class='profile-link' expr:href='data:userUrl' rel='author'><data:viewProfileMsg/></a>
</b:if>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
</b:section>
</aside>
</b:if>
</div>


<footer class='clearfix'>
<div class='footer-wdigets clearfix'>
<b:section class='footer-section' id='section-2'>
<b:widget id='HTML2' locked='false' title='About Me' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
<b:widget id='FollowByEmail1' locked='false' title='Follow by Email' type='FollowByEmail'>
<b:includable id='main'>
<b:if cond='data:title != ""'><h2 class='title'><data:title/></h2></b:if>
<div class='widget-content'>
<div class='follow-by-email-inner'>
<form action='http://feedburner.google.com/fb/a/mailverify' expr:onsubmit='"window.open(\"http://feedburner.google.com/fb/a/mailverify?uri=" + data:feedPath + "\", \"popupwindow\", \"scrollbars=yes,width=550,height=520\"); return true"' method='post' target='popupwindow'>
<table width='100%'>
<tr>
<td>
<input class='follow-by-email-address' name='email' placeholder='Email address...' type='text'/>
</td>
<td width='64px'>
<input class='follow-by-email-submit' type='submit' value='Submit'/>
</td>
</tr>
</table>
<input expr:value='data:feedPath' name='uri' type='hidden'/>
<input name='loc' type='hidden' value='en_US'/>
</form>
</div>
</div>
<span class='item-control blog-admin'>
<b:include name='quickedit'/>
</span>
</b:includable>
</b:widget>
</b:section>
<b:section class='footer-section' id='section-3'>
<b:widget id='Label2' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
<b:if cond='data:display == "list"'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='"label-size label-size-" + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
<b:if cond='data:display == "list"'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
<b:else/>
<b:loop values='data:labels' var='label'>
<span expr:class='"label-size label-size-" + data:label.cssSize'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span class='label-count' dir='ltr'>(<data:label.count/>)</span>
</b:if>
</span>
</b:loop>
</b:if>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
</b:section>
<b:section class='footer-section' id='section-4'>
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
<div class='clear'/>
</div>
<div class='footer-rights clear'>
2014 All Rights Reserved &copy; <a href='data:blog.homepageUr'><data:blog.title/></a> - Powered By <a href='' rel='nofollow' target='_blank'>Blogger</a> - Created By <a href='http://ar-themes.blogspot.com' rel='nofollow' target='_blank'>Ar-themes</a> Published By <a href='http://www.kaizentemplate.com/' rel='dofollow' target='_blank' title='KaizenTemplate'>Kaizen Template</a>
</div>
</footer>

</div>


<div class='back-to-top' id='toTop'>
<i class='fa fa-chevron-up'/>
</div>

<script class='java' type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
var str=location.href.toLowerCase();
$("nav ul li a").each(function() {
if (str.indexOf(this.href.toLowerCase()) > -1) {
$("nav ul li.active").removeClass("active");
$(this).parent().addClass("active");
}
});
$( ".m-button i" ).click(function() {
$( "#navigation" ).slideToggle( "slow" );
});
$('aside .section .widget h2:first-child, footer .section .widget h2:first-child')
.wrapInner('<span/>');
$('nav li').has('ul').children('a').append('<i class="fa marrow fa-caret-down"></i>');
$('#toTop').click(function () {
$('body,html').animate({
scrollTop: 0
}, 1000);
});
$("#toTop").addClass("hide");
$(window).scroll(function () {
if ($(this).scrollTop() < 50) {
$("#toTop").addClass("hide").removeClass("show");
} else {
$("#toTop").removeClass("hide").addClass("show");
}
});
});
//]]>
</script>
<b:if cond='data:blog.pageType != "item"'>
<script class='java' type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
jQuery.ias();
});
//]]>
</script>
</b:if>
</body>
</html>

Blogger SEo

Porto Responsive Blogger Template - Chia sẻ ảnh

Đăng nhận xét

Top Post Ad

Below Post Ad

Ads Area

Ads Area

Chocolate Cake

Nền tảng viết blog, CMS thiết kế web và mạng xã hội nên dùng

Văn Phòng phẩm - định nghĩa, phân loại , các loại văn phòng phẩm thiết yếu và tiết kiệm chi phí văn phòng !

Rau muống xào tương hột

Facebook tuyệt chiêu

News

Categories

Random Posts

Thủ Thuật Blog

Popular Posts

Nền tảng viết blog, CMS thiết kế web và mạng xã hội nên dùng

Văn Phòng phẩm - định nghĩa, phân loại , các loại văn phòng phẩm thiết yếu và tiết kiệm chi phí văn phòng !

Rau muống xào tương hột

Facebook tuyệt chiêu

About Us

Follow Us

Footer Copyright

Contact form

Xem Giá Bán

Xem Giá Bán