/* À dé-commenter quand on implémentera les polices d'écritures. Et les @font-face à supprimer dans ce fichier */
/* @import url("global-fonts.css"); */
@font-face {
	font-family: "Institute";
	src: url("../assets/fonts/LTInstitute.otf") format("opentype");
}

@font-face {
	font-family: "Flipahaus";
	src: url("../assets/fonts/Flipahaus.otf") format("opentype");
}

@font-face {
	font-family: "Flipahaus Italic";
	src: url("../assets/fonts/Flipahaus-Italic.otf") format("opentype");
}

@font-face {
	font-family: "Flipahaus Bold";
	src: url("../assets/fonts/Flipahaus-Bold.otf") format("opentype");
}

@font-face {
	font-family: "Flipahaus Bold Italic";
	src: url("../assets/fonts/Flipahaus-BoldItalic.otf") format("opentype");
}

@font-face {
	font-family: "LTHoop Regular";
	src: url("../assets/fonts/LTHoop-Regular.otf") format("opentype");
}

@font-face {
	font-family: "LTHoop SemiBold";
	src: url("../assets/fonts/LTHoop-SemiBold.otf") format("opentype");
}

@font-face {
	font-family: "LTInternet Regular";
	src: url("../assets/fonts/LTInternet-Regular.ttf");
}

@font-face {
	font-family: "Inter Regular";
	src: url("../assets/fonts/Inter-Regular.ttf");
}


/** Ultra Light */
@font-face {
	font-family: "Saint-Michel";
	font-weight: 100;
	src: url("../assets/fonts/saintmichel-ultralight-webfont.woff");
}

/** Thin */
@font-face {
	font-family: "Saint-Michel";
	font-weight: 200;
	src: url("../assets/fonts/saintmichel-thin-webfont.woff");
}

/** Regular */
@font-face {
	font-family: "Saint-Michel";
	font-weight: 400;
	src: url("../assets/fonts/saintmichel-regular-webfont.woff");
}

/** Medium */
@font-face {
	font-family: "Saint-Michel";
	font-weight: 500;
	src: url("../assets/fonts/saintmichel-medium-webfont.woff");
}

/** Semi Bold */
@font-face {
	font-family: "Saint-Michel";
	font-weight: 600;
	src: url("../assets/fonts/saintmichel-semibold-webfont.woff");
}

/** Bold */ 
@font-face {
	font-family: "Saint-Michel";
	font-weight: 700;
	src: url("../assets/fonts/saintmichel-bold-webfont.woff");
}


@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansRegular.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansBlack.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansBold.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansExtrabold.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansLight.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansMedium.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansSemibold.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkRegular.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkBlack.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkBold.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkExtrabold.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkLight.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkMedium.woff') format('woff');
}

@font-face {
	font-family: "xBuddy Sans Dark";
	font-style: normal;
	font-weight: 500;
	src: url('../assets/fonts/xBuddySansDarkSemibold.woff') format('woff');
}

* {
	scrollbar-color: #545454 #f1f1f100;
}

html {
	scroll-behavior: smooth;
}

/* width */
/*::-webkit-scrollbar {*/
/*	width: 6px;*/
/*	height: 6px;*/
/*}*/

/* Track */
/*::-webkit-scrollbar-track {*/
/*	background: #f1f1f1;*/
/*}*/
 
/* Handle */
/*::-webkit-scrollbar-thumb {*/
/*	background: #888;*/
/*}*/

/* Handle on hover */
/*::-webkit-scrollbar-thumb:hover {*/
/*	background: var(--mw-purple); /*#555;*/
/*}*/


@keyframes fadein {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes fadeout {
	from {
		opacity: 1;
	}
	to {
		opacity: 0;
	}
}

@keyframes fadein_cinema {
	from {
		opacity: 0;
	}
	to {
		opacity: .2;
	}
}

@keyframes fadeout_cinema {
	from {
		opacity: .2;
	}
	to {
		opacity: 0;
	}
}

@keyframes blurin {
	from {
		filter: blur(10px);
	}
	to {
		filter: blur(0);
	}
}

@keyframes pulse {
	0% {
		transform: scale(0.95);
	}
	70% {
		transform: scale(1.00);
	}
	100% {
		transform: scale(0.95);
	}
}

@keyframes zoomin {
	0% {
		transform: scale(0);
	}
	100% {
		transform: scale(1);
	}
}

@keyframes avatar_zoomin {
	0% {
		transform: scale(0.4);
	}
	100% {
		transform: scale(1);
	}
}

@keyframes slide_top {
	from {
		top: 100vh;
	}
	to {
		top: 0;
	}
}

@keyframes channel_points_popup {
	from {
		opacity: 0;
		top: 0;
	}
	to {
		opacity: 1;
		top: -12px;
	}
}

@keyframes contentFadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes contentFadeOut {
	from {
		opacity: 1;
		z-index: 2;
	}
	to {
		opacity: 0;
		z-index: -1;
	}
}

@keyframes preview_caption_animation {
	from {
		bottom: 40px;
	}
	to {
		bottom: 0px;
	}
}

@-webkit-keyframes dash {
	0% {
		stroke-dashoffset: 1000;
	}
	100% {
		stroke-dashoffset: 0;
	}
}

@keyframes dash {
	0% {
	stroke-dashoffset: 1000;
	}
	100% {
		stroke-dashoffset: 0;
	}
}

@-webkit-keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}
	100% {
		stroke-dashoffset: 900;
	}
}

@keyframes dash-check {
	0% {
		stroke-dashoffset: -100;
	}
	100% {
		stroke-dashoffset: 900;
	}
}

@keyframes image_zoomin {
	0% {
		transform: scale(0.6);
	}
	100% {
		transform: scale(1);
	}
}

@keyframes like-heart-animation {
	0% {
		opacity: 0;
		font-size: 0px;
	}
	15% {
		opacity: 0.9;
		font-size: 120px;
	}
	30% {
		font-size: 95px;
	}
	45%,
	80% {
		opacity: 0.9;
		font-size: 100px;
	}
}

@keyframes shine {
	to {
		background-position-x: -200%;
	}
}

@keyframes displaynone {
	0% {
		opacity: 1;
	}
	99% {
		opacity: 0;
	}
	100% {
		opacity: 0;
		display: none;
	}
}

/* Bientôt obsolète */
@keyframes show_user_menu_height {
	0% {
		max-height: 0px;
	}
	100% {
		max-height: 100vh;
	}
}

@keyframes gradient {
	0% {
		background-position: top left;
	}
	100% {
		background-position: bottom right;
	}
}

@keyframes gradient_reverse {
	0% {
		background-position: bottom right;
	}
	100% {
		background-position: top left;
	}
}

@keyframes input_expand {
	from {
		width: 0px;
	}
	to {
		width: 300px;
	}
}

@keyframes community_button {
	from {
		background-color: var(--mw-content-background);
	}
	to {
		background-color: var(--mw-title);
	}
}

@keyframes open_description {
	from {
		background-color: var(--mw-title);
	}
	to {
		background-color: var(--mw-content-background);
	}
}

@keyframes interactions_button {
	from {
		background-color: var(--mw-gray);
	}
	to {
		background-color: var(--mw-background);
	}
}

@keyframes stroke-draw {
	from {
		stroke: #8a3ab9;
		stroke-dasharray: 1;
	}
	to {
		stroke: #cd486b;
		transform: rotate(180deg), translate(-50%, -50%);
		stroke-dasharray: 8;
	}
}

@keyframes noise {
	0% {
		transform: translateX(0px,0px);
	}
	10% {
		transform: translate(-100px, 100px);
	}
	20% {
		transform: translate(150px, -100px);
	}
	30% {
		transform: translate(-100px,100px);
	}
	40% {
		transform: translate(100px, -150px);
	}
	50% {
		transform: translate(-100px, 200px);
	}
	60% {
		transform: translate(-200px, -100px);
	}
	70% {
		transform: translateY(50px, 100px);
	}
	80% {
		transform: translate(100px, -150px);
	}
	90% {
		transform: translate(0px, 200px);
	}
	100% {
		transform: translate(-100px, 100px);
	}
}

@media screen and (min-width: 1745px){
	.inner_btns {
		width: calc(calc(100% / 8) * 6 - 80px) !important;
		margin: 0 auto 12px auto !important;
	}
}

@media screen and (min-width: 1521px) and (max-width: 1744px){
	.watch_reels{
		grid-template-columns: repeat(6, calc(calc(100% / 7) - 9px));
	}

	.inner_btns {
		width: calc(calc(100% / 7) * 6 - 92px);
		margin: 0 auto 12px auto !important;
	}
}

@media screen and (min-width: 1341px) and (max-width: 1520px){
	.watch_reels{
		grid-template-columns: repeat(6, calc(calc(100% / 6) - 8px));
	}

	.inner_btns {
		margin: 0 50px 12px 50px !important;
	}
}

@media screen and (min-width: 1261px) and (max-width: 1340px){
	.watch_reels{
		grid-template-columns: repeat(5, calc(calc(100% / 5) - 8px));
	}

	.inner_btns {
		margin: 0 50px 12px 50px !important;
	}
}

@media screen and (min-width: 941px) and (max-width: 1260px){
	.watch_reels{
		grid-template-columns: repeat(4, calc(calc(100% / 4) - 7px));
	}

	.inner_btns {
		margin: 0 50px 12px 50px !important;
	}
}

@media screen and (min-width: 721px) and (max-width: 940px){
	.watch_reels{
		grid-template-columns: repeat(3, calc(calc(100% / 3) - 7px));
	}

	.inner_btns {
		margin: 0 50px 12px 50px !important;
	}
}

@media screen and (min-width: 621px) and (max-width: 689px){
	.watch_reels{
		grid-template-columns: repeat(3, calc(calc(100% / 3) - 7px));
		padding: 10px !important;
	}

	.inner_btns {
		margin: 0 10px 12px 10px;
	}
}

@media screen and (max-width: 620px){
	.watch_reels{
		width: 100dvw !important;
		display: grid;
		gap: 1px !important;
		grid-template-columns: repeat(3, calc(calc(100dvw / 3) - 1px));
		padding: 0 !important;
	}

	.inner_btns {
		margin: 0 0 10px 0;
	}

	.inner_btns div:first-child {
		grid-gap: 0;
	}

	.reel_frame{
		min-width: auto;
		border-radius: 0;
	}

	.watch_reels .border-radius-12{
		border-radius: 0;
	}

	[class*="views_date_"]{
		margin: 5px auto;
		font-size: 12px;
	}

	.reel_self_frame > [class*="duration_"] {
		position: absolute;
		font-size: 14px;
		font-weight: 500;
		color: #FFF;
		background-color: #000000db;
		top: 5px;
		left: 5px;
		bottom: unset;
		right: unset;
		padding: 2px 5px;
		border-radius: 5px;
	}

	.reel_self_frame video {
		width: 63% !important;
		aspect-ratio: 9/13;
	}
}

@media screen and (min-width: 1180px){
	@keyframes show_studio_menu{
	  from{
		left: 0;
		width: 0;
	  }
	  to{
		left: 0;
		width: 300px;
	  }
	}

	@keyframes hide_studio_menu{
	  from{
		left: 0;
		width: 0;
	  }
	  to{
		left: 0;
		width: 70px;
	  }
	}
}

html, 
body{
	width: 100%;
	min-height: -webkit-fill-available;
	min-height: -moz-available;
	padding: 0;
	margin: 0;
	background-color: var(--mw-background);
	color: var(--mw-text);
	font-size: 17px;
}

body[data-content] #page_body,
body[data-list] #page_body,
body[data-page=lives] #page_body {
	all: unset;
}

body[data-content] #header_body,
body[data-list] #header_body,
body[data-page=lives] #header_body {
	all: unset;
	display: none;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: -apple-system, "Saint-Michel" , sans-serif;
}

:root{
	--plyr-color-main: linear-gradient(145deg, rgba(87,212,255,1) 0%, rgba(205,86,255,1) 100%);
	--swiper-theme-color: var(--mw-purple);
	/*--tag-bg: var(--mw-purple);*/
	--tag-bg: var(--mw-background);
	--tag-text-color: var(--mw-text);
	--tag-hover: var(--mw-content-background);
	--tag-text-color--edit: var(--mw-text);
	--tagify-dd-color-primary: var(--mw-input-background);
	--tagify-dd-bg-color: var(--mw-input-background);
	--swiper-theme-color: var(--mw-purple);
}

mw-title{
	display: none;
}

.x_shortcode {
	width: 15px;
	height: 15px;
	position: relative;
	top: 1px;
}

.fancy {
	text-align: center;
	overflow: hidden;
	height: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.fancy span {
	font-size: 10px;
	display: inline-block;
	position: relative;  
}

.fancy span:before, .fancy span:after {
	content: "";
	position: absolute;
	height: 5px;
	border-bottom: 1px solid #2a2a2a;
	top: 0;
	width: 600px;
}

.fancy span:before {
	right: 100%;
	margin-right: 15px;
}

.fancy span:after {
	left: 100%;
	margin-left: 15px;
}

.general_margin{
	margin-left: 50px;
	margin-right: 50px;
}

.content_contenair{
	position: relative;
	width: 100%;
}

#content{
	margin-top: -6px;
	padding-top: 12px !important;
}


.border-radius-12 .plyr .plyr__controls, .border-radius-12 .plyr .plyr__control--overlaid{
	display: none;
}

.tagify{
	$tag-bg : var(--mw-input-background) !default;
}

.tagify__dropdown__wrapper{
	border: none;
	border-radius: 4px;
	margin-top: 2px;
	padding: 4px;
}

.tagify__dropdown__wrapper .tagify__dropdown__item:hover{
	background-color: var(--mw-dark);
}

.users-list .tagify__dropdown__wrapper{
	background: var(--mw-thumbnails-background);
	padding: 0px;
	border-radius: 0 0 var(--mw-half-radius) var(--mw-half-radius);
}

tags.tagify.set_channel.tagify--noTags.tagify--empty[aria-expanded="true"]{
	border-radius: var(--mw-half-radius) var(--mw-half-radius) 0 0;
}

.users-list .tagify__dropdown__wrapper:hover{
	background: var(--mw-thumbnails-background);
}

.users-list .tagify__dropdown__wrapper .tagify__dropdown__item{
	height: 50px;
	padding: 5px;
}

.invisible{
	display: none;
}

.contenair{
	margin-top: 50vh; /* poussé de la moitié de hauteur de viewport */
	transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
}

a{
	color: var(--mw-purple);
	text-decoration: none;
}

a:hover{
	text-decoration: underline;
}

.display_none{
	display: none;
}

.thumbnail_upload:hover > .display_none{
	display: block;
}

.banner_edit:hover > .display_none{
	display: block;
}

.avatar_edit:hover > .display_none{
	display: block;
}

.alert{
	color: #000;
	display: flex;
	padding: 20px;
	width: 50%;
	min-width: 300px;
	margin: auto;
	margin-bottom: 50px;
	background-color: var(--mw-alert-blue);
	border: 1px solid var(--mw-alert-blue-border);
	border-radius: 12px;
	align-items: center;
	justify-content: center;
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.alert-green{
	color: #000;
	display: flex;
	padding: 20px;
	width: 50%;
	min-width: 300px;
	margin:auto;
	margin-bottom: 50px;
	background-color: var(--mw-alert-green);
	border: 1px solid var(--mw-alert-green-border);
	border-radius: 12px;
	align-items:center;
	justify-content:center;
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.alert-orange{
	color: #000;
	display: flex;
	padding: 20px;
	width: 50%;
	min-width: 300px;
	margin: auto;
	margin-bottom: 50px;
	background-color: var(--mw-alert-orange);
	border: 1px solid var(--mw-alert-orange-border);
	border-radius: 12px;
	align-items: center;
	justify-content: center;
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.button{
	border-radius: var(--mw-buttons-radius);
	border: none;
	background: linear-gradient(145deg, rgba(87,212,255,1) 0%, rgba(205,86,255,1) 100%);
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	padding: 12px 30px;
	letter-spacing: 1px;
	text-transform: uppercase;
	transition: transform 80ms ease-in;
	cursor: pointer;
	margin-top: 16px;
	transition: all .2s;
}

.button:disabled, .button[disabled], .btn:disabled, .btn[disabled], .btn[disabled]:hover{
	border: 1px solid #999999;
	background: #cccccc;
	color: #666666;
	cursor: wait;
}

.button:hover, .button:active{
	box-shadow: var(--mw-purple) 0px 5px 15px;
	transition: all .2s;
}

form{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 0 5px;
	text-align: center;
}

input{
	color: var(--mw-text);
	background-color: var(--mw-input-background);
	border: none;
	padding: 10px 18px;
	margin: 8px 0;
	width: 100%;
	border-radius: var(--mw-half-radius);
	font-size: 16px;
	outline: none;
}

select{
	color: var(--mw-text);
	background-color: var(--mw-input-background);
	padding: 10px;
	padding-left: 16px;
	margin-top: 5px;
	font-size: 16px;
	border: 0px;
	border-radius: 4px;
	width: 280px;
	-webkit-appearance: none;
}

textarea{
	color: var(--mw-text);
	background-color: var(--mw-input-background);
	border: none;
	padding: 10px 18px;
	margin: 8px 0;
	width: 100%;
	border-radius: var(--mw-half-radius);
	font-size: 16px;
	outline: none;
}

.tagify{
	color: var(--mw-text);
	background-color: var(--mw-input-background);
	border: none;
	padding: 0px;
	margin-top: 5px;
	width: 100%;
	border-radius: 4px;
	font-size: 16px;
	outline: none;
}

input:focus{
  box-shadow: var(--mw-box-shadow) 0px 8px 24px;
}

#search_bar input:focus{
	box-shadow: none;
}

/* clears the ‘X’ from Internet Explorer */
input[type=search]::-ms-clear{
	display: none;
	width: 0;
	height: 0;
}
input[type=search]::-ms-reveal{
	display: none;
	width: 0;
	height: 0;
}
/* clears the ‘X’ from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration{
	display: none;
}

input[type="checkbox"]{
	-webkit-appearance: none;
	appearance: none;
	background-color: var(--form-background);
	font-family: system-ui, sans-serif;
	font-size: 1.2rem;
	font-weight: bold;
	line-height: 1;
	margin: 0;
	padding: 8px 9px;
	color: currentColor;
	width: 5px;
	height: 5px;
	border: 0.15em solid currentColor;
	border-radius: 0.15em;
	transform: translateY(-0.075em);
	display: grid;
	place-content: center;
}

input[type="checkbox"]::before{
	content: "";
	width: 0.65em;
	height: 0.65em;
	clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
	transform: scale(0);
	transform-origin: bottom left;
	transition: 120ms transform ease-in-out;
	box-shadow: inset 1em 1em var(--form-control-color);
	background-color: CanvasText;
}

input[type="checkbox"]:checked::before{
	transform: scale(1);
}

input[type="checkbox"]:disabled{
	--form-control-color: var(--form-control-disabled);
	color: var(--form-control-disabled);
	cursor: not-allowed;
}

.live_avatar {
	position: relative;
	outline: 4px solid red !important;
	border: 2px solid var(--mw-dark);
}

.live_avatar::after {
	position: absolute;
	left: 50%;
	padding: 0px 4px;
	display: grid;
	justify-content: center;
	bottom: -9px;
	transform: translateX(-50%);
	content: "En direct";
	background-color: red;
	border-radius: var(--mw-label-radius);
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	white-space: nowrap;
	outline: 2px solid var(--mw-dark);
}

.live_block {
	padding-bottom: 50px;
	margin-bottom: 50px;
	display: grid;
	grid-gap: 20px;
	grid-template-columns: calc(50% - 20px) calc(50% - 20px);
	align-items: start;
	justify-content: center;
	border-bottom: 1px solid var(--mw-dark);
	-webkit-animation: fadein .3s;
	-moz-animation: fadein .3s;
	-ms-animation: fadein .3s;
	-o-animation: fadein .3s;
	animation: fadein .3s;
}

#live_clips, #live_replays {
	margin-top: 15px;
	margin-left: 0px;
	margin-right: 0px;
	position: relative;
}

.main_full_live .live_block.video_live {
	margin-bottom: unset;
	padding-top: 50px;
	aspect-ratio: unset;
	display: grid;
	grid-template-columns: calc(40% - 10px) calc(55% - 10px);
	align-items: start;
	justify-content: center;
	background-color: #000;
}

.live_block .status {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
}

 .status_info {
	font-size: 14px;
}

.status_offline .status_info {
	background-color: gray;
}

.status_online .status_info {
	background-color: red;
}

.status_title {
	font-size: 28px;
	line-height: 39px;
	margin-bottom: 10px;
	font-weight: bold;
}

.status_online .status_title {
	font-family: var(--mw-title-font);
	font-size: 2.0rem;
	line-height: 34px;
	margin-bottom: 10px;
	font-weight: bold;
	margin-top: 10px;
}

.status_online .status_live_title {
	font-family: var(--mw-title-font);
	font-size: 1.1rem;
	font-weight: bold;
}

.status_online .status_live_time {
	font-family: var(--mw-title-font);
	font-size: 1.2rem;
	font-weight: bold;
}

.status_online .is_in_live {
	font-variant: small-caps;
}

.live_block .player_live {
	background-color: #000000;
	padding: 8px 5px 5px 5px;
	border-radius: var(--mw-general-radius);
	width: 100%;
}

.stream_preview {
	position: relative;
	width: 100%;
	aspect-ratio: 16/9;
	background-color: #000000;
	border-radius: var(--mw-general-radius);
	overflow: hidden;
}

.submenu_active {
	border-left: 6px solid var(--mw-purple);
}

.submenu_active a{
	margin-left: 15px;
	color: var(--mw-text) !important;
}

.submenu_unactive a{
	padding-left: 21px;
}

.user_tag {
	font-weight: 550;
}

.categories {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--mw-thumbnails-background);
	padding: 2px 6px;
	border-radius: var(--mw-label-radius);
	color: var(--mw-text);
	font-size: 13px;
	font-weight: 500;
	text-overflow: ellipsis;
	overflow: hidden;
}

.studio_content{
	width: 100%;
	height: calc(100vh - 64px);
	position: absolute;
	background-color: var(--watch-studio-background);
	margin-top: 64px;
}

.studio_content_width{
	width: calc(100% - 300px);
	margin-left: 300px;
}

.studio_content_hide {
	width: calc(100vw - 70px);
	margin-left: 70px;
}

.studio_manager .trow{
	display: grid;
	grid-gap: 20px;
	grid-template-columns: minmax(200px, 250px) minmax(250px, 500px) 136px 120px 60px;
	align-items: center;
	z-index: 1;
}

.body_studio_manager {
	overflow-y: scroll;
	height: calc(100vh - 170px);
	padding-top: 3px;
	position: absolute;
	bottom: 0;
	top: 125px;
	left: 0;
	right: 0;
}

.body_studio_manager .row{
	display: grid;
	grid-gap: 20px;
	grid-template-columns: minmax(200px, 250px) minmax(250px, 500px) 136px 120px 60px;
	align-items: center;
	padding: 5px 10px 5px 10px;
	z-index: 1;
	border-bottom: 1px solid var(--mw-dark);
}

.body_studio_manager .row:hover {
	background-color: var(--mw-dark);
}

.body_studio_manager .row_description {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	align-items: flex-start;
}

.studio_thumbnail:hover .studio_manage_video_edit{
	visibility: visible;
}

.studio_manage_video_edit a{
	background-color: #3a3a3aeb;
}

.studio_manage_video_edit a:hover{
	background-color: #a1a1a1b3;
}

.studio_manage_video_edit{
	visibility: hidden;
	display: inline-flex;
	z-index: 1;
	position: relative;
	height: 100%;
	width: 100%;
}

.studio_manage_video_edit a:first-child{
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
}

.studio_manage_video_edit a:last-child{
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
}

.studio_manage_video_edit a:first-child, .studio_manage_video_edit a:last-child{
	width: 50%;
	backdrop-filter: blur(4px);
	text-decoration: none;
	color: var(--mw-text);
}

.studio_manage_video_edit a:first-child div, .studio_manage_video_edit a:last-child div{
	display: inline-grid;
	align-content: center;
	justify-content: center;
	align-items: center;
	justify-items: center;
	line-height: 25px;
	height: 100%;
	width: 100%;
}

.send_button{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	color: #FFF;
	font-size: 14px;
	font-weight: 400;
	padding: 8px;
	padding-left: 15px;
	padding-right: 15px;
	background: linear-gradient(142deg, rgba(205,86,255,1) 0%, rgba(87,212,255,1) 30%, rgba(87,212,255,1) 50%, rgba(87,212,255,1) 70%, rgba(205,86,255,1) 100%);
	background-size: 300% 300%;
	border-radius: var(--mw-buttons-radius);
	cursor: pointer;
	animation: gradient_reverse 1s forwards;
}

.send_button:hover{
	animation: gradient 1s forwards;
	text-decoration: none;
}

.send_button_text{
	font-weight: bold;
	margin-left: 6px;
}

.user_menu, .main_phone_menu{
	width: 300px;
	overflow: hidden;
}

.submenu:hover{
	background-color: #1b1b1b00;
	backdrop-filter: brightness(2);
}

.submenu:hover:not(.disconnect_menu){
	border-radius: var(--mw-general-radius);
}

.display_main_phone_menu{
	display: block;
	overflow: hidden;
}

.hide_main_phone_menu{
	display: none;
}

.studio_menu{
	transition: all .5s;
	bottom: 0;
	display: block;
}

.display_studio_menu{
	animation: show_studio_menu .5s forwards;
}

.displayed_studio_menu{
	left: 0;
}

.hide_studio_menu{
	animation: hide_studio_menu .5s forwards;
}

.upload_table{
	display: grid;
	grid-gap: 30px;
	grid-template-columns: 70% 30%;
	align-items: start;
	justify-content: center;
	padding-left: 40px;
	padding-right: 40px;
	padding-bottom: 40px;
	transition: all .3s linear;
}

.thumbnail_upload{
	width: 100%;
	aspect-ratio: 16/9;
	border: 1px solid var(--mw-thumbnails-borders);
	border-radius: 12px;
	background-size: cover;
	background-position: center;
	cursor: pointer;
}

.fa-green{
	color: rgb(43, 166, 64);
}
.footer{
	width: 100%;
	text-align:center;
	font-size: 14px;
	padding-top: 30px;
	bottom: 0;
	clear: both;
}

.footer img{
	border-radius: 12px;
	width: 200px;
	margin-top: 5px;
}

.zoomin{
  animation: zoomin 0.3s;
}

.clearform form{
  padding: 0;
  margin: 0;
  border: 0;
  background-color: transparent;
}

button.clearform{  
  padding: 0;
  margin: 0;
  border: 0;
  background-color: transparent;
}

.clearform button:hover{
  box-shadow: initial;
}

.main_nav{
	position: relative;
	background-color: var(--mw-background);
	top: 0;
	height: auto;
	display: inline-grid;
	width: 100%;
}

.main_user_menu{
	position: relative;
	height: 46px;
	overflow-x: scroll;
	scrollbar-width: none;
	-ms-overflow-style: none;
	white-space: nowrap;
	margin-bottom: 0;
	font-size: 17px;
	z-index: 2;
}

.main_user_menu::-webkit-scrollbar, .banner_all_links::-webkit-scrollbar, .sh::-webkit-scrollbar, .scroll-hide::-webkit-scrollbar{
	display: none;
}

.scrollToTop {
	opacity: 0;
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 1;
	backdrop-filter: blur(42px);
	-webkit-backdrop-filter: blur(42px);
	border-radius: var(--mw-buttons-radius);
	transition: all .3s ease;
}

@media screen and (max-width: 1040px){
	.scrollToTop {
		bottom: 80px;
	}
}

.scrollToTop button {
	width: 40px;
	height: 40px;
	display: flex;
	border-radius: var(--mw-buttons-radius);
	justify-content: center;
	align-items: center;
	color: var(--mw-white);
}

.sh, .scroll-hide {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.main_user_menu a{
	color: var(--mw-gray);
}

.main_user_menu .btn_active{
	color: var(--mw-title);
}

.main_user_menu .btn_unactive:hover{
	color: var(--mw-white);
}

#content_body{
	padding-top: 45px;
	background-color: var(--mw-background);
	position: relative;
	margin-top:-1px;
	z-index: 1;
}

.channels_tab{
	display: flex;
	grid-gap: 15px;
	align-items: center;
	height: 70px;
	margin-left: 50px;
	margin-bottom: 20px;
}

.video_cinema{
	position: absolute;
	top: 0;
	filter: blur(50px) saturate(1.5);
	z-index: -2;
	opacity: 0.3;
	transform: scale(1.15);
	animation: pulse 8s infinite;
	-webkit-transition: all .5s linear;
	-moz-transition: all .5s linear;
	-o-transition: all .5s linear;
	-ms-transition: all .5s linear;
	transition: all .5s linear;
	overflow: hidden;
}

#global_watch[data-action="fullscreen"] .video_cinema {
	opacity: 0.5;
}

.video_cinema_fadein {
	-webkit-animation: fadein_cinema 3s; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: fadein_cinema 3s; /* Firefox < 16 */
	-ms-animation: fadein_cinema 3s; /* Internet Explorer */
	-o-animation: fadein_cinema 3s; /* Opera < 12.1 */
	animation: fadein_cinema 3s;
}

.video_cinema_fadeout {
	-webkit-animation: fadeout_cinema 3s forwards; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: fadeout_cinema 3s forwards; /* Firefox < 16 */
	-ms-animation: fadeout_cinema 3s forwards; /* Internet Explorer */
	-o-animation: fadeout_cinema 3s forwards; /* Opera < 12.1 */
	animation: fadeout_cinema 3s forwards;
}

#uploadForm label{
	margin: 2px;
	font-size: 1em;
}

#progress-bar{
	margin-top: 14px;
	background-color: #12CC1A;
	color: #FFFFFF;
	width: 0%;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	-webkit-transition: width .3s;
	-moz-transition: width .3s;
	transition: width .3s;
	border-radius: 4px;
	text-align: center;
}

#targetLayer{
	width: 100%;
	text-align: center;
}

#progress-status{
	padding: 6px;
}

#progress-string{
	margin-left: 5px;
	margin-top: 10px;
	font-size: 14px;
	font-weight: 500;
}

.progress{
	margin-top: 3px;
	display: -ms-flexbox;
	display: flex;
	height: 12px;
	line-height: 30px;
	overflow: hidden;
	background-color: var(--mw-dark);
	border-radius: var(--mw-buttons-radius);
	text-align: center;
	border: 1px solid var(--mw-input-background);
}

.plyr__poster{
	background-size: cover;
	background-position: center;
}

.plyr--video .plyr__controls{
	display: flex;
	align-items: center;
	height: 70px;
}

.plyr__progress{
	width: calc(100% - 13px);
	position: absolute;
	bottom: 40px;
}

.progress-bar{
	background: linear-gradient(145deg, rgba(87,212,255,1) 0%, rgba(205,86,255,1) 100%);
	text-align: center;
	transition: width 1s linear;
}

.user_description_links {
	padding: 2px 15px 2px 2px;
	margin-top: 15px;
	display: flex;
	grid-gap: 10px;
	font-size: 15px;
	overflow-x: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
	width: calc(100% + 10px);
}

.user_description_links::-webkit-scrollbar {
	display: none;
}

.user_description_links a {
	margin-top: 0px;
	display: flex;
	align-items: center;
	grid-gap: 4px;
	color: var(--mw-gray);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.user_description_links a:hover{
	color: var(--mw-title);
}

.user_about_grid{
	max-width: 1200px;
	margin: auto;
	display: grid;
	grid-gap: 20px;
	grid-template-columns: calc(100% - 240px) 220px;
	align-items: start;
	justify-content: center;
	padding-left: 50px;
	padding-right: 50px;
}

#featured video{
	width: 100%;
}

.watch {
	display: grid;
	grid-gap: 40px 20px;
	grid-template-columns: repeat(4, calc(calc(100% / 4) - 13.33px));
	align-items: start;
	justify-content: start;
	padding-bottom: 50px;
	z-index: 0;
}

.watch.watch_home{
	grid-template-columns: repeat(3, calc(calc(100% / 3) - 13.33px));
}

.last_podcasts {
	display: grid;
	grid-gap: 20px;
	grid-template-columns: repeat(5, calc(calc(100% / 5) - 16px));
	align-items: start;
	justify-content: start;
	padding-bottom: 50px;
	z-index: 0;
}

.last_podcasts.no_more{
		margin-bottom: 70px;
	}

.watch .audio_grid {
	height: 100%;
	min-height: 130px;
	display: flex;
	flex-direction: row;
	align-items: center;
	grid-gap: 10px;
}

.watch .audio_cover {
	position: relative;
	height: 100%;
	aspect-ratio: 1/1;
	border-top-right-radius: var(--mw-general-radius);
	border-bottom-right-radius: var(--mw-general-radius);
	background-size: cover;
	background-position: center;
}

.last_podcasts .audio_card {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.last_podcasts .audio_cover {
	position: relative;
	width: 100%;
	aspect-ratio: 1/1;
	border-radius: var(--mw-general-radius);
	background-size: cover;
	background-position: center;
}

.last_podcasts .audio_grid {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.watch .controls_top {
	display: none;
}

.controls_bottom {
	color: var(--mw-title);
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	grid-gap: 10px;
}

.last_podcasts .controls_bottom, .watch .podcasts_date_top {
	display: none !important;
}

.last_podcasts .podcasts_date_top {
	display: unset !important;
}

.watch .podcast_bottom, .last_podcasts .podcast_bottom {
	color: var(--mw-title);
	display: flex;
	flex-direction: row;
	align-items: center;
	grid-gap: 6px;
	padding: 5px 10px;
}

.watch .podcast_bottom {
	justify-content: space-between;
}

.last_podcasts .podcast_bottom {
	justify-content: center;
}

.watch.watch_reels .swiper-wrapper{
	width: 100%;
	grid-template-columns: repeat(6, minmax(210px, calc(calc(100% / 6) - 16px)));
	position: relative;
	display: grid;
	grid-gap: 20px 10px;
	align-items: start;
	padding: unset;
}

.watch.watch_replays{
	position: relative;
	display: grid;
	grid-gap: 20px;
	align-items: start;
	justify-content: start;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 50px;
	overflow-x: scroll;
	overflow-y: hidden;
	scrollbar-width: none;
	z-index: 0;
}

.watch.watch_replays::-webkit-scrollbar{
	display: none;
}

.watch_reels.watch_reels_homepage{
	position: relative;
	display: grid;
	grid-gap: 10px;
	align-items: start;
	justify-content: start;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 50px;
	overflow-x: scroll;
	scrollbar-width: none;
}

.watch_reels.watch_reels_homepage::-webkit-scrollbar{
	display: none;
}

.watch_reels .iframe{
	padding-bottom: 30px;
}

.border-radius-12{
	border-radius: 12px;
}

.xbuddy{
	transition: all .3s linear;
}

.iframe{
	-webkit-animation: fadein .5s;
	-moz-animation: fadein .5s;
	-ms-animation: fadein .5s;
	-o-animation: fadein .5s;
	animation: fadein .5s;
}

[class*="iframe_"] {
	overflow: hidden;
}

[class*="iframe_"]:hover .min_loop {
	animation: displaynone .2s forwards;
}

[class*="iframe_"]:hover .min_image {
	transform: scale(1.3);
	transform-origin: 50% 50%;
}

.youzoom{
	animation: blurin .8s forwards;
}

.cw_alert {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: row;
	backdrop-filter: blur(42px);
}

.cw_alert_content {
	background: var(--mw-dark);
	padding: 3px 5px;
	width: fit-content;
	border-radius: var(--mw-half-radius);
	color: var(--mw-violet);
}

.cw {
	filter: blur(10px);
}

.cw:hover {
	filter: unset !important;
	transition: filter .8s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

code {
	font-family: monospace;
	font-size: 0.57em;
	background: var(--mw-content-background);
	padding: 4px 5px;
	border-radius: 5px;
	margin-right: 2px;
	position: relative;
	bottom: 1px;
}

.plyr--video .plyr__controls, .iframe .plyr .plyr__controls{
	display: none;
}

.iframe .plyr--full-ui.plyr--video .plyr__control--overlaid{
	display: none;
}

.block_menu{
	width: 100vw;
	overflow: hidden;
}

#header_body {
	margin-top: 70px;
}

.blurhash {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.banner {
	position: absolute;
	top: 0;
	width: 100%;
	object-fit: cover;
	object-position: 50% 50%;
	aspect-ratio: 15/3;
	z-index: 0;
	-webkit-transition: filter .1s linear, opacity .4s ease;
	-moz-transition: filter .1s linear, opacity .4s ease;
	-o-transition: filter .1s linear, opacity .4s ease;
	-ms-transition: filter .1s linear, opacity .4s ease;
	transition: filter .1s linear, opacity .4s ease;
}

.banner_hover {
	position: relative;
	width: 100%;
	aspect-ratio: 15/3;
	border-radius: var(--mw-general-radius);
	overflow: hidden;
}

.banner_hover img[data-generated-blurhash] {
	width: 100%;
	height: 100%;
	position: absolute;
}

.user_avatar img[data-generated-blurhash] {
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
}

.user_card{
	position: relative;
	padding: 30px 0px;
	width: 100%;
	display: flex;
	align-items: center;
	grid-gap: 30px;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	z-index: 1;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	-ms-transition: all .3s linear;
	transition: object-position 0.2s ease, filter 0.2s ease, opacity 0.4s ease;
	overflow: hidden;
}

.user_avatar{
	position: relative;
	padding: 4px;
	width: 140px;
	height: 140px;
	background-size: cover;
	background-position: center;
	aspect-ratio: 1/1;
	border-radius: 100%;
	filter: drop-shadow(1px 2px 10px var(--mw-background));
	background-color: var(--mw-background);
}

.user_avatar img{
	object-fit: cover;
	width: 100%;
	height: 100%;
	border-radius: 100%;
}


.story_active, .avatar_live{
	position: relative;
	width: 140px;
	height: 140px;
}

.user_avatar svg {
	display: none;
}

.story_active svg, .avatar_live svg{
	position: absolute;
	display: unset;
	width: 120%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	fill: none;
	stroke-linecap: round;
	stroke-width: 3;
	stroke-dasharray: 1;
	stroke-dashoffset: 0;
}

.story_active.clicked svg{
	animation: stroke-draw 1s ease-out infinite alternate; 
	// animation: stroke-draw 1s cubic-bezier(0.77, 0, 0.175, 1) infinite alternate; 
}

.story_active img, .avatar_live img{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	border-radius: 50%;
}

.story_active img, .avatar_live img{
	width: 87%;
	height: 87%;
}

.avatar_live img{
	width: 90%;
}

.live_label {
	padding: 2px 6px;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	background-color: red;
	border: 2px solid var(--mw-background);
	border-radius: var(--mw-label-radius);
	white-space: nowrap;
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
}

.live_label svg {
	position: unset;
	display: unset;
	width: unset;
	left: unset;
	top: unset;
	transform: unset;
	fill: unset;
	stroke-linecap: unset;
	stroke-width: unset;
	stroke-dasharray: unset;
	stroke-dashoffset: unset;
}

.user_description{
	position: relative;
	overflow: hidden;
}

.channel_separator{
	position: relative;
	height: 40px;
	background-color: var(--mw-background);
	clear: both;
	z-index: 1;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	-ms-transition: all .3s linear;
	transition: all .3s linear;
}

.video_contenair_vod{
	position: relative;
	max-width: 1200px;
	margin: auto;
	margin-top: 20px;
	border-radius: 12px;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	-ms-transition: all .3s linear;
	transition: all .3s linear;
}

/* Tests (fin Octobre 2024) */

body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .video_contenair_vod {
	max-width: 100dvw;
	margin-top: 0;
}

body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .video_title,
body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .video_user,
body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .video_description,
body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .new_comment,
body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .comments_area,
body:has(.navbar.cinema_large) > #page_body div #content_body #global_watch .mbeb {
	display: none;
}

body:has(.navbar.cinema_large) {
	overflow: hidden;
}

#page_body, .body_boxed {
	margin: auto;
	padding: 0px 50px;
	max-width: 1400px;
}

.header {
	margin-bottom: 50px;
}

#navbar_pwatch_pc, #navbar_pwatch_pc{
	top: 0;
}

.navbar.cinema_large {
	top: -55px;
}

nav.navbar .btn {
	color: var(--mw-gray);
}

nav.navbar .btn:hover {
	color: var(--mw-light);
}

/* Tests */

.video_contenair_reel{
	position: relative;
	max-width: 1200px;
	margin: auto;
	margin-top: 20px;
	border-radius: 12px;
	-webkit-transition: all .3s linear;
	-moz-transition: all .3s linear;
	-o-transition: all .3s linear;
	-ms-transition: all .3s linear;
	transition: all .3s linear;
}

#player{
	position: relative;
	width: 100%;
	aspect-ratio: 16/9;
	overflow: hidden;
}

.video_contenair_vod .plyr{
	max-height: calc(100vh - 80px);
	margin: auto;
}

.video_contenair_reel .plyr{
	max-height: calc(100vh - 80px);
	margin: auto;
}

.video_preview .plyr__caption {
	font-size: 10px !important;
	float: inline-start;
	height: 22px;
	overflow: hidden;
	width: 100%;
}

.video_preview .plyr__captions {
	animation: preview_caption_animation 0.5s;
}

.plyr--video{
	overflow: hidden;
}

.player_live .plyr--video{
	border-radius: 0px;
}

.plyr--video button{
	margin-top: 0px;
}

.plyr--video button:hover{
	box-shadow: initial;
}

.plyr--fullscreen-active video{
	position: initial !important;
	width: initial !important;
	height: initial !important;
	border-radius: 0px;
}

.video_description{
	position: relative;
	max-width: 1200px;
	margin: auto;
	margin-bottom: 20px;
	margin-top: 10px;
	padding: 20px;
	background-color: var(--mw-content-background);
	border-radius: var(--mw-general-radius);
	cursor: pointer;
	transition: all .3s;
}

.video_description.opened{
	animation: open_description .2s ease;
	cursor: unset;
}

.video_description a{
	text-decoration: none;
}

.video_description a:hover{
	text-decoration: underline;
}

.video_description_text{
	margin-top: 15px;
	line-height: 19px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.video_title{
	position: relative;
	max-width: 1200px;
	margin: auto;
	z-index: 1;
}

.video_user{
	position: relative;
	max-width: 1200px;
	height: 100px;
	margin: auto;
	margin-top: 5px;
	z-index: 2;
}

.chapters{
	scrollbar-width: thin;
}

.chapters::-webkit-scrollbar{
	display: none;
}

.chapter{
	padding: 10px;
	border-radius: var(--mw-general-radius);
	cursor: pointer;
}

.chapter:hover{
	background-color: var(--mw-background)
}

.chapter.active{
	border: 2px solid var(--mw-purple);
	background-color: var(--mw-background);
}

div[data-order="0"] .chapter_bar{
	position: absolute;
	bottom: -15px;
	left: 0;
	width: 272px;
	height: 4px;
	background-color: var(--mw-input-background);
}

.chapter_bar{
	position: absolute;
	bottom: -15px;
	left: -10px;
	width: 272px;
	height: 4px;
	background-color: var(--mw-input-background);
}

.chapter.active .chapter_bar{
	background-color: unset;
	background: linear-gradient(90deg, var(--mw-purple) 272px, var(--mw-input-background) 272px);
	bottom: -13px;
}

.chapter.readed .chapter_bar{
	background-color: var(--mw-purple);
}

.chapter_thumbnail{
	position: relative;
	width: 250px;
	aspect-ratio: 16/9; 
	background-position: center;
	background-size: cover;
	border-radius: var(--mw-general-radius);
}

.chapter_timecode{
	font-size: 12px;
	font-weight: 600;
	color: var(--mw-title);
	background-color: var(--mw-purple);
	bottom: -7px;
	left: 10px;
	padding: 2px 4px;
	border-radius: var(--mw-label-radius);
	position: absolute;
	line-height: 14px;
}

div[data-order="0"] .chapter_timecode{
	font-size: 12px;
	font-weight: 600;
	color: var(--mw-title);
	background-color: var(--mw-purple);
	bottom: -7px;
	left: 0;
	padding: 2px 4px;
	border-radius: var(--mw-label-radius);
	position: absolute;
	line-height: 14px;
}

.closer{
	position: absolute;
	z-index: 11;
	top: 0;
	right: 0;
	padding: 20px;
	padding-right: 30px;
	color: var(--mw-white);
	cursor: pointer;
	text-shadow: 0px 0px 2px rgba(0,0,0,1);
}

.comments_area {
	max-width: 1200px;
	margin: auto;
}

.new_comment {
	position: relative;
	max-width: 1200px;
	margin: auto;
	margin-bottom: 40px;
}

.new_comment_text, .new_comment input, .image_comment input {
	color: var(--mw-text);
	background-color: unset;
	border-radius: unset;
	border: none;
	padding: 10px 18px;
	margin: 8px 0;
	width: 100%;
	font-size: 16px;
	outline: none;
	height: 40px;
	resize: none;
	border-bottom: 1px solid;
	border-bottom-color: currentcolor;
	border-color: var(--mw-input-background);
	transition: border-color .3s ease;
}

.new_comment_text:hover,  .new_comment input:hover, .image_comment input:hover {
	border-color: 1px solid var(--mw-light);
}

.new_comment_text_span {
	position: relative;
	top: -9px;
	margin: auto;
	width: 0;
	height: 2px;
	background-color: transparent;
	transition: width .4s ease;
}

.new_comment_text:focus-within + .new_comment_text_span,
.new_comment input:focus-within + .new_comment_text_span,
.image_comment input:focus-within + .new_comment_text_span,
.community_publish textarea:focus-within + .new_comment_text_span {
	top: -9px;
	width: 100%;
	background-color: var(--mw-light);
}

.edit_comments {
	padding: 0;
	margin: 0;
	font-size: 14px;
	color: var(--mw-gray);
	background: transparent;
	text-transform: none;
}

.edit_comments:hover{
	color: var(--mw-title);
	box-shadow: none;
}

.blur_banner{
	background-position: center;
	height: 95px;
	position: sticky;
	top: -8px;
	filter: blur(4px);
	z-index: 1;
	margin-top: -135px;
}

.user_description h1 {
	color: var(--mw-title);
	font-family: var(--mw-title-font);
	font-size: 34px;
}

.user_description p {
	color: var(--mw-gray);
	margin-bottom: 10px;
}

a.user_description_text {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;  
  overflow: hidden;
	color: var(--mw-text);
	cursor: pointer;
	text-decoration: none;
}

a.user_description_text:empty {
	height: 21px;
	visibility: hidden;
}

.svg{
  width: 100px;
  display: block;
  margin: 40px auto 0;
}

.path{
	stroke-dasharray: 1000;
	stroke-dashoffset: 0;
	&.circle{
		-webkit-animation: dash .9s ease-in-out;
		animation: dash .9s ease-in-out;
	}
	&.line{
		stroke-dashoffset: 1000;
		-webkit-animation: dash .9s .35s ease-in-out forwards;
		animation: dash .9s .35s ease-in-out forwards;
	}
	&.check{
		stroke-dashoffset: -100;
		-webkit-animation: dash-check .9s .35s ease-in-out forwards;
		animation: dash-check .9s .35s ease-in-out forwards;
	}
}

#alert_msg{
	color: #73AF55;
}

#alert_msg_alert{
	color: #D06079;
}

#alert_msg_alert b{
	color: var(--mw-text);
	background-color: #D06079;
	padding: 0px 4px 3px 4px;
	border-radius: 4px;
	font-variant: small-caps;
	font-weight: normal;
}

.plyr__control--overlaid{
	background: url('./player_play.png') !important;
	background-position: center !important;
	background-size: cover !important;
	border-radius: 0 !important;
}

.plyr__control--overlaid svg{
	visibility: hidden !important;
}

.plyr--full-ui input[type=range]{
	color: var(--mw-purple) !important;
}

.plyr__badge{
	background: var(--plyr-color-main) !important;
}

.plyr__captions.captions_S .plyr__caption{
	font-size: medium;
}

.plyr__captions.captions_M .plyr__caption, .plyr__captions .plyr__caption{
	font-size: larger;
}

.plyr__captions.captions_L .plyr__caption{
	font-size: x-large;
}

.plyr__captions.captions_XL .plyr__caption{
	font-size: xx-large;
}

.replays_videos .box-inner::-webkit-scrollbar{
	height: 0px;
}

.replays_video .box-inner{
	-ms-overflow-style: none;
}

#search_bar{
	padding-left: 20px;
	padding-right: 20px;
	border-radius: 25px;
}

#search-box{
	position: sticky;
	top: 45px;
	z-index: 1;
}

#search_keywords:focus + #search_contenair{
	outline: 1px solid var(--mw-purple);
	box-shadow: var(--mw-purple) 0px 5px 15px;
	-webkit-box-shadow: var(--mw-purple) 0px 5px 15px;
}

.search_results{
	max-width: 1200px;
	margin: auto;
	display: grid; grid-gap: 20px;
	grid-template-columns: minmax(300px, 360px) minmax(250px, 720px);
	align-items: center;
	padding: 0 20px 30px 20px;
	z-index: 1;
}

.search_user{
	color: var(--mw-gray);
	height: 30px;
	margin-top: 14px;
	margin-bottom: 14px;
}

.search_description{
	display: -webkit-box;
	color: var(--mw-gray);
	margin-top: 14px;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.search_description_small{
	display: none;
}

.ns {
	user-select: none;
}

.home_community{
	width: 100%;
	margin-top: -2px;
	padding: 2px 0px;
	display: grid;
	grid-gap: 20px;
	overflow-x: scroll;
	scrollbar-width: none;
}

.home_community::-webkit-scrollbar{
	display: none;
}

.navigate_left{
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	width: 36px;
	height: 36px;
	left: 10px;
	top: 65%;
	transform: translateY(-50%);
	z-index: 1;
	padding: 5px;
	background-color: #00000030;
	backdrop-filter: blur(42px);
	-webkit-backdrop-filter: blur(42px);
	border: 1px solid var(--mw-content-background);
	border-radius: 50%;
	color: var(--mw-light);
	cursor: pointer;
}

.navigate_right{
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	width: 36px;
	height: 36px;
	right: 10px;
	top: 65%;
	transform: translateY(-50%);
	z-index: 1;
	padding: 5px;
	background-color: #00000030;
	backdrop-filter: blur(42px);
	-webkit-backdrop-filter: blur(42px);
	border: 1px solid var(--mw-content-background);
	border-radius: 50%;
	color: var(--mw-light);
	cursor: pointer;
}

.home_subtitle {
	display: inline-flex;
	align-items: center;
	grid-gap: 10px;
	font-family: var(--mw-title-font);
	margin: 0px 50px 10px 0px;
}

.home_channels {
	display: grid;
	grid-template-columns: calc(33% - 10px) calc(33% - 10px) calc(33% - 10px);
	grid-gap: 20px;
	justify-content: space-between;
}

.is_live{
	max-width: 1300px;
	padding-bottom: 50px;
	border-bottom: var(--mw-general-border);
	cursor: pointer;
}

.loading_card{
	width: 100%;
	background: var(--mw-content-background);
	border-radius: var(--mw-general-radius);
}

.loading_card .loading_content{
	padding: 10px;
}

.loading_card.is-loading .loading_thumbnail, .loading_card.is-loading h2, .loading_card.is-loading p{
	background: #eee;
	background: linear-gradient(110deg, var(--mw-background) 8%, #131313 18%, var(--mw-background) 33%);
	border-radius: 5px;
	background-size: 200% 100%;
	animation: 1.5s shine linear infinite;
}

.loading_card.image_loading.is-loading .loading_thumbnail.image_loading{
	width: 100%;
	aspect-ratio: 1/1;
}

.loading_card.video_loading.is-loading .loading_thumbnail.video_loading{
	width: 100%;
	aspect-ratio: 16/9;
}

.reel_loading{
	width: 100%;
	height: 100%;
	aspect-ratio: 9/16;
}

.musics_loading {
	width: 100%;
	height: 100px;
}

.loading_card.is-loading h2{
	border-radius: var(--mw-half-radius);
	margin-top: 6px;
	height: 18px;
}

.loading_card.is-loading p{
	width: 50%;
	height: 18px;
	margin-top: 3px;
}

.loading_card_home{
	width: 100%;
	background: var(--mw-background);
	border-radius: var(--mw-general-radius);
}

.loading_card_home .loading_content{
	padding: 10px;
}

.loading_card_home.is-loading .loading_thumbnail, .loading_card_home.is-loading h2, .loading_card_home.is-loading p{
	background: #eee;
	background: linear-gradient(110deg, var(--mw-content-background) 8%, #131313 18%, var(--mw-content-background) 33%);
	border-radius: 5px;
	background-size: 200% 100%;
	animation: 1.5s shine linear infinite;
}

.loading_card_home.image_loading.is-loading .loading_thumbnail.image_loading{
	width: 100%;
	aspect-ratio: 1/1;
	border-radius: 0px;
}

.loading_card_home.video_loading.is-loading .loading_thumbnail.video_loading{
	width: 100%;
	aspect-ratio: 16/9;
	border-radius: var(--mw-general-radius);
}

.loading_card_home.is-loading h2{
	border-radius: var(--mw-half-radius);
	margin-top: 6px;
	height: 18px;
}

.loading_card_home.is-loading p{
	width: 50%;
	height: 18px;
	margin-top: 3px;
}

.swiper{
	backdrop-filter: blur(0);
	-webkit-backdrop-filter: blur(0);
}

.swiper-horizontal:hover > .swiper-button-prev, .swiper-horizontal:hover > .swiper-rtl .swiper-button-next, .swiper-horizontal:hover > .swiper-button-next, .swiper:hover > .swiper-rtl .swiper-button-prev{
	opacity: 1;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next, .swiper-button-next, .swiper-rtl .swiper-button-prev{
	opacity: 0;
	transition: opacity .3s ease;
}

.swiper-button-prev::after, .swiper-rtl .swiper-button-next::after, .swiper-button-next::after, .swiper-rtl .swiper-button-prev::after{
	content: "";
}

.swiper-button-lock{
		display: flex;
}


/* ///////////////////// */
/* IMAGES & COLLECTIONS */
/* /////////////////// */

.collection_header:hover > .collection_header_thumbnail{
	transform: scale(1.1);
}

.collection_contenair{
	position: relative;
	max-width: 1000px;
	margin: auto;
	padding: 0px 50px;
}

.collection_header .collection_creator,
.collection_header .collection_description{
	margin-bottom: 20px;
}

.disp_icons{
	max-width: 1000px;
	display: flex;
	align-items: center;
	grid-gap: 5px;
	margin: auto;
	margin-bottom: 10px;
}

.disp_icons[data-display=justified]{
	max-width: unset;
}

.collection-thumbnail::before{
	left: 19px;
	top: -5px;
	right: 19px;
	background: var(--mw-gray);
	content: "";
	height: 1px;
	position: absolute;
	transition: all .15s ease-in-out;
}

.collection-thumbnail:hover::before{
	top: -7px;
}

.collection-thumbnail::after{
	left: 14px;
	top: -3px;
	right: 14px;
	background: var(--mw-gray);
	content: "";
	height: 1px;
	position: absolute;
	transition: all .15s ease-in-out;
}

.collection-thumbnail:hover::after{
	top: -4px;
}

.collection-thumbnail .images_thumbnail{
	border-radius: var(--mw-general-radius);
}

.collection-thumbnail .gallery_reactions{
	height: unset;
	aspect-ratio: 6/4;
	border-radius: var(--mw-general-radius);
}

.disp_grid, .disp_justified{
	display: flex;
	color: var(--mw-gray);
}

.disp_grid.active, .disp_justified.active{
	color: var(--mw-title);
}

.disp_grid:hover, .disp_justified:hover{
	color: var(--mw-title);
}

.gallery_icon{
	position: absolute;
	top: 8px;
	right: 12px;
	filter: drop-shadow(0px 0px 1px #000);
	z-index: 1;
}

.gallery_reaction{
	display: inline-flex;
	align-items: center;
	grid-gap: 5px;
}

.gallery_reaction.gallery_heart{
	margin-right: 10px;
}

.gallery_reactions{
	display: flex;
	align-items: center;
	justify-content: center;
	grid-gap: 10px;
	font-size: 24px;
	position: absolute;
	background-color: #1F1F1FDD;
	width: 100%;
	height: 100%;
	top: 0;
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	transition: all .2s linear;
}

.images_grid{
	max-width: 1000px;
	margin: auto;
	display: grid;
	grid-gap: 6px;
	grid-template-columns: calc(33% - 2px) calc(33% - 2px) calc(33% - 2px);
	justify-content: space-between;
	clear: both;
}

.images_grid.collections{
	margin-top: 15px;
}

.images_grid.justified{
	max-width: unset;
	display: flex;
	flex-wrap: wrap;
}

.images_grid.justified::after{
	--w: 2;
	--h: 1;
	content: '';
	flex-grow: 1000000;
}

.images_grid.justified > .images_thumbnail_contenair, .images_grid.justified::after{
	width: unset;
	height: unset;
	aspect-ratio: unset;
	--row-height: 13rem;
	flex-basis: calc(var(--ratio) * var(--row-height));
}

.images_grid.justified > .images_thumbnail_contenair{
	flex-grow: calc(var(--ratio) * 100);
}

.images_grid.justified .images_thumbnail{
	display: block;
	width: 100%;
}

.images_thumbnail{
	position: relative;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.collection-thumbnail .images_thumbnail{
	height: unset;
	aspect-ratio: 6/4;
	border-radius: var(--mw-general-radius);
}

.images_thumbnail_contenair{
	position: relative;
	width: 100%;
	height: 100%;
	aspect-ratio: 1/1;
	overflow: hidden;
}

.collection-thumbnail.images_thumbnail_contenair{
	position: relative;
	width: 100%;
	height: unset;
	aspect-ratio: unset;
	margin-bottom: 20px;
	overflow: unset;
}

.images_thumbnail_contenair:hover > .gallery_reactions{
	opacity: 1;
}


/* ///////////// */
/* SINGLE_IMAGE */
/* /////////// */

.exif{
	animation: fadein .3s ease;
}

.heart{
	position: absolute;
	width: 100%;
	margin: auto;
	top: 50%;
	transform: translateY(-50%);
	color: var(--mw-red);
	text-align: center;
	z-index: 3;
	opacity: 0;
	animation: like-heart-animation 1s ease-in-out;
	display: none;
}

.image_comment{
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	padding: 10px 20px;
	background-color: var(--mw-background);
	border-top: 1px solid var(--mw-content-background);
	display: none;
}

.image_comments{
	margin: 0px 20px;
}

.image_contenair{
	display: inline-block;
	width: 100%;
	height: 100%;
	position: relative;
	background-position: center;
	background-size: cover;
}

.image_description{
	padding: 20px;
	margin: 0px 20px;
	display: flex;
	flex-direction: column;
	grid-gap: 10px;
	background-color: var(--mw-content-background);
	border-radius: var(--mw-general-radius);
	cursor: pointer;
}

.image_description.opened{
	animation: open_description .3s ease;
	cursor: unset;
}

.image_description.nocursor{
	cursor: unset;
}

.image_description.opened.nocursor{
	animation: unset;
}

.image_description_text{
	position: relative;
	line-height: 20px;
	max-height: 100px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.image_description_text::after{
	position: absolute;
	content: "";
	left: 0px;
	bottom: 0px;
	height: 80px;
	width: 100%;
	background: linear-gradient(transparent, var(--mw-content-background));
	pointer-events: none;
}

.image_description.nocursor .image_description_text::after{
	background: unset;
}

.image_description.opened .image_description_text{
	max-height: unset; 
	cursor: unset;
}

.image_description.opened .image_description_text::after{
	display: none;
}

.image_infos{
	max-height: calc(100dvh - 45px);
	position: relative;
	display: flex;
	flex-direction: column; grid-gap: 10px;
	background-color: var(--mw-background);
	border-left: 1px solid var(--mw-content-background);
	z-index: 0;
	overflow-y: scroll;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.image_infos::-webkit-scrollbar{
	display: none;
}

.image_infos.opened{
	padding-bottom: 110px;
}

.image_interactions_pc{
	position: sticky;
	display: block;
	top: 0;
	margin: 0px 20px;
	padding-bottom: 10px;
	background-color: var(--mw-background);
}

.image_interactions_smartphone{
	margin-top: 10px;
	margin-right: 5px;
	margin-left: 5px;
	display: none;
}

.image_item{
	position: relative;
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	text-align: center;
	transition: all .3s ease;
}

.image_item.zoomed{
	position: fixed;
	top: 0;
	left: 0;
	cursor: zoom-out;
	z-index: 3;
	animation: image_zoomin .3s ease;
}

.gallery_bubble{
	display: inline-block;
	width: 8px;
	aspect-ratio: 1/1;
	border-radius: 50%;
	background-color: var(--mw-gray);
}

.gallery_bubble.active{
	background-color: #FFF;
}

#single_image{
	max-height: calc(100dvh - 45px);
}

.single_image{
	position: relative;
	height: 100%;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	overflow: hidden;
}

#single_image_grid{
	position: relative;
	display: grid;
	grid-template-columns: calc(100% - 440px) 440px;
	height: 100%;
	background-color: var(--mw-background);
	overflow: hidden;
}

#content_body #single_image_grid{
	height: calc(100dvh - 45px);
}

#single_image_popup{
	position: fixed;
	width: 100vw;
	height: 100dvh;
	top: 0;
	background-color: #000A;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	overflow: hidden;
	z-index: 3;
	padding-top: 45px;
}

.single_image_user_pc{
	width: 100%;
	padding: 20px;
	border-bottom: 1px solid var(--mw-content-background);
	display: flex;
	flex-direction: row;
	grid-gap: 10px;
	align-items: center;
}

.single_image_user_smartphone{
	width: 100%;
	position: relative;
	flex-direction: row;
	grid-gap: 10px;
	align-items: center;
	padding: 10px 10px;
	background-color: var(--mw-background);
	border-bottom: 1px solid var(--mw-content-background);
	z-index: 2;
	display: none;
}

.stickers{
	display: flex;
	grid-gap: 5px;
	margin: 0px 20px;
}



/* ////////////////// */
/* SINGLE_COLLECTION */
/* //////////////// */

.collection_header:hover > .collection_header_thumbnail{
	transform: scale(1.05);
}

.collection_contenair{
	position: relative;
	max-width: 1200px;
	margin: auto;
	padding: 0px 50px;
}

.collection_contenair .images_grid{
	max-width: 1200px;
}

.collection_contenair .images_grid.justified > .images_thumbnail_contenair, .images_grid.justified::after{
	width: unset;
	height: unset;
	aspect-ratio: unset;
	--row-height: 15rem;
	flex-basis: calc(var(--ratio) * var(--row-height));
}

.collection_header_content{
	position: relative;
	display: flex;
	flex-direction: column;
	grid-gap: 20px;
	padding: 40px;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	text-shadow: 0 1px 1px #000;
}

.collection_header_thumbnail{
	position: absolute;
	width: 100%;
	height: 60lvh;
	top: 0;
	background-position: center;
	background-size: cover;
	transition: transform 1.5s ease;
}

.collection_header h1{
	color: var(--mw-title);
	font-size: 44px;
	line-height: 38px;
}

.collection_header .collection_avatar{
	width: 50px;
	aspect-ratio: 1/1;
	object-fit: cover;
	border-radius: 50%;
	filter: drop-shadow(0 1px 1px #000);
}

.collection_header .collection_description{
	font-family: "Didot", serif ;
	font-size: 22px;
	font-style: italic;
}

.collection_header_background{
	position: relative;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.6);
}

.images_thumbnail.collection{
	height: unset;
	aspect-ratio: 6/4;
}

.collection_contenair .disp_icons{
	display: flex;
	flex-direction: column;
	max-width: 1200px;
	margin: auto;
	margin-right: -4px;
}



/* ///////// */
/* PLAYLISTS */
/* ///////// */

.list_grid{
	max-width: 1400px;
	height: 100%;
	margin: auto;
	display: grid;
	grid-template-columns: minmax(200px, 1046px) 340px;
	grid-gap: 14px;
	padding-right: 15px;
}

#list{
	position: relative;
}

#list_contenair.scrollable_to_bottom{
	position: relative;
}

#list_contenair.scrollable_to_bottom::after{
	position: absolute;
	content: "";
	left: 0px;
	bottom: 40px;
	height: 80px;
	width: 100%;
	background: linear-gradient(transparent, rgba(31, 31, 35, 0.8));
	pointer-events: none;
}

#list_contenair.scrollable_to_top{
	position: relative;
}

#list_contenair.scrollable_to_top::before{
	position: absolute;
	content: "";
	left: 0px;
	top: 40px;
	height: 80px;
	width: 100%;
	background: linear-gradient(rgba(31, 31, 35, 0.8), transparent);
	pointer-events: none;
}

#list_contenair_smartphone.scrollable_to_bottom{
	position: relative;
}

#list_contenair_smartphone.scrollable_to_bottom::after{
	position: absolute;
	content: "";
	left: 0px;
	bottom: 0px;
	height: 80px;
	width: 100%;
	background: linear-gradient(transparent, rgba(31, 31, 35, 0.8));
	pointer-events: none;
}

#list_contenair_smartphone.scrollable_to_top{
	position: relative;
}

#list_contenair_smartphone.scrollable_to_top::before{
	position: absolute;
	content: "";
	left: 0px;
	top: 40px;
	height: 80px;
	width: 100%;
	background: linear-gradient(rgba(31, 31, 35, 0.8), transparent);
	pointer-events: none;
}

#list_contenair_smartphone.aft_bef_hide::before,
#list_contenair_smartphone.aft_bef_hide::after,
.aft_bef_hide ~ .playlist_duration_smartphone {
	display: none;
}

#list_smartphone{
	position: relative;
	display: none;
}

.icon-grid{
	mask-image: url(./icons/grid.svg);
	-webkit-mask-image: url(./icons/grid.svg);
	mask-size: cover;
	-webkit-mask-size: cover;
	background: var(--mw-title);
	display: inline-block;
	width: 24px;
	aspect-ratio: 1/1;
}

.icon-masonry{
	mask-image: url(./icons/masonry.png);
	-webkit-mask-image: url(./icons/masonry.png);
	mask-size: cover;
	-webkit-mask-size: cover;
	background: var(--mw-title);
	display: inline-block;
	width: 24px;
	aspect-ratio: 1/1;
}

.icon-playlist{
	mask-image: url(./icons/playlist.svg);
	-webkit-mask-image: url(./icons/playlist.svg);
	mask-size: cover;
	-webkit-mask-size: cover;
	background: var(--mw-title);
	display: inline-block;
	width: 24px;
	aspect-ratio: 1/1;
}

.playlist_last_update:hover > .full_date{
	display: block;
}

.playlist_thumbnail, .blurred_thumbnail {
	position: relative;
	width: 100%;
	aspect-ratio: 16/9;
	background-size: cover;
	background-position: center;
  aspect-ratio: 16/9;
  object-fit: cover;
  object-position: center;
}

.blurred_thumbnail{
	height: 70%;
}

.thumbnail_play_all:hover{
	opacity: 1;
}

.thumbnail_play_all:hover ~ .thumbnail_bottom{
	opacity: 0;
}

.thumbnail_bottom{
	opacity: 1;
	transition: all .2s linear;
}

.thumbnail_play_all {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	width: 100%;
	height: 100%;
	background-color: #1F1F1FDD;
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	transition: all .2s linear;
}

#content_popup, #post_popup {
	position: fixed;
	top: 0;
	left: 0;
	padding-top: 55px;
	width: 100vw;
	height: 100vh;
	background-color: var(--mw-background);
	overflow-y: auto;
	overflow-x: hidden;
	z-index: 3;
}

body:has(#content_popup[data-status="open"]) nav.navbar div.main_user_menu {
	display: none;
}

.playlist{
	margin-top: 15px;
	margin-left: 50px;
	margin-right: 50px;
	display: grid;
	grid-template-columns: 360px auto;
	grid-gap: 5px;
}

.playlist_blurred_thumbnail{
	position: absolute !important;
	display: inline-block;
	background-color: transparent;
	width: 200%;
	height: 90dvh;
	transform: translateX(-25%);
	opacity: 0.6;
	-webkit-filter: blur(30px);
	filter: blur(30px);
	z-index: 0;
}

.playlist_creator_name{
	font-family: var(--mw-title-font);
	font-size: 15px;
	line-height: 2rem;
	font-weight: 500;
	overflow: hidden;
	-webkit-line-clamp: 1;
	display: box;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	white-space: normal;
}

.playlist_description{
	margin-top: 16px;
	font-size: 16px;
}

.playlist_infos{
	position: sticky;
	top: 15px;
	height: calc(100vh - 60px);
	padding: 24px;
	border-top-left-radius: var(--mw-general-radius);
	border-top-right-radius: var(--mw-general-radius);
	overflow: hidden;
}

.playlist_infos div{
	position: relative;
	z-index: 1;
}

.playlist_item{
	padding: 10px;
	padding-left: 35px;
	display: flex;
	grid-gap: 20px;
	border-radius: var(--mw-general-radius);
	cursor: pointer;
}

.playlist_item:hover{
	background-color: var(--mw-content-background);
}

.playlist_stats{
	display: flex;
	grid-gap: 5px;
	font-size: 14px;
	margin-top: 16px;
	color: rgba(255, 255, 255, 0.7);
}

.playlist_stats.last_update{
	margin-top: 40px;
}

.playlist_title{
	margin-top: 16px;
	font-family: var(--mw-title-font);
	font-size: 29px;
	font-weight: 700;
}

.full_playlist a{
	color: var(--mw-gray);
	text-decoration: none;
}

.full_playlist a:hover{
	color: var(--mw-title);
}


/* ///////// */
/* COMMUNITY */
/* ///////// */

.answer_link{
	color: var(--mw-gray);
	font-weight: bold;
	text-decoration: none;
}

.answer_link:hover{
	color: var(--mw-title);
}

#comments{
	display: flex;
	flex-direction: column;
	grid-gap: 20px;
	overflow-y: auto;
}

.community_about{
	position: sticky;
	align-self: start;
}

.community_button{
	display: inline-flex;
	grid-gap: 5px;
	color: var(--mw-title);
	font-size: 14px;
	background-color: var(--mw-content-background);
	padding: 7px 14px;
	outline: 2px solid transparent;
	border-radius: var(--mw-buttons-radius);
	cursor: pointer;
}

.community_button.active{
	animation: community_button .2s ease;
	color: #000;
	background-color: var(--mw-title);
}

.community_button:hover{
	outline: 2px solid var(--mw-title);
	text-decoration: none;
}

.community_contenair{
	margin: auto;
	width: calc(100% - 50px);
	display: grid;
	grid-template-columns: minmax(auto, 700px) 350px;
	grid-gap: 30px;
	justify-content: center;
}

.community_content{
	padding: 40px 0px;
	border-bottom: 1px solid var(--mw-content-background);
	font-size: 17px;
}

.community_content .plyr--video{
	border-radius: 12px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}

.community_gif {
	margin-top: 25px;
	max-height: 430px;
	margin-bottom: 15px;
	max-height: 430px;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--mw-general-radius);
}

.community_image{
	margin-top: 25px;
	margin-bottom: 15px;
	max-height: 430px;
	aspect-ratio: 1/1;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 12px;
	cursor: pointer;
}

.community_image_cover{
	background-size: cover;
}

.community_image_contain{
	background-size: contain;
}

.community_posts video{
	width: 100%;
}

.community_publish{
	max-width: 800px;
	margin-bottom: 20px;
}

#community {
	margin-top: 15px;
}

.community_publish textarea, #community textarea {
	overflow: hidden;
	margin-top: 0px;
	resize: none;
	height: 44px;
	border-radius: unset;
	background: transparent;
	padding-top: 15px;
	padding-left: 5px;
	border-bottom: 1px solid var(--mw-input-background);
}

.community_publish #post_form {
	position: relative;
	display: block;
	text-align: right;
	font-size: 17px;
	padding: 28px 22px;
	border-radius: var(--mw-general-radius);
	margin-bottom: 30px;
	outline: 1px solid var(--mw-thumbnails-background);
	background: var(--mw-content-background);
	transition: outline .3s ease;
}

.community_publish #post_form:hover {
	outline: 1px solid var(--mw-gray);
}

.community_publish #post_form:focus-within {
	outline: 1px solid var(--mw-gray);
}

#medias_previews {
	text-align: left;
	display: none;
}

#medias_previews div {
	margin-top: 20px;
}

.comment_dots {
	aspect-ratio: 1/1;
	position: absolute;
	right: 0;
	display: flex;
	align-items: center;
	color: var(--mw-gray);
	cursor: pointer;
	padding: 10px;
	border-radius: 100%;
}

.comment_dots:hover {
	outline: 3px solid var(--mw-thumbnails-background);
}

.community_stats{
	background-color: #000000;
	padding: 40px 30px;
	border-radius: var(--mw-general-radius);
}

.button:disabled, .button[disabled]{
	border: 0px;
	cursor: unset;
}

.button:disabled:hover, .button[disabled]:hover{
	box-shadow: unset;
}

.display_grid_button{
	color: var(--mw-gray);
}
	
.display_grid_button:hover, .display_grid_button.active{
	color: var(--mw-title);
}

#image_upload, #join_video, #join_audio{
	color: var(--mw-gray);
}

#image_upload:hover, #join_video:hover, #join_audio:hover{
	color: var(--mw-title);
}
	
.interactions_button{
	position: relative;
	width: calc(100% / 3);
	font-weight: bold;
	text-align: center;
	cursor: pointer;
}

.interactions_button::after{
	display: block;
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	border-radius: var(--mw-buttons-radius);
	overflow: hidden;
	z-index: -1;
	transform: scale(0.5);
	background-color: var(--mw-background);
	transition: transform .2s ease, background .2s ease;
}

.interactions_button:hover::after{
	display: block;
	transform: scale(1);
	background-color: var(--mw-content-background);
}
	
.interactions_button.active{
	animation: interactions_button .2s ease;
}

.left_22{
	left: -22px;
}

#place_preview{
	position: relative;
	margin-top: 20px;
	max-width: 190px;
	display: inline-block;
	font-size: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 26px;
	vertical-align: middle;
	background-color: var(--mw-background);
	padding: 2px 28px 2px 12px;
	border-radius: var(--mw-label-radius);
	left: 0px;
	cursor: pointer;
	display: none;
}

.community_audio_cover{
	width: 150px;
	min-width: 150px;
	aspect-ratio: 1/1;
	display: flex;
	align-items: center;
	justify-content: center;
	background-position: center;
	background-size: cover;
	cursor: pointer;
}

.community_audio .plyr{
	display: none;
}

.community_audio .btn-play, .community_audio .btn-pause{
	padding: unset;
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	opacity: 0.7;
	outline: unset;
	border: unset;
	background: unset;
	transition: opacity .4s ease;
}

.community_audio .btn-play:hover, .community_audio .btn-pause:hover{
	opacity: 1;
	outline: unset;
	border: unset;
	background-color: unset;
}

#post_interactions{
	width: 100%;
	margin-top: 5px;
	margin-bottom: -15px;
	display: flex;
	flex-direction: row;
	justify-content: center;
}

#user_post{
	padding-bottom: 12px;
}

#video_input{
	width: 0px;
	margin: 0px;
	margin-right: 5px;
	vertical-align: bottom;
	display: none;
}

#video_input.expanded{
	width: 300px;
	display: inline-block;
	animation: input_expand .4s ease;
}

#community #community_grid{
	display: grid;
	grid-template-columns: calc(33% - 5px) calc(33% - 5px) calc(33% - 5px);
	justify-content: space-between;
	grid-gap: 10px;
	margin-bottom: 10px;
}

#community_grid .community_content{
	margin: unset;
	padding: unset;
}

#community_grid .community_content .community_image{
	margin-top: 0px;
}

.popup_videos_item.selected{
	outline: 3px solid var(--mw-purple);
}

.popup_video_search, .popup_videos_results{
	position: relative;
	max-width: 950px;
	margin: auto;
	padding: 20px 40px;
	top: 50%;
	transform: translateY(-50%);
	background-color: var(--mw-content-background);
	border-radius: var(--mw-general-radius);
}

.submenu_title{
	font-size: 12px;
	font-weight: bold;
	padding: 5px 20px;
}

.submenu_item{
	display: block;
	width: 100%;
	height: 100%;
	padding: 3px 20px;
	font-size: 16px;
	color: var(--mw-text);
	text-decoration: none;
}

.submenu_item:hover{
	background-color: var(--mw-purple);
}

.submenu_item.type.active, .submenu_item.order.active{
	background-color: var(--mw-purple);
	font-weight: bold;
}

#image_uploader{
	position: fixed;
	width: 100vw;
	height: 100dvh;
	top: 0;
	background-color: #000A;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	z-index: 4;
}

#place_popup{
	position: absolute;
	width: 100%;
	height: 100%;
}

#place_popup #popup_place_display_name:hover{
	border-radius: var(--mw-buttons-radius);
}

#select_place{
	color: var(--mw-gray);
}

#select_place:hover{
	color: var(--mw-title);
}

#full_image {
	position: fixed;
	top: 45px;
	left: 0;
	padding: 50px;
	width: 100vw;
	height: calc(100dvh - 45px);
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--mw-box-shadow);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	cursor: pointer;
	z-index: 3;
}
#full_image img{
	position: relative;
	max-height: 95%;
	object-fit: contain;
	animation: avatar_zoomin .2s ease;
}


  /* ////////// */
 /* EMBED POST */
/* ////////// */

.embed_post .community_content {
	padding: 40px 20px;
	border-bottom: unset;
}


  /* ////////// */
 /* SHARE POPUP*/
/* ////////// */

.copied{
	position: absolute;
	top: 35px;
	font-size: 12px;
	font-weight: bold;
	animation-fill-mode: forwards;
	display: none;
}

.close_post_popup{
	position: absolute;
	top: 0px;
	right: 20px;
	z-index: 4;
}

#share_popup{
	position: fixed;
	width: 100vw;
	height: 100dvh;
	top: 0;
	background-color: #000A;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	padding: 20px;
	z-index: 4;
	overflow: hidden;
}

.share{
	position: absolute;
	width: calc(100% - 40px);
	max-width: 600px;
	padding: 20px;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	background-color: var(--mw-content-background);
	border-radius: var(--mw-general-radius);
}

.share_link{
	display: flex;
	align-items: center;
	grid-gap: 10px;
	margin-top: 20px;
}

.share_link input{
	margin: 0px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.share_link a{
	color: var(--mw-gray);
	vertical-align: middle;
	cursor: pointer;
}

.share_link a:hover{
	color: var(--mw-title);
}

.share_social_medias{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	grid-gap: 12px;
	margin-top: 10px;
}

.share_social_medias img{
	width: 48px;
	aspect-ratio: 1/1;
	border-radius: 6px;
}

.share_social_media_item{
	text-align: center;
	font-size: 11px;
	line-height: 12px;
}

.share_timecode{
	display: flex;
	align-items: center;
	grid-gap: 10px;
	margin: 8px 0px 0px 0px;
}


  /* ///////////// */
 /* VIDEOS BANNER */
/* ///////////// */

.autoplay-progress{
	position: absolute;
	right: 16px;
	bottom: 16px;
	z-index: 10;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	color: var(--swiper-theme-color);
}

.autoplay-progress svg{
	--progress: 0;
	position: absolute;
	left: 0;
	top: 0px;
	z-index: 10;
	width: 100%;
	height: 100%;
	stroke-width: 4px;
	stroke: var(--swiper-theme-color);
	fill: none;
	stroke-dashoffset: calc(125.6 * (1 - var(--progress)));
	stroke-dasharray: 125.6;
	transform: rotate(-90deg);
}

#videos_banner{
	margin-top: 80px;
	margin-bottom: 80px;
	width: 100%;
	aspect-ratio: 28/9;
	border-radius: var(--mw-general-radius);
	overflow: hidden;
}

.videos_banner_content{
	position: relative;
	max-width: 1040px;
	margin: auto;
	padding: 20px;
	display: flex;
	flex-direction: row;
	align-items: center;
	grid-gap: 20px;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: var(--mw-general-radius);
	z-index: 1;
	overflow: hidden;
}

.videos_banner_thumbnail {
	width: 250px;
	aspect-ratio: 16/9;
	border-radius: 12px;
	background-position: center;
	background-size: cover;
}

  /* ////////// */
 /* -----------*/
/* ////////// */


  /* ////////// */
 /* -----------*/
/* ////////// */

.navbar {
	height: 55px;
	/*box-shadow: 0 1px 6px #00000099, 0 0px 6px #00000099;*/
	position: fixed;
	top: 0;
	z-index: 4;
	width: 100%;
	backdrop-filter: var(--mw-general-backdrop-filter);
	-webkit-backdrop-filter: var(--mw-general-backdrop-filter);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	padding: 5px 25px;
	border-bottom: 1px solid var(--mw-dark);
	transition: .2s all;
}

section.header{
	margin-top: 75px;
}

#menu_buttons {
	display: flex;
	grid-gap: 5px;
}

.xb-txt-branding {
	font-family: 'Flipahaus Bold', sans-serif;
	font-weight: 100;
}

#logo a span {
	font-family: 'Flipahaus Bold', sans-serif;
	font-size: 22px;
	font-weight: 100;
}

#logo a {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	grid-gap: 5px;
	text-decoration: none;
}

#logo a img {
	width: 20px;
	height: 20px;
}

.navbar.navbar_left {
	flex-direction: column;
	left: 0;
	width: 72px;
	height: 100%;
	padding: 15px 25px;
}

.navbar.navbar_left #logo a span {
	font-size: 18px;
}

.navbar.navbar_left #logo a {
	flex-direction: column;
	grid-gap: 8px;
}

.navbar.navbar_left #logo a img {
	width: 24px;
	height: 24px;
}

.navbar.navbar_left #menu_buttons {
	flex-direction: column;
	grid-gap: 15px;
}

.navbar.navbar_left #menu_buttons #session_menu {
	margin: 0;
}

.navbar.navbar_left ~ #page_body {
	margin: auto;
	padding: 0px 50px 0px 122px;
	max-width: 1400px;
}

.navbar.navbar_left ~ #page_body #header_body {
	margin-top: 30px;
}

.span_button_user_home {
	font-size: 13px;
}

.btn_nav_cnx1 {
	display: flex;
}

.btn_nav_cnx2 {
	display: none;
}

.menu_personnalisation {
	right: 10px;
}

.menu_lang {
	right: 50px;
}

.menu_lang, .menu_personnalisation {
	position: absolute;
	top: 50px;
	bottom: auto;
	width: 250px;
	border: 1px solid var(--mw-thumbnails-borders);
	border-radius: var(--mw-half-radius);
	z-index: 6;
	filter: drop-shadow(2px 4px 6px var(--mw-background));
	backdrop-filter: blur(20px) brightness(0.5);
	padding: 10px 5px;
	display: none;
}

#session_menu {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 0 !important;
	grid-gap: 5px;
	border-radius: var(--mw-buttons-radius);
	margin: 0 0 0 15px;
	position: relative;
}

#session_menu img {
	width: 30px;
	height: 30px;
	border-radius: 100%;
}

.session_user_menu {
	position: fixed;
	top: 52px;
	right: 24px;
	background-color: var(--mw-box-shadow);
	border: 1px solid var(--mw-thumbnails-borders);
	border-radius: var(--mw-general-radius);
	z-index: 6;
	filter: drop-shadow(2px 4px 6px var(--mw-background));
	backdrop-filter: blur(20px) brightness(0.5);
	-webkit-backdrop-filter: blur(20px) brightness(0.5);
}

.navbar.navbar_left ~ .session_user_menu {
	top: unset;
	right: unset;
	left: 80px;
	bottom: 15px;
}

.smart_link_social {
	position: relative;
	display: flex;
	flex-direction: row;
	align-items: stretch;
	justify-content: flex-start;
	margin: 2px 1px 0 1px;
	width: fit-content;
}

.smart_link_social .btn {
	position: relative;
	margin: -1px 5px;
	background-color: var(--mw-deep-dark);
	border-radius: 10px;
	padding: 2px 10px;
	text-decoration: none !important;
}

.smart_line {
	display: flex;
	align-items: center;
	flex-direction: row;
	margin-bottom: 1px;
	flex-wrap: wrap;
}


/* //////////// */
/* REELS STYLES */
/* //////////// */

.reel_frame {
	width: 100%;
	min-width: 200px;
	border-radius: 4px;
}

.reel_self_frame {
	position: relative;
	width: 100%;
	aspect-ratio: 9/16;
	background-size: cover;
	background-position: center;
	cursor: pointer;
	overflow: hidden;
	border-radius: var(--mw-general-radius);
}

.reel_self_frame:hover {
	border-radius: 12px;
}

.reel_self_frame video {
	width: 100%;
	aspect-ratio: 9/16;
	cursor: pointer;
	display: none;
}

[class*="smartphone_duration_"] {
	display: none;
}

.reel_self_frame > [class*="views_date_"] {
	position: absolute;
	font-size: 14px;
	font-weight: 500;
	color: #FFF;
	background-color: #000000b0;
	top: 5px;
	left: 5px;
	padding: 2px 5px;
	border-radius: 5px;
}

.reel_self_frame > [class*="views_date_"] p {
	margin-top: 2px;
	font-size: 15px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: var(--mw-light);
}

.reel_self_frame > [class*="duration_"] {
	position: absolute;
	font-size: 14px;
	font-weight: 500;
	color: #FFF;
	background-color: #000000b0;
	bottom: 5px;
	right: 5px;
	padding: 2px 5px;
	border-radius: 5px;
}

.reel_self_frame > [class*="last_timecode_"] {
	position: absolute;
	bottom: 0;
	height: 4px;
	background-color: var(--mw-purple);
	-webkit-box-shadow: 0px 1px 4px 0px #000000;
	box-shadow: 0px 1px 4px 0px #000000;
}

.reel_self_frame a:first-child {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	width: 100%;
	height: 100%;
	z-index: 5;
}

.reel_frame .watch_title {
	width: 100%;
	margin-top: 10px;
}

.waveform{
	cursor: pointer;
}

.sticker {
	position: relative;
	font-size: 12px;
	font-weight: 500;
	color:#FFF;
	background-color: #000D;
	bottom: 5px;
	right: 5px;
	padding: 2px 5px;
	border-radius: 4px;
}

.sticker.top-r {
	position: absolute;
	top: 5px;
	right: 5px;
}

.sticker.top-l {
	position: absolute;
	top: 5px;
	left: 5px;
}

.sticker.bottom-r {
	position: absolute;
	bottom: 5px;
	right: 5px;
}

.sticker.bottom-l {
	position: absolute;
	bottom: 5px;
	left: 5px;
}

.waveform_elapsed, .waveform_duration{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	z-index: 2;
}

.waveform_elapsed .sticker, .waveform_duration .sticker{
	top: unset;
	left: unset;
	bottom: unset;
	right: unset;
}

.waveform_duration{
	left: unset;
	right: 0;
}

.community_audio .plyr__time {
	position: relative;
	font-size: 12px;
	font-weight: 500;
	color: #FFF;
	background-color: #000D;
	padding: 2px 5px;
	border-radius: 4px;
}


/* ///////////// */
/* EMOJI PICKER */
/* /////////// */

em-emoji-picker {
	outline: 1px solid var(--mw-thumbnails-background);
}

.emoji_picker {
	display: none;
	position: absolute;
	z-index: 100;
}

.picker {
	color: var(--mw-gray);
}

.picker:hover, .picker.focus {
	color: var(--mw-text);
}

.top_left {
	left: 0px;
}

.top_right {
	right: 0px;
}

.bottom_left {
	bottom: calc(-100% + 54px);
	left: 0px;
}

.bottom_right {
	bottom: calc(-100% + 54px);
	right: 0px;
}





/* Buttons Styles */

button {
	appearance: initial;
	font-style: inherit;
	font-variant-ligatures: inherit;
	font-variant-caps: inherit;
	font-variant-numeric: inherit;
	font-variant-east-asian: inherit;
	font-variant-alternates: inherit;
	font-weight: inherit;
	font-stretch: inherit;
	font-size: inherit;
	font-family: inherit;
	font-optical-sizing: inherit;
	font-kerning: inherit;
	font-feature-settings: inherit;
	font-variation-settings: inherit;
	text-rendering: auto;
	color: buttontext;
	letter-spacing: normal;
	word-spacing: normal;
	line-height: normal;
	text-transform: none;
	text-indent: 0px;
	text-shadow: none;
	display: inline-block;
	text-align: center;
	align-items: flex-start;
	cursor: pointer;
	box-sizing: border-box;
	margin: 0em;
	padding: 1px 6px;
	border-width: 2px;
	border-style: outset;
	border-color: buttonborder;
	border-image: initial;
	border: inherit;
	background: inherit;
}

.btn{
	padding: 10px 20px;
	text-decoration: none;
	font-weight: bold;
	border-radius: var(--mw-buttons-radius);
	user-select: none;
}

.btn:hover{
	text-decoration: none;
}

.btn-sm, .btn-small{
	padding: 3px 8px;
}

.btn-md, .btn-medium {
	padding: 6px 14px;
}

.btn-big {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: var(--mw-content-background);
	padding: 20px;
	padding-right: 42px;
	border-radius: var(--mw-buttons-radius);
	cursor: pointer;
}

.btn-big:hover {
	border: 1px solid transparent !important;
}

.btn:hover {
	cursor: pointer;
}

.btn-multi {
	color: var(--mw-light);
	background: linear-gradient(145deg, rgba(87,212,255,1) 0%, rgba(205,86,255,1) 100%);
	border: 1px solid var(--mw-purple);
}

.btn-multi:hover {
	outline: 2px solid var(--mw-purple);
}

.btn-purple-outline {
	color: var(--mw-purple);
	border: 1px solid var(--mw-purple);
	background-color: transparent;
}

.btn-purple {
	color: var(--mw-light);
	background-color: var(--mw-purple);
}

.btn-purple-outline:hover, .btn-purple:hover {
	outline: 2px solid var(--mw-purple);
}

.btn-blue-green-outline {
	color: var(--mw-blue-green);
	border: 1px solid var(--mw-blue-green);
	background-color: transparent;
}

.btn-blue-green {
	color: var(--mw-light);
	background-color: var(--mw-blue-green);
}

.btn-blue-green-outline:hover, .btn-blue-green:hover {
	outline: 2px solid var(--mw-blue-green);
}

.btn-green-outline {
	color: var(--mw-green);
	border: 1px solid var(--mw-green);
}

.btn-green {
	color: var(--mw-light);
	background-color: var(--mw-green);
	border: 1px solid var(--mw-green);
}

.btn-green-outline:hover, .btn-green:hover {
	outline: 2px solid var(--mw-green);
}

.btn-orange-outline {
	color: var(--mw-orange);
	border: 1px solid var(--mw-orange);
}

.btn-orange {
	color: var(--mw-light);
	background-color: var(--mw-orange);
}

.btn-orange-outline:hover, .btn-orange:hover {
	outline: 2px solid var(--mw-orange);
}

.btn-red-outline {
	color: var(--mw-red);
	border: 1px solid var(--mw-red);
}

.btn-red {
	color: var(--mw-light);
	background-color: var(--mw-red);
	border: 1px solid var(--mw-red);
}

.btn-red-outline:hover, .btn-red:hover {
	outline: 2px solid var(--mw-red);
}

.btn-pink-outline {
	color: var(--mw-pink);
	border: 1px solid var(--mw-pink);
}

.btn-pink {
	color: var(--mw-light);
	background-color: var(--mw-pink);
}

.btn-pink-outline:hover, .btn-pink:hover {
	outline: 2px solid var(--mw-pink);
}

.btn-blue-outline {
	color: var(--mw-blue);
	border: 1px solid var(--mw-blue);
}

.btn-blue {
	color: var(--mw-light);
	background-color: var(--mw-blue);
}

.btn-blue-outline:hover, .btn-blue:hover {
	outline: 2px solid var(--mw-blue);
}

.btn-yellow-outline {
	color: var(--mw-yellow);
	border: 1px solid var(--mw-yellow);
}

.btn-yellow {
	color: var(--mw-light);
	background-color: var(--mw-yellow);
}

.btn-yellow-outline:hover, .btn-yellow:hover {
	outline: 2px solid var(--mw-yellow);
}

.btn-violet-outline {
	color: var(--mw-violet);
	border: 1px solid var(--mw-violet);
}

.btn-violet {
	color: var(--mw-light);
	background-color: var(--mw-violet);
}

.btn-violet-outline:hover, .btn-violet:hover {
	outline: 2px solid var(--mw-violet);
}

.btn-light-outline {
	color: var(--mw-light);
	border: 1px solid var(--mw-light);
}

.btn-light {
	color: var(--mw-dark);
	background-color: var(--mw-light);
}

.btn-light-outline:hover, .btn-light:hover {
	outline: 2px solid var(--mw-light);
}

.btn-dark-outline {
	color: var(--mw-light);
	border: 1px solid var(--mw-dark);
}

.btn-dark {
	color: var(--mw-light);
	background-color: var(--mw-dark);
}

.btn-dark-outline:hover, .btn-dark:hover {
	outline: 2px solid var(--mw-dark);
}

.btn-none-outline {
	color: var(--mw-light);
	border: 1px solid var(--watch-studio-background);
}

.btn-none {
	color: var(--mw-light);
}

.btn-none:hover, .btn-none-outline:hover {
	outline: 1px solid var(--watch-studio-background);
	background-color: var(--mw-dark);
}

.btn-disabled-outline, .btn-disabled {
	color: var(--mw-dark) !important;
	border: 1px solid var(--mw-dark) !important;
	cursor: no-drop !important;
	background: none !important;
}

.btn-disabled-outline:hover, .btn-disabled:hover {
	outline: none !important;
}

.btn-link {
	text-decoration: none;
	padding: 0 !important;
}

.btn-link:hover {
	text-shadow: 0px 0px 3px black;
	text-decoration: underline;
}

.btn-pattern {
	background-color: var(--pattern-color);
}

.btn-pattern:hover {
	outline: 2px solid var(--pattern-color);
}

.btn-expand {
	position: absolute;
	display: flex;
	z-index: 1;
	right: 0;
	top: 0;
	padding: 5px;
	background: transparent;
	border: none;
	color: white;
	filter: drop-shadow(0px 0px 3px var(--mw-deep-dark));
}

.btn-expand:hover {
	transform: scale(1.2);
}

label:has(button.btn-expand),
div:has(button.btn-expand) {
	position: relative;
}

.txt-purple {
	color: var(--mw-purple) !important;
}

.txt-blue-green {
	color: var(--mw-blue-green) !important;
}

.txt-green {
	color: var(--mw-green) !important;
}

.txt-red {
	color: var(--mw-red) !important;
}

.txt-blue {
	color: var(--mw-blue) !important;
}

.txt-orange {
	color: var(--mw-orange) !important;
}

.txt-yellow {
	color: var(--mw-yellow) !important;
}

.txt-violet {
	color: var(--mw-violet) !important;
}

.txt-pink {
	color: var(--mw-pink) !important;
}

.txt-gray, .txt-grey {
	color: var(--mw-gray) !important;
}

.txt-dark, .txt-black {
	color: var(--mw-dark) !important;
}

.txt-light, .txt-white {
	color: var(--mw-light) !important;
}

.align-l {
	text-align: left;
}

.align-c {
	text-align: center;
}

.align-r {
	text-align: right;
}

.w100 {
	width: 100%;
}

.mw-txt {
	font-family: var(--mw-title-font);
}

.full_infos {
	position: absolute;
	padding: 4px 8px;
	top: 22px;
	left: 50%;
	transform: translateX(-50%);
	border: 1px solid #424242;
	border-radius: var(--mw-half-radius);
	backdrop-filter: blur(6px);
	backdrop-filter: var(--mw-general-backdrop-filter);
	display: none;
	z-index: 1;
	-webkit-animation: fadein .3s;
	-moz-animation: fadein .3s;
	-ms-animation: fadein .3s;
	-o-animation: fadein .3s;
	animation: fadein .3s;
}

.full_infos.center::after{
	content:""; 
	border-left:6px solid transparent;
	border-right:6px solid transparent;
	border-bottom: 6px solid #424242;
	position: absolute;
	top: -6px;
	left: 50%;
	transform: translateX(-50%);
}

.full_infos.right::after{
	content:""; 
	border-left:6px solid transparent;
	border-right:6px solid transparent;
	border-bottom: 6px solid #424242;
	position: absolute;
	top: -6px;
	right: 2px;
}

.full_infos.left::after{
	content:""; 
	border-left:6px solid transparent;
	border-right:6px solid transparent;
	border-bottom: 6px solid #424242;
	position: absolute;
	top: -6px;
	left: 2px;
}

.infos:hover ~ .full_infos, .infos:active ~ .full_infos{
	display: block;
}

.full_date{
	width: max-content;
	position: absolute;
	padding: 3px 10px;
	top: 22px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #0008;
	outline: 1px solid #424242;
	border-radius: var(--mw-half-radius);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	display: none;
	z-index: 1;
	box-shadow: 0 1px 2px #000000e6, 0 0px 2px #000000e6;
}

.full_date::after{
	content:""; 
	border-left:6px solid transparent;
	border-right:6px solid transparent;
	border-bottom: 6px solid #424242;
	position: absolute;
	top: -6px;
	left: 50%;
	transform: translateX(-50%);
}

.date:hover ~ .full_date, .date:active ~ .full_date{
	display: block;
}

.status_info {
	background-color: red;
	padding: 3px 8px 0px 8px;
	border-radius: var(--mw-label-radius);
	width: fit-content;
	font-family: var(--mw-title-font);
}

.live_popup {
	position: fixed;
	top: 55px;
	width: 300px;
	height: 90px;
	background: var(--mw-background);
	z-index: 10;
	filter: drop-shadow(2px 2px 4px black);
	transition: all .3s cubic-bezier(0, 0, 0, 1.28);
}

.live_popup[data-status="close"] {
	right: -350px;
}

.live_popup[data-status="open"] {
	right: 15px;
}

.live_popup .live_popup_progressbar {
	background-color: var(--mw-purple);
	height: 2px;
	width: 100%;
	transition: all .2s;
}

.live_popup .live_popup_description {
	height: 60px;
	padding: 10px 15px;
	font-weight: bold;
	display: flex;
	flex-direction: column;
}

.live_popup .live_popup_description span[data-type="user_title"] {
	font-size: 12px;
	font-weight: normal;
}

.live_popup .live_popup_buttons {
	height: 30px;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
}

.live_popup .live_popup_buttons .btn {
	width: 100%;
	border-radius: 0;
	text-align: center;
}

.home_live_block{
	display: grid;
	grid-gap: 20px;
	grid-template-columns: calc(50% - 20px) calc(50% - 20px);
	align-items: center;
	justify-content: space-around;
}

.featured_thumbnail{
	position: relative;
	width: 100%;
	aspect-ratio: 16/9;
	background-position: center;
	background-size: cover;
	border-radius: 12px;
}

.featured_thumbnail_link{
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.img_play{
	filter: drop-shadow(0px 0px 0px #ffffff);
	transition: all .4s ease;
}

.featured_thumbnail_link:hover > .img_play, .img_play:hover{
	filter: drop-shadow(0px 0px 8px #ffffff);
}

.home_separator {
	height: 20px;
	background-color: transparent;
	margin-top: 5px;
	margin-bottom: 25px;
}

.watch_reels .border-radius-12 {
	overflow: hidden;
}

.watch_reels .iframe {
	padding-bottom: 0px;
}

.watch_reels.watch_reels_homepage {
	grid-gap: 20px 10px;
}

.block_menu.hide {
	visibility: hidden;
}

.block_menu2 {
	display: none !important;
}

.block_menu2.visible {
	display: flex !important;
}

#disconnect_validate a, #disconnect_validate button {
	border-top: none;
}

#disconnect_validate a:hover, #disconnect_validate button:hover {
	border-top: none;
	border: 1px solid var(--mw-purple);
}

.follow_button, .share_button{
	display: flex;
	align-items: center;
	grid-gap: 8px;
	width: fit-content;
	padding: 7px 20px;
	font-weight: 550;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.follow_button.active, .share_button.active{
	animation: open_description .3s ease;
}

#content_popup.play-min {
	display: block !important;
	position: fixed;
	width: 390px;
	overflow: hidden;
	bottom: 0px;
	height: 245px;
	right: 10px;
	top: unset;
	left: unset;
	margin: 0;
	padding: 0px;
	background: transparent;
	transition: all .5s;
}

#content_popup.play-min .video_cinema, 
#content_popup.play-min .video_title,
#content_popup.play-min .video_user,
#content_popup.play-min .video_description,
#content_popup.play-min .new_comment,
#content_popup.play-min .comments_area {
	display: none;
}

.plyr__menu__container {
	background: #18181acc;
	backdrop-filter: blur(20px);
	border-radius: var(--mw-general-radius);
}

.plyr--video .plyr__control:focus-visible, .plyr--video .plyr__control:hover, .plyr--video .plyr__control[aria-expanded=true] {
	background: var(--mw-purple);
	color: var(--mw-text);
}

.plyr__menu__container .plyr__control {
	color: var(--mw-text);
}

.plyr__menu__container:after {
	border-top-color: #18181aa3;
}

.plyr__menu__container div:nth-child(1),
.plyr__menu__container div:nth-child(3) {
	max-width: 190px;
	width: 100%;
}

.plyr__menu__container div:nth-child(4) {
	max-width: 100px;
	width: 100%;
}

.plyr__caption {
    background: #18181acc;
    border-radius: var(--mw-general-radius);
}



/* /////////////// */
/* LIVES & REPLAYS */
/* /////////////// */

.alias {
	font-family: var(--mw-title-font);
}

body.theatre .video_live {
	height: 100dvh;
	max-height: 100dvh;
}

body.theatre .player_live .plyr {
	max-height: 100dvh;
}

body.theatre nav {
	display: none;
}

body.theatre #content_body,
body.theatre #content_popup {
	padding: unset;
}

body.theatre .chat_full_live {
	top: 0;
	height: 100dvh;
}

body.theatre .live_chat {
	height: 100dvh;
}

body.theatre .chat_body {
	height: calc(100dvh - 46px);
	max-height: calc(100dvh - 46px);
}

.btn_close_tchat {
	padding: 0px;
	position: relative;
	top: 0px;
	right: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--pattern-color);
	cursor: pointer;
}

.btn_close_tchat.closed {
	padding: 8px;
	background-color: var(--mw-background);
	border-radius: 6px;
	top: 5px;
	right: 5px;
}

.btns_points {
	width: 100%;
	margin-bottom: 8px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.channel_points_10_hide {
	opacity: 0;
}

.channel_points_10_show {
	-webkit-animation: pepperoni_popup .5s forwards;
	-moz-animation: pepperoni_popup .5s forwards;
	-ms-animation: pepperoni_popup .5s forwards;
	-o-animation: pepperoni_popup .5s forwards;
	animation: pepperoni_popup .5s forwards;
}

.channel_points_50_hide {
	opacity: 0;
}

.channel_points_50_show {
	-webkit-animation: pepperoni_popup .5s forwards;
	-moz-animation: pepperoni_popup .5s forwards;
	-ms-animation: pepperoni_popup .5s forwards;
	-o-animation: pepperoni_popup .5s forwards;
	animation: pepperoni_popup .5s forwards;
}

.title_card {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: flex-start;
	align-items: stretch;
	grid-gap: 20px;
	background-color: var(--mw-content-background);
	border-radius: var(--mw-general-radius);
}

.title_card_thumbnail {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-size: cover;
	background-position: center;
	aspect-ratio: 16/9;
	border: 1px solid var(--mw-content-background);
	border-radius: var(--mw-general-radius) 0px 0px var(--mw-general-radius);
}

.chat_body {
	position: relative;
	padding: 5px;
	overflow-y: scroll;
	max-height: calc(100dvh - 91px);
}

.chat_body_info {
	position: absolute;
	top: 41px;
	width: 100%;
	height: 150px;
	padding: 15px;
	background-color: var(--mw-thumbnails-borders);
	transition: height .5s;
	border: 1px solid var(--mw-dark);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	z-index: 1;
}

.chat_box {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	background-color: var(--mw-background);
}

.chat_box .button:hover {
	box-shadow: var(--pattern-color) 0px 5px 15px;
}

.chat_box #get_settings {
	margin-top: 0;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--mw-title);
}

.chat_commu {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	grid-gap: 5px;
}

.chat_commu_title {
	display: flex;
	flex-direction: row;
	align-items: center;
	grid-gap: 5px;
}

.chat_content {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

#chat_editor {
	width: 100%;
	border-top: 1px solid var(--mw-dark);
	padding: 0 5px;
}

#chat_editor input {
	border: 2px solid transparent;
	border-radius: 4px !important;
}

#chat_editor input:focus {
	border: 2px solid var(--pattern-color);
}

.chat_full_live {
	position: sticky;
	top: 45px;
	height: calc(100dvh - 45px);
	align-self: start;
	border-left: 1px solid var(--mw-dark);
	box-sizing: border-box;
	z-index: 10;
}

.chat_full_live hr {
	width: 100%;
	border: 1px solid var(--mw-thumbnails-background);
	margin: 4px 0;
}

.chat_header {
	padding: 10px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	text-align: center;
	font-weight: bold;
	border-bottom: 1px solid var(--pattern-color);
}

#chat_pause {
	position: sticky;
	bottom: 10px;
	width: 100%;
	display: flex;
	transition: 0.3s;
	flex-direction: row;
	justify-content: center;
}

#chat_settings, #pepperonis_box {
	display: none;
	width: calc(100% - 12px);
	padding: 5px;
	position: absolute;
	bottom: 5px;
	background-color: var(--mw-deep-dark);
	border: 1px solid var(--mw-dark);
	border-radius: var(--mw-half-radius);
	z-index: 1;
}

#chat_settings .colors {
	display: grid;
	grid-template-columns: 30px 30px 30px 30px 30px 30px;
	grid-template-rows: 30px 30px;
	height: 75px;
	width: 100%;
	justify-content: center;
	align-items: stretch;
	position: relative;
	left: -10px;
	justify-items: stretch;
	align-content: center;
}

#chat_settings .colors .color_pickers {
	width: 20px;
}

#chat_settings .colors .color_pickers label {
	cursor: pointer;
	user-select: none;
	width: 25px;
	height: 25px;
	position: absolute;
	border-radius: 100%;
	border: 2px solid var(--mw-text);
}

#chat_settings .colors .color_pickers input {
	display: none;
}

#chat_settings .colors .color_pickers input[type=radio]:checked + label {
	border: 2px solid var(--mw-box-shadow);
}

#chat_settings .colors .color_pickers input[type=radio]:checked + label:after {
	content: "✔";
	position: relative;
	left: -2px;
	bottom: -1px;
}

#chat_settings .colors .color_pickers label:hover {
	border: 2px solid var(--mw-dark);
}

#content_popup .chat_full_live {
	top: 0;
}

div[class^="iframe_vod_"]:hover > div[class^="cover_vod_"] {
	display: none;
}

.full_live_block {
	width: 100%;
	position: relative;
	display: grid;
	grid-template-columns: calc(100% - 350px) 350px;
}

.full_live_block.nochat {
	grid-template-columns: 100%;
}

.full_live_block.nochat .chat_full_live {
	display: none;
}

.full_live_block .video_cinema .plyr--video {
	height: 100%;
	transform: scale(1.2);
}

.hide_scroll {
	-ms-overflow-style: none; /* for Internet Explorer, Edge */
	scrollbar-width: none; /* for Firefox */
	overflow-y: scroll; 
}

.hide_scroll::-webkit-scrollbar {
	display: none; /* for Chrome, Safari, and Opera */
}

#igdb_logo {
	height: 15px;
	margin-top: 3px;
	align-items: center;
	color: var(--mw-gray);
	display: none;
}

#igdb_logo:hover {
	color: var(--mw-text);
}

#info_alias {
	position: relative;
	bottom: -6px;
	font-size: 12px;
	font-weight: bold;
	left: 5px;
}

label[for="goClip"]:hover {
	background-color: var(--pattern-color);
}

.live_chat {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: calc(100dvh - 45px);
	display: flex;
	flex-direction: column;
	background-color: var(--mw-background);
	z-index: 2;
	transition: height .4s;
}

.main_full_live {
	-ms-overflow-style: none; /* for Internet Explorer, Edge */
	scrollbar-width: none; /* for Firefox */
}

.miniplayer {
	position: relative;
	height: 0px;
	cursor:  pointer;
	overflow: hidden;
	transition: height .4s ease;
}

.miniplayer .plyr__controls, .miniplayer #chapters_in_player, .miniplayer #vol_info, .miniplayer #theatremode, .miniplayer .plyr__progress__marker, .miniplayer button[btn-label="chapterPrev"], .miniplayer button[btn-label="chapterNext"]{
	display: none;
	visibility: hidden;
}

.msg_box {
	display: flex;
	flex-direction: row;
	align-items: baseline;
	margin-bottom: 5px;
}

.msg_date {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-right: 5px;
	font-size: 10px;
	color: var(--mw-input-background);
}

.msg_body {
	display: inline;
}

.msg_msg {
	word-break: break-word;
	font-size: smaller;
}

.msg_alias {
	font-family: var(--mw-title-font);
}

.msg_alias:after {
	content: ":";
	color: var(--mw-text);
}

.player_live {
	position: relative;
	width: 100%;
}

.player_live,
.btn_close_tchat {
	transition: .5s;
}

.player_live .video_cinema .plyr {
	aspect-ratio: unset;
	max-height: unset;
	width: 100%;
	height: 100%;
}

.player_live .plyr {
	aspect-ratio: 16/9;
	max-height: calc(100dvh - 195px);
}

.player_live .plyr__progress {
	display: none;
}

.player_live.replay .plyr__progress {
	display: unset;
}

.player_live .plyr--video {
	margin: auto;
	width: 100%;
}

.player_live .plyr__video-wrapper {
	background: transparent;
}

.plyr:fullscreen #theatremode {
	display: none;
}

.main_full_live[data-action="theatremode"] [data-plyr="fullscreen"] {
	display: none;
}

.raid_msg {
	border-left: 4px solid var(--mw-yellow);
	border-right: 4px solid var(--mw-yellow);
	padding: 5px;
	margin-left: -5px;
	background-color: var(--mw-purple);
	margin-right: -5px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	margin-bottom: 5px;
}

.raid_msg .msg_alias,
.raid_msg .msg_msg {
	color: var(--mw-deep-dark);
}

.raid_msg .msg_alias:after {
	display: none;
}

.replay_description_zone {
	position: relative;
	padding: 10px 20px;
	display: flex;
	align-items: center;
	flex-direction: column;
	grid-gap: 10px;
}

.replay_description_zone .video_description,
.replay_description_zone .video_title,
.replay_description_zone .video_user {
	width: 100%;
	margin: unset;
}

.replay_scheduler {
	width: 100%;
	max-width: 1200px;
	border-radius: var(--mw-general-radius);
	overflow: hidden;
}

.replay_scheduler .schedule {
	padding: 20px;
	padding-top: 15px;
	height: 60px;
	cursor: pointer;
}

.replay_scheduler .schedule.opened {
	height: unset;
	cursor: unset;
	animation: open_description .2s ease;
}

.replay_scheduler .scheduler_arrow {
	display: block;
}

.replay_scheduler .schedule.opened .scheduler_arrow {
	display: none;
}

.replay_description_zone .schedule h3 {
	font-size: 25px;
}

#select_alias {
	width: 100%;
	border: 1px solid var(--mw-dark);
	border-radius: 4px;
	margin: 5px;
	padding: 5px;
}

.service_msg {
	background-color: color-mix(in srgb, var(--mw-purple) 30%, black);
}

.service_msg .msg_body {
	border-left: 3px solid var(--mw-purple);
	padding-left: 8px;
}

.service_msg .msg_date,
.service_msg .msg_alias {
	display: none;
}

#size_settings {
	width: 100%;
}

#size_settings_choice {
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	align-items: center;
}

.size1, .settings_size1 {
	font-size: 0.8rem;
}

.size2, .settings_size2 {
	font-size: 1rem;
}

.size3, .settings_size3 {
	font-size: 1.2rem;
}

.size4, .settings_size4 {
	font-size: 1.4rem;
}

.status_live_time {
	font-weight: bold;
}

.status_live_time .is_in_live {
	font-variant: small-caps;
}

.stream_infos {
	width: 100%;
	padding: 10px 20px;
	display: grid;
	grid-template-columns: calc(50% - 5px) calc(50% - 5px);
	grid-gap: 0px 10px;
}

.video_live {
	position: relative;
	width: 100%;
	height: auto;
	max-height: calc(100dvh - 195px);
	aspect-ratio: 16/9;
	display: flex;
	align-items: center;
	justify-content: center;
	grid-gap: 20px;
	background-color: #000;
	overflow: hidden;
}

.video_description.stream {
	display: flex;
	flex-direction: column;
	grid-gap: 20px;
	cursor: unset;
}

.video_description .user_description_links {
	margin-top: unset;
	padding: 2px 2px;
}

.video_description .user_description_links a {
	border-color: unset;
	border: var(--mw-general-border);
}

.video_description .user_description_links a:hover {
	text-decoration: none;
	outline: 2px solid var(--mw-thumbnails-background);
}

.video_description .user_description_links a.featured {
	border-color: var(--mw-light);
}

.video_description .user_description_links a.featured:hover {
	outline: 2px solid var(--mw-light);
}


/* ///////////////////////////////////////// */

/* ////////////// */
/* STREAM OFFLINE */
/* ////////////// */

.body_active .stream_offline{
	display: none;
}

.body_active .stream_offline_hover{
	display: flex;
}

.embed_more{
	display: inline-block;
	margin-top: 20px;
}

.embed_more_cover{
	width: 35%;
}

.embed_more_grid{
	margin-top: 20px;
	width: 100%;
	display: flex;
	grid-gap: 20px;
	justify-content: center;
}

.embed_title{
	font-size: 22px;
}

.stream_offline{
	position: relative;
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	z-index: 1;
}

.stream_offline_hover{
	display: none;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: relative;
	width: 100%;
	height: 100vh;
	z-index: 2;
}

.noise-wrapper {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	opacity: 1;
	overflow: hidden;
	z-index: 0;
  
	&:after {
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: radial-gradient(ellipse at center, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 100%);
	}
}

.noise {
	position: absolute;
	top: -500px;
	right: -500px;
	bottom: -500px;
	left: -500px;
	background: transparent url("./ressources/noise.png") 0 0;
	background-size: 10% 10%;
	opacity: .30;
	animation: noise .3s steps(8, end) infinite both;
}

#notifier_panel {
	display: none;
	position: fixed;
	right: 5px;
	width: 400px;
	top: 60px;
	max-height: calc(100dvh - 65px);
	min-height: 175px;
	backdrop-filter: blur(50px);
	background: rgba(14, 14, 16, 0.24);
	z-index: 9999;
	border: var(--mw-general-border);
	border-radius: var(--mw-general-radius);
	overflow: hidden;
}

#notifier_panel #notifier_body {
	padding: 15px 10px 5px 10px;
	overflow-y: auto;
	overflow-x: hidden;
	max-height: calc(100dvh - 115px);
}

.images_grid.home {
	max-width: unset;
	grid-template-columns: calc(20% - 2.5px) calc(20% - 2.5px) calc(20% - 2.5px) calc(20% - 2.5px) calc(20% - 2.5px);
}

@media screen and (max-width: 1040px) {
	.images_grid.home {
		grid-template-columns: calc(25% - 3.33px) calc(25% - 3.33px) calc(25% - 3.33px) calc(25% - 3.33px);
	}
	.images_grid.home > *:nth-child(n+5) {
		display: none;
	}
}

@media screen and (max-width: 720px) {
	.images_grid.home {
		grid-template-columns: calc(33.33% - 5px) calc(33.33% - 5px) calc(33.33% - 5px);
	}
	.images_grid.home > *:nth-child(n+4) {
		display: none;
	}
}

@media screen and (max-width: 600px){
	body:has(#notifier_panel[data-status="open"]) {
		overflow: hidden;
	}
}

/* ///////////////////////////////////////// */
/* MEDIA SCREEN SPECIFIQUE AU STREAM OFFLINE */
/* ///////////////////////////////////////// */

@media screen and (max-height: 350px){
	.embed_more{
		display: none;
	}
}

@media screen and (max-width: 600px) and (max-height: 350px){
	.embed_more_grid{
		margin-top: 10px;
	}
	.stream_offline_hover{
		margin-top: 12px;
		justify-content: start;
	}
	.embed_title{
		font-size: 17px;
	}
}

@media screen and (max-width: 600px){
	.embed_more_cover{
		width: 40%;
	}

	#notifier_panel {
		top: 0;
		left: 0;
		right: 0;
		width: 100dvw;
		height: calc(100dvh - 59px);
		max-height: 100%;
		border: unset;
		border-radius: unset;
	}
}

@media screen and (min-width: 601px) and (max-width: 1040px){
	#notifier_panel {
		top: 5px;
		height: calc(100% - 61px - 10px);
	}

	#notifier_panel #notifier_body {
		padding: 10px;
		height: calc(100% - 45px);
	}
}

/* ///////////////////////////////////////// */


@media screen and (min-width:1400px){
	.banner_page_live {
		position: absolute;
		top: 0;
		width: 100%;
		background-size: cover;
		background-position: center;
		aspect-ratio: 25/6;
		z-index: 0;
		-webkit-transition: aspect-ratio .3s linear;
		-moz-transition: aspect-ratio .3s linear;
		-o-transition: aspect-ratio .3s linear;
		-ms-transition: aspect-ratio .3s linear;
		transition: aspect-ratio .3s linear;
	}

	/* ///////////// */
	/* VIDEOS BANNER */
	/* ///////////// */
	.videos_banner_content{
		max-width: 720px;
		margin-bottom: 56px;
	}
	.videos_banner_thumbnail {
		width: 200px;
	}
}

@media screen and (max-width: 1340px){
	.watch_vod{
		grid-template-columns: repeat(3, calc(calc(100% / 3) - 13.33px));
	}

	.watch_playlists{
		grid-template-columns: repeat(4, calc(calc(100% / 4) - 13.33px));
	}
}

@media screen and (max-width: 1200px){
	.video_cinema{
		top: 40px;
	}
	.video_contenair_vod{
		margin-top: 0px;
		border-radius: 0px;
	}
	.video_contenair_reel{
		margin-top: 0px;
		border-radius: 0px;
	}
	.border-radius-12 .plyr--video{
		border-radius: 12px;
	}
	#player{
		border-radius: 0px;
	}
	.plyr--video{
		border-radius: 0px;
	}
	.comments_area, .new_comment, .video_description, .video_title, .video_user{
		margin-left: 10px;
		margin-right: 10px;
	}
	#navbar_pwatch_pc, #navbar_pwatch_pc{
		bottom: 0;
	}
	.list_grid{
		display: block;
		padding: 0;
	}
	#list{
		display: none;
	}
	#list_smartphone{
		display: block;
	}
}

@media screen and (min-width: 1400px){
	.banner_hover_live {
		margin-top: 30%;
		aspect-ratio: initial !important;
	}
}

@media screen and (max-width: 1399px){
	.banner_live {
		display: none;
	}

	.banner_page_live {
		position: fixed;
		top: 0;
		width: 100%;
		background-size: cover;
		background-position: center;
		aspect-ratio: 25/6;
		z-index: 0;
		-webkit-transition: aspect-ratio .3s linear;
		-moz-transition: aspect-ratio .3s linear;
		-o-transition: aspect-ratio .3s linear;
		-ms-transition: aspect-ratio .3s linear;
		transition: aspect-ratio .3s linear;
	}
}

@media screen and (min-width: 1200px){
	.user_about_grid{
		padding-left: 0px;
		padding-right: 0px;
	}
}

@media screen and (max-width: 1120px){
	button{
		padding: 12px 30px;
	}
	.community_contenair{
		width: 100%;
		display: block;
		padding-left: 15px;
		padding-right: 15px;
	}
	.community_content{
		margin: auto;
	}
	.community_posts{
		max-width: 700px;
		margin: auto;
	}
	.home_subtitle{
		margin: auto;
	}
	.last_podcasts {
		grid-template-columns: repeat(4, calc(calc(100% / 4) - 15px));
	}
}

@media screen and (max-width: 1040px){
	#header_body {
		margin-top: 20px;
	}
	.banner_hover {
		margin-top: 20px;
	}
	.content_contenair {
		position: absolute;
	}
	.watch_vod, .watch_playlists {
		grid-template-columns: repeat(2, calc(calc(100% / 2) - 13.33px));
	}
	.watch_reels {
		grid-template-columns: repeat(3, calc(100% / 3));
		padding-left: 10px;
		padding-right: 10px;
	}
	.watch.watch_home {
		grid-template-columns: repeat(2, calc(calc(100% / 2) - 13.33px));
	}
	.channel_separator {
		height: 30px;
	}
	#navbar_watch_pc {
		display: none;
	}
	nav.navbar {
		top: auto !important;
		bottom: 0;
		padding: 30px 15px;
		z-index: 4;
	}
	section.header{
		margin-top: 0;
	}
	#content_body {
		padding-top: 0px;
	}
	#content_popup, #post_popup {
		padding-top: 0px;
	}
	#search-box{
		top: 0px;
	}
	.main_user_menu.fixed{
		position: fixed;
		top: 0;
		left: 0;
		padding-left: 10px;
		max-width: 100% !important;
		width: 100%;
		background-color: #121212d6;
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
	}
	.home_community{	
		grid-template-columns: repeat(10, calc(50% - 10px));
	}
	.home_channels {
		grid-template-columns: calc(50% - 10px) calc(50% - 10px);
	}
	.span_button_user_home {
		font-size: 13px;
		display: -webkit-box;
		max-width: 20vw;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.btn_nav_cnx1 {
		display: none;
	}
	.btn_nav_cnx2 {
		display: flex;
	}
	.menu_personnalisation {
		position: absolute;
		bottom: 50px;
		top: auto;
		background: #0009;
		padding: 5px;
		border-radius: 5px;
		right: 10px;
		width: 215px;
		outline: 1px solid var(--mw-deep-dark);
		display: none;
	}
	.menu_lang {
		position: absolute;
		top: auto;
		bottom: 50px;
		right: 50px;
		width: 215px;
		border: 1px solid var(--mw-thumbnails-borders);
		border-radius: var(--mw-half-radius);
		z-index: 6;
		filter: drop-shadow(2px 4px 6px var(--mw-background));
		backdrop-filter: blur(4px) brightness(0.5);
		padding: 10px 15px;
		display: none;
	}
	#session_menu {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 0 !important;
		grid-gap: 5px;
		border-radius: var(--mw-buttons-radius);
		margin: 0 0 0 15px;
		position: relative;
	}
	#session_menu img {
		width: 30px;
		height: 30px;
		border-radius: 100%;
	}
	.session_user_menu {
		top: unset !important;
		bottom: 62px;
	}
	.image_infos {
		max-height: calc(100dvh - 60px);
	}
	.live_block {
		display: flex;
		flex-direction: column-reverse;
		margin: 40px 0px;
	}
	.main_full_live .live_block.video_live {
		display: flex;
		flex-direction: column-reverse;
		margin: 0;
		padding: 40px 15px;
	}
	.live_block .status{
		width: 100%;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
	}
	.chat_full_live {
		top: 0px;
		height: calc(100dvh - 60px);
	}
	.live_chat {
		height: calc(100dvh - 60px);
	}
	.replay_description_zone {
		padding: 10px 15px;
	}
	.stream_infos {
		padding: 10px 15px;
		grid-template-columns: 100%;
		grid-gap: 10px 0px;
	}
	.last_podcasts {
		grid-template-columns: repeat(3, calc(calc(100% / 3) - 15px));
	}
	.community_contenair {
		margin-top: 45px;
	}
	#full_image {
		padding: 10px;
		top: 0px;
		height: calc(100dvh - 60px);
	}

	/* ///////// */
	/* IMAGES */
	/* ///////// */
	#single_image_grid{
		grid-template-columns: calc(100% - 350px) 350px;
	}
	#single_image{
		max-height: calc(100dvh - 60px);
	}
	#single_image_popup{
		padding-top: 0px;
		padding-bottom: 60px;
	}
	.disp_icons{
		padding: 0px 10px;
	}

	  /* ///////////// */
	 /* VIDEOS BANNER */
	/* ///////////// */
	.videos_banner_content{
		max-width: 720px;
		margin-bottom: 56px;
	}
	.videos_banner_thumbnail {
		width: 200px;
	}
}

@media screen and (min-width: 1041px){
	#navbar_watch_phone{
		display: none;
	}
	#search-box{
		top: 45px;
	}
}

@media screen and (max-width: 980px){
	.upload_table{
		grid-gap: 15px;
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media screen and (min-width: 1434px){
	.watch-musics{
		grid-template-columns: repeat(4, calc(100% / 4) - 4px) !important;
		margin-left: unset;
	}
}

@media screen and (min-width: 1055px) and (max-width: 1433px){
	.watch-musics{
		grid-template-columns: repeat(3, 34%) !important;
		margin-left: -25px;
	}
}

@media screen and (min-width: 800px) and (max-width: 1054px){
	.watch-musics{
		grid-template-columns: repeat(2, 52.5%) !important;
		margin-left: -40px;
	}
}

@media screen and (min-width: 721px) and (max-width: 799px){
	.watch-musics{
		grid-template-columns: repeat(2, 53%) !important;
		margin-left: -48px;
	}
}

@media screen and (max-width: 820px){
	.full_live_block {
		grid-template-columns: 100%;
	}
	.video_live {
		position: sticky;
		top: 0;
		z-index: 3;
	}
	.chat_full_live {
		position: absolute;
		width: 100vw;
		border-left: 0px;
	}
	.live_chat {
		width: 100vw;
		transition: unset;
	}
}

@media screen and (max-width: 689px){
	.general_margin{
		margin-left: 5px;
		margin-right: 5px;
	}
	#page_body, .body_boxed {
		padding: 0px 0px;
	}
	#header_body{
		margin-top: 0px;
		border-radius: 0px;
	}
	#content{
		margin-top: 0px !important;
		background-color: var(--mw-background) !important;
		position: relative !important;
		z-index: 1 !important;
	}
	.live_avatar{
		border: 1px solid var(--mw-dark);
	}
	.live_avatar::after{
		bottom: -6px;
		border-radius: 2px;
		font-size: 10px;
		outline: 1px solid var(--mw-dark);
	}
	.watch_vod, .watch_playlists {
		grid-template-columns: 100%;
		grid-gap: 0px;
	}
	.watch_reels {
		grid-template-columns: repeat(2, calc(100% / 2));
	}
	.watch.watch_home {
		grid-template-columns: 100%;
	}
	.audio_watch {
		display: grid;
		grid-template-columns: 100%;
		padding: 0 15px;
	}
	.last_podcasts {
		padding-left: 15px;
		padding-right: 15px;
		grid-template-columns: repeat(2, calc(calc(100% / 2) - 10px));
	}
	.last_podcasts.no_more{
			margin-bottom: 36px;
	}
	.watch_title{
		padding-left: 10px;
		padding-right: 10px;
	}
	.watch_reels .watch_title{
		padding: 0 5px 10px 5px;
	}
	.border-radius-12{
		border-radius: 0px;
	}
	.iframe{
		padding-bottom: 30px;
	}
	.plyr__controls__item.plyr__volume input{
		display: none;
	}
	.send_button_text{
		display: none;
	}
	.block_menu {
		padding-top: 0 !important;
		position: sticky !important;
		top: -1px !important;
		z-index: 2 !important;
		display: flex !important;
		flex-direction: row !important;
		justify-content: flex-start !important;
		align-items: center !important;
		background-color: var(--mw-background) !important;
	}
	.channels_tab{
		margin-left: 10px;
	}
	.watch_reels .border-radius-12, .replays_videos .border-radius-12, .watch_replays .border-radius-12{
		border-radius: 12px;
	}
	.user_card{
		padding: 30px 10px;
		padding-left: 14px;
		grid-gap: 20px;
	}
	.blur_banner{
		height: 90px;
		margin-top: -110px;
	}
	.border-radius-12 .plyr--video{
		border-radius: 0px;
	}
	.search_results{
		display: block;
		padding: 0 0px 30px 0px;
	}
	.search_user{
		margin-top: 6px;
		margin-bottom: 20px;
	}
	.search_description{
		display: none;
	}
	.search_description_small{
		display: -webkit-box;
		margin-top: 6px;
		color: var(--mw-gray);
		-webkit-line-clamp: 3;
		line-clamp: 3;
		-webkit-box-orient:
		vertical; overflow: hidden;
	}
	.banner{
		border-radius: 0px;
	}
	.banner_hover{
		margin-top: 0px;
		border-radius: 0px;
	}
	.user_avatar{
		width: 90px;
		min-width: 90px;
		height: 90px;
	}
	.user_description h1{
		text-align: left;
		padding-top: 0px;
		color: var(--mw-title);
		font-family: var(--mw-title-font);
		font-size: 24px;
	}
	.user_description p{
		color: var(--mw-gray);
		margin-bottom: 10px;
		font-size: 11px;
		text-align: left;
	}
	.videos_infos, .articles_infos, .images_infos{
		margin-top: 5px;
		padding-left: 10px;
		padding-right: 10px;
	}
	.chapter_thumbnail{
		width: 180px;
	}
	.chapter_bar{
		width: 202px;
	}
	.chapter.active .chapter_bar{
		background-color: unset;
		background: linear-gradient(90deg, var(--mw-purple) 191.5px, var(--mw-input-background) 191.5px);
	}
	.main_nav{
		padding-top: 0px;
		top: 0;
		height: 0 !important;
	}
	.user_about_grid{
		padding-left: 10px;
		padding-right: 10px;
	}
	#watch_reels, #watch_replays{
		padding-left: 10px;
		padding-right: 10px;
	}
	.watch_reels .border-radius-12, .watch_replays .border-radius-12{
		border-radius: 12px;
	}
	.playlist{
		grid-template-columns: 100%;
		margin-left: 0px;
		margin-right: 0px;
		margin-top: 0px;
		overflow: hidden;
	}
	.thumbnail_play_all{
		border-radius: 0px;
	}
	.playlist_blurred_thumbnail{
		width: 150%;
	}
	.playlist_infos{
		position: relative;
		top: 0px;
		border-top-left-radius: 0px;
		border-top-right-radius: 0px;
		z-index: 0;
		height: unset;
		overflow: unset;
	}
	.playlist_item{
		padding-left: 5px;
	}
	.playlist_videos{
		margin-bottom: 45px;
		padding: 24px;
		z-index: 1;
	}
	.hide_720{
		display: none !important;
	}
	#community #community_grid{
		grid-template-columns: calc(33% - 2.5px) calc(33% - 2.5px) calc(33% - 2.5px);
		grid-gap: 5px;
		margin-bottom: 5px;
	}
	.home_community{
		width: calc(100% - 20px);
		margin-left: 10px;
		margin-right: 10px;
		margin-bottom: 20px;
		grid-template-columns: repeat(10, 100%);
		grid-gap: 10px;
	}
	.navigate_left{
		left: 3px;
	}
	.navigate_right{
		right: 3px;
	}
	.video_contenair_vod{
		position: sticky;
		top: -10px;
		z-index: 3;
	}
	.popup_video_search{
		padding: 20px 20px;
	}
	#medias_previews{
		margin-top: 20px;
	}
	#place_preview{
		max-width: 130px;
		bottom: 4px;
	}
	.community_audio_cover{
		width: 100px;
		min-width: 100px;
	}
	#full_image {
		padding: 0px;
		top: 0px;
		height: calc(100dvh - 60px);
	}
	.home_channels{
		grid-template-columns: 100%;
		grid-gap: 10px;
		padding-left: 10px;
		padding-right: 10px;
	}
	.home_live_block{
		display: block;
	}
	.home_live_description{
		margin-top: 20px;
	}
	.home_subtitle {
		margin: 0px 10px 10px 10px;
	}
	.is_live {
		margin: 0px 10px;
		margin-bottom: 0px;
		max-width: unset;
	}
	.watch_reels.watch_reels_homepage .watch_title{
		padding-left: 0px;
		padding-right: 0px;
	}
	.live_block {
		padding: unset;
		padding-bottom: 50px;
		border: unset;
		border-radius: unset;
		border-bottom: 1px solid var(--mw-dark);
	}
	.live_block .status {
		padding: 0px 10px;
		border-radius: 0px;
	}
	#live_clips, #live_replays {
		margin-left: 20px;
		margin-right: 20px;
	}
	.stream_preview {
		border-radius: 0px;
	}

	/* //////////////////// */
	/* IMAGES & COLLECTIONS */
	/* //////////////////// */
	.collection_contenair {
		padding: 0px 0px;
	}
	.collection_header .collection_creator{
		font-size: 12px;
	}
	.gallery_icon {
		top: 6px;
		right: 6px;
	}
	.gallery_reaction {
		display: block;
	}
	.gallery_reaction.gallery_heart{
		margin-right: unset;
	}
	.images_grid{
		grid-template-columns: 33% 33% 33%;
		grid-gap: 2px;
	}
	.images_grid.collections{
		grid-template-columns: 100%;
		padding: 0px 5px;
	}
	.images_grid.justified > .images_thumbnail_contenair, .images_grid.justified::after{
		width: unset;
		height: unset;
		aspect-ratio: unset;
		--row-height: 7rem;
		flex-basis: calc(var(--ratio) * var(--row-height));
	}

	/* //////////// */
	/* SINGLE_IMAGE */
	/* //////////// */
	.image_comment{
		position: fixed;
		bottom: 60px;
	}
	.image_description{
		margin: 0px 5px;
	}
	.image_infos{
		max-height: unset;
		padding-bottom: 70px;
		border-top: 1px solid var(--mw-content-background);
		border-left: none;
	}
	.image_interactions_pc{
		display: none;
	}
	.image_interactions_smartphone{
		display: block;
	}
	.image_item{
		width: 100%;
		height: 100%;
	}
	#single_image{
		max-height: unset;
	}
	#single_image_grid{
		display: block;
		overflow-y: scroll;
		border-top: 0px;
	}
	#content_body #single_image_grid{
		height: 100%;
	}
	.single_image_user_pc{
		display: none;
	}
	.single_image_user_smartphone{
		display: flex;
	}
	.stickers{
		margin: 0px 5px;
	}

	/* ////////////////// */
	/* SINGLE_COLLECTION */
	/* //////////////// */
	.collection_contenair{
		padding: 0px 0px;
	}
	.collection_contenair .disp_icons{
		display: flex;
		margin-right: 5px;
	}
	.collection_header h1{
		font-size: 28px;
	}
	.collection_contenair .images_grid.justified > .images_thumbnail_contenair, .images_grid.justified::after{
		--row-height: 9rem;
	}
	.collection_header_content{
		grid-gap: 10px;
		padding: 20px;
	}
	.collection_header .collection_creator{
		font-size: 12px;
	}
	.collection_header .collection_description{
		font-size: 16px;
	}

	/* ///////////// */
	/* VIDEOS BANNER */
	/* ///////////// */
	#videos_banner{
		display: none;
	}

	/* Retirer les !important quand le style in-code sera ici */
	#search-box2 {
		margin: auto 10px !important;
	}

	#search-box2 .search_bg {
		padding: 20px 0 !important;
	}

	#search-box2 #search_bar {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.search_results h2 {
		margin-left: 20px !important;
		width: auto !important;
	}
}

@media screen and (max-width: 630px){
	.watch_reels_homepage{
		width: 100%;
		display: block;
		margin-bottom: 50px;
		white-space: nowrap;
		overflow-x: scroll;
	}

	.watch_reels_homepage .border-radius-12{
		aspect-ratio: 9/16;
		border-radius: 12px;
	}

	.watch_reels_homepage .iframe{
		max-width: 50%;
		margin: 0px 5px;
		display: inline-block;
	}
}

@media screen and (max-width: 520px){
	.watch_reels{
		display: grid;
	}

	.watch_reels .border-radius-12{
		border-radius: 0px;
	}
}

.images_grid.home {
	max-width: unset;
	grid-template-columns: repeat(5, calc(20% - 6px));
}

.images_thumbnail_contenair .gallery_icon[data-active="false"]{
	display: none;
}

.images_thumbnail_contenair img[data-generated-blurhash]{
	position: absolute;
	width: 100%;
	height: 100%;
}

.iframe img[data-generated-blurhash]{
	position: absolute;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 1040px) {
	.images_grid.home {
		grid-template-columns: repeat(4, calc(25% - 3.33px));
	}
	.images_grid.home > *:nth-child(n+5) {
		display: none;
	}
}

@media screen and (max-width: 720px) {
	.images_grid.home {
		grid-template-columns: repeat(3, calc(33% - 5px));
		grid-gap: 10px;
	}
	.images_grid.home > *:nth-child(n+5) {
		display: none;
	}
}

@media screen and (max-width: 689px) {
	.images_grid.home {
		grid-template-columns: repeat(3, calc(33% - 5px));
		padding: 0 10px;
		grid-gap: 10px;
	}
	.images_grid.home > *:nth-child(n+5) {
		display: none;
	}
}