/** Tropospherical Purple CSS
 *
 * Original Authors:
 * Janine Smith <janine@netrophic.com>
 * Jesse Proulx <jproulx@jproulx.net>
 * Elizabeth Lubowitz <grrliz@gmail.com>
 * Denise Paolucci <denise@dreamwidth.org>
 *
 * Blue Version by dw-user emiri <athousandsmiles@gmail.com> 
 * FAQ for using & abusing this script can be found here:
 * http://emiri.dreamwidth.org/8232.html
 */

/**
 * Dreamwidth Site Scheme
 *
 * Standard layout for Dreamwidth
 *
 * Mockups designed by grrliz, hence grrliz.css
 *
 * @project Dreamwidth Site Design
 * @author Jesse Proulx
 * @date 2009-01-07
 * @version Alpha
 * @revision $Revision$
 * @copyright Copyright (c) 2009 by Dreamwidth Studios, LLC
 *
 */

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain('dreamwidth.org'),  url-prefix('dreamwidth.org') {

/**
 * General Body Edits
 */

body.tropo #canvas {
 background-color: #ffffff !important;
 color: #000000 !important;
 padding: 20 !important;
}

body.tropo #canvas #content {
    margin-top: 2.75em !important;
    padding: 0 !important;
    width: 100% !important;
    }

body.tropo #page { text-align: justify !important; }

body.tropo #page { max-width: 100% !important; }

#page_talkread #Comments .talk-comment,
#page_inbox .InboxItem_Content {
    max-width: 100% !important;
}

#page_talkread #entry {
    max-width: 95% !important;
}

body.tropo #page #account-links #account-links-text {
 color: #114577 !important;
 font-size: 8pt !important;
}

body.tropo #page #account-links-userpic {
 font-size: 8pt !important;
    }

/* Image replacement codes */

img[src*="http://s.dreamwidth.org/img/tropo-red/dw_logo_beta_purple.png"] {
 width: 0px !important;
 height: 51px !important;
 padding-left: 241px !important;
 background-image: url("http://img.photobucket.com/albums/v511/cassaru/dreamwidth_blue_small.png") !important;
 background-repeat: no-repeat !important;
}

img[src*="http://s.dreamwidth.org/img/tropo-red/dw_logo_beta.png"] {
 width: 0px !important;
 height: 51px !important;
 padding-left: 241px !important;
 background-image: url("http://img.photobucket.com/albums/v511/cassaru/dreamwidth_blue_small.png") !important;
 background-repeat: no-repeat !important;
}


/**
 * Links and a pseudo link class
 */


body.tropo a:link,
.link {
 color: #1745ad !important;
}

body.tropo a:visited,
.link {
 color: #4f269a !important;
}

body.tropo a:hover,
a:active,
.link:hover {
 color: #1745ad !important;
 text-decoration: none !important;
}

body.tropo #canvas {
 background-color: #ffffff!important;
 border-color: #7fa8d0!important;
}
body.tropo #page {
 font-size: 9pt!important;
}

/**
 * Menu navigation
 */

#menu {
 background: #cbe4fd!important;
 font-weight: bold;!important;
 font-size: 8pt!important;
}
#menu ul li a {
 background: transparent url(/img/tropo-red/icon_menu_swirl_dropdown.png) 0.833333em 0.916667em no-repeat;
 color: #114577!important;
 font-weight: bold;!important;
}

/* .hover is a class added by js for the currently hovered/focused menu */
#menu ul li.hover a {
 background-color: #cbe4fd!important;
 color: #114577!important;
 font-weight: bold;!important;
}
#menu ul li.hover a:hover {
 background-color: #114577!important;
 color: #fff!important;
 font-weight: bold;!important;
}
#menu ul li.hover ul {
 background-color: #cbe4fd!important;
 font-weight: bold;!important;
}

/**
 * Footer
 */

#footer {
 background: #ecf6ff!important;
}

/**
 * #content houses the page-specific innards, and creates margins for the absolutely
 * positioned masthead and footer
 */

body.tropo #content h1 {
 color: #114577!important;
}
body.tropo #content h2 {
 color: #114577!important;
}

/**
 * Content Layouts
 *
 * Content layouts are determined based on the class assigned to #content. Potential layouts include:
 * -- wide sidebars
 * -- thin sidebars
 * -- equal width/height columns
 * -- full page (default)
 *
 * Columns/rows inside of #content are named primary, secondary, tertiary, etc and
 * content is placed inside based on order of importance.
 */

/**
 * Panels are generic boxes for divs inside of #content
 */

#content #primary .panel,
#content #secondary .panel {
 border-color: #ccc!important;
}
#content .panel .sidebar,
#content .panel .contents,
#content .panel .item,
#content .panel .actions {
 border-color: #ccc!important;
}
#content #primary .panel h2 {
 color: #7fa8d0!important;
 border-bottom: 1px solid #ccc!important;
}
#content #secondary .panel h2 {
 color: #7fa8d0!important;
 border-bottom: 1px solid #ccc!important;
}

/**
 * Panels have different styles for different content layouts
 */

.layout-wide-right-sidebar #primary .panel .contents {
 border-left: 1px solid #ccc!important;
}

/**
 * Scheme-specific blocks
 */

body.tropo #shim-alpha {
 background: #fff;
 height: 84px !important;
 border-top: 0.5em solid #ecf6ff!important;
 border-bottom: 0.5em solid #114577!important;
}

/* generic classes */
body.tropo .disabled {
 color: #999 !important;
 background-color: #ddd !important;
 border-color: #ccc !important;
}
.read, .inactive {
 color: #888;
}
.read:hover {
 color: #000;
}
.read a, .inactive a {
 color: #999 !important;
}
.read:hover a {
 color: inherit !important;
}

.detail {
 color: #555!important;
}
.status-hint {
 color: #ccc!important;
}

.tablist .tab a {
 color: #114577!important;
 background: #ecf6ff!important;
 border-color: #c7e0f6!important;
}
.tablist .tab a:hover, .tablist .tab a.active {
 background: #c7e0f6!important;
}
.tab-header {
 background: #c7e0f6!important;
 border-color: #c7e0f6!important;
}
.tab-container {
 background-color:#fff!important;
 border: 1px solid #ecf6ff!important;
 border-top: none;
}

.action-bar {
 text-align: center;
 background-color: #c7e0f6!important;
}
.action-box .inner {
 background-color: #c5dff9!important;
 color: #114577!important;
 border: 1px solid #8fc3f7!important;
}

.select-list input, input.submit {
 color: #000!important;
 background: #c5dff9!important;
 border: 2px solid #ecf6ff!important;
 border-bottom: 2px solid #c7e0f6!important;
 border-right: 2px solid #c7e0f6!important;
}
.select-list input:active, input.submit:active {
 color: #eee!important;
 background: #aaccee!important;
 border: 2px solid #c7e0f6!important;
 border-bottom: 2px solid #ecf6ff!important;
 border-right: 2px solid #ecf6ff!important;
}


.highlight-box {
 border: 1px solid;
}
.highlight, .highlight-box {
 border-color: #7fa8d0!important;
 background-color: #c7e0f6!important;
 color: #000;
}
.inset-box {
 background-color: #fff!important;
 border-right: 1px solid #c7e0f6!important;
 border-bottom: 1px solid #c7e0f6!important;
 color: #777!important;
 padding: 3px 5px;
}
.warning-box {
 border: 1px solid #114577!important;
 background-color: #ecf6ff!important;
 color: #000;
}
.error-box {
 color: #000;
 background-color: #fcf6db!important;
 border: 1px solid #ffdfc0!important;
}

.odd, tr.odd th, tr.odd td {
 background-color: #ffffff!important;
}
.even, tr.even th, tr.even td {
 background-color: #efefef!important;
}
thead th, tfoot td {
 background-color: #ecf6ff!important;
}
.column-table tbody th {
 color: #777!important;
 background-color: #fbfbfb!important;
 border-right: 1px solid #cdcdcd!important;
}
table caption {
 color:#7fa8d0!important;
}

table.grid, table.grid td {
 border: 1px solid #999!important;
}

.select-list li, .NotificationTable td {
 border-color: #ccc!important;
}
.select-list li img {
 border-color: #c7e0f6!important;
}
.selected, .select-list li.selected, tr.selected td {
 background-color: #c7e0f6!important;
 border-color: #7fa8d0!important;
}

form, fieldset, legend, legend span {
 border-color: #c7e0f6!important;
}
.hint-input {
 color: #777!important;
 border: 1px solid #ccc!important;
}
.hint-input:focus {
 color: #000!important;
 border: 1px solid #999!important;
}
.multiple-select {
 background-color: #eee!important;
}

.simple-form .error input {
 border: 3px solid #ff0000!important;
}
.simple-form .error .error-msg {
 color: #ff0000!important;
 display: block;
}

.table-form table {
 background-color:#F7F7F7!important;
}

.section-nav {
 background-color: #c7e0f6!important;
}
.section-nav li a, .section-nav ul, .section-nav li, .section-nav-separator {
 border-color: #c7e0f6!important;
}
.section-nav-content {
 border-color: #c7e0f6!important;
}
.section-nav li.on {
 background-color: #ffffff!important;
}
.section-nav li a:visited {
 color: #114577!important;
}
.section-nav-inner-wrapper {
 background: url("http://img.photobucket.com/albums/v511/cassaru/grey-borderpixel.png") repeat-y scroll 134px 50% !important;
}

.collapsible .collapse-button {
 width: 20px;
}
.collapsible.collapsed .collapse-button {
 background-image: url("http://img.photobucket.com/albums/v511/cassaru/grey-arrow-right.png")!important;
}
.collapsible.expanded .collapse-button {
 background-image: url("http://img.photobucket.com/albums/v511/cassaru/grey-arrow-down.png") !important;
}

body.tropo .header {
 background: #ddd!important;
}
.subheader {
 background-color: #c7e0f6!important;
 border-bottom: 1px solid #7fa8d0!important;
}

.preview-image {
 border: 1px solid #fff!important;
}

/* contextualhover.css */
div.ContextualPopup div.Inner {
 background-color: #fff !important;
 color: #000 !important;
 border: 1px solid #c7e0f6!important;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
 color: #c7e0f6 !important;
}

.ippu {
 color: #000!important;
}
.ippu .track_title {
 color: #c7e0f6!important;
}

/**
 * Temporary page-specific styling
 * /
/* Comments */
.cmtbar.odd {
 border-bottom: 2px solid #bbddff!important;
 border-top: 2px solid #bbddff!important;
 border-left: 1px solid #bbddff!important;
 border-right: 1px solid #bbddff!important;
}
.cmtbar.even {
 border-bottom: 2px solid #aaccee!important;
 border-top: 2px solid #aaccee!important;
 border-left: 1px solid #aaccee!important;
 border-right: 1px solid #aaccee!important;
}
td.odd { background-color: #bbddff!important; }
td.even { background-color: #aaccee!important; }

/* inbox */
.folders a {
 color: #000!important;
 border: 1px solid #fff;
}
.folders a.selected {
 background: #c7e0f6!important;
 border-color: #7fa8d0!important;
}

.folders a:hover {
 border-color: #bbb!important;
 background: #eee!important;
}

/* profile.css */
.username {
 border-bottom: 1px solid #c7e0f6!important;
 background-color: #ecf6ff!important;
}

.section, .actions li {
 background-color: #ecf6ff!important;
 border-bottom: 1px solid #c7e0f6!important;
 border-left: 1px solid #c7e0f6!important;
 color: #000000!important;
}
.section span.section_link {
 color: #000!important;
}
.section_body .inner_section_header {
 color: #111!important;
}
.section_body_title {
 color: #111!important;
}
.profile th {
 color: #111!important;
}

/* lj_settings.css */
.section_head, div.username {
 background-color: #ecf6ff!important;
 color: #333!important;
 border-bottom: 1px solid #c7e0f6!important;
}
.field_block .field_name {
 color: #333!important;
 background-color: #eee!important;
}

/* esn.css */
body.tropo .CategoryRow td {
 border-bottom: 1px solid #ddd!important;
}

/* community/settings */
.community-settings legend {
 color: #7fa8d0!important;
 }

/* Shop pages */
.shop-item-highlight {
 border: 1px solid #7fa8d0!important;
}

/* entry.css */
a#lj_userpicselect {color: #c7e0f6!important;}
#lj_userpicselect_img {border: 1px solid #fff!important;}
#lj_userpicselect_img:hover {border: 1px solid #c7e0f6!important;}
#lj_userpicselect_img_txt {color: #c7e0f6 !important!important;}
#userpic_preview_image.userpic_loggedout {border: 1px solid #c7e0f6!important;}
.userpic_preview_border {border: 1px solid #ccc!important;}
#infobox {border-left: 1px solid #000!important;}
#compose-entry {border-bottom: 1px solid #bbb!important;}
#compose-entry ul li a {background-color: #fff;border: 1px solid #c7e0f6!important;border-bottom: none;}
#compose-entry ul li.on a {border-bottom: 1px solid #fff;}
#draft-container {border: 1px solid #bbb;border-top: none;}
#draftstatus {background-color: #fff;}
#spellcheck-results {border: 1px solid #c7e0f6!important;background-color: #fff;}
#htmltools {border-right: 1px solid #bbb;border-left: 1px solid #bbb;background: #fff;}
#htmltools ul {border-bottom: 1px solid #8d8d8d;}
#options, #public {border: 1px solid #bbb;background-color: #eee;}
#public {color:#666;}
#submitbar {background-color: #ddd;border: 1px solid #aaa;}

/* create flow */
.appwidget-createaccountprogressmeter .step-block-active { color: #fff; background-color: #7fa8d0;!important }
.appwidget-createaccountprogressmeter .step-block-inactive { color: #fff; background-color: #114577;!important }
.appwidget-createaccountprogressmeter .step-selected, .appwidget-createaccountprofile .header { color: #7fa8d0;!important }
.appwidget-createaccountprogressmeter .step-previous { color: #114577; }
.appwidget-createaccountprogressmeter .step-next { color: #666; }
.appwidget-createaccountprofile .field-name { background-color: #ecf6ff; }

/* lj_base-app.css */
hr.hr {
 color: #c7e0f6!important;
 background-color: #c7e0f6!important;
}
input.text,
textarea.text,
select.select {
 background: #fff url("/img/input-bg.gif") repeat-x 0 -1px;
 border: 1px solid #bbb;
 border-top: 1px solid #999;
 border-left: 1px solid #999;
}
.appwidget .more-link {
 color: #c7e0f6 !important;
 background: url('/img/arrow-double-black.gif') no-repeat 0 60%;
}
.arrow-link,
.more-link {
 background: url('/img/arrow-double-black.gif') no-repeat 0 50%;
}
.message {
 border: 5px solid #eee;
}
.message blockquote {
 border: 1px solid #aaa;
}
.helper {
 color: #666;
}
}