/*-------------------------------------------

    Title :  NTDTV
    Usage :  article page
    Edited:  2014-11-13

---------------------------------------------

    1. Columns
    2. Check
    3. Rank List
    4. Pager
    5. Program Recommendation
    6. Email Subscribe

---------------------------------------------*/


/*  1. Columns
---------------------------------------------*/

#main {
	float: left;
	clear: left;
	margin-top: -3px;
	width: 630px;
	}

/*  2. article_navigation
---------------------------------------------*/

#article .article_navigation {
	padding-top: 5px;
	width: 630px;
	}

#article .article_navigation .article_link {
	padding-top: 5px;
	height: 25px;
	cursor: default;
	text-align: left;
	font-size: 1.4em; ;
	background: url(/cms2012/xtr/images/rank/bg_check_form.png) no-repeat;
	}


/*  3. article_title_date
---------------------------------------------*/

#article .article_title_date{ 
	clear:both; 
	float:left; 
	height: 100%; 
	overflow: hidden; 
	margin:19px 0 12px 0; 
	width:620px;
	}
	
#article .article_title_date .title {  
	color:#06225e;
	font-size:24px; 
	font-weight:700; 
	margin:0 0 11px;
	}

#article .article_title_date .subtitle {  
	font-size:14px; 
	margin:0 0 7px 18px;
	}
	
#article .article_title_date .date {  
	color:#7b7c7e; /*Grey Colour*/
	font-size:12px; 
	margin:0 0 0 18px;
	}
	

/*  4. sharebox
---------------------------------------------*/
#article .sharebox { 
	clear: both; 
	margin-bottom:11px; 
	width:620px; 
	height:20px;
	}

#video_overlay { 
	z-index: 1000; 
	height: 60px; 
	text-align: center; 
	position: relative; 
	#left:80px; 
	bottom: 90px; 
	width: 470px; 
	background-color: gray;
	}



#video_overlay_close_box { 
	background:gray; 
	color:#fff;
	font-weight:bold; 
	margin: 5px 0px;
	padding:2px 5px;
	display:inline; 
	position:absolute; 
	right:15px; 
	border-radius:3px; 
	cursor:pointer; 
	z-index: 1001;
	}

#article .flashplayerbox video.jw-video.jw-reset{
/*	-webkit-transform: scale(1.03125,1.03333) !important;  */
}

/*  downloadbox
---------------------------------------------*/
#article .downloadbox { 
	clear: both;
	margin-top: 25px;
	margin-bottom:11px;
	text-align: center;
	font-size: 1.4em;
    }

#article .downloadbox a { 
	padding-right:15px;
	}
	
/*  5. flashplayerbox2
---------------------------------------------*/

#flashplayerbox2_wrapper { clear:both; margin:0 0 11px 0; }


/*  6. article_content
---------------------------------------------*/

#article .article_content { 
	width:620px; 
	clear:both; 
	line-height: 28px; 
	font-size:16px; 
	color:#000000; 
	margin-top: 10px; 
	}
#article .article_content p { 
	margin-top: 0px; 
#	text-indent:32px; 
}

#article .article_content p a {
    color: #03d;
}

#article .article_content table#divpic1 {
	table-layout: auto; 
}
#article .article_content .photo {
	float: right;
    margin-left: 1em;
    margin-right: 1px;
    margin-top: 1px;
    border: 1px solid #CBCBCB;
    padding: 5px;
	}
.photo_explanation {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #696969;
	line-height: 18px;             padding-top: 0px; *padding: 0 5px 5px;
}	
#article .article_content .insidearticleBodyAd { 
	/*width:300px; */ 
	margin:20px 20px 20px 0;
/*	background-color:#b4cdff; *//*light blue*/
	}

#article .article_content .storybox {
	clear: left;
    float: left;
	width: 170px;
    position: relative;
    padding: 0px 20px 0px 0px;
    margin: 0px 0px 5px 0px;
	}

#article .article_content .storybox  span.play {
	top: 52px;
	background: url(/cms2012/xtr/images/common/ico_play.png) no-repeat;
}

#article .article_content .storybox .storyImgWrap {
	width: 170px;
	height: 118px;
	overflow: hidden;
	display: block;
	}
		
#article .article_content .storybox .storyText {
	display: block;
	overflow: hidden;
    font-size: 0.9em;
	line-height: 1.25;
	height: 40px;
	clear: both;
	}	
	
#article .article_content iframe{
	width: 100%;
}
		
/*  6. article_bottom
---------------------------------------------*/


#article .article_bottom { 
	clear:both;
	display:block; 
	margin:20px 0 20px 0; 
	font-size:14px; 
	color:#7b7c7e; /*Grey Colour*/
	}

/*  7. txtDownContent
---------------------------------------------*/

#article .txtDownContent { 
	width:630px; 
	margin:0 0 20px 0; 
	height:100%; 
	overflow:hidden; 
	clear:both;
	}

#article .txtDownContent .left{ 
	float:left;
	margin-right: 5px;
    }

#article .txtDownContent .right{ 
	float:right;
	}
	
#article .txtDownContent .txtDownContentAd { 
	float:left; 
    width:300px; 
	background-color:#b4cdff; /*light blue*/
	}

#article .txtDownContent .box {
	width:300px;
	border: none;
}

/*  7. Program Recommendation
---------------------------------------------*/

#rec {
	padding-bottom: 24px;
	}

#rec h3 {
	margin-bottom: 15px;
	color: #16387c;
	font-size: 1.5em;
	}

#rec .jcarousel-container {
	clear: both;
	margin: 0 auto;
	width: 834px;
	height: 88px;
	background: url(/cms2012/xtr/images/rank/sprite_rec_jcarousel-prev.hover.png) no-repeat 0 -5000px; /* preload image */
	}

#rec .jcarousel-container .jcarousel-clip {
	position: relative;
	width: 834px;
	}

#rec ol li {
	float: left;
	display: inline;
	margin-right: 6px;
	width: 162px;
	}

#rec .jcarousel-container .jcarousel-prev,
#rec .jcarousel-container .jcarousel-next {
	position: absolute;
	top: -3px;
	width: 40px;
	height: 97px;
	cursor: pointer;
	background: url(/cms2012/xtr/images/rank/sprite_rec_jcarousel-prev.png) no-repeat;
	}

#rec .jcarousel-container .jcarousel-prev { left:  -61px; background-position: 0     0 }
#rec .jcarousel-container .jcarousel-next { right: -61px; background-position: 0 -97px }

#rec .jcarousel-container .jcarousel-prev:hover,
#rec .jcarousel-container .jcarousel-next:hover {
	background-image: url(/cms2012/xtr/images/rank/sprite_rec_jcarousel-prev.hover.png);
	}

/*  8. No copyright
---------------------------------------------*/
.nocopyright{margin:5px 0 10px 0;border:2px solid #999999;font-size:13px;padding:5px;height:62px;float:left;}
.nocopyright .nocopyrightlogo{width:50px;float:left;}
.nocopyright .nocopyrightnote{width:550px;float:left;line-height:16px;}

#social {
	width: 580px;
	position: relative;
	border: none;
	}

#social h3 {
    float: left;
	margin-bottom: 15px;
	padding-left: 28px;
	_height: 18px;
	min-height: 18px;
	color: #333;
	font-size: 1.5em;
	line-height: 1.3;
	background: url(/cms2012/xtr/images/today/ico_rank_h1.jpg) no-repeat 0 2px;
}

#social ul {
	position: absolute;
    right: 0px;
	}
	

/*  9. slide show
---------------------------------------------*/

#main .royalSlider {
	height: 502px;
	overflow: hidden;
	}

#main .rsHor {
	position: relative;
	width: 640px;
	}

#main .rsHor .rsOverflow {
	position: relative;
	height: 520px;
	overflow: hidden;
	}

#main .rsHor .rsOverflow .rsContainer {
	position: relative;
	-webkit-tap-highlight-color: transparent;
	}

#main .rsHor .rsOverflow .rsContainer .rsSlide {
	position: absolute;
    top: 0;
	}

#main .gallery-popup {
	position: absolute;
	top: 0;
	right: -340px;
	display: none;
	padding: 10px;
	width: 320px;
	height: 482px;
	background: #333;
	}

#main .gallery-popup p {
	margin-top: 18px;
	display: none;
	color: #fff;
	font-size: 1.5em;
	line-height: 1.467;
	}

#main .gallery-popup .ad {
	position: absolute;
	bottom: 13px;
	left: 19px;
	width: 300px;
	height: 250px;
	text-align: center;
	border: 1px solid #555;
	}


/*  6. Email Subscribe
---------------------------------------------*/

/* #mc_embed_signup_bar{
	paddding: 0px 0px;
	background: url(../images/article/email-cn.png) no-repeat 0px 0px; 
	height: 10px;
	width: 630px;
	background-size: 800px 800px;
} */

#mc_embed_signup_bar.top{
	margin: 0px 0 0 0;
}

#mc_embed_signup_bar.bottom{
	border-bottom:1px solid #ddd; 
	padding-bottom:18px;
	margin: 0 0 10px 0;
}


#mc_embed_signup {
	background: #191c6b;
	color: #fff;
	clear: left;
	font: 14px Helvetica, Arial, sans-serif;
}

#mc_embed_signup form {
	display: block;
	position: relative;
	text-align: left;
	padding: 15px 0 15px 3%;
}
#mc_embed_signup div.email-icon {
	margin: 15px auto 0px;
}

#mc_embed_signup h2 {
	*clear: expression($(this).prepend('<before></before><div></div>'), style.clear = "none", 0);
	font-weight: 700;
	font-size: 2em;
	width: 300px;
	text-align: center;
	color: #f9be3e;
	margin: 10px auto;
}

#mc_embed_signup h2:before, 
#mc_embed_signup h2 before{
	content: "";
	position: absolute;
	top: 28px;
	left: 195px;
	width: 35px;
	height:26px;
	background: url(../images/article/email-cn.png) no-repeat 0px 0px; 
	background-size: 400px 400px;
} 

#mc_embed_signup h3 {
	font-weight: 700;
	padding: 0;
	margin: 15px 0;
	font-size: 1.2em;
	color: #fff;
	text-align: center;
}

#mc_embed_signup h4 {
	*clear: expression($(this).prepend('<before></before><div></div>'), style.clear = "none", 0);
	font-weight: 700;
	padding: 0;
	margin: 15px 0;
	font-size: 0.85em;
	color: #fff;
	text-align: center;
}

#mc_embed_signup h4:before, 
#mc_embed_signup h4 before{
	content: "";
	position: absolute;
	bottom: 31px;
	left: 142px;
	width: 9px;
	height:13px;
	background: url(../images/article/email-cn.png) no-repeat 0px -40px; 
	background-size: 400px 400px;
} 


#mc_embed_signup input {
	border: 1px solid #999;
	-webkit-appearance: none;
	font-family: Helvetica, Arial, sans-serif;
}

#mc_embed_signup input[type="email"]{
	font-family: Helvetica, Arial, sans-serif;
}

#mc_embed_signup input[type=checkbox] {
	-webkit-appearance: checkbox;
}

#mc_embed_signup input[type=radio] {
	-webkit-appearance: radio;
}

#mc_embed_signup input:focus {
	border-color: #333;
}

#mc_embed_signup .button {
	clear: both;
	background-color: #aaa;
	border: 0 none;
	border-radius: 4px;
	color: #FFFFFF;
	cursor: pointer;
	display: inline-block;
	font-size: 1.5em;
	font-weight: bold;
	height: 38px;
	line-height: 38px;
	margin: 0 5px 10px 0;
	padding: 0 22px;
	text-align: center;
	text-decoration: none;
	vertical-align: top;
	white-space: nowrap;
	width: auto;
}

#mc_embed_signup .button:hover {
	background-color: #777;
}

#mc_embed_signup .small-meta {
	font-size: 11px;
}

#mc_embed_signup .nowrap {
	white-space: nowrap;
}

#mc_embed_signup .mc-field-group {
	clear: left;
	position: relative;
	width: 96%;
	padding-bottom: 2%;
	min-height: 15px;
}

#mc_embed_signup .size1of2 {
	clear: none;
	float: left;
	display: inline-block;
	width: 46%;
	margin-right: 4%;
}

* html #mc_embed_signup .size1of2 {
	margin-right: 2%; /* Fix for IE6 double margins. */
}

#mc_embed_signup .mc-field-group label {
	display: block;
	margin-bottom: 3px;
}

#mc_embed_signup .mc-field-group input {
	display: block;
	width: 100%;
	padding: 8px 0;
	text-indent: 2%;
}

#mc_embed_signup .mc-field-group select {
	display: inline-block;
	width: 99%;
	padding: 5px 0;
	margin-bottom: 2px;
}

#mc_embed_signup .datefield, #mc_embed_signup .phonefield-us {
	padding: 5px 0;
}

#mc_embed_signup .datefield input, #mc_embed_signup .phonefield-us input
	{
	display: inline;
	width: 60px;
	margin: 0 2px;
	letter-spacing: 1px;
	text-align: center;
	padding: 5px 0 2px 0;
}

#mc_embed_signup .phonefield-us .phonearea input, #mc_embed_signup .phonefield-us .phonedetail1 input
	{
	width: 40px;
}

#mc_embed_signup .datefield .monthfield input, #mc_embed_signup .datefield .dayfield input
	{
	width: 30px;
}

#mc_embed_signup .datefield label, #mc_embed_signup .phonefield-us label
	{
	display: none;
}

#mc_embed_signup .indicates-required {
	text-align: right;
	font-size: 11px;
	margin-right: 4%;
}

#mc_embed_signup .asterisk {
	color: #c60;
	font-size: 200%;
}

#mc_embed_signup .mc-field-group .asterisk {
	position: absolute;
	top: 25px;
	right: 10px;
}

#mc_embed_signup .clear {
	clear: both;
}

#mc_embed_signup .mc-field-group.input-group strong {
	float:left;
	margin: auto;
	padding: 0px 0;
	disply: inline;
}

#mc_embed_signup .mc-field-group.input-group ul {
	float:left;
	margin: 0px 5px;
	padding: 0px 0;
	list-style: none;
	disply: inline;
}

#mc_embed_signup .mc-field-group.input-group ul li {
	float:left;
	display: block;
	padding: auto;
	margin: 0 5px;
}

#mc_embed_signup .mc-field-group.input-group label {
	display: inline;
	margin: 0 2px;
}

#mc_embed_signup .mc-field-group.input-group input {
	display: inline;
	width: auto;
	border: none;
}

#mc_embed_signup div#mce-responses {
	float: left;
	top: -1.4em;
	padding: 0em 0em 0em 0em;
	overflow: hidden;
	width: 95%;
	margin: 0 0%;
	clear: both;
}

#mc_embed_signup div.response {
	margin: 0em 0;
	padding: 1em .5em .5em 0;
	font-weight: bold;
	float: left;
	top: -1.5em;
	z-index: 1;
	width: 95%;
}

#mc_embed_signup div.mce_inline_error {
	padding: 0em .5em 0em 0em;
	color: #ec9f81;
}

#mc_embed_signup #mce-error-response {
	display: none;
	
}

#mc_embed_signup #mce-error-response a{
	color: #fdff35;
}

#mc_embed_signup #mce-success-response {
	color: #75e8a3;
	display: none;
}

#mc_embed_signup label.error {
	display: block;
	float: none;
	width: auto;
	margin-left: 1.05em;
	text-align: left;
	padding: .5em 0;
}

#mc-embedded-subscribe {
	clear: both;
	width: auto;
	display: block;
	margin: 1em 0 1em 5%;
	text-align: center;
}

#mc_embed_signup #num-subscribers {
	font-size: 1.1em;
}

#mc_embed_signup #num-subscribers span {
	padding: .5em;
	border: 1px solid #ccc;
	margin-right: .5em;
	font-weight: bold;
}

#mc_embed_signup input[type="submit"]{
	margin: 10px 200px 0px 230px;
	color: #191c6b;
	text-align: center;
	background: #f9be3e;
}

#mc_embed_signup input[type="submit"]:hover{
	background: #fad846;
}

#mc_embed_signup input[placeholder]{
	color: #999999;
}

#mc_embed_signup input[placeholder]:focus{
	color: #333333;
}