@font-face { font-family: 'Huba Certification'; font-style: normal; font-weight: Regular; src: url('../fonts/HubaCertification-Regular-SVG.ttf') format('truetype'); } @font-face { font-family: 'Huba Certification'; font-style: normal; font-weight: Small; src: url('../fonts/HubaCertification-Small-SVG.ttf') format('truetype'); } .application-task-tab { display: flex; flex-direction: column; align-items: stretch; width: 100%; } .application-task-tab-head { display: block; width: 100%; max-width: 1000px; margin: 0 0 2rem 0; flex: 0 0 auto; } .application-task-tab-body { display: block; width: 100%; flex: 0 0 auto; } .application-container { padding-top: 0.5rem; } .application-task-tab-title, .application-svg-tab-title { font-size: 1.3rem; font-weight: 600; line-height: 1.2; color: #000; } .application-task-tab-title { padding-bottom: 1rem; } .application-task-tab-title-no-description { padding-bottom: 0; } .application-task-tab-description { line-height: 1.55; color: #000; } .application-task-tab-description p:first-child, .application-task-tab-description h3:first-child, .application-task-tab-description h4:first-child, .application-task-tab-description ul:first-child { padding-top: 0; } .application-task-grid { width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 1rem; padding-top: 1rem; } .application-task-tile { display: grid; grid-template-rows: auto auto auto 1fr auto; gap: 0.85rem; align-items: start; text-decoration: none; color: inherit; padding: 1.1rem 1rem 1rem 1rem; background: #ebebeb; border-radius: 3px; transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out; } .application-task-tile:hover { transform: scale(1.02); background: #f6f6f6; } .application-task-tile-head { display: grid; gap: 1px; align-content: center; } .application-task-tile-title, .application-task-tile-subline { font-weight: 600; line-height: 1.2; text-align: left; border-radius: 3px; padding: 0.5rem; } .application-task-tile-title { font-size: 1.1rem; color: #fff; background: #9abacc; } .application-task-tile-title:hover { color: #fff; } .application-task-tile-subline { font-size: 0.95rem; color: #000; background: #c8c8c8; } .application-task-tile-image { display: flex; justify-content: center; align-items: center; min-height: 170px; } .application-task-tile-image ._bn { margin-bottom: 0; } .application-task-tile-image ._ve { max-width: 200px; max-height: 170px; width: auto; height: auto; } .application-task-tile-rangeTable { display: grid; gap: 1px; } .application-task-tile-rangeRow { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; } .application-task-tile-rangeRow:first-child .application-task-tile-rangeHeader, .application-task-tile-rangeRow:first-child .application-task-tile-rangeValue { background: #c8c8c8; } .application-task-tile-rangeRow:last-child .application-task-tile-rangeHeader, .application-task-tile-rangeRow:last-child .application-task-tile-rangeValue { background: #d8d8d8; } .application-task-tile-rangeHeader { font-size: 0.84rem; font-weight: 600; line-height: 1.1; color: #000; padding: 0.4rem; } .application-task-tile-rangeValue { font-size: 0.84rem; font-weight: 300; line-height: 1.2; color: #000; padding: 0.4rem; } .application-task-tile-icons, .application-task-tile-icons:hover { text-align: left; line-height: 1.2; font-size: 2.1rem; font-family: "Huba Certification", "SourceSansPro", sans-serif; color: #000; align-self: end; } .application-task-benefit-layout { display: grid; gap: 1.5rem; width: 100%; } .application-task-benefit-row { display: block; width: 100%; } .application-task-benefit-row-inner { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 2rem; align-items: start; width: 100%; } .application-task-benefit-sensor { display: block; } .application-task-benefit-benefits { display: block; width: 100%; align-self: start; padding-top: 0.5rem; padding-bottom: 1.5rem; } .application-task-benefit-list-wrapper { display: block; width: 100%; } .application-task-benefit-list-wrapper-empty { min-height: 1rem; } .application-task-benefit-list { list-style: none; margin: 0; padding: 0 0 0 1.2rem; display: grid; width: 100%; } .application-task-benefit-list-item { position: relative; padding-left: 1.1rem; line-height: 1.55; text-align: left; } .application-task-benefit-list-item::before { content: "•"; position: absolute; left: 0; top: 0; color: #e30613; } .application-oem-tab-content { max-width: 1000px; } @media (max-width: 900px) { .application-task-benefit-row-inner { grid-template-columns: 1fr; gap: 1rem; } } @media (max-width: 700px) { .application-task-grid { grid-template-columns: 1fr; } .application-task-tile-head { min-height: 1em; } }