/* BASIC LAYOUT ----------------------------------------------- */ .layout-container {background-color: #161717; background-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0px, rgb(255 255 255 / 5%) 1px, transparent 1px, transparent 6px);} .wrapper-conbox {max-width: var(--max-width); margin: 0 auto; position: relative; z-index: 20;} .page-header {background: var(--bg-black); margin-bottom: 160px; position: relative; box-shadow: var(--bsh);border-bottom: 1px solid var(--accent-2);} .columns-m {background-color: var(--bg); border-radius: 8px; min-height: 100vh; border: 1px solid var(--bdc); box-shadow: inset 0 0 0 1px var(--bdc-lighter);} .kino-footer {padding: 20px 0;} .primary-col {padding: 17px var(--indent); padding-bottom: 40px;} .secondary-col {background-color: var(--bg-lightest); padding: 7px 20px 20px; border-radius: 8px 0 0 8px; width: 330px; border-right: 1px solid var(--bdc); box-shadow: 1px 0 var(--bdc-lighter);} .secondary-col {order: -1;} @supports (display: grid) { .columns-m {display: grid; grid-template-columns: 340px minmax(0,1fr); grid-template-areas: "side main";} .secondary-col {grid-area: side; order: 0; width: auto;} .primary-col {grid-area: main;} } @media screen and (max-width: 1220px) { .columns-m {display: block;} } .caro__menushka + .content {border-top-right-radius: 8px;} #scrolltop {position: fixed; width: 60px; height: 60px; line-height: 60px; right: 10px; bottom: 10px; z-index: 990; display: none; background-color: var(--bg-lighter); color: var(--tt); cursor: pointer; font-size: 24px; border-radius: 50%; text-align: center; box-shadow: var(--bsh);} /* HEADER, NAV ----------------------------------------------- */ .logos-k {display: inline-flex; flex-direction: column; justify-content: center; height: 35px; text-align: left;} .brand__title {text-transform: uppercase; color: #fff; font-size: 18px; letter-spacing: 2px; font-weight: 400; line-height: 1; font-family: auto;} .logo__slogank {font-size: 10px; font-weight: 600; color: #fff; opacity: 0.8; text-transform: uppercase; letter-spacing: 3px; margin-top: 3px;} .header__button {height: 26px;} .header__sulk {margin-right: 20px; font-size: 12px; text-transform: uppercase; letter-spacing: 1px;} .theme-toggle {display: inline-flex; justify-content: space-between; align-items: center; cursor: pointer; background-color: var(--bg-darker); height: 26px; border-radius: 20px; padding: 5px 0; margin-right: 20px;} .theme-toggle li {cursor: pointer; width: 25px; height: 25px; line-height: 25px; border-radius: 50%; text-align: center; color: var(--tt); margin: 0 5px;} .theme-toggle:hover li {color: #fff;} .lt-is-active .theme-toggle li:first-child, body:not(.lt-is-active) .theme-toggle li:last-child {background-color: #414141; color: #fff;} .ksite-search {position:relative; width: 300px; margin: 0 40px;} .ksite-search input, .ksite-search input:focus {padding: 0 50px 0 15px; border-radius: 4px; background-color: var(--bg-darker); color: var(--tt-lighter); border: 0px solid var(--bdc); box-shadow: none; height: 26px; line-height: 26px;} .ksite-search input:not(:focus)::placeholder {color: var(--tt); opacity: 0.8; font-size: 13px;} .ksite-search button {position:absolute; right: 0; top: 0; width: 50px; padding: 0; background: none; color: var(--tt); font-size: 14px; height: 26px;} /* TOP ITEM ----------------------------------------------- */ a.card__picture:hover, .top__img:hover, .poster:hover .poster__kartin {opacity: 0.8;} .caro__menushka li {text-align: center; padding: 0 2px 8px 2px;} .caro__menushka a {display: block; padding: 7px 20px; background-color: #585858d1; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--bdc-lighter); border: 1px solid var(--bdc); border-bottom: 0;} .caro__menushka a.is-active, .caro__menushka a:hover {background-color: var(--accent); color: #fff;} .carou {padding: 10px; background-color: var(--bg-lightest); margin-bottom: 8px; width: 100%; position: relative; border-radius: 6px 6px 6px 6px; box-shadow: inset 0 0 0 1px var(--bdc-lighter); border: 1px solid var(--bdc);} .carou__content:not(.owl-carousel) {display: flex; overflow: hidden;} .carou__content > .top {width: calc((100% - 70px)/8); flex-shrink: 0; margin-right: 10px;} .top__img {border-radius: 4px; border: 1px solid var(--bdc);} .top__opis {position: absolute; left: 0; right: 0; bottom: 0; z-index: 10; padding: 20px; color: var(--tt-lighter);} .poster__stars {position: absolute; left: 0; top: 5px; z-index: 10; border-radius: 0 4px 4px 0; background-color: #aaaaaa; color: #fff; font-size: 12px; padding: 2px; text-align: center; width: 40px; font-weight: 600;} .poster__stars.rating-1, .poster__stars.rating-2, .poster__stars.rating-3 {background-color: #e07978;} .poster__stars.rating-4, .poster__stars.rating-5, .poster__stars.rating-6 {background-color: #e4a257;} .poster__stars.rating-7, .poster__stars.rating-8, .poster__stars.rating-9, .poster__stars.rating-10 {background-color: #9ab96d;} .poster__kartin {box-shadow: var(--bsh-2); border-radius: 3px; margin-bottom: 15px;} .kartin__nazv {line-height: 1.4; font-size: 14px; font-weight: 400;} /* SECTION ----------------------------------------------- */ .sect:not(:last-child) {margin-bottom: 30px;} .sect__golov {margin-bottom: 3px;} .sect__nazv {font-size: 20px; font-weight: 700; color: var(--tt-lighter);} .sect__podnazv {font-size: 21px;} .site-opis {display: grid; grid-gap: 20px; line-height: 1.7; color: var(--tt-darker); margin: 40px 0;} .site-opis h1, .site-opis h2, .site-opis h3 {font-weight: 700; font-size: 18px; color: var(--tt); line-height: 1.3;} .site-opis a {text-decoration: underline; color: var(--tt);} .site-opis ul li {position: relative; padding-left: 25px; margin-left: 25px;} .site-opis ul li::before {content:"\f00c"; font-weight: 900; font-family:'Font Awesome 5 Pro'; color: var(--accent); position: absolute; left: 0; top: 0;} .site-opis img {float:left; margin:0 20px 10px 0; width:240px; border-radius:3px; opacity:0.6;} .speedbar {font-size: 12px; color: var(--tt-darker-2); margin-bottom: 16px; margin-top: 0px;} /*.speedbar a:after {color: var(--tt); display: inline; content: '/'; margin: 0 5px;}*/ .speedbar a:hover {text-decoration: underline;} .sect__btn-filter {height: 30px; padding: 0 10px; margin-left: 20px;} /* CARD ----------------------------------------------- */ .kart {margin: 0 var(--indent-negative); padding: 20px var(--indent); line-height: 1.4; border-top: 1px solid var(--bdc); box-shadow: inset 0 1px var(--bdc-lighter); position: relative;} .kart__kartinka {width: 200px; height: 300px; margin-right: 20px; display: block; border-radius: 4px 4px 0 0; box-shadow: var(--bsh-2)} .kart__nazv, .kart__niz {width: 100%;} .kart__nazv {font-size: 15px; font-weight: 700; margin: -3px 0 17px 0; padding-right: 140px;} .kart__spisok {display: grid; grid-gap: 3px 0; font-size: 13px;} .kart__spisok li > span:first-child {font-weight: 600; margin-right: 3px;} .kart__spisok a {text-decoration: underline;} .kart__spisok--margin {margin-top: 12px;} .kart__tekst {margin-top: 13px;-webkit-line-clamp: 4;} .kart__niz {font-size: 12px;} .kart__meta {margin-left: 20px;} .kart__meta .fas {margin-right: 5px; opacity: 0.66;} .kart__meta--dv {position: absolute; top: 22px; right: 46px; margin: 0;} .kart__knop {border-radius: 0 0 4px 4px; width: 200px; height: 40px; box-shadow: inset 0 0 0 1px var(--bdc-lighter); background-color: var(--bg-darker); color: var(--tt); border: 1px solid var(--bdc); height: 42px; margin-top: -2px;} .kart__izb {position: absolute; right: 0; top: 0; width: 60px; height: 60px; cursor: pointer; font-size: 18px; overflow: hidden; color: var(--tt-lighter);} .kart__izb .fas {position: relative; z-index: 1; width: 100%; height: 100%; cursor: pointer; display: flex !important; justify-content: center; align-items: center; padding: 0 0 25px 25px;} .kart__izb .fas::after {content: ''; background: var(--gradient); box-shadow: var(--bsh-2); z-index: -1; position: absolute; left: 0; top: 0; width: 84%; height: 59%; transform: skew(44deg); transform-origin: 0 0;} .kart__izb .fas.added::after {background: var(--gradient-accent);} .kart__rating-tx {margin-left: 20px; font-size: 16px; font-weight: 600; color: var(--tt-lighter); min-width: 50px; position: relative; height: 40px; display: flex; align-items: flex-end; line-height: 1; white-space: nowrap;} .kart__rating-tx > span {font-size: 10px; font-weight: 400; color: var(--tt); margin-left: 3px; display: inline-block; position: relative; top: -2px;} .kart__rating-tx::before {content: attr(data-text); display: block; position: absolute; left: 24px; top: 0; white-space: nowrap; font-size: 12px; font-weight: 400; color: var(--accent-3); line-height: 20px;} .kart__rating-tx.kp {background: url(../images/kp.svg) 0 0 / 20px no-repeat;} .kart__rating-tx.imdb {background: url(../images/imdb.svg) 0 0 / 18px no-repeat;} .kart__rating-tx.site {padding-left: 50px; min-width: 140px;} .kart__rating-tx-schet {height: 40px; width: 40px; position: absolute; left: 0; top: 0;} .kart__rating-tx svg {width: 150px; height: 150px; position: absolute; left: 0; top: 0; fill: none; transform: scale(0.3,0.3) rotate(-90deg) translate(-50%,-50%); transform-origin: left top; margin: 19px 0 0 20px;} .kart__rating-tx svg circle {width: 150px; height: 150px; fill: inherit; transform: translate(5px,5px); stroke-width: 10; stroke: var(--bg-lightest); stroke-dasharray: 440; stroke-dashoffset: 0;} .kart__rating-tx svg circle:nth-child(2) {stroke: var(--accent-3);} .zvezdu {height: 17px; width: 85px; position: absolute; left: 50px; top: 0px; pointer-events: none; background: url(../dleimages/rating.svg); transform: scale(1,1); transform-origin: left top;} .zvezdu__rating-pol {position: absolute; left: 0; top: 0; height: 100%; z-index: 1; background: url(../dleimages/rating.svg) 0 -34px repeat-x;} .zvezdu__rating {height: 17px; width: 85px; position: absolute; left: 50px; top: 0px; transform: scale(1,1); transform-origin: left top;} .kart .pmovie__stars {position: absolute; top: 22px; right: 46px; margin: 0;} .fadditional { display: flex; align-items: flex-start; flex-wrap: nowrap; } .fadditional-l { width: 15%; flex-shrink: 0; } .fadditional-r { color: var(--tt-lighter-2); flex: 1 1 auto; overflow-wrap: break-word; word-break: break-word; } /* SIDEBAR ----------------------------------------------- */ .side-block:not(:last-child) {margin-bottom: 20px;} .side-block__title {border: 1px solid var(--bdc); border-left: 0; border-right: 0; margin: 0 -20px; box-shadow: 0 1px var(--bdc-lighter), inset 0 1px var(--bdc-lighter); padding: 10px 20px; font-size: 16px; font-weight: 700; margin-bottom: 20px; color: var(--tt-lighter);} li.new {position: relative;} li.new a::after {content: ""; content: NEW; box-sizing: border-box; display: inline-block; vertical-align: middle; border-radius: 8px; padding: 5px 5px; color: #fff; font-size: 12px; margin-left: 8px; font-weight: 600; background: linear-gradient(-45deg,#ee5200,#e70062,#e6af5d,#1c84cd); text-shadow: none; margin-top: -2px; /* Компенсируем отрицательное значение top */ letter-spacing: 1px; background-size: 400% 400%; animation: Gradient 3s ease infinite; font-family: verdana,sans-serif;} @keyframes Gradient {0% {background-position: 0 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;} } .side-block__title.first {border-top: 0; padding-top: 7px; padding-bottom: 14px; box-shadow: 0 1px var(--bdc-lighter);} .navi-kol {width: 52%; margin-bottom: -3px;} .navi-kol + .navi-kol {width: 43%;} .navi-nazv {font-weight: 700; margin-bottom: 9px; color: #f3f2ee;border-bottom: 2px solid #cda98f;padding-bottom: 7px;} .navi-menuha + .navi-nazv {margin-top: 12px;} .navi-menuha a {display:block; padding: 3px 0; font-size: 13px;} .navi-menuha a:hover {text-decoration: underline;} .navi-menuha li {position: relative;} .navi-menuha li > span {position: absolute; right: 0; top: 5px; pointer-events: none; font-size: 12px; color: var(--tt);} .soon + .soon {margin-top: 10px;} .soon__img {width: 60px; height: 90px; border-radius: 3px; box-shadow: var(--bsh-2); margin-right: 10px;} .soon__title {color: var(--tt-lighter); font-weight: 600;} .soon__text {line-height: 1.3; -webkit-line-clamp: 4; font-size: 12px; margin-top: 5px; color: var(--tt);} .upd-box {background-color: var(--bg); border-radius: 4px; box-shadow: vr(--bsh-2); overflow: hidden; padding-bottom: 10px;} .updli {padding: 10px; color: var(--tt);} .updli-1 {width: 60px; height: 60px; border-radius: 3px; box-shadow: var(--bsh-2); margin-right: 10px;} .updli-2 {font-size: 12px;} .updli-2 div {color: var(--tt-lighter); font-weight: 600; font-size: 14px; margin-bottom: 2px;} .updli-3 {text-align: right; width: 120px; margin-left: 10px; font-size: 12px; line-height: 1.1;} .updli-3 div {color: var(--accent-2); font-weight: 600; margin-bottom: 5px;} .updli:hover {background-color: #ffffff10;} .upd-box-title {background: var(--bg-lighter); color: var(--tt-lighter); font-weight: 700; padding: 8px 10px; margin-bottom: 10px;} .lcomm:not(:last-child) {margin-bottom: 5px;} .lcomm {background-color: var(--bg); border-radius: 4px; padding: 10px; font-size: 13px;} .lcomm__link {display: block; color: var(--accent-3); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; padding-left: 1px;} .lcomm__date {font-size: 12px; color: var(--tt-darker-2); margin-left: 10px;} .lcomm__text {margin: 8px 0 10px 0;} .lcomm__author {font-weight: 600;} .lcomm__av {width: 24px; height: 24px; border-radius: 50%; margin-right: 10px;} .nav__watched-button::before {content: ''; background: #f00; width: 8px; height: 8px; border-radius: 50%; margin-right: 10px; display: inline-block;} /* FOOTER, PAGINATION ----------------------------------------------- */ .kino-footer .btn {margin-right: 40px;} .footer__logotip {min-width: 0; margin-right: 30px;} .footer__nadpis {font-size: 13px; line-height: 1.7;} .pagenav {text-align: center; margin: 0 var(--indent-negative); padding: 20px var(--indent); padding-bottom: 0; border-top: 1px solid var(--bdc); box-shadow: inset 0 1px var(--bdc-lighter);} .pagenav__btn-zag a, .pagenav__btn-zag > span {display: inline-flex; justify-content: center; align-items: center; height: 44px; padding: 0 40px; max-width: 400px; background: var(--bg-darker); color: var(--tt); width: 100%; font-weight: 600; text-transform: uppercase; font-size: 12px; letter-spacing: 1px; margin-bottom: 10px; border-radius: 3px; border: 1px solid var(--bdc); box-shadow: inset 0 0 0 1px var(--bdc-lighter);} .pagenav__pages a, .pagenav__pages span {display: inline-block; margin: 10px 5px 0 5px; line-height: 38px; padding: 0 10px; min-width: 40px; font-size: 16px; border: 1px solid var(--bdc); border-radius: 3px;} .pagenav__pages span:not(.nav_ext), .pagenav__pages a:hover, .pagenav__btn-zag a:hover {background: var(--accent); color: #fff; border-color: var(--accent);} /* INNER PAGE ----------------------------------------------- */ .page__subcols {margin: 0 var(--indent-negative); padding: 20px var(--indent); border-top: 1px solid var(--bdc); box-shadow: inset 0 1px var(--bdc-lighter); position: relative;} .page__header {width: 100%; margin-bottom: 20px; padding-right: 150px;} .page__col-side {width: 300px; margin-left: 40px;} .page__subcol-side {width: 200px; margin-right: 20px;} .page__subcol-side2 {width: 300px; margin-left: 40px;} .page__subtitle {font-size: 17px; font-weight: 700; margin-bottom: 20px; color: var(--tt-lighter);} .page__subtitle.tac {text-align: center;} .stranita__text {margin-bottom: 20px; padding: 18px; border-radius: 8px; border: 1px solid var(--bdc); box-shadow: inset 0 0 0 1px var(--bdc-lighter); background-color: #222;} .pmovie__original-title {color: var(--tt); text-transform: uppercase; font-size: 12px; margin-top: 2px; font-weight: 600; letter-spacing: 1px;} .page__header h1 {font-size: 17px; font-weight: 700; color: var(--tt-lighter); margin-top: -5px;} .page__header h1 a {margin-left: 10px; font-size: 14px; font-weight: 400;} .pmovie__poster {width: 200px; height: 300px; box-shadow: var(--bsh-2); border-radius: 4px;} .pmovie__btn {position: absolute; bottom: 10px; left: 10px; right: 10px; padding: 0;} .pmovie__btn:not(:hover) {opacity: 0.8;} .pmovie__year {margin-bottom: 15px;} .pmovie__header-list {line-height: 1.5; font-size: 13px;} .pmovie__header-list li + li {margin-top: 0px;} .pmovie__header-list li > div:first-child {color: var(--tt); font-size: 13px; margin-bottom: 3px; color: var(--tt-darker-2);} .pmovie__header-list li a, .pmovie__year a {text-decoration: underline;} .pmovie__header-list--accent > span:first-child {color: var(--accent-2); font-weight: 600; margin-right: 5px;} .pmovie__header-list--accent > span:first-child + span {display: inline-block; vertical-align: middle; box-shadow: inset 0 0 0 1px var(--bdc-lighter); border-radius: 3px; padding: 3px 8px; letter-spacing: 1px; background-color: var(--accent-3); color: #000; border: 1px solid var(--bdc); font-size: 12px; text-transform: uppercase;} .pmovie__bottom {/*margin-right: -340px;*/ margin-left: -20px; margin-top: 20px;} .pmovie__player {margin: 0 var(--indent-negative);} .pmovie__player-controls + .d-none:not([style]) {display: block;} .pmovie__complaint2 a {color: #eb4d4b; border-bottom: 1px dotted #eb4d4b; font-size: 12px; text-transform: uppercase; font-weight: 600; letter-spacing: 1px; margin-right: var(--indent);} .tabs-block__select span {cursor: pointer; display: inline-block;} .tabs-block__select span {height: 40px; line-height: 40px; padding: 0 16px; background-color: var(--bg-darker); color: var(--tt-darker-2); font-weight: 600; box-shadow: inset 0 0 0 1px var(--bdc-lighter); border: 1px solid var(--bdc); border-bottom: 0;} .tabs-block__select span.is-active, .tabs-block__select span:hover {background: var(--accent); color: #fff;} .pmovie__player-bottom {background-color: var(--bg-darker); border: 1px solid var(--bdc); border-left: 0; border-right: 0; box-shadow: 0 1px var(--bdc-lighter), inset 0 1px var(--bdc-lighter); padding: 10px var(--indent);} .pmovie__rating-likes > * {display: flex; align-items: center; height: 40px; border-radius: 20px; background-color: var(--bg); box-shadow: var(--bsh-2); padding: 5px; font-weight: 600; margin-right: 10px; padding-right: 20px;} .pmovie__rating-likes > * .fas {background-color: #6ab04c; color: #fff; height: 30px; line-height: 30px; width: 30px; border-radius: 50%; text-align: center; font-size: 16px; margin-right: 10px;} .pmovie__rating-likes > * + * .fas {background-color: #eb4d4b;} .pmovie__rating-likes > a:hover {background-color: var(--accent); color: #fff;} .pmovie__player-bottom .kart__rating-tx {margin-right: 10px; margin-left: 0;} .pmovie__share {text-align: right; margin-right: 20px;} .pmovie__caption {line-height: 1.6; position: relative; background-color: var(--bg-lighter); color: var(--tt); padding: 15px var(--indent); margin: 0 var(--indent-negative); padding-left: 90px;} .pmovie__caption::before {content: '\f05a'; font-family: 'Font Awesome 5 Pro'; font-weight: 900; position: absolute; left: var(--indent); top: 50%; font-size: 34px; color: var(--accent); transform: translateY(-50%);} .soc-channels__item {display: flex; flex-direction: column; justify-content: center; position: relative; padding: 0 20px 0 55px; height: 40px; overflow: hidden; background-color: #2daae1; color: #fff !important; font-size: 10px; text-transform: uppercase; letter-spacing: 1px; font-weight: 400; border-radius: 4px;} .soc-channels__item div {font-size: 14px; text-transform: none; font-weight: 600; margin-top: -1px;} .vk {background-color: #1877f2; color: #fff;} .yt {background-color: #df1111; color: #fff;} .soc-channels__item + .soc-channels__item {margin-top: 10px;} .soc-channels__item::before {content: ''; width: 40px; height: 40px; background-color: rgba(0,0,0,0.2); position: absolute; left: 0; top: 0; background-position: center center; background-size: 20px; background-repeat: no-repeat;} .tlg::before {background-image: url(../images/i-tlg.svg); background-size: 16px;} .vk::before {background-image: url(../images/i-vk.svg);} .yt::before {background-image: url(../images/i-youtube.svg);} .page__tags {margin: 20px 0; margin-right: -16px; font-size: 0;} .page__tags .fas {height: 30px; line-height: 30px; margin: 10px 10px 0 0; font-size: 16px; opacity: 0.6;} .page__tags a {display: flex; align-items: center; white-space: nowrap; height: 30px; border-radius: 2px; padding: 0 10px; font-size: 11px; text-transform: uppercase; margin: 10px 10px 0 0; color: var(--tt); border: 1px solid var(--bdc); box-shadow: inset 0 0 0 1px var(--bdc-lighter);} .page__tags a:hover {background-color: var(--accent); border-color: var(--accent); color: #fff;} .gkino-pohog {border: 1px solid var(--bdc); border-left: 0; border-right: 0; margin: 0 var(--indent-negative); box-shadow: 0 1px var(--bdc-lighter), inset 0 1px var(--bdc-lighter); padding: 30px var(--indent);} .pmovie__stars {font-size: 12px; color: var(--tt); gap: 3px; margin-right: var(--indent);} .pmovie__stars-rating {margin-right: 5px; position: relative; top: -2px;} /* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK ----------------------------------------------- */ .pol-tekst {line-height: 1.5; font-size: 13px; word-wrap: break-word;} .pol-tekst a {text-decoration: underline; color: #a1b676;} .pol-tekst img:not(.emoji), .pol-tekst p, .pol-tekst h1, .pol-tekst h2, .pol-tekst h3, .pol-tekst h4, .pol-tekst h5, .pol-tekst > ul, .pol-tekst > ol, .pol-tekst table, .page__title {margin-bottom: 20px;} .pol-tekst > img[style*="left"], .pol-tekst > .highslide img[style*="left"] {margin:0 10px 10px 0;} .pol-tekst > img[style*="right"], .pol-tekst > .highslide img[style*="right"] {margin:0 0 10px 10px;} .pol-tekst > ul li, .pol-tekst > ol li {padding-left: 60px; position: relative;} .pol-tekst > ul li:before {content: ''; width: 8px; height: 8px; border-radius: 50%; border: 3px solid var(--accent); position: absolute; top: 5px; left: 34px;} .pol-tekst > ol {counter-reset: num;} .pol-tekst > ol li:before {content: counter(num); counter-increment: num; background-color: var(--accent); color: #fff; position: absolute; top: -2px; left: 17px; width: 24px; height: 30px; font-size: 14px; font-weight: 600; display: flex; justify-content: flex-end; align-items: center; padding-right: 6px; box-sizing: border-box;} .pol-tekst > ol li:after {content: ''; border: 10px solid transparent; border-left-color: var(--accent); position: absolute; left: 41px; top: -2px; transform: scale(0.66,1.5); transform-origin: 0 0;} .pol-tekst > ul li + li, .pol-tekst > ol li + li {margin-top: 10px;} .pol-tekst table, .video-inside > * {width:100%;} .pol-tekst table tr td {padding:10px; border:2px solid #fff;} .pol-tekst table tr:nth-child(2n+1) {background-color:#f2f6f9;} .pol-tekst table tr:nth-child(1) {background-color:#cee0ed;} .pol-tekst table img:not(.emoji) {margin:0; max-width:350px} .pol-tekst > *:last-child {margin-bottom: 0;} .video-responsive {padding-top: 60%; position: relative;} .video-responsive > iframe, .video-responsive > video {position: absolute; left: 0; top: 0; width: 100%; height: 100%;} .pol-tekst h1, .pol-tekst h2, .pol-tekst h3, .pol-tekst h4, .pol-tekst h5 {font-size: 21px;} .pol-tekst iframe {width: 100%; height: 400px; margin-bottom: 20px;} /* COMMENTS ----------------------------------------------- */ .stranica__comment {margin: 0;} .stranica__comment-nazv {font-size: 18px; font-weight: 700; color: var(--tt-lighter); margin-bottom: 20px;} .stranica__comment-info {font-size: 14px; margin-bottom: 15px; margin-top: -15px; color: var(--tt-darker-2); line-height: 1.5;} .stranica__comment-info .fas {color: #eb4d4b; margin-right: 6px;} .page__comments-header {position: relative; padding-right: 130px;} .page__comments-btn {position: absolute; right: 0; top: 0;} .page__comments-list {padding: 0;} .page__comments-list--not-comments {padding: 0; border: 0;} .add-comments-form.form {padding: 0; margin-bottom: 20px;} .add-comments-form .form__input, .add-comments-form__input, .add-comments-form .form__textarea-inside textarea, .mass_comments_action select {border-radius: 0;} .add-comments-form__input {margin-left: 20px;} .add-comments-form .d-none123, .comments_subscribe + br {display: none;} .mass_comments_action {display: flex; align-items: center; max-width: 800px; white-space: nowrap; margin-bottom: 20px;} .mass_comments_action select {flex: 1 1 0; margin: 0 -8px 0 20px;} .mass_comments_action .bbcodes {border-radius: 0; padding: 0 10px;} .comment-item__title {font-weight: 600; font-size: 18px; margin-bottom: 20px;} .comment-item {margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid var(--bdc); box-shadow: 0 1px var(--bdc-lighter);} .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: 600; position: absolute; left: 0; top: 0; z-index: 5; color: #fff; font-size: 18px;} .comment-item__author, .comment-item__author a {font-weight: 600; font-size: 14px; color: var(--tt);} .comment-item__date {color: var(--tt-darker-2); margin-top: 4px; font-size: 12px;} .comment-item__main {margin: 8px 0 6px 0; font-size: 15px;} .comment-item__rating {white-space: nowrap; font-size: 14px;} .comment-item__rating a {margin-left: 6px; color: var(--tt);} .comment-item__rating a > span:hover:first-child {color: #6ab04c !important;} .comment-item__rating a:last-child > span:hover:first-child {color: #eb4d4b !important; } .comment-item__reply a {font-size: 12px; margin-right: 20px; color: var(--tt-darker-2);} .comment-item__reply a .fas {margin-left: 5px;} .comment-item__reply + .comment-item__reply a .fas {margin-left: 0; margin-right: 5px;} .comment-item__controls {text-align: right; font-size: 12px; margin-right: -15px;} .comment-item__controls li {display: inline-block; vertical-align: middle; margin: 0 0 0 10px; height: 16px; line-height: 16px;} .comment-item__controls a:not(:hover) {color: var(--tt-darker-2);} .comment-item__footer a:hover {text-decoration: underline;} .comment-item__rating a:hover > span:first-child {text-decoration: none;} .comment-item__controls .checkbox {transform: scale(0.8,0.8); margin-left: 5px;} /* LOGIN ----------------------------------------------- */ .login {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); overflow: hidden; background-color: var(--ui-bg); 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: var(--ui-bg-darker);} .login__title {font-size: 18px; font-weight: 600; padding: 1px 0; text-transform: capitalize; color: var(--tt-lighter);} .login__close {cursor: pointer; font-size: 24px; opacity: 1; margin-left: 20px;} .login__title a {border-bottom: 1px dotted var(--tt); margin-left: 10px; font-weight: 400; color: var(--tt);} .login__content {padding: 20px 40px;} .login__row {margin-bottom: 20px; position: relative; display: block; font-size: 14px; color: var(--tt);} .login__caption {font-size: 14px; color: var(--tt-lighter); margin-bottom: 10px;} .login__caption a {text-decoration: underline; margin-left: 6px; color: var(--accent-3);} .login__input input {padding-left: 40px;} .login__row .fas {opacity: 0.6; position: absolute; left: 0; bottom: 0; line-height: 40px; width: 40px; text-align: center;} .login__row button {width: 100%;} .login__social {background-color: var(--ui-bg-darker); padding: 20px 40px; text-align: center;} .login__social-caption {font-size: 11px; 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: var(--ui-bg-darker); box-shadow: inset 0 0 10px rgba(0,0,0,0.1); font-size: 13px;} .login__menu .fas {display: block; height: 30px; font-size: 24px; opacity: 0.3;} .knopki__menu li {flex: 1 1 0; min-width: auto; max-width: 100%; margin: 0 5px 10px 5px;} .knopki__menu a {display: block; border-radius: 6px; padding: 10px; text-align: center; white-space: nowrap; background-color: #3c3c3c; box-shadow: inset 0 0 10px rgba(0,0,0,0.1); font-size: 13px;} .knopki__menu .fas {display: block; height: 16px; font-size: 15px; opacity: 0.3;} /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ .owl-carousel {width: 100%; position: relative; z-index: 1;} .owl-carousel .owl-stage {position: relative; display:flex; justify-content:flex-start;} .owl-carousel .owl-stage-outer {position: relative; overflow: hidden; transform: translate3d(0px, 0px, 0px);} .owl-carousel .owl-item {position: relative; min-height: 10px;} .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled, .owl-carousel.owl-refresh .owl-item {display: none;} .owl-carousel.owl-loaded, .owl-carousel.owl-loading, .no-js .owl-carousel {display: block; opacity: 1;} .owl-carousel.owl-drag .owl-item {user-select: none;} .owl-carousel.owl-grab {cursor: move; cursor: grab;} .owl-carousel .animated {animation-duration: 1000ms; animation-fill-mode: both;} .owl-carousel .owl-animated-in {z-index: 0;} .owl-carousel .owl-animated-out {z-index: 1;} .owl-carousel .fadeOut {animation-name: fadeOut;} @keyframes fadeOut { 0% {opacity: 1;} 100% {opacity: 0;} } .owl-height {transition: height 600ms ease-in-out;} .owl-carousel .owl-item .owl-lazy {opacity: 0; transition: opacity 400ms ease;} .owl-carousel .owl-item img.owl-lazy {transform-style: preserve-3d;} .owl-nav {position: absolute; left: 0; top: 50%;} .owl-prev, .owl-next {display: flex; cursor: pointer; box-shadow: var(--bsh-2); width: 40px; height: 40px; background-color: var(--bg); color: var(--tt); position: absolute; left: -60px; top: 0; font-size: 14px; border-radius: 3px 0 0 3px;} .owl-prev {margin-bottom: -40px;} .owl-next {background-color: var(--accent); color: #fff; margin-top: -40px;} .owl-prev:hover, .owl-next:hover {background-color: var(--accent); color: #fff;} .owl-dots {text-align: center; position: absolute; left: 0; right: 0; bottom: -25px;} .owl-dot {display: inline-block; width: 10px; height: 10px; border-radius: 50%; cursor: pointer; background: var(--bg); margin: 0 5px;} .owl-dot.active, .owl-dot:hover {background: var(--accent);} /* ADAPTIVE, MOBILE MENU ----------------------------------------------- */ .overlay {position: fixed; z-index: 998; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.6; background-color: #000; cursor: pointer; display: none;} .mobile-menu {width: 340px; height: 100%; overflow-x: hidden; overflow-y: auto; padding: 20px 20px; z-index: 999; position: fixed; left: -380px; top: 0; transition: left .4s; background-color: var(--bg-lightest); color: var(--tt);} .mobile-menu.is-active {left: 0;} .mobile-menu-close {cursor: pointer; display: block; left: 340px; top: -40px; position: fixed; z-index: 999; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 18px; 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 .header__menu {margin: 0; padding: 10px 20px; display: block; background: var(--bg-3); width: calc(100% + 40px); margin: -10px -20px 25px -20px; max-width: none;} .mobile-menu .header__menu > li {width: 100%; margin: 0; padding: 0;} .mobile-menu .header__menu > li > a {height: 40px;} @media screen and (max-width: 1220px) { body {background-image: none;} .layout-container {overflow: hidden; background-size: 140% auto;} .wrapper-conbox {max-width:1000px;} .header__menu, .header__sulk, .secondary-col .js-this-in-mobile-menu {display: none;} .page-header {margin-bottom: 100px;} .ksite-search {margin: 0; margin-right: 20px; width: 240px;} .header__logo {margin: 0 var(--indent);} .header__btn-menu {display: flex; width: 30px; padding: 0; border-radius: 50%; font-size: 18px; margin: 0 var(--indent);} .columns-m, .carou {border-left: 0; border-right: 0;} .carou {padding-bottom: 30px;} .caro__menushka li {flex-grow: 1; white-space: nowrap; min-width: auto; max-width: 100%;padding: 0 2px 2px 2px;} .carou__content > .top {width: calc((100% - 50px)/6);} .secondary-col {width: 100%; order: 10; padding-top: 0;} .site-opis, .kino-footer {padding-left: var(--indent); padding-right: var(--indent);} .kino-footer {justify-content: center; text-align: center;} .footer__nadpis {min-width: 100%; margin: 20px 0;} #scrolltop {width: 40px; height: 40px; line-height: 40px; font-size: 18px;} } @media screen and (max-width: 950px) { .wrapper-conbox {max-width:768px;} .carou__content > .top {width: calc((100% - 40px)/5);} .theme-toggle {order: 10; margin: 0; margin-right: 20px;} .ksite-search {order: 10; width: calc(100% - 130px); margin: 0 10px 0 20px;} .page-header {padding-bottom: 10px;} .header__btn-menu {margin-left: 10px;} .speedbar {margin: -15px 0 15px 0;} .page__subcol-side2, .page__col-side {width: 100%; margin: 0; margin-top: 20px;} .pmovie__header-list li + li {margin-top: 0px;} .pmovie__caption {padding-left: 76px;} } @media screen and (max-width: 760px) { .wrapper-conbox {max-width:640px;} .carou__content > .top {width: calc((100% - 40px)/3);} .sect__btn-filter {font-size: 0; margin-left: 10px;} .sect__btn-filter::before {content: attr(data-text); font-size: 12px; margin-right: -20px;} .kart__meta, .card__btn1 {display: none;} .kart {display: grid; grid-gap: 20px 20px; grid-template-columns: 150px minmax(0,1fr);} .kart > .kart__nazv {grid-column: 1 / -1;} .kart__kartinka {width: 150px; height: 220px;} .card__desc {order: 10; grid-column: 1 / -1;} .kart__niz, .kart__nazv, .kart__rating-tx {margin: 0;} .kart .kart__rating-tx {width: 100%; margin-bottom: 20px;} .kart__knop {width: 100%; margin: 0; order: 10;} .kart__spisok--margin {margin: 0;} .card__desc .kart__nazv {margin-bottom: 15px; padding: 0;} .kart__nazv {/*padding: 0; */padding-right: 140px;} .kart .pmovie__stars-score, .kart .pmovie__stars-votes {display: none;} .kart .pmovie__stars-rating {margin: 0;} .page__header {padding: 0;} .pmovie__bottom {margin: 0; margin-top: 20px;} .pmovie__bottom .card__ratings {gap: 20px 14px;} .pmovie__bottom .kart__rating-tx {margin: 0;} .stranita__text {border-radius: 0; margin-left: -20px; margin-right: -20px;} .pmovie__share {order: 10; text-align: center; min-width: 100%; margin: 0; margin-top: 10px;} .pmovie__share {min-height: 24px;} .gkino-pohog .poster:nth-child(5n), .stranica__comment-info {display: none;} .stranita__text .quote {margin-left: var(--indent-negative); margin-right: var(--indent-negative); padding-right: var(--indent);} .pol-tekst h1, .pol-tekst h2, .pol-tekst h3, .pol-tekst h4, .pol-tekst h5 {font-size: 18px;} .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, .comment-item__rating-caption {display: none;} } @media screen and (max-width: 590px) { .wrapper-conbox {max-width:480px;} .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;} .carou__content > .top {width: calc((100% - 40px)/3);} .page-header {margin-bottom: 0; box-shadow: none;} .page-header .header__button {font-size: 0; padding: 0; width: 40px; padding-left: 5px;} .page-header .header__button::before {content: "\f007"; font-weight: 900; font-family: 'Font Awesome 5 Pro'; font-size: 18px;} .pagenav__btn-zag a, .pagenav__btn-zag > span {max-width: 100%;} .kino-footer .btn {width: 100%; margin: 0; margin-top: 20px;} .caro__menushka a {padding: 10px; font-size: 13px; border-right: 0;} .layout-container {background-image: none;} .page__header {text-align: center;} .page__subcols {display: block; position: relative;} .page__subcol-side {margin: 0 auto; margin-bottom: 20px;} .page__subcol-main {display: block; grid-gap: 0px 20px; grid-template-columns: minmax(0,1fr) 150px;} .pmovie__bottom {grid-row: 1 / 3; grid-column: 2 / 3; margin: 0; align-self: start;} .pmovie__complaint2, .pmovie__player-bottom .kart__rating-tx, .pmovie__player .pmovie__stars {display: none;} .pmovie__subinfo {width: 100%; padding-top: 5px;} .pmovie__subinfo::before {content: ""; display: table; clear: both; width: 100%;} .tabs-block__select span {flex: 1 1 0; min-width: auto; max-width: 100%; white-space: nowrap; text-align: center;} .gkino-pohog .poster:nth-child(5n) {display: block;} } @media screen and (max-width: 470px) { .wrapper-container22 {max-width:360px;} .carou__content > .top {width: calc((100% - 20px)/3); margin-right: 10px;} .top__opis {padding: 10px; font-size: 13px;} .header__logo {flex: 1 1 0; min-width: 100px; max-width: 100%;} .header__logo > * {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .header__logo .brand__title {font-size: 18px;} .header__login {display: none;} .sect__nazv {font-size: 20px;} .site-opis img {float: none; margin: 0 auto; margin-bottom: 20px; display: block; display: none;} .mobile-menu {width: 100%; left: -120vw;} .mobile-menu-close {left: calc(100% - 40px);} .pmovie__year {grid-column: 1 / -1;} .pmovie__bottom {grid-row: 2 / 3;} .gkino-pohog .poster:nth-child(5n) {display: none;} .pmovie__player-bottom {padding-left: 10px; padding-right: 10px;} } @media screen and (max-width: 370px) { .kart {grid-gap: 20px 10px;} } .filter-block {margin-bottom: 30px;} .filter-block__form {display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); grid-gap: 10px 10px;} .filter-block__cell--full-width {grid-column: 1 / -1;} .filter-block__cell-caption {margin-bottom: 10px;} .filter-block__cell-content > * {width: 100%; display: block;} .filter-block__cell-content--two-columns {display: flex; justify-content: space-between;} .filter-block__cell-content--two-columns > * {width: calc((100% - 10px)/2) !important;} .filter-block__cell-content select, .filter-block__cell-content input[type="text"], .filter-block__cell-content--check-group {height: 36px; line-height: 34px; background-position: right 8px top 50%; background-color: var(--bg-darker); color: var(--tt); border: 1px solid var(--bg-black); border-radius: 4px; box-shadow: none; font-size: 14px; padding: 0 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .filter-block__cell-content select {padding: 0 8px 0 4px;} .filter-block__cell-content input[type="text"]::placeholder {opacity: 1; color: var(--tt); font-size: 14px;} .filter-block__cell-content input[type="text"]:focus::placeholder {opacity: 0;} .filter-block__cell-content label {position: relative; padding-left: 50px; cursor: pointer; height: 36px; display: flex; flex-direction: column; justify-content: center; font-size: 14px;} .filter-block__cell-content label input {display: inline-block; appearance: none; -webkit-appearance: none; height: 20px; width: 40px; border-radius: 10px; background-color: var(--bg-darker); cursor: pointer; transition: all .2s linear; box-shadow: inset 0 2px 5px rgba(0,0,0,0.1); position: absolute; left: 0; top: 50%; margin-top: -10px;} .filter-block__cell-content label input::before {content: ''; width: 18px; height: 18px; border-radius: 10px; position: absolute; left: 1px; top: 1px; background-color: var(--bg); transition: all .2s linear;} .filter-block__cell-content label input:checked {background-color: #6ab04c;} .filter-block__cell-content label input:checked::before {left: 21px;} .filter-block__cell-content input[type="button"], .filter-block__cell-content button {cursor: pointer; height: 36px; display: inline-flex; justify-content: center; padding: 0 10px; box-shadow: none; border-radius: 4px;} .filter-block__cell-content input[type="button"][data-dlefilter="reset"] {background: var(--bg-darker); color: var(--tt);} .filter-block__cell-content--check-group label {padding: 0; text-align: center; white-space: nowrap; flex: 1 1 0; min-width: 30px; max-width: 100%; background: var(--bg);} .filter-block__cell-content--check-group label input {position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; z-index: 5;} .filter-block__cell-content--check-group {display: flex; justify-content: center; overflow: hidden; padding: 0;} .filter-block__cell-content--check-group label + label {border-left: 1px solid var(--bg-darker);} .filter-block__cell-content--check-group label div {height: 36px; font-size: 13px;} .filter-block__cell-content--check-group label input:checked + div {background-color: var(--bg-darker); color: var(--tt);} .kino-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-bottom: 20px; margin: 0 auto; } .kino-buttons li { list-style: none; } .kino-buttons a { display: flex; align-items: center; gap: 14px; padding: 9px 14px; background: rgba(0, 0, 0, 0.3); border-radius: 8px; text-decoration: none; color: /*#f0eac6*/#aeaeaa; font-size: 15px; font-weight: 500; box-shadow: 0 0px 3px rgba(0, 0, 0, 0.4); transition: all 0.2s ease-in-out; } .kino-buttons a i { font-size: 22px; color: /*#f0eac6*/#aeaeaa; min-width: 24px; text-align: center; } .kino-buttons a span { display: inline-block; line-height: 1.2; } .kino-buttons a:hover { background: rgba(255, 255, 255, 0.05); box-shadow: 0 0 3px /*#ffdf91*/#c5bdaa; transform: translateY(-2px); } .xsort-area { /*padding: 15px 10px 0 20px;*/ font: normal 12px/32px Arial; -ms-user-select: none; user-select: none; -webkit-user-select: none; -moz-user-select: none } .xsort-area:after { content: ""; display: table; clear: both } .xsort-area>div { float: left; margin: 0 4px 10px 0; color: #eaeaea } .xsort-div { height: 30px; line-height: 30px; padding: 0 10px; border-radius: 8px; background: #1b1b1b; position: relative; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; border: 1px solid #464646; color: #fff } .xsort-active { box-shadow: 0 0 0 2px #dd4b39 } .xsort-selected { cursor: pointer; padding-right: 15px; position: relative; color: #cfcfcf } .xsort-selected span { color: #cfcfcf } .xsort-selected:after { position: absolute; top: 50%; margin-top: -2px; right: 0; border: 4px solid transparent; border-top-color: #7a7a75; content: "" } .xsort-div-filler { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAQAAAC1+jfqAAAAvklEQVR42o3KsUqCYRiA0RPVZg6Fg2NgU0ME7g0KTg0SLtHaFYQ0VjRFDUGjEAhBi1vQ1Fx2BVJ4Aa4FQWT6tn38llTnWR//t+7MjY6mgh9mXYjUi4ZvzoVnDUXL9r35VJWxaqxvEcCGkSczkmNhR1ZHKEuuhZKsPWFbcimsyToS6pJd4YRkTs9IUZIzMLQFmNcSbk2oeBfuHDrVF8KHugllj0IIQ23daQsrNtUsIe9BWqbLuxde/WLBlQN/+wLDfD9iwnIihwAAAABJRU5ErkJggg==); background-position: 50% 50%; width: 32px; padding: 0; background-repeat: no-repeat; cursor: pointer } .xsort-ul { display: none; background: #404040; position: absolute; top: 100%; left: 0; margin: 1px 0 0; padding: 0; max-height: 400px; overflow: auto; list-style: none; z-index: 999; border-radius: 3px; box-sizing: content-box } .xsort-ul li { display: block; border-bottom: 1px solid #383838; padding: 0 35px 0 18px; line-height: 30px; white-space: nowrap; cursor: pointer; color: #a8a8a8 } .xsort-ul li:last-child { border: none } .xsort-ul li.current { color: #dadada; font-weight: 700; background: #202020; position: relative } .xsort-ul li.current:after { position: absolute; top: 0; right: 5px; bottom: 0; width: 5px; content: ""; display: block; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAQAAAAnZu5uAAAAJUlEQVQY01XIMQEAIAwDsDivroGe6Sg3OQNxBGLVCldVzbfECA+g/g9v8ooTNAAAAABJRU5ErkJggg==) no-repeat 50% 50% } .xsort-ul li:hover { background: #a8a8a8 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAeCAIAAABi9+OQAAAAHElEQVQImWP4+vUrEwMDA9P///+ZGBgY4JjGfAByHhgFbrteLwAAAABJRU5ErkJggg==) repeat-x 0 0; color: #111 } .xsort-ul li.xdesc,.xsort-ul li.xasc { background-position: 6px 50%; background-repeat: no-repeat } .xsort-ul li.xdesc,.xdesc { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAICAQAAACfDS2NAAAAIElEQVQY02NgYGBgSPsPggwwQDQXwoRBFAHsekECEBoASUcnDSh9+RUAAAAASUVORK5CYII=) } .xsort-ul li.xasc,.xasc { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAICAQAAACfDS2NAAAAHklEQVQYV2NgAIO0/xAaygFBFA5UAMGBq0BRTDwXAPWMJw0b8PLnAAAAAElFTkSuQmCC) } span.xasc,span.xdesc { padding-left: 10px; background-position: 0 50%; background-repeat: no-repeat } .xsort_empty { margin-top: 15px; background: #fff; border: 1px solid #ccc; padding: 15px; text-align: center; color: #2b2b2b; border-radius: 3px; box-shadow: 0 2px 7px rgba(0,0,0,.1) } .xsort-admin-area { padding: 0 0 0 210px } .xsort-admin-area:after { content: ""; display: block; clear: both } .xsort-admin-area ul { list-style: none; margin: 0 0 0 -210px; padding: 0; float: left; width: 200px; border-right: 1px solid #ddd } .xsort-admin-area ul.loading { background: url(data:image/GIF;base64,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) no-repeat 50% 50% } .xsort-admin-area ul li { display: block; color: silver; cursor: pointer; padding: 1px 0 } .xsort-admin-area ul li.current,.xsort-admin-area ul li:hover { color: #000 } .xsort-admin-area ul li.current { font-weight: 700 } .xsort-admin-area p { margin: 0; padding: 7px 0 0 } .xsort-admin-area code { max-height: 400px; overflow: auto } .xsort-div-clearall { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAQAAACR313BAAAAKklEQVQoz2NgGATA4L/Bf3QWmrTBfwSNQwEOSWQT8EjiNRqnCQRcPgAAAG+mJxC7ICdhAAAAAElFTkSuQmCC); background-position: 50% 50%; width: 32px; padding: 0; background-repeat: no-repeat; cursor: pointer } .x-sort { border-bottom: 1px solid #111; border-left: 1px solid #404040 } /* Act ----------------------------------------------- */ .cNCPuc { width: 100%; padding: 0px 0px 0px; /* min-height: 12em; height: 12em;*/ margin-bottom: 1em; } .align-start { -webkit-box-align: start; align-items: flex-start; } .flex { display: flex; flex-wrap: wrap; gap: 0px; } .cNCPuc .title { width: 100%; text-align: left; font-size: 0.9rem; margin-left: 10px; } h1, h2, h3, h4, h5, h6, p { margin: 0px; padding: 0px; } .cNCPuc .slider.horizontal { overflow: auto hidden; } .cNCPuc .slider { height: 100%; overflow: hidden auto; } .cNCPuc .slider.horizontal .cardis { margin-left: 0.5em; margin-top: 0.6em; } .cNCPuc .slider .cardis { flex: 0 1 auto; margin: 0.2em; } .scale.focus-active { transition: transform 0.2s linear 0s; } .iuNgcv { width: 5em; min-width: 5em; margin: 0px 10px; white-space: initial; max-width: 100%; height: auto; } .iuNgcv.focus-active img { border: 0.3em solid rgb(140, 140, 140); } .iuNgcv img { border: 0.3em solid transparent; border-radius: 25%; width: 5em; height: 5em; object-fit: cover; } .iuNgcv p, .iuNgcv h4 { text-align: center; overflow: hidden; } h4 { font-size: 1.4rem; color: rgb(193, 41, 46); font-weight: 400; } p { font-size: 1em; font-weight: 400; } h1, h2, h3, h4, h5, h6, p { color: #c9c9c9; } .iuNgcv:hover img { border: 0.3em solid rgb(87, 87, 87); transform: scale(1.1); } @media screen and (max-width: 590px) { .cNCPuc .slider.horizontal .cardis { margin-left: 1.2em; } .flex { flex-wrap: nowrap; } } @media screen and (max-width: 1220px) { .cNCPuc .slider.horizontal .cardis { margin-left: 3.3em; } } @media screen and (max-width: 950px) { .cNCPuc .slider.horizontal .cardis { margin-left: 1.4em; } } @media screen and (max-width: 760px) { .cNCPuc .slider.horizontal .cardis { margin-left: 0.5em; } .flex { flex-wrap: nowrap; } } /**parts*/ #parts .primary-col { padding: 20px 0px !important; } #parts .speedbar { padding: 0px 20px 0px 20px !important; margin: 0px !important; } .parts-search { padding: 20px 20px 0px 20px; } .parts-link-title { display: flex; justify-content: space-between; align-items: center; } .parts-link-btn { font-size: 12px; font-weight: normal; } .parts-title { display: flex; justify-content: space-between; padding-left: 20px; padding-right: 20px; margin-top: 20px; } .parts-title-count { padding: 3px 10px; border-radius: 4px; color: #000; background: var(--accent-2); font-size: 14px; } .parts-list { margin-top: 20px; } .franchise-item { display:flex; gap: 20px; padding:15px 20px 15px 20px; border-top:1px solid #404040; border-bottom:1px solid #111; font:normal 13px Tahoma; text-decoration:none; } .franchise--warning { background:#242424 } .franchise--warning:before { content:''; position:absolute; top:0; left:0; bottom:0; width:0; border:4px solid transparent; border-left-color:#dd4b39 } a.franchise:nth-child(2n) { background:rgba(255,255,255,0.03) } a.franchise:hover { background:rgba(0,0,0,0.1) } .franchise+.bot-navigation { border-top:0 } .bot-navigation a { color:#a8a8a8 !important } .franchise__title { font-size:15px; line-height:18px; font-weight:bold; margin-bottom:10px; text-shadow:1px 1px #111; color:#e0dfdc; } .franchise__left { } .franchise__right { width: 100%; display: flex; flex-direction: column; justify-content: space-between; min-height: 120px; } .franchise__btn { display: block; padding: 7px 20px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--bdc-lighter); border: 1px solid var(--bdc); border-bottom: 0; background-color: var(--accent); color: #fff; } a.franchise:hover .franchise__title { color:inherit } .franchise__image { width:180px; height:120px; border: 3px solid #746464; border-radius: 8px; transition:.3s; background-position: 50%; background-size: cover; } a.franchise:hover .franchise__image { filter:grayscale(0.3) brightness(0.7) } .franchise__descr { line-height:18px; } .franchise__info { display:flex; margin-top:12px; justify-content: space-between; } .franchise__meta { display:flex; align-items:center; gap:10px; } .franchise__count { padding-left:22px; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAYAAAB24g05AAAAAXNSR0IArs4c6QAAAJ9JREFUKBWlkjsOAjEMRF1ScgSOsB10cANaOui2pNxyj/7QRJNi0USsRJFE8Wc8Y7uqqoAL8ADePguwhiP/DDyBSblKvoXAlJxsVwEIMTkns0m+bpsFEOma3RG4DwoIZBFAR9u8TZ8vQEDSv4nRfxeA2RyS3F0AnlKW+qMHpxF1y2k9GE3hlTR/2doU/tsDN0gzV0Wxid221L6p2tqzcj8sjCbeIImw+AAAAABJRU5ErkJggg==) no-repeat 0 50% } .franchise__views { display: flex; align-items: center; gap: 10px; } .franchise__rating { position:absolute; top:10px; right:15px; width:85px; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAPCAYAAAACsSQRAAAAAXNSR0IArs4c6QAAAThJREFUOBFjYCAAAgIKBAgowS8dEJCh4O+Xdt/HJ8UBv0o8sv7+6fP9/dL++/um7sejDLcU1BX/wYb4pf0P9EuLx60aTQYUBmAD/NPWwwyA0mBv4QyjAN+UAn+/tPP+fqnv0TTCXYIqDlZ33t8/bT3cDVu37k1ISizDoSENp3hRQUs/3BAQ4/Dhk/XEGhQZkfd/7Zqt81EMgHHOn7+UUFbajtNmkJeSk8r/nzhxFtUFMANgNMiJqP5H9U50dCHh6Pb3T0ePFXSX3YdZiJOGxBLEdpDfJ01a8B89rAIcEnBnhYCABAGQV0Ca585Z8f/evQf3X716lf/69ev969fvgBvm65vij9MVIImDB469B2p8/+LFi3xkhe/fv7d/9erVeWAs/p83b5U9shwG+82bN/7379/H6Vxs8gAwUwV6CJNdYAAAAABJRU5ErkJggg==) repeat-x; text-align:center; font-size:9px } .franchise__rating-bar { height:15px; margin-bottom:3px; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAPCAYAAAACsSQRAAAAAXNSR0IArs4c6QAAATNJREFUOBGNU7tOwzAUtfsDMDBX/AQTQztTm3ZCbM3GGCQEK1+AKsTWDv2BikgMrEV0YcvMgtfINrqmP2C4aR3Fae2QxY9z7vE51zEhLR+MyGELJQ7DiBwbTgUw0o8zI+gP78wNo9YwuozQwlDpYiOAInZ9TsZhdgPBHmxjZFsXpYiLFewR8M61GdDccApeYc2Jt4885DOaVR7kyzSBcXdzYqhwzz6kJ5NKBCdqld3/VwguDuz34mHuCbiFzN8TuDmNOoKka9XHq+/ACbgRLXr5GzHg8qj9ug2n/q00RMyACndgcDSs7HoZqcz+eGWbvYJ+5CngP4BRsFjP7qz8+hRSylQptdTPT5XY+owMgy4Q0G8L+CuEoijSOhEAelLKXK8yC9PbXh3bmWuth0KI4Mvdh/8CirodQNpoe2UAAAAASUVORK5CYII=) repeat-x } .franchise--top { padding: 10px 20px; display: flex; gap: 20px; align-items: baseline; } .fr-item { display:flex; align-items:center; position:relative; padding:10px 20px 10px 0; border-left:1px solid #404040; text-decoration:none; font-size:.8125rem; color:#e0dfdc; border-bottom:1px solid #111; box-shadow:0 1px #404040 } .fr-item:nth-child(2n) { background-color:rgba(255,255,255,0.02) } .fr-item:hover { background-color:rgba(0,0,0,0.12) } .fr-item__counter { flex:0 0 48px; font-size:.75rem; text-align:center } .fr-item__imge img { border-radius: 5px; margin-right: 14px; } .fr-item__title { color:inherit } .fr-item__subtitle { color:inherit; font-size:11px; margin-top:1px; opacity:.5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap } .fr-item:hover .fr-item__subtitle { color:#bbb; opacity:1 } .fr-item:hover .fr-item__subtitle b { color:#ddd } .fr-item__meta { flex-shrink:0; margin-left:auto; display:flex; align-items:center; padding-left:15px; font-size:.75rem; color:#ccc; gap:15px } .fr-item__rating { width:30px; padding-left:22px; background:url(../images/star.svg) no-repeat 0 50%; background-size: 58%; } .fr-item__kprate { font-size:.6875rem; line-height:18px; width:28px; text-align:center; background:#222; color:#ccc; border-radius:2px; text-shadow:1px 1px #1115 } .fr-item__kprate--good { background:#070; color:#fff } .fr-item__kprate--bad { background:#400 } .franchise__speedbar { padding:15px 20px; text-align:center; border-left:1px solid #404040 } .sidebar__franchise { background:#333; border-radius:6px; padding:8px 10px; display:flex; align-items:center; text-decoration:none } .sidebar__franchise:hover { background:#222; color:#fff } .sidebar__franchise-image { flex:0 0 60px; width:60px; height:40px; margin-right:10px; border-radius:2px; background-size: cover; background-position: 50%; } .sidebar__franchise+.sidebar__franchise { margin-top:2px } /* parts */ .usort, .xfilter { font-weight: normal; font-size: 13px !important; } .usort button, .xfilter button { text-transform: none !important; justify-content: left; font-size: 13px !important; letter-spacing: 0.3px; font-weight: normal; } .usort__button { flex: 1; position: relative; height: 28px; padding: 0 24px 0 12px; text-align: left; background: #1d1d1d; color: #a8a8a8; outline: 0; border: 2px solid #343434; cursor: pointer; border-radius: 6px; } .usort__button+.usort__button { margin-left: 2px } .usort__button:after { content: ''; border: 4px solid transparent; border-top-color: #888; margin-top: -2px; position: absolute; right: 7px; top: 50% } .usort__button:hover { border-color: #555; background: #191919; color: #ddd; box-shadow: 0 2px 4px rgba(0,0,0,0.25) } .usort__button.is-active { border-color: #2a6eb3 } .usort__button.is-open { background: #2a6eb3; color: #fff; border-color: transparent } .usort__button.is-open:after { border-top-color: #eee } .usort { display: flex; align-items: center; } .usort__info { color: #a8a8a8; margin-left: auto } .usort__info b { color: #d5d5d5 } .usort__resetall { display: none; margin-left: 5px; height: 28px; color: #f90; padding: 0 10px; cursor: pointer; opacity: .7; background: transparent; border: 0 } .usort__resetall:hover { opacity: 1 } .usort__group { display: flex; margin: 0 0 0 8px; position: relative; min-width: 150px } .usort.usort--main .usort__button,.usort.usort--xfsearch .usort__button,.usort__group.is-active .usort__button { border-color: #efd47861; } .usort__group.is-open { z-index: 20 } .usort__group.is-open:before { content: ''; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; background: rgba(0,0,0,0.2) } .usort__options { display: none; position: absolute; top: 100%; margin-top: 3px; left: 0; padding: 5px; background: rgba(45,46,46,0.92); border: 1px solid #585959; border-radius: 6px; z-index: 10; box-shadow: 0 0 0 1px #000,0 5px 20px rgba(0,0,0,0.35); backdrop-filter: blur(10px) } .usort__group.is-open .usort__options { display: block } .usort__options button { display: block; position: relative; width: 100%; height: 22px; background: transparent; border: 0; text-align: left; white-space: nowrap; cursor: pointer; padding: 0 10px 0 20px; border-radius: 4px; color: #eaeaea } .usort__options button:hover { background: #2e5bbd; color: #fff } .usort__options button.is-default:before { content: '∙ ' } .usort__options button.is-active:after { content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 20px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAG4AAABWCAYAAAAucqM7AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAALYSURBVHgB7dzdcdpAFIbhVdIAHYQO4g5CCekg7iDpwKQC0gHpICWQVBB3QC5zZ3fw5RwEGWyE0Er7c1b7PTM7zDCeQdZrMJJ21ThKDsBCHpYyFsennpumeXRkkwRbytjIeMKlvYyt/owjOyTIFwyjAT85yk9CrOFv7SifkdEYL6eJ0Rgvh0DRGC+lwNEYL4VI0RgvpsjRTlaOwkkUTe0chZEw2snqraNJ0P7feXBpPTPcBJmiqb9vHI2SMZpaMNwImaMdMJwnC9HEY+NoMCPR1MrRMBm+8l+zdzQM7ERTHxzdBlvRLHxM2wdGKw8YrTxgtPKA0coDRisPGK08YLTygNHKA0YrDxitPJhBNK/LOminhr2XcXd86o+MX03T/HSFgJ1LM2ot++6ri0V+2Y8yfvf81exRwNIg1PTxKC/wzWNjNO7SGYTKon2Hvz2MxQOjDbZHu845OzCaN/3YzBoPjDZatnhgtMmSxwO/PQaTLB4qi3aP+KLHQ22nsdB+C0whWjxUGC3Fu+1c8Hio8YQx2tsQpRZsVSVqPcsvL7ZDHls3EWq+NIN84dToeKj9epq86A/k5R0PvAh62Akb5Dc4Hhjt/45YwYab8cBoFztkBxu2PdvIaK+hvXPpE2zYdmwfo12D9AfifTZn28VoHV5MFpINu5eHycdXgZwm0dQxscfTxSwvY/GsMBVNdU7PY7wXzEVTV+dVMt6ByWiqd0Js5fHMRlM3ZzJXGs90NDVoCnpl8cxH8wJbx3mxzHPVDOYdb95LnTDPeHWsT8O84tW1qBDziFfnSlCUHa/u5bsoMx7XXCuUFY/RzqGMeIzWBbbjMVof2IzHaEPAVjxG8wEb8RhtDOSNx2hTZIrHaCEkjsdoISWKx2gxRI7HaDFFisdoKQSOx2gpBYrHaDlMjMdoOY2Mx2gWSIg7DLtJjq7h++zIluO7b9cRTJ97gJF7YFIPifROh6NO/wBa1dabjlsLuwAAAABJRU5ErkJggg==) no-repeat 50% 50%; background-size: 10px } .xfilter { padding: 15px 0px; } .xfilter__groups { display: flex; flex-wrap: wrap; position: relative; gap: 2px; } .xfilter__groups.is-active { z-index: 20 } .xfilter__groups.is-active:before { content: ''; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; background: rgba(0,0,0,0.66) } .xfilter-popup { position: absolute; left: 0; right: 0; top: 100%; padding: 1px; margin-top: 4px; background: #1b1b1b; border: 1px solid #404040; border-radius: 2px; box-shadow: 0 0 0 1px #000,0 5px 20px rgba(0,0,0,0.35) } .xfilter-popup__heading { display: flex; align-items: center; padding-bottom: 2px } .xfilter-popup__title { color: #f90; padding: 0 10px; text-transform: uppercase; cursor: default } .xfilter-popup__search { background: transparent; border: 0; flex: 1; min-width: 100px; text-align: right; color: #ccc; padding: 0 10px; height: 33px; outline: 0 } .xfilter-popup__close { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAG9JREFUKFNt0NENgDAIBNC7TdzMbqJuYjdzE8xpIYWUv4YX4EozuwE8JE8sKvpmdgAQuioeaAfQqCErnBDZP1gxgA3AP4ns6gcsWM9AK6hgmqRKN8+rHbWxOgX0MIH8phqQNd38lQmPhz78S1fL+y+RFU+9IO2xDQAAAABJRU5ErkJggg==) no-repeat 50% 50%; width: 33px; height: 32px; border: 0; padding: 0; opacity: .7; cursor: pointer } .xfilter-popup__close:hover { opacity: 1 } .xfilter-popup__content { max-height: 290px; overflow: auto; padding: 10px; display: flex; background: #2b2c2c; flex-wrap: wrap } .xfilter-popup__content button { position: relative; height: 30px; border: 0; flex: 0 0 25%; text-align: left; background: transparent; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; padding: 0 15px 0 30px; border-radius: 3px; color: #eaeaea } .xfilter-popup__content[data-field="year"] button { flex-basis: 20% } .xfilter-popup__content[data-field="c"] button,.xfilter-popup__content[data-field="tr"] button,.xfilter-popup__content[data-field="p"] button { flex-basis: 33.33333% } .xfilter-popup__content[data-field="q"] button { flex-basis: 50% } .xfilter-popup__content button.is-active { background-color: #222 } .xfilter-popup__content button:hover { background: rgb(0 0 0 / 13%); color: #fff } .xfilter-popup__content button.is-active:hover { background-color: #63312c } .xfilter-popup__content button:before { content: ''; position: absolute; top: 50%; left: 10px; height: 10px; width: 10px; margin-top: -5px; border: 1px solid rgba(255,255,255,0.2); border-radius: 2px } .xfilter-popup__content button.is-active:before { display: none } .xfilter-popup__content button.is-active:after { content: ''; position: absolute; top: 0; left: 0; bottom: 0; width: 30px; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAJCAYAAADkZNYtAAAAAXNSR0IArs4c6QAAAFNJREFUKJGNy0sVgCAABEAiEIEINtEoNjCKEYhkBCOMFz/4HoJ73J0NoRMkpJ4LGLBjQ/wD3RgRUwema8hnuTbhOc6e5E9YHBbv1GHl0IbFYWzBAwiFpSpBU28XAAAAAElFTkSuQmCC) no-repeat 50% 50% } .xfilter-popup__content button:disabled { opacity: .5; background-color: transparent } .xfilter-popup__actions { padding: 10px; display: flex; align-items: center; border-top: 1px solid rgba(0,0,0,0.15) } .xfilter-button { background: #444; height: 24px; padding: 0 15px; border: 0; border-radius: 2px; color: #ccc; cursor: pointer } .xfilter-button+.xfilter-button { margin-left: 4px } .xfilter-button:hover { background: #555 } .xfilter-button.xfilter-button--teal { background: #125d53 } .xfilter-button.xfilter-button--teal:hover { background: #006f60 } .xfilter-button.xfilter-button--warn { display: none; background: transparent; color: #bb7203; margin-left: auto; padding: 0 } .xfilter-button.xfilter-button--warn:hover { color: #f90 } .xfilter-button.xfilter-button--toggle { padding-left: 38px; margin-left: 15px; background: transparent; position: relative } .xfilter-button--toggle:hover { background: transparent } .xfilter-button--toggle:before,.xfilter-button--toggle:after { content: ''; position: absolute; top: 50%; transition: .2s } .xfilter-button--toggle:before { left: 0; margin-top: -9px; height: 18px; width: 32px; border-radius: 9px; background: #2b2c2c } .xfilter-button--toggle:after { left: 1px; margin-top: -8px; height: 16px; width: 16px; border-radius: 50%; background: #606060 } .xfilter-button--toggle.is-active:before { background: #2a6eb3 } .xfilter-button--toggle.is-active:after { background: #ddd; left: 15px } .usort__selected { display: none; padding: 8px 0 0; flex-wrap: wrap } .usort__selected.is-active { display: flex } .usort__selected button { background: #222 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAHCAYAAAArkDztAAAAAXNSR0IArs4c6QAAAGJJREFUGFdtjcERgEAIA0mF+uPKsAOxBMvgXlqJHV2cMOdPPjAk2aD3/pC83T3MzDJTe0Fm7gCC5CEBwE4yMF0l6h5jbK218xNCTglKCitUPRWfqMJill/uXh3qNLO1UH/zAvlMOpHyN9ReAAAAAElFTkSuQmCC) no-repeat top 50% right 8px; border-radius: 3px; border: 0; height: 22px; margin: 1px 4px 2px 0; color: #a8a8a8; padding: 0 22px 0 8px; cursor: pointer } .usort__selected button.last { margin-right: 8px } .usort__selected button:hover { background-color: #63312c } .usort__helper { margin-top: 8px } .usort__selected.is-active+.usort__helper { display: none } .usort__scrollable { overflow: auto } .usort__scrollable::-webkit-scrollbar { width: 6px; background: #111 } .usort__scrollable::-webkit-scrollbar-thumb { background-color: #585858 } #tooltip{ display:none; background:#111; color:#ccc; position:absolute; margin:33px 0 0 -15px; max-width:300px; z-index:9999; border-radius:3px; box-shadow:4px 4px 8px rgba(0,0,0,0.3); padding:5px 8px; font-size:13px } #tooltip:before{ content:''; position:absolute; width:0; height:0; border:6px solid transparent; border-bottom-color:#111; bottom:100%; left:15px } #tooltip:after{ content:''; display:block; clear:both } #tooltip b{ color:#eee } #tooltip img{ float:left; width:50px; margin-right:10px }