/* general */
html,body 
{
    height:100%;
}
body 
{
    position:relative;
    background:#fff url(images/bg-wall-body.png);
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
    overflow-y:hidden;
    overflow-x:hidden;
}
#content-layer a,
#wall-wrap a
{
    color:#509e08;
    font-weight:bold;
    text-decoration:none;
}
#content-layer a:hover,
#wall-wrap a:hover
{
    text-decoration:underline;
}

/* content-box */
#content-layer 
{
    padding:24px;
    width:300px;
    z-index:6;
    position:absolute;
    top:20px;
    right:20px;
    background:transparent url(images/bg-blacktrans-pixel.png);
    font:12px/19px Verdana, Geneva, Arial, Helvetica, sans-serif;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: -1px 2px 5px rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: -1px 2px 5px rgba(0, 0, 0, 0.75);
    box-shadow: -1px 2px 5px rgba(0, 0, 0, 0.75);
}
#content-layer h1
{
    margin:0;
    font:27px Helvetica,"Trebuchet MS", sans-serif;
    font-weight:bold;
}
#content-layer *
{
    color:#fff;
}
#content-layer .share-button 
{
    display:inline-block;
    text-decoration:none;
    font-weight:bold;
    font-size:24px;
    line-height:46px;
    width:100%;
    border:1px solid #f06e0e;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #ff9e0b; /* Old browsers */
    background: -moz-linear-gradient(top,  #ff9e0b 0%, #ef5800 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9e0b), color-stop(100%,#ef5800)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ff9e0b 0%,#ef5800 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ff9e0b 0%,#ef5800 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ff9e0b 0%,#ef5800 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #ff9e0b 0%,#ef5800 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9e0b', endColorstr='#ef5800',GradientType=0 ); /* IE6-9 */
    color:#fff;
}
#content-layer .share-button:hover
{
    text-decoration:none;
}
.share-button span 
{ 
    padding:0 14px 0 42px;
    margin:0 0 0 10px;
    font-family: Arial;
}
.share-button-twitter span 
{ 
    background:transparent url(images/twitter-bird.png) no-repeat;
}
.share-button-weibo span 
{ 
    background:transparent url(images/weibo_logo.png) no-repeat;
}

/* twitter wall */
#wall-wrap 
{
    left: 0;
    overflow: hidden;
    position: relative;
    top: 0;
    width: 100%;
    z-index: 2;
}
#wall 
{
    height: 100%;
    position: relative;
    width: 105%;
    z-index: 3;
    overflow: hidden;
}
#wall .av {
    position: relative;
    text-align:center;
    display: block;
    float: left;
}
#wall img {
    height: 50px;
    width: 50px;
    border:0;
    float:left;
}
#wall .small img {
    height: 50px;
    width: 50px;
}
#wall .big img {
    height: 100px;
    width: 100px;
}
#wall .bigger img {
    height: 200px;
    width: 200px;
}
#wall .huge img {
    height: 400px;
    width: 400px;
}
#wall > div,
#wall .gridwrap {
    float: left;
    height: 50px;
    width: 50px;
}
#wall .grid100x100,
#wall .grid100x100 .gridwrap {
    height: 100px;
    width: 100px;
}
#wall .grid200x200,
#wall .grid200x200 .gridwrap {
    height: 200px;
    width: 200px;
}
#wall .grid400x400,
#wall .grid400x400 .gridwrap {
    height: 400px;
    width: 400px;
}
.active {
    z-index: 4;
}
#shout {
    left: 30px;
    overflow: hidden;
    position: absolute;
    top: -9px;
    width: 233px;
    z-index: 5;
}
.shout-top {
    background: url(images/bg-wall-shout.png) top left;
    height: 17px;
    width: 233px;
}
.shout-mid {
    background: url(images/bg-wall-shout.png) no-repeat 0 -17px;
    color: #333;
    padding: 0 21px 0 29px;
    width: 183px;
    text-align:left;
    font: 12px/18px Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.shout-btm {
    background: url(images/bg-wall-shout.png) bottom left;
    height: 21px;
    width: 233px;
}