API tools faq
paste
Advertisement
max197a

shinglas css

max197a
Dec 11th, 2019
167
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.43 KB | None | 0 0
raw download clone embed print report
  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. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!