:root { --bg-color: #f2f6f8; --bg-color-second: #353b48; --bg-color-third: #fff; --primary-color: #ff6b4c;; --primary-color-darker: #353b48; --secondary-color: #efbb51; --third-color: #efbb51; --primary-text-color: #333; --secondary-text-color: #4a3d3d; --third-text-color: #fff; --fourth-text-color: #ccc; --gradient: linear-gradient(to bottom, #efbb51, #9b51ef); --main-indent-negative: -40px; --main-indent: 40px; /* основной отступ справа и слева */ --maximum-width: 1280px; /* максимальная ширина блока контента */ } /* RESET, BASIC UI SETTINGS ----------------------------------------------- */ /* nunito-300 - latin */ /* nunito-300 - latin_cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 300; font-display: swap; src: url('../webfonts/nunito-v16-latin_cyrillic-300.eot'); /* IE9 Compat Modes */ src: local(''), url('../webfonts/nunito-v16-latin_cyrillic-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../webfonts/nunito-v16-latin_cyrillic-300.woff2') format('woff2'), /* Super Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-300.woff') format('woff'), /* Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-300.ttf') format('truetype'), /* Safari, Android, iOS */ url('../webfonts/nunito-v16-latin_cyrillic-300.svg#Nunito') format('svg'); /* Legacy iOS */ } /* nunito-regular - latin_cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url('../webfonts/nunito-v16-latin_cyrillic-regular.eot'); /* IE9 Compat Modes */ src: local(''), url('../webfonts/nunito-v16-latin_cyrillic-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../webfonts/nunito-v16-latin_cyrillic-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-regular.woff') format('woff'), /* Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('../webfonts/nunito-v16-latin_cyrillic-regular.svg#Nunito') format('svg'); /* Legacy iOS */ } /* nunito-600 - latin_cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url('../webfonts/nunito-v16-latin_cyrillic-600.eot'); /* IE9 Compat Modes */ src: local(''), url('../webfonts/nunito-v16-latin_cyrillic-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../webfonts/nunito-v16-latin_cyrillic-600.woff2') format('woff2'), /* Super Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-600.woff') format('woff'), /* Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-600.ttf') format('truetype'), /* Safari, Android, iOS */ url('../webfonts/nunito-v16-latin_cyrillic-600.svg#Nunito') format('svg'); /* Legacy iOS */ } /* nunito-700 - latin_cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url('../webfonts/nunito-v16-latin_cyrillic-700.eot'); /* IE9 Compat Modes */ src: local(''), url('../webfonts/nunito-v16-latin_cyrillic-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../webfonts/nunito-v16-latin_cyrillic-700.woff2') format('woff2'), /* Super Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-700.woff') format('woff'), /* Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-700.ttf') format('truetype'), /* Safari, Android, iOS */ url('../webfonts/nunito-v16-latin_cyrillic-700.svg#Nunito') format('svg'); /* Legacy iOS */ } /* nunito-900 - latin_cyrillic */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 900; font-display: swap; src: url('../webfonts/nunito-v16-latin_cyrillic-900.eot'); /* IE9 Compat Modes */ src: local(''), url('../webfonts/nunito-v16-latin_cyrillic-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../webfonts/nunito-v16-latin_cyrillic-900.woff2') format('woff2'), /* Super Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-900.woff') format('woff'), /* Modern Browsers */ url('../webfonts/nunito-v16-latin_cyrillic-900.ttf') format('truetype'), /* Safari, Android, iOS */ url('../webfonts/nunito-v16-latin_cyrillic-900.svg#Nunito') format('svg'); /* Legacy iOS */ } * {background: transparent; margin: 0; padding: 0; outline: none; border: 0; box-sizing: border-box;} ol, ul {list-style: none;} table {border-collapse: collapse; border-spacing: 0;} img, table, iframe, video, frame, embed, object {max-width: 100%;} html {font-size: 62.5%;} body {font: 1.6rem 'Nunito', sans-serif; line-height: normal; padding: 0; margin: 0; color: var(--primary-text-color); background: #111 url(../images/bg01.png); min-height: 100%; width: 100%; font-weight: 400; letter-spacing: 0.02em;} a {color: var(--primary-text-color); text-decoration: none;} a:hover, a:focus {color: var(--primary-color); text-decoration: none;} h1, h2, h3, h4, h5 {font-weight: 700; font-size: 2.4rem;} ::selection { background: #f6e58d; color: #000;} b, strong {font-weight: 700;} button, select, textarea, input[type="text"], input[type="password"], input[type="button"], input[type="submit"] {appearance: none; -webkit-appearance: none; font-size: 1.6rem; font-family: 'Nunito' !important;} button:not(.color-btn):not([class*=fr]):not([class*=plyr]):not(.header__search-btn):not([class*=owl-]):not(.form__btn):not([id*=mceu]), .button, .btn, input[type="button"]:not(.form__btn), input[type="reset"], input[type="submit"] { display: inline-block; cursor: pointer; text-align: center; padding: 0 20px; height: 40px; line-height: 40px; background-color: var(--primary-color); color:#fff; font-size: 1.2rem; font-weight: 700; white-space: nowrap; border-radius: 20px; box-shadow: 0 20px 50px rgba(155, 81, 239, 0.1); text-transform: uppercase;} button:not(.color-btn):not([class*=fr]):not([class*=plyr]):not(.header__search-btn):not([class*=owl-]):not(.form__btn):not([id*=mceu]):hover, .button:hover, .btn:hover, input[type="button"]:not(.form__btn):hover, input[type="reset"]:hover, input[type="submit"]:hover {background-color: var(--primary-color-darker); color: #fff; box-shadow: 0 10px 20px 0 rgba(0,0,0,0);} button:active, input[type="button"]:active, input[type="submit"]:active {box-shadow: inset 0 1px 4px 0 rgba(0,0,0,0.1);} input[type="text"], input[type="password"] {height: 40px; line-height: 40px; border-radius: 4px; padding: 0 15px;} select {height: 40px; padding: 0 15px; display: block;} select:not([multiple]) {background-image: url(../dleimages/chevron.svg); padding-right: 30px; background-repeat: no-repeat; background-position: right 15px top 50%; background-size: .6em auto;} select option {padding: 6px 10px;} select[multiple] {padding: 0 5px;} textarea {padding: 15px; overflow: auto; vertical-align: top; resize: vertical;} input[type="text"], input[type="password"], select, textarea {width: 100%; background-color: #fff; color: #000; box-shadow: inset 0 0 0 1px #e3e3e3, inset 1px 2px 5px rgba(0,0,0,0.1);} input[type="text"]:focus, input[type="password"]:focus, textarea:focus {box-shadow: inset 0 0 0 1px var(--primary-color), inset 1px 2px 5px rgba(0,0,0,0.1);} input::placeholder, textarea::placeholder {color: #000; opacity: 0.6; font-size: 1.4rem;} input:focus::placeholder, textarea:focus::placeholder {color: transparent} a.all-link {display: inline-block;color: #ff6b4c;font-size: 15px;} .mp-h2{display:inline-block;margin-top: 20px;} .downloadBtn {cursor: pointer; height: auto; line-height: 40px; border-radius: 10px; padding: 9px 20px; background-color: var(--primary-color); color: #fff; display: block; font-size: 18px; margin-left:15px; } .downloadBtn:hover { background:#f06448; } .inner-page__ctrl > div { margin-bottom:15px; } /* SNIPPETS ----------------------------------------------- */ .img-box, .img-wide, .img-responsive, .img-fit-cover {overflow: hidden; position: relative;} .img-responsive {padding-top: 60%;} .img-responsive--portrait {padding-top: 150%;} .img-box > img, .img-responsive > img {width: 100%; min-height: 100%; display: block;} .img-responsive > img {position: absolute; left: 0; top: 0;} .img-wide img, .img-wide > a {width: 100%; display: block;} .img-fit-cover img, .img-fit img {width: 100%; height: 100%; object-fit: cover;} .clr {clear: both;} .clearfix::after {content: ""; display: table; clear: both;} .ws-nowrap, .nowrap {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .d-flex, #dle-content, .fx-row, .fx-col {display: flex; flex-wrap: wrap; flex-direction: row;} .fd-column, .fx-col {flex-direction: column; flex-wrap: nowrap;} .jc-flex-start, #dle-content {justify-content: flex-start;} .jc-space-between, .fx-row {justify-content: space-between;} .jc-center, .fx-center, .fx-col {justify-content: center;} .ai-flex-start {align-items: flex-start;} .ai-center, .fx-middle, .fx-col {align-items: center;} .order-first, .fx-first {order: -1;} .order-last, .fx-last {order: 10;} .stretch-free-width, .fx-1 {flex: 1 1 0; max-width: 100%; min-width: 50px;} .icon-at-left [class*="fa-"], .icon-left .icon {margin-right: 10px;} .icon-at-right [class*="fa-"], .icon-right .icon {margin-left: 10px;} .hidden, #dofullsearch, .form__header .form__btn {display: none;} .animated-element, button, .btn, .nav-list a, .inner-page__rating a {transition: all .3s;} #dle-content > *:not(.item), #dle-content {width: 100%;} /* BASIC LAYOUT ----------------------------------------------- */ .wrapper {min-width: 320px; position: relative; padding: 30px; padding-bottom: 0; overflow: hidden;} /* .wrapper::before {content: ''; width: 160vh; height: 160vh; border-radius: 50%; */ /* background: var(--gradient); position: fixed; top: 50%; left: 50%; transform: translateY(-50%);} */ .wrapper-container {max-width: var(--maximum-width); margin: 0 auto; position: relative; z-index: 20;} .wrapper-main { background-color: #f2f2e9;box-shadow: 0 15px 30px rgba(0,0,0,0.1);border-radius: 10px;overflow: hidden;} .header {padding-left: 240px; position: relative;} .header__inner {padding: 35px var(--main-indent);padding-bottom: 15px;position: relative;z-index: 10;} .header::before {content: ''; width: 240px; height: 100%; background-color: var(--bg-color-second); position: absolute; left: 0; top: 0;} .popular {padding: 20px 100px; background: #222 url(../images/bg-hero.jpg) center center / 100% auto no-repeat;} .content {min-height: 100vh;} .sidebar {width: 240px; text-shadow: 0 1px 1px rgba(0,0,0,0.8); padding: var(--main-indent); background-color: var(--bg-color-second);} .main {padding: var(--main-indent);} .main {padding: 30px 40px;} .footer {padding: var(--main-indent); color: var(--fourth-text-color);} #scrolltop {position: fixed; width: 60px; height: 60px; line-height: 60px; right: 10px; bottom: 80px; z-index: 990; display: none; background-color: #fff; color: #999; cursor: pointer; font-size: 2.4rem; border-radius: 50%; text-align: center; box-shadow: 0 5px 10px rgba(0,0,0,0.1);} .col-3.artist {padding: 12px 8px 12px 10px;width: 25%;display: inline-block;} .artist-in h2 {margin-bottom: 10px; margin-top:20px;} .artist-in .short-item {width: 100%;padding: 0;} .grid-item a b {display: block;} .grid-item {margin-bottom: 20px; margin-right: 10px;} .dmca p {margin-bottom:20px} /* HEADER, NAV ----------------------------------------------- */ .logo {display: block;font-size: 3.3rem;position: relative;text-shadow: 0 1px 1px rgba(0,0,0,0.8);color: #fff !important;line-height: 35px;padding-left: 85px;padding-top: 33px;font-weight: 900;background: url(../images/logo.svg) 0 0 / 75px no-repeat;position: absolute;left: -208px;top: 5px;} .logo span {color: var(--primary-color); display:block;} .header__caption {font-size: 1.3rem; color: var(--secondary-text-color); opacity: 0.8;} .header__search {position:relative; margin: 0 20px 0 60px;} .header__search input, .header__search input:focus {padding: 0 50px 0 20px; border-radius: 20px; background-color: #fffff; color: #333; box-shadow: none;} .header__search input:not(:focus)::placeholder {color: var(--primary-text-color); opacity: 0.6; font-size: 1.5rem;} .header__search button {position: absolute;right: 0px;z-index: 10;width: 37px;cursor: pointer;} .welcome {margin: 15px 0 25px 0;background: #f6f6f6;padding: 10px;font-size: 15px;line-height: 20px;} .welcome a {color: #ff6b4c;} .speedbar.nowrap {margin-bottom: 10px;font-size: 15px;} /* FOOTER, PAGINATION ----------------------------------------------- */ .footer__menu a {display: block; margin: 0 20px 0 0; color: var(--third-text-color);} .footer__copyright {margin-top: 8px; text-shadow: 0 1px 1px rgba(255,255,255,0.5);} .footer__copyright span {color: var(--third-color); border-bottom: 1px dotted var(--third-color);} .footer__logo {font-size: 2.2rem;padding-left: 20px;position: static;height: 70px;width: 50px;background-size: 50px;margin-right: 30px;background-position: 0px 0px;} .pagination {text-align: center; font-weight: 600; font-size: 1.6rem; padding: 30px 0 20px;} .pagination a, .pagination span {display: inline-block; margin: 10px 5px 0 5px; line-height: 60px; border-radius: 10px; padding: 0 10px; min-width: 60px; background-color: #fff;} .pagination span:not(.nav_ext) {background-color: var(--primary-color); color: #fff; font-weight: 700; font-size: 1.8rem;} /* SECTION ----------------------------------------------- */ .section:not(:last-child) {margin-bottom: 40px;} .section.d-flex {margin-bottom: 20px;} ul.section.nav-list.js-this-in-mobile-menu {padding-left: 15px;} .section__header {margin-bottom: 20px;} .section__title {font-size: 2.4rem; font-weight: 700;} .section__subtitle {font-size: 1.6rem; text-transform: uppercase; font-weight: 700; color: var(--secondary-text-color);} .section__items {margin: 0 -10px -20px -10px;} .section__title span, .section__subtitle span {color: var(--primary-color);} .section__link {font-size: 1.2rem; font-weight: 700; color: var(--secondary-text-color); height: 30px; line-height: 30px; border-radius: 15px; padding: 0 20px; margin-left: 10px; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1); text-transform: uppercase; display: inline-block;} .section__link:hover {background-color: var(--primary-color); color: #fff;} .section--top {width: 48%; margin-right: 2%;} .section--artists .section__content {background-color: #fff; box-shadow: 0 5px 15px rgba(0,0,0,0.06); padding-right: 20px;} .section--top, .section--new {margin-bottom: 30px !important;} .section--top .section__content, .section--new .section__content {box-shadow: 0 5px 15px rgba(0,0,0,0.06); overflow: hidden; background-color: #fff; margin-left: 0; margin-right: 0;} .site-desc {margin-top: 40px; text-shadow: 0 1px 1px rgba(255,255,255,0.5); clear:both;} .podborki-main.clearfix {display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: justify; -webkit-justify-content: space-between;justify-content: center;} .podborki-main a {width: 23% !important; text-align: center; margin: 1%;} .podborki-main a img {border-radius: 5%;} /* ITEM ----------------------------------------------- */ .item {padding: 0 10px; margin-bottom: 20px;} .item__title {font-size: 1.6rem; line-height: 1.3; font-weight: 600; color: var(--primary-text-color);} .item__subtitle {color: var(--secondary-text-color); font-size: 1.4rem; font-weight: 300; margin-top: 1px;} .item__meta {color: var(--primary-color); margin-bottom: 0px; font-size: 1.2rem; margin-right: 10px; text-transform: uppercase;} .item__btn {cursor: pointer; width: 40px; height: 40px; border-radius: 10px; text-shadow: none; background-color: var(--secondary-color); color: rgba(0,0,0,0.5); font-size: 1.2rem; padding-left: 3px;} .item__btn:hover {background-color: var(--primary-color); color: #fff;} /* COLLECTION, ARTIST ----------------------------------------------- */ .collection-item {width: 20%;} .collection-item__img {padding-top: 100%; margin-bottom: 15px; border-radius: 10px; box-shadow: 0 5px 15px rgba(0,0,0,0.06);} .collection-item__description {padding: 0 10px;} .artist-item {width: 25%;} .artist-item__inner {background-color: #fff; padding: 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.06);} .artist-item__img {border-radius: 6px; width: 70px; height: 70px; margin-right: 18px;} .section--artists .artist-item {padding: 0; margin: 0;} .section--artists .artist-item__inner {box-shadow: none; padding-right: 0;} .item:hover .collection-item__img, .item:hover .artist-item__img, .item:hover .soon-item__img, .item__description:hover + .top-item__img, .item__description:hover + .short-item__img {box-shadow: 0 20px 50px rgba(0,0,0,0.3); transform: translateY(-10px);} /* TOP, TRACK ----------------------------------------------- */ .top-item {width: 50%; margin-bottom: 5px;} .top-item__inner {padding: 15px; background-color: #fff; box-shadow: 0 5px 15px rgba(0,0,0,0.06);} .top-item__img {width: 40px; height: 40px; border-radius: 6px;} .top-item__description {display: block; padding: 0 10px; height: 40px;} .section--top .top-item {width: 100%; margin: 0; padding: 0; box-shadow: none;} .section--top .top-item:not(:last-child) {border-bottom: 1px solid #f2f2f2;} .section--top .top-item__inner {box-shadow: none;} .short-item {width: 50%; margin-bottom: 5px;} .short-item__inner {padding: 15px; background-color: #fff; box-shadow: 0 5px 15px rgba(0,0,0,0.06);} .short-item__img {width: 40px; height: 40px; border-radius: 50%; margin-right: 5px;} .short-item__description {padding-left: 10px;} .short-item__description > * {margin: 0; width: 80%; padding-right: 3px; font-size: inherit;} .short-item__description > *:last-child {width: 20%; font-size: 0.8em; text-align: center;} .section--new .short-item {margin: 0; width: 100%; padding: 0; box-shadow: none;} .section--new .short-item:not(:last-child) {border-bottom: 1px solid #f2f2f2;} .section--new .short-item__inner {box-shadow: none;} .js-item-played .item__btn {background-color: var(--primary-color); color: #fff;} /* SIDEBAR ----------------------------------------------- */ .nav-list {} .nav-list > li > a {display: block; color: var(--third-text-color);} .nav-list > li > a:before{ content: ""; position: absolute; left: -15px; top: 7px; width: 7px; display:inline-block; height: 7px; border-radius: 50%; background: #ff6b4c;} .nav-list > li {position: relative; margin-bottom: 12px;} span.menu-zag {font-weight: bold;color: #fff;display: block;margin: 35px 0 10px -15px; font-size: 17px;} .section__subtitle.section__header {color: #fff !important;text-transform: initial;font-size: 17px;} .nav-list > li > span {position: absolute; left: 0; top: 0px; color:#e4836e; font-size: 1.8rem; pointer-events: none;} .nav-list > li > a:hover, .nav-list > li:hover > a {color: var(--primary-color);} .nav-list__submenu > a:after { content: ">"; transition: all .2s; display: inline-block; margin-left: 11px; position: relative; top: -1px; font-size: 11px;} .nav-list__hidden {background-color: #fff; box-shadow: 0 27px 53px rgba(0,0,0,0.2); z-index: 100; position: absolute; left: 90%; top: 0%; width: 320px; border-radius: 10px; visibility: hidden; opacity: 0; transform: translateY(30px); padding: 20px; padding-bottom: 5px;} .nav-list__hidden li {width: 50%; margin-bottom: 15px;} .nav-list__hidden li a {display: block; font-weight: 300; font-size: 1.5rem; text-shadow: none;} .nav-list > li:hover .nav-list__hidden {visibility: visible; opacity: 1; transform: translateY(0px);} .nav-list--without-icon > li > a {padding-left: 0;} .soon-item {padding: 0; margin: 0; line-height: 1.4;} .soon-item:not(:last-child) {margin-bottom: 26px;} .soon-item__img {width: 50px; height: 50px; margin-right: 20px; border-radius: 50%;} .sidebar .section__subtitle, .sidebar .item__subtitle {color: var(--fourth-text-color);} .sidebar .item__title {color: var(--third-text-color);} /* PLAYER ----------------------------------------------- */ .wplayer {width: 100%; position: fixed; left: 0; bottom: 0; z-index: 990; padding: 10px;} .audioplayer {background: var(--bg-color-second); color: #fff; position: relative; box-shadow: 0 -15px 30px rgba(0,0,0,0.2); border-radius: 10px;} .audioplayer {max-width: 1200px; margin: 0 auto; height: 66px; padding: 16px 40px 10px 40px;} .audioplayer audio {display: none;} .audioplayer-bar {position: absolute; left: 0px; right: 0px; top: 0px; height: 6px; background-color: var(--primary-color); overflow: hidden; border-radius: 10px 10px 0 0;} .audioplayer-bar-loaded {position: absolute; left: 0; top: 0; height: 100%; background-color: rgba(0,0,0,0.1); border-radius: 10px 10px 0 0;} .audioplayer-bar-played {position: absolute; left: 0; top: 0; height: 100%; z-index: 10; border-radius: 0; background-color: #fff;} .audioplayer-volume {position: relative; z-index: 100; margin-left: 20px; font-size: 18px;} .audioplayer-volume-button a {color: #fff; opacity: 0.7; display: block; height: 30px; line-height: 30px; text-align: center;} .audioplayer-volume-adjust {position: absolute; left: 0; bottom: 100%; width: 30px; height: 100px; background-color: var(--bg-color-second); box-shadow: 0 0 10px rgba(0,0,0,0.5); padding: 10px; display: none;} .audioplayer-volume-adjust > div {width: 10px; height: 80px; border-radius: 0px; position: relative; cursor: pointer; background-color: var(--primary-color); overflow: hidden;} .audioplayer-volume-adjust > div > div {width: 100% !important; background-color: #fff; position: absolute; left: 0; bottom: 0; z-index: 10;} .audioplayer-volume:hover .audioplayer-volume-adjust {display: block;} .ap-dl {font-size: 24px; color: #fff; margin-left: 20px; opacity: 0.7;} .ap-time {font-size: 12px; opacity: 0.7; margin-left: 20px;} .audioplayer-time-current:after {content: '/'; display: inline; margin: 0 6px;} .ap-desc {width: 300px; height: 40px;} .ap-img {width: 40px; height: 40px; margin-right: 10px; border-radius: 10px; overflow: hidden;} .ap-artist {margin-top: 0px; opacity: 0.7;} .ap-title {font-weight: 600;} .ap-btns {position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);} .audioplayer-playpause a {width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 50%; display: block; position: relative; margin: 0 10px; background-color: var(--primary-color); color: #fff;} .ap-prev, .ap-next {cursor: pointer; color: #fff; background-color: var(--primary-color); font-size: 18px; width: 30px; height: 30px; text-align: center; border-radius: 50%; font-size: 10px;} .audioplayer-volume-button a:hover, .ap-dl:hover {opacity: 1; color: #fff;} .audioplayer-stopped .audioplayer-playpause a {padding-left: 3px;} .audioplayer-playpause a:hover, .ap-prev:hover, .ap-next:hover {background-color: var(--secondary-color); color: #000;} .wplayer-init .audioplayer-playpause .fas:before {content: '\f04b'; padding-left: 1px;} .ap-title, .ap-artist {max-width: 300px;} /* INNER PAGE ----------------------------------------------- */ .inner-page__category {font-size: 1.4rem; margin-top: 10px;} .inner-page__category span {font-weight: 600; margin-right: 5px;} .inner-page__category a {color: var(--primary-color); border-bottom: 1px dotted var(--primary-color);} .inner-page__category a:hover {border-bottom-color: transparent;} .inner-page__category span[class*=fa] {color: var(--secondary-color); margin-right: 8px;} h1 a {margin-left: 10px; color: var(--primary-color); font-size: 1.6rem;} .inner-page__columns {background-color: #fff; border-radius: 10px; padding: 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.06);} .inner-page__left-column {width: 180px; margin-right: 20px;} .inner-page__poster {border-radius: 10px; width: 180px; height: 180px;} .inner-page__info {margin-bottom: 10px; font-size: 1.5rem;} .inner-page__info li {display: flex; justify-content: space-between; position: relative; width: 46%; margin-bottom: 6px;} .inner-page__info li > span:first-child::after {content: ''; border-top: 1px dashed #ccc; height: 1px; display: block; margin: 0 10px; position: relative; top: 1px; flex: 1 1 0;} .inner-page__info li span {display: inline-block; padding: 4px 0;} .inner-page__info li > span:first-child {color: var(--secondary-text-color); flex: 1 1 0; max-width: 100%; min-width: 50px; display: flex; align-items: center;} .inner-page__info a {color: var(--primary-color); text-decoration: underline;} .inner-page__dl {height: 40px; line-height: 40px; border-radius: 20px; padding: 0 20px; background-color: var(--primary-color); color: #fff !important; display: block;} .inner-page__meta a {display: block;} .inner-page__fav {background-color: #fff; margin: 0 10px; box-shadow: 0 5px 15px rgba(0,0,0,0.06); width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 50%; font-size: 1.6rem; color: var(--primary-color); cursor: pointer;} .inner-page__fav:hover {background-color: var(--primary-color); color: #fff;} .inner-page__fav.is-active {color: #d63031;} .inner-page__ctrl {width: 100%;} .inner-page__play {cursor: pointer; height: 60px; padding: 8px 15px 8px 10px; box-shadow: inset 0 0 0 2px var(--primary-color); font-weight: 600; font-size: 1.7rem; position: relative; border-radius: 10px; max-width: 60%;} .inner-page__play-desc .ws-nowrap {font-weight: 400; font-size: 1.4rem; font-weight: 300;} .inner-page__play .item__btn {margin: 0 10px 0 0; border-radius: 10px;} .inner-page__play:hover {background-color: #353b48; color: #fff;box-shadow: inset 0 0 0 2px #353b48} .inner-page__rating {font-size: 1.3rem;} .inner-page__rating a {display: block; height: 40px; line-height: 40px; border-radius: 20px; padding: 0 20px; background-color: #6ab04c; color: #fff; margin-left: 10px; font-weight: 400;} .inner-page__rating a div {margin-right: 10px; height: 30px; line-height: 30px; display: inline-block; vertical-align: top; padding-top: 3px;} .inner-page__rating a + a {background-color: #9a9a9a;} .inner-page__rating a img {display: inline-block; width: 25px; height: 25px; position: relative; top: 3px;} .inner-page__rating a + a img {transform: scale(-1,-1); top: 5px;} .inner-page__rating a:hover {opacity: 0.9;} .inner-page__caption {line-height: 1.6; margin-top: 15px; color: var(--secondary-text-color); font-size: 1.6rem;} .slice {overflow:hidden; position:relative; transition:height .2s;} .slice-masked:before {content:'';position:absolute;z-index:1;bottom:0px;left:0;right:0;height:120px;pointer-events:none; background:linear-gradient(to bottom, transparent 0%, #f2f6f8 100%);} .slice-btn {margin:10px 0 0 0;} .slice-btn span {display:inline-block; cursor:pointer; text-decoration:underline; color:var(--primary-color);} .inner-page--artist .inner-page__left-column {width: 260px;} .inner-page--artist .inner-page__poster {height: 170px; width: 260px;} .inner-page__left-column .inner-page__rating {position: relative; left: -10px; margin-top: 20px; flex-wrap: nowrap;} .inner-page__right-column .slice-masked:before {background:linear-gradient(to bottom, transparent 0%, #fff 100%);} .inner-page--collection .inner-page__left-column {width: 100%; margin: 0;} .inner-page--collection .inner-page__poster {width: 100%; height: 240px;} .inner-page--collection .inner-page__rating {position: absolute; z-index: 10; left: 10px; bottom: 20px;} .inner-page__quantity {position: absolute; z-index: 10; right: 20px; bottom: 20px; height: 40px; line-height: 40px; border-radius: 20px; padding: 0 20px; background-color: rgba(0,0,0,0.6); color: #fff;} span.cust-ajax {display: inline-block;padding: 10px 20px;margin-right: 10px;background-color: #fff;cursor: pointer;font-weight: 500;margin-bottom: 15px;border: 2px #ffffff solid;} span.cust-ajax.is-active {border:2px #ff6b4c solid} /* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK ----------------------------------------------- */ .text {line-height: 22px; font-size: 15px; font-weight: 300; word-wrap: break-word;} .text a {text-decoration: underline; color: var(--primary-color);} .text img:not(.emoji), .text p, .text h1, .text h2, .text h3, .text h4, .text h5, .text > ul, .text > ol, .text table {margin-bottom: 20px;} .text > img[style*="left"], .text > .highslide img[style*="left"] {margin:0 10px 10px 0;} .text > img[style*="right"], .text > .highslide img[style*="right"] {margin:0 0 10px 10px;} .text > ul li {list-style:disc; margin-left:40px;} .text > ol li {list-style:decimal; margin-left:40px;} .text table, .video-inside > * {width:100%;} .text table tr td {padding:10px; border:2px solid #fff;} .text table tr:nth-child(2n+1) {background-color:#f2f6f9;} .text table tr:nth-child(1) {background-color:#cee0ed;} .text table img:not(.emoji) {margin:0; max-width:350px} .text > *:last-child {margin-bottom: 0;} .video-responsive {padding-top: 54%; position: relative;} .video-responsive > iframe, .video-responsive > video {position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .inner-page__title {margin-bottom: 20px;} .text h1, .text h2, .text h3, .text h4, .text h5 {font-size: 2rem;} .custom-tabs .item{padding:0;} .custom-tabs .top-item{width:98%;} /* COMMENTS ----------------------------------------------- */ .add-comments-form-wrapper {background-color: #fff; padding: 20px; border-radius: 10px;box-shadow: 0 5px 15px rgba(0,0,0,0.06);} .add-comments-form__input {margin-left: 20px;} .add-comments-form .hidden, .comments_subscribe + br {display: none;} .mass_comments_action {display: flex; align-items: center; max-width: 800px;} .mass_comments_action select {flex: 1 1 0; margin: 0 16px 0 20px;} .comment-item__title {font-weight: 500; font-size: 2rem; margin-bottom: 20px;} .comment-item {margin-top: 40px;} .comment-item__img {width: 40px; height: 40px; border-radius: 50%; margin-right: 10px;} .comment-item__letter {width: 100%; height: 100%; text-transform: uppercase; font-weight: 500; position: absolute; left: 0; top: 0; z-index: 5; color: #fff; font-size: 1.8rem;} .comment-item__author {font-weight: 400;} .comment-item__date {color: var(--secondary-text-color); margin-top: 2px; font-size: 1.2rem;} .comment-item__main {margin: 6px 0 3px 0;} .comment-item__rating {margin-left: 20px; height: 30px; line-height: 30px; border-radius: 4px; background-color: #f2f6f9; padding: 0 10px; font-size: 1.2rem; color: #97a9b7;} .comment-item__rating a {color: #97a9b7;} .comment-item__rating > span {margin: 0 5px;} .comment-item__rating > span > span.ratingtypeplus, .comment-item__rating > span > span.ratingplus {color: #06b601;} .comment-item__rating > span > span.ratingminus {color: #ff0e0e;} .comment-item__reply a {color: var(--primary-color); border-bottom: 1px dotted var(--primary-color); font-size: 1.4rem;} .comment-item__controls {text-align: right; font-size: 1.2rem;} .comment-item__controls li {display: inline-block; vertical-align: middle; margin: 0 0 0 10px; height: 20px; line-height: 20px;} .comment-item__controls a:not(:hover) {color: var(--secondary-text-color);} /* LOGIN ----------------------------------------------- */ .overlay {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.6; background-color: #000; cursor: pointer;} .login {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); overflow: hidden; background-color: #fff; border-radius: 4px; width: 400px; box-shadow: 0 0 0 10px rgba(255,255,255,0.2), 0 15px 45px rgba(0,0,0,1);} .login__header {padding: 20px 40px; background-color: #f2f6f9;} .login__title {font-size: 2rem; font-weight: 500; padding: 1px 0;} .login__close {cursor: pointer; font-size: 2.4rem; opacity: 0.6; margin-left: 20px;} .login__title a {border-bottom: 1px dotted #444; margin-left: 10px; font-weight: 400; color: var(--secondary-text-color);} .login__content {padding: 20px 40px;} .login__row {margin-bottom: 20px; position: relative; display: block; font-size: 1.2rem; color: var(--secondary-text-color);} .login__caption {font-size: 1.2rem; color: var(--primary-text-color); margin-bottom: 10px;} .login__caption a {text-decoration: underline; margin-left: 6px; color: var(--primary-color);} .login__input input {padding-left: 40px;} .login__row .fal {opacity: 0.5; position: absolute; left: 0; bottom: 0; line-height: 40px; width: 40px; text-align: center;} .login__row button {width: 100%;} .login__social {background-color: #f2f6f9; padding: 20px 40px; text-align: center;} .login__social-caption {font-size: 1.2rem; text-transform: uppercase; margin-bottom: 10px;} .login__social-btns a {display:inline-block; margin: 0 3px; vertical-align:top;} .login__social-btns img {display:block; width:30px; height: 30px; border-radius: 50%;} .login__avatar {width: 40px; height: 40px; border-radius: 50%; margin-right: 10px;} .login__menu {padding-left: 35px; padding-right: 35px; margin-bottom: -10px;} .login__menu li {flex: 1 1 0; min-width: auto; max-width: 100%; margin: 0 5px 10px 5px;} .login__menu a {display: block; border-radius: 6px; padding: 10px; text-align: center; white-space: nowrap; background-color: #f2f6f8; box-shadow: inset 0 0 10px rgba(0,0,0,0.1); font-size: 1.2rem;} .login__menu .far {display: block; height: 30px; font-size: 2.4rem; opacity: 0.3;} /* main#wajax h1 {margin-bottom: 20px;} */ .short-zvuk{width: 100%;padding: 0; margin-top: 15px;margin-bottom: 5px;} .ul-my a{color: var(--primary-color);text-decoration: underline;} .ul-my {margin-bottom:12px;} .fa-play { display:block; width: 19px; height: 19px; background: url(../images/play.svg) no-repeat; background-size: cover; } .js-item-played .fa-play { background: url(../images/pause.svg) no-repeat; background-size: cover; background-position: 1px 0; } .audioplayer .fa-play { top: 10px; left: 11px; position: absolute; } .audioplayer .fa-pause { display:block; width: 19px; height: 19px; background: url(../images/pause.svg) no-repeat; background-size: cover; background-position: 2px 0; top: 10px; left: 11px; position: absolute; } .audioplayer .fa-forward, .audioplayer .fa-backward { display: inline-block; width: 15px; height: 15px; margin-left: 2px; background: url(../images/forward.svg) no-repeat; background-size: cover; } .audioplayer .fa-backward { transform: rotate( 180deg ); margin-left: -2px; } .audioplayer .ap-dl { display: inline-block; width: 18px; height: 18px; background: url(../images/download.svg) no-repeat; background-size: cover; } .audioplayer .fa-volume-up { display: inline-block; width: 20px; height: 20px; margin-top: 5px; background: url(../images/volume.svg) no-repeat; background-size: cover; } .audioplayer.audioplayer-muted .fa-volume-up { background: url(../images/mute.svg) no-repeat; background-size: cover; } .audioplayer .fa-info-circle, .audioplayer .fa-times { display: inline-block; width: 23px; height: 23px; background: url(../images/info.svg) no-repeat; background-size: cover; } span.fal.fa-search { display: block; width: 20px; height: 20px; margin-top: 10px; background: url(../images/search.svg) no-repeat; background-size: cover; } .video-content { position: relative; cursor: pointer; display: inline-block; } .video-content img { display: block; } .video-play-btn { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); z-index: 999; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; background: transparent; border: none; width: 64px; height: 64px; } .sharing_btns { margin-top:10px; } .sharing_btns a { background: #ff6b4d; display: inline-block; width: 36px; height: 36px; margin-right: 5px; border-radius: 7px; transition:0.2s; } .sharing_btns a:first-child { background:url(../images/tg.svg) #ff6b4d no-repeat; background-size: 60%; background-position: 7px; } .sharing_btns a:nth-child(2) { background: url(../images/vk.svg) #ff6b4d no-repeat ; background-size: 60%; background-position: 7px; } .sharing_btns a:nth-child(3) { background:url(../images/ok.svg) #ff6b4d no-repeat; background-size: 34%; background-position: 12px; } .sharing_btns a:hover { background-color:#f06448; } #DLEPush { background-color: #fff; position: fixed; width: 300px; top: 30%; left: 50%; margin-left: -150px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); z-index: 200; } .DLEPush-message { padding: 15px 20px; } button.DLEPush-close { position: absolute; top: 0; right: 13px; border-radius: 10px !important; line-height: normal !important; height: 35px !important; padding: 0 !important; width: 35px !important; box-shadow: none !important; } .DLEPush-icon { display:none; } /* ADAPTIVE, MOBILE MENU ----------------------------------------------- */ .mobile-menu {width: 280px; height: 100%; overflow-x: hidden; overflow-y: auto; background-color: #f3f3f3; padding: 15px 20px; z-index: 999; position: fixed; left: -320px; top: 0; transition: left .4s; background-color: var(--bg-color-second); color: var(--third-text-color);} .mobile-menu.is-active {left: 0;} .mobile-menu-close {cursor: pointer; display: block; left: 280px; top: -40px; position: fixed; z-index: 999; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 1.8rem; opacity: 0; background-color: #e84e36; color: #fff; transition: top .4s, opacity .4s;} .mobile-menu-close.is-active {top: 0px; opacity: 1;} body.mobile-menu-is-opened {overflow: hidden; width: 100%; height: 100%;} .mobile-menu .nav-list__hidden {width: 100%; width: calc(100% + 40px); margin: 20px -20px 10px -20px; box-shadow: none; border-radius: 0; position: static; visibility: visible; transform: none; opacity: 1; padding: 20px 10px 1px 10px;} .mobile-menu .nav-list__hidden li {-ms-flex-preferred-size: 0; flex-basis: 0; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; min-width: auto; white-space: nowrap; margin: 0 10px 20px 10px;} @media screen and (max-width: 1023px) { body {background-image: none;} .wrapper {padding: 0;} .wrapper-container {max-width:1000px; border-radius: 0;} .header {padding: 0; background-color: var(--bg-color-second);} .main, .footer, .header__inner {padding-left: 20px; padding-right: 20px;} .sidebar, .header__caption, .header::before, .wrapper::before {display: none;} .header__logo {position: static;} .header__search {margin: 0 0 0 20px;} .header__btn-mobile-menu {display: block; cursor: pointer; font-size: 3rem; margin-left: 20px; height: 40px; line-height: 40px; color: #fff;} .header__sign-in {margin-left: 20px; width: 40px; height: 40px; line-height: 40px; font-size: 0; padding: 0;} .header__sign-in .fal {margin: 0; line-height: 40px; font-size: 1.8rem;} .footer {display: block; text-align: center;} .footer__logo {margin-right: auto; margin-left: auto;} .footer__menu, .footer__counter {justify-content: center; margin-top: 15px;} .header__inner { padding: 0 15px 15px; } .logo { font-size: 25px; line-height: 27px; background: url(../images/logo.svg) 0 0 / 45px no-repeat; padding-left: 59px; padding-top: 10px; } .soon-item.item * { color: var(--fourth-text-color); } .section__subtitle { color: var(--fourth-text-color); } span.fal.fa-bars { display: block; width: 29px; height: 29px; background: url(../images/menu.svg) no-repeat; background-size: cover; } } @media screen and (max-width: 950px) { .wrapper-container {max-width:100%} .section--new, .section--top {width: 100%; margin-left: 0;} .section--new {margin-bottom: 60px !important;} .artist-item {width: 50%;} .short-item, .top-item {width: 100%;} .inner-page__play {max-width: 50%;} } @media screen and (max-width: 760px) { .wrapper {overflow: hidden;} .header__search {min-width: 100%; order: 10; margin: 0; margin-top: 20px;display: none;} .header__logo {flex: 1 1 0; max-width: 135px; min-width: 100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .collection-item {width: 33.33%;} .ap-title, .ap-artist {max-width: 100%;} .ap-desc {position: absolute; left: 0; right: 0; bottom: 100%; z-index: 5; min-width: 100%; padding: 10px; background-color: #353b48; box-shadow: 0 0 30px rgba(0,0,0,0.1); visibility: hidden; height: auto;} .ap-mob-btn {display: block; cursor: pointer; font-size: 28px; color: #fff;} .ap-time {display: block; position: absolute; right: 45px;} .ap-desc.is-active {visibility: visible;} .audioplayer-volume {display: none;} .ap-btns {left: 70px; transform: translate(0,-50%);} .wplayer {padding: 0px;} .audioplayer, .audioplayer-bar {border-radius: 0;} .audioplayer {padding: 16px 20px 10px 20px;} .inner-page__category {display: none;} .inner-page__header .stretch-free-width {min-width: 100%; text-align: center; } .inner-page__meta {margin: 0;} .inner-page__columns {display: block;} .inner-page__left-column {margin: 0 auto 20px auto;} .inner-page__info li {width: 100%;} .inner-page__play {max-width: 100%; width: 100%; margin-bottom: 20px;} .inner-page__rating {margin: auto; position: relative; left: -5px;} .inner-page--artist .inner-page__meta, .inner-page--collection .inner-page__meta, .inner-page__quantity {display: none;} .inner-page--collection .inner-page__poster {height: 180px;} .add-comments-form__input {min-width: 100%; margin: 0 0 10px 0;} .add-comments-form__btn {width: 100%; order: 10;} .add-comments-form .form__row--protect .form__caption {width: 100%; margin: 0 0 10px 0;} .mass_comments_action, .comment-item__controls {display: none;} .podborki-main a {width: 48% !important;text-align: center; margin:1%;} .downloadBtn { text-align:center; width:100%; margin-left:0; } .section { width:100%; } .item { padding:0; } .top-item__inner { padding: 15px; } .main, .footer, .header__inner { padding-left: 10px; padding-right: 10px; } .section__items { margin: 0; } .header__inner { padding: 5px 15px 10px; } .header__btn-mobile-menu { top: 25px; position: absolute; right: 22px; } .item__title.ws-nowrap { white-space: normal; } .top-item__description { height:auto; } .music-card-info .inner-page__ctrl { order: 1; } .music-card-info .inner-page__info { order: 2; } .music-card-info .ul-my { order: 3; margin-bottom: 20px; } .music-card-info .inner-page__rating { order: 4; } span.share,.sharing_btns { text-align:center; } .sharing_btns a { background: #ff6b4d; display: inline-block; width: 44px; height: 44px; } .sharing_btns a:nth-child(3) { background-position: 15px; } .btn-search.hidden { display: block; position: absolute; right: 80px; cursor: pointer; top: 25px; } .btn-search span { display: block; width: 28px; height: 28px; background: url(../images/search_btn.svg) no-repeat; background-size: cover; } .header__search input, .header__search input:focus { border-radius: 10px; } } @media screen and (max-width: 590px) { .short-item__description > * {width: 100%; padding-right: 20px;} .short-item__description > *:last-child {display: none;} .login {max-width: 90%; max-height: 90%; overflow-x: hidden; overflow-y: auto;} .login__header, .login__content, .login__social, .pages-bg {padding-left: 20px; padding-right: 20px;} .col-3.artist {width: 33%;} } @media screen and (max-width: 470px) { .collection-item {width: 50%;} .artist-item {width: 100%;} .section--artists .section__content {padding: 0;} .section--artists .artist-item__inner {padding: 20px; border-bottom: 1px solid #f2f2f2;} .section--collections .collection-item:nth-child(5n) {display: none;} .col-3.artist {width: 50%;} } /* INFO MESSAGES, ERRORS */ .message-info {margin-bottom: 20px; padding: 10px 20px; background-color: #f2f6f9; border: 1px solid #c6d2db;} .message-info--title {font-weight: 400;} .message-info a {color: inherit; text-decoration: underline; font-weight: 400;} .message-info--yellow {background: #fce5ba; color: #a76846; border-color: #ebd3a7;} .message-info--red {background: #fdeced; color: #8d5556; border-color: #e2c4c5;} /* VOTE BLOCK */ .vote-title {margin: 0 -30px; margin-bottom: 15px; padding: 15px 30px; background-color: #f6feef; color: #6cb030; line-height: 1.3;} .vote {margin-bottom:10px; font-size: 14px;} .vote:after {content: ""; display: table; clear: both;} .vote input {display:none;} .vote label {position:relative;} .vote label:before { content:""; margin:0 10px 0 0; cursor:pointer; position:relative; top:-1px; width:10px; height:10px; border-radius:5px; background-color:#ccc; display:inline-block; vertical-align:middle;} .vote input:checked + label:before {box-shadow:inset 0 0 0 4px #e04d89; background-color:#e04d89;} .vote label:hover {cursor:pointer; color:#ee5256;} .vcount {margin-top:10px;} .vote-buts {padding:10px 0 0px 0;} .vvote {width:50%; padding:0 !important; font-size:14px !important;} button.vres, button.vall {width:40px; text-align:center; padding:0 !important;} /* MAY BE TO DELETE */ .ui-icon, .close { display: block; overflow: hidden; text-indent: -9999px; white-space: nowrap; } #pollbox { border-bottom: 1px dashed #E3E3E3; padding-bottom: 22px } #dle-poll-list, #searchtable, .pm-status { padding: 0 0 20px 0; border-radius: 6px;} .bbcodes_poll{width:100px} .fbutton {margin-right:10px;} fieldset {border: 1px solid #bfced6;padding: 5px;text-align: left;} /* SERVICE FORM BASIC ----------------------------------------------- */ .form__header {margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;} .form__title {font-size: 24px; font-weight: 500; flex: 1 1 0; max-width: 100%; min-width: 50px;} .form__row {display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; margin-bottom: 20px;} .form__caption {width: 200px; padding-right: 20px;} .form__content {flex: 1 1 0; position: relative; max-width: 100%; min-width: 50px;} .form__label--important::after {content: "*"; margin: 0 0 0 5px; color: #e85319;} .form__caption--above {width: 100%; padding: 15px 20px; background-color: #2f343a; color: #fff;} .form__btn, .qq-upload-button, .pm__links a, .usp__btn a {cursor: pointer; display: inline-block; border-radius: 4px; padding: 0 20px; text-align: center; font-size: 14px; font-weight: 400; background-color: var(--primary-color); color: #fff; line-height: 40px; box-shadow: none; max-width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;} .form__btn--secondary {background-color: #eee; color: #000; margin-left: 20px;} .form__btn--find-related {position: absolute; right: 0; top: 0; margin: 0; padding: 0 10px; font-size: 12px !important;} .form__btn:hover, .qq-upload-button:hover, .pm__links a:hover, .usp__btn a:hover {background-color: var(--primary-color-darker); color: #fff;} /* SERVICE FORM EXTENDED ----------------------------------------------- */ .form__content--admintag {display: flex; flex-wrap: wrap; justify-content: flex-start; margin-right: -20px;} .form__content--admintag .checkbox {width: 33.33%; margin-bottom: 20px; padding-right: 20px;} .checkbox, .comments_subscribe {position: relative; padding-left: 50px;} .checkbox input, .comments_subscribe input {appearance: none; -webkit-appearance: none; display: inline-block; transition: all .2s linear; height: 20px; width: 40px; border-radius: 10px; background-color: #eee; cursor: pointer; box-shadow: inset 0 2px 5px rgba(0,0,0,0.1); position: absolute; left: 0; top: 50%; margin-top: -10px;} .checkbox input::before, .comments_subscribe input::before {content: ''; width: 18px; height: 18px; border-radius: 10px; position: absolute; left: 1px; top: 1px; background-color: #fff; transition: all .2s linear;} .checkbox input:checked, .comments_subscribe input:checked {background-color: #6ab04c;} .checkbox input:checked::before, .comments_subscribe input:checked::before {left: 21px;} .findrelated {margin-top: 10px; padding: 8px 10px; background-color: #f6e58d; font-size: 12px;} .form__table {width: 100%;} .form__table td {padding-bottom: 20px;} .form__table .addnews {width: 200px;} .xfields textarea, .xprofile textarea, .form__textarea-inside textarea, #comments_ifr {height:100px !important;} .xfields input, .xprofile input {max-width: width 100%;} .xfields_table td {vertical-align:top;} .xfields .bb-editor, .xfields .wseditor {margin-top:10px;} .form__content--sec-code input {display: inline-block; max-width: 210px; vertical-align: middle; margin-right: 10px; height: 80px; line-height: 80px; font-size: 24px;} .form__content--sec-code > a {display: inline-block; vertical-align: middle;} #result-registration > span {display: inline-block; margin-top: 10px;} .form__content select, #category {width: 100% !important;} .form__content--usertag .checkbox {width: 50%;} /* STATS, PM ----------------------------------------------- */ .stats__list {width:33.33%; margin-bottom: 20px;} .stats__list li {padding:0 15px 10px 1px;} .stats h2 {font-size:18px; font-weight: 400; margin-top: 20px;} .stats__latest li {margin-bottom: 10px;} .table-responsive {overflow-y:hidden; overflow-x:auto;} .dle-table, .pm {width: 100%; border: 1px solid #cee0ed;} .dle-table td, .pm td {padding:10px; font-size:12px; border: 1px solid #cee0ed;} .dle-table thead tr:nth-child(1), .pm tr:nth-child(1) {background-color:#cee0ed;} .dle-table tr:nth-child(2n+2), .pm tr:nth-child(2n+2) {background-color:#f2f6f9;} .pm tr td:first-child {width: 37px;} .pm__links a, a.pm_list + a {margin-right: 20px;} .pm__status, #blind-animation {margin-bottom:40px;} .pm_progress_bar {border-radius:4px; margin:10px 0; overflow:hidden; box-shadow: inset 0 2px 5px rgba(0,0,0,0.1); background-color: #eee;} .pm_progress_bar span {background:#6ab04c; font-size:0; text-indent:-2000em; height:20px; display:block; overflow:hidden;} .pm select {width:100%; margin-bottom:10px;} .pm-item__img {width: 60px; height: 60px; border-radius: 50%; margin-right: 20px;} .pm-item__text {margin: 6px 0 10px 0;} .pm-item__meta > span {margin-right: 20px; font-size: 12px;} /* USER PROFILE, POPUP ----------------------------------------------- */ .usp {border: 1px solid #cee0ed; margin-bottom: 40px; background-color: #fff;} .usp__columns {background: #000 url(../dleimages/usp-bg.jpg) center center / cover no-repeat; padding: 20px; color: #fff; position: relative;} .usp__left, .usp__middle, .usp__right {position: relative; z-index: 5;} .usp__columns::before {content: ''; background-color: var(--primary-color); opacity: 0.6; position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .usp__meta {background-color: #f2f6f9; padding: 20px;} .usp__list {padding: 20px; padding-bottom: 10px;} .usp__list + .usp__list {padding-top: 0;} .usp__left {width: 100px; margin-right: 20px; text-align: center;} .usp__right {width: 180px; margin-left: 20px;} .usp__img {width: 80px; height: 80px; border-radius: 50%; margin: 0 auto; box-shadow: 0 0 0 5px rgba(0,0,0,0.2);} .usp__status {padding: 6px 0; border-radius: 4px; color: #fff; margin: 0 10px; width: 80px; text-align: center; white-space: nowrap; font-size: 12px;} .usp__status--online {background-color: #6ab04c;} .usp__status--offline {background-color: #eb4d4b;} .usp__btn a {width: 100%;} .usp__name {font-size: 18px; font-weight: 400;} .usp__group {font-size: 12px; margin-top: 10px;} .usp__group > b {display: inline-block; vertical-align: middle; border-radius: 3px; background-color: #fff; padding: 3px 6px; margin-left: 3px;} .usp__activity > div {margin-left: 20px; font-size: 12px;} .usp__activity > div > div {font-size: 18px; margin-top: 3px;} .usp__list li {position: relative; padding-left: 140px; margin-bottom: 10px; font-size: 12px; width: 48%;} .usp__list li > span:first-child {color: #999; display: inline-block; position: absolute; left: 0; top: 0;} .usp__list li.no-label {padding-left: 0;} .usp-popup__left {width: 80px; margin-right: 30px; text-align: center;} .usp-popup__img {border-radius: 10px; width: 80px; height: 80px; margin: 0 auto;} .usp-popup__left .usp__status {width: 80px; margin: 15px 0 0 0; display: inline-block;} .usp-popup__list li {margin-bottom: 6px; font-size: 12px;} .usp-popup__list li > span:first-child {opacity: 0.6;} /* SEARCH PAGE, SEARCH TABLE */ .search-page__title {font-size: 18px; margin-bottom: 20px;} .search-page .search > div {display: flex; justify-content: space-between; margin: 0 !important; padding: 20px; background-color: #f2f6f8; border-radius: 6px; padding-bottom: 10px;} .search-page .search br {display: none;} .search-page .search #searchinput {flex: 1 1 0; margin-right: 20px; min-width: 100px;} .searchstyle { width: 480px } .search { padding: 0 } #searchtable, #searchtable td { vertical-align: top; text-align: left } #searchtable fieldset { font-size: 11px; border: 1px solid #d7d7d7; padding: 10px; text-align: left; margin: 0 4px 4px 0 !important; border-radius: 6px } fieldset legend { font-size: 11px; font-weight: bold; color: #696969; } #searchtable table, #searchtable form { margin: 0; width:100%;} #searchtable select { background-color: #fff } #searchuser, #searchinput { width: 90% !important; } .search > div {margin-bottom:10px;} .search input[type="text"], .search select {display:block; width:100% !important; margin-bottom:10px;} .search input[type="checkbox"], .search input[type="radio"] {margin-right:5px;} #searchinput + br, #searchinput + br + br {display:none;} /*--- AJAX LOADER ---*/ #loading-layer {display: block !important; background-color: rgba(0,0,0,0); z-index:9999 !important; overflow: hidden; position: fixed; width: 100px; height: 100px; text-indent: -9999px;} #loading-layer::before, #loading-layer::after {border-radius: 50%; width: 100px; height: 100px; content: ''; background-color: var(--primary-color); position: absolute; top: 50%; left: 50%; margin: -50px 0 0 -50px} #loading-layer::after {width: 40px; height: 40px; margin: -30px 0 0 -30px; border: 10px solid rgba(255,255,255,0.2); border-left-color: #fff; animation: spin 1s infinite linear;} @keyframes spin { 0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);}} /*--- QUOTES, SPOILERS, HIDDEN TEXT, SCRIPTCODE ---*/ .scriptcode, .title_spoiler, .text_spoiler { padding: 3px 5px; background: #f0f0f0; border: 1px solid #e3e3e3; } .title_quote {font-weight: 700; margin-bottom: 6px;} .quote {margin: 0 0 20px 40px; padding: 10px 20px; font: italic 16px/1.6 Georgia; background-color:#f2f6f9; border-left: 3px solid var(--primary-color);} .title_spoiler {margin-top: 2px; } .text_spoiler { margin-bottom: 2px; } .title_spoiler img { vertical-align: middle !important; margin:0 5px 0 0; border:0;} .scriptcode { color: #4c6d0f; text-align: left; font-family: "Courier New" } .title_spoiler { font-weight: normal; } .text_spoiler { border-top: 0; text-align: justify; } .hide { background-color: #f0f0f0; padding: 5px; color: #000; margin: 0 0 1em 0 } .hide a { text-decoration: underline; } .hide a:hover { text-decoration: none } .inhide { border: 1px solid #d1e3ef; padding: 5px; background-color: #fff; margin-bottom: 5px } /*--- CALENDAR---*/ .calendar { font-size:12px; width: 100%; color:#444; } .calendar td, .calendar th { padding: 7px 0; vertical-align: middle; text-align: center; } .calendar td.day, .calendar td.day-active-v, .calendar th.workday { border: 1px solid #e9e9e9; background-color: #fff; } .calendar td.weekday, .calendar td.day-active, .calendar th.weekday { border: 1px solid #e3e3e3; background-color: #ebeef3; } .weekday-active-v, .day-active-v, .weekday-active, .day-active { font-weight: bold; } .day-active a, .day-active-v a {color:#3c6695;} .calendar td.day-current { background: #fd8924; } .day-current a, .day-current { color: #fff !important; } th.monthselect { text-align: left; padding-bottom:5px; } th.monthselect b { font-weight: normal; } th.monthselect center { text-align: right; } .archives {display:block; color:#3c6695; margin-bottom:7px; padding-left:15px; font-size:14px;} .archives:hover {text-decoration:underline;} .archives b {font-weight:700;} .archives + br, #dle_news_archive_link br {display:none;} #dle_news_archive_link .archives {color:#000; margin-bottom:0;} /*--- RATING ---*/ .unit-rating{list-style:none;margin:0;padding:0;width:86px;height:17px;position:relative; background:url(../dleimages/rating.png) repeat-x; display:inline-block;} .unit-rating li{text-indent:-90000px;padding:0;margin:0;float:left} .unit-rating li a{display:block;width:17px;height:17px;text-decoration:none;text-indent:-9000px; z-index:17;position:absolute;padding:0} .unit-rating li a:hover{background:url(../dleimages/rating.png) 0 -17px;z-index:2;left:0} .unit-rating a.r1-unit{left:0} .unit-rating a.r1-unit:hover{width:17px} .unit-rating a.r2-unit{left:17px} .unit-rating a.r2-unit:hover{width:34px} .unit-rating a.r3-unit{left:34px} .unit-rating a.r3-unit:hover{width:51px} .unit-rating a.r4-unit{left:51px} .unit-rating a.r4-unit:hover{width:68px} .unit-rating a.r5-unit{left:68px} .unit-rating a.r5-unit:hover{width:85px} .unit-rating a.r6-unit{left:85px} .unit-rating a.r6-unit:hover{width:102px} .unit-rating a.r7-unit{left:102px} .unit-rating a.r7-unit:hover{width:119px} .unit-rating a.r8-unit{left:119px} .unit-rating a.r8-unit:hover{width:136px} .unit-rating a.r9-unit{left:136px} .unit-rating a.r9-unit:hover{width:153px} .unit-rating a.r10-unit{left:153px} .unit-rating a.r10-unit:hover{width:170px} .unit-rating li.current-rating{background:url(../dleimages/rating.png) 0 -34px;position:absolute; height:17px;display:block;text-indent:-9000px;z-index:1} .mrating .unit-rating{list-style:none;margin:0;padding:0;width:150px;height:30px;position:relative; background:url(../dleimages/rating1.png) repeat-x; display:inline-block;} .mrating .unit-rating li{text-indent:-90000px;padding:0;margin:0;float:left;width:30px;height:30px;} .mrating .unit-rating li a{display:block;width:30px;height:30px;text-decoration:none;text-indent:-9000px; z-index:17;position:absolute;padding:0} .mrating .unit-rating li a:hover{background:url(../dleimages/rating1.png) 0 -30px;z-index:2;left:0} .mrating .unit-rating a.r1-unit{left:0} .mrating .unit-rating a.r1-unit:hover{width:30px} .mrating .unit-rating a.r2-unit{left:30px} .mrating .unit-rating a.r2-unit:hover{width:60px} .mrating .unit-rating a.r3-unit{left:60px} .mrating .unit-rating a.r3-unit:hover{width:90px} .mrating .unit-rating a.r4-unit{left:90px} .mrating .unit-rating a.r4-unit:hover{width:120px} .mrating .unit-rating a.r5-unit{left:120px} .mrating .unit-rating a.r5-unit:hover{width:150px} .mrating .unit-rating a.r6-unit{left:150px} .mrating .unit-rating a.r6-unit:hover{width:180px} .mrating .unit-rating a.r7-unit{left:180px} .mrating .unit-rating a.r7-unit:hover{width:210px} .mrating .unit-rating a.r8-unit{left:210px} .mrating .unit-rating a.r8-unit:hover{width:240px} .mrating .unit-rating a.r9-unit{left:240px} .mrating .unit-rating a.r9-unit:hover{width:270px} .mrating .unit-rating a.r10-unit{left:270px} .mrating .unit-rating a.r10-unit:hover{width:300px} .mrating .unit-rating li.current-rating{background:url(../dleimages/rating1.png) 0 -60px;position:absolute; height:30px;display:block;text-indent:-9000px;z-index:1} /*---BB EDITOR ---*/ .bb-pane {border-bottom: 1px solid #dcdcdc; background-color: #f2f6f9; display: flex; flex-wrap: wrap; justify-content: flex-start; padding:10px 1px 10px 10px; border-radius: 10px 10px 0 0; position: relative; z-index: 10;} .bb-btn {display: inline-block; height: 30px; line-height: 30px; width: 30px; margin-right: 5px; cursor: pointer; font-size: 14px; border-radius: 4px; text-align: center; transition: all .3s} .bb-btn:hover {color: #000; background-color: #fff;} @font-face {font-family: 'bb-editor-font'; src: url(../webfonts/bb-editor.woff) format('woff'); font-weight: normal; font-style: normal;} [class^="bb-btn"], [class*=" bb-btn"] {font-family: 'bb-editor-font'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} .bb-sel { float: left; padding: 2px 2px 0 2px; } .bb-sel select { font-size: 11px; } .bb-sep { display: inline-block; float: left; width: 1px; padding: 2px; } .bb-btn { cursor: pointer; outline: 0; } #b_font select { padding: 0px;} #b_size select { padding: 0px;} #b_b:before {content: "\f032";} #b_i:before {content: "\f033";} #b_u:before {content: "\f0cd";} #b_s:before {content: "\f0cc";} #b_img:before { content: "\f03e"; } #b_up:before { content: "\e930"; } #b_emo:before { content: "\f118"; } #b_url:before { content: "\f0c1"; } #b_leech:before { content: "\e98d"; } #b_mail:before { content: "\f003"; } #b_video:before { content: "\e913"; } #b_audio:before { content: "\e911"; } #b_hide:before { content: "\e9d1"; } #b_quote:before { content: "\e977"; } #b_code:before { content: "\f121"; } #b_left:before { content: "\f036"; } #b_center:before { content: "\f037"; } #b_right:before { content: "\f038"; } #b_color:before { content: "\e601"; } #b_spoiler:before { content: "\e600"; } #b_fla:before { content: "\ea8d"; } #b_yt:before { content: "\f166"; } #b_tf:before { content: "\ea61"; } #b_list:before { content: "\f0ca"; } #b_ol:before { content: "\f0cb"; } #b_tnl:before { content: "\ea61"; } #b_br:before { content: "\ea68"; } #b_pl:before { content: "\ea72"; } #b_size:before { content: "\f034"; } #b_font:before { content: "\f031"; } #b_header:before { content: "\f1dc"; } #b_sub:before { content: "\f12c"; } #b_sup:before { content: "\f12b"; } #b_justify:before { content: "\f039"; } .bb-pane h1{font-size:36px;margin-top:5px;margin-bottom:5px} .bb-pane h2{font-size:30px;margin-top:5px;margin-bottom:5px} .bb-pane h3{font-size:24px;margin-top:5px;margin-bottom:5px} .bb-pane h4{font-size:18px;margin-top:5px;margin-bottom:5px} .bb-pane h5{font-size:14px;margin-top:5px;margin-bottom:5px} .bb-pane h6{font-size:12px;margin-top:5px;margin-bottom:5px} .bb-pane-dropdown{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:180px;padding:5px 0;margin:2px 0 0;list-style:none;font-size:11px;border:1px solid rgba(0, 0, 0, 0.15);border-radius:4px;background:white;box-shadow:0 1px 2px #dadada} .bb-pane-dropdown > li > a{display:block;padding:3px 10px;clear:both;font-weight:normal;line-height:1.42857;color:#333333;white-space:nowrap} .bb-pane-dropdown > li > a:hover,.bb-pane-dropdown > li > a:focus{text-decoration:none;color:#262626;background-color:whitesmoke} .bb-pane-dropdown .color-palette div .color-btn{width:17px;height:17px;padding:0;margin:0;border:1px solid #fff;cursor:pointer} .bb-pane-dropdown .color-palette{padding:0px 5px} .bb-editor textarea{margin-top:-1px} .editorcomm .bb-editor { width: 565px;} .editorcomm .bb-editor textarea { height: 200px; } /*--- QUICK EDIT FIELDS---*/ .quick-edit-text {padding: .4em;width: 350px;} .quick-edit-textarea {height: 250px;padding: 2px; border: 1px solid #d7d7d7;width: 100%;box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);} /*--- DROP NENU ---*/ #dropmenudiv { font: 12px Arial; padding: 10px; display: none; background: #fff; border-radius: 8px; box-shadow: 0 0 50px 0 rgba(0,0,0,0.22); z-index:200 !important;} #dropmenudiv a { display: block; text-decoration: none; padding: 5px 8px; width: 154px } /*--- HIGHSLIDE GALLERY ---*/ .highslide-container {z-index: 1099 !important;} .highslide-wrapper, .highslide-outline { background: #fff } .highslide-image { border: 2px solid #fff } .highslide-active-anchor { visibility: hidden } .highslide-active-anchor img { visibility: hidden } .highslide-dimming { background-color: black } .highslide-html { background-color: white } .highslide-loading { display: block; color: white; font-size: 9px; font-weight: bold; text-decoration: none; padding: 3px; border: 1px solid white; background-color: black } a.highslide-full-expand { background: url("../dleimages/fullexpand.gif") no-repeat; display: block; margin: 0 10px 10px 0; width: 34px; height: 34px } .highslide-display-block { display: block } .highslide-display-none { display: none } .highslide-caption { display: none; padding: 5px; background: white } .highslide-controls { width: 195px; height: 40px; background: url("../../../engine/classes/highslide/graphics/controlbar-black-border.gif") no-repeat 0 -90px; margin-right: 15px; margin-bottom: 10px; margin-top: 10px } .highslide-controls ul { position: relative; left: 15px; height: 40px; list-style: none; margin: 0; padding: 0; background: url("../../../engine/classes/highslide/graphics/controlbar-black-border.gif") no-repeat 100% -90px } .highslide-controls li { float: left; padding: 5px 0; } .highslide-controls a { background: url("../../../engine/classes/highslide/graphics/controlbar-black-border.gif"); display: block; float: left; height: 30px; width: 30px; outline: none } .highslide-controls a.disabled { cursor: default } .highslide-controls a span { display: none } .highslide-controls .highslide-previous a { background-position: 0 0 } .highslide-controls .highslide-previous a:hover { background-position: 0 -30px } .highslide-controls .highslide-previous a.disabled { background-position: 0 -60px !important } .highslide-controls .highslide-play a { background-position: -30px 0 } .highslide-controls .highslide-play a:hover { background-position: -30px -30px } .highslide-controls .highslide-play a.disabled { background-position: -30px -60px !important } .highslide-controls .highslide-pause a { background-position: -60px 0 } .highslide-controls .highslide-pause a:hover { background-position: -60px -30px } .highslide-controls .highslide-next a { background-position: -90px 0 } .highslide-controls .highslide-next a:hover { background-position: -90px -30px } .highslide-controls .highslide-next a.disabled { background-position: -90px -60px !important } .highslide-controls .highslide-move a { background-position: -120px 0 } .highslide-controls .highslide-move a:hover { background-position: -120px -30px } .highslide-controls .highslide-full-expand a { background-position: -150px 0 } .highslide-controls .highslide-full-expand a:hover { background-position: -150px -30px } .highslide-controls .highslide-full-expand a.disabled { background-position: -150px -60px !important } .highslide-controls .highslide-close a { background-position: -180px 0 } .highslide-controls .highslide-close a:hover { background-position: -180px -30px } /*--- TAGS CLOUD ---*/ .clouds_xsmall, .clouds_small, .clouds_medium, .clouds_large, .clouds_xlarge {display:inline-block; border-radius:6px; margin:0 3px 6px 0;} .clouds_xsmall { font-size: 1em } .clouds_small { font-size: 1.1em; font-weight: bold } .clouds_medium { font-size: 1.2em; font-weight: bold } .clouds_large { font-size: 1.3em } .clouds_xlarge { font-size: 1.4em } .clouds_xsmall:hover, .clouds_small:hover, .clouds_medium:hover, .clouds_large:hover, .clouds_xlarge:hover {} .cloud-tags span a {display:block; padding:5px 7px; border:1px solid #e3e3e3;} .cloud-tags span a:hover {background-color:#3c6695; box-shadow:0 0 10px 0 rgba(0,0,0,0.2); color:#fff;} .tags_more {margin-top:10px;} /*--- SEARCH SUGGESTIONS---*/ #searchsuggestions {z-index: 99998; width: 244px; font-size: 12px; background: #fff; box-shadow: 0 0 30px rgba(0,0,0,0.1);} #searchsuggestions a, #searchsuggestions span {display: block;} #searchsuggestions a, #searchsuggestions span.notfound {padding:10px 15px; border-bottom: 1px solid #f5f5f5;} #searchsuggestions a {color: #010101;} #searchsuggestions a:hover {background-color:#f5f6f8} #searchsuggestions span.searchheading {margin-bottom:10px; font-size: 16px;} #searchsuggestions span.searchheading + span {color: #949494;} #searchsuggestions span.seperator a {padding: 10px 0; text-align: center; background-color:#444; color: #fff; } #searchsuggestions span.notfound {padding: 15px 20px;} #searchsuggestions .break, #searchsuggestions span.seperator {display: none;} @media screen and (max-width: 960px) { #searchsuggestions {width: calc(100% - 40px);} } /*--- UI WIDGETS ---*/ .ui-widget-overlay {background: #000; opacity:0.5; left: 0; top: 0; right: 0; bottom: 0; position: fixed;} * html .ui-helper-clearfix { height: 1% } .ui-helper-clearfix {display: block;} .ui-dialog { background-color: #fff; position: absolute; width: 500px; box-shadow: 0 20px 60px rgba(0,0,0,0.3); border-radius: 10px; overflow: hidden;} .ui-dialog-titlebar {background-color:var(--primary-color); color: #fff;} .ui-dialog-title {display: block; font-size: 18px; padding: 15px 60px 15px 30px;} .ui-dialog .ui-dialog-content {padding:30px; overflow: auto; position: relative;} .ui-dialog .ui-dialog-buttonpane {padding: 15px 25px; text-align: center; background-color:#f2f6f8;} .ui-icon-closethick {cursor: pointer; position:absolute; right:7px; top:7px; width: 40px; height: 40px;} .ui-icon-closethick:before {content:"\f00d"; font-family:'Font Awesome 5 Pro'; width:40px; height:40px; line-height:40px; text-align:center; color: #fff; position:absolute; right:0; top:0px; text-indent:0; font-size:18px; display:block;} .ui-dialog .ui-dialog-content > br {display: none;} .ui-dialog .ui-dialog-buttonpane button {height: 30px !important; line-height: 30px !important; margin: 0 5px; padding: 0 15px !important; font-size: 12px !important;} .ui-dialog .ui-resizable-se {bottom: 3px; height: 14px; right: 3px; width: 14px;} .ui-draggable .ui-dialog-titlebar {cursor: move;} .ui-state-error {background: #fef1ec 50% 50% repeat-x !important; border: 1px solid #cd0a0a; color: #cd0a0a;} /*--- VOTE BARS ---*/ .voteprogress,.pollprogress{overflow:hidden;height:15px;margin-bottom:5px;background-color:#f7f7f7;background:linear-gradient(to bottom, #f5f5f5, #f9f9f9);box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.1);border-radius:4px} .voteprogress span,.pollprogress span{color:#ffffff;text-align:center;text-indent:-2000em;height:15px;display:block;overflow:hidden;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);background:#0e90d2;background:linear-gradient(to bottom, #149bdf, #0480be)} .voteprogress .vote2, span.poll1{background-color:#dd514c;background:linear-gradient(to bottom, #ee5f5b, #c43c35)} .voteprogress .vote3, span.poll2{background-color:#5eb95e;background:linear-gradient(to bottom, #62c462, #57a957)} .voteprogress .vote4, span.poll3{background-color:#4bb1cf;background:linear-gradient(to bottom, #5bc0de, #339bb9)} .voteprogress .vote5, span.poll4{background-color:#faa732;background:linear-gradient(to bottom, #fbb450, #f89406)} /* --- UI MENU --- */ .ui-autocomplete { position: absolute; cursor: default; } * html .ui-autocomplete { width:1px } /* without this, the menu expands to 100% in IE6 */ .ui-menu { list-style:none; padding: 2px; margin: 0; display:block; float: left; background: #fff 50% bottom repeat-x; border: 1px solid #dedede; color: #222; } .ui-menu .ui-menu { margin-top: -3px; } .ui-menu .ui-menu-item { margin:0; padding: 0; zoom: 1; float: left; clear: left; width: 100%; } .ui-menu .ui-menu-item a { text-decoration:none; display:block; padding:.2em .4em; line-height:1.5; zoom:1; } .ui-menu .ui-menu-item a.ui-state-hover, .ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; margin: -1px; border: 1px solid #a7a7a7; color: #4e4e4e; font-weight: bold; } /* --- TEXT [CODE] --- */ pre {display: block; padding: 10px; background: #3F3F3F; color: #DCDCDC; text-shadow: 0 1px 1px #000; box-shadow: inset 0 2px 15px rgba(0,0,0,.5); font-family: Consolas,'Courier New',monospace; font-size: 14px; line-height: 18px; border-radius: 4px; white-space: pre-wrap; word-break: break-all; word-wrap: break-word;} pre .tag, pre.css .class, pre.css .id, pre.lisp .title, pre.nginx .title, pre .request, pre .status, pre .clojure .attribute {color:#E3CEAB} pre.django .template_tag, pre.django .variable, pre.django .filter .argument {color:#DCDCDC} pre .number, pre .date {color:#8CD0D3} pre.dos .envvar, pre.dos .stream, pre .variable, pre.apache .sqbracket {color:#EFDCBC} pre.dos .flow, pre.diff .change, pre.python .exception, pre.python .built_in, pre .literal, pre.tex .special {color:#EFEFAF} pre.diff .chunk, pre .subst {color:#8F8F8F} pre.dos .keyword, pre.python .decorator, pre .title, pre.haskell .type, pre.diff .header, pre.ruby .class .parent, pre.apache .tag, pre.nginx .built_in, pre.tex .command, pre .prompt {color:#efef8f} pre.dos .winutils, pre.ruby .symbol, pre.ruby .symbol .string, pre.ruby .string {color:#DCA3A3} pre.diff .deletion, pre .string, pre .tag .value, pre .preprocessor, pre .pragma, pre .built_in, pre.sql .aggregate, pre .javadoc, pre.smalltalk .class, pre.smalltalk .localvars, pre.smalltalk .array, pre.css .rules .value, pre .attr_selector, pre .pseudo, pre.apache .cbracket, pre.tex .formula, pre.coffeescript .attribute {color:#CC9393} pre .shebang, pre.diff .addition, pre .comment, pre.java .annotation, pre .template_comment, pre .pi, pre .doctype {color:#7F9F7F} pre.coffeescript .javascript, pre.javascript .xml, pre.tex .formula, pre.xml .javascript, pre.xml .vbscript, pre.xml .css, pre.xml .cdata{} /*--- MARK AND SHARE ---*/ #marker-bar,#txtselect_marker{display:block;visibility:hidden;position:absolute;bottom:0;z-index:1200;opacity:0;transition:opacity .4s, visibility .1s linear .4s} #txtselect_marker{cursor:pointer;width:32px;height:32px;background:url(../dleimages/marker.png) -0px -0px no-repeat} #txtselect_marker:hover{background-position:-0px -32px} #marker-bar{border:1px solid #ccc;border-radius:15px;background:#fff;padding:5px 10px;cursor:default;box-shadow:0px 0px 4px #ccc} #marker-bar.show,#txtselect_marker.show{visibility:visible;transition:opacity .4s, visibility 0s;opacity:1} #marker-bar .masha-social,#marker-bar .masha-marker{cursor:pointer;display:block;margin:0 5px;float:left} #marker-bar .masha-marker{line-height:1em;color:#aaa;border-bottom:1px dotted #aaa;margin-right:10px} #marker-bar .masha-marker:hover{color:#ea3e26;border-color:#ea3e26} .user_selection,.user_selection_true{background:#c4f47d;padding:2px 0} .user_selection a.txtsel_close,.user_selection_true a.txtsel_close{display:none} .user_selection .closewrap,.user_selection_true .closewrap{position:relative} .user_selection.hover a.txtsel_close,.user_selection_true.hover a.txtsel_close{display:inline-block;position:absolute;top:-7px;left:-5px;width:33px;height:33px;background:url(../dleimages/closemarker.png) -0px -0px no-repeat} .user_selection.hover a.txtsel_close:hover,.user_selection_true.hover a.txtsel_close:hover{background-position:-0px -33px} #share-popup{background:#fff;border:1px solid #aaa;border-radius:5px;box-shadow:0 0 5px rgba(0,0,0,0.5);position:absolute;width:414px;display:none;z-index:100;padding:10px 0;opacity:0;transition:opacity .4s, visibility .1s linear .4s} #share-popup.show{display:block;opacity:1;transition:opacity .4s, visibility 0s} #share-popup .social{padding:0 0 10px 17px;height:40px} #share-popup .social p{padding-bottom:10px;margin:0;font-weight:bold} #share-popup .social ul{list-style:none;margin:0;padding:0} #share-popup .social ul li{float:left;margin-right:20px;padding-top:2px;position:relative} #share-popup .social ul a{text-decoration:none;font-size:11px;display:inline-block;color:#aaa;padding-left:25px} #share-popup .social ul a:hover{text-decoration:underline;color:#ea3e26} #share-popup .social a span{cursor:pointer;width:20px;height:20px;background:url(../dleimages/social-icons.png) 20px 20px no-repeat;position:absolute;left:0;top:0} #share-popup .social .tw span{background-position:0 -20px} #share-popup .social .tw:hover span{background-position:0 0} #share-popup .social .fb span{background-position:-20px -20px} #share-popup .social .fb:hover span{background-position:-20px 0} #share-popup .social .vk span{background-position:-40px -20px} #share-popup .social .vk:hover span{background-position:-40px 0} #share-popup .social .gp span{background-position:-60px -20px} #share-popup .social .gp:hover span{background-position:-60px 0} #share-popup .link{clear:both;border-top:1px solid #d9d9d9;padding:10px 5px 0 10px;line-height:1.2;overflow:hidden;margin:0 7px} #share-popup .link p{font-weight:bold;padding:0 0 3px 0;margin:0} #share-popup .link span{color:#999;font-size:10px;display:block;padding-top:3px} #share-popup .link a{display:block} .ya-share2.ya-share2_inited {margin-top: 5px;} span.share {display: block;margin-top: 20px;font-weight: 600;} /*--- UPDATES TO NEW VERSIONS ---*/ .comments-tree-list {display: block;margin: 0;padding: 0;list-style: none;} .comments-tree-list .comments-tree-list {padding-left: 25px; position:relative;} .comments-tree-list .comments-tree-list22:before {content:"\f178 "; font-family:'FontAwesome'; position:absolute; left:0; top:0; color:#888;} .comments-tree-item {display: block; margin: 0; padding: 0;} #dlefastreplycomments {padding:10px; background: #f7f6e5; margin: 10px 0 5px 30px;} .commentsreplyname {padding: 2px; border: 1px solid #bcc0c2; width: 200px; background: #fff;} #dlereplypopup form > div {margin-bottom:5px;} #dlereplypopup form input[type="text"] {height:30px; line-height:30px;} #dlereplypopup form textarea {height:80px;} .pollallvotes {text-align: center; margin-top: 10px;} /*--- 11, 12 ---*/ .emoji {border: none;vertical-align: middle;width: 22px;height: 22px;} .xfieldsrow {padding-top:5px;clear: both;} .xfieldscolleft {float: left; width: 30%;} .xfieldscolright {float: left;width: 70%;} .file-box {width: 95%;max-width: 437px;border:1px solid #B3B3B3; border-radius: 3px;background-color: #F5F5F5;padding: 10px;margin-top: 10px;} .qq-uploader { position:relative; width: 100%;} .qq-upload-drop-area {position:absolute; top:0; left:0; width:100%; height:100%; z-index:2;max-width: 437px;background:#FF9797; text-align:center; } .qq-upload-drop-area span {display:block; position:absolute; top: 50%; width:100%; margin-top:-8px; font-size:16px;} .qq-upload-drop-area-active {background:#FF7171;} .uploadedfile {width: 115px;height: 130px;margin: 10px 5px 5px 5px;border:1px solid #B3B3B3;box-shadow: 0px 1px 4px rgba(0,0,0,0.3); text-align: center;background:#ffffff;} .uploadedfile .uploadimage {margin-top: 5px;width: 115px;height: 90px;display: flex;align-items: center;justify-content: center;cursor: move;} .sortable-ghost {opacity: 0.4;} .uploadedfile .info {text-align: left;white-space: nowrap;margin: 0px 5px 0px 5px;overflow: hidden;} .progress {overflow:hidden;margin-top:10px;margin-bottom:10px;background-color:whitesmoke;height:10px; border-radius:8px;background:#eee;box-shadow:0 1px 0 white, 0 0px 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 4px rgba(0, 0, 0, 0.2) inset;} .progress .progress-bar {float:left;width:0%;font-size:12px;line-height:20px;color:white;text-align:center;background-color:#428bca; box-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.15);transition:width 0.6s ease;border-radius:8px;box-shadow:none;height:8px;} .progress-bar span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0;} .progress-blue {background-image:linear-gradient(to bottom, #9bcff5 0%, #6db9f0 100%);background-repeat:repeat-x;border:1px solid #55aeee;} .xfieldimagegallery {margin:20px -5px; list-style: none; clear: both;} .xfieldimagegallery:after {content: ""; display: table; clear: both;} .xfieldimagegallery li {list-style: none; margin:0;} .xfieldimagegallery li img {float: left; margin:5px; border: 5px solid #fff; width: 150px; height: 100px;} .xfieldimagegallery li img:hover {box-shadow: 0px 0px 7px rgba(0,0,0,0.4);} .btn.disabled, .btn[disabled], fieldset[disabled] .btn {cursor:not-allowed; pointer-events:none; opacity:0.65;} .dle-captcha { position: relative; } .dle-captcha:after { clear: both; display: block; content: ""; } .dle-captcha > a { float: left; margin-right: 5px; } .dle-captcha img {position: relative; display: block; width: 130px; height: 46px; transition: all ease .2s;} .dle-captcha > input { float: left; width: 130px; } .xfieldsnote {color: #838383; font-size: .9em;} .instagram-media, .twitter-tweet {display: inline-block !important;} /*--- 13, 14 ---*/ .ui-front {z-index: 1000;} .ui-button-icon-only {overflow: hidden; text-indent: -9999px;} button.ui-dialog-titlebar-close {background-color: transparent !important; position: absolute; right: 0; top: 0;} .emoji_box {width:100%; max-width: 390px;} .emoji_category {padding:7px; clear:both;} .emoji_list {margin-top:5px; margin-bottom:5px; width:100%; font-family:'Apple Color Emoji', 'Segoe UI Emoji', 'NotoColorEmoji', 'Segoe UI Symbol', 'Android Emoji', 'EmojiSymbols'; font-size:2em;} .emoji_symbol {float:left; margin-bottom: 10px; width:12.5%; text-align:center;} .emoji_symbol a, .emoji_symbol a:hover {cursor: pointer; text-decoration:none;} .native-emoji {font-size: 1.3em; font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'NotoColorEmoji', 'Segoe UI Symbol', 'Android Emoji', 'EmojiSymbols';} /* --- ADAPTIVE --- */ @media screen and (max-width: 760px) { .form__caption:not(.form__caption--above), .form__table .addnews {width: 120px; font-size: 12px;} .form__content--admintag .checkbox {width: 100%;} .usp {margin-left: -20px; margin-right: -20px;} .usp__list li {width: 100%;} } @media screen and (max-width: 656px) { a.cat-all { width: 46% !important; } } @media screen and (max-width: 590px) { .form__title {font-size: 18px;} .form__header .form__btn .far {display: none;} .form__btn--find-related {position: static; width: 100%; margin-top: 10px;} .qq-upload-button, .pm__links li, .stats__list {width: 100% !important;} .form__row--without-label > .form__btn, .pm__links li a {width: 100%; margin: 10px 0 0 0;} .form__content--sec-code input {max-width: 100%; width: 100%; margin: 0 0 10px 0; height: 40px; line-height: 40px; font-size: 16px;} .usp__right, .usp__meta .usp__btn {width: 100%; margin-top: 20px; margin-left: 0;} .usp__left {width: 60px; margin-right: 10px;} .usp__img {width: 60px; height: 60px;} .usp__status {width: auto; margin: 0; padding-left: 10px; padding-right: 10px;} .usp__activity {justify-content: flex-end; text-align: right;} .ui-dialog {width:100% !important;} .usp-popup__left {margin: 0 auto 15px auto; width: 100%;} .ui-dialog .ui-dialog-buttonpane button {margin:0 0 5px 0; width:100%;} #dofullsearch, #searchsuggestions span.seperator {display:none !important;} .dcont button {font-size:12px; padding:0 15px !important;} .comments-tree-list .comments-tree-list {padding-left:0px !important;} .comments-tree-list .comments-tree-list:before {display:none;} .mass_comments_action {display:none;} a.cat-all {width: 45% !important;} } @media screen and (max-width: 456px) { a.cat-all {width: 44% !important;} } @media screen and (max-width: 390px) { a.cat-all {width: 100% !important;margin: 10px auto !important;text-align: center;} }