/* Layout for CJ PromoJam - Alkaline Trio */
body {background:#000;}
#wrapper {margin:0 auto; background:#000 url(../images/bg.jpg) top center no-repeat; width:1280px; height:960px; position:relative;}

h1{color:#fff;font-size:3em;text-align:center;}
h2{color:#fff;font-size:20px;}
p{color:#fff;text-align:center;font-size:14px;font-weight:bold;margin:14px 0;padding:0 30px;}

#rgt_col {width:492px; position:absolute; left:0; top: 336px;}

#buy {height:123px; margin:0 auto; text-align:center; width:100%;}
.buy-exclusive {position:absolute; top:486px; left:12px;}

h1.connect {background:transparent url(../images/connect-h1.png) scroll 0 0 no-repeat; width:468px; height:105px; margin-top:12px; text-indent:-8000px;}
#connect {width:372px; margin-left:96px; margin-bottom:36px; height:56px; padding-top:12px;}
#connect ul {margin:0;}
#connect li {list-style:none; display:inline; padding-right:56px;}
#connect div.face {padding-top:4px; width:100px; float:left;}
#connect div.twit {padding-left:58px; width:100px; float:left;}

#post{background:transparent url(../images/tweet-box.png) top center no-repeat; height:271px; text-align:center; margin-bottom:36px;}
#post small{color:#000;font-size:0.6em;}
#post small a{color:#000;text-decoration:none;}
#post small a:hover{text-decoration:underline;}

#tweet-box {padding-top: 38px;}
#tweet-box textarea {
  border:none; 
  border-top:1px solid #cfcecf;
  background: none;
  color: #000;
  font-family:"Lucida Grande",Helvetica,Arial,Sans-Serif;
  font-size:0.9em;
  font-weight:bold;
  height:96px;
  line-height:1.5em;
  width:386px;
  text-align:left;
}
#tweet-box h4{position: relative; margin:0 0 0 56px; font-size:1em; font-weight:bold; text-align:left; padding-bottom: 4px;}
#tweet-box h4 #static {position: absolute;}
#this{margin:25px 0px 0px 0;text-align:center;width:100%;float:left;}

#footer{margin:0 auto; width:1040px;}
#footer ul{margin:1em auto; text-align:center;}
#footer li{display:inline; padding:7px 14px;}

/* Error Styling */
#errorExplanation{border:1px solid #E3BEBE;background:#F6E8E8;margin:10px 0 20px;padding:20px;}
#errorExplanation h2{margin:-20px -20px 20px;background:#E3BEBE;padding:10px 20px;}
#errorExplanation p{margin:0 0 20px;}
#errorExplanation ul{margin:0 0 0 25px;}
#errorExplanation ul li{list-style-type:disc;margin:0 0 3px;padding:0;}

/* Stats Styling */
.stats-header{background:transparent url(/images/promojam-stats-header.png) no-repeat scroll 0 0;height:35px;margin:0 auto;width:800px;}
.statWrap{width:760px;margin:0 auto;background:#191919;padding:20px;position:relative;color:#DDD;}
.topBox{width:700px;margin:0 auto 48px auto;opacity:1;position:relative;}
.topStats{width:140px;display:inline;position:relative;float:left;}
.bottomBox{width:700px;margin:0px auto 10px auto;opacity:1;}
.bottomBox h3{font-size:1.1em;line-height:1.2em;margin:0;color:#FFF;text-transform: lowercase; text-align: left; padding: 5px; border-bottom: 1px solid #333333;}
.topStats h2{width:120px;font-size:1.2em;line-height:1.1em;margin:0;color:#FFF;}
.topStats h3{width:120px;font-size:1.4em;line-height:1.1em;padding:0;margin:0;color:#FFF; text-align: left;}
.bottomBox *{color:#FFF;}

/*Facebook Styling */
.facebook-welcome{background-color:#fff;border:3px solid #c6c6c6;color:#415e98;margin:20px auto 50px auto;position:relative;text-align:left;width:385px;height:162px;}
.facebook-welcome .about p{color:#000 !important;font-family:"Lucida Grande",Helvetica,Arial,Sans-Serif !important;font-size:1.1em !important;text-align:center !important;}
.facebook-welcome .about img{margin:20px 0 30px 30px !important}
.facebook-preview-holder{background-color:#fff;border:3px solid #c6c6c6;color:#415e98;margin:8px auto 40px auto;position:relative;text-align:center;width:550px;height:260px;}
.post-to-facebook{margin:5px auto;position:absolute;text-align:center;width:120px;top:135px;left:0;}
.details{margin-left:8px;margin-top:6px;position:relative;left:0;}
.avatar{margin-top:6px;position:absolute;left:8px;height:90px;}
.name{font-size:1.2em;font-weight:bold;position:absolute;left:60px;top:0px;}
.status{font-size:1em;width:250px;position:absolute;left:60px;top:18px;}
.status-time{font-size:.8em;font-style:italic;position:absolute;left:60px;top:34px;}
.about{margin:5px;padding:3px;background:#c6c6c6;color:#415e98;text-align:center;clear:both;position:absolute;left:0;top:55px;height:90px;}
.fb-preview{margin-left:25px;width:490px;position:relative;margin-bottom: 45px;}
.explain.facebook{color:#000 !important;font-family:"Lucida Grande",Helvetica,Arial,Sans-Serif !important;font-size:.9em !important;text-align:center !important;margin:20px 0; color: #FFFFFF !important;}
.post-to-facebook img{margin:20px auto 10px 170px !important}

/* jPlayer Styling */
#player-position{position:absolute; left: 42px !important;}
#jquery_jplayer{ }
#player_container{position:relative;background:url("/images/exclusive-bg.png") 0 0 no-repeat;width:423px;height:469px; padding-top:18px;}
#player_container ul#player_controls{background:transparent url(/images/player-top.png) no-repeat scroll 14px 6px; height:56px; list-style-type:none; margin:0;padding:0;width:385px;}
#player_container ul#player_controls li{overflow:hidden;text-indent:-9999px;}
#player_play,
#player_pause{display:block;position:absolute;left:58px;top:35px;width:40px;height:40px;cursor:pointer;}
#player_play{background:url("/images/spirites.png") 0 0 no-repeat;}
#player_play.jqjp_hover{background:url("/images/spirites.png") -41px 0 no-repeat;}
#player_pause{background:url("/images/spirites.png") 0 -42px no-repeat;}
#player_pause.jqjp_hover{background:url("/images/spirites.png") -41px -42px no-repeat;}
#ctrl_prev{position:absolute;left:32px;top:42px;background:url("/images/spirites.png") 0 -112px no-repeat;width:28px;height:28px;cursor:pointer;}
#ctrl_prev:hover{background:url("/images/spirites.png") -29px -112px no-repeat;}
#ctrl_prev.disabled{background:url("/images/spirites.png") -58px -112px no-repeat;cursor:default;}
#ctrl_next{position:absolute;left:96px;top:42px;background:url("/images/spirites.png") 0 -141px no-repeat;width:28px;height:28px;cursor:pointer;}
#ctrl_next:hover{background:url("/images/spirites.png") -29px -141px no-repeat;}
#ctrl_next.disabled{background:url("/images/spirites.png") -58px -141px no-repeat;cursor:default;}
#player_stop{position:absolute;left:126px;top:42px;background:url("/images/spirites.png") 0 -83px no-repeat;width:28px;height:28px;cursor:pointer;}
#player_stop.jqjp_hover{background:url("/images/spirites.png") -29px -83px no-repeat;}
#player_progress{position:absolute;left:170px;top:48px;background-color:#eee;width:116px;height:15px;}
#player_progress_load_bar{background:url("/images/bar_load.gif") top left repeat-x;width:0px;height:15px;cursor:pointer;}
#player_progress_load_bar.jqjp_buffer{background:url("/images/bar_buffer.gif") top left repeat-x;}
#player_progress_play_bar{background:url("/images/bar_play.gif") top left repeat-x ;width:0px;height:15px;}
#player_volume_min{position:absolute;left:296px;top:49px;background:url("/images/spirites.png") 0 -170px no-repeat;width:18px;height:15px;cursor:pointer;}
#player_volume_max{position:absolute;left:368px;top:49px;background:url("/images/spirites.png") 0 -186px no-repeat;width:18px;height:15px;cursor:pointer;}
#player_volume_min.jqjp_hover{background:url("/images/spirites.png") -19px -170px no-repeat;}
#player_volume_max.jqjp_hover{background:url("/images/spirites.png") -19px -186px no-repeat;}
#player_volume_bar{position:absolute;left:314px;top:54px;background:url("/images/volume_bar.gif") repeat-x top left;width:46px;height:5px;cursor:pointer;}
#player_volume_bar_value{background:url("/images/volume_bar_value.gif") repeat-x top left;width:0px;height:5px;}
#play_time,
#total_time{position:absolute;left:170px;top:63px;width:115px;font-size:.6em;font-style:oblique;color:#000;}
#total_time{text-align:right;}
#playlist_list{height:26px; margin-left:29px; overflow:hidden; padding-top:6px; width:405px;}
#playlist_list ul{list-style-type:none;padding:5px 0 10px 0;margin:0 0 10px 0; border:1px solid #cfcecf; border-top:none; width:405px; font-size:1em;}
#playlist_list li{padding:2px 0 2px 20px; cursor:pointer; color:#000;}
#playlist_list li.playlist_current{color:#767076; list-style-type:square; list-style-position:inside; padding-left:6px; cursor:default; background: none; font-weight:bold;}
#playlist_list li.playlist_hover{color:#767076;background: none;}

/* Exclusive Page */
.column-two {right: 30px; top: 20px; position: absolute; width: 450px; height: 770px;}
.tech, .tech a {font-size: .98em; color: #868686; text-align: center; font-weight: normal; text-decoration: underline;}

/* Widget */
.twitter-widget {position: relative; margin-top: 24px; width: 300px; border: none; margin-left:20px;}
.twitter-widget .bottom-fade {left: 0; position: absolute; bottom: 0;}

#tweet_widget {overflow: hidden;}
#tweet_widget center {display: none;}
#tweet_widget div div {border-bottom: dotted 1px #868686 !important; font-size: 11px !important; line-height: 1.35em; margin: 4px 0 !important; padding: 4px 0 4px 36px !important; position: relative; color: #767076 !important;}
#tweet_widget div div img {left: 2px; position: absolute; top: 2px;}
#tweet_widget div div a {color: #767076 !important;}

#tweet_widget .jtw_new_tweet {background-color: #707070 !important;}
#tweet_widget .jtw_tstamp {color: #f23470 !important;}

/* Tweet Chat */
.twitter-chat .tweet {margin-top: 0; margin-left: 0; position: relative;}
.twitter-chat .tweet #number {color: #767476; font-family:'Georgia','Serif'; font-size: 1.1em; font-weight: bold; position: relative; top:0px; left:328px;}
.twitter-chat .tweet #static	{color: #767076; font-size: .7em; line-height: 1.5em; font-weight: bold; font-family: "Lucida Grande", Helvetica, Arial, Sans-Serif; position: absolute; left: 4px; top:66px;}

.twitter-chat  {margin-top: 6px; margin-left: 28px; width: 375px; height: 81px; background: url(/images/chat-box.png) 0 0 no-repeat; position: relative;}
.twitter-chat .tweet p {text-align: left; margin-bottom: 0; margin-top: 3px; padding: 0;}
.twitter-chat .tweet p textarea	{width: 348px; margin: 0; height: 42px; border: none; padding: 0; font-size: .7em; line-height: 1.5em; font-weight: bold; font-family: "Lucida Grande", Helvetica, Arial, Sans-Serif; background: none; color:#767076; padding-left:4px;}
.twitter-chat input	{position: absolute; top:86px; right: 16px; margin: 0;}

/* Reposts */
.reposts {position: absolute; bottom: 200px; left: 0px; width: 400px;}
.reposts .facebook-column, .reposts .twitter-column {margin-top: 10px; position: absolute; clear: both; top: 30px; width: 140px;}
.reposts .facebook-column {margin-top: 14px; left: 0;}
.reposts .twitter-column { left: 160px;}
.reposts .repost-title {height: 64px; position: absolute; clear: both; top: 10px; left: 0; color:#aaa; font-weight:bold; 
font-family:"Lucida Grande",Helvetica,Arial,Sans-Serif;font-size:0.9em;font-weight:bold; font-size:1.2em;}
