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

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

html {
	font-size: 	9px;
	color: 		black;
	background-color: white;
	font-family: 	Arial, Helvetica, sans-serif;
}

body {
    margin:     auto;
    width:      780px;
}

#buttons {
    position: fixed;
    margin: 0px;
    padding: 4px;
    background: #f6ffb8;
    border: 1px solid #c1b44a;
    right: 20px;
    top: 20px;	
}

#processing {
    position: fixed;
    right: 20px;
    top: 90px;
    display: none;	
}

input {
    font-size: 12px;    
}

textarea {
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;    
}

br.clear {
	clear: both;
}

div.page {
    clear:      both;
    page-break-before: always;
}

div.attr {
    float: left;
    margin-right: 3px;
    text-align: center;
    color: #000000;
}

.textleft {
    text-align: left !important;
}

.textright {
    text-align: left !important;
}

div.total {
	width: 50px;
	text-align: center;
}

div.defensetotal {
	width: 50px;
	text-align: center;
}

span.smalllabel {
    font-size: 7px;
    color: #888;
}

span.mediumlabel {
    font-size: 12px;
    font-weight: bold;
    color: black;
}

span.largelabel {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    color: black;
}

input.large {
    width: 200px;
}

input.medium {
    width: 100px;
}

input.small {
    width: 50px;
    text-align: center;
}

input.xsmall {
    width: 40px;
    text-align: center;
}

input.tiny {
    width: 32px;
    text-align: center;
}

input.xtiny {
    width: 15px;
    text-align: center;
}

input.xxtiny {
    width: 7px;
    font-size: 9px;
    text-align: center;
}

.whole {
    width: 99%;	
}

.full {
    width: 215px;    
}

.half {
    width: 85px;    
}

.third {
    width: 65px;    
}

.quarter {
    width: 41px;    
    text-align: center;
}

.fullpower {
    width: 190px;    
}

.shortpower {
    width: 150px;    
}

div.itemlabel {
    float: left;
    width: 40px;
    margin: 6px 0px 0px 0px;
}

div.powertitle {
    float: left;
    margin: 4px 0px 0px 0px;
    width: 55px;
    font-size: 8px;
}

div.powertitletwo {
    float: left;
    margin: 4px 0px 0px 2px;
    width: 40px;
    font-size: 8px;
}

div.powercheck {
    float: left;
    width: 50px;
}

div.powerchecktwo {
    float: left;
    width: 70px;
}

div.powercheck input, div.powerchecktwo input {
    margin: 0px 0px 0px 0px;	
}

textarea.racefeatures {
    height: 170px;  
}

textarea.classfeatures {
    height: 260px;  
}

textarea.languages {
    height: 80px;  
}

textarea.equipment {
    height: 260px;  
}

textarea.money {
    height: 50px;  
}

textarea.notes {
    height: 210px;
}

textarea.privatenotes {
    height: 200px;
}

textarea.feats {
    height: 305px;  
}

input.cash {
    width: 60px;
    text-align: right;
}

div.cashtitle {
    float: left;
    width: 105px;
    text-align: center;	
}

input.tall {
    height: 30px;
    font-size: 20pt;
    text-align: center;	
}

div.defence {
    clear: both;
    margin: 6px 0px 6px 0px;
    height: 55px;   
}

div.row {
    clear: both;
    margin: 6px 0px 6px 0px;
}

div.ability {
	clear: both;
	background: black;
	height: 22px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}

div.caracs {
	clear: both;
	background: black;
	height: 23px;
	margin-bottom: 0px;
	padding: 1px 0px 0px 1px;
	width: 100%;
}

div.weapons {
	clear: both;
	background: black;
	height: 97px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}


div.caracsRecapArmor {
	clear: both;
	background: black;
	height: 30px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}

div.armor {
	clear: both;
	background: black;
	height: 24px;
	margin-bottom: 10px;
	padding: 1px 0px 0px 1px;
}

div.talents {
	clear: both;
	background: black;
	height: 22px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}

div.skills {
	clear: both;
	background: black;
	height: 28px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}


div.spells {
	clear: both;
	background: black;
	height: 100px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}

div.actions {
	clear: both;
	background: black;
	height: 22px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}


div.objects {
	clear: both;
	background: black;
	height: 22px;
	margin-bottom: 0px;
	padding: 3px 0px 0px 3px;
}


div.last {
    margin-bottom: 3px;
    padding-bottom:3px;	
}

div.heading {
    background: white;
    font-weight: bold;
    color: black;
    height: 12px;
}

div.ability p.label {
    font-size: 10pt;
    margin: 3px;
    color: white;
    font-weight: bold;
}

div.caracs p.label {
    font-size: 10pt;
    margin: 3px;
    color: white;
    font-weight: bold;
    width: 12%;
}

div.ability p.heading {
    margin: 3px;
    font-weight: bold;
}

div.armor p.heading {
    margin: 3px;
    font-weight: bold;
}

div.caracs p.heading {
    margin: 3px;
    font-weight: bold;
    width:9%
}

div.caracs p.headingRecapArmor {
    margin: 3px;
    font-weight: bold;
    height: 30px;
    width:14%
}

div.ability .quarter {
    float: left;
    width: 22%; 
}

div.caracs .quarter {
    float: left;
    width: 9%; 
}

div.caracs .recapArmor {
    float: left;
    width: 14.5%; 
}

div.armor .type {
    float: left;
    width: 78%;
    margin: 0px 0px 0px 0px;
}

div.armor .points {
    float: left;
    width: 19%;
	margin: 0px 0px 0px 0px;
}

div.armor .advancedType {
    float: left;
    width: 45%; 
}

div.armor .advancedBurden {
    float: left;
    width: 10%; 
}

div.armor .advancedCoverage {
    float: left;
    width: 20%; 
}

div.armor .advancedPoints {
    float: left;
    width: 19%; 
}

div.talents .talentName {
    float: left;
    width: 30%; 
}

div.talents .talentDescription {
    float: left;
    width: 65%; 
}

div.objects .objectName {
    float: left;
    width: 43%; 
}
div.objects .objectBurden {
    float: left;
    width: 10%; 
}
div.objects .objectLocalisation {
    float: left;
    width: 43%; 
}

div.objects .maxBurden {
    float: left;
    width: 44%;
    color: #000000;
}


div.skills .title {
    float: left;
    width: 48%; 
}

div.skills .carac {
    float: left;
    width: 12%; 
}

div.skills .acquired {
    float: left;
    width: 5%; 
}

div.skills .acquiredLabel {
    float: left;
    width: 13%;
    text-align: left;
}

div.skills .tenPercent {
    float: left;
    width: 5%; 
}

div.skills .twentyPercent {
    float: left;
    width: 5%; 
}

div.skills .bonus {
    float: left;
    width: 11%; 
}

div.skills .total {
    float: left;
    width: 11%; 
}

div.skills p.label {
    font-weight: bold;
    color: #ffffff;
    vertical-align: middle;
}

div.spells .name {
    float: left;
    width: 24%; 
}

div.spells .ingredient {
    float: left;
    width: 24%; 
}
div.spells .difficulty {
    float: left;
    width: 10%; 
}
div.spells .duration {
    float: left;
    width: 30%;
}
div.spells .description {
    float: left;
    width: 93%; 
}

div.spells p.description {
color: #ffffff}

div.skill {
    clear: both;
    height: 22px;
}

div.skilltitle {
    clear: both;
    height: 12px;
}

p.skillname, p.skillnamelabel {
    float: left;
    width: 65px;
    margin: 5px 2px 0px;
    padding: 0px;
}

p.skillnamelabel {
    margin: 0px 2px;	
}

p.skillbonuslabel {
    float: left;
    width: 32px;
    margin: 0px 0px 0px 2px;
    text-align: center;
}

p.skilllabel {
    float: left;
    width: 23px;
    margin: 0px 0px 0px 2px;
    text-align: center;
}

p.skillattr {
    float: left;
    width: 18px;
    margin: 5px 0px;
    padding: 0px;
}

input.skilltiny {
    float: left;
    width: 18px;
    height: 16px;
    margin: 0px 0px 0px 2px;
    text-align: center;
}

input.skillbonus {
    float: left;
    width: 27px;
    height: 16px;
    margin: 0px 0px 0px 2px;
    text-align: center;
}

.skillnopenalty {
    float: left;
    width: 17px;
    height: 17px;
    margin: 0px 0px 0px 2px;
    padding: 5px 0px 0px 5px;
}

.noborder {
    border: none !important;
    padding: 2px;
}

.bottomborder {
	padding: 2px 2px 3px 2px;
}

/* Generic Heading Settings */
h2 {
    font-size:      17px;
    background:     black;
    color:          white;
    margin:         1px;
    padding-left:   2px;
    text-align:     center;
    font-variant:   small-caps;
    text-transform: lowercase;
    width:          100%;
}

h2.private {
    font-size:      17px;
    background:     grey;
    color:          white;
    margin:         0px;
    padding-left:   2px;
    text-align:     center;
    font-variant:   small-caps;
    text-transform: lowercase;
}

/* Generic Heading Settings */
h3 {
    font-size:      11px;
    background:     black;
    color:          white;
    margin:         0px;
    padding-left:   2px;
    text-align:     center;
    font-variant:   small-caps;
    text-transform: lowercase;
    float:          left;
    width:          100%;
}

#pic {
    vertical-align: bottom;
    border:         solid 1px #ccc;
    width:          215px;
    height:         215px;
}

/* Generic Section Stuff */
div.section {
    width: 100%;
    display: block;
    clear: left;
}

div.section span.actionsList{
    font-size: 12pt;
}


div.column {
    width: 32%;
    float: left;
    margin-right: 3px;  
}

div.twocolumn {
    width: 64%;
    float: left;
    margin-right: 3px;  
}

.right {
    float: right;
}

p.top {
	display: inline;
    vertical-align: top;    
}

input.smallcheck {
    margin: 2px 2px 2px 0px;	
}

.oddbg {
    background: #ddd;	
}


/* =========================================================== */
/* =========================================================== */
/* =========================================================== */
/* =========================================================== */

/* Footer Settings */
#footer
{
    clear: both;
    font-size: 9px;
    background-color: white;
    color: gray;
}
#save
{
    text-align: center;
}

input[readonly] {
    background: #e4e4e4;
    border: 1px solid #7F9DB9;
    padding: 2px;
}