platform-b2c/src/main/webapp/resources/css/common.css

/* 通用样式的预设 */
/* 
color
	theme color = #5078cb
	header color = #8fbcdc
	header kind color = #5078cb
	header dropdown background color = #f3faff
	footer color = #7bb4dc
	button color = #f39800;
 */
/* reset */
* {
	margin: 0;
	padding: 0;
}

html {
	color: #000;
	background: #fff
}

html, body {
    -ms-overflow-style: scrollbar;
}

body,button,input,select,textarea {
	font-family: "Microsoft Yahei", "微软雅黑" !important;
	font: 12px/1.5 tahoma, arial, 'Hiragino Sans GB', \5b8b\4f53, sans-serif;
}

body a {
	cursor: pointer;
}

a:hover {
	color: #5078cb;
}

dl a:hover,li>a:hover,p>a:hover {
	color: #f50
}

/* IE10 viewport bug workaround */
@-ms-viewport     { width: device-width; }
@-o-viewport      { width: device-width; }
@viewport         { width: device-width; }

/* render html5 elements as block */
header,footer,section,aside,nav,article {
	display: block;
}

body {
	line-height: 1;
	color: #555;
	font-size: 12px;
}

#top, #header, #nav, #content, #main, #footer {
	min-width: 1170px;
}

#top .container, #header .container, #nav .container, #content .container, #main .container, #footer .container {
  width: 1190px;
  margin: 0 auto;
}

.carousel-inner,.carousel-control:hover,.carousel-control:focus {
	cursor: pointer;
}

.navbar {
	margin-bottom: 0;
	border-radius: 0;
}

.nav-pills>li+li {
	margin-left: 0;
}

/* font-size */
.f12 {
	font-size: 12px;
}

.f14 {
	font-size: 14px !important;
}

.f16 {
	font-size: 16px;
}

.f18 {
	font-size: 18px;
}

.f20 {
	font-size: 20px;
}
.text-right{
	text-align: right !important;
}
.text-left{
	text-left: right !important;
}
.text-center{
	text-center: right !important;
}
/* text */
.text-theme {
	color: #5078cb !important;
}

.text-deep-blue {
	color: #23527c;
}

.text-default {
	color: #56a022;
}

.text-inverse {
	color: #f40 !important;
}

.text-black {
	color: black !important;
}

.text-success{
	color: #008000 !important;
}

.text-muted {
	color: #888 !important;
}

.text-light {
	color: #666;
}

.text-blue {
	color: #3a9a4f !important;
}

.text-purple {
	color: #b029d0 !important;
}

.text-num {
	font-style: normal;
	font-family: verdana;
}

.text-small {
	font-size: 10px;
	font-family: "microsoft yahei";
	-webkit-transform: scale(0.83);
	-o-transform: scale(0.83);
	transform: scale(0.83);
}

.text-bold {
	font-weight: 700;
}

.text-border-success {
	border: 1px solid #f40;
	color: #f40;
	background-color: #fff;
	padding: 2px 4px;
}

.text-trans {
	position: absolute;
	top: 5px;
	right: 5px;
	background-color: #fff;
	border: 1px solid;
	padding: 3px 14px;
	font-size: 16px;
	font-family: "LiShu";
	border-radius: 10px;
	-moz-transform: rotate(-10deg);
	-webkit-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
	transform: rotate(-10deg);
	border-radius: 10px;
	opacity: 0.7;
	white-space: nowrap;
}

.text-trans.success {
	color: #ffb433;
	border-color: #ffb433;
}

.text-trans.error {
	color: #d44950;
	border-color: #d44950;
}

.text-trans.warning {
	color: #7f64b5;
	border-color: #7f64b5;
}

.text-ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-link {
	color: #5e696e;
  	cursor: pointer;
  	text-decoration: underline;
}

.text-required {
	font-family: '楷体';
	color: #e42a2a;
	margin-right: 2px;
}

.text-simple {
	color: #9c9c9c
}

/* scroll */
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-thumb {
	background-color: #c1c1c1;
	border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
	background-color: #959595;
}
/*placeholder*/
input::-webkit-input-placeholder{
	color: #999;
}
input:-moz-placeholder{
	color: #999;
}
input::-moz-placeholder{
	color: #999;
}
　　input:-ms-input-placeholder{
	color: #999;
}
/* button btn */
.btn-inverse {
	color: #fff;
	font-weight: bold;
	background-color: #ff7300;
	border-color: #ef5813;
}

.btn-inverse:hover,.btn-inverse:focus,.btn-inverse:active,.btn-inverse.active
	{
	color: #fff;
	background-color: #ef5813;
}

.btn-theme {
	color: #fff;
	font-weight: bold;
	background-color: #7bb4dc;
	border-color: #5078cb;
}

.btn-theme:hover,.btn-theme:focus,.btn-theme:active,.btn-theme.active
	{
	color: #fff;
	background-color: #5078cb;
}

.input-inverse {
	border: 3px solid #ff7300;
	border-right-width: 0
}

.badge {
	background-color: #aaa;
	padding: 2px 5px;
}

.badge-inverse {
	background-color: #fe8843;
}
/*dropdown*/
.dropdown>.dropdown-toggle {
	border-style: solid;
	border-width: 0 1px;
	border-color: transparent;
}

.dropdown>.dropdown-toggle>.caret {
	margin-top: -2px;
	color: #9c9c9c
}

.dropdown:hover>.dropdown-toggle {
	position: relative;
	background-color: #ffffff;
	border: 1px solid #eee;
	border-top: 0;
	border-bottom: 0;
	z-index: 1001;
}

.dropdown:hover>.dropdown-menu {
	display: block;
	position: absolute;
	border-color: #eee;
}

.dropdown:hover .caret,.dropdown-toggle:hover .caret {
	border-bottom: 4px solid !important;
	border-top: none;
}

.dropdown-submenu {
	position: relative;
}

.dropdown-submenu>.dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: 0;
}

.dropdown-submenu:hover>.dropdown-toggle {
	position: relative;
	background-color: #ffffff;
	border-color: transparent;
	z-index: 1001;
}

.dropdown-submenu:hover>.dropdown-menu {
	display: block;
	min-width: 120px;
	font-size: 12px;
}

.dropdown-submenu.pull-left {
	float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
	left: -100%;
	margin-left: 10px;
	-webkit-border-radius: 6px 0 6px 6px;
	-moz-border-radius: 6px 0 6px 6px;
	border-radius: 6px 0 6px 6px;
}

.dropdown-menu.arrow:before,.dropdown-menu.arrow:after {
	content: '';
	position: absolute;
	top: 15%;
	width: 0;
	height: 0;
	border: 10px solid transparent;
}

.dropdown-menu.arrow.left:before {
	margin-top: -11px;
	left: -20px;
	border: 10px solid transparent;
	border-right-color: #aaa;
}

.dropdown-menu.arrow.left:after {
	margin-top: -11px;
	left: -19px;
	border: 10px solid transparent;
	border-right-color:#fff;
}

/*form valid*/
input.ng-invalid.ng-dirty,textarea.ng-invalid.ng-dirty {
	background-color: #fff8ee;
	border-color: #CC0033;
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
	cursor: pointer;
}

/* modal 模态框 */
.modal-open {
    overflow: auto;
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: hidden;
		z-index: 1000000 !important;
}


.table-bordered tr>td.border-leright {
	border-right: none !important;
	border-left: none !important;
}

.modal {
    position: absolute;
    top:50%;
	left:50%;
	margin-left:-50%;
	margin-top:-300px;
}

.modal-backdrop.in {
    filter: alpha(opacity=30);
    opacity: .3;
}

/*loading new by suntg*/
.loading {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.loading.in {
	display: block;
	z-index: 9999999999;
}

.loading.in>i {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -66px 0 0 -33px;
	background: url("../img/all/loading.gif") no-repeat center center;
	width: 66px;
	height: 66px;
}


/* ::: 面板 ::: */
.u-panel {
	border: 1px solid #1BA5F8;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
.u-panel-heading {
	height: 57px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	background-image: url("../img/product/title-higher-bg.png");
	text-align: center;
	line-height: 57px;
}
.u-panel-body {
	padding: 5px;
	text-align: center;
	min-height: 75px;
	font-size: 12px;
	position: relative;
	background-color: rgb(255, 255, 255);
	line-height: 1.8;
}
.u-panel-body > div {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
/* 提示框 */
.callout {
	position: absolute;
	border: 1px solid #dddddd;
	background-color: white;
	box-shadow: 5px 5px 5px #E2E3E4;
	color: hsl(0, 100%, 50%);
	border-radius: 3px;
	padding: .3em .7em;
	z-index: 10;
}
.callout::before {
	content: "";
	position: absolute;
	top: -.4em; left: 1em;
	padding: .35em;
	background: inherit;
	border: inherit;
	border-right: 0;
	border-bottom: 0;
	transform: rotate(45deg);
}

/*
 * 表格单元格之间流出空隙
 * @author yangck
 */
table .before-blank, .table-bordered>tbody>tr>td.before-blank, .table-bordered>tbody>tr>th.before-blank, .table-bordered>tfoot>tr>td.before-blank, .table-bordered>tfoot>tr>th.before-blank, .table-bordered>thead>tr>td.before-blank, .table-bordered>thead>tr>th.before-blank {
	position: relative;
	border-right: 13px solid white;
}
table .before-blank:before {
	position: absolute;
	top: 0;
	right: -0.5px;
	content: " ";
	height: 100%;
	width: 1px;
	background: #eee;
	/*border: 1px solid #eee;*/
}
table .before-blank:after {
	position: absolute;
	top: 0;
	right: -13.5px;
	content: " ";
	height: 100%;
	width: 1px;
	background: #eee;
}
table th.before-blank:before, table th.before-blank:after {
	background: #317eac;
}
.select-adder {
	background: url(../img/user/images/xiala.png) right no-repeat #fff !important;
	background-position-x: 100% !important;
}
.check-active{
	padding-left: 0 !important;
}
.check-active label{
	width: 15px;
	height: 15px;
	display: inline-block;
	background: url(../img/user/images/check.png) no-repeat;
	position: relative;
	padding-left: 0 !important;
	overflow: hidden;
	margin-bottom: 0 !important;
	vertical-align: sub;
	margin-right: 5px !important;
	min-height: 15px !important;
	left: 0 !important;
}
.check-active input{
	display: none;
}
.check-active span{
	font-size: 14px;
}
.check-active a:hover{
	color: #5078cb !important;
}
.check-active input[type="checkbox"]:checked + label {
	background-position: -15px 0;
}
.check-active input[type="checkbox"]:checked + label + span{
	color: #5078cb;
}

.hei16{
	height: 14px !important;
	background: #ecf2fd;
	padding: 0 !important;
	border-bottom: none !important;
}

/*公用table*/
.public-tab{
	margin-bottom: 0;
}
.public-tab.table tr td, .public-tab.table tr th {
	font-size: 14px;
	vertical-align: middle !important;
}
.public-tab.table>tbody+tbody{
	border-top: none;
}
.public-tab.table>thead>tr{
	height: 40px !important;
}
.public-tab.table>thead>tr>th,.public-tab.table>tbody>tr>td{
	border-bottom: #e8e8e8 1px solid;
	text-align: center;
}
.public-tab.table>thead>tr>th{
	border-bottom: none !important;
}
.public-tab.table>tbody>tr>td{
	border-top: none;
	border-bottom: #e8e8e8 1px solid;
}
.public-tab.table>tbody>tr>td a{
	margin: 0 10px;
}
.grey{
	color: #999;
}
.search-check{
	width: 100%;
	height: 54px;
	background: #fff;
	padding-top: 10px;
	margin-bottom: 16px;
}
.search-check .search{
	width: 550px;
	margin-left: 150px;
}
.search-check .search .form-control{
	width: 340px;
	float: left;
	height: 34px;
	border-radius: 0;
	box-shadow: none;
	border-right: none;
}
.search-check .search button,.search-check .search a{
	display: inline-block;
	width: 94px;
	height: 34px;
	line-height: 34px;
	text-align: center;
	font-size: 14px;
}
.search-check .search button{
	background: #d3e1fc;
	border-radius: 0;
	border: none !important;
	border-left: none;
}
.search-check .search a{
	background: #5078cb;
	color: #fff;
	float: right;
}
.search-check .search button:hover,.search-check .search a:hover{
	color: #fff;
	background: #3f7ae3;
}
.search-check .check{
	font-size: 14px;
	line-height: 35px;
}
.search-check .check a{
	font-size: 14px;
	margin-right: 20px;
	color: #333;
}
.search-check .check a:hover{
	color: #5078cb;
}
.search-check .check .check-active{
	margin-right: 15px;
}
.search-check .check .check-active span{
	font-weight: normal;
	color: #333;
}
.search-check .check .check-active label{
	margin-right: 0 !important;
}
.check-input input{
	display: none;
}
.check-input label label {
	width: 15px;
	height: 15px;
	display: inline-block;
	background: url(../img/user/images/check.png) no-repeat;
	position: relative;
	padding-left: 0 !important;
	overflow: hidden;
	margin-bottom: 0 !important;
	vertical-align: sub;
	min-height: 15px !important;
	left: 0 !important;
}
.check-input input[type="checkbox"]:checked + label{
	background-position: -15px 0;
}

.screen .sreach .btn-default{
	border: none;
}
.screen .sreach table .text-center{
	padding-bottom: 0 !important;
}
.blue-bg{
	background: #5078cb !important;
}


/*分页公共样式*/
div.ng-table-pager a.page-a{
	background: #5078cb !important;
}
.wanted_list01 .pagination>.active>a{
	background: #5078cb;
}
.down-goods-btn{
	display: inline-block;
	width: 94px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	font-size: 14px;
	background: #5078cb;
	color: #fff;
	float: right;
	margin-right: 15px;
	margin-top: 2px;
}
.down-goods-btn:hover{
	background: #3f7ae3;
	color: #fff;
}
.ng-table-pager{
	margin-right: 20px !important;
	background: #fff;
}
.ng-table-pager .ng-table-pagination li.active a{
	background: #5078cb !important;
}
.ng-table-pager .ng-table-pagination li.active a:hover{
	color: #fff !important;
}
div.ng-table-pager div.page-go-block{
	margin-top: 0 !important;
}
.ng-table-pagination .page-number{
	height: 30px !important;
	border-bottom-right-radius: 0;
	border-top-right-radius: 0;
}
body div.ng-table-pager input.page-number{
	width: 40px;
	height: 30px;
	padding: 0 !important;
	line-height: 30px;
}
body div.ng-table-pager a.page-a{
	color: #fff;
	border-color: #4574E8;
	/*padding: 6px 6px !important;*/
	font-size: 14px;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	text-decoration: none;
	height: 30px !important;
	display: inline-block;
	width: 35px;
	padding: 0;
	text-align: center;
	line-height: 30px;
}
.ng-table-pagination .page-a:hover{
	background: none !important;
}
.text-more{
	display: block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.no-record-list tr{
	height: 150px !important;
}
.no-record-list tr:hover{
	background: none !important;
}
.no-record-list tr span{
	font-size: 12px;
	color: #999;
	margin-left: 20px;
}
.no-record-list tr td{
	border-bottom: none !important;
}
.public-tab.table .no-record-list tr td{
	vertical-align: middle !important;
}
.no-record-list tr td img,.no-record-list tr td span{
	position: relative;
	bottom: -20px;
}
.no-record-list tr.height200{
	height: 200px !important;
}
.no-record-list tr.height200 img,.no-record-list tr.height200 span{
	bottom: 0 !important;
}
#left-nav-fragment .user_left ul li a:focus,#left-nav-fragment .user_left p:hover{
	color: #fff !important;
}
input:required:invalid, input:focus:invalid, textarea:required:invalid, textarea:focus:invalid{box-shadow: none;}

.color333{
	color: #333 !important;
}
.color666{
	color: #666 !important;
}
.color999{
	color: #999 !important;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:    #999;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:    #999;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:    #999;
}
/*显示多少条下拉*/
.show-input{
	margin-right: 40px;
	width: 116px;
	display: inline-block;
}
.show-input .form-control{
	width: 45px;
	height: 22px;
	line-height: 22px;
	border-radius: 1px;
	padding: 0 2px;
	float: right;
	margin-left: 5px;
	font-size: 12px;
}
.search-check .more-hover {
	color: #fff !important;
}
.search-check .check{
	position: relative;
}
.search-check .check ul{
	width: 94px;
	position: absolute;
	left: 0;
	top: 30px;
	background: #fff;
	border: #e8e8e8 1px solid;
	padding: 5px 0;
	display: none;
	z-index: 200;
}
.search-check .check:hover ul{
	display: inline-block;
}
.search-check .check ul li{
	width: 100%;
	line-height: 22px;
	float: left;
}
.search-check .check ul li a{
	display: inline-block;
	width: 100%;
	height: 22px;
	text-align: center;
	font-size: 14px;
	line-height: 22px;
}
.red{
	color: #f00 !important;
}
.blue{
	color: #5078cb !important;
}

/*全选操作*/
.operation-btn{
	margin-right: 15px;
	margin-top: 4px;
}
.operation-btn a{
	width: 55px;
	height: 26px;
	line-height: 26px;
	display: inline-block;
	text-align: center;
	font-size: 14px;
}
.operation-btn a.off{
	background: #b4b5b9;
	color: #333;
	margin-right: 10px;
}
.operation-btn a.ok{
	background: #5078cb;
	color: #fff;
}

/*改为按钮*/
.edit-icon button {
	width: 50px;
	height: 24px;
	border: none;
	color: #fff;
	float: left;
}
.edit-icon button:nth-of-type(2){
	margin-top: 3px;
}
.edit-icon button.ok {
	background: #33b401;
}
.edit-icon button.off {
	background: #f15601;
}
.edit-icon button.edit {
	background: #5078cb;
}
.edit-icon button.up {
	background: #fff;
	border: #5078cb 1px solid;
	color: #5078cb;
}
.edit-icon button.up:hover{
	background: #5078cb;
	color: #fff;
}

/* 去除数字输入框的上下箭头 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
	margin: 0;
}
/*去掉搜狗小键盘样式*/
input::-webkit-input-safebox-button{
	display: none;
}
/*去除textarea默认右下角可自由放大样式*/
textarea{resize:none}

.form-control:focus {
	border: 1px solid #4272d3;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
.form-control {
	border-color: #a9a9a9;
}

input[type="number"]{
	-moz-appearance: textfield !important;
}
select {
	-moz-appearance: none;
}

/*买卖家订单详情及结算页手续费样式*/
.oder_xq_list dl span.total-price{
	float: right;
	width: auto !important;
	position: relative;
	bottom: 22px;
	z-index: 10;
	/*margin-right: 20px;*/
}
.oder_xq_list dl span.total-price p{
	line-height: 25px;
	font-size: 14px;
	text-align: right;
}
.oder_xq_list dl span.total-price p:last-child,
.oder_xq_list dl span.total-price p:last-child em,
.oder_xq_list dl span.total-price p:last-child strong{
	color: #e64040;
	font-weight: bold;
}
.oder_xq_list dl span.total-price p em{
	color: #333;
	width: 150px;
	text-align: left;
}
.oder_xq_list dl span.total-price strong{
	font-weight: normal;
	width: 200px;
	display: inline-block;
	float: left;
	color: #666;
	padding-right: 15px;
}
.oder_xq_list dl span.total-price strong .price-down {
	display: inline-block;
	width: 32px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	color: #fff;
	background: #36ab67;
	border-radius: 2px;
	float: none;
	font-size: 12px;
	margin-right: 6px;
	cursor: pointer;
}
.oder_xq_list dl span.total-price .price-down-tag {
	text-decoration: line-through;
	margin: 0;
	font-size: 14px;
}
.oder_xq_list dl span.total-price .remind-tag {
	position: absolute;
	background: #fff;
	padding: 12px;
	border: 1px solid #d3e2fc;
	top: 54px;
}
.oder_xq_list dl span.total-price .remind-tag .remind-tag-content {
	text-align: left;
	line-height: 21px;
}
.oder_xq_list dl span.total-price .remind-tag .remind-tag-content.red-text {
	color: #ef2324;
}
.oder_xq_list dl span.total-price .remind-tag.intro {
	left: -46px;
}
.oder_xq_list dl span.total-price .remind-tag.intro .remind-tag-content{
	max-width: 214px;
}
.oder_xq_list dl span.total-price .remind-tag.activity {
	left: 0;
}
.oder_xq_list dl span.total-price .remind-tag.activity .remind-tag-content{
	max-width: 173px;
}
.oder_xq_list dl span.total-price strong .fa {
	font-size: 19px;
	color: #cdddfc;
	margin-right: 5px;
	vertical-align: middle;
	cursor: pointer;
}
.oder_xq_list dl span.total-price em{
	float: left;
}