/******************************************************************
  Theme Name: Anime
  Description: Anime video tamplate
  Author: Colorib
  Author URI: https://colorib.com/
  Version: 1.0
  Created: Colorib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Banner Section
6.  Product Section
7.  Intagram Section
8.  Latest Section
9.  Contact
10.  Footer Style
-------------------------------------------------------------------*/

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

/* Template default CSS
/*----------------------------------------*/

html,
body {
	height: 100%;
	font-family: "Mulish", sans-serif;
	-webkit-font-smoothing: antialiased;
	background: #0b0c2a;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 400;
	font-family: "Mulish", sans-serif;
}

h1 {
		color: #ffffff;
	font-size: 70px;
}

h2 {
	margin-top: 30px;
	margin-bottom: 20px;
	font-family: "Oswald", sans-serif;
	color: #d4d2d2;
	font-size: 36px;
}

h3 {
	color: #d4d2d2;
	font-size: 30px;
		font-family: "Oswald", sans-serif;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 15px;
	font-family: "Mulish", sans-serif;
	color: #d4d2d2;
	font-weight: 400;
	line-height: 25px;
	margin: 0 0 15px 0;
}

img {
	max-width: 100%;
}

input:focus,
select:focus,
button:focus,
textarea:focus {
	outline: none;
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #ffffff;
}

ul,
ol {
	padding: 0;
	margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

.section-title {
	margin-bottom: 30px;
}

.section-title h4,
.section-title h5 {
	color: #ffffff;
	font-weight: 600;
	line-height: 21px;
	text-transform: uppercase;
	padding-left: 20px;
	position: relative;
	font-family: "Oswald", sans-serif;
}

.section-title h4:after,
.section-title h5:after {
	position: absolute;
	left: 0;
	top: -6px;
	height: 32px;
	width: 4px;
	background: #e53637;
	content: "";
}

.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.spad {
	padding-top: 100px;
	padding-bottom: 100px;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
	color: #fff;
}

/* buttons */

.primary-btn {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	letter-spacing: 2px;
}

.primary-btn span {
	font-size: 18px;
	margin-left: 5px;
	position: relative;
	top: 3px;
}

.site-btn {
	font-size: 13px;
	color: #ffffff;
	background: #e53637;
	font-weight: 700;
	border: none;
	border-radius: 2px;
	letter-spacing: 2px;
	text-transform: uppercase;
	display: inline-block;
	padding: 12px 30px;
}

/* Preloder */

#preloder {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 999999;
	background: #000;
}

.loader {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -13px;
	margin-left: -13px;
	border-radius: 60px;
	animation: loader 0.8s linear infinite;
	-webkit-animation: loader 0.8s linear infinite;
}

@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

@-webkit-keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		border: 4px solid #673ab7;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

.spacial-controls {
	position: fixed;
	width: 111px;
	height: 91px;
	top: 0;
	right: 0;
	z-index: 999;
}

.spacial-controls .search-switch {
	display: block;
	height: 100%;
	padding-top: 30px;
	background: #323232;
	text-align: center;
	cursor: pointer;
}

.search-model {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: #000;
	z-index: 99999;
}

.search-model-form {
	padding: 0 15px;
}

.search-model-form input {
	width: 500px;
	font-size: 40px;
	border: none;
	border-bottom: 2px solid #333;
	background: 0 0;
	color: #999;
}

.search-close-switch {
	position: absolute;
	width: 50px;
	height: 50px;
	background: #333;
	color: #fff;
	text-align: center;
	border-radius: 50%;
	font-size: 28px;
	line-height: 28px;
	top: 30px;
	cursor: pointer;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

/*---------------------
  Header
-----------------------*/

.header {
	background: #070720;
}

.header__logo {
	padding: 8px 0 8px;
}

.header__logo a {
	display: inline-block;
}

.header__menu {
	text-align: center;
}

.header__menu ul li {
	list-style: none;
	display: inline-block;
	position: relative;
	margin-right: 16px;
}

.header__menu ul li.active a {
	background: #e53637;
	color: #ffffff;
}

.header__menu ul li:hover a {
	color: #ffffff;
}

.header__menu ul li:hover .dropdown {
	top: 100px;
	opacity: 1;
	visibility: visible;
}

.header__menu ul li:hover .dropdown li a {
	background: transparent;
}

.header__menu ul li:last-child {
	margin-right: 0;
}

.header__menu ul li .dropdown {
	position: absolute;
	left: 0;
	top: 82px;
	width: 220px;
	background: #ffffff;
	text-align: left;
	padding: 5px 0;
	z-index: 9;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.header__menu ul li .dropdown li {
	display: block;
	margin-right: 0;
}

.header__menu ul li .dropdown li a {
	font-size: 14px;
	color: #111111;
	font-weight: 500;
	padding: 5px 10px;
}

.header__menu ul li a {
	font-size: 15px;
	color: #b7b7b7;
	display: block;
	font-weight: 700;
	-webkit-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	transition: all, 0.5s;
	padding: 20px;
}

.header__menu ul li a span {
	position: relative;
	font-size: 17px;
	top: 2px;
}

.header__right {
	text-align: right;
	padding: 20px 0 15px;
}

.header__right a {
	display: inline-block;
	font-size: 18px;
	color: #ffffff;
	margin-right: 30px;
}

.header__right a:last-child {
	margin-right: 0;
}

.slicknav_menu {
	display: none;
}

/*---------------------
  Hero
-----------------------*/

.hero {
	padding-top: 50px;
}

.hero__items {
	padding: 250px 0 42px 50px;
	border-radius: 5px;
}

.hero__text {
	position: relative;
	z-index: 9;
}

.hero__text .label {
	font-size: 13px;
	color: #e53637;
	background: #ffffff;
	padding: 5px 14px 3px;
	display: inline-block;
	position: relative;
	top: -100px;
	opacity: 0;
	-webkit-transition: all, 0.2s;
	-o-transition: all, 0.2s;
	transition: all, 0.2s;
}

.hero__text h2 {
	color: #ffffff;
	font-size: 42px;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	line-height: 52px;
	margin-top: 35px;
	margin-bottom: 8px;
	position: relative;
	top: -100px;
	opacity: 0;
	-webkit-transition: all, 0.4s;
	-o-transition: all, 0.4s;
	transition: all, 0.4s;
}

.hero__text p {
	color: #ffffff;
	font-size: 16px;
	margin-bottom: 40px;
	position: relative;
	top: -100px;
	opacity: 0;
	-webkit-transition: all, 0.6s;
	-o-transition: all, 0.6s;
	transition: all, 0.6s;
}

.hero__text a {
	position: relative;
	top: -100px;
	opacity: 0;
	-webkit-transition: all, 0.8s;
	-o-transition: all, 0.8s;
	transition: all, 0.8s;
}

.hero__text a span {
	font-size: 13px;
	color: #ffffff;
	background: #e53637;
	display: inline-block;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 14px 20px;
	border-radius: 4px 0 0 4px;
	margin-right: 1px;
}

.hero__text a i {
	font-size: 20px;
	display: inline-block;
	background: #e53637;
	padding: 11px 5px 16px 8px;
	color: #ffffff;
	border-radius: 0 4px 4px 0;
}

.hero__slider.owl-carousel .owl-item.active .hero__text .label {
	top: 0;
	opacity: 1;
}

.hero__slider.owl-carousel .owl-item.active .hero__text h2 {
	top: 0;
	opacity: 1;
}

.hero__slider.owl-carousel .owl-item.active .hero__text p {
	top: 0;
	opacity: 1;
}

.hero__slider.owl-carousel .owl-item.active .hero__text a {
	top: 0;
	opacity: 1;
}

.hero__slider.owl-carousel .owl-dots {
	position: absolute;
	left: 0;
	bottom: 10px;
	width: 100%;
	text-align: center;
}

.hero__slider.owl-carousel .owl-dots button {
	height: 8px;
	width: 8px;
	background: #b7b7b7;
	border-radius: 50%;
	margin-right: 10px;
}

.hero__slider.owl-carousel .owl-dots button.active {
	background: #ffffff;
}

.hero__slider.owl-carousel .owl-dots button:last-child {
	margin-right: 0;
}

.hero__slider.owl-carousel .owl-nav button {
	font-size: 36px;
	height: 66px;
	width: 66px;
	background: #0b0c2a;
	line-height: 66px;
	text-align: center;
	color: #ffffff;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	position: relative;
	z-index: 1;
	position: absolute;
	left: -33px;
	top: 50%;
	margin-top: -47px;
}

.hero__slider.owl-carousel .owl-nav button.owl-next {
	left: auto;
	right: -33px;
}

.hero__slider.owl-carousel .owl-nav button:after {
	position: absolute;
	top: 6px;
	left: 0;
	right: 0;
	height: 54px;
	width: 54px;
	background: rgba(255, 255, 255, 0.1);
	content: "";
	z-index: -1;
	margin: 0 auto;
}

.hero__slider.owl-carousel .owl-nav button span {
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
	display: block;
	z-index: 1;
}

/*---------------------
  Product
-----------------------*/

.product {
	padding-bottom: 60px;
	padding-top: 80px;
}

.product-page {
	padding-top: 60px;
}

.btn__all {
	text-align: right;
	margin-bottom: 30px;
}

.trending__product {
	margin-bottom: 50px;
}

.popular__product {
	margin-bottom: 50px;
}

.recent__product {
	margin-bottom: 50px;
}

.product__item {
	margin-bottom: 30px;
}

.product__item__pic {
	height: 325px;
	position: relative;
	border-radius: 5px;
}

.product__item__pic .ep {
	font-size: 13px;
	color: #ffffff;
	background: #e53637;
	display: inline-block;
	padding: 2px 12px;
	border-radius: 4px;
	position: absolute;
	left: 10px;
	top: 10px;
}

.product__item__pic .comment {
	font-size: 13px;
	color: #ffffff;
	background: #3d3d3d;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 4px;
	position: absolute;
	left: 10px;
	bottom: 10px;
}

.product__item__pic .view {
	font-size: 13px;
	color: #ffffff;
	background: #3d3d3d;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 4px;
	position: absolute;
	right: 10px;
	bottom: 10px;
}

.product__item__text {
	padding-top: 20px;
}

.product__item__text ul {
	margin-bottom: 10px;
}

.product__item__text ul li {
	list-style: none;
	font-size: 10px;
	color: #ffffff;
	font-weight: 700;
	padding: 1px 10px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 50px;
	display: inline-block;
}

.product__item__text h5 a {
	color: #ffffff;
	font-weight: 700;
	line-height: 26px;
}

.product__sidebar .section-title h5 {
	color: #ffffff;
	font-weight: 600;
	font-family: "Oswald", sans-serif;
	line-height: 21px;
	text-transform: uppercase;
	padding-left: 20px;
	position: relative;
}

.product__sidebar .section-title h5:after {
	position: absolute;
	left: 0;
	top: -6px;
	height: 32px;
	width: 4px;
	background: #e53637;
	content: "";
}

.product__sidebar__view {
	position: relative;
	margin-bottom: 80px;
}

.product__sidebar__view .filter__controls {
	position: absolute;
	right: 0;
	top: -5px;
}

.product__sidebar__view .filter__controls li {
	list-style: none;
	font-size: 13px;
	color: #b7b7b7;
	display: inline-block;
	margin-right: 7px;
	cursor: pointer;
}

.product__sidebar__view .filter__controls li.active {
	color: #ffffff;
}

.product__sidebar__view .filter__controls li:last-child {
	margin-right: 0;
}

.product__sidebar__view__item {
	height: 190px;
	position: relative;
	border-radius: 5px;
	margin-bottom: 20px;
}

.product__sidebar__view__item .ep {
	font-size: 13px;
	color: #ffffff;
	background: #e53637;
	display: inline-block;
	padding: 2px 12px;
	border-radius: 4px;
	position: absolute;
	left: 10px;
	top: 10px;
}

.product__sidebar__view__item .view {
	font-size: 13px;
	color: #ffffff;
	background: #3d3d3d;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 4px;
	position: absolute;
	right: 10px;
	top: 10px;
}

.product__sidebar__view__item h5 {
	position: absolute;
	left: 0;
	bottom: 25px;
	width: 100%;
	padding: 0 30px 0 20px;
}

.product__sidebar__view__item h5 a {
	color: #ffffff;
	font-weight: 700;
	line-height: 26px;
}

.product__sidebar__comment {
	margin-bottom: 35px;
}

.product__sidebar__comment__item {
	margin-bottom: 20px;
	overflow: hidden;
}

.product__sidebar__comment__item__pic {
	float: left;
	margin-right: 15px;
}

.product__sidebar__comment__item__text {
	overflow: hidden;
}

.product__sidebar__comment__item__text ul {
	margin-bottom: 10px;
}

.product__sidebar__comment__item__text ul li {
	list-style: none;
	font-size: 10px;
	color: #ffffff;
	font-weight: 700;
	padding: 1px 10px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 50px;
	display: inline-block;
}

.product__sidebar__comment__item__text h5 {
	margin-bottom: 10px;
}

.product__sidebar__comment__item__text h5 a {
	color: #ffffff;
	font-weight: 700;
	line-height: 26px;
}

.product__sidebar__comment__item__text span {
	display: block;
	font-size: 13px;
	color: #b7b7b7;
}

.product__page__title {
	border-bottom: 2px solid rgba(255, 255, 255, 0.2);
	padding-bottom: 10px;
	margin-bottom: 30px;
}

.product__page__title .section-title {
	margin-bottom: 0;
}

.product__page__title .product__page__filter {
	text-align: right;
}

.product__page__title .product__page__filter p {
	color: #ffffff;
	display: inline-block;
	margin-bottom: 0;
	margin-right: 16px;
}

.product__page__title .product__page__filter .nice-select {
	float: none;
	display: inline-block;
	font-size: 15px;
	color: #3d3d3d;
	font-weight: 700;
	border-radius: 0;
	padding-left: 15px;
	padding-right: 40px;
	height: 32px;
	line-height: 32px;
}

.product__page__title .product__page__filter .nice-select:after {
	border-bottom: 2px solid #111;
	border-right: 2px solid #111;
	height: 8px;
	top: 47%;
	width: 8px;
	right: 15px;
}

.product__page__title .product__page__filter .nice-select .list {
	margin-top: 0;
	border-radius: 0;
}

.product__pagination {
	padding-top: 15px;
}

.product__pagination a {
	display: inline-block;
	font-size: 15px;
	color: #b7b7b7;
	font-weight: 600;
	height: 50px;
	width: 50px;
	border: 1px solid transparent;
	border-radius: 50%;
	line-height: 48px;
	text-align: center;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.product__pagination a:hover {
	color: #ffffff;
}

.product__pagination a.current-page {
	border: 1px solid #ffffff;
}

.product__pagination a i {
	color: #b7b7b7;
	font-size: 15px;
}

/*---------------------
  Anime Details
-----------------------*/

.anime-details {
	padding-top: 60px;
}

.anime__details__content {
	margin-bottom: 65px;
}

.anime__details__text {
	position: relative;
}

.anime__details__text p {
	color: #b7b7b7;
	font-size: 18px;
	line-height: 30px;
}

.anime__details__pic {
	height: 440px;
	border-radius: 5px;
	position: relative;
}

.anime__details__pic .comment {
	font-size: 13px;
	color: #ffffff;
	background: #3d3d3d;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 4px;
	position: absolute;
	left: 10px;
	bottom: 25px;
}

.anime__details__pic .view {
	font-size: 13px;
	color: #ffffff;
	background: #3d3d3d;
	display: inline-block;
	padding: 2px 10px;
	border-radius: 4px;
	position: absolute;
	right: 10px;
	bottom: 25px;
}

.anime__details__title {
	margin-bottom: 20px;
}

.anime__details__title h3 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 13px;
}

.anime__details__title span {
	font-size: 15px;
	color: #b7b7b7;
	display: block;
}

.anime__details__rating {
	text-align: center;
	position: absolute;
	right: 0;
	top: 0;
}

.anime__details__rating .rating i {
	font-size: 24px;
	color: #e89f12;
	display: inline-block;
}

.anime__details__rating span {
	display: block;
	font-size: 18px;
	color: #b7b7b7;
}

.anime__details__widget {
	margin-bottom: 15px;
}

.anime__details__widget ul {
	margin-bottom: 20px;
}

.anime__details__widget ul li {
	list-style: none;
	font-size: 15px;
	color: #ffffff;
	line-height: 30px;
	position: relative;
	padding-left: 18px;
}

.anime__details__widget ul li:before {
	position: absolute;
	left: 0;
	top: 12px;
	height: 6px;
	width: 6px;
	background: #b7b7b7;
	content: "";
}

.anime__details__widget ul li span {
	color: #b7b7b7;
	width: 115px;
	display: inline-block;
}

.anime__details__btn .follow-btn {
	font-size: 13px;
	color: #ffffff;
	background: #e53637;
	display: inline-block;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 14px 20px;
	border-radius: 4px;
	margin-right: 11px;
}

.anime__details__btn .watch-btn span {
	font-size: 13px;
	color: #ffffff;
	background: #e53637;
	display: inline-block;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 14px 20px;
	border-radius: 4px 0 0 4px;
	margin-right: 1px;
}

.anime__details__btn .watch-btn i {
	font-size: 20px;
	display: inline-block;
	background: #e53637;
	padding: 11px 5px 16px 8px;
	color: #ffffff;
	border-radius: 0 4px 4px 0;
}

.anime__details__review {
	margin-bottom: 55px;
}

.anime__review__item {
	overflow: hidden;
	margin-bottom: 15px;
}

.anime__review__item__pic {
	float: left;
	margin-right: 20px;
	position: relative;
}

.anime__review__item__pic:before {
	position: absolute;
	right: -30px;
	top: 15px;
	border-top: 15px solid transparent;
	border-left: 15px solid #1d1e39;
	content: "";
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.anime__review__item__pic img {
	height: 50px;
	width: 50px;
	border-radius: 50%;
}

.anime__review__item__text {
	overflow: hidden;
	background: #1d1e39;
	padding: 18px 30px 16px 20px;
	border-radius: 10px;
}

.anime__review__item__text h6 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 10px;
}

.anime__review__item__text h6 span {
	color: #b7b7b7;
	font-weight: 400;
}

.anime__review__item__text p {
	color: #b7b7b7;
	line-height: 23px;
	margin-bottom: 0;
}

.anime__details__form form textarea {
	width: 100%;
	font-size: 15px;
	color: #b7b7b7;
	padding-left: 20px;
	padding-top: 12px;
	height: 110px;
	border: none;
	border-radius: 5px;
	resize: none;
	margin-bottom: 24px;
}

.anime__details__form form button {
	font-size: 11px;
	color: #ffffff;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	background: #e53637;
	border: none;
	padding: 10px 15px;
	border-radius: 2px;
}

/*---------------------
  Anime Watching
-----------------------*/

.anime__video__player {
	margin-bottom: 70px;
}

.anime__video__player .plyr--video {
	border-radius: 5px;
	background: transparent;
}

.anime__video__player .plyr audio,
.anime__video__player .plyr iframe,
.anime__video__player .plyr video {
	width: 102%;
}

.anime__video__player .plyr--full-ui.plyr--video .plyr__control--overlaid {
	display: block;
}

.anime__video__player .plyr--video .plyr__control.plyr__tab-focus,
.anime__video__player .plyr--video .plyr__control:hover,
.anime__video__player .plyr--video .plyr__control[aria-expanded=true] {
	background: transparent;
}

.anime__video__player .plyr--video .plyr__controls {
	background: transparent;
}

.anime__video__player .plyr--video .plyr__progress__buffer {
	color: transparent;
}

.anime__video__player .plyr--full-ui input[type=range] {
	color: #ffffff;
}

.anime__video__player .plyr__controls .plyr__controls__item.plyr__progress__container {
	position: absolute;
	left: 26px;
	bottom: 45px;
	width: calc(100% - 60px);
}

.anime__video__player .plyr__menu {
	margin-right: 70px;
}

.anime__video__player .plyr__controls .plyr__controls__item:first-child {
	position: absolute;
	left: 32px;
	bottom: 8px;
}

.anime__video__player .plyr__controls .plyr__controls__item:last-child {
	position: absolute;
	right: 32px;
	bottom: 8px;
}

.anime__video__player .plyr__volume {
	position: absolute;
	width: auto;
	left: 76px;
	bottom: 8px;
}

.anime__video__player .plyr__controls .plyr__controls__item.plyr__time {
	position: absolute;
	left: 106px;
	bottom: 12px;
}

.anime__video__player .plyr__control--overlaid {
	background: transparent;
	background: var(--plyr-video-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, transparent)));
}

.anime__video__player .plyr__control--overlaid svg {
	height: 60px;
	width: 50px;
}

.anime__details__episodes {
	margin-bottom: 35px;
}

.anime__details__episodes a {
	display: inline-block;
	font-size: 15px;
	color: #ffffff;
	background: rgba(255, 255, 255, 0.2);
	padding: 10px 20px;
	border-radius: 4px;
	margin-right: 15px;
	margin-bottom: 20px;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.anime__details__episodes a:hover {
	color: #000000;
	background: #ffffff;
}

/*---------------------
  Breadcrumb
-----------------------*/

.breadcrumb-option {
	padding-top: 35px;
}

.breadcrumb__links a {
	font-size: 15px;
	color: #ffffff;
	margin-right: 18px;
	display: inline-block;
	position: relative;
}

.breadcrumb__links a i {
	margin-right: 5px;
	color: #e53637;
}

.breadcrumb__links a:after {
	position: absolute;
	right: -14px;
	top: 0;
	content: "";
	font-family: "FontAwesome";
}

.breadcrumb__links span {
	font-size: 15px;
	color: #b7b7b7;
	display: inline-block;
}

/*---------------------
    Normal Breadcrumb
-----------------------*/

.normal-breadcrumb {
	height: 320px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.normal__breadcrumb__text h1 {
  color: #ffffff;
  font-size: 45px;
  font-family: "Oswald", sans-serif;
  font-weight: 700;
  margin-bottom: 22px;
  padding: 10px 30px;
  background: rgba(11, 12, 42, 0.041); 
  border-radius: 15px;
  box-shadow:
    0 0 10px rgba(255, 238, 0, 0.575),
    0 0 20px rgba(255, 217, 0, 0.589);
  animation: glowBox 3s ease-in-out infinite alternate;
  text-align: center;
  backdrop-filter: blur(6px);
  position: relative;
  z-index: 1;
}

@keyframes glowBox {
  0% {
    box-shadow:
      0 0 10px rgba(229, 255, 0, 0.2),
      0 0 20px rgba(255, 230, 0, 0.637);
    transform: scale(1);
  }
  100% {
    box-shadow:
      0 0 15px rgba(0, 255, 255, 0.4),
      0 0 30px rgba(0, 255, 255, 0.35);
    transform: scale(1.02);
  }
}


.normal__breadcrumb__text p {
	color: #ffffff;
	font-size: 24px;
	margin-bottom: 0;
}

/*---------------------
    Blog
-----------------------*/

.blog {
	padding-top: 70px;
	padding-bottom: 90px;
}

.blog__item {
	height: 580px;
	position: relative;
	margin-left: -10px;
	margin-right: -10px;
	margin-bottom: 10px;
}

.blog__item.small__item {
	height: 285px;
}

.blog__item.small__item .blog__item__text {
	padding: 0 30px;
}

.blog__item.small__item .blog__item__text p {
	margin-bottom: 5px;
}

.blog__item.small__item .blog__item__text h4 a {
	font-size: 20px;
	line-height: 30px;
}

.blog__item__text {
	position: absolute;
	left: 0;
	bottom: 25px;
	text-align: center;
	width: 100%;
	padding: 0 105px;
}

.blog__item__text p {
	color: #ffffff;
	margin-bottom: 12px;
}

.blog__item__text p span {
	color: #e53637;
	margin-right: 5px;
}

.blog__item__text h4 a {
	color: #ffffff;
	line-height: 34px;
}

/*---------------------
  Blog Details
-----------------------*/

.blog-details {
	padding-top: 70px;
}

.blog__details__title {
	text-align: center;
	margin-bottom: 70px;
}

.blog__details__title h6 {
	font-size: 15px;
	color: #ffffff;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 30px;
}

.blog__details__title h6 span {
	color: #b7b7b7;
	font-weight: 400;
	text-transform: none;
}

.blog__details__title h2 {
	color: #ffffff;
	font-size: 48px;
	font-weight: 700;
	line-height: 60px;
	margin-bottom: 38px;
}

.blog__details__title .blog__details__social a {
	display: inline-block;
	font-size: 15px;
	color: #ffffff;
	padding: 16px 35px 14px 20px;
	border-radius: 2px;
	margin-right: 6px;
}

.blog__details__title .blog__details__social a:last-child {
	margin-right: 0;
}

.blog__details__title .blog__details__social a.facebook {
	background: #3b5998;
}

.blog__details__title .blog__details__social a.pinterest {
	background: #ca2027;
}

.blog__details__title .blog__details__social a.linkedin {
	background: #0372b1;
}

.blog__details__title .blog__details__social a.twitter {
	background: #39a1f2;
}

.blog__details__title .blog__details__social a i {
	margin-right: 6px;
}

.blog__details__pic {
	margin-bottom: 30px;
}

.blog__details__pic img {
	min-width: 100%;
}

.blog__details__text {
	margin-bottom: 40px;
}

.blog__details__text p {
	color: #ffffff;
	font-size: 17px;
	line-height: 30px;
}

.blog__details__item__text {
	margin-bottom: 42px;
}

.blog__details__item__text h4 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 35px;
}

.blog__details__item__text img {
	min-width: 100%;
	margin-bottom: 26px;
}

.blog__details__item__text p {
	color: #ffffff;
	font-size: 17px;
	line-height: 30px;
	margin-bottom: 0;
}

.blog__details__tags {
	margin-bottom: 60px;
}

.blog__details__tags a {
	display: inline-block;
	color: #b7b7b7;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	background: rgba(255, 255, 255, 0.1);
	border-radius: 2px;
	margin-right: 6px;
	padding: 6px 15px;
	margin-bottom: 10px;
}

.blog__details__tags a:last-child {
	margin-right: 0;
}

.blog__details__btns {
	border-top: 1px solid rgba(255, 255, 255, 0.2);
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	padding: 20px 0 15px;
	margin-bottom: 65px;
}

.blog__details__btns__item {
	margin-bottom: 20px;
}

.blog__details__btns__item.next__btn {
	text-align: right;
}

.blog__details__btns__item h5 a {
	font-size: 17px;
	letter-spacing: 2px;
	color: #ffffff;
}

.blog__details__btns__item h5 a span {
	font-size: 30px;
	color: #b7b7b7;
	position: relative;
	top: 8px;
}

.blog__details__comment {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	padding-bottom: 30px;
}

.blog__details__comment h4 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 26px;
}

.blog__details__comment__item {
	margin-bottom: 40px;
	overflow: hidden;
}

.blog__details__comment__item.blog__details__comment__item--reply {
	padding-left: 112px;
}

.blog__details__comment__item__pic {
	float: left;
	margin-right: 40px;
}

.blog__details__comment__item__text {
	overflow: hidden;
}

.blog__details__comment__item__text span {
	font-size: 14px;
	color: #b7b7b7;
	display: block;
	margin-bottom: 10px;
}

.blog__details__comment__item__text h5 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 10px;
}

.blog__details__comment__item__text p {
	color: #b7b7b7;
	font-size: 14px;
	line-height: 22px;
	margin-bottom: 25px;
}

.blog__details__comment__item__text a {
	display: inline-block;
	color: #ffffff;
	background: rgba(255, 255, 255, 0.1);
	padding: 6px 20px;
	letter-spacing: 2px;
	border-radius: 2px;
	margin-right: 14px;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.blog__details__comment__item__text a:hover {
	background: #e53637;
}

.blog__details__form {
	padding-top: 50px;
}

.blog__details__form h4 {
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 26px;
}

.blog__details__form form input {
	height: 50px;
	width: 100%;
	background: #ffffff;
	font-size: 15px;
	color: #a6a6a6;
	padding-left: 20px;
	border-radius: 2px;
	border: none;
	margin-bottom: 30px;
}

.blog__details__form form input::-webkit-input-placeholder {
	color: #a6a6a6;
}

.blog__details__form form input::-moz-placeholder {
	color: #a6a6a6;
}

.blog__details__form form input:-ms-input-placeholder {
	color: #a6a6a6;
}

.blog__details__form form input::-ms-input-placeholder {
	color: #a6a6a6;
}

.blog__details__form form input::placeholder {
	color: #a6a6a6;
}

.blog__details__form form textarea {
	height: 115px;
	width: 100%;
	background: #ffffff;
	font-size: 15px;
	color: #a6a6a6;
	padding-left: 20px;
	border-radius: 2px;
	padding-top: 12px;
	resize: none;
	border: none;
	margin-bottom: 34px;
}

.blog__details__form form textarea::-webkit-input-placeholder {
	color: #a6a6a6;
}

.blog__details__form form textarea::-moz-placeholder {
	color: #a6a6a6;
}

.blog__details__form form textarea:-ms-input-placeholder {
	color: #a6a6a6;
}

.blog__details__form form textarea::-ms-input-placeholder {
	color: #a6a6a6;
}

.blog__details__form form textarea::placeholder {
	color: #a6a6a6;
}

/*---------------------
  Login
-----------------------*/

.login {
	padding-top: 130px;
	padding-bottom: 120px;
}

.login__form {
	position: relative;
	padding-left: 145px;
}

.login__form:after {
	position: absolute;
	right: -14px;
	top: -40px;
	height: 330px;
	width: 1px;
	background: rgba(255, 255, 255, 0.2);
	content: "";
}

.login__form h3 {
	color: #ffffff;
	font-weight: 700;
	font-family: "Oswald", sans-serif;
	margin-bottom: 30px;
}

.login__form form .input__item {
	position: relative;
	width: 370px;
	margin-bottom: 20px;
}

.login__form form .input__item:before {
	position: absolute;
	left: 50px;
	top: 10px;
	height: 30px;
	width: 1px;
	background: #b7b7b7;
	content: "";
}

.login__form form .input__item input {
	height: 50px;
	width: 100%;
	font-size: 15px;
	color: #b7b7b7;
	background: #ffffff;
	border: none;
	padding-left: 76px;
}

.login__form form .input__item input::-webkit-input-placeholder {
	color: #b7b7b7;
}

.login__form form .input__item input::-moz-placeholder {
	color: #b7b7b7;
}

.login__form form .input__item input:-ms-input-placeholder {
	color: #b7b7b7;
}

.login__form form .input__item input::-ms-input-placeholder {
	color: #b7b7b7;
}

.login__form form .input__item input::placeholder {
	color: #b7b7b7;
}

.login__form form .input__item span {
	color: #b7b7b7;
	font-size: 20px;
	position: absolute;
	left: 15px;
	top: 13px;
}

.login__form form button {
	border-radius: 0;
	margin-top: 10px;
}

.login__form .forget_pass {
	font-size: 15px;
	color: #ffffff;
	display: inline-block;
	position: absolute;
	right: 60px;
	bottom: 12px;
}

.login__register {
	padding-left: 30px;
}

.login__register h3 {
	color: #ffffff;
	font-weight: 700;
	font-family: "Oswald", sans-serif;
	margin-bottom: 30px;
}

.login__register .primary-btn {
	background: #e53637;
	padding: 12px 42px;
}

.login__social {
	padding-top: 52px;
}

.login__social__links {
	text-align: center;
}

.login__social__links span {
	color: #ffffff;
	display: block;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 30px;
}

.login__social__links ul li {
	list-style: none;
	margin-bottom: 15px;
}

.login__social__links ul li:last-child {
	margin-bottom: 0;
}

.login__social__links ul li a {
	color: #ffffff;
	display: block;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	width: 460px;
	padding: 14px 0;
	position: relative;
	margin: 0 auto;
}

.login__social__links ul li a.facebook {
	background: #4267b2;
}

.login__social__links ul li a.google {
	background: #ff4343;
}

.login__social__links ul li a.twitter {
	background: #1da1f2;
}

.login__social__links ul li a i {
	font-size: 20px;
	position: absolute;
	left: 32px;
	top: 14px;
}

/*---------------------
  Sign Up
-----------------------*/

.signup {
	padding-top: 130px;
	padding-bottom: 150px;
}

.signup .login__form:after {
	height: 450px;
}

.signup .login__form h5 {
	font-size: 15px;
	color: #ffffff;
	margin-top: 36px;
}

.signup .login__form h5 a {
	color: #e53637;
	font-weight: 700;
}

.signup .login__social__links {
	text-align: left;
	padding-left: 40px;
}

.signup .login__social__links h3 {
	color: #ffffff;
	font-weight: 700;
	font-family: "Oswald", sans-serif;
	margin-bottom: 30px;
}

.signup .login__social__links ul li a {
	margin: 0;
	text-align: center;
}

/*---------------------
  Footer
-----------------------*/

.footer {
	background: #070720;
	padding-top: 60px;
	padding-bottom: 40px;
	position: relative;
}

.page-up {
	position: absolute;
	left: 50%;
	top: -25px;
	margin-left: -25px;
}

.page-up a {
	display: inline-block;
	font-size: 36px;
	color: #ffffff;
	height: 50px;
	width: 50px;
	background: #e53637;
	line-height: 50px;
	text-align: center;
	border-radius: 50%;
}

.page-up a span {
	position: relative;
	top: 2px;
	left: -1px;
}

.footer__nav {
	text-align: center;
}

.footer__nav ul li {
	list-style: none;
	display: inline-block;
	position: relative;
	margin-right: 40px;
}

.footer__nav ul li:last-child {
	margin-right: 0;
}

.footer__nav ul li a {
	font-size: 15px;
	color: #b7b7b7;
	display: block;
	font-weight: 700;
}

.footer__copyright__text {
	color: #b7b7b7;
	margin-bottom: 0;
	text-align: right;
}

.footer__copyright__text a {
	color: #e53637;
}

/*--------------------------------- Responsive Media Quaries -----------------------------*/

@media only screen and (min-width: 1200px) and (max-width: 1300px) {
	.hero {
		overflow: hidden;
	}
}

@media only screen and (min-width: 1200px) {
	.container {
		max-width: 1170px;
	}
}

/* Medium Device = 1200px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.hero {
		overflow: hidden;
	}
	.login__form {
		position: relative;
		padding-left: 32px;
	}
	.login__social__links ul li a {
		width: 380px;
	}
	.blog__item__text {
		padding: 0 50px;
	}
}

/* Tablet Device = 768px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.hero {
		overflow: hidden;
	}
	.header {
		position: relative;
	}
	.header .container {
		position: relative;
	}
	.header__right {
		position: absolute;
		right: 120px;
		top: -42px;
		padding: 0;
	}
	.header__menu {
		display: none;
	}
	.slicknav_menu {
		background: transparent;
		padding: 0;
		display: block;
	}
	.slicknav_nav {
		position: absolute;
		left: 0;
		top: 60px;
		width: 100%;
		background: #ffffff;
		padding: 15px 30px;
		z-index: 9;
	}
	.slicknav_nav ul {
		margin: 0;
	}
	.slicknav_nav .slicknav_row,
	.slicknav_nav a {
		padding: 7px 0;
		margin: 0;
		color: #111111;
		font-weight: 600;
	}
	.slicknav_btn {
		border-radius: 0;
		background-color: #222;
		position: absolute;
		right: 0;
		top: 9px;
	}
	.slicknav_nav .slicknav_arrow {
		color: #111111;
	}
	.slicknav_nav .slicknav_row:hover {
		border-radius: 0;
		background: transparent;
		color: #111111;
	}
	.slicknav_nav a:hover {
		border-radius: 0;
		background: transparent;
		color: #111111;
	}
	.product__sidebar {
		padding-top: 50px;
	}
	.footer__logo {
		text-align: center;
		margin-bottom: 20px;
	}
	.footer__nav {
		margin-bottom: 15px;
	}
	.footer__copyright__text {
		text-align: center;
	}
	.anime__details__widget ul li span {
		width: 90px;
	}
	.anime__details__pic {
		margin-bottom: 40px;
	}
	.anime__details__sidebar {
		padding-top: 50px;
	}
	.login__form {
		padding-left: 0;
		margin-bottom: 40px;
	}
	.login__form:after {
		display: none;
	}
	.login__form form .input__item {
		width: auto;
	}
	.login__register {
		padding-left: 0;
	}
	.signup .login__social__links {
		padding-left: 0;
	}
}

/* Wide Mobile = 480px */

@media only screen and (max-width: 767px) {
	.hero {
		overflow: hidden;
	}
	.header {
		position: relative;
	}
	.header .container {
		position: relative;
	}
	.header__right {
		position: absolute;
		right: 120px;
		top: -42px;
		padding: 0;
	}
	.header__menu {
		display: none;
	}
	.slicknav_menu {
		background: transparent;
		padding: 0;
		display: block;
	}
	.slicknav_nav {
		position: absolute;
		left: 0;
		top: 60px;
		width: 100%;
		background: #ffffff;
		padding: 15px 30px;
		z-index: 9;
	}
	.slicknav_nav ul {
		margin: 0;
	}
	.slicknav_nav .slicknav_row,
	.slicknav_nav a {
		padding: 7px 0;
		margin: 0;
		color: #111111;
		font-weight: 600;
	}
	.slicknav_btn {
		border-radius: 0;
		background-color: #222;
		position: absolute;
		right: 0;
		top: 9px;
	}
	.slicknav_nav .slicknav_arrow {
		color: #111111;
	}
	.slicknav_nav .slicknav_row:hover {
		border-radius: 0;
		background: transparent;
		color: #111111;
	}
	.slicknav_nav a:hover {
		border-radius: 0;
		background: transparent;
		color: #111111;
	}
	.product__sidebar {
		padding-top: 50px;
	}
	.footer__logo {
		text-align: center;
		margin-bottom: 20px;
	}
	.footer__nav {
		margin-bottom: 15px;
	}
	.footer__copyright__text {
		text-align: center;
	}
	.blog__details__title h2 {
		font-size: 34px;
		line-height: normal;
	}
	.anime__details__pic {
		margin-bottom: 40px;
	}
	.anime__details__sidebar {
		padding-top: 50px;
	}
	.btn__all {
		text-align: left;
	}
	.product__page__title .section-title {
		margin-bottom: 30px;
	}
	.product__page__title .product__page__filter {
		text-align: left;
	}
	.anime__details__rating {
		text-align: left;
		position: relative;
		margin-bottom: 20px;
	}
	.blog__details__social {
		overflow: hidden;
	}
	.blog__details__title .blog__details__social a {
		margin-right: 10px;
		margin-bottom: 10px;
		width: calc(50% - 10px);
		float: left;
	}
	.login__form {
		padding-left: 0;
		margin-bottom: 40px;
	}
	.login__form:after {
		display: none;
	}
	.login__form form .input__item {
		width: auto;
	}
	.signup .login__social__links {
		padding-left: 0;
	}
	.login__social__links ul li a {
		width: auto;
	}
	.blog__item__text {
		padding: 0 30px;
	}
	.login__register {
		padding-left: 0;
	}
	.product__sidebar__view .filter__controls li {
		margin-right: 2px;
	}
	.search-model-form input {
		width: 100%;
	}
}

/* Small Device = 320px */

@media only screen and (max-width: 479px) {
	.hero__slider.owl-carousel .owl-nav {
		display: none;
	}
	.hero__items {
		padding: 250px 0 42px 15px;
	}
	.hero__text h2 {
		font-size: 32px;
	}
	.footer__nav ul li {
		margin-right: 10px;
	}
	.anime__details__btn .follow-btn {
		padding: 14px 26px;
		margin-right: 11px;
		margin-bottom: 25px;
	}
	.anime__details__widget ul li span {
		width: 85px;
	}
	.anime__video__player .plyr__volume {
		left: 65px;
	}
	.anime__video__player .plyr__controls .plyr__controls__item.plyr__time {
		left: 95px;
	}
	.anime__video__player .plyr__menu {
		margin-right: 60px;
	}
	.blog__details__title h2 {
		font-size: 30px;
		line-height: normal;
	}
	.blog__details__title .blog__details__social a {
		padding: 16px 25px 14px 20px;
	}
	.blog__details__comment__item.blog__details__comment__item--reply {
		padding-left: 0;
	}
	.blog__details__comment__item__pic {
		margin-right: 25px;
	}
	.blog__details__comment__item__text a {
		margin-right: 6px;
	}
	.login__social__links ul li a i {
		left: 20px;
	}
	.login__form .forget_pass {
		position: relative;
		left: 0;
		bottom: 0;
		margin-top: 25px;
	}
	.header__right a {
		margin-right: 10px;
	}
	.anime__review__item__text h6 span {
		font-size: 12px;
	}
	.anime__review__item__text {
		padding: 18px 20px 20px;
	}
}

/*custom-section*/

.custom-section {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.242));
  padding: 60px 15px;
  border-radius: 20px;
  color: #ffffff;
  box-shadow: 
    0 0 10px rgba(255, 255, 255, 0.1),
    0 0 20px rgba(0, 255, 255, 0.527),
    0 0 40px rgba(0, 255, 255, 0.42);
}

.custom-section h2,
.custom-section h3 {
  font-weight: 700;
  color: #ffcc00;
  margin-bottom: 20px;
  animation: glowText 3s ease-in-out infinite alternate;
  text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
}

@keyframes glowText {
  0% {
    text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
    transform: scale(1);
  }
  100% {
    text-shadow: 0 0 4px #ffcc00, 0 0 6px #ff9900;
    transform: scale(1.01);
  }
}

.custom-section h3 {
  font-size: 1.5rem;
}

.custom-section p {
  line-height: 1.8;
  background: rgba(255, 255, 255, 0.1);
  padding: 10px 15px;
  border-radius: 15px;
  margin-bottom: 20px;
}

.custom-section img {
  max-width: 100%;
  border-radius: 15px;
  margin-bottom: 20px;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}







.newsletter-sidebar {
    background-color: #0B0C2A;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 15px #1a1a40;
    animation: pulseBox 5s ease-in-out infinite;
}

.newsletter-sidebar h3 {
    font-weight: 700;
    color: #ffcc00;
    margin-bottom: 20px;
    animation: glowText 3s ease-in-out infinite alternate;
    text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
}

.newsletter-sidebar input[type="email"] {
    width: 100%;
    padding: 10px;
    border: none;
    border-radius: 5px;
    margin-bottom: 10px;
    font-size: 16px;
    background-color: #1a1a2e;
    color: #fff;
    box-shadow: inset 0 0 5px #000;
}

.newsletter-sidebar button {
    width: 100%;
    padding: 10px;
    border: none;
    border-radius: 5px;
    background-color: #333;
    color: #999;
    font-weight: bold;
    cursor: not-allowed;
    opacity: 0.6;
    box-shadow: 0 0 10px #000;
}


@keyframes glowText {
    0% {
        text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
    }
    100% {
        text-shadow: 0 0 10px #ffcc00, 0 0 20px #ff9900;
    }
}

@keyframes pulseBox {
    0% {
        box-shadow: 0 0 15px #1a1a40;
    }
    50% {
        box-shadow: 0 0 25px #ff9900;
    }
    100% {
        box-shadow: 0 0 15px #1a1a40;
    }
}



.styled-section {
  background: linear-gradient(135deg, #0f0f1c, #1c1c3a);
  padding: 30px 20px;
  border-radius: 20px;
  box-shadow: 0 0 20px rgba(0, 255, 255, 0.1), 0 0 40px rgba(0, 255, 255, 0.05);
  color: #fff;
  position: relative;
  overflow: hidden;
  animation: sectionGlow 10s ease-in-out infinite;
}

.styled-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at center, rgba(0, 255, 255, 0.1), transparent 70%);
  animation: floatingGlow 20s linear infinite;
  z-index: 0;
  opacity: 0.6;
}

.styled-section h2,
.styled-section h3 {
  position: relative;
  z-index: 1;
  color: #00ffff;
  font-weight: 700;
  margin-bottom: 20px;
  text-shadow: 0 0 5px #00ffff, 0 0 10px #0088ff;
  animation: neonPulse 3s ease-in-out infinite alternate;
}

.styled-section h2 {
  font-size: 2rem;
}

.styled-section h3 {
  font-size: 1.5rem;
}

/* Keyframes */
@keyframes neonPulse {
  0% {
    text-shadow: 0 0 5px #00ffff, 0 0 10px #0088ff;
    transform: scale(1);
  }
  100% {
    text-shadow: 0 0 10px #00ffff, 0 0 20px #0088ff;
    transform: scale(1.02);
  }
}

@keyframes floatingGlow {
  0% {
    transform: scale(1) rotate(0deg);
  }
  100% {
    transform: scale(1.05) rotate(360deg);
  }
}

@keyframes sectionGlow {
  0% {
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.1), 0 0 40px rgba(0, 255, 255, 0.05);
  }
  50% {
    box-shadow: 0 0 30px rgba(0, 255, 255, 0.3), 0 0 60px rgba(0, 255, 255, 0.1);
  }
  100% {
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.1), 0 0 40px rgba(0, 255, 255, 0.05);
  }
}






.sectn {
  background: linear-gradient(135deg, #140f1f, #1c102e);
  padding: 30px 20px;
  border-radius: 20px;
  color: #ffffff;
  box-shadow: 0 0 25px rgba(0, 255, 255, 0.614), 0 0 60px rgba(137, 43, 226, 0.514);
  position: relative;
  overflow: hidden;
  animation: glowSection 8s ease-in-out infinite;
}

.sectn h2,
.sectn h3 {
  color: #00eaff;
  font-weight: 700;
  margin-bottom: 20px;
  text-shadow: 0 0 5px #00eaff, 0 0 15px #00aaff;
  position: relative;
  z-index: 1;
}

.sectn p {
  margin-bottom: 30px;
  line-height: 1.7;
  position: relative;
  z-index: 1;
}

.list-pros li,
.list-cons li {
  position: relative;
  padding-left: 34px;
  margin-bottom: 12px;
  list-style: none;
  line-height: 1.6;
  font-size: 1rem;
}

.list-pros li::before,
.list-cons li::before {
  position: absolute;
  top: 2px;
  left: 0;
  font-size: 1.2rem;
  display: inline-block;
  font-family: "Bootstrap-icons";
}

.list-pros li::before {
  content: "\f26e"; 
  color: #32ff7e; 
}

.list-cons li::before {
  content: "\f623"; 
  color: #ff4c61; 
}

@keyframes glowSection {
  0%, 100% {
    box-shadow: 0 0 25px rgba(0, 255, 255, 0.1), 0 0 60px rgba(138, 43, 226, 0.15);
  }
  50% {
    box-shadow: 0 0 40px rgba(0, 255, 255, 0.25), 0 0 80px rgba(138, 43, 226, 0.2);
  }
}




.styled-list li {
  position: relative;
  padding: 10px 10px 10px 36px;
  margin-bottom: 14px;
  list-style: none;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.242));
  border-radius: 20px;
  color: #ffffff;
  box-shadow:
    0 0 10px rgba(255, 255, 255, 0.1),
    0 0 20px rgba(255, 204, 0, 0.468),
    0 0 40px rgba(255, 204, 0, 0.15);
  transition: background 0.3s, transform 0.3s;
}


.styled-list li::before {
  content: "🎮";
  margin-right: 8px;
  top: 10px;
  left: 10px;
  font-size: 1.2rem;
  transform: scale(1.1);
  animation: pulseEmoji 2s infinite ease-in-out;
}

.styled-list li:hover {
  background: rgba(255, 204, 0, 0.08);
  transform: translateY(-2px);
  box-shadow: 0 0 15px rgba(255, 204, 0, 0.2);
}

/* Emoji pulsing animation */
@keyframes pulseEmoji {
  0%, 100% {
    transform: scale(1.1);
    opacity: 1;
  }
  50% {
    transform: scale(1.3);
    opacity: 0.7;
  }
}



.featuree {
  background: url("/img/game-bg.jpg");
  background-position: center 94px;
  display: block;
  position: relative;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 70px 30px;
  background-color: rgba(0, 0, 0, 0.7);
  border-top: 5px solid #FFCC00;
  border-bottom: 5px solid #00EAFF;
  box-shadow: 0 0 20px rgba(255, 204, 0, 0.2), 0 0 40px rgba(255, 204, 0, 0.1);
}

.featuree::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom right, rgba(11, 12, 42, 0), rgba(0, 0, 0, 0));
  z-index: 0;
}

.featuree h2 {
  margin-bottom: 30px;
  color: #FFCC00;
  text-shadow: 0 0 5px rgba(255, 204, 0, 0.7), 0 0 10px rgba(255, 153, 0, 0.5);
  font-weight: 700;
  position: relative;
  z-index: 1;
  animation: glowHeading 3s ease-in-out infinite alternate;
}

.featuree h3 {
  margin-bottom: 10px;
  color: #00EAFF;
  font-weight: 600;
  position: relative;
  z-index: 1;
  text-shadow: 0 0 4px rgba(105, 113, 255, 0.6);
}

.featuree p {
  color: #ffffff;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
  line-height: 1.7;
}

.featuree ul {
  padding-left: 0;
  position: relative;
  z-index: 1;
}

.featuree ul li {
  color: #FFEEA9;
  margin-bottom: 15px;
  list-style-type: none;
  font-size: 1.1rem;
  padding-left: 36px;
  position: relative;
}

.featuree ul li::before {
  content: "🎮";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1.2rem;
  color: #FFCC00;
  filter: drop-shadow(0 0 3px #ffcc00);
}

@keyframes glowHeading {
  0% {
    text-shadow: 0 0 5px #FFCC00, 0 0 10px #FF9900;
    transform: scale(1);
  }
  100% {
    text-shadow: 0 0 10px #FFCC00, 0 0 20px #FF9900;
    transform: scale(1.02);
  }
}

@media (max-width: 768px) {
  .featuree {
    padding: 70px 20px;
  }
}



@media (max-width: 768px) {
  h1{
    font-size: 28px!important;
  }
  h2{
    font-size: 26px!important;
  }
  h3{
    font-size: 24px!important;
  }
}






.reviews-section {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.24));
  padding: 30px 15px;
  border-radius: 20px;
  color: #ffffff;
  box-shadow: 
    0 0 10px rgba(255, 255, 255, 0.1),
    0 0 20px rgba(0, 255, 255, 0.4),
    0 0 40px rgba(0, 255, 255, 0.35);
}

.reviews-section .section-title {
  font-weight: 700;
  color: #ffcc00;
  margin-bottom: 40px;
  text-align: center;
  animation: glowText 3s ease-in-out infinite alternate;
  text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
}

.review-card {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.review-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 30px rgba(0, 255, 255, 0.3);
}

.review-img {
  border-radius: 15px 15px 0 0;
  object-fit: cover;
  width: 100%;
  height: auto;
}

.review-content {
  padding: 20px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.review-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #ffcc00;
  margin-bottom: 10px;
  animation: glowText 3s ease-in-out infinite alternate;
  text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
}

.review-title a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}

.review-title a:hover {
  color: #ffffff;
  text-decoration: underline;
}

.review-text {
  color: #e0e0e0;
  background: rgba(255, 255, 255, 0.08);
  padding: 10px 15px;
  border-radius: 15px;
  line-height: 1.8;
  font-size: 1rem;
}

@keyframes glowText {
  0% {
    text-shadow: 0 0 2px #ffcc00, 0 0 4px #ff9900;
    transform: scale(1);
  }
  100% {
    text-shadow: 0 0 4px #ffcc00, 0 0 6px #ff9900;
    transform: scale(1.01);
  }
}







.sidebarLinking h3 {
  position: relative;
  z-index: 1;
  color: #00ffff;
  font-weight: 700;
  margin-bottom: 20px;
  font-size: 24px;
  text-shadow: 0 0 5px #00ffff, 0 0 10px #0088ff;
  animation: neonPulse 3s ease-in-out infinite alternate;
  text-align: center;
  padding: 10px 15px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(11, 12, 42, 0.9), rgba(0, 255, 255, 0.1));
  box-shadow: 0 0 15px rgba(0, 255, 255, 0.3);
  animation: neonPulse 3s ease-in-out infinite alternate,
             sectionGlow 6s ease-in-out infinite;
}

@keyframes neonPulse {
  0% {
    text-shadow: 0 0 5px #00ffff, 0 0 10px #0088ff;
    transform: scale(1);
  }
  100% {
    text-shadow: 0 0 10px #00ffff, 0 0 20px #0088ff;
    transform: scale(1.02);
  }
}

@keyframes sectionGlow {
  0% {
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.1), 0 0 40px rgba(0, 255, 255, 0.05);
  }
  50% {
    box-shadow: 0 0 30px rgba(0, 255, 255, 0.3), 0 0 60px rgba(0, 255, 255, 0.1);
  }
  100% {
    box-shadow: 0 0 20px rgba(0, 255, 255, 0.1), 0 0 40px rgba(0, 255, 255, 0.05);
  }
}





.sidebarLinking p a {
  display: inline-block;
  color: #00ffe7;
  font-weight: 600;
  text-decoration: none;
  padding: 8px 20px;
  margin-bottom: 10px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(11, 12, 42, 0.8), rgba(0, 255, 255, 0.1));
  box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
  position: relative;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  animation: pulseGlow 4s ease-in-out infinite;
}

.sidebarLinking p a::before {
  content: "🎮 ";
  margin-right: 8px;
}

.sidebarLinking p a:hover {
  transform: scale(1.05);
  box-shadow: 0 0 15px rgba(255, 255, 0, 0.6), 0 0 25px rgba(0, 255, 255, 0.6);
  background: linear-gradient(135deg, rgba(0, 255, 204, 0.25), rgba(255, 255, 0, 0.2));
}


@keyframes pulseGlow {
  0% {
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
  }
  50% {
    box-shadow: 0 0 20px rgba(255, 255, 0, 0.5);
  }
  100% {
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
  }
}

.review-btn {
  background: linear-gradient(135deg, #ffcc00, #ff9900);
  color: #fff;
  border: none;
  padding: 12px 24px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 30px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.review-btn:hover {
  background: linear-gradient(135deg, #ffaa00, #ff6600);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
  transform: scale(1.05);
}


.page-error {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 85vh;
  text-align: center;
}

.error-heading {
  margin-bottom: 1rem;
}

.error-text {
  margin-bottom: 2rem;
}

.error-link {
  padding: 0.75rem 1.5rem;
  background-color: #e62323;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s ease;
}

.error-link:hover {
  background-color: #bb0000;
  color: #fff;
}




@keyframes pulse-glow {
  0% {
    box-shadow: 0 0 20px rgba(255, 204, 0, 0.6);
  }
  50% {
    box-shadow: 0 0 35px rgba(255, 204, 0, 0.9);
  }
  100% {
    box-shadow: 0 0 20px rgba(255, 204, 0, 0.6);
  }
}

.video-container {
    box-shadow: 0 0 35px rgba(255, 204, 0, 0.842);
    position: relative;
    padding-bottom: 56.25%;    
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    border-radius: 20px;
    animation: pulse-glow 3s ease-in-out infinite;
}


.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



@media (max-width: 450px) {
  .col-xl-6.col-lg-6.col-md-12.mb-4 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}