body{
		margin: 0;
	    padding: 0;
	    font-size: 14px;
	    min-height: 650px;
	    font-family: 'Microsoft Yahei','Hiragino Sans GB',Tahoma,Arial,Helvetica,STHeiti;
		background-color:#F6F6F6;
	}
	.container{
		max-width:1200px;
		width:100%;
		margin:30px auto 50px;
		min-height: 400px;
	}	
	.header{
	   background: #fff;
	   position:relative;
	   overflow:hidden;
	   height:50px;
	   line-height:50px;
	}
	.smallCircle{
	        width: 20px;
		    height: 20px;
		    background: #CE3939;
		    position: absolute;
		    border-radius: 50%;
		    left: -11px;
		    top: -11px;
	}
	.newsLeast{
		color:#333333;
		font-size:18px;
		margin-left: 24px;
	}
	.more{
		font-size:18px;
		color:#999999;
		position:absolute;
		right:24px;
		padding-right: 22px;
  		background: url(../../../img/mobile/button_more.png) no-repeat right center;
  		background-size: 18%;
  		cursor:pointer;
	}
	.recommand li{
		/*
		height:210px;
		width:49%;
		float:left;
		list-style:none;
		border-top:1px solid #dddddd;
		position:relative;
		cursor: pointer;
		*/
	}
	.recommand li{
		height:165px;
		width:50%;
		box-sizing: border-box;
		float:left;
		list-style:none;
		border-top:0.5px solid #dddddd;
		position:relative;
		cursor: pointer;
	}
	.recommand li:nth-child(odd){
		border-right: 0.5px solid #dddddd;
	}
	.mar{
		margin-top:20px;
	}
	.recommand{
		background: #fff;
		padding-left:0px;
	}
	
	.recommand li:nth-child(odd){
		/*
		border-right:1px solid #dddddd;
		*/
	}
	.liveImg{
		margin-left:30px;
		margin-top:30px;
		overflow: hidden;
		position:relative;
		float:left;
	}
	.liveImg img{
		height:120px;
		width:180px;
		border-radius:4px;
	}
	.online{
		height: 21px;
	    line-height: 18px;
	    width: 84px;
	    background:#ce3939;
	    text-align:center;
	    position:absolute;
        transform: rotate(-45deg);
	    left: -19px;
    	top: 12px;
    	color: #fff;
	}
	.title{
		float:left;
		color: #333333;
	    font-size: 18px;
	    margin-left: 20px;
	    width:46%;
	    margin-top:30px;
	}
	.gps{
        position: absolute;
	    top: 130px;
	    left: 230px;
	    font-size: 16px;
	    width:46%;
	}
	.gps_live{
		display: inline-block;
	    width: 100px;
	    height: 22px;
	    color: white;
	    background: #b6b6b6;
	    border-radius: 12px;
	    text-align: center;
	    line-height:22px;
	}
	.watch{
		background: url(../../../img/mobile/pc_bg_watch.png) no-repeat left center;
	    padding-left: 30px;
	    width: 17%;
	    display: inline-block;
	    float: right;
	    color:#999999;
	}
	.yellowBg{
		background:#ff9c33;
	}
	.greenbg{
		background:#4bc5b5;
	}
	.clear{
		clear:both;
	}
	.wating{
        position: absolute;
	    margin-top: -73px;
	    text-align: center;
	    font-size: 14px;
	    width: 180px;
	    color: #fff;
	}
	.hidden{
		display:none;
	}
	.mask{
    	height: 120px;
	    width: 180px;
	    background:black;
    	opacity:0.3;
	}
	.masks{
		background: url(../../../img/mobile/picture_default.png) no-repeat center;
		background-size:100% 100%;
		border-radius: 4px;
	}
	.visibilty{
		visibility:hidden;
	}
	.recommand li a{
		display: block;
	    width: 100%;
	    height: 100%;
	}
	
	.start-time {
		width: 104px;
    	height: 15px;
    	position: absolute;
    	top: 51px;
    	left: 0;
    	right: 0;
    	margin: auto;
    	overflow: hidden;
    	font-size: 12px;
    	color: #fff;
	}
	
@media screen and (min-width:960.0001px){
	.recommand li{
		height:210px;
		width:50%;
		box-sizing: border-box;
		float:left;
		list-style:none;
		border-top:0.5px solid #dddddd;
		position:relative;
		cursor: pointer;
	}
}
@media screen and (min-width:780px) and (max-width:960px){
	.recommand li{
		height:210px;
		width:50%;
		box-sizing: border-box;
		float:left;
		list-style:none;
		border-top:0.5px solid #dddddd;
		position:relative;
		cursor: pointer;
	}
   .title,.gps{
		width:35%;
		font-size:12px;
	}
	.gps_live{
		width:60px;
	}
	.gps{
		width:29%;
	}
	.watch{
		margin-top: 4px;
		width:9%;
	}
}
@media screen and (min-width:730px) and (max-width:780px){
   .title,.gps{
		width:31%;
		font-size:12px;
	}
	.gps{
		width:30%;
		left: 215px;
	}
	.gps_live{
		width:50px;
	}
	 .liveImg,.title{
   	 margin-left:6%;
   }
   .watch{
   	     margin-top: 2px;
   }
}		
@media screen and (max-width:730px){
	.title{
		 padding-top: 0px;
	}
	.mar{
		margin-top:10px;
	}
	.gps{
		 top:0px;
		 bottom:0px;
		 position:relative;
	}
	 .container{
	 	margin-top:10px;
	 }
	 .header{
	 	height: 35px;
	    line-height: 35px;
	 }
	 .newsLeast{
	 	font-size:15px;
	 }
	 .more{
	 	font-size:11px;
	 }
	 .liveImg img{
	 	width:138px;
	 	max-height:127px;
	 	width: 100%;
    	height:90px;
	 }
	 .liveImg{
	 	width:84%;
   	    margin: 6px 5% 6px 10%;	 	
	 }
	 .title{
	 	margin: 6px 5% 6px 10%;
	 }
	 .online{
	 	font-size:10px;
	 	left:-15%;
   		top:7px;
    	width:56%;
    	height:18%;
	 }
	 .recommand{
	 	padding-left: 0px;
	 	margin-top:0px;
	 }
	 .recommand li{
	 	/*
	 	border:none;
	 	height:170px;
	 	width:50%;
	 	*/
	 }
	 .recommand li:nth-child(odd){
	 	/*
		border-right:none;
		*/
	}
	.title{
		float: none;
	    font-size: 12px;
	    width: 138px;
	    margin-left: 12px;
    	clear: both;
    	overflow: hidden;
    	position:relative;
    	height:16px;
    	margin: 6px 5% 6px 10%;
    	width: 84%;
	}
/* 	.title::after{
 	    content: "...";
	    position: absolute;
	    right:3px;
	    bottom: 0px;
	    background: #FFF;
	    font-weight: bold;
	    padding: 0 0 0px 7px;
	} */
	.gps{
		left: 0px;
		margin-top:14px;
		width:138px; 	
		margin-left:0px;
	    width: 84%;
	    margin: -5px 5% 6px 10%;
	}
	.gps_live{
		width: 50px;
	    height: 16px;
	    font-size: 9px;
	    border-radius: 6px;
	    line-height: 16px;
	}
	.container{
		/*padding-bottom:20px;*/
	}
	.watch{
		background:url(../../../img/mobile/icon_wx_view.png) no-repeat left center;
		font-size:9px;
	    display: inline-block;
    	background-size: 32%;
   		padding-left: 19px;
   		margin-right: 7px;
  		margin-top: 5px;
	}
	.mask{
		width:100%;
    	height:101px;
	}
	.wating{
		font-size:9px;
	    margin-top: -63px;
  		width:100%;
	}
	.recommand li:nth-child(even) .liveImg,.recommand li:nth-child(even) .title,.recommand li:nth-child(even) .gps{
		/*
		margin: 6px 10% 6px 5%;
		*/
	}
	#cmpt_advanced{
	    padding-bottom:40px;
	}
}
 @media screen and (min-width:414px) and (max-width:730px){
   .liveImg img{
   	height:120px;
   }
   
   .recommand li{
		height:175px;
		width:50%;
		box-sizing: border-box;
		float:left;
		list-style:none;
		border-top:0.5px solid #dddddd;
		position:relative;
		cursor: pointer;
	}
	
	.online {
    	font-size: 10px;
    	left: -15%;
    	top: 7px;
    	width: 56%;
    	height: 16%;
	}

}
@media screen and (max-width:414px){
   .liveImg img{
   	 height:107px;
   }
}	
@media screen and (max-width:375px){
    .liveImg img{
   	 height:97px;
   }
   .recommand li {
    	height: 176px;
    	width: 50%;
    	box-sizing: border-box;
    	float: left;
    	list-style: none;
    	border-top: 0.5px solid #dddddd;
    	position: relative;
    	cursor: pointer;
	}
}
 @media screen and (min-width:320px) and (max-width:374.999px){
   
   .recommand li{
		height:154px;
		width:50%;
		box-sizing: border-box;
		float:left;
		list-style:none;
		border-top:0.5px solid #dddddd;
		position:relative;
		cursor: pointer;
	}

}