/* 
Title:     	October/March CSS
Author:    	Carlotta Bloum/Nico Schweizer 
Created:   	2008
	*/


	/*  General */
	
body {
	font-family: "Lucida Sans Unicode", "Lucida Console", "Lucida Grande", Verdana;
	font-size: 11px;
	line-height: 17px;
	color: #CCC;
	margin-top: 14px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 20px;
	background-color:#666; /*#E8E6E2;*/
	text-align: center;
	}

#wrapper {
	text-align: left;
	width: 780px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: auto;
	margin-left: auto;
	}
	

/*#intro {
	background-position: 40px 80px;
	position: absolute;
	visibility: visible;
	z-index: 10;
	height: 571px;
	width: 777px;
}
 */
p {
	margin-top: 0;
	margin-bottom: 0;
	text-align: left;
	width: 99%;	
}

.cheat {
	color: #666;
	font-size: 11px;
	line-height: 16px;
}

.image {
	border: 0;
}	

a {
	text-decoration: none;
	color: #CCC;
}

a:hover {
	text-decoration: none;
	color: #FFF; /* #00CC00; */
}

a:visited {
	text-decoration: none;
	color: #CCC;
}

/*.logo {
	float: left;
	height: 60px;
	width: 60px;
	margin-right: 15px;*/
}

#container {
	margin-bottom: 1px;
	width: 776px;
	float: left;
}

#containerfix {
	margin-bottom: 14px;
	width: 780px;
}

.containerwork {
	width: 776px;
	height: 580px;
}	

/* ----- Main Frames ------ */
	
#heading {
	float: left;
	margin-top: 2px;
	margin-bottom: 0px;
	width: 776px;
	padding: 0px;
}
#headingINDEX {
	float: left;
	margin-top: 2px;
	width: 776px;
}

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

.INDEX {
	width: 776px;
	height: 590px;
	text-decoration: none;
 }	

.SLIDESHOW {
	width: 776px;
	height: auto;
	text-decoration: none;
 }	
 
.RECENT {
	width: 776px;
	/*	height: 600px; */
	height: 590px;
}	

.GRID {
	width: 776px;
	/*	height: 600px; */
	height: 590px;/*580px*/
}	

.PROJECTS {
	width: 776px;
	height: 590px;
 }	

.INFO {
	width: 776px;
	/*	height: 600px; */
	height: 590px;
}	

/* ----- LINKS ------ */	


/*  RECENT a 

.RECENT a {
	text-decoration: none;
	color: #333;
}

.RECENT  a:hover {
	color: #FF3;
}

.RECENT  a:visited {
	color: #999999;
}

/*  INFO a 

.INFO a {
	text-decoration: none;
	color: #FF3;
}

.INFO  a:hover {
	color: #FF3;
}

/*  SLIDESHOW a 

.SLIDESHOW a {
	color: #FF0000; 
	border-bottom-style: solid;
	border-bottom-color: #333333;
	padding-bottom: 1px; 
}

.SLIDESHOW a:hover {
	background-color: #00CC00;
}
*/

/* ----- INDEX (large text styling) ------ */

.SmallText {
	font-size: 9px;
	line-height: 14px;
}

.SmallText a {
	font-size: 9px;
	line-height: 14px;
	color: #000;
} 

/*  ---------------------------- Styling ABC  ----------------------- */

.ABClist {
	float: right;
	width: 745px;
	line-height: 16px;
	font-size: 11px;
	height: 570px;
}

.ABC {
	float: left;
	color: #FFF;
	line-height: 16px;
	font-size: 11px;
	height: 570px;
	padding: 0px;
	width: 28px;
}

.ABCcategory {
	color: #999;
	font-size: 9px;
	letter-spacing: 1px;
	text-transform: uppercase;
}

/*  ---------------------------- Formatting ----------------------- */

.paragraphspace {
	margin-top: 0;
	margin-bottom: 15px;
	text-align: left;
	width: 99%;	
}

.paragraphhalfspace {
	margin-top: 0;
	margin-bottom: 8px;
	text-align: left;
	width: 99%;	
}

.paragraphrule {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
}

.paragraphruleABC {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: 999999; /*e8e6e2*/
	line-height: 16px;
}

.paragraphruleprojects {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
	padding-bottom: -1px;
}

.paragraphcaptionrule {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
	margin-top: 0px;
	margin-bottom: 6px;
}

.paragraphcheatrule {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #666;
	margin-top: 0px;
	margin-bottom: 6px;
}

.paragraphcheatruleSHOW {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	margin-top: 0px;
	margin-bottom: 6px;
	border-bottom-color: #666; /* #E8E6E2; */
}

div.spacer {
	clear: both;
}

/*  highlights  */

/*.highlight {
	color: #FF0;
	padding-bottom: 1px;
	font-weight: bold;
}	 */

/* --------- SLIDER NAVIGATION---------*/

.highlightBLACK {
	color: #333333;
}	

.highlightBLACKINDEX {
	color: #333333;
	font-weight: bold;
} 

/* -------- end SLIDER NAVIGATION----------*/

.highlight {
	color: #FF0; 
}	

.highlightWAGSCH {
	color: #FFF;
}	

.highlightABC {
	color: #FF0;
	float: left;
	font-weight: normal;
}		

.highlightGRAY {
	color: #999999;
}	

.highlightYELLOW {
	color: #666; /*FFFFFF*/
	background-color: #CCC;
	padding-top: 1px;
	padding-right: 2px;
	padding-bottom: 2px;
	padding-left: 3px;
}


/* ----- multiple column layouts (bio, information, links) ------ */
	
#describe {
	float: left;
	display: inline;
	width: 277px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 242px;
	margin-top: 0;
	margin-right: 15px;
	margin-bottom: 7px;
	margin-left: 0px;
}

* html #describe p {
	width: 99%;
}

/* ----- information pages ------ */	

#describeINDEX {
	float: left;
	display: inline;
	width: 504px;
	voice-family: "\"}\"";
	voice-family:inherit;
	margin-top: 0;
	margin-right: 0px;
	margin-left: 14px;
	background-color: #FFFFFF;
}

/* ----- information pages ------ */	

#describeINFO {
	float: left;
	display: inline;
	width: 518px;
	voice-family: "\"}\"";
	voice-family:inherit;
}

/* ----- focus pages ------ */	

#describeFOCUS {
	float: left;
	display: inline;
	width: 504px;
	voice-family: "\"}\"";
	voice-family:inherit;
	margin-top: 0;
	margin-right: 0px;
	margin-left: 0px;
}

#aboutworkINDEX {
	float: left;
	display: inline;
	voice-family: "\"}\"";
	voice-family:inherit;
	margin-top: 0;
	margin-right: 7px;
	margin-bottom: 14px;
	margin-left: 7px;
	padding-top: 15px;
	padding-right: 14px;
	padding-left: 14px;
	background-color: #FFFFFF;
}
#aboutworkINFO {
	float: left;
	display: inline;
	voice-family: "\"}\"";
	voice-family:inherit;
	margin-top: 0;
	margin-right: 7px;
	margin-bottom: 14px;
	margin-left: 7px;
	padding-top: 15px;
	padding-right: 14px;
	padding-left: 14px;
	background-color: #FFFFFF;
}

/* ----- RECENT projects image ------ */	

.columnFIFTHimage {
	float: left;
	display: inline;
	width: 155px;
	height: 193px;
}

.columnINDEXimage {
	float: left;
	display: inline;
	width: 155px;
	height: 193px;
}

.columnTHIRDimage {
	float: left;
	display: inline;
	width: 255px;
	height: 193px;
}

.columnQUARTERimage {
	float: left;
	display: inline;
	width: 169px;
	height: 193px;
	padding-left: 25px;
}

/* ----- multiple column layouts (bio, information, links) ------ */

#aboutwork {
	float: left;
	display: inline;
	width: 277px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width: 242px;
	margin-top: 0;
	margin-right: 7px;
	margin-bottom: 14px;
	margin-left: 7px;
	padding-top: 15px;
	padding-right: 14px;
	padding-left: 14px;
}

* html #aboutwork p {
	width: 99%;
}

	/*  ---------------------------- (javascript) ----------------------- */

#img-container	{ margin: 0; padding: 0; }
#img-container p	{
	width: 776px;
	margin: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 1px;
	padding-left: 0;
}

#mapcontainer a {
	color: #FF0000;
	text-decoration: none;
	padding-bottom: 1px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}

.fltleft {
	float: left;
	width: 760px;
	clear: both;
}

.fltright {
	float: right;
	width: auto;
}

#rightNav {
	float:right;
}

	/*  ---------------------------- (INDEX TESTS) ----------------------- */

#describeINDEXnew { /* ----- right column ------ */
	float: left;
	display: inline;
	width: 465px;
}

#describeINFOnew { /* ----- right column ------ */
	float: left;
	display: inline;
	width: 310px;
	margin-bottom: 7px;
	height: 550px;
}

#describeSLIDESHOWnew { /* ----- right column ------ */
	float: left;
	display: inline;
	width: 776px;
	margin-top: 15px;
	margin-bottom: 15px;
	height: 220px;
}

#mainContent {
	margin-right: 20px;
	margin-left: 20px;
	padding-right: 0px;
	padding-left: 0px;
	height: auto;
} 
#mainContentSHOW {
	height: 400px;
	background-color: #FFFFFF;
} 
#footer {
	text-align: left;
	height: 30px;
	float: left;
	width: 776px;
	margin-top: 5px;
} 
#footer p {
	padding-top: 1px;
	padding-right: 0;
	padding-bottom: 5px;
	padding-left: 0;
}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

.contentIndex {
	padding-bottom: 5px;
}
.captionINDEX {
	float: left;
	display: inline;
	padding-top: 10px;
	width: 145px;
	padding-bottom: 10px;
}



/*sidebar
#sidebar {
	background : transparent;
	padding: 5px 0px;
	margin: 5px 0px;
	width: 25%;
	float:right;
}
#sidebar ul, #sidebar li{
list-style-type: none;
margin: 2px;
padding:0px;
}
#sidebar li{
margin:0px;
padding: 2px 0px;
}
#sidebar div {
margin: 2px;
padding:0px;
}
#sidebar h2 {
margin: 5px 0px 0px;
padding: 4px 0px;
font-size:100%;
}
#sidebar li a {
border:none;
}
#sidebar li li {
border-bottom: 1pt solid #eee;
}
#sidebar li li li {
list-style:circle inside;
border:none;
margin-left:0px;
}
*/
/*searchform*/
#searchform label {
font-weight:bold;
}
#searchform input#s {
width:50%;
}
#searchform input.submit {
width:30%;
}

/*forms*/
input , textarea, select, option {
	font-family :'Lucida Sans', 'Trebuchet MS', 'Lucida Grande', 'Bitstream Sans Vera', 
		Verdana, Arial, Tahoma, Helvetica, Sans-Serif;
	font-size:100%;
	padding: 2px;
	background : #eee;
	color : #333333;
	border: 1px solid #ccc;
	margin: 2px;
}

.clear-both { clear: both; }