﻿@import "linkbutton.css";
@import "spinner.css";
@import "textbox.css";
@import "numberbox.css";
@import "slider.css";
@import "combo.css";
@import "combobox.css";

body {
	font-family: "Microsoft Yahei";
	font-size:12px;
	margin:0;
	padding:0;
}

.content {
	width: 980px;
	margin: 50px auto;
}
.content .left {
	float: left;
	width: 170px;
	border: 1px solid #eee;
	padding:20px;
	border-radius: 5px;
}
.content .left .calculate {
	font-size:14px;
}
.content .left .calculate span {
	color:red;
	font-weight: blod;	
}
.content .right {
	float: right;
	width: 750px;
	border: 1px solid #eee;
	padding: 38px 0;
	border-radius: 5px;
}
.content .right .linebox {
	clear: both;
	height: 40px;

}
.content .right .linebox2 {
	clear: both;
	height: 100px;
}
.content .right .linebox3 {
	clear: both;
	height: 60px;
}
.content .right .title {
	float: left;
	width: 90px;
	margin-right: 15px;
	text-align: right;
	font-size: 14px;
	font-weight: blod;	
	line-height:30px;
	color:#999;
}
.content .right .title2 {
	line-height:22px;
}
.content .right .value {
	float: left;
}

.l-btn, .l-btn:hover {
	float: left;
	position: relative;
	z-index: 10;
	width: 100px;
	height: 30px;
	margin-left: -1px;
	border: 1px solid #ddd;
	background-color: #fff;
	line-height: 30px;
	text-align: center;
	font-size: 12px;
	color: #4c4c4c;
	border-radius:0;
	outline:none;
}
.l-btn-selected, .l-btn-selected:hover {
	z-index: 20;
	border-color: #009FD9;
	background-color: #d6f4ff;
	color: #009FD9;
}
#monthbox a.l-btn, #monthbox a.l-btn:hover{
	width:60px;
	border: 1px solid #ddd;
	background-color: #f2f2f2;
	color: #999;
}
#monthbox a.l-btn-selected, #monthbox a.l-btn-selected:hover {
	border-color: #009fd9;
	background-color: #00c0ef;
	color: #fff;
}
.button-group a:first-child {
	border-radius: 2px 0 0 2px;
}
.button-group a:last-child {
	border-radius: 0 2px 2px 0;
}
.l-btn-left {
	vertical-align:baseline;
}
.l-btn-text {
	vertical-align:baseline;
}

.slider-inner {
	z-index: 10;
	height: 12px;
	top: 5px;
	border-radius: 3px;
}
.slider-inner-back {
	z-index: 20;
	margin: -1px 0 0 -1px;
	height: 12px;
	width: 100px;
	border-width: 1px;
	border-style: solid;
	border-radius: 3px 0 0 3px;
	border-color: #009fd9;
	background-color: #00c0ef;
}
.slider-handle {
	width: 12px;
	height: 26px;
	top: 50%;
	margin-top: -13px;
	margin-left: -6px;
}

.vps-box {
    border: #dddddd 1.0px solid;
    text-align: center; width: 231px;
    float: left;
    margin-right: 16px
}
.vps-box .vps-title {
    border-bottom: #dddddd 1.0px dashed;
    line-height: 60.0px;
    width: 200.0px;
    height: 60.0px;
    margin-left: 18.0px;
    font-size: 18.0px;
    font-weight: bold;
}
.vps-box .vps-content {
    text-align: left;
    line-height: 30.0px;
    margin-top: 20.0px;
    width: 180.0px;
    margin-bottom: 25.0px;
    margin-left: 28.0px;
}
.vps-box .vps-price2 {
    text-align: left;
    line-height: 30.0px;
    height: 98.0px;
    width: 200.0px;
    margin-bottom: 10.0px;
    margin-left: 18.0px;
    border-top: #dddddd 1.0px dashed;
    padding-top: 45.0px;
}
.vps-box .vps-price {
    text-align: left;
    line-height: 30.0px;
    width: 200.0px;
    margin-bottom: 10.0px;
    margin-left: 18.0px;
    border-top: #dddddd 1.0px dashed;
    padding-top: 15.0px;
}

.hosts {
	width: 100%;
	text-align: center;
	border-collapse: collapse;
}
.hosts th,
.hosts td
{
	border: 1px solid #dddddd;
	height: 28px;
	line-height: 28px;
}