@charset "utf-8"; /** * Theme Name: Bokeh * Theme URI: http://wordpress.org/ * Description: Pure Wordpress Theme * Author: Altima * Author URI: http://www.altimawebsystems.com/ * Version: 1.0 * License: GNU General Public License * License URI: license.txt * Tags: dark, black, yellow, fixed-width, two-columns, left-sidebar, custom-menu, featured-images, threaded-comments * * General comments: * * MASTER STYLE SHEET FILE * * NAMING CONVENTIONS: * box-name_modification-type_modification-name * box-name__box-nested-element-name * Prefixes: * b- : box * l- : layout box * i- : inner extra element (for inside regulation) * w- : wrapper extra element (for outside regulation) * g- : global definition * ie7- : fixes for ie7 * ie6- : fixes for ie6 * js- : for javascript handling * * TABLE OF CONTENTS: * Root and Layout Elements * Site Logo * (WP) Primary Navigation * (WP) Wordpress Core Styles * (WP) Wiget Area * (WP) Older/Newer posts links * (WP) Post * (WP) Post Pagination Links * (WP) Comments * Footer * * PROJECT: Project name * AUTHOR: Constantine B. * */ @import url(css/normalize.css); @import url(css/classes.css); @import url(css/components.css); @import url(css/layout.css); @import url(css/content.css); /***************************************************************************************************** * Root and Layout Elements *****************************************************************************************************/ html { background: #000 url(images/bg.jpg) no-repeat 50% 0; } /***************************************************************************************************** * Site Logo *****************************************************************************************************/ #site-title { margin: 28px 0 0; float: left; } #site-logo { margin: 0; } #site-logo a:hover, #site-logo a:focus, #site-logo a:active { background: none; } #site-description { color: #fff; font-size: 12px; font-style: italic; text-align: right; padding-right: 32px; } /***************************************************************************************************** * (WP) Primary Navigation *****************************************************************************************************/ #nav-primary { float: right; width: 664px; margin-top: 50px; text-align: right; } #nav-primary .menu { height: 116px; overflow: hidden; } #nav-primary li { position: relative; padding: 40px 0 40px 24px; background: url(images/nav_states_sprite.png) no-repeat; } #nav-primary li:hover, #nav-primary .current_page_item, #nav-primary .current-menu-ancestor, #nav-primary .current-menu-item, #nav-primary .current-menu-parent, #nav-primary .current_page_parent { background-position: 0 -116px; } #nav-primary a { font-size: 22px; line-height: 36px; height: 36px; font-style: italic; text-decoration: none; color: #f6f9fa; padding: 0 10px; min-width: 72px; text-align: center; } #nav-primary a:hover, #nav-primary a:focus, #nav-primary a:active, #nav-primary .current_page_item > a, #nav-primary .current-menu-ancestor > a, #nav-primary .current-menu-item > a, #nav-primary .current-menu-parent > a, #nav-primary .current_page_parent a { color: #fff836; background: none; } /***************************************************************************************************** * (WP) Wordpress Core Styles *****************************************************************************************************/ img.size-auto, img.size-full, img.size-large, img.size-medium, .attachment img, .wp-post-image, .ie7 .wp-post-image__wrapper { /* Resize images to fit the main content area. - Applies only to images uploaded via WordPress by targeting size-* classes. - Other images will be left alone. Use "size-auto" class to apply to other images. */ max-width: 100%; /* When images are too wide for containing element, force them to fit. */ height: auto; /* Override height to match resized width for correct aspect ratio. */ } .alignleft, .wp-post-image, .ie7 .wp-post-image__wrapper { float: left; margin-right: 24px; } .alignright { float: right; margin-left: 24px; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } .alignleft, .alignright, .aligncenter, .wp-post-image, .ie7 .wp-post-image__wrapper { margin-top: 0.4em; margin-bottom: 20px; } .ie7 .wp-post-image__wrapper .wp-post-image { margin: 0; } .attachment img { /* single attachment images should be centered */ display: block; margin: 0 auto; } .wp-caption { margin-bottom: 20px; padding: 10px 8px 0; text-align: center; max-width: 100%; background: #eee; } .wp-caption img { margin: 0; vertical-align: top; } .wp-caption-text { font-size: 12px; margin: 5px; } /***************************************************************************************************** * (WP) Wiget Area *****************************************************************************************************/ .widget-area { font-size: 16px; } #social { margin-bottom: 26px; overflow: hidden; } #social a { display: block; width: 50px; height: 50px; float: left; margin-right: 6px; text-indent: -9999em; background-image: url(images/social.png); } #social a:hover, #social a:focus, #social a:active { background-color: #42c8f4; } #twitter { background-position: 0 0; } #facebook { background-position: 0 -50px; } #linkedin { background-position: 0 -100px; } #rss { background-position: 0 -150px; } .widget-container { margin-bottom: 26px; padding: 10px; background: #fff700 url(images/widget-container.png) no-repeat; } .i-widget-container { background: #fff; overflow: hidden; padding: 14px 14px 0; -webkit-box-shadow: 0 0 3px #666; -moz-box-shadow: 0 0 3px #666; box-shadow: 0 0 3px #666; } .widget-title { font-size: 25px; font-weight: bold; margin-bottom: 20px; text-transform: uppercase; } .widget-container ul { list-style: none outside none; padding: 0; margin-left: -14px; margin-right: -14px; } .ie7 .widget-container ul { zoom: 1.0; } .widget-container li { margin: 0; } .widget-container ul a { padding: 4px 14px; display: block; } .widget-container ul a:hover, .widget-container ul a:focus, .widget-container ul a:active { color: #fff; background: #000; } .widget-container .children, .widget-container .sub-menu { margin: 0; } .widget-container ul ul a { padding-left: 34px; } .widget-container ul ul ul a { padding-left: 54px; } /* Calendar (BEGIN) */ .widget_calendar { } #calendar_wrap { margin-bottom: 20px; } #wp-calendar { margin: 0; } #wp-calendar caption { } #wp-calendar thead { } #wp-calendar td, #wp-calendar th { border: 1px solid #fff; padding: 0; } #wp-calendar th { text-align: center; } #wp-calendar tbody td { text-align: center; background: #eee; } #wp-calendar tbody .pad { background: none; } #wp-calendar tfoot #prev { text-align: left; } #wp-calendar tfoot #next { text-align: right; } /* Calendar (END) */ /* Categories (BEGIN) */ .widget_categories { } .current-cat a { text-decoration: none; } /* Categories (END) */ /* Resent Comments (BEGIN) */ .widget_recent_comments { } #recentcomments { margin-left: 0; margin-right: 0; } #recentcomments li { margin-bottom: 8px; } #recentcomments a:hover, #recentcomments a:focus, #recentcomments a:active { background: none; color: #000; } /* Resent Comments (END) */ /* Search (BEGIN) */ .widget_search .i-widget-container { padding: 0; } .searchform { margin: 0; } .l-content .searchform { margin-top: 10px; margin-bottom: 10px; } .searchform > div { padding: 4px 54px 4px 14px; position: relative; height: 32px; background: url(images/input_field.png) no-repeat; } .screen-reader-text { display: none; } .searchform .s { padding: 0; border: 0 none; display: block; width: 100%; line-height: 32px; height: 32px; font-style: italic; font-size: 18px; color: #fff; background: none; } .ie7 .searchform .s { float: right } .searchform .searchsubmit { height: 32px; line-height: 32px; width: 50px; padding: 0; border: 0 none; background: #fff url(images/icons.png) no-repeat 50% 50%; text-transform: uppercase; text-indent: -9999em; position: absolute; top: 50%; margin-top: -16px; right: 4px; } /* Search (END) */ /* Tag Cloud (BEGIN) */ .tagcloud { text-align: center; margin-bottom: 20px; } /* Tag Cloud (END) */ /***************************************************************************************************** * (WP) Older/Newer posts links *****************************************************************************************************/ .navigation { overflow: hidden; font-size: 18px; font-style: italic; font-weight: bold; } .navigation a { color: #fff; height: 50px; line-height: 50px; } .navigation a:hover, .navigation a:focus, .navigation a:active { color: #000; text-decoration: none; background: url(images/button_yellow.png) no-repeat; } .navigation span { display: block; } #nav-above { margin-bottom: 26px; } #nav-above { display: none; } .paged #nav-above, .single #nav-above { display: block; } #nav-below { margin-top: 30px; margin-bottom: 30px; } .nav-previous { float: left; width: 50%; } .nav-previous a { float: left; } .nav-previous span { padding: 0 24px 0 45px; background: url(images/arrow_left_white.png) no-repeat 14px 50%; } .nav-previous a:hover span, .nav-previous a:focus span, .nav-previous a:active span { background-image: url(images/arrow_left_black.png); } .nav-next { float: right; text-align: right; width: 50%; } .nav-next a { float: right; } .nav-next span { padding: 0 45px 0 24px; background: url(images/arrow_right_white.png) no-repeat 100% 50%; } .nav-next a:hover span, .nav-next a:focus span, .nav-next a:active span { background-image: url(images/arrow_right_black.png); } /***************************************************************************************************** * (WP) Post *****************************************************************************************************/ .page-title { margin: 0 0 10px; font-weight: bold; font-size: 45px; line-height: 50px; color: #fff700; text-transform: uppercase; overflow: hidden; } .page-title a { color: #fff700; } .i-page-title { float: left; padding: 0 80px 16px 0; background: url(images/page-title.png) no-repeat 100% 100%; } .archive-meta { } .tag-meta { } .post, .type-attachment, .type-page { padding: 10px; margin-bottom: 26px; background: #fff700 url(images/post.png) no-repeat; } .i-post { background: #fff; overflow: hidden; padding: 20px; -webkit-box-shadow: 0 0 3px #666; -moz-box-shadow: 0 0 3px #666; box-shadow: 0 0 3px #666; } .sticky { } .ie7 .sticky { zoom: 1.0; } .entry-header { margin-bottom: 20px; overflow: hidden; } .entry-title { margin: 0 0 10px; font-size: 28px; font-weight: bold; } .entry-title a { text-decoration: none; color: #000; } .entry-footer { clear: both; } .entry-meta, .entry-utility { color: #777; font-size: 14px; } .entry-meta a, .entry-utility a { color: #777; } /***************************************************************************************************** * (WP) Post Pagination Links *****************************************************************************************************/ .post-pagination { clear: both; font-weight: bold; margin: 0 0 20px; word-spacing: 0.5em; } /***************************************************************************************************** * (WP) Comments *****************************************************************************************************/ #comments { clear: both; margin: 40px 0 20px; background: #fff700 url(images/post.png) no-repeat; padding: 10px; zoom: 1.0; } #comments .navigation { padding: 0 0 20px 0; } #comments-title { font-weight: bold; font-size: 25px; } .commentlist, #comments .children { list-style: none outside none; padding: 0; margin-left: 0; } .commentlist { margin-bottom: 40px; } #comments .children { margin-bottom: 20px; margin-top: 20px; } .comment { margin: 0 0 20px; padding: 20px 20px 20px 110px; position: relative; background: #fff; -webkit-box-shadow: 0 0 3px #666; -moz-box-shadow: 0 0 3px #666; box-shadow: 0 0 3px #666; } .comment-author { font-size: 18px; } .comment-author .avatar { position: absolute; left: 20px; top: 20px; } .comment-author .fn { font-style: normal; font-weight: bold; } .comment-author .says { font-style: italic; font-size: 14px; } .comment-body p, .comment-body ol, .comment-body ul { margin-bottom: 10px; } .comment-meta { font-size: 13px; margin-bottom: 10px; color: #4b4b4b; font-weight: bold; } .comment-meta a { color: #4b4b4b; } .reply { font-size: 16px; } #respond { margin: 20px 0; overflow: hidden; position: relative; padding: 0 20px; } #reply-title { font-weight: bold; font-size: 25px; margin-bottom: 10px; } #cancel-comment-reply-link { font-size: 14px; } #commentform .comment-notes { margin-bottom: 20px; } #commentform .required { color: #f00; font-weight: bold; } #commentform p { margin-bottom: 10px; } #commentform label { } #commentform input[type=text], #commentform textarea { width: 97%; } .form-allowed-tags { float: left; width: 67%; margin-right: 10px; } .form-submit { width: 30%; height: 50px; background: url(images/button_black.png) repeat-x; float: left; } #commentform #submit { width: 100%; height: 100%; line-height: 100%; padding: 0; margin: 0; background: none; font-size: 18px; font-style: italic; font-weight: bold; } .ie7 #commentform #submit { padding-top: 12px; padding-bottom: 12px; } .nocomments { font-weight: bold; } /***************************************************************************************************** * Footer *****************************************************************************************************/ #l-footer { font-size: 13px; line-height: 18px; color: #fff; } #l-footer a { color: #fff; } #l-footer p { margin: 0; } #copyrights { float: left; } #copyrights img { vertical-align: baseline; margin: 0 12px; } #theme-creator-info { float: right; width: 520px; margin: 10px 0 0 0; } .gallery-caption { } .bypostauthor { }