/*
Theme Name: Torchlight
Theme URI: www.torchlightgame.com
Description: Torchlight Game
Author: Ben @ Runic Games dot com
Author URI: www.torchlightgame.com
Version: 1.0
*/
html, body { height: 100.1%; width: 100%; margin-bottom: 1px; }
body { margin: 0px; padding: 0px; text-align: center; font-family: Arial, Helvetica, Sans-Serif; font-size: 0.9em;background-color: #221409;color:#A18C53; background-image: url(images/page-gradient.jpg); background-repeat: repeat-x;}
a {text-decoration: none; font-size:0.9em; color: #BB3500; }
a:visited { color:#aa3000;}
a:hover {color: #e55904;}

td { font-family: Arial, Helvetica, Sans-Serif; font-size: 0.9em; vertical-align: top; }
h2 { margin: 0px; }
hr { color: #443721; width: 80%; height: 1px; border-style: solid;}

fieldset { border-width: 0px; }

.alignright { float: right; }
.alignleft { float: left; }
.clear { clear:both;}
.imagebutton {cursor: pointer;}
.imagecolumn { vertical-align: top;}

.sidebar-thumbnail {float:left;margin-right: 5px;margin-top: 5px;}

#container { width: 950px; margin: 0px auto; padding: 15px; text-align: left; background-repeat: repeat-x;} /*  background-image: url(images/content-background.jpg); */
#header { margin: 0px; text-align: center; }
#header .banner { margin: 0px auto; padding: 5px; width: 940px; text-align: center; }
#header #nav { margin: 0px auto; height: 44px; width: 730px; text-align: center; background: url(images/navbar-back.png) repeat-x;  } /* 730:610 */
#content { width: 100%; padding: 0px; margin:0px; position: relative;}

.column-small { float: left; width: 200px; }
.column-large {float: left; width: 740px; margin: 0px; margin-left: 10px; }
.column-medium { float: left; width: 530px; margin: 0px 10px; }

.post {margin-bottom: 20px;padding-left: 10px; padding-right: 10px;}

#footer { width: 100%; text-align: center; clear: both; font-size: 0.75em; }
#footer a { font-size: 1.0em;}
#footer .banner {text-align:center; margin: 0px auto; padding:5px;padding-top:0px;}
#footer #footernav { }
#footer #footernav ul { margin: 0px; padding: 0px; list-style-type: none; }
#footer #footernav ul li { display: inline; margin: 0px 10px; }

.media-column {width:50%;}
.media-section { width: 100%; text-align: center;}
.trailer { text-align: center; margin-left: 24px; margin-right: 24px; margin-bottom: 10px; }
.trailer-doublewide { text-align: center; margin-left: 133px; margin-right: 24px; margin-bottom: 10px; }
.wallpaper, .screenshot, .concept, .animation {margin-right: 10px; margin-bottom: 10px; text-align: center;}
.animation { width: 121px; margin-left: 10px; }
.wallpaper, .screenshot { margin-left: 15px; margin-right: 15px;}
.concept { margin-left: 8px; margin-right: 8px;}
.screenshot .thumbnail { width: 111px; height: 69px;}
.concept .thumbnail { width: 69px; height: 99px;}
.wallpaper .thumbnail { width: 111px; height: 83px;}
.avatar {width: 130px; margin-left: 10px; margin-bottom: 15px; text-align: center;}
.media-sidebar-box { margin-bottom: 20px; width: 100%; text-align: center; }
div.media-rule {background-image:url(images/hrule.gif); background-repeat: no-repeat; height: 5px; width: 425px; border-style: none; margin-top: 15px; }
div.media-rule hr {display: none; }
.media-section-header { width:100%; text-align: center; margin-top: 15px; margin-bottom: 15px;}

#newsletter-box .frame-small-body {padding: 5px 20px 15px;}
#newsletter-box .frame-small-head h2 {padding: 10px 28px 5px;}
.sidebar-smalltext {font-size: 0.8em; text-align: center; width: 100%;}
#newsletter-button, #mc_signup_submit { background-image:url(images/button-newsletter.gif); background-repeat:no-repeat;width:160px;height:42px;border:0px none #000; background-color:transparent;cursor: pointer; margin-top: 15px; margin-bottom: 15px;}
#newsletter-box #newsletter-button {display: block; margin-top: 10px;margin-bottom: 0px;}
#newsletter-button:hover {background-image:url(images/button-newsletter-over.gif); }

/** navigation menu **/
#endcap-left {float: left; background-image:url(images/endcap-largegear.png); width:53px; height: 44px; margin-left: -35px;}
#endcap-right {float: right; background-image:url(images/endcap.png); width: 40px; height:44px; margin-right: -35px; }
.button { display: block; float: left; cursor: pointer; margin: 0px 21px;}
#newsbutton {background-image: url(images/button-news.png); width:51px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#newsbutton:hover {background-image:url(images/button-news-hover.png);}
#devblogbutton {background-image: url(images/button-devblog.png); width:82px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#devblogbutton:hover {background-image:url(images/button-devblog-hover.png);}
#aboutbutton {background-image: url(images/button-about.png); width:58px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#aboutbutton:hover {background-image:url(images/button-about-hover.png);}
#mediabutton {background-image: url(images/button-media.png); width:58px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#mediabutton:hover {background-image:url(images/button-media-hover.png);}
#forumbutton {background-image: url(images/button-forum.png); width:58px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#forumbutton:hover {background-image:url(images/button-forum-hover.png);}
#homebutton {background-image: url(images/button-home.png); width:55px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#homebutton:hover {background-image:url(images/button-home-hover.png);}
#pressbutton {background-image: url(images/button-press.png); width:59px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#pressbutton:hover {background-image:url(images/button-press-hover.png);}
#supportbutton {background-image: url(images/button-support.png); width:82px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#supportbutton:hover {background-image:url(images/button-support-hover.png);}
#faqbutton {background-image: url(images/button-faq.png); width:36px; height:29px; background-position: center 15px; background-repeat:no-repeat;}
#faqbutton:hover {background-image:url(images/button-faq-hover.png);}

#modaltrailer { display: none; width: 100%; min-height: 100%; position: fixed; top: 0; left: 0; z-index: 1000; background: url(images/overlay.png) repeat 0 0; vertical-align: top; text-align: center; }
#trailerbox { /*position: fixed;*/ margin: 50% auto; margin-top: -600px; /*left: 30%;*/ background-image: url(images/popover-large.png); height: 600px; width: 600px; z-index: 1200; }
#trailerbox-inner {display:none;}
#trailerbox div {  text-align: center; margin-top: 158px; padding: 158px 50px 0px; color: #000000; }
#trailerbox a { color: #aa3000;}
.trailer-content-box-button { margin: 50% auto; display: block; background-image:url(images/close-button.png); background-repeat:no-repeat; width:76px; height: 40px; margin-top:32px;}
.trailer-content-box-button:hover {background-image:url(images/close-button-over.png);}
.trailerbox-title {margin-bottom: 24px;}

.frame-small { margin: 0 auto; width: 200px; background: url(images/frame-small-body-r.gif) no-repeat bottom right; font-size: 100%; margin-bottom: 10px; }
.frame-small-head { background: url(images/frame-small-head-r.gif) no-repeat top right; margin: 0; padding: 0; text-align: center; }
.frame-small-head h2 { background: url(images/frame-small-head-l.gif) no-repeat top left; margin: 0;padding: 10px 30px 10px; color: white; font-weight: bold; font-size: 1.2em; line-height: 1em; }
.frame-small-body { background: url(images/frame-small-body-l.gif) no-repeat bottom left; margin: 0; padding: 5px 20px 45px; }

.frame-large { margin: 0 auto; width: 100%; background: url(images/frame-large-body-r.gif) no-repeat bottom right; font-size: 100%; margin-bottom: 10px; color: #000000; }
.frame-large-head { background: url(images/frame-large-head-r.gif) no-repeat top right; margin: 0; padding: 0; text-align: center; }
.frame-large-head h2 { background: url(images/frame-large-head-l.gif) no-repeat top left; margin: 0; padding: 30px 30px 5px; color: white; font-weight: bold; font-size: 1.2em; line-height: 1em; }
.frame-large-body { background: url(images/frame-large-body-l.gif) no-repeat bottom left; margin: 0; padding: 10px 30px 56px; }
.frame-large-footer {  padding-right: 45px; padding-left:45px; clear: both; }

#faq ol { font-weight: bold; }
#faq ol li { margin-bottom: 3px; }

#faq a { color: #301000; }
#faq a:visited { color: #402000; }
#faq a:hover { color: #503010; }

.pod { position: relative; margin-bottom: 10px; }
.pod-ul { background: url(images/frame-box.gif) top left no-repeat; position: absolute; width: 51%; height: 80px; top: 0px; left: 0px; }
.pod-ur { background: url(images/frame-box.gif) top right no-repeat; position: absolute; height: 80px; top: 0px; width: 51%; right: 0px; }
.pod-left { background: url(images/frame-borders.gif) left repeat-y; position: absolute; top: 80px; bottom: 80px; width: 51%; }
.pod-right { background: url(images/frame-borders.gif) right repeat-y; position: absolute; top: 80px; bottom: 80px; right: 0px; width: 51%; }
.pod-ll { background: url(images/frame-box.gif) 0 100% no-repeat; position: absolute; width: 51%; height: 80px; left: 0px; bottom: 0px; }
.pod-lr { background: url(images/frame-box.gif) bottom right no-repeat; position: absolute; width: 51%; height: 80px; right: 0px; bottom: 0px; }
.pod-content { position: relative; padding-left: 50px; padding-top: 30px; padding-right: 50px; padding-bottom: 30px; color: #000000; }
.pod-content-header { width: 100%; text-align: center; margin-bottom: 30px;}
.pod-content-footer {  padding-right: 45px; padding-left:45px; clear: both; margin-bottom: 30px; }
.pod a, .frame-large a {color: #301000; }
.pod a:visited, .frame-large a:visited { color:#402000;}
.pod a:hover, .frame-large a:hover {color: #503010;}

.pod-small { position: relative; margin-bottom: 10px;  }
.pod-small-ul { background: url(images/frame-small-box.gif) top left no-repeat; position: absolute; width: 51%; height: 30px; top: 0px; left: 0px; }
.pod-small-ur { background: url(images/frame-small-box.gif) top right no-repeat; position: absolute; height: 30px; top: 0px; width: 51%; right: 0px; }
.pod-small-left { background: url(images/frame-small-borders.gif) left repeat-y; position: absolute; top: 30px; bottom: 30px; width: 51%; }
.pod-small-right { background: url(images/frame-small-borders.gif) right repeat-y; position: absolute; top: 30px; bottom: 30px; right: 0px; width: 51%; }
.pod-small-ll { background: url(images/frame-small-box.gif) 0 100% no-repeat; position: absolute; width: 51%; height: 30px; left: 0px; bottom: 0px; }
.pod-small-lr { background: url(images/frame-small-box.gif) bottom right no-repeat; position: absolute; width: 51%; height: 30px; right: 0px; bottom: 0px; }
.pod-small-content { position: relative; padding-left: 20px; padding-top: 10px; padding-right: 20px; padding-bottom: 10px; color: #A18C53; }
.pod-small-content-header { width: 100%; text-align: center;}
.pod-small-content-footer {  padding-right: 45px; padding-left:45px; clear: both; }

.pod-mini { position: relative; margin-bottom: 10px;  }
.pod-mini-ul { background: url(images/frame-mini-box.gif) top left no-repeat; position: absolute; width: 51%; height: 30px; top: 0px; left: 0px; }
.pod-mini-ur { background: url(images/frame-mini-box.gif) top right no-repeat; position: absolute; height: 30px; top: 0px; width: 51%; right: 0px; }
.pod-mini-left { background: url(images/frame-mini-borders.gif) left repeat-y; position: absolute; top: 30px; bottom: 30px; width: 51%; }
.pod-mini-right { background: url(images/frame-mini-borders.gif) right repeat-y; position: absolute; top: 30px; bottom: 30px; right: 0px; width: 51%; }
.pod-mini-ll { background: url(images/frame-mini-box.gif) 0 100% no-repeat; position: absolute; width: 51%; height: 30px; left: 0px; bottom: 0px; }
.pod-mini-lr { background: url(images/frame-mini-box.gif) bottom right no-repeat; position: absolute; width: 51%; height: 30px; right: 0px; bottom: 0px; }
.pod-mini-content { position: relative; padding-left: 20px; padding-top: 10px; padding-right: 20px; padding-bottom: 10px; color: #A18C53; }
.pod-mini-content-header { width: 100%; text-align: center; margin-bottom: 5px;}
.pod-mini-content-footer {  padding-right: 45px; padding-left:45px; clear: both; }

.pod-mini a {color: #BB3500; }
.pod-mini a:visited { color:#aa3000;}
.pod-mini a:hover {color: #e55904;}

  .haccordion .header, .haccordion .content{
   float: left;
   height: 240px;
  }
  
  .haccordion .header .large, .haccordion .content .large {
    height:300px;
  }
  
  .haccordion .header{
   width: 160px;
   color: #fff;
   cursor: pointer;
   text-align: center;
  }
  
  .haccordion .header img {
    margin-top: 5%;
  }
  
  .haccordion .header img:hover {
    border: 1px solid gold;
  }
  
  .haccordion .content{
   display: none;
   width: 0px;
   overflow: auto;
   font-size: 0.85em;
   text-align: justify;
  }
  
  .haccordion .content p{
   margin: 5px;
   text-align: justify;
  }
  
  .submenu {
    float:right;
    width: 250px;
    margin-left: 10px;
  }
  
  .submenu ul, .submenu li { padding-left: 5px; }
  
  .mc_input { clear: none; }
  #mc_signup_form .mc_var_label, #mc_signup_form .mc_input { clear: none; }
  #mc_signup_container, .mc_signup_submit { text-align: center; width: 100%; }
  .mc_merge_var {margin-right: 20px; }
  .mc_merge_var label { font-weight: bold; margin-right: 5px; }
  #mc_signup_container { margin-top: -20px;}
  .mc_error_msg { color: #660000; font-weight: bold; }

.supportbox { margin-bottom: 10px;}

.headboard { width:950px; text-align: center; margin: 10px auto; height: 140px; vertical-align: middle; background-image:url(/assets/images/buy_now_backplate.gif); }
.headboard .button {display:block; float:left; margin-left: 5px; margin-top: 15px; margin-right: 0px; height: 42px; width: 160px;background-repeat: no-repeat; background-position: 0px 0px;}
.headboard .link {display:block; float:left; margin-left: 5px; margin-top: 5px; margin-right: 0px;width: 160px; font-weight: bold;}
.headboard #button-pc {background-image:url(/assets/images/button-buy-pc.gif);}
.headboard #button-buy {background-image:url(/assets/images/button-buy.gif);}
.headboard #button-paypal {background-image:url(/assets/images/button-buy-pc.gif);}
.headboard #button-google {background-image:url(/assets/images/button-buy-pc.gif);}
.headboard #button-mac {background-image:url(/assets/images/button-buy-mac.gif);}
.headboard #button-demo {background-image:url(/assets/images/button-buy-demo.gif);}
.headboard #button-patches {background-image:url(/assets/images/button-buy-patches.gif);}
.headboard .button:hover, .headboard .button-hover {background-position: 0px -42px;color:#E55904;}

.extended { width:950px; height: 210px; background-image:url(/assets/images/buy_now_backplate_extended.gif); }
.headboard .platform {margin-top: 18px; }
.headboard .box { width: 160px; float: left; margin-top: 15px;}
.headboard .box .button {margin-left: 0px; margin-right: 0px; margin-top: 5px; }
.headboard .first {margin-left:80px;}
.headboard .last { float:right; margin-right: 80px; }

.headboard .col1 { margin-left: 170px; }
.headboard .col2 {margin-left: 65px;}
.headboard .col3 {margin-left: 65px;}

.jquery-notify-bar {
  width:100%;
  position:fixed;
  top:0;
  left:0;
  z-index:32768;
  background-color:#efefef;
  font-size:18px;
  color:#000;
  text-align:center;
  font-family: Arial, Verdana, sans-serif;
  padding:20px 0px;
  border-bottom:1px solid #bbb;
  font-weight: bold;
}
.jquery-notify-bar.error {
  color:#f00;
  background-color:#fdd;
}
.jquery-notify-bar.success {
  color:#060;
  background-color:#BBFFB6;
}
.notify-bar-close {
  position:absolute;
  left:95%;
  font-size:11px;
}
