@import "colors.css";

A {
   font-weight: bold;
}

div.back, div#back {
        padding-right: 10px;
        margin-right: 0px;
	margin-top: 1ex;
	text-align: right;
        font-size: smaller;
}

div#booktitle {
	text-align:right;
}

div#toc {
	position: absolute; 
	left: 1%;
	top: 1em;
	font-size: smaller;
	width: 15%;
	padding-bottom: 1em;
	border: thin groove;
	padding-left: 2%;
	padding-right: 2%;
}

div#toc div.tocchapter {
	font-weight: bold;
	font-size: larger;
}

div#toc > h1 {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	font-weight: bold;
	font-size: larger;
	text-decoration: underline;
}

abbr.card , abbr.contract {
    white-space: nowrap;
    border: none;
}

div#body {
	position: absolute;
	left:22% ;
	top: 2em;
	width: 75%;
}

/* The blue bar above and below each article, pointing to
   the next and previous articles, as well as the "book title" */
table.prevandnext {
    padding:0;
    margin:0;
    font-size: smaller;
    width: 100%;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    color: inherit;
}

table.prevandnext tr td.middle {
    width: 40%;
    padding: 0;
    margin:0;
    text-align:center;
}

table.prevandnext tr td div.signature {
    margin: 0;
    border: 0;
    padding: 0;
}

table.prevandnext tr td.prev {
    width: 30%;
    text-align: left;
}

table.prevandnext tr td.next {
    width: 30%;
    text-align: right;
}


/* In the "next and previous" bar, don't underline the links */
table.prevandnext tr td a {
    text-decoration: none;
}

/* In the index frame, don't underline links */
body.toc a {
    text-decoration: none;
}

/* 
   Because HTML doesn't like to have tables in the middle of <p> tags,
   I've got my <bridge:p> tags translated to <div class="paragraph" tags.
*/
div.paragraph {
    margin-top: 1em;
}

table.datatable  {
    margin-left: auto ;
    margin-right: auto 
}

/* The "body" division is the main text of the article, seperate
from the "previous and next" bars and the signature/copyright. */
div.body {
    clear: left;
    width: 90%;
    padding-left: 5%;
    padding-right: 5%;
    padding-bottom: 1em;
}


/* The signature in the contents window */
div.tocsignature {
    border-top: 1px solid;
    font-size: smaller;
    padding-top: 1ex;
    text-align: right;
}

/* The signature in an article */
div.signature {
   padding-top: 1em;
   padding-bottom: 1em;
   border-top: thin groove;
   text-align: center;
   font-size: smaller;
}

/* The "body" part of the contents frame */
div.tocindex {
    border-top: thin groove;
    font-size: smaller;
}

/* A single contents entry - indented */
div.tocentry {
    margin-left: 2em;
    text-indent: -1em;
    margin-bottom: 0.2em;
}

span.tag {
   font-weight: bold;
   color: red;
   font-size:smaller;
}

/* Make header info in diagrams smaller */
div.diagheader {
    width: 16ex;
    border: thin outset;
    padding-left: 1.5em;
    font-size: smaller;
    text-indent: -1em;
    vertical-align: top;
}

/* Header font information for a hand */
div.handheader {
    font-size: smaller;
    margin-left:auto;
    margin-right:auto;
    text-align: center;
    border-bottom: 1px solid;
    padding-bottom: 3px;
}

/* Font information for cards played in the current trick 
	- large, bold, blue */
span.played {
	font-size: large ;
	font-weight: bold ;
}

td.diagramtopleft { width: 30%; }
td.diagramnorth { width: 40%; }
td.diagramwest td.diagrameast { width: 40%; }
td.diagramcenter { width: 20%; }
td.diagramsouth { width:40%; }
td.diagrambottomleft { width: 30%; }
td.diagrambottomright { width: 30%; }

/**
Google Chrome fix for layout?

tr.north td.north { width: 40%; }
tr.north td { width: 30%; }
tr.eastwest td.east, tr.eastwest td.west { width: 40%; }
tr.eastwest td { width:20%; }
tr.south td.south { width:40%; }
tr.south td { width:30%; }
*/

/* Holdings, inline hands, and bids should not have line breaks in them */
span.holding , span.call, span.contract {
	white-space: nowrap;
}

/* Control spacing in deals and hands */
table.hand, table.deal, table.dealwithheader {
    width: auto;
    padding: 0;
    border: 0;
}

table.dealwithheader tr td.diagramtopleft {
    text-align: left;
    vertical-align: top;
    padding: 0 1ex 0 0;
    margin: 0;
}

div.dealer, div.vul, div.scoring, div.source {
    margin-top:0;
    margin-bottom: 2px;
}

table.hand tr td {
    padding: 0;
    border: 0;
    margin: 0;
}

table.deal {
    width:60ex;
    margin-bottom: 1ex;
    margin-top: 1ex;
}

table.dealwithheader {
    width:60ex;
    margin-bottom: 1ex;
    margin-top: 1ex;
}

/* Test division - used in http://thomaso.best.vwh.net/bridge/deals/test/ */
div.test {
    margin-top: 1em;
    border-top: thin groove;
}

pre.testcode {
   width: auto;
   margin-left: 10px;
   margin-right: 10px;
   padding-left: 10px;
   padding-right: 10px;
   border: thin groove;
   // font-size: smaller;
}

div.testoutput {
   margin-left: 10px;
   margin-right: 10px;
   padding: 10px;
   border: thin groove;
}

div.testnote {
   padding-top: 1em;
}

pre.auction {
}

table.deal tr td , table.deawithheader tr td {
     margin: 0;
     padding:0;
}

td.auctionannotation div {
   margin-left: 1em;
   margin-right: 1em;
   margin-top: 1ex;
   margin-bottom: 1ex;
   font-size: smaller;
   font-style: italic;
}

table.auctiontable { width: 16em; margin-left: 1em;}
table.auctiontable tr.heading td { 
    vertical-align: top; 
    padding-bottom: 0;
    font-style: italic;
}

table.auctiontable tr td { width: 25%; padding: 0; text-align: left; }

table.auctiontable tr { vertical-align: bottom; }

table.auctionplusnotes td.notes { width: auto; padding-top: 1ex;}

div.auctionnote {
    font-size: 80%;
    margin-left: 2em;
    text-indent: -1em;
    padding-top: 2px;
}

span.footnotetag { font-size: 80%; vertical-align: super; }