/* initializing general parameters*/
html, body {
	width: 100%;
	height: 100%;
	font-size: 100%; 
	background-color: #D1DBD3;
	}
#article * {
	border: 0px;
	padding: 0px;
	margin: 0px; 
	outline: none;
	-moz-outline-style: none;
	font-family: Georgia, serif;
	}
#article a {
	color: #4A6B4E;
	position: relative;
	z-index: 100;
	text-decoration: none;
	}
#article a:hover {
	text-decoration: underline;
	}
#article a img {
	text-decoration: none;
	}
#article strong, 
#article b {
	font-weight: bold;
	}
#article .todo {
	color: red;
	}
#article em, 
#article i {
	font-style: italic;
	}
#article sup, 
#article sub {
	font-size: 85%;
	}
#article sup {
	vertical-align: top;
	}
#article sub {
	vertical-align: bottom;
	}
#article .sc, 
#article acronym {
	font-size: 89%;
	letter-spacing: 1px;
	text-transform: uppercase;
	}
#article acronym {
	border-bottom: dotted 1px #172F46;
	}

/* container of article */
#article {
	width: 500px;
	height: auto;
	margin: 0px 0px 0px 36px;
	overflow: visible;
	}

/* illustration on top */
#article img#illustration {
	float: left;
	clear: both;
	margin-left: -21px;
	margin-bottom: 36px;
	}

/* basic text related settings*/
#article p,
#article li,
#article td, 
#article th {
	color: #172F46;
	}
#article p,
#article h1,
#article h2, 
#article h3,
#article ul,
#article ol {
	padding-right: 0px;
	}
#article p, 
#article pre {
	font-size: 16px;
	line-height: 22px;
	padding-bottom: 12px;
	}
#article ul,
#article ol {
	font-size: 12px;
	line-height: 18px;
	padding-bottom: 12px;
	margin-left: 18px;
	}
#article ul li {
	list-style-type: circle;
	}

#article h1,
#article h2, 
#article h3 {
	font-family: Georgia, serif;
	color: #841306;
	}
#article h1 {
	font-size: 33px;
	line-height: 33px;
	font-weight: normal;
	}
#article h2 {
	font-size: 21px;
	line-height: 24px;
	padding-top: 24px;
	padding-bottom: 12px;
	font-weight: normal;
	}
#article h3 {
	font-size: 12px;
	line-height: 18px;
	padding-top: 6px;
	padding-bottom: 3px;
	}
#article h3.about {
	color: #172F46;
	margin-top: 36px;
	padding: 3px 0px 9px 0px;
	border-top: solid 1px #FFFFFF;
	}
#article h4 {
	font-size: 12px;
	line-height: 18px;
	}

/* code examples <pre> and <code>*/
#article pre,
#article code,
#article pre b,
#article code b,
#article pre i,
#article code i,
#article h4, 
#article h4 b {
	font-family: Calibri, "Lucida Grande", "Lucida Sans", Verdana, sans-serif;
	}
#article pre {
	clear: both;
	background-color: #E0E7E2;
	padding: 12px 0px 12px 0px;
	margin: 6px 0px 18px 0px;
	}
#article .visual pre,
#article .visualbig pre {
	padding: 12px 0px 12px 0px;
	margin: 0px;
	}
#article pre,
#article code, 
#article h4 {
	font-size: 89%;
	color: #3A5B75;
	}
#article pre b,
#article code b,
#article h4 b {
	color: #623536;
	font-weight: normal;
	}
#article pre i,
#article code i,
#article h4 i {
	color: #8c8c8c;
	font-style: normal;
	}

/* visuals */
#article .visual,
#article .visualbig {
	float: left;
	height: auto;
	overflow: visible;
	margin-top: 12px;
	border-bottom: solid 1px #FFFFFF;
	}
#article .visual {
	width: 500px;
	margin-bottom: 36px;
	}
#article .visualbig {
	width: 860px;
	margin-bottom: 36px;
	}
#article h4 {
	padding: 3px 3px 3px 9px;
	background-color: #E0E7E2;
	font-weight: normal;
	}
#article .visual img,
#article .visualbig img {
	display: block;
	}
#article p.caption {
	font-size: 89%;
	line-height: 18px;
	padding-top: 3px;
	padding-bottom: 9px;
	clear: both;
	font-style: italic;
	}
#article .visualbig p.caption,
#article #imap p.caption {
	padding-left: 360px;
	}

/* exeptions for content in interactive "Which features are activated by which menu item?" */
#article span p,
#article span h3 {
	padding-right: 9px;
	}

/* table: "Which feature works in which program?" */
#article table { 
	border-top: solid 1px #FFFFFF;
	width: 860px;
	border-collapse: collapse;
	margin: 12px 0px 24px 0px;
	}
#article th, 
#article td {
	font-size: 12px;
	line-height: 16px;
	padding: 2px 0px 2px 0px;
	}
#article td {
	border-bottom: solid 1px #FFFFFF;
	}
#article tr.even td {
	background-color: #E0E7E2;
	}
#article td.yes img,
#article td.no img {
	width: 16px;
	height: 16px;
	background-color: transparent;
	background-repeat: no-repeat;
	}
#article td img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}
#article td.yes img {
	background-image: url('../_img/features_apps/yes.png');
	}
#article td.no img {
	background-image: url('../_img/features_apps/no.png');
	}