body {
    color: #333;
    font-family: "Aldine-401 BT",Sylfaen,"Times New Roman", sans-serif;
    font-size: 16px;
    /*
    background-color: #000000;
    background-image: url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/background/cloudstrip.jpg");
    background-repeat: vertical;
    background-position: top center;
    */
}

#WhiteBg{
/*
    background-image: url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/background/halfclouds.jpg");
    background-repeat: no-repeat;
    background-position: top center;*/
}

input[type=submit] {
    color: white;
    background-color: #9e2133;
    border-color: #9e2133;
}

.Footer {
    border-color: #9e2133;
}

/* cloudstrip.jpg */

/************************ General Typography ***************/

h1 {
    font-family: Albertus Mt, Georgia, Serif;
    font-size: 1.8em;
    margin: .4em 0 .2em;
}

h3 {
    font-size: 1.1em;
    margin-top: 1.4em;
    font-weight: bold;
}

h1 + h3 {
    margin-top: .5em;
}

p {
    margin-top: .7em;
}

h3 + p {
    margin-top: 0;
}

h5 {
    margin-top: .9em;
    font-weight: bold;
}

h5 + p {
    margin-top: 0;
}

.ExampleText, .TableCaption {
    font-style: italic;
}

div.InputResponse {
    font-size: 1.1em;
    font-weight: bold;
    color: red;
    padding-bottom: .5em;
} 

/************************ Lists ***************/

.KeyPointList li {
    font-weight: bold;
    margin-left: 1em;
}

ul.KeyPointList {
    margin-top: .2em;
}

ul.KeyPointList + p {
    margin-top: .4em;
}

ul.PlainList {
    list-style: none;
}

ul.PlainList P {
    font-size: 1em;
}

p + ul.PlainList {
    margin-top: .4em;
}

/************************ Tables ***************/

table.RulesTable {
    margin: .2em 0 .4em;
    border: 1pt solid;
}

.RulesTable th {
    background-color: #333;
    color: white;
    font-weight: bold;
}

.RulesTable .EvenRow {
    background-color: #DDD;
}

.RulesTable td,.RulesTable th {
    padding: .2em .6em .2em .4em;
}

.RulesTable caption {
    font-style: italic;
    width: 100%;
}

.IncomeTable td {
  white-space: nowrap;
}


tr.IncomeTable td {
    padding-top: 1em;
    text-align: right;
    font-weight: bold;
}

#PurchaseTable {
    margin: .2em 0 .4em;
    border: 1pt solid;
}

#PurchaseTable th {
    background-color: #333;
    color: white;
    font-weight: bold;
}


#PurchaseTable td,#PurchaseTable th {
    padding: .2em .6em .2em .4em;
}

/************************ Top Grahics Bar ***************/

#MaelstromHeader {
    padding: 5px 5px 0;
}

#MaelstromHeader img {
    float: left;
    padding-bottom: 5px;
}

#MaelstromHeader .ErrorMessage {
    margin: 8px;
    float: right;
    width: 170px;
    height: 36px;
    border: 2pt solid #9e2133;
    padding: 7px 5px;
}

.LoginForm {
    margin: 8px .3em .5em 0;
    border: 2pt solid #9e2133;
    padding: 7px 8px;
    float: right;
}

.LoginForm input {
    margin-right: 5px;
    width: 80px;
}

#LoginButton {
    width: 2.5em;
}

.LoginForm a {
    font-size: .8em;
    margin: .3em 0 0 4px;
    display: block;
    min-width: 86px;
    line-height: .8em;
    float: left;
}

#WebsiteUnavailable {
    min-height: 36px;
    max-width: 250px;
    font-size: .6em;
    text-align: center;
}

#LogoutWizard {
    text-align: center;
    padding-top: 0;
}

/************************ Buttons ***************/

#PreviousButton {
    float: left;
    margin-left: 10px;
}

/************************ Top Navigation Bar ***************/

#TopNavigationBar  {
    color: #9e2133;
    /*border-bottom: none;
    border-top: none;*/
}

#TopNavigationBar a {
  color: #333;
  /*color: #FFFFFF;*/
}

#TopNavigationBar #FAQLink {
    display: none;
}

#TopNavigationBar #DownloadsLink {
    display: none;
}

#TopNavigationBar #CostumeLink {
    display: none;
}

/************************ Left Navigation Bar ***************/

#LeftNavigationBar {
    margin: 10px 0;
    padding: 5px 10px;
    border: 2pt solid #9e2133;
    width: 190px;
    /*background-color: #F0F0F0;*/
}

#LeftNavigationBar a {
    display: block;
    margin-bottom: .2em;
}

#LeftNavigationBar h1 {
    text-align: right;
}

#LeftNavigationBar a.CurrentPage {
    color: #000000;
    font-weight: bold;
    text-decoration: none;
}

#LeftNavigationBar h1 {
    display: none;
}

/************************ Left Baner Links ***************/

div.BannerLink {
    text-align: center;
    margin-bottom: 10px;
}

.BannerLink a {
    width: 210px;
    display: block;
    border: 2pt solid #9e2133;
}

/************************ Shopping basket ***************/

#ShoppingBasketTitle {
    color: white;
    background-color: #9e2133;
}

#ShoppingBasketContents {
    border: 2pt solid #9e2133;
}

/************************ Breadcrumb ***************/

#BreadCrumb {
    margin-top: .3em;
}

#BreadCrumb a {
    text-decoration: underline;
}


/************************ News ***************/
div.NewsArticle {
    margin: .5em 0 1.5em 0;
}

div.NewsArticle + div.NewsArticle {
    margin-left: 50px;
}

.NewsArticle h3 {
    margin-top: 0;
}

.NewsArticle p {
    margin-top: .2em;

}

.NewsArticle img {
    margin-top: .6em;
    width: 100px;
    margin-bottom: 3px;
    float: right;
}

.NewsArticle img.Right {
    margin-left: 6px;
}

img.NewsArticle {
    margin: .7em;
}

/************************ Tabbed controls ***************/


.tabBody {
    position: relative;
    border-left: 1pt solid;
    border-bottom: 1pt solid;
    border-right: 1pt solid;
    width: 698px;
    padding: 10px 0 20px;
    margin: 0 0 10px;
    float: left;
}

.tabBody label {
    float: left;
    text-align: right;
}

.tabBody input {
    float: left;
    margin-left: 10px;
    margin-right: 10px;
}

.tabBody .grid_5 label {
    width: 250px;
}

.tabBody .grid_4 label {
    width: 175px;
}

.tabBody .grid_3 label {
    width: 150px;
}

.tabBody .CostColumnHeader {
    font-weight: bold;
    text-align: right;
 }

.tabBody .grid_5 .CostColumnHeader {
    width: 302px;
}

.tabBody .grid_4 .CostColumnHeader {
    width: 236px;
}

.tabBody .grid_3 .CostColumnHeader {
    width: 202px;
}

.tabHead {
    margin-left: 0;
    margin-right: 0;
    float:left;
    width:100%;
    background:url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/buttons/bottom.png") repeat-x bottom;
    line-height:normal;
}

.tabHead ul {
    list-style:none;
}

.tabHead li {
    float:left;
    background:url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/buttons/greyleft.png") no-repeat right top;
    cursor: pointer;
}

.tabHead a {
    display:block;
    background:url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/buttons/greyright.png") no-repeat left top;
    padding:5px 8px 4px;
    color: #333;
}

.tabHead .Selected {
    background-image:url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/buttons/whiteleft.png");
}

.tabHead .Selected a {
    background-image:url("http://crew.profounddecisions.co.uk/resources/maelstrom/images/buttons/whiteright.png");
    padding-bottom:5px;
    font-weight: bold;
    color: #333;
}

/************************ Maelstrom Character Viewer ***************/

/*Hide bottom links */

.Maelstrom #CharacterListing #CharacterCreationLinks {
    display: none;
}

#MaelstromCharacterSummary, #MaelstromCharacterCreationSummary {
    min-width: 300px;
}

#CharacterViewerButtons input[type=submit] {
    margin-bottom: .8em;
    width: 140px;
}


/************************ Create Prayer ***************/

#PrayerSubmissionForm label {
    display: block;
    margin: .7em 0 .2em;
}

#PrayerSubmissionForm input[type=submit] {
    margin-right: .8em;
}
   

/************************ Maelstrom Character Creation ***************/

#MCCAdvantages input,text-area {
    margin-top: 5px;
}

#MCCAdvantages label {
    margin-top: 5px;
    float: left;
    width: 105px;
    margin-right: 5px;
    text-align: right;
}

#MCCAdvantages fieldset {
    border-top: 1px solid #333;
    padding-left: 0.3125em;
    margin: 0.3125em 0 .5em;
}

#MCCAdvantages .grid_2 {
    margin-right: 0px;
}

.ErrorMessage {
    /*width: 470px;*/
    margin:  0 0 5px 5px;
}

.Ceremonial, .Craft, .Necromancy, .Theurgy, .Alchemy, .Sorcery, .Talismancy, .Career, .Melee, .Contrabando, .Magic {
    display: none;
}

#MCCSkillsBody label.ItemCost {
    text-align: left;
    width: 25px;
}

#MCCPriceListBody label.ItemCost {
    text-align: left;
    width: 75px;
}

#MCCPriceListBody .grid_5 .CostColumnHeader {
    width: 332px;
}

#MCCPriceListBody .Alchemy .CostColumnHeader,#MCCPriceListBody .Talismancy .CostColumnHeader {
    visibility: hidden;
}

#MCCPriceListBody div div.ErrorMessage {
    clear: left;
    margin-left: 100px;
    width: 250px;
}

#CharacterSummarySaveInstructions {
    float: left;
    margin-left: 20px;
}

#MCCConfirmation p.ErrorMessage {
    margin:0.7em 0 0.7em 0;
}

#MCCConfirmation #SaveButton {
    float: none;
}

#MaelstromCharacterCreationSummary tr td:first-child {
    padding-right: 0.3em;
    text-align: right;
}

/************************ Campaign pages ***************/

div.Right {
    float: right;
}

.SmallFont {
    font-size: .8em;
}

.MaelstromCampaignInset {
    border: 4px double #333;
    margin-left: .5em;
    margin-right: .5em;
}

div.MaelstromCampaignInset {
    padding: .5em;
    margin-top: 1em;
    background-color: #EEEEEE;
}

.MaelstromCampaignImage span {
    display: block;
    margin: 0;
}
    
.MaelstromCampaignImage {
    margin: 1em .5em .1em;
    text-align:center;
    font-weight: bold;

}

.MaelstromCampaignInset p:first-child {
    margin-top: 0;
}

.MaelstromCampaignInset h3:first-child {
    text-align: center;
    font-weight: bold;
    margin-top: 0;
}

.MaelstromCampaignInset h1:first-child {
    text-align: center;
    margin-top: 0;
}

#RecruitsWanted {
    font-family: cursive, "Aldine-401 BT",Sylfaen,"Times New Roman", sans-serif;
    margin-top: 2em;
    font-size: .8em;
}

.MaelstromCampaignInset td {
    padding: .2em 1.5em 0 .5em;
}

#MalathianVerse,#MalathianHireRates {
    font-size: .9em;
}

#MalathianVerse pre {
    margin-top: 1em;
}

#MalathianVerse div pre:first-child {
    margin-top: 0;
}

#ExcerptEpicLeft,#ExcerptEpicRight {
    font-size: .7em;
    width: 320px;
    float: left;
}

#ExcerptEpicLeft {
    margin-right: 15px;
}

.MaelstromCampaignCommandment {
    border: 4px double #333;
    padding: 0 .5em .5em;
    margin-top: 1em;
}

.MaelstromCampaignCommandment h1, .MaelstromCampaignCommandment h3 {
    margin-top: .1em;
}

#WeightsAndMeasures th {
    font-weight: bold;
    padding: 1.2em 0 0;
    width: 18em;
}

#WeightsAndMeasures td.Left {
    padding-left: .3em;
}

#WeightsAndMeasures td.Right {
    padding-right: .3em;
}

/************************ Downtime pages ***************/

img.MaelstromMapTile, input.MaelstromMapTile {
    border-top: 1pt solid black;
    border-left: 1pt solid black;
}

table.MaelstromMapTile {
    border-bottom: 1pt solid black;
    border-right: 1pt solid black;
}
