body
{
	color: #FFF;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 1.1em;
	margin: 0 auto;
	overflow-x: hidden;
	overflow-y: scroll;
}
body > form > header
{
	margin: 21px auto 5px;
}
body > form > header img
{
	display: block;
	margin: 0 auto;
}
body > form > footer
{
	font-size: .85em;
	margin: 0 auto;
	margin-top: 30px;
	width: 992px;
}
body > form > footer > img
{
	display: inline-block;
	margin: 0;
	margin-right: 13px;
	vertical-align: top;
}
body > form > footer img#stardock
{
	margin-right: 13px;
    margin-top: 22px;
}
body > form > footer img#windows
{
	margin-top: 10px;
}
body > form > footer img#havok
{
	margin-top: 14px;
}
body > form > footer > div.copyright
{
	display: inline-block;
	height: 65px;
	margin-right: 13px;
	width: 577px;
	*display: inline; /* IE7 fix: Without this and line below, the footer images are above/below copyright instead of next to it */
	text-align: left;
	vertical-align: top;
	zoom: 1;
}
body > form > footer p
{
    font: normal 11px Helvetica, Arial, sans-serif;
	margin: 0 0 1em 0;
}
body > form > footer > div.copyright a
{
	color: #FFFFFF;
	text-decoration: none;
}
body > form > footer > div.copyright a:hover
{
	text-decoration: underline;
}

.clearb
{
	clear: both;
}

/* #region Nav Bar */

#sitenav
{
	background-image: url('/shared/images/layout/lh/top-nav.png');
	background-position: center top;
	background-repeat: no-repeat;
	height: 35px;
	margin: 0 auto;
	text-align: center;
	z-index: 15;
}
#sitenav > .sitenav_container
{
	margin: 0 auto;
	width: 870px;
}
#sitenav > .sitenav_container > a > img.storeButton
{
    position: relative;
    right: -25px;
    z-index: 100;
}
#sitenav > .sitenav_container > ul
{
	display: block;
	float: left;
	margin-left: -110px;
	margin-top: 1px;
    padding-left: 0;
	vertical-align: top;
}
#sitenav > .sitenav_container > ul > li /* Main nav item */
{
	display: inline-block;
	text-align: left;
	z-index: 20;
	*display: inline; /* IE7 fix: Without this, the nav links are one above another instead of next to each other */
	zoom: 1; /* IE7 fix: Without this, the dropdown causes odd glitches in the navigation on mouseover */
}

/* #region Main Nav Items */

#sitenav > .sitenav_container > ul > li
{
	height: 33px;
	margin: 0 10px;
}
#sitenav > .sitenav_container > ul > li > a
{
	background-image: url('/shared/images/layout/fe/top-nav-menu3.png');
	display: block;
	*display: inline-block; /* IE7 fix: Without this, the nav link shifts down 5 pixels for no reason */
	height: 33px;
	*height: 29px; /* IE7 fix: without this, you can't actually mouseover the dropdown as it disappears due to spacing between the nav link and dropdown */
	margin: 0 auto;
}
#sitenav > .sitenav_container a span
{
	display: none;
}
#nav_home
{
    width: 104px;
}
#nav_home.active > a
{
    background-position: 0 -33px;
}
#nav_home > a
{
    background-position: 0 0;
}
#nav_home > a:hover 
{
    background-position: 0 -33px;
}
#nav_games
{
	width: 108px;
}
#nav_games.active > a
{
	background-position: -109px -33px;
}
#nav_games > a
{
	background-position: -109px 0;
	width: 104px;
}
#nav_games > a:hover
{
	background-position: -109px -33px;
}
#nav_lore
{
	width: 104px;
}
#nav_lore.active > a
{
	background-position: -208px -33px;
}
#nav_lore > a
{
	background-position: -208px 0;
	width: 104px;
}
#nav_lore > a:hover
{
	background-position: -208px -33px;
}
#nav_journals
{
	width: 134px;
}
#nav_journals.active > a
{
	background-position: -312px -33px;
}
#nav_journals > a
{
	background-position: -312px 0;
	width: 104px;
}
#nav_journals > a:hover
{
	background-position: -312px -33px;
}
#nav_forums
{
	width: 119px;
}
#nav_forums.active > a
{
	background-position: -416px -33px;
}
#nav_forums > a
{
	background-position: -416px 0;
	width: 104px;
}
#nav_forums > a:hover
{
	background-position: -416px -33px;
}
#nav_stardocknet
{
	width: 144px;
}
#nav_stardocknet.active > a
{
	background-position: -626px -33px;
}
#nav_stardocknet > a
{
	background-position: -626px 0;
	width: 144px;
}
#nav_stardocknet > a:hover
{
	background-position: -626px -33px;
}

/* #endregion */

/* #region Sub Nav */

#sitenav > .sitenav_container > ul > li ul
{
	background: url('/shared/images/layout/ele/dropdown-bg.png');
	background-position: 0 0;
	background-size: 194px 84px;
	background-repeat: no-repeat;
	display: none;
	height: 84px;
    list-style-type: none;
    padding: 0;
	width: 194px;
	z-index: 10;
}
#sitenav > .sitenav_container > ul li:hover > ul
{
	display: block;
}
#sitenav > .sitenav_container > ul > li > ul > li
{
	background: url('/shared/images/layout/ele/dropdown-sprite.png?20111205');
	background-position: 0 0;
	height: 29px;
	*height: 26px; /* IE7 fix: Without this, the first dropdown item can be moused over, but the second cannot due to spacing between the first and second items */
	position: relative;
	text-align: left;
	width: 194px;
}
#sitenav > .sitenav_container > ul > li > ul > li > a
{
	color: #FFF;
	display: block;
	float: left;
	text-align: left;
	text-decoration: none;
}
#sitenav > .sitenav_container > ul > li ul > li > a
{
	width: 194px;
}
#sitenav > .sitenav_container > ul > li > ul > li:hover
{
	background-position: 0 -29px;
}

/* #endregion */
#sitenav > .sitenav_container > ul > li > ul li
{
	
}
    #sitenav > .sitenav_container > ul > li > ul li a {
        background-image: url('//www.stardock.com/elemental/fallen-enchantress/top-nav-submenu-2.png');
        background-repeat: no-repeat;
        height: 29px;
        margin: 0;
        margin-left: 9px;
    }
#nav_wom > a {
    background-position: 0 -145px;
}
#nav_elereforged > a {
    background-position: 0 -116px;
}

#nav_sorcererking > a {
    background-position: 0 -87px;
}
#nav_legendaryheroes > a
{
	background-position: 0 -58px;
}
#nav_fallenenchantress > a
{
	background-position: 0 -29px;
}
#nav_feultimate > a
{
	background-position: 0 0;
}

/* #endregion */

/* #region Middle bar */

div.middlebar > div
{
	background-position: center bottom;
	background-repeat: no-repeat;
	height: 62px;
	margin-top: 243px;
	padding-top: 6px;
	text-align: center;
}
div.middlebar > div > div
{
    margin: 0 auto;
    padding-left: 516px;
}
div.middlebar > div.topbar_blue
{
	background-image: url('/shared/images/layout/middlebar-bg-blue.png');
}
div.middlebar > div.topbar_red
{
	background-image: url('/shared/images/layout/middlebar-bg-red.png');
}

/* #region Middle bar page padding */

div.middlebar > div.page_left
{
	margin-top: 20px;
}
div.middlebar > div.page_home
{
	margin-top: 20px;
	padding-left: 588px;
}
div.middlebar > div.topbar_blue.page_landing
{
	background-image: url('/shared/images/layout/middlebar-bg-blue3.png');
	margin-top: 20px;
}

/* #endregion */

div.middlebar > div > div.left
{
	margin: 0 auto;
    padding-left: 0;
	text-align: left;
	width: 994px;
}

div.middlebar > div > div > .textblock
{
	font-size: 0;
	display: inline-block;
	*display: inline; /* IE7 fix: Without this, the images are above/below each other instead of next to each other */
}
div.middlebar > div > div > .textblock > .textblockbg
{
	background-image: url('/shared/images/layout/middlebar-textblock-bg.png');
	background-repeat: repeat-x;
	padding: 0 48px;
	display: inline-block;
	*display: inline; /* IE7 fix: Without this, the images are above/below each other instead of next to each other */
	line-height: 61px;
	height: 61px;
	vertical-align: top;
	margin: 0;
	zoom: 1; /* IE7 fix: Without this, the text is top-aligned */
}
div.middlebar > div > div > .textblock > .textblockbg > img
{
	margin-top: 6px;
	vertical-align: middle;
}
div.middlebar > div > div > .textblock > .textblockbg > a > img
{
	margin-top: 6px;
	vertical-align: middle;
}
div.middlebar > div > div > .sociallogin
{
	display: inline-block;
	*display: inline; /* IE7 fix: Without this, the images are above/below each other instead of next to each other */
	margin-top: 8px;
	text-align: left;
	vertical-align: top;
    width: 100px;
	zoom: 1; /* IE7 fix: Without this, the text is top-aligned */
}
div.middlebar > div > div > .sociallogin > .accountlinks
{
	color: #979593;
	font-size: 0.9em;
	margin-top: 8px;
	overflow: hidden;
	width: 210px;
}
div.middlebar > div > div > .sociallogin > .accountlinks a
{
	color: #979593;
	text-decoration: none;
}
div.middlebar > div > div > .sociallogin > .accountlinks a:hover
{
	text-decoration: underline;
}

/* #endregion */

/* #region Nav bar */

div.navbar > div
{
	background-position: center bottom;
	background-repeat: no-repeat;
	height: 62px;
	padding-top: 6px;
	text-align: center;
}
div.navbar > div > div
{
    margin: 0 auto;
    padding-left: 75px;
}
div.navbar > div.topbar_blue
{
	background-image: url('/shared/images/layout/middlebar-bg-blue.png');
}
div.navbar > div.topbar_red
{
	background-image: url('/shared/images/layout/middlebar-bg-red.png');
}

/* #region Nav bar page padding */

div.navbar > div.page_left
{
	margin-top: 20px;
}
div.navbar > div.page_home
{
	margin-top: 20px;
	padding-left: 588px;
}
div.navbar > div.topbar_blue.page_landing
{
	background-image: url('/shared/images/layout/middlebar-bg-blue3.png');
	margin-top: 20px;
}

/* #endregion */

div.navbar > div > div.left
{
	margin: 0 auto;
    padding-left: 0;
	text-align: left;
	width: 994px;
}
div.navbar > div > div > .sociallogin
{
	display: inline-block;
	*display: inline; /* IE7 fix: Without this, the images are above/below each other instead of next to each other */
	margin-top: 8px;
	text-align: left;
	vertical-align: top;
    width: 100px;
	zoom: 1; /* IE7 fix: Without this, the text is top-aligned */
}
div.navbar > div > div > .sociallogin > .accountlinks
{
	color: #979593;
	font-size: 0.9em;
	margin-top: 8px;
	overflow: hidden;
	width: 210px;
}
div.navbar > div > div > .sociallogin > .accountlinks a
{
	color: #979593;
	text-decoration: none;
}
div.navbar > div > div > .sociallogin > .accountlinks a:hover
{
	text-decoration: underline;
}

/* #endregion */

/* #region Popups */

#loginpopup 
{
	background-color: #a9a9a7;
	padding: 20px; 
}
#loginpopup .logintable 
{ 
	font-size: 12pt; 
}
#loginpopup .logintable tr td.desc 
{ 
	padding-right: 10px; 
}
#loginpopup .logintable tr.footer td 
{ 
	padding-top: 10px; 
}
#loginpopup a 
{ 
	color: #000; 
	font-size: 10pt;
	text-decoration: none;
}
#loginpopup a:hover
{
	text-decoration: underline;
}
#loginpopup input.inputtext 
{
	width: 150px;
}

#registerpopup 
{
	background-color: #a9a9a7;
	padding: 20px;
	width: 312px;
}
#registerpopup p 
{
	margin-bottom: 15px;
}
#registerpopup .registertable tr td.desc 
{ 
	padding-right: 10px; 
}
#registerpopup input.inputtext 
{
	width: 150px;
}

/* #endregion */