@import	 url(common.css);
@import	 url(nav.css);

body {
	background: #fff url(images/traditions/bg/body.gif) repeat-x;
}
#wrapper {
	background: #425267 url(images/traditions/bg/wrapper.jpg) no-repeat 50% 0;
	margin: 12px 0 0;
	padding: 0 0 7px;
	height: 681px;
}
.detail #wrapper {
	background-image: url(images/traditions/bg/wrapperDetail.jpg);
	height: auto;
}
#wrapperInner {
	background: none;
	border: 0;
	height: auto;
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 0 0 99px;
	width: 940px;
}
.detail #wrapperInner {
	min-height: 540px;
	padding: 0;
}

#breadcrumbs {
	background: none;
	border: none;
	color: #c9c9c9;
	padding: 0;
	position: absolute;
		left: 13px;
		top: 24px;
}
	#breadcrumbs a:hover {
		color: #fff;
	}
.detail #breadcrumbs {
	left: 60px;
}
	#breadcrumbs a {
		color: #c9c9c9;
		text-decoration: underline;
	}
.detail #breadcrumbs {
	background: none;
	border: none;
	color: #b2b2b3;
	padding: 0;
	position: absolute;
		left: 6px;
		top: 28px;
}
	.detail #breadcrumbs a {
		color: #b2b2b3;
		text-decoration: underline;
	}

#modFilter {
	background: #99a1ad url(images/icons/downArrowBlue.gif) no-repeat 145px 6px;
	border: 1px solid #8c95a4;
	border-top-color: #737c89;
	float: right;
	margin: 5px 60px 0 0;
	position: absolute;
		left: 13px;
		top: 560px;
	width: 156px;
}
#modFilter.open {
	background-position: -55px 5px;
}
	#modFilter h3 {
		color: #2f3031;
		cursor: pointer;
		font-size: 85%;
		font-weight: normal;
		padding: 1px 11px 2px;
	}
	#modFilter ul {
		background: #99a1ad;
		border: 1px solid #8c95a4;
		border-width: 0 1px 1px 1px;
		position: absolute;
			left: -999em;
		width: 156px;
		z-index: 100000;
	}
	#modFilter.open ul {
		left: -1px;
	}
		#modFilter li {
			padding: 0 11px;
		}
			#modFilter li a {
				color: #2f3031;
				font-size: 85%;
			}
			#modFilter li a:hover {
				color: #000;
			}

.modLinkList {
	position: absolute;
		top: 664px;
		left: 13px;
}
.detail .modLinkList {
	clear: both;
	margin: 0 41px 3px 0;
	position: static;
}
	.modLinkList li {
		background: none;
		float: left;
		padding: 0 17px 0 0;
	}
		.modLinkList a {
			background: url(images/icons/arrowExperience.gif) no-repeat 0 5px;
			color: #6bb2d3;
			font-size: 85%;
			padding: 0 0 0 12px;
		}
		.modLinkList a:hover {
			background-position: -199px 5px;
			color: #b9e3e6;
		}

#footer {
	background: #fff url(images/traditions/bg/body.gif) repeat-x 0 -693px;
	border: none;
	clear: both;
	height: auto;
	padding: 40px 0 40px;
	width: auto;
}
#footer .wrapper {
	margin: 0 auto;
	width: 940px;
}
	#logo {
		background: url(images/traditions/MiamiUniversityLogo.gif) no-repeat;	
		display: block;
		float: left;
		height: 33px;
		line-height: 33px;
		margin: -11px 134px 0 0;
		text-indent: -999em;
		width: 156px;
	}
	#footer p {
		clear: none;
		font-size: 77%;
		padding: 0;
		width: auto;
	}
	#footer ul {
		float: none;
		margin: 5px 0 50px -4px;
	}
	#footer ul a {
		color: #656565;
		font-weight: bold;
	}
	#footer ul a:hover {
		color: #000;
	}
		#footer ul li {
			font-size: 77%;
		}
		#footer #shareMiami h3 {
			color: #2f75a1;
		}
		#footer #shareMiami h3:hover {
			color: #1f4e6f;
		}
		#footer #shareMiami.open div {
			padding-top: 6px;
			top: -7px;
		}
		#footer #shareMiami.open ul {
			margin-top: -3px;
		}
		#footer #shareMiami ul li {
			margin: 0 4px;
		}

/***************************************
	Landing Page
***************************************/
h1 {
	background: url(images/traditions/text/tangibleTraditions.png) no-repeat;
	float: left;
	height: 98px;
	line-height: 98px;
	position: absolute;
		left: 77px;
		top: 87px;
	text-indent: -999em;
	width: 364px;
}
#galleryWrapper {
	clear: both;
	margin: 89px 0 0 46px;
}
#galleryNavWrapper {
	height: 441px;
	margin-bottom: 35px;
	overflow: hidden;
	position: relative;
	width: 836px;
}
	#traditionsGalleryNav {
		margin: 2px 0 0;
		position: absolute;
	}
	#traditionsGalleryNav li {
		background: url(images/traditions/bg/frame.png) no-repeat;
		cursor: pointer;
		float: left;
		height: 113px;
		margin: 8px 10px;
		padding: 7px;
		position: relative;
		width: 175px;
	}
	#traditionsGalleryNav li.active {
		z-index: 1000;
	}
	#traditionsGalleryNav li.first {
		margin-left: 428px;
	}
		#traditionsGalleryNav li .content {
			background: #fff url(images/traditions/bg/highlight.gif) repeat-x;
			cursor: pointer;
			min-height: 41px;
			position: absolute;
				left: -999em;
				top: 26px;
		}
		#traditionsGalleryNav li .content div {
			background: url(images/text/more.png) no-repeat;
			height: 61px;
			position: absolute;
				right: -85px;
				top: -1px;
			width: 85px;
		}
		#traditionsGalleryNav li .alt div {
			background: url(images/text/more2.png) no-repeat;
			left: -85px;
			right: auto;
		}
		#traditionsGalleryNav li.active .content {
			display: block;
			left: auto;
			right: 150px;
			top: 32px;
			width: 183px;
			z-index: 1000;
		}
		#traditionsGalleryNav li.active .alt {
			left: 150px;
			right: auto;
		}
		#traditionsGalleryNav li a {
			display: block;
		}
		#traditionsGalleryNav li a:hover,
		#traditionsGalleryNav .active a {
			background: #000;
		}
		#traditionsGalleryNav li a:hover img,
		#traditionsGalleryNav li.active a img {
			opacity: 0.5;
			-moz-opacity: 0.5;
			filter:alpha(opacity=50);
		}
		#traditionsGalleryNav .content {
			border: 1px solid #a7a6a2;
			padding: 9px 0 9px 15px; 
			width: 144px;
		}
		#traditionsGalleryNav .content h3 {
			color: #c52727;
			font-size: 77%;
			font-weight: bold;
			text-transform: uppercase;
		}
		#traditionsGalleryNav .content p {
			color: #484848;
			font-size: 85%;
		}
	#counter {
		color: #fff;
		float: left;
		font-size: 85%;
		font-weight: bold;
		line-height: 19px;
		padding: 0 10px;
		text-transform: uppercase;
	}
	
	#galleryWrapper .button {
		background: url(images/traditions/icons/prevNext.png) no-repeat;
		display: block;
		float: left;
		height: 19px;
		line-height: 19px;
		margin: 0;
		text-indent: -999em;
		width: 19px;
	}
	#galleryWrapper #prev			{background-position: 0 0; margin: 0 0 0 740px;}
	#galleryWrapper a#prev:hover	{background-position: 0 -38px;}
	#galleryWrapper a#prev.disabled	{background-position: 0 -19px; cursor: default;}
	
	#galleryWrapper #next			{background-position: -19px 0}
	#galleryWrapper a#next:hover	{background-position: -19px -38px;}
	#galleryWrapper a#next.disabled	{background-position: -19px -19px; cursor: default}
		
/******************************************
	Details Pages
******************************************/
#traditionLogo {
	background: url(images/traditions/text/tangibleTraditions.gif) no-repeat;
	display: block;
	height: 29px;
	line-height: 29px;
	text-indent: -999em;
	position: absolute;
		right: 33px;
		top: 21px;
	width: 262px;
}

#comments {
	float: left;
	margin: 63px 0 0 26px;
	width: 514px;
}
#comments.alt {
	margin-bottom: 40px;
}
#comments h2 {
	background: url(images/traditions/misc/beveledBorder.gif) repeat-x left bottom;
	color: #94c1e2;
	font: bold 138.5%/20px Arial;
	padding: 0 0 12px;
}
#comments.alt h2 {
	margin-bottom: 10px;
}
	#comments h2 span {
		background: url(images/traditions/misc/vertDivider.gif) no-repeat 0 2px;
		font-weight: normal;
		margin: 0 0 0 4px;
		padding: 0 0 0 7px;
	}
	#comments p,
	#comments label {
		color: #cececf;
		display: block;
		font-size: 108%;
	}
	#comments p {
		margin-bottom: 6px;
	}
	#comments .checkbox {
		color: #fefefe;
		display: inline;
		font-size: 85%;
		font-weight: bold;
		margin: 5px 0 0;
		width: 300px;
	}
		#comments .checkbox input {
			margin: 0 4px 0 0;
			vertical-align: middle;
		}
	#comments label {
		margin: 12px 0 3px;
	}
	#comments .text,
	#comments textarea {
		border: 1px solid #a2a4ab;
		border-bottom-color: #d2dae2;
		border-left-color: #dde0e5;
		border-right-color: #d5d8de;
		color: #6d6c6c;
		font-family: arial;
		font-size: 93%;
		margin: 0 0 10px;
		padding: 2px 4px;
		width: 505px;
	}
	#comments textarea {
		height: 121px;
	}
	#comments .button {
		display: block;
		float: right;
		width: 51px;
	}
	#comments fieldset {
		background: url(images/traditions/misc/beveledBorder.gif) repeat-x left bottom;
		display: block;
		margin: 0 0 0;
		padding: 0 0 5px;
	}
	.fileUpload {
		margin: 8px 0 0;
		position: relative;
	}
		.fileUpload .hidden {

			opacity: 0;
			-moz-opacity: 0;
			filter:alpha(opacity=0);

			position: absolute;
				left: -155px;
				top: 0;
			z-index: 1;
		}
		.fileUpload .fakefile img {
			cursor: pointer;
			margin: 0 11px 0 0;
			vertical-align: middle;
		}
		.fileUpload .fakefile input {
			border: 1px solid #a2a4ab;
			border-bottom-color: #d2dae2;
			border-left-color: #dde0e5;
			border-right-color: #d5d8de;
			color: #6d6c6c;
			font-family: arial;
			font-size: 93%;
			padding: 2px 4px;
			position: relative;
			width: 436px;
			vertical-align: middle;
			z-index: 10;
		}
	#comments .fileDetails {
		color: #232323;
		font-size: 77%;
		font-weight: bold;
		margin: 30px 0 10px;
		text-transform: uppercase;
	}
		.fileDetails span {
			margin: 0 0 0 30px;
		}
	#comments #terms {
		background: #eceef0;
		border: 1px solid #d3d9df;
		height: 67px;
		margin: 20px 0 6px;
		overflow: auto;
		padding: 0 9px 10px;
		width: 495px;
	}
		#comments #terms h3 {
			color: #c52727;
			font-size: 93%;
			font-weight: normal;
			margin: 7px 0 3px;
		}
		#comments #terms p {
			color: #4c4b4b;
			font-size: 77%;
			line-height: 1.4em;
			margin: 0 0 8px 2px;
		}
#media {
	background: #fefeff url(images/traditions/bg/media.gif) no-repeat left bottom;
	float: left;
	margin: 65px 0 0;
	padding: 0 0 30px;
	width: 371px;
	min-height: 541px;
}
	#media div {
		background: url(images/traditions/bg/video.gif) no-repeat;
		height: 278px;
		padding: 7px 0 0 26px;
		width: 345px;
	}
	#media h2,
	#media p {
		margin: 0 30px 0 33px;
	}
	#media h2 {
		color: #c52727;
		font-family: Arial;
		font-size: 138.5%;
		font-weight: normal;
		margin-top: 12px;
		margin-bottom: 4px;
	}
	#media p {
		color: #737373;
		font-size: 93%;
		line-height: 1.5em;
		margin-bottom: 3px;
	}
	#media .credit {
		font-size: 85%;
	}
	
#comments li {
	background: url(images/traditions/misc/beveledBorder.gif) repeat-x left bottom;
	padding: 7px 0;
}
#comments li h3 {
	background: url(images/traditions/icons/speachBubbleBlue.png) no-repeat 0 5px;
	color: #8dd4fb;
	font-size: 93%;
	font-weight: bold;
	line-height: 1em;
	margin: 2px 0 0 -4px;
	overflow: auto;
	padding: 5px 0 10px 46px;
	text-transform: uppercase;
	width: 400px;
}
#comments .audio h3 {
	background: url(images/traditions/icons/audioYellow.png) no-repeat 0 0;
	margin-left: 0;
}
	#comments li h3 span {
		color: #ecd67c;
		display: block;
		margin: 1px 0 0;
		text-transform: none;
	}
#comments li p {
	line-height: 1.28em;
	margin: 0 0 13px;
}
#comments .featured {
	background: url(images/traditions/bg/featuredComment.png) repeat-x left bottom;
	border: 1px solid #424a50;
	padding: 9px 19px 10px;
}
	#comments .featured h3 {
		background: url(images/traditions/icons/speachBubbleRed.png) no-repeat 0 0;
		color: #448bb2;
		font-size: 108%;
		margin: 4px 0 0 -6px;
		padding: 10px 0 16px 74px;
	}
	#comments .audio .featured h3 {
		background-image: url(images/traditions/icons/audioRed.png);
	}
		#comments .featured span {
			color: #5f5f5f;
			margin: 1px 0 0;
		}
	#comments .featured p {
		color: #5f5f5f;
	}
	
.endCap {
	background: url(images/traditions/misc/beveledBorder.gif) repeat-x left bottom;
	overflow: auto;
	padding: 8px 0 10px;
	width: 514px;
}
.tellStory {
	background: url(images/traditions/misc/storyArrows.gif) no-repeat right 5px;
	color: #e8ae11;
	float: left;
	font-size: 108%;
	text-transform: lowercase;
}
.tellStory:hover {
	background-position: right -188px;
	color: #fff;
}
#comments .pagination {
	float: right;
	margin: 2px 0 0;
}
	#comments .pagination li {
		background: url(images/traditions/misc/vertDividerSm.gif) no-repeat right top;
		float: left;
		line-height: 1em;
		padding: 0 6px;
	}
	#comments .pagination .last {
		background: none;
	}
	#comments .pagination .prev {
		background: url(images/traditions/icons/pagination.gif) no-repeat;
		height: 8px;
		line-height: 8px;
		margin: 2px 2px 0 0;
		padding: 0;
		text-indent: -999em;
		width: 7px;
	}
	#comments .pagination .next {
		background: url(images/traditions/icons/pagination.gif) no-repeat -7px 0;
		height: 8px;
		line-height: 8px;
		margin: 2px 0 0 2px;
		padding: 0;
		text-indent: -999em;
		width: 7px;
	}
		#comments .pagination .prev a {
			background: url(images/traditions/icons/pagination.gif) no-repeat 0 -8px;
			height: 8px;
			line-height: 8px;
			text-indent: -999em;
			width: 7px;
		}
		#comments .pagination .prev a:hover {
			background-position: 0 -16px;
		}
		#comments .pagination .next a {
			background: url(images/traditions/icons/pagination.gif) no-repeat -7px -8px;
			height: 8px;
			line-height: 8px;
			text-indent: -999em;
			width: 7px;
		}
		#comments .pagination .next a:hover {
			background-position: -7px -16px;
		}
		#comments .pagination a {
			color: #7ccefe;
			display: block;
			font-size: 77%;
		}
		#comments .pagination a:hover,
		#comments .pagination .active a {
			color: #fff;
		}