<b:if cond='data:blog.pageType == "index"'>
<data:blog.pageTitle/>
<b:else/>
<b:if cond='data:blog.pageType != "error_page"'>
<data:blog.pageName/> | <data:blog.title/>
<b:else/>
Page Not Found | <data:blog.title/>
</b:if>
</b:if>
/*****************************************
Reset
******************************************/
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}
::selection {}
::-moz-selection {}
textarea:focus, input:focus{outline: none;}
img {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}
input, textarea
{-webkit-appearance: none;-moz-appearance: none;appearance: none;-webkit-border-radius: 0;}
/*****************************************
Disabled elements
******************************************/
#shareButtons {display:none;}
#Attribution1 {height:0px;visibility:hidden;display:none;}
#b-navbar {height:0px;visibility:hidden;display:none;}
/*****************************************
Headings
******************************************/
h1, h2, h3, h4, h5, h6 {font-family: 'Lato', 'Open Sans', sans-serif;}
h1, h2 {line-height: 1.1;}
h3, h4, h5, h6 {line-height: 1.4;}
h1 {font-size: 36px;}
h2 {font-size: 30px;}
h3 {font-size: 24px;}
h4 {font-size: 18px;}
h5 {font-size: 14px;}
h6 {font-size: 12px;}
.post-body h1 {margin: 10px 0;}
.post-body h2 {padding-bottom: 5px; margin: 10px 0;}
.post-body h3 {padding-bottom: 5px; margin: 10px 0;}
.post-body h4 {margin: 10px 0;}
.post-body h5 {margin: 10px 0;}
.post-body h6 {margin: 10px 0;}
/*****************************************
Global Links CSS
******************************************/
a{outline:none; text-decoration: none; transition: all 0.5s ease 0s; color:$(link.color);}
a:hover {color: #000; text-decoration:none;}
body{background:$(body.background); font: $(body.font); color: $(body.text.color); padding: 0; line-height: 1.8; letter-spacing: 0.5; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;}
.clr {clear:both; float:none;}
/*****************************************
Body Styles - lists & Quotes
******************************************/
ul ul {padding-left: 20px;}
ul ul ul {padding-left: 40px;}
ol ol {padding-left: 20px;}
ol ol ol {padding-left: 40px;}
li h1, li h2, li h3, li h4 , li h5, li h6 {display: inline;}
.tr_bq, blockquote {
color: $(body.text.color);
font-family: $(body.font);
border-top: 0px solid #ffffff;
border-bottom: 0px solid #ffffff;
border-left: 2px solid #cccccc;
margin-left: 30px;
padding-left: 30px;
}
.tr_bq:before, blockquote:before {
font-family: 'Fontawesome';
content: "\f10d";
color: #cccccc;
padding-right: 10px;
font-size: 20px;
}
.tr_bq:after, blockquote:after {
font-family: 'Fontawesome';
content: "\f10e";
color: #cccccc;
padding-left: 10px;
font-size: 20px;
}
/*****************************************
Wrappers
******************************************/
.ct-wrapper {width: 1080px; margin: 0 auto;}
.outer-wrapper {margin: 0; position: relative;}
.header-ct-wrapper {width: 1080px; margin: 0 auto;}
.header-wrapper {width: 100%;}
.main-wrapper {width:740px; float:left; padding:0;}
.sidebar-wrapper {width:280px; float: right; padding:0 0 0 0;}
/*****************************************
Header CSS
******************************************/
#header {text-align: center; width: 100%;}
#header-inner {padding: 61px 0 60px 0; background-position:center !important;}
#header h1 {font: $(logo.font); text-align: center; line-height: 1; }
#header h1, #header h1 a {color:$(logo.text.color);}
#header h1 a:hover {color:$(logo.linkhover.color);}
#header p.description {color:$(decription.text.color); margin: 0; padding: 0; letter-spacing: 2px; font-weight: 300;}
#header img {border:0 none; background:none; width:auto; height:auto; margin:0 auto;}
.titlewrapper {text-align: center;}
/*****************************************
Main Menu CSS
******************************************/
.nav-menu {position: fixed; top: 0; left: 0; padding: 0; background-color: #ffffff; opacity:1.0; filter: alpha(opacity=100);z-index: 9999; width: 100%; -webkit-box-shadow: 1px 1px 1px 1px #eeeeee; -moz-box-shadow: 1px 1px 1px 1px #eeeeee; box-shadow: 1px 1px 1px 1px #eeeeee; line-height: 50px; max-height: 50px !important;}
#PageList1 h4{display:none;}
#navigation {margin: 0 auto; width: 100%; }
#PageList1 ul{list-style:none; margin:0 auto; padding: 0;text-align: center; }
#PageList1 ul li {display: inline-block; list-style: none; white-space:nowrap;}
#PageList1 li a {font: $(mainnav.font); display: block; line-height: 50px; text-decoration: none; text-transform: uppercase; padding:0px 15px 0 15px; color:$(mainnav.text.color);}
#PageList1 li a:hover {color:$(link.color);}
#PageList1 ul li.selected a {}
#spacer {height: 50px; width: 100%;}
/*****************************************
Responsive Toggle Menu CSS
******************************************/
/*----- Toggle Button -----*/
.toggle-nav { display:none;}
.menu h3 {display: none;}
#PageList1, .nav-menu, .navigation, .menu { text-align: center;}
.menu ul { margin: 0 auto; text-align: left; }
/*----- Menu -----*/
@media screen and (min-width: 768px) {
.menu {width:100%; margin: 0 auto; padding: 0px; border-radius:0px; background: $(body.background.color); line-height: 50px; z-index: 9999; }
}
.menu ul { display:inline-block;}
.menu li:last-child { margin-right:0px;}
.menu a { color: $(mainnav.text.color); transition:color linear 0.15s;}
.menu a:hover, .menu .current-item a { text-decoration:none; color: $(link.color);}
/*----- Responsive -----*/
@media screen and (max-width: 1150px) {
.wrap {width:90%;}
}
@media screen and (max-width: 767px) {
.menu li {float:left;list-style:none; }
#PageList1 {line-height: 31px;}
#PageList1, .nav-menu, .navigation {box-sizing: border-box; text-align: center;}
.nav-menu, .navigation {line-height: 50px;}
.menu {position:relative; display:inline-block; opacity: 1.0; z-inex: 9999; box-sizing: border-box; text-align: left; line-height: 50px;}
.menu ul.active {display:none;}
#PageList1 .widget-content {width: 100%;}
.mobile-menu {width: 100%;}
.menu ul {min-width: 320px;position:absolute;top:120%;left:0px;padding: 0px;box-shadow:0px 1px 1px rgba(0,0,0,0.15);border-radius:0px;background: $(body.background.color); opacity: 1.0; z-index: 9999;}
.menu ul:after { width:0px;height:0px;position:absolute;top:0%;left:22px; content:'';transform:translate(0%, -100%);border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid transparent;}
.menu li {margin:5px 0px 0px 0px;float:none;display:block; width:100%;border-bottom: 1px solid #dddddd;padding-bottom: 5px; opacity: 1.0; z-index: 9999;}
#PageList1 ul {padding-bottom: 0px;}
.menu a { display:inline-block;}
.toggle-nav {float:left;display:inline-block;border-radius:0px;background: $(body.background.color);text-shadow:0px 1px 0px rgba(0,0,0,0.5);color:$(mainnav.text.color);font-size:30px; transition:color linear 0.15s;line-height: 1;margin: 5px 10px 5px 0px; padding-top: 5px;}
.toggle-nav:hover, .toggle-nav.active {text-decoration:none;color: $(link.color);}
#navigationbar {width: 100%;}
a.toggle-nav:before {content: "\f0c9";font-family: FontAwesome;}
}
/*****************************************
Blog Post CSS
******************************************/
.post-outer {margin: 0 0 50px 0;}
.post-outer:last-child {margin: 0;}
.post{padding-bottom: 10px; border-bottom: 1px solid $(accent.color);}
.post-body .separator a {margin-left:0 !important; margin-right:0 !important; margin-bottom:0 !important;}
.margin-right {margin-right:15px !important;}
.post-title a, .post-title {font: $(post.title.font); color: $(post.title.color); margin: 0 0 4px 0; padding: 0; text-decoration: none; line-height: 1.1;letter-spacing: 2px; text-transform: uppercase; text-align: center;}
.post-title a:hover {color: #999999;}
.post-body {}
.post-header {color: #a9a9a9; margin: 0 0 15px 0; font-size:14px; font-style: italic; text-align: center;}
.post-header a {font-size:14px;}
.post-header a:hover{color: #a9a9a9;}
.post-comment-link {display:block;text-transform: uppercase;font-size:14px;}
.post-comment-link a {color: #a9a9a9;font-size:14px;}
.post-comment-link a:hover {color: $(link.color)}
.post-label {width:65%;text-transform: uppercase;font-size:14px;display: block;}
.post-label a {color: $(accent.color); font-size:14px; font-weight: 600;}
.post-label a:hover {text-decoration:underline;}
.post-label .fa {color: $(accent.color); padding-right: 5px;}
.rmlink {text-align:center;}
.rmlink a {font: $(widget.title.font); display: inline-block; text-transform: uppercase; margin: 30px auto; color:$(post.title.color); padding: 15px 20px; border: 4px double #eeeeee;}
.rmlink a:hover {text-decoration:none; background-color: $(accent.color); color: #ffffff; border: 4px solid $(accent.color);}
.entry-content ul {list-style-type: disc; list-style-position: inside; list-style-image: none;}
.entry-content ol {list-style-type: decimal; list-style-position: inside; list-style-image: none;}
.cls {margin-top:20px; position:relative;}
.cl {}
.pinimg {padding:10px !important;}
/***** Page Nav CSS *****/
#blog-pager {margin:0; margin:40px 0 0 0;}
.showpageOf, .home-link {display:none;}
.pagecurrent {background: #none; color: #1a1a1a; text-decoration: none; padding: 15px; line-height:40px; font-size: 16px;}
#blog-pager a {background: none; padding: 15px; text-decoration: none; font-size: 16px; line-height:40px;}
#blog-pager a:hover {font-weight:bold; color:#1a1a1a;}
#blog-pager a:hover { background: #ffffff; text-decoration: none;}
/*****************************************
Post Highlighter CSS
******************************************/
blockquote {border-color: #F1F4F9; border-style: solid; border-width: 1px 0; color: #888888; font-style: italic; margin: 10px 0 20px; padding: 15px 40px;}
/*****************************************
Sidebar CSS
******************************************/
.sidebar {margin: 0; display: block;}
.sidebar h4 {font: $(widget.title.font); color: $(post.title.color);text-transform:uppercase;position: relative;text-align: center;line-height: 1em;margin-bottom: 30px; letter-spacing:2px; border-bottom: 1px solid $(accent.color); padding-bottom: 8px;}
.sidebar h2 {font: $(widget.title.font); color: $(post.title.color);text-transform:uppercase;position: relative;text-align: center;line-height: 1em;margin-bottom: 30px;letter-spacing:2px; border-bottom: 1px solid $(post.title.color); padding-bottom: 8px;}
.sidebar .widget {clear: both; margin-bottom: 50px;}
.sidebar ul {margin: 0; padding: 0; list-style: none;}
.widget-content:after {visibility: hidden;display: block;content: "";clear: both;height: 0;}
/*****************************************
Profile
******************************************/
.Profile img {padding:0 !important; margin-left: auto;
margin-right: auto; margin-bottom:20px; display: block;}
img.profile-img {width: 240px; height: 240px; padding:0 !important;}
.profile-img {float:none;}
.profile-data,
.feed-links,
.home-link,
.profile-link {display: none !important;}
.profile-textblock {margin:0 !important;}
/*****************************************
Status Msg
******************************************/
.status-msg-bg {background-color:#ffffff !important; opacity:1.0;filter:alpha(opacity=0);-moz-opacity:1.0;}
.status-msg-border {border:none!important; opacity:1.0;filter:alpha(opacity=0);-moz-opacity:1.0;}
.status-msg-wrap {width:100%; margin:0px auto 30px;}
.status-msg-wrap a {text-decoration:none !important;}
/*****************************************
Footer Credits CSS
******************************************/
.footer-credits {background: #f2f2f2; color: $(body.text.color); display: block; margin: 50px 0 0; padding: 30px 0 30px 0; text-align: center;}
#footer .widget {margin-bottom:50px; clear: both; margin-bottom: 50px;}
#footer .widget:last-child {}
.footer-credits h2 {font: $(footer.title.font); color: $(post.title.color);text-transform:uppercase; text-align: center;line-height: 1em;margin-bottom: 30px;letter-spacing:2px;}
.footer-credits a {color: $(link.color);}
.footer-credits a:hover {color: $(link.hover.color);}
.f-credits {}
/*****************************************
Custom Widget CSS
******************************************/
/***** Search Form *****/
#searchform fieldset {background: #fff; border: 1px solid #E5E5E5; padding: 0px 10px 0px 10px; height:40px; line-height:40px;}
#s {border: 0 none; width: 100%;color: #898989;}
#searchform fieldset input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px #fff inset;}
/***** Custom Labels *****/
.cloud-label-widget-content {text-align:left;}
.cloud-label-widget-content .label-size {float:left; margin: 10px 10px 0 0; opacity: 1;}
.cloud-label-widget-content .label-size a, .cloud-label-widget-content .label-size span {white-space:nowrap; background: #ffffff; display: block; padding: 8px 10px; color: $(accent.color); text-transform:uppercase; font-size:14px; border: 1px solid $(accent.color);}
.cloud-label-widget-content .cloud-label-widget-content .label-size span {background: #ffffff;}
.cloud-label-widget-content .label-size .label-count {display: none;}
.label-size:hover a {background:$(accent.color); color: #ffffff;}
.list-label-widget-content ul li a {padding: 4px 0 4px 0; display:block;}
.label-size-1, .label-size-2, .label-size-3, .label-size-4, .label-size-5 {font-size:100% !important;}
/***** Popular Post *****/
.popular-posts .item-snippet {display:none;}
.popular-posts ul {counter-reset: popcount; margin: 0; padding: 0;}
.popular-posts ul li {margin: 0 0 15px 0 !important; overflow: hidden; padding: 0 !important; border: 0;}
.popular-posts ul li:last-child {margin-bottom:0px;}
.PopularPosts .item-thumbnail {margin: 0 !important; float:none !important;}
.PopularPosts ul li img {display: block; padding: 0; width: 280px; height: auto; margin-bottom:5px;}
.PopularPosts .item-title {font-size:16px; color: $(link.color); line-height: 1.4; text-transform: uppercase; text-align: center;}
.PopularPosts .item-title a {font-size:16px; color: $(link.color); line-height: 1.4; text-transform: uppercase; text-align: center;}
.PopularPosts .item-title a:hover {color: $(link.hover.color);}
.item-snippet {margin-top:8px;}
/***** Related Posts *****/
.related-posts h5 {font-size: 1.5em;padding: 10px;text-transform: uppercase;}
.related-posts { width: 100%; margin: 2em 0;float: left;}
.related-posts ul li {list-style: none; margin: 0 5px;float: left;text-align: center;border: none;}
/***** Follow By Email *****/
.FollowByEmail .follow-by-email-inner input {font: $(body.font);}
.FollowByEmail .follow-by-email-inner input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px #fff inset;}
.FollowByEmail .follow-by-email-inner .follow-by-email-address {width:100%; height:39px; font-size:14px; color:#898989; border:none; background: #fff; border: 1px solid #E5E5E5; padding:0 0 0 8px;}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit {width:68px; height:41px; margin-left:0px; border-radius:0px; color: #ffffff; background:$(accent.color); font-size:14px; text-transform: uppercase;}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit:hover {background: $(body.text.color); color: #ffffff; border-color:$(body.text.color);}
/***** Blogger Contact Form Widget *****/
.contact-form-widget {max-width:100%; width:auto;}
.contact-form-email, .contact-form-name, .contact-form-email-message, .contact-form-email:hover, .contact-form-name:hover, .contact-form-email-message:hover, .contact-form-email:focus, .contact-form-name:focus, .contact-form-email-message:focus {background: #f7f7f7; border: none; box-shadow: none; width: 100%; height:45px; font-size:14px; vertical-align:middle; padding:8px;}
.contact-form-button-submit {background: $(accent.color); border: none; float: none; height: 45px; margin: 15px 0 0 0; width: 50%; cursor: pointer; line-height:45px;}
.contact-form-button-submit:hover {background: $(body.text.color); border: none; font-size: 14px; text-transform: uppercase;}
.contact-form-name, .contact-form-email, .contact-form-email-message {max-width:none;}
.contact-form-email, .contact-form-name {margin-bottom:10px;}
/***** Meet The Author *****/
#About { background: #FFFFFF; display: inline-block; padding: 25px 3%; width: 94%; }
#About .widget-content {position: relative; width: 100%;}
#About .widget-content .main-wrap { width: auto; margin-right: 370px; }
#About .widget-content .main-wrap .info { float: left; position: relative; width: 90%; padding: 10px 5%;}
#About .widget-content .side-wrap { width: 340px; float: right; text-align: center; }
#About .widget-content .main-wrap .info h5 { border-bottom: 1px solid #F1F4F9; color: #000000; font-size: 14px; font-weight: bold; margin: 0 0 10px; padding: 0 0 5px; text-transform: capitalize; }
#About .widget-content .main-wrap .info p { color: #555; font-style: italic; }
#About .widget-content .side-wrap .author-img { border: 1px solid #CECECE; height: 150px; vertical-align: bottom; width: 150px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
ul.author-social { display: inline-block; margin: 10px 0 0; padding: 0; }
ul.author-social li { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlo5IRhvjccgFyUHdS6d7EaTV7_yaCNJhnHZjcW_0PDIT78ksHTJfAWnPadC2Hq3GuPceM8RtezHvpLi0INfusBuYQbqRpex5qs2Ob7MlsWMw8fAVBg7m7J6uHW2eDQ_w2tfp-PdkD3E3r/s1600/sprites.png") no-repeat; display: inline-block; font-weight: bold; font-size: 12px; line-height: 16px; list-style: none; padding: 0 20px; }
ul.author-social li.facebook { background-position: 0 -80px; }
ul.author-social li.twitter { background-position: 0 -100px; }
ul.author-social li.googleplus { background-position: 0 -120px; }
ul.author-social li a { color: #000; }
ul.author-social li a:hover { color: #666; }
/***** Scroll to Top *****/
.backtotop {
position: fixed;
bottom: 20px; /* increase value to move position up */
right: 10px; /* increase value to move position left */
color: $(body.text.color); /* color of text */
background-color: $(body.background.color); /* background color of button */
font-size: 12px; /* changes size of text */
padding: 10px; /* add space around the text */
text-transform: uppercase; /* change text to all caps */
letter-spacing: 1.0px; /* space between letters */
}
.backtotop:hover {
background-color: $(accent.color); /* color of background on hover over */
color: #ffffff; /* color of text on hover over */
text-decoration: none; /* no underline */
}
/*****************************************
Comments CSS
******************************************/
.comments {padding-top: 30px;}
.comments h4 {font: $(post.title.font); font-size: 18px; margin: 0 0 18px; text-transform: uppercase; color:#000;}
.comments .comments-content .comment-thread ol { overflow: hidden; margin: 0; }
.comments .comments-content .comment:first-child { padding-top: 0; }
.comments .comments-content .comment { margin-bottom: 0; padding-bottom: 0; }
.comments .avatar-image-container { max-height: 60px; width: 60px; }
.comments .avatar-image-container img { max-width: 60px; width: 100%; }
.comments .comment-block { background: #ffffff; margin-left: 72px; padding: 0; border-bottom: 1px solid #dbdbdb;}
.comments .comments-content .comment-header a { color: #333;}
.comments .comments-content .user { display: block; font-weight: bold; }
.comments .comments-content .datetime { margin-left: 0; }
.comments .comments-content .datetime a { font-size: 12px;}
.comments .comments-content .comment-header, .comments .comments-content .comment-content { margin: 0 20px 10px 0; }
.comments .comment-block .comment-actions { display: block; text-align: right; margin-top:20px; }
.comments .comment .comment-actions a { background: #f2f2f2; color: #333; display: inline-block; font-size: 12px; line-height: normal; margin-left: 1px; padding: 5px 8px; border: 1px solid #dbdbdb; border-bottom:0; }
.comments .comment .comment-actions a:hover { text-decoration: none; }
.comments .thread-toggle { display: none; }
.comments .comments-content .inline-thread {margin: 0 0 20px 17px !important; padding: 0 0 0 20px; }
.comments .continue { display: none; }
.comments .comments-content .icon.blog-author {display: none;}
.comment-thread ol {}
.comment-thread li:before {display:none;}
.comment-thread ol ol {}
.comment-thread li li:before {display:none;}
/*******************************************
MEDIA QUERIES
*****************************************/
@media screen and (max-width: 1100px) {
.ct-wrapper, .header-ct-wrapper {width: 96%;}
#navigation {width: 96%;}
.main-wrapper {width:71%;}
.sidebar-wrapper {width:25%;}
}
@media screen and (max-width: 810px) {
.main-wrapper {width:100%; float:none; border-right:0; padding-right:0;}
.sidebar-wrapper {width:100%; margin-top:50px; float:none;}
#Profile1 .widget-content {max-width: 560px; margin: 0 auto;}
.profile-textblock {padding-left:260px;}
.Profile img {float:left !important; border:none !important;}
img.profile-img {width: 240px; height: 240px;}
.PopularPosts ul li img {width:200px;}
.PopularPosts .item-thumbnail {margin-right:20px !important; float:left !important;}
.popular-posts .item-snippet {display:block;}
}
@media screen and (max-width: 600px) {
.profile-textblock {padding-left:215px; display:block;}
.Profile img {width:200px; height:200px;}
.PopularPosts ul li img {width:600px; margin:0 auto 15px auto !important; text-align:center;}
.nav-menu {position: inherit;}
}
@media screen and (max-width: 480px) {
.Profile img {float:none !important; margin:0 auto !important; text-align:center;}
.profile-textblock {padding-left:0px;}
.cl {display: block; width: 100%; margin-bottom: 20px;}
.share-buttons {position:static; text-align: right;}
}
@media screen and (max-width: 440px) {
.rmlink {}
}
/*****************************************
Hiding Header Date and Feed Links
******************************************/
h4.date-header{display:none;}
]]>
