/********************************************************************************************
File:           main.css
Version:        1.0 
Last Modified:  May-22-2008
---------------------------------------------------------------------------------------------
Description:    Stylesheet for the UBC Mech website
---------------------------------------------------------------------------------------------
Cross-Browser
Compatibility:  - PC - IE.7, FF, Safari - not yet tested
				- Mac - Safari, FF - not yet tested
---------------------------------------------------------------------------------------------
Version Notes:				
- v.1.0 (beta): 1st Production version
---------------------------------------------------------------------------------------------
Design by:		Adrian Liem
				Web Communications, UBC Public Affairs
                t: 604.822.2908
                e: web.admin@ubc.ca
                w: www.cms.ubc.ca
---------------------------------------------------------------------------------------------
********************************************************************************************/

/* Reset Browser CSS */
/* The following lines of reset the default styling applied by browsers. Based on Yahoo!'s YUI Reset CSS: http://developer.yahoo.com/yui/reset/ */
html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;line-height:1.25}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}table {font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

/* ------------ UBC CLF ------------------ */
/********************************************************************************************
File:           ubc_clf.css
Version:        0.3 (beta)
Last Modified:  Mar-07-2007
---------------------------------------------------------------------------------------------
Description:    Stylehseet for the University of British Columbia's Common Look & Feel 
                banner.

                For more information about the UBC Common Look & Feel (CLF) initiative, 
                please visit: www.publicaffairs.ubc.ca/ubcweb/clf.
---------------------------------------------------------------------------------------------
Cross-Browser
Compatibility:  - PC : FireFox 1.5, IE 6, Maxthon, Netscape 4,7,8
                - Mac: Camino 1.0, FireFox 1.5, Opera 8.51, Safari 1.3.2
---------------------------------------------------------------------------------------------
Notes:          The markup for the UBC CLF Banner should be placed at the top of the page
                body and not inside any other containing divs (see below for sample markup).

                All selectors in the UBC CLF Banner are pre-pended with 'ubcBanner'. To avoid
                conflicting style rules, do not use 'ubcBanner' in any of your site-specific
                style selector names.
---------------------------------------------------------------------------------------------
Version Notes:				
- v.0.3 (beta): Minor adjustment to height of banner and positioning of UBC logo.
- v.0.2 (beta): Finalized version for release.
---------------------------------------------------------------------------------------------
Contact:        UBC Public Affairs
                t: 604.822.8925
                e: web.admin@ubc.ca
                w: www.publicaffairs.ubc.ca/ubcweb
---------------------------------------------------------------------------------------------
Core Markup:

 UBC CLF 
<div id="ubcBannerWrapper">
  <div id="ubcBanner">
    <div id="ubcBannerCrest"><a href="http://www.ubc.ca/" title="UBC.ca"><img src="/ubcclf/images/ubc_logo.gif" alt="UBC.ca" title="UBC.ca" border="0" /></a></div>
    <p class="ubcBannerTitle"><a href="http://www.ubc.ca/" title="The University of British Columbia">The University of British Columbia</a></p>
    <ul class="ubcBannerLinks">
      <li class="ubcBannerlifirst"><a href="http://www.publicaffairs.ubc.ca/ubcnews/" title="UBC Public Affairs">News</a></li>
      <li class="ubcBannerli"><a href="http://www.liveat.ubc.ca" title="Live@UBC">Events</a></li>
      <li class="ubcBannerli"><a href="http://www.ubc.ca/directory/" title="UBC Directory">Directories</a></li>
      <li class="ubcBannerli"><a href="http://www.ubc.ca/search/" title="Search UBC">Search UBC</a></li>
      <li class="ubcBannerlilast"><a href="http://my.ubc.ca" title="myUBC"><span class="my">my</span>UBC Login</a></li>
    </ul>
  </div>
</div>
 /UBC CLF 

********************************************************************************************/

/********************************************************************************
The wrapper holds all of the banner elements. Two default stylings are available:
(1) fixed-width and (2) fluid, full-width.
********************************************************************************/

/* Fixed-width banner */
#ubcBannerWrapper {
  border: 0px solid #39ba42; /* change to 1px to test container sizing + positioning */
  width: 740px;
  margin: 0 auto; /* to left-align the banner, change this to margin:0; */
  padding: 0;
  margin-bottom: 10px;
}

/* Fluid full-width banner */
#ubcBannerWrapperFull {
  border: 0px solid #39ba42; /* change to 1px to test container sizing + positioning */
  width: 100%;
  margin: 0 auto;
  padding: 0;
  margin-bottom: 10px;  
}

/****************************
Position the UBC logo graphic
*****************************/
#ubcBannerCrest {
  margin-left: 13px;
  _margin-left: 6px; /* for IE 6 */
  margin-top: 3px;
  float: left;
}
#ubcBannerCrest a img {
  behavior: url('../js/pngbehaviour.htc');
}

/****************************************************
Define properties for the banner and links in CLF bar
*****************************************************/
#ubcBanner {
  clear: both;
  position: relative;
  width: 100%;
  height: 43px;
  background: url('http://www.cms.ubc.ca/_common/ubc_clf/images/ubc_banner_003399.gif') repeat-x;
  font-family: Arial, Helvetica, sans-serif;
  color: #fff;
  text-transform: uppercase;
  font-weight: normal;
  font-size: .7em;
  white-space: nowrap;
}

#ubcBanner a:link, #ubcBanner a:visited {
  text-decoration: none;
  color: #fff;
}
#ubcBanner a:hover {
  text-decoration: underline;
}
#ubcBanner a:active {
  text-decoration: none;
}

/**********************************************************************
Define properties for banner title "The University of British Columbia"
***********************************************************************/
#ubcBanner p.ubcBannerTitle {
  /* border:1px solid #f90; /* uncomment to test sizing + positioning */
  float: left;
  padding: 0 6px;
  margin-top: 23px;
  font-size: 100%;
  font-weight: bold;
  font-family:Verdana, Arial, Helvetica, sans-serif;
}

/********************************************************************************
Set properties for list items: News, Events, Directories, Search UBC, myUBC Login
*********************************************************************************/
ul.ubcBannerLinks {
  /* border:1px solid #39ba42; /* uncomment to test sizing + positioning */
  float: right;
  margin-top: 23px;
  margin-left: 0;
  padding-left: 0;
  background-color: #039;
}

ul.ubcBannerLinksNarrow { /* this ul version is for the full width banner, with narrow fixed-width content left-aligned */
  /* border:1px solid #39ba42; /* uncomment to test sizing + positioning */
  position: absolute;
  left: 410px;
  margin-top: 16px;
  margin-left: 0;
  padding-left: 0;
  background-color: #039;
  line-height: 27px;
}

li.ubcBannerli {
  display: inline;
  border-left: 1px solid #fff;
  padding: 0 4px 0 8px;
  margin: 0;
}
li.ubcBannerlifirst {
  display: inline;
  border-left: none;
  padding: 0 4px 0 0;
  margin: 0;
}
li.ubcBannerlilast {
  display: inline;
  border-left: 1px solid #fff;
  padding: 0 8px 0 8px;
  margin: 0;
}
#ubcBanner .my {
  text-transform: lowercase; /* transform myUBC */
}

/*****************************************
Accessibility
*****************************************/
/* Skip to Main Content */
#skip a, #skip a:visited {
  float: right;
  overflow: hidden;
  padding: 2px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 9px;
  color: #fff;
  text-transform: lowercase;
}
#skip a:active {
  position: static;
  width: auto;
  height: auto;
  color: #f00;
}
#skip a:hover, #skip a:focus {
  color: #f00;
}
/* ------------/ UBC CLF ------------------ */

/* Positional Layout Elements */
body {
}

#shrinkWrap_bg {
}
#shrinkWrap {
}
#siteBanner {
	//border-bottom:1px solid #ccc;
	//border-top:5px solid #DBB242;
	//height:50px;
	//margin-top:-10px;
	background-image: url(../../local/gradient1.png);
	background-repeat: repeat-x;
}
#siteLogo {
	float:left;
}
h1#siteName {
  float:left;
  margin:0 0 5px 30px;
  padding:5px 0 0 10px;
}
#wrapper {
	clear:both;
}
/* navigation wrapper */
#nav {
	border-bottom:1px solid #ccc;
	border-right:1px solid #ccc;
	float:left;
	margin-bottom:5px;
	background-color:#cdd9ff;
}

#searchBox {
	background-color:#dbb242;
	border-bottom:1px solid #ccc;
	padding:0 2px 5px 12px;
}
#deptLogo {
	margin:20px auto;
	text-align:center;
	overflow:hidden;
}
#contentWrapper {
	margin-left:165px;
	padding-bottom:20px;
	float:none;
}


#content {}
.location {
	margin:5px;
}
#content_primary {
	float:left;
	padding:10px;
	width:73%;
}
#content_secondary {
	/*border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;*/
	float: right;
	padding-bottom:10px;
	width:22%;
	margin-right: 0px;
}
#content_secondary ul {
	padding-top:5px;
	padding-bottom:5px;
}
#content_secondary ul li {
	margin-left:25px;
	list-style-type:square;
}
#content_single {
	padding:10px;
}
#footer {
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	clear:both;
	padding:10px;
}
#footerText {
	float:left;
	width: 50%;
}
#ubcFooterCrest {
	float:left;
	padding:3px 10px 0 0;
}
#copyright {
}
#siteAdmin {
	float:right;
	width:100px;
}
.ubcCMSBadge {
	border:0px solid #000;
	float: right;
	height: 17px;
	margin: 2px;
	overflow: hidden;
	padding: 0;
	width: 82px;
}
.ubcCMSBadge a:link, .ubcCMSBadge a:visited, ubcCMSBadge a:hover, ubcCMSBadge a:active {
	background-image:url("http://www.cms.ubc.ca/_common/templates/one/core/images/icons/badge_ubc_cms01.gif");
	background-position: left;
	background-repeat: no-repeat;
	display: block;
	height: 17px;
	padding-left: 82px;
}
.adminLogin {
	clear:right;
	float:right;
	margin-top:2px;
	margin-right:5px;
}
.anchor {clear:both;}

/* Fonts */
h1 {
	font-family:"Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
}
h2, h3, h4, h5, h6 {
	font-family:Arial, Helvetica, sans-serif;
}

h1 {
	color:#DBB242;
	font-size:1.75em;
	font-weight:bold;
}
h1 table { /* restyle CMS PageEdit text */
	color:#000;
	font-size:.6em;
	font-weight:normal;
}
#content h1 {
	position:relative;
	margin-left:15px;
	margin-top:0px;
}
h2 {
	color:#004684;
	font-size:1.4em;
	font-weight:bold;
	margin:15px 2px 0 0;
}
h3 {
	color:#004684;
	font-size:1.3em;
	font-weight:bold;
	margin:15px 2px 0 0;
}
h4 {
	color:#444;
	font-size:1.2em;
	font-weight:bold;
	margin:15px 2px 0 0;
	margin-top:0px;
}
h5 {
	color:#444;
	font-size:1.1em;
	font-weight:bold;
	margin:15px 2px 0 0;
	margin-top: 0px;
}

#content_secondary ul{
background-color: #bbccff;
margin: 0px 2px 0 0;
}

#content_secondary h3 {
	background-color:#004684;
	margin-top:0;
	padding:5px 2px 5px 10px;
	color:#fff;
	font-size:1em;
	font-weight:bold;
}
#content_secondary p {
	padding:5px 2px 5px 10px;
}

blockquote {}
strong {font-weight:bold;}

p {
	font-family: Verdana, Arial;
	margin:5px 0 0 0;
}

a:link, a:visited {
	color:#004684;
	text-decoration:none;
}
a:hover, a:active {
	color:#004684;
	text-decoration:underline;
}

#content ul {
	margin:5px 0 0 15px;
}
#content li {
	list-style-type:square;
	margin-left:20px;
}
#content ol {
	margin:5px 0 0 15px;
}
#content ol li {
	list-style-type:decimal;
	margin-left:20px;
}

#content table {
	margin-top: 10px;
}

/* custom font tags */
h1#siteName a:link, h1#siteName a:visited {
  color:#004684;
  font-family:georgia,helvetica,arial,serif;
  font-size:30px;
  font-weight:bold;
  text-decoration:none;
}
h1#siteName a:hover, h1#siteName a:active {
  color:#004684;
  font-family:georgia,helvetica,arial,serif;
  font-size:30px;
  font-weight:bold;
  text-decoration:underline;
}
#copyright {
	font-size:.8em;
	padding-top:3px;
}


#searchBox h2 { /* searchbox */
	color:#004684;
	font-size:120%;
	font-weight:bold;
	margin-top:5px;
}
#searchBox input {
}
#searchBox input#searchterm {
	font-size:.8em;
}
#searchBox input#searchbutton {
	font-size:1em;
}
#searchBox a:link, #searchBox a:visited, #searchBox a:hover, #searchBox a:active {
	color:#000;
	font-size:.8em;
}

.imgfloat_left {
	float:left;
	padding:3px;
}
.imgfloat_right {
	float:right;
	padding:3px;
}

/* navigation styling for ULAccordion Menu */
ul.ipf-sectionmenu{
	background-color:#DBB242;
	margin:0;
	padding:0 0 5px 0;
}

ul.ipf-sectionmenu a:link, ul.ipf-sectionmenu a:visited { /* style for nav link elements in general */
	color:#000;
	text-decoration:none;
}
ul.ipf-sectionmenu a:hover, ul.ipf-sectionmenu a:active {  /* style for nav link elements in general */
	color:#000;
	text-decoration:underline;
}

.ipf-sectionmenu ul{margin: 0;padding: 0;}

ul.ipf-sectionmenu li{ /*Style for LI elements in general (excludes an LI that contains sub lists)*/
	list-style-type: none;
	padding-left: 22px;
	margin-bottom: 3px;
}
ul.ipf-sectionmenu li div {
	margin-left:-10px;
	padding-left:0;
}

ul.ipf-sectionmenu li.submenu{ /* Style for LI that contains sub lists (other ULs). */
cursor: hand !important;
cursor: pointer !important;
}

ul.ipf-sectionmenu li.submenu ul{ /*Style for ULs that are children of LIs (submenu) */
	display: none; /*Hide them by default. Don't delete. */
}

ul.ipf-sectionmenu .submenu ul li{ /*Style for LIs of ULs that are children of LIs (submenu) */
	border-bottom:0;
	cursor: default;
	list-style-type:square;
	margin-left:10px;
	padding-left:5px;
}

ul.ipf-sectionmenu-folderopen {}
ul.ipf-sectionmenu-folderclose {}

ul.ipf-sectionmen li.ipf-parent {
	border-bottom:1px solid #ccc;
}

ul.ipf-sectionmenu .submenu ul li { /* Style for 2nd level nav items */
	margin-left:10px;
}
ul.ipf-sectionmenu .submenu ul li ul li { /* Style for 3rd level nav items */
	border-bottom:0;
	list-style-type:disc;
}
ul.ipf-sectionmenu .submenu ul li ul li ul li { /* Style for 4th level nav items */
	border-bottom:0;
	font-size:90%;
	list-style-type:square;
}

/* custom styling for navigation category items */
li#pageid3368, li#pageid3375 {
	background-color:#dbb242;
	border-bottom:1px solid #ccc;
	padding-top:10px;
	padding-bottom:2px;
}
/* info for */
li#pageid3368 a:link, li#pageid3368 a:visited, li#pageid3368 a:hover, li#pageid3368 a:active, 
/* info about */
li#pageid3375 a:link, li#pageid3375 a:visited, li#pageid3375 a:hover, li#pageid3375 a:active {
	color:#004684;
	font-size:110%;
	font-weight:bold;
	text-decoration:none;
	text-transform:capitalize;
}

/****************************************
LOGIN - DEFAULT LAYOUT
*/

	.ipf-PageLogin, .ipf-PageLogin-TextField  
		{font-size: 11px;}
	.ipf-PageLogin-Button 
		{background: #F1F1F1; border: solid 2px #444444; cursor: pointer; font-weight: bold; font-size: 10px; margin-right: 1px; padding: 1px 3px; text-transform: uppercase;}
	div#ipf-login-contain /* styles the div containing the login box */
		{background: #E3E3E3; padding: 8px; width: 375px;}
	table#ipf-login /* styles the table that contains the login */ 
		{color: #000000; font-size: 11px; width: 100%;}
	table#ipf-login td /* cell style for login table */
		{color: #000000; font-size: 11px;}
	table.ipf-login-head /* header of login */
		{background: #555555; border-bottom: solid 3px #E3E3E3; color: #FFFFFF; font-size: 11px; font-weight: bold;	padding: 0;	text-transform: uppercase;	width: 100%;}
	.ipf-login-head td /* cell in login header */
		{color: #FFFFFF; font-weight: bold; font-size: 11px; padding: 4px 5px;}
	.ipf-login-rowa td /* first row of login table (user name) */
		{background: #FFFFFF; border-bottom: solid 1px #E3E3E3;}
	.ipf-login-rowb td /* second row of login table (pasword) */
		{background: #FFFFFF; border-bottom: solid 3px #E3E3E3;}
	#ipf-login-rowc td /* third row of login table (login button and remember password) */
		{background: #878787; border: solid 4px #878787; border-width: 4px 0; padding: 3px 6px;}
	#ipf-login-rowd td /* fourth row of login table (join form and forgot password) */
		{background: #E3E3E3; border-top: solid 4px #E3E3E3; font-size: 11px;}
	.ipf-login-txtfield /* styling for textbox fields */{
		color: #000000; font-size: 11px; padding: 2px; width: 225px;}
	.ipf-login-mainbutton /* styling for the main login button */
		{background: #DDDDDD; border: solid 2px #666666; font-weight: bold; font-size: 10px; margin-right: 2px; padding: 1px 2px;}
	.ipf-login-forgetpassbutton /* styling for the forget password button */
		{background: #F1F1F1; border: solid 2px #444444; cursor: pointer; font-weight: bold; font-size: 10px; margin-right: 1px; padding: 1px 3px; text-transform: uppercase;}
	.ipf-login-left /* styling for the left column in the main table */
		{color: #767676; font-size: 11px; text-align: right; width: 75px;}
	#ipf-login-remember-span /* styling for remember username */
		{color: #EEEEEE; font-size: 11px; margin-left: 14px;}
	.ipf-login-failed-span /* style for login failed message */
		 {color: #FF0000; font-weight: bold; font-size: 16px; padding: 2px;}
	table#ipf-login-forgotpassword-head /* header table styling */
		{background: #555555; border-bottom: solid 1px #FFFFFF;	color: #FFFFFF;	font-weight: bold; font-size: 11px;	text-transform: uppercase;	width: 100%;}
	table#ipf-login-forgotpassword-head td /* header table cell styling */
		{color: #FFFFFF; font-weight: bold; font-size: 11px; padding: 4px 5px;}
	table#ipf-login-forgotpassword-main /* table styling for forgot password */
		{color: #000000; font-size: 11px;}
	table#ipf-login-forgotpassword-main td /* cell styling for forgot password */
		{color: #000000; font-size: 11px;}
	a.ipf-login-link:link, a.ipf-login-link:visited, a.ipf-login-link:active  /* styling for links used in login */
		{ color: #CC0000; font-size: 11px; text-decoration: underline;}

/****************************************
SITEMAP
*/

	#ipf-sitemap-contain, #ipf-sitemap-table 
		{width: 100%;}	
	 /*.ipf-sitemap-tr-level1, .ipf-sitemap-tr-level2, .ipf-sitemap-tr-level3, .ipf-sitemap-tr-level4, .ipf-sitema-tr-level5 
	 	{}*/
	.ipf-sitemap-td-level1 
		{width: 500px; font-size: 11px;	font-weight: bold}
	.ipf-sitemap-td-level1 a
		{border-bottom: solid 1px #586989; display: block; padding: 4px 2px 5px 4px; background-color: #EAEBED;	margin: 5px 0 0 0;}
	.ipf-sitemap-td-level2 
		{padding-left: 20px; font-size: 11px;}
	.ipf-sitemap-td-level3 
		{padding-left: 40px; font-size: 11px;}
	.ipf-sitemap-td-level4 
		{padding-left: 60px; font-size: 11px;}
	.ipf-sitemap-td-level5 
		{padding-left: 80px; font-size: 11px;}
	.ipf-sitemap-td-level1 a:link, .ipf-sitemap-td-level1 a:visited, .ipf-sitemap-td-level2 a:link, .ipf-sitemap-td-level2 a:visited,
	.ipf-sitemap-td-level3 a:link, .ipf-sitemap-td-level3 a:visited, .ipf-sitemap-td-level4 a:link, .ipf-sitemap-td-level4 a:visited,
	.ipf-sitemap-td-level5 a:link, .ipf-sitemap-td-level5 a:visited, .ipf-sitemap-td-level6 a:link, .ipf-sitemap-td-level6 a:visited 
		{color: #656972; text-decoration: none;}	
	.ipf-sitemap-td-level1 a:hover,	.ipf-sitemap-td-level2 a:hover,	.ipf-sitemap-td-level3 a:hover,	.ipf-sitemap-td-level4 a:hover,	.ipf-sitemap-td-level5 a:hover,	.ipf-sitemap-td-level6 a:hover
		{color: #C5291B;}


/* Debug by unhiding and seeing background-color */
/*
#shrinkWrap_bg {background-color:#222;}
#shrinkwrap {background-color:#333;}
#siteBanner {background-color:#444;}
#wrapper {background-color:#555;}
#nav {background-color:#666;}
#contentWrapper {background-color:#777;}
#content {background-color:#888;}
.location {background-color:#999;}
#content_primary {background-color:#e5e5e5;}
#content_secondary {background-color:#aaa;}
#searchBox {background-color:#bbb;}
#footer {background-color:#ccc;}
#footerText {background-color:#ddd;}
#unaFooterCrest {background-color:#eee;}
#copyright {background-color:#efefef;}
#siteAdmin {background-color:#efefef;}
.ubcCMSBadge {background-color:#efefef;}
.adminLogin {background-color:#efefef;}
*/




/*Coloring Scheme Edits  */

li#pageid3368,
li#pageid3368 a:link,
li#pageid3368 a:visited,
li#pageid3368 a:hover,
li#pageid3368 a:active{
background-color:#004684;
color:#FFFFFF;
}

li#pageid3375,
li#pageid3375 a:link,
li#pageid3375 a:visited,
li#pageid3375 a:hover,
li#pageid3375 a:active{
background-color:#004684;
color:#FFFFFF;
}

h1 {
color: #004684;
}

h3 {
border-top:1px solid #CCCCCC;
}

#content_secondary {
background-color:#FFFFFF;
}



#deptLogo {
background-color:#FFFFFF;
margin: 0px;
padding:0px;
padding-top:10px;
padding-bottom:10px;
}


ul.ipf-sectionmenu {
background-color:#bbccff;
}


#siteLogo {
float: right;
}

h1#siteName {
float:left;
margin:7pt 0pt 5px 0px;
padding:0px 0pt 0pt 10px;
}


#searchBox {
background-color:#dbb242;
}


#nav {
background-color:#dbb242;
}


.spacer {
height:30px;
}

