/* BASIC LAYOUT ----------------------------------------------- */ .wrapper {min-width: 320px; position: relative; overflow: hidden;} .wrapper-container {max-width: var(--max-width); margin: 0 auto; position: relative; z-index: 20;} .wrapper-main {padding: 0 var(--indent);} .header {background-color: var(--bg); box-shadow: var(--bsh); position: relative; z-index: 100;} .header__one {background-color: var(--bg-darker); gap: 20px 20px; padding-top: 10px; padding-bottom: 10px;} .header__two {padding-top: 20px; padding-bottom: 20px; gap: 20px 40px;} .content {min-height: 80vh; padding: 40px 0 80px 0;} .cols {display: grid; gap: 50px; grid-template-columns: 300px minmax(0,1fr); grid-template-areas: "sidebar main";} .cols__main {grid-area: main;} .cols__side {grid-area: sidebar;} .footer {background-color: var(--bg-black); padding-top: 40px; padding-bottom: 20px; box-shadow: var(--bsh);} .footer__one {gap: 20px; --tt: var(--tt-fade-dark);} .footer__two {padding-top: 20px; margin-top: 40px; border-top: 1px solid rgba(255,255,255,0.13); color: var(--tt-fade-dark); font-size: 12px; gap: 20px;} .scrolltop {position: fixed; width: 40px; height: 40px; right: -60px; bottom: 20px; z-index: 990; border-radius: 50%; font-size: 20px; opacity: 0; transition: right 0.2s, opacity 0.2s;} .scrolltop.is-active {right: 20px; opacity: 1;} /* HEADER ----------------------------------------------- */ .header__phone {gap: 5px;} .header__phone::before {transform: rotate(-45deg);} .header__btn-call {height: 30px; padding: 0 10px; font-size: 12px; text-transform: uppercase; background: none; border: 1px solid var(--green); color: var(--green);} .header__simple-menu {gap: 10px 20px;} .header__soc {gap: 10px; margin-left: 20px;} .header__soc a {display: grid; place-items: center; height: 30px;} .header__soc img {display: block; width: 16px; height: 16px; opacity: 0.5;} .logo {display: block; line-height: 40px; padding-left: 45px; position: relative; font-weight: 700; font-size: 24px; text-transform: uppercase; background: url(../images/logo.svg) 0 center / 40px no-repeat;} .logo img, .logo svg {position: absolute; left: 0; top: 50%; transform: translateY(-50%); display: block; width: 40px; height: 40px;} .header__btn-menu {padding: 0 20px; text-transform: uppercase; font-weight: 700; margin-left: 40px;} .header__btn-icon {background: none; color: var(--tt); padding: 0; font-size: 12px; text-align: center; position: relative;} .header__btn-icon::before {font-size: 24px; height: 30px; color: var(--accent); display: block;} .header__btn-icon span {position: absolute; right: -2px; top: -8px; background-color: var(--green); color: #fff; padding: 1px 6px; font-size: 12px; border-radius: 3px; pointer-events: none;} .header__btn-icon--0 span {display: none;} .header__btn-icon i {font-style: normal;} .search-block {width: 100%; position: relative; margin-right: 40px; margin-left: -20px;} .search-block__input, .search-block__input:focus {padding: 0 50px 0 20px; box-shadow: none;} .search-block__input:not(:focus)::placeholder {color: var(--tt-fade); opacity: 1; font-size: 14px;} .search-block__btn {position: absolute; right: 0; top: 0; width: 50px; border-radius: 0px; font-size: 16px;} /* NAV, MINI CART, ABOUT ----------------------------------------------- */ .header__menu {gap: 0 30px; width: 100%; border-top: 1px solid var(--bdc);} .header__menu > li {position: relative;} .header__menu > li > a {height: 60px; display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: 16px; gap: 10px;} .header__menu-submenu {width: 240px; padding: 15px 30px; border-radius: 0 0 4px 4px; display: grid; gap: 5px; position: absolute; left: -30px; top: 100%; background: var(--bg); box-shadow: 0 12px 12px rgba(0,0,0,0.27); opacity: 0; visibility: hidden; transform: translateY(30px);} .header__menu-submenu li + li {border-top: 1px dashed var(--bdc); padding-top: 5px;} .header__menu-has-submenu > a::after {content:"\f107"; font-weight: 300; font-family:'Font Awesome 5 Pro';} .nav__menu-hidden {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); background-color: var(--bg); box-shadow: var(--bsh-widgets); padding: 40px; max-height: calc(100vh - 40px); width: 1200px; display: none;} .nav__menu-hidden-in {overflow-x: hidden; overflow-y: auto; max-height: calc(100vh - 180px); display: grid; gap: 20px; grid-template-columns: repeat(auto-fill,minmax(240px,1fr));} .nav__menu-hidden-title {height: 60px; font-size: 24px; font-weight: 700; cursor: pointer; width: 100%; justify-content: space-between; align-items: flex-start;} .nav__menu-hidden-caption {font-size: 16px; font-weight: 600; color: var(--accent); padding-bottom: 2px;} .nav__menu-hidden-caption a {color: inherit;} .nav__menu-hidden li + li {margin-top: 5px;} .nav__menu-hidden li + .nav__menu-hidden-caption {margin-top: 20px;} .nav__menu-hidden li span {font-size: 12px; margin-left: 6px; color: var(--tt-fade);} .mcart {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); background-color: var(--bg); box-shadow: var(--bsh-widgets); padding: 40px; max-width: 100vw; max-height: calc(100vh - 40px); width: 600px; overflow-x: hidden; overflow-y: auto; display: none;} .mcart__title {font-size: 24px; margin-bottom: 30px; margin-top: -10px; font-weight: 700; cursor: pointer; justify-content: space-between; width: 100%;} .mcart__btns {gap: 20px; margin-top: 40px;} .mcart__btn-continue {background: none; border: 1px solid var(--bdc); color: var(--tt);} .mcart__total {border-top: 1px solid var(--bdc); padding-top: 20px; margin-top: 20px; gap: 0 20px;} .mcart__total-price span {font-weight: 600; font-size: 18px;} .mcart__item + .mcart__item {margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--bdc);} .mcart__item {display: grid; grid-template-columns: auto 1fr; grid-auto-flow: row dense; gap: 10px 20px;} .mcart__item-img {width: 60px; height: 60px; border: 1px solid var(--bdc); display: block; grid-row: 1 / 3; padding: 5px;} .mcart__item-title {text-decoration: underline;} .mcart__item-price {gap: 10px;} .mcart__item-remove {padding: 0; width: 22px; height: 22px; border-radius: 50%; background-color: var(--red);} .mcart__total {margin-bottom: -20px;} .topper {background-color: var(--bg); border: 1px solid var(--bdc);} .slide {display: block; aspect-ratio: 890 / 370;} .slide img {position: absolute; left: 0; top: 0;} .topper__slider:not(.owl-carousel) {display: flex; overflow: hidden;} .topper__slider:not(.owl-carousel) > * {flex-shrink: 0; width: 100%;} .about {width: 400px;} .about-item {font-size: 12px; position: relative; flex: 1 0 280px; padding: 20px; padding-left: 80px;} .about-item b {font-size: 14px; font-weight: 600; display: block; margin-bottom: 3px;} .about-item a {text-decoration: underline; color: inherit;} .about-item::before {width: 40px; height: 40px; border-radius: 50%; background-color: rgba(0,0,0,0.06); position: absolute; left: 20px; top: 20px; display: grid; place-items: center; font-size: 20px;} .about-item:nth-child(1) {background-color: hsl(83, 63%, 89%); color: hsl(83, 63%, 30%);} .about-item:nth-child(2) {background-color: hsl(261, 24%, 89%); color: hsl(261, 24%, 30%);} .about-item:nth-child(3) {background-color: hsl(12, 73%, 89%); color: hsl(12, 73%, 30%);} .about-item:nth-child(4) {background-color: hsl(26, 34%, 89%); color: hsl(26, 34%, 30%);} /* SECTION ----------------------------------------------- */ .sect:not(:last-child) {margin-bottom: 40px;} .sect__header {margin-bottom: 20px; gap: 10px;} .sect__title {font-size: 24px; font-weight: 700;} .sect__link {color: var(--green);} .sect__content--carousel:not(.owl-carousel) {display: flex; overflow: hidden; gap: 10px;} .sect__content--carousel:not(.owl-carousel) > * {flex-shrink: 0; width: calc((100% - 50px)/6);} .br-list {margin-top: 20px;} .sect--has-carousel .sect__header {padding-right: 110px;} .sect__ctrl {background-color: var(--bg); box-shadow: var(--bsh-item); border-radius: var(--bdrs); padding: 20px; margin-bottom: 20px; position: relative;} .sect__ctrl-header {border-bottom: 1px solid var(--bdc); margin-bottom: 20px; padding-bottom: 20px; color: var(--tt-fade);} .sect__view {border: 1px solid var(--bdc); border-radius: 4px; overflow: hidden;} .sect__view li {cursor: pointer; display: grid; place-items: center; width: 30px; height: 30px;} .sect__view li.is-active {box-shadow: var(--bsh-in); background-color: var(--bg-darker);} .sect__view li + li {border-left: 1px solid var(--bdc);} .speedbar {color: var(--tt-fade); font-size: 12px; margin-bottom: 15px; margin-top: -15px;} .sect__sort::before {content: 'Sort by:'; margin-right: 10px;} .sect__sort ul {display: flex; flex-wrap: wrap; gap: 5px 10px;} .sect__sort li.asc a::after, .sect__sort li.desc a::after {content: "\f063"; font-family: "Font Awesome 5 Pro"; display: inline-block; margin-left: 6px; font-weight: 300; font-size: 10px;} .sect__sort li.desc a::after {content: "\f062"} .sect__sort li:not(.desc,.asc) a {color: var(--tt-fade);} .descr {display: grid; gap: 10px; line-height: 1.7; font-size: 12px; color: #5c5c5c; background-color: var(--bg); padding: 20px; border-radius: 10px; box-shadow: var(--bsh-item);} .descr h1, .descr h2, .descr h3 {font-size: 14px; font-weight: 600; color: var(--tt); line-height: 1.3;} .descr a {text-decoration: underline; color: var(--accent);} .descr ul li {position: relative; padding-left: 25px; margin-left: 25px;} .descr ul li::before {content:"\f00c"; font-weight: 300; font-family:'Font Awesome 5 Pro'; color: var(--accent); position: absolute; left: 0; top: 0;} /* SHORT STORY: CATEGORY, BRAND, ITEM ----------------------------------------------- */ .category-item, .brand-item {background-color: var(--bg); border-radius: var(--bdrs); padding: 20px; font-size: 13px; font-weight: 600; text-align: center; display: block; box-shadow: var(--bsh-item);} .category-item__img {height: 56px; margin-bottom: 20px;} .brand-item__img {height: 80px;} .category-item__img img, .brand-item__img img, .item__img img, .mcart__item-img img {object-fit: contain; width: 100%; height: 100%; display: block;} .owl-item .category-item {height: 100%;} .item {position: relative; background-color: var(--bg); border-radius: var(--bdrs); padding: 20px; gap: 20px; box-shadow: var(--bsh-item);} .item__fav {position: absolute; left: 0px; top: 0; z-index: 10; padding: 10px 10px 10px 15px; font-size: 18px;} .item__fav a {color: var(--tt-fade);} .item__fav-added {color: var(--green);} .item__img {height: 140px;} .item__price {gap: 5px 10px; margin-bottom: 20px; text-align: right;} .item__price-regular {font-weight: 600; font-size: 18px;} .item__price-regular span {font-size: 16px; font-weight: 400;} .item__price-old {text-decoration: line-through; color: var(--red); font-size: 12px;} .item__title h3 {font-weight: 400; font-size: 14px; -webkit-line-clamp: 3;} .item__meta {font-size: 12px; color: var(--tt-fade); gap: 5px 20px; margin-bottom: 10px; flex: 1 0 min-content; min-height: min-content; text-align: right;} .item__in-stock:before {color: var(--green);} .item__in-stock.fa-times:before {color: var(--red);} .item__in-stock {gap: 5px;} .item__ctrl {position: relative; z-index: 10;} .item__btn-buy {border: 1px solid var(--accent); background: none; color: var(--tt); width: 100%;} .owl-item .item {height: 100%;} .grid-1 .item {grid-column: 1 / -1; display: grid; gap: 20px; align-items: start; grid-template-areas: "simg sdesc sdesc" "simg smeta sctrl"; grid-template-columns: 200px 1fr auto; grid-template-rows: auto 1fr;} .grid-1 .item__img {width: 200px; height: 140px; grid-area: simg;} .grid-1 .item__desc {grid-area: sdesc; display: flex; flex-direction: column-reverse;} .grid-1 .item__title h3 {font-weight: 600; font-size: 18px; margin-bottom: 10px;} .grid-1 .item__meta {margin: 0; grid-area: smeta; text-align: left; align-self: end;} .grid-1 .item__ctrl {grid-area: sctrl; align-self: end;} .grid-1 .item__price-old {flex-grow: 0; min-width: max-content; white-space: normal;} /* BLOG ITEM ----------------------------------------------- */ .blog-item {position: relative;} .blog-item__meta {margin: 15px 0 10px 0; gap: 3px 15px; font-size: 12px; color: var(--tt-fade);} .blog-item__meta-item {display: flex; gap: 6px;} .blog-item__title h3 {font-size: 18px; font-weight: 600;} .blog-item__text {margin-top: 10px; -webkit-line-clamp: 4; font-size: 13px;} .sect__content--carousel-blog:not(.owl-carousel) {gap: 20px;} .sect__content--carousel:not(.owl-carousel) > .blog-item {width: calc((100% - 40px)/3);} .d-grid-items--blog {gap: 30px 20px !important; grid-template-columns: repeat(auto-fill,minmax(320px,1fr)) !important;} /* FOOTER, PAGINATION ----------------------------------------------- */ .footer__info {flex-grow: 2;} .footer__logo {margin-top: -10px; color: #fff;} .footer__soc {gap: 10px; margin-top: 25px;} .footer__soc a {display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background-color: rgba(255,255,255,0.1);} .footer__soc img {display: block; width: 18px; height: 18px; filter: invert(1); opacity: 0.66;} .footer__phone {--tt: #fff; font-weight: 600; display: flex; gap: 10px 20px; margin: 25px 0 10px 0; font-size: 18px;} .footer__menu {display: grid; gap: 10px; flex-grow: 1;} .footer__menu-caption {font-weight: 600; font-size: 18px; padding-bottom: 10px; color: #fff;} .footer__menu a {color: var(--tt-fade-dark); font-size: 14px;} .footer__payment-methods {gap: 10px;} .footer__payment-methods img {display: block; width: 58px; height: 36px; border-radius: 3px;} .pagination {padding-top: 30px; gap: 5px;} .pagination__pages a, .pagination__pages span, .pagination__btn {display: grid; place-items: center; height: 36px; min-width: 36px; border: 1px solid var(--bdc); background-color: var(--bg); border-radius: 6px; padding: 0 10px;} .pagination__pages {gap: 5px; font-size: 15px;} .pagination__pages span:not(.nav_ext) {background-color: var(--bg-black); color: #fff;} /* INNER PAGE ----------------------------------------------- */ .page__block-bg {background-color: var(--bg); box-shadow: var(--bsh-item); border-radius: var(--bdrs); padding: 20px; position: relative;} .page__header h1 {font-size: 24px; font-weight: 700; margin-bottom: 10px; width: 100%;} .page__header {gap: 10px 20px;} .page__in-stock {color: var(--green);} .page__in-stock.fa-times {color: var(--red);} .page__cols {display: grid; gap: 20px; grid-template-columns: minmax(0,1fr) 300px; grid-auto-flow: row dense;} .page__col-right {grid-row: 1 / 3; grid-column: 2 / 3;} .page__main {margin-bottom: 20px;} .page__labels {position: absolute; top: 50px; left: 0; gap: 5px;} .page__label {text-transform: uppercase; font-size: 12px; padding: 3px 8px; background-color: #8bad49; color: #fff;} .page__label--red {background-color: #de6767;} .page__label--violet {background-color: #ba86ae;} .page__gallery {position: relative;} .page__gallery-main {height: 500px; padding: 20px; border: 1px solid var(--bdc); border-radius: 3px;} .page__gallery-main a {display: block; height: 100%;} .page__gallery-main img, .page__gallery-thumbs .xfieldimagegallery img {width: 100%; height: 100%; object-fit: contain;} .page__gallery-thumbs .xfieldimagegallery a, .page__gallery-thumbs li {height: 68px;} .page__gallery-thumbs .xfieldimagegallery a {border: 1px solid var(--bdc); box-shadow: none; padding: 5px; border-radius: 2px;} .page__gallery-thumbs .xfieldimagegallery a::before {display: none;} .page__gallery-thumbs .xfieldimagegallery {margin-top: 10px; gap: 10px; margin-bottom: 0; grid-template-columns: repeat(auto-fill,minmax(68px,1fr));} .page__ctrl {display: grid; gap: 40px;} .page__price-old {text-decoration: line-through; color: var(--red); font-size: 18px; margin-bottom: -40px;} .page__price {font-size: 24px; font-weight: 600; line-height: 1; margin-bottom: -10px;} .page__price span {font-weight: 400; font-size: 18px; margin-left: 3px;} .page__promocode {font-size: 13px;} .page__promocode span {display: inline-block; vertical-align: middle; margin: 0 2px; padding: 2px 8px; background-color: #fcc506; font-weight: 600; border-radius: 2px;} .page__btn-buy {height: 50px; font-weight: 600; font-size: 18px;} .page__btn-buyfast {margin-top: -20px; border: 1px solid var(--accent); color: var(--tt); background: none;} .page__buy-info {border-top: 2px dashed var(--bdc); padding-top: 20px; display: grid; gap: 15px; font-size: 13px;} .page__buy-info-item {position: relative; padding-left: 36px;} .page__buy-info-item::before {font-size: 18px; position: absolute; left: 0; top: 0; color: var(--tt-fade);} .page__buy-info-accent {border-radius: var(--bdrs); background-color: var(--bg-darker); padding: 15px; padding-left: 45px; position: relative; font-size: 13px; margin-top: -20px; font-weight: 600;} .page__buy-info-accent::before {position: absolute; left: 15px; top: 15px; font-size: 18px;} .page__list {width: 400px; margin-left: 20px;} .page__manufacturer {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 2px dashed var(--bdc);} .page__manufacturer a, .page__list-list a {color: #06c; text-decoration: underline;} .page__list-list {display: grid; grid-template-columns: minmax(0,1fr); gap: 10px; border-bottom: 2px dashed var(--bdc); padding-bottom: 20px;} .page__list-list li > span:first-child {color: var(--tt-fade);} .page__btn-callback {margin-top: 20px; background-color: var(--green);} .page__tabs-select {gap: 10px; margin-bottom: 20px;} .page__tabs-select button {background: none; color: var(--tt); font-weight: 600; border: 1px solid var(--bdc);} .page__tabs-select button.is-active {color: var(--accent); border-color: var(--accent);} .page-blog__col-right {width: 360px; margin-left: 30px;} .page-blog__col-left {background-color: var(--bg); box-shadow: var(--bsh-item); border-radius: var(--bdrs); padding: 20px;} .page-blog .blog-item__meta-item {color: var(--tt-fade);} .page-blog .page__header {margin-bottom: 30px;} /* TEXT BLOCK, TYPOGRAPHY, VIDEO BLOCK ----------------------------------------------- */ .full-text {line-height: 1.6; font-size: 15px; word-wrap: break-word;} .full-text a {text-decoration: underline; color: #5278b1;} .full-text img:not(.emoji), .full-text p, .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5, .full-text > ul, .full-text > ol, .full-text table {margin-bottom: 25px;} .full-text > img[style*="left"], .full-text > .highslide img[style*="left"] {margin:0 10px 10px 0;} .full-text > img[style*="right"], .full-text > .highslide img[style*="right"] {margin:0 0 10px 10px;} .full-text > ul li, .full-text > ol li {padding-left: 60px; position: relative;} .full-text > ul li:before {content: ''; width: 8px; height: 8px; border-radius: 50%; border: 3px solid #fcc506; position: absolute; top: 6px; left: 34px;} .full-text > ol {counter-reset: num;} .full-text > ol li:before {content: counter(num); counter-increment: num; background-color: #fcc506; color: #000; position: absolute; top: -3px; 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;} .full-text > ol li:after {content: ''; border: 10px solid transparent; border-left-color: #fcc506; position: absolute; left: 41px; top: -3px; transform: scale(0.66,1.5); transform-origin: 0 0;} .full-text > ul li + li, .full-text > ol li + li {margin-top: 10px;} .full-text table, .video-inside > * {width:100%; font-size: 14px;} .full-text table tr td {padding:10px; border:2px solid var(--bg);} .full-text table tr:nth-child(2n+1) {background-color:var(--bg-darker);} .full-text table th tr {background-color: var(--ui-bg-darkest);} .full-text table img:not(.emoji) {margin:0; max-width:350px} .full-text > *: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%;} .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 18px; margin-bottom: 20px; font-weight: 600;} .full-text iframe {width: 100%; height: 400px; margin-bottom: 20px;} .fdl-btn {display: block; position: relative; box-shadow: 0 3px 10px rgba(0,0,0,0.1); text-decoration: none !important; padding: 15px 15px 15px 130px; background: linear-gradient(to top, var(--green), #2ecc71); color: #fff !important; overflow: hidden;} .fdl-btn-title {font-weight: 600; text-transform: uppercase; word-wrap: break-word;} .fdl-btn-size {font-size: 14px; margin-top: -2px; margin-bottom: 6px; opacity: 0.9;} .fdl-btn-caption {opacity: 0.7; font-size: 14px;} .fdl-btn-dl {font-size: 12px; text-transform: uppercase; margin-left: 15px;} .fdl-btn > * {position: relative; z-index: 3;} .fdl-btn-icon {width: 50px; height: 50px; border-radius: 50%; margin-top: -25px; font-size: 24px; position: absolute; left: 40px; top: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 15px rgba(0,0,0,0.13), 0 0 0 30px rgba(0,0,0,0.08), 0 0 0 45px rgba(0,0,0,0.04);} /* COMMENTS ----------------------------------------------- */ .page__comments {margin-top: 0px;} .page__comments-title {font-size: 24px;} .page__comments-info {color: var(--tt-fade); display: block; margin: 5px 0 20px;} .page__comments-info::before {color: var(--ui-red); margin-right: 10px;} .ac-form {margin-bottom: 20px;} .ac-form__header, .ac-form__editor, .ac-form .message-info {gap: 10px; margin-bottom: 10px;} .ac-form__btn {padding: 0 60px;} .ac-form__bottom {gap: 25px;} .confidential-check {font-size: 14px;} .ac-form__header > span {margin-left: 15px;} .ac-form .comments_subscribe {margin-top: 0px;} .ac-form__upload {margin-bottom: 10px;} .ac-form__editor .bb-editor textarea, .ac-form__editor .fr-wrapper {height: 100px !important;} .ac-form__editor .fr-view {min-height: 80px !important;} .ac-form .tox-tinymce {height: 160px !important;} .comments_subscribe + br, .ac-form .bb-editor + br {display: none;} .mass_comments_action {display: flex; align-items: center; flex-wrap: wrap; gap: 10px;} .mass_comments_action select {flex: 1 1 0; margin: 0 -28px 0 0; border-radius: 0; box-shadow: none; min-width: 60%;} .mass_comments_action .bbcodes {border-radius: 0; padding: 0 10px;} .comm__title {font-size: 18px; margin-bottom: 20px; font-weight: 700;} .comm {margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid var(--bdc);} .comm__img {width: 40px; height: 40px; border-radius: 50%; margin-right: 15px;} .comm__img::before {content: ''; width: 8px; height: 8px; border-radius: 50%; background-color: var(--ui-red); position: absolute; right: -1px; top: -1px; z-index: 5; border: 2px solid var(--bg);} .comm--online .comm__img::before {background-color: var(--ui-green);} .comm__letter {width: 100%; height: 100%; text-transform: uppercase; border-radius: inherit; position: absolute; left: 0; top: 0; color: #fff; font-size: 18px; font-weight: var(--ui-fw-bolder);} .comm__author, .comm__author a {color: var(--tt-colored); font-weight: 600; font-size: 14px;} .comm__date {color: var(--tt-fade); font-size: 12px; margin-top: 2px;} .comm__main {margin: 10px 0 6px 0;} .comm__action {gap: 20px; font-size: 12px;} .comm__action li, .comm__action li a {color: var(--tt-fade); cursor: pointer; gap: 8px;} .comm__ctrl, .comm__ctrl a {font-size: 15px; gap: 10px 15px; color: var(--tt-fade);} .comm__ctrl li.has-checkbox {transform: scale(0.8,0.8); margin: 0 -10px 0 -5px;} .comm__ctrl li.has-checkbox input {border-color: var(--tt-fade);} .comm__rating {gap: 10px; font-size: 14px;} .comm__rating::before {content: attr(data-text); display: inline;} .comm__rating > * {display: flex; gap: 5px;} .comm__rating > * > span:first-child {text-decoration: underline; color: var(--ui-green);} .comm__rating > * + * > span:first-child {color: var(--ui-red);} /* LOGIN ----------------------------------------------- */ .login {position: fixed; z-index: 999; left: 50%; top: 50%; transform: translate(-50%,-50%); overflow-y: auto; background-color: var(--ui-bg); width: 440px; border: 10px solid var(--ui-bg-darker); display: none; box-shadow: var(--bsh-widgets); max-width: calc(100vw - 40px); max-height: calc(100vh - 40px);} .login__header {padding: 20px 50px 25px 50px; border-bottom: 1px solid var(--ui-bdc); position: relative;} .login__title {font-size: 18px; font-weight: var(--ui-fw-bolder);} .login__caption {font-size: 12px; color: var(--ui-tt-fade); margin-top: 3px;} .login__close {font-size: 23px; position: absolute; right: 10px; top: 10px; padding: 0; width: 40px; height: 40px;} .login__content {display: grid; gap: 20px; padding: 25px 50px; padding-bottom: 30px; position: relative;} .login__row, .login__row.fal, .login__row.fas {position: relative; display: grid; gap: 10px; justify-content: stretch;} .login__row-caption a, .login__caption a {margin-left: 10px;} .login__row::before {position: absolute; left: 2px; bottom: 0; width: 40px; height: 50px; display: grid; place-items: center; opacity: 0.4; font-size: 18px;} .login__input input {padding-left: 40px; border-radius: 4px; height: 50px; line-height: 48px;} .login__row button {width: 100%; height: 40px; border-radius: 4px;} .login__social {padding-top: 10px; text-align: center; gap: 10px;} .login__social-caption {font-size: 13px; color: var(--ui-tt-fade); width: 100%;} .login__social a, .login__social img {display: block; width: 34px; height: 34px;} .login--logged .login__header {padding-left: 115px;} .login__avatar {width: 50px; height: 50px; position: absolute; left: 50px; top: 25px;} .login__menu a {border-bottom: 1px solid var(--ui-bdc); padding: 10px 0; width: 100%; justify-content: flex-start;} .login__menu li:last-child a {border: 0;} .login__menu a::before {width: 20px; font-size: 18px; text-align: center; color: var(--ui-accent); margin-right: 10px;} /* 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: 300px; height: 100%; overflow-x: hidden; overflow-y: auto; z-index: 999; position: fixed; left: -360px; top: 0; transition: left 0.4s; background-color: var(--bg); visibility: hidden;} .mobile-menu.is-active {left: 0; visibility: visible;} body.mobile-menu-is-opened {overflow: hidden; width: 100%; height: 100%;} @media screen and (max-width: 590px) { .mobile-menu123 {left: -100vw; width: 100vw; height: 100vh;} } .mobile-menu__header {padding: 0 20px; gap: 10px; background-color: var(--ui-bg-darker);} .mobile-menu__btn-close {font-size: 24px; width: 40px; height: 40px; margin-right: -10px;} .mobile-menu__content .header__menu {margin: 0; padding: 20px; display: block;} .mobile-menu__content .header__menu > li > a {height: 40px; line-height: 40px; padding: 0;} .mobile-menu__content .header__menu-submenu {width: 100%; height: auto; position: static; display: none; border-radius: 0; padding: 5px 0 5px 20px; opacity: 1; visibility: visible; transform: none; box-shadow: none;} .mobile-menu__content .header__menu-has-submenu > a::after {content:"\f067"; font-size: 18px;} .mobile-menu__content .header__menu-has-submenu.is-active .header__menu-submenu {display: grid;} .mobile-menu__content .header__menu-has-submenu.is-active > a::after {content:"\f068";} .mobile-menu__content .nav-holder {padding: 20px; margin: 0;} .mpanel {position: fixed; z-index: 990; left: 0; bottom: 0; width: 100%; background-color: var(--bg); box-shadow: var(--bsh-widgets);} .mpanel li {flex-grow: 1; min-width: 20%; font-size: 12px; line-height: 1;} .mpanel li a, .mpanel li > span {display: grid; place-items: center; padding: 10px 0; cursor: pointer; gap: 0; position: relative;} .mpanel li a::before, .mpanel li > span::before {font-size: 18px; height: 22px;} .mpanel li > * span {background-color: var(--accent); color: #fff; font-size: 10px; padding: 2px 4px; position: absolute; top: 5px; left: 50%; margin-left: 10px; border-radius: 3px;} @media screen and (max-width: 1220px) { :root {--indent-negative: -20px; --indent: 20px;} body {background-image: none;} .wrapper {padding: 0; background-image: none; overflow: hidden;} .wrapper-container {max-width:1000px;} .header .header__menu, .header .header__simple-menu, .header__btn-icon i {display: none;} .header__btn-call {order: 10; margin-left: auto;} .header__two {gap: 20px;} .header__btn-mobmenu {display: flex; font-size: 30px;} .header__btn-icon::before {font-size: 24px; height: 40px; display: flex; place-items: center;} .header__btn-icon span {right: -10px;} .header__btn-menu, .header__search {margin: 0;} .modal-is-opened {overflow: hidden;} .nav__menu-hidden {padding: 20px; max-height: 100dvh; width: 100vw;} .nav__menu-hidden-in {max-height: calc(100dvh - 80px); grid-template-columns: repeat(2,minmax(0,1fr));} .nav__menu-hidden-title {height: 40px; font-size: 18px;} .nav__menu-hidden-caption {font-size: 15px;} .sect__content--carousel:not(.owl-carousel) > * {width: calc((100% - 30px)/4);} .footer__info {flex-grow: 0; width: 100%; margin-bottom: 5px;} .cols {display: block;} .about {width: 100%;} .sect__content--carousel:not(.owl-carousel) > .blog-item {width: calc((100% - 40px)/3);} .page__cols {display: flex; flex-direction: column;} @supports (display: contents) { .page__main, .page__col-left {display: contents;} .page__list, .page__gallery {background-color: var(--bg); border-radius: var(--bdrs); padding: 20px var(--indent);} .page__gallery, .page__header {order: -1;} .page__list {width: 100%; margin: 0;} .page__ctrl, .page__tabs {box-shadow: none;} .page__gallery .item__fav {top: 20px; left: 20px;} .page__gallery .page__labels {left: 20px; top: 69px;} } .page-blog__col-right {width: 100%; margin: 0; margin-top: 30px;} .page-blog__cols {display: block;} } @media screen and (max-width: 950px) { .wrapper-container {max-width:768px;} .header__two {gap: 20px 20px; padding-top: 20px; padding-bottom: 10px;} .header__btn-menu, .header__search {order: 10; min-width: calc((100% - 20px)/2);} .header__btn-menu {margin-right: -10px;} .header__logo {margin-right: auto;} .sect__content--carousel:not(.owl-carousel) > * {width: calc((100% - 20px)/3);} .sect__content--carousel:not(.owl-carousel) > .blog-item {width: calc((100% - 20px)/2);} .page__list {width: 100%; margin: 0; margin-top: 20px;} @supports (display: contents) { .page__list {margin-top: 0;} } } @media screen and (max-width: 760px) { .wrapper-container {max-width:640px;} .pagination > a, .pagination > span, .pagination__pages > * {flex-grow: 1;} .pagination__pages {min-width: 100%;} .header__soc {display: none;} .sect__view {position: absolute; right: 20px; top: 13px;} .sect__sort {min-width: 100%;} .sect__sort::before {margin: 0; margin-bottom: 10px; width: 100%;} .sect__content--carousel:not(.owl-carousel) > * {width: calc((100% - 10px)/2);} .footer__menu {flex-grow: 0; width: 100%; display: flex; flex-wrap: wrap; gap: 10px 20px;} .footer__menu-caption, .footer__text {width: 100%; padding-bottom: 0; min-width: 100%;} .d-grid-items {grid-template-columns: repeat(2,minmax(0,1fr));} .grid-1 .item {grid-template-columns: 120px minmax(0,1fr); grid-template-rows: auto auto; grid-template-areas: "simg sdesc" "sctrl smeta";} .grid-1 .item__img {width: 120px; height: 120px;} .grid-1 .item__title h3 {font-size: 15px; margin-bottom: 5px;} .grid-1 .item__meta {align-self: center;} .mcart {padding: 20px; width: calc(100vw - 40px); max-height: calc(100vh - 40px);} .mcart__title {font-size: 18px; margin-bottom: 20px; margin-top: 0px;} .mcart__item + .mcart__item {margin-top: 10px; padding-top: 10px;} .mcart__item {gap: 10px 10px;} .mcart__item-img {width: 50px; height: 50px;} .mcart .item__price-regular {font-size: 18px;} .mcart__btn {font-size: 14px; white-space: normal; line-height: 1;} .mpanel {display: flex;} .scrolltop {bottom: 65px;} .scrolltop.is-active {bottom: 65px; right: 10px;} .sect__content--carousel:not(.owl-carousel) > .blog-item {width: 100%;} .page__title {font-size: 24px;} .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 20px;} .page__intro, .page__text .quote {margin-left: var(--indent-negative); margin-right: var(--indent-negative); padding-right: var(--indent);} .full-text h1, .full-text h2, .full-text h3, .full-text h4, .full-text h5 {font-size: 18px;} .ac-form__bottom {gap: 10px;} .ac-form__bottom button {padding: 0 20px;} .ac-form__header input + input {min-width: 100%; order: 10;} .ac-form__header > span, .comm__rating::before {display: none;} } @media screen and (max-width: 590px) { .wrapper-container {max-width:480px;} .header__phone::before, .about-item br {display: none;} .header__one {gap: 10px;} .header__phone {font-size: 12px;} .header__two {gap: 20px 15px;} .header__logo img, .header__logo svg {width: 26px; height: 26px;} .header__logo {flex: 1 1 0; max-width: 100%; min-width: 120px; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 30px; background-size: 26px 26px; background-position: left 5px} .header__search input {padding-left: 15px; padding-right: 40px;} .header__search input::placeholder {font-size: 12px !important;} .search-block__btn {width: 40px;} .header__btn-menu {margin-right: -5px; padding: 0;} .sect__content--carousel:not(.owl-carousel) > .blog-item {width: 100%;} .page__gallery-main {height: 300px;} .page__gallery-thumbs .xfieldimagegallery a, .page__gallery-thumbs li {height: 50px;} .page__gallery-thumbs .xfieldimagegallery {grid-template-columns: repeat(auto-fill,minmax(50px,1fr));} } @media screen and (max-width: 470px) { .wrapper-container123 {max-width:360px;} .login__header, .login__content {padding-left: 20px; padding-right: 20px;} .login--logged .login__header {padding-left: 85px;} .login__avatar {left: 20px;} .login__title span {display: none;} .login__input input, .login__row::before {height: 40px; line-height: 38px;} .login__menu {margin: -15px 0;} .content {padding-bottom: 40px;} .nav__menu-hidden-in {grid-template-columns: repeat(1,minmax(0,1fr));} .header__logo {margin-right: -5px; font-size: 15px;} .header__one {justify-content: space-between;} .header__btn-call {font-size: 10px; padding: 0; flex-grow: 1;} .topper {margin-top: -40px; margin-left: var(--indent-negative); margin-right: var(--indent-negative);} .owl-dots {bottom: 10px !important;} .sect__title {min-width: 100%;} .sect--has-carousel .sect__title {font-size: 18px;} .sect--has-carousel .sect__link {font-size: 14px;} .descr, .sect__ctrl, .page__ctrl, .page__main, .page__tabs {border-radius: 0; padding-left: var(--indent); padding-right: var(--indent); margin-left: var(--indent-negative); margin-right: var(--indent-negative);} .footer__soc a {width: 40px; height: 40px;} .footer__phone {font-size: 14px;} .item {padding: 10px; gap: 15px; padding-top: 15px;} .item__img {height: 100px;} .item__btn-buy {width: 100%;} .item__price-old {flex-grow: 0; min-width: max-content;} .item__price {margin: 0; gap: 0 15px; margin-bottom: 10px;} .item__vendor-code {display: none;} .sect__content--carousel:not(.owl-carousel) > .blog-item {width: 100%;} .page__cols {gap: 0;} .page__main {border: 1px solid var(--bdc); border-left: 0; border-right: 0; box-shadow: none; margin-bottom: 0;} .page__header h1 {font-size: 18px; margin-bottom: 10px;} .page__header {gap: 0 20px; font-size: 12px; margin-bottom: 20px;} .page__tabs {box-shadow: none;} .page__tabs-select button {flex-grow: 1;} @supports (display: contents) { .page__list {border-radius: 0; padding-left: var(--indent); padding-right: var(--indent); margin-left: var(--indent-negative); margin-right: var(--indent-negative); width: calc(100% + var(--indent)*2); border-top: 1px solid var(--bdc); padding-bottom: 0;} .page__gallery {border-radius: 0; margin-left: var(--indent-negative); margin-right: var(--indent-negative); max-width: calc(100% + var(--indent)*2); border-bottom: 1px solid var(--bdc);} } .page-blog__col-left {max-width: calc(100% + 40px); width: calc(100% + 40px); margin: 0 -20px; border-radius: 0;} .confidential-check, .comm__rating {font-size: 12px;} .full-text table {font-size: 12px;} .ac-form__bottom .comments_subscribe {font-size: 13px;} .full-text iframe {width: calc(100% + 40px); max-width: calc(100% + 40px); height: 260px; margin-left: -20px; margin-right: -20px;} } /** * 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-stage {position: relative; display:flex; justify-content:flex-start;} .owl-stage-outer {position: relative; overflow: visible; transform: translate3d(0px, 0px, 0px);} .owl-item {position: relative; min-height: 10px;} .owl-nav.disabled,.owl-dots.disabled, .owl-carousel.owl-refresh .owl-item {display: none;} .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-animated-in {z-index: 0;} .owl-animated-out {z-index: 1;} .fadeOut {animation-name: fadeOut;} .fadeIn {animation-name: fadeIn;} @keyframes fadeOut { from {opacity: 1;} to {opacity: 0;} } @keyframes fadeIn { from {opacity: 0;} to {opacity: 1;} } .scaleIn {animation-name: scaleIn;} .scaleOut {animation-name: scaleOut;} @keyframes scaleIn { from {opacity: 0; transform: scale(0.66,0.66); transform-origin: center top;} to {opacity: 1; transform: scale(1,1); transform-origin: center top;} } @keyframes scaleOut { from {opacity: 1; transform: scale(1,1);} to {opacity: 0; transform: scale(0.66,0.66);} } .slideOutDown {animation-name: slideOutDown;} .slideInDown {animation-name: slideInDown;} @keyframes slideOutDown { from {transform: translate3d(0, 0, 0);} to {visibility: hidden; transform: translate3d(0, 100%, 0);} } @keyframes slideInDown { from {transform: translate3d(0, -100%, 0); visibility: visible;} to {transform: translate3d(0, 0, 0);} } .rollOut {animation-name: rollOut;} @keyframes rollOut { from {opacity: 1;} to {opacity: 0; transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);} } .owl-nav {position: absolute; right: 0; top: -55px; display: flex; gap: 10px;} .owl-prev, .owl-next {cursor: pointer; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-size: 18px; background-color: var(--bg); color: var(--tt); box-shadow: var(--bsh-item);} .owl-prev {left: -40px;} .owl-next {right: -40px;} .owl-prev:hover, .owl-next:hover {background-color: var(--accent); color: #fff;} .owl-dots {display: flex; gap: 12px; flex-wrap:wrap; justify-content: center; position: absolute; left: 0px; right: 0px; bottom: 20px;} .owl-dot {display: block; width: 20px; height: 20px; border-radius: 50%; cursor: pointer; background-color: var(--accent); transform: scale(0.6,0.6); border: 2px solid #fff;} .owl-dot.active {transform: scale(1,1);} #brands-carousel .owl-nav {gap: 0; top: -60px;} #brands-carousel .owl-nav button {background: none; width: 30px; color: var(--tt); box-shadow: none;} .owl-item {opacity: 0; pointer-events: none; transition: opacity 0.2s linear;} .owl-item.active, .topper__slider .owl-item {opacity: 1; pointer-events: auto;} .topper__slider .owl-stage-outer, .sect__content--carousel-blog .owl-stage-outer {overflow: hidden;} /* FILTER FORM ----------------------------------------------- */ .filt {display: grid; grid-template-columns: minmax(260px,1fr); gap: 20px;} .filt__section-title {font-weight: 600; text-transform: uppercase; cursor: pointer; font-size: 12px;} .filt__section-title::before {display: grid !important; place-items: center; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--bdc); box-sizing: border-box; font-size: 16px;} .filt input, .filt select {box-shadow: none;} .filt__input-group, .filt__btns {gap: 10px;} .filt__input-group input, .filt__btns input {flex: 1 1 0; max-width: 100%; min-width: 30px; text-align: center;} [data-dlefilter="reset"], .filt-btn {border: 1px solid var(--accent); color: var(--tt); background: none;} .filt__section.is-active .filt__section-title::before {transform: rotate(180deg);} .filt__section-content:not(.filt__btns) {display: none; gap: 15px; margin-top: 20px;} .filt__section.is-active .filt__section-content:not(.filt__btns) {display: grid;} @media screen and (max-width: 1220px) { .filt-btn {width: 100%; display: flex; margin-bottom: 10px;} .filt {display: none;} .filt.is-active {display: grid; margin-bottom: 10px;} } /* Ion.RangeSlider css version 2.0.3 Denis Ineshin | IonDen.com */ .irs {position: relative; display: block; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .irs-line {position: relative; display: block; overflow: hidden; outline: none !important;} .irs-line-left, .irs-line-mid, .irs-line-right {position: absolute; display: block; top: 0;} .irs-line-left {left: 0; width: 11%;} .irs-line-mid {left: 9%; width: 82%;} .irs-line-right {right: 0; width: 11%;} .irs-bar {position: absolute; display: block; left: 0; width: 0;} .irs-bar-edge {position: absolute; display: block; top: 0; left: 0;} .irs-shadow {position: absolute; display: none; left: 0; width: 0;} .irs-handle {position: absolute; display: block; cursor: default; z-index: 1;} .irs-handle.single {} .irs-handle.from {} .irs-handle.to {} .irs-handle.type_last {z-index: 2;} .irs-min {position: absolute; display: block; left: 0; cursor: default;} .irs-max {position: absolute; display: block; right: 0; cursor: default;} .irs-from, .irs-to, .irs-single {position: absolute; display: block; top: 0; left: 0; cursor: default; white-space: nowrap;} .irs-grid {position: absolute; display: none; bottom: 0; left: 0; width: 100%; height: 20px;} .irs-with-grid .irs-grid {display: block;} .irs-grid-pol {position: absolute; top: 0; left: 0; width: 1px; height: 8px; background: #ec2828;} .irs-grid-pol.small {height: 4px;} .irs-grid-text {position: absolute; bottom: 0; left: 0; white-space: nowrap; text-align: center; font-size: 9px; line-height: 9px; padding: 0 3px; color: #ec2828;} .irs-disable-mask {position: absolute; display: block; top: 0; left: -1%; width: 102%; height: 100%; cursor: default; background: rgba(0,0,0,0.0); z-index: 2;} .irs-disabled {opacity: 0.4;} .lt-ie9 .irs-disabled {filter: alpha(opacity=40);} .irs-hidden-input {position: absolute !important; display: block !important; top: 0 !important; left: 0 !important; width: 0 !important; height: 0 !important; font-size: 0 !important; line-height: 0 !important; padding: 0 !important; margin: 0 !important; outline: none !important; z-index: -9999 !important; background: none !important; border-style: solid !important; border-color: transparent !important;} /* Ion.RangeSlider, Nice Skin */ .irs-line-mid, .irs-line-left, .irs-line-right, .irs-bar, .irs-bar-edge, .irs-handle {} .irs {height: 40px;} .irs-with-grid {height: 60px;} .irs-line {height: 6px; top: 25px; background-color: #eee; border-radius: 3px; box-shadow: inset 0 1px 2px rgba(0,0,0,0.2);} .irs-bar {height: 6px; top: 25px; background-color:var(--green); border-radius:3px;} .irs-bar-edge {top: 25px; height: 8px; width: 11px; background-color:#e3e3e3;} .irs-shadow {height: 1px; top: 34px; background: #2ecc71; opacity: 0.15;} .irs-handle {width: 20px; height: 20px; top: 18px; background-color:#fff; border-radius:50%; border: 3px solid var(--green); box-shadow: 0 1px 3px rgba(0,0,255,0.3); cursor: pointer;} .irs-handle.state_hover, .irs-handle:hover {background-position: 0 -150px;} .irs-min, .irs-max {color: #999; font-size: 10px; line-height: 1.333; text-shadow: none; top: 0; padding: 1px 3px; background: rgba(0,0,0,0.1); border-radius: 3px;} .lt-ie9 .irs-min, .lt-ie9 .irs-max {background: #ccc;} .irs-from, .irs-to, .irs-single {font-size: 10px; margin-top: -6px; padding: 3px 5px; background: none; color: #000; border-radius: 3px;} .lt-ie9 .irs-from, .lt-ie9 .irs-to, .lt-ie9 .irs-single {background: #999;} .irs-grid-pol {background: #99a4ac;} .irs-grid-text {color: #99a4ac;} .irs-disabled {} .DLEPush { z-index: 2001; position: fixed; right: 20px; top: 20px } @keyframes DLEPush-show { 0% { transform: translateY(100%); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .DLEPush-notification.wrapper { animation-name: DLEPush-show; animation-duration: 1s; position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; color: #333; margin-bottom: 10px; width: 100%; max-width: 400px; box-shadow: 0 10px 15px rgb(0 0 0 / 20%); background-color: #fff; border-radius: 10px } .DLEPush-notification .DLEPush-icon { grid-column: 1; grid-row: 1 / span 2; display: flex; align-items: center; justify-content: center; color: #fff; width: 45px; height: 100%; border-top-left-radius: 10px; border-bottom-left-radius: 10px; text-align: center; } .DLEPush-notification .DLEPush-icon svg { scale: .8; } .DLEPush-notification .DLEPush-header { font-weight: 500; grid-column: 2; grid-row: 1; font-size: 1rem; margin-left: 1rem; margin-top: .5rem; } .DLEPush-notification .DLEPush-header:empty { margin-top: 0; } .DLEPush-notification .DLEPush-message { grid-column: 2; grid-row: 2; font-size: .875rem; margin: 1rem; } .DLEPush-notification .DLEPush-message li, .DLEPush-notification .DLEPush-message ul { list-style-type: none; padding-left: 0; } .DLEPush-notification .DLEPush-close { position: absolute; top: 8px; right: 10px; font-weight: 300; background: none; border: 0; font-size: 1.15rem; cursor: pointer; line-height: 1; padding: 0; color: inherit; outline: 0; opacity: 0.75; } @media only screen and (min-width: 601px) { .DLEPush-notification.wrapper { min-width: 400px; } } .DLEPush-notification .DLEPush-close:hover { opacity: 1; } .DLEPush-notification.wrapper.push-success { background-color: #e0f2f1; } .DLEPush-notification.wrapper.push-success .DLEPush-icon { background-color: #00897b; } .DLEPush-notification.wrapper.push-warning { background-color: #FFF3E0; } .DLEPush-notification.wrapper.push-warning .DLEPush-icon { background-color: #FF9800; } .DLEPush-notification.wrapper.push-error { background-color: #FBE9E7; } .DLEPush-notification.wrapper.push-error .DLEPush-icon { background-color: #FF5722; } input[type="text"].comments_author_field { width: 100%; margin-bottom: 10px; } The changes between 16.1 and 17.0 1. Add CSS styles to your template: .mce-accordion summary { cursor: pointer; } .self_delete_link { border: 0 none; display: inline-block; vertical-align: middle; cursor: pointer; padding: 12px 27px; border-radius: 10px; outline: none; background-color: #f44336; color: #fff; text-shadow: 0 1px #333; text-decoration: none !important; box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2); box-sizing: border-box; transition: all ease .1s; transition: all ease .1s; } 2. Open the userinfo.tpl file and add the tag in the desired place in the profile editing section: [delete]Delete Account[/delete] The changes between 16.0 and 16.1 The changes between 15.3 and 16.0 The changes between 15.2 and 15.3 The changes between 15.1 and 15.2 The changes between 15.0 and 15.1 The changes between 14.3 and 15.0 The changes between 14.2 and 14.3 The changes between 14.1 and 14.2 The changes between 14.0 and 14.1 The changes between 13.3 and 14.0 The changes between 13.2 and 13.3 The changes between 13.1 and 13.2 The changes between 13.0 and 13.1 The changes between 12.1 and 13.0 The changes between 12.0 and 12.1 The changes between 11.3 and 12.0 The changes between 11.2 and 11.3 The changes between 11.1 and 11.2 The changes between 11.0 and 11.1 The changes between 10.6 and 11.0 The changes between 10.5 and 10.6 The changes between 10.4 and 10.5 The changes between 10.3 и 10.4 The changes between 10.2 и 10.3 The changes between 10.2 и 10.1 The changes between 10.1 и 10.0 The changes between 10.0 и 9.8 The changes between 9.8 и 9.7 The changes between 9.7 и 9.6 The changes between 9.6 и 9.5 The changes between 9.4 и 9.5 Attention: The list of changes is given relative to a standard Default template. You need to make changes to your template based on the needs and the layout of your template. Not all the changes necessary for your site, and not necessarily what design is right for your site. © 2004 - 2024 LLC "Softnews Media Group". Powered by DataLife Engine. All rights reserved. I287L3LD3.13MI327whoissourceRank1.98MPIN0Summary reportDiagnosisDensity473n/a Cookies & Privacy