/* - - - - - - - - - - - - - - - - - - - - -
* Summary: 			CSS file for YPCFA
* URL: 				www.ypcfa.net
* Notes: 			---- 
* Created: 			??/??/05
* Last Updated: 	24/08/05
* Site redesign completed: Fri 7th Oct 2005
- - - - - - - - - - - - - - - - - - - - - */ 

/***************  This is the positioning stylesheet and contains positioning info only  *************/
/***************  This sheet MUST be linked to as the peristent stylesheet. All colours are set in bright.css & pale.css ***/


/* ----- CSS ----- */


/* ----- LISTS ----- */

ul {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}


/* ----- IDS ----- */



#TextArea ul.vertList{
	list-style: square;
	padding: 0.5em;
	margin-left: 2em;
}

#TextArea ul.vertList li{
	padding: 0.2em;
	border: 0px solid;
	margin:  0;
}

#logos {
	clear:both;
	/*margin-left: 2em;*/
	border:0px solid;
	text-align: center;
	margin-top: 2em;
}

#disclaimer {
	margin: 10%;
	background: White;
}


/********* divs used on links page to replace tables ********/

.links div a img{
	float:right;
}
.links div {
	clear: right;
	border: 2px solid white;
	margin: 1em 1em 2em;
	width: 75%;
	padding: 0.75em;
	min-height: 8em;
/*  ie hack #2 IE can't understand min-height and treats height as min-height. 
only IE reads indentifiers with underscores so in effect IE recieves a min-height value  
and no specific height is set for browsers that can understand the standards */	
	_height: 8em;  
}


/********* link + info styling *********/

.scroller{
	overflow:auto;
	height: 150px;
	position: relative;
	width: 500px;
}
.scroller p, .scroller img{
	float: left;
	border: 1px solid red;
	/*display: inline;*/
	max-width: 50%;
}

ul.teamimages {
	border: 11px solid red;
	background: yellow;
}

ul.teamimages li img{
	display: block;
	border: 5px solid blue;
}



/********** image boundary:- must place somehwere more apt at some point ********/

div.imageBoundary{
	border: 0px solid;	
	padding: 0.5em 0;
	margin: 1em auto;
	width: 50%;
}
div.widerimageBoundary{
  margin: 1em auto;
	width: 75%;
}

div.imageBoundary p{
	padding: 0;
	margin:auto 0;
}



/*         css for the popup window     */

#psuedo{
	
	background-color: #97ba48;
	border: 0px solid darkgreen;
	float: right;
	width: 400px;
	overflow:auto;
	font-size: 0.85em;
}

#psuedo h2{
	
	/*background:  url("images/quote_tl.gif") no-repeat top left;*/
	background-color: #7a9340;
	padding-top: 1.5em;
	color: #fff;
	
}

#psuedo p{
	padding: .75em;
}




/*  each link is given an image as background*/

a.toggleList#project {
	background: url("images/quotes%20photos/project.jpg") 0 180px ;					 
}

a.toggleList#collab {
	background: url("images/quotes%20photos/collab.jpg") 0px 180px;					 
}
a.toggleList#exchange {
	background: url("images/quotes%20photos/exchange.jpg")-1px 176px ;					 
}
a.toggleList#look {
	background: url("images/quotes%20photos/look.jpg") 1px 180px;					 
}
a.toggleList#identify {
	background: url("images/quotes%20photos/identify.jpg") 0px 179px ;					 
}


/* the hover states are set here*/
a:hover.toggleList#project {
	background: url("images/quotes%20photos/project.jpg") -1px 0;					 
}
a:hover.toggleList#collab {
	background: url("images/quotes%20photos/collab.jpg") ;					 
}
a:hover.toggleList#exchange {
	background: url("images/quotes%20photos/exchange.jpg") 0px -4px ;					 
}
a:hover.toggleList#look {
	background: url("images/quotes%20photos/look.jpg")  ;					 
}
a:hover.toggleList#identify {
	background: url("images/quotes%20photos/identify.jpg") -1px 0px;					 
}



a.toggleList b{
		display: block;
		color: #fff;
		position: relative;
		top: 5em;
		font-weight: normal;
		text-decoration: none;
}
a:hover.toggleList b {
		text-decoration: underline;		
}


/************* hack to fix the peekaboo menu in IE */

* html .floatBox{
 height: 1%;
}





/****************  third attempt at resource list layout ***************/

.resourceGrid {
  display:table;
  padding:0;
  margin:0;
  font-family: arial, helvetica, sans-serif;
  white-space:nowrap;
  list-style-type:none;
}

* html ul.resourceGrid  {
  display:inline-block;    /* for IE only */
  width:1px;               /* IE will expand 1px width to fit menu width */
  padding:0 2px;           /* fix bug in IE to get border spacing correct */
}  

.resourceGrid li {
  display:table-cell;      /* ignored by IE */
	padding: 0.25em 1px;
	width: 75%;
	border: 0px solid #e81919;
	/*margin: 0.5em;*/
}
* html .resourceGrid li {
  display:inline;          /* for IE only */
}

.resourceGrid a {
  display:block;
  padding:0.2em 0; 
  background:transparent; 
  color:#000; 
  text-decoration:none;
  border: 1px solid #000;
	width: 100px;
}
.resourceGrid a.word {
  background: url("images/wordBig.png")center 1px no-repeat ;
	
}
.resourceGrid a.pdf {
  background: url("images/pdfBig.png")center 1px no-repeat ;
}
* html .resourceGrid a {
  display:inline-block;    /* for IE only */ 
  margin:0 -2px;           /* to correct an IE bug that doubles the border width */  
}

.resourceGrid a span{
  position: relative;
	left: -5000px;
}



.resourceGrid {
	padding:0;
	margin:0;
	color:#fff;
	font-family: arial, helvetica, sans-serif;
	white-space:nowrap;
	list-style-type:none;
}
.resourceGrid li {display:inline;}
.resourceGrid li a {
	padding:0.2em 1em;
	background:#fc6;
	color:#000;
	text-decoration:none;
	float:left;
	border:1px solid #000;
}
.resourceGrid li a:hover {
	background:#08c;
	color:#fff;
}