/* Theme Name: Highlight Theme URI: http://www.shakenandstirredweb.com/theme/highlight Version: 1.0.1 Author: Shaken and Stirred Author URI: http://www.shakenandstirredweb.com --------- DO NOT EDIT THIS FILE. If you need to overwrite the CSS styling, create a new custom.css in the theme folder and it will automatically load in the . */ /* ********************************************************** HTML5 ✰ Boilerplate - CSS Reset ********************************************************** */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block } blockquote, q { quotes: none } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } ins { background-color: #ff9; color: #000; text-decoration: none; } mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } del { text-decoration: line-through } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; } table { border-collapse: collapse; border-spacing: 0; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } input, select { vertical-align: middle } body { font: 13px/1.231 sans-serif; *font-size: small; } select, input, textarea, button { font: 99% sans-serif } pre, code, kbd, samp { font-family: monospace, sans-serif } html { overflow-y: scroll } ul, ol { margin-left: 2em } ol { list-style-type: decimal } nav ul, nav li { margin: 0; list-style: none; list-style-image: none; } small { font-size: 85% } strong, th { font-weight: bold } td { vertical-align: top } sub, sup { font-size: 75%; line-height: 0; position: relative; } sup { top: -0.5em } sub { bottom: -0.25em } pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; } textarea { overflow: auto } .ie6 legend, .ie7 legend { margin-left: -7px } input[type="radio"] { vertical-align: text-bottom } input[type="checkbox"] { vertical-align: bottom } .ie7 input[type="checkbox"] { vertical-align: baseline } .ie6 input { vertical-align: text-bottom } label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer } button, input, select, textarea { margin: 0 } input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; } .no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd } ::-moz-selection { text-shadow: none } ::selection { text-shadow: none } a:link { -webkit-tap-highlight-color: #000 } button { width: auto; overflow: visible; } .ie7 img { -ms-interpolation-mode: bicubic } body, select, input, textarea { color: #111 } h1, h2, h3, h4, h5, h6 { font-weight: bold } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both } .clearfix { zoom: 1 } /* ********************************************************** START: Actual Styles ********************************************************** */ body { /*background: url(images/white-noise.png) repeat;*/ font-family: "Courier New", Courier, monospace; font-size: 12px; line-height: 1.35; padding: 30px 0 0 30px; color: #1a1a1a; } /* ********************************************************** Typography ********************************************************** */ a { color: #000; font-weight: bold; text-decoration: none; } /* Secondary Font Stack */ h1, h2, h3, h4, h5, footer, .comment-count, #site-title, .tipsy, input, .pullquote, .author-name, label, .post-shaken-navigation, .post-info p, .wp-caption, #disqus_thread, .gform_wrapper textarea, .gform_wrapper[type="text"] { font-family: Helvetica, Arial, sans-serif } h1, h2, h3, h4, h5 { margin-bottom: 1em; color: #000; } h1 { font-size: 30px; margin-bottom: 20px; } h2 { font-size: 24px; margin-bottom: 20px; } h3 { font-size: 20px; margin-bottom: 15px; } h4 { font-size: 16px; margin-bottom: 15px; } h5 { font-size: 14px; margin-bottom: 15px; } p, ul, ol { margin-bottom: 1.5em } ul li { list-style-image: url(images/plus-ic.png); line-height: 1.5; } #page li { margin-bottom: 7px } blockquote { background: url(images/double-stripe-vert.png) left top repeat-y; padding-left: 15px; margin: 10px 30px 20px; font-size: 16px; font-style: italic; } .entry blockquote p { font-size: 16px } .widget blockquote { font-size: 14px; margin: 10px 0 10px 10px; } cite { display: block; margin: -5px 0 20px 30px; } .widget cite { margin: 10px 0 5px; color: #444; font-size: 11px; } cite.testimonial-widget { margin: 10px 0 0 15px } .pullquote { width: 180px; padding: 10px; margin: 10px; text-align: center; font-size: 14px; font-weight: bold; } hr { border-top: 1px dotted #999; border-width: 1px 0px 0px; -moz-border-image: url(images/dotted-border.png) 1 0 0 repeat; -webkit-border-image: url(images/dotted-border.png) 1 0 0 repeat; -o-border-image: url(images/dotted-border.png) 1 0 0 repeat; border-image: url(images/dotted-border.png) 1 0 0 repeat; margin: 1.5em 30px; float: none; clear: both; } /* Emphasis Block */ ::-moz-selection { background-color: #999; color: #111; } ::selection { background-color: #999; color: #111; } a:hover, nav li ul, .reply a, #cboxCurrent, .highlighted, input[type="submit"], .blocks-list a, .block:hover h2, #cancel-comment-reply-link, .post footer a:hover, .pullquote, article header h1 a, .comment-count, .shaken_page_current span, #logo a:hover #site-title { /*background-color: #ffde42; color: #111;*/ } /* Emphasis Block :: Alternate */ .blocks-list a:hover, article header h1 a:hover, .comment-count:hover, .reply a:hover, #cancel-comment-reply-link:hover, input[type="submit"]:hover { background-color: #000; color: #fff; } /* ********************************************************** Construction Elements ********************************************************** */ .infinite { width: 40000px; position: relative; } #page { width: 790px; float: left; margin-bottom: 40px; } #page.slim { width: 600px } .tipsy { padding: 5px; font-size: 10px; opacity: 0.8; background-repeat: no-repeat; background-image: url(../images/tipsy.gif); background-position: bottom center; } .tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; } .tipsy-inner { -moz-border-radius: 3px; -webkit-border-radius: 3px; } .tipsy-north { background-position: top center } .tipsy-south { background-position: bottom center } .tipsy-east { background-position: right center } .tipsy-west { background-position: left center } /* ********************************************************** Horizontal Slider ********************************************************** */ #spread{ position: relative; float: left; } #spread .block { float: left; display: inline; margin-right: 15px; position: relative; cursor: pointer; text-align: center; } #spread .block h2 { -webkit-transition: opacity 450ms ease; -moz-transition: opacity 450ms ease; transition: opacity 450ms ease; /*font-family: "Courier New", Courier, monospace;*/ font-size: 12px; font-weight: normal; display: inline; padding: 2px 5px; } #spread .block a, #spread .block a:hover { text-decoration: none } #spread img { max-height: 550px; display: block; margin-bottom: 10px; } #slide-next, #slide-prev, #slide-home { -webkit-transition: opacity 300ms ease; -moz-transition: opacity 300ms ease; transition: opacity 300ms ease; background-color: #1a1a1a; background-position: center center; background-repeat: no-repeat; height: 580px; width: 45px; position: fixed; top: 15px; text-decoration: none; text-indent: -9999px; opacity: 0.85; } #slide-home { background-image: url(images/home-icon.png); background-color: transparent; left: 15px; top:530px; height: 50px; display: none; } #slide-next:hover, #slide-prev:hover { opacity: 0.95 } #slide-next { background-image: url(images/right-ar.png); right: 15px; } #slide-next:before { content: "\00a0"; display: block; position: absolute; bottom: 0; left: -15px; width: 0; height: 0; border-top: 15px solid #000; border-left: 15px solid transparent; z-index: 0; } #slide-next:after { content: "\00a0"; display: block; position: absolute; top: 0; left: -15px; width: 0; height: 0; border-bottom: 15px solid #000; border-left: 15px solid transparent; z-index: 0; } #slide-prev { left: 15px; display: none; background-image: url(images/left-ar.png); } #slide-prev:before { content: "\00a0"; display: block; position: absolute; bottom: 0; right: -15px; width: 0; height: 0; border-top: 15px solid #000; border-right: 15px solid transparent; z-index: 0; } #slide-prev:after { content: "\00a0"; display: block; position: absolute; top: 0; right: -15px; width: 0; height: 0; border-bottom: 15px solid #000; border-right: 15px solid transparent; z-index: 0; } #info-block { width: 420px; padding: 20px; min-height: 510px; border: 1px solid #c6c6c6; position: relative; cursor: default; text-align: center; } #blocks-nav { position: fixed; bottom: 30px; left: 30px; } .block-img { position: relative; cursor: pointer; } .link-ic, .enlarge-ic { -webkit-background-clip: padding-box; -moz-background-clip: padding-box; background-clip: padding-box; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; display: block; opacity: 0; position: absolute; right: 15px; bottom: 15px; width: 25px; height: 25px; text-indent: -9999px; } .link-ic { background: url(images/link.png) center center no-repeat #ffffff } .enlarge-ic { background: url(images/enlarge.png) center center no-repeat #ffffff } .block:hover .link-ic, .block:hover .enlarge-ic { opacity: 1 } /* ********************************************************** Header/Sidebar ********************************************************** */ #logo a { display: block } #logo a:hover { background: none } #logo { background: url(images/stripes-border.png) bottom repeat-x; padding-bottom: 15px; margin-bottom: 15px; } #logo img { text-align: center } #logo p { font-size: 11px; color: #6f6f6f; text-align:center; font-style:italic; } #logo #site-title { font-size: 20px; margin-bottom: 5px; display: inline-block; } #sidebar { width: 210px; margin-right: 60px; float: left; } #sidebar h2 { font-size: 14px; margin-bottom: 10px; } #sidebar p:last-child, #sidebar ul:last-child { margin-bottom: 0 } #sidebar footer { border-top: 1px solid #ccc; padding-top: 10px; color: #6f6f6f; font-size: 10px; margin-bottom: 60px; } .widget { margin-bottom: 25px } .widgetul:last-child { margin-bottom: 0 } .widget ul { margin-left: 20px } .widget li { margin: 0 0 8px; padding-bottom: 8px; border-bottom: 1px dotted #999; border-width: 0px 0px 1px; -moz-border-image: url(images/dotted-border.png) 0 0 1 repeat; -webkit-border-image: url(images/dotted-border.png) 0 0 1 repeat; -o-border-image: url(images/dotted-border.png) 0 0 1 repeat; border-image: url(images/dotted-border.png) 0 0 1 repeat; } .widget li:last-child { border-bottom: none 0 } .blocks-list, .widget .blocks-list { margin: 0 } .blocks-list li, .widget .blocks-list li { list-style: none; display: inline; margin: 0; } .blocks-list a, .widget .blocks-list a { -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; display: inline-block; padding: 5px; margin: 0 0 5px 0; text-decoration: none; font-weight: normal; } .widget .tweetList { margin: 0 } .widget .tweetList li { list-style: none; list-style-image: none; margin: 0 0 15px 10px; padding: 0 0 0 10px; background: url(images/double-stripe-vert.png) left repeat-y; border-bottom: none 0; } .widget .tweetList li p { margin-bottom: 0 } .last { margin-right: 0 } .social-links { margin-bottom: 10px; padding-left:62px } .social-links .rss {display:none} .social-links a { -webkit-transition: opacity 400ms ease; -moz-transition: opacity 400ms ease; transition: opacity 400ms ease; opacity: 0.65; } .social-links a:hover { opacity: 1; background: none; } /* ********************************************************** Navigation Menu ********************************************************** */ #sidebar nav { margin-bottom: 25px } #sidebar nav li { display: inline; list-style: none; float: left; width: 97px; margin: 0 15px 5px 0; position: relative; } #sidebar nav li.last { margin-right: 0 } /* Sub-menus */ #sidebar nav li ul { display: none; padding: 5px 10px; position: absolute; z-index: 100; left: 100%; top: 0; } #sidebar nav li ul li { display: block; float: none; margin-right: 0; } #sidebar nav li ul li:last-child { margin-bottom: 0 } #sidebar nav li ul li:last-child a { border-bottom: none 0 } #sidebar nav .current-menu-item a { font-weight: bold } #sidebar nav a { display: block; text-decoration: none; border-bottom: 1px dotted #999; border-width: 0px 0px 1px; -moz-border-image: url(images/dotted-border.png) 0 0 1 repeat; -webkit-border-image: url(images/dotted-border.png) 0 0 1 repeat; -o-border-image: url(images/dotted-border.png) 0 0 1 repeat; border-image: url(images/dotted-border.png) 0 0 1 repeat; padding-bottom: 2px; color: #111; font-weight: normal; } #sidebar nav a:hover { font-weight: bold } /* ********************************** Post Widgets ********************************** */ .widget ul.posts-list { margin: 0 } .widget ul.posts-list li { list-style: none } .widget ul.posts-list h3 { font-size: 12px; margin-bottom: 5px; } .widget ul.posts-list p { font-size: 11px; color: #444; } .post-thumb { width: 55px; padding: 2px; float: left; background: #111; margin: 0 10px 5px 0; line-height: 0.8; } .post-thumb a:hover { background: none } .post-thumb img { max-width: 55px } /* ********************************** Flickr Widget ********************************** */ .widget_flickrwidget { margin-bottom: 15px } .flickr_photos { overflow: hidden } .flickr_badge_image { display: inline; float: left; margin: 0 5px 10px 5px; background: #111; padding: 2px; overflow: hidden; height: 55px; width: 55px; } .flickr_badge_image a:hover { background: none } .flickr_badge_image img { max-width: 55px; max-height: 55px; } /* ********************************** Calendar Widget ********************************** */ #wp-calendar { width: 100%; margin: 0; } #wp-calendar caption { font-weight: bold; color: #222; text-align: center; font-size: 12px; padding-bottom: 10px; } #wp-calendar thead { font-size: 11px } #wp-calendar tbody { color: #aaa } #wp-calendar tbody td { padding: 3px 0 2px; background: #f5f5f5; border: 1px solid #fff; text-align: center; } #wp-calendar tbody .pad { background: none } #wp-calendar tfoot #next { text-align: right } #wp-calendar a { font-weight: bold; text-decoration: none; color: #111; } /* ********************************** Dribbble Widget ********************************** */ ul.dribbbles { margin: 0 } ul.dribbbles li { list-style: none; border-bottom: none 0; } ul.dribbbles li:last-child a { margin-bottom: 0 } ul.dribbbles a { position: relative; display: block; padding: 5px; margin-bottom: 15px; background: #fff; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; -webkit-background-clip: padding-box; -webkit-border-radius: 4px; -moz-background-clip: padding-box; -moz-border-radius: 4px; border-radius: 4px; background-clip: padding-box; } ul.dribbbles a:before, ul.dribbbles a:after { content: ""; position: absolute; z-index: -2; bottom: 15px; left: 10px; width: 50%; height: 20%; max-width: 300px; -webkit-box-shadow: 0 15px 8px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 15px 8px rgba(0, 0, 0, 0.5); box-shadow: 0 15px 8px rgba(0, 0, 0, 0.5); -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -o-transform: rotate(-3deg); transform: rotate(-3deg); } ul.dribbbles a:after { right: 10px; left: auto; -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -o-transform: rotate(3deg); transform: rotate(3deg); } /* ********************************** Simple Ads Widget ********************************** */ .ads-widget { overflow: hidden } .simple-ads { display: block; width: 100px; margin: 0 10px 10px 0; float: left; } .simple-ads.last { margin: 0 0 10px } .simple-ads img { display: block } .simple-ads:nth-child(3), .simple-ads:nth-child(4) { margin-bottom: 0 } /* ********************************** Other Widgets ********************************** */ .rss-date { color: #666; font-size: 11px; margin-bottom: 1.25em; display: block; } .tagcloud { text-align: center } .tagcloud a { padding: 0 5px } /* ********************************************************** Blog ********************************************************** */ .entry { width: 600px; float: left; line-height: 1.5; } .entry p { font-size: 14px; text-align:justify } article.hentry { background: url(images/stripes-border.png) left bottom repeat-x; padding-bottom: 15px; margin-bottom: 30px; overflow: hidden; } /* ********************************** Post/Page Header ********************************** */ article.hentry header { background: url(images/double-stripe-horz.png) left bottom repeat-x; overflow: hidden; margin-bottom: 15px; } article.hentry header h1 { font-size: 30px; color: #1a1a1a; width: 540px; margin-right: 30px; float: left; } article.hentry header h1 a { -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; padding: 2px 5px; } article.hentry header h1.highlighted { float: none; width: auto; margin-right: 0; display: inline-block; padding: 2px 5px; } /* ********************************** Post Meta Info ********************************** */ article.hentry footer { width: 170px; float: right; } article.hentry footer a { font-weight: normal; color: #7c7c7c; } article.hentry footer time { background: url(images/time-ic.png) left 2px no-repeat; min-height: 18px; margin-bottom: 5px; padding-left: 25px; display: block; color: #7c7c7c; } article.hentry footer time strong { color: #1a1a1a } article.hentry footer p { min-height: 18px; margin-bottom: 5px; padding-top: 5px; border-top: 1px dotted #999; border-width: 1px 0px 0px; -moz-border-image: url(images/dotted-border.png) 1 0 0 repeat; -webkit-border-image: url(images/dotted-border.png) 1 0 0 repeat; -o-border-image: url(images/dotted-border.png) 1 0 0 repeat; border-image: url(images/dotted-border.png) 1 0 0 repeat; color: #7c7c7c; } article.hentry footer p strong { color: #1a1a1a } article.hentry footer p.tag-list { background: url(images/tags-ic.png) left 8px no-repeat; padding-left: 25px; } article.hentry footer p.category-list { background: url(images/category-ic.png) left 6px no-repeat; padding-left: 25px; } .comment-count { float: left; display: block; width: 30px; height: 24px; padding-top: 6px; margin-top: 5px; text-align: center; font-size: 16px; font-weight: bold; position: relative; } .comment-count:after { -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; content: "\00a0"; display: block; position: absolute; bottom: -7px; right: 8px; width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid #ffde42; } .comment-count:hover { text-decoration: none } .comment-count:hover:after { border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid #000; } .feature-media { margin-bottom: 15px } .feature-media img { display: block } .gallery a:hover { background: none } /* ************************* Media Alignment ************************* */ .alignleft, img.alignleft { display: inline; float: left; margin-right: 15px; margin-top: 10px; } .alignright, img.alignright { display: inline; float: right; clear: right; margin-left: 15px; margin-top: 10px; } .aligncenter, img.aligncenter { text-align: center; clear: both; display: block; margin-left: auto; margin-right: auto; } img.alignleft, img.alignright, img.aligncenter { margin-bottom: 15px } .entry .wp-caption p { color: #6f6f6f; line-height: 1.5; font-size: 11px; text-align: center; padding: 0 5px; } .wp-caption { text-align: center } .wp-caption img { margin-bottom: 10px } .wp-smiley { margin: 0 } /* ************************* Video Page ************************* */ .video-container{ position:absolute; left:300px; width:640px; } .video-container h5{ margin-bottom:.25em; } .video-container p{ margin-bottom:3em; } .video-container iframe{ margin-bottom:-2em; } /* ************************* Slideshow ************************* */ .slider-container { position: relative; background: #0a0a0a; background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#222222)); background: -webkit-linear-gradient(#000000, #222222); background: -moz-linear-gradient(center top, #000000 0%, #222222 100%); background: -moz-gradient(center top, #000000 0%, #222222 100%); margin-bottom: 10px; } .slider { position: absolute; z-index: 90; } .slides_container { overflow: hidden; position: relative; text-align: center; } .slides_container a { display: block; text-align: center; } .slides_container a:hover { background: none } .slider-container, .slides_container, .slides_container a { width: 600px; height: 400px; } .slider .next, .slider .prev { position: absolute; bottom: 15px; display: block; width: 28px; height: 28px; z-index: 10; opacity: 0.65; } .slider .next:hover, .slider .prev:hover { opacity: 0.95; background: none; cursor: pointer; } .slider .prev { right: 48px } .slider .next { right: 15px } /* ********************************** Pagination ********************************** */ .post-shaken-navigation ol { margin: 0; display: inline; } .post-shaken-navigation li { list-style: none; display: inline; } .post-shaken-navigation a, .post-shaken-navigation span { display: inline-block; padding: 3px 8px; margin-left: 5px; } .post-shaken-navigation a { border: 1px solid #ccc } .post-shaken-navigation a:hover { border: 1px solid #b0b0b0 } .post-navigation, .post-shaken-navigation { margin-bottom: 60px } .next-post a, .prev-post a { -webkit-transition: background 300ms ease; -moz-transition: background 300ms ease; transition: background 300ms ease; text-indent: -9999px; color: #fff; display: block; height: 64px; width: 64px; -webkit-background-clip: padding-box; -webkit-border-radius: 70px; -moz-background-clip: padding-box; -moz-border-radius: 70px; border-radius: 70px; background-clip: padding-box; } .next-post a { background: url(images/next.png) center center no-repeat #000000; float: right; } .next-post a:hover { background: url(images/next.png) center center no-repeat #ffde42 } .prev-post a { background: url(images/prev.png) center center no-repeat #000000; float: left; } .prev-post a:hover { background: url(images/prev.png) center center no-repeat #ffde42 } /* ********************************************************** Forms ********************************************************** */ #searchform .screen-reader-text { display: none } #s { background: none; width: 160px; border: 1px solid #CCC; padding: 4px; color: #6F6F6F; font-size: 12px; font-weight: bold; float: left; } #searchsubmit { -webkit-transition: opacity 300ms ease; -moz-transition: opacity 300ms ease; transition: opacity 300ms ease; background: url(images/search.png) center center no-repeat; border: none 0; width: 18px; height: 18px; padding: 0 5px; margin: 4px 0 0 10px; text-indent: -9999px; } #searchsubmit:hover { opacity: 0.7 } input[type="text"], textarea { padding: 4px; border-color: #bfbebe #e3e3e3 #e3e3e3 #bfbebe; border-style: solid; border-width: 1px; } input[type="submit"] { border: none 0; padding: 5px; font-weight: bold; } /* ********************************************************** Comments ********************************************************** */ #comments article, .author-avatar, #comments footer { margin-bottom: 20px } .author-avatar { width: 70px; float: left; margin-top: 15px; } #comments article { padding: 20px 20px 5px; background: rgba(0, 0, 0, 0.04); border: 1px solid #acacac; width: 475px; min-height: 80px; margin-left: 15px; float: left; } /* ********************************** Comment Meta Info ********************************** */ #comments footer { width: 170px; float: right; margin-top: 15px; } #comments footer time { background: url(images/time-ic.png) left center no-repeat; margin-bottom: 15px; padding: 2px 0 2px 25px; display: block; color: #6f6f6f; font-size: 11px; } #comments footer .reply a { -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; background-image: url(images/reply.png); background-position: 5px center; background-repeat: no-repeat; text-transform: uppercase; font-size: 11px; padding: 6px 5px 5px 25px; } #comments footer .reply a:hover { background-image: url(images/reply-white.png) } #comments li { list-style: none; list-style-image: none; } #comments ol { margin-left: 0 } #comments ol li { margin-bottom: 0 } /* ********************************** Comment Form ********************************** */ #respond { width: 600px; overflow: hidden; margin-bottom: 20px; } #respond #submit { -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; transition: all 300ms ease; float: right; background-image: url(images/comments.png); background-position: 5px center; background-repeat: no-repeat; padding-left: 25px; } #respond #submit:hover { background-image: url(images/comments-white.png) } .author-name { font-weight: bold; margin-bottom: 10px; } #comments label { width: 70px; text-align: right; margin-right: 15px; display: inline-block; font-weight: bold; } textarea { padding: 10px; line-height: 1.35; height: 50px; width: 490px; } #reply-title, .comment-notes, .logged-in-as { margin-left: 85px } #cancel-comment-reply-link { font-size: 16px; font-weight: normal; margin-left: 10px; padding: 2px; } /* ********************************** Threaded Comments ********************************** */ li li .author-avatar { width: 35px } li li .author-avatar img { width: 35px; height: 35px; } #comments li > ul { margin-left: 85px } #comments li ul { margin-bottom: 0 } #comments li ul #reply-title, #comments li ul .comment-notes, #comments li ul .logged-in-as { margin-left: 50px } /* Third and final level */ #comments li li ul { margin-left: 50px } #comments li li li ul { margin-left: 0 } #comments li > ul li article, #comments li > ul li .comment-notes { width: 425px } #comments li > ul li #respond { width: 515px } #comments li > ul li textarea { width: 405px } #comments li ul ul article, #comments li ul ul .comment-notes { width: 375px } #comments li ul ul #respond { width: 465px } #comments li ul ul textarea { width: 355px } /* ********************************************************** Misc. ********************************************************** */ .blocks-list li, .widget .blocks-list li, .widget .tweetList li { border-bottom: 0 none } /* Gravity Forms */ .gform_wrapper textarea, .gform_wrapper input[type="text"] { padding: 4px !important } .yellow-block { background-color: #ffde42; color: #111; } .dotted-border-top { border-width: 1px 0px 0px; -moz-border-image: url(images/dotted-border.png) 1 0 0 repeat; -webkit-border-image: url(images/dotted-border.png) 1 0 0 repeat; -o-border-image: url(images/dotted-border.png) 1 0 0 repeat; border-image: url(images/dotted-border.png) 1 0 0 repeat; } .dotted-border-bottom { border-width: 0px 0px 1px; -moz-border-image: url(images/dotted-border.png) 0 0 1 repeat; -webkit-border-image: url(images/dotted-border.png) 0 0 1 repeat; -o-border-image: url(images/dotted-border.png) 0 0 1 repeat; border-image: url(images/dotted-border.png) 0 0 1 repeat; } /* ********************************************************** Adjust for screen sizes ********************************************************** */ @media screen and (max-width: 1100px) { #page { width: 600px } .entry { float: none } article.hentry footer { width: auto; float: none; } #comments article { padding: 15px } #comments footer { width: auto; margin-top: 0; margin-right: 15px; } #comments footer time { display: none } #comments footer .reply { margin: 0 } #comments footer .edit-comment { margin: 5px 0 0; text-align: right; } } /* iPad [portrait + landscape] */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) { #slide-next, #slide-prev { display: none } } /* iPhone [portrait + landscape] */ @media only screen and (max-device-width: 480px) { #slide-next, #slide-prev { display: none } } /* ********************************************************** COLORBOX ********************************************************** */ /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden; } #cboxOverlay { position: fixed; width: 100%; height: 100%; } #cboxMiddleLeft, #cboxBottomLeft { clear: left } #cboxContent { position: relative } #cboxLoadedContent { overflow: auto } #cboxTitle { margin: 0 } #cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; } #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer } .cboxPhoto { float: left; margin: auto; border: 0; display: block; } .cboxIframe { width: 100%; height: 100%; display: block; border: 0; } /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay { background: url(images/overlay.png) repeat 0 0 } #cboxTopLeft { width: 21px; height: 21px; background: url(images/controls.png) no-repeat -100px 0; } #cboxTopRight { width: 21px; height: 21px; background: url(images/controls.png) no-repeat -129px 0; } #cboxBottomLeft { width: 21px; height: 21px; background: url(images/controls.png) no-repeat -100px -29px; } #cboxBottomRight { width: 21px; height: 21px; background: url(images/controls.png) no-repeat -129px -29px; } #cboxMiddleLeft { width: 21px; background: url(images/controls.png) left top repeat-y; } #cboxMiddleRight { width: 21px; background: url(images/controls.png) right top repeat-y; } #cboxTopCenter { height: 21px; background: url(images/border.png) 0 0 repeat-x; } #cboxBottomCenter { height: 21px; background: url(images/border.png) 0 -29px repeat-x; } #cboxContent { background: #fff; overflow: hidden; } #cboxError { padding: 50px; border: 1px solid #ccc; } #cboxLoadedContent { margin-bottom: 28px } #cboxTitle { position: absolute; bottom: 4px; left: 0; text-align: center; width: 100%; color: #949494; } #cboxCurrent { position: absolute; bottom: 4px; left: 58px; padding: 0 3px; } #cboxSlideshow { position: absolute; bottom: 4px; right: 30px; color: #0092ef; } #cboxPrevious { position: absolute; bottom: 0; left: 0; background: url(images/controls-custom.png) no-repeat -75px 0; width: 25px; height: 25px; text-indent: -9999px; } #cboxPrevious.hover { background-position: -75px -25px } #cboxNext { position: absolute; bottom: 0; left: 27px; background: url(images/controls-custom.png) no-repeat -50px 0; width: 25px; height: 25px; text-indent: -9999px; } #cboxNext.hover { background-position: -50px -25px } #cboxLoadingOverlay { background: url(images/loading_background.png) no-repeat center center } #cboxLoadingGraphic { background: url(images/loading.gif) no-repeat center center } #cboxClose { position: absolute; bottom: 0; right: 0; background: url(images/controls-custom.png) no-repeat -25px 0; width: 25px; height: 25px; text-indent: -9999px; } #cboxClose.hover { background-position: -25px -25px }