SHARE
TWEET

shinglas css

max197a Dec 11th, 2019 (edited) 82 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.23, autoprefixer: v9.7.3) */
  2.  
  3. .relative-products-part {
  4.     padding: 70px 0 0;
  5. }
  6.  
  7. .relative-products-part .part-title {
  8.     font-size: 24px;
  9.     font-weight: 700;
  10.     text-align: left;
  11.     text-transform: uppercase;
  12.     margin-bottom: 50px;
  13. }
  14.  
  15. .relative-products-part h4 {
  16.     font-size: 16px;
  17.     text-transform: uppercase;
  18.     font-weight: 700;
  19.     position: relative;
  20.     padding: 15px 20px 15px 85px;
  21.     margin: 0;
  22.     background: #fff;
  23.     color: #000;
  24.     border-bottom: 1px solid #f0f0f0;
  25.     cursor: pointer;
  26.     text-align: left;
  27. }
  28.  
  29. .relative-products-part h4:before {
  30.     position: absolute;
  31.     width: 57px;
  32.     height: 100%;
  33.     border-right: 1px solid #f0f0f0;
  34.     content: '';
  35.     display: block;
  36.     left: 0;
  37.     top: 0;
  38. }
  39.  
  40. .relative-products-part h4:after {
  41.     position: absolute;
  42.     display: block;
  43.     content: '';
  44.     width: 12px;
  45.     height: 12px;
  46.     top: 50%;
  47.     -webkit-transform: translateY(-65%) rotate(45deg);
  48.         -ms-transform: translateY(-65%) rotate(45deg);
  49.             transform: translateY(-65%) rotate(45deg);
  50.     border: 3px solid #dc2c31;
  51.     border-left: none;
  52.     border-top: none;
  53.     left: 24px;
  54.     -webkit-transition: all 0.25s ease-in-out;
  55.     -o-transition: all 0.25s ease-in-out;
  56.     transition: all 0.25s ease-in-out;
  57. }
  58.  
  59. .relative-products-part h4.is-open:after {
  60.     -webkit-transform: translateY(-35%) rotate(-135deg);
  61.         -ms-transform: translateY(-35%) rotate(-135deg);
  62.             transform: translateY(-35%) rotate(-135deg);
  63. }
  64.  
  65. .catalog-item-page .complects-list.relative-products-part .production-item:hover {
  66.     -webkit-transform: none !important;
  67.         -ms-transform: none !important;
  68.             transform: none !important;
  69.     -webkit-box-shadow: none;
  70.             box-shadow: none;
  71. }
  72.  
  73. .catalog-item-page .complects-list.relative-products-part .production-item {
  74.     margin-top: 20px;
  75.     padding-bottom: 20px;
  76.     border-bottom: 1px solid #d7d7d7;
  77.     display: -webkit-box;
  78.     display: -webkit-flex;
  79.     display: -ms-flexbox;
  80.     display: flex;
  81.     -webkit-box-align: center;
  82.     -webkit-align-items: center;
  83.         -ms-flex-align: center;
  84.             align-items: center;
  85. }
  86.  
  87. .relative-products-part h4 + div {
  88.     padding-bottom: 40px;
  89.     display: none;
  90. }
  91.  
  92. .relative-products-part h4.is-open + div {
  93.     display: block
  94. }
  95.  
  96. .catalog-item-page .complects-list.relative-products-part .production-item .pic {
  97.     width: 100px;
  98.     height: 100px;
  99.     min-width: 100px;
  100.     max-height: 100px;
  101.     max-width: 100px;
  102.     min-height: 100px;
  103.     background-size: cover;
  104.     margin: 0 25px 0 0;
  105. }
  106.  
  107. @width125: 125px;
  108.  
  109. .catalog-item-page .complects-list.relative-products-part .production-item .product-info {
  110.     padding: 0;
  111.     width: 100%;
  112.     height: auto;
  113.     overflow: visible;
  114.     max-width: ~"calc(100% - @{width125})";
  115.     line-height: 1.4;
  116. }
  117.  
  118. .catalog-item-page .complects-list.relative-products-part .production-item .product-info .name {
  119.     font-size: 16px;
  120.     font-weight: 400;
  121.     color: #d91c21;
  122.     margin: 0;
  123.     line-height: 1.4;
  124. }
  125.  
  126. .catalog-item-page .complects-list.relative-products-part .production-item .description {
  127.     height: auto;
  128.     border: none;
  129. }
  130.  
  131. .catalog-item-page .complects-list.relative-products-part .production-item .product-info .text {
  132.     display: none;
  133. }
  134.  
  135. .catalog-item-page .complects-list.relative-products-part .production-item .product-info:after {
  136.     display: none;
  137. }
  138.  
  139. .catalog-item-page .complects-list.relative-products-part .production-item .select2-container {
  140.     margin: 0;
  141.     float: none;
  142.     width: 110px !important;
  143. }
  144.  
  145. .catalog-item-page .complects-list.relative-products-part .production-item .more-block {
  146.     display: none;
  147. }
  148.  
  149. .catalog-item-page .complects-list.relative-products-part .production-item .show-more {
  150.     display: none;
  151. }
  152.  
  153. .catalog-item-page .complects-list.relative-products-part .production-item .show-more + span.show-more {
  154.     display: none;
  155. }
  156.  
  157. .catalog-item-page .complects-list.relative-products-part .production-item  .price {
  158.     display: none;
  159. }
  160.  
  161. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects {
  162.     width: auto;
  163.     margin-left: 25px;
  164.     padding: 0;
  165.     background: none;
  166.     border: none;
  167.     display: -webkit-box;
  168.     display: -webkit-flex;
  169.     display: -ms-flexbox;
  170.     display: flex;
  171.     -ms-align-items: center;
  172.     -webkit-box-align: center;
  173.     -webkit-align-items: center;
  174.         -ms-flex-align: center;
  175.             align-items: center;
  176. }
  177.  
  178. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects span {
  179.     -webkit-box-ordinal-group: -1;
  180.     -webkit-order: -2;
  181.         -ms-flex-order: -2;
  182.             order: -2;
  183.     font-size: 14px;
  184.     color: #000000;
  185.     margin: 0 10px;
  186.     min-width: 35px;
  187.     text-align: left;
  188.     font-weight: 400;
  189.     white-space: nowrap;
  190.     text-transform: none;
  191. }
  192.  
  193. .cart-send-complects span.plus,
  194. .cart-send-complects span.minus {
  195.     display: none;
  196. }
  197.  
  198. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects span.minus {
  199.     -webkit-box-ordinal-group: -4;
  200.     -webkit-order: -5;
  201.         -ms-flex-order: -5;
  202.             order: -5;
  203.     min-width: 34px;
  204.     text-align: center;
  205.     background: #f8d4d4;
  206.     height: 100%;
  207.     min-height: 34px;
  208.     line-height: 34px;
  209.     font-size: 20px;
  210.     color: #d91c21;
  211.     margin: 0;
  212.     font-weight: 500;
  213.     display: inline-block;
  214.     cursor: pointer;
  215. }
  216.  
  217. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects input {
  218.     -webkit-box-ordinal-group: -3;
  219.     -webkit-order: -4;
  220.         -ms-flex-order: -4;
  221.             order: -4;
  222.     font-size: 16px;
  223.     min-width: 50px;
  224.     width: 50px;
  225.     padding: 5px 0;
  226.     text-align: center;
  227.     color: #000000;
  228.     border: none;
  229.     -webkit-border-radius: 0;
  230.             border-radius: 0;
  231.     margin: 0;
  232.     margin-top: -3px;
  233. }
  234.  
  235. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects span.plus {
  236.     -webkit-box-ordinal-group: -2;
  237.     -webkit-order: -3;
  238.         -ms-flex-order: -3;
  239.             order: -3;
  240.     min-width: 34px;
  241.     text-align: center;
  242.     background: #f8d4d4;
  243.     height: 100%;
  244.     min-height: 34px;
  245.     line-height: 34px;
  246.     font-size: 20px;
  247.     color: #d91c21;
  248.     margin: 0;
  249.     font-weight: 500;
  250.     display: inline-block;
  251.     cursor: pointer;
  252. }
  253.  
  254. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects .icon {
  255.     display: none;
  256. }
  257.  
  258. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects a {
  259.     margin: 0;
  260.     font-size: 16px;
  261.     color: #fff;
  262.     font-weight: 400;
  263.     text-transform: none;
  264.     min-width: 120px;
  265.     text-align: center;
  266.     padding: 12px;
  267.     border: 1px solid #d7202a;
  268.     background: #d7202a;
  269.     -webkit-transition: all 0.25s ease-in-out;
  270.     -o-transition: all 0.25s ease-in-out;
  271.     transition: all 0.25s ease-in-out;
  272.     display: block;
  273.     white-space: nowrap;
  274. }
  275.  
  276. .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects a:hover {
  277.     color: #d7202a;
  278.     background: #fff;
  279. }
  280.  
  281. @media screen and (max-width: 992px) {
  282.     .relative-products-part {
  283.         padding: 60px 20px 0;
  284.     }
  285.  
  286.     .relative-products-part .part-title {
  287.         margin-bottom: 40px;
  288.     }
  289. }
  290.  
  291. @width85: 85px;
  292.  
  293. @media screen and (max-width: 767px) {
  294.  
  295.     .relative-products-part {
  296.         padding: 40px 20px 0;
  297.     }
  298.  
  299.     .catalog-item-page .relative-products-part .part-title {
  300.         font-size: 18px !important;
  301.         padding: 0 !important;
  302.         margin-top: 0 !important;
  303.         margin-bottom: 30px !important;
  304.         font-weight: 700 !important;
  305.     }
  306.  
  307.     .catalog-item-page .complects-list.relative-products-part .production-item {
  308.         display: -webkit-box;
  309.         display: -webkit-flex;
  310.         display: -ms-flexbox;
  311.         display: flex;
  312.         -webkit-box-align: center;
  313.         -webkit-align-items: center;
  314.             -ms-flex-align: center;
  315.                 align-items: center;
  316.         -webkit-flex-wrap: wrap;
  317.             -ms-flex-wrap: wrap;
  318.                 flex-wrap: wrap;
  319.     }
  320.  
  321.     .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects {
  322.         margin: 15px 0 0;
  323.         width: 100%;
  324.         -webkit-flex-wrap: wrap;
  325.             -ms-flex-wrap: wrap;
  326.                 flex-wrap: wrap;
  327.     }
  328.  
  329.     .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects a {
  330.         width: 100%;
  331.         margin-top: 20px;
  332.     }
  333.  
  334.     .relative-products-part h4 {
  335.         font-size: 14px;
  336.         line-height: 1.3;
  337.         padding: 10px 10px 10px 55px;
  338.         text-align: left;
  339.     }
  340.  
  341.     .relative-products-part h4:before {
  342.         width: 42px;
  343.     }
  344.  
  345.     .relative-products-part h4:after {
  346.         left: 15px;
  347.     }
  348.  
  349.     .catalog-item-page .complects-list.relative-products-part .production-item .pic {
  350.         width: 70px;
  351.         height: 70px;
  352.         min-width: 70px;
  353.         max-height: 70px;
  354.         max-width: 70px;
  355.         min-height: 70px;
  356.         background-size: cover;
  357.         margin: 0 15px 0 0;
  358.         -webkit-align-self: flex-start;
  359.             -ms-flex-item-align: start;
  360.                 align-self: flex-start;
  361.     }
  362.  
  363.     .catalog-item-page .complects-list.relative-products-part .production-item .product-info .name {
  364.         font-size: 14px;
  365.     }
  366.  
  367.     .catalog-item-page .complects-list.relative-products-part .production-item .product-info {
  368.         /*max-width: calc(100% - 85px);*/
  369.         max-width: ~"calc(100% - @{width85})";
  370.     }
  371.  
  372.     .catalog-item-page .complects-list.relative-products-part .production-item .description {
  373.         margin-top: 20px;
  374.         width: 100% !important;
  375.     }
  376.  
  377.     .catalog-item-page .complects-list.relative-products-part .production-item .select2-container {
  378.         width: 100% !important;
  379.         text-align: center;
  380.         overflow: hidden;
  381.     }
  382.  
  383.     .catalog-item-page .complects-list.relative-products-part .production-item .cart-send-complects input {
  384.         margin-top: 0;
  385.     }
  386.  
  387. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top