@charset "utf-8";
@import url('https://fonts.googleapis.com/css?Bubblegum+Sans&family=Amatic+SC|Rajdhani&display=swap');

/*
font-family: 'Amatic SC', cursive;
font-family: 'Rajdhani', sans-serif;
font-family: 'Bubblegum Sans', cursive;
*/

html {
	overflow-y:scroll;
	height: 100%;
	background: linear-gradient(-45deg, #006988,#ffffff) fixed;
	background-repeat:no-repeat;
	background-size: cover;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
	background-size: cover;
	
	/* -moz-transform: scale(0.8, 0.8); Moz-browsers */
    /* zoom: 0.8; Other non-webkit browsers */
    /* zoom: 80%; Webkit browsers */
}
a{
	text-decoration: none;
	color: inherit;
}

body{
	position: relative;
	width: 1200px;
	margin: auto;
	height: 100%;

/*	border: 1px solid black;*/
}

.character_intro_banner span{
	font-weight: 500;
}
.character_intro_banner{
	display: grid;
	grid-template-columns: 33% auto 33%;
	font-size: 50px;
	font-family: 'Rajdhani', sans-serif;
}
.left_char_text_banner{
	text-align: right;
}

.index_two_char_top_banner{
	width: 100%;
	margin: 0 auto;
	height: 210px;
}
.index_two_char_top_banner > img{
	width: 100%;

}

.navbar{
	position: relative;
/*	border: 1px solid black;*/
	height: auto;
	border-bottom: 2px dashed black;
	
}

.index_content_banner{
	/* padding: 0px 10px !important;
	display: grid;
	grid-template-columns: auto max-content;
	background-image: linear-gradient(45deg, white, #3e6f7d);
	transition: background-image 0.5s ease;
	-webkit-transition: background-image 0.5s ease; */
}
.index_content_banner:hover{
	/* background-image: linear-gradient(45deg, white, #0f353f); */
}
.index_view_our_content{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
	color: #ffffff;
	font-weight: bold;
    /* margin-top: 7px; */
    margin-right: 25px;
    text-shadow: 0px 0px 4px #000000ad;
	transition: color 0.5s ease, margin 0.5s ease;
}
.index_content_banner:hover > .index_view_our_content{
	/* color: #ff9900;
	margin-right: 35px; */
}

.watch_more_banner{
	margin: 30px 0px 0px 0px;
    background-color: white;
    /* padding: 10px; */
    border-radius: 10px;
    box-shadow: 3px 3px 10px rgb(0 0 0 / 50%);
    display: grid;
    grid-template-columns: repeat(7, min-content) auto;
	overflow: hidden;
	position: relative;
}


.watch_more_skew_container {
	-webkit-backface-visibility : hidden; /* the magic ingredient */
	-webkit-transform           : skew(16deg, 0);
	overflow                    : hidden;
	width                       : 100px;
	height                      : 200px;
	position                    : relative;
	left                        : -40px;
	border                      : 1px solid black;
	transition: width 0.25s ease;
	background-color: #000000;
	border-width: 1px 1px 1px 0px;
	z-index: 2;
	box-shadow: -21px 0px 28px #000000a3;
	
}
.watch_more_skew_container:nth-child(1) {
	-webkit-transform           : skew(0deg, 0);
	width                       : 150px;
	left                        : 0px;
}


.watch_more_skew_container:hover {
	width: 300px;
	transition: width 0.25s ease;
}

.watch_more_skew_container img {
	-webkit-transform : skew(-16deg, 0);
	position          : relative;
	left              : -40px;
	height: 110%;
	transition: opacity 1s ease;
}
.watch_more_skew_container:hover img {
	opacity: 1 !important;
	transition: opacity 0.4s ease;
}

.watch_more_skew_container:nth-child(1) img {
	-webkit-transform : skew(0deg, 0);
	position          : relative;
	left              : -40px;
	height: 100%;

}
.watch_more_skew_container:nth-child(1) div {
	-webkit-transform : skew(0deg, 0);
}
.watch_more_skew_container:hover div {
	opacity: 1;
	transition: opacity 0.5s ease-out;
	/* transition-delay: 0.3s; */
}
.watch_more_big_label{
	position: absolute;
    top: 0px;
    left: 10px;
    z-index: 100;
    font-size: 41px;
    font-family: 'Rajdhani', sans-serif;
    color: white;
    text-shadow: 0px 0px 4px, -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0px 0px 5px black;
	pointer-events: none;
}

.start_watching_now{
	font-weight: 600;
	color: #28819b !important;
	background-color: #dae9ee;
    width: max-content;
    /* text-align: right; */
    margin-left: auto;
    padding: 10px;
    border-radius: 5px;
	transition: background-color 0.5s ease;
}
.start_watching_now:hover{
	/* color:white !important; */
	background-color: antiquewhite;
}

.watch_more_series_name{
	-webkit-transform : skew(-16deg, 0);
	position: absolute;
	bottom: 10px;
	left: 10px;
	color: white;
	font-family: 'Rajdhani', sans-serif;
	font-size: 18px;
    line-height: 28px;
	width: max-content;
	/* max-width: 240px; */
	opacity: 0;
	transition-delay: 0.0s;
	transition: opacity 0.0s ease-out;
	text-shadow: 0px 0px 3px black,0px 0px 3px black;
	font-weight: 900;
	background-color: #000000d4;
    padding: 5px 10px;
    border-radius: 10px;
}



.watch_more_stats{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
	width: max-content;
	text-align: right;
	position: absolute;
    right: 0px;
    top: 0px;
	padding: 10px 20px;
	z-index: 10;
	display: grid;
	text-shadow: -1px 0px 1px white, 0px -1px 1px white, +1px 0px 1px white, 0px 1px 1px white;
}


.watch_more_stats span:nth-child(1){
	font-weight: 900;
	font-size: 33px;
}




.index_stats_title{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
	width: max-content;
	text-align: right;
	position: absolute;
    right: 0px;
    top: 0px;
}


.categories_title_card{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
	width: max-content;
	text-align: center;
}
.categories_small_title_card{
	font-family: 'Rajdhani', sans-serif;
    font-size: 20px;
	width: max-content;
	text-align: center;
}

.main_page_game_grid{
	display: grid;
	grid-template-columns: repeat(2, auto);
	column-gap: 10px;
	row-gap: 10px;
}
.main_page_game_banner{
	width: 100%;
	overflow: hidden;
	border-radius: 10px;
	position: relative;
	min-height: 333px;
	height: 100%;
	
}
.main_page_game_banner_img{
	width: 100%;
	height: 100%;
	transition: opacity 1s ease;
	z-index: 7;
	position: relative;
}

.main_page_game_banner > div {

}

.left_char_text_banner, .right_char_text_banner{
	line-height: 30px;
    padding-top: 20px;
}

.index_content_stats > div{
	display: inline-block;
	font-family: 'Rajdhani', sans-serif;
	font-size: 20px;
	font-weight: bold;
	color: #22565f;
}
.index_stats_box{
	color: #b74400;
	font-size: 30px;
}

.advertisement_block{
	position: relative;
}
.this_is_ad_label{
	position: absolute;
    right: 0px;
    width: 150px;
    transform: translate(110%, -50%);
    top: 50%;
}
.this_is_ad_label_l{
	position: absolute;
	left: 0px;
	right: auto;
	width: 150px;
	transform: translate(-110%, -50%);
	top: 50%;
}

@keyframes comic_face_wiggle_l {
	0%{
		transform: rotate(-15deg) scaleX(-1);
	}
	50%{
		transform: rotate(15deg) scaleX(-1);
	}
	100%{
		transform: rotate(-15deg) scaleX(-1);
	}
}
@keyframes comic_face_wiggle_r {
	0%{
		transform: rotate(-15deg);
	}
	50%{
		transform: rotate(15deg);
	}
	100%{
		transform: rotate(-15deg);
	}
}
.comic_faces_left, .comic_faces_right{
	box-sizing: border-box;
	position: absolute;
	width: 250px;
	transition: width 0.5s ease;
	cursor: pointer;
	z-index: 100;
}
.comic_faces_left:hover, .comic_faces_right:hover{
	position: absolute;
	width: 270px;
}
.comic_faces_left{
	left: -270px;
	transform: rotate(-15deg) scaleX(-1) ;
	/* animation: comic_face_wiggle_l 6s ease 0s infinite; */
}
.comic_faces_right{
	right: -270px;
	/* animation: comic_face_wiggle_r 6s ease 0s infinite; */
	transform: rotate(-15deg);
}

.mautic_signup_form_bg{
	z-index: 200;
    background-color: rgb(0 0 0 / 71%);
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0px;
	top: 0px;
	display: none;
}
.mautic_signup_form{
	background-color: white;
    padding: 20px;
    position: fixed;
    /* margin: 0 auto; */
    left: 50%;
    top: 30%;
    transform: translate(-50%, -50%);
    z-index: 210;
    box-shadow: 0px 8px 5px #00000073;
	border-radius: 10px;
	display: none;
}



.css_signup_comic_outerbox{
	transform: translate(-50%, -50%);
	left: 50%;
	top:40%;
	z-index: 100;
	position:  absolute;
	background-color: rgb(74, 107, 123);
	border-radius: 20px;
	/* padding: 70px; */
	box-shadow: 0px 0px 27px black;
	/* width: 300px; */
}
.css_signup_title{
	padding: 20px 0px 20px 0px;
	text-align: center;
	width: inherit;
	color: white;
	font-family: 'Rajdhani', sans-serif;
	font-size: 30px;
}
.css_signup_instructions{
	padding-top: 20px;
	text-align: center;
	width: inherit;
	color: white;
	font-family: 'Rajdhani', sans-serif;
	font-size: 30px;
	padding-bottom: 20px;
}
.css_signup_instructions:hover{
	color:rgb(255, 136, 160);
}
.css_signup_dark_bg{
	background-color: rgba(0,0,0,0.7);
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0px;
	top: 0px;
}
.css_signup_comic_innerbox{
	display: grid;
    grid-column-gap: 5px;
    grid-template-columns: 33.33% 33.33% 33.33%;
	padding: 0px 30px 0px 30px;
	width: 850px;
}
.css_signup_comic_innerbox > span{
	padding: 10px;
	background-color: white;
	font-family: 'Bubblegum Sans', cursive;
	border-radius: 0px 0px 20px 20px;
	width: initial;
}
.css_signup_comic_innerbox > img{
	width: 100%;
	border-radius: 20px 20px 0px 0px;
}
.css_signup_close{
	position: absolute;
	right: 20px;
	top: 10px;
	color: white;
	font-family: 'Bubblegum Sans', cursive;
	font-size: 30px;
}
.css_signup_close:hover{
	color:crimson;
	cursor: pointer;
}




.header_img{
	height: 100%;
	position:absolute;
	bottom: 0px;
	right:0px;
	-webkit-transform: scaleX(-1);
  	transform: scaleX(-1);
	max-width: 246px;
	max-height: 123px;
	
}

.site_title{
	font-family: 'Amatic SC', cursive;
	font-size: 60px;}


.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
	
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 16px;
  z-index: 1;
	border-radius: 5px;
	width: 300px;
}

.dropdown:hover .dropdown-content {
  	display: block;
	transition: display ease 1s;
	z-index: 200;
}

.menu_button{
	padding: 5px;
	color:black;
	font-family: 'Amatic SC', cursive;
	font-size: 23px;
	font-weight: 900;
	transition: background-color ease 1s, margin ease 1s ;
	background-color: rgba(220,20,60,0.15);
	border-radius: 5px;
	margin: 0px 10px 0px 0px; 
}
.menu_button:hover{
	color:white;
	background-color: crimson;
	transition: background-color ease 0.2s, margin ease 0.2s ;
	margin: 0px 0px 0px 10px; 
}



.menu_sub_button{
	padding: 5px;
	color:black;
	font-family: 'Amatic SC', cursive;
	font-size: 23px;
	font-weight: 900;
	transition: background-color ease 1s, margin ease 1s ;
	background-color: rgba(58,220,18,0.15);
	border-radius: 5px;
	margin: 0px 10px 5px 0px; 
}
.menu_sub_button:hover{
	color:white;
	text-shadow: 0px 0px 5px white;
	background-color: rgba(58,220,18,1.00);
	transition: background-color ease 0.2s, margin ease 0.2s ;
	margin: 0px 0px 10px 10px; 
}

.menu_cat{
	color:black;
	font-family: 'Amatic SC', cursive;
	margin-left: 15px;

	font-size:  25px;
}

.sub_field_top{
	width:170px;
/*	border: 1px solid black;*/
	display: inline-block;
	position: absolute;
	bottom: 1px;
	transition: margin ease 1s ;
	margin: 0px 10px 0px 0px; 
}
.sub_field_top:hover{
	transition: margin ease 0.2s ;
	margin: 0px 0px 0px 10px; 
}
.sub_button_top{
	width:100%;
	background-color: crimson;
	border: none;
	font-family: 'Amatic SC', cursive;
	font-size: 30px;
	font-weight: 900;
	padding: 5px;
	border-radius: 5px;
	color:white;
}
.sub_button_top:hover{
	color:black;
	background-color: rgba(245,176,62,1.00);
	transition: background-color ease 0.2s, margin ease 0.2s ;
}
.sub_email_top{
	width: -webkit-fill-available !important;
	border-radius: 5px;
	padding: 5px 5px 5px 5px;
	margin-bottom: 5px;
	border: 2px dashed crimson;
	transition: border ease 1s;
}
.sub_email_top:hover{
	border: 2px dashed rgba(0,255,21,1.00);
	transition: border ease 0.2s;
}

.css_header_title_anim{
	color:black;
	transition: color ease 1s, font-weight ease 1s;
/*	cursor:none;*/
}
.css_header_title_anim:hover{
	color: crimson;
/*	font-weight: 900;*/
	transition: color ease 0.2s,  font-weight ease 0.2s;
}

.css_subscribe_btn_top{
	background-color: crimson;
	color:white;
}


/*#####*/
/* admin area*/

.login_bar_1{
    margin: 60px auto;
    background-color: aliceblue;
    padding: 20px;
    width: fit-content;
    font-family: 'Amatic SC', cursive;
    font-size: 40px;
    font-weight: 600;
    border-radius: 10px;
    box-shadow: 3px 3px 5px #0000004a;
}


.red_border{
	border: 1px solid green;
	background-color: rgb(184, 255, 212);
	border-radius: 10px;
}
.flat_top_border{
	border-radius: 0px 0px 10px 10px !important;
	border-top: 1px solid yellow;
	background-color: yellow;
}
.flat_bottom_border{
	border-radius: 10px 10px 0px 0px !important;
	border-bottom: 1px solid yellow;
	background-color: yellow;
}
.dash_scheduler_episode_bar{
	min-width: 217px;
}





.dash_merch_grid{
	display: grid;
	grid-template-columns: 50% auto;
	grid-column-gap: 10px;
}


.labl{
	line-height: 15px;
}
.labl > input + div{ /* DIV STYLES */
    cursor:pointer;
	/* border:2px solid transparent; */
	transition: background-color 0.2s ease;
}
.labl > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */
    background-color: #00ff3c !important;
	border: 1px solid #155a4c !important;
	transition: background-color 0.2s ease;
}




/* for sortable scheduler  */

.column {
    width: 170px;
    float: left;
    padding-bottom: 100px;
  }
  .portlet {
    margin: 0 1em 1em 0;
    padding: 0.3em;
  }
  .portlet-header {
    padding: 0.2em 0.3em;
    margin-bottom: 0.5em;
    position: relative;
  }
  .portlet-toggle {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -8px;
  }
  .portlet-content {
    padding: 0.4em;
  }
  .portlet-placeholder {
    border: 1px dotted black;
    margin: 0 1em 1em 0;
    height: 50px;
  }

/* for sortable scheduler  */









.add_video_bottom{
	width:100%;
	display:grid;
	grid-template-columns:  50% auto auto;
	grid-column-gap: 10px;
	height: min-content;
}

.css_edit_video_current_thumb_box{
	font-family: 'Rajdhani', sans-serif;
	font-size: 20px;
	background-color: crimson;
    margin: 0px 0px 10px 0px;
    border-radius: 10px;
    padding: 10px;
    /* width: -webkit-fill-available;*/
}
.css_edit_video_current_thumb_url{
    font-family: 'Rajdhani', sans-serif;
    background-color: white;
    padding: 5px 14px;
	border-radius: 10px;
}


.main_page_section_title{
/*	font-family: 'Amatic SC', cursive;*/
	font-family: 'Rajdhani', sans-serif;
	font-size: 40px;
/*	font-weight: 600;*/
}
.category_wiggle{
	animation: playlist_slide 4s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}
@keyframes playlist_slide{
	0%{margin-left: 0px;}
	50%{margin-left: 10px;}
	100%{margin-left: 0px;}
}
.main_page_section{
	margin: 30px 0px;
	background-color: white;
	padding: 10px;
	border-radius: 10px;
	box-shadow: 3px 3px 10px rgba(0,0,0,0.5);
}

 


.watch_page_old{
    font-family: 'Rajdhani', sans-serif;
    font-size: 14px;
    font-weight: 800;
	position: absolute;
    /* top: 5px; */
    /* left: 5px; */
    /* background-color: crimson; */
    /* border-radius: 5px; */
	line-height: 16px;
    color: white;
    padding: 5px 25px 5px 5px;
    transition: padding 0.1s ease;
    height: 100%;
	width: -moz-available;          /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
    width: fill-available;
	
    background-image: linear-gradient(44deg, crimson, #af0000);
    max-width: 56%;
}
.css_watch_page_old_series{
/*	font-weight: 300;*/
    color: #e2a9a9;
}

.watch_page_old_select_this_ep{
	background-image: linear-gradient(44deg, #610718, #540000);
}

.loading_spinner_index{
	position: absolute;
    width: 70px !important;
    height: 70px !important;
    z-index: 5 !important;
    /* margin: 0 auto; */
    left: 50%;
    transform: translate(-50%, -50%);
	top: 50%;
	animation: loading_spin 5s ease 0s infinite;

	 
}
.loading_spinner{
	position: absolute;
    width: 70px;
    /* z-index: 100; */
    /* margin: 0 auto; */
    left: 50%;
    transform: translate(-50%, -50%);
	top: 45%;
	animation: loading_spin 5s ease 0s infinite;
	 
}
@keyframes loading_spin{
	from{transform: translate(-50%, -50%) rotate(0deg);}
	to{transform: translate(-50%, -50%) rotate(360deg);}
}



.watch_page_merch_img{
	width: 100%;
	height: 100%;
	/* padding: 2.5%; */
	/* margin: 0px 50%; */
	/* transform: translate(-50%, 0%); */
	opacity: 0;
}

.merch_segment_title{
	/*	font-family: 'Amatic SC', cursive;*/
	font-family: 'Rajdhani', sans-serif;
	font-size: 40px;
	/*	font-weight: 600;*/
	margin-bottom: 10px;
}

.watch_page_merch_grid{
	width: 100%;
	display: grid;
	grid-template-columns: repeat(10, 10%);
	grid-column-gap: 10px;
}
.css_watch_page_merch_title{
	font-family: 'Rajdhani', sans-serif;
	padding: 5px 5px;
	font-size: 12px;
	opacity: 0;
	position: absolute;
	left: 0px;
	top: 0px;
	margin-top: -130px;
    background-color: #ffffffd4;
	box-shadow: 0px 5px 5px #00000052;
	height: 100%;
	transition: margin-top 0.35s ease;
}



.css_watch_page_merch_item_slot{
	/* display: grid; */
    grid-template-rows: auto auto;
    overflow: hidden;
    box-shadow: 0px 0px 10px #00000034;
	border-radius: 10px;
	transition: box-shadow 0.3s ease;
	height: 115px;
	position: relative;
}
.css_watch_page_merch_item_slot:hover{
	box-shadow: 0px 0px 10px #00000051;
	transition: box-shadow 0.1s ease;
}

.css_watch_page_merch_item_slot:hover .css_watch_page_merch_title{
	opacity: 1;
	margin-top: 0px;
}

/*
.watch_page_old{
    font-family: 'Rajdhani', sans-serif;
    font-size: 14px;
    font-weight: 800;
    position: absolute;
    color: white;
    padding: 5px 25px 5px 5px;
    transition: padding 0.1s ease;
    height: 100%;
    width: -webkit-fill-available;
    background-image: linear-gradient(44deg, crimson, #af0000);
    max-width: 56%;
}
*/






.category_page_heading{
	text-align: center; 
	font-size: 62px; 
	line-height: 58px;
	animation: heading_fade_in 1s ease-in-out;

}
@keyframes heading_fade_in{
	from{opacity: 0; margin-left: 20px;}
	to{opacity: 1; margin-left: 00px;}
}


.fresh_content{
/*	height: 400px;*/
	display: grid;
 	grid-template-columns: 700px auto;
	grid-template-rows: 42px 480px;
	grid-column-gap: 10px;
	grid-row-gap: 10px;
}
/*
.fresh_title_1{grid-area: fresh_title_1;}
.fresh_title_2{grid-area: fresh_title_2;}
.fresh_1{grid-area: fresh_1;}
.fresh_2{grid-area: fresh_2;}
.fresh_3{grid-area: fresh_3;}
.fresh_4{grid-area: fresh_4;}
*/

/* .fresh_1{
	height: 480px !important; 
	min-height: 480px !important;
	/* border: 1px dashed crimson; */
/* }  */

.home_page_feature_thumb_box{
	background-image: repeating-linear-gradient(45deg, white,white,white,white 50px, lightblue,lightblue,lightblue,lightblue 61.9px);
	animation: feature_thumb_load 8s linear 0s infinite;
	border-radius: 5px;
	overflow: hidden;
	position: relative;
}
@keyframes feature_thumb_load{
	from{background-position: 0px 0px;}
	to{background-position: 700px 0px;}
}

.css_main_page_image{
	display: inline;
    margin: 0px;
	object-fit: fill;
	width: 100%;
	height: 100%;
	opacity: 0;
}
.fresh_old{
	display: grid;
	grid-row-gap: 10px;
	grid-template-rows: repeat(3, minmax(100px, 1fr));
}

.fresh_titles{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
    font-weight: 800;
    text-decoration: none;
    padding-top: 9px;
	line-height: 19px;
}
.watch_page_main_vid{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
    font-weight: 800;
    text-decoration: none;
    padding-top: 9px;
    line-height: 50px;
	width: 100%;
}

.view_count{
	font-family: 'Rajdhani', sans-serif;
    font-size: 20px;
    font-weight: 800;
	text-decoration: none;
	padding-top: 16px;
}

.css_main_page_image_old{
	width: 100%;
	opacity: 0;
	position: relative;
}
.css_more_from_playlist{
	height:100%;
	width: auto;
	min-width: 125px;
	min-height: 70px;
	background-color: crimson;
}

.fresh_old_box{
	/* border: 2px solid gray; */
	overflow: hidden;
	position: relative;
	border-radius: 5px;
}

.fresh_titles_old{
font-family: 'Rajdhani', sans-serif;
    font-size: 17px;
    font-weight: 800;
    position: absolute;
    /* top: 5px; */
    /* left: 5px; */
/*    background-color: crimson;*/
    /* border-radius: 5px; */
    color: white;
    padding: 5px 15px;
    transition: padding 0.1s ease;
    height: 100%;
	width: -webkit-fill-available;
	background-image: linear-gradient(44deg, crimson, #ff9999);
	max-width: 56%;
}
.fresh_titles_playlist{
	font-size: 20px;
    color: #909090;
}


.fresh_titles_old_main_page{
	font-family: 'Rajdhani', sans-serif;
    font-size: 17px;
    font-weight: 800;
	position: absolute;
	z-index: 40;
    top: 5px;
    left: 5px;
    background-color: crimson;
    border-radius: 5px;
    color: white;
    padding: 5px 10px;
    line-height: 15px;
    transition: padding 0.1s ease;
}
.fresh_titles_old_main_page_series{
    color: #88001b;
    font-weight: 800;
    font-size: 15px;
    /* background-color: #96031f; */
    /* padding: 0px 10px; */
    border-radius: 5px;
}

.fresh_old_box:hover > a > span {
	padding: 5px 20px;
	transition: padding 0.1s ease ; 
}
.fresh_old_box > a > img:nth-child(1) {
	transition: transform 3s ease, opacity 1s ease;
	z-index: 10;
}
.fresh_old_box:hover > a > img:nth-child(1) {
	transform:translateY(-15%);
	transition: transform 0.2s ease ; 
}


/*###########################################################*/
/*###########################################################*/
/*###########################################################*/
/*###########################################################*/

.game_wide_mode{
	background-color: crimson;
	color: white;
	border-radius: 5px;
	border: none;
}
.game_wide_mode:hover{
	background-color: rgb(228, 148, 164);
	cursor: pointer;
}
/*###########################################################*/
/*###########################################################*/
/*###########################################################*/
/*###########################################################*/
/*watch page*/

.watch_page{
/*	height: 440px;*/
	display: grid;
 	grid-template-columns: 800px auto;
	grid-column-gap: 10px;
	grid-row-gap: 10px;
}

.video_window{
	width: 100%;
    height: 92.6%;
}
.watch_main{
    display: grid;
    grid-template-rows: 441px 18px 10px;
	
}
.watch_page_series_banner{
	width: 100%;
}

.video_player_box{
	height: 490px;
	position: relative;
}
.more_from_label{
	font-family: 'Rajdhani', sans-serif;
	font-size: 16px;
	font-weight: 800;
	line-height: 0px;
}
.more_from_series{
	font-size: 34px;
    line-height: 31px;
    margin-bottom: 5px;
}


::-webkit-scrollbar {
  	width: 15px;
	background: gray;
	border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background: crimson;
  border-radius: 30px;
}

.watch_playlist_more{  
	height: 445px; 
	/* display: grid; */
/*	grid-row-gap: 2.5px;*/
	overflow-y: scroll ;
	padding-right: 5px;
	/* grid-template-rows: repeat(auto-fill, 70px); */
	scroll-behavior: smooth;
}


.watch_playlist_entry{
	height: 70px;
    overflow: hidden;
	position: relative;
	background: rgba(42,34,34,1.00);
}

.watch_playlist_entry:hover > a > span {
	padding: 5px 10px;
	transition: padding 0.1s ease ; 
}
/*
.watch_playlist_entry > a >  img {
	transition: transform 3s ease;
}
*/
/*
.watch_playlist_entry:hover > a >  img {
	transform:translateY(-15%);
	transition: transform 0.2s ease ; 
}
*/


#id_edit_video_thumbnail_image{
	width: 100%;
	height: 100%;
	z-index: 21;
	position: relative;
}

.playlist_tools_grid{
	display: grid;
	grid-template-columns: 50% auto;
	grid-column-gap: 10px;
}

.thumb_preview_label{
	top: 50%;
	transform: translate(0%, -50%);
	position: absolute;
	text-align: center;
	width: 100%;
	font-family: 'Rajdhani', sans-serif;
	z-index: 10;
}

.dash_playlist_list{
	background: gray;
    /* padding: 10px; */
    /* margin: 5px; */
    border-radius: 10px;
    color: white;
    font-family: 'Rajdhani', sans-serif;
    font-size: 15px;
    font-weight: 600;
	position: relative;
	overflow:hidden;
	/* height: 37px; */
	/* line-height: 40px; */
	/*	width: 100%;*/ 
	background-color: white;
    box-shadow: 2px 2px 5px #00000045;
	position: relative;
	height: max-content;
}
.dash_playlist_list > form{


	/* position:absolute;
	left: 0px;
    top: 70px;
	transition: top 0.1s ease; */
}
/* .dash_playlist_list:hover > form{
	top: 3px;
	transition: top 0.1s ease;
} */

.playlist_editor{
	display: grid;
	row-gap: 10px;
}
.dash_playlist_title{
	position: absolute;
    top: 5px;
    left: 5px;
	line-height: 12px;
	color: black;
}
.playlist_rename{
    color:black;
    background: whitesmoke;
	/* height: auto; */
    /* height: 17px; */
    /* width: 322px */
}
.series_delete_btn{
	background: crimson;
	border-color: rgba(196,17,53,1.00);
}
.sortable_episode{
	background: gray;
    padding: 0px 10px;
    margin: 5px;
    border-radius: 10px;
    color: white;
    font-family: 'Rajdhani', sans-serif;
    font-size: 25px;
    font-weight: 600;
	position: relative;
}
.dash_latest_select_separator{
	margin-bottom: 10px;
}


.dash_preview_label{
	font-family: 'Rajdhani', sans-serif;
	font-size: 25px;
}




.dash_playlist_cat{
/*	width: 20px; */
/*    padding: 10px;*/
    border-radius: 10px;
    font-size: 17px;
    /* height: 20px; */
    width: 170px;
	padding: 0px;
}

/* .dash_playlist_cat > option{
	z-inde:100;
} */
.playlist_tools{
    display: inline-grid;
    grid-template-rows: 26px auto;
	grid-row-gap: 7px;
    top: -5px; 
    /* margin-top: 0px; */
    position: absolute;
    width: fit-content;
	left: 360px;
	
}
.playlist_tools_btn_mod{
	/* height: 20px; */
	display: inline-grid;
	
}
.playlist_rename_btn{
	/* width: 125px; */
}

.cat_thumb_crop{
	overflow: hidden;
    height: 150px;
}
.cat_series_grid{
	display: grid;
	grid-template-columns: 33.33% 33.33% auto;
	grid-gap: 10px;
}

.cat_playlist_thumb{
	width: 100%;
	transform: translate(0px, -17%);
	transition:transform 0.6s ease, opacity 1s ease;
	opacity: 0;
}
.image_fade_in{
	opacity: 1;
}
.cat_playlist_box{
/*	width:100%;*/
	background-color: whitesmoke;
	padding: 5px;
	box-shadow: 3px 3px 5px rgba(0,0,0,0.44);
	border-radius: 5px;
	transition: background-color 0.1s ease;
	position:relative;
}

.cat_playlist_box:hover{
	background-color: crimson;
	transition: background-color 0.1s ease;
}

/* .cat_playlist_data_box{
	transition: background-color 0.1s ease;
    display: grid;
    position: absolute;
    bottom: 0px;
    background-color: white;
    padding: 5px 10px;
    border-radius: 0px 10px 0px 0px;
} */
.cat_playlist_data_box {
	transition: background-color 0.1s ease;
    display: grid;
    position: absolute;
    bottom: 0px;
    background-color: crimson;
    padding: 5px 10px;
    /* border-radius: 0px 10px 0px 0px; */
    /* top: -10px; */
    left: 10px;
    border-radius: 10px;
    transform: rotateZ(-5deg);
    background-image: linear-gradient(180deg, #480000, #ed143d00);
    z-index: 100;
    border: 2px outset white;
    box-shadow: 5px 5px 5px #000000db;
}


.cat_playlist_box:hover .cat_playlist_data_box{
	background-color: crimson;
	/* transition: background-color 0.3s ease; */
}
.cat_playlist_box:hover span{
	color: white;
}
.cat_playlist_box:hover .cat_playlist_data_box > span:nth-child(1){
	padding-left: 10px;
	transition: padding-left 0.6s ease;
}
.cat_playlist_box:hover .cat_playlist_data_box > span:nth-child(2){
	padding-left: 20px;
	transition: padding-left 0.6s ease;
}
.cat_playlist_box:hover .cat_playlist_thumb{
	transform: translate(0px, -25%);
	transition:transform 0.6s ease;
}


/* .cat_playlist_title{
	font-family: 'Rajdhani', sans-serif;
    font-size: 15px;
	font-weight: 600;
	transition: padding-left 0.3s ease;
}
.cat_playlist_title_eps{
	color: #7a7a7a;
	font-size: 13px;
	transition: padding-left 0.3s ease;
} */

.cat_playlist_title {
    line-height: 17px;
    font-family: 'Rajdhani', sans-serif;
    font-size: 20px;
    font-weight: 600;
    transition: padding-left 0.3s ease;
    color: #ffffff;
    text-shadow: 3px 3px 4px black;
}

.cat_playlist_title_eps {
    color: #ffffff;
    font-size: 16px;
    transition: padding-left 0.3s ease;
	text-shadow: none;
    opacity: 0.5;
	margin-top: 3px;
    /* float: right; */
    /* width: auto; */
    /* transform: rotateZ(45deg); */
	/* line-height: 7px; */
}



.cat_category_box{
	background-color: white;
	margin-bottom: 10px;
	padding: 5px;
	border-radius: 10px;
	margin-top: 30px;
}




.img_hidden{
	opacity:0 !important;
}
.img_appear {
	opacity:1 !important;
	-moz-transition: opacity 2s ease ; /* Firefox 4 */
	-webkit-transition: opacity 2s ease ; /* Safari and Chrome */
	-o-transition: opacity 2s ease ;
	transition: opacity 2s ease;

}


.image_reveal{
	/* display: none; */
	opacity: 1;
	transition: opacity 1s ease;
}

b{
	font-weight: 900;
}


.dash_login_btn{
	float:right;
    padding: 10px;
    border-radius: 10px;
    font-size: 20px;
}
.dash_login_input{
	width: 300px;
    padding: 10px;
    border-radius: 10px;
    font-size: 20px;
}

/*########################################################################################## */
/*########################################################################################## */
/*########################################################################################## */
/*########################################################################################## */
/*########################################################################################## */
/*Game Page*/

.css_game_page_recom_side_img{
	min-width: 101px !important;
    min-height: 60px !important;
}

.css_game_page_recom_side_entry{
	height: 59px !important;
}
.game_page_recom_side_title{
	font-size: 14px;
}

.game_iframe{
	width: 880px;
	height: 495px;
	transition: width .5s ease, height .5s ease;
}

.gamepage_divider_grid{
	width: -webkit-fill-available;
	display: grid;
	grid-template-columns: 900px auto;
}
.css_game_page_description{
	font-weight: 300;
	font-size: 20px;
	font-family: 'Rajdhani', sans-serif;
    /* font-size: 30px; */
    /* font-weight: 800; */
	position: relative;
    text-decoration: none;
/*	background-image: linear-gradient(180deg, white, rgba(215,215,215,1.00) );*/
}

.xbox_a{
	background: lime;
    border-radius: 63px;
    text-align: center;
    padding: 0px 7px;
    font-weight: 900;
}
.xbox_x{
	background: #0095ff;
}
.xbox_b{
	background: #ff0000;
}
.xbox_y{
	background: #ffcf20;
}
.xbox_lrs{
	background: #9B9B9B;
	padding: 5px 7px;
	font-size: 15px;
}

.css_game_page_description_btn{
	font-family: 'Rajdhani', sans-serif;
    font-size: 20px;
    font-weight: 600;
    background: #bbbbbb;
    padding: 6px 29px;
    border-radius: 10px;
    width: fit-content;
	transition: background 1s ease;
}
.css_game_page_description_btn:hover{
	cursor: pointer;
	background: crimson;
	color: white;
	transition: background 0.1s ease;
}

.css_game_page_desc_collapsed{
	overflow: hidden;
    height: 100px;
	transition: height 0.1s ease;
}
.fresh_titles_games{
	font-family: 'Rajdhani', sans-serif;
    font-size: 30px;
    font-weight: 800;
	text-decoration: none;
}
.game_page_desc_fade{
	position: absolute;
	background-image: linear-gradient(180deg, rgba(255,255,255,0.00), white);
	top: 0px;
	left: 0px;
	width: -webkit-fill-available;
	height: -webkit-fill-available;
}
.game_page_fade_label{
	/* text-align: center; */
    position: absolute;
    bottom: 0px;
    left: 50%;
    font-weight: 900;
    /* right: auto; */
    /* margin-right: auto; */
    transform: translate(-50%,0%);
}


.zorkbox{
	background-color: black;
    color: #00ff17;
    position: absolute;
    padding: 10px;
    font-size: 13px;
    font-family: monospace;
}
.zorkbox #screen-inner{
	height: 230px;
    overflow-y: scroll;
}
.zorkbox #scorebar-inner div{display: inline;}

.play_button{
    position: absolute;
    top: 50%;
    z-index: 1000;
    left: 50%;
    width: 50px;
    transform: translate(-50%, -50%) rotateZ(0deg);
	transition: transform 0.5s ease, opacity 0.5s ease;
	opacity: 0.0;
	filter: hue-rotate(252deg) brightness(3.5);
}
.fresh_old_box:hover .play_button{
    transform: translate(-50%, -50%) rotateZ(360deg);
	cursor: pointer;
}
.home_page_feature_thumb_box:hover .play_button{
    transform: translate(-50%, -50%) rotateZ(360deg);
	cursor: pointer;
}
.single_rec_ep_box:hover .play_button{
    transform: translate(-50%, -50%) rotateZ(360deg);
	cursor: pointer;
}
.single_rec_ep_box:hover{
	cursor: pointer;
}
.big_play_button{
	width: 100px;
}

.main_page_rec_vid_grid{
	display: grid;
	grid-template-columns: 33% 33% 33%;
	row-gap: 5px;
	column-gap: 5px;
}

.single_rec_ep_box{
	position: relative;
	overflow: hidden;
	border-radius: 10px;
	width: 100%;
	height: 180px;
}

.fresh_old_box:hover{
	cursor: pointer;
}

.single_rec_ep_box > .recom_ep_thumb{
	width: 100%;
    height: 220px;
	bottom: 0;
	position: absolute;
	transition: bottom 1s ease;
}
.single_rec_ep_box:hover > .recom_ep_thumb{
	/* cursor: pointer; */
	bottom: -20px;
	transition: bottom 0.5s ease;
}