/* Copyright 2007 (c) Tim Hull & Matthew Ainge */
	
	/* The sections in this css: */

	/* GENERIC CLASSES used throughout */
	/* STANDARD COLOURS */	
	/* STANDARD HTML markup */	
	/* BANNER CONFIGURATION */
	/* BANNER ADVERT */
	/* NAVIGATION BARS */
	/* SIDE FLOATY MENUS */
	/* IMAGE LINK STYLES FOR LEFTMENU AND MAIN ARTICLE SECTIONS */
	/* MAIN ARTICLE SECTION */
	/* ARTICLE DIVS */
	/* NEWS HEADINGS */
	/* GALLERY */
	/* COMMENTS */
	/* SIBLING NAVIGATION */
	/* EVENTS DATA */
	/* FOOTERS */
	/* FORUM SPECIFIC */
	/* GOLEM NO NOT WOT DIS LOT DOES*/	
	/* EXPERIMENTAL */
	/* ADMIN PAGES STUFF */	
	/* ADMIN TABS */
	/* TOURNAMENT TREE LAYOUT */
	/* AT LAN PAGE */
	
/* ------------------------------------------------------- */	
/* GENERIC CLASSES used throughout */
	.nb
		{
		white-space: nowrap;
		}
	h3.admin
		{
		float:left;
		}
	hr
		{
		border-color:#0c2020;
		border-style:solid;
		background-color:#0c2020;
		height:4px;
		width:50%;
		margin-top:20px;
		}

/* STANDARD COLOURS */
	/* TEXT COLOUR */
	body, .bannerad, .maintext, .adminTabs table, a.adminPages, #bigTeamSummary h1, #bigTeamSummary h2, .tournamentPlayer,
	.BlogText
		{
		color:#c2cbd2;
		}
	
	/*Brighter text*/
	.tournamentPlayerContainerNew .tournamentPlayer
		{
		color:#ffffff;
		}
	
	/* NAV BAR COLOURS */
	div#topLinkContent, div#breadcrumbs, .tournamentPlayer, .scrollArrowLeft, .scrollArrowRight
		{
		background-color:#164179;
		border-color:#2d86ff;
		}
		
	/* BLOCK COLOUR 1 */
	.bannerad, .maintext h1, .maintext h2, .maintext h3, .maintext h4, .maintext h5, .maintext h6, 
	.maintext h7, div.newsHeader, div.navigation, div.upComingEvent, div.previousEvent, div.UserNameList,
	div#countdown table, .ExtraData table td, .Overview-Team, .Paid, .Unpaid, .Spectators
		{
		background-color:#0c1820;
		border-color:#000000;
		}
		
	/* BLOCK COLOUR 2 */
	div.newsHeader h3, div.article_info_left, #bigTeamSummary
		{
		background-color:#184469;
		}
	div.newsHeader img, .tournamentPlayerContainerNew .tournamentPlayer
		{
		border-color:#184469;
		background-color:#184469;
		}
	
	/* BLOCK COLOUR 3 */
	/* Borrowed from forabg */
	/* This is only slightly darker than BLOCK COLOUR 1 */
	.CommentUser, .CommentBody
		{		
		background-color:#031019;
		}
	.CommentUser
		{
		color:#4b5462;		
		}
	
		
	/* BLOCK COLOUR 4 (darker */
	.unloved, div.article_info_left a, .adminPages, div.siblingnavigation, div.gallery_image, div.detailsTable div.label, 
	.detailsTable table, div.adminTabPages, #UserDetails, #UserClans, #UserGames, .tournamentRound td
		{
		background-color:#031019;
		border-color:#0c1820;
		}

		
/* STANDARD HTML markup */
	* html body
		{
		height:100%;
		}
	body
		{
		margin:0px;
		border-width:0px;
		padding:5px;
		background-color:#0e0313;
		font-family:arial, sans-serif;
		font-size:.8em;
		background-image:url("../images/veinbg.gif");
		/* height:95%;  this is to extend the vein bg all the way regardless of content length */
		background-repeat:repeat-y;
		background-position:top left;
		}
	h1, h2, h3, h4, h5, h6, h7
		{
		margin-top:0px;
		margin-bottom:15px;
		}

	input, select, textarea
		{
		font-family: Verdana, Helvetica, Arial, sans-serif;
		font-weight:normal;
		background-image:none;
		background-color: #1b242f;
		border-color: #58626b;
		border-style:double;
		border-width:3px;
		color: #9ba1a7;
		padding:2px;
		}

	input:hover , select:hover , textarea:hover 
		{
		border-color: #497cd3;
		background-color:#242e3b;
		color:#54ccff;
		}

	input:focus , select:focus , textarea:focus 
		{
		border-color: #639dff;
		background-color:#213454;
		color: #ffffff;
		/*background-image:none;*/
		}
	input, select
		{	
		font-size:0.9em;	
		}
	textarea
		{
		font-size:0.8em;
		}		
	ul
		{
		list-style-type:square;
		list-style-image:url("../images/bullet.gif");
		}
	input:hover, select:hover, textarea:hover
		{
		/*background-color:#006B17;*/
		}
		
/* ------------------------------------------------------------------------------------*/
/* BANNER CONFIGURATION */
	/* THE SWITCH  */
	/* The overheating switch; i.e., the lan record, with (log)on/off button */
		/* 'switch' is an image, providing backdrop to the 'switchdisplay' div */
		#switch
			{
			position:absolute;
			z-index:8;
			top:21px;
			right:70px;
			}
		/* This is the actual div containing the on/off button and LAN LED array */
		div#switchdisplay
			{
			font-size:3px;
			color:#ffffff;
			height:24px;
			width:122px;
			background-color:transparent;
			position:absolute;
			z-index:11;
			top:36px;
			right:102px;
			}
		/* Designed to show a red button on the switch when the user is not authenticated with the site */
		#unregistered
			{
			margin-top:4px;
			margin-left:7px;
			float:left;
			background-color:#ff0000;
			border:2px solid #BB0000;
			height:5px;
			width:5px;
			color:#ff0000;
			}
		/* Designed to show a green button on the switch when the user is logged in */
		#registered
			{
			margin-top:4px;
			margin-left:7px;
			float:left;
			background-color:#00ff00;
			border:2px solid #00BB00;
			height:5px;
			width:5px;
			color:#00ff00;
			}
		/* So that a good number of LEDs can be injected onto the switch display, */
		/* lanledarray is a specificly sized box for these LEDs to float about on. */
		div#lanledarray
			{
			float:right;
			height:24px;
			width:80px;
			}
		/* Each of the LEDs is an image of varying styles, depending on the events attended. */			
		div#lanledarray img
			{
			height:5px;
			width:5px;
			padding:0px;
			margin:1px;
			border-style:none;
			float:left;
			}	
	/* Switch Complete */			
	
	/* The 'title' div contains the lettering of LLAMALAN */		
	div#title
		{
		height:116px;
		padding:0px 0px 0px 0px;
		overflow:hidden;
		position:absolute;
		top:67px;
		left:200px;
		z-index:3;
		/*background-image:url("../images/banner-bg.gif");
		background-position:top left;
		background-repeat:repeat-x;*/
		}
	/* img.title class removes any spacing - important for the letters of LLAMALAN */	
	img.title
		{
		padding:0px;
		border:0px;
		margin:0px;
		}
	/* Banner div does not hold the other elements of the banner, it provides the backdrop */
	/* The Banner div also positions the rest of the screen elements properly as it is not absolutely positioned*/
	div#banner
		{
		position:relative;
		z-index:1;
		height:183px;
		margin:0px 40px 0px 60px;
		top:0px;
		left:0px;
		background-image:url("../images/banner-bg.gif");
		background-position:top left;
		background-repeat:repeat-x;
		vertical-align:middle;
		}		
	/* Llama Shadow Head */
	img#bannerleft
		{
		position:absolute;
		top:5px;
		left:5px;
		z-index:4;
		padding:0px;
		margin:0px;
		border:0px;
		}
	/* Llama Shadow Butt */	
	img#bannerright
		{
		position:absolute;
		top:4px;
		right:5px;
		z-index:4;
		padding:0px;
		margin:0px;
		border:0px;
		}
	/* Big llamalan logo: above the mouth */	
	img#bannerllama
		{
		position:absolute;
		top:5px;
		left:81px;
		z-index:10;
		padding:0px;
		margin:0px;
		border:0px;
		}
	/* Big llamalan logo: the mouth.  It is split so the user can click Home, */
	/* otherwise image would overlay most of the 'home' link */
	img#bannerllama2
		{
		position:absolute;
		top:203px;
		left:81px;
		z-index:10;
		padding:0px;
		margin:0px;
		border:0px;
		}
	/* The currenlanpic image is a foregleam of the event to come */
	/* It sits on the far right of the banner backdrop */
	/* And is slightly transparent */
	img#currentlanpic
		{
		position:absolute;
		z-index:2;
		top:66px;
		right:45px;
		height:117px;
		filter: alpha(opacity=75);
		opacity:0.75;
		-moz-opacity: 0.75;		
		}
	/* Countdown ticks away overlaid on the currentlanpic image */
	
	div#countdown
		{
		position:absolute;
		z-index:3;
		top:160px;
		right:60px;
		filter: alpha(opacity=75);
		opacity:0.75;
		-moz-opacity: 0.75;		
		}
	div#countdown table
		{
		/*border-color:#999999;*/
		border-width:1px;
		border-style:solid;
		font-size:0.8em;
		font-weight:bold;
		color:#8ea8bf;
		}
/* ------------------------------------------------------------------------------------*/
/* BANNER ADVERT */
	/* When an event is coming up, the event's banner appears at the top of key pages */
	.bannerad
		{
		text-align:center;
		overflow:hidden;
		font-family:arial, helvetica, "sans-serif";
		font-size:1.8em;
		font-weight:900;
		/*margin:0px 182px 0px 250px;*/
		margin:0px 139px 15px 190px;
		border-width:8px 15px;
		border-style:solid;
		position:relative;
		background-image:url("../images/bannerad-bg.gif");
		background-position:center -70px;
		/*background-repeat:no-repeat;		*/
		z-index:1;
		white-space:nowrap;
		}
	.bannerad img
		{
		vertical-align:middle;
		border:3px solid #8aa2bb;
		}
	.bannerad a:link img, .bannerad a:visited img
		{
		filter: alpha(opacity=80);
		opacity:0.8;
		-moz-opacity: 0.8;
		}
	 .bannerad a:hover img
		{
		filter: alpha(opacity=90);
		opacity:.9;
		-moz-opacity: .9;
		}
	.bannerad a:active img
		{
		filter: alpha(opacity=100);
		opacity:1.0;
		-moz-opacity: 1.0;
		}		


/* ------------------------------------------------------------------------------------*/
/* NAVIGATION BARS */
	/* The toplinks division contains the main section link division, not the links themselves */
	div#toplinks, div.toplinks
		{
		padding:0px;
		border-width:0px;
		position:relative;
		top:0px;
		overflow:hidden;
		z-index:8;
		}
	div.navbarleft
		{
		z-index:9;
		width:67px;
		height:40px;
		border:0px;
		padding:0px;
		position:absolute;
		bottom:2px;
		background-image:url("../images/navbar-left.gif");
		background-repeat:no-repeat;
		background-position:bottom right;
		}
	div.navbarright
		{
		z-index:9;
		width:49px;
		height:40px;
		border:0px;
		padding:0px;
		position:absolute;
		bottom:2px;
		right:0px;
		background-image:url("../images/navbar-right.gif");
		background-repeat:no-repeat;
		background-position:bottom left;
		}		
	/* The div inside the toplinks division holds links to each main section */		
	#topLinkContent
		{
		z-index:5;
		position:relative;
		letter-spacing:-2px;
		text-transform:uppercase;
		font-weight:900;
		font-family:"Trebuchet MS", "times new roman", roman, serif;
		vertical-align:baseline;
		font-size:18px;
		padding:8px 2px 3px 123px;
		/*margin:0px;*/
		
		border-width:1px 0px 0px 0px;
		border-style:solid;
		margin:0px 49px 2px 67px;		
		}
	#topLinkContent a
		{
		margin-right:10px;
		text-decoration:none;
		color:#8bb8f3;
		}
	#topLinkContent a:hover
		{
		text-decoration:none;
		color:#aacfff;
		}
	#topLinkContent a:active
		{
		text-decoration:none;
		color:#fef8ff;
		background-color:#9a219b;
		}
		
	/* The breadcrumbs division holds the breadcrumbscontent division*/
	div#breadcrumbs
		{
		border-style:solid;
		border-width:0px 1px 1px 1px;
		background-image:url("../images/linkbarshadow-bg.gif");
		background-position:top left;
		background-repeat:repeat-x;
		/*margin:0px 49px 2px 67px;*/
		margin:0px 5px 2px 5px;
		padding:1px 0px 0px 0px;
		color:#539af6;
		position:relative;
		overflow:hidden;
		}
	#breadcrumbs a
		{
		color:#539af6;
		text-decoration:none;
		}
	#breadcrumbs a:hover
		{
		color:#aacfff;
		}
	#breadcrumbs a:active
		{
		color:#fef8ff;
		background-color:#9a219b;
		}
	
	/* breadcrumbsContent holds the text and links, spacing them properly from the edge of the backdrop */
	div#breadcrumbsContent
		{
		padding:0px 2px 0px 185px;
		}		

/* ------------------------------------------------------------------------------------*/
/* SIDE FLOATY MENUS */
	/* The leftmenu class floats all the menu windows off to the left of the main articles */
	div.leftmenu
		{
		margin:1px 3px 3px 0px;
		position:absolute;
		top:0px;
		left:5px;
		}
		
	/* Nasty IE ignore overflow:auto if the same element hasn't got a fixed width, regardless */
	/* of its parent's attributes.  So, fix the width of both menu containers and window1s here */
	/* window1 is 2px less than the containing left/rightmenu */
	
	div.leftmenu
		{
		width:180px;
		}
	div.leftmenu .window1
		{
		width:178px;
		}
	div.rightmenu
		{
		width:130px;
		}
	div.rightmenu .window1
		{
		width:128px;
		background-position:-14px 0px;
		}		
	div.rightmenu
		{
		margin:1px 0px 3px 3px;
		position:absolute;
		top:0px;
		right:5px;
		}
	h6.data img, h6.data a img, .window1text img, .window1text a img
		{
		border:1px solid green;
		max-width:90%;
		width:expression(this.width<95 ? "auto" : "95px");
		/* IE ONLY.  This reduces images to a set width if it is longer.  */
		/* NOTE: if the condition is <=, IE will take up 100% CPU and crash. */
		/*       this is cos it loops.  It would set the width to the max and that would meet the */
		/* 	   requirements to set its width to 'auto'. */
		}
		
	/* DAMN FREAKIN BLEEDIN INTERNET EXCRUCIATING EGG-SPLAT-WORTHY PIECE OF..!!!!! */
	* html div.rightmenu
		{
		right:9px;
		}

	/* Windowcontent holds each window and each window's neon tube */
	div.windowcontent
		{
		position: relative;
		z-index: 0;
		margin:0px 0px 5px 0px;
		background-image:none;
		}
	/* The window1light class sorts out the neon tube positioning inside each windowcontent division */
	.window1light
		{
		position: absolute;
		top: 0px;
		left: -20px;
		z-index: 15;
		}
	/* The Window1 class styles each box in the leftmenu */
	div.window1
		{
		background-image: url("../images/lsbg2.gif");
		background-position:top left;
		background-color:#002d4c;
		border-style:solid;
		border-width:1px;
		border-color:#1a63f0;
		overflow:auto;
		}
	/* Hovering over each box changes the background and lightens the border slightly */
	div.window1:hover
		{
		background-image: url("../images/lsbg2a.gif");
		background-repeat:repeat-y;
		background-color:#004472;
		border-color:#3379ff;
		}
	div.leftmenu div.window1:hover
		{
		background-position:top left;
		}		
	div.rightmenu div.window1:hover
		{
		background-position:-14px 0px;
		}
	/* Window1text contains all content for each window. */		
	/* H5 is used as each box title */
	.window1text h5
		{
		font-family:"Trebuchet MS", "times new roman", roman, serif;
		letter-spacing:-0.05em;
		text-transform:uppercase;
		font-size:1.2em;
		color:#efefef;
		text-align:center;
		background-color:#0e376c;
		background-image:url("../images/window1-h5-bg.gif");
		background-position:top left;
		background-repeat:no-repeat;
		border-width:0px 1px 1px 0px;
		border-style:solid;
		border-color:#63e6ff #1a63f0 #003cb0 black;
		margin:4px;
		}
	/* H6 is used as links etc inside each window on the leftmenu */
	.window1text h6, .window1text div
		{
		font-family:arial, "sans-serif";
		color:#97a0a9;
		}
	/* leftmenu window anchors formatting */
	.windowcontent a
		{
		font-weight:bolder;
		}
	.windowcontent a:link, .windowcontent a:visited
		{
		color:#a3d1f0;
		}		
	.windowcontent a:hover
		{
		color:#d7fbf6;
		}
	.windowcontent a:active
		{
		background-color:transparent;
		color:#f3f9ff;
		}
	

/* ------------------------------------------------------------------------------------*/
/* IMAGE LINK STYLES FOR LEFTMENU AND MAIN ARTICLE SECTIONS */
	/* Image links inside the articles and the windows on the left side will use transparency effects */
	/* The transparency effects will only be applied to images inside anchor tags */
	.maintext a:link img, .window1 a:link img
		{
		filter: alpha(opacity=80);
		opacity:0.8;
		-moz-opacity: 0.8;
		border:0px;
		}
	.maintext a:visited img, .window1 a:visited img
		{
		filter: alpha(opacity=65);
		opacity:0.75;
		-moz-opacity: 0.75;
		border:0px;
		}	
	.maintext a:hover img, .window1 a:hover img
		{
		filter: alpha(opacity=90);
		opacity:.9;
		-moz-opacity: .9;
		border:0px;
		}
	.maintext a:active img, .window1 a:active img
		{
		filter: alpha(opacity=100);
		opacity:1.0;
		-moz-opacity: 1.0;
		border:0px;
		}


/* ------------------------------------------------------------------------------------*/
/* MAIN ARTICLE SECTION */
	
	/* The main division sits immediately beneath the breadcrumbs division */
	div#main
		{
		position:relative;
		min-width:960px;
		}

	/* Hides from IE-mac \*/
	* html .maintext 
		{
		/* Stops the admin user boxes flying off the right-hand side */
		/* http://www.positioniseverything.net/explorer/escape-floats.html */		
		height: 1%; 
		}
	/* End hide from IE-mac */
	
	/* The maintext class of division is for the articles, galleries, homepage content, etc. */
	/* Headings configuration h1 - h7 */
	.maintext h1, .maintext h2, .maintext h3, .maintext h4, .maintext h5, .maintext h6, .maintext h7
		{
		padding:3px;
		/*letter-spacing:-0.09em;*/
		letter-spacing:-0.02em;
		text-transform:uppercase;
		font-family:"Trebuchet MS", "times new roman", roman, serif;
		border-width:1px;
		border-style:solid;
		}
	.eventList h1, .eventList h2, .eventList h3, .eventList h4, .eventList h5, .eventList h6, .eventList h7,
	.detailsTable h1, .detailsTable h2, .detailsTable h3, .detailsTable h4, .detailsTable h5, .detailsTable h6, .detailsTable h7
		{
		border-width:0px;
		background-color:transparent;
		}
	.maintext h1
		{
		font-size:2em;
		}
	.maintext h2
		{
		font-size:1.5em;
		}
	.maintext h3
		{
		font-size:1.2em;
		}
	.maintext h4
		{
		font-size:1em;
		}
	.maintext h5
		{
		font-size:.8em;
		}
	.maintext h6
		{
		font-size:.6em;
		}
	/* maintext contains the 'article' division, providing the backdrop and spacing */
	div.maintext
		{
		font-family:arial, helvetica, "sans-serif";
		background-color:black;
		margin:0px 139px 15px 190px;
		padding:7px;
		border-width:1px;
		border-style:solid;
		border-color:#7800ab;
		position:relative;
		background-image:url("../images/main-corner-br3.gif");
		background-position:bottom right;
		background-repeat:no-repeat;		
		z-index:1;
		}
	div.maintext img
		{
		max-width:100%;
		width:expression(this.width<525 ? "auto" : "525px");
		/* IE ONLY.  This reduces images to a set width if it is longer.  */
		/* NOTE: if the condition is <=, IE will take up 100% CPU and crash. */
		/*       this is cos it loops.  It would set the width to the max and that would meet the */
		/* 	   requirements to set its width to 'auto'. */
    		}
    	td.bodyline img
    		{
    		max-width:none;
    		}    	
	div.maintext p
		{
		font-size:0.9em;
		font-family:arial, helvetica, "sans-serif";
		}		
	/* Mostly, the styling of forms inside .maintext is to workaround a prob in IE where */
	/* floating elements disappear behind container divisions ('relative' position helps this)*/
	div.maintext form
		{
		position:relative;
		z-index:5;
		margin:0px;
		}	
	/* Maintext class anchor formatting */
	.maintext a:link, a:link
		{
		font-weight:900;
		color:#8ed2ff;
		text-decoration:none;
		}
	.maintext a:visited, a:visited
		{
		font-weight:900;
		color:#b6e2ff;
		text-decoration:none;
		}
	.maintext a:hover, a:hover
		{
		color:#f8fcff;
		text-decoration:underline;
		}
	.maintext a:active, a:active
		{
		background-color:#081a27;
		}	
	.maintext div h3
		{
		margin:0px 0px;
		}
	
	
/* ------------------------------------------------------------------------------------*/
/* ARTICLE DIVS */
	/* ArticleText class contains each entire article.  */
	/* This could be the whole of the homepage contents or each entire news item */
	div.article
		{
		position:relative;
		/*... same as before.  IE does funny things to positioned or floated divs unless the */
		/* container has a position of relative. */
		}
	div.ArticleText
		{
		position:relative;
		/*... same as before.  IE does funny things to positioned or floated divs unless the */
		/* container has a position of relative. */
		
		text-align:justify;
		}
	div.ArticleText p
		{
		margin-top:0px;
		margin-bottom:0px;
		}
	/* HTML headings carry their own intrinsic formatting.  This is overridden.  */
	div.ArticleText h1,h2,h3
		{
		margin-bottom:2px;
		}
	

/* ------------------------------------------------------------------------------------*/
/* NEWS HEADINGS */
	/* Each news item is headed up with an icon and name of the speaker, the subject, and the date*/
	/* newsHeader class contains all of the above for each news item. */
	div.newsHeader 
		{
		padding:3px;
		border:1px solid black;
		margin:0px 0px 10px 0px;
		letter-spacing:-0.09em;
		font-family:"comic sans ms", arial, "sans-serif";
		}
	/* H3 is applied to the news subject */
	div.newsHeader h3
		{
		border:none;
		padding:0px;
		margin:0px;
		}
	/* The icon is floated to the left of the rest of the news item heading data */
	/* with a cool border thing going on */
	div.newsHeader img
		{
		float:left;
		position:relative;
		z-index:500;
		margin:0px 10px 0px 0px;
		border-width:5px;
		border-style:solid;
		/* Images should be uniform size - force it! */
		width:50px;
		height:50px;
		}

/* ------------------------------------------------------------------------------------*/
/* GALLERY */

	/* Hides from IE-mac \*/
	* html .gallery 
		{
		/* Stops the thumbs flying off the right-hand side */
		/* http://www.positioniseverything.net/explorer/escape-floats.html */		
		height: 1%; 
		}
	/* End hide from IE-mac */

	/* Contains the gallery thumbnails beneath the main heading and page navigation */
	.gallery
		{
		position:relative; 
		/* position:relative is used because I noticed that IE	*/
		/* had a habit of overlaying the gallery div up against	*/
		/* the left side of the window, popping it into the right*/
		/* place when the mouse moved over its contents.			*/
		/* The gallery would flick in and out of existance if the*/
		/* window height was adjusted also.  */
		/* Weird thing. -Matt */
		margin-top:10px;	
		}
	/* gallery_item classes hold the thumbnails and image title on gallery lists */
	div.gallery_item
		{
		float:left;
		/* position:relative;*/
		z-index:100;
		height:130px;
		margin-bottom:5px;
		margin-right:5px;	
		}
	/* Paragraphs are used in gallery_item classes for each thumbnail's title */
	/* They are also slightly transparent */
	div.gallery_item p
		{	
		z-index:105;
		position:relative;
		padding:4px;
		border:1px solid #5a7586;
		margin-top:-20px;
		margin-left:28px;
		font-family:arial, "sans-serif";
		font-size:.8em;
		text-align:center;
		width:100px;
		overflow:hidden;
		background-color:#3a4c58;
		filter: alpha(opacity=80);
		opacity:.8;
		-moz-opacity: .8;	
		}
	div.gallery_item a
		{
		text-decoration:none;
		}
	div.gallery_item a:active
		{
		background-color:transparent;
		}	
	/* gallery_image classes hold the enlarged gallery images, generating scrollbars for wide images */
	div.gallery_image
		{
		margin:2px; 
		padding:6px;
		text-align:center;
		border-width:1px;
		border-style:solid;
		overflow:auto;
		width:97%;
		/* That last one is a hack for... you guessed it, IE.  */
		/* Otherwise it won't render the overflow proper because */
		/* we don't set an exact width on the gallery image */		
		}
	/* gallery_thumb classes hold the thumbnails (which act as anchors) in gallery listings */
	div.gallery_thumb
		{
		margin:2px; 
		padding:6px;
		width:120px; 
		height:86px;
		background-color:#081721;
		text-align:center;
		border-width:1px;
		border-style:solid;
		border-color:#374751;
		overflow:hidden;
		position:relative;
		}
	div.gallery_thumb img
		{
		max-width:108px;
		width:auto;	
		width:expression(this.width<108 ? "auto" : "108px");
		/* IE ONLY.  This reduces images to a set width if it is longer.  */
		/* NOTE: if the condition is <=, IE will take up 100% CPU and crash. */
		/*       this is cos it loops.  It would set the width to the max and that would meet the */
		/* 	   requirements to set its width to 'auto'. */
		}

	/* Standard styles on llamalan place red behind a tags when clicked. */
	/* This is disabled in the gallery. */
	div.gallery_thumb img:active
		{
		background-color:transparent;
		}
	div.subarticles
		{
		padding:2px;
		margin-top:4px;
		border-style:none;
		}
	div.subarticles:before
		{
		content:"::";
		}
	div.ll_video
		{
		margin:2px; 
		padding:6px;
		background-color:#451200;
		text-align:center;
		border:1px solid #000000;
		overflow:auto;	
		}


/* ------------------------------------------------------------------------------------*/
/* COMMENTS */
/* Used for comments against gallery images and against blog entries */
	.CommentList
		{
		font-family:"Lucida Grande","Trebuchet MS", Verdana,Helvetica,Arial,sans-serif;
		margin-left:0.5em;
		}

	.CommentList hr
		{
		width:100%;
		height:1px;
		margin-top:0em;
		border-color:#000;
		}

	.CommentList .CommentHead
		{
		display:none;
		}
		
	.CommentList .CommentUser
		{
		font-size:0.8em;
		padding:0.1em 0.5em 0em 0.5em;
		}

	.CommentList .CommentBody
		{
		font-size:0.9em;
		padding:0.2em 0.5em 1.5em 0.5em;
		}

	.CommentList textarea
		{
		height:5em;
		}


/* ------------------------------------------------------------------------------------*/
/* SIBLING NAVIGATION */
/* e.g. gallery images, staff entries - essentially to easily move from a subarticle to */
/* others with the same parent */
	/* At the top of some articles, like galleries and gallery images, we have some navigation */
	/* article_info_left may have links to each page in the gallery */
	div.article_info_left
		{
		display:block;
		position:relative;
		margin:8px 5px 0px 5px;
		padding:3px;
		}
	div.article_info_left a
		{
		text-decoration:none;
		padding:2px;
		border-width:1px;
		border-style:solid;
		}
	/* article_info_right may display the current page of the gallery */
	div.article_info_right
		{
		position:relative;
		float:right;
		margin:30px 5px 0px 15px;
		}
	/* The navigation class holds all these links */
	div.navigation
		{
		display:block;
		margin:8px 15px 0px 15px;
		padding:3px;
		position:relative;
		clear:both;
		font-size:0.9em;
		font-family:arial, "sans-serif";
		}
	/* There now follows a way to make the backdrop to the navigation display properly */
	.navigation:after 
		{
   	content: "."; 
		display: block; 
		height: 0; 
		clear: both; 
		visibility: hidden;
		}				
	/* Hides from IE-mac \*/
	/* IE hack to do the same as above - cos it doesn't recognise :after pseudo-class */
	* html .navigation {height: 1%;}
	/* End hide from IE-mac */		

	/* For the link to the first sub-article - position:relative so IE doesn't turn link invisible */
	div.navigation a.navigation_first
		{
		position:relative;
		z-index:999;
		float:left;
		margin-top:8px;
		margin-left:5px;
		margin-right:5px;
		}
	/* For the link to the previous sub-article - position:relative so IE doesn't turn link invisible */
	div.navigation a.navigation_previous
		{
		position:relative;
		z-index:999;
		float:left;
		margin-top:8px;
		margin-left:5px;
		margin-right:5px;
		}
	/* For the link to the next sub-article - position:relative so IE doesn't turn link invisible */
	div.navigation a.navigation_next
		{
		position:relative;
		z-index:999;
		float:right;
		margin-left:5px;
		margin-right:5px;
		margin-top:8px;
		}
	/* For the link to the last sub-article (spotted a pattern yet?) */
	div.navigation a.navigation_last
		{
		position:relative;
		z-index:999;
		float:right;
		margin-left:5px;
		margin-right:5px;
		margin-top:8px;
		}
	/* A handy feature, lists subarticles on the same 'page' of the parent */
	div.siblingnavigation
		{
		text-align:justify;
		line-height:1.5em;
		clear:both;
		font-size:0.8em;
		font-family:arial, "sans-serif";
		padding:5px;
		border-width:1px;
		border-style:solid;
		margin:0px 0px 5px 0px;
		}
	/* Each subarticle in the siblingnavigation div is a link, except for the current one */
	/* This has been removed */
	/*
	div.siblingnavigation a, div.siblingnavigation span
		{
		margin-right:8px;
		white-space:nowrap;
		}
	div.siblingnavigation a
		{
		padding:0px 5px;
		}
	div.siblingnavigation a:link
		{
		color:#EBA400;
		}
	div.siblingnavigation a:visited
		{
		color:#DE7A00;
		}
	div.siblingnavigation a:hover
		{
		color:#FFBF36;
		}*/
	/* The current subarticle in the siblingnavigation div is highlighted in white, and unclickable */
	/* This has been removed */
	/*
	.navigationLinks span
		{
		color:#FFD000;
		border-width:1px;
		border-style:solid;
		padding:0px 5px;
		}
	*/	
	
	
/* ------------------------------------------------------------------------------------*/
/* EVENTS DATA */
	/* Spectators are just yellow llamas, they are */
	li.spectator
		{
		list-style-image:url("../images/bullet_spec.gif");
		}
	/* The eventList class holds both the upcoming events div and the past events div */
	div.eventList
		{
		position:relative;
		/* Again, position:relative has been used because backgrounds and stuff go mental in IE */
		/* if used on divs that are positioned or have floats */

		/* Sheesh */		
		text-align:center;
		}
	div.eventList p
		{
		margin-top:3px;
		margin-bottom:25px;
		}
	/* Contains the banner for the upcoming event along with some key data and link to details */
	div.upComingEvent
		{
		text-align:center;
		border-width:1px;
		border-style:solid;
		padding:3px;
		margin:3px;
		overflow:hidden;
		}
	/* Contains the banners for the previous events */
	div.previousEvent
		{
		border-width:1px;
		border-style:solid;
		padding:3px;
		margin:3px;
		overflow:hidden;
		}
	/* The detailstable class holds all data when an event is selected, including */
	/* the banner, the summary of the user's participation (or lack of), and all */
	/* details */
	div.detailsTable h2
		{
		text-align:center;
		}
	/*div.detailsTable span
		{
		display:table-cell;
		width:200px;
		padding-left:5px;
		}*/
	/* The label hangs on the left all nicely lined up */
	div.detailsTable div.label
		{
		letter-spacing:-0.09em;
		text-transform:uppercase;
		font-weight:bold;
		/*border-width:1px;
		border-style:solid;	*/
		border-style:none;
		float:left;
		width:200px;
		text-align:right;
		margin-right:10px;
		}
	div.detailsTable p
		{
		clear:both;
		margin:0px 0px 5px 0px;
		vertical-align:middle;
		text-align:right;
		}
	div.detailsTable a
		{
		margin-right:25px;
		}
	div.detailsTable div#eventLinks
		{
		text-align:center;
		margin-bottom:10px;
		}

	div#eventLinks p
		{
		text-align:center;
		margin-top:0px;
		}
		
 	div#eventLinks ul li
 		{
 		text-align:justify;
 		}

	div.siblingListItem
		{
		background-color:#6B0C00;
		color:#FFCDBA;
		border:1px solid #8F1100;
		float:left;
		padding:2px;
		width:20%;
		overflow:hidden;
		white-space: nowrap;
		height:20px;
		}
	/* The Events Super-Button */
	
	#eventLinks h4
		{
	/*	height:61px;
		border:0px;
		background-color:transparent;*/
		text-align:center;
		font-family:arial, helvetica, "sans-serif";
		letter-spacing:0px;
		}
	div#eventLinks .superButton
		{
		text-align:center;
		background-image: url("../images/event-actionbutton-m.gif");
		font-family:arial, helvetica, "sans-serif";
		font-size:1.5em;
		height:61px;
		background-position:top center;
		background-repeat:repeat-x; 
		margin:2px 5px;
		padding:0px;
		width:450px;
		}
	#eventLinks .superButtonL
		{
		float:left;
		position:relative;
		width:61px;
		height:61px;
		background-image: url("../images/event-actionbutton-l.gif");
		background-position:top center;
		background-repeat:repeat-x; 
		}
	#eventLinks .superButtonR
		{
		float:right;
		position:relative;
		width:61px;
		height:61px;
		background-image: url("../images/event-actionbutton-r.gif");
		background-position:top center;
		background-repeat:repeat-x; 		
		}
	#eventLinks #payUpIncentive
		{		
		font-size:1.5em;
		}
	#eventLinks form, .window1text form
		{		
		padding:0px;
		margin:0px;
		}		
	.window1text .superButtonR, .window1text .superButtonL, .window1text #payUpIncentive
		{
		/*display:none;*/
		}
	div#eventLinks .superButton a
		{	
	/*	color:#FFCC00;*/
		font-family:"Trebuchet MS", arial, "sans-serif";
		text-decoration:none;
		font-weight:300;
		display:block;
		overflow:hidden;
		margin:0px;
		padding:0px;		
		position:relative;
		top:25px;
		}
	div#eventLinks .superButton a:hover
		{	
	/*	color:#FFFF33; */
		text-decoration:none;
		display:block;
		}	
	div#eventLinks .superButton a:active
		{	
		background-color:transparent;
		}			
/* ------------------------------------------------------------------------------------*/
/* FOOTERS */

	
	/* Placed right at the end of the page's contents; disclaimers and a llamalan icon silhouette */
	div.site_footer
		{
		margin-top:30px;
		margin-bottom:5px;
		color:#7348a3;
		clear:both;
		background-color:transparent;
		margin-left:252px;
		margin-right:202px;
		text-align:center;
		}
	div.site_footer a
		{
		text-decoration:none;
		color:#9b4dbf;
		}
		
	/* Placed after articles, helpful to expand the gallery backdrop */
	/* Contains author name and other links for admins */
	div.articlefoot
		{
		color:#727c80;
		font-variant:small-caps;
		clear:both;
		padding-top:30px;
		padding-bottom:15px;
		font-size:1.1em;	
		font-style:italic;
		font-weight:bold;
		font-family:"comic sans ms", arial, "sans serif";
		position:relative;
		z-index:5;	
		}
		
/* ------------------------------------------------------------------------------------*/
/* FORUM SPECIFIC */
	/* .liteoption and .mainoption Added for forum button effects */
/*	input.button, .liteoption, .mainoption
		{
		background-color:#5F7568;
		background-image:none;
		text-transform:uppercase;
		border-width:1px;
		border-style:outset;
		color:#212121;
		cursor:pointer;
		}
	input.button:active, .liteoption:active, .mainoption:active
		{
		background-color:#4E6155;
		border-style:inset;
		color:#6FD198;
		}
*/

/* ------------------------------------------------------------------------------------*/
/* ADMIN PAGES STUFF */
		
	/* The adminPages table class is used to organise links on screen throughout the admin panels */
	.adminPages
		{
		font-size:0.9em;
		color:#a6b1b9;
		}

	div.UserFilter
		{
		margin-bottom:5px;
		padding:1px 1px 1px 1px;
		font-size:12px;
		}
	/* UserNameList class holds the floating divs containing user names, links to their details */
	div.UserNameList
		{
		text-align:center;
		position:relative;
		float:left;
		font-size:80%;
		border-style:none;
		margin:2px;
		}
	div.UserNameList a
		{		
		display:block;
		height:2.5em;
		width:10em;
		padding:5px;
		}
	div.articleAdminContainer
		{
		border-color:#000000;
		border-width:1px;
		border-style:solid;
		padding:1px;
		margin:5px;
		clear:both;
		}
	div.articleadmintitle
		{
		float:left;
		width:30%;
		padding:1px 1px 1px 1px;
		}	
	div.articleadmindata
		{
		float:left;
		width:60%;
		padding:1px 1px 1px 1px;
		}
	div.articleadmin
		{
		overflow:auto;
		padding:1px 1px 1px 1px;
		border-width:1px 1px 1px 1px;
		border-style:solid;
		border-color:#ffffff;
		}		

	/* Appears when users make mistakes and need a warning! */
	div.message
		{
		text-align:center;
		background-color:#315977;
		border-style:solid;
		border-width:1px 1px 1px 1px;
		border-color:#4a7da4;
		}
	div.Errormessage
		{
		text-align:center;
		background-color:#bb0054;
		border-style:solid;
		border-width:1px 1px 1px 1px;
		border-color:#8c0059;
		}
	div.message ul
		{
		text-align:left;
		}

	/* ADMIN TABS */
	.adminTabs
		{
		padding:0px 15px;
		}
	.adminTabs table
		{
		background-color:black;
		border-spacing:0px;
		border-collapse:collapse;
		border:0px;
		padding:0px;
		margin:0px;
		}

	/*.adminTabs table tr
		{
		background-image:url("http://ww2.llamalan.co.uk/templates/llamalan/images/admintab-b.gif");
		background-repeat:repeat-x;
		background-position:bottom left;
		background-color:#BD0D00;
		}*/

	.adminTabs .tabSeparateL, .currenttabSeparateL
		{
		width:4px;
		background-image:url("../images/admintab-l.gif");
		background-repeat:no-repeat;
		background-position:top right;
		padding:0px;
		border:0px;
		margin:0px;
		}

	.adminTabs .tabSeparateR, .currenttabSeparateR
		{
		width:4px;
		background-image:url("../images/admintab-r.gif");
		background-repeat:no-repeat;
		background-position:top left;
		padding:0px;
		border:0px;
		margin:0px;		
		}

	.adminTabs .adminPages th
		{
		padding:0px 5px 0px 5px;
		border:0px;
		margin:0px;		
		border-width:0px;
		border-style:none;
		height:1px;
		background-image:url("../images/admintab-bg.gif");
		background-repeat:repeat-x;
		background-color:#18252d;
		background-position:top left;	
		font-size:2em;
		}

	.adminTabs a
		{
		display:block;
		/*background-image:url("http://ww2.llamalan.co.uk/templates/llamalan/images/admintab-b.gif");
		background-repeat:repeat-x;
		background-position:bottom left;*/
		height:27px;
		overflow:hidden;
		border-style:none;
		}	
	.adminTabs .adminPages th a:visited, .adminTabs .adminPages th a:link
		{
		color:#3f5765;
		background-color:transparent;
		}	
	.adminTabs .adminPages th a:hover
		{
		color:#516c7c;
		}
	.adminTabs .adminPages th a:active
		{
		color:#758c9a;
		/* outline:none drops the dotted outline that FF displays */
		outline:none;
		background-color:transparent;
		}
	.currenttabSeparateL, .currenttabSeparateR
		{
		background-position:0px -26px;
		}
	.adminTabs .adminPages th.currenttab
		{
		background-position:0px -27px;
		}
	.adminTabs .adminPages th.currenttab a
		{
		color:#bec4ca;
		/* outline:none drops the dotted outline that FF displays */
		outline:none;
		}
	.adminPages td.row1, .adminPages td.row2 
		{
		text-align:left;
		padding-left:5px;
		}
	
	div.adminTabPages, #UserDetails, #UserClans, #UserGames, #ClanDetails, #GameDetails, #UserMatches,
	#MemberDetails, #InviteDetails, #MatchDetails, #TournamentDetails, #Tree
		{
		border-width:3px;
		border-style:solid;
		width:99%;
		}

	/* Formatting cells in the tournament details when looking at the list under Clan Details */		
	span.TournamentName
		{
		font-weight:900;
		}

	span.TournamentDesc
		{
		font-size:0.9em;
		font-style:oblique;
		color:#9999aa;
		}		

/* ------------------------------------------------------------------------------------*/
/* TOURNAMENT TREE LAYOUT */


	.tournamentGroup
		{
		/*background-color:#09ffd9;*/
		}
	.tournamentBracket
		{
		/*background-color:#ffff50;*/
		}
	.tournamentRound
		{
		/*background-color:red;*/
		}
	.tournamentRound td
		{
		/*background-color:#35453C;*/
		/*border-color:#ffc5c5;*/
		}
	.tournamentPlayer
		{
		/*background-color:#637370;
		border-color:#73A9DE;*/
		}
	.tournamentPlayerUnknown .tournamentPlayer
		{
		/*background-color:#616161;
		color:#919191;*/
		}		
	.tournamentPlayerContainerNew, .tournamentPlayerContainerRemaining, .tournamentPlayerContainerWinner
		{
/*		background-image:url("../images/tournamentLine1.gif");*/
		/*color:#F0F0F0;*/
		}
	.tournamentPlayerContainerNew .tournamentPlayer
		{
	/*	background-color:#6F8783;
		border-color:#73A9DE;*/
		}
	.tournamentPlayerContainerWinner .tournamentPlayer
		{
		border-color:#73A9DE;
		background-color:#ffff00;
		color:#000000;
		font-weight:bolder;
		}
	td.tournamentFiltering
		{
		background-color:#73A9DE;
		}
	td.tournamentFilteringTop, td.tournamentFilteringBottom
		{
		/*background-color:#587565;*/
		}
	td.tournamentFilteringTop
		{
/*		background-image:url("../images/tournamentLineTop.gif");*/
		}
	td.tournamentFilteringBottom
		{
/*		background-image:url("../images/tournamentLineBottom.gif");*/
		}
	.roundLabel
		{
		/*background-color:#ffffff;*/
		color:white;
		}

/* ------------------------------------------------------------------------------------*/
/* GOLEM NO NOT WOT DIS LOT DOES*/	

	div.GroupListContainer
		{
		float:left;
		width:30%;
		height:146px;	
		border:1px;
		border-style:solid;
		border-color:#A81600;
		padding:3px;
		}
	div.userListContainer
		{
		float:left;
		width:30%;
		height:196px;	
		border:1px;
		border-style:solid;
		border-color:#A81600;
		padding:3px;
		}
	div.userList
		{
		float:left;
		width:100%;
		overflow:auto;
		height:180;
		}
	div.groupList
		{
		float:left;
		width:100%;
		overflow:auto;
		height:120;
		}

	div.mailDetails
		{
		float:left;
		overflow:auto;
		width:65%;
		height:350px;
		border:1px;
		border-style:solid;
		border-color:#A81600;
		padding:3px;

		}
	div.mailList
		{
		border:1px;
		border-style:solid;
		border-color:#A81600;
		margin:2px 0px 2px 0px;
		}
	div.filelistitem
		{
		float:left;
		border:1px;
		border-style:solid;
		border-color:#A81600;
		margin:2px;
		padding:1px;
		}
	div.filelistitem p
		{
		font-weight:bold;
		font-size:1em;
		}
	div.filelistitem a
		{
		text-align:center;
		}

	div.EventImage
		{
		padding:5px;
		float:left;
		}
	div.EventDetails
		{
		padding:5px;
		float:left;
		}
		
/* ------------------------------------------------------------------------------------*/
/* AT LAN PAGE */	
	.WeekendSchedule
		{
		background-color:black;
		border:1px solid #333355;
		}
	.matchInfo h1
		{
		/* Used to head up 'Past Matches' and 'Upcoming Matches' tables */
		margin-bottom:0px;
		}

	#shoutBox-Content
		{
		background-color:#232335;
		border-width:1px 1px 0px 0px;
		border-style:dotted;
		border-color:#eeeeee;
		}
		
	.shoutBox p
		{
		background-color:transparent;
		border-top:1px solid #434355;
		border-bottom:1px solid #111111;
		color:#eeeeee;
		margin:0;
		}

	.shoutBox
		{
		background-image:url("../images/shoutbox-headbg.png");
		background-repeat:no-repeat;
		background-color:transparent;
		background-position:top left;
		}