@charset "UTF-8";

#table-top-stories{margin:0 0 10px 10px;}
#table-top-stories .header{display:inline-block; margin:20px 0 8px 0;}
#table-top-stories .header .title{float:left; font: bold 18px Ubuntu; line-height:18px; color:#191917; margin-right:10px;}
#table-top-stories .header .date{float:left; font-size:12px; color:#65655D; margin-top:2px; font-weight:600;}
#table-top-stories .grid-pagable{
	overflow:hidden; width:inherit; position:relative; border-radius:4px; height:300px; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.4);
	-webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
}
#table-top-stories .grid-view{
	z-index:5; width:2000px; position:relative; left:0; background-color:white;
	-webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s;
}
#table-top-stories .grid-view.moving{-webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s;}
#table-top-stories .page-nav{top:0; position:absolute; z-index:10; height:300px; width:56px; cursor:pointer;}
#table-top-stories .page-nav .hack-ie{height:300px; width:56px; background-color:white; opacity:0; display:block; filter: alpha(opacity=0);}
#table-top-stories .page-nav.previous{
	left:0; display:none; border-radius:4px 0 0 4px;
	background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,1)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */
}
#table-top-stories .page-nav.next{
	right:0; border-radius:0 4px 4px 0;
	background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 */
}
#table-top-stories .page-nav.previous span{left:-9px}
#table-top-stories .page-nav span{top:50%; margin-top:-32px; position:absolute; left:0; color:white; font-size:50px; width:56px;}

#table-top-stories .placeholder-card{width:300px; height:300px; margin:0 1px 0 0;}
#table-top-stories .placeholder-card .cards.w2h1{width:300px; height:150px; margin-bottom:1px;}
#table-top-stories .placeholder-card .cards.w2h1 .news-image{width:149px; height:150px;}
#table-top-stories .placeholder-card .cards.w2h1 .container-essentials .news{width:150px;}
#table-top-stories .placeholder-card .cards.w2h1 .container-essentials.no-image .news{width:auto;}
#table-top-stories .placeholder-card .cards.w2h1 .container-essentials .share{left:150px;}
#table-top-stories .placeholder-card .cards.w2h1 .container-essentials.no-image .share{left:0;}
#table-top-stories .placeholder-card .cards.w2h1 .news-image img{width:149px; height:150px;}
#table-top-stories .placeholder-card .cards.w1h1{width:149px; height:149px;}
#table-top-stories .placeholder-card .cards.w1h1.last{width:150px; margin-right:0;}
#table-top-stories .cards.economy,
#table-top-stories .cards.news{background-color:#c11c05}
#table-top-stories .cards.sport{background-color:#00958c}
#table-top-stories .cards.entertainment,
#table-top-stories .cards.live-style{background-color:#b040a2}
#table-top-stories .cards.default-white{background-color:#FFFFFF}
#table-top-stories .cards .card-footer .text,
#table-top-stories .cards .hat,
#table-top-stories .cards.w2h1 .text,
#table-top-stories .cards.w2h2 .text,
#table-top-stories .cards.w1h1 .text,
#table-top-stories .cards.w4h2.default-white .card-footer .text{color:#FFFFFF;}
#table-top-stories .cards.w2h1 .sprite-icons-card.arrow-share,
#table-top-stories .cards.w2h2 .sprite-icons-card.arrow-share,
#table-top-stories .cards.w1h1 .sprite-icons-card.arrow-share{background-position: -62px -105px;}
#table-top-stories .cards.default-white .card-footer .text,
#table-top-stories .cards.default-white.w2h1 .text,
#table-top-stories .cards.default-white.w2h2 .text,
#table-top-stories .cards.default-white.w1h1 .text{color:#191917;}
#table-top-stories .cards.default-white .hat{color:#65655d}
#table-top-stories .cards.w4h2.default-white .hat{color:#FFFFFF}
#table-top-stories .cards.default-white.w2h1 .sprite-icons-card.arrow-share,
#table-top-stories .cards.default-white.w2h2 .sprite-icons-card.arrow-share,
#table-top-stories .cards.default-white.w1h1 .sprite-icons-card.arrow-share{background-position: -62px -115px;}
#table-top-stories .cards{box-shadow:none; margin:0 1px 0 0; border-radius:0;}
#table-top-stories .cards img,
#table-top-stories .cards .shaddow,
#table-top-stories .cards .news-image{border-radius:0;}
#table-top-stories .cards.w4h2.flex{width:300px; height:300px;}
#table-top-stories .cards.w4h2 .container-essentials .title .text{color:#FFF;font-size:20px;line-height:22px;height:92px}
#table-top-stories .cards.w4h2 .container-essentials .news-image img{left:0;}

#table-top-stories .ad-topstories {
    border-radius: 0;
    box-shadow: none;
    float: left;
    height: 300px;
    margin: 0 1px 0 0;
    position: relative;
    width: 300px;
    background-color: #fff;
}
#table-top-stories .ad-label {
    background-color: #fff;
    color: #65656a;
    display: block;
    font-family: OpenSans, sans-serif;
    font-size: 12px;
    font-weight: 600;
    height: 50px;
    padding: 20px 20px 20px 0;
    text-align: left;
    width: 300px;
}
#table-top-stories .ad-place {
    background-color: #fff;
    display: block;
    height: 250px;
    width: 300px
}
#table-top-stories .ad-loading {
    background-color: #d7d7d7;
    display: block;
    height: 300px;
    left: 0;
    position: absolute;
    top: 0;
    width: 300px;
}
#table-top-stories .loading-animation {
    background: url('http://s1.trrsf.com/fe/zaz-icons/gif/loader.gif') no-repeat center center;
    display: block;
    height: 32px;
    left: 50%;
    margin: -16px 0 0 -16px;
    position: absolute;
    top: 50%;
    width: 32px;
}

/*Mobile Rules*/
.w320 #table-top-stories{float:left; margin:0 0 10px 10px; width:300px;}
.w320 #table-top-stories .grid-view{-webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s;}
.w320 #table-top-stories .grid-view.moving{-webkit-transition: all 0s; -moz-transition: all 0s; -o-transition: all 0s; transition: all 0s;}
.w320 #table-top-stories .cards{margin-bottom:1px;}
.w320 #table-top-stories .placeholder-card{height:450px; border:0;}
.w320 #table-top-stories .grid-pagable{width:300px; height:450px;}
.w320 #table-top-stories .header .date{clear:both; margin-top:5px;}
.w320 #table-top-stories .footer{float:left; margin:10px 0 0; width:300px; text-align:center;}
.w320 #table-top-stories .footer .pagination{display:inline-block;}
.w320 #table-top-stories .footer .bullet{float:left; margin:0 4px; background-color:#A5A598; border-radius:8px; width:8px; height:8px;}
.w320 #table-top-stories .footer .bullet.active{background-color:#191917;}


/*Hover*/
@media all and (min-width: 700px){
	#table-top-stories .grid-pagable:hover{box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.4);}
	#table-top-stories .page-nav span:hover{opacity: 0.8; -webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;transition:all .2s;}
	#table-top-stories .placeholder-card .cards.w1h1:hover,
	#table-top-stories .placeholder-card .cards.w2h1:hover,
	#table-top-stories .cards.w2h2:hover{opacity:0.8; -webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;transition:all .2s;}
	#table-top-stories .page-nav.previous:hover{
		-webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;transition:all .2s;
		background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0.9) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,1)), color-stop(100%,rgba(0,0,0,0.9))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0.9) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0.9) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0.9) 100%); /* IE10+ */
		background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0.9) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */
	}
	#table-top-stories .page-nav.next:hover{
		-webkit-transition:all .2s;-moz-transition:all .2s;-o-transition:all .2s;transition:all .2s;
		background: -moz-linear-gradient(left,  rgba(0,0,0,0.9) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.9)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(left,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
		background: linear-gradient(to right,  rgba(0,0,0,0.9) 0%,rgba(0,0,0,1) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); /* IE6-9 */
	}
}

/* touched! */

/*NIGHTMODE*/
.nightmode #table-top-stories .ad-label {
	background-color: #33332f;
}

.nightmode #table-top-stories .header .title {
	color: #f1f1f1;
}