/*
page background: #F7F3EF
box background (light): #DAE8D9
Darker background and regular text (dark): #288723 :: formerly slightly lighter: #526184
*/

/* all creatures box  */
#allCreatures { position: relative;  width: 560px; height: 76px; margin: 0px 15px 15px auto; background-color: #B8D4A9;}
	#allCreaturesText { position: absolute; top: 5px; right: 15px; width: 380px; z-index: 5; font-size: 12px; line-height: 16px;}
	#allCreaturesText a:hover {border-bottom: none !important;}
	#allCreaturesPic { position: absolute; top: 0px; left: 0px; height: 100%; width:230px; background: #DAE8D9 url("images/allcreatures.jpg") no-repeat left top; z-index: 2;} /* background image URL is relative to Stylesheet! */
	#allcreaturesright { position: absolute; top: 0px; right: 0px; height: 100%; width: 11px; background: url("images/allcreaturesright.jpg") no-repeat left top; z-index: 5;} /* left rounding of box */

/* 3 items */
#threeItems { position: relative;  height: 90px; margin: 15px 15px 20px 0px; } /* change Height according to decided height of 3 itmes */
#threeItems a:hover {border-bottom: none !important;}
	#item1 {position: absolute; top:0px; right: 0px; width: 180px; text-align: center; margin: 0px;}
	#item2 {position: absolute; top:0px; right: 190px; width: 180px; text-align: center; margin: 0px;}
	#item3 {position: absolute; top:0px; right: 382px; width: 180px; text-align: center; margin: 0px;}
	
	
/* 2 items (messages and news)*/
#MessagesNews { position: relative;  height: 100px; margin: 15px 15px 20px 0px;} /* change Height according to decided height of itmes */
	#newsBox {position: absolute; top:0px; right: 0px; width: 270px; text-align: center; height: 100px; }
	#messagesBox {position: absolute; top:0px; right: 292px; width: 270px; text-align: center; height: 100px;}
	
	
	
/* random boxes */
#randomBoxes { position: relative; width: 560px; margin: 0px 15px 0px 0px;}
	.randomBox { position: relative;  width: 100%; margin: 10px 0px 0px 0px; overflow: hidden;}
	.randomBoxIMPORTANT { background-color: #B5C1DF !important; }
	.randomBoxIMPORTANTtitle { font-weight: bold; !important; }
	
#menu {z-index: 10;}

/* types */

/* Important to Know titles and other elements */ 
.textAndLineContainer{ width: 550px; position: relative; height: 15px; margin: 10px 15px 0px 0px;}
	.textOnLine {margin: 0px position: absolute; right: 0px; top: 0px; font-weight: bold; }
	.lineUnderText {width: 480px; margin: 0px; border-bottom: 1px solid; position: absolute; right: 80px; top: 7px;}
	
/* override colors etc. */
#right {
width: 597px;	/* sets position of side separator line */
border-color: #F7F3EF #288723 #F7F3EF #288723;
}
