/* stylelint-disable no-descending-specificity */ /* stylelint-disable selector-class-pattern */ /** * This file contains the styling for the plugin. * * Please do not make alterations to this file as you * will loose them when updating the plugin. * * This file contents are outlined below. * * 1. Grid system * 2. Containers * 3. Elements * 4. Floatbox * 5. Floating totals box * 6. Validation errors * 7. Lightbox * 8. Datepicker and Timepicker * 9. Checkbox and Radio button * 10. Checkbox and Radio button custom styles * 11. Checkbox and Radio button swatches * 12. Product element * 13. Tooltip * 14. Cart and Order styles * 15. Various styles * 16. Theme fixes * * @package Extra Product Options/CSS * @version 6.0 */ /* 1. Grid system */ :root { --tcgap: 15px; --tcinlinesize: 3em; } .tm-extra-product-options .tc-container, .tc-container { display: block; width: 100%; padding: 0 var(--tcgap); margin: 0; } .tm-extra-product-options .tc-row, .tc-row { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start !important; -moz-box-pack: start !important; -ms-flex-pack: start !important; -webkit-justify-content: flex-start !important; justify-content: flex-start !important; -webkit-box-align: stretch; -moz-box-align: stretch; -ms-flex-align: stretch; -webkit-align-items: stretch; align-items: stretch; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start; margin: 0 calc(-1 * var(--tcgap)); } .tm-extra-product-options .tc-cell, .tc-extra-product-options .tmcp-field-wrap label.tc-cell, .tc-cell { position: relative; padding: 0 var(--tcgap); margin-bottom: var(--tcgap); min-height: 1px; overflow: visible; width: 100%; } .tm-extra-product-options .cpf-section .tc-section-inner-wrap > .tc-row > .tc-cell { margin-bottom: 0; } .cpf-section.tc-cell { margin: calc(var(--tcgap)/2) 0; } .tc-container.nopadding { padding-left: 0; padding-right: 0; } .nomargin .tc-cell { margin: 0; } .tc-row .cpf-section.tc-row { margin: 0; } .tm-extra-product-options .tc-row.tc-col-12, .tm-extra-product-options .tc-row.tc-col-12 .tc-row.tc-col-12 { margin: 0 -1em; min-width: 100% !important; max-width: 100%; overflow: visible; position: relative; } .tm-extra-product-options .tc-col, .tm-extra-product-options .tc-cell.tc-col, .tc-cell.tc-col, .tc-col { -ms-flex-preferred-size: 0; flex-basis: 0; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; } .tm-extra-product-options .tc-col-auto, .tm-extra-product-options .tc-cell.tc-col-auto, .tc-cell.tc-col-auto, .tc-col-auto { -ms-flex: 0 0 auto; flex: 0 0 auto; width: auto; max-width: 100%; } .tm-extra-product-options .tc-col-0, .tm-extra-product-options .tc-cell.tc-col-0, .tc-cell.tc-col-0, .tc-col-0 { -ms-flex: 0 0 0%; flex: 0 0 0%; max-width: 0%; } .tm-extra-product-options .tc-col-1, .tm-extra-product-options .tc-cell.tc-col-1, .tc-cell.tc-col-1, .tc-col-1 { -ms-flex: 0 0 8.3334%; flex: 0 0 8.3334%; max-width: 8.3334%; } .tm-extra-product-options .tc-col-1-5, .tm-extra-product-options .tc-cell.tc-col-1-5, .tc-cell.tc-col-1-5, .tc-col-1-5 { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .tm-extra-product-options .tc-col-2, .tm-extra-product-options .tc-cell.tc-col-2, .tc-cell.tc-col-2, .tc-col-2 { -ms-flex: 0 0 16.6667%; flex: 0 0 16.6667%; max-width: 16.6667%; } .tm-extra-product-options .tc-col-2-5, .tm-extra-product-options .tc-cell.tc-col-2-5, .tc-cell.tc-col-2-5, .tc-col-2-5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tm-extra-product-options .tc-col-3, .tm-extra-product-options .tc-cell.tc-col-3, .tc-cell.tc-col-3, .tc-col-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tm-extra-product-options .tc-col-4, .tm-extra-product-options .tc-cell.tc-col-4, .tc-cell.tc-col-4, .tc-col-4 { -ms-flex: 0 0 33.3334%; flex: 0 0 33.3334%; max-width: 33.3334%; } .tm-extra-product-options .tc-col-4-5, .tm-extra-product-options .tc-cell.tc-col-4-5, .tc-cell.tc-col-4-5, .tc-col-4-5 { -ms-flex: 0 0 37.5%; flex: 0 0 37.5%; max-width: 37.5%; } .tm-extra-product-options .tc-col-5, .tm-extra-product-options .tc-cell.tc-col-5, .tc-cell.tc-col-5, .tc-col-5 { -ms-flex: 0 0 41.6667%; flex: 0 0 41.6667%; max-width: 41.6667%; } .tm-extra-product-options .tc-col-6, .tm-extra-product-options .tc-cell.tc-col-6, .tc-cell.tc-col-6, .tc-col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tm-extra-product-options .tc-col-7, .tm-extra-product-options .tc-cell.tc-col-7, .tc-cell.tc-col-7, .tc-col-7 { -ms-flex: 0 0 58.3334%; flex: 0 0 58.3334%; max-width: 58.3334%; } .tm-extra-product-options .tc-col-7-5, .tm-extra-product-options .tc-cell.tc-col-7-5, .tc-cell.tc-col-7-5, .tc-col-7-5 { -ms-flex: 0 0 62.5%; flex: 0 0 62.5%; max-width: 62.5%; } .tm-extra-product-options .tc-col-8, .tm-extra-product-options .tc-cell.tc-col-8, .tc-cell.tc-col-8, .tc-col-8 { -ms-flex: 0 0 66.6667%; flex: 0 0 66.6667%; max-width: 66.6667%; } .tm-extra-product-options .tc-col-9, .tm-extra-product-options .tc-cell.tc-col-9, .tc-cell.tc-col-9, .tc-col-9 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tm-extra-product-options .tc-col-10, .tm-extra-product-options .tc-cell.tc-col-10, .tc-cell.tc-col-10, .tc-col-10 { -ms-flex: 0 0 83.3334%; flex: 0 0 83.3334%; max-width: 83.3334%; } .tm-extra-product-options .tc-col-10-5, .tm-extra-product-options .tc-cell.tc-col-10-5, .tc-cell.tc-col-10-5, .tc-col-10-5 { -ms-flex: 0 0 87.5%; flex: 0 0 87.5%; max-width: 87.5%; } .tm-extra-product-options .tc-col-11, .tm-extra-product-options .tc-cell.tc-col-11, .tc-cell.tc-col-11, .tc-col-11 { -ms-flex: 0 0 91.6667%; flex: 0 0 91.6667%; max-width: 91.6667%; } .tm-extra-product-options .tc-col-12, .tm-extra-product-options .tc-cell.tc-col-12, .tc-cell.tc-col-12, .tc-col-12 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tm-extra-product-options .tcwidth-1, .tm-extra-product-options .tc-cell.tcwidth-1, .tc-cell.tcwidth-1, .tcwidth-1 { -ms-flex: 0 0 1%; flex: 0 0 1%; max-width: 1%; } .tm-extra-product-options .tcwidth-2, .tm-extra-product-options .tc-cell.tcwidth-2, .tc-cell.tcwidth-2, .tcwidth-2 { -ms-flex: 0 0 2%; flex: 0 0 2%; max-width: 2%; } .tm-extra-product-options .tcwidth-3, .tm-extra-product-options .tc-cell.tcwidth-3, .tc-cell.tcwidth-3, .tcwidth-3 { -ms-flex: 0 0 3%; flex: 0 0 3%; max-width: 3%; } .tm-extra-product-options .tcwidth-4, .tm-extra-product-options .tc-cell.tcwidth-4, .tc-cell.tcwidth-4, .tcwidth-4 { -ms-flex: 0 0 4%; flex: 0 0 4%; max-width: 4%; } .tm-extra-product-options .tcwidth-5, .tm-extra-product-options .tc-cell.tcwidth-5, .tc-cell.tcwidth-5, .tcwidth-5 { -ms-flex: 0 0 5%; flex: 0 0 5%; max-width: 5%; } .tm-extra-product-options .tcwidth-6, .tm-extra-product-options .tc-cell.tcwidth-6, .tc-cell.tcwidth-6, .tcwidth-6 { -ms-flex: 0 0 6%; flex: 0 0 6%; max-width: 6%; } .tm-extra-product-options .tcwidth-7, .tm-extra-product-options .tc-cell.tcwidth-7, .tc-cell.tcwidth-7, .tcwidth-7 { -ms-flex: 0 0 7%; flex: 0 0 7%; max-width: 7%; } .tm-extra-product-options .tcwidth-8, .tm-extra-product-options .tc-cell.tcwidth-8, .tc-cell.tcwidth-8, .tcwidth-8 { -ms-flex: 0 0 8%; flex: 0 0 8%; max-width: 8%; } .tm-extra-product-options .tcwidth-9, .tm-extra-product-options .tc-cell.tcwidth-9, .tc-cell.tcwidth-9, .tcwidth-9 { -ms-flex: 0 0 9%; flex: 0 0 9%; max-width: 9%; } .tm-extra-product-options .tcwidth-10, .tm-extra-product-options .tc-cell.tcwidth-10, .tc-cell.tcwidth-10, .tcwidth-10 { -ms-flex: 0 0 150%; flex: 0 0 10%; max-width: 10%; } .tm-extra-product-options .tcwidth-11, .tm-extra-product-options .tc-cell.tcwidth-11, .tc-cell.tcwidth-11, .tcwidth-11 { -ms-flex: 0 0 11%; flex: 0 0 11%; max-width: 11%; } .tm-extra-product-options .tcwidth-12, .tm-extra-product-options .tc-cell.tcwidth-12, .tc-cell.tcwidth-12, .tcwidth-12 { -ms-flex: 0 0 12%; flex: 0 0 12%; max-width: 12%; } .tm-extra-product-options .tcwidth-12-5, .tm-extra-product-options .tc-cell.tcwidth-12-5, .tc-cell.tcwidth-12-5, .tcwidth-12-5 { -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; } .tm-extra-product-options .tcwidth-13, .tm-extra-product-options .tc-cell.tcwidth-13, .tc-cell.tcwidth-13, .tcwidth-13 { -ms-flex: 0 0 13%; flex: 0 0 13%; max-width: 13%; } .tm-extra-product-options .tcwidth-14, .tm-extra-product-options .tc-cell.tcwidth-14, .tc-cell.tcwidth-14, .tcwidth-14 { -ms-flex: 0 0 14%; flex: 0 0 14%; max-width: 14%; } .tm-extra-product-options .tcwidth-15, .tm-extra-product-options .tc-cell.tcwidth-15, .tc-cell.tcwidth-15, .tcwidth-15 { -ms-flex: 0 0 15%; flex: 0 0 15%; max-width: 15%; } .tm-extra-product-options .tcwidth-16, .tm-extra-product-options .tc-cell.tcwidth-16, .tc-cell.tcwidth-16, .tcwidth-16 { -ms-flex: 0 0 16%; flex: 0 0 16%; max-width: 16%; } .tm-extra-product-options .tcwidth-17, .tm-extra-product-options .tc-cell.tcwidth-17, .tc-cell.tcwidth-17, .tcwidth-17 { -ms-flex: 0 0 17%; flex: 0 0 17%; max-width: 17%; } .tm-extra-product-options .tcwidth-18, .tm-extra-product-options .tc-cell.tcwidth-18, .tc-cell.tcwidth-18, .tcwidth-18 { -ms-flex: 0 0 18%; flex: 0 0 18%; max-width: 18%; } .tm-extra-product-options .tcwidth-19, .tm-extra-product-options .tc-cell.tcwidth-19, .tc-cell.tcwidth-19, .tcwidth-19 { -ms-flex: 0 0 19%; flex: 0 0 19%; max-width: 19%; } .tm-extra-product-options .tcwidth-20, .tm-extra-product-options .tc-cell.tcwidth-20, .tc-cell.tcwidth-20, .tcwidth-20 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .tm-extra-product-options .tcwidth-21, .tm-extra-product-options .tc-cell.tcwidth-21, .tc-cell.tcwidth-21, .tcwidth-21 { -ms-flex: 0 0 21%; flex: 0 0 21%; max-width: 21%; } .tm-extra-product-options .tcwidth-22, .tm-extra-product-options .tc-cell.tcwidth-22, .tc-cell.tcwidth-22, .tcwidth-22 { -ms-flex: 0 0 22%; flex: 0 0 22%; max-width: 22%; } .tm-extra-product-options .tcwidth-23, .tm-extra-product-options .tc-cell.tcwidth-23, .tc-cell.tcwidth-23, .tcwidth-23 { -ms-flex: 0 0 23%; flex: 0 0 23%; max-width: 23%; } .tm-extra-product-options .tcwidth-24, .tm-extra-product-options .tc-cell.tcwidth-24, .tc-cell.tcwidth-24, .tcwidth-24 { -ms-flex: 0 0 24%; flex: 0 0 24%; max-width: 24%; } .tm-extra-product-options .tcwidth-25, .tm-extra-product-options .tc-cell.tcwidth-25, .tc-cell.tcwidth-25, .tcwidth-25 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .tm-extra-product-options .tcwidth-26, .tm-extra-product-options .tc-cell.tcwidth-26, .tc-cell.tcwidth-26, .tcwidth-26 { -ms-flex: 0 0 26%; flex: 0 0 26%; max-width: 26%; } .tm-extra-product-options .tcwidth-27, .tm-extra-product-options .tc-cell.tcwidth-27, .tc-cell.tcwidth-27, .tcwidth-27 { -ms-flex: 0 0 27%; flex: 0 0 27%; max-width: 27%; } .tm-extra-product-options .tcwidth-28, .tm-extra-product-options .tc-cell.tcwidth-28, .tc-cell.tcwidth-28, .tcwidth-28 { -ms-flex: 0 0 28%; flex: 0 0 28%; max-width: 28%; } .tm-extra-product-options .tcwidth-29, .tm-extra-product-options .tc-cell.tcwidth-29, .tc-cell.tcwidth-29, .tcwidth-29 { -ms-flex: 0 0 29%; flex: 0 0 29%; max-width: 29%; } .tm-extra-product-options .tcwidth-30, .tm-extra-product-options .tc-cell.tcwidth-30, .tc-cell.tcwidth-30, .tcwidth-30 { -ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; } .tm-extra-product-options .tcwidth-31, .tm-extra-product-options .tc-cell.tcwidth-31, .tc-cell.tcwidth-31, .tcwidth-31 { -ms-flex: 0 0 31%; flex: 0 0 31%; max-width: 31%; } .tm-extra-product-options .tcwidth-32, .tm-extra-product-options .tc-cell.tcwidth-32, .tc-cell.tcwidth-32, .tcwidth-32 { -ms-flex: 0 0 32%; flex: 0 0 32%; max-width: 32%; } .tm-extra-product-options .tcwidth-33, .tm-extra-product-options .tc-cell.tcwidth-33, .tc-cell.tcwidth-33, .tcwidth-33 { -ms-flex: 0 0 33.3333333332%; flex: 0 0 33.3333333332%; max-width: 33.3333333332%; } .tm-extra-product-options .tcwidth-34, .tm-extra-product-options .tc-cell.tcwidth-34, .tc-cell.tcwidth-34, .tcwidth-34 { -ms-flex: 0 0 34%; flex: 0 0 34%; max-width: 34%; } .tm-extra-product-options .tcwidth-35, .tm-extra-product-options .tc-cell.tcwidth-35, .tc-cell.tcwidth-35, .tcwidth-35 { -ms-flex: 0 0 35%; flex: 0 0 35%; max-width: 35%; } .tm-extra-product-options .tcwidth-36, .tm-extra-product-options .tc-cell.tcwidth-36, .tc-cell.tcwidth-36, .tcwidth-36 { -ms-flex: 0 0 36%; flex: 0 0 36%; max-width: 36%; } .tm-extra-product-options .tcwidth-37, .tm-extra-product-options .tc-cell.tcwidth-37, .tc-cell.tcwidth-37, .tcwidth-37 { -ms-flex: 0 0 37%; flex: 0 0 37%; max-width: 37%; } .tm-extra-product-options .tcwidth-37-5, .tm-extra-product-options .tc-cell.tcwidth-37-5, .tc-cell.tcwidth-37-5, .tcwidth-37-5 { -ms-flex: 0 0 37.5%; flex: 0 0 37.5%; max-width: 37.5%; } .tm-extra-product-options .tcwidth-38, .tm-extra-product-options .tc-cell.tcwidth-38, .tc-cell.tcwidth-38, .tcwidth-38 { -ms-flex: 0 0 38%; flex: 0 0 38%; max-width: 38%; } .tm-extra-product-options .tcwidth-39, .tm-extra-product-options .tc-cell.tcwidth-39, .tc-cell.tcwidth-39, .tcwidth-39 { -ms-flex: 0 0 39%; flex: 0 0 39%; max-width: 39%; } .tm-extra-product-options .tcwidth-40, .tm-extra-product-options .tc-cell.tcwidth-40, .tc-cell.tcwidth-40, .tcwidth-40 { -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; } .tm-extra-product-options .tcwidth-41, .tm-extra-product-options .tc-cell.tcwidth-41, .tc-cell.tcwidth-41, .tcwidth-41 { -ms-flex: 0 0 41%; flex: 0 0 41%; max-width: 41%; } .tm-extra-product-options .tcwidth-42, .tm-extra-product-options .tc-cell.tcwidth-42, .tc-cell.tcwidth-42, .tcwidth-42 { -ms-flex: 0 0 42%; flex: 0 0 42%; max-width: 42%; } .tm-extra-product-options .tcwidth-43, .tm-extra-product-options .tc-cell.tcwidth-43, .tc-cell.tcwidth-43, .tcwidth-43 { -ms-flex: 0 0 43%; flex: 0 0 43%; max-width: 43%; } .tm-extra-product-options .tcwidth-44, .tm-extra-product-options .tc-cell.tcwidth-44, .tc-cell.tcwidth-44, .tcwidth-44 { -ms-flex: 0 0 44%; flex: 0 0 44%; max-width: 44%; } .tm-extra-product-options .tcwidth-45, .tm-extra-product-options .tc-cell.tcwidth-45, .tc-cell.tcwidth-45, .tcwidth-45 { -ms-flex: 0 0 45%; flex: 0 0 45%; max-width: 45%; } .tm-extra-product-options .tcwidth-46, .tm-extra-product-options .tc-cell.tcwidth-46, .tc-cell.tcwidth-46, .tcwidth-46 { -ms-flex: 0 0 46%; flex: 0 0 46%; max-width: 46%; } .tm-extra-product-options .tcwidth-47, .tm-extra-product-options .tc-cell.tcwidth-47, .tc-cell.tcwidth-47, .tcwidth-47 { -ms-flex: 0 0 47%; flex: 0 0 47%; max-width: 47%; } .tm-extra-product-options .tcwidth-48, .tm-extra-product-options .tc-cell.tcwidth-48, .tc-cell.tcwidth-48, .tcwidth-48 { -ms-flex: 0 0 48%; flex: 0 0 48%; max-width: 48%; } .tm-extra-product-options .tcwidth-49, .tm-extra-product-options .tc-cell.tcwidth-49, .tc-cell.tcwidth-49, .tcwidth-49 { -ms-flex: 0 0 49%; flex: 0 0 49%; max-width: 49%; } .tm-extra-product-options .tcwidth-50, .tm-extra-product-options .tc-cell.tcwidth-50, .tc-cell.tcwidth-50, .tcwidth-50 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .tm-extra-product-options .tcwidth-51, .tm-extra-product-options .tc-cell.tcwidth-51, .tc-cell.tcwidth-51, .tcwidth-51 { -ms-flex: 0 0 51%; flex: 0 0 51%; max-width: 51%; } .tm-extra-product-options .tcwidth-52, .tm-extra-product-options .tc-cell.tcwidth-52, .tc-cell.tcwidth-52, .tcwidth-52 { -ms-flex: 0 0 52%; flex: 0 0 52%; max-width: 52%; } .tm-extra-product-options .tcwidth-53, .tm-extra-product-options .tc-cell.tcwidth-53, .tc-cell.tcwidth-53, .tcwidth-53 { -ms-flex: 0 0 53%; flex: 0 0 53%; max-width: 53%; } .tm-extra-product-options .tcwidth-54, .tm-extra-product-options .tc-cell.tcwidth-54, .tc-cell.tcwidth-54, .tcwidth-54 { -ms-flex: 0 0 54%; flex: 0 0 54%; max-width: 54%; } .tm-extra-product-options .tcwidth-55, .tm-extra-product-options .tc-cell.tcwidth-55, .tc-cell.tcwidth-55, .tcwidth-55 { -ms-flex: 0 0 55%; flex: 0 0 55%; max-width: 55%; } .tm-extra-product-options .tcwidth-56, .tm-extra-product-options .tc-cell.tcwidth-56, .tc-cell.tcwidth-56, .tcwidth-56 { -ms-flex: 0 0 56%; flex: 0 0 56%; max-width: 56%; } .tm-extra-product-options .tcwidth-57, .tm-extra-product-options .tc-cell.tcwidth-57, .tc-cell.tcwidth-57, .tcwidth-57 { -ms-flex: 0 0 57%; flex: 0 0 57%; max-width: 57%; } .tm-extra-product-options .tcwidth-58, .tm-extra-product-options .tc-cell.tcwidth-58, .tc-cell.tcwidth-58, .tcwidth-58 { -ms-flex: 0 0 58%; flex: 0 0 58%; max-width: 58%; } .tm-extra-product-options .tcwidth-59, .tm-extra-product-options .tc-cell.tcwidth-59, .tc-cell.tcwidth-59, .tcwidth-59 { -ms-flex: 0 0 59%; flex: 0 0 59%; max-width: 59%; } .tm-extra-product-options .tcwidth-60, .tm-extra-product-options .tc-cell.tcwidth-60, .tc-cell.tcwidth-60, .tcwidth-60 { -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%; } .tm-extra-product-options .tcwidth-61, .tm-extra-product-options .tc-cell.tcwidth-61, .tc-cell.tcwidth-61, .tcwidth-61 { -ms-flex: 0 0 61%; flex: 0 0 61%; max-width: 61%; } .tm-extra-product-options .tcwidth-62, .tm-extra-product-options .tc-cell.tcwidth-62, .tc-cell.tcwidth-62, .tcwidth-62 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 62%; } .tm-extra-product-options .tcwidth-62-5, .tm-extra-product-options .tc-cell.tcwidth-62-5, .tc-cell.tcwidth-62-5, .tcwidth-62-5 { -ms-flex: 0 0 62.5%; flex: 0 0 62.5%; max-width: 62.5%; } .tm-extra-product-options .tcwidth-63, .tm-extra-product-options .tc-cell.tcwidth-63, .tc-cell.tcwidth-63, .tcwidth-63 { -ms-flex: 0 0 63%; flex: 0 0 63%; max-width: 63%; } .tm-extra-product-options .tcwidth-64, .tm-extra-product-options .tc-cell.tcwidth-64, .tc-cell.tcwidth-64, .tcwidth-64 { -ms-flex: 0 0 64%; flex: 0 0 64%; max-width: 64%; } .tm-extra-product-options .tcwidth-65, .tm-extra-product-options .tc-cell.tcwidth-65, .tc-cell.tcwidth-65, .tcwidth-65 { -ms-flex: 0 0 65%; flex: 0 0 65%; max-width: 65%; } .tm-extra-product-options .tcwidth-66, .tm-extra-product-options .tc-cell.tcwidth-66, .tc-cell.tcwidth-66, .tcwidth-66 { -ms-flex: 0 0 66.6666666665%; flex: 0 0 66.6666666665%; max-width: 66.6666666665%; } .tm-extra-product-options .tcwidth-67, .tm-extra-product-options .tc-cell.tcwidth-67, .tc-cell.tcwidth-67, .tcwidth-67 { -ms-flex: 0 0 67%; flex: 0 0 67%; max-width: 67%; } .tm-extra-product-options .tcwidth-68, .tm-extra-product-options .tc-cell.tcwidth-68, .tc-cell.tcwidth-68, .tcwidth-68 { -ms-flex: 0 0 68%; flex: 0 0 68%; max-width: 68%; } .tm-extra-product-options .tcwidth-69, .tm-extra-product-options .tc-cell.tcwidth-69, .tc-cell.tcwidth-69, .tcwidth-69 { -ms-flex: 0 0 69%; flex: 0 0 69%; max-width: 69%; } .tm-extra-product-options .tcwidth-70, .tm-extra-product-options .tc-cell.tcwidth-70, .tc-cell.tcwidth-70, .tcwidth-70 { -ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%; } .tm-extra-product-options .tcwidth-71, .tm-extra-product-options .tc-cell.tcwidth-71, .tc-cell.tcwidth-71, .tcwidth-71 { -ms-flex: 0 0 71%; flex: 0 0 71%; max-width: 71%; } .tm-extra-product-options .tcwidth-72, .tm-extra-product-options .tc-cell.tcwidth-72, .tc-cell.tcwidth-72, .tcwidth-72 { -ms-flex: 0 0 72%; flex: 0 0 72%; max-width: 72%; } .tm-extra-product-options .tcwidth-73, .tm-extra-product-options .tc-cell.tcwidth-73, .tc-cell.tcwidth-73, .tcwidth-73 { -ms-flex: 0 0 73%; flex: 0 0 73%; max-width: 73%; } .tm-extra-product-options .tcwidth-74, .tm-extra-product-options .tc-cell.tcwidth-74, .tc-cell.tcwidth-74, .tcwidth-74 { -ms-flex: 0 0 74%; flex: 0 0 74%; max-width: 74%; } .tm-extra-product-options .tcwidth-75, .tm-extra-product-options .tc-cell.tcwidth-75, .tc-cell.tcwidth-75, .tcwidth-75 { -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%; } .tm-extra-product-options .tcwidth-76, .tm-extra-product-options .tc-cell.tcwidth-76, .tc-cell.tcwidth-76, .tcwidth-76 { -ms-flex: 0 0 76%; flex: 0 0 76%; max-width: 76%; } .tm-extra-product-options .tcwidth-77, .tm-extra-product-options .tc-cell.tcwidth-77, .tc-cell.tcwidth-77, .tcwidth-77 { -ms-flex: 0 0 77%; flex: 0 0 77%; max-width: 77%; } .tm-extra-product-options .tcwidth-78, .tm-extra-product-options .tc-cell.tcwidth-78, .tc-cell.tcwidth-78, .tcwidth-78 { -ms-flex: 0 0 78%; flex: 0 0 78%; max-width: 78%; } .tm-extra-product-options .tcwidth-79, .tm-extra-product-options .tc-cell.tcwidth-79, .tc-cell.tcwidth-79, .tcwidth-79 { -ms-flex: 0 0 79%; flex: 0 0 79%; max-width: 79%; } .tm-extra-product-options .tcwidth-80, .tm-extra-product-options .tc-cell.tcwidth-80, .tc-cell.tcwidth-80, .tcwidth-80 { -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%; } .tm-extra-product-options .tcwidth-81, .tm-extra-product-options .tc-cell.tcwidth-81, .tc-cell.tcwidth-81, .tcwidth-81 { -ms-flex: 0 0 81%; flex: 0 0 81%; max-width: 81%; } .tm-extra-product-options .tcwidth-82, .tm-extra-product-options .tc-cell.tcwidth-82, .tc-cell.tcwidth-82, .tcwidth-82 { -ms-flex: 0 0 82%; flex: 0 0 82%; max-width: 82%; } .tm-extra-product-options .tcwidth-83, .tm-extra-product-options .tc-cell.tcwidth-83, .tc-cell.tcwidth-83, .tcwidth-83 { -ms-flex: 0 0 83%; flex: 0 0 83%; max-width: 83%; } .tm-extra-product-options .tcwidth-84, .tm-extra-product-options .tc-cell.tcwidth-84, .tc-cell.tcwidth-84, .tcwidth-84 { -ms-flex: 0 0 84%; flex: 0 0 84%; max-width: 84%; } .tm-extra-product-options .tcwidth-85, .tm-extra-product-options .tc-cell.tcwidth-85, .tc-cell.tcwidth-85, .tcwidth-85 { -ms-flex: 0 0 85%; flex: 0 0 85%; max-width: 85%; } .tm-extra-product-options .tcwidth-86, .tm-extra-product-options .tc-cell.tcwidth-86, .tc-cell.tcwidth-86, .tcwidth-86 { -ms-flex: 0 0 86%; flex: 0 0 86%; max-width: 86%; } .tm-extra-product-options .tcwidth-87, .tm-extra-product-options .tc-cell.tcwidth-87, .tc-cell.tcwidth-87, .tcwidth-87 { -ms-flex: 0 0 87%; flex: 0 0 87%; max-width: 87%; } .tm-extra-product-options .tcwidth-87-5, .tm-extra-product-options .tc-cell.tcwidth-87-5, .tc-cell.tcwidth-87-5, .tcwidth-87-5 { -ms-flex: 0 0 87.5%; flex: 0 0 87.5%; max-width: 87.5%; } .tm-extra-product-options .tcwidth-88, .tm-extra-product-options .tc-cell.tcwidth-88, .tc-cell.tcwidth-88, .tcwidth-88 { -ms-flex: 0 0 88%; flex: 0 0 88%; max-width: 88%; } .tm-extra-product-options .tcwidth-89, .tm-extra-product-options .tc-cell.tcwidth-89, .tc-cell.tcwidth-89, .tcwidth-89 { -ms-flex: 0 0 89%; flex: 0 0 89%; max-width: 89%; } .tm-extra-product-options .tcwidth-90, .tm-extra-product-options .tc-cell.tcwidth-90, .tc-cell.tcwidth-90, .tcwidth-90 { -ms-flex: 0 0 90%; flex: 0 0 90%; max-width: 90%; } .tm-extra-product-options .tcwidth-91, .tm-extra-product-options .tc-cell.tcwidth-91, .tc-cell.tcwidth-91, .tcwidth-91 { -ms-flex: 0 0 91%; flex: 0 0 91%; max-width: 91%; } .tm-extra-product-options .tcwidth-92, .tm-extra-product-options .tc-cell.tcwidth-92, .tc-cell.tcwidth-92, .tcwidth-92 { -ms-flex: 0 0 92%; flex: 0 0 92%; max-width: 92%; } .tm-extra-product-options .tcwidth-93, .tm-extra-product-options .tc-cell.tcwidth-93, .tc-cell.tcwidth-93, .tcwidth-93 { -ms-flex: 0 0 93%; flex: 0 0 93%; max-width: 93%; } .tm-extra-product-options .tcwidth-94, .tm-extra-product-options .tc-cell.tcwidth-94, .tc-cell.tcwidth-94, .tcwidth-94 { -ms-flex: 0 0 94%; flex: 0 0 94%; max-width: 94%; } .tm-extra-product-options .tcwidth-95, .tm-extra-product-options .tc-cell.tcwidth-95, .tc-cell.tcwidth-95, .tcwidth-95 { -ms-flex: 0 0 95%; flex: 0 0 95%; max-width: 95%; } .tm-extra-product-options .tcwidth-96, .tm-extra-product-options .tc-cell.tcwidth-96, .tc-cell.tcwidth-96, .tcwidth-96 { -ms-flex: 0 0 96%; flex: 0 0 96%; max-width: 96%; } .tm-extra-product-options .tcwidth-97, .tm-extra-product-options .tc-cell.tcwidth-97, .tc-cell.tcwidth-97, .tcwidth-97 { -ms-flex: 0 0 97%; flex: 0 0 97%; max-width: 97%; } .tm-extra-product-options .tcwidth-98, .tm-extra-product-options .tc-cell.tcwidth-98, .tc-cell.tcwidth-98, .tcwidth-98 { -ms-flex: 0 0 98%; flex: 0 0 98%; max-width: 98%; } .tm-extra-product-options .tcwidth-99, .tm-extra-product-options .tc-cell.tcwidth-99, .tc-cell.tcwidth-99, .tcwidth-99 { -ms-flex: 0 0 99%; flex: 0 0 99%; max-width: 99%; } .tm-extra-product-options .tcwidth-100, .tm-extra-product-options .tc-cell.tcwidth-100, .tc-cell.tcwidth-100, .tcwidth-100 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } /* 2. Containers */ .tc-extra-product-options { visibility: hidden; } .tc-extra-product-options.tc-show, .tc-extra-product-options.tc-show-override { display: block; clear: both; visibility: visible; } .tc-extra-product-options.tc-show-hidden { display: block; clear: both; visibility: hidden !important; } .tm-extra-product-options, .tm-extra-product-options .tm-extra-product-options-fields, .tm-extra-product-options .tc-element-container, .tm-extra-product-options .tmcp-ul-wrap, .tm-extra-product-options .tmcp-field, .tm-extra-product-options .tm-epo-field, .tm-extra-product-options li.tmcp-field-wrap, .tm-extra-product-options .tc-cell, .tm-extra-product-options .tc-row, .tm-collapse, .tm-collapse-wrap, .tc-epo-label, .tm-show-picker-value, .tm-bsbb, .tm-bsbb-all, .tm-bsbb-all *, .tc-container, .tc-row, .tc-cell, .tm-box, .flasho, .flasho div, .tm-button, .tm-epo-style, .tc-lightbox img, .tm-extra-product-options .radio-image, .tm-extra-product-options .checkbox-image { box-sizing: border-box; } .tm-extra-product-options { max-width: 100%; width: 100%; } .tm-extra-product-options .tc-element-container, .tm-extra-product-options .tmcp-ul-wrap { overflow: visible; float: left; max-width: 100%; width: 100%; margin-bottom: 0; } .tm-extra-product-options .tm-extra-product-options-fields, .tm-extra-product-options .tmcp-ul-wrap { clear: both; list-style: none outside none; margin: 0; padding: 0; } .tm-extra-product-options .tc-repeater-element, .tc-repeater-delete, .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap, .tc-field-display { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; justify-content: center; } .tm-extra-product-options .tc-repeater-element, .tc-repeater-delete { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .tm-extra-product-options .tc-repeater-element { margin-bottom: 0.5em; align-items: flex-start; } .tm-extra-product-options .tc-repeater-element .tmcp-ul-wrap { flex-grow: 1; flex-basis: 0; width: auto; } .tc-repeater-delete { flex-grow: 0; flex-basis: 0; width: auto; padding: 0 4px; align-self: center; } .tc-price-wrap { padding: 0 0.5em; align-self: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .tm-extra-product-options .tmcp-ul-wrap + .tmcp-ul-wrap { margin: 0.5em 0 0 0; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap .tc-field-display { width: 100%; list-style: none outside none !important; position: relative; -webkit-box-pack: start; -moz-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-box-align: start; -moz-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap { padding: 0; margin: 0 0 0.5em 0; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap > label, .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap > .tc-price-wrap, .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap .tc-inline-description, .tm-extra-product-options ul.tmcp-ul-wrap .tc-field-display > label, .tm-extra-product-options ul.tmcp-ul-wrap .tc-field-display > .tc-price-wrap, .tm-extra-product-options ul.tmcp-ul-wrap .tc-field-display .tc-inline-description { flex-grow: 0; } .tc-extra-product-options .cpf-type-multiple_file_upload ul.tmcp-ul-wrap li.tmcp-field-wrap > label.fullwidth, .tc-extra-product-options .cpf-type-upload ul.tmcp-ul-wrap li.tmcp-field-wrap > label.fullwidth, .tc-extra-product-options .cpf-type-time .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-date .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-textfield .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-textarea .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-product .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-select .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-selectmultiple .tmcp-field-wrap label.fullwidth, .tc-extra-product-options .cpf-type-time .tc-field-display label.fullwidth, .tc-extra-product-options .cpf-type-date .tc-field-display label.fullwidth, .tc-extra-product-options .cpf-type-textfield .tc-field-display label.fullwidth, .tc-extra-product-options .cpf-type-textarea .tc-field-display label.fullwidth, .tc-extra-product-options .cpf-type-product .tc-field-display label.fullwidth, .tc-extra-product-options .cpf-type-select .tc-field-display label.fullwidth, .tc-extra-product-options .cpf-type-selectmultiple .tc-field-display label.fullwidth, .tm-extra-product-options .cpf-type-variations .tmcp-field-wrap label.fullwidth { flex-grow: 1; } .tc-epo-element-product-li-container, .tc-inline-description { width: 100%; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap:last-child { margin: 0; } .tc-totals-form { clear: both; display: none; width: 100%; } .tc-totals-form.tc-show { display: block; } .tm-epo-totals { clear: both; padding-bottom: 1em; padding-top: 1em; } .tm-epo-totals:empty { display: none; } .tc-epo-totals.hidden, .tc-extra-product-options.hidden { display: none; } html .tc-extra-product-options .tc-hidden.tc-cell, .tc-hidden, .tm-hidden, .tc-extra-product-options input.use_images, .tm-extra-product-options input.use_images { display: none !important; } .tm-box, .tm-collapse { border: 1px solid rgba(0, 0, 0, 0.035); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.01) 0%, rgba(0, 0, 0, 0.01) 50%, rgba(0, 0, 0, 0.02) 50%, rgba(0, 0, 0, 0.01) 100%); margin: 0 var(--tcgap); width: 100%; padding: var(--tcgap) 0; max-width: calc(100% - (2 * var(--tcgap))); } .tc-extra-product-options .tm-box .tc-cell:last-child { margin-bottom: 0 !important; } .tm-extra-product-options .cpf-section.tc-cell .tm-box > .tc-cell { margin-bottom: 0; } .tm-extra-product-options .cpf-section.tc-cell.tm-owl-slider-section .tm-box .tc-row { padding-bottom: var(--tcgap); } .tm-arrow { cursor: pointer; font-size: 14px; height: 1.5em; line-height: 1.5 !important; margin-top: -0.75em; position: absolute; right: var(--tcgap); text-align: center; top: 50%; width: 1.5em; } .tm-toggle { padding-right: 2em; position: relative; cursor: pointer; } .tm-collapse .tm-toggle { clear: both; } .tm-collapse { float: left; } .tm-collapse > .tc-cell { margin-bottom: 0; } .tm-collapse-wrap { float: left; margin-top: 1em; overflow: visible; width: 100%; } .tc-totals-form dl.tm-extra-product-options-totals { margin-left: 0; margin-right: 0; } .tm-extra-product-options .tm-box .tm-section-label, .tm-extra-product-options .tm-collapse .tm-section-label, .tm-extra-product-options .tm-box .tc-epo-label.tm-section-label, .tm-extra-product-options .tm-collapse .tc-epo-label.tm-section-label { margin: 0; position: relative; width: 100%; padding-bottom: var(--tcgap); border: 0; outline: 0; } .tc-repeater-wrap { margin-top: 1em; } /* 3. Elements */ /* Required indicator */ .tmperiod { margin: 0 0.5em; } .tm-epo-required { color: #f00; } .tmcp-field-wrap .tm-epo-required { position: static; left: auto; top: auto; } /* Element containers and labels */ label.tm-epo-field-label { align-self: center; } .tc-epo-element-product-thumbnailmultiple label.tm-epo-field-label, .tc-epo-element-product-thumbnail label.tm-epo-field-label, .tc-mode-images label.tm-epo-field-label, .tc-mode-color label.tm-epo-field-label { align-self: flex-start; } .tc-epo-label.tm-left { order: 0; } .tc-epo-label.tm-right { order: 99; } .tm-extra-product-options ul.tm-extra-product-options-fields li::before, .tm-extra-product-options ul.tm-extra-product-options-fields li::after, .tm-extra-product-options ul.tmcp-ul-wrap li::before, .tm-extra-product-options ul.tmcp-ul-wrap li::after { display: none; } .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-radio li.tmcp-field-wrap label { margin: 0; } .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap .tm-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-radio li.tmcp-field-wrap .tm-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-variations li.tmcp-field-wrap .tm-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-product li.tmcp-field-wrap.tc-epo-element-product-radio .tm-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-product li.tmcp-field-wrap.tc-epo-element-product-checkbox .tm-label { padding: 0 0 0 0.5em !important; margin: 0 !important; line-height: 1 !important; display: inline !important; vertical-align: middle; } .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap .tm-label.tc-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-radio li.tmcp-field-wrap .tm-label.tc-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-variations li.tmcp-field-wrap .tm-label.tc-label { vertical-align: initial; } .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap .tm-label:empty, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-radio li.tmcp-field-wrap .tm-label:empty, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-variations li.tmcp-field-wrap .tm-label:empty { padding: 0 !important; } .tm-extra-product-options .tm-extra-product-options-field { clear: both; padding: 0; } .tm-extra-product-options .tm-extra-product-options-field.tc-normal-mode { margin: 0 0 1em; } .tm-extra-product-options .tc-active .tc-label-wrap, .tm-extra-product-options li.tmcp-field-wrap.tc-active .tc-label.tm-label, .tm-extra-product-options li.tmcp-field-wrap.tc-active .price.tc-price .amount, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-radio li.tmcp-field-wrap label input[type="radio"]:checked ~ .tc-label, .tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap label input[type="checkbox"]:checked ~ .tc-label { font-weight: 700; background: none !important; } .tc-extra-product-options .tmcp-field-wrap label, .tm-epo-variation-section .tmhexcolorimage-li-nowh label, .tm-epo-variation-section .tmhexcolorimage-li label { padding: 0; display: inline-block; float: none; max-width: 100%; width: auto; overflow-wrap: break-word; } .tc-extra-product-options .cpf-type-product .tmcp-field-wrap label.fullwidth select, .tc-extra-product-options .cpf-type-select .tmcp-field-wrap label.fullwidth select, .tc-extra-product-options .cpf-type-selectmultiple .tmcp-field-wrap label.fullwidth select, .tc-extra-product-options .cpf-type-time .tmcp-field-wrap label.fullwidth .tm-epo-field, .tc-extra-product-options .cpf-type-date .tmcp-field-wrap label.fullwidth .tm-epo-field, .tc-extra-product-options .cpf-type-textfield .tmcp-field-wrap label.fullwidth .tm-epo-field { width: 100%; } .tc-extra-product-options .cpf-type-textarea .tmcp-field-wrap label.fullwidth .tm-epo-field { width: 100% !important; /* Disable user manually changing width. */ } .tm-extra-product-options .tc-images-container .tmcp-field-wrap label, .tm-extra-product-options .tc-colors-container .tmcp-field-wrap label, .tm-epo-variation-section .tmhexcolorimage-li-nowh label, .tm-epo-variation-section .tmhexcolorimage-li label { cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -ms-user-select: none; -moz-user-select: none; user-select: none; width: 100%; } .tm-extra-product-options ul.tmcp-ul-wrap.tc-colors-container li.tmcp-field-wrap.tc-mode-startimages, .tm-extra-product-options ul.tmcp-ul-wrap.tc-images-container li.tmcp-field-wrap.tc-mode-startimages, .tm-extra-product-options ul.tmcp-ul-wrap.tc-colors-container .tc-field-display.tc-mode-startimages, .tm-extra-product-options ul.tmcp-ul-wrap.tc-images-container .tc-field-display.tc-mode-startimages { -ms-flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; } .tm-extra-product-options ul.tmcp-ul-wrap.tc-colors-container li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tc-images-container li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tc-colors-container .tc-field-display, .tm-extra-product-options ul.tmcp-ul-wrap.tc-images-container .tc-field-display { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; align-items: center; justify-content: center; } /* Divider element */ .tm-extra-product-options .tc-cell hr { margin: 1em 0; } .tm-extra-product-options .cpf-element hr.tc-cell { margin: 1em var(--tcgap); } .tm-extra-product-options .tm_divider { border-style: solid; border-width: 1px; margin: 1em 0; clear: both; } .tm-extra-product-options .cpf-element .tm_divider.tc-cell { margin: 1em var(--tcgap); } .tm-extra-product-options .tm_padding { padding: 1em 0; } .tm-extra-product-options .cpf-element .tm_padding.tc-cell { margin-left: var(--tcgap); margin-right: var(--tcgap); } /* Textarea element */ .tm-extra-product-options textarea.tm-epo-field { height: auto; width: 100%; max-width: 100%; } /* Textfield element */ .tm-extra-product-options .tmcp-textfield.tm-epo-field { width: auto; max-width: 100%; } /* Checkboxes and radio button elements */ .tm-extra-product-options .tm-epo-field.tmcp-checkbox, .tm-extra-product-options .tm-epo-field.tmcp-radio { margin: 0 !important; position: relative; vertical-align: middle; float: none; width: auto; } .tm-extra-product-options .tc-epo-label { display: block; position: relative; float: none; width: 100%; margin-bottom: 0; } .tm-extra-product-options .tc-epo-label.tm-section-label { margin: 0.5em 0; } .float-editbox .section_popup .tm-section-label { display: none; } /* Select box element */ .tm-epo-field.tmcp-select { max-width: 100%; display: initial; } /* Upload element */ .tm-extra-product-options input.tm-epo-field.tmcp-upload { width: 100%; font-size: inherit; } .tc-extra-product-options .tmcp-field-wrap .cpf-upload-text { width: 100%; display: inline-block; text-align: center; } .tc-upload-preview { display: -ms-grid; display: grid; margin: 1em 0; width: 100%; gap: 1em; grid-template-columns: minmax(100px, max-content); grid-template-rows: 1fr; } .tc-upload-preview:empty { display: none; } .tc-upload-preview.multiple { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); } .tc-upload-file { -webkit-border-radius: 5px; border-radius: 5px; padding: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; margin: 0; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .tc-upload-preview.multiple .tc-upload-file { max-height: 100%; min-height: 100px; } .tc-upload-image { position: relative; border: 1px solid; padding: 2%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-border-radius: 5px; border-radius: 5px; background: rgba(0, 0, 0, 0.7); min-width: 100%; min-height: 100px; } .tc-upload-preview.multiple .tc-upload-image { min-height: 100%; } .woocommerce .tc-upload-preview img { height: auto; max-width: 100%; width: auto; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid rgba(0, 0, 0, 0.1); padding: 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .woocommerce .tc-upload-preview.multiple img { height: 96%; width: 96%; object-fit: scale-down; max-height: 100%; position: absolute; } .tc-file-size { position: absolute; color: #fff; font-size: 0.625em; top: calc(2% + 0.5078125em); left: calc(2% + 0.5078125em); background: rgba(0, 0, 0, 0.5); padding: 0 3px; z-index: 1; } .tc-file-ext-overlay { background: rgba(0, 0, 0, 0.2); width: 96%; height: 96%; position: absolute; border-radius: 5px 12px 5px 5px; box-sizing: border-box; left: 2%; top: 2%; } .tc-file-ext { position: absolute; padding: 2px; background: rgba(0, 0, 0, 0.5); color: #fff; min-width: 30%; text-align: center; text-transform: uppercase; font-size: 0.825em; } .tc-file-name { max-width: 94%; position: absolute; color: #fff; background: rgba(0, 0, 0, 0.5); bottom: 0; font-size: 0.625em; padding: 0.25em 0.5em; text-overflow: ellipsis; overflow: hidden; max-height: 2em; line-height: 2; } .tc-upload-remove { cursor: pointer; position: absolute; right: 2%; top: 2%; font-size: 1em; width: 1.625em; height: 1.625em; font-family: inherit; line-height: inherit; margin: 0; padding: 0; border: none; outline: none; color: #fff; -webkit-border-radius: 50%; border-radius: 50%; background-color: rgba(0, 0, 0, 0.5); background-image: none; -webkit-box-shadow: 0 0 0 0 hsl(0deg 0% 100% / 0%); box-shadow: 0 0 0 0 hsl(0deg 0% 100% / 0%); z-index: 2; -webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; } .tc-upload-remove:hover, .tc-upload-remove:focus { -webkit-box-shadow: 0 0 0 0.125em rgb(255 255 255 / 90%); box-shadow: 0 0 0 0.125em rgb(255 255 255 / 90%); background: rgba(0, 0, 0, 0.5); color: #fff; } .tc-upload-remove svg { width: 100%; height: 100%; font-size: inherit; -webkit-box-sizing: inherit; box-sizing: inherit; line-height: inherit; } .tc-extra-product-options .tmcp-field-wrap label.cpf-upload-container-basic .cpf-upload-wrap { display: block !important; padding: 1em 0; position: relative; vertical-align: middle; cursor: pointer; } .tc-extra-product-options .tmcp-field-wrap label.cpf-upload-container .cpf-upload-wrap { border: 1px solid; display: block !important; font-size: 1em; height: auto; overflow: hidden; padding: 0.5em 1em; position: relative; vertical-align: middle; margin: 0 0.5em 0 0; cursor: pointer; } .cpf-upload-container-basic + .tc-price-wrap { align-self: flex-start; padding-top: 1em; } .cpf-upload-container + .tc-price-wrap, .cpf-upload-container + .tm-filename + .tc-price-wrap { align-self: flex-start; padding-top: 0.5em !important; } .cpf-upload-container [type="file"] { cursor: inherit; display: block; font-size: 0.01px; min-height: 100%; min-width: 100%; opacity: 0; position: absolute; right: 0; text-align: right; top: 0; } .cpf-upload-container + small::before, .cpf-upload-container-basic + small::before { content: ""; display: block; } .tm-filename { display: block; align-self: flex-start; padding: 0.5em 1em; } .tm-filename:empty { display: none; } .tc-upload-messages { padding: 1em 2em; } .tc-upload-message { font-size: 1.2em; margin-bottom: 1em; } /* Range picker element */ .cpf-type-range .tc-epo-label.tm-left + .tc-element-container, .cpf-type-range .tc-epo-label.tm-right + .tc-element-container { width: 66% !important; padding-top: 5px; } .cpf-type-range .tc-epo-label.tm-left, .cpf-type-range .tc-epo-label.tm-right { margin-top: 5px; } .tmcp-ul-wrap.tmcp-elements.tm-extra-product-options-range { clear: both; position: relative; } .tm-range-picker { margin: 2em 10px; max-width: 100%; width: auto; flex: 1 1 auto; } .tm-range-picker.pips { margin: 50px var(--tcgap); } .tc-extra-product-options .tm-show-picker-left, .tc-extra-product-options .tm-show-picker-tleft, .tc-extra-product-options .tm-show-picker-right, .tc-extra-product-options .tm-show-picker-tright { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: start; -moz-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify !important; -moz-box-pack: justify !important; -ms-flex-pack: justify !important; -webkit-justify-content: space-between !important; justify-content: space-between !important; } .tc-extra-product-options .tm-show-picker-left .tm-range-picker, .tc-extra-product-options .tm-show-picker-tleft .tm-range-picker, .tc-extra-product-options .tm-show-picker-right .tm-range-picker, .tc-extra-product-options .tm-show-picker-tright .tm-range-picker { order: 1; } .tc-extra-product-options .tm-show-picker-left .tm-show-picker-value, .tc-extra-product-options .tm-show-picker-tleft .tm-show-picker-value, .tc-extra-product-options .tm-show-picker-right .tm-show-picker-value, .tc-extra-product-options .tm-show-picker-tright .tm-show-picker-value { flex: 0 1 auto; position: relative; text-align: center; font-size: 0.8em; order: 2; min-width: 2em; } .tc-extra-product-options .tm-show-picker-left .tm-show-picker-value, .tc-extra-product-options .tm-show-picker-tleft .tm-show-picker-value { order: 0; } .tc-extra-product-options .tm-show-picker-left .tc-price-wrap, .tc-extra-product-options .tm-show-picker-tleft .tc-price-wrap, .tc-extra-product-options .tm-show-picker-right .tc-price-wrap, .tc-extra-product-options .tm-show-picker-tright .tc-price-wrap { order: 10; } .tm-extra-product-options .tmcp-ul-wrap.tmcp-elements.tm-extra-product-options-range .tm-range-picker-value { display: inline-block; float: right; margin-left: 0; margin-top: -3px; position: absolute; right: 0; text-align: center; top: 1em; vertical-align: top; width: 19%; } .tm-extra-product-options .cpf-type-range .tmcp-field-wrap span.amount { display: inline-block; padding: 6px 0 0; } input.tm-show-picker-value-edit { max-width: 100%; width: 98%; text-align: center; padding: 0; border: 1px solid; margin: 0; } .tm-show-picker-value-edit-wrap { box-sizing: border-box; } .tc-extra-product-options .tm-show-picker-left .tm-show-picker-value-edit-wrap, .tc-extra-product-options .tm-show-picker-tleft .tm-show-picker-value-edit-wrap, .tc-extra-product-options .tm-show-picker-right .tm-show-picker-value-edit-wrap, .tc-extra-product-options .tm-show-picker-tright .tm-show-picker-value-edit-wrap { max-width: 20%; flex: 0 0 20%; position: relative; text-align: center; top: 2em; font-size: 0.8em; order: 2; } .tc-extra-product-options .tm-show-picker-left .tm-show-picker-value-edit-wrap, .tc-extra-product-options .tm-show-picker-tleft .tm-show-picker-value-edit-wrap { order: 0; } /* Variation element */ .tm-extra-product-options .tc-epo-label.tm-has-undo-button { padding-right: 2em; } .tm-epo-reset-variation, .tm-extra-product-options .tm-epo-reset-radio { text-align: center; cursor: pointer; position: absolute; right: 0; top: 0; width: 1em; height: 1em; line-height: 1; padding: 0.2em; border: 2px solid #000; color: #000; border-radius: 100%; box-sizing: content-box !important; background: #fff; } .tm-epo-reset-variation .tcfa, .tm-epo-reset-radio .tcfa { font-size: 0.8em; top: -0.05em; position: relative; } .tm-epo-variation-section .reset_variations { clear: both; display: block; width: 100%; position: static; visibility: hidden; } /* Element prices */ .tm-extra-product-options .tmcp-field-wrap .tc-price { font-size: 1em !important; width: auto !important; display: inline-block !important; float: none !important; margin: 0 !important; padding: 0 !important; } .tc-extra-product-options .tmcp-field-wrap .price.tc-price, .after-amount, .before-amount { font-size: 1em !important; background: none !important; line-height: 1 !important; vertical-align: middle; } .tc-extra-product-options .tmcp-field-wrap .price.tc-price .amount { font-size: 1em !important; display: inline !important; background: none !important; } .tm-extra-product-options .tmcp-field-wrap .tc-chars + .tc-price .amount { margin-left: 0; } .tm-extra-product-options .tc-images-container .tmcp-field-wrap .amount { margin-left: 0; } .tm-extra-product-options .amount.hidden, .tm-extra-product-options .tmcp-field-wrap .price.amount.hidden, .tm-extra-product-options .tmcp-field-wrap .tc-price.hidden, .tm-extra-product-options .before-amount.hidden, .tm-extra-product-options .after-amount.hidden, .tm-extra-product-options .tmperiod.hidden { display: none !important; } .tm-extra-product-options .cpf-type-textarea .tmcp-field-wrap .amount, .tm-extra-product-options .cpf-type-textfield .tmcp-field-wrap .amount { margin-left: 0; } /* Final Totals box */ .tm-extra-product-options-totals .price.amount.options, .tm-extra-product-options-totals .price.amount.fees, .tm-extra-product-options-totals .price.amount.subscription-fee { font-size: 1.25em; } .tm-extra-product-options-totals .amount { background: none; } .tm-extra-product-options-totals .amount.options, .tm-extra-product-options-totals .amount.fees, .tm-extra-product-options-totals .amount.subscription-fee { font-weight: 700; } .tm-extra-product-options-totals .amount.final { font-size: 1.5em; font-weight: 700; } .tm-extra-product-options-totals .price.amount { display: inline-block !important; width: auto; } .tm-unit-price, .tm-fee-totals, .tm-final-totals, .tm-options-totals, .tm-subscription-fee { padding: 0; margin: 0; border: 0 none; float: none; } .tm-extra-product-options .tmcp-field-wrap .tc-price del { font-size: 75% !important; margin: 0 !important; } .tm-extra-product-options .tmcp-field-wrap .price:empty { display: none !important; } /* Quantity selector */ .tc-quantity-right .tm-quantity, .tc-quantity-left .tm-quantity { align-self: center; } .tc-row.tc-quantity-right, .tc-row.tc-quantity-left { -ms-flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; } .tc-quantity-right .tm-quantity, .tc-quantity-bottom .tm-quantity { order: 99; } .tc-quantity-left .tm-quantity, .tc-quantity-top .tm-quantity { order: 0; } .tc-quantity-left .tc-field-display, .tc-quantity-top .tc-field-display { order: 1; } .tc-row.tc-quantity-top, .tc-row.tc-quantity-bottom { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .tc-row.tc-quantity-top .tm-quantity, .tc-row.tc-quantity-bottom .tm-quantity { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .tm-quantity { min-width: 60px; text-align: center; } .tm-quantity input.tm-qty { margin: 0; max-width: 100%; min-width: 50px; text-align: center; width: 5em; } .tm-quantity-alt input.tm-qty-alt { margin: 0; max-width: 100%; min-width: 50px; text-align: center; width: 5em !important; font-size: 100%; display: inline-block !important; padding: 0.358em 1em; } .tc-extra-product-options .cpf-type-product .tc-epo-element-product-li-container .tc-epo-element-product-container .single_add_to_cart_product, .single_add_to_cart_product { vertical-align: baseline; float: none; } .tc-row.tc-quantity-right .tc-cell, .tc-row.tc-quantity-left .tc-cell, .tm-quantity.tm-bottom { margin-bottom: 0; } /* Description */ .tm-description p:last-child { margin-bottom: 0 !important; } .tm-description { clear: both; } .tm-section-description { padding: var(--tcgap); margin: 0 calc(-1 * var(--tcgap)); } /* 4. Floatbox */ .fl-overlay { background: #f5f5f5; position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%; z-index: 101000; } .flasho.tm-color { background: #ecf0f1 none repeat scroll 0 0; border: 1px solid #bdc3c7; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2); left: 0; max-height: 100%; max-width: 100%; position: absolute; top: 0; z-index: 101; } .flasho.tm-color .float-editbox { background: #fff none repeat scroll 0 0; bottom: 55px; left: 0; padding: 0; position: absolute; right: 0; top: 57px; width: 100%; } .flasho.tm-color .header { background: #ecf0f1 none repeat scroll 0 0; border-bottom: 1px solid #ecf0f1; left: 0; line-height: 30px; padding: 1em 2em; position: absolute; top: 0; width: 100%; } .flasho.tm-color .footer { bottom: 0; height: 55px; left: 0; margin: 0; padding: 0; position: absolute; text-align: right; width: 100%; z-index: 2; } .flasho.tm-color .footer .inner { background: #ecf0f1 none repeat scroll 0 0; border-top: 1px solid #ecf0f1; line-height: 30px; padding: 1em 2em; } .flasho.tm-color .tc-progress-info-content { bottom: 0; display: inline-block; font-size: 2em; height: 1em; left: 0; line-height: 1; margin: auto; position: absolute; right: 0; text-align: center; top: 0; width: auto; } .flasho.tm-color .tc-progress-info { height: 100%; position: relative; width: 100%; } .flasho { font: 13px/1.5em HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif; background: rgba(0, 0, 0, 0.2); border: 1px solid transparent; left: 0; position: absolute; top: 0; z-index: 101001; box-shadow: 0 1px 15px 1px rgba(0, 0, 0, 0.2); } .float-editbox { background: #fff; bottom: 55px; left: 0; overflow: auto; overflow-x: hidden; overflow-y: auto; padding: 0; position: absolute; right: 0; top: 56px; width: 100%; } .flasho .header { background: none repeat scroll 0 0 #fafafa; border-bottom: 1px solid transparent; left: 0; line-height: 30px; padding: 1em 2em; position: absolute; top: 0; width: 100%; transform: none !important; } .flasho .header h3 { color: #292421; font-size: 20px; line-height: 30px; margin: 0; letter-spacing: 1px; } .flasho .footer { bottom: 0; height: 56px; left: 0; margin: 0; padding: 0; position: absolute; text-align: right; width: 100%; z-index: 2; display: block; } .flasho .footer .inner { background: none repeat scroll 0 0 #fafafa; border-top: 1px solid transparent; line-height: 30px; padding: 12px 2em; } .tm-section-pop { display: none; } .tm-section-pop-up { height: 80%; left: 10% !important; position: fixed !important; top: 10% !important; width: 80%; } #tm-section-pop-up > .tc-epo-label.tm-section-label { display: none; } .tm-section-pop-up.single .tc-cell.section_popup { width: 100% !important; } .tm-section-pop-up.single .tc-cell.section_popup .tm-section-pop { padding-top: 1em; padding-bottom: 1em; } .tm-extra-product-options.tm-section-pop-up.single .footer .inner .tm-button.button.button-secondary.button-large.floatbox-cancel, .tc-extra-product-options .tm-section-pop-up.single .footer .inner .tm-button.button.button-secondary.button-large.floatbox-cancel { float: none; } .noanimated { -webkit-animation-fill-mode: none !important; animation-fill-mode: none !important; opacity: 1 !important; z-index: auto !important; position: static !important; -webkit-transform: none !important; -moz-transform: none !important; -ms-transform: none !important; transform: none !important; } /* 5. Floating totals box */ .tm-floating-box { width: auto; height: auto; padding: 1em; position: fixed; right: 0; top: 0; bottom: 0; left: 0; background: rgba(255, 255, 255, 0.5); z-index: 9999; max-height: 100%; overflow: hidden; } .tm-floating-box .tm-unit-price, .tm-floating-box .tm-final-totals, .tm-floating-box .tm-options-totals, .tm-floating-box .tm-fee-totals { margin: 0.5em 0; } .tm-floating-box.right { left: auto; right: 0; } .tm-floating-box.left { right: auto; left: 0; } .tm-floating-box.bottom { bottom: 0; top: auto; } .tm-floating-box.top { top: 0; bottom: auto; } .tc-img-floating { display: block; height: 50px !important; margin: 1em 0; width: auto !important; } .tm-fb { font-size: 12px; line-height: 10px; max-height: 200px; max-width: 200px; overflow-y: auto; overflow-x: hidden; } .tm-fb dt { display: block; margin: 0; padding-bottom: 5px; } .tm-fb dd { display: block; border-bottom: 1px dotted rgba(0, 0, 0, 0.1); margin: 0 0 1em; } .tm-floating-box-alt .tm-floating-box { background: none; padding: 0; position: static; } .tm-floating-box-nks .tm-floating-box { bottom: 0 !important; left: 0 !important; padding: 5%; position: absolute !important; right: 0 !important; top: 0 !important; width: 100%; } .tm-floating-box-nks .tm-fb { max-height: 90% !important; max-width: 90% !important; } .tc-row.tm-fb-labels { border-bottom: 1px solid; font-weight: 700; margin-bottom: 1.65em; } /* 6. Validation errors */ .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap label.tm-error, .tm-extra-product-options ul.tmcp-ul-wrap + .tm-error, .tm-extra-product-options .tc-element-container > .tm-error { color: #f00; display: block !important; font-size: 80%; font-weight: 700; padding: 0 !important; margin: 1em 0 !important; } .tm-extra-product-options .tc-cell.tm-error { color: #f00; display: block; font-size: 80%; font-weight: 700; margin: 1em 0 !important; } .tm-epo-field.tmcp-textfield.tm-error, .tm-epo-field.tmcp-textarea.tm-error { border: 1px solid #c0392b; color: #e74c3c; outline: 0; } /* 7. Lightbox */ .tc-transition { -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .tc-lightbox { background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0; height: auto !important; left: 50% !important; max-height: 100% !important; max-width: 100% !important; position: fixed; text-align: center; top: 50% !important; -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: auto !important; z-index: 100100; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; } .tc-lightbox-image-wrap { position: relative; overflow: hidden; } .tm-extra-product-options .tc-lightbox-image-wrap .radio-image, .tm-extra-product-options .tc-lightbox-image-wrap .checkbox-image { float: left; padding: 0; } .tc-lightbox-wrap { position: absolute; right: 0; bottom: 0; width: 1em; height: 1em; left: auto; top: auto; font-size: 1.5em; } .tc-lightbox-button { background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0; top: 0; color: #fff; font-size: 1em !important; padding: 0; position: absolute; right: 0; z-index: 2; opacity: 0.5; cursor: zoom-in; margin: auto; bottom: 0; left: 0; } .tc-lightbox-wrap:hover .tc-lightbox-button { opacity: 1; } .tc-lightbox img { border: 0 none; cursor: zoom-out; display: block; height: auto; line-height: 0; margin: 0; padding: 0; position: relative; width: auto; } .tc-lightbox-button-close { background: rgba(255, 255, 255, 0.3) none repeat scroll 0 0; color: #000 !important; float: left; height: 2em; line-height: 2; position: absolute; right: 0; text-align: center; top: 0; width: 2em; z-index: 2; cursor: pointer; } @-webkit-keyframes tc-lightbox-zoomin { 0% { opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%) scale(0.3); transform: translateX(-50%) translateY(-50%) scale(0.3); } 50% { opacity: 1; } } @keyframes tc-lightbox-zoomin { 0% { opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%) scale(0.3); transform: translateX(-50%) translateY(-50%) scale(0.3); } 50% { opacity: 1; } } .tc-lightbox-zoomin { -webkit-animation-name: tc-lightbox-zoomin; animation-name: tc-lightbox-zoomin; } @-webkit-keyframes tc-lightbox-zoomout { 0% { opacity: 1; -webkit-transform: translateX(-50%) translateY(-50%) scale(1); transform: translateX(-50%) translateY(-50%) scale(1); } 50% { opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%) scale(0.3); transform: translateX(-50%) translateY(-50%) scale(0.3); } 100% { opacity: 0; } } @keyframes tc-lightbox-zoomout { 0% { opacity: 1; -webkit-transform: translateX(-50%) translateY(-50%) scale(1); transform: translateX(-50%) translateY(-50%) scale(1); } 50% { opacity: 0; -webkit-transform: translateX(-50%) translateY(-50%) scale(0.3); transform: translateX(-50%) translateY(-50%) scale(0.3); } 100% { opacity: 0; } } .tc-lightbox-zoomout { -webkit-animation-name: tc-lightbox-zoomout; animation-name: tc-lightbox-zoomout; } /* 8. Datepicker and Timepicker*/ .tm-static { position: static; } .tmcp-date-select { max-width: 100%; } .tm-extra-product-options-date .tmcp-field-wrap label { display: inline-block !important; margin-right: 6px; vertical-align: baseline; position: relative; max-width: 100%; } .tm-epo-field.tmcp-date { min-height: 2.5em !important; height: auto; } .tc-extra-product-options .cpf-type-date .tmcp-field-wrap label:not(.fullwidth) .tm-epo-field.tmcp-date { width: auto !important; } .tm-epo-datepicker-label-container, .tm-epo-timepicker-label-container { display: inline-block !important; margin-right: 6px; vertical-align: baseline; position: relative; max-width: 100%; } .tm-extra-product-options .tm-epo-datepicker, .tm-extra-product-options .tm-epo-timepicker { display: inline-block !important; line-height: normal !important; margin: 0 -2.5em 0 0 !important; max-width: 100% !important; padding-right: 2.5em !important; box-shadow: none; } .tc-epo-label.tm-left + .tc-element-container .tm-epo-datepicker-label-container, .tc-epo-label.tm-right + .tc-element-container .tm-epo-datepicker-label-container { margin-top: 0; } /* datepicker skin */ .tm-extra-product-options .tm-extra-product-options-date .ui-tm-datepicker-trigger, .tm-extra-product-options .tm-extra-product-options-time .ui-tm-datepicker-trigger { font-family: tc-fontawesome, sans-serif !important; box-shadow: none; border-radius: 0; background: transparent none repeat scroll 0 0 !important; border-width: 0 0 0 1px; color: inherit !important; cursor: pointer; display: inline-block; font-size: inherit !important; line-height: inherit !important; margin: 0; padding: 0 0.75em !important; position: absolute; right: 0; top: 0; height: 100% !important; min-width: 0; } .tm-extra-product-options .tm-extra-product-options-date .ui-tm-datepicker-trigger:hover, .tm-extra-product-options .tm-extra-product-options-date .ui-tm-datepicker-trigger:active, .tm-extra-product-options .tm-extra-product-options-date .ui-tm-datepicker-trigger:focus, .tm-extra-product-options .tm-extra-product-options-time .ui-tm-datepicker-trigger:hover, .tm-extra-product-options .tm-extra-product-options-time .ui-tm-datepicker-trigger:active, .tm-extra-product-options .tm-extra-product-options-time .ui-tm-datepicker-trigger:focus { background: none repeat scroll 0 0 transparent; box-shadow: none; } .tm-extra-product-options .tm-extra-product-options-date .ui-tm-datepicker-trigger::before { content: "\f073"; } .tm-extra-product-options .tm-extra-product-options-time .ui-tm-datepicker-trigger::before { content: "\f017"; } .tm-datepicker { margin: 2px 0 0 0; z-index: 101002 !important; width: auto !important; height: auto !important; padding: 0; } .tm-datepicker a { text-decoration: none; } .tm-ui-dp, .tm-ui-dp-overlay { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .tm-ui-dp-header.ui-widget-header { line-height: 2; background: none; border: 0 none; color: inherit; font-weight: 700; } .tm-ui-dp { max-width: 98%; position: absolute; top: 0; left: 0; z-index: 2; text-shadow: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -ms-touch-action: none; user-select: none; } .tm-ui-dp:focus { outline: 0; } .tm-ui-dp-container { min-width: 300px; overflow: hidden; text-align: center; font-size: 16px; } .tm-datepicker-small .tm-ui-dp-container { font-size: 12px; min-width: 240px; } .tm-datepicker-medium .tm-ui-dp-container { font-size: 16px; min-width: 330px; } .tm-datepicker-large .tm-ui-dp-container { font-size: 20px; min-width: 400px; } .tm-datepicker.tm-datepicker-top .tm-ui-dp-title, .tm-datepicker.tm-datepicker-bottom .tm-ui-dp-title { font-size: 1.125em; } .tm-datepicker.tm-datepicker-bottom .tm-ui-dp-container, .tm-datepicker.tm-datepicker-top .tm-ui-dp-container { min-width: 100% !important; } .tm-ui-dp-wrap, .tm-ui-dp-overlay { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .tm-ui-dp-wrap { z-index: 99998; } .tm-ui-dp-overlay { z-index: 1; background: rgba(0, 0, 0, 0.7); } .tm-datepicker-top .tm-ui-dp, .tm-datepicker-bottom .tm-ui-dp { width: 100%; max-width: 100%; } .tm-ui-dp-main-cell-inner { position: relative; height: 100%; overflow: hidden; text-overflow: ellipsis; } .tm-ui-dp-main-wrap { -webkit-backface-visibility: hidden; backface-visibility: hidden; } .tm-ui-dp-ui { display: inline-block; vertical-align: middle; width: 100%; } .tm-ui-dp-main { width: auto; } .tm-ui-dp-main table { width: 100%; height: 100%; border-collapse: collapse; table-layout: fixed; margin: 0; background: none; } .tm-ui-dp-main-table { height: 100%; width: 100%; display: table; table-layout: fixed; } .tm-ui-dp-main-row { white-space: nowrap; display: table-row; } .tm-ui-dp-main-cell { line-height: 1.875; text-align: center; width: 14.2857%; height: 16.6666%; position: relative; display: table-cell; vertical-align: middle; cursor: pointer; } .tm-ui-dp-main-cell.ui-datepicker-unselectable, .tm-ui-dp-main-cell.ui-state-disabled { cursor: default; } .tm-ui-dp-main-cell .tm-ui-dp-main-cell-inner { overflow: visible; } .tm-ui-dp-main-cell-content { position: relative; z-index: 2; padding: 5px; } .tm-datepicker .tm-ui-dp-main-wrap { padding: 0.5em; } .tm-datepicker .tm-ui-dp-main-header th { font-size: 0.6875em; font-weight: 400; line-height: 2.225; text-align: center; border: 0; } .tm-datepicker .tm-ui-dp-main-cell-content { font-size: 0.8125em; } .tm-ui-dp-inner-container, .tm-ui-dp-main-wrap, .tm-ui-dp-main-content { position: relative; } .tm-datepicker.tm-datepicker-bottom, .tm-datepicker.tm-datepicker-top { bottom: 0 !important; height: 100% !important; left: 0 !important; position: fixed !important; right: 0 !important; top: 0 !important; width: 100% !important; margin: 0 !important; background: transparent !important; border: 0 none !important; } .tm-datepicker.tm-datepicker-bottom .tm-ui-dp { bottom: 0; top: auto; } .tm-datepicker.tm-datepicker-top .tm-ui-dp { top: 0; bottom: auto; } .tm-datepicker .ui-tm-datepicker-prev, .tm-datepicker .ui-tm-datepicker-next, .tm-datepicker.tm-datepicker-bottom .ui-tm-datepicker-prev, .tm-datepicker.tm-datepicker-top .ui-tm-datepicker-prev, .tm-datepicker.tm-datepicker-bottom .ui-tm-datepicker-next, .tm-datepicker.tm-datepicker-top .ui-tm-datepicker-next { display: none !important; } .tm-ui-dp-title { position: relative; font-size: 1em; } .tm-ui-dp-title .tm-ui-dp-month, .tm-ui-dp-title .tm-ui-dp-year { display: block; overflow: hidden; text-overflow: ellipsis; margin: 0 2em; white-space: nowrap; } .tm-ui-dp-title-button { width: 50%; display: inline-block; white-space: nowrap; vertical-align: top; position: relative; height: 2em; } .tm-ui-dp-button-prev { left: 0; } .tm-ui-dp-button-next { right: 0; } .tm-ui-dp-button { margin: 0; position: absolute; top: 0; width: 2em; overflow: hidden; display: block; text-decoration: none; white-space: nowrap; text-overflow: ellipsis; vertical-align: top; height: 2em; line-height: 2; color: #4eccc4; text-transform: uppercase; padding: 0; } .tm-ui-dp-button .tm-ui-dp-button-arrow, .tm-ui-dp-month, .tm-ui-dp-year { cursor: pointer; } .tm-datepicker .tm-ui-dp-button-arrow { color: #4eccc4; font-size: 1em; line-height: 2; overflow: hidden; width: 2em; } .tm-ui-dp-button-arrow::before { display: block; } .tm-ui-dp-buttonpane { display: block; overflow: hidden; padding: 0 0.5em 0.5em; text-align: right; width: 100%; } .tm-ui-dp-btn-wrap { display: block; float: right; position: relative; vertical-align: top; z-index: 5; } .tm-ui-dp-btn { height: 2.5em; line-height: 2.5; padding: 0 1em; text-transform: uppercase; cursor: pointer; display: block; overflow: hidden; text-decoration: none; text-overflow: ellipsis; vertical-align: top; white-space: nowrap; } .tm-ui-dp-button-disabled { opacity: 0.3; cursor: default; } /* datepicker skins */ /* epo black skin */ .tm-ui-skin-epo-black .tm-ui-dp-container { font-family: Helvetica, Arial, sans-serif !important; border: 1px solid #000 !important; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2); background: #000 none repeat scroll 0 0; background: rgba(0, 0, 0, 0.9) none repeat scroll 0 0; color: #fff; } /* normal cell text*/ .tm-ui-skin-epo-black .tm-ui-dp-main-cell .ui-state-default { color: #ecf0f1; } .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-other-month .ui-state-default { color: #777; } /* selected day */ .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-current-day, .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-current-day:hover { background-color: #1abc9c; } .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-current-day .ui-state-default, .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-current-day:hover .ui-state-default { color: #fff; } .tm-ui-skin-epo-black .tm-ui-dp-main-cell:hover { background-color: #fff; } .tm-ui-skin-epo-black .tm-ui-dp-main-cell:hover .ui-state-default { color: #000; } /* unselectable cell text*/ .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-unselectable .ui-state-default, .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-state-disabled .ui-state-default { color: #222; } /* disabled and unselectable cell*/ .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-datepicker-unselectable, .tm-ui-skin-epo-black .tm-ui-dp-main-cell.ui-state-disabled { background-color: #000; background-color: rgba(255, 255, 255, 0.02); } .tm-ui-skin-epo-black .tm-ui-dp-btn { color: #1abc9c; } .tm-ui-skin-epo-black .tm-ui-dp-btn:hover { color: #fff; } .tm-ui-skin-epo-black .tm-ui-dp-button-arrow, .tm-ui-skin-epo-black .tm-ui-dp-button-arrow.tm-ui-dp-button-disabled:hover { color: #1abc9c; } .tm-ui-skin-epo-black .tm-ui-dp-button-arrow:hover { color: #fff; } .tm-ui-skin-epo-black .tm-ui-dp-main-header { color: #1abc9c; border-bottom: 1px solid #1abc9c; } /* epo white skin */ .tm-ui-skin-epo.tm-datepicker .tm-ui-dp-main-wrap { padding: 0; } .tm-ui-skin-epo .tm-ui-dp-container { font-family: Helvetica, Arial, sans-serif !important; border: 1px solid #ddd !important; box-shadow: 0 1px 10px rgba(0, 0, 0, 0.2); background: #fff none repeat scroll 0 0; color: #2c3e50; } /* normal cell text*/ .tm-ui-skin-epo .tm-ui-dp-main-cell .ui-state-default { color: #2c3e50; background: none; border: 0 none; } .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-tm-datepicker-other-month .ui-state-default { color: #aaa; } /* current day cell text*/ .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-tm-datepicker-current-day .ui-state-default { color: #0a0; } /* normal cell text in other month */ .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-other-month .ui-state-default { color: #95a5a6; } /* selected day */ .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-current-day, .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-current-day:hover { background-color: #9b59b6; } .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-current-day .ui-state-default, .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-current-day:hover .ui-state-default { color: #fff; } /* cell hover */ .tm-ui-skin-epo .tm-ui-dp-main-cell:hover { background-color: #ecf0f1; } .tm-ui-skin-epo .tm-ui-dp-main-cell:hover .ui-state-default { color: #000; } /* unselectable cell text*/ .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-unselectable .ui-state-default, .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-state-disabled .ui-state-default { color: #eee; } /* disabled and unselectable cell*/ .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-datepicker-unselectable, .tm-ui-skin-epo .tm-ui-dp-main-cell.ui-state-disabled { background-color: #fff; } .tm-ui-skin-epo .tm-ui-dp-btn { color: #2c3e50; } .tm-ui-skin-epo .tm-ui-dp-btn:hover { color: #8e44ad; } .tm-ui-skin-epo .tm-ui-dp-button-arrow, .tm-ui-skin-epo .tm-ui-dp-button-arrow.tm-ui-dp-button-disabled:hover { color: #2c3e50; } .tm-ui-skin-epo .tm-ui-dp-button-arrow:hover { color: #34495e; } .tm-ui-skin-epo .tm-ui-dp-main-header { background: #f9f9f9 none repeat scroll 0 0; border-bottom: 1px solid #eee; border-top: 1px solid #eee; color: #7f8c8d; padding: 0.25em 0; } .tm-ui-skin-epo .tm-ui-dp-title { padding: 0.5em 0; } .ui-tm-timepicker-div .tm-ui-widget-header, .ui-tm-timepicker-div .ui_tpicker_time_label, .tm-timepicker .tm-ui-dp-current { display: none; } .tm-timepicker .ui-tm-timepicker-div .ui-slider-handle { border-radius: 100%; background: #ecf0f1; border: 1px solid #bdc3c7; cursor: default; height: 1.2em; position: absolute; width: 1.2em; z-index: 2; } .tm-timepicker .ui-tm-timepicker-div .ui-slider-handle.ui-state-hover { background: #fff; } .ui-tm-timepicker-div .ui-slider { position: relative; } .ui-tm-timepicker-div .ui-slider.ui-slider-horizontal { border-color: #aaa; border-image: none; border-radius: 0; border-style: solid; border-width: 0 0 1px; height: 1px; margin: 1em 0; padding: 0.2em 0 0; } .ui-tm-timepicker-div .ui-slider.ui-slider-horizontal .ui-slider-handle { margin-left: -0.6em; top: -0.3em; } .ui-tm-timepicker-div .ui-widget-header { margin-bottom: 8px; } .ui-tm-timepicker-div dl { text-align: left; margin: 0; } .ui-tm-timepicker-div dl dt { clear: left; float: left; margin: 0.725em 0 0; padding: 0; } .ui-tm-timepicker-div dl dd { display: block; margin: 0 1em 0.5em 30%; padding: 1px 0; float: none; } .ui-tm-timepicker-div td { font-size: 90%; } .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; } .ui-tm-timepicker-div .ui_tpicker_unit_hide { display: none; } .ui-tm-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: 0 none; width: 95%; } .ui-tm-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; } .ui-tm-timepicker-rtl { direction: rtl; } .ui-tm-timepicker-rtl dl { text-align: right; } .ui-tm-timepicker-rtl dl dt { float: right; clear: right; } .ui-tm-timepicker-rtl dl dd { margin: 0 30% 0.5em 1em; } /* Shortened version style */ .ui-tm-timepicker-div.ui-tm-timepicker-oneLine { padding-right: 2px; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine .ui_tpicker_time, .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dt { display: none; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl { text-align: right; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl dd, .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl dd > div { display: inline-block; margin: 0; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl dd.ui_tpicker_minute::before, .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl dd.ui_tpicker_second::before { content: ":"; display: inline-block; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl dd.ui_tpicker_millisec::before, .ui-tm-timepicker-div.ui-tm-timepicker-oneLine dl dd.ui_tpicker_microsec::before { content: "."; display: inline-block; } .ui-tm-timepicker-div.ui-tm-timepicker-oneLine .ui_tpicker_unit_hide, .ui-tm-timepicker-div.ui-tm-timepicker-oneLine .ui_tpicker_unit_hide::before { display: none; } .ui-tm-timepicker-div { padding: 1em 1em 0; } .tm-ui-tp-title { padding: 0.5em 0; } /* 9. Checkbox and Radio button */ .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-radiostart, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-radioend, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-radio, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-color, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-image, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-text, .tm-extra-product-options ul.tmcp-ul-wrap.tm-element-ul-checkbox, .tm-extra-product-options ul.tmcp-ul-wrap.tm-element-ul-radio { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: stretch !important; align-items: stretch; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start !important; -moz-box-pack: start !important; -ms-flex-pack: start !important; -webkit-justify-content: flex-start !important; justify-content: flex-start !important; float: none; max-width: none; width: auto; box-sizing: border-box; margin: 0 calc(-0.5 * var(--tcgap)); } .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-radiostart li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-radioend li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-radio li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-color li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-image li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-text li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-element-ul-checkbox li.tmcp-field-wrap, .tm-extra-product-options ul.tmcp-ul-wrap.tm-element-ul-radio li.tmcp-field-wrap { padding: calc(0.5 * var(--tcgap)); -ms-flex: 0 0 100%; flex: 0 0 100%; margin: 0; } .tc-label-wrap { display: inline; } .tc-mode-images .tc-label-wrap, .tc-mode-color .tc-label-wrap { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-epo-text-wrapper, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.radio-image, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.checkbox-image, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.radio-image, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.checkbox-image { border-color: inherit; border-width: 1px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3); } .tm-extra-product-options .radio-image, .tm-extra-product-options .checkbox-image { border: 0 solid transparent; display: inline-block !important; height: auto; width: auto; margin: auto; max-width: 100%; padding: 0; pointer-events: none !important; vertical-align: middle; } .radio-image-label, .checkbox-image-label { display: block; text-align: center; padding: 1em 0; line-height: 1.5; width: 100%; } .tc-label.tm-label .radio-image-label, .tc-label.tm-label .checkbox-image-label { display: inline; margin-right: 0.5em; } .tc-label.tm-label .radio-image-label:empty, .tc-label.tm-label .checkbox-image-label:empty { margin-right: 0; } .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startcolor, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endcolor, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startimages, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endimages { text-align: initial; -webkit-box-pack: start; -moz-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startcolor .checkbox-image, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endcolor .checkbox-image, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startcolor .radio-image, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endcolor .radio-image { width: var(--tcinlinesize) !important; padding-top: var(--tcinlinesize) !important; } .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startimages .checkbox-image, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endimages .checkbox-image, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startimages .radio-image, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endimages .radio-image { max-height: var(--tcinlinesize) !important; align-self: flex-start; margin: 0; } .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startcolor .tm-epo-field-label, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endcolor .tm-epo-field-label, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startimages .tm-epo-field-label, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endimages .tm-epo-field-label { width: auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; flex-wrap: wrap; } .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startcolor .tc-field-display, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endcolor .tc-field-display, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startimages .tc-field-display, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endimages .tc-field-display { -webkit-box-pack: start; -moz-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startcolor .tc-label-wrap, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endcolor .tc-label-wrap, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-startimages .tc-label-wrap, .tm-extra-product-options ul.tmcp-elements li.tmcp-field-wrap.tc-mode-endimages .tc-label-wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; align-items: center; flex-wrap: wrap; } .tc-mode-startimages .tc-label-wrap { justify-content: space-around; flex-wrap: nowrap !important; } li.tmcp-field-wrap.tm-per-row.is-separator { -ms-flex: 0 0 100% !important; flex: 0 0 100% !important; max-width: 100% !important; } .tm-extra-product-options .is-separator { gap: 1em; } .tm-extra-product-options .is-separator .tc-label-wrap.tc-separator { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex: 1 1 0; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap.is-separator .tc-label.tm-label { padding: 0 !important; width: 100%; } .tm-extra-product-options .is-separator .tc-tooltip { flex: 0 1 0; margin: 0; } /* 10. Checkbox and Radio button custom styles */ .tc-epo-style-wrapper + .tmhexcolorimage, .tc-epo-style-wrapper + .tc-label-wrap .tmhexcolorimage:first-child { margin: 0 0.5em; vertical-align: middle; } .tc-epo-style-wrapper input[type="checkbox"], .tc-epo-style-wrapper input[type="radio"] { opacity: 0; display: inline !important; } .tc-epo-style-wrapper input[type="checkbox"]:checked + .tm-epo-style::after, .tc-epo-style-wrapper input[type="radio"]:checked + .tm-epo-style::after { opacity: 1; } .tc-epo-style-wrapper { height: 2em; width: 2em; position: relative; display: inline-block; vertical-align: middle; } .tm-epo-style::after { content: "\f00c"; background: transparent none repeat scroll 0 0; font-family: tc-fontawesome, sans-serif !important; font-weight: 900; height: 1em !important; left: 50%; margin-left: -0.5em; margin-top: -0.5em; opacity: 0; position: absolute !important; display: inline-block !important; text-align: center !important; top: 50% !important; width: 1em !important; color: inherit !important; font-size: inherit !important; bottom: auto !important; line-height: 1 !important; } .tc-epo-style-wrapper input[type="radio"] + .tm-epo-style::after { content: "\f111"; } .tm-epo-style:hover::after { opacity: 0.5; } .tc-epo-style-wrapper.round2, .tc-epo-style-wrapper.square2 { height: 1em; width: 1em; padding: 5px; vertical-align: middle; } .tm-epo-style.round2, .tm-epo-style.square2 { height: 100%; width: 100%; background: transparent none repeat scroll 0 0; border: 2px solid; cursor: pointer; left: 0; line-height: 1; margin: 0; padding: 0; position: absolute; top: 0; } .tc-epo-style-wrapper.round2 .tm-epo-style::after, .tc-epo-style-wrapper.square2 .tm-epo-style::after { font-size: 0.7em !important; } .tm-epo-style.round, .tm-epo-style.square { background: transparent none repeat scroll 0 0; border: 1px solid; cursor: pointer; height: 2em; left: 0; line-height: 1; margin: 0; padding: 0; position: absolute; top: 0; width: 2em; } .tm-epo-style.round, .tm-epo-style.round2 { border-radius: 100%; } /* 11. Checkbox and Radio button swatches */ .tc-epo-text-wrapper { border-style: solid; border-width: 1px; cursor: pointer; padding: 0.5em 1em; display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap.tc-mode-text span.tc-price-wrap { margin: 0.5em 0; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap .tc-epo-text-wrapper .tm-label { padding: 0 !important; } .tc-epo-text-wrapper input[type="checkbox"].tm-epo-field, .tc-epo-text-wrapper input[type="radio"].tm-epo-field { visibility: hidden; position: absolute; display: inline !important; } .tmhexcolorimage { display: block !important; height: 100% !important; max-height: 100% !important; max-width: 100% !important; width: 100%; } .tm-floating-box .tmhexcolorimage { min-width: 50px !important; min-height: 50px !important; } .tm-floating-box .radio-image-label, .tm-floating-box .checkbox-image-label { text-align: initial; } .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-color .tmhexcolorimage, .tm-extra-product-options ul.tmcp-ul-wrap.tm-variation-ul-image .tmhexcolorimage, .tc-images-container .tmhexcolorimage, .tc-colors-container .tmhexcolorimage { width: 100% !important; height: auto !important; padding-top: 100% !important; vertical-align: middle; } .tm-transparent-swatch, .tm-extra-product-options .radio-image.tm-transparent-swatch, .tm-extra-product-options .checkbox-image.tm-transparent-swatch { border: 1px dotted; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap input.use_images + label { display: inline-block; padding: 0 !important; max-width: 100%; border: 0 solid; position: relative; line-height: 0; margin: 0 !important; height: auto !important; background: none !important; } .tm-extra-product-options .tmcp-field-wrap .tc-epo-text-wrapper.round { border-radius: 5px; border-width: 1px; box-shadow: none; } .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.radio-image.round, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.checkbox-image.round, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.radio-image.round, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.checkbox-image.round { border-radius: 100%; border-width: 1px; box-shadow: none; } .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-epo-text-wrapper.square, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.radio-image.square, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.checkbox-image.square, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.radio-image.square, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.checkbox-image.square { border-radius: 0; box-shadow: none; border-width: 2px; } .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-epo-text-wrapper.shadow, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.radio-image.shadow, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.checkbox-image.shadow, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.radio-image.shadow, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.checkbox-image.shadow { box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5); border-width: 1px; } .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-epo-text-wrapper.thinline, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.radio-image.thinline, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap img.checkbox-image.thinline, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.radio-image.thinline, .tm-extra-product-options .tmcp-field-wrap.tc-active .tc-label-wrap .tmhexcolorimage.checkbox-image.thinline { border-width: 1px; border-radius: 0; box-shadow: none; } .tm-extra-product-options input.use_images + label + .amount { display: block; text-align: center; } .radio-image-label-inline, .checkbox-image-label-inline { display: inline; margin: 0 0.5em; } .tc-label.tm-label .radio-image-label + .tmhexcolorimage, .tc-label.tm-label .checkbox-image-label + .tmhexcolorimage { vertical-align: middle; } .tm-hide-label + .radio-image-label, .tm-hide-label + * + .radio-image-label, .tm-hide-label + .checkbox-image-label, .tm-hide-label + * + .checkbox-image-label { display: none !important; } .tm-bottom-label + .radio-image-label, .tm-bottom-label + * + .radio-image-label, .tm-bottom-label + .checkbox-image-label, .tm-bottom-label + * + .checkbox-image-label { padding: 0.5em 0; } .tm-inside-label + .radio-image-label, .tm-inside-label + * + .radio-image-label, .tm-inside-label + .checkbox-image-label, .tm-inside-label + * + .checkbox-image-label { left: 0; padding: 0; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); word-wrap: break-word; white-space: nowrap; } /* 12. Product element */ .tc-epo-element-product-holder { border: 0; margin: 1em 0; padding: 0; } li.tc-epo-element-product-holder { flex-wrap: wrap; } .tc-epo-element-product-container-wrap { margin: 1em 0 0 0; } .tc-epo-element-product-container-wrap:empty { margin: 0; } .tc-epo-element-product-container { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: start; -moz-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify !important; -moz-box-pack: justify !important; -ms-flex-pack: justify !important; -webkit-justify-content: space-between !important; justify-content: space-between !important; } .tc-epo-element-product-container-left { width: 20%; -ms-flex: 0 0 20%; flex: 0 0 20%; } .tc-epo-element-product-container-right { width: 76%; -ms-flex: 0 0 76%; flex: 0 0 76%; margin-left: 4%; } .tc-epo-element-product-container-full { width: 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; margin: 0; } .tc-epo-element-product-container-wrap .product-title, .tc-epo-element-product-container-wrap .product-price, .tc-epo-element-product-container-wrap .product-description, .tc-epo-element-product-container-wrap .product-meta, .tc-epo-element-product-container-wrap .tc-extra-product-options-inline { margin: 0 0 1em; padding: 0; } .tc-epo-element-product-container-wrap .tm-quantity, .tc-epo-element-product-container-wrap .tm-quantity-alt { max-width: none; } .tm-extra-product-options .tc-epo-element-product-container-wrap .tc-epo-element-product-container-cart .tm-quantity-alt .quantity { float: none; display: inline-block; font-size: inherit; } .tm-extra-product-options .cpf-type-product-radio ul.tmcp-ul-wrap.tm-element-ul-product > li.tc-epo-element-product-li-container, .tm-extra-product-options .cpf-type-product-dropdown ul.tmcp-ul-wrap.tm-element-ul-product > li.tc-epo-element-product-li-container { padding: 0.5em 0.5em 0 0; margin: 0; width: 100%; float: left; list-style: none outside none !important; position: relative; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tc-epo-element-product-li-container, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tc-epo-element-product-li-container { padding: 1em var(--tcgap); max-width: 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; list-style: none outside none !important; position: relative; margin: 0; box-sizing: border-box; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap label, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap label { cursor: pointer; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap .tm-epo-field.tmcp-radio, .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap .tc-epo-style-wrapper, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap > label .tm-epo-field.tmcp-checkbox, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap > label .tc-epo-style-wrapper { display: none; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-align: stretch !important; align-items: stretch; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: flex-start !important; justify-content: flex-start !important; margin: 0 calc(-0.5 * var(--tcgap)); float: none; max-width: none; width: auto; box-sizing: border-box; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap { text-align: center; max-width: 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; margin: 0; padding: calc(0.5 * var(--tcgap)); box-sizing: border-box; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap .tm-epo-reset-radio { right: var(--tcgap); top: var(--tcgap); } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap img.wp-post-image, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap img.wp-post-image { max-width: 100%; height: auto; margin: 0 auto; display: block; width: 100%; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap .tc-label-wrap, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap > label .tc-label-wrap { margin: 1em 0 0 0; display: block; } .tm-extra-product-options .cpf-type-product-thumbnail ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap .tm-epo-field-label, .tm-extra-product-options .cpf-type-product-thumbnailmultiple ul.tmcp-ul-wrap.tm-element-ul-product > li.tmcp-field-wrap > label.tm-epo-field-label { width: 100%; box-sizing: border-box; } .tm-extra-product-options .tc-epo-element-product-container-wrap .product-meta { margin: 1em 0 0 0; } .tc-epo-element-variable-product { margin: 1em 0; } table.tc-epo-element-variations { margin: 1em 0; } .woocommerce table.tc-epo-element-variations { margin-bottom: 1em; border: 0; width: 100%; } .woocommerce table.tc-epo-element-variations td, .woocommerce table.tc-epo-element-variations th { border: 0; vertical-align: top; line-height: 2; } .woocommerce table.tc-epo-element-variations label { font-weight: 700; } .woocommerce table.tc-epo-element-variations select { max-width: 100%; min-width: 75%; display: inline-block; margin-right: 1em; } .woocommerce table.tc-epo-element-variations td.label { padding-right: 1em; } .woocommerce .tc-epo-element-variable-product .woocommerce-variation-description p { margin-bottom: 1em; } .woocommerce .tc-epo-element-variable-product .tc-epo-element-variable-reset-variations { visibility: hidden; font-size: 0.83em; } .woocommerce .tc-epo-element-variable-product .wc-no-matching-variations { display: none; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap.tc-product-hidden { display: none; } .tc-product-image { margin: 0; } /* 13. Tooltip */ #tm-tooltip { font-size: 0.875em; text-align: center; text-shadow: 0 1px rgba(0, 0, 0, 0.5); line-height: 1.5; color: #fff; background: #333; background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.8)); border-radius: 5px; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3); position: absolute; z-index: 145400; padding: 15px; pointer-events: none; bottom: auto !important; } #tm-tooltip::after { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #333; content: ""; position: absolute; left: 50%; bottom: -10px; margin-left: -10px; } #tm-tooltip.top::after { border-top-color: transparent; border-bottom: 10px solid #333; border-bottom-color: rgba(0, 0, 0, 0.6); top: -20px; bottom: auto; } #tm-tooltip.left::after { left: 10px; margin: 0; } #tm-tooltip.right::after { right: 10px; left: auto; margin: 0; } #tm-tooltip img { max-width: 100%; } .tc-tooltip { color: #2980b9; cursor: help; font-size: 1.25em; margin-right: 0.5em; margin-left: 0.5em; } .tc-tooltip.tc-tooltip-left { margin-right: 0.5em; margin-left: 0; } .tc-tooltip.tc-tooltip-right { margin-left: 0.5em; margin-right: 0; } .tm-extra-product-options .tc-epo-label.tm-tooltip { display: inline-block; width: auto; } .tc-icontooltipleft.tm-tooltip { margin-left: 0; margin-right: 0.5em; } #tm-tooltip.tc-error { background: #ff4500; border-color: #ff4500; color: #fff; } #tm-tooltip.tc-error::after { border-top-color: #ff4500; } #tm-tooltip.tc-error.top::after { border-bottom-color: #ff4500; } .tm-extra-product-options ul.tmcp-ul-wrap li.tmcp-field-wrap .tc-tooltip, .tm-extra-product-options ul.tmcp-ul-wrap .tc-field-display .tc-tooltip { align-self: center; } /* 14. Cart and Order styles */ .woocommerce #content table.cart img.epo-option-image, .woocommerce table.cart img.epo-option-image, .woocommerce-page #content table.cart img.epo-option-image, .woocommerce-page table.cart img.epo-option-image, .epo-option-image { max-height: 100px; max-width: 70% !important; height: auto !important; width: auto !important; display: block; } .woocommerce-mini-cart img.epo-upload-image, .woocommerce #content table.cart img.epo-upload-image, .woocommerce table.cart img.epo-upload-image, .woocommerce-page #content table.cart img.epo-upload-image, .woocommerce-page table.cart img.epo-upload-image, .epo-upload-image { max-height: none !important; max-width: 70% !important; width: auto !important; height: 100% !important; } .woocommerce td.product-name dl.variation dt.tc-hidden-variation { margin: 0; } .tc-row.tm-cart-row { float: left; padding: 2%; width: 100%; border-color: #999; border-radius: 0; border-style: none none dotted; border-width: 0 0 1px; } .tc-row.tm-cart-row:last-child { border: 0 none; } .tc-row.tm-cart-row .tc-cell { margin: 0; } .tc-row.tm-cart-row .tc-cell.cpf-name { font-weight: 700; } .woocommerce td.product-name dl.variation.tc-epo-metadata .tc-hidden-variation { display: none; } .cpf-img-on-cart img { margin-right: 0.5em; position: static !important; height: auto !important; width: auto !important; max-height: 3em; } .cpf-data-on-cart::before { content: "\f14a"; font-family: tc-fontawesome, sans-serif; font-weight: 900; margin-right: 0.5em; vertical-align: middle; } .cpf-img-on-cart .cpf-data-on-cart::before { content: ""; display: none; } .cpf-data-on-cart, .cpf-img-on-cart { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; border-bottom: 1px dotted rgba(0, 0, 0, 0.2); margin-bottom: 0.5em; width: 100%; align-items: baseline; } .cpf-img-on-cart { align-items: center; border: 0; } .cpf-data-on-cart:last-of-type, .cpf-img-on-cart:last-of-type { border-bottom: 0; margin-bottom: 0; } .woocommerce-mini-cart .cpf-img-on-cart img { max-width: 50px !important; } .cpf-color-on-cart { width: 1em; height: 1em; display: inline-block; border: 1px solid; } td.product-name a.tm-cart-edit-options, .tm-cart-edit-options { display: block; font-size: 0.7em; font-style: italic; font-weight: 700; } .tm-epo-cart-option-mobile { display: none; } .shop_table tbody tr.tm-epo-cart-row { height: auto; } .woocommerce table.shop_table .tm-epo-cart-row td { border-top: 1px dashed rgba(0, 0, 0, 0.1); } .tm-epo-cart-option-label, .tm-epo-cart-option-value.tm-epo-cart-no-label { font-weight: 700; } .woocommerce table.shop_table .tm-epo-cart-row-product td { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .woocommerce table.shop_table .tm-epo-cart-row-product + .tm-epo-cart-row td { border-top: 0 none; } .woocommerce table.shop_table_responsive tr.tm-epo-cart-row td::before, .woocommerce-page table.shop_table_responsive tr.tm-epo-cart-row td::before { display: none !important; } .tc-price-in-cart, .tc-quantity-in-cart { font-size: smaller; } .tc-associated-table-product .tc-associated-table-product-indent { padding-left: 2em; display: inline-block; } .tc-associated-table-product .tc-associated-table-product-price::before { font-family: tc-fontawesome, sans-serif; font-size: 1em; content: "\f30b"; font-weight: 900; margin: 0 0.5em 0 0; padding: 0; opacity: 0.3; } .tc-associated-table-product-name { font-weight: 700; } /* 15. Various styles */ .tm-dpd-label { display: block; font-size: 80%; } .tm-animated { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; } .tc-chars { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end !important; -moz-box-pack: end !important; -ms-flex-pack: end !important; -webkit-justify-content: flex-end !important; justify-content: flex-end !important; font-size: 9px; padding: 0.5em 0; } .tc-chars-remanining { margin: 0 0.5em; } .tm-button { border-radius: 3px; border-style: solid; border-width: 1px; cursor: pointer; display: inline-block; font-size: 13px !important; margin: 0; height: 30px; line-height: 28px !important; padding: 0 12px 2px !important; text-decoration: none; white-space: nowrap; background: none repeat scroll 0 0 #f7f7f7; border-color: #ccc; box-shadow: 0 1px 0 #fff inset, 0 1px 0 rgba(0, 0, 0, 0.08); color: #555; vertical-align: top; } .tm-button:hover { background: none repeat scroll 0 0 #fafafa; border-color: #999; color: #222; } .tc-hide-add-to-cart-button { display: none !important; } .tc-clearfix::after { content: ""; display: block; height: 0; clear: both; visibility: hidden; overflow: hidden; } .tm-preloader-img { position: absolute !important; z-index: 2; opacity: 0.6; } button.tmicon { display: inline-block; left: auto !important; position: relative; right: auto !important; overflow: hidden; width: 30px !important; height: 30px !important; line-height: 30px !important; font-size: 14px; text-align: center; cursor: pointer; vertical-align: middle; margin: 0; padding: 0; flex-shrink: 0; background: none; border: none; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } button.tmicon.delete { color: #ff4500; border-radius: 100%; } button.tmicon.delete:hover { color: #fff; background: #ff4500; } .pointereventsoff { pointer-events: none; } .tm-hide { visibility: hidden !important; padding: 0 !important; height: 0 !important; width: 0 !important; margin: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; } .tm-show { display: block !important; } @-webkit-keyframes appear { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes appear { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes appear { 0% { opacity: 0; } 100% { opacity: 1; } } .appear { -webkit-animation-name: appear; -moz-animation-name: appear; -ms-animation-name: appear; -o-animation-name: appear; animation-name: appear; } .tc-tabs.tc-cell { margin-bottom: 0; } .has-scroll-arrows.tc-tab-headers { padding: 0; max-width: calc(100% - 4em - 1px) !important; left: 2em; } .tc-tabs-wrap .tc-row .tc-cell:last-of-type { margin-bottom: 0; } .tc-tab-headers-wrap { position: relative; } .tc-scroll-left-arrow, .tc-scroll-right-arrow { position: absolute; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; display: none; cursor: pointer; padding: 0; line-height: 1; width: 1em; text-align: center; height: 100%; top: 0; z-index: 2; } .tc-scroll-left-arrow.scroll-arrow-show, .tc-scroll-right-arrow.scroll-arrow-show { display: block; border: 1px solid; height: calc(100% - 2px); width: calc(2em - 1px); } .tc-scroll-left-arrow { left: 0; } .tc-scroll-right-arrow { right: 0; } .tc-scroll-left-arrow::before, .tc-scroll-right-arrow::before { line-height: 1; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); top: 50%; padding: 0; margin: 0; position: absolute; left: 0; right: 0; } .tc-scroll-left-arrow::before { content: "\25C0"; } .tc-scroll-right-arrow::before { content: "\25B6"; } .tc-tab-headers { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center; gap: 1em; margin: 0; padding: 0; overflow: hidden !important; position: relative; width: 100%; min-height: 1px; } .tab-header { font-weight: 400; cursor: pointer; white-space: nowrap; padding: var(--tcgap); position: relative; margin: 0; } .tab-header.open { border-width: 1px 1px 0 1px; border-style: solid; } .tab-header.open::before, .tab-header.open::after { content: ""; display: block; position: absolute; border-bottom: 1px solid; bottom: 0; height: 0; width: 999em; box-sizing: border-box; } .tab-header.open::before { right: 100%; } .tab-header.open::after { left: 100%; } .tc-tab-content.tcwidth-100 { padding: var(--tcgap); border-width: 0 1px 1px 1px; border-style: solid; } .tc-tab-header { flex-shrink: 0; } .tab-header.open, .tab-header.open:focus { font-weight: 700; } /* 16. Theme fixes */ /* nielsen theme fix */ .tc-extra-product-options .sbHolder .sbSelector { background-color: #fff; height: 35px; padding: 5px 10px; } /* Aurum theme fix */ .tc-images-container .replaced-checkboxes + label::before, .tc-images-container .replaced-radio-buttons + label::before, .replaced-checkboxes + label.tm-epo-style::before, .replaced-radio-buttons + label.tm-epo-style::before { display: none; } /* Salient minimal form fix */ body[data-form-style="minimal"] .tc-extra-product-options .minimal-form-input label { pointer-events: auto !important; } /* Woomart theme quick shop view fix */ .has-options .quick-shop-wrapper .woocommerce-variation-add-to-cart { display: block !important; width: 100%; max-width: 100%; padding: 0; margin: 0; } /* Elementor and theme fixes */ .thb-product-main-row .summary form.cart, .woocommerce .oxy-woo-element div.product.tm-has-options .woocommerce-variation-add-to-cart, .tm-has-options .fullwidth-button .cart:not(.variations_form), .tm-has-options .fullwidth-button .woocommerce-variation-add-to-cart.variations_button, .single-product div.product.tm-has-options form.cart, .single-product div.product.tm-has-options .single-button-wrapper, .single-product div.product.tm-has-options .entry-summary form.cart:not(.variations_form):not(.grouped_form), .single-product div.product.tm-has-options .variations_button, .woocommerce div.product.elementor.tm-has-options form.cart.variations_form .woocommerce-variation-add-to-cart, .woocommerce div.product.elementor.tm-has-options form.cart:not(.grouped_form):not(.variations_form), .woocommerce .oxy-woo-element div.product.tm-variations-only .woocommerce-variation-add-to-cart, .tm-variations-only .fullwidth-button .cart:not(.variations_form), .tm-variations-only .fullwidth-button .woocommerce-variation-add-to-cart.variations_button, .single-product div.product.tm-variations-only form.cart, .single-product div.product.tm-variations-only .single-button-wrapper, .single-product div.product.tm-variations-only .entry-summary form.cart:not(.variations_form):not(.grouped_form), .single-product div.product.tm-variations-only .variations_button, .woocommerce div.product.elementor.tm-variations-only form.cart.variations_form .woocommerce-variation-add-to-cart, .woocommerce div.product.elementor.tm-variations-only form.cart:not(.grouped_form):not(.variations_form) { -ms-flex-wrap: wrap !important; flex-wrap: wrap !important; max-width: 100%; }