/* IE 5.5 fixes */
#mainContent {
	float: none;
	background-color: #fff;
}
#mainContent table {
	width: 98%;
}



@media handheld {

/* Shrink images to fit within viewport; some phones
   can't scroll horizontally. */
img	{
	max-width: 60%;
}


body	{
	padding: 0.2em;
	font-family: sans-serif;
	font-size: 100%; 
}
body,td,tr,div { font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 1.2em; }

a {color: #143E6D; text-decoration: underline; }


.breadCrumb, .splashHeader {
	display: none;
}
.skip { font-size: 0.6em; }


/* Reduce margin and border sizes slightly
   Use keyword for border-width above 3px
   Relax width to 'auto' and set max-width instead */

/* Limit the amount of vertical room the banner takes up: it shouldn't
    take up most of the screen! We care about physical size here, not
    screen resolution.
   Most of this image can be cut off without a problem, so also
   release the max-width and clip the overflow. */
#pageHeader img	{
}

/*
#weatherContainer {
	display: none;
}
*/

/* Release width restriction,
   reduce height/line-height,
   close right end of border box
   and adjust margin */
ul {
	margin: 1em;
	padding: 0em;
}
ul li {
	margin: 0.4em;
	padding: 0em;
}



#weatherContainer {
	float: none;
	width: auto;
	font-size: 0.8em;
	background-color: #fff;
	padding: 0.2em;
	margin: 0.2em;
}



/* Vertical margins should be given either as small pixel values
    (a few pixels for a bit of graphical breathing room) or as
    ems (relative to the font size) so it scales with the font.
    10px is close to font size, so it fits under the latter
    category --> 0.8em
   Switch 5px margin/padding to percentages */


/* Vertical margin -> em, as above*/
#mainContent ul ul li {
	margin-top: 0.83em;
	}




	/*  Typography */

/* Specific fonts are ok for headlines, so leave font-family alone
   Adjust top margin from px to em and reduce it a bit (the 2px on the
    bottom margin is small enough to be left alone)
   Reduce line height to 1em; headings frequently break into multiple
    lines on such small screen, and we don't want spacing /within/ the
    heading, only around it. */

h1, h2, h3, h4, h5, h6	{
	line-height: 1em;
	margin: 0.7em 0em 0.3em 0em;
	}

/* Don't use keyword sizes based on small as default; we don't know the
    readability scale of the handheld's default font. (Even if we specify
    a font we won't know; handhelds rarely have much choice.)
   If you use keywords, base them off medium, or, as here, use relative
    sizes in 'em's for non-nesting cases. */
h1	{
	font-size: 1.4em;
	}
h2	{
	font-size: 1.2em;
	}

h3 {
	font-size: 1.1em;
	}

#rightRail	{
	font-size: 0.8em;
}


h4 {
	font-size: 1em;
}

h5 {
	font-size: 0.9em;
	}
h6 {
	font-size: 0.8em;
	}



	/*  Forms */

/* Make sure inputs stay inside the content area */
input, textarea, select {
	max-width: 100%;
	}



}