/*basicStyle-computer.css仅用于电脑端的重置样式 网上资源（http://www.ruanyifeng.com/blog/2010/03/css_cookbook.html）*/

@charset "utf-8";
html{
	font-size: 12px;
	font-family: "微软雅黑",arial;
}
html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,blockquote,pre,hr,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea,menu{margin:0;padding:0;}
ol,ul,li{list-style: none;}
a,button{cursor:pointer;}
h1,h2,h3,h4,h5,h6,em,strong,b{font-weight:bold;}
del,ins,u,s,a,a:hover{text-decoration:none;}
table {border-collapse:collapse;border-spacing: 0} 
body,textarea,input,button,select,keygen,legend{font:12px/1.14 "微软雅黑",arial ; color:#333;outline:0;}
img{max-width: 100%; _width:100%;vertical-align: bottom;border: none;}/*ie6 不支持max-width 所以要添加_width*/
input[type=text]{vertical-align: middle;}
/*自定义classStyl样式*/
.sn-f-cb{*zoom: 1;}/*由于IE6-7不支持:after，使用 zoom:1触发 hasLayout*/
.sn-f-cb:after{content: '.';display: block;height: 0;visibility: hidden;clear: both;}
.sn-fl{float: left;}
.sn-fr{float: right;}
.sn-dn{display: none;}
.sn-db{display: block;}
.sn-dib{display: inline-block;*display:inline-block;*zoom:1;}
.sn-oh{overflow: hidden;}
.sn-on{outline: none;}
.sn-mw{min-width: 1200px;}
.sn-usn{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none;}/*文本不能被选择择*/
.sn-text-ellipsis{/*单行文本超出部分咦省略号显示*/
	/*width: 200px;*/ /*一定要设置文本边框的宽度大小*/
	overflow: hidden;
	text-overflow: ellipsis;/*文字显示省略符号来代表被修剪的文本。*/
	white-space: nowrap;/*文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。*/
	}
.sn-lines3-text-ellipsis{
	/*width: 200px;*/ /*一定要设置文本边框的宽度大小*/
	/*这个属性比较合适WebKit浏览器或移动端（绝大部分是WebKit内核的）浏览器。*/
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;/*必须结合的属性 ，将对象作为弹性伸缩盒子模型显示 。*/
	-webkit-line-clamp: 3;/*这里设置文本显示多少行*/
	-webkit-box-orient: vertical;/*必须结合的属性 ，设置或检索伸缩盒对象的子元素的排列方式 。*/
}
.sn-text-tu{text-transform: uppercase;}/*将所有字母变成大写*/
.sn-text-tl{text-transform: lowercase;}/*将所有字母变成小写*/
.sn-text-tc{text-transform: capitalize;}/*将首字母变成大写*/
.sn-font-vsc{font-variant: small-caps;}/*将字体变成小型的大写字母（即与小写字母等高的大写字母）*/
.sn-white-sn{white-space:nowrap;}
/*注意（将一个容器设为透明，可以使用下面的代码。在这四行CSS语句中，第一行是IE专用的，第二行用于Firefox，第三行用于webkit核心的浏览器，第四行用于Opera。）
 * .element { 
　　　　filter:alpha(opacity=50); 
　　　　-moz-opacity:0.5; 
　　　　-khtml-opacity: 0.5; 
　　　　opacity: 0.5; 
　　}
 */
img{
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
}

#app{background-color: #fff;}
/*右侧赛事列表*/
#deal-lists-box .sn-overseas-event{width: 100%;padding-top: 20px;}
#deal-lists-box .sn-overseas-title{width: 100%;height: 30px;line-height: 30px;font-size: 16px;color: #373737;}
#deal-lists-box .sn-overseas-item{width: 100%;}
#deal-lists-box .sn-overseasImg{width: 100%;overflow: hidden;}
#deal-lists-box .sn-overseasImg img{width: 100%;}
#deal-lists-box .sn-overseas-info{width: 100%;box-sizing: border-box;border: 1px solid #E2E2E2;border-top: none;text-align: center;}
#deal-lists-box .sn-overseas-info a{color: #0c0c0c;}
#deal-lists-box .sn-overseas-name,.sn-overseas-time{
	display: block;
	width: 100%;
	height: 30px;
	line-height: 30px;
	font-size: 15px;
	color: #373737;
	text-align: center;
	overflow: hidden;
	text-overflow: ellipsis;/*文字显示省略符号来代表被修剪的文本。*/
	white-space: nowrap;/*文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。*/
}
#deal-lists-box .sn-overseas-time{
	height: 20px;
	line-height: 20px;
	font-size: 12px;
	color: #808080;
}
#deal-lists-box .sn-overseas-lists{
	width: 100%;
	font-size: 0px;
	padding-top: 20px;
	padding-bottom: 30px;
}
#deal-lists-box .sn-overseas-option{
	display: block;
	width: 100%;
	height: 20px;
	line-height: 20px;
	position: relative;
	box-sizing: border-box;
	padding-right: 70px;
	font-size: 15px;
	color: #373737;
	margin-bottom: 10px;
	overflow: hidden;
	text-overflow: ellipsis;/*文字显示省略符号来代表被修剪的文本。*/
	white-space: nowrap;/*文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。*/
}
#deal-lists-box .sn-start-time{
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 20;
	font-size: 13px;
	color: #8b8b8b;
}
#deal-lists-box .sn-overseas-option:hover{
	color: #77cc32;
}
/*右侧赛事列表end*/


/*自定义按钮*/
.btn-white{background-color: #fff;color: #0f0f0f;border:1px solid #5e5e5e;}

.btn-item{
	background-color: #fff;
	color: #77cc32;
	border: 1px solid #77cc32;
}
.btn-item:hover{
	background-color: #ebf5ea;
	color: #666666;
}
.btn-item-click{
	background-color: #ebf5ea;
	color: #77cc32;
	border: 1px solid #77cc32;
}
.btn-item-disable{
	border: 1px dashed #cfcfcf;
	color: #cfcfcf;
	background-color: #F7F7F7;
}
.red-span{color: red;}
.btn-primary{
	background-color: #77cc32;
	color: #fff;
	border: 1px solid #77cc32;
}
.btn-primary:visited{
	background-color: #77cc32;
}
.btn-primary:hover{
	background-color: #77cc32;
	color: #fff;
	border: 1px solid #77cc32;
}
/*自定义按钮*/