@charset "utf-8";
/*
  3EProfiler character sheet source file.
  Copyright (C) 2008 Myth-Weavers Games
  **
*/

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

/*
  Define the html root element, all elements will inherit from this
  element. Defining the td element is an Explorer hack.
*/

@charset "utf-8";
html, td {
	font: 9px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	background: white;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	line-height: 10px;
}

body {
	font: 9px Tahoma, Verdana, Arial, Helvetica, sans-serif;
}

/* Tips for Elastic layouts 
1. Since the elastic layouts overall sizing is based on the user's default fonts size, they are more unpredictable. Used correctly, they are also more accessible for those that need larger fonts size since the line length remains proportionate.
2. Sizing of divs in this layout are based on the 100% font size in the body element. If you decrease the text size overall by using a font-size: 80% on the body element or the #container, remember that the entire layout will downsize proportionately. You may want to increase the widths of the various divs to compensate for this.
3. If font sizing is changed in differing amounts on each div instead of on the overall design (ie: #sidebar1 is given a 70% font size and #mainContent is given an 85% font size), this will proportionately change each of the divs overall size. You may want to adjust based on your final font sizing.
*/

.pagecontainer {
	width: 8.5in;
	height: 10in;
	background: white;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: none;
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.oneColElsCtrHdr #header { 
	background: white;
    position: relative;
	float: left;
	width:8.5in;
} 
.oneColElsCtrHdr #header p {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	margin: 0;
	padding: 0;
	color: #666666;
}
.oneColElsCtrHdr #mainContent {
	background: white;
    position: relative;
	float: left;
	width:100%;
}
.oneColElsCtrHdr #heeler { 
	padding: 10px 0;
	margin: 0;
	position: relative;
	float: left;
	width: 100%;
	text-align:right;
} 

input {
  font-size: 13px;
  font-family: Tahoma, Verdana, Arial;
}

a:link {text-decoration:none; color:white;}
	
a:hover {text-decoration:underlined;}


/************************************************************************/
/* Input with default style, per half-inch in increment */

.inputxxs {
	width: .275in;
	margin: 0 0.01in;
}

.inputxs {
	width: .45in;
	margin: 0 0.01in;
}

.inputs {
	width: .995in;
	margin: 0 0.01in;
}

.inputm {
	width: 1.495in;
	margin: 0 0.01in;
}

.inputl {
	width: 1.995in;
	margin: 0 0.01in;
}

.inputxl {
	width: 2.495in;
	margin: 0 0.01in;
}

.inputxxl {
	width: 2.995in;
	margin: 0 0.01in;
}

.inputfull {
	width: 100%;
}

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

/* three column design */

.leftcol {
 width: 33%;
 height: 9in;
 position:relative;
 float:left;
 padding-right:.5em;
}

.midcol {
 width: 33%;
 height: 9in;
 position:relative;
 float:left;
}

.rightcol {
 width: 32%;
 height: 9in;
 position:relative;
 float:left;
 padding-left:.5em;
}

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

/* Basic character info CSS */

.info
{
  width: 100%;
  border: 0;
  padding: 0;
  margin: 0;
}
.info td
{
  padding: 0;
  margin: 0;
  text-align:left;
}
.info span
{
  letter-spacing: .1em;
  color: gray;
}
.info input
{
  border-style: solid;
  border-color: grey;
  border-width: 0 0 1px 0;
}
.info td.unit
{
  width: 12.5%;
}

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

/* Main CSS */

#stats
{
  width: 100%;
  position: relative;
  float:left;
}
#stats td.unitfive
{
  width: 20%;
}
#stats td.unitten
{
  width: 10%
}
#stats input
{
  width: 97%;
  text-align: center;
}
#stats td.top
{
  vertical-align: top;
}
#stats td.bottom
{
  vertical-align: bottom;
}
#stats td.header
{
  vertical-align: bottom;
}
#stats td.footer
{
  vertical-align: top;
}
#stats td.header
, #stats td.footer
, #stats td.title
{
  text-align: center;
  color: gray;
  background-color: white;
}
#stats td.tag
{
  vertical-align: middle;
  text-align: center;
  color: white;
  background-color: #333333;
  font-size: 14px;
  font-weight: bold;
  font-family: Arial, sans-serif;
}
#stats td.char
{
	width: 1em;
	text-align: center;
}

#stats span.help
{
  cursor: help;
}
#stats input.mod
{
  border: 1px solid grey;
}
#stats input.tempmod
{
  border: 1px solid #CCCCCC;
}
#stats input.notes
{
  border: none;
  border-bottom: 1px solid #CCCCCC;
  text-align: left;
  width: 100%;
}
#stats input.lines
{
	border:none;
  border-bottom: 1px solid grey;
  text-align: left;
  width: 100%;
}
#container .titletag {
  vertical-align: middle;
  text-align: center;
  color: white;
  background-color: #333333;
  font-size: 14px;
  font-weight: bold;
  font-family: Arial, sans-serif;
  margin-top: .05in;
  position: relative;
  float:left;
  width:100%;
}

.titletag {
  vertical-align: middle;
  text-align: center;
  color: white;
  background-color: #333333;
  font-size: 14px;
  font-weight: bold;
  font-family: Arial, sans-serif;
  margin-top: .05in;
  position: relative;
  float:left;
  width:100%;
}

.title {
	width: 100%;
}

/************** SKILLS */
.skills {
	width: 100%;
	position: relative;
	float:left;
}

.skills tr.title td
{
  font-size: 14px;
  font-weight: bold;
  font-family: Arial, sans-serif;
  color: white;
  background-color: #333333;
  vertical-align: middle;
  padding: 1px 1px 1px .5em;
}
#skillcontext
{
  font-size: 10px;
  visibility: hidden;
}
.skills tr.title span a
{
  color: white;
  background-color: transparent;
}
.skills tr.title span a:hover
{
  text-decoration: underline;
}
.header td
{
  text-align: center;
  vertical-align: bottom;
  color: #666666;
  padding-right:3px;
}
.skills tr.header td.name
{
  text-align: left;
  padding-left: 1em;
}
.skills tr.header span.help
{
  cursor: help;
}
.skills tr.skillslot td
{
  padding: 2px 2px 0 0;
}
.skills tr.skillslot td.name
{
  padding: 0 0px 0 0;
}
.skills tr.skillslot td.char
{
  width: .3em;
}
.skills tr.skillslot td.unit
{
  width: 3em;
}
.skills tr.skillslot td.unitsmall
{
  width: 1.25em;
}
.skills tr.skillslot input.text
{
  width: 100%;
  border-style: none;
  border-top: 1px solid white;
  border-bottom: 1px solid grey;
  font-size: 9px;
  text-align: center;
}
.skills tr.skillslot td.name input
{
  text-align: left;
  width: 8em;
  border: none;
}
.skills tr.skillslot input.chk
{
  height: 10px;

}
.skills tr.footer td
{
  color: gray;
  background-color: white;
  text-align: left;
}
.skills tr.footer td.total
{
  text-align: center;
}
.skills a
{
  color: black;
  background-color: white;
  text-decoration: none;
}
.skills a:hover
{
  text-decoration: underline;
}
/****/

#imgload
{
  width: 100%;
  position: relative;
  float: left;
}
#imgload td
{
  padding: 0;
}
#imgload #pic
{
  width: 125px;
  height: 193px;
  border: 1px solid grey;
  cursor: pointer;
}
#imgload td.loadtext
{
  padding-left: 1em;
  text-align: left;
}
#imgload input
{
  border: 1px solid black;
  text-align: center;
}
#imgload td.loadinputs
{
  width: 6em;
}

#save
{
  text-align: center;
}

textarea
{
  font-size: 12px;
  font-family: Arial, sans-serif;
  width:100;
  overflow:auto;
  position:relative;
  float:left;
  border: 1px solid grey;
}