@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700");

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
}

*,
:after,
:before {
	box-sizing: inherit;
}

body,
html {
	width: 100%;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

body {
	line-height: 1;
	font-size: 14px;
	font-weight: 400;
	display: flex;
	max-width: 1600px;
	height: auto;
	margin: auto !important;
	color: #fff;
	background: -webkit-linear-gradient(to left, #012d53, #000428);
	background: linear-gradient(to right, #012d53, #000428);
}

body,
input,
textarea {
	font-family: sans-serif;
}

h1,
h2,
h3,
h4,
p {
	line-height: 1.5em;
}

blockquote,
q {
	quotes: none;
}

blockquote:after,
blockquote:before,
q:after,
q:before {
	content: "";
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

html {
	height: 100%;
	background: #000428;
	background: -webkit-linear-gradient(to right, #012d53, #000428);
	background: linear-gradient(to right, #012d53, #000428);
	box-sizing: border-box;
}

body.overview {
	background-size: cover;
}

body .sidebar,
body.overview #main {
	background: 0 0;
}

body .sidebar,
body .sidebar * {
	-webkit-transform: none;
}

body .sidebar {
	position: relative;
	display: table-cell;
	top: 0;
	width: 100px;
	z-index: 40;
}

body .sidebar.sb-active {
	display: table-cell;
	z-index: 5;
}

body .sidebar nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100px;
    height: 100vh;
    z-index: 40;
    background: linear-gradient(to right, #012d53, #000428);
    transform: translateZ(0);
    will-change: transform;
    backface-visibility: hidden;
}

h1 {
	font-size: 40px;
	font-weight: 700;
}

h3 {
	font-size: 24px;
	font-weight: 300;
}

a {
	text-decoration: none;
	transition: 0.3s ease;
}

input,
p,
textarea,
ul li {
	font-size: 14px;
}

strong {
	font-weight: 600;
}

ul {
	font-size: 0;
}

#content .item .item-details h2.movie-title,
.person .data .caracter,
.person .data .name {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.sweet-alert .popup-container button.cancel:before,
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.clearfix {
	content: "";
	display: table;
	clear: both;
}

.nofloat {
	float: none !important;
}

[class*=" icon-"]:before,
[class^="icon-"]:before {
	margin: 0;
}

.inner-container {
	width: 100%;
	max-width: 100%;
	margin: auto;
	padding: 0 10px;
}

#slogan {
	text-transform: uppercase;
	float: right;
	color: rgba(140, 139, 139, 0.7);
	font-size: 13px;
	margin-top: 16px;
}

.dropdown-toggle {
	cursor: pointer;
}

.dropdown-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 100%;
}

.dropdown.open>.dropdown-menu {
	display: block;
}

.dropdown.open .dropdown-toggle i.fa-angle-down:before {
	content: "\f106";
}

.dropdown,
body {
	position: relative;
}

#main,
body {
	min-height: 100%;
}

#serie-tv li,
ol,
ul {
	list-style: none;
}

.sb-toggle-left {
	display: none;
	padding: 13px 0;
	float: left;
	margin: 20px 20px 20px 0;
	cursor: pointer;
}

.sb-toggle-left .menu-icon-text {
	padding-left: 10px;
	font-weight: 600;
	text-transform: uppercase;
	vertical-align: middle;
}

.sb-toggle-left .menu-icon {
	position: relative;
	display: inline-block;
	width: 18px;
	height: 2px;
	background-color: #fff;
	margin-top: -1px;
	vertical-align: middle;
	z-index: 10;
}

#main,
#sidebar {
	vertical-align: top;
}

.sb-toggle-left .menu-icon:after,
.sb-toggle-left .menu-icon:before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.sb-toggle-left .menu-icon:before {
	-webkit-transform: translateY(-6px) rotate(0);
	-moz-transform: translateY(-6px) rotate(0);
	-ms-transform: translateY(-6px) rotate(0);
	-o-transform: translateY(-6px) rotate(0);
	transform: translateY(-6px) rotate(0);
}

.sb-toggle-left .menu-icon:after {
	-webkit-transform: translateY(6px) rotate(0);
	-moz-transform: translateY(6px) rotate(0);
	-ms-transform: translateY(6px) rotate(0);
	-o-transform: translateY(6px) rotate(0);
	transform: translateY(6px) rotate(0);
}

.sb-active .sb-toggle-left .menu-icon {
	background: 0 0;
}

.sb-active .sb-toggle-left .menu-icon:before {
	-webkit-transform: translateY(0) rotate(45deg);
	-moz-transform: translateY(0) rotate(45deg);
	-ms-transform: translateY(0) rotate(45deg);
	-o-transform: translateY(0) rotate(45deg);
	transform: translateY(0) rotate(45deg);
}

.sb-active .sb-toggle-left .menu-icon:after {
	-webkit-transform: translateY(0) rotate(-45deg);
	-moz-transform: translateY(0) rotate(-45deg);
	-ms-transform: translateY(0) rotate(-45deg);
	-o-transform: translateY(0) rotate(-45deg);
	transform: translateY(0) rotate(-45deg);
}

.mobile-nav ul li {
	display: block;
}

.mobile-nav ul li a:hover {
	color: #fff;
	background: rgba(0, 0, 0, 0.2);
}

.mobile-nav ul li.active a {
	color: #fff;
	background: #298eea;
}

#sidebar {
	display: table-cell;
	background: #282c39;
	width: 180px;
	z-index: 100;
}

#sidebar .sidebar-inner {
	position: fixed;
	width: 200px;
	height: 100%;
}

#sidebar #sidebar-header {
	height: 80px;
	background: #ec403c;
}

#sidebar #sidebar-header .logo {
	display: block;
	line-height: 80px;
	padding: 0 20px;
}

#sidebar #sidebar-header .logo img {
	width: 50%;
	max-width: 100%;
}

#sidebar nav ul li {
	display: block;
}

#sidebar nav ul li a {
	display: block;
	color: rgba(255, 255, 255, 0.7);
	padding: 18px 20px;
}

#sidebar nav ul li.active a {
	color: #fff;
	background: rgba(0, 0, 0, 0.2);
}

#sidebar nav ul li a:hover {
	color: #fff;
}

#sidebar nav ul li a i {
	padding-right: 10px;
}

#sidebar nav ul li a i:before {
	margin: 0;
}

#site-container {
	display: table-cell;
	width: 100%;
	height: 100%;
}

#site-container {
    table-layout: fixed;
    display: table;
}

#main {
	position: relative;
	display: block;
	background: #1d1b24;
	width: 100%;
}

#main #main-header {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	width: 100%;
	height: 80px;
	padding: 0;
	z-index: 100;
}

#main #main-header .inner-container {
	max-width: 1600px;
	height: inherit;
}

#main #main-header .main-nav {
	float: left;
}

#main #main-header .main-nav ul li {
	display: inline-block;
	padding: 23px 0;
}

#main #main-header .main-nav ul li a {
	display: inline-block;
	font-weight: 600;
	color: rgba(255, 255, 255, 0.7);
	padding: 9px 25px;
	border-radius: 3px;
}

#main #main-header .main-nav ul li a i {
	padding-right: 10px;
}

#main #main-header .main-nav ul li.active a {
	color: #fff;
	background: #298eea;
}

#main #main-header .main-nav ul li a:hover {
	color: #fff;
}

#main #main-header .header-nav {
	position: relative;
	float: right;
	padding: 23px 0;
}

#main #main-header .header-nav li {
	position: relative;
	display: inline-block;
	padding-left: 20px;
	vertical-align: top;
}

#main #main-header .header-nav li a {
	color: #fff;
}

#main #main-header .header-nav .login a,
#main #main-header .header-nav .user-login a {
	color: #fff;
	padding: 8px 18px;
	border: 2px solid #fff;
	border-radius: 3px;
}

#main #main-header .header-nav .login a:hover,
#main #main-header .header-nav .user-login a:hover {
	color: #282c39;
	background: #fff;
}

#main #main-header .header-nav .login a i,
#main #main-header .header-nav .user-login a i {
	padding-right: 10px;
	line-height: 0;
}

#main #main-header .header-nav .register a {
	color: #fff;
	padding: 8px 18px;
	border: 2px solid rgba(255, 255, 255, 0.7);
	border-radius: 3px;
}

#main #main-header .header-nav .register a:hover {
	color: #282c39;
	background: #fff;
}

#main #main-header .header-nav .register a i {
	padding-right: 10px;
	line-height: 0;
}

#main #main-header .header-nav .user-normal .dropdown-toggle {
	color: rgba(255, 255, 255, 0.7);
	padding: 7px 10px;
}

#main #main-header .header-nav .user-normal .dropdown-toggle:hover {
	color: #fff;
}

#main #main-header .header-nav .user-normal .dropdown-toggle i {
	padding-right: 0;
}

#main #main-header .header-nav .user-normal .dropdown-toggle i:last-child {
	padding: 0 0 0 5px;
}

#main #main-header .header-nav .user-normal.active .dropdown-toggle,
#main #main-header .header-nav .user-normal.dropdown.open>.dropdown-toggle {
	color: #282c39;
	background: #fff;
}

#main #main-header .header-nav .user-normal ul {
	width: 170px;
	top: 50px;
	right: 0;
	left: auto;
	background: #fff;
	border-radius: 3px;
}

#main #main-header .header-nav .user-normal ul:before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent transparent #fff;
	border-top: 0;
	top: -6px;
	right: 22px;
	border-width: 6px;
}

#main #main-header .header-nav .user-normal ul li {
	display: block;
	padding: 0;
}

#main #main-header .header-nav .user-normal ul li a {
	display: block;
	color: #282c39;
	padding: 10px 20px;
}

#main #main-header .header-nav .user-normal ul li a:hover {
	background: rgba(0, 0, 0, 0.05);
}

#main #main-header .header-nav .user-normal ul li:first-child a:hover {
	border-radius: 3px 3px 0 0;
}

#main #main-header .header-nav .user-normal ul li:last-child a:hover {
	border-radius: 0 0 3px 3px;
}

#main #main-header .header-nav .user-normal ul li a i {
	padding-right: 10px;
}

#main #main-header .header-nav .user-normal ul li .username {
	display: block;
	color: #282c39;
	padding: 10px 20px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

#main #main-header .header-nav .premium a {
	position: relative;
	color: #fff;
	background: #e67e22;
	font-weight: 700;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	display: inline-block;
	padding: 9px 20px 10px 55px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 3px;
	box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1);
}

#main #main-header .header-nav .premium a i {
	position: absolute;
	top: 0;
	left: 0;
	padding: 8px 10px 12px;
	background: rgba(0, 0, 0, 0.1);
	border-radius: 3px 0 0 3px;
}

#main #main-header .header-nav .premium a:hover {
	background: #f39c12;
	box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.3), 0 5px 10px rgba(0, 0, 0, 0.2);
}

#main #main-header .header-nav .contact a {
	position: relative;
	display: inline-block;
	color: rgba(255, 255, 255, 0.5);
	padding: 8px 20px 8px 43px;
	border: 2px solid rgba(255, 255, 255, 0.5);
	border-radius: 3px;
	transition: none;
}

#main #main-header .header-nav .contact a i {
	position: absolute;
	top: 50%;
	margin-top: -7px;
	left: 20px;
	color: rgba(255, 255, 255, 0.5);
	padding-right: 10px;
	vertical-align: text-top;
}

#main #main-header .header-nav .contact a:hover {
	color: #fff;
	background: rgba(255, 255, 255, 0.1);
	border-color: #fff;
}

#main #main-header .header-nav .contact a:hover>i {
	color: #fff;
	border-color: #fff;
	transition: none;
}

#content.contact {
	text-align: center;
}

#contactform {
	width: 600px;
	margin: 20px auto 0 auto;
	text-align: left;
}

#contactform fieldset p {
	position: relative;
	margin-bottom: 20px;
}

#contactform label {
	position: absolute;
	top: 15px;
	left: 20px;
	font-size: 0;
}

#contactform label i {
	font-size: 14px;
}

#contactform input[type="text"],
#contactform textarea {
	color: #fff;
	background: #282c39;
	padding: 15px 20px 15px 50px;
	border: none;
	outline: none;
}

#contactform input[type="text"]:focus,
#contactform textarea:focus {
	background: #2f3444;
}

#contactform input[type="text"]:focus+label,
#contactform textarea:focus+label {
	color: #fff;
}

#contactform textarea {
	width: 100%;
	height: 200px;
}

#contactform input[type="submit"] {
	padding: 16px 25px;
}

.dmca {
	max-width: 80%;
	color: rgba(255, 255, 255, 0.7);
	padding: 40px 0;
	margin: auto;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.dmca h4 {
	font-size: 20px;
	margin-bottom: 20px;
}

.dmca p {
	padding-bottom: 15px;
}

.dmca ul {
	display: table;
	list-style-position: inside;
	margin-bottom: 15px;
}

.dmca ul li {
	display: table-row;
	line-height: 1.5em;
}

.dmca ul li::before {
	display: table-cell;
	content: "-";
	padding-right: 10px;
}

#main #header-secondary {
	position: relative;
	left: 0;
	right: 0;
	top: 80px;
	width: 100%;
	height: 50px;
	line-height: 50px;
	padding: 0;
	z-index: 30;
}

#main #header-secondary .inner-container {
	max-width: 1600px;
	height: inherit;
	background: #01094a;
}

#main #header-secondary .filters {
	float: left;
}

#main #header-secondary .filters ul {
	line-height: 1;
}

#main #header-secondary .filters>ul>li {
	position: relative;
	display: inline-block;
	background: #282c39;
	line-height: 30px;
	margin: 9px 10px 9px 0;
	border-radius: 3px;
	vertical-align: top;
}

#main #header-secondary .filters ul li .dropdown-toggle i,
#main #header-secondary .filters ul li form i {
	vertical-align: text-top;
}

#main #header-secondary .filters ul li a {
	color: #fff;
}

#main #header-secondary .filters ul li .dropdown-toggle {
	color: rgba(255, 255, 255, 0.7);
	display: inline-block;
	padding: 0 15px;
	cursor: pointer;
}

#main #header-secondary .filters ul li .dropdown-toggle .value {
	display: inline-block;
	text-transform: capitalize;
	padding-left: 10px;
}

#main #header-secondary .filters ul li form {
	padding: 0 15px;
}

#main #header-secondary .filters ul li form input {
	color: #fff;
	border: none;
	outline: 0;
	background: 0 0;
	-webkit-appearance: none;
}

#main #header-secondary .filters ul li.open.abc-filter ul {
	display: block;
	width: 360px;
}

#main #header-secondary .filters ul li.open.abc-filter ul li {
	float: left;
	width: 40px;
	line-height: 40px;
	text-align: center;
	text-transform: uppercase;
	padding: 0;
	border: none;
}

#main #header-secondary .filters ul li ul li a {
	color: rgba(255, 255, 255, 0.7);
	display: block;
}

.detail #content .movie-info em.tagline {
	display: inline-block;
	font-size: 12px;
	margin-top: -10px;
	margin-left: 50px;
	margin-right: 15px;
	color: rgba(255, 255, 255, 0.71);
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

#main #header-secondary .filters ul li ul li a:hover {
	color: #fff;
}

#main #header-secondary .filters ul li.dropdown.open>ul {
	display: block;
	margin-top: 11px;
	padding: 15px;
	background: #282c39;
	border-radius: 0 0 3px 3px;
	box-sizing: content-box;
}

#main #header-secondary .filters ul ul li:first-child {
	border: none;
}

#main #header-secondary .filters ul ul li {
	display: block;
	padding: 0 15px;
	line-height: 35px;
	color: rgba(255, 255, 255, 0.7);
	background: #282c39;
	white-space: nowrap;
	cursor: pointer;
}

#main #header-secondary .filters ul>ul>li:last-child {
	border-radius: 0 0 3px 3px;
}

#main #header-secondary .filters ul ul li.active,
#main #header-secondary .filters ul ul li:hover {
	color: #fff;
	background: rgba(0, 0, 0, 0.1);
}

#main #header-secondary .filters ul ul li input[type="checkbox"] {
	display: none;
}

#main #header-secondary .filters ul ul li input[type="checkbox"]+label {
	position: relative;
	padding-left: 20px;
	cursor: pointer;
}

#main #header-secondary .filters ul ul li input[type="checkbox"]+label:hover,
#main #header-secondary .filters ul ul li input[type="checkbox"]:checked+label {
	color: #fff;
}

#main #header-secondary .filters ul ul li input[type="checkbox"]+label:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -5px;
	width: 10px;
	height: 10px;
	background: #2f3444;
	border-radius: 2px;
}

#main #header-secondary .filters ul ul li input[type="checkbox"]:checked+label:after {
	content: "\e6f2";
	font-family: moviewp;
	font-size: 14px;
	line-height: 1;
	color: #2ecc71;
	position: absolute;
	left: -1px;
	top: 50%;
	margin-top: -9px;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large {
	width: 500px;
	background: #282c39;
	padding: 15px;
	box-sizing: content-box;
	border-radius: 0 0 3px 3px;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li {
	display: inline-block;
	width: calc(100% / 3);
	line-height: 1;
	padding: 0;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li input[type="checkbox"]+label {
	display: block;
	line-height: 35px;
	padding: 0 15px 0 35px;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li input[type="checkbox"]+label:hover:before {
	background: #298eea;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li input[type="checkbox"]+label:before {
	content: "";
	position: absolute;
	left: 15px;
	top: 50%;
	margin-top: -5px;
	width: 10px;
	height: 10px;
	background: #2f3444;
	border-radius: 2px;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li input[type="checkbox"]:checked+label:after {
	content: "\e6f2";
	font-family: moviewp;
	font-size: 14px;
	line-height: 1;
	color: #2ecc71;
	position: absolute;
	left: 14px;
	top: 50%;
	margin-top: -9px;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li a {
	display: block;
	line-height: 35px;
	padding: 0 15px 0 35px;
	position: relative;
	cursor: pointer;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li a:before {
	content: "";
	position: absolute;
	left: 15px;
	top: 50%;
	margin-top: -5px;
	width: 10px;
	height: 10px;
	background: #2f3444;
	border-radius: 2px;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li a:hover:before,
#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li.current-cat a:before {
	background: #298eea;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li.current-cat a {
	color: #fff;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large.abc li a:hover:before,
#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large.abc li.current-cat a:before {
	background: #c054c1;
}

#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large.abc {
	width: 200px;
}

#main #header-secondary .sort {
	float: right;
}

#main #header-secondary .sort ul {
	line-height: 1;
}

#main #header-secondary .sort ul li {
	display: inline-block;
}

#main #header-secondary .sort ul li div {
	display: inline-block;
	color: #fff;
	padding: 14px 15px;
	cursor: pointer;
}

#main #header-secondary .sort ul li.active div {
	background: #1d1b24;
}

#main #header-secondary .sort ul li div i {
	font-size: 20px;
}

#content {
	position: relative;
	font-size: 0;
	width: 100%;
	/* padding-top: 30px; */
	padding-bottom: 30px;
	margin-top: 100px;
}

#content .item-container {
    /* margin: 0 -10px; */
}


.tvshow i {
	font-style: normal !important;
}

#content .item {
	/* opacity: 0; */
	/* transform: scale(0.3); */
	transition: all 0.3s ease-in-out;
	position: relative;
	font-size: 15px;
	display: inline-block;
	width: 100%;
	/* padding: 10px; */
	text-align: left;
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	-ms-perspective: 1000;
	perspective: 1000px;
	-ms-transform: perspective(1000px);
	-moz-transform: perspective(1000px);
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
}

#content .item-flip {
	-webkit-transition: 0.6s;
	-webkit-transform-style: preserve-3d;
	-ms-transition: 0.6s;
	-moz-transition: 0.6s;
	-moz-transform: perspective(1000px);
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transition: 0.6s;
	transform-style: preserve-3d;
	position: relative;
}

#content .item .item-details,
#content .item .item-inner {
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: 0.6s;
	-webkit-transform-style: preserve-3d;
	-webkit-transform: rotateY(0);
	-moz-transition: 0.6s;
	-moz-transform-style: preserve-3d;
	-moz-transform: rotateY(0);
	-o-transition: 0.6s;
	-o-transform-style: preserve-3d;
	-o-transform: rotateY(0);
	-ms-transition: 0.6s;
	-ms-transform-style: preserve-3d;
	-ms-transform: rotateY(0);
	transition: 0.6s;
	transform-style: preserve-3d;
	transform: rotateY(0);
}

#content .item .item-inner {
	position: relative;
	z-index: 2;
	-webkit-transform: rotateY(0);
	-ms-transform: rotateY(0);
	transform: rotateY(0);
}

#content .item .item-inner .movie-options {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 0;
	opacity: 0;
	transition: 0.3s ease;
	z-index: 20;
}

#content .item .item-inner .movie-options i {
	color: rgba(255, 255, 255, 0.5);
	display: inline-block;
	font-size: 20px;
	padding: 10px;
}

#content .item .item-inner .movie-options .watchlist-add i:hover:before {
	color: #fff;
}

#content .item .item-inner .movie-options .favorites-add i:hover:before {
	color: #fff;
	content: "\e77d";
}

#content .item .item-inner .movie-options .favorites-add,
#content .item .item-inner .movie-options .favorites-remove,
#content .item .item-inner .movie-options .watchlist-add,
#content .item .item-inner .movie-options .watchlist-remove {
	display: inline-block;
	position: absolute;
	top: 0;
	z-index: 20;
}

#content .item .item-inner .movie-options .favorites-add:hover,
#content .item .item-inner .movie-options .favorites-remove:hover,
#content .item .item-inner .movie-options .watchlist-add:hover,
#content .item .item-inner .movie-options .watchlist-remove:hover {
	cursor: pointer;
}

#content .item .item-inner .movie-options .watchlist-add {
	left: 0;
}

#content .item .item-inner .movie-options .favorites-add {
	right: 0;
}

#content .item .item-inner .movie-options .favorites-remove,
#content .item .item-inner .movie-options .watchlist-remove {
	opacity: 0;
	top: 0;
	left: 0;
	right: 0;
	padding-left: 30px;
	background: #ec403c;
	text-align: center;
	border-radius: 3px 3px 0 0;
	transition: 0.3s ease;
}

#content .item .item-inner .movie-options .favorites-remove:hover>i,
#content .item .item-inner .movie-options .favorites-remove:hover>span,
#content .item .item-inner .movie-options .watchlist-remove:hover>i,
#content .item .item-inner .movie-options .watchlist-remove:hover>span {
	color: #fff;
}

#content .item .item-inner .movie-options .favorites-remove i,
#content .item .item-inner .movie-options .watchlist-remove i {
	position: absolute;
	left: 0;
	padding: 4px 5px 6px;
	color: #fff;
	background: rgba(0, 0, 0, 0.1);
	border-radius: 3px 0 0 3px;
}

#content .item .item-inner .movie-options .favorites-remove span,
#content .item .item-inner .movie-options .watchlist-remove span {
	display: inline-block;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 30px;
	vertical-align: top;
}

#content .item .item-inner .movie-options .active i,
#content .item .item-inner .movie-options .active i:hover:before {
	color: #298eea;
}

#content .item .item-inner a {
	position: relative;
	display: block;
	transition: 0.3s ease;
}

#content .item .item-inner a .movie-play {
	opacity: 0;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	transition: 0.3s ease;
	z-index: 10;
}

#content .item .item-inner a .movie-play i {
	position: absolute;
	top: 50%;
	margin-top: -24px;
	left: 50%;
	margin-left: -24px;
	color: #fff;
	display: inline-block;
	font-size: 20px;
	text-align: center;
	width: 48px;
	line-height: 44px;
	border: 2px solid #fff;
	border-radius: 50%;
}

.detail #content .movie-info .movie-data span:first-child:before,
.imdb-rating:hover:before {
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #2f3444;
}

#content .item .item-inner a img,
#content .item .item-inner:hover>.movie-options,
#content .item .item-inner:hover>.movie-options>.favorites-remove,
#content .item .item-inner:hover>.movie-options>.watchlist-remove,
#content .item .item-inner:hover>a>.movie-play {
	opacity: 1;
	transition: 0.3s ease;
}

#content .item .item-inner:hover>a>img {
	opacity: 0.2;
	transition: 0.3s ease;
}

#content .item .item-inner img {
	max-width: 100%;
	border-radius: 3px;
}

#content .item .item-inner .imdb-rating {
	font-size: 16px;
}

#content .item .item-inner .movie-date {
	color: rgba(255, 255, 255, 0.7);
	font-size: 16px;
}

#content .item .item-details {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: auto;
	height: auto;
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	-o-transform: rotateY(-180deg);
	-ms-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
	border-radius: 4px;
}

#content .item-flip:hover .item-inner {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

#content .item-flip:hover .item-details {
	-webkit-transform: rotateY(0);
	-moz-transform: rotateY(0);
	-o-transform: rotateY(0);
	-ms-transform: rotateY(0);
	transform: rotateY(0);
}

#content .item .item-details .item-details-inner {
	display: block;
	height: 100%;
	padding: 20px;
	background: #1d1b24;
	border-radius: 4px;
	overflow: hidden;
}

#content .item .item-details:hover {
	display: block;
}

#content .item .item-details h2.movie-title {
	color: #fff;
	font-size: 18px;
	font-weight: 600;
	padding-bottom: 15px;
}

#content .item .item-details .movie-description {
	font-size: 15px;
	color: rgba(255, 255, 255, 0.7);
	height: 7.5em;
	overflow: hidden;
}

#content .item .item-details .imdb-rating {
	position: relative;
	float: left;
	color: rgba(255, 255, 255, 0.7);
	padding-left: 10px;
	padding-bottom: 10px;
	z-index: 1;
}

#content .item .item-details .imdb-rating i {
	padding-right: 5px;
}

#content .item .item-details .imdb-rating i.fa {
	color: #febf15;
}

#content .item .item-details span.movie-date {
	position: relative;
	float: right;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.7);
	padding-top: 1px;
	padding-right: 10px;
	z-index: 1;
}

#content .item .item-details .watch-btn {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	font-weight: 600;
	text-align: center;
	padding: 70px 10px 10px;
	border-radius: 0 0 4px 4px;
	background: -moz-linear-gradient(top, rgba(29, 27, 36, 0) 0, rgba(29, 27, 36, 1) 40%, rgba(29, 27, 36, 1) 100%);
	background: -webkit-linear-gradient(top, rgba(29, 27, 36, 0) 0, rgba(29, 27, 36, 1) 40%, rgba(29, 27, 36, 1) 100%);
	background: linear-gradient(to bottom, rgba(29, 27, 36, 0) 0, rgba(29, 27, 36, 1) 40%, rgba(29, 27, 36, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#001d1b24', endColorstr='#1d1b24', GradientType=0);
}

#content .item .item-details .watch-btn span:last-child {
	display: block;
	color: #fff;
	background: #298eea;
	line-height: 40px;
	border-radius: 4px;
	clear: both;
}

.imdb-rating {
	position: relative;
	display: inline-block;
	padding-bottom: 5px;
}

.imdb-rating i {
	margin-left: -2px;
}

.imdb-rating i:before {
	margin: 0;
}

.imdb-rating i.icon-star-o,
.imdb-rating i.icon-star-outlined {
	color: rgba(255, 255, 255, 0.5);
}

.imdb-rating i.icon-star-half-empty,
.imdb-rating i.icon-star-o,
.imdb-rating i.icon-star2 {
	font-size: 12px;
	margin: 0 2px 0 0;
}

#content .item.remove {
	opacity: 0;
	width: 0;
	padding: 0;
}

#content .item.remove .item-details {
	opacity: 0;
}

.imdb-rating:hover:before {
	display: block;
	content: "";
	position: absolute;
	bottom: 23px;
	left: 50%;
	margin-left: -7px;
	margin-top: 6px;
	z-index: 15;
}

.imdb-rating:hover:after {
	content: attr(data-content);
	position: absolute;
	color: #fff;
	background: #2f3444;
	font-size: 14px;
	line-height: 1;
	padding: 8px 12px;
	width: 46px;
	text-align: center;
	bottom: 100%;
	margin-bottom: 10px;
	left: 50%;
	margin-left: -24px;
	border-radius: 3px;
	z-index: 10;
}

.table {
	display: table;
	width: 300px;
	margin: 60px auto;
	font-size: 0;
}

.table .row {
	display: table-row;
}

.table .row>div {
	display: table-cell;
	width: 33.33%;
	padding: 17px 20px;
}

.table .table-body,
.table .table-footer,
.table .table-header {
	display: table;
	width: 100%;
}

.table .table-header .row>div {
	font-size: 14px;
	vertical-align: bottom;
	padding: 30px 0;
}

.table .table-header .row>div:last-child {
	background: #298eea;
}

.table .table-header .row>div .time {
	font-size: 18px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
}

.table .table-header .row>div .price {
	font-size: 36px;
	font-weight: 700;
	padding: 15px;
}

.table .table-header .row>div .mostpopular {
	font-weight: 600;
	background: #1d82dc;
	padding: 15px 0;
	margin: 20px 0 -30px;
}

.table .table-header .row>div .discount {
	background: rgba(0, 0, 0, 0.2);
	padding: 15px 0;
	margin: 20px 0 -30px;
}

.table .table-body .row {
	background: #282c39;
}

.table .table-body .row:nth-child(odd) {
	background: #242833;
}

.table .table-body .row>div {
	font-size: 14px;
	padding: 17px 20px;
}

.table .table-body .row>div:first-child {
	text-align: left;
}

#buttonposter>p,
#content.login,
#spinner,
.AZList,
.detail #content.profile,
.md-content h3,
.notice div i,
.pagination,
.pagination a,
.pagination span,
.profile i,
.rating,
p#buttondownload,
span.top-number {
	text-align: center;
}

.table .table-body .row>div:last-child {
	border: 4px solid #298eea;
	border-width: 0 4px;
}

.table .table-body .row>div i {
	padding-right: 8px;
}

#spinner {
	display: block;
	margin: 40px auto;
	width: 80px;
}

#spinner>div {
	width: 18px;
	height: 18px;
	background-color: #298eea;
	border-radius: 100%;
	margin: 0 3px;
	display: inline-block;
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

#spinner .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}

#spinner .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}

#paginador {
	float: left;
	clear: both;
	width: 100%;
	margin: 10px 0;
}

#paginador .paginado a,
#paginador .paginado span,
.pag-nav span {
	display: inline-block;
	margin: 0 4px 4px;
	padding: 4px 8px;
	color: #555;
}

#paginador .paginado {
	font-size: 12px;
	font-weight: 300;
	line-height: 20px;
}

#paginador .paginado a,
.pag-nav span {
	border: 1px solid rgba(0, 0, 0, 0.69);
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color: rgba(0, 0, 0, 0.2);
}

#paginador .paginado span {
	border: 1px solid #ccc;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	background-color: #e7e7e7;
}

.imdb2_r .b,
.imdb_r .b {
	margin-top: 3px;
	float: left;
}

#paginador .paginado .current {
	color: #fff;
	border: 1px solid #000;
	background: #2d2e4c;
}

#paginador .paginado a {
	font-size: 12px;
	margin: 3px;
	text-decoration: none;
	color: #fff;
	background-color: #3c3c62;
}

.imdb2_r .b .bar,
.imdb_r .b .bar {
	font-size: 0;
	height: 13px;
	overflow: hidden;
}

#paginador .paginado a:hover {
	color: #fff;
	background-color: #000;
}

#main #main-header .logo {
    text-decoration: none;
    color: white;
    font-size: 45px;
    z-index: 9999;
}



.detail #content #serie-tv {
	position: relative;
	z-index: 10;
}

.detail #serie-tv {
	display: inline-block;
	width: 25%;
	vertical-align: top;
}

#serie-tv li.episodi {
	background: #34495e;
	margin: 0;
	padding: 10px;
}

#serie-tv li.stagione {
	cursor: pointer;
	font-size: 17px;
	line-height: 2em;
	color: rgba(255, 255, 255, 0.7);
	background: #298eea;
	padding: 3px;
}

#serie-tv .hide {
	display: none;
}

a#tv.active,
a#tv:hover {
	font-weight: 700;
	color: #fff;
}

#serie-tv li.episodi p {
	font-size: 16px;
	color: #bbb;
}

#serie-tv li.stagione:hover {
	color: #fff;
}

a#tv {
	color: #bbb;
}

#serie-tv li:first-child {
	border-radius: 5px 5px 0 0;
}

#serie-tv li:last-child {
	border-radius: 0 0 5px 5px;
}

.actions-list>li,
.detail .movie-actions ul>li {
	position: relative;
	font-size: 16px;
	display: block;
	color: rgba(255, 255, 255, 0.7);
	background: #34495e;
	text-align: center;
}

.actions-list #subtitles,
.detail .movie-actions ul li#subtitles {
	border-radius: 5px 5px 0 0;
}

.tv-details-episodes-info .actions-list {
	width: 100%;
	margin-top: 30px;
}

.tv-details-episodes-info p {
	margin-top: 30px;
	color: rgba(255, 255, 255, 0.71);
}

.actions-list,
.detail .tv-details .movie-actions ul {
	display: inline-block;
	width: 50%;
	vertical-align: top;
}

.actions-list #subtitle-button,
.detail .movie-actions #subtitle-button {
	display: block;
}

.actions-list #subtitle-button #subfile,
.detail .movie-actions #subtitle-button #subfile {
	display: none;
}

.actions-list #subtitle-button label,
.detail .movie-actions #subtitle-button label {
	display: block;
	padding: 16px 20px;
	cursor: pointer;
}

.actions-list li i,
.detail .movie-actions ul li i {
	vertical-align: text-top;
	padding-right: 10px;
}

.pagination {
	margin-top: 60px;
	width: 100%;
	font-size: 16px;
	opacity: 1 !important;
}

.pagination a,
.pagination span {
	padding: 10.5px 20px;
	margin: 0 5px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	font-size: 16px;
}

.pagination a.inactive {
	color: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.2);
	font-weight: 500;
}

.pagination span.current {
	background: #298eea;
	color: #fff;
	font-weight: 500;
}

a.arrow_pag {
	font-size: 16px;
	padding: 9.3px 20px;
	color: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.2);
	font-weight: 500;
}

.pagination a:hover {
	color: rgba(255, 255, 255, 0.85);
	background: rgba(255, 255, 255, 0.3);
}

#buttonposter,
i.hd {
	background-color: #298eea;
}

.resppages {
	display: none;
}

#disqus_thread {
	position: relative;
	z-index: 10;
	margin-top: 20px;
	padding-top: 20px;
}

.rating,
p#buttondownload {
	float: left;
}

.detail #content .movie-info h1 span,
.detail #content .movie-info h1 span a {
	color: rgba(160, 160, 160, 0.77);
	font-weight: 500;
}

#buttonposter,
#buttonposter>p,
.rating,
a,
i.hd {
	color: #fff;
}

i.hd {
	padding: 1px 6px;
	border-radius: 2px;
	font-size: 14px;
	font-weight: 700;
	margin-right: -1px;
}

#buttonposter>p>i,
.rating {
	margin-right: 10px;
}

.detail #content .movie-info span#hd-icon {
	font-style: italic;
	font-size: 18px;
	font-weight: 700;
}

#buttonposter {
	border-radius: 0 0 5px 5px;
	padding: 10px 25px;
	display: block;
	cursor: pointer;
	margin-bottom: 20px;
}

#buttonposter>p {
	cursor: pointer;
	font-size: 13px;
	font-weight: 700;
}

.button:hover {
	border: 1px solid rgba(255, 255, 255, 0.88);
	transition: 0.3s ease;
}

p#buttondownload {
	border-radius: 5px;
	background-color: #c054c1;
	padding: 13px;
	color: #fff;
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
}

p#buttondownload:hover {
	background-color: #9a329b;
}

.detail #content .movie-info b {
	font-size: 15px;
	cursor: pointer;
	margin-top: -30px;
}

.detail #content .movie-info b:hover {
	opacity: 1;
}

.details span {
	display: inline-block;
	margin: 0 5px;
}

.details span a {
	color: rgba(255, 255, 255, 0.7);
}

.detail .movie-actions .extra li#streaming-4k a span,
.details span a:hover,
.download a span {
	color: #fff;
}

.details {
	border-top: 1px solid rgba(255, 255, 255, 0.07);
	padding-top: 20px;
}

.detail #content .movie-info .movie-data span:before {
	display: none;
}

.detail #content .movie-info em span:hover {
	border: 1px solid rgba(255, 255, 255, 0.88);
	transition: 0.3s ease;
}

.detail .movie-actions .extra li#streaming-3d {
	background-color: #e67e22;
}

#streaming-3d>a>span {
	color: #fff;
}

#streaming-3d>a>span>em {
	margin-left: 5px;
	font-style: italic;
	font-size: 18px;
	font-weight: 700;
}

.detail .movie-actions .extra li#streaming-hd {
	background-color: #298eea;
	border-radius: 0 0 5px 5px;
}

.detail .movie-actions .extra li#streaming-4k {
	border-radius: 5px;
	background-color: #c054c1;
}

.download a span em {
	margin-left: 5px;
	font-size: 18px;
	font-weight: 700;
}

.detail .movie-actions .extra li#download-button .download a span {
	color: rgba(255, 255, 255, 0.7);
}

.detail .movie-actions .extra li#download-button .download a span:hover,
.detail .movie-actions .extra li#download-button a:hover {
	color: #fff;
}

.movie-actions {
	margin-bottom: 20px;
}

.detail .movie-actions .extra li div span {
	color: rgba(255, 255, 255, 0.7);
}

.detail .movie-actions .extra li div span:hover,
.detail .movie-actions ul>li a:hover {
	color: #fff;
}

span.item-tv {
	position: absolute;
	left: 5px;
	top: 4px;
	padding: 5px;
	z-index: 1;
	font-size: 0.6rem;
	font-weight: 700;
	color: #fff;
}

span.top-number {
	position: absolute;
	left: -5px;
	top: -4px;
	min-width: 22px;
	padding: 0 5px;
	border-radius: 3px 0 0;
	z-index: 1;
	font-size: 0.6rem;
	font-weight: 700;
	line-height: 23px;
	color: #000;
	background-color: #ffc107;
}

span.top-number:after,
span.top-number:before {
	content: "";
	width: 0;
	top: 0;
	right: -5px;
	position: absolute;
	border-bottom: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom-color: #ffc107;
	box-sizing: inherit;
}

span.top-number:after {
	border-bottom-color: rgba(0, 0, 0, 0.4);
}

span.top-number i {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -4px;
}

span.top-number i:before {
	border-left: 11px solid transparent;
	float: right;
}

span.top-number i:after {
	border-right: 11px solid transparent;
	float: left;
}

span.top-number i:after,
span.top-number i:before {
	content: "";
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-top-color: #ffc107;
}

.persons {
	float: left;
	width: 100%;
	margin-top: 20px;
}

.person {
	position: relative;
	padding: 10px 0 10px 73px;
	min-height: 70px;
	float: left;
	width: calc(100% / 4.4);
	margin-bottom: 10px;
}

.person .img {
	position: absolute;
	left: 0;
	top: 0;
	width: 60px;
	height: 60px;
	overflow: hidden;
}

.person .img img {
	width: 100%;
	position: relative;
	height: 100%;
	border-radius: 50%;
	object-fit: cover;
}

.person .data {
	padding-right: 20px;
}

.person .data .name {
	font-size: 14px;
	margin-bottom: 5px;
	float: left;
	width: 100%;
	font-weight: 400;
}

.person .data .name a {
	color: #fff;
	font-weight: 500;
	font-size: 15px;
}

.person .data .caracter {
	color: rgba(255, 255, 255, 0.4);
	font-size: 12px;
	float: left;
	width: 100%;
	font-weight: 300;
}

.purple:active,
.purple:focus,
.purple:hover,
span.hd {
	color: #fff;
}

#Rated,
span.hd {
	font-size: 13px;
}

span.hd {
	position: absolute;
	left: 10px;
	top: 10px;
	padding: 3px 6px;
	border-radius: 2px;
	z-index: 1;
	font-weight: 700;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #298eea;
}

#Rated {
	padding: 6px;
	border: 1px solid rgba(243, 249, 255, 0.5);
	box-sizing: border-box;
	line-height: 50%;
}

#anno {
	font-weight: 600;
}

#runtime {
	font-style: i;
}

#streaming-hd div:hover {
	color: #fff;
	background: rgba(0, 0, 0, 0) !important;
}

.purple {
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	position: relative;
	background: #e1e1e1;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}

.purple:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	cursor: pointer;
	background: #b52cb6;
	border-radius: 5px;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: 50%;
	transform-origin: 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}

.purple:active:before,
.purple:focus:before,
.purple:hover:before {
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

@-webkit-keyframes blue {
	100% {
		top: -12px;
		right: -12px;
		bottom: -12px;
		left: -12px;
		opacity: 0;
	}
}

@keyframes blue {
	100% {
		top: -12px;
		right: -12px;
		bottom: -12px;
		left: -12px;
		opacity: 0;
	}
}

.blue {
	display: inline-block;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	position: relative;
	border-radius: 0 0 5px 5px;
}

.blue:before {
	content: "";
	position: absolute;
	border: 6px solid #298eea;
	border-radius: 0 0 5px 5px;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}

.blue:active:before,
.blue:focus:before,
.blue:hover:before {
	-webkit-animation-name: blue;
	animation-name: blue;
}

.is--hidden {
	display: none;
	margin-top: 20px;
}

p.email {
	margin-top: 20px;
	margin-left: 35%;
	color: #fff;
	font-size: 17px;
}

.mybutton {
	margin-top: 50px;
	margin-left: 38%;
	padding: 16px 25px;
	text-align: center;
	cursor: pointer;
	background: #298eea;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	border: none;
	border-radius: 3px;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance: none;
	appearance: none;
}

.watch-now {
	padding: 0.5rem 1rem;
}

.watch-later {
	padding: 0.5rem 0.7rem;
}

.watch-now,
.watch-later {
	color: #fff;
	background: #298eea;
	border: none;
	border-radius: 100px;
}

ul>li#quality-button {
	background: rgba(255, 255, 255, 0);
}

ul li#quality-button .switch {
	position: relative;
	font-size: 0;
}

ul li#quality-button .switch input {
	visibility: hidden;
	position: absolute;
	width: 100%;
	height: 100%;
	border: none;
	outline: 0;
	padding: 0;
	margin: 0;
}

ul li#quality-button .switch label {
	display: inline-block;
	font-size: 16px;
	line-height: 40px;
	color: rgba(255, 255, 255, 0.7);
	border-radius: 3px;
	cursor: pointer;
}

ul li#quality-button .switch label.hd {
	color: #fff;
	padding-right: 5px;
}

ul li#quality-button .switch label.fullhd {
	padding-left: 5px;
}

ul li#quality-button .switch label.switch-toggle {
	position: relative;
	width: 16px;
	height: 8px;
	background: rgb(41, 142, 234);
	border-radius: 10px;
}

ul li#quality-button .switch label.switch-toggle:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	margin-left: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #fff;
	transition: 0.3s ease;
}

ul li#quality-button .switch #quality-switch:checked~label.switch-toggle:before {
	margin-left: 8px;
}

ul li#quality-button .switch #quality-switch:checked~label.hd {
	color: rgba(255, 255, 255, 0.7);
}

ul li#quality-button .switch #quality-switch:checked~label.fullhd {
	color: #fff;
}

.bottone {
	width: 300px;
	height: 250px;
	z-index: 9999;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background: rgba(0, 0, 0, 0);
	margin: auto;
	opacity: 0.8;
}

.bottone:hover {
	opacity: 1;
}

#cls_btn {
	top: 0;
	left: 0;
	position: absolute;
	opacity: 1 !important;
}

#cls_btn,
#player>a img,
#player>div>a:nth-child(1)>img {
	cursor: pointer;
}

a#cls_btn>img {
	cursor: pointer;
}

#cls_btn>img {
	opacity: 1 !important;
}

#player {
	width: 100%;
	height: 100%;
	z-index: 9997;
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.live-search {
	margin-left: 0;
}

.live-search {
	margin-top: 0;
	margin-left: -1px;
	float: left;
	width: 100%;
}

.live-search ul {
	background: rgb(21, 29, 38);
}

.live-search ul {
	float: left;
	width: 198px;
	box-shadow: 0 10px 20px -3px rgba(0, 0, 0, 0.52);
	margin-top: 2px;
}

.live-search ul li {
	border-bottom: solid 1px rgba(255, 255, 255, 0.08);
}

.live-search ul li {
	float: left;
	width: 100%;
	display: block;
	padding: 10px;
	padding-left: 2px !important;
}

.live-search ul li .poster {
	float: left;
	left: 0;
	display: inline-block;
	margin-right: 20px;
	width: 55px;
	height: 70px;
	overflow: hidden;
}

.live-search ul li .poster img {
	margin-top: -7px;
	width: 100%;
}

.live-search ul li .release {
	margin-left: 5px;
	font-size: 11px;
	font-weight: 400;
}

.live-search ul li .imdb {
	color: rgba(255, 255, 255, 0.5);
}

.live-search ul li .imdb span.icon-star {
	color: #c18545;
}

.live-search ul li .imdb span.fa-star {
	color: #298eea;
	font-size: 13px;
	margin-right: 3px;
}

.live-search ul li .title {
	color: #fff;
	padding-top: 8px;
	margin-bottom: 0;
	font-size: 13px;
	line-height: 20px;
	font-weight: 400;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

#main #header-secondary .filters .live-search ul li {
	border-bottom: solid 1px rgba(255, 255, 255, 0.08) !important;
}

.live-search ul li a.more {
	font-weight: 500;
	width: 100%;
	float: left;
	padding: 5px;
	text-align: center;
	font-style: italic;
	font-size: 12px;
}

#main #header-secondary .filters ul li form button[type="submit"] {
	color: #fff;
	background: transparent;
}

#main #header-secondary .filters ul li form button[type="submit"] {
	border: 0;
	position: absolute;
	float: left;
	left: 0;
	top: 0;
	cursor: pointer;
	padding: 12px 15px;
	font-size: 14px;
	outline: 0;
}

@media screen and (max-width: 32em) {
	body {
		font-size: 75%;
	}
}

@media (max-width: 1110px) {
	.detail #content .movie-image a p {
		font-size: 12px;
		margin-left: -20px;
	}
}

@media (max-width: 768px) {
	.detail #content .movie-info {
		width: calc(100% - 200px);
		margin-left: 20px;
	}

	.movie-info p.movie-description span.trama {
		font-size: 14px;
	}

	.detail #content .movie-info .movie-data {
		margin-bottom: -40px;
		border-bottom: 0;
	}

	.detail #content .movie-image {
		width: 150px;
		left: 0;
	}
}

@media (max-width: 600px) {

	.detail #content .movie-info .movie-data span#anno,
	.detail #content .movie-info .movie-data span.hd,
	.detail #content .movie-info .movie-data span:before,
	.detail #content .movie-info em span#tvdb,
	.detail #content .movie-info em span.rated,
	.detail #content .movie-info h1 i,
	.detail #content .movie-info p.movie-description span.trama,
	.movie-background {
		display: none;
	}

	.detail #content .movie-info {
		width: 100%;
		padding: 0;
		margin-left: 10px;
	}

	p.email {
		margin-left: 18%;
	}

	.mybutton {
		margin-left: 27%;
	}

	.detail #content .movie-image {
		width: 100%;
		margin-top: -15px;
	}

	.detail #content .movie-image img {
		border-top-right-radius: 5px;
		border-top-left-radius: 5px;
	}

	.detail #content .movie-background {
		background: no-repeat #1d1b24;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		background-size: cover;
	}

	.detail #content .movie-image a {
		margin-bottom: 15px;
	}

	.detail #content .movie-image a p i {
		margin-left: 30%;
	}

	.detail #content .movie-info .movie-data {
		border: 0;
	}

	.detail #content .movie-info p {
		font-size: 13px;
		margin-top: -90px;
		padding-left: 0;
		margin-left: 0;
		margin-right: 0;
		text-overflow: ellipsis;
	}

	.detail #content .movie-info .movie-data span {
		font-size: 13px;
		margin: 3px;
	}

	.detail #content .movie-info em span {
		margin: 5px;
		font-size: 9px;
		white-space: nowrap;
	}

	i.fa.fa-star-o {
		color: #f5de50;
	}

	.detail .movie-actions .extra li#streaming-4k a span {
		font-size: 13px;
		color: #fff;
	}
}

.detail #content .movie-info h1 i {
	color: rgba(160, 160, 160, 0.77);
	font-weight: 500;
}

.detail #content .movie-info em {
	padding-bottom: 15px;
	display: block;
	color: #fff;
	font-size: 10px;
}

@media (max-width: 400px) {
	.detail #content .movie-info {
		margin-left: 5px;
		left: 0;
	}

	.detail #content .movie-info h1 {
		margin-left: -15px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-size: 30px;
	}

	.rating {
		margin-left: -10px;
		top: -5px;
		width: 35px;
		height: 32px;
	}

	.details {
		margin-bottom: 15px;
		font-style: italic;
	}
}

@media (max-width: 1200px) {
	#content .item {
		width: calc(100% / 1);
	}

	#main #main-header .logo {
		margin-right: 30px;
	}

	#main #main-header .main-nav ul li a {
		padding: 9px 20px;
	}

	#main #main-header .header-nav .premium a i,
	#main #main-header .header-nav .user-login a i,
	#main #main-header .main-nav ul li a i {
		display: none;
	}

	#main #main-header .header-nav .premium a {
		padding: 10px 20px;
	}

	.detail #content .movie-info .movie-actions ul>li {
		margin-bottom: 15px;
	}
}

@media (max-width: 1020px) {

	#main #main-header .header-nav .contact a,
	#main #main-header .header-nav .login a,
	#main #main-header .header-nav .register a,
	#main #main-header .header-nav .user-login a {
		padding: 8px 15px;
	}

	#main #main-header .header-nav .premium a {
		padding: 10px 15px;
	}

	#main #main-header .header-nav li a {
		display: none;
	}

	.landing-trial #site-container {
		width: 100%;
	}

	.landing-trial #main {
		margin: auto;
	}

	.landing-trial #main header {
		border-radius: 0;
	}

	.detail #content .movie-image {
		width: 20%;
	}

	.detail #content .movie-info {
		width: 80%;
	}

	.detail .movie-actions {
		display: block;
		width: 100%;
		margin-top: 30px;
	}

	.detail .movie-actions ul {
		display: inline-block;
		width: 50%;
		vertical-align: top;
	}

	.detail .movie-actions ul:first-child {
		padding-right: 15px;
	}

	.detail .movie-actions ul:last-child {
		padding-left: 15px;
	}
}

@media (max-width: 900px) {
	body .sidebar {
		position: fixed;
		top: 0;
		z-index: -1;
	}

	#Rated {
		display: none !important;
	}

	#main #header-secondary .filters ul li .dropdown-toggle .value,
	.person .data {
		display: none;
	}

	#content .item .item-details span.movie-date {
		padding-top: 1px;
	}

	body .sidebar nav {
		top: 0;
	}

	#content .item {
		width: calc(100% / 1);
	}

	#content {
		margin-top: 80px;
	}

	.detail #content {
		padding: 30px 0;
		margin-top: 0;
	}

	#main #main-header {
		position: fixed;
	}

	#main #main-header .inner-container {
		text-align: center;
	}

	#main #main-header .logo {
		display: inline-block;
		float: none;
		margin-top: 10px;
	}

	#main #main-header .header-nav li.contact,
	#main #main-header .header-nav li.premium,
	#main #main-header .main-nav {
		display: none;
	}

	#main #header-secondary {
		/* position: absolute; */
		/* top: 80px; */
		/* left: 0; */
		/* float: left; */
		width: 100%;
	}

	#main #header-secondary .inner-container {
		padding-left: 30px;
	}

	.sb-toggle-left {
		display: inline-block;
	}

	.detail #content .movie-info .movie-data span {
		display: inline-block;
		padding-bottom: 15px;
	}

	.landing-trial #main #features,
	.premium-packages>li.credits {
		display: none;
	}

	.detail.show-detail #content {
		margin-top: 0;
	}

	#content.login form {
		width: 90%;
	}

	.landing-all #main #features {
		width: 255px;
		padding: 20px;
	}

	.landing-all #main #landingform {
		width: calc(100% - 255px);
	}

	.landing-trial #main #landingform {
		width: 100%;
	}

	#premium .premiumform .server,
	#premium .premiumform h3 {
		float: none;
		margin-bottom: 10px;
	}
}

@media (max-width: 768px) {

	.premium-packages li .package-features ul li,
	.resppages a {
		text-align: center;
	}

	.pagination {
		display: none;
	}

	.resppages {
		display: block !important;
	}

	#main #header-secondary .filters ul li.abc-filter,
	.tv-details-episodes ol li.active:after {
		display: none;
	}

	.resppages a {
		background: #298eea;
		color: #fff;
		width: 48%;
		margin: 0 1%;
		padding: 10px 0;
		float: left;
		font-size: 16px;
	}

	.detail #content .movie-info {
		width: 100%;
		padding-left: 0;
	}

	.tv-details-seasons {
		width: 30%;
	}

	.tv-details-episodes {
		width: 70%;
		padding-right: 0;
	}

	.tv-details-episodes-info {
		width: 100%;
		padding-left: 0;
		margin-top: 30px;
	}

	#contactform,
	#content.login form {
		width: 100%;
	}

	.premium-packages>li:first-child {
		position: relative;
		width: 302px;
		max-width: 100%;
		margin-top: 343px;
		margin-right: -306px;
		z-index: 1;
	}

	.premium-packages li header .selection input[type="radio"]+label {
		width: 100%;
		padding: 13px 10px;
		margin: 0;
	}

	.premium-packages li header .selection input[type="radio"]+label:last-of-type {
		margin-bottom: 15px;
	}

	.premium-packages li header .selection input[type="radio"]+label span {
		display: inline;
	}

	.landing #main {
		display: block;
	}

	.landing #main #features,
	.landing #main #landingform,
	.landing #main header {
		position: relative;
		display: block;
		width: 100%;
		min-height: auto;
		margin: 0;
		padding: 30px 20px;
	}

	.landing #main #landingform {
		float: none;
		border-radius: 0;
	}

	.landing #main .secondaryheader {
		display: block;
		padding: 0 20px;
	}

	.landing #main .secondaryheader i {
		right: 20px;
	}

	.landing #main header h1 {
		left: auto;
		right: 20px;
	}

	.landing #main header h1:before {
		display: none;
	}

	.landing #main #features {
		top: 0;
		border-radius: 0 0 5px 5px;
	}

	.landing #main #features ul li {
		display: inline-block;
		width: 50%;
	}

	.landing #main #features ul li:before,
	.landing-trial #main #features ul li:last-child {
		display: none;
	}

	.landing-trial #main #landingform {
		padding: 0;
	}

	#premium .features,
	#premium .premiumform {
		display: block;
		width: 100% !important;
	}

	.notice {
		padding: 15px 70px 14px 40px;
	}

	.notice .notice-icon {
		left: -15px;
		top: 50%;
		margin-top: -18px;
		z-index: 11;
		background: #205288;
		bottom: auto;
		padding: 5px 8px;
		font-size: 15px;
		border-radius: 50%;
		border: 2px solid rgba(41, 142, 234, 0.3);
	}

	.notice .notice-icon i {
		position: relative;
		top: auto;
		left: auto;
		right: auto;
		margin: 0;
		vertical-align: middle;
	}
}

@media (max-width: 600px) {
	.inner-container {
		padding: 0 20px;
	}

	.person {
		position: relative;
		padding: 10px 0 10px 33px;
		min-height: 30px;
		float: left;
		width: calc(100% / 4.4);
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.person .img {
		position: absolute;
		left: 0;
		top: 0;
		width: 50px;
		height: 50px;
		overflow: hidden;
	}

	#content .item {
		width: calc(100% / 1);
	}

	.form .fieldset {
		margin: 10px 0;
	}

	.form .btn-auth {
		display: block;
		width: 100%;
		margin: 0 0 10px;
	}

	.form input[type="checkbox"] {
		margin: 10px 5px 20px 0;
	}

	#main #header-secondary {
		height: 60px;
		background: #2f3444;
	}

	#main #header-secondary .inner-container {
		padding-left: 20px;
	}

	#main #header-secondary .filters {
		float: none;
	}

	#main #header-secondary .filters ul {
		display: flex;
	}

	#main #header-secondary .filters>ul>li {
		flex: 1;
		line-height: 40px;
		margin: 10px;
		text-align: center;
	}

	#main #header-secondary .filters>ul>li.genre-filter {
		position: inherit;
	}

	#main #header-secondary .filters ul li .dropdown-toggle {
		display: block;
	}

	#main #header-secondary .filters ul ul,
	.landing #main .secondaryheader i,
	.landing #main header h1 {
		display: none;
	}

	#main #header-secondary .filters ul li.search form {
		position: relative;
	}

	#main #header-secondary .filters ul li.search form i {
		position: absolute;
		left: 8px;
		top: 50%;
		margin-top: -7px;
	}

	#main #header-secondary .filters ul li.search form input {
		width: 100%;
	}

	#main #header-secondary .filters ul li.dropdown.open>ul {
		margin-top: 10px;
		text-align: left;
	}

	#main #header-secondary .filters ul li.dropdown.quality-filter.open>ul {
		left: auto;
		right: 0;
	}

	#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large {
		left: 0;
		right: 0;
		width: auto;
		margin-top: 0;
		box-sizing: border-box;
	}

	#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li input[type="checkbox"]+label {
		line-height: 40px;
	}

	.premium-packages {
		position: relative;
	}

	.premium-packages>li:first-child {
		position: absolute;
		left: 4px;
		right: 4px;
		margin-right: 0;
		width: auto;
		min-width: 0;
		max-width: 100%;
	}

	.premium-packages>li {
		min-width: 0;
	}

	.premium-packages>li.popular {
		width: 100%;
		min-width: 0;
	}

	.landing #main header {
		text-align: center;
	}

	.landing #main .secondaryheader {
		padding: 20px 30px;
	}

	.landing #main .secondaryheader h2 {
		display: block;
		text-align: center;
		line-height: 1.5em;
	}

	.landing #main #features ul li {
		display: block;
		width: 220px;
		margin: auto;
	}

	.landing-trial #main #features ul li {
		display: inline-block;
		width: 50%;
	}

	.landing-trial #main #features ul li i {
		color: rgba(255, 255, 255, 0.7);
		background: 0;
		padding: 0;
	}

	.landing-trial #main #landingform .left,
	.landing-trial #main #landingform .right {
		display: block;
		width: 100%;
	}

	#premium .options span {
		display: block;
	}
}

@media (max-width: 480px) {

	#main #main-header .header-nav li.register,
	.menu-icon-text,
	.tv-details-seasons ol li.active:after {
		display: none;
	}

	.notice .close-notice,
	.notice .close-notice i {
		position: relative;
		top: auto;
	}

	#main #main-header .logo {
		margin-left: -20px;
		right: 0;
	}

	#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li {
		width: 50%;
	}

	#content .item {
		width: calc(100% / 2);
	}

	.tv-details-episodes,
	.tv-details-seasons {
		width: 100%;
		padding: 0;
	}

	.tv-details-episodes {
		margin: 30px 0;
	}

	.landingpackages li {
		width: 50%;
	}

	.landingpackages li:last-child {
		width: 100%;
		margin-top: 20px;
	}

	.landing-trial #main #features ul li {
		display: block;
		width: 220px;
		margin: auto;
	}

	.landing-trial #main #features ul li i {
		color: #fff;
		background: rgba(255, 255, 255, 0.07);
		padding: 15px;
	}

	#premium {
		padding: 20px;
	}

	#premium #progressbar {
		padding: 30px 0;
	}

	.notice {
		font-size: 15px;
		padding: 20px 20px 0;
		text-align: center;
	}

	.notice .notice-icon {
		display: none;
	}

	.notice .close-notice {
		display: block;
		left: 0;
		right: 0;
		bottom: auto;
		margin: 20px -20px 0;
		padding: 5px;
		border-top: 2px solid rgba(41, 142, 234, 0.3);
		border-left: none;
	}

	.detail .movie-actions ul,
	.detail .tv-details .movie-actions ul {
		display: block;
		width: 100%;
	}

	.detail .movie-actions ul:first-child,
	.detail .movie-actions ul:last-child,
	.detail .tv-details .movie-actions ul:first-child,
	.detail .tv-details .movie-actions ul:last-child {
		padding: 0;
	}

	.tv-details-episodes-info {
		margin-top: 0;
	}
}

@media (max-width: 380px) {
	#main #header-secondary {
		height: 180px;
		padding: 10px 0;
	}

	#content .item .item-details span.movie-date {
		display: none;
	}

	#main #header-secondary .inner-container {
		height: initial;
	}

	#main #header-secondary .filters ul {
		display: block;
	}

	#main #header-secondary .filters>ul>li {
		position: inherit;
		display: block;
		margin: 10px 0;
	}

	#main #header-secondary .filters ul li.dropdown.open>ul {
		margin-top: 0;
	}

	#main #header-secondary .filters ul li.dropdown.open>ul.dropdown-menu-large li {
		width: 100%;
	}

	#main #header-secondary .filters ul li.dropdown.quality-filter.open>ul {
		left: 0;
	}

	#content {
		margin-top: 110px;
	}

	.landingpackages li {
		width: 100%;
		margin-top: 20px;
	}

	.landingpackages li:first-child {
		margin-top: 0;
	}

	#premium {
		padding: 0;
	}
}

@media (max-width: 1252px) {
	p#slogan {
		display: none;
	}
}

.wp-pagenavi {
	clear: both;
}

.wp-pagenavi a,
.wp-pagenavi a:link,
.wp-pagenavi a:visited,
.wp-pagenavi span.current {
	border: 1px solid #282c39;
	color: #fff;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-moz-box-shadow: inset 0 0 1px #fff;
	-ms-box-shadow: inset 0 0 1px #fff;
	-webkit-box-shadow: inset 0 0 1px #282c39;
	box-shadow: inset 0 0 1px #282c39;
	background: #fafafa;
	background-image: -moz-linear-gradient(top, #fafafa 0, #d5d4d4 100%);
	background-image: -ms-linear-gradient(top, #fafafa 0, #d5d4d4 100%);
	background-image: -o-linear-gradient(top, #fafafa 0, #d5d4d4 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2b2b45), color-stop(100%, #313151));
	background-image: -webkit-linear-gradient(top, #151d26 0, #292941 100%);
	background-image: linear-gradient(to bottom, #282c39 0, #282c39 100%);
	display: inline-block;
	line-height: 2.48em;
	height: 2.4em;
	text-decoration: none;
	margin: 0 0.3em 12px;
	padding: 0 0.85em;
	font-size: 12px;
	text-shadow: 0 1px 0 #39395f;
}

.wp-pagenavi .extend {
	display: none;
}

.wp-pagenavi span.current {
	background: #298eea;
	background-image: -moz-linear-gradient(top, #d5d4d4 0, #fafafa 100%);
	background-image: -ms-linear-gradient(top, #d5d4d4 0, #fafafa 100%);
	background-image: -o-linear-gradient(top, #d5d4d4 0, #fafafa 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #298eea), color-stop(100%, #fafafa));
	background-image: -webkit-linear-gradient(top, #298eea 0, #fafafa 100%);
	background-image: linear-gradient(to bottom, #298eea 0, #298eea 100%);
	border: 1px solid #151d26;
	moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.35);
	-ms-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.35);
	-webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.35);
}

.wp-pagenavi a:hover {
	border: 1px solid #aeacac !important;
	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
	-ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
}

@media (max-width: 1020px) {
	.detail #serie-tv {
		width: 100%;
		margin-top: 30px;
	}
}

@media (max-width: 1000px) {
	li#abc.dropdown.quality-filter {
		display: none !important;
	}
}

#site-container,
.sb-site-container,
.sidebar,
body,
html {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body,
html {
	width: 100%;
	overflow-x: hidden;
}

html {
	height: 100%;
}

body {
	min-height: 100%;
	height: auto;
	position: relative;
}

html.sb-scroll-lock.sb-active:not(.sb-static) {
	overflow: hidden;
}

#site-container,
.sb-site-container {
	width: 100%;
	min-height: 100vh;
	position: relative;
	z-index: 1;
}

#site-container:after,
#site-container:before,
.sb-site-container:after,
.sb-site-container:before {
	content: " ";
	display: table;
	clear: both;
}

.sidebar {
	height: 100%;
	overflow-y: auto;
	position: fixed;
	top: 0;
	z-index: 0;
	display: none;
	background-color: #121117;
}

.sidebar,
.sidebar * {
	-webkit-transform: translateZ(0);
}

.sb-left {
	left: 0;
}

.sb-right {
	right: 0;
}

.sidebar.sb-static,
html.sb-static .sidebar {
	position: absolute;
}

.sidebar.sb-active {
	display: block;
}

.sb-style-overlay {
	z-index: 9999;
}

.sb-momentum-scrolling {
	-webkit-overflow-scrolling: touch;
}

.sb-width-thin {
	width: 15%;
}

.sb-width-wide {
	width: 45%;
}

@media (max-width: 480px) {
	.sb-width-thin {
		width: 55%;
	}

	.sb-width-wide {
		width: 85%;
	}
}

@media (min-width: 481px) {
	.sb-width-thin {
		width: 40%;
	}

	.sb-width-wide {
		width: 70%;
	}
}

@media (min-width: 768px) {
	.sb-width-thin {
		width: 25%;
	}

	.sb-width-wide {
		width: 55%;
	}
}

@media (min-width: 992px) {
	.sb-width-thin {
		width: 15%;
	}

	.sb-width-wide {
		width: 45%;
	}
}

@media (min-width: 1200px) {
	.sb-width-thin {
		width: 5%;
	}

	.sb-width-wide {
		width: 35%;
	}
}

#site-container,
.sb-site-container,
.sb-slide,
.sidebar {
	-webkit-transition: -webkit-transform 0.4s ease;
	-moz-transition: -moz-transform 0.4s ease;
	-o-transition: -o-transform 0.4s ease;
	transition: transform 0.4s ease;
	-webkit-transition-property: -webkit-transform, left, right;
	-webkit-backface-visibility: hidden;
}

.sb-hide {
	display: none;
}

.recommended,
.searched {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 -10px;
}

.movie-s img,
.movie-l img {
	width: 100%;
	border-radius: 10px;
}

.movie-s {
	width: 100%;
	flex: 1;
	min-width: 300px;
	margin: 1rem;
	position: relative;
	border-radius: 10px;
	overflow: hidden;
}

.movie-s .movie-info {
	display: flex;
	align-items: start;
	justify-content: space-between;
	padding: 0.5rem;
	letter-spacing: 0.5px;
	font-size: 12px;
}

.movie-s .movie-info h3 {
	margin-top: 0;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	/* Set the maximum number of lines before truncating */
	overflow: hidden;
}

.movie-s .movie-info span {
	font-size: 16px;
	white-space: nowrap;
}

.movie-s .overview.hidden {
	display: flex;
	flex-direction: column;
	justify-content: end;
	top: 0;
	bottom: 0;
	font-size: 12px;
	background: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0.281));
	position: absolute;
	padding: 1rem;
	opacity: 0;
	transition: opacity 0.5s ease;
	overflow: hidden;
	text-overflow: ellipsis;
}

.movie-s .overview.hidden p {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.movie-s .overview.hidden h3 {
	margin: 0;
}

.movie-s:hover .overview.hidden {
	opacity: 1;
}

.movie-s .movie-info_new {
	position: absolute;
	display: flex;
	align-items: start;
	justify-content: space-between;
	padding: 0.5rem;
	letter-spacing: 0.5px;
	font-size: 12px;
	top: 0px;
}

.movie-s .movie-info_new span {
	font-size: 16px;
	white-space: nowrap;
}

.watch-info-btn {
	border-radius: 5px;
	background-color: linear-gradient(to bottom, rgba(29, 27, 36, 0) 0, rgba(29, 27, 36, 1) 40%, rgba(29, 27, 36, 1) 100%);
	box-shadow: 0 2px 10px 0 #000;
	margin: 10px;
}

.watch-info-btn.centered {
	left: 50%;
	transform: translate(-50%, -50%);
}

.watch-info-btn.righted {
	left: 100%;
	transform: translate(-100%, -50%);
}

.watch-info-btn.hidden {
	left: 50%;
	opacity: 1;
	transform: translate(-50%, -50%) scale(0.5);
}

.watch-info-btn .portada {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 200px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.watch-info-btn .info {
	padding: 10px;
}

.watch-info-btn .info .botones,
.watch-info-btn .info .datos,
.watch-info-btn .info .tags {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-start;
	align-content: center;
}

.watch-info-btn .info .botones .boton {
	width: 40px;
	height: 40px;
	padding: 8px;
	border-radius: 50%;
	border: 2px solid #595959;
	background-color: rgba(255, 255, 255, 0.05);
	box-sizing: border-box;
	position: relative;
}

.watch-info-btn .info .botones .boton:not(.play):hover:before {
	content: attr(data-tooltip);
	position: absolute;
	bottom: 100%;
	left: 50%;
	width: max-content;
	padding: 10px 20px;
	border-radius: 3px;
	color: #000;
	font-size: 14px;
	font-weight: 600;
	background-color: #fff;
	transform: translate(-50%, -18px);
	box-shadow: 0 2px 10px 0 #000;
	z-index: 100;
}

.watch-info-btn .info .botones .boton:not(.play):hover:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	transform: translateY(-18px);
	border-top: 10px solid #fff;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 100;
}

.watch-info-btn .info .botones .boton:not(.arrow) {
	margin-right: 10px;
}

.watch-info-btn .info .botones .boton.arrow {
	margin-left: auto;
}

.watch-info-btn .info .botones .boton.play {
	border-color: #fff;
	background-color: #fff;
}

.watch-info-btn .info .botones .boton.play svg path {
	fill: #000;
	stroke-width: 0;
}

.watch-info-btn .info .botones .boton svg {
	width: 100%;
	height: 100%;
}

.watch-info-btn .info .botones .boton svg path {
	fill: none;
	stroke: #fff;
	stroke-width: 2;
	stroke-miterlimit: 10;
}

.watch-info-btn .info .datos {
	margin: 20px 0;
	font-weight: 600;
}

.watch-info-btn .info .datos .match {
	color: #46d369;
}

.watch-info-btn .info .datos .clasificacion {
	margin: 0 10px;
	padding: 4px 8px;
	font-size: 14px;
	border: 1px solid #fff;
}

.watch-info-btn .info .tags {
	flex-wrap: wrap;
	font-weight: 600;
}

.watch-info-btn .info .tags .tag {
	margin: 5px 5px 5px 0;
}

.watch-info-btn .info .tags .tag:not(:first-child):before {
	content: "•";
	margin-right: 5px;
	opacity: 0.5;
}

* {
	box-sizing: border-box;
}

::-webkit-scrollbar {
	/* Webkit */
	width: 0;
	height: 0;
}
/* ===== ROW ===== */
.hs {
    padding: 10px;
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
}
.hs__header {
	display: flex;
	align-items: center;
	width: 100%;
}

.view-all {
	padding: 8px 16px;
	background-color: #3498db;
	color: white;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 15px;
}

.hs__headline {
	flex: 1;
	color: white;
	font-size: 24px;
	font-weight: bold;
}

.hs__arrows {
	font-size: 15px;
	padding: 10px 16px;
	background-color: #3498db;
	color: white;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	margin-right: 15px;
}

.hs__arrows .arrow:before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	content: "";
	background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgMTUgOSI+Cgk8cGF0aCBmaWxsPSIjMzMzMzMzIiBkPSJNNy44NjcgOC41NzRsLTcuMjItNy4yMi43MDctLjcwOEw3Ljg2NyA3LjE2IDE0LjA1Ljk4bC43MDYuNzA3Ii8+Cjwvc3ZnPgo=");
	background-size: contain;
	filter: brightness(5);
	width: 18px;
	height: 12px;
	cursor: pointer;
}

.hs__arrows .arrow.disabled:before {
	filter: brightness(2);
}

.hs__arrows .arrow.arrow-prev:before {
	transform: rotate(90deg);
	margin-right: 10px;
}

.hs__arrows .arrow.arrow-next:before {
	transform: rotate(-90deg);
}

.hs__item {
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: calc(100% / 5 - (10px * 2) - (20px / 4));
	margin: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.hs_new {
	display: flex;
	overflow-x: scroll;
	justify-content: space-between;
	scrollbar-width: none;
	/* Firefox */
	-ms-overflow-style: none;
	/* IE 10+ */
	-webkit-overflow-scrolling: touch;
	margin: 0 -10px;
}

.hs__item_new {
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: calc(100% / 3 - (10px * 2) - (20px / 4));
	margin-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.hs__item_lang {
    cursor: pointer;
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: calc(100% / 7 - (10px * 2) - (20px / 4));
	margin: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.hs__item_ott {
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: calc(100% / 6 - (10px * 2) - (20px / 4));
	margin: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	position: relative;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

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

	.hs__item,
	.hs__item_ott {
		flex-basis: calc(100% / 3 - (10px * 2) - (20px / 3));
	}
}

.hs__item:last-child:after {
	content: "";
	display: block;
	position: absolute;
	width: 10px;
	height: 1px;
	right: calc(10px * 2 * -1);
}

.hs__item:first-child {
	margin-left: calc(10px * 2);
}

.hs__item__image__wrapper {
	position: relative;
	width: 100%;
	height: 100%;
	/* padding-bottom: 153%; */
}

.hs__item__image {
	max-width: 250px;
	max-height: 350px;
	pointer-events: none;
	/* position: absolute; */
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

@media only screen and (min-width: 990px) {

	.hs__wrapper,
	.hs__wrapper_new,
	.hs__wrapper_lang {
		overflow: hidden;
	}

	.container {
		padding: calc(0px * 1) calc(0px * 1);
	}
}

@media (hover: none) and (pointer: coarse) {
	.hs__wrapper .hs__arrows {
		display: none;
	}

	.hs__wrapper .hs__item,
	.hs__wrapper_new .hs__item_new,
	.hs__wrapper_new .hs__item_lang,
	.hs__item_ott {
		flex: 1 0 calc(23% - 10px * 2);
	}

	.hs__wrapper_new .hs__arrows {
		display: none;
	}
}

@media only screen and (hover: none) and (pointer: coarse) and (max-width: 990px) {

	.hs__wrapper .hs__item,
	.hs__wrapper_new .hs__item_new,
	.hs__wrapper_new .hs__item_lang,
	.hs__item_ott {
		flex: 1 0 calc(45% - 10px * 2);
	}
}

.container {
	padding: calc(5px * 2);
	margin: 0 -10px;
	mix-blend-mode: invert;
	position: relative;
}

.container:after {
	content: "";
	width: 100vw;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	z-index: -1;
}


  .lang-circle {
  width: 80px;
  height: 80px;
  background: linear-gradient(to bottom, #88bbd4, #2e6fb0);
  border-radius: 50%;
  color: white;
  font-size: 45px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  margin:5px auto 0 auto;
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);

}

.lang-label {
  text-align: center;
  margin-top: 10px;
  color: white;
  font-weight: 500;
}


    .year-circle {
    width: 100px;
    height: 100px;
   background: linear-gradient(45deg, #ff7a18, #ff3cac, #784ba0);
    border-radius: 50%;
    color: white;
    font-size: 40px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 5px auto 0 auto;
    transition:transform 0.3s, box-shadow 0.3s;
}
.year-circle:hover{
  transform:translateY(-10px) scale(1.05);
  box-shadow:0 15px 35px rgba(0,0,0,0.4);
}


/* increasing sizes */
.year-y1 { font-size: 10px; }
.year-y2 { font-size: 20px; }
.year-y3 { font-size: 30px; }
.year-y4 { font-size: 55px; }
    .sidebar .mobile-nav a {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 1rem;
      color: #ffffff;
      text-decoration: none;
      font-size: 14px;
      transition: background-color 0.2s ease, color 0.2s ease;
      height: 100%;
      width: 100%;
    }
.sidebar .mobile-nav svg.icon {
    width: 70px;
    height: 34px;
    margin-bottom: 6px;
    stroke: currentColor;
    flex-shrink: 0;
}

    .sidebar .mobile-nav span {
      font-size: 13px;
      line-height: 1.2;
    }

.header-nav li a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: #1e1e2f;
  color: white;
  transition: background-color 0.3s;
}

.header-nav li a svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

.header-nav li a:hover {
  background-color: #00bcd4;
}
.dropdown-arrow {
  font-size: 16px;
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.dropdown-arrow::after {
  content: '▼'; /* Unicode arrow as fallback */
  font-size: 12px;
  margin-left: 5px;
  transition: transform 0.3s ease;
}

/* Optional: Rotate arrow on active/open state */
.dropdown-arrow.open::after {
  transform: rotate(180deg); /* flips the arrow */
}
.reels-row {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 10px;
  scroll-snap-type: x mandatory;
}

.reel-item {
  flex: 0 0 160px;       /* width */
  height: 280px;        /* 9:16 ratio */
  border-radius: 14px;
  overflow: hidden;
  position: relative;
  background: #000;
  cursor: pointer;
  scroll-snap-align: start;
}

.reel-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.reel-item::after {
  content: "▶";
  position: absolute;
  bottom: 8px;
  right: 8px;
  color: white;
  font-size: 18px;
  opacity: 0.8;
}


/* ===== ITEM ===== */
.ot_hs__item_ott {
  margin-right: calc(10px * 2);
  flex: 0 0 200px;
  height: 300px;
}

/* ===== CARD ===== */
.ot_item {
  width: 100%;
  height: 100%;
  perspective: 1000px;
}

.ot_item-flip {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.6s ease;
}

.ot_hs__item_ott:hover .ot_item-flip {
  transform: rotateY(180deg);
}

/* ===== FRONT ===== */
.ot_item-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  border-radius: 14px;
  border: 1px solid , #ffff;
}


.ot_item-inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 14px;
}


/* ===== BACK ===== */
.ot_item-details {
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #111, #000);
  border: 1px solid , #ffff;
  border-radius: 14px;
  padding: 14px;
  transform: rotateY(180deg);
  backface-visibility: hidden;
  display: flex;
  align-items: center;
}

.ot_item-details-inner {
  text-align: left;
}

.ot_movie-title {
  font-size: 16px;
  margin-bottom: 8px;
}

.ot_movie-description {
  font-size: 12px;
  opacity: 0.8;
  margin-bottom: 10px;
}

.ot_watch-btn {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ot_imdb-rating {
  color: #f5c518;
  font-size: 14px;
}

.ot_movie-date {
  font-size: 12px;
  opacity: 0.7;
}

.ot_play-text {
  font-weight: bold;
  color: #00c853;
}

/* ===== BUTTONS ===== */
.ot_botones {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.ot_boton {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #222;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 14px;
}

.ot_boton:hover {
  background: #00c853;
}

/* ===== MOBILE SAFE ===== */
@media (hover: none) {
  .hs__item_ott:hover .item-flip {
    transform: none;
  }
}

/* ===== SLIDWER ===== */

.slider {
    position: relative;
    overflow: hidden;
}

.bg {
    position: absolute;
    /* inset: 0; */
    background-size: cover;
    background-position: center;
    filter: blur(35px) brightness(0.4);
    transform: scale(1.2);
    transition: 0.8s ease;
    z-index: 0;
}



.card,
.btn {
    position: relative;
    z-index: 1;
}

/* Slider */
.slider{
    position:relative;
    height:500px;
    display:flex;
    justify-content:center;
    align-items:center;
    perspective:1200px;
    touch-action:pan-y;
    cursor:grab;
}

.slider.dragging{
    cursor:grabbing;
}

/* Cards */
.card{
    position:absolute;
    width:260px;
    height:380px;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,0.5);
    transition:0.55s ease;
    user-select:none;
    z-index:1;
}

.card img{
    width:100%;
    height:100%;
    object-fit:cover;
    pointer-events:none;
}

.card .extra{
    display:none;
}

.active .extra{
    display:block;
    margin-top:15px;
    font-size:15px;
    color:#ddd;
    line-height:1.3;
}

/* Info */
.info{
    position:absolute;
    left:50%;
    bottom:0;
    transform:translateX(-50%);
    width:100%;
    padding:14px;
    background:linear-gradient(transparent, rgba(0,0,0,0.9));
    color:#fff;
    text-align:center;
    transition:0.4s ease;
}
.active .info{
    background:rgba(0,0,0,0.75);
    backdrop-filter: blur(0px);
}



.name{
    font-size:16px;
    font-weight:bold;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.rating{ font-size:13px; color:#ffd700; margin-top:4px; }

/* States */
.active{
    transform:translateX(0) scale(1.35);
    box-shadow:0 20px 60px rgba(0,0,0,0.7);
    z-index:10;
}

.hidden{
    opacity:0;
    transform:scale(0.5);
    pointer-events:none;
}

.left{
    transform:translateX(-220px) scale(0.82) rotateY(25deg);
    opacity:.7;
    z-index:4;
}

.left2{
    transform:translateX(-430px) scale(.68) rotateY(35deg);
    opacity:.45;
    z-index:3;
}

.left3{
    transform:translateX(-620px) scale(.55) rotateY(45deg);
    opacity:.2;
    z-index:2;
}

.right{
    transform:translateX(220px) scale(.82) rotateY(-25deg);
    opacity:.7;
    z-index:4;
}

.right2{
    transform:translateX(430px) scale(.68) rotateY(-35deg);
    opacity:.45;
    z-index:3;
}
.right3{
    transform:translateX(620px) scale(.55) rotateY(-45deg);
    opacity:.2;
    z-index:2;
}

/* Buttons */
.slibtn{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    background:#ff4d4d;
    color:#fff;
    font-size:22px;
    cursor:pointer;
    z-index:9999;
}

.leftBtn{ left:20px; }
.rightBtn{ right:20px; }

/* =========================
   RATING BADGE (ON IMAGE)
========================= */
.card .rating{
    position: absolute;
    top:12px;
    left:12px;
    padding:6px 10px;
    font-size:15px;
    font-weight:bold;
    color:#111;
    white-space: nowrap;
    border-radius: 20px;
    background: #ffd700;
    z-index:5;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
}



/* Mobile */
@media(max-width:768px){
.slider{
    height:600px;
    margin-bottom:10px;
}
    
.card{
    height:580px;
    width:100%;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%) scale(0.9);
}

.card img{
    width:100%;
    height:100%;
    pointer-events:none;
}

.active{
    transform:translate(-50%,-50%) scale(1);
    opacity:1;
}

.left2,
.left3,
.right2,.hidden{
    opacity:0;
    pointer-events:none;
}

}

.slider, .card{
    pointer-events:auto;
}


     :root {
    --cyan: #48e8ff;
    --purple: #8b5cf6;
} 
      
      
/* =========================================================
   FOOTER
========================================================= */
.ott-footer {
    background: linear-gradient(
        to right,
        #001d36,
        #00031d
    );
    color: #b8c4d1;
}



/* =========================================================
   MAIN CONTAINER
========================================================= */
.footer-container {
    width: min(1336px, calc(100% - 40px));
    margin: auto;
    padding: 40px 0 11px;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 55px;
    background: linear-gradient(
        to right,
        #001d36,
        #00031d
    );
}

/* =========================================================
   BRAND
========================================================= */
.footer-logo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #ffffff;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.5px;
  margin-bottom: 17px;
}

.footer-logo span {
  color: #e50914;
}

.brand-desc {
  text-align: center;
  max-width: 350px;
  margin: 0 0 22px;
  color: #8d929d;
  font-size: 14px;
  line-height: 1.75;
}

.copyright {
  margin: 0;
  color: #626773;
  font-size: 12px;
}

/* =========================================================
   COLUMN HEADINGS
========================================================= */
.footer-col h4 {
  margin: 0 0 20px;
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* =========================================================
   LINKS
========================================================= */
.footer-col ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-col li {
  margin-bottom: 13px;
}

.footer-col li:last-child {
  margin-bottom: 0;
}

.footer-col a {
    letter-spacing: 0.5px;
    line-height: 15px;
    color: #858b96;
    font-size: 14px;
    text-decoration: none;
    transition: color .2s ease, padding-left .2s ease;
}

.footer-col a:hover {
  color: #ffffff;
  padding-left: 3px;
}


/* =========================================================
   TABLET
========================================================= */
@media (max-width: 950px) {
  .footer-container {
    grid-template-columns: 1fr 1fr;
    gap: 40px 45px;
  }

  .brand-col {
    grid-column: 1 / -1;
  }

  .brand-desc {
    max-width: 600px;
  }
}

/* =========================================================
   MOBILE ACCORDION & RESPONSIVE STYLES
========================================================= */
@media (max-width: 600px) {
  .footer-container {
    width: calc(100% - 30px);
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .brand-col {
    text-align: center;
    border-bottom: 1px solid #545d77;
}

  .footer-logo {
    font-size: 20px;
  }

  .brand-desc {
    max-width: 430px;
    margin-left: auto;
    margin-right: auto;
    font-size: 13px;
    line-height: 1.7;
  }

  .footer-col:not(.brand-col) {
    border-bottom: 1px solid #1c1f27;
  }

  .footer-col:not(.brand-col) h4 {
    position: relative;
    margin: 0;
    padding: 18px 28px 18px 0;
    font-size: 13px;
    cursor: pointer;
  }

  .footer-col:not(.brand-col) h4::after {
    content: "+";
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    color: #777d88;
    font-size: 20px;
    font-weight: 300;
  }

  /* Hide lists by default on mobile */
  .footer-col:not(.brand-col) ul,
  .footer-col:not(.brand-col) .support-text{
    display: none;
  }

  .footer-bottom {
    width: calc(100% - 30px);
    padding: 20px 0 35px;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: 16px;
  }

  .footer-bottom-left {
    flex-direction: column;
    gap: 10px;
  }
}

/* =========================================================
   SMALL PHONES
========================================================= */
@media (max-width: 380px) {
  .footer-container,
  .footer-bottom {
    width: calc(100% - 24px);
  }

  .footer-logo {
    font-size: 18px;
  }

  .brand-desc {
    font-size: 12px;
  }
}


/* =====================================================
   BRAND
===================================================== */

.brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.brand-icon {
    position: relative;
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;

    border: 1px solid rgba(255, 255, 255, 0.12);

    box-shadow:
        0 0 30px rgba(72, 232, 255, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.filter-line {
    position: absolute;
    height: 3px;
    border-radius: 10px;
    background: linear-gradient(
        90deg,
        var(--cyan),
        var(--purple)
    );

    box-shadow: 0 0 10px rgba(72, 232, 255, 0.45);
}

.line-1 {
    width: 28px;
    top: 15px;
}

.line-2 {
    width: 21px;
    top: 23px;
}

.line-3 {
    width: 14px;
    top: 31px;
}

.logo-play {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 9px solid white;
    left: 22px;
    top: 20px;
    opacity: 0.95;
}

.brand-name {
    font-size: 29px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.brand-name .ott {
    color: #ffffff;
}

.brand-name .filter {
    background: linear-gradient(
        100deg,
        var(--cyan),
        #60a5fa,
        var(--purple)
    );

    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.divider {
    width: 55px;
    height: 2px;
    margin: 32px auto;
    border-radius: 10px;
    background: linear-gradient(
        90deg,
        transparent,
        #4febfe,
        transparent
    );
}

.logo-icon {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #4febfe;
    box-shadow: 0 0 18px rgba(79, 235, 254, 0.9);
}



.headline-container {
    text-align: center;
    padding: calc(5px * 2);
    margin: 0 -10px;
    mix-blend-mode: invert;
    position: relative;
} 

.headline-container:after {
	content: "";
	width: 100vw;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	z-index: -1;
}

.headline-container h1 {
    position: relative;
    max-width: 950px;
    margin: auto;
    font-size: clamp(44px, 7vw, 78px);
    line-height: 1.02;
    letter-spacing: -1px;
}
.headline-gradient {
    background: linear-gradient(
        100deg,
        #ffffff 25%,
        #d7faff 55%,
        #48e8ff
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.headline-container p {
    letter-spacing: 0.8px;
    margin: auto;
    color: #94a3b8;
    font-size: 17px;
    line-height: 1.8;
}

@media only screen and (min-width: 990px) {
	.headline-container {
        margin: 20px;
        padding: calc(0px * 1) calc(0px * 1);
    }
}

/* =====================================================
   SECTION HEADING
   ===================================================== */
.section-heading {
    margin: auto;
    text-align: center;
}

.section-heading h2 {
    font-size: clamp(31px, 4vw, 48px);
    line-height: 1.12;
    letter-spacing: -2px;
}

.section-heading p {
    margin-top: 15px;
    color: #94a3b8;
    font-size: 16px;
}

.section-heading .eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 16px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #a78bfa;
}

.section-heading .eyebrow::before,
.section-heading .eyebrow::after {
    content: "";
    width: 100px;
    height: 10px;
    border-radius: 10px;
    background: linear-gradient(90deg, transparent, #8b5cf6);
}

.section-heading .eyebrow::after {
    background: linear-gradient(90deg, #8b5cf6, transparent);
}


/* =====================================================
   FILTER PREVIEW
   ===================================================== */

.filter-demo {
    max-width: 1000px;
    margin: 48px auto 0;
    padding: 25px;
    border: 1px solid rgba(1, 45, 83, 0.7);
    border-radius: 22px;
    background: linear-gradient(
        135deg,
        rgba(1, 45, 83, 0.55),
        rgba(0, 4, 40, 0.85)
    );
    box-shadow: 0 20px 70px rgba(0, 0, 0, 0.45);
}


.filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.filter1 {
    padding: 9px 13px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 9px;
    background: rgba(0, 4, 40, 0.55);
    color: #d4d4d8;
    font-size: 13px;
}


.filter1.live {
    color: #ddd6fe;
    border-color: rgba(139, 92, 246, 0.35);
    background: rgba(139, 92, 246, 0.12);
}


/* =====================================================
   MOVIE PREVIEW GRID & CARDS
   ===================================================== */
.movie-preview-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 25px;
}

.movie-card {
    overflow: hidden;
    border: 1px solid rgba(80, 160, 220, 0.18);
    border-radius: 13px;
    background: rgba(0, 4, 40, 0.65);
    box-shadow: 0 10px 35px rgba(0, 0, 0, 0.3);
}

.movie-poster {
    aspect-ratio: 2 / 1;
    display: grid;
    place-items: center;
    background: linear-gradient(
        145deg,
        rgba(1, 45, 83, 0.65),
        rgba(0, 4, 40, 0.75)
    );
    color: #8b5cf6;
    font-size: 50px;
}


.movie-info {
    padding: 13px;
}

.movie-title {
    color: white;
    font-size: 13px;
    font-weight: 700;
}

.movie-meta {
    margin-top: 5px;
    color: #71717a;
    font-size: 11px;
}


/* =====================================================
   DETAILS CONTAINER & HEADLINE CONTENT
   ===================================================== */
.details-container {
    padding: calc(5px * 2);
    margin: 0 -10px;
    mix-blend-mode: invert;
    position: relative;
} 

.details-container::after {
    content: "";
    width: 100vw;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    z-index: -1;
}

.headline-content {
    max-width: 850px;
    margin: auto;
}

.headline-content h2 {
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 34px;
    letter-spacing: -1px;
}

.headline-content h3 {
    font-weight: bold;
    margin-top: 34px;
    margin-bottom: 9px;
    font-size: 22px;
}

.headline-content p {
    margin-bottom: 17px;
    color: #b4b4bd;
    font-size: 15px;
}



/* =====================================================
   MEDIA QUERIES
   ===================================================== */
@media only screen and (min-width: 990px) {
    .details-container {
        margin: 20px;
        padding: calc(0px * 1) calc(0px * 1);
    }
}
@media (max-width: 600px) {
    .filter-demo {
        padding: 17px;
    }
    .movie-preview-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 900px) {
    .movie-preview-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* =====================================================
   DISCOVERY TOPICS
   ===================================================== */
.topic-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 10px;
}

.topic {
    --topic-color: #8b5cf6;

    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 18px;

    border: 1px solid color-mix(
        in srgb,
        var(--topic-color) 30%,
        transparent
    );
    border-radius: 999px;

    background: color-mix(
        in srgb,
        var(--topic-color) 7%,
        #111119
    );

    color: #f4f4f5;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.01em;
    cursor: pointer;

    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease,
        color 0.25s ease;
}

.topic::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-right: 9px;
    border-radius: 50%;
    background: var(--topic-color);

    box-shadow: 0 0 8px color-mix(
        in srgb,
        var(--topic-color) 70%,
        transparent
    );

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.topic:hover {
    transform: translateY(-3px);
    color: var(--topic-color);
    border-color: var(--topic-color);

    background: color-mix(
        in srgb,
        var(--topic-color) 12%,
        #171720
    );

    box-shadow: 0 8px 30px color-mix(
        in srgb,
        var(--topic-color) 18%,
        transparent
    );
}

.topic:hover::before {
    transform: scale(1.5);
    box-shadow: 0 0 14px var(--topic-color);
}


/* =====================================================
   TOPIC COLORS
   ===================================================== */
.topic:nth-child(1)  { --topic-color: #8b5cf6; }
.topic:nth-child(2)  { --topic-color: #48e8ff; }
.topic:nth-child(3)  { --topic-color: #ec4899; }
.topic:nth-child(4)  { --topic-color: #22c55e; }
.topic:nth-child(5)  { --topic-color: #facc15; }
.topic:nth-child(6)  { --topic-color: #f97316; }
.topic:nth-child(7)  { --topic-color: #fb7185; }
.topic:nth-child(8)  { --topic-color: #c084fc; }
.topic:nth-child(9)  { --topic-color: #3b82f6; }
.topic:nth-child(10) { --topic-color: #f43f5e; }
.topic:nth-child(11) { --topic-color: #ef4444; }
.topic:nth-child(12) { --topic-color: #14b8a6; }
.topic:nth-child(13) { --topic-color: #8b5cf6; }
.topic:nth-child(14) { --topic-color: #6366f1; }
.topic:nth-child(15) { --topic-color: #f97316; }
.topic:nth-child(16) { --topic-color: #10b981; }

@media (max-width: 600px) {
    .topic-grid {
        gap: 9px;
    }
    .topic {
        padding: 9px 14px;
        font-size: 15px;
    }
    .topic::before {
        width: 6px;
        height: 6px;
        margin-right: 7px;
    }
}


.footer {
    bottom: 25px;
    left: 0;
    right: 0;
    text-align: center;
    color: rgba(255, 255, 255, 0.3);
    font-size: 11px;
    letter-spacing: 0.5px;
}

  .footer-bottom {
    padding: 18px 0 30px;
    text-align: center;
    border-top: 1px solid #1f2330;
  }

  .footer-bottom-left {
    flex-direction: column;
    gap: 8px;
  }
}
  /* Hide lists by default on mobile */
  .footer-col:not(.brand-col) ul,
  .footer-col:not(.brand-col) .support-text,
  .footer-col:not(.brand-col) .app-badges,
  .footer-col:not(.brand-col) .social-links {
    display: none;
  }

  /* Open State for Accordion */
  .footer-col.open ul,
  .footer-col.open .support-text,
  .footer-col.open .app-badges,
  .footer-col.open .social-links {
    display: block;
    padding-bottom: 18px;
  }

  .footer-col.open .social-links,
  .footer-col.open .app-badges {
    display: flex;
  }

  .footer-col.open h4::after {
    content: "−";
  }

  .footer-col.open ul li {
    margin-bottom: 12px;
  }
