body {
     font-family: 'Helvetica Compressed';
     color: #444444;
     font-size: 17pt;
     background-color: white;
     font-weight: bold;
     letter-spacing: -2px;
     line-height: 35px;
}

.color-list {
  position: relative;
  box-sizing: border-box;
}

.color-list .color-indicator {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  box-sizing: border-box;
  background-color: #ee1973;
  padding-right: 20px;
  pointer-events: none;
  transition: left 260ms cubic-bezier(.2,.9,.3,1), width 260ms cubic-bezier(.2,.9,.3,1);
  z-index: 1;
  white-space: nowrap;
  display: block;
}

.color-list .color-indicator::after {
  content: '';
  position: absolute;
  right: -10px;
  top: 10px;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid #EE1973;
  pointer-events: none;
}

.color-list a {
  position: relative;
  z-index: 2;
}

.color-list a.selected,
.color-list a:hover {
  color: white !important;
}

.color-list a:not(.selected):not(:hover) {
  color: unset;
}

 @font-face {
     font-family: 'Helvetica Compressed';
     font-style: normal;
     font-weight: normal;
     src: local('Helvetica Compressed'), url('/liaz/HelveticaNeue-HeavyExt.otf') format('woff');
}
 .container {
     margin: auto;
     width: 1240px;
}
 .content {
     width: 1180px;
     margin: auto;
     margin-top: 40px;
     margin-bottom: 20px;
     padding-top: 20px;
}
 .bar {
     width: 195px;
     height: 25px;
     background-color: #383839;
     border-radius: 1px;
     display: inline-block;
}
 .dots-thingy {
     position: relative;
}
 .dot {
     position: absolute;
     width: 30px;
     height: 8px;
     background-color: #383839;
     border-radius: 1px;
}
 .dot.left {
     left: 50%;
     margin-left: -15px;
}
 .dot.center {
     text-align: center;
}
 .grey-900 {
     color: #58585A !important;
}
 .grey-800 {
     color: #6D6E70 !important;
}
 .grey-700 {
     color: #818285 !important;
}
 .grey-600 {
     color: #939598 !important;
}
 .grey-500 {
     color: #A7A9AC !important;
}
 .black {
     color: black !important;
}
 .pink-border {
     border: 3px solid #ED1890;
     padding: 25px;
     border-radius: 2px;
     height: 357px;
}
 .less-bold {
     line-height: 25px;
     font-family: 'Helvetica';
     font-size: 31px;
}
 .summary-section {
     padding-left: 10px;
}
 .even-less-bold {
     line-height: 25px;
     font-family: 'Helvetica';
     font-size: 23px;
     font-weight: lighter;
}
 .dot.right {
     right: 0px;
}
 h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td {
     margin: 0;
     padding: 0;
     border: 0;
     display:inline-block;
}
/* flex stuff */
 .flex {
     display: flex;
}
 .col-1 {
     flex: 1;
}
 .col-2 {
     flex: 2;
}
 .col-3 {
     flex: 3;
}
 .col-4 {
     flex: 4;
}
/* margin sides 10 */
 .inline-block {
     display: inline-block;
}
 .mt-10 {
     margin-top: 10px;
}
 .ml-10 {
     margin-left: 10px;
}
 .mr-10 {
     margin-right: 10px;
}
 .mb-10 {
     margin-bottom: 10px;
}
 .m-10 {
     margin: 10px;
}
/* margin sides 5 */
 .mt-1 {
     margin-top: 1px;
}
 .mt-2 {
     margin-top: 2px;
}
 .mt-3 {
     margin-top: 3px;
}
 .mt-4 {
     margin-top: 4px;
}
 .mt-5 {
     margin-top: 5px;
}
 .ml-5 {
     margin-left: 5px;
}
 .mr-5 {
     margin-right: 5px;
}
 .mb-5 {
     margin-bottom: 5px;
}
 .m-5 {
     margin: 5px;
}
/* margin sides 5 */
 .mt-0 {
     margin-top: 0px;
}
 .ml-0 {
     margin-left: 0px;
}
 .mr-0 {
     margin-right: 0px;
}
 .mb-0 {
     margin-bottom: 0px;
}
 .m-0 {
     margin: 0px;
}
/* width increments of 16 */
 .w-8 {
     width: 8px 
}
 .w-16 {
     width: 16px 
}
 .w-32 {
     width: 32px 
}
 .w-50 {
     width: 50px 
}
 .w-64 {
     width: 64px 
}
 .w-128 {
     width: 128px 
}
 .w-256 {
     width: 256px 
}
 .w-512 {
     width: 512px 
}
 .w-1024 {
     width: 1024px 
}
/* height increments of 16 */
 .h-8 {
     height: 8px 
}
 .h-16 {
     height: 16px 
}
 .h-32 {
     height: 32px 
}
 .h-50 {
     height: 50px 
}
 .h-64 {
     height: 64px 
}
 .h-128 {
     height: 128px 
}
 .h-256 {
     height: 256px 
}
 .h-512 {
     height: 512px 
}
 .h-1024 {
     height: 1024px 
}