/* #### RESET #### */  
:root {
	--lineHeightBig: 2.5rem;
	--lineHeight: 2rem;
	--lineHeightMedium: 1.5rem;
	--lineHeightSemiBig: 1.8rem;
	--lineHeightSmall: 1.1rem;
	--splitterHeight:0.05rem;
	--lineHeightTiny: 0.9rem;
	--smallText:0.7rem;
	--loadingSize:5rem;
	--mobilePlayerSize: 8rem;
	--mobilePlayerSizeSingle: 8;
	--mobilePlayerPlaySize: 5rem;
	--textAreaHeight: 12rem;
	--mediumText:0.8rem;
	--semiText:0.9rem;
	--hoverTransition: all .2s ease-in-out; 
	--scrollbarHeight: 0.5rem;
	--placeholderMargin: 5.5rem;
	--pageLoadingIndicatorHeight:0.15rem;
	--playerIndicatorHeight:0.5rem;
	--popupTop:8rem;
	--popupTopMobile:5rem;
	--borderThickness:0.1rem;
	--headerText: 1rem;
	--fabBottomMargin: 4.2rem;
	--sidebarMobileBottomMargin: 7.5rem;
	--sidebarMobileWidth: 80%;
	--headerTextMedium: 1.3rem;
	--buttonScale: scale(1.2);
	--itemScale: scale(1.05);
	--smallHeaderText: 1.1rem;
	--darkLayer: rgba(0, 0, 0, 0.8);
	--semiDarkLayer: rgba(0, 0, 0, 0.4);
	--bigHeaderText: 2rem;
	--semiBigHeaderText: 1.6rem;
    --colorPrimary:#071828;
	--itemWidth: 10rem;
	--itemWidthSmall: 7rem;
	--itemWidthMini: 5rem;
	--itemWidthTiny: 3.8rem;
	--itemWidthBig: 15rem;
	--colorPrimaryLight:#0e2c48;
	--colorPrimaryDark:#0c121b;
	--colorLightSecondary:#cbdede;
	--colorPrimaryDarkTransparentLight:#cbdede;
	--colorPrimaryDarkTransparentLighter:#cbdede;
	--colorSecondary:#6d96ca;
	--colorSecondaryDark:#50729d;
	--colorLight:#f8ffff;
	--colorAccent:#e13360;
	--colorAccentTransparent: rgba(225, 51, 96, 0.2);
	--colorAccentTransparentMore: rgba(225, 51, 96, 0.5);
	--colorAccentDark:#a12041;
	--sidebarWidth:15%;
	--sidebarWidthDouble:30%;
	--sidebarWidthRight:15%;
	--mediumMargin:1.5rem;
	--defaultMargin:2rem;
	--hugeMargin:4rem;
	--bigMargin:2.5rem;
	--smallMargin:1rem;
	--tinyBigMargin:0.9rem; 
	--tinyMargin:0.5rem;
	--volumeMargin:1.8rem;
	--tinyBiggerMargin:0.7rem; 
	--miniMargin:0.2rem;
	--miniBigMargin:0.3rem;
	--smallIcon:1.2rem;
	--tinyIcon:0.8rem;
	--mobileIcon:1.5rem;
	--mobileNaviPadding: 6rem;
	--arrowIcon:0.8rem;
	--miniIcon:0.7rem;
	--sideIcon:1rem;
	--arrowIconBig:1.2rem;
	--regularRadius: 0.4rem;
	--bigRadius: 40rem;
	--fullRadius: 100rem;
	--userThumb: 2rem;
	--userThumbBig: 3rem;
	--userThumbSemiHuge: 4rem;
	--userThumbHuge: 5rem;
	--replyMargin:4rem;
	--storyThumb: 3.5rem;
	--playBig: 3.5rem;
	--loaderSize: 3rem;
	--loaderInner: 0.8rem;
	--playBigMargin: 1.3rem;
	--fabMargin: 1.2rem;
	--galleryMobileHeight: 16rem;
	--playMedium: 2.8rem;
	--playMediumMargin: 1rem;
	--colorPrimaryDarker: #06090d;
	--smallContainerWidth: 50%;
	--colorPrimaryDarkest: #030406;
	--colorBlackTransparent: rgba(0, 0, 0, 0.4); 
	--colorBlack: #000000;
	--tintColorLight: invert(89%) sepia(16%) saturate(490%) hue-rotate(174deg) brightness(113%) contrast(113%);
	--tintColorLightSecondary: invert(97%) sepia(16%) saturate(281%) hue-rotate(127deg) brightness(91%) contrast(90%);
	--tintColorSecondary: invert(65%) sepia(17%) saturate(1201%) hue-rotate(176deg) brightness(87%) contrast(78%);
	--tintColorAccent: invert(28%) sepia(93%) saturate(1545%) hue-rotate(320deg) brightness(90%) contrast(96%);
	--colorPrimaryDarkTransparent: rgba(12, 18, 27, 0.6);
	--scrollbarWidth: 1rem;
}
@font-face {
    font-family: 'normal';
    src: url('../font/apercu_regular.otf');
}
@font-face {
    font-family: 'bold';
    src: url('../font/apercu_bold.otf');
}
@font-face {
    font-family: 'italic';
    src: url('../font/apercu_italic.otf');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	font-family: 'normal';
	color: var(--colorLightSecondary);
	line-height:var(--lineHeight);
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#071828+0,0e2c48+50,071828+100 */
	background: rgb(7,24,40); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(7,24,40,1) 0%, rgba(14,44,72,1) 50%, rgba(7,24,40,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(7,24,40,1) 0%,rgba(14,44,72,1) 50%,rgba(7,24,40,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(7,24,40,1) 0%,rgba(14,44,72,1) 50%,rgba(7,24,40,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#071828', endColorstr='#071828',GradientType=0 ); /* IE6-9 */
	background-repeat: no-repeat;
	background-attachment: fixed;
}
i {
	font-style:italic;	
}
input:focus {
  outline: none;
}
body, html{
	margin:0;
	height:100%;
} 
strong {
	font-family: 'bold';
}
ol, ul {
	list-style: none;
	list-style-type: none;
}
em {
	font-style:italic;	
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
h1, h2, p {
    margin: 0;
}
a:focus { 
	outline: none; 
}

input,
textarea,
button,
select,
div,
a {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* #### END RESET #### */  

/* #### GENERAL #### */ 

.button, input[type="submit"], input[type="reset"] {
	text-decoration:none!important;
	padding: var(--tinyMargin);
	border-radius: var(--fullRadius);
	background-color: var(--colorAccent);
	display:inline-block;
	font-family: 'bold';
	line-height:1;
	font-size: var(--mediumText);
	text-align:center;
	color: var(--colorLight);
	box-sizing:border-box;
	transition: var(--hoverTransition); 
}

.button:active , input[type="submit"]:active , input[type="reset"]:active {
	transform: var(--buttonScale);
}

.button.thick {
	padding: var(--tinyBiggerMargin)!important;
}

.button.light {
	background-color: var(--colorSecondary);
}

.button.big {
	padding: var(--miniMargin) var(--mediumMargin) var(--miniMargin) var(--mediumMargin);
}

.button:hover, input[type="submit"]:hover {
	background-color: var(--colorAccentDark);
}

.button.light:hover {
	background-color: var(--colorSecondaryDark);
}


input[type="submit"] {
	border:none;
	cursor:pointer;
	padding: var(--smallMargin) var(--mediumMargin) var(--smallMargin) var(--mediumMargin);
	margin-top: var(--mediumMargin);
}

.button.dark {
	background-color: var(--colorPrimaryDarker);
	color: var(--colorLightSecondary);
}

.button.dark:hover {
	background-color: var(--colorBlack);
}

.center {
	text-align:center;
}
a {
	color: var(--colorLight);
	text-decoration:none;
}

a,div:not(.ui-slider-range):not(.tt):not(.ct),li,span:not(.ui-slider-handle) {
	transition: var(--hoverTransition); 
}

a:hover {
	text-decoration:underline;
}

.dot {
	margin-left: var(--tinyMargin);
	margin-right: var(--tinyMargin);
}

.clear {
	clear:both;
}
.rounded {
	border-radius: 50%;
}

.head {
	border-radius: var(--regularRadius);
	padding-left: var(--tinyMargin);
	padding-right: var(--tinyMargin);
}

.head.big {
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	border-radius: 0;
}

.head.big.margin {
	margin-top:var(--mediumMargin);
}

.head.big:hover {
	background-color: var(--colorPrimary);
}

.head:hover {
	background-color: var(--colorPrimaryDarker);
}
.head.single:hover {
	background-color: transparent!important;
}

aside.right .head:hover {
	background-color: var(--colorPrimaryDarker);
}

.head a {
	display:flex;
	align-items: center;
	width:100%;
	color: var(--colorLight);
	text-decoration:none;
}

.head h2 {
	font-size: var(--headerText);
	color: var(--colorLight);
	font-family: 'bold';
	float:left;
	flex-grow:1;
}

.head.single h2 {
	float:none!important;
}

.head.big h2 {
	font-size: var(--headerTextMedium);
}

.head img {
	height: var(--arrowIcon);
	filter: var(--tintColorLight);
	text-align: right;
}

.head.big img {
	height: var(--arrowIconBig);
	filter: var(--tintColorLight);
	text-align: right;
}

.head.big span {
	font-size:var(--smallText);
	color:var(--colorSecondary);
}

.slider .owl-stage-outer {
    padding: 0 var(--defaultMargin) 0 var(--defaultMargin)!important;
}

.grecaptcha-badge { 
    visibility: hidden;
}

.loader {
	margin: 0 auto;
	width: var(--loaderSize);
	text-align: center;
	display:none;
}

.loader > div {
	width: var(--loaderInner);
	height: var(--loaderInner);
	background-color: var(--colorLight);

	border-radius: 100%;
	display: inline-block;
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

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

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

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

.loadmorecontainer {
	text-align:center;
}
.loadmorecontainer .loadmore {
	text-decoration:none!important;
	padding: var(--tinyMargin);
    border-radius: var(--fullRadius);
    line-height: 1;
	background-color: var(--colorSecondary);
	display:inline-block;
	font-family: 'bold';
	font-size: var(--mediumText);
	text-align:center;
	color: var(--colorLight);
	box-sizing:border-box;
}

.loadmorecontainer .loadmore:hover {
	background-color: var(--colorSecondaryDark);
}

.placeholder {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

.scrollable  {
	white-space: nowrap;
	position: relative;
	overflow-x:scroll;
	display:flex;
	line-height:var(--lineHeightMedium);
	overflow-y:hidden;
	-webkit-overflow-scrolling: touch;
	overflow-scrolling: touch;
	padding:var(--smallMargin) var(--defaultMargin) var(--smallMargin) var(--defaultMargin);
}

.usercontainer {
	width: auto;
	float: none;
	display: inline-block;
	text-align:center;
	margin: 0 var(--smallMargin) 0 var(--smallMargin);
	zoom: 1;
	text-decoration:none!important;
}

.usercontainer:first-of-type {
	margin-left:0!important;
}

.usercontainer:last-of-type {
	margin-right:0!important;
	border-right:var(--defaultMargin) solid transparent;
}

.usercontainer:hover .img {
	background-color: var(--semiDarkLayer);
    background-blend-mode: multiply;
}

.usercontainer .img {
	text-align:center;
	width:var(--playBig)!important;
	height: var(--playBig)!important;
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	border-radius:50%;
	margin:0 auto;
}

.usercontainer strong {
	color: var(--colorLight);
	display:block;
	margin:0 auto;
	margin-top:var(--tinyMargin);
}

.margindiv {
	margin-top:var(--defaultMargin);
}

.msg {
	position:fixed;
	bottom:0;
	width:100%;
	text-align:center;
	left:0;
	box-sizing:border-box;
	background-color:var(--colorAccent);
	padding:var(--tinyMargin);
	color:var(--colorLight);
	z-index:1000000000000;
	-webkit-animation: fadeinout 4s linear forwards;
    animation: fadeinout 4s linear forwards;
	line-height:var(--lineHeightMedium);
}

@-webkit-keyframes fadeinout {
  0%,100% { opacity: 0; visibility:hidden; }
  10%,90% { opacity: 1; visibility:visible; }
}

@keyframes fadeinout {
  0%,100% { opacity: 0; visibility:hidden }
  10%,90% { opacity: 1; visibility:visible; }
}

.splitter {
	height:--splitterHeight;
	background-color:var(--colorPrimary);
	margin:var(--mediumMargin) var(--defaultMargin) var(--mediumMargin) var(--defaultMargin);
}

.loading {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right:0;
	background: var(--colorBlackTransparent);
	transition: opacity 500ms; 
	visibility: hidden;
	opacity: 0;
	z-index:100000001;
}

.loading img {
	width:var(--loadingSize);
	margin: auto;
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
}

.sharer {
	line-height:0;
}

.sharer img {
	width:var(--playMedium);
	margin:var(--tinyMargin);
}

/* #### END GENERAL #### */ 

/* #### SIDEBAR #### */ 

aside.left {
	background: var(--colorPrimaryDark);
	width:var(--sidebarWidth);
	padding:var(--smallMargin);
	box-sizing:border-box;
	overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
	position:fixed;
    top: 0;
    bottom: 0;
	-webkit-box-shadow: 4px 0px 14px -6px rgba(0,0,0,0.37);
	-moz-box-shadow: 4px 0px 14px -6px rgba(0,0,0,0.37);
	box-shadow: 4px 0px 14px -6px rgba(0,0,0,0.37);
}

aside::-webkit-scrollbar { 
    width: 0;
    height: 0;
}

aside.left .logo {
	width:100%;
}

aside.left ul li {
	width:100%;
	font-size: var(--semiText);
	border-radius: var(--regularRadius);
	padding-left: var(--tinyMargin);
	padding-right: var(--tinyMargin);
	box-sizing:border-box;
	margin-top: var(--tinyMargin);
}

aside.left ul li.active {
	background-color: var(--colorAccent);
}

aside.left ul li.active a {
	color: var(--colorLight);
}


aside.left ul li.active img {
	filter: var(--tintColorLight);
}

aside.left ul li:hover:not(.active) {
	background-color: var(--colorPrimaryDarker);
}

aside.left ul li a {
	display:block;
	text-decoration:none;
	color: var(--colorLightSecondary);
	width:100%;
}

aside.left ul li img {
	width: var(--smallIcon);
	height: var(--smallIcon);
	vertical-align:middle;
	margin-right: var(--tinyMargin);
	filter: var(--tintColorLightSecondary);
}

aside.left ul li span {
	vertical-align:middle;
}

aside section {
	margin-top: var(--mediumMargin);
	
}

aside.left section.news .item {
	margin-top: var(--tinyMargin);
	border-radius: var(--regularRadius);
	padding: var(--tinyMargin);
}

aside.left section.news .item a {
	text-decoration:none!important;
}

aside.left section.news .item:hover {
	background-color: var(--colorPrimaryDarker);
}

aside.left section.news .item .img {
	width:var(--userThumb);
	height: var(--userThumb);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	border-radius:50%;
	margin-right: var(--tinyMargin);
}

aside.left section.news .item p {
	color: var(--colorLight);
	font-size: var(--smallText);
	line-height:var(--lineHeightSmall);
	overflow:hidden;
	flex:1;
}

aside.left section.news .item p span {
	color: var(--colorSecondary);
	
}

aside.left section.news .item p time {
	font-size: var(--smallText);
	color: var(--colorLightSecondary);
	display:block;
	margin-top:var(--miniMargin);
}

/* #### END SIDEBAR #### */ 

/* #### MAIN #### */ 

.main {
	margin-left:var(--sidebarWidth);
	margin-right:var(--sidebarWidthRight);
	padding: var(--defaultMargin) 0 var(--defaultMargin) 0;
}

.main.noright {
	margin-right:0;
	padding: 0 0 var(--defaultMargin) 0;
	min-height:100%;
}

.main.nopadding {
	padding: 0 0 var(--defaultMargin) 0;
}

.main .mobileheader {
	display:none;
	padding: 0 var(--smallMargin) var(--mediumMargin) var(--smallMargin);
	width: 100%;
	box-sizing:border-box;
}

.main .mobileheader .logo {
	display:table-cell;
	padding-right: var(--tinyMargin);
	box-sizing:border-box;
	vertical-align:middle;
	line-height:0;
}

.main .mobileheader .user {
	display:block;
	width: var(--userThumbBig);
	height: var(--userThumbBig);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	border-radius:50%;
	vertical-align:middle;
	float:right;
	text-indent: -9999px; 
	white-space: nowrap; 
}

.main .mobileheader a img {
	max-width:100%;
}

.main .mobileheader .useroptions {
	vertical-align:middle;
	display:table-cell;
	white-space: nowrap;
}

.main .mobileheader .useroptions .button {
	padding:var(--smallMargin);
}

.main header {
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	line-height: var(--lineHeightMedium);
}

.main header.dark {
	background-color:var(--colorPrimary);
}

.main header.full:not(.bottom) {
	padding: 0!important;
}
.main header.full.bottom {
	padding: 0 0 var(--defaultMargin) 0!important;
}

.main section {
	margin-bottom: var(--mediumMargin);
}

.main header .signinlogo {
	width:50%;
	margin:0 auto;
	text-align:center;
	margin-bottom:var(--mediumMargin);
}

.main header h1 {
	font-size: var(--bigHeaderText);
	color: var(--colorLight);
	line-height: var(--lineHeightBig);
	font-family: 'bold';
}

.main .teaser {
	display: flex;
	margin-top: var(--mediumMargin);
	margin-bottom: var(--bigMargin);
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
}

.main .teaser .gallery {
	width:calc(50% - var(--tinyMargin)); 
	box-sizing:border-box;
	flex: 1;
	display:flex;
	margin-right: var(--tinyMargin);
	border-radius: var(--regularRadius);
	overflow:hidden;
	background-color: var(--colorPrimary);
}

.main .teaser .gallery .owl-carousel .container {
	background-repeat: no-repeat;
	background-size:cover;
	background-position: 50% 50%;
	display:block;
	text-decoration:none!important;
	width:100%;
	position:relative;
	height:100%;
}

.main .teaser .gallery .owl-carousel .container:active {
	transform: var(--itemScale);
}

.main .teaser .gallery .owl-carousel .container:hover .box .play  {
	background: var(--colorAccentDark)!important;
}

.main .teaser .gallery .owl-carousel .container time {
	display:block;
	height: auto;
	z-index: 1000;
    position: absolute;
	font-size: var(--smallText);
    left: var(--mediumMargin);
    margin-right: var(--mediumMargin);
    top: var(--mediumMargin);
    margin: auto;
	background: var(--colorPrimaryDarkTransparent);
	padding: var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}

.main .teaser .gallery .owl-carousel .container .new {
	display:block;
	height: auto;
	z-index: 1000000;
    position: absolute;
	font-size: var(--smallText);
    right: var(--mediumMargin);
    margin-left: var(--mediumMargin);
    top: var(--mediumMargin);
    margin: auto;
	background: var(--colorSecondary);
	padding: var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}

.main .teaser .gallery .owl-carousel .container .gradient {
	width:100%;
	height:50%;
	position: absolute;
	bottom:0;
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(6,9,13,0.65) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(6,9,13,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(6,9,13,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a606090d',GradientType=0 ); /* IE6-9 */

}

.main .teaser .gallery .owl-carousel .container .box {
	height: auto;
	z-index: 1000000;
    position: absolute;
    left: var(--mediumMargin);
    margin-right: var(--mediumMargin);
    bottom: var(--mediumMargin);
    margin: auto;
	display:flex;
	align-items: center;

}

.main .teaser .gallery .owl-carousel .container .box .play {
	width: var(--playBig);
	height: var(--playBig);
	background: var(--colorAccent);
	border-radius: 50%;
	padding: var(--playBigMargin);
	box-sizing:border-box;
	float:left;
	margin-right: var(--mediumMargin);
}

.main .teaser .gallery .owl-carousel .container .box .play img {
	height: 100%;
	filter: var(--tintColorLight);
}

.main .teaser .gallery .owl-carousel .container  .box .content {
	overflow: hidden;
	line-height: var(--lineHeightSmall);
}

.main .teaser .gallery .owl-carousel .container  .box .content p {
	font-family: 'bold';
	color: var(--colorLight);
	font-size:var(--smallText);
	color: var(--colorLightSecondary);
}

.main .teaser .gallery .owl-carousel .container  .box .content h3 {
	font-family: 'bold';
	color: var(--colorLight);
}

.main .teaser .masonry {
	box-sizing:border-box;
	flex: 1;
	margin-left: var(--tinyMargin);
	width:calc(50% - var(--tinyMargin)); 
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
	grid-gap: var(--smallMargin);
}

.main .teaser .masonry .item {
	padding-top: 100%; 
	display:block;
	box-sizing: border-box;
	position: relative;
	border-radius: var(--regularRadius);
	overflow:hidden;
	position:relative;
	background-color: var(--colorPrimary);
}

.main .teaser .masonry .item:hover {
	opacity:0.8;
}

.main .teaser .masonry .item:active {
	transform: var(--itemScale);
}

.main .teaser .masonry .item .content { 
	position: absolute;
	top: 0;
	right:0;
	left: 0;
	bottom: 0;
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

.main .teaser .masonry .item .content h4 { 
	position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
	color: var(--colorLight);
	font-family:'bold';
	line-height: var(--lineHeightMedium);
}

.main .last {
	display:none;
}

.main .smallcontainer {
	width: var(--smallContainerWidth);
	margin:0 auto;
	text-align:center;
	box-sizing:border-box;
}

/* ---- SIGNUP ---- */ 

form.signup {
	text-align:center;
	width:70%;
	margin:0 auto;
	margin-top:var(--mediumMargin);
}

form.signup .container {
	width:100%;
	display:flex;
	border-radius: var(--fullRadius);
	background-color:var(--colorBlackTransparent);
	padding: var(--tinyBigMargin) var(--smallMargin) var(--tinyBigMargin) var(--smallMargin);
	box-sizing:border-box;
	margin:0 auto;
	margin-top:var(--tinyMargin);
}

form.signup .container input {
	flex:1;
	background-color:transparent;
	border:none;
	font-size: var(--headerText);
	font-family:'normal';
	color:var(--colorLight);
	margin-right:var(--tinyMargin);
}

form.signup .container img {
	width:var(--mobileIcon);
	padding:var(--miniMargin);
	box-sizing:border-box;
	filter: var(--tintColorLightSecondary);
	cursor:pointer;
}

form.signup .container img:first-of-type {
	margin-right:var(--tinyMargin);
}

form.signup input::placeholder {
	color: var(--colorLightSecondary);
}

.main .smallcontainer p.formerror {
	color:red;
	display:none;
	line-height: var(--lineHeightMedium);
	margin-top: var(--smallMargin);
}

.main .smallcontainer a.signin {
	display:block;
	margin-top: var(--mediumMargin); 
	font-size: var(--headerText);
	text-decoration:none!important;
}

.main .smallcontainer a.disclaimer {
	display:block;
	font-size: var(--smallText);
	color:var(--colorLightSecondary);
	line-height:var(--lineHeightSmall);
	margin-top:var(--smallMargin);
	text-decoration:none!important;
}

.main .smallcontainer p.googledisclaimer {
	font-size: var(--smallText);
	color:var(--colorLightSecondary);
	line-height:var(--lineHeightSmall);
	margin-top:var(--smallMargin);
}

.main .smallcontainer p.googledisclaimer a {
	color:var(--colorLightSecondary);
	text-decoration:underline;
}

.main .smallcontainer a.langlink {
    color: var(--colorSecondary);
	font-size: var(--smallText);
	margin-top:var(--smallMargin);
	display:block;
}


/* ---- END SIGNUP ---- */ 

/* ---- BROWSE ---- */ 

.main .searchmasonry {
	box-sizing:border-box;
	width:100%;
	display: flex;
	flex-wrap:wrap;
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	margin-top: var(--mediumMargin);
    margin-bottom: var(--bigMargin);
	justify-content: space-between;
}

.main .searchmasonry .empty {
	color: var(--colorSecondary);
	text-align:center;
	margin:0 auto;
}

.main .searchmasonry .item {
	line-height: var(--lineHeightMedium);
	border-radius: var(--regularRadius);
	padding-bottom: var(--tinyMargin); 
	flex: 0 0 19%;
	overflow:hidden;
	display:block;
	text-decoration:none!important;
	margin-bottom:var(--tinyMargin);
}

.main .searchmasonry .item:hover .img .play  {
	background: var(--colorAccentDark)!important;
}

.main .searchmasonry .item h4 {
	font-family: 'bold';
    color: var(--colorLight);
    margin-top: var(--tinyMargin);
    text-overflow: ellipsis; 
	line-height:var(--lineHeightSmall);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.main .searchmasonry .item h5 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-break: break-all;
    word-wrap: break-word;
	color: var(--colorLightSecondary);
	font-size:var(--smallText);
}

.main .searchmasonry .item .img {
	padding-top: 100%;
	border-radius: var(--regularRadius); 
	position:relative;
	background-color: var(--colorPrimary);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

.main .searchmasonry .item .img:active {
	transform: var(--itemScale);
}

.main .searchmasonry .item .img time {
	display:block;
	height: auto;
	z-index: 1000;
    position: absolute;
	font-size: var(--smallText);
    left: var(--tinyMargin);
    margin-right: var(--tinyMargin);
    top: var(--tinyMargin);
    margin: auto;
	background: var(--colorPrimaryDarkTransparent);
	padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}

.main .searchmasonry .item .img .episodes {
	display:block;
	height: auto;
	z-index: 1000;
    position: absolute;
	font-size: var(--smallText);
	left: 50%;
    transform: translate(-50%,0);
    margin-right: var(--tinyMargin);
    bottom: var(--tinyMargin);
    margin: auto;
	background: var(--colorPrimaryDarkTransparent);
	padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}

.main .searchmasonry .item .img .new {
	display:block;
	height: auto;
	z-index: 1000000;
    position: absolute;
	font-size: var(--smallText);
    right: var(--tinyMargin);
    margin-left: var(--tinyMargin);
    top: var(--tinyMargin);
    margin: auto;
	background: var(--colorSecondary);
	padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}


.main .searchmasonry .item .img .play {
	width: var(--playMedium);
	height: var(--playMedium);
	background: var(--colorAccent);
	border-radius: 50%;
	padding: var(--playMediumMargin);
	box-sizing:border-box;
	position:absolute;
	margin: auto;
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
}

.main .searchmasonry .item .img .play img {
	height: 100%;
	filter: var(--tintColorLight);
	display: block;
}

.main .searchloading {
	box-sizing:border-box;
	width:100%;
	display: none;
	flex-wrap:wrap;
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	margin-top: var(--mediumMargin);
    margin-bottom: var(--bigMargin);
	justify-content: space-between;
}

.main .searchloading .placeholder {
	border-radius: var(--regularRadius);
	padding-bottom: var(--tinyMargin);
	flex: 0 0 19%;
	overflow:hidden;
	margin-bottom: var(--placeholderMargin);
}

.main .searchloading .placeholder .img {
	padding-top: 100%;
	border-radius: var(--regularRadius);
	position:relative;
	background-color: var(--colorPrimary);
}

/* ---- END BROWSE ---- */ 

/* ---- SLEEP ---- */ 

.main .random {
	background-color:var(--colorPrimaryDark);
	border-radius: var(--regularRadius);
	padding:var(--mediumMargin);
	margin:var(--defaultMargin);
	box-sizing:border-box;
	display:flex;
	align-items:center;
	text-decoration:none;
}

.main .random:hover {
	background-color:var(--colorPrimaryDarker);
}

.main .random span {
	display:block;
}

.main .random h2 {
	font-size: var(--smallHeaderText); 
    color: var(--colorLight);
    font-family: 'bold';
}

.main .random .text {
	flex:1;
	margin-right:var(--mediumMargin);
	line-height:var(--lineHeightMedium);
}

.main .random .play {
	width: var(--playBig);
	height: var(--playBig);
	background: var(--colorAccent);
	border-radius: 50%;
	padding: var(--playBigMargin);
	box-sizing:border-box;
}

.main .random .play img {
	height: 100%;
	filter: var(--tintColorLight);
	display:block;
}

/* ---- END SLEEP ---- */ 

/* ---- PROFILE ---- */ 

.main header .profilehead {
	display:flex;
	align-items:center;
	padding: var(--defaultMargin) var(--defaultMargin) var(--smallMargin) var(--defaultMargin);
}

.main header .profilehead a.img {
	line-height:0;
	width:var(--userThumbHuge);
	height: var(--userThumbHuge);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat:no-repeat;
	border-radius:50%;
	margin-right:var(--smallMargin);
	text-indent: -9999px; 
	white-space: nowrap; 
}

.main header .profilehead a.img:hover {
	background-color: var(--semiDarkLayer);
	background-blend-mode: multiply;
}

.main header .profilehead .profileright {
	display:flex;
	align-items:center;
}

.main header .profilehead .profileright .button {
	margin-right:var(--smallMargin);
}

.main header .profilehead .profileright .options  {
	display:block;
	text-decoration:none;
	line-height: 0;
    padding: var(--tinyMargin);
    border-radius: 50%;
	text-align:center;
}

.main header .profilehead .profileright .options:hover {
    background-color:var(--colorPrimaryDark);
}


.main header .profilehead .profileright .options img  {
	height: var(--smallIcon);
	filter: var(--tintColorLight);
}

.main header .profilehead .text { 
	margin-right:var(--smallMargin);
	flex: 1;
	display:block;
	text-decoration:none;
}

.main header .profilehead .text:hover p { 
	color:var(--colorLight);
}


.main header .profilehead .text p { 
	color:var(--colorLightSecondary);
}

.main header .profilehead .text h1 {
    line-height:var(--lineHeightMedium); 
	white-space: nowrap;
	text-overflow: ellipsis;
	word-break: break-all;
	word-wrap: break-word;
	display:block;
}

.main header .profilehead .settings {
	line-height:0;
	padding:var(--tinyMargin);
	border-radius:50%;
}

.main header .profilehead .settings img {
    width: var(--mobileIcon);
    height: var(--mobileIcon);
    filter: var(--tintColorLight);
}

.main header .profilehead .settings:hover {
    background-color:var(--colorPrimaryDarker);
}

.main header nav.profilenav {

}

.main header nav.profilenav ul {
	display:table;
	width:100%;
	table-layout: fixed;
}

.main header nav.profilenav ul li {
	display:table-cell;
	text-align:center;
	color:var(--colorSecondary);
	border-bottom:var(--borderThickness) solid transparent;
	padding:var(--smallMargin);
	cursor:pointer;
}

.main header nav.profilenav ul li:hover, .main header nav.profilenav ul li.active {
	border-bottom:var(--borderThickness) solid var(--colorAccent);
	color:var(--colorLight);
}

.main .profiletext {
	margin: 0 var(--defaultMargin) 0 var(--defaultMargin);
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: initial;
	line-height: var(--lineHeightMedium);
	-webkit-box-orient: vertical;
}

.main .profiletext.full {
	-webkit-line-clamp: initial!important;
}

.main .profilemore {
	margin: var(--tinyMargin) var(--defaultMargin) 0 var(--defaultMargin);
	display:none;
	font-size:var(--smallText);
	cursor:pointer;
}


.main .news {
	padding: var(--smallMargin) var(--defaultMargin) var(--smallMargin) var(--defaultMargin);
}

.main .tabcontainer .tabcontent .empty {
    color: var(--colorSecondary);
    text-align: center;
    margin: 0 auto;
	margin-top:var(--defaultMargin);
}

.main .news .item {
	margin-top: var(--smallMargin);
	border-radius: var(--regularRadius);
	padding: var(--tinyMargin);
}

.main .news .item a {
	text-decoration:none!important;
	display:flex;
	align-items:center;
}

.main .news .item:hover {
	background-color: var(--colorPrimary);
}

.main .news .item .img {
	width:var(--userThumbBig);
	height: var(--userThumbBig);
	margin-right: var(--smallMargin);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat:no-repeat;
	border-radius:50%;
}

.main .news .item p {
	color: var(--colorLight);
	line-height:var(--lineHeightSmall);
	overflow:hidden;
	flex:1;
}

.main .news .item p span {
	color: var(--colorSecondary);
	
}

.main .news .item p time {
	font-size: var(--smallText);
	color: var(--colorLightSecondary);
	display:block;
	margin-top:var(--miniMargin);
}

.main .tabcontainer .tabcontent {
	display: none;
}

.main .tabcontainer .tabcontent.active {
	display: inherit;
}

.main .tabcontainer .tabcontent .following {
	margin-top:var(--defaultMargin);
}

.main .tabcontainer .tabcontent .following.nomargin {
	margin-top:0!important;
}

.main .tabcontainer .tabcontent .mine {
	display:flex;
	align-items:center;
	margin:var(--defaultMargin);
}

.main .tabcontainer .tabcontent .mine .mainimg {
	position:relative;
	width:var(--itemWidthSmall);
	height:var(--itemWidthSmall);
	border-radius:var(--regularRadius);
	overflow:hidden;
	display:block;
	margin-right:var(--smallMargin);
	border-radius: var(--regularRadius);
	position:relative;
	background-color: var(--colorPrimary);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

.main .tabcontainer .tabcontent .mine .mainimg time {
	display: block;
    height: auto;
    z-index: 1000;
    position: absolute;
    font-size: var(--smallText);
    left: var(--tinyMargin);
    margin-right: var(--tinyMargin);
    top: var(--tinyMargin);
    margin: auto;
    background: var(--colorPrimaryDarkTransparent);
    padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
    border-radius: var(--bigRadius);
    color: var(--colorLight);
    line-height: var(--lineHeightSmall);
	margin-right:var(--defaultMargin);
}

.main .tabcontainer .tabcontent .mine .content {
	flex:1;
}

.main .tabcontainer .tabcontent .mine .content h2 {
	font-family: 'bold';
    color: var(--colorLight);
	line-height:var(--lineHeightMedium);
	margin-bottom:var(--tinyMargin);
}

.main .tabcontainer .tabcontent .mine .content .icons {
	display:flex;
	vertical-align:center;
	line-height:0;
	margin-bottom: var(--tinyMargin);
}

.main .tabcontainer .tabcontent .mine .content .icons .icon {
	display:flex;
	align-items:center;
	margin-right:var(--smallMargin);
}

.main .tabcontainer .tabcontent .mine .content .icons .icon img {
	width: var(--sideIcon);
    height: var(--sideIcon);
    filter: var(--tintColorLight);
	margin-right:var(--tinyMargin);
}

.main .tabcontainer .tabcontent .mine .content .icons .icon span {
	display:block;
}

.main .tabcontainer .tabcontent .mine .options  {
	display:block;
	text-decoration:none;
	line-height: 0;
    padding: var(--tinyMargin);
    border-radius: 50%;
	text-align:center;
}

.main .tabcontainer .tabcontent .mine .options:hover {
    background-color:var(--colorPrimary);
}


.main .tabcontainer .tabcontent .mine .options img  {
	height: var(--sideIcon);
	filter: var(--tintColorLight);
}


/* ---- END PROFILE ---- */ 

/* ---- USERS ---- */

.main .usermasonry {
	box-sizing:border-box;
	width:100%;
	display: flex;
	flex-wrap:wrap;
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	margin-top: var(--mediumMargin);
    margin-bottom: var(--bigMargin);
	justify-content: space-between;
}

.main .usermasonry .empty {
	color: var(--colorSecondary);
	text-align:center;
	margin:0 auto;
}

.main .usermasonry .item {
	line-height: var(--lineHeightMedium);
	border-radius: var(--regularRadius);
	padding-bottom: var(--tinyMargin);
	flex: 0 0 19%;
	overflow:hidden;
	margin-bottom:var(--tinyMargin);
	text-align:center;
	text-decoration:none;
}

.main .usermasonry .item:hover  {
	background-color: var(--colorPrimary);
}

.main .usermasonry .item .img {
	padding-top: 100%;
	background-size:cover;
	background-position: 50% 50%;
	background-repeat:no-repeat;
	border-radius:50%;
	margin:0 auto;
	margin-bottom:var(--tinyMargin);
}

.main .usermasonry .item strong {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	word-break: break-all;
	word-wrap: break-word;
	display:block;
}

/* ---- END USERS ---- */

/* ---- TERMS ---- */

.main .terms {
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
}

/* ---- END TERMS ---- */

/* ---- SETTINGS ---- */

form.settingsform label {
	display:block;
    margin: var(--tinyMargin) var(--defaultMargin) var(--tinyMargin) var(--defaultMargin);
}

form.settingsform .piccontainer {
    display: flex;
    margin:var(--mediumMargin) var(--defaultMargin) 0 var(--defaultMargin);
	align-items:center;
}

form.settingsform .piccontainer a.img {
    width:var(--userThumbHuge);
	height:var(--userThumbHuge);
	background-size:cover;
	display:block;
	text-indent: -9999px; 
	white-space: nowrap; 
	background-position: 50% 50%;
	background-repeat:no-repeat;
	border-radius:50%;
	margin-right: var(--defaultMargin);
	background-color:var(--colorPrimaryDarker);
}

form.settingsform .submitcontainer {
    text-align:center;
}

form.settingsform .piccontainer input {
    flex:1;
}

form.settingsform .container, form.settingsform textarea {
    display: flex;
    border-radius: var(--regularRadius);
    background-color: var(--colorBlackTransparent);
    padding: var(--tinyMargin);
    box-sizing: border-box;
    margin:0 var(--defaultMargin) 0 var(--defaultMargin);
	align-items:center;
}

form.settingsform textarea {
    display: block;
    height:var(--textAreaHeight);
	width:calc(100% - var(--hugeMargin));
	border:none;
	resize: vertical;
	font-size: var(--headerText);
    font-family: 'normal';
    color: var(--colorLight);
}

form.settingsform .container input {
    flex: 1;
    background-color: transparent;
    border: none;
    font-size: var(--headerText);
    font-family: 'normal';
    color: var(--colorLight);
    margin-right: var(--tinyMargin);
}

form.settingsform .container .sideimg {
    padding: var(--tinyMargin);
    box-sizing: border-box;
    cursor: pointer;
	line-height:0;
	background-color:var(--colorPrimaryDark);
	border-radius:50%;
}

form.settingsform .container .sideimg:hover {
	background-color:var(--colorPrimaryDarker);
}

form.settingsform .container .sideimg img {
    width: var(--tinyIcon);
    filter: var(--tintColorLight);
}

/* ---- END SETTINGS ---- */

/* ---- STORY ---- */

.main .story {
	position:relative;
	min-height:100vh;
}

.main .story .player {
	position:fixed;
	bottom:0;
	left:var(--sidebarWidth);
	right:var(--sidebarWidth);
	background-color:var(--colorPrimaryDark);
	display:table;
	align-items:center;
	width:calc(100% - var(--sidebarWidthDouble));
	z-index:10000;
}

.main .story .player .img {
	line-height: 0;
	display:table-cell;
	width: var(--itemWidthTiny);
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    text-indent: -9999px;
    white-space: nowrap;
}

.main .story .player .content {
	display: flex;
    flex-direction: column;
}

.main .story .player .content .bar {
	flex:1;
	background-color:var(--colorAccentTransparent);
	cursor:pointer;
	width:100%;
	height:var(--playerIndicatorHeight);
}

.main .story .player .content .bar ::-moz-progress-bar { 
	color:var(--colorAccent);
	background:var(--colorAccentTransparent);
	height:var(--playerIndicatorHeight);
}

.main .story .player .content .bar[value]::-webkit-progress-bar {
	background-color: transparent
}

.main .story .player .content .bar[value]::-webkit-progress-value {
	background-color: var(--colorAccent);
	height:var(--playerIndicatorHeight);
	transition: width 0.2s;
}

.main .story .player .content .bar .fill {
	background-color:var(--colorAccent);
	width:30%;
	height:var(--playerIndicatorHeight);
}

.main .story .player .content .bottomcontent {
	display:table;
	table-layout: fixed;
	padding:var(--tinyMargin) 0 var(--tinyMargin) 0;
	width:100%;
}

.main .story .player .content .bottomcontent .controls a {
	line-height:0;
	display:inline-block;
	padding:var(--tinyMargin);
	border-radius:50%;
}

.main .story .player .content .bottomcontent .right div.volume .muter {
	line-height:0;
	display:inline-block;
	padding:var(--tinyMargin);
	border-radius:50%;
}

.main .story .player .content .bottomcontent .right div.volumecontainer {
	line-height:0;
	padding:0 var(--smallMargin) 0 var(--smallMargin);
	cursor:pointer;
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume {
	position:relative;
	cursor:pointer;
}

.main .story .player .content .bottomcontent .right .volumecontainer:hover .volume .volumecontent {
	opacity: 1; 
	visibility:visible;
}
.main .story .player .content .bottomcontent .right .volumecontainer:hover .volume .muter {
	background-color:var(--colorPrimaryDarker);
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume .volumecontent {
	position: absolute;
	background-color: transparent;
	width:10rem;
	height:16rem;
	left: 50%;
	bottom:var(--volumeMargin);
	transform: translateX(-50%);
	transition: opacity 500ms; 
	box-sizing:border-box;
	padding:var(--tinyMargin) 0 var(--tinyMargin) 0;
	border-radius:var(--regularRadius);
	cursor:default;
	visibility:hidden;
	opacity:0;
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume .volumecontent .volumebar {
    border: 0.8rem solid var(--colorPrimaryDark);
	border-radius:var(--regularRadius)!important;
	transition:none!important;
	background:var(--colorAccentTransparent);
	width:0.3rem;
	position:absolute;
	height:10rem;
	bottom:0;
	left:50%;
	z-index:10;
	transform: translateX(-50%);
	cursor:pointer!important;
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume .volumecontent .bg {
    border: 0.8rem solid var(--colorPrimaryDark);
	border-radius:var(--regularRadius)!important;
	transition:none!important;
	background:var(--colorPrimaryDark);
	width:0.3rem;
	position:absolute;
	height:10rem;
	bottom:0;
	left:50%;
	z-index:1;
	transform: translateX(-50%);
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume .volumecontent .volumebar .ui-widget-header {
    border: none!important;
    background: var(--colorAccent);
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume .volumecontent .volumebar .ui-state-default {
	background: var(--colorAccent)!important;
	border:none!important;
	outline:none!important;
	border-radius:50%!important;
	width:1rem;
	height:1rem;
	left: -0.33rem!important;
	cursor:pointer;
}

.main .story .player .content .bottomcontent .right .volumecontainer div.volume .volumecontent .volumebar .ui-state-default:active, .main .story .player .content .bottomcontent .right div.volume .volumecontent .volumebar .ui-state-default:hover {
	transform: var(--buttonScale);
}

.main .story .player .content .bottomcontent .controls a img, .main .story .player .content .bottomcontent .right div.volume img {
    height: var(--tinyIcon);
    filter: var(--tintColorLight);
}

.main .story .player .content .bottomcontent .controls a:hover {
    background-color:var(--colorPrimaryDarker);
}

.main .story .player .content .bottomcontent .controls a.play {
	line-height:0;
	display:inline-block;
	padding:var(--tinyBigMargin);
	border-radius:50%;
	background-color:var(--colorAccent);
}

.main .story .player .content .bottomcontent .controls a.play img {
    height: var(--tinyIcon);
    filter: var(--tintColorLight);
}

.main .story .player .content .bottomcontent .controls a.play:hover {
    background-color:var(--colorAccentDark);
}
.main .story .player .content a:active, .main .story .player .content div.volume img:active, .main .story .top a.img .play:active {
	transform: var(--buttonScale);
}
.main .story .player .content .bottomcontent .title, .main .story .player .content .bottomcontent .controls, .main .story .player .content .bottomcontent .right {
	display:table-cell;
	vertical-align:middle;
}

.main .story .player .content .bottomcontent .title {
	line-height:var(--lineHeightSmall);
	padding-left:var(--smallMargin);
}

.main .story .player .content .bottomcontent .title strong {
	display:block;
	color:var(--colorLight);
	font-size:var(--smallText);
}

.main .story .player .content .bottomcontent .title span {
	display:block;
	font-size:var(--smallText);
}

.main .story .player .content .bottomcontent .controls {
	text-align:center;
}

.main .story .player .content .bottomcontent .right {
	text-align:right;
	font-size:var(--smallText);
}

.main .story .player .content .bottomcontent .right .container {
	display:flex;
	align-items:center;
	justify-content:flex-end;
	padding-right:0;
}

.main .story .player .content .bottomcontent .right .container .time {
}

.main .story .top {
	padding:var(--defaultMargin);
	background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
	background-color: var(--darkLayer); 
	background-blend-mode: multiply;
	position:relative;
	display:flex;
	align-items:center;
	-webkit-box-shadow: 0 4px 14px -6px rgba(0,0,0,0.37);
	-moz-box-shadow: 0 4px 14px -6px rgba(0,0,0,0.37);
	box-shadow: 0 4px 14px -6px rgba(0,0,0,0.37);
}

.main .story .top a.img {
    line-height: 0;
	display:block;
    width: var(--itemWidthBig);
    height: var(--itemWidthBig); 
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-radius: var(--regularRadius);
    margin-right: var(--defaultMargin);
	position:relative;
}

.main .story .top a.img .play {
    width: var(--playBig);
    height: var(--playBig);
    background: var(--colorAccent);
    border-radius: 50%;
    padding: var(--playMediumMargin);
    box-sizing: border-box;
    position: absolute;
    margin: auto;
	display:block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.main .story .top a.img .play img {
    height: 100%;
    filter: var(--tintColorLight);
    display: block;
}

.main .story .top a.img:hover .play {
    background: var(--colorAccentDark)!important;
}

.main .story .top .content {
    flex:1;
}

.main .story .top .content .title {
    display:flex;
}

.main .story .top .content .title .icons  {
    display:flex;
	line-height:0;
}

.main .story .top .content .title .back  {
    display:none;
	line-height:0;
	flex:1;
}

.main .story .top .content .title .icons a, .main .story .top .content .title .back a {
	line-height:0;
	display:inline-block;
	padding:var(--tinyMargin);
	border-radius:50%;
}

.main .story .top .content .title .icons a:active, .main .story .top .content .title .back a:active {
	transform: var(--buttonScale);
}

.main .story .top .content .title .icons a img, .main .story .top .content .title .back a img {
    height: var(--smallIcon);
    filter: var(--tintColorLight);
}

.main .story .top .content .title .icons a.like.active img {
    filter: var(--tintColorAccent);
}

.main .story .top .content .title .icons a:hover, .main .story .top .content .title .back a:hover {
    background-color:var(--colorPrimaryDarker);
}

.main .story .top .content .title .icons a:not(.options) {
	 margin-right:var(--smallMargin);
}

.main .story .top .content .title h1 {
    font-size: var(--bigHeaderText);
    color: var(--colorLight);
    line-height: var(--lineHeightBig);
    font-family: 'bold';
	flex:1;
	margin-right: var(--defaultMargin);
	margin-bottom: var(--tinyMargin);
}

.main .story .top .content p.about {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: initial;
    -webkit-box-orient: vertical;
	line-height: var(--lineHeightMedium);
}

.main .story .top .content p.about.full {
	-webkit-line-clamp: initial!important;
}

.main .story .top .content a.showmore {
	display:none;
	font-size:var(--smallText);
	margin-top:var(--tinyMargin);
}

.main .story .top .content .user {
	margin-top:var(--smallMargin);
	display:flex;
	align-items:center;
}

.main .story .top .content .user:active span.img {
	transform: var(--itemScale);
}

.main .story .top .content .user .button {
	margin-left:var(--smallMargin);
}

.main .story .top .content .user a.userlink {
    display:flex;
	text-align:center;
	align-items:center;
	line-height:0;
	text-decoration:none;
	border-radius:var(--regularRadius);
	color:var(--colorLightSecondary);
}

.main .story .top .content .user a.userlink:hover span.img {
    background-color: var(--semiDarkLayer);
    background-blend-mode: multiply;
}

.main .story .top .content .user a.userlink span.img {
    line-height: 0;
    width: var(--userThumb);
    height: var(--userThumb);
	display:block;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-radius: 50%;
    text-indent: -9999px;
    white-space: nowrap;
	margin-right:var(--tinyMargin);
}


.main .story .top .content .user a.userlink span.txt {
	display:block;
}

.main .story .top .content .tags {
    margin-top: var(--smallMargin);
}

.main .story .top .content .mobiletitle {
	margin-top: var(--smallMargin);
	text-align:center;
	line-height:var(--lineHeightMedium);
	display:none;
}

.main .story .top .content .mobiletitle h1 {
	font-family:'bold';
	color:var(--colorLight);
	font-size: var(--headerTextMedium);
}

.main .story .top .content .mobiletime {
	margin-top: var(--smallMargin);
	text-align:center;
	line-height:var(--lineHeightMedium);
	align-items:center;
	font-size:var(--semiText);
	justify-content: center;
	display:none;
}

.main .story .top .content .mobiletime span {
	margin:0 var(--defaultMargin) 0 var(--defaultMargin);
}

.main .story .top .content .mobiletime a {
	line-height:0;
	display:inline-block;
	padding:var(--tinyMargin);
	border-radius:50%;
}

.main .story .top .content .mobiletime a img {
    height: var(--tinyIcon);
    filter: var(--tintColorLight);
}

.main .story .top .content .mobiletime a:hover {
    background-color:var(--colorPrimaryDarker);
}

.main .story .top .content .mobiletime a:active {
    transform: var(--buttonScale);
}

.main .story .top .content .mobileplayer {
	margin-top: var(--smallMargin);
	text-align:center;
	line-height:var(--lineHeightMedium);
	align-items:center;
	justify-content: center;
	display:none;
}

.main .story .top .content .mobileplayer a {
	line-height:0;
	display:inline-block;
	padding:var(--tinyMargin);
	border-radius:50%;
}

.main .story .top .content .mobileplayer a:active {
    transform: var(--buttonScale);
}


.main .story .top .content .mobileplayer a img {
    height: var(--smallIcon);
    filter: var(--tintColorLight);
}

.main .story .top .content .mobileplayer a:hover {
    background-color:var(--colorPrimaryDarker);
}

.main .story .top .content .mobileplayer .playcontainer {
	margin:0 var(--defaultMargin) 0 var(--defaultMargin);
	width:var(--mobilePlayerSize);
	height:var(--mobilePlayerSize);
	position:relative;
}

.main .story .top .content .mobileplayer .playcontainer .play {
    width: var(--mobilePlayerPlaySize);
    height: var(--mobilePlayerPlaySize);
    background: var(--colorAccent);
    border-radius: 50%;
    padding: var(--mediumMargin);
    box-sizing: border-box;
    position: absolute;
    margin: auto;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	z-index:2;
	cursor:pointer;
	-webkit-box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.13);
	-moz-box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.13);
	box-shadow: 0px 0px 5px 5px rgba(0,0,0,0.13);
	outline:none;
}


.main .story .top .content .mobileplayer .playcontainer .play:hover {
    background: var(--colorAccentDark);
}

.main .story .top .content .mobileplayer .playcontainer .play:active {
    transform: var(--buttonScale);
	background: var(--colorAccent)!important;
}

.main .story .top .content .mobileplayer .playcontainer .play img {
    height: 100%;
    filter: var(--tintColorLight);
    display: block;
}

.main .story .top .content .mobileplayer .playcontainer .progress {
    --size: var(--mobilePlayerSizeSingle);
    --width: 1.5;
    width: calc(var(--size) * 1rem);
    height: calc(var(--size) * 1rem);
    border-radius: 100%;
    overflow: hidden;
    padding: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    background: transparent;
	z-index:1;
	cursor:pointer;
	outline:none;
}
.main .story .top .content .mobileplayer .playcontainer .progress:before {
    content: "";
    background: var(--colorAccent);
    position:absolute;
    z-index:100;
    /* parenthesis are required */
    width: calc((var(--size) - (var(--width) * 2)) * 1rem);
    height: calc((var(--size) - (var(--width) * 2)) * 1rem);
    border-radius:50%;
    margin:auto auto;
}
.main .story .top .content .mobileplayer .playcontainer .progress::-moz-progress-value { background: transparent; }
.main .story .top .content .mobileplayer .playcontainer .progress::-webkit-progress-value { background: transparent; }

.main .story .top .content .currenttime {
	margin-top: var(--tinyMargin);
	text-align:center;
	color:var(--colorLight);
	display:none;
}

.main .story .top .content .mobilevolume {
	display:none;
	align-items:center;
	margin:var(--tinyMargin) var(--defaultMargin) 0 var(--defaultMargin);
}

.main .story .top .content .mobilevolume .muter {
	line-height:0;
	display:inline-block;
	padding:var(--tinyMargin);
	border-radius:50%;
	cursor:pointer;
	margin-right:var(--tinyMargin);
}

.main .story .top .content .mobilevolume .muter img {
    height: var(--smallIcon);
    filter: var(--tintColorLight);
}

.main .story .top .content .mobilevolume .muter:hover {
    background-color:var(--colorPrimaryDarker);
}

.main .story .top .content .mobilevolume .muter:active {
	transform: var(--buttonScale);
}

.main .story .top .content .mobilevolume .volumebar {
    border: none;
	border-radius:var(--regularRadius)!important;
	transition:none!important;
	background:var(--colorAccentTransparent);
	flex:1;
	height:0.3rem;
	cursor:pointer!important;
}

.main .story .top .content .mobilevolume .volumebar .ui-widget-header {
    border: none!important;
    background: var(--colorAccent);
}

.main .story .top .content .mobilevolume .volumebar .ui-state-default {
	background: var(--colorAccent)!important;
	border:none!important;
	outline:none!important;
	border-radius:50%!important;
	width:1rem;
	height:1rem;
	cursor:pointer;
}

.main .story .top .content .mobilevolume .volumebar .ui-state-default:active, .main .story .top .content .mobilevolume .volumebar .ui-state-default:hover {
	transform: var(--buttonScale);
}

.main .story .top .content .mobiledetails {
	display:none;
	align-items:center;
	flex-direction: column;
	font-size:var(--smallText);
	position:absolute;
	bottom:var(--smallMargin);
	left: 50%;
    transform: translate(-50%,0);
	border-radius:var(--regularRadius);
	padding:var(--miniMargin);
	line-height:1;
	cursor:pointer;
}

.main .story .top .content .mobiledetails:hover {
	background-color:var(--colorPrimaryDark);
}

.main .story .top .content .mobiledetails img {
	width:var(--smallIcon);
	filter: var(--tintColorLightSecondary);
	margin-top:var(--miniMargin);
}

.main .story .top .content .tags span {
    padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
    border: var(--borderThickness) solid var(--colorSecondary);
    color: var(--colorLight);
    text-decoration: none;
    font-size: var(--smallText);
    margin: var(--miniMargin);
    display: inline-block;
    line-height: var(--lineHeightSmall);
    border-radius: var(--regularRadius);
    white-space: nowrap;
}


.main .story .bottom {
	margin-top:var(--defaultMargin);
	margin-bottom:var(--defaultMargin);
}

.main .story .bottom .tags {
    display:none;
	margin:0 var(--smallMargin) var(--defaultMargin) var(--smallMargin);
}


.main .story .bottom .tags span {
    padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
    border: var(--borderThickness) solid var(--colorSecondary);
    color: var(--colorLight);
    text-decoration: none;
    font-size: var(--smallText);
    margin: var(--miniMargin);
    display: inline-block;
    line-height: var(--lineHeightSmall);
    border-radius: var(--regularRadius);
    white-space: nowrap;
}


.main .story .bottom .comments .commentbox  {
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	margin-top:var(--smallMargin);
	display:flex;
}

.main .story .bottom .comments .commentbox.reply  {
	padding: 0!important;
	margin-bottom:var(--smallMargin);
	display:none;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .edit, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit  {
	padding: 0!important;
	margin-bottom:var(--smallMargin);
	display:none;
	width:100%;
}

.main .story .bottom .comments .commentbox form, .main .story .bottom .comments .commentlist .itemcontainer .item .edit form, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form {
	flex:1;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
}

.main .story .bottom .comments .commentbox form textarea, .main .story .bottom .comments .commentlist .itemcontainer .item .edit form textarea, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form textarea {
	width:100%;
	box-sizing:border-box;
	background-color:transparent;
	padding:var(--tinyBigMargin) 0 var(--tinyBigMargin) 0;
	border:none;
	color:var(--colorLight);
	font-family: 'normal';
	border-bottom: var(--splitterHeight) solid var(--colorPrimary);
}

.main .story .bottom .comments .commentbox form textarea::placeholder, .main .story .bottom .comments .commentlist .itemcontainer .item .edit form textarea::placeholder, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form textarea::placeholder {
	color: var(--colorLightSecondary);
}

.main .story .bottom .comments .commentbox form .buttons, .main .story .bottom .comments .commentlist .itemcontainer .item .edit form .buttons, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form .buttons {
	display:none;
	align-items:flex-end;
	width:100%;
	justify-content: flex-end;
	margin-top:var(--smallMargin);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .edit form .buttons, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form .buttons {
	display:flex!important;
}

.main .story .bottom .comments .commentbox form .buttons input[type="submit"], .main .story .bottom .comments .commentlist .itemcontainer .item .edit form .buttons input[type="submit"], .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form .buttons input[type="submit"] {
	margin-top:0;
	padding: var(--tinyMargin);
}

.main .story .bottom .comments .commentbox form .buttons input[type="submit"]:disabled, .main .story .bottom .comments .commentlist .itemcontainer .item .edit form .buttons input[type="submit"]:disabled, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form .buttons input[type="submit"]:disabled {
	cursor:default;
	opacity:0.5;
	background-color:var(--colorAccent)!important;
}

.main .story .bottom .comments .commentbox form .buttons input[type="reset"], .main .story .bottom .comments .commentlist .itemcontainer .item .edit form .buttons input[type="reset"], .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form .buttons input[type="reset"] {
	margin-top:0;
	padding: var(--tinyMargin);
	border:none;
	background-color: transparent;
	margin-right:var(--tinyMargin);
	cursor:pointer;
}

.main .story .bottom .comments .commentbox form .buttons input[type="reset"]:hover, .main .story .bottom .comments .commentlist .itemcontainer .item .edit form .buttons input[type="reset"]:hover, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .edit form .buttons input[type="reset"]:hover {
	background-color: var(--colorPrimary);
}

.main .story .bottom .comments .commentbox .img {
	width: var(--userThumbBig);
    height: var(--userThumbBig);
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-radius: 50%;
	margin-right:var(--smallMargin);
    background-color: var(--colorPrimaryDark);
}

.main .story .bottom .comments .commentbox.reply .img {
	width: var(--userThumb)!important;
    height: var(--userThumb)!important;
	min-width:auto!important;
	margin-top:var(--tinyMargin);
}

.main .story .bottom .comments .commentlist {
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
	margin-top:var(--defaultMargin);
}

.main .story .bottom .comments .commentlist .itemcontainer {
	margin-bottom:var(--defaultMargin);
	width:100%;
}

.main .story .bottom .comments .commentlist .itemcontainer .item, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply  {
	display:flex;
	width:100%;
}

.main .story .bottom .comments .commentlist .itemcontainer .replies .reply  {
	margin-left:var(--replyMargin);
	margin-top:var(--smallMargin);
	width:auto;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .img, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .img {
	width: var(--userThumbBig);
	min-width: var(--userThumbBig);
    height: var(--userThumbBig);
    background-size: cover;
	display:block;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    border-radius: 50%;
	margin-right:var(--smallMargin);
    background-color: var(--colorPrimaryDark);
	transition:no;
}

.main .story .bottom .comments .commentlist .itemcontainer .replies .reply .img {
	width: var(--userThumb);
    height: var(--userThumb);
	min-width: var(--userThumb);
}


.main .story .bottom .comments .commentlist .itemcontainer .item .img:hover, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .img:hover {
	background-color: var(--semiDarkLayer);
	background-blend-mode: multiply;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right {
	flex:1;
	font-size: var(--mediumText);
	line-height: var(--lineHeightMedium);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right a.showmorecomment, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right a.showmorecomment {
	font-size: var(--smallText);
	display:none;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commenttop a, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commenttop a {
	color:var(--colorLight);
	margin-right:var(--tinyMargin);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commenttop a.owner, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commenttop a.owner {
	color:var(--colorAccent);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commenttop time, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commenttop time {
	margin-left:var(--tinyMargin);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commenttop  i.edited, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commenttop i.edited  {
	
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right p.edit, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right p.edit {
	font-family: 'italic';
	color:var(--colorLight);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right p.txt, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right p.txt {
	margin-top:var(--tinyMargin);
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: initial;
    -webkit-box-orient: vertical;
    line-height: var(--lineHeightMedium);
	white-space: pre-line;
	word-break: break-all;
    word-wrap: break-word;

}

.main .story .bottom .comments .commentlist .itemcontainer .item .right p.txt.full, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right p.txt.full {
	-webkit-line-clamp: initial!important;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom {
    display: flex;
    vertical-align: center;
    line-height: 0;
    margin-top:var(--tinyMargin);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon {
    display: flex;
    align-items: center;
	padding: var(--tinyMargin);
	border-radius:var(--regularRadius);
	text-decoration:none!important;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon:hover, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon:hover {
    background-color:var(--colorPrimary);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon.options, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon.options {
	display: block;
    text-decoration: none;
    line-height: 0;
    padding: var(--tinyMargin);
    border-radius: 50%;
    text-align: center;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon.options:hover, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon.options:hover {
    background-color:var(--colorPrimary);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon:active img, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon:active img {
    transform: var(--buttonScale);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon.options img, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon.options img {
    height: var(--sideIcon);
    filter: var(--tintColorLight);
	margin-right: 0!important;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon img, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon img {
    width: var(--sideIcon);
    height: var(--sideIcon);
    filter: var(--tintColorLight);
    margin-right: var(--tinyMargin);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon.active img, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon.active img {
    filter: var(--tintColorAccent);
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .icon span, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .icon span {
    display: block;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right .commentbottom .puffer, .main .story .bottom .comments .commentlist .itemcontainer .replies .reply .right .commentbottom .puffer {
    flex:1;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right a.answers {
    margin-top:var(--tinyMargin);
	color:var(--colorAccent);
	display:inline-flex;
	align-items:center;
	font-family: 'bold';
	padding: 0 var(--tinyMargin) 0 var(--tinyMargin);
    border-radius: var(--regularRadius);
	width:auto;
	text-decoration:none!important;
}

.main .story .bottom .comments .commentlist .itemcontainer .item .right a.answers img {
    width: var(--miniIcon);
    filter: var(--tintColorAccent);
	margin-right:var(--tinyMargin);
}


/* ---- END STORY ---- */

/* #### END MAIN #### */ 

/* #### SIDEBAR RIGHT #### */ 

aside.right {
	background: var(--colorPrimaryDark);
	width:var(--sidebarWidthRight);
	padding:var(--smallMargin);
	box-sizing:border-box;
	overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
	position:fixed;
    top: 0;
    bottom: 0;
	right:0;
	z-index:10;
	-webkit-box-shadow: -4px 0px 14px -6px rgba(0,0,0,0.37);
	-moz-box-shadow: -4px 0px 14px -6px rgba(0,0,0,0.37);
	box-shadow: -4px 0px 14px -6px rgba(0,0,0,0.37);
}

aside.right .language form {
	width:100%;
}

aside.right .language form select {
	width:100%;
	font-family: 'normal';
	background-color: var(--colorPrimaryDarker);
	color: var(--colorLight);
	border:1px solid var(--colorPrimaryDarkest);
	padding: var(--tinyMargin);
	box-sizing:border-box;
	border-radius: var(--regularRadius);
}

aside.right .language form select option {
	
}

aside.right .useroptions {
	margin-top: var(--smallMargin);
	text-align:center;
}

aside.right .useroptions .button:not(.dark) {
	margin-bottom:var(--tinyMargin);
}

aside.right .useroptions .user {
	width:100%;
	margin-top: var(--smallMargin);
	display: flex;
	flex-direction: column;
}

aside.right .useroptions .user a {
	flex:1;
	display:flex;
	color: var(--colorLight);
	text-decoration:none;
	padding: var(--tinyMargin);
	box-sizing:border-box;
	border-radius: var(--regularRadius);
	align-items:center;
}

aside.right .useroptions .user a:hover {
	background-color: var(--colorPrimaryDarker);
}

aside.right .useroptions .user .img {
	width:var(--userThumb);
	height:var(--userThumb);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat:no-repeat;
	border-radius:50%;
	margin-right: var(--tinyMargin);
	background-color:var(--colorPrimaryDarker);
}

aside.right .useroptions .user img.options {
	width:var(--sideIcon);
	height:var(--sideIcon);
	filter: var(--tintColorLight);
}

aside.right .useroptions .user strong {
	flex:1;
	font-size: var(--semiText);
	margin-right: var(--tinyMargin);
	text-align:left;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	word-break: break-all;
	word-wrap: break-word;
}

aside.right .useroptions .addbutton {
	text-decoration:none!important;
	padding: var(--miniMargin) var(--smallMargin) var(--miniMargin) var(--smallMargin);
	border-radius: var(--fullRadius);
	background-color: var(--colorAccent);
	margin-top:var(--smallMargin);
	display: inline-flex;
	align-items:center;
	width:auto;
	font-family: 'bold';
	font-size: var(--mediumText);
	text-align:center;
	color: var(--colorLight);
	box-sizing:border-box;
}

aside.right .useroptions .addbutton:hover {
	background-color:var(--colorAccentDark);
}

aside.right .useroptions .addbutton strong {
	flex:1;
	font-size: var(--semiText);
	text-align:left;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	word-break: break-all;
	word-wrap: break-word;
}

aside.right .useroptions .addbutton img {
	width:var(--miniIcon);
	height:var(--miniIcon); 
	filter: var(--tintColorLight);
	margin-right:var(--tinyMargin);
}

aside.right .signin:hover {
	background-color: var(--colorAccentDark);
}

aside section .item {
	margin-top: var(--tinyMargin);
	border-radius: var(--regularRadius);
	padding: var(--tinyMargin);
}

aside section .item a {
	border-radius: var(--regularRadius);
	line-height: var(--lineHeightMedium);
	display: flex;
    align-items: center;
	text-decoration:none!important;
}

aside section .item:hover {
	background-color: var(--colorPrimaryDarker);
}

aside section .item .img {
	width:var(--userThumb);
	height: var(--userThumb);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	border-radius:50%;
	margin-right: var(--tinyMargin);
}

aside section .item .txt {
	flex:1;
}

aside section .item div {
	line-height:var(--lineHeightSmall);
}

aside section .item h4 {
	font-family: 'bold';
	font-size: var(--smallText);
    color: var(--colorLight);
}

aside section .item h5 {
	font-size: var(--smallText);
	color: var(--colorLightSecondary);
}

aside.right section.last {
	margin-top: var(--tinyMargin);
}

aside.right section.mobile .play {
	width:100%;
}

aside.right section.filters .filter {
	margin-bottom:var(--smallMargin);
}

aside.right section.filters .filter .items {
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	padding-left: var(--tinyMargin);
    padding-right: var(--tinyMargin);
	margin-top: var(--tinyMargin);
}

aside.right section.filters .filter .item {
	padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
	border:var(--borderThickness) solid var(--colorSecondary);
	color: var(--colorLight);
	text-decoration:none;
	font-size:var(--smallText);
	margin: var(--miniMargin);
	display:block;
	line-height:var(--lineHeightSmall);
	border-radius:var(--regularRadius);
	white-space: nowrap;
}

aside.right section.filters .filter .item.active, aside.right section.filters .filter .item:hover {
	color: var(--colorPrimaryDark);
	background-color: var(--colorLight);
	border:var(--borderThickness) solid var(--colorLight);
}

aside.right section.filters .filter .item div {
	display:flex;
	align-items:center;
}

aside.right section.filters .filter .item div span {
	flex-grow:1;
	margin-right:var(--miniMargin);
}

aside.right section.filters .filter .item div img {
	width:var(--miniIcon)!important;
	height:var(--miniIcon)!important;
	float:none!important;
	border-radius:0!important;
	margin-right:0!important;
	filter:var(--tintColorAccent);
}

/* #### END SIDEBAR RIGHT #### */ 

/* #### SLIDER #### */  


.slider .container  {
    float: none;
    display: inline-block;
    margin: 0 var(--smallMargin) 0 var(--smallMargin);
    zoom: 1;
	width: var(--itemWidth);
	position:relative;
	text-decoration:none!important;
}

.slider .container:first-of-type {
	margin-left:0!important;
}

.slider .container:last-of-type {
	margin-right:0!important;
	border-right:var(--defaultMargin) solid transparent;
}
.slider .container:hover .img .play  {
	background: var(--colorAccentDark)!important;
}

.slider .container h4 {
	font-family: 'bold';
    color: var(--colorLight);
	margin-top: var(--tinyMargin);
	white-space:normal;
	text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
	line-height:var(--lineHeightSmall);
}

.slider .container h5 {
	text-overflow: ellipsis;
    word-break: break-all;
    word-wrap: break-word;
	overflow:hidden;
	font-size:var(--smallText);
	color: var(--colorLightSecondary);
}
.slider .container .img {
	width:var(--itemWidth);
	height:var(--itemWidth);
	border-radius: var(--regularRadius);
	position:relative;
	background-color: var(--colorPrimary);
	background-size:cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

.slider .container .img:active {
	transform: var(--itemScale);
}

.slider .container .img time {
	display: block;
    height: auto;
    z-index: 1000;
    position: absolute;
    font-size: var(--smallText);
    left: var(--tinyMargin);
    margin-right: var(--tinyMargin);
    top: var(--tinyMargin);
    margin: auto;
    background: var(--colorPrimaryDarkTransparent);
    padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
    border-radius: var(--bigRadius);
    color: var(--colorLight);
    line-height: var(--lineHeightSmall);
}

.slider .container .img .episodes {
	display:block;
	height: auto;
	z-index: 1000;
    position: absolute;
	font-size: var(--smallText);
	left: 50%;
    transform: translate(-50%,0);
    margin-right: var(--tinyMargin);
    bottom: var(--tinyMargin);
    margin: auto;
	background: var(--colorPrimaryDarkTransparent);
	padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}

.slider .container .img .new {
	display:block;
	height: auto;
	z-index: 9000;
    position: absolute;
	font-size: var(--smallText);
    right: var(--tinyMargin);
    margin-left: var(--tinyMargin);
    top: var(--tinyMargin);
    margin: auto;
	background: var(--colorSecondary);
	padding: var(--miniMargin) var(--tinyMargin) var(--miniMargin) var(--tinyMargin);
	border-radius: var(--bigRadius);
	color: var(--colorLight);
	line-height: var(--lineHeightSmall);
}

.slider .container .img .play {
	width: var(--playMedium);
	height: var(--playMedium);
	background: var(--colorAccent);
	border-radius: 50%;
	padding: var(--playMediumMargin);
	box-sizing:border-box;
	position:absolute;
	margin: auto;
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
}

.slider .container .img .play img {
	height: 100%;
	filter: var(--tintColorLight);
	display: block;
}

/* #### FOOTER #### */ 

footer {
	margin-top: var(--bigMargin);
	font-size: var(--smallText);
	color: var(--colorSecondary);
	text-align:center;
	padding: 0 var(--defaultMargin) 0 var(--defaultMargin);
}

footer a {
	color: var(--colorSecondary);
}

footer a:first-of-type {
	display:block;
}

.mobilenavi {
	display:none;
	position:fixed;
	bottom:0;
	z-index:9970;
	background-color:var(--colorPrimaryDark);
	width:100%;
	padding: var(--tinyMargin);
	box-sizing:border-box;
	-webkit-box-shadow: 0px -5px 14px -6px rgba(0,0,0,0.37);
	-moz-box-shadow: 0px -5px 14px -6px rgba(0,0,0,0.37);
	box-shadow: 0px -5px 14px -6px rgba(0,0,0,0.37);
}

.mobilenavi ul {
	width:100%;
	table-layout: fixed;
	display:table;
}

.mobilenavi ul li {
	display: table-cell;
	text-align:center!important;
	line-height: var(--lineHeightTiny);
}

.mobilenavi ul li a {
	color: var(--colorSecondary);
	font-size: var(--smallText);
	text-decoration:none;
}

.mobilenavi ul li.active a, .mobilenavi ul li:hover a {
	color: var(--colorAccent);
}

.mobilenavi ul li span {
	display:block;
}

.mobilenavi ul li img {
	width: var(--mobileIcon);
    height: var(--mobileIcon);
	filter: var(--tintColorSecondary);
}

.mobilenavi ul li.active img, .mobilenavi ul li:hover img {
	filter: var(--tintColorAccent);
}

.fab {
	width: var(--playBig);
	height: var(--playBig);
	background: var(--colorSecondary);
	border-radius: 50%;
	padding: var(--fabMargin);
	box-sizing:border-box;
	display:none;
	z-index:9980;
	position:fixed;
	bottom:var(--fabBottomMargin);
	right:var(--tinyMargin);
}

.fab:hover {
	background: var(--colorSecondaryDark);
}

.fab.active {
	background: var(--colorAccent);
}

.fab.active:hover {
	background: var(--colorAccentDark);
}


.fab img {
	height: 100%;
	filter: var(--tintColorLight);
	display:block;
}


/* #### END FOOTER #### */ 

/* #### POPUP #### */ 

.blackbg {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right:0;
	background: var(--colorBlackTransparent);
	transition: opacity 500ms; 
	visibility:hidden;
	opacity:0;
	z-index:9960;
}

.blackbg.visible {
	visibility:visible;
	opacity:1;
}

.overlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right:0;
	background: var(--colorBlackTransparent);
	transition: opacity 500ms; 
	visibility: hidden;
	opacity: 0;
	z-index:100000000;
}
.overlay:target {
	visibility: visible;
	opacity: 1;
}

.popup {
	background: var(--colorPrimaryLight);
	border-radius: var(--regularRadius);
	width: auto;
	min-width: calc(var(--sidebarWidth) - var(--defaultMargin));
	right: var(--smallMargin);
	top: var(--popupTop);
	position: absolute;
	font-size: var(--mediumText);
	overflow:hidden;
}

.popup.center {
	width: auto;
	min-width: auto;
	right: auto;
	position: absolute;
	left: 50%;
	padding:var(--smallMargin);
	top: 50%;
	transform: translate(-50%,-50%);
}

.popup nav ul li a {
	display:block;
	background-color:var(--colorPrimaryLight);
	text-decoration:none;
	padding:var(--miniMargin) var(--smallMargin) var(--miniMargin) var(--smallMargin);
}

.popup nav ul li a:hover {
	background-color:var(--colorPrimary);
}

.popup .close {
	display:none;
}

.ttoverlay, .ctoverlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right:0;
	background: var(--colorBlackTransparent);
	transition: opacity 500ms; 
	visibility: hidden;
	opacity: 0;
	z-index:100000000;
}
.ttoverlay:target, .ctoverlay:target {
	visibility: visible;
	opacity: 1;
}

.tt, .ct {
	background: var(--colorPrimaryLight);
	border-radius: var(--regularRadius);
	width: auto;
	position: absolute;
	/*transition: all 5s ease-in-out;*/
	font-size: var(--mediumText);
	overflow:hidden;
}

.tt nav ul li a, .ct nav ul li a {
	display:block;
	background-color:var(--colorPrimaryLight);
	text-decoration:none;
	padding:var(--miniMargin) var(--smallMargin) var(--miniMargin) var(--smallMargin);
}

.tt nav ul li a:hover, .ct nav ul li a:hover {
	background-color:var(--colorPrimary);
}

.tt .close, .ct .close {
	display:none;
}

/* #### END POPUP #### */ 

/* #### PACE #### */

.pace {
  -webkit-pointer-events: none;
  pointer-events: none;

  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace-inactive {
  display: none;
}

.pace .pace-progress {
  background: var(--colorAccent);
  position: fixed;
  z-index: 2000;
  top: 0;
  right: 100%;
  width: 100%;
  height: var(--pageLoadingIndicatorHeight);
}


/* #### END PACE #### */

/* #### REPORT #### */

.reportcontainer {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right:0;
	display:flex;
	justify-content:center;
	align-items:center;
	background: var(--colorBlackTransparent);
	transition: opacity 500ms; 
	visibility: hidden;
	opacity: 0;
	z-index:100000000;
}

.reportcontainer:target {
	visibility: visible;
	opacity: 1;
}

.reportcontainer .report {
	background: var(--colorPrimaryLight);
	border-radius: var(--regularRadius);
	width: auto;
	padding:var(--smallMargin);
	overflow:hidden;
}

.reportcontainer .report .close {
	display:none;
}

.reportcontainer .report h3 {
	font-family: 'bold';
	color: var(--colorLight);
	margin-bottom:var(--smallMargin);
}

.reportcontainer .report label, .reportcontainer .report input {
	cursor:pointer;
}

.reportcontainer .report label {
	margin-left:var(--tinyMargin);
}

.reportcontainer .report .buttons {
	display:flex;
	justify-content: flex-end;
	align-items:center;
	margin-top:var(--smallMargin);
}

.reportcontainer .report .buttons a {
	font-size:var(--mediumText);
	display:block;
	margin-right:var(--smallMargin);
	color:var(--colorAccent);
	text-transform:uppercase;
	font-family: 'bold';
}

.reportcontainer .report .buttons input[type="submit"] {
	font-size:var(--mediumText);
	padding: var(--tinyMargin);
	margin-top:0;
	background:none;
	color:var(--colorAccent);
	font-family: 'bold';
	text-transform:uppercase;
}

.reportcontainer .report .buttons input[type="submit"]:hover {
	text-decoration:underline!important;
}


/* #### END REPORT #### */

/* #### DELETE #### */

.deletecontainer {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right:0;
	display:flex;
	justify-content:center;
	align-items:center;
	background: var(--colorBlackTransparent);
	transition: opacity 500ms; 
	visibility: hidden;
	opacity: 0;
	z-index:100000000;
}

.deletecontainer:target {
	visibility: visible;
	opacity: 1;
}

.deletecontainer .content {
	background: var(--colorPrimaryLight);
	border-radius: var(--regularRadius);
	width: auto;
	padding:var(--smallMargin);
	overflow:hidden;
}

.deletecontainer .content .close {
	display:none;
}

.deletecontainer .content h3 {
	font-family: 'bold';
	color: var(--colorLight);
}

.deletecontainer .content .buttons {
	display:flex;
	justify-content: flex-end;
	align-items:center;
	margin-top:var(--smallMargin);
}

.deletecontainer .content .buttons a {
	font-size:var(--mediumText);
	display:block;
	margin-right:var(--smallMargin);
	color:var(--colorAccent);
	text-transform:uppercase;
	font-family: 'bold';
}

.deletecontainer .content .buttons input[type="submit"] {
	font-size:var(--mediumText);
	padding: var(--tinyMargin);
	margin-top:0;
	background:none;
	color:var(--colorAccent);
	font-family: 'bold';
	text-transform:uppercase;
}

.deletecontainer .content .buttons input[type="submit"]:hover {
	text-decoration:underline!important;
}


/* #### END DELETE #### */

/* #### SCREEN #### */  

@media only screen and (min-width: 1200px) {
	.dragscroll:active {
		cursor: move;
		cursor: grab;
	}

	.scrollable::-webkit-scrollbar {
		height:var(--scrollbarHeight);
	}

	.scrollable::-webkit-scrollbar-track {
		background:transparent;
	}

	.scrollable::-webkit-scrollbar-thumb {
		border-radius: var(--regularRadius);
		background-color:var(--colorPrimary);
	}
}

@media only screen and (max-width: 1300px) {
	.main .usermasonry {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
	}
	.main .usermasonry .item {
		flex: 0 0 23%;
	}
}

@media only screen and (max-width: 1200px) {
	
	.main .story .player {
		display:none;
	}
	
	.main .story .top .content .currenttime {
		display:block;
	}
	
	.main .story .top .content {
		padding-top: var(--bigMargin);
	}
	
	.main .story .top .content .title {
		position:fixed;
		top:0;
		left:0;
		right:0;
		z-index:10000;
		padding:var(--tinyMargin);
	}
	
	.main .story .top .content .mobiledetails {
		display:flex;
	}
	
	.main .story .top .content .mobiletime, .main .story .top .content .mobileplayer, .main .story .top .content .title .back {
		display:flex;
	}
	
	.main .story .top .content .mobiletitle {
		display:block;
	}
	
	.main .story .top {
		min-height: 100vh;
		min-height: calc(var(--vh, 1vh) * 100);
		padding:var(--tinyMargin);
		align-items:flex-start;
		box-sizing:border-box;
		padding-bottom:var(--hugeMargin);
	}
	
	.main .story .top .content .mobileplayer .playcontainer .play:hover {
		background: var(--colorAccent);
	}
	
	.main .story .top .content .mobilevolume {
		display:flex;
	}

	.main .story .top .content .mobilevolume .muter:hover {
		background-color:transparent;
	}
	
	.main .story .top .content .title {
		justify-content: flex-end;
	}
	
	.main .story .top .content p.about {
		display:none;
	}
	
	.main .story .top .content .tags {
		display:none;
	}
	
	.main .story .top .content .user {
		justify-content: center;
	}
	
	.main .story .top .content .user a.userlink {
		display: block;
		text-align: center;
		line-height:var(--lineHeightMedium);
	}
	
	.main .story .top .content .user a.userlink span.txt {
		font-size:var(--semiText);
	}
	
	.main .story .top .content .user a.userlink span.img {
		margin:0 auto;
		width: var(--userThumbBig);
		height: var(--userThumbBig);
	}
	
	.main .story .top .content .user .button {
		display:none;
	}
	
	.main .story .top .content .title .icons a:not(.options) {
		margin-right: var(--tinyMargin);
	}
	
	.main .story .top .content .title h1 {
		display:none;
	}
	
	.main .story .top a.img {
		display:none;
	}
	
	.main .story .bottom .tags {
		display:block;
	}
	
	.main .story .bottom .comments .commentbox, .main .story .bottom .comments .commentlist {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
	}

	aside.left, aside.right  {
		display:none;
	}
	
	aside.right section.filters .filter .item:hover:not(.active) {
		border:var(--borderThickness) solid var(--colorSecondary);
		color: var(--colorLight);
		background-color:transparent;
	}
	
	aside.right.mobile {
		position:fixed;
		right:0;
		height:100%;
		width:var(--sidebarMobileWidth);
		z-index:9970;
		padding-bottom:var(--sidebarMobileBottomMargin);
		-webkit-box-shadow: -5px 0px 14px -6px rgba(0,0,0,0.37);
		-moz-box-shadow: -5px 0px 14px -6px rgba(0,0,0,0.37);
		box-shadow: -5px 0px 14px -6px rgba(0,0,0,0.37);
	}
	aside section.filters {
		margin-top: var(--tinyMargin);
	}
	
	aside.right.mobile .useroptions, aside.right.mobile .language {
		display:none;
	}
	
	.main:not(.nopadding):not(.noright) {
		margin-left:0;
		margin-right:0;
		padding: var(--smallMargin) 0 var(--mobileNaviPadding) 0!important;
	}
	
	.main.noright {
		margin-left:0;
	}
	
	.main.nopadding {
		padding: 0 0 var(--mobileNaviPadding) 0!important;
		margin-left:0!important;
		margin-right:0!important;
	}
	
	.main .teaser .gallery {
		width:100%; 
		flex: 1;
		display:flex;
		margin-right: 0;
		height: var(--galleryMobileHeight);
	}
	.main header {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
	}
	.main .last {
		display:block;
	}
	.main .teaser {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
		display:block;
		margin-bottom:var(--smallMargin);
	}
	.main .teaser .masonry {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin-top:var(--smallMargin);
		margin-left:0;
	}
	
	.main .teaser .masonry .item {
		flex: 0 0 48%;
		padding-top:48%;
		margin-bottom:var(--smallMargin);
	}

	.head.big {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
	}
	.slider .owl-stage-outer {
		padding: 0 var(--smallMargin) 0 var(--smallMargin)!important;
	}
	
	.main .random {
		padding:var(--smallMargin);
		margin:var(--smallMargin);
	}
	
	.main .random .play {
		width: var(--playMedium);
		height: var(--playMedium);
		padding: var(--playMediumMargin);
	}

	footer span:last-child {
		display:block;
		opacity:0;
	}
	footer {
		line-height: var(--lineHeightSmall)!important;
		padding: 0 var(--smallMargin) 0 var(--smallMargin)!important;
	}
	footer a:nth-of-type(2), footer span:first-of-type {
		display:none;
	}
	footer a:first-of-type {
		margin-bottom: var(--smallMargin);
	}
	.main .mobileheader {
		display:table!important;
	}
	.mobilenavi, .fab {
		display:block;
	}
	.slider .container  {
		margin: 0 var(--tinyMargin) 0 var(--tinyMargin);
	}
	.main .smallcontainer {
		padding:var(--tinyMargin);
	}
	.main .smallcontainer h1 {
		font-size:var(--smallHeaderText);
		line-height:var(--lineHeightMedium);
	}
	form.signup input.normal {
		width:80%;
	}

	form.signup .passwordcontainer {
		width:80%;
	}
	.popup {
		top: var(--popupTopMobile);
	}
	
	.popup.center {
		width: 80%;
		padding:var(--tinyMargin);
		top: 50%;
	}
	
	.main .terms {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
	}
	
	.main .searchmasonry {
		padding: 0 var(--smallMargin) 0 var(--smallMargin);
	}
	.main .searchmasonry .item {
		flex: 0 0 23%;
	}
	
	.main header h1 {
		font-size: var(--semiBigHeaderText);
	}
	.scrollable  {
		padding:var(--smallMargin);
	}
	.slider .container:last-of-type {
		border-right:var(--smallMargin) solid transparent;
	}
	.usercontainer:last-of-type {
		border-right:var(--smallMargin) solid transparent;
	}
	
	.main header .profilehead {
		padding: var(--smallMargin);
		line-height: var(--lineHeightSmall);
	}
	.main header .profilehead a.img {
		width: var(--userThumbSemiHuge); 
		height: var(--userThumbSemiHuge);
	}
	
	.main header .profilehead .text h1 {
		font-size:var(--smallHeaderText);
		line-height:var(--lineHeightMedium);
	}
	.main .news {
		padding: var(--smallMargin);
	}
	.main .tabcontainer .tabcontent .mine {
		margin: var(--smallMargin);
	}	
	.main .tabcontainer .tabcontent .mine .mainimg {
		width:var(--itemWidthMini);
		height:var(--itemWidthMini);
	}
	.main .tabcontainer .tabcontent .mine .content .icons .icon img {
		width: var(--tinyIcon);
		height: var(--tinyIcon);
	}
	.main header nav.profilenav ul li {
		padding: var(--tinyMargin);
	}
	.main header nav.profilenav {
		white-space: nowrap;
		position: relative;
		overflow-x:scroll;
		display:flex;
		line-height:var(--lineHeightMedium);
		overflow-y:hidden;
		-webkit-overflow-scrolling: touch;
		overflow-scrolling: touch;
	}
	.main .profiletext {
		margin: 0 var(--smallMargin) 0 var(--smallMargin);
	}
	.main .profilemore {
		margin: var(--tinyMargin) var(--smallMargin) 0 var(--smallMargin);
	}
	.main .profilehead .button {
		display:none;
	}
	.msg {
		bottom:auto;
		top:0;
	}
	
	form.settingsform label {
		margin: var(--tinyMargin) var(--smallMargin) var(--tinyMargin) var(--smallMargin);
	}

	form.settingsform .piccontainer {
		display: block;
		margin:var(--mediumMargin) var(--smallMargin) 0 var(--smallMargin);
		text-align:center;
	}

	form.settingsform .piccontainer a.img {
		margin:0 auto;
	}

	form.settingsform .piccontainer input {
		margin:0 auto;
		margin-top:var(--mediumMargin);
	}

	form.settingsform .container, form.settingsform textarea {
		margin:0 var(--smallMargin) 0 var(--smallMargin);
	}

	form.settingsform textarea {
		width:calc(100% - var(--defaultMargin));
	}

	form.settingsform .container input {
		flex: 1;
		background-color: transparent;
		border: none;
		font-size: var(--headerText);
		font-family: 'normal';
		color: var(--colorLight);
		margin-right: var(--tinyMargin);
	}

	form.settingsform .container .sideimg {
		padding: var(--tinyMargin);
		box-sizing: border-box;
		cursor: pointer;
		line-height:0;
		background-color:var(--colorPrimaryDark);
		border-radius:50%;
	}

	form.settingsform .container .sideimg:hover {
		background-color:var(--colorPrimaryDarker);
	}

	form.settingsform .container .sideimg img {
		width: var(--tinyIcon);
		filter: var(--tintColorLight);
	}
	.splitter {
		margin:var(--mediumMargin) var(--smallMargin) var(--mediumMargin) var(--smallMargin);
	}
}

@media only screen and (max-width: 800px) {
	.main .searchmasonry .item, .main .usermasonry .item {
		flex: 0 0 32%;
	}
}

@media only screen and (max-width: 600px) {
	.main .smallcontainer {
		width: 100%;
		padding:var(--tinyMargin);
	}
	form.signup {
		width:100%;
	}
	.main .searchmasonry .item, .main .usermasonry .item {
		flex: 0 0 48%;
	}
}

/* #### END SCREEN #### */ 

/* #### MOBILE PLAYER #### */

.main .story .top .content .mobileplayer .playcontainer .progress[value="0"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 0%, var(--colorAccentTransparentMore) 0% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="1"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 1%, var(--colorAccentTransparentMore) 1% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="2"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 2%, var(--colorAccentTransparentMore) 2% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="3"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 3%, var(--colorAccentTransparentMore) 3% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="4"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 4%, var(--colorAccentTransparentMore) 4% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="5"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 5%, var(--colorAccentTransparentMore) 5% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="6"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 6%, var(--colorAccentTransparentMore) 6% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="7"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 7%, var(--colorAccentTransparentMore) 7% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="8"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 8%, var(--colorAccentTransparentMore) 8% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="9"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 9%, var(--colorAccentTransparentMore) 9% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="10"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 10%, var(--colorAccentTransparentMore) 10% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="11"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 11%, var(--colorAccentTransparentMore) 11% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="12"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 12%, var(--colorAccentTransparentMore) 12% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="13"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 13%, var(--colorAccentTransparentMore) 13% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="14"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 14%, var(--colorAccentTransparentMore) 14% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="15"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 15%, var(--colorAccentTransparentMore) 15% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="16"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 16%, var(--colorAccentTransparentMore) 16% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="17"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 17%, var(--colorAccentTransparentMore) 17% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="18"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 18%, var(--colorAccentTransparentMore) 18% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="19"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 19%, var(--colorAccentTransparentMore) 19% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="20"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 20%, var(--colorAccentTransparentMore) 20% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="21"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 21%, var(--colorAccentTransparentMore) 21% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="22"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 22%, var(--colorAccentTransparentMore) 22% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="23"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 23%, var(--colorAccentTransparentMore) 23% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="24"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 24%, var(--colorAccentTransparentMore) 24% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="25"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 25%, var(--colorAccentTransparentMore) 25% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="26"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 26%, var(--colorAccentTransparentMore) 26% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="27"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 27%, var(--colorAccentTransparentMore) 27% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="28"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 28%, var(--colorAccentTransparentMore) 28% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="29"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 29%, var(--colorAccentTransparentMore) 29% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="30"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 30%, var(--colorAccentTransparentMore) 30% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="31"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 31%, var(--colorAccentTransparentMore) 31% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="32"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 32%, var(--colorAccentTransparentMore) 32% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="33"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 33%, var(--colorAccentTransparentMore) 33% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="34"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 34%, var(--colorAccentTransparentMore) 34% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="35"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 35%, var(--colorAccentTransparentMore) 35% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="36"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 36%, var(--colorAccentTransparentMore) 36% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="37"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 37%, var(--colorAccentTransparentMore) 37% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="38"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 38%, var(--colorAccentTransparentMore) 38% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="39"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 39%, var(--colorAccentTransparentMore) 39% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="40"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 40%, var(--colorAccentTransparentMore) 40% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="41"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 41%, var(--colorAccentTransparentMore) 41% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="42"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 42%, var(--colorAccentTransparentMore) 42% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="43"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 43%, var(--colorAccentTransparentMore) 43% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="44"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 44%, var(--colorAccentTransparentMore) 44% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="45"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 45%, var(--colorAccentTransparentMore) 45% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="46"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 46%, var(--colorAccentTransparentMore) 46% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="47"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 47%, var(--colorAccentTransparentMore) 47% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="48"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 48%, var(--colorAccentTransparentMore) 48% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="49"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 49%, var(--colorAccentTransparentMore) 49% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="50"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 50%, var(--colorAccentTransparentMore) 50% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="51"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 51%, var(--colorAccentTransparentMore) 51% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="52"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 52%, var(--colorAccentTransparentMore) 52% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="53"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 53%, var(--colorAccentTransparentMore) 53% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="54"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 54%, var(--colorAccentTransparentMore) 54% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="55"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 55%, var(--colorAccentTransparentMore) 55% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="56"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 56%, var(--colorAccentTransparentMore) 56% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="57"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 57%, var(--colorAccentTransparentMore) 57% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="58"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 58%, var(--colorAccentTransparentMore) 58% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="59"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 59%, var(--colorAccentTransparentMore) 59% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="60"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 60%, var(--colorAccentTransparentMore) 60% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="61"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 61%, var(--colorAccentTransparentMore) 61% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="62"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 62%, var(--colorAccentTransparentMore) 62% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="63"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 63%, var(--colorAccentTransparentMore) 63% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="64"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 64%, var(--colorAccentTransparentMore) 64% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="65"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 65%, var(--colorAccentTransparentMore) 65% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="66"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 66%, var(--colorAccentTransparentMore) 66% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="67"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 67%, var(--colorAccentTransparentMore) 67% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="68"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 68%, var(--colorAccentTransparentMore) 68% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="69"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 69%, var(--colorAccentTransparentMore) 69% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="70"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 70%, var(--colorAccentTransparentMore) 70% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="71"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 71%, var(--colorAccentTransparentMore) 71% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="72"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 72%, var(--colorAccentTransparentMore) 72% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="73"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 73%, var(--colorAccentTransparentMore) 73% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="74"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 74%, var(--colorAccentTransparentMore) 74% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="75"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 75%, var(--colorAccentTransparentMore) 75% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="76"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 76%, var(--colorAccentTransparentMore) 76% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="77"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 77%, var(--colorAccentTransparentMore) 77% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="78"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 78%, var(--colorAccentTransparentMore) 78% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="79"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 79%, var(--colorAccentTransparentMore) 79% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="80"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 80%, var(--colorAccentTransparentMore) 80% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="81"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 81%, var(--colorAccentTransparentMore) 81% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="82"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 82%, var(--colorAccentTransparentMore) 82% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="83"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 83%, var(--colorAccentTransparentMore) 83% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="84"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 84%, var(--colorAccentTransparentMore) 84% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="85"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 85%, var(--colorAccentTransparentMore) 85% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="86"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 86%, var(--colorAccentTransparentMore) 86% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="87"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 87%, var(--colorAccentTransparentMore) 87% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="88"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 88%, var(--colorAccentTransparentMore) 88% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="89"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 89%, var(--colorAccentTransparentMore) 89% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="90"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 90%, var(--colorAccentTransparentMore) 90% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="91"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 91%, var(--colorAccentTransparentMore) 91% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="92"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 92%, var(--colorAccentTransparentMore) 92% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="93"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 93%, var(--colorAccentTransparentMore) 93% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="94"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 94%, var(--colorAccentTransparentMore) 94% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="95"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 95%, var(--colorAccentTransparentMore) 95% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="96"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 96%, var(--colorAccentTransparentMore) 96% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="97"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 97%, var(--colorAccentTransparentMore) 97% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="98"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 98%, var(--colorAccentTransparentMore) 98% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="99"]::-webkit-progress-bar { background: conic-gradient(var(--colorAccent) 0% 99%, var(--colorAccentTransparentMore) 99% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="100"]::-webkit-progress-bar { background: var(--colorAccent); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="0"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 0%, var(--colorAccentTransparentMore) 0% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="1"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 1%, var(--colorAccentTransparentMore) 1% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="2"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 2%, var(--colorAccentTransparentMore) 2% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="3"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 3%, var(--colorAccentTransparentMore) 3% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="4"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 4%, var(--colorAccentTransparentMore) 4% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="5"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 5%, var(--colorAccentTransparentMore) 5% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="6"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 6%, var(--colorAccentTransparentMore) 6% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="7"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 7%, var(--colorAccentTransparentMore) 7% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="8"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 8%, var(--colorAccentTransparentMore) 8% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="9"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 9%, var(--colorAccentTransparentMore) 9% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="10"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 10%, var(--colorAccentTransparentMore) 10% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="11"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 11%, var(--colorAccentTransparentMore) 11% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="12"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 12%, var(--colorAccentTransparentMore) 12% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="13"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 13%, var(--colorAccentTransparentMore) 13% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="14"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 14%, var(--colorAccentTransparentMore) 14% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="15"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 15%, var(--colorAccentTransparentMore) 15% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="16"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 16%, var(--colorAccentTransparentMore) 16% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="17"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 17%, var(--colorAccentTransparentMore) 17% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="18"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 18%, var(--colorAccentTransparentMore) 18% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="19"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 19%, var(--colorAccentTransparentMore) 19% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="20"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 20%, var(--colorAccentTransparentMore) 20% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="21"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 21%, var(--colorAccentTransparentMore) 21% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="22"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 22%, var(--colorAccentTransparentMore) 22% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="23"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 23%, var(--colorAccentTransparentMore) 23% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="24"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 24%, var(--colorAccentTransparentMore) 24% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="25"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 25%, var(--colorAccentTransparentMore) 25% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="26"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 26%, var(--colorAccentTransparentMore) 26% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="27"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 27%, var(--colorAccentTransparentMore) 27% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="28"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 28%, var(--colorAccentTransparentMore) 28% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="29"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 29%, var(--colorAccentTransparentMore) 29% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="30"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 30%, var(--colorAccentTransparentMore) 30% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="31"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 31%, var(--colorAccentTransparentMore) 31% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="32"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 32%, var(--colorAccentTransparentMore) 32% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="33"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 33%, var(--colorAccentTransparentMore) 33% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="34"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 34%, var(--colorAccentTransparentMore) 34% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="35"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 35%, var(--colorAccentTransparentMore) 35% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="36"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 36%, var(--colorAccentTransparentMore) 36% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="37"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 37%, var(--colorAccentTransparentMore) 37% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="38"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 38%, var(--colorAccentTransparentMore) 38% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="39"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 39%, var(--colorAccentTransparentMore) 39% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="40"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 40%, var(--colorAccentTransparentMore) 40% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="41"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 41%, var(--colorAccentTransparentMore) 41% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="42"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 42%, var(--colorAccentTransparentMore) 42% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="43"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 43%, var(--colorAccentTransparentMore) 43% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="44"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 44%, var(--colorAccentTransparentMore) 44% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="45"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 45%, var(--colorAccentTransparentMore) 45% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="46"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 46%, var(--colorAccentTransparentMore) 46% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="47"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 47%, var(--colorAccentTransparentMore) 47% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="48"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 48%, var(--colorAccentTransparentMore) 48% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="49"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 49%, var(--colorAccentTransparentMore) 49% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="50"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 50%, var(--colorAccentTransparentMore) 50% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="51"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 51%, var(--colorAccentTransparentMore) 51% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="52"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 52%, var(--colorAccentTransparentMore) 52% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="53"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 53%, var(--colorAccentTransparentMore) 53% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="54"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 54%, var(--colorAccentTransparentMore) 54% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="55"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 55%, var(--colorAccentTransparentMore) 55% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="56"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 56%, var(--colorAccentTransparentMore) 56% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="57"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 57%, var(--colorAccentTransparentMore) 57% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="58"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 58%, var(--colorAccentTransparentMore) 58% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="59"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 59%, var(--colorAccentTransparentMore) 59% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="60"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 60%, var(--colorAccentTransparentMore) 60% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="61"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 61%, var(--colorAccentTransparentMore) 61% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="62"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 62%, var(--colorAccentTransparentMore) 62% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="63"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 63%, var(--colorAccentTransparentMore) 63% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="64"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 64%, var(--colorAccentTransparentMore) 64% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="65"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 65%, var(--colorAccentTransparentMore) 65% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="66"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 66%, var(--colorAccentTransparentMore) 66% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="67"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 67%, var(--colorAccentTransparentMore) 67% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="68"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 68%, var(--colorAccentTransparentMore) 68% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="69"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 69%, var(--colorAccentTransparentMore) 69% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="70"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 70%, var(--colorAccentTransparentMore) 70% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="71"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 71%, var(--colorAccentTransparentMore) 71% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="72"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 72%, var(--colorAccentTransparentMore) 72% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="73"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 73%, var(--colorAccentTransparentMore) 73% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="74"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 74%, var(--colorAccentTransparentMore) 74% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="75"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 75%, var(--colorAccentTransparentMore) 75% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="76"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 76%, var(--colorAccentTransparentMore) 76% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="77"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 77%, var(--colorAccentTransparentMore) 77% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="78"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 78%, var(--colorAccentTransparentMore) 78% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="79"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 79%, var(--colorAccentTransparentMore) 79% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="80"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 80%, var(--colorAccentTransparentMore) 80% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="81"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 81%, var(--colorAccentTransparentMore) 81% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="82"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 82%, var(--colorAccentTransparentMore) 82% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="83"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 83%, var(--colorAccentTransparentMore) 83% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="84"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 84%, var(--colorAccentTransparentMore) 84% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="85"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 85%, var(--colorAccentTransparentMore) 85% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="86"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 86%, var(--colorAccentTransparentMore) 86% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="87"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 87%, var(--colorAccentTransparentMore) 87% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="88"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 88%, var(--colorAccentTransparentMore) 88% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="89"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 89%, var(--colorAccentTransparentMore) 89% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="90"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 90%, var(--colorAccentTransparentMore) 90% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="91"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 91%, var(--colorAccentTransparentMore) 91% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="92"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 92%, var(--colorAccentTransparentMore) 92% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="93"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 93%, var(--colorAccentTransparentMore) 93% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="94"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 94%, var(--colorAccentTransparentMore) 94% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="95"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 95%, var(--colorAccentTransparentMore) 95% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="96"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 96%, var(--colorAccentTransparentMore) 96% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="97"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 97%, var(--colorAccentTransparentMore) 97% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="98"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 98%, var(--colorAccentTransparentMore) 98% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="99"]::-moz-progress-bar { background: conic-gradient(var(--colorAccent) 0% 99%, var(--colorAccentTransparentMore) 99% 100%); }
.main .story .top .content .mobileplayer .playcontainer .progress[value="100"]::-moz-progress-bar { var(--colorAccent); }

/* #### END MOBILE PLAYER #### */