/*
 * www.portknocking.org
 * Main CSS File
 * 
 * copy and paste at will
*/

/*
div {
border: 1px solid black
}
div div {
border: 1px dashed black
}
div div div {
border: 1px solid red
}
div div div div {
border: 1px dashed red
}
div div div div div {
border: 1px solid blue
}
*/

body {
voice-family: "\"}\""; voice-family:inherit;
font-family: verdana, sans-serif;
background: #fff;
}

table,td {
font-size: 100%;
}

body,table,td,h1,h2,h3,h4,h5,h6,div,span {
padding: 0;
margin: 0;
}

p {
margin: 0.25em 0.5em;
padding: 0.25em 0.5em;
}

div#submenu {
position: relative;
font-size: 70%;
font-weight: normal;
text-align: left;
border-bottom: 4px solid #416fa4;
clear:right;
}

div#submenu a {
font-weight: normal;
color: #fff;
padding: 3px 0.5em;
margin-left: 0.25em;
background: #739ac7;
border: 1px solid #416fa4;
}

div#submenu a:hover {
font-weight: normal;
background: #76baff;
}

div#submenu a.selected {
font-weight: normal;
color: #416fa4;
background: #fff;
border-bottom: 1px solid #fff;
}
div#submenu a.selected:hover {
font-weight: normal;
color: #416fa4;
background: #fff;
border-bottom: 1px solid #fff;
}

hr {
color: #416fa4;
clear: both;
}

ul,li {
padding: 0.25em 0;
margin: 0.5em 0 0.5em 1em;
list-style-image: url(listbox.gif);
list-style-type: circle;
}

ul {
padding: 0.25em 0 0.75em 0;
}

.small {
font-size: 80%;
}

img {
border: none;
}

img.dictionary {
vertical-align: center;
padding: 0;
margin: 0;
}
div.watermark {
	position: absolute;
	left: 5px;
	top: 5px;
}
div.copyright {
	position: absolute;
	right: 5px;
	top: 5px;
}
div.diagram {
	position: relative;
	left: 50px;
	text-align: center;
	padding-top: 10px;
	border: 1px solid #416fa4;	
	margin: 2em 0 2em 0;
	width: 400px;
}
div.caption b {
	color: #ffffff;
	text-transform: uppercase;
}
div.caption {
	background-color: #76baff;
	border-top: 3px solid #416fa4;
	padding: 0.5em 1em 0.5em 2em;
	font-size: 75%;
	text-align: right;
}
img.diagram {
	padding: 0 15px 0 15px;
}


a {
text-decoration: none;
color: #416fa4;
font-weight: bold;
}
a:hover {
background: #f0bb5f;
}

a.imglink:hover {
background: none;
}

.large {
font-size: 110%;
}

.def {
	font-weight: bold;
}
div#page {
position: relative;
margin: 10px;
}

img#mastheadl {
position: absolute;
left: 0;
top:0;
}
img#mastheadr {
position: absolute;
right: 0;
top: 0;
}
img#mastheadt {
position: absolute;
left: 175px;
bottom: -9px;
}
img#mastheads {
position: absolute;
left: 650px;
bottom: -9px;
z-index: 55;
}

div#masthead {
position: relative;
height: 42px;
background: url("/images/masthead-center.png");
padding: 0;
margin: 0;
}

div#topstrip {
font-size: 70%;
padding: 0.25em 1em 0.25em 0;
text-align: right;
height: 15px;
border-bottom: 2px solid #416fa4;
border-top: 2px solid #416fa4;
}

div#bottomstrip {
text-align: right;
background: #f0bb5f;
padding: 2px 1em 2px 1em;
border-top: 2px solid #416fa4;
font-size: 10px;
height: 12px;
clear: all;
color: #9f7c3e;
}

div#main {
position: relative;
/*height: 100%;*/
/*border: 1px solid green;*/
}

div#tab {
z-index: 50;
position: absolute;
top: -15px;
left: 200px;
}
div#notontv {
z-index: 50;
position: absolute;
top: -55px;
left: 5px;
}

/* SIDEBAR and links */

td#sidebar { 
background: #76baff;
border-right: 2px solid #416fa4;
width: 150;
font-size: 100%;
vertical-align: top;
padding-bottom: 2em;
padding-top: 6em;
}

td#sidebar .note {
padding: 2em;
color: #416fa4;
font-size: 70%;
}

td#sidebar a {
display: block;
font-weight: bold;
text-align: center;
color: #416fa4;
font-size: 80%;
padding: 0.5em;
margin: 0.5em 1em 0.5em 1em;
}

td#sidebar h1 {
text-transform: uppercase;
text-align: center;
margin: 1em 1em 1em 1em;
padding-bottom: 0.25em;
/* border-bottom: 1px solid #416fa4; */
}

td#sidebar a:hover {
background: #f0bb5f;
}
td#sidebar a.selected {
color: white;
background: #416fa4;
}
td#sidebar a.selected:hover {
color: white;
background: #416fa4;
}

div#bottompane {
margin: 0;
padding: 1em 0 0em 1em;
}

div#bottompane p {
/*margin: 1.0em 1.5em;*/
}

div#toppane {
position: relative;
z-index: 0;
background-color: #416fa4;
color: #ffffff;
border-right: 1px solid #416fa4;
/*margin: -50px 0 -2px -2em;*/
padding: 3em 0em 0em 2em;
}

div#toppane #leader a {
color: #f3e381;
}
div#toppane #leader a:hover {
background: #76baff;
color: #fff;
}
div#toppane h1 {
color: #fff;
}

div#leader {
padding: 1em 0em 1em 0em;
margin: 1em;
font-size: 80%;
}

div#leaderpull {
position: relative;
z-index: 10;
font-size: 75%;
float: right;
width: 25em;
border: 1px solid #000;
padding: 0em 1em 0.5em 1em;
margin: 0 1em 1em 1em;
background-color: #fff;
color: #000;
}

div#leaderpull * li {
padding: 0;
margin: 0 0 0 1em;
}
div#leaderpull ul {
padding: 0;
margin: 0 0 0 1em;
}
div#leaderpull p {
padding: 0.5em 0;
margin: 0;
}


td#content {
vertical-align: top;
/*padding: 50px 0em 2em 2em;*/
/*border: 1px solid red;*/
margin-bottom: 0;
width: 100%;
}

/* HEADINGS */

pre {
font-size: 90%;
margin: 1em 0.25em 1em 2em;
padding: 1em;
background: #eeeeee;
border: 1px solid #cccccc;
}
pre.geek {
padding: 1em;
background: none;
border: none;
font-size: 90%;
}

h1 {
color: #416fa4;
text-transform: uppercase;
font-size: 110%;
font-style: bold;
/*padding-bottom: 1em;*/
/*border-bottom: 1px solid #416fa4;*/
}
h2 {
margin: 1.0em 0 0.5em 0;
text-transform: uppercase;
color: #9f7c3e;
font-size: 90%;
margin-left: 1em;
font-style: bold;
}

h3{
margin: 0.75em 0 0.75em 0;
color: #333333;
font-size: 90%;
margin-left: 1em;
font-style: bold;
}

.comment {
	color: #888888;
}

code {
	color: #444444;
	
}

h4,h5,h6{
margin: 1.5em 0 1.5em 0;
text-transform: lowercase;
font-size: 80%;
margin-left: 1.5em;
font-style: bold;
}

.datestamp {
font-size: 80%;
color: #999999;
padding: 1em 0 1em 0;
text-align: right;
}

/* PULL QUOTE */

.pull { 
width: 25em;
border-left: 2px solid #416fa4;
border-top: 10px solid #416fa4;
padding: 0em 0em 1em 1em;
margin: -1.25em 0em 1em 1em;
float: right;
font-size: 80%;
}

div#content .pull p {
/*margin: 0.5em;
padding: 0.5em;
padding-left: 0.5em;*/
}

*.pull h1 {
border-left: 1em solid #416fa4;
border-right: 5em solid #416fa4;
margin-left: -1em;
margin-bottom: 1.5em;
padding: 0.25em 0 0.25em 1em;
background-color: #739ac7;
color: #fff;
clear: all;
}

*.pull h2 {
padding: 0.5em 0 0.5em 0em;
color: #9f7c3e;
}


/* crumbs */

div#crumbs {
position: absolute;
z-index:10;
top: 25px;
right: 2em;
width: 545px;
text-align: right;
color: #fff;
font-size: 70%;
}
div#crumbs a {
padding: 0 0.25em 0 0.25em;
color: #fff;
}

div#documentation h1 {
color: #416fa4;
text-transform: uppercase;
font-size: 110%;
font-style: bold;
border-bottom: 1px solid #416fa4;
}

div#documentation hr {
display: none;
}

div#documentation ul,li {
padding:0 0 0 0.25em;
margin:0 0 0 1em;
}
div#documentation pre {
font-size: 100%;
margin: 0;
background: #ffffff;
border: none;
padding: 0;
}

div#knockform * td {
padding: 0.5em 0 0.5em 0;
vertical-align: top;
}

.fieldtitle {
padding-right: 0.5em;
text-transform: uppercase;
font-size: 80%;
font-weight: bold;
color: #666666;
}
.fieldeg {
font-size: 70%;
color: #888888;
}
div#knockform * td.fielddesc {
font-size: 70%;
border: 1.5px solid #666666;
border-bottom: none;
padding: 0.5em 1em 0.5em 1em;
color: #666666;
background-color: #efefef;
}

div#errorlist {
border: 1px solid #bd102a;
background-color: #eee5e6;
padding: 1em;
margin: 1em;
}

.errortitle {
color: #bd102a;
font-weight: bold;
}

.errors {
color: #bd102a;
font-size: 80%;
}

.question {
font-weight: bold;
}

.answer {
padding-bottom: 1em;
border-bottom: 1px solid #ccc;
}

.hot {
text-transform: uppercase;
color: #ff504b;
font-weight: bold;
letter-spacing: 0.2em;
}

.pbounded {
border-bottom: 2px solid #416fa4;
padding-bottom: 1.5em;
margin-bottom: 0.5em;
}

div.pull table {
border-bottom: 1px solid #ccc;
font-size: 80%;
margin: 0;
}
div.pull table * td {
padding: 0.25em 0.5em;
}

div.pull table tr.header td {
border-bottom: 1px solid #ccc;
font-weight: bold;
text-align: center;
}

div.pull table tr.headerlabel td {
border-bottom: 1px solid #ccc;
text-align: center;
}
div.pull table tr.data td {
text-align:center;
}

div.pull table * td.label {
text-align: right;
}

p.quote {
margin: 1em 10em 1em 4em;
padding-left: 1em;
font-size: 90%;
border-left: 1px solid #416fa4;
color: #416fa4;
}

.pullimg { 
width: 400px;
border-left: 2px solid #416fa4;
border-top: 10px solid #416fa4;
padding: 0em 0em 1em 1em;
margin: 0em 0em 1em 1em;
float: right;
font-size: 80%;
}

div#implementations table {
padding: 0.5em;
margin: 1em;
border: 1px #416fa4;
border-style: solid none;
font-size: 90%;
}

div#implementations table th {
font-style: bold;
text-transform: uppercase;
text-align: center;
font-size: 90%;
padding: 0.2em;
}

div#implementations table td {
padding: 0.2em;
border-bottom: 1px solid #ccc;
}

div#implementations table td.notes {
font-size: 80%;
}
div#implementations table td.annot {
font-size: 80%;
color: #aaa;
border: none;
}

div#implementations table td p {
padding: 0.5em 0;
margin: 0;
}

div#implementations table td p.quote {
color: #666;
border: none;
}


.center {
text-align: center;
}