/*********************************************************
The Digital Knowledge Exchange

University of Teesside
Borough Road
Middlesbrough TS1 3BA
Tel:     +44 (0) 1642 38 42 87
Fax:     +44 (0) 1642 38 43 05
Email:   p.siedle@tees.ac.uk 
*************************************************************/
/**************************************/
/* positioning the main content area  */
/**************************************/
#c_right
{
	/* nudge the main content over so we can see the menu items */
	width: 480px; /*!!!!!!!! width of 3rd column */
	/*height: 350px;  /*can spec this if you want (so don't need <br />'s in the html)  or let content detemine the height, as now*/
	
	/* move it over the distance of 1st & 2nd column */
	/* bug in mac IE makes layout screw up if use this positioning method */
    /*position: relative;
	top:0;
	left: 264px;  /*!!!!!!!! less 1 pixel to alway for the border down the right, or the image covers it */
	
	border-left: white thin solid;
	border-width: 1px;  /* IE doesn't recognise 'thin', so put 1 pixel width */
	background-color: #5a675d;
	/* move it over the distance of 1st & 2nd column */
	margin-left:188px; /*!!!!!!!! less 1 pixel to allow for the border down the right, or the image covers it */
}

/**********************************/
/* positioning the menu elements  */
/**********************************/
#menu_left
{
    width: 65px; /*!!!!!!!! width of the 1st column */
    padding: 8px;
    padding-left: 0;
    padding-bottom: 0;
    border-right: solid thin white;
	border-width: 1px;  /* IE doesn't recognise 'thin', so put 1 pixel width */
}

#menu_right
{
    padding: 8px;
	width: 124px; /*!!!!!!!! width of 2nd column */
    position: absolute;
    top: 0ex;
    left: 80px;
}

#menu_bottom
{
    
	width: 189px; /*!!!!!!!! width of 1st & 2nd columns and so the length of it's top border line*/
	text-align: right;
	position: relative;
	top: 100px; /*!!!!!!!! position of the description after the menu items */
	border-top: white solid thin;
	border-width: 1px;  /* IE doesn't recognise 'thin', so put 1 pixel width */
}

/*!!!!!!!! now we need to nudge the text down and left away from the borders */
#menu_bottom_text
{
	position: relative;
	top: 8px;
	left: -12px;
}

/**********************************/
/* positioning the strip elements */
/**********************************/
.strip div
{
	position:relative;
	height: 60px; /*!!!!!!!! the height of each strip = image height + image padding to top & bottom*/
}

.strip div img
{
	/*!!!!!!!! image dimensions*/
	width:50px; 
	height:50px;
	padding: 5px;
	position: absolute;
}

.strip p
{
	padding-top: 20px; /*!!!!!!!! this value centres the text in the strip by moving it down */
	margin-left: 75px; /*!!!!!!!! distance away from the images, actually from top left of the strip! */
}

.strip span.right
{
	width:100px;
	position: absolute;
	left: 351px; /*!!!!!!!! how far over to move location text */
}