.title_card-main { padding-bottom: 22px; margin-top: 29px; &.title_cat-main * { line-height: 22px; } } .card-block-wrapp { background: #fff; } .card-list-buttons-wr { margin-top: 88px; } .card-list-buttons { width: 100%; float: left; //width: 25%; //position: absolute; //right: 0; //bottom: 28px; li { width: 33.33333%; float: left; text-align: center; a { height: 24px; text-align: center; text-decoration: none; &:before { @include svgIcon; color: #9d9d9d; line-height: 24px; font-size: 24px; } &.ico-btns-card-1 { &:before { content: '\e91a'; } } &.ico-btns-card-2 { &:before { content: '\e90f'; } } &.ico-btns-card-3 { &:before { content: '\e91f'; } } &:hover { &:before { color: $blocks-color-hover; } } &:active { &:before { color: $blocks-color-active; } } .active { &:before { color: $blocks-color; } } } &.active { a { &:before { color: $blocks-color; } } } } } .card-bye-wrapp { margin-top: 0px; float: right; } .btn-bye-card { width: 120px; text-transform: uppercase; font-size: 16px; float: right; height: 44px; line-height: 44px; font-weight: 700; } .bye-in-one-click-wr { margin-top: 20px; } .bye-in-one-click { width: 100%; max-width: 262px; margin: 0 auto; height: 32px; form { display: table; width: 100%; position: relative; } input { float: left; width: 100%; border: 1px solid $grey-color; border-right: 0; height: 32px; margin: 0; padding-right: 92px; text-align: center; padding-left: 0; color: #8e8e8e; font-size: 15px; &:focus { text-align: left; padding-left: 14px; } } button { position: absolute; top: 0; right: 0; width: 92px; border: 1px solid $grey-color; background: $grey-color; border-left: 0; height: 32px; margin: 0; font-size: 14px; font-weight: 700; text-transform: uppercase; line-height: 34px; &:hover { background: $grey-color-hover; } &:active { background: $grey-color-active; } } } .price-buttons-card-wr { margin-top: 27px; } .price-card-block { //margin-top: 64px; margin-top: 5px; position: relative; text-align: left; height: 34px; float: left; p { font-size: 16px; text-decoration: line-through; margin-bottom: 4px; margin-top: -3px; span { font-size: 16px; } } div { line-height: 34px; font-size: 20px; font-weight: 700; span { font-size: 20px; } } &.has-new-price { div { text-align: left; line-height: 20px; } } } b.sale-card-percent { position: absolute; right: -0px; top: 12px; font-size: 15px; background: $statusPercent; width: 49px; height: 25px; line-height: 25px; text-align: center; z-index: 2; &:before { @include svgIcon; color: $statusPercent; content: '\e919'; font-size: 25px; position: absolute; left: -9px; top: 0; } } .card-code { margin-top: 0; span { color: $main-color; display: block; float: left; background: #ced0d5; line-height: 22px; height: 20px; font-size: 11px; text-align: center; padding: 0 6px; min-width: 115px; } } .cards-tabs-wrapp { background: #fff; margin-top: 54px; } .tabs-desktops-wr { padding: 0 15px; ul { li { float: left; padding-left: 24px; padding-right: 24px; position: relative; &:before { position: absolute; width: 1px; height: 13px; background: #dddddd; content: ''; left: 0; top: 50%; margin-top: -7px; } &:first-child { padding-left: 0; &:before {display: none;} } &:last-child { padding-right: 0; } a { text-decoration: none !important; display: table-cell; vertical-align: middle; height: 56px; color: #a3a3a3; text-transform: uppercase; font-size: 18px; font-weight: 700; &:hover { color: $blocks-color-hover; } &:active { color: $blocks-color-active; } } &.active { a { color: $main-color !important; } } } } } .tabs-vis-blocks-wr { padding: 26px 15px; p { width: 100%; float: left; font-size: 14px; color: inherit; margin-bottom: 17px; line-height: 18px; &:last-child {margin-bottom: 0} } .desk_txt { * { line-height: 18px; } h1, h2, h3, h4, h5, h6 { line-height: normal; } img { max-width: 100%; } p, ul, ol, h1, h2, h3, h4, h5, h6 { margin-bottom: 18px; } ul, ol { float: left; li { position: relative; //margin-bottom: 6px; } } ul { li { padding-left: 11px; &:before { content: ''; display: block; width: 4px; height: 4px; position: relative; left: -4px; background: $blocks-color; border-radius: 100%; float: left; margin-left: -6px; margin-top: 8px; } } } } } .desk_txt-wr { //display: none; &.active { display: block; } } .row-slider-card { //margin-bottom: 30px; } .options-txt-card-wrapp { background: #fff; border: 1px solid $border-items; border-bottom: 3px solid $blocks-color; margin-top: 10px; padding-top: 4px; padding-bottom: 20px; } .min-pic-gallery-card { position: absolute !important; top: 0; left: 0; height: 100%; //max-height: 399px; max-height: 448px; padding: 0 0 0 15px !important; overflow: hidden; } .desk_specific { table { width: 100%; font-size: 14px; line-height: 20px; tr { background: #fff; &:nth-child(odd) { background: #f5f5f5; } td { padding: 4px 0 4px 10px; font-weight: 700; &:first-child { font-weight: 400; } a { } } } } } .left-stock { } .right-stock { line-height: 16px; a {} span { color: $link-color; } } .gallery-card-wrapp { .card-code { position: absolute; top: 15px; left: 0; margin-top: 0; } .sale-card-percent { //right: 0; //top: 15px; } } .more-cities-stock-wr { display: none; position: absolute; top: 0; right: 0; width: 20px; height: 20px; text-align: center; cursor: pointer; } .mobile-sale { text-align: center; color: #8e8e8e; font-size: 13px; margin-top: 12px; } .mobile-card-tabs { cursor: pointer; width: 100%; float: left; background: #555555; position: relative; padding: 0 10px; &:first-child { } &:before { @include svgIcon; color: #fff; font-size: 11px; content: '\e915'; line-height: 38px; right: 10px; position: absolute; top: 0; display: block; @include Transition(0.2); } span { display: table-cell; width: 100%; vertical-align: middle; color: #fff; font-size: 18px; text-transform: none; font-weight: 500; height: 38px; } &.active { } } .desk_txt-wr { &.active { .mobile-card-tabs { &:before { @include Rotate(180); } } } } .status_card { float: left; div { margin-top: 10px; width: 100%; float: left; span { font-size: 13px; line-height: 16px; position: relative; padding-left: 26px; img { position: absolute; width: 16px; height: 16px; left: 0; top: 50%; margin-top: -8px; } } } } .ico-btns-card-1 { position: relative; float: right; padding-top: 29px; &:before { @include svgIcon; position: absolute; left: 50%; top: 0; margin-left: -11px; width: 22px; height: 22px; text-align: center; line-height: 22px; font-size: 22px; color: $color-ico-grey; z-index: 1; content: "\e900"; } &:hover { &:before { color: $yellow-color-hover; } } &.in_active { &:before { color: $yellow-color; } } &:active { &:before { color: $yellow-color-active; } } } .card-code-stock-wr { float: left; } .desk-top-wr { margin-top: 27px; p { font-size: 14px; margin-top: 6px; &:first-child { margin-top: 0; } span { font-weight: 700; } } } .column-card-2 { padding-right: 30px !important; min-height: 351px; &:before { width: 24px; height: 351px; background: url("../images/shadow-card.png") 0 0 no-repeat; content: ''; position: absolute; top: 0; right: -24px; } } .card-num-stock { float: right; margin-top: 5px; height: 34px; margin-right: 27px; input { width: 48px; height: 100%; text-align: center; font-weight: 700; font-size: 16px; margin-top: 0; float: left; padding: 0; } div { width: 16px; height: 100%; margin-left: 3px; position: relative; float: left; span { position: absolute; width: 100%; height: 16px; top: 0; left: 0; cursor: pointer; background: $grey-color; &:hover { background: $grey-color-hover; } &:active { background: $grey-color-active; } &:before, &:after { background: #fff; content: ''; position: absolute; top: 50%; left: 50%; } &:before { width: 10px; height: 2px; margin-left: -5px; margin-top: -1px; } &.span-plus { top: auto; bottom: 0; &:after { width: 2px; height: 10px; background: #fff; margin-top: -5px; margin-left: -1px; } } } } } .column-card-3-bl { text-align: center; margin-top: 31px; &:first-child { margin-top: 0; } div { position: relative; &:before { @include svgIcon; } } span { font-size: 11px; text-transform: uppercase; font-weight: 700; @include wfl; margin-top: 7px; line-height: 13px; } a { @include wfl; } } .column-card-3-blocks-wr { margin-top: -3px; } .title_card { font-size: 24px; } .my-gallery { .status_items-wr { padding-right: 65px; } } .product-margin-minus { margin-bottom: -8px; } @media (max-width: 1200px) { } @media (max-width: 991px) { .column-card-2 { padding-right: 15px !important; } .tabs-vis-blocks-wr { .desk_txt { img { height: auto !important; } } } } @media (max-width: 910px) { .btn-bye-card { width: 100px; &.disabled { padding: 0 5px 0 5px; font-size: 10px !important; } } } @media (max-width: 890px) { .bye-in-one-click { input { padding-right: 50px; font-size: 13px; } button { font-size: 11px; width: 50px; } } } @media (max-width: 850px) { .card-num-stock { input { width: 38px; font-size: 14px; } } } @media (max-width: 767px) { .product-margin-minus { margin-bottom: 22px; } .card-code-stock-list-wr { margin-top: 20px; } .card-code { } .price-card-block { //margin-top: 10px; } .card-list-buttons-wr { //margin-top: 8px; } .card-list-buttons li {text-align: left;} // .mobil-column-card-f { // &[class*="col-xs-"] { // padding-left: 15px !important; // } // // } //.mobil-column-card-s { // &[class*="col-xs-"] { // padding-right: 15px !important; // } //} .price-card-block b.b.sale-card-percent { right: -10px; } .tabs-desktops-wr ul li { a { font-size: 15px; } } .bye-in-one-click { max-width: 312px; } .bye-in-one-click { input { padding-right: 92px; font-size: 15px; } button { font-size: 13px; width: 92px; } } } @media (max-width: 550px) { .price-buttons-card-wr { width: 262px; float: none; margin: 0 auto; } .card-num-stock { float: left; padding-left: 34px; input { width: 48px; margin-left: 3px; } div { width: 34px; span { height: 34px; &.span-minus { left: -88px; } } } } .card-code-stock-list-wr { margin-top: 17px; } //.mobil-column-card-f { // &[class*="col-xs-"] { padding-left: 10px !important;} //} //.mobil-column-card-s { // &[class*="col-xs-"] { padding-right: 10px !important;} //} .hidden-550 { display: none; } .visible-550 { &.hidden { display: block !important; } } .gallery-card-wrapp { display: block !important; } .mobil-column-card-f, .mobil-column-card-s { width: 100% !important; } .mobil-column-card-f { left: auto !important; background: #f5f5f5; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; margin-top: 11px; padding-bottom: 9px; } .mobil-column-card-s { right: auto !important; } .price-card-block { width: auto; margin-top: 14px; margin-bottom: 23px; p { margin-bottom: 5px; } &.has-new-price { //margin-top: 29px; } } .card-bye-wrapp { width: auto; float: right; margin-top: 0; } .mobil-column-card-s { &[class*="col-xs-"] { padding-left: 20px !important; padding-right: 20px !important; } } .card-list-buttons-wr { display: none; } .cards-tabs-wrapp { margin-top: 25px; } .desk_txt-wr { display: block !important; } .tabs-desktops-wr { display: none; } .tabs-vis-blocks-wr { padding: 0; border: 0; .mobile-card-tabs { display: table !important; } } .desk_txt-wr { margin-top: 2px; max-height: 38px; overflow: hidden; @include Transition(0.4); &:first-child { margin-top: 0; } &.active { max-height: 2500px; @include Transition(0.9); } .desk_txt, .desc_del, .desc_comments { margin-top: 10px; margin-bottom: 10px; padding: 0 10px; } } .price-card-block { width: 100%; text-align: center; div { } &.has-new-price { div { text-align: center; } } } .bye-in-one-click { max-width: 262px; } } @media (max-width: 450px) { } @media (max-width: 400px) { .mobil-column-card-f { .cities-stock-wr { &.more-cities { height: 18px; overflow: hidden; .more-cities-stock-wr { display: block; &:before { @include svgIcon; line-height: 20px; color: #a0a0a0; font-size: 11px; content: '\e915'; } } &.show { height: auto; .more-cities-stock-wr { display: none; } } p { &:last-child { width: 159px; } } } } } } @media (max-width: 330px) { }