.component { page-break-inside: avoid; page-break-before:auto; max-width: 10000px; line-height: 1.0em; } .container > header { } .container > header h1 { margin: auto; } .container > header span { display: block; opacity: 0.0; } table { margin-top:-1px; border-collapse: collapse; width: 100%; background: #fff; } td, th { border-bottom-style:dotted; border-bottom-width:1px; border-bottom-color:LightGray; border-left-style:none; border-right-style:none; border-top-style:dotted; border-top-width:1px; border-top-color:LightGray; padding-bottom:0.1em; padding-left:0.1em; padding-right:0.1em; padding-top:0.1em; vertical-align:middle; text-align: center; } tbody th { background-color: #f5f5f5; } tbody tr:nth-child(2n-1) { background-color: #f5f5f5; transition: all .125s ease-in-out; } tbody tr:hover { background-color: rgba(129,208,177,.3); } .sticky-wrap { overflow-x: auto; overflow-y: hidden; position: relative; } .sticky-wrap .sticky-thead, .sticky-wrap .sticky-col, .sticky-wrap .sticky-intersect { opacity: 0; position: relative; top: 0; left: 0; z-index: 50; width: auto; } .sticky-wrap .sticky-thead { z-index: 100; width: 100%; } .sticky-wrap .sticky-intersect { opacity: 1; z-index: 150; } .sticky-wrap .sticky-intersect th { } .sticky-wrap td, .sticky-wrap th { box-sizing: border-box; } .sticky-wrap.overflow-y { overflow-y: auto; max-height: 60vh; }