/* ======================================================================== This file contains all CSS styles used in the Neutrino Template. Use the table of contents below to find your way round. TABLE OF CONTENTS I. - GLOBAL STYLES I.01 - Reset default browser styles I.02 - Styles for basic HTML elements and typography I.02.A - Document I.02.B - Headings I.02.C - Text elements I.02.D - Lists I.02.E - Tables I.02.F - Forms I.02.G - Images and Boxouts I.02.H - Pullquotes I.02.I - Boxes: Info, Warning, Note etc. I.03 - Document sections I.04 - Grids I.05 - Panels I.06 - Buttons II. - INDIVIDUAL TEMPLATE ELEMENTS II.01 - Header + Logo + Main navigation + Search form II.02 - Frontpage slider II.03 - Pages and blog posts + Blog post metadata + Blog post author box + Blog post comments + Pagination + Newer/Older posts links + Not-found box II.04 - Portfolio and gallery pages II.05 - Contact page II.06 - Footer + Main footer panel - overriding global styles + Footer footnotes section III. - WIDGETS III.01 - Global widgets styles + Generic + List type widgets + Hierarchical lists in widgets III.02 - Individual widgets + Links widget + RSS widget + About Us widget + Twitter feed widget + Ads widget + Recent comments widget + Tag cloud widget + Search widget + Calendar widget + Contact form widget III.03 - Footer widget styles + Generic + List type widgets + Ads widget + Recent comments widget ======================================================================== */ /** * ************************** * * I. - GLOBAL STYLES * * ************************** */ /** * =========================================================== * I.01 - Reset default browser styles * Based on Eric Meyer's CSS reset, v1.0 2008-02-12 * http://meyerweb.com/eric/tools/css/reset/ * =========================================================== */ 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; } /** * =========================================================== * I.02 - Styles for basic HTML elements and typography * =========================================================== */ /** * ----------------------------------------------------------- * I.02.A - Document * ----------------------------------------------------------- */ html { background: #0d1325 url(../img/silver/blue/main-bg.jpg) top center no-repeat; } html, body { font-size: 10px; line-height: 20px; color: #666; } body, label, legend, input, textarea, select, option { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif } /** * ----------------------------------------------------------- * I.02.B - Headings * ----------------------------------------------------------- */ h1, h2, h3, h4, h5, h6 { color: #283359; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; } h1 { font-size: 30px; line-height: 40px; margin-bottom: 15px; } h2 { font-size: 24px; line-height: 40px; margin-bottom: 5px; padding-top: 5px; } h3 { font-size: 20px; line-height: 20px; margin-bottom: 5px; padding-top: 5px; } h4 { font-size: 15px; line-height: 20px; margin-bottom: 5px; padding-top: 5px; } h5 { font-size: 13px; line-height: 20px; margin-bottom: 5px; padding-top: 5px; } h6 { font-size: 10px; line-height: 20px; margin-bottom: 5px; } h4, h5, h6 { font-weight: bold; } /*** Headings styled as horizontal bar ***/ h1.bar, h2.bar, h3.bar, h4.bar, h5.bar, h6.bar { color: #f6f6f6; background: #70798c; border: 1px solid #70798c; border-bottom-color: #5c6373; -moz-border-radius: 4px; -webkit-border-radius: 4px; padding: 2px 10px; margin-bottom: 15px; } h3.bar { padding: 7px 10px; } /** * ----------------------------------------------------------- * I.02.C - Text elements * ----------------------------------------------------------- */ a , a:link, a:visited { text-decoration: none; color: #386666; } a:hover, a:active { text-decoration: underline; color: #59637f; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link, h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited, h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active { color: #283359; text-decoration: none; } p { font-size: 13px; line-height: 20px; margin-bottom: 15px; } p.large { font-size: 15px; line-height: 20px; margin-bottom: 15px; font-weight: bold; color: #777; } p.small { font-size: 11px; line-height: 20px; margin-bottom: 15px; } hr { width: 100%; border:0; line-height: 0; margin:5px 0 15px 0; padding: 0; height: 1px; background: #c9c9c9 } p + hr { margin:15px 0 15px 0; } blockquote { padding-left: 15px; margin-bottom: 15px; border-left: 10px solid #c9c9c9; font-style: italic; } q { font-style: italic; } dfn { font-weight: bold; font-style: italic; } code,samp,kbd { font-family: monospace; text-decoration: none; background: #e4e4e4; border: 1px solid #ccc; } var,cite { font-style:italic; } del { text-decoration: line-through; color: #666; } ins { text-decoration: underline; } abbr, acronym { text-decoration: underline; cursor: help; } address { font-style: normal; } big { font-size: 14px; } small, sub, sup { font-size: 10px; } sub { vertical-align: sub; } sup { vertical-align: super; } pre,tt { font-family: monospace; text-decoration: none; font-weight: normal; font-style: normal; } pre { white-space: pre; display: block; overflow-x: auto; overflow-y: hidden; font-family: Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace; font-size: 12px; line-height: 20px; margin-bottom: 15px; padding: 10px 10px 20px 10px; border: 1px solid #c9c9c9; border-left-width: 10px; background: #e0e0e0; -moz-border-radius: 4px; } /** * ----------------------------------------------------------- * I.02.D - Lists * ----------------------------------------------------------- */ /*** Normal ordered and unordered lists ***/ ul,ol,dl { font-size: 13px; line-height: 20px; margin-bottom: 15px; } ul ul, ul ol, ol ol, ol ul { margin-bottom: 0px; } ol, ol li { list-style: decimal; } ul, ul li { list-style: disc; } ul > li { padding-left: 0; margin-left: 20px;} ol > li { padding-left: 0; margin-left: 30px;} /*** Normal definition list ***/ dt { font-weight: bold; } dd { padding-left: 15px; margin-bottom: 15px;} /*** List displayed horizontally ***/ .horizontal-list { list-style:none; margin-bottom:0; } .horizontal-list li { display:inline; margin:0; padding:0 1em; } /*** List with items separated by lines ***/ .lines-list { border-top: 1px solid #c9c9c9; } .lines-list li { list-style: none; margin: 0; line-height: 20px; border-bottom: 1px solid #c9c9c9; padding: 3px 0; } /*** Lists with items marked with triangles and checkboxes ***/ .arrow-list li { list-style:none; padding-left:15px; margin-left:5px; background: transparent url(../img/silver/blue/arrow-list.gif) no-repeat; background-position:0 6px; } .check-list li { list-style:none; padding-left:18px; margin-left:5px; background: transparent url(../img/silver/common/check-list.gif) no-repeat; background-position:0 6px; } .arrow-link-list li { list-style: none; margin: 0; } .arrow-link-list li a { display:block; padding: 1px 0 1px 15px; } .arrow-link-list a { background: transparent url(../img/silver/blue/arrow-list.gif) no-repeat; background-position:3px 7px; text-decoration: none; } .arrow-link-list a:hover, .arrow-link-list a:active { color:#fff; background: #59637f url(../img/silver/blue/arrow-list-hover.gif) no-repeat; background-position:5px 7px; text-decoration: none; } .arrow-link-list.lines-list { border-top: 1px solid #c9c9c9; } .arrow-link-list.lines-list li { border-bottom: 1px solid #c9c9c9; } .arrow-link-list a { display:block; padding:0 1px; text-decoration: none; } .arrow-link-list a:hover, ul.lines-list a:active { border:0; text-decoration:none; } /** * ----------------------------------------------------------- * I.02.E - Tables * ----------------------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; width:100%; font-size: 13px; line-height: 20px; margin-bottom: 15px; border: 0; background: none; color: #333; } caption { text-align: left; font-weight: bold; color: #333; } th { padding: 5px 10px; font-weight: bold; text-align: left; border: 0; background: #666; color: #f9f9f9; } td { padding: 5px 10px; border: 0; border-bottom: 1px solid #c9c9c9; background: #fff; color: #333; } tfoot td { border: 0; background: #c9c9c9; } /** * ----------------------------------------------------------- * I.02.F - Forms * ----------------------------------------------------------- */ fieldset { display: block; margin-bottom: 15px; padding: 10px; border: 1px solid #ccc; } label { display: block; font-size: 13px; color: #444; margin: 5px 0; } legend, input, textarea, select, option { font-size:13px; line-height:16px; color: #444; } input, select, textarea, legend { display:inline; } textarea { overflow:auto; } input.radio, input.checkbox { vertical-align:text-top; margin-right:10px; } input.text, input.password, input.fileupload, textarea, select { padding: 5px; border: 1px solid #c0c0c0; border-bottom-color: #bbb; border-top-color: #acacac; background: #d0d0d0 url(../img/silver/common/form-field-bg.gif) bottom repeat-x scroll; -moz-border-radius: 3px; -webkit-border-radius: 3px; } input.submit { display: inline-block; font-size: 13px; color: #222; margin-top:5px; padding:3px 8px; overflow: visible; border: 1px solid #aaa; border-bottom-color: #999; border-top-color: #c9c9c9; background: #ccc url(../img/silver/common/btn-bg.gif) center center repeat-x; -moz-border-radius: 3px; -webkit-border-radius: 3px; } input.submit:hover { cursor: pointer; background-position: 50% 40%; border-color: #777; color: #000; } input.text:focus, input.password:focus, input.fileupload:focus, textarea:focus, select:focus, .form-element-focus { outline: none; background: #fff; border-color: #000; color: #000; } .form-element { overflow:hidden; zoom:1; margin-bottom: 15px; } /* Use with a DIV element to wrap a form element and its label */ .infield { margin: 0; font-style: italic; color: #777; } /* For a form label diplayed inside the text field (inFieldLabels jQuery plugin) */ /** * ----------------------------------------------------------- * I.02.G - Images and frames * ----------------------------------------------------------- */ .alignnone { margin: 15px; margin-top: 0; } .alignright { float: right; margin: 5px 0 15px 15px; } .alignleft { float: left; margin: 5px 15px 15px 0; } .aligncenter {display: block; margin: 5px auto 15px auto; overflow:hidden; zoom:1; } .border { border: 1px solid #333; } .pad { padding: 10px; background: #e4e4e4; } .pad-light { padding: 10px; background: #fff; } .pad-neutral { padding: 10px; background: #f3f3f3; } .pad.border, .pad-neutral.border { padding: 9px; border: 1px solid #ccc; } .pad-light.border { padding: 9px; border: 1px solid #ccc; } .pad.round, .pad-light.round, .pad-neutral.round { padding: 9px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .pad.border.round, .pad-light.border.round, .pad-neutral.border.round { padding: 9px; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .pad-light.border.round { border-color: #ccc; } #content-column .alignnone, #content-column .alignright, #content-column .alignleft, #content-column .aligncenter { padding: 9px; background: #e4e4e4; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #content-column .alignnone { margin: 15px; margin-top: 0; } #content-column .alignright { float: right; margin: 5px 0 15px 15px; } #content-column .alignleft { float: left; margin: 5px 15px 15px 0; } #content-column .aligncenter {display: block; margin: 5px auto 15px auto; overflow:hidden; zoom:1; } #content-column .frame-right .alignnone, #content-column .frame-right .alignright, #content-column .frame-right .alignleft, #content-column .frame-right .aligncenter, #content-column .frame-left .alignnone, #content-column .frame-left .alignright, #content-column .frame-left .alignleft, #content-column .frame-left .aligncenter, #content-column .frame-center .alignnone, #content-column .frame-center .alignright, #content-column .frame-center .alignleft, #content-column .frame-center .aligncenter { padding: 0; border: 0; margin-top:0; } /*** Reset bottom margin on boxed-out elements ***/ div.alignright table:last-child, div.alignleft table:last-child, div.aligncenter table:last-child, div.alignright p:last-child, div.alignleft p:last-child, div.aligncenter p:last-child, div.alignright ul:last-child, div.alignleft ul:last-child, div.aligncenter ul:last-child, div.alignright ol:last-child, div.alignleft ol:last-child, div.aligncenter ol:last-child { margin-bottom:0; } .frame-left, .frame-right, .frame-center { display: block; overflow:hidden; zoom:1; padding: 9px; background: #e4e4e4; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .frame-left { float: left; margin: 5px 15px 15px 0; } .frame-right { float: right; margin: 5px 0 15px 15px; } .frame-center { margin: 5px auto 15px auto; } .frame-left :last-child, .frame-right :last-child, .frame-center :last-child { margin-bottom: 0 } /** * ----------------------------------------------------------- * I.02.H - Pullquotes * ----------------------------------------------------------- */ .pullquote-right, .pullquote-left, .pullquote-center { display: block; border-left: none; border-top: 2px solid #e4e4e4; border-bottom: 2px solid #e4e4e4; background: transparent url(../img/silver/common/quote.png) no-repeat; background-position: 0 17px; padding: 15px 0 0 35px; } .pullquote-right { float: right; margin: 5px 0 5px 20px; } .pullquote-left { float: left; margin: 5px 20px 5px 0; } .pullquote-center { margin: 0 auto 15px auto; } /** * ----------------------------------------------------------- * I.02.I - Boxes: Info, Warning, Note etc. * ----------------------------------------------------------- */ .download-box, .ok-box, .warning-box, .info-box, .note-box { display: block; min-height:22px; margin: 0 auto 15px auto; overflow:hidden; zoom:1; padding: 14px 14px 14px 54px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .download-box :last-child, .ok-box :last-child, .warning-box :last-child, .info-box :last-child , .note-box :last-child { margin-bottom: 0 } .download-box { background: #cfedcf url(../img/common/download.png) no-repeat; border: 1px solid #a3c6a3; background-position: 11px 9px; } .ok-box { background: #cfedcf url(../img/common/ok.png) no-repeat;; border: 1px solid #a3c6a3; background-position: 11px 9px; } .warning-box { background: #ffc9c9 url(../img/common/warning.png) no-repeat; border:1px solid #eba4a4; background-position: 11px 9px; } .info-box { background: #e0e0ff url(../img/common/info.png) no-repeat;; border:1px solid #bcbce0; background-position: 11px 9px; } .note-box { background: #f7f3de url(../img/common/note.png) no-repeat;; border:1px solid #e8d98e; background-position: 11px 9px; } /** * =========================================================== * I.03 - Document sections * =========================================================== */ .doc { min-width:960px; margin-left: auto; margin-right: auto; position:relative; } /* Centered document wrapper */ .doc-hd, /* Header */ .doc-bd, /* Body */ .doc-ft /* Footer */ { overflow:hidden; zoom:1; position:relative; } /** * =========================================================== * I.04 - Grids * =========================================================== */ /*** Main grid columns ***/ .three-columns, .two-columns, .full-column { margin:0; position:relative; overflow:hidden; zoom:1; } .column { display: inline; float: left; position:relative; margin:0 16px; } .column > :last-child { margin-bottom:0; } .three-columns .column { width: 282px; } .three-columns .column.double { width: 596px; } .two-columns .column { width: 439px; } .full-column .column { width: 910px; margin-left: 10px; margin-right: 10px; background: none; } .column.first, .column.double.first { margin-left: 10px; background: none; } .column.last, .column.double.last { margin-right: 10px; } /*** Vertical column separators ***/ .three-columns.separators { background: transparent url(../img/silver/common/panels-bg.png) repeat-y; background-position: -1919px 0; } .three-columns.separator-left { background: transparent url(../img/silver/common/panels-bg.png) repeat-y; background-position: -3007px 0; } .three-columns.separator-right { background: transparent url(../img/silver/common/panels-bg.png) repeat-y; background-position: -2693px 0; } .two-columns.separator { background: transparent url(../img/silver/common/panels-bg.png) repeat-y; background-position: -2850px 0; } /*** Content columns ***/ .one-half, .one-third, .two-third { display: block; float:left; overflow:hidden; zoom: 1; position:relative; margin-right: 16px; } .one-half { width: 290px; } .one-third { width: 188px; } .two-third { width: 392px; } #fullwidth-page .one-half { width: 445px; margin-right: 20px; } #fullwidth-page .one-third { width: 290px; margin-right: 20px; } #fullwidth-page .two-third { width: 600px; margin-right: 20px; } .last, #fullwidth-page .last { margin-right: 0; } .clear { clear: both; display: block; } /*** Horizontal dividers ***/ .divider, .divider-top { display: block; clear: both; margin: 0 0 10px 0; height: 20px; overflow:hidden; zoom:1; background: transparent url(../img/silver/common/panels-bg.png); background-position: -10px -105px; } .divider-top a { background: #f3f3f3; color: #666; font-size:10px; padding:0 0 0 5px; margin-top: 0; float:right; text-decoration:none; } #portfolio-page .divider, #blog-page .divider { margin-top: 10px; } /** * =========================================================== * I.05 - Panels * =========================================================== */ .panel { margin-left: auto; margin-right: auto; padding:25px 15px; width: 930px; position:relative; overflow:hidden; zoom:1; } .panel.round { width: 960px; padding: 15px 0; position: relative; overflow: hidden; zoom: 1; } .panel.round > .middle { width: 930px; padding: 10px 15px; background: transparent url(../img/silver/common/panels-bg.png) repeat-y; background-position: -960px 0; } .panel.round > .top, .panel.round > .bottom { display: block; width: 960px; height: 15px; position: absolute; left: 0; } .panel.round > .top { top:0; background: transparent url(../img/silver/common/panels-bg.png); background-position: 0 0; } .panel.round > .bottom { bottom:0; background: transparent url(../img/silver/common/panels-bg.png); background-position: 0 -15px; } /** * =========================================================== * I.06 - Buttons * =========================================================== */ a.link-btn, a.more-link, a.comment-reply-link, a#cancel-comment-reply-link { display: inline-block; text-decoration: none; font-size: 13px; color: #222; padding:1px 8px; border: 1px solid #aaa; border-bottom-color: #999; border-top-color: #c9c9c9; background: #ccc url(../img/silver/common/btn-bg.gif) center center repeat-x; -moz-border-radius: 3px; -webkit-border-radius: 3px; } a.link-btn:hover, a.more-link:hover, a.comment-reply-link:hover, a#cancel-comment-reply-link:hover { text-decoration: none; background-position: 50% 40%; border-color: #777; color: #000; } a.link-btn:active, a.more-link:active, a.comment-reply-link:active, a#cancel-comment-reply-link:active { text-decoration: none; background-position: 50% 60%; border-color: #555; color: #000; } a.arrow-link-left, a.arrow-link-right { padding: 0 2px; border: 2px solid transparent; } a.arrow-link-left { padding-left: 9px; background: transparent url(../img/silver/blue/arrow-left.gif) no-repeat; background-position:0 6px; } a.arrow-link-right { padding-right: 9px; background: transparent url(../img/silver/blue/arrow-right.gif) no-repeat; background-position:100% 6px; } a.arrow-link-left:hover, a.arrow-link-left:active, a.arrow-link-right:hover, a.arrow-link-right:active { color: #fff; border: 2px solid #59637f; -moz-border-radius: 3px; -webkit-border-radius: 3px; } a.arrow-link-left:hover, a.arrow-link-left:active { background: #59637f url(../img/silver/blue/arrow-left-hover.gif) no-repeat; background-position:0 6px; } a.arrow-link-right:hover, a.arrow-link-right:active { background: #59637f url(../img/silver/blue/arrow-right-hover.gif) no-repeat; background-position:100% 6px; } div.link-btn { display: inline-block; text-decoration: none; font-size: 13px; color: #222; padding:1px 8px; border: 1px solid #aaa; border-bottom-color: #999; border-top-color: #c9c9c9; background: #ccc url(../img/silver/common/btn-bg.gif) center center repeat-x; -moz-border-radius: 3px; -webkit-border-radius: 3px; } /** * ****************************************** * * II. - INDIVIDUAL TEMPLATE ELEMENTS * * ****************************************** */ /** * =========================================================== * II.01 - Header * =========================================================== */ /*** Logo ***/ #top-panel { width: 930px; margin: 15px auto 5px auto; overflow: hidden; zoom: 1; position: relative; } #top-panel-brand { margin: 0; padding: 0; margin-left:-10px; margin-bottom:0px; position: absolute; bottom: 0; left: 0; } #top-panel-brand-img { display: block; } /*** Main navigation ***/ #main-nav-panel { width: 925px; height:50px; padding: 10px 25px 10px 10px; position: relative; overflow: hidden; zoom: 1; background: transparent url(../img/silver/common/panels-bg.png) no-repeat; background-position: 0 -30px; } .main-nav-list { margin: 0; padding: 0; position: relative; } .main-nav-list-item { margin: 0; padding: 0; list-style: none; position: relative; } .subnav-list { display:none } .main-nav-link, .main-nav-link:hover { outline:none; text-decoration: none; } .main-nav-list.root { display: inline-block; float: left; list-style:none; margin:0; padding:0; line-height:50px; border-right: 1px solid #fff; } .main-nav-list.root > .main-nav-list-item { display:block; float:left; height:50px; margin:0; padding:0; border-left: 1px solid #fff; border-right: 1px solid #ddd; } .main-nav-list.root > .main-nav-list-item.first { border-left:0; } .main-nav-list.root > .main-nav-list-item > a { display:block; padding:0 15px; color: #666; text-decoration: none; } .main-nav-list.root > .main-nav-list-item > a.has-subnav { padding-right:30px; } .main-nav-subnav { position:absolute; display:block; width: 160px; padding: 15px; background: #f0f0f0; border: 1px solid #f6f6f6; -moz-box-shadow: 0 2px 1px #666; -webkit-box-shadow: 0 2px 1px #666; box-shadow: 0 2px 1px #666; } div.level-1 { border-top-color: #ddd; -webkit-border-bottom-left-radius:6px; -webkit-border-bottom-right-radius:6px; -moz-border-radius-bottomleft:6px; -moz-border-radius-bottomright:6px; } div.level-n { -moz-border-radius: 6px; -webkit-border-radius: 6px; } .subnav-list { border-top: 1px solid #ddd } .subnav-list li { display:block; list-style: none; margin: 0; line-height: 20px; border-bottom: 1px solid #ddd; padding: 0; } .subnav-list a { display:block; padding: 2px; color: #666; text-decoration: none; } .subnav-list a:hover, .subnav-list a:active, .subnav-list > .item-hover a { border:0; text-decoration:none; color:#fff; background: #59637f; text-decoration: none; } #main-nav .home a { text-indent:-9999px; width:20px; background: transparent url(../img/silver/common/home-icon.png) no-repeat; background-position: 50% 50%; } /*** Search form ***/ #search-form { display:inline-block; margin: 0; padding:0; border:0; position: absolute; top: 22px; right: 25px; } #search-form-search-field, #search-field, #search-submit { display: block; height: 25px; width: 112px; margin: 0; padding:0; border:0; float:left; -moz-border-radius: 0; -webkit-border-radius: 0; } #search-form-submit { display: inline; } #search-form-search-field { background: transparent url(../img/silver/common/search-field.png) no-repeat; } #search-field { background: none; font-size: 13px; line-height: 24px; padding-left: 2px; } #search-field:focus { background: none; border: 0; } #search-submit { width:29px; background: transparent url(../img/silver/common/search-icon.png) no-repeat; text-indent: -9999px; } #search-label { outline:none; font-size: 13px; position: absolute; top: 2px; left: 5px; } /** * =========================================================== * II.02 - Frontpage slider * * jQuery Nivo Slider v1.9 * http://nivo.dev7studios.com * * Copyright 2010, Gilbert Pellegrom * Free to use and abuse under the MIT license. * http://www.opensource.org/licenses/mit-license.php * March 2010 * =========================================================== */ #slider { height: 300px; margin: 0 10px 8px 10px; } /*** The Nivo Slider styles ***/ .nivoSlider { position:relative; } .nivoSlider img { position:absolute; top:0px; left:0px; } /*** If an image is wrapped in a link ***/ .nivoSlider a.nivo-imageLink { position:relative; width:100%; height:100%; border:0; padding:0; margin:0; z-index:60; display:block; } /*** The slices in the Slider ***/ .nivo-slice { display:block; position:absolute; z-index:50; height:100%; } /*** Direction nav styles (e.g. Next & Prev) ***/ .nivo-directionNav a { position:absolute; top:45%; z-index:99; cursor:pointer; } .nivo-prevNav { left:5px; display:block; width:30px; height:30px; background:url(../img/silver/common/prev.png) no-repeat; text-indent:-9999px; } .nivo-nextNav { right:5px; display:block; width:30px; height:30px; background:url(../img/silver/common/next.png) no-repeat; text-indent:-9999px; } /*** Control nav styles (e.g. 1,2,3...) ***/ .nivo-controlNav { position:absolute; right:0px; bottom:-16px; } .nivo-controlNav a { display:block; width:10px; height:11px; background:url(../img/silver/blue/slider-btn.png) no-repeat; text-indent:-9999px; border:0; margin-right:3px; float:left; } .nivo-controlNav a.active { background:url(../img/silver/blue/slider-btn-active.png) no-repeat; } /*** Ajax loader ***/ #slider { position:relative; background:url(../img/silver/common/nivo-ajax-loader.gif) no-repeat 50% 50%; } #slider img { position:absolute; top:0px; left:0px; display:none; } /** * =========================================================== * II.03 - Pages and blog posts * =========================================================== */ #page-heading { margin-bottom: 15px; } /*** Blog post metadata ***/ .post-info { margin-bottom:15px; border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; color: #666; } .post-info a { text-decoration: none; } .post-info a:hover { text-decoration: underline; } .post-info-date, .post-info-author, .post-info-category, .post-info-comments { font-size:11px; padding-left:20px !important; background:transparent url(../img/silver/common/post-icons.png) no-repeat; } .post-info-date { background-position:-60px -2px; } .post-info-author { background-position:0 -62px; } .post-info-category { background-position:-40px -22px; } .post-info-comments { background-position:-20px -42px; } /*** Blog post author box ***/ #author-info-txt { padding-left: 140px; } /*** Blog post comments ***/ #comments { clear: both; } #comments-heading { position:relative; overflow:hidden; zoom:1; } #leave-comment-link { position:absolute; right:10px; top:7px; display: inline; font-size: 15px; line-height:25px; margin:0; padding: 2px 20px 2px 10px; color: #fff; background: #8f9ab2 url(../img/silver/blue/arrow-list-hover.gif) no-repeat; background-position:142px 11px; border: 1px solid #5c6373; border-bottom-color: #525866; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #leave-comment-link:hover { border-color: #595959; background-color: #a3b0cc; } .comment-list { list-style: none; margin: 0 0 15px 0; padding: 0; } .comment-list-item { list-style: none; display: block; margin: 15px 0 0 0; padding: 0; overflow: hidden; zoom: 1; } .children { margin-top: 9px; } .children .comment-list-item { margin-top: 9px; } .comment-txt, .children { margin-left: 83px; } .children .comment-txt, .children .children { margin-left: 63px; } .comment-txt { background: #fff; padding: 9px; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .avatar { display: block; float: left; background: #fff; padding: 6px !important; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .comment-author { margin-bottom: 0; } .comment-date { font-size: 11px; } .comment-list-item > #respond { padding-left: 63px; border:0; } .comment-list-item.depth-1 > #respond { padding-left: 83px; border:0; } .comment-list-item #comment-form input.text, .comment-list-item #comment-form textarea { width: 90%; } #comment-form input.text, #comment-form textarea { width:385px; } #comments-nav { overflow: hidden; margin-bottom: 15px; } #older-comments, #newer-comments { text-decoration: none; font-size: 14px; font-weight: bold; } #older-comments { float: left; } #newer-comments { float: right; } #cancel-comment-reply-link { margin: 15px 0;} /*** Pagination ***/ .pagination { overflow:hidden; zoom:1; margin:0 0 15px 0; } a.pagination-link, .pagination-link.current { display:block; float:left; margin-right:3px; padding:1px 8px; font-size:13px; text-decoration:none; color: #222; } .pagination-link { border: 1px solid #aaa; border-bottom-color: #999; border-top-color: #c9c9c9; background: #ccc url(../img/silver/common/btn-bg.gif) center center repeat-x; -moz-border-radius: 3px; -webkit-border-radius: 3px; } .pagination-link:hover { text-decoration: none; background-position: 50% 40%; border-color: #777; color: #000; } .pagination-link:active { text-decoration: none; background-position: 50% 60%; border-color: #555; color: #000; } .pagination-link.current { color: #555; background: #ccc; border: 1px solid #aaa; } /*** Newer/Older posts links ***/ #posts-nav { overflow: hidden; margin-bottom: 15px; } #next-posts, #previous-posts { text-decoration: none; font-size: 14px; font-weight: bold; } #next-posts { float: right; } #previous-posts { float: left; } /*** Not-found box ***/ #on-page-search-form-query { width: 220px; height: 17px; margin-right: 4px; } /** * =========================================================== * II.04 - Portfolio and gallery pages * =========================================================== */ .pretty-photo-overlay { cursor:pointer; } #portfolio-page-heading { margin-bottom: 20px; } .portfolio-item { display: block; margin: 0 0 25px 0; overflow: hidden; zoom: 1; } .portfolio-item.with-description { margin-bottom: 0; } .portfolio-item h3 { font-size: 18px; } .portfolio-item .item-description { display: block; } .portfolio-item .item-description p:last-child { margin-bottom: 0; } .portfolio-img { display: block; margin: 0 auto 5px auto; background: #e4e4e4; padding: 9px; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .portfolio-row { display: block; overflow: hidden; zoom: 1; } .portfolio-1c #posts-nav, .portfolio-1c-sbar #posts-nav, .portfolio-2c #posts-nav, .portfolio-2c-sbar #posts-nav, .portfolio-3c #posts-nav { margin-bottom: 0; } /* Portfolio 1c */ .portfolio-1c .portfolio-item { clear: both; } .portfolio-1c .portfolio-img { float: left; } .portfolio-1c .item-description { width: 294px; float: left; margin-left: 15px; } /* Portfolio 2c */ .portfolio-2c .portfolio-item { width: 440px; float: left; margin-left: 15px; margin-right: 15px; } /* Portfolio 2c+s */ .portfolio-2c-sbar .portfolio-item { width: 282px; float: left; margin-left: 15px; margin-right: 15px; } /* Portfolio 3c */ .portfolio-3c .portfolio-item { width: 282px; float: left; margin-left: 16px; margin-right: 16px; } .portfolio-item.first { margin-left: 0; } .portfolio-item.last { margin-right: 0; } /** * =========================================================== * II.05 - Contact form * =========================================================== */ .contact-form { clear: both; display: block; margin: 0 auto 15px auto; overflow:hidden; zoom:1; padding: 9px; background: #e4e4e4; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .contact-form input.text, .contact-form textarea { width: 95%; } label.error { margin: 0; color: #b03333; } /** * =========================================================== * II.06 - Footer styles * =========================================================== */ /*** Main footer panel - overriding some global styels ***/ #footer-panel { color: #8e929e; padding-bottom: 5px; } #footer-panel h1, #footer-panel h2, #footer-panel h3, #footer-panel h4, #footer-panel h5, #footer-panel h6 { color: #bbb; } #footer-panel p.large { color: #666; } #footer-panel a { color: #518c8c; } #footer-panel a:hover, #footer-panel a:active { color: #fff; } #footer-panel input.text, #footer-panel input.password, #footer-panel input.fileupload, #footer-panel textarea, #footer-panel select { color: #999; border-color: #2d3038; border-top-color: #181c26; border-bottom-color: #494e5c; background: transparent url(../img/silver/common/footer-form-field-bg.png) bottom repeat-x scroll; } /*** Footer footnotes section ***/ .footnotes-separator { width: 940px; margin: 0 auto; padding: 0; height: 1px; color: #777; background: #777; } #footnotes-panel { width: 910px; margin: 15px auto; overflow: hidden; zoom: 1; color: #888; font-size: 12px; } #footnotes-panel a { color: #999; } #footnotes-copy-note { float: left; width: 596px; } #footnotes-logo { float: right; } /** * ************************** * * III. - WIDGETS * * ************************** */ /** * =========================================================== * III.01 - Global widgets styles * =========================================================== */ /*** Generic ***/ .widget, .widget-body { display: block; overflow:hidden; zoom:1; } .widget-boxed, .widget-unboxed { display: block; overflow:hidden; zoom:1; margin: 0 auto 15px auto; } .widget-unboxed { margin-bottom: 25px; } .widget p { margin-bottom: 10px; } .widget-head h3 { font-size: 16px; line-height: 20px; margin-bottom: 7px; } .widget-boxed .widget-head h3 { padding: 10px; margin:0; background: #434959; color: #ececec;-webkit-border-top-left-radius:4px; -webkit-border-top-right-radius:4px; -moz-border-radius-topleft:4px; -moz-border-radius-topright:4px; } .widget-boxed .widget-body { padding: 9px; background: #e4e4e4; border: 1px solid #ccc; } .widget-boxed.no-head .widget-body { -moz-border-radius: 4px; -webkit-border-radius: 4px; } .widget-boxed.has-head .widget-body { border-top: 0; -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; } /*** List type widgets ***/ .tbit-widget-recent-posts-list, /* Recent posts */ .tbit-widget-portfolio-list, /* Portfolio list */ .tbit-widget-pages-list, /* Pages */ .tbit-widget-links-list, /* Links */ .tbit-widget-archives-list, /* Archives */ .tbit-widget-categories-list, /* Categories */ .tbit-widget-nav-menu-list, /* Menu */ .tbit-widget-meta-list /* Meta */ { margin-bottom: 0; border-top: 1px solid #c9c9c9; } .tbit-widget-recent-posts-list li, /* Recent posts */ .tbit-widget-portfolio-list li, /* Portfolio list */ .tbit-widget-pages-list li, /* Pages */ .tbit-widget-links-list li, /* Links */ .tbit-widget-archives-list li, /* Archives */ .tbit-widget-categories-list li, /* Categories */ .tbit-widget-nav-menu-list li, /* Menu */ .tbit-widget-meta-list li /* Meta */ { list-style: none; margin: 0; line-height: 20px; border-bottom: 1px solid #c9c9c9; padding: 3px 0; } .tbit-widget-recent-posts-list a, /* Recent posts */ .tbit-widget-portfolio-list a, /* Portfolio list */ .tbit-widget-pages-list a, /* Pages */ .tbit-widget-links-list a, /* Links */ .tbit-widget-archives-list a, /* Archives */ .tbit-widget-categories-list a, /* Categories */ .tbit-widget-nav-menu-list a, /* Menu */ .tbit-widget-meta-list a /* Meta */ { display: block; padding: 1px 0 1px 15px; text-decoration: none; background: transparent url(../img/silver/blue/arrow-list.gif) no-repeat; background-position:3px 7px; } .tbit-widget-recent-posts-list a:hover, .tbit-widget-recent-posts-list a:active, /* Recent posts */ .tbit-widget-portfolio-list a:hover, .tbit-widget-portfolio-list a:active, /* Portfolio list */ .tbit-widget-pages-list a:hover, .tbit-widget-pages-list a:active, /* Pages */ .tbit-widget-links-list a:hover, .tbit-widget-links-list a:active, /* Links */ .tbit-widget-archives-list a:hover, .tbit-widget-archives-list a:active, /* Archives */ .tbit-widget-categories-list a:hover, .tbit-widget-categories-list a:active, /* Categories */ .tbit-widget-nav-menu-list a:hover, .tbit-widget-nav-menu-list a:active, /* Menu */ .tbit-widget-meta-list a:hover, .tbit-widget-meta-list a:active /* Meta */ { text-decoration: none; color:#fff; background: #59637f url(../img/silver/blue/arrow-list-hover.gif) no-repeat; background-position:5px 7px; } /*** Hierarchical lists in widgets ****/ .tbit-widget-pages-list .children, .tbit-widget-pages-list .children .children, /* Pages */ .tbit-widget-categories-list .children, .tbit-widget-categories-list .children .children, /* Categories */ .tbit-widget-nav-menu-list .sub-menu /* Menu */ { border:0; margin: 0 0 0 40px; } .tbit-widget-pages-list .children li, /* Pages */ .tbit-widget-categories-list .children li, /* Categories */ .tbit-widget-nav-menu-list .sub-menu li /* Menu */ { border:0; margin:0; padding:0; } .tbit-widget-pages-list .children a, /* Pages */ .tbit-widget-categories-list .children a, /* Categories */ .tbit-widget-nav-menu-list .sub-menu a /* Menu */ { background:none; padding: 1px 5px; margin: 1px 0; } .tbit-widget-pages-list .children a:hover, .tbit-widget-pages-list .children a:active, /* Pages */ .tbit-widget-categories-list .children a:hover, .tbit-widget-categories-list .children a:active, /* Categories */ .tbit-widget-nav-menu-list .sub-menu a:hover, .tbit-widget-nav-menu-list .sub-menu a:active /* Menu */ { background: #59637f; } /** * =========================================================== * III.02 - Individual widgets * =========================================================== */ /*** Links widget ***/ .tbit-widget-links-list p { padding-left: 15px; margin: 0; } /*** RSS widget ***/ .tbit-widget-rss-heading { margin: 0; padding:0; } .tbit-widget-rss-icon { display: block; text-indent: -9999px; text-decoration: none; float:left; width: 40px; height: 40px; margin: 0 10px 0 0; background: transparent url(../img/silver/common/rss.png) top left no-repeat; } /*** About Us widget ***/ p.tbit-widget-aboutus-social-links { font-size: 15px; line-height: 20px; margin-bottom: 0; font-weight: bold; color: #777; } .tbit-widget-aboutus-social-link { display: inline-block; text-indent: -9999px; text-decoration: none; width: 22px; height: 21px; margin: 0 0 2px 5px; } .tbit-widget-aboutus-social-link:hover { position:relative; top: -1px; } .tbit-widget-aboutus-social-links .twitter { background: transparent url(../img/common/twitter.png) top left no-repeat; } .tbit-widget-aboutus-social-links .facebook { background: transparent url(../img/common/facebook.png) top left no-repeat; } .tbit-widget-aboutus-social-links .stumbleupon { background: transparent url(../img/common/stumbleupon.png) top left no-repeat; } .tbit-widget-aboutus-social-links .delicious { background: transparent url(../img/common/delicious.png) top left no-repeat; } /*** Twitter feed widget ***/ .tbit-widget-twitter-feed-list { border-top: 1px solid #c9c9c9; margin-bottom: 0; } .tbit-widget-twitter-feed-list li { list-style: none; margin: 0; line-height: 20px; border-bottom: 1px solid #c9c9c9; padding: 3px 0; } /*** Ads widget ***/ .tbit-widget-display-ads img { display: block; } .tbit-widget-display-ads a { display: inline-block; margin: 0 10px 5px 0; text-decoration: none; } .tbit-widget-display-ads .widget-boxed .widget-body, .tbit-widget-display-ads .widget-unboxed .widget-body { padding: 10px 0 0 10px; } /*** Recent comments widget ***/ .tbit-widget-comments-list { margin-bottom: 0; border-top: 1px solid #c9c9c9; } .tbit-widget-comments-list li { list-style: none; margin: 0; line-height: 20px; border-bottom: 1px solid #c9c9c9; padding: 4px 0; overflow: hidden; zoom:1; } .tbit-widget-comments-list a.comment-link { display: block; padding: 0 2px; text-decoration: none; } .tbit-widget-comments-list a.comment-link:hover, .tbit-widget-comments-list a.comment-link:active { text-decoration: none; color:#fff; background: #59637f; } .tbit-widget-comments-list .comment-author { font-weight: bold; } .tbit-widget-comments-list .avatar { display: block; float: left; background: #fff; padding: 4px !important; border: 1px solid #ccc; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .tbit-widget-comments .with-gravatar a.comment-link { margin-left: 48px; } /*** Tag cloud widget ***/ .tbit-widget-tag-cloud a { display: inline-block; padding: 0 5px 5px 0; } /*** Search widget ***/ .tbit-widget-search fieldset { position: relative; margin: 0; padding: 0; border: 0; } .tbit-widget-search .label { position: absolute; left: 5px; top: 5px; margin: 0; font-style: italic; color: #777; } .tbit-widget-search .text { width: 180px; height: 17px; margin-right: 5px; float: left; } .tbit-widget-search .submit { height: 29px; margin: 0; float: left; } .tbit-widget-search .widget-unboxed .text { width: 200px; } /*** Calendar widget ***/ .tbit-widget-calendar table { margin: 0; } .tbit-widget-calendar th, .tbit-widget-calendar td { padding: 3px 10px; text-align: right; } .tbit-widget-calendar .pad { background: #c9c9c9; } .tbit-widget-calendar td a { text-decoration: underline; font-weight: bold; } .tbit-widget-calendar #next { text-align: right; } .tbit-widget-calendar #prev { text-align: left; } .tbit-widget-calendar #next a, .tbit-widget-calendar #prev a { text-decoration: none; } /*** Contact form widget ***/ .tbit-widget-contact-form .contact-form { display: block; margin: 0; padding: 0; overflow:hidden; zoom:1; background: none; border: 0; } /** * =========================================================== * III.03 - Footer widget styles * Reset and override some widget styles from the main body * =========================================================== */ /*** Generic ****/ #footer-panel .widget-unboxed { margin-bottom: 25px; } #footer-panel .widget-boxed { margin-bottom: 20px; padding: 10px; background: transparent url(../img/common/white-bg-18pc-opacity.png); -moz-border-radius: 4px; -webkit-border-radius: 4px; } #footer-panel .widget-body { padding:0; border: 0; background: none; } #footer-panel .widget-head h3 { padding: 0; border: 0; background: none; margin-bottom: 10px; color: ???; } /*** List type widgets ****/ #footer-panel .tbit-widget-recent-posts-list, #footer-panel .tbit-widget-recent-posts-list li, /* Recent posts */ #footer-panel .tbit-widget-portfolio-list, #footer-panel .tbit-widget-portfolio-list li, /* Portfolio list */ #footer-panel .tbit-widget-pages-list, #footer-panel .tbit-widget-pages-list li, /* Pages */ #footer-panel .tbit-widget-links-list, #footer-panel .tbit-widget-links-list li, /* Links */ #footer-panel .tbit-widget-archives-list, #footer-panel .tbit-widget-archives-list li, /* Archives */ #footer-panel .tbit-widget-categories-list, #footer-panel .tbit-widget-categories-list li, /* Categories */ #footer-panel .tbit-widget-nav-menu-list, #footer-panel .tbit-widget-nav-menu-list li, /* Menu */ #footer-panel .tbit-widget-meta-list, #footer-panel .tbit-widget-meta-list li, /* Meta */ #footer-panel .tbit-widget-twitter-feed-list, #footer-panel .tbit-widget-twitter-feed-list li, /* Twitter */ #footer-panel .tbit-widget-comments-list, #footer-panel .tbit-widget-comments-list li { border-color: #3d414d; } #footer-panel .tbit-widget-recent-posts-list a:hover, #footer-panel .tbit-widget-recent-posts-list a:active, /* Recent posts */ #footer-panel .tbit-widget-portfolio-list a:hover, #footer-panel .tbit-widget-portfolio-list a:active, /* Portfolio list */ #footer-panel .tbit-widget-pages-list a:hover, #footer-panel .tbit-widget-pages-list a:active, /* Pages */ #footer-panel .tbit-widget-links-list a:hover, #footer-panel .tbit-widget-links-list a:active, /* Links */ #footer-panel .tbit-widget-archives-list a:hover, #footer-panel .tbit-widget-archives-list a:active, /* Archives */ #footer-panel .tbit-widget-categories-list a:hover, #footer-panel .tbit-widget-categories-list a:active, /* Categories */ #footer-panel .tbit-widget-nav-menu-list a:hover, #footer-panel .tbit-widget-nav-menu-list a:active, /* Menu */ #footer-panel .tbit-widget-meta-list a:hover, #footer-panel .tbit-widget-meta-list a:active /* Meta */ { color:#fff; background: #6b7799 url(../img/silver/blue/arrow-list-hover.gif) no-repeat; background-position:5px 7px; } #footer-panel .tbit-widget-pages-list .children a:hover, #footer-panel .tbit-widget-pages-list .children a:active, /* Pages */ #footer-panel .tbit-widget-categories-list .children a:hover, #footer-panel .tbit-widget-categories-list .children a:active, /* Categories */ #footer-panel .tbit-widget-nav-menu-list .sub-menu a:hover, #footer-panel .tbit-widget-nav-menu-list .sub-menu a:active, /* Menu */ #footer-panel .tbit-wiget-comments-list a.comment-link:hover, #footer-panel .tbit-widget-comments-list a.comment-link:active /* Comments */ { background: #6b7799; } /*** Ads widget ***/ #footer-panel .tbit-widget-display-ads .widget-boxed { padding: 0; } #footer-panel .tbit-widget-display-ads .widget-body { padding: 10px 0 0 10px; } #footer-panel .tbit-widget-display-ads .widget-head { padding: 10px 10px 5px 10px; } #footer-panel .tbit-widget-display-ads h3 { margin: 0; } /*** Recent comments widget ***/ #footer-panel .tbit-widget-comments-list .avatar { background: #2b3142; border-color: #3d414d; }