/* CSS Document */
/* this only contains the more general definitions and the color scheme.  Font size, margins, padding, visibility are defined in "wide" or "narrow" */

/* the exceptions to the above rule */
body {	font-size: 100%;	font: Georgia, "Times New Roman", Times, serif; background-color: #003333; }

body.centered
{	background-color: #003333; font-size: 100%;
	/* the following width and margin settings must be the same as those of header_tabs */
	margin-left:auto;
	margin-right:auto;
	width: 80%;
	min-width:75px;
	max-width:1300px;
    z-index: -1;
}

A:active, A:hover {color: red; text-decoration: underline;}
H6 {font: 8px "Futura MD BT"; color:white;} 

.for_wide  {	display: none;}
.for_narrow {	display: none;}

/***************** TITLE STUF ***********************/

/***************** TITLE BANNER ON TOP OF ALL PAGES ***************************/
.TitleBody 
{	width:auto;
    top: 50px;
    position: relative;
	margin:0px 0px 50px 0px;
	border:1px solid white;
	padding:0px 20px 5px 20px;
    background-color: #243932; 
}
.Title 	   { color:white; background-color: #243932; }
H1.Title {font-size: 2.2em; padding-top:5px;}
H2.Title {font-size: 2.0em; padding-top:0px; padding-bottom: 0px;}
H3.Title {font-size: 1.8em; padding-bottom: 1px; }
H4.Title {font-size: 1.4em; font-style:italic; padding-top:0px; padding-bottom: 0px;}
A.Title:active, A.Title:hover {color: red; text-decoration: underline;}
A.Title:link, A.Title:visited {	color: white; text-decoration: none;}
A.Title:active, A.Title:hover {color: red; text-decoration: underline;}

/*************** MAIN TOP BUTTONS *************************************************/
tr.bttn_row { background-color:black;}

.butt 
{   display: block;
    height: 50px;
    text-align: center;
	font-weight: bold;
	line-height:50px;
     background-color: #022;  color: white; 
}
span.butt { line-height:50px;} /* so that the labels are vertically aligned in the middle*/
td.butt { width: 19%; }
a.butt:link, a.butt:visited { color: white; text-decoration:none; line-height:50px;}
a.butt:hover, a.butt:active { color: red;  background-color: white; line-height:50px;}
span.butt:hover {	background-color: white; color: black;}

.button 
{   display: block;
    height: 50px;
    width: 150px;
    text-align: center;
    background-color: #34696f;    color: white;
	font-weight: bold;
/* adapted from http://designshack.net/articles/css/css-button-tutorial-how-to-code-buttons-in-5-simple-steps/ */
}
a.button:link, a.button:visited {    color: white;text-decoration:none; line-height:50px;}
a.button:hover { color: red;  background-color: white; }
span.button:hover {	background-color: white;  	color: black; }
td.button { width: 19%; }

/********* narrow stuf otherwise described in xs-class-narrow ***********/
.narrow_tabs
{	background-color: #19281C;	color: white; 
	position:relative;
	margin-left:auto;
	margin-right:auto;
	z-index:10; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
}

.header_tabs 
{	background-color:black;	color: white; 
	position:fixed;
		_position:absolute;
	top:0px;
	/* the following width and margin settings must be the same as those of body.centered */
	width:80%;  
	min-width:75px;
	max-width:1300px;
	margin-left:auto;
	margin-right:auto;
	z-index:10; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
}

.my_top_tabs
{	color: yellow;	background-color: blue;	
	border: thick;
	border-right: thick;
	border-color: green;
	width: 150px;
}

tr.bttn_row { display: none; height:55px; width:100%;}
td.bttn {width:20%;}

.butt 
{   height: 50px;
    text-align: center;
	font-weight: bold;
	line-height:50px;
}
span.butt { line-height:50px;} /* so that the labels are vertically aligned in the middle*/
td.butt { width: 19%; }

.button 
{   height: 50px;
    width: 150px;
    text-align: center;
   background-color: #004284;
    color: white;
	font-weight: bold;
/* adapted from http://designshack.net/articles/css/css-button-tutorial-how-to-code-buttons-in-5-simple-steps/ */
}
a.button:link, a.button:visited {    color: white;text-decoration:none; }
a.button:hover { color: red;  background-color: white; }
span.button:hover 
{	background-color: white; 
	color: black;
}
td.button { width: 19%; }


/****************** EVERYTHING CONTROLLING EH DROPDOWN MENUS *****************/

.flexdropdownmenu, .flexdropdownmenu ul /*the same as .header_tabs button: like a border for the sub-menus;  */ 
{	background-color:#022; 	color: black; font-weight: bold;
	font-size: 0.9em;
	padding: 0;
	width: 400px;  /* this width must be the same as .flexdropdownmenu li */
	line-height: 50px;
	text-align: right;
	color: black;
 }
li.flexdropdownmenu  {height: 50px;}
a.flexdropdownmenu {	color:black; text-decoration:none;}

a.submenu:link 
{ 	background-color: #BBE1D3;
	width:360px; /* should be smaller than flexdropdownmenu and the right padding */
    height: 35px; 	/* controls the width of each menu item */
	padding: 0px 30px 10px 0px;
	font-size:1.2em; 
	font-weight:bold;	
	border-bottom: 1px solid black;
	color:black;
	margin: 0 10 0 0;
}
a.submenu:hover, a.submenu:visited
{   height: 35px;    /*this height + padding top = height in .butt */
	padding: 0px 30px 10px 0px;
	background-color: white; 
	color:black;
}

/* for second level menus that may have different width and colos */
.flexdropdownmenu2 ul {	color: black; width:200px;}
a.submenu2:link, a.submenu2:visited
{	height: 35px; 
	background-color: #BBE1D3; /* #CEE6E8;*/
	padding: 0px 30px 10px 0px;
	font-size:1.2em; 
	border-bottom: 1px solid black;
	width:400px;
	color:black;
	margin: 0 0 0 100;
}
a.submenu2:hover
{   /*height: 35px;    this height + padding top = height in .butt */
	padding: 0px 30px 10px 0px;
	background-color: white; 
	color:black;
}


/* controls links without submenus */
li.flexmenu {	background-color: #CEE6E8; /* #CEE6E8;/* blue; /* #0D86FF;*/	color: black; }

/* controls links with further menus */
li.flexsubmenu {	background-color: #0D86FF; /* blue; */	color: black;}
.flexsubmenu:hover {	background-color: white; 	color:black;}
a.flexsubmenu {	background-color: black;/*#CEE6E8 blue; */ }


/***************** MAIN PAGE FORMAT WITH ALL CONTENTS ***************************/
/***************** MAIN PAGE FORMAT WITH ALL CONTENTS ***************************/
/***************** MAIN PAGE FORMAT WITH ALL CONTENTS ***************************/
.pgbdy {
    background-color: #FBFFFB; 
	position:relative; /* Position is declared "relative" to gain control of stacking order (z-index). */
	top:5px;
	border:1px solid white;
    padding: 0px 100px 200px 20px;
	z-index:3; /* This allows the content to overlap the right menu in narrow windows in good browsers. */
	}

.reverse_indent {text-indent: -2em;}

/* these based on w3school css for hide/show elements*/
.hidden_text-button { background-color: #eee;}
.hidden_text /* from w3schools on modals */
{ 	z-index:3;
	display:none;
	padding:10 20 20 10;
	position:fixed;
	left:100px;
	top:250px;
	font-size: 0.8em;
	width:80%;
	height: 400px;
	overflow:auto;
	background-color: #151515;
	color: white;
}
.hidden_text-container 	{content:"";display:contents;clear:both}
a.hidden_text-container:link   { color: beige;}
a.hidden_text-container:hover  { color: red;}



/** for titles of main parts of the notes 
the actual control of what these look like is in "print, or narrow or wide css **/
ol.head  {	list-style-type:upper-roman; }
ol.subhead { list-style-type:upper-latin; }
li.subhead {  padding-bottom: 10px; }
ol.subsub {	list-style-type: decimal; }
ol.pack {	list-style-type:lower-roman; }


.bot_arrows {display:block}
.bot_right_arrow
{	position:fixed; 
	display: none;
	bottom:200px; 
	right:10px; 
	width:50px; 
	z-index:1;
}

#container{ display:none; }
.ssmHdr, .ssmItem, .ssmBar, .ssmItems {	display:none; }

.smaller_font {font-size: 65%;}
.address
{	display:block;
	position:relative; 
	top:20px;
	margin:auto;
	border:5px solid black;
}


/* everything needed when printed the course pages */
@media print
{
body.centered { display:block; }
	
H1 {font-size: 1.5em; padding-top:5px;}
H2 {font-size: 1.3em; }
H3 {font-size: 1em; padding-bottom: 1px;}
H4 {font-size: 0.8em; font-style:italic; padding-top 0px; padding-bottom: 0px; }
H6 {font: 8px "Futura MD BT"; color:black;} 

.ssmHdr, .ssmItem, .ssmBar, .ssmItems {	display:none; }
.header_tabs, .my_top_tabs, .button, .butt, .bot_right_arrow, .bot_arrows, .bottom_nav {display:none; }
.container, .address, .Title { display:none; }

/******************* SYLLABUS ***********************/
.session {margin-bottom: 10px}
.date, .ses_title 
{
	font-weight: bold;
	font-size: 1em;
	line-height: 0.8em;
	margin-left: 50px;
	text-indent: -50px;
} /* session title */

.req 
{	margin-left:50px; 
	font-size: 1em; line-height: 1.1em;	
	margin-top: 1px;
}  /* for the list of required items of each class section */

.rec 
{	margin-left:25px; 
	font-size: 0.9em;
	line-height: 1em;
}

p.indent {text-indent: 50px;}

.rev_indent {
	margin-left: 50px;
	text-indent: -50px;}

/*********** INDIVIDUAL LECTURE NOTES *********************************/
.pgbdy {	display: block; padding: 0px 20px 0px 5px; font-size: 1.3em; }



ol.head, ul.head /** for titles of main parts of the notes **/
{   margin-left: -3px;
	margin-bottom: 50px;
	padding: 10px 10px 10px 10px;
}
li.head
{	padding: 2px 2px 2px 2px;
	font-weight:bold;
}
p.head 
{	padding: 2px 2px 2px 2px;
	font-weight:normal;
}
ol.subhead, ul.subhead /** for titles of main parts of the notes **/
{
/*	margin-bottom: 20px; */
	padding: 5px 5px 10px 55px;
	font-weight:normal;
}
li.subhead, p.subhead { margin-bottom: 10px; }

ol.subsub, ul.subsub, li.subsub, p.subsub /** for titles of main parts of the notes **/
{
	margin-bottom: 10px;
}

ol.pack, ul.pack, li.pack, p.pack /** for titles of main parts of the notes **/
{
	margin-bottom: 5px;
}



} /*********** END @media_print *********************************/