/* 
***********************************
iPhone Web 1.00
Category: Styles
March 23, 2009; Dan Blais
***********************************
*/

body {
  position:relative;
  margin:0;
  -webkit-text-size-adjust:none;
  min-height:416px;
  font-family:helvetica,sans-serif;
  background: url("../images/background.png"), url('../images/menutouched.png') no-repeat, url('../images/stacktouched.png') no-repeat, url("../images/whitearrow.png") no-repeat;
  -webkit-touch-callout:none;
}
.center {
  margin:auto;
  display:block;
}
img { 
  border:0;
}
.slideleft {
  -webkit-transform:translate(-150%,0);
  -webkit-transition-duration:1.5s;
}
.slideright {
  -webkit-transform:translate(150%,0);
  -webkit-transition-duration:1.5s;
}
#topbar {
  position:relative;
  left:0;
  top:0;
  height:44px;
  width:auto;
  background:url("../images/header.png") repeat;margin-bottom:13px;
}
#title {
  position:relative;
  padding:0 10px;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
  height:44px;
  line-height:44px;
  font-weight:bold;
  color:#FFF;
  text-shadow:rgba(0,0,0,0.6) 0 -1px 0;
  font-size:16pt;
}
#titleHOME {
  position:relative;
  padding:0 10px 0 100px;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
  height:44px;
  line-height:44px;
  font-weight:bold;
  color:#FFF;
  text-shadow:rgba(0,0,0,0.6) 0 -1px 0;
  font-size:16pt;
}
#content {
  width:100%;
  position:relative;
  min-height:250px;
  margin-top:10px;
  height:auto;
  -webkit-transition-property:-webkit-transform;
  -webkit-transform-style:preserve-3d;
  z-index:0;
  overflow:hidden;
}
#footer {
  text-align:center;
  position:relative;
  margin:20px 10px 0;
  height:auto;
  width:auto;
  bottom:10px;
}
#footer a {
  text-decoration:none;
  font-size:9pt;
  color:#4C4C4C;
  text-shadow:#FFF 0 1px 0;
}
.pageitem, .form {
  -webkit-border-bottom-left-radius:8px 8px;
  -webkit-border-bottom-right-radius:8px 8px;
  -webkit-border-top-left-radius:8px 8px;
  -webkit-border-top-right-radius:8px 8px;
  background-color:#fff;
  border:1px solid #878787;
  font-size:12pt;
  overflow:hidden;
  padding:0;
  position:relative;
  display:block;
  height:auto;
  width:auto;
  margin:3px 9px 17px;
  list-style:none;
}
.textbox {
  padding:5px 9px;
  overflow:hidden;
  border-top:1px solid #878787;
}
.textbox_first {
  padding:5px 9px;
  overflow:hidden;
}
.textbox p {
  margin-top:2px;
  font-size:10pt;
  color:#000;
  margin-bottom:2px;
  text-align:justify;
}
.textbox a {
  text-decoration:none;
  font-size:10pt;
  color:#4C4C4C;
  text-shadow:#FFF 0 1px 0;
}
.textbox img {
  max-width:100%;
}
.textbox ul {
  margin:3px 0 3px 0;
  list-style:circle!important;
}
.textbox li {
  margin:0!important;
}
.newsitem {
  -webkit-border-bottom-left-radius:8px 8px;
  -webkit-border-bottom-right-radius:8px 8px;
  -webkit-border-top-left-radius:8px 8px;
  -webkit-border-top-right-radius:8px 8px;
  background-color:#fff;
  border:1px solid #878787;
  font-size:12pt;
  padding:0;
  position:relative;
  display:block;
  height:auto;
  width:auto;
  margin:3px 9px 17px;
  list-style:none;
  white-space:normal;
  overflow:auto;
}
.newsitem a {
  text-decoration:none;
  font-size:11pt;
  color:#4C4C4C;
  text-shadow:#FFF 0 1px 0;
}
.newsbox {
  padding:5px 9px;
  font-size:11pt;
  border-top:1px solid #878787;
}
.newsbox pre {
  max-width:240px;
}
.newsbox p {
  margin-top:5px;
  font-size:11pt;
  color:#000;
  margin-bottom:10px;
}
.newsbox a {
  text-decoration:none;
  font-size:11pt;
  color:#4C4C4C;
  text-shadow:#FFF 0 1px 0;
}
.newsbox img {
  max-width:100%;
}
.newsbox ul {
  margin:3px 0 3px 0;
  list-style:circle!important;
}
.newsbox li {
  margin:0!important;
}
.pageitem li:first-child {
  border-top:0;
}
li.menu,ul.form li {
  position:relative;
  list-style-type:none;
  display:block;
  height:43px;
  overflow:hidden;
  border-top:1px solid #878787;
  width:auto;
}
ul.pageitem li:first-child:hover {
  -webkit-border-top-left-radius:8px 8px;
  -webkit-border-top-right-radius:8px 8px;
}
ul.pageitem li:last-child:hover {
  -webkit-border-bottom-left-radius:8px 8px;
  -webkit-border-bottom-right-radius:8px 8px;
}
li.menu:hover {
  background:url("../images/menutouched.png") repeat-x #369;
}
li.menu a:hover span.name,li.menu a:hover span.comment,li.stack:hover .starcomment,li.stack:hover .name,li.stack:hover .comment,body.list li.withimage a:hover .comment {
  color:#fff;
}
li.menu a:hover span.comment {
  color:#CCF;
}
li.menu a {
  display:block;
  height:43px;
  width:auto;
  text-decoration:none;
}
li.menu a img {
  width:auto;
  height:32px;
  margin:5px 0 0 5px;
  float:left;
}
li.menu span.name {
  margin:11px 0 0 7px;
  width:auto;
  color:#000;
  font-weight:bold;
  font-size:17px;
  text-overflow:ellipsis;
  overflow:hidden;
  max-width:75%;
  white-space:nowrap;
  float:left;
}
li.menu span.arrow,li.stack span.arrow,body.musiclist span.arrow,body.list span.arrow {
  position:absolute;
  width:8px!important;
  height:13px!important;
  right:10px;
  top:15px;
  margin:0!important;
  background:url("../images/arrow.png") no-repeat;
}
a:hover span.arrow {
  background-image:url("../images/whitearrow.png") !important;
}
body.list ul li.title {
  background:url("../images/listheader.gif") repeat-x;
  height:22px!important;
  width:100%;
  color:#fff;
  font-weight:bold;
  font-size:16px;
  text-shadow:gray 0 1px 0;
  line-height:22px;
  padding-left:20px;
  border-bottom:none!important;
}
body.list ul {
  background-color:#fff;
  width:100%;
  overflow:hidden;
  padding:0;
  margin:0;
}
body.list div#content li {
  height:40px;
  border-bottom:1px solid #e1e1e1;
  list-style:none;
}
body.list {
  background-color:#fff;
  background-image:none!important;
}
body.list div#footer {
  margin-top:24px!important;
  border:solid 1px gray;
}
body.list div#footer a:hover {
  text-decoration:underline;
}
body.list div#content li a {
  padding:9px 0 0 20px;
  font-size:large;
  font-weight:bold;
  position:relative;
  display:block;
  color:#000;
  text-decoration:none;
  height:32px;
}
body.list div#content li a span.name {
  text-overflow:ellipsis;
  overflow:hidden;
  max-width:93%;
  white-space:nowrap;
  display:block;
}
body.list div#content li a:hover {
  color:#fff;
}
body.list div#content li a:hover {
  background:url("../images/menutouched.png") repeat-x
}
body.list div#content {
  margin-top:-13px!important;
}
body.list ul img {
  width:90px;
  height:90px;
  position:absolute;
  left:0;
  top:0;
}
body.list li.withimage {
  height:90px!important;
}
body.list li.withimage span.name {
  margin:13px 0 0 90px;
  text-overflow:ellipsis;
  overflow:hidden;
  max-width:63%!important;
  white-space:nowrap;
}
body.list li.withimage .comment {
  margin:10px auto auto 90px !important;
  max-width:63%!important;
}
body.list li.withimage a,body.list li.withimage:hover a {
  height:81px!important;
  background:url("../images/stackbg.png") left top no-repeat!important;
}
body.list li.withimage:hover {
  background-image:url("../images/stacktouched.png");
}
#leftnav,#leftbutton {
  position:absolute;
  font-size:12px;
  left:9px;
  top:7px;
  font-weight:bold;
}
#leftnav,#leftbutton,#rightnav,#rightbutton {
  z-index:5000;
}
#leftnav a,#rightnav a,#leftbutton a,#rightbutton a {
  display:block;
  color:#fff;
  text-shadow:rgba(0,0,0,0.6) 0 -1px 0;
  line-height:30px;
  height:30px;
  text-decoration:none;
}
#leftnav img,#rightnav img {
  margin-top:4px;
}
#leftnav a:first-child {
  z-index:2;
  -webkit-border-image:url("../images/navleft.png") 0 6 0 13;
  border-width:0 6px 0 13px;
}
#leftnav a {
  -webkit-border-image:url("../images/navlinkleft.png") 0 5 0 13;
  z-index:3;
  margin-left:-4px;
  border-width:0 5px 0 13px;
  padding-right:4px;
  float:left;
}
#rightnav,#rightbutton {
  position:absolute;
  font-size:12px;
  right:9px;
  top:7px;
  font-weight:bold;
}
#rightnav a {
  -webkit-border-image:url("../images/navlinkright.png") 0 13 0 5;
  z-index:3;
  margin-right:-4px;
  border-width:0 13px 0 5px;
  padding-left:4px;
  float:right;
}
#rightnav a:first-child {
  z-index:2;
  -webkit-border-image:url("../images/navright.png") 0 13 0 6;
  border-width:0 13px 0 6px;
}
#leftbutton a,#rightbutton a {
  -webkit-border-image:url("../images/navbutton.png") 0 5 0 5;
  border-width:0 5px;
}
.graytitle {
  color:#4C4C4C;
  font-size:17px;
  font-weight:bold;
  left:9px;
  padding:1px 0 3px 8px;
  position:relative;
  right:20px;
  text-shadow:0 1px 0 #FFFFFF;
}
.news_graytitle {
  color:#4C4C4C;
  font-size:17px;
  font-weight:bold;
  left:2px;
  padding:1px 2px 3px 8px;
  position:relative;
  right:20px;
  text-shadow:0 1px 0 #FFFFFF;
}
.news_graytitle_small {
  color:#4C4C4C;
  font-size:12px;
  font-weight:bold;
  left:2px;
  padding:1px 2px 3px 8px;
  position:relative;
  right:20px;
  text-shadow:0 1px 0 #FFFFFF;
}
.redText {
  color:#FF0000;
}
.greenText {
  color:#009E00;
}
li.menu a:hover span.name,li.menu a:hover span.comment,li.stack:hover .starcomment,li.stack:hover .name,li.stack:hover .comment,body.list li.withimage a:hover .comment {
  color:#fff;
}
li.menu span.arrow,li.stack span.arrow,body.musiclist span.arrow,body.list span.arrow {
  position:absolute;
  width:8px!important;
  height:13px!important;
  right:10px;
  top:15px;
  margin:0!important;
  background:url("../images/arrow.png") no-repeat;
}
li.stack {
  height:50px;
  border-top:#878787 solid 1px;
  overflow:hidden;
  position:relative;
  width: auto;
}
li.stack a {
  width:100%;
  height:auto;
  display:block;
  text-decoration:none;
  position:absolute;
}
li.stack:hover {
  background:url("../images/stacktouched.png") repeat-x;
}
li.stack .image {
  position:absolute;
  left:0;
  top:0;
  height:auto;
  width:90px;
  display:block;
}
li:first-child.stack .image,li.stack:first-child a {
  -webkit-border-top-left-radius:8px 8px;
}
li:last-child.stack .image,li.stack:last-child a {
  -webkit-border-bottom-left-radius:8px 8px;
}
li.stack .name {
  font-size:15px;
  margin:5px 28px 5px 20px;
  padding-bottom:7px;
  display:block;
  height:auto;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
  color:#000;
  font-weight:bold;
}
li.stack .comment,body.list li.withimage .comment {
  font-size:12px;
  color:#7f7f7f;
  margin:7px 28px 0px 20px;
  display:block;
  width:60%;
  height:auto;
  font-weight:bold;
}
li.stack .arrow,body.list li.withimage .arrow {
  top:20px!important;
}
.logo {
  padding:5px;
}