/* Styles for HowTo documents
** $Id: howto-screen.css 28 2010-08-10 00:19:48Z  $
*/

/*******************************************************************************
** HTML Elements
**
** Note: em sizes are based on browsers using a default text size of 16px 
** (see http://www.alistapart.com/articles/howtosizetextincss)
*/
p code  {
    font-size:0.875em; /* 14px */
    margin:1.286em 0;
}

/* screenshots get shrunk, uniformly, to 2/3 of the page width */
p.screenshot	{
	text-align:center;
}
img.screenshot	{
	border:1px solid #888;
	width:31.25em; /* 500px */
	height:26.4375em;   /* 423 px */
}

/*******************************************************************************
** Classes
*/

/* for displaying contents of files */
.file, .shell	{
	padding: 0.643em;
	border: 1px dashed #888;
	color: black;
	background-color: #eee;
	font-family: 'Courier New', Courier, monospace;
	font-size: 0.875em;
	margin:0.643em;
    white-space:pre;
    text-align:left;
}

/* For shell input */
.shell  {
    font-weight:bold;
}

/* for shell feedback */
.feedback {
    font-weight:normal;
}

.note, .warning    {
	margin:0.643em 0;
	padding:0.643em;
}

.warning    {
	border: 1px solid #fc3;
	color: #000;
	background-color: #ff0;
}

.note {
	border: 1px solid #ccc;
	color: #000;
	background-color: #ddd;
}

.note h3, .warning h3 {
	font-size: 0.875em; /* 16x0.875=14px */
	margin: 0 0 0.643em 0; /* 14x0.643=9px */
}

.note p, .warning p {
	font-size: 0.75em; /* 16x0.75=12px */
    margin:0;
}

.bullet-image {
    float:left;
    height: 1.4em;
    width:1.4em;
    margin-right: 1em;
}

.note ol, .note ul, .warning ol, .warning ul {
	padding: 0;
	margin: 0 0 1.125em 1.125em; /* 16x1.125=18px */
}

.note li, .warning li {
	font-size: 0.75em; /* 16x0.75=12px */
}

p.note  {
	font-size: 0.75em; /* 16x0.75=12px */
}
p.note:before   {
    content:"Note: ";
}
/* colour keywords, strings, and comments in files */
.comment	{
	color: #080;
	font-style:italic;
}

.keyword	{
	color: #00f;
	font-weight:bold;
}

/* center items */
.centered	{
	text-align:center;
}
.user-supplied	{
	font-style:italic;
}
.caption	{
	text-align:center;
	color:#444;
    font-weight:bold;
    font-size:0.75em; /* 16 px */
}