/* overrides */
.page-body { background: url("../../images/db/overview/features-bg.jpg") 100% 0 no-repeat; margin: 0; padding: 30px 30px 0 30px; }
.page-header { height: 235px; }
.page-header .header-2 { font-size: 56px; }
.page-header .header-2 small.serif { font-size: 18px; }

/* layout */
.overview-left { width: 580px; float: left; }
.overview-left p { margin: 0 0 20px 0; }
.overview-left p:last-child { margin-bottom: 0; }
.overview-right { width: 325px; float: right; }

/* lore */
.lore .quote { margin-bottom: 20px; font-style: italic; font-size: 24px; color: #AD835A; }
.zh-tw .lore .quote { font-style:normal }
.ko-kr .lore .quote { font-style:normal; font-size:16px; }

.lore .read-story { text-align: right; padding-right: 10px; }

/* features */
.features { color: #221103; position: relative; background: url("../../images/db/overview/features-mid.jpg") repeat-y; }
.features-bot { background: url("../../images/db/overview/features-bot.jpg") 0 100% no-repeat; }
.features-top { padding: 85px 25px 75px 25px; background: url("../../images/db/overview/features-top.jpg") 0 0 no-repeat; min-height: 300px; }
.features .header-3 { color: #000; font-size: 18px; font-weight: bold; text-align: center; }
.features .crest { width: 250px; height: 250px; position: absolute; top: -160px; left: 35px; background: no-repeat; }
.features .d3-color-green { color: #3f4220 !important; font-weight: bold; }
.features li { padding-left: 75px; position: relative; margin-top: 25px; }
.features li .d3-icon-trait { position: absolute; top: 5px; left: -2px; }
.features li .d3-icon-skill { position: absolute; top: 5px; left: -2px; }
.features li .subheader-3 { color: #660000; font-weight: bold; text-transform: uppercase; padding-bottom: 5px; }
.features li .desc { font-size: 12px; line-height: 130%; display: block; }
.features li .desc p { margin: 0 0 10px 0; }

/* armor */
.armor { margin-bottom: 0; }
.armor .section-body { padding-top: 0; }
.armor .tiers { padding-top: 325px; background: no-repeat; }
.armor .tier { float: left; width: 152px; padding: 0 20px; border-left: 1px solid #262119; }
.armor .tier:first-child { border: 0; }

/* equipment */
.equipment .section-body { min-height: 185px; background: url("../../images/db/overview/equipment-bg.jpg") right 0 no-repeat; }
.equipment .bullet-list { margin-top: 25px; color: #5F584D; }
.equipment .equipment-icons { float: right; white-space: nowrap; margin: 10px 5px 20px 20px; }
.equipment .equipment-icons a { display: inline-block; vertical-align: top; margin-left: 10px; }
.equipment .view-all { text-align: right; padding-top: 14px; }

/* resource */
.resource { position: relative; background: url("../../images/db/overview/resource-bg.jpg") repeat-y; }
.resource-bot { background: url("../../images/db/overview/resource-bot.jpg") 0 100% no-repeat; }
.resource-top { background: url("../../images/db/overview/resource-top.jpg") 0 0 no-repeat; padding: 35px 25px 50px 25px; }
.resource p { margin: 15px 0 0 0; color: #7B6D55; }
.resource .header-3 { text-align: center; padding-top: 100px;}

/* links */
.more-links { width: 264px; min-height: 310px; margin: 15px auto; padding: 20px; background: url("../../images/db/overview/links-bg.jpg") 0 0 no-repeat; }
.more-links dt { margin-top: 15px; }
.more-links a { display: block; }
.more-links a span { color: #4E4536; }

/* screenshots */
.screenshots { margin-top: 10px; padding: 30px 0 10px 0; background: url("../../images/db/overview/screenshots-bg.jpg") 50% 0 no-repeat; }
.screenshots .media-frame { margin-left: 6px; }
.screenshots .view-all { text-align: right; padding-top: 14px; padding-right: 8px; }
.media-frame .mm a:hover .frame { background: rgba(0, 0, 0, .3) url("../../images/media/view-image.png") 50% 50% no-repeat; }

/* artwork */
.artwork { padding: 34px 0 0 15px; height: 215px; background: url("../../images/db/overview/artwork-bg.jpg") 0 0 no-repeat; }
.artwork .artwork-frame { width: 250px; height: 143px; margin: 1px; float: left; }
.artwork .artwork-frame a { display: block; width: 249px; height: 141px; border: 1px solid #000000; position: relative; }
.artwork .artwork-frame a:hover { border-color: #824c06; }
.artwork .artwork-frame a .frame { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0;
	box-shadow: inset 0 0 5px 2px #000; }
.artwork .artwork-frame a:hover .frame { background: rgba(0, 0, 0, .3) url("../../images/media/view-image.png") 50% 50% no-repeat; }
.artwork .artwork-frame.frame-0 { margin-right: 45px; }
.artwork .view-all { text-align: right; padding-top: 26px; padding-right: 9px; }

/* model */
.character-model { float: left; width: 0; height: 0; left: 0; top: 0; position: relative; z-index: 1; }
.character-model .model-canvas,
.character-model .model-canvas-holder,
.character-model .model-canvas .fallback { display: block; width: 315px;padding-left: 7px;height: 371px;padding-top: 9px; background: no-repeat; }
.character-model .model-canvas { position: absolute; left: -26px; top: 0; }
.character-model .model-toggler { position: absolute; width: 140px; height: 72px; left: 45px; top: 380px; }
.character-model .model-toggler a { display: block; width: 70px; height: 72px; float: left; background: url("../../images/db/overview/model-toggler.png") no-repeat; }
.character-model .model-toggler a.toggler-male { background-position: left top; }
.character-model .model-toggler a.toggler-female { background-position: right top; }
.character-model .model-toggler a.toggler-male:hover { background-position: left -72px; }
.character-model .model-toggler a.toggler-female:hover { background-position: right -72px; }
.character-model.hero-male .model-toggler a.toggler-male { background-position: left bottom !important; }
.character-model.hero-female .model-toggler a.toggler-female { background-position: right bottom !important; }

/* ie */
.ie67 .features,
.ie67 .features-top,
.ie67 .features-bot,
.ie67 .resource,
.ie67 .resource-top,
.ie67 .resource-bot,
.ie67 .more-links,
.ie67 .artwork,
.ie67 .screenshots,
.ie67 .character-model,
.ie67 .character-model .model-canvas,
.ie67 .character-model .model-canvas .fallback,
.ie67 .armor,
.ie67 .armor .tiers,
.ie67 .gameplay { display: block; zoom: 1;}
.ie67 .features li { margin-top: 10px; }
.ie67 .screenshots .media-frame { float: left; zoom: 1; display: block; position: relative; }

.ie6 .features li .d3-icon-trait { left: -75px; top: 15px; }
.ie6 .features-top { height: 300px; }

.ie7 .features li .d3-icon-trait { top: 25px; }
.ie7 .artwork .view-all,
.ie7 .screenshots .view-all,
.ie7 .equipment .view-all { padding-top: 0; }