/***** Base CSS Style ******/
/* Inspired by A List Apart*/

@import "common/screen.reset.css";
@import "common/screen.type.css";
@import "common/screen.form.css";

/*
 * Put common colors here
 * ------------------------
 * Black        :   #000000
 */

/** So IE plays nice **/
li, blockquote, dl, dt {zoom:1}
 
/* Typography */

h1 {
    font-size: 1.85em;
    margin: 1em 0;
}

#application-wrapper {
    font-size: .75em;
    width:630px;
}

#application-wrapper table {
    font-size: .9em;
}

/* General Styling */

body {
    padding: 2em;
}

table.standard td,
table.form-table td {
    padding: 3px;
}

table.standard th,
table.form-table th {
    font-weight: bold;
    text-align: center;
}

table.standard tr.even td {
    background-color: #eee;
}

/** Tables **/

table.standard {
    width: 100%;
    border-collapse: collapse;
}

table.standard td,
table.standard th {
    border: 1px solid #ccc;
}

table.standard th {
    background-color: #bbb;
}

table.standard th,
table.standard th a {
    font-weight: bold;
    text-align: left;
    padding: 3px;
}

table.standard th a {
    text-decoration: underline;
}

table.standard thead th {
    color: #333;
    text-align: center;
    background-color: #aaa;
}

table.standard tr.even th {
    background-color: #ccc !important;
}

table.standard td {
}

table.standard tr.even {
    background-color: #ccc;
}

table.standard tr.odd {
    background-color: #ddd;
}

/** Menu **/

.logout-link {
    float: right;
    font-size: .95em;
    margin: 0;
}

#menu {
    margin: 0;
}

#menu li.tab {
    display: block;
    float: left;
    padding: 5px 50px 5px 5px;
    margin-right: 5px;
    border-style: solid;
    border-width: 1px 1px 0 1px;
    border-color: #666;
    background-color: #eee;
}

#menu li.tab a {
    text-decoration: none;
}

#menu li.active {
    background-color: #fff;
}

ul li.tab .heading {
    color: #333;
    font-weight: bold;
    text-decoration: underline;
}

ul li.tab {
}

ul li.tab .sub-menu {
}

.sub-menu {
    display: none;
	position: absolute;
    list-style-type: none;
    background-color: #D7D7D7;
    margin-top: 15px;
    width: 200px;
    border-top: 1px solid #bbb;
    padding: 0 2px;
}

html body .sub-menu li a:hover {
    text-decoration: none !important;
    background-color: #eee;
}

/** Make IE Behave **/
html > body .sub-menu {
    margin-top: 0;
}

.sub-menu li {
}

.sub-menu li a {
	width: auto;
    color: #000 !important;
	font-weight: normal;
    display: block;
    padding: 5px;
    border-bottom: 1px solid #bbb;
}

.sub-menu li a:hover {
    text-decoration: underline !important;
}

.sub-menu h2 {

    display: none;

}

/** Taken from legacy app */

/* General styles */
.icon
{
    line-height: 16px;
    height: 16px;
    vertical-align: middle;
}
.private
{
    background-color: #FFEFEF;
}
.note
{
    font-weight: normal;
    font-size: 75%;
}
.valign_middle
{
	vertical-align: middle;
}
.calendar
{
    line-height: 16px;
    vertical-align: middle;
    text-decoration: none;
    font-size: 75%;
}
.calendar:hover
{
    text-decoration: underline;
}
.calendar img
{
}
img
{
    border: none;
}

.table_list
{
    margin: 5px auto 5px auto;
}
.table_list td
{
    padding: 3px;
}
.clear_left
{
    clear: left;
}

/* Calendar */
.display_day
{
	font-weight: bold;
    background-color: #FFF8DD;
    border-top: 1px solid #FFE78A;
    border-bottom: 1px solid #FFE78A;
	padding: .2em;
	font-size: 125%;
}
#calendar_list
{
	font-size: 90%;
}
#calendar_list .event
{
    margin: .3em .3em .3em .3em;
	padding: .2em;
}

/* Member styles */

.member_preview, .member_options
{

    border: 1px solid #eee;
    margin: 2em 0 0 2em;
    padding: 1em;

    display: block;
}
.member_preview:hover, .member_preview:focus
{
    border: 1px solid #666;
    background: transparent url(../images/click_to_activate.gif) no-repeat left top;
}
.captain
{
    background-color: #FFEFEF;
    color: inherit;
}
.member_options dt, .member_options dd
{
	width: 25%;
	float: left;
}
.member_options dt
{

    font-weight: bold;
}
.member_options dl
{
    margin: 1em;
}
.delete
{
    color: #f00;
}
.teamlist
{
    padding: 0 1em 1em 1em;
    margin: 1em 0 0 0;
    border-bottom: 1px dashed #999;
}
.preview
{
    padding: .5em;
    margin: .5em;
    border: 1px solid #999;
    background-color: #f9f9f9;
}

#profile_view p strong
{
	display: block;
}

table.form td {
    padding: 3px !important;
}

/** Forms */
label.required {
    text-decoration: underline;
}

form .error {
    background-color: #FF6F6F;
    color: white;
    padding: .2em;
}

/* located in demo.css and creates a little calendar icon
 * instead of a text link for "Choose date"
 */
a.dp-choose-date {
	float: left;
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 5px 3px 0;
	display: block;
	text-indent: -2000px;
	overflow: hidden;
	background: url(../images/icons/calendar.png) no-repeat; 
}
a.dp-choose-date.dp-disabled {
	background-position: 0 -20px;
	cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
	width: 140px !important;
	float: left;
}

#album-list .album {
    background-color: #eee;
    border-style: solid;
    border-color: #ccc;
    border-width: 1px 0;
    padding: 1em;
    margin: 1em 0;
}

#TB_Image {
    border-style: none !important;
}

#photo-list .photo {
    width: 100px;
    height: 180px;
    float: left;
    padding: 10px;
}

#photo-list .team-album {
    margin: 1em 0;
    padding: .5em;
    background-color: #eee;
    clear: both;
}