/*  THIS WILL CONTAIN THE FRAMWORK CSS*/

/*
Element:  HTML's body tag.
*/

body{
	background:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheetBG.png") fixed left top #b8c6d1;
	background-position:0px 1928px;
	color:#262A2E;
	margin:0;
}



div{display: block;	}

#top{
        height: 128px;
        display:block;

}
#middle{

display:block;
}
#bottom{
	height:330px;
	background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheetBG.png");
	background-position:0px 594px;
	display:block;
	width:100%;
	margin-bottom:0;
}

/*
The Layout's design:

[#header]
	[#toparea]
    	[#topnavi]
    [#bottomnavi]
[#body]
[#footer]


[] Represents a div element
*/

/*
Element:  header
Description:  this stores the top and bottom navi.
*/
#header{
	height:128px;
	width:100%;
	margin-top:0px;
	background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheetBG.png");
	z-index:100;
}
/*
Element:  toparea
Parent:  header
Description:  This push downs the bottom navi, gives top navi room.
*/
#header #toparea{
	    padding:0px;
	width:1010px;
    display:block;

    margin: 0 auto;


}
/*
Element: topnavi
Parent:  toparea
Description:  This holds the chat, gallery, resources, and social networking links.
*/
#header #toparea #banner{
	margin:0px 16px 0px 15px;
	width:367px;
	height:73px;
	display:block;
	float:left;
	background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheet.png");
	background-position:0px 72px;
}

#header #toparea #topnavi{
	margin-right:0px;
    width:auto;
 
	float:left;
	z-index:105;
}
#header #toparea #topnavi ul{
	padding:0px;
	margin:2px 0px 2px 0px;
	display:inline;
}
#header #toparea #topnavi ul li{
	list-style:none;
	display:block;
    float:left;
    background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheet.png");
    
	margin-right:10px;
    height:27px;
	cursor:pointer;	
}
#header #toparea #topnavi ul li a{
	width: 100%;
    height: 100%;
    display:block;
}
#header #toparea #topnavi ul li img{
	border:0px;
	margin:0px;
}
/*
Elements:  news (class), gallery (class), resources (class), forums (class)
Parent:  topnavi
Description:  These are the various classes that are in the topnavi.  
Notes:  resources, and gallery have sub navigations, thus they get some extra css.
*/
#header #toparea #topnavi .news{
	width: 69px;
	background-position:480px 54px;
}
#header #toparea #topnavi .news:hover{
	background-position:480px 27px;
}
#header #toparea #topnavi .gallery{
	width: 82px;
	background-position:411px 54px;
}
#header #toparea #topnavi .gallery:hover{
	background-position:411px 27px;
}
#header #toparea #topnavi .media{
	width: 72px;
	background-position:329px 54px;
}
#header #toparea #topnavi .media:hover{
	background-position:329px 27px;
}
#header #toparea #topnavi .resources{
	width: 93px;
	background-position:257px 54px;
}
#header #toparea #topnavi .resources:hover{
	background-position:257px 27px;
}
#header #toparea #topnavi .chat{
	width: 66px;
	background-position:164px 54px;
}
#header #toparea #topnavi .chat:hover{
	background-position:164px 27px;
}
#header #toparea #topnavi .forums{
	width: 79px;
	background-position:98px 54px;
}
#header #toparea #topnavi .forums:hover{
	background-position:98px 27px;
}

#header #toparea #topnavi ul .socialnets{
	background:none;
	z-index:106;
}
#header #toparea #topnavi ul .socialnets a{
	float:left;
    display:block;
    width: 17px;
    height:17px;
    background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheet.png");
    margin-right:3px;
	margin-top:4px;
}
/*
Elements:  Social Network Mini-Links
Parent:  topnavi
Description:  This is the area for the minature links in the top navi.
*/
#header #toparea #topnavi ul .socialnets .twitter{
	background-position: 18px 72px;
}
#header #toparea #topnavi ul .socialnets .fb{
	background-position: 18px 54px;
}
#header #toparea #topnavi ul .socialnets .rss{
	background-position: 18px 36px;

}
#header #toparea #topnavi ul .socialnets .youtube{
	background-position: 18px 18px;

}
/*
Element:  sub navigation (system of css)
Parent:  topnavi
Description:  This is the CSS coding for the sub navigaiton for the link.s
*/
#header #toparea #topnavi li div{
    display:none;
    height:38px;
    width: 600px;
    margin-left:-210px;
    background: none;
    padding:2px 10px 2px 10px;
    z-index: 107;
    color: #FFF;
}
#header #toparea #topnavi li div ul{
    padding: 0px;
    margin: 0px;
    display:block;
}
#header #toparea #topnavi li div ul li{
    display: inline;
    margin-right:5px;
    width: 120px;
    background-image: none;
    background-color: #123955;
    font-size: 14px;
    height:15px;
    list-style:none;
    padding-bottom:3px;
    text-align: center;
}
#header #toparea #topnavi li div ul li:hover{
	color:  #d97523;
    background-color: #004677;
}
#header #toparea #topnavi li:hover div{
	display: block;
}
#header #toparea #topnavi li a{
    color:#e5e9ec;
    font-size: 13px;
    text-decoration: none;
	font-family:Lucida,Helvetica,sans-serif;
}
#header #toparea #topnavi li a:hover{
	color:#df873f;
}




/*
Elements:  bottomnavi
Parent:  header
Description:  This is the bottom navigation.  The navigation that contains the icons and links to walkthroughs.  

*/
#header #bottomnavi{
	display: block;
	margin: 0px auto;
	height:54px;
	width:1000px;
	color:#fff;
	text-align:left;
}
#header #bottomnavi ul{
	padding:0px;
	margin:0px;
	height:54px;
	display:inline;
}
#header #bottomnavi ul li{
	height:54px;
	width:54px;
	list-style:none;
	float:left;
	margin-right:17px;
	display:block;
	width:54px;
	height:54px;
	background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/SpriteSheet.png");
}
#header #bottomnavi ul li a{
 	display:block;
    width:100%;
    height:100%;

}
#header #bottomnavi ul li img{
	position:relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
}


/*
Elements:  Navigation buttons/icons
Description:  These image backgrounds, width/height (all the same).
*/
#header #bottomnavi .loz{
	background-position:0px 0px;
}
#header #bottomnavi .loz:hover{
	background-position:0px 126px;
}
#header #bottomnavi .aol{
	background-position:810px 0px;
}
#header #bottomnavi .aol:hover{
	background-position:810px 126px;
}
#header #bottomnavi .alttp{
	background-position:756px 0px;
}
#header #bottomnavi .alttp:hover{
	background-position:756px 126px;
}
#header #bottomnavi .la{
	background-position:702px 0px;
}
#header #bottomnavi .la:hover{
	background-position:702px 126px;
}
#header #bottomnavi .oot{
	background-position:648px 0px;
}
#header #bottomnavi .oot:hover{
	background-position:648px 126px;
}
#header #bottomnavi .mm{
	background-position:594px 0px;
}
#header #bottomnavi .mm:hover{
	background-position:594px 126px;
}
#header #bottomnavi .oos{
	background-position:540px 0px;
}
#header #bottomnavi .oos:hover{
	background-position:540px 126px;
}
#header #bottomnavi .ooa{
	background-position:486px 0px;
}
#header #bottomnavi .ooa:hover{
	background-position:486px 126px;
}
#header #bottomnavi .ww{
	background-position:432px 0px;
}
#header #bottomnavi .ww:hover{
	background-position:432px 126px;
}
#header #bottomnavi .mc{
	background-position:378px 0px;
}
#header #bottomnavi .mc:hover{
	background-position:378px 126px;
}
#header #bottomnavi .tp{
	background-position:324px 0px;
}
#header #bottomnavi .tp:hover{
	background-position:324px 126px;
}
#header #bottomnavi .ph{
	background-position:270px 0px;
}
#header #bottomnavi .ph:hover{
	background-position:270px 126px;
}
#header #bottomnavi .st{
	background-position:216px 0px;
}
#header #bottomnavi .st:hover{
	background-position:216px 126px;
}
#header #bottomnavi .wii{
	background-position:162px 0px;
}
#header #bottomnavi .wii:hover{
	background-position:162px 126px;
}


/*
Element:  sub navigation (system of css)
Parent:  bottomnavi
Description:  This is the CSS coding for the sub navigaiton for the links.
*/
#header #bottomnavi ul li div
{
	font-family:Verdana;
	font-size:13px;
	display:none;
	position:absolute;
	cursor:pointer;
	z-index:101;
	height:auto;
	color:#000;
}
#header #bottomnavi ul li div a{
	color:#fff;
	text-decoration: none;
}
#header #bottomnavi ul li:hover div{
	display:block;

}

#header #bottomnavi ul li:hover div ul li div{
	display:none;


}
#header #bottomnavi ul li div ul{
	pading:0px;
	margin:0px;
	display:block;
	height:auto;
}#header #bottomnavi ul li div span a{
	
    display:inline;
}
#header #bottomnavi ul li div ul li{
    list-style:none;
    display:block;
    float:none;
    height:18px;
    padding:2px;
    background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/MenuArrow.gif");
    background-color:#99bdec;
	background-repeat:no-repeat;
	background-position:center right;
    width:165px;
    border:solid #000;
	border-top-width:0px;
	border-left-width:1px;
	border-bottom-width:1px;
	border-right-width:1px;
    z-index:9999;
}
#header #bottomnavi ul li .rightSub{

     margin: 0px 0px 0px -118px;

}
#header #bottomnavi ul li .rightSub ul li{
padding:2px;
	background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/MenuArrow2.gif");
	background-color:#99bdec;
	background-repeat:no-repeat;
	background-position:center left;
	z-index:102;
}
#header #bottomnavi ul li .rightSub ul li span{
	margin-left:10px;
	
}
#header #bottomnavi ul li .rightSub ul li span a{
	display:inline;
}
#header #bottomnavi ul li .rightSub ul li div{
	display:none;
    margin: -19px 0px 0px -168px;

}
#header #bottomnavi ul li .rightSub ul li div ul li{

	background-image:none;
}
#header #bottomnavi ul li div ul li div{
	display:none;
	margin: -19px 0px 0px 167px;

}
#header #bottomnavi ul li div ul li:hover div{
	display:block;
}
#header #bottomnavi ul li div ul li:hover{
	background-color:#c6deff;
}
#header #bottomnavi ul li div ul li a{
	color: #000;
}
#header #bottomnavi ul li div ul li div ul li{
	background-image:none;
	width:160px;
}
/*
Elements:  body
Description:  This is where the main content is contained.
*/
#content {
	display: block;
    height:100%;
	margin-left:auto;
    width:1020px;
	margin-right:auto;

    }
#body{
	background-color:#D4D8DC;
	background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/Background.png");
	border:1px solid #8DA1AF;
	width:1000px;
	margin: 0px auto 0px auto;
	padding:10px;
	font-family:Verdana,Helvetica,sans-serif;
}
/*
Elements:  clearLeft (class)
Description:  this is a class that will clear all floats towards the left.

*/
.clearLeft{
	clear:left;
	padding:0px;
	margin:0px;
	line-height:0px;
}
/*
Elements:  sidebar
Description:  This is the right navigation area.
*/

#sidebar{
	width:250px;
	border: 1px solid #000;
	float:left;
	bottom:auto;
	margin-left:10px;
	margin-top:0px;
	background-color:#dde4f4;
}
#sidebar a{
	text-decoration: none;
    font-size:12px;
}
#sidebar h2, .widgettitle{
	font-size:15px;
    height:20px;
    display:block; 	width:100%;
    margin: 0px;
    text-align:center;
    border-bottom: 1px solid #000;
   /* background-color:#94AFFF; */
    background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/Box2Color.png");
    
}
#sidebar ul{
	padding:0px;
	margin: auto 0;
	position:relative;
	display:block;
	width: 100%;
	float:none;
}
#sidebar ul li{
	list-style:none;
	display:block;
	border-bottom:1px solid #000;
}
#sidebar ul li ul{
	margin:0px;
	width:80%;
	margin: 5px 0px 20px 10px;
	display:block;
}
#sidebar ul li ul li{
	margin:0px;
	width:auto;
	border:none;
}


#sidebar .youtubeVId
{
	width:100%
    overflow:hidden;
    overflow:hidden;
    position:relative;
    display:block;
    height:250px;
}
#body #postArea{
	position:relative;
	float:left;
    display:block;
    width:730px;
    margin-left:3px;
}
#body #postArea .post{
	border:1px solid #000;
    display:block;
	overflow:hidden;
    margin-bottom:10px;
    font-size: 12px;
  
}
#body #postArea .post .postTitle{
	width:722px;
    padding:3px;
    background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/Box1Color.png");
    border-bottom:1px solid #000;
    
}

#body #postArea .post .postTitle img, #body .post2 .postTitle img{
	display:block;
    float:right;
    margin-top:7px;
}
#body #postArea .post h2{
	font-size:15px;
    margin:0px;
    display:inline;
    
}
#body #postArea .post h3{
	font-size:15px;
    margin:0px;
    display:inline;
}
#body #postArea .post a{
	text-decoration:none;
}
#body #postArea .post h2 a{
	color:#000;
    text-decoration: none;
}
#body #postArea .post h3 a{
	color:#000;
    text-decoration: none;
}
#body .post2{
	border:1px solid #000;
    margin: auto 0;
    width:100%;
    margin-bottom:10px;
    font-size: 14px;
    overflow:hidden;
  
}
#body .post2 .postTitle{

    padding:3px;
    background-image:url("http://zeldadungeon.net/Justin/wordpress/wp-content/themes/default/images/Box1Color.png");
    border-bottom:1px solid #000;
    
}
#body .post2 h2{
	font-size:20px;
    text-align:middle;
    margin:0px;
    display:inline;
    
}
#body .postmetadata{
	display:block;
    
}
#body .post2 .entry{

    display:block;
    margin-left:auto;
    margin-right:auto;
    padding:5px;
    text-align:justify;
}
#body .post2 object{
	display:block;
    margin-left:auto;
    margin-right:auto;
}
#body #postArea .post .entry
{	display:block;
		padding:5px;
        text-align:justify;
        
    height: auto;
}

#body #postArea .post .postmetadata{
	border-top:1px solid #c1c4c7;
	display:block;
	width:100%;
	padding:3px;
}
.commentlist{
	font-size: 12px;

    padding:3px;
}
.commentlist li{
	list-style:none;
    display: block;
    border: 1px solid #000;
}
#footer{
	height:330px;
	color: #627388;
	font-size:11px;
	font-family:Verdana;
	width:1000px;
	display:block;
    	margin:auto auto auto auto;
    position:relative;
	clear: both;
	overflow:hidden;
}
#footer a{
	color: #798D9D;
	text-decoration:none;
	font-family:Tohma,Helvetica,Serif;
	font-size:11px;
}
#footer a:hover{
	color:#98b3c1;
}
#footer h2{
	display: inline;
	color:#485e78;
	font-size:18px;
	font-family:Tohma,Helvetica,Serif;
	font-weight:bold;
	margin:0px 0px 0px 12px;
}
#footer #left{
	margin:0px 20px 0px 0px;
	float:left;
	text-align:center;
	width:460px;
	height:100%;
}
#footer #left ul{
	padding:0px;
	display:block;
	bottom:0px;
}
#footer #left ul li{
	display:inline;
	list-style:none;
	margin:10px 16px 0px 0px;
}
#footer #right{
	float:left;
	text-align:center;
	height:100%;
}
#footer #right ul{
	margin:8px 0px 0px 0px;
	display:block;
	float:left;
}
#footer #right ul li{
	margin:1px 0px 0px 0px;
	display:block;
	text-align:left;
	list-style:none;
}
.flashEmbed{
	margin-left:auto;
	margin-right:auto;
	display:relative;
	display:block;
}