﻿/* CSS for Employee Contact Pages, Columbia College, Sonora California
/* Code documented for future maintenance and to sate the curious
/* CSS Developed by B Hill. Yosemite CCD IT. hillb@yosemite.edu
/* Revision A1, Standard Contact Page, October 2009
/* All rights reserved
*/

body { /*entire page body*/
	width:auto; /* subsequent styles require page width to be defined.*/
	text-align:center; /* required by ie for inherited div centering*/
	font-family: "trebuchet MS", Verdana, Arial, Helvetica, sans-serif; /* set trebuchet as the default font pagewide*/
}
img { /* all site images*/
	border:0; /* no borders on any images sitewide*/
}
h1, h2, h3 { /* content header styles*/
	font-style:normal; /* no bold*/
	font-weight:100; /* normal font thickness*/
	font-family: "trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}
#header { /*red bar at top of design*/
	width: 984px; /* width accomodates 40px worth of browser scroll bars*/
	height: 113px;
	padding-top: 0;
	margin-top: 5px; /*forces the small white gap seen at the top of the layout*/
	text-align: left; /* since we aligned text center in the body element, we need to pull it left again in the child elements*/
	margin-left: auto; /*  the auto margins center the layout in the browser*/
	margin-right: auto;
	background: #b20839;
}
#header-image {/* container for header auxiliary graphics or text */
	position: relative;
	padding: 0; /* content should align to the edges of the div*/
	width: 400px;
	height: 113px;
	margin-top: 0px; /* pull div against top of parent */
	margin-left: auto; /* fixes alignment bug in IE*/
	margin-right:15px; /* maintain minimum space between right edge and search boxes*/
	float: right; /* allow search box div to align to the right of this one*/
	overflow:hidden; /*if an oversize image or excessive text is placed here, clip it to preserve the overall layout*/
}
#header-nav, #header-nav a, #header-nav a:hover, #header-nav a:visited {/* container for header quick links and search box*/
	margin: 0;
	padding: 0;
	width: 150px;
	float: right; /* float surrounding divs to the right*/
	color: #b20839; /* used to make labels blend with bg color for sighted users*/
	/* font-size: 5px; used to make labels really tiny for sighted users*/
	clear:none; /* does not force line break for surrounding floated elements*/
	margin-top: 50px; /* push search boxes down for design*/
}
#header-nav form { /*quick links form*/
	margin-top: 0px;
	margin-bottom: 0px;
	display:inline; /* kills the line break that IE normally places around form elements*/
}
.skip a, .skip a:hover, .skip a:visited { /* hidden skip nav text when it doesn't have focus*/
	position:absolute; /* render outside of the rest of the page*/
	left:0px;
	top:-500px; /*render outside of page when not in focus to make invisible*/
	width:1px; /* and make it small*/
	height:1px; /* very small*/
	display:block; /* browser should render and position as an object, and not as text*/
}
.skip a:active, .skip a:focus { /* hidden skip nav when focus is applied*/
	position:static; /* render inline with text*/
	width:auto; /* reset width to normal for the contained text*/
	height:auto; /* again*/
	color: #ffcf53; /* change text to a visible color*/
	float: left; /* float any surrounding content to the left, rendering the text to the objects right*/
	font-size:12px; /* a slightly smaller text size makes the links less obtrusive*/
}
#q { /*google search form*/
	font-size: 11px;
	width: 105px;
	display: inline; /* remove IE line break around form objects*/
	top: 0;
	padding:0;
	border: 0px;
	font-family: "trebuchet MS", Verdana, Arial, Helvetica, sans-serif; /* force font within text box */
	height: 16px;
	margin-right: 0px;
	padding-left: 5px;
}
#jumpMenu { /* quick links select box*/
	font-size: 11px;
	width: 128px;
	display: inline;
	top: 0;
	padding:0;
	border: 0px;
	font-family: "trebuchet MS", Verdana, Arial, Helvetica, sans-serif; /* sets font for content within the dropdown, won't otherwise inherit*/
	visibility: hidden;
	display: none; 

}
#bodyContainer { /* main div containing all page content elements*/
	width: 984px; /* 1024-40px to accomodate browser scroll bars*/
	padding-top: 0px;
	margin-top: 0px;
	text-align: left; /* override body text align center*/
	overflow:hidden; /* if placed elements are wider than the container, clip them to preserve layout*/
	margin-left: auto; /* center on screen*/
	margin-right: auto;
	margin-bottom:50px; /* whitespace between element and subsequnt elements*/
}
#sideBar { /*sub to bodycontainer for menus and additional content*/
	float:left; /* position this item on the left of the parent container*/
	width: 185px; /*orig 204*/
	margin-top: 20px;
	/*padding-top:25px;  white space between topmenu and beginning of content*/
	padding-left: 10px; /*enforce a minimum 1px space between left edge of screen and beginning of content*/
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	background-color: #f2f0e1; /* A2 background color for side menu*/
}
/*FOR REFERENCE. Here is the math on the widths of the bodycontainer objects
	/* sidebar = 204px content area + 1x overall left/right padding for 205px of overall screen utilization
	/* bodymain = 745px content area + 30px overall left/right padding for 775px overall screen utilization
	/* total screen utilization: sidebar + bodymain = 980px. 4px of parent is unutilized, allowing for vagaries in browser rendering
	*/

#bodyMain { /* sub containing main body of page content*/
	/*float:right;  move this content to right side of bodycontainer
	width: 745px;*/
	padding-top:20px; /* enforce minimum white space between top of content and topmenu*/
	padding-left:25px; /*enforce minimum white space between content and content in sidebar*/
	padding-right: 5px; /* enforce minimum white space between content and right edge of screen*/
}
#footer, #footer a, #footer a:visited { /* content and links at bottom of page*/
	font-size:12px; /* small*/
	color:#000000; /* black*/
	text-decoration:none;
}
#footer a:hover {
	color:#CC0000; /* red*/
	text-decoration:underline;
}
#topMenu { /* main menu bar*/
	background-color: #fac952; /* goldenrod"ish"*/
	width: 984px;
	padding-top: 0px; /* no spacing surrounding menu*/
	margin-top: 0px;
	text-align: left; /* override body alignment*/
	margin-left:auto; /* center on screen*/
	margin-right: auto;
}
#topMenu a:link, #topMenu a:visited, #topMenu a:hover { /*style for top level menu text*/
	color:#000000; /* black*/
	text-decoration: none;
}
#topMenu ul ul li a:link, #topMenu ul ul li a:visited, #topMenu ul ul li a:hover { /* style for hyperlinks within the flyouts*/
	font-size: 14px;
}
#topMenu ul { /* top level menu*/
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none; /* eliminate the normal layout assocuiated with UL's*/
	display: block; /* render as an object instead of text*/
	min-height: 0; /*permit menu to collapse fully if needed*/
	white-space:nowrap; /* A2 keep top menu items from partially wrapping if text size > 100%*/
}
#topMenu li { /*list objects in top level menu*/
	display: block;	/* render as block*/
	margin: 0;
	margin-left:40px; /* A2 Introduces spacing between top level items. Actual spacing is a combo of this and margin defined in '#topMenu ul a' */
	padding: 0;
	border: 0;
	float: left;	/* move all main list items into one row, by floating them */
	position: relative;	/* position each LI, thus creating potential IE.win overlap problem */
	z-index: 5;		/* thus we need to apply explicit z-index here... */
}
#topMenu li:hover { /* top level menu hover*/
	z-index: 10000;	/* ...and here. this makes sure active item is always above anything else in the menu */
	white-space: normal; /* required to resolve IE7 :hover bug */
}
#topMenu ul li li { /* items in second level li's within the flyouts */
	margin-left:0px; /* A2 Overrides parent 30px left margin inheritance to keep dropdowns from shifting right*/
	float: none; /* items of the nested menus are kept on separate lines */
}
#topMenu ul ul { /* second level menu (flyouts)*/
	visibility: hidden;	/* initially hide all submenus. */
	position: absolute;
	z-index: 10;
	padding-left:0px; /*A2 overrides inherited padding settings.*/
	margin-left:0px; /*A2 overrides inherited margin settings.*/
	top: 0; /* to avoid scrollbars as much as possible */
	min-height: 0; /*permit menu to collapse fully if needed*/
	width: 13em;  /*width of flyout menu (used to be 11em, Jake changed to 13em to stop line wrapping*/
	border: solid #ffffff 1px; /* wrap flyouts in red border*/
}
#topmenu ul ul:hover { /* flyout ul hover*/
/* A2 DEPRECATED. Left in to accommodate future adjustments 
border: 1px solid #b20839;  wrap the entire flyout in a red border*/
}
#topMenu ul ul>li + li { /* all flyout li items other than the first*/
	border-top: 1px solid #fff; /* apply white border to top*/
}
#topMenu li:hover > ul { /*when li is hovered, apply this to ul*/
	visibility: visible;
	top: 100%;
}
#topMenu ul:after, #topMenu ul ul:after { /* inserts a small hidden element after each UL to enforce proper breaking. Credit ADxMenu for this one. Works around bug in Firefox */
	content: "."; /* insert a period into the rendering*/
	height: 0;
	display: block;
	visibility: hidden; /* and make it invisible*/
	overflow: hidden;
	clear: both;
}
#topMenu ul ul a { /* hyperlinks within flyout menus*/
	padding-left:8px; /* set left padding on individual items within flyout menus*/
}
#topMenu ul ul a:hover { /* active hyperlinks in flyout menus*/
	background-color:#b20839; /* set bg to red*/
	color: #fff; /* set text to white*/
}
#topMenu ul ul, #topMenu ul ul li { /* both flyout elements*/
	background: #fac952; /* flyout background color*//* if base flyout text color is to be changed, place that here*/
}
#topMenu ul a { /* hyperlinks in top level menu*/
	padding: 2px 25px 2px 0; /* spacing around top level menu items. the spacing between menu items and should be reduced if new elements are added*/
	display: block; /* render as object instead of text*/
	position: relative;
}



#sideBar p { /*A2 set default text color for content in side bar */
	color: #866a61;
}

#sideContent p:before{
/*content: url(http://yos-webdev/columbia/menuBar.gif);*/
}

#sideContent a, #sideContent a:visited {
	color:blue;
}



#sideBar p a { /* A2 set default link color for content in side bar*/
	/*color:#000000;*/
	text-decoration:none;
}

#sideBar p a:hover { /* A2 set default hover behavior for content in side bar */
	text-decoration:underline;

}



#folderMenu p { /*A2 set default values for text in main menu */
	line-height: 12px; /* Adjust vertical spacing between menu items */
}
#folderMenu p, #folderMenu p a, #folderMenu p a:visited { 
	font-size: 14px;
	font-weight:bold;
	color:#b20839 !important;
	text-decoration:none;
}
#folderMenu p a:hover {
	text-decoration:underline;
	
}

#sideBar p {
	color: #000000;
}

#sideBar p a {
	/* color:#000000; */
	text-decoration:none;
}

#sideBar p a:hover {
	text-decoration:underline;

}

#logoImage {

	float:left;
}

#sidenav {
	display:none;

}

a.nohyper:link, a.nohyper:visited {
	color:black;
	text-decoration:none;
	
}

a.nohyper:hover, a.nohyper:active {
	color:black;
	text-decoration:underline;
	
}

a.statichyper:link, a.statichyper:visited, a.statichyper:hover, a.statichyper:active {
	text-decoration:none;
	color:#b20839;	
}


#content {
	display:none;

}
.x-small {font-size: x-small;}
.small {font-size: small;}
.normal {font-size: medium;}
.large {font-size: large;}
.x-large {font-size: x-large;}




		
/* CUSTOM DIRECTORY STYLES */

	.viewing 
	{
	 /*span containing number of results currently displayed*/
	 color: Black;
	 float:right;	
	}
	
	.found 
	{
	 /*span containing number of total results found*/	
	 color:Black;
	}
	
	.pnlView 
	{
	 /*div cotnaining both .viewing and .found spans*/
	background-color:#fac952;
	clear:both;
	padding-left:5px;
	padding-right:5px;	
	}
	
	.noResults 
	{
	 /*styling for the no results span*/	
	}
	
	.resultItem 
	{
	 /*div wrapper for result*/	
	 clear:both;
	 padding-top: 0px; /* no spacing surrounding item*/
	 margin-top : 10px;
	 text-align: left; /* override body alignment*/
	 margin-left:auto; /* center in parent*/
	 margin-right: auto;
	 margin-bottom:20px;
	 /* background-color:#f9fff9 !important;*/
	 background-color:#ededec;
	 padding-left:5px;
	 padding-right:5px;

	}
	
	.resultItem hr 
	{
	display: block;
	clear: left;
	margin: -0.66em 0;
    visibility: hidden;
    padding:0 0 0 0;
    height:0px;
    }
	
	.altItem 
	{
	 /*div wrapper for alt result*/	
	 clear:both;
	 padding-top: 0px; /* no spacing surrounding item*/
	 margin-top : 0px;
	 text-align: left; /* override body alignment*/
	 margin-left:auto; /* center in parent*/
	 margin-right: auto;
	 margin-bottom:10px;
	 padding-left:5px;
	 padding-right:5px;
	}	
	
	.altItem ul 
	{
	padding-top:0px !important; /* override UL padding in alternate item */
	}
	
	.altItem hr 
	{

	display: block;
	clear: left;
	margin: -0.66em 0;
    visibility: hidden;
    padding:0 0 0 0;
    height:3px;

    }
	
	.resultsList 
	{
	 /*UL with data item*/	
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none; /* eliminate the normal layout assocuiated with UL's*/
	display: block; /* render as an object instead of text*/
	min-height: 0; /*permit menu to collapse fully if needed*/
	white-space:nowrap; /* A2 keep top menu items from partially wrapping if text size > 100%*/
	padding-bottom:0px;
	padding-top:5px;
	}
	
	.resultsList li { /*list objects in top level menu*/
	display: block;	/* render as block*/
	margin: 0;
	padding: 0;
	border: 0;
	float: left;	/* move all main list items into one row, by floating them */
	position: relative;	/* position each LI, thus creating potential IE.win overlap problem */
	z-index: 5;		/* thus we need to apply explicit z-index here... */
}

   .resultsList li a { /* hyperlinks in top level menu*/
	 /* padding: 2px 25px 2px 0;spacing around top level menu items. the spacing between menu items and should be reduced if new elements are added*/
	display: block; /* render as object instead of text*/
	position: relative;
	color: #0000FF !important;
}
	
	.resultName 
	{
	 /*LI with user name	
	color:Black;
	font-weight:bold;*/
	min-width:235px !important;
	padding-right:15px !important;
	}
	
	.resultTitle 
	{
	 /*LI with user title
	 clear:left;
	 color:Black;*/	
	 clear:left !important;
	 min-width:235px;
	 float: left !important;
	 padding-right: 15px !important;
	}
	
	.resultOffice 
	{
	 /*LI with user office	
	 display:none !important;
	 float:right !important;*/
	}
	
	.resultDept 
	{
	 /*LI with user department	
	 display:none !important;*/
	 float:left !important;
	 
	}
	
	.resultDeptLong 
	{
	 /*LI with user long department	
	 float:right !important;
	 color:Black;
	 clear:right;*/
	 display:none !important;


	 
	}
	
	.resultPhone 
	{
	 /*LI with user phone number
	float:right !important;	
	 font-weight:bold;
	 color:Black;*/
	 float:right !important;
	}
	
	.resultEmail 
	{
	 /*LI with user email
	 display:none !important;*/	
	 float:right !important;
	 clear:right !important;
	}
	
	.lnkName 
	{
	 /*href link with users name*/	
	}
	
	.lblTitle 
	{
	 /*span with users title*/	
	}
	
	.lblOffice 
	{
	 /*span with users office*/	
	}
	
	.lblDept 
	{
	 /*span with users department*/	
	}
	
	.lblDeptLong 
	{
	 /*span with users long department*/	
	}
	
	.lblPhone 
	{
	 /*span with users phone number*/	
	}
	
	.lnkEmail 
	{
	 /*href link with users email address*/	
	}
	
	#footCount 
	{
	 /*div containing foot paging controls*/	
	 margin-top:20px;
	 clear:both;
	  color: #0000FF !important;
	}
	
	.pagerEnabled
	{
	 /*href link for foot paging controls when enabled*/	
	 color: #0000FF !important;
	
	}
	
	.pagerCurrent 
	{
	 /*href link for currently matching pager item*/	
	 color:Red !important;
	}
	
	.pagerDisabled 
	{
	 /*href link for foot paging controls when disabled*/	
	}
	
	.prev 
	{
	 /*span containing the previous link*/	
	 color: #0000FF !important;
	}
	
	.next 
	{
	 /*span containing the next link*/	
	 color: #0000FF !important;
	}
	
	.pagenum 
	{
	 /*spans containing the links used in the pager controls page id nums*/	
	 color: #0000FF !important;
	}
	
	#labelSearch 
	{
	/* label for text search */	
		
	}
	
	.searchLabel 
	{
	/* label for text search */	
		
		
	}
			#labelOffice 
	{
	/* label for text search */	
		
	}
	
	.officeLabel 
	{
	/* label for text search */	
		
		
	}
	
