@media print{
body{background-color:#FFFFFF; color:#000000 }
#bannerarea{display:none;}
#pathlinks{display:none;}
#leftcolumn{display:none;}
#artbox{display:none;}
#spacertd{display:none;}
pre{background-color: white;}
* html pre, * html .examplecode{font-size: 90%;}
}

body{
background-color: white;
color: black;
font-family: Verdana, "Trebuchet MS", "Lucida Grande", Helvetica, sans-serif;
font-size: 16px;
margin: 0;
padding: 0;
line-height: 1.2em;
}

body>table{
width: 98%;
margin: auto;
}

A:link    { color: #3A6200}    /* unvisited links */
A:visited { color: #686833; }   /* visited links   */
A:hover   { color: #8D8032; }
A:active  { color: red }   /* active links    */

pre, .examplecode{
background-color: #EFEFEF;
font-size: 14px;
}

pre{
overflow-x: auto;
}

.codewrap{
overflow: scroll;
padding-left: 10px;
width: expression(document.body.clientWidth-210);
}


code{
font-family: Courier new;
background-color: #EFEFEF;
padding: 1px;
}

.examplecode{
font-family: Courier new;
border:1px solid gray;
padding: 5px;
line-height: 19px;
overflow-x: auto;
}

* html .examplecode{ /*IE rule*/
font-size: 13px;
}

table#maintable, table{
font-size: 100%;
}

h2{
	/* margin-top: 30px; */
}

h3{
font-size: 120%;
}

h4{
font-size: 110%;
}

/* ######### Header Area ######### */

#topsection{
margin-bottom: 10px;
}

#topsection h1{
margin: 0;
padding-top: 15px;
}

#bannerarea{
width: 728px;
margin-bottom: 10px;
text-align: center;
}

#bannerarea div.bsap_1279042{ /* bsa large banner */
margin-left: 185px !important;
}

span.bsa_it_p{
bottom: -1px !important;
}

#pathlinks{
background-color: #cde9af;
padding: 5px;
font: bold 15px Verdana;
border-top: 1px solid yellow;
margin-bottom: 8px;
}

#pathlinks a{
color: blue;
text-decoration: none;
}

#spacertd{
width: 1px;
padding-left: 14px;
}

#spacertd img{
display: none;
}

#jksitesearch #zoom_query{
background: lightyellow;
width: 250px;
font: bold 13px Arial;
padding: 5px;
margin-bottom: 5px;
border: 1px solid black;
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(50%,rgba(243,243,243,1)), color-stop(51%,rgba(237,237,237,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* IE10+ */
background: linear-gradient(top, rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

#jksitesearch .zoom_button{
vertical-align: middle;
position: relative;
top: -5px;
}

#jksitesearch #jksitesearch_cat{
font: bold 11px Arial;
margin-right: 5px;
}

#jksitesearch #jksitesearch_cat input{
margin-left: 8px;
}

/* ######### Content Columns ######### */

#contentwrapper{
float: left;
width: 100%;
}

#contentcolumn{
margin-left: 175px; /*Set left margin to LeftColumnWidth*/
padding: 10px;
font-size: 90%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
line-height: 2;
}

#leftcolumn div.sticky{
	top: 10px;
	position: fixed;
}

#leftcolumn div.sticky #sharearea{
	position: fixed;
	bottom: 0;
	width: 160px;
}

#contentcolumn h1:first-of-type{
	margin-top: 0;
	font-size: 20px;
	line-height: 1.5;
}

#contentcolumn h3:first-of-type{
	/* margin-top: 0; */
}

#contentcolumn img{
max-width: 100%;
height: auto;
}

a.tryit{
	font-weight: bold;
	font-size: 1.2em;
	background: #9dd53a;
	background: -moz-linear-gradient(top,  #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%);
	background: -webkit-linear-gradient(top,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	background: linear-gradient(to bottom,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=0 );
	display: inline-block;
	padding: 5px 10px;
	box-shadow: 2px 2px 5px gray;
	text-decoration: none;
}

a.tryit:hover{
	color: blue;
}

#toc{
list-style-type: decimal;
font-weight: bold;
font-family: Arial;
background-color: lightyellow;
border-top: 1px solid gray;
padding-top: 3px;
}

#toc li{
margin-bottom: 5px;
}

#nextpage{
font-weight: bold;
}

#discussbutton{
  font: bold 1.5em Verdana;
  padding: 5px;
  border-radius: 5px;
	cursor: pointer;
	background: #a90329;
	background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 44%, #6d0019 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019));
	background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);
	background: -o-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);
	background: -ms-linear-gradient(top,  #a90329 0%,#8f0222 44%,#6d0019 100%);
	background: linear-gradient(to bottom,  #a90329 0%,#8f0222 44%,#6d0019 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 );
	color: white;
	display: block;
  text-align: center;
  margin: 1em auto;
  width: 100%;
  max-width: 500px;
  text-shadow: -1px -1px 1px gray;
  box-shadow: 3px 3px 3px gray;
}

/* ######### Left Column ######### */

#leftcolumn{
float: left;
width: 175px; /*Width of left column*/
margin-left: -100%;
border: 1px solid gray;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

#leftcolumn a:hover{
/*color: #FF8000;*/
}

.categorylinks{
list-style-type: none;
margin: 5px auto 10px auto;
padding: 0;
}

.categorylinks li{
padding-bottom: 2px;
}

.categorylinks li a{
background: white url("fold2.gif") no-repeat center left;
text-indent: 17px;
padding: 3px 1px;
font-size: 12px;
display: block;
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #EAEAEA;
}

* html .categorylinks li a{ /*IE rule*/
background: white url("fold2.gif") no-repeat 30% left;
}


.categorylinks a:hover {	color: #fff;	background-color: #51B906; text-decoration: none; }

#leftcolumn .headers{
color: white;
font: bold 110% Arial;
background-color: #008000;
padding: 2px;
text-align: center;
}

.pblock{
margin: 5px auto 10px 5px;
font-size: 12px;
}

.pblock strong{
font-size: 120%;
}

#leftcolumn .linkslist{
list-style-type: disk;
margin: 5px auto 10px 17px;
padding: 0;
font-size: 11px;
}

#leftcolumn .linkslist li{
padding-bottom: 1px;
}

#leftcolumn .linkslist li a{
text-decoration: none;
}


#leftcolumn p.nomargin, #leftcolumn div.nomargin{
margin: 0;
padding: 2px;
}

#leftcolumn div.nomargin div{
margin: 0;
padding: 0;
}

span.bsa_it_p{
bottom: -1px !important;
}

/* ######### Footer Column ######### */

#footer #discussarea{
padding: 10px;
margin-left: 175px;
}

#footer #discussarea h3{
position: relative;
padding-left: 36px;
}

#footer #discussarea h3:before{
content: '';
position: absolute;
width: 30px;
height: 31px;
left: 0;
top: -3px;
background: url(http://www.javascriptkit.com/jkincludes/speech-bubble.png) top left no-repeat;
}

#footer{
clear: left;
width: 100%;
margin-bottom: 5px;
}



#footer a{
text-decoration: none;
}

#copyright{
text-align: center;
}


/* ####### responsive layout CSS ####### */

@media (max-width: 905px){ /* responsive layout break point */

	#bannerarea{
		margin: auto !important;
	}

	#bannerarea div.bsap_1279042, #footerad, #copyright{
	margin-left: 0 !important;
	}
}

@media (max-width: 740px){ /* responsive layout break point */

	#contentwrapper{
	float: none;
	}
	
	#leftcolumn{
	float: none;
	width: 100%;
	margin-left: 0;
	}

	div.sidemenucomponent{
		display: none;
	}
	
	#contentcolumn{
	margin-left: 0;
	}

	#footer #discussarea{
	margin-left: 0;	
	}
}

@media screen and (max-device-width:730px){ /* mobile layout break point */

	body{
		font-size: 1.1em;
		line-height: 1.5em;
	}

	#bannerarea div.bsap_1279042{
	    display: none;
	}

	#copyright{
			font-size: 80%;
	}

}