@import url("reset.css");

/* STICKY FOOTER - http://themaninblue.com/writing/perspective/2005/08/29/
-----------------------------------------------------------------------------*/
html {height:100%;}
body {height:100%;}
#container {position:relative; min-height:100%; text-align: center;}
* html #container {height:100%;}
#wrapper {padding-bottom:50px; text-align: center;}
#footer {position:relative; margin-top:-51px;}

/* GLOBALS
-----------------------------------------------------------------------------*/
a {text-decoration:none;}
body {background:#1c1c1c url(images/bg_body.png); font-family:"Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif;}

/* GENERIC
-----------------------------------------------------------------------------*/
.clear {clear:both;}
.content p.divider, .photos p.divider {background:transparent url(images/bg-divider.png) no-repeat center center; height:30px; clear:both;}
.line {border-top: 1px solid #121212; margin: 20px 0; clear: both; border-bottom: 1px solid #383838;}
.img_l {float:left; margin:0 10px 10px 0; border:10px solid #111;}
.img_r {float:right; margin:0 0 10px 10px; border:10px solid #111;}
img.center {margin: 10px auto; border: 10px solid #111;}
img.right {}
img.left {}
.expand {width:100%;}
.right {text-align:right;}
.left {text-align:left;}
.fr {float:right;}
.fl {float:left;}
.nobg {background:none;}
.hide {display: none;}
#sub ul, #extra ul, #sub li, #extra li {overflow: hidden;}

		@font-face {font-family:GraublauWeb; src:url(fonts/GraublauWeb.otf) format("opentype");}
		@font-face {font-family:GraublauWeb; src:url(fonts/GraublauWebBold.otf) format("opentype"); font-weight:bold;}


/* LAYOUT
-----------------------------------------------------------------------------*/
#container, #wrapper, #wrap, #header {position:relative;}
#wrap {text-align: left;}

#wrap {width:960px; min-height:750px; margin:0 auto; background:url(images/bg_body1.png) no-repeat;}
/* mac hide \*/
* html #wrap {height:750px}
/* end hide */

body#page_home #wrap {background:transparent url(images/bg-wrap-page-home.png) no-repeat center top; top: -250px;}
body.wide #wrap {background:none;}
body.gallery #wrap {background:transparent url(images/bg_wrap_gallery.png) no-repeat center top;}

#titlebar {background:#111 url(images/bg-header.png) repeat-x left bottom; border-top:1px solid #333; padding-bottom:1px; text-align: center;}
body#page_home #titlebar {background:transparent url(images/bg-header.png) repeat-x left -1px; margin-top: 70px;}

#titlebar .inner {width:960px; margin:0 auto; background:url(images/bg_titlebar.png) no-repeat left bottom; position: relative; text-align:left;}
body#page_photos #titlebar .inner {background-image: url(images/bg_titlebar_photos.png);}
body#page_contact #titlebar .inner {background-image: url(images/bg_titlebar_contact.png);}
body#page_about #titlebar .inner {background-image: url(images/bg_titlebar_about.png);}
body#page_articles #titlebar .inner {background-image: url(images/bg_titlebar_articles.png);}
body#page_videos #titlebar .inner {background-image: url(images/bg_titlebar_videos.png);}


#titlebar .inner h2 {color:#FFF; position:relative; margin-left: 200px; padding:40px 0 90px; font-family: GraublauWeb,"Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif; font-size: 1.6em;}
#titlebar .inner h2 em {font-size: .8em; font-style:italic; color: #666; font-weight: normal;}
#titlebar .inner h2 span {color:#666; font-family:"Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif; font-size: 0.5em;}
#titlebar .inner h2 span a {color:#CC0000;}

		span.status {background-image: url('images/icons/status.png'); background-repeat: no-repeat; width: 83px; height: 20px; position: absolute; top: 0; right: 20px;}
		#titlebar span.status {left:0;}
		span.status a {display: block;}
		span.status.closed {background-position: center 0;}
		span.status.open {background-position: center -25px;}
		span.status.featured {background-position: center -50px;}
		span.status.family {background-position: center -75px;}
		span.status.draft {background-position: center -100px;}

#footer {background-color:#080808; border-top:1px solid #252525; height:50px; text-align: center;}
#footer .inner {width:960px; margin:0 auto; text-align: left;}
#footer .inner p {color:#252525; font-size:.6em; padding:20px 0; text-transform: uppercase; font-variant: small-caps; font-weight: bold; font-family: "Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif;}
#footer .inner p a {color: #333; padding: 2px 6px;}
#footer .inner p a:hover {background: #FFFF00; color: #000;}

/* Main Navigation
---------------------------------------------------------------------------------*/
#header {height:50px; width:960px; margin:0 auto; z-index:100;}
body#page_home #header {height: 70px; top: 70px;}

#header h1#logo {left:0px; top:10px; height:30px; width:150px; background:url(images/logo.png) no-repeat; position:absolute; text-indent:-9999px; display: block;}
#header h1#logo a {display:block; position:absolute; height:30px; width:150px; overflow:hidden; outline:0;}

#header ul {width:420px; height:30px; top:10px; right:270px; list-style-type:none; background:url(images/nav.png) no-repeat; position:absolute;}
#header li {float:left;}
#header ul a {position:absolute; height:30px; top:0; text-indent:-9999px; overflow:hidden; background:url(images/nav.png) no-repeat; outline:0;}
    
#header #nav_blog a {width:56px; left:0; background-position:0 0;}
#header #nav_photos a {width:65px; left:56px; background-position:-56px 0;}
#header #nav_videos a {width:61px; left:121px; background-position:-121px 0;}
#header #nav_links a {width:52px; left:182px; background-position:-182px 0;}
#header #nav_apps a {width:48px; left:234px; background-position:-234px 0;}  
#header #nav_about a {width:59px; left:282px; background-position:-282px 0;} 
#header #nav_contact a {width:79px; left:341px; background-position:-341px 0;}

#header #nav_blog a:hover {background-position:0 -30px;}
#header #nav_photos a:hover {background-position:-56px -30px;}
#header #nav_videos a:hover {background-position:-121px -30px;}
#header #nav_links a:hover {background-position:-182px -30px;}
#header #nav_apps a:hover {background-position:-234px -30px;}
#header #nav_about a:hover {background-position:-282px -30px;}
#header #nav_contact a:hover {background-position:-341px -30px;}
  
#page_blog #header #nav_blog a, #page_articles #header #nav_blog a, #page_article #header #nav_blog a {background-position:-0 -60px;}
#page_photos #header #nav_photos a {background-position:-56px -60px;}
#page_videos #header #nav_videos a {background-position:-121px -60px;}
#page_links #header #nav_links a {background-position:-182px -60px;}
#page_apps #header #nav_apps a {background-position:-234px -60px;}
#page_about #header #nav_about a {background-position:-282px -60px;}
#page_contact #header #nav_contact a {background-position:-341px -60px;}

#page_home a#link_home, #page_articles a#link_blog, #page_article a#link_blog, #page_photos a#link_photos, #page_videos a#link_videos, #page_links a#link_links, #page_apps a#link_apps, #page_about a#link_about, #page_contact a#link_contact {background-color: #FFFF00; color: #000;}
#footer .inner p a#link_xhtml:hover {background: #FF0000;}
#footer .inner p a#link_css:hover {background: #3399FF;}

/* CONTENT
-----------------------------------------------------------------------------*/
.content {margin: 0 30px;}
.content h3 {font-size:1.2em; color:#FFF; font-family: GraublauWeb,"Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif;}
.content h3 strong {color:#FFFF00;}
.content h4 {font-size:1em; color:#CCC;}
.content h5 {color:#666;}

.content blockquote, .content p, .content ul {line-height:1.6em; font-size:.8em; color:#666;}
    
.content p {margin:20px 0;}
.content p.article_summary {margin:0 -20px 20px; padding:20px 20px 10px;}
.content p strong, #sub p strong, #extra p strong {font-weight:bold;}
.content p a, #sub p a, #extra p a {background:#333; color:#CCC; padding:1px 6px;}
.content p a:hover, #sub p a:hover, #extra p a:hover {background:#FFFF00; color:#000;}

.content em {font-style: italic;}

.content table {margin:20px 0;}
.content td, .content th {padding:10px 5px; vertical-align:text-top;}
.content thead td, .content thead th {background:#111; border:1px solid #111; color:#333; font-weight:bold;}
.content thead th a {color:#333;}
.content thead th a:hover {color:#FFFF00;}

.content tbody td {background:transparent; color:#666; font-size:.8em; line-height:1.6em;}
.content tbody td {color:#666; border-bottom:1px solid #111;}
.content tbody td a {color:#666;}
.content tbody td a:hover {color:#FFFF00;}
.content tbody tr.even td {color:#666; border-bottom:1px solid #252525;}
.content tbody tr.even td a {color:#666;}
.content tbody tr.even td a:hover {color:#FFFF00;}
    
.content ul {padding:20px 0; margin-left:25px;}
.content ul li {list-style:disc;}

.content blockquote {font-style:italic; padding:0 20px; margin:20px; border-left:1px solid #333;}
 
.article_media {margin:0; background:#000 url(images/fuzz.gif) center center; border:10px solid #111;}
.article_media.youtube {}
.article_media.vimeo {height:281px;}

.article_image {margin:0; background:#000 url(images/throbber.gif) no-repeat center center; border: 10px solid #111;}

span.article_caption {color:#666; font-size:.75em; font-style:italic; padding:0 10px 10px; margin:0 0 10px; background:#111; display:block;}
span.article_caption a {background:#333; color:#CCC; padding:1px 6px;}
span.article_caption a:hover {background: #FFFF00; color: #000;}
#extra span.article_caption {margin-bottom: 10px;}

.ad_image {margin:0 auto 30px; background:#111 url(images/throbber.gif) no-repeat center center; border: 10px solid #111; width: 468px;}
span.ad_caption{color:#666; font-size:.75em; font-style:italic; padding:0 10px 10px; margin:-2px auto 20px; background:#111; display:block; width: 468px;}

/* SUB and EXTRA
-----------------------------------------------------------------------------*/
#sub {float:left; width:190px; margin-top:4px; position:relative;}
#extra {float:right; width:190px; margin-top:4px; position:relative;}

#sub h3, #extra h3 {color: #FFF; padding:10px; border-bottom:1px solid #333; font-size:1em; font-family: GraublauWeb,"Lucida Grande",Tahoma,"Lucida Sans Unicode",Verdana,sans-serif;;}
#sub h3 em, #extra h3 em {font-style:italic;}
#sub h3 {padding-left: 0;}

#sub blockquote, #sub p, #sub ul, #extra blockquote, #extra p, #extra ul {line-height:1.5em; font-size:.75em; color:#999;}
/* #sub p {padding-left: 10px;} */
#sub p, #sub ul, #extra p, #extra ul {margin-bottom:20px;}
#sub p {margin-top: 10px; padding-right: 10px;} 
#extra p {margin-top:10px; padding-left: 10px;}


/* Tabs
---------------------------------------------------------------------------------*/
body.wide .tabberlive {width:100%;}
body.gallery .tabberlive {width:770px;}
body.gallery .thumbs {margin-left: 16px;}

.tabber, .tabbertabhide {display:none;}
.tabberlive {overflow:hidden; float:left; width:580px; position:relative; top:-47px;}

/*-------------------------------------------------- 
  REQUIRED to hide the non-active tab content. 
  But do not hide them in the print stylesheet! 
  --------------------------------------------------*/ 
/*
.tabberlive .tabbertabhide { display: block; position: absolute; left: 
-9999px; } 
*/

body.wide ul.tabbernav {margin-left:190px;}
body.gallery ul.tabbernav {margin-left:190px;}

.tabbertab {padding:0; margin-top:40px; background:transparent; clear:both;}

body.wide .tabbertab {padding:0;}
body.gallery .tabbertab {padding:0;}

ul.tabbernav {font:bold 12px Verdana, sans-serif; height:46px; overflow:hidden;}
ul.tabbernav li {list-style:none; display:inline; float:left;}
ul.tabbernav li a {padding:15px 30px 16px; display:block;}
ul.tabbernav li a:link, ul.tabbernav li a:visited {color:#666; background:transparent;}
ul.tabbernav li a:hover {color:#CCC;}
ul.tabbernav li.tabberactive a {color:#FFFF00; background:#111;}
ul.tabbernav li.tabberactive a:hover {color:#FFFF00; background:#111;}

/* LIST_BLOCK
-----------------------------------------------------------------------------*/
ul.list_block li {height: 1%;}
ul.list_block li em.date {display:block; text-align:right; color:#666; border-bottom:1px solid #333; font-size:.75em; padding-bottom:2px; margin-bottom:1px;}
ul.list_block li h3 {padding-right:20px; position:relative;}
ul.list_block li h3 a {font-size:.9em; color:#CCC; background:#333; padding:2px 6px;}

ul.list_block li h3 span {font-size:.6em; font-style:italic; color:#666;}

ul.list_block li h3 em a {font-size:.6em; position:absolute; right:0; top:-1px; padding:7px;}
ul.list_block li h3 a:hover {background:#111;}
ul.list_block li p {font-size:.8em; line-height:1.6em; padding:20px 0; color:#666;}
ul.list_block li p span a {background:#111; color:#666; padding:2px 4px;}
ul.list_block li p span a:hover {color:#999;}

/* MENU_BLOCK
-----------------------------------------------------------------------------*/
#sub ul.menu_block {margin:0;}
#extra ul.menu_block {margin:0;}
ul.menu_block li {font-size:11px; color:#666; height: 1%;}
#extra ul.menu_block li {text-align:right;}
#extra ul.menu_block li ul li {text-align:left;}

ul.menu_block li a {display:block; color:#999; padding:5px 10px; border-bottom:1px solid #333; font-weight:bold; cursor:default; background:transparent; height: 1%;}

ul.menu_block li ul li a {border-bottom:1px solid #333; background:transparent; font-weight:normal; cursor:pointer;}
ul.menu_block li ul li a span {float:right;}
ul.menu_block li ul li a:hover {background:#111;}

/* CAT_BLOCK
-----------------------------------------------------------------------------*/
#sub ul.cat_block {margin:0;}
#extra ul.cat_block {margin:0;}
ul.cat_block li {font-size:90%; color:#666; text-align:right; height: 1%;}
#extra ul.cat_block li {text-align:left;}
ul.cat_block li em {display:block;}
ul.cat_block li span {display:block;}

ul.cat_block li a {display:block; color:#999; padding:5px 10px; border-bottom:1px solid #333; height: 1%;}
ul.cat_block li a em {color:#666;}
ul.cat_block li a:hover {background:#111;}


/* LINK_BLOCK
-----------------------------------------------------------------------------*/
#sub ul.link_block {margin:0;}
#extra ul.link_block {margin:0;}
ul.link_block li {color:#999; font-size:90%;height: 1%;}
ul.link_block li em {display:block;}
ul.link_block li span {display:block;}

ul.link_block li a {display:block; color:#666; padding:5px 10px; border-bottom:1px solid #333;}
ul.link_block li a em {color:#999;}
ul.link_block li a span {color:#FFF;}
ul.link_block li a:hover {background:#111;}


/* SEARCH
-----------------------------------------------------------------------------*/
#applesearch {position:absolute; top:14px; right:0px; width:190px;}
#applesearch .sbox_l {background:transparent url(images/search-left.png) no-repeat; float:left; width:25px; height:23px;}
#applesearch .sbox_r {background:transparent url(images/search-right.png) no-repeat; float:left; width:35px; height:23px;}
#applesearch .sbox input {background:#1C1C1C url(images/search-bg.png) repeat-x; float:left; border:0; height:17px; width:104px; padding:3px; font-size:12px; line-height:17px; font-family:Arial; color:#999;}

/* SHOWCASE
-----------------------------------------------------------------------------*/
.showcaseImages {position:relative;}
.showcaseImages ul {width:480px; height:250px; /* height: 750px; */ position:relative; overflow: hidden;}
.showcaseImages ul li, .showcaseImages ul li .item {width:480px; height:240px; margin-top:10px;}
.showcaseImages ul li .item a img {width:480px; height:240px;}
.showcaseImages .pattern1,
.showcaseImages .pattern2 {width:480px; position:absolute;}
.showcaseImages .pattern1 {height:240px; background:url(images/bg-pattern1.png) no-repeat; top:10px;}
.showcaseImages .pattern2 {height:240px; background:url(images/bg-pattern2.png) no-repeat; bottom:0px;}

.showcaseTexts,
.showcaseTexts ul,
.showcaseTexts ul li {width:234px; height:260px; overflow: hidden;}
.showcaseTexts,
.showcaseTexts ul,
.showcaseTexts ul li .item {position:relative;}
.showcaseTexts ul li .item {height:230px; padding:30px 20px 0 0;}
.showcaseTexts ul li .item h2 a {color:#FFFFFF; font-size: 1.4em; font-family: GraublauWeb, Verdana; font-weight: normal; padding-right: 6px;}
.showcaseTexts ul li .item h2 a:hover {color: #000; background: #FFFF00;}
.showcaseTexts ul li .item p.article_summary {font-size: 1em !important;}
#sub .showcaseTexts ul li .item p.read_more {position:absolute; right:30px; bottom:0; font-family: GraublauWeb, Verdana; font-size: 1em;}
#sub .showcaseTexts ul li .item p.read_more a {background:url(images/iconArrow.gif) 2px 5px no-repeat; padding-left:15px; color:#FFF;}
#sub .showcaseTexts ul li .item p.read_more a:hover {background-color: #FFFF00; color: #000;}

.showcaseTexts .buttons {width:50px; height:250px; position:absolute; left:50px; top:0;}
.showcaseTexts .buttons .prev,
.showcaseTexts .buttons .next {width:50px; height:120px; cursor:pointer;}
.showcaseTexts .buttons .prev {background:url(images/previous_article.png) no-repeat;}
.showcaseTexts .buttons .prev:hover {background:url(images/prevOn.png) no-repeat;}
.showcaseTexts .buttons .next {background:url(images/next.png) no-repeat;}
.showcaseTexts .buttons .next:hover {background:url(images/nextOn.png) no-repeat;}

body#page_home #sub {width:234px; padding:250px 0 0 0; margin:0; position: relative;}
body#page_home #main {float:left; width:480px; padding:0 5px; background:url(images/bg-body.png); margin:0 1px;}
body#page_home #extra {width:234px; padding:240px 0 0 0; margin:0;}
body#page_home #extra h2,
body#page_home #extra p {padding-left:20px;}

span.entry_nav a {background-image:url(images/entry_nav.png); background-repeat:no-repeat; text-indent:-9999px; height:20px; display:block;}
span.entry_nav.prev {float:left; margin:-38px 0 10px -10px;}
span.entry_nav.next {float:right; margin:-38px 0 10px 0;}
span.entry_nav.prev a {background-position:0 0; width:86px;}
span.entry_nav.next a {background-position:-86px 0; width:62px;}
span.entry_nav.prev a:hover {background-position:0 -20px;}
span.entry_nav.next a:hover {background-position:-86px -20px;}

/* BUTTONS
-----------------------------------------------------------------------------*/
.button a {text-indent:-9999px; display:inline-block; background-repeat: no-repeat;}

a.add {width: 86px; height: 25px; background-image:url(images/buttons/add.png);}
a.add:hover {background-position:0 -20px;}

a.flickr_sm {width: 31px; height: 19px; background-image: url(images/icons/flickr_sm.png); position: absolute; top: 60px; right: 34px;}
a.twitter_sm {width: 75px; height: 21px; background-image: url(images/icons/twitter.png); position: absolute; top: 59px; right: 10px;}

a.previous_page {height:20px; width:86px; background-image:url(images/entry_nav.png); margin-left:10px;}
a.previous_page:hover {background-position:0 -20px;}

/* ACCORDION
-----------------------------------------------------------------------------*/
.accordion {border-bottom: 1px solid #252525; margin: 0 auto;}
.accordion h3 {position: relative; border-top: 1px solid #111;}
.accordion h3 a {font-size: 0.9em; color: #666; padding: 20px; cursor:pointer; display:block; border-top: 1px solid #252525;}
.accordion h3 a span {font-size: 0.7em;}
.accordion h3.selected a {color: #FFFF00; background: url(images/bg-h3.png) repeat-x top left;}
.accordion h3.selected a span {color: #FFF;}
.accordion h3 em.date {color: #666; font-size: 0.7em; position: absolute; top: 22px; right: 20px; font-weight: normal; font-variant: normal;}
	
.accordion .item {position: relative;  background: url(images/bg_body.png); border-top: 1px solid #111;}
	
.accordion .item p {font-size: 0.8em; line-height: 1.6em; padding: 10px 20px 0; color: #666;}
.accordion .item p.summary {padding-top: 20px;}

.accordion .item p a {color: #FFF;}
.accordion .item p a:hover {color: #FFFF00;}

.accordion .item p span a {background: #111; color: #666; padding: 2px 6px;}
.accordion .item p span a:hover {background: #666; color: #111;}

.accordion .item p.posted_in {padding: 10px 20px 20px; font-size: 0.7em;}

.accordion .item .topnote {border-top: 1px solid #000; border-bottom: 1px solid #252525; font-size: 0.7em; position: relative; padding: 0 20px; height: 24px; color: #999;}
.accordion .item em {font-style: italic;}
.accordion .item .topnote em {color: #666; margin: 5px 0; line-height: 24px;}

.accordion .item .footnote {border-top: 1px solid #000; background: #080808; font-size: 0.7em; position: relative; padding: 0 20px; height: 24px; color: #666; overflow: hidden;}
.accordion .item em {font-style: italic;}
.accordion .item .footnote em {color: #333; margin: 5px 0; line-height: 24px; overflow: hidden;}

.item_buttons {height: 24px; width: 240px; text-align: right; position: absolute; right: 0; top: 0;}
.item_buttons a {text-indent: -9999px; display: inline-block; height: 24px; line-height: 24px; width: 34px; background-position: center center; background-repeat: no-repeat; text-align: center; vertical-align: middle; border-left: 1px solid #252525; color: #FFF; font-size: 8px; font-weight: bold;}
a.article_sm {background-image: url(images/icons/article_sm.png);}
a.comments_sm {background-image: url(images/icons/comments_sm.png);}
a.video_sm {background-image: url(images/icons/video_sm.png);}
a.photos_sm {background-image: url(images/icons/photos_sm.png);}
a.tweets_sm {background-image: url(images/icons/twitter_sm.png);}
a.delicious_sm {background-image: url(images/icons/delicious_sm.png);}
a.digg_sm {background-image: url(images/icons/digg_sm.png);}
a.vimeo_sm {background-image: url(images/icons/vimeo_sm.png);}
a.youtube_sm {background-image: url(images/icons/youtube_sm.png);}
a.link_sm {background-image: url(images/icons/link_sm.png);}
a.go_sm {background-image: url(images/icons/go_sm.png);}
a.edit_sm {background-image: url(images/icons/edit_sm.png);}
a.fav_sm {background-image: url(images/icons/fav_sm.png);}
a.notes_sm {background-image: url(images/icons/notes_sm.png);}
a.map_sm {background-image: url(images/icons/map_sm.png);}
a.download_sm {background-image: url(images/icons/download_sm.png);}
.item_buttons a:hover {background-color: #111;}

.accordion h3 a span.comments_lg {position: relative; top: -4px; left: 10px; font-weight: bold; font-size: 10px; color: #111; background: transparent url(images/icons/comments_lg.png) no-repeat center center; padding: 4px 12px 8px; text-align: center;}
.accordion h3.selected a span.comments_lg {color: #111;}


.twitter ul.content_block li {color: #666; font-size: 0.8em; line-height: 1.6em; color: #666; margin: 0 -30px; padding: 0 10px;}
.twitter ul.content_block li span a {background: url(images/bg-h3.png) repeat-x; font-size: 0.9em; padding: 20px; color: #CCC; cursor:pointer; display:block; position: relative; border-top: 1px solid #333; border-bottom: 1px solid #111;}
.twitter ul.content_block li span a:hover {color: #FFFF00;}
.twitter ul.content_block li em {}
.twitter ul.content_block li b {font-weight: bold;}


/* COMMENTS
-----------------------------------------------------------------------------*/
#comment_section {padding: 0 20px; margin: 0 auto; background: url(images/bg-body.png);}
#comments {border-bottom: 1px solid #252525; margin: 0; padding: 0 20px 20px;}
#comments h3 {font-size: 0.9em; color: #666; padding: 20px; margin: 0 -20px; display:block; position: relative; border-top: 1px solid #252525; background: url(images/bg-h3.png) repeat-x;}
#comments h3.comment_url {padding: 0; display:inherit; position: relative; border-top: none; background: none;}
#comments h3.comment_url a {padding: 20px; display:block; position: relative; border-top: 1px solid #252525; background: url(images/bg-h3.png) repeat-x;}

#comments h3 em.date {color: #666; font-size: 0.75em; position: absolute; top: 20px; right: 20px;}
#comments h3 span {font-size: 0.7em;}

#comments h3 a {display: block; color: #666;}
#comments h3 a:hover {color: #FFFF00;}
#comments h3 a:hover span {color: #FFF;}
	
#comments .item {margin: 0 -20px; padding: 0 20px 20px; position: relative; border-top: 1px solid #111; clear: both;}
/* #comments .item.author {background: #FFFF00;} */
	
#comments .item p {font-size: 0.8em; line-height: 1.6em; padding: 10px 0 0; color: #666;}
/* #comments .item.author p {color: #252525;} */

p.summary {padding-top: 20px;}

#comments .item p a {color: #FFF;}
/* #comments .item.authos p a {color: #111;} */
#comments .item p a:hover {color: #FFFF00;}
/* #comments .item p.author a:hover {color: #111;} */

#comments .item p span a {background: #111; color: #666; padding: 2px 6px;}
#comments .item p span a:hover {background: #666; color: #111;}

#comments .item p.posted_in {padding: 10px 0 0; font-size: 0.7em;}

#comments .item .topnote {border-top: 1px solid #000000; border-bottom: 1px solid #252525; font-size: 0.7em; margin: 0 -20px; position: relative; padding: 0 20px; height: 24px; color: #999;}
#comments .item em {font-style: italic;}
#comments .item .topnote em {color: #666; margin: 5px 0; line-height: 24px;}

#comments .item .footnote {border-top: 1px solid #000000; background: #080808; font-size: 0.7em; margin: 0 -20px; position: relative; padding: 0 20px; height: 24px; color: #666; overflow: hidden;}
#comments .item em {font-style: italic;}
#comments .item .footnote em {color: #333; margin: 5px 0; line-height: 24px; overflow: hidden;}


/* SECTION
-----------------------------------------------------------------------------*/
.section {border-bottom: 1px solid #252525; margin: 0 auto;}
.section h3 {font-size: 0.9em; color: #CCC; padding: 20px; display:block; position: relative; border-top: 1px solid #252525; background: url(images/bg-h3.png) repeat-x; border-bottom: 1px solid #111;}

.section .item {border-top: 1px solid #111;}
.section .article_media {margin: 0 30px;}
.section .article_caption {margin: 0 30px}

.section h3 em.date {color: #666; font-size: 0.75em; position: absolute; top: 20px; right: 20px;}
.section h3 span {font-size: 0.7em;}

.section h3 a {color: #666;}
.section h3 a:hover {color: #FFFF00;}
.section h3 a:hover span {color: #FFF;}
	
.section .item p {font-size: 0.8em; line-height: 1.6em; padding: 10px 20px 0; color: #666;}
.section .item p.summary {padding-top: 20px;}

blockquote {font-size: 0.7em; line-height: 1.4em; font-style: italic; color: #666; padding: 0 40px; border-left: 1px solid #252525;}

.section .item p a {color: #FFF;}
.section .item p a:hover {color: #FFFF00;}

.section .item p span a {background: #111; color: #666; padding: 2px 6px;}
.section .item p span a:hover {background: #666; color: #111;}

.section .item p.posted_in {padding: 10px 20px 20px; font-size: 0.7em;}

.section .item .topnote {border-top: 1px solid #000000; border-bottom: 1px solid #252525; font-size: 0.7em;  position: relative; padding: 0 20px; height: 24px; color: #999; overflow: hidden;}
.section .item em {font-style: italic;}
.section .item .topnote em {color: #666; margin: 5px 0; line-height: 24px;}

.section .item .footnote {border-top: 1px solid #000000; background: #080808; font-size: 0.7em; position: relative; padding: 0 20px; height: 24px; color: #666; overflow: hidden;}
.section .item em {font-style: italic;}
.section .item .footnote em {color: #333; margin: 5px 0; line-height: 24px; overflow: hidden;}

.section ul {line-height:1.6em; font-size:.8em; color:#666; padding:20px; margin-left:25px;}
.section ul li {list-style:disc;}


#videos .item p.summary {padding: 20px 30px;}

/* DASHBOARD
-----------------------------------------------------------------------------*/
.col {width: 225px; float: left; margin-right: 20px;}
.col.first {width: 225px;}
.col.last {width: 225px; margin-right: 0;}
.col h3 {font-size:1em; font-family: GraublauWeb, Verdana; color:#FFF; padding: 10px;  margin-top: 20px; background: url(images/bg-header.png) repeat-x bottom;}
.col ul {list-style: none; margin:0;}
.col ul li {line-height:1.6em; font-size:.8em; color:#666;}
.col ul li a {display: block; border-bottom: 1px solid #252525; color: #666; padding: 5px 10px;}
.col ul li a:hover {color: #FFFF00; background: #111;}
.col ul.alt li a:hover {color: #000; background: #FFFF00;}

#side_ads {margin-bottom: 10px;}
#side_ads a img {border: 1px solid #252525; padding: 4px; background: #111; margin-top: 10px; display: block; float: left;}
#side_ads a img.odd {margin-right: 10px;}
#side_ads a:hover img {background: #FFFF00;}

#google_map {margin-top: 6px;}
#map_canvas {overflow: hidden;}
#map_canvas #logocontrol, #map_canvas #copyright {display: none; visibility: hidden;}

.col ul li em {font-style: italic; font-size: 0.8em;}

.photos ul.thumbs {margin-bottom: 20px;}

.pagination {text-align: right; font-size: 0.7em;  margin: 0 4px 20px; position: relative; color: #666; border: 1px solid #252525; padding: 5px 0 5px 5px; background: #111; clear: both;}
.pagination span {position: absolute; left:5px;}
.pagination em {font-style: italic;}
.pagination b {color: #FFFF00; background: #111; padding: 4px 5px; font-weight: bold; border-left: 1px solid #252525;}
.pagination a {color: #333; padding: 4px 5px; font-weight: bold; border-left: 1px solid #252525;}
.pagination a:hover {color: #666; padding: 4px 5px;}

body.gallery .pagination {margin: 0 30px 20px 20px;}


/* FLICKR
-----------------------------------------------------------------------------*/
#flickr {
padding:0 0 0 24px;
margin-top:40px;
clear: both;
}

#flickr a:hover img {background: #FFFF00;}

ul.thumbs {
	cursor: default;
	list-style: none;	
	padding:0;
	clear: both;
	}	
ul.thumbs li {
	color: inherit;
	display: inline;
	float: left;
	margin: 0 4px 8px;
	padding: 8px;
	line-height: 0.5em;
	position: relative;
	background: #111 url(images/throbber.gif) no-repeat center center !important;
	}
body#page_home ul.thumbs li {margin:0 0 8px 8px; padding:1px;}
ul.thumbs li img {height: 80px;	width: 80px;}
body#page_home ul.thumbs li img {width:60px; height: 60px;}

/* FLICKR
-----------------------------------------------------------------------------*/
#flickr_strip {
padding-left:2px;
margin-top: -230px;
clear: both;
background: url(images/bg_dot.png) repeat-x bottom left;
}

#flickr_strip a:hover img {background: #FFFF00;}

#flickr_strip ul.thumbs {
	cursor: default;
	list-style: none;	
	padding:0;
	clear: both;
	}	
#flickr_strip ul.thumbs li {
	color: inherit;
	display: inline;
	float: left;
	margin: 0 4px 8px;
	padding: 8px;
	line-height: 0.5em;
	position: relative;
	background: #111 url(images/throbber.gif) no-repeat center center !important;
	}
body#page_home #flickr_strip ul.thumbs li {margin:0 0 8px 8px; padding:5px;}
#flickr_strip ul.thumbs li img {height: 80px;	width: 80px;}
body#page_home #flickr_strip ul.thumbs li img {width:60px; height: 60px;}


/* TOOLBAR
-----------------------------------------------------------------------------*/
.replace {font-size:0; text-indent:-9999px;}

#toolbar {background:url(images/toolbar/bg-bar.png) repeat-x; padding:6px 0 0 0; /*height:31px;*/ height:37px; position: relative;}
#toolbar ul {list-style:none; margin:0 auto; width:98px; height:24px;}
#toolbar ul li {float:left; margin:0 0 0 13px; width:24px; height:24px;}
#toolbar ul li a {display:block; width:24px; height:24px;}
#toolbar ul li.first {margin:0;}

#slide {display:none; position:absolute; left:50%; top:5px; margin:0 0 0 -279px; width:558px;}
#slide .toolbar_top {background:url(images/toolbar/bg-info-top.png) no-repeat; padding:0 13px; height:51px;}
#slide .toolbar_top h2 {font:normal 13pt "trebuchet ms", arial, sans-serif; color:#333; padding:20px 0 0;}
#slide .toolbar_top .toolbar_close {background:url(images/icons/close.png) no-repeat; position:absolute; right:13px; top:20px; width:16px; height:16px;}
#slide .toolbar_content {background:url(images/toolbar/bg-info.png) repeat-y; padding:0 13px 0; height:auto;}
#slide .toolbar_bottom {font-size:0; background:url(images/toolbar/bg-info-bottom.png) no-repeat; height:15px;}



#comment_section {border-bottom: 1px solid #252525; margin: 0; padding: 0 20px;}
#comment_section h3 {font-size: 0.9em; color: #666; padding: 20px; margin: 0 -20px; display:block; position: relative; border-top: 1px solid #252525; background: url(images/bg-h3.png) repeat-x;}
#comment_section p {font-size: 0.8em; line-height: 1.6em; padding: 10px 0 0; color: #666;}
#comment_section p label {color: #666;}
#comment_section .txt {background: #111; border: 1px solid #252525; color: #999; padding: 4px;}

#login_status {position: absolute; top: 51px; right: 0; font-size: 0.7em; line-height: 1.6em; padding: 8px 10px 8px 40px; color: #666; background: url(images/login_status.png) no-repeat bottom left;}
body#page_home #login_status {top: -70px; z-index: 200; background-image: url(images/login_status_home.png);}

#login_status a {color: #999;}
#login_status a:hover {color: #FFFF00;}
body#page_home #wrap #login {position: relative; top: 280px; left: 70px; font-size: 0.7em; line-height: 1.6em; color: #FFF;}
#login a {color: #FFFF00;}
#login input {padding: 10px; font-size: 1.8em;}

.photos, .photoset, .video, .twitter, .map {margin: 0 30px;}
body#page_photos .photos {margin: 0;}

#comments .item p.count {font-size: 4em; color: #252525; float: right; margin: 0; padding: 0; position: relative; top: -10px; right: -10px;}

.recent_posts {padding-top:10px;}
#sub .recent_posts h3 {border: none; color: #FFFF00; margin-left: 10px;}
.recent_posts ul {margin-right: 10px; margin-top: 10px;}
.recent_posts ul li {font-size:11px;}
.recent_posts ul li a {color: #FFF; padding: 5px 10px;display: block; background: url(images/bg_dot.png) repeat-x bottom left;}
.recent_posts ul li a em {color: #333; display: block;}
.recent_posts ul li a span {color: #666; display: block;}
.recent_posts ul li a:hover {background-color: #111;}

.recent_links {padding-top:10px;}
#extra .recent_links h3 {border: none; color: #FFFF00; margin-left: 10px;}
.recent_links ul {margin-left: 10px; margin-top: 10px;}
.recent_links ul li {font-size:11px;}
.recent_links ul li a {color: #FFF; padding: 5px 10px;display: block; background: url(images/bg_dot.png) repeat-x bottom left;}
.recent_links ul li a em {color: #333; display: block;}
.recent_links ul li a span {color: #666; display: block;}
.recent_links ul li a:hover {background-color: #111;}