/* 



  CLAS CSS 



  author: CLAS Web Services, www.clas.uiowa.edu/web/



*/







/******************** Undo HTML ********************/



*



{



	margin: 0px 0px 0px 0px;



	padding: 0px 0px 0px 0px;



}







img



{



	border: none;



}



/******************** Type ********************/



span, h1, h2, h3, h4, h5, h6



{



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif !important;



	margin-left: 2%;



}







p {



	margin: 1% 4% 2% 0%;



	}







h1 {



	margin: 1% 0 1% 1%;



	font-size: 200%;



}







h1 a:link, h1 a:visited {



	color: #000000;



}







h2 {



	font-size: 180%;



}







h3 {



	font-size: 160%;



}







h4 {



	border-bottom: 1px solid #d0a40b;



	color: #000000;



	padding: 1% 1% 0 0%;



	margin: 0 50% 3% 0%;



	font-size: 140%;



}



h4 a {



	color: #333333;



	border-bottom: none;



	display: block;



}



h4 a:hover {



	color: #eeeeee;



}



h5 {



	margin: 2% 0px 1% 0px;



	padding: 0px 0px 0px 0px;



	font-size: 120%;



	color: #333333;



}



h6 {



	margin: 2% 0px 1% 0px;



	padding: 0px 0px 0px 0px;



	font-size: 105%;



	color: #4d4b4b;



}



h7 {



	margin: 2% 0px 1% 0px;



	padding: 0px 0px 0px 0px;



	font-size: 110%;



	color: #828181;



}



/******************** Links ********************/



a {

	color: #d0a40b;



	text-decoration: none;



	outline: none;



}







a[href$=".pdf"] {



   	background: url(../images/_global/pdf.png) center right no-repeat;



 	padding-right: 20px;



}







a[href$='.doc'] {



	background: url(../images/_global/word.png) center right no-repeat;



	padding-right: 22px;



}







a[href$='.docx'] {



	background: url(../images/_global/word.png) center right no-repeat;



	padding-right: 22px;



}







a[href$='.xls'] {



	background: url(../images/_global/excel.png) center right no-repeat;



	padding-right: 22px;



}







a[href$='.xlsx'] {



	background: url(../images/_global/excel.png) center right no-repeat;



	padding-right: 22px;



}







a[href^='mailto'] {



	background: url(../images/_global/mailto.png) center right no-repeat;



	padding-right: 18px;



	display:inline;



}







/******************** Classes ********************/



.block {



	display: block;



	color: #333333;



}







.block:hover {



	color: #eeeeee;



}







.border {



	border: 1px solid #D4D4D4;



}







.bigger {



	font-size: 14px;



	padding: 5px 5px 5px 5px;



}







/*************/







.center {



	text-align: center;



}







.noblock tr a {



	display: inline;



}







.nohover tr:hover {



	background: none;



}







.lower_alpha {



	list-style-type: lower-alpha;



}







.upper_alpha {



	list-style-type: upper-alpha;



}







.upper_roman {



	list-style-type: upper-roman;



}







.lower_roman {



	list-style-type: lower-roman;



}







.float_left {



	float: left;



}







.float_right {



	float: right;



}







.inline li {



	display: inline;



}







.italic {



	font-style: italic;



}







.bold {



	font-weight: bold;



}



.underline {



	border-bottom: solid 1px #e0dfdf;



	padding: 0px 0px 0px 0px;



}







.photo {



	float: left;



	padding: 1% 1% 1% 1%;



	margin: 2% 2% 2% 2%;



	width: 94%;



	border: 1px solid #D4D4D4;



}







.photo img {



	max-width: 40%;



	float: left;



	padding: 1% 1% 1% 1%;



	border: none;



}







.photo p {



	width: 55%;



	float: left;



	margin: 0% 0 0 1%;



}







/*DO NOT DELETE - Used for drop down navigation*/



.has_children {



}



/*DO NOT DELETE - Used for drop down navigation*/



.current {



}



/******************** Container ********************/



#container {



	width: 915px;



	min-width: 915px;



	margin: 0px auto;



	border-left:solid 1px #e0dfdf;



	border-right:solid 1px #e0dfdf;



}



.dark {







	background: url(../images/_global/background_black.jpg);



	



}



/********************** Top **********************/



#top {



	position: relative;



	width: auto;



	height: 25px;



	background: #000000;



	margin: 0px 0px -9px 0px;



}







/* ui wordmark */



#top h2 a {



	display: block;



	position: absolute;



	left: 0;



	top: 0;



	text-indent: -9999px; /* image replacement */



	width: 225px;



	height: 20px;



	background: url(../images/_global/the-university-of-iowa.png) no-repeat;



	margin: 0px 0px 0px 22px;



}







/* clas wordmark */



#top h3 a {



	display: block;



	position: absolute;



	right: 0;



	top: 0;



	text-indent: -9999px; /* image replacement */



	width: 347px;



	height: 20px;



	background: url(../images/_global/college-of-liberal-arts--sciences.png) no-repeat;



	margin: 0px 10px 0px 0px;



}







.wrapper {



	position: relative;



	width: 915px;



	height:  100%;



	margin: 0 auto;



}



/******************** Header ********************/



#header {



	position: relative;



	width: 915px;



	height: 147px;



	background: url(../images/_global/banner.jpg) no-repeat;



}



#header h1 a {



	position: absolute;



	top: 10%;



	left: 3%;



	width: 250px;



	height: 100px;



	text-indent: -9999px;



	margin: 0 !important;



	padding: 0 !important;



	background: url(../images/_global/music_wordmark.png) no-repeat;



}



/******************** Search ********************/



#search_form {



	position: absolute;



	right: 1%;



	bottom: 20%;



}



#search {



	border: none;



	margin: 0 auto;



	background: url(../images/_global/grey.png);



}



#search_field  {



	color: #fff;



	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;



	font-size: 1.2em;



	width: 150px;



	height: 30px;



	padding: 8px 5px 0;



	margin-right: 5px;



	border: none;



	float: left;



	background: none;



}



#search_field:focus  {



	outline: none;



}



#search_button {



	width: 38px;



	height: 38px;



	cursor: pointer;



	border: none;



	float: left;



	background: url(../images/_global/search.png) center no-repeat;



}



/******************** Global Navigation ********************/



#global_navigation {



	position: absolute;



	bottom: -20px;



	left: 0;



	list-style-type: none;



	height: 35px;



	width: 915px;



	line-height: 35px;



	text-align: center;



	background: #000000;



	border-bottom: 1px solid #f9c205;



	border-top: 1px solid #f9c205;



	overflow: hidden;



	z-index: 100;



}



#global_navigation li {



	display: inline;



	margin: 0 8px 0 8px;



}



#global_navigation li a {



	padding: 7px 3px 7px 3px;



	color: #ffffff;



	border-bottom: none;



	



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif !important;



}



#global_navigation li a:hover {



color: #f9c205;	



}



/******************** Local Navigation ********************/



#local_navigation {



	float: left;



	margin: 0% 0 0% 0;



	padding: 0px 0px 20px 0px;



	list-style-type: none;



	width: 25%;



	line-height: 1.4em;



	color: #000000;



}



#local_navigation ul {



	list-style-type: none;



	font-size: 14px;



	color: #000000;



}



#local_navigation a {



	color: #000000;



}



#local_navigation li a {



	display: block;



	padding: 3px 5px 0px 28px;



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif !important;



	color: #000000;



}



#local_navigation li ul {



	padding: 0 0 0 40px;



	font-size: 13px;



}



#local_navigation li ul li a {



	padding: 4px 4px 3px 10px;



	color: #000000;



}



#local_navigation li a:hover {



	color: #000000!important;



	background-color: #e0dfdf;



	



}



.local {



	font-size: 20px;



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif;



	width: 27%;



	margin: 20px 0px 0px 0px;



	padding: 20px 0px 5px 28px;



}



.light_gray {



	color: #e0dfdf;



}



.light_gray a {



	color:#e0dfdf!important;



}



.mid_gray {



	color: #414141;



	background-color: #ffffff;



}



.dark_gray {



	color: #2b2a2a;



	background-color: #ffffff;



}



.dark_gray a{



	color: #2b2a2a;



	background-color: #ffffff;



}



.white {



	color:#ffffff;



}



.black {



	color: #000000;



}



/******************** Special links on left menu, Sounds, Hire, Giving ********************/



#feature {



	float: left;



	margin: 400px 0px 0px -225px;



	padding: 20px 0px 0px 0px;



	width: 30%;



}



#feature ul {



	list-style-type: none;



	margin: -6px 0 0 0;



}



#feature ul li a {



	display: block;



	color: #ffffff;



	padding: 0px 5px 0px 80px;



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif !important;



	line-height: 3.7em;



}



#feature ul li a:hover {



	color: #000000;



	background-color: #e0dfdf;



	margin: 0px 50px 0px 20px;



	padding: 0px 0px 0px 60px;



}



.feature_image {



	float: left;



	width: 10%;



}



.feature_image img {



	margin: 0px 0px 25px 30px;



	padding: 0px 0px 0px 0px;



}



/******************** Home Page Image ********************/



#home_image {



	margin-top: -5%;



	margin-bottom: -3%;



	float: right;



	height: 325px;



	width: 68%;



	border-top: none;



	background-color: #000000;



	overflow: hidden;



}



/******************** Secondary Page Image ********************/



#secondary_image {



	margin: -5.5% -2.4% -3% 0%;



	float: right;



	height: 200px;



	width: 68%;



	border-top: none;



	background-color: #FFFFFF;



	overflow: hidden;



	z-index: 0 !important;



	z-index: -1;



}



/******************** Content ********************/



#content_wrapper {



	width: 66%;



	min-height: 400px;



	float: right;



	padding: 1% 1% 1% 1%;



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif;



	font-size: 0.82em;



	line-height: 1.6em;



	font-style: normal;



	font-variant: normal;



	font-weight: normal;



	color: #797777;



}



.home{



	margin: 3% 0 0 0;



}



.secondary {



	margin: 2% 0 0 0;



	padding: 20px 0px 0px 50px!important;



}



.tertiary{



	margin: -3% 0 0 0;



}



#content_wrapper img {



	padding: 0 0 0 0;



	margin: 1% 2% 1% 3%;



}



#content_wrapper ul {



	margin: 0px 1% 1% 3%;



	padding: 0% 1% 1% 1%;



	list-style-type: none;



	list-style-position: inside;



}



#content_wrapper ol  {



	margin: -1% 1% 1% 3%;



	padding: 1% 1% 1% 1%;



	list-style-position: inside;



}



#content_wrapper ul li {



	margin: 2px 0 2px 0px;



	text-indent: -1%;



	



	padding-left: 16px;



}



#content_wrapper ol li {



	margin: 2px 0 2px 2%;



	text-indent: -1%;



	padding-left: 16px;



	



}



#content_wrapper ul li a {



	border-bottom: none;



}



#content_wrapper ul li ul {



	margin: -1% 0 -1% 1%;



}



#content_wrapper a:hover {



	background-color: #EEEEEE;



}



.bullets {



	list-style-type: disc!important; 



	color: #676768;



}







/**********Content half the width, use twice to get two columns ***********/



.content_half



{



	float: left;



	width: 48%;



	margin: 1% 0 2% 0%;



}



/******************** Left Column Why ********************/



.content_left



{



	float: left;



	width: 32%;



	margin: 1% 0 2% 0%;



}



/******************** Center Column News********************/



.content_center



{



	float: left;



	width: 32%;



	margin: 1% 0 2% 0;



}



/******************** Right Column Concert Calendar********************/



.content_right



{



	float: right;



	width: 32%;



	margin: 1% 0 2% 0;



}



/*****Why Iowa, Events and Concert Calendar boxes ***********/



.why 



{



	display: block;



	margin: 2% 0 3% -2%;



	min-height: 41px;



}



.why p {



	margin: 15px 18px 0px 0px;



	padding: 0 1% 0 3%;



	font-size: .80em;



	line-height: 1.4em;



}



.why h5 {



	margin: 0 0 0 0;



	padding: 0 1% 0 3%;



	min-height: 0 !important;



	color: #d0a40b;



}



.why h6 {



	margin: 15px 0 -10px 0;



	padding: 0 1% 0 3%;



	color: #ffffff;



	min-height: 0 !important;



	color: #ffffff;



}



.why a:hover



{



	color: #000000;



}



.why a span, .news a span .calendar a span



{



	float: left;



	width: 20px;



	padding: 0 1% 0 1%;



	margin: 0 1% 0 -1%;



	text-align: center;



	color: #333333;



	background-color: #F3F2C6; 



}



/**********/



.news {



	display: block;



	margin: 2% 0 3% 2%;



	min-height: 41px;



}



.news p {



	margin: 15px 18px 0px 0px;



	padding: 0 1% 0 3%;



	font-size: .80em;



	line-height: 1.4em;



}



.news h5 {



	margin: 0 0 0 0;



	padding: 0 1% 0 3%;



	min-height: 0 !important;



	color: #d0a40b;



}



.news h6 {



	color: #ffffff;



	margin: 15px 0 -10px 0;



	padding: 0 1% 0 3%;



}







.news a:hover {



	color: #000000;



}



/***************/



.calendar  {



	display: block;



	margin: 2% 0% 3% 2%;



	min-height: 41px;



}



.calendar p {



	margin: 15px 18px 0px 0px;



	padding: 0 1% 0 3%;



	font-size: .80em;



	line-height: 1.4em;



}



.calendar h5  {



	margin: 0 0 0 0;



	padding: 0 1% 0 3%;



	min-height: 0 !important;



	color: #d0a40b;



}



.calendar h6 {



	color: #ffffff;



	margin: 15px 0 -10px 0;



	padding: 0 1% 0 3%;



}







.calendar a:hover {



	color: #000000;



}



/*********Profiles pages ******************/



.profile {



	float: right;



	width: 200px;



	background-color: #2b2a2a;



	color: #ffffff;



	margin: 0px -8px 5px 20px;



	padding: 25px 0px 20px 28px;



}



.profile h5 {



	color: #d0a40b;



}



.profile h6 {



}



.profile a {



	color: #e0dfdf;



	background-color: #2b2a2a !important;



}



/******************** Tables ********************/



table {



	border: 1px solid #bcbcbc;



	border-collapse: collapse;



	margin: 2% 0 2% 0%;



	width: 98%;



	line-height: 1.5;



}



caption {



	font-weight: bold;



}







th {



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif !important;



	text-align: center;



	background-color: #999999;



	font-size:14px;



	border-right: 1px solid #bcbcbc;



	color: #FFF;



	padding: 5px 5px 5px 5px;



}



 



td {



	border-bottom: 1px solid #bcbcbc;



	border-right: 1px solid #bcbcbc;



	text-align: left;



	padding: 0 1% 0 1%;



}



tr:hover {



	background-color: #EEEEEE;



}



 tr a {



	display: block;



	border-bottom: none;



}







/******************** Borderless Tables ********************/



.noborder, .noborder tr, .noborder td {



	border: none;



}



.noborder tr a {



	display: inline;



	border-bottom: none;



}



.books td {



	padding-right: 10px;



}



.books tr:hover {



	background: none;



}



.noborder tr:hover {



	background: none;



}



/******************** Forms ********************/

.forms select {
	margin: 0 0 2% 0;
}

.forms input {
	margin: 0 0 1% 0;
}

.forms input[type="submit"] {
	margin: 1% 0 0 1%;
	padding: 0 1% 0 1%;
}

.forms fieldset {
	border: none;
	width: 100%;
	max-width: 100%;
}


#url {
	display: none;
}

.forms label {
	position: relative;
	display: block;
}

.forms label input[type="text"] {
	position: absolute;
	right: 0;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}



/********* Radio/Checklist ***********/


.forms label input[type="radio"] {
	position: relative;
	margin: 0 0 0 1%;

}

label.error {
	display: inline;
	margin-left: 2%;
	color: red; 
}

input.error {
	border-color: red;
}

/*************************************/

.forms input:focus {
	outline: 1px solid #336699;
}



.forms textarea {
	margin: 0 0 1% 0;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 99%;
	width: 100%;
}



.forms textarea:focus {
	outline: 1px solid #336699;
}

option {
	padding: 0 5% 0 0;
}


/******************** Footer ********************/



#footer {



	clear: both;



	background-color: #000000;



	border-top: 1px solid #f9c205;



	color: #ffffff;



	height: 100%;



	padding: 2% 3% 2% 4%;



}



#footer p {



	font-family: Helvetica, Arial,"Trebuchet MS", sans-serif;



	font-size: 0.75em;



	line-height: 1.4em;



	font-style: normal;



	font-variant: normal;



	font-weight: normal;



}



#footer p a { 



	color: #f9c205;



}



.left {



	margin: 0px 600px 30px 0px;



	padding: 0px 0px 0px 0px;



	text-align: left;



}



.right {



	margin: -85px 0px 0px 280px;



	padding: 0px 150px 0px 0px;



	text-align: left;



}
