/***   colors   ***/
/*  magenta: xx00xx,  00 in the middle is no green = magenta */
/*    standard: ff00ff
/* lowering the value of the two ff's, R and B values,  makes the shade darker */
/* raising the value of the 00, the G value,  makes the magenta lighter */
/* to stay "magenta", keep the R and B values the same, e.g. c800c8 */
/*    dk mag: cc00cc, dkr BB00BB  */
/*    dark magenta  8F00F8  */
/*    vpale for "offwhite" text  ffe0ff */
/*    vvpale for "white"  fff0ff */
/*  dark pseudo-magenta  8F1F8D  */
/*  blue-grey b0c4de  */
/*                                    */
/* fonts:                             */ 
/* "Courier New", Courier, monospace  */
/* Verdana, Geneva, sans-serif        */
/* Arial, Helvetica, sans-serif       */
/* Georgia, serif                     */
/* Arial, Verdana, sans-serif         */
/* "Palatino Linotype", "Book Antiqua", Palatino, serif  */
/* "Times New Roman", Times, serif    */

/* an example */
/* ul.a {list-style-type:hebrew;}  */
/* <ul class="a"> */
/*   <li>Coffee</li> */
/*   <li>Tea</li> */
/* </ul> */


.bodyscroll
{ 
    background-image:url('MyImages/bkgd10_6x4.png'); 
}

.bodyfixed
{ 
    /* background-color:#b0c4de; */
    background-image:url('MyImages/bkgd10_6x4.png');
    background-attachment:fixed;
}




/*** HEADER/FOOTER Properties ***/
.banner
{
    /* text items */
    font-family:"Times New Roman", Times, serif;
    text-align: left;
    font-size: 30px;  /* tags like h1, h2 etc. are sized relative to this */
    color: #AA00AA;
    /* box items */
    border: solid #000000;   /* having a boarder centers it vertically for some reason; else there is an offset. */
    height:150px;
    width:700px;
    margin:1 auto; 
    background-color:#000000;
}


.bannerimg
{
    float:left; 
    height:120px;
    width:120px;
    padding:0px 40px 0px 30px;  /* top, rt, bot, lt */
}


.mytag 
{
    font-style: italic;
    color: #c890c8;
    font-size: 25px;  /* tags like h1, h2 etc. are sized relative to this */
    position: relative;
    top: -40px;
    left: 400px
}


.footer
{
    /* text items */
    font-family:"Times New Roman", Times, serif ;
    text-align: center;
    font-size: 14px;  
    color: #AA00AA;

    /* box items */
    height:20px;
    width:240px;
    margin:1 auto; 
    padding: 10px;
    background-color:#000000;
}

/*** END HEADER/FOOTER Properties ***/




/*** Text Classes ***/
/* see .mytag above for an example */
/*** END Text Classes ***/





/*** Text Block Classes ***/
.underconstruction
{
    text-align: center;
    color: #ffe0ff;
    width:750px;
    margin: 1px auto; 
    border: solid #8F008F
}



.title
{
    /* text items */
    font-family:"Times New Roman", Times, serif ;
    text-align: center;
    font-size: 24px;
    color: #AA00AA;

    /* box items */
    height:30px;
    width:800px;
    margin:1 auto;
    padding: 20px;
    background-color:#000000;
}




.titleArticle
{
    /* text items */
    font-family:"Times New Roman", Times, serif ;
    text-align: center;
    font-size: 28px;
    color: #AA00AA;
    /* box items */
    height:30px;
    width:800px;
    margin:1 auto;
    padding: 20px;
    background-color:#fff0ff;
}



.subtitleArticle
{
    /* text items */
    font-family:"Times New Roman", Times, serif ;
    text-align: center;
    font-size: 24px;
    color: #AA00AA;
    /* box items */
    height:30px;
    width:800px;
    margin:1 auto;
    padding: 20px;
    background-color:#fff0ff;
}



.subsubtitleArticle
{
    /* text items */
    font-family:"Times New Roman", Times, serif ;
    text-align: left;
    font-size: 20px;
    color: #AA00AA;
}


.main  /* a centered container for divs */
{
    clear:both;
    /* box items */
    width:980px;   /* holds the text and img/link divs below; min 966  */
    padding: 20px;
    margin: 40px auto;
}



.mainArticle  /* a wider version for articles */
{
    clear:both;
    /* box items */
    width:1080px;   /* holds the text and img/link divs; designed for those with the extension: Article  */
    padding: 20px;
    margin: 40px auto;
}



.Article   /* a wider version for articles that take the whole page - text with images embedded, instead of to the side */
{
    /* text items */
    font-family: Georgia, serif;
    text-align: left;
    color: #000000;
    /* box items */
    width:980px;   
    padding: 40px;
    margin: 20px auto;
    background-color:#fff0ff;
    border: solid #8F008F;
}



.textL
{
    /* text items */
    font-family: Georgia, serif;
    text-align: left;
    color: #000000;
    /* box items */
    width:600px;
    padding: 40px;
    margin: 20px auto;
    background-color:#fff0ff;
    border: solid #8F008F;
    float: left;
}



.textR
{
    /* text items */
    font-family: Georgia, serif;
    text-align: left;
    color: #000000;
    /* box items */
    width:600px;
    padding: 40px;
    margin: 20px auto;
    background-color:#fff0ff;
    border: solid #8F008F;
    float: right;
}



.textC
{
    /* text items */
    font-family: Georgia, serif;
    text-align: left;
    color: #000000;
    /* box items */
    width:600px;
    padding: 40px;
    margin: 20px auto;
    background-color:#fff0ff;
    border: solid #8F008F;
}



.homecaption
{
   display:inline-block;
   /* text items */
   font-family: Georgia, serif;
   font-size:100%;
   text-align: left;
   color: #ee90ee;
   /* box items */
   width:390px;
   padding: 20px;
   margin: 10px auto;
   /*** border: solid #8F008F;  ***/  /*** useful for testing ***/
}

/*** try sometime p{  width: 350px; margin: 20px; padding: 20px; background: #eee; }   To set a paragraph ***/
/*** to set the 'a'  a { margin: 10px; background: #eee; color: black; padding 10px; }  E.g. for <a href="stuf"</a>  ***/
/*** End Text Classes ***/





/*** Style Classes ***/

<style type="text/css">  /* doesn't work */
#newsrow img {
margin-left:5px;
margin-right:5px;
}
</style>

/*** END Style Classes ***/





/*** Image Classes ***/
.imgEmpty
{
    /* box items */
    width:200px;
    height:75px;
    padding: 15px;
    margin: 40px auto;
}



.imgL
{
    /* box items */
    float:left;
    width:200px;
    padding: 15px;
    margin: 40px auto;
    background-color:#c890c8;
    border: solid #8F008F;
}



.imgC
{
    /* box items */
    width:200px;
    padding: 15px;
    margin: 20px auto;
    background-color:#c890c8;
    border: solid #8F008F;
}



.imgNews
{
    /* box items */
    float:left;
    width:400px;
    padding: 15px;
    margin: 20px 10px 0px 10px;
    background-color:#c890c8;
    border: solid #8F008F;
}



.imgCmainArticle
{
    /* box items */
    width:300px;
    padding: 15px;
    margin: 20px auto;
    background-color:#c890c8;
    border: solid #8F008F;
}



.imgCArticle
{
    /* box items */
    display: inline-block;  
    width:300px;
    padding: 5px;
    margin: 20px 40px 20px 40px;  /* puts space b/n side-by-side elements */
    background-color:#c890c8;
    border: solid #8F008F;
}



.imgText   /* for text images embedded in a text section; e.g., equations */
{
    /* box items */
    width:600px;  /* textR width is 600px */
    margin: 60px 60px 60px 60px; /* doesn't seem to do anything */
    padding:2px;
    background-color:#c890c8;
    border: solid #8F008F 1px;  
}



.imgTextArticle   /* for text images embedded in an article = full page width text; e.g., equations */
{
    /* box items */
    display: inline-block;   
    width:916px;  /* Article width is 980px with a padding of 40; 956+2+2 (padding) = 960 */
    margin: 20px 0px 20px 0px;  /* doesn't seem to do anything */
    padding:2px;
    background-color:#c890c8;
    border: solid #8F008F 1px;  
}
/*** END Image Classes ***/





/*** Div Classes ***/


<!-- Testing container and fake_img from http://jsfiddle.net/B6Jsy/ -->
.container{
    text-align:center;
    border:1px solid #666;
}

.fake_img{
    display:inline-block;
    margin:5px 20px;
    padding:5px;
    border:1px solid #8F008F;
}



<!-- doesn't work -->
.homeDiv {
    /* box items */
    float:left;
    width:40px;
    padding: 15px;
    margin: 20px 10px 0px 10px;
    background-color:#c890c8;
    border: solid #8F008F;;

   display:inline-block;
   /* text items */
   font-family: Georgia, serif;
   font-size:90%;
   text-align: left;
   color: #ee90ee;
   /* box items */
   width:390px;
   padding: 20px;
   margin: 10px auto;
   /*** border: solid #8F008F;  ***/  /*** useful for testing ***/
}
/*** END Div Classes ***/





/*** Link Classes ***/
.linkL
{
    /* text items */
    font-family: Georgia, serif;
    text-align: left;
    color: #ee90ee;
    /* box items */
    width:200px;
    padding: 15px;
    margin: 20px auto;
    float: left;
}



.linkCmainArticle
{
    /* text items */
    font-family: Georgia, serif;
    font-size:90%;
    text-align: left;
    color: #ee90ee;
    /* box items */
    width:320px;
    padding: 5px 10px 15px 10px;
    margin: 10px 20px 10px 20px auto;
}



.linkCArticle
{
    /* text items */
    font-family: Georgia, serif;
    font-size:90%;
    text-align: left;
    color: #8F008F;
    /* box items */
    display: inline-block; vertical-align: top;
    width:310px;
    padding: 0px 47px 15px 40px;      /* (top, R, bot, L) margin doesn't seem to add the needed space, but padding does... */
    margin: 20px 40px 20px 40px auto;   /* puts space b/n side-by-side elements; same as for imgCArticle */
}


.linkC
{
    /* text items */
    font-family: Georgia, serif;
    font-size:90%;
    text-align: left;
    color: #ee90ee;
    /* box items */
    width:220px;
    padding: 5px 10px 15px 10px;
    margin: 10px 20px 10px 20px auto;
}



.linkClarge
{
    /* text items */
    font-family: Georgia, serif;
    font-size:90%;
    text-align: left;
    color: #ee90ee;
    /* box items */
    width:400px;
    padding: 5px 10px 15px 10px;
    margin: 10px 20px 10px 20px auto;
}


.linkcolor a:link {color:#fff0ff; text-decoration: none;}      /* unvisited link */
.linkcolor a:visited {color:#ffc0ff; text-decoration: none;}  /* visited link */
.linkcolor a:hover {color:#fff0ff; text-decoration: none;}  /* mouse over link */
/* .linkcolor a:active {color:#0000FF; text-decoration: none;}  selected link */ 

/*** END Link Classes ***/





/***  Clear Classes ***/
.clear2left
{
    clear:both;
    float:left;
}



.clear2center
{
    clear:both;
    float:center;
}



.clear
{
    clear:both;
}
/***  ENDClear Classes ***/






/*** NAV MENU PROPERTIES ***/

/**  The nav bar itself, upon which everything is laid out  **/
nav {
    background-color:#AA00AA; /*+*/
    height:30px;  /* height of the bar across the page */
}
 


/**  Elements in the main bar (top-level list)  **/
nav ul {
    font-family: Georgia, serif;  /* font in bar and pulldowns; I think Verdana is a backup */
    font-size: 18px;  /* font size in main bar; not in pulldowns */
    list-style: none;  /* removes bullets from standard list style */
    margin: 0;  /* removes margin from standard list style */
    padding: 0;  /* removes padding from standard list style */
}




/**  For elements in the top and pull-down menus  **/
/* affects anyting in an <a> </a> block */
nav ul li a {
    display: block;
    text-decoration: none;  /* removes the standard underline for links */
    padding: 5px 15px 5px 15px; /* padding for top and pull-down text */
    background: #AA00AA;  /* background of top-level menu items.  */
    color: #ffffff;   /* text color of top and pull-down menu items */
    margin-left: 1px;
    white-space: nowrap;  /* no wrapping of menu lables; could do if label height was increased */
    height:20px; /* Width and height of top-level and pull-down (by default?) nav items */
    width:120px;
    text-align:center;  /* alignment of top-level menu items */
}
 
/* affects anyting in an <a> </a> block */
nav ul li a:hover {
    background: #BB00BB;   /* mouse hover color for main bar, not pulldowns */
}




/**  Elements in the pull-down menus (nested lists)  **/

nav li:hover li a:hover {
  background: #BB00BB;  /* pulldown hover color */
}
 
nav ul li {
    display: block;  /* makes pulldowns vertical; use "inline" instead of "block" to be horizontal. */
    position: relative;
    float: left;   /* floats elements in bar to left/right, not elements in pulldown */
}
 
nav li ul {
    display: none;  /* makes pulldowns vertical when not in hover mode (block would be horizontal) */
}

nav li:hover a {
    background: #AA00AA;  /* color of pull-down items */
    height:20px; /* height of lower-level nav items is shorter than main level */
    /* width:140px;  width of pull-down items; should match width of top-level items */
}
 
nav ul li ul li a {
    text-align:left; /* alignment of nested lists (pulldown); top-level items remain centered. */
}
 
nav li:hover li {
    float: none;
    font-size: 15px;  /* font size of pull-down items */
}
 


/* I have no idea what this does */ 
nav li:hover ul {
  display: block;
  position: absolute;
  height:20px;
}
 
/*** END NAV MENU PROPERTIES ***/