body
{
background: black;
color: crimson;
margin: auto 0;
text-align: center;
}




.crimson
{
 color: #800000;
 text-align: center;
 width: 780px;
 padding: 10px;
 font-size: 45px;
}


a
{
color: crimson;
}


a:hover
{
color: red;
}
a:visited
{
color: crimson;
}


 .blue 
 {
 color: blue;
 text-align: center;
 width: 780px;
 padding: 10px;
 }
 
 
 .blue a
 {
 color: #0008a1;
 }
 
 #header
 {
    background: url('../images/easy2.jpg');
width: 800px;
height: 129px;
 }
 #container 
 {
 width: 800px;
 margin: auto;
 }
 
 #menu
 {
 background: #333;
 width: 800px;
 height: 40px;
 font-size: 25px;
 margin: 5px 0;
 border: 1px solid grey;
 border-radius: 4px;
 }
 
 #menu ul
 {
    margin: 0;
   padding: 0 0px;
}




 #menu ul li
 {
  display: inline;
 float:left; 
list-style:none;}
 
 #menu ul li a 
 {
 float: left; 
 text-decoration: none;
 padding: 5px 6px; 
}


#menu ul li a:hover
{
background: #777;
}


#menu li ul 
{
margin:40px 0 0 0;
padding: 0px;
display:none;
position:absolute;
 z-index: 3000;
 width: 200px;
 border: 1px #777 solid;
 background: #333;
 border-radius: 4px;
 -moz-border-radius: 4px;
 }




#menu li:hover ul
{
display:block;
}


#menu li li
{
list-style:none;
display:list-item; text-align: center;
}


#menu li li a
{
list-style:none;
display:list-item; width: 184px; text-align: center; color: crimson;
font-size: 20px;
 border-radius: 4px;
 -moz-border-radius: 4px;
}


#easy
{
    background: url('../images/easy.jpg');
background-size: 800px 350px;
-moz-background-size: 800px 350px;
width: 800px;
height: 350px;
margin: 0 0 30px 0;
}
#BG
{
    background: url('../images/BG.jpg');
background-size: 800px 2500px;
-moz-background-size: 800px 2500px;
width: 800px;
height: 2500px;
margin: 0 0 30px 0;
}

#BGrules
{
    background: url('../images/BG.jpg');
background-size: 800px 810px;
-moz-background-size: 800px 810px;
width: 800px;
height: 810px;
margin: 0 0 20px 0;
}

#BGinfo
{
    background: url('../images/BG.jpg');
background-size: 800px 600px;
-moz-background-size: 800px 600px;
width: 800px;
height: 600px;
margin: 0 0 10px 0;
}

#BGkme
{
    background: url('../images/BG.jpg');
background-size: 800px 500px;
-moz-background-size: 800px 500px;
width: 800px;
height: 500px;
margin: 0 0 10px 0;
}

#BGesilidor
{
    background: url('../images/BG.jpg');
background-size: 800px 1100px;
-moz-background-size: 800px 1100px;
width: 800px;
height: 1100px;
margin: 0 0 10px 0;
}

#BGgilarath
{
    background: url('../images/BG.jpg');
background-size: 800px 1100px;
-moz-background-size: 800px 1100px;
width: 800px;
height: 1100px;
margin: 0 0 10px 0;
}

#BGairohn
{
    background: url('../images/BG.jpg');
background-size: 800px 1000px;
-moz-background-size: 800px 1000px;
width: 800px;
height: 1000px;
margin: 0 0 10px 0;
}

#BGswordshine
{
    background: url('../images/BG.jpg');
background-size: 800px 1000px;
-moz-background-size: 800px 1000px;
width: 800px;
height: 1000px;
margin: 0 0 10px 0;
}


#Officers
{
    background: url('../images/KinshipOfficers.png');
background-size: 800px 129px;
-moz-background-size: 800px 129px;
width: 800px;
height: 129px;
margin: 0 0 30px 0;
}


#InfoEasy
{
    background: url('../images/InfBG.bmp');
background-size: 800px 350px;
-moz-background-size: 800px 350px;
width: 800px;
height: 350px;
margin: 0 0 30px 0;
}


#lotro2
{
    background: url('../images/lotro2.jpg');
background-size: 800px 319px;
-moz-background-size: 800px 319px;
width: 800px;
height: 319px;
}

#KinshipHistory
{
    background: url('../images/HistoryLOTF.jpg');
background-size: 800px 900px;
-moz-background-size: 800px 900px;
width: 800px;
height: 900px;
}

#Airohn
{
    background: url('../images/Airohn.jpg');
background-size: 504px 619px;
-moz-background-size: 504px 619px;
width: 504px;
height: 619px;
}

#Esilidor
{
    background: url('../images/Me.jpg');
background-size: 525px 400px;
-moz-background-size: 525px 400px;
width: 525px;
height: 400px;
}

#Gilarath
{
    background: url('../images/Dom.jpg');
background-size: 450px 550px;
-moz-background-size: 450px 550px;
width: 450px;
height: 550px;
}

#Swordshine
{
    background: url('../images/Liz.png');
background-size: 800px 640px;
-moz-background-size: 800px 640px;
width: 800px;
height: 640px;
}


#Contact12
{
    background: url('../images/cm.jpg');
background-size: 776px 351px;
-moz-background-size: 776px 351px;
width: 776px;
height: 351px;
}

#IWU
{
    background: url('../images/IWU.jpg');
background-size: 572px 421px;
-moz-background-size: 572px 421px;
width: 572px;
height: 421px;
}

#panel {
	
	width: 100%;
	background: #754c24;
	height: 200px;
	display: none;
}
.slide {
	margin: 0;
	padding: 0;
	border-top: solid 4px #422410;
	background: url(images/btn-slide.gif) no-repeat center top;
}
.btn-slide {
	background: #754c24;
	border-bottom-right-radius: 10px 10px;
	border-bottom-left-radius: 10px 10px;
	text-align: center;
	width: 144px;
	height: 20px;
	padding: 10px 0 0 0;
	margin: 0 auto;
	display: block;
	font: bold 120%/100% Arial, Helvetica, sans-serif;
	color: #fff;
	background-position: right ;
	text-decoration: none;
	position:absolute;
 right:0;
 
}
.active {
	background-position: right ;
}
/*--Main Container--*/
.main_view {
	float: center;
	position: relative;
	
}
/*--Window/Masking Styles--*/
.window {
	height:400px;	
	width: 600px;
	overflow: hidden; /*--Hides anything outside of the set width/height--*/
	position: relative;
}
.image_reel {
	position: absolute;
	top: 0; left: 0;
}
.image_reel img {float: left;}

/*--Paging Styles--*/
.paging {
	bottom: 40px; right: -170px;
	height:47px;
	z-index: 100; /*--Assures the paging stays on the top layer--*/
	text-align: center;
	line-height: 40px;
	background: url(paging_bg2.png) no-repeat;
	display: none; /*--Hidden by default, will be later shown with jQuery--*/
}
.paging a {
	padding: 5px;
	text-decoration: none;
	color: #fff;
}
.paging a.active {
	font-weight: bold;
	background: #920000;
	border: 1px solid #610000;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.paging a:hover {font-weight: bold;}
