body	{font-size:15px; background:white;  font-family: "Arial",sans-serif;	line-height:1.4em; padding:0; margin: 140px	7px	0 7px; }

*		{box-sizing: border-box;}

a		{text-decoration:none; color:	#0000BB}		/* links.  not normally	underlined		*/
ul		{margin-top:0; margin-bottom:10px}
p		{margin-top:0.3em}
h1		{font-size:145%; color:#dd6600;  font-weight:bold; line-height:25px; font-family:arial,sans-serif; margin:0.5em 0	1em	0; border-width:0 0	1px	0; border-style:solid; border-color:#ccc}
h2		{font-size:130%; color:#447799;  font-weight:bold; border-style:solid; border-color:#c0c0c0; border-width:0 0	1px	0; margin:25px 0 0 0; clear:both; line-height:1.4em}
h3		{font-size:100%; color:#447799;  font-weight:bold; margin:18px 0 4px 0; }
li		{padding:.3em}
em		{font-weight:bold; font-style:italic;	color:#555555;}


#nav1			{position:fixed; top:0; left:0; background:#6789ab; height:36px;	width:100%; z-index:9000	}
#nav1 #logo		{float:left;	 letter-spacing:1px;  font-size:20px; font-weight:bold;	color:white;margin:	8px	0 0	20px; cursor:pointer;}

#nav2			{position:fixed; top:36px; left:0; background: #666; height: 42px; width:100%; padding:9px 0 0 20px; z-index:9000	}
#nav2 #srch		{width:240px; height: 22px; border: 2px solid #a98; padding-left:5px; font-size:16px; font-family:sans-serif; border-radius:	6px	0 0	6px	}
#nav2 #srch:focus	{ outline: none;	}

#nav2 #srchIcon		{float:left;	 width:30px; position:relative;	height:22px;  background:#a98; border-radius: 0	6px	6px	0;cursor:pointer;}
#nav2 .search.icon	{color: #000; position: absolute; top: 3px;	left:5px; width: 14px; height: 14px; border: solid 1px white; border-radius: 100%; -webkit-transform: rotate(-45deg);  transform: rotate(-45deg);}
#nav2 .search.icon:before {content: ''; position: absolute;top: 11px; left: 4px; height: 10px;width: 2px; background-color: white;}

#nav3			{position:fixed; top:78px; left:0;  background:#a98; height:36px;	width:100%;	padding-top:4px; z-index:9000	}
#nav3 .navLink	{color:white;  margin:4px 14px 0	12px ; float:left; cursor:pointer}


@media print {
	body			  { margin-top: 50px}
	#nav1,#nav2,#nav3 { display:none}
}


.h2link	{font-size:115%; color:#447799;  font-weight:bold; margin:25px 0 0 0;	clear:both;	display:block}

.rightCol		 {position:absolute; top: 160px; left:730px; width:300px; }
.advertisement	 {text-align:center; width:	300px; font-weight:bold; margin-bottom:8px;	font-size:12px;	color:#555555}
.advertisement a {color:#555555}


/*desktop devices only*/
@media only	screen and (min-device-width: 480px)	
  {	body	  {	max-width:600px;  margin: 140px	30px 0 30px; }
	a:hover	  {	text-decoration:underline; color: #0000FF;}	  /*On iphone it will make users double	tap	links */
  }


@media only	screen and (max-device-width: 768px)	  /*mobile devices or ipad*/
{ .rightCol {display:none}
   img	    {max-width:100%; display:block;	height:auto}
}


.tocMain h2		 {margin-left:20px;	margin-bottom:6px}
.tocHead		 {font-size:140%; font-weight:bold;	color:#447799; padding:30px	0 10px 0; text-align:center}
.tocEntry		 {margin:4px; font-weight:bold;	color:#404090; font-size:105%; text-decoration:none}
.tocMain>ul>li a {font-size:120%; font-weight:bold;	color:#447799;}


.formulaRight  {position:absolute; right:1em;			 top:1em;	color:#456789; font-weight:bold; font-size:14px; font-style:italic;	}
.formulaLeft   {position:absolute; left:1em;			 top:1em;	color:#456789; font-weight:bold; font-size:14px; font-style:italic;	}
.formulaCenter {position:absolute; left:0px;  right:0px; top:.2em;	color:#456789; font-weight:bold; font-size:14px; font-style:italic;	text-align:center;}
.formulaAbs	   {position:absolute;									color:#456789; font-weight:bold; font-size:14px; font-style:italic;	}



.definition	  {text-align:center; font-size:115%; font-style:italic; margin-bottom:10px; clear:both}
.inlineQuote  {font-style:italic; padding-left:5px;	padding-right:5px}

.printHeader .printBtn	{border: 1px solid gray; padding:0 2px 0 2px; background:#ddd; font-weight:bold}



.applet		  {	position:relative;	border:1px solid gray; margin:20px 0; background: #ffe;	font-size:16px;	}	/*font size	governs	all	content	*/
.textOverlay  {	position: absolute;	top:0; left:0; height:100px; padding:5px; width:100%}  /*div to	hold the goal and explain divs*/
.constGoal	  {	font-size:1em; font-family:sans-serif; font-weight:bold;  color:#456789; text-align:center;	line-height:normal}
.constExplain {	font-family:sans-serif;	font-size:1em; color:#333333; text-align:center; line-height:normal	}
.splash		  {	position:absolute; left:0; top:6em;	 width:100%;
				font-family:sans-serif;	text-align:center; font-size:1.5em;	color:#234567; visibility:hidden}
.clipper	  {	position:absolute; left:0px; top:0px; height:0px; width:0px; overflow:hidden ;pointer-events:none;}


/*two canvases that	hold the tools and line*/
#tools	{position:absolute;	top:0; left:0; z-index:20;	}
#lines	{position:absolute;	top:0; left:0; z-index:10;	}
#canvId	{position:absolute;	top:0; left:0; }



/* applet bottom bar*/
.buttonBar		  {	position:absolute; bottom:0; width:100%; height: 2em; background: #a0a0a0; border-top:1px solid	#666666; z-index:1000;	
					 font-size:16px; font-family:sans-serif}
.ctrlButton		  {	color:black; background:#d4d0c8; border-width: 2px;	border-style:solid;	border-color: white	#777 #777 white; text-align:center;	font-size:0.8em;
					 width:5.5em; height:100%;	line-height:100%; padding-top:0.7em; cursor:pointer; position:relative;	float:left;	
					 -webkit-touch-callout:	none;
					 -webkit-user-select: none;
					 -khtml-user-select: none;
					 -moz-user-select: none;
					 -ms-user-select: none;
					 user-select: none;	  }
.ctrlButton:hover {	background:#bbb	}

.fullScreenIcon	{color:#444; font-weight:bold; font-size:16px}


#printBuffer	  {	width:0; height:0; visibility:hidden;}

/* special case	override for options button*/
#optBtn			   { float:right; display:none;	color:yellow; background:#8c99aa; }	 /*turned on when items	aded */
#optBtn:hover		{background:#7b8899}


/*LinkCmd*/
.linkCmd	  {position:absolute;  cursor:pointer; border:none;	background:transparent;	text-decoration:underline; font-weight:bold; color:	#456789}

.javaSubst	  {	text-align:center; padding:5px;	border:1px solid #ccc;}

.soloEqn	  {display:block; margin: 7px 0	7px	50px;}
.soloImg	  {display:block; margin: 10px auto;  max-width:95%}

.var		  {font-weight:bold; font-style:italic;	color:#336688;white-space:nowrap}

.footnote			   {font-size:90%; font-style:italic; color:#222; margin-top:15px}

.quote		  {font-style:italic; margin: 6px 20px 6px 20px}

/*Figure with caption below*/
.fig	 {width:90%; border-spacing: 0;	border-collapse: collapse; margin: 12px	auto;}
.fig td	 {text-align:center; font-size:90%;	font-variant:small-caps; padding:0}
.fig img {border:1px solid #aaa}

/* See also	stuff*/
.citeUL		   {list-style-type:none; padding-left:0; margin-top:2px; margin-left:0}

.link		  {text-decoration:underline; color: #0000FF}	/* used	with <a> tags where	links need to be prominent */

.legal		  {font-size:90%; color:gray; padding:20px 0 0 0; margin:30px 0	120px 0;	text-align:center; clear:both}


.quzEntry	   {margin:4px;	font-weight:bold; color:#0055cc; font-size:95%;	text-decoration:none}


/*Equations*/
.soloHTMLEqn  {margin:9px 0	17px 40px; color:#114466; font-family:serif;  font-style:italic; font-size:120%}
.vbl		  {font-family:serif; font-style:italic; font-size:110%} /*span	for	variables */
.solo		  {margin: 10px	0 10px 35px; display:block;	font-style:italic}
.soloLeft	  {margin: 10px	0 10px 0; display:block; font-style:italic}

/* Equation	table with "where"*/
.eqTbl		{ max-width:400px;margin: 1em ;}
.eqTbl td	{ vertical-align:top}
.eqTbl #eqn	{ text-align: center; font-family:serif;font-style:italic; font-size:120%; }

/*image	positioning*/
.imgCenter	   { text-align:center;	margin:	25px 0;}
.imgCenter img { display:inline}
.imgCenter div { font-variant:small-caps}

/* General entries */
.subTitle	  {font-size:70%;  white-space:nowrap; float:right }

.gSubTitle	  {display:block; font-size:70%}
.gDefinition  {text-align:center; font-size:115%; font-style:italic; margin-bottom:10px}
.gAppletHint  {margin: 15px	0 5px 0;line-height:17px; display:inline}
.gTrythis	  {font-weight:bold;  padding-right:10px; color:#cc5500; display:inline	}
.gEquation	  {text-align:center; }
.gEquation2	  {text-align:center; font-size:110%; font-style:italic; margin:0 0	20px 0 }
.gEquation3	  {font-style:italic; font-weight:bold;color:#257; font-size:13px; margin:4px 0	4px	15px}
.gAside		  {font-size:90%; color:#333333; margin-top:20px}
.gPropName	  {font-weight:bold; color:#368; font-size:100%; padding-right:10px}
.gProp		  {font-weight:bold; color:#257; padding-right:10px}
.gPropDef	  {padding-bottom:20px}
.gSeeAlso	  {padding-right:10px; color:#259}

.gAns		  {visibility:hidden; padding:3px 0	0 0;  color:red}
.gProb		  {position:relative; left:0; top:0}
.gCheck		  {text-decoration:underline; font-size:80%; }
.gProblem	  {font-weight:bold;  color: #368; margin:40px 0 0 0; font-size:110%}

.gImgLeft	  {float:left; margin: 4px 10px	10px 0}
.gImgRight	  {float:right;	margin:	4px	0 10px 10px}
.gImgInset	  {display:block; margin: 7px 0	7px	50px;} 
.gInlineEqn	  {position:relative; top:6px; left:-2px}
.gTable1	  {margin:25px 0 15px 0}


.angletd1	{width:170px;}
.angletd2	{width:170px; padding-bottom:20px}


.constProof		{background:#ffffdd;border-collapse:collapse;	margin-top:20px}
.constProof  td	{text-align:left}
.constProof  thead	tr	{color: #003355; background:#ffffbb}
.constProof  td,th		{border:1px solid	gray}
.constProof  tr.constProofSubhead	 {background:white}
.constProof  tr.constProofSubhead td {border-width:0}

.constSteps			 {background:white;border-collapse:collapse;}
.constSteps thead tr {color: #003355}
.constSteps  td,th	  {border:1px solid	gray}

.constLinkBox		 {float:right; margin:0	0 0	20px; }
.constPrintTable	 {width:100%; clear:both; border-style:solid; border-color:#c0c0c0;	border-width:0 0 1px 0;margin-top:25px;	margin-bottom:12px}
.constPrintHdg		 {font-size:120%; color:#447799;  font-weight:bold;}
.constPrintLogo		 {font-size:140%; color:#447799;  font-weight:bold;	text-align:center}
.constPrintContainer {width:700px;padding:10px 0 0 20px}


.optionsMenu		  {	position:absolute; bottom:2em; right:0;	border-style:solid;	border-width:1px; border-color:	#bbb gray gray #ddd; z-index:1000;
						font-size:16px;	background:#eed; margin:0; padding:0; border-spacing: 0; border-collapse: separate;	visibility:hidden; }
.optionsMenu tr		  {	cursor:pointer}
.optionsMenu td		  {	padding:3px	6px	3px	6px; font-size:14px;}
.optionsMenu td:nth-child(2)  {text-align:right}
.optionsMenu .cbdiv	  {	border:2px inset white;	padding:0; background:white; width:1em;	height:1em;	text-align:center; 
						color:#456789; margin-right:15px; cursor:pointer; font-weight:bold;	line-height:0.9em }


.calcbox	 {width:75px; text-align:center	}
.calcside	 {float:right;margin-right:15px}

.calculator			{margin: 30px auto;	background:#ddd; border:1px	solid gray;	padding:5px	; font-size:inherit}
.calculator	.inp	{background:#ffc; height:20px; margin:5px; font-size:100%; width:120px ; padding-left:3px}
.calculator	a		{color:#444444;	margin-left:6px}
.calculator	.header	{height:17px; font-size:80%; padding-bottom:8px	}
.calculator	button	{background:#888; color:white; margin:22px;	font-size:100%}
.calculator	#status	{height:25px; color:red}
.calculator	.output	{font-size:100%; margin:2px	3px	2px	3px; padding-left:5px; border: 1px solid gray}
.calculator	.filler	{height:8px}


.inarticle	   { 
	width:90%;	 margin: 40px auto;	border:1px solid gray;
	background: rgb(2,0,36);
	background: linear-gradient(90deg,	rgba(2,0,36,1) 0%, rgba(121,75,9,1)	42%, rgba(0,212,255,1) 100%);
}




@media print {
	.legal		 { display:none}	 
	.applet		 { background:white}
	.rightCol	 { display:none}
	.inarticle	 { display:none}
	.wsBody		 { margin:0}
	.printHeader { display:	none}
	.buttonBar	 { display:	none}
}