/* 
    Document   : site
    Created on : 06-Oct-2009, 14:06:11
    Author     : stylefoundry ltd <info@stylefoundry.co.uk>
    Description: Main stylesheet for the initial website launch. This will be completely changed on reciept of signed off designs.
*/


@font-face {
 font-family: DragonAge;
 src: url("../fonts/dragonage_09.eot"); /* EOT file for IE */
}

@font-face {
 font-family: DragonAge;
 src: url("../fonts/dragonage_09.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

@font-face {
 font-family: NoGard;
 src: url("../fonts/nogard_text_08.eot"); /* EOT file for IE */
}

@font-face {
 font-family: NoGard;
 src: url("../fonts/nogard_text_08.ttf") format("truetype"); /* TTF file for CSS3 browsers */
}

body {
	background-image: url(../images/DA_bground.jpg);
	background-repeat: no-repeat;
	background-color: #000000;
	margin-left: 0px;
	margin-top: 0px;
        font-family: NoGard,Verdana, Helvetica, sans-serif;
        font-size: 12px;
}

img,div {
  behavior: url('iepngfix.htc'); 
}

div.read-more a {
    letter-spacing: 1px;
}

span.highlight {
  font-size: 9px;
  color: red;
}

#game {
	position:absolute;
	left:204px;
	top: 146px;
	width:800px;
	height:600px;
        background-color: #000;
}

#panels {
	position:absolute;
	left:0px;
	top:146px;
        height: 618px;
	color: #ccc;
        width:205px;
        background-color: #000;
        background: transparent url('../images/sidepanel_questachieve.gif') no-repeat;
}

.panel
{
    height: 600px;
    width: 205px;
    position: relative;
    overflow: hidden;
    display: none;
}

#slain {
  background: transparent url('../images/sidepanel_slain.gif') no-repeat;
  height:570px; 
}

#social,#extras,#unlocks {
  background: transparent url('../images/sidepanel_normal.gif') no-repeat;
  height:570px; 
}

#panels div.items
{
  position: absolute;
  margin-top: 10px;
  height: 2000em;
}

#panels div.description {
  width: 90%;
}

#panels .title {
   color:  #ffe17d;
   font-size: 14px; 
   width: 90%;
}

#slain .total {
   color:  #be0000;
   font-size: 15px; 
}

.killed {
   color:  #be0000;
   font-size: 15px; 
}

#slain .recent {
   font-size: 15px;
}

.panel-item
{
    margin: 0px 5px 0 5px;
    padding-top: 0px;
    width: 195px;
    height: 112px;
    color: #fff; 
    font-size: 11px;
    overflow: hidden;
}

#slain .panel-item {
  height: 113px;
}

#legal
{
  height: 160px;
  width: 155px;
}

.glow {
    background: transparent url('../images/sparkle.gif') no-repeat;
}


.panel-item-image
{
    float: left;
    width: 64px;
    height: 64px;
    overflow:hidden;
}

#slain .panel-item-image
{
   background: none;
   overflow:visible;
}

#unlocks .panel-item-image {
    background: none;
}

#social .panel-item-image, #extras .panel-item-image {
   float: none;
   width: 72px;
   height: 65px;
   margin-left: 15px;
}

.panel-item-text
{
    float: right;
    margin-right: 33px;
    width: 95px;
}

#slain .panel-item-text
{
    width: 95px;  
    margin-right: 30px;
}

#social .panel-item-text,#extras .panel-item-text {
    margin-left: 15px;
    width: 150px;
    float: left;
}

#panels .title
{
    font-weight: bold;
    margin-bottom: 2px;
}

#controls{
	position:absolute;
	left:16px;
	top:118px;
	height:23px;
        z-index: 2;
}

#controls ul,#twitterControls ul
{
    margin: 0px;
    padding: 0px;
    display: block;
}

#controls li,#twitterControls li 
{
    float: left;
    list-style-type: none;
    padding: 0px 5px 0px 5px;
}

#controls .activeUpdates
{
    position:relative;
    top: -40px;
    left:-10px; 
    font-weight: bold;
    text-align: center;
    padding-top: 5px;
    color: #fff;
    width: 30px;
    height: 33px;
    background: transparent url('../images/alertsplat.png') no-repeat;
    display: none;
    text-decoration: none;
}

#quests .panel-item-image
{
    background: transparent url('../images/quests/combined.gif') no-repeat;
}

#quests .locked
{
    background-position: 0px 0px;
}

#quests .bronze
{
    background-position: 0px -64px;
}

#quests .silver
{
    background-position: 0px -128px;
}

#quests .gold
{
    background-position: 0px -192px;
}

/* the overlayed element */
div.simple_overlay,div.faq_overlay {
    /* must be initially hidden */
    display:none;
    /* place overlay on top of other elements */
    z-index:9998;
    /* styling */
    background-color: #000;
    width:600px;
    min-height:200px;
    border:2px solid rgb(103,101,75);
    border:1px solid rgba(103,101,75,0.5);
    -moz-border-radius: 15px;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    /* CSS3 styling for latest browsers */
    -moz-box-shadow:0 0 10px 2px rgba(103,101,75,0.5);
    -webkit-box-shadow: 0 0 10px 2px rgba(103,101,75,0.5);
    box-shadow: 0 0 10px 2px rgba(103,101,75,0.5);
    padding: 20px 10px 10px 10px;
    color: #ffffcc;
    font-weight: bold;
    letter-spacing: 0.1em;
    font-size: 1.2em;
    opacity: 0.9;
    filter: alpha(opacity=90);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
}

div.faq_overlay {
  width: 580px;
  font-size: 1.0em;
  background-image: none;
  background-color: #000;
  background-color: #000;
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

/* close button positioned on upper right corner */
div.close {
    background: transparent url(../images/closeDual.png) no-repeat;
    position:absolute;
    top: 8px;
    right: 8px;
    cursor:pointer;
    height:41px;
    width:34px;
}

div.close:hover {
  background-position: 0px -41px;
}

.simple_overlay li
{
    color: #06CC00;
}
 
#surveyOverlay {
  width: 960px;
}

#videoOverlay {
  width: 660px;
  height: 600px;
}

#faqsOverlay,#surveyOverlay,#videoOverlay,#tweetsOverlay,#blogsOverlay {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

div.blog {
  background-image: none;
  background: #000;
  padding-top: 40px;
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

div.contentWrap { 
   padding: 5px;
   background-color: #000;
   height:550px; 
   overflow: auto;
   margin: 20px 0px 0px 0px;
   padding: 20px;
   opacity: 1;
   filter: alpha(opacity=100);
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

#blogsOverlay .contentWrap, #tweetsOverlay .contentWrap, #faqsOverlay .contentWrap {
   background: #000 url('../images/tweetpage.png') no-repeat;
}

div.tooltip {
    background: transparent url('../images/esrbmature.gif') no-repeat;
    width: 150px;
    height: 86px; 
    display: none;
    z-index:9999;
}

.faqtip {
    top: 0px;
    left: 0px;
    background: #000;
    display: none;
    width: 590px;
    height: 300px; 
    display: none;
    z-index:9999999;
}

div.disabled {
    display: none;
}

.scroll-actions {
    text-align: center;
    width: 112px;
}

#nextPage {
  width: 54px;
  height: 58px;
  float: right;
  padding-top: 20px;
  background: transparent url('../images/next.gif') no-repeat;
  cursor: pointer;
}

#prevPage {
  width: 54px;
  height: 58px;
  float: left;
  padding-top: 20px;
  background: transparent url('../images/prev.gif') no-repeat;
  cursor: pointer;
}

.description {
  color: #ffc;
}

#creditsDescription {
 text-align: center;
 font-size: 10px;
 padding-top: 40px;
 
}
#creditsDescription div.credits {
  margin: auto;
  width: 450px;
}

div.hr {
  width: 450px;
  height: 15px;
  background: transparent url('../images/hr-bground.gif') no-repeat scroll center;
  clear: both;
}

#creditsDescription h2 {
  color: #fff;
  font-size: 18px;
}
#creditsDescription h3 {
  color: #fff;
  font-size: 14px;
}
#creditsDescription h4 {
  color: #fff;
  font-size: 14px;
}

#creditsDescription p {
  padding-bottom: 10px;
}

.white { 
  color: #fff;
}
div.title-row-2col div.title-col {
  width: 225px;
  float: left;
}
div.title-row-3col div.title-col {
  width: 150px;
  float: left;
}

a {
 padding: 1px;
}

a:link {
	text-decoration: none;
	color: #FFFFFF;
        padding: 1px;
}

a:visited {
	text-decoration: none;
	color: #FFFFFF;
}

a:hover {
	text-decoration: none;
        color: #ffe17d;
}

#controls a:hover, #controls a.active,#twitterControls a:hover, #twitterControls a.active {
       color: #ffe17d;
       outline: none;
}

a:focus {
    outline: none;
    border: none;
}

a:active {
	text-decoration: none;
        border: none;
        outline: none;
}

/* Rex Styles */

#apDiv1 {
	position:absolute;
	left:16px;
	top:118px;
	width:390px;   /*325*/
	height:23px;
	z-index:3;
}
#apDiv2 {
	position:absolute;
	left:701px;
	top:118px;
	width:276px;
	height:38px;
	z-index:4;
}
#apDiv3 {
	position:absolute;
	left:175px;
	top:794px;
	width:831px;
	height:243px;
	z-index:5;
}

#apDiv4 {
	position:absolute;
	left:823px;
	top:118px;
	width:154px;
	height:22px;
	z-index:6;
}

.style1 {color: #FFFFFF}

#apDiv5 {
	position:absolute;
	left:970px;
	top:110px;
	width:13px;
	height:13px;
	z-index:7;
}
#apDiv6 {
	position:absolute;
	left:0px;
	top:795px;
	width:315px;
	height:123px;
	z-index:8;
}

#soondiv {
	position:absolute;
	left:345px;
	top:119px;
	width:173px;
	height:32px;
	z-index:11;
	visibility: hidden;
}
.style2 {color: #FFCC00}
#apDiv7 {
	position:absolute;
	left: 200px;
	top: 816px;
	width:155px;
	height:24px;
	z-index:12;
}

#feedback {
  position: absolute;
  top: 760px;
  left: 435px;
}

#apDiv8 {
	position:absolute;
	left:0px;
	top:620px;
	width:151px;
	height:103px;
	z-index:13;
}
#apDiv9 {
	position:absolute;
	left:0px;
	top:148px;
	width:181px;
	height:393px;
	z-index:14;
}
#apDiv10 {
	position:absolute;
	left:202px;
	top:757px;
	width:217px;
	height:28px;
	z-index:14;
}
#apDiv11 {
	position:absolute;
	left:202px;
	top:794px;
	width:188px;
	height:31px;
	z-index:15;
}
#apDiv12 {
	position:absolute;
	left:750px;
	top:72px;
	width:91px;
	height:68px;
	z-index:14;
}
#apDiv5 {
	position:absolute;
	left:970px;
	top:110px;
	width:13px;
	height:13px;
	z-index:7;
}
#apDiv6 {
	position:absolute;
	left:0px;
	top:795px;
	width:315px;
	height:123px;
	z-index:8;
}


/* stylish.css inclusion */
.Menutitles {
	font-size: 12px;
	color: #ffffff;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333333;
	padding-right: 5px;
	padding-left: 5px;
}
.Menutitlesactive {
	font-size: 12px;
	color: #ffffff;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333333;
	padding-right: 5px;
	padding-left: 5px;
	text-decoration: none;
}
.Logintitles {
	font-size: 12px;
	color: #666666;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333333;
	padding-right: 5px;
	padding-left: 5px;
	background-position: right;
}
.Logintitlesactive {
	font-size: 12px;
	color: #ffffff;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333333;
	padding-right: 5px;
	padding-left: 5px;
	text-decoration: none;
	text-align: right;
}
.standardbody {
	font-size: 12px;
	color: #ffffff;

}
.footertext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
}
#headRollover {
    position: absolute;
    left: 225px;
    top: 0px;
}
#headRollover:hover { background-image: url(../images/headerOver.png); }
#closeRollover {
    position: absolute;
    left: 590px;
    top: 140px;
    background-image: url(../images/close.png);
    background-repeat: no-repeat;
    width: 34px;
    height: 41px;
}
#closeRollover:hover { background-image: url(../images/closeOver.png); }
#preorderDA {
    position:absolute;
    left: 0px;
    top: 822px;
    width: 125px;
    height: 122px;
    background: transparent url(../images/buynowDA.png) no-repeat;
    z-index: 99;
}
#footDragonAgeLogo {
    position:absolute;
    left: 157px;
    top: 892px;
    width: 197px;
    height: 138px;
    background: transparent url(../images/dragonAgeOriginsLogo.png) no-repeat;
    z-index: 99;
}
#footerLegal {
   position: absolute;
   left: 25px;
   top: 960px;
   z-index: 100;
   width: 375px;
}

.row {
 padding: 0px 20px 0px 20px;
}

#followus,#twitterControls,.scroll-actions {
 padding: 0px 15px 0px 15px;
}