/* These classes are used for form inputs like text inputs, textareas, and etc. */

.roster-inputs
{
}

.roster-inputs-max
{
	width: 100%;
}

.roster-inputs-file-hint
{
	font-size: 80%;
}

/* This class is used for all types of form buttons such as submit buttons. */

.roster-buttons
{
}

.roster-buttons:hover
{
	cursor: pointer;
}

/* These classes are used for check boxes and radio boxes. */

.roster-checkbox
{
}

.roster-checkbox:hover
{
	cursor: pointer;
}

label:hover
{
	cursor: pointer;
}

/* This class is used specifically for combo boxes. */

.roster-combobox
{
}

/* This class is used in forms in the rare occasion that the form is not in an edit table. */

.roster-form-caption
{
	font-weight: bold;
}

/* These blocks are used for results, errors, and warnings. */

.roster-result-header,
.roster-error-header,
.roster-warning-header,
.roster-notice-header
{
	margin-top: 0.5em;
	margin-bottom: -1px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 80%;
}

.roster-result-content,
.roster-error-content,
.roster-warning-content,
.roster-notice-content
{
	border: 1px solid;
	margin-bottom: 1.5em;
}

.roster-result-content p,
.roster-error-content p,
.roster-warning-content p,
.roster-notice-content p
{
	margin: 0.5em;
}

/* For showing errors. */

.roster-error
{
}

/* For options or features that are disabled. */

.roster-disabled
{
}

/* This is used for displaying the "Formatting" tip at the bottom of a textarea. */

.roster-formatting
{
	text-align: right;
	font-size: 80%;
}

/* This class is used for notes, which are explanatory text added to other elements. */

.roster-note
{
	font-size: 80%;
}

/* A horizontal rule, placed on a div. */

.roster-hr
{
	margin-top: 15px;
	margin-bottom: 15px;
	padding: 0;
	height: 1px;
	font-size: 1px;
	border-top: 1px solid;
}

/* These classes are used for lists of things, such as lists of members or lists of search results. */

/* This is a container table to hold everything together. */
.roster-list-outer
{
	width: 100%;
}

.roster-list
{
	width: 100%;
	border: 1px solid;
	border-collapse: collapse;
}

.roster-list th
{
	text-align: left;
	border: 1px solid;
	padding: 1px;
	padding-left: 4px;
}

.roster-list th a
{
	text-decoration: none;
}

.roster-list-row1 td,
.roster-list-row2 td,
.roster-memberlist-alternate-row1 td,
.roster-memberlist-alternate-row2 td
{
	border: 1px solid;
	padding-left: 4px;
	padding-right: 6px;
	padding-top: 0;
	padding-bottom: 1px;
}

/* This is used when the list has no entries at all. */
.roster-list-none
{
	border: 1px solid;
	padding: 2em;
	text-align: center;
}

/* This row is used to display form controls for operating on the list as a whole. */
.roster-list-submit
{
	border: 1px solid;
}

/* These TD classes are used in the submit row only when there is a submit orders checkbox. */
.roster-list-orders
{
	padding-left: 2em;
	padding-right: 2em;
}

/* This header is above the normal header. */
.roster-list-header
{
	font-size: 80%;
	text-align: right;
}

.roster-list-header span
{
	padding-left: 2px;
}

.roster-list-header img
{
	/* Can't solve this CSS bug by setting these to block because they need to be inline */
	/*margin-bottom: -3px;*/
}

/* These classes are used on the edit tables, for editing various fields.  We mark each TH and TD separately because there are sometimes embedded tables that would otherwise get hit as well. (Also in CSS declaring a generic class to go on a TD overrides any specific class assigned to that TD.) */

.roster-edit
{
	width: 100%;
	border-collapse: collapse;
}

.roster-edit-th,
.roster-inline-th
{
	padding: 1px 2px;
	padding-left: 4px;
	font-weight: bold;
	text-align: right;
	width: 1%;
	white-space: nowrap;
}

.roster-edit-td,
.roster-inline-td
{
	padding: 1px 4px;
}

.roster-edit ul,
.roster-inline ul
{
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 1.5em;
	padding: 0;
}

.roster-edit li,
.roster-inline li
{
	margin-top: 0;
	margin-bottom: 0;
}

/* Dividers between rows */
.roster-edit-divider-th
{
	border: 1px solid;
	border-right: 0;
}

.roster-edit-divider-td
{
	border: 1px solid;
	border-left: 0;
}

.roster-edit-divider-td div,
.roster-edit-divider-th div
{
	font-size: 4px;
	height: 4px;
}

/* Alternative way that puts a line down the center:

.roster-edit-divider-th,
.roster-edit-divider-td
{
	border: 0;
	padding-top: 4px;
}

.roster-edit-divider-td div,
.roster-edit-divider-th div
{
	font-size: 4px;
	height: 4px;
	border-top: 1px solid;
}
*/

/* Hint text TDs below the row that the hint is for. */
.roster-edit-hint-th
{
	padding: 0;
}

.roster-edit-hint-td
{
	padding: 1px 6px;
	padding-top: 0;
	padding-bottom: 0.5em;
	font-size: 80%;
}

/* "(Add ___)" links. */
.roster-edit-add
{
	font-size: 90%;
}

.roster-edit-submit .roster-edit-td
{
	padding: 0.5em 4px;
	padding-bottom: 4px;
}

/* These classes are used for grouping controls in a relatively small box, usually with a header, like a modal dialog. */

.roster-dialog
{
	border: 1px solid;
}

.roster-dialog-header
{
	text-align: left;
	border-bottom: 1px solid;
	font-weight: bold;
	padding: 1em;
	padding-top: 0;
	padding-bottom: 0;
}

.roster-dialog-content
{
	padding: 1em;
	padding-bottom: 0;
}

.roster-dialog-content p
{
	margin-top: 0;
}

.roster-dialog-th
{
	padding: 1px 2px;
	padding-left: 4px;
	font-weight: bold;
	text-align: right;
	width: 1%;
	white-space: nowrap;
}

.roster-dialog-td
{
	padding: 1px 4px;
}

.roster-dialog-submit
{
	text-align: center;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

.roster-dialog-note
{
	padding-top: 1em;
}

/* Entries list. This is a list of things such as companies, games, etc. Generally this consists of a bar down the left side with stuff on the right. */

.roster-entries
{
	border-collapse: collapse;
}

.roster-entries-th
{
	border: 1px solid;
	padding: 2px;
}

.roster-entries-td
{
	border: 1px solid;
}

.roster-entries-name
{
	padding-left: 4px;
	padding-right: 0.5em;
	font-weight: bold;
	font-size: 120%;
}

.roster-entries-body
{
	margin: 0;
	padding: 0;
	padding-left: 1em;
	padding-right: 1em;
	padding-bottom: 0.5em;
}

.roster-entries-body ul
{
	margin-top: 0;
	padding-top: 0;
}

.roster-entries-showall
{
	text-align: right;
	font-size: 80%;
}

.roster-entries-span
{
	cursor: pointer;
	border: 1px solid;
}

.roster-entries-img
{
	cursor: pointer;
	vertical-align: baseline;
}

.roster-entries-description
{
	text-align: justify;
	margin-top: 1em;
	margin-bottom: 1em;
}

.roster-entries-desc-header
{
	margin-top: -0.5em;
	margin-bottom: 1em;
	font-weight: bold;
	font-size: 105%;
}

.roster-entries-list-header
{
	margin-top: 1em;
	font-weight: bold;
}

.roster-entries-list
{
	max-height: 24em;
	overflow: auto;
}

.roster-entries-list-item
{
	margin-left: 2em;
}

.roster-entries-bullet
{
}

.roster-entries-divider-th div,
.roster-entries-divider-td div
{
	height: 5px;
	font-size: 5px;
}

/* These styles are used on tables such as the config table and the history which have a gray sidebar and lines between each entry. */

.roster-editlist
{
	width: 100%;
	border: 1px solid;
	border-collapse: collapse;
}

.roster-editlist-th
{
	border: 1px solid;
	padding: 1px 2px;
	padding-left: 4px;
	padding-top: 3px;
	font-weight: bold;
	width: 1%;
	white-space: nowrap;
}

.roster-editlist-td
{
	border: 1px solid;
	padding: 1px 4px;
}

.roster-editlist-row1
{
}

.roster-editlist-row2
{
}

.roster-editlist ul
{
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 1.5em;
	padding: 0;
}

.roster-editlist-hint
{
	border: 1px solid;
	font-size: 80%;
	padding: 1px 2px;
	padding-top: 3px;
}

.roster-editlist-submit td
{
	text-align: center;
}

/* These classes are used as a horizontal bar at the top of certain tables which frequently contain links. */

.roster-header th
{
	text-align: left;
	padding-left: 4px;
	padding-bottom: 1px;
}

.roster-header td
{
	vertical-align: top;
}

.roster-header-left
{
	text-align: left;
	padding-left: 4px;
}

/* Operation buttons on the right side. */
.roster-header-buttons
{
	text-align: right;
}

.roster-header-buttons span
{
	padding-bottom: 1px;
	padding-right: 2px;
}

/* These classes are used as a horizontal bar at the bottom of certain tables which frequently contain links and/or page numbers. */

.roster-footer
{
}

.roster-footer-td
{
	border: 1px solid;
}

/* "Page 1 of 1" text. */
.roster-footer-page-count
{
	text-align: left;
	padding-left: 2px;
}

/* Displays the current time zone */
.roster-timezone
{
	text-align: right;
	font-size: 80%;
}

/* List of pages on footer. */
.roster-footer-pages
{
	text-align: right;
}

.roster-footer-page-previous,
.roster-footer-page-next,
.roster-footer-page-num,
.roster-footer-page-current
{
	padding-left: 8px;
	padding-right: 8px;
	border-left: 1px solid;
}

/* "Showing n members" footer */
.roster-footer-showing
{
	font-size: 80%;
}

/* This class is used to display the "return to" links that are displayed at the bottom of most pages. */

.roster-backlinks
{
	margin-top: 2em;
}

.roster-backlinks ul
{
}

.roster-backlinks li
{
}

/* These classes are used for debugging information.  Regular users will never see these. */

.roster-admininfo
{
	border: 1px solid;
	font-size: 80%;
	padding: 0.5em;
}

.roster-adminerror
{
	border: 1px solid;
	font-size: 80%;
	padding: 0.5em;
}

/* These classes are used for the login header in loginheader.php. */

.roster-loginheader-main
{
	font-size: 90%;
	text-align: right;
	padding-right: 4px;
}

.roster-loginheader-name
{
	padding-bottom: 4px;
}

.roster-loginheader-options
{
	font-size: 90%;
}

.roster-loginheader-portrait
{
	background-color: black;
}

/* These classes are used for the search box in searchheader.php. */

.roster-searchheader
{
	margin-top: 1em;
	margin-bottom: 1em;
	padding-left: 6px;
	padding-right: 6px;
}

.roster-searchheader input
{
	font-size: 90%;
}

.roster-searchheader-input .roster-inputs
{
	width: 10em;
}

.roster-searchheader-submit
{
	text-align: right;
}

/* These classes are specific to member lists. */

.roster-memberlist-alternate-row1 td
{
	font-size: 90%;
}

.roster-memberlist-alternate-row2 td
{
	font-size: 90%;
}

.roster-memberlist-alternate-row1 .roster-memberlist-title
{
	font-size: 75%;
}

.roster-memberlist-alternate-row2 .roster-memberlist-title
{
	font-size: 75%;
}

.roster-memberlist-name
{
}

.roster-memberlist-alternate-name
{
	padding-left: 1.5em !important;
}

.roster-memberlist-title
{
	font-size: 80%;
	padding-left: 1em;
}

.roster-memberlist-isalternate
{
	font-style: italic;
}

.roster-memberlist-isremoved
{
	font-style: italic;
}

/* Styles specific to member.php */

.roster-member-sidebar,
.roster-member-sidebar-edit
{
	border-collapse: collapse;
	border: 1px solid;
	margin-right: 0.5em;
}

.roster-member-sidebar ul,
.roster-member-sidebar-edit ul
{
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 1.5em;
	padding: 0;
}

.roster-member-sidebar
{
	float: left;
	width: 50%;
	margin-right: 1em;
	margin-bottom: 0.5em;
}

.roster-member-sidebar-edit
{
	width: 98%;
}

.roster-member-sidebar-td
{
	width: 50%;
	min-width: 20em;
}

.roster-member-edit-table
{
	width: 100%;
}

.roster-member-edit-table .roster-inputs,
.roster-member-edit-table .roster-inputs-max,
.roster-member-edit-table .roster-combobox
{
	 width: 100%;
}

.roster-member-top-th
{
	padding: 1px 2px;
	padding-left: 4px;
	font-weight: bold;
	text-align: right;
}

.roster-member-top-td
{
	padding: 1px 4px;
}

.roster-member-name
{
	font-size: 140%;
	font-weight: bold;
	text-align: left;
	padding-top: 4px;
	padding-left: 14px;
}

.roster-member-title
{
	font-size: 90%;
	font-style: italic;
	padding-bottom: 1.5em;
	padding-left: 2em;
}

.roster-member-portrait
{
	width: 1%;
	padding-right: 8px;
	padding-left: 8px;
}

.roster-member-no-portrait
{
	width: 100px;
	height: 100px;
	border: 1px solid;
}

.roster-member-top-divider-th
{
	border: 1px solid;
	border-right: 0;
}

.roster-member-top-divider-td
{
	border: 1px solid;
	border-left: 0;
}

.roster-member-top-divider-td div,
.roster-member-top-divider-th div
{
	font-size: 4px;
	height: 4px;
}

.roster-member-unverified
{
	font-size: 90%;
	font-style: italic;
}

.roster-member-bio
{
	text-align: justify;
}

.roster-member-bio-header
{
	font-weight: bold;
	font-style: italic;
	text-align: center;
}

.roster-member-bio-none
{
	padding-top: 4em;
	text-align: center;
}

.roster-member-submit-table
{
	margin-top: 1.5em;
	width: 75%;
}

.roster-member-submit
{
}

.roster-member-submit-orders
{
	margin-top: 0.3em;
	margin-left: 1em;
}

/* These classes are specific to the company page. */

.roster-company ul
{
	margin-top: 0;
	padding-top: 0;
}

.roster-company-header
{
	margin-bottom: 1em;
}

.roster-company-header-th
{
	padding-left: 8px;
}

.roster-company-header-td
{
	padding-left: 2px;
}

.roster-company-op
{
	margin-top: -0.5em;
	margin-bottom: 1em;
}

.roster-company-h1
{
	padding: 0;
	margin: 0;
	margin-bottom: 0 !important;
}

.roster-company-slogan
{
	padding-left: 2em;
	font-style: italic;
	margin-bottom: 0.5em;
}

/* These classes are used for the game page. */

.roster-game-logo
{
	margin-top: 1em;
	margin-bottom: 0.5em;
}

/* This specific class is used on the edit positions page. */

.roster-positions-desc
{
	font-size: 80%;
	margin-top: 0.5em;
	height: 6em;
}

/* These classes are specific to the admin page. */

.roster-admin-list li
{
	margin-top: 1em;
	margin-bottom: 1em;
}

.roster-admin-list a
{
	font-weight: bold;
}

/* These classes are specific to the pending members page. */

.roster-flagged
{
}

/* These classes are specific to the history page. */

.roster-historylist-admininfo
{
	font-style: italic;
}

/* These classes are used on the configuration page. */

.roster-config-tr .roster-editlist-td
{
	width: 50%;
}

.roster-config-tr .roster-inputs
{
	width: 100%;
}

/* These classes are specific to the backup page. */

.roster-backup
{
	width: 75%;
}

/* These are used to shrink-wrap and center the lists in the backup dialogs. */
.roster-backup-half
{
	width: 50%;
	margin: 1em;
}

.roster-backup-shrinkwrap
{
	margin: 1em;
}

.roster-backup-shrinkwrap ul
{
	margin-top: 0;
	margin-bottom: 0;
}

/* These classes are used in the admin/edit.php page. */

.roster-admin-edit
{
	width: 96%;
}

.roster-admin-edit-right
{
	padding-left: 8px;
}

.roster-admin-edit-right .roster-inputs,
.roster-admin-edit-right .roster-inputs-max,
.roster-admin-edit-right .roster-combobox
{
	 width: 100%;
}

.roster-admin-edit-lists
{
	padding-left: 2px;
	padding-right: 4px;
	width: 18em;
}

/* Specific to the install.php page. */

.roster-install
{
	width: 10%;
	border: 1px solid;
	border-collapse: collapse;
}

.roster-install td
{
	white-space: nowrap;
}

.roster-install-submit
{
	text-align: center;
}

/* Specific to award-related pages. */

.roster-awards-add-desc
{
	font-size: 75%;
	height: 8em;
}

/* Used to display the "View All" link at the top of the page. */

.roster-h2-op
{
	margin-top: -1em;
	margin-bottom: 1em;
}

/* These classes are used to display the end-user help page. */

.roster-help-toc
{
}

.roster-help-dl p
{
	margin-top: 0.3em;
	margin-bottom: 0.7em;
}

.roster-help-dl dt
{
	margin-top: 1.5em;
	font-weight: bold;
	margin-left: 20px;
}

.roster-help-dl dd
{
	margin: 0;
	padding: 0;
	margin-left: 20px;
}

.roster-help-q, .roster-help-a
{
	font-weight: bold;
	font-size: 150%;
	float: left;
	margin-left: -20px;
	clear: both;
	font-style: italic;
}

.roster-help-q
{
	margin-top: -0.4em;
}

.roster-help-a
{
	margin-top: -0.3em;
}

/* These classes are used for the requested pop-up windows for selecting a member. */

.roster-popup-list li
{
	margin-top: 0;
	margin-bottom: 0;
}

.roster-popup-alphabet a
{
	text-decoration: none;
	padding-left: 4px;
	padding-right: 4px;
	padding-top: 1px;
	padding-bottom: 1px;
	border: 1px solid;
}