/*
 *
 * EPO
 * Filename:	Help.css
 * Description: A usable helpfile component with a fresh layout, that should look and feel good, cross-application
 * Author: 		dirkjan@degroot.in
 * Date: 		30-11-2011
 *
 */
 embed {
 	width: 100%;
 	height: 100%;
 	position: absolute;
 }
div.bar {
	z-index:999;
	overflow: hidden;
	padding-left:.5em;
	background-color:#eee;
	border-bottom:1px solid #bbb;
}
div.bar dl {
	display: block;
	width: auto;
	float: none;
	margin: 5px 0;
}

body {
	overflow:hidden;
	font-family:Arial, Helvetica, sans-serif;
	color: black;
    font: 80% sans-serif;
    margin: 0;
    padding: 0;
    background-color:#fff;
}

/* -------- headings -------- */
h1, h2, h3, h4, h5, h6 {
    background: none repeat scroll 0 0 transparent;
    border-color: #ccc;
    font-weight: normal;
    margin: 0;
}

h1 {
	display:block;
	font-weight:bold;
	line-height:3.7em;
	padding-left:.5em;
	font-size:188%;
	border-bottom: 1px solid #ccc;
	height:3.7em;
}

body.fresh h1 {
	background:url('../images/stripes.png') repeat;
	color:#1971B3;
}

body.basic h1 {
	background-color:#efefef;
	background-image:none;
}

body.basic .noPdfSupport {
	position: absolute;
	top: 50%;
	left: 50%;
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

body.basic .ccdmanual {
	z-index: 1;
}

body.formal h1 {
	background:#BE0F05 url('../images/logo.gif') no-repeat 0 0;
	color:#fff;
	padding-left:8em;
	border-color:#fff;
}

body.formal .col-1 h1,body.basic .col-1 h1  {
	background-image:none;
	background-color:#efefef;
	padding-left:.5em;
	color:#000;
}


h2 {
	margin-top:1em;
	border-bottom: 1px solid #ccc;
	font-size:155%;
	padding-bottom:.3em;
}

body.fresh h2 {
	color:#E29314
}

body.formal h2 {
	color:#BE0F05
}

h3 {
	font-size:135%;
	border-bottom: 1px solid #efefef;
	padding-bottom:.3em;
	color:#333;
}

body.fresh h3 {
	color:#69BC20;
}

/* -------- headings -------- */

p, div.col-2 li {
	line-height:1.8em;
}

div.style-switcher {
	position:relative;
	float:right;
	top:.8em;
}

div.style-switcher label {
	margin-right:1em;
	color:#666;
}

div.style-switcher select {
	border:1px solid #666;
}

/* -------- anchors -------- */
a { text-decoration:none }
a:hover, a:active, a:focus { text-decoration:underline }

/* -------- anchors -------- */


/* sections */
body > div.section { padding:.5em!important}


/* -------- submeta -------- */
dl dt,dl dd{display:inline-block; color:#666;}
dl dt{margin-right:0;font-weight:700;text-transform:capitalize;}
dl dd{margin:0 .5em 0 .3em;}
dl { float:left; width:65%; top:-.4em; overflow:hidden;}
/* -------- submeta -------- */

.top {margin-top:1em;}
.bottom {margin-bottom:1em;}
.clear {float:none; clear:both}
.hide {display:none;}

/* -------- columns -------- */
div.col-1 { width:30%; float:left }
div.col-2 { width:66.5%; float:right }

div.col-1, div.col-2 { overflow:auto; height:28em }
div.col-1 > div, div.col-2 > div { padding:.5em }
div.col-2 > div { padding-bottom:70em }
div.col-2 > div > div.section {padding:.2em }
div.col-2 > div > div.section div.section {padding:.2em 0 }
/* .col-2 > div > div.section:hover {background-color:#fafadc;} may be graphical overkill */
/* -------- columns -------- */

/* framing of screenshots */

div.col-2 div.img { padding:1.5 2.5em; text-align:center; border:1px solid #eee; margin-bottom:1em; background-color:#F5F5F5; }
div.col-2 div.img img { margin:auto; margin:1.5em 2.5em;}


/* ---- overwrite filetree setting ---- */
.filetree { margin-left:0!important; }
.filetree, .filetree ul { list-style:none; }
.filetree span, .filetree a { display:inline-block; padding-left:.8em; }
.filetree span a { display:inline-block; position:relative; left:-.7em; color:#3E4D6B;}
.filetree span a:hover {color:#7D1D48; }
/* ---- overwrite filetree setting ---- */


/* arrow up */
a.up { display:block; border-top:1px solid #ccc; text-align:right; color:#999!important; font-size:90%; margin-top:1.5em; padding-top:.3em; background:url('../images/up.gif') no-repeat 100% 55%; padding-right:1.5em; }