@import url(reset.css);

/* =body
************************************************************** */

body {
	background: #000 url(i/bg/bg.png) repeat;
	font: normal 69% Arial, Helvetica, sans-serif;
	color: #4d4d4d;
}

#site {
	width: 980px;
	margin: 0 auto;
	height: 1000px;
}

#site.sub {
	background-position: 72px 157px;
}

/* =wrapper
************************************************************** */

#wrapper {
	background: url(i/bg/top.png) repeat-x left top;
}

#figures-wrapper {
	background: url(i/bg/figures.png) no-repeat center 299px;
}

#dragon-wrapper {
	background: url(i/bg/dragon.png) no-repeat right 180px;
}

/* =masthead
************************************************************** */

#masthead {
	position: relative;
}

#masthead .glow {
	position: absolute;
	width: 382px;
	height: 135px;
	top: 0;
	left: -79px;
	background: url(i/masthead/glow.png) no-repeat left top;
}

h1 {
	position: absolute;
	left: -3pxpx;
	top: 30px;
	width: 199px;
	height: 69px;
	background: url(i/logo.png) no-repeat left top;
	text-indent: -1000em;
}

h1 a {
	position: absolute;
	left: 0;
	top: 0;
	width: 199px;
	height: 69px;
}

/* =dashboard
************************************************************** */

#dashboard {
	list-style: none;
	float: right;
	clear: both;
	padding-top: 17px;
	padding-right: 21px;
	margin-bottom: 44px;
}

#dashboard li {
	float: left;
	margin-left: 25px;
}

#dashboard li a {
	display: block;
	height: 22px;
	padding-top: 10px;
	padding-left: 36px;
	background-position: left center;
	background-repeat: no-repeat;
	color: #808080;
	text-decoration: none;
}

#dashboard li a:hover {
	text-decoration: underline;
}

#dashboard li.forum a {
	background-image: url(i/dashboard/forum.png);
}

#dashboard li.wiki a {
	background-image: url(i/dashboard/wiki.png);
}

#dashboard li.pl a {
	background-image: url(i/dashboard/pl.png);
}

#dashboard li.earth a {
	background-image: url(i/dashboard/earth.png);
}

#dashboard li.lab a {
	background-image: url(i/dashboard/lab.png);
}

#dashboard li.other a {
	background-image: url(i/dashboard/other.png);
}

/* =login-box
************************************************************** */

#login-box {
	float: right;
	height: 26px;
	line-height: 26px;
	padding-right: 21px;
	margin-bottom: 17px;
	clear: both;
}

#login-box * {
	vertical-align: middle;
}

#login-box .status {
	float: left;
	margin-right: 10px;
}

#login-box .key {
	display: block;
	float: left;
	width: 36px;
	height: 26px;
	background: url(i/login-box/key.png) no-repeat left top;
	text-indent: -1000em;
	margin-right: 14px;
}

#login-box a {
	color: #808080;
	text-decoration: none;
}

#login-box a:hover {
	text-decoration: underline;
}

/* =user-box
************************************************************** */

#user-box {
	display: none;
	float: right;
	height: 26px;
	line-height: 26px;
	padding-right: 21px;
	margin-bottom: 17px;
	clear: both;
	width: 541px;
}

#user-box * {
	vertical-align: middle;
}

#user-box .key {
	display: block;
	float: left;
	width: 36px;
	height: 26px;
	background: url(i/user-box/key.png) no-repeat left top;
	text-indent: -1000em;
	margin-right: 5px;
}

#user-box .field {
	float: left;
	margin-right: 5px;
	padding: 3px 5px 0;
	width: 170px;
	height: 23px;
	background: url(i/user-box/input-bg.png) no-repeat left top;
}

#user-box .field.pass {
	width: 152px;
	margin-right: 0;
}

#user-box .field input {
	color: #4d4d4d;
	width: 170px;
	height: 18px;
	background: none;
	border: none;
}

#user-box .field input.pre {
	font-style: italic;
	color: #999;
}

#user-box .field input {
	width: 142px;
}

#user-box .remind {
	display: block;
	float: left;
	width: 28px;
	height: 26px;
	background: url(i/user-box/remind.png) no-repeat left top;
	text-indent: -1000em;
	margin-right: 5px;
}

#user-box .login-button {
	display: block;
	float: left;
	width: 36px;
	height: 26px;
	background: url(i/user-box/login-button.png) no-repeat left top;
	text-indent: -1000em;
	margin-right: 5px;
}

#user-box .register {
	float: left;
}

#user-box .register a {
	color: #3a5261;
	text-decoration: none;
}

#user-box .register a:hover {
	text-decoration: none;
}

/* =nav-line
************************************************************** */

#nav-line {
	padding-top: 4px;
	background-color: #000;
}

#nav-line:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

/* =nav
************************************************************** */

#nav {
	float: left;
	list-style: none;
	margin-right: 7px;
}

#nav:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

#nav li {
	float: left;
}

#nav li a {
	display: block;
	height: 36px;
	background-position: left top;
	background-repeat: no-repeat;
	text-indent: -1000em;
	overflow: hidden;
}

#nav li a:hover,
#nav li.selected a {
	background-position: left -36px;
}

#nav li.main a {
	width: 128px;
	background-image: url(i/nav/main.png);
}

#nav li.forum a {
	width: 76px;
	background-image: url(i/nav/forum.png);
}

#nav li.download a {
	width: 96px;
	background-image: url(i/nav/download.png);
}

#nav li.gallery a {
	width: 75px;
	background-image: url(i/nav/gallery.png);
}

#nav li.articles a {
	width: 85px;
	background-image: url(i/nav/articles.png);
}

#nav li.pacc a {
	width: 89px;
	background-image: url(i/nav/pacc.png);
}

#nav li.guides a {
	width: 93px;
	background-image: url(i/nav/guides.png);
}

#nav li.links a {
	width: 61px;
	background-image: url(i/nav/links.png);
}

/* =search
************************************************************** */

#search {
	float: right;
	padding-top: 7px;
	padding-right: 7px;
}

#search .field {
	float: left;
}

#search .field.text {
	width: 140px;
	height: 20px;
	padding: 6px 5px 0;
	background: url(i/user-box/input-bg.png) no-repeat left top;
}

#search .field input {
	color: #4d4d4d;
	width: 140px;
	height: 18px;
	background: none;
	border: none;
}

#search .field.select {
	width: 69px;
	height: 20px;
	padding: 6px 5px 0 8px;
	background: url(i/search/select-bg.png) no-repeat left top;
	margin-right: 5px;
}

#search .field select {
	color: #4d4d4d;
	width: 69px;
	height: 18px;
	background: none;
	background-color: transparent;
	border: none;
}

#search .field select option {
	background-color: #e5e5e5;
}

#search .search-button {
	display: block;
	float: left;
	width: 26px;
	height: 26px;
	background: url(i/search/search-button.png) no-repeat left top;
	text-indent: -1000em;
}

/* =main
************************************************************** */

#main {
	background: url(i/main/main-bg.jpg) repeat-y left top;
}

#main .inner-top {
	background: url(i/main/main-top.jpg) no-repeat left top;
}

#main .inner-bottom {
	background: url(i/main/main-bottom.jpg) no-repeat left bottom;
	padding: 20px;
}

/* =content-1st
************************************************************** */

#content-1st {
	float: left;
	width: 440px;
	margin-right: 20px;
}

.sub #content-1st {
	width: 620px;
}

/* =content-2nd
************************************************************** */

#content-2nd {
	float: left;
	width: 480px;
}

.sub #content-2nd {
	width: 300px;
}

#content-2nd-1 {
	float: left;
	width: 160px;
	margin-right: 20px;
}

#content-2nd-2 {
	float: left;
	width: 300px;
}

/* =rotator
************************************************************** */

#rotator {
	position: relative;
	height: 380px;
	margin-bottom: 20px;
}

#rotator .pane {
	position: absolute;
	left: 0;
	top: 0;
	width: 440px;
	height: 380px;
}

#rotator .image {
	display: block;
}

#rotator .image:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

#rotator .image img {
	float: left;
}

#rotator .over {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 440px;
}

#rotator .over .inner {
	position: relative;
	padding: 20px;
	background: url(i/rotator/over-bg.png) repeat;
}

#rotator .over .inner h2 {
	margin-bottom: 10px;
}

#rotator .over .inner h2 a {
	color: #ff6000;
	font-size: 2.18em;
	text-decoration: none;
	font-weight: normal;
}

#rotator .over .inner h2 a:hover {
	text-decoration: underline;
}

#rotator .over .inner h2 .details {
	color: #4d4d4d;
}

#rotator .over .inner .info {
	color: #fff;
	margin-bottom: 10px;
}

#rotator .over .inner .buttons {
	background: url(i/rotator/buttons-bg.gif) repeat-x left center;
}

#rotator .over .inner .buttons:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

#rot-tabs {
	list-style: none;
	position: absolute;
	bottom: 25px;
	left: 20px;
}

#rot-tabs li {
	float: left;
	margin-right: 5px;
}

#rot-tabs a {
	display: block;
	width: 16px;
	height: 16px;
	overflow: hidden;
	text-indent: -1000em;
	background: url(i/rotator/changer.png) no-repeat left top;
}

#rot-tabs li.selected a,
#rot-tabs a:hover {
	background-position: left -16px;
}

/* =small-rotator
************************************************************** */

#small-rotator {
	position: relative;
	padding-bottom: 25px;
	margin-bottom: 20px;
	height: 103px;
}

#small-rotator .panes .pane a {
	display: block;
}

#small-rot-tabs {
	list-style: none;
	position: absolute;
	top: 108px;
	right: 0px;
}

#small-rot-tabs li {
	float: left;
	margin-right: 5px;
}

#small-rot-tabs a {
	display: block;
	width: 16px;
	height: 16px;
	overflow: hidden;
	text-indent: -1000em;
	background: url(i/rotator/small-changer.png) no-repeat left top;
}

#small-rot-tabs li.selected a,
#small-rot-tabs a:hover {
	background-position: left -16px;
}

#small-rotator .caption {
	position: absolute;
	top: 108px;
	left: 0;
	color: #999;
}

#small-rotator .caption strong {
	color: #4d4d4d;
}


/* =section
************************************************************** */

.section {
	background-color: #fff;
	margin-bottom: 20px;
}

.section.no-bg {
	background-color: transparent;
}

.section .header {
	padding: 6px 8px 10px;
	background: url(i/section/header-bg.png) no-repeat left bottom;
}

.section .header.orange {
	background-image: url(i/section/header-orange-bg.png);
}

.section .header:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

.section .header h2 {
	float: left;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	color: #fff;
	font-size: 1.64em;
	font-weight: normal;
}

.section .header .rss {
	display: block;
	float: right;
	width: 24px;
	height: 24px;
	background: url(i/icons/rss-grey.png) no-repeat left top;
	text-indent: -1000em;
}

.section .header.orange .rss {
	background-image: url(i/icons/rss-orange.png);
}

.section .filters {
	padding: 6px 15px 8px;
	color: #999;
}

.section .filters select {
	color: #999;
}

/* =news
************************************************************** */

.news-list {

}

.news-list .news {

}

.news-list .news .header {
	padding: 20px 15px;
	background: #1a1a1a url(i/news/header.png) no-repeat left top;
}

.news-list .news .header.spike {
	background-image: url(i/news/header-spike.png);
}

.news-list .news .header h3 {
	padding-left: 42px;
	background: url(i/news/news-ico.png) no-repeat left 3px;
	min-height: 44px;
}

.news-list .news .header h3 a {
	color: #ff6000;
	font-size: 2.18em;
	font-weight: bold;
	text-decoration: none;
	font-weight: normal;
}

.news-list .news .header h3 a:hover {
	text-decoration: underline;
}

.news-list .news .header .details {
	padding-left: 42px;
	color: #4d4d4d;
	font-size: ;
}

.news-list .news .header .details a {
	color: #4d4d4d;
	text-decoration: underline;
}

.news-list .news .header .details a:hover {
	text-decoration: none;
}

.news-list .news .body {
	padding: 20px;
}

.news-list .news .body p {
	line-height: 1.6em;
	margin-bottom: 17px;
}

.news-list .news .body ul,
.news-list .news .body ol {
	margin-left: 25px;
}

.news-list .news .body .comments {
	float: left;
	padding-top: 5px;
	margin-bottom: 0;
}

.news-list .news .body .comments a {
	color: #999;
	text-decoration: none;
}

.news-list .news .body .comments a:hover {
	text-decoration: underline;
}

.news-list .short-news {
	padding: 0 18px;
}

.news-list .short-news .inner {
	padding-bottom: 1px;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
}

.news-list .short-news .inner:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

.news-list .short-news a {
	display: block;
	float: left;
	width: 260px;
	padding: 7px 0 7px 28px;
	background: url(i/icons/light-btn-article.png) no-repeat 2px center;
	font-size: 1.09em;
	color: #4d4d4d;
	font-weight: bold;
	text-decoration: none;
}

.news-list .short-news a:hover {
	text-decoration: underline;
}

.news-list .short-news .date {
	display: block;
	float: right;
	color: #999;
	padding-top: 8px;
}

.news-list .btn-archive {
	padding: 15px 0 17px 26px;
}

/* =short-news
************************************************************** */

#short-news {
	margin-bottom: 20px;
}

#short-news ul {
	list-style: none;
	padding-top: 4px;
}

#short-news ul li {
	padding-bottom: 1px;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
}

#short-news ul li a {
	display: block;
	font-size: 1.09em;
	color: #4d4d4d;
	font-weight: bold;
	padding: 5px 5px 5px 31px;
	background: url(i/short-news/arr.png) no-repeat left center;
	text-decoration: none;
}

#short-news ul li a:hover {
	background-image: url(i/short-news/arr-b.gif);
	color: #e25d00;
}

#short-news ul li a .date {
	font-size: 0.92em;
	color: #999;
	font-weight: normal;
}

/* =sponsors
************************************************************** */

#sponsors {

}

#sponsors .body a {
	display: block;
	text-align: center;
	padding: 19px 0;
	background: url(i/common/dotted-line.gif) repeat-x left top;
}

#sponsors .body a:first-child {
	background-image: none;
}

/* =friends
************************************************************** */

#friends {

}

#friends .body a {
	display: block;
	text-align: center;
	padding: 19px 0;
	background: url(i/common/dotted-line.gif) repeat-x left top;
}

#friends .body a:first-child {
	background-image: none;
}

/* =board
************************************************************** */

#board ul {
	list-style: none;
}

#board ul li {
	padding: 7px 0;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
	line-height: 1.5em;
}

#board ul li a {
	color: #4d4d4d;
	font-weight: bold;
	font-size: 1.09em;
	text-decoration: none;
}

#board ul li a:hover {
	text-decoration: underline;
}

#board ul li .date {
	color: #999;
}

/* =newest-files
************************************************************** */

#newest-files ul {
	list-style: none;
}

#newest-files ul li {
	padding-bottom: 1px;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
}

#newest-files ul li a {
	display: block;
	padding: 8px 0 8px 30px;
	background: url(i/icons/cd.gif) no-repeat left center;
	color: #4d4d4d;
	font-weight: bold;
	text-decoration: none;
}

#newest-files ul li a:hover {
	text-decoration: underline;
}

/* =poll
************************************************************** */

#poll {

}

#poll .body {
	padding-top: 12px;
}

#poll .question {
	color: #3a5261;
	font-weight: bold;
	font-size: 1.09em;
	padding-bottom: 7px;
	border-bottom: 1px #ccc solid;
}

#poll .answers {
	list-style: none;
	margin-bottom: 9px;
}

#poll .answers li label {
	display: block;
	padding: 7px 0;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
}

#poll .answers li label * {
	vertical-align: middle;
}

#poll .answers li label input {
	margin-right: 10px;
	margin-top: 0;
}

/* =screen-of-day
************************************************************** */

#screen-of-day {
	background-color: #000;
}

#screen-of-day h2 {
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	color: #fff;
	font-size: 1.64em;
	font-weight: normal;
	padding: 6px 8px 10px;
}

#screen-of-day .screen {
	text-align: center;
}

#screen-of-day .info {
	padding: 13px;
}

#screen-of-day .info .title {
	margin-bottom: 7px;
}

#screen-of-day .info .title a {
	font-size: 1.09em;
	color: #ff6000;
	font-weight: bold;
	text-decoration: none;
}

#screen-of-day .info .title a:hover {
	text-decoration: underline;
}

#screen-of-day .info .date {
	color: #4d4d4d;
}

/* =tutorials
************************************************************** */

#tutorials ul {
	list-style: none;
	margin-bottom: 9px;
}

#tutorials ul li {
	padding: 4px 0 5px;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
}

#tutorials ul li.full {
	padding-bottom: 8px;
	border-bottom: 1px #ccc solid;
	background-image: none;
}

#tutorials ul li h3 a {
	display: block;
	padding: 4px 0 4px 25px;
	background: url(i/icons/btn-question.png) no-repeat left center;
	font-size: 1.09em;
	font-weight: bold;
	color: #4d4d4d;
	text-decoration: none;
}

#tutorials ul li h3 a:hover {
	text-decoration: underline;
}

#tutorials ul li.full h3 {
	margin-bottom: 15px;
}

#tutorials ul li .image {
	text-align: center;
	margin-bottom: 15px;
}

#tutorials ul li p {
	margin-bottom: 15px;
}

/* =interviews
************************************************************** */

#interviews ul {
	list-style: none;
	margin-bottom: 9px;
}

#interviews ul li {
	padding: 4px 0 5px;
	background: url(i/common/dotted-line.gif) repeat-x left bottom;
}

#interviews ul li.full {
	padding-bottom: 8px;
	border-bottom: 1px #ccc solid;
	background-image: none;
}

#interviews ul li h3 a {
	display: block;
	padding: 4px 0 4px 25px;
	background: url(i/icons/btn-question.png) no-repeat left center;
	font-size: 1.09em;
	font-weight: bold;
	color: #4d4d4d;
	text-decoration: none;
}

#interviews ul li h3 a:hover {
	text-decoration: underline;
}

#interviews ul li.full h3 {
	margin-bottom: 15px;
}

#interviews ul li .image {
	text-align: center;
	margin-bottom: 15px;
}

#interviews ul li p {
	margin-bottom: 15px;
}


/* =tibian-earth
************************************************************** */

#tibian-earth {
	background-color: #333;
	border-bottom: 5px #1a1a1a solid;
}

#tibian-earth .body {
	padding: 19px 13px 0;
	color: #fff;
}

#tibian-earth .body p {
	padding-bottom: 13px;
}

#tibian-earth form {
	margin-bottom: 13px;
}

#tibian-earth .body .field {
	float: left;
	margin-right: 10px;
	padding: 6px 5px 0;
	width: 159px;
	height: 20px;
	background: url(i/earth/input-bg.png) no-repeat left top;
}

#tibian-earth .body .field input {
	color: #4d4d4d;
	width: 159px;
	height: 18px;
	background: none;
	border: none;
}

#tibian-earth .body .field input.pre {
	color: #999;
	font-style: italic;
}

#tibian-earth .body .te-search-button {
	float: left;
	display: block;
	width: 26px;
	height: 26px;
	background: url(i/earth/search.png) no-repeat left top;
	text-indent: -1000em;
}

/* =shoutbox
************************************************************** */

#shoutbox {
	border-bottom: 5px #e25d00 solid;
}

#shoutbox ul {
	list-style: none;
}

#shoutbox ul li {
	border-bottom: 1px #e0ebf0 solid;
	background: url(i/shoutbox/shout-bg.gif) repeat-x left bottom;
	padding: 12px 18px;
}

#shoutbox ul li .info {
	color: #ccc;
	margin-bottom: 7px;
}

#shoutbox ul li .info .author {
	color: #e25d00;
	font-weight: bold;
}

#shoutbox ul li p {
	line-height: 1.4em;
}

#shoutbox form {
	padding: 18px 19px;
	background-color: #f5fbfe;
}

#shoutbox form .field {
	width: 250px;
	height: 20px;
	padding: 6px 5px 0;
	background: url(i/shoutbox/input-bg.png) no-repeat left top;
	margin-bottom: 11px;
}

#shoutbox form .field input {
	width: 250px;
	height: 18px;
	background: none;
	border: none;
}

#shoutbox form .field input.pre {
	color: #999;
	font-style: italic;
}

#shoutbox form .texta {
	float: left;
	width: 225px;
	height: 40px;
	padding: 6px 5px 0;
	background: url(i/shoutbox/texta-bg.png) no-repeat left top;
	margin-right: 5px;
}

#shoutbox form .texta textarea {
	width: 225px;
	height: 34px;
	background: none;
	border: none;
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
}

#shoutbox form .texta textarea.pre {
	color: #999;
	font-style: italic;
}

#shoutbox form .shout-search-button {
	display: block;
	float: left;
	width: 20px;
	height: 46px;
	background: url(i/shoutbox/submit.png) no-repeat left top;
	text-indent: -1000em;
}

/* =crumbs
************************************************************** */

#crumbs {
	float: left;
	color: #ccc;
	padding: 14px;
}

#crumbs a {
	color: #999;
	text-decoration: none;
}

#crumbs a:hover {
	text-decoration: underline;
}

#crumbs .current {
	color: #999;
	font-weight: bold;
}

/* =sub-footer
************************************************************** */

#sub-footer {
	background: url(i/subfooter/bg.png) no-repeat 112px top;
	padding: 40px 0;
	border-bottom: 1px #333 solid;
}

#sub-footer .inner {
	background: url(i/subfooter/caption.png) no-repeat 27px center;
	padding-left: 137px;
	line-height: 1.8em;
}

#sub-footer .inner a {
	color: #808080;
	font-size: 1.09em;
	text-decoration: none;
}

#sub-footer .inner a:hover {
	text-decoration: underline;
}

#sub-footer .inner .sep {
	color: #333;
	margin: 0 17px;
	font-size: 1.09em;
}

/* =footer
************************************************************** */

#footer {
	padding: 37px 28px;
}

#footer:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

#footer .inner {
	float: left;
}

#copy {
	color: #808080;
	margin-bottom: 5px;
}

#footer #copy a {
	color: #808080;
	font-weight: bold;
	text-decoration: none;
	font-size: 1.09em;
}

#footer #copy a:hover {
	text-decoration: underline;
}

#footer p a {
	color: #4d4d4d;
	text-decoration: underline;
}

#footer p a:hover {
	text-decoration: none;
}

#footer .functions {
	
}

#footer .functions:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

#footer .functions .col {
	float: left;
	padding-right: 20px;
	border-right: 1px #333 solid;
	margin-right: 20px;
}

/* =banners
************************************************************** */

.bann-billboard {
	width: 750px;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 20px;
	height: 100px;
}

.bann-rectangle {
	margin-bottom: 20px;
	text-align: center;
}

.bann-sky {
	margin-bottom: 20px;
}

.bann468 {
	float: right;
}

/* =general
************************************************************** */

a {
	color: #FF6000;
	text-decoration: underline;
	outline: none;
}

.semantic {
	display: none;
}

.columns:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

.img {
	text-indent: -1000em;
}

/* =buttons
************************************************************** */

.btn {
	padding-left: 8px;
	clear: both;
}

.btn:after {
	content: "";
	display: block;
	height: 0;
	overflow: hidden;
	clear: both;
}

.button {
	position: relative;
	display: block;
	float: left;
	outline: none;
	text-decoration: none;
}

.button.space {
	margin-right: 15px;
}

.button.right {
	float: right;
}

.button .btn-l {
	display: block;
	float: left;
	padding: 7px 5px 0 17px;
	height: 19px;
	color: #ccc;
	background-position: left top;
	background-repeat: no-repeat;
	font-weight: bold;
}

.button.dark .btn-l {
	background-image: url(i/buttons/dark-btn-l.png);
}

.button.light .btn-l {
	background-image: url(i/buttons/light-btn-l.png);
	color: #4d4d4d;
}

.button.orange .btn-l {
	background-image: url(i/buttons/orange-btn-l.png);
	color: #fff;
}

.button span {
	cursor: pointer;
}

.button .btn-r {
	display: block;
	float: left;
	width: 5px;
	height: 26px;
	background-position: left top;
	background-repeat: no-repeat;
}

.button.dark .btn-r {
	background-image: url(i/buttons/dark-btn-r.png);
}

.button.light .btn-r {
	background-image: url(i/buttons/light-btn-r.png);
}

.button.orange .btn-r {
	background-image: url(i/buttons/orange-btn-r.png);
}


.button:hover .btn-l {
	color: #fff;
}

.button.light:hover .btn-l {
	color: #000;
}

.button .ico {
	position: absolute;
	width: 16px;
	height: 26px;
	top: 0;
	left: -8px;
	background-position: left center;
	background-repeat: no-repeat;
}

.button .ico.article {
	background-image: url(i/icons/btn-article.png);
}

.button.light .ico.article {
	background-image: url(i/icons/light-btn-article.png);
}

.button .ico.raquo {
	background-image: url(i/icons/btn-raquo.png);
}

.button.light .ico.raquo {
	background-image: url(i/icons/light-btn-raquo.png);
}

.button.light .ico.comment {
	background-image: url(i/icons/light-btn-comment.png);
}

.button.orange .ico.raquo {
	background-image: url(i/icons/orange-btn-raquo.png);
}

.button .ico.stats {
	background-image: url(i/icons/btn-stats.png);
}

.button .ico.radio {
	background-image: url(i/icons/btn-radio.png);
}

.button .ico.question {
	background-image: url(i/icons/btn-question.png);
}

/* =sizes
************************************************************** */

 .size0 { background: none;}
 .size1 { width: 1%;}   .size2 { width: 2%;}  .size3 { width: 3%;}    .size4 { width: 4%;}
 .size5 { width: 5%;}   .size6 { width: 6%;}  .size7 { width: 7%;}    .size8 { width: 8%;}
 .size9 { width: 9%;}  .size10 { width: 10%;} .size11 { width: 11%;} .size12 { width: 12%;}
.size13 { width: 13%;} .size14 { width: 14%;} .size15 { width: 15%;} .size16 { width: 16%;}
.size17 { width: 17%;} .size18 { width: 18%;} .size19 { width: 19%;} .size20 { width: 20%;}
.size21 { width: 21%;} .size22 { width: 22%;} .size23 { width: 23%;} .size24 { width: 24%;}
.size25 { width: 25%;} .size26 { width: 26%;} .size27 { width: 27%;} .size28 { width: 28%;}
.size29 { width: 29%;} .size30 { width: 30%;} .size31 { width: 31%;} .size32 { width: 32%;}
.size33 { width: 33%;} .size34 { width: 34%;} .size35 { width: 35%;} .size36 { width: 36%;}
.size37 { width: 37%;} .size38 { width: 38%;} .size39 { width: 39%;} .size40 { width: 40%;}
.size41 { width: 41%;} .size42 { width: 42%;} .size43 { width: 43%;} .size44 { width: 44%;}
.size45 { width: 45%;} .size46 { width: 46%;} .size47 { width: 47%;} .size48 { width: 48%;}
.size49 { width: 49%;} .size50 { width: 50%;} .size51 { width: 51%;} .size52 { width: 52%;}
.size53 { width: 53%;} .size54 { width: 54%;} .size55 { width: 55%;} .size56 { width: 56%;}
.size57 { width: 57%;} .size58 { width: 58%;} .size59 { width: 59%;} .size60 { width: 60%;}
.size61 { width: 61%;} .size62 { width: 62%;} .size63 { width: 63%;} .size64 { width: 64%;}
.size65 { width: 65%;} .size66 { width: 66%;} .size67 { width: 67%;} .size68 { width: 68%;}
.size69 { width: 69%;} .size70 { width: 70%;} .size71 { width: 71%;} .size72 { width: 72%;}
.size73 { width: 73%;} .size74 { width: 74%;} .size75 { width: 75%;} .size76 { width: 76%;}
.size77 { width: 77%;} .size78 { width: 78%;} .size79 { width: 79%;} .size80 { width: 80%;}
.size81 { width: 81%;} .size82 { width: 82%;} .size83 { width: 83%;} .size84 { width: 84%;}
.size85 { width: 85%;} .size86 { width: 86%;} .size87 { width: 87%;} .size88 { width: 88%;}
.size89 { width: 89%;} .size90 { width: 90%;} .size91 { width: 91%;} .size92 { width: 92%;}
.size93 { width: 93%;} .size94 { width: 94%;} .size95 { width: 95%;} .size96 { width: 96%;}
.size97 { width: 97%;} .size98 { width: 98%;} .size99 { width: 99%;} .size100 { width: 100%;}