/*
@Author: ThemeMascot
@URL: http://ThemeMascot.com

This is the file where you can add your custom styles to change the look of the
theme. But don't modify style-main.css file.

*/

/* Your custom css codes start here: */
.thumb-xl{width:100%; height:240px;overflow:hidden} 
.thumb-xl img{width:100%;height:100%} 

.thumb-lg{width:100%; height:210px;overflow:hidden} 
.thumb-lg img{width:100%;height:100%} 

.thumb-l0{width:100%; height:110px;overflow:hidden} 
.thumb-l0 img{width:100%;height:100%} 

.thumb-l1{width:100%; height:160px;overflow:hidden} 
.thumb-l1 img{width:100%;height:100%} 

.thumb-l2{width:100%; height:185px;overflow:hidden} 
.thumb-l2 img{width:100%;height:100%} 

.thumb-l3{width:100%; height:200px;overflow:hidden} 
.thumb-l3 img{width:100%;height:100%} 

.thumb-m0{width:100%; height:80px;overflow:hidden} 
.thumb-m0 img{width:100%;height:100%} 

.thumb-m1{width:30%; height:120px;overflow:hidden} 
.thumb-m1 img{width:100%;height:100%} 

.thumb-m2{width:120px; height:100px;overflow:hidden} 
.thumb-m2 img{width:100%;height:100%} 

.thumb-s{width:25%; height:60px;overflow:hidden} 
.thumb-s img{width:100%;height:100%} 

@media only screen and (max-width: 767px) {
	.thumb-m1 {width:40%} 
	.thumb-s{width:30%} 
}

.hand-cursor{cursor: pointer;}

#carousel-generic {
    margin: 20px auto;
    width: 100%;
}

#carousel-custom {
    margin: 20px auto;
    width: 100%;
}

#carousel-custom .carousel-inner .item{
    text-align: center;
}

#carousel-custom .carousel-inner .item img{
    display: inline-block;
}

#carousel-custom .carousel-indicators {
    margin: 10px 0 0;
    overflow: auto;
    position: static;
    text-align: left;
    white-space: nowrap;
    width: 100%;
}
#carousel-custom .carousel-indicators li {
    background-color: transparent;
    -webkit-border-radius: 0;
    border-radius: 0;
    display: inline-block;
    height: auto;
    margin: 0 !important;
    width: auto;
}
#carousel-custom .carousel-indicators li img {
	width: 100px;
	height: 63px;
    display: block;
    opacity: 0.5;
}
#carousel-custom .carousel-indicators li.active img {
    opacity: 1;
}
#carousel-custom .carousel-indicators li:hover img {
    opacity: 0.75;
}
#carousel-custom .carousel-outer {
    position: relative;
}

.video-image .icon-holder, 
#video-carousel .icon-holder {
  position: absolute;
  left: 50%;
  bottom:50%;
  width: 50px;
  height: 50px;
  margin-left:-25px;
  margin-bottom:-25px;
  line-height:60px;
  background: #000;
  opacity: 0.5;
  text-align:center;
  display:inline-block;
  color: #fff;
  border-radius: 50%;
}

.video-image .icon-holder:hover, 
#video-carousel .icon-holder:hover{
  opacity: 1;
  cursor:pointer;
}

.title-line20 {
  height: 20px;
  text-overflow:ellipsis;
  overflow:hidden;
}

.title-line25 {
  height: 25px;
  text-overflow:ellipsis;
  overflow:hidden;
}

.title-line30 {
  height: 30px;
  text-overflow:ellipsis;
  overflow:hidden;
}

.description-2line {
  overflow:hidden;
  text-overflow:ellipsis;
  height:45px;
  font-size:13px;
  color:#999;
}

.description-3line {
  overflow:hidden;
  text-overflow:ellipsis;
  height:70px;
  font-size:14px;
  color:#999;
}

.description-4line {
  overflow:hidden;
  text-overflow:ellipsis;
  height:98px;
  font-size:14px;
  color:#999;
}

.article_content {
  font-size: 15px;
  min-height: 500px;
}

.article_content img{
  max-width: 100%;
  display: inline-block;
  margin: 0 auto;
}


#main-menu-user {
  cursor: pointer;
  display: block;
  float: right;
  margin: 0;
  padding: 0;
  z-index: 11;
}

.header-nav.navbar-transparent.animated-active #main-menu-user,
.header-nav.navbar-transparent.animated-active #main-menu-user a {
  color: #fff;
}

#main-menu-user .user-offline {
  display:none;
  width:60px;
  height:100%;
  padding:25px 2px 32px 2px;
  text-align:center;
}

#main-menu-user .user-offline:hover {
  color: #fff;
  background: #3DB4D9;
}

#main-menu-user .user-offline:hover a{
  color: #fff;
}

#main-menu-user .user-login {
  display:none;
  width:60px;
  height:100%;
  padding:15px 10px 20px 10px;
  text-align:center;
}

#main-menu-user .user-login:hover {
  background: #3DB4D9;
}

.header-nav.navbar-transparent.animated-active #main-menu-user .user-login {
  padding-bottom:30px;
}

#main-menu-user .user-login img {
  width:40px;
  height:40px;
}

@media only screen and (max-width: 767px) {
	#main-menu-user .user-offline {
	  width:50px;
	  padding:18px 10px 27px 10px;
	}

	#main-menu-user .user-login {
	  width:50px;
	  padding:15px 10px 15px 10px;
	}
	#main-menu-user .user-login img {
	  width:30px;
	  height:30px;
	}

	.header-nav.navbar-transparent.animated-active #main-menu-user .user-login {
	  padding-bottom:15px;
	}
}
/*comments*/
.comment{margin-bottom: 10px;}

.comment .avatar{width:40px; height:40px;}
.comment-body{overflow: hidden;}
.comment-content{
	padding-bottom: 2px;
	word-break: break-all;
	word-wrap: break-word;
}

.comment>.pull-left {
	margin-right: 10px;
}

.comment .time{
	color:#ccc;
	font-size: 12px;
	line-height: 14px;
}

.comment-body .comment{
	margin-bottom: 5px;
	background-color: #f8f8f8;
}

.comment-postbox-wraper{}
.comment-postbox{width: 100%;padding: 10px;}

.comment-reply-box{position: relative;}
.comment-reply-box .textbox{width: 100%}

.mfp-iframe-scaler iframe {height:561px; overflow-y:hidden;}

.go-top{position:fixed;bottom:40px;right:20px;width:50px;z-index:9999}
.go-top a.language,
.go-top a.weixin,
.go-top a.weibo,
.go-top a.gotop{display:block;box-sizing:border-box;width:50px;height:50px;margin-bottom:5px;padding:12px; text-align:center; background:rgba(0,0,0,0.15); color:#fff;}
.go-top a:last-child{margin-bottom:0}
.go-top a > i{font-size:24px}
.go-top .language:hover{background:#3DB4D9;}
.go-top .gotop:hover{background:rgba(0,0,0,0.5);}
.go-top .weixin:hover{background:#2BAD13;}
.go-top .weibo:hover{background:#E6162D;}
.go-top .weixin-pop {position:absolute;right:50px;top:-95px;width:200px;border:1px solid #ccc;background:#fff}
.go-top .weixin-pop .weixin-qrcode-box{position:relative;padding:0}
.go-top .language-pop {position:absolute;right:50px;top:-45px;width:120px;border:1px solid #ccc;background:#fff}
.go-top .language-pop .language-list-box{position:relative;padding:10px}
.go-top .language-pop .language-list-box li a{display: inline-block; padding:0; -webkit-transition: padding 0.2s linear; -o-transition: padding 0.2s linear; transition: padding 0.2s linear;}
.go-top .language-pop .language-list-box li:hover > a {color: #3DB4D9; padding-left: 5px;}
.go-top .hide{display:none !important}

@media only screen and (max-width: 767px) {
  .go-top{
	  display:none !important;
  }
}

.play-inline{
	display:table;
	table-layout:fixed;
	width:100%;
	margin-top:5px;
}

.play-inline>.play-wrapper{
	display:table-cell;
	vertical-align:top;
	padding:0 3px;
}

.play-inline>.play-wrapper + .play-wrapper{
	margin-top:0;
}
.play-wrapper + .play-wrapper{
	margin-top:10px;
}

.play-wrapper{
	width:100%;
	min-height:60px;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
}

.play{
	background:#000000;
	padding:20px 10px 10px 10px;
	text-align:center;
	overflow:hidden;
	position:relative;
	display:block;
	min-height:60px;
	opacity:0.5;
	filter:alpha(opacity=50);
}


.play h4{
	color:#ffffff;
	font-size:18px !important;;
	text-transform:uppercase;
	margin:0;
	white-space: nowrap;
	transition:color 0.2s;
	-webkit-transition:color 0.2s;
	-moz-transition:color 0.2s;
	opacity:1;
	filter:alpha(opacity=1);
	z-index:10;
}

.play .icons{
	position:absolute;
	font-size:32px;
	width:50px;
	color:#c6d0dc;
	left:3px;
	top:50%;
	margin-top:-15px;
	z-index:500;
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	transform:scale(1);
	-webkit-transition:color 0.2s, opacity 0.7s, -webkit-transform 0.6s;
	-moz-transition:color 0.2s, opacity 0.7s, -moz-transform 0.6s;
	transition:color 0.2s, opacity 0.7s, transform 0.6s;
}

.play:hover{
	text-decoration:none;
	opacity:0;
	filter:alpha(opacity=0);
}

.play:hover h4{
	opacity:0;
	filter:alpha(opacity=0);
}

.play:hover icons.icons-fadeout{
	color:#9ccbf8;
	-webkit-transform:scale(4);
	-moz-transform:scale(4);
	transform:scale(4);
	opacity:0;
	-moz-opacity:0;
	-khtml-opacity:0;
}