Facebook templates

<data:blog.pageTitle/>

<data:blog.pageName/> - <data:blog.title/>

*/

/* Use this with templates/template-twocol.html */
#navbar-iframe {height:0px;visibility:hidden;display:none}

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
text-decoration:underline;
}
a img {
border-width:0;
}

/* Header
-----------------------------------------------
*/

#headerpic-wrapper {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhiGm8IefEypcCzT7U6YRCNEY67BfeenGT24ZSb45MNhmmdEUoiMu-vIrnPqwSLpCxomlBYZJvodpXZIMERd5BJ_yJNiqAK4xaAtQR5qaSEEdMaNImSkKPDdJ-DHR1WxBWCfcFv3zQfxU/s1600/bg_header.PNG) no-repeat bottom center;
width:950px;
margin:0 auto;
padding:0 0 5px 0;
}

#header-wrapper {
width:950px;
margin:0 auto;
border-bottom:0px solid $bordercolor;
}

#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}

#header {
float: $startSide;
width:210px;
margin: 0px;
border: 0px solid $bordercolor;
text-align: left;
color:$pagetitlecolor;
}

#header2 {
float: $endSide;
width:728px;
margin: 0 auto;
text-align: left;
}

.header .widget, .header2 .widget {margin:0 auto;padding:0 0 5px 0;}

#header h1 {
margin:0 auto;
padding:15px 0px .15em;
line-height:1.2em;
text-transform:none;
letter-spacing:.01em;
font: $pagetitlefont;
}

#header a {
color:$pagetitlecolor;
text-decoration:none;
}

#header a:hover {
color:$pagetitlecolor;
}

#header .description {
margin:0 auto;
padding:0 0px 5px;
max-width:100%;
text-transform:none;
letter-spacing:.01em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}

#header img {opacity:0.8;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
-moz-opacity:0.8;-khtml-opacity:0.8;
margin-$startSide: auto;
margin-$endSide: auto;
}
#header img:hover {opacity:1.0; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity:1.0;-khtml-opacity:1.0;}

/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
width: 950px;
margin:0 auto;
padding:10px 0;
text-align:$startSide;
font: $bodyfont;
}

#mainpage-wrapper {
width: 640px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#slide-wrapper {
width: 640px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#main-wrapper {
width: 630px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#main2-wrapper {
width: 300px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 300px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

/* Headings
----------------------------------------------- */

h2 {
margin:0.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:none;
letter-spacing:.01em;
color:$sidebarcolor;
}

/* Posts
-----------------------------------------------
*/
h2.date-header {font:normal 12px Arial;color:#888;
margin:0.5em 0 .5em;
}

.post {
margin:.5em 0 0.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:0.5em;
}
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:32px;
font-weight:normal;
line-height:1.2em;
color:$titlecolor;
}

.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:$titlecolor;
}

.post h3 strong, .post h3 a:hover {
color:$textcolor;
text-decoration:underline;
}

.post-body {
font-size:14px;
margin:2.0em 0 .75em;
line-height:1.2em;
}

.post-body blockquote {
line-height:1.3em;
}

.post-footer {
margin: .75em 0;
color:$sidebarcolor;
text-transform:none;
letter-spacing:.01em;
font: $postfooterfont;
line-height: 1.4em;
}

.comment-link {
margin-$startSide:.2em;
}
.post img, table.tr-caption-container {
padding-top:4px;
border:0px solid $bordercolor;
}
.tr-caption-container img {
border: none;
padding: 0;
}
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}

/* Comments
----------------------------------------------- */
.comment-form {width:620px;max-width:620px;overflow:auto;clear:both;}

#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.01em;
color: $sidebarcolor;
}

#comments-block {
margin:1em 0 1.5em;
line-height:1.3em;
}
#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.01em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}

#blog-pager-newer-link {
float: $startSide;
}

#blog-pager-older-link {
float: $endSide;
}

#blog-pager {
text-align: center;
}

.feed-links {
clear: both;
line-height: 2.5em;
}

/* Main Content
----------------------------------------------- */
.main .widget {
border-bottom:1px dotted $bordercolor;
margin:0 0 0.5em;
padding:0 0 0.5em;
}

.main .Blog {
border-bottom-width: 0;
}

/* Popular Post
----------------------------------------------- */
.PopularPosts {font:normal 14px Arial;line-height: 1.2em;color:#333}
.PopularPosts ul {list-style:none;margin:0 0 0;padding:0 0 0;}
.PopularPosts li {margin:0;padding:1px 0;line-height:1.2em;}
.PopularPosts a:link, .PopularPosts a:visited {color:#0b5394;text-decoration:none;font:bold 16px Arial;}
.PopularPosts a:hover {color:#000;text-decoration:underline;}

/* Sidebar Content
----------------------------------------------- */
.sidebar h2 {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieIvVf5RcdhIUrF6UfIb7eRxF-mMEeQaOUMhYCPY_HCa66oFyqYtzmQES-5GR986JceKLA4XraNTCJs0fHkYrIn2InUZEaTLY1X2maPSpwlfXlr5Ayjx6AaamKBBRGvEbWYxgMlJr0HZU/s1600/h2_sidebar.gif) no-repeat;margin:0.0em 0 .25em;padding:20px 10px 20px 20px;font:bold 15px Arial;line-height: 1.2em;text-transform:uppercase;letter-spacing:.01em;color:#fff;}

.sidebar h2:hover{color:#FFFF00}

.sidebar {
color: $sidebartextcolor;
line-height: 1.4em;
}

.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding:0 0 .25em 0;
text-indent:0px;
line-height:1.4em;
}

.sidebar .widget {
border-bottom:1px dotted $bordercolor;
margin:0 0 0.5em;
padding:0 0 0.5em;
}

/* Crosscol Content
----------------------------------------------- */
.crosscol .widget {margin:0;padding:10px 0}

/* Main2 Content
----------------------------------------------- */
.main2 h2 {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0tivIsSB5b37f3e-M9uekJsS4hdWWeXxPaTv9s0DlNyGJ1qx0fxL9ZyuwzV5C9HdUH-0tVTFYyLPsqDSQmSVpyNepzW05qz3IzAo6_PIj2D-N4bmgOQ6ZvnQqIHRW62jgPeMcbtHUpFs/s1600/h2_main2.gif) no-repeat;margin:0.0em 0 .15em;padding:22px 10px 28px 10px;font:bold 15px Arial;line-height: 1.2em;text-transform:uppercase;letter-spacing:.01em;color:#fff;}
.main2 {color:#666;line-height: 1.3em;}
.main2 ul {list-style:none;margin:0 0 0;padding:0 0 0;}
.main2 li {margin:0;padding:2px 0;text-indent:0;line-height:1.3em;}
.main2 .widget {border-bottom:1px dotted $bordercolor;margin:0 0 5px 0;padding:0 0 5px 0;}

/* Footer Content
----------------------------------------------- */
.footer h2 {font:bold 16px Arial;margin:0 0 5px 0;color:#fff;line-height: 1.2em;text-transform:none; letter-spacing:.01em;}
.footer {font:normal 12px Arial; color:#8691a1;line-height: 1.3em;}
.footer ul {list-style:none;margin:0 0 0;padding:0 0 0;}
.footer li {margin:0;padding:0 auto;text-indent:0px;line-height:1.6em;}
.footer .widget {margin:0 0 5px 0;padding:0 auto;}
.footer a:link, .footer a:visited {font:normal 12px Arial;color:#888;text-decoration:none;}
.footer a:hover {color:#fff;text-decoration:none;}

/* Profile
----------------------------------------------- */
.profile-img {
float: $startSide;
margin-top: 0;
margin-$endSide: 5px;
margin-bottom: 5px;
margin-$startSide: 0;
padding: 4px;
border: 1px solid $bordercolor;
}

.profile-data {
margin:0;
text-transform:uppercase;
letter-spacing:.1em;
font: $postfooterfont;
color: $sidebarcolor;
font-weight: bold;
line-height: 1.6em;
}

.profile-datablock {
margin:.5em 0 .5em;
}

.profile-textblock {
margin: 0.5em 0;
line-height: 1.6em;
}

.profile-link {
font: $postfooterfont;
text-transform: uppercase;
letter-spacing: .1em;
}
/* Footer Wrapper
----------------------------------------------- */
.picfooter{background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9KGfWp8pWK5kFPO_uzmdQPsyqMavej6eiD0RY8W_sadC_H9znygpmAGs6s1HDlniJ3owEqFznQxvshE-59xegXg8xIEKBKdjkwcr6ozztPsbicN89-Jjt72Hosekkxb671tNEaKoahM8/s1600/bg_footer.gif) repeat-x top left;width:100%; margin-$startSide: auto;margin-$endSide: auto;margin:0 auto;text-align:center;font:$bodyfont;padding:10px 0;}
#footer-wrapper {width: 950px;padding:10px 0;margin:0 auto;text-align:left;font: $bodyfont;}
#footer1-wrapper {width:180px;float: $startSide;margin-right:15px;word-wrap: break-word;overflow: hidden;}
#footer2-wrapper {width:180px;float: left;margin-right:15px;word-wrap: break-word;overflow:hidden;}
#footer3-wrapper {width:180px;float:left;margin-right:15px;word-wrap:break-word;overflow:hidden;}
#footer4-wrapper {width:175px;float:left;word-wrap: break-word;overflow: hidden;}
#footer5-wrapper {width:175px;float: $endSide;word-wrap: break-word;overflow: hidden;}

/* Credit Wrapper
---------------------------------------------*/
.creditpic {background:#000;width:100%;margin:0 auto;padding:0 auto}
.credit {width: 950px;margin:0 auto;padding:10px 0 25px 0;line-height: 1.6em;text-align:left;font-family:Arial;font-size:11px;color:#666;overflow:hidden;clear:both;}
.credit a:link, .credit a:visited{color:#444;text-decoration:none;}
.credit a:hover {color:#fff;text-decoration:none;}

/* Featured Content
----------------------------------------------- */
#featured {width:640px;height:290px;margin:0 0 10px 0;padding:0;position:relative;}
#featured ul.ui-tabs-nav{position:absolute;top:0;right:0;list-style:none;padding:0; margin:0;width:235px;height:290px;}
#featured ul.ui-tabs-nav li{height:58px;padding:0;position:relative;line-height:1.0em;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgec3RqgVfl2ng8nv8r8HMWrrKlV8crffF3xzBpTfddSoKoUfO09-Edou034PvM3XbbzwVrcyzRhhyphenhyphenC8ET3f1gjU6pFje-m5oh76mX4z4pzNOk-1OutSasYcuVoNY8VkNlhq26sQE5BhgE/s1600/slide_basic.gif) repeat-y bottom right;}
#featured ul.ui-tabs-nav li span {padding:0;margin:0;line-height:1.0em;}
#featured .ui-tabs-panel{width:405px; height:290px;position:relative;overflow:hidden;padding:0}
#featured .ui-tabs-panel img {width:395px; height:290px;margin:0 5px}
#featured .ui-tabs-hide {display:none;}
#featured li.ui-tabs-nav-item a {height:38px;display:block;margin:0; padding:10px 20px 10px 10px;color:#000;overflow:hidden;line-height:1.0em;outline:none;}
#featured li.ui-tabs-nav-item a:hover{background:none;text-decoration:none;color:#A00000}
#featured li.ui-tabs-selected{position:absolute;}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikT7evi7QgLS33nL3f57DmV4tMKLvpdn2uRrnbOLXO1nSpbv_-guMSxRs9gefcCJRAY9p1j0_xpP5ZgJYoUmun9pyikGS2yUbvBr19JoqvSSJ4fxacZk9taKA8p8UejFFQhtsC3PHCLro/s1600/slide_hover.gif) no-repeat center right;display:block;font:normal 12px Arial;line-height:1.0em;color:#fff}
#featured ul.ui-tabs-nav li img{width:55px;height:38px;float:left; margin:0px 8px 5px 0;padding:0;border:none;}
#featured .ui-tabs-panel .info{position:absolute;top:230px; left:0; height:60px;width: 400px;background:#A00000;border-right:5px solid #000}
#featured .info h2{text-transform:none;line-height:1.2em;font-size:18px;font-family:Arial, serif;height:40px;color:#fff; padding:6px 10px; letter-spacing:.001em;margin:0;overflow:hidden;}
#featured .info a{text-decoration:none;color:#fff;}
#featured .info a:hover{color:#FFFF00;text-decoration:none;}

/* Menu
---------------------------------------------*/
.menupic{background:#222;width:100%;margin:0 auto;padding:0 auto;border-bottom:1px solid #444}
.menu{width:950px; height:40px;margin:0 auto;padding:0 auto;}
.menu ul{width:800px;float:left;margin:0;padding:0;color:#ddd;text-transform:none;list-style-type:none;font:bold 12px Arial;overflow:hidden}
.menu ul2{width:140px;float:right;margin:0;padding:0;color:#fff;text-transform:none;list-style-type:none;font:normal 11px Arial;overflow:hidden}
.menu li{display:inline;margin:0;}
.menu li a{float:left;display:block;text-decoration:none;padding:13px 8px;color:#ddd;border-left:1px solid #333}
.menu li a:visited{color:#ddd;}
.menu li a:hover {color:#FFFF00;text-decoration:none;}

/* Menu Horizontal Bottom
---------------------------------------------*/
.menubottompic {background:#A00000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOoXPNaUcF0Zalxjiz5Na1Mi2k7VBHJg8EMPIjDlLwZhkRlfV4SeAvtg7gpBZzymjU9J6bCRJIBwJbJGJsBhweHX6hoAsWxO_IlB7wI63sNySE5Yjb1cNglZzu6BFKUUwMW1OBwbzK0BQ/s1600/bg_menubottom.gif) repeat-x top left;width:100%;margin:0 auto;padding:0 auto;height:42px;}
.menubottom {width:950px;height:20px;margin:0 auto;padding:14px 0;}
.menubottom ul {margin: 0;padding-left:0px;color:#fff;text-transform:none;
list-style-type: none;font:normal 11px Arial,sans-serif;}
.menubottom li{display: inline; margin: 0;}
.menubottom li a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGjOQdL0K6Ibl0rAED4NNDgO3j4807n9ZpJpR-ufAQlCZsp15HMfOr_L-vdZ9eMRgubwDvK7ryvyjiJQ6gYmKY8EpC-_0rc_q78UvZeILl9PcbhluLV7n0MZjs2vIu5MRZR7TaFMGJAig/s1600/bg_spritebottom.gif) no-repeat center right;float: left;display: block;text-decoration:none;
padding:1px 8px;color:#eee;line-height: 1.2em;}
.menubottom li a:visited{color:#eee;}
.menubottom li a:hover {color:#000;text-decoration:none;}

/* Page Navigation
----------------------------------------------- */
.showpageArea a {font:bold 12px Arial;text-decoration:none;}
.showpageNum a {font:bold 12px Arial;background:#fff;text-decoration:none;border:1px solid #ccc;margin:0 2px;padding:6px 10px;color:#000}
.showpageNum a:hover {border:1px solid #888;background-color:#fff;color:#111;}
.showpagePoint {font:bold 12px Arial;color:#666;text-decoration:none;border:1px solid #ccc;background:#EEEEFF;margin:0 2px;padding:6px 10px;}
.showpageOf {font:normal 11px Arial;text-decoration:none;padding:6px 10px;margin: 0 2px 0 0;color: #666;text-transform:none;}
.showpage a {background:#fff;font:bold 12px Arial;text-decoration:none;border:1px solid #ccc;padding:6px;color:#666}
.showpage a:hover {color:#222;border:1px solid #888;background-color:none;text-decoration:none;}
.showpageNum a:link,.showpage a:link {text-decoration:none;}

/* CSS Related Post + Contact
---------------------------------------------*/
#bottom-posts {float:left;width:100%;padding:10px 0 15px 0;margin:10px 0;border-bottom:1px solid #ccc}

#related-posts {float:left;width:290px;padding:0 20px 0 0;margin:5px 0 0 0;border-right:1px solid #ddd}
#related-posts .widget{padding:0px;margin:0px;}
#related-posts .widget h2, #related-posts h2{font:bold 13px Arial;color:#000;margin:0 0 5px 0;padding:0px;text-transform:none}
#related-posts a{color:#333;font:normal 13px Arial;}
#related-posts a:hover{color:#000;text-decoration:underline;}
#related-posts ul {list-style:none;margin:0 0 0 0;padding:0 0 0 0;}
#related-posts li {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKy4odCTt9zhrs3u_iM35rhMDE9W6oA2ElwZjYmEcooqgHIL9n8AxFssUs9VlUt8WY0V14jDmMnNC4wEkYQlYqrJqVFrXWz_lKxUngdkv_-MgDULiLBY_ip3uo_Q10O_iDZfLIEfaTgbE/s1600/bullet-list.gif) no-repeat 0px 8px;margin:0;padding:2px 0 2px 10px;text-indent:0px;line-height:1.2em;}

#related-ads {float:right;width:300px;margin:5px 0;}
#related-ads img, #related-ads img {opacity:0.7;filter:alpha(opacity=70);}
#related-ads img:hover {opacity: 1.0;filter:alpha(opacity=100);}

]]>