

/* Container */



#containerholderwrapper	{

	position: relative;

	float: left;

	width: 100%;

	margin-top: 51px;

	overflow: hidden;

}



#containerholder	{

	position: relative;

	float: left;

	width: 100%;

}



#container	{

	position: relative;

	float: left;

	width: 100%;

}



/* Trending list categories and channels */



.trendinglistcategoriesandchannels	{

	height: fit-content;

}

.indexleftbarpositioningforleftscroll{

	display: block;

	width: 201px;

	height: 100%;

	position:relative;

}



#adsandfeatured	{

	position: relative;

	float: left;

	width: 300px;

}

/* contents Feed Holder */

#indexContentsFeedHolder{

	position: relative;

	float: left;

	width: 100%;

}

#indexContentsFeedHolderouter	{

	position: relative;

	float: right;

	width: calc(100% - 540px);

	margin-right: 300px;

	min-height: 1600px;

	/*background-color: #F9F9F9;*/

}



.listslatestlistsview {

	display: block;

	float: left;

	width: 32px;

	height: 32px;

	margin-left: 2px;

	background-image: url(../assets/nav/icons.png);

	background-size: 96px 288px;

	background-position: 0px -96px;

	background-repeat: no-repeat;

}



.listslatestlistsview:hover {

	display: block;

	float: left;

	width: 32px;

	height: 32px;

	margin-left: 2px;

	background-color: #ffffff;

	background-image: url(../assets/nav/icons.png);

	background-size: 96px 288px;

	background-position: -32px -96px;

	background-repeat: no-repeat;

}



.listslatestlistsview:active {

	background-color: #DDDDDD;

}

.listspopularlistsview {

	display: block;

	float: left;

	width: 32px;

	height: 32px;

	margin-left: 2px;

	background-image: url(../assets/nav/icons.png);

	background-size: 96px 288px;

	background-position: 0px -64px;

	background-repeat: no-repeat;

}



.listspopularlistsview:hover {

	display: block;

	background-color: #ffffff;

	float: left;

	width: 32px;

	height: 32px;

	margin-left: 2px;

	background-image: url(../assets/nav/icons.png);

	background-size: 96px 288px;

	background-position: -32px -64px;

	background-repeat: no-repeat;

}



.listspopularlistsview:active {

	background-color: #DDDDDD;

}



#latestpopulartoggle{

	float: right;

	z-index:1;

}



.listsviewactivity	{

	width: 36px;

	float: right;

	display: block;

	position: relative;

	text-align: center;

	text-decoration: none;

	font-family: 'Roboto', sans-serif;

	font-weight: bold;

	line-height: 14px;

	font-size: 14px;

	white-space: nowrap;

	margin-top: 2px;

}



.listsgridtitletextthreeline	{

	position: relative;

	font-family: 'Roboto', sans-serif;

	font-weight: bold;

	font-size: 16px;

	line-height: 16px;

	color: #666666;

	min-height: 20px;

	width: 158px;

	max-width: 160px;

	white-space: pre-wrap;

	height: 48px;

	text-align: center;

	overflow: hidden;

	display: -webkit-box;

	-webkit-line-clamp: 3;

	-webkit-box-orient: vertical;

}



.slot4{

	width: 100%;

	text-align: center;

}

.slot5{

	width: 100%;

	text-align: center;

}

.slot6{

	width: 100%;

	text-align: center;

}

.slot7{

	width: 100%;

	text-align: center;

}



.gridviewimage{

	opacity: 0;

}



#indexrightsidepanelholder{

	position: absolute;

	top: 10px;

	right: 0;

	width: 279px;

	height: auto;

	padding: 0 10px 10px 10px;

	border-left: 1px solid #dddddd;

	overflow: hidden;

	z-index: 1;

}

.indexrightsidepanelholderFixed{

	position: fixed!important;

	top: unset!important;

	bottom: 0px!important;

	right: 0px!important;

}





/*Indexslider*/



.indexsliderholder{

	position: relative;

	float: left;

	width: 100%;

	height: 400px;

	overflow: hidden;

}

.indexsliderloadingbg{

	position: absolute;

	top: calc(50% - 20px);

	left: calc(50% - 20px);

	width: 40px;

	height: 40px;

	background-image: url("../assets/spritesv2/gif/loadermini.gif");

	background-position:  0 0;



}

.indexslider{

	position: absolute;

	left: 100%;

	top: 0;

	width: 100%;

	height: calc(100% - 30px);

	background-color: #FFF;

	overflow: hidden;

	/* opacity: 0; */

	-webkit-transition: background-color .5s;

	-moz-transition: background-color .5s;

	-ms-transition: background-color .5s;

	-o-transition: background-color .5s;

	transition: background-color .5s;

	visibility: hidden;

	/* opacity: 0; */

	display: grid;

	grid-template-columns: repeat(4, 1fr);

}



.indexsliderActive{

	left: 0;

}



.indexsliderimage{

	width: 100%;

	height: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

	grid-column-start: 1;

	grid-column-end: 4;

	overflow: hidden;



}

.indexsliderimage img{



	-webkit-transform: translateX(1.2%) scale(1.05);

	-moz-transform: translateX(1.2%) scale(1.05);

	-ms-transform: translateX(1.2%) scale(1.05);

	-o-transform: translateY(1.2%) scale(1.05);

	transform: translateX(1.2%) scale(1.05);



}

.indexsliderimagecaption{

	position: absolute;

	left: 0;

	bottom: 0;

	width: 100%;

	overflow: hidden;

	-webkit-transition: background-color .3s;

	-moz-transition: background-color .3s;

	-ms-transition: background-color .3s;

	-o-transition: background-color .3s;

	transition: background-color .3s;

}

.indexsliderimagecaptiontext{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	color: #ffffff;

	text-align: left;

	font-size: 12px;

	line-height: 100%;

	/* border-right: 2px solid transparent; */

	padding: 8px 10px 8px 10px;

	white-space: nowrap;

	overflow: hidden;

	opacity: 0;



}

.indexslidertitle{

	position: relative;

	width: 100%;

	width: calc(100% - 20px);

	height: 100%;

	background-color: #FFFFFF;

	display: flex;

	align-items: center;

	justify-content: center;

	flex-direction: column;

	gap: 10px;

	z-index: 1;

}

.indexslidertitle:before{

	content: "";

	position: absolute;

	width: 0;

	height: 0;

	bottom: 0;

	left: -98px;

	border-bottom: 570px solid #ffffff;

	border-left: 100px solid transparent;

}



.indexslidertitleicon{

	position: relative;

	float: left;

	z-index: 1;

	/*transform: translateX(-25px);*/



}

.indexslidertitleicon img{

	width: 100%;

	height: auto;

	box-sizing: border-box;



}

.indexslidertitletext{

	z-index: 1;

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-size: 14px;

	color: #666;

	text-align: center;

	/*transform: translateX(-25px);*/

}







.indexslidercontrolprev{

	position: absolute;

	width: 40px;

	height: 40px;

	top: calc(50% - 32px);

	left: 5px;

	background-image: url(../assets/spritesv2/index.png);

	background-size: 320px 800px;

	background-position: -80px -40px;

	background-color: #FFFFFF;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

	-webkit-box-shadow: 0 0 10px -5px black;

	-moz-box-shadow: 0 0 10px -5px black;

	box-shadow: 0 0 10px -5px black;

	cursor: pointer;

	-webkit-transition: opacity 1s;

	-moz-transition: opacity 1s;

	-ms-transition: opacity 1s;

	-o-transition: opacity 1s;

	transition: opacity 1s;

	-webkit-transform: scale(.8);

	-moz-transform: scale(.8);

	-ms-transform: scale(.8);

	-o-transform: scale(.8);

	transform: scale(.8);

	z-index: 2;

	opacity: 0;

}

.indexslidercontrolnext{

	display: block;

	position: absolute;

	width: 40px;

	height: 40px;

	top: calc(50% - 32px);

	right: 5px;

	background-image: url(../assets/spritesv2/index.png);

	background-size: 320px 800px;

	background-position: -80px -80px;

	background-color: #FFFFFF;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

	-webkit-box-shadow: 0 0 10px -5px black;

	-moz-box-shadow: 0 0 10px -5px black;

	box-shadow: 0 0 10px -5px black;

	cursor: pointer;

	-webkit-transition: opacity 1s;

	-moz-transition: opacity 1s;

	-ms-transition: opacity 1s;

	-o-transition: opacity 1s;

	transition: opacity 1s;

	-webkit-transform: scale(.8);

	-moz-transform: scale(.8);

	-ms-transform: scale(.8);

	-o-transform: scale(.8);

	transform: scale(.8);

	z-index: 2;

	opacity: 0;

}

.indexsliderholder:hover > .indexslidercontrolprev{

	opacity: 1;

}

.indexsliderholder:hover > .indexslidercontrolnext{

	opacity: 1;

}

.indexsliderbottombar{

	position: absolute;

	width: 100%;

	height: 30px;

	left: 0;

	bottom: 0;

	display: flex;

	justify-content: center;

	align-items: center;

	background-color: #eeeeee;

}

.indexsliderautoplaybutton{

	position: absolute;

	top: 0;

	left: 10px;

	width: 30px;

	height: 30px;

	background-image: url(../assets/spritesv2/index.png);

	background-size: 320px 800px;

	background-position: -80px -240px;

	cursor: pointer;

}

.sliderplayoff{

	background-position: -80px -200px;

}



.indexsliderdotholder{

	position: relative;

	float: left;

	display: flex;

	flex-direction: row;

	gap: 10px;

}

.indexsliderdot{

	position: relative;

	float: left;

	width: 10px;

	height: 10px;

	background-color: #666666;

	border-radius: 50%;

	cursor: pointer;

}

.indexsliderdotactive{

	background-color: #A24242;

	pointer-events: none;

}

.indexslidercontentsuggestion{

	padding: 0 20px;

	height: 100%;

	grid-column-start: 1;

	grid-column-end: -1;

	display: grid;

	grid-template-columns: repeat(3, 1fr);

	gap: 20px;

	align-items: center;

	justify-content: center;

	justify-items: center;

	align-content: center;

	background: rgb(0, 0, 0);

	background: linear-gradient(0deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.1) 100%);

}

.indexslidertoptitle{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-size: 16px;

	font-weight: bold;

	color: #FFF;

	text-align: center;

	grid-column-start: 1;

	grid-column-end: -1;

	text-shadow: 0 1px 2px rgb(0 0 0 / 50%);

}

.indexslidercontentbox{

	position: relative;

	float: left;

	max-width: 120px;

}

.indexslidercontentboxurl{

	position: relative;

	float: left;

	width: 100%;

	display: flex;

	flex-direction: column;

	gap: 10px;

}

.indexslidercontentimage{

	position: relative;

	float: left;

	width: 100%;

	aspect-ratio: 1;

	overflow: hidden;

	border-radius: 10px;

	box-shadow: rgb(255 255 255) 0px 0px 0px 2px;

}

.indexslidercontentimage img{

	width: 100%;

	height: 100%;

}

.indexslidercontentname{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-size: 14px;

	font-weight: bold;

	color: #FFF;

	text-align: center;

	display: -webkit-box;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

	-webkit-font-smoothing: antialiased;

	overflow: hidden;

	text-overflow: ellipsis;

	text-shadow: 0 1px 2px rgb(0 0 0 / 50%);

}



.slideranimation{

	opacity: 1;

}

.slideranimation .indexsliderimagecaption{

	z-index: 1;

	background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 75%);

}

.slideranimation .indexsliderimage img{

	-o-animation: imageTransform 5s linear;

	-webkit-animation: imageTransform 5s linear;

	animation: imageTransform 5s linear;

}

.slideranimation .indexsliderimagecaptiontext{

	opacity: 1;

	text-shadow: 0 1px 2px rgb(0 0 0 / 50%);

	-webkit-animation: typing 3.5s steps(40, end);

	-o-animation: typing 3.5s steps(40, end);

	animation: typing 3.5s steps(40, end);

}

.slideranimation .indexslidertitleicon img{

	-webkit-animation: slideDown 2s cubic-bezier(0.17,.88,.32,1.27);

	-o-animation: slideDown 2s cubic-bezier(0.17,.88,.32,1.27);

	animation: slideDown 2s cubic-bezier(0.17,.88,.32,1.27);

}

.slideranimation .indexslidertitletext{

	-webkit-animation: slideUp 2s cubic-bezier(0.17,.88,.32,1.27);

	-o-animation: slideUp 2s cubic-bezier(0.17,.88,.32,1.27);

	animation: slideUp 2s cubic-bezier(0.17,.88,.32,1.27);

}



@keyframes imageTransform {

	from {

		-webkit-transform: translateX(-1.2%) scale(1.05);

		-moz-transform: translateX(-1.2%) scale(1.05);

		-ms-transform: translateX(-1.2%) scale(1.05);

		-o-transform: translateX(-1.2%) scale(1.05);

		transform: translateX(-1.2%) scale(1.05);

	}

	to {

		-webkit-transform: translateX(1.2%) scale(1.05);

		-moz-transform: translateX(1.2%) scale(1.05);

		-ms-transform: translateX(1.2%) scale(1.05);

		-o-transform: translateY(1.2%) scale(1.05);

		transform: translateX(1.2%) scale(1.05);

	}

}



@keyframes slideDown {

	from {

		opacity: 0;

		-webkit-transform: translateY(-40px);

	}

	to {

		opacity: 1;

		-webkit-transform: translateY(0px);

	}

}



@keyframes slideUp {

	from {

		opacity: 0;

		-webkit-transform: translateY(20px);

	}

	to {

		opacity: 1;

		-webkit-transform: translateY(0px);

	}

}



@keyframes typing {

	from {

		width: 0;

	}

	to {

		width: 100%;

	}

}



/*Index feed*/



.indexlistsfeedholderinner{

	position: relative;

	float: left;

	width: 100%;

}

.indexlistsfeedtitlebar{

	position: relative;

	float: left;

	width: calc(100% - 20px);

	padding: 0 10px;

	height: 49px;

	border-top: 1px solid #dddddd;

	display: flex;

	align-items: center;

	gap: 10px;

}

.indexlistsfeedholderinner:nth-child(1) .indexlistsfeedtitlebar{

	height: 50px;

	border-top: none;

}



.featured{

	position: absolute;

	height: 16px;

	z-index: 1111;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #ef9e43;

	padding-left: 3px;

	float: left;

	padding-right: 3px;

	line-height: 16px;

}



.newindexhomeseemorebuttonholder{

	position: relative;

	float: left;

	width: calc(100% - 20px);

	height: 50px;

	margin: 0 10px;

	margin-bottom: 10px;

	background-color: #FFFFFF;

	border-radius: 10px;

	display: flex;

	align-items: center;

	justify-content: center;

	font-family: 'Roboto', sans-serif;

	font-size: 14px;

	color: #666666;

	font-weight: bold;

	cursor: pointer;

}

.newindexhomeseemorebuttonholder:hover{

	background-color: #F6F6F6;

}



.newlistviewlistdetails_likeicon{

	position: relative;

	float: left;

	width: 12px;

	height: 12px;

	background-image: url("../assets/sprites/newlikedislikeviewicons.png");

	background-size: 12px 36px;

	background-position: 0px 0px;

}

.newlistviewlistdetails_dislikeicon{

	position: relative;

	float: left;

	width: 12px;

	height: 12px;

	background-image: url("../assets/sprites/newlikedislikeviewicons.png");

	background-size: 12px 36px;

	background-position: 0px -12px;

}

.newlistviewlistdetails_viewicon{

	position: relative;

	float: left;

	width: 12px;

	height: 12px;

	background-image: url("../assets/sprites/newlikedislikeviewicons.png");

	background-size: 12px 36px;

	background-position: 0px -24px;

}



.newindexloadingmoreholder{

	position: relative;

	float: left;

	width: 100%;

	padding-bottom: 30px;

}

.newindexloadingmoreholderinner{

	position: relative;

	width: 148px;

	height: 40px;

	background-color: #ffffff;

	margin: 0px auto;

	padding: 0px 10px;

	text-align: center;

	-webkit-border-radius: 3px;

	-moz-border-radius: 3px;

	border-radius: 3px;

}

.newindexloadingmoregif{

	position: relative;

	float: left;

	width: 16px;

	height: 16px;

	margin: 12px;

	background-image: url("../assets/nav/rmlloadingdark.gif");

	background-position: 0px 0px;

}

.newindexloadingmoretext{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-size: 14px;

	color: #666666;

	padding: 13px 0px 13px 5px;

}



.googleSlot4{

	position: relative;

	float: left;

	width: calc(100% - 30px);

	margin: 10px 15px 0px 15px;

	text-align: center;

}

.googleSlot4 img{

	display: inline-block;

	width: 100%;

	max-width: 728px;

	height: auto;

}



.indexrightsidepanelholderbackground{

	display: none;

	position: fixed;

	top: 50px;

	left: 0px;

	width: 100%;

	height: calc(100% - 50px);

	background-color: rgba(17, 17, 17, 0.7);

	z-index: 1;

}

.indexrightsidepanel{

	position: relative;

	float: left;

	width: 100%;

	overflow: hidden;

	display: flex;

	flex-direction: column;

	gap: 10px;

}

.indexrightsidepaneltitlebar{

	position: relative;

	float: left;

	width: 100%;

	height: 30px;

        margin-top:10px;

	display: flex;

	align-items: center;

}

.indexrightsidepaneltitlebartext{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-weight: bold;

	font-size: 18px;

	color: #444444;

}

.indexrightsidepanelpressdbadge {
    position: relative;
    clear:both;
    float: left;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
}

.indexrightsidepanellistbox{

	position: relative;

	float: left;

	width: 100%;

	height: 276px;

}

.indexrightsidepanellistboxgrid{

	position: absolute;

	top: 0px;

	left: 120%;

	width: 100%;

	background-color: #FFFFFF;

	-webkit-border-radius: 10px;

	-moz-border-radius: 10px;

	border-radius: 10px;

	overflow: hidden;

	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

	-webkit-transition: box-shadow .3s;

	-moz-transition: box-shadow .3s;

	-ms-transition: box-shadow .3s;

	-o-transition: box-shadow .3s;

	transition: box-shadow .3s;

}

.indexrightsidepanellistboxgrid:nth-child(3){

	left: 0;

}

.indexrightsidepanellistboxgrid:hover{

	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;

}

.indexrightsidepanellistboxgridinner{

	position: relative;

	float: left;

	width: 280px;

}

.indexrightsidepanellistthumbnailholder{

	position: relative;

	float: left;

	width: 280px;

	height: 186px;

	overflow: hidden;

	background:url(

	data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQYV2P4/v37fwAJswPlybc2yQAAAABJRU5ErkJggg==

	) repeat;

}

.indexrightsidepanellistthumbnail{

	position: absolute;

	top: 0px;

	left: 0px;

	width: 100%;

	height: 100%;

	opacity: 0;

	-webkit-transition: opacity .3s;

	-moz-transition: opacity .3s;

	-ms-transition: opacity .3s;

	-o-transition: opacity .35s;

	transition: opacity .3s;

}

.indexrightsidepanellistdetails{

	position: absolute;

	width: 100%;

	height: 100%;

	left: 0px;

	top: 0px;

	background: -moz-linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 100%);

	background: -webkit-linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 100%);

	background: linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 100%);

}

.indexrightsidepanellistdetails:before{

	position: absolute;

	top: 8px;

	right: 8px;

	transform: skew(-8deg);

	background: rgba(0, 0, 0, .6);

	border-radius: 5px;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #FFFFFF;

	padding: 5px 8px;

}

.indexrightsidepanellistcontenttypeholder{

	position: absolute;

	top: 5px;

	right: 5px;

	transform: skew(-8deg);

	background: rgba(0, 0, 0, .6);

	border-radius: 5px;

}

.indexrightsidepanellistcontenttype{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #FFFFFF;

	padding: 5px 8px;

}

.indexrightsidepanellistdetailsbottom{

	position: absolute;

	width: 100%;

	height: 85px;

	left: 0;

	bottom: 0;

}

.indexrightsidepanellistdetails_totalitem{

	position: relative;

	float: left;

	width: 100%;

	padding-top: 10px;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	text-align: center;

	color: #FFFFFF;

}

.indexrightsidepanellistdetails_rankedby{

	position: relative;

	float: left;

	width: 100%;

	padding-top: 10px;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	text-align: center;

	color: #FFFFFF;

}

.indexrightsidepanellistdetails_likedislikeview{

	position: relative;

	float: left;

	width: calc(100% - 17px);

	margin-left: 17px;

	padding-top: 10px;

	text-align: center;

}

.indexrightsidepanellistdetails_likeholder{

	display: inline-block;

	position: relative;

}

.indexrightsidepanellistdetails_dislikeholder{

	display: inline-block;

	position: relative;

	margin: 0px 30px;

}

.indexrightsidepanellistdetails_viewholder{

	display: inline-block;

	position: relative;

}



.indexrightsidepanellistdetails_like_number,.indexrightsidepanellistdetails_dislike_number, .indexrightsidepanellistdetails_view_number{

	position: relative;

	float: left;

	margin-left: 5px;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #FFFFFF;

}

.indexrightsidepanellistdetails_like_number::before{

	content: '';

	position: absolute;

	top: -4px;

	left: -25px;

	width: 20px;

	height: 20px;

	background-image: url(../assets/spritesv2/index.png); background-size: 320px 800px;



	background-position: 0px 0px;

}

.indexrightsidepanellistdetails_dislike_number::before{

	content: '';

	position: absolute;

	top: -2px;

	left: -25px;

	width: 20px;

	height: 20px;

	background-image: url(../assets/spritesv2/index.png); background-size: 320px 800px;



	background-position: 0 -20px;

}

.indexrightsidepanellistdetails_view_number::before{

	content: '';

	position: absolute;

	top: -3px;

	left: -25px;

	width: 20px;

	height: 20px;

	background-image: url(../assets/spritesv2/index.png); background-size: 320px 800px;



	background-position: 0 -40px;

}





.indexrightsidepanellisttitleandchannelholder_grid{

	position: relative;

	float: left;

	width: calc(100% - 20px);

	height: 74px;

	/*padding: 5px 10px 10px 10px;*/

	padding: 10px;

}

.indexrightsidepanellisttitleandchannelholderinner_grid{



	position: relative;

	float: left;

	width: 100%;

	height: 34px;

	display: flex;

	align-items: center;

	justify-content: flex-start;



	/*position: relative;*/

	/*float: left;*/

	/*width: 100%;*/

	/*height: 48px;*/

	/*display: -webkit-box;*/

	/*display: -ms-flexbox;*/

	/*-ms-flex-pack: center;*/

	/*-ms-flex-align: center;*/

	/*display: -moz-box;*/

	/*-moz-box-pack: center;*/

	/*-moz-box-align: center;*/

	/*display: -webkit-box;*/

	/*-webkit-box-align: center;*/

	/*display: box;*/

	/*box-pack: center;*/

	/*box-align: center;*/

}

.indexrightsidepanellisttitle_grid{



	display: -webkit-box;

	position: relative;

	float: left;

	max-width: 100%;

	font-family: 'Roboto', sans-serif;

	/*font-weight: bold;*/

	font-size: 16px;

	line-height: 120%;

	color: #666666;

	-webkit-line-clamp: 2;

	-webkit-box-orient: vertical;

	-webkit-font-smoothing: antialiased;

	overflow: hidden;

	text-overflow: ellipsis;

	cursor: pointer;



	/*display: -webkit-box;*/

	/*position: relative;*/

	/*float: left;*/

	/*max-width: 100%;*/

	/*font-family: 'Roboto', sans-serif;*/

	/*font-size: 16px;*/

	/*line-height: 150%;*/

	/*color: #666666;*/

	/*-webkit-line-clamp: 2;*/

	/*-webkit-box-orient: vertical;*/

	/*-webkit-font-smoothing: antialiased;*/

	/*overflow: hidden;*/

	/*text-overflow: ellipsis;*/

	/*cursor: pointer;*/

}

.indexrightsidepanellistchannelholder_grid{

	position: absolute;

	left: 10px;

	bottom: 10px;

	clear: left;

	width: calc(100% - 20px);

}

.indexrightsidepanellistchannelholder_grid a{

	position: relative;

	float: left;

	width: 100%;

	display: flex;

	align-items: center;

	gap: 10px;

}

.indexrightsidepanellistchannelimage_grid{

	position: relative;

	float: left;

	width: 30px;

	height: 30px;

	border-radius: 100%;

	overflow: hidden;

}

.indexrightsidepanellistchannelimage_grid img{

	width: 30px;

	height: 30px;

}



#contentcreatorname, .indexrightsidepanellistchannelname_grid{

	position: relative;

	float: left;

	flex: none;

	max-width: calc(100% - 80px);

	font-family: 'Roboto', sans-serif;

	font-size: 13px;

	font-weight: bold;

	color: #666666;

	overflow: hidden;

	text-overflow: ellipsis;



}

#contentcreatorname:hover{

	text-decoration: underline;

}

.indexrightsidepanellistboxgridslidefeaturednext, .indexrightsidepanellistboxgridslidepopularnext, .indexrightsidepanellistboxgridslidelatestnext{

	display: block;

	position: absolute;

	width: 40px;

	height: 40px;

	top: 73px;

	right: 5px;

	background-image: url("../assets/spritesv2/index.png"); background-size: 320px 800px;

	background-position: -80px -80px;

	background-color: #FFFFFF;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

	-webkit-box-shadow: 0 0 10px -5px black;

	-moz-box-shadow: 0 0 10px -5px black;

	box-shadow: 0 0 10px -5px black;

	cursor: pointer;

	z-index: 1;

	opacity: 0;

	transition: opacity 0.3s ease-in-out;



}

.indexrightsidepanellistboxgridslidefeaturedpriv, .indexrightsidepanellistboxgridslidepopularpriv, .indexrightsidepanellistboxgridslidelatestpriv{

	display: none;

	position: absolute;

	width: 40px;

	height: 40px;

	top: 73px;

	left: 5px;

	background-image: url("../assets/spritesv2/index.png"); background-size: 320px 800px;

	background-position: -80px -40px;

	background-color: #FFFFFF;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

	-webkit-box-shadow: 0 0 10px -5px black;

	-moz-box-shadow: 0 0 10px -5px black;

	box-shadow: 0 0 10px -5px black;

	cursor: pointer;

	z-index: 1;

	opacity: 0;

	transition: opacity 0.3s ease-in-out;

}





.searchpage_uservarifiedicon{

	position: relative;

	float: left;

	width: 20px;

	height: 20px;

	margin-top: -1px;

	margin-left: 10px;

	background-image: url(../assets/spritesv2/index.png); background-size: 320px 800px;



	background-position: 0 -480px;

}

.uservarifiedicon_indexrightpannel{

	position: relative;

	float: left;

	width: 20px;

	height: 20px;

	margin-top: -1px;

	margin-left: 5px;

	background-image: url(../assets/spritesv2/index.png); background-size: 320px 800px;



	background-position: 0 -480px;

}

.uservarifiedicon_indexleftnav{

	display: block;

	float: left;

	width: 18px;

	margin-left: 5px;

	margin-top: 17px;

	height: 17px;

	position: relative;

	background-repeat: no-repeat;

	background-image: url(../assets/nav/tick.png);

}

#indexrightsidepanellistboxfeatured:hover .indexrightsidepanellistboxgridslidefeaturednext{

	opacity: 1;

}

#indexrightsidepanellistboxfeatured:hover .indexrightsidepanellistboxgridslidefeaturedpriv{

	opacity: 1;

}

#indexrightsidepanellistboxpopular:hover .indexrightsidepanellistboxgridslidepopularnext{

	opacity: 1;

}

#indexrightsidepanellistboxpopular:hover .indexrightsidepanellistboxgridslidepopularpriv{

	opacity: 1;

}

#indexrightsidepanellistboxlatest:hover .indexrightsidepanellistboxgridslidelatestnext{

	opacity: 1;

}

#indexrightsidepanellistboxlatest:hover .indexrightsidepanellistboxgridslidelatestpriv{

	opacity: 1;

}



.indexrightsidepanelrecommendedchannelboxholder, .indexrightsidepaneltrendingchannelboxholder{

	position: relative;

	float: left;

	width: 100%;

	height: 210px;

	overflow: hidden;

}

.indexrightsidepanelrecommendedchannelbox, .indexrightsidepaneltrendingchannelbox{

	position: relative;

	float: left;

	width: 100%;

	height: 100px;

	margin-top: 10px;

}

.indexrightsidepanelrecommendedchannelbox:nth-child(1), .indexrightsidepaneltrendingchannelbox:nth-child(1){

	margin-top: 0px;

}



.indexrightsidepanelrecommendedchannelboxinner, .indexrightsidepaneltrendingchannelboxinner{

	position: relative;

	float: left;

	width: 100%;

	background-color: #FFFFFF;

	-webkit-border-radius: 3px;

	-moz-border-radius: 3px;

	border-radius: 3px;

}

.indexrightsidepanelrecommendedchannelimage, .indexrightsidepaneltrendingchannelimage{

	position: relative;

	float: left;

	width: 80px;

	height: 80px;

	overflow: hidden;

	margin: 10px;

	-webkit-border-radius: 50%;

	-moz-border-radius: 50%;

	border-radius: 50%;

}

.indexrightsidepanelrecommendedchannelimage img, .indexrightsidepaneltrendingchannelimage img{

	width: 80px;

	height: 80px;

}

.indexrightsidepanelrecommendedchanneldetails, .indexrightsidepaneltrendingchanneldetails{

	position: relative;

	float: left;

	width: calc(100% - 110px);

	padding: 10px 10px 10px 0px;

}

#indexrightsidepanelrecommendedchannelname{

	position: relative;

	float: left;

	max-width: 114px;

	margin-top: 2px;

	font-family: 'Roboto', sans-serif;

	font-size: 16px;

	color: #666666;

	overflow: hidden;

	white-space: nowrap;

	/*text-overflow: ellipsis;*/

}

#indexrightsidepaneltrendingchannelname{

	position: relative;

	float: left;

	max-width: 114px;

	margin-top: 2px;

	font-family: 'Roboto', sans-serif;

	font-size: 16px;

	color: #666666;

	overflow: hidden;

	white-space: nowrap;

	/*text-overflow: ellipsis;*/

}

.indexrightsidepanelrecommendedchannelname, .indexrightsidepaneltrendingchannelname{

	position: relative;

	float: left;

	max-width: calc(100% - 55px);

	margin-top: 2px;

	font-family: 'Roboto', sans-serif;

	font-size: 16px;

	color: #666666;

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

}



.indexrightsidepanelrecommendedchanneltotallist, .indexrightsidepaneltrendingchanneltotallist{

	position: relative;

	float: left;

	clear: both;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #666666;

	margin-top: 10px;

}

.indexrightsidepanelrecommendedchannelsubscribebutton, .indexrightsidepaneltrendingchannelsubscribebutton{

	cursor: pointer;

	position: relative;

	float: left;

	clear: both;

	width: 110px;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #FFFFFF;

	text-align: center;

	padding: 8px 0px;

	margin-top: 10px;

	background-color: #a24242;

	-webkit-border-radius: 3px;

	-moz-border-radius: 3px;

	border-radius: 3px;

	-webkit-transition: background-color .3s;

	-moz-transition: background-color .3s;

	-ms-transition: background-color .3s;

	-o-transition: background-color .3s;

	transition: background-color .3s;

}

.indexrightsidepanelrecommendedchannelremove, .indexrightsidepaneltrendingchannelremove{

	cursor: pointer;

	position: absolute;

	top: -2px;

	right: -2px;

	width: 40px;

	height: 40px;

	background-image: url(../assets/spritesv2/index.png); background-size: 320px 800px;

	background-position: -80px 0;

	z-index: 1;

}

.indexrightsidepanelopencloseindicator{

	display: none;

}

.adslot {

	position: relative;

	float: left;

	width: 100%;

	/*margin-top: 10px;*/

}

/*.adslot img {*/

/*width: 100%;*/

/*height:auto;*/

/*}*/





@media only screen and (max-width: 768px) {



	.indexrightsidepanelcloseindicator {

		display: block;

		position: fixed;

		width: 34px;

		height: 34px;

		top: calc(50% - 17px);

		right: 0px;

		z-index: 1;

		cursor: pointer;

		background-image: url(../assets/sprites/expandandcloseicons.png);

		background-position: 0px 0px;

		-webkit-transform: rotate(-90deg) translateY(16px);

		-moz-transform: rotate(-90deg) translateY(16px);

		-ms-transform: rotate(-90deg) translateY(16px);

		-o-transform: rotate(-90deg) translateY(16px);

		transform: rotate(-90deg) translateY(16px);

		-webkit-animation: indexRightSidePanelIndicatorOpen 1.5s ease-in-out 0s infinite;

		animation: indexRightSidePanelIndicatorOpen 1.5s ease-in-out 0s infinite;

		-o-animation: indexRightSidePanelIndicatorOpen 1.5s ease-in-out 0s infinite;

		-webkit-user-select: none;

		-moz-user-select: none;

		-ms-user-select: none;

		user-select: none;

		pointer-events: none;



	}

	.indexrightsidepanelcloseindicatorOpen{

		right: 295px;

		background-position: 0px -68px;

		-webkit-transform: rotate(90deg) translateY(21px);

		-moz-transform: rotate(90deg) translateY(21px);

		-ms-transform: rotate(90deg) translateY(21px);

		-o-transform: rotate(90deg) translateY(21px);

		transform: rotate(90deg) translateY(21px);

		-webkit-animation: indexRightSidePanelIndicatorClose 1.5s ease-in-out 0s infinite;

		animation: indexRightSidePanelIndicatorClose 1.5s ease-in-out 0s infinite;

		-o-animation: indexRightSidePanelIndicatorClose 1.5s ease-in-out 0s infinite;

	}



	/* Safari 4.0 - 8.0 */

	@-webkit-keyframes indexRightSidePanelIndicatorOpen {

		from {

			-webkit-transform: rotate(-90deg) translateY(16px);

			-moz-transform: rotate(-90deg) translateY(16px);

			-ms-transform: rotate(-90deg) translateY(16px);

			-o-transform: rotate(-90deg) translateY(16px);

			transform: rotate(-90deg) translateY(16px);

		}

		to {

			-webkit-transform: rotate(-90deg) translateY(-10px);

			-moz-transform: rotate(-90deg) translateY(-10px);

			-ms-transform: rotate(-90deg) translateY(-10px);

			-o-transform: rotate(-90deg) translateY(-10px);

			transform: rotate(-90deg) translateY(-10px);

		}

	}



	/* Standard syntax */

	@keyframes indexRightSidePanelIndicatorOpen {

		from {

			-webkit-transform: rotate(-90deg) translateY(16px);

			-moz-transform: rotate(-90deg) translateY(16px);

			-ms-transform: rotate(-90deg) translateY(16px);

			-o-transform: rotate(-90deg) translateY(16px);

			transform: rotate(-90deg) translateY(16px);

		}

		to {

			-webkit-transform: rotate(-90deg) translateY(-10px);

			-moz-transform: rotate(-90deg) translateY(-10px);

			-ms-transform: rotate(-90deg) translateY(-10px);

			-o-transform: rotate(-90deg) translateY(-10px);

			transform: rotate(-90deg) translateY(-10px);

		}

	}

	/* Safari 4.0 - 8.0 */

	@-webkit-keyframes indexRightSidePanelIndicatorClose {

		from {

			-webkit-transform: rotate(90deg) translateY(21px);

			-moz-transform: rotate(90deg) translateY(21px);

			-ms-transform: rotate(90deg) translateY(21px);

			-o-transform: rotate(90deg) translateY(21px);

			transform: rotate(90deg) translateY(21px);

		}

		to {

			-webkit-transform: rotate(90deg) translateY(-5px);

			-moz-transform: rotate(90deg) translateY(-5px);

			-ms-transform: rotate(90deg) translateY(-5px);

			-o-transform: rotate(90deg) translateY(-5px);

			transform: rotate(90deg) translateY(-5px);

		}

	}



	/* Standard syntax */

	@keyframes indexRightSidePanelIndicatorClose {

		from {

			-webkit-transform: rotate(90deg) translateY(21px);

			-moz-transform: rotate(90deg) translateY(21px);

			-ms-transform: rotate(90deg) translateY(21px);

			-o-transform: rotate(90deg) translateY(21px);

			transform: rotate(90deg) translateY(21px);

		}

		to {

			-webkit-transform: rotate(90deg) translateY(-5px);

			-moz-transform: rotate(90deg) translateY(-5px);

			-ms-transform: rotate(90deg) translateY(-5px);

			-o-transform: rotate(90deg) translateY(-5px);

			transform: rotate(90deg) translateY(-5px);

		}

	}



}











#indexrightsidepanelholder .jspPane{

	width: 279px!important;

}

#indexrightsidepanelholder:hover .jspPane{

	width: 279px!important;

}

#indexrightsidepanelholder .jspVerticalBar{

	width: 5px;

}

#indexrightsidepanelholder .jspTrack{

	background: transparent;

}

#indexrightsidepanelholder .jspDrag{

	background-color: transparent;

	-webkit-border-radius: 0;

	-moz-border-radius: 0;

	border-radius: 0;

}

#indexrightsidepanelholder:hover .jspDrag{

	background-color: #cfcfcf;

}









.rightsidercbox{

	display: none;

	position: relative;

	float: left;

	width: calc(100% - 20px);

	height: 80px;

	padding: 10px;

	/*display: flex;*/

	gap: 10px;

	background-color: #FFF;

	border-radius: 10px;

	margin-top: 10px;

}

.rightsidercbox:nth-child(1), .rightsidercbox:nth-child(2){

	display: flex;

}

.rightsidercbox:nth-child(1){

	margin-top: 0;

}



.rightsidercbox:hover{

	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;

}

.rightsidercboximg{

	position: relative;

	float: left;

	width: 80px;

	height: 80px;

	border-radius: 50%;

	overflow: hidden;

}

.rightsidercboxdetails{

	position: relative;

	float: left;

	width: calc(100% - 90px);

	display: flex;

	flex-direction: column;

	justify-content: space-around;

}

.rightsidercboxchannelnameholder{

	position: relative;

	float: left;

	width: 100%;

	display: flex;

	align-items: center;

	gap: 5px;

}

.rightsidercboxchannelname{

	position: relative;

	float: left;

	max-width: calc(100% - 25px);

	font-family: 'Roboto', sans-serif;

	font-size: 16px;

	font-weight: bold;

	color: #666666;

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

}

.rightsidercboxchannelname:hover{

	text-decoration: underline;

	text-overflow: unset;

}

.rightsidercboxpublishcontent{

	position: relative;

	float: left;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #666666;

}



.followunfollowbtntxtholder{

	position: relative;

	float: left;

}







.rightsidercoptionholder {

	position: absolute;

	width: 20px;

	height: 20px;

	bottom: 10px;

	right: 10px



}

.rightsidercopticon{

	position: relative;

	float: left;

	width: 20px;

	height: 20px;

	background-color: #EEE;

	border-radius: 50%;

	background-image: url(../assets/spritesv2/index.png);

	background-size: 320px 800px;

	background-position: -20px -520px;

}

.rightsidercoptiondropdown{

	display: none;

	position: absolute;

	bottom: 25px;

	right: 0;

	z-index: 1;

	background-color: #FFF;

	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

	border-radius: 10px;

	overflow: hidden;

}

.rightsidercoptionitem{

	position: relative;

	float: left;

	padding: 20px;

	font-family: 'Roboto', sans-serif;

	font-size: 12px;

	color: #666;

	white-space: nowrap;

}

.rightsidercoptionitem:hover{

	color: #333;

}

#adslot4 {

	text-align: center;

}



@media only screen and (max-width: 1840px){



}

@media only screen and (max-width: 1450px){

	.indexsliderholder{

		height: 400px;

	}

	.indexslidertitle:before {

		border-bottom: 380px solid #ffffff;

		border-left: 50px solid transparent;

		left: -48px;

	}

	/*.indexslidertitleicon, .indexslidertitletext{*/

	/*	transform: translateX(-12px);*/

	/*}*/

}

@media only screen and (max-width: 1250px){

	.indexsliderholder{

		height: 300px;

	}

	.indexslidertitle:before {

		border-bottom: 280px solid #ffffff;

	}

}



@media only screen and (max-width: 1190px){

	.indexsliderholder{

		height: 250px;

	}

	.indexslidertitle:before {

		border-bottom: 230px solid #ffffff;

	}

}



@media only screen and (max-width: 1024px){

	#indexContentsFeedHolderouter{

		width: calc(100% - 300px);

	}

}

@media only screen and (max-width: 850px){

	.indexsliderholder{

		height: 250px;

	}

	.indexslidertitle:before {

		border-bottom: 230px solid #ffffff;

	}

}



@media only screen and (max-width: 768px){

	#indexrightsidepanelholder{

		position: fixed;

		top: 50px;

		bottom: unset;

		right: -260px;

		height: calc(100% - 50px);

		background-color: #f7f7f7;

	}

	.indexrightsidepanelholder:before{

		content: '';

		position: fixed;

		top: 50px;

		right: 0px;

		width: 40px;

		height: calc(100% - 50px);

		background-color: rgba(255, 255, 255, 0.7);

		z-index: 1;

		-webkit-box-shadow: inset -11px 0 20px -18px black;

		-moz-box-shadow: inset -11px 0 20px -18px black;

		box-shadow: inset -11px 0 20px -18px black;



	}



	#indexContentsFeedHolderouter{

		width: calc(100% - 40px);

		margin-right: 40px;

	}

	.indexslidercontentsuggestion{

		gap: 10px;

	}



}







