/* XHTML TAG SELECTORS */
 
body {
    font-size: 100.01%;
    background: #fff;
    margin: 0;
    padding: 0;
    font-family: arial, helvetica, sans-serif;
    }

code, pre {
    font-size: 110%;
    }

dt {
    margin-top: 1em;
    }

h3, h6 {
    text-decoration: underline;
    }

h4, h6 {
    color: #c00;
    }

h4, h5 {
    font-size: 110%;
    margin-top: 1.25em;
    margin-bottom: 0.5em;
    }

h6 {
    font-size: 110%;
    margin-top: 1em;
    margin-bottom: 0.75em;
    }

img {
    border: none;
    display: block;
    }

ol li+li { padding-top: 0.8em; }

ol ul { padding-top: 0.5em; padding-bottom: 0.5em; }

table {
    border: 1px solid #63c;
    margin: 2em auto;
    }

td {
    background: #eaedff;
    color: #448;
    }

thead td, th {
    font-weight: bold;
    background: #ccf;
    color: #448;
    }


/* MAIN HEADER SELECTORS */

#main_header {
    background: url(../images/ubrand/gray_back_strip.jpg) top left repeat-x;
    height: 100px;
    }

#main_header img {
    }

#pageId {
    position: absolute;
    top: 10px;
    right: 20px;
    font-family: "arial black", arial, veranda, helvetica, sans-serif;
    font-size: 370%;
    color: #fc9;
    margin: 0;
    }

#search {
	position: static;
	text-align: center;
	padding: 0;
	margin: 0;
	display: block;
	height: 41px;
	width: 152px;
	background: #77797c;
    }

#search fieldset {
	white-space: nowrap;
	padding: 9px 0 0 0;
	text-align: center;
	display: block;
	border: 0;
}



/* MAIN AND APP MENU SELECTORS */
/* Slightly scrambled, but the alternative is to double up on selectors
which would seriously bloat this file */


/* Lift the main menu tab bar into the bottom portion of 
the main header */
#main_menu {
    margin-top: -20px;
	  margin-bottom: 0;
    }

/* Set all states of anchors to be one color by default */
#app_menu a:link, 
#app_menu a:visited, 
#app_menu a:active,
#main_menu a:link, 
#main_menu a:visited, 
#main_menu a:active {
    color: #fff;
    text-decoration: none;
    }

#app_menu a:hover,
#main_menu a:hover {
    text-decoration: underline;
    color: #fff;
}

/* The current section of navigation in the lower bar */
#main_menu li.current ul {
    background: url(../images/ubrand/ubrand-temp-tabs-bg.png) bottom left repeat-x;
    border-top: 1px solid #c00;
    display: block; 
    }

#main_menu li.current {
    background: url(../images/ubrand/ubrand-temp-tabs-selected-right.png) top right no-repeat;
    padding: 0;
    padding-top: 0.2em;
    }

#main_menu li.current>a {
    background: url(../images/ubrand/ubrand-temp-tabs-selected-left.png) top left no-repeat;
    padding: 0.2em 2.5em 0 2em;
    }

/* app_menu bar */
#app_menu li {
    display: inline;
    width: auto;
    text-align: center;
    font-size: 11px;
    padding: 1px 1em;
    border-right: 1px solid #c00;
    padding-bottom: 3px;
    }

/* Upper main menu bar, all tabs including current */
#main_menu li {
    float: left; 
    font-size: 12px;
    text-align: center;
    }

/* Lower main menu bar, all navigation including current */
#main_menu li li {
    width: auto;
    padding: 0 1em;
    font-size: 11px;
    border-right: 1px solid #c00;
    }

/* All lists in all menus */
#app_menu ul,
#main_menu ul {
    position: relative;
    list-style: none; 
    margin: 0;
    padding: 0;
    }

/* Positioning unique to app_menu */
#app_menu ul { 
    margin-left: 0;
    margin-right: 0;
    background: url(../images/ubrand/ubrand-temp-tabs-bg.png) bottom left repeat-x;
    padding: 1px 0;
	padding-bottom: 3px;
    }

/* Lower main_menu bar. Hide by default, allowing the current navigation
to be selectively "turned on" */
#main_menu ul ul {
    display: none; 
    position: absolute;
    top: auto;
    left: 0;
    width: 100%;
    background: #c00;
    }

/* The upper main_menu bar. The tab class is for 
   tabs that are not current */
#main_menu li.tab {
    background: url(../images/ubrand/ubrand-temp-tabs-default-right.png) top right no-repeat;
    padding: 0;
    padding-top: 0.2em;
}

#main_menu li.tab>a {
    background: url(../images/ubrand/ubrand-temp-tabs-default-left.png) top left no-repeat;
    padding: 0.2em 2.5em 0 2em;
    }



/* MAIN COLUMNAR CONTENT SELECTORS */

/* The three columns of content are all contained within
the "content" div. The two side columns are floated to the
left and right with negative margins. Because it's all within
one div, the height of the div will be determined by the
tallest column, which guarantees that the footer will 
ALWAYS be at the bottom of our page. */

/* Central content column */
#content {
	border: 1px solid #77797c;
	border-top: 0;
	border-bottom: 0;
	border-right: 0;
	margin: -5px 0 0 152px;
	padding: 0;
    min-width: 500px;
    }

/* Left column */
#main_left {
/*
	border-top: 41px solid #fc9;
	*/
	border-bottom: 1px solid #fc9;
    float: left;
    width: 130px;
	margin-top: -2px;
    margin-left: -153px;
    padding-bottom: 0;
    padding-right: 24px;    /* Pushes the column into the content div so
                            content's height can expand to this column's height */
    }

/* "Header" over the left column */
/*
#main_left_header {
	margin: -35px 10px 10px 10px;
    }
*/

/* Right column */
#app_right {
    float: right;
    width: 170px;
    margin-top: -7px;
    margin-right: -169px;
    padding-bottom: 0.5em;
    padding-left: 22px;     
}


/* Left and right column box styling */
#main_left .boxbody {
	border: 0;
    padding: 0 8px 8px 8px;
	margin: 0 auto;
    font-size: 12px;
	width: 100%;
    }

#main_left .boxbody p {
    margin: 0;
    padding-top: 5px;
    line-height: 1;
}

#main_left .boxbody ul {
    list-style: none;
	padding-top: 7px;
	padding-left: 10px;
	margin: 0;
    }

#main_left .boxbody ul li {
    padding: 0.2em 0;
	margin: 0 auto;
    }

#main_left .boxhead {
	margin-top: -10px;
	height: 17px;
	width: 152px;
    background: url(../images/ubrand/ubrand-boxhead-bg-gray.png) top left repeat-x;
    }

#main_left .boxhead h2 {
	padding: 1px 0 0 10px;
	color: #fff;
	font-weight: normal;
	font-size: 12px;
	width: 100%;
	height: auto;
	cursor: pointer;
    }


/* SELECTORS FOR CENTRAL COLUMN CONTENT */

#app_body {
	padding: 20px;
	min-width: 380px;
}

#app_body .boxbody ul li {
	margin-top: 1em;
	}

#app_header {
    position: relative;
    margin: -1px 0 0 0;
	background: #77797c;
	height: 40px;
    }

#app_header h1 {
    position: absolute;
    right: 0;
    font-family: "arial black", arial, veranda, helvetica, sans-serif;
    font-size: 1.5em;
    margin: 0 10px 0 0;
    padding: 3px 0 5px 0;
    text-align: right;
    color: #fff;
}

#app_header p {
    margin: 0 10px 0 0;
    padding-bottom: 5px;
    font-size: 0.8em;
    font-weight: bold;
    text-align: right;
    color: #fff;
}

#slide_show img {
    width: 100%;
}


/* MAIN FOOTER SELECTORS */

#main_footer {
    margin: 0 5px 5px 5px;
    font-size: 0.8em;
    width: auto;
    text-align: center;
    padding: 0;
    border-top: 1px solid #c60;
    clear: both;
    }



/* SPECIAL SELECTORS USED BY THE STYLE SWAPPER */

/* The following IDs and their alternates are used
for style swapping in the left and right columns. 
By default, the display of these IDs is on; the swapped
state turns the display off. */

#content-alt1 {            /* no left column */
    margin: 1.8em 170px 0 0;
    padding: 0 15px;
    }

#content-alt2 {            /* no right column */
    margin: 1.8em 0 0 170px;
    padding: 0 15px;
    }

#content-alt3 {            /* no left or right column */
    margin: 1.8em 0 0 0;
    padding: 0 15px;
    }

#main_left,
#app_right,
#badEnglish,
#badFarsi,
#sweetSwahili,
#tackyTagalog,
#badEnglish2,
#badFarsi2,
#sweetSwahili2,
#tackyTagalog2 {
    display: block;
    }

#main_left-alt,
#app_right-alt,
#badEnglish-alt,
#badFarsi-alt,
#sweetSwahili-alt,
#tackyTagalog-alt,
#badEnglish2-alt,
#badFarsi2-alt,
#sweetSwahili2-alt,
#tackyTagalog2-alt {
    display: none;
    }

/* Buttons for hiding main_left and app_right */
#hideshow_l, #hideshow_l-alt {
    /* Until further notice, disable these buttons */
    display: none;

    background: url(../images/hidelt.gif) top left no-repeat;
    position: absolute;
    cursor: pointer;
    height: 119px;
    width: 20px;
    top: 50%;
    left: 170px;
    }

#hideshow_r, #hideshow_r-alt {
    /* Until further notice, disable these buttons */
    display: none;

    background: url(../images/hidert.gif) top right no-repeat;
    position: absolute;
    cursor: pointer;
    height: 119px;
    width: 20px;
    top: 50%;
    right: 170px;
    }

#hideshow_l-alt {
    background: url(../images/showlt.gif) top left no-repeat;
    left: 0;
    }

#hideshow_r-alt {
    background: url(../images/showrt.gif) top right no-repeat;
    right: 0;
    }


/* ID styling for modules */

/* Relative/absolute positioning required by Safari */
#mod_hpcstat li {
	position: relative;
	}

#mod_hpcstat li img {
	position: absolute;
	right: 0;
	}

#mod_login fieldset {
	border: 0;
	}

#mod_login legend {
	display: none;
	}

#mod_login input {
	display: block;
}


/* Classes of HelpDot PRs */

.deprecated {
    background: #fcc;
    }

.archived {
    background: #8cc;
    }
    
.error {
    border: 4px solid red;
    background: #fcc;
    }

.error .boxbody {
    border-top: 1px solid #f00;
    }

.error p {
    color: #f00;
    padding-top: 5px;
    }

.box {
    position: relative;
	width: 100%;
    margin: 0;
    }

/* The next two selectors need to be specified 
for style switching in left and right columns */
.boxbody {
    display: block;
    }

.boxbody-alt {
    display: none;
    }

.boxbody {
    margin: 0;
    padding: 0 10px 10px 10px;
    font-size: 90%;
    border-top: 1px solid #848484;
    }

.boxbody h3 {
    padding-left: 0;
    margin-bottom: 5px;
    color: #66c;
}

.boxbody img {
    margin: 0;
    margin-top: 10px;
    margin-bottom: 5px;
	}

.boxbody p {
    margin: 0;
    padding-top: 5px;
    line-height: 1.3;
    }

.boxbody p+p {
    text-indent: 10px;
    }

.boxbody pre {
    width: 98%;
    overflow: auto;
    }

.boxhead h2 {
	padding: 8px 10px 0 10px;
	margin-bottom: 3px;
	color: #900;
	font-size: 110%;
	font-weight: bold;
	}

.byline {
    text-align: center;
    font-style: italic;
    padding-bottom: 10px;
    }

.posted {
    margin: 0;
    font-style: italic;
    font-size: 70%;
    padding-right: 15px;
    color: gray;
    }

span.responsible, span.status {
    color: #969;
    padding-right: 10px;
    }


/* The following class replaces the need for clearing divs or other
 * clearing block level elements */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

.code {
    padding-left: 5px;
    border: 2px solid #eef;
    }

/* The employee class is used to format staff directory entries */
.employee p {
    margin: 0;
    padding: 0;
    }

.employee p+p {
    text-indent: 0;
    }

item {
    color: #900;
    font-size: 110%;
    font-style: italic;
    margin-top: 1.2em;
    margin-bottom: 0.2em;
    }

.itemDesc {
    line-height: 1.3;
    padding-left: 2em;
    }

/* Classes used by node_owner info */
.nodeowner {
    width: 30em;
    margin: 2em auto;
    padding: 0 0 2em 0;
    border: 2px solid #8f8aff;
    }

.nodeowner h3, .nodeowner h4 {
    text-align: center;
    margin-top: 0.8em;
    }

.nodeowner ol, .nodeowner ul {
    text-align: left;
    padding-right: 2em;
    }

.nodepolicy {
    width: 25em;
    margin: 0 auto;
    margin-top: 2em;
    border: 1px solid #336;
    }

.printonly {
    display: none; /* This content is turned back on in print CSS files */
    }

/* Controls styling for system status lists in side column modules */

ul.sysstat {
	list-style: none;
	}

ul.sysstat li {
	width: 120px;
	border-top: 1px dotted #fc9;
	font-size: 12px;
	}

ul.sysstat li.lastli {
	border-bottom: 1px dotted #fc9;
	}

ul.sysstat img {
	float: right;
	margin: -14px 3px 0 0;
	padding: 0;
	}


/* Fixes IE6 "peekaboo" bug (Win. only) \*/
* html #app_content, .boxhead h2 {height: 1%;}
* html .boxbody {height: auto;}
/* End of peekaboo fix */

/* FOR NOW, TURN OFF THE RIGHT COLUMN */
#app_right { display: none; }