/* Theme Name: SpinSixBlog Theme URI: http://blog.spinsix.com Description: Theme for SpinSix Strategic Marketing Design. Version: 2.0 Author: SpinSix Author URI: http://www.spinsix.com/ /* -------------------------------------------------------------- Both the reset.css and the typography.css files are already included in the framework. -------------------------------------------------------------- */ header, footer, section, article, aside, nav {display: block;} html {background: #231203 url(ui/images/wood-background.jpg) no-repeat 50% 0; overflow-x: hidden; min-width: 970px;} body {background-color: transparent; color: #b9b9b9; margin: 0 auto; padding-top: 287px; width: 960px;} input[type=text], input[type=password], input.text, input.title, textarea, select { background-color:#fff; border:1px solid #bbb; } input[type=text]:focus, input[type=password]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus { border-color:#666; } input[type=text], input[type=password], input.text, input.title, textarea, select { margin: 0; } button {background-color: #e57b1f; border-width: 0; color: #fff; cursor: pointer; font-size: 1.0em; font-family: Arial, "Helvetica Neue", Helvetica, Verdana, sans-serif; padding: 5px 7px;} .form-field {overflow: hidden;} /* Main Layout -------------------------------------------------------------- */ body>header {height: 236px; left: 0; position: absolute; top: 0; width: 100%;} #wrapper>section {float: left; width: 620px;} #wrapper>aside {border: solid 1px rgba(0,0,0,0.5); margin-left: 650px; padding: 1px; width: 310px;} #wrapper>footer {clear: left;} h1, h2, h3, h4 {color: #058daa; font-family: "Book Antiqua", Palatino, Georgia, serif; text-transform: uppercase;} h1 a, h2 a, h3 a, h4 a {color: #058daa; text-decoration: none;} /* Header -------------------------------------------------------------- */ body>header .title {background: url(ui/images/logo-the-spin.png) no-repeat 0 0; height: 195px; left: 50%; margin: 0 0 0 -434px; position: absolute; text-indent: -8000px; top: 32px; width: 266px; z-index: 60;} body>header .title a {display: block; height: 195px; width: 266px;} body>header section {height: 75px; left: 50%; margin: 0 0 0 236px; position: absolute; top: 6px; width: 150px; z-index: 50;} body>header section ol {margin-bottom: 7px; overflow: hidden; padding-left: 16px;} body>header section ol li {float: left; margin-right: 5px;} body>header section ol li a {background: url(ui/images/bg-icons.gif) no-repeat 0 0; display: block; height: 33px; text-indent: -8000px; width: 33px;} body>header section ol li a.rss {background-position: 0 0;} body>header section ol li a:hover.rss {background-position: 0 -33px;} body>header section ol li a.facebook {background-position: -38px 0;} body>header section ol li a:hover.facebook {background-position: -38px -33px;} body>header section ol li a.twitter {background-position: -76px 0;} body>header section ol li a:hover.twitter {background-position: -76px -33px;} body>header section form[id*=searchform-] label {display: none;} form[id*=searchform-] label {} form[id*=searchform-] .form-field {background: transparent url(ui/images/bg-search-box-button.gif) no-repeat 0 0; padding: 5px 0 5px 8px;} form[id*=searchform-] input {background-color: transparent; border-width: 0; color: #403a82; float: left; height: 20px; margin-right: 3px; width: 108px;} form[id*=searchform-] button {background: transparent url(ui/images/bg-search-box-button.gif) no-repeat 0 -40px; border-width: 0; cursor: pointer; float: left; height: 15px; margin-top: 3px; padding: 0; text-indent: -8000px; width: 15px;} /* Splash -------------------------------------------------------------- */ #splash {height: 236px; left: 0; position: absolute; top: 0; width: 100%;} #items-on-desk {height: 236px; margin: 0 auto; position: relative; width: 960px;} #phone {background: url(ui/images/desk-objects-phone.png) no-repeat 0 0; height: 436px; left: -256px; position: absolute; text-indent: -8000px; top: -60px; width: 221px; z-index: 16;} #toy {background: url(ui/images/desk-objects-toy-homer.png) no-repeat 0 0; height: 101px; left: -43px; position: absolute; text-indent: -8000px; top: 3px; width: 70px; z-index: 15;} #keyboard {background: url(ui/images/desk-objects-aluminum-wired-keyboard.png) no-repeat 0 0; height: 305px; left: 14px; position: absolute; text-indent: -8000px; top: -71px; width: 684px; z-index: 14;} #card {background: url(ui/images/desk-objects-business-card.png) no-repeat 0 0; height: 102px; left: 487px; position: absolute; text-indent: -8000px; top: -11px; width: 153px; z-index: 13;} #mouse {background: url(ui/images/desk-objects-magic-mouse.png) no-repeat 0 0; height: 174px; left: 722px; position: absolute; text-indent: -8000px; top: 80px; width: 106px; z-index: 12;} #mug {background: url(ui/images/desk-objects-coffee-mug.png) no-repeat 0 0; height: 217px; right: -120px; position: absolute; text-indent: -8000px; top: -80px; width: 223px; z-index: 13;} #paper {background: url(ui/images/desk-objects-stack-of-paper.png) no-repeat 0 0; height: 441px; right: -54px; position: absolute; text-indent: -8000px; top: -318px; width: 350px; z-index: 11;} #desk {background: url(ui/images/glass-desk.png) repeat-x 0 0; height: 236px; left: 0; position: absolute; text-indent: -8000px; top: 0; width: 100%; z-index: 9;} #trash-can {background: url(ui/images/desk-objects-trash-can.png) no-repeat 0 0; height: 304px; right: -199px; position: absolute; text-indent: -8000px; top: 2px; width: 304px; z-index: 1;} .ui-draggable {cursor: pointer;} .ui-draggable:hover {opacity: 0.90;} .ui-draggable-dragging {cursor: pointer; opacity: 0.85;} .poof {background: url(ui/images/poof.png) no-repeat 0 0; display: none; height: 128px; position: absolute; width: 128px; z-index: 900;} /* Page Layout -------------------------------------------------------------- */ #wrapper>aside>section {background-color: rgba(0,0,0,0.3); padding: 38px 18px 0;} article[id*=post-] header+section {padding: 1px 18px 45px;} .single article[id*=post-] header+section {padding-bottom: 30px;} /* Posts -------------------------------------------------------------- */ article[id*=post-] {border: solid 1px rgba(0,0,0,0.5); margin-bottom: 25px; padding: 1px;} article[id*=post-] header, article[id*=post-] header+section, article[id*=post-] #comments, article[id*=post-] #respond {background-color: rgba(0,0,0,0.3);} article[id*=post-] header {overflow: hidden; padding: 28px 18px 18px;} article[id*=post-] header {} article[id*=post-] header img.attachment-post-thumbnail {border: solid 1px rgba(255,255,255,0.25); float: left; margin-right: 20px; padding: 1px;} article[id*=post-] header h2, article[id*=post-] header h1 {margin-bottom: 8px; padding-top: 5px;} article[id*=post-] header p {font-size: 0.85em; margin-bottom: 0;} article[id*=post-] header h1 {font-size: 1.7em; line-height: 1.2;} article[id*=post-] section nav ul {overflow: hidden;} article[id*=post-] section nav ul li {float: left;} article[id*=post-] section nav ul li.last {border-left: solid 1px #fff; margin-left: 10px; padding-left: 9px;} nav.page-nav {border: solid 1px rgba(0,0,0,0.5); padding: 1px;} nav.page-nav .wp-pagenavi {background-color: rgba(0,0,0,0.3); font-size: 0.875em; font-weight: bold; overflow: hidden; padding: 5px 18px; text-align: right;} nav.page-nav .wp-pagenavi span.pages {float: left; font-style: italic; font-weight: normal; margin: 0;} nav.page-nav .wp-pagenavi span.current, nav.page-nav .wp-pagenavi a {margin: 0 8px;} nav.page-nav .wp-pagenavi a.nextpostslink {margin-right: 0;} nav.page-nav .wp-pagenavi a.previouspostslink, nav.page-nav .wp-pagenavi a.nextpostslink {font-size: 1.25em; text-decoration: none;} nav.page-nav .wp-pagenavi a:hover.previouspostslink, nav.page-nav .wp-pagenavi a:hover.nextpostslink {text-decoration: none;} /* Widgets -------------------------------------------------------------- */ #wrapper>aside h3 {font-size: 1.075em; margin-bottom: 11px;} #wrapper>aside>section {overflow: hidden;} #wrapper>aside>section section {margin-bottom: 35px;} #wrapper>aside a {text-decoration: none;} #wrapper>aside a:hover {text-decoration: underline;} section.spinsix {} section.spinsix .highlight {margin-bottom: 3px; overflow: hidden;} section.spinsix .highlight img {border: solid 1px rgba(255,255,255,0.25); margin-right: 12px; margin-bottom: 8px; padding: 1px;} section.spinsix p {margin-bottom: 10px;} #wrapper>aside section p, body>aside section ul {font-size: 0.925em; line-height: 1.35;} section.widget_twitter {} section.widget_twitter ul li {margin-bottom: 10px;} section.widget_twitter .twitter-timestamp {display: block;} section.widget_twitter .twitter-timestamp abbr {border-bottom-width: 0; color: #E57B1F;} section.widget_categories, section.widget_archive {float: left; width: 145px;} section.widget_categories {margin-right: 10px;} section.widget_archive {width: 118px;} /* Comments -------------------------------------------------------------- */ #comments, #respond {border-top: solid 1px rgba(0,0,0,0.4); padding: 25px 18px 10px;} .comment-list {} .comment {overflow: hidden; padding-bottom: 20px;} .comment .avatar-link, .comment .comment-permalink {display: none;} .comment .comment-author, .comment .comment-meta {float: left; width: 115px;} .comment .comment-meta {clear: left; font-size: 0.85em;} .comment .comment-meta abbr {border-bottom-width: 0;} .comment .comment-content {margin-left: 130px;} .comment .comment-content p:last-child {margin-bottom: 0;} #comment-form {} #comment-form .form-section {margin-bottom: 12px; overflow: hidden;} #comment-form label {display: block; margin-bottom: 1px;} #comment-form label span {font-size: 0.85em;} #comment-form .form-section input {font-size: 0.9em; width: 230px;} #comment-form .form-section textarea {font-family: Arial, "Helvetica Neue", Helvetica, Verdana, sans-serif; font-size: 0.95em; height: 145px; width: 475px;} #comment-form .form-section input, #comment-form .form-section textarea {background-color: rgba(0,0,0,0.5); border-color: rgba(229,123,31,0.5); color: #fff; padding: 3px 5px;} /* Footer -------------------------------------------------------------- */ #wrapper>footer {font-size: 0.80em; line-height: 1.5; padding: 30px 0; width: 620px;} #wrapper>footer p {margin-bottom: 0;} #wrapper>footer a {color: #B9B9B9;} #wrapper>footer a:hover {color: #E57B1F;} .stbutton {background: url(ui/images/icon-sharethis.png) no-repeat 0 0 !important; padding-left: 18px !important;} .stbuttontext {line-height: 1.15 !important;} /* WordPress default styles -------------------------------------------------------------- */ .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; /* optional rounded corners for browsers that support it */ -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } /* Comment list styles -------------------------------------------------------------- */ ol.comment-list {} ol.comment-list li {} ol.comment-list li.alt {} ol.comment-list li.bypostauthor {} ol.comment-list li.byuser {} ol.comment-list li.comment-author-admin {} ol.comment-list li.comment {} ol.comment-list li.comment div.comment-author {} ol.comment-list li.comment div.vcard {} ol.comment-list li.comment div.vcard cite.fn {} ol.comment-list li.comment div.vcard cite.fn a.url {} ol.comment-list li.comment div.vcard img.avatar {} ol.comment-list li.comment div.vcard img.avatar-32 {} ol.comment-list li.comment div.vcard img.photo {} ol.comment-list li.comment div.vcard span.says {} ol.comment-list li.comment div.commentmetadata {} ol.comment-list li.comment div.comment-meta {} ol.comment-list li.comment div.comment-meta .comment-date {} ol.comment-list li.comment div.comment-meta .comment-time {} ol.comment-list li.comment div.comment-meta a {} ol.comment-list li.comment div.comment-content {} ol.comment-list li.comment div.comment-reply {} ol.comment-list li.comment div.comment-reply a {} ol.comment-list li.comment ul.children {} ol.comment-list li.comment ul.children li {} ol.comment-list li.comment ul.children li.alt {} ol.comment-list li.comment ul.children li.bypostauthor {} ol.comment-list li.comment ul.children li.byuser {} ol.comment-list li.comment ul.children li.comment {} ol.comment-list li.comment ul.children li.comment-author-admin {} ol.comment-list li.comment ul.children li.depth-2 {} ol.comment-list li.comment ul.children li.depth-3 {} ol.comment-list li.comment ul.children li.depth-4 {} ol.comment-list li.comment ul.children li.depth-5 {} ol.comment-list li.comment ul.children li.odd {} ol.comment-list li.even {} ol.comment-list li.odd {} ol.comment-list li.parent {} ol.pings-list li.pingback {} ol.pings-list li.pingback div.comment-author {} ol.pings-list li.pingback div.vcard {} ol.pings-list li.pingback div.vcard cite.fn {} ol.pings-list li.pingback div.vcard cite.fn a.url {} ol.pings-list li.pingback div.vcard span.says {} ol.pings-list li.pingback div.commentmetadata {} ol.pings-list li.pingback div.comment-meta {} ol.pings-list li.pingback div.comment-meta .comment-date {} ol.pings-list li.pingback div.comment-meta .comment-time {} ol.pings-list li.pingback div.comment-meta a {} ol.pings-list li.pingback div.comment-reply {} ol.pings-list li.pingback div.comment-reply a {} ol.pings-list li.pingback ul.children {} ol.pings-list li.pingback ul.children li {} ol.pings-list li.pingback ul.children li.alt {} ol.pings-list li.pingback ul.children li.bypostauthor {} ol.pings-list li.pingback ul.children li.byuser {} ol.pings-list li.pingback ul.children li.comment {} ol.pings-list li.pingback ul.children li.comment-author-admin {} ol.pings-list li.pingback ul.children li.depth-2 {} ol.pings-list li.pingback ul.children li.depth-3 {} ol.pings-list li.pingback ul.children li.depth-4 {} ol.pings-list li.pingback ul.children li.depth-5 {} ol.pings-list li.pingback ul.children li.odd {} ol.pings-list li.thread-alt {} ol.pings-list li.thread-even {} ol.pings-list li.thread-odd {}