/* @override http://www1.ucsc.edu/includes/template/v4/css/main.css */

/* 
@override http://localhost:8888/ucsc_templates/css/main.css
@override http://www1.ucsc.edu/includes/template/v4/css/main.css
 */

html { background:transparent; }
.primary	{ background:#fff url(http://www1.ucsc.edu/includes/css/images/bg_wrapper.gif) repeat-y left top; }
.secondary 	{ background:#fff url(http://www1.ucsc.edu/includes/css/images/bg_wrapper_2col.gif) repeat-y left top; }

body { font-family:Verdana, Helvetica, Arial, sans-serif; line-height:1.4em; font-size:0.75em; }

#custom-doc { margin:0; text-align:left; width:100%; min-width:800px; }
#right { position:absolute; left:510px; }
.picutre {
	padding-right: 10px;
}

#sb { width:185px; margin:16px auto 0 auto; }
#sb .inner { width:166px; margin:0 auto; }
#bd #yui-main .yui-b { width:auto; margin-top:0; }
#bd { clear:both; margin-top:0px; }

.primary #yui-main .yui-b { margin-left:185px; }
.primary #yui-main #center .inner { width:270px; margin:1.4em 22px 0 18px; }
.primary #yui-main #center .caption p  { width:290px; margin:0 2px 0 18px; }
.primary #yui-main #right { width:260px;  }

.secondary #yui-main .yui-b { margin:0 0 0 200px; }
.secondary #yui-main .yui-b #center {
	width:800px;
	margin-top:1em;
}

#hd #site { position:absolute; left:185px; top:0; margin:0; padding:0; width:630px; height:52px; margin:0; }
#hd {
	background-color: #3C73B5;
	height: 52px;
}
#hd #site span { position:absolute; width:100%; height:100%; display:block; left:0; top:0; }

#hd #org { position:absolute; left:0; top:0; margin:0; padding:0; width:185px; height:52px; }
#hd #org span { display:block; position:absolute; left:0; top:0; width:100%; height:100%; background:#ffdf82 url(http://www1.ucsc.edu/images/ucsantacruz.gif) no-repeat left top; }


/**
*	General Typography
*	
*/
h1,h2,h3,h4,h5,h6,
#navigation ul li a { font-family:Helvetica, Arial, Verdana, sans-serif; min-height:1em; }

h1 { font-size:168%; }
h2 { font-size:145%; margin:0.4em 0 0.6em 0; font-weight:bold; color:#990000; line-height:1.4em; }
h3 { font-size:126%; margin:1.2em 0 0.8em 0; font-weight:800; }
h4 { font-size:108%; margin:0 0 0.6em 0; font-weight:bold; }

p { margin:0.2em 0 0.8em 0; }
em { font-style:italic; }
strong { font-weight:bold; }
hr { border:1px solid #c3d4e9; margin:1em auto; }

a { color:#003399; }
a:visited { color:#669999; text-decoration:underline; }
a:focus, a:hover { color:#990000; }
a:active { color:#FFCC33; }

ul,ol { margin:0.4em 0 1em 2em; }
ul { margin-left:1.7em; }
ul li { list-style-type:disc; list-style-image:url(http://www1.ucsc.edu/images/bluedot2.gif); }

ol li { list-style-type:decimal; }
ol li ol { margin-left:1.6em; }
ol li ol li { list-style-type:lower-alpha; }
dt { margin:1.8em 0 0.8em 0; font-weight:bold; }
dd { margin-bottom:1em; }

blockquote { border-left:4px solid #E7F0F6; padding-left:1.2em; margin-left:2em; }
.citation { color:#666; font-style:italic; }

.clear-all { clear:both; }

.primary #center { line-height:1.6em; }
.primary #center img { display:block; margin:0; }


/**
*	Specific typography
*	
*/
.primary #center h2 { color:#000; }
.secondary #center h2 { margin:1em 0 0 0; }
#right { font-size:94.5%; }
#right h4 { margin-bottom:0.2em; }
#right p { margin-bottom:1.4em; }


/**
*	Section-specific styles
*	
*/

/*  Standard pages have light blue on dark text navigation  */
#navigation {
	min-height:24px;
	background-image: url(../images/nav.png);
	height: 25px;
	border-bottom-width: thin;
	border-bottom-color: #666;
	background-repeat: repeat-x;
}
#navigation ul { margin:0; vertical-align:middle; }
#navigation ul li { display:inline; list-style-type:none; }
#navigation ul li a {
	display:inline-block;
	padding:4px 8px;
	color:#333;
	text-decoration:none;
	font-weight:bold;
}
#navigation ul li a:focus,
#navigation ul li a:hover { color:#285991; }

/* Administrative pages have a different link color in the header nav bar */
.administrative #navigation { background:#285991; }
.administrative #navigation ul li a { color:#DDE6EB; font-weight:normal; }
.administrative #navigation ul li a:focus,
.administrative #navigation ul li a:hover { color:#c3d4e9; }

/* #sb (left sidebar) */
#sb { font-size:94.5%; }
#sb h4 { padding-top:1em; border-top:1px solid #C3D4E9; }
#sb ul, #sb ol { margin-left:1.5em; margin-bottom:1.2em; }
#sb a { text-decoration:none; }

/* 	
*	Site navigation: 
*	This is a list in the sidebar with a class of "pages" on the ul. 
*	Used when a section of your site has multiple pages (most cases, I presume).
*/
#sb .pages, #sb #pages { margin-left:0; }
#sb .pages li, #sb #pages li { list-style-image:none; list-style-type:none; }
#sb .pages li a, #sb #pages li a { display:block; margin:0.4em 0; padding:0.3em 0.6em; background-color:#fff; }
#navigation ul li ul li a:focus,
#navigation ul li ul li a:hover,
#sb .pages li a:focus, #sb #pages li a:focus,
#sb .pages li a:hover, #sb #pages li a:hover { color:#E7F0F6; background-color:#285991; text-decoration:none; }

/* Sidebar lists have not bullets if you give the <ul> or <ol> a class of "no-dots" */
#sb .no-dots,
#center .no-dots,
#right .no-dots,
#sb .contact-info { margin-left:0; }

#sb .no-dots li,
#center .no-dots li,
#right .no-dots li,
#sb .contact-info li,
#center li.no-dot { list-style-image:none; list-style-type:none; }

/* #utilities (Google search, a-z index, find people) */
#utilities { width:168px; margin:0 auto; }
#cse-field { width:120px; border:1px solid #999; padding:2px; font-size:90%; }
#cse-btn { width:22px; height:18px; font-size:11px; background:#457ab8; color:#ffffff; text-transform:lowercase; border:none; cursor:pointer; padding:0; }
#utilities .links { font-size:85%; }

/* Giving button */
.give-btn span { display:block; font-size:10px; padding-top:22px; }


/* The last paragraph in the left sidebar is the gray "maintained by" information */
.information { color:#999; font-size:90%; border-top:1px solid #C3D4E9; padding-top:2em; }
.information a:link { color:#999; }
.copyright { display:block; margin-bottom:0.4em; }


/* #right (right sidebar) */
#right h3 { color:#285991; text-transform:uppercase; margin-top:16px; letter-spacing:0.2em; }

/* 
*	Captioned images:
*	These are images in the main content area that have captions.
*	The <img> should be wrapped in a <div class="caption"> element.
*	The caption should be inside a <p> inside the <div class="caption">
 */
.caption p { font-size:80%; text-align:right; color:#999999; }

/* Floats: for aligning elements left or right, give them a class or "left"" or "right"" */
.left { float:left; margin:0.4em 1.4em 0.8em 0; }
.right {
	float:left;
	margin:0.4em 1.4em 0.4em 0.8em;
}

/* A <div> or a <p> with this class will have a top border. Good for supplemental info at the bottom of a page */
.additional-info { margin-top:3em; padding-top:1.6em; border-top:2px solid #E7F0F6; }

/* A list that will be divided into 2 columns */
.columns { width:98%; }
.columns:after { content:"."; visibility:hidden; clear:left; }
.columns li { width:50%; float:left; }

/* Accessibility links are hidden until they receive focus by being tabbed to. */
#access-links { position:absolute; top:0; left:0; z-index:100; width:100%; font-size:1.4em; }
#access-links ul { margin:0; }
#access-links ul li { position:absolute; left:-900em; width:100%; list-style-type:none; }
#access-links ul li a:focus { position:relative; left:900em; display:block; background-color:#eef5fb; padding:0.8em; text-decoration:none; opacity:.75; }

/* jQuery polypage plugin style: http://code.new-bamboo.co.uk/polypage/ */
.pp_Notes { background-color:#FF6E2C !important; color:#000000; padding:0.4em 0.6em; }

/* File related links get an icon next to them. We'll add more over time */
a.file-pdf { padding:2px 0 2px 22px; background:transparent url(http://www1.ucsc.edu/images/file-icons/icon_pdf.gif) no-repeat left center; }

/* Giving btn in the left sidebar */
.btn-give { position:relative; display:block; padding-top:2px; border-top:1px solid #C3D4E9; }
.btn-give span { width:70px; display:block; position:absolute; left:80px; top:16px; }

/* Breadcrumbs */
.crumbs { font-size:90%; color:#999999; }
.crumbs a { color:#999999; }
.crumbs a:focus,
.crumbs a:hover { color:#990000; }
.caption.right {
	margin-top: 5px;
	height: 270px;
}
