/* 
	The DCCC webstandards	
	Base layout by Timothy Crowe.
	Maintain and Re-stylize by Takeshi Tanabe.
	Ver. 2.2
	Last update 8/7/2007 
*/
 
@import url("reset.css");
@import url("type.css");
@import url("color.css");


/*---------------------------------	*/

/*		This style sheet is for Layout Only		*/

/*---------------------------------*/

body
{
	margin: 0;
	padding: 0 0 10px 0;
	text-align: center;
}

.content
{
	clear: both;
	width: 770px;
}

.container
{
	width: 770px;
	margin: 0 auto;
	text-align: left;
	overflow: hidden;
}

.header h1 { display: none; }

span.header
{
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0; left:0;
}

.header span span.outer
{
	width: 770px;
	height: 84px;
	margin: 0px;
	padding: 0;
	position: relative;
}

.header span,  .header a
{
	height: 90px;
	display: block;
}

.header span
{
	left: 0;
	width: 200px;
}

.footer
{
	position: relative;
	width: 770px;
	margin: 10px auto;
	clear: both;
	display: block;
	text-align: center;
	border: 1px #444 solid;
}

.footer p{margin: 10px;}

.footer a{border-bottom: 1px #aaa solid;}



/* ------------------------------------------------------------------*/
/* The interior of the page.  Where all the action is.  So sweet. 	*/
/* ------------------------------------------------------------------*/
body#interior { background: #fff url(/css/interior-column-back.jpg) center top repeat-y; }

body#interior .header, body#interior-nonav .header, body#obd .header
{
	width: 770px;
	height: 100px;
	/*background: url(/css/interior-header.jpg) no-repeat;*/
	background: #fff url(/css/innerNew.jpg) no-repeat;
	overflow: hidden;
}

/* *html .side-navigation,.side-navigation
*/
.side-navigation
{
	margin: 0;
	float: left;
	width: 200px;
}


.side-navigation ul
{
	padding: 0px;
	margin: 0 0 20px 0;
	list-style-type: none;
}

.side-navigation ul li { margin: 0 0 7px 0; padding-left:5px;}

.side-navigation a
{
	border-bottom: 1px solid #bbb;
	text-decoration: none;
}

.side-navigation img { border: 1px #003; }

.signup input.action
{
	border: 1px solid #000;
	padding: 3px;
	float: right;
	margin: 5px;
}


.signup fieldset
{
	border: 1px solid #bbb;
	padding: 7px;
}

.adverts-interior { text-align: center; }

.adverts-interior a
{
	border: 0;
	margin: 3px 0;
}

.adverts-interior img
{
	border: 0;
	margin: 3px 0;
}

.copy
{
	margin: 0 0 45px 40px;
	float: left;
	text-align: left;
	z-index: 10;
	width: 500px;
}

.copy-nonav
{
	margin: 0 0 45px 10px;
	float: left;
	text-align: left;
	z-index: 10;
	width: 740px;
}

.copy blockquote, .copy-nonav blockquote
{
	padding: 0 0 0 50px;
	border-left: 1px solid #bbb;
}

.copy img, .copy-nonav img { border: 0; }
.copy-nonav p span.pullquote{
	border-top:5px double #cccc99;
	border-bottom:5px double #cccc99;
	float:right;
	width:140px;
	display:block;
	margin:10px;
	padding:10px;
}
table th{ text-align: center; }
table td{ padding: 5px; }

body#home .crumbs { display: none; }

.crumbs
{
	padding: 5px;
	text-align: right;
	margin: 10px;
}

/* ------------------------------------------------------------------*/

/* Content styling for the homepage...  This only applies to the 
	first page on the site. This accomodates the differently 
	colored background and different background image */

/* ------------------------------------------------------------------*/
body#home { background: #0B0B0B url(/css/home-grade-back.jpg) center top repeat-y; }

body#home .header
{
	width: 770px;
	height: 100px;
	background: url(/css/headerwithNewLogo.jpg) no-repeat;
}

.home-content
{
	width: 770px;
	position: relative;
	/*background: url(/css/profile/homepage.jpg) left top no-repeat;*/
	background: url(/css/bar2.gif) left top repeat-x;
	margin-top: 0;
	overflow: hidden;
}

div.left-column
{	
	float: left;
	width: 510px;
	margin: 0;
	margin-bottom: 0px;
	padding-right: 0;
	padding-bottom: 0px;
	padding-left: 0;
}
img.homepageprofile{position: relative;top:20px;border:0;padding: 0; margin: 0;display:block;float:left;}

p.applynow
{   
	clear:left;position:relative;top:18px;
	z-index: 0;
	margin: 0px 0 10px 0;
	padding: 5px 10px 0 10px;
	height:25px;
	background:url(/css/applyBack.gif) top left repeat;
	}
p.applynow a {margin: 0;}

div.profile-link a
{	
	position: absolute;
	height: 310px;
	width: 500px;
}

div.profile-link a span { display: none; }

div.cancellation
{
	display: block;
	border: #900 solid 2px;
	padding: 20px 10px;
	margin: 15px 0 0 0;
}

div.advisory
{
	display: block;
	border: #F4B201 solid 2px;
	padding: 20px 10px;
	margin: 15px 0 0 0;
}

div.below-advert
{
	width: 510px;
	display: block;
}

div.below-advert-box
{
	padding: 5px;
	position: relative;
	width: 240px;
	float: left;
}

div.right-column
{
	width: 260px;	
	float: left;
	margin:0px 0 0 0px;
	padding:0px;
}

div.up2min{
	position:relative;
	float:left;
	width:260px;
	top:20px;
	background:url(/css/gradientback.gif) top left repeat;
	padding:40px  0 0 0;
}
div.up-to-minute
{
	margin: 10px 0 0px 0;
	background: transparent;
	padding: 0px 0 0 0px;
	height: 220px;
	overflow: auto;
}

div.up-to-minute h2
{
	margin: 0;
	padding: 0;
	border-bottom: 2px solid;
}

div.release { padding: 0 0 10px 0; }
div.up2min h2
{
	margin: 0;
	padding: 5px 5px 5px 0;
	border-bottom: 2px solid;
}
div.up-to-minute h3
{
 	margin: 10px 0 5px 0;
	padding: 0;
}

div.up-to-minute p
{
	margin: 0;
	padding: 0;
    line-height:1.4em;
	font-size: 11px;
	color: #fff;
}

div.adverts-home
{
	text-align: left;
	width: 510px;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}

div.adverts-home a {padding: 0;}

div.adverts-home img {border: 0;}

div.calendar
{
	padding: 5px;
	margin: 0 0 50px 0;
	height: 250px;
	overflow: auto;
}

div.calendar ul, div.calendar li
{
	margin: 0 0 10px 0;
	list-style: none;
}

div.calendar h3 {margin: 0;}

div.whatsnew h2 { margin: 0; padding: 5px 5px 5px 0;}



/* ------------------------------------------------------------------*/

/* This does the drop down menus.  This look uses altered versions of
Sliding doors and suckerfish dropdowns from "A list apart."
---->http://www.alistapart.com/articles/dropdowns/
---->http://www.htmldog.com/articles/suckerfish/dropdowns/ */

/* ------------------------------------------------------------------*/
.main-menu {z-index: 200; }

.main-menu ul
{
	padding: 5px 0 0 0px;
	margin: 0;
	list-style: none;
	border: 1px #999 solid;
	height: 35px;
}

.main-menu li.main-option
{
	z-index: 10;
	width:70px;
	float: left;
	position: relative;
}

.main-menu li.sub-option, .main-menu ul.sub-option-list
{
	z-index: 10;
	float: left;
	width: 150px;
}

.main-menu li ul.sub-option-list
{
	display: none;
	position: absolute;
	top: 33px;
	left: 0;
}

.main-menu li#about ul.sub-option-list { left: -75px; }

.main-menu li>ul
{
	top: auto;
	left: auto;
}

.main-menu li:hover ul, .main-menu li.over ul
{
	display: block;
	z-index: 200;
}

.main-menu ul.sub-option-list
{
	text-align: left;
	border-top: 1px solid #999;
	border-left: 1px solid #999;
	border-right: 1px solid #999;
}

.main-menu li.sub-option
{
	border-bottom: 1px solid #999;
}

.main-menu .sub-option-list a {display: block; width: 142px; padding: 5px 4px 5px 4px;}

.main-menu .sub-option-list a:hover
{
	background: #666;
	color: #fff;
}

.main-menu li.main-option {padding: 7px 15px;}

/* 
temporarily replaced with whats above when we secretly deleted an entire tab from the drop downs on sep 15
*/

.main-menu li.main-option
{
	padding: 5px 5px 10px 10px;
	margin: 0 5px;
	text-align: center;
}
.main-menu li#academics,.main-menu li#faculty,.main-menu li#locations,.main-menu #about{padding: 12px 5px 10px 10px;} 
.main-menu a.main-option{margin: 0;}

/* site search */
.sitesearch
{
	position: absolute;
	z-index: 100;
	/*originally, top:10px*/
	top: 10px;
	left: 65%;
}

.sitesearch form { float: left; }

.sitesearch input.search{ font-size: 11px; }

.sitesearch input.action
{
	margin: 0;
	border: 1px solid #000;
	padding: 3px 5px 3px 5px;
}



/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */

/* Uberforms... the next generation in semantic, usable forms.
	I have reworked superforms to create a more useful,
	flexible and appealing form style.  In addition, the 
	thing that makes them uber, form validation has been 
	added to make the forms more useful to everyone.
   Get the skinny on how to use uberforms styles and validation
	visit http://faculty.dccc.edu/~timothy/uberforms/
   To get the lowdown on uberforms predecessor, superforms,
	visit http://faculty.dccc.edu/~timothy/superforms/	*/

/* ------------------------------------------------------------ */
.uberform form { display: block; }

.uberform fieldset
{
	margin: 10px 0;
	border: 1px solid #ccc;
	background: #efefef;
	display: block;
	padding: 5px;
}


.uberform label
{
	float: left;
	width: 150px;
	border-bottom: 1px #ccc solid;
	margin: 0 3px;
}

.uberform textarea
{
	margin: 0 10px 10px 10px;
	width: 90%;
	height: 7em;
}

.uberform ul
{
	list-style: none;
	margin: 0;
	padding: 0;
}

.uberform li
{
	margin: .4em 0;
	padding: 5px 0;
	clear: left;
}

.uberform input.submit{margin: .5em;}

.uberform .required { border: #900 1px solid; }

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */

/* Superforms is a set of styles using the combination of 
	semantic markup and usability principles to help make
	form generation quick and easy.  To get the lowdown 
	on how superforms works go to...
	http://faculty.dccc.edu/~timothy/superforms/		*/

/* ------------------------------------------------------------ */
.superforms form { font-size: 11px; }

.superforms fieldset
{
	display: block;
	margin: 15px 0;
	width: 450px;
	border: 1px solid #ddd;
	padding: 10px;
}

.superforms legend {padding: 0 10px;}

.superforms label
{
	border-bottom: 1px dotted #ddd;
	width: 225px;
	clear: both;
	float: left;
	margin: 4px;
}

.superforms textarea
{
	display: block;
	width: 375px;
	margin: 4px 0 4px 25px;
	height: 125px;
	clear: both;
	border: solid 1px #ddd;
}

.superforms input
{
	margin: 4px;
	border: solid 1px #ddd;
	vertical-align: bottom;
	float: left;
	clear: right;
}

.superforms select
{
	margin: 4px;
	border: solid 1px #ddd;
}

.panel p
{
	display: block;
	margin: 2px 5px;
	border-bottom: 1px dotted #ddd;
	clear: left;
}

.superforms .panel label
{
	margin: 0 0 0 25px;
	border: 0;
}

.superforms .panel input
{
	vertical-align: middle;
	border: 0;
}

/* This will make the submit button larger and more visible */
.superforms input.action
{
	float: right;
	clear: left;
	border: solid 1px #ddd;
	padding: 10px 15px;
	margin: 5px;
}

.superforms input.action:hover { border: solid 1px #bbb; }

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */
/* its revenge of yellowbox */
/* ------------------------------------------------------------ */
.yellowbox .announcement
{
	width: 425px;
	border: 1px solid #aaa;
	margin: 10px 0 10px 25px;
}

.yellowbox .information
{
	padding: 5px;
	border-bottom: 1px solid #aaa;
}

.yellowbox .description { padding: 5px; }
.yellowbox .information h3 { display: inline; }

.yellowbox .action
{
	border: solid 1px #ddd;
	padding: 5px 10px;
	margin: 5px;
}

.yellowbox .actions
{
	text-align: right;
	width: 425px;
}

.yellowbox .actions form { display: inline; }
.yellowbox td { padding: 6px; }

.yellowbox table
{
	border: 1px solid #aaa;
	padding: 7px;
}


/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */
/* table class info */
/* ------------------------------------------------------------ */
table.info { padding: 3px; }

table.info th, table.info td
{
	border-left: 1px #eee solid;
	border-right: 1px #eee solid;
}

table.info caption
{
	text-align: left;
	padding: 10px;
	margin: 10px 0 3px 0;
}

table.info thead tr { vertical-align: top; }

table.info td, th { padding: 3px; }

div.big-link
{
	display: block;
	text-align: center;
	border: 1px #ccc solid;
	margin: 3px 0;
	padding: 5px;
}

a.big-link
{
	display: block;
	text-align: center;
	border: 1px #ccc solid;
	margin: 3px 0;
	padding: 5px;
}

a:hover.big-link {border: 1px #003 solid;}

.section-menu
{
	border: #003 1px solid;
	background: #eee;
	padding: 5px 10px;
	margin: 10px;
	float: right;
}

.section-menu ul
{
	list-style-type: none;
	padding: 0;
}

.section-menu li { 
	margin: 10px 0; 
	list-style-type:none;
}

/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */

/* styles for the linkPreview JS
	http://particletree.com/features/preview-your-links */

/* ------------------------------------------------------------ */
.amazon
{
	width: 20px;
	padding: 3px 20px 0 0;
	background: url(linkpreview/amazon.gif) no-repeat right;
}

.pdf
{
	width: 20px;
	padding: 0 15px 0 0;
	background: url(linkpreview/pdf.png) no-repeat right;
}

.zip
{
	width: 20px;
	padding: 0 23px 0 0;
	background: url(linkpreview/zip.png) no-repeat right;
}

.doc
{
	width: 20px;
	padding: 0 20px 0 0;
	background: url(linkpreview/doc.png) no-repeat right;
}

.ppt
{
	width: 20px;
	padding: 0 20px 0 0;
	background: url(linkpreview/ppt.png) no-repeat right;
}

.xls
{
	width: 20px;
	padding: 0 20px 0 0;
	background: url(linkpreview/xls.png) no-repeat right;
}

table.striper
{
	margin: 5px 0;
	position: relative;
	width: 100%;
}

table.striper caption {border-bottom: solid 1px #ddd; }

table.striper td, table.striper th
{
	padding: 3px;
	vertical-align: top;
}

table.striper tr.odd { background: #eee; }

/*--------------------------------------*/
/*		Style for Drop Shadow Effect	*/
/*--------------------------------------*/
.img-shadow {
  float:left;
  background: url(./images/shadowAlpha.png) no-repeat bottom right !important;
  background: url(./images/shadow.gif) no-repeat bottom right;
  margin: 10px 0 0 10px !important;
  margin: 10px 0 0 5px;
  }

.img-shadow img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;
  }


div.rightPic img { float: right; }
.multiList li { list-style: none; }
.box
{
	float: left;
	padding: 5px;
}

.clear { clear: both; }

table.small
{ 
	border: 1px solid #bbb;
	border-collapse: collapse;
}

table.small thead { background: #bbf; }
table.small tbody { background: #ddd; }

table.small td, table.small th
{
	text-align: center;
	padding: 2px;
}
/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */

/* 							Next Generation of Big Link										  */

/* ------------------------------------------------------------ */
.hoverLinks ul {
        list-style-type: none;
        width: 400px;
} 

.hoverLinks ul li {
        border: 1px dotted #999;
        border-width: 1px 0;
        margin: 5px 0;
}

.hoverLinks ul li a { 
        display: block;
        padding: 5px;
        text-decoration: none;
        border: 0;
}

 * html .hoverLinks ul li a {  /* make hover effect work in IE */
	width: 400px;
}


.hoverLinks a em { display: block; }

.hoverLinks a span {
     	line-height: 150%;
}
/*------------------------------------
			Table for DL Schedule
-------------------------------------*/
table.schedule td{
	border:1px solid #ddd;
	text-align: center;
}

/*------------------------------------
-------------------------------------
					Grid Design
-------------------------------------*/
 div.first-three, div.second-three, div.third-three {
 		width: 250px; 
 		padding: 0 0 0 5px; 
 		float: left;
}