* { margin:0; padding:0; }


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* generic */

body {
    background: #ffffff;
	font: 13px "Optima", "Helvetica", "Arial", sans-serif;
	font-weight: normal;
	color: #666;
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom:30px;
  	text-align: left;
    line-height: 1.7;
    position:relative;
}

h1 {
    font-size: 26px;
    font-family: "CandalRegular", "Helvetica", "Arial", sans-serif;
    margin-top:40px;
    margin-bottom:-6px;
	font-weight: normal;
	color: #600;
	text-align: center;
}

h2 {
    margin-top: 40px;
    margin-bottom: 15px;
    font-size: 20px;
    font-family: "CandalRegular", "Helvetica", "Arial", sans-serif;
	font-weight: normal;
	color: #600;
	text-align: center;
}

h2.withSeparator {
	border-top:1px dotted #ccc;
	padding-top:10px;
	margin-top:50px;
}

h3 {
	color: #777;
    margin-bottom: 40px;
    font-size: 10px;
	font-weight: normal;
	text-align: center;
}

h4 {
    margin-top: 20px;
    margin-bottom: -5px;
    font-size: 15px;
    font-family: "CandalRegular", "Helvetica", "Arial", sans-serif;
	font-weight: normal;
	color: #600;
}

ul {
    margin-left:30px
}

li {
    margin-top:5px;
}

p {
    margin-top:12px;
    margin-bottom:12px;
}

strong {
    font-weight:bold;
	color: #0a0;
	color: #000;
}

img { border:none; }

a { text-decoration:underline; color: #933; border:none; }
a:hover   { text-decoration:underline; }

.sidebar {
	position:absolute;
	left:630px;
	width:180px;
	font-size:11px;
	color:#aaa;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* example */

.example {
	font-size:11px;
	margin-left:210px;
	margin-bottom:10px;
	width: 600px;
}

.example canvas {
	margin-right:5px;
}

.example p {
	position:absolute;
	margin-left:-210px;
	width:200px;
	margin-top:0px;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* example1 */

.example1 {
	margin-left:30px;
	margin-bottom:15px;
	margin-top:20px;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* example2 */

.example2 {
	margin-left:120px;
	margin-bottom:10px;
	width: 600px;
}

.example2 canvas {
	margin-right:5px;
}

.example2 p {
	position:absolute;
	margin-left:-118px;
	width:110px;
	margin-top:0px;
}

.example2_labels {
	margin-left:160px;
	width: 600px;
	height:30px;
}

.example2_labels .a {
	position:absolute;
	margin-left:-40px;
}

.example2_labels .b {
	position:absolute;
	margin-left:128px;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* example3 */

.example3 {
	margin-left:0px;
	margin-bottom:10px;
	width: 850px;
}

.example3 img {
	margin-right:5px;
}

.example3 p {
	display:none;
}