 @font-face {
	font-family: 'Roboto-Regular';
	font-weight: 500;
	src: url('https://i49.vbox7.com/css/fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-Regular.woff') format('woff'), url('https://i49.vbox7.com/css/fonts/Roboto-Regular.ttf')  format('truetype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-Regular.svg#Roboto-Regular') format('svg');
}

@font-face {
	font-family: 'Roboto-Medium';
	src: url('https://i49.vbox7.com/css/fonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-Medium.woff') format('woff'), url('https://i49.vbox7.com/css/fonts/Roboto-Medium.ttf')  format('truetype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-Medium.svg#Roboto-Medium') format('svg');
}

@font-face {
	font-family: 'Roboto-MediumItalic';
	src: url('https://i49.vbox7.com/css/fonts/Roboto-MediumItalic.eot?#iefix') format('embedded-opentype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-MediumItalic.woff') format('woff'), url('https://i49.vbox7.com/css/fonts/Roboto-MediumItalic.ttf')  format('truetype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-MediumItalic.svg#Roboto-MediumItalic') format('svg');
}

@font-face {
	font-family: 'Roboto-Bold';
	src: url('https://i49.vbox7.com/css/fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-Bold.woff') format('woff'), url('https://i49.vbox7.com/css/fonts/Roboto-Bold.ttf')  format('truetype'),
		url('https://i49.vbox7.com/css/fonts/Roboto-Bold.svg#Roboto-Bold') format('svg');
}

@font-face {
	font-family: 'Roboto-g-500';
	font-style: normal;
	font-weight: 500;
	src: local('Roboto'), local('Roboto-Regular'),  url('https://i49.vbox7.com/css/fonts/Roboto-Regular-g.woff') format('woff'), url('https://i49.vbox7.com/css/fonts/Roboto-Regular-g.ttf')  format('truetype');
}


/* ==   ICON FONTS  == */
@font-face {
	font-family: 'n-icons';
	src:  url('https://i49.vbox7.com/css/fonts/n-icons.eot?v=4');
	src:  url('https://i49.vbox7.com/css/fonts/n-icons.eot?v=4#iefix') format('embedded-opentype'),
		url('https://i49.vbox7.com/css/fonts/n-icons.ttf?v=4') format('truetype'),
		url('https://i49.vbox7.com/css/fonts/n-icons.woff?v=4') format('woff'),
		url('https://i49.vbox7.com/css/fonts/n-icons.svg?v=4#nicons') format('svg');
	font-weight: normal;
	font-style: normal;
}

i[class*=icon] { display:inline-block;   }
/*i[class*=icon]:not(:empty), i[class*=icon]:not(:blank) { font-size: 0!important } */
i[class*=icon] > span { float: left }
[class^="icon-"], [class*=" icon-"], [class^="icon-"] > span, [class*=" icon-"] > span {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'n-icons' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	position: relative;
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-browse:before {
	content: "\e900";
}
.icon-like-fill:before {
	content: "\e903";
}
.icon-dislike-fill:before {
	content: "\e903";
}
.icon-dislike-fill {
	transform: rotate(-180deg);
	bottom: -0.3em;
}
.icon-menu-comments:before {
	content: "\e904";
}
.icon-favorites:before {
	content: "\e905";
}
.icon-smiley:before {
	content: "\e906";
}
.icon-groups:before {
	content: "\e907";
}
.icon-message:before {
	content: "\e908";
}

.icon-subscribes:before {
	content: "\e909";
	font-size: 1.2em;
}
.icon-subs:before {
	content: "\e90a";
}
.icon-upload:before {
	content: "\e90b";
}

.icon-notif-stroke {
	top: -.1em;
}
.icon-notif-stroke:before {
	content: "\e90c";
	font-size: 1.4em;
	margin: 0 0 0 -.5em;
}

.icon-notification { font-size: 1.35em}
.icon-notification .path1:before {
	content: "\e90c";
}
.icon-notification .path2:before {
	content: "\e90d";
	margin-left: -1em;
}
.icon-notification .path3:before {
	content: "\e90e";
	margin-left: -1em;
}
.icon-notification-btn .path1:before {
	content: "\e90f";
}
.icon-notification-btn .path2:before {
	content: "\e911";
	margin-left: -0.994140625em;
}
.icon-notification-ok:before {
	font-size: .9em;
	content: "\e912";
}
.icon-subscr:before {
	content: "\e983";
}
.icon-rec:before {
	content: "\e919";
}
.icon-settings:before {
	content: "\e91a";
}
.icon-subscribe-btn .path1:before {
	content: "\e91e";
	color: rgb(255, 20, 100);
}
.icon-subscribe-btn .path2:before {
	content: "\e91f";
	margin-left: -0.994140625em;
	color: rgb(255, 255, 255);
}
.icon-subscribe-btn .path3:before {
	content: "\e920";
	margin-left: -0.994140625em;
	color: rgb(255, 255, 255);
}
.icon-favorites-thin:before {
	content: "\e921";
}
.icon-history:before {
	content: "\e923";
}

.icon-home:before {
	content: "\e924";
	font-size: 1.2em;
}
.icon-news:before {
	content: "\e927";
}
.icon-play-stroke {
	top: .05em
}
.icon-play-stroke:before {
	content: "\e928";
	font-size: 1.1em;
}
.icon-user-playlist:before {
	content: "\e92b";
}
.icon-user-check:before {
	content: "\e92c";
}
.icon-edit:before {
	content: "\e92d";
}
.icon-x-search:before {
	content: "\e92e";
}
.icon-airplay:before {
	content: "\e92f";
}
.icon-arrow-left:before {
	content: "\e930";
}
.icon-arrow-right:before {
	content: "\e931";
}
.icon-arrow-up:before {
	content: "\e931";
}
.icon-arrow-up {
	transform: rotate(-90deg);
	bottom: -0.7em;
}
.icon-arrow-down {
	transform: rotate(90deg);
	bottom: -0.7em;
}
.icon-back-old:before {
	content: "\e932";
}
.icon-back:before {
	content: "\e933";
}
.icon-crtg:before {
	content: "\e934";
}
.icon-cast:before {
	content: "\e935";
}
.icon-rsspl:before {
	content: "\e936";
}
.icon-channels:before {
	content: "\e969";
}
.icon-comments:before {
	content: "\e937";
}
.icon-copy:before {
	content: "\e938";
}
.icon-copy-ang:before {
	content: "\e938";
}
.icon-copy-ang {
	transform: rotate(-45deg);
	font-size: .65em;
	margin-right: -.5em;
	margin-left: -.5em;
}
.icon-eye:before {
	content: "\e939";
	margin-left: 1px;
}
.icon-fullscreen:before {
	content: "\e93a";
}
.icon-hd .path1:before {
	content: "\e93b";
	color: rgb(255, 20, 100);
}
.icon-hd .path2:before {
	content: "\e93c";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-hd .path3:before {
	content: "\e93d";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-hd .path4:before {
	content: "\e93e";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-hd .path5:before {
	content: "\e93f";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-hd .path6:before {
	content: "\e940";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-hd .path7:before {
	content: "\e941";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-hd .path8:before {
	content: "\e942";
	margin-left: -1.44140625em;
	color: rgb(255, 255, 255);
}
.icon-next-btn .path1:before {
	content: "\e943";
	color: rgb(0, 0, 0);
	opacity: 0.4;
}
.icon-next-btn .path2:before {
	content: "\e944";
	margin-left: -1em;
	color: rgb(255, 255, 255);
	opacity: 0.7;
}
.icon-next:before {
	content: "\e945";
}
.icon-player-add:before {
	content: "\e946";
}
.icon-share:before {
	content: "\e947";
}
.icon-share-filled:before {
	content: "\e96e";
}
.icon-playlist-add:before {
	content: "\e948";
}
.icon-playlist-thin:before {
	content: "\e949";
}
.icon-repeat:before {
	content: "\e94a";
}
.icon-shuffle:before {
	content: "\e94b";
}
.icon-play-btn .path1:before {
	content: "\e94c";
	color: rgb(0, 0, 0);
	opacity: 0.4;
}
.icon-play-btn .path2:before {
	content: "\e94d";
	margin-left: -1em;
	color: rgb(255, 255, 255);
}
.icon-pause-btn .path1:before {
	content: "\e94e";
	color: rgb(0, 0, 0);
	opacity: 0.4;
}
.icon-pause-btn .path2:before {
	content: "\e94f";
	margin-left: -1em;
	color: rgb(255, 255, 255);
}
.icon-pause-btn .path3:before {
	content: "\e950";
	margin-left: -1em;
	color: rgb(255, 255, 255);
}
.icon-pause:before {
	content: "\e951";
}
.icon-prev-btn .path1:before {
	content: "\e952";
	color: rgb(0, 0, 0);
	opacity: 0.4;
}
.icon-prev-btn .path2:before {
	content: "\e953";
	margin-left: -1em;
	color: rgb(255, 255, 255);
	opacity: 0.7;
}
.icon-prev:before {
	content: "\e954";
}
.icon-progressbar-dot:before {
	content: "\e955";
}
.icon-reload:before {
	content: "\e956";
}
.icon-search:before {
	content: "\e957";
}
.icon-settings-hd-pink .path1:before {
	content: "\e958";
	color: rgb(255, 20, 100);
}
.icon-settings-hd-pink .path2:before {
	content: "\e959";
	margin-left: -1.365234375em;
	color: rgb(255, 20, 100);
}
.icon-settings-hd-pink .path3:before {
	content: "\e95a";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings-hd-pink .path4:before {
	content: "\e95b";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings-hd-pink .path5:before {
	content: "\e95c";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings-hd-pink .path6:before {
	content: "\e95d";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings-hd-pink .path7:before {
	content: "\e95e";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings-hd-pink .path8:before {
	content: "\e95f";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings-hd-pink .path9:before {
	content: "\e960";
	margin-left: -1.365234375em;
	color: rgb(255, 255, 255);
}
.icon-settings2:before {
	content: "\e961";
}
.icon-checkt-btn .path1:before {
	content: "\e962";
	color: rgb(0, 0, 0);
	opacity: 0.4;
}
.icon-checkt-btn .path2:before {
	content: "\e963";
	margin-left: -1em;
	color: rgb(255, 255, 255);
}
.icon-checkbx .backgr:before {
	content: "\e964";
	color: rgb(255, 255, 255);
}
.icon-checkbx .out:before {
	content: "\e965";
	margin-left: -0.994140625em;
	color: rgb(157, 157, 157);
}
.icon-checkbx .tick:before {
	content: "\e966";
	margin-left: -0.994140625em;
	color: rgb(255, 20, 100);
}
.icon-top40:before {
	content: "\e967";
}
.icon-user:before {
	content: "\e968";
}

.seven-path:before {
	content: "\e901";
	color: rgb(255, 20, 100);
}
.vbox-path:before {
	content: "\e902";
}

.icon-logo-black .seven-path:before {
	content: "\e901";
	color: rgb(255, 20, 100);
}
.icon-logo-black .vbox-path:before {
	content: "\e902";
	margin-left: -4.8046875em;
	color: rgb(33, 33, 33);
}
.icon-logo-white .seven-path:before {
	content: "\e901";
	color: rgb(255, 20, 100);
}
.icon-logo-white .vbox-path:before {
	content: "\e902";
	margin-left: -4.8046875em;
	color: rgb(255, 255, 255);
}

.icon-logo-vbox7 .path-o:before {
  content: "\e96f";
}
.icon-logo-vbox7 .path-v:before {
  content: "\e970";
  margin-left: -4.09375em;
}
.icon-logo-vbox7 .path-x:before {
  content: "\e971";
  margin-left: -4.09375em;
}
.icon-logo-vbox7 .path-seven:before {
  content: "\e972";
  margin-left: -4.09375em;
  color: rgb(255, 20, 100);
}
.icon-logo-vbox7 .path-b:before {
  content: "\e973";
  margin-left: -4.09375em;
}

.icon-logo-vbox7.white { color: #fff}

.icon-play:before {
	content: "\e910";
}
.icon-facebook-2c .cirtg:before {
	content: "\e913";
	color: rgb(59, 89, 152);
}
.icon-facebook-2c .f:before {
	content: "\e914";
	margin-left: -0.9931640625em;
	color: rgb(255, 255, 255);
}

.icon-facebook-neg .cirtg:before {
	content: "\e913";
	color: rgb(255, 255, 255);
}
.icon-facebook-neg .f:before {
	content: "\e914";
	margin-left: -0.9931640625em;
	color: rgb(59, 89, 152);
}

.fb-share-btn > .icon-facebook-2c .cirtg:before { color: rgb(255, 255, 255); }
.fb-share-btn > .icon-facebook-2c .f:before { color: rgb(59, 89, 152); }

.icon-facebook-1c:before {
	content: "\e915";
}
.icon-gif:before {
	content: "\e916";
}
.icon-like:before {
	content: "\e917";
}
.icon-messenger:before {
	content: "\e918";
}

.icon-open {
	transform: rotate(180deg);
}
.icon-open:before {
	content: "\e91b";
}
.icon-closed:before {
	content: "\e91b";
}

.icon-playlist:before {
	content: "\e91c";
}
.icon-more:before {
	content: "\e91d";
}
.icon-more {
	font-size: .28em;
	/*position: relative;
	top: -1em;*/
}
.icon-popular-category:before {
	content: "\e922";
}
.icon-share2:before {
	content: "\e925";
}
.icon-check:before {
	content: "\e926";
}
.icon-viber:before {
	content: "\e929";
}
.icon-x:before {
	content: "\e92a";
}
.icon-comments-fill:before {
	content: "\e96b";
}
.icon-options:before {
	content: "\e96a";
}

.icon-article:before {
	content: "\e96c";
}
.icon-send:before {
	content: "\e96d";
}

.icon-x-screen .cirtg:before {
	content: "\e913";
	color: rgb(59, 89, 152);
}
.icon-x-screen .icon-x:before {
	content: "\e914";
	margin-left: -0.9931640625em;
	color: rgb(255, 255, 255);
}

.icon-gplus-stroke:before {
	content: "\e974";
}

.icon-gglplus:before {
	content: "\e975";
}
.icon-gplus-fill:before {
	content: "\e976";
}
.icon-twitt-stroke:before {
  content: "\e977";
}
.icon-twitt:before {
  content: "\e978";
}
.icon-instgr-stroke {
	background-clip: text;
    -webkit-background-clip: text!important;
    background: 0 0 /100% no-repeat;
    color: transparent!important;
	background:  radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
}
.icon-instgr-stroke:before {
  content: "\e979";
}

.icon-watch:before {
  content: "\e97a";
}

.icon-top100-thin:before {
  content: "\e97b";
}

.icon-top100:before {
  content: "\e97c";
}

.icon-play-btn2 { font-size: 1.3em}

.icon-play-btn2 .out:before {
	content: "\e965";
	color: inherit
}
.icon-play-btn2 .play:before {
	content: "\e94d";
	margin-left: -0.994140625em;
	color: inherit;
}

.icon-home-filled:before {
	content: "\e982";
}

.icon-android:before {
	content: "\e984";
}

.icon-ios:before {
	content: "\e985";
}

.icon-watch-simp:before {
	content: "\e986";
}

.icon-ham-btn:before {
	content: "\e987";
}

.icon-junk:before {
	content: "\e988";
}

.icon-smiley-simp:before {
	content: "\e989";
}

.icon-barcode:before {
	content: "\e98b";
}

.icon-copy-gr:before {
	content: "\e98c";
}

.icon-star-stroke:before {
	content: "\e922";
}

.icon-star-filled:before {
	content: "\e98d";
}

.icon-notf-stroke:before {
	content: "\e98e";
}

.icon-save:before {
	content: "\e98f";
}

.icon-bann:before {
	content: "\e990";
}



.dot { position: absolute; width: 1em; height: 1em; display: inline-block; vertical-align: middle; background: #000; border-radius: 50%;}
.dot.new,
.new .dot { display: inline-block!important; background: #ff1464}

p .dot,
h2 .dot,
h3 .dot { width: .15em; height: .15em; }

.masks-def { display: none!important}

.fb-share-btn > .icon-facebook-2c .cirtg:before { color: rgb(255, 255, 255); }
.fb-share-btn > .icon-facebook-2c .f:before { color: rgb(59, 89, 152); }

.mid-dot:before {content:"\00b7";  font-size: 150%; vertical-align:middle; font-family: none; line-height:.5em; position: relative; left: -0.12em;}

i.black { color: #000; }
i.grey { color: #2b2b2b; }
i.tr-5 { opacity: .5 }
i.tr-8 { opacity: .8 }
i.white { color: #fff}
.pink { color: #ff1464 }
.bold-txt { font-weight: bold}
.nobr-txt { white-space: nowrap; }

.icon-compound { position: relative;  }
.icon-compound > * { display: block; position: absolute; }

.icon-compound > .icon-crtg { font-size: 1em }
.icon-compound > .icon-play { font-size: .435em; top:.589em; left: .85em; }
.icon-compound > .icon-check { font-size: .435em; top:.6389em; left: .45em; }
.icon-compound > .icon-gif { font-size: .35em; color: #fff; z-index: 10; top: .9em; width: 2.9em; text-align: center }

.icon-compound.tops-num { position: relative; width: 1em; text-align: center}
.icon-compound.tops-num > .icon-crtg { font-size: 1em; top:0; left: 0 }
.icon-compound.tops-num > .top-number { position: relative; font: normal .65em/1.65rem Roboto-Regular, sans-serif; color: #fff; z-index: 10; vertical-align: top; }

.voted.icon-like-fill, .voted .icon-like-fill  { color: #24b701;}
.voted.icon-dislike-fill,  .voted .icon-dislike-fill{ color: #ff1464}

.icon-crtg.bgr { position: relative; color: #fff; }
.icon-crtg.bgr > i { position: absolute; top:17%; left: 50% }

/* ==   END ICON FONTS  == */


/* ==   DEFAULTS AND COMMON ELEMENTS   == */

html { font:normal 16px Roboto-Regular, sans-serif; }

section, article, nav, .clear { display: block; clear: both}
section:before, article:before, nav:before, .clear:before,
section:after, article:after, nav:after, .clear:after { content: ""; display: block; clear: both}
a { text-decoration: none; color: inherit }
a.fb { color: #4267b2}
a.tw { color: #1da0f1}

header a { text-decoration: none}

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background: transparent; color: auto; box-shadow: none;}

h2 { margin: 0 0 1.5rem; padding: 0; text-align: center; font: normal 1.4rem/1 Roboto-Medium, sans-serif; color: #000;}
h2 i { font-size: .9em; margin: 0 .5rem; }
h3 { font: normal 1.15rem Roboto-Regular, sans-serif;}
h4 { font: normal .95rem/1.9 Roboto-Regular, sans-serif; margin: .6rem 0 .8rem; color: #7c7c7c}
.demo > h3 { text-align: center }
/*
.feed h2 { font: normal 1.4rem/1 Dinpro-Bold, sans-serif; text-transform: uppercase }
h3 { font: normal 1.30rem/1.2 Dinpro-Regular, sans-serif; }
*/
.arthref .icon-container ul li span { white-space: nowrap}

nav ul { display: inline-block; margin: 0; padding: 0}
nav ul li { display: inline-block; margin: 0; padding: 0; list-style: none}
nav a { display: inline-block; text-decoration: none; color: inherit }
nav a.active { color: #ff1464 }

.avatar-cont i.icon-crtg,
.avatar-simp.icon-crtg { padding: 1px 0 0 1px; background-clip: text;  -webkit-background-clip: text!important; background: 50% 50% / cover  no-repeat; color: transparent!important; font-size: 64px; }
.avatar-cont.small i.icon-crtg,
.avatar-simp.small { font-size: 30px; }
.avatar-cont.mini i.icon-crtg,
.avatar-simp.mini { font-size: 26px; padding: 1px /* crop bug fix */ }
.avatar-cont.xmini i.icon-crtg,
.avatar-simp.xmini { font-size: 22px; padding: 1px /* crop bug fix */}

.left-col,
.right-col { box-sizing: border-box;}

.left { float: left;  }
.right { float: right; }
.center { text-align: center}
.vtop { vertical-align: top}


.label { color: #ff1464; font-size: .8rem; font-weight: bold; text-transform: uppercase;}
.label.powered { text-transform: none}
.label > i { margin-right: .3rem}

.flex-cont { display: -webkit-flex; display: flex;}
.flex-cont > * { -webkit-flex: 1 1 auto; flex: 1 1 auto; margin: auto 1.2rem auto 0}
.flex-cont > *:last-child { margin-right: 0}
.flex-cont > *:nth-child(2):last-child { margin-right: auto}
.flex-cont > div > img { height: 100%; /*width: auto!important;*/ margin: auto; object-fit: cover; object-position: 50% 0}
.flex-cont > h4 { flex: 1 0 100%}

.flex-cont.vert { display: inline-flex; flex-direction: column}
.flex-cont.vert:before, .flex-cont.vert:after { contеnt:""; display: block; clear: both}
.flex-cont.vert > *, .flex-cont.vert .btn { flex:1 1 auto; margin: initial; margin-bottom: 2rem}
.flex-cont.vert > *:last-child { margin-bottom: 0;}

.flex-cont-left { display: -webkit-flex; display: flex; text-align: left;}
.flex-cont-left > * { flex: initial; margin-right: 2.5rem}
.flex-cont-left > *:last-child { margin-right: 0}

.flex-cont .right-col { display: flex; text-align: right; flex: initial; }
.right-col .foll-wr { display: inline-block; margin: auto .5rem; }
.right-col .subscr-btn { font-size: .65rem }
.right-col .subscr-btn .icon-notification { font-size: 2.25em }

.spread.flex-cont { width: 100%; justify-content: space-between; }
.spread.flex-cont > * { flex: 0 auto }

.hor-scroll-wrap { width: 100%; overflow-x: scroll; }
.hor-scroll-wrap > * { display: flex; width: auto;  white-space: nowrap; }
.hor-scroll-wrap > ul { display: flex; margin: 0; padding: 1.3rem 0 0 .5rem;  width: auto; list-style: none; -webkit-flex-wrap: nowrap;  flex-wrap: nowrap; }
.hor-scroll-wrap li { display: flex; padding: 0;  width: auto; list-style: none; -webkit-flex-wrap: nowrap;  flex-wrap: nowrap; }



.def-nav > ul { display: flex; font-size: 1.14rem; }
.def-nav > ul li { flex: 1; height: 42px; }
.def-nav > ul li > a { display: flex; padding: 0 1rem; height: 42px; }
.def-nav.narrow > ul li a { padding: 0 .6rem;  }
.def-nav li:last-child > a { margin-right: -.75rem; padding: 0 .75rem 0 .6rem}
.def-nav a i { position: relative; display: inline-block; margin: auto; font-size: 1.125rem; font-size: 18px }
.def-nav i .dot { position: absolute; right: -.25rem; top: -.25rem; border: 2px solid #fff}
.def-nav i.icon-news { font-size: 1.3em }
.def-nav a i.icon-more { font-size: .28em; }
.def-nav .avatar-cont i { font-size: 1.625rem }
.def-nav i.icon-top100 {font-size: 1.08em; color: #ff1464}
.def-nav li:first-child > * { margin: 0}

.btn-cont { display: flex; margin: 1.5rem 0; padding: 0 16px; box-sizing: border-box; width: 100%;  flex-wrap: wrap; justify-content: space-between; }
.btn-cont + .btn-cont { margin: 0 0 1.5rem 0; padding: 0 16px; }
.btn-cont + h2 { margin-top: 2.5rem; padding-top: .5rem; }
.def-btn { display: inline-block; margin: auto; padding: 0 1rem; height: 2.5rem; line-height: 2.4rem; text-align: center; font-size: 1rem; font-weight: normal; text-align: center; text-decoration: none; background: #ff1464; color: #fff; border-radius: 5px; border: 0; cursor: pointer }
.def-btn:hover { text-decoration: none!important; }
.def-btn.cent { display: block; min-width: 50%; min-height: 4rem; line-height: 4rem;  font-size: 1.3rem;}
.def-btn.cent.small,
.def-btn.small { border: 0; min-height: 2.2rem; height: 2.2rem; line-height: 2.2rem; font-size: .9rem; border-radius: 3px; }
.def-btn.small { min-width: 0; font-weight: normal;}
.def-btn.wide { position: relative; display: block; width: 100%; margin: 1rem 0 0; height: 3.5rem; line-height: 3.4rem;  box-sizing: border-box; vertical-align: middle;  }
.def-btn.green { background: #14ba00; color: #fff}
.def-btn.yellow { background: #fff200; color: #000}
.def-btn.red { background: #fb1a22; color: #fff}
.def-btn.green:hover { background: #6b8e23;}
.def-btn.yellow:hover { background: #ffd300;}
.def-btn.red:hover { background: #8b0000;}

button:disabled, .disabled  {opacity: .3; cursor: default;}

.simple-btn.cent { display: block; width: 100%; box-sizing: border-box; margin: 0rem auto 1.2rem; padding: .5rem 1rem; text-align: center}

.title-btns { padding: 0 16px; margin: 2.7rem 0 0;   font: italic 1.1rem Roboto-Medium, sans-serif; text-align: center  }
.btn-cont .def-btn:not(.wide) { flex: 1; margin-left: 8px; margin-right: 8px; }
.btn-cont .def-btn > *:only-child { margin: auto }
.btn-cont .def-btn:first-child { margin-left: 0}
.btn-cont .def-btn:last-child { margin-right: 0}
.btn-cont .def-btn:only-child { margin: 0 auto; padding: 0 1.75rem; flex: initial;  }
.def-btn > i { line-height: 2.4rem}
.def-btn > i + span { margin-left: .75rem}

.btn-cont.tabs-cont  { margin: 1.5rem 8px; padding: 0 8px; width: auto;  padding-bottom: 1.8rem; border-bottom: 1px solid #c4c4c4 }
.btn-cont.tabs-cont .def-btn { border-radius: 3px!important; background: #d8d8d8; color: #000}
.btn-cont.tabs-cont .def-btn.active { background:  #ff1464; color: #fff}

.def-btn.fb-share-btn,
.def-btn.fb-msng-btn,
.def-btn.viber-btn,
.def-btn.half-gr-btn { display: flex; align-items: center; flex: 1; margin-left: 8px; font-size: 2.2rem}
.def-btn.half-gr-btn { flex: .5!important; background: #7c7c7c; font-size: 1.5rem; line-height: 1  }

.def-btn.fb-share-btn { background: #4267b2; font-size: 1rem }
.def-btn.fb-share-btn iframe { margin: auto!important }
.def-btn.fb-share-btn span { vertical-align: middle!important }
.def-btn.fb-msng-btn { background: #0084ff; }
.def-btn.viber-btn { background: #7e2998; }

.def-btn.wide > * { vertical-align: middle; }
.def-btn.wide > i { font-size: 1.5rem}
.def-btn.wide > i.icon-back { position: absolute; left: 1.5rem; top:1.5rem; font-size: .65rem}

.banner { text-align: center;  clear: both; border: 1px solid transparent; margin-bottom:  1.8rem; }
.banner > .adv-text  { display: block; width: 100%; text-align: center; font: normal 0.8rem/1.5 Roboto-Regular, sans-serif; color: #7c7c7c}
.banner > .adv-text:after  { display: block; content: ''; clear: both}
.banner:before,
.banner:after{ content: ''; display: block; clear: both; }
.banner iframe { margin: auto!important;  }
.banner > div { position:relative; display: inline-block; margin-top: 14px; }
.banner > div:before { display: block!important; content: 'Реклама'; position: absolute; top: -14px; right: 0; font-family: Arial,Helvetica,sans-serif;	font-size: 10px; color: #666; line-height: 14px; z-index: 2000;	}



#fasha-top { position: relative; display: flex; padding: 0; height: 50px; overflow: hidden; background: #19191b; color: #fff; text-align: center; grid-column: 1 / -1; cursor: pointer; background-position: center top; background-repeat: no-repeat; background-size: cover}
.fasha-cont { padding-right: 30px;  margin: auto; }
.fasha-cont > a { display: block; width: 100%; height: 100%; outline: none; text-decoration: none; }
#fasha-top .icon-x-search { position: absolute; top: 0; right: 0; padding: 10px; margin: 0; cursor: pointer; font-size: 1.2rem; text-shadow: 1px 2px 4px rgba(0,0,0,.5)}
.fasha-fix .user-header .top-fix-cont { top:50px; }
.fasha-fix .vip.user-header,
.fasha-fix .user-header { position: static!important }


.inner-pg img {max-width: 100%; height: auto}
.inner-pg iframe { max-width: 100%; display: block; }

.toggle-trigger.open-trig .icon-open,
.toggle-trigger.collapsed-trig .icon-closed { display: inline-block}
.toggle-trigger.open-trig .icon-closed,
.toggle-trigger.collapsed-trig .icon-open { display: none}

.collapsed-toggle { max-height: 0px; height: auto; padding-bottom: 0!important; border:0!important; overflow: hidden; -webkit-transition: max-height 1s; transition: max-height 1s; }
.open-toggle {  max-height:1500px!important; height: auto; overflow-y: auto; -webkit-transition: max-height 1s; transition: max-height 1s;}

.drop-menu { display: none; position: absolute; top:8px; right: 8px; z-index: 290; padding: .75rem .25rem; background: #fff; color: #000; box-shadow: 0 0 10px rgba(0,0,0,.5); font-size: .8rem; line-height: 1; border-radius: 5px; scrollbar-width: thin}
.drop-menu.open { display: inline-block}
.drop-menu.closed { display: none}
.drop-menu .sect { padding: .5rem 0; margin: 0; border-bottom: 1px solid #ccc}
.drop-menu .sect:first-child { padding-top: 0}
.drop-menu .sect:last-child { border-bottom: 0; padding-bottom: 0}
.drop-menu a { display: flex; padding:.55rem .5rem .55rem .35rem}
.drop-menu a.active { color: #ff1464  }
.drop-menu a i, .def-nav .drop-menu a i { margin: -.2em .5em 0 0; font-size: 1.2em;  width: 1rem; text-align: center}
.drop-menu a i.icon-article, .def-nav .drop-menu a i.icon-article { font-size: 1em; margin-top: 0 }
.drop-menu a i.icon-groups, .def-nav .drop-menu a i.icon-groups { font-size: 1.4em; }
.drop-menu a i.icon-check, .def-nav .drop-menu a i.icon-check { margin: auto 0; font-size: .5em; }
.drop-menu a i.icon-playlist-thin, .def-nav .drop-menu a i.icon-playlist-thin { margin: 0 .5em 0 0; font-size: 1em; }
.drop-menu a span { padding: 0 0 0 1rem;  white-space: nowrap; font-size: .9rem; line-height: 1;}
.drop-menu a i+span { padding: 0; }

.sticky-container { overflow: visible; position: relative; /*fallback for old browsers*/ position: -webkit-sticky;  position: sticky;  top: .5rem;  bottom:7rem; /*could be changed wherever needed*/  width: 0; height: 0px; z-index: 300;}
.drop-menu.sticky {  position: absolute; top:0; right: 0}

.drop-wrap { position: relative }
.drop-menu.right {  position: absolute; top:-.2rem; right: 1.5rem}

.baloon { position: relative; display: inline-block; padding: .1rem .25rem .0rem; margin: 0 0 0 .5rem; font-size: .8em; line-height: 1.4;  vertical-align: middle; border: 1px solid #7c7c7c; border-radius: 3px; background: #fff}
.baloon:before, .baloon:after {content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-color: transparent; border-left: 0;}
.baloon:before { top: 50%; left: -6px; margin-top: -6px; border-right-color: #7c7c7c; border-width: 6px;}
.baloon:after { top: 50%; left: -4px; margin-top: -5px; border-right-color: #fff; border-width: 5px;}

.alert-bg { position: fixed; z-index: 1000; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0,0,0,0.5); }
.alert { position: fixed; top: 20%; left: 50%; margin-left: -110px; width: 200px; height: 200px; background-image: url(''); background-size: cover; text-align: center; padding: 100px 10px 10px 10px; }
.alert-cont { position: relative; box-sizing: border-box; width: 100%; height: 100%; padding: 90px 8px 15px ;text-align: center }
.alert-cont span { cursor: pointer}

.alert .icon-crtg.bgr { position: fixed;  left: 50%; font-size: 200px; margin-left: -100px; }
.alert .icon-crtg.bgr > i { font-size: 47px; margin-left: -30px;}

.title-cont { padding: 0 16px 1rem; }
.title-cont:after { content: ''; display: block; clear: both;  }
.main-native > .title-cont { padding: 2rem 16px 0; }
.title-cont > h2 { margin-bottom: .5rem }

.video-list-msg { padding: 2rem 1rem; text-align: center; font: normal 1.4rem/1.4 Roboto-Regular, non-serif}

/* kambana */
.onesignal-bell-launcher-button svg { display: none !important }
#onesignal-bell-container.onesignal-reset .onesignal-bell-launcher.onesignal-bell-launcher-bottom-right.onesignal-bell-launcher-sm { width: 44px !important; background: url('https://i49.vbox7.com/design/icons/btn-notification.svg') center no-repeat !important;  }
#onesignal-bell-container.onesignal-reset .onesignal-bell-launcher.onesignal-bell-launcher-sm { height: 45px !important; }

/* loader */
.moreLoadingBox {display: none; position: fixed; bottom: 10px; height: 45px;  width: 100%; max-width:680px; margin-left: auto!important; margin-right: auto!important; z-index: 1500}
.circular { animation: rotate 2s linear infinite; height: 100%; transform-origin: center center; width: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
.moreLoadingBox .path { stroke-dasharray: 1,200; stroke-dashoffset: 0; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; stroke: #ff1464; }
@keyframes rotate{ 100%{ transform: rotate(360deg); } }
@keyframes dash{ 0%{ stroke-dasharray: 1,200; stroke-dashoffset: 0; } 50%{ stroke-dasharray: 89,200; stroke-dashoffset: -35px; } 100%{ stroke-dasharray: 89,200; stroke-dashoffset: -124px; } }

.moreLoadingBox-small {display: none; position: absolute; top: 230px; height: 45px;  width: 100%; max-width:680px; margin-left: auto!important; margin-right: auto!important; z-index: 1500}
.moreLoadingBox-small .path { stroke-dasharray: 1,200; stroke-dashoffset: 0; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; stroke: #ff1464; }
/* overlay app banner */
.app-banner-cherga { display: none; position: fixed; max-width:680px; margin-left: auto!important; margin-right: auto!important; top: 0; right: 0; bottom: 0; left: 0; z-index: 2147483001; background: url('https://i49.vbox7.com/design/mobile3/app-banr-480x800px.png') center/cover no-repeat ; }
.app-banner-close { cursor: pointer; position: absolute; right: 0px; top: 0px; width: 30px; height: 20px; margin:0; padding: 15px; color: #b60f64; text-align: center; font-size: 20px;background-image: none;  }

.app-banner-cherga.ios { background: url('https://i49.vbox7.com/design/mobile3/ios_portrait_back.jpg') center/cover no-repeat; }
.app-banner-cherga.android { background: url('https://i49.vbox7.com/design/mobile3/gplay_portrait_back.jpg') center/cover no-repeat; }
.app-banner-txt { width: 270px; height: 57px; margin: 10% auto 0; background: url('https://i49.vbox7.com/design/mobile3/txt.jpg') center/contain no-repeat; }
.app-banner-store {  position: absolute; bottom: 15px; left: 0; right: 0; width: 320px; height: 46px; margin: auto; padding: 0px; cursor: pointer; }
.android .app-banner-store{ background: url('//i49.vbox7.com/design/mobile3/gplay_btn.jpg') center/contain no-repeat; }
.ios .app-banner-store { margin-top: calc(100vh - 200px);  background: url('//i49.vbox7.com/design/mobile3/appstore_btn.jpg') center/contain no-repeat; }

.overlay-cherga { position: fixed; max-width:680px; margin-left: auto!important; margin-right: auto!important; top: 0; right: 0; bottom: 0; left: 0; z-index: 5000; }
.overlay-close { cursor: pointer; position: absolute; z-index: 5010; right: 0px; top: 0px; width: 30px; height: 20px; margin:0; padding: 15px; color: #b60f64; text-align: center; font-size: 20px;background-image: none;  }


.foll-wr { display: inline-flex; white-space: nowrap; text-transform: uppercase; font: normal .8rem Roboto-Medium, sans-serif}
.foll-wr .foll-txt { color: #ed0f64; font:inherit; padding: 0; margin: auto .3rem auto 0}
.foll-wr i { margin: auto .2rem auto 0; color: #ed0f64;}
.foll-wr i.icon-check {margin: auto .2rem auto 0; font-size: .8em; color: #707070}
.foll-wr .num { margin: auto 0 auto .2rem; color: #707070; font:inherit }
.foll-wr.followed .foll-txt,
.foll-wr.unsubscribe .foll-txt{ margin: auto 0; color: #707070; }
.foll-wr.followed .num,
.foll-wr.unsubscribe .num { display: none}

/* == CARDS == */

.card {}
.thumb-cont { display: block; position: relative; height: 0; padding-bottom: 56.25%; text-decoration: none; font-size: 0; }
.thumb-cont img { position: absolute; width: 100%; width: 100%; height: 100%; left: 0; top: 0; object-fit: cover; object-position: top }
.thumb-cont .dur { display: block; position: absolute; z-index: 100; bottom: .1rem; right: .25rem;  padding: 2px 3px; font-size: .7rem; background: #000; color: #fff; opacity: .7; }
.thumb-cont .subs { display: block; position: absolute; z-index: 100; bottom: .1rem; left: .25rem;  padding: 2px 3px; font-size: .7rem; background: #000; color: #fff; opacity: .7; text-transform: uppercase}
.thumb-cont .watch-later { display: flex; position: absolute; z-index: 100; top: .5rem; right: .5rem; width: 2.2rem; height: 2.2rem; padding: 0; font-size: 1rem; border-radius: 50%; background: rgba(0,0,0,.7); color: #fff; }
.watch-later .icon-watch-simp { width: 1.3rem; margin: auto; font-size: 2rem; }
.watch-later .icon-check { display: none; margin: auto; font-size: .9rem;}
.watch-later.added .icon-watch-simp { display: none; }
.watch-later.added .icon-check { display: block; }
.thumb-cont .item-notf { display: block; position: absolute; z-index: 100; bottom: 0; right: 0; width: 1.7rem; height: 1.6rem; border-radius: 3px 3px 0 0; font: normal .75rem/2.4 Roboto-Regular, sans-serif; text-align: center; background: #19191b; color: #fff; }
.top-pos { display: block; position: absolute; z-index: 100; top: 0; left: 0;   text-align: center; border-radius: 0 0 3px 0; background: #ff1464; color: #fff; }

.info-cont { position: relative}
.label { margin: 0 0 -.3rem; padding: 1rem 0 0; }
.info-cont h3 { margin: 0; padding: 0; }
.info-cont h3 a { display: inline-block; padding: .8rem 0 .2rem; }
.info-cont .icon-star-stroke,
.info-cont .icon-star-filled { font-size: .9rem; padding-right: .3rem; cursor:pointer }
.info-cont .icon-barcode { font-size: .9rem; margin-left: .5rem }
.info-cont .stats { margin: 0; padding: 0; font-size: .8rem; }
.info-cont i.icon-eye { font-size: .7rem}
.info-cont .channel-name { display: flex; margin: 0; padding: 0; justify-content: space-between }
.info-cont .channel-name a { display: inline-flex; }
.info-cont .channel-name .avatar-simp { margin: auto .5rem auto 0; }
.info-cont .foll-wr { padding: .6rem 0 }

.card.playlist-cell .playlist-add, .group-add { display: flex; position: absolute; right: 0; top: 0; bottom: 0; overflow: hidden; background: rgba(0,0,0,0.8); color: #fff; text-align: center; min-width: 3rem; font-size: 1.2rem;}
.playlist-add span, .group-add span { display: block;  margin: auto;}
.playlist-add span i, .group-add span i { display: block; margin: .2rem 0 0;}

.channel-card {}

/* Custom Cards */
.poster-cell { position: relative; text-align: center; border-radius: 7px; overflow: hidden; }
.poster-cell .thumb-cont { width: 100%; padding-bottom: 0; }
.poster-cell .info-cont { padding: 0 }
.poster-cell h3 { text-transform: uppercase; }

.card.sequel-cell { position: relative; padding: 0; margin: 0 8px 0 0; border-radius: 7px; overflow: hidden}
.card.sequel-cell a { display: block; width: 100%; height: 100%; text-decoration: none;}
.card.sequel-cell img { height: 100%; width:100%; object-fit:cover; object-position: 50% 50%}
.card.sequel-cell h2 { position: absolute; bottom: 0; width: 100%; min-height: 2.5rem; max-height: 4.65rem; padding: 1.25rem .6rem .5rem!important; margin: 0!important; font-size: .8rem; line-height: 1.4; box-sizing: border-box; background: linear-gradient(transparent, rgba(0,0,0,0.95)); color: #fff; text-align: left; text-transform: uppercase}

.card.channel-slide { display: flex; margin: 0; padding: 0;}
.slider-wrap-mb.channels > .slider-content-mb a { position: relative; padding: 0 .25rem;  text-align: center;}
.card.channel-slide .avatar-cont { margin: auto;}
.card.channel-slide .dot { display: none; position: absolute; top: 0; border: 3px solid #fff }
.card.channel-slide h4 { width: 100%; overflow: hidden; color: #000; white-space: nowrap;}

/* == END OF CARDS == */

/* Horizontal lists */





.maraton-kare {margin: 28px 0 2.5rem; padding-bottom: .5rem; border:1px solid transparent; border-width: 1px 0; color: #fff; background: #000 url(https://i49.vbox7.com//design/contests/maraton/kare_mob_bg.jpg) no-repeat right/cover;}

.maraton-kare .head { display: block; margin:1rem 8px 0 15px; font: normal 1rem Century, Roboto, non-serif; }
.maraton-kare a { text-decoration: none; }
.maraton-kare .head h2 { display: block; margin: 0 0 .25rem; width: 230px; height: 32px;  text-indent: -99999px; overflow: hidden; background:  url(https://i49.vbox7.com/design/contests/maraton/logo.png) no-repeat left top/contain; }
.maraton-kare .head h3 {  margin:0 0 0 5px;font: normal .7rem Century, Roboto, non-serif;}

.see-all-maraton { margin: 10px 8px 0 0; flex: 0 0 auto; border-radius:4px; overflow: hidden; white-space: nowrap;}
.see-all-maraton:hover { background: linear-gradient(90deg, #b90796 , #1e94c5);}
.see-all-maraton span { display: block; padding: 2px .7rem 0; font: normal .7rem/2 Roboto-Regular, sans-serif; text-transform: uppercase; border:2px solid; /*border-radius:6px;*/ border-image: linear-gradient(90deg, #b90796 , #1e94c5) 2;}

.maraton-slide {width: 100%; overflow: auto; }

.maraton-slide .arrow-cont {width: 1.3rem; height: /*12.2rem*/ 100%; display: flex; position: absolute; right: 0; top:0; background: linear-gradient(to right, transparent, rgba(0,0,0,.75)); color: #fff }
.maraton-slide .arrow-cont i { font-weight: bold; font-size: 1.2rem; margin: auto}


/* END OF Horizontal list */


/* Pagination   */

.paginationNew { grid-column: 1 / -1;}
.paginationInfo { display: none}
.pagination { display: flex; max-width: 95%; margin: auto; padding: 0;  justify-content: center; font: bold 1rem/2.5 Roboto-Regular, sans-serif}
.page-item { display: block; list-style: none; margin: 0 .3rem; flex: 0 1 2rem; text-align: center }
.page-item .page-link { display: inline-block; box-sizing: border-box; padding: 0}
.page-link[aria-label] { width: 2.5rem; height: 2.5rem; padding: 0; margin: 0 1rem; border-radius: 50%; background: #ececec; text-align: center; font-size: 0}
.page-link[aria-label]:after { display: inline-block; margin: auto; font-size: 1rem; font-family: 'n-icons' !important }
.page-link[aria-label="« Previous"]:after { content: "\e930"; }
.page-link[aria-label="Next »"]:after { content: "\e931"; }
.page-item .page-link:hover { text-decoration: none; }
.page-item.disabled { opacity: 1}
.page-item.disabled[aria-label] { display: none}
.page-item.active { border-bottom: 2px solid #ff1464}



/* END OF Pagination */



/* PLAYLIST list styles */
.playlist-wrap { position: fixed; left: 0; right: 0; width:100%; max-width:680px; margin-left: auto!important; margin-right: auto!important; z-index: 999; background: #2b2b2b; color: #7c7c7c; transition: none!important;  }
.playlist-wrap.open-toggle { top:calc( 48px + 100vw*9/16 ); max-height: calc( 100vh - 48px - 100vw*9/16)!important; }
.fasha-fix .playlist-wrap.open-toggle { top:calc( 129px + 100vw*9/16 ); max-height: calc( 100vh - 129px - 100vw*9/16)!important; }
.playlist-wrap.collapsed-toggle { top:auto; bottom: 0; max-height: 2.8rem; }
.playlist-wrap.open-toggle .playlist-list { color: #fff; position: relative  }
.list-item.landsc-cell .icon-x-search { position: absolute; top: 10px; right: 5px; font-size: .85rem;  border-radius: 50%; color: #7c7c7c; cursor: pointer }
.playlist-list { padding: 0 0 1rem 0}
.playlist-list .list-item.landsc-cell { position: relative; width: 100%; box-sizing: border-box; height: auto; margin: 0; padding: 0 8px }

.list-item.landsc-cell a { display: flex; width: 100%; height: 4rem; padding: 1rem 0; margin: 0 }
.crnt-item { min-width: 1.55rem; text-align: left; font: normal .8rem/4rem Roboto-Regular, sans-serif;  }
.crnt-item .item-num { display: inline-block; }
.crnt-item i { display: none; margin-left: 5px; font-size: .6rem; }
.active .item-num { display: none; }
.active .crnt-item i { display: inline-block; }
.list-item.landsc-cell .thumb-cont { flex: 0 0 7.1rem; height: 100%; padding-bottom: 0;}
.list-item.landsc-cell h3 { margin: .25rem 0 .25rem .5rem; padding: 0 0 0 .7rem!important; font: normal .9rem/1.3 Roboto-Regular, sans-serif!important;overflow: hidden; }
.list-item.active h3 { color: #7c7c7c!important;  }
.list-item.active .thumb-cont img { opacity: 0.6!important }

.playlist-nav {display: flex; height:3rem;  margin: 0rem 16px 1rem; color: #7c7c7c; -webkit-justify-content: space-between; justify-content: space-between; border-bottom: 1px solid #3a3a3a!important; border-width: 0 0 1px}
.playlist-nav > * { flex-grow: 1!important; }
.playlist-nav > .left-col,
.playlist-nav > .right-col { display: flex }
.playlist-nav > .left-col {  justify-content: flex-start; flex-grow: .5; text-align: left}
.playlist-nav > .right-col {  justify-content: flex-end; flex-grow: .5; text-align: right}
.playlist-nav a { display: flex ; min-width: 3rem; }
.playlist-nav i { margin: auto 0; font-size: 1.2rem; }
.playlist-nav > .right-col > a { text-align: right }
.playlist-nav .on i { color: #ff1464 }

.collapsed-toggle .playlist-head.title-row { height: 42px; padding: 14px 16px; box-sizing: border-box;}
.collapsed-toggle .playlist-head .stat-num,
.collapsed-toggle .playlist-head .channel { display: none; }
.collapsed-toggle .playlist-head .icon-playlist { margin-top: .1rem}
.collapsed-toggle .playlist-head h1 { white-space: nowrap; text-overflow: ellipsis; max-width: 85%; overflow: hidden; }

.playlist-head.title-row { display: flex; padding: 1.2rem 16px 0rem; }
.playlist-head .stat-col { justify-content: flex-start; width: 2.5rem; font: normal .6rem Roboto-Regular, sans-serif; }
.playlist-head .stat-col p { padding: 0 0 .75rem; margin: 0}
.playlist-head .stat-col i { font-size: .8rem}
.playlist-head .stat-col .current-vid,
.playlist-head .channel span { color: #fff }
.playlist-head .title-col { flex: 1; max-width: 90% }
.playlist-head h1 { padding: 0!important; margin: 0!important; font: normal 1.15rem/1 Roboto-Regular, sans-serif; color: #fff}
.playlist-head h1.toggle-trigger { float: none; display: block; font: normal 1.15rem/1 Roboto-Regular, sans-serif; color: #fff}
.playlist-head .channel { padding: 0; margin: 0}


/* END OF PLAYLIST styles*/

/* COMMENTS */

.comments { margin: 1rem 16px 1rem; background: #fff; color: #000; /*border-top: 1px solid #c7c7c7*/ }
.play-pg .comments,
.item-pg .comments { min-height: 0}
.comments .comments-title { text-align: center }
.comments-title .comments-num { color: #7c7c7c}
.comments-title h3 { padding: 0 1.5rem }
.comments-title .drop-wrap { margin-left: -1.5rem }
.sect + .comments { margin-top: -1px;}

.main-comment-cont { border-bottom: 1px solid #ccc }
.main-comment-cont textarea, .comment-first-btn { display: block; width: 100%; max-height: 30px; box-sizing: border-box; padding: .3rem .5rem .3rem 0; border: 0; outline: none; font: normal 1rem Roboto-Regular, sans-serif; color: #7c7c7c; }
.main-comment-cont textarea { width: 100%; padding-left: 40px; box-sizing: border-box}
.main-comment-cont textarea::placeholder  { color: #7c7c7c; }
/*.main-comment-cont .send-comment-btn { text-align: right; padding: .5rem}*/
.comment-first-btn .comments-btn { margin: 0 0 -.2rem;}
.comment-btn, .comment-login-btn { display: inline-block; margin: 0 0 -.2rem .8rem; text-transform: uppercase; color: #459eed; cursor: pointer}

.comments-cont { padding-top: 1.5rem; }
.item-comment .avatar-cont { max-width: 29px; margin-right: .75rem; margin-top: -.2rem}
.item-comment { padding: .5rem 0 2.2rem}
.item-comment.subcomment { padding: 2rem 0 .5rem}
.comment-info p { padding: 0 0 .5rem; margin: 0}
.comment-author, p.comment-author { padding: 0; font: bold .9rem Roboto-Regular, sans-serif;}
.comment-date { font: normal .7rem Roboto-Regular, sans-serif; color: #7c7c7c}
.comment-text { padding:0 ; margin: .3rem 0 .8rem 40px; ; font: normal .9rem Roboto-Regular, sans-serif;  }
.comment-opt { margin-left: 40px; color: #7c7c7c; font: normal .9rem Roboto-Regular, sans-serif; }
.comment-opt .vote-up, .comment-opt .vote-down { margin-right: 1.25rem }
.comment-opt .vote-up i, .comment-opt .vote-down i { font-size: 1rem; margin-right: .25rem }
.comment-opt .vote-up.voted, .comment-opt .vote-down.voted { margin-right: .25rem }
.comment-opt .rating { font-size: .8rem}
.subcomment { margin-left: 40px}
.subcomment .comment-text, .comment-reply .comment-text, .subcomment .comment-opt { clear: both}



.sect, section.sect { width: auto; color: #000 }
.sect.social { margin: .5rem 16px 0; padding: 0 0 .75rem; border-bottom: 1px solid #e8e8e8; color: #000; font-size: .8rem }
.sect.social h4 { margin: .5rem 0 0; padding: 0 0 .5rem; font-size: .8rem }
.sect.wide { margin: 1rem 8px 0; padding: 0 0 1rem; border-bottom: 1px solid #e8e8e8}
.wide.shrt { margin: 1.5rem 0 0; }

/* END OF COMMENTS */

/* ==   END DEFAULTS AND COMMON ELEMENTS   == */


/* ==   MAIN GRID   == */

html, body { margin: 0; }
.site-container { width: 100%; min-width: 300px; max-width:680px; min-height: 100vh; margin-left: auto!important; margin-right: auto!important; border-top: 1px solid transparent; margin-top: -1px; background: #fff; /*color: #7c7c7c*/ }

header, section { display: block; box-sizing: border-box; width: 100%; clear: both; }
header { padding: 0 16px; line-height: 1; z-index: 200; position: relative; }
header:after, section:after, header:before, section:before { content: ''; display: block; clear: both; }
.top-fix-cont header { display: -ms-grid!important; display: grid!important; }
.logo-cont, h1.logo-cont { margin: 0; font-size: 1.5rem }
.back-cont .icon-back { font-size: 0.75em }
h1.logo-cont, .top-fix-cont nav ul { height: 42px; display: flex; align-items: center;  }
header .left-col { display: flex; height: 42px; flex: auto}
header .right-col  { flex: initial }
header .right-col ul { justify-content: flex-end; }
h1.logo-cont .logo-txt { display: none }

#back-to-top { display: block; position: sticky; z-index: 999; margin: -4.4rem 1rem 0 auto; grid-column:1/-1; bottom:1rem; width: 4.2rem; height: 4.2rem; border-radius: 50%; text-align: center; line-height: 4.4rem; background: rgba(0, 0, 0, .3); color: #fff; font-size: 1rem; text-decoration: none; -webkit-transition: background 1s, z-index 0s .5s; transition: background 1s, z-index 0s 1s;  }
#back-to-top.hid { background: rgba(0, 0, 0, .0); z-index: -1; }
#back-to-top:hover { background: rgba(0, 0, 0, .7) }


.neg-theme, nav.neg-theme { background: #19191b; color: #fff;}
.neg-theme.olive, nav.neg-theme.olive {background: olivedrab!important; /* for laravel dev */}
header.neg-theme { box-shadow: inset 0 -3px 0px #19191b, inset 0 1px 3px #000000; padding-top: 3px}
.sub-nav { position: relative; z-index: 200; width: 100%; max-height: 44px; box-sizing: border-box; padding: 1px 8px 0; margin: 0; overflow-x: scroll;}
.sub-nav a { display: flex; position: relative; text-transform: uppercase; white-space: nowrap; border-bottom: 2px solid transparent; }
.sub-nav a.active { border-bottom: 2px solid #E82164; color: inherit }
.sub-nav .dot { display: none; width: .35em; height: .35em; position: absolute; right: 0; top:.4rem; }

.section-container:before,
.section-container:after { content: ''; display: block; clear:both}

.top-fix-cont { max-width:680px; width: 100%; z-index: 200; }
.top-fix-cont button { background: transparent; border: none; outline: none; padding-left: 0; padding-right: 0}
.site-container .top-fix-cont .player { display: none}
.site-container.play-pg .top-fix-cont .player { display: block}

.content { margin-top: 40px; margin-top: 0!important;}

.feed{ padding: 1.1rem 0 0; }
.chart, .inner-pg { padding: 0; }
.feed.searchPage  { padding: 1.5rem 0 0; }
.more-related-videos {display: none}

.play-pg .related-content.feed { padding-top: .5rem; }

/* ajax items main element visibility */
.main-ajx { display: none}
.main-native {display: flex}
.main-native,
.main-ajx {  flex-direction: column; }
.main-native { min-height: calc(100vh - 50px)}
.btm-fix-nav { margin-top: auto}

.site-container.ajx .main-native { position: fixed; max-width:680px; margin-left: auto!important; margin-right: auto!important; display: none}
.site-container.ajx .main-ajx { display: flex}

/* ==   END MAIN GRID   == */


/* == INNER PAGES SPECIFIC STYLES == */


/*- FORMS -|- LOGIN REGISTRATION FORGOTTEN PASS -*/

.form-pg { text-align: center; padding: 2.2rem 0 0}
.form-pg h2 { margin-bottom: 2rem}
.form-pg h3 { margin: 2.2rem 0 1.5rem}
.form-pg .flex-cont.vert { margin-bottom: 1rem;}
.form-pg .btn { display: inline-block; margin: auto; padding: 0 1.5rem; /*min-width: 16rem;*/ height: 2.5rem; line-height: 2.4rem; text-align: center; font-size: 1rem; text-align: center; color: #fff; border-radius: 7px; border: 0;  }
.form-pg .btn i { font-size: 1.3rem; margin: 0 .75rem 0 0; vertical-align: text-bottom }
.form-pg .btn i.icon-gglplus { font-size: 1.1rem; margin: 0 .5rem 0 0;}
.fb.btn { background: #3b5999}
.ggl-plus.btn { background: #dd4a38}
.subm.btn { background: #ff1464}


.field-wrap { width:100%; box-sizing: border-box; padding: 2.5rem 16px 1rem;   }
.field-wrap.centered { text-align: center; }
.field-wrap.centered > div { display: inline-block; margin: auto;  }
.field-wrap.check-list { padding-bottom: .75rem;}
.field-wrap.check-list + .field-wrap.check-list  { padding: .7rem 16px .8rem;}
.field-wrap + h2,
.field-wrap + h3 { padding-top: 2.5rem}
h2 + .field-wrap,
h3 + .field-wrap { padding-top: 0}
.field-wrap h3 { margin: 0 0 1rem; }
.field-wrap.left,
.field-wrap.check-list { float: none; text-align: left   }
.field-wrap .icon-edit { float:left; width: 1rem; vertical-align: top; margin: .8rem -1rem 0 0; font-size: .8rem; color: #c7c7c7}
.field-wrap input[type=text],
.field-wrap input[type=email],
.field-wrap input[type=password],
.field-wrap textarea { width: 100%; box-sizing: border-box; padding: .6rem .5rem .6rem 1rem; text-align: center; border: 1px solid #c7c7c7; border-width: 0px 0px 1px; outline: 0; font:normal 1.1rem/1.3 Roboto-Regular; caret-color: #ff1464 }
.field-wrap textarea { text-align: left; background: #ececec }
.field-wrap label {display: block}
.field-wrap label,
.field-wrap input::placeholder,
.field-wrap textarea::placeholder   { color: #000;}
.field-wrap input:focus::placeholder,
.field-wrap textarea:focus::placeholder   {/* color: #fff;*/}


.field-wrap textarea:focus ~ .icon-edit,
.field-wrap input[type=text]:focus ~ .icon-edit { color: #fff!important; display: none}
.field-wrap.field-err input { border-color: #ff1464; color: #ff1464 }
.field-wrap.field-valid input { border-color: #00d04c; color: #00d04c }
.field-err > .select-wrap .current-selected-item,
.field-err.select-wrap .current-selected-item { border-color: #ff1464;  }
.field-err > .select-wrap .current-selected-item i,
.field-err.select-wrap .current-selected-item i { /* color: #ff1464 */ }
.note { text-align: left; font-size: .9rem; margin: 1.2rem 0 0; color: #7c7c7c }
.note.err { color:#ff1464; }
.note.valid { color: #00d04c }
.field-wrap + .note { margin: 0 0 1rem; padding: 0 16px}
.field-wrap .note.err { display: none; }
.field-wrap.field-err .note.err,
.field-wrap.field-err + .note.err { display: block}
.field-wrap.check-list .icon-checkbx { width: 2rem; margin-right: 0 }
.field-wrap.check-list .note { padding-left: 2rem}
.field-wrap a {font-weight: bold}

.field-wrap i.icon-checkbx > .tick,
.field-wrap input[type=checkbox] { display: none;}
input[type=checkbox] + label { line-height: 1.2; color: #000}
.field-wrap label i { margin-right: .5rem; font-size: 1.15em; vertical-align: top}
input[type=checkbox]:checked + label i.icon-checkbx > .tick { display: inline-block}
input[type=checkbox]:disabled + label { opacity: .5}

input[type=radio] { display: none}
input[type=radio]:checked + label i.icon-checkbx > .tick { display: inherit}
input[type=radio]:disabled + label { opacity: .5}


.select-wrap { position: relative; color: #000;}
.multiple-opt .opt-trgr { margin: 0; padding: .5rem 1.3em .5rem .5em; font-size: .55em;  color: #7c7c7c; border-bottom: 1px solid #c7c7c7;  }
.field-err .multiple-opt .opt-trgr { border-color: #ff1464; color: #ff1464 }

.current-selected-item, p.current-selected-item { border-bottom: 1px solid #c7c7c7; padding: 0; margin: 0}
.current-selected-item span { display: inline-block; box-sizing: border-box; width: 100%; padding: .5rem 1.3em .5rem .5em; text-align: center; white-space: nowrap; }
.current-selected-item .icon-open,
.current-selected-item .icon-closed { display: inline-block; font-size: .55em; width: 1rem; margin: 0 0 0 -1.2rem; color: #7c7c7c; }
.select-wrap .icon-open { display: none}
.open .icon-closed { display: none;}
.open .icon-open { display: inline-block}

.select-wrap.open { overflow: visible }
.options-list,
.multiple-list { /*position: absolute; z-index: 2;*/ display: none; width: 100%; margin: 0; padding: 0; list-style: none; text-align: left; background: #fff; box-shadow: 0 0 .1rem rgba(0,0,0,.35) }
.options-list li { padding: .5rem .5rem .5rem 1.3rem }
.multiple-list li { padding: 0}
.multiple-list li > label { display: block; padding: .5rem}
.options-list li:hover,
.multiple-list li:hover { background: #d7d7d7; color: #000 }
.open .options-list { display: block}
.open .multiple-list { /* fallback */ display: flex; display:grid; grid-template-columns: repeat(auto-fill,minmax(11.5rem, 1fr)); -ms-grid-columns: repeat(auto-fill,minmax(11.5rem, 1fr)) }

.multiple-list {  flex-wrap: wrap; }
.multiple-list li { white-space: nowrap; flex: 0 1 10rem }

.grid-options { display: grid; grid-template-columns:  repeat( auto-fill, minmax(250px, 1fr) ); grid-gap:1rem; text-align: left}
.grid-options > h2 { grid-column: 1 / -1; text-align: center}

.select-mob select { width: 100%; box-sizing: border-box; position: relative; z-index: 1; margin-right: -1.3rem; padding: .5rem 2em .5rem .5em; text-align: center; text-align-last:center;  font: normal 16px Roboto-Regular, sans-serif; white-space: nowrap; outline: 0; border: 0; border-bottom: 1px solid #c7c7c7; background: transparent; -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */ appearance:none; }
.select-mob .icon-open,
.select-mob .icon-closed { font-size: .55em; width: 1rem; margin: 0; color: #7c7c7c; }
select ~ .icon-open { display: none}
select:focus ~ .icon-closed { display: none;}
select:focus ~ .icon-open { display: inline-block}
.select-mob.field-err select { border-color: #ff1464;}

.captcha .icon-reload {font-size: 1.5rem; }

input[type=submit] { min-width: 12rem}

.multiple-list-stat { /* fallback */ display: flex; flex-wrap: wrap; display:grid; grid-template-columns: repeat(auto-fill,minmax(11.5rem, 1fr)); -ms-grid-columns: repeat(auto-fill,minmax(11.5rem, 1fr)); width: 100%; margin: 1.2rem 0; padding: 0; list-style: none; text-align: left;  }
.multiple-list-stat li { padding: 0; white-space: nowrap; flex: 0 1 10rem }
.multiple-list-stat li > label { display: block; padding: .5rem}
.multiple-list li:hover { background: #d7d7d7; color: #000 }

.note-success-green { margin: 2rem 0 3rem; color: #24b701; font-weight: bold }
.note-error-red { margin: 1.5rem 0 ; color: #fb1a22; font-weight: bold }

/*- END OF FORMS -*/
.login-links, .contact-info { margin: 2.5rem 0 0; padding: .5rem 16px 1.5rem; background: #e8e8e8; text-align: left }
.login-links p, .contact-info p { margin: .8rem 0 }
.login-links a, .contact-info a { color: #000}
.login-links .note, .contact-info .note { margin-bottom: 2rem}
.contact-info h2 {}
.contact-info h3 { font-weight: bold; margin-bottom: .75rem; }
.contact-info p { margin: 0 0 1.5rem; }
.contact-info p a { font-weight: normal; color: #ff1464; }

/*- END OF LOGIN REGISTRATION FORGOTTEN PASS -*/

/* SEARCH page elements */

.search-wrap { position:relative; z-index: 150; flex: 0 0 auto; margin: 0; padding: 1.5rem 16px ; overflow: visible; background: #fff }
.search-wrap form { width: 100%; border-width: 0 0 2px 0; border-bottom: 1px solid #999; font-size:1.15rem;}
.def-search-cont { height: 42px; text-align: center; line-height: 42px;  margin-bottom: -42px; }
.search-wrap input { flex:auto; box-sizing: border-box; padding: 0 .2rem; border: 0; height: 42px; line-height: 42px; font-size:1.1rem; caret-color: #ff1464}

.search .clear-srch { display: none; flex: initial!important; margin: auto; padding: .5rem ;  color: #7c7c7c; font-size: .9em;  }
.search .srch-opt { flex: initial!important; margin: auto; padding: .5rem 0 .5rem .9rem; font-size: .8em}

.search input:valid ~ .clear-srch { display: block; }
.search input[value='']  ~ .srch-opt { display: none; }
.search-cont input.typing ~ .clear-srch { display: block; }

.autocomplete-ovrlay {display: none; position: fixed; max-width:680px; margin-left: auto!important; margin-right: auto!important; z-index: 100; top: 0; bottom: 0; right: 0; left: 0;  background: rgba(0,0,0,0.5);}
.autocomplete-res-container { display: none; margin-right: 0; position: absolute; z-index: 200; top: 67px; right: 0; left: 0;  text-align: left }
.autocomplete-res { cursor: pointer; font-size: 1rem; text-decoration: none; display: block; padding: 10px 10px 10px 20px; background: #fff;}
.autocomplete-res:first-of-type { padding-top: 20px }
.autocomplete-res:last-of-type { padding-bottom: 20px }

.search-panel {	display: none; }

.feed.searchPage .subscr-btn { display: none}

/* END OF SEARCH page elements */

.watch-later-opt { flex: initial!important; margin: auto; float: right;}

/*--  ITEM Page  --*/

.item-pg  { color: #000}
.item-content a {font-weight: bold; }
.item-content .native a { font-weight: normal; }
.item-content .native  { margin: .5rem 16px 1.85rem; }
.item-pg .det-info.collapsed-toggle {display: block; max-height: none}
.title-row h2:empty {display: none}

.opt.flex-cont { margin: 1rem 0; color: #7c7c7c }
.opt.flex-cont > a,
.opt.flex-cont > span  { margin: auto; text-align: center}
.opt i { margin-right: .4rem}
.opt span { font: normal .9rem/29px Roboto-Regular, sans-serif; }
.opt.flex-cont > a:first-child { text-align: left; flex-grow: .5}
.opt.flex-cont > a:last-child,
.opt.flex-cont > div:last-child { text-align: right; flex-grow: .5}
.opt.flex-cont > a:last-child i,
.opt.flex-cont > div:last-child > a i { margin: auto 0}


.art-opt.flex-cont > * { margin: 0 .4rem 0 0; border-radius: 3px; background: #7c7c7c; background: #000; color: #fff; text-align: center }
.art-opt.flex-cont > *:last-child { margin-right: 0}
.art-opt.flex-cont > a:first-child,
.art-opt.flex-cont > a:last-child,
.art-opt.flex-cont > div:last-child { flex-grow: .75}

.art-opt.flex-cont .play-vote { background: linear-gradient(to right, #ff1464, #ff01d2); }
.art-opt.flex-cont .play-vote.voted { background: #24b701; color: #fff }
.art-opt.flex-cont .voted.icon-like-fill,
.art-opt.flex-cont .voted .icon-like-fill {color: #fff}
.art-opt.flex-cont .fb-share-button { display: flex; background: #1877f2; flex: .5 1 auto; }
.art-opt.flex-cont .fb-share-button iframe { margin: auto!important; position:static!important }
.art-opt.flex-cont .popup-share i { margin-right: 0; font-size: 1.1em }
.art-opt.flex-cont .comments-btn { background: #000 }

.spread.flex-cont a i { font-size: 1.4em; margin-right: .3rem; vertical-align: bottom; padding-top: 2px;}
.spread.flex-cont a.fb i { font-size: 1.3em; }

.main-pic {width: 100%; }
.article { padding: 0; text-align: left }
/*.article a.channel  { height: 30px; color:#000; font: normal 1.4rem/30px Roboto-Regular, sans-serif }
.article a.channel span { font-size: 1rem;} */
.article .sect:first-of-type { margin-top: .5rem; padding-bottom: .8rem }
h1.article-title,
.quiz h1 { margin-top:0; margin-bottom: .5rem; padding: .75rem 0; font: normal 1.6rem/1.25 Roboto-Regular, sans-serif; }
.article h2,
.quiz h2 { font: normal 1.1rem/1.45rem Roboto-Medium, sans-serif; text-align: left }
.article .video-stat,
.quiz .video-stat { margin-top: .7rem; padding: 0 0 0 .35em; font-size: .8rem; color: #7c7c7c }
.article-content { margin: 0 8px; color: #000; font: normal 1.1rem/1.45 Roboto-Regular, sans-serif; border: 1px solid transparent; border-width: 1px 0; }
.article-content .bannerShow,
.article-content .banner { margin: 1.8rem auto; max-width: 100%; overflow: hidden}
.article-content a, .article-content p a {text-decoration: underline;  text-underline-position: under; }
.article-content a, .article-content p a,
.article-content p strong { margin: auto!important }
.article-content p { margin: 1rem 8px!important;}
.article-content h2,
.article-content h3 { margin: 1.75rem 8px 1rem !important;}
.article-content h2 { font: normal 1.35rem/1.65rem Roboto-Regular, sans-serif; text-align: left }
.article-content p:first-child { margin-top: 1rem!important}
.article-content p > * { margin-left: -8px!important; margin-right: -8px!important; max-width: calc( 100% + 16px ) }
.article-content p:empty { display: none}
.article-content img { min-height: 0!important; max-width: calc( 100% + 16px )!important; /*width: calc( 100% + 16px )!important; */ }
figure.image { margin: 1.5rem 0}
figure.image img { min-height: 0!important; max-width: calc( 100% + 16px )!important; width:100%!important; }
figcaption { margin: .5rem 8px; font-size:.9rem; font-style: italic; color: #7c7c7c}
.embed-cont > iframe { width: 100%; height: calc(100vw*9/16); max-height: 382px}
.article-content .instagram-media,
.article-content p > iframe { max-width: calc( 100% + 16px )!important; max-width: calc( 100vw - 18px )!important; width: calc( 100% + 16px )!important; min-width: 250px!important;}
.article-content > iframe {max-width:100%!important; min-width: 250px!important;  }
.article-content .twitter-tweet {margin: 1.5rem auto!important}
.embed-cont {  margin-bottom:15px;}
.video-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; overflow: hidden;}
.video-wrapper iframe,
.video-wrapper object,
.video-wrapper embed { position: absolute; bottom: 0px; left: 0; width: 100%; height: 100%;  margin: 0 !important;}

.fig { display: block; clear: both; margin: 1.8rem auto}
.fig > * { max-width: 100%; }
.caption {font: normal 0.86rem Roboto-Regular, sans-serif; color: #7c7c7c; }
.fig + .caption { margin-top: -1.3rem}

body.webview {  float:left }
body.webview .article-content  { margin-left: 0px!important; margin-right: 0px!important; }
body.webview .article-content p > * { margin-left: 0px!important; margin-right: 0px!important; max-width: 100%!important; }
body.webview .article-content img { min-height: 0px!important; max-width: 100%!important; width: 100%!important; }
body.webview figure.image img { min-height: 0px!important; max-width: 100%!important; width:100%!important; }
body.webview .article-content .instagram-media,
body.webview .article-content p > iframe { max-width: 100%!important;  width: calc(100% - 16px)!important; }
body.webview .article-content .instagram-media { min-width: 250px!important; }


/* -- PLAY page elements -- */

.main-video-player { position: fixed; top: 40px; left: 0; right: 0; z-index: 500; }
#html5player { position: absolute; top: 0; left: 0;	width: 100%; height: 100%; }
.main-video-player-frame { max-width: 680px; margin: auto; }
.main-video-player-cont { position: relative; height: 0; padding-bottom: 56.25%; /* 16:9 */ }

.play-pg .sticky-container,
.item-pg .sticky-container { z-index: 150; top: initial; right: 16px}
.title-row, .det-info, .opt, .sect > .flex-cont { padding: 0;}
.det-info { padding: 0 16px; font: normal .9rem Roboto-Regular, sans-serif; color: #7c7c7c}
.play-pg .det-info { padding: 0;}
.title-row .toggle-trigger { display: inline-block; float: right; font-size: .6rem; margin: .25rem 0 0 1.5rem; min-width: 15px; min-height: 15px }
.channel-name {	display: -webkit-flex;  display: flex;}
.channel-name a { display: inline-flex;  margin-right: auto;  white-space: nowrap;}

.channel-name > a span { margin: auto}
.channel-name .foll-wr {
	margin-right: 0!important;
    margin-left: auto;
	text-align: right;
    flex: initial;
}

.main-video { border-top: 1px solid transparent; margin-top: -1px!important;}
.main-video .title-row h1 { margin-top: 0; margin-right: 1.5rem; font: normal 1.15rem Roboto-Regular, sans-serif; }
.video-stat > i:first-child { font-size: .8em; margin-right: .2rem}
.video-stat { margin-top: 1rem}
.video-stat .mid-dot{ margin: 0 .2rem;}
.video-description {margin-bottom: 1.5rem}

.det-info .hor-scroll-wrap { padding: 0 32px 0 0; margin: 0 -16px;}
.det-info .hor-scroll-wrap > * { margin-left: 16px }

.play-pg .opt.flex-cont { margin-bottom: 0 }

/*a.channel { width: auto; display: flex}*/
.channel-name .avatar-cont,
.channel-name .avatar-simp { margin-right: .5rem; }

.play-pg .subscr-btn { text-align: right; flex-grow: .2}

.feed.related-content { margin: 0 0 .4rem}



.opt.right span { padding: 0 .35rem; vertical-align: middle}

.nxt-vid-opt { color: #7c7c7c;}
.nxt-vid-opt:after { content:''; display:block; clear: both}
.nxt-vid-opt .autoplay-btn { vertical-align: middle; margin: 0 0 0 .5rem}

.autoplay-btn { display: inline-block; width: 24px; height: 10px; padding: 1px; border: 1px solid #7c7c7c; border-radius: 10px}
.autoplay-btn .circle { display: inline-block; width: 10px; height: 10px; border-radius: 50%; }
.autoplay-btn.on .circle { float: right; background: #ff1464 }
.autoplay-btn.off .circle { float: left; background: #7c7c7c}

.flex-cont > .play-subscr-btn,
.play-subscr-btn { display: flex; padding: 0 0 0 1rem; flex: initial; font-size: 1.25rem; }
.play-subscr-btn i { margin: auto }
.play-subscr-btn > span { margin-left: .5rem; font-size: .95rem; line-height: 1.9 }
.play-subscr-btn.subscr .icon-notification-ok,
.play-subscr-btn.subscr .icon-notification { display:none;  }
.play-subscr-btn.subscr .icon-subscr { display:inline-block; }

.play-subscr-btn.unsubscr .icon-notification-ok,
.play-subscr-btn.unsubscr .icon-notification { display: inline-block; color: #ff1464;  }
.play-subscr-btn.unsubscr .icon-subscr { display:none; }

.foll-wr.right { text-align: right; flex: initial; }

.converting-head { margin: 100px auto; width: 120px; height: 84px; background: #ffffff url('https://i49.vbox7.com/design/loading.gif') center no-repeat; }
.converting-message { text-align: center; }

/* -- END OF PLAY page elements -- */

/* QUIZZ elements */

.flex-cont.pic-cont { height: 50vw; margin-bottom: -1px; }
.title-row .label + h1 { display: block; margin-top: 0!important; padding-top: 0!important; }
.quiz .title-row .label { padding: .5rem 0 .75rem}
.quiz .det-info { margin-bottom: -1rem}
.quiz-content { padding: 0 16px; font: normal 1.1rem/1.45 Roboto-Regular, sans-serif}
.question { text-align: center; }
.question > input { display: none; }
.question > .label { padding: 1.45rem 0 .8rem; text-transform: none;  font-size: 1.2rem; color: #000}
.question > h3 { margin: 0 0 1.7rem; padding: 0; font: normal 170%/1.1 Roboto-Medium, sans-serif;  }
.question-cont.pic-back { position: relative;  display: flex; margin: 0 0 .5rem; padding: .5rem 1rem; min-height: 10rem; border-radius: 5px; overflow: hidden; background-size: cover; background-position: center; background-repeat: no-repeat;  }
.pic-back h3 {  position: relative; margin: auto; padding: 0; text-align: center; color: #fff; -webkit-text-stroke:4px #000; font-size: 180%; font-weight: bold; line-height: 1.1 }
.pic-back h3:after { content: attr(title); position: absolute; left: 0; top:0; color: #fff; -webkit-text-stroke:0; font-weight: bold; }
.answers-cont { display: flex; flex-wrap: wrap; justify-content: space-between; }
.answers-cont input { display: none; }
.answer { position: relative; background: #e8e8e8; margin: 0 0 .5rem; border-radius: 5px;  }
.answers-cont.box-type .answer { display: flex; flex-direction: column; width: calc(50vw - 20px); max-width:315px;  overflow: hidden; flex: 0 0 auto; }
.answers-cont.line-type .answer { width: 100%; padding: 1rem }
.answer .pic-cont { position: relative; display: flex; flex: 0 0 calc(40vw - 16px); width: 100%; /*max-height:315px;*/ overflow: hidden; text-align: center; font-size: 0; }
.answer .pic-cont img { position: absolute; height: 100%; width: 100%; object-fit: cover; object-position: 50% 50%;}
.answer .pic-cont span {position: relative; margin: auto; font-size: 1.3rem; line-height: 1.1; padding: .5rem .7rem;  }
.answer .answ-mark { display: none; height: 2rem; width: 2rem; position: absolute; top:3px; right:3px; z-index: 1; background: rgba(0,0,0,.6); border-radius: 3px;  }
.answer .answ-mark i { font-size: 1rem; color: #fff; margin: auto }
.answer .answ-mark i.icon-x { display: none!important }

.answer:hover .answ-mark { display: flex}
.answer:hover .answ-mark .icon-check { display: none}

.answer.true .answ-mark { background: green; border: 1px solid rgba(255,255,255,.65) }
.answer.false .answ-mark {  background: red; border: 1px solid rgba(255,255,255,.65) }
.answer.false .answ-mark i.icon-x { display:inline-block!important;   }
.answer.false .answ-mark i.icon-check { display:none!important;   }


.blue-brand,
.wide-wrap.blue-brand {background: #009; }
.pink-brand,
.wide-wrap.pink-brand  {background: pink; }
.red-brand,
.wide-wrap.red-brand {background: red; }
.yellow-brand,
.wide-wrap.yellow-brand {background: yellow; }
.green-brand,
.wide-wrap.green-brand {background: green; }
.orange-brand,
.wide-wrap.orange-brand {background: orange; }

.answer.blue-brand { color: #fff}
.answer.pink-brand { color: #fff}
.answer.red-brand { color: #fff}
.answer.yellow-brand { color: #000}
.answer.green-brand { color: #fff}
.answer.orange-brand { color: #fff}

.answer .caption { box-sizing: content-box; text-align: left; margin: .5rem; font: normal 1rem Roboto-Regular, sans-serif; color: #000 }
.answer .caption:empty { display: none}
.answer .caption span {display: block; margin-bottom: .2rem; font: italic .6em/1.1 Roboto-Regular, sans-serif; color: #7c7c7c}
.answrd label { opacity: .6 }
.answrd input[type=radio]:checked + label { opacity: 1 }
input[type=radio]:checked + label.answer .answ-mark { display: flex;  }
label.answer.true .answ-mark { display: flex!important;  }
input[type=radio]:checked + .answer .answ-mark .icon-check { display: inline-block;  }
label.answer.true .answ-mark .icon-check { display: inline-block!important;  }



/* reset editor styles */
.answer .caption p,
.answer .inpt-row > span * { padding: 0; margin: 0!important;  background: none!important;  }
.answer .caption p { min-height: 1.2rem; box-sizing: border-box; }
.answer .inpt-row { height: 1rem; box-sizing: border-box; padding: .3rem 0 0; /*display: none */}


/* quizz results */
section#quizResult, #quizResult { margin: 1rem 0; padding: 0}
.wide-wrap { padding: 16px; background: linear-gradient(to bottom, #FF1464, #FF00D6) }
.wide-wrap > p { text-align: center; margin-top: 0; padding: .5rem 0; color: #fff}
.quiz-result { position: relative; z-index: 20; padding: .5rem 0 0; background: #fff;  border-radius: 5px; overflow: hidden; font: normal 1.1rem/1.4 Roboto-Regular, Arial, sans-serif}
.blue-brand .quiz-result,
.pink-brand .quiz-result,
.red-brand .quiz-result,
.yellow-brand .quiz-result,
.green-brand .quiz-result,
.orange-brand .quiz-result { border-color: transparent; }
.pic-cont img { max-width: 100%;}
.quiz-result .item-head h1 { font: normal 1.5rem Roboto-Medium, sans-serif;}
.quiz-result .item-head h2 { text-align: left}
.quiz-result .item-head h2:empty { display: none}
.result-content { padding: 0 16px 2rem}
.quiz-result img { max-width: 100%}

.btm-options { padding: .75rem }
.btm-options .flex-cont { width: 100%; }
.btm-options .def-btn { margin: .4rem 0; height: 3rem; border-radius: 2px; text-align: center!important; font: normal .9em/3rem Roboto-Regular, sans-serif; background: #0758FC }
.btm-options .def-btn i { margin-right: .5rem; vertical-align: middle }
.btm-options .def-btn.fb-share-btn { background: #1877f2; font-weight: normal}
.btm-options .def-btn.fb-share-btn i { font-size: 1.35em}
.btm-options .def-btn.fb-share-btn > * { margin: auto!important}

.wide-wrap .simple-btn { display: block; color: #fff; font: normal .9em /1.5 Roboto-Regular, sans-serif; padding: 1.5rem 0 .5rem; margin-bottom: 0 }
.yellow-brand.wide-wrap .simple-btn,
.yellow-brand.wide-wrap > p { color: #000;}
.wide-wrap .simple-btn .icon-reload {font-size: 1.3rem; margin-right: .65rem; vertical-align: middle  }

/* quizz admin */
.common-box { border:1px solid #fff; }

/* END OF QUIZZ elements */

/* == ERROR page == */

.error-page-wrap { display: flex; flex-direction: column; flex:1 0 auto; width: 100%; min-height: 60vh; box-sizing: border-box; padding: 1.5rem 2rem 7rem}
.error-page-wrap img { margin: auto; }

/* == END OF ERROR page elements == */



/* == USER page elements == */

.user-header { position: relative; margin: 0px 0 .5rem; padding: 0; height: 0; }
.scrld-base { z-index: 300; position: fixed; max-width:680px; margin-left: auto!important; margin-right: auto!important; top:0; width: 100%; height: 45px; overflow: hidden; background-color: #000  }
.scrld-base > div { position: absolute; top:-10px; box-sizing: content-box; width: 100%; height: 62px; padding: 0 20px; margin: 0 -20px; background: center -5px / auto 150px  no-repeat; -webkit-filter: blur(5px);  filter: blur(5px); }
.user-header .top-fix-cont { position: fixed; z-index: 500; display: flex; justify-content: space-between; padding: 3px 16px 3px 0; box-sizing:border-box; background:rgba(0,0,0, .35); background-size: cover; color: #fff}
.user-header .top-fix-cont h2 { color: #fff; white-space: nowrap; margin: auto 0 auto .2rem; overflow: hidden; text-overflow: ellipsis; font-size: 1rem}
.user-header .top-fix-cont .left-col,
.user-header .top-fix-cont .right-col { display: flex; color: #fff;  }
.user-header .top-fix-cont .left-col { overflow: hidden; max-width: 60%;}
.user-header .top-fix-cont .right-col { justify-content: flex-end}

.user-header .upload-btn { display: none}
.user-header.my-channel .upload-btn { display: block}

.channel-head { z-index: 400; position: relative; margin:-45px 0 .5rem; padding: 45px 16px 0rem;  background: 0 0 / 100% 120px  linear-gradient(rgba(0,0,0, .35), transparent) no-repeat fixed, center top / auto 150px url('https://i49.vbox7.com/design/dummy/default-banner.jpg') no-repeat fixed; border-bottom: 1px solid #ccc}
.channel-head .avatar-cont { position: relative; margin: 60px auto 1rem; width: 80px; height: 80px}
.channel-head .avatar-cont i {   -webkit-text-stroke: 2px white; background-clip: text;  -webkit-background-clip: text!important; background: 0 0 /100% no-repeat; color: transparent; font-size: 80px;  /*filter: drop-shadow(0px 0px 7px rgba(90,90,90,1));*/ }

.channel-head > h2 { margin-bottom: 1.4em;/* text-shadow: 1px 1px 0 #fff */}
.channel-head .toggle-trigger .icon-open,
.channel-head .toggle-trigger .icon-closed { font-size: .6rem; color: #7c7c7c}

.profile-subscr { margin: 0 0 .5rem}
.profile-subscr-btn { display: inline-block; font-size: .85rem; color: #ff1464 }
.subscr-btn { display: inline-block; }
.user-header .subscr-btn i { margin: 0 0 0 .5rem; vertical-align: middle}
.subscr-btn .icon-subscr { display:none; font-size: 1.5em; color: #7c7c7c}
.subscr-btn .icon-notification-ok { display: inline-block; color: #ff1464; vertical-align: middle}
.subscr-btn .icon-notification { display: inline-block; color: #000;}
.subscr-btn.subscribed .icon-notification-ok,
.subscr-btn.subscribed .icon-notification { display:none }
.subscr-btn.subscribed .icon-subscr { display: inline-block; }


.chnl-description { margin: .5rem 0 ; padding: 0 16px; text-align: left; background: #fff}
.chnl-description img { max-width: 100%; max-height: 50vh}
.chnl-description .toggle-trigger { display: block; clear: both;   text-align: center;}


.btm-fix-nav { position: fixed; position: -webkit-sticky; /* Safari */  position: sticky; max-width:680px; margin-left: auto!important; margin-right: auto!important; z-index: 130; bottom: -1px; width: 100%; padding: 0 8px; box-sizing: border-box; background: #fff; /*box-shadow: 0 -2px 25px rgba(0,0,0,.55)*/ }
.btm-fix-nav li > a { width: 100%; text-align: center; padding: 0!important;}
.btm-fix-nav a i.icon-playlist-thin  { font-size: .9em }
.btm-fix-nav a i.icon-play-stroke  { top: auto }
.btm-fix-nav a i.icon-article  { font-size: .8em }
.btm-fix-nav .icon-play-btn2 {  font-size: 1.5rem}
.btm-fix-nav a.active i  { color: #ff1464 }
.btm-fix-nav li:first-child > a { padding: 0!important; margin: 0}
.btm-fix-nav li:last-child > a { padding: 0!important; margin: 0}

#chnl-opt-menu .icon-share {font-size: 1em !important;}

/* -- Profile -- */
.user-head { height: 130px; background: url('https://i49.vbox7.com/design/dummy/default-banner.jpg') center no-repeat; }
.user-head-static { position: fixed; top: 0; left: 0; width: 320px; height: 56px; }


/* VIP Channels */
.vip.user-header {  position: -webkit-sticky; /* Safari */  position: sticky; z-index: 200;margin:-45px 0 0; height: 55vw; /* overflow: hidden; */ background: url('https://i49.vbox7.com/design/dummy/default-banner.jpg') center top; background-size: auto 55vw!important }
.vip.user-header .top-fix-cont { background-image: inherit; background-size: auto 55vw; background-position: center top }
/* old banners fix */
.old-banner.user-header {  position: -webkit-sticky; /* Safari */  position: sticky; z-index: 500; margin:-48px 0 0; height: 150px; overflow: hidden;  background: url('https://i49.vbox7.com/design/dummy/default-banner.jpg') center top; background-size: auto 150px!important }
.old-banner.user-header .top-fix-cont { background-image: inherit; background-size: auto 150px; background-position: center top }

.vip-about { color: #000}
.vip-about h2 { display: flex; margin: .75rem 0 1rem; text-align: left; font: normal 1.85rem/30px Roboto-Medium, sans-serif; }
.vip-about h2 i { margin-left: 0}
.vip-about h2 span { vertical-align: top}
.short-desc { overflow: hidden }
.vip-about .desc { font: normal 1rem/1.45 Roboto-Regular, sans-serif; overflow: hidden }
.vip-about .desc.open-toggle { max-height: 1000px; }
.vip-about .desc.collapsed-toggle { max-height: 0 }
.vip-about .toggle-trigger  { font-size: .95rem }
.vip-about .toggle-trigger  i { color: #7c7c7c; font-size: .65rem; margin-left: .25rem  }
.vip-about .flex-cont { margin-top: 1.2rem; }


.vip .info-cont .stats { margin-top: .2rem; font-size: .7rem}
.vip .info-cont i.icon-eye{ font-size: .6rem}

 .section-title { text-transform: lowercase; }

 .section-title:first-letter {
  text-transform: uppercase;
}

/* == END USER header styles == */


/*== TOP PAGES ==*/

.section-container h2 { margin: 0 8px 1.5rem; padding: 1.5rem 0 0; border-top: 1px solid #c4c4c4; }
.section-container.demo h2 { margin: 2rem 8px 1.5rem; padding: 1.5rem 0 0; border-top: 0; }
.section-container.demo .slider-wrap-mb { margin-bottom: 2rem  }

.chart .btn-cont { padding-bottom: 1rem; width: auto; margin-left: 8px; margin-right: 8px; }
.chart h2 { margin-top: 2rem;}
.chart:first-child h2 { margin-top: 1rem;}
.chart + .chart {border-top: 1px solid #d8d8d8}


/*==  POSTERS listing   ==*/


/* SERVICE pages elements  */

.txt-scrolled { max-height: calc(80vh - 120px); overflow-y: scroll; padding: 0 8px}
.txt { color: #000; }
.note-txt { padding: 0 0 1rem; font-style: italic; }
.txt h2,
.txt h3 { border: 0; padding-top: 0; font-size: 1rem; font-weight: bold; line-height: 1.3}


.table-txt { background: #fff; width: 100%; margin: 0 0 2rem; font-size: 1rem}
.table-txt th,
.table-txt td { background: #fff; padding: .5rem .2rem; vertical-align: top}
.table-txt th { text-align: left; background: #fff; color: #333; border: 1px solid #e3e3e3; border-width: 1px 0}
.table-txt tr:nth-child(2n) td { background: #e3e3e3; }
.table-txt tbody tr:nth-child(2n) td { background: #fff; }
.table-txt tbody tr:nth-child(2n+1) td { background: #e3e3e3; }
.table-txt tbody tr:nth-child(2n+1) td.sep { border-right: 1px solid #f5f5f5; }


/*== EMOSTICONS COPIED ==*/


.new-post-head .emoticons-box 	{
    float: left;
    cursor: default;
    margin: 0;
    position: relative;
	height: 28px;
}
.emoticons-min  {
    position: relative;
   /* width: 324px;*/
}
.emoticons-min .emoticon-cont, .emoticons-min .emoticon-cont:hover{
    margin: 0;
    float: left;
    position: relative;
    padding: 0;
    display: block;
}
.emoticons-min .emoticon, .emoticons-min  .emoticon:hover  {
    margin: 3px;
    float: left;
    position: relative;
    padding: 0px;
    display: block;
}
.emoticons-min .emoticon-cont {
	margin: 1px;
}
.emoticons-min .emoticon-cont:hover {
	margin: 0px;
    background-color: #459EED;
    border: 1px solid #407CE5;
}
.em-menu {
    float: left;
    position: relative;
	margin: 0px 0px 0px 0px;
}

.icon-arrow-em-btn{
	vertical-align: middle;
    width: 12px;
	height: 14px;
}
.icon-arrow-em-btn {background-position: -2px -99px;}


.em-menu-play{
    background-color: #FFFFFF;
    position: absolute;
    top: 95%;
    left: 0px;
    width: 322px;
    border:1px solid #c3c3c3;
	border-radius: 10px;
    display:none;
    z-index: 2002;
}
.em-menu-play ul	{list-style: none; padding: 5px;}
.em-menu-play ul li a	{
    display: block;
    line-height: 22px;
    outline: medium none;
    padding: 0 0px;
}
.em-info{
    position: relative;
    overflow: hidden;
    float: left;
    width: 100%;
}
.em-info .em-desc {
    float: left;
    color: #8b8b8b;
    padding: 0px 0px 0px 7px;
}
.em-info .em-code {
    float: right;
    color: #8b8b8b;
    padding: 0px 7px 0px 0px;
}

.emoticonsBox {
	cursor: default;
	position: relative;
	overflow: visible;
	margin: 0 0 5px 0;
}
.show_emBox {
	display: block !important;
}
.emoticonBox {
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #2978E0;
	left: 0;
	position: absolute;
	top: -200px;
	-moz-box-shadow: 0 0 8px rgba(125, 125, 125, 0.5);
	-webkit-box-shadow: 0 0 8px rgba(125, 125, 125, 0.5);
	box-shadow: 0 0 8px rgba(125, 125, 125, 0.5);
	display: none;
	z-index: 10002;
	/*
	height: 307px;
	*/
}
.emoticonBox .emoticons {
	position: relative;
	overflow: hidden;
	width: 324px;
	margin: 4px 4px 3px 3px;
}
.emoticonBox .emoticons .emoticon {
	margin: 3px 3px 4px 4px;
	float: left;
	position: relative;
	z-index: 1001;
}
.emoticonBox .emoticons .iconHover {
	width: 23px;
	height: 24px;
	border: 1px solid #459eed;
	background-color: #e1effc;
	position: absolute;
	z-index: 0;
	display: none;
}
.emoticonBox .emInfoBox {
	position: relative;
	overflow: hidden;
	margin: 0 7px 7px 7px;
}

.emoticon {
	background: url("//i49.vbox7.com/design/icons/emotiSprite.png?v=1")
		repeat scroll -5px -4px transparent;
	display: inline-block;
	height: 20px;
	width: 20px;
	line-height: 20px;
	outline: medium none;
	overflow: hidden;
}
.emoticon:hover {
	text-decoration: none;
}
.emoticon span {
	display: inline-block;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}

.em_smile	{background-position: -5px -4px;}
.em_sad		{background-position: -32px -4px;}
.em_laugh	{background-position: -59px -4px;}
.em_wink	{background-position: -86px -4px;}
.em_unhappy	{background-position: -113px -4px;}
.em_speechless	{background-position: -140px -4px;}
.em_sealedlips	{background-position: -167px -4px;}
.em_moustaches	{background-position: -194px -4px;}
.em_cheeky	{background-position: -5px -31px;}
.em_worried	{background-position: -32px -31px;}
.em_crying	{background-position: -59px -31px;}
.em_surprised	{background-position: -86px -31px;}
.em_mmmm	{background-position: -113px -31px;}
.em_smirk	{background-position: -140px -31px;}
.em_angel	{background-position: -167px -31px;}
.em_devil	{background-position: -194px -31px;}
.em_blush	{background-position: -5px -58px;}
.em_laugh2	{background-position: -32px -58px;}
.em_angry	{background-position: -59px -58px;}
.em_nerdy	{background-position: -86px -58px;}
.em_cool	{background-position: -113px -58px;}
.em_kiss	{background-position: -140px -58px;}
.em_dull	{background-position: -167px -58px;}
.em_wow		{background-position: -194px -58px;}
.em_chuckle	{background-position: -5px -85px;}
.em_wasntme	{background-position: -32px -85px;}
.em_think	{background-position: -59px -85px;}
.em_horny	{background-position: -86px -85px;}
.em_inlove	{background-position: -113px -85px;}
.em_bow		{background-position: -140px -85px;}
.em_hug		{background-position: -167px -85px;}
.em_party	{background-position: -194px -85px;}
.em_nosebleed	{background-position: -5px -112px;}
.em_hi		{background-position: -32px -112px;}
.em_pilot	{background-position: -59px -112px;}
.em_vampire	{background-position: -86px -112px;}
.em_pirate	{background-position: -113px -112px;}
.em_envy	{background-position: -140px -112px;}
.em_drunk	{background-position: -167px -112px;}
.em_fubar	{background-position: -194px -112px;}
.em_swear	{background-position: -5px -139px;}
.em_ninja	{background-position: -32px -139px;}
.em_sweat	{background-position: -59px -139px;}
.em_headbang	{background-position: -86px -139px;}
.em_wait	{background-position: -113px -139px;}
.em_emo		{background-position: -140px -139px;}
.em_frozen	{background-position: -167px -139px;}
.em_yawn	{background-position: -194px -139px;}
.em_shock	{background-position: -5px -166px;}
.em_hazy	{background-position: -32px -166px;}
.em_what	{background-position: -59px -166px;}
.em_rain	{background-position: -86px -166px;}
.em_snow	{background-position: -113px -166px;}
.em_sun		{background-position: -140px -166px;}
.em_dance	{background-position: -167px -166px;}
.em_music	{background-position: -194px -166px;}
.em_tea		{background-position: -5px -193px;}
.em_beer	{background-position: -32px -193px;}
.em_burger	{background-position: -59px -193px;}
.em_gift	{background-position: -86px -193px;}
.em_flower	{background-position: -113px -193px;}
.em_love	{background-position: -140px -193px;}
.em_broken	{background-position: -167px -193px;}
.em_cake	{background-position: -194px -193px;}
.em_star	{background-position: -5px -220px;}
.em_handshake	{background-position: -32px -220px;}
.em_yes		{background-position: -59px -220px;}
.em_no		{background-position: -86px -220px;}
.em_monkey	{background-position: -113px -220px;}
.em_alien	{background-position: -140px -220px;}
.em_drink	{background-position: -167px -220px;}
.em_coffee	{background-position: -194px -220px;}
.em_donut	{background-position: -5px -247px;}
.em_riceball	{background-position: -32px -247px;}
.em_bg		{background-position: -59px -247px;}
.em_rock	{background-position: -86px -247px;}
.em_vbox7	{background-position: -113px -247px;}
.em_alienc	{background-position: -140px -247px}
.em_santa	{background-position: -167px -247px}


.text-ad.textAd { display: none}

/* LANDSCAPE */
@media screen and (orientation: landscape) and (max-width: 830px) {
	.play-pg  .top-fix-cont { position: static!important}
	.fasha-fix .playlist-wrap.open-toggle,
	.playlist-wrap.open-toggle { position: absolute; max-height: none!important; width: 100%}
	.playlist-wrap.collapsed-toggle { position: fixed; max-height: 2.8rem!important; width: 100%}

	.vip.user-header { height: 36vw; background: url('https://i49.vbox7.com/design/dummy/default-banner.jpg') center top no-repeat; background-size: auto 36vw!important }
	.vip.user-header .top-fix-cont {background-size: auto 36vw!important}


	.app-banner-cherga.ios { background: url('https://i49.vbox7.com/design/mobile3/ios_landscape_back.jpg') center/cover no-repeat; }
	.app-banner-cherga.android { background: url('https://i49.vbox7.com/design/mobile3/gplay_landscape_back.jpg') center/cover no-repeat; }
	.app-banner-txt { margin: 40px 65px 0 auto; background: url('https://i49.vbox7.com/design/mobile3/txt.jpg') center/contain no-repeat; }
	.app-banner-store { width: 300px; height: 63px; padding: 30px; background: transparent; }
}
/* DESKTOP */
@media screen and (min-width: 630px) {
	.channel-head { background: 0 0 / 100% 120px  linear-gradient(rgba(0,0,0, .35), transparent) no-repeat fixed, center top / 100% 150px url('https://i49.vbox7.com/design/dummy/default-banner.jpg') no-repeat fixed}
	.scrld-base > div {  background-size: cover;  }
	/* quizz */
	.answer .pic-cont { max-height: 252px;}

	.vip.user-header { max-height: 257px; background: url('https://i49.vbox7.com/design/dummy/default-banner.jpg') center top no-repeat; background-size: auto 257px!important }
	.vip.user-header .top-fix-cont {background-size: auto 257px!important}
}

/* small phones */
@media screen and (max-width: 321px) {
	html { font:normal 14px Roboto-Regular, sans-serif; }
	/* quizz */
	.answers-cont.box-type .answer { min-width: 130px;}
	.answer .pic-cont { min-height: 104px;}
	.card {margin-bottom: 1.2rem}
}


/* --  Basic and old common classes   -- */
.hide, .hidden, .dN {
	display: none !important;
}
.show {
	display: block !important;
}
.invisible {
	visibility: hidden;
}

.center-col {
	width: 700px;
	max-width: 100%;
	margin: 40px auto;
	padding: 0 16px;
	box-sizing: border-box;
}

.center-btns {
	margin: 20px auto 20px;
	text-align: center;
}

.center-btns a {
	margin-bottom: 20px;
}


/* EDIT RU */

.accordion-link {
	position: relative;
	display: block;
	margin-bottom: 40px;
	padding: 0 20px 14px;
	border-bottom: 1px solid #c7c7c7;
	font-size: 20px;
	font-family: 'Roboto-Medium', sans-serif;
	text-align: center;
}

.accordion-link.toggle-trigger.open-trig .icon-open,
.accordion-link .icon-closed {
	position: absolute;
	right: 0;
	top: 10px;
	font-size: 8px;
	color: #7C7C7C;
}


.accordion-content label {
	margin-bottom: 20px;
	font-size: 15px;
}

.accordion-content .field-wrap {
	padding: 0 0 40px;
}

.field-wrap .radio-btn:last-child {
	margin-bottom: 0;
}

.accordion-content .center-label {
	font-size: 18px;
	text-align: center;
}

.accordion-content .icon-checkbx,
.accordion-content .icon-checkbx + img {
	display: inline-block;
	vertical-align: middle;
}

.accordion-content .vbox-player.magenta .camera-effect {

}

.accordion-content .video-thumb {
	max-width: 344px;
}

.accordion-content:last-child .field-wrap {
	border-bottom: 1px solid #c7c7c7;
	margin-bottom: 20px;
}


.tags-container:after {
	content: '';
	display: table;
	clear: both;
}

.tag {
	float: left;
	margin: 15px 10px 0 0;
	padding: 9px 9px 8px 15px;
	font-size: 14px;
	color: #7C7C7C;
	background-color: #DFDFDF;
	border-radius: 28px;
}

.tag i {
	margin-left: 17px;
	cursor: pointer;
}

.video-thumb {
	margin: 0 -8px;
}

.video-thumb img {
	width: 100%;
}

.edit-add-filter {
	display: block;

}

#remove_logo_container {
	height: 300px; 
	overflow: auto;
	position: relative;
}

#remove_part_container {
	padding: 0 15px 15px 15px;
	line-height: 35px;
	margin-bottom: 10px;
}

.radio-btn {
	position: relative;
	padding-left: 30px;
	padding-top: 2px;
}

.radio-btn img {
	display: inline-block;
	margin-right: 10px;
	vertical-align: middle;
}

.radio-btn input:checked + .box:after {
	display: block;
}

.radio-btn .box {
	position: absolute;
	left: 0;
	top: 0;
	width: 19px;
	height: 19px;
	border: 1px solid #9D9D9D;
	border-radius: 50%;
}

.radio-btn .box:after {
	content: '';
	display: none;
	position: absolute;
	left: 3px;
	top: 3px;
	right: 3px;
	bottom: 3px;
	border-radius: 50%;
	background-color: #E82164;
}

.center-radio .box {
	top: 50%;
	margin-top: -10px;
}

.file-upload {
	margin-top: 20px;
}

#gdpr-toggle {left: -100px!important; display:none !important; }

#progressbar { height: 20px; width: 90%; max-width: 600px; margin: 2rem auto; border: 1px solid #ff1464!important}
.ui-progressbar .ui-progressbar-value { margin: 0; height: 100%; box-sizing: borer-box; background: #ff1464!important; border: 1px solid #fff!important}