@charset "utf-8";
/* general styles */
body {
	font: 80% Verdana, Arial, Helvetica, sans-serif;
	background-color: #686;
	margin: 0;
	padding: 0 4px 0 4px;
	text-align: center; /* centers the container in IE 5* browsers. */
	color: #444;
}
a:link, a:visited {
	text-decoration: none;
	color: #242;
}
a:hover {
	text-decoration: underline;
}
img {
	vertical-align: middle;
	border: none;
}
div, h1, h2, h3 {
	margin: 0;
	padding: 0;
}
p {
	margin: 0;
	padding: 0;
	/* margin-top: 0.25em; */
	margin-bottom: 0.75em;
}
ul, li {
	margin-top: 0;
	margin-bottom: 0.125em;
	padding-top: 0;
	padding-bottom: 0;
}
/* layout styles */
.mospot #container { 
	/* width: 100%; */
	background-color: #FDFDFA;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page if needed */
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding-left: 0.75em;
	padding-right: 0.75em;
	padding-bottom: 0.5em;
	border-top: 0.5em solid #060;
}  
.mospot #header {
	clear: both;
/*	background-color: #DDDDDD;  */
} 
.mospot #sidebarLeft {
	float: left; 
	width: 11em; /* since this element is floated, a width must be given */
	background-color: #EBEBEB;
	padding: 0px 0;
}
.mospot #sidebarRight {
	float: right; 
	width: 11em; /* since this element is floated, a width must be given */
	background-color: #EBEBEB;
	padding: 0px 0;
}
.mospot #mainContent {
 	margin: 0em 0em 0 0em;
	padding: 4px;
	background-color: #FDFDFA;
	border: 1px dotted #CCC;
} 
.mospot #footer { 
	clear: both;
	background-color: #686;
	text-align:center;
	padding-top: 0.5em;
	margin-bottom: 2em;
}
.mospot #footer p {
	margin: 0;
	padding: 0px 0;
}

/* header element style */
#logo {
	padding-top: 2em;
	padding-bottom: 1em;
}
#navi {
	padding-left: 0.2em;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	margin-bottom: 0.5em;
	/* background-color:#efe */
}
#navi ul {
	margin: 0;
	padding: 0;
	display: inline;
	list-style-type: none;
	/*border-bottom: 1px solid #686;*/
	/*border-top: 1px solid #686;*/
	background-color: #686;
}
#navi li {
	padding-left: 0.5em;
	padding-right: 0.5em;
	display: inline;
}
#navi .current {
	border-left: 1px dotted #686;
	border-right: 1px dotted #686;
	border-top: 1px dotted #686;
	background-color: #FDFDFA;
}
#navi .normal{
	/*background-color: #686;*/
}
#navi .normal a {
	color: #FFF;
}
#navi .current a {
	color: #242;
}

/* products page style */
.products, .download, .buy, .articals{
	clear: both;
	border-top: 0.2em solid #999;
	margin-top: 0.5em;
	margin-bottom: 2em;
}
.title {
	margin-top: 0.8em;
	margin-bottom: 0.7em;
}
.title h2 {
	font-size: medium;
	display: inline;
}
.title .platform {
	margin-left: 2em;
	font-style: italic;
	/*font-weight: bold;*/
}

.title .price {
	float: right;
	margin-top: 0.25em;
}
.title .price em {
	font-weight: bold;
	font-style: normal;
	color: #A22;
}

.title .datetime {
	margin-left: 1em;
	color: #999;
}

.thumbnail {
	float: left;
	margin-bottom: 2em;
}
.products .thumbnail img {
	width: 160px;
}
.download .thumbnail img, .buy .thumbnail img {
	width: 80px;
}

.action {
	clear: right;
	float: right;
}
.action li {
	list-style-type: square;
	font-weight: bold;
}

.products .content {
	margin-left: 180px;
	margin-right: 4em;
}
.download .content, .buy .content {
	margin-left: 100px;
	margin-right: 4em;
}

.buy .buy_product ul{
	margin-top: 0.5em;
	list-style-type: square;
	/*font-weight: bold;*/
}
.buy .buy_product ul img {
	/*height: 24px;*/
	/*font-weight: bold;*/
}

.buy form {
	display: inline;
}
.buy form input, .buy form label, .buy form label input {
	vertical-align: middle;
}
.buy form label input {
	width: 8em;
	/*height: 1em;*/
}
.products_comment {
	margin-top: 2em;
	padding-top: 0.5em;
	border-top: 2px solid #CCC;
}
.products_comment ul{
	margin-left: 1em;
	padding-left: 1em; 
	list-style-type: none;
}
sup {
	/* margin-left: 0.5em */;
	font-size: smaller;
	font-weight: normal;
}

/* support page style */
.support {
	margin-top: 0.5em;
	margin-bottom: 1em;
}
.support a {
	font-weight: bold;
}

/* utility style*/
.clear {
	clear: both;
}