@font-face {
  font-family: 'Sheet';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('hdpe-sheet.woff') format('woff');
}
* { box-sizing: border-box; }
body { margin: 0; padding: 0; background-color: black; font-family: Arial; }
#bg { position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: -1; background-image: url('hdpe-sheet-bg.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat; }
#nav { display: table; width: 100%; }
#nav a { display: table-cell; text-align: center; vertical-align: middle; background: rgba(235,235,255,0.75); font-family: 'Sheet'; font-weight: bold; text-decoration: none; color: black !important; transition: background 0.25s; }
#nav a:hover { background: white; }
@media screen and (min-width: 1401px) {
 #nav { border-spacing: 2vw; }
 #nav span { display: contents; }
 #nav a { width: 12.5%; height: 10vw; }
 #nav h4 { padding-bottom: 15px; font-size: 1vw; }
 #nav svg { width: 40%; }
 #content { margin: 0.2vw 2vw 0 2vw; }
}
@media screen and (min-width: 901px) and (max-width: 1400px) {
 #nav { border-spacing: 3vw; }
 #nav > span { display: table-row; }
 #nav span span { display: contents; }
 #nav a { width: 25%; height: 12vw; }
 #nav h4 { padding-bottom: 1vw; font-size: 1.5vw; }
 #nav svg { height: 50%; }
 #content { margin: 0.3vw 3vw 0 3vw; }
}
@media screen and (max-width: 900px) {
 #nav { border-spacing: 3vw; }
 #nav > span { display: contents; }
 #nav span span { display: table-row; }
 #nav a { width: 50%; height: 18vw; }
 #nav h4 { padding-bottom: 1vw; font-size: 3vw; }
 #nav svg { height: 50%; }
 #content { margin: 0.3vw 3vw 0 3vw; }
}
#cbtns a { background: #005; color: white !important; text-decoration: none; font-family: 'Sheet'; font-size: 15px; margin: 5px; padding: 3px 12px; border-radius: 5px; }
#cbtns a:hover { background: #014BC4; }
h1, h2, h3, h4 { margin: 0; }
h1, h2 { font-family: 'Sheet', Arial; font-size: 32px; margin-bottom: 36px !important; color: #005; }
#content { font-size: 18px; background: rgba(235,235,255,0.75); }
.aside { text-align: right; font-size: 10pt; font-family: Tahoma, Arial; font-weight: bold; }
.products { border-spacing: 5px; width: 1px; min-width: 350px; }
.products td, .products th { padding: 6px 12px; text-align: center; font-size: 16px; }
.products th, .products tr+tr > td:not([colspan]) { white-space: nowrap; }
.products tr:nth-child(odd) td { background-color: white; }
.products tr:nth-child(even) td { background-color: rgb(225,225,255); }
.products tr:first-child td, .products tr:first-child td *, .products th { background-color: rgb(0,30,90) !important; color: white !important; font-weight: bold; }
.products a { color: rgb(0,0,180) !important; }
.products th a { color: white !important; }
.products a[href$='.jpg'], .products a[href$='.JPG'], .products a[href$='.png'], .products a[href$='.PNG'] { padding-right: 22px; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 548.176 548.176'%3E%3Cpath d='M534.75,68.238c-8.945-8.945-19.694-13.417-32.261-13.417H45.681c-12.562,0-23.313,4.471-32.264,13.417 C4.471,77.185,0,87.936,0,100.499v347.173c0,12.566,4.471,23.318,13.417,32.264c8.951,8.946,19.702,13.419,32.264,13.419h456.815 c12.56,0,23.312-4.473,32.258-13.419c8.945-8.945,13.422-19.697,13.422-32.264V100.499 C548.176,87.936,543.699,77.185,534.75,68.238z M511.623,447.672c0,2.478-0.899,4.613-2.707,6.427 c-1.81,1.8-3.952,2.703-6.427,2.703H45.681c-2.473,0-4.615-0.903-6.423-2.703c-1.807-1.813-2.712-3.949-2.712-6.427V100.495 c0-2.474,0.902-4.611,2.712-6.423c1.809-1.803,3.951-2.708,6.423-2.708h456.815c2.471,0,4.613,0.905,6.42,2.708 c1.801,1.812,2.707,3.949,2.707,6.423V447.672L511.623,447.672z'/%3E%3Cpath d='M127.91,237.541c15.229,0,28.171-5.327,38.831-15.987c10.657-10.66,15.987-23.601,15.987-38.826 c0-15.23-5.333-28.171-15.987-38.832c-10.66-10.656-23.603-15.986-38.831-15.986c-15.227,0-28.168,5.33-38.828,15.986 c-10.656,10.66-15.986,23.601-15.986,38.832c0,15.225,5.327,28.169,15.986,38.826C99.742,232.211,112.683,237.541,127.91,237.541z'/%3E%3Cpolygon points='210.134,319.765 164.452,274.088 73.092,365.447 73.092,420.267 475.085,420.267 475.085,292.36 356.315,173.587'/%3E%3C/svg%3E") center right no-repeat; }
#footer { text-align: center; margin: 24px; color: white; }
#footer a { margin: 0 5px 12px 5px; font-family: 'Sheet', Arial; font-size: 18px; color: deepskyblue !important; }
@media screen and (min-width: 576px) {
 #content { padding: 40px; }
}
@media screen and (max-width: 575px) {
 #content { padding: 20px; }
 #footer a { font-size: 24px; display: block; }
}