body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
p,
blockquote,
th,
td {
margin: 0;
padding: 0;
}
fieldset,
img {
border: 0;
}
img,
object,
embed {
vertical-align: bottom;
}
address,
caption,
cite,
code,
dfn,
em,
th,
var {
font-style: normal;
font-weight: normal;
}
ol,
ul {
list-style: none;
}
caption,
th {
text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: 100%;
}
q:before,
q:after {
content: '';
}
a * {
cursor: pointer;
}
fieldset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section,
summary {
display: block;
}
b,
strong {
font-weight: bold;
}
svg:not(:root) {
overflow: hidden;
}
button {
overflow: visible;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer;
}
button,
select {
text-transform: none;
outline: 0;
}
textarea {
overflow: auto;
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0;
}
* {
box-sizing: border-box;
}
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
a {
background: transparent;
text-decoration: none;
outline: 0;
color: #333;
}
#daohang{
display: none;
}
a:active,
a:hover,
a:focus,
button:hover,
select:hover,
button:focus,
select:focus {
outline: 0;
}
input[type=text],
input[type=pasword],
textarea,
select {
outline: none;
-webkit-appearance: none;
box-shadow: none;
-webkit-box-shadow: none;
border-radius: 0px;
-webkit-appearance: none;
}
input {
outline: none;
}
[hidden],
template {
display: none;
}
mark {
background: #ff0;
color: #000;
}
img,
figure {
border: 0;
margin: 0;
}
@font-face {
font-family: 'icomoon';
src: url('../fonts/icomoon.eot?oyedbr');
src: url('../fonts/icomoon.eot?oyedbr#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?oyedbr') format('truetype'), url('../fonts/icomoon.woff?oyedbr') format('woff'), url('../fonts/icomoon.svg?oyedbr#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="icon-"],
[class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-view:before {
content: "\e922";
}
.icon-calendar:before {
content: "\e920";
}
.icon-duration:before {
content: "\e921";
}
.icon-icons8-Plus:before {
content: "\e900";
}
.icon-arr-left:before {
content: "\e901";
}
.icon-arr-right:before {
content: "\e902";
}
.icon-camera-shape-10:before {
content: "\e903";
}
.icon-close-shape-1:before {
content: "\e904";
}
.icon-dialog-clouds-shape-19:before {
content: "\e905";
}
.icon-dislike-shape-15:before {
content: "\e906";
}
.icon-download-shape-17:before {
content: "\e907";
}
.icon-heart-shape-16:before {
content: "\e908";
}
.icon-like-shape-15:before {
content: "\e909";
}
.icon-lock-shape-20:before {
content: "\e90a";
}
.icon-photo-shape-8:before {
content: "\e90b";
}
.icon-camera-big-shape-4:before {
content: "\e90c";
}
.icon-photo-big-shape-8:before {
content: "\e90d";
}
.icon-user-shape-14:before {
content: "\e90e";
}
.icon-click:before {
content: "\e90f";
}
.icon-play-shape-1:before {
content: "\e910";
}
.icon-search:before {
content: "\e911";
}
.icon-playlist-shape-21:before {
content: "\e925";
}
.icon-three-bars:before {
content: "\f05e";
}
.icon-chevron-right:before {
content: "\f078";
}
.icon-chevron-up:before {
content: "\f0a2";
}
.icon-chevron-down:before {
content: "\f0a3";
}
.icon-chevron-left:before {
content: "\f0a4";
}
/** jQuery FlexSlider v2.6.1* http://www.woothemes.com/flexslider/** Copyright 2012 WooThemes* Free to use under the GPLv2 and later license.* http://www.gnu.org/licenses/gpl-2.0.html** Contributing author: Tyler Smith (@mbmufffin)**/
/* ====================================================================================================================* RESETS* ====================================================================================================================*/
.flex-container a:hover,
.flex-slider a:hover {
outline: none;
}
.slides,
.slides>li,
.flex-control-nav,
.flex-direction-nav {
margin: 0;
padding: 0;
list-style: none;
}
.flex-pauseplay span {
text-transform: capitalize;
}
/* ====================================================================================================================* BASE STYLES* ====================================================================================================================*/
.flexslider {
margin: 0;
padding: 0;
border-radius: 0;
}
.flexslider .slides>li {
display: none;
-webkit-backface-visibility: hidden;
}
.flexslider .slides:after {
content: "\0020";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
html[xmlns] .flexslider .slides {
display: block;
}
* html .flexslider .slides {
height: 1%;
}
.no-js .flexslider .slides>li:first-child {
display: block;
}
/* ====================================================================================================================* DEFAULT THEME* ====================================================================================================================*/
.flexslider {
margin: 0 0 60px;
background: #fff;
border: 4px solid #fff;
position: relative;
zoom: 1;
border-radius: 4px;
-o-box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2);
box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2);
border-radius: 0;
}
.gallery-player {
position: relative;
overflow: hidden;
padding-bottom: 56.3492%;
}
.flexslider .slides {
zoom: 1;
}
.flexslider .slides img {
/*height: auto;width: 100%;*/
display: inline-block;
-moz-user-select: none;
}
.flexslider.auto .slides img {
height: auto;
width: 100%;
}
.flexslider.auto .slides .gallery-player img {
position: absolute;
left: 0;
top: 0;
}
.album-gallery .slides {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.album-gallery.flexslider .slides img {
height: 100%;
width: auto;
display: inline-block;
-moz-user-select: none;
}
@media screen and (min-width: 1025px) {
.album-gallery.flexslider .slides img {
max-height: 682px;
}
}
@media (width: 1024px) {
.album-gallery.flexslider .slides img {
height: 682px;
}
}
@media screen and (max-width: 1023px) {
.album-gallery.flexslider .slides img {
height: auto;
width: 100%;
}
}
.album-gallery.flexslider .slides>li {
text-align: center;
}
.flex-viewport {
max-height: 2000px;
-webkit-transition: all 1s ease;
transition: all 1s ease;
}
.loading .flex-viewport {
max-height: 300px;
}
.carousel li {
margin-right: 5px;
}
.flex-direction-nav {
*height: 0;
}
.flex-direction-nav a {
text-decoration: none;
display: block;
width: 40px;
height: 40px;
margin: -20px 0 0;
position: absolute;
top: 50%;
z-index: 10;
overflow: hidden;
opacity: 0;
cursor: pointer;
color: rgba(0, 0, 0, 0.8);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.flex-direction-nav a:before {
font-family: "flexslider-icon";
font-size: 40px;
display: inline-block;
content: '\f001';
color: rgba(0, 0, 0, 0.8);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
}
.flex-direction-nav a.flex-next:before {
content: '\f002';
}
.flex-direction-nav .flex-prev {
left: -50px;
}
.flex-direction-nav .flex-next {
right: -50px;
text-align: right;
}
.flexslider:hover .flex-direction-nav .flex-prev {
opacity: 0.7;
left: 10px;
}
.flexslider:hover .flex-direction-nav .flex-prev:hover {
opacity: 1;
}
.flexslider:hover .flex-direction-nav .flex-next {
opacity: 0.7;
right: 10px;
}
.flexslider:hover .flex-direction-nav .flex-next:hover {
opacity: 1;
}
.flex-direction-nav .flex-disabled {
opacity: 0 !important;
filter: alpha(opacity=0);
cursor: default;
z-index: -1;
}
.flex-pauseplay a {
display: block;
width: 20px;
height: 20px;
position: absolute;
bottom: 5px;
left: 10px;
opacity: 0.8;
z-index: 10;
overflow: hidden;
cursor: pointer;
color: #000;
}
.flex-pauseplay a:before {
font-family: "flexslider-icon";
font-size: 20px;
display: inline-block;
content: '\f004';
}
.flex-pauseplay a:hover {
opacity: 1;
}
.flex-pauseplay a.flex-play:before {
content: '\f003';
}
.flex-control-nav {
width: 100%;
position: absolute;
bottom: -40px;
text-align: center;
}
.flex-control-nav li {
margin: 0 6px;
display: inline-block;
zoom: 1;
*display: inline;
}
.flex-control-paging li a {
width: 11px;
height: 11px;
display: block;
background: #666;
background: rgba(0, 0, 0, 0.5);
cursor: pointer;
text-indent: -9999px;
-o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
border-radius: 20px;
}
.flex-control-paging li a:hover {
background: #333;
background: rgba(0, 0, 0, 0.7);
}
.flex-control-paging li a.flex-active {
background: #000;
background: rgba(0, 0, 0, 0.9);
cursor: default;
}
.flex-control-thumbs {
margin: 5px 0 0;
position: static;
overflow: hidden;
}
.flex-control-thumbs li {
width: 25%;
float: left;
margin: 0;
}
.flex-control-thumbs img {
width: 100%;
height: auto;
display: block;
opacity: .7;
cursor: pointer;
-moz-user-select: none;
-webkit-transition: all 1s ease;
transition: all 1s ease;
}
.flex-control-thumbs img:hover {
opacity: 1;
}
.flex-control-thumbs .flex-active {
opacity: 1;
cursor: default;
}
/* ====================================================================================================================* RESPONSIVE* ====================================================================================================================*/
@media screen and (max-width: 860px) {
.flex-direction-nav .flex-prev {
opacity: 1;
left: 10px;
}
.flex-direction-nav .flex-next {
opacity: 1;
right: 10px;
}
}
/*SCSS variables are information about icon's compiled state, stored under its original file name.icon-home {width: $icon-home-width;}The large array-like variables contain all information about a single icon$icon-home: x y offset_x offset_y width height total_width total_height image_path;At the bottom of this section, we provide information about the spritesheet itself$spritesheet: width height image $spritesheet-sprites;*/
/*The provided mixins are intended to be used with the array-like variables.icon-home {@include sprite-width($icon-home);}.icon-email {@include sprite($icon-email);}Example usage in HTML:`display: block` sprite:To change `display` (e.g. `display: inline-block;`), we suggest using a common CSS class:// CSS.icon {display: inline-block;}// HTML*/
/*The `sprites` mixin generates identical output to the CSS templatebut can be overridden inside of SCSS@include sprites($spritesheet-sprites);*/
.bg-check-dark {
background-image: url(/static/images/sprite.png);
background-position: -26px 0px;
width: 10px;
height: 7px;
}
.ico-check {
background-image: url(/static/images/sprite.png);
background-position: 0px 0px;
width: 26px;
height: 26px;
}
.ico {
display: inline-block;
}
.flexslider {
border: none;
margin: 0;
}
.flexslider .slides {
background: #fff;
}
.flex-direction-nav .flex-prev,
.flexslider:hover .flex-direction-nav .flex-prev {
left: 0;
opacity: 1;
}
.flex-direction-nav .flex-next,
.flexslider:hover .flex-direction-nav .flex-next {
right: 0;
opacity: 1;
}
/*common styles*/
html {
height: 100%;
background: #fff;
}
body {
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color emoji;
font-size: 14px;
font-weight: 400;
line-height: 1.7;
position: relative;
color: #6c6c6c;
background: #fff;
min-width: 320px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 500;
}
a {
color: #000;
text-decoration: none;
cursor: pointer;
}
a:hover,
a:active,
a:visited,
a:focus {
text-decoration: none;
}
.cfx:after,
.container:after {
display: block;
clear: both;
content: "";
}
.container,
.related-videos,
.related-albums,
.page-error {
max-width: 1558px;
margin: 0 auto;
padding: 0 25px;
}
@media screen and (max-width: 1200px) {
.container,
.related-videos,
.related-albums,
.page-error {
padding: 0 15px;
}
}
@media screen and (max-width: 480px) {
.container,
.related-videos,
.related-albums,
.page-error {
padding-left: 10px;
padding-right: 10px;
}
}
.container .container,
.related-videos .container,
.related-albums .container,
.page-error .container {
margin: 0;
}
.wrapper {
width: 100%;
overflow: hidden;
}
.logo {
font-weight: 900;
font-size: 24px;
}
.logo a {
color: #1b1b1d;
}
.logo .mark {
color: #fa0052;
}
.pull-left {
float: left !important;
}
.pull-right {
float: right !important;
}
.header {
width: 100%;
box-shadow: 0 12px 21px rgba(0, 0, 0, 0.28);
background-color: #fff;
}
.header .logo {
float: left;
vertical-align: top;
margin: 12px 0 0 0;
}
@media screen and (max-width: 1023px) {
.header .logo {
float: none;
margin: 0 auto;
width: 50%;
text-align: center;
padding: 20px;
}
}
@media screen and (max-width: 767px) {
.header .logo {
float: none;
margin: 0;
width: auto;
text-align: left;
padding: 20px 0;
}
#daohang{
display: block;
}
}
@media screen and (max-width: 480px) {
.header .logo {
font-size: 18px;
}
}
/*@media screen and (max-width: 478px) {.header .logo {text-align: center;padding: 20px 0 0;}}*/
.header__options {
float: right;
vertical-align: top;
position: relative;
margin: 0 0 0 40px;
padding: 0 0 0 38px;
}
@media screen and (max-width: 1170px) {
.header__options {
margin: 0;
padding: 0;
}
}
@media screen and (max-width: 1023px) {
.header__options {
float: none;
background: #fff;
}
}
@media screen and (max-width: 767px) {
.header__options {
position: absolute;
top: 15px;
right: 15px;
background: none;
}
}
@media screen and (max-width: 478px) {
.header__options {
top: 10px;
}
}
.header__options:after {
content: "";
position: absolute;
left: -40px;
top: -3px;
border: 20px solid transparent;
border-bottom: 35px solid #fff;
border-right: 20px solid #fff;
border-left: 20px solid transparent;
border-top: 35px solid transparent;
}
@media screen and (max-width: 1170px) {
.header__options:after {
display: none;
}
}
@media screen and (max-width: 1023px) {
.header__options:after {
display: block;
clear: both;
content: "";
position: static;
border: none !important;
}
}
.header__options:before {
position: absolute;
top: 0;
left: 0;
content: '';
background: #fff;
width: 100%;
height: 100%;
padding: 0 99999px 0 0;
margin: 0 -99999px 0 0;
}
@media screen and (max-width: 1023px) {
.header__options:before {
padding: 0 99999px 0;
margin: 0 -99999px 0;
}
}
@media screen and (max-width: 767px) {
.header__options:before {
display: none;
}
}
.header .main-menu {
float: left;
}
@media screen and (max-width: 767px) {
.header .main-menu {
width: auto;
min-width: 300px;
max-width: 300px;
box-shadow: 0 12px 21px rgb(0 0 0 / 28%);
}
}
.header .lang-select {
float: right;
padding: 20px 25px 14px;
cursor: pointer;
margin: 0 0 0 10px;
-webkit-transition: opacity .2s;
-moz-transition: opacity .2s;
-ms-transition: opacity .2s;
-o-transition: opacity .2s;
transition: opacity .2s;
}
.header .lang-select:hover [data-drop-id=languages_drop]>img {
opacity: .5;
}
@media screen and (max-width: 1170px) {
.header .lang-select {
padding: 18px 25px 14px;
}
}
@media screen and (max-width: 800px) {
.header .lang-select {
margin: 18px 10px 0;
padding: 0;
}
}
@media screen and (max-width: 767px) {
.header .lang-select {
margin: 12px 10px;
}
}
@media screen and (max-width: 800px) {
.header .lang-select:hover {
background: none;
}
}
[data-drop-id=languages_drop]>img {
margin: 0 !important;
}
#languages_drop>img {
margin: 0;
}
.menu-opened .main-menu {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.main-menu {
font-weight: 700;
}
@media screen and (max-width: 767px) {
.main-menu {
position: fixed;
top: 0;
left: 0;
width: 50%;
color: #000;
background: rgba(255, 255, 255, 0.99);
overflow: hidden;
z-index: 10001;
height: 100%;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: all 0.2s linear;
transition: all 0.2s linear;
}
}
@media screen and (max-width: 479px) {
.main-menu {
width: 70%;
}
}
.main-menu__drop {
position: absolute;
top: 100%;
left: 50%;
min-width: 100%;
font-weight: 400;
border: 1px solid #d0d0d0;
display: none;
background: #fff;
z-index: 1001;
white-space: nowrap;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
.main-menu__drop {
margin: 0;
left: 0;
width: 100%;
position: static;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.main-menu__drop__item a,
.main-menu__drop__item span {
display: block;
color: #a0a7af;
padding: 10px 15px;
text-transform: uppercase;
border-radius: 10px;
}
.main-menu__drop__item span {
background: #fa0052;
color: #fff;
}
.main-menu__drop__item.active>a,
.main-menu__drop__item:hover>a {
background: #fa0052;
color: #fff;
}
.main-menu__drop__item--alt {
background: #f8f8f8;
}
.main-menu__list {
font-size: 0;
height: 100%;
}
.main-menu__item {
display: inline-block;
position: relative;
font-size: 12px;
}
.main-menu__item>a:after {
position: absolute;
bottom: 0;
width: 100%;
height: 2px;
content: '';
left: 0;
right: 0;
}
.main-menu__item:last-child a:after {
width: 0;
}
.main-menu__item.active>a:after,
.main-menu__item:hover>a:after {
background-color: #f80354;
}
@media screen and (max-width: 1023px) {
.main-menu__item {
font-size: 13px;
}
}
@media screen and (max-width: 767px) {
.main-menu__item {
float: none;
display: block;
font-size: 18px;
}
}
.main-menu__item .premium-link {
color: #719d0e;
}
.main-menu__item>a {
display: block;
padding: 22px 12px;
color: #303036;
text-transform: uppercase;
}
@media screen and (max-width: 1170px) {
.main-menu__item>a {
padding: 18px 7px;
}
}
@media screen and (max-width: 1023px) {
.main-menu__item>a {
padding: 18px 9px;
}
}
@media screen and (max-width: 767px) {
.main-menu__item>a {
color: #000;
padding: 15px 20px;
}
}
.main-menu__item.active>a,
.main-menu__item:hover>a {
color: #fa0052;
}
.main-menu__item:hover .main-menu__drop {
display: block;
border-radius: 10px;
}
.main-menu__item--login a {
background: #fa0052;
color: #fff;
padding: 10px 10px;
border-radius: 10px;
}
.main-menu__item--login a:hover {
background-color: #719d0e;
color: #fff;
}
.main-menu__user-menu>a {
color: #a0a7af;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.main-menu__user-menu>a [class^="icon-"] {
margin: 0 0 0 5px;
}
/*.main-menu__user-menu:hover > a {background: none !important;color: #fa0052 !important;}*/
.main-menu__user-menu:hover>a [class^="icon-"],
.main-menu__user-menu:hover>a [class*=" icon-"] {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.main-menu__user-menu .main-menu__drop {
width: 180px;
}
.main-menu__user-menu .main-menu__drop a {
text-transform: uppercase;
font-size: 13px;
border-radius: 10px;
}
.main-menu__drop__item--alt {
border-radius: 10px;
}
@media screen and (max-width: 767px) {
.main-menu__user-menu .main-menu__drop {
margin: 0;
left: 0;
width: 100%;
}
}
.main-menu__user-image {
width: 38px;
height: 38px;
border: 4px solid #ffffff;
border-radius: 2px;
vertical-align: middle;
margin: 0 13px 0 0;
display: inline-block !important;
}
.main-menu__user-image img {
display: block;
position: relative;
top: 50%;
left: 50%;
margin: -22px 0 0 -22px;
}
.rotated {
display: inline-block;
position: relative;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.rotated>* {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.search-bar {
float: left;
padding: 15px 0px 0;
margin: 0 0 0 20px;
position: relative;
}
@media screen and (max-width: 1170px) {
.search-bar {
padding: 13px 0px 0;
}
}
@media screen and (max-width: 1023px) {
.search-bar {
padding: 14px 0px 0;
margin: 0 0 0 12px;
float: right;
}
}
@media screen and (max-width: 767px) {
.search-bar {
float: right;
padding: 6px 0px 0;
}
}
.search-bar__button {
font-size: 23px;
color: #303036;
position: relative;
padding: 10px 10px;
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
-o-transition: all .2s;
transition: all .2s;
}
.search-bar__button:hover {
color: #fa0052;
;
}
.search-bar__form {
position: absolute;
top: 100%;
right: 0;
display: none;
background: #fff;
z-index: 10001;
-webkit-border-radius: 20px;
border-radius: 20px;
border: 2px solid #fa0052;
padding: 0 40px 0 18px;
}
.search-bar__form form {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
@media screen and (max-width: 767px) {
.search-bar__form {
width: 290px;
}
}
@media screen and (max-width: 480px) {
.search-bar__form {
width: 270px;
}
}
.search-bar__input {
float: left;
background: none;
border: none;
font-size: 13px;
height: 46px;
line-height: 1.45;
width: 150px;
padding: 0 20px;
}
@media screen and (max-width: 767px) {
.search-bar__input {
width: 184px;
}
}
@media screen and (max-width: 480px) {
.search-bar__input {
padding: 0 10px;
}
}
.search-bar__drop {
display: none;
position: absolute;
top: 100%;
right: 0;
min-width: 145px;
border: 1px solid #e7eaed;
background: #fff;
z-index: 1000;
}
.search-bar__drop label {
display: block;
width: 100%;
overflow: hidden;
text-transform: uppercase;
font-size: 13px;
color: #a0a7af;
padding: 10px 15px;
cursor: pointer;
}
.search-bar__drop label [class^="icon-"],
.search-bar__drop label [class*=" icon-"] {
font-size: 20px;
}
.search-bar__drop input[type=radio] {
position: absolute;
top: -99999px;
left: -99999px;
}
.search-bar__drop input[type=radio]:checked+label {
background: #fa0052;
color: #fff;
}
.search-bar__drop [class^="icon-"],
.search-bar__drop [class*=" icon-"] {
margin: 0 4px 0 0;
float: right;
}
.search-bar__drop .icon-user-shape-14 {
margin: 0 8px 0 0;
}
.search-bar__filter {
color: #a0a7af;
position: relative;
}
.search-bar__filter-button {
color: #a0a7af;
font-size: 20px;
padding: 0 8px;
min-width: 57px;
display: block;
text-align: center;
}
.search-bar__filter-button .icon-chevron-down {
font-size: 13px;
margin: 0 0 0 2px;
}
.search-bar__filter-button [class^="icon-"]:first-child {
width: 28px;
}
.search-bar__filter-button.opened {
color: #fa0052;
}
.search-bar__submit {
background: #fa0052;
color: #fff;
border: none;
width: 46px;
height: 46px;
font-size: 23px;
line-height: 0.1;
padding: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
}
@media screen and (max-width: 767px) {
.search-bar__form {
padding: 0;
}
.search-bar__submit {
border-radius: 0 16px 16px 0;
}
}
.lang-select {
position: relative;
z-index: 1000;
}
.lang-select a {
display: -webkit-box !important;
display: -ms-flexbox !important;
display: flex !important;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.lang-select img {
width: 25px;
display: inline-block;
margin: 0 10px 0 0;
}
.lang-select .drop-inner li {
cursor: pointer;
white-space: nowrap;
}
.lang-select .drop-inner li:hover,
.lang-select .drop-inner li[data-selected] {
color: #fa0052;
}
.lang-select .dropdown__block__menu>nav:after {
right: 18px !important;
}
.main-gallery-holder {
position: relative;
background: url(/static/images/bg-net-01.jpg) repeat-x;
-webkit-background-size: cover;
background-size: cover;
}
.main-gallery-inner {
max-width: 1200px;
margin: 0 auto;
}
.main-gallery {
width: 100%;
position: relative;
z-index: 10;
height: 0;
padding-bottom: 56.3492%;
-webkit-transition: opacity .2s;
-moz-transition: opacity .2s;
-ms-transition: opacity .2s;
-o-transition: opacity .2s;
transition: opacity .2s;
}
.main-gallery .container {
padding: 0 !important;
position: absolute !important;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.main-gallery-loader {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.main-gallery .flexslider .slides li {
position: relative;
overflow: hidden;
}
.main-gallery .flexslider .flex-direction-nav a {
width: 45px;
height: 45px;
background: #fff;
color: #1b1b1d;
font-size: 19px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
@media screen and (max-width: 1365px) {
.main-gallery .flexslider .flex-direction-nav a {
z-index: 11;
}
}
@media screen and (max-width: 767px) {
.main-gallery .flexslider .flex-direction-nav a {
width: 25px;
height: 25px;
font-size: 14px;
margin: -12px 0 0;
}
}
.main-gallery .flexslider .flex-direction-nav a [class^="icon-"],
.main-gallery .flexslider .flex-direction-nav a [class*=" icon-"] {
width: 13px;
height: 19px;
position: absolute;
top: 50%;
left: 50%;
margin: -7px 0 0 -8px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
.main-gallery .flexslider .flex-direction-nav a [class^="icon-"],
.main-gallery .flexslider .flex-direction-nav a [class*=" icon-"] {
width: auto;
height: auto;
margin: -8px 0 0 -6px;
}
}
.main-gallery .flexslider .flex-direction-nav a:hover {
background: #fa0052;
color: #fff;
}
.main-gallery .flexslider .flex-direction-nav a:before {
display: none;
}
.main-gallery .flexslider .flex-direction-nav a.flex-next {
right: -70px;
}
@media screen and (max-width: 1365px) {
.main-gallery .flexslider .flex-direction-nav a.flex-next {
right: 15px;
}
}
.main-gallery .flexslider .flex-direction-nav a.flex-prev {
left: -70px;
}
@media screen and (max-width: 1365px) {
.main-gallery .flexslider .flex-direction-nav a.flex-prev {
left: 15px;
}
}
@media screen and (max-width: 767px) {
.main-gallery .flexslider .flex-direction-nav a.flex-prev [class^="icon-"],
.main-gallery .flexslider .flex-direction-nav a.flex-prev [class*=" icon-"] {
margin: -6px 0 0 -7px;
}
.main-gallery .thumb-spot {
display: none;
}
}
.btn-play {
position: absolute;
top: 50%;
left: 50%;
margin: -42.5px 0 0 -42.5px;
width: 85px;
height: 85px;
background: #fff;
background: rgba(255, 255, 255, 0.8);
border: 4px solid rgba(255, 255, 255, 0.5);
background-clip: padding-box;
-webkit-transition: all .1s linear;
transition: all .1s linear;
}
@media screen and (max-width: 767px) {
.btn-play {
margin: -22.5px 0 0 -22.5px;
width: 45px;
height: 45px;
}
}
.btn-play [class^="icon-"],
.btn-play [class*=" icon-"] {
width: 42px;
height: 51px;
font-size: 51px;
position: absolute;
top: 50%;
left: 50%;
margin: -30px 0 0 -16px;
}
@media screen and (max-width: 767px) {
.btn-play [class^="icon-"],
.btn-play [class*=" icon-"] {
width: 18px;
height: 26px;
font-size: 25px;
margin: -14px 0 0 -7px;
}
}
.btn-play:hover {
background: #fa0052;
}
.btn-play:hover [class^="icon-"],
.btn-play:hover [class*=" icon-"] {
color: #fff;
}
.thumb-spot {
position: absolute;
bottom: 16%;
left: 0;
background: rgba(0, 0, 0, 0.8);
color: #fff;
width: 40%;
padding: 18px 22px;
}
@media screen and (max-width: 1170px) {
.thumb-spot {
padding: 10px 15px;
}
}
@media screen and (max-width: 767px) {
.thumb-spot {
position: static;
width: 100%;
/*display:none;*/
}
.thumb__info {
/*display:none;*/
}
}
.thumb-spot__rating {
position: absolute;
color: #9de10b;
color: #94d900;
font-size: 13px;
text-align: center;
right: 0;
bottom: 0;
}
/* @media screen and (max-width: 1023px) {.thumb-spot__rating {width: 30px;height: 30px;font-size: 9px;}} */
.thumb-spot__rating span {
display: block;
height: 100%;
}
.thumb-spot__text {
overflow: hidden;
padding: 0 2px;
}
.thumb-spot__title {
font-size: 18px;
margin: 0 0 8px;
}
@media screen and (max-width: 1023px) {
.thumb-spot__title {
font-size: 12px;
}
}
@media screen and (max-width: 767px) {
.thumb-spot__title {
font-size: 14px;
}
}
.thumb-spot__data {
color: #8f8f9d;
color: #636363;
}
.thumb-spot__data li {
display: inline-block;
margin: 0 0 0 30px;
}
@media screen and (max-width: 1023px) {
.thumb-spot__data li {
margin: 0 0 0 10px;
font-size: 11px;
}
}
.thumb-spot__data li:first-child {
margin: 0;
}
.thumb-spot__data li [class^="icon-"],
.thumb-spot__data li [class*=" icon-"] {
font-size: 13px;
margin: 0 3px 0 0;
vertical-align: bottom;
}
.btn {
border: none;
text-align: center;
text-transform: uppercase;
padding: 5px 10px;
margin: 2px 0;
color: #000;
font-size: 12px;
font-weight: 700;
display: inline-block;
vertical-align: middle;
background: #fff;
cursor: pointer;
-webkit-transition: all .1s linear;
transition: all .1s linear;
border-radius: 15px;
background-color: rgba(120, 120, 120, .3);
}
.btn[disabled] {
color: #ccc;
border: 1px solid #ccc;
}
.btn[disabled]:hover {
color: #ccc;
border: 1px solid #ccc;
background: #fff;
cursor: not-allowed;
}
.btn:hover,
.btn.active {
background: #fa0052;
color: #fff;
}
.btn--alt-hover:hover {
background: #7da530;
border: 1px solid #7da530;
}
.btn--middle {
padding: 8px 20px;
font-size: 14px;
}
.btn--big {
padding: 8px 20px;
font-size: 20px;
}
.btn--bigger {
padding: 20px 50px;
font-size: 36px;
line-height: 1.2;
}
@media screen and (max-width: 680px) {
.btn--bigger {
padding: 8px 20px;
font-size: 25px;
}
}
.btn--huge {
padding: 20px 45px;
font-size: 48px;
}
@media screen and (max-width: 1200px) {
.btn--huge {
font-size: 25px;
padding: 15px 45px;
}
}
@media screen and (max-width: 1200px) {
.btn--huge {
font-size: 20px;
padding: 10px 35px;
}
}
@media screen and (max-width: 640px) {
.btn--huge {
font-size: 18px;
padding: 8px 25px;
}
}
@media screen and (max-width: 430px) {
.btn--huge {
font-size: 11px;
padding: 5px 25px;
}
}
.btn .lock {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.btn--unlock {
width: 100%;
background: #7da530;
color: #fff;
font-size: 30px;
position: relative;
padding: 0 0 0 50px;
border: none;
height: 62px;
line-height: 2;
border-radius: 3px;
overflow: hidden;
margin: 0 0 10px;
}
@media screen and (max-width: 1023px) {
.btn--unlock {
height: auto;
font-size: 22px;
}
}
@media screen and (max-width: 767px) {
.btn--unlock {
padding: 0 15px 0 15%;
line-height: 1.5;
}
}
@media screen and (max-width: 480px) {
.btn--unlock {
font-size: 15px;
padding: 0 15px 0 20%;
}
}
@media screen and (max-width: 480px) {
.btn--unlock {
font-size: 12px;
}
}
.btn--unlock .lock {
padding: 0 18px;
background: #526d20;
color: #7da530;
font-size: 40px;
position: absolute;
top: 0;
left: 0;
line-height: 1.6;
height: 100%;
}
@media screen and (max-width: 1023px) {
.btn--unlock .lock {
font-size: 27px;
line-height: 1.3;
}
}
@media screen and (max-width: 480px) {
.btn--unlock .lock {
font-size: 20px;
}
}
.btn--unlock--danger {
background: #fa0052;
font-size: 18px;
text-transform: none;
line-height: 1.2;
padding: 0 0 0 66px;
border-radius: 0;
}
.btn--unlock--danger .lock {
background: #923347;
color: #fa0052;
}
.btn--unlock--danger strong {
font-weight: 900;
display: block;
padding: 10px 0;
}
.btn--unlock--danger strong span {
display: block;
text-transform: uppercase;
font-weight: 900;
color: #fff;
}
.btn--unlock--danger .error-message {
font-size: 18px;
padding: 10px 0;
}
@media screen and (max-width: 480px) {
.btn--unlock strong {
display: block;
}
.btn--unlock--danger .error-message {
font-size: 14px;
}
}
.btn--unlock span {
font-weight: 300;
color: #344712;
}
.btn--unlock:hover {
border: none;
}
.btn--duble {
padding: 0;
border: none;
}
.btn--duble strong {
font-size: 85px;
color: #fff;
background: #7da530;
display: block;
padding: 20px 25px;
line-height: 1;
-webkit-transition: background .2s linear;
transition: background .2s linear;
}
@media screen and (max-width: 1023px) {
.btn--duble strong {
font-size: 50px;
}
}
@media screen and (max-width: 767px) {
.btn--duble strong {
font-size: 35px;
padding: 8px 20px;
}
}
@media screen and (max-width: 767px) {
.btn--duble strong {
font-size: 27px;
}
}
@media screen and (max-width: 479px) {
.btn--duble strong {
font-size: 25px;
}
}
.btn--duble span {
font-size: 14px;
color: #fff;
background: #fa0052;
display: block;
padding: 10px 5px;
line-height: 1;
font-weight: 400;
}
@media screen and (max-width: 1023px) {
.btn--duble span {
font-size: 12px;
}
}
@media screen and (max-width: 1023px) {
.btn--duble span {
font-size: 10px;
}
}
@media screen and (max-width: 479px) {
.btn--duble span {
font-size: 7px;
}
}
.btn--duble:hover {
border: none;
}
.btn--duble:hover strong {
background: #fa0052;
}
.btn--full-width {
width: 100%;
font-size: 16px;
padding: 8px 10px;
background-color: #fa0052;
border: 2px solid #fa0052;
color: #eee;
-webkit-border-radius: 20px;
border-radius: 20px;
}
.btn--color {
background: #fa0052;
border: 2px solid #fa0052;
color: #fff;
display: inline-block;
}
.btn--color:hover {
background: #fff;
border: 1px solid #fff;
color: #000;
}
.btn--white {
background: #fff;
border: 1px solid #fff;
color: #000;
text-transform: none;
}
.btn--green {
background: #7da530;
border: 1px solid #7da530;
color: #fff;
}
.btn__like {
color: #8cc80d;
font-size: 43px;
}
.btn__like:hover,
.btn__like.voted {
text-shadow: 0px 0px 13px #8cc80d;
}
.btn__dislike {
color: #fa0052;
font-size: 43px;
}
.btn__dislike:hover,
.btn__dislike.voted {
text-shadow: 0px 0px 13px #fa0052;
}
.btn__vote {
margin: 0 10px;
vertical-align: middle;
position: relative;
top: -10px;
-webkit-transition: all .2s linear;
transition: all .2s linear;
}
.btn__row {
text-align: center;
margin: 30px 0 0 0;
}
.btn__small-bottom {
display: block;
text-transform: uppercase;
font-size: 14px;
font-weight: 400;
}
.join-block-thin {
padding: 20px 0;
background: #fff;
margin: 0 0 20px;
box-shadow: 0 5px 38px rgba(0, 0, 0, 0.09);
-webkit-box-shadow: 0 5px 38px rgba(0, 0, 0, 0.09);
-moz-box-shadow: 0 5px 38px rgba(0, 0, 0, 0.09);
}
@media screen and (max-width: 1023px) {
.join-block-thin {
text-align: center;
}
.join-block-thin .btn {
float: none !important;
}
}
.join-block-thin__text {
font-size: 30px;
color: #7a7a7d;
}
@media screen and (max-width: 1170px) {
.join-block-thin__text {
font-size: 25px;
line-height: 2;
}
}
@media screen and (max-width: 1023px) {
.join-block-thin__text {
display: block;
float: none;
width: 100%;
margin: 0 0 10px;
line-height: 1.2;
}
}
.join-block-thin__text span {
color: #fa0052;
}
.title {
color: #000;
font-size: 24px;
margin: 13px 0;
overflow: hidden;
}
.title_small {
font-size: 18px;
margin: 0 0 13px;
}
@media screen and (max-width: 767px) {
.title {
line-height: 1.2;
margin: 15px 0 !important;
}
}
@media screen and (max-width: 480px) {
.title {
font-size: 20px;
}
}
.title__note {
float: right;
font-size: 16px;
color: #595959;
margin: 15px 0 0 0;
}
@media screen and (max-width: 767px) {
.title__note {
float: none;
display: block;
}
}
.title_tiny {
font-size: 12px;
}
.title__huge {
font-size: 30px;
}
.title__modal {
font-size: 30px;
}
.centered {
float: none !important;
text-align: center;
}
.heading {
padding: 13px 0;
}
.heading .title {
float: left;
margin: 0;
}
@media screen and (max-width: 768px) {
.heading .title {
float: none;
}
}
.heading .buttons {
margin: 3px 0 0 2px;
}
.heading .buttons:first-child {
margin: 3px 0 0 0;
}
@media screen and (max-width: 768px) {
.buttons {
float: none !important;
}
}
@media screen and (max-width: 380px) {
.buttons .btn {
font-size: 10px;
margin: 0 0 3px;
}
}
.thumbs {
width: 100%;
margin: 0 0 13px;
}
.thumbs__list {
text-align: left;
font-size: 0px;
line-height: 0;
width: calc(100% + 1.15%);
}
.thumbs__list .thumb--albums img,
.thumbs__list .thumb--models img {
border-radius: 15px;
}
@media screen and (max-width: 430px) {
.thumbs__list {
width: 100%;
}
}
.thumb {
position: relative;
display: inline-block;
line-height: normal;
font-size: 14px;
margin: 0 1.15% 1% 0;
overflow: hidden;
width: calc(20% - 1.15%);
border: 2px solid transparent;
}
/* @media screen and (max-width: 1200px) {.thumb {width: 21.85%;}} */
@media screen and (max-width: 1440px) {
.thumb {
width: calc(25% - 1.15%);
}
}
@media screen and (max-width: 992px) {
.thumb {
width: calc(33.3% - 1.15%);
}
}
@media screen and (max-width: 767px) {
.thumb {
width: calc(50% - 1.15%);
}
}
@media screen and (max-width: 430px) {
.thumb {
/* width: 100%; */
/* margin: 0 0 10px; */
}
}
@media screen and (max-width: 375px) {
.thumb {
/* width: 100%; */
/* margin: 0 0 10px; */
}
}
.thumb__rhomb {
width: 40px;
height: 40px;
background: #000;
border: 1px solid #000;
border: 4px solid rgba(255, 255, 255, 0.1);
background-clip: padding-box;
font-size: 12px;
color: #fff;
}
.thumb__rhomb span {
display: block;
height: 100%;
line-height: 2.5;
text-align: center;
}
.thumb__rhomb span.ico-only {
line-height: 3;
}
.thumb__rhomb span.ico-only i {
font-size: 16px;
position: relative;
top: 7px;
}
.thumb__rhomb i {
display: block;
font-size: 12px;
margin: 0px 0 -6px 0px;
}
.thumb--left-bottom {
position: absolute;
bottom: 10px;
left: 10px;
}
.thumb--left-bottom.--above {
bottom: 46px;
}
.thumb__info {
padding: 2px 2px;
width: 100%;
-webkit-transition: all .2s linear;
transition: all .2s linear;
}
/* .hover .thumb__info{-webkit-transform:translateY(100%);-moz-transform:translateY(100%);-ms-transform:translateY(100%);-o-transform:translateY(100%);transform:translateY(100%);} */
.thumb:hover .thumb__info {
color: #fa0052;
}
.thumb:hover img {
/*opacity:.5;*/
}
.thumb:hover .thumb-spot__title {
color: #fa0052;
}
@media (min-width: 767px) and (max-width: 1200px) {
/* .thumb__info {padding: 10px;} */
.thumb__info .btn {
font-size: 12px;
}
}
@media (min-width: 430px) and (max-width: 570px) {
/* .thumb__info {height: 80%;padding: 10px;} */
.thumb__info .btn {
width: 48%;
padding: 8px 5px;
font-size: 11px;
}
}
.thumb .thumb-spot {
background: none;
width: 100%;
position: relative;
padding: 0;
color: #3c3c46;
}
.thumb .thumb-spot__title {
font-size: 14px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-webkit-transition: color 0.3s;
transition: color 0.3s;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
-webkit-transition: color 0.3s;
-moz-transition: color 0.3s;
-ms-transition: color 0.3s;
-o-transition: color 0.3s;
}
.thumb--videos .thumb-spot__title,
.thumb--albums .thumb-spot__title {
height: 41px;
white-space: normal;
margin: 2px 0;
}
@media (min-width: 767px) and (max-width: 1200px) {
.thumb .thumb-spot__title {
font-size: 12px;
}
}
@media (min-width: 430px) and (max-width: 570px) {
.thumb .thumb-spot__title {
font-size: 12px;
}
}
@media screen and (max-width: 430px) {
.thumb--videos .thumb-spot__title,
.thumb--albums .thumb-spot__title {
height: 34;
}
}
.thumb .thumb-spot__data {
font-size: 12px;
padding: 2px;
}
@media (min-width: 767px) and (max-width: 1200px) {
.thumb .thumb-spot__data {
font-size: 11px;
}
}
@media (min-width: 430px) and (max-width: 570px) {
.thumb .thumb-spot__data {
font-size: 11px;
}
}
.thumb .thumb-spot__data li {
margin: 0 10px 0 0;
}
@media (min-width: 767px) and (max-width: 1200px) {
.thumb .thumb-spot__data li {
margin: 0 5px 0 0;
}
}
@media (min-width: 430px) and (max-width: 570px) {
.thumb .thumb-spot__data li {
margin: 0 5px 0 0;
}
}
/* .thumb .thumb-spot__rating {width: 32px;height: 32px;font-size: 11px;line-height: 2;margin: 9px 5px 0 10px;} */
.thumb .buttons {
margin: 21px 0 0 0;
}
@media (min-width: 430px) and (max-width: 570px) {
.thumb .buttons {
margin: 8px 0 0 0;
}
}
.thumb:hover .thumb__info {
bottom: 0;
}
.thumb:hover .thumb--left-bottom {
display: none;
}
.thumb:hover .thumb__line {
background: #fa0052;
}
/*.thumb--albums .thumb__info {height: 40%;}*/
.thumb--models .thumb__info {
/*height: 35%;*/
}
.thumb--categories:hover img {
opacity: .5;
}
.thumb__line {
position: absolute;
bottom: 0;
left: 0;
background: #000;
background: rgba(0, 0, 0, 0.8);
color: #fff;
overflow: hidden;
width: 100%;
padding: 10px;
-webkit-transition: all .2s linear;
transition: all .2s linear;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.thumb__line__title {
text-transform: uppercase;
font-size: 16px;
color: #fff;
}
.thumb__line__item {
font-size: 12px;
float: left;
margin: 0 0 0 12px;
}
.thumb__line__item:first-child {
margin: 0;
}
.thumb__line__item [class^="icon-"],
.thumb__line__item [class*=" icon-"] {
font-size: 14px;
margin: 0 5px 0 0;
vertical-align: top;
}
.thumb img {
width: 100%;
-webkit-transition: all .2s linear;
transition: all .2s linear;
height: auto;
}
@media screen and (max-width: 1200px) {
.thumb img {
width: 100%;
height: auto;
}
}
.join-spot-01 {
padding: 20px 0 30px;
height: 379px;
}
.join-spot-01 .container {
position: relative;
height: 100%;
}
.join-spot-01 img {
display: block;
}
@media screen and (max-width: 1200px) {
.join-spot-01 img {
width: 100%;
}
}
.join-spot-01__text {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 30px 50px;
background: url(/static/images/bg-banner-01.jpg) no-repeat 100% 0;
-webkit-background-size: cover;
background-size: cover;
}
@media screen and (max-width: 767px) {
.join-spot-01__text {
padding: 20px 30px;
}
}
@media screen and (max-width: 767px) {
.join-spot-01__text {
padding: 20px 30px;
}
}
@media screen and (max-width: 480px) {
.join-spot-01__text {
padding: 10px 25px;
}
}
@media screen and (max-width: 380px) {
.join-spot-01__text {
padding: 5px 25px;
}
}
.join-spot-01__title {
font-size: 78px;
font-weight: 700;
text-transform: uppercase;
color: #1b1b1d;
line-height: 1;
}
@media screen and (max-width: 1200px) {
.join-spot-01__title {
font-size: 50px;
}
}
@media screen and (max-width: 1023px) {
.join-spot-01__title {
font-size: 30px;
}
}
@media screen and (max-width: 640px) {
.join-spot-01__title {
font-size: 20px;
}
}
@media screen and (max-width: 380px) {
.join-spot-01__title {
font-size: 16px;
}
}
.join-spot-01__subtitle {
font-size: 30px;
text-transform: uppercase;
color: #7a7a7d;
margin: 0 0 15px;
line-height: 1;
}
@media screen and (max-width: 1200px) {
.join-spot-01__subtitle {
font-size: 20px;
}
}
@media screen and (max-width: 1023px) {
.join-spot-01__subtitle {
font-size: 15px;
}
}
@media screen and (max-width: 640px) {
.join-spot-01__subtitle {
font-size: 12px;
margin: 0 0 5px;
}
}
@media screen and (max-width: 380px) {
.join-spot-01__subtitle {
font-size: 9px;
}
}
.join-spot-01__subtitle span {
color: #1b1b1d;
}
.join-spot-02 {
padding: 20px 0 30px;
height: 299px;
}
.join-spot-02 .container {
position: relative;
height: 100%;
}
.join-spot-02 img {
display: block;
}
@media screen and (max-width: 1200px) {
.join-spot-02 img {
width: 100%;
}
}
@media screen and (max-width: 479px) {
.join-spot-02 img {
width: 150%;
}
}
.join-spot-02__text {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 30px 50px;
background: url(/static/images/bg-banner-02.jpg) no-repeat;
-webkit-background-size: cover;
background-size: cover;
}
@media screen and (max-width: 767px) {
.join-spot-02__text {
padding: 10px 25px;
}
}
.join-spot-02__title {
font-size: 37px;
font-weight: 700;
text-transform: uppercase;
color: #2bc0d6;
line-height: 1;
text-indent: 30%;
margin: 20px 0 0 0;
}
@media screen and (max-width: 1200px) {
.join-spot-02__title {
text-indent: 0;
}
}
@media screen and (max-width: 767px) {
.join-spot-02__title {
margin: 10px 0 0 0;
}
}
@media screen and (max-width: 560px) {
.join-spot-02__title {
font-size: 20px;
}
}
@media screen and (max-width: 430px) {
.join-spot-02__title {
font-size: 17px;
}
}
.join-spot-02__subtitle {
font-size: 21px;
text-transform: uppercase;
color: #82593b;
margin: 0 0 15px;
text-indent: 30%;
}
@media screen and (max-width: 1200px) {
.join-spot-02__subtitle {
text-indent: 0;
}
}
@media screen and (max-width: 560px) {
.join-spot-02__subtitle {
font-size: 15px;
}
}
@media screen and (max-width: 430px) {
.join-spot-02__subtitle {
font-size: 10px;
}
}
.join-spot-02__subtitle span {
color: #1b1b1d;
}
.join-spot-02 .btn {
position: absolute;
top: 19%;
right: 4%;
}
@media screen and (max-width: 1200px) {
.join-spot-02 .btn {
top: 12%;
}
}
@media screen and (max-width: 1024px) {
.join-spot-02 .btn {
top: 11%;
}
}
@media screen and (max-width: 767px) {
.join-spot-02 .btn {
top: 48%;
}
}
.pagination {
width: 100%;
text-align: center;
margin: 20px 0;
position: relative;
z-index: 10;
}
.pagination li {
display: inline-block;
margin: 0 5px;
}
@media screen and (max-width: 767px) {
.pagination li {
margin: 0 3px 14px;
}
}
.pagination li a {
font-size: 12px;
display: block;
height: 35px;
line-height: 37px;
width: 35px;
text-align: center;
font-weight: 700;
color: #000;
transition: all .2s linear;
border-radius: 10px;
background-color: #eee;
-webkit-border-radius: 20px;
border-radius: 20px;
}
.pagination li a:hover {
background: #fa0052;
color: #fff;
}
.pagination li.active a {
background: #fa0052;
color: #fff;
}
.disabled {
pointer-events: none;
}
.text-block {
text-align: justify;
margin: 20px 0 30px;
}
.text-block .title {
margin: 0;
}
.footer {
padding: 20px 0;
text-align: center;
color: #000;
box-shadow: 0 5px 38px rgba(0, 0, 0, 0.09);
-webkit-box-shadow: 0 5px 38px rgba(0, 0, 0, 0.09);
-moz-box-shadow: 0 5px 38px rgba(0, 0, 0, 0.09);
}
.footer .pull-left {
display: flex;
align-items: center;
}
@media screen and (max-width: 480px) {
.footer .pull-left {
width: 100%;
}
}
.footer .logo {
margin: 10px 10px 0 0;
}
@media screen and (max-width: 1023px) {
.footer .logo {
float: none !important;
margin: 0 10px 0 0;
}
}
.footer-menu {
width: 100%;
margin: 0 0 5px;
}
@media screen and (max-width: 1023px) {
.footer-menu {
margin: 0 0 10px;
}
}
.footer-menu__list {
text-align: right;
font-weight: 700;
}
@media screen and (max-width: 1023px) {
.footer-menu__list {
text-align: center;
}
}
@media screen and (max-width: 480px) {
.footer-menu__list {
text-align: left;
}
}
.footer-menu__item {
display: inline-block;
margin: 0 0 0 20px;
}
@media screen and (max-width: 1023px) {
.footer-menu__item {
margin: 0 10px;
}
}
@media screen and (max-width: 480px) {
.footer-menu__item {
display: block;
margin: 0 0 10px;
}
}
.footer-menu__item:first-child {
margin: 0;
}
@media screen and (max-width: 480px) {
.footer-menu__item:first-child {
margin: 0 0 10px;
}
}
.footer-menu__item a {
color: #7d7d83;
}
.footer-menu__item a:hover {
color: #fa0052;
}
.footer-menu__item.active a {
color: #fa0052;
}
.footer__copy {
text-align: right;
font-size: 12px;
}
@media screen and (max-width: 1023px) {
.footer__copy {
text-align: center;
}
}
@media screen and (max-width: 1023px) {
.footer_options {
float: none !important;
}
}
.drop-categories {
background: #fff;
display: none;
z-index: 1000;
position: absolute;
width: 100%;
}
@media screen and (max-width: 1200px) {
.drop-categories .container {
background: #f6f3f2;
}
}
.drop-categories__list {
background: #f6f3f2;
text-align: justify;
line-height: 0;
font-size: 1px;
padding: 20px 5%;
text-justify: newspaper;
zoom: 1;
}
@media screen and (max-width: 1170px) {
.drop-categories__list {
text-align: center;
}
}
.drop-categories__list:after {
width: 100%;
height: 0px;
visibility: hidden;
overflow: hidden;
content: '';
display: inline-block;
}
@media screen and (max-width: 1170px) {
.drop-categories__list:after {
display: none;
}
}
.drop-categories__item {
background: #000;
width: 127px;
height: 102px;
display: inline-block;
text-align: left;
line-height: normal;
font-size: 14px;
vertical-align: top;
position: relative;
}
@media screen and (max-width: 1170px) {
.drop-categories__item {
margin: 0 2px 2px;
}
}
.drop-categories__item img {
width: 100%;
-webkit-transition: all .2s linear;
transition: all .2s linear;
}
.drop-categories__item a {
display: block;
height: 100%;
}
.drop-categories__item a:hover img {
opacity: .8;
}
.drop-categories__item a:hover .drop-categories__title {
background: #fa0052;
background: #fa0052;
}
.drop-categories__title {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #fff;
text-transform: uppercase;
padding: 5px;
background: #000;
background: rgba(0, 0, 0, 0.8);
text-align: center;
-webkit-transition: all .2s linear;
transition: all .2s linear;
}
.drop-categories__all {
background: #fff;
color: #ababab;
border: 1px solid #ababab;
text-align: center;
text-transform: uppercase;
line-height: 92px;
}
.drop-categories__all .btn {
display: block;
height: 100%;
font-size: 14px;
}
.dropdown__block {
display: inline-block;
position: relative;
z-index: 100;
height: 100%;
}
.dropdown__block__menu {
position: absolute;
top: 100%;
/*width: 233px;*/
display: none;
z-index: 10;
padding: 7px 0 0 0;
}
.dropdown__block__menu>nav {
position: relative;
width: auto;
background: #fff;
border-radius: 0 0 10px 10px;
text-align: center;
overflow: hidden;
}
.dropdown__block__menu>nav.wide {
min-width: 233px;
}
.dropdown__block__menu>nav:after {
content: "";
position: absolute;
top: -6px;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAGCAYAAAD+Bd/7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE1MEFGMjY4NUZCMzExRTZCNTA1RkU0ODc2MEU3NjNCIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE1MEFGMjY5NUZCMzExRTZCNTA1RkU0ODc2MEU3NjNCIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTUwQUYyNjY1RkIzMTFFNkI1MDVGRTQ4NzYwRTc2M0IiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTUwQUYyNjc1RkIzMTFFNkI1MDVGRTQ4NzYwRTc2M0IiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz64bbDJAAAAbUlEQVR42mK8cOECAxJIgdJzYAIsSJKWQDwVyr4KxMdBDCaogCQQr5GVlf0HwiA2EEvBFLCBBMTFxYWFhIR+gzCIDVXEBlIwRURExERCQuIXzC4QGyhmDJJjfPz48S8ZGZkfDFjAkydPOAACDACuxhrAH9bQEAAAAABJRU5ErkJggg==) no-repeat;
width: 8px;
height: 6px;
}
.dropdown__block__menu--alt {
top: 100%;
background: #000;
padding: 0 3px;
width: 100% !important;
left: 50% !important;
margin: 0 0 0 -50% !important;
border: none;
}
.dropdown__block__menu--alt:after {
display: none;
}
.dropdown__block__menu--fav {
width: auto !important;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
margin-right: auto !important;
margin-left: auto !important;
white-space: nowrap;
}
@media screen and (max-width: 560px) {
.dropdown__block__menu--fav {
margin: 0 !important;
left: 0 !important;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.dropdown__block.align-left .dropdown__block__menu {
left: 0;
}
.dropdown__block.align-left .dropdown__block__menu>nav:after {
left: 20px;
}
.dropdown__block.align-right .dropdown__block__menu {
right: 0;
}
@media screen and (max-width: 520px) {
.dropdown__block.align-right .dropdown__block__menu {
right: auto;
}
}
.dropdown__block.align-right .dropdown__block__menu>nav:after {
right: 20px;
}
.dropdown__block.align-center .dropdown__block__menu {
left: 50%;
margin: 0 0 0 -116.5px;
}
.dropdown__block.align-center .dropdown__block__menu>nav:after {
left: 50%;
margin: 0 0 0 -4px;
}
/*.dropdown__block:hover .dropdown__block__menu {display: block;}*/
.dropdown__block:hover>.btn {
background: #fa0052;
color: #fff;
}
.drop-inner {
font-weight: 700;
}
.drop-inner li {
display: block;
margin: 5px 0;
}
.drop-inner li a {
display: inline-block;
padding: 2px 7px;
background: none;
border: none;
color: #000;
width: 100%;
font-weight: 400;
text-transform: uppercase;
}
.drop-inner li a:hover {
background: #fa0052;
color: #fff;
}
.drop-inner--az {
text-align: center;
text-transform: uppercase;
}
.drop-inner--az li {
display: inline-block;
}
.main {
width: 100%;
overflow: hidden;
position: relative;
min-height: 705px;
/* background: url(/static/images/bg-main-top.jpg) no-repeat, url(/static/images/bg-main-bottom.jpg) no-repeat 0 100%; */
}
@media screen and (max-width: 1024px) {
.main {
min-height: 0;
}
}
.main .container {
position: relative;
}
.box {
padding: 10px 20px 15px;
overflow: hidden;
}
@media screen and (max-width: 1024px) {
.box {
padding: 10px 15px 15px;
}
}
.box--small {
padding: 10px;
}
.item--bordered:hover img,
.item--bordered.flex-active-slide img {
outline: 4px solid #de5573;
outline-offset: -4px;
/*opacity: .6;*/
}
.album-images img {
margin: 0;
}
.album-images__list {
line-height: 0;
font-size: 1px;
}
.album-images__item {
font-size: 14px;
line-height: normal;
display: inline-block !important;
vertical-align: middle;
background: #000;
position: relative;
cursor: pointer;
width: auto !important;
margin: 0 6px 0 0 !important;
}
.album-images__item:last-child {
margin: 0 !important;
}
.album-images__item a {
display: block;
}
.album-images__item.disabled {
cursor: default;
}
.album-images__item.disabled img {
opacity: .4;
}
.album-images__item.disabled:hover img {
outline: none !important;
}
.album-images__item.disabled .btn {
pointer-events: auto !important;
z-index: 1000;
}
.album-images__item .btn {
position: absolute;
top: 50%;
left: 50%;
width: 80%;
margin: 0 0 0 -40%;
background: rgba(222, 77, 108, 0.5);
border: 1px solid transparent;
display: none;
}
.album-images__item .btn:hover {
background: #fff;
}
@media screen and (max-width: 767px) {
.album-images__item .btn {
padding: 3px 0;
}
}
.album-images__item.disabled .btn {
display: block;
}
.mCSB_scrollTools .mCSB_draggerRail {
width: 5px !important;
background: #565657 !important;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 5px !important;
background: #fa0052 !important;
border-radius: 20px;
}
.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical {
margin: 20px 0 !important;
}
.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools {
opacity: 0.6;
}
.info-bar {
color: #fff;
height: 64px;
}
@media screen and (max-width: 767px) {
.info-bar {
height: auto;
}
}
.info-bar .thumb-spot__rating {
float: none;
margin: 0;
vertical-align: middle;
width: 36px;
height: 36px;
position: relative;
top: -4px;
}
.info-bar .thumb-spot__rating span {
line-height: 2.4;
}
.info-bar__cell {
float: left;
height: 100%;
}
@media screen and (max-width: 767px) {
.info-bar__cell {
border: none;
}
}
.info-bar__cell:first-child {
border: none;
}
.info-bar__buttons {
float: right;
height: 100%;
}
@media screen and (max-width: 767px) {
.info-bar__buttons {
border: none;
padding: 0 0 3px;
}
}
@media screen and (max-width: 560px) {
.info-bar__buttons {
float: none;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: distribute;
justify-content: space-around;
}
}
.info-bar__button {
font-size: 39px;
color: #6e6666;
padding: 0 12px;
position: relative;
height: 100%;
display: block;
}
@media screen and (max-width: 767px) {
.info-bar__button {
font-size: 33px;
}
}
.info-bar__button.subscribed [class^="icon-"]:after {
content: '';
position: absolute;
top: 43%;
left: 3%;
text-decoration: line-through;
width: 80%;
color: #fff;
z-index: 100;
height: 5px;
background: #fff;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
.info-bar__button span {
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color emoji !important;
font-weight: bold;
color: #000;
width: 20px;
height: 20px;
font-size: 11px;
position: absolute;
top: 8px;
right: 8px;
background: #8cc80d;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.info-bar__button .icon-icons8-Plus {
position: absolute;
bottom: 8px;
left: 3px;
font-size: 23px;
color: #8cc80d;
}
.info-bar__button:hover,
.info-bar__button.active {
color: #fa0052;
}
.info-bar [class^="icon-"],
.info-bar [class*=" icon-"] {
vertical-align: inherit;
}
.vote-block {
float: left;
height: 100%;
position: relative;
}
@media screen and (max-width: 767px) {
.vote-block {
float: none;
width: 100%;
border-bottom: 1px solid #424242 !important;
margin: 0 0 5px;
height: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: distribute;
justify-content: space-around;
}
}
@media screen and (max-width: 1023px) {
.vote-block .thumb-spot__rating {
font-size: 13px;
}
}
.media-data {
float: left;
padding: 2px 0px 10px;
height: 100%;
}
@media screen and (max-width: 560px) {
.media-data {
float: none;
width: 100%;
overflow: hidden;
border-bottom: 1px solid #424242;
margin: 0 0 6px;
padding: 2px 0 15px;
}
.media-data__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: distribute;
justify-content: space-around;
}
}
.media-data__small-info {
font-size: 14px;
color: #929292;
font-weight: 400;
display: inline;
}
.media-data__list li {
float: left;
margin: 0 0 0 45px;
}
@media screen and (max-width: 992px) {
.media-data__list li {
margin: 0 0 0 10px;
}
}
.media-data__list-value {
color: #939393;
font-size: 24px;
line-height: 1;
display: block;
}
@media screen and (max-width: 920px) {
.media-data__list-value {
font-size: 15px;
}
}
.media-data__list-value a {
color: #6e6666;
text-decoration: underline;
}
.media-data__list-value a:hover {
text-decoration: none;
}
@media screen and (max-width: 380px) {
.media-data__list-value {
font-size: 18px;
}
}
.media-data__list-title {
color: #939393;
font-size: 16px;
display: block;
}
.media-info__row {
width: 100%;
border-bottom: 1px solid #d0d0d0;
overflow: hidden;
padding: 10px 0;
}
.media-info__row:first-child {
padding: 0 0 7px;
}
.media-info__row:after {
display: block;
clear: both;
content: "";
}
.media-info__row--unstyled {
border: none;
padding-bottom: 0;
}
.media-info__label {
font-size: 16px;
margin: 0 8px 0 0;
float: left;
line-height: 27px;
}
.media-info__label a {
text-decoration: underline;
}
.media-info__label a:hover {
text-decoration: none;
}
.media-info__desc {
color: #000;
font-size: 16px;
}
@media screen and (max-width: 480px) {
.media-info__desc {
display: block;
text-align: justify;
}
}
.media-info__lists {
overflow: hidden;
margin: 7px 0 0 0;
}
@media screen and (max-width: 920px) {
.media-info__lists {
padding: 0;
margin: 0;
}
}
.media-info__lists-row {
width: 100%;
overflow: hidden;
padding: 10px 0;
}
.media-info__buttons {
overflow: hidden;
margin: -5px 0 0 -5px;
}
.media-info__buttons .btn {
margin: 5px 0 0 5px;
}
.media-info__wrap {
background: #fff;
float: right;
width: calc(100% - 288px);
position: relative;
padding: 0 0 64px;
/*min-height: 380px;*/
}
@media screen and (max-width: 992px) {
.media-info__wrap {
width: 100%;
list-style: none;
padding: 0;
}
}
.media-info__wrap .info-bar {
position: absolute;
bottom: 0;
width: 100%;
z-index: 100;
background: #fff;
}
@media screen and (max-width: 992px) {
.media-info__wrap .info-bar {
position: static;
}
}
.media-info__item {
padding: 0 1%;
border-left: 1px solid #d0d0d0;
}
@media screen and (max-width: 767px) {
.media-info__item {
padding: 0;
float: none !important;
width: 100%;
margin: 10px 0 0;
border: none;
}
.media-info__item:first-child {
margin: 0;
}
}
.media-info__item:first-child {
padding: 0 1% 0 0;
border: none;
}
.js-scrolled {
overflow: hidden;
padding-right: 10px;
}
.media-box {
border-right: 1px solid #d0d0d0;
width: 36%;
}
@media screen and (max-width: 992px) {
.media-box {
border-right: none;
border-bottom: 1px solid #d0d0d0;
padding: 10px 0;
width: 100%;
float: none !important;
margin: 0 0 15px;
}
}
@media screen and (max-width: 992px) {
.media-box:first-child {
padding: 0 0 10px;
}
}
.media-box__img {
float: left;
margin: 0 10px 0 0;
width: 133px;
position: relative;
}
@media screen and (max-width: 480px) {
.media-box__img {
float: none;
margin: 0 auto 20px;
}
}
.media-box__img a {
display: block;
position: relative;
}
.media-box__img img {
width: 100%;
display: block;
height: auto;
}
.media-box__content {
overflow: hidden;
}
@media screen and (max-width: 480px) {
.media-box__content {
text-align: center;
}
}
.media-box__title {
font-size: 18px;
margin: 0 0 3px;
font-weight: 700;
line-height: 1;
}
@media screen and (max-width: 480px) {
.media-box__title {
text-align: center;
}
}
.media-box__row,
.media-box__list {
width: 100%;
overflow: hidden;
}
.media-box__row {
margin: 7px 0 0 0;
}
@media screen and (max-width: 479px) {
.media-box__row {
margin: 0;
}
}
.media-box__row:first-child {
margin: 0;
}
.media-box__left {
float: left;
width: 50%;
}
.media-box__right {
float: right;
width: 50%;
}
@media screen and (max-width: 479px) {
.media-box__right,
.media-box__left {
width: 100%;
float: none;
display: block;
}
}
.media-box__list {
color: #828282;
margin: 0 0 14px;
padding: 0 10px 0 0;
}
@media screen and (max-width: 480px) {
.media-box__list {
padding: 0;
}
}
@media screen and (max-width: 480px) {
.media-box__list {
text-align: center;
}
}
.media-box__list span {
color: #000;
display: block;
}
@media screen and (max-width: 480px) {
.media-box__list span {
display: inline-block;
}
}
.media-box__large {
font-size: 16px;
}
@media screen and (max-width: 992px) {
.full-width.media-box__large {
padding: 0;
margin: 0;
}
}
.media-box__large .media-box__list,
.media-box__large .media-box__row {
margin: 0;
}
.input {
background: #fff;
border: 1px solid #d0d0d0;
height: 39px;
line-height: 1.5;
padding: 0 15px;
width: 100%;
display: block;
}
.input--unstyled {
border: none;
background: none;
}
.input.error {
border: 1px solid red;
}
textarea.input {
padding: 10px 15px;
resize: none;
}
.comments {
margin: 0 0 10px;
padding: 0 20px 23px;
}
.comments_models {
padding: 15px 23px 20px;
}
.comments .media-info__label {
display: block;
float: none;
}
.comments__it {
width: 308px;
}
.comments__textarea {
width: 775px;
height: 106px;
display: inline-block;
}
@media screen and (max-width: 940px) {
.comments__textarea,
.comments__it {
width: 100%;
}
}
.comments__row {
margin: 10px 0 0 0;
}
.comments__row:first-child {
margin: 0;
}
.comments .captcha-control img {
margin: 0 10px 0 0;
}
.comments .captcha-control input[type=text] {
width: auto;
}
.comments .btn__submit {
vertical-align: top;
/*margin: 0 0 0 10px;*/
}
@media screen and (max-width: 940px) {
.comments .btn__submit {
margin: 8px 0 0 0;
}
}
.comments__item {
padding: 15px 0;
border-top: 1px solid #d0d0d0;
}
.comments__item:first-child {
border: none;
}
.comments__item__body {
margin: -6px 0 0 10px;
overflow: hidden;
}
.comments__item__avatar {
padding: 10px 15px;
background: #fa0052;
color: #fff;
width: 38px;
height: 38px;
border: 4px solid #ffffff;
border-radius: 2px;
vertical-align: middle;
margin: 0 13px 0 0;
float: left;
}
.comments__item__avatar img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: rotate(-45deg) translate(0%, -73%);
transform: rotate(-45deg) translate(0%, -73%);
}
.comments__item__heading {
margin: 0 0 3px;
}
.comments__item__name {
text-transform: uppercase;
color: #fa0052;
font-size: 12px;
margin: 0 20px 0 0;
}
a.comments__item__name:hover {
text-decoration: underline;
}
.comments__item__date {
color: #767676;
font-size: 12px;
}
.comments__item__text {
color: #000000;
}
.album-view .flex-direction-nav a,
.media-carousel .flex-direction-nav a {
height: 100%;
top: 0;
margin: 0;
background: rgba(0, 0, 0, 0.5);
width: 104px;
}
@media screen and (max-width: 767px) {
.album-view .flex-direction-nav a,
.media-carousel .flex-direction-nav a {
background: none;
width: 64px;
}
}
.flex-viewport {
max-height: 100%;
}
.flex-direction-nav {
opacity: 0;
-webkit-transition: opacity .2s;
-moz-transition: opacity .2s;
-ms-transition: opacity .2s;
-o-transition: opacity .2s;
transition: opacity .2s;
}
.ready .flex-direction-nav {
opacity: 1;
}
.flex-direction-nav a {
z-index: 0;
}
.flex-direction-nav a .rotated {
width: 46px;
height: 46px;
background: #fff;
font-size: 20px;
position: absolute;
top: 50%;
left: 50%;
margin: -23px 0 0 -23px;
border: 4px solid rgba(255, 255, 255, 0.5);
background-clip: padding-box;
-webkit-transition: all .1s linear;
transition: all .1s linear;
border-radius: 50%;
}
.flex-direction-nav a .rotated i {
position: absolute;
top: 23%;
left: 37%;
}
.flex-direction-nav a:before {
display: none;
}
.flex-direction-nav a:hover .rotated {
background: #fa0052;
}
.flex-direction-nav a:hover .rotated [class^="icon-"],
.flex-direction-nav a:hover .rotated [class*=" icon-"] {
color: #fff;
}
.full-width-box {
width: 100%;
border: 1px solid #d0d0d0;
padding: 30px 40px;
background: #fff;
}
@media screen and (max-width: 1023px) {
.full-width-box {
padding: 25px;
}
}
@media screen and (max-width: 767px) {
.full-width-box {
margin: 0 0 30px;
}
}
.full-width {
width: 100%;
border: none;
}
.form__area {
width: 100%;
}
.form__area__label {
display: block;
margin: 0 0 5px;
color: #000;
}
.form__area__row {
margin: 0 0 20px;
position: relative;
}
.cols {
width: 100%;
}
.cols .col {
width: 35.33%;
float: left;
padding: 0 40px;
border-left: 1px solid #d0d0d0;
}
@media screen and (max-width: 1024px) {
.cols .col {
padding: 0 30px;
}
}
.cols .col:first-child {
padding: 0 40px 0 0;
border: none;
width: 32%;
}
@media screen and (max-width: 1024px) {
.cols .col:first-child {
padding: 0 30px 0 0;
}
}
@media screen and (max-width: 767px) {
.cols .col:first-child {
padding: 20px 0px;
width: 100%;
}
}
.cols .col:last-child {
padding: 0 0 0 40px;
width: 32%;
}
@media screen and (max-width: 1024px) {
.cols .col:last-child {
padding: 0 0 0 30px;
}
}
@media screen and (max-width: 767px) {
.cols .col:last-child {
padding: 20px 0px;
width: 100%;
}
}
@media screen and (max-width: 767px) {
.cols .col .title_tiny {
margin: 0 0 15px !important;
}
}
@media screen and (max-width: 767px) {
.cols .col {
width: 100%;
border-left: none;
border-top: 1px solid #d0d0d0;
padding: 20px 0;
}
}
.file_area {
position: relative;
}
.file_area input[type=file] {
position: absolute;
top: 0;
left: 0;
opacity: 0;
z-index: 1000;
cursor: pointer;
}
.checkbox {
width: 18px;
height: 18px;
border: 1px solid #d0d3d5;
background: #fff;
border-radius: 0;
}
.checkbox__fav {
position: absolute;
top: 10px;
right: 10px;
z-index: 10;
cursor: pointer;
}
.checkbox__fav-label {
width: 27px;
height: 26px;
position: absolute;
top: 6px;
right: 6px;
z-index: 10;
background: rgba(0, 0, 0, .6);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.checkbox__fav:checked+.fav_overlay {
display: block;
}
.fav_overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(222, 77, 108, 0.5);
display: none;
}
.modal {
border-radius: 0;
}
@media screen and (max-width: 1240px) {
.modal {
width: 100% !important;
}
}
.modal .btn--unlock {
margin: 0;
}
.modal .link__holder {
margin: 0 0 0 10px;
}
.modal.middle {
width: 615px;
margin: 0 0 0 -307.5px;
}
.modal.fade {
display: none;
}
.modal.fade.in {
top: 45%;
display: block;
}
.modal__close {
position: absolute;
top: 15px;
right: 15px;
background: none;
border: none;
width: 26px;
height: 26px;
font-size: 26px;
line-height: 1;
padding: 0;
color: #949494;
}
.modal__close i {
vertical-align: top;
}
.modal .title {
border-bottom: 1px solid #d0d0d0;
padding: 0 0 10px;
margin: 0 !important;
}
.modal__window {
position: relative;
z-index: 10;
padding: 10px 53px 22px;
}
@media screen and (max-width: 680px) {
.modal__window {
padding: 10px 20px;
}
.modal__window .twocolumn {
padding: 0;
}
}
@media screen and (max-width: 480px) {
.modal__window {
padding: 10px;
}
}
.modal__window__form {
width: 100%;
}
.modal__window__form--single {
padding: 40px 0;
}
@media screen and (max-width: 767px) {
.modal__window__form--single {
padding: 15px 0;
}
}
.modal__window__row {
width: 100%;
margin: 0 0 17px;
position: relative;
}
@media screen and (max-width: 680px) {
.modal__window__row {
margin: 0 0 5px;
}
}
.modal__window__row:after {
display: block;
clear: both;
content: "";
}
.modal__window .input {
float: right;
width: 100%;
border-radius: 10px;
}
@media screen and (max-width: 680px) {
.modal__window .input {
width: 100%;
float: none;
display: block;
}
}
.modal__window .input .checkbox {
margin: 10px 0 0 -15px;
}
.modal__window__label {
overflow: hidden;
text-align: right;
display: block;
line-height: 2.5;
color: #000;
width: 35%;
float: left;
}
@media screen and (max-width: 680px) {
.modal__window__label {
width: 100%;
float: none;
display: block;
text-align: left;
line-height: 1.5;
}
}
.modal__window .btn__row {
margin: 40px 0 0 0;
}
.modal__window .btn__row--align-right {
float: right;
width: 75%;
text-align: left;
margin: 0;
}
@media screen and (max-width: 680px) {
.modal__window .btn__row--align-right {
float: none;
width: 100%;
}
}
.modal#modal-signup {
background: url(/static/images/bg-main-top.jpg) no-repeat, url(/static/images/bg-main-bottom.jpg) no-repeat 0 100%;
width: 1088px;
}
.modal__join {
border-top: 1px solid #d0d0d0;
padding: 30px 0 0 0;
}
.modal__join__title {
font-size: 48px;
text-transform: uppercase;
margin: 0 0 30px;
color: #000;
line-height: 1;
text-align: center;
line-height: 1.1;
}
@media screen and (max-width: 680px) {
.modal__join__title {
font-size: 23px;
}
}
.modal__join__text {
font-size: 24px;
margin: 0 0 30px;
color: #7a7a7d;
text-align: center;
}
.modal__join__text span {
color: #000;
}
.modal__join .btn--duble strong {
font-size: 60px;
padding: 20px 40px;
}
@media screen and (max-width: 680px) {
.modal__join .btn--duble strong {
font-size: 27px;
}
}
@media screen and (max-width: 1023px) {
.modal .twocolumn .right,
.modal .twocolumn .left {
float: none;
width: 100%;
}
}
#modal-support {
background: url(/static/images/bg-main-top.jpg) no-repeat;
width: 768px;
}
#modal-support textarea {
height: 100px;
}
.fancybox-inner {
background: #fff;
}
.fancybox-inner:before {
/*content: '';position: absolute;top: 0;left: 0;width: 100%;height: 317px;background-size: cover;*/
}
@media (max-width: 979px) {
.modal,
.modal.container,
.modal.modal-overflow {
top: -100%;
}
}
.modal-backdrop,
.modal-backdrop.fade.in {
background: #000;
}
@media (min-width: 1200px) {
.modal.container {
width: 1090px;
margin-left: -545px;
}
}
.twocolumn {
padding: 30px 0;
border-bottom: 1px solid #d0d0d0;
}
.twocolumn .left {
width: 50%;
float: left;
}
.twocolumn .right {
width: 50%;
float: right;
}
.price-list__item {
overflow: hidden;
border: 1px solid #d0d0d0;
border-radius: 10px;
margin: 0 0 10px;
}
@media screen and (max-width: 680px) {
.price-list__item {
margin: 10px 0;
}
}
.price-list__item input[type=radio] {
/*position: absolute;top: -9999px;left: -9999px;*/
display: none;
}
.price-list__item input[type=radio]:checked+.price-list__item__body {
background: #fa0052;
color: #fff !important;
}
.price-list__item input[type=radio]:checked+.price-list__item__body .price-list__text strong,
.price-list__item input[type=radio]:checked+.price-list__item__body .price-list__text span,
.price-list__item input[type=radio]:checked+.price-list__item__body .price-list__price {
color: #fff !important;
}
.price-list__item input[type=radio]:checked+.price-list__item__body .price-list__button {
background: #fa0052;
box-shadow: none;
}
.price-list__item__body {
display: block;
position: relative;
padding: 10px 15px 10px 45px;
cursor: pointer;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.price-list__button {
position: absolute;
top: 50%;
left: 13px;
margin: -8px 0 0 0;
border-radius: 50%;
background: #fff;
border: 4px solid #fff;
width: 16px;
height: 16px;
box-shadow: 0 0 1px 1px #ccc;
}
.price-list__text {
float: left;
padding: 8px 0;
width: 70%;
}
@media screen and (max-width: 680px) {
.price-list__text {
float: none;
width: 100%;
}
}
.price-list__text strong {
font-size: 24px;
color: #000;
display: block;
line-height: 1.1;
}
@media screen and (max-width: 480px) {
.price-list__text strong {
font-size: 16px;
}
}
.price-list__text span {
font-size: 12px;
color: #fa0052;
display: block;
}
@media screen and (max-width: 480px) {
.price-list__text span {
line-height: 1.2;
}
}
.price-list__price {
float: right;
font-weight: 900;
font-size: 36px;
line-height: 1.5;
color: #fa0052;
}
@media screen and (max-width: 680px) {
.price-list__price {
float: none;
}
}
@media screen and (max-width: 480px) {
.price-list__price {
width: auto;
font-size: 18px;
}
}
.profits__list {
padding: 0 0 0 30px;
}
@media screen and (max-width: 1023px) {
.profits__list {
padding: 0;
}
}
.profits__list__item {
font-size: 24px;
text-transform: uppercase;
color: #3b3b3b;
margin: 58px 0 0 0;
}
@media screen and (max-width: 1023px) {
.profits__list__item {
margin: 20px 0 0 0;
}
}
@media screen and (max-width: 480px) {
.profits__list__item {
font-size: 19px;
}
}
.profits__list__item:first-child {
margin: 0;
}
.profits__list .ico {
margin: 7px 10px 0 0;
vertical-align: middle;
float: left;
}
@media screen and (max-width: 480px) {
.profits__list .ico {
margin: 3px 10px 0 0;
}
}
.profits__list div {
overflow: hidden;
}
.link {
display: inline-block;
text-transform: uppercase;
font-size: 12px;
line-height: 1;
font-weight: 700;
}
.link:hover {
text-decoration: underline;
}
.link__holder {
display: inline-block;
vertical-align: middle;
}
.model-view {
background: #e7e7e8;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: relative;
}
.model-view:after {
width: 100%;
background: #191919;
color: #fff;
height: 64px;
position: absolute;
bottom: 0;
left: 0;
display: block;
clear: both;
content: "";
}
@media screen and (max-width: 992px) {
.model-view {
background: none;
display: block;
}
.model-view:after {
display: none;
}
}
.model-view .media-box__list span {
display: inline !important;
}
.model-view .img-holder {
position: relative;
z-index: 10;
}
@media screen and (max-width: 992px) {
.model-view .img-holder {
float: none !important;
width: 100%;
padding: 20px 0;
text-align: center;
}
}
.model-view .img-holder img {
width: 100%;
height: auto;
}
@media screen and (max-width: 992px) {
.model-view .img-holder img {
width: auto;
display: inline-block;
}
}
.media-container {
position: relative;
overflow: hidden;
}
@media screen and (max-width: 767px) {
.media-container .btn-play {
margin: -21.5px 0 0 -22.5px;
width: 45px;
height: 45px;
}
}
.media-container__join {
width: 100%;
background: #000;
position: relative;
/*display: table;*/
display: block;
text-align: center;
vertical-align: middle;
text-transform: uppercase;
}
.media-container__join__img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
}
.media-container__join__text {
/*display: table-cell;*/
display: block;
vertical-align: middle;
background: rgba(0, 0, 0, 0.8);
position: relative;
padding: 12% 0;
}
.media-container__join__text strong {
font-size: 120px;
display: block;
color: #fa0052;
line-height: 1;
}
@media screen and (max-width: 992px) {
.media-container__join__text strong {
font-size: 13vw;
}
}
.media-container__join__text span {
font-size: 60px;
display: block;
color: #fff;
}
@media screen and (max-width: 992px) {
.media-container__join__text span {
font-size: 5vw;
}
}
.media-container__join [class^="icon-"],
.media-container__join [class*=" icon-"] {
font-size: 150px;
color: #fff;
}
@media screen and (max-width: 992px) {
.media-container__join [class^="icon-"],
.media-container__join [class*=" icon-"] {
font-size: 15vw;
}
}
.media-carousel {
background: #e7e7e8;
}
.media-carousel .flexslider {
background: #e7e7e8;
padding: 22px;
border-bottom: 1px solid #d0d0d0;
}
.media-carousel .flexslider .flex-direction-nav a {
width: 60px;
}
.media-carousel .flexslider .flex-direction-nav a .rotated {
margin: -23px 0 0 -18px;
width: 37px;
height: 37px;
}
.media-carousel .flexslider .flex-direction-nav a .rotated i {
position: absolute;
top: 14%;
left: 33%;
}
@media screen and (max-width: 1023px) {
.media-carousel .flexslider .flex-direction-nav a {
height: 57px;
width: 57px;
top: 50%;
margin: -23px 0 0 0;
background: none;
}
}
.media-carousel__item {
position: relative;
background: #000;
}
.media-carousel__item .item {
display: block !important;
position: relative;
}
.media-carousel__item .item.selected {
pointer-events: none;
}
.media-carousel__item .item.selected .playing,
.media-carousel__item .playing {
opacity: 1;
visibility: visible;
}
.tooltiped {
position: relative;
}
.tooltip {
position: absolute;
top: -20px;
left: 50%;
background: #fff;
text-transform: uppercase;
font-size: 10px;
text-align: center;
color: #747474;
padding: 3px 5px;
min-width: 100px;
border: 1px solid #d0d0d0;
border-radius: 2px;
z-index: 1000;
white-space: nowrap;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.tooltip:after {
content: "";
position: absolute;
left: 50%;
bottom: -6px;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAGCAYAAAD+Bd/7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkE1MEFGMjY4NUZCMzExRTZCNTA1RkU0ODc2MEU3NjNCIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkE1MEFGMjY5NUZCMzExRTZCNTA1RkU0ODc2MEU3NjNCIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QTUwQUYyNjY1RkIzMTFFNkI1MDVGRTQ4NzYwRTc2M0IiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QTUwQUYyNjc1RkIzMTFFNkI1MDVGRTQ4NzYwRTc2M0IiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz64bbDJAAAAbUlEQVR42mK8cOECAxJIgdJzYAIsSJKWQDwVyr4KxMdBDCaogCQQr5GVlf0HwiA2EEvBFLCBBMTFxYWFhIR+gzCIDVXEBlIwRURExERCQuIXzC4QGyhmDJJjfPz48S8ZGZkfDFjAkydPOAACDACuxhrAH9bQEAAAAABJRU5ErkJggg==) no-repeat;
width: 8px;
height: 6px;
margin: 0 0 0 -4px;
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.drop-media li {
background: #fff;
margin: 3px 0;
}
.drop-media li:hover {
background: #7da530;
}
.drop-media li:hover a {
color: #fff;
}
.drop-media li a {
display: block;
padding: 3px 5px;
color: #828282;
text-transform: uppercase;
font-size: 12px;
text-align: center;
white-space: nowrap;
}
.drop-media li a.delete {
position: absolute;
right: 5px;
top: 3px;
margin: 0 0 0 10px;
padding: 0;
text-decoration: none;
}
.drop-media li span {
position: relative;
display: block;
}
.drop-media li span a {
padding: 3px 27px 3px 5px;
}
.previw__list {
overflow: hidden;
width: 100%;
padding: 0 0 10px;
line-height: 0;
font-size: 1px;
margin: -10px 0 0 -10px;
}
.previw__list__item {
float: left;
/*background: #000;*/
width: 20%;
padding: 10px 0 0 10px;
}
@media screen and (max-width: 480px) {
.previw__list__item {
width: 50%;
}
}
.previw__list__item img {
display: block;
width: 100%;
height: auto;
}
.previw__list:after {
width: 100%;
height: 0px;
visibility: hidden;
overflow: hidden;
content: '';
display: inline-block;
}
.mobile-menu-opener {
display: none;
}
@media screen and (max-width: 767px) {
.mobile-menu-opener {
display: block;
font-size: 31px;
float: right;
background: none;
border: none;
color: #303036;
padding: 0;
margin: 0 0 0 20px;
}
.mobile-menu-opener:hover {
color: #fa0052;
}
}
.fancybox-opened .fancybox-skin {
/*padding: 0 !important;background: none !important;box-shadow: none !important;*/
}
#modal-logon {
width: 617px;
background: url(/static/images/bg-main-top.jpg) no-repeat, url(/static/images/bg-main-bottom.jpg) no-repeat 0 100%;
}
#modal-forgot {
width: 617px;
background: url(/static/images/bg-main-top.jpg) no-repeat;
}
.fancybox-close {
/*background: none;border: none;width: 26px;height: 26px;font-size: 26px;line-height: 1;padding: 0;color: #949494;top: 15px;right: 15px;font-family: 'icomoon' !important;*/
text-indent: -9999px;
}
.fancybox-close:before {
content: "\e903";
}
.field-error {
display: none;
position: absolute;
left: 0;
top: 75%;
max-width: 400px;
padding: 1px 10px;
z-index: 9999;
/*margin: 2px 0 0 15px;*/
background: #F9F7F8;
color: #e44242;
font-weight: bold;
border: 1px solid #ccc;
}
.field-error:before {
content: "";
position: absolute;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #efefef;
left: 20px;
top: -10px;
}
.field-error:after {
content: "";
position: absolute;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #efefef;
left: 20px;
top: -9px;
}
.hidden {
display: none;
}
.captcha-control .image {
margin: 15px 0;
/*overflow: hidden;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.modal__window .captcha-control .image {
display: block;
}
.captcha-control .image img {
float: left;
}
@media screen and (max-width: 680px) {
.captcha-control .image img {
float: none;
margin: 0 0 10px;
}
}
.captcha-control .btn {
margin: 0;
}
.no-avatar {
width: 100%;
height: 100%;
display: block;
background-size: cover;
position: absolute;
top: 0;
left: 0;
}
.no-avatar span {
position: absolute;
top: 50%;
left: 0;
text-align: center;
width: 100%;
font-size: 90%;
font-weight: 900;
margin: -10px 0 0 0;
}
.slider__video {
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0;
visibility: hidden;
-webkit-transition: visibility .25s, opacity .25s;
transition: visibility .25s, opacity .25s;
z-index: 10;
background: #000;
}
.video_load {
opacity: 1;
visibility: visible;
}
.select-box,
.file-box {
position: relative;
display: inline-block;
width: 100%;
}
.file-box input[type=file] {
position: absolute;
top: 0;
left: 0;
width: 100%;
opacity: 0;
cursor: pointer;
z-index: 10;
height: 100%;
}
.select-box:after {
font-family: 'icomoon' !important;
content: "\f0a3";
color: #8a8a8a;
right: 15px;
top: 50%;
position: absolute;
pointer-events: none;
margin: -12px 0 0 0;
}
#modal-playlist {
width: 588px;
background: url(/static/images/bg-main-top.jpg) no-repeat;
}
#modal-playlist .input {
width: 100%;
margin: 0;
float: none;
}
#modal-playlist textarea {
height: 100px;
}
#modal-playlist .select-box--icon-lock select {
background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAPCAYAAAA/I0V3AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkYyNzlENUQyNzBGNjExRTZCQTg3RDk2MUZGMUUyRDVEIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkYyNzlENUQzNzBGNjExRTZCQTg3RDk2MUZGMUUyRDVEIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RjI3OUQ1RDA3MEY2MTFFNkJBODdEOTYxRkYxRTJENUQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RjI3OUQ1RDE3MEY2MTFFNkJBODdEOTYxRkYxRTJENUQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4pGuXXAAABDklEQVR42mL8//8/AwysWbOOHUjVAHECEMsA8RMgXgDELSEhQT9h6hhhmoAaWIDUdiBWBOJ6IL4KxNpA3AjE94HYE6jxD0gtCwMCJAOxFhAbACVfQ8UuAA3bBaKh8jNBgkxImsKAeAKSBjCA8idA5RnQNckD8W0G7OAyVB5DEwsDbvADWZ5x9eq174G0AAPx4CtItxEQ8xOpQQqIt4I09QJxLNDDX6FBzwyk6oDYHogPAnETUO4vVO4DzE+BQCyKZFo+EKcC8S4onY9uHRMWJ5gB8Ryg6W0gGspHAdhC7BQQFwOd8gMaob3EaJoIDRgPqE0T0RWAghyU+GyhiZMQACXiwyCbQKF2mJR4AggwANWIS1Kmzh+HAAAAAElFTkSuQmCC) no-repeat 15px 50%;
padding: 0 15px 0 40px;
}
/*#modal-playlist .btn__row {margin: 0;}*/
.check-box {
background: #fff;
border: 1px solid #d0d0d0;
padding: 20px;
}
.check-box__item {
overflow: hidden;
margin: 10px 0 0 0;
}
.check-box__item:first-child {
margin: 0;
}
.check-box__item.private {
background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAPCAYAAAA/I0V3AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkYyNzlENUQyNzBGNjExRTZCQTg3RDk2MUZGMUUyRDVEIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkYyNzlENUQzNzBGNjExRTZCQTg3RDk2MUZGMUUyRDVEIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RjI3OUQ1RDA3MEY2MTFFNkJBODdEOTYxRkYxRTJENUQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RjI3OUQ1RDE3MEY2MTFFNkJBODdEOTYxRkYxRTJENUQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4pGuXXAAABDklEQVR42mL8//8/AwysWbOOHUjVAHECEMsA8RMgXgDELSEhQT9h6hhhmoAaWIDUdiBWBOJ6IL4KxNpA3AjE94HYE6jxD0gtCwMCJAOxFhAbACVfQ8UuAA3bBaKh8jNBgkxImsKAeAKSBjCA8idA5RnQNckD8W0G7OAyVB5DEwsDbvADWZ5x9eq174G0AAPx4CtItxEQ8xOpQQqIt4I09QJxLNDDX6FBzwyk6oDYHogPAnETUO4vVO4DzE+BQCyKZFo+EKcC8S4onY9uHRMWJ5gB8Ryg6W0gGspHAdhC7BQQFwOd8gMaob3EaJoIDRgPqE0T0RWAghyU+GyhiZMQACXiwyCbQKF2mJR4AggwANWIS1Kmzh+HAAAAAElFTkSuQmCC) no-repeat 100% 50%;
}
.check-box__item.public {
background: #fff url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjJEMUVDMEY5NzBGNzExRTY5NURGRTkzN0E4RDFGRDM5IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjJEMUVDMEZBNzBGNzExRTY5NURGRTkzN0E4RDFGRDM5Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MkQxRUMwRjc3MEY3MTFFNjk1REZFOTM3QThEMUZEMzkiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MkQxRUMwRjg3MEY3MTFFNjk1REZFOTM3QThEMUZEMzkiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4kQPixAAABgElEQVR42qSTzytEURTH33tG2UoRhfxqeq9JkoWNMgsLKRoNVhZi4y+xlMxCCTVTU9OMH1lYKkUpNSU1kyWFqBlFijI9n6Pz6nqycuoz586753vOfeeeZ/u+bwVWKOxFcAswB4PQCM9QhBzsJJPTn0G8HYgRurhN6INm3a9AShMMQTcskaAsm44hPIMnFUr2A3iAD4LXYJ71jBTQeKsuFuuXox5CL7haUZJWYRyuPM99RTDGugRHkC6VyhlH37Gi1QJ7gxU4hUuEabwHrZzgHp8VnYgTWjViiO9ERGBUmgTSmDj/b3U/A5N2Pr9b1a6aVXsIfDSeSV86cR1Qr37WCQnF3vU1fhjJbqQ6TMAWDDh6DaY1wQaV4jAV2ktpx0XXID8XsB4KWoRjuS4StBnPl6Fd10URF0AufRVq1m9LGusReNF1LqLdPJEG6ASFj1rTho3KUWU24Fp03+OpE7MNXdASEp/rcbM6RFJ5WEY0PNv7ELX+NqmYCGbb/s9X9SXAAPL0ijLJJDXLAAAAAElFTkSuQmCC) no-repeat 100% 50%;
}
.check-box .checkbox {
display: none;
}
.check-box .checkbox:checked+.check-box__label:after {
content: "";
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAHCAYAAAAxrNxjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjIxMUM0MThBNzBGQjExRTZBREVFREY5NkFBNkEyOTYyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjIxMUM0MThCNzBGQjExRTZBREVFREY5NkFBNkEyOTYyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MjExQzQxODg3MEZCMTFFNkFERUVERjk2QUE2QTI5NjIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MjExQzQxODk3MEZCMTFFNkFERUVERjk2QUE2QTI5NjIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4Nw6/mAAAAMElEQVR42mL4//8/AyFsa2tLnCIQTZQisEJkDi5FcBPRBbFpxpDEZQMDIZNgGCDAAAtRxGlk+d37AAAAAElFTkSuQmCC) no-repeat;
width: 14px;
height: 9px;
position: absolute;
top: 50%;
left: 6px;
margin: -4.5px 0 0 0;
}
.check-box__label {
position: relative;
display: block;
cursor: pointer;
font-size: 12px;
color: #8a8a8a;
}
.check-box__label:before {
content: "";
width: 20px;
height: 20px;
border: 1px solid #d0d0d0;
background: #fff;
border-radius: 1px;
display: inline-block;
vertical-align: middle;
margin: 0 10px 0 0;
}
.list-sort:after {
display: block;
clear: both;
content: "";
}
.list-sort .title {
float: left;
margin: 0 0 0 10px;
}
.list-sort .title:first-child {
margin: 0;
}
.list-sort .title a {
color: #fa0052;
}
.list-sort .title a:hover {
color: #000;
}
#rating_container {
position: relative;
}
#rating_container .tooltip {
left: 50%;
margin: 0 0 0 -60px;
width: 120px;
top: -35px;
}
.vote-fake {
width: 0;
height: 0;
position: absolute;
background: red;
top: 0;
opacity: 0;
z-index: 100;
cursor: pointer;
}
.vote-fake__like {
left: 0;
height: 90%;
width: 60px;
}
.vote-fake__dislike {
right: 0;
height: 90%;
width: 60px;
}
.success {
color: #fff;
padding: 1em;
margin: 1em 0 0 0;
background: #8cc80d;
}
.options_buttons {
text-align: right;
}
.thumb .video2,
.thumb .video3,
.thumb .video4,
.thumb .video5 {
position: absolute;
width: 60px;
height: auto;
border: 2px solid #7c7c7c;
opacity: 0.8;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
filter: alpha(opacity=80);
}
.thumb .video2:hover,
.thumb .video3:hover,
.thumb .video4:hover,
.thumb .video5:hover {
z-index: 5;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
}
.thumb .video2 {
left: 25px;
top: 5px;
z-index: 3;
}
.thumb .video3 {
left: 15px;
top: 15px;
z-index: 2;
}
.thumb .video4 {
left: 5px;
top: 25px;
z-index: 1;
}
.playing {
position: absolute;
top: 0;
left: 0;
width: 185px;
height: 148px;
background: rgba(0, 0, 0, 0.7);
text-align: center;
color: #fa0052;
text-transform: uppercase;
font-size: 16px;
display: table;
opacity: 0;
visibility: hidden;
}
.playing__holder {
display: table-cell;
vertical-align: middle;
}
.playing__holder span {
display: block;
line-height: 1;
}
.playing__holder-btn {
background: #fa0052;
padding: 5px;
margin: 5px 20px 0 20px;
color: #ffffff;
cursor: pointer;
}
.playing__progress {
background: url(/static/images/playing-progress.png) no-repeat;
display: inline-block;
width: 84px;
height: 4px;
}
.--unstyled {
margin: 0;
}
[lang="pt"] .main-menu__user-menu .main-menu__drop a,
[lang="pt"] .main-menu__user-menu .main-menu__drop span {
font-size: 13px;
text-transform: none;
padding: 10px;
}
[lang="ru"] .main-menu__user-menu .main-menu__drop a,
[lang="ru"] .main-menu__user-menu .main-menu__drop span {
font-size: 12px;
padding: 10px;
}
[lang="ja"] .btn--middle,
[lang="tr"] .btn--middle,
[lang="de"] .btn--middle,
[lang="ru"] .btn--middle,
[lang="fr"] .btn--middle,
[lang="pt"] .btn--middle,
[lang="tr"] .btn--middle,
[lang="it"] .btn--middle {
font-size: 12px;
}
[lang="de"] .join-spot-01__title,
[lang="ru"] .join-spot-01__title,
[lang="fr"] .join-spot-01__title,
[lang="it"] .join-spot-01__title,
[lang="pt"] .join-spot-01__title,
[lang="tr"] .join-spot-01__title,
[lang="es"] .join-spot-01__title {
font-size: 52px;
}
[lang="de"] .btn--huge,
[lang="es"] .btn--huge,
[lang="fr"] .btn--huge,
[lang="it"] .btn--huge,
[lang="pt"] .btn--huge,
[lang="tr"] .btn--huge,
[lang="ru"] .btn--huge {
font-size: 36px;
}
@media screen and (max-width: 480px) {
[lang="de"] .btn--huge,
[lang="es"] .btn--huge,
[lang="fr"] .btn--huge,
[lang="it"] .btn--huge,
[lang="pt"] .btn--huge,
[lang="tr"] .btn--huge,
[lang="ru"] .btn--huge {
font-size: 20px;
}
}
[lang="de"] .btn--big,
[lang="es"] .btn--big,
[lang="fr"] .btn--big,
[lang="it"] .btn--big,
[lang="pt"] .btn--big,
[lang="tr"] .btn--big,
[lang="ru"] .btn--big {
font-size: 18px;
}
[lang="de"] .btn--duble strong,
[lang="es"] .btn--duble strong,
[lang="fr"] .btn--duble strong,
[lang="it"] .btn--duble strong,
[lang="pt"] .btn--duble strong,
[lang="tr"] .btn--duble strong,
[lang="ru"] .btn--duble strong {
font-size: 60px;
}
@media screen and (max-width: 480px) {
[lang="de"] .btn--duble strong,
[lang="es"] .btn--duble strong,
[lang="fr"] .btn--duble strong,
[lang="it"] .btn--duble strong,
[lang="pt"] .btn--duble strong,
[lang="tr"] .btn--duble strong,
[lang="ru"] .btn--duble strong {
font-size: 20px;
}
}
[lang="de"] .title__modal,
[lang="es"] .title__modal,
[lang="fr"] .title__modal,
[lang="it"] .title__modal,
[lang="pt"] .title__modal,
[lang="tr"] .title__modal,
[lang="ru"] .title__modal {
font-size: 26px;
}
[lang="de"] .title__note,
[lang="es"] .title__note,
[lang="fr"] .title__note,
[lang="it"] .title__note,
[lang="pt"] .title__note,
[lang="tr"] .title__note,
[lang="ru"] .title__note {
margin: 13px 0 0 0;
font-size: 14px;
}
[lang="de"] .join-spot-02__subtitle,
[lang="de"] .join-spot-02__title,
[lang="tr"] .join-spot-02__subtitle,
[lang="tr"] .join-spot-02__title,
[lang="es"] .join-spot-02__subtitle,
[lang="es"] .join-spot-02__title,
[lang="fr"] .join-spot-02__subtitle,
[lang="fr"] .join-spot-02__title,
[lang="pt"] .join-spot-02__subtitle,
[lang="pt"] .join-spot-02__title,
[lang="it"] .join-spot-02__subtitle,
[lang="it"] .join-spot-02__title,
[lang="ru"] .join-spot-02__subtitle,
[lang="ru"] .join-spot-02__title {
text-indent: 0px;
}
[lang="de"] .join-block-thin__text,
[lang="tr"] .join-block-thin__text,
[lang="es"] .join-block-thin__text,
[lang="fr"] .join-block-thin__text,
[lang="it"] .join-block-thin__text,
[lang="pt"] .join-block-thin__text,
[lang="ru"] .join-block-thin__text {
font-size: 24px;
}
.mark-color {
color: #fa0052;
}
.mark-color a {
color: #fa0052;
}
.mark-color2 {
color: #7da530;
}
.mark-color2 a {
color: #7da530;
}
.player .embed-wrap iframe,
#kt_player,
#kt_player_internal {
position: absolute !important;
left: 0 !important;
top: 0 !important;
width: 100% !important;
height: 100% !important;
}
/*== malihu jquery custom scrollbar plugin ==Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller*/
/*CONTENTS:1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.*/
/*------------------------------------------------------------------------------------------------------------------------1. BASIC STYLE------------------------------------------------------------------------------------------------------------------------*/
.mCustomScrollbar {
-ms-touch-action: pinch-zoom;
touch-action: pinch-zoom;
/* direct pointer events to js */
}
.mCustomScrollbar.mCS_no_scrollbar,
.mCustomScrollbar.mCS_touch_action {
-ms-touch-action: auto;
touch-action: auto;
}
.mCustomScrollBox {
/* contains plugin's markup */
position: relative;
overflow: hidden;
height: 100%;
max-width: 100%;
outline: none;
direction: ltr;
}
.mCSB_container {
/* contains the original content */
overflow: hidden;
width: auto;
height: auto;
}
/*------------------------------------------------------------------------------------------------------------------------2. VERTICAL SCROLLBARy-axis------------------------------------------------------------------------------------------------------------------------*/
.mCSB_inside>.mCSB_container {
margin-right: 30px;
}
.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
margin-right: 0;
}
/* non-visible scrollbar */
.mCS-dir-rtl>.mCSB_inside>.mCSB_container {
/* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCS-dir-rtl>.mCSB_inside>.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
margin-left: 0;
}
/* RTL direction/left-side scrollbar */
.mCSB_scrollTools {
/* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
position: absolute;
width: 16px;
height: auto;
left: auto;
top: 0;
right: 0;
bottom: 0;
}
.mCSB_outside+.mCSB_scrollTools {
right: -26px;
}
/* scrollbar position: outside */
.mCS-dir-rtl>.mCSB_inside>.mCSB_scrollTools,
.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools {
/* RTL direction/left-side scrollbar */
right: auto;
left: 0;
}
.mCS-dir-rtl>.mCSB_outside+.mCSB_scrollTools {
left: -26px;
}
/* RTL direction/left-side scrollbar (scrollbar position: outside) */
.mCSB_scrollTools .mCSB_draggerContainer {
/* contains the draggable element and dragger rail markup */
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
height: auto;
}
.mCSB_scrollTools a+.mCSB_draggerContainer {
margin: 20px 0;
}
.mCSB_scrollTools .mCSB_draggerRail {
width: 2px;
height: 100%;
margin: 0 auto;
border-radius: 16px;
}
.mCSB_scrollTools .mCSB_dragger {
/* the draggable element */
cursor: pointer;
width: 100%;
height: 30px;
/* minimum dragger height */
z-index: 1;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
/* the dragger element */
position: relative;
width: 4px;
height: 100%;
margin: 0 auto;
border-radius: 16px;
text-align: center;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
width: 12px;
/* auto-expanded scrollbar */
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 8px;
/* auto-expanded scrollbar */
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown {
display: block;
position: absolute;
height: 20px;
width: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools .mCSB_buttonDown {
bottom: 0;
}
/*------------------------------------------------------------------------------------------------------------------------3. HORIZONTAL SCROLLBARx-axis------------------------------------------------------------------------------------------------------------------------*/
.mCSB_horizontal.mCSB_inside>.mCSB_container {
margin-right: 0;
margin-bottom: 30px;
}
.mCSB_horizontal.mCSB_outside>.mCSB_container {
min-height: 100%;
}
.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
margin-bottom: 0;
}
/* non-visible scrollbar */
.mCSB_scrollTools.mCSB_scrollTools_horizontal {
width: auto;
height: 16px;
top: auto;
right: 0;
bottom: 0;
left: 0;
}
.mCustomScrollBox+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
bottom: -26px;
}
/* scrollbar position: outside */
.mCSB_scrollTools.mCSB_scrollTools_horizontal a+.mCSB_draggerContainer {
margin: 0 20px;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 2px;
margin: 7px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 30px;
/* minimum dragger width */
height: 100%;
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
height: 12px;
/* auto-expanded scrollbar */
margin: 2px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 8px;
/* auto-expanded scrollbar */
margin: 4px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
display: block;
position: absolute;
width: 20px;
height: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft {
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight {
right: 0;
}
/*------------------------------------------------------------------------------------------------------------------------4. VERTICAL AND HORIZONTAL SCROLLBARSyx-axis------------------------------------------------------------------------------------------------------------------------*/
.mCSB_container_wrapper {
position: absolute;
height: auto;
width: auto;
overflow: hidden;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin-right: 30px;
margin-bottom: 30px;
}
.mCSB_container_wrapper>.mCSB_container {
padding-right: 30px;
padding-bottom: 30px;
box-sizing: border-box;
}
.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_vertical {
bottom: 20px;
}
.mCSB_vertical_horizontal>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
right: 20px;
}
/* non-visible horizontal scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden+.mCSB_scrollTools.mCSB_scrollTools_vertical {
bottom: 0;
}
/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
right: 0;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_scrollTools.mCSB_scrollTools_horizontal {
left: 20px;
}
/* non-visible scrollbar/RTL direction/left-side scrollbar */
.mCS-dir-rtl>.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden+.mCSB_scrollTools~.mCSB_scrollTools.mCSB_scrollTools_horizontal {
left: 0;
}
.mCS-dir-rtl>.mCSB_inside>.mCSB_container_wrapper {
/* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden>.mCSB_container {
padding-right: 0;
}
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden>.mCSB_container {
padding-bottom: 0;
}
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden {
margin-right: 0;
/* non-visible scrollbar */
margin-left: 0;
}
/* non-visible horizontal scrollbar */
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside>.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden {
margin-bottom: 0;
}
/*------------------------------------------------------------------------------------------------------------------------5. TRANSITIONS------------------------------------------------------------------------------------------------------------------------*/
.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
-webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail {
-webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out;
}
/*------------------------------------------------------------------------------------------------------------------------6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS------------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------6.1 THEMES----------------------------------------*/
/* default theme ("light") */
.mCSB_scrollTools {
opacity: 0.75;
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCS-autoHide>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide>.mCustomScrollBox~.mCSB_scrollTools {
opacity: 0;
filter: "alpha(opacity=0)";
-ms-filter: "alpha(opacity=0)";
}
.mCustomScrollbar>.mCustomScrollBox>.mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar>.mCustomScrollBox~.mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover>.mCSB_scrollTools,
.mCustomScrollBox:hover~.mCSB_scrollTools,
.mCS-autoHide:hover>.mCustomScrollBox>.mCSB_scrollTools,
.mCS-autoHide:hover>.mCustomScrollBox~.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=100)";
-ms-filter: "alpha(opacity=100)";
}
.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.4);
filter: "alpha(opacity=40)";
-ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
filter: "alpha(opacity=85)";
-ms-filter: "alpha(opacity=85)";
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
filter: "alpha(opacity=90)";
-ms-filter: "alpha(opacity=90)";
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight {
background-image: url(mCSB_buttons.png);
/* css sprites */
background-repeat: no-repeat;
opacity: 0.4;
filter: "alpha(opacity=40)";
-ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_buttonUp {
background-position: 0 0;
/*sprites locationslight: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72pxdark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px*/
}
.mCSB_scrollTools .mCSB_buttonDown {
background-position: 0 -20px;
/*sprites locationslight: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92pxdark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px*/
}
.mCSB_scrollTools .mCSB_buttonLeft {
background-position: 0 -40px;
/*sprites locationslight: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112pxdark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px*/
}
.mCSB_scrollTools .mCSB_buttonRight {
background-position: 0 -56px;
/*sprites locationslight: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128pxdark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px*/
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover {
opacity: 0.75;
filter: "alpha(opacity=75)";
-ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active {
opacity: 0.9;
filter: "alpha(opacity=90)";
-ms-filter: "alpha(opacity=90)";
}
/* theme: "dark" */
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px 0;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -20px;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -40px;
}
.mCS-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -56px;
}
/* ---------------------------------------- */
/* theme: "light-2", "dark-2" */
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px 0;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -20px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -40px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -56px;
}
/* theme: "dark-2" */
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px 0;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -20px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -40px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -56px;
}
/* ---------------------------------------- */
/* theme: "light-thick", "dark-thick" */
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
width: 4px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 4px;
margin: 6px 0;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 6px;
margin: 5px auto;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -16px 0;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -16px -20px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -20px -40px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -20px -56px;
}
/* theme: "dark-thick" */
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -96px 0;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -96px -20px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -100px -40px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -100px -56px;
}
/* ---------------------------------------- */
/* theme: "light-thin", "dark-thin" */
.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.1);
}
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 2px;
}
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
}
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 2px;
margin: 7px auto;
}
/* theme "dark-thin" */
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px 0;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -20px;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -40px;
}
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -56px;
}
/* ---------------------------------------- */
/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.15);
}
.mCS-rounded.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger {
height: 14px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 14px;
margin: 0 1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 14px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 14px;
margin: 1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
width: 16px;
/* auto-expanded scrollbar */
height: 16px;
margin: -1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 4px;
/* auto-expanded scrollbar */
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar {
height: 16px;
/* auto-expanded scrollbar */
width: 16px;
margin: 0 -1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 4px;
/* auto-expanded scrollbar */
margin: 6px 0;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp {
background-position: 0 -72px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown {
background-position: 0 -92px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft {
background-position: 0 -112px;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight {
background-position: 0 -128px;
}
/* theme "rounded-dark", "rounded-dots-dark" */
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.15);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -80px -72px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -80px -92px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -80px -112px;
}
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -80px -128px;
}
/* theme "rounded-dots", "rounded-dots-dark" */
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail {
width: 4px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
background-color: transparent;
background-position: center;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
background-repeat: repeat-y;
opacity: 0.3;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
height: 4px;
margin: 6px 0;
background-repeat: repeat-x;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp {
background-position: -16px -72px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown {
background-position: -16px -92px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -20px -112px;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight {
background-position: -20px -128px;
}
/* theme "rounded-dots-dark" */
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -96px -72px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -96px -92px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -100px -112px;
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -100px -128px;
}
/* ---------------------------------------- */
/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-repeat: repeat-y;
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
background-repeat: repeat-x;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.5)), color-stop(100%, rgba(255, 255, 255, 0)));
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
}
/* theme "3d", "3d-dark" */
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger {
height: 70px;
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 70px;
}
.mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
border-radius: 16px;
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
width: 8px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2);
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #555;
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 8px;
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 8px;
margin: 4px 0;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
width: 100%;
height: 8px;
margin: 4px auto;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "3d-dark" */
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1);
}
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme: "3d-thick", "3d-thick-dark" */
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools {
opacity: 1;
filter: "alpha(opacity=30)";
-ms-filter: "alpha(opacity=30)";
}
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
border-radius: 7px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
border-radius: 5px;
}
.mCSB_inside+.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCSB_inside+.mCS-3d-thick-dark.mCSB_scrollTools_vertical {
right: 1px;
}
.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCS-3d-thick-dark.mCSB_scrollTools_vertical {
box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}
.mCS-3d-thick.mCSB_scrollTools_horizontal,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
bottom: 1px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4);
width: 12px;
margin: 2px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #555;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 12px;
width: auto;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer {
background-color: #000;
background-color: rgba(0, 0, 0, 0.05);
box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme: "3d-thick-dark" */
.mCS-3d-thick-dark.mCSB_scrollTools {
box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #777;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer {
background-color: #fff;
background-color: rgba(0, 0, 0, 0.05);
box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme: "minimal", "minimal-dark" */
.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical {
right: 0;
margin: 12px 0;
}
.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark+.mCSB_scrollTools+.mCSB_scrollTools.mCSB_scrollTools_horizontal {
bottom: 0;
margin: 0 12px;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl>.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical,
.mCS-dir-rtl>.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical {
left: 0;
right: auto;
}
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
}
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger {
height: 50px;
}
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger {
width: 50px;
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.2);
filter: "alpha(opacity=20)";
-ms-filter: "alpha(opacity=20)";
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.5);
filter: "alpha(opacity=50)";
-ms-filter: "alpha(opacity=50)";
}
/* theme: "minimal-dark" */
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
filter: "alpha(opacity=20)";
-ms-filter: "alpha(opacity=20)";
}
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.5);
filter: "alpha(opacity=50)";
-ms-filter: "alpha(opacity=50)";
}
/* ---------------------------------------- */
/* theme "light-3", "dark-3" */
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
width: 6px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
}
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
}
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 6px;
margin: 5px 0;
}
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
width: 12px;
}
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded+.mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail {
height: 12px;
margin: 2px 0;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "dark-3" */
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* ---------------------------------------- */
/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
width: 12px;
background-color: #000;
background-color: rgba(0, 0, 0, 0.2);
}
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
width: 6px;
margin: 3px 5px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
height: 6px;
margin: 5px 3px;
position: absolute;
width: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail {
width: 100%;
height: 12px;
margin: 2px 0;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp {
background-position: -32px -72px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown {
background-position: -32px -92px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -40px -112px;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight {
background-position: -40px -128px;
}
/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.1);
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp {
background-position: -112px -72px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown {
background-position: -112px -92px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft {
background-position: -120px -112px;
}
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight {
background-position: -120px -128px;
}
/* theme "inset-2", "inset-2-dark" */
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: transparent;
border-width: 1px;
border-style: solid;
border-color: #fff;
border-color: rgba(255, 255, 255, 0.2);
box-sizing: border-box;
}
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail {
border-color: #000;
border-color: rgba(0, 0, 0, 0.2);
}
/* theme "inset-3", "inset-3-dark" */
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.6);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail {
background-color: #000;
background-color: rgba(0, 0, 0, 0.6);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.85);
}
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #000;
background-color: rgba(0, 0, 0, 0.9);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.75);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.85);
}
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar {
background-color: #fff;
background-color: rgba(255, 255, 255, 0.9);
}
.text-block html,
.text-block address,
.text-block blockquote,
.text-block body,
.text-block dd,
.text-block div,
.text-block dl,
.text-block dt,
.text-block fieldset,
.text-block form,
.text-block frame,
.text-block frameset,
.text-block h1,
.text-block h2,
.text-block h3,
.text-block h4,
.text-block h5,
.text-block h6,
.text-block noframes,
.text-block ol,
.text-block p,
.text-block ul,
.text-block center,
.text-block dir,
.text-block hr,
.text-block menu,
.text-block pre {
display: block;
unicode-bidi: embed
}
.text-block li {
display: list-item;
margin: 1em 0;
}
.text-block head {
display: none
}
.text-block table {
display: table
}
.text-block tr {
display: table-row
}
.text-block thead {
display: table-header-group
}
.text-block tbody {
display: table-row-group
}
.text-block tfoot {
display: table-footer-group
}
.text-block col {
display: table-column
}
.text-block colgroup {
display: table-column-group
}
.text-block td,
.text-block th {
display: table-cell
}
.text-block caption {
display: table-caption
}
.text-block th {
font-weight: bolder;
text-align: center
}
.text-block caption {
text-align: center
}
.text-block body {
margin: 8px
}
.text-block h1 {
font-size: 2em;
margin: .67em 0
}
.text-block h2 {
font-size: 1.5em;
margin: .75em 0
}
.text-block h3 {
font-size: 1.17em;
margin: .83em 0
}
.text-block h4,
.text-block p,
.text-block blockquote,
.text-block ul,
.text-block fieldset,
.text-block form,
.text-block ol,
.text-block dl,
.text-block dir,
.text-block menu {
margin: 1.12em 0
}
.text-block h5 {
font-size: .83em;
margin: 1.5em 0
}
.text-block h6 {
font-size: .75em;
margin: 1.67em 0
}
.text-block h1,
.text-block h2,
.text-block h3,
.text-block h4,
.text-block h5,
.text-block h6,
.text-block b,
.text-block strong {
font-weight: bolder
}
.text-block blockquote {
margin-left: 40px;
margin-right: 40px
}
.text-block i,
.text-block cite,
.text-block em,
.text-block var,
.text-block address {
font-style: italic
}
.text-block pre,
.text-block tt,
.text-block code,
.text-block kbd,
.text-block samp {
font-family: monospace
}
.text-block pre {
white-space: pre
}
.text-block button,
.text-block textarea,
.text-block input,
.text-block select {
display: inline-block
}
.text-block big {
font-size: 1.17em
}
.text-block small,
.text-block sub,
.text-block sup {
font-size: .83em
}
.text-block sub {
vertical-align: sub
}
.text-block sup {
vertical-align: super
}
.text-block table {
border-spacing: 2px;
}
.text-block thead,
.text-block tbody,
.text-block tfoot {
vertical-align: middle
}
.text-block td,
.text-block th,
.text-block tr {
vertical-align: inherit
}
.text-block s,
.text-block strike,
.text-block del {
text-decoration: line-through
}
.text-block hr {
border: 1px inset
}
.text-block ol,
.text-block ul,
.text-block dir,
.text-block menu,
.text-block dd {
margin-left: 40px
}
.text-block ol {
list-style-type: decimal
}
.text-block ol ul,
.text-block ul ol,
.text-block ul ul,
.text-block ol ol {
margin-top: 0;
margin-bottom: 0
}
.text-block u,
.text-block ins {
text-decoration: underline
}
.text-block center {
text-align: center
}
.text-block :link,
.text-block :visited {
text-decoration: underline
}
.text-block :focus {
outline: thin dotted invert
}
/* Begin bidirectionality settings (do not change) */
.text-block BDO[DIR="ltr"] {
direction: ltr;
unicode-bidi: bidi-override
}
.text-block BDO[DIR="rtl"] {
direction: rtl;
unicode-bidi: bidi-override
}
.text-block *[DIR="ltr"] {
direction: ltr;
unicode-bidi: embed
}
.text-block *[DIR="rtl"] {
direction: rtl;
unicode-bidi: embed
}
#languages_drop {
right: -10px !important;
}
#languages_drop .drop-inner a {
font-weight: 400;
}
@media screen and (max-width: 767px) {
#languages_drop .drop-inner li {
margin: 0;
}
#languages_drop .drop-inner a {
padding: 0 8px;
}
}
#modal-signup .captcha-control .image img {
margin: 0 10px 0 0;
}
.empty-content {
margin: 0 0 20px;
}
.modal__window .relative {
position: relative;
float: right;
width: 60%;
}
.relative {
position: relative;
}
@media screen and (max-width: 680px) {
.modal__window .relative,
.relative {
width: 100%;
float: none;
display: block;
}
.captcha-control .image {
display: block;
}
.captcha-control .relative {
margin: 10px 0 0 0;
}
}
.relative:after {
display: block;
clear: both;
content: ""
}
.generic-error {
color: #fff;
padding: 1em;
margin: 1em 0 0 0;
background: #fa0052;
}
.thumbs .generic-error {
margin: 0 0 1em 0;
}
.media-models {
margin: -20px 0 0 0;
}
.media-model {
margin: 20px 20px 0 0;
}
#screenshots_list {
margin: 0 0 15px;
}
.media-desc {
margin: 0 0 10px;
}
.model_column {
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
padding: 10px;
background: #f1f1f1;
border-radius: 5px;
}
.model_column .btn {
background: #fa0052;
color: #fff;
}
.thumb img {
border-radius: 5px;
border: 2px solid transparent;
}
.thumb:hover img {
border: 2px solid #fa0052;
}
.thumb video {
border-radius: 5px;
padding: 2px;
background: #fa0052 !important;
}
.btn--color:hover,
.btn--full-width:hover {
background: #fff;
color: #fa0052;
border: 2px solid #fa0052;
}
.payment_choice {
display: flex;
align-items: center;
flex-wrap: nowrap;
justify-content: space-between;
margin: 0 0 20px;
}
.payment_choice .payment {
display: flex;
align-items: center;
flex-wrap: nowrap;
width: 48%;
padding: 5px 10px;
border-radius: 0;
border: 1px solid #fa0052;
cursor: pointer;
border-radius: 10px;
}
.payment_choice .payment.opacity {
opacity: 0.5;
cursor: default;
pointer-events: none;
}
.payment_choice .payment.action {
background: #fa0052;
color: #fff;
}
.payment_choice .payment svg {
width: 50px;
height: 50px;
}
.payment_choice .payment span {
margin: 0 0 0 10px;
padding: 0 !important;
}
.payment_choice .payment .cryptoHide {
margin: 0;
}
@media screen and (max-width: 420px) {
.payment_choice .payment .cryptoHide {
display: none;
}
}
.payment_choice .payment span::before {
display: none;
}
.row.second .toggle-button .plane-info,
.row.second .toggle-button .plane-info span,
.row.second .toggle-button .price-block,
.row.second .toggle-button .price-block span {
padding: 0 !important;
}
.row.second .toggle-button .plane-info::before,
.row.second .toggle-button .plane-info span::before,
.row.second .toggle-button .price-block::before,
.row.second .toggle-button .price-block span::before {
display: none;
}
.popup_checkbox-plane .m-cont {
display: flex;
align-items: center;
width: 100%;
justify-content: space-between;
}
.popup_checkbox-plane .plane-info {
display: flex;
flex-direction: column;
flex-shrink: 1;
flex-grow: 1;
min-width: 1px;
position: relative;
z-index: 2;
margin-right: 10px;
}
.popup_checkbox-plane .plane-info .plane-info-txt {
color: #000;
font-size: 12px;
font-weight: 400;
line-height: 1;
letter-spacing: 0.3px;
display: block;
transition: all .2s ease-in-out;
}
.popup_checkbox-plane .plane-info strong {
color: #000;
font-size: 30px;
font-weight: 700;
line-height: 1;
white-space: nowrap;
display: flex;
align-items: center;
}
@media (max-width: 450px) {
.popup_checkbox-plane .plane-info strong,
.popup_checkbox-plane .popup__payment-title {
white-space: normal;
font-size: 21px;
}
}
@media (max-width: 350px) {
.popup_checkbox-plane .plane-info strong {
font-size: 18px;
}
}
.popup_checkbox-plane .info-payment {
color: #000;
font-size: 12px;
font-weight: 400;
line-height: 1;
display: block;
transition: all .2s ease-in-out;
}
.popup_checkbox-plane .price-block {
text-align: center;
display: flex;
width: fit-content;
flex-shrink: 0;
}
@media (max-width: 767px) {
.popup_checkbox-plane .price-block {
margin: 0 !important;
}
}
.popup_checkbox-plane .price-block.price-block-2 {
text-align: center;
display: flex;
width: fit-content;
flex-shrink: 0;
position: relative;
z-index: 2;
}
.popup_checkbox-plane .price-block.price-block-2 {
position: relative;
top: 3px;
}
@media (max-width: 767px) {
.popup_checkbox-plane .price-block.price-block-2 {
padding-left: 0;
height: 62px;
justify-content: flex-end;
}
}
@media (max-width: 410px) {
.popup_checkbox-plane .price-block.price-block-2 {
padding: 0;
}
}
.popup_checkbox-plane .price-block .currency {
color: #000;
font-size: 36px;
font-weight: 700;
line-height: 49px;
}
@media (max-width: 767px) {
.popup_checkbox-plane .price-block .currency {
font-size: 36px;
line-height: 48px;
}
}
@media (max-width: 450px) {
.popup_checkbox-plane .price-block .currency {
font-size: 28px;
line-height: 50px;
}
}
.popup_checkbox-plane .price-block .value {
font-size: 80px;
font-weight: 700;
text-align: center;
letter-spacing: -1.58px;
}
@media (max-width: 767px) {
.popup_checkbox-plane .price-block .value {
font-size: 60px;
line-height: 60px;
}
}
@media (max-width: 410px) {
.popup_checkbox-plane .price-block .value {
font-size: 40px;
}
}
.popup_checkbox-plane .price-block.price-block-2 .value {
font-size: 54px;
align-items: flex-start;
display: flex;
letter-spacing: -1.07px;
line-height: 1;
color: #000;
}
/* @media (max-width: 410px) {.popup_checkbox-plane .price-block.price-block-2 .value {font-size: 48px;line-height: 66px;}} */
@media (max-width: 410px) {
.popup_checkbox-plane .price-block.price-block-2 .value .dollar {
padding-right: 3px;
}
}
.popup_checkbox-plane .price-block.price-block-2 .value .cent {
font-size: 30px;
margin-top: 3px;
}
/* @media (max-width: 410px) {.popup_checkbox-plane .price-block.price-block-2 .value .cent {font-size: 24px;margin-top: 4px;line-height: 43px;}} */
@media (max-width: 450px) {
.popup_checkbox-plane .price-block.price-block-2 .value {
font-size: 40px;
line-height: 58px;
}
.popup_checkbox-plane .price-block.price-block-2 .value .cent {
font-size: 23px;
margin-top: 3px;
line-height: 43px;
}
}
@media (max-width: 350px) {
.popup_checkbox-plane .price-block.price-block-2 .value {
font-size: 34px;
line-height: 58px;
}
.popup_checkbox-plane .price-block.price-block-2 .value .cent {
font-size: 19px;
margin-top: 3px;
line-height: 43px;
}
}
.popup_checkbox-plane .price-block.price-block-2 .date {
color: #000;
font-size: 14px;
font-weight: 700;
line-height: 1;
position: absolute;
bottom: 8px;
}
.popup_checkbox-plane .price-block.price-block-2 .month {
right: -25px;
right: -8px;
}
.popup_checkbox-plane .price-block.price-block-2 .month.year {
right: -5px;
}
@media screen and (max-width: 450px) {
.popup_checkbox-plane .price-block.price-block-2 .month {
right: -8px;
}
.popup_checkbox-plane .price-block.price-block-2 .month.year {
right: -8px;
}
}
@media screen and (max-width: 350px) {
.popup_checkbox-plane .price-block.price-block-2 .month {
right: -18px;
}
/* .popup_checkbox-plane .price-block.price-block-2 .month.year {right: -8px;} */
}
@media (max-width: 767px) {
.popup_checkbox-plane .price-block.price-block-2 .date {
bottom: 16px;
}
}
@media (max-width: 410px) {
.popup_checkbox-plane .price-block.price-block-2 .date {
font-size: 12px;
bottom: 12px;
}
}
@media (max-width: 450px) {
.popup_checkbox-plane .price-block.price-block-2 .date {
font-size: 12px;
bottom: 16px;
}
}
@media (max-width: 350px) {
.popup_checkbox-plane .price-block.price-block-2 .date {
font-size: 12px;
bottom: 18px;
}
}
.toggle-button .radio:checked+.m-cont * {
color: #fff !important;
}
.toggle-button .radio:checked+.m-cont::after {
content: '';
display: block;
left: -30px;
top: -10px;
right: -30px;
bottom: -10px;
background: #fa0052;
position: absolute;
z-index: 0;
}
.row.second .toggle-button {
min-width: 430px;
}
@media screen and (max-width: 650px) {
.row.second .toggle-button {
min-width: auto;
}
}
.modul_help_btn {
text-align: center;
margin: 5px 0 10px;
}
.modul_help_btn a {
color: #fa0052;
text-decoration: underline;
}
@media screen and (min-width: 1024px) {
.modul_help_btn a:hover {
text-decoration: none;
}
}
.video_modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 1);
z-index: 9;
display: flex;
align-items: center;
justify-content: center;
display: none;
}
.video_modal_show .video_modal {
display: flex;
}
.video_modal>div {
position: relative;
}
.btn-close2 {
top: -20px;
right: -20px;
}
.waiting_payment {
text-align: center;
background: #fa0052;
color: #fff;
padding: 5px;
}
@media (max-width:450px) {
.row.second .toggle-button {
padding-left: 10px !important;
padding-right: 25px;
}
}
.player-inner video {
display: block;
width: 100%;
}
.row.mb0 {
margin-bottom: 0;
}
.video_tutorial {
margin-top: 15px;
}
.video_tutorial-title {
font-weight: 400;
font-size: 18px;
line-height: 25px;
color: #333739;
margin-bottom: 15px;
}
@media screen and (max-width: 450px) {
.video_tutorial-title {
margin-bottom: 0;
font-size: 16px;
}
}
.video_tutorial video {
width: 100%;
overflow: hidden;
border-radius: 8px;
border: 1px solid #fa0052;
}
.row-wrapper .form .btn-buy,
.btn-buy {
text-align: center;
max-width: unset;
width: 100%;
margin-top: 10px;
}
.payment_holder .radio {
opacity: 0;
visibility: hidden;
width: 0;
height: 0;
}
.row-wrapper .form .btn.btn-full,
.btn-full {
background-color: #fa0052;
color: #fff;
max-width: unset;
width: 100%;
text-align: center;
padding: 8px 10px;
border: 2px solid #fa0052;
}
@media screen and (min-width: 1025px) {
.row-wrapper .form .btn.btn-full:hover,
.btn-full:hover {
background-color: transparent;
color: #fa0052;
}
}
.login-link {
background-color: transparent;
color: #fa0052;
transition: background-color .3s, color .3s;
}
@media screen and (min-width: 1025px) {
.login-link:hover {
background-color: #fa0052;
color: #fff;
}
}
.heading .search-wrapper {
display: block;
flex-shrink: 0;
max-width: 300px;
margin: 0 10px;
order: unset;
}
@media screen and (max-width: 768px) {
.heading:has(.search-wrapper) {
flex-direction: column;
}
.heading:has(.search-wrapper)>* {
padding: 5px 10px;
}
.heading:has(.search-wrapper) .btn {
margin: 5px 0 0;
display: inline-block;
}
}
.player-holder+.thumb-holder {
flex-wrap: nowrap;
margin: 10px 0 0;
overflow-x: auto;
padding-bottom: 5px;
-ms-overflow-style: none;
scrollbar-width: none;
}
@media screen and (max-width: 1024px) {
.player-holder+.thumb-holder {
-ms-overflow-style: none;
scrollbar-width: none;
}
.player-holder+.thumb-holder::-webkit-scrollbar {
display: none;
}
}
@media screen and (min-width: 1025px) {
.player-holder+.thumb-holder::-webkit-scrollbar {
height: 7px;
width: 7px;
}
.player-holder+.thumb-holder::-webkit-scrollbar-track {
height: 7px;
border-radius: 10px;
width: 7px
}
.player-holder+.thumb-holder::-webkit-scrollbar-thumb {
background: #e7e8ef;
border-radius: 10px;
}
}
.player-holder+.thumb-holder .item {
margin-bottom: 0;
flex-shrink: 0;
}
@media screen and (max-width: 720px) {
.player-holder+.thumb-holder .item {
width: 29%;
padding: 0 1px;
}
}
@media screen and (max-width: 480px) {
.player-holder+.thumb-holder .item {
width: 40%;
}
}
.fancybox-overlay-fixed.hidden {
display: none !important;
}
.fancybox-image {
height: auto !important;
}
.tezfile-login {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 0 10px 20px;
width: 100%;
}
.tezfile-login span {
padding: 15px 0 10px;
}
.tezfile-login a {
display: inline-block;
border-radius: 0;
border-radius: 10px;
overflow: hidden;
position: relative;
width: 100%;
min-height: 48px;
max-width: 570px;
}
.tezfile-login a img {
position: absolute;
top: 0;
width: auto;
left: 50%;
transform: translateX(-50%);
height: 100%;
}
.payment_choice.new {
align-items: stretch;
}
.payment_choice.new .payment {
width: 33%;
width: 49%;
}
.payment_choice a.payment {
padding: 0;
line-height: 0;
font-size: 0;
position: relative;
overflow: hidden;
display: inline-block;
}
.payment_choice a.payment img {
position: absolute;
height: calc(100% + 2px);
width: auto;
left: 50%;
transform: translateX(-50%);
top: -1px;
}
@media screen and (max-width: 800px) {
.payment_choice.new {
flex-wrap: wrap;
}
.payment_choice.new .payment {
width: 48%;
}
.payment_choice.new .payment:last-child {
margin: 10px auto 0;
}
}
.list-posts .thumb-inner .model-info {
margin: 0;
}
.list-posts .thumb-inner .model-info .rating {
margin: 0 10px 0 0;
}
.list-posts .description {
overflow: hidden;
height: 36px;
margin: 0 0 5px;
color: #000;
display: inline-block;
}
.no_thumb {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 1px solid #fa0052;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
color: #fa0052;
}
.mobile-blocks-holder,
.blocks-holder {
text-align: center;
margin-bottom: 15px;
}
.mobile-blocks-holder .block,
.blocks-holder .block {
display: inline-block;
vertical-align: middle;
}
@media screen and (max-width: 1230px) {
.blocks-holder .block:nth-child(4) {
display: none;
}
}
@media screen and (max-width: 930px) {
.blocks-holder .block:nth-child(3) {
display: none;
}
}
@media screen and (max-width: 630px) {
.blocks-holder .block:nth-child(2) {
display: none;
}
}
.price-list__item .price-list__item__body * {
transition: all 0s !important;
}
.price-list__item input[type=radio]:checked+.price-list__item__body * {
color: #fff !important;
}
.price-list__item input[type=radio]:checked+.price-list__item__body {
background: #fa0052;
color: #fff !important;
}
#modal-signup .twocolumn .left {
width: 60%;
}
#modal-signup .twocolumn .right {
width: 40%;
}
.js-submit-access_upgrade2,
.js-submit-access {
margin-top: 10px !important;
}
#modal-signup .row {
position: relative;
}
#modal-signup .row .input {
float: none;
}
.waiting_payment {
text-align: center;
background: #fa0052;
color: #fff;
padding: 5px;
}
.thumb--videos a .tip {
position: absolute;
left: -4px;
top: 0;
}
.thumb--videos a .tip.second {
background-color: #fa0052;
color: #fff;
transform: rotate(-45deg);
padding: 4px 30px;
left: -32px;
top: 15px;
font-size: 12px;
text-transform: uppercase;
box-shadow: 0px 3px 5px rgb(0, 0, 0, 0.3);
}
.player-inner {
position: relative;
border-radius: 8px;
overflow: hidden;
}
.access-info:before {
content: '';
position: absolute;
background: rgba(255, 255, 255, .1);
/* backdrop-filter: blur(6px); */
border-radius: 8px;
width: 100%;
height: 100%;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 1;
}
.player-inner video {
display: block;
width: 100%;
height: auto;
}
#preview_video {
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
width: 100%;
height: auto;
position: absolute;
top: 0;
left: 0;
}
.access-info .info-tip {
position: absolute;
z-index: 2;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background: rgba(255, 255, 255, .7);
backdrop-filter: blur(6px);
border-radius: 8px;
max-width: 580px;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
padding: 30px 10px;
}
.main_columns {
display: flex;
align-items: flex-start;
flex-wrap: nowrap;
justify-content: center;
max-width: 2158px;
margin: 0 auto;
padding: 0 15px;
}
.main_columns .main_column {
width: 100%;
}
@media screen and (max-width: 1300px) {
.main_columns {
padding: 0 0 0 15px;
}
}
@media screen and (max-width: 1023px) {
.main_columns {
padding: 0;
}
}
.main_columns .model_column {
width: 300px;
margin-top: 15px;
}
@media screen and (max-width: 1300px) {
#list_models_right_column {
display: none;
}
}
@media screen and (max-width: 1023px) {
#list_models_left_column {
display: none;
}
}
.main_columns .model_column .container {
padding: 0;
}
.main_columns .model_column .thumb {
width: 100%;
margin: 0 0 10px;
}
.info-bar.cfx,
.media-info__wrap .info-bar {
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.75);
padding: 4px;
background: #f1f1f1;
}
@media screen and (max-width: 1023px) {
#modal-signup.modal .twocolumn .right,
#modal-signup.modal .twocolumn .left {
float: none;
width: 100%;
}
}
@media screen and (max-width: 1200px) {
.search-bar__input {
width: 170px;
}
}
@media screen and (max-width: 1050px) {
.search-bar__input {
width: 147px;
}
}
@media screen and (min-width: 1024px) {
.search-bar__button {
display: none;
}
.search-bar__form {
position: static;
display: block;
border-radius: 10px;
padding: 0;
margin: 0 15px 0 0;
}
.search-bar__input,
.search-bar__form form {
height: 36px;
}
.search-bar__submit {
border-radius: 0 7px 7px 0;
height: 36px;
}
}
.main-menu__user-menu>a .days_left {
text-transform: capitalize;
margin: 0 0 0 5px;
color: #fa0052;
}
.header__options:after {
display: none;
}
.header__options {
margin-left: 0;
padding: 0 0 0 10px;
}
.message-imp {
margin: 0 0 10px;
padding: 10px;
background: #fa0052;
color: #fff;
border-radius: 5px;
text-align: center;
width: calc(100% + 106px);
position: relative;
left: -53px;
top: -1px;
border-radius: 0;
}
@media screen and (max-width: 680px) {
.message-imp {
width: calc(100% + 40px);
left: -20px;
}
}
@media screen and (max-width: 480px) {
.message-imp {
width: calc(100% + 20px);
left: -10px;
}
}
.message-imp a {
color: #fff;
text-decoration: underline;
font-weight: 700;
}
.modal#modal-signup .twocolumn {
display: flex;
align-items: center;
justify-content: center;
}
.access {
display: flex;
flex-direction: column;
align-items: center;
width: 100%
}
.access .text {
font-weight: 600;
font-size: 24px;
line-height: 33px;
color: #333739;
text-align: center;
margin-bottom: 30px
}
@media screen and (max-width: 450px) {
.access .text {
margin-bottom: 10px;
font-size: 20px;
line-height: 22px;
}
}
.access .list {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 30px;
width: 100%
}
@media (max-width:990px) {
.access .list {
flex-wrap: wrap
}
.access .list .list-item {
margin-bottom: 15px
}
.access .list .list-item:last-child {
margin-bottom: 0
}
}
@media (max-width:450px) {
.access .list {
margin-bottom: 12px;
}
}
.access .list .list-item {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
font-size: 24px;
line-height: 33px;
color: #333739
}
.access .list .list-item a {
display: block;
text-decoration: underline;
font-weight: 600;
font-size: 24px;
line-height: 33px;
margin-right: 5px;
color: #fa0052
}
@media (max-width:450px) {
.access .list .list-item {
margin-bottom: 10px;
}
.access .list .list-item,
.access .list .list-item a {
font-size: 18px;
line-height: 22px;
}
}
.lazyload,
.lazyloading {
opacity: 0;
}
.lazyloaded {
opacity: 1;
-webkit-transition: opacity 500ms;
transition: opacity 500ms;
}
.thumbs__list .img-holder {
position: relative;
padding-bottom: 79.25%;
}
.thumbs__list .thumb--models .img-holder {
padding-bottom: 130.25%;
}
.thumbs__list .thumb--albums .img-holder {
padding-bottom: 131.25%;
}
.thumbs__list .img-holder img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#modal-signup.modal .title {
text-align: center;
}
.album-images__list {
max-height: 150px;
overflow: hidden;
}
@keyframes ldio-m2kf5r0h58 {
0% {
transform: rotate(0)
}
100% {
transform: rotate(360deg)
}
}
.ldio-m2kf5r0h58 div {
box-sizing: border-box !important
}
.ldio-m2kf5r0h58>div {
position: absolute;
width: 144px;
height: 144px;
top: 28px;
left: 28px;
border-radius: 50%;
border: 16px solid #000;
border-color: #fa0052 transparent #fa0052 transparent;
animation: ldio-m2kf5r0h58 1s linear infinite;
}
.ldio-m2kf5r0h58>div:nth-child(2),
.ldio-m2kf5r0h58>div:nth-child(4) {
width: 108px;
height: 108px;
top: 46px;
left: 46px;
animation: ldio-m2kf5r0h58 1s linear infinite reverse;
}
.ldio-m2kf5r0h58>div:nth-child(2) {
border-color: transparent rgba(120, 120, 120, 1) transparent rgba(120, 120, 120, 1);
}
.ldio-m2kf5r0h58>div:nth-child(3) {
border-color: transparent
}
.ldio-m2kf5r0h58>div:nth-child(3) div {
position: absolute;
width: 100%;
height: 100%;
transform: rotate(45deg);
}
.ldio-m2kf5r0h58>div:nth-child(3) div:before,
.ldio-m2kf5r0h58>div:nth-child(3) div:after {
content: "";
display: block;
position: absolute;
width: 16px;
height: 16px;
top: -16px;
left: 48px;
background: #fa0052;
border-radius: 50%;
box-shadow: 0 128px 0 0 #fa0052;
}
.ldio-m2kf5r0h58>div:nth-child(3) div:after {
left: -16px;
top: 48px;
box-shadow: 128px 0 0 0 #fa0052;
}
.ldio-m2kf5r0h58>div:nth-child(4) {
border-color: transparent;
}
.ldio-m2kf5r0h58>div:nth-child(4) div {
position: absolute;
width: 100%;
height: 100%;
transform: rotate(45deg);
}
.ldio-m2kf5r0h58>div:nth-child(4) div:before,
.ldio-m2kf5r0h58>div:nth-child(4) div:after {
content: "";
display: block;
position: absolute;
width: 16px;
height: 16px;
top: -16px;
left: 30px;
background: rgba(120, 120, 120, 0.3);
border-radius: 50%;
box-shadow: 0 92px 0 0 rgba(120, 120, 120, 0.3);
}
.ldio-m2kf5r0h58>div:nth-child(4) div:after {
left: -16px;
top: 30px;
box-shadow: 92px 0 0 0 rgba(120, 120, 120, 0.3);
}
.loadingio-spinner-double-ring-w4onh3tlaa {
width: 200px;
height: 200px;
display: inline-block;
overflow: hidden;
background: rgba(255, 255, 255, 0);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.5);
display: none;
}
.ldio-m2kf5r0h58 {
width: 100%;
height: 100%;
position: relative;
transform: translateZ(0) scale(1);
backface-visibility: hidden;
transform-origin: 0 0;
/* see note above */
}
.ldio-m2kf5r0h58 div {
box-sizing: content-box;
}
/* generated by https://loading.io/ */
.load_swiper {
opacity: .8;
}
.load_swiper .loadingio-spinner-double-ring-w4onh3tlaa {
display: inline-block;
}
.load_swiper .album-gallery-holder a {
cursor: default;
pointer-events: none;
}
.load_swiper .album-gallery-holder .slides li:first-child {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
.load_swiper .album-gallery-holder .flex-direction-nav {
opacity: 1;
}
#albumGallery {
height: 0%;
overflow: hidden;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
}
#albumGallery .item {
width: 8.33%;
line-height: 0;
padding: 0 2.5px 5px;
}
@media (max-width:1530px) {
#albumGallery .item {
width: 9.09%;
}
}
@media (max-width:1410px) {
#albumGallery .item {
width: 10%;
}
}
@media (max-width:1270px) {
#albumGallery .item {
width: 11.111%;
}
}
@media (max-width:1130px) {
#albumGallery .item {
width: 12.5%;
}
}
@media (max-width:1000px) {
#albumGallery .item {
width: 14.28%;
}
}
@media (max-width:880px) {
#albumGallery .item {
width: 16.66%;
}
}
@media (max-width:760px) {
#albumGallery .item {
width: 20%;
}
}
@media (max-width:640px) {
#albumGallery .item {
width: 25%;
}
}
@media (max-width:520px) {
#albumGallery .item {
width: 33.33%;
}
}
@media (max-width:390px) {
#albumGallery .item {
width: 50%;
}
}
#albumGallery a {
position: relative;
padding-bottom: 133%;
display: inline-block;
width: 100%;
line-height: 0;
}
#albumGallery a img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0 !important;
}
.show_all_images {
background: #fff;
-webkit-box-shadow: 0px -14px 47px 48px rgba(255, 255, 255, 1);
-moz-box-shadow: 0px -14px 47px 48px rgba(255, 255, 255, 1);
box-shadow: 0px -14px 47px 48px rgba(255, 255, 255, 1);
}
.show_all_images .pagination {
margin-top: -40px;
}
.show_all_images .pagination .btn {
margin: 0;
}
.thumbs__list .thumb--models .img-holder img.album {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
object-fit: cover;
transform: translate(-50%, -50%);
}
.model-view .img-holder {
position: relative;
width: 288px;
padding-bottom: 380px;
}
.model-view .img-holder img {
position: absolute;
top: 50%;
left: 50%;
width: 100%;
height: 100%;
object-fit: cover;
transform: translate(-50%, -50%);
}
.show_fake .item:last-child,
.show_fake .item:nth-last-child(2) {
display: none !important;
}
.xv-topbar-flare-final {
display: block;
text-align: center;
padding: 12px 14px;
color: #fff;
text-decoration: none;
font: 700 16px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Arial;
letter-spacing: .2px;
position: relative;
overflow: hidden;
background: linear-gradient(90deg, #a80000, #d60000, #ff3c00, #ff6b2b, #d60000, #a80000);
background-size: 260% 100%;
animation: barFlowRed 3.5s ease-in-out infinite;
}
@keyframes barFlowRed {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.xv-topbar-flare-final::before {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
opacity: .55;
filter: blur(.25px);
background:
radial-gradient(circle at 15% 35%, rgba(255, 255, 255, .9) 0 1px, transparent 2px),
radial-gradient(circle at 40% 70%, rgba(255, 180, 180, .8) 0 1px, transparent 2px),
radial-gradient(circle at 65% 25%, rgba(255, 120, 120, .8) 0 1px, transparent 2px),
radial-gradient(circle at 85% 55%, rgba(255, 255, 255, .85) 0 1px, transparent 2px),
radial-gradient(circle at 25% 80%, rgba(255, 160, 160, .8) 0 1px, transparent 2px),
radial-gradient(circle at 75% 15%, rgba(255, 200, 200, .8) 0 1px, transparent 2px);
background-size: 40px 28px, 50px 30px, 60px 35px, 70px 40px, 80px 45px, 90px 50px;
animation: snowChaos 6s linear infinite;
z-index: 1;
}
@keyframes snowChaos {
0% {
background-position: 0 0, 10px 0, -10px 0, 0 -5px, 5px 2px, -8px -2px;
}
20% {
background-position: 15px -8px, -5px 4px, 8px -10px, -12px 2px, 6px -6px, 2px 8px;
}
40% {
background-position: 25px 8px, -10px -5px, 12px -15px, -15px 8px, 10px 4px, -5px -10px;
}
60% {
background-position: 35px -12px, -20px 6px, 15px 10px, -10px -4px, 5px -8px, 10px 6px;
}
80% {
background-position: 45px 5px, -15px -10px, 20px -5px, -5px 10px, 15px -4px, -12px 8px;
}
100% {
background-position: 55px -5px, -25px 8px, 25px 0, -15px -8px, 10px 5px, -8px -5px;
}
}
.xv-topbar-flare-final::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: -30%;
right: -30%;
background: linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, .85) 50%, transparent 60%);
transform: translateX(-120%) skewX(-12deg);
animation: flareSweep 2.8s ease-in-out infinite;
mix-blend-mode: screen;
z-index: 3;
}
@keyframes flareSweep {
0% {
transform: translateX(-120%) skewX(-12deg);
opacity: 0;
}
20% {
opacity: .9;
}
50% {
transform: translateX(120%) skewX(-12deg);
opacity: 0;
}
100% {
opacity: 0;
}
}
.xv-topbar-flare-final::marker,
.xv-topbar-flare-final::selection {
display: none
}
.xv-topbar-flare-final::before,
.xv-topbar-flare-final::after {
will-change: transform, opacity;
}
@media (prefers-reduced-motion:reduce) {
.xv-topbar-flare-final,
.xv-topbar-flare-final::before,
.xv-topbar-flare-final::after {
animation: none !important;
}
}
.topbar {
background: #ED408D;
text-align: center;
}
.topbar strong {
color: #ffffff;
font-weight: 900;
}
.topbar a span {
< !--background: #ffffff;
-->color: #000;
padding: 4px 6px;
border-radius: 3px;
animation: pulse 2s infinite;
display: inline-block;
}
.clkbat {
margin-right: 5px;
}
.topbar a {
color: #fff;
display: block;
padding: 7px;
font-weight: 800;
font-size: 16px;
font-weight: 900;
}
.fake-clkbat {
display: none;
}
.main-menu__item.clkbat:hover>a:after,
.main-menu__item.request:hover>a:after {
background-color: transparent !important;
}
@media screen and (max-width: 767px) {
.main-menu__item.clkbat {
display: inline-block;
}
.main-menu__item.clkbat>a {
font-size: 11px !important;
padding: 7px;
}
.clkbat {
margin-right: 1px;
}
.clkbat-wraper {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 220px;
text-align: center;
}
.header .logo {
float: left !important;
}
.fake-clkbat {
display: block;
text-align: center;
margin: 15px 0 10px 0;
}
.fake-clkbat div {
display: inline-block;
verticle-allign: middle;
}
.mobile-b {
float: left;
margin: 26px;
}
.mobile-b a,
.fake-clkbat a {
background: #fa0052;
color: #fff;
padding: 10px 5px;
border-radius: 10px;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
}
.header {
position: relative;
}
}
@media screen and (max-width: 480px) {
.mobile-b {
margin: 20px;
}
}
@keyframes pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1.03);
}
100% {
transform: scale(1);
}
}
.main-menu__item.clkbat>a {
font-size: 13px;
}
.topbar{
background: #ED408D;
text-align: center;
}
.topbar strong{
color: #ffffff;
font-weight: 900;
}
.topbar a span{
color: #000;
padding: 4px 6px;
border-radius: 3px;
animation: pulse 2s infinite;
display: inline-block;
}
.clkbat{
margin-right:5px;
}
.topbar a{
color: #fff;
display: block;
padding: 7px;
font-weight: 800;
font-size: 16px;
font-weight: 900;
}
.fake-clkbat{
display: none;
}
.main-menu__item.clkbat:hover > a:after,
.main-menu__item.request:hover > a:after{
background-color: transparent!important;
}
@media screen and (max-width: 767px) {
.main-menu__item.clkbat{
display: inline-block;
}
.main-menu__item.clkbat > a {
font-size: 11px!important;
padding: 7px;
}
.clkbat{
margin-right: 1px;
}
.clkbat-wraper{
position:absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 220px;
text-align:center;
}
.header .logo{
float:left!important;
}
.fake-clkbat{
display: block;
text-align: center;
margin: 15px 0 10px 0;
}
.fake-clkbat div{
display: inline-block;
verticle-allign: middle;
}
.mobile-b{
float:left;
margin: 26px;
}
.mobile-b a,
.fake-clkbat a{
background: #fa0052;
color: #fff;
padding: 10px 5px;
border-radius: 10px;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
}
.header{
position: relative;
}
}
@media screen and (max-width: 480px){
.mobile-b{
margin:20px;
}
}
@keyframes pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1.03);
}
100% {
transform: scale(1);
}
}
.main-menu__item.clkbat > a{
font-size: 13px;
}
@keyframes blink {
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
.blinking {
animation: blink 0s infinite; /* 设置闪烁速度为2秒 */
font-size: 28px; /* 设置字体大小固定 */
}