
/**
 * THEME     WPS - Sober (Horde)
 * VERSION   2006-04-11
 *
 * AUTHOR    Mats Djärf <md@webbplatsen.se>
 *           WebbPlatsen i Sverige AB
 *           www.webbplatsen.se
 *
 * NOTE      styles marked with "???" means that I have not
 *           figured out were to use it ;)
 *
 *           Please contact the theme's author for any missing style.
 *
 * You will find more themes at http://www.w8.se/horde/
 *
 */


/**
 * GLOBAL DEFAULT STYLE
 */

body {
  font: normal 11px/14px tahoma, arial, verdana, sans-serif;
  color: #333;
  background: #fff /*url('graphics/bottom_bg.png') 0 0 repeat-x*/;
}
body.scrollbar-quirk {
    margin-right: 15px;
}
#NFcontent {
  display: none;
}

/**
 * THEME LOGO
 */
#themelogo {
    background-image    : url('graphics/design_by.gif');
    background-position : left;
    background-repeat   : no-repeat;
    height              : 50px;
    margin-left         : 5px;
    width               : 140px;
}

img {
    border         : none;
    vertical-align : middle;
}

/* Info box when you shall confirm delete in Kronolith */
.box {
    border             : 1px solid #95B3DE;
    background-color   : #FFFFCC;
    -moz-border-radius : 8px;
}

/* ??? */
.solidbox {
    border: 1px solid black;
    background-color : RED;
}

/* Box (Gollom use this style)  */
.greybox {
    border: 1px solid #666;
    background-color: #e9e9e9;
}

/* ??? */
.whitebox {
    border: 1px solid black;
    background-color: RED;/* white; */
}


/**
 * HEADER BOX
 * - Box when you view a calendar item for example
 */
.headerbox {
    border-left   : 0px;
    border-right  : 0px;
    border-bottom : 0px solid #CCC;
}

/* ??? */
.roundedBox {
    -moz-border-radius: 15px;
    background-color: RED; /* DEBUG */
}

/* ??? */
.roundedTop {
    -moz-border-radius-topright: 15px;
    -moz-border-radius-topleft: 15px;
    background-color: RED; /* DEBUG */
}

/* ??? */
.roundedBottom {
    -moz-border-radius-bottomright: 15px;
    -moz-border-radius-bottomleft: 15px;
    background-color: RED; /* DEBUG */
}

/* ??? */
.heading {
    color: #cce;
    background-color: RED; /* #446; */
    font-family: Verdana,Helvetica,sans-serif;
    font-weight: bold;
    font-size: 15px;
}

.nowrap {
    white-space: nowrap;
}

.clear {
    clear: both;
    line-height: 0;
    height: 0;
}


/* Transparency styles. */
.translucent30 {
    filter: alpha(opacity=30);
    -moz-opacity: 0.3;
    opacity: 0.3;
}
.translucent50 {
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}
.translucent70 {
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}
.opaque {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}


/**
 * LINKS
 *
 */

/* DEFAULT IF THERE IS NO STYLE */
a {
    color           : black;
    text-decoration : none;
}
a:hover {
    color           : #657DA6;
    text-decoration : none;
}


/**
 * SELECTED MARKUP
 */

/* COLUMN */
.selected {
    background: #e4f1ff url('header_th_sort_bg.gif') 0 0 repeat-x;
}

.selected-over {
    background-color : #CCEEFF;
}

/* ROW */
.selectedRow {
    background-color : #EFEFEF;
}
.selectedRow:hover {
    background-color: #FFFFDD;
}
.selectedRow-over {
    background-color: #ffffdd;
}

/*  */
.linedRow {
    color: black;
    background-color: white;
    border-bottom:    1px solid #eee;
    padding: 2px;
    padding-left: 7px;
}
.linedRowSelectedCol: {
    color: black;
    background-color: RED; /* #f3f3f3; */
    border-bottom: 1px solid #ddd;
    padding: 2px;
    padding-left: 7px;
}


/**
 * TABLE STYLES
 */
table {
    border: none;
/*    border-collapse: collapse;*/
}
td, th {
  font-size: 11px;
  font-family: tahoma, arial, verdana, sans-serif;
  padding: 1px;
}
table.nopadding td, table.nopadding th {
  padding : 0;
}

/**
 * WIDGET
 * - headers in Options, Kronolith (week view) etc
 */
.widget {
    color        : #3162A6;
    font-family  : Verdana,Helvetica,sans-serif;
    font-size    : 8pt;
}
a.widget:hover {
    color            : #657DA6;
    background-color : transparent;
}


/**
 * NOTICE
 * - notice message like; "(i) Your options have been updated."
 */
.notice {
    color              : black;
    font-size          : 8pt;
    font-family        : Verdana,Helvetica,sans-serif;
    background-color   : #FFFFCC;
    border             : 1px solid #666666;
    padding            : 1px;
    padding-left       : 5px;
    -moz-border-radius : 0;
}

/* ??? */
.outline {
    background-color:  RED;/* black; */
}



/**
 * TOP MENU
 */

#menu {
  color: black;
  font-weight: normal;
  background: #c6e1ff url("graphics/menu_bg.png") 0 0 repeat-x;
  font-family: tahoma, arial, verdana, sans-serif;
  border-bottom: 1px solid #a1b1e9;
  height: auto !important;
  height: 50px;
}
.sidebar #menu a,
.sidebar #menu a:hover {
  border: 0;
  margin: 0;
  padding: 0;
  background: none;
}
.sidebar #menu a img {
  margin: 9px 0 0 20px;
  padding: 0;
}

#menu ul {
  margin: 0;
  padding: 0 0 0 1px;
  height: 50px;
}

#menu li {
  float: left;
  margin: 0 0 0 -1px;
  height: 50px;
  list-style-type: none;
  text-align: center;
}

#menu a {
  float: left;
  color: black;
  font-weight: normal;
  font-family: tahoma, arial, verdana, sans-serif;
  display: block;
  white-space: pre;
  font-size: 11px;
  text-decoration: none;
  padding: 10px 7px 0;
  height: 40px;
  -moz-border-radius: 0;
}
#menu a:hover {
  border: 1px solid #a1b0e8;
  border-width: 0 1px;
  padding: 10px 6px 0;
  color: #3162A6;
  background: #b6d8ff url('graphics/menu_item_bg.png') 0 -100px repeat-x;
}
#menu a.current {
  border: 1px solid #a1b0e8;
  border-width: 0 1px;
  padding: 10px 6px 0;
  background: #f7de84 url('graphics/menu_item_bg.png') 0 0 repeat-x;
}
#menu h1 {
  font: normal 18px/50px arial, tahoma, verdana, sans-serif;
  color: #333;
}


/**********************************/



/**
 * HEADERS
 */

/***
th.header {
    color            : #3d4c64;
    background-color : #FFF;

}
***/

.header {
  color: #3d4c64;
  background: #e0edff url("graphics/header_bg.png") 0 0 repeat-x;
  font-family: tahoma, arial, verdana, sans-serif;
  font-weight: bold;
  font-size: 11px;
  padding: 3px 3px 3px 10px;
  height: 16px; /* 20px */
  border: 1px solid #a0b0e9;
  border-width: 1px 0;
}
.header img {
  vertical-align: middle;
}
div.header a {
    color            : #3d4c64;
}
div.header a:hover {
    color            : #657DA6;
}

a.header:hover {
    color            : #657DA6;
}
.header ul {
  font-size: 11px;
}

/* Headers when you compose an email for example */
.light {
    background-color : white; /* #bccfeb; *//* #95B3DE; */
    color            : black;
    font-family      : tahoma, arial, verdana, sans-serif;
    font-size        : 11px;
}

/* Sub headers */
.smallheader {
    color            : black;
    background-color : transparent;
    font-family      : tahoma, arial, verdana, sans-serif;
    font-size        : 11px;
}
.smallheader a:hover {
    color            : #657DA6;
}
.smallheader a {
    color            : black;
}
a.smallheader:hover {
    color            : #657DA6;
}

/* ??? */
.small {
    color: #aac;
    font-family: tahoma, arial, verdana, sans-serif;
    font-size: 11px;
}

/* Control - base body in "all" blocks etc */
.control {
    color            : #36A;
    background-color : transparent;
    border           : 0;
    border-top       : 0px solid RED;/* #DDE;  */
    /*border-left      : 2px solid #D6DEEC;
    border-right     : 2px solid #D6DEEC;*/
    /*border-bottom    : 2px solid #DDE;*/
    padding-left     : 5px;
    padding-bottom   : 3px;
    padding-top      : 3px;
}


/* Column headers in Kronolith, IMP for example */
.item {
  color: #3D4C64;
  background-color : #FFF;
  padding: 0;
  padding-left: 5px;
}

th.item {
  padding: 0;
  padding-left: 5px;
  background: #e8f4fe url("graphics/header_th_bg.png") 0 0 repeat-x;
}
th {
  border: 1px solid #b1c1f9;
  border-width: 1px 0;
  padding: 0;
  padding-left: 5px;
  background: #e8f4fe url("graphics/header_th_bg.png") 0 0 repeat-x;
}

.label {
    color            : red;
    background-color : blue;
    }


/* Keyboard short-cut */
.accessKey {
    text-decoration : underline;
}


/**
 * TEXT
 * - default text
 */
.text {
    color            : black;
    background-color : white;
}
.text-over {
    background-color : #657DA6;
}


/**
 * FORMS
 */
.form table {
  width: 100%;
  padding: 2px 0;
  border-collapse: collapse;
  background-color : white;
}

form {
/*    background-color : white !important;*/
    background-color : none;
}

.form-error {
    color : #f00;
}
.form-header {
    font-weight: bold;
}

input, textarea {
    font-family : tahoma, arial, verdana, sans-serif;
    font-size   : 11px;
    font-weight : normal;
    border      : 1px solid #999999;

    padding     : 2px;
    margin-top  : 2px;
    -moz-border-radius : 0;
}

/* Focus action  */
input:focus, textarea:focus {
    border           : 1px solid #6F6F6F;
    background-color : #FFFFCC;
}

/* select box */
input, select {
    font-family : tahoma, arial, verdana, sans-serif;
    font-size   : 11px;
    font-weight : normal;
}
input, option {
    padding     : 1px;
}
option {
    padding-right : 2px;
    font-size   : 11px;
}

.checkbox {
    border: 0;
    height: 14px;
    width: 14px;
    background-color: transparent;
}

/**
 * Button
 */

.button{
  font-family   : tahoma,verdana,arial,Sans-Serif;
  color         : #666;
  text-align    : center;
  font-size     : 9px;
  font-weight   : bold;
  text-transform: uppercase;
  border-top    : 1px solid #C4CCCC;
  border-left   : 1px solid #ACB5B5;
  border-bottom : 1px solid #6F7777;
  border-right  : 1px solid #ACB5B5;
  width         : auto;
  background    : url(graphics/button_bg.png) repeat-x;
  background-color : white;
  padding       : 2px 5px !important;
  padding       : 0px 0px;
  line-height   : 13px;
  margin-left   : 2px;
  cursor        : pointer !important;
  cursor        : hand;
  -moz-border-radius : 0px;
}

/* Focus action  */
.button:hover {

  font-family   : tahoma,verdana,arial,Sans-Serif;
  color         : #95B3DE;
  text-align    : center;
  font-size     : 9px;
  font-weight   : bold;
  text-transform: uppercase;
  border-top    : 1px solid #C4CCCC;
  border-left   : 1px solid #ACB5B5;
  border-bottom : 1px solid #6F7777;
  border-right  : 1px solid #ACB5B5;
  width         : auto;
  background    : url(graphics/button_bg.png) repeat-x;
  background-color : white;
  padding       : 2px 5px !important;
  padding       : 0px 0px;
  line-height   : 13px;
  margin-left   : 2px;
  cursor        : pointer !important;
  cursor        : hand;
  -moz-border-radius : 0px;
}

/**
 * PORTAL
 */
.summary {
    background-color: white;
}

/* Alternating styles. */
.item0 {
   background-color : white;
   border-bottom    : 1px solid #EEE;
}
.item1 {
   background-color : white;
   border-bottom    : 1px solid #EEE;
}

.fixed {
    font-size   : 11px;
    font-family : monospace, fixed;
}


/**
 *  EMAIL STYLES
 */
.signature {
    color: #ccc;
}
.signature-fixed {
    color: #ccc;
    font-size: 13px;
    font-family: monospace,fixed;
}
.citation {
    margin: 1em 0;
    padding-left: 1em;
    border-left-width: 1px;
    border-left-style: solid;
}

/* Quotes */
.quoted1 {
    color            : #008;
    border-left      : 2px solid #00F;
    border-right     : 2px solid #00F;
    background-color : #F5F5F5;
}
.quoted2 {
    color            : #800;
    border-left      : 2px solid #800;
    border-right     : 2px solid #800;
    background-color : #EBEBEB;
    margin-right     : 12px;
}
.quoted3 {
    color            : #080;
    border-left      : 2px solid #080;
    border-right     : 2px solid #080;
    background-color : #E1E1E1;
    margin-right     : 12px;

}
.quoted4 {
    color            : #808;
    border-left      : 2px solid #808;
    border-right     : 2px solid #808;
    background-color : #D7D7D7;
    margin-right     : 12px;
}
.quoted5 {
    color            : #088;
    border-left      : 2px solid #088;
    border-right     : 2px solid #088;
    background-color : #C5C5C5;
    margin-right     : 12px;
}


/**
 * TOOLTIP
 * - popup when you hover some items
 */
.tooltip {
    font-size          : 8pt;
    background-color   : #ffc;
    border             : 1px solid #000;
    padding            : 3px;
    -moz-border-radius : 3px;
}


/**
 * IN PROGRESS
 * - System message like;
 *   IMP > compose message: when you expand an email address
 *   and there is no match
 */
.inProgress {
    font-size        : 8pt;
    font-family      : Arial,Helvetica,sans-serif;
    color            : white;
    font-weight      : bold;
    background-color : red;
    padding          : 2px;
    padding-left     : 5px;
    padding-right    : 5px;
    border           : 1px solid #990000;
    border-left      : 3px solid #990000;
    border-right     : 3px solid #990000;

}

/**
 * SIDEBAR
 */
#sidebarPanel {
    padding-top      : 5px;
    padding-bottom   : 10px;
    background-color : transparent; /* #e8f1ff; */
    /* border-right     : 1px solid #95B3DE; */
    /* border-bottom    : 2px solid #95B3DE; */
    /* -moz-border-radius-bottomright: 15px; */
}
#sidebarPanel span {
    color           : black;
    white-space     : pre;
    font-family     : Verdana,Helvetica,sans-serif;
    font-size       : 8pt;
    text-decoration : none;
    padding         : 2px;
}
#sidebarPanel a:hover {
    color              : #657DA6;
    /* -moz-border-radius : 3px; */
}


/**
 * TABS
 */

.tabset { border-bottom: 1px solid #a0b0e9; margin: 0 0 10px; height: 24px; width: 100%; white-space: nowrap; font-weight: normal; background: none; }
.tabset ul { margin: 0; padding: 0 6px; list-style: none; }
.tabset ul li { display: inline; margin: 0 6px 0 0; padding: 0 0 0 4px; font-size: 11px; cursor: pointer; background: url('graphics/tabs-bg.png') repeat-x; }
.tabset ul li a, .tabset ul li a:link, .tabset ul li a:active, .tabset ul li a:visited, .tabset ul li a:hover { text-decoration: none; color: #000; }
.tabset ul li a { position: relative; display: inline; float: left; border: 0; -moz-border-radius: 0; margin: 0 -4px 0 0; padding: 0 8px 0 4px; height: 24px; line-height: 24px; vertical-align: bottom; background: url('graphics/tabs-bg.png') 100% 0 repeat-x; }
.tabset ul li:hover { background-position: 0 -100px; }
.tabset ul li a:hover { background-position: 100% -100px; background-color: transparent; }
.tabset ul li.activeTab, .tabset ul li.activeTab:hover { position: relative; margin-bottom: -1px; background-position: 0 -50px; }
.tabset ul li.activeTab a, .tabset ul li.activeTab a:hover { border: 0; height: 25px; background-position: 100% -50px; background-color: transparent; }





/**
 * HELP SECTION
 */
.help {
    background-color : #fff;
    color            : black;
}
.help h1 {
    color        : #666;
    border-top   : 1px solid #CCC;
    font-size    : 10px;
    padding-left : 0.5em;
}
.help h2 {
    color          : #3162A6;
    border-top     : 1px solid #CCC;
    padding-top    : 1em;
    padding-bottom : 1em;
    padding-left   : 0.5em;
}
.help p {
    margin-left   : 1em;
    margin-right  : 1em;
    margin-bottom : 1em;
}
.help em {
    display       : block;
    padding       : 5px;
    margin-left   : 1em;
    margin-right  : 1em;
    margin-bottom : 1em;
}
.help em.helpTip {
    color      : #090;
    background : #e0f0e0;
}
.help em.helpWarn {
    color      : #900;
    background : #f0e0e0;
}


/**
 * Source markup styles
 */
.parentheses {
    color: #2a6;
    font-weight: bold;
}
.comment {
    color: #aac;
}
.htag {
    color: #569;
    background: #d5d6da;
    font-weight: bold;
}
.metac {
    color: #0ff;
    background: #d5d6da;
}
.id {
    color: #e82;
    background: #e4e4e0;
}
.attr {
    color: #6af;
}
.value {
    color: #d46;
}
.color {
    color: #f57;
}
.eol {
    color: #26e;
}
.url {
    color: #962;
}
.file {
    color: #444;
    background: #fe4;
}
.class {
    font-style: italic;
}

/**
 * Preferences overview.
 */
.prefsOverview div {
    float: left;
    /* background-color : white;
    padding-top: 10px; */
}
.prefsOverview div div {
    /* padding-left: 10px; */
    width: 95%;
    }

.prefsOverview h2 {
    margin-bottom: 10px;
    color       : #3366AA;
    font-size   : 18px;
    font-weight : normal;
}
.prefsOverview dt a {
    display      : block;
    border       : 1px solid #ddd;
    border-left  : 1px solid #DDD;
    border-right : 1px solid #DDD;

    color            : #3d4c64;
    background-color : #bccfeb; /* #95B3DE; */
    background-image : url("graphics/header_bg.png");
    background-image : repeat-x;
    font-family      : Arial,Verdana,Helvetica,sans-serif;
    font-weight      : bold;
    font-size        : 8pt;
    padding          : 3px;
    padding-left     : 5px;
    height           : 13px;
}
.prefsOverview dt a:hover {
    color: #657Da6;
}
.prefsOverview dd {
    padding       : 5px;
    margin-bottom : 10px;
    color         : #000;
    font-size     : 8pt;
    background    : #fff;
    border-left   : 1px solid #DDD;
    border-right  : 1px solid #DDD;
    border-bottom : 1px solid #DDD;

}

/**
 * ROWS
 */
.rowEven {
    background-color: #fbfbfb;
    }

.rowOdd {
    background-color: #ebf4ff;
    }
.selectedRow, tr.selectedRow td {
    background: #dbebff;
}
#footer {
    margin-top: 5px;
    }
