.basic-grey {
margin-left:auto;
margin-right:auto;
max-width: 500px;
background: #F7F7F7;
padding: 25px 15px 25px 10px;
font: 12px Georgia, "Times New Roman", Times, serif;
color: #888;
text-shadow: 1px 1px 1px #FFF;
border:1px solid #E4E4E4;
}
.basic-grey h1 {
font-size: 25px;
padding: 0px 0px 10px 40px;
display: block;
border-bottom:1px solid #E4E4E4;
margin: -10px -15px 30px -10px;;
color: #888;
}
.basic-grey h1>span {
display: block;
font-size: 11px;
}
.basic-grey label {
display: block;
margin: 0px;
}
.basic-grey label>span {
float: left;
width: 24%;
text-align: right;
padding-right: 10px;
margin-top: 10px;
color: #888;
}
.basic-grey input[type="text"], .basic-grey input[type="email"], .basic-grey textarea, .basic-grey select {
border: 1px solid #DADADA;
color: #888;
height: 30px;
margin-bottom: 16px;
margin-right: 6px;
margin-top: 2px;
outline: 0 none;
padding: 3px 3px 3px 5px;
width: 70%;
font-size: 12px;
line-height:15px;
box-shadow: inset 0px 1px 4px #ECECEC;
-moz-box-shadow: inset 0px 1px 4px #ECECEC;
-webkit-box-shadow: inset 0px 1px 4px #ECECEC;
}
.basic-grey textarea{
padding: 5px 3px 3px 5px;
}
.basic-grey select {
background: #FFF url('down-arrow.png') no-repeat right;
background: #FFF url('down-arrow.png') no-repeat right);
appearance:none;
-webkit-appearance:none;
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
width: 70%;
height: 35px;
line-height: 25px;
}
.basic-grey textarea{
height:100px;
}
.basic-grey .button {
background: #E27575;
border: none;
padding: 10px 25px 10px 25px;
color: #FFF;
box-shadow: 1px 1px 5px #B6B6B6;
border-radius: 3px;
text-shadow: 1px 1px 1px #9E3F3F;
cursor: pointer;
}
.basic-grey .button:hover {
background: #CF7A7A
}



/*蓝色*/
.elegant-aero{
margin-left:auto;
margin-right:auto;
max-width:500px;
background:#D2E9FF;
padding:20px20px20px20px;
font:12pxArial,Helvetica,sans-serif;
color:#666;
}
.elegant-aeroh1 {
font:24px"Trebuchet MS",Arial,Helvetica,sans-serif;
padding:10px10px10px20px;
display:block;
background:#C0E1FF;
border-bottom:1pxsolid#B8DDFF;
margin:-20px-20px15px;
}
.elegant-aeroh1>span {
display:block;
font-size:11px;
}
.elegant-aerolabel>span {
float:left;
margin-top:10px;
color:#5E5E5E;
}
.elegant-aerolabel {
display:block;
margin:0px0px5px;
}
.elegant-aerolabel>span {
float:left;
width:20%;
text-align:right;
padding-right:15px;
margin-top:10px;
font-weight:bold;
}
.elegant-aeroinput[type="text"],.elegant-aeroinput[type="email"],.elegant-aerotextarea,
.elegant-aeroselect {
color:#888;
width:70%;
padding:0px0px0px5px;
border:1pxsolid#C5E2FF;
background:#FBFBFB;
outline:0;
-webkit-box-shadow:inset0px1px6px#ECF3F5;
box-shadow:inset0px1px6px#ECF3F5;
font:20012px/25pxArial,Helvetica,sans-serif;
height:30px;
line-height:15px;
margin:2px6px16px0px;
}
.elegant-aerotextarea{
height:100px;
padding:5px0px0px5px;
width:70%;
}
.elegant-aeroselect {
background:#fbfbfburl('down-arrow.png')no-repeatright;
background:#fbfbfburl('down-arrow.png')no-repeatright;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
text-indent:0.01px;
text-overflow:'';
width:70%;
}
.elegant-aero.button{
padding:10px30px10px30px;
background:#66C1E4;
border:none;
color:#FFF;
box-shadow:1px1px1px#4C6E91;
-webkit-box-shadow:1px1px1px#4C6E91;
-moz-box-shadow:1px1px1px#4C6E91;
text-shadow:1px1px1px#5079A3;
}
.elegant-aero.button:hover{
background:#3EB1DD;
}


/*绿色*/
.smart-green{
margin-left:auto;
margin-right:auto;
max-width:500px;
background:#F8F8F8;
padding:30px30px20px30px;
font:12pxArial,Helvetica,sans-serif;
color:#666;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}
.smart-greenh1 {
font:24px"Trebuchet MS",Arial,Helvetica,sans-serif;
padding:20px0px20px40px;
display:block;
margin:-30px-30px10px-30px;
color:#FFF;
background:#9DC45F;
text-shadow:1px1px1px#949494;
border-radius:5px5px0px0px;
-webkit-border-radius:5px5px0px0px;
-moz-border-radius:5px5px0px0px;
border-bottom:1pxsolid#89AF4C;
}
.smart-greenh1>span {
display:block;
font-size:11px;
color:#FFF;
}
.smart-greenlabel {
display:block;
margin:0px0px5px;
}
.smart-greenlabel>span {
float:left;
margin-top:10px;
color:#5E5E5E;
}
.smart-greeninput[type="text"],.smart-greeninput[type="email"],.smart-greentextarea,
.smart-greenselect {
color:#555;
height:30px;
line-height:15px;
width:100%;
padding:0px0px0px10px;
margin-top:2px;
border:1pxsolid#E5E5E5;
background:#FBFBFB;
outline:0;
-webkit-box-shadow:inset1px1px2pxrgba(238,238,238,0.2);
box-shadow:inset1px1px2pxrgba(238,238,238,0.2);
font:normal14px/14pxArial,Helvetica,sans-serif;
}
.smart-greentextarea{
height:100px;
padding-top:10px;
}
.smart-greenselect {
background:url('down-arrow.png')no-repeatright,-moz-linear-gradient(top,#FBFBFB0%,
#E9E9E9100%);
background:url('down-arrow.png')no-repeatright,-webkit-gradient(linear,lefttop,leftbottom,
color-stop(0%,#FBFBFB),color-stop(100%,#E9E9E9));
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
text-indent:0.01px;
text-overflow:'';
width:100%;
height:30px;
}
.smart-green.button{
background-color:#9DC45F;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-border-radius:5px;
border:none;
padding:10px25px10px25px;
color:#FFF;
text-shadow:1px1px1px#949494;
}
.smart-green.button:hover {
background-color:#80A24A;
}

/*白色*/
.white-pink{
margin-left:auto;
margin-right:auto;
max-width:500px;
background:#FFF;
padding:30px30px20px30px;
box-shadow:rgba(187,187,187,1)00px20px-1px;
-webkit-box-shadow:rgba(187,187,187,1)00px20px-1px;
font:12pxArial,Helvetica,sans-serif;
color:#666;
border-radius:10px;
-webkit-border-radius:10px;
}
.white-pinkh1 {
font:24px"Trebuchet MS",Arial,Helvetica,sans-serif;
padding:0px0px10px40px;
display:block;
border-bottom:1pxsolid#F5F5F5;
margin:-10px-30px10px-30px;
color:#969696;
}
.white-pinkh1>span {
display:block;
font-size:11px;
color:#C4C2C2;
}
.white-pinklabel {
display:block;
margin:0px0px5px;
}
.white-pinklabel>span {
float:left;
width:20%;
text-align:right;
padding-right:10px;
margin-top:10px;
color:#969696;
}
.white-pinkinput[type="text"],.white-pinkinput[type="email"],.white-pinktextarea,.white-pink
select{
color:#555;
width:70%;
padding:3px0px3px5px;
margin-top:2px;
margin-right:6px;
margin-bottom:16px;
border:1pxsolid#e5e5e5;
background:#fbfbfb;
height:25px;
line-height:15px;
outline:0;
-webkit-box-shadow:inset1px1px2pxrgba(200,200,200,0.2);
box-shadow:inset1px1px2pxrgba(200,200,200,0.2);
}
.white-pinktextarea{
height:100px;
padding:5px0px0px5px;
width:70%;
}
.white-pink.button{
-moz-box-shadow:inset0px1px0px0px#fbafe3;
-webkit-box-shadow:inset0px1px0px0px#fbafe3;
box-shadow:inset0px1px0px0px#fbafe3;
background:-webkit-gradient(linear,lefttop,leftbottom,color-stop(0.05,#ff5bb0),color-stop(1,
#ef027d));
background:-moz-linear-gradient(centertop,#ff5bb05%,#ef027d100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bb0',
endColorstr='#ef027d');
background-color:#ff5bb0;
border-radius:9px;
-webkit-border-radius:9px;
-moz-border-border-radius:9px;
border:1pxsolid#ee1eb5;
display:inline-block;
color:#ffffff;
font-family:Arial;
font-size:15px;
font-weight:bold;
font-style:normal;
height:40px;
line-height:30px;
width:100px;
text-decoration:none;
text-align:center;
text-shadow:1px1px0px#c70067;
}
.white-pink.button:hover {
background:-webkit-gradient(linear,lefttop,leftbottom,color-stop(0.05,#ef027d),color-stop(1,
#ff5bb0));
background:-moz-linear-gradient(centertop,#ef027d5%,#ff5bb0100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef027d',
endColorstr='#ff5bb0');
background-color:#ef027d;
}
.white-pink.button:active {
position:relative;
top:1px;
}
.white-pinkselect {
background:url('down-arrow.png')no-repeatright,-moz-linear-gradient(top,#FBFBFB0%,
#E9E9E9100%);
background:url('down-arrow.png')no-repeatright,-webkit-gradient(linear,lefttop,leftbottom,
color-stop(0%,#FBFBFB),color-stop(100%,#E9E9E9));
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
text-indent:0.01px;
text-overflow:'';
width:70%;
line-height:15px;
height:30px;
}

/**/


.bootstrap-frm{
margin-left:auto;
margin-right:auto;
max-width:500px;
background:#FFF;
padding:20px30px20px30px;
font:12px"Helvetica Neue",Helvetica,Arial,sans-serif;
color:#888;
text-shadow:1px1px1px#FFF;
border:1pxsolid#DDD;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}
.bootstrap-frmh1 {
font:25px"Helvetica Neue",Helvetica,Arial,sans-serif;
padding:0px0px10px40px;
display:block;
border-bottom:1pxsolid#DADADA;
margin:-10px-30px30px-30px;
color:#888;
}
.bootstrap-frmh1>span {
display:block;
font-size:11px;
}
.bootstrap-frmlabel {
display:block;
margin:0px0px5px;
}
.bootstrap-frmlabel>span {
float:left;
width:20%;
text-align:right;
padding-right:10px;
margin-top:10px;
color:#333;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
font-weight:bold;
}
.bootstrap-frminput[type="text"],.bootstrap-frminput[type="email"],.bootstrap-frmtextarea,
.bootstrap-frmselect{
border:1pxsolid#CCC;
color:#888;
height:20px;
line-height:15px;
margin-bottom:16px;
margin-right:6px;
margin-top:2px;
outline:0none;
padding:5px0px5px5px;
width:70%;
border-radius:4px;
-webkit-border-radius:4px;
-moz-border-radius:4px;
-webkit-box-shadow:inset01px1pxrgba(0,0,0,0.075);
box-shadow:inset01px1pxrgba(0,0,0,0.075);
-moz-box-shadow:inset01px1pxrgba(0,0,0,0.075);
}
.bootstrap-frmselect {
background:#FFFurl('down-arrow.png')no-repeatright;
background:#FFFurl('down-arrow.png')no-repeatright;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
text-indent:0.01px;
text-overflow:'';
width:70%;
height:35px;
line-height:15px;
}
.bootstrap-frmtextarea{
height:100px;
padding:5px0px0px5px;
width:70%;
}
.bootstrap-frm.button{
background:#FFF;
border:1pxsolid#CCC;
padding:10px25px10px25px;
color:#333;
border-radius:4px;
}
.bootstrap-frm.button:hover {
color:#333;
background-color:#EBEBEB;
border-color:#ADADAD;
}


/*黑色*/

.dark-matter{
margin-left:auto;
margin-right:auto;
max-width:500px;
background:#555;
padding:20px30px20px30px;
font:12px"Helvetica Neue",Helvetica,Arial,sans-serif;
color:#D3D3D3;
text-shadow:1px1px1px#444;
border:none;
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}
.dark-matterh1 {
padding:0px0px10px40px;
display:block;
border-bottom:1pxsolid#444;
margin:-10px-30px30px-30px;
}
.dark-matterh1>span {
display:block;
font-size:11px;
}
.dark-matterlabel {
display:block;
margin:0px0px5px;
}
.dark-matterlabel>span {
float:left;
width:20%;
text-align:right;
padding-right:10px;
margin-top:10px;
font-weight:bold;
}
.dark-matterinput[type="text"],.dark-matterinput[type="email"],.dark-mattertextarea,.dark-matterselect {
border:none;
color:#525252;
height:25px;
line-height:15px;
margin-bottom:16px;
margin-right:6px;
margin-top:2px;
outline:0none;
padding:5px0px5px5px;
width:70%;
border-radius:2px;
-webkit-border-radius:2px;
-moz-border-radius:2px;
-moz-box-shadow:inset01px1pxrgba(0,0,0,0.075);
background:#DFDFDF;
}
.dark-matterselect {
background:#DFDFDFurl('down-arrow.png')no-repeatright;
background:#DFDFDFurl('down-arrow.png')no-repeatright;
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
text-indent:0.01px;
text-overflow:'';
width:70%;
height:35px;
color:#525252;
line-height:25px;
}
.dark-mattertextarea{
height:100px;
padding:5px0px0px5px;
width:70%;
}
.dark-matter.button{
background:#FFCC02;
border:none;
padding:10px25px10px25px;
color:#585858;
border-radius:4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
text-shadow:1px1px1px#FFE477;
font-weight:bold;
box-shadow:1px1px1px#3D3D3D;
-webkit-box-shadow:1px1px1px#3D3D3D;
-moz-box-shadow:1px1px1px#3D3D3D;
}
.dark-matter.button:hover {
color:#333;
background-color:#EBEBEB;
}