* {
   margin: 0;
   padding: 0;
}
a {
   color: #666;
   text-decoration: none;
}
body {
   padding: 20px;
   color: #666;
}
.fl{
   float: left;
}
.fr {
   float: right;
}
table {
   border-collapse: collapse;
   border-spacing: 0;
   border: 0;
   text-align: center;
   width: 937px;
}
th, td {
   border: 1px solid #CADEFF;
}
th {
   background: #e2f2ff;
   border-top: 3px solid #a7cbff;
   height: 30px;
}
td {
   padding: 10px;
   color: #444;
}
tbody tr:hover {
   background: RGB(238,246,255);
}
.checkbox {
   width: 60px;
}
.goods {
   width: 300px;
}
.goods span {
   width: 180px;
   margin-top: 20px;
   text-align: left;
   float: left;
}
.price {
   width: 130px;
}
.count {
   width: 90px;
}
.count .add, .count input, .count .reduce {
   float: left;
   margin-right: -1px;
   position: relative;
   z-index: 0;
}
.count .add, .count .reduce {
   height: 23px;
   width: 17px;
   border: 1px solid #e5e5e5;
   background: #f0f0f0;
   text-align: center;
   line-height: 23px;
   color: #444;
}
.count .add:hover, .count .reduce:hover {
   color: #f50;
   z-index: 3;
   border-color: #f60;
   cursor: pointer;
}
.count input {
   width: 50px;
   height: 15px;
   line-height: 15px;
   border: 1px solid #aaa;
   color: #343434;
   text-align: center;
   padding: 4px 0;
   background-color: #fff;
   z-index: 2;
}
.subtotal {
   width: 150px;
   color: red;
   font-weight: bold;
}
.operation {
   width: 80px;
}
.operation span:hover, a:hover {
   cursor: pointer;
   color: red;
   text-decoration: underline;
}
img {
   width: 100px;
   height: 80px;
   /*border: 1px solid #ccc;*/
   margin-right: 10px;
   float: left;
}

.foot {
   width: 935px;
   margin-top: 10px;
   color: #666;
   height: 48px;
   border: 1px solid #c8c8c8;
   background-color: #eaeaea;
   background-image:linear-gradient(RGB(241,241,241),RGB(226,226,226));
   position: relative;
   z-index: 8;
}
.foot div, .foot a {
   line-height: 48px;
   height: 48px;
}
.foot .select-all {
   width: 100px;
   height: 48px;
   line-height: 48px;
   padding-left: 5px;
   color: #666;
}
.foot .closing {
   border-left: 1px solid #c8c8c8;
   width: 100px;
   text-align: center;
   color: #000;
   font-weight: bold;
   background: RGB(238,238,238);
   cursor: pointer;
}
.foot .total{
   margin: 0 20px;
   cursor: pointer;
}
.foot  #priceTotal, .foot #selectedTotal {
   color: red;
   font-family: "Microsoft Yahei";
   font-weight: bold;
}
.foot .selected {
   cursor: pointer;
}
.foot .selected .arrow {
   position: relative;
   top:-3px;
   margin-left: 3px;
}
.foot .selected .down {
   position: relative;
   top:3px;
   display: none;
}
.show .selected .down {
   display: inline;
}
.show .selected .up {
   display: none;
}
.foot .selected:hover .arrow {
   color: red;
}
.foot .selected-view {
   width: 935px;
   border: 1px solid #c8c8c8;
   position: absolute;
   height: auto;
   background: #ffffff;
   z-index: 9;
   bottom: 48px;
   left: -1px;
   display:none;
}
.show .selected-view {
   display: block;
}
.foot .selected-view div{
   height: auto;
}
.foot .selected-view .arrow {
   font-size: 16px;
   line-height: 100%;
   color:#c8c8c8;
   position: absolute;
   right: 330px;
   bottom: -9px;
}
.foot .selected-view .arrow span {
   color: #ffffff;
   position: absolute;
   left: 0px;
   bottom: 1px;
}
#selectedViewList {
   padding: 20px;
   margin-bottom: -20px;
}
#selectedViewList div{
   display: inline-block;
   position: relative;
   width: 100px;
   height: 80px;
   border: 1px solid #ccc;
   margin: 10px;
}
#selectedViewList div span {
   display: none;
   color: #ffffff;
   font-size: 12px;
   position: absolute;
   top: 0px;
   right: 0px;
   width: 60px;
   height: 18px;
   line-height: 18px;
   text-align: center;
   background: RGBA(0,0,0,.5);
   cursor: pointer;
}
#selectedViewList div:hover span {
   display: block;
}