#counter {margin: 17px auto 26px;}

#counter_left {background: transparent url(../images/counter_left.png) no-repeat top left; float: left; height: 42px; width: 20px;}

#counter_right {background: transparent url(../images/counter_right.png) no-repeat top left; float: left; height: 42px; width: 115px;}

#count {background: transparent url(../images/counter_bg.png) repeat-x top right; float: left; height: 42px; text-align: right;}

#count span {color: #fff; font-size: 28px; font-weight: bold; font-family: trebuchet,arial,helvetica; position: relative; top: 5px; letter-spacing: 9px;}

#count span { 
  -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0.6	)));}

#c1 {right: -4px;}
#c2 {right: 6px;}
#c3 {right: 15px;}
#c4 {right: 26px;}


#news {background: transparent url(../images/BGNews.png) repeat-x; height: 27px; margin-bottom: 3px; padding-top: 6px;}
#news p {color: #fff; font-size: 12px; margin: 0; text-align: center;}
#news a {color: #fff; text-decoration: none;}
#news a:hover {text-decoration: underline;}
#news strong {margin-right: 0.5em;}

/* grid */
.grid {width: 100%;}
.grid > div {margin: 0 1px; width: 467px;}
.grid h2 {background: #d8d8d8 url(../images/benefit_title.png) repeat-x; border: 1px solid #fff; color: #707070; display: block; font-size: 12px; font-weight: bold; height: 20px; padding: 6px 0 0 27px; text-shadow: 0 1px 0 #fff; text-transform: uppercase; width: 438px;}

#publisher {background: #299bbc url(../images/publisher.png) no-repeat top left; text-shadow: 0 -1px 2px #0f3e7c;}
#publisher:hover {background-image: url(../images/publisher_hl.png);}
#subscriber {background: #84b377 url(../images/subscriber.png) no-repeat top left; text-shadow: 0 -1px 2px #316d2c;}
#subscriber:hover {background-image: url(../images/subscriber_hl.png);}


div.role {height: 69px; margin-bottom: 1px; padding: 18px 0 0 28px; width: 439px;}
.role h3 {font-size: 20px; font-weight: 600; margin-bottom: 2px; margin-top: 0;}
.role p {font-size: 16px;}
.role a {color: #fff; text-decoration: none;}

.benefit {background: #f0f0f0 url(../images/benefit_bg.png) repeat-x; border: 1px solid #fff; border-top: 0; height: 99px; margin-bottom: 1px; padding: 43px 0 0 135px; width: 330px;}
.benefit h3 {font-size: 22px; height: 100px; margin: 0 0 -69px -90px; padding: 0 0 0 90px; text-shadow: 0 1px 1px #fff;}
.benefit p {color: #595959; text-shadow: 0 1px 1px #fff;}
.benefit a {color: #000;}

#distribute {background: transparent url(../images/icons/distribute.png) no-repeat; margin-left: -94px; margin-top: -11px; padding-left: 94px; padding-top: 11px;}
#control {background: transparent url(../images/icons/control.png) no-repeat; margin-left:-99px; margin-top: -7px; padding-left: 99px; padding-top: 3px;}
#speed {background: transparent url(../images/icons/speed.jpg) no-repeat; margin-left: -135px; margin-top: -4px; padding-left: 135px; padding-top: 4px;}
#track {background: transparent url(../images/icons/track.png) no-repeat; margin-left: -94px; padding-left: 94px;}

#bottom_grid {margin-top: 2px;}
#bottom_grid h2 {background-color: #ccc; height: 21px; padding-top: 8px; margin-top:0px;}
.example {background: #f0f0f0 url(../images/example_bg.png) repeat-x; border: 1px solid #fff; border-top: 0; height: 128px; padding: 52px 10px 0 44px;}
div.example {width: 411px;}

#examples_from {width: 466px;}
#examples_from h2 {width: 439px;}
#example_from {border-right: 0; width: 412px;}

#examples_to {width: 468px;}
#examples_to h2 {width: 439px;}
#example_to {border-left: 0; float: left; margin-left: -2px; width: 390px;}

.example a {float: left; margin: 0 30px 18px 0;}
.example a.tumblr {margin-left: 23px;}
.example a.posterous {margin-top: -20px;}
.example a.huffington {margin-right: 45px;}
.example a.sixapart {margin-top: -20px;}
.example a.statusnet {margin-top: -20px;}
.right .example a {margin-right: 39px;}
#arrow {background: transparent url(../images/arrow.png) no-repeat top left; float: left; height: 181px; left: -2px; position: relative; top: 34px; width: 25px;}
