/*
-----------------------------------------------
Style Sheet

Site: The Recording Arts Center
Author:   aaryn.com
Version:  2007.06
----------------------------------------------- */


/* undo some default styling of common (X)HTML browsers
 * ------------------------------------------------------------------------- */


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,html,label{margin:0;padding:0;}


fieldset,img,a img,:link img,:visited img {border:0;}

address,caption,cite,code,dfn,th,var {font-style:normal;font-weight:normal;}

ol, ul {list-style:none;}


h1,h2,h3,h4,h5,h6 {font-size:1.0em;}

q:before,q:after {content:'';}



/* global elements
 * ------------------------------------------------------------------------- */

/* Default font size in IE and FireFox is 16px. Default for Safari is 14px. */
html {
	font-size:100% /* IE has problems scaling text in ems. Using a percentage makes for better text rendering when scaled. */
	}

body {
	background: url(../images/bg.jpg) repeat-x #000;
	font-size:.75em; /* Read by IE only. - 75% of 16px = 12px */
	font-family:Arial, Helvetica, sans-serif;
	text-align:left;
	padding:10px 0 10px 0;
	margin-bottom:10px;
	}

html>body {
	font-size:12px; /* overrides the font-size above in all browsers except IE. These browsers can resize text that is specified in px so this is ok. */
	}

a:link, a:visited {
	color:#7c2811;
	}
	
a:hover, a:active {
	color:#c53c14;
	}
	

/* Classes
 * ------------------------------------------------------------------------- */

.clear {
	clear:both;
	height:.01em;
	overflow:hidden;
	}

.pic_left {
	margin:0 15px 2px 0;
	float:left;
	}

.pic_right {
	margin:0 0px 2px 15px;
	float:right;
	}
	
.orange_border {
	border:1px solid #fda307;
	}

.paper_icon {
	background:url(../images/paper_icon.gif) no-repeat;
	padding-left:20px;
	}

.pad_right {
	padding-right:10px;
	}
	
.pad_left {
	padding-left:10px;
	}

.pad_bottom {
	padding-bottom:20px;
	}

.push_down {
	margin-bottom:10px;
	}

.push_down_sm {
	margin-bottom:5px;
	}

.pad_above {
	margin-top:5px;
	}

.date_square{
	background:url(../images/date_square.gif) no-repeat;
	width:29px;
	height:28px;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	}
	
	.date_square .date {
		font-weight:bold;
		color:#000;
		height:14px;
		}
		
	.date_square .month {
		color:#fff;
		height:14px;
		}

.stylin_list {
	margin: 5px 0 10px 10px;
	}

	.stylin_list li { 
		_position:relative;	 /*to fix the IE bullet peekaboo pug */
		padding-left: 15px;
		line-height: 1.4em;
		list-style: none;
		margin-bottom:3px;
		background: transparent url(../images/bullet.gif) 0px 6px no-repeat;
		}


.course_list li { 
		_position:relative;	 /*to fix the IE bullet peekaboo pug */
		padding-left: 15px;
		line-height: 1.4em;
		list-style: none;
		margin-bottom:3px;
		background: transparent url(../images/bullet_black.gif) 0px 6px no-repeat;
		font-weight:bold;
		}
		
		.course_list li a:link, .course_list li a:visited {
			text-decoration:none;
			}


.download_list li { 
		_position:relative;	 /*to fix the IE bullet peekaboo pug */
		padding-left: 25px;
		line-height: 1.8em;
		list-style: none;
		margin-bottom:6px;
		background: transparent url(../images/pdf_icon.gif) 0px 4px no-repeat;
		font-weight:bold;
		}

.testimonial_name {
	margin:5px 0 0px 0;
	font-weight:bold;
	}

.pic_border a:link img, .pic_border a:visited img  {
	padding:1px;
	border:1px solid #c0bbad;
	}

.pic_border_dark a:link img, .pic_border_dark a:visited img  {
	padding:1px;
	border:1px solid #9fa199;
	}

.big_text {
	font-size:1.3em;
	}

.small_text {
	font-size:.92em;
	}

.list_nav {
		margin-bottom:15px;
		}
	
	.list_nav li {
		margin: 0 0 5px;
		padding: 0 7px 0 10px;
		display: inline;
		border-right: 1px solid #89877e;
		font-size:.92em;
		}
	

		.list_nav li.no_border { 
			border: none;
			padding:0 0px 0 10px;
			}
		
		.list_nav li.first {
		padding-left:0;
			margin-left:0;
			}

	.list_nav a:link, .list_nav a:visited{
		text-decoration:none;
		}

.quote {
	background:url(../images/quote.gif) no-repeat;
	padding:5px 0px 0 25px;
	margin-bottom:15px;
	}

.back_to_top {
	background:url(../images/back_to_top.gif) no-repeat 0px 6px;
	padding-left:20px;
	font-size:.92em;
	margin-top:10px;
	}

.combine_text {
	font-weight:bold;
	color:#555555;
	font-size:1.2em;
	}

ol.nice_order {
	padding:20px; 
	margin-left:20px;
	list-style:decimal;
	}
	
	ol.nice_order li {
		margin-bottom:5px;
		}

.center {
	text-align:center;
	}

/* ----- Calendar Styles ----- */
.calendar_month {
	font-size:1.6em;
	color:#fff;
	font-weight:bold;
	text-align:center;
	}

.white_text {
	color:#fff;
	}


/* Layout
 * ------------------------------------------------------------------------- */
 
#container {
	width:760px;
	margin:0 auto 10px auto;
	background:#c2c3ba;
	}


/* ---------- Header Styles ---------- */

#trac_title {
	background:url(../images/trac_title.jpg) no-repeat;
	width:241px;
	height:127px;
	float:left;
	display:block;
	}
	
	#trac_title h1, #trac_title h2 {
		display:none;
		}

#blank_space {
	background:url(../images/blank_header_area.jpg) no-repeat;
	width:305px;
	height:127px;
	float:left;
	}
	
	#blank_space h2 {
	display:none;
		}

#location {
	background:url(../images/phone_number.jpg) no-repeat;
	width:214px;
	height:127px;
	float:left;
	}
	
	#location h2 {
		display:none;
		}
	

/* ---------- Upper Content ---------- */

#upper_content {
	background:url(../images/homepage_segment_divider.gif) no-repeat bottom;
	width:720px;
	padding:20px 20px 26px 20px;
	}


/* ---------- Main Content ---------- */
#main_content {
	width:457px;
	float:right;
	line-height:1.4em;
	}
/* ---------- Roadmap Main Content ---------- */
#roadmap_main_content {
	width:720px;
	line-height:1.4em;
	}
 
#roadmap_bottomleft_content {
	background:url(../images/latest_news_bg.gif) repeat-y #d3cfc1;
	width:193px;
	padding:20px;
	margin-right:30px;
	float:left;
	font-size:.92em;
	}	
#roadmap_bottomright_content {
	background:url(../images/latest_news_bg.gif) repeat-y #d3cfc1;
	width:193px;
	padding:20px;
	margin-right:30px;
	float:left;
	font-size:.92em;
	}	

#get_on_trac {
	background:url(../images/on_trac.gif) no-repeat;
	width:319px;
	height:38px;
	margin-bottom:20px;
	}
	
	#get_on_trac span {
		display:none;
		}




/* ---------- Primary Content ---------- */
#primary_content {
	width:720px;
	line-height:1.4em;
	}




/* ----------Tour Page ---------- */

#tour_container {
	background:url(../images/vertical_divider.gif) repeat-y 360px 0px;
	width:720px;
	}

#tour_left {
	width:350px;
	float:left;
	display:inline;
	text-align:center;
	background:none;
	}
	
#tour_right {
	width:350px;
	float:left;
	margin-left:20px;
	display:inline;
	text-align:center;
	background:none;
	}



/* ---------- Latest News Box ---------- */

#latest_news {
	background:url(../images/latest_news_bg.gif) repeat-y #d3cfc1;
	width:193px;
	padding:20px;
	margin-right:30px;
	float:right;
	font-size:.92em;
	}

.right_hand_content {
	background:url(../images/latest_news_bg.gif) repeat-y #d3cfc1;
	width:193px;
	padding:20px;
	margin-left:30px;
	float:right;
	font-size:.92em;
	}

#latest_news_title {
	background:url(../images/latest_news.gif) no-repeat;
	width:109px;
	height:16px;
	margin-bottom:20px;
	overflow:hidden;
	}

#programs_and_courses_title {
	background:url(../images/programs_and_courses.gif) no-repeat;
	width:180px;
	height:21px;
	margin-bottom:10px;
	overflow:hidden;
	}

#protools_training_title {
	background:url(../images/protools_training.gif) no-repeat;
	width:159px;
	height:21px;
	margin-bottom:10px;
	overflow:hidden;
	}
	
#student_testimonials_title {
	background:url(../images/student_testimonials.gif) no-repeat;
	width:188px;
	height:17px;
	margin-bottom:20px;
	overflow:hidden;
	}

#map_title {
	background:url(../images/map_and_directions.gif) no-repeat;
	width:188px;
	height:22px;
	margin-bottom:20px;
	overflow:hidden;
	}

	#latest_news_title span, #student_testimonials_title span , #map_title span, #programs_and_courses_title span, #protools_training_title span{
		display:none;
		}

.horiz_divider {
	background:url(../images/small_horiz_divider.gif) no-repeat;
	width:193px;
	height:1px;
	overflow:hidden;
	margin:20px 0;
	}


.divider_sub {
	background:url(../images/divider_horiz.gif) repeat-x;
	height:1px;
	overflow:hidden;
	width:100%;
	margin:20px 0px;
	}

.divider_wide {
	background:url(../images/divider_repeater.gif) repeat-x;
	width:720px;
	height:1px;
	overflow:hidden;
	margin:20px 0;
	}


/* ---------- Lower Content ---------- */

#lower_content {
	background:#363834;
	padding:20px;
	width:720px;
	}


/* ---------- Contact Box ---------- */
#contact_box {
	background:url(../images/contact_box_bg.gif) repeat-y right #e8e9e0;
	padding:15px 20px 20px 20px;
	border:1px solid #000;
	font-size:.92em;
	}

#contact_us_title {
	background:url(../images/contact_us_title.gif) no-repeat;
	width:140px;
	height:24px;
	margin-bottom:15px;
	}
	
	#contact_us_title span {
		display:none;
		}

/* ---------- Bottom Boxes ---------- */

.bottom_box {
	background:url(../images/bottom_box.gif) no-repeat bottom;
	padding:0 23px 20px 20px;
	color:#c6c7be;
	font-size:.92em;
	}
	
	.bottom_box a:link, .bottom_box a:visited {
		color:#ffa200;
		}
		
	.bottom_box a:hover, .bottom_box a:active {
		color:#ea7900;
		}


#why_train_sd {
	background:url(../images/why_train_sd.gif) no-repeat;
	width:186px;
	height:40px;
	margin-bottom:15px;
	}
	
	#why_train_sd a:link, #why_train_sd a:visited  {
		width:186px;
		height:40px;
		display:block;
		}
	
	#why_train_sd span {
		display:none;
		}

#financial_aid {
	background:url(../images/financial_aid_title.gif) no-repeat bottom;
	width:144px;
	height:40px;
	margin-bottom:15px;
	}
	
	#financial_aid a:link, #financial_aid a:visited  {
		width:144px;
		height:40px;
		display:block;
		}
	
	#financial_aid span {
		display:none;
		}


/* ---------- Footer ---------- */

#footer {
	width:760px;
	margin:10px auto;
	padding-bottom:10px;
	}

#digidesign {
	background:url(../images/digidesign.gif) no-repeat;
	width:230px;
	height:35px;
	float:left;
	}
	
	#digidesign span {
		display:none;
		}

#footer_links {
	float:right;
	}

	#footer ul {
		margin-bottom:5px;
		}
	
	#footer li {
		margin: 0;
		padding: 0 7px 0 10px;
		display: inline;
		border-right: 1px solid #c2c3ba;
		font-size:.92em;
		background: none;
		color:#c2c3ba;
		}

		#footer li.last { 
			border: none;
			padding-right:0;
			}

	#footer a:link, #footer a:visited{
		color:#c2c3ba;
		text-decoration:none;
		}

	 #footer a:hover, #footer a:active {
	 	color:#7c2811;
		text-decoration:none;
		}

	#copyright {
		color:#929387;
		font-size:.92em;
		text-align:right;
		}
		
		#copyright a:link, #copyright a:visited {
			color:#7c2811;
			}
	
		#copyright a:hover, #copyright a:active {
			color:#c53c14;
			}

#disclaimer {
	font-weight:bold;
	color:#444;
	margin-top:15px;
	
	}

/* -------------------- Forms -------------------- */
#newsletter input {
	width: 130px;
	background:#d3cfc1;
	color:#666;
	border:1px solid #666;
	float:left;
	height:18px;
	padding-top:2px;
	}

#newsletter br {
	clear:left;
	}
	
#newsletter .submit {
	width:50px;
	height:22px;
	border:0;
	background:none;
	margin-left:10px;
	margin-top:-2px;
	}


/* ---------- Main Form ---------- */

form#main_contact {
	width:450px;
	}

fieldset {
	margin: 10px 0; /*  space out the fieldsets a little*/
	padding:10px;
	border : 1px solid #aaa;
	}
	
	#main_contact fieldset {
		margin:0;
		padding:0;
		border:none;
		}

legend {
	font-weight:bold;
	font-size:1.2em;
	padding-bottom:10px;
	color:#444;
	}
	
	legend span {
		color:#4f190f;
		font-size:1.4em;
		}


label {
	float:left;
	text-align:left;
	margin-right:10px;
	margin-top:0px; /* to align label with the top of input area */
	font-weight:bold;
	}
	
	#main_contact label {
		width:85px;
		text-align:right;
		}
	
	.step_one label {
		width:65px;
		}
	
	.step_two {
		width:660px;
		}
	
		.step_two select {
			margin-right:25px;
			float:left;
			}
		
		
	.step_three label {
		width:125px;
		}



	input.checkbox {
		width:16px;
		height:16px;
		background:none;
		border:none;
		margin:0 5px 8px 80px;
		}
	
	input.zip {
		width:40px;
		}
	
	input.phone {
		width:85px;
		}

select {
	margin-bottom:8px;
	background-color:#efefef;
	border:1px solid #999;
	}

textarea {
	width:300px;
	overflow:hidden;
	}

	form br {
		line-height:0.0;  /* defaults vertical spacing between fields */
		clear:both;
		}

#submit {
	margin-left:95px;
	width:50px;
	height:22px;
	float:none;
	border:none;
	}



/* Horizontal Sprite Nav

 * ------------------------------------------------------------------------- */

#nav { 
	background:url("../images/nav.gif") no-repeat; 
	width:760px; 
	height:33px; 
	margin:0;
	padding:0; 
	}

#nav span { display: none; }

#nav li, #nav a { height:33px; display:block; } /* change height here also */

#nav li { float:left; list-style:none; _display:inline; position:relative; }

#nav-01 { width: 102px; left:0px;}
#nav-02 { width: 101px; left:1px;}
#nav-03 { width: 108px; left:2px;}
#nav-04 { width: 104px; left:3px;}
#nav-05 { width: 96px; left:4px;}
#nav-06 { width: 71px; left:5px;}
#nav-07 { width: 83px; left:6px;}
#nav-08 { width: 88px; left:6px;}


/*-------------- (-79px) X position of button / (-33px) height of image from above ------------- */

#nav-01 a:hover { background:url("../images/nav.gif") -0px -33px no-repeat; }
#nav-02 a:hover { background:url("../images/nav.gif") -103px -33px no-repeat; }
#nav-03 a:hover { background:url("../images/nav.gif") -205px -33px no-repeat; }
#nav-04 a:hover { background:url("../images/nav.gif") -314px -33px no-repeat; }
#nav-05 a:hover { background:url("../images/nav.gif") -419px -33px no-repeat; }
#nav-06 a:hover { background:url("../images/nav.gif") -516px -33px no-repeat; }
#nav-07 a:hover { background:url("../images/nav.gif") -588px -33px no-repeat; }
#nav-08 a:hover { background:url("../images/nav.gif") -671px -33px no-repeat; }


/*-------------- OPTIONAL - Keeps the hover state on each page based on body #id ------------- 

body#index #nav-01  { background:url("../images/nav.gif")  -0px -33px no-repeat; }
body#about #nav-02  { background:url("../images/nav.gif") -144px -33px no-repeat; }
body#eyelid #nav-03{ background:url("../images/nav.gif") -268px -33px no-repeat; }
body#reconstruction #nav-04  { background:url("../images/nav.gif") -370px -33px no-repeat; }
body#body #nav-05  { background:url("../images/nav.gif") -476px -33px no-repeat; }
body#skin #nav-06  { background:url("../images/nav.gif") -578px -33px no-repeat; }
body#contact #nav-07  { background:url("../images/nav.gif") -672px -33px no-repeat; }       */


/* Son of Suckerfish: Horizontal Sprite Nav

 * ------------------------------------------------------------------------- */

#nav li ul {
	position:absolute;
	left:-9999px;
	/* padding-right:1px;			 Fixes one px spacing for border-right in FF */
	}

#nav li ul li { 
	height:20px; 				/* Height of each drop down nav item */
	border:1px solid #000;
	border-top:none;
	background:url(../images/dropdown_bg.gif) repeat-x #46180e;	
	font-size:.92em;
	letter-spacing:1px;	
	}
	
#nav li ul li.nav-tall { 
	height:40px; 				/* Height of each drop down nav item */
	border:1px solid #000;
	border-top:none;
	background:url(../images/dropdown_bg_tall.gif) repeat-x #46180e;	
	font-size:.92em;
	letter-spacing:1px;
	}	

#nav li ul li a {
	width:100%;
	height:20px;				/* Height of each drop down nav item, should match above */
	line-height:20px;			/* Height of each drop down nav item again, should match above */
	cursor:pointer;
	}

#nav li ul li a span {
	display:block;
	padding-left:10px;
	height:20px;
	}


/* Drop down link styles */

#nav a:link, #nav a:visited, #nav a:hover, #nav a:active {
	font-size:1.0em;
	color:#fff;
	text-decoration:none;
	text-align:left;
	}

#nav li:hover ul, #nav li.sfHover ul	{ left: 0px; }


/* Hover styles for drop down items */

#nav-01 ul li a:hover, #nav-02 ul li a:hover, #nav-03 ul li a:hover, #nav-04 ul li a:hover, #nav-07 ul li a:hover  { 
	background:url(../images/dropdown_bg.gif) repeat-x 0px -20px;
	text-decoration:none;
	height:20px;
	}

/* width of drop down nav - choose width that allows items to display on one line */

#nav-01 ul, #nav-01 li { width:158px; }		
#nav-02 ul, #nav-02 li { width:225px; }
#nav-03 ul, #nav-03 li { width:200px; }
#nav-04 ul, #nav-04 li { width:225px; }
#nav-07 ul, #nav-07 li { width:135px; }

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}	
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }
#closeButton{ top: 5px; right: 5px; }

#lightbox img{ border: none; clear: both;} 
#overlay img{ border: none; }

#overlay{ background-image: url(../images/overlay.png); }

* html #overlay{
	background-color: #333;
	back\ground-color: transparent;
	background-image: url(blank.gif);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/overlay.png", sizingMethod="scale");   /* Path to overlay.png must be relative to HTML page, not the CSS file */
	}






/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;  
	z-index:0;
}

.sIFR-replaced {
	visibility: visible !important;
	z-index:0;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;

}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing:0px;
	}

#page_title {
	display:inline;
	font-family:"Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	letter-spacing:-1px;
	font-size:2.0em;
	color:#30332c;
	padding-bottom:20px;
	}