/* reset css styles individually instead of universal selector. */
/* based on http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
html, body{
	margin: 0;
	padding: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	border-left:0;
} 
div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;

}
body {
	line-height: 1;
	color: black;
}
ol, ul {	list-style: none;}
table {

}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
/* end reset styles */

/* mac hide \*/
html,body{height:100%}
/* end hide*/

h1,h2,h3,h4,h5,h6{
	font-weight:bold;
	font-size:120%
}
h1{font-size:140%}
p,h1,h2,h3,h4,h5,h6,ul{margin-bottom:1em}
h3{margin:1em 0 .5em 0;}
ul{list-style:none;}
h2{	
	background:#fff ;
	color:#406700;
	text-align:center;
	font-size:140%;
}
.clearfix:after {
    content:"."; 
    display:block; 
    height:0; 
    clear:both; 
    visibility:hidden;
}
.clearfix {display:inline-block;}
/* mac hide \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide */
.to-top{clear:both;margin:1em 0;}
body{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background:#ECEAE3 url(../images/fond.jpg) fixed repeat-x left top;
	color:#000;
	font-size: 13px; 
}
#outer{
	width:90%;
	min-width:500px;
	margin:0 0 0 4.5%;
	text-align:left;
	color:#000;
	border-left:2px double #000;
	border-right:2px solid #000;
	min-height:100%;
   float:left;
	display:inline;


}

#nav p{
	text-align:left;
	margin:30px 0;
	color:#fff;
	width:15em;
	line-height:1.4em;
}
#nav p.privacy{
	margin:5px;
	text-align:center;
}
#nav{
	width:18.1em;
	float:left;
	margin-left:-18em;
	margin-right:-3px;
	position:relative;
	display:inline;
	text-align:left;
}
#content{
	float:right;
	width:100%;
	color:#000;
}
#content p {line-height:1.4em;}
#main{	
	margin:0 .7em 0 18em;
	padding:0 0 1em 0;	
	position:relative;
}

ul#sidenav {
	width:15em;
	margin:-101px 0 10px 6px;
	position:fixed;
	text-align:left;
}
ul#sidenav li{
	background:#809900;
	width:15em;
	text-align:left;
	position:relative;
	color:#fff;
}
ul#sidenav li a{
	background:#809900;
	width:15em;
	color:#fff;
	text-decoration:none;
	display:block;
	padding:5px 0;
	font-weight:bold;
	border-bottom:1px solid #eff2df;
	text-indent:10px;
}
ul#sidenav li a:hover{
	background:#eff2df;
	color:#4c7300;
}
#nav p{position:fixed;margin-left:10px}
ul.demos{
	list-style:none;
}
ul.demos li{
	width:15em;
	border:1px solid #000;
  background:#e9eccd;
	float:left;
	margin:.5em;
	display:inline;
}
ul.demos li a{
	text-decoration:none;
	display:block;
	padding:5px;
	min-height:80px;
}
ul.demos span{
	margin-bottom:.3em;
	display:block;
	font-weight:bold;
	text-decoration:underline;
}
ul.demos li a:hover{background:#809900;color:#fff;position:relative}
.intro{clear:both}
p.intro::first-letter,
p.intro2::first-letter{
	font-size:5em;
	float:left;
	font-weight:bold;
	color:#809900;
	padding:3px 5px 2px 0;
}

/* use for code sections*/
.code{
	border:1px solid #000;
	margin:0 25px 25px;
	background:#406700;
	clear:both;
	padding:10px;
	color:#fff;
	text-align:left;
}
/* set body id's to control nav highlight - for future expansion*/
body#home ul#sidenav li.home a{background:#eff2df;color:#4c7300}
body#threecol ul#sidenav li.threecol a{background:#eff2df;color:#4c7300}
body#tute ul#sidenav li.tute a{background:#eff2df;color:#4c7300}
body#contact ul#sidenav li.contact a{background:#eff2df;color:#4c7300}

ul#breadcrumb{margin:10px 0}
ul#breadcrumb li{display:inline;font-weight:bold;padding:0 5px;}
ul#breadcrumb li a{text-decoration:underline;color:#809900}


/* ie mac only styles \*//*/
#nav{margin-left:-18em;}
/* end iemac styles*/

/* explain overlapping tabs */
ul.explaintab{list-style:none;margin:1em 0}
ul.explaintab li{margin:10px 0;clear:both}
ul.explaintab p img {float:left;margin:5px 5px 5px 0}

/* vertical center page */
#xinner #header{
	//background:#fff url(images/top-fade.jpg) repeat-x left top;
	position:relative;
	margin:0 0 1em 0;
	height:108px;
 overflow:hidden;
}

#xinner h1#logo a{
	padding:37px 0 0 240px;
//	background: url(images/logo-new.jpg) no-repeat -4px 0;
 display:block;
	color:#4c7300;
	text-decoration:none;
	height:71px;
}

/* caption - image with text to the side page */
dl.capclear{
	margin:10px auto;
	width:38em;
	text-align:left;
	border:1px solid #000;
	background:#eff2df;
}
dl.capclear dt {float:left;margin:5px;display:inline;}
dl.capclear dd{
	font-size:120%;
	font-weight:bold;
	margin:1em 0
}
/* some styling below not needed for demo */
dl.capclear dd span{
	float:left;
	width:8em;
	text-align:right;	
	padding-right:10px;
	font-style:italic;
}
/* */
.older-stuff li{
	line-height:1.3em;
	font-weight:bold;
	margin:1em 0 0 0;
}
.older-stuff li li{font-weight:normal;margin:0}

/* goggle ads */
.google-ad1{
	width:120px;
	margin:120px 0 10px 45px;
	position:fixed;
}
* html .google-ad1{margin-top:20px}

ul.dart{
	list-style:square;
	margin:25px 0 15px 30px;
	padding:0;
	line-height:1.3em
}
ul.dart li{
	margin:5px 100px 5px 0;
}