/* Theme Name: Starbom Theme URI: http://starbom.com Author: Ihor Vorotnov Author URI: http://paspar2.com Description: Custom theme for Starbom.com project Version: 1.1 License: Copyright (C) Starbom.com / Ihor Vorotnov / Paspar2.com */ /* = Reset 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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* = HTML5 Display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; } /* = IE = move to IE.css */ body { line-height: 1; /* line-height: 1.231; */ } /* = Effects Optional candies; */ a, img, input, blockquote, .starbom-promo { /* Fancy transitions for modern browsers. Add or remove elements */ -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; } .no-transitions { /* Add this tag to disable transitions */ -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; } /* = Base styles */ html { height: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0,0,0,0); } /* = Links and selections */ a { color: #ff6255; text-shadow: #fff 0 1px 0; text-decoration: none; } a:visited { color: #ff6255; } a:focus { outline: none; } a:hover, a:active { color: #d0352c; outline: 0; } ::selection { background: #ddd; } ::-moz-selection { background: #ddd; } .current-menu-item a::selection { background: #ed4036; } .current-menu-item a::-moz-selection { background: #ed4036; } /* = Typography */ abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } dfn { font-style: italic; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } ins { background: #fff6d7; color: #000; text-decoration: none; border: 1px solid #ebe4c6; padding: 0 4px; } mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; } pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; } pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } small { font-size: 90%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Main typography rules */ body { font-size: 12px; } body, button, input, select, textarea { font-family: Helvetica, Arial, sans-serif; color: #444; } p { margin-bottom: 18px; line-height: 18px; } h1, h2, h3, h4, h5, h6 { font-family: Georgia, serif; font-weight: normal; color: #444; text-shadow: #fff 0 1px 0; margin-bottom: 18px; line-height: 18px; } h1 { font-size: 24px; line-height: 32px; } h2 { font-size: 18px; line-height: 24px; } h3 { font-size: 16px; line-height: 20px; } h4, h5, h6 { font-size: 14px; line-height: 18px; } /* = Lists */ dd { margin: 0 0 0 40px; } nav ul, nav ol { list-style: none; margin: 0; padding: 0; } nav li { float: left; } /* = Embedded content */ img { -ms-interpolation-mode: bicubic; } svg:not(:root) { overflow: hidden; } /* = Forms */ legend { *margin-left: -7px; } label { cursor: pointer; } button, input, select, textarea { margin: 0; font-size: 100%; vertical-align: baseline; *vertical-align: middle; } button, input { line-height: normal; *overflow: visible; } button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; } input[type="search"] { -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; } input:valid, textarea:valid { } /* Set color for valid input */ input:invalid, textarea:invalid { background-color: #f0dddd; } /* Set color for invalid input */ input:active { outline: none; } input:focus { outline: none; } /* Does it fix Opera, IE and Chrome outlines? */ /* = Tables */ table { border-collapse: collapse; border-spacing: 0; } /* ------------------------------------------------------------------------------------- = Primary styles Author: Ihor Vorotnov Email: ihor.vorotnov@gmail.com ------------------------------------------------------------------------------------- */ body { background: #f5f5f5 url('img/background.jpg') no-repeat center top; } /* = Layout 980px : PL20 + 940 + PR20 = Grid 940px : ( W60 + MR20 ) * 12 */ #wrapper { width: 940px; margin: 0 auto; padding: 0 20px; } #header, #footer { width: 940px; display: inline-block; } #content { float: left; width: 620px; } #sidebar { float: right; width: 300px; } .col1x, .col2x, .col3x, .col4x, .col5x, .col6x, .col7x, .col8x, .col9x, .col10x, .col11x { margin-right: 20px; float: left; } .col1x { width: 60px; } .col2x { width: 140px; } .col3x { width: 220px; } .col4x { width: 300px; } .col5x { width: 380px; } .col6x { width: 460px; } .col7x { width: 540px; } .col8x { width: 620px; } .col9x { width: 700px; } .col10x { width: 780px; } .col11x { width: 860px; } .last { margin-right: 0; } /* =