/* RESET CSS */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6,
p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn,
em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt,
var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
/* remember to define focus styles! */
:focus { outline: 0; }
/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
/* DIALOGUE CAFÉ CSS Document */
body { background: #e7e8e4 url(../imgs/bg_body.gif) left top repeat-x; color: #312d1c; font: normal 13px arial; }
a { color: #49abb2; text-decoration: none; }
a:hover { text-decoration: underline; }
input.text { border: 0; padding: 0 0 0 2px; vertical-align: middle; font-size: 14px; color: #59574c; height: 20px; background: transparent;}
textarea{ border: 0; padding: 0 0 0 2px; vertical-align: middle; font: normal 14px arial; color: #59574c; background: transparent; }
h1 { font-size: 24px; letter-spacing: -0.05em; line-height: 24px; margin-bottom: 5px; text-align: left;}
h1 a { color: #ef5f00;}
h2 { font-size: 18px; letter-spacing: -0.05em; line-height: 18px; color: #312d1c; margin: 0}
h3 { font-size: 16px; letter-spacing: -0.05em; line-height: 18px; color: #96998e; margin: 10px 0 0 0}
h3 a { color: #ef5f00;}
#master { position: relative; width: 970px; margin: 0 auto;}
#postsArea { position: relative; float: left; width: 730px; background: url(../imgs/bg_post_end.gif) right bottom no-repeat; padding-bottom: 44px }
#header { width: 705px; height: 210px; padding-left: 25px; background: url(../imgs/bg_post_top.gif) right top no-repeat }
#header img { margin: 35px 0 0 10px; }
#posts { float: left; width: 670px; padding: 0 35px 0 25px; background: url(../imgs/bg_post.gif) right top repeat-y}
#posts.noExtras { }
.noExtras { padding-right: 0}
#extras { float: right; width: 235px; margin-top: 20px; margin-right: 5px;clear: right;}
#extrasB { float: right; width: 235px; margin-left: 5px;}
#extrasB a { font-weight: bold}
#label { position: absolute; right: 10px; top: 55px; width: 185px; height: 160px; }
.weblink_img { margin: 10px 0 0 5px;}
#footer { position: relative; float: left; width: 900px; padding: 15px 0 }
#footer img { margin-right: 45px; float: left}
#footer .ol { float: right;}
#footer .ol img { margin-right: 0}
/* POST */
.post { position: relative; float: left; /*width: 420px;*/ margin: 20px 0 0 10px; line-height: 18px; text-align: justify}
.noExtras .post { width: 630px}
.post p { margin: 15px 0 0 0;}
.date { position: absolute; left: -82px; top: 0; width: 45px; height: 45px; padding: 5px 0 0 5px; background: url(../imgs/bg_date.gif) top right no-repeat; color: #f9f5dd; text-align: center; font-size: 14px; font-weight: bold; letter-spacing: -0.05em; }
.date p { font-size: 22px; line-height: 16px; margin: 0; text-align: center }
.tags { font-size: 10px; color: #49abb2; margin-top: 5px; text-align: left;}
.tags span { color: #ef5f00 ;}
.comments { position: relative; margin-left: 3px; top: -3px; display: inline-block; color: #fff; width: 26px; height: 22px; /*padding-left: 5px;*/ background: url(../imgs/bg_comments.gif) left top no-repeat; font-size: 14px; line-height: 20px; text-align: center }
.comments a { color: #fff}
/* NAVIGATION */
.nav { position: relative; float: left; width: 430px; margin: 30px 0 10px 0}
.nav a, .older a { font-size: 16px; font-weight: bold; letter-spacing: -0.05em; display: inline-block; padding-bottom: 10px;}
.nav .older {padding-left: 10px; margin-right: 10px;}
.nav .older a{background: url(../imgs/arrow_older.gif) left bottom no-repeat;padding-left: 10px;margin-left: -11px;}
.nav .newer {padding-right: 15px; margin-left: 10px}
.nav .newer a{ background: url(../imgs/arrow_newer.gif) right bottom no-repeat; padding-right: 15px; margin-left: 10px}
/* WIDGET */
#extrasB .widget { padding-left: 3px;}
.widget { padding: 10px 0 20px 0; color: #585548; }
.widget p { margin: 5px 0 10px 0}
.widget p span { font-size: 10px}
.widget p a span{ font-weight: normal}
ul.list { margin: 5px 0 0 0;}
ul.list li { margin: 6px 0; font-weight: bold}
ul.list li.icon a { display: inline-block; height: 22px; padding: 2px 0 0 30px;}
ul.flickr { float: left; width: 100%; clear: both; margin-bottom: 25px; margin-top: 5px}
ul.flickr li { float: left; display: inline; margin: 0; display: inline-block; padding: 3px 3px 0 0; }
ul.flickr li img { display: inline-block; width: 70px; height:70px }
.smallTag,.rank-3 { font-size: 11px; font-weight: bold; line-height: 23px;}
.mediumTag,.rank-2 { font-size: 13px; font-weight: bold; line-height: 23px; letter-spacing: -0.02em}
.largeTag,.rank-1 { font-size: 24px; font-weight: bold; line-height: 23px; letter-spacing: -0.05em}
.intro { margin: 30px 0 50px 0}
.intro p { margin: 5px 0 0 5px; }
.video { margin-top: 5px;}
.social_youtbe { background: url(../imgs/icon_youtube.gif) left top no-repeat; }
.social_twitter { background: url(../imgs/icon_twitter.gif) left top no-repeat;}
.social_facebook { background: url(../imgs/icon_facebook.gif) left top no-repeat;}
.social_flickr { background: url(../imgs/icon_flickr.gif) left top no-repeat;}
.social_slideshare { background: url(../imgs/icon_slideshare.gif) left top no-repeat;}
.social_vimeo { background: url(../imgs/icon_vimeo.gif) left top no-repeat;}
.fedd_rss { background: url(../imgs/icon_rss.gif) left top no-repeat;}
.fedd_mail { background: url(../imgs/icon_mail.gif) left top no-repeat;}
/* COMMENTS */
.commentForm, .commentList { position: relative; float: left; width: 420px; margin: 20px 0 0 10px; line-height: 18px; text-align: justify}
.commentList { width: 630px;}
.form { display: block; margin: 6px 0 2px 0; }
.form input.text { margin: 3px 15px 0 3px; width: 230px;}
.form textarea { margin: 3px 15px 0 3px; width: 405px; max-width: 405px; min-width: 405px; height: 140px; max-height: 140px; min-height: 140px;}
.form label { font-size: 14px; font-weight: bold; color: #59574c;}
.form240 { background: url(../imgs/form_240px.gif) left top no-repeat; height: 29px; }
.form240.error { background: url(../imgs/form_240px_error.gif) left top no-repeat; height: 29px; }
.form415 { background: url(../imgs/form_415px_textarea.gif) left top no-repeat; height: 150px }
.form415.error { background: url(../imgs/form_415px_textarea_error.gif) left top no-repeat; height: 150px }
.errorMsg {display:none;position: absolute;left: 0;bottom: 11px;font-size: 18px;letter-spacing: -1px;font-weight: bold;color: #333;}
.error label input,.error label textarea{color: #fff;}
.note { display: inline-block; float: left; font-size: 9px; color: #6c643d;}
.btn { display: inline-block; float: right; padding-top: 5px;}
/* comment list */
.commentList p { text-align: justify; font-size: 12px; line-height: 16px; color: #4a473a}
.comment_date { font-size: 11px!important; color: #96998e !important; padding-bottom:15px }
.flickr_badge_image {margin:0px 3px 3px 0px;float:left;}
.flickr_badge_image img {width:70px;height:70px}
.clearflickr{
clear:left;
margin-top:25px;
}