body {
 	margin: 0;
	padding: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 63.125%;		/* translate 1.0em to 10px, 1.5em to 15px, etc. */
	color: #222;            /* very dark gray */
	background: #ffffff;	/* white, footer background color */
 	}
.blue 
{
	font-size: 1em;
	float: left;
	width: 185px;
	padding: 3px;
	background: #D3D3D3;    /* light gray cyan */
	margin: 1px;
/*	border-bottom: 1px solid #000066;  */
/* 	border-right: 1px solid #000066; */
}

.black 
{
	font-size: 1em;
	font-weight: bold;
	float: left;
	width: 182px;
	padding: 5px;
	background: #ffffff;
	margin: 3px;
}


.bluebox 
{

	float: left;
	width: 195px;
	background: #ffffff;
    margin: 0px 0px 10px 0;
    padding: 5px;
	border: 1px solid #000066;   /* very dark blue */
	}
	
.oldglossarybluebox 
{

	float: left;
	width: 200px;
	background: #ffffff;
     margin: 0px 0 10px 0;
          padding: 5px;
		border: 1px solid #000066;
	}
.titlebluebox 
{

float: left;
width: 195px;
background: #ffffff;
margin: 0px 0 10px 0;
padding: 5px;
border: 1px solid #000066;
font-size: 1.25em;
   
}
	


.glossarybluebox 
{
float: right;
width: 681px;
background: #ffffff;
margin: 0px;
padding: 2px;
border-top: 1px solid #000066;
border-right: 1px solid #000066;
border-left: 1px solid #000066;
}

.tryitbox 
{
float: right;
width: 611px;
background: #ffffff;
margin: 12px 12px 22px 12px;
padding: 22px 12px 12px 22px;
border: 2px solid #888;
-moz-box-shadow: 7px 7px 3px #888;
-webkit-box-shadow: 7px 7px 3px #888;
box-shadow: 7px 7px 3px #888;
border-top-left-radius: 40px 60px;
border-bottom-right-radius:40px 60px;
}

.tryitbox2 
{
float: right;
width: 661px;
background: #ffffff;
margin: 0px;
padding: 2px;
border: 1px solid #000000;
}

pre {
  margin: 5px 15px 5px 15px;
  border-style: solid;
  border-color:  #000000;
  border-width: 1px;
  display: block;
  padding: 5px 12px 5px 12px;
    background-color: #F5F5F5; /* #e6ebec; */
  font-size: 1.2em;
  font-family: Courier New;
  white-space: pre-wrap;
  text-indent: 0px;
  overflow-x: auto;
  /*overflow-y: hidden; */
}

.glossaryAPCbox 
{
float: left;
width: 370px;
background: #ffffff;
margin: 0px;
padding: 2px;
border-top: 1px solid #000000;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
border-bottom: 1px solid #000000;
}

.title2bluebox 
{
float: right;
width: 675px;
background: #ffffff;
margin: 0px 0 0px 0;
padding: 5px;
border-top: 1px solid #000066;
border-right: 1px solid #000066;
border-left: 1px solid #000066;
font-size: 1.5em;
}
.title3bluebox 
{
float: right;
width: 1300px;
background: #ffffff;
margin: 0px 0 0px 0;
padding: 5px;
border-top: 1px solid #000066;
border-right: 1px solid #000066;
border-left: 1px solid #000066;
font-size: 1.5em;
}
.Roadmapbluebox
{
float: right;
width: 1300px;
background: #ffffff;
margin: 0px;
padding: 5px;
border: 1px solid #000066;
}

.bigbluebox
{
float: right;
width: 675px;
background: #ffffff;
margin: 0px 0 10px 0;
padding: 5px;
border: 1px solid #000066;
}

.title3bluebox table  {
	margin: 0px;
    border: 0;
	}
.title3bluebox  tr td {
	margin: 0px;
    border: 0;
	}

.bigbluebox table {
	margin: 0px 0;
	}
.bigbluebox a 
{
	
	text-decoration: none;
}

.bigblueboxPost
{
float: right;
width: 675px;
background: #ffffff;
margin: 0px 0 10px 0;
padding: 5px;
border: 1px solid #000066;
}


.bigblueboxPost table {
	margin: 0px 0;
	}
.bigblueboxPost a 
{
	
	text-decoration: none;
}


#widebluebox
{
margin: -20px 0 10px 0;
width: 900px;
background: #ffffff;
margin: 10px;
padding: 10px;
border: 1px solid #000066;
}

#widerbluebox
{
    


	width: 100%;
	background: #D3D3D3;

	margin: 0 auto;


	

border: 1px solid #000066;

/* 
	
width: 800px;
background: #ffffff;
margin: -20px 0 10px 0;
margin: 10px;
padding: 10px; 
float: left;
float: right;
*/

}



.blueboxTitle {
	float: left;
	width: 200px;
	background: #000066;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1.5em;		/* translate 1.0em to 10px, 1.5em to 15px, etc. */
	color: #ffffff;
	}
 




	
#horns 
{
	position: absolute;
	top: 0;
 	left: 30%; 
	margin-left: 520px;
	width: 220px;
	height: 150px;
	background: url(../images/ranger220.150.jpg) no-repeat -8px -1px;
	}

#header {
	float: left;
	width: 100%;
	background: #999999;    /* dark gray */
	border-bottom: 3px solid #cc0000;   /*strong red */
	}
	
#navigation 
{

	margin: 0 auto;
	width: 900px;
	}
	

	
#TitleBarBg {
		float: left;
	width: 100%;
	background: #ffffff;
	}
	
#Containment
{
	margin: 0 auto;
	width: 900px;
}
#TitleBar 
{
		float: left;
	margin: 0 auto;
	width: 70%;

	}
	
#LogInOut 
{
	float: right;
/* 		margin: 5px auto 0 auto;   */
	margin: 10px 0;

	width: 25%;

	font-size: 14px;

	}
#navigation ul {
	float: left;
	margin: 0;
	padding: 0;
	border-left: 1px solid #a6a69d;
	width: 899px;
	font-size: 1em;
	list-style: none;
	}
	

	
#navigation li {
	margin: 0;
	padding: 0;
	float: left;
	background: none;
list-style: none;
	}
	
	
#navigation a {
	float: left;
	padding: 7px 20px;
	border: none;
	border-right: 1px solid #a6a69d;
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	}
	

	
	
	
.glossary a {
	
	font-weight: bold;
	}
	
.GlossaryTermA {
	/* font-weight: bold; 
	font-variant: small-caps;
	font-size: larger; 
	text-decoration: underline overline;*/
	color:#FFFFFF;
    background-color:#808080;
	}
	
.GlossaryTermB {
    /* it doesn't look like a double underline if it is 1px */
	border-bottom: 3px double;
	border-color: #CCCC99;
	}
	
.GlossaryTermC {
	border: 1px solid;
	padding:0px 2px 0px 2px;
	border-color:#CCCC99;
	}	
	
.GlossaryTermD {
	color:#006699;
	}		
	
	.GlossaryTermE {
	font-family: georgia, Times New Roman, Serif;
	font-weight: bold;
	}	

.GlossaryTerm {
	
border-bottom: 1px black dotted;
border-color:Gray;
overflow:hidden;
/* display:none; */

       /*   margin: 0;  */
          /* padding: 0; */
     /*     margin-right: -1ex; */
     /*    float: left; */
        
	}		
	
.GlossaryTermF:after
{
    
content:"g";
font-family: georgia, Times New Roman, Serif;
vertical-align: super;
font-size:smaller;
	font-weight: bold; 
}

#current a {
	float: left;
	padding: 7px 20px;
	border: none;
	border-right: 1px solid #000000;
		border-left: 1px solid #000000;
	font-size: 1.2em;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
/*	background: #cccccc;  */
background: #FFFFFF;
	}
	
#currentK a {
	float: left;
	padding: 7px 10px;
	border: none;
	border-right: 1px solid #000000;
		border-left: 1px solid #000000;
	font-size: 1.2em;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
/*	background: #cccccc;  */
background: #FFFFFF;
	}
	
#navigation a:hover {
/* 	background: #a6a69d;  */
background: #cccccc; 
	}
	
	#navigationEPS a:hover {
/* 	background: #a6a69d;  */
background: #cccccc; 
	}
	
	#identity {
	float: left;
	padding: 10px 0;
	}


/* full width horizontal submenus ------------------------------------------------- */
/* http://themedemos.dottoro.com/features/menu/horizontal-submenu/ 

#nav {
	margin: 0 auto;
	width: 740px;
}
	
#nav .menu_normal li {
    position: static !Important;
}

#nav .menu_normal .sub-menu  {
    left: 0 !Important;
    right: 0 !Important;
}

#nav .menu_normal .sub-menu > li {
    float: left !Important;
}

#nav .menu_normal .label_holder {
    width: auto !Important;
}



#nav .menu_normal .sub-menu > li {
    border-left: 1px solid #4f4d49;
}
#nav .menu_normal .sub-menu > li:first-child {
    border-left: 0;
}
*/
/* END full width horizontal submenus ---------------------------------------------- */

/* full width horizontal submenus, try 2 ------------------------------------------------- */
/* https://gist.github.com/jgoyon/3993263  */

#menu {
/*  width: 960px;
  height: 40px;
  clear: both;  */
  	margin: 0 auto;
	width: 900px;
}
 
ul#nav {
  float: left;
  width: 900px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #E8E8E8;
    /*  background: #dc0000 url(../img/menu-parent.png) repeat-x; */
}
 
ul#navSections li {
  display: inline;
  background: #E8E8E8;
}


/* Top line  */ 
ul#navSections li a {
  float: left;
  font: bold 1.1em arial,verdana,tahoma,sans-serif;
  line-height: 20px;
  color: #fff;
  text-decoration: none;
  margin: 0;
  padding: 0 7px;
  background: #999999;       /*  dark gray  */
  border-right-color: #E8E8E8;
  border-right-style: solid;
  border-right-width: thin;
    border-bottom-color: #E8E8E8;
  border-bottom-style: solid;
  border-bottom-width: thin;
}
 
/* APPLIES THE ACTIVE STATE */
/* just the top line, and just during the hover */
ul#navSections li .current2 a {
  color: #fff;
  text-decoration: none;
  background: #dc0000;
}

/* APPLIES THE ACTIVE STATE */
/* just the top line, and just during the hover */
ul#navSections  a.current2  {
  color: #fff;
  text-decoration: none;
  background: #dc0000;
}

/* APPLIES THE ACTIVE STATE */
/* just the top line, and just during the hover */  
/* ul#navSections .current a, ul#navSections li:hover > .current a   */
ul#navSections li ul li a.current   {
  color: #fff;
  text-decoration: none;
  background: #dc0000;
}

/* THE SUBMENU LIST HIDDEN BY DEFAULT */
ul#navSections  ul {
  display: none;
}
 
/* WHEN THE FIRST LEVEL MENU ITEM IS HOVERED, THE CHILD MENU APPEARS */
/* ul#navSections li:hover > ul */
ul#navSections li  ul 
{
  position: absolute;
  display: block;
  width: 898px;
  height: 20px;
  position: absolute;
  margin: 7px 0 0 0;
  padding: 0 7px 0 0;
  background: #E8E8E8;  
}
 
 /* the whole bottom line */
/*  ul#navSections li:hover > ul li a   */
ul#navSections li ul li a 
{
  float: left;
  font: bold 1.1em arial,verdana,tahoma,sans-serif;
  line-height: 20px;
  color: #fff;
  text-decoration: none;
  margin: 0;
  padding: 0 7px;
  background: #999999;
}
 
/* both lines, hover changes tab to black  */ 
/* ul#navSections li:hover > ul li a:hover   */
ul#navSections li a:hover ul li a:hover 
{
  color: #fff;
  text-decoration: none;
  background: #999999;
}

/* bottom line, while you click  */
ul#navSections li:hover > ul li a:current {
/* need always-show-active-submenu is missing. */
display: block !important;
visibility: visible !important;
}




/* END full width horizontal submenus, try 2 ---------------------------------------------- */

	
	
/* ------------------- CS267 --------------------------------*/	
/* margin is outside the box outline */
/* padding is inside the box outline */
.CS267title
{
float: left;
width: 900px;
background: #ffffff;
padding: 5px;

border-top: 0;
border-right: 1px solid #000066;
border-left: 1px solid #000066;
border-bottom: 3px solid #cc0000;

margin: 0;

font-size: 1.5em;
}

.CS267spaceBelow
{
float: left;
width: 900px;
background: #ffffff;
padding: 5px;

border-top: 1px solid #000066;
border-right: 1px solid #000066;
border-left: 1px solid #000066;
border-bottom: 1px solid #000066;

margin: 0px 0 10px 0;
}

.CS267spaceAboveAndBelow
{
float: left;
width: 900px;
background: #ffffff;
padding: 5px;

border-top: 1px solid #000066;
border-right: 1px solid #000066;
border-left: 1px solid #000066;
border-bottom: 1px solid #000066;

margin: 10px 0 10px 0;  /* change this back to 10 0 10 0 if they don't like the new nav */
}

.CS267noSpaceBelow
{
float: left;
width: 900px;
background: #ffffff;
padding: 5px;

border-top: 1px solid #000066;
border-right: 1px solid #000066;
border-left: 1px solid #000066;

margin: 0;
}




	
/* -------------------
div#buttonA {
    margin-left: 50px;
}
div#buttonA ul {
    margin: 0px;
    padding: 0px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 30px;
}
div#buttonA li {
    list-style-type: none;
    height: 30px;
    width: 125px;
    margin: 20px;
    text-align:center;
}
div#buttonA li a {
    height: 100%;
    width: 100%;
    display: block;
    text-decoration: none;
    border-width: 6px;
}
div#buttonA li a:link {
    color: #000000;
    font-weight: bold;
    background-color: #CCCCCC;
    border-style: outset;
}
div#buttonA li a:visited {
    color: #000000;
    font-weight: normal;
    background-color: #CCCCCC;
    border-style: outset;
}
div#buttonA li a:hover {
    font-weight: bold;
    color: #FFFFFF;
    background-color: #999999;
    border-style: outset;
}
div#buttonA li a:active {
    font-weight: bold;
    color: #FFFFFF;
    background-color: #666666;
    border-style: inset;
}
	
----- */
	
#identity h1 {
	margin: 0 auto 0 10px; 
	width: 900px; 
	font-family: georgia, "times new roman", times, serif;
	font-size: 28px;
	font-weight: normal;
	color: #73736c;
	} 

/* only used for CS267 master page apc.master */
#identity a {
	text-decoration: none;
	border: none;
	color: Black;
	} 
	
/****************************************
 * Content Sections
 ****************************************/
/*
	The following set of rules controls the most general layout elements 
	used throughout the templates. Every page must have these elements, 
	with the exception of #section-navigation and #secondary, which are 
	only required on two-column pages.
	
	The #wrap element is used to apply the beige background color to the
	main body of the page. #content is used to specify that the page is 
	740px wide and centered. #main and #secondary are the right and left
	vertical columns of content, respectively (one-column pages only use
	#main, which occupies the entire width).
*/
#wrap {
	float: left;
	width: 100%;
	background: #D3D3D3;
	}
 
#content {
	margin: 0 auto;
	width: 900px;

	}
#contentWide {
	margin: 0 auto;
	width: 1300px;

	}
	
#main {
	float: right;
	padding: 20px 0;
	width: 100%;
	}
	

#section-navigation, #secondary {
	float: left;
	clear: left;
	width: 200px;
	}
 
/****************************************
 * Section Navigation
 ****************************************/
/*
	The following set of rules controls the appearance of section navigation,
	which is used on two-column pages. Section navigation is displayed as a 
	vertical stack of links at the top of the left sidebar of a two-column page.
	
	For a detailed example of section navigation, see the two-column template.
*/

/* first item on the page gets no top margin */
.first {
	margin-top: 0;
	}
	
#section-navigation {
	margin-bottom: 50px;
	}
 
#section-navigation ul {
	margin: 0;
	padding: 0;
	font-size: 1.2em;
	font-weight: bold;
	}
	
#section-navigation li {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	background: none;
	}
	
#section-navigation a {
	display: block;
	color: Black;
		text-decoration: none;
			border: none;	
		margin: 0px;
/* 	padding: 10px;

	width: 180px;
	border-bottom: 2px solid #f4f4ef;  */
	}
	
#section-navigation a:visited {
	color: #000000;  

	}
		
#section-navigation a:hover {

		background: #ffffff;
	/* color: #f00; */
	}
	
#section-navigation a:active 
{
		color: #000000;  
/*	color:Teal;
	background: aqua;  */
	}

#section-navigation table, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1em;
	}
	
#section-navigation table {
	caption-side: bottom;
	}
	
#section-navigation th {
	padding: 0;
	font-weight: normal;
	text-align: left;
	color: #888;
	}
	
#section-navigation td, tbody th {
	padding: 1px 1px;
	vertical-align: top;
	}
	
#section-navigation tbody th {
	font-weight: bold;
	color: #222;
	text-align: left;
	}
	
	/* ---------------------------------------------------------- */ 
/* 
	Headlines 
	-------------------------
	Headlines introduce sections of text, and they should be used in a 
	way that consistently represents the heirarchy of information on a page.
*/
 
h2 {
	margin: 0 0 25px 0;
	font-size: 1.8em;
	font-weight: normal;
	}
	
h3 {
	clear: both;
	margin: 0 0 10px 0;
	font-size: 1.3em;
	line-height: 1.4em;
	font-weight: bold;
	}
	
h4 {
	margin: 15px 0 3px 0;
	font-size: 1.2em;
	font-weight: bold;
	}
	
/* 
	Text
	-------------------------
	Paragraphs of text, extended quotations, and captions
*/

p {
	margin: 0 0 16px 0;
	font-size: 1.3em;
	line-height: 1.4em;
	}
	
blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
	
	
/* captions */
	

	
/* 
	Lists 
	-------------------------
	Unordered lists (ul) represent a sequence of items in no particular
	order. They are displayed with a square bullet to the left of each 
	list item (li).
	
	Ordered lists (ol) represent an ordered sequence of items. They are 
	displayed with a number to the left of each list item (li).
	
	Definition lists (dl) represent a set of terms (dt) and definitions (dd).
	Each term should be followed by one or more definitions. Definition lists
	are very useful for marking up a series of links, each of which has an
	explanatory passage of text.

 */
	
	
ul {
    margin: 0;
    padding: 0px 0 15px 0;
	list-style: disc; 
	}
	
ul li {
    font-size: 1.3em;
	line-height: 1.4em;
    margin: 5px 0 0 25px;
	padding: 0 0 0 10px;
}

ol {
    margin: 0;
    padding: 0px 0 15px 0;
    list-style: decimal;
	}

ol li {

    font-size: 1.3em;
	line-height: 1.4em;
    margin: 5px 0 0 30px;
	padding: 0 0 0 10px;
	}




ul ol, ol ol, ul ol li, ol ol li {
	font-size: 1.0em;	
    margin: 10px;
    padding: 0;
    list-style: decimal;
	}
	
ul ul, ol ul, ul ul li, ol ul li {
	font-size: 1.0em;	
    margin: 10px;
    padding: 0;
    list-style: disc;
	}





dl {
	margin: 0 0 15px 30px;
	line-height: 1.4em;
	}
	
dt {
	margin: 0 0 3px 0;
	font-size: 1.2em;
	font-weight: bold;
	}
	
dd {
	margin: 0 0 15px 0;
	font-size: 1.3em;
	line-height: 1.4em;
	}
	


a {
	border-bottom: 1px solid #e5cfcf;
	color: #b31b1b;
	text-decoration: none;
	}
	
#imagelinks a {
	border: none;
	}
	
	.bigbluebox table {
	margin: 0px 0;
	}
	
	
#bigbluebox ul  li,  ul li li {


	margin: 0 0 5px 30px;
	padding: 0 0 0 0px;

    }
    
    
#bigbluebox ul  li,  ul li li {


	    font-size: 1.0em;
	line-height: 1.1em;
	    list-style-type: disc;
	/*	list-style-image: url(/ranger/images/bullet.gif);  */
    }
#bigbluebox ol, #bigbluebox li {

    margin: 0 0 5px 30px;
	padding: 0 0 0 0px;
    }

	
/*	
a:visited {
	color: #b37474;

	}
*/
	
a:hover {
	color: #f00;
	border-color: #f00;
	}
	
a:active {
	color: #b31b1b;
	border-color: #e5cfcf;	
	}
	


#secondary-image {
	margin: auto; 
	background-color:Fuchsia;
	float: left;
	clear: left;
	width: 200px;
	}



	
#secondary-section-first {
	margin-top: 25px;
	}
	

 

img 
{
    margin: 0px 5px 5px 5px;
	border-style: none;
    border-color: inherit;
    border-width: 0;
  /*  width: 492px;
    height: 461px; */
}

 .imgbox
{
margin: 20px 0 0 0;
/* padding: 5px; */
border: 1px solid #000066;
}



.main-photo-large {
	margin: 20px 0;
	width: 510px;
	}
	

.main-photo-small {
	margin: 5px 0 15px 25px;
	width: 210px;
	float: right;
	}
	
.main-photo-small-left {
	margin: 0 10px 10px 0;
	float: left;
	background-color: Transparent;
	}
	
.main-photo-small-right {
	margin: 0 10px 10px 0;
	float: right;
	background-color: Transparent;
	}
	
	
.main-photo-nav-top {
	margin: 20px auto;
	}

	
.main-photo-tiny {
	margin: 0 5px 5px 0;
	float: left;
	}
	
.staff-photo {
 float: left;
 border-color: White;
 border-style: solid;
 border-width: 5px;
/* max-height: 125px;
  max-width: 125px; */
 

  margin: 0px 10px  10px 0px;

	}
	


	
.main-photo-large .caption, .main-photo-small .caption {
	margin: 0;
	padding: 5px 10px 8px 10px;
	background: #fff;
	}
	


.secondary-photo {
	margin: 0 0 50px 0;
	}

#secondary .secondary-photo .caption {
	margin: 10px 15px 0 15px;
	}
	

 
.thumbnail {
	position: relative;
	
	/* padding makes room for the dropshadow, but offsets the image */
	padding: 6px 9px 9px 6px;
	background: url(../images/layout/shadow_tn.gif) no-repeat top left;
	
	/* position and margin fix the offset */
	top: -6px;
	left: -6px;
	margin: 0 0 -15px 0;
	}
 
table.centered 
{
    display:block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3em;
	caption-side: bottom;
	font-size: 1.1em;
	 border-collapse: collapse;
border-spacing:0;
	}




table.video {
	font-family: verdana,arial,sans-serif;
	font-size:11px;
	color:#333333;

}

video {
    background-color: #a6a69d; 
    border-style: solid; 
    padding: 4px; 
    margin: 0px 6px 0px 10px; 
    width: 640px;
}

table.vidicon {
	font-family: verdana,arial,sans-serif;
	font-size:11px;
	color:#333333;
	border: none;
	border-collapse: collapse;
}
table.vidicon td {
	border: none;
	padding: 0;
	vertical-align:middle
}

table.vidicon 	td img 
{
  padding: 3px 0px 0px 0px;
  vertical-align: bottom;
}




table {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3em;  
	caption-side: bottom;
	font-size: 1.1em;
	 border-collapse: collapse;
border-spacing:0;
	}
	
table tr th {
    background: #E8E8E8;
	font-weight: normal;
	text-align: center;
	color: #000000;
	padding: 4px 6px;
border-spacing:0;
	border:  1px solid Black; 


	}
	
table tr td {
	padding: 4px 6px;
	border:  1px solid Black; 

border-spacing:0;
	line-height: 1.5em;
	vertical-align: middle;
	}

table pre {
    font-size: 1em;
    line-height: 1em;
}
	
/*-----------------------------------------------------*/
table.small {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3em;  
	caption-side: bottom;
	font-size: .9em;
	 border-collapse: collapse;
border-spacing:0;
	}
	
table.small tr th {
    background: #E8E8E8;
	font-weight: normal;
	text-align: center;
	color: #000000;
	padding: 4px 6px;
border-spacing:0;
	border:  1px solid Black; 


	}
	
table.small tr td {
	padding: 4px 6px;
	border:  1px solid Black; 

border-spacing:0;
	line-height: 1.5em;
	vertical-align: middle;
	}
/*-----------------------------------------------------------*/
	


table.SmallBullets tr td ul li {
    font-size: 1.3em;
	line-height: 1.4em;
}

/* RadioWrap is a class on a table that has a radiobutton list that shouldn't wrap under the buttons.  See the EPS quizzes */
 table.RadioWrap  input
 {    
      float: left;
 }

 table.RadioWrap label
 {    
      margin-left: 25px;
      display: block;
 }
	
#noborder table tr td {
    border: 0;
	}

	
.TopAlign td 
{
	vertical-align: top;
}
	

	


caption {
	margin: 0 0 15px 0;
	text-align: center;
	color: #888;
	font-size: 1.1em;
	}  
	 
/****************************************
 * Forms
 ****************************************/
/*
	The following rules control the appearance of forms.
	
	Related sections of form inputs should be organized in fieldsets. 
	Each fieldset should contain a series of .form-pair divs. Each
	.form-pair should contain a .form-item div and a .form-value div. The 
	.form-item should contain a <label> for the <input> or <select> 
	found in the .form-value.
	
	For a detailed example of how to mark up a form, see the 
	one-column or two-column template.
*/
CUform {
	float: left;
	margin: 5px 0 15px 0;
	padding: 0;
	width: 510px;
	}
	
fieldset {
	float: left;
	margin: 0;
	padding: 10px 0 15px 0;
	width: 730px;
	border: none;
	border-top: 1px solid #e7e7e7;
	}
	
	
.row1 h3  {
	margin-left: 15px;
	}
	
.row2 h3 {
	margin-left: 15px;
	}
		
CUform h3 {
	margin: 0 15px 5px 15px;

	}		
	
.form-pair {
	display: inline;	/* prevent ie6/win from doubling margins */
	float: left;
	margin: 0px 15px 0 15px;
	width: 480px;
	}
	
.form-item {
	float: left;
	margin-top: 5px;
	width: 165px;
	font-size: 1.1em;
	line-height: 1.5em;
	text-align: right;
	}	
	
.form-value {
	float: right;
	margin-top: 5px;
	width: 300px;
	font-size: 1.1em;
	line-height: 1.5em;
	}

.checklist {
	margin: 0;
	font-size: 1em;
	}

.checklist li {
	margin: 0 0 5px 0;
	padding: 0;
	background: none;
	}
	
.input-text, select, textarea {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1em;
	}

.form-submit {
	border-top: none;
	background: #dbdbd2;
	}
	
.form-submit-buttons {
	text-align: right;
	padding-right: 15px;
	}
	
.form-submit-buttons .input-reset {
	margin-right: 5px;
	}
	
.input-submit, .input-reset {
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 1.3em;
	}
	
.input-submit {
	font-weight: bold;
	}
 
/****************************************
 * Hub Page Elements
 ****************************************/
/* 
	The following rules control the appearance of the elements found
	on a hub page. For more information about these elements, see the
	hub template.
*/

/* 
	Description, intro text 
	-------------------------
	The #hub-description div is displayed as the left column of textual
	content on the hub page. 
*/
 
#hub-description {
	float: left;
	width: 350px;
	}

	



#photo {
	float: left;
	}

#photo-meta {
	float: right;
	width: 200px;
	}	
	
#photo-meta .caption {
	margin: 10px 0;
	}
	
#photo-credit {
	color: #999;
	}
	

 
/****************************************
 * Footer
 ****************************************/
/* 
	The following rules control the appearance of the footer found at the 
	bottom of every page. The footer contains the Cornell University copyright,
	which is displayed in a small font size. The color of the bottom border
	of the link in the footer is darker than most links to provide adequate 
	contrast with the background color of the footer.
*/
 
#footer {
	float: left;
	width: 100%;
	}
	
#footer-content {
	margin: 0 auto;
	padding: 5px 0 25px 0;
	width: 900px;
	font-size: 1.0em;
	color: #333;
	}
	
/* links */

#footer a {
	border-bottom: 1px solid #ccadad;
	}
	
#footer a:active {
	border-color: #ccadad;	
	}
 
/****************************************
 * Miscellaneous
 ****************************************/

/* 
	Hide "skip to content" link from general users. 
	Do not use display: none, as that will also hide it from some screen readers.
*/
#skipnav {
	position: absolute;
	top: -1000em;
	left: -1000em;
	}
	

/* 
	Hide horizontal rules (hr) that are found throughout the site.
	The rules are semantic separations of content, and they are useful for 
	browsers that cannot utilize the stylesheet.
*/	
hr {
	display: none;
	}
	
hr.normal {
	display:  block;
	}
 
/****************************************
 * IE6/Windows Hacks
 ****************************************/
 
/*
	Shifting Background Bug:
	IE/Windows calculates "center" (for a background image position) differently
	than it does "50%" or "margin: 0 auto" (for foreground content) when the 
	page is an odd number of pixels wide.
*/
 
 
/* two-column pages */


/* see IE6/Win hack at bottom */
.twocolumn #wrap {
	background: #D3D3D3;
	}
	
.twocolumn #main {
	float: right;
	width: 510px;
	}
		 
.twocolumn #content {
	background: #D3D3D3 url(../images/layout/twocolumn_bg.gif) repeat-y top center;
	}
 
/* unhack for other browsers */
.twocolumn>#wrap {
	background: #D3D3D3 url(../images/layout/twocolumn_bg.gif) repeat-y top center;
	}
	


/* see IE6/Win hack at bottom */
.onecolumn #wrap {
	background: #D3D3D3;
	}
	
.onecolumn #main {
	float: right;
	width: 1300px;
	}
		 
.onecolumn #content {
	background: #D3D3D3;
	}
 
/* unhack for other browsers */
.onecolumn>#wrap {
	background: #D3D3D3;
	}
	

.CU  {	display: none;	}

#breadcrumb {

	margin: -18px 0 0 0;
	padding-bottom: 20px;

	}
	
img.centered
{
    display:block;
margin-left:auto;
margin-right:auto;
}


	
.shadow {
  padding: 5px;
  background: white;
  border: solid, red;
}

.invisible  {
	color:  #fff;

	}
	
#LoginForms table, tr, th, td {
	margin: 0;
	padding: 2px;
	border: 0;
	font-size: 1.1em;
	}
	

	
#LoginForms table {
	caption-side: bottom;
	}
	
#LoginForms th {
	padding: 0;
	font-weight: normal;
	text-align: left;
	color: #888;
	}
	
#LoginForms td, tbody th {
	padding: 1px 1px;
	vertical-align: top;
	}
	
#LoginForms tbody th {
	font-weight: bold;
	color: #222;
	text-align: left;
	}
	
	

 td div.comp { margin-top: -0.6ex; margin-bottom: -1ex;}
 td div.comb { margin-top: -0.6ex; margin-bottom: -.6ex;}
 td div.hrcomp { line-height: 0.9; margin-top: -0.8ex; margin-bottom: -1ex;}
 td div.norm {line-height:normal;}
 span.roman {font-family: serif; font-style: normal; font-weight: normal;} 
 span.overacc2 {position: relative;  left: .8em; top: -1.2ex;}
 span.overacc1 {position: relative;  left: .6em; top: -1.2ex;} 

 blockquote ul, ol {
	margin: 0 0 1px 0;
	padding: 0 0 5px 0;
	font-size: 1.0em;
	line-height: 1.1em;
	}
	

 blockquote ol, ol {
	margin: 0 0 1px 0;
	padding: 0 0 5px 0;
	font-size: 1.0em;
	line-height: 1.1em;
	}
	

	
blockquote ul li {
	margin: 5px 0;
	padding: 0 0 0 20px;
	list-style: none;
	background: url(../images/layout/bullet.gif) no-repeat 4px 0.65em;
	}
 
blockquote ol li {
	margin: 5px 0 5px 30px;
	}


pre {
  margin: 5px 15px 5px 15px;
  border-style: solid;
  border-color:  #000000;
  border-width: 1px;
  display: block;
  padding: 5px 12px 5px 12px;
    background-color: #F5F5F5; /* #e6ebec; */
  font-size: 1.2em;
  font-family: Courier New;
  white-space: pre-wrap;
  text-indent: 0px;
  overflow-x: auto;
  /*overflow-y: hidden; */
}





.center {
       margin-left: auto;
   margin-right: auto;
  }

lessthanangle {
    content: '>';
}

code {


  font-family:monospace;
  font-size:1.3em; 
  
   background-color: #F0F0F0; /* #e6ebec; */
   padding: 1px;

   white-space:nowrap;
  /*
      font-weight:bold;
      overflow: auto;*/
}

.handwriting
{
    	font-family: Lucida Handwriting, Comic Sans MS, Cursive;
}


/****************************************
 * For embedding .mp4 files into CS267
 ****************************************/
@charset "utf-8";

#tsc_player {
   z-index: 9999;	
}

.tscplayer_inline {
	position:static;
	margin: 30px;
	width: 640px;
	height: 480px;
	z-index:auto;
}

.tscplayer_fullframe {
	position:absolute;
	top: 0px;
	left: 0px;
	margin: 0px;
	padding: 0px;
	z-index: 9999;	
}

@media screen and (max-width: 640px) {
    .tscplayer_inline {
	width: 100%;
    }
}


/****************************************
 * End
 ****************************************/
 
 
 
 /* http://www.maxdesign.com.au/articles/css-layouts/one-fixed/  */
/* http://www.dynamicdrive.com/style/csslibrary/item/inverted-modern-bricks-menu/ */

#modernbricksmenu2{
padding: 0;
width: 780px;
border-top: 5px solid #e6ac3f; /*Brown color theme  #D25A0B */ 
background: transparent; 

voice-family: "\"}\"";
voice-family: inherit;
margin: 0;
}





#modernbricksmenu2 ul{

margin-left: 00px; /*margin between first menu item and left browser edge*/
padding: 0;

list-style: none;
}

#modernbricksmenu2 li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

#modernbricksmenu2 a{
float: left;
display: block;
font: bold 11px Arial;
color: white;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 5px 10px;
background-color: #999999; 
border-top: 1px solid #000000;
}

#modernbricksmenu2 a:hover{
background-color: #000000; /*Red color theme*/ 
color: white;
}

#modernbricksmenu2 #current a{ /*currently selected tab*/
background-color: #cc0000; /*Red color theme*/ 
font: bold 11px Arial;
color: white;
border-color: #cc0000; /*Red color theme*/ 
}


/* for the EPS course, below -------------------------------------------------------------------------------- */

#modernbricksmenu3{
padding: 0;
margin: 0;
width:  100%;
border-top: 5px solid #e6ac3f; 
}

/*
#modernbricksmenu3 ul li{
display: inline;
margin: 0 0 0 0; 
padding: 0;
list-style: none;
float: left;
}
*/

#modernbricksmenu3 ul{

margin-left: 00px; /*margin between first menu item and left browser edge*/
padding: 0;

list-style: none;
}

#modernbricksmenu3 li{
display: inline;
margin: 0 0 2px 0;
padding: 0;
float: left;
text-transform:uppercase;
}



#modernbricksmenu3 a{
float: left;
display: inline;
font: bold 11px Arial;
color: white;
text-decoration: none;
margin: 0 1px 0 0; /*Margin between each menu item*/
padding: 2px 6px 2px 6px;
background-color: #999999; 
border-top: 1px solid #000000;
}

#modernbricksmenu3 a:hover{
background-color: #000000;  
color: white;
}

#modernbricksmenu3 #current a{ 
background-color: #cc0000; 
border-color: #cc0000; 
}
/* -------------------------------------------------------------------------------------------------------------- */

ul.movie {
list-style-image: url('https://cvw.cac.cornell.edu/images/movie.gif');
} 

ul.video {
list-style-image: url('https://cvw.cac.cornell.edu/images/video.gif');
vertical-align: middle;
margin: 0 0 0 50px;
} 

ul.vidicon {
   list-style-image: url('../images/PressPlay40.jpg');
}

table.clip {
    border: none;
}

td.clip {
    border: none;
    
}

a.nounderscore {
    text-decoration: none; 
}


a:hover, a:visited, a:link, a:active img { outline: none; border: none; }