/****************************************************
File		: main.css
Edited by	: Adrian Liem
Date:		: 20-June-2006
Description	: main stylesheet for UBC Alumni Affairs
-----------------------------------------------------
Colours:

Dark Blue		#004685
Light Blue		#7fa2c2
Baby Blue		#dce9f3
Blue-Grey		#e5ecf3
Dark Grey		#16222e
Gold			#ec982f
****************************************************/


/******************************
html, body
******************************/
html, body {
	background-color: #fff;
	background-image:url("/assets/clf/images/bgd.gif");
	margin:5px 0 0 0;
}

/*********************
Standard HTML elements
**********************/
p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
}


/*h2 a:link, h2 a:visited {
	background-color: transparent;
  	text-decoration: none;
}
h2 a:hover, h2 a:active {
	background-color: transparent;
	text-decoration: underline;
}*/

a:link, a:visited {
	text-decoration: none;
	color: #fff;
}
a:hover, a:active {
	text-decoration: underline;
	color: #fff;
}



/*******************
Special font classes
********************/

/* .mono  monospaced for code examples etc. */
.mono {
	font-family: "courier new", courier, mono;
	font-size: 70%;
	color: #f90;
}

/* .fine  fine print for forms, image captions, etc. */
.fine {
    font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 60%;
	color: #999;
}

/* h1.headerLeft  styles background image for h1 in mainContent */
h1.headerLeft {
	overflow:hidden;
	height:20px;
	width: 461px;
	margin:11px 0 0 0;
	padding: 5px 10px 5px 9px;
	border-bottom: 1px solid #fff;
	background-color: #16222e;
	background-image: url(/assets/clf/images/headerLeft.gif);
	background-position: top;
	background-position: right bottom; 
	background-position: -2px 0;
	background-repeat: no-repeat;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	line-height:135%;
	font-weight: bold;
	text-transform: uppercase;
	text-align: left;
}
/* style for headers with images & text
.headerLeft span {
  display:block;
  position:absolute; left:1px; top:1px; z-index:1;
  height:20px;
  width:200px;
  margin:3px 0 0 9px;
  padding:15px 10px 5px 9px;
  background-image: url(/v3/_ADMIN/assets/images/template4/highlights.gif);
  background-repeat:no-repeat;
}
*/

/* h2.headerReft  styles background image for h2 in sideBar */
h1.headerRight {
	/* background-color: #16222E; */
	margin: 0px;
	padding: 5px 10px 5px 9px;
	border-bottom: 1px solid #fff;
	background-image: url(/assets/clf/images/headerRight2.gif);
	background-position: 0px -1px;
	background-repeat: no-repeat;
	background-color:#333;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 90%;
	font-weight: bold;
	text-transform: uppercase;
	text-align: left;
}
/* replaces standard hr with graphic */
div.hr {
	height: 10px;
	padding: 0;
	background: url(/assets/clf/images/hr_dotted.gif) no-repeat scroll center;
}

div.hr hr {
	display: none;
}



/* curve bottom blue */
.curveBottBlue {
	width: 447px;
/*	background-color: #88A3B7;*/
	background-color: #dce9f3;
	background-image: url(/assets/clf/images/curveBottBlue.gif);
	background-position: bottom;
	background-repeat: no-repeat;
	padding: 10px 15px 10px 18px;
	margin-bottom:0;
	overflow:visible; /* fix IE5.5,IE6 italics bug */
}

/* style for indenting p */
.curveBottBlue p.indent {
  margin:0;
  padding:15px 0 0 110px;
}



.curveBottBlue p {
	margin:5px 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
	line-height: 140%;
	color: #393939;
}

.curveBottBlue a:link, .curveBottBlue a:visited {
	text-decoration: none;
	color: #0d5690;
}
.curveBottBlue a:hover, .curveBottBlue a:active {
	text-decoration: underline;
	color: #0d5690;
}

.curveBottBlue h2 {
	margin: 0;
	padding: 0;
	color: #ec982f;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 90%;
	line-height: 120%;
	font-weight: bold;
}

.curveBottBlue h2 a:link, .curveBottBlue h2 a:visited {
	text-decoration: none;
	color: #e0912a;
}
.curveBottBlue h2 a:hover, .curveBottBlue h2 a:active {
	text-decoration: underline;
	color: #e0912a;
}

.curveBottBlue h4 {
	margin: 0;
	padding: 10px 0 5px 0;
	color: #999;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 55%;
	line-height: 90%;
	font-weight: normal;
	text-transform: uppercase;
}
.curveBottBlue h4 a:link, .curveBottBlue h4 a:visited {
	text-decoration: none;
	color: #999;
}

.curveBottBlue h4 a:hover, .curveBottBlue h4 a:active {
	text-decoration: none;
	border-bottom:1px dotted #999;
	color: #999;
}

.curveBottBlue h4 b {
	margin-left: 0.6em;
	color: #b7c5d2;
	font-weight: normal;
	text-transform: uppercase;
}

/******************************************
Bullet image for curveBottBlue ul and li
******************************************/
.curveBottBlue ul { 
  margin-left: 0;
  padding-left: 15px;
  list-style: none;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 70%;
  color: #393939;
}
.curveBottBlue ul li {
  padding-left: 0;
 list-style: disc url(/assets/clf/images/bullet.gif) outside;
}

/* subpages! */
.curveBottBlueSub {
	width: 447px;
	background-color: #dce9f3;
	background-image: url(/assets/clf/images/curveBottBlue.gif);
	background-position: bottom;
	background-repeat: no-repeat;
	padding: 15px 15px 10px 18px;
	margin-bottom:0;
	overflow:visible; /* fix IE5.5,IE6 italics bug */
}

.curveBottBlueSub a:link, .curveBottBlueSub a:visited {
	text-decoration: none;
	color: #0d5690;
}
.curveBottBlueSub a:hover, .curveBottBlueSub a:active {
	text-decoration: underline;
	color: #0d5690;
}

.curveBottBlueSub h2 a:link, .curveBottBlueSub h2 a:visited {
	text-decoration: none;
	color: #e0912a;
}
.curveBottBlueSub h2 a:hover, .curveBottBlueSub h2 a:active {
	text-decoration: underline;
	color: #e0912a;
}

/*.curveBottBlueSub table {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
}*/

.curveBottBlueSub p {
	margin:8px 0 15px 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
	line-height: 140%;
	color: #393939;
}


/* new bullet for curve bottom area */
.curveBottBlueSub ul {
	list-style:none;
	margin:8px 0 15px 0;
	padding-left: 1.35em;
	/*text-indent: -1.35em;*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
	line-height: 140%;
	color: #393939;
}
.curveBottBlueSub ul li {
  padding-left: 0;
  list-style: disc url(/assets/clf/images/bullet.gif) outside;
}

.curveBottBlueSub ul ul {
	font-size:100%;
	
}
.curveBottBlueSub ol {
	margin-left:0;
	padding-left:2em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
	line-height: 140%;
}

.curveBottBlueSub li {
	margin:0;
	padding: 0;
	color: #393939;
}
.curveBottBlueSub li li{
	margin:0;
	padding: 0;
	color: #393939;
}

.curveBottBlueSub h2 {
	color: #e0912a;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 90%;
	font-weight: bold;
	margin:8px 0 0 0;
	padding:0;
}

.curveBottBlueSub h3 {
	color: #999;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 55%;
	font-weight: normal;
	text-transform: uppercase;
	margin:0;
	padding:4px 0 0 0;
}

.curveBottBlueSub h4 {
	color: #0d5690;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 55%;
	line-height: 90%;
	font-weight: normal;
	text-transform: uppercase;
}

.curveBottBlueSub h5, .curveBottBlue h5  {
	color: #000;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 100%;
	line-height: 100%;
	font-weight: normal;
	margin:10px 0 20px 0;
	padding:0;
}



.curveBottBlueSub h4 b {
	margin-left: 0.6em;
	color: #c3d2e3;
	font-weight: normal;
	text-transform: uppercase;
}

/*TABLES!*/
.chart table {
  border-left: 1px solid #dce9f3;
  border-bottom: 1px solid #dce9f3;
}
.chart td {
  padding: 2px 8px 2px 8px;
  margin: 0;
  text-align: left;
  vertical-align:top;
  border-top: 1px solid #dce9f3;
  border-right: 1px solid #dce9f3;
}

.chart p {
	margin:2px 2px 2px 0;
	padding: 0;
	line-height: 140%;
	color: #393939;

}

/* style for table bullets */

.chart ul {
  margin:2px 2px 2px 15px;
  	padding-left: 0;
	text-indent: 0;
  line-height: 140%;
  padding:0;
  color: #393939;
  list-style:outside;
}

/* style for the table header row inside "vision" */
.chart th {
/*  background-color: #fc0;*/
  background-color: white;
  padding: 0;
  margin: 0;
  font-weight: bold;
}

.middle {
	text-align:center;
}

/* style for odd rows */
.odd {
  background-color: #f6f9fc;
}

.vert {
	vertical-align: middle; }

/* style for even rows */
.even {
  background-color: #e7f0f7;
}

/******************************
Positioning rules
******************************/

/* #header  center aligns the position of the top banner/header content including navigation */
#header {
	text-align: center;
}

/* #bannerTop  banner/header containing graphic */
#bannerTop {
	/* border: 0px solid #000000; /* uncomment for testing */
	background-image: url(/assets/clf/images/mainbanner.gif); /* width:720px */
	background-repeat: no-repeat;
	background-position: center;
	background-color: #fff;
	height: 148px;
	width: 740px;
	margin-right: auto;
	margin-bottom: -11px;
	margin-left: auto;
	display: block;
}

/* #curls  curled banner background */
#curls {
	/* border: 1px solid #000000; /* uncomment for testing */
	background-image: url(/assets/clf/images/shadow.gif);
	background-repeat: no-repeat;
	background-position: center;
	height: 60px; /* set to height of curl image */
	/* width: 819px; /* set to width of curl image */
	margin-right: auto;
	margin-bottom: -14px; 	/* pull up the div below it by 'x'px */
	margin-left: auto;
	text-align: left;
}

/*************************
Secondary / Sub Navigation
**************************/
#navSub {
	width: 230px;
	padding: 0;
  	background-color:#efefef;
	border-top:	0px solid #fff;
	text-align: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 70%;
}
#navSub table {
	width: 100%;
}
#navSub table td {
	padding: 6px;
	background-color: #999;
	border-bottom: 1px solid #fff;
}
#navSub table td.active {
	font-weight: bold;
}
#navSub a:link, #navSub a:visited, #navSub a:active {
	color: #fff;
	text-decoration: none;
}

#navSub a:hover {
	color: #fff;
	text-decoration: underline;
}

/**********************************************
Positioning / styling for main content sections
***********************************************/

/* #wrapper  sets width and positioning for content containers */
#wrapper {
  /* border: 1px solid #000000; /* uncomment for testing */
  /* background-color:#f90; /* uncomment for testing */
  position:relative;
  left:1px;
  width:740px;
  margin:0 auto;
  padding:0;
  background-image: url(/assets/clf/images/wrapper_bg.gif);
  background-repeat: repeat-y;
}

/* #spotlightImg  positions and adds border to main featured image */
#spotlightImg {
	/* background-color:#f90; /* uncomment for testing */
	width: 480px;
	height:192px;
	padding:0;
	margin:0;
	border-bottom: 1px solid #fff;
	text-align: left;
}

/* #mainContent  container for holding main content in a 2-column layout */
#mainContent {
    /*border: 1px solid #4b0;  /* uncomment for testing */
	/* background-color: #fff; */
	float: left;
	width: 480px;
	margin-bottom: 0px;
	margin-top: -12px;
	padding: 0 0 0 10px;
	text-align: left;
}

/* mainContentFull  container for holding main content in a 1-column/full-width layout */
#mainContentFull {
	/* border:1px solid #4b0;  /* uncomment for testing */
	float: left;
	width: 720px;
	margin-bottom: 0px;
	margin-top: -7px;
	padding: 4px 10px 10px 10px;
	background-color: #fff;
	text-align: left;
}

/* #sideBar  container for holding secondary navigation & section-specific featurettes */
#sideBar {
	/* border: 1px solid #960;  /* uncomment for testing */
	/* background-color: #fff;  /* change to a color for testing, e.g. #f90  */
	float: right;
	width: 230px;
	margin-top:0px;
	padding: 0px 10px 10px 10px;
	text-align:left;
}

#sideBg {
	padding: 0;
	background-color:#fff;
	text-align: center;
}

#sideContent {
	width: 205px;
	margin: 0;
	padding: 10px 10px 10px 15px;
	border-bottom: 1px solid #fff;
	background-color: #efefef;
}

#sideContent a:link, #sideContent a:visited {
	background-color: transparent;
	text-decoration: none;
	color: #7fa2c2;
}

#sideContent a:hover, #sideContent a:active {
	border-bottom: 1px dotted #7fa2c2;
	background-color: transparent;
	text-decoration: none;
	color: #7fa2c2;
}

#sideContent a img {
	border: none;
	text-decoration:none;

}
#sideContent h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 65%;
	color: #ec982f;
	text-transform:uppercase;
	margin:0;
	padding:5px 0 12px 0;
}

#sideContent h1 strong {
	font-weight: normal;

}

#sideContent h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 70%;
	color: #7fa2c2;
	margin:0;
	padding:0 0 8px 0;
}

#sideContent p {
	font-size: 65%;
	color: #777;
	line-height: 140%;
	margin:0;
	padding:0 0 12px 0;
}

#sideContent ul {
  list-style:none;
  margin:5px 0 15px 0;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 70%;
  line-height: 140%;
  padding:0;
}
#sideContent li {
  margin:0;
  padding: 0;
  color: #393939;
  font-weight:bold;
}

#sideEmpty {
	width: 205px;
	margin: 0;
	padding: 5px 10px 5px 15px;
	background-color: #fff;
}
/**********
Trek<em>Connect</em>
***********/
/* #trekConnect  positions container for holding Trek<em>Connect</em> login form */
#trekConnect {
	width: 206px;
	padding: 15px 10px 10px 10px;
	border: 2px solid #ded6c4;
	background-color: #efe7cd;
}

#trekConnect h1 {
	padding: 0;
	margin: 0;
	position: relative;
	overflow: hidden;
	margin-bottom: 5px;
	height: 12px;
	width: 200px;
	color: #666;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
}

#trekConnect h1 span { /* replaces text with an image */
	display: block;
	position: absolute; left: 1px; top: 1px; z-index: 1;
	height: 12px;
	width: 200px;
	margin-bottom: 5px;
	text-align: center;
	background: url(/assets/clf/images/login.gif) no-repeat;
}
	  
#trekConnect p {
	padding-top: 2px;
	margin: 0;
	font-size: 50%;
	color: #7b7b7b;
	font-weight: bold;
}

#trekConnect a:link, #trekConnect a:visited {
	color: #7b7b7b;
	text-decoration: none;
	text-transform: uppercase;
}

#trekConnect a:hover, #trekConnect a:active{
	border-bottom: 1px dotted #7b7b7b;
	text-transform: uppercase;
}

#trekConnect table {
	margin:0;
	padding:5px 0 0 0;
	text-align: center;
}

#trekConnect td {
	margin:0;
	padding:2px;
}

#trekConnect form {
	margin:0;
	padding:0;
}

#trekConnect label {
	float: left;
	display: block;
	margin: 0;
	padding: 0;
	width: 60px;
	text-align: right;
	font-size: 55%;
	font-weight: bold;
	font-family: Helvetica, Arial, Geneva, sans-serif;
	color: #7b7b7b;
	line-height: 120%;
  	overflow: hidden;
}

#trekConnect input {
	width: 122px;
 	border: 1px solid #7b7b7b;
	padding: 2px;
	background: #fff;
	font-size: 75%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #781351;
}

#trekConnect input.btn{
	width: 60px;
	margin: 2px 0 1px 0;
	border: 1px outset #7b7b7b;
	background: #7b7b7b;
	font-size: 65%;
	color: #fff;
}

/* #funStuff  container for holding special featured content */
#funStuff {
	padding: 10px 0;
	background-color:#fff;
	text-align: center;
}

/* #events  listing of events from calendar */
#events {
	width: 205px;
	margin: 0;
	padding: 0px 10px 20px 15px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	background-color: #efefef;
}
#events h2 a:link, #events h2 a:visited {
	background-color: transparent;
	text-decoration: none;
	color: #7fa2c2;
}

#events h2 a:hover, #events h2 a:active {
	border-bottom: 1px dotted #7fa2c2;
	background-color: transparent;
	text-decoration: none;
}


#events h2 {
	margin: 20px 0 0 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 70%;
	color: #7fa2c2;
}

#events h1, h3 {
	margin: 20px 0 0 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 65%;
	line-height: 70%;
	color: #ec982f;
	text-transform:uppercase;
}

#events h3 a:link, #events h3 a:visited {
	background-color: transparent;
	text-decoration: none;
	color: #ec982f;
}


#events h3 a:hover, #events h3 a:active {
	background-color: transparent;
	text-decoration: none;
	color: #e0912a;
}

#events h4 {
	margin: 0;
	padding: 5px 0 0px 0;
	font-size: 55%;
	color: #aaaaaa;
	line-height: 130%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
}

#events p {
	margin: 0;
	padding: 2px 0 0px 0;
	font-size: 65%;
	color: #777;
	line-height: 130%;
}

/*****
Anchor
******/
#anchor {
	clear: both;
	width: 100%;
	height: 10px;
	background-color: #fff;
	margin: 0;
	padding: 0;
}

/*****
Footer
******/
/* #footer  container for bottom page elements */
#footer {
	clear: both; /* need this to clear the floats from content containers */
	position: relative;
	top: 13px;
	height: 20px;
	width: 704px;
	margin:0 auto;
	padding: 2px 8px 8px 8px;
	background-color: #000;
	border: 10px solid #fff;
	border-bottom: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #fff;
	text-transform: uppercase;
	font-size: 75%;
}
#footer ul {
  margin:0;
  padding:3px 0 7px 0;
}
#footer ul li {
  display:inline;
  margin:0;
  padding:0 0 0 9px;
  margin-left:9px;
  border-left:1px solid #fc0;
  font-size:70%;
}

#footer ul.firstFooter {
  float:left;
}
#footer ul.firstFooter li {
  border-left:none;
  padding:0;
  margin-left:0;
}
#footer ul.secondFooter {
  float:right;
}

#footer ul li.firstItem {
  margin:0;
  padding:0 0 2px 0;
  border-left:none;
}

#footer a:link, #footer a:visited {
	text-decoration: none;
}
#footer a:hover {
	text-decoration: underline;
}
#footer a:active {
	text-decoration: none;
}

/************************
Page Tools (print, email)
************************/
#pageTools {
  /* background-color:#f90; /* uncomment for testing */
  float:right;
  display:block;
  text-align:right;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:70%;
  margin:-3px -5px 0 0;
  padding:0;
}

#pageTools a:link, #pageTools a:visited {
  color:#777;
}
#pageTools a:hover, #pageTools a:active {
  color:#777;
}

a.printLink {
  background:url(/assets/clf/images/print.gif) right center no-repeat;
  margin:0 .5em 0 0;
  padding:0 18px 0 0;
}

a.emailLink {
  background:url(/assets/clf/images/email.gif) right center no-repeat;
  margin:0 0 0 0;
  padding:0 18px 0 0;
}

/************************
UBC Dialogues
************************/

.dialogues th {
	text-align: center;
}

.dialogues th.location {
	width: 6em;
}
.dialogues th.topic {
	width:auto;
}
.dialogues th.date {
	width: 6em;
}

.dialogues table {
	width: 100%;
}